|
|
@@ -1,524 +1,548 @@
|
|
|
<template>
|
|
|
- <div class="tabDiv">
|
|
|
- <el-row>
|
|
|
- <el-col>
|
|
|
- <!-- 时间，切换 -->
|
|
|
- <!--<div class="filter-container">
|
|
|
- <span>
|
|
|
- <span>{{$t("runCenter.searchForm.shuoming")}}：</span>
|
|
|
- <el-radio-group v-model="cuurentDate" size="small">
|
|
|
- <el-radio-button label="week">{{$t("runCenter.common.week")}}</el-radio-button>
|
|
|
- <el-radio-button label="day">{{$t("runCenter.common.day")}}</el-radio-button>
|
|
|
- </el-radio-group>
|
|
|
- </span>
|
|
|
- </div>-->
|
|
|
- <!-- 主要内容 -->
|
|
|
- <el-table
|
|
|
- :key="tableKey"
|
|
|
- ref="table"
|
|
|
- v-loading="loading"
|
|
|
- :data="tableData.data"
|
|
|
- fit
|
|
|
- class="noPaddingTable"
|
|
|
- style="width: 100%;"
|
|
|
- >
|
|
|
- <el-table-column label="基础信息" align="center" fixed="left" width="350">
|
|
|
- <!-- 序号 -->
|
|
|
- <el-table-column :label='$t("common.serialNo")' width="50px" align="center">
|
|
|
- <template slot-scope="scope">
|
|
|
- <div>
|
|
|
- {{scope.$index+(queryParams.current - 1) * queryParams.size + 1}}
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <!-- 编号 -->
|
|
|
- <el-table-column prop="code" label='编号' :show-overflow-tooltip="true" width="100px"></el-table-column>
|
|
|
- <!-- 生产资源名称 -->
|
|
|
- <el-table-column prop="name" label='生产资源名称' :show-overflow-tooltip="true" width="200px"></el-table-column>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- v-for="item in tableData.titleList"
|
|
|
- class-name="timeJD"
|
|
|
- :key="item.id"
|
|
|
- :prop="item.field"
|
|
|
- :label='item.text'
|
|
|
- align="left"
|
|
|
- width="480px"
|
|
|
- >
|
|
|
- <template slot-scope="{ row }">
|
|
|
- <div v-for="obj in jsuanTime(row, item.text)" :key="obj.id">
|
|
|
- <!-- 背景色条（10个）-->
|
|
|
- <div class="timeDom" >
|
|
|
- <template v-for="child in obj.child">
|
|
|
- <div v-if="child.isFull" :class="obj.flag == '1' ? 'timeItem tiGyActive' : (obj.flag == '2' ? 'timeItem tiOgActive' : 'timeItem tiActive')"></div>
|
|
|
- <div v-else class="timeItem"></div>
|
|
|
- </template>
|
|
|
- </div>
|
|
|
- <!-- 备注文字 -->
|
|
|
- <el-tooltip v-if="obj.bomDesc" class="item" :content="obj.bomDesc +' / '+ obj.procedureNo +' / '+ obj.planTime" effect="dark" placement="top-start">
|
|
|
- <div class="timeItemDesc" :style="{left: obj.leftNums+'%'}" >
|
|
|
- <span class="bomDesc" :title="obj.bomDesc">{{ obj.bomDesc ? obj.bomDesc.replace('产品零件', '') : '' }}({{ obj.procedureNo ? obj.procedureNo : '' }})</span>
|
|
|
- <div v-show="false" class="splanTime">{{ obj.splanTime ? obj.splanTime : '' }}</div>
|
|
|
- </div>
|
|
|
- </el-tooltip>
|
|
|
- </div>
|
|
|
- <!-- 中间虚线 -->
|
|
|
- <div class="dashedDom"></div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
-
|
|
|
- <!-- 【分页】组件 -->
|
|
|
- <pagination
|
|
|
- v-show="tableData.count > 0"
|
|
|
- :limit.sync="queryParams.size"
|
|
|
- :page.sync="queryParams.current"
|
|
|
- :total="Number(tableData.count)"
|
|
|
- @pagination="fetch"
|
|
|
- />
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
-
|
|
|
- </div>
|
|
|
+ <div class="tabDiv">
|
|
|
+ <el-row>
|
|
|
+ <el-col>
|
|
|
+ <!-- 时间，切换 -->
|
|
|
+ <div class="filter-container">
|
|
|
+ <span style="margin-left: 15px">
|
|
|
+ <span>{{ $t("resource.searchForm.startEndTime") }}：</span>
|
|
|
+ <el-date-picker
|
|
|
+ v-model="queryParams.timeRange"
|
|
|
+ type="daterange"
|
|
|
+ :picker-options="pickerOptions"
|
|
|
+ :range-separator="$t('common.separator')"
|
|
|
+ :start-placeholder="$t('common.startTime')"
|
|
|
+ :end-placeholder="$t('common.endTime')"
|
|
|
+ format="yyyy-MM-dd"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ align="right"
|
|
|
+ >
|
|
|
+ </el-date-picker>
|
|
|
+ </span>
|
|
|
+ <span style="margin-left: 15px">
|
|
|
+ <el-button
|
|
|
+ plain
|
|
|
+ type="primary"
|
|
|
+ icon="el-icon-search"
|
|
|
+ size="medium"
|
|
|
+ @click="search"
|
|
|
+ >
|
|
|
+ {{ $t("table.search") }}
|
|
|
+ </el-button>
|
|
|
+ <el-button
|
|
|
+ plain
|
|
|
+ type="warning"
|
|
|
+ icon="el-icon-refresh"
|
|
|
+ size="medium"
|
|
|
+ @click="reset"
|
|
|
+ >
|
|
|
+ {{ $t("table.reset") }}
|
|
|
+ </el-button>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <!-- 主要内容 -->
|
|
|
+ <el-table
|
|
|
+ :key="tableKey"
|
|
|
+ ref="table"
|
|
|
+ v-loading="loading"
|
|
|
+ :data="tableData.data"
|
|
|
+ fit
|
|
|
+ class="noPaddingTable"
|
|
|
+ style="width: 100%"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ label="基础信息"
|
|
|
+ align="center"
|
|
|
+ fixed="left"
|
|
|
+ width="350"
|
|
|
+ >
|
|
|
+ <!-- 序号 -->
|
|
|
+ <el-table-column
|
|
|
+ :label="$t('common.serialNo')"
|
|
|
+ width="50px"
|
|
|
+ align="center"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ {{
|
|
|
+ scope.$index +
|
|
|
+ (queryParams.current - 1) * queryParams.size +
|
|
|
+ 1
|
|
|
+ }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <!-- 编号 -->
|
|
|
+ <el-table-column
|
|
|
+ prop="code"
|
|
|
+ label="编号"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ width="100px"
|
|
|
+ ></el-table-column>
|
|
|
+ <!-- 生产资源名称 -->
|
|
|
+ <el-table-column
|
|
|
+ prop="name"
|
|
|
+ label="生产资源名称"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ width="200px"
|
|
|
+ ></el-table-column>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ v-for="item in tableData.titleList"
|
|
|
+ class-name="timeJD"
|
|
|
+ :key="item.id"
|
|
|
+ :prop="item.field"
|
|
|
+ :label="item.text"
|
|
|
+ align="left"
|
|
|
+ width="480px"
|
|
|
+ >
|
|
|
+ <template slot-scope="{ row }">
|
|
|
+ <div v-for="obj in jsuanTime(row, item.text)" :key="obj.id">
|
|
|
+ <!-- 背景色条（10个）-->
|
|
|
+ <div class="timeDom">
|
|
|
+ <template v-for="child in obj.child">
|
|
|
+ <div
|
|
|
+ v-if="child.isFull"
|
|
|
+ :class="
|
|
|
+ obj.flag == '1'
|
|
|
+ ? 'timeItem tiGyActive'
|
|
|
+ : obj.flag == '2'
|
|
|
+ ? 'timeItem tiOgActive'
|
|
|
+ : 'timeItem tiActive'
|
|
|
+ "
|
|
|
+ ></div>
|
|
|
+ <div v-else class="timeItem"></div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ <!-- 备注文字 -->
|
|
|
+ <el-tooltip
|
|
|
+ v-if="obj.bomDesc"
|
|
|
+ class="item"
|
|
|
+ :content="
|
|
|
+ obj.bomDesc + ' / ' + obj.procedureNo + ' / ' + obj.planTime
|
|
|
+ "
|
|
|
+ effect="dark"
|
|
|
+ placement="top-start"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="timeItemDesc"
|
|
|
+ :style="{ left: obj.leftNums + '%' }"
|
|
|
+ >
|
|
|
+ <span class="bomDesc" :title="obj.bomDesc"
|
|
|
+ >{{
|
|
|
+ obj.bomDesc ? obj.bomDesc.replace("产品零件", "") : ""
|
|
|
+ }}({{ obj.procedureNo ? obj.procedureNo : "" }})</span
|
|
|
+ >
|
|
|
+ <div v-show="false" class="splanTime">
|
|
|
+ {{ obj.splanTime ? obj.splanTime : "" }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
+ <!-- 中间虚线 -->
|
|
|
+ <div class="dashedDom"></div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <!-- 【分页】组件 -->
|
|
|
+ <pagination
|
|
|
+ v-show="tableData.count > 0"
|
|
|
+ :limit.sync="queryParams.size"
|
|
|
+ :page.sync="queryParams.current"
|
|
|
+ :total="Number(tableData.count)"
|
|
|
+ @pagination="fetch"
|
|
|
+ />
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
|
|
|
<script>
|
|
|
// 【分页】组件
|
|
|
-import Pagination from "@/components/Pagination"
|
|
|
+import Pagination from "@/components/Pagination";
|
|
|
// 【仓库类型管理】-API
|
|
|
-import warehouseTypeMgrApi from "@/api/modelingCenter/warehouseTypeMgr"
|
|
|
+import warehouseTypeMgrApi from "@/api/modelingCenter/warehouseTypeMgr";
|
|
|
// 【计划管理】-API
|
|
|
-import planMgrApi from "@/api/runManageCenter/planMgr"
|
|
|
+import planMgrApi from "@/api/runManageCenter/planMgr";
|
|
|
// 列表查询的共通参数
|
|
|
-import { initQueryParams } from '@/utils/commons'
|
|
|
+import { initQueryParams } from "@/utils/commons";
|
|
|
export default {
|
|
|
- name: 'PprogTask',
|
|
|
+ name: "PprogTask",
|
|
|
components: { Pagination },
|
|
|
- props: {
|
|
|
- },
|
|
|
- data () {
|
|
|
+ props: {},
|
|
|
+ data() {
|
|
|
return {
|
|
|
- titleData: [], // table的动态表头数据
|
|
|
- qiyongStatus: [], //状态
|
|
|
- loading: false,
|
|
|
- tableKey: 0,
|
|
|
- cuurentDate: 'week',
|
|
|
- queryParams: initQueryParams({}),
|
|
|
- timeDomList: [], // 填充背景的时间数组
|
|
|
- tableData: {
|
|
|
- count: 0
|
|
|
- }
|
|
|
- }
|
|
|
+ titleData: [], // table的动态表头数据
|
|
|
+ qiyongStatus: [], //状态
|
|
|
+ loading: false,
|
|
|
+ tableKey: 0,
|
|
|
+ cuurentDate: "week",
|
|
|
+ queryParams: initQueryParams({}),
|
|
|
+ timeDomList: [], // 填充背景的时间数组
|
|
|
+ tableData: {
|
|
|
+ count: 0,
|
|
|
+ },
|
|
|
+ pickerOptions: {
|
|
|
+ disabledDate(time) {
|
|
|
+ return time.getTime() < Date.now() - 8.64e7;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ };
|
|
|
+ },
|
|
|
+ // 实例已经在内存中创建好，此时data和methods已将ok,如果要操作data中的数据或是调用methods中的方法，最早只能在created中操作
|
|
|
+ created() {
|
|
|
+ // 初始化，填充数据
|
|
|
+ this.initTimeDom();
|
|
|
},
|
|
|
- // 实例已经在内存中创建好，此时data和methods已将ok,如果要操作data中的数据或是调用methods中的方法，最早只能在created中操作
|
|
|
- created() {
|
|
|
- // 初始化，填充数据
|
|
|
- this.initTimeDom();
|
|
|
- },
|
|
|
- // 每次进入，都加载
|
|
|
- activated(){
|
|
|
- // 初始化数据
|
|
|
- this.initData();
|
|
|
- },
|
|
|
- computed: {
|
|
|
- },
|
|
|
- mounted () {
|
|
|
- },
|
|
|
+ // 每次进入，都加载
|
|
|
+ activated() {
|
|
|
+ // 初始化数据
|
|
|
+ this.initData();
|
|
|
+ },
|
|
|
+ computed: {},
|
|
|
+ mounted() {},
|
|
|
methods: {
|
|
|
- // 初始化数据
|
|
|
- initData() {
|
|
|
- // 加载列表数据
|
|
|
- this.fetch();
|
|
|
- },
|
|
|
-
|
|
|
- // 初始化，填充数据
|
|
|
- initTimeDom() {
|
|
|
- for(let i = 0; i < 15; i++) {
|
|
|
- this.timeDomList.push({
|
|
|
- id: "WS"+ Math.random(), // 随机数据
|
|
|
- isFull: false // 是否填充颜色，默认不填充
|
|
|
- //planTime: '', // 计划时间
|
|
|
- //procedureNo: '', // 工序编码
|
|
|
- //bomDesc: '', // 零件的名称
|
|
|
- })
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- // 生产表头数据-函数
|
|
|
- creatTestData(){
|
|
|
- /*this.titleData = [
|
|
|
- {id: '100', text: '2020-10',
|
|
|
- children: [
|
|
|
- {id: '10001' text: '1', weekObj: {id: '100001', field: 'week', text: '日'}},
|
|
|
- {id: '10002', text: '2', weekObj: {id: '100002', field: 'week2', text: '一'}},
|
|
|
- {id: '10003', text: '3', weekObj: {id: '100003', field: 'week3', text: '二'}},
|
|
|
- {id: '10004', text: '4', weekObj: {id: '100004', field: 'week4', text: '三'}},
|
|
|
- {id: '10005', text: '5', weekObj: {id: '100005', field: 'week5', text: '四'}},
|
|
|
- {id: '10006', text: '6', weekObj: {id: '100006', field: 'week6', text: '五'}},
|
|
|
- {id: '10007', text: '7', weekObj: {id: '100007', field: 'week7', text: '六'}},
|
|
|
- {id: '10008', text: '8', weekObj: {id: '100008', field: 'week8', text: '一'}},
|
|
|
- {id: '10009', text: '9', weekObj: {id: '100009', field: 'week9', text: '二'}},
|
|
|
- {id: '100010', text: '10', weekObj: {id: '1000010', field: 'week10', text: '三'}},
|
|
|
- {id: '100011', text: '11', weekObj: {id: '1000011', field: 'week11', text: '四'}},
|
|
|
- {id: '100012', text: '12', weekObj: {id: '1000012', field: 'week12', text: '五'}}
|
|
|
- ]
|
|
|
- },
|
|
|
- {id: '102', text: '2020-11',
|
|
|
- children: [
|
|
|
- {id: '10201' text: '1', weekObj: {id: '102001', field: 'week', text: '日'}},
|
|
|
- {id: '10202', text: '2', weekObj: {id: '102002', field: 'week2', text: '一'}},
|
|
|
- {id: '10203', text: '3', weekObj: {id: '102003', field: 'week3', text: '二'}},
|
|
|
- {id: '10204', text: '4', weekObj: {id: '102004', field: 'week4', text: '三'}},
|
|
|
- {id: '10205', text: '5', weekObj: {id: '102005', field: 'week5', text: '四'}},
|
|
|
- {id: '10206', text: '6', weekObj: {id: '102006', field: 'week6', text: '五'}},
|
|
|
- {id: '10207', text: '7', weekObj: {id: '102007', field: 'week7', text: '六'}},
|
|
|
- {id: '10208', text: '8', weekObj: {id: '102008', field: 'week8', text: '一'}},
|
|
|
- {id: '10209', text: '9', weekObj: {id: '102009', field: 'week9', text: '二'}},
|
|
|
- {id: '102010', text: '10', weekObj: {id: '1020010', field: 'week10', text: '三'}},
|
|
|
- {id: '102011', text: '11', weekObj: {id: '1020011', field: 'week11', text: '四'}},
|
|
|
- {id: '102012', text: '12', weekObj: {id: '1020012', field: 'week12', text: '五'}}
|
|
|
- ]
|
|
|
- },
|
|
|
- {id: '103', text: '2020-12',
|
|
|
- children: [
|
|
|
- {id: '10301' text: '1', weekObj: {id: '103001', field: 'week', text: '日'}},
|
|
|
- {id: '10302', text: '2', weekObj: {id: '103002', field: 'week2', text: '一'}},
|
|
|
- {id: '10303', text: '3', weekObj: {id: '103003', field: 'week3', text: '二'}},
|
|
|
- {id: '10304', text: '4', weekObj: {id: '103004', field: 'week4', text: '三'}},
|
|
|
- {id: '10305', text: '5', weekObj: {id: '103005', field: 'week5', text: '四'}},
|
|
|
- {id: '10306', text: '6', weekObj: {id: '103006', field: 'week6', text: '五'}},
|
|
|
- {id: '10307', text: '7', weekObj: {id: '103007', field: 'week7', text: '六'}},
|
|
|
- {id: '10308', text: '8', weekObj: {id: '103008', field: 'week8', text: '一'}},
|
|
|
- {id: '10309', text: '9', weekObj: {id: '103009', field: 'week9', text: '二'}},
|
|
|
- {id: '103010', text: '10', weekObj: {id: '1030010', field: 'week10', text: '三'}},
|
|
|
- {id: '103011', text: '11', weekObj: {id: '1030011', field: 'week11', text: '四'}},
|
|
|
- {id: '103012', text: '12', weekObj: {id: '1030012', field: 'week12', text: '五'}}
|
|
|
- ]
|
|
|
- },
|
|
|
- ],*/
|
|
|
- // 生产30条数据
|
|
|
- let list = []
|
|
|
- for(let i = 0; i < 3; i++){
|
|
|
- list.push({
|
|
|
- id: '100' + i,
|
|
|
- text: "2020-1" + i,
|
|
|
- children: []
|
|
|
- })
|
|
|
- for(let j = 1; j < 25; j++){
|
|
|
- let week = ""
|
|
|
- if(j == 1 || j%7 == 0){
|
|
|
- week = "日"
|
|
|
- }
|
|
|
- if(j == 2 || j%7 == 1){
|
|
|
- week = "一"
|
|
|
- }
|
|
|
- if(j == 3 || j%7 == 2){
|
|
|
- week = "二"
|
|
|
- }
|
|
|
- if(j == 4 || j%7 == 3){
|
|
|
- week = "三"
|
|
|
- }
|
|
|
- if(j == 5 || j%7 == 4){
|
|
|
- week = "四"
|
|
|
- }
|
|
|
- if(j == 6 || j%7 == 5){
|
|
|
- week = "五"
|
|
|
- }
|
|
|
- if(j == 7 || j%7 == 6){
|
|
|
- week = "六"
|
|
|
- }
|
|
|
- list[i].children.push({
|
|
|
- id: '1000'+ j,
|
|
|
- text: ''+ j,
|
|
|
- weekObj: {
|
|
|
- id: '10000'+ j,
|
|
|
- field: 'week'+ j,
|
|
|
- text: week
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- // 赋值
|
|
|
- this.titleData = list
|
|
|
- console.log("表头数据：", this.titleData)
|
|
|
- },
|
|
|
-
|
|
|
- setTenant (val) {
|
|
|
- if(val){
|
|
|
- this.tenant = { ...val }
|
|
|
- }
|
|
|
+ // 初始化数据
|
|
|
+ initData() {
|
|
|
+ // 加载列表数据
|
|
|
+ this.fetch();
|
|
|
+ },
|
|
|
+
|
|
|
+ search() {
|
|
|
+ this.fetch({
|
|
|
+ ...this.queryParams
|
|
|
+ })
|
|
|
},
|
|
|
-
|
|
|
- /**
|
|
|
- * [核心算法]-根据时间，技术模块
|
|
|
- * row：数据
|
|
|
- * time：时间节点
|
|
|
- * */
|
|
|
- jsuanTime(row, time) {
|
|
|
- // 当前的时间
|
|
|
- // console.log("[核心算法]的数据feildTime： ",time);
|
|
|
- let arr = [{
|
|
|
- planTime: '', // 计划时间
|
|
|
- procedureNo: '', // 工序编码
|
|
|
- bomDesc: '', // 零件的名称
|
|
|
- leftNums: 6.66, // 文字偏移量
|
|
|
- child: [],
|
|
|
- flag: '3', // 是否已经开始
|
|
|
- }
|
|
|
- ]
|
|
|
- arr[0].child = JSON.parse(JSON.stringify(this.timeDomList));
|
|
|
- // let arr = JSON.parse(JSON.stringify(this.timeDomList));
|
|
|
- // 计算。该cell。是否需要，填充背景
|
|
|
- if(row.children && row.children.length > 0) {
|
|
|
- // 时间去。年月日部分"yyyy-MM-dd"
|
|
|
- let ymd = row.children[0].expectStartTime.substr(0,10);
|
|
|
- // cell的区间节点
|
|
|
- let filedTime = this.getHourSecend(ymd, time);
|
|
|
- row.children.map(item => {
|
|
|
- // 背景模块，开始时间
|
|
|
- let expectStartTime = this.getHourSecend(ymd, item.expectStartTime.substr(11,5));
|
|
|
- // 背景模块，截止时间
|
|
|
- let expectEndTime = this.getHourSecend(ymd, item.expectEndTime.substr(11,5));
|
|
|
- let flag = this.intervalInclusion([filedTime, filedTime + 30], [expectStartTime, expectEndTime]);
|
|
|
- // cell【包含-startEnd】在时间段中
|
|
|
- if(flag == '1') {
|
|
|
- // 文字偏移量
|
|
|
- let leftNums = 0;
|
|
|
- //console.log("时间点：",[filedTime, filedTime + 30], [expectStartTime, expectEndTime], flag, item);
|
|
|
- arr[0].child.forEach((obj, index) => {
|
|
|
- let modal = filedTime + (index+1)*2;
|
|
|
- // 小模块，【被包含】在起止时间区间
|
|
|
- if( modal <= expectEndTime && modal >= expectStartTime){
|
|
|
- obj.isFull = true;
|
|
|
- // 计算第一次值
|
|
|
- if(!leftNums){
|
|
|
- leftNums = index+1;
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
- //console.log(item.planTime)
|
|
|
- arr[0].planTime = item.planTime;
|
|
|
- arr[0].splanTime = item.expectStartTime.substr(11,5)+"到"+item.expectEndTime.substr(11,5);
|
|
|
- arr[0].procedureNo = item.procedureNo;
|
|
|
- arr[0].bomDesc = item.bomDesc;
|
|
|
- arr[0].count = leftNums-1;
|
|
|
- arr[0].leftNums = (leftNums-1)*6.66;
|
|
|
- arr[0].flag = item.flag ? item.flag : '';
|
|
|
- }
|
|
|
- // interval【有交集】终止点，在cell中，
|
|
|
- if(flag == '2') {
|
|
|
- arr[0].child.forEach((obj, index) => {
|
|
|
- let modal = filedTime + (index+1)*2;
|
|
|
- // 小模块，【有交集】终止点，在cell中，
|
|
|
- if( modal <= expectEndTime){
|
|
|
- obj.isFull = true;
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- // interval【有交集】起始点，在cell中
|
|
|
- if(flag == '3') {
|
|
|
- // 文字偏移量
|
|
|
- let leftNums = 0;
|
|
|
- arr[0].child.forEach((obj, index) => {
|
|
|
- let modal = filedTime + (index+1)*2;
|
|
|
- // 小模块，【有交集】起始点，在cell中
|
|
|
- if( modal >= expectStartTime){
|
|
|
- obj.isFull = true;
|
|
|
- // 计算第一次值
|
|
|
- if(!leftNums){
|
|
|
- leftNums = index+1;
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
- arr[0].planTime = item.planTime;
|
|
|
- arr[0].splanTime = item.expectStartTime.substr(11,5)+"到"+item.expectEndTime.substr(11,5);
|
|
|
- arr[0].procedureNo = item.procedureNo;
|
|
|
- arr[0].bomDesc = item.bomDesc;
|
|
|
- arr[0].leftNums = (leftNums-1)*6.66;
|
|
|
- arr[0].flag = item.flag ? item.flag : '';
|
|
|
- }
|
|
|
-
|
|
|
- // cell【完全包含】，比cell大的多
|
|
|
- if(flag == '4') {
|
|
|
- arr[0].child.forEach((obj, index) => {
|
|
|
- obj.isFull = true;
|
|
|
- })
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- // console.log("[核心算法]的数据feildTime： ",objList);
|
|
|
- return arr;
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- /**
|
|
|
- * 比较2个区间数据，是否包含
|
|
|
- * @param {Array} cell：需要检查的区间
|
|
|
- * @param {Array} startEnd：根区间。（startEnd是否包含于cell）
|
|
|
- * */
|
|
|
- intervalInclusion(cell, startEnd){
|
|
|
- // cell【包含-startEnd】,第二个参数，肯定是大于第一个参数的（固定）。
|
|
|
- if (startEnd[0] >= cell[0] && startEnd[0] < cell[1] && startEnd[1] >cell[0] && startEnd[1] <=cell[1]) {
|
|
|
- return "1";
|
|
|
- } else {
|
|
|
- // cell【有交集】终止点，在cell中，
|
|
|
- if(startEnd[1] > cell[0] && startEnd[1] <= cell[1] && startEnd[0] < cell[0]) {
|
|
|
- return "2";
|
|
|
- } else if( startEnd[0] >= cell[0] && startEnd[0] < cell[1] && startEnd[1] > cell[1]){
|
|
|
- // cell【有交集】起始点，在cell中
|
|
|
- return "3";
|
|
|
- } else if(cell[0] > startEnd[0] && cell[1] < startEnd[1]){
|
|
|
- // cell【完全包含】，比cell大的多
|
|
|
- return "4";
|
|
|
- } else {
|
|
|
- // cell【无关联】
|
|
|
- return "0";
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
|
|
|
- // 获取当前时间的。小时和分钟
|
|
|
- getHourSecend(ymd, time) {
|
|
|
- let d = new Date(ymd+" "+time);
|
|
|
- // 把日期，统一转化成分钟数
|
|
|
- let seconds = d.getHours()*60 + d.getMinutes();
|
|
|
- return seconds;
|
|
|
- },
|
|
|
-
|
|
|
- fetch (params = {}) {
|
|
|
- this.loading = true
|
|
|
+ reset() {
|
|
|
+ this.queryParams = initQueryParams({})
|
|
|
+ this.$refs.table.clearSort()
|
|
|
+ this.$refs.table.clearFilter()
|
|
|
+ this.search()
|
|
|
+ },
|
|
|
+
|
|
|
+ // 初始化，填充数据
|
|
|
+ initTimeDom() {
|
|
|
+ for (let i = 0; i < 15; i++) {
|
|
|
+ this.timeDomList.push({
|
|
|
+ id: "WS" + Math.random(), // 随机数据
|
|
|
+ isFull: false, // 是否填充颜色，默认不填充
|
|
|
+ //planTime: '', // 计划时间
|
|
|
+ //procedureNo: '', // 工序编码
|
|
|
+ //bomDesc: '', // 零件的名称
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ setTenant(val) {
|
|
|
+ if (val) {
|
|
|
+ this.tenant = { ...val };
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * [核心算法]-根据时间，技术模块
|
|
|
+ * row：数据
|
|
|
+ * time：时间节点
|
|
|
+ * */
|
|
|
+ jsuanTime(row, time) {
|
|
|
+ // 当前的时间
|
|
|
+ // console.log("[核心算法]的数据feildTime： ",time);
|
|
|
+ let arr = [
|
|
|
+ {
|
|
|
+ planTime: "", // 计划时间
|
|
|
+ procedureNo: "", // 工序编码
|
|
|
+ bomDesc: "", // 零件的名称
|
|
|
+ leftNums: 6.66, // 文字偏移量
|
|
|
+ child: [],
|
|
|
+ flag: "3", // 是否已经开始
|
|
|
+ },
|
|
|
+ ];
|
|
|
+ arr[0].child = JSON.parse(JSON.stringify(this.timeDomList));
|
|
|
+ // let arr = JSON.parse(JSON.stringify(this.timeDomList));
|
|
|
+ // 计算。该cell。是否需要，填充背景
|
|
|
+ if (row.children && row.children.length > 0) {
|
|
|
+ // 时间去。年月日部分"yyyy-MM-dd"
|
|
|
+ let ymd = row.children[0].expectStartTime.substr(0, 10);
|
|
|
+ // cell的区间节点
|
|
|
+ let filedTime = this.getHourSecend(ymd, time);
|
|
|
+ row.children.map((item) => {
|
|
|
+ // 背景模块，开始时间
|
|
|
+ let expectStartTime = this.getHourSecend(
|
|
|
+ ymd,
|
|
|
+ item.expectStartTime.substr(11, 5)
|
|
|
+ );
|
|
|
+ // 背景模块，截止时间
|
|
|
+ let expectEndTime = this.getHourSecend(
|
|
|
+ ymd,
|
|
|
+ item.expectEndTime.substr(11, 5)
|
|
|
+ );
|
|
|
+ let flag = this.intervalInclusion(
|
|
|
+ [filedTime, filedTime + 30],
|
|
|
+ [expectStartTime, expectEndTime]
|
|
|
+ );
|
|
|
+ // cell【包含-startEnd】在时间段中
|
|
|
+ if (flag == "1") {
|
|
|
+ // 文字偏移量
|
|
|
+ let leftNums = 0;
|
|
|
+ //console.log("时间点：",[filedTime, filedTime + 30], [expectStartTime, expectEndTime], flag, item);
|
|
|
+ arr[0].child.forEach((obj, index) => {
|
|
|
+ let modal = filedTime + (index + 1) * 2;
|
|
|
+ // 小模块，【被包含】在起止时间区间
|
|
|
+ if (modal <= expectEndTime && modal >= expectStartTime) {
|
|
|
+ obj.isFull = true;
|
|
|
+ // 计算第一次值
|
|
|
+ if (!leftNums) {
|
|
|
+ leftNums = index + 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ //console.log(item.planTime)
|
|
|
+ arr[0].planTime = item.planTime;
|
|
|
+ arr[0].splanTime =
|
|
|
+ item.expectStartTime.substr(11, 5) +
|
|
|
+ "到" +
|
|
|
+ item.expectEndTime.substr(11, 5);
|
|
|
+ arr[0].procedureNo = item.procedureNo;
|
|
|
+ arr[0].bomDesc = item.bomDesc;
|
|
|
+ arr[0].count = leftNums - 1;
|
|
|
+ arr[0].leftNums = (leftNums - 1) * 6.66;
|
|
|
+ arr[0].flag = item.flag ? item.flag : "";
|
|
|
+ }
|
|
|
+ // interval【有交集】终止点，在cell中，
|
|
|
+ if (flag == "2") {
|
|
|
+ arr[0].child.forEach((obj, index) => {
|
|
|
+ let modal = filedTime + (index + 1) * 2;
|
|
|
+ // 小模块，【有交集】终止点，在cell中，
|
|
|
+ if (modal <= expectEndTime) {
|
|
|
+ obj.isFull = true;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ // interval【有交集】起始点，在cell中
|
|
|
+ if (flag == "3") {
|
|
|
+ // 文字偏移量
|
|
|
+ let leftNums = 0;
|
|
|
+ arr[0].child.forEach((obj, index) => {
|
|
|
+ let modal = filedTime + (index + 1) * 2;
|
|
|
+ // 小模块，【有交集】起始点，在cell中
|
|
|
+ if (modal >= expectStartTime) {
|
|
|
+ obj.isFull = true;
|
|
|
+ // 计算第一次值
|
|
|
+ if (!leftNums) {
|
|
|
+ leftNums = index + 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ arr[0].planTime = item.planTime;
|
|
|
+ arr[0].splanTime =
|
|
|
+ item.expectStartTime.substr(11, 5) +
|
|
|
+ "到" +
|
|
|
+ item.expectEndTime.substr(11, 5);
|
|
|
+ arr[0].procedureNo = item.procedureNo;
|
|
|
+ arr[0].bomDesc = item.bomDesc;
|
|
|
+ arr[0].leftNums = (leftNums - 1) * 6.66;
|
|
|
+ arr[0].flag = item.flag ? item.flag : "";
|
|
|
+ }
|
|
|
+
|
|
|
+ // cell【完全包含】，比cell大的多
|
|
|
+ if (flag == "4") {
|
|
|
+ arr[0].child.forEach((obj, index) => {
|
|
|
+ obj.isFull = true;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ // console.log("[核心算法]的数据feildTime： ",objList);
|
|
|
+ return arr;
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 比较2个区间数据，是否包含
|
|
|
+ * @param {Array} cell：需要检查的区间
|
|
|
+ * @param {Array} startEnd：根区间。（startEnd是否包含于cell）
|
|
|
+ * */
|
|
|
+ intervalInclusion(cell, startEnd) {
|
|
|
+ // cell【包含-startEnd】,第二个参数，肯定是大于第一个参数的（固定）。
|
|
|
+ if (
|
|
|
+ startEnd[0] >= cell[0] &&
|
|
|
+ startEnd[0] < cell[1] &&
|
|
|
+ startEnd[1] > cell[0] &&
|
|
|
+ startEnd[1] <= cell[1]
|
|
|
+ ) {
|
|
|
+ return "1";
|
|
|
+ } else {
|
|
|
+ // cell【有交集】终止点，在cell中，
|
|
|
+ if (
|
|
|
+ startEnd[1] > cell[0] &&
|
|
|
+ startEnd[1] <= cell[1] &&
|
|
|
+ startEnd[0] < cell[0]
|
|
|
+ ) {
|
|
|
+ return "2";
|
|
|
+ } else if (
|
|
|
+ startEnd[0] >= cell[0] &&
|
|
|
+ startEnd[0] < cell[1] &&
|
|
|
+ startEnd[1] > cell[1]
|
|
|
+ ) {
|
|
|
+ // cell【有交集】起始点，在cell中
|
|
|
+ return "3";
|
|
|
+ } else if (cell[0] > startEnd[0] && cell[1] < startEnd[1]) {
|
|
|
+ // cell【完全包含】，比cell大的多
|
|
|
+ return "4";
|
|
|
+ } else {
|
|
|
+ // cell【无关联】
|
|
|
+ return "0";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ // 获取当前时间的。小时和分钟
|
|
|
+ getHourSecend(ymd, time) {
|
|
|
+ let d = new Date(ymd + " " + time);
|
|
|
+ // 把日期，统一转化成分钟数
|
|
|
+ let seconds = d.getHours() * 60 + d.getMinutes();
|
|
|
+ return seconds;
|
|
|
+ },
|
|
|
+
|
|
|
+ fetch(params = {}) {
|
|
|
+ this.loading = true;
|
|
|
if (this.queryParams.timeRange) {
|
|
|
- this.queryParams.map.createTime_st = this.queryParams.timeRange[0]
|
|
|
- this.queryParams.map.createTime_ed = this.queryParams.timeRange[1]
|
|
|
+ this.queryParams.map.createTime_st = this.queryParams.timeRange[0];
|
|
|
+ this.queryParams.map.createTime_ed = this.queryParams.timeRange[1];
|
|
|
}
|
|
|
|
|
|
- this.queryParams.current = params.current ? params.current : this.queryParams.current
|
|
|
- this.queryParams.size = params.size ? params.size : this.queryParams.size
|
|
|
+ this.queryParams.current = params.current
|
|
|
+ ? params.current
|
|
|
+ : this.queryParams.current;
|
|
|
+ this.queryParams.size = params.size ? params.size : this.queryParams.size;
|
|
|
// 根据订单的id，查询数据
|
|
|
// this.queryParams.planId = '1501604859084800000';
|
|
|
// 固定参数
|
|
|
- this.queryParams.model.mulPlanStatus = '2';
|
|
|
- planMgrApi.scheduleTaskByResource(this.queryParams).then(response => {
|
|
|
- const res = response.data
|
|
|
- if (res.isSuccess) {
|
|
|
- this.tableData = res.data;
|
|
|
- }
|
|
|
- // eslint-disable-next-line no-return-assign
|
|
|
- }).finally(() => this.loading = false)
|
|
|
-
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
+ this.queryParams.model.mulPlanStatus = "2";
|
|
|
+ planMgrApi
|
|
|
+ .scheduleTaskByResource(this.queryParams)
|
|
|
+ .then((response) => {
|
|
|
+ const res = response.data;
|
|
|
+ if (res.isSuccess) {
|
|
|
+ this.tableData = res.data;
|
|
|
+ }
|
|
|
+ // eslint-disable-next-line no-return-assign
|
|
|
+ })
|
|
|
+ .finally(() => (this.loading = false));
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style>
|
|
|
- /*计算时间的css-start*/
|
|
|
- .el-table .timeJD .cell {
|
|
|
- padding-top: 5px;
|
|
|
- padding-left: 0;
|
|
|
- padding-right: 0;
|
|
|
- }
|
|
|
- .el-table--border .timeJD.el-table__cell {
|
|
|
- border-right: 0;
|
|
|
- }
|
|
|
- /*计算时间的css-end*/
|
|
|
- .el-table.noPaddingTable th, .el-table.noPaddingTable td{
|
|
|
- padding: 5px 0;
|
|
|
- }
|
|
|
- .el-table.noPaddingTable td.dateColumns{
|
|
|
- vertical-align: bottom;
|
|
|
- }
|
|
|
- .el-table .dateColumns .cell{
|
|
|
- padding: 0 3px;
|
|
|
- }
|
|
|
- .el-table--border td.dateColumns{
|
|
|
- border-right: 2px dotted #AAAAAA;
|
|
|
- }
|
|
|
+/*计算时间的css-start*/
|
|
|
+.el-table .timeJD .cell {
|
|
|
+ padding-top: 5px;
|
|
|
+ padding-left: 0;
|
|
|
+ padding-right: 0;
|
|
|
+}
|
|
|
+.el-table--border .timeJD.el-table__cell {
|
|
|
+ border-right: 0;
|
|
|
+}
|
|
|
+/*计算时间的css-end*/
|
|
|
+.el-table.noPaddingTable th,
|
|
|
+.el-table.noPaddingTable td {
|
|
|
+ padding: 5px 0;
|
|
|
+}
|
|
|
+.el-table.noPaddingTable td.dateColumns {
|
|
|
+ vertical-align: bottom;
|
|
|
+}
|
|
|
+.el-table .dateColumns .cell {
|
|
|
+ padding: 0 3px;
|
|
|
+}
|
|
|
+.el-table--border td.dateColumns {
|
|
|
+ border-right: 2px dotted #aaaaaa;
|
|
|
+}
|
|
|
</style>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
- /*计算时间的css-start*/
|
|
|
- .timeDom {
|
|
|
- width: 100%;
|
|
|
- .timeItem {
|
|
|
- display: inline-block;
|
|
|
- //min-width: 40px;
|
|
|
- width: -moz-calc(100%/15);
|
|
|
- width: -webkit-calc(100%/15);
|
|
|
- width: calc(100%/15);
|
|
|
- //width:100%;
|
|
|
- height: 40px;
|
|
|
- //border: solid 1px;
|
|
|
-
|
|
|
- }
|
|
|
- .tiActive{
|
|
|
- background: #3CC787;
|
|
|
- }
|
|
|
- .tiOgActive{
|
|
|
- background: #CC9900;
|
|
|
- }
|
|
|
- .tiGyActive{
|
|
|
- background: #00a7d0;
|
|
|
- }
|
|
|
- }
|
|
|
- .timeItemDesc {
|
|
|
- position: absolute;
|
|
|
- top: 12px;
|
|
|
- left: 0;
|
|
|
- font-size: 12px;
|
|
|
- transform: scale(0.8);
|
|
|
- color: #000;
|
|
|
- text-align: center;
|
|
|
- //width:40px;
|
|
|
- //width: calc(100%/15);
|
|
|
- //padding: 2px;
|
|
|
- min-width: calc(100%/15);
|
|
|
- margin-left: -1.2%;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
- .bomDesc {
|
|
|
- word-wrap: break-word;
|
|
|
- word-break: break-all;
|
|
|
- display: block;
|
|
|
- }
|
|
|
+/*计算时间的css-start*/
|
|
|
+.timeDom {
|
|
|
+ width: 100%;
|
|
|
+ .timeItem {
|
|
|
+ display: inline-block;
|
|
|
+ //min-width: 40px;
|
|
|
+ width: -moz-calc(100%/15);
|
|
|
+ width: -webkit-calc(100%/15);
|
|
|
+ width: calc(100% / 15);
|
|
|
+ //width:100%;
|
|
|
+ height: 40px;
|
|
|
+ //border: solid 1px;
|
|
|
+ }
|
|
|
+ .tiActive {
|
|
|
+ background: #3cc787;
|
|
|
+ }
|
|
|
+ .tiOgActive {
|
|
|
+ background: #cc9900;
|
|
|
+ }
|
|
|
+ .tiGyActive {
|
|
|
+ background: #00a7d0;
|
|
|
+ }
|
|
|
+}
|
|
|
+.timeItemDesc {
|
|
|
+ position: absolute;
|
|
|
+ top: 12px;
|
|
|
+ left: 0;
|
|
|
+ font-size: 12px;
|
|
|
+ transform: scale(0.8);
|
|
|
+ color: #000;
|
|
|
+ text-align: center;
|
|
|
+ //width:40px;
|
|
|
+ //width: calc(100%/15);
|
|
|
+ //padding: 2px;
|
|
|
+ min-width: calc(100% / 15);
|
|
|
+ margin-left: -1.2%;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+.bomDesc {
|
|
|
+ word-wrap: break-word;
|
|
|
+ word-break: break-all;
|
|
|
+ display: block;
|
|
|
+}
|
|
|
|
|
|
- .splanTime{
|
|
|
- //transform: scale(0.75);
|
|
|
- //text-align:right;
|
|
|
- margin-left:-2%;
|
|
|
- }
|
|
|
-
|
|
|
- .dashedDom {
|
|
|
- position: absolute;
|
|
|
- top: 0;
|
|
|
- left: 0;
|
|
|
- border-right: 1px dashed #1890ff;
|
|
|
- height:100%;
|
|
|
- }
|
|
|
- /*计算时间的css-end*/
|
|
|
- .tabDiv{
|
|
|
- margin: 10px;
|
|
|
- }
|
|
|
- .bgDivCell{
|
|
|
- width: 41px;
|
|
|
- max-height: 100px;
|
|
|
- overflow-y: scroll;
|
|
|
- }
|
|
|
- /*.srollDiv{
|
|
|
+.splanTime {
|
|
|
+ //transform: scale(0.75);
|
|
|
+ //text-align:right;
|
|
|
+ margin-left: -2%;
|
|
|
+}
|
|
|
+
|
|
|
+.dashedDom {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ border-right: 1px dashed #1890ff;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+/*计算时间的css-end*/
|
|
|
+.tabDiv {
|
|
|
+ margin: 10px;
|
|
|
+}
|
|
|
+.bgDivCell {
|
|
|
+ width: 41px;
|
|
|
+ max-height: 100px;
|
|
|
+ overflow-y: scroll;
|
|
|
+}
|
|
|
+/*.srollDiv{
|
|
|
width: 40px;
|
|
|
height: 100%;
|
|
|
overflow-y: scroll;
|
|
|
}*/
|
|
|
- .taskSpan{
|
|
|
- display: block;
|
|
|
- background: #13ae58;
|
|
|
- width: 100%;
|
|
|
- height: 10px;
|
|
|
- margin: 2px 0;
|
|
|
- -moz-border-radius: 5px;
|
|
|
- -webkit-border-radius: 5px;
|
|
|
- border-radius: 5px;
|
|
|
- }
|
|
|
+.taskSpan {
|
|
|
+ display: block;
|
|
|
+ background: #13ae58;
|
|
|
+ width: 100%;
|
|
|
+ height: 10px;
|
|
|
+ margin: 2px 0;
|
|
|
+ -moz-border-radius: 5px;
|
|
|
+ -webkit-border-radius: 5px;
|
|
|
+ border-radius: 5px;
|
|
|
+}
|
|
|
</style>
|
yejian