3.6

package-lock.json

@@ -22,7 +22,7 @@
         "sass": "^1.71.1",
         "sass-loader": "^13.3.3",
         "vue": "^3.3.4",
-        "vue-router": "^4.2.5"
+        "vue-router": "4.0"
       },
       "devDependencies": {
         "@typescript-eslint/eslint-plugin": "^6.7.2",
@@ -2988,9 +2988,9 @@
       }
     },
     "node_modules/@vue/devtools-api": {
-      "version": "6.5.0",
-      "resolved": "https://registry.npmmirror.com/@vue/devtools-api/-/devtools-api-6.5.0.tgz",
-      "integrity": "sha512-o9KfBeaBmCKl10usN4crU53fYtC1r7jJwdGKjPT24t348rHxgfpZ0xL3Xm/gLUYnc0oTp8LAmrxOeLyu6tbk2Q=="
+      "version": "6.6.1",
+      "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.6.1.tgz",
+      "integrity": "sha512-LgPscpE3Vs0x96PzSSB4IGVSZXZBZHpfxs+ZA1d+VEPwHdOXowy/Y2CsvCAIFrf+ssVU1pD1jidj505EpUnfbA=="
     },
     "node_modules/@vue/language-core": {
       "version": "1.8.13",
@@ -7174,11 +7174,14 @@
       }
     },
     "node_modules/vue-router": {
-      "version": "4.2.5",
-      "resolved": "https://registry.npmmirror.com/vue-router/-/vue-router-4.2.5.tgz",
-      "integrity": "sha512-DIUpKcyg4+PTQKfFPX88UWhlagBEBEfJ5A8XDXRJLUnZOvcpMF8o/dnL90vpVkGaPbjvXazV/rC1qBKrZlFugw==",
+      "version": "4.0.16",
+      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.0.16.tgz",
+      "integrity": "sha512-JcO7cb8QJLBWE+DfxGUL3xUDOae/8nhM1KVdnudadTAORbuxIC/xAydC5Zr/VLHUDQi1ppuTF5/rjBGzgzrJNA==",
       "dependencies": {
-        "@vue/devtools-api": "^6.5.0"
+        "@vue/devtools-api": "^6.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/posva"
       },
       "peerDependencies": {
         "vue": "^3.2.0"

package.json

@@ -25,7 +25,7 @@
     "sass": "^1.71.1",
     "sass-loader": "^13.3.3",
     "vue": "^3.3.4",
-    "vue-router": "^4.2.5"
+    "vue-router": "4.0"
   },
   "devDependencies": {
     "@typescript-eslint/eslint-plugin": "^6.7.2",

src/App.vue

@@ -1,10 +1,11 @@
 <template>
-  <viewIndex/>
+  <!-- <viewIndex/> -->
+  <router-view></router-view>
 </template>
 
 <script setup>
 //import viewIndex from './view/configurator.vue'
-import viewIndex from './view/appmian.vue'
+//import viewIndex from './view/appmian.vue'
 //import viewIndex from './view/index.vue'
 // import viewIndex from './view/myIndex.vue'
 //  import viewIndex from './view/case.vue'

src/main.js

@@ -4,7 +4,6 @@ import router from './router'
 import * as echarts from 'echarts'
 import $ from 'jquery'
 //import Vuex from 'vuex' // 引入vuex
-//import router from './router' // vue官方的路由
 import ElementUI from 'element-plus'
 import { createPinia } from 'pinia'
 import 'element-plus/theme-chalk/index.css' // 引入整个Element样式
@@ -22,6 +21,10 @@ createApp(App)
     // .use(mitt)
     //.use(Vuex)
     .mount('#app')
+    const originalReplace = router.prototype.replace
+    router.prototype.replace = function replace(location) {
+  return originalReplace.call(this, location).catch(err => err);
+}
 VueElement.prototype.$echarts = echarts;
 // app.config.globalProperties.$mitt=mitt();
 

src/main.ts

@@ -1,7 +1,6 @@
 import { createApp } from 'vue'
 import './style.css'
 import App from './App.vue'
-
 //1、route
 import router from '@/router/index'
 

src/router/globalRoutes.js

@@ -1,20 +0,0 @@
-/*
- * @Author: your name
- * @Date: 2021-01-13 17:37:21
- * @LastEditTime: 2021-01-18 09:45:13
- * @LastEditors: Please set LastEditors
- * @Description: In User Settings Edit
- * @FilePath: \vue3-element-admin\src\router\globalRoutes.js
- */
-export default [
-    {
-        path: "/login",
-        name: "Login",
-        component: () => import("@/views/Login.vue"),
-    },
-    {
-        path: "/404",
-        name: "404",
-        component: () => import("@/views/404.vue"),
-    },
-];

src/router/index.js

@@ -1,45 +1,25 @@
 // //创建一个路由器
-// import {createRouter,createwebHashHistory,} from "vue-router"
-// import myDemo from "@/components/myDemo.vue"
-// const router=createRouter({
-//    // history:createWebHashHistory(),//路由器的工作模式地址栏加#号
-//    history: createwebHashHistory(),
-//     routes:[
-//         {
-//             path:'/myDemo',
-//             component:myDemo
-//         }
-//     ]
-// })
-
-// export default router
-// import { createRouter, createWebHashHistory, createWebHistory } from "vue-router";
-// import configurator from "@/view/configurator.vue"
-// const router = createRouter({
-//     history: createWebHashHistory(),
-//     routes: [
-//         {
-//             path: '/myHome',
-//             component: () => import('@/components/myHome.vue') // 这是路由的籁加载，也可以其他方式
-//         },
-//         {
-//            path: '/configurator',
-//            component:configurator// 这是路由的籁加载，也可以其他方式
-//         },
-                  
-   
-//     ]
-// })
-
-// export default router;
-import { createRouter, createWebHashHistory } from "vue-router";
-import globalRoutes from "./globalRoutes";
-import mainRoutes from "./mainRoutes";
 
+import { createRouter, createWebHashHistory, } from "vue-router";
+import configurator from "@/view/configurator.vue"
 const router = createRouter({
     history: createWebHashHistory(),
-    scrollBehavior: () => ({ y: 0 }),
-    isAddDynamicMenuRoutes: false, // 是否已经添加动态(菜单)路由
-    routes: globalRoutes.concat(mainRoutes),
-});
+    routes: [
+        {
+            path: '/myHome',
+            component: () => import('@/components/myHome.vue') // 这是路由的籁加载，也可以其他方式
+        },
+        {
+            path: '/configurator',
+            component: configurator// 这是路由的籁加载，也可以其他方式
+        },
+        {
+            path: '/',
+            component: () => import('@/view/appmian.vue')
+        },
+
+    ]
+})
 export default router;
+
+

src/router/index.ts

@@ -13,4 +13,24 @@ const router = createRouter({
     ]
 })
 
-export default router;
+export default router;
+// import { createRouter, createWebHashHistory } from 'vue-router'
+// //引入vueRouter
+// import * as vueRouter from 'vue-router';
+// // 2. 定义一些路由
+// // 每个路由都需要映射到一个组件。
+// const routes = [
+//   {
+//     name: 'configurator',
+//     path: '/configurator',
+//     //组件懒加载
+//     component: () => import('@/view/configurator.vue')
+//   },
+// ]
+// // 3. 创建路由实例并传递 `routes` 配置
+// const router = vueRouter.createRouter({
+//   history: vueRouter.createWebHashHistory(),
+//   routes,
+// })
+
+// export default router;

src/router/mainRoutes.js

@@ -1,16 +0,0 @@
-/*
- * @Author: your name
- * @Date: 2021-01-13 17:39:02
- * @LastEditTime: 2021-01-18 15:48:29
- * @LastEditors: Please set LastEditors
- * @Description: In User Settings Edit
- * @FilePath: \vue3-element-admin\src\router\mainRoutes.js
- */
-export default [
-    {
-        path: "/configurator",
-        name: "Configurator",
-        component: () => import("@/view/configurator.vue"),
-    },
-  
-];

src/view/appmian.vue

@@ -1,205 +1,188 @@
 <template>
     <div class="appmian">
-     
+
         <el-container>
             <el-header>
-                        <div class="ve_menu_logo">
+                <div class="ve_menu_logo">
                     <div class="ve_title">
-                    <div class="ve_logo_img">
-                        <el-image
-                            style="height: 100%"
-                            :src="logo"
-                            fit="contain"
-                        ></el-image>
-                    </div>
-                    <h3 class="ve_logo_title">
-                        {{ title }}
-                    </h3>
-                </div>
-                    <el-menu
-                    :default-active="activeIndex"
-                    class="el-menu-demo"
-                    mode="horizontal"
-                    :popper-offset="2"
-            
-                    style="width:780px"
-                    background-color="#0D1639 "
-                    active-background-color="#0E50C8"
-                    text-color="#68ADFF"
-                    active-text-color="#fff"
-                    @select="handleSelect"
-                >
-                    <el-menu-item index="1">灾害源设置</el-menu-item>
-                    <el-menu-item index="2">边界设置</el-menu-item>
-                
-                    <el-menu-item index="3" >灾害推演</el-menu-item>
-                    <el-menu-item index="4">推演结果</el-menu-item>
-                </el-menu>
-                <div class="ve_right" >
-                    <div class="ve_time" v-show="titlefalse" @click="titleclick()">
-                        <span class="l_huoqing">{{headerobj.name}}</span>
-                        <span class="l_time">{{headerobj.time}}</span>
+                        <div class="ve_logo_img">
+                            <el-image style="height: 100%" :src="logo" fit="contain"></el-image>
+                        </div>
+                        <h3 class="ve_logo_title">
+                            {{ title }}
+                        </h3>
                     </div>
-                    <!-- <router-link to="/configurator"> -->
-                    <div class="ve_timeioc" @click="tiaozhuan()">
-                        <el-image
-                            :src="Vector"
-                            fit="contain"
-                        ></el-image>
-                        <span>模型库</span>
+                    <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" :popper-offset="2"
+                        style="width:780px" background-color="#0D1639 " active-background-color="#0E50C8"
+                        text-color="#68ADFF" active-text-color="#fff" @select="handleSelect">
+                        <el-menu-item index="1">灾害源设置</el-menu-item>
+                        <el-menu-item index="2">边界设置</el-menu-item>
+
+                        <el-menu-item index="3">灾害推演</el-menu-item>
+                        <el-menu-item index="4">推演结果</el-menu-item>
+                    </el-menu>
+                    <div class="ve_right">
+                        <div class="ve_time" v-show="titlefalse" @click="titleclick()">
+                            <span class="l_huoqing">{{ headerobj.name }}</span>
+                            <span class="l_time">{{ headerobj.time }}</span>
+                        </div>
+                        <div class="ve_timeioc" @click="tiaozhuan()">
+                            <el-image :src="Vector" fit="contain"></el-image>
+                            <span>模型库</span>
+                        </div>
                     </div>
-                <!-- </router-link> -->
                 </div>
-        </div>
             </el-header>
-         
+
             <el-main>
-                <Dialoges ref="lliudialog"  :addselect="addselect" :headerobj="headerobj" @headerclick="headerclick" @childfun="childfun" @moxingclick="moxingclick" ></Dialoges>
-                <source-disaster ref="sourcedis" :classradio="classradio" :aid="aid"/>
-                <info-boundary  ref="boundary" :classradio="classradio" :aid="aid" />
-                <info-animation ref="tanimation" :classradio="classradio" :aid="aid"/>
-              
+                <Dialoges ref="lliudialog" :addselect="addselect" :headerobj="headerobj" @headerclick="headerclick"
+                    @childfun="childfun" @moxingclick="moxingclick"></Dialoges>
+                <source-disaster ref="sourcedis" :classradio="classradio" :aid="aid" />
+                <info-boundary ref="boundary" :classradio="classradio" :aid="aid" />
+                <info-animation ref="tanimation" :classradio="classradio" :aid="aid" />
+
             </el-main>
         </el-container>
     </div>
-  </template>
-  
-  <script setup>
-import { ref, onMounted, reactive,nextTick } from "vue";
-    import {RouterView,RouterLink,useRouter } from "vue-router"
+</template>
+
+<script setup>
+import { ref, onMounted, reactive, nextTick } from "vue";
+import { RouterView, RouterLink, useRouter } from "vue-router"
 // import NavigateBar from "@/components/layout/NavigateBar.vue";
-import Dialoges  from "./InfoDialoges.vue"
+import Dialoges from "./InfoDialoges.vue"
 import logo from "@/assets/logo.png";
 // import myIndex  from "./index"
-import SourceDisaster  from "./components/InfoDisaster.vue"
-import InfoBoundary  from "./components/InfoBoundary.vue"
-import InfoAnimation  from "./components/InfoAnimation.vue"
+import SourceDisaster from "./components/InfoDisaster.vue"
+import InfoBoundary from "./components/InfoBoundary.vue"
+import InfoAnimation from "./components/InfoAnimation.vue"
 import Vector from "@/assets/img/Vector.png";
-import {timestampToTime} from '@/js/lindex.js'
+import { timestampToTime } from '@/js/lindex.js'
 import mitts from "@/utils/Bus"
-let lliudialog=ref();
-let sourcedis=ref();
+let lliudialog = ref();
+let sourcedis = ref();
 const title = "灾情推演软件";
 const activeIndex = ref('1')
 const activeIndex2 = ref('1')
-let classradio=ref()
-let boundary=ref();
-let tanimation=ref();
-let titlefalse=ref(false);
-let headerobj=ref({
-    time:'火灾事故2023.02.26',
-    name:"2024-03-20 11:30:20",
+let classradio = ref()
+let boundary = ref();
+let tanimation = ref();
+let titlefalse = ref(false);
+let headerobj = ref({
+    time: '火灾事故2023.02.26',
+    name: "2024-03-20 11:30:20",
 })
-let router=useRouter();
-let sgdata=ref({});
-let aid=ref();
-  onMounted(() => {
-  });
-// 跳转页面
-const tiaozhuan=()=>{
-    router.push("/configurator",{ aid:aid.value});
+let router = useRouter();
+let sgdata = ref({});
+let aid = ref();
+onMounted(() => {
+});
+// 跳转页面,{ aid:aid.value}
+const tiaozhuan = () => {
+    router.push("/configurator");
+    console.log(router.push("/configurator"))
 }
 // 
-const addselect=()=>{
-    classradio.value=lliudialog.value.classradio;
+const addselect = () => {
+    classradio.value = lliudialog.value.classradio;
 
 }
-const moxingclick=(val)=>{
-    titlefalse.value=val;
+const moxingclick = (val) => {
+    titlefalse.value = val;
 }
 //点击头部弹出弹框
- const titleclick=()=>{
-    lliudialog.value.dialogVisible=true;
- }
+const titleclick = () => {
+    lliudialog.value.dialogVisible = true;
+}
 //获取aid
-const aidlist=()=>{
-    sgdata.value=lliudialog.value.sgdata;
-    aid.value=sgdata.value.aid
+const aidlist = () => {
+    sgdata.value = lliudialog.value.sgdata;
+    aid.value = sgdata.value.aid
 }
 // 获取子组件的方法
-const childfun=()=>{
+const childfun = () => {
     sourcedis.value.handledisaster(aid.value);
     boundary.value.addboundary(aid.value);
-     sourcedis.value.accident3();
+    sourcedis.value.accident3();
 }
-const headerclick=(data)=>{
+const headerclick = (data) => {
     console.log(data);
-    headerobj.value.name=data.name;
-    headerobj.value.time=data.time;
-    aid.value=data.aid
+    headerobj.value.name = data.name;
+    headerobj.value.time = data.time;
+    aid.value = data.aid
 }
-const handleSelect = (key,keyPath) => {
+const handleSelect = (key, keyPath) => {
     switch (key) {
-    case '1':
-    sourcedis.value.accident3();
-    boundary.value.accident4(key);
-    lliudialog.value.leftcoll.collfire=false;
-     lliudialog.value.leftcoll.collwater=false;
-     tanimation.value.monitor=false;
-        break;
-    case '2':
-    boundary.value.accident4(key);
-    sourcedis.value.sour.collfire=false;
-    sourcedis.value.sour.collwater=false;
-    lliudialog.value.leftcoll.collfire=false;
-     lliudialog.value.leftcoll.collwater=false;
-     tanimation.value.monitor=false;
-    break;
-    case '3':
-    boundary.value.accident4(key);
-    sourcedis.value.sour.collfire=false;
-    sourcedis.value.sour.collwater=false;
-    lliudialog.value.accident2();
-    tanimation.value.monitor=false;
-        break;
-     case '4':
-     boundary.value.accident4(key);
-     tanimation.value.accident5(aid.value);
-     sourcedis.value.sour.collfire=false;
-    sourcedis.value.sour.collwater=false;
-     lliudialog.value.leftcoll.collfire=false;
-     lliudialog.value.leftcoll.collwater=false;
-    default:
-        break;
-}
+        case '1':
+            sourcedis.value.accident3();
+            boundary.value.accident4(key);
+            lliudialog.value.leftcoll.collfire = false;
+            lliudialog.value.leftcoll.collwater = false;
+            tanimation.value.monitor = false;
+            break;
+        case '2':
+            boundary.value.accident4(key);
+            sourcedis.value.sour.collfire = false;
+            sourcedis.value.sour.collwater = false;
+            lliudialog.value.leftcoll.collfire = false;
+            lliudialog.value.leftcoll.collwater = false;
+            tanimation.value.monitor = false;
+            break;
+        case '3':
+            boundary.value.accident4(key);
+            sourcedis.value.sour.collfire = false;
+            sourcedis.value.sour.collwater = false;
+            lliudialog.value.accident2();
+            tanimation.value.monitor = false;
+            break;
+        case '4':
+            boundary.value.accident4(key);
+            tanimation.value.accident5(aid.value);
+            sourcedis.value.sour.collfire = false;
+            sourcedis.value.sour.collwater = false;
+            lliudialog.value.leftcoll.collfire = false;
+            lliudialog.value.leftcoll.collwater = false;
+        default:
+            break;
+    }
 }
-  
-  </script>
-  
-  <style lang="scss" scoped>
- 
-.appmian{
- 
-    .el-main{
+
+</script>
+
+<style lang="scss" scoped>
+.appmian {
+
+    .el-main {
         --el-main-padding: 0 !important;
     }
-    .el-header{
-    padding:0;
-    margin: 0;
-    width: 100%;
-    position: absolute;
-    z-index: 206;
-    top: 0;
+
+    .el-header {
+        padding: 0;
+        margin: 0;
+        width: 100%;
+        position: absolute;
+        z-index: 206;
+        top: 0;
     }
 }
 
 .ve_menu_logo {
     width: 100%;
-    height:70px;
+    height: 70px;
     background: #0D1639;
     white-space: nowrap;
     text-align: left;
     overflow: hidden;
     display: flex;
     background: #0D1639;
-    box-shadow: inset 0px 0px 17px 5px rgba(12,97,197,0.2);
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
     border-radius: 0px 0px 0px 0px;
     border-bottom: 1px solid;
     box-sizing: border-box;
     border-image: linear-gradient(28deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0)) 1 1;
-    .ve_title{
-     
-    }
+
+    .ve_title {}
+
     .ve_logo_img {
         padding-left: 30px;
         height: 100%;
@@ -208,139 +191,154 @@ const handleSelect = (key,keyPath) => {
         vertical-align: middle;
         padding: 15px;
     }
+
     .ve_logo_title {
         width: 160px;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    display: inline-block;
-    margin: 0;
-    vertical-align: middle;
-    color: #68ADFF;
-    font-size: 20px;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        display: inline-block;
+        margin: 0;
+        vertical-align: middle;
+        color: #68ADFF;
+        font-size: 20px;
     }
-    .el-menu-demo{
-        width:60% !important;
-   height: 70px;
-   border: none !important;
-   background: rgba(12,97,197,0);
-   .el-menu-item{
-    position: relative;
-    width: 97px;
-    font-family: Microsoft YaHei UI, Microsoft YaHei UI;
-    font-weight: bold;
-    font-size: 13px;
-    color: #68ADFF;
-    line-height: 15px;
-    text-align: center;
-    font-style: normal;
-    text-transform: none;
-    width: 110px;
-    height: 70px;
-    border-radius: 0px 0px 0px 0px;
-  border:none;
-   }
-   .is-active{
-    width: 110px;
-    height: 70px;
-    background:radial-gradient(ellipse at 54px 0px, #3AA0FF -37%, #123066 53%);
-    border-radius: 0px 0px 0px 0px;
-     border: 1px solid;
-    border-left: 1px solid rgba(16, 92, 240, 1);
-    border-right: 1px solid rgba(18, 48, 102, 1);
-     border-image: linear-gradient(347deg, rgba(16, 92, 240, 1), rgba(18, 48, 102, 1)) 1 1;
-    &:after {
-    width: 24px;
-    height: 1px;
-    background-color: #fff;
-    -webkit-transition: all ease-out 0.2s;
-    transition: all ease-out 0.2s;
-    content: "";
-    position: absolute;
-    left: 50%;
-    bottom: 15px;
-    webkit-transform: translate(-50%, 0%);
-    -moz-transform: translate(-50%,0%);
-    transform: translate(-50%, 0%);
-}
-   }
-}
-.ve_right{
-    // width: 350px;
-    height: 70px;
-    overflow: hidden;
-    position:absolute;
-    right: 0;
-    display: flex;
-  .ve_time{
-    width: 190px;
-    height: 55px;
-    padding-top: 15px;
-    height: 70px;
-    border-radius: 0px 0px 0px 0px;
-    border-left: 2px solid rgba(12, 97, 197, 0.20);
-    border-right: 2px  solid rgba(12, 97, 197, 0.20);;
-    box-sizing: border-box;
-   // border-image: linear-gradient(347deg, rgba(31, 107, 255, 1), rgba(164, 195, 255, 1)) 1 1;
-    span{
-       display: block;  
-       font-family: Microsoft YaHei UI, Microsoft YaHei UI;
-        color: #FFFFFF;
-        text-align: center;
-        font-style: normal;
-        text-transform: none;
-      }
-      .l_huoqing{
-        font-size: 13px;
-        line-height: 15px;
-        font-weight: bold;
-        line-height: 2;
-      }
-      .l_time{
-        font-size: 12px;
-        line-height: 14px;
-        font-weight: 400;
-      }
+
+    .el-menu-demo {
+        width: 60% !important;
+        height: 70px;
+        border: none !important;
+        background: rgba(12, 97, 197, 0);
+
+        .el-menu-item {
+            position: relative;
+            width: 97px;
+            font-family: Microsoft YaHei UI, Microsoft YaHei UI;
+            font-weight: bold;
+            font-size: 13px;
+            color: #68ADFF;
+            line-height: 15px;
+            text-align: center;
+            font-style: normal;
+            text-transform: none;
+            width: 110px;
+            height: 70px;
+            border-radius: 0px 0px 0px 0px;
+            border: none;
+        }
+
+        .is-active {
+            width: 110px;
+            height: 70px;
+            background: radial-gradient(ellipse at 54px 0px, #3AA0FF -37%, #123066 53%);
+            border-radius: 0px 0px 0px 0px;
+            border: 1px solid;
+            border-left: 1px solid rgba(16, 92, 240, 1);
+            border-right: 1px solid rgba(18, 48, 102, 1);
+            border-image: linear-gradient(347deg, rgba(16, 92, 240, 1), rgba(18, 48, 102, 1)) 1 1;
+
+            &:after {
+                width: 24px;
+                height: 1px;
+                background-color: #fff;
+                -webkit-transition: all ease-out 0.2s;
+                transition: all ease-out 0.2s;
+                content: "";
+                position: absolute;
+                left: 50%;
+                bottom: 15px;
+                webkit-transform: translate(-50%, 0%);
+                -moz-transform: translate(-50%, 0%);
+                transform: translate(-50%, 0%);
+            }
+        }
     }
-    .ve_timeioc{
-        width: 150px;
+
+    .ve_right {
+        // width: 350px;
         height: 70px;
-        // border-radius: 0px 0px 0px 0px;
-        // border: 1px solid;
-        // border-image: linear-gradient(347deg, rgba(16, 92, 240, 1), rgba(164, 195, 255, 1)) 1 1;
-        font-family: Microsoft YaHei UI, Microsoft YaHei UI;
-        font-weight: bold;
-        font-size: 13px;
-        color: #68ADFF;
-        line-height: 15px;
-        text-align: center;
-        font-style: normal;
-        text-transform: none;
+        overflow: hidden;
+        position: absolute;
+        right: 0;
         display: flex;
-        justify-content: center;
-        align-items: center;
-        span{
-            padding-left: 15px;
+
+        .ve_time {
+            width: 190px;
+            height: 55px;
+            padding-top: 15px;
+            height: 70px;
+            border-radius: 0px 0px 0px 0px;
+            border-left: 2px solid rgba(12, 97, 197, 0.20);
+            border-right: 2px solid rgba(12, 97, 197, 0.20);
+            ;
+            box-sizing: border-box;
+
+            // border-image: linear-gradient(347deg, rgba(31, 107, 255, 1), rgba(164, 195, 255, 1)) 1 1;
+            span {
+                display: block;
+                font-family: Microsoft YaHei UI, Microsoft YaHei UI;
+                color: #FFFFFF;
+                text-align: center;
+                font-style: normal;
+                text-transform: none;
+            }
+
+            .l_huoqing {
+                font-size: 13px;
+                line-height: 15px;
+                font-weight: bold;
+                line-height: 2;
+            }
+
+            .l_time {
+                font-size: 12px;
+                line-height: 14px;
+                font-weight: 400;
+            }
         }
+
+        .ve_timeioc {
+            width: 150px;
+            height: 70px;
+            // border-radius: 0px 0px 0px 0px;
+            // border: 1px solid;
+            // border-image: linear-gradient(347deg, rgba(16, 92, 240, 1), rgba(164, 195, 255, 1)) 1 1;
+            font-family: Microsoft YaHei UI, Microsoft YaHei UI;
+            font-weight: bold;
+            font-size: 13px;
+            color: #68ADFF;
+            line-height: 15px;
+            text-align: center;
+            font-style: normal;
+            text-transform: none;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+
+            span {
+                padding-left: 15px;
             }
+        }
+    }
 }
-}
-  </style>
-  <style>
-   body{
+</style>
+
+<style>
+body {
     width: 100%;
     height: 100vh;
-    background: #161A2A ; 
-  }
-  button:focus, button:focus-visible{
-    outline:none;
-  }
-  .l_Dialog{
+    background: #161A2A;
+}
+
+button:focus,
+button:focus-visible {
+    outline: none;
+}
+
+.l_Dialog {
     position: absolute;
     z-index: 206;
     top: 0;
 
-  }
-</style>
-  
-  
+}
+</style>

src/view/components/MenuCheck.vue

@@ -0,0 +1,652 @@
+<template>
+    <div class="l_Dialog">
+        <el-dialog v-model="sendialogVisible" width="470" align-center :modal="false" :close-on-click-modal="false"
+            modal-class="summary-dlg" draggable class="dialog_class bgcolor zhucentent">
+            <template #header="{ titleId, titleClass }">
+                <div class="my-header xinxi_header">
+                    <el-image :src="icon" fit="contain"></el-image>
+                    <h4 :id="titleId" :class="titleClass">监测点信息</h4>
+
+                </div>
+            </template>
+            <div class="classtab">
+                <div class="asides_content">
+                    <div class="jc_content tablecolor jc_content">
+
+                        <div class="font12 my_content1">
+                            <div class="xian btncolor tablefocus bmar tianjia">
+
+                                <el-table :data="tableData" style="width:468px" :max-height="tableHeight"
+                                    :highlight-current-row="currentrow" :row-class-name="tableRowClassName"
+                                    @row-click="handleDelete($event)"
+                                    :header-cell-style="{ 'background': 'rgba(13, 22, 57, 0.9) ' }">
+                                    <el-table-column type="index" label="编号"  />
+                                    <el-table-column prop="pid" label="所在巷道" />
+                                    <el-table-column prop="site" label="位置" />
+                                </el-table>
+                            </div>
+                        </div>
+                        <div class="dialog-footer footer_div l_btn">
+                            <div class="footerbtn flex1">
+                                <div class="borderimg"><el-button @click="addsg();sdialog.dianadddialog=true">添加</el-button></div>
+                            </div>
+                            <div class="footerbtn flex1">
+                                <div class="borderimg"><el-button @click="shanchu()">
+                                        删除
+                                    </el-button></div>
+                            </div>
+                            <div class="footerbtn flex1">
+                                <div class="borderimg"><el-button @click="amend()">
+                                        修改
+                                    </el-button></div>
+                            </div>
+                            <div class="footerbtn flex1">
+                                <div class="borderimg"><el-button @click="sendialogVisible = false">
+                                        确定
+                                    </el-button></div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </el-dialog>
+        <!-- 删除 -->
+        <el-dialog v-model="dialogsgdelect" width="400" class="dialog_class bgcolor tianjia">
+
+            <template #header="{ titleId, titleClass }">
+                <div class="my-header ">
+                    <el-image :src="icon" fit="contain"></el-image>
+                    <h4 :id="titleId" :class="titleClass">删除框</h4>
+
+                </div>
+            </template>
+            <h4 class="delecttitle"> 是否确认删除 <span class="spanclad">编号{{ zqname }}</span></h4>
+            <div class="dialog-footer footer_div l_btn">
+                <div class="footerbtn flex1">
+                    <div class="borderimg"><el-button @click="dialogsgdelect = false">取消</el-button></div>
+                </div>
+                <div class="footerbtn flex1">
+                    <div class="borderimg"><el-button @click="fundeledata(); dialogsgdelect = false">
+                            确定
+                        </el-button></div>
+                </div>
+            </div>
+        </el-dialog>
+        <!-- 添加 -->
+        <el-dialog v-model="sdialog.dianadddialog" width="500px"  class="dialog_class bgcolor tianjia">
+          <template #header="{titleId, titleClass }">
+          <div class="my-header ">
+              <el-image :src="icon" fit="contain" ></el-image>
+              <h4 :id="titleId" :class="titleClass">{{add}}</h4>
+
+          </div>
+          </template>
+          <div class="demo-input-suffix firsttitle magintop guand_1">
+       <el-form-item label="巷道名称" :label-width="formLabelWidth5">
+          <el-input  v-model="source.selectstr"
+              class="w-50 m-2"
+              placeholder="巷道名称"  />
+          </el-form-item>
+          <div class="btn2">
+          <el-button type="primary"  @click="fireclick();sdialog.dialogVisiblenode=true">选择巷道</el-button></div>
+          </div>
+          <div class="input">
+          <el-form-item label="位置" :label-width="formLabelWidth5">
+              <el-input-number v-model="source.site" :min="0" :max="1" 
+              :precision="2" :step="0.1"
+              controls-position="right"
+              class="w-50 m-2"
+              placeholder="位置"
+              />
+          </el-form-item>
+          </div>
+          <div class="dialog-footer footer_div l_btn">
+              <div class="footerbtn flex1"><div class="borderimg"><el-button @click="sdialog.dianadddialog=false">取消</el-button></div></div>
+              <div class="footerbtn flex1"><div class="borderimg"><el-button  @click="addEditaip(); sdialog.dianadddialog=false">
+          确定
+              </el-button></div></div>
+          </div>
+      </el-dialog> 
+       <!-- 选择管道 -->
+       <el-dialog
+     v-model="sdialog.dialogVisiblenode"
+     width="600"
+     class="dialog_class bgcolor tianjia asideg asidegbg leftbgimg"
+   >
+   <template #header="{titleId, titleClass }">
+          <div class="my-header ">
+              <el-image :src="icon" fit="contain" ></el-image>
+              <h4 :id="titleId" :class="titleClass"> 选择巷道</h4>
+
+          </div>
+          </template>
+   <div class="demo-input-suffix firsttitle leftbgimg2 my_content1">
+      <div class="guand_1">
+         <el-form-item label="节点选择" :label-width="formLabelWidth5">
+       <el-input  v-model="searchtaggd"
+         class="w-50 m-2"
+         placeholder="巷道"
+         />
+     </el-form-item>
+     <div class="asdis_btn">
+      <div class="flex_a"><div class="btns"  @click="searchgd"><span class="spantext">搜索</span></div></div>
+  </div>
+  </div>
+
+   <el-table
+      :row-class-name="tableRowClassName"
+      :max-height="tableHeight"
+     ref="multipleTableRef"
+     :data="tableData2"
+     style="width: 100%"
+     @select="projectsSelectionSelect"
+     :header-cell-style="{'background':'rgba(13, 22, 57, 0.96) '}"
+   >
+     <el-table-column type="selection" width="55" />
+     <el-table-column property="snId" label="开始节点"/>
+     <el-table-column property="enId" label="结束节点"/>
+     <el-table-column property="id" label="编号" width="70"/>
+     <el-table-column property="name" label="名称" width="70"/>
+     <el-table-column property="sectionType" label="截面类型" width="120"/>
+     <el-table-column property="roughCoe" label="粗糙系数"/>
+     <el-table-column property="sectionPara1" label="截面参数1" width="90"/>
+     <el-table-column property="sectionPara2" label="截面参数2" width="90" />
+     <el-table-column property="sectionPara3" label="截面参数3" width="90"/>
+     <el-table-column property="sectionPara4" label="截面参数4" width="90"/>
+     <el-table-column property="sectionPara5" label="截面参数5" width="90"/>
+     
+   </el-table>
+     <div class="demo-pagination-block" style="margin-top: 20px;">
+  <el-pagination
+  v-model:current-page="currentPage4"
+    v-model:page-size="pageSize4"
+  small
+  background
+  layout="prev, total,pager, next, jumpe,"      
+  :total="parseInt(total)"
+  class="mt-4"
+  @size-change="handleSizeChange"
+  @current-change="handleCurrentChange"
+/>
+</div>
+       <div class="dialog-footer footer_div l_btn">
+      <div class="footerbtn flex1"><div class="borderimg"><el-button @click="sdialog.dialogVisiblenode = false">取消</el-button></div></div>
+      <div class="footerbtn flex1"><div class="borderimg"><el-button @click="queding();sdialog.dialogVisiblenode = false">
+     确定
+      </el-button></div></div>
+    </div>
+   </div>
+   </el-dialog>
+    </div>
+</template>
+
+<script setup>
+import { computed, ref, onMounted, reactive, toRef } from "vue";
+import { request, uploadFile } from "@/utils/request";
+import { ElMessage, ElButton, ElDialog, ElSelect } from 'element-plus'
+import icon from "@/assets/img/icon.png";
+import { timestampToTime } from '@/js/lindex.js'
+let sendialogVisible = ref(false);
+let currentrow=ref(true);
+let addVisible = ref(false);
+let dialogsgdelect = ref(false)
+let classradio1 = ref('Fire');
+const formLabelWidth6 = ref(100);
+const formLabelWidth5=ref(90);
+const multipleTableRef = ref()
+const multipleSelection = ref([])
+let add = ref("");
+let tableData2=ref([]);
+let sdialog=ref({
+    dianadddialog:false,
+    dialogVisiblenode:false,
+})
+let total = ref(1);
+let searchtaggd = ref("");
+const currentPage4 = ref(1);
+const pageSize4 = ref(5)
+let cid=ref("");
+let source=ref({
+    selectstr:'',
+    site:''
+})
+let  firepid=ref("")
+const resultactiveName = ref("first");
+let tableHeight = ref(570);
+let tableData = ref([]);
+let tableobj = ref({});
+let zqname = ref();
+let senobj = ref({
+    pid: 0,
+    seid: 0,
+    site: 0,
+    type: "温度传感器"
+})
+const tableRowClassName = ({ row, rowIndex }) => {
+    if (rowIndex % 2 != 0) {
+        return 'evenRow';
+    }
+    return 'oddRow';
+
+}
+// 选中一行
+const handleDelete = (val) => {
+    currentrow.value=true;
+    tableobj.value = val;
+    cid.value=val.cid
+}
+// 删除
+const shanchu = () => {
+    if (JSON.stringify(tableobj.value) == '{}') {
+        ElMessage.error("你还没有选中修改的项目")
+    } else {
+        zqname.value = tableobj.value.pid;
+        dialogsgdelect.value = true;
+ 
+    }
+}
+const fundeledata=()=>{
+    const params = {
+        transCode: 'D10006',
+        cid: cid.value
+    }
+    request(params)
+        .then((res) => {
+            getsensor();
+        })
+        .catch((err) => {
+            ElMessage.error(err.returnMsg)
+        })
+}
+
+onMounted(() => {
+     getsensor();
+});
+// 查询
+const getsensor = () => {
+    const params = {
+        transCode: 'D10004',
+    }
+    request(params)
+        .then((res) => {
+            tableData.value = res.rows;
+
+        })
+        .catch((err) => {
+            ElMessage.error(err.returnMsg)
+        })
+}
+//添加
+const addsg = () => {
+    add.value = "添加";
+    addVisible.value = true; 
+    currentrow.value=false;
+    source.value.selectstr='';
+    source.value.site='';
+    firepid.value='';
+    cid.value='';
+
+}
+// 添加修改的接口
+const addEditaip=()=>{
+    const params = {
+        transCode: 'D10005',
+        cid:cid.value,
+        pid:firepid.value,
+        site:source.value.site
+    }
+    request(params)
+        .then((res) => {
+            tableData.value = res.rows;
+            getsensor();
+        })
+        .catch((err) => {
+            ElMessage.error(err.returnMsg)
+        })
+
+}
+ 
+//修改
+const amend = () => {
+    add.value = "修改";
+    if (JSON.stringify(tableobj.value) == '{}') {
+        ElMessage.error("你还没有选中修改的项目")
+    } else {
+        sdialog.value.dianadddialog= true; 
+        cid.value = tableobj.value.cid;
+        source.value.site = tableobj.value.site;
+        source.value.selectstr=tableobj.value.pid;
+    }
+}
+// 选择巷道
+const fireclick = () => {
+    pipelinedata('');
+}
+// 节点搜索
+function searchgd() {
+    pipelinedata(searchtaggd.value);
+}
+// 节点分页查询
+const handleCurrentChange = (val) => {
+    pipelinedata(searchtaggd.value)
+}
+//节点数据查询
+const pipelinedata = (searchtag) => {
+    const params = {
+        transCode: 'D00001',
+        count: pageSize4.value,
+        page: currentPage4.value,
+        searchtag: searchtag,
+    }
+    request(params)
+        .then((res) => {
+            tableData2.value = res.rows;
+            total.value = res.total;
+        })
+        .catch((err) => {
+            ElMessage.error(err.returnMsg)
+        })
+}
+//选中项
+const projectsSelectionSelect=(selection, row)=>{
+       if(selection.length>1){
+        multipleTableRef.value.clearSelection();
+        multipleTableRef.value.toggleRowSelection(row,true);
+        multipleSelection.value=selection[1];
+        return;
+       }
+        if(selection.length==1){
+          multipleSelection.value=selection;
+        
+       }else if(selection.length==0){
+      
+       }
+     }
+     const  selectfun=()=>{
+        source.value.selectstr='';
+     currentPage4.value=1;
+     console.log()
+       if(multipleSelection.value.length!=0){
+      firepid.value=multipleSelection.value[0].id;
+      source.value.selectstr=multipleSelection.value[0].name;
+      console.log(multipleSelection.value[0])
+       }else{
+        // selectstr.value='';
+        
+       }
+  
+     }
+    //  确定
+     const  queding=()=>{
+       selectfun();
+     
+     }
+defineExpose({ sendialogVisible, });
+</script>
+
+<style lang="scss" scoped>
+.jc_padding .el-table tr {
+    height: 30px !important;
+    background: rgba(104, 173, 255, 0.3);
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+    border-radius: 0px 0px 0px 0px;
+    border: 1px solid;
+    border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+}
+
+.flex_a {
+    flex: 1;
+    padding: 0 19px;
+}
+
+.btns {
+    width: 72px;
+    height: 30px;
+    background-image: url(../../assets/img/Rectangle399.png);
+    background-repeat: no-repeat;
+    line-height: 30px;
+    overflow: hidden;
+    margin: 10px 0;
+
+    .spantext {
+        font-weight: bold;
+        font-size: 12px;
+        color: #FFFFFF;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+    }
+}
+
+.header_z {
+    box-shadow: none !important;
+    padding: 10px 20px !important;
+}
+
+.header_l {
+    line-height: 10px;
+    // height: 40px;
+    text-align: left;
+    padding: 0 20px;
+    // border-bottom: 1px solid;
+    border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+    border-radius: 0px 0px 0px 0px;
+
+    .el-image {
+        padding: 10px 10px 0 0;
+    }
+
+    h4 {
+        font-weight: bold;
+        font-size: 12px;
+        color: #68ADFF;
+        line-height: 14px;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+    }
+
+}
+
+.jc_padding {
+    padding: 18px 10px;
+}
+
+.line {
+    border-bottom: 1px solid rgba(255, 255, 255, 0.20);
+    box-sizing: border-box;
+}
+
+.L_aside {
+    .iconimg {
+        width: 37px;
+        height: 36px;
+        margin: 0 7px 0 24px;
+    }
+}
+
+.ddd {
+    margin-top: 20px;
+
+    .ddd_div {
+        padding: 20px 0;
+        position: relative;
+    }
+
+    .class_btn {
+        position: absolute;
+        right: 0;
+        top: 21px;
+    }
+
+    .header_l {
+        line-height: 10px;
+        // height: 40px;
+        text-align: left;
+        padding: 0 20px;
+        // border-bottom: 1px solid;
+        border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+        box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+        border-radius: 0px 0px 0px 0px;
+
+        .el-image {
+            padding: 10px 10px 0 0;
+        }
+
+        h4 {
+            font-weight: bold;
+            font-size: 12px;
+            color: #68ADFF;
+            line-height: 14px;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+    }
+}
+
+.el-dialog__title {
+    display: inline-block;
+}
+
+.bgcolor {
+    // width: 482px;
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+    border-radius: 0px 0px 0px 0px;
+    border: 1px solid;
+    border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+}
+
+.dialog_class {
+    .my-header {
+        line-height: 10px;
+        height: 40px;
+        text-align: left;
+        padding: 0 20px;
+        border-bottom: 1px solid;
+        border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+        box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+        border-radius: 0px 0px 0px 0px;
+
+        .el-image {
+            padding: 10px 10px 0 0;
+        }
+
+        h4 {
+            font-weight: bold;
+            font-size: 12px;
+            color: #68ADFF;
+            line-height: 14px;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+    }
+
+    .my_content {
+        width: 100%;
+        height: 90px;
+        box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+        border-radius: 0px 0px 0px 0px;
+        position: relative;
+
+        .radio-group {
+            display: flex;
+            justify-content: center;
+
+            .el-radio {
+                flex: 1;
+                justify-content: center;
+                font-weight: bold;
+                font-size: 12px;
+                color: #FFFFFF;
+                line-height: 14px;
+
+            }
+
+        }
+    }
+
+    .el-dialog__footer {
+        position: absolute;
+        bottom: 17px;
+        display: flex;
+
+        .footerbtn {
+            flex: 1;
+            text-align: center;
+        }
+    }
+}
+
+.my_content1 {
+    .el-table .cell {
+        font-weight: 400;
+        font-size: 12px;
+        color: #FFFFFF !important;
+        line-height: 14px;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+    }
+
+}
+
+.l_btn .borderimg {
+    width: 70px;
+    height: 30px;
+    font-size: 12px;
+    background: rgba(104, 173, 255, 0.3);
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+    /* border: 1px solid rgba(31, 107, 255, 1); */
+    border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+    font-weight: bold;
+    border-radius: 4px;
+    display: flex;
+    display: inline-block;
+    box-sizing: border-box;
+}
+
+.borderimg {
+    width: 109px;
+    height: 30px;
+    background: rgba(104, 173, 255, 0.3);
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+    /* border: 1px solid rgba(31, 107, 255, 1); */
+    -o-border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+    border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+    border-radius: 4px;
+    display: flex;
+    display: inline-block;
+    box-sizing: border-box
+}
+
+.el-table,
+.el-table thead th {
+    background-color: rgba(13, 22, 57, 0.96) !important;
+}
+
+.L_aside {
+    height: calc(100vh - 70px);
+    position: absolute;
+    top: 70px;
+    overflow: hidden;
+}
+
+.el-form-item__label {
+    color: #FFFFFF !important;
+}
+
+.jiancedian {
+    width: 380px;
+    position: absolute;
+    right: 0;
+    top: 70px;
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+    border-radius: 4px 4px 4px 4px;
+    border: 1px solid;
+    border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+}
+
+</style>

src/view/components/MenuPhysics.vue

@@ -0,0 +1,508 @@
+<template>
+    <div class="l_Dialog">
+        <el-dialog v-model="dialogVisible1" width="470" align-center :modal="false" :close-on-click-modal="false"
+            modal-class="summary-dlg ummary-wuli" draggable class="dialog_class bgcolor zhucentent">
+            <template #header="{ titleId, titleClass }">
+                <div class="my-header xinxi_header">
+                    <el-image :src="icon" fit="contain"></el-image>
+                    <h4 :id="titleId" :class="titleClass">物理属性</h4>
+
+                </div>
+            </template>
+            <div class="classtab">
+                <div class="asides_content">
+                    <div class="jc_content tablecolor jc_content">
+
+                        <div class="font12 my_content1">
+                            <div class="xian btncolor tablefocus bmar tianjia">
+
+                                <el-table :data="tableData" style="width:468px" :max-height="tableHeight"
+                                    :highlight-current-row="true" :row-class-name="tableRowClassName"
+                                    @row-click="handleDelete($event)"
+                                    :header-cell-style="{ 'background': 'rgba(13, 22, 57, 0.9) ' }">
+                                    <el-table-column prop="pid" label="名称" />
+                                    <el-table-column prop="type" label="密度" />
+                                    <el-table-column prop="seid" label="扩散系数" />
+                                    <el-table-column prop="site" label="比热" />
+                                </el-table>
+                            </div>
+                        </div>
+                        <div class="dialog-footer footer_div l_btn">
+                            <div class="footerbtn flex1">
+                                <div class="borderimg"><el-button @click="addsg();">添加</el-button></div>
+                            </div>
+                            <!-- <div class="footerbtn flex1"><div class="borderimg"><el-button  @click="addsg('2')">
+                              修改
+                                  </el-button></div></div> -->
+                            <div class="footerbtn flex1">
+                                <div class="borderimg"><el-button @click="shanchu(); dialogsgdelect = true">
+                                        删除
+                                    </el-button></div>
+                            </div>
+                            <div class="footerbtn flex1">
+                                <div class="borderimg"><el-button @click="amend()">
+                                        修改
+                                    </el-button></div>
+                            </div>
+                            <div class="footerbtn flex1">
+                                <div class="borderimg"><el-button @click="dialogVisible1 = false">
+                                        确认
+                                    </el-button></div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </el-dialog>
+        <!-- 添加 -->
+        <el-dialog v-model="addVisible" width="400" class="dialog_class bgcolor tianjia  foter_l tianjia">
+
+            <template #header="{ titleId, titleClass }">
+                <div class="my-header ">
+                    <el-image :src="icon" fit="contain"></el-image>
+                    <h4 :id="titleId" :class="titleClass">{{ add }}</h4>
+
+                </div>
+            </template>
+            <el-form class="demo-form-inline" :inline="true" :model="senobj">
+                <el-form-item label="编号" :label-width="formLabelWidth6">
+                    <el-input v-model="senobj.pid" class="w-50 m-2" placeholder="请输入" />
+                </el-form-item>
+                <el-form-item label="类型" :label-width="formLabelWidth6">
+                    <el-input v-model="senobj.type" class="w-50 m-2" placeholder="请输入" />
+                </el-form-item>
+                <el-form-item label="所在巷道" :label-width="formLabelWidth6">
+                    <el-input v-model="senobj.type" class="w-50 m-2" placeholder="请输入" />
+                </el-form-item>
+                <el-form-item label="位置" :label-width="formLabelWidth6">
+
+                    <el-input v-model="senobj.site" class="w-50 m-2" placeholder="请输入" />
+                </el-form-item>
+            </el-form>
+            <div class="dialog-footer footer_div l_btn">
+                <div class="footerbtn flex1">
+                    <div class="borderimg"><el-button @click="addVisible = false">取消</el-button></div>
+                </div>
+                <div class="footerbtn flex1">
+                    <div class="borderimg"><el-button @click="addEied(); addVisible = false">
+                            确定
+                        </el-button></div>
+                </div>
+            </div>
+        </el-dialog>
+
+        <!-- 删除 -->
+        <el-dialog v-model="dialogsgdelect" width="400" class="dialog_class bgcolor tianjia">
+
+            <template #header="{ titleId, titleClass }">
+                <div class="my-header ">
+                    <el-image :src="icon" fit="contain"></el-image>
+                    <h4 :id="titleId" :class="titleClass">删除框</h4>
+
+                </div>
+            </template>
+            <h4 class="delecttitle"> 是否确认删除 <span class="spanclad">编号{{ zqname }}</span></h4>
+            <div class="dialog-footer footer_div l_btn">
+                <div class="footerbtn flex1">
+                    <div class="borderimg"><el-button @click="dialogsgdelect = false">取消</el-button></div>
+                </div>
+                <div class="footerbtn flex1">
+                    <div class="borderimg"><el-button @click="fundeledata(); dialogsgdelect = false">
+                            确定
+                        </el-button></div>
+                </div>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+
+<script setup>
+import { computed, ref, onMounted, reactive, toRef } from "vue";
+import { request, uploadFile } from "@/utils/request";
+import { ElMessage, ElButton, ElDialog, ElSelect } from 'element-plus'
+import icon from "@/assets/img/icon.png";
+import { timestampToTime } from '@/js/lindex.js'
+let dialogVisible1 = ref(false);
+let addVisible = ref(false);
+let dialogsgdelect = ref(false)
+let classradio1 = ref('Fire');
+const formLabelWidth6 = ref(100);
+let add = ref("")
+const resultactiveName = ref("first");
+let tableHeight = ref(570);
+let tableData = ref([]);
+let tableobj = ref({});
+let zqname = ref();
+let senobj = ref({
+    pid: 0,
+    seid: 0,
+    site: 0,
+    type: "温度传感器"
+})
+const tableRowClassName = ({ row, rowIndex }) => {
+    if (rowIndex % 2 != 0) {
+        return 'evenRow';
+    }
+    return 'oddRow';
+
+}
+// 选中一行
+const handleDelete = (val) => {
+    tableobj.value = val;
+    console.log(tableobj.value)
+}
+// 删除
+const shanchu = () => {
+    zqname.value = tableobj.value.pid;
+}
+const fundeledata = () => {
+
+    console.log(zqname.value);
+    const params = {
+        transCode: 'D10012',
+        seid: tableobj.value.seid
+    }
+    request(params)
+        .then((res) => {
+            getsensor();
+        })
+        .catch((err) => {
+            ElMessage.error(err.returnMsg)
+        })
+}
+onMounted(() => {
+    getsensor();
+});
+// 查询
+const getsensor = () => {
+
+    const params = {
+        transCode: 'D10010',
+        type: 'Fire'
+    }
+    request(params)
+        .then((res) => {
+            tableData.value = res.rows;
+
+        })
+        .catch((err) => {
+            ElMessage.error(err.returnMsg)
+        })
+}
+//添加
+const addsg = () => {
+    add.value = "添加";
+    addVisible.value = true;
+    senobj.value.seid = '';
+    senobj.value.pid = '';
+
+}
+// 添加修改的接口
+const addEied = () => {
+    const params = {
+        transCode: 'D10011',
+        seid: senobj.value.site.seid,
+        pid: senobj.value.site.pid,
+        site: senobj.value.site,
+        type: senobj.value.type
+    }
+    request(params)
+        .then((res) => {
+            tableData.value = res.rows;
+            getsensor();
+        })
+        .catch((err) => {
+            ElMessage.error(err.returnMsg)
+        })
+}
+//修改
+const amend = () => {
+    add.value = "修改";
+
+    if (JSON.stringify(tableobj.value) == '{}') {
+        ElMessage.error("你还没有选中修改的项目")
+    } else {
+        senobj.value.seid = tableobj.value.seid
+        senobj.value.pid = tableobj.value.pid
+        senobj.value.site = tableobj.value.site
+        senobj.value.type = tableobj.value.type
+        addVisible.value = true;
+    }
+}
+defineExpose({ dialogVisible1, });
+</script>
+
+<style lang="scss" scoped>
+.jc_padding .el-table tr {
+    height: 30px !important;
+    background: rgba(104, 173, 255, 0.3);
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+    border-radius: 0px 0px 0px 0px;
+    border: 1px solid;
+    border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+}
+
+.flex_a {
+    flex: 1;
+    padding: 0 19px;
+}
+
+.btns {
+    width: 72px;
+    height: 30px;
+    background-image: url(../../assets/img/Rectangle399.png);
+    background-repeat: no-repeat;
+    line-height: 30px;
+    overflow: hidden;
+    margin: 10px 0;
+
+    .spantext {
+        font-weight: bold;
+        font-size: 12px;
+        color: #FFFFFF;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+    }
+}
+
+.header_z {
+    box-shadow: none !important;
+    padding: 10px 20px !important;
+}
+
+.header_l {
+    line-height: 10px;
+    // height: 40px;
+    text-align: left;
+    padding: 0 20px;
+    // border-bottom: 1px solid;
+    border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+    border-radius: 0px 0px 0px 0px;
+
+    .el-image {
+        padding: 10px 10px 0 0;
+    }
+
+    h4 {
+        font-weight: bold;
+        font-size: 12px;
+        color: #68ADFF;
+        line-height: 14px;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+    }
+
+}
+
+.jc_padding {
+    padding: 18px 10px;
+}
+
+.line {
+    border-bottom: 1px solid rgba(255, 255, 255, 0.20);
+    box-sizing: border-box;
+}
+
+.L_aside {
+    .iconimg {
+        width: 37px;
+        height: 36px;
+        margin: 0 7px 0 24px;
+    }
+}
+
+.ddd {
+    margin-top: 20px;
+
+    .ddd_div {
+        padding: 20px 0;
+        position: relative;
+    }
+
+    .class_btn {
+        position: absolute;
+        right: 0;
+        top: 21px;
+    }
+
+    .header_l {
+        line-height: 10px;
+        // height: 40px;
+        text-align: left;
+        padding: 0 20px;
+        // border-bottom: 1px solid;
+        border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+        box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+        border-radius: 0px 0px 0px 0px;
+
+        .el-image {
+            padding: 10px 10px 0 0;
+        }
+
+        h4 {
+            font-weight: bold;
+            font-size: 12px;
+            color: #68ADFF;
+            line-height: 14px;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+    }
+}
+
+.el-dialog__title {
+    display: inline-block;
+}
+
+.bgcolor {
+    // width: 482px;
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+    border-radius: 0px 0px 0px 0px;
+    border: 1px solid;
+    border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+}
+
+.dialog_class {
+    .my-header {
+        line-height: 10px;
+        height: 40px;
+        text-align: left;
+        padding: 0 20px;
+        border-bottom: 1px solid;
+        border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+        box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+        border-radius: 0px 0px 0px 0px;
+
+        .el-image {
+            padding: 10px 10px 0 0;
+        }
+
+        h4 {
+            font-weight: bold;
+            font-size: 12px;
+            color: #68ADFF;
+            line-height: 14px;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+    }
+
+    .my_content {
+        width: 100%;
+        height: 90px;
+        box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+        border-radius: 0px 0px 0px 0px;
+        position: relative;
+
+        .radio-group {
+            display: flex;
+            justify-content: center;
+
+            .el-radio {
+                flex: 1;
+                justify-content: center;
+                font-weight: bold;
+                font-size: 12px;
+                color: #FFFFFF;
+                line-height: 14px;
+
+            }
+
+        }
+    }
+
+    .el-dialog__footer {
+        position: absolute;
+        bottom: 17px;
+        display: flex;
+
+        .footerbtn {
+            flex: 1;
+            text-align: center;
+        }
+    }
+}
+
+.my_content1 {
+    .el-table .cell {
+        font-weight: 400;
+        font-size: 12px;
+        color: #FFFFFF !important;
+        line-height: 14px;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+    }
+
+}
+
+.l_btn .borderimg {
+    width: 70px;
+    height: 30px;
+    font-size: 12px;
+    background: rgba(104, 173, 255, 0.3);
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+    /* border: 1px solid rgba(31, 107, 255, 1); */
+    border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+    font-weight: bold;
+    border-radius: 4px;
+    display: flex;
+    display: inline-block;
+    box-sizing: border-box;
+}
+
+.borderimg {
+    width: 109px;
+    height: 30px;
+    background: rgba(104, 173, 255, 0.3);
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+    /* border: 1px solid rgba(31, 107, 255, 1); */
+    -o-border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+    border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+    border-radius: 4px;
+    display: flex;
+    display: inline-block;
+    box-sizing: border-box
+}
+
+.el-table,
+.el-table thead th {
+    background-color: rgba(13, 22, 57, 0.96) !important;
+}
+
+.L_aside {
+    height: calc(100vh - 70px);
+    position: absolute;
+    top: 70px;
+    overflow: hidden;
+}
+
+.el-form-item__label {
+    color: #FFFFFF !important;
+}
+
+.jiancedian {
+    width: 380px;
+    position: absolute;
+    right: 0;
+    top: 70px;
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+    border-radius: 4px 4px 4px 4px;
+    border: 1px solid;
+    border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+}
+</style>
+
+<style>
+.ummary-wuli .el-table .el-table__header tr th{
+    height:48px;
+    border: 1px solid;
+border-image: linear-gradient(237deg, rgba(16, 92, 240, 1), rgba(164, 195, 255, 1)) 1 1;
+}
+
+</style>

src/view/components/MenuSensor.vue

@@ -1,194 +1,349 @@
 <template>
     <div class="l_Dialog">
-      <el-dialog
-      v-model="sendialogVisible"
-      width="470"
-      align-center
-      :modal="false"
-      :close-on-click-modal="false"
-      draggable
-  class="dialog_class bgcolor zhucentent"
-  >
-  <template #header="{titleId, titleClass }">
-      <div class="my-header xinxi_header">
-          <el-image :src="icon" fit="contain" ></el-image>
-          <h4 :id="titleId" :class="titleClass">传感器信息</h4>
-      
-      </div>
-      </template>
-      <div class="classtab">
-          <div class="asides_content">
-                              <div class="jc_content tablecolor jc_content">
-
-                                  <div class="font12 my_content1">
-                                      <div class="xian btncolor tablefocus bmar">
-
-                                          <el-table :data="tableData" style="width:468px"
-                                             :max-height="tableHeight"
-                                              :highlight-current-row="true"
-                                               :row-class-name="tableRowClassName"
-                                               @row-click="handleDelete($event)"
-                                              :header-cell-style="{ 'background': 'rgba(13, 22, 57, 0.9) ' }">
-                                              <el-table-column type="index" width="50" />
-                                              <el-table-column prop="pid" label="编号" />
-                                              <el-table-column prop="stype" label="类型" />
-                                              <el-table-column prop="seid" label="所在巷道" />
-                                              <el-table-column prop="site" label="位置" />
-                                          </el-table>
-                                      </div>
-                                  </div>
-                                  <div class="dialog-footer footer_div l_btn">
-                                  <div class="footerbtn flex1"><div class="borderimg"><el-button @click="addsg();">添加</el-button></div></div>
-                                  <!-- <div class="footerbtn flex1"><div class="borderimg"><el-button  @click="addsg('2')">
+        <el-dialog v-model="sendialogVisible" width="470" align-center :modal="false" :close-on-click-modal="false"
+            modal-class="summary-dlg" draggable class="dialog_class bgcolor zhucentent">
+            <template #header="{ titleId, titleClass }">
+                <div class="my-header xinxi_header">
+                    <el-image :src="icon" fit="contain"></el-image>
+                    <h4 :id="titleId" :class="titleClass">传感器信息</h4>
+
+                </div>
+            </template>
+            <div class="classtab">
+                <div class="asides_content">
+                    <div class="jc_content tablecolor jc_content">
+
+                        <div class="font12 my_content1">
+                            <div class="xian btncolor tablefocus bmar tianjia">
+
+                                <el-table :data="tableData" style="width:468px" :max-height="tableHeight"
+                                    :highlight-current-row="true" :row-class-name="tableRowClassName"
+                                    @row-click="handleDelete($event)"
+                                    :header-cell-style="{ 'background': 'rgba(13, 22, 57, 0.9) ' }">
+                                    <el-table-column type="index" width="50" />
+                                    <el-table-column prop="pid" label="编号" />
+                                    <el-table-column prop="type" label="类型" />
+                                    <el-table-column prop="seid" label="所在巷道" />
+                                    <el-table-column prop="site" label="位置" />
+                                </el-table>
+                            </div>
+                        </div>
+                        <div class="dialog-footer footer_div l_btn">
+                            <div class="footerbtn flex1">
+                                <div class="borderimg"><el-button @click="addsg();">添加</el-button></div>
+                            </div>
+                            <!-- <div class="footerbtn flex1"><div class="borderimg"><el-button  @click="addsg('2')">
                               修改
                                   </el-button></div></div> -->
-                                  <div class="footerbtn flex1"><div class="borderimg"><el-button  @click="dialog.dialogsgdelect=true">
-                              删除
-                                  </el-button></div></div>
-                                  <div class="footerbtn flex1"><div class="borderimg"><el-button  @click="accident()">
-                             修改
-                                  </el-button></div></div>
-                              </div>
-                              </div>
-
-                          </div>
-       
-    </div>
-<!-- 添加 -->
-    <el-dialog v-model="addVisible" width="400"   class="dialog_class bgcolor tianjia  foter_l tianjia">
-          <template #header="{titleId, titleClass }">
-          <div class="my-header ">
-              <el-image :src="icon" fit="contain" ></el-image>
-              <h4 :id="titleId" :class="titleClass">{{add}}</h4>
-
-          </div>
-          </template>
-          <div>
-    <el-form>
-            <el-form-item label="时间" :label-width="formLabelWidth6">
-            <el-input  v-model="senobj.site" class="w-50 m-2"  placeholder="请输入"  />
-            </el-form-item>
-            <el-form-item label="突水量"  :label-width="formLabelWidth6">
-            <el-input  v-model="senobj.site" class="w-50 m-2"  placeholder="请输入"  />
-            </el-form-item>
-            <el-form-item label="所在巷道" :label-width="formLabelWidth6">
-            <el-input  v-model="senobj.site" class="w-50 m-2"  placeholder="请输入"  />
-            </el-form-item>
-            <el-form-item label="位置"  :label-width="formLabelWidth6">
-            <el-input  v-model="senobj.site" class="w-50 m-2"  placeholder="请输入"  />
-            </el-form-item>
+                            <div class="footerbtn flex1">
+                                <div class="borderimg"><el-button @click="shanchu(); dialogsgdelect = true">
+                                        删除
+                                    </el-button></div>
+                            </div>
+                            <div class="footerbtn flex1">
+                                <div class="borderimg"><el-button @click="amend()">
+                                        修改
+                                    </el-button></div>
+                            </div>
+                            <div class="footerbtn flex1">
+                                <div class="borderimg"><el-button @click="sendialogVisible = false">
+                                        确认
+                                    </el-button></div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </el-dialog>
+        <!-- 添加 -->
+        <el-dialog v-model="addVisible" width="400" class="dialog_class bgcolor tianjia  foter_l tianjia">
+
+            <template #header="{ titleId, titleClass }">
+                <div class="my-header ">
+                    <el-image :src="icon" fit="contain"></el-image>
+                    <h4 :id="titleId" :class="titleClass">{{ add }}</h4>
+
+                </div>
+            </template>
+            <el-form class="demo-form-inline" :inline="true" :model="senobj">
+                <el-form-item label="编号" :label-width="formLabelWidth6">
+                    <el-input v-model="senobj.pid" class="w-50 m-2" placeholder="请输入" />
+                </el-form-item>
+                <el-form-item label="类型" :label-width="formLabelWidth6">
+                    <el-input v-model="senobj.type" class="w-50 m-2" placeholder="请输入" />
+                </el-form-item>
+                <el-form-item label="所在巷道" :label-width="formLabelWidth6">
+                    <el-input v-model="senobj.type" class="w-50 m-2" placeholder="请输入" />
+                </el-form-item>
+                <el-form-item label="位置" :label-width="formLabelWidth6">
+
+                    <el-input v-model="senobj.site" class="w-50 m-2" placeholder="请输入" />
+                </el-form-item>
             </el-form>
-  </div>
-          <div class="dialog-footer footer_div l_btn">
-              <div class="footerbtn flex1"><div class="borderimg"><el-button @click="addVisible=false">取消</el-button></div></div>
-              <div class="footerbtn flex1"><div class="borderimg"><el-button  @click="addjiancf();addVisible=false">
-          确定
-              </el-button></div></div>
-          </div>
-      </el-dialog>
-  </el-dialog>
+            <div class="dialog-footer footer_div l_btn">
+                <div class="footerbtn flex1">
+                    <div class="borderimg"><el-button @click="addVisible = false">取消</el-button></div>
+                </div>
+                <div class="footerbtn flex1">
+                    <div class="borderimg"><el-button @click="addEied(); addVisible = false">
+                            确定
+                        </el-button></div>
+                </div>
+            </div>
+        </el-dialog>
+
+        <!-- 删除 -->
+        <el-dialog v-model="dialogsgdelect" width="400" class="dialog_class bgcolor tianjia">
+
+            <template #header="{ titleId, titleClass }">
+                <div class="my-header ">
+                    <el-image :src="icon" fit="contain"></el-image>
+                    <h4 :id="titleId" :class="titleClass">删除框</h4>
+
+                </div>
+            </template>
+            <h4 class="delecttitle"> 是否确认删除 <span class="spanclad">编号{{ zqname }}</span></h4>
+            <div class="dialog-footer footer_div l_btn">
+                <div class="footerbtn flex1">
+                    <div class="borderimg"><el-button @click="dialogsgdelect = false">取消</el-button></div>
+                </div>
+                <div class="footerbtn flex1">
+                    <div class="borderimg"><el-button @click="fundeledata(); dialogsgdelect = false">
+                            确定
+                        </el-button></div>
+                </div>
+            </div>
+        </el-dialog>
     </div>
 </template>
+
 <script setup>
-import { computed,ref,onMounted,reactive, toRef } from "vue";
+import { computed, ref, onMounted, reactive, toRef } from "vue";
 import { request, uploadFile } from "@/utils/request";
-import { ElMessage,ElButton, ElDialog,ElSelect } from 'element-plus'
+import { ElMessage, ElButton, ElDialog, ElSelect } from 'element-plus'
 import icon from "@/assets/img/icon.png";
-import {timestampToTime} from '@/js/lindex.js'
-let sendialogVisible=ref(false);
-let addVisible=ref(false);
-let classradio1= ref('Fire');
-const formLabelWidth6=ref(100);
-let add=ref("")
+import { timestampToTime } from '@/js/lindex.js'
+let sendialogVisible = ref(false);
+let addVisible = ref(false);
+let dialogsgdelect = ref(false)
+let classradio1 = ref('Fire');
+const formLabelWidth6 = ref(100);
+let add = ref("")
 const resultactiveName = ref("first");
-let tableHeight=ref(570);
-let tableData=ref([]);
-let senobj={
-    pid: 34,
-    seid: 2,
+let tableHeight = ref(570);
+let tableData = ref([]);
+let tableobj = ref({});
+let zqname = ref();
+let senobj = ref({
+    pid: 0,
+    seid: 0,
     site: 0,
     type: "温度传感器"
-}
-const tableRowClassName = ({row, rowIndex}) =>{
-    if (rowIndex%2 != 0) {
+})
+const tableRowClassName = ({ row, rowIndex }) => {
+    if (rowIndex % 2 != 0) {
         return 'evenRow';
     }
     return 'oddRow';
-  
+
+}
+// 选中一行
+const handleDelete = (val) => {
+    tableobj.value = val;
+    console.log(tableobj.value)
+}
+// 删除
+const shanchu = () => {
+    zqname.value = tableobj.value.pid;
+}
+const fundeledata = () => {
+
+    console.log(zqname.value);
+    const params = {
+        transCode: 'D10012',
+        seid: tableobj.value.seid
+    }
+    request(params)
+        .then((res) => {
+            getsensor();
+        })
+        .catch((err) => {
+            ElMessage.error(err.returnMsg)
+        })
 }
 onMounted(() => {
     getsensor();
-  });
+});
 // 查询
-const getsensor=()=>{
+const getsensor = () => {
 
-      const params = {
-          transCode: 'D10010',
-          type:'Fire'
-          }
-          request(params)
-            .then((res) => { 
-                tableData.value=res.rows;
+    const params = {
+        transCode: 'D10010',
+        type: 'Fire'
+    }
+    request(params)
+        .then((res) => {
+            tableData.value = res.rows;
 
-            })
-            .catch((err) => {
-              ElMessage.error(err.returnMsg)
-            })
+        })
+        .catch((err) => {
+            ElMessage.error(err.returnMsg)
+        })
 }
 //添加
-const addsg=()=>{
-    add.value="添加";
-    addVisible.value=true;
+const addsg = () => {
+    add.value = "添加";
+    addVisible.value = true;
+    senobj.value.seid = '';
+    senobj.value.pid = '';
+
+}
+// 添加修改的接口
+const addEied = () => {
+    const params = {
+        transCode: 'D10011',
+        seid: senobj.value.site.seid,
+        pid: senobj.value.site.pid,
+        site: senobj.value.site,
+        type: senobj.value.type
+    }
+    request(params)
+        .then((res) => {
+            tableData.value = res.rows;
+            getsensor();
+        })
+        .catch((err) => {
+            ElMessage.error(err.returnMsg)
+        })
+}
+//修改
+const amend = () => {
+    add.value = "修改";
+
+    if (JSON.stringify(tableobj.value) == '{}') {
+        ElMessage.error("你还没有选中修改的项目")
+    } else {
+        senobj.value.seid = tableobj.value.seid
+        senobj.value.pid = tableobj.value.pid
+        senobj.value.site = tableobj.value.site
+        senobj.value.type = tableobj.value.type
+        addVisible.value = true;
+    }
 }
-defineExpose({sendialogVisible,});
+defineExpose({ sendialogVisible, });
 </script>
-<style lang="scss" scoped> 
-.jc_padding .el-table tr{
+
+<style lang="scss" scoped>
+.jc_padding .el-table tr {
     height: 30px !important;
-    background: rgba(104,173,255,0.3);
-    box-shadow: inset 0px 0px 17px 5px rgba(12,97,197,0.2);
+    background: rgba(104, 173, 255, 0.3);
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
     border-radius: 0px 0px 0px 0px;
     border: 1px solid;
     border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
 }
-.flex_a{
-flex: 1;
-padding: 0 19px; 
-}
-.btns{
-width: 72px;
-height: 30px;
-background-image: url(../../assets/img/Rectangle399.png);
-background-repeat: no-repeat;
-line-height: 30px; 
-overflow: hidden;  
-margin: 10px 0;
-.spantext{
-font-weight: bold;
-font-size: 12px;
-color: #FFFFFF;
-text-align: left;
-font-style: normal;
-text-transform: none;
-}
-}
-.header_z{
-box-shadow:none !important;
-padding: 10px 20px !important;  
-}
-.header_l{
+
+.flex_a {
+    flex: 1;
+    padding: 0 19px;
+}
+
+.btns {
+    width: 72px;
+    height: 30px;
+    background-image: url(../../assets/img/Rectangle399.png);
+    background-repeat: no-repeat;
+    line-height: 30px;
+    overflow: hidden;
+    margin: 10px 0;
+
+    .spantext {
+        font-weight: bold;
+        font-size: 12px;
+        color: #FFFFFF;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+    }
+}
+
+.header_z {
+    box-shadow: none !important;
+    padding: 10px 20px !important;
+}
+
+.header_l {
+    line-height: 10px;
+    // height: 40px;
+    text-align: left;
+    padding: 0 20px;
+    // border-bottom: 1px solid;
+    border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+    border-radius: 0px 0px 0px 0px;
+
+    .el-image {
+        padding: 10px 10px 0 0;
+    }
+
+    h4 {
+        font-weight: bold;
+        font-size: 12px;
+        color: #68ADFF;
+        line-height: 14px;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+    }
+
+}
+
+.jc_padding {
+    padding: 18px 10px;
+}
+
+.line {
+    border-bottom: 1px solid rgba(255, 255, 255, 0.20);
+    box-sizing: border-box;
+}
+
+.L_aside {
+    .iconimg {
+        width: 37px;
+        height: 36px;
+        margin: 0 7px 0 24px;
+    }
+}
+
+.ddd {
+    margin-top: 20px;
+
+    .ddd_div {
+        padding: 20px 0;
+        position: relative;
+    }
+
+    .class_btn {
+        position: absolute;
+        right: 0;
+        top: 21px;
+    }
+
+    .header_l {
         line-height: 10px;
         // height: 40px;
         text-align: left;
         padding: 0 20px;
         // border-bottom: 1px solid;
         border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
-        box-shadow: inset 0px 0px 17px 5px rgba(12,97,197,0.2);
+        box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
         border-radius: 0px 0px 0px 0px;
-        .el-image{
+
+        .el-image {
             padding: 10px 10px 0 0;
         }
-        h4{
+
+        h4 {
             font-weight: bold;
             font-size: 12px;
             color: #68ADFF;
@@ -197,157 +352,116 @@ padding: 10px 20px !important;
             font-style: normal;
             text-transform: none;
         }
-    
     }
-.tianjia{
-display: inline-block;
 }
-.jc_padding{
-    padding: 18px 10px;
-}
-.line{
-border-bottom: 1px solid rgba(255, 255, 255, 0.20);  
-box-sizing: border-box;
-}
-.L_aside{
-.iconimg{
-    width: 37px;
-    height: 36px;
-    margin:0 7px 0 24px;
-}
-}
-.ddd{
-    margin-top: 20px;
-    .ddd_div{
-        padding: 20px 0;
-        position: relative;
-    }
-    .class_btn{
-        position: absolute;
-    right: 0;
-    top: 21px;
-    }
-    .header_l{
-            line-height: 10px;
-            // height: 40px;
-            text-align: left;
-            padding: 0 20px;
-            // border-bottom: 1px solid;
-            border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
-            box-shadow: inset 0px 0px 17px 5px rgba(12,97,197,0.2);
-            border-radius: 0px 0px 0px 0px;
-            .el-image{
-                padding: 10px 10px 0 0;
-            }
-            h4{
-                font-weight: bold;
-                font-size: 12px;
-                color: #68ADFF;
-                line-height: 14px;
-                text-align: left;
-                font-style: normal;
-                text-transform: none;
-            }
-        }
-}
-.tianjia{
+
+.el-dialog__title {
     display: inline-block;
 }
-.el-dialog__title{
-    display: inline-block;
-}  
-.bgcolor{
+
+.bgcolor {
     // width: 482px;
-    box-shadow: inset 0px 0px 17px 5px rgba(12,97,197,0.2);
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
     border-radius: 0px 0px 0px 0px;
     border: 1px solid;
     border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
 }
-.dialog_class{
-        .my-header{
-            line-height: 10px;
-            height: 40px;
-            text-align: left;
-            padding: 0 20px;
-            border-bottom: 1px solid;
-            border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
-            box-shadow: inset 0px 0px 17px 5px rgba(12,97,197,0.2);
-            border-radius: 0px 0px 0px 0px;
-            .el-image{
-                padding: 10px 10px 0 0;
-            }
-            h4{
-                font-weight: bold;
-                font-size: 12px;
-                color: #68ADFF;
-                line-height: 14px;
-                text-align: left;
-                font-style: normal;
-                text-transform: none;
-            }
+
+.dialog_class {
+    .my-header {
+        line-height: 10px;
+        height: 40px;
+        text-align: left;
+        padding: 0 20px;
+        border-bottom: 1px solid;
+        border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+        box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+        border-radius: 0px 0px 0px 0px;
+
+        .el-image {
+            padding: 10px 10px 0 0;
         }
-        .my_content{
-            width: 100%;
-            height: 90px;
-            box-shadow: inset 0px 0px 17px 5px rgba(12,97,197,0.2);
-            border-radius: 0px 0px 0px 0px;
-            position: relative;
-           
-            .radio-group{
-                display: flex;
-                justify-content: center;
-                .el-radio{
-                    flex: 1;
-                    justify-content: center;
-                    font-weight: bold;
-                        font-size: 12px;
-                        color: #FFFFFF;
-                        line-height: 14px;
-                  
-                }
-              
-            }
+
+        h4 {
+            font-weight: bold;
+            font-size: 12px;
+            color: #68ADFF;
+            line-height: 14px;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
         }
-        .el-dialog__footer{
-            position: absolute;
-            bottom: 17px;
+    }
+
+    .my_content {
+        width: 100%;
+        height: 90px;
+        box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+        border-radius: 0px 0px 0px 0px;
+        position: relative;
+
+        .radio-group {
             display: flex;
-            .footerbtn{
+            justify-content: center;
+
+            .el-radio {
                 flex: 1;
-                text-align: center;
+                justify-content: center;
+                font-weight: bold;
+                font-size: 12px;
+                color: #FFFFFF;
+                line-height: 14px;
+
             }
+
         }
     }
-    .my_content1{
-        .el-table .cell{
-            font-weight: 400;
-            font-size: 12px;
-            color: #FFFFFF !important;
-            line-height: 14px;
-            text-align: left;
-            font-style: normal;
-            text-transform: none;
+
+    .el-dialog__footer {
+        position: absolute;
+        bottom: 17px;
+        display: flex;
+
+        .footerbtn {
+            flex: 1;
+            text-align: center;
         }
+    }
+}
 
+.my_content1 {
+    .el-table .cell {
+        font-weight: 400;
+        font-size: 12px;
+        color: #FFFFFF !important;
+        line-height: 14px;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
     }
-    .l_btn .borderimg {
-    width: 109px;
-height: 30px;
-background: rgba(104,173,255,0.3);
-box-shadow: inset 0px 0px 17px 5px rgba(12,97,197,0.2);
-/* border: 1px solid rgba(31, 107, 255, 1); */
- border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1; 
-
-border-radius: 4px;
-display: flex;
-display: inline-block;
-box-sizing: border-box;
-}
-.borderimg{
+
+}
+
+.l_btn .borderimg {
+    width: 70px;
+    height: 30px;
+    font-size: 12px;
+    background: rgba(104, 173, 255, 0.3);
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+    /* border: 1px solid rgba(31, 107, 255, 1); */
+    border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
+    font-weight: bold;
+    border-radius: 4px;
+    display: flex;
+    display: inline-block;
+    box-sizing: border-box;
+}
+
+.borderimg {
     width: 109px;
     height: 30px;
-    background: rgba(104,173,255,0.3);
-    box-shadow: inset 0px 0px 17px 5px rgba(12,97,197,0.2);
+    background: rgba(104, 173, 255, 0.3);
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
     /* border: 1px solid rgba(31, 107, 255, 1); */
     -o-border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
     border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
@@ -356,107 +470,75 @@ box-sizing: border-box;
     display: inline-block;
     box-sizing: border-box
 }
-.el-table,.el-table thead th {
+
+.el-table,
+.el-table thead th {
     background-color: rgba(13, 22, 57, 0.96) !important;
 }
-.L_aside{
+
+.L_aside {
     height: calc(100vh - 70px);
     position: absolute;
     top: 70px;
     overflow: hidden;
 }
-.el-form-item__label{
+
+.el-form-item__label {
     color: #FFFFFF !important;
 }
 
-.jiancedian{
-    width:380px;
+.jiancedian {
+    width: 380px;
     position: absolute;
     right: 0;
     top: 70px;
- box-shadow: inset 0px 0px 17px 5px rgba(12,97,197,0.2);
-border-radius: 4px 4px 4px 4px;
-border: 1px solid;
-border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1; 
+    box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
+    border-radius: 4px 4px 4px 4px;
+    border: 1px solid;
+    border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
 }
 </style>
-<style>
-.el-collapse-item__header{
-  border: 1px solid;
--o-border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
-border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
-box-shadow: inset 0px 0px 17px 5px rgba(12,97,197,0.2);
-border-radius: 0px 0px 0px 0px;
-background-color: rgba(13, 22, 57, 0.4);
-}
-.xian{
-border: 1px solid;
--o-border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
-border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
-box-shadow: inset 0px 0px 17px 5px rgba(12,97,197,0.2);
-border-radius: 0px 0px 0px 0px;
-background-color: rgba(13, 22, 57, 0.4);
-}
-.header_l{
-position: relative;
-}
-.header_l .closeimg{
 
-position: absolute;
-top: 10px;
-right: 0;
+<style>
+.tianjia {
+    display: inline-block;
 
 }
-.leftbgimg1 .el-table tr{
-    height: 30px !important;
-    background: rgba(104,173,255,0.3);
-    box-shadow: inset 0px 0px 17px 5px rgba(12,97,197,0.2);
-    border-radius: 0px 0px 0px 0px;
-    border: 1px solid;
-    border-image: linear-gradient(180deg, rgba(31, 107, 255, 1), rgba(31, 107, 255, 0.48)) 1 1;
 
-
-}
-.btncolor .el-button{
-background-color: rgba(104,173,255,0);
-font-weight: 400;
-font-size: 12px;
-color: #FFF500;
-line-height: 14px;
-text-align: left;
-font-style: normal;
-text-transform: none;
-border: none;
+.btncolor .el-table__header {
+    margin: 0 !important;
 }
-.btncolor .el-button:focus, .el-button:hover{
-background-color: none;
-background-color: rgba(104,173,255,0);
-}
-.magintop{
-display: flex;
-}
-.magintop .el-form-item{
-margin-right: 20px;
-}
-.guand_1{
-display: flex;
+
+.tianjia .el-dialog__body {
+    padding: 20px !important;
 }
 
-.el-table .cell{
-color: #fff;
-font-size: 12px;
+.tianjia .el-form-item__label {
+    color: #fff;
 }
-.spanclad{
-color: #FFF500;
+
+.tianjia .el-input__inner {
+    color: #fff;
+    font-size: 14px;
+    font-weight: 400;
+    text-align: left;
+    padding: 20px 0;
+    height: 30px;
+    line-height: 47px;
 }
+
 .tablefocus .el-table__body tr.current-row>td.el-table__cell {
-background-color: rgba(255,255,25,0.5);
+    background-color: rgba(255, 255, 25, 0.5);
 }
-.bbb .el-collapse-item__content{
-background: rgba(13, 22, 57, 0);
+
+.delecttitle {
+    font-size: 22px;
+    font-weight: bold;
+    color: #fff;
 }
-.guand_1 .asdis_btn{
-margin-top: -9px;
+
+.spanclad {
+    color: #FFF500;
 }
 
-</style>
+</style>

src/view/configurator.vue

@@ -35,7 +35,7 @@
                     <el-menu-item index="3" >检测点信息</el-menu-item>
                     <el-menu-item index="4">物理属性</el-menu-item>
                 </el-menu>
-                <div class="ve_right">
+                <div class="ve_right" @click="clickreture()">
                     <div class="ve_timeioc">
                         <el-image
                             :src="Vector"
@@ -44,44 +44,71 @@
                         <span>返回主界面</span>
                     </div>
                 </div>
+      
         </div>
             </el-header>
          
             <el-main>
-             
-            <Menu-Mine></Menu-Mine>
-            <Menu-Sensor ref="menusen"></Menu-Sensor>
+            <MenuMine ref="menumine"/>
+            <MenuSensor ref="menusen"/>
+            <MenuCheck ref="menucheck"/>
+            <menuphysics2 ref="menuphysics"/>
             </el-main>
+         
         </el-container>
     </div>
   </template>
   
   <script setup>
 import { ref, onMounted, reactive,nextTick } from "vue";
-import {RouterView,RouterLink } from "vue-router"
+import {RouterView,RouterLink,useRouter,createRouter } from "vue-router"
+import MenuMine  from "./components/MenuMine.vue"
+import MenuSensor  from "./components/MenuSensor.vue"
+import MenuCheck  from "./components/MenuCheck.vue"
+import menuphysics2  from "./components/MenuPhysics.vue"
 import Vector from "@/assets/img/Vector.png";
 import icon from "@/assets/img/icon.png";
 import logo from "@/assets/logo.png";
-import MenuMine  from "./components/MenuMine.vue"
-import MenuSensor  from "./components/MenuSensor.vue"
+
 const title = "灾情推演软件";
-const activeIndex = ref('1')
+const activeIndex = ref('')
   onMounted(() => {
   });
+  let router=useRouter();
+  let menumine=ref();
 let menusen=ref();
-
+let menucheck =ref();
+let menuphysics=ref();
+const clickreture=()=>{
+ router.push("/");
+ // console.log(  router.push("/appmian",{ aid:"1"}));
+}
 const handleSelect = (key,keyPath) => {
     switch (key) {
     case '1':
+
+    menumine.value.dialogVisible=true;
+    menusen.value.sendialogVisible=false;
+    menucheck.value.sendialogVisible=false;
+    menuphysics.value.dialogVisible1=false;
         break;
     case '2':
+    menumine.value.dialogVisible=false;
     menusen.value.sendialogVisible=true;
+    menucheck.value.sendialogVisible=false;
+    menuphysics.value.dialogVisible1=false;
     break;
     case '3':
- 
+    menumine.value.dialogVisible=false;
+    menucheck.value.sendialogVisible=true;
+    menusen.value.sendialogVisible=false;
+    menuphysics.value.dialogVisible1=false;
         break;
      case '4':
- 
+     menumine.value.dialogVisible=false;
+    menucheck.value.sendialogVisible=false;
+    menusen.value.sendialogVisible=false;
+    menuphysics.value.dialogVisible1=true;
     default:
         break;
 }

src/vite-env.d.ts

@@ -1 +1,3 @@
 /// <reference types="vite/client" />
+declare module '@/view/configurator.vue';
+declare module './App.vue';