11.26 3.0版本

src/components/header.vue

@@ -3,9 +3,9 @@
         <div class="d-flex jc-center title_wrap">
             <div class="timers">
             <div class="logimg">
-              <div class="ve_logo_img">
+              <!-- <div class="ve_logo_img">
               <el-image style="height: 100%" :src="logo" fit="contain"></el-image>
-            </div>
+            </div> -->
             <span>{{headername }}</span></div>
             <div class="headertime">
               <p class="datayear">{{  headertime.dateYear }}</p>
@@ -13,19 +13,19 @@
             </div>
           </div>
           <div class="titlebtn titleanniu imgtupian" :class="{headeractive: headeractive === '1'}"   @click="handleSelect('1')">突水推演</div>
-            <div class="titlebtn titleanniu imgtupian"  style="margin-right: 20px;" :class="{headeractive: headeractive === '2'}" @click="handleSelect('2')">火灾推演</div>
+            <div class="titlebtn titleanniu imgtupian"  :class="{headeractive: headeractive === '2'}" @click="handleSelect('2')">火灾推演</div>
           <div class="d-flex jc-center s-content">
             <div class="title tiletimg">
-            <!-- <div class="ve_logo_img">
+            <div class="ve_logo_img">
               <el-image style="height: 100%" :src="logo" fit="contain"></el-image>
-            </div> -->
+            </div>
             <!-- <span class="title-text">煤矿多种态势推演可视化和智慧应急与救援模型定制开发系统</span> -->
               <!-- <span class="title-text">煤矿典型灾害态势推演</span> -->
               <span class="title-text">煤矿多种态势推演</span>
             </div>
           </div>
           
-          <div class="titlebtn titleanniu imgtupian2" :class="{headeractive2: headeractive === '3'}"  @click="handleSelect('3')" >瓦斯爆炸推演</div>
+          <div class="titlebtn titleanniu imgtupian2" style="margin-left: 0px;" :class="{headeractive2: headeractive === '3'}"  @click="handleSelect('3')" >瓦斯爆炸推演</div>
             <div class="titlebtn titleanniu imgtupian2" :class="{headeractive2: headeractive === '4'}"   @click="handleSelect('4')"  >模型库</div>
         </div>
       </div>

src/style/style.css

@@ -18,10 +18,10 @@ body,html{
     background-repeat: no-repeat;
     background-position: center;
     background-size: 100% 100%;
-    z-index: 207;
-    width: .1042rem;
-    top: 19%;
-    height: 3.11rem;
+    z-index: 333;
+    width: 0.13042rem;
+    top: 17.5%;
+    height:506px;
     left: 0;
   }
   .reghtzs{
@@ -30,10 +30,10 @@ body,html{
     background-repeat: no-repeat;
     background-position: center;
     background-size: 100% 100%;
-    z-index: 207;
-    width: .1042rem;
-    top: 19%;
-    height: 3.11rem;
+    z-index: 333;
+    width: 0.13042rem;
+    top: 17.5%;
+    height:506px;
     right: 0;
   }
   .line {
@@ -329,34 +329,25 @@ color: #fff;
     text-transform: none;
   }
   
-  .l_btn .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;
+    /* border-radius: 4px;
     display: flex;
     display: inline-block;
-    box-sizing: border-box;
-}
+    box-sizing: border-box; */
+} 
 
 .borderimg {
-    width: 109px;
+    /* 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
-}
+    box-sizing: border-box */
+} 
   
   .el-table,
   .el-table thead th {
@@ -383,6 +374,7 @@ color: #fff;
     background-repeat: no-repeat;
     line-height: 30px;
     background-size: 100% 100%;
+    border: 1px solid #1A8CFE;
   }
   .asdis_btn .btn .spantext {
     font-weight: bold;
@@ -465,7 +457,7 @@ color: #fff;
   .jiancedian1 {
     width: 1.7031rem;
     position: fixed;
-    right: 0;
+    right: 25px;
     top: 70px;
     box-shadow: inset 0px 0px 17px 5px rgba(12, 97, 197, 0.2);
     border-radius: 4px 4px 4px 4px;
@@ -974,9 +966,10 @@ border-image: linear-gradient(90deg, rgba(91, 175, 222, 0), rgba(91, 175, 222, 1
     background-image: url(../assets/img/Rectangle399.png);
     background-repeat: no-repeat;
     background-size: cover;
-    line-height: 21px;
+    line-height: 20px;
     overflow: hidden;
     text-align: center;
+    border: 1px solid #1A8CFE;
 
   }
   .tabactive{
@@ -1227,7 +1220,7 @@ ol {
     border: none !important;
 }
 
-.l_btn .borderimg {
+/* .l_btn .borderimg {
   border-radius: 4px;
   display: flex;
   display: inline-block;
@@ -1241,7 +1234,7 @@ ol {
   background-image: url(../assets/img/Rectangle3991.png);
   background-position: bottom;
   background-repeat: no-repeat;
-}
+} */
 .classtab .jc_padding .el-table {
   height: 30px !important;
 
@@ -1254,6 +1247,7 @@ position: absolute;
   background-image: url(../../src/assets/img/BJ.png)!important;
   background-size:cover;
   background-repeat: no-repeat;
+  z-index: 208;
 }
 .footer,.appmian .el-main{
   /* background:#B5C7F0 ; */
@@ -1266,10 +1260,10 @@ position: absolute;
   background-position: bottom;
   background-repeat: no-repeat;
   /* background-size: cover; */
-  margin-bottom: 15px;
-  position: relative;
   /* background: radial-gradient(#1C253D 100%); */
-
+  position: absolute;
+  width: 100%;
+  bottom: 0;
   z-index: 33333;
 }
 
@@ -1283,20 +1277,26 @@ justify-content: space-between;
 
 }
 .leftline{
-  width: 413px;
-  height: 15px;
+  width: 160px;
+  height: 260px;
   position: absolute;
-  left: 10px;
   background-image: url(/src/assets/img/Line29.png);
-  bottom: -13px;
+  background-size: 100% 100%;
+  background-repeat: no-repeat;
+  z-index: 207;
+  bottom: 0;
+  left: 0;
 }
 .rightline{
-  width: 413px;
-  height: 15px;
+  width: 160px;
+  height: 260px;
   position: absolute;
-  right: 13px;
-  bottom: -13px;
-    background-image: url(/src/assets/img/Line30.png);
+  background-image: url(/src/assets/img/Line30.png);
+  background-size: 100% 100%;
+  background-repeat: no-repeat;
+  z-index: 207;
+  bottom: 0;
+  right:0;
 }
 
 .footet-bottom ul li{
@@ -1304,7 +1304,7 @@ justify-content: space-between;
 width: 130px;
 height: 32px;
 text-align: center;
-line-height: 32px;
+line-height: 27px;
 font-weight: 400;
 font-size: 0.0833rem;
 color: #58BBEC;
@@ -1322,7 +1322,7 @@ z-index: 1;
   /* // background: linear-gradient(to bottom, rgba(11,51,142,1) 15%, rgba(17,56,143 ,1) 40%,rgba(11,51,142,1)) !important;   */
    /* background:rgba(0,224,225 ,1)!important; */
  /* background: linear-gradient(to bottom, rgba(11,51,142,0.1) 15%, rgba(17,56,143 ,0.2) 40%,rgba(0,224,225 ,1)) !important;  */
- background-image:url("/src/assets/img/Rectangle4562.png") !important;
+ background-image:url("/src/assets/img/Groupbtn.png") !important;
    background-size: 100% 100%;
    color: #fff !important;
    /* color: transparent;
@@ -1388,6 +1388,10 @@ z-index: 1;
    color:#fff;
    line-height:53px;
    white-space: nowrap;
+   background-image: linear-gradient(to top, #41c0ff, #d3f0ff, #ffffff);
+   -webkit-background-clip: text;
+   -webkit-text-fill-color: transparent;
+   /* text-shadow:#0075ff 0 0 2px ; */
 
 }
 .title_wrap{
@@ -1417,17 +1421,19 @@ z-index: 1;
     right:40px;
     top:16px;
     font-size: .0729rem;
-    display: flex;
-    align-items: center;
+    /* display: flex;
+    align-items: center; */
 }
 .ve_logo_img{
-  margin-right: 10px;
-  width: 36px;
+  margin-top: -8px;
+  margin-right: 5px;
+  width: 34px
 
 }
 .s-content{
   /* //width: 2.0875rem; */
 width: 3.6875rem; 
+height:60px;
   background-image: url(/src/assets/img/Group36.png);
   background-size: 100% 100%;
   background-position: center;
@@ -1440,10 +1446,10 @@ width: 3.6875rem;
   justify-content: center;
   padding: 0px 22px;
   width: 2.6875rem; 
-  background-image: url(/src/assets/img/Group16.png);
+  /* background-image: url(/src/assets/img/Group16.png);
   background-size: 100% 113%;
   background-position: top;
-  background-repeat: no-repeat;
+  background-repeat: no-repeat; */
 }
 .titleanniu{
   background-size: cover;
@@ -1455,19 +1461,27 @@ width: 3.6875rem;
 }
 .bgk1 .imgtupian{
   width: 0.7094rem;
-
   background-image: url(/src/assets/img/Rectangle456.png);
+  background-size: 100% 100% !important;
+  height: 30px;
+  line-height: 30px;
 }
 .bgk1 .imgtupian2{
   width: .9823rem;
   /* background-image: url(/src/assets/img/Rectangle1456.png); */
   background-image: url(/src/assets/img/Rectangle456.png);
+  background-size: 100% 100% !important;
+  height: 30px;
+  line-height: 30px;
+}
+.headeractive {
+   background-image: url(/src/assets/img/Rectangle4562.png) !important; 
+  background-size: 100% 100% !important; 
 }
-
 .titlebtn{
   margin-left: 20px;
 font-size: .0833rem;
-  margin-top:20px;
+  margin-top:18px;
   line-height: 0.13578rem;
   font-weight: bold;
 }
@@ -1493,11 +1507,11 @@ font-size: .0833rem;
   /* background-image: url(../assets/img/rlheader.png);
   background-size: cover;
   background-position:center; */
-  background-color: #142541;
+  background-color: #051531;
   position: relative;
 }
 .bgk2 ul li{
-  width: 25%;
+  width: 30%;
   text-align: center;
   position: absolute;
 }
@@ -1654,7 +1668,7 @@ font-size: .0833rem;
 }
 
 .bganimation .el-collapse-item__content {
-  background: rgba(13, 53, 133, 0.5);
+  background: rgba(13, 53, 133, 0.5); 
 }
 .bganimation  .el-slider__bar{
   background-image: linear-gradient(to right, #ACD6FF , #105CF0 );
@@ -1785,11 +1799,32 @@ font-size: .0677rem;
   font-size: .0781rem;
 
 }
+.bgk4{
+  height: 52px;
+  background-image: url(/src/assets/img/Line28.png)!important;
+  background-size: 100% 100%;
+  background-repeat: no-repeat;
+  z-index: 325;
+  position: absolute;
+  width: 100%;
+  bottom: 0;
+}
 .bgk3{
-  height: calc(100vh);
-  background: radial-gradient(closest-side, #0B338B , #142541);
+  /* height: calc(100vh);
+/* background: radial-gradient(closest-side, #0B338B , #142541); */
   /* //background:#142541; */
-  z-index: 330;
+  /* background-image: url(../../src/assets/img/daBJ.png)!important;
+  background-size: 100% 101%;
+  background-repeat: no-repeat;
+  z-index: 330; */
+  height: calc(100vh);
+    /* background: radial-gradient(closest-side, #0B338B , #142541); */
+    background-image: url(../../src/assets/img/daBJ.png)!important;
+    background-size: 100% 100%;
+    background-repeat: no-repeat;
+    z-index: 207;
+    position: absolute;
+    width: 100%;
 }
 
 .el-header{
@@ -1800,16 +1835,19 @@ font-size: .0677rem;
  .bgk2 {
   max-width: 1430px;
   /* margin: 0 auto; */
-  background-image: url(/src/assets/img/Group1317.png);
-  background-size: 100% 100%;
-  background-position: center;
-  /* position: relative;
-  margin-bottom: 4px;
-  height: calc(100vh - 64px);
-  border-radius: 0px 0px 0px 0px; */
+
+  height: 712px;
+  /* margin: 134px 0 0px 0; */
   margin: 0 auto;
+  margin-top: 131px;
+}
+.bjgg{
+  width: 100%;
+  height: 712px;
+  /* background-image: url(/src/assets/img/Group1317.png); */
+  background-size: 100% 103%;
+  background-position: center;
 }
-
 .is-vertical{
   height: 100vh;
   overflow: hidden;

src/view/appmian.vue

@@ -7,11 +7,11 @@
       <reheader ref="reheaderref" @handleSelect="handleSelect" :name="headerobj.name"/>
     </el-header>
       <el-main>
-          <div class="reghtzs"> </div>
+      <div class="reghtzs"> </div>
+     <div class="leftzs"> </div>
    <div  class="maincontent">
 
       <div class="mainpdding">
-        <div class="leftzs"> </div>
         <source-disaster ref="sourcedis" :classradio="classradio"  />
         <info-boundary ref="boundary" :classradio="classradio" />
         <info-animation ref="tanimation" :classradio="classradio" :aid="aid" />
@@ -49,8 +49,10 @@
      
       </el-main>
       <div class=" bgk3" v-show="bgk2false">
-      <div class="bgk2 bgk3">
-          <div>
+        <div class="bgk4"></div>
+      <div class="bgk2">
+          <div class="bjgg">
+            <el-image :src="dtu" fit="contain"></el-image>
             <ul>
               <li class="s1"  :class="activeIndeximg=='2'?'activeimg':''"  @click="handleSelect('2')" >
                 <el-image :src="s1" fit="contain"></el-image>
@@ -75,9 +77,14 @@
       <div class="bkxolo" v-show="bkmodel">
       <result ref="resultbidui" @titleclick="titleclick"  :classradio="classradio" ></result></div>
        <!-- 底部按钮三个页面 -->
-  <div class="footer">
+       
+       <div class="leftline"></div>
+        <div class="rightline"></div>
+  <div class="footer" >
+
     <Index ref="indexref" @indexchange="indexchange" @vtkshowfuc="vtkshowfuc" @hiadden="hiadden" :state='state' :classradio="classradio" :aid="aid"/>
   </div>
+
     </el-container>
   <!-- </v-scale-screen> -->
   </div>
@@ -104,6 +111,7 @@ import reheader  from "@/components/header.vue"
 import result from "./result.vue";
 import Vector from "@/assets/img/Vector.png";
 import s1 from "@/assets/img/s1.png";
+import dtu from "@/assets/img/Group1317.png";
 import s2 from "@/assets/img/s2.png";
 import s3 from "@/assets/img/s3.png";
 import s4 from "@/assets/img/s4.png";

src/view/components/InfoAnimation.vue

@@ -1339,7 +1339,7 @@ defineExpose({ monitor, accident5 });
 }
 
 .el-collapse-item__content {
-  background: rgba(13, 22, 57, 0.2);
+  /* background: rgba(13, 22, 57, 0.2); */
 }
 
 .asideg .el-input__wrapper {

src/view/components/InfoDisaster.vue

@@ -18,7 +18,7 @@
                       <el-table
                         :data="tableDatay"
                         @row-click="handleDelete($event)"
-                        :header-cell-style="{ background: 'rgba(13, 22, 57, 0.96) ' }"
+                        :header-cell-style="{ background: 'rgba(13, 22, 57, 0)' }"
                       :highlight-current-row="currentrow" 
                         style="width: 100%"
                         :max-height="tableHeight"
@@ -272,7 +272,7 @@
                         :data="tableDataws"
                         style="width: 100%"
                         :row-class-name="tableRowClassName"
-                        :header-cell-style="{ background: 'rgba(13, 22, 57, 0.96) ' }"
+                        :header-cell-style="{ background: 'rgba(13, 22, 57, 0) ' }"
                         @row-click="handlews($event)"
                         max-height="350px"
                         :highlight-current-row="currentrow" 
@@ -332,7 +332,7 @@
                         style="width:100%"
                         :max-height="tableHeight"
                         :row-class-name="tableRowClassName"
-                        :header-cell-style="{ background: 'rgba(13, 22, 57, 0.96) ' }"
+                        :header-cell-style="{ background: 'rgba(13, 22, 57, 0) ' }"
                         @row-click="handleblastxg($event)"
                         :highlight-current-row="currentrow1" 
                       >
@@ -384,7 +384,7 @@
                         style="width: 100%"
                         :max-height="tableHeight"
                         :row-class-name="tableRowClassName"
-                        :header-cell-style="{ background: 'rgba(13, 22, 57, 0.96) ' }"
+                        :header-cell-style="{ background: 'rgba(13, 22, 57, 0) ' }"
                         @row-click="handlegather($event)"
                         :highlight-current-row="currentrow2" 
                       >
@@ -771,7 +771,7 @@
           :data="tableData2"
           style="width: 100%"
           @select="projectsSelectionSelect"
-          :header-cell-style="{ background: 'rgba(13, 22, 57, 0.96) ' }"
+          :header-cell-style="{ background: 'rgba(13, 22, 57, 0) ' }"
         >
           <el-table-column type="selection" width="55" />
           <el-table-column property="snId" label="开始节点" />

src/view/home.vue

@@ -11,7 +11,7 @@
             {{  headertime.dateYear }} {{  headertime.dateWeek }} {{  headertime.dateDay }}
           </div>
           <div class="titlebtn titleanniu imgtupian" @click="handleSelect('1')">突水推演</div>
-            <div class="titlebtn titleanniu imgtupian" style="margin-right: 20px;" @click="handleSelect('2')">火灾推演</div>
+            <div class="titlebtn titleanniu imgtupian"  @click="handleSelect('2')">火灾推演</div>
           <div class="d-flex jc-center s-content">
             <div class="title tiletimg">
             <!-- <div class="ve_logo_img">
@@ -22,7 +22,7 @@
             </div>
           </div>
           
-          <div class="titlebtn titleanniu imgtupian2" @click="handleSelect('3')" >瓦斯爆炸推演</div>
+          <div class="titlebtn titleanniu imgtupian2" style="margin-left: 0px;" @click="handleSelect('3')" >瓦斯爆炸推演</div>
             <div class="titlebtn titleanniu imgtupian2" @click="handleSelect('4')"  >模型库</div>
         </div>
       </div>

src/view/index/index.vue

@@ -1,9 +1,6 @@
 <template>
     <!-- 底部导航栏 -->
     <div class="footet-bottom"> 
-    
-        <div class="leftline"></div>
-        <div class="rightline"></div>
         <ul v-show="btnlistshow">
           <li class="fontcolor  "  v-for="(item, index) in listArray" :key="index" :class="{btnactive: index === currentIndex}"  @click="changeColor(index)">{{item.name}}</li> 
             <!-- <li class="fontcolor  "  v-for="(item, index) in listArray" :key="index" :class="{btnactive: index === currentIndex}"  @click="changeColor(index)"> <el-image :src="item.img" fit="contain"></el-image>{{item.name}}</li> -->