gaoshp
2024-06-18 179136b6d89e4d24c37fc3981848f62b5673495c
src/views/mdc/processParam/index.vue
@@ -76,7 +76,7 @@
                                <!-- <el-switch v-model="isShowTable" class="mb-2" active-text="数据表" inactive-text="统计图" /> -->
                            </el-col>
                            <el-col :span="20" style='text-align: right;'>
                                <el-date-picker :max-range="3" :clearable="false" value-format="YYYY-MM-DD"
                                <el-date-picker :max-range="3" :clearable="true" value-format="YYYY-MM-DD"
                                    style="width: 250px" v-model="time" type="daterange" range-separator="-"
                                    start-placeholder="" end-placeholder="" :disabled-date="disabledDate"
                                    @calendar-change="change" />
@@ -133,7 +133,8 @@
        treeChecked() {
            this.query()
        },
        time() {
        time(val) {
            if (!val?.[0]) return
            this.query()
        },
        timeRange(val) {
@@ -153,9 +154,10 @@
            activeList: [0, 1, 2, 3, 4, 5, 6, 7, 8],
            timeRange: '',
            treeChecked: [],
            timeStart: moment().format('YYYY-MM-DD'),
            timeStart: '',
            time: [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')],
            disabledDate: Date => {
                if (!this.timeStart) return false
                let max = moment(this.timeStart, 'YYYY-MM-DD').add(3, 'd').format('YYYY-MM-DD')
                let min = moment(this.timeStart, 'YYYY-MM-DD').subtract(3, 'd').format('YYYY-MM-DD')
                return !moment(Date).isBetween(min, max);
@@ -196,14 +198,20 @@
            }).then(res => {
                if (res.code === 200) {
                    if (item.name !== 'DeviceStatus') {
                        this.tableData = res.data.records
                        this.tableData = res.data.records.map(v => {
                            return {
                                ...v,
                            }
                        })
                    } else {
                        this.tableData = res.data.records.map(item => {
                            return {
                                ...item,
                                value: this.legend.find(v => v.code === item.value)?.name
                            }
                        })
                    }
                    this.tableData = res.data.records.map(item => {
                        return {
                            ...item,
                            value: this.legend.find(v => v.code === item.value)?.name
                        }
                    })
                    this.drawer = true
                }
            })
@@ -255,11 +263,12 @@
            })
        },
        setLineOptions(data, myname) {
            console.log(data, myname)
            let xAxis = data.map(item => {
            if (!data) return
            // console.log(data, myname)
            let xAxis = data?.map(item => {
                return item.time
            })
            let yAxisData = data.map(item => {
            let yAxisData = data?.map(item => {
                return item.value
            })
            let dayCharts = {
@@ -294,7 +303,6 @@
                    dayCharts: {}
                })
            } else {
                console.log(myname, '>>>>>>???????????>>>>>>', yAxisData)
                let index = this.list.findIndex(item => item.name === myname)
                this.list[index] = Object.assign({
                    ...this.list[index],
@@ -328,34 +336,48 @@
                    stack: 'total',
                    barWidth: '20px',
                    data: [current / total],
                    label: {
                    // label: {
                    //     show: true,
                    //     position: 'insideLeft',
                    //     color: '#FFF',
                    //     formatter: params => {
                    //         if (i == 0 || current === 0) return ''
                    //         return `${name}:开始时间${moment(data.data[i - 1].time).format('HH:mm')}-${moment(item.time).format('HH:mm')}`
                    //     }
                    // },
                    // itemStyle: {
                    //     // color, // 这一行固定的颜色值需要删除或注释
                    //     borderColor: '#FFF',
                    //     borderWidth: 1
                    // },
                    tooltip: {
                        show: true,
                        position: 'insideLeft',
                        color: '#FFF',
                        formatter: params => {
                        trigger: 'item',
                        position: 'top',
                        triggerOn: 'click',
                        formatter: (value, ticket) => {
                            // console.log('----------1111')
                            // let add = Math.abs(moment(this.timeRange.startTime).diff(moment(this.timeRange.endTime))) * value
                            // let current = moment(this.timeRange.startTime).add(add, 'ms')
                            // console.log('--11111111------------', current)
                            // return current.format('HH:mm')
                            // return value
                            if (i == 0 || current === 0) return ''
                            return `${name}:开始时间${moment(data.data[i - 1].time).format('HH:mm')}-${moment(item.time).format('HH:mm')}`
                        }
                    },
                    itemStyle: {
                        // color, // 这一行固定的颜色值需要删除或注释
                        borderColor: '#FFF',
                        borderWidth: 1
                    },
                }
            })
            let dayCharts = {
                // tooltip: {
                //     position: ['50%', '50%'],
                //     formatter: (value, ticket) => {
                //         console.log('>>>>>>>>>>>>____________', value, ticket)
                //         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')
                //     }
                // },
                legend: [
                ],
                tooltip: {
                    position: ['50%', '50%'],
                    // formatter: (value, ticket) => {
                    //     // console.log('>>>>>>>>>>>>____________', value, ticket)
                    //     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')
                    // }
                },
                title: {
                    text: '',
                    subtext: '',
@@ -377,6 +399,7 @@
                    },
                },
            }
            console.log(dayCharts, '>>>>>>>???')
            let index = this.list.findIndex(item => item.name === myname)
            this.list[index] = Object.assign({
                ...this.list[index],
@@ -385,6 +408,7 @@
        },
        change(e) {
            this.timeStart = e[0] || moment().format('YYYY-MM-DD')
            if (e[1]) this.timeStart = ''
        }
    },
}