Browse Source

【优化】前端路由设置带参数打开选中且不多打开标签,对窄屏幕增加部分适配

pull/172/MERGE
小诺 1 year ago committed by 俞宝山
parent
commit
45ef6b6bda
  1. 7
      snowy-admin-web/src/layout/components/moduleMenu.vue
  2. 2
      snowy-admin-web/src/layout/components/tags.vue
  3. 4
      snowy-admin-web/src/layout/index.vue
  4. 9
      snowy-admin-web/src/store/viewTags.js
  5. 1
      snowy-admin-web/src/views/exm/nestRoutor/index.vue
  6. 4
      snowy-admin-web/src/views/index/components/shortcut.vue
  7. 10
      snowy-admin-web/src/views/index/components/userInfo.vue
  8. 23
      snowy-admin-web/src/views/index/index.vue
  9. 6
      snowy-admin-web/src/views/sys/user/index.vue
  10. 7
      snowy-admin-web/src/views/sys/user/userCenter.vue

7
snowy-admin-web/src/layout/components/moduleMenu.vue

@ -3,7 +3,7 @@
<a-menu
v-model:selectedKeys="selectedKeys"
mode="horizontal"
v-if="menu && menu.length > 1"
v-if="menu && menu.length > 1 && !isMobile"
class="module-menu"
id="moduleMenu"
>
@ -22,7 +22,7 @@
</a-menu>
</div>
<div v-else>
<a-popover v-if="menu.length > 1" placement="bottomLeft">
<a-popover v-if="menu.length > 1 && !isMobile" placement="bottomLeft">
<template #content>
<a-row :gutter="[0, 5]" class="module-row">
<div v-for="item in menu" :key="item.id">
@ -56,6 +56,9 @@
const module = computed(() => {
return store.module
})
const isMobile = computed(() => {
return store.isMobile
})
//
watch(moduleUnfoldOpen, (newValue) => {
nextTick(() => {

2
snowy-admin-web/src/layout/components/tags.vue

@ -190,7 +190,7 @@
},
// tag
isActive(route) {
return route.fullPath === this.$route.fullPath
return route.path === this.$route.path
},
// tag
closeSelectedTag(tag, autoPushLatestView = true) {

4
snowy-admin-web/src/layout/index.vue

@ -272,7 +272,7 @@
//
nextTick(() => {
//
const active = route.meta.active || route.fullPath
const active = route.meta.active || route.path
selectedKeys.value = new Array(active)
const pidKey = getParentKeys(pMenu.value.children, active)
const nextTickMenu = pMenu.value.children
@ -316,6 +316,8 @@
showThis()
onMounted(() => {
onLayoutResize()
window.addEventListener('resize', onLayoutResize)
switchoverTopHeaderThemeColor()
})
watch(route, (newValue) => {

9
snowy-admin-web/src/store/viewTags.js

@ -18,11 +18,18 @@ export const viewTagsStore = defineStore({
getters: {},
actions: {
pushViewTags(route) {
const target = this.viewTags.find((item) => item.fullPath === route.fullPath)
const target = this.viewTags.find((item) => item.path === route.path)
const isName = route.name
if (!target && isName) {
this.viewTags.push(route)
}
if (target) {
this.viewTags.forEach((item) => {
if (item.path === route.path) {
Object.assign(item, route)
}
})
}
},
removeViewTags(route) {
this.viewTags.forEach((item, index) => {

1
snowy-admin-web/src/views/exm/nestRoutor/index.vue

@ -7,7 +7,6 @@
<script setup name="exmNestRoutor">
import { useRouter, useRoute } from 'vue-router'
import { defineComponent, ref } from 'vue'
const router = useRouter()
const route = useRoute()

4
snowy-admin-web/src/views/index/components/shortcut.vue

@ -2,7 +2,7 @@
<a-card :bordered="false">
<template #title> 快捷方式 </template>
<a-row :gutter="10">
<a-col :span="6" :key="shortcut.id" v-for="shortcut in shortcutList">
<a-col :span="6" :key="shortcut.id" v-for="shortcut in shortcutList" :xs="12" :sm="8" :md="6" :lg="8" :xl="6">
<shortcutCard
:icon="shortcut.icon ? shortcut.icon : 'menu-outlined'"
:label="shortcut.title"
@ -16,7 +16,7 @@
<script setup name="shortcut">
import router from '@/router'
import userCenterApi from '@/api/sys/userCenterApi'
import shortcutCard from '@/components/ShortcutCard/index.vue'
import ShortcutCard from '@/components/ShortcutCard/index.vue'
import { onMounted } from 'vue'
const shortcutList = ref([])

10
snowy-admin-web/src/views/index/components/userInfo.vue

@ -12,7 +12,7 @@
<span style="color: #6d737b; margin: 2px">{{ userInfo.orgName }} | {{ userInfo.positionName }}</span>
</div>
</div>
<span style="margin: 2px">
<span class="snowy-index-userinfo-time">
{{ currentTime }}
</span>
</div>
@ -43,4 +43,12 @@
flex-direction: column;
justify-content: center;
}
.snowy-index-userinfo-time {
margin: 2px
}
@media (max-width: 992px) {
.snowy-index-userinfo-time {
display: none;
}
}
</style>

23
snowy-admin-web/src/views/index/index.vue

@ -1,18 +1,18 @@
<template>
<a-row :gutter="10">
<a-col :span="16">
<a-col :span="16" :xs="24" :sm="24" :md="24" :lg="16" :xl="16">
<userInfo class="mb-2" />
<shortcut class="mb-2" />
<a-row :gutter="10">
<a-col :span="12">
<a-col :span="12" :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
<visLog class="mb-2" />
</a-col>
<a-col :span="12">
<a-col :span="12" :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
<opLog class="mb-2" />
</a-col>
</a-row>
</a-col>
<a-col :span="8">
<a-col :span="8" :xs="24" :sm="24" :md="24" :lg="8" :xl="8">
<carousel class="mb-2" />
<schedule class="mb-2" />
<miniMessage class="mb-2" />
@ -21,12 +21,11 @@
</template>
<script setup name="indexHome">
import shortcutCard from '@/components/ShortcutCard/index.vue'
import userInfo from './components/userInfo.vue'
import shortcut from './components/shortcut.vue'
import schedule from './components/schedule.vue'
import miniMessage from './components/miniMessage.vue'
import carousel from './components/carousel.vue'
import visLog from './components/visLog.vue'
import opLog from './components/opLog.vue'
import UserInfo from './components/userInfo.vue'
import Shortcut from './components/shortcut.vue'
import Schedule from './components/schedule.vue'
import MiniMessage from './components/miniMessage.vue'
import Carousel from './components/carousel.vue'
import VisLog from './components/visLog.vue'
import OpLog from './components/opLog.vue'
</script>

6
snowy-admin-web/src/views/sys/user/index.vue

@ -1,7 +1,7 @@
<template>
<a-row>
<a-col :span="5">
<a-card class="cardImp" :bordered="false" :loading="cardLoading">
<a-col :xs="24" :sm="24" :md="24" :lg="5" :xl="5">
<a-card class="cardImp mb-3" :bordered="false" :loading="cardLoading">
<a-tree
v-if="treeData.length > 0"
v-model:expandedKeys="defaultExpandedKeys"
@ -13,7 +13,7 @@
<a-empty v-else :image="Empty.PRESENTED_IMAGE_SIMPLE" />
</a-card>
</a-col>
<a-col :span="19">
<a-col :xs="24" :sm="24" :md="24" :lg="19" :xl="19">
<a-card :bordered="false" style="margin-bottom: 10px">
<a-form ref="searchFormRef" name="advanced_search" class="ant-advanced-search-form" :model="searchFormState">
<a-row :gutter="24">

7
snowy-admin-web/src/views/sys/user/userCenter.vue

@ -1,6 +1,6 @@
<template>
<a-row :gutter="24">
<a-col :md="24" :lg="7" style="padding-right: 0px">
<a-row :gutter="10">
<a-col :xs="24" :sm="24" :md="7" :lg="7" :xl="7" class="mb-3">
<a-card :bordered="false">
<div class="account-center-avatarHolder">
<div class="avatar">
@ -32,8 +32,7 @@
</div>
</a-card>
</a-col>
<a-col :md="24" :lg="17">
<a-col :xs="24" :sm="24" :md="17" :lg="17" :xl="17">
<a-card
:bordered="false"
style="width: 100%"

Loading…
Cancel
Save