hanzhengzheng/screenFront
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
hzz 2023-08-07 17:09:03 +08:00
parent c4d68a6771
commit c9d4807c75
1 changed files with 52 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

96
src/views/index.vue
View File

@ -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;