From 725b0706937306c6341e5dddbcc4fd8de7b8f002 Mon Sep 17 00:00:00 2001
From: zhaowei <zhaowei>
Date: 星期二, 01 四月 2025 10:13:18 +0800
Subject: [PATCH] 1、mdc模块实现各利用率图表页面功能并与后端进行联调 2、删除用户修改密码时的输入校验 3、删除用户管理冗余查询字段 4、调整DNC模块获取权限配置功能时调用的获取所有用户列表接口（原先接口有分页参数导致获取不完整）
---
src/views/mdc/base/GroupUtilizationRateCompareChart.vue | 234 ++++++++++++++++++++++++++++++++++------------------------
1 files changed, 137 insertions(+), 97 deletions(-)
diff --git a/src/views/mdc/base/GroupUtilizationRateCompareChart.vue b/src/views/mdc/base/GroupUtilizationRateCompareChart.vue
index db59115..5ab96c8 100644
--- a/src/views/mdc/base/GroupUtilizationRateCompareChart.vue
+++ b/src/views/mdc/base/GroupUtilizationRateCompareChart.vue
@@ -1,14 +1,38 @@
<template>
<a-card>
+ <div class="table-page-search-wrapper">
+ <a-form layout="inline" @keyup.enter.native="searchQuery">
+ <a-row :gutter="24">
+ <a-col :md="3" :sm="3">
+ <a-form-item label="涓績">
+ <a-select v-model="queryParam.productionId" placeholder="璇烽�夋嫨涓績">
+ <a-select-option v-for="item in centerList" :key="item.key">
+ {{ item.title }}
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ </a-col>
+
+ <a-col :md="5" :sm="5">
+ <a-space>
+ <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button>
+ <!-- <a-button type="primary" @click="searchReset" icon="reload">閲嶇疆</a-button>-->
+ </a-space>
+ </a-col>
+ </a-row>
+ </a-form>
+ </div>
+
<div style="display: flex;justify-content: space-between">
- <div id="chart-container-left" style="height: 700px;width: 48%"></div>
- <div id="chart-container-right" style="height: 700px;width: 48%"></div>
+ <div id="chart-container-left" style="height: 700px;width: 30%"></div>
+ <div id="chart-container-middle" style="height: 700px;width: 30%"></div>
+ <div id="chart-container-right" style="height: 700px;width: 30%"></div>
</div>
</a-card>
</template>
<script>
-import api from '@api/mdc'
+import mdcApi from '@api/mdc'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
export default {
@@ -18,64 +42,87 @@
data() {
return {
disableMixinCreated: true,
- typeTree: '',
- queryParam: {},
- driveTypeList: [],
+ centerList: [],
+ chartsOptionList: [
+ {
+ position: 'left',
+ title: '鐝粍璁惧缁煎悎鍒╃敤鐜囷紙24h锛�',
+ property: 'utilizationRateList'
+ },
+ {
+ position: 'middle',
+ title: '鐝粍璁惧缁煎悎鍒╃敤鐜囷紙24h鍘婚櫎鏁呴殰鏃堕棿锛�',
+ property: 'amendUtilizationRateList'
+ },
+ {
+ position: 'right',
+ title: '鐝粍璁惧缁煎悎鍒╃敤鐜囷紙璁″垝宸ヤ綔鏃堕棿锛�',
+ property: 'shiftUtilizationRateList'
+ }
+ ],
leftChartContainer: null,
- rightChartContainer: null,
- url: {}
+ middleChartContainer: null,
+ rightChartContainer: null
}
},
- props: { nodeTree: '', Type: '', nodePeople: '' },
- created() {
- },
+
mounted() {
window.addEventListener('resize', this.handleWindowResize)
- this.getDriveTypeByApi()
- this.loadData()
+ this.getCenterListByApi()
this.handleWindowResize()
},
- watch: {
- Type(valmath) {
- this.dataList = []
- this.queryParam.typeTree = valmath
- },
- nodeTree(val) { //鐩戝惉currSelected 鍙樺寲锛屽皢鍙樺寲鍚庣殑鏁板�间紶閫掔粰 getCurrSelected 浜嬩欢
- if (JSON.stringify(val) != '{}') {
- if (val.equipmentId != null) {
- this.queryParamEquip.parentId = ''
- this.queryParamEquip.equipmentId = val.equipmentId
- } else {
- this.queryParamEquip.parentId = val.key
- this.queryParamEquip.equipmentId = ''
- }
- this.searchQuery()
- }
- },
- nodePeople(val) {
- if (JSON.stringify(val) != '{}') {
- if (val.equipmentId != null) {
- this.queryParamPeople.parentId = val.equipmentId
- this.queryParamPeople.equipmentId = ''
- } else {
- this.queryParamPeople.parentId = val.key
- this.queryParamPeople.equipmentId = ''
- }
- this.searchQuery()
- }
- }
- },
methods: {
+ // 鑾峰彇鍥捐〃鏁版嵁
loadData() {
- this.initChart('left')
- this.initChart('right')
+ const that = this
+ this.chartsOptionList.forEach(item => {
+ that.initChart(item.position)
+ that.chartSetOption(item.position, item.title, [], [], false)
+ })
+ mdcApi.getGroupRateCompareChartDataApi(this.queryParam.productionId)
+ .then(res => {
+ if (res.success) {
+ that.chartsOptionList.forEach(item => this.chartSetOption(item.position, item.title, res.result[item.property], res.result.dateList))
+ } else {
+ that.$notification.warning({
+ message: '娑堟伅',
+ description: res.message
+ })
+ }
+ })
+ .catch(err => {
+ that.$notification.error({
+ message: '娑堟伅',
+ description: err.message
+ })
+ })
},
+ /**
+ * 鍒濆鍖栧浘琛�
+ * @param position 鍥捐〃浣嶇疆 String
+ */
initChart(position) {
this[position + 'ChartContainer'] = this.$echarts.init(document.getElementById(`chart-container-${position}`))
+ this[position + 'ChartContainer'].showLoading({
+ text: '鏁版嵁鍔犺浇涓� ...',
+ color: '#0696e1', // 鍔犺浇鍔ㄧ敾棰滆壊
+ textColor: '#0696e1'
+ })
+ },
+
+ /**
+ * 璁剧疆鍥炬爣閫夐」
+ * @param position 鍥捐〃浣嶇疆 String
+ * @param title 鍥捐〃鏍囬 String
+ * @param dataList 鍥捐〃鏁版嵁婧� Array
+ * @param dateList 鍥捐〃妯潗鏍囨湀浠� Array
+ * @param isHideLoading 鏄惁鍏抽棴鍔犺浇鍥炬爣 Boolean
+ */
+ chartSetOption(position, title, dataList, dateList, isHideLoading = true) {
const option = {
title: {
- text: position === 'left' ? '鍚勭彮缁�24灏忔椂缁煎悎鏁堢巼瀵规瘮' : '鍚勭彮缁�24灏忔椂缁煎悎鏁堢巼瀵规瘮锛堝幓闄ゆ晠闅滆澶囨椂闂达級',
+ text: title,
left: 'center',
top: 0,
textStyle: {
@@ -86,14 +133,13 @@
top: '10%',
left: '1%',
right: '1%',
- bottom: '5%',
+ bottom: '12%',
containLabel: true
},
legend: {
- bottom: 0,
+ bottom: '3%',
right: 'center',
- itemGap: 20,
- data: ['鏁伴摚涓�鐝�', '鏁伴摚浜岀彮', '鏁伴摚涓夌彮', '鏁拌溅鐝�']
+ data: dataList.map(item => item.productionName)
},
tooltip: {
show: true,
@@ -101,7 +147,7 @@
},
xAxis: {
type: 'category',
- data: ['1鏈�', '2鏈�', '3鏈�', '4鏈�', '5鏈�', '6鏈�', '7鏈�', '8鏈�', '9鏈�', '10鏈�', '11鏈�', '12鏈�']
+ data: dateList
},
yAxis: [
{
@@ -115,63 +161,57 @@
}
}
],
- series: [
- {
+ series: dataList.map(item => {
+ return {
type: 'line',
- name: '鏁伴摚涓�鐝�',
- yAxisIndex: 0,
- data: [85, 32, 23, 56, 24, 64, 34, 85, 32, 23, 56, 24]
- },
- {
- type: 'line',
- name: '鏁伴摚浜岀彮',
- yAxisIndex: 0,
- data: [23, 42, 76, 54, 87, 34, 53, 76, 54, 87, 34, 53]
- },
- {
- type: 'line',
- name: '鏁伴摚涓夌彮',
- yAxisIndex: 0,
- data: [10, 84, 21, 42, 53, 57, 32, 21, 42, 53, 57, 32]
- },
- {
- type: 'line',
- name: '鏁拌溅鐝�',
- yAxisIndex: 0,
- data: [23, 32, 42, 35, 64, 53, 16, 42, 35, 64, 53, 16]
+ name: item.productionName,
+ data: item.dataList.map(item => item.utilizationRate)
}
- ]
+ })
+ // series: [
+ // {
+ // type: 'line',
+ // name: '鏁伴摚涓�鐝�',
+ // data: [85, 32, 23, 56, 24, 64]
+ // },
+ // {
+ // type: 'line',
+ // name: '鏁伴摚浜岀彮',
+ // data: [23, 42, 76, 54, 87, 34]
+ // },
+ // {
+ // type: 'line',
+ // name: '鏁伴摚涓夌彮',
+ // data: [10, 84, 21, 42, 53, 57]
+ // },
+ // {
+ // type: 'line',
+ // name: '鏁拌溅鐝�',
+ // data: [23, 32, 42, 35, 64, 53]
+ // }
+ // ]
}
this[position + 'ChartContainer'].setOption(option, true)
+ if (isHideLoading) this[position + 'ChartContainer'].hideLoading()
},
- // 璋冪敤鎺ュ彛鑾峰彇鎺у埗绯荤粺绫诲瀷
- getDriveTypeByApi() {
- api.getDriveTypeApi().then((res) => {
- this.driveTypeList = res.result.map(item => item.value)
- })
- },
-
- /**
- * 鑱旀兂杈撳叆妗嗙瓫閫夊姛鑳�
- * @param input 杈撳叆鐨勫唴瀹�
- * @param option 閰嶇疆
- * @returns {boolean} 鍒ゆ柇鏄惁绛涢��
- */
- filterOption(input, option) {
- return (
- option.componentOptions.children[0].text.toUpperCase().indexOf(input.toUpperCase()) >= 0
- )
+ // 鑾峰彇涓績鍒楄〃
+ getCenterListByApi() {
+ mdcApi.getCenterOrGroupListApi()
+ .then(res => {
+ if (res.success) {
+ this.centerList = res.result
+ this.queryParam.productionId = res.result[0].value
+ this.loadData()
+ }
+ })
},
handleWindowResize() {
if (this.leftChartContainer) this.leftChartContainer.resize()
+ if (this.middleChartContainer) this.middleChartContainer.resize()
if (this.rightChartContainer) this.rightChartContainer.resize()
}
}
}
-</script>
-
-<style scoped lang="less">
-
-</style>
\ No newline at end of file
+</script>
\ No newline at end of file
--
Gitblit v1.9.3