mirrors2/naive-ui-admin
1
0
Fork 0
mirror of https://github.com/jekip/naive-ui-admin.git synced 2026-02-17 11:42:27 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: 优化部分无用代码及升级ui版本 🚀

Browse Source
This commit is contained in:
山人自有妙计
2022-03-12 18:22:28 +08:00
parent 6558e1597c
commit 12e62d1179
15 changed files with 964 additions and 962 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@@ -38,7 +38,7 @@
"lodash-es": "^4.17.21", "lodash-es": "^4.17.21",
"mitt": "^2.1.0", "mitt": "^2.1.0",
"mockjs": "^1.1.0", "mockjs": "^1.1.0",
"naive-ui": "^2.25.2", "naive-ui": "^2.26.4",
"pinia": "^2.0.11", "pinia": "^2.0.11",
"qs": "^6.10.3", "qs": "^6.10.3",
"vfonts": "^0.1.0", "vfonts": "^0.1.0",

2
src/App.vue
View File

@@ -18,7 +18,7 @@
<script lang="ts" setup> <script lang="ts" setup>
import { computed, onMounted, onUnmounted } from 'vue'; import { computed, onMounted, onUnmounted } from 'vue';
import { zhCN, dateZhCN, createTheme, inputDark, datePickerDark, darkTheme } from 'naive-ui'; import { zhCN, dateZhCN, darkTheme } from 'naive-ui';
import { LockScreen } from '@/components/Lockscreen'; import { LockScreen } from '@/components/Lockscreen';
import { AppProvider } from '@/components/Application'; import { AppProvider } from '@/components/Application';
import { useLockscreenStore } from '@/store/modules/lockscreen'; import { useLockscreenStore } from '@/store/modules/lockscreen';

2
src/components/Modal/src/basicModal.vue
View File

@@ -93,7 +93,7 @@
function handleSubmit() { function handleSubmit() {
subLoading.value = true; subLoading.value = true;
console.log(subLoading.value) console.log(subLoading.value);
emit('on-ok'); emit('on-ok');
} }

1
src/components/Modal/src/hooks/useModal.ts
View File

@@ -4,7 +4,6 @@ import { ModalMethods, UseModalReturnType } from '../type';
import { getDynamicProps } from '@/utils'; import { getDynamicProps } from '@/utils';
import { tryOnUnmounted } from '@vueuse/core'; import { tryOnUnmounted } from '@vueuse/core';
export function useModal(props): UseModalReturnType { export function useModal(props): UseModalReturnType {
const modalRef = ref<Nullable<ModalMethods>>(null); const modalRef = ref<Nullable<ModalMethods>>(null);
const currentInstance = getCurrentInstance(); const currentInstance = getCurrentInstance();

4
src/components/Modal/src/type/index.ts
View File

@@ -12,8 +12,8 @@ export interface ModalMethods {
/** /**
* 支持修改，DialogOptions 參數 * 支持修改，DialogOptions 參數
*/ */
export interface ModalProps extends DialogOptions { } export type ModalProps = DialogOptions;
export type RegisterFn = (ModalInstance: ModalMethods) => void; export type RegisterFn = (ModalInstance: ModalMethods) => void;
export type UseModalReturnType = [RegisterFn, ModalMethods]; export type UseModalReturnType = [RegisterFn, ModalMethods];

182
src/components/Table/src/components/editable/EditableCell.vue
View File

@@ -317,103 +317,103 @@
function initCbs(cbs: 'submitCbs' | 'validCbs' | 'cancelCbs', handle: Fn) { function initCbs(cbs: 'submitCbs' | 'validCbs' | 'cancelCbs', handle: Fn) {
if (props.record) { if (props.record) {
/* eslint-disable */ /* eslint-disable */
isArray(props.record[cbs]) isArray(props.record[cbs])
? props.record[cbs]?.push(handle) ? props.record[cbs]?.push(handle)
: (props.record[cbs] = [handle]); : (props.record[cbs] = [handle]);
} }
}
if (props.record) {
initCbs('submitCbs', handleSubmit);
initCbs('validCbs', handleSubmiRule);
initCbs('cancelCbs', handleCancel);
if (props.column.key) {
if (!props.record.editValueRefs) props.record.editValueRefs = {};
props.record.editValueRefs[props.column.key] = currentValueRef;
}
/* eslint-disable */
props.record.onCancelEdit = () => {
isArray(props.record?.cancelCbs) && props.record?.cancelCbs.forEach((fn) => fn());
};
/* eslint-disable */
props.record.onSubmitEdit = async() => {
if (isArray(props.record?.submitCbs)) {
const validFns = (props.record?.validCbs || []).map((fn) => fn());
const res = await Promise.all(validFns);
const pass = res.every((item) => !!item);
if (!pass) return;
const submitFns = props.record?.submitCbs || [];
submitFns.forEach((fn) => fn(false, false));
table.emit?.('edit-row-end');
return true;
} }
};
}
return { if (props.record) {
isEdit, initCbs('submitCbs', handleSubmit);
handleEdit, initCbs('validCbs', handleSubmiRule);
currentValueRef, initCbs('cancelCbs', handleCancel);
handleSubmit,
handleChange, if (props.column.key) {
handleCancel, if (!props.record.editValueRefs) props.record.editValueRefs = {};
elRef, props.record.editValueRefs[props.column.key] = currentValueRef;
getComponent, }
getRule, /* eslint-disable */
onClickOutside, props.record.onCancelEdit = () => {
ruleMessage, isArray(props.record?.cancelCbs) && props.record?.cancelCbs.forEach((fn) => fn());
getRuleVisible, };
getComponentProps, /* eslint-disable */
handleOptionsChange, props.record.onSubmitEdit = async () => {
getWrapperClass, if (isArray(props.record?.submitCbs)) {
getRowEditable, const validFns = (props.record?.validCbs || []).map((fn) => fn());
getValues,
handleEnter, const res = await Promise.all(validFns);
// getSize,
}; const pass = res.every((item) => !!item);
},
if (!pass) return;
const submitFns = props.record?.submitCbs || [];
submitFns.forEach((fn) => fn(false, false));
table.emit?.('edit-row-end');
return true;
}
};
}
return {
isEdit,
handleEdit,
currentValueRef,
handleSubmit,
handleChange,
handleCancel,
elRef,
getComponent,
getRule,
onClickOutside,
ruleMessage,
getRuleVisible,
getComponentProps,
handleOptionsChange,
getWrapperClass,
getRowEditable,
getValues,
handleEnter,
// getSize,
};
},
}); });
</script> </script>
<style lang="less"> <style lang="less">
.editable-cell { .editable-cell {
&-content { &-content {
position: relative; position: relative;
overflow-wrap: break-word; overflow-wrap: break-word;
word-break: break-word; word-break: break-word;
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
&-comp{ &-comp {
flex: 1; flex: 1;
}
.edit-icon {
font-size: 14px;
//position: absolute;
//top: 4px;
//right: 0;
display: none;
width: 20px;
cursor: pointer;
}
&:hover {
.edit-icon {
display: inline-block;
}
}
}
&-action {
display: flex;
align-items: center;
justify-content: center;
}
} }
.edit-icon {
font-size: 14px;
//position: absolute;
//top: 4px;
//right: 0;
display: none;
width: 20px;
cursor: pointer;
}
&:hover {
.edit-icon {
display: inline-block;
}
}
}
&-action {
display: flex;
align-items: center;
justify-content: center;
}
}
</style> </style>

1
src/layout/components/Header/ProjectSetting.vue
View File

@@ -359,6 +359,7 @@
margin: 0 5px 5px 0; margin: 0 5px 5px 0;
text-align: center; text-align: center;
line-height: 14px; line-height: 14px;
.n-icon { .n-icon {
color: #fff; color: #fff;
} }

264
src/layout/components/Menu/index.vue
View File

@@ -15,153 +15,153 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, ref, onMounted, reactive, computed, watch, toRefs, unref } from 'vue'; import { defineComponent, ref, onMounted, reactive, computed, watch, toRefs, unref } from 'vue';
import { useRoute, useRouter } from 'vue-router'; import { useRoute, useRouter } from 'vue-router';
import { useAsyncRouteStore } from '@/store/modules/asyncRoute'; import { useAsyncRouteStore } from '@/store/modules/asyncRoute';
import { generatorMenu, generatorMenuMix } from '@/utils'; import { generatorMenu, generatorMenuMix } from '@/utils';
import { useProjectSettingStore } from '@/store/modules/projectSetting'; import { useProjectSettingStore } from '@/store/modules/projectSetting';
import { useProjectSetting } from '@/hooks/setting/useProjectSetting'; import { useProjectSetting } from '@/hooks/setting/useProjectSetting';
export default defineComponent({ export default defineComponent({
name: 'Menu', name: 'Menu',
components: {}, components: {},
props: { props: {
mode: { mode: {
// 菜单模式 // 菜单模式
type: String, type: String,
default: 'vertical', default: 'vertical',
},
collapsed: {
// 侧边栏菜单是否收起
type: Boolean,
},
//位置
location: {
type: String,
default: 'left',
},
}, },
collapsed: { emits: ['update:collapsed'],
// 侧边栏菜单是否收起 setup(props, { emit }) {
type: Boolean, // 当前路由
}, const currentRoute = useRoute();
//位置 const router = useRouter();
location: { const asyncRouteStore = useAsyncRouteStore();
type: String, const settingStore = useProjectSettingStore();
default: 'left', const menus = ref<any[]>([]);
}, const selectedKeys = ref<string>(currentRoute.name as string);
}, const headerMenuSelectKey = ref<string>('');
emits: ['update:collapsed'],
setup(props, { emit }) {
// 当前路由
const currentRoute = useRoute();
const router = useRouter();
const asyncRouteStore = useAsyncRouteStore();
const settingStore = useProjectSettingStore();
const menus = ref<any[]>([]);
const selectedKeys = ref<string>(currentRoute.name as string);
const headerMenuSelectKey = ref<string>('');
const { getNavMode } = useProjectSetting(); const { getNavMode } = useProjectSetting();
const navMode = getNavMode; const navMode = getNavMode;
// 获取当前打开的子菜单 // 获取当前打开的子菜单
const matched = currentRoute.matched; const matched = currentRoute.matched;
const getOpenKeys = matched && matched.length ? matched.map((item) => item.name) : []; const getOpenKeys = matched && matched.length ? matched.map((item) => item.name) : [];
const state = reactive({ const state = reactive({
openKeys: getOpenKeys, openKeys: getOpenKeys,
}); });
const inverted = computed(() => { const inverted = computed(() => {
return ['dark', 'header-dark'].includes(settingStore.navTheme); return ['dark', 'header-dark'].includes(settingStore.navTheme);
}); });
const getSelectedKeys = computed(() => { const getSelectedKeys = computed(() => {
let location = props.location; let location = props.location;
return location === 'left' || (location === 'header' && unref(navMode) === 'horizontal') return location === 'left' || (location === 'header' && unref(navMode) === 'horizontal')
? unref(selectedKeys) ? unref(selectedKeys)
: unref(headerMenuSelectKey); : unref(headerMenuSelectKey);
}); });
// 监听分割菜单 // 监听分割菜单
watch( watch(
() => settingStore.menuSetting.mixMenu, () => settingStore.menuSetting.mixMenu,
() => { () => {
updateMenu(); updateMenu();
if (props.collapsed) { if (props.collapsed) {
emit('update:collapsed', !props.collapsed); emit('update:collapsed', !props.collapsed);
}
}
);
// 监听菜单收缩状态
// watch(
// () => props.collapsed,
// (newVal) => {
// }
// );
// 跟随页面路由变化，切换菜单选中状态
watch(
() => currentRoute.fullPath,
() => {
updateMenu();
const matched = currentRoute.matched;
state.openKeys = matched.map((item) => item.name);
const activeMenu: string = (currentRoute.meta?.activeMenu as string) || '';
selectedKeys.value = activeMenu ? (activeMenu as string) : (currentRoute.name as string);
}
);
function updateMenu() {
if (!settingStore.menuSetting.mixMenu) {
menus.value = generatorMenu(asyncRouteStore.getMenus);
} else {
//混合菜单
const firstRouteName: string = (currentRoute.matched[0].name as string) || '';
menus.value = generatorMenuMix(asyncRouteStore.getMenus, firstRouteName, props.location);
const activeMenu: string = currentRoute?.matched[0].meta?.activeMenu as string;
headerMenuSelectKey.value = (activeMenu ? activeMenu : firstRouteName) || '';
} }
} }
);
// 监听菜单收缩状态 // 点击菜单
// watch( function clickMenuItem(key: string) {
// () => props.collapsed, if (/http(s)?:/.test(key)) {
// (newVal) => { window.open(key);
// } } else {
// ); router.push({ name: key });
// 跟随页面路由变化，切换菜单选中状态
watch(
() => currentRoute.fullPath,
() => {
updateMenu();
const matched = currentRoute.matched;
state.openKeys = matched.map((item) => item.name);
const activeMenu: string = (currentRoute.meta?.activeMenu as string) || '';
selectedKeys.value = activeMenu ? (activeMenu as string) : (currentRoute.name as string);
}
);
function updateMenu() {
if (!settingStore.menuSetting.mixMenu) {
menus.value = generatorMenu(asyncRouteStore.getMenus);
} else {
//混合菜单
const firstRouteName: string = (currentRoute.matched[0].name as string) || '';
menus.value = generatorMenuMix(asyncRouteStore.getMenus, firstRouteName, props.location);
const activeMenu: string = currentRoute?.matched[0].meta?.activeMenu as string;
headerMenuSelectKey.value = (activeMenu ? activeMenu : firstRouteName) || '';
}
}
// 点击菜单
function clickMenuItem(key: string) {
if (/http(s)?:/.test(key)) {
window.open(key);
} else {
router.push({ name: key });
}
emit("clickMenuItem" as any, key)
}
//展开菜单
function menuExpanded(openKeys: string[]) {
if (!openKeys) return;
const latestOpenKey = openKeys.find((key) => state.openKeys.indexOf(key) === -1);
const isExistChildren = findChildrenLen(latestOpenKey as string);
state.openKeys = isExistChildren ? (latestOpenKey ? [latestOpenKey] : []) : openKeys;
}
//查找是否存在子路由
function findChildrenLen(key: string) {
if (!key) return false;
const subRouteChildren: string[] = [];
for (const { children, key } of unref(menus)) {
if (children && children.length) {
subRouteChildren.push(key as string);
} }
emit('clickMenuItem' as any, key);
} }
return subRouteChildren.includes(key);
}
onMounted(() => { //展开菜单
updateMenu(); function menuExpanded(openKeys: string[]) {
}); if (!openKeys) return;
const latestOpenKey = openKeys.find((key) => state.openKeys.indexOf(key) === -1);
const isExistChildren = findChildrenLen(latestOpenKey as string);
state.openKeys = isExistChildren ? (latestOpenKey ? [latestOpenKey] : []) : openKeys;
}
return { //查找是否存在子路由
...toRefs(state), function findChildrenLen(key: string) {
inverted, if (!key) return false;
menus, const subRouteChildren: string[] = [];
selectedKeys, for (const { children, key } of unref(menus)) {
headerMenuSelectKey, if (children && children.length) {
getSelectedKeys, subRouteChildren.push(key as string);
clickMenuItem, }
menuExpanded, }
}; return subRouteChildren.includes(key);
}, }
});
onMounted(() => {
updateMenu();
});
return {
...toRefs(state),
inverted,
menus,
selectedKeys,
headerMenuSelectKey,
getSelectedKeys,
clickMenuItem,
menuExpanded,
};
},
});
</script> </script>

1062
src/layout/components/TagsView/index.vue
View File

File diff suppressed because it is too large Load Diff

345
src/layout/index.vue
View File

@@ -1,7 +1,9 @@
<template> <template>
<n-layout class="layout" :position="fixedMenu" has-sider> <n-layout class="layout" :position="fixedMenu" has-sider>
<n-layout-sider <n-layout-sider
v-if="!isMobile && isMixMenuNoneSub && (navMode === 'vertical' || navMode === 'horizontal-mix')" v-if="
!isMobile && isMixMenuNoneSub && (navMode === 'vertical' || navMode === 'horizontal-mix')
"
show-trigger="bar" show-trigger="bar"
@collapse="collapsed = true" @collapse="collapsed = true"
:position="fixedMenu" :position="fixedMenu"
@@ -67,208 +69,209 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref, unref, computed, onMounted } from 'vue'; import { ref, unref, computed, onMounted } from 'vue';
import { Logo } from './components/Logo'; import { Logo } from './components/Logo';
import { TabsView } from './components/TagsView'; import { TabsView } from './components/TagsView';
import { MainView } from './components/Main'; import { MainView } from './components/Main';
import { AsideMenu } from './components/Menu'; import { AsideMenu } from './components/Menu';
import { PageHeader } from './components/Header'; import { PageHeader } from './components/Header';
import { useProjectSetting } from '@/hooks/setting/useProjectSetting'; import { useProjectSetting } from '@/hooks/setting/useProjectSetting';
import { useDesignSetting } from '@/hooks/setting/useDesignSetting'; import { useDesignSetting } from '@/hooks/setting/useDesignSetting';
import { useLoadingBar } from 'naive-ui'; import { useLoadingBar } from 'naive-ui';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { useProjectSettingStore } from '@/store/modules/projectSetting'; import { useProjectSettingStore } from '@/store/modules/projectSetting';
const { getDarkTheme } = useDesignSetting(); const { getDarkTheme } = useDesignSetting();
const { const {
getShowFooter, // getShowFooter,
getNavMode, getNavMode,
getNavTheme, getNavTheme,
getHeaderSetting, getHeaderSetting,
getMenuSetting, getMenuSetting,
getMultiTabsSetting, getMultiTabsSetting,
} = useProjectSetting(); } = useProjectSetting();
const settingStore = useProjectSettingStore(); const settingStore = useProjectSettingStore();
const navMode = getNavMode; const navMode = getNavMode;
const collapsed = ref<boolean>(false); const collapsed = ref<boolean>(false);
const { mobileWidth, menuWidth } = unref(getMenuSetting); const { mobileWidth, menuWidth } = unref(getMenuSetting);
const isMobile = computed<boolean>({ const isMobile = computed<boolean>({
get: () => settingStore.getIsMobile, get: () => settingStore.getIsMobile,
set: (val) => settingStore.setIsMobile(val) set: (val) => settingStore.setIsMobile(val),
}); });
const fixedHeader = computed(() => { const fixedHeader = computed(() => {
const { fixed } = unref(getHeaderSetting); const { fixed } = unref(getHeaderSetting);
return fixed ? 'absolute' : 'static'; return fixed ? 'absolute' : 'static';
}); });
const isMixMenuNoneSub = computed(() => { const isMixMenuNoneSub = computed(() => {
const mixMenu = settingStore.menuSetting.mixMenu; const mixMenu = settingStore.menuSetting.mixMenu;
const currentRoute = useRoute(); const currentRoute = useRoute();
if (unref(navMode) != 'horizontal-mix') return true; if (unref(navMode) != 'horizontal-mix') return true;
if (unref(navMode) === 'horizontal-mix' && mixMenu && currentRoute.meta.isRoot) { if (unref(navMode) === 'horizontal-mix' && mixMenu && currentRoute.meta.isRoot) {
return false; return false;
} }
return true; return true;
}); });
const fixedMenu = computed(() => { const fixedMenu = computed(() => {
const { fixed } = unref(getHeaderSetting); const { fixed } = unref(getHeaderSetting);
return fixed ? 'absolute' : 'static'; return fixed ? 'absolute' : 'static';
}); });
const isMultiTabs = computed(() => { const isMultiTabs = computed(() => {
return unref(getMultiTabsSetting).show; return unref(getMultiTabsSetting).show;
}); });
const fixedMulti = computed(() => { const fixedMulti = computed(() => {
return unref(getMultiTabsSetting).fixed; return unref(getMultiTabsSetting).fixed;
}); });
const inverted = computed(() => { const inverted = computed(() => {
return ['dark', 'header-dark'].includes(unref(getNavTheme)); return ['dark', 'header-dark'].includes(unref(getNavTheme));
}); });
const getHeaderInverted = computed(() => { const getHeaderInverted = computed(() => {
const navTheme = unref(getNavTheme); const navTheme = unref(getNavTheme);
return ['light', 'header-dark'].includes(navTheme) ? unref(inverted) : !unref(inverted); return ['light', 'header-dark'].includes(navTheme) ? unref(inverted) : !unref(inverted);
}); });
const leftMenuWidth = computed(() => { const leftMenuWidth = computed(() => {
const { minMenuWidth, menuWidth } = unref(getMenuSetting); const { minMenuWidth, menuWidth } = unref(getMenuSetting);
return collapsed.value ? minMenuWidth : menuWidth; return collapsed.value ? minMenuWidth : menuWidth;
}); });
const getChangeStyle = computed(() => { // const getChangeStyle = computed(() => {
const { minMenuWidth, menuWidth } = unref(getMenuSetting); // const { minMenuWidth, menuWidth } = unref(getMenuSetting);
return { // return {
'padding-left': collapsed.value ? `${minMenuWidth}px` : `${menuWidth}px`, // 'padding-left': collapsed.value ? `${minMenuWidth}px` : `${menuWidth}px`,
// };
// });
const getMenuLocation = computed(() => {
return 'left';
});
// 控制显示或隐藏移动端侧边栏
const showSideDrawder = computed({
get: () => isMobile.value && collapsed.value,
set: (val) => (collapsed.value = val),
});
//判断是否触发移动端模式
const checkMobileMode = () => {
if (document.body.clientWidth <= mobileWidth) {
isMobile.value = true;
} else {
isMobile.value = false;
}
collapsed.value = false;
}; };
});
const getMenuLocation = computed(() => { const watchWidth = () => {
return 'left'; const Width = document.body.clientWidth;
}); if (Width <= 950) {
collapsed.value = true;
} else collapsed.value = false;
// 控制显示或隐藏移动端侧边栏 checkMobileMode();
const showSideDrawder = computed({ };
get: () => isMobile.value && collapsed.value,
set: (val) => (collapsed.value = val)
});
//判断是否触发移动端模式 onMounted(() => {
const checkMobileMode = () => { checkMobileMode();
if (document.body.clientWidth <= mobileWidth) { window.addEventListener('resize', watchWidth);
isMobile.value = true; //挂载在 window 方便与在js中使用
} else { window['$loading'] = useLoadingBar();
isMobile.value = false; window['$loading'].finish();
} });
collapsed.value = false;
}
const watchWidth = () => {
const Width = document.body.clientWidth;
if (Width <= 950) {
collapsed.value = true;
} else collapsed.value = false;
checkMobileMode();
};
onMounted(() => {
checkMobileMode();
window.addEventListener('resize', watchWidth);
//挂载在 window 方便与在js中使用
window['$loading'] = useLoadingBar();
window['$loading'].finish();
});
</script> </script>
<style lang="less"> <style lang="less">
.layout-side-drawer { .layout-side-drawer {
background-color: rgb(0, 20, 40); background-color: rgb(0, 20, 40);
.layout-sider {
min-height: 100vh; .layout-sider {
box-shadow: 2px 0 8px 0 rgb(29 35 41 / 5%); min-height: 100vh;
position: relative; box-shadow: 2px 0 8px 0 rgb(29 35 41 / 5%);
z-index: 13; position: relative;
transition: all 0.2s ease-in-out; z-index: 13;
transition: all 0.2s ease-in-out;
}
} }
}
</style> </style>
<style lang="less" scoped> <style lang="less" scoped>
.layout { .layout {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
flex: auto;
&-default-background {
background: #f5f7f9;
}
.layout-sider {
min-height: 100vh;
box-shadow: 2px 0 8px 0 rgb(29 35 41 / 5%);
position: relative;
z-index: 13;
transition: all 0.2s ease-in-out;
}
.layout-sider-fix {
position: fixed;
top: 0;
left: 0;
}
.ant-layout {
overflow: hidden;
}
.layout-right-fix {
overflow-x: hidden;
padding-left: 200px;
min-height: 100vh;
transition: all 0.2s ease-in-out;
}
.layout-content {
flex: auto; flex: auto;
min-height: 100vh;
&-default-background {
background: #f5f7f9;
}
.layout-sider {
min-height: 100vh;
box-shadow: 2px 0 8px 0 rgb(29 35 41 / 5%);
position: relative;
z-index: 13;
transition: all 0.2s ease-in-out;
}
.layout-sider-fix {
position: fixed;
top: 0;
left: 0;
}
.ant-layout {
overflow: hidden;
}
.layout-right-fix {
overflow-x: hidden;
padding-left: 200px;
min-height: 100vh;
transition: all 0.2s ease-in-out;
}
.layout-content {
flex: auto;
min-height: 100vh;
}
.n-layout-header.n-layout-header--absolute-positioned {
z-index: 11;
}
.n-layout-footer {
background: none;
}
} }
.n-layout-header.n-layout-header--absolute-positioned { .layout-content-main {
z-index: 11; margin: 0 10px 10px;
position: relative;
padding-top: 64px;
} }
.n-layout-footer { .layout-content-main-fix {
background: none; padding-top: 64px;
} }
}
.layout-content-main { .fluid-header {
margin: 0 10px 10px; padding-top: 0;
position: relative; }
padding-top: 64px;
}
.layout-content-main-fix { .main-view-fix {
padding-top: 64px; padding-top: 44px;
} }
.fluid-header { .noMultiTabs {
padding-top: 0px; padding-top: 0;
} }
.main-view-fix {
padding-top: 44px;
}
.noMultiTabs {
padding-top: 0;
}
</style> </style>

2
src/settings/projectSetting.ts
View File

@@ -36,7 +36,7 @@ const setting = {
//分割菜单 //分割菜单
mixMenu: false, mixMenu: false,
//触发移动端侧边栏的宽度 //触发移动端侧边栏的宽度
mobileWidth: 800 mobileWidth: 800,
}, },
//面包屑 //面包屑
crumbsSetting: { crumbsSetting: {

21
src/styles/common.less
View File

@@ -1,9 +1,12 @@
#app, body, html { #app,
body,
html {
height: 100%; height: 100%;
} }
body { body {
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, "\5FAE\8F6F\96C5\9ED1", Arial, sans-serif; font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei,
'\5FAE\8F6F\96C5\9ED1', Arial, sans-serif;
line-height: 1.5; line-height: 1.5;
color: #515a6e; color: #515a6e;
font-size: 14px; font-size: 14px;
@@ -15,7 +18,7 @@ body {
//重置样式 //重置样式
.anticon { .anticon {
svg { svg {
vertical-align: initial vertical-align: initial;
} }
} }
@@ -25,10 +28,11 @@ a {
text-decoration: none; text-decoration: none;
outline: none; outline: none;
cursor: pointer; cursor: pointer;
transition: color .2s ease; transition: color 0.2s ease;
} }
a:active, a:hover { a:active,
a:hover {
outline-width: 0; outline-width: 0;
} }
@@ -40,7 +44,8 @@ a:active {
color: #2b85e4; color: #2b85e4;
} }
a:active, a:hover { a:active,
a:hover {
outline: 0; outline: 0;
text-decoration: none; text-decoration: none;
} }
@@ -91,7 +96,7 @@ a:active, a:hover {
//antd 卡片样式定制 //antd 卡片样式定制
body .n-card { body .n-card {
transition: all .2s ease-in-out; transition: all 0.2s ease-in-out;
} }
body .n-icon { body .n-icon {
@@ -110,7 +115,7 @@ body .proCard {
} }
} }
body .n-modal{ body .n-modal {
border-radius: 6px; border-radius: 6px;
} }

1
src/views/iframe/index.vue
View File

@@ -43,7 +43,6 @@
loading.value = true; loading.value = true;
init(); init();
}); });
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>

2
src/views/system/menu/menu.vue
View File

@@ -213,7 +213,7 @@
} }
function handleReset() { function handleReset() {
const treeItem = getTreeItem(unref(treeData), treeItemKey[0]); const treeItem = getTreeItem(unref(treeData), treeItemKey.value[0]);
Object.assign(formParams, treeItem); Object.assign(formParams, treeItem);
} }

35
yarn.lock
View File

@@ -2430,15 +2430,10 @@ data-urls@^2.0.0:
whatwg-mimetype "^2.3.0" whatwg-mimetype "^2.3.0"
whatwg-url "^8.0.0" whatwg-url "^8.0.0"
date-fns-tz@^1.1.6: date-fns-tz@^1.3.0:
version "1.2.2" version "1.3.0"
resolved "https://registry.yarnpkg.com/date-fns-tz/-/date-fns-tz-1.2.2.tgz#89432b54ce3fa7d050a2039e997e5b6a96df35dd" resolved "https://registry.yarnpkg.com/date-fns-tz/-/date-fns-tz-1.3.0.tgz#6c83d4bdf20d54060cf176d96a3ca45043b36a84"
integrity sha512-vWtn44eEqnLbkACb7T5G5gPgKR4nY8NkNMOCyoY49NsRGHrcDmY2aysCyzDeA+u+vcDBn/w6nQqEDyouRs4m8w== integrity sha512-r6ye6PmGEvkF467/41qzU71oGwv9kHTnV3vtSZdyV6VThwPID47ZH7FtR7zQWrhgOUWkYySm2ems2w6ZfNUqoA==
date-fns@^2.27.0:
version "2.27.0"
resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.27.0.tgz#e1ff3c3ddbbab8a2eaadbb6106be2929a5a2d92b"
integrity sha512-sj+J0Mo2p2X1e306MHq282WS4/A8Pz/95GIFcsPNMPMZVI3EUrAdSv90al1k+p74WGLCruMXk23bfEDZa71X9Q==
date-fns@^2.28.0: date-fns@^2.28.0:
version "2.28.0" version "2.28.0"
@@ -5169,10 +5164,10 @@ mute-stream@0.0.7:
resolved "https://registry.yarnpkg.com/mute-stream/-/mute-stream-0.0.7.tgz#3075ce93bc21b8fab43e1bc4da7e8115ed1e7bab" resolved "https://registry.yarnpkg.com/mute-stream/-/mute-stream-0.0.7.tgz#3075ce93bc21b8fab43e1bc4da7e8115ed1e7bab"
integrity sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s= integrity sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s=
naive-ui@^2.25.2: naive-ui@^2.26.4:
version "2.25.2" version "2.26.4"
resolved "https://registry.yarnpkg.com/naive-ui/-/naive-ui-2.25.2.tgz#e2f7bc5e11882a7c14a5c67dd175838e58749ec8" resolved "https://registry.yarnpkg.com/naive-ui/-/naive-ui-2.26.4.tgz#96b91fd36919fd36d20641668c8636a02e144d65"
integrity sha512-Jv/hMVHECh1Q7lPtIkGIa+eQVwFpQs6qEAn3r+eaEGmSuTAFJOrIKRL4ob10O5jQ1BxjLyWb+kzSxuwoi/VHWg== integrity sha512-yJQl6y58pxQWKi8YAofiFk0+4WVN+dNYoyKiMfaVdvVQTh9VxjBrcs4z5NUT+d98xUXOtmMzpIlrW/4P1xty+w==
dependencies: dependencies:
"@css-render/plugin-bem" "^0.15.8" "@css-render/plugin-bem" "^0.15.8"
"@css-render/vue3-ssr" "^0.15.8" "@css-render/vue3-ssr" "^0.15.8"
@@ -5180,8 +5175,8 @@ naive-ui@^2.25.2:
"@types/lodash-es" "^4.17.4" "@types/lodash-es" "^4.17.4"
async-validator "^4.0.1" async-validator "^4.0.1"
css-render "^0.15.8" css-render "^0.15.8"
date-fns "^2.27.0" date-fns "^2.28.0"
date-fns-tz "^1.1.6" date-fns-tz "^1.3.0"
evtd "^0.2.3" evtd "^0.2.3"
highlight.js "^11.0.1" highlight.js "^11.0.1"
lodash "^4.17.21" lodash "^4.17.21"
@@ -5191,7 +5186,7 @@ naive-ui@^2.25.2:
vdirs "^0.1.7" vdirs "^0.1.7"
vfonts "^0.0.3" vfonts "^0.0.3"
vooks "^0.2.12" vooks "^0.2.12"
vueuc "^0.4.25" vueuc "^0.4.27"
nanoid@^3.1.30: nanoid@^3.1.30:
version "3.1.30" version "3.1.30"
@@ -7157,10 +7152,10 @@ vuedraggable@^4.1.0:
dependencies: dependencies:
sortablejs "1.14.0" sortablejs "1.14.0"
vueuc@^0.4.25: vueuc@^0.4.27:
version "0.4.25" version "0.4.27"
resolved "https://registry.yarnpkg.com/vueuc/-/vueuc-0.4.25.tgz#fe7b216855c2f11f6ae4b9d81b6ad9fb5ebe5664" resolved "https://registry.yarnpkg.com/vueuc/-/vueuc-0.4.27.tgz#ac9fba71e33bed7e51ee59962e260371293119d6"
integrity sha512-SkQCtJ0N+O24gCgDwc+TYNAptgoOb/+lCTlZ7s9I+eTLo7DiLvfHp0mWI04cGkP1elhH26xdkCN+TCQ0vwaL5g== integrity sha512-wkIM6F1VT9cuzC2YOIzktPcTJ3eI8FoQ39KazAKwcdPv3GcXZGO1vBZc3TspBwap0AIn9eF8dxvQAW80yxhbHg==
dependencies: dependencies:
"@css-render/vue3-ssr" "^0.15.7" "@css-render/vue3-ssr" "^0.15.7"
css-render "^0.15.7" css-render "^0.15.7"