3298 lines
130 KiB
JavaScript
3298 lines
130 KiB
JavaScript
import { u as useAppStore, a as useSettingsStore, d as defaultSettings, b as usePermissionStore, D as DeviceEnum, c as useConfigStore, T as ThemeMode, L as LayoutMode, S as SidebarColor, i as i18n, r as router, C as ComponentSize, e as useNoticeStore, N as NoticeAPI, f as useUserStore, g as useTagsViewStore, h as refreshAppCaches, t as themeColorPresets } from "./index.CMd5bD1r.js";
|
|
import { dW as defineStore, j as computed, dZ as useRoute, v as watchEffect, e6 as useWindowSize, J as defineComponent, aO as resolveComponent, S as openBlock, _ as createElementBlock, o as unref, a8 as createCommentVNode, R as renderSlot, $ as createVNode, a0 as withCtx, a1 as createBaseVNode, T as createBlock, a3 as normalizeClass, aa as toDisplayString, ac as Transition, m as watch, E as onBeforeMount, H as Fragment, ay as renderList, aw as withModifiers, r as ref, e7 as distExports, e8 as useFullscreen, e9 as useI18n, a9 as createTextVNode, t as onMounted, z as isRef, a_ as withKeys, ak as reactive, dY as useRouter, a6 as withDirectives, ab as vShow, U as Teleport, ea as storeToRefs, n as nextTick, ah as onUnmounted, eb as lo, ec as pathBrowserifyExports, ed as KeepAlive, a7 as resolveDynamicComponent, a2 as normalizeStyle, aS as normalizeProps, aT as guardReactiveProps, ee as path, au as markRaw } from "./.pnpm.BW3P1y8f.js";
|
|
import { g as ElBacktop, h as ElButton, i as ElIcon, j as ElBreadcrumb, k as ElBreadcrumbItem, l as ElTooltip, m as ElDropdown, n as ElDropdownMenu, o as ElDropdownItem, E as ElMessage, p as ElBadge, q as ElTag, r as ElText, s as ElDivider, t as ElLink, u as ElEmpty, v as ElDialog, w as ElForm, x as ElFormItem, y as ElInput, A as ElTour, B as ElTourStep, C as ElAvatar, D as ElMessageBox, F as ElScrollbar, G as ElMenuItem, H as ElSubMenu, I as ElMenu, J as document_copy_default, K as refresh_left_default, L as ElDrawer, M as ElSwitch, N as check_default, O as ElColorPicker, P as ElRadioGroup, Q as ElRadio } from "./element-plus.CkEW9frc.js";
|
|
import { _ as _export_sfc } from "./_plugin-vue_export-helper.1tPrXgE0.js";
|
|
import { _ as _sfc_main$o } from "./index.vue_vue_type_script_setup_true_lang.BmYCVfK2.js";
|
|
import { u as useNow } from "./dateUtil.SHphbRyf.js";
|
|
import ConfigInfoDrawer from "./ConfigInfoDrawer.BaOb71oS.js";
|
|
import { q as quickStartManager } from "./quickStartManager.Dn9BdP3l.js";
|
|
import { i as isExternal } from "./index.DZZZOFI8.js";
|
|
import "./codemirror.CvJAcn2d.js";
|
|
import "./SingleImageUpload.CngBsWfh.js";
|
|
const useLockStore = defineStore("lock", {
|
|
state: () => {
|
|
return {
|
|
lockInfo: {
|
|
// isLock: false, // 是否锁定屏幕
|
|
// password: '' // 锁屏密码
|
|
}
|
|
};
|
|
},
|
|
getters: {
|
|
getLockInfo() {
|
|
return this.lockInfo;
|
|
}
|
|
},
|
|
actions: {
|
|
setLockInfo(lockInfo) {
|
|
this.lockInfo = lockInfo;
|
|
},
|
|
resetLockInfo() {
|
|
this.lockInfo = {};
|
|
},
|
|
unLock(password) {
|
|
var _a;
|
|
if (((_a = this.lockInfo) == null ? void 0 : _a.password) === password) {
|
|
this.resetLockInfo();
|
|
return true;
|
|
} else {
|
|
return false;
|
|
}
|
|
}
|
|
},
|
|
persist: true
|
|
});
|
|
function useLayout() {
|
|
const appStore = useAppStore();
|
|
const settingsStore = useSettingsStore();
|
|
const currentLayout = computed(() => settingsStore.layout);
|
|
const isSidebarOpen = computed(() => appStore.sidebar.opened);
|
|
const isShowTagsView = computed(() => settingsStore.showTagsView);
|
|
const isShowSettings = computed(() => defaultSettings.showSettings);
|
|
const isShowLogo = computed(() => settingsStore.showAppLogo);
|
|
const isMobile = computed(() => appStore.device === "mobile");
|
|
const layoutClass = computed(() => ({
|
|
hideSidebar: !appStore.sidebar.opened,
|
|
openSidebar: appStore.sidebar.opened,
|
|
mobile: appStore.device === "mobile",
|
|
[`layout-${settingsStore.layout}`]: true
|
|
}));
|
|
function toggleSidebar() {
|
|
appStore.toggleSidebar();
|
|
}
|
|
function closeSidebar() {
|
|
appStore.closeSideBar();
|
|
}
|
|
return {
|
|
currentLayout,
|
|
isSidebarOpen,
|
|
isShowTagsView,
|
|
isShowSettings,
|
|
isShowLogo,
|
|
isMobile,
|
|
layoutClass,
|
|
toggleSidebar,
|
|
closeSidebar
|
|
};
|
|
}
|
|
function useLayoutMenu() {
|
|
const route = useRoute();
|
|
const appStore = useAppStore();
|
|
const permissionStore = usePermissionStore();
|
|
const activeTopMenuPath = computed(() => appStore.activeTopMenuPath);
|
|
const routes = computed(() => permissionStore.routes);
|
|
const sideMenuRoutes = computed(() => permissionStore.mixLayoutSideMenus);
|
|
const activeMenu = computed(() => {
|
|
const { meta, path: path2 } = route;
|
|
if (meta == null ? void 0 : meta.activeMenu) {
|
|
return meta.activeMenu;
|
|
}
|
|
return path2;
|
|
});
|
|
return {
|
|
routes,
|
|
sideMenuRoutes,
|
|
activeMenu,
|
|
activeTopMenuPath
|
|
};
|
|
}
|
|
function useLayoutResponsive() {
|
|
const appStore = useAppStore();
|
|
const { width } = useWindowSize();
|
|
const WIDTH_DESKTOP = 992;
|
|
const isDesktop = computed(() => width.value >= WIDTH_DESKTOP);
|
|
const isMobile = computed(() => appStore.device === DeviceEnum.MOBILE);
|
|
watchEffect(() => {
|
|
const deviceType = isDesktop.value ? DeviceEnum.DESKTOP : DeviceEnum.MOBILE;
|
|
appStore.toggleDevice(deviceType);
|
|
if (isDesktop.value) {
|
|
appStore.openSideBar();
|
|
} else {
|
|
appStore.closeSideBar();
|
|
}
|
|
});
|
|
return {
|
|
isDesktop,
|
|
isMobile
|
|
};
|
|
}
|
|
const _sfc_main$n = /* @__PURE__ */ defineComponent({
|
|
__name: "BaseLayout",
|
|
setup(__props) {
|
|
const settingStore = useSettingsStore();
|
|
function handleSettingsClick() {
|
|
settingStore.settingsVisible = true;
|
|
}
|
|
const isShowSettings = computed(() => defaultSettings.showSettings);
|
|
const { layoutClass, isSidebarOpen, closeSidebar } = useLayout();
|
|
const { isMobile } = useLayoutResponsive();
|
|
return (_ctx, _cache) => {
|
|
const _component_el_backtop = ElBacktop;
|
|
const _component_Setting = resolveComponent("Setting");
|
|
const _component_el_icon = ElIcon;
|
|
const _component_el_button = ElButton;
|
|
return openBlock(), createElementBlock("div", {
|
|
class: normalizeClass(["layout", unref(layoutClass)])
|
|
}, [
|
|
unref(isMobile) && unref(isSidebarOpen) ? (openBlock(), createElementBlock("div", {
|
|
key: 0,
|
|
class: "layout__overlay",
|
|
onClick: _cache[0] || (_cache[0] = //@ts-ignore
|
|
(...args) => unref(closeSidebar) && unref(closeSidebar)(...args))
|
|
})) : createCommentVNode("", true),
|
|
renderSlot(_ctx.$slots, "default", {}, void 0, true),
|
|
createVNode(_component_el_backtop, { target: ".app-main" }, {
|
|
default: withCtx(() => [..._cache[1] || (_cache[1] = [
|
|
createBaseVNode("div", { class: "i-svg:backtop w-6 h-6" }, null, -1)
|
|
])]),
|
|
_: 1
|
|
}),
|
|
unref(isShowSettings) ? (openBlock(), createBlock(_component_el_button, {
|
|
key: 1,
|
|
class: "floating-settings-button",
|
|
type: "primary",
|
|
onClick: handleSettingsClick
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Setting)
|
|
]),
|
|
_: 1
|
|
})
|
|
]),
|
|
_: 1
|
|
})) : createCommentVNode("", true)
|
|
], 2);
|
|
};
|
|
}
|
|
});
|
|
const BaseLayout = /* @__PURE__ */ _export_sfc(_sfc_main$n, [["__scopeId", "data-v-186056de"]]);
|
|
const _hoisted_1$d = { class: "logo" };
|
|
const _hoisted_2$b = ["src"];
|
|
const _hoisted_3$9 = {
|
|
key: 0,
|
|
class: "title"
|
|
};
|
|
const _sfc_main$m = /* @__PURE__ */ defineComponent({
|
|
__name: "index",
|
|
props: {
|
|
collapse: {
|
|
type: Boolean,
|
|
required: true
|
|
}
|
|
},
|
|
setup(__props) {
|
|
const configStore = useConfigStore();
|
|
return (_ctx, _cache) => {
|
|
const _component_router_link = resolveComponent("router-link");
|
|
return openBlock(), createElementBlock("div", _hoisted_1$d, [
|
|
createVNode(Transition, { "enter-active-class": "animate__animated animate__fadeInLeft" }, {
|
|
default: withCtx(() => [
|
|
(openBlock(), createBlock(_component_router_link, {
|
|
key: +__props.collapse,
|
|
class: "wh-full flex-center",
|
|
to: "/"
|
|
}, {
|
|
default: withCtx(() => [
|
|
createBaseVNode("img", {
|
|
src: unref(configStore).configData.sys_web_logo.config_value,
|
|
class: "w50px h50px"
|
|
}, null, 8, _hoisted_2$b),
|
|
!__props.collapse ? (openBlock(), createElementBlock("span", _hoisted_3$9, toDisplayString(unref(configStore).configData.sys_web_title.config_value), 1)) : createCommentVNode("", true)
|
|
]),
|
|
_: 1
|
|
}))
|
|
]),
|
|
_: 1
|
|
})
|
|
]);
|
|
};
|
|
}
|
|
});
|
|
const AppLogo = /* @__PURE__ */ _export_sfc(_sfc_main$m, [["__scopeId", "data-v-2dd794fa"]]);
|
|
const _sfc_main$l = /* @__PURE__ */ defineComponent({
|
|
__name: "index",
|
|
props: {
|
|
isActive: { type: Boolean, required: true }
|
|
},
|
|
emits: ["toggleClick"],
|
|
setup(__props, { emit: __emit }) {
|
|
const emit = __emit;
|
|
const settingsStore = useSettingsStore();
|
|
const layout = computed(() => settingsStore.layout);
|
|
const hamburgerClass = computed(() => {
|
|
if (settingsStore.theme === ThemeMode.DARK) {
|
|
return "hamburger--white";
|
|
}
|
|
if (layout.value === LayoutMode.MIX && settingsStore.sidebarColorScheme === SidebarColor.CLASSIC_BLUE) {
|
|
return "hamburger--white";
|
|
}
|
|
return "";
|
|
});
|
|
function toggleClick() {
|
|
emit("toggleClick");
|
|
}
|
|
return (_ctx, _cache) => {
|
|
return openBlock(), createElementBlock("div", {
|
|
class: "hamburger-wrapper",
|
|
onClick: toggleClick
|
|
}, [
|
|
createBaseVNode("div", {
|
|
class: normalizeClass(["i-svg:collapse", { hamburger: true, "is-active": __props.isActive }, unref(hamburgerClass)])
|
|
}, null, 2)
|
|
]);
|
|
};
|
|
}
|
|
});
|
|
const Hamburger = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["__scopeId", "data-v-cc3b78cd"]]);
|
|
function translateRouteTitle(title) {
|
|
const hasKey = i18n.global.te("route." + title);
|
|
if (hasKey) {
|
|
const translatedTitle = i18n.global.t("route." + title);
|
|
return translatedTitle;
|
|
}
|
|
return title;
|
|
}
|
|
const _hoisted_1$c = {
|
|
key: 0,
|
|
class: "color-gray-400"
|
|
};
|
|
const _hoisted_2$a = ["onClick"];
|
|
const _sfc_main$k = /* @__PURE__ */ defineComponent({
|
|
__name: "index",
|
|
setup(__props) {
|
|
const currentRoute = useRoute();
|
|
const pathCompile = (path2) => {
|
|
const { params } = currentRoute;
|
|
const toPath = distExports.compile(path2);
|
|
return toPath(params);
|
|
};
|
|
const breadcrumbs = ref([]);
|
|
function getBreadcrumb() {
|
|
let matched = currentRoute.matched.filter((item) => item.meta && item.meta.title);
|
|
const first = matched[0];
|
|
if (!isDashboard(first)) {
|
|
matched = [{ path: "/dashboard", meta: { title: "dashboard" } }].concat(matched);
|
|
}
|
|
breadcrumbs.value = matched.filter((item) => {
|
|
return item.meta && item.meta.title && item.meta.breadcrumb !== false;
|
|
});
|
|
}
|
|
function isDashboard(route) {
|
|
const name = route && route.name;
|
|
if (!name) {
|
|
return false;
|
|
}
|
|
return name.toString().trim().toLocaleLowerCase() === "Dashboard".toLocaleLowerCase();
|
|
}
|
|
function handleLink(item) {
|
|
const { redirect, path: path2 } = item;
|
|
if (redirect) {
|
|
router.push(redirect).catch((err) => {
|
|
console.warn(err);
|
|
});
|
|
return;
|
|
}
|
|
router.push(pathCompile(path2)).catch((err) => {
|
|
console.warn(err);
|
|
});
|
|
}
|
|
watch(
|
|
() => currentRoute.path,
|
|
(path2) => {
|
|
if (path2.startsWith("/redirect/")) {
|
|
return;
|
|
}
|
|
getBreadcrumb();
|
|
}
|
|
);
|
|
onBeforeMount(() => {
|
|
getBreadcrumb();
|
|
});
|
|
return (_ctx, _cache) => {
|
|
const _component_el_breadcrumb_item = ElBreadcrumbItem;
|
|
const _component_el_breadcrumb = ElBreadcrumb;
|
|
return openBlock(), createBlock(_component_el_breadcrumb, { class: "flex-y-center" }, {
|
|
default: withCtx(() => [
|
|
(openBlock(true), createElementBlock(Fragment, null, renderList(unref(breadcrumbs), (item, index2) => {
|
|
return openBlock(), createBlock(_component_el_breadcrumb_item, {
|
|
key: item.path
|
|
}, {
|
|
default: withCtx(() => [
|
|
item.redirect === "noredirect" || index2 === unref(breadcrumbs).length - 1 ? (openBlock(), createElementBlock("span", _hoisted_1$c, toDisplayString(unref(translateRouteTitle)(item.meta.title)), 1)) : (openBlock(), createElementBlock("a", {
|
|
key: 1,
|
|
onClick: withModifiers(($event) => handleLink(item), ["prevent"])
|
|
}, toDisplayString(unref(translateRouteTitle)(item.meta.title)), 9, _hoisted_2$a))
|
|
]),
|
|
_: 2
|
|
}, 1024);
|
|
}), 128))
|
|
]),
|
|
_: 1
|
|
});
|
|
};
|
|
}
|
|
});
|
|
const Breadcrumb = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["__scopeId", "data-v-0cb4d0ec"]]);
|
|
const _sfc_main$j = /* @__PURE__ */ defineComponent({
|
|
__name: "index",
|
|
setup(__props) {
|
|
const { isFullscreen, toggle } = useFullscreen();
|
|
return (_ctx, _cache) => {
|
|
return openBlock(), createElementBlock("div", {
|
|
onClick: _cache[0] || (_cache[0] = //@ts-ignore
|
|
(...args) => unref(toggle) && unref(toggle)(...args))
|
|
}, [
|
|
createBaseVNode("div", {
|
|
class: normalizeClass(`i-svg:` + (unref(isFullscreen) ? "fullscreen-exit" : "fullscreen"))
|
|
}, null, 2)
|
|
]);
|
|
};
|
|
}
|
|
});
|
|
const _sfc_main$i = /* @__PURE__ */ defineComponent({
|
|
__name: "index",
|
|
setup(__props) {
|
|
const { t } = useI18n();
|
|
const sizeOptions = computed(() => {
|
|
return [
|
|
{ label: t("sizeSelect.default"), value: ComponentSize.DEFAULT },
|
|
{ label: t("sizeSelect.large"), value: ComponentSize.LARGE },
|
|
{ label: t("sizeSelect.small"), value: ComponentSize.SMALL }
|
|
];
|
|
});
|
|
const appStore = useAppStore();
|
|
function handleSizeChange(size) {
|
|
appStore.changeSize(size);
|
|
ElMessage.success(t("sizeSelect.message.success"));
|
|
}
|
|
return (_ctx, _cache) => {
|
|
const _component_el_dropdown_item = ElDropdownItem;
|
|
const _component_el_dropdown_menu = ElDropdownMenu;
|
|
const _component_el_dropdown = ElDropdown;
|
|
const _component_el_tooltip = ElTooltip;
|
|
return openBlock(), createBlock(_component_el_tooltip, {
|
|
content: unref(t)("sizeSelect.tooltip"),
|
|
effect: "dark",
|
|
placement: "bottom"
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_dropdown, {
|
|
trigger: "click",
|
|
onCommand: handleSizeChange
|
|
}, {
|
|
dropdown: withCtx(() => [
|
|
createVNode(_component_el_dropdown_menu, null, {
|
|
default: withCtx(() => [
|
|
(openBlock(true), createElementBlock(Fragment, null, renderList(unref(sizeOptions), (item) => {
|
|
return openBlock(), createBlock(_component_el_dropdown_item, {
|
|
key: item.value,
|
|
disabled: unref(appStore).size == item.value,
|
|
command: item.value
|
|
}, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(item.label), 1)
|
|
]),
|
|
_: 2
|
|
}, 1032, ["disabled", "command"]);
|
|
}), 128))
|
|
]),
|
|
_: 1
|
|
})
|
|
]),
|
|
default: withCtx(() => [
|
|
_cache[0] || (_cache[0] = createBaseVNode("div", { class: "i-svg:size" }, null, -1))
|
|
]),
|
|
_: 1
|
|
})
|
|
]),
|
|
_: 1
|
|
}, 8, ["content"]);
|
|
};
|
|
}
|
|
});
|
|
const _hoisted_1$b = {
|
|
key: 1,
|
|
class: "i-svg:bell"
|
|
};
|
|
const _hoisted_2$9 = { class: "p-5" };
|
|
const _hoisted_3$8 = { class: "flex-y-center" };
|
|
const _hoisted_4$5 = { class: "text-xs text-gray" };
|
|
const _hoisted_5$4 = { class: "flex-x-between" };
|
|
const _hoisted_6$4 = {
|
|
key: 1,
|
|
class: "flex-center h-150px w-350px"
|
|
};
|
|
const _hoisted_7$4 = {
|
|
key: 0,
|
|
class: "p-x-20px"
|
|
};
|
|
const _hoisted_8$2 = { class: "flex-y-center mb-16px text-13px text-color-secondary" };
|
|
const _hoisted_9$2 = { class: "flex-y-center" };
|
|
const _hoisted_10$2 = { class: "ml-2 flex-y-center" };
|
|
const _hoisted_11$2 = { class: "max-h-60vh pt-16px mb-24px overflow-y-auto border-t border-solid border-color" };
|
|
const _hoisted_12$2 = ["innerHTML"];
|
|
const _sfc_main$h = /* @__PURE__ */ defineComponent({
|
|
__name: "index",
|
|
setup(__props) {
|
|
const noticeStore = useNoticeStore();
|
|
const noticeList = ref([]);
|
|
const noticeDialogVisible = ref(false);
|
|
const noticeDetail = ref(null);
|
|
async function featchMyNotice() {
|
|
await noticeStore.getNotice();
|
|
noticeList.value = noticeStore.noticeList;
|
|
}
|
|
function handleViewMoreNotice() {
|
|
router.push({ name: "Notice" });
|
|
}
|
|
function handleMarkAllAsRead() {
|
|
const ids = noticeList.value.map((item) => item.id).filter((id) => id !== void 0);
|
|
NoticeAPI.batchNotice({ ids, status: "1" }).then(async () => {
|
|
await noticeStore.getNotice();
|
|
noticeList.value = noticeStore.noticeList;
|
|
});
|
|
}
|
|
onMounted(() => {
|
|
featchMyNotice();
|
|
});
|
|
return (_ctx, _cache) => {
|
|
var _a;
|
|
const _component_el_badge = ElBadge;
|
|
const _component_el_tag = ElTag;
|
|
const _component_el_text = ElText;
|
|
const _component_el_divider = ElDivider;
|
|
const _component_ArrowRight = resolveComponent("ArrowRight");
|
|
const _component_el_icon = ElIcon;
|
|
const _component_el_link = ElLink;
|
|
const _component_el_empty = ElEmpty;
|
|
const _component_el_dropdown = ElDropdown;
|
|
const _component_User = resolveComponent("User");
|
|
const _component_Timer = resolveComponent("Timer");
|
|
const _component_el_dialog = ElDialog;
|
|
return openBlock(), createElementBlock(Fragment, null, [
|
|
createVNode(_component_el_dropdown, { trigger: "click" }, {
|
|
dropdown: withCtx(() => [
|
|
createBaseVNode("div", _hoisted_2$9, [
|
|
unref(noticeList).length > 0 ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
|
|
(openBlock(true), createElementBlock(Fragment, null, renderList(unref(noticeList), (item, index2) => {
|
|
return openBlock(), createElementBlock("div", {
|
|
key: index2,
|
|
class: "w-400px py-3"
|
|
}, [
|
|
createBaseVNode("div", _hoisted_3$8, [
|
|
createVNode(_component_el_tag, {
|
|
type: item.notice_type === "1" ? "primary" : "warning"
|
|
}, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(item.notice_type === "1" ? "通知" : "公告"), 1)
|
|
]),
|
|
_: 2
|
|
}, 1032, ["type"]),
|
|
createVNode(_component_el_text, {
|
|
size: "small",
|
|
class: "w-200px cursor-pointer !ml-2 !flex-1",
|
|
truncated: ""
|
|
}, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(item.notice_content), 1)
|
|
]),
|
|
_: 2
|
|
}, 1024),
|
|
createBaseVNode("div", _hoisted_4$5, toDisplayString(item.created_time), 1)
|
|
])
|
|
]);
|
|
}), 128)),
|
|
createVNode(_component_el_divider),
|
|
createBaseVNode("div", _hoisted_5$4, [
|
|
createVNode(_component_el_link, {
|
|
type: "primary",
|
|
underline: "never",
|
|
onClick: handleViewMoreNotice
|
|
}, {
|
|
default: withCtx(() => [
|
|
_cache[2] || (_cache[2] = createBaseVNode("span", { class: "text-xs" }, "查看更多", -1)),
|
|
createVNode(_component_el_icon, { class: "text-xs" }, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_ArrowRight)
|
|
]),
|
|
_: 1
|
|
})
|
|
]),
|
|
_: 1
|
|
}),
|
|
unref(noticeList).length > 0 ? (openBlock(), createBlock(_component_el_link, {
|
|
key: 0,
|
|
type: "primary",
|
|
underline: "never",
|
|
onClick: handleMarkAllAsRead
|
|
}, {
|
|
default: withCtx(() => [..._cache[3] || (_cache[3] = [
|
|
createBaseVNode("span", { class: "text-xs" }, "全部已读", -1)
|
|
])]),
|
|
_: 1
|
|
})) : createCommentVNode("", true)
|
|
])
|
|
], 64)) : (openBlock(), createElementBlock("div", _hoisted_6$4, [
|
|
createVNode(_component_el_empty, {
|
|
"image-size": 50,
|
|
description: "暂无消息"
|
|
})
|
|
]))
|
|
])
|
|
]),
|
|
default: withCtx(() => [
|
|
unref(noticeList).length > 0 ? (openBlock(), createBlock(_component_el_badge, {
|
|
key: 0,
|
|
value: unref(noticeList).length,
|
|
max: 99
|
|
}, {
|
|
default: withCtx(() => [..._cache[1] || (_cache[1] = [
|
|
createBaseVNode("div", { class: "i-svg:bell" }, null, -1)
|
|
])]),
|
|
_: 1
|
|
}, 8, ["value"])) : (openBlock(), createElementBlock("div", _hoisted_1$b))
|
|
]),
|
|
_: 1
|
|
}),
|
|
createVNode(_component_el_dialog, {
|
|
modelValue: unref(noticeDialogVisible),
|
|
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(noticeDialogVisible) ? noticeDialogVisible.value = $event : null),
|
|
title: ((_a = unref(noticeDetail)) == null ? void 0 : _a.notice_title) ?? "通知详情",
|
|
width: "800px",
|
|
"custom-class": "notification-detail"
|
|
}, {
|
|
default: withCtx(() => {
|
|
var _a2;
|
|
return [
|
|
unref(noticeDetail) ? (openBlock(), createElementBlock("div", _hoisted_7$4, [
|
|
createBaseVNode("div", _hoisted_8$2, [
|
|
createBaseVNode("span", _hoisted_9$2, [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_User)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString((_a2 = unref(noticeDetail).created_by) == null ? void 0 : _a2.name), 1)
|
|
]),
|
|
createBaseVNode("span", _hoisted_10$2, [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Timer)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(noticeDetail).created_time), 1)
|
|
])
|
|
]),
|
|
createBaseVNode("div", _hoisted_11$2, [
|
|
createBaseVNode("div", {
|
|
innerHTML: unref(noticeDetail).notice_content
|
|
}, null, 8, _hoisted_12$2)
|
|
])
|
|
])) : createCommentVNode("", true)
|
|
];
|
|
}),
|
|
_: 1
|
|
}, 8, ["modelValue", "title"])
|
|
], 64);
|
|
};
|
|
}
|
|
});
|
|
const _hoisted_1$a = { class: "lock-dialog-content" };
|
|
const _hoisted_2$8 = ["src"];
|
|
const _hoisted_3$7 = { class: "lock-dialog-name" };
|
|
const _sfc_main$g = /* @__PURE__ */ defineComponent({
|
|
__name: "LockDialog",
|
|
props: {
|
|
modelValue: {
|
|
type: Boolean
|
|
}
|
|
},
|
|
emits: ["update:modelValue"],
|
|
setup(__props, { emit: __emit }) {
|
|
const userStore = useUserStore();
|
|
const { t } = useI18n();
|
|
const lockStore = useLockStore();
|
|
const props = __props;
|
|
const emit = __emit;
|
|
const dialogVisible = computed({
|
|
get: () => props.modelValue,
|
|
set: (val) => {
|
|
emit("update:modelValue", val);
|
|
}
|
|
});
|
|
const dialogTitle = ref(t("lock.lockScreen"));
|
|
const lockFormRef = ref();
|
|
const form = reactive({
|
|
password: ""
|
|
});
|
|
const rules = {
|
|
password: [{ required: true, message: t("lock.required"), trigger: "blur" }]
|
|
};
|
|
const handleLock = async () => {
|
|
var _a;
|
|
try {
|
|
await ((_a = lockFormRef.value) == null ? void 0 : _a.validate());
|
|
dialogVisible.value = false;
|
|
lockStore.setLockInfo({
|
|
isLock: true,
|
|
password: form.password
|
|
});
|
|
} catch {
|
|
}
|
|
};
|
|
return (_ctx, _cache) => {
|
|
const _component_el_input = ElInput;
|
|
const _component_el_form_item = ElFormItem;
|
|
const _component_el_form = ElForm;
|
|
const _component_el_button = ElButton;
|
|
const _component_el_dialog = ElDialog;
|
|
return openBlock(), createBlock(_component_el_dialog, {
|
|
modelValue: dialogVisible.value,
|
|
"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => dialogVisible.value = $event),
|
|
width: "500px",
|
|
"max-height": "170px",
|
|
class: "v-lock-dialog",
|
|
title: dialogTitle.value
|
|
}, {
|
|
footer: withCtx(() => [
|
|
createVNode(_component_el_button, {
|
|
type: "primary",
|
|
onClick: handleLock
|
|
}, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(unref(t)("navbar.lock")), 1)
|
|
]),
|
|
_: 1
|
|
})
|
|
]),
|
|
default: withCtx(() => [
|
|
createBaseVNode("div", _hoisted_1$a, [
|
|
createBaseVNode("img", {
|
|
src: unref(userStore).basicInfo.avatar,
|
|
alt: "",
|
|
class: "lock-dialog-avatar"
|
|
}, null, 8, _hoisted_2$8),
|
|
createBaseVNode("span", _hoisted_3$7, toDisplayString(unref(userStore).basicInfo.name), 1)
|
|
]),
|
|
createVNode(_component_el_form, {
|
|
ref_key: "lockFormRef",
|
|
ref: lockFormRef,
|
|
model: form,
|
|
rules
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_form_item, {
|
|
label: unref(t)("lock.lockPassword"),
|
|
prop: "password"
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_input, {
|
|
modelValue: form.password,
|
|
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => form.password = $event),
|
|
type: "password",
|
|
"show-password": "",
|
|
clearable: "",
|
|
onKeydown: withKeys(handleLock, ["enter"])
|
|
}, null, 8, ["modelValue"])
|
|
]),
|
|
_: 1
|
|
}, 8, ["label"])
|
|
]),
|
|
_: 1
|
|
}, 8, ["model"])
|
|
]),
|
|
_: 1
|
|
}, 8, ["modelValue", "title"]);
|
|
};
|
|
}
|
|
});
|
|
const LockDialog = /* @__PURE__ */ _export_sfc(_sfc_main$g, [["__scopeId", "data-v-6ec0f265"]]);
|
|
const _hoisted_1$9 = { class: "lockpage" };
|
|
const _hoisted_2$7 = { class: "time-container w-screen h-screen" };
|
|
const _hoisted_3$6 = { class: "hour-container mr-5 md:mr-20 w-2/5 h-2/5 md:h-4/5" };
|
|
const _hoisted_4$4 = { class: "minute-container w-2/5 h-2/5 md:h-4/5" };
|
|
const _hoisted_5$3 = { class: "entry-wrapper" };
|
|
const _hoisted_6$3 = { class: "entry-content" };
|
|
const _hoisted_7$3 = { class: "avatar-container" };
|
|
const _hoisted_8$1 = ["src"];
|
|
const _hoisted_9$1 = { class: "username" };
|
|
const _hoisted_10$1 = {
|
|
key: 0,
|
|
class: "error-message"
|
|
};
|
|
const _hoisted_11$1 = { class: "button-group" };
|
|
const _hoisted_12$1 = { class: "date-container" };
|
|
const _hoisted_13$1 = { class: "time-display" };
|
|
const _hoisted_14$1 = { class: "meridiem-display" };
|
|
const _hoisted_15$1 = { class: "full-date" };
|
|
const _sfc_main$f = /* @__PURE__ */ defineComponent({
|
|
__name: "LockPage",
|
|
setup(__props) {
|
|
const route = useRoute();
|
|
const router2 = useRouter();
|
|
const userStore = useUserStore();
|
|
const tagsViewStore = useTagsViewStore();
|
|
const { replace } = useRouter();
|
|
const password = ref("");
|
|
const loading = ref(false);
|
|
const errMsg = ref(false);
|
|
const showDate = ref(true);
|
|
const lockStore = useLockStore();
|
|
const { hour, month, minute, meridiem, year, day, week } = useNow(true);
|
|
const { t } = useI18n();
|
|
async function unLock() {
|
|
if (!password.value) {
|
|
return;
|
|
}
|
|
const pwd = password.value;
|
|
try {
|
|
loading.value = true;
|
|
const res = await lockStore.unLock(pwd);
|
|
errMsg.value = !res;
|
|
} finally {
|
|
loading.value = false;
|
|
}
|
|
}
|
|
async function goLogin() {
|
|
await userStore.logout().catch(() => {
|
|
});
|
|
userStore.resetAllState();
|
|
tagsViewStore.delAllViews();
|
|
router2.push(`/login?redirect=${route.fullPath}`);
|
|
lockStore.resetLockInfo();
|
|
replace("/login");
|
|
}
|
|
const passwordInputRef = ref();
|
|
function handleShowForm(show = false) {
|
|
showDate.value = show;
|
|
if (!show) {
|
|
requestAnimationFrame(() => {
|
|
var _a;
|
|
(_a = passwordInputRef.value) == null ? void 0 : _a.focus();
|
|
});
|
|
}
|
|
}
|
|
return (_ctx, _cache) => {
|
|
const _component_Lock = resolveComponent("Lock");
|
|
const _component_el_icon = ElIcon;
|
|
const _component_el_button = ElButton;
|
|
return openBlock(), createElementBlock("div", _hoisted_1$9, [
|
|
withDirectives(createBaseVNode("div", {
|
|
class: "unlock-container",
|
|
onClick: _cache[0] || (_cache[0] = ($event) => handleShowForm(false))
|
|
}, [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Lock)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createBaseVNode("span", null, toDisplayString(unref(t)("lock.unlock")), 1)
|
|
], 512), [
|
|
[vShow, showDate.value]
|
|
]),
|
|
createBaseVNode("div", _hoisted_2$7, [
|
|
createBaseVNode("div", _hoisted_3$6, [
|
|
createBaseVNode("span", null, toDisplayString(unref(hour)), 1),
|
|
withDirectives(createBaseVNode("span", { class: "meridiem absolute left-5 top-5 text-md xl:text-xl" }, toDisplayString(unref(meridiem)), 513), [
|
|
[vShow, showDate.value]
|
|
])
|
|
]),
|
|
createBaseVNode("div", _hoisted_4$4, [
|
|
createBaseVNode("span", null, toDisplayString(unref(minute)), 1)
|
|
])
|
|
]),
|
|
createVNode(Transition, { name: "fade-slide" }, {
|
|
default: withCtx(() => [
|
|
withDirectives(createBaseVNode("div", _hoisted_5$3, [
|
|
createBaseVNode("div", _hoisted_6$3, [
|
|
createBaseVNode("div", _hoisted_7$3, [
|
|
createBaseVNode("img", {
|
|
src: unref(userStore).basicInfo.avatar,
|
|
alt: "",
|
|
class: "avatar"
|
|
}, null, 8, _hoisted_8$1),
|
|
createBaseVNode("span", _hoisted_9$1, toDisplayString(unref(userStore).basicInfo.name), 1)
|
|
]),
|
|
createVNode(unref(ElInput), {
|
|
ref_key: "passwordInputRef",
|
|
ref: passwordInputRef,
|
|
modelValue: password.value,
|
|
"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => password.value = $event),
|
|
placeholder: unref(t)("lock.placeholder"),
|
|
class: "password-input",
|
|
"show-password": "",
|
|
clearable: "",
|
|
onKeydown: withKeys(unLock, ["enter"])
|
|
}, null, 8, ["modelValue", "placeholder"]),
|
|
errMsg.value ? (openBlock(), createElementBlock("span", _hoisted_10$1, toDisplayString(unref(t)("lock.message")), 1)) : createCommentVNode("", true),
|
|
createBaseVNode("div", _hoisted_11$1, [
|
|
createVNode(_component_el_button, {
|
|
type: "primary",
|
|
size: "small",
|
|
class: "back-button",
|
|
link: "",
|
|
disabled: loading.value,
|
|
onClick: _cache[2] || (_cache[2] = ($event) => handleShowForm(true))
|
|
}, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(unref(t)("common.back")), 1)
|
|
]),
|
|
_: 1
|
|
}, 8, ["disabled"]),
|
|
createVNode(_component_el_button, {
|
|
type: "primary",
|
|
size: "small",
|
|
class: "login-button",
|
|
link: "",
|
|
disabled: loading.value,
|
|
onClick: goLogin
|
|
}, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(unref(t)("lock.backToLogin")), 1)
|
|
]),
|
|
_: 1
|
|
}, 8, ["disabled"]),
|
|
createVNode(_component_el_button, {
|
|
type: "primary",
|
|
class: "entry-button",
|
|
size: "small",
|
|
link: "",
|
|
disabled: loading.value,
|
|
onClick: _cache[3] || (_cache[3] = ($event) => unLock())
|
|
}, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(unref(t)("lock.entrySystem")), 1)
|
|
]),
|
|
_: 1
|
|
}, 8, ["disabled"])
|
|
])
|
|
])
|
|
], 512), [
|
|
[vShow, !showDate.value]
|
|
])
|
|
]),
|
|
_: 1
|
|
}),
|
|
createBaseVNode("div", _hoisted_12$1, [
|
|
withDirectives(createBaseVNode("div", _hoisted_13$1, [
|
|
createTextVNode(toDisplayString(unref(hour)) + ":" + toDisplayString(unref(minute)) + " ", 1),
|
|
createBaseVNode("span", _hoisted_14$1, toDisplayString(unref(meridiem)), 1)
|
|
], 512), [
|
|
[vShow, !showDate.value]
|
|
]),
|
|
createBaseVNode("div", _hoisted_15$1, toDisplayString(unref(year)) + "/" + toDisplayString(unref(month)) + "/" + toDisplayString(unref(day)) + " " + toDisplayString(unref(week)), 1)
|
|
])
|
|
]);
|
|
};
|
|
}
|
|
});
|
|
const LockPage = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-a6d00bd9"]]);
|
|
const _sfc_main$e = /* @__PURE__ */ defineComponent({
|
|
__name: "index",
|
|
props: {
|
|
// 是否可见
|
|
modelValue: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
teleport: {
|
|
type: [String, Object],
|
|
default: "body"
|
|
}
|
|
},
|
|
emits: ["update:modelValue", "change", "prev", "next", "skip"],
|
|
setup(__props, { emit: __emit }) {
|
|
const settingStore = useSettingsStore();
|
|
const { t } = useI18n();
|
|
const props = __props;
|
|
const emit = __emit;
|
|
const open = computed({
|
|
get: () => props.modelValue,
|
|
set: (val) => emit("update:modelValue", val)
|
|
});
|
|
const layout = settingStore.layout;
|
|
const menuTarget = () => {
|
|
if (layout === "left") {
|
|
return ".layout__sidebar";
|
|
} else if (layout === "top") {
|
|
return ".layout__header-left";
|
|
} else {
|
|
return ".layout__header-menu";
|
|
}
|
|
};
|
|
const steps = [
|
|
{
|
|
target: menuTarget(),
|
|
title: t("common.menu"),
|
|
description: t("common.menuDes"),
|
|
placement: layout === "left" ? "right" : "bottom"
|
|
},
|
|
{
|
|
target: ".navbar-actions",
|
|
title: t("common.tool"),
|
|
description: t("common.toolDes"),
|
|
placement: "bottom"
|
|
},
|
|
{
|
|
target: ".tags-container",
|
|
title: t("common.tagsView"),
|
|
description: t("common.tagsViewDes"),
|
|
placement: "bottom"
|
|
}
|
|
];
|
|
const currentStep = ref(0);
|
|
const nextBtnName = computed(() => (index2) => {
|
|
if (index2 === steps.length - 1) {
|
|
return t("common.doneLabel");
|
|
}
|
|
return t("common.nextLabel");
|
|
});
|
|
function handleChange(step) {
|
|
currentStep.value = step;
|
|
emit("change", step);
|
|
}
|
|
function handleSkip() {
|
|
open.value = false;
|
|
emit("skip");
|
|
}
|
|
function handlePrevClick() {
|
|
emit("prev");
|
|
}
|
|
function handleNextClick() {
|
|
emit("next");
|
|
}
|
|
return (_ctx, _cache) => {
|
|
const _component_el_tour_step = ElTourStep;
|
|
const _component_el_button = ElButton;
|
|
const _component_el_tour = ElTour;
|
|
return openBlock(), createBlock(_component_el_tour, {
|
|
modelValue: open.value,
|
|
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => open.value = $event),
|
|
"show-close": false,
|
|
onChange: handleChange
|
|
}, {
|
|
indicators: withCtx(() => [
|
|
createVNode(_component_el_button, {
|
|
size: "small",
|
|
onClick: handleSkip
|
|
}, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(unref(t)("common.skipLabel")), 1)
|
|
]),
|
|
_: 1
|
|
})
|
|
]),
|
|
default: withCtx(() => [
|
|
(openBlock(), createElementBlock(Fragment, null, renderList(steps, (step, index2) => {
|
|
return createVNode(_component_el_tour_step, {
|
|
key: index2,
|
|
target: step.target,
|
|
title: step.title,
|
|
description: step.description,
|
|
"prev-button-props": {
|
|
children: unref(t)("common.prevLabel"),
|
|
onClick: handlePrevClick
|
|
},
|
|
"next-button-props": {
|
|
children: nextBtnName.value(index2),
|
|
onClick: handleNextClick
|
|
},
|
|
placement: step.placement
|
|
}, null, 8, ["target", "title", "description", "prev-button-props", "next-button-props", "placement"]);
|
|
}), 64))
|
|
]),
|
|
_: 1
|
|
}, 8, ["modelValue"]);
|
|
};
|
|
}
|
|
});
|
|
const Guide = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-8efaa1c6"]]);
|
|
const _hoisted_1$8 = {
|
|
key: 0,
|
|
class: "navbar-actions__item"
|
|
};
|
|
const _hoisted_2$6 = {
|
|
key: 1,
|
|
class: "navbar-actions__item"
|
|
};
|
|
const _hoisted_3$5 = {
|
|
key: 2,
|
|
class: "navbar-actions__item"
|
|
};
|
|
const _hoisted_4$3 = {
|
|
key: 1,
|
|
class: "navbar-actions__item"
|
|
};
|
|
const _hoisted_5$2 = { class: "navbar-actions__item" };
|
|
const _hoisted_6$2 = { class: "user-profile" };
|
|
const _hoisted_7$2 = { class: "user-profile__name" };
|
|
const _sfc_main$d = /* @__PURE__ */ defineComponent({
|
|
__name: "NavbarActions",
|
|
setup(__props) {
|
|
const { t } = useI18n();
|
|
const appStore = useAppStore();
|
|
const settingStore = useSettingsStore();
|
|
const userStore = useUserStore();
|
|
const router2 = useRouter();
|
|
const isDesktop = computed(() => appStore.device === DeviceEnum.DESKTOP);
|
|
function handleProfileClick() {
|
|
router2.push({ name: "Profile" });
|
|
}
|
|
const drawerVisible = ref(false);
|
|
function handleConfigClick() {
|
|
drawerVisible.value = true;
|
|
}
|
|
const guideVisible = computed({
|
|
get: () => appStore.guideVisible,
|
|
set: (newValue) => appStore.showGuide(newValue)
|
|
});
|
|
function handleTourClick() {
|
|
if (appStore.device === DeviceEnum.MOBILE) {
|
|
router2.push({ name: "Guide" });
|
|
} else {
|
|
guideVisible.value = true;
|
|
}
|
|
}
|
|
function handleGuideExit() {
|
|
settingStore.updateSetting("showGuide", false);
|
|
}
|
|
watch(
|
|
() => guideVisible.value,
|
|
(val, oldVal) => {
|
|
if (oldVal && !val) {
|
|
settingStore.updateSetting("showGuide", false);
|
|
}
|
|
}
|
|
);
|
|
const lockStore = useLockStore();
|
|
const getIsLock = computed(() => {
|
|
var _a;
|
|
return ((_a = lockStore.getLockInfo) == null ? void 0 : _a.isLock) ?? false;
|
|
});
|
|
const dialogVisible = ref(false);
|
|
const handlelockScreen = () => {
|
|
dialogVisible.value = true;
|
|
};
|
|
const navbarActionsClass = computed(() => {
|
|
const { theme, sidebarColorScheme, layout } = settingStore;
|
|
if (theme === ThemeMode.DARK) {
|
|
return "navbar-actions--white-text";
|
|
}
|
|
if (theme === ThemeMode.LIGHT) {
|
|
if (layout === LayoutMode.TOP || layout === LayoutMode.MIX) {
|
|
if (sidebarColorScheme === SidebarColor.CLASSIC_BLUE) {
|
|
return "navbar-actions--white-text";
|
|
} else {
|
|
return "navbar-actions--dark-text";
|
|
}
|
|
}
|
|
}
|
|
return "navbar-actions--dark-text";
|
|
});
|
|
function logout() {
|
|
ElMessageBox.confirm("确定注销并退出系统吗？", "提示", {
|
|
confirmButtonText: "确定",
|
|
cancelButtonText: "取消",
|
|
type: "warning",
|
|
lockScroll: false
|
|
}).then(() => {
|
|
userStore.logout().then(() => {
|
|
router2.push(`/login`);
|
|
});
|
|
}).catch(() => {
|
|
ElMessageBox.close();
|
|
});
|
|
}
|
|
return (_ctx, _cache) => {
|
|
const _component_el_avatar = ElAvatar;
|
|
const _component_User = resolveComponent("User");
|
|
const _component_el_icon = ElIcon;
|
|
const _component_el_dropdown_item = ElDropdownItem;
|
|
const _component_Setting = resolveComponent("Setting");
|
|
const _component_Position = resolveComponent("Position");
|
|
const _component_Lock = resolveComponent("Lock");
|
|
const _component_SwitchButton = resolveComponent("SwitchButton");
|
|
const _component_el_dropdown_menu = ElDropdownMenu;
|
|
const _component_el_dropdown = ElDropdown;
|
|
return openBlock(), createElementBlock(Fragment, null, [
|
|
createBaseVNode("div", {
|
|
ref: "navbar-actions",
|
|
class: normalizeClass(["navbar-actions", unref(navbarActionsClass)])
|
|
}, [
|
|
unref(isDesktop) ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
|
|
unref(settingStore).showFullscreen ? (openBlock(), createElementBlock("div", _hoisted_1$8, [
|
|
createVNode(_sfc_main$j)
|
|
])) : createCommentVNode("", true),
|
|
unref(settingStore).showSizeSelect ? (openBlock(), createElementBlock("div", _hoisted_2$6, [
|
|
createVNode(_sfc_main$i)
|
|
])) : createCommentVNode("", true),
|
|
unref(settingStore).showLangSelect ? (openBlock(), createElementBlock("div", _hoisted_3$5, [
|
|
createVNode(_sfc_main$o)
|
|
])) : createCommentVNode("", true)
|
|
], 64)) : createCommentVNode("", true),
|
|
unref(settingStore).showNotification ? (openBlock(), createElementBlock("div", _hoisted_4$3, [
|
|
createVNode(_sfc_main$h)
|
|
])) : createCommentVNode("", true),
|
|
createBaseVNode("div", _hoisted_5$2, [
|
|
createVNode(_component_el_dropdown, { trigger: "click" }, {
|
|
dropdown: withCtx(() => [
|
|
createVNode(_component_el_dropdown_menu, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_dropdown_item, { onClick: handleProfileClick }, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_User)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(t)("navbar.profile")), 1)
|
|
]),
|
|
_: 1
|
|
}),
|
|
unref(userStore).basicInfo.username == "admin" ? (openBlock(), createBlock(_component_el_dropdown_item, {
|
|
key: 0,
|
|
onClick: handleConfigClick
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Setting)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(t)("navbar.config")), 1)
|
|
]),
|
|
_: 1
|
|
})) : createCommentVNode("", true),
|
|
createVNode(_component_el_dropdown_item, { onClick: handleTourClick }, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Position)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(t)("navbar.tour")), 1)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createVNode(_component_el_dropdown_item, {
|
|
divided: "",
|
|
onClick: handlelockScreen
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Lock)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(t)("navbar.lock")), 1)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createVNode(_component_el_dropdown_item, { onClick: logout }, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_SwitchButton)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(t)("navbar.logout")), 1)
|
|
]),
|
|
_: 1
|
|
})
|
|
]),
|
|
_: 1
|
|
})
|
|
]),
|
|
default: withCtx(() => [
|
|
createBaseVNode("div", _hoisted_6$2, [
|
|
unref(userStore).basicInfo.avatar ? (openBlock(), createBlock(_component_el_avatar, {
|
|
key: 0,
|
|
size: "small",
|
|
src: unref(userStore).basicInfo.avatar
|
|
}, null, 8, ["src"])) : (openBlock(), createBlock(_component_el_avatar, {
|
|
key: 1,
|
|
size: "small",
|
|
icon: "UserFilled"
|
|
})),
|
|
createBaseVNode("span", _hoisted_7$2, toDisplayString(unref(userStore).basicInfo.username), 1)
|
|
])
|
|
]),
|
|
_: 1
|
|
})
|
|
])
|
|
], 2),
|
|
unref(guideVisible) ? (openBlock(), createBlock(Guide, {
|
|
key: 0,
|
|
modelValue: unref(guideVisible),
|
|
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(guideVisible) ? guideVisible.value = $event : null),
|
|
onSkip: handleGuideExit
|
|
}, null, 8, ["modelValue"])) : createCommentVNode("", true),
|
|
unref(dialogVisible) ? (openBlock(), createBlock(LockDialog, {
|
|
key: 1,
|
|
modelValue: unref(dialogVisible),
|
|
"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(dialogVisible) ? dialogVisible.value = $event : null)
|
|
}, null, 8, ["modelValue"])) : createCommentVNode("", true),
|
|
(openBlock(), createBlock(Teleport, { to: "body" }, [
|
|
createVNode(Transition, {
|
|
name: "fade-bottom",
|
|
mode: "out-in"
|
|
}, {
|
|
default: withCtx(() => [
|
|
unref(getIsLock) ? (openBlock(), createBlock(LockPage, { key: 0 })) : createCommentVNode("", true)
|
|
]),
|
|
_: 1
|
|
})
|
|
])),
|
|
createVNode(ConfigInfoDrawer, {
|
|
modelValue: unref(drawerVisible),
|
|
"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isRef(drawerVisible) ? drawerVisible.value = $event : null)
|
|
}, null, 8, ["modelValue"])
|
|
], 64);
|
|
};
|
|
}
|
|
});
|
|
const NavbarActions = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-c3106a3e"]]);
|
|
const _hoisted_1$7 = {
|
|
ref: "navbar",
|
|
class: "navbar"
|
|
};
|
|
const _hoisted_2$5 = { class: "flex-y-center" };
|
|
const _hoisted_3$4 = { class: "navbar__actions" };
|
|
const _sfc_main$c = /* @__PURE__ */ defineComponent({
|
|
__name: "index",
|
|
setup(__props) {
|
|
const appStore = useAppStore();
|
|
const isSidebarOpened = computed(() => appStore.sidebar.opened);
|
|
function toggleSideBar() {
|
|
console.log("🔄 Hamburger clicked! Current state:", isSidebarOpened.value);
|
|
console.log("🔄 Device type:", appStore.device);
|
|
appStore.toggleSidebar();
|
|
console.log("🔄 New state:", appStore.sidebar.opened);
|
|
}
|
|
return (_ctx, _cache) => {
|
|
return openBlock(), createElementBlock("div", _hoisted_1$7, [
|
|
createBaseVNode("div", _hoisted_2$5, [
|
|
createVNode(Hamburger, {
|
|
"is-active": unref(isSidebarOpened),
|
|
onToggleClick: toggleSideBar
|
|
}, null, 8, ["is-active"]),
|
|
createVNode(Breadcrumb)
|
|
]),
|
|
createBaseVNode("div", _hoisted_3$4, [
|
|
createVNode(NavbarActions)
|
|
])
|
|
], 512);
|
|
};
|
|
}
|
|
});
|
|
const NavBar = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["__scopeId", "data-v-6a7570b2"]]);
|
|
const _hoisted_1$6 = {
|
|
ref: "tags-container",
|
|
class: "tags-container"
|
|
};
|
|
const _hoisted_2$4 = {
|
|
role: "navigation",
|
|
class: "scroll-wrapper"
|
|
};
|
|
const _hoisted_3$3 = { class: "tag-text" };
|
|
const _hoisted_4$2 = ["onClick"];
|
|
const _sfc_main$b = /* @__PURE__ */ defineComponent({
|
|
__name: "index",
|
|
setup(__props) {
|
|
const { t } = useI18n();
|
|
const router2 = useRouter();
|
|
const route = useRoute();
|
|
const permissionStore = usePermissionStore();
|
|
const tagsViewStore = useTagsViewStore();
|
|
const { visitedViews } = storeToRefs(tagsViewStore);
|
|
const displayedViews = computed(() => {
|
|
return visitedViews.value;
|
|
});
|
|
const selectedTag = ref(null);
|
|
const scrollbarRef = ref();
|
|
const tagSwitchSource = ref(null);
|
|
const routePathMap = /* @__PURE__ */ new Map();
|
|
const updateRoutePathMap = () => {
|
|
routePathMap.clear();
|
|
visitedViews.value.forEach((tag) => {
|
|
routePathMap.set(tag.path, tag);
|
|
});
|
|
};
|
|
const isFirstView = (tag) => {
|
|
var _a, _b;
|
|
if (tag) {
|
|
return tag.path === "/" || tag.fullPath === ((_a = visitedViews.value[1]) == null ? void 0 : _a.fullPath);
|
|
} else {
|
|
const currentTag = routePathMap.get(route.path);
|
|
if (!currentTag) return false;
|
|
return currentTag.path === "/" || currentTag.fullPath === ((_b = visitedViews.value[1]) == null ? void 0 : _b.fullPath);
|
|
}
|
|
};
|
|
const isLastView = (tag) => {
|
|
var _a, _b;
|
|
if (tag) {
|
|
return tag.fullPath === ((_a = visitedViews.value[visitedViews.value.length - 1]) == null ? void 0 : _a.fullPath);
|
|
} else {
|
|
const currentTag = routePathMap.get(route.path);
|
|
if (!currentTag) return false;
|
|
return currentTag.fullPath === ((_b = visitedViews.value[visitedViews.value.length - 1]) == null ? void 0 : _b.fullPath);
|
|
}
|
|
};
|
|
const extractAffixTags = (routes, basePath = "/") => {
|
|
const affixTags = [];
|
|
const traverse = (routeList, currentBasePath) => {
|
|
routeList.forEach((route2) => {
|
|
var _a, _b;
|
|
const fullPath = pathBrowserifyExports.resolve(currentBasePath, route2.path);
|
|
if ((_a = route2.meta) == null ? void 0 : _a.affix) {
|
|
affixTags.push({
|
|
path: fullPath,
|
|
fullPath,
|
|
name: String(route2.name || ""),
|
|
title: route2.meta.title || "no-name",
|
|
affix: true,
|
|
keepAlive: route2.meta.keepAlive || false
|
|
});
|
|
}
|
|
if ((_b = route2.children) == null ? void 0 : _b.length) {
|
|
traverse(route2.children, fullPath);
|
|
}
|
|
});
|
|
};
|
|
traverse(routes, basePath);
|
|
return affixTags;
|
|
};
|
|
const initAffixTags = () => {
|
|
const affixTags = extractAffixTags(permissionStore.routes);
|
|
affixTags.forEach((tag) => {
|
|
if (tag.name) {
|
|
tagsViewStore.addVisitedView(tag);
|
|
}
|
|
});
|
|
};
|
|
const addCurrentTag = () => {
|
|
var _a, _b;
|
|
if (!((_a = route.meta) == null ? void 0 : _a.title)) return;
|
|
const existingTag = visitedViews.value.find((tag) => tag.path === route.path);
|
|
if (existingTag) {
|
|
if (!existingTag.affix) {
|
|
if (tagSwitchSource.value === "menu") {
|
|
const index2 = visitedViews.value.findIndex((tag) => tag.path === route.path);
|
|
if (index2 !== -1) {
|
|
const tag = visitedViews.value.splice(index2, 1)[0];
|
|
visitedViews.value.push(tag);
|
|
}
|
|
}
|
|
}
|
|
} else {
|
|
tagsViewStore.addView({
|
|
name: route.name,
|
|
title: route.meta.title,
|
|
path: route.path,
|
|
fullPath: route.fullPath,
|
|
icon: route.icon || ((_b = route.meta) == null ? void 0 : _b.icon),
|
|
affix: route.meta.affix || false,
|
|
keepAlive: route.meta.keepAlive || false,
|
|
query: route.query
|
|
});
|
|
}
|
|
if (tagSwitchSource.value === "menu") {
|
|
nextTick(() => {
|
|
autoScrollToLatestTag();
|
|
});
|
|
}
|
|
tagSwitchSource.value = null;
|
|
};
|
|
const updateCurrentTag = () => {
|
|
nextTick(() => {
|
|
var _a, _b, _c, _d;
|
|
const currentTag = routePathMap.get(route.path);
|
|
if (currentTag && currentTag.fullPath !== route.fullPath) {
|
|
tagsViewStore.updateVisitedView({
|
|
name: route.name,
|
|
title: ((_a = route.meta) == null ? void 0 : _a.title) || "",
|
|
path: route.path,
|
|
fullPath: route.fullPath,
|
|
icon: route.icon || ((_b = route.meta) == null ? void 0 : _b.icon),
|
|
affix: ((_c = route.meta) == null ? void 0 : _c.affix) || false,
|
|
keepAlive: ((_d = route.meta) == null ? void 0 : _d.keepAlive) || false,
|
|
query: route.query
|
|
});
|
|
}
|
|
});
|
|
};
|
|
const handleMiddleClick = (tag) => {
|
|
if (!tag.affix) {
|
|
closeSelectedTag(tag);
|
|
}
|
|
};
|
|
const handleScroll = (event) => {
|
|
var _a;
|
|
const scrollWrapper = (_a = scrollbarRef.value) == null ? void 0 : _a.wrapRef;
|
|
if (!scrollWrapper) return;
|
|
const hasHorizontalScroll = scrollWrapper.scrollWidth > scrollWrapper.clientWidth;
|
|
const hasVerticalScroll = scrollWrapper.scrollHeight > scrollWrapper.clientHeight;
|
|
if (!hasHorizontalScroll && !hasVerticalScroll) return;
|
|
const deltaY = event.deltaY || -event.wheelDelta || 0;
|
|
const deltaX = event.deltaX || 0;
|
|
const newScrollLeft = Math.max(
|
|
0,
|
|
Math.min(
|
|
scrollWrapper.scrollWidth - scrollWrapper.clientWidth,
|
|
scrollWrapper.scrollLeft + deltaX
|
|
)
|
|
);
|
|
const newScrollTop = Math.max(
|
|
0,
|
|
Math.min(
|
|
scrollWrapper.scrollHeight - scrollWrapper.clientHeight,
|
|
scrollWrapper.scrollTop + deltaY
|
|
)
|
|
);
|
|
scrollbarRef.value.setScrollLeft(newScrollLeft);
|
|
scrollbarRef.value.setScrollTop(newScrollTop);
|
|
};
|
|
const refreshSelectedTag = (tag) => {
|
|
if (!tag) return;
|
|
tagsViewStore.delCachedView(tag);
|
|
nextTick(() => {
|
|
router2.replace("/redirect" + tag.fullPath);
|
|
});
|
|
};
|
|
const closeSelectedTag = (tag) => {
|
|
const targetTag = tag || routePathMap.get(route.path);
|
|
if (!targetTag) return;
|
|
tagsViewStore.delView(targetTag).then((result) => {
|
|
if (tagsViewStore.isActive(targetTag)) {
|
|
tagsViewStore.toLastView(result.visitedViews, targetTag);
|
|
}
|
|
nextTick(() => {
|
|
resetScrollState();
|
|
});
|
|
});
|
|
};
|
|
const closeLeftTags = (tag) => {
|
|
const targetTag = tag || selectedTag.value || routePathMap.get(route.path);
|
|
if (!targetTag) return;
|
|
tagsViewStore.delLeftViews(targetTag).then((result) => {
|
|
const hasCurrentRoute = result.visitedViews.some((item) => item.path === route.path);
|
|
if (!hasCurrentRoute) {
|
|
tagsViewStore.toLastView(result.visitedViews);
|
|
}
|
|
nextTick(() => {
|
|
resetScrollState();
|
|
});
|
|
});
|
|
};
|
|
const closeRightTags = (tag) => {
|
|
const targetTag = tag || selectedTag.value || routePathMap.get(route.path);
|
|
if (!targetTag) return;
|
|
tagsViewStore.delRightViews(targetTag).then((result) => {
|
|
const hasCurrentRoute = result.visitedViews.some((item) => item.path === route.path);
|
|
if (!hasCurrentRoute) {
|
|
tagsViewStore.toLastView(result.visitedViews);
|
|
}
|
|
nextTick(() => {
|
|
resetScrollState();
|
|
});
|
|
});
|
|
};
|
|
const closeOtherTags = (tag) => {
|
|
const targetTag = tag || selectedTag.value || routePathMap.get(route.path);
|
|
if (!targetTag) return;
|
|
router2.push(targetTag);
|
|
tagsViewStore.delOtherViews(targetTag).then(() => {
|
|
updateCurrentTag();
|
|
nextTick(() => {
|
|
resetScrollState();
|
|
});
|
|
});
|
|
};
|
|
const closeAllTags = (tag) => {
|
|
tagsViewStore.delAllViews().then((result) => {
|
|
tagsViewStore.toLastView(result.visitedViews, tag || void 0);
|
|
nextTick(() => {
|
|
resetScrollState();
|
|
});
|
|
});
|
|
};
|
|
const handleAction = async (action) => {
|
|
const currentTag = routePathMap.get(route.path);
|
|
if (!currentTag) return;
|
|
switch (action) {
|
|
case "refresh":
|
|
refreshSelectedTag(currentTag);
|
|
break;
|
|
case "close":
|
|
closeSelectedTag(currentTag);
|
|
break;
|
|
case "closeRight":
|
|
closeRightTags();
|
|
break;
|
|
case "closeLeft":
|
|
closeLeftTags();
|
|
break;
|
|
case "closeOther":
|
|
closeOtherTags();
|
|
break;
|
|
case "closeAll":
|
|
closeAllTags(currentTag);
|
|
break;
|
|
case "refreshCache":
|
|
try {
|
|
await refreshAppCaches();
|
|
refreshSelectedTag(currentTag);
|
|
ElMessage.success(t("navbar.refreshCache") + "完成");
|
|
} catch (error) {
|
|
console.error("刷新缓存失败:", error);
|
|
ElMessage.error("刷新失败");
|
|
}
|
|
break;
|
|
default:
|
|
console.warn(`Unknown action: ${action}`);
|
|
}
|
|
};
|
|
const onContextMenuVisibleChange = (visible, tag) => {
|
|
if (visible) {
|
|
selectedTag.value = tag || routePathMap.get(route.path) || null;
|
|
} else {
|
|
selectedTag.value = null;
|
|
}
|
|
};
|
|
const toggleQuickStart = (tag) => {
|
|
try {
|
|
const href = tag.fullPath || tag.path;
|
|
const isExists = quickStartManager.isLinkExists(href);
|
|
if (isExists) {
|
|
const links = quickStartManager.getQuickLinks();
|
|
const targetLink = links.find((link) => link.href === href);
|
|
if (targetLink == null ? void 0 : targetLink.id) {
|
|
quickStartManager.removeQuickLink(targetLink.id);
|
|
ElMessage.success(`已取消收藏：${tag.title}`);
|
|
}
|
|
} else {
|
|
const quickLink = quickStartManager.createQuickLinkFromRoute(tag);
|
|
quickStartManager.addQuickLink(quickLink);
|
|
ElMessage.success(`已收藏：${tag.title}`);
|
|
}
|
|
} catch (error) {
|
|
console.error("Failed to toggle quick start:", error);
|
|
ElMessage.error("操作失败");
|
|
}
|
|
};
|
|
const isQuickLinkExists = (tag) => {
|
|
return quickStartManager.isLinkExists(tag.fullPath || tag.path);
|
|
};
|
|
const scrollLeft = () => {
|
|
var _a;
|
|
const scrollWrapper = (_a = scrollbarRef.value) == null ? void 0 : _a.wrapRef;
|
|
if (!scrollWrapper) return;
|
|
const newScrollLeft = Math.max(0, scrollWrapper.scrollLeft - 200);
|
|
scrollbarRef.value.setScrollLeft(newScrollLeft);
|
|
};
|
|
const scrollRight = () => {
|
|
var _a;
|
|
const scrollWrapper = (_a = scrollbarRef.value) == null ? void 0 : _a.wrapRef;
|
|
if (!scrollWrapper) return;
|
|
const maxScrollLeft = scrollWrapper.scrollWidth - scrollWrapper.clientWidth;
|
|
const newScrollLeft = Math.min(maxScrollLeft, scrollWrapper.scrollLeft + 200);
|
|
scrollbarRef.value.setScrollLeft(newScrollLeft);
|
|
if (newScrollLeft >= maxScrollLeft - 1) {
|
|
scrollState.value.hasScrolledToLatest = false;
|
|
}
|
|
};
|
|
const resetScrollState = () => {
|
|
scrollState.value.hasScrolledToLatest = false;
|
|
scrollState.value.isContainerFull = false;
|
|
};
|
|
const scrollState = ref({
|
|
hasScrolledToLatest: false,
|
|
// 是否已经滚动到最新标签
|
|
isContainerFull: false
|
|
// 容器是否已满
|
|
});
|
|
const autoScrollToLatestTag = () => {
|
|
var _a;
|
|
const scrollWrapper = (_a = scrollbarRef.value) == null ? void 0 : _a.wrapRef;
|
|
if (!scrollWrapper) return;
|
|
const containerWidth = scrollWrapper.clientWidth;
|
|
const contentWidth = scrollWrapper.scrollWidth;
|
|
const isContainerFull = contentWidth > containerWidth;
|
|
const activeTagElement = document.querySelector(".tags-item.active");
|
|
if (activeTagElement) {
|
|
const activeHtmlElement = activeTagElement;
|
|
const activeTagRect = activeHtmlElement.getBoundingClientRect();
|
|
const containerRect = scrollWrapper.getBoundingClientRect();
|
|
const tagLeft = activeTagRect.left - containerRect.left + scrollWrapper.scrollLeft;
|
|
const tagRight = tagLeft + activeHtmlElement.offsetWidth;
|
|
if (tagLeft < scrollWrapper.scrollLeft || tagRight > scrollWrapper.scrollLeft + containerWidth) {
|
|
const targetScrollLeft = tagLeft - (containerWidth - activeHtmlElement.offsetWidth) / 2;
|
|
const maxScrollLeft = contentWidth - containerWidth;
|
|
const minScrollLeft = 0;
|
|
const clampedScrollLeft = Math.max(minScrollLeft, Math.min(maxScrollLeft, targetScrollLeft));
|
|
scrollbarRef.value.setScrollLeft(clampedScrollLeft);
|
|
scrollState.value.hasScrolledToLatest = true;
|
|
scrollState.value.isContainerFull = isContainerFull;
|
|
return;
|
|
}
|
|
}
|
|
if (isContainerFull && !scrollState.value.hasScrolledToLatest) {
|
|
const maxScrollLeft = contentWidth - containerWidth;
|
|
scrollbarRef.value.setScrollLeft(maxScrollLeft);
|
|
scrollState.value.hasScrolledToLatest = true;
|
|
scrollState.value.isContainerFull = true;
|
|
} else if (!isContainerFull) {
|
|
scrollbarRef.value.setScrollLeft(0);
|
|
scrollState.value.hasScrolledToLatest = false;
|
|
scrollState.value.isContainerFull = false;
|
|
}
|
|
};
|
|
watch(
|
|
route,
|
|
() => {
|
|
if (tagSwitchSource.value === null) {
|
|
tagSwitchSource.value = "menu";
|
|
}
|
|
addCurrentTag();
|
|
updateCurrentTag();
|
|
updateRoutePathMap();
|
|
},
|
|
{ immediate: true }
|
|
);
|
|
let resizeObserver = null;
|
|
watch(
|
|
() => visitedViews.value.length,
|
|
() => {
|
|
updateRoutePathMap();
|
|
if (tagSwitchSource.value === "menu") {
|
|
nextTick(() => {
|
|
autoScrollToLatestTag();
|
|
});
|
|
}
|
|
}
|
|
);
|
|
watch(
|
|
() => route.path,
|
|
() => {
|
|
nextTick(() => {
|
|
autoScrollToLatestTag();
|
|
});
|
|
}
|
|
);
|
|
onMounted(() => {
|
|
initAffixTags();
|
|
updateRoutePathMap();
|
|
const tagsContainer = document.querySelector(".tags-container");
|
|
if (tagsContainer && window.ResizeObserver) {
|
|
resizeObserver = new ResizeObserver(() => {
|
|
nextTick(() => {
|
|
autoScrollToLatestTag();
|
|
});
|
|
});
|
|
resizeObserver.observe(tagsContainer);
|
|
}
|
|
});
|
|
onUnmounted(() => {
|
|
if (resizeObserver) {
|
|
resizeObserver.disconnect();
|
|
}
|
|
});
|
|
return (_ctx, _cache) => {
|
|
const _component_DArrowLeft = resolveComponent("DArrowLeft");
|
|
const _component_el_icon = ElIcon;
|
|
const _component_Refresh = resolveComponent("Refresh");
|
|
const _component_el_dropdown_item = ElDropdownItem;
|
|
const _component_Close = resolveComponent("Close");
|
|
const _component_Back = resolveComponent("Back");
|
|
const _component_Right = resolveComponent("Right");
|
|
const _component_Remove = resolveComponent("Remove");
|
|
const _component_Minus = resolveComponent("Minus");
|
|
const _component_Star = resolveComponent("Star");
|
|
const _component_StarFilled = resolveComponent("StarFilled");
|
|
const _component_el_dropdown_menu = ElDropdownMenu;
|
|
const _component_el_dropdown = ElDropdown;
|
|
const _component_router_link = resolveComponent("router-link");
|
|
const _component_el_scrollbar = ElScrollbar;
|
|
const _component_DArrowRight = resolveComponent("DArrowRight");
|
|
const _component_RefreshRight = resolveComponent("RefreshRight");
|
|
const _component_Setting = resolveComponent("Setting");
|
|
return openBlock(), createElementBlock("div", _hoisted_1$6, [
|
|
createVNode(_component_el_icon, {
|
|
class: "btn",
|
|
onClick: scrollLeft
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_DArrowLeft)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createBaseVNode("nav", _hoisted_2$4, [
|
|
createVNode(_component_el_scrollbar, {
|
|
ref_key: "scrollbarRef",
|
|
ref: scrollbarRef,
|
|
class: "scroll-container",
|
|
onWheel: handleScroll
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(unref(lo), {
|
|
modelValue: unref(visitedViews),
|
|
"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isRef(visitedViews) ? visitedViews.value = $event : null),
|
|
animation: 150
|
|
}, {
|
|
default: withCtx(() => [
|
|
(openBlock(true), createElementBlock(Fragment, null, renderList(unref(displayedViews), (tag) => {
|
|
return openBlock(), createBlock(_component_router_link, {
|
|
key: tag.fullPath,
|
|
class: normalizeClass(["tags-item", { active: unref(tagsViewStore).isActive(tag) }]),
|
|
to: { path: tag.path, query: tag.query },
|
|
onClick: _cache[1] || (_cache[1] = ($event) => tagSwitchSource.value = "tab"),
|
|
onMouseup: withModifiers(($event) => handleMiddleClick(tag), ["middle"])
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_dropdown, {
|
|
trigger: "contextmenu",
|
|
onVisibleChange: (visible) => onContextMenuVisibleChange(visible, tag),
|
|
onClick: _cache[0] || (_cache[0] = withModifiers(() => {
|
|
}, ["stop"]))
|
|
}, {
|
|
dropdown: withCtx(() => [
|
|
createVNode(_component_el_dropdown_menu, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_dropdown_item, {
|
|
onClick: ($event) => refreshSelectedTag(tag)
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Refresh)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(t)("navbar.refresh")), 1)
|
|
]),
|
|
_: 1
|
|
}, 8, ["onClick"]),
|
|
createVNode(_component_el_dropdown_item, {
|
|
disabled: tag.affix || unref(visitedViews).length <= 1,
|
|
onClick: ($event) => closeSelectedTag(tag)
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Close)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(t)("navbar.close")), 1)
|
|
]),
|
|
_: 1
|
|
}, 8, ["disabled", "onClick"]),
|
|
createVNode(_component_el_dropdown_item, {
|
|
disabled: isFirstView(tag),
|
|
onClick: ($event) => closeLeftTags(tag)
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Back)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(t)("navbar.closeLeft")), 1)
|
|
]),
|
|
_: 1
|
|
}, 8, ["disabled", "onClick"]),
|
|
createVNode(_component_el_dropdown_item, {
|
|
disabled: isLastView(tag),
|
|
onClick: ($event) => closeRightTags(tag)
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Right)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(t)("navbar.closeRight")), 1)
|
|
]),
|
|
_: 1
|
|
}, 8, ["disabled", "onClick"]),
|
|
createVNode(_component_el_dropdown_item, {
|
|
disabled: unref(visitedViews).length <= 1,
|
|
onClick: ($event) => closeOtherTags(tag)
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Remove)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(t)("navbar.closeOther")), 1)
|
|
]),
|
|
_: 1
|
|
}, 8, ["disabled", "onClick"]),
|
|
createVNode(_component_el_dropdown_item, {
|
|
disabled: unref(visitedViews).length <= 1,
|
|
onClick: ($event) => closeAllTags(tag)
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Minus)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(t)("navbar.closeAll")), 1)
|
|
]),
|
|
_: 1
|
|
}, 8, ["disabled", "onClick"]),
|
|
createVNode(_component_el_dropdown_item, {
|
|
divided: "",
|
|
onClick: ($event) => toggleQuickStart(tag)
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
!isQuickLinkExists(tag) ? (openBlock(), createBlock(_component_Star, { key: 0 })) : (openBlock(), createBlock(_component_StarFilled, { key: 1 }))
|
|
]),
|
|
_: 2
|
|
}, 1024),
|
|
createTextVNode(" " + toDisplayString(isQuickLinkExists(tag) ? "取消收藏" : "收藏"), 1)
|
|
]),
|
|
_: 2
|
|
}, 1032, ["onClick"])
|
|
]),
|
|
_: 2
|
|
}, 1024)
|
|
]),
|
|
default: withCtx(() => [
|
|
createBaseVNode("span", _hoisted_3$3, toDisplayString(unref(translateRouteTitle)(tag.title)), 1)
|
|
]),
|
|
_: 2
|
|
}, 1032, ["onVisibleChange"]),
|
|
!tag.affix ? (openBlock(), createElementBlock("span", {
|
|
key: 0,
|
|
class: "tag-close-btn",
|
|
onClick: withModifiers(($event) => closeSelectedTag(tag), ["prevent", "stop"])
|
|
}, [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Close)
|
|
]),
|
|
_: 1
|
|
})
|
|
], 8, _hoisted_4$2)) : createCommentVNode("", true)
|
|
]),
|
|
_: 2
|
|
}, 1032, ["class", "to", "onMouseup"]);
|
|
}), 128))
|
|
]),
|
|
_: 1
|
|
}, 8, ["modelValue"])
|
|
]),
|
|
_: 1
|
|
}, 512)
|
|
]),
|
|
createVNode(_component_el_icon, {
|
|
class: "btn",
|
|
onClick: scrollRight
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_DArrowRight)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createVNode(_component_el_icon, {
|
|
class: "btn",
|
|
onClick: _cache[3] || (_cache[3] = ($event) => handleAction("refreshCache"))
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_RefreshRight)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createVNode(_component_el_dropdown, {
|
|
class: "btn",
|
|
trigger: "click"
|
|
}, {
|
|
dropdown: withCtx(() => [
|
|
createVNode(_component_el_dropdown_menu, null, {
|
|
default: withCtx(() => {
|
|
var _a;
|
|
return [
|
|
createVNode(_component_el_dropdown_item, {
|
|
onClick: _cache[4] || (_cache[4] = ($event) => handleAction("refresh"))
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Refresh)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(t)("navbar.refresh")), 1)
|
|
]),
|
|
_: 1
|
|
}),
|
|
!((_a = unref(selectedTag)) == null ? void 0 : _a.affix) ? (openBlock(), createBlock(_component_el_dropdown_item, {
|
|
key: 0,
|
|
onClick: _cache[5] || (_cache[5] = ($event) => handleAction("close"))
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Close)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(t)("navbar.close")), 1)
|
|
]),
|
|
_: 1
|
|
})) : createCommentVNode("", true),
|
|
createVNode(_component_el_dropdown_item, {
|
|
disabled: isFirstView(unref(routePathMap).get(unref(route).path)),
|
|
onClick: _cache[6] || (_cache[6] = ($event) => handleAction("closeLeft"))
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Back)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(t)("navbar.closeLeft")), 1)
|
|
]),
|
|
_: 1
|
|
}, 8, ["disabled"]),
|
|
createVNode(_component_el_dropdown_item, {
|
|
disabled: isLastView(unref(routePathMap).get(unref(route).path)),
|
|
onClick: _cache[7] || (_cache[7] = ($event) => handleAction("closeRight"))
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Right)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(t)("navbar.closeRight")), 1)
|
|
]),
|
|
_: 1
|
|
}, 8, ["disabled"]),
|
|
createVNode(_component_el_dropdown_item, {
|
|
disabled: unref(visitedViews).length <= 1,
|
|
onClick: _cache[8] || (_cache[8] = ($event) => handleAction("closeOther"))
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Remove)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(t)("navbar.closeOther")), 1)
|
|
]),
|
|
_: 1
|
|
}, 8, ["disabled"]),
|
|
createVNode(_component_el_dropdown_item, {
|
|
onClick: _cache[9] || (_cache[9] = ($event) => handleAction("closeAll"))
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Minus)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createTextVNode(" " + toDisplayString(unref(t)("navbar.closeAll")), 1)
|
|
]),
|
|
_: 1
|
|
})
|
|
];
|
|
}),
|
|
_: 1
|
|
})
|
|
]),
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_Setting)
|
|
]),
|
|
_: 1
|
|
})
|
|
]),
|
|
_: 1
|
|
})
|
|
], 512);
|
|
};
|
|
}
|
|
});
|
|
const TagsView = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-7ccd224d"]]);
|
|
const dark = "_dark_1h0dk_26";
|
|
const variables = {
|
|
"sidebar-width": "210px",
|
|
"navbar-height": "50px",
|
|
"tags-view-height": "34px",
|
|
"menu-background": "var(--menu-background)",
|
|
"menu-text": "var(--menu-text)",
|
|
"menu-active-text": "var(--menu-active-text)",
|
|
"menu-hover": "var(--menu-hover)",
|
|
"sidebar-color-blue": "_sidebar-color-blue_1h0dk_16",
|
|
dark
|
|
};
|
|
const _sfc_main$a = /* @__PURE__ */ defineComponent({
|
|
__name: "index",
|
|
setup(__props) {
|
|
const cachedViews = computed(() => useTagsViewStore().cachedViews);
|
|
const appMainHeight = computed(() => {
|
|
if (useSettingsStore().showTagsView) {
|
|
return `calc(100vh - ${variables["navbar-height"]} - ${variables["tags-view-height"]})`;
|
|
} else {
|
|
return `calc(100vh - ${variables["navbar-height"]})`;
|
|
}
|
|
});
|
|
return (_ctx, _cache) => {
|
|
const _component_router_view = resolveComponent("router-view");
|
|
const _component_el_backtop = ElBacktop;
|
|
return openBlock(), createElementBlock("section", {
|
|
class: "app-main",
|
|
style: normalizeStyle({ height: unref(appMainHeight) })
|
|
}, [
|
|
createVNode(_component_router_view, null, {
|
|
default: withCtx(({ Component, route }) => [
|
|
createVNode(Transition, {
|
|
"enter-active-class": "animate__animated animate__fadeIn",
|
|
mode: "out-in"
|
|
}, {
|
|
default: withCtx(() => [
|
|
(openBlock(), createBlock(KeepAlive, { include: unref(cachedViews) }, [
|
|
(openBlock(), createBlock(resolveDynamicComponent(Component), {
|
|
key: route.path
|
|
}))
|
|
], 1032, ["include"]))
|
|
]),
|
|
_: 2
|
|
}, 1024)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createVNode(_component_el_backtop, { target: ".app-main" }, {
|
|
default: withCtx(() => [..._cache[0] || (_cache[0] = [
|
|
createBaseVNode("div", { class: "i-svg:backtop w-6 h-6" }, null, -1)
|
|
])]),
|
|
_: 1
|
|
})
|
|
], 4);
|
|
};
|
|
}
|
|
});
|
|
const AppMain = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-c1f290f6"]]);
|
|
const _sfc_main$9 = /* @__PURE__ */ defineComponent({
|
|
...{
|
|
name: "AppLink",
|
|
inheritAttrs: false
|
|
},
|
|
__name: "index",
|
|
props: {
|
|
to: {
|
|
type: Object,
|
|
required: true
|
|
}
|
|
},
|
|
setup(__props) {
|
|
const props = __props;
|
|
const isExternalLink = computed(() => {
|
|
return isExternal(props.to.path || "");
|
|
});
|
|
const linkType = computed(() => isExternalLink.value ? "a" : "router-link");
|
|
const linkProps = (to) => {
|
|
if (isExternalLink.value) {
|
|
return {
|
|
href: to.path,
|
|
target: "_blank",
|
|
rel: "noopener noreferrer"
|
|
};
|
|
}
|
|
return { to };
|
|
};
|
|
return (_ctx, _cache) => {
|
|
return openBlock(), createBlock(resolveDynamicComponent(unref(linkType)), normalizeProps(guardReactiveProps(linkProps(__props.to))), {
|
|
default: withCtx(() => [
|
|
renderSlot(_ctx.$slots, "default")
|
|
]),
|
|
_: 3
|
|
}, 16);
|
|
};
|
|
}
|
|
});
|
|
const _hoisted_1$5 = {
|
|
key: 1,
|
|
class: "i-svg:menu menu-icon"
|
|
};
|
|
const _hoisted_2$3 = {
|
|
key: 2,
|
|
class: "menu-title ml-1"
|
|
};
|
|
const _sfc_main$8 = /* @__PURE__ */ defineComponent({
|
|
__name: "MenuItemContent",
|
|
props: {
|
|
icon: {},
|
|
title: {}
|
|
},
|
|
setup(__props) {
|
|
const props = __props;
|
|
const isElIcon = computed(() => {
|
|
var _a;
|
|
return (_a = props.icon) == null ? void 0 : _a.startsWith("el-icon");
|
|
});
|
|
const iconComponent = computed(() => {
|
|
var _a;
|
|
return (_a = props.icon) == null ? void 0 : _a.replace("el-icon-", "");
|
|
});
|
|
return (_ctx, _cache) => {
|
|
const _component_el_icon = ElIcon;
|
|
return openBlock(), createElementBlock(Fragment, null, [
|
|
__props.icon ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
|
|
unref(isElIcon) ? (openBlock(), createBlock(_component_el_icon, {
|
|
key: 0,
|
|
class: "menu-icon"
|
|
}, {
|
|
default: withCtx(() => [
|
|
(openBlock(), createBlock(resolveDynamicComponent(unref(iconComponent))))
|
|
]),
|
|
_: 1
|
|
})) : (openBlock(), createElementBlock("div", {
|
|
key: 1,
|
|
class: normalizeClass([`i-svg:${__props.icon}`, "menu-icon"])
|
|
}, null, 2))
|
|
], 64)) : (openBlock(), createElementBlock("div", _hoisted_1$5)),
|
|
__props.title ? (openBlock(), createElementBlock("span", _hoisted_2$3, toDisplayString(unref(translateRouteTitle)(__props.title)), 1)) : createCommentVNode("", true)
|
|
], 64);
|
|
};
|
|
}
|
|
});
|
|
const MenuItemContent = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__scopeId", "data-v-d391d0fe"]]);
|
|
const _hoisted_1$4 = { key: 0 };
|
|
const _sfc_main$7 = /* @__PURE__ */ defineComponent({
|
|
...{
|
|
name: "MenuItem",
|
|
inheritAttrs: false
|
|
},
|
|
__name: "MenuItem",
|
|
props: {
|
|
/**
|
|
* 当前路由对象
|
|
*/
|
|
item: {
|
|
type: Object,
|
|
required: true
|
|
},
|
|
/**
|
|
* 父级完整路径
|
|
*/
|
|
basePath: {
|
|
type: String,
|
|
required: true
|
|
},
|
|
/**
|
|
* 是否为嵌套路由
|
|
*/
|
|
isNest: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
},
|
|
setup(__props) {
|
|
const props = __props;
|
|
const onlyOneChild = ref();
|
|
function hasOneShowingChild(children = [], parent) {
|
|
const showingChildren = children.filter((route) => {
|
|
var _a;
|
|
if (!((_a = route.meta) == null ? void 0 : _a.hidden)) {
|
|
onlyOneChild.value = route;
|
|
return true;
|
|
}
|
|
return false;
|
|
});
|
|
if (showingChildren.length === 1) {
|
|
return true;
|
|
}
|
|
if (showingChildren.length === 0) {
|
|
onlyOneChild.value = { ...parent, path: "", noShowingChildren: true };
|
|
return true;
|
|
}
|
|
return false;
|
|
}
|
|
function resolvePath(routePath) {
|
|
if (isExternal(routePath)) return routePath;
|
|
if (isExternal(props.basePath)) return props.basePath;
|
|
return path.resolve(props.basePath, routePath);
|
|
}
|
|
return (_ctx, _cache) => {
|
|
var _a, _b;
|
|
const _component_el_menu_item = ElMenuItem;
|
|
const _component_AppLink = _sfc_main$9;
|
|
const _component_MenuItem = resolveComponent("MenuItem", true);
|
|
const _component_el_sub_menu = ElSubMenu;
|
|
return !__props.item.meta || !__props.item.meta.hidden ? (openBlock(), createElementBlock("div", _hoisted_1$4, [
|
|
// 未配置始终显示，使用唯一子节点替换父节点显示为叶子节点
|
|
hasOneShowingChild(__props.item.children, __props.item) && !((_a = __props.item.meta) == null ? void 0 : _a.alwaysShow) && (!unref(onlyOneChild).children || unref(onlyOneChild).noShowingChildren) || // 即使配置了始终显示，但无子节点，也显示为叶子节点
|
|
((_b = __props.item.meta) == null ? void 0 : _b.alwaysShow) && !__props.item.children ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
|
|
unref(onlyOneChild).meta ? (openBlock(), createBlock(_component_AppLink, {
|
|
key: 0,
|
|
to: {
|
|
path: resolvePath(unref(onlyOneChild).path),
|
|
query: unref(onlyOneChild).meta.params
|
|
}
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_menu_item, {
|
|
index: resolvePath(unref(onlyOneChild).path),
|
|
class: normalizeClass({ "submenu-title-noDropdown": !__props.isNest })
|
|
}, {
|
|
default: withCtx(() => {
|
|
var _a2;
|
|
return [
|
|
unref(onlyOneChild).meta ? (openBlock(), createBlock(MenuItemContent, {
|
|
key: 0,
|
|
icon: unref(onlyOneChild).meta.icon || ((_a2 = __props.item.meta) == null ? void 0 : _a2.icon),
|
|
title: unref(onlyOneChild).meta.title
|
|
}, null, 8, ["icon", "title"])) : createCommentVNode("", true)
|
|
];
|
|
}),
|
|
_: 1
|
|
}, 8, ["index", "class"])
|
|
]),
|
|
_: 1
|
|
}, 8, ["to"])) : createCommentVNode("", true)
|
|
], 64)) : (openBlock(), createBlock(_component_el_sub_menu, {
|
|
key: 1,
|
|
index: resolvePath(__props.item.path),
|
|
"data-path": __props.item.path,
|
|
teleported: ""
|
|
}, {
|
|
title: withCtx(() => [
|
|
__props.item.meta ? (openBlock(), createBlock(MenuItemContent, {
|
|
key: 0,
|
|
icon: __props.item.meta.icon,
|
|
title: __props.item.meta.title
|
|
}, null, 8, ["icon", "title"])) : createCommentVNode("", true)
|
|
]),
|
|
default: withCtx(() => [
|
|
(openBlock(true), createElementBlock(Fragment, null, renderList(__props.item.children, (child) => {
|
|
return openBlock(), createBlock(_component_MenuItem, {
|
|
key: child.path,
|
|
"is-nest": true,
|
|
item: child,
|
|
"base-path": resolvePath(child.path)
|
|
}, null, 8, ["item", "base-path"]);
|
|
}), 128))
|
|
]),
|
|
_: 1
|
|
}, 8, ["index", "data-path"]))
|
|
])) : createCommentVNode("", true);
|
|
};
|
|
}
|
|
});
|
|
const _sfc_main$6 = /* @__PURE__ */ defineComponent({
|
|
__name: "BasicMenu",
|
|
props: {
|
|
data: {
|
|
type: Array,
|
|
default: () => []
|
|
},
|
|
basePath: {
|
|
type: String,
|
|
required: true,
|
|
example: "/system"
|
|
},
|
|
menuMode: {
|
|
type: String,
|
|
default: "vertical",
|
|
validator: (value) => ["vertical", "horizontal"].includes(value)
|
|
}
|
|
},
|
|
setup(__props) {
|
|
const props = __props;
|
|
const menuRef = ref();
|
|
const settingsStore = useSettingsStore();
|
|
const appStore = useAppStore();
|
|
const currentRoute = useRoute();
|
|
const expandedMenuIndexes = ref([]);
|
|
const theme = computed(() => settingsStore.theme);
|
|
const sidebarColorScheme = computed(() => settingsStore.sidebarColorScheme);
|
|
const menuThemeProps = computed(() => {
|
|
const isDarkOrClassicBlue = theme.value === "dark" || sidebarColorScheme.value === SidebarColor.CLASSIC_BLUE;
|
|
return {
|
|
backgroundColor: isDarkOrClassicBlue ? variables["menu-background"] : void 0,
|
|
textColor: isDarkOrClassicBlue ? variables["menu-text"] : void 0,
|
|
activeTextColor: isDarkOrClassicBlue ? variables["menu-active-text"] : void 0
|
|
};
|
|
});
|
|
const activeMenuPath = computed(() => {
|
|
const { meta, path: path2 } = currentRoute;
|
|
if ((meta == null ? void 0 : meta.activeMenu) && typeof meta.activeMenu === "string") {
|
|
return meta.activeMenu;
|
|
}
|
|
return path2;
|
|
});
|
|
function resolveFullPath(routePath) {
|
|
if (isExternal(routePath)) {
|
|
return routePath;
|
|
}
|
|
if (isExternal(props.basePath)) {
|
|
return props.basePath;
|
|
}
|
|
if (!props.basePath || props.basePath === "") {
|
|
return routePath;
|
|
}
|
|
return path.resolve(props.basePath, routePath);
|
|
}
|
|
const onMenuOpen = (index2) => {
|
|
expandedMenuIndexes.value.push(index2);
|
|
};
|
|
const onMenuClose = (index2) => {
|
|
expandedMenuIndexes.value = expandedMenuIndexes.value.filter((item) => item !== index2);
|
|
};
|
|
watch(
|
|
() => expandedMenuIndexes.value,
|
|
() => {
|
|
updateParentMenuStyles();
|
|
}
|
|
);
|
|
watch(
|
|
() => props.menuMode,
|
|
(newMode) => {
|
|
if (newMode === "horizontal" && menuRef.value) {
|
|
expandedMenuIndexes.value.forEach((item) => menuRef.value.close(item));
|
|
}
|
|
}
|
|
);
|
|
watch(
|
|
() => activeMenuPath.value,
|
|
() => {
|
|
nextTick(() => {
|
|
updateParentMenuStyles();
|
|
});
|
|
},
|
|
{ immediate: true }
|
|
);
|
|
watch(
|
|
() => currentRoute.path,
|
|
() => {
|
|
nextTick(() => {
|
|
updateParentMenuStyles();
|
|
});
|
|
}
|
|
);
|
|
function updateParentMenuStyles() {
|
|
var _a;
|
|
if (!((_a = menuRef.value) == null ? void 0 : _a.$el)) return;
|
|
nextTick(() => {
|
|
var _a2;
|
|
try {
|
|
const menuEl = (_a2 = menuRef.value) == null ? void 0 : _a2.$el;
|
|
if (!menuEl) return;
|
|
const allSubMenus = menuEl.querySelectorAll(".el-sub-menu");
|
|
allSubMenus.forEach((subMenu) => {
|
|
subMenu.classList.remove("has-active-child");
|
|
});
|
|
const activeMenuItem = menuEl.querySelector(".el-menu-item.is-active");
|
|
if (activeMenuItem) {
|
|
let parent = activeMenuItem.parentElement;
|
|
while (parent && parent !== menuEl) {
|
|
if (parent.classList.contains("el-sub-menu")) {
|
|
parent.classList.add("has-active-child");
|
|
}
|
|
parent = parent.parentElement;
|
|
}
|
|
} else {
|
|
if (props.menuMode === "horizontal") {
|
|
const currentPath = activeMenuPath.value;
|
|
allSubMenus.forEach((subMenu) => {
|
|
var _a3;
|
|
const subMenuEl = subMenu;
|
|
const subMenuPath = subMenuEl.getAttribute("data-path") || ((_a3 = subMenuEl.querySelector(".el-sub-menu__title")) == null ? void 0 : _a3.getAttribute("data-path"));
|
|
if (subMenuPath && currentPath.startsWith(subMenuPath)) {
|
|
subMenuEl.classList.add("has-active-child");
|
|
}
|
|
});
|
|
}
|
|
}
|
|
} catch (error) {
|
|
console.error("更新父菜单样式时出错:", error);
|
|
}
|
|
});
|
|
}
|
|
onMounted(() => {
|
|
updateParentMenuStyles();
|
|
});
|
|
return (_ctx, _cache) => {
|
|
const _component_el_menu = ElMenu;
|
|
return openBlock(), createBlock(_component_el_menu, {
|
|
ref_key: "menuRef",
|
|
ref: menuRef,
|
|
"default-active": unref(activeMenuPath),
|
|
collapse: !unref(appStore).sidebar.opened,
|
|
"background-color": unref(menuThemeProps).backgroundColor,
|
|
"text-color": unref(menuThemeProps).textColor,
|
|
"active-text-color": unref(menuThemeProps).activeTextColor,
|
|
"popper-effect": unref(theme),
|
|
"unique-opened": false,
|
|
"collapse-transition": false,
|
|
mode: __props.menuMode,
|
|
onOpen: onMenuOpen,
|
|
onClose: onMenuClose
|
|
}, {
|
|
default: withCtx(() => [
|
|
(openBlock(true), createElementBlock(Fragment, null, renderList(__props.data, (route) => {
|
|
return openBlock(), createBlock(_sfc_main$7, {
|
|
key: route.path,
|
|
item: route,
|
|
"base-path": resolveFullPath(route.path)
|
|
}, null, 8, ["item", "base-path"]);
|
|
}), 128))
|
|
]),
|
|
_: 1
|
|
}, 8, ["default-active", "collapse", "background-color", "text-color", "active-text-color", "popper-effect", "mode"]);
|
|
};
|
|
}
|
|
});
|
|
const _sfc_main$5 = /* @__PURE__ */ defineComponent({
|
|
__name: "LeftLayout",
|
|
setup(__props) {
|
|
const { isShowTagsView, isShowLogo, isSidebarOpen } = useLayout();
|
|
const { routes } = useLayoutMenu();
|
|
return (_ctx, _cache) => {
|
|
const _component_el_scrollbar = ElScrollbar;
|
|
return openBlock(), createBlock(BaseLayout, null, {
|
|
default: withCtx(() => [
|
|
createBaseVNode("div", {
|
|
class: normalizeClass(["layout__sidebar", { "layout__sidebar--collapsed": !unref(isSidebarOpen) }])
|
|
}, [
|
|
createBaseVNode("div", {
|
|
class: normalizeClass([{ "has-logo": unref(isShowLogo) }, "layout-sidebar"])
|
|
}, [
|
|
unref(isShowLogo) ? (openBlock(), createBlock(AppLogo, {
|
|
key: 0,
|
|
collapse: !unref(isSidebarOpen)
|
|
}, null, 8, ["collapse"])) : createCommentVNode("", true),
|
|
createVNode(_component_el_scrollbar, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_sfc_main$6, {
|
|
data: unref(routes),
|
|
"base-path": ""
|
|
}, null, 8, ["data"])
|
|
]),
|
|
_: 1
|
|
})
|
|
], 2)
|
|
], 2),
|
|
createBaseVNode("div", {
|
|
class: normalizeClass([{
|
|
hasTagsView: unref(isShowTagsView),
|
|
"layout__main--collapsed": !unref(isSidebarOpen)
|
|
}, "layout__main"])
|
|
}, [
|
|
createVNode(NavBar),
|
|
unref(isShowTagsView) ? (openBlock(), createBlock(TagsView, { key: 0 })) : createCommentVNode("", true),
|
|
createVNode(AppMain)
|
|
], 2)
|
|
]),
|
|
_: 1
|
|
});
|
|
};
|
|
}
|
|
});
|
|
const LeftLayout = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-d62c8d16"]]);
|
|
const _hoisted_1$3 = { class: "layout__header" };
|
|
const _hoisted_2$2 = { class: "layout__header-left" };
|
|
const _hoisted_3$2 = { class: "layout__header-right" };
|
|
const _sfc_main$4 = /* @__PURE__ */ defineComponent({
|
|
__name: "TopLayout",
|
|
setup(__props) {
|
|
const { isShowTagsView, isShowLogo } = useLayout();
|
|
const { routes } = useLayoutMenu();
|
|
const { width } = useWindowSize();
|
|
const isLogoCollapsed = computed(() => width.value < 768);
|
|
return (_ctx, _cache) => {
|
|
return openBlock(), createBlock(BaseLayout, null, {
|
|
default: withCtx(() => [
|
|
createBaseVNode("div", _hoisted_1$3, [
|
|
createBaseVNode("div", _hoisted_2$2, [
|
|
unref(isShowLogo) ? (openBlock(), createBlock(AppLogo, {
|
|
key: 0,
|
|
collapse: isLogoCollapsed.value
|
|
}, null, 8, ["collapse"])) : createCommentVNode("", true),
|
|
createVNode(_sfc_main$6, {
|
|
data: unref(routes),
|
|
"menu-mode": "horizontal",
|
|
"base-path": ""
|
|
}, null, 8, ["data"])
|
|
]),
|
|
createBaseVNode("div", _hoisted_3$2, [
|
|
createVNode(NavbarActions)
|
|
])
|
|
]),
|
|
createBaseVNode("div", {
|
|
class: normalizeClass([{ hasTagsView: unref(isShowTagsView) }, "layout__main"])
|
|
}, [
|
|
unref(isShowTagsView) ? (openBlock(), createBlock(TagsView, { key: 0 })) : createCommentVNode("", true),
|
|
createVNode(AppMain)
|
|
], 2)
|
|
]),
|
|
_: 1
|
|
});
|
|
};
|
|
}
|
|
});
|
|
const TopLayout = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-ad4d85f1"]]);
|
|
const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
...{
|
|
name: "MixTopMenu"
|
|
},
|
|
__name: "MixTopMenu",
|
|
setup(__props) {
|
|
const router2 = useRouter();
|
|
const appStore = useAppStore();
|
|
const permissionStore = usePermissionStore();
|
|
const settingsStore = useSettingsStore();
|
|
const theme = computed(() => settingsStore.theme);
|
|
const sidebarColorScheme = computed(() => settingsStore.sidebarColorScheme);
|
|
const topMenus = ref([]);
|
|
const processedTopMenus = computed(() => {
|
|
return topMenus.value.map((route) => {
|
|
var _a, _b, _c, _d, _e;
|
|
if (((_a = route.meta) == null ? void 0 : _a.alwaysShow) || !route.children || route.children.length === 0) {
|
|
return route;
|
|
}
|
|
const visibleChildren = route.children.filter((child) => {
|
|
var _a2;
|
|
return !((_a2 = child.meta) == null ? void 0 : _a2.hidden);
|
|
});
|
|
if (visibleChildren.length === 1) {
|
|
const onlyChild = visibleChildren[0];
|
|
return {
|
|
...route,
|
|
meta: {
|
|
...route.meta,
|
|
title: ((_b = onlyChild.meta) == null ? void 0 : _b.title) || ((_c = route.meta) == null ? void 0 : _c.title),
|
|
icon: ((_d = onlyChild.meta) == null ? void 0 : _d.icon) || ((_e = route.meta) == null ? void 0 : _e.icon)
|
|
}
|
|
};
|
|
}
|
|
return route;
|
|
});
|
|
});
|
|
const handleMenuSelect = (routePath) => {
|
|
updateMenuState(routePath);
|
|
};
|
|
const updateMenuState = (topMenuPath, skipNavigation = false) => {
|
|
if (topMenuPath && appStore.activeTopMenuPath) {
|
|
appStore.activeTopMenu(topMenuPath);
|
|
permissionStore.setMixLayoutSideMenus(topMenuPath);
|
|
}
|
|
if (!skipNavigation) {
|
|
navigateToFirstLeftMenu(permissionStore.mixLayoutSideMenus);
|
|
}
|
|
};
|
|
const navigateToFirstLeftMenu = (menus) => {
|
|
var _a;
|
|
if (menus.length === 0) return;
|
|
const [firstMenu] = menus;
|
|
if (firstMenu.children && firstMenu.children.length > 0) {
|
|
navigateToFirstLeftMenu(firstMenu.children);
|
|
} else if (firstMenu.name) {
|
|
router2.push({
|
|
name: firstMenu.name,
|
|
query: typeof ((_a = firstMenu.meta) == null ? void 0 : _a.params) === "object" ? firstMenu.meta.params : void 0
|
|
});
|
|
}
|
|
};
|
|
const activeTopMenuPath = computed(() => appStore.activeTopMenuPath);
|
|
onMounted(() => {
|
|
var _a;
|
|
topMenus.value = permissionStore.routes.filter((item) => !item.meta || !item.meta.hidden);
|
|
const currentTopMenuPath = useRoute().path.split("/").filter(Boolean).length > 1 ? ((_a = useRoute().path.match(/^\/[^/]+/)) == null ? void 0 : _a[0]) || "/" : "/";
|
|
appStore.activeTopMenu(currentTopMenuPath);
|
|
permissionStore.setMixLayoutSideMenus(currentTopMenuPath);
|
|
});
|
|
watch(
|
|
() => router2.currentRoute.value.path,
|
|
(newPath) => {
|
|
var _a;
|
|
if (newPath) {
|
|
const topMenuPath = newPath.split("/").filter(Boolean).length > 1 ? ((_a = newPath.match(/^\/[^/]+/)) == null ? void 0 : _a[0]) || "/" : "/";
|
|
updateMenuState(topMenuPath, true);
|
|
}
|
|
}
|
|
);
|
|
return (_ctx, _cache) => {
|
|
const _component_el_menu_item = ElMenuItem;
|
|
const _component_el_menu = ElMenu;
|
|
return openBlock(), createBlock(_component_el_menu, {
|
|
mode: "horizontal",
|
|
"default-active": unref(activeTopMenuPath),
|
|
"background-color": unref(theme) === "dark" || unref(sidebarColorScheme) === unref(SidebarColor).CLASSIC_BLUE ? unref(variables)["menu-background"] : void 0,
|
|
"text-color": unref(theme) === "dark" || unref(sidebarColorScheme) === unref(SidebarColor).CLASSIC_BLUE ? unref(variables)["menu-text"] : void 0,
|
|
"active-text-color": unref(theme) === "dark" || unref(sidebarColorScheme) === unref(SidebarColor).CLASSIC_BLUE ? unref(variables)["menu-active-text"] : void 0,
|
|
onSelect: handleMenuSelect
|
|
}, {
|
|
default: withCtx(() => [
|
|
(openBlock(true), createElementBlock(Fragment, null, renderList(unref(processedTopMenus), (menuItem) => {
|
|
return openBlock(), createBlock(_component_el_menu_item, {
|
|
key: menuItem.path,
|
|
index: menuItem.path
|
|
}, {
|
|
default: withCtx(() => [
|
|
menuItem.meta ? (openBlock(), createBlock(MenuItemContent, {
|
|
key: 0,
|
|
icon: menuItem.meta.icon,
|
|
title: menuItem.meta.title
|
|
}, null, 8, ["icon", "title"])) : createCommentVNode("", true)
|
|
]),
|
|
_: 2
|
|
}, 1032, ["index"]);
|
|
}), 128))
|
|
]),
|
|
_: 1
|
|
}, 8, ["default-active", "background-color", "text-color", "active-text-color"]);
|
|
};
|
|
}
|
|
});
|
|
const MixTopMenu = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-cf0d976a"]]);
|
|
const _hoisted_1$2 = { class: "layout__header" };
|
|
const _hoisted_2$1 = { class: "layout__header-content" };
|
|
const _hoisted_3$1 = {
|
|
key: 0,
|
|
class: "layout__header-logo"
|
|
};
|
|
const _hoisted_4$1 = { class: "layout__header-menu" };
|
|
const _hoisted_5$1 = { class: "layout__header-actions" };
|
|
const _hoisted_6$1 = { class: "layout__container" };
|
|
const _hoisted_7$1 = { class: "layout__sidebar-toggle" };
|
|
const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
__name: "MixLayout",
|
|
setup(__props) {
|
|
const route = useRoute();
|
|
const { isShowTagsView, isShowLogo, isSidebarOpen, toggleSidebar } = useLayout();
|
|
const { sideMenuRoutes, activeTopMenuPath } = useLayoutMenu();
|
|
const { width } = useWindowSize();
|
|
const isLogoCollapsed = computed(() => width.value < 768);
|
|
const activeLeftMenuPath = computed(() => {
|
|
const { meta, path: path2 } = route;
|
|
if ((meta == null ? void 0 : meta.activeMenu) && typeof meta.activeMenu === "string") {
|
|
return meta.activeMenu;
|
|
}
|
|
return path2;
|
|
});
|
|
function resolvePath(routePath) {
|
|
if (isExternal(routePath)) {
|
|
return routePath;
|
|
}
|
|
if (routePath.startsWith("/")) {
|
|
return routePath;
|
|
}
|
|
return `${activeTopMenuPath.value}/${routePath}`;
|
|
}
|
|
watch(
|
|
() => route.path,
|
|
(newPath) => {
|
|
var _a;
|
|
const topMenuPath = newPath.split("/").filter(Boolean).length > 1 ? ((_a = newPath.match(/^\/[^/]+/)) == null ? void 0 : _a[0]) || "/" : "/";
|
|
if (newPath.startsWith(activeTopMenuPath.value)) ;
|
|
else if (topMenuPath !== activeTopMenuPath.value) {
|
|
const appStore = useAppStore();
|
|
const permissionStore = usePermissionStore();
|
|
appStore.activeTopMenu(topMenuPath);
|
|
permissionStore.setMixLayoutSideMenus(topMenuPath);
|
|
}
|
|
},
|
|
{ immediate: true }
|
|
);
|
|
return (_ctx, _cache) => {
|
|
const _component_el_menu = ElMenu;
|
|
const _component_el_scrollbar = ElScrollbar;
|
|
return openBlock(), createBlock(BaseLayout, null, {
|
|
default: withCtx(() => [
|
|
createBaseVNode("div", _hoisted_1$2, [
|
|
createBaseVNode("div", _hoisted_2$1, [
|
|
unref(isShowLogo) ? (openBlock(), createElementBlock("div", _hoisted_3$1, [
|
|
createVNode(AppLogo, { collapse: isLogoCollapsed.value }, null, 8, ["collapse"])
|
|
])) : createCommentVNode("", true),
|
|
createBaseVNode("div", _hoisted_4$1, [
|
|
createVNode(MixTopMenu)
|
|
]),
|
|
createBaseVNode("div", _hoisted_5$1, [
|
|
createVNode(NavbarActions)
|
|
])
|
|
])
|
|
]),
|
|
createBaseVNode("div", _hoisted_6$1, [
|
|
createBaseVNode("div", {
|
|
class: normalizeClass(["layout__sidebar--left", { "layout__sidebar--collapsed": !unref(isSidebarOpen) }])
|
|
}, [
|
|
createVNode(_component_el_scrollbar, null, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_menu, {
|
|
"default-active": activeLeftMenuPath.value,
|
|
collapse: !unref(isSidebarOpen),
|
|
"collapse-transition": false,
|
|
"unique-opened": false,
|
|
"background-color": unref(variables)["menu-background"],
|
|
"text-color": unref(variables)["menu-text"],
|
|
"active-text-color": unref(variables)["menu-active-text"]
|
|
}, {
|
|
default: withCtx(() => [
|
|
(openBlock(true), createElementBlock(Fragment, null, renderList(unref(sideMenuRoutes), (item) => {
|
|
return openBlock(), createBlock(_sfc_main$7, {
|
|
key: item.path,
|
|
item,
|
|
"base-path": resolvePath(item.path)
|
|
}, null, 8, ["item", "base-path"]);
|
|
}), 128))
|
|
]),
|
|
_: 1
|
|
}, 8, ["default-active", "collapse", "background-color", "text-color", "active-text-color"])
|
|
]),
|
|
_: 1
|
|
}),
|
|
createBaseVNode("div", _hoisted_7$1, [
|
|
createVNode(Hamburger, {
|
|
"is-active": unref(isSidebarOpen),
|
|
onToggleClick: unref(toggleSidebar)
|
|
}, null, 8, ["is-active", "onToggleClick"])
|
|
])
|
|
], 2),
|
|
createBaseVNode("div", {
|
|
class: normalizeClass([{ hasTagsView: unref(isShowTagsView) }, "layout__main"])
|
|
}, [
|
|
unref(isShowTagsView) ? (openBlock(), createBlock(TagsView, { key: 0 })) : createCommentVNode("", true),
|
|
createVNode(AppMain)
|
|
], 2)
|
|
])
|
|
]),
|
|
_: 1
|
|
});
|
|
};
|
|
}
|
|
});
|
|
const MixLayout = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-7f187428"]]);
|
|
const _hoisted_1$1 = { class: "settings-content" };
|
|
const _hoisted_2 = { class: "config-section" };
|
|
const _hoisted_3 = { class: "flex-center" };
|
|
const _hoisted_4 = { class: "config-section" };
|
|
const _hoisted_5 = { class: "layout-select" };
|
|
const _hoisted_6 = { class: "layout-grid" };
|
|
const _hoisted_7 = ["onClick", "onKeydown"];
|
|
const _hoisted_8 = { class: "layout-preview" };
|
|
const _hoisted_9 = {
|
|
key: 0,
|
|
class: "layout-header"
|
|
};
|
|
const _hoisted_10 = {
|
|
key: 1,
|
|
class: "layout-sidebar"
|
|
};
|
|
const _hoisted_11 = { class: "layout-name" };
|
|
const _hoisted_12 = {
|
|
key: 0,
|
|
class: "layout-check"
|
|
};
|
|
const _hoisted_13 = { class: "config-section" };
|
|
const _hoisted_14 = { class: "config-item" };
|
|
const _hoisted_15 = { class: "theme-color-selector" };
|
|
const _hoisted_16 = { class: "color-label" };
|
|
const _hoisted_17 = { class: "text-xs" };
|
|
const _hoisted_18 = { class: "color-options" };
|
|
const _hoisted_19 = ["onClick"];
|
|
const _hoisted_20 = {
|
|
key: 0,
|
|
class: "color-check"
|
|
};
|
|
const _hoisted_21 = { class: "color-picker-wrapper" };
|
|
const _hoisted_22 = {
|
|
key: 0,
|
|
class: "config-section"
|
|
};
|
|
const _hoisted_23 = { class: "config-item flex-x-between" };
|
|
const _hoisted_24 = { class: "text-xs" };
|
|
const _hoisted_25 = { class: "config-section" };
|
|
const _hoisted_26 = { class: "flex-x-between" };
|
|
const _hoisted_27 = { class: "text-xs" };
|
|
const _hoisted_28 = { class: "flex-x-between" };
|
|
const _hoisted_29 = { class: "text-xs" };
|
|
const _hoisted_30 = { class: "flex-x-between" };
|
|
const _hoisted_31 = { class: "text-xs" };
|
|
const _hoisted_32 = { class: "flex-x-between" };
|
|
const _hoisted_33 = { class: "text-xs" };
|
|
const _hoisted_34 = { class: "flex-x-between" };
|
|
const _hoisted_35 = { class: "text-xs" };
|
|
const _hoisted_36 = { class: "flex-x-between" };
|
|
const _hoisted_37 = { class: "text-xs" };
|
|
const _hoisted_38 = { class: "flex-x-between" };
|
|
const _hoisted_39 = { class: "text-xs" };
|
|
const _hoisted_40 = { class: "flex-x-between" };
|
|
const _hoisted_41 = { class: "text-xs" };
|
|
const _hoisted_42 = { class: "flex-x-between" };
|
|
const _hoisted_43 = { class: "text-xs" };
|
|
const _hoisted_44 = { class: "action-footer" };
|
|
const _hoisted_45 = { class: "action-card" };
|
|
const _hoisted_46 = { class: "action-buttons" };
|
|
const _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
__name: "index",
|
|
setup(__props) {
|
|
const { t } = useI18n();
|
|
const appStore = useAppStore();
|
|
const drawerSize = computed(() => appStore.device === DeviceEnum.DESKTOP ? "400px" : "90%");
|
|
const copyIcon = markRaw(document_copy_default);
|
|
const resetIcon = markRaw(refresh_left_default);
|
|
const copyLoading = ref(false);
|
|
const resetLoading = ref(false);
|
|
const layoutOptions = [
|
|
{ value: LayoutMode.LEFT, label: t("settings.leftLayout"), className: "left" },
|
|
{ value: LayoutMode.TOP, label: t("settings.topLayout"), className: "top" },
|
|
{ value: LayoutMode.MIX, label: t("settings.mixLayout"), className: "mix" }
|
|
];
|
|
const settingsStore = useSettingsStore();
|
|
const displayColorPresets = computed(() => themeColorPresets.slice(0, 7));
|
|
const allColorPresets = themeColorPresets;
|
|
const isDark = ref(settingsStore.theme === ThemeMode.DARK);
|
|
const sidebarColor = ref(settingsStore.sidebarColorScheme);
|
|
const selectedThemeColor = computed({
|
|
get: () => settingsStore.themeColor,
|
|
set: (value) => settingsStore.updateThemeColor(value)
|
|
});
|
|
const drawerVisible = computed({
|
|
get: () => settingsStore.settingsVisible,
|
|
set: (value) => settingsStore.settingsVisible = value
|
|
});
|
|
const handleThemeChange = (isDark2) => {
|
|
settingsStore.updateTheme(isDark2 ? ThemeMode.DARK : ThemeMode.LIGHT);
|
|
};
|
|
const changeSidebarColor = (val) => {
|
|
settingsStore.updateSidebarColorScheme(val);
|
|
};
|
|
const handleLayoutChange = (layout) => {
|
|
if (settingsStore.layout === layout) return;
|
|
settingsStore.updateLayout(layout);
|
|
};
|
|
const handleColorSelect = (color) => {
|
|
selectedThemeColor.value = color;
|
|
};
|
|
const handleCopySettings = async () => {
|
|
try {
|
|
copyLoading.value = true;
|
|
const configCode = generateSettingsCode();
|
|
await navigator.clipboard.writeText(configCode);
|
|
ElMessage.success({
|
|
message: t("settings.copySuccess"),
|
|
duration: 3e3
|
|
});
|
|
} catch {
|
|
ElMessage.error("复制配置失败");
|
|
} finally {
|
|
copyLoading.value = false;
|
|
}
|
|
};
|
|
const handleResetSettings = async () => {
|
|
resetLoading.value = true;
|
|
try {
|
|
settingsStore.resetSettings();
|
|
isDark.value = settingsStore.theme === ThemeMode.DARK;
|
|
sidebarColor.value = settingsStore.sidebarColorScheme;
|
|
ElMessage.success(t("settings.resetSuccess"));
|
|
} catch {
|
|
ElMessage.error("重置配置失败");
|
|
} finally {
|
|
resetLoading.value = false;
|
|
}
|
|
};
|
|
const generateSettingsCode = () => {
|
|
const settings = {
|
|
title: "pkg.name",
|
|
version: "pkg.version",
|
|
showSettings: true,
|
|
showTagsView: settingsStore.showTagsView,
|
|
showAppLogo: settingsStore.showAppLogo,
|
|
showMenuSearch: settingsStore.showMenuSearch,
|
|
showFullscreen: settingsStore.showFullscreen,
|
|
showSizeSelect: settingsStore.showSizeSelect,
|
|
showLangSelect: settingsStore.showLangSelect,
|
|
showNotification: settingsStore.showNotification,
|
|
layout: `LayoutMode.${settingsStore.layout.toUpperCase()}`,
|
|
theme: `ThemeMode.${settingsStore.theme.toUpperCase()}`,
|
|
size: "ComponentSize.DEFAULT",
|
|
language: "LanguageEnum.ZH_CN",
|
|
themeColor: `"${settingsStore.themeColor}"`,
|
|
showWatermark: settingsStore.showWatermark,
|
|
watermarkContent: "pkg.name",
|
|
sidebarColorScheme: `SidebarColor.${settingsStore.sidebarColorScheme.toUpperCase().replace("-", "_")}`
|
|
};
|
|
return `const defaultSettings: AppSettings = {
|
|
title: ${settings.title},
|
|
version: ${settings.version},
|
|
showSettings: ${settings.showSettings},
|
|
showTagsView: ${settings.showTagsView},
|
|
showAppLogo: ${settings.showAppLogo},
|
|
showMenuSearch: ${settings.showMenuSearch},
|
|
showFullscreen: ${settings.showFullscreen},
|
|
showSizeSelect: ${settings.showSizeSelect},
|
|
showLangSelect: ${settings.showLangSelect},
|
|
showNotification: ${settings.showNotification},
|
|
layout: ${settings.layout},
|
|
theme: ${settings.theme},
|
|
size: ${settings.size},
|
|
language: ${settings.language},
|
|
themeColor: ${settings.themeColor},
|
|
showWatermark: ${settings.showWatermark},
|
|
watermarkContent: ${settings.watermarkContent},
|
|
sidebarColorScheme: ${settings.sidebarColorScheme},
|
|
};`;
|
|
};
|
|
const handleCloseDrawer = () => {
|
|
settingsStore.settingsVisible = false;
|
|
};
|
|
return (_ctx, _cache) => {
|
|
const _component_el_divider = ElDivider;
|
|
const _component_el_switch = ElSwitch;
|
|
const _component_el_icon = ElIcon;
|
|
const _component_el_tooltip = ElTooltip;
|
|
const _component_el_color_picker = ElColorPicker;
|
|
const _component_el_radio = ElRadio;
|
|
const _component_el_radio_group = ElRadioGroup;
|
|
const _component_el_button = ElButton;
|
|
const _component_el_drawer = ElDrawer;
|
|
return openBlock(), createBlock(_component_el_drawer, {
|
|
modelValue: unref(drawerVisible),
|
|
"onUpdate:modelValue": _cache[12] || (_cache[12] = ($event) => isRef(drawerVisible) ? drawerVisible.value = $event : null),
|
|
size: unref(drawerSize),
|
|
title: unref(t)("settings.project"),
|
|
"before-close": handleCloseDrawer,
|
|
class: "settings-drawer"
|
|
}, {
|
|
default: withCtx(() => [
|
|
createBaseVNode("div", _hoisted_1$1, [
|
|
createBaseVNode("section", _hoisted_2, [
|
|
createVNode(_component_el_divider, null, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(unref(t)("settings.theme")), 1)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createBaseVNode("div", _hoisted_3, [
|
|
createVNode(_component_el_switch, {
|
|
modelValue: unref(isDark),
|
|
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(isDark) ? isDark.value = $event : null),
|
|
"active-action-icon": "Moon",
|
|
"inactive-action-icon": "Sunny",
|
|
onChange: handleThemeChange
|
|
}, null, 8, ["modelValue"])
|
|
])
|
|
]),
|
|
createBaseVNode("section", _hoisted_4, [
|
|
createVNode(_component_el_divider, null, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(unref(t)("settings.layoutSetting")), 1)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createBaseVNode("div", _hoisted_5, [
|
|
createBaseVNode("div", _hoisted_6, [
|
|
(openBlock(), createElementBlock(Fragment, null, renderList(layoutOptions, (item) => {
|
|
return createVNode(_component_el_tooltip, {
|
|
key: item.value,
|
|
content: item.label,
|
|
placement: "bottom"
|
|
}, {
|
|
default: withCtx(() => [
|
|
createBaseVNode("div", {
|
|
role: "button",
|
|
tabindex: "0",
|
|
class: normalizeClass([
|
|
"layout-item",
|
|
item.className,
|
|
{
|
|
"is-active": unref(settingsStore).layout === item.value
|
|
}
|
|
]),
|
|
onClick: ($event) => handleLayoutChange(item.value),
|
|
onKeydown: withKeys(($event) => handleLayoutChange(item.value), ["enter", "space"])
|
|
}, [
|
|
createBaseVNode("div", _hoisted_8, [
|
|
item.value !== unref(LayoutMode).LEFT ? (openBlock(), createElementBlock("div", _hoisted_9)) : createCommentVNode("", true),
|
|
item.value !== unref(LayoutMode).TOP ? (openBlock(), createElementBlock("div", _hoisted_10)) : createCommentVNode("", true),
|
|
_cache[13] || (_cache[13] = createBaseVNode("div", { class: "layout-main" }, null, -1))
|
|
]),
|
|
createBaseVNode("div", _hoisted_11, toDisplayString(item.label), 1),
|
|
unref(settingsStore).layout === item.value ? (openBlock(), createElementBlock("div", _hoisted_12, [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(unref(check_default))
|
|
]),
|
|
_: 1
|
|
})
|
|
])) : createCommentVNode("", true)
|
|
], 42, _hoisted_7)
|
|
]),
|
|
_: 2
|
|
}, 1032, ["content"]);
|
|
}), 64))
|
|
])
|
|
])
|
|
]),
|
|
createBaseVNode("section", _hoisted_13, [
|
|
createVNode(_component_el_divider, null, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(unref(t)("settings.systemTheme")), 1)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createBaseVNode("div", _hoisted_14, [
|
|
createBaseVNode("div", _hoisted_15, [
|
|
createBaseVNode("div", _hoisted_16, [
|
|
createBaseVNode("span", _hoisted_17, toDisplayString(unref(t)("settings.themeColor")), 1)
|
|
]),
|
|
createBaseVNode("div", _hoisted_18, [
|
|
(openBlock(true), createElementBlock(Fragment, null, renderList(unref(displayColorPresets), (color) => {
|
|
return openBlock(), createElementBlock("div", {
|
|
key: color,
|
|
class: normalizeClass(["color-option", { "is-active": unref(selectedThemeColor) === color }]),
|
|
style: normalizeStyle({ backgroundColor: color }),
|
|
onClick: ($event) => handleColorSelect(color)
|
|
}, [
|
|
unref(selectedThemeColor) === color ? (openBlock(), createElementBlock("div", _hoisted_20, [
|
|
createVNode(_component_el_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(unref(check_default))
|
|
]),
|
|
_: 1
|
|
})
|
|
])) : createCommentVNode("", true)
|
|
], 14, _hoisted_19);
|
|
}), 128)),
|
|
createBaseVNode("div", _hoisted_21, [
|
|
createVNode(_component_el_color_picker, {
|
|
modelValue: unref(selectedThemeColor),
|
|
"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(selectedThemeColor) ? selectedThemeColor.value = $event : null),
|
|
predefine: unref(allColorPresets),
|
|
"show-alpha": "",
|
|
size: "small",
|
|
class: "custom-color-picker"
|
|
}, null, 8, ["modelValue", "predefine"])
|
|
])
|
|
])
|
|
])
|
|
])
|
|
]),
|
|
!unref(isDark) ? (openBlock(), createElementBlock("section", _hoisted_22, [
|
|
createVNode(_component_el_divider, null, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(unref(t)("settings.navigation")), 1)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createBaseVNode("div", _hoisted_23, [
|
|
createBaseVNode("span", _hoisted_24, toDisplayString(unref(t)("settings.sidebarColorScheme")), 1),
|
|
createVNode(_component_el_radio_group, {
|
|
modelValue: unref(sidebarColor),
|
|
"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isRef(sidebarColor) ? sidebarColor.value = $event : null),
|
|
onChange: changeSidebarColor
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_radio, {
|
|
value: unref(SidebarColor).CLASSIC_BLUE
|
|
}, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(unref(t)("settings.classicBlue")), 1)
|
|
]),
|
|
_: 1
|
|
}, 8, ["value"]),
|
|
createVNode(_component_el_radio, {
|
|
value: unref(SidebarColor).MINIMAL_WHITE
|
|
}, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(unref(t)("settings.minimalWhite")), 1)
|
|
]),
|
|
_: 1
|
|
}, 8, ["value"])
|
|
]),
|
|
_: 1
|
|
}, 8, ["modelValue"])
|
|
])
|
|
])) : createCommentVNode("", true),
|
|
createBaseVNode("section", _hoisted_25, [
|
|
createVNode(_component_el_divider, null, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(unref(t)("settings.interface")), 1)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createBaseVNode("div", _hoisted_26, [
|
|
createBaseVNode("span", _hoisted_27, toDisplayString(unref(t)("settings.showTagsView")), 1),
|
|
createVNode(_component_el_switch, {
|
|
modelValue: unref(settingsStore).showTagsView,
|
|
"onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => unref(settingsStore).showTagsView = $event)
|
|
}, null, 8, ["modelValue"])
|
|
]),
|
|
createBaseVNode("div", _hoisted_28, [
|
|
createBaseVNode("span", _hoisted_29, toDisplayString(unref(t)("settings.showAppLogo")), 1),
|
|
createVNode(_component_el_switch, {
|
|
modelValue: unref(settingsStore).showAppLogo,
|
|
"onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => unref(settingsStore).showAppLogo = $event)
|
|
}, null, 8, ["modelValue"])
|
|
]),
|
|
createBaseVNode("div", _hoisted_30, [
|
|
createBaseVNode("span", _hoisted_31, toDisplayString(unref(t)("settings.showWatermark")), 1),
|
|
createVNode(_component_el_switch, {
|
|
modelValue: unref(settingsStore).showWatermark,
|
|
"onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => unref(settingsStore).showWatermark = $event)
|
|
}, null, 8, ["modelValue"])
|
|
]),
|
|
createVNode(_component_el_divider, null, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(unref(t)("settings.showDesktopTools")), 1)
|
|
]),
|
|
_: 1
|
|
}),
|
|
createBaseVNode("div", _hoisted_32, [
|
|
createBaseVNode("span", _hoisted_33, toDisplayString(unref(t)("settings.showMenuSearch")), 1),
|
|
createVNode(_component_el_switch, {
|
|
modelValue: unref(settingsStore).showMenuSearch,
|
|
"onUpdate:modelValue": _cache[6] || (_cache[6] = ($event) => unref(settingsStore).showMenuSearch = $event)
|
|
}, null, 8, ["modelValue"])
|
|
]),
|
|
createBaseVNode("div", _hoisted_34, [
|
|
createBaseVNode("span", _hoisted_35, toDisplayString(unref(t)("settings.showFullscreen")), 1),
|
|
createVNode(_component_el_switch, {
|
|
modelValue: unref(settingsStore).showFullscreen,
|
|
"onUpdate:modelValue": _cache[7] || (_cache[7] = ($event) => unref(settingsStore).showFullscreen = $event)
|
|
}, null, 8, ["modelValue"])
|
|
]),
|
|
createBaseVNode("div", _hoisted_36, [
|
|
createBaseVNode("span", _hoisted_37, toDisplayString(unref(t)("settings.showSizeSelect")), 1),
|
|
createVNode(_component_el_switch, {
|
|
modelValue: unref(settingsStore).showSizeSelect,
|
|
"onUpdate:modelValue": _cache[8] || (_cache[8] = ($event) => unref(settingsStore).showSizeSelect = $event)
|
|
}, null, 8, ["modelValue"])
|
|
]),
|
|
createBaseVNode("div", _hoisted_38, [
|
|
createBaseVNode("span", _hoisted_39, toDisplayString(unref(t)("settings.showLangSelect")), 1),
|
|
createVNode(_component_el_switch, {
|
|
modelValue: unref(settingsStore).showLangSelect,
|
|
"onUpdate:modelValue": _cache[9] || (_cache[9] = ($event) => unref(settingsStore).showLangSelect = $event)
|
|
}, null, 8, ["modelValue"])
|
|
]),
|
|
createBaseVNode("div", _hoisted_40, [
|
|
createBaseVNode("span", _hoisted_41, toDisplayString(unref(t)("settings.showNotification")), 1),
|
|
createVNode(_component_el_switch, {
|
|
modelValue: unref(settingsStore).showNotification,
|
|
"onUpdate:modelValue": _cache[10] || (_cache[10] = ($event) => unref(settingsStore).showNotification = $event)
|
|
}, null, 8, ["modelValue"])
|
|
]),
|
|
createBaseVNode("div", _hoisted_42, [
|
|
createBaseVNode("span", _hoisted_43, toDisplayString(unref(t)("settings.showGuide")), 1),
|
|
createVNode(_component_el_switch, {
|
|
modelValue: unref(settingsStore).showGuide,
|
|
"onUpdate:modelValue": _cache[11] || (_cache[11] = ($event) => unref(settingsStore).showGuide = $event)
|
|
}, null, 8, ["modelValue"])
|
|
])
|
|
])
|
|
]),
|
|
createBaseVNode("div", _hoisted_44, [
|
|
_cache[14] || (_cache[14] = createBaseVNode("div", { class: "action-divider" }, null, -1)),
|
|
createBaseVNode("div", _hoisted_45, [
|
|
createBaseVNode("div", _hoisted_46, [
|
|
createVNode(_component_el_tooltip, {
|
|
content: "复制配置将生成当前设置的代码，覆盖 src/settings.ts 下的 defaultSettings 变量",
|
|
placement: "top"
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_button, {
|
|
type: "primary",
|
|
size: "default",
|
|
icon: unref(copyIcon),
|
|
loading: unref(copyLoading),
|
|
class: "action-btn",
|
|
onClick: handleCopySettings
|
|
}, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(unref(copyLoading) ? "复制中..." : unref(t)("settings.copyConfig")), 1)
|
|
]),
|
|
_: 1
|
|
}, 8, ["icon", "loading"])
|
|
]),
|
|
_: 1
|
|
}),
|
|
createVNode(_component_el_tooltip, {
|
|
content: "重置将恢复所有设置为默认值",
|
|
placement: "top"
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_el_button, {
|
|
type: "warning",
|
|
size: "default",
|
|
icon: unref(resetIcon),
|
|
loading: unref(resetLoading),
|
|
class: "action-btn",
|
|
onClick: handleResetSettings
|
|
}, {
|
|
default: withCtx(() => [
|
|
createTextVNode(toDisplayString(unref(resetLoading) ? "重置中..." : unref(t)("settings.resetConfig")), 1)
|
|
]),
|
|
_: 1
|
|
}, 8, ["icon", "loading"])
|
|
]),
|
|
_: 1
|
|
})
|
|
])
|
|
])
|
|
])
|
|
]),
|
|
_: 1
|
|
}, 8, ["modelValue", "size", "title"]);
|
|
};
|
|
}
|
|
});
|
|
const Settings = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-2e322e92"]]);
|
|
const _hoisted_1 = { class: "layout-wrapper" };
|
|
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
__name: "index",
|
|
setup(__props) {
|
|
const { currentLayout } = useLayout();
|
|
const currentLayoutComponent = computed(() => {
|
|
switch (currentLayout.value) {
|
|
case LayoutMode.TOP:
|
|
return TopLayout;
|
|
case LayoutMode.MIX:
|
|
return MixLayout;
|
|
case LayoutMode.LEFT:
|
|
default:
|
|
return LeftLayout;
|
|
}
|
|
});
|
|
const isShowSettings = computed(() => defaultSettings.showSettings);
|
|
return (_ctx, _cache) => {
|
|
return openBlock(), createElementBlock("div", _hoisted_1, [
|
|
(openBlock(), createBlock(resolveDynamicComponent(currentLayoutComponent.value))),
|
|
isShowSettings.value ? (openBlock(), createBlock(Settings, { key: 0 })) : createCommentVNode("", true)
|
|
]);
|
|
};
|
|
}
|
|
});
|
|
const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9cb39833"]]);
|
|
export {
|
|
index as default
|
|
};
|