| 提交 | 用户 | 时间 | ||
| 820397 | 1 | <template> |
| 94d91d | 2 | <div id="title"> |
| H | 3 | <span>工业互联网平台</span> |
| 820397 | 4 | </div> |
| effbd8 | 5 | <el-skeleton :loading="loading" animated> |
| 94d91d | 6 | <div id="app"> |
| H | 7 | <div class="card" v-for="(item, index) in appList" :key="`dynamics-${index}`"> |
| 8 | <div @click="gotoApp(item)"> | |
| 9 | <img class="card-left" :src="item.icon"/> | |
| 10 | <div class="card-right"> | |
| 11 | <div class="app-title"> | |
| 12 | {{ item.appName }} | |
| 13 | </div> | |
| 14 | <div class="goto-app"> | |
| 0eebf7 | 15 | <div>进入应用</div> |
| 94d91d | 16 | </div> |
| H | 17 | </div> |
| effbd8 | 18 | </div> |
| H | 19 | </div> |
| 20 | </div> | |
| 21 | </el-skeleton> | |
| 22 | ||
| 820397 | 23 | </template> |
| H | 24 | <script lang="ts" setup> |
| effbd8 | 25 | |
| H | 26 | import * as AppApi from '@/api/system/app' |
| 27 | import {Apps} from "@/views/Home/types"; | |
| 28 | import {CACHE_KEY, useCache} from "@/hooks/web/useCache"; | |
| 820397 | 29 | |
| H | 30 | |
| aed8e1 | 31 | defineOptions({name: 'Home'}) |
| 820397 | 32 | |
| aed8e1 | 33 | const {wsCache} = useCache() |
| effbd8 | 34 | |
| H | 35 | const loading = ref(true) |
| 36 | ||
| 37 | let appList = reactive<Apps[]>([]) | |
| 38 | ||
| 39 | const getAppList = async () => { | |
| 40 | const data = await AppApi.getAppList() | |
| 41 | appList = Object.assign(appList, data) | |
| 42 | } | |
| 43 | ||
| aed8e1 | 44 | const getAppMenuList = async (id, appCode) => { |
| effbd8 | 45 | const data = await AppApi.getAppMenuList(id) |
| H | 46 | let userInfo = wsCache.get(CACHE_KEY.USER) |
| 47 | userInfo.menus = data | |
| 48 | wsCache.set(CACHE_KEY.USER, userInfo) | |
| 49 | wsCache.set(CACHE_KEY.ROLE_ROUTERS, data) | |
| 50 | window.location.href = '/plat/index' | |
| 51 | } | |
| 52 | ||
| 53 | const getAllApi = async () => { | |
| 54 | await Promise.all([ | |
| 55 | getAppList() | |
| 56 | ]) | |
| 57 | loading.value = false | |
| 58 | } | |
| 59 | ||
| 60 | getAllApi() | |
| 61 | ||
| 62 | // 进入应用 | |
| 63 | const gotoApp = async (item) => { | |
| aed8e1 | 64 | let path = window.location.pathname |
| H | 65 | let appName = path.split("/")[0] |
| 66 | console.log(appName) | |
| effbd8 | 67 | let id = item.id |
| H | 68 | let type = item.type |
| aed8e1 | 69 | let appCode = item.appCode |
| H | 70 | if (type === 0) { |
| 71 | await getAppMenuList(id, appCode) | |
| effbd8 | 72 | } else { |
| 3f4d4e | 73 | const data = await AppApi.getAppMenuList(id) |
| H | 74 | let userInfo = wsCache.get(CACHE_KEY.USER) |
| 75 | userInfo.menus = data | |
| 76 | wsCache.set(CACHE_KEY.USER, userInfo) | |
| 77 | wsCache.set(CACHE_KEY.ROLE_ROUTERS, data) | |
| 844cbf | 78 | window.open(item.appDomain + '/index', '_blank') |
| aed8e1 | 79 | // window.open('/plat/shasteel', '_blank') |
| H | 80 | // window.location.href = '/plat/shasteel' |
| 81 | // window.location.href = `/plat/shasteel?key=energy&url=http://localhost:9000&energy=/energy/demo` | |
| effbd8 | 82 | } |
| H | 83 | } |
| 820397 | 84 | |
| H | 85 | </script> |
| effbd8 | 86 | |
| H | 87 | <style lang="scss" scoped> |
| 94d91d | 88 | #title { |
| H | 89 | width: 280px; |
| 90 | height: 51px; | |
| 91 | margin: 30px auto; | |
| 92 | font-family: Microsoft YaHei UI, Microsoft YaHei UI; | |
| 93 | font-weight: bold; | |
| 94 | font-size: 40px; | |
| 95 | color: #282F3D; | |
| effbd8 | 96 | } |
| 94d91d | 97 | #app { |
| H | 98 | margin: 0 96px; |
| 99 | width: 100%; | |
| 100 | } | |
| aed8e1 | 101 | .card { |
| 94d91d | 102 | width: 354px; |
| H | 103 | height: 200px; |
| 104 | margin: 0 24px 24px 0; | |
| 105 | background: linear-gradient( 180deg, #E9F0FA 0%, #FFFFFF 100%); | |
| 106 | border-radius: 12px 12px 12px 12px; | |
| 107 | border: 2px solid; | |
| 108 | border-image: linear-gradient(180deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 1)) 2 2; | |
| 109 | display: inline-block; | |
| 110 | } | |
| 111 | .card > div{ | |
| 112 | display: inline-block; | |
| 113 | } | |
| 114 | .card-left{ | |
| 115 | height: 100px; | |
| 116 | width: 100px; | |
| 117 | float: left; | |
| 118 | margin: 50px 30px; | |
| 119 | } | |
| 120 | .card-right { | |
| 121 | float: right; | |
| 122 | margin: 61px 10px; | |
| 123 | } | |
| 124 | .app-title { | |
| 125 | width: 162px; | |
| 126 | font-family: Microsoft YaHei, Microsoft YaHei; | |
| 127 | font-weight: bold; | |
| 128 | font-size: 24px; | |
| 129 | color: #282F3D; | |
| 130 | } | |
| 131 | .goto-app { | |
| 132 | width: 96px; | |
| 133 | height: 35px; | |
| 134 | margin-top: 5px; | |
| 135 | background: #3A99FD; | |
| 136 | border-radius: 80px 80px 80px 80px; | |
| 137 | } | |
| 138 | .goto-app > div { | |
| 139 | padding: 6px; | |
| 140 | margin-left: 5px; | |
| 141 | font-family: Microsoft YaHei UI, Microsoft YaHei UI; | |
| 142 | font-weight: 400; | |
| 143 | font-size: 18px; | |
| 144 | color: #FFFFFF; | |
| effbd8 | 145 | } |
| H | 146 | </style> |
