From 0bb01174c95cf26e8ac3c432f847b4cc6007bf5a Mon Sep 17 00:00:00 2001
From: zhaowei <zhaowei>
Date: 星期三, 26 三月 2025 11:21:46 +0800
Subject: [PATCH] 1、设备管理台账页面新增打印铭牌功能（二维码还未调试完） 2、mdc模块新增四个利用率相关图表页面
---
src/views/mdc/base/GroupUtilizationRateChart.vue | 82 +++
src/views/eam/equipment/modules/NameplateModal.vue | 110 +++++
src/views/mdc/base/GroupUtilizationRateCompareChart.vue | 177 ++++++++
src/views/mdc/base/modules/DeliveryGroupUtilizationRateChart/ChartComponent.vue | 187 ++++++++
src/views/mdc/base/GroupEquipmentUtilizationRateChart.vue | 82 +++
src/views/mdc/base/modules/GroupUtilizationRateChart/ChartComponent.vue | 216 ++++++++++
src/views/mdc/base/DeliveryGroupUtilizationRateChart.vue | 82 +++
src/views/mdc/base/modules/GroupEquipmentUtilizationRateChart/ChartComponent.vue | 242 +++++++++++
src/views/eam/equipment/EamEquipmentList.vue | 58 +
9 files changed, 1,217 insertions(+), 19 deletions(-)
diff --git a/src/views/eam/equipment/EamEquipmentList.vue b/src/views/eam/equipment/EamEquipmentList.vue
index 059f2ce..da0b8cd 100644
--- a/src/views/eam/equipment/EamEquipmentList.vue
+++ b/src/views/eam/equipment/EamEquipmentList.vue
@@ -17,18 +17,21 @@
</a-col>
<a-col :xl="6" :lg="7" :md="8" :sm="24">
<a-form-item label="鍏抽敭璁惧鏍囪瘑">
- <j-dict-select-tag dict-code="yn" placeholder="璇烽�夋嫨鍏抽敭璁惧鏍囪瘑" v-model="queryParam.equipmentImportance"></j-dict-select-tag>
+ <j-dict-select-tag dict-code="yn" placeholder="璇烽�夋嫨鍏抽敭璁惧鏍囪瘑"
+ v-model="queryParam.equipmentImportance"></j-dict-select-tag>
</a-form-item>
</a-col>
<template v-if="toggleSearchStatus">
<a-col :xl="6" :lg="7" :md="8" :sm="24">
<a-form-item label="璧勪骇鐘舵��">
- <j-dict-select-tag dict-code="asset_status" placeholder="璇烽�夋嫨璧勪骇鐘舵��" v-model="queryParam.assetStatus"></j-dict-select-tag>
+ <j-dict-select-tag dict-code="asset_status" placeholder="璇烽�夋嫨璧勪骇鐘舵��"
+ v-model="queryParam.assetStatus"></j-dict-select-tag>
</a-form-item>
</a-col>
<a-col :xl="6" :lg="7" :md="8" :sm="24">
<a-form-item label="鎶�鏈姸鎬�">
- <j-dict-select-tag dict-code="technology_status" placeholder="璇烽�夋嫨鎶�鏈姸鎬�" v-model="queryParam.technologyStatus"></j-dict-select-tag>
+ <j-dict-select-tag dict-code="technology_status" placeholder="璇烽�夋嫨鎶�鏈姸鎬�"
+ v-model="queryParam.technologyStatus"></j-dict-select-tag>
</a-form-item>
</a-col>
<a-col :xl="6" :lg="7" :md="8" :sm="24">
@@ -51,7 +54,8 @@
</a-col>
<a-col :xl="6" :lg="7" :md="8" :sm="24">
<a-form-item label="璁惧鍒嗙被">
- <j-dict-select-tag dict-code="equipment_category" placeholder="璇烽�夋嫨璁惧鍒嗙被" v-model="queryParam.equipmentCategory"></j-dict-select-tag>
+ <j-dict-select-tag dict-code="equipment_category" placeholder="璇烽�夋嫨璁惧鍒嗙被"
+ v-model="queryParam.equipmentCategory"></j-dict-select-tag>
</a-form-item>
</a-col>
</template>
@@ -61,7 +65,7 @@
<a-button type="info" @click="searchReset" icon="reload" style="margin-left: 8px">閲嶇疆</a-button>
<a @click="handleToggleSearch" style="margin-left: 8px">
{{ toggleSearchStatus ? '鏀惰捣' : '灞曞紑' }}
- <a-icon :type="toggleSearchStatus ? 'up' : 'down'" />
+ <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
</a>
</span>
</a-col>
@@ -81,12 +85,12 @@
<a-dropdown v-if="selectedRowKeys.length > 0">
<a-menu slot="overlay">
<a-menu-item key="1" @click="batchDel">
- <a-icon type="delete" />
+ <a-icon type="delete"/>
鍒犻櫎
</a-menu-item>
</a-menu>
<a-button style="margin-left: 8px"> 鎵归噺鎿嶄綔
- <a-icon type="down" />
+ <a-icon type="down"/>
</a-button>
</a-dropdown>
</div>
@@ -112,27 +116,30 @@
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
@change="handleTableChange">
<span slot="equipmentImportance" slot-scope="text">
- <lx-switch v-model="text" disabled checked-children="鏄�" un-checked-children="鍚�" />
+ <lx-switch v-model="text" disabled checked-children="鏄�" un-checked-children="鍚�"/>
</span>
<span slot="mdcFlag" slot-scope="text">
- <lx-switch v-model="text" disabled checked-children="鏄�" un-checked-children="鍚�" />
+ <lx-switch v-model="text" disabled checked-children="鏄�" un-checked-children="鍚�"/>
</span>
<span slot="processParametersFlag" slot-scope="text">
- <lx-switch v-model="text" disabled checked-children="鏈�" un-checked-children="鏃�" />
+ <lx-switch v-model="text" disabled checked-children="鏈�" un-checked-children="鏃�"/>
</span>
<span slot="precisionParametersFlag" slot-scope="text">
- <lx-switch v-model="text" disabled checked-children="鏈�" un-checked-children="鏃�" />
+ <lx-switch v-model="text" disabled checked-children="鏈�" un-checked-children="鏃�"/>
</span>
<span slot="specialEquipment" slot-scope="text">
- <lx-switch v-model="text" disabled checked-children="鏄�" un-checked-children="鍚�" />
+ <lx-switch v-model="text" disabled checked-children="鏄�" un-checked-children="鍚�"/>
</span>
<span slot="action" slot-scope="text, record">
<a @click="handleEdit(record)">缂栬緫</a>
- <a-divider type="vertical" />
+ <a-divider type="vertical"/>
<a-dropdown>
- <a class="ant-dropdown-link">鏇村 <a-icon type="down" /></a>
+ <a class="ant-dropdown-link">鏇村 <a-icon type="down"/></a>
<a-menu slot="overlay">
+ <a-menu-item>
+ <a href="javascript:;" @click="handleOpenNameplateModal(record)">閾墝</a>
+ </a-menu-item>
<a-menu-item>
<a href="javascript:;" @click="handleDetail(record)">璇︽儏</a>
</a-menu-item>
@@ -151,6 +158,8 @@
<!-- 琛ㄥ崟鍖哄煙 -->
<eamEquipment-modal ref="modalForm" @ok="modalFormOk"></eamEquipment-modal>
+ <!--閾墝寮圭獥-->
+ <nameplate-modal ref="nameplateModalRef"/>
</a-card>
</template>
@@ -159,11 +168,13 @@
import EamEquipmentModal from './modules/EamEquipmentModal'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import { getAction } from '@api/manage'
+import NameplateModal from '@views/eam/equipment/modules/NameplateModal.vue'
export default {
name: 'EamEquipmentList',
mixins: [JeecgListMixin],
components: {
+ NameplateModal,
EamEquipmentModal
},
data() {
@@ -189,7 +200,7 @@
dataIndex: 'equipmentCode',
ellipsis: true,
fixed: 'left',
- sorter: true,
+ sorter: true
},
{
title: '璁惧鍚嶇О',
@@ -399,9 +410,9 @@
deleteBatch: '/eam/equipment/deleteBatch',
exportXlsUrl: 'eam/equipment/exportXls',
importExcelUrl: 'eam/equipment/importExcel',
- loadProductionOptions:'/mdc/mdcProduction/loadProductionTreeOptions'
+ loadProductionOptions: '/mdc/mdcProduction/loadProductionTreeOptions'
},
- treeData: [],
+ treeData: []
}
},
computed: {
@@ -410,7 +421,7 @@
}
},
created() {
- this.loadAllProductionTree();
+ this.loadAllProductionTree()
},
methods: {
loadAllProductionTree() {
@@ -418,11 +429,20 @@
getAction(this.url.loadProductionOptions).then(res => {
if (res.success) {
this.treeData = [...res.result]
- }else {
+ } else {
that.$message.warning(res.message)
}
})
},
+
+ /**
+ * 寮�鍚摥鐗屽脊绐�
+ * @param record
+ */
+ handleOpenNameplateModal(record) {
+ this.$refs.nameplateModalRef.model = Object.assign({}, record)
+ this.$refs.nameplateModalRef.visible = true
+ }
}
}
</script>
diff --git a/src/views/eam/equipment/modules/NameplateModal.vue b/src/views/eam/equipment/modules/NameplateModal.vue
new file mode 100644
index 0000000..df25901
--- /dev/null
+++ b/src/views/eam/equipment/modules/NameplateModal.vue
@@ -0,0 +1,110 @@
+<template>
+ <j-modal
+ title="閾墝"
+ :width="750"
+ :visible="visible"
+ @ok="handleOk"
+ @cancel="visible=false"
+ :maskClosable="false"
+ >
+ <table id="nameplateTable" border="1" cellpadding="12" cellspacing="0" align="center" width="80%">
+ <thead>
+ <tr>
+ <th colspan="3">璁惧绠＄悊鐗�</th>
+ </tr>
+ </thead>
+
+ <tbody>
+ <tr>
+ <td rowspan="3">
+
+ </td>
+ <td>璁惧缂栧彿</td>
+ <td>{{ model.equipmentCode }}</td>
+ </tr>
+
+ <tr>
+ <td>璁惧鍚嶇О</td>
+ <td>{{ model.equipmentName }}</td>
+ </tr>
+
+ <tr>
+ <td>璁惧鍨嬪彿</td>
+ <td>{{ model.equipmentModel }}</td>
+ </tr>
+
+ <tr>
+ <td>璁惧绠＄悊</td>
+ <td>浣跨敤閮ㄩ棬</td>
+ <td>{{ model.orgId_dictText }}</td>
+ </tr>
+
+ <tr>
+ <td rowspan="3">123123123123</td>
+ <td>鍑哄巶缂栧彿</td>
+ <td>{{ model.factoryNumber }}</td>
+ </tr>
+
+ <tr>
+ <td>璁惧绠＄悊鍛�</td>
+ <td>{{ model.equipmentManager_dictText }}</td>
+ </tr>
+
+ <tr>
+ <td>瀹夎浣嶇疆</td>
+ <td>{{ model.installationPosition }}</td>
+ </tr>
+
+ <tr>
+ <td>MES</td>
+ <td colspan="2" style="color: #f00;font-weight: bold;letter-spacing: 1px">闈炵鐞嗗憳鍕垮姩姝ら摥鐗�</td>
+ </tr>
+ </tbody>
+ </table>
+
+ <template slot="footer">
+ <a-button>鍏抽棴</a-button>
+ <a-button type="primary" v-print="'#nameplateTable'">鎵撳嵃</a-button>
+ </template>
+ </j-modal>
+</template>
+
+<script>
+export default {
+ name: 'NameplateModal',
+ components: { },
+ data() {
+ return {
+ title: '閾墝',
+ visible: false,
+ disableSubmit: false,
+ model: {},
+ url: {}
+ }
+ },
+ methods: {
+ handleOk() {
+
+ }
+ }
+}
+</script>
+
+<style lang="less" scoped>
+table {
+ font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "寰蒋闆呴粦", Arial, sans-serif;
+ color: #000;
+ text-align: center;
+
+ th {
+ font-size: 28px;
+ letter-spacing: 3px;
+ padding: 20px;
+ }
+
+ td {
+ font-size: 18px;
+ width: 33%;
+ }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/mdc/base/DeliveryGroupUtilizationRateChart.vue b/src/views/mdc/base/DeliveryGroupUtilizationRateChart.vue
new file mode 100644
index 0000000..f7b6e6d
--- /dev/null
+++ b/src/views/mdc/base/DeliveryGroupUtilizationRateChart.vue
@@ -0,0 +1,82 @@
+<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>
+</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/DeliveryGroupUtilizationRateChart/ChartComponent.vue'
+
+export default {
+ name: 'DeliveryGroupUtilizationRateChart',
+ components: {
+ ChartComponent,
+ BaseTree,
+ DepartTree,
+ },
+ data() {
+ return {
+ activeKey: '1',
+ selectEquipment: {},
+ selectPeople: {},
+ selectTypeTree: '',
+ isDepartType: ''
+ }
+ },
+ created() {
+ this.queryTreeData()
+ },
+ 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(() => {
+ })
+ },
+
+ tabChange(val) {
+ this.activeKey = val
+ this.selectTypeTree = val
+ },
+
+ changeSelectionNode(val) {
+ this.selectEquipment = val
+ this.selectTypeTree = '1'
+ },
+
+ changeSelectionNodedd(val) {
+ this.selectPeople = val
+ this.selectTypeTree = '2'
+ }
+ }
+
+}
+</script>
diff --git a/src/views/mdc/base/GroupEquipmentUtilizationRateChart.vue b/src/views/mdc/base/GroupEquipmentUtilizationRateChart.vue
new file mode 100644
index 0000000..f0346d8
--- /dev/null
+++ b/src/views/mdc/base/GroupEquipmentUtilizationRateChart.vue
@@ -0,0 +1,82 @@
+<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>
+</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/GroupEquipmentUtilizationRateChart/ChartComponent.vue'
+
+export default {
+ name: 'GroupEquipmentUtilizationRateChart',
+ components: {
+ ChartComponent,
+ BaseTree,
+ DepartTree,
+ },
+ data() {
+ return {
+ activeKey: '1',
+ selectEquipment: {},
+ selectPeople: {},
+ selectTypeTree: '',
+ isDepartType: ''
+ }
+ },
+ created() {
+ this.queryTreeData()
+ },
+ 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(() => {
+ })
+ },
+
+ tabChange(val) {
+ this.activeKey = val
+ this.selectTypeTree = val
+ },
+
+ changeSelectionNode(val) {
+ this.selectEquipment = val
+ this.selectTypeTree = '1'
+ },
+
+ changeSelectionNodedd(val) {
+ this.selectPeople = val
+ this.selectTypeTree = '2'
+ }
+ }
+
+}
+</script>
diff --git a/src/views/mdc/base/GroupUtilizationRateChart.vue b/src/views/mdc/base/GroupUtilizationRateChart.vue
new file mode 100644
index 0000000..7343d52
--- /dev/null
+++ b/src/views/mdc/base/GroupUtilizationRateChart.vue
@@ -0,0 +1,82 @@
+<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>
+</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'
+
+export default {
+ name: 'GroupUtilizationRateChart',
+ components: {
+ ChartComponent,
+ BaseTree,
+ DepartTree,
+ },
+ data() {
+ return {
+ activeKey: '1',
+ selectEquipment: {},
+ selectPeople: {},
+ selectTypeTree: '',
+ isDepartType: ''
+ }
+ },
+ created() {
+ this.queryTreeData()
+ },
+ 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(() => {
+ })
+ },
+
+ tabChange(val) {
+ this.activeKey = val
+ this.selectTypeTree = val
+ },
+
+ changeSelectionNode(val) {
+ this.selectEquipment = val
+ this.selectTypeTree = '1'
+ },
+
+ changeSelectionNodedd(val) {
+ this.selectPeople = val
+ this.selectTypeTree = '2'
+ }
+ }
+
+}
+</script>
diff --git a/src/views/mdc/base/GroupUtilizationRateCompareChart.vue b/src/views/mdc/base/GroupUtilizationRateCompareChart.vue
new file mode 100644
index 0000000..db59115
--- /dev/null
+++ b/src/views/mdc/base/GroupUtilizationRateCompareChart.vue
@@ -0,0 +1,177 @@
+<template>
+ <a-card>
+ <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>
+ </a-card>
+</template>
+
+<script>
+import api from '@api/mdc'
+import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+
+export default {
+ name: 'GroupUtilizationRateCompareChart',
+ components: {},
+ mixins: [JeecgListMixin],
+ data() {
+ return {
+ disableMixinCreated: true,
+ typeTree: '',
+ queryParam: {},
+ driveTypeList: [],
+ leftChartContainer: null,
+ rightChartContainer: null,
+ url: {}
+ }
+ },
+ props: { nodeTree: '', Type: '', nodePeople: '' },
+ created() {
+ },
+ mounted() {
+ window.addEventListener('resize', this.handleWindowResize)
+ this.getDriveTypeByApi()
+ this.loadData()
+ 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')
+ },
+
+ initChart(position) {
+ this[position + 'ChartContainer'] = this.$echarts.init(document.getElementById(`chart-container-${position}`))
+ const option = {
+ title: {
+ text: position === 'left' ? '鍚勭彮缁�24灏忔椂缁煎悎鏁堢巼瀵规瘮' : '鍚勭彮缁�24灏忔椂缁煎悎鏁堢巼瀵规瘮锛堝幓闄ゆ晠闅滆澶囨椂闂达級',
+ left: 'center',
+ top: 0,
+ textStyle: {
+ fontSize: 22
+ }
+ },
+ grid: {
+ top: '10%',
+ left: '1%',
+ right: '1%',
+ bottom: '5%',
+ containLabel: true
+ },
+ legend: {
+ bottom: 0,
+ right: 'center',
+ itemGap: 20,
+ data: ['鏁伴摚涓�鐝�', '鏁伴摚浜岀彮', '鏁伴摚涓夌彮', '鏁拌溅鐝�']
+ },
+ tooltip: {
+ show: true,
+ trigger: 'axis'
+ },
+ xAxis: {
+ type: 'category',
+ data: ['1鏈�', '2鏈�', '3鏈�', '4鏈�', '5鏈�', '6鏈�', '7鏈�', '8鏈�', '9鏈�', '10鏈�', '11鏈�', '12鏈�']
+ },
+ yAxis: [
+ {
+ type: 'value',
+ name: '鍒╃敤鐜�(%)',
+ axisLine: {
+ show: true
+ },
+ axisLabel: {
+ formatter: '{value}%'
+ }
+ }
+ ],
+ series: [
+ {
+ 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]
+ }
+ ]
+ }
+ this[position + 'ChartContainer'].setOption(option, true)
+ },
+
+ // 璋冪敤鎺ュ彛鑾峰彇鎺у埗绯荤粺绫诲瀷
+ 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
+ )
+ },
+
+ handleWindowResize() {
+ if (this.leftChartContainer) this.leftChartContainer.resize()
+ if (this.rightChartContainer) this.rightChartContainer.resize()
+ }
+ }
+}
+</script>
+
+<style scoped lang="less">
+
+</style>
\ No newline at end of file
diff --git a/src/views/mdc/base/modules/DeliveryGroupUtilizationRateChart/ChartComponent.vue b/src/views/mdc/base/modules/DeliveryGroupUtilizationRateChart/ChartComponent.vue
new file mode 100644
index 0000000..7ad05bd
--- /dev/null
+++ b/src/views/mdc/base/modules/DeliveryGroupUtilizationRateChart/ChartComponent.vue
@@ -0,0 +1,187 @@
+<template>
+ <div>
+ <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper">
+ <a-form layout="inline" @keyup.enter.native="searchQuery">
+ <a-row :gutter="24">
+ <!-- <a-col :md="5" :sm="5">-->
+ <!-- <a-form-item label="璁惧">-->
+ <!-- <a-input-search :readOnly="true" v-model="queryParam.equipmentId" @search="deviceSearch"-->
+ <!-- placeholder='璇烽�夋嫨璁惧'/>-->
+ <!-- </a-form-item>-->
+ <!-- </a-col>-->
+
+ <!-- <a-col :md="5" :sm="5">-->
+ <!-- <a-form-item label="椹卞姩绫诲瀷">-->
+ <!-- <a-auto-complete-->
+ <!-- v-model="queryParam.driveType"-->
+ <!-- :data-source="driveTypeList"-->
+ <!-- placeholder="椹卞姩绫诲瀷"-->
+ <!-- :filter-option="filterOption"-->
+ <!-- :allowClear="true"-->
+ <!-- />-->
+ <!-- </a-form-item>-->
+ <!-- </a-col>-->
+
+ <!-- <a-col>-->
+ <!-- <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>
+ </div>
+</template>
+
+<script>
+import api from '@api/mdc'
+import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+
+export default {
+ name: 'ChartComponent',
+ components: {},
+ mixins: [JeecgListMixin],
+ data() {
+ return {
+ disableMixinCreated: true,
+ typeTree: '',
+ queryParam: {},
+ driveTypeList: [],
+ url: {},
+ spinning: false
+ }
+ },
+ props: { nodeTree: '', Type: '', nodePeople: '' },
+ created() {
+ },
+ mounted() {
+ window.addEventListener('resize', this.handleWindowResize)
+ this.getDriveTypeByApi()
+ this.loadData()
+ 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.chartContainer = this.$echarts.init(document.getElementById('chart-container'))
+ const option = {
+ title: {
+ text: '鏁伴摚鏁拌溅閰嶉�佸皬缁勫钩鍧囪澶囩患鍚堟晥鐜�',
+ left: 'center',
+ top: 0,
+ textStyle: {
+ fontSize: 22
+ }
+ },
+ grid: {
+ top: '10%',
+ left: '1%',
+ right: '1%',
+ bottom: '1%',
+ containLabel: true
+ },
+ legend: {
+ top: 0,
+ right: 0,
+ itemGap: 20,
+ data: ['缁煎悎鏁堢巼锛堝叏閮ㄨ澶囨椂闂达級', '缁煎悎鏁堢巼锛堝幓闄ゆ晠闅滆澶囨椂闂达級']
+ },
+ tooltip: {
+ show: true,
+ trigger: 'axis'
+ },
+ xAxis: {
+ type: 'category',
+ data: ['鏉庢湁涓虹粍', '涓佺孩鐕曠粍', '鍞愪笢缁�', '鏈卞皬纾婄粍', '寮犲缁�', '瀹嬪畤鍧ょ粍', '缃楀啗缁�', '寮犲弻杩涚粍', '甯告尟鍕囩粍', '钁涘簲榫欑粍', '璧靛箍娑涚粍', '浜庡崕浜粍', '闄堝郴缁�', '鐜嬬户宄扮粍', '鐜嬫檽鏄庣粍', '闄堟灄缁�', '鍚村悏骞崇粍']
+ },
+ yAxis: [
+ {
+ type: 'value',
+ name: '鍒╃敤鐜�(%)',
+ axisLine: {
+ show: true
+ },
+ axisLabel: {
+ formatter: '{value}%'
+ }
+ }
+ ],
+ series: [
+ {
+ type: 'bar',
+ name: '缁煎悎鏁堢巼锛堝叏閮ㄨ澶囨椂闂达級',
+ // barWidth: '40%',
+ data: [85, 32, 23, 56, 24, 64, 34, 85, 32, 23, 56, 24, 85, 63, 74, 11, 58]
+ },
+ {
+ type: 'bar',
+ name: '缁煎悎鏁堢巼锛堝幓闄ゆ晠闅滆澶囨椂闂达級',
+ // barWidth: '40%',
+ data: [24, 64, 34, 85, 32, 23, 56, 24, 85, 32, 23, 56, 24, 64, 34, 85, 54]
+ }
+ ]
+ }
+ this.chartContainer.setOption(option, true)
+ },
+
+ // 璋冪敤鎺ュ彛鑾峰彇鎺у埗绯荤粺绫诲瀷
+ 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
+ )
+ },
+
+ handleWindowResize() {
+ if (this.chartContainer) this.chartContainer.resize()
+ }
+ }
+}
+</script>
+
+<style scoped lang="less">
+
+</style>
\ No newline at end of file
diff --git a/src/views/mdc/base/modules/GroupEquipmentUtilizationRateChart/ChartComponent.vue b/src/views/mdc/base/modules/GroupEquipmentUtilizationRateChart/ChartComponent.vue
new file mode 100644
index 0000000..f612b69
--- /dev/null
+++ b/src/views/mdc/base/modules/GroupEquipmentUtilizationRateChart/ChartComponent.vue
@@ -0,0 +1,242 @@
+<template>
+ <div>
+ <div class="table-page-search-wrapper">
+ <a-form layout="inline" @keyup.enter.native="searchQuery">
+ <a-row :gutter="24">
+ <!-- <a-col :md="5" :sm="5">-->
+ <!-- <a-form-item label="璁惧">-->
+ <!-- <a-input-search :readOnly="true" v-model="queryParam.equipmentId" @search="deviceSearch"-->
+ <!-- placeholder='璇烽�夋嫨璁惧'/>-->
+ <!-- </a-form-item>-->
+ <!-- </a-col>-->
+
+ <!-- <a-col :md="5" :sm="5">-->
+ <!-- <a-form-item label="椹卞姩绫诲瀷">-->
+ <!-- <a-auto-complete-->
+ <!-- v-model="queryParam.driveType"-->
+ <!-- :data-source="driveTypeList"-->
+ <!-- placeholder="椹卞姩绫诲瀷"-->
+ <!-- :filter-option="filterOption"-->
+ <!-- :allowClear="true"-->
+ <!-- />-->
+ <!-- </a-form-item>-->
+ <!-- </a-col>-->
+
+ <a-col :md="5" :sm="5">
+ <a-form-item label="鏈堜唤">
+ <a-month-picker v-model="queryParam.month" style="width: 100%" value-format="YYYY-MM" :allowClear="false"
+ placeholder="璇烽�夋嫨鏈堜唤"/>
+ </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 id="chart-container" style="height: 700px"></div>
+ </div>
+</template>
+
+<script>
+import api from '@api/mdc'
+import moment from 'moment'
+import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+
+export default {
+ name: 'ChartComponent',
+ components: {},
+ mixins: [JeecgListMixin],
+ data() {
+ return {
+ disableMixinCreated: true,
+ typeTree: '',
+ driveTypeList: [],
+ url: {},
+ queryParam: {
+ month: moment().subtract('1', 'month')
+ },
+ spinning: false
+ }
+ },
+ props: { nodeTree: '', Type: '', nodePeople: '' },
+ created() {
+ },
+ mounted() {
+ window.addEventListener('resize', this.handleWindowResize)
+ this.getDriveTypeByApi()
+ this.loadData()
+ 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.chartContainer = this.$echarts.init(document.getElementById('chart-container'))
+ const option = {
+ title: {
+ text: '鏁拌溅鐝澶囩患鍚堝埄鐢ㄧ巼',
+ left: 'center',
+ top: 0,
+ textStyle: {
+ fontSize: 22
+ }
+ },
+ grid: {
+ top: '12%',
+ left: '1%',
+ right: '1%',
+ bottom: '8%',
+ containLabel: true
+ },
+ legend: {
+ top: '6%',
+ right: 'center',
+ itemGap: 20,
+ data: ['璁惧缁煎悎鍒╃敤鐜�24h', '璁惧缁煎悎鍒╃敤鐜�16h']
+ },
+ tooltip: {
+ show: true,
+ trigger: 'axis'
+ },
+ xAxis: {
+ type: 'category',
+ data: ['绔嬪姞u1000-3', '浜旇酱125P', '浜斿潗鏍囧姞宸ヤ腑蹇僄S1000', 'A杞�1000PLUS', '姊у窞80P_2', '闆曞埢鏈�800TE', '鍥涘潗鏍囩珛鍔�104V', '绔嬪姞u1000-4', '绔嬪姞GX710_1', '涓夊潗鏍囩珛鍔�1350', '鍗у姞H5000-1', '绔嬪姞u1000-2', '绔嬪姞1000HS_1', '绔嬪姞1160_1', '绔嬪姞GX710_2', '绔嬪姞u1000-3', '浜旇酱125P', '浜斿潗鏍囧姞宸ヤ腑蹇僄S1000', 'A杞�1000PLUS', '姊у窞80P_2', '闆曞埢鏈�800TE', '鍥涘潗鏍囩珛鍔�104V', '绔嬪姞u1000-4', '绔嬪姞GX710_1', '涓夊潗鏍囩珛鍔�1350', '鍗у姞H5000-1', '绔嬪姞u1000-2', '绔嬪姞1000HS_1', '绔嬪姞1160_1', '绔嬪姞GX710_2', '绔嬪姞u1000-3', '浜旇酱125P', '浜斿潗鏍囧姞宸ヤ腑蹇僄S1000', 'A杞�1000PLUS', '姊у窞80P_2', '闆曞埢鏈�800TE', '鍥涘潗鏍囩珛鍔�104V'],
+ axisLabel: {
+ interval: 0, // 鍧愭爣杞村埢搴︽爣绛剧殑鏄剧ず闂撮殧锛屽湪绫荤洰杞翠腑鏈夋晥锛涢粯璁や細閲囩敤鏍囩涓嶉噸鍙犵殑绛栫暐闂撮殧鏄剧ず鏍囩锛涘彲浠ヨ缃垚0寮哄埗鏄剧ず鎵�鏈夋爣绛撅紱濡傛灉璁剧疆涓�1锛岃〃绀恒�庨殧涓�涓爣绛炬樉绀轰竴涓爣绛俱�忥紝濡傛灉鍊间负2锛岃〃绀洪殧涓や釜鏍囩鏄剧ず涓�涓爣绛撅紝浠ユ绫绘帹銆�
+ rotate: 45, // 鍒诲害鏍囩鏃嬭浆鐨勮搴︼紝鍦ㄧ被鐩酱鐨勭被鐩爣绛炬樉绀轰笉涓嬬殑鏃跺�欏彲浠ラ�氳繃鏃嬭浆闃叉鏍囩涔嬮棿閲嶅彔锛涙棆杞殑瑙掑害浠�-90搴﹀埌90搴�
+ inside: false, // 鍒诲害鏍囩鏄惁鏈濆唴锛岄粯璁ゆ湞澶�
+ margin: 15, // 鍒诲害鏍囩涓庤酱绾夸箣闂寸殑璺濈
+ fontSize: 14,
+ color: '#000'
+ }
+ },
+ yAxis: [
+ {
+ type: 'value',
+ name: '鍒╃敤鐜�(%)',
+ axisLine: {
+ show: true
+ },
+ axisLabel: {
+ formatter: '{value}%'
+ }
+ }
+ ],
+ series: [
+ {
+ type: 'bar',
+ name: '璁惧缁煎悎鍒╃敤鐜�24h',
+ data: [53.28, 32.22, 23, 56, 24, 64, 34, 85, 32, 23, 56, 24, 85, 32, 23, 56, 24, 64, 34, 85, 32, 23, 56, 24, 23, 56, 24, 85, 32, 23, 56, 24, 85, 32, 85, 32, 23, 56, 24, 85, 32],
+ label: {
+ show: true,
+ position: 'top',
+ formatter: '{c}%',
+ avoidLabelOverlap: true
+ }
+ },
+ {
+ type: 'bar',
+ name: '璁惧缁煎悎鍒╃敤鐜�16h',
+ data: [63.25, 32.22, 23, 56, 24, 64, 34, 85, 32, 23, 56, 24, 85, 32, 23, 56, 24, 64, 34, 85, 32, 23, 56, 24, 85, 32, 23, 56, 24, 85, 32, 85, 32, 23, 56, 24, 85, 32]
+ }
+ ],
+ dataZoom: [
+ {
+ type: 'slider',
+ show: true,
+ xAxisIndex: 0,
+ startValue: 0,
+ endValue: 19,
+ // 鏄惁鏄剧ずdetail锛屽嵆鎷栨嫿鏃跺�欐樉绀鸿缁嗘暟鍊间俊鎭�
+ showDetail: false,
+ // empty锛氬綋鍓嶆暟鎹獥鍙ｅ鐨勬暟鎹紝琚缃负绌恒��
+ // 鍗充笉浼氬奖鍝嶅叾浠栬酱鐨勬暟鎹寖鍥�
+ filterMode: 'empty',
+ // 鎺у埗鎵嬫焺鐨勫昂瀵�
+ // handleSize: 0,
+ // 鏄惁閿佸畾閫夋嫨鍖哄煙锛堟垨鍙仛鏁版嵁绐楀彛锛夌殑澶у皬
+ zoomLock: true,
+ brushSelect: false
+ },
+ {
+ // 娌℃湁涓嬮潰杩欏潡鐨勮瘽锛屽彧鑳芥嫋鍔ㄦ粴鍔ㄦ潯锛�
+ // 榧犳爣婊氳疆鍦ㄥ尯鍩熷唴涓嶈兘鎺у埗澶栭儴婊氬姩鏉�
+ type: 'inside',
+ show: true,
+ // 鎺у埗鍝釜杞达紝濡傛灉鏄痭umber琛ㄧず鎺у埗涓�涓酱锛�
+ xAxisIndex: 0,
+ // 婊氳疆鏄惁瑙﹀彂缂╂斁
+ zoomOnMouseWheel: false,
+ // 榧犳爣绉诲姩鑳藉惁瑙﹀彂骞崇Щ
+ moveOnMouseMove: true,
+ // 榧犳爣婊氳疆鑳藉惁瑙﹀彂骞崇Щ
+ moveOnMouseWheel: true
+ }
+ ]
+ }
+ this.chartContainer.setOption(option, true)
+ },
+
+ // 璋冪敤鎺ュ彛鑾峰彇鎺у埗绯荤粺绫诲瀷
+ 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
+ )
+ },
+
+ handleWindowResize() {
+ if (this.chartContainer) this.chartContainer.resize()
+ }
+ }
+}
+</script>
+
+<style scoped lang="less">
+
+</style>
\ No newline at end of file
diff --git a/src/views/mdc/base/modules/GroupUtilizationRateChart/ChartComponent.vue b/src/views/mdc/base/modules/GroupUtilizationRateChart/ChartComponent.vue
new file mode 100644
index 0000000..d371940
--- /dev/null
+++ b/src/views/mdc/base/modules/GroupUtilizationRateChart/ChartComponent.vue
@@ -0,0 +1,216 @@
+<template>
+ <div>
+ <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper">
+ <a-form layout="inline" @keyup.enter.native="searchQuery">
+ <a-row :gutter="24">
+ <!-- <a-col :md="5" :sm="5">-->
+ <!-- <a-form-item label="璁惧">-->
+ <!-- <a-input-search :readOnly="true" v-model="queryParam.equipmentId" @search="deviceSearch"-->
+ <!-- placeholder='璇烽�夋嫨璁惧'/>-->
+ <!-- </a-form-item>-->
+ <!-- </a-col>-->
+
+ <!-- <a-col :md="5" :sm="5">-->
+ <!-- <a-form-item label="椹卞姩绫诲瀷">-->
+ <!-- <a-auto-complete-->
+ <!-- v-model="queryParam.driveType"-->
+ <!-- :data-source="driveTypeList"-->
+ <!-- placeholder="椹卞姩绫诲瀷"-->
+ <!-- :filter-option="filterOption"-->
+ <!-- :allowClear="true"-->
+ <!-- />-->
+ <!-- </a-form-item>-->
+ <!-- </a-col>-->
+
+ <!-- <a-col>-->
+ <!-- <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>
+ </div>
+</template>
+
+<script>
+import api from '@api/mdc'
+import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+
+export default {
+ name: 'ChartComponent',
+ components: {},
+ mixins: [JeecgListMixin],
+ data() {
+ return {
+ disableMixinCreated: true,
+ typeTree: '',
+ queryParam: {},
+ driveTypeList: [],
+ url: {},
+ spinning: false
+ }
+ },
+ props: { nodeTree: '', Type: '', nodePeople: '' },
+ created() {
+ },
+ mounted() {
+ window.addEventListener('resize', this.handleWindowResize)
+ this.getDriveTypeByApi()
+ this.loadData()
+ 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.chartContainer = this.$echarts.init(document.getElementById('chart-container'))
+ const option = {
+ // color:'#ccc',
+ title: {
+ text: '鏁拌溅鐝澶囩患鍚堝埄鐢ㄧ巼',
+ left: 'center',
+ top: 0,
+ textStyle: {
+ fontSize: 22
+ }
+ },
+ grid: {
+ top: '10%',
+ left: '1%',
+ right: '15%',
+ bottom: '1%',
+ containLabel: true
+ },
+ legend: {
+ orient: 'vertical',
+ top: 'center',
+ right: 0,
+ itemGap: 20,
+ data: ['24灏忔椂', '24灏忔椂锛堝幓闄ゆ晠闅滆澶囷級', '鐧界彮', '鏅氱彮', '16灏忔椂', '绱杩愯鏃堕棿(h)']
+ },
+ tooltip: {
+ show: true,
+ trigger: 'axis'
+ },
+ xAxis: {
+ type: 'category',
+ data: ['1鏈�', '2鏈�', '3鏈�', '4鏈�', '5鏈�', '6鏈�', '7鏈�', '8鏈�', '9鏈�', '10鏈�', '11鏈�', '12鏈�']
+ },
+ yAxis: [
+ {
+ type: 'value',
+ name: '鍒╃敤鐜�(%)',
+ axisLine: {
+ show: true
+ },
+ axisLabel: {
+ formatter: '{value}%'
+ }
+ },
+ {
+ type: 'value',
+ name: '杩愯鏃堕棿(h)',
+ axisLine: {
+ show: true
+ }
+ }
+ ],
+ series: [
+ {
+ type: 'line',
+ name: '24灏忔椂',
+ symbol: 'diamond',
+ yAxisIndex: 0,
+ symbolSize: 10,
+ data: [85, 32, 23, 56, 24, 64, 34, 85, 32, 23, 56, 24]
+ },
+ {
+ type: 'line',
+ name: '24灏忔椂锛堝幓闄ゆ晠闅滆澶囷級',
+ symbol: 'rect',
+ symbolSize: 10,
+ yAxisIndex: 0,
+ data: [23, 42, 76, 54, 87, 34, 53, 76, 54, 87, 34, 53]
+ },
+ {
+ type: 'line',
+ name: '16灏忔椂',
+ symbol: 'triangle',
+ yAxisIndex: 0,
+ symbolSize: 10,
+ data: [54, 34, 12, 56, 64, 32, 90, 12, 56, 64, 32, 90]
+ },
+ {
+ type: 'bar',
+ name: '绱杩愯鏃堕棿(h)',
+ yAxisIndex: 1,
+ symbolSize: 10,
+ barWidth: '40%',
+ data: [600, 900, 350, 366, 435, 648, 345, 350, 366, 435, 648, 345]
+ }
+ ]
+ }
+ this.chartContainer.setOption(option, true)
+ },
+
+ // 璋冪敤鎺ュ彛鑾峰彇鎺у埗绯荤粺绫诲瀷
+ 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
+ )
+ },
+
+ handleWindowResize() {
+ if (this.chartContainer) this.chartContainer.resize()
+ }
+ }
+}
+</script>
+
+<style scoped lang="less">
+
+</style>
\ No newline at end of file
--
Gitblit v1.9.3