Procházet zdrojové kódy

主页顶栏去除无用按钮 修改样式

344080Wuyunfeng před 2 roky
rodič
revize
66b151afb1

binární
src/assets/images/Android.png


binární
src/assets/images/chongqing-icon.png


+ 20 - 7
src/layout/components/Header/QRcodePopover.vue

@@ -19,15 +19,18 @@
       </div>
     </template>
     <div class="QR-body">
-      <div>安全管控平台</div>
-      <img src="~@/assets/images/QRcodeExample.png" />
+      <div class="QR-text">安全管控平台</div>
+      <div style="display: flex; flex-direction: row; align-items: center">
+        <img src="@/assets/images/Android.png" style="width: 16px; height: 19px" />
+        <div class="QR-text" style="font-size: 14px; padding-left: 5px">Android客户端</div>
+      </div>
+      <img src="@/assets/images/QRcodeExample.png" style="width: 140px" />
       <el-button
-        class="w-full"
-        style="background-color: rgb(24, 144, 255); border: none"
+        style="width: 102px; background-color: rgb(24, 144, 255); border: none"
         type="primary"
         round
-        >保存到相册</el-button
-      >
+        >保存到相册
+      </el-button>
     </div>
   </el-popover>
 </template>
@@ -36,7 +39,7 @@
   // import { Download } from '@element-plus/icons-vue';
 </script>
 
-<style scoped>
+<style scoped lang="scss">
   .QR-btn {
     display: flex;
     align-items: center;
@@ -45,8 +48,18 @@
   .QR-body {
     display: flex;
     flex-direction: column;
+    align-items: center;
     justify-content: space-around;
     height: 100%;
     padding: 20px;
+
+    .QR-text {
+      font-weight: 600;
+      font-size: 20px;
+      color: #1890ff;
+      line-height: 28px;
+      text-align: center;
+      font-style: normal;
+    }
   }
 </style>

+ 45 - 31
src/layout/components/Header/index.vue

@@ -100,7 +100,7 @@
       />
     </div>
     <div class="layout-header-right">
-      <div
+      <!-- <div
         v-for="item in iconList"
         :key="item.icon.name"
         v-on="item.eventObject || {}"
@@ -111,17 +111,18 @@
             <component :is="item.icon" />
           </el-icon>
         </el-tooltip>
-      </div>
+      </div> -->
       <!-- 个人中心 -->
       <div class="layout-header-trigger layout-header-trigger-min">
         <el-dropdown trigger="hover" @command="avatarSelect">
           <div class="flex items-center">
-            <h4 class="username">{{ getUsername }}</h4>
-            <el-divider direction="vertical" />
-            <h4 class="mr-1 username">{{ getTenantName }}</h4>
-            <div class="avatar">
+            <!-- <div class="avatar">
               <el-avatar round :src="schoolboy" />
-            </div>
+            </div> -->
+            <img src="@/assets/images/chongqing-icon.png" />
+            <h4 class="username">{{ getUsername }}</h4>
+            <!-- <el-divider direction="vertical" /> -->
+            <!-- <h4 class="mr-1 username">{{ getTenantName }}</h4> -->
           </div>
           <template #dropdown>
             <el-dropdown-menu>
@@ -147,7 +148,9 @@
       </div>
       <!-- 安全管控平台 -->
       <div class="layout-header-trigger layout-header-trigger-min">
-        <a href="/skyeye-world" target="_blank">安全管控平台</a>
+        <el-button style="background-color: #e6f7ff; border: none" type="primary">
+          <a href="/skyeye-world" target="_blank">返回平台</a>
+        </el-button>
       </div>
       <!--切换全屏-->
       <!-- <div class="layout-header-trigger layout-header-trigger-min">
@@ -378,29 +381,29 @@
   };
 
   // 图标列表
-  const iconList = [
-    // {
-    //   icon: SearchOutlined,
-    //   tips: '搜索',
-    //   eventObject: {
-    //     click: () => openAppSearch(),
-    //   },
-    // },
-    // {
-    //   icon: GithubOutlined,
-    //   tips: 'github',
-    //   eventObject: {
-    //     click: () => window.open('https://github.com/jekip/naive-ui-admin'),
-    //   },
-    // },
-    // {
-    //   icon: LockOutlined,
-    //   tips: '锁屏',
-    //   eventObject: {
-    //     click: () => useLockscreen.setLock(true),
-    //   },
-    // },
-  ];
+  // const iconList = [
+  // {
+  //   icon: SearchOutlined,
+  //   tips: '搜索',
+  //   eventObject: {
+  //     click: () => openAppSearch(),
+  //   },
+  // },
+  // {
+  //   icon: GithubOutlined,
+  //   tips: 'github',
+  //   eventObject: {
+  //     click: () => window.open('https://github.com/jekip/naive-ui-admin'),
+  //   },
+  // },
+  // {
+  //   icon: LockOutlined,
+  //   tips: '锁屏',
+  //   eventObject: {
+  //     click: () => useLockscreen.setLock(true),
+  //   },
+  // },
+  // ];
 
   //头像下拉菜单
   const avatarSelect = (command) => {
@@ -487,6 +490,17 @@
       align-items: center;
       padding-right: 20px;
 
+      .username {
+        padding: 0px 10px;
+        font-family: PingFangSC, PingFang SC;
+        font-weight: 400;
+        font-size: 14px;
+        color: rgba(0, 0, 0, 0.65);
+        line-height: 22px;
+        text-align: left;
+        font-style: normal;
+      }
+
       .avatar {
         display: flex;
         align-items: center;