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/GroupUtilizationRateChart.vue | 330 +++++++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 271 insertions(+), 59 deletions(-) diff --git a/src/views/mdc/base/GroupUtilizationRateChart.vue b/src/views/mdc/base/GroupUtilizationRateChart.vue index 7343d52..ad8c62d 100644 --- a/src/views/mdc/base/GroupUtilizationRateChart.vue +++ b/src/views/mdc/base/GroupUtilizationRateChart.vue @@ -1,82 +1,294 @@ <template> - <div style="width: 100%; height: 100%;"> - <a-card :bordered="false"> - <a-row type="flex" :gutter="16"> - <a-col :md="5"> - <a-tabs :activeKey="activeKey" @change="tabChange"> - <a-tab-pane key="1" tab="杞﹂棿灞傜骇" force-render> - <base-tree @getCurrSelected="changeSelectionNode"></base-tree> - </a-tab-pane> - <a-tab-pane v-if="isDepartType == 0" key="2" tab="閮ㄩ棬灞傜骇">, - <depart-tree @getCurrSelectedDD="changeSelectionNodedd"></depart-tree> - </a-tab-pane> - </a-tabs> - </a-col> - <a-col :md="19"> - <ChartComponent :nodePeople='selectPeople' :nodeTree='selectEquipment' :Type="selectTypeTree"/> - </a-col> - </a-row> - </a-card> - </div> + <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="10" :sm="10"> + <a-form-item label="鐝粍"> + <a-select :value="productionIds" placeholder="璇烽�夋嫨鐝粍" mode="multiple" :maxTagCount="5" + @change="handleGroupSelectChange($event,'productionIds')" allowClear> + <a-select-option v-for="item in groupList" :key="item.key"> + {{ item.title }} + </a-select-option> + </a-select> + </a-form-item> + </a-col> + + + <a-col :md="4" :sm="4"> + <a-form-item label="璁惧绫诲瀷"> + <a-select v-model="queryParam.equipmentType" placeholder="璇烽�夋嫨璁惧绫诲瀷" allowClear> + <a-select-option v-for="item in equipmentTypeList" :key="item.id"> + {{ item.equipmentTypeName }} + </a-select-option> + </a-select> + </a-form-item> + </a-col> + + + <a-col :md="4" :sm="4"> + <a-form-item label="鐝埗"> + <a-select v-model="queryParam.shiftId" placeholder="璇烽�夋嫨鐝埗" allowClear> + <a-select-option v-for="item in shiftList" :key="item.value">{{ item.label }}</a-select-option> + </a-select> + </a-form-item> + </a-col> + + + <!-- <a-col :md="5" :sm="5">--> + <!-- <a-form-item label="鐝">--> + <!-- <a-select v-model="queryParam.workTime" placeholder="璇烽�夋嫨鐝" mode="multiple" :maxTagCount="2">--> + <!-- <a-select-option key="123">涓�鐝�</a-select-option>--> + <!-- <a-select-option key="234">浜岀彮</a-select-option>--> + <!-- <a-select-option key="345">涓夌彮</a-select-option>--> + <!-- </a-select>--> + <!-- </a-form-item>--> + <!-- </a-col>--> + + <a-col :md="2" :sm="2"> + <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 id="chart-container" style="height: 700px"></div> + </a-card> </template> <script> -import BaseTree from '../common/BaseTree' -import DepartTree from './modules/DepartList/DepartListTree/DepartTree' -import { mapActions } from 'vuex' -import ChartComponent from '@views/mdc/base/modules/GroupUtilizationRateChart/ChartComponent.vue' +import mdcApi from '@api/mdc' +import { JeecgListMixin } from '@/mixins/JeecgListMixin' export default { name: 'GroupUtilizationRateChart', - components: { - ChartComponent, - BaseTree, - DepartTree, - }, + components: {}, + mixins: [JeecgListMixin], data() { return { - activeKey: '1', - selectEquipment: {}, - selectPeople: {}, - selectTypeTree: '', - isDepartType: '' + disableMixinCreated: true, + queryParam: {}, + productionIds: [],//鐝粍 + centerList: [], + groupList: [], + equipmentTypeList: [], + shiftList: [] } }, - created() { - this.queryTreeData() + mounted() { + window.addEventListener('resize', this.handleWindowResize) + this.handleWindowResize() + this.getCenterListByApi() + this.getEquipmentTypeListApi() + this.getShiftListByApi() }, methods: { - ...mapActions(['QueryDepartTree']), - - queryTreeData() { - this.QueryDepartTree().then(res => { - if (res.success) { - this.isDepartType = res.result[0].value - } else { - this.$notification.warning({ - message: '娑堟伅', - description: res.message - }) - } - }).finally(() => { + // 鑾峰彇鏁版嵁 + loadData() { + this.chartContainer = this.$echarts.init(document.getElementById('chart-container')) + this.initChart({}) + this.chartContainer.showLoading({ + text: '鏁版嵁鍔犺浇涓� ...', + color: '#0696e1', // 鍔犺浇鍔ㄧ敾棰滆壊 + textColor: '#0696e1' }) + const that = this + + mdcApi.getGroupChartDataApi(this.queryParam) + .then(res => { + if (res.success) { + if (!res.result.dataList || (res.result.dataList && res.result.dataList.length === 0)) { + that.$notification.warning({ + message: '娑堟伅', + description: '鏆傛棤鏁版嵁' + }) + } + that.initChart(res.result) + } + }) }, - tabChange(val) { - this.activeKey = val - this.selectTypeTree = val + /** + * 鍒濆鍖栧浘琛� + * @param dataList 鍥捐〃鏁版嵁婧� + * @param dateList 鏃ユ湡鍒楄〃 + * @param shiftSubList 鐝鏍囬鍒楄〃 + * @param shiftDataList 鐝鏁版嵁鍒楄〃 + */ + initChart({ dataList, dateList, shiftSubList, shiftDataList }) { + const defaultLegendData = ['24灏忔椂', '24灏忔椂锛堝幓闄ゆ晠闅滆澶囷級', '鐝', '绱杩愯鏃堕棿(h)'] + const defaultSeries = [ + { + type: 'line', + name: '24灏忔椂', + yAxisIndex: 0, + data: dataList ? dataList.map(item => item.utilizationRate) : [] + }, + { + type: 'line', + name: '24灏忔椂锛堝幓闄ゆ晠闅滆澶囷級', + yAxisIndex: 0, + data: dataList ? dataList.map(item => item.amendUtilizationRate) : [] + }, + { + type: 'line', + name: '鐝', + yAxisIndex: 0, + data: dataList ? dataList.map(item => item.shiftUtilizationRate) : [] + }, + { + type: 'bar', + name: '绱杩愯鏃堕棿(h)', + yAxisIndex: 1, + barWidth: '30%', + data: dataList ? dataList.map(item => item.processLong) : [] + } + ] + const option = { + title: { + text: '璁惧缁煎悎鍒╃敤鐜�', + left: 'center', + top: 0, + textStyle: { + fontSize: 22 + } + }, + grid: { + top: '12%', + left: '1%', + right: '1%', + bottom: '1%', + containLabel: true + }, + legend: { + top: '6%', + right: 'center', + itemGap: 20, + data: defaultLegendData + }, + tooltip: { + show: true, + trigger: 'axis' + }, + xAxis: { + type: 'category', + data: dateList ? dateList : [] + }, + yAxis: [ + { + type: 'value', + name: '鍒╃敤鐜�(%)', + axisLine: { + show: true + }, + axisLabel: { + formatter: '{value}%' + } + }, + { + type: 'value', + name: '杩愯鏃堕棿(h)', + axisLine: { + show: true + } + } + ], + series: defaultSeries + } + if (shiftSubList) { + option.legend.data = defaultLegendData.concat(shiftSubList) + const newSeriesData = shiftDataList.map(item => { + return { + type: 'line', + name: item.shiftSubName, + yAxisIndex: 0, + data: item.dataList ? item.dataList.map(item => item.utilizationRate) : [] + } + }) + + option.series = defaultSeries.concat(newSeriesData) + } + + this.chartContainer.setOption(option, true) + this.chartContainer.hideLoading() }, - changeSelectionNode(val) { - this.selectEquipment = val - this.selectTypeTree = '1' + // 鑾峰彇涓績鍒楄〃 + getCenterListByApi() { + const that = this + mdcApi.getCenterOrGroupListApi() + .then(res => { + if (res.success) { + that.centerList = res.result + that.queryParam.productionId = res.result[0].value + that.getGroupListByApi(res.result[0].value) + } + }) }, - changeSelectionNodedd(val) { - this.selectPeople = val - this.selectTypeTree = '2' + /** + * 鑾峰彇鐝粍鍒楄〃 + * @param productionId 涓績Id + */ + getGroupListByApi(productionId) { + const that = this + mdcApi.getCenterOrGroupListApi(productionId) + .then(res => { + if (res.success) { + that.groupList = res.result + that.handleGroupSelectChange([res.result[0].value]) + that.loadData() + } + }) + }, + + /** + * 鐝粍鍙戠敓鏀瑰彉鏃惰Е鍙� + * @param value 鏀瑰彉鍚庣殑鍊� + */ + handleGroupSelectChange(value) { + this.productionIds = value + this.queryParam.productionIds = value.join(',') + }, + + // 鑾峰彇璁惧绫诲瀷鍒楄〃 + getEquipmentTypeListApi() { + const that = this + mdcApi.getEquipmentTypeListApi() + .then(res => { + if (res.success) { + that.equipmentTypeList = res.result + } + }) + }, + + // 鑾峰彇鐝埗鍒楄〃 + getShiftListByApi() { + const that = this + mdcApi.getShiftListApi() + .then(res => { + if (res.success) { + that.shiftList = res.result + } + }) + }, + + handleWindowResize() { + if (this.chartContainer) this.chartContainer.resize() } } - } -</script> +</script> \ No newline at end of file -- Gitblit v1.9.3