Ver código fonte

更新 header;首页布局

王智慧 3 anos atrás
pai
commit
85baf3566d
3 arquivos alterados com 26 adições e 25 exclusões
  1. 13 8
      src/layout/Header.vue
  2. 1 1
      src/styles/color.css
  3. 12 16
      src/views/index/Index.vue

+ 13 - 8
src/layout/Header.vue

@@ -3,13 +3,14 @@
     <div class="left">
       <img class="first" src="../assets/three.png" alt="" />
       <div class="shu"></div>
-      <img class="logo" src="../assets/white-logo.png" alt="" />
+      <div class="cf fs20">{{ shippingCompany }}</div>
+      <!-- <img class="logo" src="../assets/white-logo.png" alt="" />
       <div class="ml20" style="color: #fff; font-size: 18px">
         version:{{ timelineData[0]?.version }}
-      </div>
+      </div> -->
     </div>
     <div class="right">
-      <div
+      <!-- <div
         @click="dialogVisible = true"
         class="pointer"
         style="padding-top: 6px"
@@ -23,10 +24,10 @@
             <BellFilled />
           </el-icon>
         </el-badge>
-      </div>
+      </div> -->
       <img class="user-icon" src="../assets/user.png" alt="" />
-      <div class="user">{{ userName }}</div>
-      <el-popover placement="bottom" trigger="hover" :width="280">
+      <div class="user">{{ loginName }}</div>
+      <!-- <el-popover placement="bottom" trigger="hover" :width="280">
         <div
           style="
             width: 100%;
@@ -63,7 +64,7 @@
             <div class="log">新功能日志</div>
           </el-badge>
         </template>
-      </el-popover>
+      </el-popover> -->
       <div class="quit" @click="quit">[退出]</div>
     </div>
     <el-dialog v-model="dialogVisible" title="拍照通知" width="30%">
@@ -157,6 +158,8 @@ async function getUnphotographNotice() {
     isNewMessage.value = 0;
   }
 }
+let shippingCompany = ref("");
+let loginName = ref("");
 onMounted(() => {
   // getUnphotographNotice();
   // setInterval(async () => {
@@ -164,7 +167,9 @@ onMounted(() => {
   //     getUnphotographNotice();
   //   }
   // }, 2 * 60 * 1000);
-  cloudLogin();
+  // cloudLogin();
+  shippingCompany.value = localStorage.shippingCompany;
+  loginName.value = localStorage.loginName;
 });
 let timelineData = ref([]);
 async function cloudLogin() {

+ 1 - 1
src/styles/color.css

@@ -58,7 +58,7 @@
   color: #eee !important;
 }
 
-.white {
+.white,.cf {
   color: #fff !important;
 }
 

+ 12 - 16
src/views/index/Index.vue

@@ -1,19 +1,9 @@
 <template>
-  <div class="top-line df aic jcsb p10">
-    <div>
-      <div class="fs20 mb10">汇很多船务公司</div>
-      <div class="df aic">
-        <div class="mr10">{{ today }}</div>
-        <!-- <div>天气</div> -->
-      </div>
-    </div>
-    <div>
-      <div>所有船舶数量: {{ shipNum }} 艘</div>
-      <div>所有船舶吨位: {{ shipLoadTons }} 吨</div>
-    </div>
+  <div class="df">
+    <div id="map-container" class="map-container"></div>
+    <div class="info">info</div>
   </div>
-  <div id="map-container" class="map-container"></div>
-  <div v-if="ship.code" class="p20 bgf">
+  <div v-if="false" class="p20 bgf">
     <div id="voyage" class="container-title">船舶信息</div>
     <div style="max-width: 1200px">
       <div class="df aic jcsb pl20">
@@ -145,6 +135,7 @@ function initMap() {
     mapStyle: "amap://styles/f48d96805f5fa7f5aada657c5ee37017",
     zoomEnable: true,
     dragEnable: true,
+    scrollWheel: false,
   });
   let toolBar = new AMap.ToolBar({
     position: {
@@ -256,8 +247,13 @@ onMounted(() => {
 </script>
 <style scoped>
 .map-container {
-  width: 100%;
-  height: calc(100% - 81px);
+  width: calc(100vw - 440px);
+  height: calc(100vh - 60px);
+}
+
+.info {
+  width: 220px;
+  background: #fff;
 }
 
 .unit {