From 31127ef63da3af7511a3b06eb2eaa87238f245da Mon Sep 17 00:00:00 2001
From: loulijun2021 <1694218219@qq.com>
Date: 星期二, 05 三月 2024 10:07:44 +0800
Subject: [PATCH] 1.本地看板开发、发布
---
src/views/kanbanManager/ckgl.vue | 506 +++++++++++--------
src/permission.js | 2
vue.config.js | 2
src/api/kanbanManager.js | 24
src/views/kanbanManager/cj.vue | 96 ++-
src/views/kanbanManager/zhkb.vue | 204 ++-----
src/utils/myEcharts.js | 726 ++++++++++++---------------
7 files changed, 770 insertions(+), 790 deletions(-)
diff --git a/src/api/kanbanManager.js b/src/api/kanbanManager.js
index 33786f3..c258dc4 100644
--- a/src/api/kanbanManager.js
+++ b/src/api/kanbanManager.js
@@ -53,3 +53,27 @@
params: data
})
}
+// 浠撳簱鐪嬫澘,宸︿笂浜у搧寰呭叆搴撳垪琛�
+export function WareHouseTopLeftData() {
+ return request({
+ url: 'KanBanManagerent/WareHouseTopLeftData',
+ method: 'get'
+ })
+}
+
+// 浠撳簱鐪嬫澘,宸︿笅浜у搧寰呭彂璐у垪琛�
+export function WareHouseTopBottomData() {
+ return request({
+ url: 'KanBanManagerent/WareHouseTopBottomData',
+ method: 'get'
+ })
+}
+
+// 浠撳簱鐪嬫澘,鍙充笂鎴愬搧搴撱�佸崐鎴愬搧搴搕op5搴撳瓨鎺掕
+export function WareHouseRightTopData() {
+ return request({
+ url: 'KanBanManagerent/WareHouseRightTopData',
+ method: 'get'
+ })
+}
+
diff --git a/src/permission.js b/src/permission.js
index ad087ea..3b56f37 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -9,7 +9,7 @@
NProgress.configure({ showSpinner: false }) // NProgress Configuration
-const whiteList = ['/login', '/zhkb', '/cj'] // no redirect whitelist
+const whiteList = ['/login', '/zhkb', '/cj', '/ckgl'] // no redirect whitelist
router.beforeEach(async(to, from, next) => {
// start progress bar
diff --git a/src/utils/myEcharts.js b/src/utils/myEcharts.js
index d577d03..a85280e 100644
--- a/src/utils/myEcharts.js
+++ b/src/utils/myEcharts.js
@@ -1872,7 +1872,7 @@
containLabel: true
},
title: {
- text: '鍚勮溅闂村綋鏈堣鍗曟暟/鍏ュ簱鏁伴噺',
+ text: '杩戜竴鍛ㄨ鍗曟暟/鍏ュ簱鏁伴噺',
left: '50%',
top: '0%',
textAlign: 'center',
@@ -2308,7 +2308,8 @@
// tooltip: {},
title: {
show: show,
- text: '鍚勮溅闂翠笉鑹秼鍔�',
+ text: '',
+ // text: '鍚勮溅闂翠笉鑹秼鍔�',
left: '50%',
top: '3%',
textAlign: 'center',
@@ -2322,7 +2323,7 @@
grid: {
left: '2%',
right: '2%',
- bottom: '15%',
+ bottom: '5%',
top: '20%',
containLabel: true
},
@@ -2400,7 +2401,7 @@
],
series: [
{
- name: legendData[0],
+ name: '',
type: 'line',
// smooth: true, //鏄惁骞虫粦鏇茬嚎鏄剧ず
// symbol:'circle', // 榛樿鏄┖蹇冨渾锛堜腑闂存槸鐧借壊鐨勶級锛屾敼鎴愬疄蹇冨渾
@@ -2445,200 +2446,200 @@
// shadowBlur: 20 // shadowBlur璁惧浘褰㈤槾褰辩殑妯＄硦澶у皬銆傞厤鍚坰hadowColor,shadowOffsetX/Y, 璁剧疆鍥惧舰鐨勯槾褰辨晥鏋溿��
// }
// },
- data: yData[0]
- },
- {
- name: legendData[1],
- type: 'line',
- // smooth: true, //鏄惁骞虫粦鏇茬嚎鏄剧ず
- // symbol:'circle', // 榛樿鏄┖蹇冨渾锛堜腑闂存槸鐧借壊鐨勶級锛屾敼鎴愬疄蹇冨渾
- showAllSymbol: true,
- symbol: 'emptyCircle',
- symbolSize: 6,
- lineStyle: {
- normal: {
- color: '#ff3000' // 绾挎潯棰滆壊
- },
- borderColor: '#ff3000'
- },
- label: {
- show: true,
- position: 'top',
- textStyle: {
- fontSize: 16,
- color: '#fff'
- }
- },
- itemStyle: {
- normal: {
- color: '#ff3000'
- }
- },
- tooltip: {
- show: false
- },
- // areaStyle: { // 鍖哄煙濉厖鏍峰紡
- // normal: {
- // // 绾挎�ф笎鍙橈紝鍓�4涓弬鏁板垎鍒槸x0,y0,x2,y2(鑼冨洿0~1);鐩稿綋浜庡浘褰㈠寘鍥寸洅涓殑鐧惧垎姣斻�傚鏋滄渶鍚庝竴涓弬鏁版槸鈥榯rue鈥欙紝鍒欒鍥涗釜鍊兼槸缁濆鍍忕礌浣嶇疆銆�
- // color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
- // offset: 0,
- // color: 'rgba(0,154,120,1)'
- // },
- // {
- // offset: 1,
- // color: 'rgba(0,0,0, 0)'
- // }
- // ], false),
- // shadowColor: 'rgba(53,142,215, 0.9)', // 闃村奖棰滆壊
- // shadowBlur: 20 // shadowBlur璁惧浘褰㈤槾褰辩殑妯＄硦澶у皬銆傞厤鍚坰hadowColor,shadowOffsetX/Y, 璁剧疆鍥惧舰鐨勯槾褰辨晥鏋溿��
- // }
- // },
- data: yData[1]
- },
- {
- name: legendData[2],
- type: 'line',
- // smooth: true, //鏄惁骞虫粦鏇茬嚎鏄剧ず
- // symbol:'circle', // 榛樿鏄┖蹇冨渾锛堜腑闂存槸鐧借壊鐨勶級锛屾敼鎴愬疄蹇冨渾
- showAllSymbol: true,
- symbol: 'emptyCircle',
- symbolSize: 6,
- lineStyle: {
- normal: {
- color: '#ffa800' // 绾挎潯棰滆壊
- },
- borderColor: '#ffa800'
- },
- label: {
- show: true,
- position: 'top',
- textStyle: {
- fontSize: 16,
- color: '#fff'
- }
- },
- itemStyle: {
- normal: {
- color: '#ffa800'
- }
- },
- tooltip: {
- show: false
- },
- // areaStyle: { // 鍖哄煙濉厖鏍峰紡
- // normal: {
- // // 绾挎�ф笎鍙橈紝鍓�4涓弬鏁板垎鍒槸x0,y0,x2,y2(鑼冨洿0~1);鐩稿綋浜庡浘褰㈠寘鍥寸洅涓殑鐧惧垎姣斻�傚鏋滄渶鍚庝竴涓弬鏁版槸鈥榯rue鈥欙紝鍒欒鍥涗釜鍊兼槸缁濆鍍忕礌浣嶇疆銆�
- // color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
- // offset: 0,
- // color: 'rgba(0,154,120,1)'
- // },
- // {
- // offset: 1,
- // color: 'rgba(0,0,0, 0)'
- // }
- // ], false),
- // shadowColor: 'rgba(53,142,215, 0.9)', // 闃村奖棰滆壊
- // shadowBlur: 20 // shadowBlur璁惧浘褰㈤槾褰辩殑妯＄硦澶у皬銆傞厤鍚坰hadowColor,shadowOffsetX/Y, 璁剧疆鍥惧舰鐨勯槾褰辨晥鏋溿��
- // }
- // },
- data: yData[2]
- },
- {
- name: legendData[3],
- type: 'line',
- // smooth: true, //鏄惁骞虫粦鏇茬嚎鏄剧ず
- // symbol:'circle', // 榛樿鏄┖蹇冨渾锛堜腑闂存槸鐧借壊鐨勶級锛屾敼鎴愬疄蹇冨渾
- showAllSymbol: true,
- symbol: 'emptyCircle',
- symbolSize: 6,
- lineStyle: {
- normal: {
- color: '#ffee00' // 绾挎潯棰滆壊
- },
- borderColor: '#ffee00'
- },
- label: {
- show: true,
- position: 'top',
- textStyle: {
- fontSize: 16,
- color: '#fff'
- }
- },
- itemStyle: {
- normal: {
- color: '#ffee00'
- }
- },
- tooltip: {
- show: false
- },
- // areaStyle: { // 鍖哄煙濉厖鏍峰紡
- // normal: {
- // // 绾挎�ф笎鍙橈紝鍓�4涓弬鏁板垎鍒槸x0,y0,x2,y2(鑼冨洿0~1);鐩稿綋浜庡浘褰㈠寘鍥寸洅涓殑鐧惧垎姣斻�傚鏋滄渶鍚庝竴涓弬鏁版槸鈥榯rue鈥欙紝鍒欒鍥涗釜鍊兼槸缁濆鍍忕礌浣嶇疆銆�
- // color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
- // offset: 0,
- // color: 'rgba(0,154,120,1)'
- // },
- // {
- // offset: 1,
- // color: 'rgba(0,0,0, 0)'
- // }
- // ], false),
- // shadowColor: 'rgba(53,142,215, 0.9)', // 闃村奖棰滆壊
- // shadowBlur: 20 // shadowBlur璁惧浘褰㈤槾褰辩殑妯＄硦澶у皬銆傞厤鍚坰hadowColor,shadowOffsetX/Y, 璁剧疆鍥惧舰鐨勯槾褰辨晥鏋溿��
- // }
- // },
- data: yData[3]
- },
- {
- name: legendData[4],
- type: 'line',
- // smooth: true, //鏄惁骞虫粦鏇茬嚎鏄剧ず
- // symbol:'circle', // 榛樿鏄┖蹇冨渾锛堜腑闂存槸鐧借壊鐨勶級锛屾敼鎴愬疄蹇冨渾
- showAllSymbol: true,
- symbol: 'emptyCircle',
- symbolSize: 6,
- lineStyle: {
- normal: {
- color: '#ff5b00' // 绾挎潯棰滆壊
- },
- borderColor: '#ff5b00'
- },
- label: {
- show: true,
- position: 'top',
- textStyle: {
- fontSize: 16,
- color: '#fff'
- }
- },
- itemStyle: {
- normal: {
- color: '#ff5b00'
- }
- },
- tooltip: {
- show: false
- },
- // areaStyle: { // 鍖哄煙濉厖鏍峰紡
- // normal: {
- // // 绾挎�ф笎鍙橈紝鍓�4涓弬鏁板垎鍒槸x0,y0,x2,y2(鑼冨洿0~1);鐩稿綋浜庡浘褰㈠寘鍥寸洅涓殑鐧惧垎姣斻�傚鏋滄渶鍚庝竴涓弬鏁版槸鈥榯rue鈥欙紝鍒欒鍥涗釜鍊兼槸缁濆鍍忕礌浣嶇疆銆�
- // color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
- // offset: 0,
- // color: 'rgba(0,154,120,1)'
- // },
- // {
- // offset: 1,
- // color: 'rgba(0,0,0, 0)'
- // }
- // ], false),
- // shadowColor: 'rgba(53,142,215, 0.9)', // 闃村奖棰滆壊
- // shadowBlur: 20 // shadowBlur璁惧浘褰㈤槾褰辩殑妯＄硦澶у皬銆傞厤鍚坰hadowColor,shadowOffsetX/Y, 璁剧疆鍥惧舰鐨勯槾褰辨晥鏋溿��
- // }
- // },
- data: yData[4]
+ data: yData
}
+ // {
+ // name: legendData[1],
+ // type: 'line',
+ // // smooth: true, //鏄惁骞虫粦鏇茬嚎鏄剧ず
+ // // symbol:'circle', // 榛樿鏄┖蹇冨渾锛堜腑闂存槸鐧借壊鐨勶級锛屾敼鎴愬疄蹇冨渾
+ // showAllSymbol: true,
+ // symbol: 'emptyCircle',
+ // symbolSize: 6,
+ // lineStyle: {
+ // normal: {
+ // color: '#ff3000' // 绾挎潯棰滆壊
+ // },
+ // borderColor: '#ff3000'
+ // },
+ // label: {
+ // show: true,
+ // position: 'top',
+ // textStyle: {
+ // fontSize: 16,
+ // color: '#fff'
+ // }
+ // },
+ // itemStyle: {
+ // normal: {
+ // color: '#ff3000'
+ // }
+ // },
+ // tooltip: {
+ // show: false
+ // },
+ // // areaStyle: { // 鍖哄煙濉厖鏍峰紡
+ // // normal: {
+ // // // 绾挎�ф笎鍙橈紝鍓�4涓弬鏁板垎鍒槸x0,y0,x2,y2(鑼冨洿0~1);鐩稿綋浜庡浘褰㈠寘鍥寸洅涓殑鐧惧垎姣斻�傚鏋滄渶鍚庝竴涓弬鏁版槸鈥榯rue鈥欙紝鍒欒鍥涗釜鍊兼槸缁濆鍍忕礌浣嶇疆銆�
+ // // color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+ // // offset: 0,
+ // // color: 'rgba(0,154,120,1)'
+ // // },
+ // // {
+ // // offset: 1,
+ // // color: 'rgba(0,0,0, 0)'
+ // // }
+ // // ], false),
+ // // shadowColor: 'rgba(53,142,215, 0.9)', // 闃村奖棰滆壊
+ // // shadowBlur: 20 // shadowBlur璁惧浘褰㈤槾褰辩殑妯＄硦澶у皬銆傞厤鍚坰hadowColor,shadowOffsetX/Y, 璁剧疆鍥惧舰鐨勯槾褰辨晥鏋溿��
+ // // }
+ // // },
+ // data: yData[1]
+ // },
+ // {
+ // name: legendData[2],
+ // type: 'line',
+ // // smooth: true, //鏄惁骞虫粦鏇茬嚎鏄剧ず
+ // // symbol:'circle', // 榛樿鏄┖蹇冨渾锛堜腑闂存槸鐧借壊鐨勶級锛屾敼鎴愬疄蹇冨渾
+ // showAllSymbol: true,
+ // symbol: 'emptyCircle',
+ // symbolSize: 6,
+ // lineStyle: {
+ // normal: {
+ // color: '#ffa800' // 绾挎潯棰滆壊
+ // },
+ // borderColor: '#ffa800'
+ // },
+ // label: {
+ // show: true,
+ // position: 'top',
+ // textStyle: {
+ // fontSize: 16,
+ // color: '#fff'
+ // }
+ // },
+ // itemStyle: {
+ // normal: {
+ // color: '#ffa800'
+ // }
+ // },
+ // tooltip: {
+ // show: false
+ // },
+ // // areaStyle: { // 鍖哄煙濉厖鏍峰紡
+ // // normal: {
+ // // // 绾挎�ф笎鍙橈紝鍓�4涓弬鏁板垎鍒槸x0,y0,x2,y2(鑼冨洿0~1);鐩稿綋浜庡浘褰㈠寘鍥寸洅涓殑鐧惧垎姣斻�傚鏋滄渶鍚庝竴涓弬鏁版槸鈥榯rue鈥欙紝鍒欒鍥涗釜鍊兼槸缁濆鍍忕礌浣嶇疆銆�
+ // // color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+ // // offset: 0,
+ // // color: 'rgba(0,154,120,1)'
+ // // },
+ // // {
+ // // offset: 1,
+ // // color: 'rgba(0,0,0, 0)'
+ // // }
+ // // ], false),
+ // // shadowColor: 'rgba(53,142,215, 0.9)', // 闃村奖棰滆壊
+ // // shadowBlur: 20 // shadowBlur璁惧浘褰㈤槾褰辩殑妯＄硦澶у皬銆傞厤鍚坰hadowColor,shadowOffsetX/Y, 璁剧疆鍥惧舰鐨勯槾褰辨晥鏋溿��
+ // // }
+ // // },
+ // data: yData[2]
+ // },
+ // {
+ // name: legendData[3],
+ // type: 'line',
+ // // smooth: true, //鏄惁骞虫粦鏇茬嚎鏄剧ず
+ // // symbol:'circle', // 榛樿鏄┖蹇冨渾锛堜腑闂存槸鐧借壊鐨勶級锛屾敼鎴愬疄蹇冨渾
+ // showAllSymbol: true,
+ // symbol: 'emptyCircle',
+ // symbolSize: 6,
+ // lineStyle: {
+ // normal: {
+ // color: '#ffee00' // 绾挎潯棰滆壊
+ // },
+ // borderColor: '#ffee00'
+ // },
+ // label: {
+ // show: true,
+ // position: 'top',
+ // textStyle: {
+ // fontSize: 16,
+ // color: '#fff'
+ // }
+ // },
+ // itemStyle: {
+ // normal: {
+ // color: '#ffee00'
+ // }
+ // },
+ // tooltip: {
+ // show: false
+ // },
+ // // areaStyle: { // 鍖哄煙濉厖鏍峰紡
+ // // normal: {
+ // // // 绾挎�ф笎鍙橈紝鍓�4涓弬鏁板垎鍒槸x0,y0,x2,y2(鑼冨洿0~1);鐩稿綋浜庡浘褰㈠寘鍥寸洅涓殑鐧惧垎姣斻�傚鏋滄渶鍚庝竴涓弬鏁版槸鈥榯rue鈥欙紝鍒欒鍥涗釜鍊兼槸缁濆鍍忕礌浣嶇疆銆�
+ // // color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+ // // offset: 0,
+ // // color: 'rgba(0,154,120,1)'
+ // // },
+ // // {
+ // // offset: 1,
+ // // color: 'rgba(0,0,0, 0)'
+ // // }
+ // // ], false),
+ // // shadowColor: 'rgba(53,142,215, 0.9)', // 闃村奖棰滆壊
+ // // shadowBlur: 20 // shadowBlur璁惧浘褰㈤槾褰辩殑妯＄硦澶у皬銆傞厤鍚坰hadowColor,shadowOffsetX/Y, 璁剧疆鍥惧舰鐨勯槾褰辨晥鏋溿��
+ // // }
+ // // },
+ // data: yData[3]
+ // },
+ // {
+ // name: legendData[4],
+ // type: 'line',
+ // // smooth: true, //鏄惁骞虫粦鏇茬嚎鏄剧ず
+ // // symbol:'circle', // 榛樿鏄┖蹇冨渾锛堜腑闂存槸鐧借壊鐨勶級锛屾敼鎴愬疄蹇冨渾
+ // showAllSymbol: true,
+ // symbol: 'emptyCircle',
+ // symbolSize: 6,
+ // lineStyle: {
+ // normal: {
+ // color: '#ff5b00' // 绾挎潯棰滆壊
+ // },
+ // borderColor: '#ff5b00'
+ // },
+ // label: {
+ // show: true,
+ // position: 'top',
+ // textStyle: {
+ // fontSize: 16,
+ // color: '#fff'
+ // }
+ // },
+ // itemStyle: {
+ // normal: {
+ // color: '#ff5b00'
+ // }
+ // },
+ // tooltip: {
+ // show: false
+ // },
+ // // areaStyle: { // 鍖哄煙濉厖鏍峰紡
+ // // normal: {
+ // // // 绾挎�ф笎鍙橈紝鍓�4涓弬鏁板垎鍒槸x0,y0,x2,y2(鑼冨洿0~1);鐩稿綋浜庡浘褰㈠寘鍥寸洅涓殑鐧惧垎姣斻�傚鏋滄渶鍚庝竴涓弬鏁版槸鈥榯rue鈥欙紝鍒欒鍥涗釜鍊兼槸缁濆鍍忕礌浣嶇疆銆�
+ // // color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+ // // offset: 0,
+ // // color: 'rgba(0,154,120,1)'
+ // // },
+ // // {
+ // // offset: 1,
+ // // color: 'rgba(0,0,0, 0)'
+ // // }
+ // // ], false),
+ // // shadowColor: 'rgba(53,142,215, 0.9)', // 闃村奖棰滆壊
+ // // shadowBlur: 20 // shadowBlur璁惧浘褰㈤槾褰辩殑妯＄硦澶у皬銆傞厤鍚坰hadowColor,shadowOffsetX/Y, 璁剧疆鍥惧舰鐨勯槾褰辨晥鏋溿��
+ // // }
+ // // },
+ // data: yData[4]
+ // }
]
}
}
@@ -2786,200 +2787,9 @@
// shadowBlur: 20 // shadowBlur璁惧浘褰㈤槾褰辩殑妯＄硦澶у皬銆傞厤鍚坰hadowColor,shadowOffsetX/Y, 璁剧疆鍥惧舰鐨勯槾褰辨晥鏋溿��
// }
// },
- data: yData[0]
- },
- {
- name: legendData[1],
- type: 'line',
- // smooth: true, //鏄惁骞虫粦鏇茬嚎鏄剧ず
- // symbol:'circle', // 榛樿鏄┖蹇冨渾锛堜腑闂存槸鐧借壊鐨勶級锛屾敼鎴愬疄蹇冨渾
- showAllSymbol: true,
- symbol: 'emptyCircle',
- symbolSize: 6,
- lineStyle: {
- normal: {
- color: '#ff3000' // 绾挎潯棰滆壊
- },
- borderColor: '#ff3000'
- },
- label: {
- show: true,
- position: 'top',
- textStyle: {
- fontSize: 16,
- color: '#fff'
- }
- },
- itemStyle: {
- normal: {
- color: '#ff3000'
- }
- },
- tooltip: {
- show: false
- },
- // areaStyle: { // 鍖哄煙濉厖鏍峰紡
- // normal: {
- // // 绾挎�ф笎鍙橈紝鍓�4涓弬鏁板垎鍒槸x0,y0,x2,y2(鑼冨洿0~1);鐩稿綋浜庡浘褰㈠寘鍥寸洅涓殑鐧惧垎姣斻�傚鏋滄渶鍚庝竴涓弬鏁版槸鈥榯rue鈥欙紝鍒欒鍥涗釜鍊兼槸缁濆鍍忕礌浣嶇疆銆�
- // color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
- // offset: 0,
- // color: 'rgba(0,154,120,1)'
- // },
- // {
- // offset: 1,
- // color: 'rgba(0,0,0, 0)'
- // }
- // ], false),
- // shadowColor: 'rgba(53,142,215, 0.9)', // 闃村奖棰滆壊
- // shadowBlur: 20 // shadowBlur璁惧浘褰㈤槾褰辩殑妯＄硦澶у皬銆傞厤鍚坰hadowColor,shadowOffsetX/Y, 璁剧疆鍥惧舰鐨勯槾褰辨晥鏋溿��
- // }
- // },
- data: yData[1]
- },
- {
- name: legendData[2],
- type: 'line',
- // smooth: true, //鏄惁骞虫粦鏇茬嚎鏄剧ず
- // symbol:'circle', // 榛樿鏄┖蹇冨渾锛堜腑闂存槸鐧借壊鐨勶級锛屾敼鎴愬疄蹇冨渾
- showAllSymbol: true,
- symbol: 'emptyCircle',
- symbolSize: 6,
- lineStyle: {
- normal: {
- color: '#ffa800' // 绾挎潯棰滆壊
- },
- borderColor: '#ffa800'
- },
- label: {
- show: true,
- position: 'top',
- textStyle: {
- fontSize: 16,
- color: '#fff'
- }
- },
- itemStyle: {
- normal: {
- color: '#ffa800'
- }
- },
- tooltip: {
- show: false
- },
- // areaStyle: { // 鍖哄煙濉厖鏍峰紡
- // normal: {
- // // 绾挎�ф笎鍙橈紝鍓�4涓弬鏁板垎鍒槸x0,y0,x2,y2(鑼冨洿0~1);鐩稿綋浜庡浘褰㈠寘鍥寸洅涓殑鐧惧垎姣斻�傚鏋滄渶鍚庝竴涓弬鏁版槸鈥榯rue鈥欙紝鍒欒鍥涗釜鍊兼槸缁濆鍍忕礌浣嶇疆銆�
- // color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
- // offset: 0,
- // color: 'rgba(0,154,120,1)'
- // },
- // {
- // offset: 1,
- // color: 'rgba(0,0,0, 0)'
- // }
- // ], false),
- // shadowColor: 'rgba(53,142,215, 0.9)', // 闃村奖棰滆壊
- // shadowBlur: 20 // shadowBlur璁惧浘褰㈤槾褰辩殑妯＄硦澶у皬銆傞厤鍚坰hadowColor,shadowOffsetX/Y, 璁剧疆鍥惧舰鐨勯槾褰辨晥鏋溿��
- // }
- // },
- data: yData[2]
- },
- {
- name: legendData[3],
- type: 'line',
- // smooth: true, //鏄惁骞虫粦鏇茬嚎鏄剧ず
- // symbol:'circle', // 榛樿鏄┖蹇冨渾锛堜腑闂存槸鐧借壊鐨勶級锛屾敼鎴愬疄蹇冨渾
- showAllSymbol: true,
- symbol: 'emptyCircle',
- symbolSize: 6,
- lineStyle: {
- normal: {
- color: '#ffee00' // 绾挎潯棰滆壊
- },
- borderColor: '#ffee00'
- },
- label: {
- show: true,
- position: 'top',
- textStyle: {
- fontSize: 16,
- color: '#fff'
- }
- },
- itemStyle: {
- normal: {
- color: '#ffee00'
- }
- },
- tooltip: {
- show: false
- },
- // areaStyle: { // 鍖哄煙濉厖鏍峰紡
- // normal: {
- // // 绾挎�ф笎鍙橈紝鍓�4涓弬鏁板垎鍒槸x0,y0,x2,y2(鑼冨洿0~1);鐩稿綋浜庡浘褰㈠寘鍥寸洅涓殑鐧惧垎姣斻�傚鏋滄渶鍚庝竴涓弬鏁版槸鈥榯rue鈥欙紝鍒欒鍥涗釜鍊兼槸缁濆鍍忕礌浣嶇疆銆�
- // color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
- // offset: 0,
- // color: 'rgba(0,154,120,1)'
- // },
- // {
- // offset: 1,
- // color: 'rgba(0,0,0, 0)'
- // }
- // ], false),
- // shadowColor: 'rgba(53,142,215, 0.9)', // 闃村奖棰滆壊
- // shadowBlur: 20 // shadowBlur璁惧浘褰㈤槾褰辩殑妯＄硦澶у皬銆傞厤鍚坰hadowColor,shadowOffsetX/Y, 璁剧疆鍥惧舰鐨勯槾褰辨晥鏋溿��
- // }
- // },
- data: yData[3]
- },
- {
- name: legendData[4],
- type: 'line',
- // smooth: true, //鏄惁骞虫粦鏇茬嚎鏄剧ず
- // symbol:'circle', // 榛樿鏄┖蹇冨渾锛堜腑闂存槸鐧借壊鐨勶級锛屾敼鎴愬疄蹇冨渾
- showAllSymbol: true,
- symbol: 'emptyCircle',
- symbolSize: 6,
- lineStyle: {
- normal: {
- color: '#ff5b00' // 绾挎潯棰滆壊
- },
- borderColor: '#ff5b00'
- },
- label: {
- show: true,
- position: 'top',
- textStyle: {
- fontSize: 16,
- color: '#fff'
- }
- },
- itemStyle: {
- normal: {
- color: '#ff5b00'
- }
- },
- tooltip: {
- show: false
- },
- // areaStyle: { // 鍖哄煙濉厖鏍峰紡
- // normal: {
- // // 绾挎�ф笎鍙橈紝鍓�4涓弬鏁板垎鍒槸x0,y0,x2,y2(鑼冨洿0~1);鐩稿綋浜庡浘褰㈠寘鍥寸洅涓殑鐧惧垎姣斻�傚鏋滄渶鍚庝竴涓弬鏁版槸鈥榯rue鈥欙紝鍒欒鍥涗釜鍊兼槸缁濆鍍忕礌浣嶇疆銆�
- // color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
- // offset: 0,
- // color: 'rgba(0,154,120,1)'
- // },
- // {
- // offset: 1,
- // color: 'rgba(0,0,0, 0)'
- // }
- // ], false),
- // shadowColor: 'rgba(53,142,215, 0.9)', // 闃村奖棰滆壊
- // shadowBlur: 20 // shadowBlur璁惧浘褰㈤槾褰辩殑妯＄硦澶у皬銆傞厤鍚坰hadowColor,shadowOffsetX/Y, 璁剧疆鍥惧舰鐨勯槾褰辨晥鏋溿��
- // }
- // },
- data: yData[4]
+ data: yData
}
+
]
}
}
@@ -3122,3 +2932,139 @@
return option
}
+
+export function zhkb04(dataX, dataY) {
+ const option = {
+ backgroundColor: 'transparent',
+ // tooltip: {
+ // trigger: 'axis',
+ // axisPointer: {
+ // type: 'shadow'
+ // }
+ // },
+ grid: {
+ left: '2%',
+ right: '2%',
+ bottom: '5%',
+ top: '20%',
+ containLabel: true
+ },
+ xAxis: [{
+ type: 'category',
+ data: dataX,
+ boundaryGap: true,
+ axisLabel: {
+ interval: 0,
+ formatter: '{value}',
+ fontSize: 16,
+ margin: 20,
+ textStyle: {
+ color: colorX
+ }
+ },
+ axisLine: {
+ lineStyle: {
+ color: '#032c58'
+ }
+ },
+ splitLine: {
+ show: false,
+ lineStyle: {
+ color: '#032c58'
+ }
+ },
+ axisTick: {
+ show: false
+ }
+ }],
+ yAxis: [
+ {
+ // max: 800,
+ boundaryGap: false,
+ splitNumber: 4,
+ type: 'value',
+ axisLabel: {
+ textStyle: {
+ fontSize: 18,
+ color: colorX
+ }
+ },
+ // name: '鍗�',
+ // nameTextStyle: {
+ // color: colorY,
+ // fontSize: 14,
+ // lineHeight: 20
+ // },
+ splitLine: {
+ show: true,
+ lineStyle: {
+ color: '#032c58'
+ }
+ },
+ axisLine: {
+ show: true,
+ lineStyle: {
+ color: '#032c58'
+ }
+ },
+ axisTick: {
+ show: true
+ }
+ }
+ ],
+ series: [{
+ type: 'bar',
+ data: dataY,
+ barWidth: '20px',
+ itemStyle: {
+ normal: {
+ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+ offset: 0,
+ color: 'rgba(0,244,255,1)' // 0% 澶勭殑棰滆壊
+ }, {
+ offset: 1,
+ color: 'rgba(0,77,167,1)' // 100% 澶勭殑棰滆壊
+ }], false),
+ barBorderRadius: [30, 30, 0, 0],
+ shadowColor: 'rgba(0,160,221,1)',
+ shadowBlur: 4
+ }
+ },
+ label: {
+ normal: {
+ show: true,
+ lineHeight: 30,
+ width: 80,
+ height: 30,
+ backgroundColor: 'rgba(0,160,221,0.1)',
+ borderRadius: 200,
+ position: ['-8', '-60'],
+ distance: 1,
+ formatter: [
+ ' {d|鈼弣',
+ ' {a|{c}} \n',
+ ' {b|}'
+ ].join(','),
+ rich: {
+ d: {
+ color: '#3CDDCF'
+ },
+ a: {
+ color: '#fff',
+ align: 'center',
+ fontSize: '18'
+ },
+ b: {
+ width: 1,
+ height: 30,
+ borderWidth: 1,
+ borderColor: '#234e6c',
+ align: 'left'
+ }
+ }
+ }
+ }
+ }]
+ }
+ return option
+}
diff --git a/src/views/kanbanManager/cj.vue b/src/views/kanbanManager/cj.vue
index d312daf..39484e1 100644
--- a/src/views/kanbanManager/cj.vue
+++ b/src/views/kanbanManager/cj.vue
@@ -6,11 +6,11 @@
<div class="kb_header">
<div class="kb_headTime" style="top: 35px;left: 20px">
- <span>姘稿悍甯傚法绔嬮槻鎶ょ敤鍝佹湁闄愬叕鍙�</span>
+ <span>娴欐睙绫宠埅绉戞妧鏈夐檺鍏徃</span>
</div>
- <div class="kb_headTime kb_header_text" style="top: 35px;left: 765px">
- <span>{{ title }}鏁板瓧鍖栫湅鏉�</span>
+ <div class="kb_headTime kb_header_text" style="top: 35px;left: 800px">
+ <span>瑁呴厤杞﹂棿鏁板瓧鍖栫湅鏉�</span>
</div>
<div class="kb_headTime" style="top: 35px;right: 25px">
@@ -186,11 +186,42 @@
}, 1000 * 60 * 120)
},
mounted() {
+ // 鐩戝惉缃戠粶鏄惁鍦ㄧ嚎
+ window.addEventListener('online', this.updateOnlineStatus)
+ window.addEventListener('offline', this.updateOnlineStatus)
+ this.updateOnlineStatus({ type: this.onLine ? 'online' : 'offline', isFirst: true })
+
this.getAllApi()
},
+ beforeDestroy() {
+ window.removeEventListener('online', this.updateOnlineStatus)
+ window.removeEventListener('offline', this.updateOnlineStatus)
+ },
methods: {
+ // 鏇存柊缃戠粶鐘舵��
+ updateOnlineStatus(e) {
+ if (e.isFirst) {
+ // console.log('x')
+ } else {
+ const loading = this.$loading({
+ lock: true,
+ text: '鏂綉浜嗭紝姝ｅ湪鎷煎懡鑱旂綉涓紝璇锋鏌ョ綉缁滄槸鍚︽甯�...',
+ spinner: 'el-icon-loading',
+ customClass: 'osloading',
+ background: 'rgba(0, 0, 0, 0.7)'
+ })
+ const { type } = e
+ this.onLine = type === 'online'
+ if (this.onLine) {
+ loading.close()
+ this.$message.success('缃戠粶杩炴帴鎴愬姛锛�')
+ } else {
+ this.$message.error('缃戠粶鎺夌嚎锛岃鍏虫敞缃戠粶鐘舵�侊紒')
+ }
+ }
+ },
async getWorkShopProduceTopData() {
- WorkShopProduceTopData({ wkshopcode: this.wkshopcode.join(',') }).then(res => {
+ WorkShopProduceTopData().then(res => {
this.tableDataCenterTop = res.data
const divData = this.$refs.tableDataLeftCenterRef.bodyWrapper
@@ -199,7 +230,7 @@
divData.scrollTop += 1
if (divData.clientHeight + divData.scrollTop === divData.scrollHeight) {
divData.scrollTop = 0
- WorkShopProduceTopData({ wkshopcode: this.wkshopcode.join(',') }).then(res => {
+ WorkShopProduceTopData().then(res => {
this.tableDataCenterTop = res.data
if (this.tableDataCenterTop.length > 11) {
@@ -208,57 +239,46 @@
}
})
}
- }, this.tableDataCenterTop.length <= 11 ? 1000 * 15 : 200)
+ }, this.tableDataCenterTop.length <= 11 ? 1000 * 30 : 200)
})
},
async getAllApi() {
- const res = await PrentOrganizationNoCompany()
- this.wkshopArr = res.data
+ // const res = await PrentOrganizationNoCompany()
+ // this.wkshopArr = res.data
- if (window.location.hash.indexOf('?') !== -1) {
- const code = window.location.hash.split('?')[1].split('=')[1]
- this.title = this.wkshopArr.find(i => i.torg_code === code).torg_name
- this.wkshopcode = [code]
- }
+ // if (window.location.hash.indexOf('?') !== -1) {
+ // const code = window.location.hash.split('?')[1].split('=')[1]
+ // this.title = this.wkshopArr.find(i => i.torg_code === code).torg_name
+ // this.wkshopcode = [code]
+ // }
+ //
+ // this.wkshopcode.forEach(i => {
+ // const aa = this.wkshopArr.find(j => j.torg_code === i).torg_name
+ // this.legendData.push(aa)
+ // })
- this.wkshopcode.forEach(i => {
- const aa = this.wkshopArr.find(j => j.torg_code === i).torg_name
- this.legendData.push(aa)
- })
+ const res4 = await WorkShopProduceBottomLeftData()
+ this.cjzl03_xData = res4.data.map(i => i.click_date)
+ this.cjzl03_yData = res4.data.map(i => i.count)
- const res4 = await WorkShopProduceBottomLeftData({ wkshopcode: this.wkshopcode.join(',') })
- this.cjzl03_xData = res4.data[this.wkshopcode[0]].map(i => i.click_date)
- for (const res4Key in res4.data) {
- if (this.wkshopcode.includes(res4Key)) {
- const bb = res4.data[res4Key].map(i => i.count)
- this.cjzl03_yData.push(bb)
- }
- }
loadEcharts('cjzl03', cjzl03_2(this.cjzl03_xData, this.legendData, this.cjzl03_yData, true))
setInterval(() => {
- WorkShopProduceBottomLeftData({ wkshopcode: this.wkshopcode.join(',') }).then(res4 => {
- this.cjzl03_yData = []
-
- this.cjzl03_xData = res4.data[this.wkshopcode[0]].map(i => i.click_date)
- for (const res4Key in res4.data) {
- if (this.wkshopcode.includes(res4Key)) {
- const bb = res4.data[res4Key].map(i => i.count)
- this.cjzl03_yData.push(bb)
- }
- }
+ WorkShopProduceBottomLeftData().then(res4 => {
+ this.cjzl03_xData = res4.data.map(i => i.click_date)
+ this.cjzl03_yData = res4.data.map(i => i.count)
loadEcharts('cjzl03', cjzl03_2(this.cjzl03_xData, this.legendData, this.cjzl03_yData, true))
})
}, 1000 * 50)
- const res5 = await WorkShopProduceBottomRightData({ wkshopcode: 'CJ001' })
+ const res5 = await WorkShopProduceBottomRightData()
this.RightBottom = res5.data
if (this.RightBottom.length > 0) {
loadEcharts('cjzl04', cjzl04(this.RightBottom.map(i => i.name), this.RightBottom.map(i => i.cont)))
}
setInterval(() => {
- WorkShopProduceBottomRightData({ wkshopcode: 'CJ001' }).then(res5 => {
+ WorkShopProduceBottomRightData().then(res5 => {
this.RightBottom = res5.data
if (this.RightBottom.length > 0) {
loadEcharts('cjzl04', cjzl04(this.RightBottom.map(i => i.name), this.RightBottom.map(i => i.cont)))
@@ -266,7 +286,7 @@
})
}, 1000 * 60)
- this.getWorkShopProduceTopData()
+ await this.getWorkShopProduceTopData()
},
// 鑾峰彇褰撳墠鏃堕棿
diff --git a/src/views/kanbanManager/ckgl.vue b/src/views/kanbanManager/ckgl.vue
index 1b94f5f..0483999 100644
--- a/src/views/kanbanManager/ckgl.vue
+++ b/src/views/kanbanManager/ckgl.vue
@@ -2,34 +2,29 @@
<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_backgroundCustom" />
<div class="kb_header">
- <div class="flex_c_c kb_header_text">
- <div id="topBarLeft" style="width:600px;height:100%" />
- 浠撳簱绠＄悊鏁板瓧鍖栫湅鏉�
- <div id="topBarRight" style="width:600px;height:100%;transform:rotate(180deg);" />
+ <div class="kb_headTime" style="top: 35px;left: 20px">
+ <span>娴欐睙绫宠埅绉戞妧鏈夐檺鍏徃</span>
</div>
- <div class="kb_headTime" style="left: 85px">
- <span>娴欐睙鏂板嚡杩暟瀛楃鎶�鑲′唤鏈夐檺鍏徃</span>
+ <div class="kb_headTime kb_header_text" style="top: 35px;left: 800px">
+ <span>浠撳簱绠＄悊鏁板瓧鍖栫湅鏉�</span>
</div>
- <div class="kb_headTime">
+ <div class="kb_headTime" style="top: 35px;right: 25px">
<span>{{ headTime }}</span>
</div>
</div>
- <div style="display: flex;justify-content: space-between;padding:0 20px 20px 20px;height: 980px">
- <div style="width: 1350px; " class="flex_c_b">
+
+ <div style="display: flex;justify-content: space-between;padding:0 20px 20px 20px;height: 950px">
+ <div style="width: 1350px;z-index: 2;margin-top: 50px;" class="flex_c_b">
<div style="height: 470px;">
<div class="smallTitle">
<svg-icon icon-class="cpdrk" class="svg_class" />
鐢熶骇寰呭叆搴�
</div>
- <div class="lineContent horn" style="height: 435px">
+ <div class="lineContent horn" style="height: 410px">
<el-table
ref="tableDataTopRef"
:data="tableDataTop"
@@ -37,7 +32,7 @@
class="tableData"
:header-cell-style="headerCellStyleCenter"
:cell-style="cellStyleCenter"
- height="430"
+ height="405"
>
<el-table-column
prop="voucherdate"
@@ -70,41 +65,41 @@
<el-table-column
prop="saleOrderCode"
label="閿�鍞鍗曞彿"
- width="200"
+ width="190"
>
<template slot-scope="{row}">
<div v-if="row.saleOrderCode" class="ellipsis">{{ row.saleOrderCode }}</div>
<div v-else>/</div>
</template>
</el-table-column>
- <el-table-column
- prop="materiel_code"
- label="浜у搧缂栧彿"
- width="136"
- >
- <template slot-scope="{row}">
- <div class="ellipsis">{{ row.materiel_code }}</div>
- </template>
- </el-table-column>
+ <!-- <el-table-column-->
+ <!-- prop="materiel_code"-->
+ <!-- label="浜у搧缂栧彿"-->
+ <!-- width="136"-->
+ <!-- >-->
+ <!-- <template slot-scope="{row}">-->
+ <!-- <div class="ellipsis">{{ row.materiel_code }}</div>-->
+ <!-- </template>-->
+ <!-- </el-table-column>-->
<el-table-column
prop="materiel_name"
label="浜у搧鍚嶇О"
- width="180"
+ width="190"
>
<template slot-scope="{row}">
<div class="ellipsis">{{ row.materiel_name }}</div>
</template>
</el-table-column>
- <!-- <el-table-column-->
- <!-- prop="specification"-->
- <!-- label="瑙勬牸鍨嬪彿"-->
- <!-- width="128"-->
- <!-- >-->
- <!-- <template slot-scope="{row}">-->
- <!-- <div v-if="row.specification" class="ellipsis">{{ row.specification }}</div>-->
- <!-- <div v-else>/</div>-->
- <!-- </template>-->
- <!-- </el-table-column>-->
+ <el-table-column
+ prop="specification"
+ label="瑙勬牸鍨嬪彿"
+ width="126"
+ >
+ <template slot-scope="{row}">
+ <div v-if="row.specification" class="ellipsis">{{ row.specification }}</div>
+ <div v-else>/</div>
+ </template>
+ </el-table-column>
<el-table-column
prop="stck_name"
label="棰勫叆浠撳簱"
@@ -123,7 +118,7 @@
<el-table-column
prop="totalStockInQuantity"
label="宸插叆搴撴暟閲�"
- width="100"
+ width="110"
>
<template slot-scope="{row}">
<div v-if="row.totalStockInQuantity">{{ row.totalStockInQuantity }}</div>
@@ -158,12 +153,12 @@
</el-table>
</div>
</div>
- <div style="height: 470px;">
+ <div style="height: 470px;margin-top: 30px;">
<div class="smallTitle">
<svg-icon icon-class="cpdfh" class="svg_class" />
浜у搧寰呭彂璐�
</div>
- <div class="lineContent horn" style="height: 435px">
+ <div class="lineContent horn" style="height: 410px">
<el-table
ref="tableDataBottomRef"
:data="tableDataBottom"
@@ -171,7 +166,7 @@
class="tableData"
:header-cell-style="headerCellStyleCenter"
:cell-style="cellStyleCenter"
- height="430"
+ height="405"
>
<el-table-column
prop="voucherdate"
@@ -192,60 +187,26 @@
<div class="ellipsis">{{ row.wo }}</div>
</template>
</el-table-column>
- <el-table-column
- prop="customename"
- label="瀹㈡埛"
- width="388"
- >
- <template slot-scope="{row}">
- <div v-if="row.customename" class="ellipsis">{{ row.customename }}</div>
- <div v-else>/</div>
- </template>
- </el-table-column>
- <!-- <el-table-column-->
- <!-- prop="username"-->
- <!-- label="涓氬姟鍛�"-->
- <!-- width="65"-->
- <!-- >-->
- <!-- <template slot-scope="{row}">-->
- <!-- <div v-if="row.username" class="ellipsis">{{ row.username }}</div>-->
- <!-- <div v-else>/</div>-->
- <!-- </template>-->
- <!-- </el-table-column>-->
- <!-- <el-table-column-->
- <!-- prop="SourceVoucherCode"-->
- <!-- label="鏉ユ簮鍗曞彿"-->
- <!-- width="185"-->
- <!-- >-->
- <!-- <template slot-scope="{row}">-->
- <!-- <div v-if="row.SourceVoucherCode" class="ellipsis">{{ row.SourceVoucherCode }}</div>-->
- <!-- <div v-else>/</div>-->
- <!-- </template>-->
- <!-- </el-table-column>-->
- <!-- <el-table-column-->
- <!-- prop="materiel_code"-->
- <!-- label="浜у搧缂栧彿"-->
- <!-- width="96"-->
- <!-- />-->
+
<el-table-column
prop="materiel_name"
label="浜у搧鍚嶇О"
- width="200"
+ width="288"
>
<template slot-scope="{row}">
<div v-if="row.materiel_name" class="ellipsis">{{ row.materiel_name }}</div>
</template>
</el-table-column>
- <!-- <el-table-column-->
- <!-- prop="specification"-->
- <!-- label="瑙勬牸鍨嬪彿"-->
- <!-- width="100"-->
- <!-- >-->
- <!-- <template slot-scope="{row}">-->
- <!-- <div v-if="row.specification" class="ellipsis">{{ row.specification }}</div>-->
- <!-- <div v-else>/</div>-->
- <!-- </template>-->
- <!-- </el-table-column>-->
+ <el-table-column
+ prop="specification"
+ label="瑙勬牸鍨嬪彿"
+ width="300"
+ >
+ <template slot-scope="{row}">
+ <div v-if="row.specification" class="ellipsis">{{ row.specification }}</div>
+ <div v-else>/</div>
+ </template>
+ </el-table-column>
<el-table-column
prop="quantity"
label="鏁伴噺"
@@ -265,33 +226,14 @@
<div v-else>0</div>
</template>
</el-table-column>
- <!-- <el-table-column-->
- <!-- prop="priuserdefnvc1"-->
- <!-- label="妫�楠屾柟寮�"-->
- <!-- width="110"-->
- <!-- >-->
- <!-- <template slot-scope="{row}">-->
- <!-- <div v-if="row.priuserdefnvc1">{{ row.priuserdefnvc1 }}</div>-->
- <!-- <div v-else>/</div>-->
- <!-- </template>-->
- <!-- </el-table-column>-->
- <!-- <el-table-column-->
- <!-- prop="priuserdefnvc2"-->
- <!-- label="妫�楠屼汉鍛�"-->
- <!-- width="110"-->
- <!-- >-->
- <!-- <template slot-scope="{row}">-->
- <!-- <div v-if="row.priuserdefnvc2">{{ row.priuserdefnvc2 }}</div>-->
- <!-- <div v-else>/</div>-->
- <!-- </template>-->
- <!-- </el-table-column>-->
+
<el-table-column
prop="deliveryDate"
label="棰勮浜よ揣鏃ユ湡"
width="200"
>
<template slot-scope="{row}">
- <div v-if="row.deliveryDate">{{ row.deliveryDate.substring(0,10) }}</div>
+ <div v-if="row.deliveryDate">{{ row.deliveryDate.substring(0, 10) }}</div>
<div v-else>/</div>
</template>
</el-table-column>
@@ -300,27 +242,57 @@
</div>
</div>
- <div style="width: 500px;" class="flex_c_b">
- <div style="height: 470px;">
+ <div style="width: 500px;z-index: 2;margin-top: 50px;" class="flex_c_b">
+ <div>
<div class="smallTitle">
<svg-icon icon-class="ph" class="svg_class" />
- 鍗婃垚鍝併�佷骇鍝佸簱瀛橀噺鎺掕Top5
+ 搴撳瓨閲�
</div>
- <div class="lineContent horn" style="height: 435px">
- <div id="bar03" style="width: 100%;height:100%; " />
- <!--/* <div id="bar03" style="width: 100%;height:100%;margin-left: -25px;margin-top: -10px" />*/-->
+ <div class="lineContent horn" style="height: 885px">
+ <el-table
+ ref="tableDataRightRef"
+ :data="tableDataRight"
+ style="width: 100%;"
+ class="tableData"
+ :header-cell-style="headerCellStyleCenter"
+ :cell-style="cellStyleCenter"
+ height="870"
+ >
+
+ <el-table-column
+ prop="FErpCls"
+ label="绫诲瀷"
+ >
+ <template slot-scope="{row}">
+ <div v-if="row.FErpCls" class="ellipsis">{{ row.FErpCls }}</div>
+ <div v-else>/</div>
+ </template>
+ </el-table-column>
+ <el-table-column
+ prop="FStockName"
+ label="浠撳簱"
+ width="200"
+ >
+ <template slot-scope="{row}">
+ <div v-if="row.FStockName" class="ellipsis">{{ row.FStockName }}</div>
+ <div v-else>/</div>
+ </template>
+ </el-table-column>
+
+ <el-table-column
+ prop="FCUUQty"
+ label="搴撳瓨閲�"
+ >
+ <template slot-scope="{row}">
+ <div v-if="row.FCUUQty">{{ row.FCUUQty }}</div>
+ <div v-else>0</div>
+ </template>
+ </el-table-column>
+
+ </el-table>
</div>
</div>
- <div style="height: 470px;">
- <div class="smallTitle">
- <svg-icon icon-class="ph" class="svg_class" />
- 鍘熸潗鏂欏簱瀛橀噺鎺掕Top5
- </div>
- <div class="lineContent horn" style="height: 435px">
- <div id="bar04" style="width: 100%;height:100%;" />
- <!-- <div id="bar04" style="width: 100%;height:100%;margin-left: -25px;margin-top: -10px" />-->
- </div>
- </div>
+
</div>
</div>
@@ -332,7 +304,6 @@
import './kbCommon.css'
import { bar02, kbTop, loadEcharts } from '@/utils/myEcharts'
import {
- WareHouseRightBottomData,
WareHouseRightTopData,
WareHouseTopBottomData,
WareHouseTopLeftData
@@ -354,8 +325,7 @@
tableTopTask: null,
tableBottomTask: null,
- echartsRightTop: null,
- echartsRightBottom: null,
+ tableDataRight: null,
starsCount: 800, // 鏄熸槦鏁伴噺
distance: 900 // 闂磋窛
@@ -369,7 +339,7 @@
// 涓ゅ皬鏃剁湅鏉垮埛鏂颁竴娆�
setInterval(() => {
window.location.reload()
- }, 1000 * 60 * 60 * 10)
+ }, 1000 * 60 * 120)
},
mounted() {
// 鐩戝惉缃戠粶鏄惁鍦ㄧ嚎
@@ -377,12 +347,9 @@
window.addEventListener('offline', this.updateOnlineStatus)
this.updateOnlineStatus({ type: this.onLine ? 'online' : 'offline', isFirst: true })
- this.getTopBar()
-
this.getWareHouseTopLeftData()
this.getWareHouseTopBottomData()
- this.getEcharts()
- this.setStarsRef()
+ this.getWareHouseRightTopData()
},
beforeDestroy() {
window.removeEventListener('online', this.updateOnlineStatus)
@@ -411,26 +378,26 @@
}
}
},
- 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})`
- })
- },
- // 鑾峰彇topEcharts
- getTopBar() {
- loadEcharts('topBarLeft', kbTop())
- loadEcharts('topBarRight', kbTop())
- },
+
// 鑾峰彇宸︿笂table鏁版嵁
getWareHouseTopLeftData() {
+ // this.tableDataTop = [
+ // { voucherdate: '2024-03-01', wo: 'WO2024-03-01-001', wkshp_name: '鍖呰杞﹂棿', saleOrderCode: 'SA230240001', materiel_name: '鍔犲己鐗堢數鍔ㄥ伐鍏�0001', specification: '#U328', stck_name: '鎴愬搧搴�01', quantity: 5000, totalStockInQuantity: 2000, preFinishDate: '2024-03-10' },
+ // { voucherdate: '2024-03-01', wo: 'WO2024-03-01-001', wkshp_name: '鍖呰杞﹂棿', saleOrderCode: 'SA230240001', materiel_name: '鍔犲己鐗堢數鍔ㄥ伐鍏�0001', specification: '#U328', stck_name: '鎴愬搧搴�01', quantity: 5000, totalStockInQuantity: 2000, preFinishDate: '2024-03-10' },
+ // { voucherdate: '2024-03-01', wo: 'WO2024-03-01-001', wkshp_name: '鍖呰杞﹂棿', saleOrderCode: 'SA230240001', materiel_name: '鍔犲己鐗堢數鍔ㄥ伐鍏�0001', specification: '#U328', stck_name: '鎴愬搧搴�01', quantity: 5000, totalStockInQuantity: 2000, preFinishDate: '2024-03-10' },
+ // { voucherdate: '2024-03-01', wo: 'WO2024-03-01-001', wkshp_name: '鍖呰杞﹂棿', saleOrderCode: 'SA230240001', materiel_name: '鍔犲己鐗堢數鍔ㄥ伐鍏�0001', specification: '#U328', stck_name: '鎴愬搧搴�01', quantity: 5000, totalStockInQuantity: 2000, preFinishDate: '2024-03-10' },
+ // { voucherdate: '2024-03-01', wo: 'WO2024-03-01-001', wkshp_name: '鍖呰杞﹂棿', saleOrderCode: 'SA230240001', materiel_name: '鍔犲己鐗堢數鍔ㄥ伐鍏�0001', specification: '#U328', stck_name: '鎴愬搧搴�01', quantity: 5000, totalStockInQuantity: 2000, preFinishDate: '2024-03-10' },
+ // { voucherdate: '2024-03-01', wo: 'WO2024-03-01-001', wkshp_name: '鍖呰杞﹂棿', saleOrderCode: 'SA230240001', materiel_name: '鍔犲己鐗堢數鍔ㄥ伐鍏�0001', specification: '#U328', stck_name: '鎴愬搧搴�01', quantity: 5000, totalStockInQuantity: 2000, preFinishDate: '2024-03-10' },
+ // { voucherdate: '2024-03-01', wo: 'WO2024-03-01-001', wkshp_name: '鍖呰杞﹂棿', saleOrderCode: 'SA230240001', materiel_name: '鍔犲己鐗堢數鍔ㄥ伐鍏�0001', specification: '#U328', stck_name: '鎴愬搧搴�01', quantity: 5000, totalStockInQuantity: 2000, preFinishDate: '2024-03-10' },
+ // { voucherdate: '2024-03-01', wo: 'WO2024-03-01-001', wkshp_name: '鍖呰杞﹂棿', saleOrderCode: 'SA230240001', materiel_name: '鍔犲己鐗堢數鍔ㄥ伐鍏�0001', specification: '#U328', stck_name: '鎴愬搧搴�01', quantity: 5000, totalStockInQuantity: 2000, preFinishDate: '2024-03-10' },
+ // { voucherdate: '2024-03-01', wo: 'WO2024-03-01-001', wkshp_name: '鍖呰杞﹂棿', saleOrderCode: 'SA230240001', materiel_name: '鍔犲己鐗堢數鍔ㄥ伐鍏�0001', specification: '#U328', stck_name: '鎴愬搧搴�01', quantity: 5000, totalStockInQuantity: 2000, preFinishDate: '2024-03-10' },
+ // { voucherdate: '2024-03-01', wo: 'WO2024-03-01-001', wkshp_name: '鍖呰杞﹂棿', saleOrderCode: 'SA230240001', materiel_name: '鍔犲己鐗堢數鍔ㄥ伐鍏�0001', specification: '#U328', stck_name: '鎴愬搧搴�01', quantity: 5000, totalStockInQuantity: 2000, preFinishDate: '2024-03-10' },
+ // { voucherdate: '2024-03-01', wo: 'WO2024-03-01-001', wkshp_name: '鍖呰杞﹂棿', saleOrderCode: 'SA230240001', materiel_name: '鍔犲己鐗堢數鍔ㄥ伐鍏�0001', specification: '#U328', stck_name: '鎴愬搧搴�01', quantity: 5000, totalStockInQuantity: 2000, preFinishDate: '2024-03-10' },
+ // { voucherdate: '2024-03-01', wo: 'WO2024-03-01-001', wkshp_name: '鍖呰杞﹂棿', saleOrderCode: 'SA230240001', materiel_name: '鍔犲己鐗堢數鍔ㄥ伐鍏�0001', specification: '#U328', stck_name: '鎴愬搧搴�01', quantity: 5000, totalStockInQuantity: 2000, preFinishDate: '2024-03-10' },
+ // { voucherdate: '2024-03-01', wo: 'WO2024-03-01-001', wkshp_name: '鍖呰杞﹂棿', saleOrderCode: 'SA230240001', materiel_name: '鍔犲己鐗堢數鍔ㄥ伐鍏�0001', specification: '#U328', stck_name: '鎴愬搧搴�01', quantity: 5000, totalStockInQuantity: 2000, preFinishDate: '2024-03-10' },
+ // { voucherdate: '2024-03-01', wo: 'WO2024-03-01-001', wkshp_name: '鍖呰杞﹂棿', saleOrderCode: 'SA230240001', materiel_name: '鍔犲己鐗堢數鍔ㄥ伐鍏�0001', specification: '#U328', stck_name: '鎴愬搧搴�01', quantity: 5000, totalStockInQuantity: 2000, preFinishDate: '2024-03-10' }
+ // ]
+
WareHouseTopLeftData().then(res => {
this.tableDataTop = res.data
// this.number1 = this.tableDataTop.length
@@ -453,11 +420,31 @@
}
})
}
- }, this.tableDataTop.length <= 10 ? 1000 * 3 : 100)
+ }, this.tableDataTop.length <= 10 ? 1000 * 10 : 100)
})
},
// 鑾峰彇宸︿笅table鏁版嵁
getWareHouseTopBottomData() {
+ // this.tableDataBottom = [
+ // { voucherdate: '2024-03-01', wo: 'WO2024-03-01-001', materiel_name: '鍔犲己鐗堟粦鏉胯溅', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' },
+ // { voucherdate: '2024-03-01', wo: 'WO2024-03-01-002', materiel_name: '灞卞湴婊戞澘杞�', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' },
+ // { voucherdate: '2024-03-01', wo: 'WO2024-03-01-003', materiel_name: '鍗囩骇鐗堢増婊戞澘杞�', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' },
+ // { voucherdate: '2024-03-02', wo: 'WO2024-03-01-001', materiel_name: '鍔犲己鐗堟粦鏉胯溅', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' },
+ // { voucherdate: '2024-03-02', wo: 'WO2024-03-01-002', materiel_name: '灞卞湴鐗堟粦鏉胯溅', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' },
+ // { voucherdate: '2024-03-03', wo: 'WO2024-03-01-001', materiel_name: '闆湴鐗堟粦鏉胯溅', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' },
+ // { voucherdate: '2024-03-03', wo: 'WO2024-03-01-002', materiel_name: '鍔犲己鐗堟粦鏉胯溅', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' },
+ // { voucherdate: '2024-03-04', wo: 'WO2024-03-01-001', materiel_name: '鍔犲己鐗堟粦鏉胯溅', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' },
+ // { voucherdate: '2024-03-04', wo: 'WO2024-03-01--002', materiel_name: '鍔犲己鐗堟粦鏉胯溅', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' },
+ // { voucherdate: '2024-03-05', wo: 'WO2024-03-01-001', materiel_name: '鍔犲己鐗堟粦鏉胯溅', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' },
+ // { voucherdate: '2024-03-05', wo: 'WO2024-03-01-002', materiel_name: '鍔犲己鐗堟粦鏉胯溅', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' },
+ // { voucherdate: '2024-03-06', wo: 'WO2024-03-01', materiel_name: '鍔犲己鐗堟粦鏉胯溅', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' },
+ // { voucherdate: '2024-03-06', wo: 'WO2024-03-01', materiel_name: '鍔犲己鐗堟粦鏉胯溅', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' },
+ // { voucherdate: '2024-03-07', wo: 'WO2024-03-01', materiel_name: '鍔犲己鐗堟粦鏉胯溅', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' },
+ // { voucherdate: '2024-03-07', wo: 'WO2024-03-01', materiel_name: '鍔犲己鐗堟粦鏉胯溅', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' },
+ // { voucherdate: '2024-03-08', wo: 'WO2024-03-01', materiel_name: '鍔犲己鐗堟粦鏉胯溅', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' },
+ // { voucherdate: '2024-03-08', wo: 'WO2024-03-01', materiel_name: '鍔犲己鐗堟粦鏉胯溅', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' },
+ // { voucherdate: '2024-03-09', wo: 'WO2024-03-01', materiel_name: '鍔犲己鐗堟粦鏉胯溅', specification: '#80-90', quantity: '1000', saleOutQuantity: '100', deliveryDate: '2024-03-10' }
+ // ]
WareHouseTopBottomData().then(res => {
this.tableDataBottom = res.data
this.number2 = this.tableDataBottom.length
@@ -481,31 +468,60 @@
}
})
}
- }, this.tableDataBottom.length <= 10 ? 1000 * 3 : 100)
+ }, this.tableDataBottom.length <= 10 ? 1000 * 10 : 100)
})
},
-
- // 鑾峰彇echarts
- getEcharts() {
+ // 鑾峰彇鍙宠竟table鏁版嵁
+ getWareHouseRightTopData() {
+ // this.tableDataRight = [
+ // { FErpCls: '鑷埗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '澶栧崗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '澶栧崗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '澶栧崗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '澶栧崗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '澶栧崗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '澶栧崗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '澶栧崗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '閲囪喘澶栧崗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '閲囪喘澶栧崗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '閲囪喘澶栧崗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '閲囪喘澶栧崗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '鑷埗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '鑷埗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '鑷埗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '鑷埗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '鑷埗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '鑷埗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '鑷埗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '鑷埗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '鑷埗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' },
+ // { FErpCls: '鑷埗', FStockName: '浜旈噾绫讳粨搴�01', FCUUQty: '123' }
+ // ]
WareHouseRightTopData().then(res => {
- loadEcharts('bar03', bar02(res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.CanuseBaseQuantity), res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.materiel_name)))
+ this.tableDataRight = res.data
+ this.number2 = this.tableDataRight.length
+ const divData = this.$refs.tableDataRightRef.bodyWrapper
+ // 鎷垮埌鍏冪礌鍚庯紝瀵瑰厓绱犺繘琛屽畾鏃跺鍔犺窛绂婚《閮ㄨ窛绂伙紝瀹炵幇婊氬姩鏁堟灉(姝ら厤缃负姣�100姣绉诲姩1鍍忕礌)
+ // const task = setInterval(() => {
+ this.tableDataRightTask = setInterval(() => {
+ // 鍏冪礌鑷璺濈椤堕儴1鍍忕礌
+ divData.scrollTop += 1
+ // divData.scrollTop += divData.scrollHeight / this.tableData.length
+ // 鍒ゆ柇鍏冪礌鏄惁婊氬姩鍒板簳閮�(鍙楂樺害+璺濈椤堕儴=鏁翠釜楂樺害)
+ if (divData.clientHeight + divData.scrollTop === divData.scrollHeight) {
+ // 閲嶇疆table璺濈椤堕儴璺濈
+ divData.scrollTop = 0
+ WareHouseRightTopData().then(res => {
+ this.tableDataRight = res.data
+ this.number2 = this.tableDataRight.length
+ if (this.tableDataRight.length > 10) {
+ clearInterval(this.tableDataRightTask)
+ this.getWareHouseRightTopData()
+ }
+ })
+ }
+ }, this.tableDataRight.length <= 22 ? 1000 * 10 : 100)
})
-
- WareHouseRightBottomData().then(res => {
- loadEcharts('bar04', bar02(res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.CanuseBaseQuantity), res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.materiel_name)))
- })
-
- this.echartsRightTop = setInterval(() => {
- WareHouseRightTopData().then(res => {
- loadEcharts('bar03', bar02(res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.CanuseBaseQuantity), res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.materiel_name)))
- })
- }, 1000 * 15)
-
- this.echartsRightBottom = setInterval(() => {
- WareHouseRightBottomData().then(res => {
- loadEcharts('bar04', bar02(res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.CanuseBaseQuantity), res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.materiel_name)))
- })
- }, 1000 * 15)
},
// 鑾峰彇褰撳墠鏃堕棿
getNowTime() {
@@ -525,8 +541,7 @@
},
headerCellStyleCenter() {
return {
- // backgroundColor: 'rgb(30 ,33, 46)',
- backgroundColor: '#000',
+ backgroundColor: 'transparent ',
padding: '10px 0',
textAlign: 'center',
color: '#07acc2',
@@ -536,10 +551,10 @@
},
cellStyleCenter() {
return {
- padding: '7.5px 0',
+ padding: '7px 0',
textAlign: 'center',
- backgroundColor: '#000',
- color: '#fff',
+ backgroundColor: 'transparent ',
+ color: '#c7e7ff',
border: 'none',
fontSize: '18px'
}
@@ -548,65 +563,126 @@
}
</script>
-<style scoped lang="scss">
-
-$main_color:#09d8f2;
+<style lang="scss" scoped>
+$main_color: #09d8f2;
$color01: #00FFFF;
-.tableData{
- background: #000;
+.tableData {
+ background: transparent;
}
-.el-table__empty-text{
+.el-table::before {
+ height: 0;
+}
+
+.el-table__empty-text {
color: $main_color;
+}
+
+.tableDataCell {
+ ::v-deep .cell {
+ padding: 0 2px;
+ }
}
::v-deep .el-table__body-wrapper::-webkit-scrollbar {
/* width: 0;瀹藉害涓�0鏆楄棌 */
width: 0;
+ background: transparent;
}
-::v-deep .el-table::before {
- height: 0;
+::v-deep .el-table__body-wrapper {
+ background: transparent;
}
-::v-deep .cell {
- padding: 0 !important;
- //font-size: 16px;
- font-size: 18px;
+::v-deep .el-table th,
+::v-deep .el-table tr,
+::v-deep .el-table td {
+ background-color: transparent;
}
-</style>
-<!--鏄熺┖-->
-<style lang="css" scoped>
-@keyframes rotate {
+.all_block01 {
+ width: 237px;
+ height: 180px;
+}
+
+.all_block02 {
+ width: 100%;
+ height: 49px;
+ background: rgba(9, 216, 242, 0.1);
+}
+
+.all_block03 {
+ width: 199px;
+ height: 180px;
+}
+
+.all_block04 {
+ width: 100%;
+ height: 49px;
+ background: rgba(9, 216, 242, 0.1);
+}
+
+.kb_center_block_children {
+ height: 180px;
+ //border: 1px solid $kbBorderColor;
+ width: 240px;
+ display: flex;
+ z-index: 2;
+ justify-content: space-around;
+ align-items: center;
+ flex-direction: column;
+ margin: 10px;
+ font-size: 22px;
+
+ .box02 {
+ background: url("../../assets/images/box02.png") no-repeat;
+ transform: scale(1.5);
+ width: 145px;
+ height: 84px;
+
+ }
+}
+
+.all_block05 {
+ position: absolute;
+ animation: upDown 3s ease-in-out infinite;
+ left: 60px;
+}
+
+.all_block06 {
+ position: absolute;
+ animation: upDown2 3s ease-in-out infinite;
+ left: 290px;
+}
+
+.all_block07 {
+ position: absolute;
+ animation: upDown 3s ease-in-out infinite;
+ left: 520px;
+}
+
+@keyframes upDown {
0% {
- transform: perspective(400px) rotateZ(20deg) rotateX(-40deg) rotateY(0);
+ top: 50px;
+ }
+ 50% {
+ top: 100px;
}
100% {
- transform: perspective(400px) rotateZ(20deg) rotateX(-40deg) rotateY(-360deg);
+ top: 50px;
}
}
-.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;
+@keyframes upDown2 {
+ 0% {
+ top: 100px;
+ }
+ 50% {
+ top: 50px;
+ }
+ 100% {
+ top: 100px;
+ }
}
-.star {
- width: 2px;
- height: 2px;
- /*background: #f7f7b6;*/
- background: #8edffc;
- position: absolute;
- left: 0;
- top: 0;
- backface-visibility: hidden;
- z-index: 102;
-}
</style>
diff --git a/src/views/kanbanManager/zhkb.vue b/src/views/kanbanManager/zhkb.vue
index 4c34ef1..c302346 100644
--- a/src/views/kanbanManager/zhkb.vue
+++ b/src/views/kanbanManager/zhkb.vue
@@ -6,7 +6,7 @@
<div class="kb_header">
<div class="kb_headTime" style="top: 35px;left: 20px">
- <span>姘稿悍甯傚法绔嬮槻鎶ょ敤鍝佹湁闄愬叕鍙�</span>
+ <span>娴欐睙绫宠埅绉戞妧鏈夐檺鍏徃</span>
</div>
<div class="kb_headTime kb_header_text" style="top: 35px;left: 800px">
@@ -25,16 +25,16 @@
<div style="width: 1000px;">
<div class="smallTitle">
<svg-icon icon-class="cxjg" class="svg_class" />
- 鐢熶骇璁㈠崟(褰撴湀)
+ 鐢熶骇璁㈠崟(杩戜竴鍛�)
</div>
<div
class="lineContent horn"
style="height: 450px;display: flex;flex-direction: column;justify-content: space-between"
>
<div style="height: 180px;padding: 10px;display: flex;justify-content: space-around">
- <div v-for="i in LeftTopData01" :key="i.wkshp_code" class="flex_c_s">
- <div class="all_block01 flex_c_s">
- <div class="flex_c_c all_block02">{{ i.wkshp_name }}</div>
+ <div v-for="i in LeftTopData01" :key="i.click_date" class="flex_c_s">
+ <div class="all_block01 flex_c_s" style="width: 134px;">
+ <div class="flex_c_c all_block02">{{ i.click_date }}</div>
<div class="" style="display: flex;justify-content:space-between">
<div class="all_block02 flex_c_c" style="width: 49% ">浠诲姟鏁�</div>
<div class="all_block02 flex_c_c" style="width: 49% ">{{ i.plan_qty }}</div>
@@ -102,24 +102,8 @@
浠撳簱搴撳瓨
</div>
<div class="lineContent horn" style="height: 380px;display: flex;justify-content: space-between">
- <div style="display: flex;justify-content: center;position: relative">
- <div class="kb_center_block_children all_block05">
- <div style="font-size: 24px;">{{ parseFloat(RightBottom.Y) }}</div>
- <div class="box02" />
- <div>鍘熸潗鏂�</div>
- </div>
- <div class="kb_center_block_children all_block06">
- <div style="font-size: 24px;">{{ parseFloat(RightBottom.B) }}</div>
- <div class="box02" />
- <div>鍗婃垚鍝�</div>
- </div>
- <div class="kb_center_block_children all_block07">
- <div style="font-size: 24px;">{{ parseFloat(RightBottom.C) }}</div>
- <div class="box02" />
- <div>浜ф垚鍝�</div>
- </div>
+ <div id="zhkb04" class="flex_c_c" style="width: 100%;height:100%" />
- </div>
</div>
</div>
</div>
@@ -130,14 +114,13 @@
<script>
import './kbCommon.css'
-import { loadEcharts, all01, all02, cjzl03 } from '@/utils/myEcharts'
+import { loadEcharts, all01, all02, cjzl03, zhkb04 } from '@/utils/myEcharts'
import {
WorkShopCompreLeftTop,
WorkShopCompreRightBottom,
WorkShopCompreRightTop,
WorkShopProduceBottomLeftData
} from '@/api/kanbanManager'
-import { PrentOrganizationNoCompany } from '@/api/GeneralBasicData'
export default {
name: 'Cjsc',
@@ -168,157 +151,88 @@
}, 1000 * 60 * 120)
},
mounted() {
+ // 鐩戝惉缃戠粶鏄惁鍦ㄧ嚎
+ window.addEventListener('online', this.updateOnlineStatus)
+ window.addEventListener('offline', this.updateOnlineStatus)
+ this.updateOnlineStatus({ type: this.onLine ? 'online' : 'offline', isFirst: true })
+
this.getAllApi()
},
+ beforeDestroy() {
+ window.removeEventListener('online', this.updateOnlineStatus)
+ window.removeEventListener('offline', this.updateOnlineStatus)
+ },
methods: {
+ // 鏇存柊缃戠粶鐘舵��
+ updateOnlineStatus(e) {
+ if (e.isFirst) {
+ // console.log('x')
+ } else {
+ const loading = this.$loading({
+ lock: true,
+ text: '鏂綉浜嗭紝姝ｅ湪鎷煎懡鑱旂綉涓紝璇锋鏌ョ綉缁滄槸鍚︽甯�...',
+ spinner: 'el-icon-loading',
+ customClass: 'osloading',
+ background: 'rgba(0, 0, 0, 0.7)'
+ })
+ const { type } = e
+ this.onLine = type === 'online'
+ if (this.onLine) {
+ loading.close()
+ this.$message.success('缃戠粶杩炴帴鎴愬姛锛�')
+ } else {
+ this.$message.error('缃戠粶鎺夌嚎锛岃鍏虫敞缃戠粶鐘舵�侊紒')
+ }
+ }
+ },
async getAllApi() {
- const res = await PrentOrganizationNoCompany()
- this.wkshopArr = res.data
+ const res2 = await WorkShopCompreLeftTop()
+ this.LeftTopData01 = res2.data.LeftTop
+ this.LeftTopData02 = res2.data.LeftBottom
- const temp = ['00401', '00402', '00501']
-
- temp.forEach(i => {
- const aa = this.wkshopArr.find(j => j.torg_code === i).torg_name
- this.legendData.push(aa)
- })
-
- const res2 = await WorkShopCompreLeftTop({ wkshopcode: temp.join(',') })
- for (const res2Key in res2.data.LeftTop) {
- const data = {
- good_qty: 0,
- plan_qty: 0,
- wkshp_code: '',
- wkshp_name: ''
- }
- if (temp.includes(res2Key)) {
- data.good_qty = res2.data.LeftTop[res2Key][0].good_qty
- data.plan_qty = res2.data.LeftTop[res2Key][0].plan_qty
- data.wkshp_code = res2.data.LeftTop[res2Key][0].wkshp_code
- data.wkshp_name = this.wkshopArr.find(i => i.torg_code === data.wkshp_code).torg_name
- this.LeftTopData01.push(data)
- }
- }
- for (const res2Key in res2.data.LeftBottom) {
- const data = {
- quantity: 0,
- wkshp_code: '',
- wkshp_name: ''
- }
- if (temp.includes(res2Key)) {
- data.quantity = res2.data.LeftBottom[res2Key][0].quantity
- data.plan_qty = res2.data.LeftBottom[res2Key][0].plan_qty
- data.wkshp_code = res2.data.LeftBottom[res2Key][0].wkshp_code
- data.wkshp_name = this.wkshopArr.find(i => i.torg_code === data.wkshp_code).torg_name
- this.LeftTopData02.push(data)
- }
- }
- loadEcharts('all01', all01(this.legendData, this.LeftTopData02))
+ loadEcharts('all01', all01(res2.data.LeftTop.map(i => i.click_date), this.LeftTopData02))
setInterval(() => {
- WorkShopCompreLeftTop({ wkshopcode: temp.join(',') }).then(res2 => {
- this.LeftTopData01 = []
- this.LeftTopData02 = []
- for (const res2Key in res2.data.LeftTop) {
- const data = {
- good_qty: 0,
- plan_qty: 0,
- wkshp_code: '',
- wkshp_name: ''
- }
- if (temp.includes(res2Key)) {
- data.good_qty = res2.data.LeftTop[res2Key][0].good_qty
- data.plan_qty = res2.data.LeftTop[res2Key][0].plan_qty
- data.wkshp_code = res2.data.LeftTop[res2Key][0].wkshp_code
- data.wkshp_name = this.wkshopArr.find(i => i.torg_code === data.wkshp_code).torg_name
- this.LeftTopData01.push(data)
- }
- }
- for (const res2Key in res2.data.LeftBottom) {
- const data = {
- quantity: 0,
- wkshp_code: '',
- wkshp_name: ''
- }
- if (temp.includes(res2Key)) {
- data.quantity = res2.data.LeftBottom[res2Key][0].quantity
- data.plan_qty = res2.data.LeftBottom[res2Key][0].plan_qty
- data.wkshp_code = res2.data.LeftBottom[res2Key][0].wkshp_code
- data.wkshp_name = this.wkshopArr.find(i => i.torg_code === data.wkshp_code).torg_name
- this.LeftTopData02.push(data)
- }
- }
- loadEcharts('all01', all01(this.legendData, this.LeftTopData02))
+ WorkShopCompreLeftTop().then(res2 => {
+ this.LeftTopData01 = res2.data.LeftTop
+ this.LeftTopData02 = res2.data.LeftBottom
+ loadEcharts('all01', all01(res2.data.LeftTop.map(i => i.click_date), this.LeftTopData02))
})
}, 1000 * 30)
const res3 = await WorkShopCompreRightTop()
- res3.data.RightTop.forEach(i => {
- this.RightTopData01.push({
- Quarter: i.Quarter,
- quantity: i.quantity,
- ouquantity: i.ouquantity
- })
- })
- res3.data.RightBottom.forEach(i => {
- this.RightTopData02.push({
- Month: i.Month + '鏈�',
- quantity: i.quantity,
- ouquantity: i.ouquantity
- })
- })
+ this.RightTopData01 = res3.data.RightTop
+ this.RightTopData02 = res3.data.RightBottom
loadEcharts('all02', all02(this.RightTopData02))
setInterval(() => {
WorkShopCompreRightTop().then(res3 => {
- this.RightTopData01 = []
- this.RightTopData02 = []
- res3.data.RightTop.forEach(i => {
- this.RightTopData01.push({
- Quarter: i.Quarter,
- quantity: i.quantity,
- ouquantity: i.ouquantity
- })
- })
- res3.data.RightBottom.forEach(i => {
- this.RightTopData02.push({
- Month: i.Month + '鏈�',
- quantity: i.quantity,
- ouquantity: i.ouquantity
- })
- })
+ this.RightTopData01 = res3.data.RightTop
+ this.RightTopData02 = res3.data.RightBottom
loadEcharts('all02', all02(this.RightTopData02))
})
}, 1000 * 40)
- const res4 = await WorkShopProduceBottomLeftData({ wkshopcode: temp.join(',') })
- this.cjzl03_xData = res4.data[temp[0]].map(i => i.click_date)
- for (const res4Key in res4.data) {
- if (temp.includes(res4Key)) {
- const bb = res4.data[res4Key].map(i => i.count)
- this.cjzl03_yData.push(bb)
- }
- }
+ const res4 = await WorkShopProduceBottomLeftData()
+ this.cjzl03_xData = res4.data.map(i => i.click_date)
+ this.cjzl03_yData = res4.data.map(i => i.count)
+
loadEcharts('cjzl03', cjzl03(this.cjzl03_xData, this.legendData, this.cjzl03_yData, true))
setInterval(() => {
- WorkShopProduceBottomLeftData({ wkshopcode: temp.join(',') }).then(res4 => {
- this.cjzl03_yData = []
-
- this.cjzl03_xData = res4.data[temp[0]].map(i => i.click_date)
- for (const res4Key in res4.data) {
- if (temp.includes(res4Key)) {
- const bb = res4.data[res4Key].map(i => i.count)
- this.cjzl03_yData.push(bb)
- }
- }
+ WorkShopProduceBottomLeftData().then(res4 => {
+ this.cjzl03_xData = res4.data.map(i => i.click_date)
+ this.cjzl03_yData = res4.data.map(i => i.count)
loadEcharts('cjzl03', cjzl03(this.cjzl03_xData, this.legendData, this.cjzl03_yData, true))
})
}, 1000 * 50)
const res5 = await WorkShopCompreRightBottom()
this.RightBottom = res5.data
+ loadEcharts('zhkb04', zhkb04(this.RightBottom.map(i => i.Type), this.RightBottom.map(i => i.Qty)))
setInterval(() => {
WorkShopCompreRightBottom().then(res5 => {
this.RightBottom = res5.data
+ loadEcharts('zhkb04', zhkb04(this.RightBottom.map(i => i.Type), this.RightBottom.map(i => i.Qty)))
})
}, 1000 * 60)
},
diff --git a/vue.config.js b/vue.config.js
index d03b185..eb8073e 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -52,7 +52,7 @@
},
proxy: {
[process.env.VUE_APP_BASE_API]: {
- target: 'http://121.196.36.24:8030', // 璇锋眰鐨勭涓夆絽鎺モ紳鍦板潃 鏈湴寮�鍙戞湇鍔″櫒
+ target: 'http://192.168.1.190:8000', // 璇锋眰鐨勭涓夆絽鎺モ紳鍦板潃 鏈湴寮�鍙戞湇鍔″櫒
// target: 'http://122.227.18.22:8000', // 璇锋眰鐨勭涓夆絽鎺モ紳鍦板潃 鏈湴寮�鍙戞湇鍔″櫒
changeOrigin: true, // 璇锋眰璺ㄥ煙鏃讹紝闇� 閰嶇疆姝ら」
pathRewrite: { // 璺緞閲嶅啓,鏇挎崲target涓殑璇锋眰鍦板潃
--
Gitblit v1.9.3