From c9d4807c75408b94d7907d304348b5a6ec763bc4 Mon Sep 17 00:00:00 2001
From: hzz <hzz>
Date: Mon, 7 Aug 2023 17:09:03 +0800
Subject: [PATCH] update

---
 src/views/index.vue | 96 ++++++++++++++++++++++++---------------------
 1 file changed, 52 insertions(+), 44 deletions(-)

diff --git a/src/views/index.vue b/src/views/index.vue
index 63a8b19..0771734 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -11,39 +11,27 @@
 <template>
   <div :class="$style['container']" ref="appRef">
     <div class="navbar">
-      <el-dropdown @command="changelang" >
-    <span class="el-dropdown-link">
-      <!-- <img src="../assets/svg/gateway.svg" alt="" class="langimg" height="20px" width="20px"> -->
-      <i class="iconfont icon-zhongyingwen langimg"></i>
-    </span>
-    <template #dropdown>
-      <el-dropdown-menu>
-        <el-dropdown-item :class="'简体中文' == lang?'select':'' " command="简体中文">简体中文</el-dropdown-item>
-        <el-dropdown-item :class="'English/USD' == lang?'select':'' " command="English/USD">English</el-dropdown-item>
-      </el-dropdown-menu>
-    </template>
-  </el-dropdown>
-      <!-- <el-select class="m-2" v-model="lang"  placeholder="Select" size="large" @change="changelang">
-        <el-option
-          :label="'简体中文'"
-          :value="'简体中文'"
-        />
-        <el-option
-          :label="'English/USD'"
-          :value="'English/USD'"
-        />
-      </el-select> -->
+      <h2 class="title">大屏管理系统</h2>
+      <div class="dropdown">
+        <el-dropdown @command="changelang">
+          <span class="el-dropdown-link">
+            <!-- <img src="../assets/svg/gateway.svg" alt="" class="langimg" height="20px" width="20px"> -->
+            <i class="iconfont icon-zhongyingwen langimg"></i>
+          </span>
+          <template #dropdown>
+            <el-dropdown-menu>
+              <el-dropdown-item :class="'简体中文' == lang ? 'select' : ''" command="简体中文">简体中文</el-dropdown-item>
+              <el-dropdown-item :class="'English/USD' == lang ? 'select' : ''"
+                command="English/USD">English</el-dropdown-item>
+            </el-dropdown-menu>
+          </template>
+        </el-dropdown>
+      </div>
     </div>
 
     <div class="itemlist">
-      <list
-        v-for="res in routerList"
-        :path="res.path"
-        :is-link="res.isLink"
-        :title="res.title"
-        :key="res.id"
-        :url="res.url"
-      ></list>
+      <list v-for="res in routerList" :path="res.path" :is-link="res.isLink" :title="res.title" :key="res.id"
+        :url="res.url"></list>
     </div>
   </div>
 </template>
@@ -53,7 +41,7 @@ import { ref, onMounted, onUnmounted } from "vue";
 import list from "@/components/assembly/indexList.vue";
 import { useI18n } from "vue-i18n";
 import { getStoredLanguage, saveStoredLanguage } from "@/utils/languageStorage";
-let langicon=require("@/assets/svg/language.svg")
+let langicon = require("@/assets/svg/language.svg")
 window.document.title = "大屏物联管理系统";
 let { t } = useI18n();
 let routerList = [
@@ -299,14 +287,14 @@ let routerList = [
     url: require("../assets/indexImg/intelligentShelves.png"),
   },
 ];
-let lang=ref(getStoredLanguage()||'简体中文')
-function changelang(val){
+let lang = ref(getStoredLanguage() || '简体中文')
+function changelang(val) {
 
-saveStoredLanguage(val)
-location.reload()
+  saveStoredLanguage(val)
+  location.reload()
 }
-onMounted(() => {});
-onUnmounted(() => {});
+onMounted(() => { });
+onUnmounted(() => { });
 </script>
 
 <style module>
@@ -317,12 +305,14 @@ onUnmounted(() => {});
 </style>
 <style scoped>
 @import '../assets/css/iconfont.css';
-.langimg{
+
+.langimg {
   width: 50px;
   height: 50px;
   font-size: 50px;
   color: #fff;
 }
+
 .itemlist {
   height: 1030px;
   width: 1920px;
@@ -334,16 +324,31 @@ onUnmounted(() => {});
   flex-wrap: wrap;
   overflow: auto !important;
 }
+
 .navbar {
+  position: relative;
   height: 50px;
   font-size: 20px;
-  width: 100%;
-  margin: 10px;
+  margin: 20px;
+  margin-top: 40px;
   display: flex;
-  justify-content: flex-end;
+  justify-content: center;
   align-items: center;
-  margin-left: -100px;
 }
+
+.title {
+  font-size: 40px;
+  text-align: center;
+  font-weight: bold;
+  color: white;
+}
+
+.dropdown {
+  position: absolute;
+  top: 0;
+  right: 90px;
+}
+
 .el-dropdown-link {
   font-size: 30px;
   color: #fff;
@@ -353,13 +358,16 @@ onUnmounted(() => {});
   background-color: #303133 !important;
   color: #fff;
 }
-.el-dropdown-menu__item{
-  color: #fff  !important;
+
+.el-dropdown-menu__item {
+  color: #fff !important;
 }
+
 .el-popper.is-light .el-popper__arrow::before {
   background-color: #303133 !important;
   color: #fff;
 }
+
 :deep(.select) {
   background-color: #e4f5f5 !important;
   color: #409EFF !important;