修改样式

ali

2025-02-25 36c2e8cec30b75cce353973f2f1e0d048e4e45fe

修改样式

 zhitan-vue/src/views/businessconfiguration/prealarmmanage/components/collectionpointmanage/CollectionPointManage.vue

@@ -1,6 +1,6 @@
<template>
  <div class="table-box">
    <div class="form-card">
    <div class="form-card" style="padding: 16px 16px 0 16px">
      <el-form :model="queryParams" ref="queryRef" :inline="true">
        <el-form-item label="采集点名称">
          <el-input v-model="queryParams.name" placeholder="请输入采集点名称" maxlength="30" />
@@ -9,9 +9,7 @@
          <el-input v-model="queryParams.code" placeholder="请输入采集点编码" maxlength="30" />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="Search" @click="getTabList">
            搜索
          </el-button>
          <el-button type="primary" icon="Search" @click="getTabList"> 搜索 </el-button>
          <el-button icon="Refresh" @click="resetQuery">重置</el-button>
        </el-form-item>
        <el-form-item>
@@ -24,28 +22,37 @@
        </el-form-item>
      </el-form>
    </div>
    <el-table v-loading="loading" row-key="indexId" :data="tableData" @selection-change="handleSelectionChange"
      height="calc(100vh - 430px)" :default-sort="{ prop: 'date', order: 'descending' }">
    <el-table
      v-loading="loading"
      row-key="indexId"
      :data="tableData"
      @selection-change="handleSelectionChange"
      height="calc(100vh - 430px)"
      :default-sort="{ prop: 'date', order: 'descending' }"
    >
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="采集点名称" align="center" prop="name" />
      <el-table-column label="采集点编码" align="center" prop="code" />
      <el-table-column label="启停状态" align="center" prop="indexCategory" />
      <el-table-column label="操作" width="150" align="center">
        <template #default="scope">
          <el-button link type="primary" @click="handleAlarm(scope.row)">
            报警
          </el-button>
          <el-button link type="primary" @click="handleAlarm(scope.row)"> 报警 </el-button>
        </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="getTabList" />
    <pagination
      v-show="queryParams.total > 0"
      :total="queryParams.total"
      v-model:page="queryParams.pageNum"
      v-model:limit="queryParams.pageSize"
      @pagination="getTabList"
    />
    <CollectAlarmModal ref="collectAlarmModalRef" />
  </div>
</template>
<script setup>
import CollectAlarmModal from './CollectAlarmModal.vue'
import { getSettingIndex, getStartStop, getSettingCount, updateSet } from '@/api/businessConfiguration/preAlarmManage'
import CollectAlarmModal from "./CollectAlarmModal.vue"
import { getSettingIndex, getStartStop, getSettingCount, updateSet } from "@/api/businessConfiguration/preAlarmManage"

let { proxy } = getCurrentInstance()
const data = reactive({
@@ -57,8 +64,8 @@
    pageSize: 10,
    total: 0,
  },
});
const { queryParams } = toRefs(data);
})
const { queryParams } = toRefs(data)
let ids = ref([])
let names = ref([])
let single = ref(true)
@@ -73,41 +80,40 @@
function getList(modelNode) {
  currentNode.value = modelNode
  queryParams.value.nodeId = modelNode.id
  queryParams.value.indexType = 'COLLECT',
    getTabList()
  ;(queryParams.value.indexType = "COLLECT"), getTabList()
}
function getTabList() {
  loading.value = true;
  getSettingIndex(queryParams.value).then(res => {
    tableData.value = res.data.records;
  loading.value = true
  getSettingIndex(queryParams.value).then((res) => {
    tableData.value = res.data.records
    queryParams.value.total = res.data.total
    loading.value = false;
    loading.value = false
    initStartStop()
  })
}
function resetQuery() {
  proxy.resetForm("queryRef");
  queryParams.value.code = null;
  queryParams.value.name = null;
  queryParams.value.pageNum = 1;
  queryParams.value.pageSize = 10;
  queryParams.value.total = 0;
  getTabList();
  proxy.resetForm("queryRef")
  queryParams.value.code = null
  queryParams.value.name = null
  queryParams.value.pageNum = 1
  queryParams.value.pageSize = 10
  queryParams.value.total = 0
  getTabList()
}
function initStartStop() {
  for (let i = 0; i < tableData.value.length; i++) {
    let ndy = ''
    getStartStop(tableData.value[i].indexId).then(response => {
      if (response.code == '200') {
        if (response.msg == '1') {
          tableData.value[i].indexCategory = '启动'
        } else if (response.msg == '2') {
          tableData.value[i].indexCategory = '停止'
    let ndy = ""
    getStartStop(tableData.value[i].indexId).then((response) => {
      if (response.code == "200") {
        if (response.msg == "1") {
          tableData.value[i].indexCategory = "启动"
        } else if (response.msg == "2") {
          tableData.value[i].indexCategory = "停止"
        } else {
          tableData.value[i].indexCategory = '尚未设置'
          tableData.value[i].indexCategory = "尚未设置"
        }
      } else {
        tableData.value[i].indexCategory = ''
        tableData.value[i].indexCategory = ""
      }
    })
  }
@@ -120,22 +126,22 @@

// 多选框选中数据
function handleSelectionChange(selection) {
  ids.value = selection.map(item => item.indexId)
  names.value = selection.map(item => item.name)
  ids.value = selection.map((item) => item.indexId)
  names.value = selection.map((item) => item.name)
  single.value = selection.length !== 1
  multiple.value = !selection.length
  startStopOptions.value = selection.map(item => item.indexCategory)
  codeOptions.value = selection.map(item => item.code)
  startStopOptions.value = selection.map((item) => item.indexCategory)
  codeOptions.value = selection.map((item) => item.code)
}

function handleUpdateState(flag) {
  let stateName = ''
  if (flag == '1') {
    stateName = '启动'
  let stateName = ""
  if (flag == "1") {
    stateName = "启动"
  } else {
    stateName = '停止'
    stateName = "停止"
  }
  getSettingCount(ids.value).then(response => {
  getSettingCount(ids.value).then((response) => {
    let unStartStopArrName = []
    let startStopArrIds = []
    for (let i = 0; i < response.data.length; i++) {
@@ -146,19 +152,20 @@
      }
    }
    if (unStartStopArrName.length > 0) {
      var bh = unStartStopArrName.join('，')
      proxy.$modal.confirm('选中存在未设置限值的仪器设备' + bh + '，暂无法' + stateName + '！', '警告', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).catch(function () {
      })
      var bh = unStartStopArrName.join("，")
      proxy.$modal
        .confirm("选中存在未设置限值的仪器设备" + bh + "，暂无法" + stateName + "！", "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
        .catch(function () {})
    } else {
      if (startStopArrIds.length > 0) {
        updateSet(startStopArrIds || '', flag).then(response => {
        updateSet(startStopArrIds || "", flag).then((response) => {
          if (response.code === 200) {
            initStartStop()
            proxy.$modal.msgSuccess('成功')
            proxy.$modal.msgSuccess("成功")
          } else {
            proxy.$modal.msgError(response.msg)
          }
@@ -168,8 +175,8 @@
  })
}
defineExpose({
  getList
});
  getList,
})
</script>

<style lang='scss' scoped></style>
<style lang="scss" scoped></style>

 zhitan-vue/src/views/businessconfiguration/prealarmmanage/components/statisticalindicatorsmanage/StatisticalIndicatorsManage.vue

@@ -1,6 +1,6 @@
<template>
  <div class="table-box">
    <div class="form-card">
    <div class="form-card" style="padding: 16px 16px 0 16px">
      <el-form :model="queryParams" ref="queryRef" :inline="true">
        <el-form-item label="采集点名称">
          <el-input v-model="queryParams.name" placeholder="请输入采集点名称" maxlength="30" />
@@ -9,9 +9,7 @@
          <el-input v-model="queryParams.code" placeholder="请输入采集点编码" maxlength="30" />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="Search" @click="getTabList">
            搜索
          </el-button>
          <el-button type="primary" icon="Search" @click="getTabList"> 搜索 </el-button>
          <el-button icon="Refresh" @click="resetQuery">重置</el-button>
        </el-form-item>
        <el-form-item>
@@ -24,29 +22,38 @@
        </el-form-item>
      </el-form>
    </div>
    <el-table v-loading="loading" row-key="indexId" ref="tableRef" :data="tableData"
      @selection-change="handleSelectionChange" height="calc(100vh - 430px)"
      :default-sort="{ prop: 'date', order: 'descending' }">
    <el-table
      v-loading="loading"
      row-key="indexId"
      ref="tableRef"
      :data="tableData"
      @selection-change="handleSelectionChange"
      height="calc(100vh - 430px)"
      :default-sort="{ prop: 'date', order: 'descending' }"
    >
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="采集点名称" align="center" prop="name" />
      <el-table-column label="采集点编码" align="center" prop="code" />
      <el-table-column label="启停状态" align="center" prop="indexCategory" />
      <el-table-column label="操作" width="150" align="center">
        <template #default="scope">
          <el-button link type="primary" @click="handleAlarm(scope.row)">
            报警
          </el-button>
          <el-button link type="primary" @click="handleAlarm(scope.row)"> 报警 </el-button>
        </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="getTabList" />
    <pagination
      v-show="queryParams.total > 0"
      :total="queryParams.total"
      v-model:page="queryParams.pageNum"
      v-model:limit="queryParams.pageSize"
      @pagination="getTabList"
    />
    <StatisticsAlarmModal ref="statisticsAlarmModalRef" />
  </div>
</template>
<script setup>
import StatisticsAlarmModal from './StatisticsAlarmModal.vue'
import { getSettingIndex, getStartStop, getSettingCount, updateSet } from '@/api/businessConfiguration/preAlarmManage'
import StatisticsAlarmModal from "./StatisticsAlarmModal.vue"
import { getSettingIndex, getStartStop, getSettingCount, updateSet } from "@/api/businessConfiguration/preAlarmManage"

let { proxy } = getCurrentInstance()
const data = reactive({
@@ -58,8 +65,8 @@
    pageSize: 10,
    total: 0,
  },
});
const { queryParams } = toRefs(data);
})
const { queryParams } = toRefs(data)
let ids = ref([])
let names = ref([])
let single = ref(true)
@@ -73,41 +80,40 @@
function getList(modelNode) {
  currentNode.value = modelNode
  queryParams.value.nodeId = modelNode.id
  queryParams.value.indexType = 'STATISTIC',
    getTabList()
  ;(queryParams.value.indexType = "STATISTIC"), getTabList()
}
function getTabList() {
  loading.value = true;
  getSettingIndex(queryParams.value).then(res => {
    tableData.value = res.data.records;
  loading.value = true
  getSettingIndex(queryParams.value).then((res) => {
    tableData.value = res.data.records
    queryParams.value.total = res.data.total
    loading.value = false;
    loading.value = false
    initStartStop()
  })
}
function resetQuery() {
  proxy.resetForm("queryRef");
  queryParams.value.code = null;
  queryParams.value.name = null;
  queryParams.value.pageNum = 1;
  queryParams.value.pageSize = 10;
  queryParams.value.total = 0;
  getTabList();
  proxy.resetForm("queryRef")
  queryParams.value.code = null
  queryParams.value.name = null
  queryParams.value.pageNum = 1
  queryParams.value.pageSize = 10
  queryParams.value.total = 0
  getTabList()
}
function initStartStop() {
  for (let i = 0; i < tableData.value.length; i++) {
    let ndy = ''
    getStartStop(tableData.value[i].indexId).then(response => {
      if (response.code == '200') {
        if (response.msg == '1') {
          tableData.value[i].indexCategory = '启动'
        } else if (response.msg == '2') {
          tableData.value[i].indexCategory = '停止'
    let ndy = ""
    getStartStop(tableData.value[i].indexId).then((response) => {
      if (response.code == "200") {
        if (response.msg == "1") {
          tableData.value[i].indexCategory = "启动"
        } else if (response.msg == "2") {
          tableData.value[i].indexCategory = "停止"
        } else {
          tableData.value[i].indexCategory = '尚未设置'
          tableData.value[i].indexCategory = "尚未设置"
        }
      } else {
        tableData.value[i].indexCategory = ''
        tableData.value[i].indexCategory = ""
      }
    })
  }
@@ -120,22 +126,22 @@

// 多选框选中数据
function handleSelectionChange(selection) {
  ids.value = selection.map(item => item.indexId)
  names.value = selection.map(item => item.name)
  ids.value = selection.map((item) => item.indexId)
  names.value = selection.map((item) => item.name)
  single.value = selection.length !== 1
  multiple.value = !selection.length
  startStopOptions.value = selection.map(item => item.indexCategory)
  codeOptions.value = selection.map(item => item.code)
  startStopOptions.value = selection.map((item) => item.indexCategory)
  codeOptions.value = selection.map((item) => item.code)
}

function handleUpdateState(flag) {
  let stateName = ''
  if (flag == '1') {
    stateName = '启动'
  let stateName = ""
  if (flag == "1") {
    stateName = "启动"
  } else {
    stateName = '停止'
    stateName = "停止"
  }
  getSettingCount(ids.value).then(response => {
  getSettingCount(ids.value).then((response) => {
    let unStartStopArrName = []
    let startStopArrIds = []
    for (let i = 0; i < response.data.length; i++) {
@@ -146,19 +152,20 @@
      }
    }
    if (unStartStopArrName.length > 0) {
      var bh = unStartStopArrName.join('，')
      proxy.$modal.confirm('选中存在未设置限值的仪器设备' + bh + '，暂无法' + stateName + '！', '警告', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).catch(function () {
      })
      var bh = unStartStopArrName.join("，")
      proxy.$modal
        .confirm("选中存在未设置限值的仪器设备" + bh + "，暂无法" + stateName + "！", "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
        .catch(function () {})
    } else {
      if (startStopArrIds.length > 0) {
        updateSet(startStopArrIds || '', flag).then(response => {
        updateSet(startStopArrIds || "", flag).then((response) => {
          if (response.code === 200) {
            initStartStop()
            proxy.$modal.msgSuccess('成功')
            proxy.$modal.msgSuccess("成功")
          } else {
            proxy.$modal.msgError(response.msg)
          }
@@ -168,8 +175,8 @@
  })
}
defineExpose({
  getList
});
  getList,
})
</script>

<style lang='scss' scoped></style>
<style lang="scss" scoped></style>

 zhitan-vue/src/views/costAnalysis/cost-trend-analysis.vue

@@ -36,7 +36,7 @@
      </div>
      <div class="table-bg-style">
        <div class="table-box theme-dark-mt20" style="">
          <el-table :data="tableData" v-loading="loading">
          <el-table :data="tableData" v-loading="loading" style="border-bottom: 1px solid #ebeef5">
            <el-table-column label="时间" prop="dateCode" align="center" width="160" />
            <el-table-column label="总费用(元)" prop="total" align="center" width="120" />
            <el-table-column :label="col.energyName" v-for="(col, index) in columns" :key="index" align="center">
@@ -47,7 +47,7 @@
        </div>
      </div>
      <div class="charts-view" v-loading="loading">
        <el-row :gutter="2" class="" v-for="item in chartDataList" :key="item.energyType">
        <el-row :gutter="1" class="" v-for="item in chartDataList" :key="item.energyType">
          <el-col :span="12">
            <BaseCard :title="item.costLabel + '(元)'">
              <div class="">
@@ -258,31 +258,23 @@

.table-box {
  margin-top: 0;
  :deep .el-table--border .el-table__inner-wrapper:after {
    height: 0;
  }
}

  :deep .el-table--border:after {
    width: 0;
.themeDark {
  .table-box {
    padding: 0 10px;
  }

  :deep .el-table--border:before {
    width: 0;
  }

  :deep .el-table__border-left-patch {
    background: transparent;
  }

  :deep .el-table--border .el-table__cell {
    border-right: none;
}
.themeLight {
  .table-box {
    padding-bottom: 20px;
  }
}

.charts-view {
  width: 100%;
  margin-top: 20px;
  // padding: 0 30px;
  margin-top: 12px;
  padding-bottom: 24px;
}
.display-buttons {
  display: flex;

 zhitan-vue/src/views/modelconfiguration/businessmodel/components/collectIndicators/CollectIndicators.vue

@@ -1,69 +1,70 @@
<template>
    <div class="table-box">
        <el-button class="mb20 " type="primary" icon="Plus" @click="handleAdd">
            新增
        </el-button>
        <el-button class="mb20 " icon="Delete" :disabled="multiple" @click="handleDel">
            批量删除
        </el-button>
        <el-table v-loading="loading" :data="tableData" height="calc(100vh - 370px)"
            @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="55" align="center" show-overflow-tooltip />
            <el-table-column label="指标编码" prop="code" show-overflow-tooltip align="center" />
            <el-table-column label="指标名称" prop="name" show-overflow-tooltip align="center" />
            <el-table-column label="操作" align="center">
                <template #default="scope">
                    <el-button link type="primary" icon="Delete" @click="handleDel(scope.row)">
                        删除
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
        <collectModal ref="collectModalRef" @selectedCollect='selectedCollect' />
  <div class="table-box">
    <div style="width: 100%; text-align: right; padding: 20px 20px 0 0">
      <el-button class="mb20" type="primary" icon="Plus" @click="handleAdd"> 新增 </el-button>
      <el-button class="mb20" icon="Delete" :disabled="multiple" @click="handleDel"> 批量删除 </el-button>
    </div>

    <el-table
      v-loading="loading"
      :data="tableData"
      height="calc(100vh - 370px)"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55" align="center" show-overflow-tooltip />
      <el-table-column label="指标编码" prop="code" show-overflow-tooltip align="center" />
      <el-table-column label="指标名称" prop="name" show-overflow-tooltip align="center" />
      <el-table-column label="操作" align="center">
        <template #default="scope">
          <el-button link type="primary" icon="Delete" @click="handleDel(scope.row)"> 删除 </el-button>
        </template>
      </el-table-column>
    </el-table>
    <collectModal ref="collectModalRef" @selectedCollect="selectedCollect" />
  </div>
</template>
<script setup>
let { proxy } = getCurrentInstance()
import { getSettingIndex, setNodeToIndex, delIndex } from '@/api/modelConfiguration/businessModel'
import collectModal from './CollectModal.vue'
import { getSettingIndex, setNodeToIndex, delIndex } from "@/api/modelConfiguration/businessModel"
import collectModal from "./CollectModal.vue"
let tableData = ref([])
let loading = ref(false)
let currentNode = ref(null)
function getList(modelNode) {
    if (!modelNode) {
        tableData.value = []
        return
  if (!modelNode) {
    tableData.value = []
    return
  }
  currentNode.value = modelNode
  loading.value = true
  getSettingIndex(modelNode.id).then((response) => {
    if (response.code === 200) {
      let result = response.data
      tableData.value = result.filter((f) => f.indexType === "COLLECT")
      loading.value = false
    } else {
      proxy.$modal.msgError(response.msg)
    }
    currentNode.value = modelNode
    loading.value = true;
    getSettingIndex(modelNode.id).then(response => {
        if (response.code === 200) {
            let result = response.data;
            tableData.value = result.filter(f => f.indexType === 'COLLECT');
            loading.value = false
        } else {
            proxy.$modal.msgError(response.msg);
        }
        this.deviceLoading = false;
    });
    this.deviceLoading = false
  })
}

let collectModalRef = ref(null)
function handleAdd() {
    if (collectModalRef.value) {
        collectModalRef.value.currentNode = currentNode.value
        collectModalRef.value.handleOpen(tableData.value)
    }
  if (collectModalRef.value) {
    collectModalRef.value.currentNode = currentNode.value
    collectModalRef.value.handleOpen(tableData.value)
  }
}

function selectedCollect(selectedIndex) {
    tableData.value = selectedIndex
    let indexIds = selectedIndex.map(item => item.indexId)
    setNodeToIndex(currentNode.value.id, indexIds, 'COLLECT').then((response) => {
        if (response.code !== 200) {
            proxy.$modal.msgError(response.msg)
        }
    })
  tableData.value = selectedIndex
  let indexIds = selectedIndex.map((item) => item.indexId)
  setNodeToIndex(currentNode.value.id, indexIds, "COLLECT").then((response) => {
    if (response.code !== 200) {
      proxy.$modal.msgError(response.msg)
    }
  })
}
// 选中数组
let ids = ref([])
@@ -71,33 +72,35 @@
// 非多个禁用
let multiple = ref(true)
function handleDel(row) {
    const indexIds = row && row.indexId ? [row.indexId] : ids.value
    const indexNames = row.name || names.value
    proxy.$modal.confirm('是否确认删除指标名为"' + indexNames + '"的数据项?', '警告').then(function () {
        return delIndex(currentNode.value.id, indexIds);
    }).then((response) => {
        if (response.code === 200) {
            // 删除成功，更新表格数据
            getList(currentNode.value)
            // tableData.value = tableData.value.filter(f => f.indexId !== row.indexId)
            proxy.$modal.msgSuccess("删除成功");
        } else {
            // 删除失败，显示错误消息
            proxy.$modal.msgError(response.msg);
        }
    }).catch(() => {
    });
  const indexIds = row && row.indexId ? [row.indexId] : ids.value
  const indexNames = row.name || names.value
  proxy.$modal
    .confirm('是否确认删除指标名为"' + indexNames + '"的数据项?', "警告")
    .then(function () {
      return delIndex(currentNode.value.id, indexIds)
    })
    .then((response) => {
      if (response.code === 200) {
        // 删除成功，更新表格数据
        getList(currentNode.value)
        // tableData.value = tableData.value.filter(f => f.indexId !== row.indexId)
        proxy.$modal.msgSuccess("删除成功")
      } else {
        // 删除失败，显示错误消息
        proxy.$modal.msgError(response.msg)
      }
    })
    .catch(() => {})
}


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
}
defineExpose({
    getList
});
  getList,
})
</script>

<style scoped lang="scss">

 zhitan-vue/src/views/modelconfiguration/businessmodel/components/deviceConfig/DeviceConfig.vue

@@ -1,82 +1,82 @@
<template>

    <div class="table-box">
        <el-button class="mb20 " type="primary" icon="Plus" @click="handleAdd">
            新增
        </el-button>
        <el-table v-loading="loading" :data="tableData" height="calc(100vh - 370px)">
            <el-table-column label="器具编码" prop="code" show-overflow-tooltip align="center" />
            <el-table-column label="器具名称" prop="meterName" show-overflow-tooltip align="center" />
            <el-table-column label="配电室" align="center" show-overflow-tooltip prop="installactionLocation" />
            <el-table-column label="操作" class-name="small-padding fixed-width" align="center">
                <template #default="scope">
                    <el-button link type="primary" icon="Delete" @click="handleDel(scope.row)">
                        删除
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
        <deviceModal ref="deviceModalRef" @deviceConfirmSelect='deviceConfirmSelect' />
    </div>
  <div class="table-box">
    <el-button class="mb20 mt20 mr20" type="primary" icon="Plus" @click="handleAdd" style="float: right">
      新增
    </el-button>
    <el-table v-loading="loading" :data="tableData" height="calc(100vh - 370px)">
      <el-table-column label="器具编码" prop="code" show-overflow-tooltip align="center" />
      <el-table-column label="器具名称" prop="meterName" show-overflow-tooltip align="center" />
      <el-table-column label="配电室" align="center" show-overflow-tooltip prop="installactionLocation" />
      <el-table-column label="操作" class-name="small-padding fixed-width" align="center">
        <template #default="scope">
          <el-button link type="primary" icon="Delete" @click="handleDel(scope.row)"> 删除 </el-button>
        </template>
      </el-table-column>
    </el-table>
    <deviceModal ref="deviceModalRef" @deviceConfirmSelect="deviceConfirmSelect" />
  </div>
</template>
<script setup>
let { proxy } = getCurrentInstance()
import { getSettingDevice, setDevice, delDevice } from '@/api/modelConfiguration/businessModel'
import deviceModal from './DeviceModal.vue'
import { getSettingDevice, setDevice, delDevice } from "@/api/modelConfiguration/businessModel"
import deviceModal from "./DeviceModal.vue"
let tableData = ref([])
let loading = ref(false)
let currentNode = ref(null)
function getList(modelNode) {
    if (!modelNode) {
        tableData.value = []
        return
  if (!modelNode) {
    tableData.value = []
    return
  }
  currentNode.value = modelNode
  loading.value = true
  getSettingDevice(modelNode.id).then((response) => {
    if (response.code === 200) {
      tableData.value = response.data
      loading.value = false
    } else {
      proxy.$modal.msgError(response.msg)
    }
    currentNode.value = modelNode
    loading.value = true;
    getSettingDevice(modelNode.id).then((response) => {
        if (response.code === 200) {
            tableData.value = response.data;
            loading.value = false;
        } else {
            proxy.$modal.msgError(response.msg);
        }
    });
  })
}

function handleDel(row) {
    proxy.$modal.confirm('是否确认删除数据项?').then(function () {
        return delDevice(currentNode.value.id, row.id); // 直接调用delDevice，而不是handleDelDevice
    }).then((response) => {
        if (response.code === 200) {
            // 删除成功，更新表格数据
            tableData.value = tableData.value.filter(f => f.id !== row.id);
            proxy.$modal.msgSuccess("删除成功");
        } else {
            // 删除失败，显示错误消息
            proxy.$modal.msgError(response.msg);
        }
    }).catch(() => {
    });
  proxy.$modal
    .confirm("是否确认删除数据项?")
    .then(function () {
      return delDevice(currentNode.value.id, row.id) // 直接调用delDevice，而不是handleDelDevice
    })
    .then((response) => {
      if (response.code === 200) {
        // 删除成功，更新表格数据
        tableData.value = tableData.value.filter((f) => f.id !== row.id)
        proxy.$modal.msgSuccess("删除成功")
      } else {
        // 删除失败，显示错误消息
        proxy.$modal.msgError(response.msg)
      }
    })
    .catch(() => {})
}

let deviceModalRef = ref(null)
function handleAdd() {
    if (deviceModalRef.value) {
        deviceModalRef.value.handleOpen(tableData.value)
    }
  if (deviceModalRef.value) {
    deviceModalRef.value.handleOpen(tableData.value)
  }
}
function deviceConfirmSelect(selectedDevice) {
    tableData.value = selectedDevice;
    let deviceIds = selectedDevice.map(item => item.id);
    setDevice(currentNode.value.id, deviceIds).then((response) => {
        if (response.code !== 200) {
            proxy.$modal.msgError(response.msg)
        }
    });
  tableData.value = selectedDevice
  let deviceIds = selectedDevice.map((item) => item.id)
  setDevice(currentNode.value.id, deviceIds).then((response) => {
    if (response.code !== 200) {
      proxy.$modal.msgError(response.msg)
    }
  })
}
defineExpose({
    getList
});
  getList,
})
</script>

<style scoped lang="scss">

 zhitan-vue/src/views/modelconfiguration/indexwarehouse/components/deviceConfig/DeviceConfig.vue

@@ -1,81 +1,87 @@
<template>

    <div class="table-box">
        <el-button class="mb20 " type="primary" icon="Plus" @click="handleAdd">
            新增
        </el-button>
        <el-table v-loading="loading" :data="tableData" height="calc(100vh - 370px)">
            <el-table-column label="器具编码" prop="code" show-overflow-tooltip align="center" />
            <el-table-column label="器具名称" prop="meterName" show-overflow-tooltip align="center" />
            <el-table-column label="配电室" prop="installactionLocation" show-overflow-tooltip align="center" />
            <el-table-column label="操作" class-name="small-padding fixed-width" align="center">
                <template #default="scope">
                    <el-button link type="primary" icon="Delete" @click="handleDel(scope.row)">
                        删除
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
        <deviceModal ref="deviceModalRef" @deviceConfirmSelect='deviceConfirmSelect' />
    </div>
  <div class="table-box">
    <el-button
      class="mb20"
      type="primary"
      icon="Plus"
      @click="handleAdd"
      style="float: right; margin-top: 16px; margin-right: 16px"
    >
      新增
    </el-button>
    <el-table v-loading="loading" :data="tableData" height="calc(100vh - 370px)">
      <el-table-column label="器具编码" prop="code" show-overflow-tooltip align="center" />
      <el-table-column label="器具名称" prop="meterName" show-overflow-tooltip align="center" />
      <el-table-column label="配电室" prop="installactionLocation" show-overflow-tooltip align="center" />
      <el-table-column label="操作" class-name="small-padding fixed-width" align="center">
        <template #default="scope">
          <el-button link type="primary" icon="Delete" @click="handleDel(scope.row)"> 删除 </el-button>
        </template>
      </el-table-column>
    </el-table>
    <deviceModal ref="deviceModalRef" @deviceConfirmSelect="deviceConfirmSelect" />
  </div>
</template>
<script setup>
let { proxy } = getCurrentInstance()
import { getSettingDevice, setDevice, delDevice } from '@/api/modelConfiguration/businessModel'
import deviceModal from './DeviceModal.vue'
import { getSettingDevice, setDevice, delDevice } from "@/api/modelConfiguration/businessModel"
import deviceModal from "./DeviceModal.vue"
let tableData = ref([])
let loading = ref(false)
let currentNode = ref(null)
function getList(modelNode) {
    if (!modelNode) {
        tableData.value = []
        return
  if (!modelNode) {
    tableData.value = []
    return
  }
  currentNode.value = modelNode
  loading.value = true
  getSettingDevice(modelNode.id).then((response) => {
    if (response.code === 200) {
      tableData.value = response.data
      loading.value = false
    } else {
      proxy.$modal.msgError(response.msg)
    }
    currentNode.value = modelNode
    loading.value = true;
    getSettingDevice(modelNode.id).then((response) => {
        if (response.code === 200) {
            tableData.value = response.data;
            loading.value = false;
        } else {
            proxy.$modal.msgError(response.msg);
        }
    });
  })
}

function handleDel(row) {
    proxy.$modal.confirm('是否确认删除数据项?').then(function () {
        return delDevice(currentNode.value.id, row.id); // 直接调用delDevice，而不是handleDelDevice
    }).then((response) => {
        if (response.code === 200) {
            // 删除成功，更新表格数据
            tableData.value = tableData.value.filter(f => f.id !== row.id);
            proxy.$modal.msgSuccess("删除成功");
        } else {
            // 删除失败，显示错误消息
            proxy.$modal.msgError(response.msg);
        }
    }).catch(() => {
    });
  proxy.$modal
    .confirm("是否确认删除数据项?")
    .then(function () {
      return delDevice(currentNode.value.id, row.id) // 直接调用delDevice，而不是handleDelDevice
    })
    .then((response) => {
      if (response.code === 200) {
        // 删除成功，更新表格数据
        tableData.value = tableData.value.filter((f) => f.id !== row.id)
        proxy.$modal.msgSuccess("删除成功")
      } else {
        // 删除失败，显示错误消息
        proxy.$modal.msgError(response.msg)
      }
    })
    .catch(() => {})
}
let deviceModalRef = ref(null)
function handleAdd() {
    if (deviceModalRef.value) {
        deviceModalRef.value.handleOpen(tableData.value)
    }
  if (deviceModalRef.value) {
    deviceModalRef.value.handleOpen(tableData.value)
  }
}
function deviceConfirmSelect(selectedDevice) {
    tableData.value = selectedDevice;
    let deviceIds = selectedDevice.map(item => item.id);
    setDevice(currentNode.value.id, deviceIds).then((response) => {
        if (response.code !== 200) {
            proxy.$modal.msgError(response.msg)
        }
    });
  tableData.value = selectedDevice
  let deviceIds = selectedDevice.map((item) => item.id)
  setDevice(currentNode.value.id, deviceIds).then((response) => {
    if (response.code !== 200) {
      proxy.$modal.msgError(response.msg)
    }
  })
}
defineExpose({
    getList
});
  getList,
})
</script>

<style scoped lang="scss">

 zhitan-vue/src/views/peakvalley/timeSharing/timeSharing.vue

@@ -120,7 +120,7 @@
    </div>
    <el-dialog v-model="timeSharingDialogTableVisible" title="查看分时统计详情" width="1300">
      <div class="table-box">
        <el-table :data="viewTimeSharingList" style="width: 100%" height="420">
        <el-table :data="viewTimeSharingList" style="width: 100%" height="420" border>
          <el-table-column label="时间" align="center" show-overflow-tooltip width="200">
            <template #default="scope"> {{ scope.row.time }}时 </template>
          </el-table-column>

 zhitan-vue/src/views/poweranalysis/pariPassu/index.vue

@@ -8,34 +8,41 @@
        <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 type="primary" icon="Search" @click="handleQuery"> 搜索 </el-button>
              <el-button icon="Refresh" @click="resetQuery">重置</el-button>
            </el-form-item>
            <!-- <el-form-item>
@@ -53,42 +60,55 @@
            </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">
       
        <div
          style="height: calc(100vh - 220px) !important; max-height: calc(100vh - 220px) !important; overflow-y: auto"
          v-loading="loading"
        >
          <BaseCard :title="queryParams.nodeName + '-能耗对比分析'">
            <div class="chart-box">
            <div class="chart-box" style="padding-top: 12px">
              <div id="Chart1" />
            </div>
          </BaseCard>

          <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="contrastValues" prop="contrastValues" :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="contrastValues"
                  prop="contrastValues"
                  :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>
@@ -101,27 +121,23 @@
</template>

<script setup name="department">
import {
  listRegion,
  listDepartment,
  querySameCompareList,
} 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, querySameCompareList } 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,
@@ -134,52 +150,51 @@
  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[1].value);
  queryParams.value.nodeId = data.id
  queryParams.value.nodeName = data.label
  handleTimeType(period.value[1].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;
  if(e=='MONTH'){
    queryParams.value.timeCode = proxy.dayjs(new Date()).format("YYYY-MM");
  }else if(e=='YEAR'){
    queryParams.value.timeCode = proxy.dayjs(new Date()).format("YYYY");
  }else{
    queryParams.value.timeCode = proxy.dayjs(new Date()).format("YYYY-MM-DD");
  queryParams.value.timeType = e
  if (e == "MONTH") {
    queryParams.value.timeCode = proxy.dayjs(new Date()).format("YYYY-MM")
  } else if (e == "YEAR") {
    queryParams.value.timeCode = proxy.dayjs(new Date()).format("YYYY")
  } else {
    queryParams.value.timeCode = 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"));
  querySameCompareList(
    proxy.addDateRange({
@@ -188,25 +203,25 @@
    })
  ).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) {
        res.data.map((item) => {
          xdata.push(
            proxy
              .dayjs(item.currentTime)
              .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.currentValue ? item.currentValue : 0);
          ycompareValue.push(!!item.contrastValues? item.contrastValues : 0);
          yqoq.push(!!item.ratio ? item.ratio : 0);
        });
       console.log(xdata)
          )
          yvalue.push(!!item.currentValue ? item.currentValue : 0)
          ycompareValue.push(!!item.contrastValues ? item.contrastValues : 0)
          yqoq.push(!!item.ratio ? item.ratio : 0)
        })
        console.log(xdata)
      }
      setTimeout(() => {
        myChart1.setOption({
@@ -229,8 +244,7 @@
            itemWidth: 14,
            itemHeight: 10,
            textStyle: {
              color:
                settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
              color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
            },
          },
          xAxis: {
@@ -241,10 +255,7 @@
            axisLine: {
              show: true,
              lineStyle: {
                color:
                  settingsStore.sideTheme == "theme-dark"
                    ? "#FFFFFF"
                    : "#222222",
                color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
              },
            },
            axisTick: {
@@ -257,8 +268,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'
@@ -268,17 +278,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],
              },
@@ -289,10 +291,7 @@
                show: true,
                lineStyle: {
                  type: "dashed",
                  color:
                    settingsStore.sideTheme == "theme-dark"
                      ? "#FFFFFF"
                      : "#222222",
                  color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
                },
              },
              axisTick: {
@@ -302,10 +301,7 @@
                show: false,
              },
              axisLabel: {
                color:
                  settingsStore.sideTheme == "theme-dark"
                    ? "#FFFFFF"
                    : "#222222",
                color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
                fontSize: 14,
              },
            },
@@ -314,10 +310,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],
              },
@@ -331,20 +324,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,
              },
            },
@@ -356,7 +343,7 @@
              barWidth: "8",
              tooltip: {
                valueFormatter: function (value) {
                  return value + queryParams.value.muid;
                  return value + queryParams.value.muid
                },
              },
              itemStyle: {
@@ -376,7 +363,7 @@
              barWidth: "8",
              tooltip: {
                valueFormatter: function (value) {
                  return value + queryParams.value.muid;
                  return value + queryParams.value.muid
                },
              },
              itemStyle: {
@@ -397,24 +384,24 @@
              symbol: "none", // 设置为 'none' 去掉圆点
              tooltip: {
                valueFormatter: function (value) {
                  return value + "%";
                  return value + "%"
                },
              },
              data: yqoq,
            },
          ],
        });
      }, 100);
      departmentList.value = !!res.data ? res.data : [];
        })
      }, 100)
      departmentList.value = !!res.data ? res.data : []
      window.addEventListener(
        "resize",
        () => {
          myChart1.resize();
          myChart1.resize()
        },
        { passive: true }
      );
      )
    }
  });
  })
  // listDepartment(
  //   proxy.addDateRange({
  //     ...queryParams.value,
@@ -563,17 +550,17 @@
}
// 能耗对比分析-科室能耗分析-搜索
function handleQuery() {
  getList();
  getList()
}
// 能耗对比分析-重置
function resetQuery() {
  proxy.resetForm("queryRef");
  handleTimeType(period.value[1].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[1].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() {
@@ -584,7 +571,7 @@
      ...query.value,
    },
    `${queryParams.value.nodeName}-厂区能耗分析_${new Date().getTime()}.xlsx`
  );
  )
}
</script>
<style scoped lang="scss">

 zhitan-vue/src/views/poweranalysis/perPassu/index.vue

@@ -8,34 +8,41 @@
        <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 type="primary" icon="Search" @click="handleQuery"> 搜索 </el-button>
              <el-button icon="Refresh" @click="resetQuery">重置</el-button>
            </el-form-item>
            <!-- <el-form-item>
@@ -53,42 +60,55 @@
            </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">
       
        <div
          style="height: calc(100vh - 220px) !important; max-height: calc(100vh - 220px) !important; overflow-y: auto"
          v-loading="loading"
        >
          <BaseCard :title="queryParams.nodeName + '-能耗对比分析'">
            <div class="chart-box">
            <div class="chart-box" style="padding-top: 12px">
              <div id="Chart1" />
            </div>
          </BaseCard>

          <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="contrastValues" prop="contrastValues" :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="contrastValues"
                  prop="contrastValues"
                  :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>
@@ -101,27 +121,23 @@
</template>

<script setup name="department">
import {
  listRegion,
  listDepartment,
  queryLoopCompareList,
} 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, queryLoopCompareList } 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,
@@ -134,51 +150,51 @@
  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[1].value);
  queryParams.value.nodeId = data.id
  queryParams.value.nodeName = data.label
  handleTimeType(period.value[1].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;
  if(e=='MONTH'){
    queryParams.value.timeCode = proxy.dayjs(new Date()).format("YYYY-MM");
  }else if(e=='YEAR'){
    queryParams.value.timeCode = proxy.dayjs(new Date()).format("YYYY");
  }else{
    queryParams.value.timeCode = proxy.dayjs(new Date()).format("YYYY-MM-DD");
  queryParams.value.timeType = e
  if (e == "MONTH") {
    queryParams.value.timeCode = proxy.dayjs(new Date()).format("YYYY-MM")
  } else if (e == "YEAR") {
    queryParams.value.timeCode = proxy.dayjs(new Date()).format("YYYY")
  } else {
    queryParams.value.timeCode = 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"));
  queryLoopCompareList(
    proxy.addDateRange({
@@ -187,28 +203,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) {
        res.data.map((item) => {
          xdata.push(
            proxy
              .dayjs(item.currentTime)
              .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.currentValue ? item.currentValue : 0);
          ycompareValue.push(!!item.contrastValues ? item.contrastValues : 0);
          yqoq.push(!!item.ratio ? item.ratio : 0);
        });
          )
          yvalue.push(!!item.currentValue ? item.currentValue : 0)
          ycompareValue.push(!!item.contrastValues ? item.contrastValues : 0)
          yqoq.push(!!item.ratio ? item.ratio : 0)
        })
      }
      setTimeout(() => {
        myChart1.setOption({
@@ -231,8 +243,7 @@
            itemWidth: 14,
            itemHeight: 10,
            textStyle: {
              color:
                settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
              color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
            },
          },
          xAxis: {
@@ -243,10 +254,7 @@
            axisLine: {
              show: true,
              lineStyle: {
                color:
                  settingsStore.sideTheme == "theme-dark"
                    ? "#FFFFFF"
                    : "#222222",
                color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
              },
            },
            axisTick: {
@@ -259,8 +267,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'
@@ -270,17 +277,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],
              },
@@ -291,10 +290,7 @@
                show: true,
                lineStyle: {
                  type: "dashed",
                  color:
                    settingsStore.sideTheme == "theme-dark"
                      ? "#FFFFFF"
                      : "#222222",
                  color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
                },
              },
              axisTick: {
@@ -304,10 +300,7 @@
                show: false,
              },
              axisLabel: {
                color:
                  settingsStore.sideTheme == "theme-dark"
                    ? "#FFFFFF"
                    : "#222222",
                color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
                fontSize: 14,
              },
            },
@@ -316,10 +309,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],
              },
@@ -333,20 +323,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,
              },
            },
@@ -358,7 +342,7 @@
              barWidth: "8",
              tooltip: {
                valueFormatter: function (value) {
                  return value + queryParams.value.muid;
                  return value + queryParams.value.muid
                },
              },
              itemStyle: {
@@ -378,7 +362,7 @@
              barWidth: "8",
              tooltip: {
                valueFormatter: function (value) {
                  return value + queryParams.value.muid;
                  return value + queryParams.value.muid
                },
              },
              itemStyle: {
@@ -399,24 +383,24 @@
              symbol: "none", // 设置为 'none' 去掉圆点
              tooltip: {
                valueFormatter: function (value) {
                  return value + "%";
                  return value + "%"
                },
              },
              data: yqoq,
            },
          ],
        });
      }, 100);
      departmentList.value = !!res.data ? res.data : [];
        })
      }, 100)
      departmentList.value = !!res.data ? res.data : []
      window.addEventListener(
        "resize",
        () => {
          myChart1.resize();
          myChart1.resize()
        },
        { passive: true }
      );
      )
    }
  });
  })
  // listDepartment(
  //   proxy.addDateRange({
  //     ...queryParams.value,
@@ -565,17 +549,17 @@
}
// 能耗对比分析-搜索
function handleQuery() {
  getList();
  getList()
}
// 能耗对比分析-重置
function resetQuery() {
  proxy.resetForm("queryRef");
  handleTimeType(period.value[1].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 = "MOM";
  handleQuery();
  proxy.resetForm("queryRef")
  handleTimeType(period.value[1].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 = "MOM"
  handleQuery()
}
// 能耗对比分析-导出
function handleExport() {
@@ -586,7 +570,7 @@
      ...query.value,
    },
    `${queryParams.value.nodeName}-厂区能耗分析_${new Date().getTime()}.xlsx`
  );
  )
}
</script>
<style scoped lang="scss">