From 5d36e1f987ef21e44ded2e8a1d06c28094ec1e76 Mon Sep 17 00:00:00 2001 From: baoshiwei <baoshiwei@shlanbao.cn> Date: 星期六, 19 四月 2025 12:39:47 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' --- zhitan-vue/src/views/keyEquipment/daily/index.vue | 232 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 232 insertions(+), 0 deletions(-) diff --git a/zhitan-vue/src/views/keyEquipment/daily/index.vue b/zhitan-vue/src/views/keyEquipment/daily/index.vue new file mode 100644 index 0000000..055037a --- /dev/null +++ b/zhitan-vue/src/views/keyEquipment/daily/index.vue @@ -0,0 +1,232 @@ +<template> + <div class="page"> + <div class="form-card"> + <el-form :model="queryParams" ref="queryRef" :inline="true" label-width="68px"> + <!-- <el-form-item label="閲嶇偣璁惧" prop="energyType"> + <el-select v-model="queryParams.energyType" placeholder="璇烽�夋嫨閲嶇偣璁惧"> + <el-option :label="item.name" :value="item.id" v-for="item in facilityList" :key="item.id" /> + </el-select> + </el-form-item> --> + <el-form-item label="鑳芥簮绫诲瀷" prop="energyType"> + <el-select v-model="queryParams.energyType" placeholder="璇烽�夋嫨鑳芥簮绫诲瀷"> + <el-option + :label="item.enername" + :value="item.enersno" + v-for="item in energyTypeList" + :key="item.enersno" + /> + </el-select> + </el-form-item> + <el-form-item label="缁熻鏃堕棿"> + <el-date-picker + v-model="queryParams.dataTime" + type="date" + format="YYYY-MM-DD" + value-format="YYYY-MM-DD" + placeholder="閫夋嫨鏃ユ湡" + style="width: 100%" + :clearable="false" + /> + </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> + <el-button type="warning" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button> + </el-form-item> --> + </el-form> + </div> + + <div class="table-bg-style" style="padding-bottom: 12px"> + <div class="table-box"> + <el-table :data="energyList" v-loading="loading" border max-height="380px"> + <el-table-column fixed prop="indexName" label="鎸囨爣鍚嶇О" width="210px"> + <template #default="scope"> + <div style="width: 100%; text-align: left"> + <el-button + v-if="scope.row.indexId == queryParams.indexId" + icon="search" + circle + @click="selectChange(scope.row)" + style="color: #fff; background: #409eff; margin-right: 8px" + ></el-button> + <el-button + v-else + icon="search" + circle + @click="selectChange(scope.row)" + style="margin-right: 8px" + ></el-button> + <el-tooltip + v-if="scope.row.indexName && scope.row.indexName.length > 9" + class="item" + effect="dark" + :content="scope.row.indexName" + placement="top-end" + > + <span> + {{ scope.row.indexName.substr(0, 9) + "..." }} + </span> + </el-tooltip> + <span v-else>{{ scope.row.indexName }}</span> + </div> + </template> + </el-table-column> + <el-table-column v-for="index in 24" :key="index" :label="index - 1 + '鏃�'" align="center" min-width="100"> + <template #default="scope">{{ numFilter(scope.row[`value${index - 1}`]) }}</template> + </el-table-column> + </el-table> + + <div> + <line-chart ref="LineChartRef" :chartData="lineChartData" /> + </div> + </div> + </div> + </div> +</template> + +<script setup> +import { listEnergyTypeList } from "@/api/modelConfiguration/energyType" +import keyEquipmentApi from "@/api/keyEquipment/api" +import LineChart from "../comps/LineChart.vue" +let { proxy } = getCurrentInstance() +const facilityList = ref([]) +function getEquip() { + keyEquipmentApi.getPointFacility().then((res) => { + facilityList.value = res.data + }) +} +getEquip() + +const energyTypeList = ref() +function getEnergyTypeList() { + listEnergyTypeList().then((res) => { + energyTypeList.value = res.data + // form.value.indexType = alarm_record_category.value[0].value + // form.value.energyType = energyTypeList.value[0].enersno + getList() + }) +} +getEnergyTypeList() +function numFilter(value) { + // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅 + let realVal = "" + if (!isNaN(value) && value !== "" && value !== null) { + realVal = parseFloat(value).toFixed(2) + } else { + realVal = "--" + } + return realVal +} +let loading = ref(false) +let total = ref(0) +let queryParams = ref({ + indexStorageId: "", + indexCode: "", + pageNum: 1, + pageSize: 10, + dataTime: "", +}) + +const energyList = ref([]) +const lineChartData = ref({}) +function getList() { + queryParams.value.indexCode = proxy.$route.query.modelCode + keyEquipmentApi + .dailyList({ + ...queryParams.value, + timeType: "HOUR", + }) + .then((response) => { + energyList.value = response.data + if (response.data && response.data.length !== 0) { + selectChange(response.data[0]) + } else { + lineChartData.value = {} + } + }) +} + +const LineChartRef = ref() +function selectChange(row) { + queryParams.value.indexId = row ? row.indexId : undefined + queryParams.value.timeType = "HOUR" + keyEquipmentApi.dailyChart(queryParams.value).then((response) => { + let actualData = [] + let expectedData = [] + let title = "" + response.data.forEach((item) => { + expectedData.push(numFilter(item.value)) + actualData.push(item.timeCode.slice(item.timeCode.length - 2, item.timeCode.length) + "鏃�") + title = item.indexName + "(" + (item.unitId || "") + ")" + }) + + console.log(response) + console.log(actualData) + console.log(expectedData) + + lineChartData.value = { + xData: actualData, + yData: expectedData, + title, + } + // LineChartRef.value.initChart() + // this.lineChartData.actualData = actualData; + // this.lineChartData.expectedData = expectedData; + // this.lineChartData.title = title; + // this.$refs.LineChart.initChart(this.lineChartData); + // this.$refs.BarChart.initChart(this.lineChartData); + }) +} + +function getTime() { + var date = new Date() + var year = date.getFullYear() + var month = date.getMonth() + 1 + var date = date.getDate() + month = month < 10 ? "0" + month : month + date = date < 10 ? "0" + date : date + queryParams.value.dataTime = year + "-" + month + "-" + date +} +getTime() + +// 瀵煎嚭鎸夐挳鎿嶄綔 +function handleExport() { + exportList(queryParams.value).then((response) => { + console.log(response) + // download(response.msg); + }) +} + +function handleQuery() { + queryParams.value.pageNum = 1 + getList() +} + +function resetQuery() { + queryParams.value = { + limitName: "", + pageNum: 1, + pageSize: 10, + dataTime: null, + } + getTime() + getList() +} +</script> + +<style lang="scss" scoped> +@import "@/assets/styles/page.scss"; + +.header-box { + :deep .el-form-item__content { + color: #fff; + font-size: 16px; + } +} + +:deep .el-table--fit { + border-bottom: 1px solid #eaeaea; +} +</style> -- Gitblit v1.9.3