From a169bda5b19db4714d2aa476504e58105228cc40 Mon Sep 17 00:00:00 2001
From: loulijun2021 <1694218219@qq.com>
Date: 星期二, 30 五月 2023 18:01:55 +0800
Subject: [PATCH] 1.对接移动端
---
src/views/kb/cjsc.vue | 940 +++++++++++++++++++++++++++-------------------------------
1 files changed, 444 insertions(+), 496 deletions(-)
diff --git a/src/views/kb/cjsc.vue b/src/views/kb/cjsc.vue
index 07e9586..b715e21 100644
--- a/src/views/kb/cjsc.vue
+++ b/src/views/kb/cjsc.vue
@@ -1,6 +1,12 @@
<template>
<div>
<div class="kb_dashboard">
+
+ <!-- 鏄熺┖鑳屾櫙-->
+ <!-- <div ref="starsRef" class="stars">-->
+ <!-- <div v-for="(item, index) in starsCount" :key="index" class="star" />-->
+ <!-- </div>-->
+
<div class="kb_header">
<div class="flex_c_c kb_header_text">
<div id="topBarLeft" style="width:600px;height:100%" />
@@ -22,27 +28,36 @@
<el-table
ref="tableDataLeftTopRef"
:data="tableDataLeftTop"
- class="tableData"
+ class="tableData tableDataCell"
style="width: 100%;"
:header-cell-style="headerCellStyle"
:cell-style="cellStyle"
height="428"
>
<el-table-column
- prop="xsdd"
+ prop="saleOrderCode"
label="閿�鍞崟鍙�"
- width="141"
- />
-
+ width="130"
+ >
+ <template slot-scope="{row}">
+ <div v-if="row.saleOrderCode" style="text-align: left" class="ellipsis">{{ row.saleOrderCode }}</div>
+ <div v-else>/</div>
+ </template>
+ </el-table-column>
<el-table-column
- prop="cpmc"
- width="133"
+ prop="partname"
+ width="170"
label="浜у搧鍚嶇О"
- />
+ >
+ <template slot-scope="{row}">
+ <div v-if="row.partname" class="ellipsis">{{ row.partname }}</div>
+ <div v-else>/</div>
+ </template>
+ </el-table-column>
<el-table-column
- prop="sl"
+ prop="good_qty"
label="鏁伴噺"
- width="100"
+ width="70"
/>
</el-table>
</div>
@@ -54,29 +69,39 @@
</div>
<div class="lineContent horn">
<el-table
- ref="tableDataLeftTopRef"
- :data="tableDataLeftTop"
- class="tableData"
+ ref="tableDataLeftBottomRef"
+ :data="tableDataLeftBottom"
+ class="tableData tableDataCell"
style="width: 100%;"
:header-cell-style="headerCellStyle"
:cell-style="cellStyle"
height="428"
>
<el-table-column
- prop="xsdd"
+ prop="saleOrderCode"
label="閿�鍞崟鍙�"
- width="141"
- />
+ width="130"
+ >
+ <template slot-scope="{row}">
+ <div v-if="row.saleOrderCode" style="text-align: left" class="ellipsis">{{ row.saleOrderCode }}</div>
+ <div v-else>/</div>
+ </template>
+ </el-table-column>
<el-table-column
- prop="cpmc"
- width="133"
+ prop="partname"
+ width="170"
label="浜у搧鍚嶇О"
- />
+ >
+ <template slot-scope="{row}">
+ <div v-if="row.partname" class="ellipsis">{{ row.partname }}</div>
+ <div v-else>/</div>
+ </template>
+ </el-table-column>
<el-table-column
- prop="sl"
+ prop="good_qty"
label="鏁伴噺"
- width="100"
+ width="70"
/>
</el-table>
</div>
@@ -92,118 +117,121 @@
<el-table
ref="tableDataLeftCenterRef"
:data="tableDataCenterTop"
- class="tableData"
+ class="tableData tableDataCell"
style="width: 100%;"
:header-cell-style="headerCellStyleCenter"
:cell-style="cellStyleCenter"
height="927"
>
<el-table-column
- prop="xh"
+ type="RowNum"
label="搴忓彿"
width="50"
>
<template slot-scope="{row}">
<div
- :style="{color:row.cxmc==='瑁呴厤涓�绾�'?'#ffff00':row.cxmc==='瑁呴厤浜岀嚎'?'#FF3333':row.cxmc==='瑁呴厤涓夌嚎'?'#FF00FF':'#00FFFF'}"
- > {{ row.xh }}
+ :style="{color:row.eqp_name==='瑁呴厤涓�绾�'?'#FFFF77':row.eqp_name==='瑁呴厤浜岀嚎'?'#FF8888':row.eqp_name==='瑁呴厤涓夌嚎'?'#D28EFF':'#66FFFF'}"
+ > {{ row.RowNum }}
</div>
</template>
</el-table-column>
<el-table-column
- prop="jgdh"
+ prop="wo_code"
label="鍔犲伐鍗曞彿"
- width="150"
+ width="190"
>
<template slot-scope="{row}">
<div
- :style="{color:row.cxmc==='瑁呴厤涓�绾�'?'#ffff00':row.cxmc==='瑁呴厤浜岀嚎'?'#FF3333':row.cxmc==='瑁呴厤涓夌嚎'?'#FF00FF':'#00FFFF'}"
- > {{ row.jgdh }}
+ :style="{color:row.eqp_name==='瑁呴厤涓�绾�'?'#FFFF77':row.eqp_name==='瑁呴厤浜岀嚎'?'#FF8888':row.eqp_name==='瑁呴厤涓夌嚎'?'#D28EFF':'#66FFFF'}"
+ > {{ row.wo_code }}
</div>
</template>
</el-table-column>
<el-table-column
- prop="cxmc"
- width="130"
+ prop="eqp_name"
+ width="90"
label="浜х嚎鍚嶇О"
>
<template slot-scope="{row}">
<div
- :style="{color:row.cxmc==='瑁呴厤涓�绾�'?'#ffff00':row.cxmc==='瑁呴厤浜岀嚎'?'#FF3333':row.cxmc==='瑁呴厤涓夌嚎'?'#FF00FF':'#00FFFF'}"
- > {{ row.cxmc }}
+ :style="{color:row.eqp_name==='瑁呴厤涓�绾�'?'#FFFF77':row.eqp_name==='瑁呴厤浜岀嚎'?'#FF8888':row.eqp_name==='瑁呴厤涓夌嚎'?'#D28EFF':'#66FFFF'}"
+ > {{ row.eqp_name }}
</div>
</template>
</el-table-column>
<el-table-column
- prop="cpmc"
- width="150"
+ prop="partname"
+ width="170"
label="浜у搧鍚嶇О"
>
<template slot-scope="{row}">
<div
- :style="{color:row.cxmc==='瑁呴厤涓�绾�'?'#ffff00':row.cxmc==='瑁呴厤浜岀嚎'?'#FF3333':row.cxmc==='瑁呴厤涓夌嚎'?'#FF00FF':'#00FFFF'}"
- > {{ row.cpmc }}
+ class="ellipsis"
+ :style="{color:row.eqp_name==='瑁呴厤涓�绾�'?'#FFFF77':row.eqp_name==='瑁呴厤浜岀嚎'?'#FF8888':row.eqp_name==='瑁呴厤涓夌嚎'?'#D28EFF':'#66FFFF'}"
+ > {{ row.partname }}
</div>
</template>
</el-table-column>
<el-table-column
- prop="scsl"
+ prop="plan_qty"
label="鐢熶骇鏁伴噺"
+ width="90"
+ >
+ <template slot-scope="{row}">
+ <div
+ :style="{color:row.eqp_name==='瑁呴厤涓�绾�'?'#FFFF77':row.eqp_name==='瑁呴厤浜岀嚎'?'#FF8888':row.eqp_name==='瑁呴厤涓夌嚎'?'#D28EFF':'#66FFFF'}"
+ > {{ row.plan_qty }}
+ </div>
+ </template>
+ </el-table-column>
+ <el-table-column
+ prop="plan_startdate"
+ label="棰勮寮�濮�"
+ width="125"
+ >
+ <template slot-scope="{row}">
+ <div
+ v-if="row.plan_startdate"
+ :style="{color:row.eqp_name==='瑁呴厤涓�绾�'?'#FFFF77':row.eqp_name==='瑁呴厤浜岀嚎'?'#FF8888':row.eqp_name==='瑁呴厤涓夌嚎'?'#D28EFF':'#66FFFF'}"
+ > {{ row.plan_startdate.substring(0, 11) }}
+ </div>
+ <div v-else />
+ </template>
+ </el-table-column>
+ <el-table-column
+ prop="plan_enddate"
+ label="棰勮瀹屽伐"
+ width="125"
+ >
+ <template slot-scope="{row}">
+ <div
+ v-if="row.plan_enddate"
+ :style="{color:row.eqp_name==='瑁呴厤涓�绾�'?'#FFFF77':row.eqp_name==='瑁呴厤浜岀嚎'?'#FF8888':row.eqp_name==='瑁呴厤涓夌嚎'?'#D28EFF':'#66FFFF'}"
+ > {{ row.plan_enddate.substring(0, 11) }}
+ </div>
+ <div v-else />
+ </template>
+ </el-table-column>
+ <el-table-column
+ prop="stepname"
+ label="宸ュ簭"
width="100"
>
<template slot-scope="{row}">
<div
- :style="{color:row.cxmc==='瑁呴厤涓�绾�'?'#ffff00':row.cxmc==='瑁呴厤浜岀嚎'?'#FF3333':row.cxmc==='瑁呴厤涓夌嚎'?'#FF00FF':'#00FFFF'}"
- > {{ row.scsl }}
+ class="ellipsis"
+ :style="{color:row.eqp_name==='瑁呴厤涓�绾�'?'#FFFF77':row.eqp_name==='瑁呴厤浜岀嚎'?'#FF8888':row.eqp_name==='瑁呴厤涓夌嚎'?'#D28EFF':'#66FFFF'}"
+ > {{ row.stepname }}
</div>
</template>
</el-table-column>
<el-table-column
- prop="yjks"
- label="棰勮寮�濮�"
- width="150"
- >
- <template slot-scope="{row}">
- <div
- :style="{color:row.cxmc==='瑁呴厤涓�绾�'?'#ffff00':row.cxmc==='瑁呴厤浜岀嚎'?'#FF3333':row.cxmc==='瑁呴厤涓夌嚎'?'#FF00FF':'#00FFFF'}"
- > {{ row.yjks }}
- </div>
- </template>
- </el-table-column>
- <el-table-column
- prop="yjwg"
- label="棰勮瀹屽伐"
- width="150"
- >
- <template slot-scope="{row}">
- <div
- :style="{color:row.cxmc==='瑁呴厤涓�绾�'?'#ffff00':row.cxmc==='瑁呴厤浜岀嚎'?'#FF3333':row.cxmc==='瑁呴厤涓夌嚎'?'#FF00FF':'#00FFFF'}"
- > {{ row.yjwg }}
- </div>
- </template>
- </el-table-column>
- <el-table-column
- prop="gx"
- label="宸ュ簭"
- width="90"
- >
- <template slot-scope="{row}">
- <div
- :style="{color:row.cxmc==='瑁呴厤涓�绾�'?'#ffff00':row.cxmc==='瑁呴厤浜岀嚎'?'#FF3333':row.cxmc==='瑁呴厤涓夌嚎'?'#FF00FF':'#00FFFF'}"
- > {{ row.gx }}
- </div>
- </template>
- </el-table-column>
- <el-table-column
- prop="scjd"
+ prop="scjdxxx"
label="鐢熶骇杩涘害"
- width="90"
+ width="130"
>
<template slot-scope="{row}">
- <div
- :style="{color:row.cxmc==='瑁呴厤涓�绾�'?'#ffff00':row.cxmc==='瑁呴厤浜岀嚎'?'#FF3333':row.cxmc==='瑁呴厤涓夌嚎'?'#FF00FF':'#00FFFF'}"
- > {{ row.scjd }}
- </div>
+ <div :id="'progress'+row.RowNum" style="width: 100%;height:30px" />
</template>
</el-table-column>
</el-table>
@@ -217,29 +245,38 @@
</div>
<div class="lineContent horn">
<el-table
- ref="tableDataLeftTopRef"
- :data="tableDataLeftTop"
- class="tableData"
+ ref="tableDataRightTopRef"
+ :data="tableDataRightTop"
+ class="tableData tableDataCell"
style="width: 100%;"
:header-cell-style="headerCellStyle"
:cell-style="cellStyle"
height="428"
>
<el-table-column
- prop="xsdd"
+ prop="saleOrderCode"
label="閿�鍞崟鍙�"
- width="141"
- />
-
+ width="130"
+ >
+ <template slot-scope="{row}">
+ <div v-if="row.saleOrderCode" style="text-align: left" class="ellipsis">{{ row.saleOrderCode }}</div>
+ <div v-else>/</div>
+ </template>
+ </el-table-column>
<el-table-column
- prop="cpmc"
- width="133"
+ prop="partname"
+ width="170"
label="浜у搧鍚嶇О"
- />
+ >
+ <template slot-scope="{row}">
+ <div v-if="row.partname" class="ellipsis">{{ row.partname }}</div>
+ <div v-else>/</div>
+ </template>
+ </el-table-column>
<el-table-column
- prop="sl"
+ prop="good_qty"
label="鏁伴噺"
- width="100"
+ width="70"
/>
</el-table>
</div>
@@ -251,29 +288,38 @@
</div>
<div class="lineContent horn">
<el-table
- ref="tableDataLeftTopRef"
- :data="tableDataLeftTop"
- class="tableData"
+ ref="tableDataRightBottomRef"
+ :data="tableDataRightBottom"
+ class="tableData tableDataCell"
style="width: 100%;"
:header-cell-style="headerCellStyle"
:cell-style="cellStyle"
height="428"
>
<el-table-column
- prop="xsdd"
+ prop="saleOrderCode"
label="閿�鍞崟鍙�"
- width="141"
- />
-
+ width="130"
+ >
+ <template slot-scope="{row}">
+ <div v-if="row.saleOrderCode" style="text-align: left" class="ellipsis">{{ row.saleOrderCode }}</div>
+ <div v-else>/</div>
+ </template>
+ </el-table-column>
<el-table-column
- prop="cpmc"
- width="133"
+ prop="partname"
+ width="170"
label="浜у搧鍚嶇О"
- />
+ >
+ <template slot-scope="{row}">
+ <div v-if="row.partname" class="ellipsis">{{ row.partname }}</div>
+ <div v-else>/</div>
+ </template>
+ </el-table-column>
<el-table-column
- prop="sl"
+ prop="good_qty"
label="鏁伴噺"
- width="100"
+ width="70"
/>
</el-table>
</div>
@@ -287,7 +333,9 @@
<script>
import './kbCommon.css'
-import { kbTop, loadEcharts } from '@/utils/myEcharts'
+import { kbTop, loadEcharts, progress } from '@/utils/myEcharts'
+import { WkshpContentData, WkshpLineData } from '@/api/dzkb'
+import clearAllChildren from '@/utils/global'
export default {
name: 'Cjsc',
@@ -295,332 +343,19 @@
return {
headTime: '',
tableDataLeftTop: [],
- tableDataLeftTopTemp: [
- { xsdd: 'MO-2022111501', cpmc: '浜у搧鍚嶇О1', sl: '100' },
- { xsdd: 'MO-2022111502', cpmc: '浜у搧鍚嶇О2', sl: '100' },
- { xsdd: 'MO-2022111503', cpmc: '浜у搧鍚嶇О3', sl: '100' },
- { xsdd: 'MO-2022111504', cpmc: '浜у搧鍚嶇О4', sl: '100' },
- { xsdd: 'MO-2022111505', cpmc: '浜у搧鍚嶇О5', sl: '100' },
- { xsdd: 'MO-2022111506', cpmc: '浜у搧鍚嶇О6', sl: '100' },
- { xsdd: 'MO-2022111507', cpmc: '浜у搧鍚嶇О7', sl: '100' },
- { xsdd: 'MO-2022111508', cpmc: '浜у搧鍚嶇О8', sl: '100' },
- { xsdd: 'MO-2022111509', cpmc: '浜у搧鍚嶇О9', sl: '100' },
- { xsdd: 'MO-2022111510', cpmc: '浜у搧鍚嶇О10', sl: '100' },
- { xsdd: 'MO-2022111511', cpmc: '浜у搧鍚嶇О11', sl: '100' },
- { xsdd: 'MO-2022111512', cpmc: '浜у搧鍚嶇О12', sl: '100' },
- { xsdd: 'MO-2022111513', cpmc: '浜у搧鍚嶇О13', sl: '100' },
- { xsdd: 'MO-2022111514', cpmc: '浜у搧鍚嶇О14', sl: '100' },
- { xsdd: 'MO-2022111515', cpmc: '浜у搧鍚嶇О15', sl: '100' },
- { xsdd: 'MO-2022111516', cpmc: '浜у搧鍚嶇О16', sl: '100' },
- { xsdd: 'MO-2022111517', cpmc: '浜у搧鍚嶇О17', sl: '100' },
- { xsdd: 'MO-2022111518', cpmc: '浜у搧鍚嶇О18', sl: '100' },
- { xsdd: 'MO-2022111519', cpmc: '浜у搧鍚嶇О19', sl: '100' },
- { xsdd: 'MO-2022111520', cpmc: '浜у搧鍚嶇О20', sl: '100' },
- { xsdd: 'MO-2022111521', cpmc: '浜у搧鍚嶇О21', sl: '100' },
- { xsdd: 'MO-2022111522', cpmc: '浜у搧鍚嶇О22', sl: '100' },
- { xsdd: 'MO-2022111523', cpmc: '浜у搧鍚嶇О23', sl: '100' },
- { xsdd: 'MO-2022111524', cpmc: '浜у搧鍚嶇О24', sl: '100' }
- ],
+ tableDataLeftTopTemp: [],
+ tableDataLeftBottom: [],
+ tableDataLeftBottomTemp: [],
+ tableDataRightTop: [],
+ tableDataRightTopTemp: [],
+ tableDataRightBottom: [],
+ tableDataRightBottomTemp: [],
+
tableDataCenterTop: [],
- tableDataCenterTopTemp: [
- {
- xh: 1,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤涓�绾�',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 2,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤浜岀嚎',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 3,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤涓夌嚎',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 4,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤鍥涚嚎',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 5,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤涓�绾�',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 6,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤涓�绾�',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 7,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤涓�绾�',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 8,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤涓�绾�',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 9,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤浜岀嚎',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 10,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤浜岀嚎',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 11,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤涓夌嚎',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 12,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤涓夌嚎',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 13,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤涓�绾�',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 14,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤涓�绾�',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 15,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤涓�绾�',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 16,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤鍥涚嚎',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 17,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤鍥涚嚎',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 18,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤鍥涚嚎',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 19,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤鍥涚嚎',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 20,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤鍥涚嚎',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 21,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤鍥涚嚎',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 22,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤涓�绾�',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 23,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤涓�绾�',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 24,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤涓夌嚎',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 25,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤浜岀嚎',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 26,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤涓夌嚎',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- },
- {
- xh: 27,
- jgdh: 'MO-2022-1115-01',
- cxmc: '瑁呴厤鍥涚嚎',
- cpmc: '浜у搧鍚嶇О1',
- scsl: '100',
- yjks: '2022-10-01',
- yjwg: '2022-10-10',
- gx: '宸ュ簭涓�',
- scjd: '10/20'
- }
- ]
+ tableDataCenterTopTemp: [],
+
+ starsCount: 800, // 鏄熸槦鏁伴噺
+ distance: 900 // 闂磋窛
}
},
created() {
@@ -633,49 +368,246 @@
},
mounted() {
this.getTopBar()
- this.getTableDataSetInterval()
+ // 杈逛笂鍥涗釜琛ㄦ牸鏁版嵁鍐呭
+ this.getLeftTopTableDataSetInterval()
+ this.getLeftBottomTableDataSetInterval()
+ this.getRightTopTableDataSetInterval()
+ this.getRightBottomTableDataSetInterval()
+
+ // 涓棿琛ㄦ牸鏁版嵁鍐呭
this.getCenterTableDataSetInterval()
+
+ // this.setStarsRef()
},
methods: {
+ setStarsRef() {
+ const starNodes = Array.from(this.$refs.starsRef.children)
+ starNodes.forEach(item => {
+ const speed = 0.2 + Math.random() * 1
+ const thisDistance = this.distance + Math.random() * 300
+ item.style.transformOrigin = `0 0 ${thisDistance}px`
+ item.style.transform = `
+ translate3d(0,0,-${thisDistance}px)
+ rotateY(${Math.random() * 360}deg)
+ rotateX(${Math.random() * -50}deg)
+ scale(${speed},${speed})`
+ })
+ },
// 涓棿閮ㄥ垎鐨勮〃鏍�
getCenterTableDataSetInterval() {
let startValue = 0 // 鍒濆鍊�
- const scale = 23// 鍒诲害
+ const scale = 20// 鍒诲害
- this.tableDataCenterTop = this.tableDataCenterTopTemp.slice(startValue, startValue + scale)
-
- const loop = Math.floor(this.tableDataCenterTopTemp.length / scale)// 闇�瑕佸惊鐜殑娆℃暟
- let nowLoop = 0// 褰撳墠寰幆鐨勬鏁�
-
- setInterval(() => {
- startValue = startValue + scale
+ WkshpContentData().then(res => {
+ this.tableDataCenterTopTemp = res.data
this.tableDataCenterTop = this.tableDataCenterTopTemp.slice(startValue, startValue + scale)
- if (nowLoop === loop) {
- this.getCenterTableDataSetInterval()
- }
- nowLoop++
- }, 5000)
+ const loop = Math.floor(this.tableDataCenterTopTemp.length / scale)// 闇�瑕佸惊鐜殑娆℃暟
+ let nowLoop = 0// 褰撳墠寰幆鐨勬鏁�
+
+ const timer = setInterval(() => {
+ startValue = startValue + scale
+ this.tableDataCenterTop = this.tableDataCenterTopTemp.slice(startValue, startValue + scale)
+ nowLoop++
+ if (nowLoop === loop) {
+ clearInterval(timer)
+ this.getCenterTableDataSetInterval()
+ }
+
+ this.$nextTick(() => {
+ this.tableDataCenterTop.forEach(i => {
+ loadEcharts('progress' + i.RowNum, progress(i.good_qty, i.plan_qty))
+ })
+ })
+ }, 1000 * 10)
+
+ this.$nextTick(() => {
+ this.tableDataCenterTop.forEach(i => {
+ loadEcharts('progress' + i.RowNum, progress(i.good_qty, i.plan_qty))
+ })
+ })
+ })
},
- // 瀹氭椂鍒锋柊琛ㄦ牸鏁版嵁
- getTableDataSetInterval() {
- let startValue = 0 // 鍒濆鍊�
- const scale = 10// 鍒诲害
+ // 鑾峰彇宸︿笂鏁版嵁骞跺畾鏃跺埛鏂�
+ getLeftTopTableDataSetInterval() {
+ // let startValue = 0 // 鍒濆鍊�
+ // const scale = 10// 鍒诲害
+ //
+ // WkshpLineData({ LineCode: '001' }).then(res => {
+ // this.tableDataLeftTopTemp = res.data
+ // this.tableDataLeftTop = this.tableDataLeftTopTemp.slice(startValue, startValue + scale)
+ //
+ // const loop = Math.floor(this.tableDataLeftTopTemp.length / scale)// 闇�瑕佸惊鐜殑娆℃暟
+ // let nowLoop = 0// 褰撳墠寰幆鐨勬鏁�
+ //
+ // const timer = setInterval(() => {
+ // startValue = startValue + scale
+ // this.tableDataLeftTop = this.tableDataLeftTopTemp.slice(startValue, startValue + scale)
+ // if (nowLoop === loop) {
+ // clearInterval(timer)
+ // this.getLeftTopTableDataSetInterval()
+ // }
+ // nowLoop++
+ // }, 1000 * 10)
+ // })
- this.tableDataLeftTop = this.tableDataLeftTopTemp.slice(startValue, startValue + scale)
+ WkshpLineData({ LineCode: '001' }).then(res => {
+ this.tableDataLeftTop = res.data
+ const divData = this.$refs.tableDataLeftTopRef.bodyWrapper
+ // 鎷垮埌鍏冪礌鍚庯紝瀵瑰厓绱犺繘琛屽畾鏃跺鍔犺窛绂婚《閮ㄨ窛绂伙紝瀹炵幇婊氬姩鏁堟灉(姝ら厤缃负姣�100姣绉诲姩1鍍忕礌)
+ const timer = setInterval(() => {
+ // 鍏冪礌鑷璺濈椤堕儴1鍍忕礌
+ divData.scrollTop += 1
+ // 鍒ゆ柇鍏冪礌鏄惁婊氬姩鍒板簳閮�(鍙楂樺害+璺濈椤堕儴=鏁翠釜楂樺害)
+ if (divData.clientHeight + divData.scrollTop === divData.scrollHeight) {
+ // 閲嶇疆table璺濈椤堕儴璺濈
+ divData.scrollTop = 0
+ WkshpLineData({ LineCode: '001' }).then(res => {
+ this.tableDataLeftTop = res.data
+ if (this.tableDataLeftTop.length > 10) {
+ clearInterval(timer)
+ this.getLeftTopTableDataSetInterval()
+ }
+ })
+ }
+ }, this.tableDataLeftTop.length <= 10 ? 1000 * 20 : 100)
+ })
+ },
+ // 鑾峰彇宸︿笅鏁版嵁骞跺畾鏃跺埛鏂�
+ getLeftBottomTableDataSetInterval() {
+ // let startValue = 0 // 鍒濆鍊�
+ // const scale = 10// 鍒诲害
+ //
+ // WkshpLineData({ LineCode: '002' }).then(res => {
+ // this.tableDataLeftBottomTemp = res.data
+ // this.tableDataLeftBottom = this.tableDataLeftBottomTemp.slice(startValue, startValue + scale)
+ //
+ // const loop = Math.floor(this.tableDataLeftBottomTemp.length / scale)// 闇�瑕佸惊鐜殑娆℃暟
+ // let nowLoop = 0// 褰撳墠寰幆鐨勬鏁�
+ //
+ // const timer = setInterval(() => {
+ // startValue = startValue + scale
+ // this.tableDataLeftBottom = this.tableDataLeftBottomTemp.slice(startValue, startValue + scale)
+ // if (nowLoop === loop) {
+ // clearInterval(timer)
+ // this.getLeftBottomTableDataSetInterval()
+ // }
+ // nowLoop++
+ // }, 1000 * 10)
+ // })
- const loop = Math.floor(this.tableDataLeftTopTemp.length / scale)// 闇�瑕佸惊鐜殑娆℃暟
- let nowLoop = 0// 褰撳墠寰幆鐨勬鏁�
+ WkshpLineData({ LineCode: '002' }).then(res => {
+ this.tableDataLeftBottom = res.data
+ const divData = this.$refs.tableDataLeftBottomRef.bodyWrapper
+ // 鎷垮埌鍏冪礌鍚庯紝瀵瑰厓绱犺繘琛屽畾鏃跺鍔犺窛绂婚《閮ㄨ窛绂伙紝瀹炵幇婊氬姩鏁堟灉(姝ら厤缃负姣�100姣绉诲姩1鍍忕礌)
+ const timer = setInterval(() => {
+ // 鍏冪礌鑷璺濈椤堕儴1鍍忕礌
+ divData.scrollTop += 1
+ // 鍒ゆ柇鍏冪礌鏄惁婊氬姩鍒板簳閮�(鍙楂樺害+璺濈椤堕儴=鏁翠釜楂樺害)
+ if (divData.clientHeight + divData.scrollTop === divData.scrollHeight) {
+ // 閲嶇疆table璺濈椤堕儴璺濈
+ divData.scrollTop = 0
+ WkshpLineData({ LineCode: '002' }).then(res => {
+ this.tableDataLeftBottom = res.data
+ if (this.tableDataLeftBottom.length > 10) {
+ clearInterval(timer)
+ this.getLeftBottomTableDataSetInterval()
+ }
+ })
+ }
+ }, this.tableDataLeftBottom.length <= 10 ? 1000 * 20 : 100)
+ })
+ },
+ // 鑾峰彇鍙充笂鏁版嵁骞跺畾鏃跺埛鏂�
+ getRightTopTableDataSetInterval() {
+ // let startValue = 0 // 鍒濆鍊�
+ // const scale = 10// 鍒诲害
+ //
+ // WkshpLineData({ LineCode: '003' }).then(res => {
+ // this.tableDataRightTopTemp = res.data
+ // this.tableDataRightTop = this.tableDataRightTopTemp.slice(startValue, startValue + scale)
+ //
+ // const loop = Math.floor(this.tableDataRightTopTemp.length / scale)// 闇�瑕佸惊鐜殑娆℃暟
+ // let nowLoop = 0// 褰撳墠寰幆鐨勬鏁�
+ //
+ // const timer = setInterval(() => {
+ // startValue = startValue + scale
+ // this.tableDataRightTop = this.tableDataRightTopTemp.slice(startValue, startValue + scale)
+ // if (nowLoop === loop) {
+ // clearInterval(timer)
+ // this.getRightTopTableDataSetInterval()
+ // }
+ // nowLoop++
+ // }, 1000 * 10)
+ // })
- setInterval(() => {
- startValue = startValue + scale
- this.tableDataLeftTop = this.tableDataLeftTopTemp.slice(startValue, startValue + scale)
- if (nowLoop === loop) {
- this.getTableDataSetInterval()
- }
- nowLoop++
- }, 5000)
+ WkshpLineData({ LineCode: '003' }).then(res => {
+ this.tableDataRightTop = res.data
+ const divData = this.$refs.tableDataRightTopRef.bodyWrapper
+ // 鎷垮埌鍏冪礌鍚庯紝瀵瑰厓绱犺繘琛屽畾鏃跺鍔犺窛绂婚《閮ㄨ窛绂伙紝瀹炵幇婊氬姩鏁堟灉(姝ら厤缃负姣�100姣绉诲姩1鍍忕礌)
+ const timer = setInterval(() => {
+ // 鍏冪礌鑷璺濈椤堕儴1鍍忕礌
+ divData.scrollTop += 1
+ // 鍒ゆ柇鍏冪礌鏄惁婊氬姩鍒板簳閮�(鍙楂樺害+璺濈椤堕儴=鏁翠釜楂樺害)
+ if (divData.clientHeight + divData.scrollTop === divData.scrollHeight) {
+ // 閲嶇疆table璺濈椤堕儴璺濈
+ divData.scrollTop = 0
+ WkshpLineData({ LineCode: '003' }).then(res => {
+ this.tableDataRightTop = res.data
+ if (this.tableDataRightTop.length > 10) {
+ clearInterval(timer)
+ this.getRightTopTableDataSetInterval()
+ }
+ })
+ }
+ }, this.tableDataRightTop.length <= 10 ? 1000 * 20 : 100)
+ })
+ },
+ // 鑾峰彇鍙充笅鏁版嵁骞跺畾鏃跺埛鏂�
+ getRightBottomTableDataSetInterval() {
+ // let startValue = 0 // 鍒濆鍊�
+ // const scale = 10// 鍒诲害
+ //
+ // WkshpLineData({ LineCode: '004' }).then(res => {
+ // this.tableDataRightBottomTemp = res.data
+ // this.tableDataRightBottom = this.tableDataRightBottomTemp.slice(startValue, startValue + scale)
+ //
+ // const loop = Math.floor(this.tableDataRightBottomTemp.length / scale)// 闇�瑕佸惊鐜殑娆℃暟
+ // let nowLoop = 0// 褰撳墠寰幆鐨勬鏁�
+ //
+ // const timer = setInterval(() => {
+ // startValue = startValue + scale
+ // this.tableDataRightBottom = this.tableDataRightBottomTemp.slice(startValue, startValue + scale)
+ // if (nowLoop === loop) {
+ // clearInterval(timer)
+ // this.getRightBottomTableDataSetInterval()
+ // }
+ // nowLoop++
+ // }, 1000 * 10)
+ // })
+
+ WkshpLineData({ LineCode: '004' }).then(res => {
+ this.tableDataRightBottom = res.data
+ const divData = this.$refs.tableDataRightBottomRef.bodyWrapper
+ // 鎷垮埌鍏冪礌鍚庯紝瀵瑰厓绱犺繘琛屽畾鏃跺鍔犺窛绂婚《閮ㄨ窛绂伙紝瀹炵幇婊氬姩鏁堟灉(姝ら厤缃负姣�100姣绉诲姩1鍍忕礌)
+ const timer = setInterval(() => {
+ // 鍏冪礌鑷璺濈椤堕儴1鍍忕礌
+ divData.scrollTop += 1
+ // 鍒ゆ柇鍏冪礌鏄惁婊氬姩鍒板簳閮�(鍙楂樺害+璺濈椤堕儴=鏁翠釜楂樺害)
+ if (divData.clientHeight + divData.scrollTop === divData.scrollHeight) {
+ // 閲嶇疆table璺濈椤堕儴璺濈
+ divData.scrollTop = 0
+ WkshpLineData({ LineCode: '004' }).then(res => {
+ this.tableDataRightBottom = res.data
+ if (this.tableDataRightBottom.length > 10) {
+ clearInterval(timer)
+ this.getRightBottomTableDataSetInterval()
+ }
+ })
+ }
+ }, this.tableDataRightBottom.length <= 10 ? 1000 * 20 : 100)
+ })
},
// 鑾峰彇topEcharts
@@ -706,7 +638,8 @@
padding: '10px 0',
textAlign: 'center',
color: '#07acc2',
- border: 'none'
+ border: 'none',
+ fontSize: '18px'
}
},
cellStyle() {
@@ -717,7 +650,8 @@
backgroundColor: '#000',
// backgroundColor: 'transparent',
color: '#fff',
- border: 'none'
+ border: 'none',
+ fontSize: '18px'
}
},
headerCellStyleCenter() {
@@ -727,16 +661,18 @@
padding: '10px 0',
textAlign: 'center',
color: '#07acc2',
- border: 'none'
+ border: 'none',
+ fontSize: '18px'
}
},
cellStyleCenter() {
return {
- padding: '7.5px 0',
+ padding: '7px 0',
textAlign: 'center',
backgroundColor: '#000',
color: '#fff',
- border: 'none'
+ border: 'none',
+ fontSize: '18px'
}
}
}
@@ -747,45 +683,57 @@
<style lang="scss" scoped>
$main_color: #09d8f2;
$color01: #00FFFF;
-.lineContent {
- height: 435px;
- border: 1px solid $main_color;
- //outline: 1px solid $main_color;
- border-radius: 5px;
- padding: 2px;
-}
-.lineContentCenter {
- height: 935px;
- border: 1px solid $main_color;
- //outline: 1px solid $main_color;
- border-radius: 5px;
- padding: 2px;
-}
-
-.horn {
- background: linear-gradient($color01, $color01) left top,
- linear-gradient($color01, $color01) left top,
- linear-gradient($color01, $color01) right top,
- linear-gradient($color01, $color01) right top,
- linear-gradient($color01, $color01) left bottom,
- linear-gradient($color01, $color01) left bottom,
- linear-gradient($color01, $color01) right bottom,
- linear-gradient($color01, $color01) right bottom;
- background-repeat: no-repeat;
- //background-size: 5px 20px, 20px 5px;
- background-size: 2px 20px, 20px 2px;
+.tableDataCell {
+ ::v-deep .cell{
+ padding: 0 2px ;
+ }
}
.tableData {
background: #000;
}
-//.el-table::before{
-// height: 0;
-//}
+.el-table::before {
+ height: 0;
+}
.el-table__empty-text {
color: $main_color;
}
+
+</style>
+<!--鏄熺┖-->
+<style lang="css" scoped>
+@keyframes rotate {
+ 0% {
+ transform: perspective(400px) rotateZ(20deg) rotateX(-40deg) rotateY(0);
+ }
+ 100% {
+ transform: perspective(400px) rotateZ(20deg) rotateX(-40deg) rotateY(-360deg);
+ }
+}
+
+.stars {
+ transform: perspective(500px);
+ transform-style: preserve-3d;
+ position: absolute;
+ perspective-origin: 50% 100%;
+ left: 45%;
+ animation: rotate 90s infinite linear;
+ bottom: 0;
+ z-index: 102;
+}
+
+.star {
+ width: 2px;
+ height: 2px;
+ /*background: #f7f7b6;*/
+ background: #8edffc;
+ position: absolute;
+ left: 0;
+ top: 0;
+ backface-visibility: hidden;
+ z-index: 102;
+}
</style>
--
Gitblit v1.9.3