From c9ce5e7f9a9ef52c66baf4f8a6e8d9e48b7cb251 Mon Sep 17 00:00:00 2001
From: lzhe <181968431@qq.com>
Date: 星期五, 24 五月 2024 23:59:27 +0800
Subject: [PATCH] 1
---
src/views/console/base/Shiftsystem.vue | 176 +++++++++++++++++++++++++++++++++++++++++++++++-----------
1 files changed, 141 insertions(+), 35 deletions(-)
diff --git a/src/views/console/base/Shiftsystem.vue b/src/views/console/base/Shiftsystem.vue
index 8bd1b1c..8d624d7 100644
--- a/src/views/console/base/Shiftsystem.vue
+++ b/src/views/console/base/Shiftsystem.vue
@@ -1,7 +1,7 @@
<!--
* @Date: 2024-04-09 20:19:46
* @LastEditors: Sneed
- * @LastEditTime: 2024-04-29 01:19:37
+ * @LastEditTime: 2024-05-03 00:11:11
* @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/console/base/Shiftsystem.vue
-->
<template>
@@ -56,7 +56,7 @@
</el-row>
</el-main>
</el-container>
- <Dialog ref="dialog" :option="{ types, status, group }"></Dialog>
+ <Dialog ref="dialog" :option="{ types, status, group }" :detail="detail" @success="success"></Dialog>
</el-container>
</template>
@@ -64,6 +64,7 @@
import Dialog from './Dialog.vue'
import moment from 'moment';
import scEcharts from '@/components/scEcharts';
+import * as echarts from 'echarts'
export default {
components: {
Dialog,
@@ -94,48 +95,89 @@
}
})
},
- dayCharts() {
- if (!this?.info?.shiftDetailVOList?.length) return
- let yData = this.info.shiftDetailVOList.map(item => {
- return item.indexName
- })
- let series = this.info.shiftDetailVOList.map(item => {
- let base = moment().format('YYYY-MM-DD') + ' 00:00:00'
- return {
- name: item.indexName,
- type: 'bar',
- data: [moment(base).add(item.shiftStartTime, 'm').format('YYYY-MM-DD HH:mm:ss').unix(), moment(base).add(item.shiftEndTime, 'm').format('YYYY-MM-DD HH:mm:ss').unix()],
- label: {
- show: true
- }
- }
- })
- console.log(series)
+ dayCharts() {
+ let { data = [], categories = [], startTime, end } = this.getData1()
return {
title: {
text: '鐝埗姒傝'
},
+ tooltip: {
+ formatter: function (params) {
+ return params.name + ': ' + params.value[3];
+ }
+ },
legend: {},
xAxis: {
- type: 'value',
- // interval: 3600,
- // axisLabel: {
- // // formatter: (value, index) => {
- // // // let add = Math.abs(moment(this.timeRange.startTime).diff(moment(this.timeRange.endTime))) * value
- // // // let current = moment(this.timeRange.startTime).add(add, 'ms')
- // // // return current.format('HH:mm')
- // // return value
- // // }
- // },
+ min: startTime,
+ max: end,
+ scale: true,
+ interval: 2 * 60 * 60,
+ axisLabel: {
+ formatter: function (val, index) {
+
+ let str = ''
+ let now = moment()
+ let current = now.format('YYYY-MM-DD')
+ let pre = now.subtract(1, 'd').format('YYYY-MM-DD')
+ let next = now.add(2, 'd').format('YYYY-MM-DD')
+ let nowDate = moment.unix(val).format('YYYY-MM-DD')
+ if (nowDate === current) {
+ str = '褰撴棩'
+ } else if (nowDate === pre) {
+ str = '涓婃棩'
+ } else if (nowDate === next) {
+ str = '娆℃棩'
+ }
+ return `${str}${moment.unix(val).format('HH:mm')}`
+ }
+ }
},
yAxis: {
type: 'category',
- data: yData
+ data: categories
},
- series: {
-
- }
+ series: [
+ {
+ type: 'custom',
+ renderItem: (params, api) => {
+ var categoryIndex = api.value(0);
+ var start = api.coord([api.value(1), categoryIndex]);
+ var end = api.coord([api.value(2), categoryIndex]);
+ var height = api.size([0, 1])[1] * 0.6;
+ var rectShape = echarts.graphic.clipRectByRect(
+ {
+ x: start[0],
+ y: start[1] - height / 2,
+ width: end[0] - start[0],
+ height: height
+ },
+ {
+ x: params.coordSys.x,
+ y: params.coordSys.y,
+ width: params.coordSys.width,
+ height: params.coordSys.height
+ }
+ );
+ return (
+ rectShape && {
+ type: 'rect',
+ transition: ['shape'],
+ shape: rectShape,
+ style: api.style()
+ }
+ );
+ },
+ itemStyle: {
+ opacity: 0.8
+ },
+ encode: {
+ x: [1, 2],
+ y: 0
+ },
+ data
+ }
+ ]
}
}
},
@@ -150,11 +192,62 @@
info: {
code: ''
},
+ detail: {
+
+ }
}
},
created() {
+ this.init()
},
methods: {
+ success() {
+ this.$refs.table.reload(this.params)
+ },
+ init() {
+ this.$HTTP.get('/api/blade-system/param/detail?paramKey=system.shift.max').then(res => {
+ if (res.code === 200) {
+ this.detail = res.data
+ }
+ })
+ },
+ getData1() {
+ if (!this?.info?.shiftDetailVOList?.length) return { data: [], categories: [], startTime: 0 }
+ let categories = this.info.shiftDetailVOList.map(item => {
+ return item.indexName
+ })
+ let base
+ this.info.shiftDetailVOList.forEach(item => {
+ !base && (base = item.shiftStartTime)
+ if (base > item.shiftStartTime) {
+ base = item.shiftStartTime
+ }
+ })
+ let startTime = moment(moment().format('YYYY-MM-DD') + ' 00:00:00').add(base, 'm').unix()
+ let end = moment.unix(startTime).add(24, 'h').unix()
+ let data = [];
+ var types = [
+ { name: 1, color: '#7b9ce1' },
+ { name: 2, color: '#bd6d6c' },
+ { name: 3, color: '#75d874' },
+ { name: 4, color: '#e0bc78' },
+ { name: 5, color: '#dc77dc' },
+ { name: 6, color: '#72b362' }
+ ];
+ this.info.shiftDetailVOList.forEach((item, index) => {
+ let desc = `${moment.unix(startTime + item.shiftStartTime * 60).format('HH:mm')} - ${moment.unix(startTime + item.shiftEndTime * 60).format('HH:mm')}`
+ data.push({
+ name: item.indexName,
+ value: [index, startTime + item.shiftStartTime * 60, startTime + item.shiftEndTime * 60, desc],
+ itemStyle: {
+ normal: {
+ color: this.info.colour
+ }
+ }
+ })
+ })
+ return { data, categories, startTime, end }
+ },
dataChange(res, tableData) {
let current = tableData?.[0] || {}
current.id && this.rowClick(current)
@@ -165,12 +258,25 @@
})
},
table_add() {
- this.$refs.dialog.open()
+ this.$refs.dialog.open('add', {
+
+ })
},
table_edit() {
- this.$refs.dialog.open()
+ this.$refs.dialog.open('edit', this.info)
},
del() {
+ this.$confirm(`纭畾鍒犻櫎鏁版嵁?`, '', {
+ type: 'warning'
+ }).then(() => {
+ this.$HTTP.delete(`/api/blade-cps/shift/${this.info.id}`).then(res => {
+ if (res.code === 200) {
+ this.$refs.table.reload(this.params)
+ }
+ })
+ }).catch(() => {
+
+ })
}
},
--
Gitblit v1.9.3