add:增加全局loading

2024-08-22 16:00:04 +08:00
parent ca74de5b37
commit 7b4f22222d
18 changed files with 401 additions and 251 deletions
--- a/hx-ai-intelligent/src/view/equipmentControl/airConditionControlSystem/device.vue
+++ b/hx-ai-intelligent/src/view/equipmentControl/airConditionControlSystem/device.vue
@@ -9,29 +9,29 @@
              device.regionName + ' > ' + device.deviceGroupName
            }}</span></div
          >
-          <button class="right-button">{{
-            record?.runStatus?.label ? record.runStatus.label : '--'
+          <button class="right-button" :class="getClass(record)">{{
+            record.runStatus.value != 0 ? record.runStatus.label : record.switchStatus.label
          }}</button>
        </div>
        <div class="light-tag-box">
          <div class="tag-box-item">
            <img src="/asset/image//bulbLogo/22496.png" alt="" />
-            <span class="title">控制模式</span>
+            <span class="title-text">控制模式</span>
            <span class="result">{{ record.autoStatus.label }}</span>
          </div>
          <div class="tag-box-item">
            <img src="/asset/image//bulbLogo/22496.png" alt="" />
-            <span class="title">温度</span>
+            <span class="title-text">温度</span>
            <span class="result">{{ record.temp + record.tempUnit }}</span>
          </div>
          <div class="tag-box-item">
            <img src="/asset/image//bulbLogo/22496.png" alt="" />
-            <span class="title">控制场景</span>
+            <span class="title-text">控制场景</span>
            <span class="result">{{ device.scene.label }}</span>
          </div>
          <div class="tag-box-item">
            <img src="/asset/image//bulbLogo/22496.png" alt="" />
-            <span class="title">风速</span>
+            <span class="title-text">风速</span>
            <span class="result">{{ record.windSpeed + record.windSpeedUnit }}</span>
          </div>
        </div>
@@ -75,6 +75,23 @@
  const device = computed(() => props.device);
  // 设备信息
  const record = computed(() => props.device.record);
+
+  const getClass = (data: any) => {
+    let state = data.runStatus.value;
+    let isOpen = data.switchStatus.value;
+    // 故障
+    if (state == 1) {
+      return 'button-fault';
+    } else if (state == 2) {
+      return 'button-repair';
+    } else if (state == 3) {
+      return 'button-alarm';
+    } else if (state == 0 && isOpen == 1) {
+      return 'button-on';
+    } else if (state == 0 && isOpen == 0) {
+      return 'button-off';
+    }
+  };
 </script>
 <style lang="less" scoped>
  .icon-box {
@@ -116,9 +133,29 @@
        width: 5em;
        height: 26px;
        background: rgba(57, 215, 187, 0.1);
-        border: 1px solid rgba(57, 215, 187, 1);
+        border-width: 1px;
+        border-style: solid;
        font-size: 12px;
-        color: rgba(57, 215, 187, 1);
+      }
+      .button-on {
+        color: #0dffa4;
+        border-color: #0dffa4;
+      }
+      .button-off {
+        color: #bfcde2;
+        border-color: #bfcde2;
+      }
+      .button-repair {
+        color: #ffbc46;
+        border-color: #ffbc46;
+      }
+      .button-alarm {
+        color: #f36163;
+        border-color: #f36163;
+      }
+      .button-fault {
+        color: #ff7636;
+        border-color: #ff7636;
      }
    }
  }
@@ -140,9 +177,9 @@
        vertical-align: middle;
      }

-      .title {
+      .title-text {
        position: absolute;
-        left: 60px;
+        left: 53px;
        top: 13px;
        color: rgba(64, 255, 252, 1);
      }
--- a/hx-ai-intelligent/src/view/equipmentControl/airConditionControlSystem/tabs1.vue
+++ b/hx-ai-intelligent/src/view/equipmentControl/airConditionControlSystem/tabs1.vue
@@ -269,7 +269,7 @@
 <script setup lang="ts">
  import { ref, computed, onMounted } from 'vue';
  import { DownOutlined, UpOutlined, StopOutlined } from '@ant-design/icons-vue';
-  import { message } from 'ant-design-vue';
+  import { message, Modal } from 'ant-design-vue';
  // 请求
  import { http } from '/nerv-lib/util/http';
  import { airConditionControl } from '/@/api/airConditionControlSystem';
@@ -736,47 +736,47 @@
    if (!changeList.value.length && !lockList.value.length) {
      return message.info('未产生任何修改');
    }
+    state.setLoading(true);
    http
      .get(planManage.getRunningPlan, {
-        deviceType: 2,
+        ctrlType: 2,
        projectId: state.projectId,
        siteId: state.siteId,
      })
      .then((res) => {
        // 如果有计划正在执行
        if (res.data && res.data.length) {
+          state.setLoading(false);
          // 此处框架本身存在问题，弹出层在本地环境无法关闭，暂时使用浏览器自带的confirm方法
-          // Modal.confirm({
-          //   title: '提示信息',
-          //   content: '有计划正在执行，点击"确定"将暂停当前计划',
-          //   onOk() {
-          //     return new Promise((resolve, reject) => {
-          //     });
-          //   },
-          //   onCancel() {  },
-          // });
-
-          let flag = window.confirm('有计划正在执行，点击"确定"将暂停当前计划');
-          if (flag) {
-            // 如果点击了确定，将先终止所有进行中的计划
-            http
-              .post(airConditionControl.submitChangeList, {
-                projectId: state.projectId,
-                siteId: state.siteId,
-                lockList: [],
-                sceneList: [],
-              })
-              .then((res) => {
-                console.log(res, '成功');
-                // 如果重置成功，则获取修改前后对比数据
-                if (res.retcode == 0) {
-                  sendChangeList();
-                  // 未成功提示
-                } else {
-                  message.error('关闭进行中的任务操作失败，请重新尝试');
-                }
-              });
-          }
+          Modal.confirm({
+            title: '提示信息',
+            content: '有计划正在执行，点击"确定"将暂停当前计划',
+            onOk() {
+              state.setLoading(true);
+              // 如果点击了确定，将先终止所有进行中的计划
+              http
+                .post(airConditionControl.submitChangeList, {
+                  projectId: state.projectId,
+                  siteId: state.siteId,
+                  lockList: [],
+                  sceneList: [],
+                })
+                .then((res) => {
+                  // 如果重置成功，则获取修改前后对比数据
+                  if (res.retcode == 0) {
+                    sendChangeList();
+                    // 未成功提示
+                  } else {
+                    state.setLoading(false);
+                    message.error('关闭进行中的任务操作失败，请重新尝试');
+                  }
+                })
+                .catch(() => {
+                  state.setLoading(false);
+                });
+            },
+            onCancel() {},
+          });
          // 没有计划正在执行，则直接请求
        } else {
          sendChangeList();
@@ -793,6 +793,7 @@
        siteId: state.siteId,
      })
      .then((res) => {
+        state.setLoading(false);
        if (res.retcode == 0) {
          diffList.value = res.data;
          executeVisible.value = true;
@@ -800,7 +801,9 @@
          message.warning('获取修改内容失败');
        }
      })
-      .catch(() => {});
+      .catch(() => {
+        state.setLoading(false);
+      });
  };
  // 通用取消
  const changeCancel = () => {};
--- a/hx-ai-intelligent/src/view/equipmentControl/airConditionControlSystem/tabs2.vue
+++ b/hx-ai-intelligent/src/view/equipmentControl/airConditionControlSystem/tabs2.vue
@@ -30,7 +30,7 @@
      </tr>
    </thead>
    <tbody>
-      <tr v-for="(row, index) in dataSource" :key="index">
+      <tr v-for="(row, index) in dataSource" v-show="row.executeStatus.value != 0" :key="index">
        <td>{{ index + 1 }}</td>
        <td>{{ row.startTime }}</td>
        <td>{{ row.planName }}</td>
@@ -162,7 +162,7 @@
        projectId: state.projectId,
        siteId: state.siteId,
        // 设备类型(1照明,2空调,3排风扇,4风幕机,5电动窗,6进水阀,7排水泵)
-        deviceType: 2,
+        ctrlType: 2,
      })
      .then((res) => {
        dataSource.value = res.data;
@@ -184,6 +184,10 @@
  };
  // 将对表格的修改统一发送
  const sendTable = () => {
+    if (!dataSource.value.length) {
+      return message.info('没有任何数据可以提交');
+    }
+    state.setLoading(true);
    http
      .post(
        airConditionControl.submitTableData +
@@ -191,6 +195,7 @@
        dataSource.value,
      )
      .then((res) => {
+        state.setLoading(false);
        if (res.retcode == 0) {
          message.success('操作成功');
          // 刷新数据
@@ -198,6 +203,9 @@
        } else {
          message.info(res.msg);
        }
+      })
+      .catch(() => {
+        state.setLoading(false);
      });
  };

@@ -228,7 +236,7 @@
        projectId: state.projectId,
        siteId: state.siteId,
        // 设备类型(1照明,2空调,3排风扇,4风幕机,5电动窗,6进水阀,7排水泵)
-        deviceType: 2,
+        ctrlType: 2,
      })
      .then((res) => {
        let arr: Array<Object> = [];
--- a/hx-ai-intelligent/src/view/equipmentControl/airConditionControlSystem/tabs3.vue
+++ b/hx-ai-intelligent/src/view/equipmentControl/airConditionControlSystem/tabs3.vue
@@ -55,16 +55,10 @@
            <div class="btn-item">
              <div class="left">控制模式</div>
              <div class="right">
-                <span>{{
-                  item.autoStatusBefore.label.indexOf('模式') != -1
-                    ? item.autoStatusBefore.label.replace('模式', '')
-                    : item.autoStatusBefore.label
-                }}</span>
+                <span>{{ item.autoStatusBefore.label ? item.autoStatusBefore.label : '--' }}</span>
                <img src="/asset/image/bulbLogo/22406.png" alt="" />
                <span>{{
-                  item.autoStatusAfter.label.indexOf('模式') != -1
-                    ? item.autoStatusAfter.label.replace('模式', '')
-                    : item.autoStatusAfter.label
+                  item.autoStatusAfter.label ? item.autoStatusAfter.label : '--'
                }}</span></div
              >
            </div>
@@ -110,7 +104,7 @@
        </div>
      </div>
    </div>
-    <div style="width: 100%; height: 80px"></div>
+    <div style="width: 100%; height: 160px"></div>
    <div class="button-box">
      <button class="cancel" @click="logModalVisible = false">关闭</button>
    </div>
@@ -126,7 +120,8 @@
  import { Pagination } from 'ant-design-vue';
  import { http } from '/nerv-lib/util/http';
  import { airConditionControl } from '/@/api/airConditionControlSystem';
-
+  // 全局变量
+  import { items } from '/@/store/item';
  // 初始化 =======================================================

  // 组件
@@ -140,6 +135,9 @@
    getTable();
  });

+  // 全局变量
+  const state = items();
+
  // 日志业务 ======================================================

  // 分页设置
@@ -154,6 +152,7 @@
  let trIndex = ref(-1);
  // 获得表格数据
  const getTable = (changePage = false) => {
+    state.setLoading(true);
    // 如果是切换页面，则清除当前序列、关闭弹窗
    if (changePage) {
      trIndex.value = -1;
@@ -166,9 +165,13 @@
        pageNum: pagination.value.pageNum,
      })
      .then((res) => {
+        state.setLoading(false);
        let data = res.data;
        dataSource.value = data.records;
        pagination.value.total = data.total;
+      })
+      .catch(() => {
+        state.setLoading(false);
      });
  };
  // 刷新功能（右下角）
@@ -193,16 +196,23 @@
  // 日志详情显隐
  const logModalVisible = ref(false);
  const getLogDetail = (id: any) => {
-    http.get(airConditionControl.getLogDetail, { logId: id }).then((res) => {
-      const data = res.data;
-      if (data && data.length) {
-        // 显示模态框
-        logModalVisible.value = true;
-        cxList.value = res.data;
-      } else {
-        return message.info('返回值无效');
-      }
-    });
+    state.setLoading(true);
+    http
+      .get(airConditionControl.getLogDetail, { logId: id })
+      .then((res) => {
+        const data = res.data;
+        state.setLoading(false);
+        if (data && data.length) {
+          // 显示模态框
+          logModalVisible.value = true;
+          cxList.value = res.data;
+        } else {
+          return message.info('返回值无效');
+        }
+      })
+      .catch(() => {
+        state.setLoading(false);
+      });
  };
  // 日志详情
  const cxList = ref([]);