Merge pull request 'trp_dev' (#207) from trp_dev into dev

Reviewed-on: http://git.feashow.cn/clay/tunnel-cloud-web/pulls/207
2023-12-30 05:39:29 +00:00
parent 785d9b8289 1d73f0f8b8
commit a1e6973193
6 changed files with 169 additions and 236 deletions
--- a/src/components/content/tunnelScene/TunnelScene.vue
+++ b/src/components/content/tunnelScene/TunnelScene.vue
@@ -64,10 +64,10 @@ import {

 import { OBJLoader } from "three/examples/jsm/loaders/OBJLoader";
 import { RGBELoader } from "three/examples/jsm/loaders/RGBELoader";
-import { onMounted, reactive, ref, watch } from "vue";
+import { onMounted, reactive, ref, toRaw, watch } from "vue";
 import { ElMessage } from "element-plus";
-import { deleteEquipment, initData } from "./request";

+import { useModelSceneStore } from "@/store/modelSceneStore";
 // 获取html标签跟随组件dom
 const content = ref(null);
 const info = ref(null);
@@ -77,7 +77,7 @@ let demo; //定义demo对象
 const loader = new OBJLoader();
 let hdrLoader = new RGBELoader();
 let backColorSet = three.sRGBEncoding;
-
+const modelStore = useModelSceneStore();
 const params = defineProps(["isedit", "tunnelId", "tunnelLength", "form"]); //接收参数看是不是编辑模式，如果是编辑模式，则需要做一些处理

 let isedit = ref(params.isedit);
@@ -123,13 +123,18 @@ async function handleMounted() {
    map.set("equ_fan", await loadModel("/devicesModel/model2.obj"));
    map.set("equ_sensors", await loadModel("/devicesModel/sensors.obj"));
    demo.initDevicesModel(map);
-    // 初始化
-    modelList.value = await initData(params.tunnelId, params.form);
-    console.log("init", params.tunnelId);
-    demo.editTunnelInit(modelList.value);
+    // 初始化渲染设备
+    modelList.value = await modelStore.initModelData(
+      params.tunnelId,
+      params.form
+    );
+    // modelList.value = await initData(params.tunnelId, params.form);
+    console.log("test", modelList.value);
+    demo.editTunnelInit(toRaw(modelList.value));
  } catch (err) {
+    console.log(err);
    ElMessage({
-      message: "场景初始化异常！",
+      message: "场景初始化异常---！",
      type: "warning",
    });
  }
@@ -229,7 +234,8 @@ function handleRemoveEqu() {
 // 对话框确认删除
 function handleConfirmAddEqu() {
  console.log("target:", targetP.value.info);
-  deleteEquipment(targetP.value.info.equipmentId, pointGap)
+  modelStore
+    .deleteEquipment(targetP.value.info.equipmentId, pointGap)
    .then((res) => {
      demo.removeEquipment(targetP.value);
      centerDialogVisible.value = false;
--- a/src/components/content/tunnelScene/editEquComp/editDialog.vue
+++ b/src/components/content/tunnelScene/editEquComp/editDialog.vue
@@ -47,9 +47,18 @@
 import InputNum from "./childComps/InputNum.vue";
 import SelectInput from "./childComps/SelectInput.vue";
 import { getEquipmentType, getEquipment } from "@/api/tunnelScene";
-import { reactive, computed, defineEmits, defineProps, watch, ref } from "vue";
+import {
+  reactive,
+  computed,
+  defineEmits,
+  defineProps,
+  watch,
+  ref,
+  toRaw,
+} from "vue";
 import { ElMessage } from "element-plus";
-import { saveEquipment, initData } from "../request";
+import { useModelSceneStore } from "@/store/modelSceneStore";
+
 const emit = defineEmits(["cancel", "removeEquipment", "addEquipment"]);
 const params = defineProps([
  "pointNum",
@@ -63,28 +72,17 @@ const params = defineProps([
 let p = ref(57);
 const equipment = ref(null);
 const equipmentType = ref(null);
-
-let maxConstructionLength = ref(0);
+const modelStore = useModelSceneStore();
 //计算锚点之间距离
 const pointDistance_str = computed(
  () =>
-    `${params.pointGap}米*${params.pointNum}=${(
-      params.pointGap * params.pointNum
-    ).toFixed(2)}米`
-);
-
-watch(
-  () => params.form,
-  () => {
-    initData(params.tunnelId, params.form);
-  },
-  {
-    deep: true,
-  }
+    `${parseInt(params.pointGap)}米*${params.pointNum}=${
+      parseInt(params.pointGap) * params.pointNum
+    }米`
 );

 // 请求数据模型
-const equipmentSetting = reactive({
+const equipmentSetting = ref({
  equipmentId: null,
  equipmentName: "",
  equipmentType: "", //设备类型
@@ -93,24 +91,24 @@ const equipmentSetting = reactive({
  typeKey: null, //设备选择(设备名称)
 });
 function resetEquipmentSetting() {
-  equipmentSetting.equipmentId = null;
-  equipmentSetting.equipmentName = "";
-  equipmentSetting.equipmentType = "";
-  equipmentSetting.position = "";
-  equipmentSetting.threshold = "";
-  equipmentSetting.typeKey = null;
+  equipmentSetting.value.equipmentId = null;
+  equipmentSetting.value.equipmentName = "";
+  equipmentSetting.value.equipmentType = "";
+  equipmentSetting.value.position = "";
+  equipmentSetting.value.threshold = "";
+  equipmentSetting.value.typeKey = null;
  equipment.value.reset();
  equipmentType.value.reset();
 }

 // 绑定选择的设备类型
 function handleTypeChange(optionItem) {
-  equipmentSetting.equipmentType = optionItem.value;
+  equipmentSetting.value.equipmentType = optionItem.value;
 }
 function handleEquipmentChange(equipmentItem) {
-  equipmentSetting.equipmentName = equipmentItem.label;
-  equipmentSetting.equipmentId = equipmentItem.equipmentId;
-  equipmentSetting.typeKey = equipmentItem.value;
+  equipmentSetting.value.equipmentName = equipmentItem.label;
+  equipmentSetting.value.equipmentId = equipmentItem.equipmentId;
+  equipmentSetting.value.typeKey = equipmentItem.value;
 }
 // 设备类型选项参数
 let options = reactive([{ label: "暂无数据", value: "" }]);
@@ -120,7 +118,7 @@ let options2 = reactive([{ equipmentId: 0, label: "暂无数据", value: "" }]);

 // 模拟生成option2
 watch(
-  () => equipmentSetting.equipmentType,
+  () => equipmentSetting.value.equipmentType,
  (newVal) => {
    console.log(params.tunnelId, newVal);
    equipment.value.reset();
@@ -172,18 +170,23 @@ function addEquipment() {
    });
    return;
  }
-  if (!equipmentSetting.equipmentType || !equipmentSetting.equipmentId) {
+  if (
+    !equipmentSetting.value.equipmentType ||
+    !equipmentSetting.value.equipmentId
+  ) {
    ElMessage({
      message: "选项不能为空！",
      type: "warning",
    });
    return;
  }
-  equipmentSetting.position = params.position;
+  equipmentSetting.value.position = params.position;
+  console.log("add-", toRaw(equipmentSetting.value));
  // 合法请求
-  saveEquipment(equipmentSetting, params.pointGap)
+  modelStore
+    .addEquipment({ ...toRaw(equipmentSetting.value) }, params.pointGap)
    .then((res) => {
-      emit("addEquipment", equipmentSetting);
+      emit("addEquipment", equipmentSetting.value);
      ElMessage({
        message: "添加成功！",
        type: "success",
--- a/src/components/content/tunnelScene/request/index.js
+++ b/src/components/content/tunnelScene/request/index.js
@@ -1,145 +0,0 @@
-import { apiSaveEquipment, initSceneData } from "@/api/tunnelScene";
-import { toRaw } from "vue";
-let modelEquipmentList = [];
-let originData = null;
-// 初始化当前隧道数据并保存在本地
-export const initData = (tunnelId, otherInfo) => {
-  return new Promise((resolve, reject) => {
-    initSceneData(tunnelId)
-      .then((res) => {
-        originData = toRaw(otherInfo);
-        if (res.data.tunnelThreeConfig) {
-          console.log("data", res.data);
-          modelEquipmentList = JSON.parse(res.data.tunnelThreeConfig);
-        }
-        console.log("test", modelEquipmentList, originData);
-        resolve(modelEquipmentList);
-      })
-      .catch((Error) => {
-        ElMessage.error("场景初始化异常！");
-        reject();
-      });
-  });
-};
-
-//保存数据并提交
-export const saveEquipment = (equipmentInfo, pointGap) => {
-  const {
-    constructionLength,
-    isDefault,
-    remarks,
-    serialNumber,
-    siteId,
-    totalLength,
-    tunnelId,
-    tunnelName,
-  } = originData;
-  let tempModelEquipmentList = [...modelEquipmentList]; //数组克隆
-  tempModelEquipmentList.push(toRaw(equipmentInfo));
-  return new Promise((resolve, reject) => {
-    console.log("equId", equipmentInfo.equipmentId);
-    hasEquipment(equipmentInfo.equipmentId)
-      ? reject(3000)
-      : apiSaveEquipment({
-          constructionLength: autoComputeConstructionLength(
-            tempModelEquipmentList,
-            pointGap
-          ),
-          isDefault,
-          modelEquipmentList: tempModelEquipmentList,
-          remarks,
-          serialNumber,
-          tunnelId,
-          tunnelLength: totalLength,
-          tunnelName,
-        })
-          .then((res) => {
-            if (res?.code === 1000) {
-              modelEquipmentList.push(toRaw(equipmentInfo)); //存入本地
-              resolve();
-            }
-            console.log("add", res);
-            reject(res);
-          })
-          .catch((err) => {
-            reject();
-          });
-  });
-};
-
-// 删除
-export const deleteEquipment = (equipmentId, pointGap) => {
-  let tempModelEquipmentList = [...modelEquipmentList]; //数组克隆
-  tempModelEquipmentList = tempModelEquipmentList.filter(
-    (item) => item.equipmentId != equipmentId
-  );
-  console.log(
-    "del",
-    modelEquipmentList,
-    tempModelEquipmentList,
-    "id",
-    equipmentId
-  );
-  const {
-    constructionLength,
-    isDefault,
-    remarks,
-    serialNumber,
-    siteId,
-    totalLength,
-    tunnelId,
-    tunnelName,
-  } = originData;
-  return new Promise((resolve, reject) => {
-    apiSaveEquipment({
-      constructionLength: autoComputeConstructionLength(
-        tempModelEquipmentList,
-        pointGap
-      ),
-      isDefault,
-      modelEquipmentList: tempModelEquipmentList,
-      remarks,
-      serialNumber,
-      tunnelId,
-      tunnelLength: totalLength,
-      tunnelName,
-    })
-      .then((res) => {
-        if (res?.code === 1000) {
-          modelEquipmentList = modelEquipmentList.filter(
-            (item) => item.equipmentId === equipmentId
-          );
-          resolve();
-        }
-        reject(res);
-      })
-      .catch((err) => {
-        reject();
-      });
-  });
-};
-
-function autoComputeConstructionLength(modelEquipmentList, pointGap) {
-  let maxLength = 0;
-  modelEquipmentList.forEach((item) => {
-    const length =
-      Number(
-        item.position.substring(
-          item.position.indexOf("_") + 1,
-          item.position.lastIndexOf("_")
-        ) - 1
-      ) * pointGap;
-    if (length > maxLength) {
-      maxLength = length;
-    }
-  });
-  return maxLength;
-}
-
-function hasEquipment(equipmentId) {
-  let result = false;
-  modelEquipmentList.forEach((item) => {
-    if (item.equipmentId === equipmentId) result = true;
-  });
-  return result;
-}
--- a/src/components/content/tunnelScene/sceneClass/editEquipment/index.js
+++ b/src/components/content/tunnelScene/sceneClass/editEquipment/index.js
@@ -12,7 +12,7 @@ function addEquipment(targetPoint, formInfo) {
  if (targetPoint.hasDevice) {
    return;
  }
-  console.log("info", formInfo);
+
  switch (formInfo.equipmentType) {
    case "frequency":
      handleFanEqu.call(this, targetPoint, formInfo);
@@ -36,7 +36,7 @@ function addEquipment(targetPoint, formInfo) {
 // function handleValveEqu(targetPoint, equipmentInfo) {

 // }
-let allline = new Array
+// let allline = new Array();
 // 其他传感器
 function handleOtherEqu(targetPoint, equipmentInfo) {
  const equMesh = this.equMap.get("equ_sensors").clone();
@@ -69,14 +69,14 @@ function handleOtherEqu(targetPoint, equipmentInfo) {
  targetPoint.visible = false;
  targetPoint.hasWall = true;
  //处理风压阀的代码片段
-  let lineIndex = targetPoint.name.slice(7, 9)
-  if (allline.includes(Number(lineIndex))) {
-    allline.slice(array.indexOf(lineIndex), 1)
-    console.log('dadad');
-  } else {
-    allline.push(Number(lineIndex))
-  }
-  console.log(allline);
+  // let lineIndex = targetPoint.name.slice(7, 9);
+  // if (allline.includes(Number(lineIndex))) {
+  //   allline.slice(array.indexOf(lineIndex), 1);
+  //   console.log("dadad");
+  // } else {
+  //   allline.push(Number(lineIndex));
+  // }
+  // console.log(allline);
  // console.log(allline);
  // allline.forEach((item, index, array) => {
  //   if (array.includes(item)) {
--- a/src/store/modelSceneStore.js
+++ b/src/store/modelSceneStore.js
@@ -1,53 +1,122 @@
 import { defineStore } from "pinia";
-import { ref } from "vue";
-import { saveEquipment, initSceneData } from "../api/tunnelScene";
-import { ElMessage } from "element-plus";
+import { ref, toRaw } from "vue";
+import { apiSaveEquipment, initSceneData } from "../api/tunnelScene";
+
 export const useModelSceneStore = defineStore("modelSceneData", () => {
  let equipmentList = ref([]);
-  let allEditList = ref({});
-  function initData(tunnelId = 1) {
-    initSceneData(tunnelId)
-      .then((res) => {
-        // equipmentList.value = res.data.tunnelThreeConfig;
-        console.log("初始化的数据");
-      })
-      .catch((Error) => {
-        ElMessage.error("场景初始化异常！");
-      });
-  }
-  //默认初始化1号隧道
-  function saveSceneData(data) {
-    equipmentList.value.push(data);
+  let requestOtherConfig = ref({});

-    return saveEquipment(constructionLength, tunnelId, equipmentList.value);
-  }
-  //   删除设备
-  function deleteEquipment(constructionLength, tunnelId, EquipmentId) {
-    let temp = JSON.parse(equipmentList.value);
-    temp = temp.filter(
-      (item) => item.chooseEquipment.equipmentId != EquipmentId
-    );
-    equipmentList.value = JSON.stringify(temp);
-    return saveEquipment(constructionLength, tunnelId, equipmentList.value);
-  }
-  function getEquipmentList(tunnelId = 1) {
+  function initModelData(tunnelId, otherConfig) {
    return new Promise((resolve, reject) => {
+      handleSettingOtherConfig(otherConfig, requestOtherConfig);
      initSceneData(tunnelId)
        .then((res) => {
-          equipmentList.value = res.data.tunnelThreeConfig;
-          resolve(JSON.parse(equipmentList.value));
+          if (res.data.tunnelThreeConfig) {
+            equipmentList.value = JSON.parse(res.data.tunnelThreeConfig);
+          } else {
+            equipmentList.value = [];
+          }
+
+          resolve(toRaw(equipmentList.value));
        })
-        .catch((Error) => {
-          // ElMessage.error("场景初始化异常！");
+        .catch((error) => {
          reject();
        });
    });
  }
+
+  function addEquipment(equipmentInfo, pointGap) {
+    return new Promise((resolve, reject) => {
+      if (hasEquipment(equipmentList.value, equipmentInfo.equipmentId)) {
+        reject(3000);
+        return;
+      }
+      equipmentList.value.push(equipmentInfo);
+      apiSaveEquipment({
+        constructionLength: autoComputeConstructionLength(
+          equipmentList.value,
+          pointGap
+        ),
+        modelEquipmentList: toRaw(equipmentList.value),
+        ...requestOtherConfig,
+      })
+        .then((res) => {
+          console.log("res", res);
+          resolve();
+        })
+        .catch((err) => {
+          console.log("res", err);
+          equipmentList.value.pop();
+          reject();
+        });
+    });
+  }
+  //   删除设备
+  function deleteEquipment(equipmentId, pointGap) {
+    let equipment = null;
+    equipmentList.value = equipmentList.value.filter((item) => {
+      if (item.equipmentId === equipmentId) {
+        equipment = item;
+      }
+      return item.equipmentId != equipmentId;
+    });
+
+    return new Promise((resolve, reject) => {
+      apiSaveEquipment({
+        constructionLength: autoComputeConstructionLength(
+          equipmentList.value,
+          pointGap
+        ),
+        modelEquipmentList: toRaw(equipmentList.value),
+        ...requestOtherConfig,
+      })
+        .then((res) => {
+          resolve();
+        })
+        .catch((err) => {
+          equipmentList.value.push(equipment);
+          reject();
+        });
+    });
+  }
+
  return {
-    equipmentList,
-    initData,
-    saveSceneData,
+    initModelData,
+    addEquipment,
    deleteEquipment,
-    getEquipmentList,
  };
 });
+
+function handleSettingOtherConfig(otherConfig, requestOtherConfig) {
+  requestOtherConfig.isDefault = otherConfig.isDefault;
+  requestOtherConfig.remarks = otherConfig.remarks;
+  requestOtherConfig.serialNumber = otherConfig.serialNumber;
+  requestOtherConfig.tunnelId = otherConfig.tunnelId;
+  requestOtherConfig.tunnelLength = otherConfig.totalLength;
+  requestOtherConfig.tunnelName = otherConfig.tunnelName;
+}
+
+function autoComputeConstructionLength(modelEquipmentList, pointGap) {
+  let maxLength = 0;
+  modelEquipmentList.forEach((item) => {
+    const length =
+      Number(
+        item.position.substring(
+          item.position.indexOf("_") + 1,
+          item.position.lastIndexOf("_")
+        ) - 1
+      ) * pointGap;
+    if (length > maxLength) {
+      maxLength = length;
+    }
+  });
+  return maxLength;
+}
+
+function hasEquipment(equipmentList, equipmentId) {
+  let result = false;
+  equipmentList.forEach((item) => {
+    if (item.equipmentId === equipmentId) result = true;
+  });
+  return result;
+}
--- a/src/views/edit/edit.vue
+++ b/src/views/edit/edit.vue
@@ -60,7 +60,7 @@ const router = useRouter();
 const tunnelId = reactive(router.currentRoute.value.params.tunnelId);
 const userId = reactive(router.currentRoute.value.params.userId);
 const type = reactive(router.currentRoute.value.params.type);
-const store = useModelSceneStore();
+const modelStore = useModelSceneStore();
 const form = ref({
  tunnelName: "",
  serialNumber: "",
@@ -70,7 +70,7 @@ const form = ref({
 });
 const equipmentList = ref([]);
 onMounted(async () => {
-  equipmentList.value = await store.getEquipmentList();
+  // equipmentList.value = await store.getEquipmentList();
 });
 const getTunnel = () => {
  getTunnelDetail(tunnelId).then((res) => {