From dcf9c9e0410fe1186239e3f8d6f7bdc789c08010 Mon Sep 17 00:00:00 2001 From: lzhe <lzhe@example.com> Date: 星期三, 05 六月 2024 18:00:39 +0800 Subject: [PATCH] 1 --- src/views/console/base/Shiftsystem.vue | 182 ++++++++++++++++++++++++++++++++++++-------- 1 files changed, 147 insertions(+), 35 deletions(-) diff --git a/src/views/console/base/Shiftsystem.vue b/src/views/console/base/Shiftsystem.vue index 8bd1b1c..4d50e5d 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-06-03 22:57:46 * @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,90 @@ } }) }, - 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() + console.log(data, startTime, '?????') 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) { + console.log('>>>>>>', val) + 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 +193,67 @@ 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 = null + this.info.shiftDetailVOList.forEach(item => { + base === null && (base = item.shiftStartTime) + if (base > item.shiftStartTime) { + base = item.shiftStartTime + } + }) + console.log('.....') + 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 = []; + this.info.shiftDetailVOList.forEach((item, index) => { + let desc = `鎺掔彮鎯呭喌锛�${moment.unix(startTime + (item.shiftStartTime - base) * 60).format('HH:mm')} - ${moment.unix(startTime + (item.shiftEndTime - base) * 60).format('HH:mm')}` + data.push({ + name: item.indexName, + value: [index, startTime + (item.shiftStartTime - base) * 60, startTime + (item.shiftEndTime - base) * 60, desc], + itemStyle: { + normal: { + color: this.info.colour + } + } + }) + item?.shiftRestTimeVOList?.forEach(v => { + let desc = `浼戞伅鏃舵: ${moment.unix(startTime + (v.restStartTime - base) * 60).format('HH:mm')} - ${moment.unix(startTime + (v.restEndTime - base) * 60).format('HH:mm')}` + data.push({ + name: v.indexName, + value: [index, startTime + (v.restStartTime - base) * 60, startTime + (v.restEndTime - base) * 60, desc], + itemStyle: { + normal: { + color: 'yellow' + } + } + }) + }) + }) + return { data, categories, startTime, end } + }, dataChange(res, tableData) { let current = tableData?.[0] || {} current.id && this.rowClick(current) @@ -165,12 +264,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