Compare commits
2 Commits
dd48806fcd
...
f06a136ea7
Author | SHA1 | Date |
---|---|---|
TimSpan | f06a136ea7 | |
TimSpan | e0d0e5a618 |
|
@ -24,30 +24,25 @@
|
||||||
</a-menu> -->
|
</a-menu> -->
|
||||||
<!-- 动态生成菜单项 -->
|
<!-- 动态生成菜单项 -->
|
||||||
<a-menu v-model:selectedKeys="selectedKeys" theme="light" mode="inline">
|
<a-menu v-model:selectedKeys="selectedKeys" theme="light" mode="inline">
|
||||||
<template v-for="route in menuRoutes">
|
<template v-for="route in staticRouter">
|
||||||
<!-- -->
|
<a-menu-item v-if="route.meta?.title === undefined && route.children">
|
||||||
<a-menu-item v-if="route.name === 'dashboard'">
|
|
||||||
<router-link :to="`${route.children[0].path}`">
|
<router-link :to="`${route.children[0].path}`">
|
||||||
<pie-chart-outlined />
|
<HomeOutlined v-if="route.name === 'dashboard'" />
|
||||||
<span>{{ route.meta?.title }}</span>
|
<InsuranceOutlined v-if="route.name === 'police'" />
|
||||||
|
<SoundOutlined v-if="route.name === 'law'" />
|
||||||
|
<ApartmentOutlined v-if="route.name === 'warning'" />
|
||||||
|
<span>{{ route?.children[0]?.meta?.title }}</span>
|
||||||
</router-link>
|
</router-link>
|
||||||
</a-menu-item>
|
</a-menu-item>
|
||||||
<a-sub-menu v-if="route.children && route.children.length && route?.name !== 'dashboard'" :key="route.path">
|
<a-sub-menu v-if="route.children && route.children.length && route?.meta?.title" :key="route.path">
|
||||||
<template #title>
|
<template #title>
|
||||||
<pie-chart-outlined />
|
<MailOutlined />
|
||||||
<span>{{ route.meta?.title }}</span>
|
<span>{{ route.meta?.title }}</span>
|
||||||
</template>
|
</template>
|
||||||
<a-menu-item v-for="child in route.children" :key="child.path">
|
<a-menu-item v-for="child in route.children" :key="child.path">
|
||||||
<router-link :to="`${route.path}${child.path}`">{{ child.meta?.title }}</router-link>
|
<router-link :to="`${route.path}/${child.path}`">{{ child.meta?.title }}</router-link>
|
||||||
</a-menu-item>
|
</a-menu-item>
|
||||||
</a-sub-menu>
|
</a-sub-menu>
|
||||||
<!-- -->
|
|
||||||
<a-menu-item v-if="!route.children">
|
|
||||||
<router-link :to="route.path">
|
|
||||||
<pie-chart-outlined />
|
|
||||||
<span>{{ route.meta?.title }}</span>
|
|
||||||
</router-link>
|
|
||||||
</a-menu-item>
|
|
||||||
</template>
|
</template>
|
||||||
</a-menu>
|
</a-menu>
|
||||||
</a-layout-sider>
|
</a-layout-sider>
|
||||||
|
@ -56,10 +51,14 @@
|
||||||
<layout-header v-model:collapsed="collapsed" />
|
<layout-header v-model:collapsed="collapsed" />
|
||||||
</a-layout-header>
|
</a-layout-header>
|
||||||
<a-layout-content class="layout-content">
|
<a-layout-content class="layout-content">
|
||||||
<router-view v-slot="{ Component, route }">
|
<!-- <keep-alive> 会缓存已经访问过的组件,当你再次访问同一个页面时,它会直接从缓存中加载,而不会触发重新渲染 -->
|
||||||
|
<!-- router-view 必须绑定一个key 否则就会出现 路由切换白屏的问题(路由切换后,页面不显示内容,刷新后正常显示),但是这样也会导致一个问题就是 会导致keep-alive失效、因为这种方式会强制刷新路由-->
|
||||||
|
|
||||||
|
<router-view v-slot="{ Component, route }" :key="route.path">
|
||||||
|
<!-- <router-view v-slot="{ Component, route }"> -->
|
||||||
<transition appear name="fade-transform" mode="out-in">
|
<transition appear name="fade-transform" mode="out-in">
|
||||||
<keep-alive :include="keepAliveNames">
|
<keep-alive :include="keepAliveNames">
|
||||||
<component :is="Component" :key="route.fullPath" />
|
<component :is="Component" :key="route.path" />
|
||||||
</keep-alive>
|
</keep-alive>
|
||||||
</transition>
|
</transition>
|
||||||
</router-view>
|
</router-view>
|
||||||
|
@ -69,9 +68,9 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import { InsuranceOutlined, HomeOutlined, SoundOutlined, MailOutlined, ApartmentOutlined, InboxOutlined, AppstoreOutlined } from '@ant-design/icons-vue'
|
||||||
import LayoutHeader from '@/components/layout/header/LayoutHeader.vue'
|
import LayoutHeader from '@/components/layout/header/LayoutHeader.vue'
|
||||||
import { computed } from 'vue'
|
import { computed } from 'vue'
|
||||||
// import Sliber from '@/components/layout/sliber/sliber.vue'
|
|
||||||
import { staticRouter } from '@/router/staticRouters'
|
import { staticRouter } from '@/router/staticRouters'
|
||||||
import { useRoute } from 'vue-router'
|
import { useRoute } from 'vue-router'
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
|
@ -81,7 +80,10 @@ const route = useRoute()
|
||||||
|
|
||||||
const selectedKeys = computed(() => [route.path])
|
const selectedKeys = computed(() => [route.path])
|
||||||
// 过滤出需要在菜单中显示的路由
|
// 过滤出需要在菜单中显示的路由
|
||||||
const menuRoutes = computed(() => staticRouter.filter((route) => route.meta && route.meta.title))
|
// const menuRoutes = computed(() => staticRouter.filter((route) => route.meta && route.meta.title))
|
||||||
|
// staticRouter.forEach((element) => {
|
||||||
|
// console.log(element.meta?.title)
|
||||||
|
// })
|
||||||
|
|
||||||
// 示例:动态控制缓存页面的名称
|
// 示例:动态控制缓存页面的名称
|
||||||
// const keepAliveNames = ref(['index'])
|
// const keepAliveNames = ref(['index'])
|
||||||
|
@ -90,7 +92,8 @@ import { ref } from 'vue'
|
||||||
// 控制菜单折叠
|
// 控制菜单折叠
|
||||||
const collapsed = ref<boolean>(false)
|
const collapsed = ref<boolean>(false)
|
||||||
|
|
||||||
const keepAliveNames = ref<string[]>([])
|
// const keepAliveNames = ref<string[]>(['Index', 'Register'])
|
||||||
|
const keepAliveNames = ref<string[]>(['index', 'rindex'])
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|
|
@ -15,7 +15,7 @@
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import { FormInstance, message, notification } from 'ant-design-vue'
|
import { FormInstance, notification } from 'ant-design-vue'
|
||||||
import { Rule } from 'ant-design-vue/es/form'
|
import { Rule } from 'ant-design-vue/es/form'
|
||||||
import { LoginParams } from '@/types/views/login.ts'
|
import { LoginParams } from '@/types/views/login.ts'
|
||||||
import api from '@/axios'
|
import api from '@/axios'
|
||||||
|
@ -24,7 +24,10 @@ import rsaUtil from '@/utils/rsaUtil.ts'
|
||||||
import { TokenInfo } from '@/types/stores/userStore.ts'
|
import { TokenInfo } from '@/types/stores/userStore.ts'
|
||||||
import { useUserStore } from '@/stores/modules/userStore.ts'
|
import { useUserStore } from '@/stores/modules/userStore.ts'
|
||||||
import { useRouter } from 'vue-router'
|
import { useRouter } from 'vue-router'
|
||||||
|
const props = defineProps<{
|
||||||
|
account: string
|
||||||
|
password: string
|
||||||
|
}>()
|
||||||
const userStore = useUserStore()
|
const userStore = useUserStore()
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
|
||||||
|
@ -47,9 +50,11 @@ const loginParamsRule: Record<keyof LoginParams, Rule[]> = {
|
||||||
],
|
],
|
||||||
}
|
}
|
||||||
const loginParams = ref<LoginParams>({
|
const loginParams = ref<LoginParams>({
|
||||||
accountOrTelephone: __APP_ENV.VITE_APP_ENV === 'development' ? 'ERwuf2' : '',
|
accountOrTelephone: __APP_ENV.VITE_APP_ENV === 'development' ? '' : '',
|
||||||
password: __APP_ENV.VITE_APP_ENV === 'development' ? '123456' : '',
|
password: __APP_ENV.VITE_APP_ENV === 'development' ? '' : '',
|
||||||
})
|
})
|
||||||
|
loginParams.value.accountOrTelephone = props.account
|
||||||
|
loginParams.value.password = props.password
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 登录
|
* 登录
|
||||||
|
|
|
@ -27,22 +27,19 @@ router.beforeEach(async (to, from, next) => {
|
||||||
return next(from.fullPath)
|
return next(from.fullPath)
|
||||||
}
|
}
|
||||||
//判断访问路径是不是白名单d
|
//判断访问路径是不是白名单d
|
||||||
console.log('访问路径', to.path);
|
// console.log('访问路径', to.path);
|
||||||
|
|
||||||
if (ROUTER_WHITE_LIST.includes(to.path)) {
|
if (ROUTER_WHITE_LIST.includes(to.path)) {
|
||||||
return next();
|
return next();
|
||||||
} else {
|
} else {
|
||||||
|
//不在白名单内需要查看是否携带token 没有token需要返回登录页进行登录
|
||||||
if (!userStore.getTokenInfo?.value) {
|
if (!userStore.getTokenInfo?.value) {
|
||||||
await message.warn('未找到token,请重新登陆!')
|
await message.warn('未找到token,请重新登陆!')
|
||||||
return next('/login');
|
return next('/login');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
//不在白名单内需要查看是否携带token 没有token需要返回登录页进行登录
|
|
||||||
// if (!userStore.getTokenInfo?.value) {
|
|
||||||
// await message.warn('未找到token,请重新登陆!')
|
|
||||||
// return next('/login');
|
|
||||||
// }
|
|
||||||
//放行
|
|
||||||
return next();
|
return next();
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
|
@ -5,19 +5,10 @@ export const Layout = () => import("@/components/layout/layout.vue");
|
||||||
export const staticRouter: RouteRecordRaw[] =
|
export const staticRouter: RouteRecordRaw[] =
|
||||||
[
|
[
|
||||||
{
|
{
|
||||||
path: "/",
|
path: '/',
|
||||||
name: "/",
|
|
||||||
component: Layout,
|
|
||||||
redirect: "/dashboard",
|
|
||||||
children: []
|
|
||||||
},
|
|
||||||
{
|
|
||||||
|
|
||||||
path: '',
|
|
||||||
name: 'dashboard',
|
name: 'dashboard',
|
||||||
redirect: '/index',
|
redirect: '/index',
|
||||||
meta: {
|
meta: {
|
||||||
title: '首页',
|
|
||||||
keepalive: true
|
keepalive: true
|
||||||
},
|
},
|
||||||
component: Layout,
|
component: Layout,
|
||||||
|
@ -39,45 +30,111 @@ export const staticRouter: RouteRecordRaw[] =
|
||||||
|
|
||||||
{
|
{
|
||||||
|
|
||||||
path: '',
|
path: '/query-',
|
||||||
name: 'register',
|
name: 'query-',
|
||||||
meta: {
|
meta: {
|
||||||
title: '注册',
|
title: '信息查询',
|
||||||
keepalive: true
|
keepalive: true
|
||||||
},
|
},
|
||||||
component: Layout,
|
component: Layout,
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
path: '/register', // 这里使用相对路径而不是 '/register'
|
path: 'public-unit', // 这里使用相对路径而不是 '/register'
|
||||||
name: '',
|
name: 'public-unit',
|
||||||
meta: {
|
meta: {
|
||||||
title: '注册',
|
|
||||||
|
title: '企事业单位',
|
||||||
keepalive: true
|
keepalive: true
|
||||||
},
|
},
|
||||||
component: () => import('@/views/register.vue')
|
component: () => import('@/views/query/publicUnit.vue')
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'weapp-user', // 这里使用相对路径而不是 '/register'
|
||||||
|
name: 'weapp-user',
|
||||||
|
meta: {
|
||||||
|
|
||||||
|
title: '微信小程序用户',
|
||||||
|
keepalive: true
|
||||||
|
},
|
||||||
|
component: () => import('@/views/query/weappUser.vue')
|
||||||
},
|
},
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
//登录页面
|
|
||||||
path: '/login',
|
path: '/login',
|
||||||
name: 'login',
|
name: 'login',
|
||||||
meta: {
|
meta: {
|
||||||
// title: '登录',
|
keepalive: true
|
||||||
// keepalive: true
|
|
||||||
},
|
},
|
||||||
component: () => import('@/views/login.vue')
|
component: () => import('@/views/login.vue')
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
//登录页面
|
|
||||||
path: '/register-index',
|
path: '/register-index',
|
||||||
name: 'register-index',
|
name: 'register-index',
|
||||||
meta: {
|
meta: {
|
||||||
// title: '注册',
|
|
||||||
},
|
},
|
||||||
component: () => import('@/views/register.vue')
|
component: () => import('@/views/register.vue')
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
||||||
|
{
|
||||||
|
path: '/law',
|
||||||
|
name: 'law',
|
||||||
|
meta: {
|
||||||
|
|
||||||
|
},
|
||||||
|
component: Layout,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
path: '/law-index',
|
||||||
|
name: 'law-index',
|
||||||
|
meta: {
|
||||||
|
title: '法制宣传',
|
||||||
|
keepalive: true
|
||||||
|
},
|
||||||
|
component: () => import('@/views/law/index.vue')
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/police',
|
||||||
|
name: 'police',
|
||||||
|
meta: {
|
||||||
|
|
||||||
|
},
|
||||||
|
component: Layout,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
path: '/police-presence',
|
||||||
|
name: 'police-presence',
|
||||||
|
meta: {
|
||||||
|
title: '警保风采',
|
||||||
|
keepalive: true
|
||||||
|
},
|
||||||
|
component: () => import('@/views/police/index.vue')
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/warning',
|
||||||
|
name: 'warning',
|
||||||
|
meta: {
|
||||||
|
|
||||||
|
},
|
||||||
|
component: Layout,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
path: '/early-warning',
|
||||||
|
name: 'early-warning',
|
||||||
|
meta: {
|
||||||
|
title: '三色预警',
|
||||||
|
keepalive: true
|
||||||
|
},
|
||||||
|
component: () => import('@/views/warning/index.vue')
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
]
|
]
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -1,6 +1,10 @@
|
||||||
<template><div>111111</div></template>
|
<template><div>111111</div></template>
|
||||||
|
|
||||||
<script setup lang="ts"></script>
|
<script setup lang="ts">
|
||||||
|
defineOptions({
|
||||||
|
name: 'Index',
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss"></style>
|
<style scoped lang="scss"></style>
|
||||||
<!-- <template>
|
<!-- <template>
|
||||||
|
|
|
@ -0,0 +1,9 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<!-- 法制宣传 -->
|
||||||
|
法制宣传
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts"></script>
|
||||||
|
|
|
@ -10,7 +10,7 @@
|
||||||
<div class="title">欢迎来到超级后台</div>
|
<div class="title">欢迎来到超级后台</div>
|
||||||
<a-tabs class="account-tab" v-model:active-key="activeKey">
|
<a-tabs class="account-tab" v-model:active-key="activeKey">
|
||||||
<a-tab-pane :key="0" tab="账号登录">
|
<a-tab-pane :key="0" tab="账号登录">
|
||||||
<TelephoneLogin />
|
<TelephoneLogin :account="account" :password="password" />
|
||||||
</a-tab-pane>
|
</a-tab-pane>
|
||||||
</a-tabs>
|
</a-tabs>
|
||||||
<div class="oauth">
|
<div class="oauth">
|
||||||
|
@ -38,8 +38,15 @@
|
||||||
import { QqOutlined, WechatOutlined } from '@ant-design/icons-vue'
|
import { QqOutlined, WechatOutlined } from '@ant-design/icons-vue'
|
||||||
import TelephoneLogin from '@/components/login/TelephoneLogin.vue'
|
import TelephoneLogin from '@/components/login/TelephoneLogin.vue'
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
|
import { useRoute } from 'vue-router'
|
||||||
|
const route = useRoute()
|
||||||
|
const account = ref<string>('')
|
||||||
|
const password = ref<string>('')
|
||||||
const activeKey = ref(0)
|
const activeKey = ref(0)
|
||||||
|
account.value = route.query.account as string
|
||||||
|
password.value = route.query.password as string
|
||||||
|
// console.log('Account:', account.value)
|
||||||
|
// console.log('Password:', password.value)
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|
|
@ -0,0 +1,8 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<!-- 警保风采 -->
|
||||||
|
警保风采
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts"></script>
|
|
@ -0,0 +1,8 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<!-- 企事业单位 -->
|
||||||
|
企事业单位
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts"></script>
|
|
@ -0,0 +1,8 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<!-- 微信小程序用户 -->
|
||||||
|
微信小程序用户
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts"></script>
|
|
@ -83,7 +83,10 @@ import { message } from 'ant-design-vue'
|
||||||
// import type { CascaderProps } from 'ant-design-vue';
|
// import type { CascaderProps } from 'ant-design-vue';
|
||||||
import api from '@/axios/index.ts'
|
import api from '@/axios/index.ts'
|
||||||
import type { ShowSearchType } from 'ant-design-vue/es/cascader'
|
import type { ShowSearchType } from 'ant-design-vue/es/cascader'
|
||||||
import { onMounted, reactive, ref } from 'vue'
|
import { onMounted, reactive, ref, defineComponent } from 'vue'
|
||||||
|
defineComponent({
|
||||||
|
name: 'Register',
|
||||||
|
})
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
getTree()
|
getTree()
|
||||||
})
|
})
|
||||||
|
@ -282,7 +285,8 @@ const isLogin = ref<boolean>(false)
|
||||||
// const searchCode = ref<string>()
|
// const searchCode = ref<string>()
|
||||||
//
|
//
|
||||||
const searchCode = reactive({
|
const searchCode = reactive({
|
||||||
code: __APP_ENV.VITE_APP_ENV === 'development' ? 'dawda' : '',
|
// dawda
|
||||||
|
code: __APP_ENV.VITE_APP_ENV === 'development' ? '' : '',
|
||||||
})
|
})
|
||||||
|
|
||||||
const getCheckStatus = () => {
|
const getCheckStatus = () => {
|
||||||
|
@ -304,6 +308,6 @@ const getCheckStatus = () => {
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
const toLogin = () => {
|
const toLogin = () => {
|
||||||
router.replace({ path: '/login' })
|
router.replace({ path: '/login', query: { password: password.value, account: account.value } })
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -0,0 +1,8 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<!-- 三色预警 -->
|
||||||
|
三色预警
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts"></script>
|
Loading…
Reference in New Issue