From f6ea543b3de9a770c1bf5db2baf3e8a5dc2c867a Mon Sep 17 00:00:00 2001 From: 潘志宝 <979469083@qq.com> Date: 星期一, 30 十二月 2024 18:18:44 +0800 Subject: [PATCH] 10.88.4.131 --- src/views/Home/Index.vue | 113 +++++++++++++++++++++++++++++++++++++++++--------------- 1 files changed, 82 insertions(+), 31 deletions(-) diff --git a/src/views/Home/Index.vue b/src/views/Home/Index.vue index 822f800..1558788 100644 --- a/src/views/Home/Index.vue +++ b/src/views/Home/Index.vue @@ -1,13 +1,20 @@ <template> - <div> - <h1>IAILAB 平台主页</h1> + <div id="title"> + <span>工业互联网平台</span> </div> <el-skeleton :loading="loading" animated> - <div id="app" v-for="(item, index) in appList" :key="`dynamics-${index}`"> - <div class="card" @click="gotoApp(item)"> - <img :src="item.icon" style="width: 100px; height: 100px"/> + <div id="app"> + <div class="card" v-for="(item, index) in appList" :key="`dynamics-${index}`"> <div> - {{ item.appName }} + <img class="card-left" :src="item.icon"/> + <div class="card-right"> + <div class="app-title"> + {{ item.appName }} + </div> + <div class="goto-app" @click="gotoApp(item)"> + <div>进入应用</div> + </div> + </div> </div> </div> </div> @@ -18,12 +25,13 @@ import * as AppApi from '@/api/system/app' import {Apps} from "@/views/Home/types"; -import {CACHE_KEY, useCache} from "@/hooks/web/useCache"; +import {CACHE_KEY, useCache, useSessionCache} from "@/hooks/web/useCache"; defineOptions({name: 'Home'}) const {wsCache} = useCache() +const {wsSessionCache} = useSessionCache() const loading = ref(true) @@ -37,10 +45,10 @@ const getAppMenuList = async (id, appCode) => { const data = await AppApi.getAppMenuList(id) let userInfo = wsCache.get(CACHE_KEY.USER) - userInfo.menus = data + // userInfo.menus = data wsCache.set(CACHE_KEY.USER, userInfo) - wsCache.set(CACHE_KEY.ROLE_ROUTERS, data) - window.location.href = '/plat/index' + wsSessionCache.set(CACHE_KEY.ROLE_ROUTERS, data) + window.location.href = import.meta.env.VITE_BASE_PATH + 'index' } const getAllApi = async () => { @@ -56,18 +64,18 @@ const gotoApp = async (item) => { let path = window.location.pathname let appName = path.split("/")[0] - console.log(appName) let id = item.id let type = item.type let appCode = item.appCode if (type === 0) { await getAppMenuList(id, appCode) } else { - const data = await AppApi.getAppMenuList(id) - let userInfo = wsCache.get(CACHE_KEY.USER) - userInfo.menus = data - wsCache.set(CACHE_KEY.USER, userInfo) - wsCache.set(CACHE_KEY.ROLE_ROUTERS, data) + // const data = await AppApi.getAppMenuList(id) + // let userInfo = wsCache.get(CACHE_KEY.USER) + // userInfo.menus = data + // wsCache.set(CACHE_KEY.USER, userInfo) + // wsSessionCache.set(CACHE_KEY.ROLE_ROUTERS, data) + localStorage.setItem(appCode, id) window.open(item.appDomain + '/index', '_blank') // window.open('/plat/shasteel', '_blank') // window.location.href = '/plat/shasteel' @@ -78,24 +86,67 @@ </script> <style lang="scss" scoped> +#title { + width: 280px; + height: 51px; + margin: 30px auto; + font-family: Microsoft YaHei UI, Microsoft YaHei UI; + font-weight: bold; + font-size: 40px; + color: #282F3D; +} + #app { - width: 300px; - height: 200px; - display: inline-block; - background: transparent; + margin: 0 96px; + width: 100%; } .card { - border: thin dashed gainsboro; - width: 150px; - height: 120px; - padding: 30px; - text-align: center; - justify-content: center; - font-size: 15px; - font-weight: bolder; - color: blue; - background: aliceblue; - border-radius: 10px; + width: 354px; + height: 200px; + margin: 0 24px 24px 0; + background: linear-gradient(180deg, #E9F0FA 0%, #FFFFFF 100%); + border-radius: 12px 12px 12px 12px; + border: 2px solid; + border-image: linear-gradient(180deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 1)) 2 2; + display: inline-block; +} + +.card-left { + height: 100px; + width: 100px; + float: left; + margin: 50px 30px; +} + +.card-right { + float: right; + margin: 61px 10px; +} + +.app-title { + width: 162px; + font-family: Microsoft YaHei, Microsoft YaHei; + font-weight: bold; + font-size: 24px; + color: #282F3D; +} + +.goto-app { + width: 96px; + height: 35px; + margin-top: 5px; + background: #3A99FD; + border-radius: 80px 80px 80px 80px; + cursor: pointer; +} + +.goto-app > div { + padding: 6px; + margin-left: 5px; + font-family: Microsoft YaHei UI, Microsoft YaHei UI; + font-weight: 400; + font-size: 18px; + color: #FFFFFF; } </style> -- Gitblit v1.9.3