header样式调整

public/static/config/config.js

@@ -17,7 +17,9 @@ var userLoginConfig = {
 var oauthUrl = "http://121.43.55.7:10086"
 
 // 系统配置（LiuMengxiang）
-var systemConfig = {
+const systemConfig = {
+    // 系统名称
+    systemName: "徐泾镇产业资源全生命周期管理平台",
     // 底图地址集合（Map.vue>creatMap()）
     // imageryProviders: ["http://t0.tianditu.com/img_w/wmts", "http://t0.tianditu.com/cia_w/wmts"],
     imageryProviders: ["http://t0.tianditu.com/img_w/wmts"],

src/components/Header.vue

@@ -7,7 +7,7 @@
     </div>
     <!-- title -->
     <div class="title_bg">
-      <div class="title_bg_title">徐泾镇产业资源全生命周期管理平台</div>
+      <div class="title_bg_title">{{ systemName }}</div>
     </div>
     <!-- 天气 -->
     <div class="weather">天气</div>
@@ -16,18 +16,22 @@
 
 <script>
 import axios from "axios";
-// import moment from "moment";
 export default {
   data() {
     return {
       currentTime: "",
       setInterval_: "",
       date: "",
+      systemName: "",
     };
   },
   created() {
     this.currentTime = this.$dayjs().format("HH:mm:ss");
     this.date = this.$dayjs().format("YYYY.MM.DD");
+    if (systemConfig) {
+      document.title = systemConfig.systemName;
+      this.systemName = systemConfig.systemName;
+    }
   },
   mounted() {
     // 时间定时器
@@ -102,6 +106,7 @@ export default {
   display: flex;
   flex-wrap: nowrap;
   flex-direction: row;
+  pointer-events: none;
 }
 .clock {
   display: flex;

src/components/cards/CardTitle.vue

@@ -29,9 +29,9 @@ export default {
   position: relative;
   height: 50px;
   border-left: 3px solid #1b7ef2;
-  background-image: --webkit-linear-gradient(to right, #1b7ef232, #1b7ef200);
-  background-image: --moz-linear-gradient(to right, #1b7ef232, #1b7ef200);
-  background-image: linear-gradient(to right, #1b7ef232, #1b7ef200);
+  background-image: --webkit-linear-gradient(to right, #1b7ef264, #1b7ef200);
+  background-image: --moz-linear-gradient(to right, #1b7ef264, #1b7ef200);
+  background-image: linear-gradient(to right, #1b7ef264, #1b7ef200);
   display: flex;
   align-content: center;
   align-items: center;
@@ -40,10 +40,22 @@ export default {
   line-height: 16px;
   &_f {
     margin: 0 10px;
-    width: 14px;
-    height: 12px;
+    width: 10px;
+    height: 14px;
     clip-path: polygon(0 0, 100% 50%, 0 100%, 0 0);
     background: #29f1fa;
   }
+  &::before {
+    position: absolute;
+    content: "";
+    width: 100%;
+    height: 40px;
+    top: 5px;
+    left: 0;
+    background: linear-gradient(to right, #ffffff64 50%, #00000000 0);
+    background-size: 40px 100%;
+    transform: skew(30deg, 0);
+    z-index: -1;
+  }
 }
 </style>

src/main.js

@@ -9,7 +9,6 @@ import "./assets/font/font.css";
 import "./assets/global.css";
 // 引入dayjs库
 import dayjs from "dayjs";
-
 const app = createApp(App).use(store).use(router);
 app.config.globalProperties.$dayjs = dayjs;
 app.mount('#app');

src/router/index.js

@@ -5,7 +5,10 @@ const routes = [
   {
     path: '/',
     name: 'home',
-    component: HomeView
+    component: HomeView,
+    meta: {
+      title: systemConfig.systemName,
+    }
   },
 ]
 

src/views/HomeView.vue

@@ -2,8 +2,8 @@
   <div class="home">
     <Header />
     <Map />
-    <div class="home_MainBox">
-      <CardTitle title="空间资源运营概览" />
+    <div class="home_LeftMainBox">
+      <!-- <CardTitle title="空间资源运营概览" /> -->
     </div>
   </div>
 </template>
@@ -28,15 +28,16 @@ export default {
   width: 100%;
   height: 100%;
   overflow: hidden;
-  &_MainBox {
+  &_LeftMainBox {
     position: fixed;
     z-index: 9999;
     top: 65px;
     left: 0;
     width: 500px;
     height: calc(100vh - 65px);
-    background: #ffffff32;
+    // background: #ffffff32;
     overflow: hidden;
+    // pointer-events: none;
   }
 }
 </style>