From 3e7f514a62e66dd9a601d00c6808689f61379e4c Mon Sep 17 00:00:00 2001 From: ali <ali9696@163.com> Date: 星期五, 14 二月 2025 11:04:50 +0800 Subject: [PATCH] 页面优化 --- zhitan-vue/src/views/powerquality/threephase/index.vue | 24 zhitan-vue/src/views/modelconfiguration/indexwarehouse/components/statisticalIndicatorManagement/statisticalIndicatorManagement.vue | 239 ++- zhitan-vue/src/views/energyanalysis/comprehensive/comprehensive.vue | 400 ++--- zhitan-vue/src/views/policy/knowledgebase/knowledgeBase.vue | 35 zhitan-vue/src/views/modelconfiguration/setpeakvalley/setPeakValley.vue | 381 +++-- zhitan-vue/src/views/modelconfiguration/energytype/energyType.vue | 338 ++--- zhitan-vue/src/views/dataMonitoring/historyDataTrend/index.vue | 2 zhitan-vue/src/views/modelconfiguration/businessmodel/businessModel.vue | 607 ++++---- zhitan-vue/src/views/auxiliaryentry/electricityinput/electricityinput.vue | 6 zhitan-vue/src/views/measuringinstruments/distributionroom/distributionroom.vue | 6 zhitan-vue/src/views/carbonemission/carbonEmission.vue | 6 zhitan-vue/src/views/modelconfiguration/collectindicator/collectIndicator.vue | 153 +- zhitan-vue/src/views/modelconfiguration/energyvarieties/energyVarieties.vue | 190 +- zhitan-vue/src/views/businessconfiguration/prealarmmanage/prealarmmanage.vue | 201 +- zhitan-vue/src/views/auxiliaryentry/productoutput/productOutput.vue | 278 +--- zhitan-vue/src/views/modelconfiguration/calculationformula/calculationFormula.vue | 33 zhitan-vue/src/components/Echarts/LineChart.vue | 3 zhitan-vue/src/views/comprehensive/dailyComprehensive/index.vue | 26 zhitan-vue/src/views/measuringinstruments/maintain/maintain.vue | 6 zhitan-vue/src/views/energyconservation/policyrule/policyRule.vue | 7 zhitan-vue/src/views/energyconservation/projectmanage/projectmanage/projectManage.vue | 7 zhitan-vue/src/assets/styles/page.scss | 2 zhitan-vue/src/views/businessconfiguration/alarmmaintenance/alarmMaintenance.vue | 7 zhitan-vue/src/views/comprehensive/comps/LineChart.vue | 4 zhitan-vue/src/views/energyanalysis/equipment/equipment.vue | 338 ++-- zhitan-vue/src/views/alarmmanage/alarmrecord/alarmRecord.vue | 129 + zhitan-vue/src/views/energyanalysis/department/department.vue | 323 ++-- zhitan-vue/src/views/modelconfiguration/indexwarehouse/indexWarehouse.vue | 6 zhitan-vue/src/views/businessconfiguration/gatewayledger/gatewayLedger.vue | 9 29 files changed, 1,811 insertions(+), 1,955 deletions(-) diff --git a/zhitan-vue/src/assets/styles/page.scss b/zhitan-vue/src/assets/styles/page.scss index 6b2a8b1..2c426d5 100644 --- a/zhitan-vue/src/assets/styles/page.scss +++ b/zhitan-vue/src/assets/styles/page.scss @@ -106,10 +106,12 @@ .form-card { background: #fff; + // background: #F7F8FA; border-radius: 0px 0px 0px 0px; // border: 1px solid #000000; padding: 18px 0 0 15px; } + .table-bg-style { background-color: #fff; padding-top: 12px; diff --git a/zhitan-vue/src/components/Echarts/LineChart.vue b/zhitan-vue/src/components/Echarts/LineChart.vue index 8703363..c4c0de6 100644 --- a/zhitan-vue/src/components/Echarts/LineChart.vue +++ b/zhitan-vue/src/components/Echarts/LineChart.vue @@ -74,7 +74,8 @@ color: "#2979ff", }, }, - color: ["#2979ff", "#19be6b", "#ff9900", "#fa3534"], + color: ["#4dadf8", "#19be6b", "#ff9900", "#3d8a32", "#e8463a", "#ff4e3f"], + // color: ["#2979ff", "#19be6b", "#ff9900", "#fa3534"], tooltip: { trigger: "axis", axisPointer: { diff --git a/zhitan-vue/src/views/alarmmanage/alarmrecord/alarmRecord.vue b/zhitan-vue/src/views/alarmmanage/alarmrecord/alarmRecord.vue index 801fffe..1ff3b79 100644 --- a/zhitan-vue/src/views/alarmmanage/alarmrecord/alarmRecord.vue +++ b/zhitan-vue/src/views/alarmmanage/alarmrecord/alarmRecord.vue @@ -6,7 +6,7 @@ </div> <div class="page-container-right"> <div class="form-card"> - <el-form :model="form" ref="queryRef" :inline="true" label-width="85px"> + <el-form :model="form" ref="queryRef" :inline="true" label-width="68px"> <el-form-item prop="eierarchyFlag"> <el-radio-group v-model="form.eierarchyFlag"> <el-radio label="B" name="eierarchyFlag">鏈骇</el-radio> @@ -14,14 +14,25 @@ </el-radio-group> </el-form-item> <el-form-item label="鏃堕棿閫夋嫨"> - <el-date-picker v-model="form.dataTime" type="datetimerange" format="YYYY-MM-DD HH:mm:ss" - value-format="YYYY-MM-DD HH:mm:ss" placeholder="鏃堕棿" style="width: 370px" unlink-panels - time-format="HH:mm:ss" /> + <el-date-picker + v-model="form.dataTime" + type="datetimerange" + format="YYYY-MM-DD HH:mm:ss" + value-format="YYYY-MM-DD HH:mm:ss" + placeholder="鏃堕棿" + style="width: 340px" + unlink-panels + time-format="HH:mm:ss" + /> </el-form-item> <el-form-item label="鎶ヨ绫诲埆" prop="indexType"> <el-select v-model="form.indexType" placeholder="璇烽�夋嫨鎶ヨ绫诲埆" style="width: 200px"> - <el-option v-for="dict in alarm_record_category" :key="dict.value" :label="dict.label" - :value="dict.value" /> + <el-option + v-for="dict in alarm_record_category" + :key="dict.value" + :label="dict.label" + :value="dict.value" + /> </el-select> </el-form-item> <!-- <el-form-item label="鑳芥簮绫诲瀷" prop="energyType"> @@ -39,18 +50,26 @@ </el-form-item> </el-form> </div> - <BaseCard :title="currentNode ? currentNode.label + '--鑺傜偣閰嶇疆' : '鏆傛棤鑺傜偣閰嶇疆' - "> + <BaseCard :title="currentNode ? currentNode.label + '--鑺傜偣閰嶇疆' : '鏆傛棤鑺傜偣閰嶇疆'"> <div class="table-box"> <el-table :data="tableData" v-loading="loading" height="calc(100vh - 450px)"> <el-table-column type="index" label="搴忓彿" width="70" /> <el-table-column label="鐢ㄨ兘鍗曞厓" prop="modelName" align="center" show-overflow-tooltip /> <el-table-column label="鎸囨爣鍚嶇О" prop="indexName" align="center" show-overflow-tooltip /> - <el-table-column label="鎶ヨ绫诲埆" prop="indexType" align="center" show-overflow-tooltip :formatter="(row, column) => - proxy.selectDictLabel(alarm_record_category, row.indexType) - " /> - <el-table-column label="鑳芥簮绫诲瀷" prop="energyId" align="center" show-overflow-tooltip :formatter="(row, column) => formatterLabel(energyTypeList, row.energyId) - " /> + <el-table-column + label="鎶ヨ绫诲埆" + prop="indexType" + align="center" + show-overflow-tooltip + :formatter="(row, column) => proxy.selectDictLabel(alarm_record_category, row.indexType)" + /> + <el-table-column + label="鑳芥簮绫诲瀷" + prop="energyId" + align="center" + show-overflow-tooltip + :formatter="(row, column) => formatterLabel(energyTypeList, row.energyId)" + /> <el-table-column label="棰勮鍊�" prop="energyType" align="center" show-overflow-tooltip /> <el-table-column label="鎶ヨ鍊�" prop="alarmValue" align="center" show-overflow-tooltip /> <el-table-column label="鎶ヨ鏃堕棿" prop="alarmBeginTime" align="center" show-overflow-tooltip /> @@ -58,17 +77,22 @@ </div> </BaseCard> - <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" - v-model:limit="queryParams.pageSize" @pagination="getList(currentNode)" /> + <pagination + v-show="total > 0" + :total="total" + v-model:page="queryParams.pageNum" + v-model:limit="queryParams.pageSize" + @pagination="getList(currentNode)" + /> </div> </div> </div> </template> <script setup name="alarmRecord"> -import { listEnergyTypeList } from "@/api/modelConfiguration/energyType"; -const { proxy } = getCurrentInstance(); -let { alarm_record_category } = proxy.useDict("alarm_record_category"); -import { historicalAlarm } from "@/api/alarmManage/alarmManage"; +import { listEnergyTypeList } from "@/api/modelConfiguration/energyType" +const { proxy } = getCurrentInstance() +let { alarm_record_category } = proxy.useDict("alarm_record_category") +import { historicalAlarm } from "@/api/alarmManage/alarmManage" let form = ref({ eierarchyFlag: "B", dataTime: [ @@ -79,74 +103,77 @@ indexType: "", // energyType: '', indexName: "", -}); -const energyTypeList = ref(); +}) +const energyTypeList = ref() function getEnergyTypeList() { listEnergyTypeList().then((res) => { - energyTypeList.value = res.data; - form.value.indexType = alarm_record_category.value[0].value; + energyTypeList.value = res.data + form.value.indexType = alarm_record_category.value[0].value // form.value.energyType = energyTypeList.value[0].enersno - getList(); - }); + getList() + }) } // getEnergyTypeList() -let currentNode = ref(); +let currentNode = ref() function handleNodeClick(data) { - currentNode.value = data; - getEnergyTypeList(); + currentNode.value = data + getEnergyTypeList() } -let tableData = ref([]); -let total = ref(0); -let loading = ref(false); +let tableData = ref([]) +let total = ref(0) +let loading = ref(false) let queryParams = ref({ pageNum: 1, pageSize: 10, -}); +}) function formatterLabel(list, value) { - let dict = list.find((item) => item.enersno == value); - return dict ? dict.enername : ""; + let dict = list.find((item) => item.enersno == value) + return dict ? dict.enername : "" } function getList() { - form.value.nodeId = currentNode.value.id; - loading.value = true; + form.value.nodeId = currentNode.value.id + loading.value = true historicalAlarm({ ...form.value, ...queryParams.value, beginTime: form.value.dataTime[0], endTime: form.value.dataTime[1], }).then((response) => { - console.log(11, response); + console.log(11, response) if (response.code === 200) { - tableData.value = response.rows; - total.value = response.total; - loading.value = false; + tableData.value = response.rows + total.value = response.total + loading.value = false } else { - proxy.$modal.msgError(response.msg); + proxy.$modal.msgError(response.msg) } - }); + }) } function handleQuery() { - queryParams.value.pageNum = 1; - getList(); + queryParams.value.pageNum = 1 + getList() } function resetQuery() { form.value = { - eierarchyFlag: 'B', - dataTime: [proxy.dayjs(new Date()).format("YYYY-MM-DD 00:00:00"), proxy.dayjs(new Date()).format("YYYY-MM-DD 23:59:59")], - nodeId: '', + eierarchyFlag: "B", + dataTime: [ + proxy.dayjs(new Date()).format("YYYY-MM-DD 00:00:00"), + proxy.dayjs(new Date()).format("YYYY-MM-DD 23:59:59"), + ], + nodeId: "", indexType: alarm_record_category.value[0].value, // energyType: '', - indexName: '', + indexName: "", } queryParams.value = { pageNum: 1, pageSize: 10, - }; - getList(); + } + getList() } </script> @@ -190,4 +217,4 @@ .table-box { height: calc(100vh - 464px); } -</style> \ No newline at end of file +</style> diff --git a/zhitan-vue/src/views/auxiliaryentry/electricityinput/electricityinput.vue b/zhitan-vue/src/views/auxiliaryentry/electricityinput/electricityinput.vue index e832fe5..0a7c725 100644 --- a/zhitan-vue/src/views/auxiliaryentry/electricityinput/electricityinput.vue +++ b/zhitan-vue/src/views/auxiliaryentry/electricityinput/electricityinput.vue @@ -40,12 +40,12 @@ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button> <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> </el-form-item> + <el-form-item style="float: right"> + <el-button type="primary" icon="Plus" @click="handleAdd"> 鏂板 </el-button> + </el-form-item> </el-form> </div> <div class="table-bg-style"> - <div class="theme-dark-mt20 mb20 ml20"> - <el-button type="primary" icon="Plus" @click="handleAdd">鏂板</el-button> - </div> <div class="table-box"> <el-table :data="tableData" v-loading="loading"> <el-table-column prop="time" label="鏃堕棿" show-overflow-tooltip align="center" /> diff --git a/zhitan-vue/src/views/auxiliaryentry/productoutput/productOutput.vue b/zhitan-vue/src/views/auxiliaryentry/productoutput/productOutput.vue index 8f3de9a..8d1f378 100644 --- a/zhitan-vue/src/views/auxiliaryentry/productoutput/productOutput.vue +++ b/zhitan-vue/src/views/auxiliaryentry/productoutput/productOutput.vue @@ -6,12 +6,7 @@ </div> <div class="page-container-right"> <div class="form-card"> - <el-form - :model="queryParams" - ref="queryRef" - :inline="true" - v-show="showSearch" - > + <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch"> <el-form-item label="鏈熼棿" prop="timeType"> <el-select v-model="queryParams.timeType" @@ -19,12 +14,7 @@ style="width: 120px" @change="handleTimeType" > - <el-option - v-for="dict in period" - :key="dict.value" - :label="dict.label" - :value="dict.value" - /> + <el-option v-for="dict in period" :key="dict.value" :label="dict.label" :value="dict.value" /> </el-select> </el-form-item> <el-form-item label="鏃堕棿"> @@ -58,33 +48,20 @@ /> </el-form-item> <el-form-item label="浜у搧绫诲瀷"> - <el-select - v-model="queryParams.productType" - placeholder="浜у搧绫诲瀷" - style="width: 100%" - > - <el-option - v-for="dict in product_type" - :key="dict.value" - :label="dict.label" - :value="dict.value" - /> + <el-select v-model="queryParams.productType" placeholder="浜у搧绫诲瀷" style="width: 100%"> + <el-option v-for="dict in product_type" :key="dict.value" :label="dict.label" :value="dict.value" /> </el-select> </el-form-item> <el-form-item> - <el-button type="primary" icon="Search" @click="handleQuery"> - 鎼滅储 - </el-button> + <el-button type="primary" icon="Search" @click="handleQuery"> 鎼滅储 </el-button> <el-button icon="Refresh" @click="resetQuery"> 閲嶇疆 </el-button> + </el-form-item> + <el-form-item style="float: right"> + <el-button type="primary" icon="Plus" @click="handleAdd"> 鏂板 </el-button> </el-form-item> </el-form> </div> <div class="table-box"> - <div class="mt20 mb20"> - <el-button type="primary" icon="Plus" @click="handleAdd"> - 鏂板 - </el-button> - </div> <el-table v-loading="loading" :data="productoutputList"> <el-table-column label="鐢ㄨ兘鍗曞厓" @@ -93,13 +70,7 @@ prop="nodeName" :show-overflow-tooltip="true" /> - <el-table-column - label="鏈熼棿" - align="center" - key="timeType" - prop="timeType" - :show-overflow-tooltip="true" - > + <el-table-column label="鏈熼棿" align="center" key="timeType" prop="timeType" :show-overflow-tooltip="true"> <template #default="scope"> <dict-tag :options="period" :value="scope.row.timeType" /> </template> @@ -120,10 +91,7 @@ :show-overflow-tooltip="true" > <template #default="scope"> - <dict-tag - :options="product_type" - :value="scope.row.productType" - /> + <dict-tag :options="product_type" :value="scope.row.productType" /> </template> </el-table-column> <!-- <el-table-column @@ -133,24 +101,12 @@ prop="name" :show-overflow-tooltip="true" /> --> - <el-table-column - label="鍗曚綅" - align="center" - key="unit" - prop="unit" - :show-overflow-tooltip="true" - > + <el-table-column label="鍗曚綅" align="center" key="unit" prop="unit" :show-overflow-tooltip="true"> <template #default="scope"> <dict-tag :options="sys_unit" :value="scope.row.unit" /> </template> </el-table-column> - <el-table-column - label="浜ч噺" - align="center" - key="number" - prop="number" - :show-overflow-tooltip="true" - /> + <el-table-column label="浜ч噺" align="center" key="number" prop="number" :show-overflow-tooltip="true" /> <el-table-column label="鎻愪氦鏃堕棿" align="center" @@ -158,32 +114,13 @@ :show-overflow-tooltip="true" width="200" /> - <el-table-column - label="鎿嶄綔" - align="center" - class-name="small-padding fixed-width" - width="200" - > + <el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width" width="200"> <template #default="scope"> <el-tooltip content="缂栬緫" placement="top"> - <el-button - link - type="primary" - icon="Edit" - @click="handleUpdate(scope.row)" - > - 缂栬緫 - </el-button> + <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"> 缂栬緫 </el-button> </el-tooltip> <el-tooltip content="鍒犻櫎" placement="top"> - <el-button - link - type="primary" - icon="Delete" - @click="handleDelete(scope.row)" - > - 鍒犻櫎 - </el-button> + <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"> 鍒犻櫎 </el-button> </el-tooltip> </template> </el-table-column> @@ -203,11 +140,7 @@ <el-row> <el-col :span="12"> <el-form-item label="鐢ㄨ兘鍗曞厓" prop="nodeName"> - <el-input - v-model="form.nodeName" - placeholder="璇疯緭鍏ョ敤鑳藉崟鍏�" - disabled - /> + <el-input v-model="form.nodeName" placeholder="璇疯緭鍏ョ敤鑳藉崟鍏�" disabled /> </el-form-item> </el-col> <el-col :span="12"> @@ -219,12 +152,7 @@ style="width: 100%" @change="handleTimeTypeAdd" > - <el-option - v-for="dict in period" - :key="dict.value" - :label="dict.label" - :value="dict.value" - /> + <el-option v-for="dict in period" :key="dict.value" :label="dict.label" :value="dict.value" /> </el-select> </el-form-item> </el-col> @@ -261,18 +189,8 @@ </el-col> <el-col :span="12"> <el-form-item label="浜у搧绫诲瀷" prop="productType"> - <el-select - v-model="form.productType" - placeholder="浜у搧绫诲瀷" - clearable - style="width: 100%" - > - <el-option - v-for="dict in product_type" - :key="dict.value" - :label="dict.label" - :value="dict.value" - /> + <el-select v-model="form.productType" placeholder="浜у搧绫诲瀷" clearable style="width: 100%"> + <el-option v-for="dict in product_type" :key="dict.value" :label="dict.label" :value="dict.value" /> </el-select> </el-form-item> </el-col> @@ -287,18 +205,8 @@ </el-col> --> <el-col :span="12"> <el-form-item label="鍗曚綅" prop="unit"> - <el-select - v-model="form.unit" - placeholder="璇烽�夋嫨鍗曚綅" - clearable - style="width: 100%" - > - <el-option - v-for="dict in sys_unit" - :key="dict.value" - :label="dict.label" - :value="dict.value" - /> + <el-select v-model="form.unit" placeholder="璇烽�夋嫨鍗曚綅" clearable style="width: 100%"> + <el-option v-for="dict in sys_unit" :key="dict.value" :label="dict.label" :value="dict.value" /> </el-select> </el-form-item> </el-col> @@ -331,19 +239,15 @@ addProductoutput, updateProductoutput, delProductoutput, -} from "@/api/auxiliaryEntry/productOutput"; -const { proxy } = getCurrentInstance(); -import { useRoute } from "vue-router"; -const { period, sys_unit, product_type } = proxy.useDict( - "period", - "sys_unit", - "product_type" -); -const productoutputList = ref([]); -const open = ref(false); -const loading = ref(false); -const showSearch = ref(true); -const title = ref(""); +} from "@/api/auxiliaryEntry/productOutput" +const { proxy } = getCurrentInstance() +import { useRoute } from "vue-router" +const { period, sys_unit, product_type } = proxy.useDict("period", "sys_unit", "product_type") +const productoutputList = ref([]) +const open = ref(false) +const loading = ref(false) +const showSearch = ref(true) +const title = ref("") const data = reactive({ form: {}, queryParams: { @@ -358,12 +262,8 @@ }, query: { ...useRoute().query }, rules: { - timeType: [ - { required: true, message: "鏈熼棿涓嶈兘涓虹┖", trigger: ["blur", "change"] }, - ], - dataTime: [ - { required: true, message: "鏃堕棿涓嶈兘涓虹┖", trigger: ["blur", "change"] }, - ], + timeType: [{ required: true, message: "鏈熼棿涓嶈兘涓虹┖", trigger: ["blur", "change"] }], + dataTime: [{ required: true, message: "鏃堕棿涓嶈兘涓虹┖", trigger: ["blur", "change"] }], productType: [ { required: true, @@ -373,78 +273,74 @@ ], // name: [{ required: true, message: "浜у搧鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }], unit: [{ required: true, message: "鍗曚綅涓嶈兘涓虹┖", trigger: "blur" }], - number: [ - { required: true, message: "浜ч噺涓嶈兘涓虹┖", trigger: ["blur", "change"] }, - ], + number: [{ required: true, message: "浜ч噺涓嶈兘涓虹┖", trigger: ["blur", "change"] }], }, -}); -const { queryParams, query, form, rules } = toRefs(data); +}) +const { queryParams, query, form, rules } = toRefs(data) /** 鑺傜偣鍗曞嚮浜嬩欢 */ function handleNodeClick(data) { - queryParams.value.nodeId = data.id; - queryParams.value.nodeName = data.label; - queryParams.value.productType = null; - handleTimeType(period.value[0].value); - handleQuery(); + queryParams.value.nodeId = data.id + queryParams.value.nodeName = data.label + queryParams.value.productType = null + handleTimeType(period.value[0].value) + handleQuery() } function handleTimeType(e) { - queryParams.value.timeType = e; + queryParams.value.timeType = e queryParams.value.dataTime = proxy .dayjs(new Date()) - .format(e == "YEAR" ? "YYYY" : e == "MONTH" ? "YYYY-MM" : "YYYY-MM-DD"); + .format(e == "YEAR" ? "YYYY" : e == "MONTH" ? "YYYY-MM" : "YYYY-MM-DD") } // 杈呭姪褰曞叆-浜у搧浜ч噺褰曞叆-鍒楄〃 function getList() { - loading.value = true; + loading.value = true listProductoutput( proxy.addDateRange({ ...queryParams.value, ...query.value, }) ).then((res) => { - loading.value = false; - productoutputList.value = res.rows; - queryParams.value.total = res.total; - }); + loading.value = false + productoutputList.value = res.rows + queryParams.value.total = res.total + }) } // 杈呭姪褰曞叆-浜у搧浜ч噺褰曞叆-鎼滅储 function handleQuery() { - queryParams.value.pageNum = 1; - getList(); + queryParams.value.pageNum = 1 + getList() } // 杈呭姪褰曞叆-浜у搧浜ч噺褰曞叆-閲嶇疆 function resetQuery() { - proxy.resetForm("queryRef"); - queryParams.value.pageNum = 1; - queryParams.value.pageSize = 10; - queryParams.value.total = 0; - queryParams.value.timeType = null; - queryParams.value.dataTime = null; - queryParams.value.productType = null; - handleTimeType(period.value[0].value); - handleQuery(); + proxy.resetForm("queryRef") + queryParams.value.pageNum = 1 + queryParams.value.pageSize = 10 + queryParams.value.total = 0 + queryParams.value.timeType = null + queryParams.value.dataTime = null + queryParams.value.productType = null + handleTimeType(period.value[0].value) + handleQuery() } // 杈呭姪褰曞叆-浜у搧浜ч噺褰曞叆-鏂板 function handleAdd() { - reset(); - form.value.nodeId = queryParams.value.nodeId; - form.value.nodeName = queryParams.value.nodeName; - handleTimeTypeAdd(period.value[0].value); - title.value = "鏂板浜у搧浜ч噺褰曞叆"; - open.value = true; + reset() + form.value.nodeId = queryParams.value.nodeId + form.value.nodeName = queryParams.value.nodeName + handleTimeTypeAdd(period.value[0].value) + title.value = "鏂板浜у搧浜ч噺褰曞叆" + open.value = true } function handleTimeTypeAdd(e) { - form.value.timeType = e; - form.value.dataTime = proxy - .dayjs(new Date()) - .format(e == "YEAR" ? "YYYY" : e == "MONTH" ? "YYYY-MM" : "YYYY-MM-DD"); + form.value.timeType = e + form.value.dataTime = proxy.dayjs(new Date()).format(e == "YEAR" ? "YYYY" : e == "MONTH" ? "YYYY-MM" : "YYYY-MM-DD") } // 杈呭姪褰曞叆-浜у搧浜ч噺褰曞叆-缂栬緫 function handleUpdate(row) { - reset(); - form.value = { ...row }; - open.value = true; - title.value = "缂栬緫浜у搧浜ч噺褰曞叆"; + reset() + form.value = { ...row } + open.value = true + title.value = "缂栬緫浜у搧浜ч噺褰曞叆" } // 杈呭姪褰曞叆-浜у搧浜ч噺褰曞叆-鏂板/缂栬緫-淇濆瓨 function submitForm() { @@ -452,24 +348,24 @@ if (valid) { if (form.value.productOutputId != undefined) { updateProductoutput(form.value).then((response) => { - proxy.$modal.msgSuccess("淇敼鎴愬姛"); - open.value = false; - getList(); - }); + proxy.$modal.msgSuccess("淇敼鎴愬姛") + open.value = false + getList() + }) } else { addProductoutput(form.value).then((response) => { - proxy.$modal.msgSuccess("鏂板鎴愬姛"); - open.value = false; - getList(); - }); + proxy.$modal.msgSuccess("鏂板鎴愬姛") + open.value = false + getList() + }) } } - }); + }) } // 杈呭姪褰曞叆-浜у搧浜ч噺褰曞叆-鏂板/缂栬緫-鍙栨秷 function cancel() { - open.value = false; - reset(); + open.value = false + reset() } // 杈呭姪褰曞叆-浜у搧浜ч噺褰曞叆-鏂板/缂栬緫-琛ㄥ崟閲嶇疆 function reset() { @@ -480,8 +376,8 @@ number: "1", timeType: "", unit: "", - }; - proxy.resetForm("formRef"); + } + proxy.resetForm("formRef") } // 杈呭姪褰曞叆-浜у搧浜ч噺褰曞叆-鍒犻櫎 function handleDelete(row) { @@ -489,13 +385,13 @@ .confirm('鏄惁纭鍒犻櫎鏃堕棿涓�"' + row.dataTime + '"鐨勬暟鎹」锛�') // .confirm('鏄惁纭鍒犻櫎浜у搧鍚嶇О涓�"' + row.name + '"鐨勬暟鎹」锛�') .then(function () { - return delProductoutput(row.productOutputId); + return delProductoutput(row.productOutputId) }) .then(() => { - getList(); - proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛"); + getList() + proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛") }) - .catch(() => {}); + .catch(() => {}) } </script> <style scoped lang="scss"> diff --git a/zhitan-vue/src/views/businessconfiguration/alarmmaintenance/alarmMaintenance.vue b/zhitan-vue/src/views/businessconfiguration/alarmmaintenance/alarmMaintenance.vue index 5be2000..912affb 100644 --- a/zhitan-vue/src/views/businessconfiguration/alarmmaintenance/alarmMaintenance.vue +++ b/zhitan-vue/src/views/businessconfiguration/alarmmaintenance/alarmMaintenance.vue @@ -9,14 +9,13 @@ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button> <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> </el-form-item> + <el-form-item style="float: right"> + <el-button type="primary" icon="plus" @click="handleAdd">鏂板</el-button> + </el-form-item> </el-form> </div> <div class="table-bg-style"> - <div class="theme-dark-mt20 mb20 ml20"> - <el-button type="primary" icon="plus" @click="handleAdd">鏂板</el-button> - <!-- <el-button type="primary" icon="Delete">鍒犻櫎</el-button> --> - </div> <div class="table-box"> <el-table :data="tableData" v-loading="loading"> <el-table-column prop="limitName" label="闄愬�肩被鍨嬪悕绉�" show-overflow-tooltip align="center" /> diff --git a/zhitan-vue/src/views/businessconfiguration/gatewayledger/gatewayLedger.vue b/zhitan-vue/src/views/businessconfiguration/gatewayledger/gatewayLedger.vue index a7f3304..b11dd9d 100644 --- a/zhitan-vue/src/views/businessconfiguration/gatewayledger/gatewayLedger.vue +++ b/zhitan-vue/src/views/businessconfiguration/gatewayledger/gatewayLedger.vue @@ -11,14 +11,13 @@ <el-form-item label="娴嬬偣鏁伴噺:" class="header-box"> <span class="count">{{ ptNum || 0 }}</span> </el-form-item> + <div class="mb20 ml20 mr20" style="float: right"> + <el-button type="primary" icon="plus" @click="handleAdd">鏂板</el-button> + <el-button type="primary" icon="Download" @click="handleExport">瀵煎嚭</el-button> + </div> </el-form> </div> <div class="table-bg-style"> - <div class="theme-dark-mt20 mb20 ml20"> - <el-button type="primary" icon="plus" @click="handleAdd">鏂板</el-button> - <el-button type="primary" icon="Download" @click="handleExport">瀵煎嚭</el-button> - </div> - <div class="table-box"> <el-table :data="tableData" v-loading="loading"> <el-table-column prop="gatewayNum" label="缃戝叧缂栧彿" show-overflow-tooltip align="center" /> diff --git a/zhitan-vue/src/views/businessconfiguration/prealarmmanage/prealarmmanage.vue b/zhitan-vue/src/views/businessconfiguration/prealarmmanage/prealarmmanage.vue index f8402c3..a3f48e8 100644 --- a/zhitan-vue/src/views/businessconfiguration/prealarmmanage/prealarmmanage.vue +++ b/zhitan-vue/src/views/businessconfiguration/prealarmmanage/prealarmmanage.vue @@ -1,140 +1,143 @@ <template> - <div class="page"> - <div class="page-container"> - <div class="page-container-left"> - <LeftTree ref="leftTreeRef" @handleNodeClick="handleNodeClick" /> + <div class="page"> + <div class="page-container"> + <div class="page-container-left"> + <LeftTree ref="leftTreeRef" @handleNodeClick="handleNodeClick" /> + </div> + <div class="page-container-right"> + <div class="page-container-right"> + <div class="tab-box"> + <div class="tab-li" :class="tab == 1 ? 'is-tab' : ''" @click="handleTab('1')">閲囬泦鐐圭鐞�</div> + <div class="tab-li" :class="tab == 2 ? 'is-tab' : ''" @click="handleTab('2')">缁熻鎸囨爣绠$悊</div> + </div> + <BaseCard :title="currentNode ? currentNode.label + '--鑺傜偣閰嶇疆' : '鏆傛棤鑺傜偣閰嶇疆'"> + <div> + <div class="content-box" v-if="tab == '1'"> + <CollectionPointManage ref="collectionPointManageRef" /> + </div> + <div class="content-box" v-if="tab == '2'"> + <StatisticalIndicatorsManage ref="statisticalIndicatorsManageRef" /> + </div> </div> - <div class="page-container-right"> - <div class="page-container-right"> - <div class="mb20 mt20 ml20 tab-box"> - <div class="tab-li" :class="tab == 1 ? 'is-tab' : ''" @click="handleTab('1')"> - 閲囬泦鐐圭鐞� - </div> - <div class="tab-li" :class="tab == 2 ? 'is-tab' : ''" @click="handleTab('2')"> - 缁熻鎸囨爣绠$悊 - </div> - </div> - <BaseCard :title="currentNode ? currentNode.label + '--鑺傜偣閰嶇疆' : '鏆傛棤鑺傜偣閰嶇疆'"> - <div> - <div class="content-box" v-if="tab == '1'"> - <CollectionPointManage ref="collectionPointManageRef" /> - </div> - <div class="content-box" v-if="tab == '2'"> - <StatisticalIndicatorsManage ref="statisticalIndicatorsManageRef" /> - </div> - </div> - </BaseCard> - </div> - </div> - + </BaseCard> </div> + </div> </div> + </div> </template> <script setup name="preAlarmManage"> -import CollectionPointManage from './components/collectionpointmanage/CollectionPointManage.vue' -import StatisticalIndicatorsManage from './components/statisticalindicatorsmanage/StatisticalIndicatorsManage.vue' +import CollectionPointManage from "./components/collectionpointmanage/CollectionPointManage.vue" +import StatisticalIndicatorsManage from "./components/statisticalindicatorsmanage/StatisticalIndicatorsManage.vue" let currentNode = ref() -let tab = ref('1') +let tab = ref("1") let collectionPointManageRef = ref() -let statisticalIndicatorsManageRef = ref('1') +let statisticalIndicatorsManageRef = ref("1") function handleTab(value) { - tab.value = value - nextTick(() => { - if (value == 1 && collectionPointManageRef.value) { - collectionPointManageRef.value.getList(currentNode.value) - } - if (value == 2 && statisticalIndicatorsManageRef.value) { - statisticalIndicatorsManageRef.value.getList(currentNode.value) - } - }); - + tab.value = value + nextTick(() => { + if (value == 1 && collectionPointManageRef.value) { + collectionPointManageRef.value.getList(currentNode.value) + } + if (value == 2 && statisticalIndicatorsManageRef.value) { + statisticalIndicatorsManageRef.value.getList(currentNode.value) + } + }) } function handleNodeClick(data) { - currentNode.value = data - handleTab(tab.value) - // handleQuery(); + currentNode.value = data + handleTab(tab.value) + // handleQuery(); } - </script> <style scoped lang="scss"> @import "@/assets/styles/page.scss"; - .page-box { - height: calc(100vh - 145px); + height: calc(100vh - 145px); - .tree-box { - height: calc(100% - 70px); - overflow-y: auto !important; + .tree-box { + height: calc(100% - 70px); + overflow-y: auto !important; + } + + .select-box { + display: flex; + align-items: center; + + :deep .el-icon { + color: #fff; + margin: 0 10px 0 15px; + font-size: 20px; + // &:hover{ + // color: #3371EB; + // } } + } - .select-box { - display: flex; - align-items: center; + .node-opt { + flex: 1; + text-align: right; + margin-right: 5px; - :deep .el-icon { - color: #fff; - margin: 0 10px 0 15px; - font-size: 20px; - // &:hover{ - // color: #3371EB; - // } - } + :deep .el-icon { + color: #fff; + margin-right: 5px; } - - .node-opt { - flex: 1; - text-align: right; - margin-right: 5px; - - :deep .el-icon { - color: #fff; - margin-right: 5px; - } - } - - + } } :deep .el-tabs__nav-wrap:after { - background: transparent; + background: transparent; } :deep .el-tabs__item { - color: #fff; - font-size: 20px; - padding: 0 20px; + color: #fff; + // font-size: 20px; + padding: 0 20px; - &.is-active, - &:hover { - color: #999 !important; - } + &.is-active, + &:hover { + color: #999 !important; + } } .tab-box { - display: flex; - align-items: center; + display: flex; + align-items: center; + color: #fff; + border-bottom: 1px solid #3371eb; + margin-right: 20px; + font-size: 15px; + margin-left: 15px; + + .tab-li { + cursor: pointer; + border: 1px solid #3371eb; + padding: 8px 20px; + border-radius: 5px 5px 0 0; + } + + .is-tab { + background: #3371eb; color: #fff; - border-bottom: 1px solid #3371EB; - margin-right: 20px; + } +} +.themeDark { + .tab-box { + color: #fff; + } +} - .tab-li { - cursor: pointer; - border: 1px solid #3371EB; - padding: 10px 25px; - border-radius: 5px 5px 0 0; - } - - .is-tab { - background: #3371EB; - } +.themeLight { + .tab-box { + color: #333; + } } .content-box { - height: calc(100vh - 317px) !important; - + height: calc(100vh - 317px) !important; } -</style> \ No newline at end of file +</style> diff --git a/zhitan-vue/src/views/carbonemission/carbonEmission.vue b/zhitan-vue/src/views/carbonemission/carbonEmission.vue index 550abd7..2beaf06 100644 --- a/zhitan-vue/src/views/carbonemission/carbonEmission.vue +++ b/zhitan-vue/src/views/carbonemission/carbonEmission.vue @@ -35,16 +35,16 @@ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> </el-form-item> <el-form-item> - <el-button type="primary" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button> + <el-button type="warning" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button> </el-form-item> </el-form> </div> <div style="height: calc(100vh - 220px) !important; max-height: calc(100vh - 220px) !important; overflow-y: auto" > - <div class="card-list" v-if="listTop.length > 1"> + <!-- <div class="" v-if="listTop.length > 1" style="margin: 12px 0 0 18px"> <el-button @click="dialogVisible = true"> 鏌ョ湅鏇村 </el-button> - </div> + </div> --> <template v-for="(row, rowIndex) in listTop" :key="rowIndex" v-loading="loading"> <div class="card-list" v-if="rowIndex == 0"> <template v-for="(item, index) in row" :key="index"> diff --git a/zhitan-vue/src/views/comprehensive/comps/LineChart.vue b/zhitan-vue/src/views/comprehensive/comps/LineChart.vue index 891d8e5..75914f3 100644 --- a/zhitan-vue/src/views/comprehensive/comps/LineChart.vue +++ b/zhitan-vue/src/views/comprehensive/comps/LineChart.vue @@ -49,7 +49,7 @@ color: "#2979ff", }, }, - color: ["#2979ff", "#19be6b", "#ff9900", "#fa3534"], + color: ["#40c2ff", "#2979ff", "#ff9900", "#fa3534"], tooltip: { trigger: "axis", axisPointer: { @@ -65,7 +65,7 @@ }, }, grid: { - top: "40", + top: "60", left: "50", right: "40", bottom: "20", diff --git a/zhitan-vue/src/views/comprehensive/dailyComprehensive/index.vue b/zhitan-vue/src/views/comprehensive/dailyComprehensive/index.vue index a3d5183..8ef4282 100644 --- a/zhitan-vue/src/views/comprehensive/dailyComprehensive/index.vue +++ b/zhitan-vue/src/views/comprehensive/dailyComprehensive/index.vue @@ -154,32 +154,6 @@ console.log(expectedData) lineChartData.value = { - // xData: [ - // "0鏃�", - // "1鏃�", - // "2鏃�", - // "3鏃�", - // "4鏃�", - // "5鏃�", - // "6鏃�", - // "7鏃�", - // "8鏃�", - // "9鏃�", - // "10鏃�", - // "11鏃�", - // "12鏃�", - // "13鏃�", - // "14鏃�", - // "15鏃�", - // "16鏃�", - // "17鏃�", - // "18鏃�", - // "19鏃�", - // "20鏃�", - // "21鏃�", - // "22鏃�", - // "23鏃�", - // ], xData: actualData, yData: expectedData, title, diff --git a/zhitan-vue/src/views/dataMonitoring/historyDataTrend/index.vue b/zhitan-vue/src/views/dataMonitoring/historyDataTrend/index.vue index 1f64bec..2686774 100644 --- a/zhitan-vue/src/views/dataMonitoring/historyDataTrend/index.vue +++ b/zhitan-vue/src/views/dataMonitoring/historyDataTrend/index.vue @@ -52,7 +52,7 @@ </div> </div> <div class="chart-box" v-loading="loading" v-show="activeKey === 1"> - <LineChart ref="LineChartRef" :chartData="lineChartData" /> + <LineChart ref="LineChartRef" :chartData="lineChartData" :chartType="'bar'" /> </div> <div style="margin-top: 16px" v-show="activeKey === 2"> <div class="" style="padding: 0 16px"> diff --git a/zhitan-vue/src/views/energyanalysis/comprehensive/comprehensive.vue b/zhitan-vue/src/views/energyanalysis/comprehensive/comprehensive.vue index 2983c5b..4b0a1c6 100644 --- a/zhitan-vue/src/views/energyanalysis/comprehensive/comprehensive.vue +++ b/zhitan-vue/src/views/energyanalysis/comprehensive/comprehensive.vue @@ -8,42 +8,40 @@ <div class="form-card"> <el-form :model="queryParams" ref="queryRef" :inline="true"> <el-form-item label="鏈熼棿" prop="timeType"> - <el-select v-model="queryParams.timeType" placeholder="鏈熼棿" clearable style="width: 120px" - @change="handleTimeType"> + <el-select + v-model="queryParams.timeType" + placeholder="鏈熼棿" + clearable + style="width: 120px" + @change="handleTimeType" + > <el-option v-for="dict in period" :key="dict.value" :label="dict.label" :value="dict.value" /> </el-select> </el-form-item> <el-form-item label="鏃堕棿"> - <el-date-picker v-model="queryParams.dataTime" :type="queryParams.timeType == 'YEAR' - ? 'year' - : queryParams.timeType == 'MONTH' - ? 'month' - : 'date' - " :format="queryParams.timeType == 'YEAR' - ? 'YYYY' - : queryParams.timeType == 'MONTH' - ? 'YYYY-MM' - : 'YYYY-MM-DD' - " value-format="YYYY-MM-DD" placeholder="鏃堕棿" style="width: 100%" /> + <el-date-picker + v-model="queryParams.dataTime" + :type="queryParams.timeType == 'YEAR' ? 'year' : queryParams.timeType == 'MONTH' ? 'month' : 'date'" + :format=" + queryParams.timeType == 'YEAR' ? 'YYYY' : queryParams.timeType == 'MONTH' ? 'YYYY-MM' : 'YYYY-MM-DD' + " + value-format="YYYY-MM-DD" + placeholder="鏃堕棿" + style="width: 100%" + /> </el-form-item> <el-form-item> - <el-button type="primary" icon="Search" @click="handleQuery"> - 鎼滅储 - </el-button> - <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> + <el-button type="primary" icon="Search" @click="handleQuery"> 鎼滅储 </el-button> + <!-- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> --> </el-form-item> <el-form-item> - <el-button type="primary" icon="Download" @click="handleExport"> - 瀵煎嚭 - </el-button> + <el-button type="warning" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button> </el-form-item> </el-form> </div> - <div style=" - height: calc(100vh - 220px) !important; - max-height: calc(100vh - 220px) !important; - overflow-y: auto; - "> + <div + style="height: calc(100vh - 220px) !important; max-height: calc(100vh - 220px) !important; overflow-y: auto" + > <BaseCard :title="queryParams.nodeName + '-缁煎悎鑳借�楄秼鍔�'"> <div class="chart-box" v-loading="loading"> <div id="Chart1" /> @@ -53,13 +51,16 @@ <el-col :span="7"> <BaseCard :title="queryParams.nodeName + '-缁煎悎鑳借�楀悓姣旂幆姣�'"> <div class="card-list" v-loading="loading"> - <div class="card-list-item" v-show="settingsStore.sideTheme == 'theme-dark'" - :style="{ backgroundImage: 'url(' + item.bg + ')' }" v-for="item in comprehensiveTable" - :key="item.title"> + <div + class="card-list-item" + v-show="settingsStore.sideTheme == 'theme-dark'" + :style="{ backgroundImage: 'url(' + item.bg + ')' }" + v-for="item in comprehensiveTable" + :key="item.title" + > <div class="item-left"> {{ Math.abs(item.icon) }}% - <el-icon :color="item.icon > 0 ? 'green' : item.icon < 0 ? 'red' : '' - "> + <el-icon :color="item.icon > 0 ? 'green' : item.icon < 0 ? 'red' : ''"> <Top v-if="item.icon > 0" /> <Bottom v-if="item.icon < 0" /> </el-icon> @@ -72,18 +73,19 @@ <div class="item-right-bottom-left"> {{ node.label }} </div> - <div class="item-right-bottom-right"> - {{ Number(node.value.toFixed(2)) }} tce - </div> + <div class="item-right-bottom-right">{{ Number(node.value.toFixed(2)) }} tce</div> </div> </div> </div> - <div class="card-list-item" v-show="settingsStore.sideTheme == 'theme-light'" - v-for="item in comprehensiveTable" :key="item.title"> + <div + class="card-list-item" + v-show="settingsStore.sideTheme == 'theme-light'" + v-for="item in comprehensiveTable" + :key="item.title" + > <div class="item-left"> {{ Math.abs(item.icon) }} % - <el-icon :color="item.icon > 0 ? 'green' : item.icon < 0 ? 'red' : '' - "> + <el-icon :color="item.icon > 0 ? 'green' : item.icon < 0 ? 'red' : ''"> <Top v-if="item.icon > 0" /> <Bottom v-if="item.icon < 0" /> </el-icon> @@ -96,9 +98,7 @@ <div class="item-right-bottom-left"> {{ node.label }} </div> - <div class="item-right-bottom-right"> - {{ Number(node.value.toFixed(2)) }}tce - </div> + <div class="item-right-bottom-right">{{ Number(node.value.toFixed(2)) }}tce</div> </div> </div> </div> @@ -123,10 +123,20 @@ <BaseCard :title="queryParams.nodeName + '-缁煎悎鑳借�楃粺璁″垎鏋愯〃'" v-loading="loading"> <div class="table-box"> <el-table :data="comprehensiveList" show-summary> - <el-table-column label="鏃ユ湡" align="center" key="currentTime" prop="currentTime" - :show-overflow-tooltip="true" /> - <el-table-column label="缁煎悎鑳借�楅噺(tce)" align="center" key="currentValue" prop="currentValue" - :show-overflow-tooltip="true" /> + <el-table-column + label="鏃ユ湡" + align="center" + key="currentTime" + prop="currentTime" + :show-overflow-tooltip="true" + /> + <el-table-column + label="缁煎悎鑳借�楅噺(tce)" + align="center" + key="currentValue" + prop="currentValue" + :show-overflow-tooltip="true" + /> </el-table> </div> </BaseCard> @@ -137,26 +147,22 @@ </template> <script setup name="comprehensive"> -import { - listComprehensive, - listYoY, - listEnergyRanking, -} from "@/api/energyAnalysis/energyAnalysis"; -import { listEnergyTypeList } from "@/api/modelConfiguration/energyType"; -import * as echarts from "echarts"; -const { proxy } = getCurrentInstance(); -const { period } = proxy.useDict("period"); -import { useRoute } from "vue-router"; -import useSettingsStore from "@/store/modules/settings"; -const settingsStore = useSettingsStore(); +import { listComprehensive, listYoY, listEnergyRanking } from "@/api/energyAnalysis/energyAnalysis" +import { listEnergyTypeList } from "@/api/modelConfiguration/energyType" +import * as echarts from "echarts" +const { proxy } = getCurrentInstance() +const { period } = proxy.useDict("period") +import { useRoute } from "vue-router" +import useSettingsStore from "@/store/modules/settings" +const settingsStore = useSettingsStore() watch( () => settingsStore.sideTheme, (val) => { - getList(); + getList() } -); -import index_card_1 from "@/assets/images/home/index-card-3.png"; -import index_card_2 from "@/assets/images/home/index-card-4.png"; +) +import index_card_1 from "@/assets/images/home/index-card-3.png" +import index_card_2 from "@/assets/images/home/index-card-4.png" const comprehensiveTable = ref([ { bg: index_card_1, @@ -188,9 +194,9 @@ }, ], }, -]); -const comprehensiveList = ref([]); -const loading = ref(false); +]) +const comprehensiveList = ref([]) +const loading = ref(false) const data = reactive({ queryParams: { nodeId: null, @@ -200,35 +206,35 @@ query: { modelCode: null, }, -}); -const { queryParams, query } = toRefs(data); +}) +const { queryParams, query } = toRefs(data) /** 鑺傜偣鍗曞嚮浜嬩欢 */ function handleNodeClick(data) { - queryParams.value.nodeId = data.id; - queryParams.value.nodeName = data.label; - handleTimeType(period.value[0].value); - handleQuery(); + queryParams.value.nodeId = data.id + queryParams.value.nodeName = data.label + handleTimeType(period.value[0].value) + handleQuery() } function handleTimeType(e) { - queryParams.value.timeType = e; - queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD"); + queryParams.value.timeType = e + queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD") } // 鑳借�楀姣斿垎鏋�-缁煎悎鑳借�楀垎鏋�-鍒楄〃 function getList() { - loading.value = true; + loading.value = true // 鍦ㄥ垵濮嬪寲涔嬪墠锛屽厛dispose鏃х殑瀹炰緥 if (echarts.getInstanceByDom(document.getElementById("Chart1"))) { - echarts.dispose(document.getElementById("Chart1")); + echarts.dispose(document.getElementById("Chart1")) } if (echarts.getInstanceByDom(document.getElementById("Chart2"))) { - echarts.dispose(document.getElementById("Chart2")); + echarts.dispose(document.getElementById("Chart2")) } if (echarts.getInstanceByDom(document.getElementById("Chart3"))) { - echarts.dispose(document.getElementById("Chart3")); + echarts.dispose(document.getElementById("Chart3")) } - const myChart1 = echarts.init(document.getElementById("Chart1")); - const myChart2 = echarts.init(document.getElementById("Chart2")); - const myChart3 = echarts.init(document.getElementById("Chart3")); + const myChart1 = echarts.init(document.getElementById("Chart1")) + const myChart2 = echarts.init(document.getElementById("Chart2")) + const myChart3 = echarts.init(document.getElementById("Chart3")) listComprehensive( proxy.addDateRange({ ...queryParams.value, @@ -236,28 +242,24 @@ }) ).then((res) => { if (!!res.code && res.code == 200) { - loading.value = false; - let xdata = []; - let yvalue = []; - let ycompareValue = []; - let yqoq = []; + loading.value = false + let xdata = [] + let yvalue = [] + let ycompareValue = [] + let yqoq = [] if (!!res.data.chartDataList) { res.data.chartDataList.map((item) => { xdata.push( proxy .dayjs(item.xdata) .format( - queryParams.value.timeType == "YEAR" - ? "MM鏈�" - : queryParams.value.timeType == "MONTH" - ? "DD鏃�" - : "HH鏃�" + queryParams.value.timeType == "YEAR" ? "MM鏈�" : queryParams.value.timeType == "MONTH" ? "DD鏃�" : "HH鏃�" ) - ); - yvalue.push(!!item.yvalue ? item.yvalue : 0); - ycompareValue.push(!!item.ycompareValue ? item.ycompareValue : 0); - yqoq.push(!!item.yqoq ? item.yqoq : 0); - }); + ) + yvalue.push(!!item.yvalue ? item.yvalue : 0) + ycompareValue.push(!!item.ycompareValue ? item.ycompareValue : 0) + yqoq.push(!!item.yqoq ? item.yqoq : 0) + }) } setTimeout(() => { myChart1.setOption({ @@ -273,13 +275,12 @@ itemWidth: 14, itemHeight: 10, textStyle: { - color: - settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", }, }, grid: { - top: "45", - left: "7%", + top: "60", + left: "5%", right: "5%", bottom: "10", containLabel: true, @@ -292,10 +293,7 @@ axisLine: { show: true, lineStyle: { - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", }, }, axisTick: { @@ -308,8 +306,7 @@ show: false, }, axisLabel: { - color: - settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", fontSize: 14, padding: [5, 0, 0, 0], // formatter: '{value} ml' @@ -321,10 +318,7 @@ type: "value", name: "tce", nameTextStyle: { - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", fontSize: 14, padding: [0, 0, 5, 0], }, @@ -335,10 +329,7 @@ show: true, lineStyle: { type: "dashed", - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", }, }, axisTick: { @@ -348,10 +339,7 @@ show: false, }, axisLabel: { - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", fontSize: 14, }, }, @@ -363,7 +351,7 @@ barWidth: "16", tooltip: { valueFormatter: function (value) { - return value + "tce"; + return value + "tce" }, }, itemStyle: { @@ -383,7 +371,7 @@ barWidth: "16", tooltip: { valueFormatter: function (value) { - return value + "tce"; + return value + "tce" }, }, itemStyle: { @@ -398,29 +386,29 @@ }, }, ], - }); - }, 100); - let total = 0; - let seriesData = []; + }) + }, 100) + let total = 0 + let seriesData = [] if (!!res.data.energyProportion && res.data.energyProportion.length > 0) { res.data.energyProportion.map((item) => { seriesData.push({ name: item.energyName, value: Number(item.count).toFixed(2), - }); - }); + }) + }) seriesData.forEach(function (val) { - total += Number(val.value); - }); + total += Number(val.value) + }) } else { listEnergyTypeList().then((resEnergyTypeList) => { resEnergyTypeList.data.map((item) => { seriesData.push({ name: item.enername, value: Number(0), - }); - }); - }); + }) + }) + }) } setTimeout(() => { myChart2.setOption({ @@ -449,40 +437,30 @@ verticalAlign: "middle", rich: { name: { - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", fontSize: 14, }, value: { - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", fontSize: 14, }, rate: { - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", fontSize: 14, }, }, }, data: seriesData, formatter: (name) => { - let target, percent, muid; + let target, percent, muid for (let i = 0; i < seriesData.length; i++) { if (seriesData[i].name === name) { - target = seriesData[i].value; - muid = seriesData[i].muid; - percent = - total != 0 ? ((target / total) * 100).toFixed(2) : 0; + target = seriesData[i].value + muid = seriesData[i].muid + percent = total != 0 ? ((target / total) * 100).toFixed(2) : 0 } } - return `{name|${name}(tce) }{value| ${target}} {rate| ${percent}%}`; + return `{name|${name}(tce) }{value| ${target}} {rate| ${percent}%}` }, }, series: [ @@ -500,76 +478,54 @@ data: seriesData, }, ], - }); - }, 100); + }) + }, 100) - comprehensiveList.value = !!res.data.dataList ? res.data.dataList : []; + comprehensiveList.value = !!res.data.dataList ? res.data.dataList : [] window.addEventListener( "resize", () => { - myChart1.resize(); - myChart2.resize(); + myChart1.resize() + myChart2.resize() }, { passive: true } - ); + ) } - }); + }) listYoY( proxy.addDateRange({ ...queryParams.value, }) ).then((res) => { if (!!res.data.tongbi) { - comprehensiveTable.value[0].icon = !!res.data.tongbi.ratio - ? res.data.tongbi.ratio - : 0; - comprehensiveTable.value[0].data[0].label = !!res.data.tongbi.currentTime - ? res.data.tongbi.currentTime - : 0; - comprehensiveTable.value[0].data[0].value = !!res.data.tongbi.currentValue - ? res.data.tongbi.currentValue - : 0; - comprehensiveTable.value[0].data[1].label = !!res.data.tongbi.compareTime - ? res.data.tongbi.compareTime - : 0; - comprehensiveTable.value[0].data[1].value = !!res.data.tongbi.compareValue - ? res.data.tongbi.compareValue - : 0; + comprehensiveTable.value[0].icon = !!res.data.tongbi.ratio ? res.data.tongbi.ratio : 0 + comprehensiveTable.value[0].data[0].label = !!res.data.tongbi.currentTime ? res.data.tongbi.currentTime : 0 + comprehensiveTable.value[0].data[0].value = !!res.data.tongbi.currentValue ? res.data.tongbi.currentValue : 0 + comprehensiveTable.value[0].data[1].label = !!res.data.tongbi.compareTime ? res.data.tongbi.compareTime : 0 + comprehensiveTable.value[0].data[1].value = !!res.data.tongbi.compareValue ? res.data.tongbi.compareValue : 0 } if (!!res.data.huanbi) { - comprehensiveTable.value[1].icon = !!res.data.huanbi.ratio - ? res.data.huanbi.ratio - : 0; - comprehensiveTable.value[1].data[0].label = !!res.data.huanbi.currentTime - ? res.data.huanbi.currentTime - : 0; - comprehensiveTable.value[1].data[0].value = !!res.data.huanbi.currentValue - ? res.data.huanbi.currentValue - : 0; - comprehensiveTable.value[1].data[1].label = !!res.data.huanbi.compareTime - ? res.data.huanbi.compareTime - : 0; - comprehensiveTable.value[1].data[1].value = !!res.data.huanbi.compareValue - ? res.data.huanbi.compareValue - : 0; + comprehensiveTable.value[1].icon = !!res.data.huanbi.ratio ? res.data.huanbi.ratio : 0 + comprehensiveTable.value[1].data[0].label = !!res.data.huanbi.currentTime ? res.data.huanbi.currentTime : 0 + comprehensiveTable.value[1].data[0].value = !!res.data.huanbi.currentValue ? res.data.huanbi.currentValue : 0 + comprehensiveTable.value[1].data[1].label = !!res.data.huanbi.compareTime ? res.data.huanbi.compareTime : 0 + comprehensiveTable.value[1].data[1].value = !!res.data.huanbi.compareValue ? res.data.huanbi.compareValue : 0 } - }); + }) listEnergyRanking( proxy.addDateRange({ ...queryParams.value, }) ).then((res) => { - let nodeName = []; - let energyConsumption = []; - let maxenergyConsumption = []; + let nodeName = [] + let energyConsumption = [] + let maxenergyConsumption = [] if (!!res.data) { res.data.map((item, index) => { - nodeName.push(item.nodeName); - energyConsumption.push( - !!item.energyConsumption ? item.energyConsumption : 0 - ); - maxenergyConsumption[index] = res.data[0].energyConsumption; - }); + nodeName.push(item.nodeName) + energyConsumption.push(!!item.energyConsumption ? item.energyConsumption : 0) + maxenergyConsumption[index] = res.data[0].energyConsumption + }) } setTimeout(() => { myChart3.setOption({ @@ -586,7 +542,7 @@ type: "none", }, formatter: function (params) { - return params[0].name + " : " + params[0].value; + return params[0].name + " : " + params[0].value }, }, xAxis: { @@ -599,38 +555,17 @@ inverse: true, axisLabel: { interval: 0, - color: - settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#000", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#000", fontSize: 14, formatter: function (value, index) { if (index == 0) { - return ( - "{idx0|" + - (1 + index + 0) + - "}{title|" + - value + - "}" - ); + return "{idx0|" + (1 + index + 0) + "}{title|" + value + "}" } else if (index == 1) { - return ( - "{idx1|" + - (1 + index + 0) + - "}{title|" + - value + - "}" - ); + return "{idx1|" + (1 + index + 0) + "}{title|" + value + "}" } else if (index == 2) { - return ( - "{idx2|" + - (1 + index + 0) + - "}{title|" + - value + - "}" - ); + return "{idx2|" + (1 + index + 0) + "}{title|" + value + "}" } else { - return ( - "{idx|" + (1 + index + 0) + "}{title|" + value + "}" - ); + return "{idx|" + (1 + index + 0) + "}{title|" + value + "}" } }, rich: { @@ -681,8 +616,7 @@ axisLine: "none", show: true, axisLabel: { - color: - settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#000", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#000", fontSize: "12", }, data: energyConsumption, @@ -721,27 +655,27 @@ data: energyConsumption, }, ], - }); - }, 100); + }) + }, 100) window.addEventListener( "resize", () => { - myChart3.resize(); + myChart3.resize() }, { passive: true } - ); - }); + ) + }) } // 鑳借�楀姣斿垎鏋�-缁煎悎鑳借�楀垎鏋�-鎼滅储 function handleQuery() { - getList(); + getList() } // 鑳借�楀姣斿垎鏋�-缁煎悎鑳借�楀垎鏋�-閲嶇疆 function resetQuery() { - proxy.resetForm("queryRef"); - handleTimeType(period.value[0].value); - queryParams.value.analysisType = "YOY"; - handleQuery(); + proxy.resetForm("queryRef") + handleTimeType(period.value[0].value) + queryParams.value.analysisType = "YOY" + handleQuery() } // 鑳借�楀姣斿垎鏋�-缁煎悎鑳借�楀垎鏋�-瀵煎嚭 function handleExport() { @@ -752,7 +686,7 @@ ...query.value, }, `${queryParams.value.nodeName}-缁煎悎鑳借�楃粺璁″垎鏋愯〃_${new Date().getTime()}.xlsx` - ); + ) } </script> <style scoped lang="scss"> diff --git a/zhitan-vue/src/views/energyanalysis/department/department.vue b/zhitan-vue/src/views/energyanalysis/department/department.vue index 26a605c..95ceea7 100644 --- a/zhitan-vue/src/views/energyanalysis/department/department.vue +++ b/zhitan-vue/src/views/energyanalysis/department/department.vue @@ -8,58 +8,56 @@ <div class="form-card"> <el-form :model="queryParams" ref="queryRef" :inline="true"> <el-form-item label="鏈熼棿" prop="timeType"> - <el-select v-model="queryParams.timeType" placeholder="鏈熼棿" clearable style="width: 120px" - @change="handleTimeType"> + <el-select + v-model="queryParams.timeType" + placeholder="鏈熼棿" + clearable + style="width: 120px" + @change="handleTimeType" + > <el-option v-for="dict in period" :key="dict.value" :label="dict.label" :value="dict.value" /> </el-select> </el-form-item> <el-form-item label="鏃堕棿"> - <el-date-picker v-model="queryParams.dataTime" :type="queryParams.timeType == 'YEAR' - ? 'year' - : queryParams.timeType == 'MONTH' - ? 'month' - : 'date' - " :format="queryParams.timeType == 'YEAR' - ? 'YYYY' - : queryParams.timeType == 'MONTH' - ? 'YYYY-MM' - : 'YYYY-MM-DD' - " value-format="YYYY-MM-DD" placeholder="鏃堕棿" style="width: 100%" /> + <el-date-picker + v-model="queryParams.dataTime" + :type="queryParams.timeType == 'YEAR' ? 'year' : queryParams.timeType == 'MONTH' ? 'month' : 'date'" + :format=" + queryParams.timeType == 'YEAR' ? 'YYYY' : queryParams.timeType == 'MONTH' ? 'YYYY-MM' : 'YYYY-MM-DD' + " + value-format="YYYY-MM-DD" + placeholder="鏃堕棿" + style="width: 100%" + /> </el-form-item> <el-form-item label="鑳芥簮绫诲瀷" prop="energyType"> <el-select v-model="queryParams.energyType" placeholder="鑳芥簮绫诲瀷" clearable style="width: 120px"> - <el-option :label="item.enername" :value="item.enersno" v-for="item in energyTypeList" - :key="item.enersno" @click="handleEnergyType(item)" /> + <el-option + :label="item.enername" + :value="item.enersno" + v-for="item in energyTypeList" + :key="item.enersno" + @click="handleEnergyType(item)" + /> </el-select> </el-form-item> <el-form-item> - <el-button type="primary" icon="Search" @click="handleQuery"> - 鎼滅储 - </el-button> - <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> + <el-button type="primary" icon="Search" @click="handleQuery"> 鎼滅储 </el-button> + <!-- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> --> </el-form-item> <el-form-item> - <el-button :type="queryParams.analysisType == 'YOY' ? 'primary' : ''" @click="handleAnalysisType('YOY')"> - 鍚屾瘮 - </el-button> - <el-button :type="queryParams.analysisType == 'MOM' ? 'primary' : ''" @click="handleAnalysisType('MOM')"> - 鐜瘮 - </el-button> - </el-form-item> - <el-form-item> - <el-button type="primary" icon="Download" @click="handleExport"> - 瀵煎嚭 - </el-button> + <el-button type="warning" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button> </el-form-item> </el-form> </div> - <div style=" - height: calc(100vh - 220px) !important; - max-height: calc(100vh - 220px) !important; - overflow-y: auto; - " v-loading="loading"> - <!-- <el-row :gutter="24"> - <el-col :span="16"> --> + <div + style="height: calc(100vh - 220px) !important; max-height: calc(100vh - 220px) !important; overflow-y: auto" + v-loading="loading" + > + <el-tabs v-model="queryParams.analysisType" type="card" @tab-change="handleAnalysisType"> + <el-tab-pane label="鍚屾瘮" name="YOY"> </el-tab-pane> + <el-tab-pane label="鐜瘮" name="MOM"> </el-tab-pane> + </el-tabs> <BaseCard :title="queryParams.nodeName + '-鍘傚尯鑳借�楀垎鏋�'"> <div class="chart-box"> <div id="Chart1" /> @@ -74,30 +72,45 @@ </BaseCard> </el-col> <el-col :span="24"> --> - <BaseCard :title="queryParams.nodeName + - '-鍘傚尯鑳借�楀垎鏋愮粺璁″垎鏋愯〃-' + - queryParams.enername - "> + <BaseCard :title="queryParams.nodeName + '-鍘傚尯鑳借�楀垎鏋愮粺璁″垎鏋愯〃-' + queryParams.enername"> <div class="table-box"> <el-table :data="departmentList" show-summary> - <el-table-column label="鏈湡鏃堕棿" align="center" key="currentTime" prop="currentTime" - :show-overflow-tooltip="true" /> - <el-table-column :label="'鏈湡鑰�' + - queryParams.enername + - '(' + - queryParams.muid + - ')' - " align="center" key="currentValue" prop="currentValue" :show-overflow-tooltip="true" /> - <el-table-column label="鍚屾湡鏃堕棿" align="center" key="compareTime" prop="compareTime" - :show-overflow-tooltip="true" /> - <el-table-column :label="'鍚屾湡鑰�' + - queryParams.enername + - '(' + - queryParams.muid + - ')' - " align="center" key="compareValue" prop="compareValue" :show-overflow-tooltip="true" /> - <el-table-column :label="(queryParams.analysisType == 'YOY' ? '鍚�' : '鐜�') + '姣�(%)' - " align="center" key="ratio" prop="ratio" :show-overflow-tooltip="true" width="200" /> + <el-table-column + label="鏈湡鏃堕棿" + align="center" + key="currentTime" + prop="currentTime" + :show-overflow-tooltip="true" + /> + <el-table-column + :label="'鏈湡鑰�' + queryParams.enername + '(' + queryParams.muid + ')'" + align="center" + key="currentValue" + prop="currentValue" + :show-overflow-tooltip="true" + /> + <el-table-column + label="鍚屾湡鏃堕棿" + align="center" + key="compareTime" + prop="compareTime" + :show-overflow-tooltip="true" + /> + <el-table-column + :label="'鍚屾湡鑰�' + queryParams.enername + '(' + queryParams.muid + ')'" + align="center" + key="compareValue" + prop="compareValue" + :show-overflow-tooltip="true" + /> + <el-table-column + :label="(queryParams.analysisType == 'YOY' ? '鍚�' : '鐜�') + '姣�(%)'" + align="center" + key="ratio" + prop="ratio" + :show-overflow-tooltip="true" + width="200" + /> </el-table> </div> </BaseCard> @@ -110,26 +123,23 @@ </template> <script setup name="department"> -import { - listRegion, - listDepartment, -} from "@/api/energyAnalysis/energyAnalysis"; -import { listEnergyTypeList } from "@/api/modelConfiguration/energyType"; -import * as echarts from "echarts"; -const { proxy } = getCurrentInstance(); -const { period } = proxy.useDict("period"); -import { useRoute } from "vue-router"; -import useSettingsStore from "@/store/modules/settings"; -const settingsStore = useSettingsStore(); +import { listRegion, listDepartment } from "@/api/energyAnalysis/energyAnalysis" +import { listEnergyTypeList } from "@/api/modelConfiguration/energyType" +import * as echarts from "echarts" +const { proxy } = getCurrentInstance() +const { period } = proxy.useDict("period") +import { useRoute } from "vue-router" +import useSettingsStore from "@/store/modules/settings" +const settingsStore = useSettingsStore() watch( () => settingsStore.sideTheme, (val) => { - getList(); + getList() } -); -const energyTypeList = ref(undefined); -const departmentList = ref([]); -const loading = ref(false); +) +const energyTypeList = ref(undefined) +const departmentList = ref([]) +const loading = ref(false) const data = reactive({ queryParams: { nodeId: null, @@ -141,45 +151,45 @@ query: { modelCode: null, }, -}); -const { queryParams, query } = toRefs(data); +}) +const { queryParams, query } = toRefs(data) /** 鑺傜偣鍗曞嚮浜嬩欢 */ function handleNodeClick(data) { - queryParams.value.nodeId = data.id; - queryParams.value.nodeName = data.label; - handleTimeType(period.value[0].value); + queryParams.value.nodeId = data.id + queryParams.value.nodeName = data.label + handleTimeType(period.value[0].value) listEnergyTypeList().then((res) => { - energyTypeList.value = res.data; - queryParams.value.energyType = energyTypeList.value[0].enersno; - queryParams.value.enername = energyTypeList.value[0].enername; - queryParams.value.muid = energyTypeList.value[0].muid; - handleQuery(); - }); + energyTypeList.value = res.data + queryParams.value.energyType = energyTypeList.value[0].enersno + queryParams.value.enername = energyTypeList.value[0].enername + queryParams.value.muid = energyTypeList.value[0].muid + handleQuery() + }) } function handleTimeType(e) { - queryParams.value.timeType = e; - queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD"); + queryParams.value.timeType = e + queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD") } function handleEnergyType(item) { - queryParams.value.enername = item.enername; - queryParams.value.muid = item.muid; - handleQuery(); + queryParams.value.enername = item.enername + queryParams.value.muid = item.muid + handleQuery() } function handleAnalysisType(analysisType) { - queryParams.value.analysisType = analysisType; - getList(); + queryParams.value.analysisType = analysisType + getList() } // 鑳借�楀姣斿垎鏋�-绉戝鑳借�楀垎鏋�-鍒楄〃 function getList() { - loading.value = true; + loading.value = true // 鍦ㄥ垵濮嬪寲涔嬪墠锛屽厛dispose鏃х殑瀹炰緥 if (echarts.getInstanceByDom(document.getElementById("Chart1"))) { - echarts.dispose(document.getElementById("Chart1")); + echarts.dispose(document.getElementById("Chart1")) } // if (echarts.getInstanceByDom(document.getElementById("Chart2"))) { // echarts.dispose(document.getElementById("Chart2")); // } - const myChart1 = echarts.init(document.getElementById("Chart1")); + const myChart1 = echarts.init(document.getElementById("Chart1")) // const myChart2 = echarts.init(document.getElementById("Chart2")); listRegion( proxy.addDateRange({ @@ -188,35 +198,31 @@ }) ).then((res) => { if (!!res.code && res.code == 200) { - loading.value = false; - let xdata = []; - let yvalue = []; - let ycompareValue = []; - let yqoq = []; + loading.value = false + let xdata = [] + let yvalue = [] + let ycompareValue = [] + let yqoq = [] if (!!res.data.chartDataList) { res.data.chartDataList.map((item) => { xdata.push( proxy .dayjs(item.xdata) .format( - queryParams.value.timeType == "YEAR" - ? "MM鏈�" - : queryParams.value.timeType == "MONTH" - ? "DD鏃�" - : "HH鏃�" + queryParams.value.timeType == "YEAR" ? "MM鏈�" : queryParams.value.timeType == "MONTH" ? "DD鏃�" : "HH鏃�" ) - ); - yvalue.push(!!item.yvalue ? item.yvalue : 0); - ycompareValue.push(!!item.ycompareValue ? item.ycompareValue : 0); - yqoq.push(!!item.yqoq ? item.yqoq : 0); - }); + ) + yvalue.push(!!item.yvalue ? item.yvalue : 0) + ycompareValue.push(!!item.ycompareValue ? item.ycompareValue : 0) + yqoq.push(!!item.yqoq ? item.yqoq : 0) + }) } setTimeout(() => { myChart1.setOption({ color: ["#2979ff", "#19be6b", "#ff9900", "#fa3534"], grid: { - top: "45", - left: "7%", + top: "60", + left: "5%", right: "5%", bottom: "10", containLabel: true, @@ -232,8 +238,7 @@ itemWidth: 14, itemHeight: 10, textStyle: { - color: - settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", }, }, xAxis: { @@ -244,10 +249,7 @@ axisLine: { show: true, lineStyle: { - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", }, }, axisTick: { @@ -260,8 +262,7 @@ show: false, }, axisLabel: { - color: - settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", fontSize: 14, padding: [5, 0, 0, 0], // formatter: '{value} ml' @@ -271,17 +272,9 @@ yAxis: [ { type: "value", - name: - "鑰�" + - queryParams.value.enername + - "閲�(" + - queryParams.value.muid + - ")", + name: "鑰�" + queryParams.value.enername + "閲�(" + queryParams.value.muid + ")", nameTextStyle: { - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", fontSize: 14, padding: [0, 0, 5, 0], }, @@ -292,10 +285,7 @@ show: true, lineStyle: { type: "dashed", - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", }, }, axisTick: { @@ -305,10 +295,7 @@ show: false, }, axisLabel: { - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", fontSize: 14, }, }, @@ -317,10 +304,7 @@ name: queryParams.value.analysisType == "YOY" ? "鍚屾瘮(%)" : "鐜瘮(%)", alignTicks: true, nameTextStyle: { - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", fontSize: 14, padding: [0, 0, 5, 0], }, @@ -334,20 +318,14 @@ show: true, lineStyle: { type: "dashed", - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", }, }, splitArea: { show: false, }, axisLabel: { - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", fontSize: 14, }, }, @@ -359,7 +337,7 @@ barWidth: "8", tooltip: { valueFormatter: function (value) { - return value + queryParams.value.muid; + return value + queryParams.value.muid }, }, itemStyle: { @@ -379,7 +357,7 @@ barWidth: "8", tooltip: { valueFormatter: function (value) { - return value + queryParams.value.muid; + return value + queryParams.value.muid }, }, itemStyle: { @@ -400,24 +378,24 @@ symbol: "none", // 璁剧疆涓� 'none' 鍘绘帀鍦嗙偣 tooltip: { valueFormatter: function (value) { - return value + "%"; + return value + "%" }, }, data: yqoq, }, ], - }); - }, 100); - departmentList.value = !!res.data.dataList ? res.data.dataList : []; + }) + }, 100) + departmentList.value = !!res.data.dataList ? res.data.dataList : [] window.addEventListener( "resize", () => { - myChart1.resize(); + myChart1.resize() }, { passive: true } - ); + ) } - }); + }) // listDepartment( // proxy.addDateRange({ // ...queryParams.value, @@ -566,17 +544,17 @@ } // 鑳借�楀姣斿垎鏋�-绉戝鑳借�楀垎鏋�-鎼滅储 function handleQuery() { - getList(); + getList() } // 鑳借�楀姣斿垎鏋�-绉戝鑳借�楀垎鏋�-閲嶇疆 function resetQuery() { - proxy.resetForm("queryRef"); - handleTimeType(period.value[0].value); - queryParams.value.energyType = energyTypeList.value[0].enersno; - queryParams.value.enername = energyTypeList.value[0].enername; - queryParams.value.muid = energyTypeList.value[0].muid; - queryParams.value.analysisType = "YOY"; - handleQuery(); + proxy.resetForm("queryRef") + handleTimeType(period.value[0].value) + queryParams.value.energyType = energyTypeList.value[0].enersno + queryParams.value.enername = energyTypeList.value[0].enername + queryParams.value.muid = energyTypeList.value[0].muid + queryParams.value.analysisType = "YOY" + handleQuery() } // 鑳借�楀姣斿垎鏋�-绉戝鑳借�楀垎鏋�-瀵煎嚭 function handleExport() { @@ -587,9 +565,16 @@ ...query.value, }, `${queryParams.value.nodeName}-鍘傚尯鑳借�楀垎鏋恄${new Date().getTime()}.xlsx` - ); + ) } </script> <style scoped lang="scss"> @import "@/assets/styles/page.scss"; +.el-tabs { + padding: 0 12px; + margin-top: 12px; + :deep(.el-tabs__header) { + margin: 0; + } +} </style> diff --git a/zhitan-vue/src/views/energyanalysis/equipment/equipment.vue b/zhitan-vue/src/views/energyanalysis/equipment/equipment.vue index a829067..c0c200e 100644 --- a/zhitan-vue/src/views/energyanalysis/equipment/equipment.vue +++ b/zhitan-vue/src/views/energyanalysis/equipment/equipment.vue @@ -8,97 +8,101 @@ <div class="form-card"> <el-form :model="queryParams" ref="queryRef" :inline="true"> <el-form-item label="鏈熼棿" prop="timeType"> - <el-select v-model="queryParams.timeType" placeholder="鏈熼棿" clearable style="width: 120px" - @change="handleTimeType"> + <el-select + v-model="queryParams.timeType" + placeholder="鏈熼棿" + clearable + style="width: 120px" + @change="handleTimeType" + > <el-option v-for="dict in period" :key="dict.value" :label="dict.label" :value="dict.value" /> </el-select> </el-form-item> <el-form-item label="鏃堕棿"> - <el-date-picker v-model="queryParams.dataTime" :type="queryParams.timeType == 'YEAR' - ? 'year' - : queryParams.timeType == 'MONTH' - ? 'month' - : 'date' - " :format="queryParams.timeType == 'YEAR' - ? 'YYYY' - : queryParams.timeType == 'MONTH' - ? 'YYYY-MM' - : 'YYYY-MM-DD' - " value-format="YYYY-MM-DD" placeholder="鏃堕棿" style="width: 100%" /> + <el-date-picker + v-model="queryParams.dataTime" + :type="queryParams.timeType == 'YEAR' ? 'year' : queryParams.timeType == 'MONTH' ? 'month' : 'date'" + :format=" + queryParams.timeType == 'YEAR' ? 'YYYY' : queryParams.timeType == 'MONTH' ? 'YYYY-MM' : 'YYYY-MM-DD' + " + value-format="YYYY-MM-DD" + placeholder="鏃堕棿" + style="width: 100%" + /> </el-form-item> <el-form-item label="鑳芥簮绫诲瀷" prop="timeType"> <el-select v-model="queryParams.energyType" placeholder="鑳芥簮绫诲瀷" clearable style="width: 120px"> - <el-option :label="item.enername" :value="item.enersno" v-for="item in energyTypeList" - :key="item.enersno" @click="handleEnergyType(item)" /> + <el-option + :label="item.enername" + :value="item.enersno" + v-for="item in energyTypeList" + :key="item.enersno" + @click="handleEnergyType(item)" + /> </el-select> </el-form-item> <el-form-item> - <el-button type="primary" icon="Search" @click="handleQuery"> - 鎼滅储 - </el-button> - <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> + <el-button type="primary" icon="Search" @click="handleQuery"> 鎼滅储 </el-button> + <!-- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> --> </el-form-item> <el-form-item> - <el-button :type="queryParams.analysisType == 'YOY' ? 'primary' : ''" @click="handleAnalysisType('YOY')"> - 鍚屾瘮 - </el-button> - <el-button :type="queryParams.analysisType == 'MOM' ? 'primary' : ''" @click="handleAnalysisType('MOM')"> - 鐜瘮 - </el-button> - </el-form-item> - <el-form-item> - <el-button type="primary" icon="Download" @click="handleExport"> - 瀵煎嚭 - </el-button> + <el-button type="warning" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button> </el-form-item> </el-form> </div> - <div style=" - height: calc(100vh - 220px) !important; - max-height: calc(100vh - 220px) !important; - overflow-y: auto; - " v-loading="loading"> - <!-- <el-row :gutter="24"> - <el-col :span="16"> --> + <div + style="height: calc(100vh - 220px) !important; max-height: calc(100vh - 220px) !important; overflow-y: auto" + v-loading="loading" + > + <el-tabs v-model="queryParams.analysisType" type="card" @tab-change="handleAnalysisType"> + <el-tab-pane label="鍚屾瘮" name="YOY"> </el-tab-pane> + <el-tab-pane label="鐜瘮" name="MOM"> </el-tab-pane> + </el-tabs> <BaseCard :title="queryParams.nodeName + '-璁惧鑳借�楄秼鍔�'"> - <div class="chart-box"> + <div class="chart-box" style="padding: 12px 0 0"> <div id="Chart1" /> </div> </BaseCard> - <!-- </el-col> - <el-col :span="8"> - <BaseCard title="璁惧鑳借�楄秼鍔�"> - <div class="chart-box"> - <div id="Chart2" /> - </div> - </BaseCard> - </el-col> - <el-col :span="24"> --> - <BaseCard :title="queryParams.nodeName + - '-璁惧鑳借�楃粺璁″垎鏋愯〃-' + - queryParams.enername - "> + <BaseCard :title="queryParams.nodeName + '-璁惧鑳借�楃粺璁″垎鏋愯〃-' + queryParams.enername"> <div class="table-box"> <el-table :data="departmentList" show-summary> - <el-table-column label="鏈湡鏃堕棿" align="center" key="currentTime" prop="currentTime" - :show-overflow-tooltip="true" /> - <el-table-column :label="'鏈湡鑰�' + - queryParams.enername + - '(' + - queryParams.muid + - ')' - " align="center" key="currentValue" prop="currentValue" :show-overflow-tooltip="true" /> - <el-table-column label="鍚屾湡鏃堕棿" align="center" key="compareTime" prop="compareTime" - :show-overflow-tooltip="true" /> - <el-table-column :label="'鍚屾湡鑰�' + - queryParams.enername + - '(' + - queryParams.muid + - ')' - " align="center" key="compareValue" prop="compareValue" :show-overflow-tooltip="true" /> - <el-table-column :label="(queryParams.analysisType == 'YOY' ? '鍚�' : '鐜�') + '姣�(%)' - " align="center" key="ratio" prop="ratio" :show-overflow-tooltip="true" width="200" /> + <el-table-column + label="鏈湡鏃堕棿" + align="center" + key="currentTime" + prop="currentTime" + :show-overflow-tooltip="true" + /> + <el-table-column + :label="'鏈湡鑰�' + queryParams.enername + '(' + queryParams.muid + ')'" + align="center" + key="currentValue" + prop="currentValue" + :show-overflow-tooltip="true" + /> + <el-table-column + label="鍚屾湡鏃堕棿" + align="center" + key="compareTime" + prop="compareTime" + :show-overflow-tooltip="true" + /> + <el-table-column + :label="'鍚屾湡鑰�' + queryParams.enername + '(' + queryParams.muid + ')'" + align="center" + key="compareValue" + prop="compareValue" + :show-overflow-tooltip="true" + /> + <el-table-column + :label="(queryParams.analysisType == 'YOY' ? '鍚�' : '鐜�') + '姣�(%)'" + align="center" + key="ratio" + prop="ratio" + :show-overflow-tooltip="true" + width="200" + /> </el-table> </div> </BaseCard> @@ -111,26 +115,23 @@ </template> <script setup name="equipment"> -import { - listRegion, - listDepartment, -} from "@/api/energyAnalysis/energyAnalysis"; -import { listEnergyTypeList } from "@/api/modelConfiguration/energyType"; -import * as echarts from "echarts"; -const { proxy } = getCurrentInstance(); -const { period } = proxy.useDict("period"); -import { useRoute } from "vue-router"; -import useSettingsStore from "@/store/modules/settings"; -const settingsStore = useSettingsStore(); +import { listRegion, listDepartment } from "@/api/energyAnalysis/energyAnalysis" +import { listEnergyTypeList } from "@/api/modelConfiguration/energyType" +import * as echarts from "echarts" +const { proxy } = getCurrentInstance() +const { period } = proxy.useDict("period") +import { useRoute } from "vue-router" +import useSettingsStore from "@/store/modules/settings" +const settingsStore = useSettingsStore() watch( () => settingsStore.sideTheme, (val) => { - getList(); + getList() } -); -const energyTypeList = ref(undefined); -const departmentList = ref([]); -const loading = ref(false); +) +const energyTypeList = ref(undefined) +const departmentList = ref([]) +const loading = ref(false) const data = reactive({ queryParams: { nodeId: null, @@ -142,45 +143,45 @@ query: { modelCode: null, }, -}); -const { queryParams, query } = toRefs(data); +}) +const { queryParams, query } = toRefs(data) /** 鑺傜偣鍗曞嚮浜嬩欢 */ function handleNodeClick(data) { - queryParams.value.nodeId = data.id; - queryParams.value.nodeName = data.label; - handleTimeType(period.value[0].value); + queryParams.value.nodeId = data.id + queryParams.value.nodeName = data.label + handleTimeType(period.value[0].value || "DAY") listEnergyTypeList().then((res) => { - energyTypeList.value = res.data; - queryParams.value.energyType = energyTypeList.value[0].enersno; - queryParams.value.enername = energyTypeList.value[0].enername; - queryParams.value.muid = energyTypeList.value[0].muid; - handleQuery(); - }); + energyTypeList.value = res.data + queryParams.value.energyType = energyTypeList.value[0].enersno + queryParams.value.enername = energyTypeList.value[0].enername + queryParams.value.muid = energyTypeList.value[0].muid + handleQuery() + }) } function handleTimeType(e) { - queryParams.value.timeType = e; - queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD"); + queryParams.value.timeType = e + queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD") } function handleEnergyType(item) { - queryParams.value.enername = item.enername; - queryParams.value.muid = item.muid; - handleQuery(); + queryParams.value.enername = item.enername + queryParams.value.muid = item.muid + handleQuery() } function handleAnalysisType(analysisType) { - queryParams.value.analysisType = analysisType; - getList(); + queryParams.value.analysisType = analysisType + getList() } // 鑳借�楀姣斿垎鏋�-璁惧鑳借�楀垎鏋�-鍒楄〃 function getList() { - loading.value = true; + loading.value = true // 鍦ㄥ垵濮嬪寲涔嬪墠锛屽厛dispose鏃х殑瀹炰緥 if (echarts.getInstanceByDom(document.getElementById("Chart1"))) { - echarts.dispose(document.getElementById("Chart1")); + echarts.dispose(document.getElementById("Chart1")) } // if (echarts.getInstanceByDom(document.getElementById("Chart2"))) { // echarts.dispose(document.getElementById("Chart2")); // } - const myChart1 = echarts.init(document.getElementById("Chart1")); + const myChart1 = echarts.init(document.getElementById("Chart1")) // const myChart2 = echarts.init(document.getElementById("Chart2")); listRegion( proxy.addDateRange({ @@ -189,35 +190,31 @@ }) ).then((res) => { if (!!res.code && res.code == 200) { - loading.value = false; - let xdata = []; - let yvalue = []; - let ycompareValue = []; - let yqoq = []; + loading.value = false + let xdata = [] + let yvalue = [] + let ycompareValue = [] + let yqoq = [] if (!!res.data.chartDataList) { res.data.chartDataList.map((item) => { xdata.push( proxy .dayjs(item.xdata) .format( - queryParams.value.timeType == "YEAR" - ? "MM鏈�" - : queryParams.value.timeType == "MONTH" - ? "DD鏃�" - : "HH鏃�" + queryParams.value.timeType == "YEAR" ? "MM鏈�" : queryParams.value.timeType == "MONTH" ? "DD鏃�" : "HH鏃�" ) - ); - yvalue.push(!!item.yvalue ? item.yvalue : 0); - ycompareValue.push(!!item.ycompareValue ? item.ycompareValue : 0); - yqoq.push(!!item.yqoq ? item.yqoq : 0); - }); + ) + yvalue.push(!!item.yvalue ? item.yvalue : 0) + ycompareValue.push(!!item.ycompareValue ? item.ycompareValue : 0) + yqoq.push(!!item.yqoq ? item.yqoq : 0) + }) } setTimeout(() => { myChart1.setOption({ color: ["#2979ff", "#19be6b", "#ff9900", "#fa3534"], grid: { - top: "45", - left: "7%", + top: "60", + left: "5%", right: "5%", bottom: "10", containLabel: true, @@ -233,8 +230,7 @@ itemWidth: 14, itemHeight: 10, textStyle: { - color: - settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", }, }, xAxis: { @@ -245,10 +241,7 @@ axisLine: { show: true, lineStyle: { - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", }, }, axisTick: { @@ -261,8 +254,7 @@ show: false, }, axisLabel: { - color: - settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", fontSize: 14, padding: [5, 0, 0, 0], // formatter: '{value} ml' @@ -272,17 +264,9 @@ yAxis: [ { type: "value", - name: - "鑰�" + - queryParams.value.enername + - "閲�(" + - queryParams.value.muid + - ")", + name: "鑰�" + queryParams.value.enername + "閲�(" + queryParams.value.muid + ")", nameTextStyle: { - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", fontSize: 14, padding: [0, 0, 5, 0], }, @@ -293,10 +277,7 @@ show: true, lineStyle: { type: "dashed", - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", }, }, axisTick: { @@ -306,23 +287,16 @@ show: false, }, axisLabel: { - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", fontSize: 14, }, }, { type: "value", - name: - queryParams.value.analysisType == "YOY" ? "鍚屾瘮(%)" : "鐜瘮(%)", + name: queryParams.value.analysisType == "YOY" ? "鍚屾瘮(%)" : "鐜瘮(%)", alignTicks: true, nameTextStyle: { - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", fontSize: 14, padding: [0, 0, 5, 0], }, @@ -336,20 +310,14 @@ show: true, lineStyle: { type: "dashed", - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", }, }, splitArea: { show: false, }, axisLabel: { - color: - settingsStore.sideTheme == "theme-dark" - ? "#FFFFFF" - : "#222222", + color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", fontSize: 14, }, }, @@ -361,7 +329,7 @@ barWidth: "8", tooltip: { valueFormatter: function (value) { - return value + queryParams.value.muid; + return value + queryParams.value.muid }, }, itemStyle: { @@ -381,7 +349,7 @@ barWidth: "8", tooltip: { valueFormatter: function (value) { - return value + queryParams.value.muid; + return value + queryParams.value.muid }, }, itemStyle: { @@ -402,24 +370,24 @@ symbol: "none", // 璁剧疆涓� 'none' 鍘绘帀鍦嗙偣 tooltip: { valueFormatter: function (value) { - return value + "%"; + return value + "%" }, }, data: yqoq, }, ], - }); - }, 100); - departmentList.value = !!res.data.dataList ? res.data.dataList : []; + }) + }, 100) + departmentList.value = !!res.data.dataList ? res.data.dataList : [] window.addEventListener( "resize", () => { - myChart1.resize(); + myChart1.resize() }, { passive: true } - ); + ) } - }); + }) // listDepartment( // proxy.addDateRange({ // ...queryParams.value, @@ -568,17 +536,17 @@ } // 鑳借�楀姣斿垎鏋�-璁惧鑳借�楀垎鏋�-鎼滅储 function handleQuery() { - getList(); + getList() } // 鑳借�楀姣斿垎鏋�-璁惧鑳借�楀垎鏋�-閲嶇疆 function resetQuery() { - proxy.resetForm("queryRef"); - handleTimeType(period.value[0].value); - queryParams.value.energyType = energyTypeList.value[0].enersno; - queryParams.value.enername = energyTypeList.value[0].enername; - queryParams.value.muid = energyTypeList.value[0].muid; - queryParams.value.analysisType = "YOY"; - handleQuery(); + proxy.resetForm("queryRef") + handleTimeType(period.value[0].value) + queryParams.value.energyType = energyTypeList.value[0].enersno + queryParams.value.enername = energyTypeList.value[0].enername + queryParams.value.muid = energyTypeList.value[0].muid + queryParams.value.analysisType = "YOY" + handleQuery() } // 鑳借�楀姣斿垎鏋�-璁惧鑳借�楀垎鏋�-瀵煎嚭 function handleExport() { @@ -589,9 +557,17 @@ ...query.value, }, `${queryParams.value.nodeName}-璁惧鑳借�楃粺璁″垎鏋愯〃-${queryParams.enername}_${new Date().getTime()}.xlsx` - ); + ) } </script> <style scoped lang="scss"> @import "@/assets/styles/page.scss"; + +.el-tabs { + padding: 0 12px; + margin-top: 12px; + :deep(.el-tabs__header) { + margin: 0; + } +} </style> diff --git a/zhitan-vue/src/views/energyconservation/policyrule/policyRule.vue b/zhitan-vue/src/views/energyconservation/policyrule/policyRule.vue index 558747a..7a4ea0c 100644 --- a/zhitan-vue/src/views/energyconservation/policyrule/policyRule.vue +++ b/zhitan-vue/src/views/energyconservation/policyrule/policyRule.vue @@ -14,13 +14,12 @@ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button> <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> </el-form-item> + <el-form-item style="float: right"> + <el-button type="primary" icon="Plus" @click="handleAdd"> 鏂板 </el-button> + </el-form-item> </el-form> </div> <div class="table-box"> - <div class="mt20 mb20"> - <el-button type="primary" icon="plus" @click="handleAdd">鏂板</el-button> - <!-- <el-button type="primary" icon="Delete">鍒犻櫎</el-button> --> - </div> <el-table :data="tableData" v-loading="loading"> <el-table-column prop="title" label="鏂囦欢鏍囬" show-overflow-tooltip align="center" /> <el-table-column prop="typeName" label="鏂囦欢绫诲埆" show-overflow-tooltip align="center" /> diff --git a/zhitan-vue/src/views/energyconservation/projectmanage/projectmanage/projectManage.vue b/zhitan-vue/src/views/energyconservation/projectmanage/projectmanage/projectManage.vue index 0e76221..df6c9a2 100644 --- a/zhitan-vue/src/views/energyconservation/projectmanage/projectmanage/projectManage.vue +++ b/zhitan-vue/src/views/energyconservation/projectmanage/projectmanage/projectManage.vue @@ -22,13 +22,12 @@ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button> <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> </el-form-item> + <el-form-item style="float: right"> + <el-button type="primary" icon="plus" @click="handleAdd">鏂板</el-button> + </el-form-item> </el-form> </div> <div class="table-box"> - <div class="mt20 mb20"> - <el-button type="primary" icon="plus" @click="handleAdd">鏂板</el-button> - <!-- <el-button type="primary" icon="Download" @click="handleAdd"> 瀵煎嚭 </el-button> --> - </div> <el-table :data="tableData" v-loading="loading"> <el-table-column prop="plan" label="鎬讳綋璁″垝" show-overflow-tooltip align="center" /> <el-table-column prop="implementationPlan" label="瀹炴柦璁″垝" show-overflow-tooltip align="center" /> diff --git a/zhitan-vue/src/views/measuringinstruments/distributionroom/distributionroom.vue b/zhitan-vue/src/views/measuringinstruments/distributionroom/distributionroom.vue index f5f8e00..a5596cf 100644 --- a/zhitan-vue/src/views/measuringinstruments/distributionroom/distributionroom.vue +++ b/zhitan-vue/src/views/measuringinstruments/distributionroom/distributionroom.vue @@ -12,12 +12,12 @@ <el-button type="primary" icon="Search" @click="handleQuery"> 鎼滅储 </el-button> <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> </el-form-item> + <el-form-item style="float: right"> + <el-button type="primary" icon="plus" @click="handleAdd">鏂板</el-button> + </el-form-item> </el-form> </div> <div class="table-bg-style"> - <div class="ml20 mb20 theme-dark-mt20"> - <el-button type="primary" icon="Plus" @click="handleAdd">鏂板</el-button> - </div> <div class="table-box"> <el-table v-loading="loading" :data="energyTypeList"> <el-table-column label="缂栧彿" align="center" key="code" prop="code" :show-overflow-tooltip="true" /> diff --git a/zhitan-vue/src/views/measuringinstruments/maintain/maintain.vue b/zhitan-vue/src/views/measuringinstruments/maintain/maintain.vue index c99bef1..7e7f9ec 100644 --- a/zhitan-vue/src/views/measuringinstruments/maintain/maintain.vue +++ b/zhitan-vue/src/views/measuringinstruments/maintain/maintain.vue @@ -17,12 +17,12 @@ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button> <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> </el-form-item> + <el-form-item style="float: right"> + <el-button type="primary" icon="plus" @click="handleAdd">鏂板</el-button> + </el-form-item> </el-form> </div> <div class="table-bg-style"> - <div class="ml20 mb20 theme-dark-mt20"> - <el-button type="primary" icon="Plus" @click="handleAdd">鏂板</el-button> - </div> <div class="table-box"> <el-table :data="tableData" v-loading="loading"> <el-table-column prop="code" label="缂栫爜" show-overflow-tooltip align="center" /> diff --git a/zhitan-vue/src/views/modelconfiguration/businessmodel/businessModel.vue b/zhitan-vue/src/views/modelconfiguration/businessmodel/businessModel.vue index 9ae49db..9598c1d 100644 --- a/zhitan-vue/src/views/modelconfiguration/businessmodel/businessModel.vue +++ b/zhitan-vue/src/views/modelconfiguration/businessmodel/businessModel.vue @@ -1,158 +1,171 @@ <template> - <div class="page"> - <div class="page-container"> - <div class="page-container-left"> - <div class="tree page-box"> - <!-- <CardHeader class="mb20">鏁版嵁妯″瀷绠$悊</CardHeader> --> - <div class="select-box mb20"> - <el-select v-model="modelData" placeholder="璇烽�夋嫨妯″瀷" filterable @change="changeModel"> - <el-option v-for="model in modelInfoOptions" :key="model.modelCode" :label="model.modelName" - :value="model.modelCode" /> - </el-select> - <el-icon @click="handleModel"> - <Setting /> - </el-icon> - </div> - <!-- <el-input v-model="filterText" style="width: 240px" placeholder="杈撳叆鍏抽敭瀛楄繘琛岃繃婊�" class="mb10" /> --> - <div class="tree-box" v-loading="treeLoading"> - <el-link icon="el-icon-plus" style="margin-top: 8px;width:100%" @click="addNode" - v-if="treeData.length === 0">娣诲姞鏍硅妭鐐� - </el-link> - <template v-else> - <el-tree ref="treeRef" :props="defaultProps" :data="treeData" node-key="id" - highlight-current :filter-node-method="filterNode" - :default-expanded-keys="treeExpandData" :expand-on-click-node="false" - @node-click="changeNode" accordion> - <template #default="{ node, data }"> - <span> - <el-tooltip v-if="node.label.length > 6" class="item" effect="dark" - :content="node.label" placement="top-end"> - <span>{{ node.label.slice(0, 6) + "..." }}</span> - </el-tooltip> - <span v-else id="b">{{ node.label }}</span> - </span> - <span class="node-opt"> - <el-link title="鏂板涓嬬骇鑺傜偣" icon="Plus" @click="() => addNode(node, data)"> - </el-link> - <el-link title="淇敼鑺傜偣" icon="EditPen" @click="() => editNode(node, data)"> - </el-link> - <el-link title="鍒犻櫎鑺傜偣" icon="Delete" @click="() => delNode(node, data)"> - </el-link> - </span> - </template> - </el-tree> - </template> - </div> - </div> - </div> - <div class="page-container-right"> - <div class="mb20 mt20 ml20 tab-box"> - <div class="tab-li" :class="tab == 1 ? 'is-tab' : ''" @click="handleTab('1')"> - 璁¢噺鍣ㄥ叿閰嶇疆淇℃伅 - </div> - <div class="tab-li" :class="tab == 2 ? 'is-tab' : ''" @click="handleTab('2')"> - 缁熻鎸囨爣 - </div> - <div class="tab-li" :class="tab == 3 ? 'is-tab' : ''" @click="handleTab('3')"> - 閲囬泦鎸囨爣 - </div> - <!-- <el-radio-group v-model="tab"> + <div class="page"> + <div class="page-container"> + <div class="page-container-left"> + <div class="tree page-box"> + <!-- <CardHeader class="mb20">鏁版嵁妯″瀷绠$悊</CardHeader> --> + <div class="select-box mb20"> + <el-select v-model="modelData" placeholder="璇烽�夋嫨妯″瀷" filterable @change="changeModel"> + <el-option + v-for="model in modelInfoOptions" + :key="model.modelCode" + :label="model.modelName" + :value="model.modelCode" + /> + </el-select> + <el-icon @click="handleModel"> + <Setting /> + </el-icon> + </div> + <!-- <el-input v-model="filterText" style="width: 240px" placeholder="杈撳叆鍏抽敭瀛楄繘琛岃繃婊�" class="mb10" /> --> + <div class="tree-box" v-loading="treeLoading"> + <el-link + icon="el-icon-plus" + style="margin-top: 8px; width: 100%" + @click="addNode" + v-if="treeData.length === 0" + >娣诲姞鏍硅妭鐐� + </el-link> + <template v-else> + <el-tree + ref="treeRef" + :props="defaultProps" + :data="treeData" + node-key="id" + highlight-current + :filter-node-method="filterNode" + :default-expanded-keys="treeExpandData" + :expand-on-click-node="false" + @node-click="changeNode" + accordion + > + <template #default="{ node, data }"> + <span> + <el-tooltip + v-if="node.label.length > 6" + class="item" + effect="dark" + :content="node.label" + placement="top-end" + > + <span>{{ node.label.slice(0, 6) + "..." }}</span> + </el-tooltip> + <span v-else id="b">{{ node.label }}</span> + </span> + <span class="node-opt"> + <el-link title="鏂板涓嬬骇鑺傜偣" icon="Plus" @click="() => addNode(node, data)"> </el-link> + <el-link title="淇敼鑺傜偣" icon="EditPen" @click="() => editNode(node, data)"> </el-link> + <el-link title="鍒犻櫎鑺傜偣" icon="Delete" @click="() => delNode(node, data)"> </el-link> + </span> + </template> + </el-tree> + </template> + </div> + </div> + </div> + <div class="page-container-right"> + <div class="tab-box"> + <div class="tab-li" :class="tab == 1 ? 'is-tab' : ''" @click="handleTab('1')">璁¢噺鍣ㄥ叿閰嶇疆淇℃伅</div> + <div class="tab-li" :class="tab == 2 ? 'is-tab' : ''" @click="handleTab('2')">缁熻鎸囨爣</div> + <div class="tab-li" :class="tab == 3 ? 'is-tab' : ''" @click="handleTab('3')">閲囬泦鎸囨爣</div> + <!-- <el-radio-group v-model="tab"> <el-radio-button label="1" @click="handleTab('1')"> 璁惧閰嶇疆</el-radio-button> <el-radio-button label="2" @click="handleTab('2')"> 閲囬泦鎸囨爣</el-radio-button> </el-radio-group>--> - </div> - <BaseCard :title="currentNode ? currentNode.label + '--鑺傜偣閰嶇疆' : '鏆傛棤鑺傜偣閰嶇疆'"> - <div> - <div class="content-box" v-if="tab == '1'"> - <deviceConfig ref='deviceConfigRef' /> - </div> - <div class="content-box" v-if="tab == '2'"> - <statisticalIndicators ref='statisticalIndicatorsRef' /> - </div> - <div class="content-box" v-if="tab == '3'"> - <collectIndicators ref='collectIndicatorsRef' /> - </div> - </div> - </BaseCard> - </div> </div> - - <treeNodeModal ref="treeNodeModalRef" @getList="getTreeList" :modelCode="modelData" - @addTreeList="addTreeList" @addTreeSelectList="addTreeSelectList" /> - <modelManagementModal ref="modelManagementModalRef" @selectTreeFun="searchList" /> - + <BaseCard :title="currentNode ? currentNode.label + '--鑺傜偣閰嶇疆' : '鏆傛棤鑺傜偣閰嶇疆'"> + <div> + <div class="content-box" v-if="tab == '1'"> + <deviceConfig ref="deviceConfigRef" /> + </div> + <div class="content-box" v-if="tab == '2'"> + <statisticalIndicators ref="statisticalIndicatorsRef" /> + </div> + <div class="content-box" v-if="tab == '3'"> + <collectIndicators ref="collectIndicatorsRef" /> + </div> + </div> + </BaseCard> + </div> </div> + + <treeNodeModal + ref="treeNodeModalRef" + @getList="getTreeList" + :modelCode="modelData" + @addTreeList="addTreeList" + @addTreeSelectList="addTreeSelectList" + /> + <modelManagementModal ref="modelManagementModalRef" @selectTreeFun="searchList" /> + </div> </template> <script setup> -import treeNodeModal from './components/TreeNodeModal.vue' -import modelManagementModal from './components/modelManagement/modelManagement' -import { listModel } from '@/api/modelConfiguration/businessModel' -import { treeList, delModelNode, hasEnergyIndex, } from '@/api/modelConfiguration/indexWarehouse' -import deviceConfig from './components/deviceConfig/DeviceConfig.vue' -import collectIndicators from './components/collectIndicators/CollectIndicators.vue' -import statisticalIndicators from './components/statisticalIndicators/statisticalIndicators.vue' -import { nextTick } from 'vue'; +import treeNodeModal from "./components/TreeNodeModal.vue" +import modelManagementModal from "./components/modelManagement/modelManagement" +import { listModel } from "@/api/modelConfiguration/businessModel" +import { treeList, delModelNode, hasEnergyIndex } from "@/api/modelConfiguration/indexWarehouse" +import deviceConfig from "./components/deviceConfig/DeviceConfig.vue" +import collectIndicators from "./components/collectIndicators/CollectIndicators.vue" +import statisticalIndicators from "./components/statisticalIndicators/statisticalIndicators.vue" +import { nextTick } from "vue" let { proxy } = getCurrentInstance() let modelManagementModalRef = ref(null) let treeLoading = ref(true) //妯″瀷绠$悊 function handleModel() { - if (modelManagementModalRef.value) { - modelManagementModalRef.value.handleOpen() - } + if (modelManagementModalRef.value) { + modelManagementModalRef.value.handleOpen() + } } let modelData = ref(null) let modelInfoOptions = ref([]) //涓嬫媺鍒楄〃 //鑾峰彇涓嬫媺鍒楄〃 function searchList(flag) { - listModel({ isShow: 1 }).then(response => { - modelInfoOptions.value = response.data; - if (flag) { - if (modelInfoOptions.value.length > 0) { - modelData.value = modelInfoOptions.value[0].modelCode; - getTreeList(modelData.value) - } - } - }); + listModel({ isShow: 1 }).then((response) => { + modelInfoOptions.value = response.data + if (flag) { + if (modelInfoOptions.value.length > 0) { + modelData.value = modelInfoOptions.value[0].modelCode + getTreeList(modelData.value) + } + } + }) } searchList(true) - //涓嬫媺閫変腑瑙﹀彂鏍戝垪琛� function changeModel(item) { - // console.log('changeModel', item) - getTreeList(item) + // console.log('changeModel', item) + getTreeList(item) } let treeRef = ref(null) let treeData = ref([]) const defaultProps = ref({ - children: 'children', - label: 'label', + children: "children", + label: "label", }) //妫�绱㈡爲 -let filterText = ref('') +let filterText = ref("") const filterNode = (value, data) => { - if (!value) return true - return data.label.includes(value) + if (!value) return true + return data.label.includes(value) } watch(filterText, (val) => { - // 妫�鏌reeRef.value鏄惁鏄竴涓湁鏁堢殑ElTree瀹炰緥 - if (treeRef.value && typeof treeRef.value.filter === 'function') { - // 璋冪敤filter鏂规硶 - treeRef.value.filter(val); - } else { - // treeRef.value鏃犳晥锛屽鐞嗛敊璇� - console.error('error'); - } -}); - - + // 妫�鏌reeRef.value鏄惁鏄竴涓湁鏁堢殑ElTree瀹炰緥 + if (treeRef.value && typeof treeRef.value.filter === "function") { + // 璋冪敤filter鏂规硶 + treeRef.value.filter(val) + } else { + // treeRef.value鏃犳晥锛屽鐞嗛敊璇� + console.error("error") + } +}) let currentNode = ref(null) let treeExpandData = ref([]) @@ -163,156 +176,153 @@ //鑾峰彇鏍戝垪琛� function getTreeList(modelCode) { - treeLoading.value = true - treeList({ modelCode }).then(res => { - treeLoading.value = false - let { data } = res - treeData.value = data; - let chooseNode = null; - if (data.length > 0) { - if (data[0].children && data[0].children.length !== 0 && isFirstLeafNode.value) { - if (data[0].children[0].children && data[0].children[0].children.length !== 0) { - chooseNode = data[0].children[0].children[0]; - } else { - chooseNode = data[0].children[0]; - } - } else { - chooseNode = data[0]; - } - currentNode.value = chooseNode; - treeExpandData.value.push(chooseNode.id); - nextTick(() => { - treeRef.value.setCurrentKey(chooseNode.id); - if (tab.value == 1 && deviceConfigRef.value) { - deviceConfigRef.value.getList(chooseNode) - } - if (tab.value == 2 && statisticalIndicatorsRef.value) { - statisticalIndicatorsRef.value.getList(chooseNode) - } - if (tab.value == 3 && collectIndicatorsRef.value) { - collectIndicatorsRef.value.getList(chooseNode) - } - }); + treeLoading.value = true + treeList({ modelCode }).then((res) => { + treeLoading.value = false + let { data } = res + treeData.value = data + let chooseNode = null + if (data.length > 0) { + if (data[0].children && data[0].children.length !== 0 && isFirstLeafNode.value) { + if (data[0].children[0].children && data[0].children[0].children.length !== 0) { + chooseNode = data[0].children[0].children[0] + } else { + chooseNode = data[0].children[0] } - }) + } else { + chooseNode = data[0] + } + currentNode.value = chooseNode + treeExpandData.value.push(chooseNode.id) + nextTick(() => { + treeRef.value.setCurrentKey(chooseNode.id) + if (tab.value == 1 && deviceConfigRef.value) { + deviceConfigRef.value.getList(chooseNode) + } + if (tab.value == 2 && statisticalIndicatorsRef.value) { + statisticalIndicatorsRef.value.getList(chooseNode) + } + if (tab.value == 3 && collectIndicatorsRef.value) { + collectIndicatorsRef.value.getList(chooseNode) + } + }) + } + }) } //鏂板鍚庢洿鏂版爲鍒楄〃 function addTreeList(newChild) { - treeData.value.push(newChild) + treeData.value.push(newChild) } //鏂板鎴愬姛鍚庢洿鏂伴粯璁ら�変腑,骞惰Е鍙戞柟娉� function addTreeSelectList(addedNode, newChild) { - treeExpandData.value.push(addedNode.nodeId) - nextTick(() => { - treeRef.value.setCurrentNode(newChild) - currentNode.value = newChild; - if (tab.value == 1) { - if (deviceConfigRef.value) { - deviceConfigRef.value.getList(newChild) - } - } - if (tab.value == 2) { - if (statisticalIndicatorsRef.value) { - statisticalIndicatorsRef.value.getList(newChild) - } - } - if (tab.value == 3) { - - if (collectIndicatorsRef.value) { - collectIndicatorsRef.value.getList(newChild) - } - } - }) - + treeExpandData.value.push(addedNode.nodeId) + nextTick(() => { + treeRef.value.setCurrentNode(newChild) + currentNode.value = newChild + if (tab.value == 1) { + if (deviceConfigRef.value) { + deviceConfigRef.value.getList(newChild) + } + } + if (tab.value == 2) { + if (statisticalIndicatorsRef.value) { + statisticalIndicatorsRef.value.getList(newChild) + } + } + if (tab.value == 3) { + if (collectIndicatorsRef.value) { + collectIndicatorsRef.value.getList(newChild) + } + } + }) } //鏍戠偣鍑� function changeNode(data, node, ev) { - console.log('鏍戠偣鍑�', data) - currentNode.value = data; - if (tab.value == 1) { - if (deviceConfigRef.value) { - deviceConfigRef.value.getList(data) - } + console.log("鏍戠偣鍑�", data) + currentNode.value = data + if (tab.value == 1) { + if (deviceConfigRef.value) { + deviceConfigRef.value.getList(data) } - if (tab.value == 2) { - if (statisticalIndicatorsRef.value) { - statisticalIndicatorsRef.value.getList(data) - } + } + if (tab.value == 2) { + if (statisticalIndicatorsRef.value) { + statisticalIndicatorsRef.value.getList(data) } - if (tab.value == 3) { - if (collectIndicatorsRef.value) { - collectIndicatorsRef.value.getList(data) - } + } + if (tab.value == 3) { + if (collectIndicatorsRef.value) { + collectIndicatorsRef.value.getList(data) } + } } let treeNodeModalRef = ref(null) function addNode(node, data) { - if (treeNodeModalRef.value) { - console.log('treeNodeModalRef', node, data) - treeNodeModalRef.value.handleOpen(node, data, true) - } + if (treeNodeModalRef.value) { + console.log("treeNodeModalRef", node, data) + treeNodeModalRef.value.handleOpen(node, data, true) + } } function editNode(node, data) { - if (treeNodeModalRef.value) { - treeNodeModalRef.value.handleOpen(node, data, false) - } + if (treeNodeModalRef.value) { + treeNodeModalRef.value.handleOpen(node, data, false) + } } function delNode(node, data) { - if (data.children && data.children.length > 0) { - proxy.$modal.msgWarning('鍖呭惈瀛愯妭鐐癸紝涓嶈兘杩涜鍒犻櫎锛�') - return + if (data.children && data.children.length > 0) { + proxy.$modal.msgWarning("鍖呭惈瀛愯妭鐐癸紝涓嶈兘杩涜鍒犻櫎锛�") + return + } + + hasEnergyIndex(data.id).then((response) => { + if (response.data) { + proxy.$modal.msgWarning("褰撳墠鑺傜偣涓嬪瓨鍦ㄦ寚鏍囷紝涓嶈兘杩涜鍒犻櫎锛�") + } else { + proxy.$modal + .confirm('鏄惁纭鍒犻櫎鍚嶄负"' + data.label + '"鐨勮妭鐐�?', "璀﹀憡", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning", + }) + .then(function () { + return delModelNode(data.id) + }) + .then(() => { + let parent = node.parent + let children = parent.data.children || parent.data + let index = children.findIndex((d) => d.id === data.id) + children.splice(index, 1) + + nextTick(() => { + if (parent.data && parent.data.id) { + changeNode(parent.data) + } else { + changeNode(null) + } + }) + proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛") + }) + .catch(function () {}) } - - hasEnergyIndex(data.id).then(response => { - if (response.data) { - proxy.$modal.msgWarning('褰撳墠鑺傜偣涓嬪瓨鍦ㄦ寚鏍囷紝涓嶈兘杩涜鍒犻櫎锛�') - } else { - proxy.$modal.confirm('鏄惁纭鍒犻櫎鍚嶄负"' + data.label + '"鐨勮妭鐐�?', '璀﹀憡', { - confirmButtonText: '纭畾', - cancelButtonText: '鍙栨秷', - type: 'warning' - }) - .then(function () { - return delModelNode(data.id) - }) - .then(() => { - let parent = node.parent - let children = parent.data.children || parent.data - let index = children.findIndex(d => d.id === data.id) - children.splice(index, 1) - - nextTick(() => { - if (parent.data && parent.data.id) { - changeNode(parent.data) - } else { - changeNode(null) - } - }) - proxy.$modal.msgSuccess('鍒犻櫎鎴愬姛') - }) - .catch(function () { - }) - } - }) + }) } -let tab = ref('1') +let tab = ref("1") function handleTab(value) { - tab.value = value - nextTick(() => { - if (value == 1 && deviceConfigRef.value) { - deviceConfigRef.value.getList(currentNode.value) - } - if (value == 2 && statisticalIndicatorsRef.value) { - statisticalIndicatorsRef.value.getList(currentNode.value) - } - if (value == 3 && collectIndicatorsRef.value) { - collectIndicatorsRef.value.getList(currentNode.value) - } - }); - + tab.value = value + nextTick(() => { + if (value == 1 && deviceConfigRef.value) { + deviceConfigRef.value.getList(currentNode.value) + } + if (value == 2 && statisticalIndicatorsRef.value) { + statisticalIndicatorsRef.value.getList(currentNode.value) + } + if (value == 3 && collectIndicatorsRef.value) { + collectIndicatorsRef.value.getList(currentNode.value) + } + }) } </script> @@ -320,77 +330,88 @@ @import "@/assets/styles/page.scss"; .page-box { - height: calc(100vh - 145px); + height: calc(100vh - 145px); - .tree-box { - height: calc(100% - 70px); - overflow-y: auto !important; + .tree-box { + height: calc(100% - 70px); + overflow-y: auto !important; + } + + .select-box { + display: flex; + align-items: center; + + :deep .el-icon { + color: #fff; + margin: 0 10px 0 15px; + font-size: 20px; + // &:hover{ + // color: #3371EB; + // } } + } - .select-box { - display: flex; - align-items: center; + .node-opt { + flex: 1; + text-align: right; + margin-right: 5px; - :deep .el-icon { - color: #fff; - margin: 0 10px 0 15px; - font-size: 20px; - // &:hover{ - // color: #3371EB; - // } - } + :deep .el-icon { + color: #fff; + margin-right: 5px; } - - .node-opt { - flex: 1; - text-align: right; - margin-right: 5px; - - :deep .el-icon { - color: #fff; - margin-right: 5px; - } - } - - + } } :deep .el-tabs__nav-wrap:after { - background: transparent; + background: transparent; } :deep .el-tabs__item { - color: #fff; - font-size: 20px; - padding: 0 20px; + color: #fff; + font-size: 20px; + padding: 0 20px; - &.is-active, - &:hover { - color: #999 !important; - } + &.is-active, + &:hover { + color: #999 !important; + } } .tab-box { - display: flex; - align-items: center; + display: flex; + align-items: center; + color: #fff; + border-bottom: 1px solid #3371eb; + margin-right: 20px; + margin-left: 15px; + font-size: 15px; + + .tab-li { + cursor: pointer; + border: 1px solid #3371eb; + padding: 8px 20px; + border-radius: 5px 5px 0 0; + } + + .is-tab { + background: #3371eb; color: #fff; - border-bottom: 1px solid #3371EB; - margin-right: 20px; + } +} +.themeDark { + .tab-box { + color: #fff; + } +} - .tab-li { - cursor: pointer; - border: 1px solid #3371EB; - padding: 10px 25px; - border-radius: 5px 5px 0 0; - } - - .is-tab { - background: #3371EB; - } +.themeLight { + .tab-box { + color: #333; + } } .content-box { - height: calc(100vh - 306px) !important; - + height: calc(100vh - 306px) !important; } </style> diff --git a/zhitan-vue/src/views/modelconfiguration/calculationformula/calculationFormula.vue b/zhitan-vue/src/views/modelconfiguration/calculationformula/calculationFormula.vue index 4035a00..5488048 100644 --- a/zhitan-vue/src/views/modelconfiguration/calculationformula/calculationFormula.vue +++ b/zhitan-vue/src/views/modelconfiguration/calculationformula/calculationFormula.vue @@ -9,28 +9,33 @@ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button> <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> </el-form-item> + <!-- <el-form-item style="float: right"> + <el-button type="primary" icon="plus" @click="handleAdd">鏂板</el-button> + </el-form-item> --> </el-form> </div> - <div class="table-box"> - <el-table :data="tableData" style="width: 100%"> - <el-table-column prop="funcName" label="鍑芥暟鍚�" show-overflow-tooltip align="center"> </el-table-column> - <el-table-column prop="funcText" label="鍑芥暟鏂囨湰" show-overflow-tooltip align="center"> </el-table-column> - <el-table-column prop="info" label="浠嬬粛" show-overflow-tooltip align="center"> </el-table-column> - <!-- <el-table-column prop="prop" label="鎿嶄綔" width="150" align="center"> + <div class="table-bg-style"> + <div class="table-box"> + <el-table :data="tableData" style="width: 100%"> + <el-table-column prop="funcName" label="鍑芥暟鍚�" show-overflow-tooltip align="center"> </el-table-column> + <el-table-column prop="funcText" label="鍑芥暟鏂囨湰" show-overflow-tooltip align="center"> </el-table-column> + <el-table-column prop="info" label="浠嬬粛" show-overflow-tooltip align="center"> </el-table-column> + <!-- <el-table-column prop="prop" label="鎿嶄綔" width="150" align="center"> <template #default="scope"> <el-button link type="primary" icon="Delete" @click="handleDel(scope.row)"> 鍒犻櫎 </el-button> </template> </el-table-column> --> - </el-table> - <pagination - v-show="total > 0" - :total="total" - v-model:page="queryParams.pageNum" - v-model:limit="queryParams.pageSize" - @pagination="getList" - /> + </el-table> + <pagination + v-show="total > 0" + :total="total" + v-model:page="queryParams.pageNum" + v-model:limit="queryParams.pageSize" + @pagination="getList" + /> + </div> </div> </div> </template> diff --git a/zhitan-vue/src/views/modelconfiguration/collectindicator/collectIndicator.vue b/zhitan-vue/src/views/modelconfiguration/collectindicator/collectIndicator.vue index 7ba4ec1..38c0dc4 100644 --- a/zhitan-vue/src/views/modelconfiguration/collectindicator/collectIndicator.vue +++ b/zhitan-vue/src/views/modelconfiguration/collectindicator/collectIndicator.vue @@ -17,37 +17,44 @@ <el-button type="primary" @click="handleQuery">鎼滅储</el-button> <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> </el-form-item> + <el-form-item style="float: right"> + <el-button type="primary" icon="plus" @click="handleAdd">鏂板</el-button> + </el-form-item> </el-form> </div> - <div class="table-box"> - <div class=" mt20 mb20"> - <el-button type="primary" icon="Plus" @click="handleDialog('add')">鏂板</el-button> + <div class="table-bg-style"> + <div class="table-box"> + <el-table :data="tableData" style="width: 100%"> + <el-table-column prop="code" label="鍙傛暟缂栫爜" align="center" show-overflow-tooltip /> + <el-table-column prop="name" label="鍙傛暟鍚嶇О" align="center" show-overflow-tooltip /> + <el-table-column + prop="unit" + label="鍗曚綅" + align="center" + show-overflow-tooltip + :formatter="(row, column) => proxy.selectDictLabel(sys_unit, row.unit)" + /> + <el-table-column prop="deviceType" label="璁惧绫诲瀷" align="center" show-overflow-tooltip> + <template #default="scope"> + <dict-tag :options="sys_device_type" :value="scope.row.deviceType" /> + </template> + </el-table-column> + <el-table-column fixed="right" label="鎿嶄綔" width="180" align="center" show-overflow-tooltip> + <template #default="scope"> + <el-button link type="primary" icon="Edit" @click="handleEdit(scope.row.id)"> 淇敼 </el-button> + + <el-button link type="primary" icon="Delete" @click="handleDel(scope.row)"> 鍒犻櫎 </el-button> + </template> + </el-table-column> + </el-table> + <pagination + v-show="pageTotal > 0" + :total="pageTotal" + v-model:page="queryParams.pageNum" + v-model:limit="queryParams.pageSize" + @pagination="getList" + /> </div> - <el-table :data="tableData" style="width: 100%"> - <el-table-column prop="code" label="鍙傛暟缂栫爜" align="center" show-overflow-tooltip /> - <el-table-column prop="name" label="鍙傛暟鍚嶇О" align="center" show-overflow-tooltip /> - <el-table-column prop="unit" label="鍗曚綅" align="center" show-overflow-tooltip - :formatter="(row, column) => proxy.selectDictLabel(sys_unit, row.unit)" /> - <el-table-column prop="deviceType" label="璁惧绫诲瀷" align="center" show-overflow-tooltip> - <template #default="scope"> - <dict-tag :options="sys_device_type" :value="scope.row.deviceType" /> - </template> - </el-table-column> - <el-table-column fixed="right" label="鎿嶄綔" width="180" align="center" show-overflow-tooltip> - <template #default="scope"> - <el-button link type="primary" icon="Edit" @click="handleEdit(scope.row.id)"> - 淇敼 - </el-button> - - <el-button link type="primary" icon="Delete" @click="handleDel(scope.row)"> - 鍒犻櫎 - </el-button> - </template> - - </el-table-column> - </el-table> - <pagination v-show="pageTotal > 0" :total="pageTotal" v-model:page="queryParams.pageNum" - v-model:limit="queryParams.pageSize" @pagination="getList" /> </div> <el-dialog v-model="dialogVisible" :title="dialogTitle" width="500"> <el-form ref="formRef" :model="form" :rules="rules" label-width="auto"> @@ -71,9 +78,7 @@ <template #footer> <div class="dialog-footer"> <el-button @click="handleClose">鍙栨秷</el-button> - <el-button type="primary" @click="handleOk"> - 纭 - </el-button> + <el-button type="primary" @click="handleOk"> 纭 </el-button> </div> </template> </el-dialog> @@ -81,14 +86,18 @@ </template> <script setup name="collect"> -import { listTemplate, addTemplate, getTempById, putTemplate, delTempById } from '@/api/modelConfiguration/collectIndicator.js' -import { reactive, ref } from 'vue'; -import { Delete, Edit, Search, Share, Upload } from '@element-plus/icons-vue' -const { proxy } = getCurrentInstance(); -const { sys_device_type } = proxy.useDict("sys_device_type"); -const { sys_unit } = proxy.useDict("sys_unit"); - - +import { + listTemplate, + addTemplate, + getTempById, + putTemplate, + delTempById, +} from "@/api/modelConfiguration/collectIndicator.js" +import { reactive, ref } from "vue" +import { Delete, Edit, Search, Share, Upload } from "@element-plus/icons-vue" +const { proxy } = getCurrentInstance() +const { sys_device_type } = proxy.useDict("sys_device_type") +const { sys_unit } = proxy.useDict("sys_unit") let queryParams = ref({ pageNum: 1, @@ -96,16 +105,16 @@ }) let pageTotal = ref(0) let dialogVisible = ref(false) -let dialogTitle = ref('') +let dialogTitle = ref("") let queryForm = ref({}) let form = ref({}) let tableData = ref([]) const rules = { - code: [{ required: true, message: '璇疯緭鍏�', trigger: 'blur' },], - name: [{ required: true, message: '璇疯緭鍏�', trigger: 'blur' },], - unit: [{ required: true, message: '璇烽�夋嫨', trigger: 'change' },], - deviceType: [{ required: true, message: '璇烽�夋嫨', trigger: 'change' },], + code: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }], + name: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }], + unit: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }], + deviceType: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }], } function handleQuery() { @@ -113,14 +122,13 @@ getList() } - function resetQuery() { queryForm.value = {} queryParams.value.pageNum = 1 getList() } function handleEdit(id) { - getTempById({ id }).then(res => { + getTempById({ id }).then((res) => { if (res.code == 200) { handleDialog() form.value = JSON.parse(JSON.stringify(res.data)) @@ -129,62 +137,62 @@ } function handleDel(row) { - proxy.$modal.confirm('鏄惁纭鍒犻櫎鎸囨爣鍚嶄负"' + row.name + '"鐨勬暟鎹」?', '璀﹀憡', { - confirmButtonText: '纭畾', - cancelButtonText: '鍙栨秷', - type: 'warning' - }).then(() => { - return delTempById(row.id) - }).then(() => { - getList() - proxy.$modal.msgSuccess('鍒犻櫎鎴愬姛') - }).catch(function () { - }) - + proxy.$modal + .confirm('鏄惁纭鍒犻櫎鎸囨爣鍚嶄负"' + row.name + '"鐨勬暟鎹」?', "璀﹀憡", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning", + }) + .then(() => { + return delTempById(row.id) + }) + .then(() => { + getList() + proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛") + }) + .catch(function () {}) } function getList() { let params = { ...queryParams.value, - ...queryForm.value + ...queryForm.value, } - listTemplate(params).then(res => { - tableData.value = res.rows; + listTemplate(params).then((res) => { + tableData.value = res.rows pageTotal.value = res.total - }); + }) } function handleDialog(type) { - if (type == 'add') { - dialogTitle = '鏂板閲囬泦鍙傛暟妯$増' + if (type == "add") { + dialogTitle = "鏂板閲囬泦鍙傛暟妯$増" } else { - dialogTitle = '淇敼閲囬泦鍙傛暟妯$増' + dialogTitle = "淇敼閲囬泦鍙傛暟妯$増" } dialogVisible.value = true } function handleOk() { - proxy.$refs.formRef.validate(valid => { - console.log('valid===>', valid); + proxy.$refs.formRef.validate((valid) => { + console.log("valid===>", valid) if (valid) { if (form.value.id) { - putTemplate(form.value).then(res => { + putTemplate(form.value).then((res) => { proxy.$modal.msgSuccess(res.msg) dialogVisible.value = false getList() }) } else { - addTemplate(form.value).then(res => { - console.log('res===>鏂板', res); + addTemplate(form.value).then((res) => { + console.log("res===>鏂板", res) proxy.$modal.msgSuccess(res.msg) dialogVisible.value = false getList() }) } - } }) - } function handleClose() { @@ -194,7 +202,6 @@ } getList() - </script> <style lang="scss" scoped> diff --git a/zhitan-vue/src/views/modelconfiguration/energytype/energyType.vue b/zhitan-vue/src/views/modelconfiguration/energytype/energyType.vue index 8319cfa..a13c75f 100644 --- a/zhitan-vue/src/views/modelconfiguration/energytype/energyType.vue +++ b/zhitan-vue/src/views/modelconfiguration/energytype/energyType.vue @@ -1,25 +1,12 @@ <template> <div class="page"> <div class="form-card"> - <el-form - :model="queryParams" - ref="queryRef" - :inline="true" - label-width="80px" - > + <el-form :model="queryParams" ref="queryRef" :inline="true" label-width="80px"> <el-form-item label="鑳芥簮绫诲瀷"> - <el-input - v-model="queryParams.enername" - placeholder="鑳芥簮绫诲瀷" - maxlength="30" - /> + <el-input v-model="queryParams.enername" placeholder="鑳芥簮绫诲瀷" maxlength="30" /> </el-form-item> <el-form-item label="鑳芥簮鍝佺"> - <el-select - v-model="queryParams.enerclassid" - placeholder="鑳芥簮鍝佺" - style="width: 100%" - > + <el-select v-model="queryParams.enerclassid" placeholder="鑳芥簮鍝佺" style="width: 100%"> <el-option v-for="dict in energyVarietiesList" :key="dict.enerclassid" @@ -29,121 +16,77 @@ </el-select> </el-form-item> <el-form-item> - <el-button type="primary" icon="Search" @click="handleQuery" - >鎼滅储</el-button - > + <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button> <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> + </el-form-item> + <el-form-item style="float: right"> + <el-button type="primary" icon="Plus" @click="handleAdd"> 鏂板 </el-button> </el-form-item> </el-form> </div> - <div class="table-box"> - <div class="mt20 mb20"> - <el-button type="primary" icon="Plus" @click="handleAdd" - >鏂板</el-button - > + <div class="table-bg-style"> + <div class="table-box"> + <el-table v-loading="loading" :data="energyTypeList"> + <el-table-column + label="鑳芥簮绫诲瀷" + align="center" + key="enername" + prop="enername" + :show-overflow-tooltip="true" + /> + <el-table-column label="璁¢噺鍗曚綅" align="center" key="muid" prop="muid" :show-overflow-tooltip="true" /> + <el-table-column + label="鑳芥簮鍝佺" + align="center" + key="enerclassname" + prop="enerclassname" + :show-overflow-tooltip="true" + /> + <el-table-column label="鑳芥簮缂栧彿" align="center" key="enersno" prop="enersno" :show-overflow-tooltip="true" /> + <el-table-column + label="鏄惁瀛樺偍" + align="center" + key="isstorage" + prop="isstorage" + :show-overflow-tooltip="true" + /> + <el-table-column label="鍗曚环" align="center" key="price" prop="price" :show-overflow-tooltip="true" /> + <el-table-column + label="鎶樻爣绯绘暟" + align="center" + key="coefficient" + prop="coefficient" + :show-overflow-tooltip="true" + /> + <el-table-column + label="鎺掓斁鍥犲瓙" + align="center" + key="emissionFactors" + prop="emissionFactors" + :show-overflow-tooltip="true" + /> + <el-table-column label="澶囨敞" align="center" key="note" prop="note" :show-overflow-tooltip="true" /> + <el-table-column label="鎿嶄綔" align="center" width="200" class-name="small-padding fixed-width"> + <template #default="scope"> + <el-tooltip content="缂栬緫" placement="top"> + <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"> 缂栬緫 </el-button> + </el-tooltip> + <el-tooltip content="鍒犻櫎" placement="top"> + <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"> 鍒犻櫎 </el-button> + </el-tooltip> + </template> + </el-table-column> + </el-table> + <pagination + v-show="queryParams.total > 0" + :total="queryParams.total" + v-model:page="queryParams.pageNum" + v-model:limit="queryParams.pageSize" + @pagination="getList" + /> </div> - <el-table v-loading="loading" :data="energyTypeList"> - <el-table-column - label="鑳芥簮绫诲瀷" - align="center" - key="enername" - prop="enername" - :show-overflow-tooltip="true" - /> - <el-table-column - label="璁¢噺鍗曚綅" - align="center" - key="muid" - prop="muid" - :show-overflow-tooltip="true" - /> - <el-table-column - label="鑳芥簮鍝佺" - align="center" - key="enerclassname" - prop="enerclassname" - :show-overflow-tooltip="true" - /> - <el-table-column - label="鑳芥簮缂栧彿" - align="center" - key="enersno" - prop="enersno" - :show-overflow-tooltip="true" - /> - <el-table-column - label="鏄惁瀛樺偍" - align="center" - key="isstorage" - prop="isstorage" - :show-overflow-tooltip="true" - /> - <el-table-column - label="鍗曚环" - align="center" - key="price" - prop="price" - :show-overflow-tooltip="true" - /> - <el-table-column - label="鎶樻爣绯绘暟" - align="center" - key="coefficient" - prop="coefficient" - :show-overflow-tooltip="true" - /> - <el-table-column - label="鎺掓斁鍥犲瓙" - align="center" - key="emissionFactors" - prop="emissionFactors" - :show-overflow-tooltip="true" - /> - <el-table-column - label="澶囨敞" - align="center" - key="note" - prop="note" - :show-overflow-tooltip="true" - /> - <el-table-column - label="鎿嶄綔" - align="center" - width="200" - class-name="small-padding fixed-width" - > - <template #default="scope"> - <el-tooltip content="缂栬緫" placement="top"> - <el-button - link - type="primary" - icon="Edit" - @click="handleUpdate(scope.row)" - > - 缂栬緫 - </el-button> - </el-tooltip> - <el-tooltip content="鍒犻櫎" placement="top"> - <el-button - link - type="primary" - icon="Delete" - @click="handleDelete(scope.row)" - > - 鍒犻櫎 - </el-button> - </el-tooltip> - </template> - </el-table-column> - </el-table> - <pagination - v-show="queryParams.total > 0" - :total="queryParams.total" - v-model:page="queryParams.pageNum" - v-model:limit="queryParams.pageSize" - @pagination="getList" - /> </div> + <el-dialog :title="title" v-model="open" width="600px" append-to-body> <el-form :model="form" :rules="rules" ref="formRef" label-width="90px"> <el-row> @@ -154,12 +97,7 @@ </el-col> <el-col :span="12"> <el-form-item label="璁¢噺鍗曚綅" prop="muid"> - <el-select - v-model="form.muid" - placeholder="璇烽�夐」璁¢噺鍗曚綅" - clearable - style="width: 100%" - > + <el-select v-model="form.muid" placeholder="璇烽�夐」璁¢噺鍗曚綅" clearable style="width: 100%"> <el-option v-for="dict in sys_unit" :key="dict.value" @@ -177,11 +115,7 @@ </el-col> <el-col :span="12"> <el-form-item label="鑳芥簮鍝佺" prop="enerclassid"> - <el-select - v-model="form.enerclassid" - placeholder="璇烽�夐」鑳芥簮鍝佺" - style="width: 100%" - > + <el-select v-model="form.enerclassid" placeholder="璇烽�夐」鑳芥簮鍝佺" style="width: 100%"> <el-option v-for="dict in energyVarietiesList" :key="dict.enerclassid" @@ -193,11 +127,7 @@ </el-col> <el-col :span="12"> <el-form-item label="鏄惁瀛樺偍" prop="isstorage"> - <el-select - v-model="form.isstorage" - placeholder="璇烽�夐」鏄惁瀛樺偍" - style="width: 100%" - > + <el-select v-model="form.isstorage" placeholder="璇烽�夐」鏄惁瀛樺偍" style="width: 100%"> <el-option v-for="dict in sys_yes_no" :key="dict.value" @@ -248,11 +178,7 @@ <el-row> <el-col :span="24"> <el-form-item label="澶囨敞" prop="note"> - <el-input - v-model="form.note" - placeholder="璇疯緭鍏ュ娉�" - type="textarea" - /> + <el-input v-model="form.note" placeholder="璇疯緭鍏ュ娉�" type="textarea" /> </el-form-item> </el-col> </el-row> @@ -273,15 +199,15 @@ getEnergyType, updateEnergyType, delEnergyType, -} from "@/api/modelConfiguration/energyType"; -import { listEnergyVarietiesList } from "@/api/modelConfiguration/energyVarieties"; -const { proxy } = getCurrentInstance(); -const { sys_unit, sys_yes_no } = proxy.useDict("sys_unit", "sys_yes_no"); -const energyVarietiesList = ref([]); -const energyTypeList = ref([]); -const open = ref(false); -const loading = ref(false); -const title = ref(""); +} from "@/api/modelConfiguration/energyType" +import { listEnergyVarietiesList } from "@/api/modelConfiguration/energyVarieties" +const { proxy } = getCurrentInstance() +const { sys_unit, sys_yes_no } = proxy.useDict("sys_unit", "sys_yes_no") +const energyVarietiesList = ref([]) +const energyTypeList = ref([]) +const open = ref(false) +const loading = ref(false) +const title = ref("") const data = reactive({ form: {}, queryParams: { @@ -292,76 +218,68 @@ enerclassname: null, }, rules: { - enername: [ - { required: true, message: "鑳芥簮绫诲瀷涓嶈兘涓虹┖", trigger: "blur" }, - ], + enername: [{ required: true, message: "鑳芥簮绫诲瀷涓嶈兘涓虹┖", trigger: "blur" }], enersno: [ { required: true, message: "鑳芥簮缂栧彿涓嶈兘涓虹┖", trigger: "blur" }, { pattern: /^[a-z0-9]*$/, message: "鑳芥簮缂栧彿蹇呴』涓烘暟瀛�/灏忓啓瀛楁瘝" }, ], - enerclassid: [ - { required: true, message: "鑳芥簮鍝佺涓嶈兘涓虹┖", trigger: "blur" }, - ], - isstorage: [ - { required: true, message: "鏄惁瀛樺偍涓嶈兘涓虹┖", trigger: "blur" }, - ], + enerclassid: [{ required: true, message: "鑳芥簮鍝佺涓嶈兘涓虹┖", trigger: "blur" }], + isstorage: [{ required: true, message: "鏄惁瀛樺偍涓嶈兘涓虹┖", trigger: "blur" }], price: [{ required: true, message: "鍗曚环涓嶈兘涓虹┖", trigger: "blur" }], - coefficient: [ - { required: true, message: "鎶樻爣绯绘暟涓嶈兘涓虹┖", trigger: "blur" }, - ], + coefficient: [{ required: true, message: "鎶樻爣绯绘暟涓嶈兘涓虹┖", trigger: "blur" }], }, -}); -const { queryParams, form, rules } = toRefs(data); -getList(); -getEnergyVarietiesList(); +}) +const { queryParams, form, rules } = toRefs(data) +getList() +getEnergyVarietiesList() // 妯″瀷閰嶇疆绠$悊-鑳芥簮绫诲瀷绠$悊-鍒楄〃 function getList() { - loading.value = true; + loading.value = true listEnergyType(proxy.addDateRange(queryParams.value)).then((res) => { - loading.value = false; - energyTypeList.value = res.rows; - queryParams.value.total = res.total; - }); + loading.value = false + energyTypeList.value = res.rows + queryParams.value.total = res.total + }) } function getEnergyVarietiesList() { listEnergyVarietiesList().then((res) => { - energyVarietiesList.value = res.data; - }); + energyVarietiesList.value = res.data + }) } // 妯″瀷閰嶇疆绠$悊-鑳芥簮绫诲瀷绠$悊-鎼滅储 function handleQuery() { - queryParams.value.pageNum = 1; - getList(); + queryParams.value.pageNum = 1 + getList() } // 妯″瀷閰嶇疆绠$悊-鑳芥簮绫诲瀷绠$悊-閲嶇疆 function resetQuery() { - proxy.resetForm("queryRef"); + proxy.resetForm("queryRef") queryParams.value = { pageNum: 1, pageSize: 10, total: 0, enerclassname: null, - }; - getList(); + } + getList() } // 妯″瀷閰嶇疆绠$悊-鑳芥簮绫诲瀷绠$悊-鏂板 function handleAdd() { - reset(); - open.value = true; - title.value = "鏂板鑳芥簮绫诲瀷"; + reset() + open.value = true + title.value = "鏂板鑳芥簮绫诲瀷" } function handleClick(label, value) { - form.value[label] = value; - console.log(form.value, label, value); + form.value[label] = value + console.log(form.value, label, value) } // 妯″瀷閰嶇疆绠$悊-鑳芥簮绫诲瀷绠$悊-缂栬緫 function handleUpdate(row) { - reset(); + reset() getEnergyType(row.enerid).then((response) => { - form.value = response.data; - open.value = true; - title.value = "缂栬緫鑳芥簮绫诲瀷"; - }); + form.value = response.data + open.value = true + title.value = "缂栬緫鑳芥簮绫诲瀷" + }) } // 妯″瀷閰嶇疆绠$悊-鑳芥簮绫诲瀷绠$悊-鏂板/缂栬緫-淇濆瓨 function submitForm() { @@ -369,24 +287,24 @@ if (valid) { if (form.value.enerid != undefined) { updateEnergyType(form.value).then((response) => { - proxy.$modal.msgSuccess("淇敼鎴愬姛"); - open.value = false; - getList(); - }); + proxy.$modal.msgSuccess("淇敼鎴愬姛") + open.value = false + getList() + }) } else { addEnergyType(form.value).then((response) => { - proxy.$modal.msgSuccess("鏂板鎴愬姛"); - open.value = false; - getList(); - }); + proxy.$modal.msgSuccess("鏂板鎴愬姛") + open.value = false + getList() + }) } } - }); + }) } // 妯″瀷閰嶇疆绠$悊-鑳芥簮绫诲瀷绠$悊-鏂板/缂栬緫-鍙栨秷 function cancel() { - open.value = false; - reset(); + open.value = false + reset() } // 妯″瀷閰嶇疆绠$悊-鑳芥簮绫诲瀷绠$悊-鏂板/缂栬緫-琛ㄥ崟閲嶇疆 function reset() { @@ -401,21 +319,21 @@ muidString: null, note: null, price: null, - }; - proxy.resetForm("formRef"); + } + proxy.resetForm("formRef") } // 妯″瀷閰嶇疆绠$悊-鑳芥簮绫诲瀷绠$悊-鍒犻櫎 function handleDelete(row) { proxy.$modal .confirm('鏄惁纭鍒犻櫎鑳芥簮绫诲瀷涓�"' + row.enername + '"鐨勬暟鎹」锛�') .then(function () { - return delEnergyType(row.enerid); + return delEnergyType(row.enerid) }) .then(() => { - getList(); - proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛"); + getList() + proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛") }) - .catch(() => {}); + .catch(() => {}) } </script> <style scoped lang="scss"> diff --git a/zhitan-vue/src/views/modelconfiguration/energyvarieties/energyVarieties.vue b/zhitan-vue/src/views/modelconfiguration/energyvarieties/energyVarieties.vue index d1ba49c..9d5e639 100644 --- a/zhitan-vue/src/views/modelconfiguration/energyvarieties/energyVarieties.vue +++ b/zhitan-vue/src/views/modelconfiguration/energyvarieties/energyVarieties.vue @@ -1,6 +1,5 @@ <template> <div class="page"> - <div class="form-card"> <el-form :model="queryParams" ref="queryRef" :inline="true" label-width="80px" @submit.prevent> <el-form-item label="鑳芥簮鍝佺"> @@ -10,36 +9,73 @@ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button> <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> </el-form-item> + <el-form-item style="float: right"> + <el-button type="primary" icon="Plus" @click="handleAdd">鏂板</el-button> + </el-form-item> </el-form> </div> - <div class="table-box"> - <div class="mt20 mb20"> - <el-button type="primary" icon="Plus" @click="handleAdd">鏂板</el-button> + <div class="table-bg-style"> + <div class="table-box"> + <el-table v-loading="loading" :data="energyVarietiesList"> + <el-table-column + label="鑳芥簮鍝佺" + align="center" + key="enerclassname" + prop="enerclassname" + :show-overflow-tooltip="true" + /> + <el-table-column label="澶囨敞" align="center" key="note" prop="note" :show-overflow-tooltip="true" /> + <el-table-column + label="鍒涘缓浜�" + align="center" + key="createBy" + prop="createBy" + :show-overflow-tooltip="true" + width="100" + /> + <el-table-column + label="鍒涘缓鏃堕棿" + align="center" + key="createTime" + prop="createTime" + :show-overflow-tooltip="true" + width="200" + /> + <el-table-column + label="鏇存柊浜�" + align="center" + key="updateBy" + prop="updateBy" + :show-overflow-tooltip="true" + width="100" + /> + <el-table-column + label="鏇存柊鏃堕棿" + align="center" + key="updateTime" + prop="updateTime" + :show-overflow-tooltip="true" + width="200" + /> + <el-table-column label="鎿嶄綔" align="center" width="200" class-name="small-padding fixed-width"> + <template #default="scope"> + <el-tooltip content="缂栬緫" placement="top"> + <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"> 缂栬緫 </el-button> + </el-tooltip> + <el-tooltip content="鍒犻櫎" placement="top"> + <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"> 鍒犻櫎 </el-button> + </el-tooltip> + </template> + </el-table-column> + </el-table> + <pagination + v-show="queryParams.total > 0" + :total="queryParams.total" + v-model:page="queryParams.pageNum" + v-model:limit="queryParams.pageSize" + @pagination="getList" + /> </div> - <el-table v-loading="loading" :data="energyVarietiesList"> - <el-table-column label="鑳芥簮鍝佺" align="center" key="enerclassname" prop="enerclassname" :show-overflow-tooltip="true" /> - <el-table-column label="澶囨敞" align="center" key="note" prop="note" :show-overflow-tooltip="true" /> - <el-table-column label="鍒涘缓浜�" align="center" key="createBy" prop="createBy" :show-overflow-tooltip="true" width="100"/> - <el-table-column label="鍒涘缓鏃堕棿" align="center" key="createTime" prop="createTime" :show-overflow-tooltip="true" width="200"/> - <el-table-column label="鏇存柊浜�" align="center" key="updateBy" prop="updateBy" :show-overflow-tooltip="true" width="100"/> - <el-table-column label="鏇存柊鏃堕棿" align="center" key="updateTime" prop="updateTime" :show-overflow-tooltip="true" width="200"/> - <el-table-column label="鎿嶄綔" align="center" width="200" class-name="small-padding fixed-width"> - <template #default="scope"> - <el-tooltip content="缂栬緫" placement="top"> - <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"> - 缂栬緫 - </el-button> - </el-tooltip> - <el-tooltip content="鍒犻櫎" placement="top"> - <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"> - 鍒犻櫎 - </el-button> - </el-tooltip> - </template> - </el-table-column> - </el-table> - <pagination v-show="queryParams.total > 0" :total="queryParams.total" v-model:page="queryParams.pageNum" - v-model:limit="queryParams.pageSize" @pagination="getList" /> </div> <el-dialog :title="title" v-model="open" width="600px" append-to-body> <el-form :model="form" :rules="rules" ref="formRef" label-width="100px"> @@ -72,12 +108,12 @@ getEnergyVarieties, updateEnergyVarieties, delEnergyVarieties, -} from "@/api/modelConfiguration/energyVarieties"; -const { proxy } = getCurrentInstance(); -const energyVarietiesList = ref([]); -const open = ref(false); -const loading = ref(false); -const title = ref(""); +} from "@/api/modelConfiguration/energyVarieties" +const { proxy } = getCurrentInstance() +const energyVarietiesList = ref([]) +const open = ref(false) +const loading = ref(false) +const title = ref("") const data = reactive({ form: {}, queryParams: { @@ -89,41 +125,39 @@ rules: { enerclassname: [{ required: true, message: "鑳芥簮鍝佺涓嶈兘涓虹┖", trigger: "blur" }], }, -}); -const { queryParams, form, rules } = toRefs(data); -getList(); +}) +const { queryParams, form, rules } = toRefs(data) +getList() // 妯″瀷閰嶇疆绠$悊-鑳芥簮鍝佺璁剧疆-鍒楄〃 function getList() { - loading.value = true; - listEnergyVarieties( - proxy.addDateRange(queryParams.value) - ).then((res) => { - loading.value = false; - energyVarietiesList.value = res.rows; - queryParams.value.total = res.total; - }); + loading.value = true + listEnergyVarieties(proxy.addDateRange(queryParams.value)).then((res) => { + loading.value = false + energyVarietiesList.value = res.rows + queryParams.value.total = res.total + }) } // 妯″瀷閰嶇疆绠$悊-鑳芥簮鍝佺璁剧疆-鎼滅储 function handleQuery() { - queryParams.value.pageNum = 1; - getList(); + queryParams.value.pageNum = 1 + getList() } // 妯″瀷閰嶇疆绠$悊-鑳芥簮鍝佺璁剧疆-閲嶇疆 function resetQuery() { - proxy.resetForm("queryRef"); + proxy.resetForm("queryRef") queryParams.value = { pageNum: 1, pageSize: 10, total: 0, enerclassname: null, } - getList(); + getList() } // 妯″瀷閰嶇疆绠$悊-鑳芥簮鍝佺璁剧疆-鏂板 function handleAdd() { - reset(); - open.value = true; - title.value = "鏂板鑳芥簮鍝佺绠$悊"; + reset() + open.value = true + title.value = "鏂板鑳芥簮鍝佺绠$悊" } // 妯″瀷閰嶇疆绠$悊-鑳芥簮鍝佺璁剧疆-缂栬緫 // function handleUpdate(row) { @@ -133,58 +167,58 @@ // title.value = "缂栬緫鑳芥簮鍝佺绠$悊"; // } function handleUpdate(row) { - reset(); - getEnergyVarieties(row.enerclassid).then(response => { - form.value = response.data; - open.value = true; - title.value = "缂栬緫鑳芥簮鍝佺绠$悊"; - }); -}; + reset() + getEnergyVarieties(row.enerclassid).then((response) => { + form.value = response.data + open.value = true + title.value = "缂栬緫鑳芥簮鍝佺绠$悊" + }) +} // 妯″瀷閰嶇疆绠$悊-鑳芥簮鍝佺璁剧疆-鏂板/缂栬緫-淇濆瓨 function submitForm() { proxy.$refs["formRef"].validate((valid) => { if (valid) { if (form.value.enerclassid != undefined) { updateEnergyVarieties(form.value).then((response) => { - proxy.$modal.msgSuccess("淇敼鎴愬姛"); - open.value = false; - getList(); - }); + proxy.$modal.msgSuccess("淇敼鎴愬姛") + open.value = false + getList() + }) } else { addEnergyVarieties(form.value).then((response) => { - proxy.$modal.msgSuccess("鏂板鎴愬姛"); - open.value = false; - getList(); - }); + proxy.$modal.msgSuccess("鏂板鎴愬姛") + open.value = false + getList() + }) } } - }); + }) } // 妯″瀷閰嶇疆绠$悊-鑳芥簮鍝佺璁剧疆-鏂板/缂栬緫-鍙栨秷 function cancel() { - open.value = false; - reset(); + open.value = false + reset() } // 妯″瀷閰嶇疆绠$悊-鑳芥簮鍝佺璁剧疆-鏂板/缂栬緫-琛ㄥ崟閲嶇疆 function reset() { form.value = { - enerclassname: '', - note: '' - }; - proxy.resetForm("formRef"); + enerclassname: "", + note: "", + } + proxy.resetForm("formRef") } // 妯″瀷閰嶇疆绠$悊-鑳芥簮鍝佺璁剧疆-鍒犻櫎 function handleDelete(row) { proxy.$modal .confirm('鏄惁纭鍒犻櫎鑳芥簮鍝佺涓�"' + row.enerclassname + '"鐨勬暟鎹」锛�') .then(function () { - return delEnergyVarieties(row.enerclassid); + return delEnergyVarieties(row.enerclassid) }) .then(() => { - getList(); - proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛"); + getList() + proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛") }) - .catch(() => { }); + .catch(() => {}) } </script> <style scoped lang="scss"> diff --git a/zhitan-vue/src/views/modelconfiguration/indexwarehouse/components/statisticalIndicatorManagement/statisticalIndicatorManagement.vue b/zhitan-vue/src/views/modelconfiguration/indexwarehouse/components/statisticalIndicatorManagement/statisticalIndicatorManagement.vue index d2e49b8..94799d3 100644 --- a/zhitan-vue/src/views/modelconfiguration/indexwarehouse/components/statisticalIndicatorManagement/statisticalIndicatorManagement.vue +++ b/zhitan-vue/src/views/modelconfiguration/indexwarehouse/components/statisticalIndicatorManagement/statisticalIndicatorManagement.vue @@ -1,101 +1,116 @@ <template> - <div class="page-box"> - <div class="form-card"> - <el-form :model="form" ref="queryRef" :inline="true" label-width="70px"> - <el-form-item label="缂栫爜" prop="indexCategory"> - <el-select v-model="form.indexCategory" placeholder="璇烽�夋嫨鎸囨爣鍒嗙被" style="width: 200px"> - <el-option v-for="dict in sys_index_category" :key="dict.value" :label="dict.label" - :value="dict.value" /> - </el-select> - </el-form-item> - <el-form-item label="鍏抽敭瀛�" prop="name"> - <el-input v-model="form.name" placeholder="璇疯緭鍏ユ寚鏍囧悕绉�/缂栫爜" /> - </el-form-item> + <div class="page-box"> + <div class="form-card"> + <el-form :model="form" ref="queryRef" :inline="true" label-width="70px"> + <el-form-item label="缂栫爜" prop="indexCategory"> + <el-select v-model="form.indexCategory" placeholder="璇烽�夋嫨鎸囨爣鍒嗙被" style="width: 200px"> + <el-option v-for="dict in sys_index_category" :key="dict.value" :label="dict.label" :value="dict.value" /> + </el-select> + </el-form-item> + <el-form-item label="鍏抽敭瀛�" prop="name"> + <el-input v-model="form.name" placeholder="璇疯緭鍏ユ寚鏍囧悕绉�/缂栫爜" /> + </el-form-item> - <el-form-item> - <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button> - <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> - <el-button icon="Plus" type="primary" @click="handleAdd">鏂板</el-button> - <el-button icon="Delete" :disabled="multiple" @click="handleDel">鍒犻櫎</el-button> - </el-form-item> - </el-form> - </div> - <!-- <div class="ml20 mt20 mb20"> + <el-form-item> + <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button> + <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> + <el-button icon="Plus" type="primary" @click="handleAdd">鏂板</el-button> + <el-button icon="Delete" :disabled="multiple" @click="handleDel">鍒犻櫎</el-button> + </el-form-item> + </el-form> + </div> + <!-- <div class="ml20 mt20 mb20"> <el-button icon="Plus" type="primary" @click="handleAdd">鏂板</el-button> <el-button icon="Delete" :disabled="multiple" @click="handleDel">鍒犻櫎</el-button> <el-button icon="Upload">瀵煎叆</el-button> </div> --> - <div class="table-box"> - <el-table :data="tableData" v-loading="loading" height="calc(100vh - 450px)" - @selection-change="handleSelectionChange"> - <el-table-column type="selection" width="55" align="center" show-overflow-tooltip /> - <el-table-column prop="code" label="鎸囨爣缂栫爜" align="center" show-overflow-tooltip /> - <el-table-column prop="name" label="鎸囨爣鍚嶇О" align="center" show-overflow-tooltip /> - <el-table-column prop="indexCategory" label="绯荤粺鎸囨爣鍒嗙被" align="center" show-overflow-tooltip - :formatter="(row, column) => proxy.selectDictLabel(sys_index_category, row.indexCategory)" /> - <el-table-column prop="unitId" label="鍗曚綅" align="center" show-overflow-tooltip - :formatter="(row, column) => proxy.selectDictLabel(sys_unit, row.unitId)" /> - <el-table-column label="鎿嶄綔" width="230" align="center"> - <template #default="scope"> - <el-button link type="primary" icon="Edit" @click="handleAdd(scope.row)"> - 淇敼 - </el-button> - <el-button link type="primary" icon="Edit" @click="handleSave(scope.row)"> - 瀛樺偍 - </el-button> - <el-button link type="primary" icon="Delete" @click="handleDel(scope.row)"> - 鍒犻櫎 - </el-button> - </template> - </el-table-column> - </el-table> - </div> - <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" - v-model:limit="queryParams.pageSize" @pagination="getList(currentNode)" /> - <edit-modal ref="EditModalRef" :indexType="indexType" :sys_index_category='sys_index_category' - :sys_unit='sys_unit' @getList="getList(currentNode)" /> - <storageModal ref="storageModalRef" /> - - + <div class="table-box" style="margin-top: 0"> + <el-table + :data="tableData" + v-loading="loading" + height="calc(100vh - 450px)" + @selection-change="handleSelectionChange" + > + <el-table-column type="selection" width="55" align="center" show-overflow-tooltip /> + <el-table-column prop="code" label="鎸囨爣缂栫爜" align="center" show-overflow-tooltip /> + <el-table-column prop="name" label="鎸囨爣鍚嶇О" align="center" show-overflow-tooltip /> + <el-table-column + prop="indexCategory" + label="绯荤粺鎸囨爣鍒嗙被" + align="center" + show-overflow-tooltip + :formatter="(row, column) => proxy.selectDictLabel(sys_index_category, row.indexCategory)" + /> + <el-table-column + prop="unitId" + label="鍗曚綅" + align="center" + show-overflow-tooltip + :formatter="(row, column) => proxy.selectDictLabel(sys_unit, row.unitId)" + /> + <el-table-column label="鎿嶄綔" width="230" align="center"> + <template #default="scope"> + <el-button link type="primary" icon="Edit" @click="handleAdd(scope.row)"> 淇敼 </el-button> + <el-button link type="primary" icon="Edit" @click="handleSave(scope.row)"> 瀛樺偍 </el-button> + <el-button link type="primary" icon="Delete" @click="handleDel(scope.row)"> 鍒犻櫎 </el-button> + </template> + </el-table-column> + </el-table> </div> + <pagination + v-show="total > 0" + :total="total" + v-model:page="queryParams.pageNum" + v-model:limit="queryParams.pageSize" + @pagination="getList(currentNode)" + /> + <edit-modal + ref="EditModalRef" + :indexType="indexType" + :sys_index_category="sys_index_category" + :sys_unit="sys_unit" + @getList="getList(currentNode)" + /> + <storageModal ref="storageModalRef" /> + </div> </template> <script setup> -import storageModal from './components/storage/StorageModal.vue'; -import EditModal from './components/EditModal.vue' -import { listEnergyindex, delEnergyindex } from '@/api/modelConfiguration/indexWarehouse' +import storageModal from "./components/storage/StorageModal.vue" +import EditModal from "./components/EditModal.vue" +import { listEnergyindex, delEnergyindex } from "@/api/modelConfiguration/indexWarehouse" const { proxy } = getCurrentInstance() -const { sys_index_category } = proxy.useDict("sys_index_category"); -const { sys_unit } = proxy.useDict("sys_unit"); +const { sys_index_category } = proxy.useDict("sys_index_category") +const { sys_unit } = proxy.useDict("sys_unit") -const props = defineProps(['indexType']) +const props = defineProps(["indexType"]) let loading = ref(false) let form = ref({ - indexCategory: null, - name: null + indexCategory: null, + name: null, }) let tableData = ref([]) -let total = ref(0); +let total = ref(0) let queryParams = ref({ - pageNum: 1, - pageSize: 10, + pageNum: 1, + pageSize: 10, }) let currentNode = ref(null) function getList(modelNode) { - currentNode.value = modelNode; + currentNode.value = modelNode - console.log(111, currentNode.value) - if (modelNode) { - loading.value = true; - form.value.nodeId = modelNode.id; - form.value.indexType = props.indexType; - listEnergyindex({ ...queryParams.value, ...form.value }).then(response => { - tableData.value = response.rows; - total.value = response.total; - loading.value = false; - }); - } else { - tableData.value = []; - } + console.log(111, currentNode.value) + if (modelNode) { + loading.value = true + form.value.nodeId = modelNode.id + form.value.indexType = props.indexType + listEnergyindex({ ...queryParams.value, ...form.value }).then((response) => { + tableData.value = response.rows + total.value = response.total + loading.value = false + }) + } else { + tableData.value = [] + } } // // 鍥炴樉鏁版嵁瀛楀吀 @@ -116,51 +131,54 @@ // 闈炲涓鐢� let multiple = ref(true) function handleSelectionChange(selection) { - ids.value = selection.map(item => item.indexId); - names.value = selection.map(item => item.name); - multiple.value = !selection.length + ids.value = selection.map((item) => item.indexId) + names.value = selection.map((item) => item.name) + multiple.value = !selection.length } function handleQuery() { - getList(currentNode.value) + getList(currentNode.value) } function resetQuery() { - form.value = { - indexCategory: null, - name: null - } - getList(currentNode.value) + form.value = { + indexCategory: null, + name: null, + } + getList(currentNode.value) } -let EditModalRef = ref('') +let EditModalRef = ref("") function handleAdd(row) { - if (EditModalRef.value) { - EditModalRef.value.handleOpen(row, currentNode.value) - } + if (EditModalRef.value) { + EditModalRef.value.handleOpen(row, currentNode.value) + } } function handleDel(row) { - const indexIds = row.indexId || ids.value - const indexNames = row.name || names.value - proxy.$modal.confirm('鏄惁纭鍒犻櫎鎸囨爣鍚嶄负"' + indexNames + '"鐨勬暟鎹」?', '璀﹀憡', { - confirmButtonText: '纭畾', - cancelButtonText: '鍙栨秷', - type: 'warning' - }).then(() => { - return delEnergyindex(currentNode.value.id, indexIds) - }).then(() => { - getList(currentNode.value) - proxy.$modal.msgError('鍒犻櫎鎴愬姛') - }).catch(function () { + const indexIds = row.indexId || ids.value + const indexNames = row.name || names.value + proxy.$modal + .confirm('鏄惁纭鍒犻櫎鎸囨爣鍚嶄负"' + indexNames + '"鐨勬暟鎹」?', "璀﹀憡", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning", }) + .then(() => { + return delEnergyindex(currentNode.value.id, indexIds) + }) + .then(() => { + getList(currentNode.value) + proxy.$modal.msgError("鍒犻櫎鎴愬姛") + }) + .catch(function () {}) } -let storageModalRef = ref('') +let storageModalRef = ref("") function handleSave(row) { - if (storageModalRef.value) { - storageModalRef.value.handleOpen(row, currentNode.value) - storageModalRef.value.getIndexStorageFun(row.indexId) - } + if (storageModalRef.value) { + storageModalRef.value.handleOpen(row, currentNode.value) + storageModalRef.value.getIndexStorageFun(row.indexId) + } } defineExpose({ getList }) @@ -170,11 +188,10 @@ @import "@/assets/styles/page.scss"; .page-box { - height: calc(100vh - 115px); - + height: calc(100vh - 115px); } .table-box { - height: calc(100vh - 455px); + height: calc(100vh - 455px); } </style> diff --git a/zhitan-vue/src/views/modelconfiguration/indexwarehouse/indexWarehouse.vue b/zhitan-vue/src/views/modelconfiguration/indexwarehouse/indexWarehouse.vue index 82f3ef3..39fe733 100644 --- a/zhitan-vue/src/views/modelconfiguration/indexwarehouse/indexWarehouse.vue +++ b/zhitan-vue/src/views/modelconfiguration/indexwarehouse/indexWarehouse.vue @@ -40,7 +40,7 @@ </div> </div> <div class="page-container-right"> - <div class="mb20 mt20 ml20 tab-box"> + <div class="tab-box"> <div class="tab-li" :class="tab == 1 ? 'is-tab' : ''" @click="handleTab('1')">璁¢噺鍣ㄥ叿閰嶇疆淇℃伅</div> <div class="tab-li" :class="tab == 2 ? 'is-tab' : ''" @click="handleTab('2')">缁熻鎸囨爣</div> <!-- <el-radio-group v-model="tab"> @@ -303,11 +303,13 @@ color: #333; border-bottom: 1px solid #3371eb; margin-right: 20px; + margin-left: 15px; + font-size: 15px; .tab-li { cursor: pointer; border: 1px solid #3371eb; - padding: 10px 25px; + padding: 8px 20px; border-radius: 5px 5px 0 0; } diff --git a/zhitan-vue/src/views/modelconfiguration/setpeakvalley/setPeakValley.vue b/zhitan-vue/src/views/modelconfiguration/setpeakvalley/setPeakValley.vue index 5eef2db..2ce4615 100644 --- a/zhitan-vue/src/views/modelconfiguration/setpeakvalley/setPeakValley.vue +++ b/zhitan-vue/src/views/modelconfiguration/setpeakvalley/setPeakValley.vue @@ -6,52 +6,70 @@ <el-input v-model="queryParams.remark" placeholder="璇疯緭鍏ュ娉�" /> </el-form-item> <el-form-item> - <el-button type="primary" icon="Search" @click="handleQuery"> - 鎼滅储 - </el-button> + <el-button type="primary" icon="Search" @click="handleQuery"> 鎼滅储 </el-button> <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> + </el-form-item> + <el-form-item style="float: right"> + <el-button type="primary" icon="Plus" @click="handleAdd"> 鏃舵閰嶇疆 </el-button> </el-form-item> </el-form> </div> - <div class="table-box"> - <div class="mt20 mb20"> - <el-button type="primary" icon="Plus" @click="handleAdd"> - 鏃舵閰嶇疆 - </el-button> + <div class="table-bg-style"> + <div class="table-box"> + <el-table v-loading="loading" :data="productoutputList" style="width: 100%" row-key="id"> + <el-table-column + label="鐢熸晥寮�濮嬫棩鏈�" + align="center" + key="beginDate" + prop="beginDate" + :show-overflow-tooltip="true" + /> + <el-table-column + label="鐢熸晥缁撴潫鏃ユ湡" + align="center" + key="endDate" + prop="endDate" + :show-overflow-tooltip="true" + /> + <el-table-column label="澶囨敞" align="center" key="remark" prop="remark" :show-overflow-tooltip="true" /> + <el-table-column + label="鍒涘缓鏃堕棿" + align="center" + key="createTime" + prop="createTime" + :show-overflow-tooltip="true" + /> + <el-table-column label="鎿嶄綔" align="center" width="300" class-name="small-padding fixed-width"> + <template #default="scope"> + <el-tooltip content="鐢典环閰嶇疆" placement="top"> + <el-button link type="primary" icon="Plus" @click="handleExpandChange(scope.row)"> 鐢典环閰嶇疆 </el-button> + </el-tooltip> + <el-tooltip content="缂栬緫" placement="top"> + <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"> 缂栬緫 </el-button> + </el-tooltip> + <el-tooltip content="鍒犻櫎" placement="top"> + <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"> 鍒犻櫎 </el-button> + </el-tooltip> + </template> + </el-table-column> + </el-table> </div> - <el-table v-loading="loading" :data="productoutputList" style="width: 100%" row-key="id"> - <el-table-column label="鐢熸晥寮�濮嬫棩鏈�" align="center" key="beginDate" prop="beginDate" :show-overflow-tooltip="true" /> - <el-table-column label="鐢熸晥缁撴潫鏃ユ湡" align="center" key="endDate" prop="endDate" :show-overflow-tooltip="true" /> - <el-table-column label="澶囨敞" align="center" key="remark" prop="remark" :show-overflow-tooltip="true" /> - <el-table-column label="鍒涘缓鏃堕棿" align="center" key="createTime" prop="createTime" :show-overflow-tooltip="true" /> - <el-table-column label="鎿嶄綔" align="center" width="300" class-name="small-padding fixed-width"> - <template #default="scope"> - <el-tooltip content="鐢典环閰嶇疆" placement="top"> - <el-button link type="primary" icon="Plus" @click="handleExpandChange(scope.row)"> - 鐢典环閰嶇疆 - </el-button> - </el-tooltip> - <el-tooltip content="缂栬緫" placement="top"> - <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"> - 缂栬緫 - </el-button> - </el-tooltip> - <el-tooltip content="鍒犻櫎" placement="top"> - <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"> - 鍒犻櫎 - </el-button> - </el-tooltip> - </template> - </el-table-column> - </el-table> </div> <el-dialog :title="title" v-model="open" width="600px" append-to-body> <el-form :model="form" :rules="rules" ref="formRef" label-width="120px"> <el-row> <el-col :span="24"> <el-form-item label="鐢熸晥鏃ユ湡" prop="beginEndDate"> - <el-date-picker v-model="form.beginEndDate" type="daterange" range-separator="鍒�" format="YYYY-MM-DD" - value-format="YYYY-MM-DD" start-placeholder="鐢熸晥寮�濮嬫棩鏈�" end-placeholder="鐢熸晥缁撴潫鏃ユ湡" style="width: 100%" /> + <el-date-picker + v-model="form.beginEndDate" + type="daterange" + range-separator="鍒�" + format="YYYY-MM-DD" + value-format="YYYY-MM-DD" + start-placeholder="鐢熸晥寮�濮嬫棩鏈�" + end-placeholder="鐢熸晥缁撴潫鏃ユ湡" + style="width: 100%" + /> </el-form-item> </el-col> <el-col :span="24"> @@ -79,45 +97,89 @@ </el-row> <el-row v-for="(item, index) in formChild.data" :key="item.id"> <el-col :span="4"> - <el-form-item label="绫诲埆鍚嶇О" :prop="'data.' + index + '.type'" :rules="{ - required: true, - message: '绫诲埆鍚嶇О涓嶈兘涓虹┖', - trigger: ['change'], - }"> + <el-form-item + label="绫诲埆鍚嶇О" + :prop="'data.' + index + '.type'" + :rules="{ + required: true, + message: '绫诲埆鍚嶇О涓嶈兘涓虹┖', + trigger: ['change'], + }" + > <el-select v-model="item.type" placeholder="绫诲埆鍚嶇О" clearable style="width: 100%"> - <el-option v-for="dict in electricity_price" :key="dict.value" :label="dict.label" - :value="dict.value" /> + <el-option + v-for="dict in electricity_price" + :key="dict.value" + :label="dict.label" + :value="dict.value" + /> </el-select> </el-form-item> </el-col> <el-col :span="4"> - <el-form-item label="鏃舵鐢典环" :prop="'data.' + index + '.effecticityPrice'" :rules="{ - required: true, - message: '鏃舵鐢典环涓嶈兘涓虹┖', - trigger: ['blur', 'change'], - }"> - <el-input-number v-model="item.effecticityPrice" :min="0.0" :precision="2" :step="0.1" - placeholder="鏃舵鐢典环" style="width: 100%" controls-position="right" /> + <el-form-item + label="鏃舵鐢典环" + :prop="'data.' + index + '.effecticityPrice'" + :rules="{ + required: true, + message: '鏃舵鐢典环涓嶈兘涓虹┖', + trigger: ['blur', 'change'], + }" + > + <el-input-number + v-model="item.effecticityPrice" + :min="0.0" + :precision="2" + :step="0.1" + placeholder="鏃舵鐢典环" + style="width: 100%" + controls-position="right" + /> </el-form-item> </el-col> <el-col :span="4"> - <el-form-item label="寮�濮嬫椂闂�" :prop="'data.' + index + '.startTime'" :rules="{ - required: true, - message: '寮�濮嬫椂闂翠笉鑳戒负绌�', - trigger: ['blur', 'change'], - }"> - <el-time-select v-model="item.startTime" placeholder="寮�濮嬫椂闂�" :max-time="item.stopTime" start="00:00:00" - step="00:30:00" end="24:00:00" style="width: 100%" format="HH:mm:00" /> + <el-form-item + label="寮�濮嬫椂闂�" + :prop="'data.' + index + '.startTime'" + :rules="{ + required: true, + message: '寮�濮嬫椂闂翠笉鑳戒负绌�', + trigger: ['blur', 'change'], + }" + > + <el-time-select + v-model="item.startTime" + placeholder="寮�濮嬫椂闂�" + :max-time="item.stopTime" + start="00:00:00" + step="00:30:00" + end="24:00:00" + style="width: 100%" + format="HH:mm:00" + /> </el-form-item> </el-col> <el-col :span="4"> - <el-form-item label="缁撴潫鏃堕棿" :prop="'data.' + index + '.stopTime'" :rules="{ - required: true, - message: '缁撴潫鏃堕棿涓嶈兘涓虹┖', - trigger: ['blur', 'change'], - }"> - <el-time-select v-model="item.stopTime" placeholder="缁撴潫鏃堕棿" :min-time="item.startTime" start="00:00:00" - step="00:30:00" end="24:00:00" style="width: 100%" format="HH:mm:00" :disabled="item.startTime==null" /> + <el-form-item + label="缁撴潫鏃堕棿" + :prop="'data.' + index + '.stopTime'" + :rules="{ + required: true, + message: '缁撴潫鏃堕棿涓嶈兘涓虹┖', + trigger: ['blur', 'change'], + }" + > + <el-time-select + v-model="item.stopTime" + placeholder="缁撴潫鏃堕棿" + :min-time="item.startTime" + start="00:00:00" + step="00:30:00" + end="24:00:00" + style="width: 100%" + format="HH:mm:00" + :disabled="item.startTime == null" + /> </el-form-item> </el-col> <el-col :span="4"> @@ -127,11 +189,14 @@ </el-col> <el-col :span="4"> <el-form-item> - <el-button link type="primary" icon="Plus" @click="handleAddChildChild"> - 鏂板 - </el-button> - <el-button link type="primary" icon="Delete" @click="handleDeleteChildChild(item, index)" - v-if="formChild.data.length > 1"> + <el-button link type="primary" icon="Plus" @click="handleAddChildChild"> 鏂板 </el-button> + <el-button + link + type="primary" + icon="Delete" + @click="handleDeleteChildChild(item, index)" + v-if="formChild.data.length > 1" + > 鍒犻櫎 </el-button> </el-form-item> @@ -157,18 +222,18 @@ delPeakValleyConfiguration, listPeakValleyConfigurationChild, updatePeakValleyConfigurationChild, -} from "@/api/modelConfiguration/setPeakValley"; -import { nanoid } from "nanoid"; -const { proxy } = getCurrentInstance(); -const { electricity_price } = proxy.useDict("electricity_price"); -const productoutputList = ref([]); -const open = ref(false); -const loading = ref(false); -const showSearch = ref(true); -const title = ref(""); -const loadingChild = ref(true); -const openChild = ref(false); -const titleChild = ref(""); +} from "@/api/modelConfiguration/setPeakValley" +import { nanoid } from "nanoid" +const { proxy } = getCurrentInstance() +const { electricity_price } = proxy.useDict("electricity_price") +const productoutputList = ref([]) +const open = ref(false) +const loading = ref(false) +const showSearch = ref(true) +const title = ref("") +const loadingChild = ref(true) +const openChild = ref(false) +const titleChild = ref("") const data = reactive({ form: {}, queryParams: { @@ -195,82 +260,80 @@ }, ], }, -}); +}) -const { queryParams, form, rules, formChild } = toRefs(data); -getList(); +const { queryParams, form, rules, formChild } = toRefs(data) +getList() // 妯″瀷閰嶇疆绠$悊-灏栧嘲骞宠胺閰嶇疆-鍒楄〃 function getList() { - loading.value = true; - listPeakValleyConfiguration(proxy.addDateRange(queryParams.value)).then( - (res) => { - loading.value = false; - productoutputList.value = res.rows; - queryParams.value.total = res.total; - } - ); + loading.value = true + listPeakValleyConfiguration(proxy.addDateRange(queryParams.value)).then((res) => { + loading.value = false + productoutputList.value = res.rows + queryParams.value.total = res.total + }) } // 妯″瀷閰嶇疆绠$悊-灏栧嘲骞宠胺閰嶇疆-鎼滅储 function handleQuery() { - queryParams.value.pageNum = 1; - getList(); + queryParams.value.pageNum = 1 + getList() } // 妯″瀷閰嶇疆绠$悊-灏栧嘲骞宠胺閰嶇疆-閲嶇疆 function resetQuery() { - proxy.resetForm("queryRef"); - (queryParams.value = { + proxy.resetForm("queryRef") + ;(queryParams.value = { pageNum: 1, pageSize: 10, timeType: "YEAR", dataTime: null, total: 0, }), - handleQuery(); + handleQuery() } // 妯″瀷閰嶇疆绠$悊-灏栧嘲骞宠胺閰嶇疆-鏂板 function handleAdd() { - reset(); - open.value = true; - title.value = "鏂板灏栧嘲骞宠胺鏃舵閰嶇疆"; + reset() + open.value = true + title.value = "鏂板灏栧嘲骞宠胺鏃舵閰嶇疆" } // 妯″瀷閰嶇疆绠$悊-灏栧嘲骞宠胺閰嶇疆-缂栬緫 function handleUpdate(row) { - reset(); + reset() getPeakValleyConfiguration(row.id).then((response) => { - form.value = response.data; - form.value.beginEndDate = [response.data.beginDate, response.data.endDate]; - open.value = true; - title.value = "缂栬緫灏栧嘲骞宠胺鏃舵閰嶇疆"; - }); + form.value = response.data + form.value.beginEndDate = [response.data.beginDate, response.data.endDate] + open.value = true + title.value = "缂栬緫灏栧嘲骞宠胺鏃舵閰嶇疆" + }) } // 妯″瀷閰嶇疆绠$悊-灏栧嘲骞宠胺閰嶇疆-鏂板/缂栬緫-淇濆瓨 function submitForm() { proxy.$refs["formRef"].validate((valid) => { if (valid) { - form.value.beginDate = form.value.beginEndDate[0]; - form.value.endDate = form.value.beginEndDate[1]; - delete form.value.beginEndDate; + form.value.beginDate = form.value.beginEndDate[0] + form.value.endDate = form.value.beginEndDate[1] + delete form.value.beginEndDate if (form.value.id != undefined) { updatePeakValleyConfiguration(form.value).then((response) => { - proxy.$modal.msgSuccess("淇敼鎴愬姛"); - open.value = false; - getList(); - }); + proxy.$modal.msgSuccess("淇敼鎴愬姛") + open.value = false + getList() + }) } else { addPeakValleyConfiguration(form.value).then((response) => { - proxy.$modal.msgSuccess("鏂板鎴愬姛"); - open.value = false; - getList(); - }); + proxy.$modal.msgSuccess("鏂板鎴愬姛") + open.value = false + getList() + }) } } - }); + }) } // 妯″瀷閰嶇疆绠$悊-灏栧嘲骞宠胺閰嶇疆-鏂板/缂栬緫-鍙栨秷 function cancel() { - open.value = false; - proxy.$refs.formRef.resetFields(); - reset(); + open.value = false + proxy.$refs.formRef.resetFields() + reset() } // 妯″瀷閰嶇疆绠$悊-灏栧嘲骞宠胺閰嶇疆-鏂板/缂栬緫-琛ㄥ崟閲嶇疆 function reset() { @@ -278,88 +341,80 @@ beginDate: null, endDate: null, remark: null, - }; + } } // 妯″瀷閰嶇疆绠$悊-灏栧嘲骞宠胺閰嶇疆-鍒犻櫎 function handleDelete(row) { proxy.$modal - .confirm( - '鏄惁纭鍒犻櫎鐢熸晥鏃ユ湡涓�"' + - row.beginDate + - "鍒�" + - row.endDate + - '"鐨勬暟鎹」锛�' - ) + .confirm('鏄惁纭鍒犻櫎鐢熸晥鏃ユ湡涓�"' + row.beginDate + "鍒�" + row.endDate + '"鐨勬暟鎹」锛�') .then(function () { - return delPeakValleyConfiguration(row.id); + return delPeakValleyConfiguration(row.id) }) .then(() => { - getList(); - proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛"); + getList() + proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛") }) - .catch(() => { }); + .catch(() => {}) } // 妯″瀷閰嶇疆绠$悊-灏栧嘲骞宠胺閰嶇疆-鏃舵鐢典环閰嶇疆-鏂板 function handleExpandChange(row) { - formChild.value.parentId = row.id; - formChild.value.beginEndDate = [row.beginDate, row.endDate]; - formChild.value.beginDate = row.beginDate; - formChild.value.endDate = row.endDate; + formChild.value.parentId = row.id + formChild.value.beginEndDate = [row.beginDate, row.endDate] + formChild.value.beginDate = row.beginDate + formChild.value.endDate = row.endDate listPeakValleyConfigurationChild( proxy.addDateRange({ parentId: row.id, }) ).then((res) => { - loadingChild.value = false; + loadingChild.value = false formChild.value.data = res.rows.length > 0 ? res.rows : [ - { - parentId: row.id, - type: null, - startTime: null, - stopTime: null, - effecticityPrice: 0.0, - }, - ]; - }); - openChild.value = true; - titleChild.value = "灏栧嘲骞宠胺鏃舵鐢典环閰嶇疆"; + { + parentId: row.id, + type: null, + startTime: null, + stopTime: null, + effecticityPrice: 0.0, + }, + ] + }) + openChild.value = true + titleChild.value = "灏栧嘲骞宠胺鏃舵鐢典环閰嶇疆" } function handleAddChildChild() { - console.log(formChild.value); + console.log(formChild.value) formChild.value.data.push({ parentId: formChild.value.parentId, type: null, startTime: null, stopTime: null, effecticityPrice: 0.0, - }); - openChild.value = true; - titleChild.value = "灏栧嘲骞宠胺鏃舵鐢典环閰嶇疆"; + }) + openChild.value = true + titleChild.value = "灏栧嘲骞宠胺鏃舵鐢典环閰嶇疆" } function handleDeleteChildChild(item, index) { - formChild.value.data.splice(index, 1); + formChild.value.data.splice(index, 1) } // 妯″瀷閰嶇疆绠$悊-灏栧嘲骞宠胺閰嶇疆-鏃舵鐢典环閰嶇疆-鏂板/缂栬緫-淇濆瓨 function submitFormChild() { proxy.$refs["formChildRef"].validate((valid) => { if (valid) { - updatePeakValleyConfigurationChild(formChild.value.data).then( - (response) => { - proxy.$modal.msgSuccess("淇敼鎴愬姛"); - openChild.value = false; - getList(); - } - ); + updatePeakValleyConfigurationChild(formChild.value.data).then((response) => { + proxy.$modal.msgSuccess("淇敼鎴愬姛") + openChild.value = false + getList() + }) } - }); + }) } // 妯″瀷閰嶇疆绠$悊-灏栧嘲骞宠胺閰嶇疆-鏂板/缂栬緫-鍙栨秷 function cancelChild() { - openChild.value = false; - proxy.$refs.formChildRef.resetFields(); + openChild.value = false + proxy.$refs.formChildRef.resetFields() } </script> <style scoped lang="scss"> diff --git a/zhitan-vue/src/views/policy/knowledgebase/knowledgeBase.vue b/zhitan-vue/src/views/policy/knowledgebase/knowledgeBase.vue index ac9cc39..58a9c47 100644 --- a/zhitan-vue/src/views/policy/knowledgebase/knowledgeBase.vue +++ b/zhitan-vue/src/views/policy/knowledgebase/knowledgeBase.vue @@ -3,26 +3,24 @@ <div class="form-card"> <el-form :model="queryParams" ref="queryRef" :inline="true" label-width="120px"> <el-form-item label="鏍囬"> - <el-input v-model="queryParams.title" placeholder="璇疯緭鍏ユ爣棰�" clearable/> + <el-input v-model="queryParams.title" placeholder="璇疯緭鍏ユ爣棰�" clearable /> </el-form-item> <el-form-item label="鑳芥簮绫诲瀷"> - <el-select v-model="queryParams.type" placeholder="璇烽�夋嫨鑳芥簮绫诲瀷" style="width: 100%" clearable> - <el-option v-for="dict in types" :key="dict.value" - :label="dict.label" :value="dict.value" /> - </el-select> - </el-form-item> + <el-select v-model="queryParams.type" placeholder="璇烽�夋嫨鑳芥簮绫诲瀷" style="width: 100%" clearable> + <el-option v-for="dict in types" :key="dict.value" :label="dict.label" :value="dict.value" /> + </el-select> + </el-form-item> <el-form-item> <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button> <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> + </el-form-item> + <el-form-item style="float: right"> + <el-button type="primary" icon="plus" @click="handleAdd">鏂板</el-button> </el-form-item> </el-form> </div> <div class="table-bg-style"> - <div class="theme-dark-mt20 mb20 ml20"> - <el-button type="primary" icon="plus" @click="handleAdd">鏂板</el-button> - <!-- <el-button type="primary" icon="Delete">鍒犻櫎</el-button> --> - </div> <div class="table-box"> <el-table :data="tableData" v-loading="loading"> <el-table-column prop="title" label="鏍囬" show-overflow-tooltip align="center" /> @@ -46,26 +44,26 @@ /> </div> </div> - <edit-modal ref="EditModalRef" @getList="getList" :types="types" /> + <edit-modal ref="EditModalRef" @getList="getList" :types="types" /> </div> </template> <script setup> - import EditModal from "./components/EditModal.vue" -import { knowledgeBaseList, knowledgeBaseDel,knowledgeBaseInfo } from "@/api/policy/knowledgeBase" +import EditModal from "./components/EditModal.vue" +import { knowledgeBaseList, knowledgeBaseDel, knowledgeBaseInfo } from "@/api/policy/knowledgeBase" let { proxy } = getCurrentInstance() const types = ref([ { label: "鐢�", value: 0 }, { label: "姘�", value: 1 }, { label: "澶╃劧姘�", value: 2 }, { label: "钂告苯", value: 3 }, -]); +]) let loading = ref(false) let total = ref(0) let tableData = ref([]) let queryParams = ref({ title: "", - type:null, + type: null, pageNum: 1, pageSize: 10, }) @@ -85,14 +83,13 @@ let EditModalRef = ref("") function handleAdd(row) { if (EditModalRef.value) { - if(row.id){ + if (row.id) { knowledgeBaseInfo(row.id).then((res) => { EditModalRef.value.handleOpen(res.data) }) - }else{ + } else { EditModalRef.value.handleOpen(row) } - } } @@ -117,7 +114,7 @@ function resetQuery() { queryParams.value = { title: "", - type:null, + type: null, pageNum: 1, pageSize: 10, } diff --git a/zhitan-vue/src/views/powerquality/threephase/index.vue b/zhitan-vue/src/views/powerquality/threephase/index.vue index 496c460..3e723a1 100644 --- a/zhitan-vue/src/views/powerquality/threephase/index.vue +++ b/zhitan-vue/src/views/powerquality/threephase/index.vue @@ -39,13 +39,7 @@ /> </el-form-item> <el-form-item label="閫夋嫨鐢佃〃" prop="meterId"> - <el-select - v-model="queryParams.meterId" - placeholder="閫夋嫨鐢佃〃" - clearable - style="width: 200px" - @change="handleTimeType" - > + <el-select v-model="queryParams.meterId" placeholder="閫夋嫨鐢佃〃" clearable style="width: 200px"> <el-option v-for="dict in electricityMeter" :key="dict.value" @@ -64,7 +58,7 @@ </div> <div style="padding: 0 16px"> - <el-tabs v-model="activeTabKey" type="card"> + <el-tabs v-model="activeTabKey" type="card" @tab-change="handleTabChange" style="margin-top: 12px"> <el-tab-pane label="鐢靛帇涓嶅钩琛�" name="1"> </el-tab-pane> <el-tab-pane label="鐢垫祦涓嶅钩琛�" name="2"> </el-tab-pane> </el-tabs> @@ -80,7 +74,7 @@ <div class="chart-box" v-loading="loading" v-show="activeKey === 1"> <LineChart ref="LineChartRef" :chartData="lineChartData" /> - <el-table :data="tableData1" v-loading="loading"> + <el-table :data="tableData1" v-loading="loading" style="padding: 14px"> <el-table-column label="绫诲瀷" prop="type" align="center" /> <el-table-column label="涓夐」涓嶅钩琛℃瀬鍊�" prop="value" align="center" /> <el-table-column label="鍙戠敓鏃堕棿" prop="time" align="center" /> @@ -225,6 +219,11 @@ function handleTimeType(e) { queryParams.value.timeType = e queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD") + getList() +} + +function handleTabChange(e) { + getList() } function switchBtnType(e) { @@ -235,6 +234,13 @@ } // 鍒楄〃 function getList() { + if (!queryParams.value.meterId) { + // proxy.$message({ + // message: "璇烽�夋嫨鑺傜偣", + // type: "warning", + // }) + return + } loading.value = true let params = { nodeId: queryParams.value.nodeId, -- Gitblit v1.9.3