Merge pull request '邓洁: 隧道接口部分对接' (#189) from dengjie into dev

Reviewed-on: http://git.feashow.cn/clay/tunnel-cloud-web/pulls/189

src/api/tunnelManage.js

@@ -42,7 +42,7 @@ export const getEquipmentList = (tunnelId) => {
 export const editTunnel = (data) => {
   return request({
     url: '/tunnel/model/details',
-    method: 'post',
+    method: 'put',
     data
   })
-}
+}

src/store/modelSceneStore.js

@@ -4,6 +4,7 @@ import { saveEquipment, initSceneData } from "../api/tunnelScene";
 import { ElMessage } from "element-plus";
 export const useModelSceneStore = defineStore("modelSceneData", () => {
   let equipmentList = ref("[]");
+  let allEditList = ref({});
   function initData(tunnelId = 1) {
     initSceneData(tunnelId)
       .then((res) => {
@@ -43,12 +44,24 @@ export const useModelSceneStore = defineStore("modelSceneData", () => {
         });
     });
   }
-
+  function getTunnelEditAllList(tunnelId = 1) {
+    return new Promise((resolve, reject) => {
+      initSceneData(tunnelId)
+        .then((res) => {
+          allEditList.value = res.data;
+          resolve(JSON.parse(allEditList.value));
+        })
+        .catch((Error) => {
+          reject();
+        });
+    });
+  }
   return {
     equipmentList,
     initData,
     saveSceneData,
     deleteEquipment,
     getEquipmentList,
+    getTunnelEditAllList,
   };
 });

src/views/edit/edit.vue

@@ -1,8 +1,15 @@
 <template>
   <div id="main">
     <div class="box-top">
+      <div class="back-tunnel" @click="router.back(-1)">
+        <div class="back-icon"></div>
+        <span>返回</span>
+      </div>
       <div class="tunnel-title"></div>
-      <div class="top-right">
+      <div class="btn-right">
+        <div class="del-btn" @click="handleGotoDevice">
+          设备管理
+        </div>
         <div class="del-btn" @click="handleSave">
           保存
         </div>
@@ -26,31 +33,58 @@
     </div>
 
     <!-- 这里就导入正常的编辑模式，就是我们之前写的部分 -->
-    <tunnel-scene id="tunnel-box" :isedit="true" :tunnelId="tunnelId"/>
+    <tunnel-scene id="tunnel-box" :isedit="true" :tunnelId="tunnelId" ref="tunnelScene"/>
   </div>
 </template>
 <script setup>
 import TunnelScene from "@/components/content/tunnelScene/TunnelScene.vue";
-import {getTunnelDetail} from "../../api/tunnelManage";
+import {editTunnel, getTunnelDetail} from "@/api/tunnelManage";
+import {useModelSceneStore} from "@/store/modelSceneStore";
+
 const router = useRouter();
 const tunnelId = reactive(router.currentRoute.value.params.tunnelId)
-
+const store = useModelSceneStore();
 const form = ref({
   tunnelName: '',
   serialNumber: '',
   totalLength: '',
   remarks: ''
 });
-
+const equipmentList = ref([])
+onMounted(async () => {
+  equipmentList.value = await store.getEquipmentList();
+})
 const getTunnel = () => {
   getTunnelDetail(tunnelId).then((res) => {
     if (res?.code === 1000) {
-      console.log('res',res)
-      form.value=res.data
+      form.value = res.data
+      console.log('for', form.value)
     }
   });
 }
 getTunnel()
+const handleGotoDevice = () => {
+  router.push('/device/' + tunnelId)
+}
+const handleSave = () => {
+  const data = {
+    tunnelId: tunnelId,
+    tunnelName: form.value.tunnelName,
+    serialNumber: form.value.serialNumber,
+    remarks: form.value.remarks,
+    // constructionLength:form.value.constructionLength,
+    constructionLength: 500,
+    tunnelLength: form.value.totalLength,
+    tunnelThreeConfig: JSON.stringify(equipmentList.value),
+  }
+  console.log('data', data, form.value.tunnelLength)
+  editTunnel(data).then((res) => {
+    if (res?.code === 1000) {
+      console.log('re---s', res)
+      // form.value=res.data
+    }
+  });
+}
 </script>
 <style lang="scss" scoped>
 #main {
@@ -58,32 +92,81 @@ getTunnel()
   height: 100%;
   width: 100%;
   background-color: #072348;
-  .del-btn {
-    position: absolute;
-    top: 85px;
-    right: 80px;
-    cursor: pointer;
-    font-size: 42px;
-    width: 180px;
-    height: 80px;
-    line-height: 80px;
-    background: #08B7B8;
-    border-radius: 11px;
-    padding-left: 50px;
+
+  .box-top {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+
+    .back-tunnel {
+      z-index: 2;
+      position: absolute;
+      top: 100px;
+      //left: 80px;
+      cursor: pointer;
+      margin: 0 0 0 80px;
+      display: flex;
+      align-items: center;
+      width: 180px;
+      height: 80px;
+      line-height: 70px;
+      border-radius: 11px;
+      border: 2px solid #08B7B8;
+      font-size: 42px;
+      color: #FFFFFF;
+
+      .back-icon {
+        margin-right: 20px;
+        margin-left: 23px;
+        width: 35px;
+        height: 35px;
+        background-image: url('@/assets/images/site/zdgl_icon_fh.png');
+      }
+    }
+
+    .btn-right {
+      display: flex;
+      z-index: 2;
+      position: absolute;
+      top: 100px;
+      right: 80px;
+
+      .del-btn {
+        &:first-child {
+          width: 220px;
+          margin-right: 40px;
+        }
+
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        cursor: pointer;
+        width: 180px;
+        height: 80px;
+        border-radius: 11px;
+        border: 2px solid #08B7B8;
+        color: #FFFFFF;
+        font-size: 42px;
+      }
+    }
+
   }
+
   #tunnel-box {
     height: 100%;
   }
-  .edit-box{
+
+  .edit-box {
     z-index: 2;
     position: absolute;
-    top: 160px;
-    left: 70px;
+    top: 250px;
+    left: 80px;
     width: 830px;
     height: 500px;
     background-image: url(@/assets/images/transducer/bg.png);
     padding: 0 30px;
     box-sizing: border-box;
+
     :deep(.el-form-item) {
       margin-top: 40px;
     }
@@ -112,4 +195,3 @@ getTunnel()
   }
 }
 </style>
-  

src/views/site/index.vue

@@ -34,7 +34,7 @@
                 <div>{{ item.info.tunnelName }}</div>
                 <div class="tunnel-icon"></div>
                 <div>施工长度{{ item.info.constructionLength }}米</div>
-                <div>实现长度{{ item.info.totalLength }}公里
+                <div>实现长度{{ item.info.totalLength }}米
                 </div>
               </div>
               <div class="tunnel-add" @click="goToAddTunnel(item.siteId)">
@@ -177,6 +177,7 @@ const handleClickSite = (type) => {
   if (type.checked) {
     siteIds.value.push(type.siteId)
     siteNameList.value.push(type.siteName)
+
   } else {
     siteIds.value.map((item, index) => {
       if (item === type.siteId) {
@@ -408,7 +409,7 @@ const handleCurrentChange = (val) => {
     flex-wrap: wrap;
     padding-left: 100px;
     padding-right: 100px;
-    justify-content: space-between;
+    //justify-content: space-between;
     box-sizing: border-box;
     overflow: hidden;
 
@@ -432,7 +433,7 @@ const handleCurrentChange = (val) => {
 
     .site-box {
       margin-top: 122px;
-      //margin-right: 1%;
+      margin-right: 32px;
       padding: 40px 50px;
       width: 1250px;
       height: 750px;

src/views/tunnel-manage/index.vue

@@ -243,6 +243,7 @@ const pageInfo = reactive({
 const total = ref(10);
 const getList = () => {
   getTunnelList({
+    siteId:siteId,
     ...pageInfo
   }).then(res => {
     if (res.code === 1000) {

src/views/tunnel/index.vue

@@ -114,7 +114,6 @@ onMounted(() => {
   });
   getUser()
   getOtherInfo()
-
 });
 const getUser = () => {
   getUserInfo().then(res => {
@@ -134,8 +133,8 @@ const getOtherInfo = () => {
     }
   });
 };
-const getScreenInfo = async (id) => {
-  await getLargeScreen(id).then((res) => {
+const getScreenInfo =  (id) => {
+   getLargeScreen(id).then((res) => {
     if (res?.code === 1000) {
       largeScreenData.value = res.data;
     }
@@ -146,7 +145,7 @@ const getTunnel = (id) => {
   getTunnelBySiteId(id).then((res) => {
     if (res?.code === 1000) {
       tunnelList.value = res.data
-      getScreenInfo(res.data[0].value)
+      // getScreenInfo(res.data[0].value)
     }
   });
 }