Merge branch 'temp' of http://123.60.103.97:3000/xuziqiang/SaaS-lib into temp

2024-07-22 10:34:43 +08:00
parent 4c2989239d 1c8419569e
commit 088590beea
10 changed files with 175 additions and 142 deletions
--- a/hx-ai-intelligent/src/App.vue
+++ b/hx-ai-intelligent/src/App.vue
@@ -75,4 +75,11 @@
      max-width: 1000px;
    }
  }
+
+  // 区域阴影
+  :deep(.ns-table-search),
+  :deep(.ns-part-tree),
+  :deep(.ns-table-main) {
+    box-shadow: @ns-content-box-shadow;
+  }
 </style>
--- a/hx-ai-intelligent/src/api/IlluminationInfo.ts
+++ b/hx-ai-intelligent/src/api/IlluminationInfo.ts
@@ -17,4 +17,8 @@ export enum lightingManage {
  getLeftPlan = '/carbon-smart/IlluminationPlan/getPlan',
  // 提交穿梭框被选择的数据
  submitLeftPlan = '/carbon-smart/IlluminationPlan/joinPlan',
+  // 删除表格中的计划
+  deletePlan = '/carbon-smart/IlluminationPlan/deletePlan',
+  // 重启表格计划
+  restartPlan = '/carbon-smart/IlluminationPlan/enable',
 }
--- a/hx-ai-intelligent/src/view/equipmentControl/lightingManage/index.less
+++ b/hx-ai-intelligent/src/view/equipmentControl/lightingManage/index.less
@@ -1,6 +1,8 @@
 // 页面容器
 .lighting-box {
    position: relative;
+    width: 100%;
+    height: 100%;
    // background: linear-gradient(#badaff, #8cabeb, #7095de);
    // 照明设备功能总容器
    .lighting-img-box {
@@ -47,19 +49,19 @@
            display: flex;
            gap: 5px;  
            .area1 {
-                width: 70px;
+                width: 65px;
                background: rgba(0, 251, 91, 0.3);
                border: 2px solid rgb(0, 251, 91);
                display: flex;
            }   
            .area2 {
-                width: 200px;
+                width: 100px;
                background: rgba(255, 165, 0, 0.3);
                border: 2px solid rgb(255, 165, 0);
                display: flex;
            } 
            .area3 {
-                width: 120px;
+                width: 220px;
                background: rgba(255, 0, 0, 0.3);
                border: 2px solid rgb(255, 0, 0);
                display: flex;
@@ -71,7 +73,7 @@
                display: flex;
            } 
            .area5 {
-                flex: 1;
+                flex: 210px;
                background: rgba(0, 251, 91, 0.3);
                border: 2px solid rgb(0, 251, 91);
                display: flex;
--- a/hx-ai-intelligent/src/view/equipmentControl/lightingManage/indexs.vue
+++ b/hx-ai-intelligent/src/view/equipmentControl/lightingManage/indexs.vue
@@ -3,8 +3,7 @@
        <div class="lighting-img-box">
            <!-- 左上角，区域切换 -->
            <div class="btn-box">
-                <button class="btn-item" @click=changeFloor(1)>1F</button>
-                <button class="btn-item" @click=changeFloor(2)>2F</button>
+                <button v-for="item in floorData" class="btn-item" @click=changeFloor(item.childList)>{{ item.name }}</button>
            </div>
            <!-- 楼层区域 -->
            <div class="area">
@@ -13,7 +12,7 @@
                :class="computedClass(item.id)"
                @click="changeThisArea([item])"
                :key="index">
-                    <div v-for="(v, i) in item.children" :key="i" class="light-group">
+                    <div v-for="(v, i) in item.childList" :key="i" class="light-group">
                        <div class="group-shadow" @click.stop="changeThisArea([item, v])">
                            <div :class="computedClass(v.id)" class="shadow-box"></div>
                        </div>
@@ -50,7 +49,7 @@
        :maskStyle="{ 'background-color': 'rgba(0, 0, 0, 0)' }">
            <a-tabs v-model:activeKey="activeKey">
                <a-tab-pane key="1" tab="控制面板">
-                    <tabs1 @changeArea="changeArea" :treeData="treeData" :nowArea="nowArea"></tabs1>
+                    <tabs1 @changeArea="changeArea" @reset="reset" :treeData="treeData" :nowArea="nowArea"></tabs1>
                </a-tab-pane>
                <a-tab-pane key="2" tab="计划列表" force-render>
                    <tabs2></tabs2>
@@ -80,55 +79,53 @@ import {
    DoubleRightOutlined
 } from '@ant-design/icons-vue';

-// 类声明 =======================================================
-
-interface items {
-    id: string,
-
-}

 // 初始化 =======================================================

 onMounted(() => {
-    http.post(lightingManage.getArea, { floor: '1', siteId: '10000001' }).then(res => {
+    http.get(lightingManage.getArea, { projectId: 'HLlmTZp8' }).then(res => {
        const data = res.data
-        /** 由前端创建的，只在前端使用的变量
+        floorData.value = data
+        /** 只在前端使用的变量
         * @param id 用于判断样式和层级的前端属性
         * @param selected 用于表示是否选中的前端属性
         */
-        data.forEach((item, index) => {
+        data.forEach(floor => {
+            floor.childList.forEach((item, index) => {
                if (index == 0) {
                    item.selected = true
                } else {
                    item.selected = false
                }
                item.id = String(index + 1)
-            item.children = []
-            // deviceGroup后端返回了对象，此处转化为数组
-            let i = 1;
-            for (let obj in item.deviceGroup) {
-                item.deviceGroup[obj].selected = false
-                item.deviceGroup[obj].id = String((index + 1) + '-' + i++)
-                item.children.push(item.deviceGroup[obj])
-            }
+                item.childList.forEach((v, i) => {
+                    v.selected = false
+                    v.id = (index + 1) + '-' + (i + 1)
                })
-        treeData.value = data
+            })
+        })
+        treeData.value = data[0].childList
    })
 })

 // 分层业务 =====================================================

 // 左上角分层切换
-const changeFloor = (area: number) => {
-    if (area == 1) {
-        console.log('1F')
-    } else if (area == 2) {
-        console.log('2F')
-    } 
+const changeFloor = (area: any) => {
+    // 重置数据
+    reset()
+    // 重置视图
+    changeArea(['1'])
+    // 切换楼层数据
+    treeData.value = area
+    // 默认选择第一项
+    treeData.value[0].selected = true
 }

 // 分区业务 =====================================================

+// 所有楼层的数据
+const floorData = ref([])
 // 分区结构树
 const treeData = ref([])
 // 当前选中的分区id
@@ -223,7 +220,7 @@ const changeThisArea = (result: any) => {
 const reset = () => {
    treeData.value.forEach(item => {
        item.selected = false
-        item.children.forEach(i => {
+        item.childList.forEach(i => {
            i.selected = false
        })
    })
--- a/hx-ai-intelligent/src/view/equipmentControl/lightingManage/tabs1.less
+++ b/hx-ai-intelligent/src/view/equipmentControl/lightingManage/tabs1.less
@@ -44,8 +44,7 @@
    display: inline-block;
    justify-content: center;
  }
-
-  .plan.enabled {
+  .plan {
    border: none;
    font-size: 14px;
    font-weight: 400;
@@ -54,28 +53,20 @@
    margin-left: 235px;
    width: 88px;
    height: 32px;
-    background: linear-gradient(180deg, rgba(103, 222, 0, 1) 0%, rgba(0, 181, 6, 1) 100%);
    color: white;
+    cursor: pointer;
+  }
+  .plan.enabled {
+    background: linear-gradient(180deg, rgba(103, 222, 0, 1) 0%, rgba(0, 181, 6, 1) 100%);
  }
-
  .plan.disabled {
-    border: none;
-    font-size: 14px;
-    font-weight: 400;
-    border-radius: 5px;
-    color: white;
-    vertical-align: top;
-    margin-left: 235px;
-    width: 88px;
-    height: 32px;
    background-color: red;
  }
-
  .plan:disabled {
    cursor: not-allowed;
  }
-
-  .openPlan.enabled2 {
+  .openPlan {
+    cursor: pointer;
    border: none;
    font-size: 14px;
    font-weight: 400;
@@ -84,19 +75,12 @@
    vertical-align: top;
    width: 88px;
    height: 32px;
+  }
+  .openPlan.enabled2 {
    background: linear-gradient(180deg, rgba(103, 222, 0, 1) 0%, rgba(0, 181, 6, 1) 100%);
-    color: white;
  }

  .openPlan.disabled2 {
-    border: none;
-    font-size: 14px;
-    font-weight: 400;
-    border-radius: 5px;
-    color: white;
-    vertical-align: top;
-    width: 88px;
-    height: 32px;
    background-color: red;
  }

@@ -135,6 +119,7 @@
    color: white;
    border: none;
    border-radius: 5px;
+    cursor: pointer;
  }

  .btn2 {
--- a/hx-ai-intelligent/src/view/equipmentControl/lightingManage/tabs1.vue
+++ b/hx-ai-intelligent/src/view/equipmentControl/lightingManage/tabs1.vue
@@ -14,7 +14,7 @@
        <template v-if="!showAllButtonsArea">
          <button v-for="(button, index) in limitedButtons1" :key="index"
            :class="{ btn: true, selected: button.selected }" @click="selectButton(button)">
-            {{ button.regionName }}
+            {{ button.name }}
          </button>
          <div style="margin-top: 10px">
            <span @click="showAllButtonsArea = true" class="openzm"><down-outlined /> 展开</span>
@@ -23,7 +23,7 @@
        <template v-else>
          <button v-for="(button, index) in props.treeData" :key="index" :class="{ btn: true, selected: button.selected }"
            @click="selectButton(button)">
-            {{ button.regionName }}
+            {{ button.name }}
          </button>
          <div style="margin-top: 10px">
            <span @click="showAllButtonsArea = false" class="openzm"><up-outlined /> 回缩</span>
@@ -33,7 +33,7 @@
    </div>
    <!-- 照明回路部分 -->
    <div>
-      <div class="circuit-area" v-if="selectedButton">
+      <div class="circuit-area">
        <div class="circuit-tab"></div>
        <span class="circuit-text">照明回路</span>
        <div class="btn2">
@@ -50,12 +50,12 @@
          </button>
        </div>
      </div>
-      <div class="btnArea" v-if="selectedButton">
+      <div class="btnArea">
        <template v-if="!showAllButtons">
          <button v-for="(button, index) in limitedButtons2" :key="index"
            :class="{ btn: true, selected: button.selected }" class="zmhlbtn" @click="toggleSelection(button)">
-            <stop-outlined v-if="button.panel" />
-            {{ button.deviceName }}
+            <stop-outlined v-if="button.ctrlStatus" />
+            {{ button.name }}
          </button>
          <div style="margin-top: 10px">
            <span @click="showAllButtons = true" class="openzm"><down-outlined /> 展开</span>
@@ -64,8 +64,8 @@
        <template v-else>
          <button v-for="(button, index) in buttons2" :key="index" 
          :class="{ btn: true, selected: button.selected }" class="zmhlbtn" @click="toggleSelection(button)">
-            <stop-outlined v-if="button.panel" />
-            {{ button.deviceName }}
+            <stop-outlined v-if="button.ctrlStatus" />
+            {{ button.name }}
          </button>
          <div style="margin-top: 10px">
            <span @click="showAllButtons = false" class="openzm"><up-outlined /> 回缩</span>
@@ -218,6 +218,7 @@ import {
  UpOutlined,
  StopOutlined,
 } from '@ant-design/icons-vue';
+import { message } from 'ant-design-vue';
 // 请求
 import { http } from '/nerv-lib/util/http';
 import { lightingManage } from '/@/api/IlluminationInfo';
@@ -237,7 +238,7 @@ const setArea = () => {
  // 修改当前选中的分区
  selectedButton.value = props.nowArea
  // 设置当前显示的回路
-  buttons2.value = data.children
+  buttons2.value = data.childList
 }

 // 与父组件的交互  ===================================================================
@@ -254,13 +255,19 @@ const props = defineProps({
  }
 });
 // 向上传递修改选择样式
-const emit = defineEmits(['changeArea']);
+/** 
+ * @method changeArea 用于控制俯视图的选中状态
+ * @method reset 用于重置按钮区
+ */
+const emit = defineEmits(['changeArea','reset']);
 // 监听父组件选中的分区，并实时修改分区
 watch(() => props.nowArea, () => {
  setArea()
+  // 分区产生了切换， 线路的选中状态置空
+  handleButton.value = ''
 })

-// 照明区域 ==========================================================================
+// 照明区域业务 =======================================================================

 // 计划启用状态
 const isPlanEnabled = ref(false);
@@ -278,33 +285,36 @@ const selectButton = (button: any) => {
  console.log(button,'button')
  // 当前选中按钮
  selectedButton.value = button.id;
-  // 重置
  initMenu(1)
  button.selected = true
-  buttons2.value = button.children
-  // 反选area
+  buttons2.value = button.childList
  emit('changeArea', button.id);
+  handleButton.value = ''
 };
 // 默认最多展示8个按钮
 const limitedButtons1 = computed(() => props.treeData.slice(0, 8));

-// 照明回路 ==========================================================================
+// 照明回路业务 ======================================================================

-// 最近交互过的按钮，用于禁用和启用
+// 最近交互过的按钮id，用于禁用和启用
 const handleButton = ref('');

 // 面板启用/禁用状态
 const isPlanEnabled2 = ref(true);
 // 面板启用/禁用切换事件
 const togglePlan2 = () => {
-  // 获取最近交互的按钮
+  // 如果未交互任何按钮
+  if (handleButton.value == '') {
+    return message.info('请选择照明回路');
+  }
+  // 获取最近交互过的按钮
  const btn = buttons2.value.find((button) => button.id === handleButton.value)
-  let panel = +(!btn.panel)
+  let panel = +(!btn.ctrlStatus)
  isLoading.value = true
-  http.get(lightingManage.setDisable, { deviceGroup: btn.deviceGroup, panel }).then(res => {
+  http.get(lightingManage.setDisable, { deviceGroup: btn.code, panel }).then(res => {
    if (res.msg === 'success') {
      isPlanEnabled2.value = !isPlanEnabled2.value;
-      btn.panel = panel
+      btn.ctrlStatus = panel
      isLoading.value = false
    } else {
      isLoading.value = false
@@ -316,13 +326,14 @@ const togglePlan2 = () => {
 let singleSelection = ref(true);
 // 多选与单选切换事件
 const selectAll = () => {
-  emit('changeArea', [selectedButton.value])
  selectAllCheckbox.value = false
  buttons2.value.forEach((button) => {
    button.selected = false;
  });
  singleSelection.value = !singleSelection.value;
+  // 线路按钮被重置，
  showControlMode.value = false
+  emit('changeArea', [selectedButton.value])
 };

 // 全选状态
@@ -351,11 +362,12 @@ const toggleSelection = (button: any) => {
  // 存储一次按钮ID，用于禁用/启用交互
  handleButton.value = button.id
  // 根据按钮状态，展示禁用/启用按钮文本
-  if (button.panel) {
+  if (button.ctrlStatus) {
    isPlanEnabled2.value = true
  } else {
    isPlanEnabled2.value = false
  }
+
  // 选择时反控俯视图
  let level1 = selectedButton.value
  let level2 = button.id
@@ -401,7 +413,7 @@ const showAllButtons = ref(false);
 // 默认最多展示8个按钮
 const limitedButtons2 = computed(() => buttons2.value.slice(0, 8));

-// 控制模式 =======================================================================
+// 控制模式业务 ====================================================================

 // 决定该区域是否显示
 const showControlMode = ref(false);
@@ -413,7 +425,7 @@ const selectButton3 = (button3) => {
  selectedButton4.value = null; // 清空选中的控制场景按钮
 };

-// 控制场景 =======================================================================
+// 控制场景业务 =====================================================================

 // 决定该区域是否显示
 const showControlScene = ref(false);
@@ -431,7 +443,7 @@ const selectButton4 = (button4) => {
  selectedButton4.value = button4.label;
 };

-// 灯具参数 ========================================================================
+// 灯具参数表格 =====================================================================

 // 灯具参数 - 表格数据
 const lightSource = ref([{ num: '8/10', light: '100', temperature: '4200' }]);
@@ -493,6 +505,7 @@ const delBtn = (id: any) => {
    executeVisible.value = false;
  }
 };
+
 // 其他业务 ========================================================================

 const isLoading = ref(false)
@@ -502,13 +515,14 @@ const initMenu = (tier: number) => {
  // 1 = 照明区域 - 切换时，重置以下所有菜单
  if (tier == 1) {
    // 切换前，清除照明回路的选中状态
-    buttons2.value.forEach(item => {
-      item.selected = false
-    })
-    // 切换后，清空所有选中状态
-    props.treeData.forEach(item => {
-      item.selected = false
-    })
+    // buttons2.value.forEach(item => {
+    //   item.selected = false
+    // })
+    // // 切换后，清空所有选中状态
+    // props.treeData.forEach(item => {
+    //   item.selected = false
+    // })
+    emit('reset')
    // 控制模式 隐藏
    showControlMode.value = false;
    // 控制场景 隐藏
@@ -524,9 +538,17 @@ const initMenu = (tier: number) => {
 }
 // 刷新
 const refresh = () => {
+  // 关闭执行弹窗
  executeVisible.value = false
+  // 设置当前选中的序列
  selectedButton.value = '1';
  emit('changeArea', ['1']);
+  emit('reset')
+  let data = props.treeData[0]
+  // 默认选中
+  data.selected = true
+  buttons2.value = data.childList
+
  showControlMode.value = false;
  showControlScene.value = false;
  selectedButton4.value = null;
--- a/hx-ai-intelligent/src/view/equipmentControl/lightingManage/tabs2.vue
+++ b/hx-ai-intelligent/src/view/equipmentControl/lightingManage/tabs2.vue
@@ -40,8 +40,8 @@
          </button>
        </td>
        <td>
-          <button class="tabReboot" @click="handleRefClick1">重启</button>
-          <button class="tabDelete">删除</button>
+          <div class="tabReboot" @click="restartPlan(row.id)">重启</div>
+          <div class="tabDelete" @click="deletePlan(row.id)">删除</div>
        </td>
      </tr>
    </tbody>
@@ -54,7 +54,7 @@
    <div style="margin-top: 20px">
      <a-transfer
        v-model:target-keys="targetKeys"
-        :data-source="mockData"
+        :data-source="transferData"
        show-search
        :filter-option="filterOption"
        :render="(item) => item.title"
@@ -66,7 +66,7 @@
    <div style="width: 100%; height: 60px;"></div>
    <div class="button-box">
      <button class="cancel" @click="addVisible = false">取消</button>
-      <button class="execute">确定</button>
+      <button class="execute" @click="sendPlan">确定</button>
    </div>
  </div>
 </template>
@@ -76,11 +76,14 @@ import { ref, onMounted } from 'vue';
 // 请求
 import { http } from '/nerv-lib/util/http';
 import { lightingManage } from '/@/api/IlluminationInfo';
+import { message } from 'ant-design-vue';

 // 初始化 ===========================================================

 onMounted(() => {
+  // 计划表格
  getTable()
+  // 穿梭框原始数据
  getLeftPlan()
 })

@@ -94,6 +97,20 @@ const getTable = () => {
    dataSource.value = res.data
  })
 }
+// 删除表格中的计划
+const deletePlan = (id: String) => {
+  http.delete(lightingManage.deletePlan, [id]).then(res => {
+    message.success('操作成功')
+    getTable()
+  })
+}
+// 重启表格中的计划
+const restartPlan = (id: String) => {
+  http.post(lightingManage.restartPlan, { planId: id }).then(res => {
+    message.success('操作成功')
+    getTable()
+  })
+}

 // tab页弹窗部分 ====================================================

@@ -107,49 +124,43 @@ const addModal = () => {
 // 穿梭框部分 =======================================================

 // 穿梭框数据
-const transferData = ref([])
+const transferData = ref([]) as any;
 // 获得穿梭框原始数据
 const getLeftPlan = () => {
  http.get(lightingManage.getLeftPlan, {}).then(res => {
-    console.log(res)
+    let arr = []
+    res.data.forEach(item => {
+      arr.push({
+        key: item.id,
+        title: item.planName
+      })
+    })
+    transferData.value = arr
  })
 }

-// 操作日志
-const handleRefClick1 = () => {
-  alert(111)
-};
-
 const handleChange = (keys: string[], direction: string, moveKeys: string[]) => {
  console.log(keys, direction, moveKeys);
 };
 const handleSearch = (dir: string, value: string) => {
  console.log('search:', dir, value);
 };
-
-// 穿梭框 相关业务
-interface MockData {
-  key: string;
-  title: string;
-  description: string;
-  chosen: boolean;
-}
-const mockData = ref([
-  {
-    key: '1',
-    title: '计划再开',
-  },
-  {
-    key: '2',
-    title: '检修模式',
-  },
-  {
-    key: '3',
-    title: '设备变更',
-  },
-]);
+// 穿梭框选中数据
 const targetKeys = ref<string[]>([]);
-const filterOption = (inputValue: string, option: MockData) => {
+// 将穿梭框选中的计划提交
+const sendPlan = () => {
+  if (targetKeys.value.length < 1) {
+    return message.info('没有选择任何计划');
+  }
+  http.post(lightingManage.submitLeftPlan, targetKeys.value).then(res => {
+    message.success('添加成功')
+    // 如果发送成功，则刷新表格
+    getTable()
+    getLeftPlan()
+  })
+}
+
+const filterOption = (inputValue: string, option: any) => {
  return option.description.indexOf(inputValue) > -1;
 };

@@ -178,6 +189,7 @@ const filterOption = (inputValue: string, option: MockData) => {
    font-size: 14px;
    font-weight: 400;
    color: rgba(255, 255, 255, 1);
+    cursor: pointer;
  }
 }
 // 表格
@@ -204,6 +216,7 @@ const filterOption = (inputValue: string, option: MockData) => {
  .tabReboot,
  .tabDelete {
    border: none;
+    display: inline-block;
    background-color: rgba(0, 0, 0, 0);
    font-size: 14px;
    font-weight: 400;
@@ -215,6 +228,12 @@ const filterOption = (inputValue: string, option: MockData) => {
  .tabReboot {
    margin-right: 8px;
  }
+  .tabReboot::active {
+    color: white !important;
+  }
+  .tabDelete::active {
+    color: white;
+  }
 }
 ::v-deep(.ant-transfer) {
  // 屏蔽自带的hover效果
--- a/hx-ai-intelligent/src/view/equipmentManage/group/index.vue
+++ b/hx-ai-intelligent/src/view/equipmentManage/group/index.vue
@@ -190,7 +190,7 @@
 <style lang="less" scoped>
  .groupContainer {
    height: 100%;
-    overflow-y: auto;
+    // overflow-y: auto;
    background-color: @ns-content-bg;
    display: flex;
    // gap: @ns-gap;
@@ -198,10 +198,10 @@
    .table {
      background-color: @white;
      border-radius: @ns-border-radius;
-      overflow-y: auto;
    }

    .tree {
+      overflow-y: auto;
      margin-right: @ns-gap;
      :deep(.ant-spin-nested-loading) {
        width: 300px;
--- a/hx-ai-intelligent/src/view/equipmentManage/ledger/config.ts
+++ b/hx-ai-intelligent/src/view/equipmentManage/ledger/config.ts
@@ -53,13 +53,15 @@ export const tableConfig = (orgId) => {
      {
        title: '设备一级区域',
        dataIndex: 'device1Area',
-        textNumber: 5,
+        textWidth: 88,
+        // width: 130,
        textEllipsis: true,
      },
      {
        title: '设备二级区域',
        dataIndex: 'device2Area',
-        textNumber: 5,
+        textWidth: 88,
+        // width: 130,
        textEllipsis: true,
      },
      {
@@ -91,7 +93,8 @@ export const tableConfig = (orgId) => {
      {
        title: '设备描述',
        dataIndex: 'deviceDesc',
-        textNumber: 5,
+        textWidth: 88,
+
        textEllipsis: true,
      },
      {
--- a/hx-ai-intelligent/src/view/equipmentManage/ledger/index.vue
+++ b/hx-ai-intelligent/src/view/equipmentManage/ledger/index.vue
@@ -13,10 +13,4 @@
    name: 'LedgerIndex', // 与页面路由name一致缓存才可生效
  });
 </script>
-<style lang="less" scoped>
-  :deep(.ns-table-search),
-  :deep(.ns-part-tree),
-  :deep(.ns-table-main) {
-    box-shadow: @ns-content-box-shadow;
-  }
-</style>
+<style lang="less" scoped></style>