{"remainingRequest":"D:\\jenkins\\workspace\\cssc-fvue\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\jenkins\\workspace\\cssc-fvue\\src\\views\\HealthManage\\HealthManage.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\jenkins\\workspace\\cssc-fvue\\src\\views\\HealthManage\\HealthManage.vue","mtime":1681441192473},{"path":"D:\\jenkins\\workspace\\cssc-fvue\\node_modules\\babel-loader\\lib\\index.js","mtime":315532800000},{"path":"D:\\jenkins\\workspace\\cssc-fvue\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\cssc-fvue\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n\r\nimport req from '@/api/biz/healthData.js'\r\nimport { Chart } from '@antv/g2'\r\nexport default {\r\n    name: 'health-manage',\r\n    data() {\r\n        return {\r\n            crewList: [], //机组状态列表\r\n            dialogVisible: false, //默认关闭生成报告弹窗\r\n            pageBean: {\r\n                page: 1,\r\n                pageSize: -1\r\n            },\r\n            params: {\r\n                fanCode: '', //机组号\r\n                collTime: '' //查询时间\r\n            },\r\n            total: 0,\r\n            sizeForm: {\r\n                model: ''\r\n            }, //模式切换\r\n            healthStatusCount: {}, //健康状态数量信息\r\n            start: '', //生成报告查询时间\r\n            healthScore: '', //健康评分\r\n            orderRate: '', //工单完成率\r\n            warningAccuracy: '', //预警准确率\r\n            reduceDowntime: '', //减少非计划停机\r\n            dateTime: '',\r\n            chart: null, //接收图表\r\n            loading: null //加载状态\r\n        }\r\n    },\r\n    created() {\r\n        this.getDateTime()\r\n    },\r\n    mounted() {\r\n        this.getCrewList()\r\n        // this.getHealthOverview()\r\n        // this.getHealthStatus()\r\n    },\r\n    methods: {\r\n        // 下载体检报告\r\n        downloadReport() {\r\n            let startYear = ''\r\n            let startMonth = ''\r\n            const csscTest = window.context.csscTest\r\n            if (this.start == '' || this.start == null) {\r\n                this.$message({\r\n                    showClose: true,\r\n                    message: '报表导出失败，请选择日期！',\r\n                    type: 'error',\r\n                    duration: 2500\r\n                })\r\n            } else {\r\n                startYear = this.start.slice(0, 4)\r\n                startMonth = this.start.slice(5, 7)\r\n                this.loading = this.$loading({\r\n                    lock: true,\r\n                    text: '下载中，请等待',\r\n                    spinner: 'el-icon-loading',\r\n                    background: 'rgba(0, 0, 0, 0.7)'\r\n                })\r\n                let data = {\r\n                    farmCname: '华能江苏如东H3',\r\n                    areaCname: '海上运维中心',\r\n                    startYear: startYear,\r\n                    startMonth: startMonth\r\n                }\r\n                let query = {\r\n                    // url: `${csscTest}/remote/remoteReport/reportExportByCondition`,\r\n                    url: `/remote/remoteReport/reportExportByCondition`,\r\n                    method: 'post',\r\n                    data: data,\r\n                    headers: {\r\n                        'Content-type': 'application/json'\r\n                    },\r\n                    responseType: 'blob', //将文件流转成blob对象\r\n                    noErrorMsg: true\r\n                }\r\n                this.$http.request(query).then(res => {\r\n                    // console.log(res)\r\n                    if (res.status == 200) {\r\n                        let blob = new Blob([res.data], {\r\n                            type: `application/msword` //word文档为msword,pdf文档为pdf\r\n                        })\r\n                        let objectUrl = URL.createObjectURL(blob)\r\n                        let link = document.createElement('a')\r\n                        let fname = this.start + '月度体检报告' //下载文件的名字\r\n                        link.href = objectUrl\r\n                        link.setAttribute('download', fname)\r\n                        document.body.appendChild(link)\r\n                        link.click()\r\n                        // 下载完成消息提示\r\n                        this.$message({\r\n                            showClose: true,\r\n                            message: '下载完成',\r\n                            type: 'success',\r\n                            duration: 2500\r\n                        })\r\n                    }\r\n                }).catch(err => {\r\n                    this.$message({\r\n                        showClose: true,\r\n                        message: '下载失败',\r\n                        type: 'error',\r\n                        duration: 2500\r\n                    })\r\n                })\r\n                    .finally(() => {\r\n                        //关闭loading\r\n                        this.loading.close()\r\n                    })\r\n            }\r\n            this.dialogVisible = false\r\n        },\r\n        //重置查询\r\n        onClickRefresh() {\r\n            this.params.collTime = this.dateTime\r\n            $('#pieContainer').empty() //清除图表数据重新渲染\r\n            this.getCrewList()\r\n        },\r\n        //查询\r\n        onClickSearch() {\r\n            this.pageBean.page = 1\r\n            $('#pieContainer').empty() //清除图表数据重新渲染\r\n            this.getCrewList()\r\n        },\r\n        // 获取当前日期\r\n        getDateTime() {\r\n            let yesterday = new Date().getTime() - 24 * 60 * 60 * 1000\r\n            let date = new Date(yesterday)\r\n            var year = date.getFullYear()\r\n            var month = date.getMonth() + 1\r\n            var day = date.getDate()\r\n            if (month >= 1 && month <= 9) {\r\n                month = '0' + month\r\n            }\r\n            if (day >= 0 && day <= 9) {\r\n                day = '0' + day\r\n            }\r\n            this.dateTime = year + '-' + month + '-' + day\r\n            this.params.collTime = this.dateTime\r\n        },\r\n        // 健康状态统计\r\n        getHealthStatus() {\r\n            let dateTime = this.dateTime\r\n            if (this.params.collTime) {\r\n                dateTime = this.params.collTime\r\n            }\r\n            req.getHealthStatus(dateTime).then(res => {\r\n                // console.log(res);\r\n                if (res && res.value) {\r\n                    this.healthStatusCount = res.value\r\n                    this.innitChart()\r\n                }\r\n            })\r\n        },\r\n        // 获取健康监测总览\r\n        getHealthOverview() {\r\n            this.heallthStatusList = []\r\n            this.healthStatusCount = {}\r\n            req.getHealthOverview().then(res => {\r\n                // console.log(res, '健康监测总览')\r\n                if (res && res.value) {\r\n                    this.healthScore = res.value.healthScore\r\n                    this.orderRate = res.value.workCompletionRate\r\n                    this.warningAccuracy = res.value.warnPreciseRate\r\n                    this.reduceDowntime = res.value.unplannedDowntime\r\n                }\r\n            })\r\n        },\r\n        // 获取机组状态列表\r\n        getCrewList() {\r\n            let dateTime = this.dateTime\r\n            let data = {\r\n                pageBean: this.pageBean,\r\n                querys: [\r\n                    {\r\n                        group: 'main',\r\n                        operation: 'EQUAL',\r\n                        parentGroup: '',\r\n                        property: 'collTime',\r\n                        relation: 'AND',\r\n                        value: dateTime\r\n                    }\r\n                ]\r\n            }\r\n            if (this.params.collTime) {\r\n                dateTime = this.params.collTime\r\n                data = {\r\n                    pageBean: this.pageBean,\r\n                    querys: [\r\n                        {\r\n                            group: 'main',\r\n                            operation: 'EQUAL',\r\n                            parentGroup: '',\r\n                            property: 'collTime',\r\n                            relation: 'AND',\r\n                            value: this.params.collTime\r\n                        }\r\n                    ]\r\n                }\r\n            }\r\n            req.getCrewList(data).then(res => {\r\n                this.total = res.total\r\n                this.crewList = res.rows\r\n            })\r\n            this.getHealthStatus()\r\n            this.getHealthOverview()\r\n        },\r\n        handleSizeChange(val) {\r\n            this.pageBean.pageSize = val\r\n            this.getCrewList()\r\n        },\r\n        handleCurrentChange(val) {\r\n            this.pageBean.page = val\r\n            this.getCrewList()\r\n        },\r\n        // 环形饼图图例\r\n        innitChart() {\r\n            const circleData = [\r\n                {\r\n                    item: '优秀',\r\n                    count: this.healthStatusCount.excellent,\r\n                    color: '#02c82d'\r\n                },\r\n                {\r\n                    item: '健康',\r\n                    count: this.healthStatusCount.health,\r\n                    color: '#61DDAA'\r\n                },\r\n                {\r\n                    item: '亚健康',\r\n                    count: this.healthStatusCount.subHealth,\r\n                    color: '#5e70a0'\r\n                },\r\n                {\r\n                    item: '告警',\r\n                    count: this.healthStatusCount.alarm,\r\n                    color: '#ff9c00'\r\n                },\r\n                {\r\n                    item: '故障',\r\n                    count: this.healthStatusCount.fault,\r\n                    color: '#ff6363'\r\n                }\r\n            ]\r\n            this.chart = new Chart({\r\n                container: 'pieContainer',\r\n                autoFit: true,\r\n                height: 500\r\n            })\r\n\r\n            this.chart.coordinate('theta', {\r\n                radius: 0.8,\r\n                innerRadius: 0.6\r\n            })\r\n            this.chart.data(circleData)\r\n            this.chart.scale('count', {\r\n                formatter: val => {\r\n                    val = val + '台'\r\n                    return val\r\n                }\r\n            })\r\n            this.chart.legend('item', {\r\n                position: 'right', // 配置图例显示位置\r\n                custom: true, // 关键字段，告诉 G2，要使用自定义的图例\r\n                items: circleData.map((obj, index) => {\r\n                    return {\r\n                        name: obj.item, // 对应 itemName\r\n                        value: obj.count, // 对应 itemValue\r\n                        marker: {\r\n                            symbol: 'circle', // marker 的形状\r\n                            style: {\r\n                                r: 5, // marker 图形半径\r\n                                fill: obj.color // marker 颜色，使用默认颜色，同图形对应\r\n                            }\r\n                        } // marker 配置\r\n                    }\r\n                }),\r\n                itemName: {\r\n                    style: {\r\n                        fill: '#ccf2ff'\r\n                    }\r\n                },\r\n                itemValue: {\r\n                    style: {\r\n                        fill: '#ccf2ff'\r\n                    }, // 配置 itemValue 样式\r\n                    formatter: val => `：${val}台` // 格式化 itemValue 内容\r\n                }\r\n            })\r\n            this.chart.tooltip({\r\n                showTitle: false,\r\n                showMarkers: false,\r\n                domStyles: {\r\n                    'g2-tooltip': {\r\n                        background: 'rgba(0,0,0, 0.8)',\r\n                        color: '#d6e0ec'\r\n                    }\r\n                }\r\n            })\r\n            this.chart\r\n                .interval()\r\n                .position('count')\r\n                .color('item', ['#1CC25E', '#1AAF8B', '#5e70a0', '#ff9c00', '#ff6363'])\r\n                .adjust('stack')\r\n            this.chart.interaction('element-active')\r\n            this.chart.render()\r\n        },\r\n        // 关闭生成报告弹窗\r\n        handleClose() {\r\n            this.dialogVisible = false\r\n        },\r\n        // 宫格模式\r\n        changeGrid() {\r\n            this.sizeForm.model = 1\r\n        },\r\n        // 列表模式\r\n        changeList() {\r\n            this.sizeForm.model = 2\r\n        },\r\n        // 指定一个key标识这一行的数据\r\n        getRowKey(row) {\r\n            return row.id\r\n        }\r\n    }\r\n}\r\n",null]}