feat: router
parent
c9ad9cfc5b
commit
e89fe32f3a
|
|
@ -73,8 +73,5 @@ export const sendSmsApi = (data: SendSmsReqVO) => {
|
||||||
|
|
||||||
// 导出短信模板
|
// 导出短信模板
|
||||||
export const exportPostApi = (params: SmsTemplateExportReqVO) => {
|
export const exportPostApi = (params: SmsTemplateExportReqVO) => {
|
||||||
return defHttp.download({
|
return defHttp.download({ url: '/system/sms-template/export-excel', params })
|
||||||
url: '/system/sms-template/export-excel',
|
|
||||||
params
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -55,7 +55,7 @@
|
||||||
import { computed, unref, ref, watch, nextTick } from 'vue'
|
import { computed, unref, ref, watch, nextTick } from 'vue'
|
||||||
import { SearchOutlined } from '@ant-design/icons-vue'
|
import { SearchOutlined } from '@ant-design/icons-vue'
|
||||||
import AppSearchFooter from './AppSearchFooter.vue'
|
import AppSearchFooter from './AppSearchFooter.vue'
|
||||||
import Icon from '@/components/Icon'
|
import { Icon } from '@/components/Icon'
|
||||||
import vClickOutside from '@/directives/clickOutside'
|
import vClickOutside from '@/directives/clickOutside'
|
||||||
import { useDesign } from '@/hooks/web/useDesign'
|
import { useDesign } from '@/hooks/web/useDesign'
|
||||||
import { useRefs } from '@/hooks/core/useRefs'
|
import { useRefs } from '@/hooks/core/useRefs'
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,7 @@
|
||||||
<script lang="ts" setup name="AButton" extends="Button" indeterminate="false">
|
<script lang="ts" setup name="AButton" extends="Button" indeterminate="false">
|
||||||
import { Button } from 'ant-design-vue'
|
import { Button } from 'ant-design-vue'
|
||||||
import { computed, unref } from 'vue'
|
import { computed, unref } from 'vue'
|
||||||
import Icon from '@/components/Icon/src/Icon.vue'
|
import { Icon } from '@/components/Icon'
|
||||||
import { buttonProps } from './props'
|
import { buttonProps } from './props'
|
||||||
import { useAttrs } from '@/hooks/core/useAttrs'
|
import { useAttrs } from '@/hooks/core/useAttrs'
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
import type { ContextMenuItem, ItemContentProps, Axis } from './typing'
|
import type { ContextMenuItem, ItemContentProps, Axis } from './typing'
|
||||||
import type { FunctionalComponent, CSSProperties } from 'vue'
|
import type { FunctionalComponent, CSSProperties } from 'vue'
|
||||||
import { defineComponent, nextTick, onMounted, computed, ref, unref, onUnmounted } from 'vue'
|
import { defineComponent, nextTick, onMounted, computed, ref, unref, onUnmounted } from 'vue'
|
||||||
import Icon from '@/components/Icon'
|
import { Icon } from '@/components/Icon'
|
||||||
import { Menu, Divider } from 'ant-design-vue'
|
import { Menu, Divider } from 'ant-design-vue'
|
||||||
|
|
||||||
const prefixCls = 'context-menu'
|
const prefixCls = 'context-menu'
|
||||||
|
|
|
||||||
|
|
@ -21,7 +21,7 @@ import { useModal } from '@/components/Modal'
|
||||||
import { useMessage } from '@/hooks/web/useMessage'
|
import { useMessage } from '@/hooks/web/useMessage'
|
||||||
import { useI18n } from '@/hooks/web/useI18n'
|
import { useI18n } from '@/hooks/web/useI18n'
|
||||||
import type { ButtonProps } from '@/components/Button'
|
import type { ButtonProps } from '@/components/Button'
|
||||||
import Icon from '@/components/Icon'
|
import { Icon } from '@/components/Icon'
|
||||||
|
|
||||||
const emit = defineEmits(['update:value', 'change'])
|
const emit = defineEmits(['update:value', 'change'])
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup name="MenuItemContent">
|
<script lang="ts" setup name="MenuItemContent">
|
||||||
import { computed } from 'vue'
|
import { computed } from 'vue'
|
||||||
import Icon from '@/components/Icon'
|
import { Icon } from '@/components/Icon'
|
||||||
import { useI18n } from '@/hooks/web/useI18n'
|
import { useI18n } from '@/hooks/web/useI18n'
|
||||||
import { useDesign } from '@/hooks/web/useDesign'
|
import { useDesign } from '@/hooks/web/useDesign'
|
||||||
import { contentProps } from '../props'
|
import { contentProps } from '../props'
|
||||||
|
|
|
||||||
|
|
@ -3,7 +3,7 @@
|
||||||
<div
|
<div
|
||||||
ref="wrap"
|
ref="wrap"
|
||||||
:class="[wrapClass, 'scrollbar__wrap', native ? '' : 'scrollbar__wrap--hidden-default']"
|
:class="[wrapClass, 'scrollbar__wrap', native ? '' : 'scrollbar__wrap--hidden-default']"
|
||||||
:style="style"
|
:style="style as any"
|
||||||
@scroll="handleScroll"
|
@scroll="handleScroll"
|
||||||
>
|
>
|
||||||
<component :is="tag" ref="resize" :class="['scrollbar__view', viewClass]" :style="viewStyle">
|
<component :is="tag" ref="resize" :class="['scrollbar__view', viewClass]" :style="viewStyle">
|
||||||
|
|
|
||||||
|
|
@ -38,7 +38,7 @@
|
||||||
import type { Menu } from '@/router/types'
|
import type { Menu } from '@/router/types'
|
||||||
import { computed } from 'vue'
|
import { computed } from 'vue'
|
||||||
import { useDesign } from '@/hooks/web/useDesign'
|
import { useDesign } from '@/hooks/web/useDesign'
|
||||||
import Icon from '@/components/Icon'
|
import { Icon } from '@/components/Icon'
|
||||||
|
|
||||||
import MenuItem from './components/MenuItem.vue'
|
import MenuItem from './components/MenuItem.vue'
|
||||||
import SubMenu from './components/SubMenuItem.vue'
|
import SubMenu from './components/SubMenuItem.vue'
|
||||||
|
|
|
||||||
|
|
@ -54,7 +54,7 @@ import { propTypes } from '@/utils/propTypes'
|
||||||
import { useMenuItem } from './useMenu'
|
import { useMenuItem } from './useMenu'
|
||||||
import { useSimpleRootMenuContext } from './useSimpleMenuContext'
|
import { useSimpleRootMenuContext } from './useSimpleMenuContext'
|
||||||
import { CollapseTransition } from '@/components/Transition'
|
import { CollapseTransition } from '@/components/Transition'
|
||||||
import Icon from '@/components/Icon'
|
import { Icon } from '@/components/Icon'
|
||||||
import { Popover } from 'ant-design-vue'
|
import { Popover } from 'ant-design-vue'
|
||||||
import { isBoolean, isObject } from '@/utils/is'
|
import { isBoolean, isObject } from '@/utils/is'
|
||||||
import mitt from '@/utils/mitt'
|
import mitt from '@/utils/mitt'
|
||||||
|
|
|
||||||
|
|
@ -25,7 +25,7 @@
|
||||||
import { computed, toRaw, unref } from 'vue'
|
import { computed, toRaw, unref } from 'vue'
|
||||||
import { MoreOutlined } from '@ant-design/icons-vue'
|
import { MoreOutlined } from '@ant-design/icons-vue'
|
||||||
import { Divider, Tooltip, TooltipProps } from 'ant-design-vue'
|
import { Divider, Tooltip, TooltipProps } from 'ant-design-vue'
|
||||||
import Icon from '@/components/Icon'
|
import { Icon } from '@/components/Icon'
|
||||||
import { ActionItem, TableActionType } from '@/components/Table'
|
import { ActionItem, TableActionType } from '@/components/Table'
|
||||||
import { PopConfirmButton } from '@/components/Button'
|
import { PopConfirmButton } from '@/components/Button'
|
||||||
import { Dropdown } from '@/components/Dropdown'
|
import { Dropdown } from '@/components/Dropdown'
|
||||||
|
|
|
||||||
|
|
@ -17,27 +17,24 @@
|
||||||
import type { RouteLocationMatched } from 'vue-router'
|
import type { RouteLocationMatched } from 'vue-router'
|
||||||
import { useRouter } from 'vue-router'
|
import { useRouter } from 'vue-router'
|
||||||
import type { Menu } from '@/router/types'
|
import type { Menu } from '@/router/types'
|
||||||
|
|
||||||
import { ref, watchEffect } from 'vue'
|
import { ref, watchEffect } from 'vue'
|
||||||
|
|
||||||
import { Breadcrumb } from 'ant-design-vue'
|
import { Breadcrumb } from 'ant-design-vue'
|
||||||
import Icon from '@/components/Icon'
|
|
||||||
|
|
||||||
import { useDesign } from '@/hooks/web/useDesign'
|
import { useDesign } from '@/hooks/web/useDesign'
|
||||||
import { useRootSetting } from '@/hooks/setting/useRootSetting'
|
import { useRootSetting } from '@/hooks/setting/useRootSetting'
|
||||||
import { useGo } from '@/hooks/web/usePage'
|
import { useGo } from '@/hooks/web/usePage'
|
||||||
import { useI18n } from '@/hooks/web/useI18n'
|
import { useI18n } from '@/hooks/web/useI18n'
|
||||||
|
|
||||||
import { propTypes } from '@/utils/propTypes'
|
import { propTypes } from '@/utils/propTypes'
|
||||||
import { isString } from '@/utils/is'
|
import { isString } from '@/utils/is'
|
||||||
import { filter } from '@/utils/helper/treeHelper'
|
import { filter } from '@/utils/helper/treeHelper'
|
||||||
import { getMenus } from '@/router/menus'
|
import { getMenus } from '@/router/menus'
|
||||||
|
|
||||||
import { REDIRECT_NAME } from '@/router/constant'
|
import { REDIRECT_NAME } from '@/router/constant'
|
||||||
import { getAllParentPath } from '@/router/helper/menuHelper'
|
import { getAllParentPath } from '@/router/helper/menuHelper'
|
||||||
|
import { Icon } from '@/components/Icon'
|
||||||
|
|
||||||
defineProps({
|
defineProps({
|
||||||
theme: propTypes.oneOf(['dark', 'light'])
|
theme: propTypes.oneOf(['dark', 'light'])
|
||||||
})
|
})
|
||||||
|
|
||||||
const routes = ref<RouteLocationMatched[]>([])
|
const routes = ref<RouteLocationMatched[]>([])
|
||||||
const { currentRoute } = useRouter()
|
const { currentRoute } = useRouter()
|
||||||
const { prefixCls } = useDesign('layout-breadcrumb')
|
const { prefixCls } = useDesign('layout-breadcrumb')
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,7 @@
|
||||||
<script lang="ts" setup name="ErrorAction">
|
<script lang="ts" setup name="ErrorAction">
|
||||||
import { computed } from 'vue'
|
import { computed } from 'vue'
|
||||||
import { Tooltip, Badge } from 'ant-design-vue'
|
import { Tooltip, Badge } from 'ant-design-vue'
|
||||||
import Icon from '@/components/Icon'
|
import { Icon } from '@/components/Icon'
|
||||||
|
|
||||||
import { useI18n } from '@/hooks/web/useI18n'
|
import { useI18n } from '@/hooks/web/useI18n'
|
||||||
import { useErrorLogStore } from '@/store/modules/errorLog'
|
import { useErrorLogStore } from '@/store/modules/errorLog'
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,7 @@
|
||||||
import { MenuItem } from 'ant-design-vue'
|
import { MenuItem } from 'ant-design-vue'
|
||||||
import { computed, getCurrentInstance } from 'vue'
|
import { computed, getCurrentInstance } from 'vue'
|
||||||
|
|
||||||
import Icon from '@/components/Icon'
|
import { Icon } from '@/components/Icon'
|
||||||
import { propTypes } from '@/utils/propTypes'
|
import { propTypes } from '@/utils/propTypes'
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
|
|
|
||||||
|
|
@ -4,13 +4,14 @@
|
||||||
<img :class="`${prefixCls}__header`" :src="getUserInfo.avatar" />
|
<img :class="`${prefixCls}__header`" :src="getUserInfo.avatar" />
|
||||||
<span :class="`${prefixCls}__info hidden md:block`">
|
<span :class="`${prefixCls}__info hidden md:block`">
|
||||||
<span :class="`${prefixCls}__name `" class="truncate">
|
<span :class="`${prefixCls}__name `" class="truncate">
|
||||||
{{ getUserInfo.realName }}
|
{{ getUserInfo.nickname }}
|
||||||
</span>
|
</span>
|
||||||
</span>
|
</span>
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
<template #overlay>
|
<template #overlay>
|
||||||
<Menu @click="handleMenuClick">
|
<Menu @click="handleMenuClick">
|
||||||
|
<MenuItem key="profile" :text="t('layout.header.accountCenter')" icon="ion:person-outline" />
|
||||||
<MenuItem key="doc" :text="t('layout.header.dropdownItemDoc')" icon="ion:document-text-outline" v-if="getShowDoc" />
|
<MenuItem key="doc" :text="t('layout.header.dropdownItemDoc')" icon="ion:document-text-outline" v-if="getShowDoc" />
|
||||||
<MenuDivider v-if="getShowDoc" />
|
<MenuDivider v-if="getShowDoc" />
|
||||||
<MenuItem v-if="getUseLockPage" key="lock" :text="t('layout.header.tooltipLock')" icon="ion:lock-closed-outline" />
|
<MenuItem v-if="getUseLockPage" key="lock" :text="t('layout.header.tooltipLock')" icon="ion:lock-closed-outline" />
|
||||||
|
|
@ -20,43 +21,40 @@
|
||||||
</Dropdown>
|
</Dropdown>
|
||||||
<LockAction @register="register" />
|
<LockAction @register="register" />
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup name="UserDropdown">
|
<script setup lang="ts" name="UserDropdown">
|
||||||
// components
|
import { Dropdown, Menu, MenuDivider } from 'ant-design-vue'
|
||||||
import { Dropdown, Menu } from 'ant-design-vue'
|
|
||||||
import type { MenuInfo } from 'ant-design-vue/lib/menu/src/interface'
|
import type { MenuInfo } from 'ant-design-vue/lib/menu/src/interface'
|
||||||
|
|
||||||
import { computed } from 'vue'
|
import { computed } from 'vue'
|
||||||
|
|
||||||
import { DOC_URL } from '@/settings/siteSetting'
|
import { DOC_URL } from '@/settings/siteSetting'
|
||||||
|
|
||||||
import { useUserStore } from '@/store/modules/user'
|
import { useUserStore } from '@/store/modules/user'
|
||||||
import { useHeaderSetting } from '@/hooks/setting/useHeaderSetting'
|
import { useHeaderSetting } from '@/hooks/setting/useHeaderSetting'
|
||||||
import { useI18n } from '@/hooks/web/useI18n'
|
import { useI18n } from '@/hooks/web/useI18n'
|
||||||
import { useDesign } from '@/hooks/web/useDesign'
|
import { useDesign } from '@/hooks/web/useDesign'
|
||||||
import { useModal } from '@/components/Modal'
|
import { useModal } from '@/components/Modal'
|
||||||
|
|
||||||
import headerImg from '@/assets/images/header.jpg'
|
import headerImg from '@/assets/images/header.jpg'
|
||||||
import { propTypes } from '@/utils/propTypes'
|
import { propTypes } from '@/utils/propTypes'
|
||||||
import { openWindow } from '@/utils'
|
import { openWindow } from '@/utils'
|
||||||
|
import { useGo } from '@/hooks/web/usePage'
|
||||||
import { createAsyncComponent } from '@/utils/factory/createAsyncComponent'
|
import { createAsyncComponent } from '@/utils/factory/createAsyncComponent'
|
||||||
|
const go = useGo()
|
||||||
|
|
||||||
|
type MenuEvent = 'profile' | 'logout' | 'doc' | 'lock'
|
||||||
|
|
||||||
const MenuItem = createAsyncComponent(() => import('./DropMenuItem.vue'))
|
const MenuItem = createAsyncComponent(() => import('./DropMenuItem.vue'))
|
||||||
const LockAction = createAsyncComponent(() => import('../lock/LockModal.vue'))
|
const LockAction = createAsyncComponent(() => import('../lock/LockModal.vue'))
|
||||||
const MenuDivider = Menu.Divider
|
|
||||||
type MenuEvent = 'logout' | 'doc' | 'lock'
|
|
||||||
|
|
||||||
defineProps({
|
defineProps({
|
||||||
theme: propTypes.oneOf(['dark', 'light'])
|
theme: propTypes.oneOf(['dark', 'light'])
|
||||||
})
|
})
|
||||||
|
|
||||||
const { prefixCls } = useDesign('header-user-dropdown')
|
const { prefixCls } = useDesign('header-user-dropdown')
|
||||||
const { t } = useI18n()
|
const { t } = useI18n()
|
||||||
const { getShowDoc, getUseLockPage } = useHeaderSetting()
|
const { getShowDoc, getUseLockPage } = useHeaderSetting()
|
||||||
const userStore = useUserStore()
|
const userStore = useUserStore()
|
||||||
|
|
||||||
const getUserInfo = computed(() => {
|
const getUserInfo = computed(() => {
|
||||||
const { realName = '', avatar, desc } = userStore.getUserInfo || {}
|
const { nickname = '', avatar } = userStore.getUserInfo.user || {}
|
||||||
return { realName, avatar: avatar || headerImg, desc }
|
return { nickname, avatar: avatar || headerImg }
|
||||||
})
|
})
|
||||||
|
|
||||||
const [register, { openModal }] = useModal()
|
const [register, { openModal }] = useModal()
|
||||||
|
|
@ -75,8 +73,15 @@ function openDoc() {
|
||||||
openWindow(DOC_URL)
|
openWindow(DOC_URL)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function openProfile() {
|
||||||
|
go('/profile/index')
|
||||||
|
}
|
||||||
|
|
||||||
function handleMenuClick(e: MenuInfo) {
|
function handleMenuClick(e: MenuInfo) {
|
||||||
switch (e.key as MenuEvent) {
|
switch (e.key as MenuEvent) {
|
||||||
|
case 'profile':
|
||||||
|
openProfile()
|
||||||
|
break
|
||||||
case 'logout':
|
case 'logout':
|
||||||
handleLoginOut()
|
handleLoginOut()
|
||||||
break
|
break
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup name="SettingButton">
|
<script lang="ts" setup name="SettingButton">
|
||||||
import SettingDrawer from './SettingDrawer'
|
import SettingDrawer from './SettingDrawer'
|
||||||
import Icon from '@/components/Icon'
|
import { Icon } from '@/components/Icon'
|
||||||
|
|
||||||
import { useDrawer } from '@/components/Drawer'
|
import { useDrawer } from '@/components/Drawer'
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -79,7 +79,7 @@ const getWrapClass = computed(() => {
|
||||||
|
|
||||||
listenerRouteChange((route) => {
|
listenerRouteChange((route) => {
|
||||||
const { name } = route
|
const { name } = route
|
||||||
if (name === REDIRECT_NAME || !route || !userStore.getToken) {
|
if (name === REDIRECT_NAME || !route || !userStore.getAccessToken) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -84,9 +84,9 @@ export class VAxios {
|
||||||
|
|
||||||
const axiosCanceler = new AxiosCanceler()
|
const axiosCanceler = new AxiosCanceler()
|
||||||
|
|
||||||
// Request interceptor configuration processing
|
// 请求拦截器配置处理
|
||||||
this.axiosInstance.interceptors.request.use((config: InternalAxiosRequestConfig) => {
|
this.axiosInstance.interceptors.request.use((config: InternalAxiosRequestConfig) => {
|
||||||
// If cancel repeat request is turned on, then cancel repeat request is prohibited
|
// 如果开启取消重复请求,则禁止取消重复请求
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
const { ignoreCancelToken } = config.requestOptions
|
const { ignoreCancelToken } = config.requestOptions
|
||||||
const ignoreCancel = ignoreCancelToken !== undefined ? ignoreCancelToken : this.options.requestOptions?.ignoreCancelToken
|
const ignoreCancel = ignoreCancelToken !== undefined ? ignoreCancelToken : this.options.requestOptions?.ignoreCancelToken
|
||||||
|
|
|
||||||
|
|
@ -26,9 +26,9 @@
|
||||||
<div :class="`${prefixCls}-entry`" v-show="!showDate">
|
<div :class="`${prefixCls}-entry`" v-show="!showDate">
|
||||||
<div :class="`${prefixCls}-entry-content`">
|
<div :class="`${prefixCls}-entry-content`">
|
||||||
<div :class="`${prefixCls}-entry__header enter-x`">
|
<div :class="`${prefixCls}-entry__header enter-x`">
|
||||||
<img :src="userinfo.avatar || headerImg" :class="`${prefixCls}-entry__header-img`" />
|
<img :src="userinfo.user.avatar || headerImg" :class="`${prefixCls}-entry__header-img`" />
|
||||||
<p :class="`${prefixCls}-entry__header-name`">
|
<p :class="`${prefixCls}-entry__header-name`">
|
||||||
{{ userinfo.realName }}
|
{{ userinfo.user.nickname }}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<InputPassword :placeholder="t('sys.lock.placeholder')" class="enter-x" v-model:value="password" />
|
<InputPassword :placeholder="t('sys.lock.placeholder')" class="enter-x" v-model:value="password" />
|
||||||
|
|
@ -58,7 +58,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script setup lang="ts">
|
||||||
import { ref, computed } from 'vue'
|
import { ref, computed } from 'vue'
|
||||||
import { Input } from 'ant-design-vue'
|
import { Input } from 'ant-design-vue'
|
||||||
import { useUserStore } from '@/store/modules/user'
|
import { useUserStore } from '@/store/modules/user'
|
||||||
|
|
|
||||||
|
|
@ -24,6 +24,7 @@
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { List } from 'ant-design-vue'
|
import { List } from 'ant-design-vue'
|
||||||
|
import { Icon } from '@/components/Icon'
|
||||||
import { CollapseContainer } from '@/components/Container/index'
|
import { CollapseContainer } from '@/components/Container/index'
|
||||||
import { accountBindList } from './data'
|
import { accountBindList } from './data'
|
||||||
import { getUserProfileApi } from '@/api/base/profile'
|
import { getUserProfileApi } from '@/api/base/profile'
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue