src/App.vue

@@ -1,3 +1,11 @@
+<!--
+ * @Descripttion: 
+ * @version: 
+ * @Author: fzq
+ * @Date: 2022-11-25 09:51:46
+ * @LastEditors: fzq
+ * @LastEditTime: 2022-12-13 19:44:21
+-->
 <template>
 	<transition name="el-fade-in-linear">
 		<router-view />
@@ -11,7 +19,7 @@
 </style>
 <script>
 import Cookies from 'js-cookie'
-import { messages } from '@/i18n'
+// import { messages } from '@/i18n'
 export default {
 	watch: {
 		'$i18n.locale': 'i18nHandle'
@@ -23,7 +31,8 @@ export default {
 		i18nHandle(val, oldVal) {
 			Cookies.set('language', val)
 			document.querySelector('html').setAttribute('lang', val)
-			document.title = messages[val].brand.lg
+			// 不注释掉会报错
+			// document.title = messages[val].brand.lg
 			// 非登录页面，切换语言刷新页面
 			if (this.$route.name !== 'login' && oldVal) {
 				window.location.reload()

src/i18n/en.js

@@ -4,7 +4,7 @@ t.loading = 'Loading...'
 t.createTime = 'Create Time'
 
 t.brand = {}
-t.brand.lg = 'Deep Processing SCADA Platform'
+t.brand.lg = 'SCADA Platform'
 t.brand.mini = 'SCADA'
 
 t.routes = {}

src/i18n/index.js

@@ -1,3 +1,11 @@
+/*
+ * @Descripttion: 
+ * @version: 
+ * @Author: fzq
+ * @Date: 2022-11-25 09:51:46
+ * @LastEditors: fzq
+ * @LastEditTime: 2022-12-13 19:27:24
+ */
 import Vue from 'vue'
 import VueI18n from 'vue-i18n'
 import Cookies from 'js-cookie'
@@ -43,5 +51,7 @@ export function getLanguage() {
 export default new VueI18n({
   // locale: Cookies.get('language') || 'zh-CN',
   locale: getLanguage(), // 先默认中文
-  messages
+  messages,
+  //抑制警告
+  silentFallbackWarn: true,
 })

src/router/index.js

@@ -44,12 +44,12 @@ export const moduleRoutes = {
   path: '/',
   component: () => import('@/views/main'),
   name: 'main',
-  // redirect: { name: 'home' },
-  redirect: { name: 'sys-log-login' },
+  redirect: { name: 'home' },
+  // redirect: { name: 'sys-log-login' },
   meta: { title: '主入口布局' },
   children: [
-    { path: '/sys-log-login', component: () => import('@/views/modules/sys/log-login'), name: 'sys-log-login', meta: { title: '首页', isTab: true } }
-    // { path: '/home', component: () => import('@/views/modules/home'), name: 'home', meta: { title: '首页', isTab: true } }
+    // { path: '/sys-log-login', component: () => import('@/views/modules/sys/log-login'), name: 'sys-log-login', meta: { title: '首页', isTab: true } }
+    { path: '/home', component: () => import('@/views/modules/home'), name: 'home', meta: { title: '首页', isTab: true, hiddenSiderbar: true } }
   ]
 }
 

src/store/index.js

@@ -31,13 +31,13 @@ export default new Vuex.Store({
     contentTabs: [
       {
         ...window.SITE_CONFIG['contentTabDefault'],
-        'name': 'sys-log-login',
-        // 'name': 'home',
+        // 'name': 'sys-log-login',
+        'name': 'home',
         'title': 'home'
       }
     ],
-    // contentTabsActiveName: 'home'
-    contentTabsActiveName: 'sys-log-login'
+    contentTabsActiveName: 'home'
+    // contentTabsActiveName: 'sys-log-login'
   },
   modules: {
     user

src/views/main-content.vue

@@ -89,6 +89,7 @@ export default {
 		// tabs, 关闭全部
 		tabsCloseAllHandle() {
 			this.$store.state.contentTabs = this.$store.state.contentTabs.filter(item => item.name === 'home')
+			// this.$router.push({ name: 'sys-log-login' })
 			this.$router.push({ name: 'home' })
 		}
 	}

src/views/main-navbar.vue

@@ -2,7 +2,7 @@
 	<nav class="aui-navbar" :class="`aui-navbar--${$store.state.navbarLayoutType}`">
 		<!-- <hamburger v-if="showhome" id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" /> -->
 		<div class="aui-navbar__header">
-			<h1 class="aui-navbar__brand" @click="$router.push({ name: 'sys-log-login' })">
+			<h1 class="aui-navbar__brand" @click="$router.push({ name: 'home' })">
 				<a class="aui-navbar__brand-lg" href="javascript:;">
 					<img src="../assets/img/cnbm.png" style="width: 36px; height: 36px; position: relative; top: 0em; margin-right: 12px" alt="" />
 					{{ $t('brand.lg') }}

src/views/main.vue

@@ -2,7 +2,7 @@
 	<div v-loading.fullscreen.lock="loading" :element-loading-text="$t('loading')" :class="['aui-wrapper', { 'aui-sidebar--fold': $store.state.sidebarFold }]">
 		<template v-if="!loading">
 			<main-navbar />
-			<main-sidebar />
+			<main-sidebar v-if="this.$route.meta.hiddenSiderbar !== true"/>
 			<div class="aui-content__wrapper">
 				<main-content v-if="!$store.state.contentIsNeedRefresh" />
 			</div>

src/views/modules/home.vue

@@ -1,47 +1,240 @@
-<!--
- * @Descripttion: 
- * @version: 
- * @Author: fzq
- * @Date: 2022-12-09 15:44:37
- * @LastEditors: fzq
- * @LastEditTime: 2022-12-11 20:47:56
--->
 <template>
-	<el-card shadow="never" class="aui-card--fill">
-		<!-- <div class="mod-home">
-			<h3>项目介绍</h3>
-			<ul>
-				<li>
-					renren-ui基于vue、element-ui构建开发，实现<a href="https://gitee.com/renrenio/renren-ui" target="_blank">renren-security</a>后台管理前端功能，提供一套更优的前端解决方案
-				</li>
-				<li>前后端分离，通过token进行数据交互，可独立部署</li>
-				<li>动态菜单，通过菜单管理统一管理访问路由</li>
-				<li>演示地址：<a href="http://demo.open.renren.io/renren-security" target="_blank">http://demo.open.renren.io/renren-security</a> (账号密码：admin/admin)</li>
-			</ul>
-			<h3>获取帮助</h3>
-			<ul>
-				<li>官方社区：<a href="https://www.renren.io/community" target="_blank">https://www.renren.io/community</a></li>
-				<li>前端Git地址：<a href="https://gitee.com/renrenio/renren-ui" target="_blank">https://gitee.com/renrenio/renren-ui</a></li>
-				<li>后台Git地址：<a href="https://gitee.com/renrenio/renren-security" target="_blank">https://gitee.com/renrenio/renren-security</a></li>
-				<li>如需关注项目最新动态，请Watch、Star项目，同时也是对项目最好的支持</li>
-			</ul>
-			<h3>官方微信群</h3>
-			<ul>
-				<li>扫码下面的二维码，关注【人人开源】公众号，回复【加群】，即可根据提示加入微信群！</li>
-			</ul>
-		</div> -->
-	</el-card>
+  <div class="choicepart-container">
+    <!-- <div class="choicepat-navbar">
+      <navbar :showhome="false" :show-title="true" />
+    </div> -->
+    <div class="choicepart-box">
+      <div
+        v-for="(item, index) in routeList"
+        :key="item.path"
+        class="choicepart-item"
+        @click="handelClick(item, index)"
+      >
+        <!-- :style="{ background: colorArr.colorList[index % 9] }" -->
+        <div class="choicepart-item-border">
+          <img :src="require(`../../assets/img/choicepart/${item.name}.png`)" alt="">
+        </div>
+        <div class="choicepart-item-title" :title="item.name">{{ item.name }}</div>
+      </div>
+    </div>
+  </div>
 </template>
 
 <script>
+// import db from '@/utils/indexDB'
+// import { mapGetters } from 'vuex'
+// import { constantRoutes } from '@/router'
+// import { Navbar } from '@/layout/components'
+// import { downLoadBGP } from '@/api/user'
+import store from '@/store'
+// import { blobToBase64 } from '@/utils/blobToBase64'
+const colorList = ['#8080ff', '#ff8080', '#b004fb', '#ff409f', '#00caca', '#8080c0', '#cccc00', '#ff8040', '#0c4d9e']
+const colorList1 = ['#b4b4ff', '#ffb4b4', '#c648fb', '#ff86c2', '#66f6f6', '#a2a2f3', '#ffff9a', '#ffc3a5', '#367cd4']
+
 export default {
-		created() {
-		this.$router.replace({ name: 'sys-log-login' })
-	},
+  name: 'ChoicePart',
+//   components: { Navbar },
+  data() {
+    return {
+      baseImg: require('../../assets/img/login-back.jpg'),
+      coverImgUrl: localStorage.getItem('backImg') || '',
+      rowNum: 1,
+      colorArr: {
+        colorList,
+        colorList1
+      },
+      windowWidth: 0,
+      dbConnect: null
+    }
+  },
+  computed: {
+    routeList() {
+    //   const cangoList = []
+    //   const permission_routes = store.getters.permission_routes
+    //   console.log(permission_routes)
+    //   permission_routes.map(item => {
+    //     if (!item.hidden && item.meta) {
+    //       cangoList.push(item)
+    //     }
+    //   })
+    //   const formatList = cangoList.map((item, index) => {
+    //     return this.setIndex(item, index)
+    //   })
+    //   console.log(formatList)
+      return window.SITE_CONFIG['menuList'] 
+    },
+    // ...mapGetters(['language', 'dictList', 'dictObj'])
+  },
+  created() {
+    this.windowWidth = window.innerWidth
+    // this.dbConnect = db({
+    //   DBName: 'back_img',
+    //   version: '1.0',
+    //   params: [
+    //     { name: 'id', unique: true },
+    //     { name: 'imgUrl', unique: true }
+    //   ]
+    // })
+    // const request = this.dbConnect.openDB()
+    // request.onsuccess = () => {
+    //   // const result = this.dbConnect.search('back_img', 'id', 1)
+    // }
+  },
+  mounted() {
+    // console.log(this.dictList, this.dictObj)
+    // this.getPic()
+  },
+  methods: {
+    // getPic() {
+    //   // edit here
+    //   downLoadBGP().then(response => {
+    //     if (response.data.size) {
+    //       blobToBase64(response.data).then(res => {
+    //         this.coverImgUrl = res
+    //         localStorage.setItem('backImg', res)
+    //         console.log(res)
+    //         // const result = this.dbConnect.search('back_img', 'id', 1)
+    //         // if (result.result) {
+    //         //   this.dbConnect.update({
+    //         //     id: 1,
+    //         //     imgUrl: res
+    //         //   })
+    //         // } else {
+    //         //   this.dbConnect.add({
+    //         //     id: 1,
+    //         //     imgUrl: res
+    //         //   })
+    //         // }
+    //       })
+    //       // this.coverImgUrl = response.data
+    //       // const temp = response.data.split('/')
+    //       // temp.splice(0, 2)
+    //       // this.coverImgUrl = 'http://zzdhg.mes.picaiba.com/' + temp.join('/')
+    //     }
+    //   })
+    // },
+    resize() {},
+    handelClick(item, index) {
+      // this.$store.dispatch('app/setChoicepart', index)
+      // if (item.meta.unuse) {
+      //   this.$message.warning(this.$t('choisePart.module'))
+      // } else {
+      //   this.toRouter(item)
+      // }
+      this.toRouter(item)
+    },
+    toRouter(item) {
+      console.log(item.children[0].url)
+      if (item.children) {
+        this.$router.push({name: item.children[0].url.replace(new RegExp('/','g'),'-')})
+      } else {
+        this.$router.push({name: item.children[0].url.replace(new RegExp('/','g'),'-')})
+      }
+    },
+    setIndex(list, index) {
+      list.meta.routeIndex = index
+      if (list.children) {
+        list.children.map(item => {
+          this.setIndex(item, index)
+        })
+      }
+      return list
+    }
+  }
 }
 </script>
-<style>
-.mod-home {
-	line-height: 1.5;
+
+<style lang="scss" scoped>
+.choicepart-container {
+  min-width: 100%;
+  min-height: 100vh;
+  // background: linear-gradient(-45deg, rgb(25, 25, 200), rgb(0, 100, 200));
+  background: url('../../assets/img/choicepart/choicepart-back.png') repeat;
+  background-size: cover;
+  overflow-x: scroll;
+  .choicepart-box {
+    width: 1440px;
+    margin: 0 auto;
+    margin: 0 auto;
+    padding-top: 16vh;
+    min-height: 100vh;
+    .choicepart-item {
+      display: inline-block;
+      width: 208px;
+      height: 258px;
+      margin: 40px;
+      background: url('../../assets/img/choicepart/choice-item-back.png') no-repeat;
+      background-size: 100% 100%;
+      // border: 1px dashed #fff;
+      box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
+      top: 0;
+      border-radius: 5px;
+      overflow: hidden;
+      cursor: pointer;
+      position: relative;
+      img {
+        width: 208px;
+        height: 258px;
+      }
+      .choicepart-item-border {
+        height: 100%;
+        border-radius: 5px;
+        padding: 0 5px;
+        line-height: 32px;
+        font-size: 28px;
+        font-weight: lighter;
+        color: #2c6bd8;
+        overflow: hidden;
+      }
+      .choicepart-item-title {
+        overflow: hidden;
+        padding: 0 10px;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        position: absolute;
+        bottom: 0;
+        left: 2px;
+        right: 2px;
+        text-align: center;
+        color: #fff;
+        font-size: 16px;
+        line-height: 48px;
+        height: 48px;
+        letter-spacing: 2px;
+        background-color: rgba($color: #0b58ff, $alpha: 0.45);
+      }
+    }
+    .choicepart-item:hover {
+      .choicepart-item-title {
+        background-color: rgba($color: #0b58ff, $alpha: 1);
+      }
+    }
+  }
+  .choicepat-navbar {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    z-index: 10;
+  }
+}
+::-webkit-scrollbar-track-piece {
+  //滚动条凹槽的颜色，还可以设置边框属性
+  background: rgba(255, 255, 255, 0.1);
+}
+::-webkit-scrollbar {
+  //滚动条的宽度
+  width: 9px;
+  height: 9px;
+}
+::-webkit-scrollbar-thumb {
+  //滚动条的设置
+  background-color: #dddddd;
+  background-clip: padding-box;
+  min-height: 28px;
+  border-radius: 9px;
+}
+::-webkit-scrollbar-thumb:hover {
+  background-color: #bbb;
 }
 </style>

src/views/modules/monitoring/product.vue

@@ -176,6 +176,7 @@ export default {
 				}
 			}
 		})
+		console.log(this.$route)
 	},
 	activated() {
 		this.getDataList()

src/views/pages/404.vue

@@ -7,6 +7,7 @@
 				<div class="btn-bar">
 					<el-button @click="$router.go(-1)">{{ $t('notFound.back') }}</el-button>
 					<el-button type="primary" @click="$router.push({ name: 'home' })">{{ $t('notFound.home') }}</el-button>
+					<!-- <el-button type="primary" @click="$router.push({ name: 'sys-log-login' })">{{ $t('notFound.home') }}</el-button> -->
 				</div>
 			</div>
 		</div>

src/views/pages/login.vue

@@ -199,8 +199,8 @@ export default {
 							}
 						})
 
-						// this.$router.replace({ name: 'home' })
-            this.$router.replace({ name: 'sys-log-login' })
+						this.$router.replace({ name: 'home' })
+            // this.$router.replace({ name: 'sys-log-login' })
 					})
 					.catch(err => {
 						this.$message({