From a10f68d9c66dee70ef1d5459f462c21bac7cdff9 Mon Sep 17 00:00:00 2001
From: shj <1790240199@qq.com>
Date: 星期二, 05 七月 2022 14:01:55 +0800
Subject: [PATCH] 目标管理
---
src/views/home/index.vue | 247 +++++++++++++++++++++++-------------------------
1 files changed, 119 insertions(+), 128 deletions(-)
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 45dd9ce..762393f 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -2,14 +2,14 @@
<div class="home-container">
<el-row :gutter="15" class="home-card-one mb15">
<el-col
- :xs="24"
- :sm="12"
- :md="12"
- :lg="4"
- :xl="4"
- v-for="(v, k) in homeOne"
- :key="k"
- :class="{ 'home-media home-media-lg': k > 1, 'home-media-sm': k === 1 }"
+ :xs="24"
+ :sm="12"
+ :md="12"
+ :lg="4"
+ :xl="4"
+ v-for="(v, k) in homeOne"
+ :key="k"
+ :class="{ 'home-media home-media-lg': k > 1, 'home-media-sm': k === 1 }"
>
<div class="home-card-item flex" >
<el-button @click="renderMenu(v.id)">{{v.name}}</el-button>
@@ -50,142 +50,133 @@
</template>
<script lang="ts">
-import { toRefs, reactive, defineComponent, onMounted, ref, watch, nextTick, onActivated } from 'vue';
-import * as echarts from 'echarts';
-import { storeToRefs } from 'pinia';
-import { useThemeConfig } from '/@/stores/themeConfig';
-import { useTagsViewRoutes } from '/@/stores/tagsViewRoutes';
-import { initBackEndControlRoutes } from '/@/router/backEnd';
-import {Session} from "/@/utils/storage";
-import {useRoutesList} from "/@/stores/routesList";
-import pinia from "/@/stores";
+ import { toRefs, reactive, defineComponent, } from 'vue';
+ import { storeToRefs } from 'pinia';
+ import { initBackEndControlRoutes } from '/@/router/backEnd';
+ import {useUserInfo} from "/@/stores/userInfo";
+ import { Session } from '/@/utils/storage';
+ let global: any = {
+ homeChartOne: null,
+ homeChartTwo: null,
+ homeCharThree: null,
+ dispose: [null, '', undefined],
+ };
-let global: any = {
- homeChartOne: null,
- homeChartTwo: null,
- homeCharThree: null,
- dispose: [null, '', undefined],
-};
-
-interface stateType {
- projectId:string,
- homeOne: Array <type>
-}
-interface type {
- id:number,
- name: string
-}
-export default defineComponent({
- name: 'home',
- setup() {
- const storesRoutesList = useRoutesList(pinia);
- const { routesList } = storeToRefs(storesRoutesList);
- // const storesTagsViewRoutes = useTagsViewRoutes();
- // const storesThemeConfig = useThemeConfig();
- const state = reactive<stateType>({
- projectId:'',
- homeOne:[{id:1,name:'基础数据权限管理系统'},{id:2,name:'系统1'},{id:3,name:'系统2'},{id:4,name:'系统3'},{id:5,name:'系统4'}],
- });
- // 折线图
- const renderMenu = async (value: string) => {
- state.projectId = value
- Session.set('projectId',value)
- await initBackEndControlRoutes();
- };
- return {
- renderMenu,
- ...toRefs(state),
- };
- },
-});
+ interface stateType {
+ homeOne: Array <type>
+ }
+ interface type {
+ id:number,
+ name: string
+ }
+ export default defineComponent({
+ name: 'home',
+ setup() {
+ const userInfo = useUserInfo()
+ const { userInfos } = storeToRefs(userInfo);
+ const state = reactive<stateType>({
+ homeOne:[{id:1,name:'基础数据权限管理系统'},{id:2,name:'系统1'},{id:3,name:'系统2'},{id:4,name:'系统3'},{id:5,name:'系统4'}],
+ });
+ // 折线图
+ const renderMenu = async (value: string) => {
+ Session.set('projectId',value)
+ userInfos.value.projectId = value
+ await initBackEndControlRoutes();
+ };
+ return {
+ renderMenu,
+ ...toRefs(state),
+ };
+ },
+ });
</script>
<style scoped lang="scss">
-$homeNavLengh: 8;
-.home-container {
- overflow: hidden;
- .home-card-one,
- .home-card-two,
- .home-card-three {
- .home-card-item {
- width: 100%;
- height: 130px;
- border-radius: 4px;
- transition: all ease 0.3s;
- padding: 20px;
- overflow: hidden;
- background: var(--el-color-white);
- color: var(--el-text-color-primary);
- border: 1px solid var(--next-border-color-light);
- &:hover {
- box-shadow: 0 2px 12px var(--next-color-dark-hover);
+ $homeNavLengh: 8;
+ .home-container {
+ overflow: hidden;
+ .home-card-one,
+ .home-card-two,
+ .home-card-three {
+ .home-card-item {
+ width: 100%;
+ height: 130px;
+ border-radius: 4px;
transition: all ease 0.3s;
- }
- &-icon {
- width: 70px;
- height: 70px;
- border-radius: 100%;
- flex-shrink: 1;
- i {
- color: var(--el-text-color-placeholder);
+ padding: 20px;
+ overflow: hidden;
+ background: var(--el-color-white);
+ color: var(--el-text-color-primary);
+ border: 1px solid var(--next-border-color-light);
+ &:hover {
+ box-shadow: 0 2px 12px var(--next-color-dark-hover);
+ transition: all ease 0.3s;
+ }
+ &-icon {
+ width: 70px;
+ height: 70px;
+ border-radius: 100%;
+ flex-shrink: 1;
+ i {
+ color: var(--el-text-color-placeholder);
+ }
+ }
+ &-title {
+ font-size: 15px;
+ font-weight: bold;
+ height: 30px;
}
}
- &-title {
- font-size: 15px;
- font-weight: bold;
- height: 30px;
+ }
+ .home-card-one {
+ @for $i from 0 through 3 {
+ .home-one-animation#{$i} {
+ opacity: 0;
+ animation-name: error-num;
+ animation-duration: 0.5s;
+ animation-fill-mode: forwards;
+ animation-delay: calc($i/10) + s;
+ }
}
}
- }
- .home-card-one {
- @for $i from 0 through 3 {
- .home-one-animation#{$i} {
- opacity: 0;
- animation-name: error-num;
- animation-duration: 0.5s;
- animation-fill-mode: forwards;
- animation-delay: calc($i/10) + s;
- }
- }
- }
- .home-card-two,
- .home-card-three {
- .home-card-item {
- height: 400px;
- width: 100%;
- overflow: hidden;
- .home-monitor {
- height: 100%;
- .flex-warp-item {
- width: 25%;
- height: 111px;
- display: flex;
- .flex-warp-item-box {
- margin: auto;
- text-align: center;
- color: var(--el-text-color-primary);
+ .home-card-two,
+ .home-card-three {
+ .home-card-item {
+ height: 400px;
+ width: 100%;
+ overflow: hidden;
+ .home-monitor {
+ height: 100%;
+ .flex-warp-item {
+ width: 25%;
+ height: 111px;
display: flex;
- border-radius: 5px;
- background: var(--next-bg-color);
- cursor: pointer;
- transition: all 0.3s ease;
- &:hover {
- background: var(--el-color-primary-light-9);
+ .flex-warp-item-box {
+ margin: auto;
+ text-align: center;
+ color: var(--el-text-color-primary);
+ display: flex;
+ border-radius: 5px;
+ background: var(--next-bg-color);
+ cursor: pointer;
transition: all 0.3s ease;
+ &:hover {
+ background: var(--el-color-primary-light-9);
+ transition: all 0.3s ease;
+ }
}
- }
- @for $i from 0 through $homeNavLengh {
- .home-animation#{$i} {
- opacity: 0;
- animation-name: error-num;
- animation-duration: 0.5s;
- animation-fill-mode: forwards;
- animation-delay: calc($i/10) + s;
+ @for $i from 0 through $homeNavLengh {
+ .home-animation#{$i} {
+ opacity: 0;
+ animation-name: error-num;
+ animation-duration: 0.5s;
+ animation-fill-mode: forwards;
+ animation-delay: calc($i/10) + s;
+ }
}
}
}
}
}
}
-}
</style>
--
Gitblit v1.9.2