Merge branch 'temp' into deploy-dev

2. 监控中心 - 能耗监测 - 分析 图表 前台页面

hx-ai-intelligent/src/api/alarmSettings/deviceAlarms.ts

@@ -1,5 +1,9 @@
 export enum deviceAlarms {
   getTableList = '/carbon-smart/api/AlarmEquipment/selectAlarmEquipment', //设备告警分页
-  addOrUpNewData = '/carbon-smart/api/AlarmEquipment/creatOrUpdate', //设备告警添加 修海
+  addOrUpNewData = '/carbon-smart/api/AlarmEquipment/creatOrUpdate', //设备告警添加 修改
   del = '/carbon-smart/api/AlarmEquipment/delete', //设备告警删除
+  configGetTableList = '/carbon-smart/api/AlarmEquipmentRule/selectAlarmEquipmentRule', //配置设备告警分页
+  configAddOrUpNewData = '/carbon-smart/api/AlarmEquipmentRule/creatOrUpdate', //配置设备告警添加 修改
+  configFindById = '/carbon-smart/api/AlarmEquipmentRule/findById', //配置设备告警 查询详情
+  configDel = '/carbon-smart/api/AlarmEquipmentRule/delete', //配置设备告警删除
 }

hx-ai-intelligent/src/api/alarmSettings/energyAlarm.ts

@@ -0,0 +1,9 @@
+export enum energyAlarms {
+  getTableList = '/carbon-smart/api/AlarmEnergyConsumption/selectAlarmEnergyConsumption', //能耗告警分页
+  addOrUpNewData = '/carbon-smart/api/AlarmEnergyConsumption/creatOrUpdate', //能耗告警添加 修改
+  del = '/carbon-smart/api/AlarmEnergyConsumption/delete', //能耗删除
+  configGetTableList = '/carbon-smart/api/AlarmEquipmentRule/selectAlarmEquipmentRule', //配置设备告警分页
+  configAddOrUpNewData = '/carbon-smart/api/AlarmEquipmentRule/creatOrUpdate', //配置设备告警添加 修改
+  configFindById = '/carbon-smart/api/AlarmEquipmentRule/findById', //配置设备告警 查询详情
+  configDel = '/carbon-smart/api/AlarmEquipmentRule/delete', //配置设备告警删除
+}

hx-ai-intelligent/src/api/carbonEmissionFactorLibrary.ts

@@ -11,5 +11,10 @@ export enum carbonEmissionFactorLibrary {
 }
 // 碳排管理-碳排统计接口
 export enum energyConsumption {
+  getDicList = '/carbon-smart/client/dict/list',
   pageList = '/carbon-smart/api/carbon/stats/pageList',
+  findById = '/carbon-smart/api/carbon/stats/findById',
+  creat = '/carbon-smart/api/carbon/stats/creat',
+  update = '/carbon-smart/api/carbon/stats/update',
+  del = '/carbon-smart/api/carbon/stats/del',
 }

hx-ai-intelligent/src/api/index.ts

@@ -38,3 +38,46 @@ export const dict = async ({
   }
   return Promise.resolve({ data: { data: get(dictMap, key) } });
 };
+
+/**
+ * 获取所有枚举(无需传参)
+ */
+export const getAllEnum = async ({
+  api = `${BASE_URL}/operation/enum/getAllEnum`,
+  params = {},
+  keyField = 'dicKey',
+  transform = (res: any) => res,
+}: dictHttpConfig) => {
+  const dictMap = JSON.parse(sessionStorage.getItem('dictMap') || '{}') as Object;
+  const key = get(params, keyField) as keyof typeof dictMap;
+
+  if (!dictMap.hasOwnProperty(key)) {
+    const res = await http.post(api, params);
+    const options = get(transform(res), `data.${key}`);
+    dictMap[key] = options;
+    sessionStorage.setItem('dictMap', JSON.stringify(dictMap));
+  }
+  return Promise.resolve({ data: { data: get(dictMap, key) } });
+};
+
+
+/**
+ * 获取单个枚举(需传参，参数 enumType) 
+ */
+export const getEnum = async ({
+  api = `${BASE_URL}/operation/enum/getEnum`,
+  params = {},
+  keyField = 'dicKey',
+  transform = (res: any) => res,
+}: dictHttpConfig) => {
+  const dictMap = JSON.parse(sessionStorage.getItem('dictMap') || '{}') as Object;
+  const key = get(params, keyField) as keyof typeof dictMap;
+
+  if (!dictMap.hasOwnProperty(key)) {
+    const res = await http.post(api, params);
+    const options = get(transform(res), `data.${key}`);
+    dictMap[key] = options;
+    sessionStorage.setItem('dictMap', JSON.stringify(dictMap));
+  }
+  return Promise.resolve({ data: { data: get(dictMap, key) } });
+};

hx-ai-intelligent/src/view/alarmManagement/alarmOverview/index.vue

@@ -25,19 +25,339 @@
         </div>
       </div>
     </div>
-    <div style="flex: 4; width: 100%">2</div>
+    <div style="flex: 4; width: 100%; display: flex; gap: 5px">
-    <div style="flex: 4; width: 100%">3</div>
+      <div
+        style="flex: 1; height: 100%; background-color: white; border-radius: 4px; padding: 12px">
+        <div ref="echartPieOne" style="width: 100%; height: 100%"></div>
+      </div>
+      <div style="flex: 1; height: 100%; background-color: white; border-radius: 4px"> xxxx </div>
+    </div>
+    <!-- 告警矩形 echarts -->
+    <div style="flex: 4; width: 100%; background-color: white; border-radius: 4px; padding: 12px">
+      <div ref="graphChart" style="width: 100%; height: 100%"></div>
+    </div>
   </div>
 </template>
 <script lang="ts" setup>
   import { ref, onMounted } from 'vue'; // 从 Vue 中导入 ref、onMounted 和 watchEffect
+  import * as echarts from 'echarts';
 
   defineOptions({
     name: 'alarmOverview', // 与页面路由name一致缓存才可生效
   });
 
   const info = ref({});
-  onMounted(() => {});
+  let chartInstance: echarts.ECharts | null = null;
+  let chartInstanceOne: echarts.ECharts | null = null;
+  const graphChart = ref(null);
+  const echartPieOne = ref(null);
+  const getGraphChart = () => {
+    let dayData = [];
+    let energyAlarm = [];
+    let wgAlarm = [];
+    let equipmentAlarm = [];
+    let total = [];
+
+    // Extend data for 30 days
+    for (let i = 1; i < 30; i++) {
+      dayData.push(`3/${i}`);
+      energyAlarm.push(Math.floor(Math.random() * 11)); // Assuming the same value for simplicity
+      wgAlarm.push(Math.floor(Math.random() * 11)); // Assuming the same value for simplicity
+      equipmentAlarm.push(Math.floor(Math.random() * 11)); // Assuming the same value for simplicity
+      total.push(0); // Assuming the same value for simplicity
+    }
+    if (chartInstance) {
+      chartInstance.dispose();
+    }
+    chartInstance = echarts.init(graphChart.value);
+    const option = {
+      title: {
+        text: '告警趋势/ 近30天',
+        textStyle: {
+          fontSize: 16,
+          fontWeight: 'normal',
+          color: '#aaaaaa',
+        },
+        left: '1%',
+        top: '2%',
+      },
+      tooltip: {
+        trigger: 'axis',
+        axisPointer: {
+          type: 'shadow',
+        },
+        formatter: function (params) {
+          let res =
+            params[0].axisValue +
+            '<br/>' +
+            params[0].marker +
+            '    ' +
+            params[0].seriesName +
+            '  :  ' +
+            params[0].data +
+            '<br/>' +
+            params[1].marker +
+            '    ' +
+            params[1].seriesName +
+            ' :  ' +
+            params[1].data +
+            '<br/>' +
+            params[2].marker +
+            '    ' +
+            params[2].seriesName +
+            '  :  ' +
+            params[2].data +
+            '<br/>';
+          return res;
+        },
+      },
+      grid: {
+        left: '2%', // 设置图表距离左边的距离
+        right: '2%', // 设置图表距离右边的距离
+        borderWidth: 0,
+        y2: 60, // 距离底边
+      },
+      legend: [
+        {
+          top: 5,
+          left: 'center', // 将图例居中显示
+          textStyle: {
+            color: 'rgb(89, 89, 89)',
+            fontSize: '14',
+            fontWeight: 'normal',
+          }, // 注意这里的颜色值要用引号括起来
+          data: ['设备告警', '网关告警', '能源告警'],
+          itemGap: 30, // 这里可以调整图例项之间的间距，单位为像素
+        },
+      ],
+      toolbox: {
+        show: true,
+        feature: {
+          restore: {},
+          saveAsImage: {},
+        },
+      },
+      calculable: true,
+      xAxis: [
+        {
+          type: 'category',
+          splitLine: {
+            show: false,
+          },
+          axisTick: {
+            show: false,
+          },
+          splitArea: {
+            show: false,
+          },
+          data: dayData,
+        },
+      ],
+      yAxis: [
+        {
+          type: 'value',
+          shwo: false,
+          splitLine: {
+            show: true,
+          },
+          axisLine: {
+            show: false,
+          },
+          axisTick: {
+            show: false,
+          },
+          splitArea: {
+            show: false,
+          },
+          axisLabel: {
+            show: false, // 不显示刻度值
+          },
+        },
+      ],
+      dataZoom: [
+        {
+          height: 12,
+          start: 0,
+          end: 100,
+          handleSize: '300%', // 设置滑块的大小
+          bottom: 15,
+        },
+      ],
+      series: [
+        {
+          name: '能源告警',
+          type: 'bar',
+          stack: '能源告警',
+          barMaxWidth: 40,
+          barGap: '10%',
+          itemStyle: {
+            normal: {
+              barBorderRadius: 0,
+              color: 'rgb(246, 189, 22)',
+            },
+          },
+          data: energyAlarm,
+        },
+        {
+          name: '网关告警',
+          type: 'bar',
+          stack: '能源告警',
+          barMaxWidth: 40,
+          barGap: '10%',
+          itemStyle: {
+            normal: {
+              barBorderRadius: 0,
+              color: 'rgb(91, 143, 249)',
+            },
+          },
+          data: wgAlarm,
+        },
+        {
+          name: '设备告警',
+          type: 'bar',
+          stack: '能源告警',
+          barMaxWidth: 40,
+          barGap: '10%',
+          itemStyle: {
+            normal: {
+              barBorderRadius: 0,
+              color: 'rgb(48, 191, 120)',
+            },
+          },
+          data: equipmentAlarm,
+        },
+        {
+          name: '总数',
+          type: 'bar',
+          stack: '能源告警',
+          barMaxWidth: 40,
+          barHight: 0,
+          itemStyle: {
+            normal: {
+              barBorderRadius: 0,
+              color: 'rgba(0,0,0,0)',
+            },
+          },
+          label: {
+            show: true,
+            color: '#000000',
+            position: 'top',
+            top: '10',
+            formatter: function (value) {
+              return (
+                Number(energyAlarm[value.dataIndex]) +
+                Number(wgAlarm[value.dataIndex]) +
+                Number(equipmentAlarm[value.dataIndex])
+              );
+            },
+          },
+          data: total,
+        },
+      ],
+    };
+    chartInstance = echarts.init(graphChart.value);
+    chartInstance.setOption(option);
+  };
+  const getEchartPieOne = () => {
+    if (chartInstanceOne) {
+      chartInstanceOne.dispose();
+    }
+    chartInstanceOne = echarts.init(echartPieOne.value);
+    var m2R2Data = [
+      { value: 335, name: '紧急', itemStyle: { color: '#F56E53' } },
+      { value: 310, name: '重要', itemStyle: { color: '#F7C122' } },
+      { value: 234, name: '一般', itemStyle: { color: '#3BC27F' } },
+    ];
+    const option = {
+      title: [
+        {
+          text: '优先级 / 近30天',
+          textStyle: {
+            fontSize: 16,
+            fontWeight: 'normal',
+            color: '#aaaaaa',
+          },
+          left: '2%',
+          top: '2%',
+        },
+        {
+          text: '优先级',
+          subtext: 12312 + '个',
+          textStyle: {
+            fontSize: 24,
+            color: 'black',
+          },
+          subtextStyle: {
+            fontSize: 24,
+            fontWeight: '700',
+            color: 'black',
+          },
+          textAlign: 'center',
+          x: '44.3%',
+          y: '46%',
+        },
+      ],
+      tooltip: {
+        trigger: 'item',
+        formatter: function (parms) {
+          var str = parms.marker + ' :' + parms.data.value;
+          return str;
+        },
+      },
+      legend: {
+        // 设置图例靠右，上下居中，垂直排列
+        right: 50,
+        top: 'center',
+        orient: 'vertical',
+        // 图例图标设置为圆形
+        icon: 'circle',
+        itemWidth: 12,
+        itemHeight: 12,
+        itemGap: 16,
+        textStyle: {
+          fontSize: 14,
+        },
+      },
+      series: [
+        {
+          name: '优先级',
+          type: 'pie',
+          center: ['45%', '50%'],
+          radius: ['50%', '70%'],
+          clockwise: false, //饼图的扇区是否是顺时针排布
+          avoidLabelOverlap: false,
+          label: {
+            normal: {
+              show: true,
+              position: 'outter',
+              textStyle: {
+                fontSize: 14,
+                fontWeight: 'bold',
+              },
+              formatter: function (parms) {
+                return '[ ' + parms.data.name + ' ] : ' + parms.data.value;
+              },
+            },
+          },
+          labelLine: {
+            show: true, // 控制标签线是否显示
+            length: 10, // 标签线长度
+            length2: 20, // 标签线引出部分长度
+            // 其他样式属性，如 lineStyle 等
+          },
+          data: m2R2Data,
+        },
+      ],
+    };
+    chartInstanceOne = echarts.init(echartPieOne.value);
+    chartInstanceOne.setOption(option);
+  };
+  onMounted(() => {
+    //渲染第三个图表
+    getGraphChart();
+    //优先级
+    getEchartPieOne();
+  });
 </script>
 <style lang="less" scoped>
   .box {

hx-ai-intelligent/src/view/alarmManagement/alarmSettings/energyAlarm/configureEnergyAlarms.vue

@@ -31,23 +31,28 @@
   import editConfigureEnergyAlarm from './editConfigureEnergyAlarm.vue';
   import { deviceAlarms } from '/@/api/alarmSettings/deviceAlarms';
   import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
+  import { device } from '/@/api/deviceManage';
 
   export default {
     components: { editConfigureEnergyAlarm },
 
     setup() {
-      //设备告警数据
+      //能源告警配置
-      const configureDeviceAlarmsData = ref({});
+      const configureEnergyAlarmsData = ref({});
       const show = ref(false);
       const tableConfig = ref({});
       const mainRef = ref({});
       const editConfigureEnergyAlarms = ref({});
       const mockData = ref(data.listData);
+      //组织树
+      const orgId = ref('');
+      const result = JSON.parse(sessionStorage.getItem('ORGID')!);
+      orgId.value = result;
       const clickSwitch = (data: any) => {
         NsModal.confirm({
           title: '启用状态',
           icon: createVNode(ExclamationCircleOutlined),
-          content: '确定' + (data.record.enableRules === 1 ? '关闭' : '启用') + '吗?',
+          content: '确定' + (data.record.enableRules === 1 ? '关闭' : '启用') + '规则吗?',
           onOk: () => {
             http
               .post(deviceAlarms.addOrUpNewData, {
@@ -55,7 +60,7 @@
                 enableRules: data.record.enableRules === 1 ? 0 : 1,
               })
               .then(() => {
-                NsMessage.success('操作成功');
+                NsMessage.success(data.record.enableRules === 1 ? '规则已关闭' : '规则已启用');
                 mainRef.value?.nsTableRef.reload();
               });
           },
@@ -71,7 +76,7 @@
         a.click();
       };
       const setconfigureDeviceAlarmsData = (value: any) => {
-        configureDeviceAlarmsData.value = value;
+        configureEnergyAlarmsData.value = value;
         show.value = true;
         tableConfig.value = {
           title: '告警规则',
@@ -83,7 +88,7 @@
               name: 'RoleTypeAdd',
               type: 'primary',
               handle: () => {
-                editConfigureEnergyAlarms.value.toggle();
+                editConfigureEnergyAlarms.value.toggle(null, configureEnergyAlarmsData.value);
               },
             },
             {
@@ -143,7 +148,7 @@
             },
             {
               title: '对比类型',
-              dataIndex: 'valueType',
+              dataIndex: 'comparisonType',
             },
             {
               title: '告警点位',
@@ -172,7 +177,7 @@
                 name: 'FeedBackDetail',
                 dynamicParams: ['uuid', 'appealType'],
                 handle: (data: any) => {
-                  editConfigureEnergyAlarms.value.toggle(data);
+                  editConfigureEnergyAlarms.value.toggle(data, configureEnergyAlarmsData.value);
                 },
               },
               {
@@ -190,29 +195,37 @@
             title: value.errorCode,
             schemas: [
               {
-                field: 'provider',
+                field: 'deviceName',
                 label: '设备名称',
-                component: 'NsInput',
+                component: 'nsSelectApi',
                 componentProps: {
-                  placeholder: '请输入设备名称',
+                  api: device.queryDevicePage,
+                  params: {
+                    orgId: orgId.value,
+                    pageNum: 1,
+                    pageSize: 99,
+                  },
+                  placeholder: '请选择设备名称',
+                  resultField: 'data.records',
+                  labelField: 'deviceName',
+                  valueField: 'id',
+                  autoAddLink: true, //默认添加联动
                 },
               },
               {
-                field: 'provider',
+                field: 'devicePoint',
                 label: '设备点位',
                 component: 'nsSelectApi',
+                dynamicParams: {
+                  id: 'deviceName', //帮定上级联动数据
+                },
                 componentProps: {
-                  api: '/api/community/objs/DictItem',
+                  api: device.queryDevicePoint,
-                  params: {
-                    pageSize: 100,
-                    code: 'MZ',
-                  },
-                  placeholder: '请选择设备点位',
                   resultField: 'data',
-                  labelField: 'dictName',
+                  placeholder: '请选择设备点位',
-                  valueField: 'dictValue',
+                  labelField: 'code',
-                  immediate: true,
+                  valueField: 'id',
-                  autoSelectFirst: false,
+                  dependency: 'deviceName',
                 },
               },
               {
@@ -249,10 +262,11 @@
         };
       };
       return {
-        configureDeviceAlarmsData,
+        configureEnergyAlarmsData,
         show,
         clickSwitch,
         doWnload,
+        orgId,
         tableConfig,
         editConfigureEnergyAlarms,
         setconfigureDeviceAlarmsData,

hx-ai-intelligent/src/view/alarmManagement/alarmSettings/energyAlarm/editConfigureEnergyAlarm.vue

@@ -6,6 +6,7 @@
     :footer-style="{ textAlign: 'right' }"
     :ok="btnClick"
     :cancel="handleClose"
+    @close="handleClose"
     placement="right">
     <div style="padding: 18px; width: 100%; overflow: hidden">
       <a-form ref="formRef" :model="infoObject" :rules="rules">
@@ -18,57 +19,70 @@
             placeholder="请选择站点"
             allow-clear
             tree-default-expand-all
-            :tree-data="zdTreeData"
+            :tree-data="siteDataTree"
-            tree-node-filter-prop="label">
+            :field-names="{
-            <!-- 特殊处理情况 -->
+              children: 'linkList',
-            <!-- <template #title="{ value: val, label }">
+              label: 'orgName',
-                  <b v-if="val === 'parent 1-1'" style="color: #08c">sss</b>
+              value: 'orgId',
-                  <template v-else>{{ label }}</template>
+            }"
-                </template> -->
+            tree-node-filter-prop="orgName" />
-          </a-tree-select>
         </a-form-item>
         <a-form-item label="数据来源" name="sbtype">
           <a-cascader
             v-model:value="infoObject.sbtype"
-            :options="sbOptions"
+            :options="deviceTypeTreeData"
-            :show-search="{ filter }"
+            :field-names="{
+              children: 'children',
+              label: 'cnValue',
+              value: 'id',
+            }"
+            :show-search="{ filterDeviceType }"
+            @change="selectDeviceType"
             placeholder="请选择数据来源" />
         </a-form-item>
-        <a-form-item label="设备节点" name="jdDevice">
+        <a-form-item label="设备/节点" name="deviceNode">
           <a-tree-select
-            v-model:value="infoObject.jdDevice"
+            v-model:value="infoObject.deviceNode"
             style="width: 100%"
             placeholder="请选择设备节点"
+            :disabled="!infoObject.sbtype"
             :tree-line="true && { showLeafIcon: false }"
-            :tree-data="jdTreeData" />
+            :tree-data="jdTreeData"
+            :field-names="{
+              children: 'children',
+              label: infoObject.sbtype && infoObject.sbtype[1] === 1 ? 'deviceName' : 'pointName',
+              value: 'id',
+            }" />
         </a-form-item>
-        <a-form-item label="启用规则" name="delivery">
+        <a-form-item label="启用规则" name="enableRules">
           <a-switch
-            v-model:checked="infoObject.delivery"
+            :checked="infoObject.enableRules === 1 ? true : false"
             :class="{
-              'blue-background': infoObject.delivery,
+              'blue-background': infoObject.enableRules === 1 ? true : false,
-              'grey-background': !infoObject.delivery,
+              'grey-background': infoObject.enableRules === 1 ? false : true,
-            }" />
+            }"
+            @click="clickSwitch" />
         </a-form-item>
-        <a-form-item label="异常描述" name="desc">
+        <a-form-item label="异常描述" name="abnormalDescription">
           <a-textarea
-            v-model:value="infoObject.desc"
+            v-model:value="infoObject.abnormalDescription"
             style="height: 32px"
             :autoSize="{ minRows: 1, maxRows: 1 }"
             show-count
             :maxlength="30" />
         </a-form-item>
-        <a-form-item label="规则类型" name="resource">
+        <a-form-item label="规则类型" name="ruleType">
-          <a-radio-group v-model:value="infoObject.resource">
+          <a-radio-group v-model:value="infoObject.ruleType">
             <a-radio value="1">且 (and) </a-radio>
             <a-radio value="2">或 (or) </a-radio>
           </a-radio-group>
         </a-form-item>
-        <a-form-item label="对比类型1" name="qzType">
+        <a-form-item label="对比类型" name="comparisonType">
           <a-cascader
-            v-model:value="infoObject.sbtype"
+            v-model:value="infoObject.comparisonType"
-            :options="sbOptions"
+            :options="comparisonTypeData"
-            placeholder="请选择数据来源" />
+            :showSearch="false"
+            placeholder="请选择对比类型" />
         </a-form-item>
         <template v-for="index in infoObject.alarmList?.length" :key="index">
           <div style="width: 100%; display: flex; margin-left: 42px; padding: 12px">
@@ -76,8 +90,7 @@
             <a-select
               v-model:value="infoObject.alarmList[index - 1].logic"
               style="width: 70px; margin-left: 12px"
-              :options="ljOptions"
+              :options="ljOptions" />
-              @change="handleQzChange" />
             <span style="line-height: 32px; margin-left: 32px">{{ `数值${index}:` }}</span>
             <a-input
               style="width: 65px; margin-left: 6px"
@@ -93,8 +106,8 @@
           </div>
           <div
             v-if="
-              infoObject.alarmList[index - 1].num === null ||
+              infoObject.alarmList[index - 1]?.num === null ||
-              infoObject.alarmList[index - 1].logic === null
+              infoObject.alarmList[index - 1]?.logic === null
             "
             style="width: 100%; color: #ff4d4f; text-align: center; margin-bottom: 5px">
             请选择正确的逻辑{{ index }} 或 输入正确的数值{{ index }}
@@ -114,212 +127,231 @@
 </template>
 <script lang="ts" setup>
   import { NsMessage } from '/nerv-lib/component';
-  import { ref, toRaw } from 'vue';
+  import { ref } from 'vue';
-  import type { CascaderProps, TreeSelectProps, SelectProps } from 'ant-design-vue';
+  import type { SelectProps } from 'ant-design-vue';
   import type { ShowSearchType } from 'ant-design-vue/es/cascader';
-  import { device } from '/@/api/deviceManage';
+  import { device, group } from '/@/api/deviceManage';
+  import { energyAlarms } from '/@/api/alarmSettings/energyAlarm';
   import { http } from '/nerv-lib/util';
+  import { dict } from '/@/api';
+  import { async } from '@antv/x6/lib/registry/marker/async';
 
-  import type { Rule } from 'ant-design-vue/es/form';
+  // import type { Rule } from 'ant-design-vue/es/form';
 
   const visible = ref(false);
+  //父级数据
+  const energyAlarm = ref({});
+  //组织数
+  const orgId = ref('');
+  const result = JSON.parse(sessionStorage.getItem('ORGID')!);
+  orgId.value = result;
   //表单数据
   const infoObject = ref({
     id: null,
     site: null,
-    jdDevice: null,
+    deviceNode: null,
-    resource: null,
+    ruleType: null,
-    desc: null,
+    abnormalDescription: null,
     sbtype: null,
-    delivery: null,
+    enableRules: 0,
-    alarmList: [{ logic: null, num: null }],
+    alarmList: [{ id: null, logic: null, num: null, isDelete: 0 }],
   });
   //删除的逻辑列表
   const delAlarmList = ref([]);
-  const formRef = ref();
+  //对比类型
-  //站点数
+  const comparisonTypeData = ref([
-  const zdTreeData = ref<TreeSelectProps['treeData']>([
     {
-      label: '铁路总局(T01)',
+      value: '1',
-      value: 'T01',
+      label: '数值',
       children: [
         {
-          label: '济阳站(T0101)',
+          value: '1',
-          value: 'T0101',
+          label: '输入数值',
+        },
+        {
+          value: '2',
+          label: '同比',
         },
-      ],
-    },
-  ]);
-  //设备类型树
-  const sbOptions: CascaderProps['options'] = [
-    {
-      value: '3',
-      label: '3.电梯',
-      children: [
         {
-          value: '301',
+          value: '3',
-          label: '301.扶梯',
+          label: '环比',
         },
         {
-          value: '302',
+          value: '4',
-          label: '301.直梯',
+          label: '对比基准',
         },
       ],
     },
     {
-      value: '4',
+      value: '2',
-      label: '4.冷热源',
+      label: '比例',
       children: [
         {
-          value: '401',
+          value: '1',
-          label: '402.冷水机组',
+          label: '输入比例',
         },
         {
-          value: '402',
+          value: '2',
-          label: '403.热泵机组',
+          label: '同比',
         },
         {
-          value: '403',
+          value: '3',
-          label: '403.锅炉',
+          label: '环比',
         },
         {
-          value: '404',
+          value: '4',
-          label: '404.水处理机组',
+          label: '对比基准',
-        },
-        {
-          value: '405',
-          label: '405.板式热交换机组',
         },
       ],
     },
-  ];
-  //节点数据
-  const jdTreeData = ref([
-    {
-      title: 'parent 1',
-      value: 'parent 1',
-      children: [
-        {
-          title: 'parent 1-0',
-          value: 'parent 1-0',
-          children: [
-            {
-              title: 'my leaf',
-              value: 'leaf1',
-            },
-            {
-              title: 'your leaf',
-              value: 'leaf2',
-            },
-          ],
-        },
-        {
-          title: 'parent 1-1',
-          value: 'parent 1-1',
-        },
-      ],
-    },
-  ]);
-  //设备点位
-  const dwOptions = ref<SelectProps['options']>([
-    { value: '电压 (U)', label: '电压 (U)', code: '1' },
-    { value: '电流 (I)', label: '电流 (I)', code: '2' },
-    { value: '电流 (I)', label: 'a相电流 (Ia)', code: '3' },
   ]);
-  const filter: ShowSearchType['filter'] = (inputValue: any, path: any) => {
+  const formRef = ref();
+  //站点数
+  const siteDataTree = ref([]);
+  //数据来源
+  let deviceTypeTreeData = ref([]);
+  //节点数据
+  const jdTreeData = ref([]);
+  //选择设备时 获取的数据
+  // 选择 数据来源 查询 设备节点
+  const selectDeviceType = async (value: any, selectedOptions: any) => {
+    if (!infoObject.value.id) {
+      infoObject.value.deviceNode = null;
+    }
+    if (value[value.length - 1] === 1) {
+      //选择设备
+      await http
+        .post(device.queryDevicePage, {
+          pageNum: 1,
+          pageSize: 999,
+          energyType: selectedOptions[0].cnValue,
+          orgId: orgId.value,
+        })
+        .then((res) => {
+          jdTreeData.value = res.data.records;
+        });
+    } else {
+      //选择节点时 获取数据
+      await http
+        .post(group.queryDeviceGroupTree, {
+          pageNum: 1,
+          pageSize: 999,
+          energyType: selectedOptions[0].cnValue,
+          orgId: orgId.value,
+        })
+        .then((res) => {
+          jdTreeData.value = res.data;
+        });
+    }
+  };
+
+  //搜索设备类型
+  const filterDeviceType: ShowSearchType['filter'] = (inputValue: any, path: any) => {
     return path.some(
-      (option: any) => option.label.toLowerCase().indexOf(inputValue.toLowerCase()) > -1,
+      (option: any) => option.cnValue.toLowerCase().indexOf(inputValue.toLowerCase()) > -1,
     );
   };
-  //取值类型
-  const qzOptions = ref<SelectProps['options']>([
-    { value: '实时值', label: '实时值', code: '1' },
-    { value: '平均值', label: '平均值', code: '2' },
-  ]);
   //逻辑
   const ljOptions = ref<SelectProps['options']>([
-    { value: '1', label: '≥' },
+    { value: 0, label: '≥' },
-    { value: '2', label: '>' },
+    { value: 1, label: '>' },
-    { value: '3', label: '≤' },
+    { value: 2, label: '≤' },
-    { value: '4', label: '<' },
+    { value: 3, label: '<' },
-    { value: '5', label: '=' },
+    { value: 4, label: '=' },
   ]);
-  //设备点位方法
+  //开关
-  const filterOption = (input: string, option: any) => {
+  const clickSwitch = () => {
-    console.log('搜索', option.value);
+    if (infoObject.value.enableRules === 1) {
-    return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0;
+      infoObject.value.enableRules = 0;
-  };
+    } else {
-  const handleFocus = () => {
+      infoObject.value.enableRules = 1;
-    console.log('点击');
+    }
   };
-  const handleChange = (value: string) => {
+  //父调子 页面显示方法
-    console.log(`selected ${value}`);
+  const toggle = async (value: any, info: any) => {
-    console.log('选择', infoObject.value.sbAdress);
+    // 数据来源
-    //获得code
+    let energyType = await dict({ params: { dicKey: 'ENERGY_TYPE' } });
-    dwOptions.value.forEach((item) => {
+    energyType.data.data.forEach((item: any) => {
-      if (item.value === value) {
+      item.children = [
-        console.log('符合', item.code);
+        {
-      }
+          id: 1,
+          cnValue: '设备',
+        },
+        {
+          id: 2,
+          cnValue: '节点',
+        },
+      ];
     });
-  };
+    deviceTypeTreeData.value = energyType.data.data;
-  const handleQzChange = (value: string) => {
+    //能源告警
-    //获得code
+    energyAlarm.value = info;
-    qzOptions.value.forEach((item) => {
+    // 获取站点数据
-      if (item.value === value) {
+    http.post('/carbon-smart/user/login/logInInfo', {}).then((res) => {
-        console.log('符合', item.code);
+      if (res.msg === 'success') {
+        siteDataTree.value = res.data.linkList;
       }
     });
-  };
-  const emit = defineEmits(['editObject']);
-  //父调子 页面显示方法
-  const toggle = (value: any) => {
-    //获取设备类型
-    http.post(device.queryDeviceTree, null).then((res) => {
-      console.log(res, '请求出来的数据');
-      NsMessage.success('操作成功');
-    });
     //判断 是新增 还是修改
     if (value) {
+      value.ruleType = value.ruleType + '';
+      value.comparisonType = value.comparisonType.split(',');
+      value.sbtype = [value.dataSourcesType, value.dataSourcesWay];
+      delete value.dataSourcesType;
+      delete value.dataSourcesWay;
       infoObject.value = value;
+      //获取设备/节点
+      deviceTypeTreeData.value.forEach((item: any) => {
+        if (item.id === infoObject.value.sbtype[0]) {
+          selectDeviceType(infoObject.value.sbtype, [{ ...item }]);
+        }
+      });
     } else {
       infoObject.value = {
         id: null,
         site: null,
-        jdDevice: null,
+        deviceNode: null,
-        resource: null,
+        ruleType: null,
-        desc: null,
+        abnormalDescription: null,
         sbtype: null,
-        delivery: null,
+        enableRules: 0,
-        alarmList: [{ logic: null, num: null }],
+        alarmList: [{ id: null, logic: null, num: null, isDelete: 0 }],
       };
     }
 
     visible.value = !visible.value;
   };
   //表单 判断规格
-  const rules: Record<string, Rule[]> = {
+  const rules = {
     site: [{ required: true, message: '请选择站点', trigger: 'change' }],
     sbtype: [{ required: true, message: '请选择设备类型', trigger: 'change' }],
-    delivery: [{ required: true, message: '请选择启用规则', trigger: 'change' }],
+    enableRules: [{ required: true, message: '请选择启用规则', trigger: 'change' }],
-    jdDevice: [{ required: true, message: '请选择设备名称', trigger: 'change' }],
+    deviceNode: [{ required: true, message: '请选择设备名称', trigger: 'change' }],
     sbAdress: [{ required: true, message: '请选择设备点位', trigger: 'change' }],
-    qzType: [{ required: true, message: '请选择取值类型', trigger: 'change' }],
+    comparisonType: [{ required: true, message: '请选择对比类型', trigger: 'change' }],
-    resource: [{ required: true, message: '请选择规则类型', trigger: 'change' }],
+    ruleType: [{ required: true, message: '请选择规则类型', trigger: 'change' }],
-    desc: [{ required: true, message: '请输入异常描述', trigger: 'blur' }],
+    abnormalDescription: [
-    alarm: [{ required: true, message: '请选择逻辑', trigger: 'blur' }],
+      {
-    number: [{ required: true, message: '请输入数值', trigger: 'blur' }],
+        required: true,
-  };
+        message: '请输入异常描述',
-  // 开关选择
+        trigger: 'blur',
-  const changeSwitch = () => {
+        validator: (rules: any, abnormalDescription: any, cbfn: any) => {
-    console.log(infoObject.value.selectSwitch, '开关');
+          if (abnormalDescription.trim() !== '') {
+            cbfn();
+          } else {
+            cbfn('告警标题不能为空');
+          }
+        },
+      },
+    ],
+    logic: [{ required: true, message: '请选择逻辑', trigger: 'blur' }],
+    num: [{ required: true, message: '请输入数值', trigger: 'blur' }],
   };
   // 确认按钮
   const btnClick = () => {
     console.log(infoObject.value, '数据');
-
     infoObject.value.alarmList.forEach((item) => {
       if (item.logic === null || item.num === null) {
-        // NsMessage.error('请选择逻辑和数值');
         return;
       }
     });
@@ -329,21 +361,46 @@
     }
     //数据是否验证通过
     formRef.value.validate().then(() => {
-      console.log('values', infoObject, toRaw(infoObject));
+      console.log(energyAlarm.value, '数据');
-      delAlarmList.value = [];
+
+      //处理数据
+      let data = { ...infoObject.value };
+      //关联能耗告警id
+      data.equipmentAlarmId = energyAlarm.value.id;
+      data.errorCode = energyAlarm.value.errorCode;
+      data.dataSourcesType = data.sbtype[0];
+      data.dataSourcesWay = data.sbtype[1];
+      data.hxAlarmRuleLogicList = [...infoObject.value.alarmList, ...delAlarmList.value];
+      data.comparisonType = data.comparisonType.toString;
+      data.hxAlarmRuleLogicList.forEach((item) => {
+        const num = Number(item.num);
+        if (!isNaN(num)) {
+          item.num = Number(num.toFixed(2));
+        } else {
+          item.num = 0; // 可以设置为0或其他默认值
+        }
+      });
+      data.ruleType = Number(data.ruleType);
+      delete data.alarmList;
+      // http
+      //   .post(energyAlarms.configAddOrUpNewData, data)
+      //   .then((res) => {
+      //     if (res.msg === 'success') {
+      //       // 操作成功时的处理
+      //       if (data.id) {
+      //         NsMessage.success('告警规则编辑成功');
+      //       } else {
+      //         NsMessage.success('告警规则新增成功');
+      //       }
+      //       emit('editObject', null);
+      //       handleClose();
+      //     }
+      //   })
+      //   .catch((error) => {
+      //     // 错误处理
+      //     console.error('请求失败：', error);
+      //   });
     });
-    //调用接口
-    // http
-    //         .post(props.api, data)
-    //         .then(() => {
-    //           isLoading.value = false;
-    //           NsMessage.success('操作成功', 1, () => {
-    //             navigateBack();
-    //           });
-    //         })
-    //         .catch(() => {
-    //           isLoading.value = false;
-    //         });
   };
   //取消按钮
   const handleClose = () => {
@@ -353,11 +410,12 @@
     infoObject.value = {
       id: null,
       site: null,
-      resource: null,
+      ruleType: null,
-      desc: null,
+      deviceNode: null,
+      abnormalDescription: null,
       sbtype: null,
-      delivery: null,
+      enableRules: 0,
-      alarmList: [{ alarm: null, number: null }],
+      alarmList: [{ id: null, logic: null, num: null, isDelete: 0 }],
     };
     visible.value = false;
     delAlarmList.value = [];
@@ -365,22 +423,26 @@
   // 新增逻辑列表
   const addAlarmList = () => {
     if (infoObject.value.alarmList) {
-      infoObject.value.alarmList.push({ logic: null, num: null });
+      infoObject.value.alarmList.push({ id: null, logic: null, num: null, isDelete: 0 });
     } else {
-      infoObject.value.alarmList = [{ logic: null, num: null }];
+      infoObject.value.alarmList = [{ id: null, logic: null, num: null, isDelete: 0 }];
     }
   };
   // 删除 逻辑列表、
   const deleteAlarmList = (index: number) => {
-    if (infoObject.value.alarmList[index]?.id) {
+    if (index < infoObject.value.alarmList.length && index >= 0) {
-      delAlarmList.value.push(infoObject.value.alarmList[index]);
+      const alarmItemToDelete = infoObject.value.alarmList[index];
+      if (alarmItemToDelete?.id) {
+        // 添加到 delAlarmList 中，并标记为已删除
+        delAlarmList.value.push({ ...alarmItemToDelete, isDelete: 1 });
+      }
+      // 从 infoObject 中删除该元素
+      infoObject.value.alarmList.splice(index, 1);
     }
-    infoObject.value.alarmList.splice(index, 1);
   };
   defineExpose({
     toggle,
     handleClose,
-    dwOptions,
     formRef,
   });
 </script>

hx-ai-intelligent/src/view/alarmManagement/alarmSettings/energyAlarm/editeEnergyAlarm.vue

@@ -2,11 +2,12 @@
   <ns-drawer
     v-model:visible="visible"
     width="520"
-    :title="infoObject?.id ? '修改能源告警' : '新增能源告警'"
+    :title="' '"
     :footer-style="{ textAlign: 'right' }"
     :ok="btnClick"
     :cancel="handleClose"
-    placement="right">
+    placement="right"
+    @close="handleClose">
     <ns-form ref="formRef" :schemas="schemas" :model="infoObject" formLayout="vertical" />
     <div style="margin-left: 52px">
       应用规则:
@@ -25,13 +26,11 @@
   import { ref } from 'vue';
   import { NsMessage } from '/nerv-lib/component';
   import { http } from '/nerv-lib/util';
-  // import { deviceAlarms } from '/@/api/alarmSettings/deviceAlarms';
+  import { energyAlarms } from '/@/api/alarmSettings/energyAlarm';
 
   const visible = ref(false);
   //表单数据
   const infoObject = ref({
-    id: null,
-    accountNo: null,
     enableRules: 0,
   });
   const formRef = ref();
@@ -42,8 +41,6 @@
       infoObject.value = value;
     } else {
       infoObject.value = {
-        id: null,
-        accountNo: null,
         enableRules: 0,
       };
     }
@@ -67,6 +64,13 @@
                 required: true,
                 message: '告警标题不能为空',
                 trigger: 'change',
+                validator: (rules: any, alarmTitle: any, cbfn: any) => {
+                  if (alarmTitle && alarmTitle.trim() !== '') {
+                    cbfn();
+                  } else {
+                    cbfn('告警标题不能为空');
+                  }
+                },
               },
             ],
             componentProps: {
@@ -136,7 +140,7 @@
             },
           },
           {
-            field: 'priority',
+            field: 'monitorFrequency',
             label: '监测频率',
             component: 'NsSelect',
             rules: [
@@ -148,20 +152,29 @@
             ],
             componentProps: {
               allowClear: true,
-              placeholder: '请选择监测频率',
+              placeholder: '请选择优先级',
-              componentProps: {
+              options: [
-                api: '/api/community/objs/DictItem',
+                {
-                params: {
+                  label: '小时',
-                  pageSize: 100,
+                  value: 1,
-                  code: 'MZ',
                 },
-                placeholder: '请选择设备点位',
+                {
-                resultField: 'data',
+                  label: '每日',
-                labelField: 'dictName',
+                  value: 2,
-                valueField: 'dictValue',
+                },
-                immediate: true,
+                {
-                autoSelectFirst: false,
+                  label: '每周',
-              },
+                  value: 3,
+                },
+                {
+                  label: '月度',
+                  value: 4,
+                },
+                {
+                  label: '年度',
+                  value: 5,
+                },
+              ],
             },
           },
         ],
@@ -183,19 +196,24 @@
     //表单校验
     formRef.value.triggerSubmit().then(() => {
       //调用接口
-      // http.post(deviceAlarms.addOrUpNewData, infoObject.value).then(() => {
+      http.post(energyAlarms.addOrUpNewData, infoObject.value).then(() => {
-      //   NsMessage.success('操作成功');
+        emit('editObject', null);
-      //   visible.value = false;
+        if (infoObject.value.id) {
-      //   emit('editObject', null);
+          NsMessage.success('告警编辑成功');
-      // });
+        } else {
+          NsMessage.success('告警创建成功');
+        }
+        handleClose();
+      });
     });
   };
   const handleClose = () => {
     // 清楚校验错误信息
     formRef.value.formElRef.clearValidate();
-    console.log(infoObject.value);
+    infoObject.value = {
+      enableRules: 0,
+    };
     visible.value = false;
-    NsMessage.success('操作成功');
   };
   defineExpose({
     toggle,

hx-ai-intelligent/src/view/alarmManagement/alarmSettings/equipmentAlarm/configureDeviceAlarms.vue

@@ -11,26 +11,19 @@
           }"
           @click="clickSwitch({ enableRules: record.enableRules, record: record })" />
       </template>
-      <template v-if="column.dataIndex === 'equipmentInfo'">
-        {{
-          record?.enableRules
-            ? record.enableRules + '>' + record.deviceType + '>' + record.deviceName
-            : '-'
-        }}
-      </template>
     </template>
   </ns-view-list-table>
   <!-- 新增or编辑界面 -->
-  <editConfigureDeviceAlarm ref="editConfigureDeviceAlarms" />
+  <editConfigureDeviceAlarm ref="editConfigureDeviceAlarms" @editObject="editObject" />
 </template>
 <script lang="ts">
   import { ref, createVNode } from 'vue';
   import { http } from '/nerv-lib/util';
-  import data from '../notificationManagementMock.json';
   import { NsMessage, NsModal } from '/nerv-lib/component';
   import editConfigureDeviceAlarm from '../equipmentAlarm/editConfigureDeviceAlarm.vue';
   import { deviceAlarms } from '/@/api/alarmSettings/deviceAlarms';
   import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
+  import { device } from '/@/api/deviceManage';
 
   export default {
     components: { editConfigureDeviceAlarm },
@@ -42,25 +35,32 @@
       const tableConfig = ref({});
       const mainRef = ref({});
       const editConfigureDeviceAlarms = ref({});
-      const mockData = ref(data.listData);
+      //组织数
+      const orgId = ref('');
+      const result = JSON.parse(sessionStorage.getItem('ORGID')!);
+      orgId.value = result;
       const clickSwitch = (data: any) => {
         NsModal.confirm({
           title: '启用状态',
           icon: createVNode(ExclamationCircleOutlined),
-          content: '确定' + (data.record.enableRules === 1 ? '关闭' : '启用') + '吗?',
+          content: '确定' + (data.record.enableRules === 1 ? '关闭' : '启用') + '规则吗?',
           onOk: () => {
             http
-              .post(deviceAlarms.addOrUpNewData, {
+              .post(deviceAlarms.configAddOrUpNewData, {
                 id: data.record.id,
                 enableRules: data.record.enableRules === 1 ? 0 : 1,
               })
               .then(() => {
-                NsMessage.success('操作成功');
+                NsMessage.success(data.record.enableRules === 1 ? '规则已关闭' : '规则已启用');
                 mainRef.value?.nsTableRef.reload();
               });
           },
         });
       };
+      // 编辑或添加成功 刷新列表
+      const editObject = () => {
+        mainRef.value?.nsTableRef.reload();
+      };
       const doWnload = (url: any) => {
         const a = document.createElement('a');
         document.body.appendChild(a);
@@ -75,15 +75,14 @@
         show.value = true;
         tableConfig.value = {
           title: '告警规则',
-          api: deviceAlarms.getTableList,
+          api: deviceAlarms.configGetTableList,
-          value: mockData.value,
           headerActions: [
             {
               label: '新增',
               name: 'RoleTypeAdd',
               type: 'primary',
               handle: () => {
-                editConfigureDeviceAlarms.value.toggle();
+                editConfigureDeviceAlarms.value.toggle(null, configureDeviceAlarmsData.value);
               },
             },
             {
@@ -113,16 +112,26 @@
             },
             {
               label: '批量删除',
+              name: 'groupTemDownload',
               type: 'primary',
-              name: 'userBatchDel',
+              confirm: true,
               dynamicDisabled: (data: any) => {
                 return data.list.length === 0;
               },
-              confirm: true,
+              handle: (data: any) => {
-              isReload: true,
+                let ids = [];
-              isClearCheck: true,
+                data.list.forEach((item) => {
-              // api: origanizemanage.batchDel,
+                  ids.push(item.id);
-              dynamicParams: { userIds: 'userId[]' },
+                });
+                data.list = [];
+                http.post(deviceAlarms.configDel, { ids: ids.toString() }).then(() => {
+                  NsMessage.success('告警规则删除成功');
+                  //清空选中
+                  mainRef.value.nsTableRef.clearCheck();
+                  //刷新表单
+                  mainRef.value?.nsTableRef.reload();
+                });
+              },
             },
           ],
           columns: [
@@ -139,20 +148,19 @@
             },
             {
               title: '设备信息',
-              dataIndex: 'equipmentInfo',
+              dataIndex: 'deviceInfo',
             },
             {
               title: '告警点位',
-              dataIndex: 'devicePoint',
+              dataIndex: 'devicePointName',
             },
             {
               title: '判断条件',
-              dataIndex: 'ruleType',
+              dataIndex: 'conditionalJudgment',
             },
             {
               title: '取值类型',
               dataIndex: 'valueType',
-              textEllipsis: true,
             },
             {
               title: '异常描述',
@@ -172,7 +180,7 @@
                 name: 'FeedBackDetail',
                 dynamicParams: ['uuid', 'appealType'],
                 handle: (data: any) => {
-                  editConfigureDeviceAlarms.value.toggle(data);
+                  editConfigureDeviceAlarms.value.toggle(data, configureDeviceAlarmsData);
                 },
               },
               {
@@ -181,8 +189,10 @@
                 dynamicParams: ['uuid', 'appealType'],
                 confirm: true,
                 handle: () => {
-                  // mockData.value.splice(0, 1);
+                  http.post(deviceAlarms.configDel, { ids: data.id }).then(() => {
-                  console.log(data, 'xxxxxxx');
+                    NsMessage.success('规则删除成功');
+                    mainRef.value?.nsTableRef.reload();
+                  });
                 },
               },
             ],
@@ -191,60 +201,73 @@
             title: value.errorCode,
             schemas: [
               {
-                field: 'provider',
+                field: 'deviceName',
                 label: '设备名称',
-                component: 'NsInput',
+                component: 'nsSelectApi',
                 componentProps: {
-                  placeholder: '请输入设备名称',
+                  api: device.queryDevicePage,
+                  allowClear: true,
+                  params: {
+                    orgId: orgId.value,
+                    pageNum: 1,
+                    pageSize: 99,
+                  },
+                  placeholder: '请选择设备点位',
+                  resultField: 'data.records',
+                  labelField: 'deviceName',
+                  valueField: 'id',
+                  autoAddLink: true, //默认添加联动
                 },
               },
               {
-                field: 'provider',
+                field: 'devicePoint',
                 label: '设备点位',
                 component: 'nsSelectApi',
+                dynamicParams: {
+                  id: 'deviceName', //帮定上级联动数据
+                },
                 componentProps: {
-                  api: '/api/community/objs/DictItem',
+                  api: device.queryDevicePoint,
-                  params: {
+                  allowClear: true,
-                    pageSize: 100,
-                    code: 'MZ',
-                  },
-                  placeholder: '请选择设备点位',
                   resultField: 'data',
-                  labelField: 'dictName',
+                  placeholder: '请选择设备点位',
-                  valueField: 'dictValue',
+                  labelField: 'code',
-                  immediate: true,
+                  valueField: 'id',
-                  autoSelectFirst: false,
+                  dependency: 'deviceName',
                 },
               },
               {
-                field: 'payWay',
+                field: 'enableRules',
                 label: '启用状态',
                 component: 'NsSelect',
                 componentProps: {
                   placeholder: '请选择启用状态',
+                  allowClear: true,
                   options: [
                     {
                       label: '启用',
-                      value: '1',
+                      value: 1,
                     },
                     {
                       label: '关闭',
-                      value: '0',
+                      value: 0,
                     },
                   ],
                 },
               },
               {
-                field: 'provider',
+                field: 'abnormalDescription',
                 label: '异常描述',
                 component: 'NsInput',
+
                 componentProps: {
+                  allowClear: true,
                   placeholder: '请输入异常描述关键字',
                 },
               },
             ],
           },
-          params: { id: value.id },
+          params: { equipmentAlarmId: value.id },
           // pagination: { pageSizeOptions: false },
           rowKey: 'id',
         };
@@ -255,6 +278,9 @@
         clickSwitch,
         doWnload,
         tableConfig,
+        orgId,
+        mainRef,
+        editObject,
         editConfigureDeviceAlarms,
         setconfigureDeviceAlarmsData,
       };

hx-ai-intelligent/src/view/alarmManagement/alarmSettings/equipmentAlarm/editConfigureDeviceAlarm.vue

@@ -6,7 +6,8 @@
     :footer-style="{ textAlign: 'right' }"
     :ok="btnClick"
     :cancel="handleClose"
-    placement="right">
+    placement="right"
+    @close="handleClose">
     <div style="padding: 18px; width: 100%; overflow: hidden">
       <a-form ref="formRef" :model="infoObject" :rules="rules">
         <a-form-item ref="site" label="站点" name="site">
@@ -18,8 +19,13 @@
             placeholder="请选择站点"
             allow-clear
             tree-default-expand-all
-            :tree-data="zdTreeData"
+            :field-names="{
-            tree-node-filter-prop="label" />
+              children: 'linkList',
+              label: 'orgName',
+              value: 'orgId',
+            }"
+            :tree-data="siteDataTree"
+            tree-node-filter-prop="orgName" />
         </a-form-item>
         <a-form-item label="设备类型" name="deviceType">
           <a-cascader
@@ -30,7 +36,7 @@
               label: 'deviceType',
               value: 'id',
             }"
-            :show-search="{ filter }"
+            :show-search="{ filterDeviceType }"
             @change="selectDeviceType"
             placeholder="请选择设备类型" />
         </a-form-item>
@@ -54,14 +60,12 @@
             v-model:value="infoObject.devicePoint"
             show-search
             placeholder="请选择设备点位"
-            :disabled="!infoObject?.deviceName"
             style="width: 100%"
-            :options="dwOptions"
+            :disabled="!infoObject?.deviceName"
-            :filter-option="filterOption"
+            :options="devicePointData"
-            @focus="handleFocus"
+            :filter-option="filterDevicePoint" />
-            @change="handleChange" />
         </a-form-item>
-        <a-form-item label="启用规则" name="enableRules">
+        <a-form-item label="启用规则">
           <a-switch
             :checked="infoObject.enableRules === 1 ? true : false"
             :class="{
@@ -73,12 +77,9 @@
         <a-form-item label="取值类型" name="valueType">
           <a-select
             v-model:value="infoObject.valueType"
-            show-search
             placeholder="请选择取值类型"
             style="width: 100%"
-            :options="qzOptions"
+            :options="qzOptions" />
-            :filter-option="filterOption"
-            @change="handleQzChange" />
         </a-form-item>
         <a-form-item label="异常描述" name="abnormalDescription">
           <a-textarea
@@ -107,8 +108,7 @@
             <a-select
               v-model:value="infoObject.alarmList[index - 1].logic"
               style="width: 70px; margin-left: 12px"
-              :options="ljOptions"
+              :options="ljOptions" />
-              @change="handleQzChange" />
             <span style="line-height: 32px; margin-left: 32px">{{ `数值${index}:` }}</span>
             <a-input
               style="width: 65px; margin-left: 6px"
@@ -124,8 +124,8 @@
           </div>
           <div
             v-if="
-              infoObject.alarmList[index - 1].num === null ||
+              infoObject.alarmList[index - 1]?.num === null ||
-              infoObject.alarmList[index - 1].logic === null
+              infoObject.alarmList[index - 1]?.logic === null
             "
             style="width: 100%; color: #ff4d4f; text-align: center; margin-bottom: 5px">
             请选择正确的逻辑{{ index }} 或 输入正确的数值{{ index }}
@@ -145,19 +145,22 @@
 </template>
 <script lang="ts" setup>
   import { NsMessage } from '/nerv-lib/component';
-  import { ref, toRaw, watch } from 'vue';
+  import { ref, toRaw } from 'vue';
-  import type { CascaderProps, TreeSelectProps, SelectProps } from 'ant-design-vue';
+  import type { SelectProps } from 'ant-design-vue';
   import type { ShowSearchType } from 'ant-design-vue/es/cascader';
   import { device } from '/@/api/deviceManage';
+  import { deviceAlarms } from '/@/api/alarmSettings/deviceAlarms';
+
   import { http } from '/nerv-lib/util';
 
   import type { Rule } from 'ant-design-vue/es/form';
   import { async } from '@antv/x6/lib/registry/marker/async';
 
   const visible = ref(false);
+  // 父级数据
+  const equipmentAlarm = ref({});
   //表单数据
   const infoObject = ref({
-    id: null,
     site: null,
     ruleType: null,
     abnormalDescription: null,
@@ -166,7 +169,7 @@
     valueType: null,
     deviceName: null,
     enableRules: 0,
-    alarmList: [{ id: null, alarm: null, number: null, isDelete: '0' }],
+    alarmList: [{ logic: null, num: null, isDelete: 0 }],
   });
   //删除的逻辑列表
   const delAlarmList = ref([]);
@@ -176,18 +179,8 @@
   const result = JSON.parse(sessionStorage.getItem('ORGID')!);
   orgId.value = result;
   //站点数
-  const zdTreeData = ref<TreeSelectProps['treeData']>([
+  const siteDataTree = ref([]);
-    {
+
-      label: '铁路总局(T01)',
-      value: 'T01',
-      children: [
-        {
-          label: '济阳站(T0101)',
-          value: 'T0101',
-        },
-      ],
-    },
-  ]);
   //设备类型树
   let deviceTypeTreeData = ref([]);
   //设备树
@@ -216,62 +209,44 @@
   };
   //获取设备点位
   const getDevicePoint = (value: any) => {
+    devicePointData.value = [];
     http.post(device.queryDevicePoint, value).then((res) => {
       if (res.msg === 'success') {
-        console.log(res, '数据');
+        res.data.forEach((item: any) => {
+          devicePointData.value.push({
+            value: item.id,
+            label: item.code + ' ( ' + item.unit + ' ) ',
+          });
+        });
       }
     });
   };
   //设备点位
-  const dwOptions = ref<SelectProps['options']>([
+  const devicePointData = ref([]);
-    { value: '电压 (U)', label: '电压 (U)', code: '1' },
+  //设备点位搜索
-    { value: '电流 (I)', label: '电流 (I)', code: '2' },
+  const filterDevicePoint = (input: string, option: any) => {
-    { value: '电流 (I)', label: 'a相电流 (Ia)', code: '3' },
+    return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
-  ]);
+  };
-  const filter: ShowSearchType['filter'] = (inputValue: any, path: any) => {
+  //搜索设备类型
+  const filterDeviceType: ShowSearchType['filter'] = (inputValue: any, path: any) => {
     return path.some(
-      (option: any) => option.label.toLowerCase().indexOf(inputValue.toLowerCase()) > -1,
+      (option: any) => option.deviceType.toLowerCase().indexOf(inputValue.toLowerCase()) > -1,
     );
   };
   //取值类型
   const qzOptions = ref<SelectProps['options']>([
-    { value: '实时值', label: '实时值', code: '1' },
+    { value: 1, label: '实时值', code: '1' },
-    { value: '平均值', label: '平均值', code: '2' },
+    { value: 2, label: '平均值', code: '2' },
   ]);
   //逻辑
   const ljOptions = ref<SelectProps['options']>([
-    { value: '1', label: '≥' },
+    { value: 0, label: '≥' },
-    { value: '2', label: '>' },
+    { value: 1, label: '>' },
-    { value: '3', label: '≤' },
+    { value: 2, label: '≤' },
-    { value: '4', label: '<' },
+    { value: 3, label: '<' },
-    { value: '5', label: '=' },
+    { value: 4, label: '=' },
   ]);
-  //设备点位方法
+
-  const filterOption = (input: string, option: any) => {
-    console.log('搜索', option.value);
-    return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0;
-  };
-  const handleFocus = () => {
-    console.log('点击');
-  };
-  const handleChange = (value: string) => {
-    console.log(`selected ${value}`);
-    console.log('选择', infoObject.value.devicePoint);
-    //获得code
-    dwOptions.value.forEach((item) => {
-      if (item.value === value) {
-        console.log('符合', item.code);
-      }
-    });
-  };
-  const handleQzChange = (value: string) => {
-    //获得code
-    qzOptions.value.forEach((item) => {
-      if (item.value === value) {
-        console.log('符合', item.code);
-      }
-    });
-  };
   //开关
   const clickSwitch = () => {
     if (infoObject.value.enableRules === 1) {
@@ -313,7 +288,9 @@
     return null; // 没有找到目标节点，返回 null
   };
   //父调子 页面显示方法
-  const toggle = async (value: any) => {
+  const toggle = async (value: any, info: any) => {
+    equipmentAlarm.value = info;
+
     //获取设备类型
     await http
       .post(device.queryDeviceTree, { orgId: orgId.value, pageNum: 1, pageSize: 10 })
@@ -322,21 +299,36 @@
           deviceTypeTreeData.value = res.data;
         }
       });
+    // 获取站点数据
+    http.post('/carbon-smart/user/login/logInInfo', {}).then((res) => {
+      if (res.msg === 'success') {
+        siteDataTree.value = res.data.linkList;
+      }
+    });
+
     //判断 是新增 还是修改
     if (value) {
-      infoObject.value = value;
+      //获取详情接口
-      // 获取 选择的设备类型对象
+      await http.post(deviceAlarms.configFindById, { id: value.id }).then((res) => {
-      let selectDevice = ref([value.deviceType]);
+        if (res.msg === 'success') {
-      findNodeById(deviceTypeTreeData.value, value.deviceType);
+          infoObject.value = res.data;
-      //获取设备点位
+          // 获取 选择的设备类型对象
-      getDevicePoint({ id: 1 });
+          let selectDevice = ref([Number(infoObject.value.deviceType)]);
-      // 修改时
+          findNodeById(deviceTypeTreeData.value, Number(infoObject.value.deviceType));
-      findParentIds(deviceTypeTreeData.value, value.deviceType, selectDevice.value);
+          //获取设备点位
-      infoObject.value.deviceType = selectDevice.value;
+          getDevicePoint({ id: infoObject.value.deviceName });
+          // 回显 选择设备类型
+          findParentIds(deviceTypeTreeData.value, infoObject.value.deviceType, selectDevice.value);
+          infoObject.value.alarmList = infoObject.value.hxAlarmRuleLogicList || [];
+          delete infoObject.value.hxAlarmRuleLogicList;
+          infoObject.value.deviceType = selectDevice;
+          infoObject.value.ruleType = infoObject.value.ruleType + '';
+          console.log(infoObject.value, '数据');
+        }
+      });
     } else {
       //获取设备树
       infoObject.value = {
-        id: null,
         site: null,
         ruleType: null,
         abnormalDescription: null,
@@ -345,14 +337,14 @@
         valueType: null,
         deviceName: null,
         enableRules: 0,
-        alarmList: [{ id: null, alarm: null, number: null, isDelete: '0' }],
+        alarmList: [{ logic: null, num: null, isDelete: 0 }],
       };
     }
 
     visible.value = !visible.value;
   };
   //表单 判断规格
-  const rules: infoObject<string, Rule[]> = {
+  const rules = {
     site: [{ required: true, message: '请选择站点', trigger: 'change' }],
     deviceType: [{ required: true, message: '请选择设备类型', trigger: 'change' }],
     enableRules: [{ required: true, message: '请选择启用规则', trigger: 'change' }],
@@ -360,20 +352,27 @@
     devicePoint: [{ required: true, message: '请选择设备点位', trigger: 'change' }],
     valueType: [{ required: true, message: '请选择取值类型', trigger: 'change' }],
     ruleType: [{ required: true, message: '请选择规则类型', trigger: 'change' }],
-    abnormalDescription: [{ required: true, message: '请输入异常描述', trigger: 'blur' }],
+    abnormalDescription: [
+      {
+        required: true,
+        message: '请输入异常描述',
+        trigger: 'blur',
+        validator: (rules: any, abnormalDescription: any, cbfn: any) => {
+          if (abnormalDescription.trim() !== '') {
+            cbfn();
+          } else {
+            cbfn('告警标题不能为空');
+          }
+        },
+      },
+    ],
     alarm: [{ required: true, message: '请选择逻辑', trigger: 'blur' }],
     number: [{ required: true, message: '请输入数值', trigger: 'blur' }],
   };
-  // 开关选择
-  const changeSwitch = () => {
-    console.log(infoObject.value.selectSwitch, '开关');
-  };
   // 确认按钮
   const btnClick = () => {
-    console.log(infoObject.value, '数据');
     infoObject.value.alarmList.forEach((item) => {
       if (item.logic === null || item.num === null) {
-        // NsMessage.error('请选择逻辑和数值');
         return;
       }
     });
@@ -383,51 +382,70 @@
     }
     //数据是否验证通过
     formRef.value.validate().then(() => {
-      console.log('values', infoObject.value);
+      let data = { ...infoObject.value };
-      let data = toRaw(infoObject);
+      // 配置关联id
-      //逻辑列表
+      data.equipmentAlarmId = equipmentAlarm.value.id;
-      data.alarmList = [...infoObject.value.alarmList, ...delAlarmList.value];
+      // 逻辑列表
-      //设备类型 只取最后一级的id
+      data.hxAlarmRuleLogicList = [...infoObject.value.alarmList, ...delAlarmList.value];
+      data.hxAlarmRuleLogicList.forEach((item) => {
+        const num = Number(item.num);
+        if (!isNaN(num)) {
+          item.num = Number(num.toFixed(2));
+        } else {
+          item.num = 0; // 可以设置为0或其他默认值
+        }
+      });
+      // 设备类型 只取最后一级的id
       data.deviceType = infoObject.value.deviceType[infoObject.value.deviceType.length - 1];
-      delAlarmList.value = [];
+      data.ruleType = Number(data.ruleType);
+      data.errorCode = equipmentAlarm.value.errorCode;
+      delete data.alarmList;
+      // 发起 HTTP POST 请求
+      http
+        .post(deviceAlarms.configAddOrUpNewData, data)
+        .then((res) => {
+          if (res.msg === 'success') {
+            // 操作成功时的处理
+            if (data.id) {
+              NsMessage.success('告警规则编辑成功');
+            } else {
+              NsMessage.success('告警规则新增成功');
+            }
+            emit('editObject', null);
+            handleClose();
+          }
+        })
+        .catch((error) => {
+          // 错误处理
+          console.error('请求失败：', error);
+        });
     });
-    //调用接口
-    // http
-    //         .post(props.api, data)
-    //         .then(() => {
-    //           isLoading.value = false;
-    //           NsMessage.success('操作成功', 1, () => {
-    //             navigateBack();
-    //           });
-    //         })
-    //         .catch(() => {
-    //           isLoading.value = false;
-    //         });
   };
   //取消按钮
   const handleClose = () => {
     // 清楚校验错误信息
     formRef.value.resetFields();
+    siteDataTree.value = [];
     //对象清空
     infoObject.value = {
-      id: null,
       site: null,
       ruleType: null,
       abnormalDescription: null,
       deviceType: [],
       devicePoint: null,
       enableRules: 0,
-      alarmList: [{ id: null, alarm: null, number: null, isDelete: '0' }],
+      alarmList: [{ logic: null, num: null, isDelete: 0 }],
     };
     visible.value = false;
+    //清空删除列表
     delAlarmList.value = [];
   };
   // 新增逻辑列表
   const addAlarmList = () => {
     if (infoObject.value.alarmList) {
-      infoObject.value.alarmList.push({ logic: null, num: null });
+      infoObject.value.alarmList.push({ logic: null, num: null, isDelete: 0 });
     } else {
-      infoObject.value.alarmList = [{ logic: null, num: null }];
+      infoObject.value.alarmList = [{ logic: null, num: null, isDelete: 0 }];
     }
   };
   // 删除 逻辑列表、
@@ -437,18 +455,15 @@
       const alarmItemToDelete = infoObject.value.alarmList[index];
       if (alarmItemToDelete?.id) {
         // 添加到 delAlarmList 中，并标记为已删除
-        delAlarmList.value.push({ ...alarmItemToDelete, isDelete: '1' });
+        delAlarmList.value.push({ ...alarmItemToDelete, isDelete: 1 });
       }
       // 从 infoObject 中删除该元素
       infoObject.value.alarmList.splice(index, 1);
-    } else {
-      console.error('Invalid index: ', index);
     }
   };
   defineExpose({
     toggle,
     handleClose,
-    dwOptions,
     formRef,
   });
 </script>

hx-ai-intelligent/src/view/alarmManagement/alarmSettings/equipmentAlarm/editeEquipmentAlarm.vue

@@ -2,11 +2,12 @@
   <ns-drawer
     v-model:visible="visible"
     width="520"
-    :title="infoObject?.id ? '修改设备告警' : '新增设备告警'"
+    :title="infoObject?.id ? '编辑告警' : '新增告警'"
     :footer-style="{ textAlign: 'right' }"
     :ok="btnClick"
     :cancel="handleClose"
-    placement="right">
+    placement="right"
+    @close="handleClose">
     <ns-form ref="formRef" :schemas="schemas" :model="infoObject" formLayout="vertical" />
     <div style="margin-left: 52px">
       应用规则:
@@ -67,6 +68,13 @@
                 required: true,
                 message: '告警标题不能为空',
                 trigger: 'change',
+                validator: (rules: any, alarmTitle: any, cbfn: any) => {
+                  if (alarmTitle && alarmTitle.trim() !== '') {
+                    cbfn();
+                  } else {
+                    cbfn('告警标题不能为空');
+                  }
+                },
               },
             ],
             componentProps: {
@@ -207,7 +215,11 @@
     formRef.value.triggerSubmit().then(() => {
       //调用接口
       http.post(deviceAlarms.addOrUpNewData, infoObject.value).then(() => {
-        NsMessage.success('操作成功');
+        if (infoObject.value.id) {
+          NsMessage.success('告警编辑成功');
+        } else {
+          NsMessage.success('告警创建成功');
+        }
         visible.value = false;
         emit('editObject', null);
       });
@@ -216,9 +228,7 @@
   const handleClose = () => {
     // 清楚校验错误信息
     formRef.value.formElRef.clearValidate();
-    console.log(infoObject.value);
     visible.value = false;
-    NsMessage.success('操作成功');
   };
   defineExpose({
     toggle,

hx-ai-intelligent/src/view/alarmManagement/alarmSettings/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="box">
-    <a-tabs default-active-key="1" @change="callback">
+    <a-tabs default-active-key="1">
       <a-tab-pane key="1" tab="通知管理">
         <ns-view-list-table v-bind="notificationConfig" ref="mainRef">
           <template #bodyCell="{ record, column }">
@@ -11,11 +11,14 @@
                   'blue-background': record.enableRules === 1 ? true : false,
                   'grey-background': record.enableRules === 1 ? false : true,
                 }"
-                @change="clickSwitch({ enableRules: record.enableRules, record: record })" />
+                @change="
+                  clickSwitch({ type: 1, enableRules: record.enableRules, record: record })
+                " />
             </template>
           </template>
         </ns-view-list-table>
         <!-- 联系方式 -->
+        <notificationManagement ref="notificationManagements" @editObject="editObject" />
       </a-tab-pane>
       <a-tab-pane key="2" tab="设备告警" force-render>
         <ns-view-list-table
@@ -31,12 +34,14 @@
                   'blue-background': record.enableRules === 1 ? true : false,
                   'grey-background': record.enableRules === 1 ? false : true,
                 }"
-                @change="clickSwitch({ enableRules: record.enableRules, record: record })" />
+                @change="
+                  clickSwitch({ type: 2, enableRules: record.enableRules, record: record })
+                " />
             </template>
             <template v-if="column.dataIndex === 'monitor'">
               {{
                 record?.monitorTime && record?.monitorTimeUnit
-                  ? record?.monitorTime + record?.monitorTimeUnit
+                  ? record?.monitorTime + '' + record?.monitorTimeUnit
                   : '-'
               }}
             </template>
@@ -45,7 +50,7 @@
         <a-button
           v-if="!equipmentAlarm"
           type="primary"
-          style="position: absolute; right: 130px; z-index: 99; top: 80px; height: 30px"
+          style="position: absolute; right: 130px; z-index: 3; top: 80px; height: 30px"
           @click="backequipmentAlarm"
           >返回</a-button
         >
@@ -68,19 +73,21 @@
                   'blue-background': record.enableRules === 1 ? true : false,
                   'grey-background': record.enableRules === 1 ? false : true,
                 }"
-                @click="clickSwitch({ enableRules: record.enableRules, record: record })" />
+                @click="
+                  clickSwitch({ type: 3, enableRules: record.enableRules, record: record })
+                " />
             </template>
           </template>
         </ns-view-list-table>
         <a-button
           v-if="!energyAlarm"
           type="primary"
-          style="position: absolute; right: 130px; z-index: 99; top: 80px; height: 30px"
+          style="position: absolute; right: 130px; z-index: 3; top: 80px; height: 30px"
           @click="backenergyAlarm"
           >返回</a-button
         >
         <!-- 新增 或 编辑 能源告警 -->
-        <editeEnergyAlarm ref="editeEnergyAlarm" @editObject="editObject" />
+        <editeEnergyAlarm ref="editeEnergyAlarm" @editObject="editeEnergyAlarmInfo" />
         <!-- 配置能源告警-->
         <configureEnergyAlarms v-show="!energyAlarm" ref="configureEnergyAlarms" />
       </a-tab-pane>
@@ -96,9 +103,11 @@
   import { NsMessage, NsModal } from '/nerv-lib/component';
   import editeEquipmentAlarm from './equipmentAlarm/editeEquipmentAlarm.vue';
   import editeEnergyAlarm from './energyAlarm/editeEnergyAlarm.vue';
+  import notificationManagement from './notificationManagement/index.vue';
   import configureEnergyAlarms from './energyAlarm/configureEnergyAlarms.vue';
   import configureDeviceAlarms from './equipmentAlarm/configureDeviceAlarms.vue';
   import { deviceAlarms } from '/@/api/alarmSettings/deviceAlarms';
+  import { energyAlarms } from '/@/api/alarmSettings/energyAlarm';
   import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
 
   export default {
@@ -107,6 +116,7 @@
       editeEquipmentAlarm,
       configureDeviceAlarms,
       configureEnergyAlarms,
+      notificationManagement,
       editeEnergyAlarm,
     },
     setup() {
@@ -114,16 +124,17 @@
       const mainRefEquipmentAlarm = ref();
       const mainEnergyAlarmConfig = ref();
       const editEquipmentAlarm = ref();
+      const notificationManagements = ref();
       const editeEnergyAlarm = ref();
       const configureDeviceAlarms = ref();
       const configureEnergyAlarms = ref();
       const equipmentAlarm = ref(true);
       const energyAlarm = ref(true);
-      const notificationConfig = notificationtableConfig(null, mainEnergyAlarmConfig, null);
+      const notificationConfig = notificationtableConfig(notificationManagements);
       //能源告警配置
       const energyAlarmConfig = energyAlarmConfigs(
         editeEnergyAlarm,
-        mainRefEquipmentAlarm,
+        mainEnergyAlarmConfig,
         energyAlarm,
         configureEnergyAlarms,
       );
@@ -134,9 +145,6 @@
         equipmentAlarm,
         configureDeviceAlarms,
       );
-      const callback = (key: any) => {
-        console.log(key);
-      };
       //返回设备告警
       const backequipmentAlarm = () => {
         equipmentAlarm.value = !equipmentAlarm.value;
@@ -147,38 +155,72 @@
         configureEnergyAlarms.value.show = false;
       };
       const clickSwitch = (data: any) => {
-        console.log(data.record.enableRules === 1 ? '关闭' : '启用');
         NsModal.confirm({
           title: '启用状态',
           icon: createVNode(ExclamationCircleOutlined),
-          content: '确定' + (data.record.enableRules === 1 ? '关闭' : '启用') + '吗?',
+          content:
+            '确定' +
+            (data.record.enableRules === 1 ? '关闭' : '启用') +
+            (data.type === 1 ? '通知' : '告警') +
+            '吗?',
           onOk: () => {
-            http
+            if (data.type === 1) {
-              .post(deviceAlarms.addOrUpNewData, {
+              //通知方式
-                id: data.record.id,
+              http
-                enableRules: data.record.enableRules === 1 ? 0 : 1,
+                .post(deviceAlarms.addOrUpNewData, {
-              })
+                  id: data.record.id,
-              .then(() => {
+                  enableRules: data.record.enableRules === 1 ? 0 : 1,
-                NsMessage.success('操作成功');
+                })
-                mainRefEquipmentAlarm.value?.nsTableRef.reload();
+                .then(() => {
-              });
+                  NsMessage.success(data.record.enableRules === 1 ? '通知已关闭' : '通知已启用');
+                  mainRef.value?.nsTableRef.reload();
+                });
+            }
+            //设备告警
+            if (data.type === 2) {
+              http
+                .post(deviceAlarms.addOrUpNewData, {
+                  id: data.record.id,
+                  enableRules: data.record.enableRules === 1 ? 0 : 1,
+                })
+                .then(() => {
+                  NsMessage.success(data.record.enableRules === 1 ? '告警已关闭' : '告警已启用');
+                  mainRefEquipmentAlarm.value?.nsTableRef.reload();
+                });
+            }
+            //能源告警
+            if (data.type === 3) {
+              http
+                .post(energyAlarms.addOrUpNewData, {
+                  id: data.record.id,
+                  enableRules: data.record.enableRules === 1 ? 0 : 1,
+                })
+                .then(() => {
+                  NsMessage.success(data.record.enableRules === 1 ? '告警已关闭' : '告警已启用');
+                  mainEnergyAlarmConfig.value?.nsTableRef.reload();
+                });
+            }
           },
         });
       };
-      // 编辑或添加成功 刷新列表
+      // 设备告警 编辑或添加成功 刷新列表
       const editObject = () => {
         mainRefEquipmentAlarm.value?.nsTableRef.reload();
-        // console.log(newList.value.formFinish, '数据');
+      };
+      // 能源告警 编辑或添加成功 刷新列表
+      const editeEnergyAlarmInfo = () => {
+        mainEnergyAlarmConfig.value?.nsTableRef.reload();
       };
       return {
-        callback,
         notificationConfig,
         energyAlarmConfig,
         equipmentAlarmConfig,
         editObject,
+        editeEnergyAlarm,
         clickSwitch,
         editEquipmentAlarm,
-        editeEnergyAlarm,
+        notificationManagements,
+        editeEnergyAlarmInfo,
         configureDeviceAlarms,
         configureEnergyAlarms,
         equipmentAlarm,

hx-ai-intelligent/src/view/alarmManagement/alarmSettings/notificationManagement/index.vue

@@ -0,0 +1,246 @@
+<template>
+  <ns-drawer
+    v-model:visible="visible"
+    width="520"
+    :title="' '"
+    :ok="btnClick"
+    :cancel="handleClose"
+    placement="right"
+    :footer-style="{ textAlign: 'right' }"
+    @close="handleClose">
+    <div style="padding: 18px; width: 100%; overflow: hidden">
+      <a-form ref="formRef" :model="infoObject" :rules="rules">
+        <a-form-item ref="notification" label="通知方式" name="notification">
+          <a-select
+            ref="select"
+            v-model:value="infoObject.notification"
+            style="width: 100%"
+            mode="multiple"
+            :options="devicePointData"
+            show-search
+            :allowClear="true"
+            placeholder="请选择通知方式"
+            :filter-option="filterDevicePoint" />
+        </a-form-item>
+        <a-form-item label="启用规则" name="enableRules">
+          <a-switch
+            :checked="infoObject.enableRules === 1 ? true : false"
+            :class="{
+              'blue-background': infoObject.enableRules === 1 ? true : false,
+              'grey-background': infoObject.enableRules === 1 ? false : true,
+            }"
+            @click="clickSwitch" />
+        </a-form-item>
+        <a-form-item label="通知用户" name="user">
+          <a-cascader
+            v-model:value="infoObject.user"
+            style="width: 100%"
+            multiple
+            :max-tag-count="1"
+            :options="options"
+            :load-data="loadData"
+            placeholder="请选择通知用户"
+            :show-checked-strategy="Cascader.SHOW_CHILD" />
+        </a-form-item>
+      </a-form>
+      <a-table :dataSource="dataSource" :columns="columns" :pagination="false" />
+    </div>
+  </ns-drawer>
+</template>
+<script lang="ts" setup>
+  import { ref } from 'vue';
+  import { Cascader } from 'ant-design-vue';
+
+  import { NsMessage } from '/nerv-lib/component';
+  import { http } from '/nerv-lib/util';
+
+  // import { deviceAlarms } from '/@/api/alarmSettings/deviceAlarms';
+
+  //table 数据
+  const columns = [
+    {
+      title: '序号',
+      dataIndex: 'address',
+      customRender: (text: any) => {
+        return text.index + 1;
+      },
+    },
+    {
+      title: '通知名单',
+      dataIndex: 'name',
+      key: 'name',
+    },
+  ];
+  const dataSource = [
+    {
+      name: '运维>运维1部>张三',
+    },
+    {
+      name: '运维>运维1部>李四',
+    },
+  ];
+  const visible = ref(false);
+  //表单数据
+  const infoObject = ref({
+    enableRules: 0,
+  });
+  //设备点位搜索
+  const filterDevicePoint = (input: string, option: any) => {
+    return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
+  };
+  //开关
+  const clickSwitch = () => {
+    if (infoObject.value.enableRules === 1) {
+      infoObject.value.enableRules = 0;
+    } else {
+      infoObject.value.enableRules = 1;
+    }
+  };
+  // 通知信息
+  const devicePointData = ref([
+    { label: '站内信息', value: 1 },
+    { label: '邮件', value: 2 },
+  ]);
+  //通知用户
+  const options = ref([
+    {
+      value: 1,
+      label: 'Zhejiang',
+      isLeaf: false,
+    },
+    {
+      value: 2,
+      label: 'Jiangsu',
+      isLeaf: false,
+    },
+  ]);
+  //加载用户
+  const loadData = (selectedOptions: any) => {
+    const targetOption = selectedOptions[selectedOptions.length - 1];
+    targetOption.loading = true;
+    // load options lazily
+    setTimeout(() => {
+      targetOption.loading = false;
+      console.log(targetOption, '数据');
+      targetOption.children = [
+        {
+          label: `${targetOption.label} Dynamic 1`,
+          value: 3,
+          isLeaf: false,
+        },
+        {
+          label: `${targetOption.label} Dynamic 2`,
+          value: 4,
+          isLeaf: false,
+        },
+      ];
+      options.value = [...options.value];
+    }, 1000);
+  };
+
+  const rules = {
+    notification: [{ required: true, message: '请选择站点', trigger: 'change' }],
+    enableRules: [{ required: true, message: '请选择启用规则', trigger: 'change' }],
+    user: [{ required: true, message: '请选择通知人', trigger: 'change' }],
+    abnormalDescription: [
+      {
+        required: true,
+        message: '请输入异常描述',
+        trigger: 'blur',
+        validator: (rules: any, abnormalDescription: any, cbfn: any) => {
+          if (abnormalDescription.trim() !== '') {
+            cbfn();
+          } else {
+            cbfn('告警标题不能为空');
+          }
+        },
+      },
+    ],
+    alarm: [{ required: true, message: '请选择逻辑', trigger: 'blur' }],
+    number: [{ required: true, message: '请输入数值', trigger: 'blur' }],
+  };
+  const formRef = ref();
+  const emit = defineEmits(['editObject']);
+  const toggle = (value: any) => {
+    //判断 是新增 还是修改
+    if (value) {
+      // infoObject.value = value;
+      infoObject.value = {};
+    } else {
+      infoObject.value = {
+        enableRules: 0,
+      };
+    }
+    visible.value = !visible.value;
+  };
+
+  const btnClick = () => {
+    console.log(infoObject.value);
+    //表单校验
+    formRef.value.validate().then(() => {
+      //调用接口
+      // http.post(deviceAlarms.addOrUpNewData, infoObject.value).then(() => {
+      //   NsMessage.success('操作成功');
+      //   visible.value = false;
+      //   emit('editObject', null);
+      // });
+    });
+  };
+  const handleClose = () => {
+    // 清楚校验错误信息
+    formRef.value.resetFields();
+    visible.value = false;
+    options.value = [
+      {
+        value: 'zhejiang',
+        label: 'Zhejiang',
+        isLeaf: false,
+      },
+      {
+        value: 'jiangsu',
+        label: 'Jiangsu',
+        isLeaf: false,
+      },
+    ];
+  };
+  defineExpose({
+    toggle,
+    handleClose,
+    formRef,
+  });
+</script>
+<style scoped lang="less">
+  .drawerContainer {
+    height: 100%;
+    display: flex;
+    justify-content: space-between;
+  }
+  .blue-background.ant-switch-checked {
+    background-color: linear-gradient(
+      180deg,
+      rgba(1, 206, 255, 1) 0%,
+      rgba(0, 150, 229, 1) 100%
+    ) !important;
+  }
+
+  .grey-background.ant-switch {
+    background-color: grey !important;
+  }
+
+  .blue-background.ant-switch-checked .ant-switch-handle {
+    background-color: linear-gradient(
+      180deg,
+      rgba(1, 206, 255, 1) 0%,
+      rgba(0, 150, 229, 1) 100%
+    ) !important;
+  }
+
+  .grey-background.ant-switch .ant-switch-handle {
+    background-color: grey !important;
+  }
+  /deep/ .ant-form-item-label {
+    z-index: 20;
+    text-align: right;
+    width: 23%;
+  }
+</style>

hx-ai-intelligent/src/view/alarmManagement/alarmSettings/ts/energyAlarmConfig.ts

@@ -1,9 +1,7 @@
-import data from '../notificationManagementMock.json';
 import { http } from '/nerv-lib/util';
 import { NsMessage } from '/nerv-lib/component';
-import { deviceAlarms } from '/@/api/alarmSettings/deviceAlarms';
+import { energyAlarms } from '/@/api/alarmSettings/energyAlarm';
 
-import { ref } from 'vue';
 const tableKeyMap = [
   {
     title: '序号',
@@ -31,14 +29,13 @@ const tableKeyMap = [
   },
   {
     title: '监测时长',
-    dataIndex: 'monitor',
+    dataIndex: 'monitorFrequency',
   },
   {
     title: '是否启用',
     dataIndex: 'enableRules',
   },
 ];
-const mockData = ref(data.listData);
 const doWnload = (url: any) => {
   const a = document.createElement('a');
   document.body.appendChild(a);
@@ -51,14 +48,13 @@ const doWnload = (url: any) => {
 
 export const energyAlarmConfigs = (
   editeEnergyAlarm: any,
-  mainRefEquipmentAlarm: any,
+  mainEnergyAlarmConfig: any,
   energyAlarm: any,
   configureDeviceAlarms: any,
 ) => {
   return {
     title: '告警规则',
-    api: deviceAlarms.getTableList,
+    api: energyAlarms.getTableList,
-    value: mockData.value,
     headerActions: [
       {
         label: '新增',
@@ -73,7 +69,6 @@ export const energyAlarmConfigs = (
         name: 'groupImport',
         type: 'primary',
         extra: {
-          // api: props.postImportApi, // 导入接口名
           title: '设备信息', // 弹窗title
           templateName: 'whiteListUser', // 所使用的文件名称
           indexName: '设备id', // 匹配类型字段
@@ -122,9 +117,9 @@ export const energyAlarmConfigs = (
           dynamicParams: ['uuid', 'appealType'],
           confirm: true,
           handle: (data: any) => {
-            http.post(deviceAlarms.del, { id: data.id }).then(() => {
+            http.post(energyAlarms.del, { id: data.id }).then(() => {
               NsMessage.success('操作成功');
-              mainRefEquipmentAlarm.value?.nsTableRef.reload();
+              mainEnergyAlarmConfig.value?.nsTableRef.reload();
             });
           },
         },
@@ -139,6 +134,7 @@ export const energyAlarmConfigs = (
           component: 'NsSelect',
           componentProps: {
             placeholder: '请选择告警优先级',
+            allowClear: true,
             options: [
               {
                 label: '紧急',
@@ -160,6 +156,7 @@ export const energyAlarmConfigs = (
           label: '告警标题',
           component: 'NsInput',
           componentProps: {
+            allowClear: true,
             placeholder: '请输入告警标题关键字',
           },
         },
@@ -168,6 +165,7 @@ export const energyAlarmConfigs = (
           label: '错误码',
           component: 'NsInput',
           componentProps: {
+            allowClear: true,
             placeholder: '请输入告警错误码',
           },
         },
@@ -176,6 +174,7 @@ export const energyAlarmConfigs = (
           label: '启用状态',
           component: 'NsSelect',
           componentProps: {
+            allowClear: true,
             placeholder: '请选择启用状态',
             options: [
               {

hx-ai-intelligent/src/view/alarmManagement/alarmSettings/ts/equipmentAlarmConfig.ts

@@ -123,7 +123,7 @@ export const equipmentAlarmTableConfig = (
           confirm: true,
           handle: (data: any) => {
             http.post(deviceAlarms.del, { id: data.id }).then(() => {
-              NsMessage.success('操作成功');
+              NsMessage.success('告警删除成功');
               mainRefEquipmentAlarm.value?.nsTableRef.reload();
             });
           },
@@ -139,6 +139,7 @@ export const equipmentAlarmTableConfig = (
           component: 'NsSelect',
           componentProps: {
             placeholder: '请选择告警优先级',
+            allowClear: true,
             options: [
               {
                 label: '紧急',
@@ -160,6 +161,7 @@ export const equipmentAlarmTableConfig = (
           label: '告警标题',
           component: 'NsInput',
           componentProps: {
+            allowClear: true,
             placeholder: '请输入告警标题关键字',
           },
         },
@@ -168,6 +170,7 @@ export const equipmentAlarmTableConfig = (
           label: '错误码',
           component: 'NsInput',
           componentProps: {
+            allowClear: true,
             placeholder: '请输入错误码关键字',
           },
         },
@@ -177,6 +180,7 @@ export const equipmentAlarmTableConfig = (
           component: 'NsSelect',
           componentProps: {
             placeholder: '请选择启用状态',
+            allowClear: true,
             options: [
               {
                 label: '启用',

hx-ai-intelligent/src/view/alarmManagement/alarmSettings/ts/notificationManagementConfig.ts

@@ -41,7 +41,7 @@ const tableKeyMap = [
   },
 ];
 const mockData = ref(data.listData);
-export const notificationtableConfig = (el) => {
+export const notificationtableConfig = (notificationManagements: any) => {
   return {
     title: '告警规则',
     // api: '/carbon_emission/device/getDeviceList',
@@ -57,7 +57,7 @@ export const notificationtableConfig = (el) => {
           name: 'FeedBackDetail',
           dynamicParams: ['uuid', 'appealType'],
           handle: (data: any) => {
-            console.log(data, '联系方式');
+            notificationManagements.value.toggle(data);
           },
         },
       ],

hx-ai-intelligent/src/view/carbonEmissionManage/carbonEmissionFactorLibrary/index.vue

@@ -82,7 +82,6 @@
       @close="onClose">
       <ns-form
         ref="formRef"
-        :schemas="formSchema"
         :model="formData"
         class="form"
         :wrapperCol="{ span: 20 }"
@@ -135,7 +134,9 @@ import { log } from 'node:console';
   const casData = ref([]);
   const treeData = ref([]);
   const userAuthList = ref([]);
-  const orgId = JSON.parse(sessionStorage.getItem(import.meta.env.VITE_PUBLIC_PATH)).orgId;
+  const orgId = ref('');
+  const result = JSON.parse(sessionStorage.getItem('ORGID')!);
+  orgId.value = result;
   const dynamicDisabled = computed(() => {
     return formRef.value?.validateResult && userAuthList.value?.length;
   });
@@ -493,7 +494,7 @@ import { log } from 'node:console';
         isReload: true,
         isClearCheck: true,
         api: carbonEmissionFactorLibrary.del,
-        dynamicParams: { id: 'id[]' },
+        dynamicParams: { ids: 'id[]' },
       },
     ],
     columns: [
@@ -573,7 +574,7 @@ import { log } from 'node:console';
         {
           label: '删除',
           name: 'userDelete',
-          dynamicParams: 'id',
+          dynamicParams: { ids: 'id[]' },
           confirm: true,
           isReload: true,
           api: carbonEmissionFactorLibrary.del,
@@ -617,11 +618,27 @@ import { log } from 'node:console';
             options: [
               {
                 label: 'CO2',
-                value: 0,
+                value: 'CO2',
               },
               {
                 label: 'CO2e',
-                value: 1,
+                value: 'CO2e',
+              },
+              {
+                label: 'SF6',
+                value:'SF6',
+              },
+              {
+                label: 'CH4',
+                value: 'CH4',
+              },
+              {
+                label: 'PFCs',
+                value: 'PFCs',
+              },
+              {
+                label: 'HFCs',
+                value: 'HFCs',
               },
             ],
           },

hx-ai-intelligent/src/view/carbonEmissionManage/carbonEmissionStatistics/carbonEmissions/index copy.vue

@@ -0,0 +1,179 @@
+<template>
+  <a-table :columns="columns" :data-source="data" bordered />
+</template>
+
+<script lang="ts">
+  import { defineComponent, watch, ref, onMounted } from 'vue';
+  import type { TableColumnType } from 'ant-design-vue';
+  import { inject } from 'vue';
+
+  // let data: any[] = [];
+
+  export default defineComponent({
+    name: 'EnvironmentTable',
+    setup() {
+      let data = ref<any[]>([]);
+      let columns = ref<TableColumnType[]>([]);
+
+      interface PageData {
+        tableList: any[];
+        tableColumns: any[];
+        graphList: any[];
+      }
+      const pageData = inject<PageData>('pageData');
+
+      if (!pageData) {
+        throw new Error('pageData is not provided');
+      }
+      // 监听 pageData 的变化
+      watch(
+        () => pageData as PageData,
+        (_newValue, _oldValue) => {
+          data.value = pageData.tableList;
+
+          let columnA: any[] = [...column];
+          columnA.push(...pageData.tableColumns);
+          columns.value = columnA;
+          // pageData.graphList;
+          // 执行你的逻辑代码
+        },
+        { deep: true },
+      );
+
+      const getRowSpan = (dataIndex: string, record: any, data: any, dependents: string[] = []) => {
+        let rowSpan = 1;
+        for (let i = data.indexOf(record) + 1; i < data.length; i++) {
+          let shouldMerge = true;
+          for (const dependent of dependents) {
+            if (data[i][dependent] !== record[dependent]) {
+              shouldMerge = false;
+              break;
+            }
+          }
+          if (shouldMerge && data[i][dataIndex] === record[dataIndex]) {
+            rowSpan++;
+          } else {
+            break;
+          }
+        }
+        return rowSpan;
+      };
+
+      const column: TableColumnType[] = [
+        {
+          title: '序号',
+          dataIndex: 'key',
+          customCell: (record, rowIndex) => {
+            if (rowIndex == undefined) {
+              return {
+                rowSpan: 0,
+                colSpan: 0,
+              };
+            }
+            const rowSpan = getRowSpan('name', record, data.value);
+            if (rowIndex != 0 && data.value[rowIndex - 1].key == record.key) {
+              return {
+                rowSpan: 0,
+                colSpan: 0,
+              };
+            }
+            return {
+              rowSpan: rowSpan,
+            };
+          },
+        },
+        {
+          title: '设备名称',
+          dataIndex: 'name',
+          customCell: (record, rowIndex) => {
+            if (rowIndex == undefined) {
+              return {
+                rowSpan: 0,
+                colSpan: 0,
+              };
+            }
+            const rowSpan = getRowSpan('name', record, data.value);
+            if (rowIndex != 0 && data.value[rowIndex - 1].name == record.name) {
+              return {
+                rowSpan: 0,
+                colSpan: 0,
+              };
+            }
+            return {
+              rowSpan: rowSpan,
+            };
+          },
+        },
+        {
+          title: '设备点位',
+          dataIndex: 'position',
+          customCell: (record, rowIndex) => {
+            if (rowIndex == undefined) {
+              return {
+                rowSpan: 0,
+                colSpan: 0,
+              };
+            }
+            const rowSpan = getRowSpan('position', record, data.value, ['name']);
+            if (
+              rowIndex != 0 &&
+              data.value[rowIndex - 1].name == record.name &&
+              data.value[rowIndex - 1].position == record.position
+            ) {
+              return {
+                rowSpan: 0,
+                colSpan: 0,
+              };
+            }
+            return {
+              rowSpan: rowSpan,
+            };
+          },
+        },
+        {
+          title: '计量单位',
+          dataIndex: 'unit',
+          customCell: (record, rowIndex) => {
+            if (rowIndex == undefined) {
+              return {
+                rowSpan: 0,
+                colSpan: 0,
+              };
+            }
+            const rowSpan = getRowSpan('unit', record, data.value, ['name', 'position']);
+            if (
+              rowIndex != 0 &&
+              data.value[rowIndex - 1].name == record.name &&
+              data.value[rowIndex - 1].position == record.position &&
+              data.value[rowIndex - 1].unit == record.unit
+            ) {
+              return {
+                rowSpan: 0,
+                colSpan: 0,
+              };
+            }
+            return {
+              rowSpan: rowSpan,
+            };
+          },
+        },
+      ];
+
+      onMounted(() => {
+        data.value = pageData.tableList;
+
+        let columnA: any[] = [...column];
+        columnA.push(...pageData.tableColumns);
+        columns.value = columnA;
+      });
+      return {
+        data,
+        column,
+        columns,
+        pageData,
+      };
+    },
+  });
+</script>
+
+<style lang="less" scoped></style>

hx-ai-intelligent/src/view/carbonEmissionManage/carbonEmissionStatistics/carbonEmissions/index.vue

@@ -0,0 +1,82 @@
+<template>
+  <div>
+    <a-table 
+      :columns="tableColumns" 
+      :data-source="data" 
+      bordered
+      :pagination="false"
+      :scroll="{ x: 2000 }">
+      <template #title>
+        <a-date-picker v-model:value="selectYear" picker="year" @change="changeYearData" />
+      </template>
+    </a-table>
+      <a-pagination 
+        :current="queryParams.pageNum"
+        :total="total"
+        :page-size="queryParams.pageSize"
+        style="display: flex;justify-content: center;margin-top: 16px;"
+        :show-size-changer="true"
+        :show-quick-jumper="true"
+        @change="onChange" />
+  </div>
+</template>
+<script lang="ts" setup>
+  import { ref } from 'vue';
+  import { http } from '/nerv-lib/util/http';
+  import { Pagination } from 'ant-design-vue';
+  import { tableColumns } from '../config';
+  import { energyConsumption } from '/@/api/carbonEmissionFactorLibrary';
+  defineOptions({
+    energyType: 'CarbonEmissions', // 与页面路由name一致缓存才可生效
+    components: {
+      'a-pagination': Pagination,
+    },
+  });
+  const data = ref([]);
+  const selectYear = ref<Dayjs>();
+  const total = ref<number>()
+  const queryParams = ref({
+    pageNum: 1,
+    pageSize: 10,
+  })
+  const orgId = ref('');
+  const result = JSON.parse(sessionStorage.getItem('ORGID')!);
+  orgId.value = result;
+  const fetch = (api, params = { orgId } ) => {
+    return http.post(api, params);
+  };
+  
+  // 年份选择改变触发
+  const changeYearData = () => {
+    queryParams.value.year = selectYear.value.format('YYYY')
+    getTableList()
+  }
+  // 获取表格数据
+  const getTableList = () => {
+    fetch(energyConsumption.pageList , queryParams.value).then((res) => {
+      data.value = res.data.records
+      total.value = res.data.total
+    });
+  };
+    getTableList()
+  // 分页器
+  const onChange = (pageNumber: number,size: number) => {
+    queryParams.value.pageNum = pageNumber;
+    queryParams.value.pageSize = size;
+    getTableList()
+  };
+</script>
+<style scoped lang="less">
+  ::v-deep .ant-table-title{
+    display: flex;
+  }
+  ::v-deep .ant-table-container{
+    padding: 0px 16px;
+  }
+</style>
+<style scoped>
+  th.column-money,
+  td.column-money {
+    text-align: right !important;
+  }
+</style>

hx-ai-intelligent/src/view/carbonEmissionManage/carbonEmissionStatistics/config.ts

@@ -7,64 +7,70 @@ export const tableColumns = [
   },
   {
     title: '能源种类',
-    dataIndex: 'money',
+    dataIndex: 'energyType',
   },
   {
     title: '计量单位',
-    className: 'column-money',
+    className: 'unit',
-    dataIndex: 'money',
+    dataIndex: 'unit',
   },
   {
     title: '全年',
-    dataIndex: 'address',
+    dataIndex: 'yearly',
   },
   {
     title: '1月',
-    dataIndex: 'address',
+    dataIndex: 'jan',
+    // customRender: ({ text, record }) => ({
+    //   children: text,
+    //   attrs: {
+    //     style: record.janFlag === 1 ? 'color: red' : 'color: blue'
+    //   }
+    // })
   },
   {
     title: '2月',
-    dataIndex: 'address',
+    dataIndex: 'feb',
   },
   {
     title: '3月',
-    dataIndex: 'address',
+    dataIndex: 'mar',
   },
   {
     title: '4月',
-    dataIndex: 'address',
+    dataIndex: 'apr',
   },
   {
     title: '5月',
-    dataIndex: 'address',
+    dataIndex: 'may',
   },
   {
     title: '6月',
-    dataIndex: 'address',
+    dataIndex: 'jun',
   },
   {
     title: '7月',
-    dataIndex: 'address',
+    dataIndex: 'jul',
   },
   {
     title: '8月',
-    dataIndex: 'address',
+    dataIndex: 'aug',
   },
   {
     title: '9月',
-    dataIndex: 'address',
+    dataIndex: 'sep',
   },
   {
     title: '10月',
-    dataIndex: 'address',
+    dataIndex: 'oct',
   },
   {
     title: '11月',
-    dataIndex: 'address',
+    dataIndex: 'nov',
   },
   {
     title: '12月',
-    dataIndex: 'address',
+    dataIndex: 'dec',
   },
   {
     title: '操作',

hx-ai-intelligent/src/view/carbonEmissionManage/carbonEmissionStatistics/energyConsumption/index.vue

@@ -6,32 +6,35 @@
       bordered
       :pagination="false"
       :scroll="{ x: 2000 }">
-      <template #bodyCell="{ column, text }">
+      <template #bodyCell="{ column, text, record }">
         <template v-if="column.key === 'action'">
           <span>
-            <a>编辑</a>
+            <a @click="editData(record)">编辑</a>
             <a-divider type="vertical" />
-            <a>删除</a>
+            <a @click="delData(record)">删除</a>
           </span>
         </template>
       </template>
       <template #title>
-        <a-date-picker v-model:value="selectYear" picker="year" />
+        <a-date-picker v-model:value="selectYear" picker="year" @change="changeYearData" />
         <div class="buttonGroup">
           <a-button type="primary" @click="addNewData">新增</a-button>
           <a-button type="primary">导入</a-button>
           <a-button type="primary">导出</a-button>
           <a-button type="primary">模板下载</a-button>
-          <a-button type="primary">上传凭证</a-button>
+          <a-button type="primary" @click="uploadVoucher">上传凭证</a-button>
           <a-button type="primary">凭证下载</a-button>
         </div>
       </template>
     </a-table>
-    <a-pagination
+      <a-pagination 
-      :current="current"
+        :current="queryParams.pageNum"
-      :page-size="pageSize"
+        :total="total"
-      :total="0"
+        :page-size="queryParams.pageSize"
-      :show-total="(total, range) => `${range[0]}-${range[1]} of ${total} items`" />
+        style="display: flex;justify-content: center;margin-top: 16px;"
+        :show-size-changer="true"
+        :show-quick-jumper="true"
+        @change="onChange" />
     <!-- 新增数据库数据 -->
     <a-drawer
       :width="500"
@@ -47,94 +50,171 @@
         :label-col="labelCol"
         :wrapper-col="wrapperCol"
       >
-        <a-form-item ref="name" label="能源种类" name="name">
+        <a-form-item ref="name" label="能源种类" name="energyType">
-          <a-input v-model:value="formState.name" />
+          <a-input v-model:value="formState.energyType" placeholder="请输入能源种类" />
         </a-form-item>
-        <a-form-item label="计量单位">
+        <a-form-item label="计量单位" name="unit">
-          <a-cascader v-model:value="value" :options="options" placeholder="Please select" />
+          <a-cascader v-model:value="formState.unit" :options="options" />
         </a-form-item>
-        <a-form-item label="自动采集节点">
+        <a-form-item label="自动采集节点" name="collectionNode">
           <a-tree-select
-            v-model:value="treeValue"
+            v-model:value="formState.collectionNode"
-            style="width: 300px"
-            placeholder="Please select"
             :tree-line="true"
             :tree-data="treeData"
             tree-node-filter-prop="title"
           >
-            <template #title="{ value: val, title }">
-              <b v-if="val === 'parent 1-1'" style="color: #08c">sss</b>
-              <template v-else>{{ title }}</template>
-            </template>
           </a-tree-select>
         </a-form-item>
-        <a-form-item label="计算碳排" name="resource">
+        <a-form-item label="计算碳排" name="isComputeCarbon">
-          <a-radio-group v-model:value="formState.resource">
+          <a-radio-group v-model:value="formState.isComputeCarbon" @change="changeRadio">
-            <a-radio value="1">是</a-radio>
+            <a-radio :value="0">是</a-radio>
-            <a-radio value="2">否</a-radio>
+            <a-radio :value="1">否</a-radio>
           </a-radio-group>
         </a-form-item>
-        <a-form-item label="排放类型" name="region">
+        <a-form-item label="排放类型" name="emissionType" :required="isRequired">
-          <a-select v-model:value="formState.region" placeholder="请选择排放类型">
+          <a-select v-model:value="formState.emissionType" placeholder="请选择排放类型">
-            <a-select-option value="shanghai">Zone one</a-select-option>
+            <a-select-option v-for="(item, index) in emissionTypeDic" :key="index" :value="item.cnValue">
-            <a-select-option value="beijing">Zone two</a-select-option>
+              {{ item.cnValue }}
+            </a-select-option>
           </a-select>
         </a-form-item>
-        <a-form-item label="1月" name="delivery">
+        <a-row>
-          <a-switch v-model:checked="formState.delivery" />
+          <a-col :span="24" style="display:flex;justify-content: space-around;">
-        </a-form-item>
+            <a-form-item label="1月" name="janFlag" :label-col="switchLabelCol" :wrapper-col="switchWrapperCol">
+              <a-switch v-model:checked="formState.janFlag" :checked-value="1" :unCheckedValue="0" />
+            </a-form-item>
+            <a-form-item label="2月" name="febFlag" :label-col="switchLabelCol" :wrapper-col="switchWrapperCol">
+              <a-switch v-model:checked="formState.febFlag" :checked-value="1" :unCheckedValue="0" />
+            </a-form-item>
+            <a-form-item label="3月" name="marFlag" :label-col="switchLabelCol" :wrapper-col="switchWrapperCol">
+              <a-switch v-model:checked="formState.marFlag" :checked-value="1" :unCheckedValue="0" />
+            </a-form-item>
+          </a-col>
+          <a-col :span="24" style="display:flex;justify-content: space-around;">
+            <a-form-item label="4月" name="aprFlag" :label-col="switchLabelCol" :wrapper-col="switchWrapperCol">
+              <a-switch v-model:checked="formState.aprFlag" :checked-value="1" :unCheckedValue="0" />
+            </a-form-item>
+            <a-form-item label="5月" name="mayFlag" :label-col="switchLabelCol" :wrapper-col="switchWrapperCol">
+              <a-switch v-model:checked="formState.mayFlag" :checked-value="1" :unCheckedValue="0" />
+            </a-form-item>
+            <a-form-item label="6月" name="junFlag" :label-col="switchLabelCol" :wrapper-col="switchWrapperCol">
+              <a-switch v-model:checked="formState.junFlag" :checked-value="1" :unCheckedValue="0" />
+            </a-form-item>
+          </a-col>
+          <a-col :span="24" style="display:flex;justify-content: space-around;">
+            <a-form-item label="7月" name="julFlag" :label-col="switchLabelCol" :wrapper-col="switchWrapperCol">
+              <a-switch v-model:checked="formState.julFlag" :checked-value="1" :unCheckedValue="0" />
+            </a-form-item>
+            <a-form-item label="8月" name="augFlag" :label-col="switchLabelCol" :wrapper-col="switchWrapperCol">
+              <a-switch v-model:checked="formState.augFlag" :checked-value="1" :unCheckedValue="0" />
+            </a-form-item>
+            <a-form-item label="9月" name="sepFlag" :label-col="switchLabelCol" :wrapper-col="switchWrapperCol">
+              <a-switch v-model:checked="formState.sepFlag" :checked-value="1" :unCheckedValue="0" />
+            </a-form-item>
+          </a-col>
+          <a-col :span="24" style="display:flex;justify-content: space-around;">
+            <a-form-item label="10月" name="octFlag" :label-col="switchLabelCol" :wrapper-col="switchWrapperCol">
+              <a-switch v-model:checked="formState.octFlag" :checked-value="1" :unCheckedValue="0" />
+            </a-form-item>
+            <a-form-item label="11月" name="novFlag" :label-col="switchLabelCol" :wrapper-col="switchWrapperCol">
+              <a-switch v-model:checked="formState.novFlag" :checked-value="1" :unCheckedValue="0" />
+            </a-form-item>
+            <a-form-item label="12月" name="decFlag" :label-col="switchLabelCol" :wrapper-col="switchWrapperCol">
+              <a-switch v-model:checked="formState.decFlag" :checked-value="1" :unCheckedValue="0" />
+            </a-form-item>
+          </a-col>
+        </a-row>
       </a-form>
       <template #footer>
         <a-button style="margin-right: 8px" @click="onClose">取消</a-button>
         <a-button type="primary" @click="onSubmit">确定</a-button>
       </template>
     </a-drawer>
+    <!-- 上传凭证弹窗 -->
+    <a-modal :visible="openUpload" title="凭证上传" @ok="handleOk" @cancel="closeOpenUpload">
+      <a-upload-dragger
+        v-model:fileList="fileList"
+        name="file"
+        :multiple="true"
+        action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
+        @change="handleChange"
+        @drop="handleDrop"
+      >
+        <p class="ant-upload-drag-icon">
+          <inbox-outlined></inbox-outlined>
+        </p>
+        <p class="ant-upload-hint" style="display: flex;flex-direction: column;">
+          <p>1.仅支持pdf格式文件或文件夹</p>
+          <p>2.文件命名规则为【能源种类_年份】</p>
+          <p>3.每次上传自动覆盖</p>
+        </p>
+      </a-upload-dragger>
+    </a-modal>
   </div>
 </template>
 <script lang="ts" setup>
   import { ref,reactive, toRaw } from 'vue';
   import type { UnwrapRef } from 'vue';
   import type { Rule } from 'ant-design-vue/es/form';
-  import type { CascaderProps,TreeSelectProps  } from 'ant-design-vue';
+  import { Pagination,message,Modal   } from 'ant-design-vue';
+  import { InboxOutlined } from '@ant-design/icons-vue';
+  import type { CascaderProps,TreeSelectProps,UploadChangeParam } from 'ant-design-vue';
   import type { Dayjs } from 'dayjs';
   import { http } from '/nerv-lib/util/http';
   import { tableColumns } from '../config';
   import { energyConsumption } from '/@/api/carbonEmissionFactorLibrary';
+  import { dict } from '/@/api';
   defineOptions({
-    name: 'EnergyConsumption', // 与页面路由name一致缓存才可生效
+    energyType: 'EnergyConsumption', // 与页面路由name一致缓存才可生效
+    components: {
+      'a-pagination': Pagination,
+    },
   });
-  
+  const orgId = ref('');
-  const orgId = JSON.parse(sessionStorage.getItem(import.meta.env.VITE_PUBLIC_PATH)).orgId;
+  const result = JSON.parse(sessionStorage.getItem('ORGID')!);
-  const fetch = (api, params = { orgId }) => {
+  orgId.value = result;
+  const fetch = (api, params = { orgId } ) => {
     return http.post(api, params);
   };
   const selectYear = ref<Dayjs>();
-  const current = ref<number>(1);
+  const total = ref<number>()
-  const pageSize = ref<number>(10);
+  const queryParams = ref({
+    pageNum: 1,
+    pageSize: 10,
+  })
+  const isRequired = ref(false);
   const visible = ref(false);
-  const value = ref<string[]>([]);
+  const openUpload = ref<boolean>(false);
   const data = ref([]);
   interface FormState {
-    name: string;
+    energyType: string;
-    region: string | undefined;
+    unit: string;
-    delivery: boolean;
+    collectionNode: string;
-    resource: string;
+    emissionType: string | undefined;
+    isComputeCarbon: string;
+    janFlag: string;
+    febFlag: string;
+    marFlag: string;
+    aprFlag: string;
+    mayFlag: string;
+    junFlag: string;
+    julFlag: string;
+    augFlag: string;
+    sepFlag: string;
+    octFlag: string;
+    novFlag: string;
+    decFlag: string;
   }
   const formRef = ref();
   const labelCol = { span: 5 };
-  const wrapperCol = { span: 13 };
+  const wrapperCol = { span: 19 };
-  const formState: UnwrapRef<FormState> = reactive({
+  const switchLabelCol = { span: 10 };
-    name: '',
+  const switchWrapperCol = { span: 14 };
-    region: undefined,
+  const formState = ref({})
-    delivery: false,
-    resource: '',
-  });
   // 定义form表单的必填
   const rules: Record<string, Rule[]> = {
-    name: [
+    energyType: [{ required: true, message: '请输入能源种类', trigger: 'change' }],
-      { required: true, message: '请输入能源种类', trigger: 'change' },
+    isComputeCarbon: [{ required: true, message: '请选择是否计算碳排', trigger: 'change' }]
-    ],
-    resource: [{ required: true, message: 'Please select activity resource', trigger: 'change' }],
   };
   // 定义计量单位级联选择的变量
   const options: CascaderProps['options'] = [
@@ -171,8 +251,10 @@
       ],
     },
   ];
+  // const options = ref([])
+  // 排放类型的变量
+  const emissionTypeDic = ref()
   // 定义自动采集节点数的变量
-  const treeValue = ref<string>();
   const treeData = ref<TreeSelectProps['treeData']>([
     {
       title: 'parent 1',
@@ -199,34 +281,137 @@
       ],
     },
   ]);
+  // 年份选择改变触发
+  const changeYearData = () => {
+    queryParams.value.year = selectYear.value.format('YYYY')
+    getTableList()
+  }
   // 获取表格数据
   const getTableList = () => {
-    fetch(energyConsumption.pageList).then((res) => {
+    fetch(energyConsumption.pageList , queryParams.value).then((res) => {
-      console.log(res,'aaaaaa');
+      data.value = res.data.records
+      total.value = res.data.total
     });
   };
   getTableList()
+  // 分页器
+  const onChange = (pageNumber: number,size: number) => {
+    queryParams.value.pageNum = pageNumber;
+    queryParams.value.pageSize = size;
+    getTableList()
+  };
+  // 计算碳排切换
+  const changeRadio = (e) => {
+    if(e.target.value === 0){
+      isRequired.value = true
+    }else{
+      isRequired.value = false
+    }
+  };
   // 点击确定提交
   const onSubmit = () => {
     formRef.value
       .validate()
       .then(() => {
         console.log('values', formState, toRaw(formState));
+        if(formState.value.unit){
+          formState.value.unit = formState.value.unit.join(',')
+        }
+        if(formState.value.id){
+          fetch(energyConsumption.update , formState.value).then((res) => {
+            visible.value = false
+            message.success('操作成功！');
+            getTableList()
+          });
+        }else{
+          fetch(energyConsumption.creat , formState.value).then((res) => {
+            visible.value = false
+            message.success('操作成功！');
+            getTableList()
+          });
+        }
       })
       .catch(error => {
         console.log('error', error);
       });
   };
-  const resetForm = () => {
+  // 获取字典值
-    formRef.value.resetFields();
+  const getDictList = () => {
-  };
+    fetch(energyConsumption.getDicList , {grp: 'EMISSION_TYPE'}).then((res) => {
+      emissionTypeDic.value = res.data
+    });
+    // fetch(energyConsumption.getDicList , {grp: 'MEASUREMENT_UNIT'}).then((res) => {
+    //   options.value = res.data
+    // });
+  }
   // 点击新增按钮
   const addNewData = () => {
+    getDictList()
     visible.value = true
   }
+  // 点击编辑按钮
+  const editData = (record) =>{
+    getDictList()
+    visible.value = true
+    fetch(energyConsumption.findById , {id : record.id }).then((res) => {
+      if(res.data.unit){
+        res.data.unit = res.data.unit.split(',')
+      }
+      formState.value = res.data
+    });
+  };
+  // 点击删除
+  const delData = (record) => {
+    Modal.confirm({
+      title: '警告',
+      content: '确定要删除吗?',
+      okText: '确定',
+      okType: 'primary',
+      cancelText: '取消',
+      onOk() {
+        fetch(energyConsumption.del , {id : record.id }).then((res) => {
+          message.success('操作成功！');
+          getTableList()
+        });
+      },
+      onCancel() {
+        console.log('Cancel');
+      },
+    });
+  }
   // 关闭新增抽屉
   const onClose = () => {
     visible.value = false;
+    formRef.value.resetFields();
+  };
+  // 点击上传凭证按钮
+  const uploadVoucher = () => {
+    openUpload.value = true;
+  };
+  // 上传凭证弹窗点击确定
+  const handleOk = (e: MouseEvent) => {
+    console.log(e);
+    openUpload.value = false;
+  };
+  // 上传凭证相关方法及变量
+  const fileList = ref([]);
+  const handleChange = (info: UploadChangeParam) => {
+    const status = info.file.status;
+    if (status !== 'uploading') {
+      console.log(info.file, info.fileList);
+    }
+    if (status === 'done') {
+      message.success(`${info.file.name} 文件上传成功`);
+    } else if (status === 'error') {
+      message.error(`${info.file.name} 文件上传失败`);
+    }
+  };
+  function handleDrop(e: DragEvent) {
+    console.log(e);
+  }
+  // 关闭上传凭证弹窗
+  const closeOpenUpload = () =>{
+    openUpload.value = false;
   };
 </script>
 <style scoped lang="less">

hx-ai-intelligent/src/view/carbonEmissionManage/carbonEmissionStatistics/index.vue

@@ -1,18 +1,34 @@
 <template>
-  <a-tabs v-model:activeKey="activeKey">
+  <a-tabs v-model:activeKey="activeKey" @change="handleTabChange">
     <a-tab-pane key="1" tab="能耗统计">
       <energyConsumption ref="energyConsumptionRef" />
     </a-tab-pane>
-    <a-tab-pane key="2" tab="碳排统计" force-render>Content of Tab Pane 2</a-tab-pane>
+    <a-tab-pane key="2" tab="碳排统计" force-render>
-    <a-tab-pane key="3" tab="碳排速算">Content of Tab Pane 3</a-tab-pane>
+      <carbonEmissions ref="carbonEmissionsRef" />
+    </a-tab-pane>
+    <a-tab-pane key="3" tab="碳排速算">
+      <quickCalculation ref="quickCalculationRef" />
+    </a-tab-pane>
   </a-tabs>
 </template>
 <script lang="ts" setup>
   import { ref } from 'vue';
   import energyConsumption from './energyConsumption/index.vue';
+  import carbonEmissions from './carbonEmissions/index.vue';
+  import quickCalculation from './quickCalculation/index.vue';
   defineOptions({
     name: 'CarbonEmissionStatisticsIndex', // 与页面路由name一致缓存才可生效
   });
   const activeKey = ref('1');
+  // 切换tab页的回调
+  const handleTabChange = (key) => {
+    console.log('Tab changed:', key);
+    // 在这里可以执行需要在页面切换时执行的逻辑
+    // if(key==='1'){
+    //    if (energyConsumptionRef.value) {
+    //     energyConsumptionRef.value.getTableList(); // 调用子组件的方法
+    //   }
+    // }
+  };
 </script>
 

hx-ai-intelligent/src/view/carbonEmissionManage/carbonEmissionStatistics/quickCalculation/index.vue

@@ -0,0 +1,583 @@
+<!-- @format -->
+
+<template>
+  <div class="main">
+    <div class="left">
+      <div class="top">
+        <a-form style="width: 100%;margin: 0 auto;">
+          <div class="ns-form-title"><span>排放分类</span></div>
+          <div style="padding: 0 16px !important;width: 100%;">
+            <a-row>
+              <a-col :span="24" style="margin-bottom: 16px;">
+                <a-input-search
+                  v-model:value="selectTreeDataValue"
+                  placeholder="请输入关键词"
+                  @search="onSearchTreeData"
+                />
+              </a-col>
+            </a-row>
+          </div>
+        </a-form>
+        <a-tree
+          v-if="gData && gData.length > 0"
+          class="draggable-tree"
+          style="padding: 0 16px !important;"
+          draggable
+          show-line
+          checkable
+          block-node
+          :tree-data="gData"
+          :checkedKeys="checkedTreeNodeKeys"
+          :selectedKeys="selectedKeys"
+          @dragenter="onDragEnter"
+          @drop="onDrop"
+          @check="checkTreeNode"
+          @select="onSelect"
+          :expanded-keys="expandedKeys"
+          :auto-expand-parent="autoExpandParent"
+          @expand="onExpand">
+           <template #title="{ emissionName }">
+            <span v-if="emissionName && selectTreeDataValue && emissionName.indexOf(selectTreeDataValue) > -1">
+              {{ emissionName.substring(0, emissionName.indexOf(selectTreeDataValue)) }}
+              <span style="color: #f50">{{ selectTreeDataValue }}</span>
+              {{ emissionName.substring(emissionName.indexOf(selectTreeDataValue) + selectTreeDataValue.length) }}
+            </span>
+            <span v-else>{{ emissionName }}</span>
+          </template>
+        </a-tree>
+      </div>
+    </div>
+    <div class="right">
+      <ns-view-list-table v-bind="tableConfig" :model="data" ref="mainRef" :scroll="{ x: 2000}"/>
+    </div>
+    <!-- 新增树节点 -->
+    <ns-modal :visible="treeNodeAdd" :title="operationTree" @ok="handleOk" @cancel="handleCancel">
+      <ns-input
+        v-model:value="addTreeNode"
+        class="input"
+        placeholder="请输入排放类型"/>
+    </ns-modal>
+    <!-- 新增数据库数据 -->
+    <a-drawer
+      :width="500"
+      :visible="visible"
+      :body-style="{ paddingBottom: '80px' }"
+      :footer-style="{ textAlign: 'right' }"
+      destroyOnClose
+      @close="onClose">
+      <ns-form
+        ref="formRef"
+        :model="formData"
+        class="form"
+        :wrapperCol="{ span: 20 }"
+        formLayout="vertical" />
+      <template #footer>
+        <a-button style="margin-right: 8px" @click="onClose">取消</a-button>
+        <a-button type="primary" @click="onEdit">确定</a-button>
+      </template>
+    </a-drawer>
+  </div>
+</template>
+<script lang="ts" setup>
+  import { Modal } from 'ant-design-vue';
+  import { computed, createVNode, defineComponent, reactive, ref, watchEffect,watch } from 'vue';
+  import { http } from '/nerv-lib/util/http';
+  import { NsMessage, NsModal } from '/nerv-lib/component';
+  import { carbonEmissionFactorLibrary } from '/@/api/carbonEmissionFactorLibrary';
+  import type {
+    AntTreeNodeDragEnterEvent,
+    AntTreeNodeDropEvent,
+    TreeProps,
+  } from 'ant-design-vue/es/tree';
+import { log } from 'node:console';
+
+  defineOptions({ name: 'QuickCalculation' });
+  const selectTreeDataValue = ref<string>('');
+  const mainRef = ref();
+  const data = reactive({});
+  let formData = ref({});
+  const formRef = ref();
+  const visible = ref(false);
+  const searchValue = ref<string>('');
+  const searchValue2 = ref<string>('');
+  const disabled = ref(false);
+  const treeNodeAdd = ref<boolean>(false);
+  const operationTree = ref<string>('新增');
+
+  const opMap: any = ref({
+    type: 'add',
+    fuc: () => {},
+    record: {},
+  });
+  watchEffect(() => {
+    disabled.value = opMap.value.type === 'edit';
+  });
+  const casData = ref([]);
+  const treeData = ref([]);
+  const userAuthList = ref([]);
+  const orgId = ref('');
+  const result = JSON.parse(sessionStorage.getItem('ORGID')!);
+  orgId.value = result;
+  const dynamicDisabled = computed(() => {
+    return formRef.value?.validateResult && userAuthList.value?.length;
+  });
+  const fetch = (api, params = { orgId }) => {
+    return http.post(api, params);
+  };
+
+  // 树结构
+  const x = 3;
+  const y = 2;
+  const z = 1;
+  const genData: TreeProps['treeData'] = [];
+  const checkedTreeNodeKeys = ref<string[]>(['0-0']);
+
+  const generateData = (_level: number, _preKey?: string, _tns?: TreeProps['treeData']) => {
+    const preKey = _preKey || '0';
+    const tns = _tns || genData;
+
+    const children = [];
+    for (let i = 0; i < x; i++) {
+      const key = `${preKey}-${i}`;
+      tns.push({ title: key, key });
+      if (i < y) {
+        children.push(key);
+      }
+    }
+    if (_level < 0) {
+      return tns;
+    }
+    const level = _level - 1;
+    children.forEach((key, index) => {
+      tns[index].children = [];
+      return generateData(level, key, tns[index].children);
+    });
+  };
+  generateData(z);
+  type TreeDataItem = TreeProps['treeData'][number];
+  const gData = ref<TreeProps['treeData']>(genData);
+  const onDragEnter = (info: AntTreeNodeDragEnterEvent) => {
+    console.log(info);
+    // expandedKeys 需要展开时
+    // expandedKeys.value = info.expandedKeys;
+  };
+
+  const onDrop = (info: AntTreeNodeDropEvent) => {
+    console.log(info);
+    const dropKey = info.node.key;
+    const dragKey = info.dragNode.key;
+    const dropPos = info.node.pos.split('-');
+    const dropPosition = info.dropPosition - Number(dropPos[dropPos.length - 1]);
+    const loop = (data: TreeProps['treeData'], key: string | number, callback: any) => {
+      data.forEach((item, index) => {
+        if (item.key === key) {
+          return callback(item, index, data);
+        }
+        if (item.children) {
+          return loop(item.children, key, callback);
+        }
+      });
+    };
+    const data = [...gData.value];
+
+    // Find dragObject
+    let dragObj: TreeDataItem;
+    loop(data, dragKey, (item: TreeDataItem, index: number, arr: TreeProps['treeData']) => {
+      arr.splice(index, 1);
+      dragObj = item;
+    });
+    if (!info.dropToGap) {
+      // Drop on the content
+      loop(data, dropKey, (item: TreeDataItem) => {
+        item.children = item.children || [];
+        /// where to insert 示例添加到头部，可以是随意位置
+        item.children.unshift(dragObj);
+      });
+    } else if (
+      (info.node.children || []).length > 0 && // Has children
+      info.node.expanded && // Is expanded
+      dropPosition === 1 // On the bottom gap
+    ) {
+      loop(data, dropKey, (item: TreeDataItem) => {
+        item.children = item.children || [];
+        // where to insert 示例添加到头部，可以是随意位置
+        item.children.unshift(dragObj);
+      });
+    } else {
+      let ar: TreeProps['treeData'] = [];
+      let i = 0;
+      loop(data, dropKey, (_item: TreeDataItem, index: number, arr: TreeProps['treeData']) => {
+        ar = arr;
+        i = index;
+      });
+      if (dropPosition === -1) {
+        ar.splice(i, 0, dragObj);
+      } else {
+        ar.splice(i + 1, 0, dragObj);
+      }
+    }
+    gData.value = data;
+  };
+  const dataList: TreeProps['treeData'] = [];
+  const generateList = (data: TreeProps['treeData']) => {
+    for (let i = 0; i < data.length; i++) {
+      const node = data[i];
+      const key = node.key;
+      dataList.push({ key, title: key });
+      if (node.children) {
+        generateList(node.children);
+      }
+    }
+  };
+  generateList(genData);
+
+  const getParentKey = (
+    key: string | number,
+    tree: TreeProps['treeData'],
+  ): string | number | undefined => {
+    let parentKey;
+    for (let i = 0; i < tree.length; i++) {
+      const node = tree[i];
+      if (node.children) {
+        if (node.children.some(item => item.key === key)) {
+          parentKey = node.key;
+        } else if (getParentKey(key, node.children)) {
+          parentKey = getParentKey(key, node.children);
+        }
+      }
+    }
+    return parentKey;
+  };
+  const expandedKeys = ref<(string | number)[]>([]);
+  const autoExpandParent = ref<boolean>(true);
+
+  const onExpand = (keys: string[]) => {
+    expandedKeys.value = keys;
+    autoExpandParent.value = false;
+  };
+  watch(selectTreeDataValue, value => {
+    const expanded = dataList
+      .map((item: TreeProps['treeData'][number]) => {
+        if (item.title.indexOf(value) > -1) {
+          return getParentKey(item.key, gData.value);
+        }
+        return null;
+      })
+      .filter((item, i, self) => item && self.indexOf(item) === i);
+    expandedKeys.value = expanded;
+    selectTreeDataValue.value = value;
+    autoExpandParent.value = true;
+  });
+  // 筛选树结构中的数据
+  const onSearchTreeData = (selectTreeDataValue: string) => {
+    console.log('use value', selectTreeDataValue);
+    console.log('or use this.value', value.value);
+  };
+  // 点击数据点的复选框
+  const checkedIds = ref([])
+  const emissionType = ref()
+  const checkTreeNode = (checkedKeys, info) => {
+    checkedTreeNodeKeys.value = checkedKeys
+    checkedIds.value = []
+    info.checkedNodes.forEach(item=>{
+      checkedIds.value.push(item.id)
+    })
+    sessionStorage.setItem('checkedTreeNode', checkedIds.value);
+    emissionType.value = checkedIds.value.join(',')
+    mainRef.value?.nsTableRef.reload();
+  }
+  // 新增/编辑树节点点击确定
+  const addTreeNode =ref()
+  const handleOk = (e: MouseEvent) => {
+    editTreeNode.value.emissionName = addTreeNode.value
+    http.post(carbonEmissionFactorLibrary.creat,editTreeNode.value).then(() => {
+      getOrgTree()
+      NsMessage.success('操作成功');
+      addTreeNode.value = ''
+      treeNodeAdd.value = false;
+    });
+  };
+  const handleCancel = () => {
+    addTreeNode.value = ''
+    treeNodeAdd.value = false;
+  };
+  // 获取排放分类树
+  const getOrgTree = (params?) => {
+    fetch(carbonEmissionFactorLibrary.getCarbonFactorTree, params).then((res) => {
+      gData.value = res.data
+      // 找到匹配的节点数据
+      const selectedNodes = [];
+      checkedTreeNodeKeys.value.forEach(key => {
+        const [parentId, childId] = key.split('-').map(Number);
+        if (parentId >= 0 && childId >= 0 && gData.value[parentId]?.children?.[childId]) {
+          selectedNodes.push(gData.value[parentId]);
+        }
+      });
+      // 获取默认选中节点的所有id
+      getDefaultIds(selectedNodes)
+    });
+  };
+  const defaultIds = ref([])
+  const getDefaultIds = (selectedNodes) => {
+    selectedNodes.forEach(items => {
+      defaultIds.value.push(items.id)
+      if(items.children){
+        getDefaultIds(items.children)
+      }
+    })
+    emissionType.value = defaultIds.value.join(',')
+    checkedIds.value = defaultIds.value
+    sessionStorage.setItem('checkedTreeNode', checkedIds.value);
+  }
+  getOrgTree();
+  // 被选中的树节点
+  const editTreeNode = ref({})
+  const onSelect = (selectedKeys: string[], info: any) => {
+    if(info.selected){
+      editTreeNode.value = {
+        id:info.selectedNodes[0].id,
+        level:info.selectedNodes[0].level,
+        dataNumber:info.selectedNodes[0].dataNumber,
+        sortNumber:info.selectedNodes[0].sortNumber,
+        parentEmissionId:info.selectedNodes[0].parentEmissionId,
+      }
+    }
+  };
+
+  const onSearch = () => {
+    console.log(searchValue.value);
+    getOrgTree({ orgName: searchValue.value, orgId });
+  };
+
+  const tableFetch = (params) => {
+    console.log(params, 'sdfasfasdfasdfasdf');
+
+    tableConfig.value.params = {
+      ...mainRef.value.params,
+      ...params,
+    };
+
+    setTimeout(() => {
+      mainRef.value?.nsTableRef.reload();
+    }, 100);
+  };
+
+  const handleSelect = (selectedKeys: any, info: any) => {
+    fetch(carbonEmissionFactorLibrary.queryDeptTree, { orgId: info.node?.orgInfo.orgId }).then((res) => {
+      treeData2.value = res.data;
+    });
+    tableFetch({ orgId: info.node?.orgInfo.orgId });
+  };
+
+
+  const onClose = () => {
+    visible.value = false;
+    formData.value = {};
+    userAuthList.value.splice(0);
+  };
+
+  const onEdit = () => {
+    formRef.value?.triggerSubmit().then(() => {
+      console.log(formData.value, 'formData.value');
+      // if (!userAuthList.value.length) {
+      //   NsMessage.error('请添加用户权限');
+      //   return;
+      // }
+
+      opMap.value.fuc &&
+        opMap.value.fuc({ ...formData.value });
+    });
+  };
+  const tableConfig = ref({
+    title: '数据库',
+    api: carbonEmissionFactorLibrary.getTableList,
+    params: {
+      orgId,
+      emissionType
+    },
+    headerActions: [
+      {
+        label: '新增',
+        name: 'userAdd',
+        type: 'primary',
+        handle: () => {
+          opMap.value.type = 'add';
+          setTimeout(() => {
+            formData.value = {
+              carbonEmissionPrefix:'t',
+              numberOfReferences:'10'
+            };
+            userAuthList.value.splice(0);
+          });
+          opMap.value.fuc = (formData: any) => {
+            formData.emissionType = formData.emissionType[formData.emissionType.length - 1]
+            return http.post(carbonEmissionFactorLibrary.creatOrUpdate, formData).then(() => {
+              mainRef.value?.nsTableRef.reload();
+              visible.value = false;
+              NsMessage.success('操作成功');
+            });
+          };
+          visible.value = true;
+        },
+      },
+      {
+        label: '导入',
+        type: 'primary',
+        name: 'userImport',
+        handle: () => {},
+      },
+      {
+        label: '导出',
+        type: 'primary',
+        name: 'userExports',
+      },
+      {
+        label: '批量删除',
+        type: 'primary',
+        name: 'userBatchDel',
+        dynamicDisabled: (data: any) => {
+          return data.list.length === 0;
+        },
+        confirm: true,
+        isReload: true,
+        isClearCheck: true,
+        api: carbonEmissionFactorLibrary.del,
+        dynamicParams: { ids: 'id[]' },
+      },
+    ],
+    columns: [
+      {
+        title: 'id',
+        customRender: (text: any) => {
+          return text.index + 1;
+        },
+      },
+      {
+        title: '排放源',
+        dataIndex: 'emissionSources',
+      },
+      {
+        title: '排放类型',
+        dataIndex: 'emissionTypeColumn',
+      },
+      {
+        title: '排放气体',
+        dataIndex: 'emissionGas',
+      },
+      {
+        title: '排放环节',
+        dataIndex: 'emissionProcess',
+      },
+      {
+        title: '排放因子',
+        dataIndex: 'emissionFactors',
+      },
+      {
+        title: '排放因子单位',
+        dataIndex: 'emissionFactorUnits',
+      },
+      {
+        title: '数据来源',
+        dataIndex: 'dataSources',
+      },
+      {
+        title: '数据库',
+        dataIndex: 'carbonDatabase',
+      },
+      {
+        title: '参考文献',
+        dataIndex: 'reference',
+      },
+      {
+        title: '引用数量',
+        dataIndex: 'numberOfReferences',
+      },
+    ],
+    columnActions: {
+      title: '操作',
+      actions: [
+        {
+          label: '编辑',
+          name: 'userEdit',
+          handle: (record: any) => {
+            userAuthList.value.splice(0);
+            setTimeout(() => {
+              console.log(record.id);
+              
+              http.post(carbonEmissionFactorLibrary.findById,{ id: record.id } ).then((res) => {
+                formData.value = res.data;
+              });
+            }, 10);
+            opMap.value.type = 'edit';
+            opMap.value.fuc = (formData: any) => {
+              return http.post(carbonEmissionFactorLibrary.creatOrUpdate, formData).then(() => {
+                mainRef.value?.nsTableRef.reload();
+                visible.value = false;
+                NsMessage.success('操作成功');
+              });
+            };
+            visible.value = true;
+          },
+        },
+        {
+          label: '删除',
+          name: 'userDelete',
+          dynamicParams: { ids: 'id[]' },
+          confirm: true,
+          isReload: true,
+          api: carbonEmissionFactorLibrary.del,
+        },
+      ],
+    },
+    rowKey: 'id',
+  });
+</script>
+<style lang="less" scoped>
+  .main {
+    background-color: @ns-content-bg;
+    display: flex;
+    height: 100%;
+  }
+  .left {
+    width: 300px;
+    // max-height: calc(100vh - 96px);
+    margin-right: @ns-gap;
+    min-width: fit-content;
+    > div {
+      border-radius: @ns-border-radius;
+      background-color: @white;
+      // box-shadow: @ns-content-box-shadow;
+      flex: 1;
+    }
+
+    display: flex;
+    flex-direction: column;
+    .top{
+      position: relative;
+      .addTreeNode{
+        width: 100%;
+        padding: 16px;
+        position: absolute;
+        bottom: 0;
+      }
+    }
+  }
+  .right {
+    flex: 1;
+    min-width: 0;
+  }
+  .top {
+    overflow: auto;
+    // height: 50%;
+    // border-bottom: 5px solid rgb(229, 235, 240);
+    // overflow-y: auto;
+  }
+  .ns-form-title{
+    font-weight: bold;
+    user-select: text;
+    padding: 16px;
+    margin-bottom: 16px;
+    padding-bottom: 10px;
+    border-bottom: 1px solid #e9e9e9;
+  }
+</style>

hx-ai-intelligent/src/view/equipmentControl/lightingManage/indexs.less

@@ -4,24 +4,6 @@
     // height: 100%;
     position: relative;
     // background: linear-gradient(#badaff, #8cabeb, #7095de);
-    .drawer-box {
-        width: 30px;
-        height: 40px;
-        border-radius: 2px;
-        position: fixed;
-        right: 0;
-        top: 0;
-        bottom: 0;
-        margin: auto;
-        background: rgba(0, 0 ,0 ,0.5);
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        cursor: pointer;
-        .drawer-icon {
-                
-        }
-    }
     // 照明设备功能总容器
     .lighting-img-box {
         position: relative;
@@ -88,9 +70,9 @@
                 background: rgba(80, 236, 244, 0.3);
                 border: 2px solid rgb(80, 236, 244);
             } 
-            .area-item:hover {
+            // .area-item:hover {
-                border:2px solid white;
+            //     transform: scale(1.05);
-            }
+            // }
             .area-item {
                 cursor: pointer;
                 transition: all ease 0.2s;
@@ -125,20 +107,21 @@
                         background: rgba(0, 0, 0, 0.1);
                     }
                 }
-                .group-shadow {
+                // .group-shadow {
-                    transition: all ease 0.2s;
+                //     transition: all ease 0.2s;
-                }
+                // }
-                .group-shadow:hover {
+                // .group-shadow:hover {
-                    border: 2px solid white;
+                //     transform: scale(1.05);
-                }
+                // }
             }
         }
     }
 }
+// 总容器与抽屉按钮
 .ns-content-main {
     position: relative;
-    // 抽屉伸缩按钮
+    // 抽屉打开按钮
-    .drawer-box {
+    .drawer-box-in {
         width: 30px;
         height: 40px;
         border-radius: 2px;
@@ -152,8 +135,22 @@
         justify-content: center;
         align-items: center;
         cursor: pointer;
-        .drawer-icon {
-                
-        }
     }
+    // 抽屉关闭按钮
+    .drawer-box-out {
+        width: 30px;
+        height: 40px;
+        border-radius: 2px;
+        position: fixed;
+        right: 496px;
+        top: 0;
+        bottom: 0;
+        margin: auto;
+        background: rgba(0, 0 ,0 ,0.5);
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        cursor: pointer;
+    }
+    
 }

hx-ai-intelligent/src/view/equipmentControl/lightingManage/indexs.vue

@@ -9,73 +9,156 @@
             </div>
             <!-- 楼层区域 -->
             <div class="area">
-                <div class="area-item area1" :class="{ 'isActive': area === 1 }" @click="getArea(1)">
+                <div 
-                    <div class="light-group">
+                v-for="(item, index) in treeData" 
-                        <div class="group-shadow group-shadow1" @click.stop="getArea(1.1)"></div>
+                :class="computedClass(item.id)"
-                    </div>
+                @click="getArea(item.id)"
-                    <div class="light-group">
+                :key="index">
-                        <div class="group-shadow group-shadow1" @click.stop="getArea(1.2)"></div>
+                    <div v-for="(v, i) in item.children" :key="i" class="light-group">
-                    </div>
+                        <div class="group-shadow group-shadow1" :class="computedClass(v.id)" @click.stop="getArea(v.id)"></div>
-                </div>
-                <div class="area-item area2" @click="getArea(2)">
-                    <div class="light-group">
-                        <div class="group-shadow group-shadow2" @click.stop="getArea(2.1)"></div>
-                    </div>
-                    <div class="light-group">
-                        <div class="group-shadow group-shadow2" @click.stop="getArea(2.2)"></div>
-                    </div>
-                </div>
-                <div class="area-item area3" @click="getArea(3)">
-                    <div class="light-group">
-                        <div class="group-shadow group-shadow3" @click.stop="getArea(3.1)"></div>
-                    </div>
-                </div>
-                <div class="area-item area4" @click="getArea(4)">
-                    <div class="light-group">
-                        <div class="group-shadow group-shadow4" @click.stop="getArea(4.1)"></div>
                     </div>
                 </div>
             </div>
             <!-- 照明设备 -->
             <div class="lights">
-                <light :styleObject="{left: '190px', bottom: '200px'}" :type="1"></light>
+                <light v-for="(item, index) in bulbs" :key="index" :styleObject="item.styleText" :type="item.type" :visible="item.visible"></light>
-                <light :styleObject="{left: '245px', bottom: '125px'}" :type="2"></light>
-                <light :styleObject="{left: '355px', bottom: '160px'}" :type="3"></light>
-                <light :styleObject="{left: '295px', bottom: '230px'}" :type="3"></light> 
-                <light :styleObject="{left: '460px', bottom: '230px'}" :type="3"></light> 
-                <light :styleObject="{left: '510px', bottom: '190px'}" :type="3"></light> 
-                <light :styleObject="{left: '415px', bottom: '275px'}" :type="1"></light> 
             </div>
         </div>
         <!-- 右侧抽屉的触发按钮 -->
-        <div class="drawer-box" v-if="!visible">
+        <div class="drawer-box-in" v-if="!visible" @click="toggleDrawer">
-            <double-left-outlined class="drawer-icon" style="color: rgba(255, 255, 255, 1)" />
+            <double-left-outlined class="drawer-icon" style="color: white" />
+        </div>
+        <!-- 左侧抽屉的关闭按钮 -->
+        <div class="drawer-box-out" v-if="visible" @click="toggleDrawer">
+            <double-right-outlined class="drawer-icon" style="color: white;" />
         </div>
+        <!-- 右侧抽屉 -->
+        <a-drawer
+        v-model:visible="visible"
+        class="drawer-item"
+        width="496"
+        placement="right"
+        :body-style="{ background: 'rgba(0, 0, 0)', opacity: 0.8 }"
+        :closable="false"
+        id="Odrawer"
+        :maskStyle="{ 'background-color': 'rgba(0, 0, 0, 0)' }">
+            <a-tabs v-model:activeKey="activeKey">
+                <a-tab-pane key="1" tab="控制面板">
+                    <tabs1 @changeArea="getArea" :treeData="treeData"></tabs1>
+                </a-tab-pane>
+                <a-tab-pane key="2" tab="计划列表" force-render>
+
+                </a-tab-pane>
+                <a-tab-pane key="3" tab="日志"></a-tab-pane>
+            </a-tabs>
+        </a-drawer>
     </div>
-    
 </template>
   
 <script setup lang="ts">
 
 import { ref } from 'vue';
+import { treeData } from './treeData'
 import light from './light.vue';
+import tabs1 from './tabs1.vue'
+// ICON
 import {
     DoubleLeftOutlined,
     DoubleRightOutlined
   } from '@ant-design/icons-vue';
 
-let area = ref(1)
+// 分区 - 当前选择的分区 - 默认选择一区
-let visible = ref(false)
+let area = ref(['1'])
+// 分区 - 分区小灯泡
+const bulbs = ref([
+    {
+        styleText: { left: '190px', bottom: '200px' },
+        area: 1,
+        type: 1,
+        visible: true
+    },
+    {
+        styleText: { left: '245px', bottom: '125px' },
+        area: 1,
+        type: 2,
+        visible: true
+    },
+    {
+        styleText: { left: '355px', bottom: '160px' },
+        area: 1,
+        type: 3,
+        visible: true
+    },
+    {
+        styleText: { left: '295px', bottom: '230px' },
+        area: 1,
+        type: 3,
+        visible: true
+    },
+    {
+        styleText: { left: '425px', bottom: '230px' },
+        area: 2,
+        type: 3,
+        visible: true
+    },
+    {
+        styleText: { left: '470px', bottom: '190px' },
+        area: 2,
+        type: 3,
+        visible: true
+    },
+    {
+        styleText: { left: '380px', bottom: '275px' },
+        area: 2,
+        type: 3,
+        visible: true
+    },
+    {
+        styleText: { left: '700px', bottom: '320px' },
+        area: 3,
+        type: 1,
+        visible: true
+    },
+])
 
+// 分区 - 单个分区切换
+const getArea = (result: any) => {
+    // 如果传入的值是数组
+    if (Array.isArray(result)) {
+        area.value = result
+    // 如果不是数组
+    } else {
+        area.value.length = 0
+        area.value[0] = String(result)
+    } 
+}
+// 分区 - 多个分区切换，只有照明回路能够触发多个分区
+// 分区 - 样式函数
+const computedClass = (number: number) => {
+    if (area.value.indexOf(number) != -1) {
+        return `isActive area-item area${number}`
+    } else {
+        return `area-item area${number}`
+    }
+}
 
-const getArea = (number: any) => {
+// 抽屉 - 当前选择的tab
-    alert(number)
+let activeKey = ref('1');
+// 抽屉 - 打开状态
+let visible = ref(false);
+// 抽屉 - 开关事件
+const toggleDrawer = () => {
+    visible.value = !visible.value;
 };
+
 </script>
 <style lang="less" scoped>
 @import "./indexs.less";
 .isActive {
-    border: 2px solid white !important;
+    border: 3px solid white !important;
+}
+:deep(.ant-tabs-tab-btn) {
+    color: white;
 }
 </style>
   

hx-ai-intelligent/src/view/equipmentControl/lightingManage/light.vue

@@ -33,7 +33,7 @@
                 </div>
             </div>
         </template>
-        <div class="icon-box" :style="styleObject">
+        <div class="icon-box" :style="styleObject" v-show="visible">
             <img v-if="type == 1" class="icon-item" src="/asset/image/bulbLogo/22394.png" alt="">
             <img v-if="type == 2" class="icon-item" src="/asset/image/bulbLogo/22396.png" alt="">
             <img v-if="type == 3" class="icon-item" src="/asset/image/bulbLogo/22400.png" alt="">
@@ -43,9 +43,14 @@
   
 <script setup lang="ts">
 import { ref } from 'vue';
+
 defineProps({
-  styleObject: Object,
+    styleObject: Object,
-  type: Number
+    type: Number,
+    visible: {
+        type: Boolean,
+        default: false
+    }
 });
 
 const result = ref({

hx-ai-intelligent/src/view/equipmentControl/lightingManage/treeData.ts

@@ -0,0 +1,88 @@
+import { ref } from 'vue';
+export const treeData = ref([
+  {
+    label: '站厅',
+    id: '1',
+    // 前端遍历后添加，属前端属性
+    selected: false,
+    children: [{
+      label: '站厅1区',
+      id: '1-1',
+      // 前端属性
+      selected: false,
+      // 后端属性（表示禁用了一个设备）
+      stop: false,
+      // 当前的控制模式
+      type: 3
+    },{
+      label: '站厅2区',
+      id: '1-2',
+      selected: false,
+      stop: false,
+      type: 1
+    }]
+  },
+  {
+    label: '站台',
+    id: '2',
+    selected: false,
+    children: [{
+      label: '站台1区',
+      id: '2-1',
+      selected: false,
+      stop: false,
+      type: 1
+    },{
+      label: '站台2区',
+      id: '2-2',
+      selected: false,
+      stop: false,
+      type: 2
+    },{
+      label: '站台3区',
+      id: '2-3',
+      selected: false,
+      stop: false,
+      type: 3
+    },{
+      label: '站台4区',
+      id: '2-4',
+      selected: false,
+      stop: false,
+      type: 1
+    }]
+  },{
+    label: '办公室',
+    id: '3',
+    selected: false,
+    children: [{
+      label: '办公室1区',
+      id: '3-1',
+      selected: false,
+      stop: false,
+      type: 2
+    }]
+  },{
+    label: '楼道',
+    id: '4',
+    selected: false,
+    children: [{
+      label: '楼道1区',
+      id: '4-1',
+      selected: false,
+      stop: false,
+      type: 3
+    }]
+  },
+]);
+
+export const controlType = ref([{
+  name: '托管',
+  type: 1,
+},{
+  name: 'AI',
+  type: 2,
+},{
+  name: '手动',
+  type: 3,
+}])

hx-ai-intelligent/src/view/monitor/energyMonitor/analysisGraph/index.vue

@@ -0,0 +1,155 @@
+<template>
+  <a-row type="flex" style="height: 92%">
+    <a-col :span="8">
+      <a-radio-group
+        v-model:value="mode"
+        @change="changeMode"
+        style="padding-bottom: 10px; width: 40%; height: 4%; padding-left: 30px; padding-top: 10px">
+        <a-radio-button value="1" style="width: 50%; text-align: center"> 同比 </a-radio-button>
+        <a-radio-button value="2" style="width: 50%; text-align: center"> 环比 </a-radio-button>
+      </a-radio-group>
+      <div ref="analysisGraphchart" style="width: 100%; height: 95%"></div>
+    </a-col>
+    <a-col :span="16" />
+  </a-row>
+</template>
+
+<script lang="ts">
+  import { defineComponent, onMounted, ref, inject, watch } from 'vue';
+  import * as echarts from 'echarts';
+
+  export default defineComponent({
+    name: 'AnalysisGraph',
+    setup() {
+      const mode = ref<String>('1');
+      let data = ref<any[]>([]);
+      interface PageData {
+        // 图表 表格数据
+        graphTableList: any[];
+        // 图表 表格表头
+        graphTableColumns: any[];
+        // 图表 图表数据
+        graphGraphList: any[];
+        // 分析 表格数据
+        analysisTableList: any[];
+        // 分析 图表数据
+        analysisGraphList: any[];
+      }
+      const pageData = inject<PageData>('pageData');
+
+      if (!pageData) {
+        throw new Error('pageData is not provided');
+      }
+
+      // 监听 pageData 的变化
+      watch(
+        () => pageData as PageData,
+        (_newValue, _oldValue) => {
+          // 执行你的逻辑代码
+          draw();
+        },
+        { deep: true },
+      );
+      const changeMode = () => {};
+      const analysisGraphchart = ref(null);
+
+      let chartInstance: echarts.ECharts | null = null;
+
+      const draw = () => {
+        data.value = pageData.analysisGraphList;
+        if (data.value && data.value.length > 0) {
+          if (chartInstance) {
+            chartInstance.dispose();
+          }
+          chartInstance = echarts.init(analysisGraphchart.value);
+
+          var seriesdata = [];
+          var dateX = [];
+          // var legendList: string | any[] = [];
+          for (let i = 0; i < data.value.length; i++) {
+            dateX.push(data.value[i].name);
+
+            seriesdata.push({ value: data.value[i].value, label: data.value[i].labelRight });
+          }
+
+          var seriesList = [
+            {
+              name: data.value[0].energyType,
+              data: seriesdata,
+              type: 'bar',
+              label: {
+                show: true,
+                formatter: '{b}',
+              },
+            },
+          ];
+
+          const option = {
+            // tooltip: {
+            //   trigger: 'axis',
+            //   formatter: (params: any) => {
+            //     const date = params[0].name;
+            //     const values = params
+            //       .map((param: any) => {
+            //         const unit = data.value.find((d) => d.name === date)?.unit || '';
+            //         return `<tr>
+            //               <td>${param.marker}${param.seriesName}</td>
+            //               <td style="text-align: right;">${param.value} ${unit}</td>
+            //             </tr>`;
+            //       })
+            //       .join('');
+            //     return `<div>${date}</div><table style="width: 100%;">${values}</table>`;
+            //   },
+            // },
+            yAxis: {
+              type: 'category',
+              axisLine: { show: false },
+              axisLabel: { show: false },
+              axisTick: { show: false },
+              splitLine: { show: false },
+              data: dateX,
+            },
+            xAxis: {
+              type: 'value',
+              position: 'top',
+              splitLine: {
+                lineStyle: {
+                  type: 'dashed',
+                },
+              },
+            },
+            series: seriesList,
+          };
+
+          chartInstance = echarts.init(analysisGraphchart.value);
+          chartInstance.setOption(option);
+        }
+      };
+      onMounted(() => {
+        draw();
+      });
+
+      // 下载图表
+      const downloadChart = () => {
+        if (chartInstance) {
+          const base64 = chartInstance.getDataURL({
+            type: 'png',
+            backgroundColor: '#fff',
+          });
+          const link = document.createElement('a');
+          link.href = base64;
+          link.download = 'chart.png';
+          link.click();
+        }
+      };
+
+      return {
+        analysisGraphchart,
+        downloadChart,
+        mode,
+        changeMode,
+      };
+    },
+  });
+</script>
+<style lang="less" scoped></style>

hx-ai-intelligent/src/view/monitor/energyMonitor/analysisTable/index.vue

@@ -0,0 +1,103 @@
+<template>
+  <a-table :columns="columns" :data-source="data" bordered />
+</template>
+
+<script lang="ts">
+  import { defineComponent, ref, inject, watch, onMounted } from 'vue';
+
+  export default defineComponent({
+    name: 'AnalysisTable',
+    setup() {
+      const columns = [
+        {
+          title: '设备/节点',
+          dataIndex: 'key',
+        },
+        {
+          title: '统计值',
+          dataIndex: 'name',
+        },
+        {
+          title: '同比',
+          children: [
+            {
+              title: '△差值',
+              dataIndex: 'position',
+            },
+            {
+              title: '增长率',
+              dataIndex: 'unit',
+            },
+          ],
+        },
+        {
+          title: '环比',
+          children: [
+            {
+              title: '△差值',
+              dataIndex: 'position',
+            },
+            {
+              title: '增长率',
+              dataIndex: 'unit',
+            },
+          ],
+        },
+        {
+          title: '纵向对比',
+          children: [
+            {
+              title: '△差值',
+              dataIndex: 'position',
+            },
+            {
+              title: '增长率',
+              dataIndex: 'unit',
+            },
+          ],
+        },
+
+        {
+          title: '操作',
+          dataIndex: 'date',
+        },
+      ];
+      let data = ref<any[]>([]);
+
+      interface PageData {
+        // 图表 表格数据
+        graphTableList: any[];
+        // 图表 表格表头
+        graphTableColumns: any[];
+        // 图表 图表数据
+        graphGraphList: any[];
+        // 分析 表格数据
+        analysisTableList: any[];
+        // 分析 图表数据
+        analysisGraphList: any[];
+      }
+      const pageData = inject<PageData>('pageData');
+
+      if (!pageData) {
+        throw new Error('pageData is not provided');
+      }
+      // 监听 pageData 的变化
+      watch(
+        () => pageData as PageData,
+        (_newValue, _oldValue) => {
+          data.value = pageData.analysisTableList;
+        },
+        { deep: true },
+      );
+      onMounted(() => {
+        data.value = pageData.analysisTableList;
+      });
+      return {
+        data,
+        columns,
+      };
+    },
+  });
+</script>
+
+<style lang="less" scoped></style>

hx-ai-intelligent/src/view/monitor/energyMonitor/graphGraph/index.vue

@@ -11,9 +11,16 @@
     setup() {
       let data = ref<any[]>([]);
       interface PageData {
+        // 图表 表格数据
         graphTableList: any[];
+        // 图表 表格表头
         graphTableColumns: any[];
+        // 图表 图表数据
         graphGraphList: any[];
+        // 分析 表格数据
+        analysisTableList: any[];
+        // 分析 图表数据
+        analysisGraphList: any[];
       }
       const pageData = inject<PageData>('pageData');
 

hx-ai-intelligent/src/view/monitor/energyMonitor/graphTable/index.vue

@@ -13,9 +13,16 @@
       let columns = ref<TableColumnType[]>([]);
 
       interface PageData {
+        // 图表 表格数据
         graphTableList: any[];
+        // 图表 表格表头
         graphTableColumns: any[];
+        // 图表 图表数据
         graphGraphList: any[];
+        // 分析 表格数据
+        analysisTableList: any[];
+        // 分析 图表数据
+        analysisGraphList: any[];
       }
       const pageData = inject<PageData>('pageData');
 

hx-ai-intelligent/src/view/monitor/energyMonitor/index.vue

@@ -9,9 +9,16 @@
 
   // 创建一个响应式对象
   const pageData = reactive({
+    // 图表 表格数据
     graphTableList: [],
+    // 图表 表格表头
     graphTableColumns: [],
+    // 图表 图表数据
     graphGraphList: [],
+    // 分析 表格数据
+    analysisTableList: [],
+    // 分析 图表数据
+    analysisGraphList: [],
   });
 
   // 使用 provide 函数来提供这个响应式对象

hx-ai-intelligent/src/view/monitor/energyMonitor/page.vue

@@ -23,6 +23,10 @@
           <graph-graph ref="graphRef" v-if="isGraph" />
           <environment-table ref="tableRef" v-else />
         </div>
+        <div v-else style="height: 90%">
+          <analysis-graph ref="graphRef" v-if="isGraph" />
+          <analysis-table ref="analysisTableRef" v-else />
+        </div>
       </div>
     </a-col>
   </a-row>
@@ -33,12 +37,15 @@
   import tree from './tree/index.vue';
   import graphGraph from './graphGraph/index.vue';
   import environmentTable from './graphTable/index.vue';
+  import analysisTable from './analysisTable/index.vue';
+  import analysisGraph from './analysisGraph/index.vue';
 
   const iconName = ref('biaoge');
 
   const treeRef = ref();
   const graphRef = ref();
   const tableRef = ref();
+  const analysisTableRef = ref();
 
   let isGraph = ref(true);
   const activeKey = ref('1');

hx-ai-intelligent/src/view/monitor/energyMonitor/table/index.vue

@@ -1,166 +0,0 @@
-<template>
-  <a-table :columns="columns" :data-source="data" bordered />
-</template>
-
-<script lang="ts">
-  import { defineComponent } from 'vue';
-  import type { TableColumnType } from 'ant-design-vue';
-
-  const data = [
-    {
-      key: '1',
-      name: 'AC_002（暖通电表）',
-      position: 'A 相电压',
-      unit: 'V',
-      date: '2023-12-01',
-      '1:00': '3626',
-    },
-    {
-      key: '1',
-      name: 'AC_002（暖通电表）',
-      position: 'A 相电压',
-      unit: 'V',
-      date: '2023-12-01',
-      '1:00': '3626',
-    },
-    {
-      key: '2',
-      name: 'AC_003（照明电表）',
-      position: 'A 相电压',
-      unit: 'V',
-      date: '2023-12-01',
-      '1:00': '3626',
-    },
-    {
-      key: '2',
-      name: 'AC_003（照明电表）',
-      position: 'A 相电压',
-      unit: 'V',
-      date: '2023-12-01',
-      '1:00': '3626',
-    },
-    {
-      key: '3',
-      name: 'AC_004（给排水电表）',
-      position: 'A 相电压',
-      unit: 'V',
-      date: '2023-12-01',
-      '1:00': '3626',
-    },
-  ];
-
-  export default defineComponent({
-    name: 'EnvironmentTable',
-    setup() {
-      const getRowSpan = (dataIndex: string, record, data, dependents: string[] = []) => {
-        let rowSpan = 1;
-        for (let i = data.indexOf(record) + 1; i < data.length; i++) {
-          let shouldMerge = true;
-          for (const dependent of dependents) {
-            if (data[i][dependent] !== record[dependent]) {
-              shouldMerge = false;
-              break;
-            }
-          }
-          if (shouldMerge && data[i][dataIndex] === record[dataIndex]) {
-            rowSpan++;
-          } else {
-            break;
-          }
-        }
-        return rowSpan;
-      };
-
-      const columns: TableColumnType[] = [
-        {
-          title: '序号',
-          dataIndex: 'key',
-          customCell: (record, rowIndex) => {
-            const rowSpan = getRowSpan('name', record, data);
-            if (rowIndex != 0 && data[rowIndex - 1].key == record.key) {
-              return {
-                rowSpan: 0,
-                colSpan: 0,
-              };
-            }
-            return {
-              rowSpan: rowSpan,
-            };
-          },
-        },
-        {
-          title: '设备名称',
-          dataIndex: 'name',
-          customCell: (record, rowIndex) => {
-            const rowSpan = getRowSpan('name', record, data);
-            if (rowIndex != 0 && data[rowIndex - 1].name == record.name) {
-              return {
-                rowSpan: 0,
-                colSpan: 0,
-              };
-            }
-            return {
-              rowSpan: rowSpan,
-            };
-          },
-        },
-        {
-          title: '设备点位',
-          dataIndex: 'position',
-          customCell: (record, rowIndex) => {
-            const rowSpan = getRowSpan('position', record, data, ['name']);
-            if (
-              rowIndex != 0 &&
-              data[rowIndex - 1].name == record.name &&
-              data[rowIndex - 1].position == record.position
-            ) {
-              return {
-                rowSpan: 0,
-                colSpan: 0,
-              };
-            }
-            return {
-              rowSpan: rowSpan,
-            };
-          },
-        },
-        {
-          title: '计量单位',
-          dataIndex: 'unit',
-          customCell: (record, rowIndex) => {
-            const rowSpan = getRowSpan('unit', record, data, ['name', 'position']);
-            if (
-              rowIndex != 0 &&
-              data[rowIndex - 1].name == record.name &&
-              data[rowIndex - 1].position == record.position &&
-              data[rowIndex - 1].unit == record.unit
-            ) {
-              return {
-                rowSpan: 0,
-                colSpan: 0,
-              };
-            }
-            return {
-              rowSpan: rowSpan,
-            };
-          },
-        },
-        {
-          title: '日期',
-          dataIndex: 'date',
-        },
-        {
-          title: '1:00',
-          dataIndex: '1:00',
-        },
-      ];
-
-      return {
-        data,
-        columns,
-      };
-    },
-  });
-</script>
-
-<style lang="less" scoped></style>

hx-ai-intelligent/src/view/monitor/energyMonitor/tree/index.vue

@@ -15,9 +15,9 @@
       v-model:value="mode"
       @change="changeMode"
       style="padding-bottom: 10px; width: 100%">
-      <a-radio-button value="1" style="width: 50%; text-align: center" :disabled="shebei"
+      <a-radio-button value="1" style="width: 50%; text-align: center" :disabled="shebei">
-        >设备</a-radio-button
+        设备
-      >
+      </a-radio-button>
       <a-radio-button value="2" style="width: 50%; text-align: center">节点</a-radio-button>
     </a-radio-group>
     <a-input
@@ -130,9 +130,16 @@
         ];
       };
       interface PageData {
+        // 图表 表格数据
         graphTableList: any[];
+        // 图表 表格表头
         graphTableColumns: any[];
+        // 图表 图表数据
         graphGraphList: any[];
+        // 分析 表格数据
+        analysisTableList: any[];
+        // 分析 图表数据
+        analysisGraphList: any[];
       }
       const pageData = inject<PageData>('pageData');
       if (!pageData) {
@@ -289,6 +296,72 @@
             ],
           },
         ];
+        pageData.analysisTableList = [
+          {
+            key: '1',
+            name: 'AC_002（暖通电表）',
+            position: 'A 相电压',
+            unit: 'V',
+            date: '2023-12-01',
+          },
+          {
+            key: '1',
+            name: 'AC_002（暖通电表）',
+            position: 'A 相电压',
+            unit: 'V',
+            date: '2023-12-01',
+          },
+          {
+            key: '2',
+            name: 'AC_003（照明电表）',
+            position: 'A 相电压',
+            unit: 'V',
+            date: '2023-12-01',
+          },
+          {
+            key: '2',
+            name: 'AC_003（照明电表）',
+            position: 'A 相电压',
+            unit: 'V',
+            date: '2023-12-01',
+          },
+          {
+            key: '3',
+            name: 'AC_004（给排水电表）',
+            position: 'A 相电压',
+            unit: 'V',
+            date: '2023-12-01',
+          },
+        ];
+        pageData.analysisGraphList = [
+          {
+            name: 'AC_002（暖通电表）',
+            value: -21,
+            energyType: selectedValue.value,
+            unit: 'V',
+            labelRight: {
+              position: 'right',
+            },
+          },
+          {
+            name: 'AC_003（照明电表）',
+            value: 36,
+            energyType: selectedValue.value,
+            unit: 'V',
+            labelRight: {
+              position: 'insideLeft',
+            },
+          },
+          {
+            name: 'AC_004（给排水电表）',
+            value: -5,
+            energyType: selectedValue.value,
+            unit: 'V',
+            labelRight: {
+              position: 'right',
+            },
+          },
+        ];
       };
       const getSelect11 = () => {
         pageData.graphTableList = [