新增一套主题geeker；优化路径别名引用，增加preload预加载内容
This commit is contained in:
fm453
parent
cceffc112c
commit
c127842c7c
46
.electron-vite/geeker/getEnv.ts
Normal file
46
.electron-vite/geeker/getEnv.ts
Normal file
@ -0,0 +1,46 @@
|
||||
import path from "path";
|
||||
|
||||
export function isDevFn(mode: string): boolean {
|
||||
return mode === "development";
|
||||
}
|
||||
|
||||
export function isProdFn(mode: string): boolean {
|
||||
return mode === "production";
|
||||
}
|
||||
|
||||
export function isTestFn(mode: string): boolean {
|
||||
return mode === "test";
|
||||
}
|
||||
|
||||
/**
|
||||
* Whether to generate package preview
|
||||
*/
|
||||
export function isReportMode(): boolean {
|
||||
return process.env.VITE_REPORT === "true";
|
||||
}
|
||||
|
||||
// Read all environment variable configuration files to process.env
|
||||
export function wrapperEnv(envConf: Recordable): ViteEnv {
|
||||
const ret: any = {};
|
||||
|
||||
for (const envName of Object.keys(envConf)) {
|
||||
let realName = envConf[envName].replace(/\\n/g, "\n");
|
||||
realName = realName === "true" ? true : realName === "false" ? false : realName;
|
||||
if (envName === "VITE_PORT") realName = Number(realName);
|
||||
if (envName === "VITE_PROXY") {
|
||||
try {
|
||||
realName = JSON.parse(realName);
|
||||
} catch (error) {}
|
||||
}
|
||||
ret[envName] = realName;
|
||||
}
|
||||
return ret;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get user root directory
|
||||
* @param dir file path
|
||||
*/
|
||||
export function getRootPath(...dir: string[]) {
|
||||
return path.resolve(process.cwd(), ...dir);
|
||||
}
|
||||
109
.electron-vite/geeker/plugins.ts
Normal file
109
.electron-vite/geeker/plugins.ts
Normal file
@ -0,0 +1,109 @@
|
||||
import { resolve } from "path";
|
||||
import { PluginOption } from "vite";
|
||||
import { VitePWA } from "vite-plugin-pwa";
|
||||
import { createHtmlPlugin } from "vite-plugin-html";
|
||||
import { visualizer } from "rollup-plugin-visualizer";
|
||||
import { createSvgIconsPlugin } from "vite-plugin-svg-icons";
|
||||
import vue from "@vitejs/plugin-vue";
|
||||
import vueJsx from "@vitejs/plugin-vue-jsx";
|
||||
import viteCompression from "vite-plugin-compression";
|
||||
import vueSetupExtend from "unplugin-vue-setup-extend-plus/vite";
|
||||
import NextDevTools from "vite-plugin-vue-devtools";
|
||||
|
||||
/**
|
||||
* 创建 vite 插件
|
||||
* @param viteEnv
|
||||
*/
|
||||
export const createVitePlugins = (viteEnv: ViteEnv): (PluginOption | PluginOption[])[] => {
|
||||
const { VITE_GLOB_APP_TITLE, VITE_REPORT, VITE_DEVTOOLS, VITE_PWA } = viteEnv;
|
||||
return [
|
||||
vue(),
|
||||
// vue 可以使用 jsx/tsx 语法
|
||||
vueJsx(),
|
||||
// devTools
|
||||
VITE_DEVTOOLS && NextDevTools({ launchEditor: "code" }),
|
||||
// name 可以写在 script 标签上
|
||||
vueSetupExtend({}),
|
||||
// 创建打包压缩配置
|
||||
createCompression(viteEnv),
|
||||
// 注入变量到 html 文件
|
||||
createHtmlPlugin({
|
||||
minify: true,
|
||||
inject: {
|
||||
data: { title: VITE_GLOB_APP_TITLE }
|
||||
}
|
||||
}),
|
||||
// 使用 svg 图标
|
||||
createSvgIconsPlugin({
|
||||
iconDirs: [resolve(process.cwd(), "src/assets/icons")],
|
||||
symbolId: "icon-[dir]-[name]"
|
||||
}),
|
||||
// vitePWA
|
||||
VITE_PWA && createVitePwa(viteEnv),
|
||||
// 是否生成包预览，分析依赖包大小做优化处理
|
||||
VITE_REPORT && (visualizer({ filename: "stats.html", gzipSize: true, brotliSize: true }) as PluginOption)
|
||||
];
|
||||
};
|
||||
|
||||
/**
|
||||
* @description 根据 compress 配置，生成不同的压缩规则
|
||||
* @param viteEnv
|
||||
*/
|
||||
const createCompression = (viteEnv: ViteEnv): PluginOption | PluginOption[] => {
|
||||
const { VITE_BUILD_COMPRESS = "none", VITE_BUILD_COMPRESS_DELETE_ORIGIN_FILE } = viteEnv;
|
||||
const compressList = VITE_BUILD_COMPRESS.split(",");
|
||||
const plugins: PluginOption[] = [];
|
||||
if (compressList.includes("gzip")) {
|
||||
plugins.push(
|
||||
viteCompression({
|
||||
ext: ".gz",
|
||||
algorithm: "gzip",
|
||||
deleteOriginFile: VITE_BUILD_COMPRESS_DELETE_ORIGIN_FILE
|
||||
})
|
||||
);
|
||||
}
|
||||
if (compressList.includes("brotli")) {
|
||||
plugins.push(
|
||||
viteCompression({
|
||||
ext: ".br",
|
||||
algorithm: "brotliCompress",
|
||||
deleteOriginFile: VITE_BUILD_COMPRESS_DELETE_ORIGIN_FILE
|
||||
})
|
||||
);
|
||||
}
|
||||
return plugins;
|
||||
};
|
||||
|
||||
/**
|
||||
* @description VitePwa
|
||||
* @param viteEnv
|
||||
*/
|
||||
const createVitePwa = (viteEnv: ViteEnv): PluginOption | PluginOption[] => {
|
||||
const { VITE_GLOB_APP_TITLE } = viteEnv;
|
||||
return VitePWA({
|
||||
registerType: "autoUpdate",
|
||||
manifest: {
|
||||
name: VITE_GLOB_APP_TITLE,
|
||||
short_name: VITE_GLOB_APP_TITLE,
|
||||
theme_color: "#ffffff",
|
||||
icons: [
|
||||
{
|
||||
src: "/logo.png",
|
||||
sizes: "192x192",
|
||||
type: "image/png"
|
||||
},
|
||||
{
|
||||
src: "/logo.png",
|
||||
sizes: "512x512",
|
||||
type: "image/png"
|
||||
},
|
||||
{
|
||||
src: "/logo.png",
|
||||
sizes: "512x512",
|
||||
type: "image/png",
|
||||
purpose: "any maskable"
|
||||
}
|
||||
]
|
||||
}
|
||||
});
|
||||
};
|
||||
30
.electron-vite/geeker/proxy.ts
Normal file
30
.electron-vite/geeker/proxy.ts
Normal file
@ -0,0 +1,30 @@
|
||||
import type { ProxyOptions } from "vite";
|
||||
|
||||
type ProxyItem = [string, string];
|
||||
|
||||
type ProxyList = ProxyItem[];
|
||||
|
||||
type ProxyTargetList = Record<string, ProxyOptions>;
|
||||
|
||||
/**
|
||||
* 创建代理，用于解析 .env.development 代理配置
|
||||
* @param list
|
||||
*/
|
||||
export function createProxy(list: ProxyList = []) {
|
||||
const ret: ProxyTargetList = {};
|
||||
for (const [prefix, target] of list) {
|
||||
const httpsRE = /^https:\/\//;
|
||||
const isHttps = httpsRE.test(target);
|
||||
|
||||
// https://github.com/http-party/node-http-proxy#options
|
||||
ret[prefix] = {
|
||||
target: target,
|
||||
changeOrigin: true,
|
||||
ws: true,
|
||||
rewrite: path => path.replace(new RegExp(`^${prefix}`), ""),
|
||||
// https is require secure=false
|
||||
...(isHttps ? { secure: false } : {})
|
||||
};
|
||||
}
|
||||
return ret;
|
||||
}
|
||||
170
.electron-vite/vite.config-element.mts
Normal file
170
.electron-vite/vite.config-element.mts
Normal file
@ -0,0 +1,170 @@
|
||||
import {join} from "path";
|
||||
import {UserConfig, ConfigEnv, loadEnv, defineConfig} from "vite";
|
||||
import vuePlugin from "@vitejs/plugin-vue";
|
||||
import vueJsx from "@vitejs/plugin-vue-jsx";
|
||||
import viteIkarosTools from "./plugin/vite-ikaros-tools";
|
||||
import {getConfig} from "./utils";
|
||||
|
||||
/**
|
||||
* 自动引用功能
|
||||
*/
|
||||
import AutoImport from "unplugin-auto-import/vite";
|
||||
import Components from "unplugin-vue-components/vite";
|
||||
import {ElementPlusResolver} from "unplugin-vue-components/resolvers";
|
||||
import Icons from "unplugin-icons/vite";
|
||||
import IconsResolver from "unplugin-icons/resolver";
|
||||
/**
|
||||
* SVG图标
|
||||
*/
|
||||
import {createSvgIconsPlugin} from "vite-plugin-svg-icons";
|
||||
|
||||
/**
|
||||
* univerJs插件
|
||||
*/
|
||||
import {univerPlugin} from "@univerjs/vite-plugin";
|
||||
|
||||
import UnoCSS from "unocss/vite";
|
||||
|
||||
/**
|
||||
* 需要预加载的资源
|
||||
*/
|
||||
import {preloads} from "./preloads";
|
||||
|
||||
function resolve(dir: string) {
|
||||
return join(__dirname, "..", dir);
|
||||
}
|
||||
|
||||
const config = getConfig();
|
||||
import pkg from "../package.json";
|
||||
|
||||
/** 平台的名称、版本、运行所需的`node`版本、依赖、构建时间的类型提示 */
|
||||
const __APP_INFO__ = {
|
||||
pkg: pkg,
|
||||
buildTimestamp: Date.now(),
|
||||
};
|
||||
|
||||
const root = resolve("src/renderer");
|
||||
const src = resolve("src");
|
||||
// const theme: string = resolve("src/renderer/themes/default");
|
||||
const theme: string = resolve("src/renderer/themes/geeker");
|
||||
const mode = config && config.NODE_ENV;
|
||||
|
||||
export default defineConfig({
|
||||
mode: mode,
|
||||
root: root,
|
||||
define: {
|
||||
__CONFIG__: config,
|
||||
__ISWEB__: Number(config && config.target),
|
||||
__APP_INFO__: JSON.stringify(__APP_INFO__),
|
||||
'process.env': process.env,
|
||||
},
|
||||
resolve: {
|
||||
alias: {
|
||||
"@": root,
|
||||
"@api": join(root, "/api"),
|
||||
"@config": join(src, "../config"),
|
||||
"@main": join(src, "/main"),
|
||||
"@mock": join(root, "/mock"),
|
||||
"@renderer": root,
|
||||
"@src": src,
|
||||
"@store": join(root, "/store/modules"),
|
||||
"@theme": theme
|
||||
},
|
||||
},
|
||||
base: "./",
|
||||
build: {
|
||||
outDir:
|
||||
config && config.target
|
||||
? resolve("dist/web")
|
||||
: resolve("dist/electron/renderer"),
|
||||
emptyOutDir: true,
|
||||
target: "esnext",
|
||||
cssCodeSplit: false,
|
||||
},
|
||||
css: {
|
||||
// CSS 预处理器
|
||||
preprocessorOptions: {
|
||||
// 定义全局 SCSS 变量
|
||||
scss: {
|
||||
javascriptEnabled: true,
|
||||
additionalData: `
|
||||
@use "@themeDefault/styles/variables.scss" as *;
|
||||
// @use "@themeGeeker/styles/var.scss" as *;
|
||||
`,
|
||||
},
|
||||
},
|
||||
},
|
||||
server: {
|
||||
// 无须配置
|
||||
},
|
||||
plugins: [
|
||||
vuePlugin(),
|
||||
// jsx、tsx语法支持
|
||||
vueJsx(),
|
||||
viteIkarosTools(),
|
||||
//CSS预处理
|
||||
UnoCSS({
|
||||
hmrTopLevelAwait: false,
|
||||
}),
|
||||
// univerjs的虚拟化插件技术，用于语言包的自动引用
|
||||
univerPlugin(),
|
||||
|
||||
// 自动导入参考： https://github.com/sxzz/element-plus-best-practices/blob/main/vite.config.ts
|
||||
AutoImport({
|
||||
// 自动导入 Vue 相关函数，如：ref, reactive, toRef 等
|
||||
imports: ["vue", "@vueuse/core", "pinia", "vue-router", "vue-i18n"],
|
||||
resolvers: [
|
||||
// 自动导入 Element Plus 相关函数，如：ElMessage, ElMessageBox... (带样式)
|
||||
ElementPlusResolver(),
|
||||
// 自动导入图标组件
|
||||
IconsResolver({}),
|
||||
],
|
||||
// 是否在 vue 模板中自动导入
|
||||
vueTemplate: true,
|
||||
// 指定自动导入函数TS类型声明文件路径 (false:关闭自动生成)
|
||||
// dts: false,
|
||||
dts: "fixTypes/auto-imports.d.ts",
|
||||
}),
|
||||
Components({
|
||||
resolvers: [
|
||||
// 自动导入 Element Plus 组件
|
||||
ElementPlusResolver(),
|
||||
/**
|
||||
* 自动注册图标组件
|
||||
*/
|
||||
IconsResolver({
|
||||
// element-plus图标库，其他图标库 https://icon-sets.iconify.design/
|
||||
enabledCollections: ["ep"],
|
||||
}),
|
||||
],
|
||||
/**
|
||||
* 指定自定义组件位置(默认:src/components)
|
||||
* TBD： resolve("@theme/components")，测试用法，效果未知
|
||||
*/
|
||||
dirs: ["src/components", join(theme, "/components"), join(theme, "/**/components")],
|
||||
// 指定自动导入组件TS类型声明文件路径 (false:关闭自动生成)
|
||||
// dts: false,
|
||||
dts: "fixTypes/components.d.ts",
|
||||
}),
|
||||
Icons({
|
||||
// 自动安装图标库
|
||||
autoInstall: true,
|
||||
}),
|
||||
createSvgIconsPlugin({
|
||||
// 指定需要缓存的图标文件夹
|
||||
iconDirs: [join(theme, "assets/icons")],
|
||||
// 指定symbolId格式
|
||||
symbolId: "icon-[dir]-[name]",
|
||||
}),
|
||||
|
||||
// node({
|
||||
// // 默认情况下，`node` 插件会重写 `process` 和全局变量。
|
||||
// // 如果你不想要这个行为，可以将 `mock` 设置为 `false`。
|
||||
// mock: true,
|
||||
//
|
||||
// // 如果你想要包括一些特定的Node.js全局变量，可以在 `additional` 中指定。
|
||||
// additional: ['process', 'fs', 'path']
|
||||
// })
|
||||
],
|
||||
optimizeDeps: preloads,
|
||||
});
|
||||
14
env/DEL-env
vendored
Normal file
14
env/DEL-env
vendored
Normal file
@ -0,0 +1,14 @@
|
||||
# title
|
||||
VITE_GLOB_APP_TITLE = Geeker Admin
|
||||
|
||||
# 本地运行端口号
|
||||
VITE_PORT = 8848
|
||||
|
||||
# 启动时自动打开浏览器
|
||||
VITE_OPEN = true
|
||||
|
||||
# 开启 devTools 调试
|
||||
VITE_DEVTOOLS = false
|
||||
|
||||
# 打包后是否生成包分析文件
|
||||
VITE_REPORT = false
|
||||
23
env/DEL-env.development
vendored
Normal file
23
env/DEL-env.development
vendored
Normal file
@ -0,0 +1,23 @@
|
||||
# 本地环境
|
||||
VITE_USER_NODE_ENV = development
|
||||
|
||||
# 公共基础路径
|
||||
VITE_PUBLIC_PATH = /
|
||||
|
||||
# 路由模式
|
||||
# Optional: hash | history
|
||||
VITE_ROUTER_MODE = hash
|
||||
|
||||
# 打包时是否删除 console
|
||||
VITE_DROP_CONSOLE = true
|
||||
|
||||
# 是否开启 VitePWA
|
||||
VITE_PWA = false
|
||||
|
||||
# 开发环境接口地址
|
||||
VITE_API_URL = /api
|
||||
|
||||
# 开发环境跨域代理，支持配置多个
|
||||
VITE_PROXY = [["/api","https://mock.mengxuegu.com/mock/629d727e6163854a32e8307e"]]
|
||||
# VITE_PROXY = [["/api","https://www.fastmock.site/mock/f81e8333c1a9276214bcdbc170d9e0a0"]]
|
||||
# VITE_PROXY = [["/api-easymock","https://mock.mengxuegu.com"],["/api-fastmock","https://www.fastmock.site"]]
|
||||
25
env/DEL-env.production
vendored
Normal file
25
env/DEL-env.production
vendored
Normal file
@ -0,0 +1,25 @@
|
||||
# 线上环境
|
||||
VITE_USER_NODE_ENV=production
|
||||
|
||||
# 公共基础路径
|
||||
VITE_PUBLIC_PATH=/
|
||||
|
||||
# 路由模式
|
||||
# Optional: hash | history
|
||||
VITE_ROUTER_MODE=hash
|
||||
|
||||
# 是否启用 gzip 或 brotli 压缩打包，如果需要多个压缩规则，可以使用 “,” 分隔
|
||||
# Optional: gzip | brotli | none
|
||||
VITE_BUILD_COMPRESS = none
|
||||
|
||||
# 打包压缩后是否删除源文件
|
||||
VITE_BUILD_COMPRESS_DELETE_ORIGIN_FILE = false
|
||||
|
||||
# 打包时是否删除 console
|
||||
VITE_DROP_CONSOLE = true
|
||||
|
||||
# 是否开启 VitePWA
|
||||
VITE_PWA = true
|
||||
|
||||
# 线上环境接口地址
|
||||
VITE_API_URL="https://mock.mengxuegu.com/mock/629d727e6163854a32e8307e"
|
||||
25
env/DEL-env.test
vendored
Normal file
25
env/DEL-env.test
vendored
Normal file
@ -0,0 +1,25 @@
|
||||
# 测试环境
|
||||
VITE_USER_NODE_ENV = test
|
||||
|
||||
# 公共基础路径
|
||||
VITE_PUBLIC_PATH = /
|
||||
|
||||
# 路由模式
|
||||
# Optional: hash | history
|
||||
VITE_ROUTER_MODE = hash
|
||||
|
||||
# 是否启用 gzip 或 brotli 压缩打包，如果需要多个压缩规则，可以使用 “,” 分隔
|
||||
# Optional: gzip | brotli | none
|
||||
VITE_BUILD_COMPRESS = none
|
||||
|
||||
# 打包压缩后是否删除源文件
|
||||
VITE_BUILD_COMPRESS_DELETE_ORIGIN_FILE = false
|
||||
|
||||
# 打包时是否删除 console
|
||||
VITE_DROP_CONSOLE = true
|
||||
|
||||
# 是否开启 VitePWA
|
||||
VITE_PWA = false
|
||||
|
||||
# 测试环境接口地址
|
||||
VITE_API_URL = "https://mock.mengxuegu.com/mock/629d727e6163854a32e8307e"
|
||||
47
src/renderer/main-geeker.ts
Normal file
47
src/renderer/main-geeker.ts
Normal file
@ -0,0 +1,47 @@
|
||||
import { createApp } from "vue";
|
||||
import App from "./App.vue";
|
||||
|
||||
// reset style sheet
|
||||
import "@themeGeeker/styles/reset.scss";
|
||||
// CSS common style sheet
|
||||
import "@themeGeeker/styles/common.scss";
|
||||
// iconfont css
|
||||
import "@themeGeeker/assets/iconfont/iconfont.scss";
|
||||
// font css
|
||||
import "@themeGeeker/assets/fonts/font.scss";
|
||||
// element css
|
||||
import "element-plus/dist/index.css";
|
||||
// element dark css
|
||||
import "element-plus/theme-chalk/dark/css-vars.css";
|
||||
// custom element dark css
|
||||
import "@themeGeeker/styles/element-dark.scss";
|
||||
// custom element css
|
||||
import "@themeGeeker/styles/element.scss";
|
||||
import "uno.css";
|
||||
// svg icons
|
||||
import "virtual:svg-icons-register";
|
||||
// element plus
|
||||
import ElementPlus from "element-plus";
|
||||
// element icons
|
||||
import * as Icons from "@element-plus/icons-vue";
|
||||
// custom directives
|
||||
import directives from "@themeGeeker/directives/index";
|
||||
// vue Router
|
||||
import router from "@themeGeeker/routers";
|
||||
// vue i18n
|
||||
import I18n from "@themeGeeker/languages/index";
|
||||
// pinia store
|
||||
import pinia from "@themeGeeker/stores";
|
||||
// errorHandler
|
||||
import errorHandler from "@themeGeeker/utils/errorHandler";
|
||||
|
||||
const app = createApp(App);
|
||||
|
||||
app.config.errorHandler = errorHandler;
|
||||
|
||||
// register the element Icons component
|
||||
Object.keys(Icons).forEach(key => {
|
||||
app.component(key, Icons[key as keyof typeof Icons]);
|
||||
});
|
||||
|
||||
app.use(ElementPlus).use(directives).use(I18n).use(pinia).use(router).mount("#myApp");
|
||||
44
src/renderer/themes/geeker/App-theme.vue
Normal file
44
src/renderer/themes/geeker/App-theme.vue
Normal file
@ -0,0 +1,44 @@
|
||||
<template>
|
||||
<el-config-provider :locale="locale" :size="assemblySize" :button="buttonConfig">
|
||||
<router-view></router-view>
|
||||
</el-config-provider>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, computed } from "vue";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { getBrowserLang } from "./utils";
|
||||
import { useTheme } from "./hooks/useTheme";
|
||||
import { ElConfigProvider } from "element-plus";
|
||||
import { LanguageType } from "./stores/interface";
|
||||
import { useGlobalStore } from "./stores/modules/global";
|
||||
import en from "element-plus/es/locale/lang/en";
|
||||
import zhCn from "element-plus/es/locale/lang/zh-cn";
|
||||
|
||||
const globalStore = useGlobalStore();
|
||||
|
||||
// init theme
|
||||
const { initTheme } = useTheme();
|
||||
initTheme();
|
||||
|
||||
// init language
|
||||
const i18n = useI18n();
|
||||
onMounted(() => {
|
||||
const language = globalStore.language ?? getBrowserLang();
|
||||
i18n.locale.value = language;
|
||||
globalStore.setGlobalState("language", language as LanguageType);
|
||||
});
|
||||
|
||||
// element language
|
||||
const locale = computed(() => {
|
||||
if (globalStore.language == "zh") return zhCn;
|
||||
if (globalStore.language == "en") return en;
|
||||
return getBrowserLang() == "zh" ? zhCn : en;
|
||||
});
|
||||
|
||||
// element assemblySize
|
||||
const assemblySize = computed(() => globalStore.assemblySize);
|
||||
|
||||
// element button config
|
||||
const buttonConfig = reactive({ autoInsertSpace: false });
|
||||
</script>
|
||||
44
src/renderer/themes/geeker/App.vue
Normal file
44
src/renderer/themes/geeker/App.vue
Normal file
@ -0,0 +1,44 @@
|
||||
<template>
|
||||
<el-config-provider :locale="locale" :size="assemblySize" :button="buttonConfig">
|
||||
<router-view></router-view>
|
||||
</el-config-provider>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, computed } from "vue";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { getBrowserLang } from "./utils";
|
||||
import { useTheme } from "./hooks/useTheme";
|
||||
import { ElConfigProvider } from "element-plus";
|
||||
import { LanguageType } from "./stores/interface";
|
||||
import { useGlobalStore } from "./stores/modules/global";
|
||||
import en from "element-plus/es/locale/lang/en";
|
||||
import zhCn from "element-plus/es/locale/lang/zh-cn";
|
||||
|
||||
const globalStore = useGlobalStore();
|
||||
|
||||
// init theme
|
||||
const { initTheme } = useTheme();
|
||||
initTheme();
|
||||
|
||||
// init language
|
||||
const i18n = useI18n();
|
||||
onMounted(() => {
|
||||
const language = globalStore.language ?? getBrowserLang();
|
||||
i18n.locale.value = language;
|
||||
globalStore.setGlobalState("language", language as LanguageType);
|
||||
});
|
||||
|
||||
// element language
|
||||
const locale = computed(() => {
|
||||
if (globalStore.language == "zh") return zhCn;
|
||||
if (globalStore.language == "en") return en;
|
||||
return getBrowserLang() == "zh" ? zhCn : en;
|
||||
});
|
||||
|
||||
// element assemblySize
|
||||
const assemblySize = computed(() => globalStore.assemblySize);
|
||||
|
||||
// element button config
|
||||
const buttonConfig = reactive({ autoInsertSpace: false });
|
||||
</script>
|
||||
3
src/renderer/themes/geeker/api/config/servicePort.ts
Normal file
3
src/renderer/themes/geeker/api/config/servicePort.ts
Normal file
@ -0,0 +1,3 @@
|
||||
// 后端微服务模块前缀
|
||||
export const PORT1 = "/geeker";
|
||||
export const PORT2 = "/hooks";
|
||||
55
src/renderer/themes/geeker/api/helper/axiosCancel.ts
Normal file
55
src/renderer/themes/geeker/api/helper/axiosCancel.ts
Normal file
@ -0,0 +1,55 @@
|
||||
import { CustomAxiosRequestConfig } from "../index";
|
||||
import qs from "qs";
|
||||
|
||||
// 声明一个 Map 用于存储每个请求的标识和取消函数
|
||||
let pendingMap = new Map<string, AbortController>();
|
||||
|
||||
// 序列化参数，确保对象属性顺序一致
|
||||
const sortedStringify = (obj: any) => {
|
||||
return qs.stringify(obj, { arrayFormat: "repeat", sort: (a, b) => a.localeCompare(b) });
|
||||
};
|
||||
|
||||
// 获取请求的唯一标识
|
||||
export const getPendingUrl = (config: CustomAxiosRequestConfig) => {
|
||||
return [config.method, config.url, sortedStringify(config.data), sortedStringify(config.params)].join("&");
|
||||
};
|
||||
|
||||
export class AxiosCanceler {
|
||||
/**
|
||||
* @description: 添加请求
|
||||
* @param {Object} config
|
||||
* @return void
|
||||
*/
|
||||
addPending(config: CustomAxiosRequestConfig) {
|
||||
// 在请求开始前，对之前的请求做检查取消操作
|
||||
this.removePending(config);
|
||||
const url = getPendingUrl(config);
|
||||
const controller = new AbortController();
|
||||
config.signal = controller.signal;
|
||||
pendingMap.set(url, controller);
|
||||
}
|
||||
|
||||
/**
|
||||
* @description: 移除请求
|
||||
* @param {Object} config
|
||||
*/
|
||||
removePending(config: CustomAxiosRequestConfig) {
|
||||
const url = getPendingUrl(config);
|
||||
// 如果在 pending 中存在当前请求标识，需要取消当前请求并删除条目
|
||||
const controller = pendingMap.get(url);
|
||||
if (controller) {
|
||||
controller.abort();
|
||||
pendingMap.delete(url);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @description: 清空所有pending
|
||||
*/
|
||||
removeAllPending() {
|
||||
pendingMap.forEach(controller => {
|
||||
controller && controller.abort();
|
||||
});
|
||||
pendingMap.clear();
|
||||
}
|
||||
}
|
||||
43
src/renderer/themes/geeker/api/helper/checkStatus.ts
Normal file
43
src/renderer/themes/geeker/api/helper/checkStatus.ts
Normal file
@ -0,0 +1,43 @@
|
||||
import { ElMessage } from "element-plus";
|
||||
|
||||
/**
|
||||
* @description: 校验网络请求状态码
|
||||
* @param {Number} status
|
||||
* @return void
|
||||
*/
|
||||
export const checkStatus = (status: number) => {
|
||||
switch (status) {
|
||||
case 400:
|
||||
ElMessage.error("请求失败！请您稍后重试");
|
||||
break;
|
||||
case 401:
|
||||
ElMessage.error("登录失效！请您重新登录");
|
||||
break;
|
||||
case 403:
|
||||
ElMessage.error("当前账号无权限访问！");
|
||||
break;
|
||||
case 404:
|
||||
ElMessage.error("你所访问的资源不存在！");
|
||||
break;
|
||||
case 405:
|
||||
ElMessage.error("请求方式错误！请您稍后重试");
|
||||
break;
|
||||
case 408:
|
||||
ElMessage.error("请求超时！请您稍后重试");
|
||||
break;
|
||||
case 500:
|
||||
ElMessage.error("服务异常！");
|
||||
break;
|
||||
case 502:
|
||||
ElMessage.error("网关错误！");
|
||||
break;
|
||||
case 503:
|
||||
ElMessage.error("服务不可用！");
|
||||
break;
|
||||
case 504:
|
||||
ElMessage.error("网关超时！");
|
||||
break;
|
||||
default:
|
||||
ElMessage.error("请求失败！");
|
||||
}
|
||||
};
|
||||
120
src/renderer/themes/geeker/api/index.ts
Normal file
120
src/renderer/themes/geeker/api/index.ts
Normal file
@ -0,0 +1,120 @@
|
||||
import axios, { AxiosInstance, AxiosError, AxiosRequestConfig, InternalAxiosRequestConfig, AxiosResponse } from "axios";
|
||||
import { showFullScreenLoading, tryHideFullScreenLoading } from "@themeGeeker/components/Loading/fullScreen";
|
||||
import { LOGIN_URL } from "@themeGeeker/config";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { ResultData } from "@themeGeeker/api/interface";
|
||||
import { ResultEnum } from "@themeGeeker/enums/httpEnum";
|
||||
import { checkStatus } from "./helper/checkStatus";
|
||||
import { AxiosCanceler } from "./helper/axiosCancel";
|
||||
import { useUserStore } from "@themeGeeker/stores/modules/user";
|
||||
import router from "@themeGeeker/routers";
|
||||
|
||||
export interface CustomAxiosRequestConfig extends InternalAxiosRequestConfig {
|
||||
loading?: boolean;
|
||||
cancel?: boolean;
|
||||
}
|
||||
|
||||
const config = {
|
||||
// 默认地址请求地址，可在 .env.** 文件中修改
|
||||
baseURL: import.meta.env.VITE_API_URL as string,
|
||||
// 设置超时时间
|
||||
timeout: ResultEnum.TIMEOUT as number,
|
||||
// 跨域时候允许携带凭证
|
||||
withCredentials: true
|
||||
};
|
||||
|
||||
const axiosCanceler = new AxiosCanceler();
|
||||
|
||||
class RequestHttp {
|
||||
service: AxiosInstance;
|
||||
public constructor(config: AxiosRequestConfig) {
|
||||
// instantiation
|
||||
this.service = axios.create(config);
|
||||
// console.log(config)
|
||||
|
||||
/**
|
||||
* @description 请求拦截器
|
||||
* 客户端发送请求 -> [请求拦截器] -> 服务器
|
||||
* token校验(JWT) : 接受服务器返回的 token,存储到 vuex/pinia/本地储存当中
|
||||
*/
|
||||
this.service.interceptors.request.use(
|
||||
(config: CustomAxiosRequestConfig) => {
|
||||
const userStore = useUserStore();
|
||||
// 重复请求不需要取消，在 api 服务中通过指定的第三个参数: { cancel: false } 来控制
|
||||
config.cancel ??= true;
|
||||
config.cancel && axiosCanceler.addPending(config);
|
||||
// 当前请求不需要显示 loading，在 api 服务中通过指定的第三个参数: { loading: false } 来控制
|
||||
config.loading ??= true;
|
||||
config.loading && showFullScreenLoading();
|
||||
if (config.headers && typeof config.headers.set === "function") {
|
||||
config.headers.set("x-access-token", userStore.token);
|
||||
}
|
||||
return config;
|
||||
},
|
||||
(error: AxiosError) => {
|
||||
return Promise.reject(error);
|
||||
}
|
||||
);
|
||||
|
||||
/**
|
||||
* @description 响应拦截器
|
||||
* 服务器换返回信息 -> [拦截统一处理] -> 客户端JS获取到信息
|
||||
*/
|
||||
this.service.interceptors.response.use(
|
||||
(response: AxiosResponse & { config: CustomAxiosRequestConfig }) => {
|
||||
const { data, config } = response;
|
||||
|
||||
const userStore = useUserStore();
|
||||
axiosCanceler.removePending(config);
|
||||
config.loading && tryHideFullScreenLoading();
|
||||
// 登录失效
|
||||
if (data.code == ResultEnum.OVERDUE) {
|
||||
userStore.setToken("");
|
||||
router.replace(LOGIN_URL);
|
||||
ElMessage.error(data.msg);
|
||||
return Promise.reject(data);
|
||||
}
|
||||
// 全局错误信息拦截（防止下载文件的时候返回数据流，没有 code 直接报错）
|
||||
if (data.code && data.code !== ResultEnum.SUCCESS) {
|
||||
ElMessage.error(data.msg);
|
||||
return Promise.reject(data);
|
||||
}
|
||||
// 成功请求（在页面上除非特殊情况，否则不用处理失败逻辑）
|
||||
return data;
|
||||
},
|
||||
async (error: AxiosError) => {
|
||||
const { response } = error;
|
||||
tryHideFullScreenLoading();
|
||||
// 请求超时 && 网络错误单独判断，没有 response
|
||||
if (error.message.indexOf("timeout") !== -1) ElMessage.error("请求超时！请您稍后重试");
|
||||
if (error.message.indexOf("Network Error") !== -1) ElMessage.error("网络错误！请您稍后重试");
|
||||
// 根据服务器响应的错误状态码，做不同的处理
|
||||
if (response) checkStatus(response.status);
|
||||
// 服务器结果都没有返回(可能服务器错误可能客户端断网)，断网处理:可以跳转到断网页面
|
||||
if (!window.navigator.onLine) router.replace("/500");
|
||||
return Promise.reject(error);
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* @description 常用请求方法封装
|
||||
*/
|
||||
get<T>(url: string, params?: object, _object = {}): Promise<ResultData<T>> {
|
||||
return this.service.get(url, { params, ..._object });
|
||||
}
|
||||
post<T>(url: string, params?: object | string, _object = {}): Promise<ResultData<T>> {
|
||||
return this.service.post(url, params, _object);
|
||||
}
|
||||
put<T>(url: string, params?: object, _object = {}): Promise<ResultData<T>> {
|
||||
return this.service.put(url, params, _object);
|
||||
}
|
||||
delete<T>(url: string, params?: any, _object = {}): Promise<ResultData<T>> {
|
||||
return this.service.delete(url, { params, ..._object });
|
||||
}
|
||||
download(url: string, params?: object, _object = {}): Promise<BlobPart> {
|
||||
return this.service.post(url, params, { ..._object, responseType: "blob" });
|
||||
}
|
||||
}
|
||||
|
||||
export default new RequestHttp(config);
|
||||
90
src/renderer/themes/geeker/api/interface/index.ts
Normal file
90
src/renderer/themes/geeker/api/interface/index.ts
Normal file
@ -0,0 +1,90 @@
|
||||
// 请求响应参数（不包含data）
|
||||
export interface Result {
|
||||
code: string;
|
||||
msg: string;
|
||||
}
|
||||
|
||||
// 请求响应参数（包含data）
|
||||
export interface ResultData<T = any> extends Result {
|
||||
data: T;
|
||||
}
|
||||
|
||||
// 分页响应参数
|
||||
export interface ResPage<T> {
|
||||
list: T[];
|
||||
pageNum: number;
|
||||
pageSize: number;
|
||||
total: number;
|
||||
}
|
||||
|
||||
// 分页请求参数
|
||||
export interface ReqPage {
|
||||
pageNum: number;
|
||||
pageSize: number;
|
||||
}
|
||||
|
||||
// 文件上传模块
|
||||
export namespace Upload {
|
||||
export interface ResFileUrl {
|
||||
fileUrl: string;
|
||||
}
|
||||
}
|
||||
|
||||
// 登录模块
|
||||
export namespace Login {
|
||||
export interface ReqLoginForm {
|
||||
username: string;
|
||||
password: string;
|
||||
}
|
||||
export interface ResLogin {
|
||||
access_token: string;
|
||||
}
|
||||
export interface ResAuthButtons {
|
||||
[key: string]: string[];
|
||||
}
|
||||
}
|
||||
|
||||
// 用户管理模块
|
||||
export namespace User {
|
||||
export interface ReqUserParams extends ReqPage {
|
||||
username: string;
|
||||
gender: number;
|
||||
idCard: string;
|
||||
email: string;
|
||||
address: string;
|
||||
createTime: string[];
|
||||
status: number;
|
||||
}
|
||||
export interface ResUserList {
|
||||
id: string;
|
||||
username: string;
|
||||
gender: number;
|
||||
user: { detail: { age: number } };
|
||||
idCard: string;
|
||||
email: string;
|
||||
address: string;
|
||||
createTime: string;
|
||||
status: number;
|
||||
avatar: string;
|
||||
photo: any[];
|
||||
children?: ResUserList[];
|
||||
}
|
||||
export interface ResStatus {
|
||||
userLabel: string;
|
||||
userValue: number;
|
||||
}
|
||||
export interface ResGender {
|
||||
genderLabel: string;
|
||||
genderValue: number;
|
||||
}
|
||||
export interface ResDepartment {
|
||||
id: string;
|
||||
name: string;
|
||||
children?: ResDepartment[];
|
||||
}
|
||||
export interface ResRole {
|
||||
id: string;
|
||||
name: string;
|
||||
children?: ResDepartment[];
|
||||
}
|
||||
}
|
||||
37
src/renderer/themes/geeker/api/modules/login.ts
Normal file
37
src/renderer/themes/geeker/api/modules/login.ts
Normal file
@ -0,0 +1,37 @@
|
||||
import { Login } from "@themeGeeker/api/interface/index";
|
||||
import { PORT1 } from "@themeGeeker/api/config/servicePort";
|
||||
import authMenuList from "@themeGeeker/assets/json/authMenuList.json";
|
||||
import authButtonList from "@themeGeeker/assets/json/authButtonList.json";
|
||||
import http from "@themeGeeker/api";
|
||||
|
||||
/**
|
||||
* @name 登录模块
|
||||
*/
|
||||
// 用户登录
|
||||
export const loginApi = (params: Login.ReqLoginForm) => {
|
||||
// return http.post<Login.ResLogin>(`/v1/auth/login`, params, { loading: false }); // 正常 post json 请求 ==> application/json
|
||||
return http.post<Login.ResLogin>(PORT1 + `/login`, params, { loading: false }); // 正常 post json 请求 ==> application/json
|
||||
// return http.post<Login.ResLogin>(PORT1 + `/login`, params, { loading: false }); // 控制当前请求不显示 loading
|
||||
// return http.post<Login.ResLogin>(PORT1 + `/login`, {}, { params }); // post 请求携带 query 参数 ==> ?username=admin&password=123456
|
||||
// return http.post<Login.ResLogin>(PORT1 + `/login`, qs.stringify(params)); // post 请求携带表单参数 ==> application/x-www-form-urlencoded
|
||||
// return http.get<Login.ResLogin>(PORT1 + `/login?${qs.stringify(params, { arrayFormat: "repeat" })}`); // get 请求可以携带数组等复杂参数
|
||||
};
|
||||
|
||||
// 获取菜单列表
|
||||
export const getAuthMenuListApi = () => {
|
||||
return http.get<Menu.MenuOptions[]>(PORT1 + `/menu/list`, {}, { loading: false });
|
||||
// 如果想让菜单变为本地数据，注释上一行代码，并引入本地 authMenuList.json 数据
|
||||
return authMenuList;
|
||||
};
|
||||
|
||||
// 获取按钮权限
|
||||
export const getAuthButtonListApi = () => {
|
||||
return http.get<Login.ResAuthButtons>(PORT1 + `/auth/buttons`, {}, { loading: false });
|
||||
// 如果想让按钮权限变为本地数据，注释上一行代码，并引入本地 authButtonList.json 数据
|
||||
return authButtonList;
|
||||
};
|
||||
|
||||
// 用户退出登录
|
||||
export const logoutApi = () => {
|
||||
return http.post(PORT1 + `/logout`);
|
||||
};
|
||||
16
src/renderer/themes/geeker/api/modules/upload.ts
Normal file
16
src/renderer/themes/geeker/api/modules/upload.ts
Normal file
@ -0,0 +1,16 @@
|
||||
import { Upload } from "@themeGeeker/api/interface/index";
|
||||
import { PORT1 } from "@themeGeeker/api/config/servicePort";
|
||||
import http from "@themeGeeker/api";
|
||||
|
||||
/**
|
||||
* @name 文件上传模块
|
||||
*/
|
||||
// 图片上传
|
||||
export const uploadImg = (params: FormData) => {
|
||||
return http.post<Upload.ResFileUrl>(PORT1 + `/file/upload/img`, params, { cancel: false });
|
||||
};
|
||||
|
||||
// 视频上传
|
||||
export const uploadVideo = (params: FormData) => {
|
||||
return http.post<Upload.ResFileUrl>(PORT1 + `/file/upload/video`, params, { cancel: false });
|
||||
};
|
||||
71
src/renderer/themes/geeker/api/modules/user.ts
Normal file
71
src/renderer/themes/geeker/api/modules/user.ts
Normal file
@ -0,0 +1,71 @@
|
||||
import { ResPage, User } from "@themeGeeker/api/interface/index";
|
||||
import { PORT1 } from "@themeGeeker/api/config/servicePort";
|
||||
import http from "@themeGeeker/api";
|
||||
|
||||
/**
|
||||
* @name 用户管理模块
|
||||
*/
|
||||
// 获取用户列表
|
||||
export const getUserList = (params: User.ReqUserParams) => {
|
||||
return http.post<ResPage<User.ResUserList>>(PORT1 + `/user/list`, params);
|
||||
};
|
||||
|
||||
// 获取树形用户列表
|
||||
export const getUserTreeList = (params: User.ReqUserParams) => {
|
||||
return http.post<ResPage<User.ResUserList>>(PORT1 + `/user/tree/list`, params);
|
||||
};
|
||||
|
||||
// 新增用户
|
||||
export const addUser = (params: { id: string }) => {
|
||||
return http.post(PORT1 + `/user/add`, params);
|
||||
};
|
||||
|
||||
// 批量添加用户
|
||||
export const BatchAddUser = (params: FormData) => {
|
||||
return http.post(PORT1 + `/user/import`, params);
|
||||
};
|
||||
|
||||
// 编辑用户
|
||||
export const editUser = (params: { id: string }) => {
|
||||
return http.post(PORT1 + `/user/edit`, params);
|
||||
};
|
||||
|
||||
// 删除用户
|
||||
export const deleteUser = (params: { id: string[] }) => {
|
||||
return http.post(PORT1 + `/user/delete`, params);
|
||||
};
|
||||
|
||||
// 切换用户状态
|
||||
export const changeUserStatus = (params: { id: string; status: number }) => {
|
||||
return http.post(PORT1 + `/user/change`, params);
|
||||
};
|
||||
|
||||
// 重置用户密码
|
||||
export const resetUserPassWord = (params: { id: string }) => {
|
||||
return http.post(PORT1 + `/user/rest_password`, params);
|
||||
};
|
||||
|
||||
// 导出用户数据
|
||||
export const exportUserInfo = (params: User.ReqUserParams) => {
|
||||
return http.download(PORT1 + `/user/export`, params);
|
||||
};
|
||||
|
||||
// 获取用户状态字典
|
||||
export const getUserStatus = () => {
|
||||
return http.get<User.ResStatus[]>(PORT1 + `/user/status`);
|
||||
};
|
||||
|
||||
// 获取用户性别字典
|
||||
export const getUserGender = () => {
|
||||
return http.get<User.ResGender[]>(PORT1 + `/user/gender`);
|
||||
};
|
||||
|
||||
// 获取用户部门列表
|
||||
export const getUserDepartment = () => {
|
||||
return http.get<User.ResDepartment[]>(PORT1 + `/user/department`, {}, { cancel: false });
|
||||
};
|
||||
|
||||
// 获取用户角色字典
|
||||
export const getUserRole = () => {
|
||||
return http.get<User.ResRole[]>(PORT1 + `/user/role`);
|
||||
};
|
||||
BIN
src/renderer/themes/geeker/assets/fonts/DIN.otf
Normal file
BIN
src/renderer/themes/geeker/assets/fonts/DIN.otf
Normal file
Binary file not shown.
BIN
src/renderer/themes/geeker/assets/fonts/MetroDF.ttf
Normal file
BIN
src/renderer/themes/geeker/assets/fonts/MetroDF.ttf
Normal file
Binary file not shown.
BIN
src/renderer/themes/geeker/assets/fonts/YouSheBiaoTiHei.ttf
Normal file
BIN
src/renderer/themes/geeker/assets/fonts/YouSheBiaoTiHei.ttf
Normal file
Binary file not shown.
14
src/renderer/themes/geeker/assets/fonts/font.scss
Normal file
14
src/renderer/themes/geeker/assets/fonts/font.scss
Normal file
@ -0,0 +1,14 @@
|
||||
@font-face {
|
||||
font-family: YouSheBiaoTiHei;
|
||||
src: url("./YouSheBiaoTiHei.ttf");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: MetroDF;
|
||||
src: url("./MetroDF.ttf");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: DIN;
|
||||
src: url("./DIN.otf");
|
||||
}
|
||||
51
src/renderer/themes/geeker/assets/iconfont/iconfont.scss
Normal file
51
src/renderer/themes/geeker/assets/iconfont/iconfont.scss
Normal file
@ -0,0 +1,51 @@
|
||||
@font-face {
|
||||
font-family: iconfont; /* Project id 2667653 */
|
||||
src: url("iconfont.ttf?t=1719667796161") format("truetype");
|
||||
}
|
||||
.iconfont {
|
||||
font-family: iconfont !important;
|
||||
font-size: 20px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
cursor: pointer;
|
||||
}
|
||||
.icon-yiwen::before {
|
||||
font-size: 15px;
|
||||
content: "\e693";
|
||||
}
|
||||
.icon-xiala::before {
|
||||
content: "\e62b";
|
||||
}
|
||||
.icon-tuichu::before {
|
||||
content: "\e645";
|
||||
}
|
||||
.icon-xiaoxi::before {
|
||||
font-size: 21.2px;
|
||||
content: "\e61f";
|
||||
}
|
||||
.icon-zhuti::before {
|
||||
font-size: 22.4px;
|
||||
content: "\e638";
|
||||
}
|
||||
.icon-sousuo::before {
|
||||
content: "\e611";
|
||||
}
|
||||
.icon-contentright::before {
|
||||
content: "\e8c9";
|
||||
}
|
||||
.icon-contentleft::before {
|
||||
content: "\e8ca";
|
||||
}
|
||||
.icon-fangda::before {
|
||||
content: "\e826";
|
||||
}
|
||||
.icon-suoxiao::before {
|
||||
content: "\e641";
|
||||
}
|
||||
.icon-zhongyingwen::before {
|
||||
content: "\e8cb";
|
||||
}
|
||||
.icon-huiche::before {
|
||||
content: "\e637";
|
||||
}
|
||||
BIN
src/renderer/themes/geeker/assets/iconfont/iconfont.ttf
Normal file
BIN
src/renderer/themes/geeker/assets/iconfont/iconfont.ttf
Normal file
Binary file not shown.
@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M574 342.8m-38.3 0a38.3 38.3 0 1 0 76.6 0 38.3 38.3 0 1 0-76.6 0Z" fill="#F2B843" /><path d="M627 697c15.2-20.7 45.3-294-45-383.3-3-6.1-0.4-13.5 5.7-16.5 6.2-3 13.5-0.5 16.5 5.7C689.8 370.2 719.9 573 705.1 697H627z" fill="#EA800C" /><path d="M617.8 307.4m-38.3 0a38.3 38.3 0 1 0 76.6 0 38.3 38.3 0 1 0-76.6 0Z" fill="#F2B843" /><path d="M608 272.5L461 502.8c-33.6-47.5-37.2-112.5-3.9-164.6 33.2-52.1 93.7-76.2 150.9-65.7z" fill="#3DC38A" /><path d="M742.5 132.3L569.9 299.8c-19.2-47.5-9.1-103.9 29.9-141.8 39.1-37.9 95.8-46.3 142.7-25.7z" fill="#2F9B77" /><path d="M608.7 289.2l-239.6 21.1c15.1-49 58.5-86.4 112.7-91.1 54.2-4.8 103.5 24.4 126.9 70z" fill="#2F9B77" /><path d="M594.7 269.9L408.5 168.4c35-28.6 85.2-34.8 127.3-11.9 42.1 23 64 68.6 58.9 113.4z" fill="#3DC38A" /><path d="M825.5 331.8l-271.4-31.4c28-51 84.9-82.7 146.3-75.6 61.3 7 109.5 51 125.1 107z" fill="#3DC38A" /><path d="M75.3 868.9c0-86.5 104.3-173 233-173s233 86.5 233 173h-466z" fill="#2F9B77" /><path d="M938.2 868.9c0-116.2-130.9-232.3-292.3-232.3S353.5 752.7 353.5 868.9h584.7z" fill="#3DC38A" /><path d="M858.9 701.5c-28.1-23.1-60.4-41.4-95.9-54.3-14.5-5.3-29.3-9.5-44.3-12.8 0.2-51.3-5.5-106.3-16.2-155.9-11.9-54.8-29.5-101.6-51.2-136.3 5.6-5.3 9.7-11.8 12.2-19.1l160.8 18.6c0.4 0 0.8 0.1 1.2 0.1 2.9 0 5.7-1.3 7.6-3.5 2.2-2.5 2.9-6 2-9.2-8.3-29.8-25.1-56.3-48.5-76.7-24-20.9-53.5-33.9-85.1-37.5-9.7-1.1-19.3-1.3-28.9-0.7l76.8-74.6c2.4-2.3 3.5-5.7 2.9-8.9-0.6-3.3-2.8-6-5.8-7.4-52.3-23-112.6-12.1-153.7 27.7-7.2 7-13.6 14.7-19.1 23.1-9.4-10.5-20.6-19.4-33.1-26.2-44.7-24.3-99-19.2-138.4 12.9-2.6 2.1-3.9 5.4-3.6 8.7s2.2 6.3 5.2 7.9l62.5 34c-50.2 9.8-91.2 46.2-106.6 96-1 3.2-0.3 6.6 1.8 9.2 1.9 2.4 4.8 3.7 7.8 3.7h0.9l94.5-8.3c-5.8 6.4-11 13.3-15.8 20.8-17.2 26.9-25.7 57.9-24.7 89.7 1 31 11 60.8 28.9 86 1.9 2.7 4.9 4.2 8.2 4.2h0.2c3.3-0.1 6.4-1.8 8.2-4.6L549 383.9c7.5 4.6 16.1 7.1 25.2 7.1 13.4 0 25.9-5.5 34.8-14.7 27.2 70.9 29.2 175.3 21.8 250.6-34.9 1.5-69.1 8.3-101.8 20.2-35.5 12.9-67.8 31.2-95.9 54.3-3.2 2.6-6.3 5.3-9.4 8.1-35.7-15.5-75.4-23.6-115.1-23.6-63.1 0-123.8 19.9-170.9 56.1-45.8 35.3-72.1 81.5-72.1 126.9 0 5.5 4.5 10 10 10h862.9c5.5 0 10-4.5 10-10-0.3-59.7-32.8-120.7-89.6-167.4z m-226.2-370c-3.3 2.1-7 3.4-10.9 3.9-1-6.4-3.2-12.5-6.5-17.9l27.6 3.2c-2.3 4.4-5.8 8.1-10.2 10.8z m66.6-96.8c27.6 3.2 53.3 14.5 74.3 32.7 16.6 14.5 29.4 32.4 37.5 52.6l-152.7-17.7c-0.4-0.1-0.8-0.2-1.2-0.2-0.4 0-0.8-0.1-1.2-0.1l-65.3-7.6c-1-0.3-2-0.4-2.9-0.3l-5.5-0.6c-0.1 0-0.2-0.1-0.3-0.1-0.7-0.1-1.3-0.2-2-0.2l-8.8-1c5.3-7.5 11.3-14.5 18-20.8 0.5-0.4 1-0.8 1.4-1.3 8.7-8 18.4-14.9 29.1-20.5 8-4.2 16.4-7.6 24.9-10.2 0.5-0.1 0.9-0.2 1.4-0.4 17-4.8 35.1-6.4 53.3-4.3z m-92.5-69.4c31.5-30.5 76.2-41.2 117.4-29l-87 84.4c-9.3 2.9-18.4 6.6-27.1 11.2-2.2 1.2-4.3 2.4-6.5 3.6-2.8-15.7-8.5-30.8-17-44.4 5.5-9.5 12.3-18.2 20.2-25.8z m-75.8 0.1c14.4 7.9 26.4 18.6 35.7 31.9 10.5 15.1 16.8 32.7 18.4 51-1.2 1-2.5 2-3.6 3l-74-40.3c-0.8-0.7-1.8-1.2-2.8-1.5l-77.2-42.1c31.3-18.8 70.6-20 103.5-2z m-48.2 63.8c5.2-0.5 10.3-0.6 15.4-0.4l68.2 37.1c-5.1 5.7-9.9 11.8-14.2 18.2l-60 5.3-108.1 9.5c17.8-39.1 55-66 98.7-69.7zM461.2 484c-24.3-43.9-23-97.5 4.5-140.6 8.5-13.4 19-24.9 31.3-34.4l48.3-4.2s0 0.1 0.1 0.1c1.5 3 4.4 5 7.7 5.3l17.8 2.1-32.1 50.3c-0.6 0.7-1 1.4-1.4 2.2L461.2 484zM574 371c-5.2 0-10.1-1.4-14.4-3.9l29.3-45.9 1.1-1.8c7.6 5.2 12.4 13.9 12.4 23.4v2.1c-0.1 1.8-0.5 3.8-1.1 6.1-0.2 0.6-0.4 1.1-0.6 1.7-4.2 10.9-14.8 18.3-26.7 18.3z m47.8-15.5c4.3-0.3 8.6-1.3 12.6-2.7 20.5 32.6 37.2 77.3 48.6 129.9 10.2 47.1 15.7 99.1 15.8 148-15.9-2.5-31.9-3.8-48.1-4 2.7-28.8 5.6-76.5 1.8-130.4-4-57.6-14.3-104.8-30.7-140.8zM149.6 757.9c43.6-33.5 99.9-52 158.7-52 34.2 0 68.3 6.5 99.4 18.8-38.4 40-61.1 87.2-63.9 134.2h-258c3.6-35.9 26.4-72.2 63.8-101z m391.7 101H363.8c3.4-50.5 32.8-101.8 81.7-142 26.4-21.7 56.6-38.8 90-50.9 35.4-12.8 72.5-19.4 110.4-19.4 37.9 0 75 6.5 110.3 19.4 33.4 12.1 63.6 29.3 90 50.9 48.9 40.2 78.2 91.5 81.6 142H541.3z" fill="#4D3500" /></svg>
|
||||
|
After Width: | Height: | Size: 4.1 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 10 KiB |
1
src/renderer/themes/geeker/assets/icons/xianxingditu.svg
Normal file
1
src/renderer/themes/geeker/assets/icons/xianxingditu.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 5.2 KiB |
@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M489.6 541.1V166l283.5 375.1H489.6" fill="#3DC38A" /><path d="M489.6 101.3l-323.2 491h323.2z" fill="#F2B843" /><path d="M489.6 715.7c-16.3 0-29.6-13.2-29.6-29.6V95c0-16.3 13.2-29.6 29.6-29.6 16.3 0 29.6 13.2 29.6 29.6v591.1c-0.1 16.3-13.3 29.6-29.6 29.6z" fill="#EA800C" /><path d="M489.6 608.4H145.3c-16.3 0-29.6-13.2-29.6-29.6 0-16.3 13.2-29.6 29.6-29.6h344.3c16.3 0 29.6 13.2 29.6 29.6-0.1 16.3-13.3 29.6-29.6 29.6z" fill="#EA800C" /><path d="M783.8 557.2H503.1c-16.3 0-29.6-13.2-29.6-29.6 0-16.3 13.2-29.6 29.6-29.6h280.7c16.3 0 29.6 13.2 29.6 29.6 0 16.3-13.3 29.6-29.6 29.6z" fill="#EA800C" /><path d="M752.4 759.8l-67-88.8c-7.9-10.5-20.3-16.7-33.5-16.7H302c-18.3 0-34.5 11.9-40 29.3l-25 76.2h515.4z" fill="#2F9B77" /><path d="M920.8 704.6c15.6-0.8 26.8 14.8 21.1 29.3l-54.5 138.8-28.6 72.8H133.7L81.5 775c-4.1-13.4 5.5-27 19.4-27.8l143.3-7.5 676.6-35.1z" fill="#3DC38A" /><path d="M802.3 791.8m-27 0a27 27 0 1 0 54 0 27 27 0 1 0-54 0Z" fill="#F2B843" /><path d="M947.5 707.7c-6.3-8.7-16.4-13.6-27.2-13.1l-196.8 10.2-30-39.9c-9.8-12.9-25.3-20.6-41.5-20.6H529.2v-77.1h254.7c21.8 0 39.6-17.8 39.6-39.6S805.7 488 783.9 488h-38.3L529.2 201.7V95c0-21.8-17.8-39.6-39.6-39.6S450 73.2 450 95v48.2L189.3 539.3h-44c-21.8 0-39.6 17.8-39.6 39.6s17.8 39.6 39.6 39.6H450v25.8H302c-22.7 0-42.6 14.6-49.5 36.2l-16.2 49.6-135.9 7.1c-9.7 0.6-18.5 5.5-24.1 13.5-5.6 8-7.1 17.9-4.3 27.2l52.2 170.5c1.3 4.2 5.2 7.1 9.6 7.1h725.1c4.1 0 7.8-2.5 9.3-6.3l28.6-72.8 54.5-138.8c3.8-10 2.4-21.2-3.8-29.9zM720.5 488H529.2V234.9L720.5 488zM450 179.6v359.7H213.3L450 179.6z m20 428.8c0-5.5-4.5-10-10-10-0.5 0-0.9 0-1.3 0.1H145.3c-10.8 0-19.6-8.8-19.6-19.6s8.8-19.6 19.6-19.6H460c5.5 0 10-4.5 10-10V95c0-10.8 8.8-19.6 19.6-19.6s19.6 8.8 19.6 19.6v403c0 5.5 4.5 10 10 10h264.7c10.8 0 19.6 8.8 19.6 19.6s-8.8 19.6-19.6 19.6H519.2c-5.5 0-10 4.5-10 10v87.1H470v-35.9z m-198.5 78.3s0-0.1 0 0c4.3-13.4 16.5-22.4 30.5-22.4h350c9.9 0 19.5 4.8 25.5 12.7l21.9 29.1L257.7 729l13.8-42.3z m661.1 43.5L878.1 869 852 935.5H141.1l-50-163.4c-1-3.4-0.5-7 1.6-9.9 2-2.9 5.3-4.8 8.8-5l141.5-7.4h0.6c0.6 0 1.1-0.1 1.7-0.1l473.6-24.6h0.7l201.7-10.5c4-0.2 7.6 1.5 9.9 4.8 2.3 3.2 2.8 7.2 1.4 10.8z" fill="#4D3500" /><path d="M802.3 754.8c-20.4 0-37 16.6-37 37s16.6 37 37 37 37-16.6 37-37-16.6-37-37-37z m0 54c-9.4 0-17-7.6-17-17s7.6-17 17-17 17 7.6 17 17-7.6 17-17 17z" fill="#4D3500" /></svg>
|
||||
|
After Width: | Height: | Size: 2.5 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 5.3 KiB |
@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M252.8 862.9h-73.4c-6.8 0-12.4-5.6-12.4-12.4V134.4c0-6.8 5.6-12.4 12.4-12.4h73.4l5.3 6.8v728.8l-5.3 5.3z" fill="#F2B843" /><path d="M338.5 942l-42.9-18.1-42.8 18.1v-79.1l7.5-5.3h71.3l7 5.3-0.1 79.1z" fill="#EA800C" /><path d="M844.6 327.9h-40.7l-5.3-5.8v-93.3l5.3-7.2h40.7c6.8 0 12.4 5.6 12.4 12.4v81.5c0 6.9-5.6 12.4-12.4 12.4z" fill="#F2B843" /><path d="M844.6 540.5h-40.7l-5.3-7.3v-90.6l5.3-8.4h40.7c6.8 0 12.4 5.6 12.4 12.4v81.5c0 6.8-5.6 12.4-12.4 12.4z" fill="#EA800C" /><path d="M844.6 753h-40.7l-5.3-6.7v-92.1l5.3-7.5h40.7c6.8 0 12.4 5.6 12.4 12.4v81.5c0 6.8-5.6 12.4-12.4 12.4z" fill="#2F9B77" /><path d="M791.8 862.9h-539V122h539.1c6.7 0 12 5.4 12 12v716.8c0 6.7-5.4 12.1-12.1 12.1z" fill="#3DC38A" /><path d="M680.3 661.1H343.7c-14 0-25.5-11.5-25.5-25.5s11.5-25.5 25.5-25.5h336.6c14 0 25.5 11.5 25.5 25.5s-11.5 25.5-25.5 25.5zM680.3 779.8H343.7c-14 0-25.5-11.5-25.5-25.5s11.5-25.5 25.5-25.5h336.6c14 0 25.5 11.5 25.5 25.5s-11.5 25.5-25.5 25.5z" fill="#2F9B77" /><path d="M594.8 511.1c-79.2 45.7-180.5 18.6-226.3-60.6S350 270 429.2 224.2s180.5-18.6 226.3 60.6 18.5 180.6-60.7 226.3z" fill="#3DC38A" /><path d="M523.7 318.1c-1.2 0.3-3.5 0.9-4.5 1.7-1.2 1 0.7 2.3 0 2.9-1.2 1-2.1 2.7-4.7 2.6-5.5-0.3-13.9-7.5-19-10.2 8.1-8.3-4.7-9.6-9.7-9.1-6.5 0.5-17.7 0-23.5 3.2-4.1 2.3-9.5 11.7-12.8 15.5-4.6 5.2-9.1 9.8-12.1 16-10.9 23 5.9 49.4 32.2 46.3 7.3-0.9 14.9-5.5 21.4 0.6 4.8 4.5 2.3 8.7 3.5 13.9 1.1 4.5 6.1 7.3 7.8 11.4 3.3 7.9 1.2 12.9-1.1 20.2-3.1 9.6 4.9 21 8 30.2 1.6 4.7 6.1 17.7 10.7 19.8 7.1 3.2 18.1-6.4 22.4-11.6 3.3-4.1 2.2-8.2 4.4-12 2.4-4.1 5.4-5.3 7.1-10.6 1.8-5.7 3.7-7.1 7.5-11.3 6.2-6.7 5.2-10.6 2.7-18.6-5.1-16.5 13.5-24.2 21.8-36.3 8.7-12.6-8.2-8.4-14.8-12.8-6.8-4.4-9.8-12.9-13.1-19.9s-6-17.5-11.4-23.3c-4.2-4.3-16.9-6.4-22.8-8.6zM609.2 428.8c-2.6 8.9-5.3 17.8-7.9 26.7-1.8 6.2-8.4 26.6-17.5 13.6-3.5-5-0.6-11.4 1.3-16 2.4-5.8-0.9-8.7 0.9-14.1 2-6.2 10-6.4 13.8-10.8 2.7-3 4.3-7.9 6.2-11.5 1 4 2.1 8.1 3.2 12.1z" fill="#F2B843" /><path d="M655.4 284.9c-28.5-49.4-78.7-78.5-131.6-82.4l-21.6 27.2-46.4 16.3-12.5 30.2 19.2 26.9 2-5.7c3.4-9.5 12.4-15.8 22.5-15.8h31.7l36.4 12.8 12.5 12v7.6l17.4 33.4 5.1-1.9c11-4 20.9-10.4 29.2-18.7l-4.2-6.3c-1.4-2 0.1-4.7 2.5-4.7h10.2c3 0 5.8 1.3 7.7 3.6l8.3 9.7c0.8 0.9 1.4 2 1.8 3.1l9.1 25.2 4.4-4.4c2.7-2.7 4.1-6.5 4.2-10.4 0-3.1 1.4-6.1 3.7-8.2l3.4-3c0.8-0.8 1.8-1.4 2.8-1.8-3.6-15.3-9.5-30.4-17.8-44.7zM407.6 291.3l7.9-8.5c5.8-6.2 7.4-15.2 4.2-23-3.4-8.3-10.9-13.6-19.2-14.8-29.2 26.5-47.4 62.2-52.6 100 6.2 5.4 12.6 11.2 12.6 11.7-0.1 1 23.2-2.9 23.2-2.9l-12-17.5 17.2-12.3 18.7-32.7zM423.8 456.4c7.5-2.4 11.6-10.4 9.1-17.9l-2.1-6.6c-0.9-2.9-0.9-5.9 0-8.8 2.7-8.1-2.4-16.8-10.8-18.4l-16.8-3.3-30.6-23.2-25.3 8.2c2.5 21.9 9.4 43.7 21.2 64.1 10.9 18.8 24.9 34.7 41 47.4l7.5-39.3 6.8-2.2z" fill="#2F9B77" /><path d="M844.6 337.9c12.4 0 22.4-10 22.4-22.4V234c0-12.4-10-22.4-22.4-22.4h-30.7V134c0-12.1-9.9-22-22-22H179.4c-12.4 0-22.4 10-22.4 22.4v716.1c0 12.4 10 22.4 22.4 22.4h63.4V942c0 3.4 1.7 6.5 4.5 8.3 2.8 1.9 6.3 2.2 9.4 0.9l38.9-16.5 39 16.5c1.2 0.5 2.6 0.8 3.9 0.8 1.9 0 3.9-0.6 5.5-1.7 2.8-1.9 4.5-5 4.5-8.3v-69.1h443.3c12.2 0 22.1-9.9 22.1-22.1V763h30.7c12.4 0 22.4-10 22.4-22.4v-81.5c0-12.4-10-22.4-22.4-22.4h-30.7v-86.2h30.7c12.4 0 22.4-10 22.4-22.4v-81.5c0-12.4-10-22.4-22.4-22.4h-30.7v-86.3h30.7z m0-106.3c1.3 0 2.4 1.1 2.4 2.4v81.5c0 1.3-1.1 2.4-2.4 2.4h-30.7v-86.3h30.7zM177 850.5V134.4c0-1.3 1.1-2.4 2.4-2.4h63.4v720.9h-63.4c-1.3 0-2.4-1.1-2.4-2.4z m151.5 76.4l-29-12.2c-2.5-1-5.3-1-7.8 0l-28.9 12.2v-54h65.7v54z m465.4-76.1c0 1.2-0.9 2.1-2.1 2.1h-529V132h529.1c1.1 0 2 0.9 2 2v716.8z m50.7-194.1c1.3 0 2.4 1.1 2.4 2.4v81.5c0 1.4-1 2.4-2.4 2.4h-30.7v-86.3h30.7z m0-212.5c1.3 0 2.4 1.1 2.4 2.4v81.5c0 1.3-1.1 2.4-2.4 2.4h-30.7v-86.3h30.7z" fill="#4D3500" /><path d="M680.3 600.1H343.7c-19.6 0-35.5 15.9-35.5 35.5s15.9 35.5 35.5 35.5h336.6c19.6 0 35.5-15.9 35.5-35.5s-15.9-35.5-35.5-35.5z m0 51H343.7c-8.5 0-15.5-7-15.5-15.5s7-15.5 15.5-15.5h336.6c8.5 0 15.5 7 15.5 15.5s-7 15.5-15.5 15.5zM680.3 718.8H343.7c-19.6 0-35.5 15.9-35.5 35.5s15.9 35.5 35.5 35.5h336.6c19.6 0 35.5-15.9 35.5-35.5s-15.9-35.5-35.5-35.5z m0 51H343.7c-8.5 0-15.5-7-15.5-15.5s7-15.5 15.5-15.5h336.6c8.5 0 15.5 7 15.5 15.5s-7 15.5-15.5 15.5zM512.3 543.2c29.8 0 59.9-7.6 87.5-23.5 40.6-23.4 69.7-61.3 81.9-106.7 12.2-45.4 6-92.7-17.5-133.3-23.5-40.6-61.4-69.7-106.7-81.8-45.3-12.1-92.7-5.9-133.3 17.6-40.6 23.5-69.7 61.4-81.9 106.7-12.2 45.3-6 92.7 17.5 133.3 32.6 56.3 91.7 87.7 152.5 87.7zM361.6 327.4c10.8-40.2 36.6-73.7 72.6-94.6 24-13.9 50.6-20.9 77.6-20.9 13.5 0 27.1 1.8 40.5 5.4 40.2 10.8 73.7 36.5 94.6 72.5 20.8 36 26.3 77.9 15.5 118.1-10.8 40.2-36.6 73.7-72.6 94.5-74.3 42.9-169.7 17.3-212.6-56.9-20.8-36-26.4-77.9-15.6-118.1z" fill="#4D3500" /></svg>
|
||||
|
After Width: | Height: | Size: 4.9 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 13 KiB |
@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M72 440.5h880v286.2H72z" fill="#F2B843" /><path d="M72 726.6V834c0 19.8 16 35.8 35.8 35.8h808.5c19.8 0 35.8-16 35.8-35.8V726.6H72zM916.2 297.4H708.7L647 174.1c-6.1-12.1-18.5-19.8-32-19.8H408.9c-13.5 0-25.9 7.7-32 19.8l-61.7 123.3h-64.4v-35.8c0-19.8-16-35.8-35.8-35.8h-35.8c-19.8 0-35.8 16-35.8 35.8v35.8h-35.8c-19.8 0-35.8 16-35.8 35.8v107.3h880V333.1c0.2-19.7-15.8-35.7-35.6-35.7z" fill="#3DC38A" /><path d="M726.6 583.5c0 118.3-95.9 214.6-214.6 214.6-118.8 0-214.6-96.4-214.6-214.6 0-118.3 95.9-214.6 214.6-214.6 118.8 0 214.6 96.4 214.6 214.6z" fill="#EA800C" /><path d="M512 440.5c78.9 0 143.1 64.2 143.1 143.1S590.9 726.7 512 726.7s-143.1-64.2-143.1-143.1S433.1 440.5 512 440.5z" fill="#FFFFFF" /><path d="M773.1 386.8c9.9 0 17.9-8 17.9-17.9s-8-17.9-17.9-17.9-17.9 8-17.9 17.9c0.1 9.9 8.1 17.9 17.9 17.9zM565.7 207.9H458.3c-9.9 0-17.9 8-17.9 17.9s8 17.9 17.9 17.9h107.3c9.9 0 17.9-8 17.9-17.9s-8-17.9-17.8-17.9zM512 744.5c88.8 0 161-72.2 161-161s-72.2-161-161-161-161 72.2-161 161 72.2 161 161 161z m0-286.2c69 0 125.2 56.2 125.2 125.2S581 708.7 512 708.7s-125.2-56.2-125.2-125.2S443 458.3 512 458.3z" fill="#2F9B77" /><path d="M440.5 601.4c9.9 0 17.9-8 17.9-17.9 0-29.6 24.1-53.7 53.7-53.7 9.9 0 17.9-8 17.9-17.9s-8-17.9-17.9-17.9c-49.3 0-89.4 40.1-89.4 89.4-0.1 10 7.9 18 17.8 18z" fill="#3DC38A" /><path d="M844.7 386.8h35.8c9.9 0 17.9-8 17.9-17.9s-8-17.9-17.9-17.9h-35.8c-9.9 0-17.9 8-17.9 17.9s8 17.9 17.9 17.9z" fill="#2F9B77" /><path d="M773.1 396.8c15.4 0 27.9-12.5 27.9-27.9S788.5 341 773.1 341s-27.9 12.5-27.9 27.9v0.1c0.2 15.3 12.7 27.8 27.9 27.8z m0-35.8c4.4 0 7.9 3.5 7.9 7.9s-3.5 7.9-7.9 7.9c-4.3 0-7.8-3.6-7.9-8 0-4.3 3.6-7.8 7.9-7.8zM458.3 253.7h107.3c15.4 0 27.9-12.5 27.9-27.9s-12.5-27.9-27.8-27.9H458.3c-15.4 0-27.9 12.5-27.9 27.9s12.5 27.9 27.9 27.9z m0-35.8h107.4c4.3 0 7.8 3.5 7.8 7.9s-3.5 7.9-7.9 7.9H458.3c-4.4 0-7.9-3.5-7.9-7.9s3.5-7.9 7.9-7.9zM512 754.5c94.3 0 171-76.7 171-171s-76.7-171-171-171-171 76.7-171 171 76.7 171 171 171z m0-322c83.3 0 151 67.7 151 151s-67.7 151-151 151-151-67.7-151-151 67.7-151 151-151z" fill="#4D3500" /><path d="M512 718.7c74.5 0 135.2-60.7 135.2-135.2S586.5 448.3 512 448.3 376.8 509 376.8 583.5 437.5 718.7 512 718.7z m0-250.4c63.5 0 115.2 51.7 115.2 115.2S575.5 698.7 512 698.7 396.8 647 396.8 583.5 448.5 468.3 512 468.3z" fill="#4D3500" /><path d="M468.4 583.5c0-24.1 19.6-43.7 43.7-43.7 15.4 0 27.9-12.5 27.9-27.9S527.5 484 512.1 484c-54.8 0-99.4 44.6-99.4 99.4-0.1 7.5 2.8 14.5 8 19.8 5.3 5.3 12.3 8.2 19.8 8.2 15.4 0 27.9-12.5 27.9-27.9z m-35.7 0s0-0.1 0 0c0-43.9 35.6-79.5 79.4-79.5 4.4 0 7.9 3.5 7.9 7.9s-3.5 7.9-7.9 7.9c-35.1 0-63.7 28.6-63.7 63.7 0 4.4-3.5 7.9-7.9 7.9-2.1 0-4.1-0.8-5.6-2.3-1.4-1.5-2.2-3.5-2.2-5.6zM844.7 396.8h35.8c15.4 0 27.9-12.5 27.9-27.9S895.9 341 880.5 341h-35.8c-15.4 0-27.9 12.5-27.9 27.9s12.5 27.9 27.9 27.9z m0-35.8h35.8c4.4 0 7.9 3.5 7.9 7.9s-3.5 7.9-7.9 7.9h-35.8c-4.4 0-7.9-3.5-7.9-7.9s3.5-7.9 7.9-7.9z" fill="#4D3500" /><path d="M916.5 287.3H715.2l-58.9-117.8c-7.8-15.6-23.5-25.3-40.9-25.3H409.1c-17.4 0-33.1 9.7-40.9 25.3l-58.9 117.8H261v-25.8c0-25.3-20.5-45.8-45.8-45.8h-35.8c-25.3 0-45.8 20.5-45.8 45.8v25.8h-25.8c-25.3 0-45.8 20.5-45.8 45.8V834c0 25.1 20.5 45.7 45.8 45.8h808.4c25.3 0 45.8-20.5 45.8-45.8V442.8c0.2-0.8 0.3-1.6 0.3-2.4V333.1c0-25.3-20.5-45.8-45.8-45.8z m-737.1-51.6h35.8c14.2 0 25.8 11.6 25.8 25.8v25.9h-87.4v-25.9c0-14.2 11.6-25.8 25.8-25.8zM82 450.5h249.1c-27.5 37.3-43.7 83.3-43.7 133 0 49.8 16.3 95.8 43.8 133.1H82V450.5z m430-71.6c112.8 0 204.6 91.8 204.6 204.6S624.8 788.1 512 788.1s-204.6-91.8-204.6-204.6S399.2 378.9 512 378.9zM942 834c0 14.2-11.6 25.8-25.8 25.8H107.9C93.6 859.7 82 848.2 82 834v-97.4h265.8c41 44 99.4 71.5 164.2 71.5s123.1-27.5 164.2-71.5H942V834z m0-117.4H692.8c27.5-37.3 43.8-83.3 43.8-133.1 0-49.7-16.3-95.7-43.7-133H942v266.1z m0.3-286.2H676.2c-41-44-99.4-71.5-164.2-71.5s-123.2 27.6-164.3 71.6H82v-97.4c0-14.2 11.6-25.8 25.8-25.8h34.4c0.4 0.1 0.9 0.1 1.3 0.1h108c0.5 0 0.9 0 1.3-0.1h62.6c3.8 0 7.2-2.1 8.9-5.5L386 178.5c4.4-8.8 13.3-14.3 23.1-14.3h206.2c9.8 0 18.7 5.5 23.1 14.3l61.7 123.3c1.7 3.4 5.2 5.5 8.9 5.5h207.5c14.2 0 25.8 11.6 25.8 25.8v97.3z" fill="#4D3500" /></svg>
|
||||
|
After Width: | Height: | Size: 4.3 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 5.3 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 6.5 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 6.3 KiB |
BIN
src/renderer/themes/geeker/assets/images/403.png
Normal file
BIN
src/renderer/themes/geeker/assets/images/403.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
BIN
src/renderer/themes/geeker/assets/images/404.png
Normal file
BIN
src/renderer/themes/geeker/assets/images/404.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.6 KiB |
BIN
src/renderer/themes/geeker/assets/images/500.png
Normal file
BIN
src/renderer/themes/geeker/assets/images/500.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.9 KiB |
BIN
src/renderer/themes/geeker/assets/images/avatar.gif
Normal file
BIN
src/renderer/themes/geeker/assets/images/avatar.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.2 KiB |
33
src/renderer/themes/geeker/assets/images/login_bg.svg
Normal file
33
src/renderer/themes/geeker/assets/images/login_bg.svg
Normal file
@ -0,0 +1,33 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" baseProfile="full" width="100%" height="100%" viewBox="0 0 1400 800">
|
||||
|
||||
<rect x="1300" y="400" rx="40" ry="40" width="150" height="150" stroke="rgb(129, 201, 149)" fill="rgb(129, 201, 149)">
|
||||
<animateTransform attributeType="XML" attributeName="transform" begin="0s" dur="35s" type="rotate" from="0 1450 550" to="360 1450 550" repeatCount="indefinite"/>
|
||||
</rect>
|
||||
|
||||
<path d="M 100 350 A 150 150 0 1 1 400 350 Q400 370 380 370 L 250 370 L 120 370 Q100 370 100 350" fill="#a2b3ff">
|
||||
<animateMotion path="M 800 -200 L 800 -300 L 800 -200" dur="20s" begin="0s" repeatCount="indefinite"/>
|
||||
<animateTransform attributeType="XML" attributeName="transform" begin="0s" dur="30s" type="rotate" values="0 210 530 ; -30 210 530 ; 0 210 530" keyTimes="0 ; 0.5 ; 1" repeatCount="indefinite"/>
|
||||
</path>
|
||||
|
||||
<circle cx="150" cy="150" r="180" stroke="#85FFBD" fill="#85FFBD">
|
||||
<animateMotion path="M 0 0 L 40 20 Z" dur="5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
|
||||
<!-- 三角形 -->
|
||||
<path d="M 165 580 L 270 580 Q275 578 270 570 L 223 483 Q220 480 217 483 L 165 570 Q160 578 165 580" fill="#a2b3ff">
|
||||
<animateTransform attributeType="XML" attributeName="transform" begin="0s" dur="35s" type="rotate" from="0 210 530" to="360 210 530" repeatCount="indefinite"/>
|
||||
</path>
|
||||
|
||||
<!-- <circle cx="1200" cy="600" r="30" stroke="rgb(241, 243, 244)" fill="rgb(241, 243, 244)">-->
|
||||
<!-- <animateMotion path="M 0 0 L -20 40 Z" dur="9s" repeatCount="indefinite"/>-->
|
||||
<!-- </circle>-->
|
||||
|
||||
<path d="M 100 350 A 40 40 0 1 1 180 350 L 180 430 A 40 40 0 1 1 100 430 Z" fill="#3054EB">
|
||||
<animateMotion path="M 140 390 L 180 360 L 140 390" dur="20s" begin="0s" repeatCount="indefinite"/>
|
||||
<animateTransform attributeType="XML" attributeName="transform" begin="0s" dur="30s" type="rotate" values="0 140 390; -60 140 390; 0 140 390" keyTimes="0 ; 0.5 ; 1" repeatCount="indefinite"/>
|
||||
</path>
|
||||
|
||||
<rect x="400" y="600" rx="40" ry="40" width="100" height="100" stroke="rgb(129, 201, 149)" fill="#3054EB">
|
||||
<animateTransform attributeType="XML" attributeName="transform" begin="0s" dur="35s" type="rotate" from="-30 550 750" to="330 550 750" repeatCount="indefinite"/>
|
||||
</rect>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.2 KiB |
BIN
src/renderer/themes/geeker/assets/images/login_left.png
Normal file
BIN
src/renderer/themes/geeker/assets/images/login_left.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 35 KiB |
BIN
src/renderer/themes/geeker/assets/images/login_left1.png
Normal file
BIN
src/renderer/themes/geeker/assets/images/login_left1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 41 KiB |
BIN
src/renderer/themes/geeker/assets/images/login_left2.png
Normal file
BIN
src/renderer/themes/geeker/assets/images/login_left2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
BIN
src/renderer/themes/geeker/assets/images/login_left3.png
Normal file
BIN
src/renderer/themes/geeker/assets/images/login_left3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 109 KiB |
BIN
src/renderer/themes/geeker/assets/images/login_left4.png
Normal file
BIN
src/renderer/themes/geeker/assets/images/login_left4.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 150 KiB |
BIN
src/renderer/themes/geeker/assets/images/login_left5.png
Normal file
BIN
src/renderer/themes/geeker/assets/images/login_left5.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 275 KiB |
1
src/renderer/themes/geeker/assets/images/logo.svg
Normal file
1
src/renderer/themes/geeker/assets/images/logo.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 261.76 226.69"><path d="M161.096.001l-30.225 52.351L100.647.001H-.005l130.877 226.688L261.749.001z" fill="#41b883"/><path d="M161.096.001l-30.225 52.351L100.647.001H52.346l78.526 136.01L209.398.001z" fill="#34495e"/></svg>
|
||||
|
After Width: | Height: | Size: 276 B |
BIN
src/renderer/themes/geeker/assets/images/msg01.png
Normal file
BIN
src/renderer/themes/geeker/assets/images/msg01.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.4 KiB |
BIN
src/renderer/themes/geeker/assets/images/msg02.png
Normal file
BIN
src/renderer/themes/geeker/assets/images/msg02.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.4 KiB |
BIN
src/renderer/themes/geeker/assets/images/msg03.png
Normal file
BIN
src/renderer/themes/geeker/assets/images/msg03.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.3 KiB |
BIN
src/renderer/themes/geeker/assets/images/msg04.png
Normal file
BIN
src/renderer/themes/geeker/assets/images/msg04.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.6 KiB |
BIN
src/renderer/themes/geeker/assets/images/msg05.png
Normal file
BIN
src/renderer/themes/geeker/assets/images/msg05.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.0 KiB |
BIN
src/renderer/themes/geeker/assets/images/notData.png
Normal file
BIN
src/renderer/themes/geeker/assets/images/notData.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
src/renderer/themes/geeker/assets/images/welcome.png
Normal file
BIN
src/renderer/themes/geeker/assets/images/welcome.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 74 KiB |
@ -0,0 +1,8 @@
|
||||
{
|
||||
"code": 200,
|
||||
"data": {
|
||||
"useProTable": ["add", "batchAdd", "export", "batchDelete", "status"],
|
||||
"authButton": ["add", "edit", "delete", "import", "export"]
|
||||
},
|
||||
"msg": "成功"
|
||||
}
|
||||
1031
src/renderer/themes/geeker/assets/json/authMenuList.json
Normal file
1031
src/renderer/themes/geeker/assets/json/authMenuList.json
Normal file
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,45 @@
|
||||
{
|
||||
"code": 200,
|
||||
"data": function({
|
||||
_req,
|
||||
Mock
|
||||
}) {
|
||||
let query = _req.body;
|
||||
if (query.pageSize > 10) {
|
||||
return Mock.mock({
|
||||
"datalist|18": [{
|
||||
"id": "@string(number,20)",
|
||||
"username": query.username ? query.username : "@cname",
|
||||
"gender": query.gender ? query.gender : "@integer(1, 2)",
|
||||
"idCard": query.idCard ? query.idCard : "@id",
|
||||
"email": query.email ? query.email : "@email",
|
||||
"address": "@city(true)",
|
||||
"createTime": "@date @time",
|
||||
"status": query.status !== undefined ? query.status : "@integer(0, 1)",
|
||||
"avatar|1": ["https://iamge-1259297738.cos.ap-chengdu.myqcloud.com/img/20220728110013.jpg", "https://iamge-1259297738.cos.ap-chengdu.myqcloud.com/img/20220728110015.jpg", "https://iamge-1259297738.cos.ap-chengdu.myqcloud.com/img/20220728110012.jpg", "https://iamge-1259297738.cos.ap-chengdu.myqcloud.com/img/20220728110032.jpg"]
|
||||
}],
|
||||
"pageNum": Number(query.pageNum),
|
||||
"pageSize": Number(query.pageSize),
|
||||
"total": 18
|
||||
})
|
||||
} else {
|
||||
return Mock.mock({
|
||||
"datalist|10": [{
|
||||
"id": "@string(number,20)",
|
||||
"username": query.username ? query.username : "@cname",
|
||||
"gender": query.gender ? query.gender : "@integer(1, 2)",
|
||||
"idCard": query.idCard ? query.idCard : "@id",
|
||||
"email": query.email ? query.email : "@email",
|
||||
"address": "@city(true)",
|
||||
"createTime": "@date @time",
|
||||
"status": query.status !== undefined ? query.status : "@integer(0, 1)",
|
||||
"avatar|1": ["https://iamge-1259297738.cos.ap-chengdu.myqcloud.com/img/20220728110013.jpg", "https://iamge-1259297738.cos.ap-chengdu.myqcloud.com/img/20220728110015.jpg", "https://iamge-1259297738.cos.ap-chengdu.myqcloud.com/img/20220728110012.jpg", "https://iamge-1259297738.cos.ap-chengdu.myqcloud.com/img/20220728110032.jpg"]
|
||||
}],
|
||||
"pageNum": Number(query.pageNum),
|
||||
"pageSize": Number(query.pageSize),
|
||||
"total": 18
|
||||
})
|
||||
}
|
||||
},
|
||||
"msg": "成功"
|
||||
}
|
||||
@ -0,0 +1,21 @@
|
||||
{
|
||||
"code": 200,
|
||||
"data": function({
|
||||
_req
|
||||
}) {
|
||||
let header = _req.header;
|
||||
if (header['x-access-token'] === 'bqddxxwqmfncffacvbpkuxvwvqrhln') {
|
||||
return {
|
||||
"useProTable": ["add", "batchAdd", "export", "batchDelete", "status"],
|
||||
"authButton": ["add", "edit", "delete", "import", "export"]
|
||||
}
|
||||
}
|
||||
if (header['x-access-token'] === 'unufvdotdqxuzfbdygovfmsbftlvbn') {
|
||||
return {
|
||||
"useProTable": ["add", "batchDelete"],
|
||||
"authButton": ["add", "edit", "delete", "import", "export"]
|
||||
}
|
||||
}
|
||||
},
|
||||
"msg": "成功"
|
||||
}
|
||||
@ -0,0 +1,16 @@
|
||||
{
|
||||
"code": 200,
|
||||
"data": function({
|
||||
Mock
|
||||
}) {
|
||||
return Mock.mock({
|
||||
'fileUrl|1': [
|
||||
"https://i.imgtg.com/2023/01/16/QRBHS.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRqMK.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QR57a.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRa0s.jpg"
|
||||
]
|
||||
})
|
||||
},
|
||||
"msg": "成功"
|
||||
}
|
||||
@ -0,0 +1,7 @@
|
||||
{
|
||||
"code": 200,
|
||||
"data": {
|
||||
fileUrl: 'http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4'
|
||||
},
|
||||
"msg": "成功"
|
||||
}
|
||||
36
src/renderer/themes/geeker/assets/mock/geeker/login.json
Normal file
36
src/renderer/themes/geeker/assets/mock/geeker/login.json
Normal file
@ -0,0 +1,36 @@
|
||||
{
|
||||
"code": function({
|
||||
_req,
|
||||
Mock
|
||||
}) {
|
||||
let body = _req.body;
|
||||
if ((body.username === 'admin' && body.password === 'e10adc3949ba59abbe56e057f20f883e') || (body.username === 'user' && body.password === 'e10adc3949ba59abbe56e057f20f883e')) {
|
||||
return 200
|
||||
} else {
|
||||
return 500;
|
||||
}
|
||||
},
|
||||
"data": function({
|
||||
_req,
|
||||
Mock
|
||||
}) {
|
||||
let body = _req.body;
|
||||
if (body.username === 'admin' && body.password === 'e10adc3949ba59abbe56e057f20f883e') return Mock.mock({
|
||||
'access_token': "bqddxxwqmfncffacvbpkuxvwvqrhln"
|
||||
})
|
||||
if (body.username === 'user' && body.password === 'e10adc3949ba59abbe56e057f20f883e') return Mock.mock({
|
||||
'access_token': "unufvdotdqxuzfbdygovfmsbftlvbn"
|
||||
})
|
||||
},
|
||||
"msg": function({
|
||||
_req,
|
||||
Mock
|
||||
}) {
|
||||
let body = _req.body;
|
||||
if ((body.username === 'admin' && body.password === 'e10adc3949ba59abbe56e057f20f883e') || (body.username === 'user' && body.password === 'e10adc3949ba59abbe56e057f20f883e')) {
|
||||
return '成功'
|
||||
} else {
|
||||
return '用户名或密码错误';
|
||||
}
|
||||
},
|
||||
}
|
||||
@ -0,0 +1,4 @@
|
||||
{
|
||||
"code": 200,
|
||||
"msg": "成功"
|
||||
}
|
||||
1634
src/renderer/themes/geeker/assets/mock/geeker/menu/list.json
Normal file
1634
src/renderer/themes/geeker/assets/mock/geeker/menu/list.json
Normal file
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,4 @@
|
||||
{
|
||||
"code": 200,
|
||||
"msg": "成功"
|
||||
}
|
||||
@ -0,0 +1,4 @@
|
||||
{
|
||||
"code": 200,
|
||||
"msg": "成功"
|
||||
}
|
||||
@ -0,0 +1,4 @@
|
||||
{
|
||||
"code": 200,
|
||||
"msg": "成功"
|
||||
}
|
||||
@ -0,0 +1,53 @@
|
||||
{
|
||||
"code": 200,
|
||||
"data": [{
|
||||
id: "1",
|
||||
name: "华东分部",
|
||||
children: [{
|
||||
id: "11",
|
||||
name: "研发部"
|
||||
}, {
|
||||
id: "12",
|
||||
name: "市场部"
|
||||
}, {
|
||||
id: "13",
|
||||
name: "商务部"
|
||||
}, {
|
||||
id: "14",
|
||||
name: "财务部"
|
||||
}]
|
||||
}, {
|
||||
id: "2",
|
||||
name: "华南分部",
|
||||
children: [{
|
||||
id: "21",
|
||||
name: "研发部"
|
||||
}, {
|
||||
id: "22",
|
||||
name: "市场部"
|
||||
}, {
|
||||
id: "23",
|
||||
name: "商务部"
|
||||
}, {
|
||||
id: "24",
|
||||
name: "财务部"
|
||||
}]
|
||||
}, {
|
||||
id: "3",
|
||||
name: "西北分部",
|
||||
children: [{
|
||||
id: "31",
|
||||
name: "研发部"
|
||||
}, {
|
||||
id: "32",
|
||||
name: "市场部"
|
||||
}, {
|
||||
id: "33",
|
||||
name: "商务部"
|
||||
}, {
|
||||
id: "34",
|
||||
name: "财务部"
|
||||
}]
|
||||
}],
|
||||
"msg": "成功"
|
||||
}
|
||||
@ -0,0 +1,4 @@
|
||||
{
|
||||
"code": 200,
|
||||
"msg": "成功"
|
||||
}
|
||||
@ -0,0 +1,4 @@
|
||||
{
|
||||
"code": 200,
|
||||
"msg": "演示环境暂不能导出数据🙅"
|
||||
}
|
||||
@ -0,0 +1,13 @@
|
||||
{
|
||||
"code": 200,
|
||||
"data": [{
|
||||
genderLabel: "男",
|
||||
genderValue: 1,
|
||||
},
|
||||
{
|
||||
genderLabel: "女",
|
||||
genderValue: 2
|
||||
}
|
||||
],
|
||||
"msg": "成功"
|
||||
}
|
||||
@ -0,0 +1,4 @@
|
||||
{
|
||||
"code": 200,
|
||||
"msg": "成功"
|
||||
}
|
||||
146
src/renderer/themes/geeker/assets/mock/geeker/user/list.json
Normal file
146
src/renderer/themes/geeker/assets/mock/geeker/user/list.json
Normal file
@ -0,0 +1,146 @@
|
||||
{
|
||||
"code": 200,
|
||||
"data": function({
|
||||
_req,
|
||||
Mock
|
||||
}) {
|
||||
let query = _req.body;
|
||||
if (query.username || query.gender || query.age || query.idCard || query.email || query.status !== undefined) {
|
||||
return Mock.mock({
|
||||
"list|10": [{
|
||||
"id": "@string(number,18)",
|
||||
"username": query.username ? query.username : "@cname",
|
||||
"gender": query.gender ? query.gender : "@integer(1, 2)",
|
||||
"user": {
|
||||
"detail": {
|
||||
"age": query.age ? query.age : "@integer(10,30)",
|
||||
}
|
||||
},
|
||||
"idCard": query.idCard ? query.idCard : "@id",
|
||||
"email": query.email ? query.email : "@email",
|
||||
"address": "@city(true)",
|
||||
"createTime": "@date @time",
|
||||
"status": query.status !== undefined ? query.status : "@integer(0, 1)",
|
||||
"avatar|1": [
|
||||
"https://i.imgtg.com/2023/01/16/QRBHS.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRqMK.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QR57a.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRa0s.jpg"
|
||||
]
|
||||
}],
|
||||
"pageNum": Number(query.pageNum),
|
||||
"pageSize": Number(query.pageSize),
|
||||
"total": 18
|
||||
})
|
||||
} else if (query.pageSize == 25) {
|
||||
return Mock.mock({
|
||||
"list|25": [{
|
||||
"id": "@string(number,18)",
|
||||
"username": query.username ? query.username : "@cname",
|
||||
"gender": query.gender ? query.gender : "@integer(1, 2)",
|
||||
"user": {
|
||||
"detail": {
|
||||
"age": query.age ? query.age : "@integer(10,30)",
|
||||
}
|
||||
},
|
||||
"idCard": query.idCard ? query.idCard : "@id",
|
||||
"email": query.email ? query.email : "@email",
|
||||
"address": "@city(true)",
|
||||
"createTime": "@date @time",
|
||||
"status": query.status !== undefined ? query.status : "@integer(0, 1)",
|
||||
"avatar|1": [
|
||||
"https://i.imgtg.com/2023/01/16/QRBHS.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRqMK.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QR57a.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRa0s.jpg"
|
||||
]
|
||||
}],
|
||||
"pageNum": Number(query.pageNum),
|
||||
"pageSize": Number(query.pageSize),
|
||||
"total": 2000
|
||||
})
|
||||
} else if (query.pageSize == 50) {
|
||||
return Mock.mock({
|
||||
"list|50": [{
|
||||
"id": "@string(number,18)",
|
||||
"username": query.username ? query.username : "@cname",
|
||||
"gender": query.gender ? query.gender : "@integer(1, 2)",
|
||||
"user": {
|
||||
"detail": {
|
||||
"age": query.age ? query.age : "@integer(10,30)",
|
||||
}
|
||||
},
|
||||
"idCard": query.idCard ? query.idCard : "@id",
|
||||
"email": query.email ? query.email : "@email",
|
||||
"address": "@city(true)",
|
||||
"createTime": "@date @time",
|
||||
"status": query.status !== undefined ? query.status : "@integer(0, 1)",
|
||||
"avatar|1": [
|
||||
"https://i.imgtg.com/2023/01/16/QRBHS.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRqMK.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QR57a.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRa0s.jpg"
|
||||
]
|
||||
}],
|
||||
"pageNum": Number(query.pageNum),
|
||||
"pageSize": Number(query.pageSize),
|
||||
"total": 2000
|
||||
})
|
||||
} else if (query.pageSize == 100) {
|
||||
return Mock.mock({
|
||||
"list|100": [{
|
||||
"id": "@string(number,18)",
|
||||
"username": query.username ? query.username : "@cname",
|
||||
"gender": query.gender ? query.gender : "@integer(1, 2)",
|
||||
"user": {
|
||||
"detail": {
|
||||
"age": query.age ? query.age : "@integer(10,30)",
|
||||
}
|
||||
},
|
||||
"idCard": query.idCard ? query.idCard : "@id",
|
||||
"email": query.email ? query.email : "@email",
|
||||
"address": "@city(true)",
|
||||
"createTime": "@date @time",
|
||||
"status": query.status !== undefined ? query.status : "@integer(0, 1)",
|
||||
"avatar|1": [
|
||||
"https://i.imgtg.com/2023/01/16/QRBHS.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRqMK.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QR57a.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRa0s.jpg"
|
||||
]
|
||||
}],
|
||||
"pageNum": Number(query.pageNum),
|
||||
"pageSize": Number(query.pageSize),
|
||||
"total": 2000
|
||||
})
|
||||
} else {
|
||||
return Mock.mock({
|
||||
"list|10": [{
|
||||
"id": "@string(number,18)",
|
||||
"username": query.username ? query.username : "@cname",
|
||||
"gender": query.gender ? query.gender : "@integer(1, 2)",
|
||||
"user": {
|
||||
"detail": {
|
||||
"age": query.age ? query.age : "@integer(10,30)",
|
||||
}
|
||||
},
|
||||
"idCard": query.idCard ? query.idCard : "@id",
|
||||
"email": query.email ? query.email : "@email",
|
||||
"address": "@city(true)",
|
||||
"createTime": "@date @time",
|
||||
"status": query.status !== undefined ? query.status : "@integer(0, 1)",
|
||||
"avatar|1": [
|
||||
"https://i.imgtg.com/2023/01/16/QRBHS.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRqMK.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QR57a.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRa0s.jpg"
|
||||
]
|
||||
}],
|
||||
"pageNum": Number(query.pageNum),
|
||||
"pageSize": Number(query.pageSize),
|
||||
"total": 2000
|
||||
})
|
||||
}
|
||||
},
|
||||
"msg": "成功"
|
||||
}
|
||||
@ -0,0 +1,4 @@
|
||||
{
|
||||
"code": 200,
|
||||
"msg": "成功"
|
||||
}
|
||||
26
src/renderer/themes/geeker/assets/mock/geeker/user/role.json
Normal file
26
src/renderer/themes/geeker/assets/mock/geeker/user/role.json
Normal file
@ -0,0 +1,26 @@
|
||||
{
|
||||
|
||||
"code": 200,
|
||||
"data": [{
|
||||
label: "全部",
|
||||
value: ""
|
||||
},
|
||||
{
|
||||
label: "超级管理员",
|
||||
value: "1"
|
||||
},
|
||||
{
|
||||
label: "公司CEO",
|
||||
value: "2"
|
||||
},
|
||||
{
|
||||
label: "部门主管",
|
||||
value: "3"
|
||||
},
|
||||
{
|
||||
label: "人事经理",
|
||||
value: "4"
|
||||
}
|
||||
],
|
||||
"msg": '成功'
|
||||
}
|
||||
@ -0,0 +1,15 @@
|
||||
{
|
||||
"code": 200,
|
||||
"data": [{
|
||||
userLabel: "启用",
|
||||
userStatus: 1,
|
||||
tagType: "success"
|
||||
},
|
||||
{
|
||||
userLabel: "禁用",
|
||||
userStatus: 0,
|
||||
tagType: "danger"
|
||||
}
|
||||
],
|
||||
"msg": "成功"
|
||||
}
|
||||
@ -0,0 +1,251 @@
|
||||
{
|
||||
"code": 200,
|
||||
"data": function({
|
||||
_req,
|
||||
Mock
|
||||
}) {
|
||||
let query = _req.body;
|
||||
if (query.username || query.gender || query.age || query.idCard || query.email || query.status !== undefined) {
|
||||
return Mock.mock({
|
||||
"list|10": [{
|
||||
"id": "@string(number,18)",
|
||||
"username": query.username ? query.username : "@cname",
|
||||
"gender": query.gender ? query.gender : "@integer(1, 2)",
|
||||
"user": {
|
||||
"detail": {
|
||||
"age": query.age ? query.age : "@integer(10,30)",
|
||||
}
|
||||
},
|
||||
"idCard": query.idCard ? query.idCard : "@id",
|
||||
"email": query.email ? query.email : "@email",
|
||||
"address": "@city(true)",
|
||||
"createTime": "@date @time",
|
||||
"status": query.status !== undefined ? query.status : "@integer(0, 1)",
|
||||
"avatar|1": [
|
||||
"https://i.imgtg.com/2023/01/16/QRBHS.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRqMK.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QR57a.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRa0s.jpg"
|
||||
],
|
||||
'children|3': [{
|
||||
"id": "@string(number,18)",
|
||||
"username": query.username ? query.username : "@cname",
|
||||
"gender": query.gender ? query.gender : "@integer(1, 2)",
|
||||
"user": {
|
||||
"detail": {
|
||||
"age": query.age ? query.age : "@integer(10,30)",
|
||||
}
|
||||
},
|
||||
"idCard": query.idCard ? query.idCard : "@id",
|
||||
"email": query.email ? query.email : "@email",
|
||||
"address": "@city(true)",
|
||||
"createTime": "@date @time",
|
||||
"status": query.status !== undefined ? query.status : "@integer(0, 1)",
|
||||
"avatar|1": [
|
||||
"https://i.imgtg.com/2023/01/16/QRBHS.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRqMK.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QR57a.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRa0s.jpg"
|
||||
]
|
||||
}]
|
||||
}],
|
||||
"pageNum": Number(query.pageNum),
|
||||
"pageSize": Number(query.pageSize),
|
||||
"total": 18
|
||||
})
|
||||
} else if (query.pageSize == 25) {
|
||||
return Mock.mock({
|
||||
"list|25": [{
|
||||
"id": "@string(number,18)",
|
||||
"username": query.username ? query.username : "@cname",
|
||||
"gender": query.gender ? query.gender : "@integer(1, 2)",
|
||||
"user": {
|
||||
"detail": {
|
||||
"age": query.age ? query.age : "@integer(10,30)",
|
||||
}
|
||||
},
|
||||
"idCard": query.idCard ? query.idCard : "@id",
|
||||
"email": query.email ? query.email : "@email",
|
||||
"address": "@city(true)",
|
||||
"createTime": "@date @time",
|
||||
"status": query.status !== undefined ? query.status : "@integer(0, 1)",
|
||||
"avatar|1": [
|
||||
"https://i.imgtg.com/2023/01/16/QRBHS.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRqMK.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QR57a.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRa0s.jpg"
|
||||
],
|
||||
'children|3': [{
|
||||
"id": "@string(number,18)",
|
||||
"username": query.username ? query.username : "@cname",
|
||||
"gender": query.gender ? query.gender : "@integer(1, 2)",
|
||||
"user": {
|
||||
"detail": {
|
||||
"age": query.age ? query.age : "@integer(10,30)",
|
||||
}
|
||||
},
|
||||
"idCard": query.idCard ? query.idCard : "@id",
|
||||
"email": query.email ? query.email : "@email",
|
||||
"address": "@city(true)",
|
||||
"createTime": "@date @time",
|
||||
"status": query.status !== undefined ? query.status : "@integer(0, 1)",
|
||||
"avatar|1": [
|
||||
"https://i.imgtg.com/2023/01/16/QRBHS.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRqMK.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QR57a.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRa0s.jpg"
|
||||
]
|
||||
}]
|
||||
}],
|
||||
"pageNum": Number(query.pageNum),
|
||||
"pageSize": Number(query.pageSize),
|
||||
"total": 2000
|
||||
})
|
||||
} else if (query.pageSize == 50) {
|
||||
return Mock.mock({
|
||||
"list|50": [{
|
||||
"id": "@string(number,18)",
|
||||
"username": query.username ? query.username : "@cname",
|
||||
"gender": query.gender ? query.gender : "@integer(1, 2)",
|
||||
"user": {
|
||||
"detail": {
|
||||
"age": query.age ? query.age : "@integer(10,30)",
|
||||
}
|
||||
},
|
||||
"idCard": query.idCard ? query.idCard : "@id",
|
||||
"email": query.email ? query.email : "@email",
|
||||
"address": "@city(true)",
|
||||
"createTime": "@date @time",
|
||||
"status": query.status !== undefined ? query.status : "@integer(0, 1)",
|
||||
"avatar|1": [
|
||||
"https://i.imgtg.com/2023/01/16/QRBHS.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRqMK.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QR57a.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRa0s.jpg"
|
||||
],
|
||||
'children|3': [{
|
||||
"id": "@string(number,18)",
|
||||
"username": query.username ? query.username : "@cname",
|
||||
"gender": query.gender ? query.gender : "@integer(1, 2)",
|
||||
"user": {
|
||||
"detail": {
|
||||
"age": query.age ? query.age : "@integer(10,30)",
|
||||
}
|
||||
},
|
||||
"idCard": query.idCard ? query.idCard : "@id",
|
||||
"email": query.email ? query.email : "@email",
|
||||
"address": "@city(true)",
|
||||
"createTime": "@date @time",
|
||||
"status": query.status !== undefined ? query.status : "@integer(0, 1)",
|
||||
"avatar|1": [
|
||||
"https://i.imgtg.com/2023/01/16/QRBHS.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRqMK.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QR57a.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRa0s.jpg"
|
||||
]
|
||||
}]
|
||||
}],
|
||||
"pageNum": Number(query.pageNum),
|
||||
"pageSize": Number(query.pageSize),
|
||||
"total": 2000
|
||||
})
|
||||
} else if (query.pageSize == 100) {
|
||||
return Mock.mock({
|
||||
"list|100": [{
|
||||
"id": "@string(number,18)",
|
||||
"username": query.username ? query.username : "@cname",
|
||||
"gender": query.gender ? query.gender : "@integer(1, 2)",
|
||||
"user": {
|
||||
"detail": {
|
||||
"age": query.age ? query.age : "@integer(10,30)",
|
||||
}
|
||||
},
|
||||
"idCard": query.idCard ? query.idCard : "@id",
|
||||
"email": query.email ? query.email : "@email",
|
||||
"address": "@city(true)",
|
||||
"createTime": "@date @time",
|
||||
"status": query.status !== undefined ? query.status : "@integer(0, 1)",
|
||||
"avatar|1": [
|
||||
"https://i.imgtg.com/2023/01/16/QRBHS.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRqMK.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QR57a.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRa0s.jpg"
|
||||
],
|
||||
'children|3': [{
|
||||
"id": "@string(number,18)",
|
||||
"username": query.username ? query.username : "@cname",
|
||||
"gender": query.gender ? query.gender : "@integer(1, 2)",
|
||||
"user": {
|
||||
"detail": {
|
||||
"age": query.age ? query.age : "@integer(10,30)",
|
||||
}
|
||||
},
|
||||
"idCard": query.idCard ? query.idCard : "@id",
|
||||
"email": query.email ? query.email : "@email",
|
||||
"address": "@city(true)",
|
||||
"createTime": "@date @time",
|
||||
"status": query.status !== undefined ? query.status : "@integer(0, 1)",
|
||||
"avatar|1": [
|
||||
"https://i.imgtg.com/2023/01/16/QRBHS.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRqMK.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QR57a.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRa0s.jpg"
|
||||
]
|
||||
}]
|
||||
}],
|
||||
"pageNum": Number(query.pageNum),
|
||||
"pageSize": Number(query.pageSize),
|
||||
"total": 2000
|
||||
})
|
||||
} else {
|
||||
return Mock.mock({
|
||||
"list|10": [{
|
||||
"id": "@string(number,18)",
|
||||
"username": query.username ? query.username : "@cname",
|
||||
"gender": query.gender ? query.gender : "@integer(1, 2)",
|
||||
"user": {
|
||||
"detail": {
|
||||
"age": query.age ? query.age : "@integer(10,30)",
|
||||
}
|
||||
},
|
||||
"idCard": query.idCard ? query.idCard : "@id",
|
||||
"email": query.email ? query.email : "@email",
|
||||
"address": "@city(true)",
|
||||
"createTime": "@date @time",
|
||||
"status": query.status !== undefined ? query.status : "@integer(0, 1)",
|
||||
"avatar|1": [
|
||||
"https://i.imgtg.com/2023/01/16/QRBHS.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRqMK.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QR57a.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRa0s.jpg"
|
||||
],
|
||||
'children|3': [{
|
||||
"id": "@string(number,18)",
|
||||
"username": query.username ? query.username : "@cname",
|
||||
"gender": query.gender ? query.gender : "@integer(1, 2)",
|
||||
"user": {
|
||||
"detail": {
|
||||
"age": query.age ? query.age : "@integer(10,30)",
|
||||
}
|
||||
},
|
||||
"idCard": query.idCard ? query.idCard : "@id",
|
||||
"email": query.email ? query.email : "@email",
|
||||
"address": "@city(true)",
|
||||
"createTime": "@date @time",
|
||||
"status": query.status !== undefined ? query.status : "@integer(0, 1)",
|
||||
"avatar|1": [
|
||||
"https://i.imgtg.com/2023/01/16/QRBHS.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRqMK.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QR57a.jpg",
|
||||
"https://i.imgtg.com/2023/01/16/QRa0s.jpg"
|
||||
]
|
||||
}]
|
||||
}],
|
||||
"pageNum": Number(query.pageNum),
|
||||
"pageSize": Number(query.pageSize),
|
||||
"total": 2000
|
||||
})
|
||||
}
|
||||
},
|
||||
"msg": "成功"
|
||||
}
|
||||
@ -0,0 +1,72 @@
|
||||
import * as echarts from "echarts/core";
|
||||
import { BarChart, LineChart, LinesChart, PieChart, ScatterChart, RadarChart, GaugeChart } from "echarts/charts";
|
||||
import {
|
||||
TitleComponent,
|
||||
TooltipComponent,
|
||||
GridComponent,
|
||||
DatasetComponent,
|
||||
TransformComponent,
|
||||
LegendComponent,
|
||||
PolarComponent,
|
||||
GeoComponent,
|
||||
ToolboxComponent,
|
||||
DataZoomComponent
|
||||
} from "echarts/components";
|
||||
import { LabelLayout, UniversalTransition } from "echarts/features";
|
||||
import { CanvasRenderer } from "echarts/renderers";
|
||||
import type {
|
||||
BarSeriesOption,
|
||||
LineSeriesOption,
|
||||
LinesSeriesOption,
|
||||
PieSeriesOption,
|
||||
ScatterSeriesOption,
|
||||
RadarSeriesOption,
|
||||
GaugeSeriesOption
|
||||
} from "echarts/charts";
|
||||
import type {
|
||||
TitleComponentOption,
|
||||
TooltipComponentOption,
|
||||
GridComponentOption,
|
||||
DatasetComponentOption
|
||||
} from "echarts/components";
|
||||
import type { ComposeOption } from "echarts/core";
|
||||
import "echarts-liquidfill";
|
||||
|
||||
export type ECOption = ComposeOption<
|
||||
| BarSeriesOption
|
||||
| LineSeriesOption
|
||||
| LinesSeriesOption
|
||||
| PieSeriesOption
|
||||
| RadarSeriesOption
|
||||
| GaugeSeriesOption
|
||||
| TitleComponentOption
|
||||
| TooltipComponentOption
|
||||
| GridComponentOption
|
||||
| DatasetComponentOption
|
||||
| ScatterSeriesOption
|
||||
>;
|
||||
|
||||
echarts.use([
|
||||
TitleComponent,
|
||||
TooltipComponent,
|
||||
GridComponent,
|
||||
DatasetComponent,
|
||||
TransformComponent,
|
||||
LegendComponent,
|
||||
PolarComponent,
|
||||
GeoComponent,
|
||||
ToolboxComponent,
|
||||
DataZoomComponent,
|
||||
BarChart,
|
||||
LineChart,
|
||||
LinesChart,
|
||||
PieChart,
|
||||
ScatterChart,
|
||||
RadarChart,
|
||||
GaugeChart,
|
||||
LabelLayout,
|
||||
UniversalTransition,
|
||||
CanvasRenderer
|
||||
]);
|
||||
|
||||
export default echarts;
|
||||
104
src/renderer/themes/geeker/components/ECharts/index.vue
Normal file
104
src/renderer/themes/geeker/components/ECharts/index.vue
Normal file
@ -0,0 +1,104 @@
|
||||
<template>
|
||||
<div id="echarts" ref="chartRef" :style="echartsStyle" />
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="ECharts">
|
||||
import { ref, onMounted, onBeforeUnmount, watch, computed, markRaw, nextTick, onActivated } from "vue";
|
||||
import { EChartsType, ECElementEvent } from "echarts/core";
|
||||
import echarts, { ECOption } from "./config";
|
||||
import { useDebounceFn } from "@vueuse/core";
|
||||
import { useGlobalStore } from "@themeGeeker/stores/modules/global";
|
||||
import { storeToRefs } from "pinia";
|
||||
|
||||
interface Props {
|
||||
option: ECOption;
|
||||
renderer?: "canvas" | "svg";
|
||||
resize?: boolean;
|
||||
theme?: Object | string;
|
||||
width?: number | string;
|
||||
height?: number | string;
|
||||
onClick?: (event: ECElementEvent) => any;
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
renderer: "canvas",
|
||||
resize: true
|
||||
});
|
||||
|
||||
const echartsStyle = computed(() => {
|
||||
return props.width || props.height
|
||||
? { height: props.height + "px", width: props.width + "px" }
|
||||
: { height: "100%", width: "100%" };
|
||||
});
|
||||
|
||||
const chartRef = ref<HTMLDivElement | HTMLCanvasElement>();
|
||||
const chartInstance = ref<EChartsType>();
|
||||
|
||||
const draw = () => {
|
||||
if (chartInstance.value) {
|
||||
chartInstance.value.setOption(props.option, { notMerge: true });
|
||||
}
|
||||
};
|
||||
|
||||
watch(props, () => {
|
||||
draw();
|
||||
});
|
||||
|
||||
const handleClick = (event: ECElementEvent) => props.onClick && props.onClick(event);
|
||||
|
||||
const init = () => {
|
||||
if (!chartRef.value) return;
|
||||
chartInstance.value = echarts.getInstanceByDom(chartRef.value);
|
||||
|
||||
if (!chartInstance.value) {
|
||||
chartInstance.value = markRaw(
|
||||
echarts.init(chartRef.value, props.theme, {
|
||||
renderer: props.renderer
|
||||
})
|
||||
);
|
||||
chartInstance.value.on("click", handleClick);
|
||||
draw();
|
||||
}
|
||||
};
|
||||
|
||||
const resize = () => {
|
||||
if (chartInstance.value && props.resize) {
|
||||
chartInstance.value.resize({ animation: { duration: 300 } });
|
||||
}
|
||||
};
|
||||
|
||||
const debouncedResize = useDebounceFn(resize, 300, { maxWait: 800 });
|
||||
|
||||
const globalStore = useGlobalStore();
|
||||
const { maximize, isCollapse, tabs, footer } = storeToRefs(globalStore);
|
||||
|
||||
watch(
|
||||
() => [maximize, isCollapse, tabs, footer],
|
||||
() => {
|
||||
debouncedResize();
|
||||
},
|
||||
{ deep: true }
|
||||
);
|
||||
|
||||
onMounted(() => {
|
||||
nextTick(() => init());
|
||||
window.addEventListener("resize", debouncedResize);
|
||||
});
|
||||
|
||||
onActivated(() => {
|
||||
if (chartInstance.value) {
|
||||
chartInstance.value.resize();
|
||||
}
|
||||
});
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
chartInstance.value?.dispose();
|
||||
window.removeEventListener("resize", debouncedResize);
|
||||
});
|
||||
|
||||
defineExpose({
|
||||
getInstance: () => chartInstance.value,
|
||||
resize,
|
||||
draw
|
||||
});
|
||||
</script>
|
||||
19
src/renderer/themes/geeker/components/ErrorMessage/403.vue
Normal file
19
src/renderer/themes/geeker/components/ErrorMessage/403.vue
Normal file
@ -0,0 +1,19 @@
|
||||
<template>
|
||||
<div class="not-container">
|
||||
<img src="@themeGeeker/assets/images/403.png" class="not-img" alt="403" />
|
||||
<div class="not-detail">
|
||||
<h2>403</h2>
|
||||
<h4>抱歉，您无权访问该页面~🙅♂️🙅♀️</h4>
|
||||
<el-button type="primary" @click="router.back"> 返回上一页 </el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="403">
|
||||
import { useRouter } from "vue-router";
|
||||
const router = useRouter();
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import "./index.scss";
|
||||
</style>
|
||||
19
src/renderer/themes/geeker/components/ErrorMessage/404.vue
Normal file
19
src/renderer/themes/geeker/components/ErrorMessage/404.vue
Normal file
@ -0,0 +1,19 @@
|
||||
<template>
|
||||
<div class="not-container">
|
||||
<img src="@themeGeeker/assets/images/404.png" class="not-img" alt="404" />
|
||||
<div class="not-detail">
|
||||
<h2>404</h2>
|
||||
<h4>抱歉，您访问的页面不存在~🤷♂️🤷♀️</h4>
|
||||
<el-button type="primary" @click="router.back"> 返回上一页 </el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="404">
|
||||
import { useRouter } from "vue-router";
|
||||
const router = useRouter();
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import "./index.scss";
|
||||
</style>
|
||||
19
src/renderer/themes/geeker/components/ErrorMessage/500.vue
Normal file
19
src/renderer/themes/geeker/components/ErrorMessage/500.vue
Normal file
@ -0,0 +1,19 @@
|
||||
<template>
|
||||
<div class="not-container">
|
||||
<img src="@themeGeeker/assets/images/500.png" class="not-img" alt="500" />
|
||||
<div class="not-detail">
|
||||
<h2>500</h2>
|
||||
<h4>抱歉，您的网络不见了~🤦♂️🤦♀️</h4>
|
||||
<el-button type="primary" @click="router.back"> 返回上一页 </el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="500">
|
||||
import { useRouter } from "vue-router";
|
||||
const router = useRouter();
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import "./index.scss";
|
||||
</style>
|
||||
@ -0,0 +1,32 @@
|
||||
.not-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.not-img {
|
||||
margin-right: 120px;
|
||||
}
|
||||
.not-detail {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
h2,
|
||||
h4 {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
h2 {
|
||||
font-size: 60px;
|
||||
color: var(--el-text-color-primary);
|
||||
}
|
||||
h4 {
|
||||
margin: 30px 0 20px;
|
||||
font-size: 19px;
|
||||
font-weight: normal;
|
||||
color: var(--el-text-color-regular);
|
||||
}
|
||||
.el-button {
|
||||
width: 100px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,68 @@
|
||||
<template>
|
||||
<div v-show="isShow" :style="style">
|
||||
<slot></slot>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts" name="GridItem">
|
||||
import { computed, inject, Ref, ref, useAttrs, watch } from "vue";
|
||||
import { BreakPoint, Responsive } from "../interface/index";
|
||||
|
||||
type Props = {
|
||||
offset?: number;
|
||||
span?: number;
|
||||
suffix?: boolean;
|
||||
xs?: Responsive;
|
||||
sm?: Responsive;
|
||||
md?: Responsive;
|
||||
lg?: Responsive;
|
||||
xl?: Responsive;
|
||||
};
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
offset: 0,
|
||||
span: 1,
|
||||
suffix: false,
|
||||
xs: undefined,
|
||||
sm: undefined,
|
||||
md: undefined,
|
||||
lg: undefined,
|
||||
xl: undefined
|
||||
});
|
||||
|
||||
const attrs = useAttrs() as { index: string };
|
||||
const isShow = ref(true);
|
||||
|
||||
// 注入断点
|
||||
const breakPoint = inject<Ref<BreakPoint>>("breakPoint", ref("xl"));
|
||||
const shouldHiddenIndex = inject<Ref<number>>("shouldHiddenIndex", ref(-1));
|
||||
watch(
|
||||
() => [shouldHiddenIndex.value, breakPoint.value],
|
||||
n => {
|
||||
if (!!attrs.index) {
|
||||
isShow.value = !(n[0] !== -1 && parseInt(attrs.index) >= Number(n[0]));
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
);
|
||||
|
||||
const gap = inject("gap", 0);
|
||||
const cols = inject("cols", ref(4));
|
||||
const style = computed(() => {
|
||||
let span = props[breakPoint.value]?.span ?? props.span;
|
||||
let offset = props[breakPoint.value]?.offset ?? props.offset;
|
||||
if (props.suffix) {
|
||||
return {
|
||||
gridColumnStart: cols.value - span - offset + 1,
|
||||
gridColumnEnd: `span ${span + offset}`,
|
||||
marginLeft: offset !== 0 ? `calc(((100% + ${gap}px) / ${span + offset}) * ${offset})` : "unset"
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
gridColumn: `span ${span + offset > cols.value ? cols.value : span + offset}/span ${
|
||||
span + offset > cols.value ? cols.value : span + offset
|
||||
}`,
|
||||
marginLeft: offset !== 0 ? `calc(((100% + ${gap}px) / ${span + offset}) * ${offset})` : "unset"
|
||||
};
|
||||
}
|
||||
});
|
||||
</script>
|
||||
167
src/renderer/themes/geeker/components/Grid/index.vue
Normal file
167
src/renderer/themes/geeker/components/Grid/index.vue
Normal file
@ -0,0 +1,167 @@
|
||||
<template>
|
||||
<div :style="style">
|
||||
<slot></slot>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="Grid">
|
||||
import {
|
||||
ref,
|
||||
watch,
|
||||
useSlots,
|
||||
computed,
|
||||
provide,
|
||||
onBeforeMount,
|
||||
onMounted,
|
||||
onUnmounted,
|
||||
onDeactivated,
|
||||
onActivated,
|
||||
VNodeArrayChildren,
|
||||
VNode
|
||||
} from "vue";
|
||||
import type { BreakPoint } from "./interface/index";
|
||||
|
||||
type Props = {
|
||||
cols?: number | Record<BreakPoint, number>;
|
||||
collapsed?: boolean;
|
||||
collapsedRows?: number;
|
||||
gap?: [number, number] | number;
|
||||
};
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
cols: () => ({ xs: 1, sm: 2, md: 2, lg: 3, xl: 4 }),
|
||||
collapsed: false,
|
||||
collapsedRows: 1,
|
||||
gap: 0
|
||||
});
|
||||
|
||||
onBeforeMount(() => props.collapsed && findIndex());
|
||||
onMounted(() => {
|
||||
resize({ target: { innerWidth: window.innerWidth } } as unknown as UIEvent);
|
||||
window.addEventListener("resize", resize);
|
||||
});
|
||||
onActivated(() => {
|
||||
resize({ target: { innerWidth: window.innerWidth } } as unknown as UIEvent);
|
||||
window.addEventListener("resize", resize);
|
||||
});
|
||||
onUnmounted(() => {
|
||||
window.removeEventListener("resize", resize);
|
||||
});
|
||||
onDeactivated(() => {
|
||||
window.removeEventListener("resize", resize);
|
||||
});
|
||||
|
||||
// 监听屏幕变化
|
||||
const resize = (e: UIEvent) => {
|
||||
let width = (e.target as Window).innerWidth;
|
||||
switch (!!width) {
|
||||
case width < 768:
|
||||
breakPoint.value = "xs";
|
||||
break;
|
||||
case width >= 768 && width < 992:
|
||||
breakPoint.value = "sm";
|
||||
break;
|
||||
case width >= 992 && width < 1200:
|
||||
breakPoint.value = "md";
|
||||
break;
|
||||
case width >= 1200 && width < 1920:
|
||||
breakPoint.value = "lg";
|
||||
break;
|
||||
case width >= 1920:
|
||||
breakPoint.value = "xl";
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
// 注入 gap 间距
|
||||
provide("gap", Array.isArray(props.gap) ? props.gap[0] : props.gap);
|
||||
|
||||
// 注入响应式断点
|
||||
let breakPoint = ref<BreakPoint>("xl");
|
||||
provide("breakPoint", breakPoint);
|
||||
|
||||
// 注入要开始折叠的 index
|
||||
const hiddenIndex = ref(-1);
|
||||
provide("shouldHiddenIndex", hiddenIndex);
|
||||
|
||||
// 注入 cols
|
||||
const gridCols = computed(() => {
|
||||
if (typeof props.cols === "object") return props.cols[breakPoint.value] ?? props.cols;
|
||||
return props.cols;
|
||||
});
|
||||
provide("cols", gridCols);
|
||||
|
||||
// 寻找需要开始折叠的字段 index
|
||||
const slots = useSlots().default!();
|
||||
|
||||
const findIndex = () => {
|
||||
let fields: VNodeArrayChildren = [];
|
||||
let suffix: VNode | null = null;
|
||||
slots.forEach((slot: any) => {
|
||||
// suffix
|
||||
if (typeof slot.type === "object" && slot.type.name === "GridItem" && slot.props?.suffix !== undefined) suffix = slot;
|
||||
// slot children
|
||||
if (typeof slot.type === "symbol" && Array.isArray(slot.children)) fields.push(...slot.children);
|
||||
});
|
||||
|
||||
// 计算 suffix 所占用的列
|
||||
let suffixCols = 0;
|
||||
if (suffix) {
|
||||
suffixCols =
|
||||
((suffix as VNode).props![breakPoint.value]?.span ?? (suffix as VNode).props?.span ?? 1) +
|
||||
((suffix as VNode).props![breakPoint.value]?.offset ?? (suffix as VNode).props?.offset ?? 0);
|
||||
}
|
||||
try {
|
||||
let find = false;
|
||||
fields.reduce((prev = 0, current, index) => {
|
||||
prev +=
|
||||
((current as VNode)!.props![breakPoint.value]?.span ?? (current as VNode)!.props?.span ?? 1) +
|
||||
((current as VNode)!.props![breakPoint.value]?.offset ?? (current as VNode)!.props?.offset ?? 0);
|
||||
if (Number(prev) > props.collapsedRows * gridCols.value - suffixCols) {
|
||||
hiddenIndex.value = index;
|
||||
find = true;
|
||||
throw "find it";
|
||||
}
|
||||
return prev;
|
||||
}, 0);
|
||||
if (!find) hiddenIndex.value = -1;
|
||||
} catch (e) {
|
||||
// console.warn(e);
|
||||
}
|
||||
};
|
||||
|
||||
// 断点变化时执行 findIndex
|
||||
watch(
|
||||
() => breakPoint.value,
|
||||
() => {
|
||||
if (props.collapsed) findIndex();
|
||||
}
|
||||
);
|
||||
|
||||
// 监听 collapsed
|
||||
watch(
|
||||
() => props.collapsed,
|
||||
value => {
|
||||
if (value) return findIndex();
|
||||
hiddenIndex.value = -1;
|
||||
}
|
||||
);
|
||||
|
||||
// 设置间距
|
||||
const gridGap = computed(() => {
|
||||
if (typeof props.gap === "number") return `${props.gap}px`;
|
||||
if (Array.isArray(props.gap)) return `${props.gap[1]}px ${props.gap[0]}px`;
|
||||
return "unset";
|
||||
});
|
||||
|
||||
// 设置 style
|
||||
const style = computed(() => {
|
||||
return {
|
||||
display: "grid",
|
||||
gridGap: gridGap.value,
|
||||
gridTemplateColumns: `repeat(${gridCols.value}, minmax(0, 1fr))`
|
||||
};
|
||||
});
|
||||
|
||||
defineExpose({ breakPoint });
|
||||
</script>
|
||||
@ -0,0 +1,6 @@
|
||||
export type BreakPoint = "xs" | "sm" | "md" | "lg" | "xl";
|
||||
|
||||
export type Responsive = {
|
||||
span?: number;
|
||||
offset?: number;
|
||||
};
|
||||
@ -0,0 +1,3 @@
|
||||
.upload {
|
||||
width: 80%;
|
||||
}
|
||||
149
src/renderer/themes/geeker/components/ImportExcel/index.vue
Normal file
149
src/renderer/themes/geeker/components/ImportExcel/index.vue
Normal file
@ -0,0 +1,149 @@
|
||||
<template>
|
||||
<el-dialog v-model="dialogVisible" :title="`批量添加${parameter.title}`" :destroy-on-close="true" width="580px" draggable>
|
||||
<el-form class="drawer-multiColumn-form" label-width="100px">
|
||||
<el-form-item label="模板下载 :">
|
||||
<el-button type="primary" :icon="Download" @click="downloadTemp"> 点击下载 </el-button>
|
||||
</el-form-item>
|
||||
<el-form-item label="文件上传 :">
|
||||
<el-upload
|
||||
action="#"
|
||||
class="upload"
|
||||
:drag="true"
|
||||
:limit="excelLimit"
|
||||
:multiple="true"
|
||||
:show-file-list="true"
|
||||
:http-request="uploadExcel"
|
||||
:before-upload="beforeExcelUpload"
|
||||
:on-exceed="handleExceed"
|
||||
:on-success="excelUploadSuccess"
|
||||
:on-error="excelUploadError"
|
||||
:accept="parameter.fileType!.join(',')"
|
||||
>
|
||||
<slot name="empty">
|
||||
<el-icon class="el-icon--upload">
|
||||
<upload-filled />
|
||||
</el-icon>
|
||||
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
|
||||
</slot>
|
||||
<template #tip>
|
||||
<slot name="tip">
|
||||
<div class="el-upload__tip">请上传 .xls , .xlsx 标准格式文件，文件最大为 {{ parameter.fileSize }}M</div>
|
||||
</slot>
|
||||
</template>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<el-form-item label="数据覆盖 :">
|
||||
<el-switch v-model="isCover" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="ImportExcel">
|
||||
import { ref } from "vue";
|
||||
import { useDownload } from "@themeGeeker/hooks/useDownload";
|
||||
import { Download } from "@element-plus/icons-vue";
|
||||
import { ElNotification, UploadRequestOptions, UploadRawFile } from "element-plus";
|
||||
|
||||
export interface ExcelParameterProps {
|
||||
title: string; // 标题
|
||||
fileSize?: number; // 上传文件的大小
|
||||
fileType?: File.ExcelMimeType[]; // 上传文件的类型
|
||||
tempApi?: (params: any) => Promise<any>; // 下载模板的Api
|
||||
importApi?: (params: any) => Promise<any>; // 批量导入的Api
|
||||
getTableList?: () => void; // 获取表格数据的Api
|
||||
}
|
||||
|
||||
// 是否覆盖数据
|
||||
const isCover = ref(false);
|
||||
// 最大文件上传数
|
||||
const excelLimit = ref(1);
|
||||
// dialog状态
|
||||
const dialogVisible = ref(false);
|
||||
// 父组件传过来的参数
|
||||
const parameter = ref<ExcelParameterProps>({
|
||||
title: "",
|
||||
fileSize: 5,
|
||||
fileType: ["application/vnd.ms-excel", "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"]
|
||||
});
|
||||
|
||||
// 接收父组件参数
|
||||
const acceptParams = (params: ExcelParameterProps) => {
|
||||
parameter.value = { ...parameter.value, ...params };
|
||||
dialogVisible.value = true;
|
||||
};
|
||||
|
||||
// Excel 导入模板下载
|
||||
const downloadTemp = () => {
|
||||
if (!parameter.value.tempApi) return;
|
||||
useDownload(parameter.value.tempApi, `${parameter.value.title}模板`);
|
||||
};
|
||||
|
||||
// 文件上传
|
||||
const uploadExcel = async (param: UploadRequestOptions) => {
|
||||
let excelFormData = new FormData();
|
||||
excelFormData.append("file", param.file);
|
||||
excelFormData.append("isCover", isCover.value as unknown as Blob);
|
||||
await parameter.value.importApi!(excelFormData);
|
||||
parameter.value.getTableList && parameter.value.getTableList();
|
||||
dialogVisible.value = false;
|
||||
};
|
||||
|
||||
/**
|
||||
* @description 文件上传之前判断
|
||||
* @param file 上传的文件
|
||||
* */
|
||||
const beforeExcelUpload = (file: UploadRawFile) => {
|
||||
const isExcel = parameter.value.fileType!.includes(file.type as File.ExcelMimeType);
|
||||
const fileSize = file.size / 1024 / 1024 < parameter.value.fileSize!;
|
||||
if (!isExcel)
|
||||
ElNotification({
|
||||
title: "温馨提示",
|
||||
message: "上传文件只能是 xls / xlsx 格式！",
|
||||
type: "warning"
|
||||
});
|
||||
if (!fileSize)
|
||||
setTimeout(() => {
|
||||
ElNotification({
|
||||
title: "温馨提示",
|
||||
message: `上传文件大小不能超过 ${parameter.value.fileSize}MB！`,
|
||||
type: "warning"
|
||||
});
|
||||
}, 0);
|
||||
return isExcel && fileSize;
|
||||
};
|
||||
|
||||
// 文件数超出提示
|
||||
const handleExceed = () => {
|
||||
ElNotification({
|
||||
title: "温馨提示",
|
||||
message: "最多只能上传一个文件！",
|
||||
type: "warning"
|
||||
});
|
||||
};
|
||||
|
||||
// 上传错误提示
|
||||
const excelUploadError = () => {
|
||||
ElNotification({
|
||||
title: "温馨提示",
|
||||
message: `批量添加${parameter.value.title}失败，请您重新上传！`,
|
||||
type: "error"
|
||||
});
|
||||
};
|
||||
|
||||
// 上传成功提示
|
||||
const excelUploadSuccess = () => {
|
||||
ElNotification({
|
||||
title: "温馨提示",
|
||||
message: `批量添加${parameter.value.title}成功！`,
|
||||
type: "success"
|
||||
});
|
||||
};
|
||||
|
||||
defineExpose({
|
||||
acceptParams
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import "./index.scss";
|
||||
</style>
|
||||
45
src/renderer/themes/geeker/components/Loading/fullScreen.ts
Normal file
45
src/renderer/themes/geeker/components/Loading/fullScreen.ts
Normal file
@ -0,0 +1,45 @@
|
||||
import { ElLoading } from "element-plus";
|
||||
|
||||
/* 全局请求 loading */
|
||||
let loadingInstance: ReturnType<typeof ElLoading.service>;
|
||||
|
||||
/**
|
||||
* @description 开启 Loading
|
||||
* */
|
||||
const startLoading = () => {
|
||||
loadingInstance = ElLoading.service({
|
||||
fullscreen: true,
|
||||
lock: true,
|
||||
text: "Loading",
|
||||
background: "rgba(0, 0, 0, 0.7)"
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* @description 结束 Loading
|
||||
* */
|
||||
const endLoading = () => {
|
||||
loadingInstance.close();
|
||||
};
|
||||
|
||||
/**
|
||||
* @description 显示全屏加载
|
||||
* */
|
||||
let needLoadingRequestCount = 0;
|
||||
export const showFullScreenLoading = () => {
|
||||
if (needLoadingRequestCount === 0) {
|
||||
startLoading();
|
||||
}
|
||||
needLoadingRequestCount++;
|
||||
};
|
||||
|
||||
/**
|
||||
* @description 隐藏全屏加载
|
||||
* */
|
||||
export const tryHideFullScreenLoading = () => {
|
||||
if (needLoadingRequestCount <= 0) return;
|
||||
needLoadingRequestCount--;
|
||||
if (needLoadingRequestCount === 0) {
|
||||
endLoading();
|
||||
}
|
||||
};
|
||||
67
src/renderer/themes/geeker/components/Loading/index.scss
Normal file
67
src/renderer/themes/geeker/components/Loading/index.scss
Normal file
@ -0,0 +1,67 @@
|
||||
.loading-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.loading-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 98px;
|
||||
}
|
||||
}
|
||||
.dot {
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
display: inline-block;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
font-size: 32px;
|
||||
transform: rotate(45deg);
|
||||
animation: ant-rotate 1.2s infinite linear;
|
||||
}
|
||||
.dot i {
|
||||
position: absolute;
|
||||
display: block;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
background-color: var(--el-color-primary);
|
||||
border-radius: 100%;
|
||||
opacity: 0.3;
|
||||
transform: scale(0.75);
|
||||
transform-origin: 50% 50%;
|
||||
animation: ant-spin-move 1s infinite linear alternate;
|
||||
}
|
||||
.dot i:nth-child(1) {
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
.dot i:nth-child(2) {
|
||||
top: 0;
|
||||
right: 0;
|
||||
animation-delay: 0.4s;
|
||||
}
|
||||
.dot i:nth-child(3) {
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
animation-delay: 0.8s;
|
||||
}
|
||||
.dot i:nth-child(4) {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
animation-delay: 1.2s;
|
||||
}
|
||||
|
||||
@keyframes ant-rotate {
|
||||
to {
|
||||
transform: rotate(405deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes ant-spin-move {
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
13
src/renderer/themes/geeker/components/Loading/index.vue
Normal file
13
src/renderer/themes/geeker/components/Loading/index.vue
Normal file
@ -0,0 +1,13 @@
|
||||
<template>
|
||||
<div class="loading-box">
|
||||
<div class="loading-wrap">
|
||||
<span class="dot dot-spin"><i></i><i></i><i></i><i></i></span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="Loading"></script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import "./index.scss";
|
||||
</style>
|
||||
@ -0,0 +1,45 @@
|
||||
<template>
|
||||
<!-- 列设置 -->
|
||||
<el-drawer v-model="drawerVisible" title="列设置" size="450px">
|
||||
<div class="table-main">
|
||||
<el-table :data="colSetting" :border="true" row-key="prop" default-expand-all :tree-props="{ children: '_children' }">
|
||||
<el-table-column prop="label" align="center" label="列名" />
|
||||
<el-table-column v-slot="scope" prop="isShow" align="center" label="显示">
|
||||
<el-switch v-model="scope.row.isShow"></el-switch>
|
||||
</el-table-column>
|
||||
<el-table-column v-slot="scope" prop="sortable" align="center" label="排序">
|
||||
<el-switch v-model="scope.row.sortable"></el-switch>
|
||||
</el-table-column>
|
||||
<template #empty>
|
||||
<div class="table-empty">
|
||||
<img src="@themeGeeker/assets/images/notData.png" alt="notData" />
|
||||
<div>暂无可配置列</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table>
|
||||
</div>
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="ColSetting">
|
||||
import { ref } from "vue";
|
||||
import { ColumnProps } from "@themeGeeker/components/ProTable/interface";
|
||||
|
||||
defineProps<{ colSetting: ColumnProps[] }>();
|
||||
|
||||
const drawerVisible = ref<boolean>(false);
|
||||
|
||||
const openColSetting = () => {
|
||||
drawerVisible.value = true;
|
||||
};
|
||||
|
||||
defineExpose({
|
||||
openColSetting
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.cursor-move {
|
||||
cursor: move;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,33 @@
|
||||
<template>
|
||||
<!-- 分页组件 -->
|
||||
<el-pagination
|
||||
:background="true"
|
||||
:current-page="pageable.pageNum"
|
||||
:page-size="pageable.pageSize"
|
||||
:page-sizes="[10, 25, 50, 100]"
|
||||
:total="pageable.total"
|
||||
:size="globalStore?.assemblySize ?? 'default'"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
></el-pagination>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="Pagination">
|
||||
import { useGlobalStore } from "@themeGeeker/stores/modules/global";
|
||||
const globalStore = useGlobalStore();
|
||||
|
||||
interface Pageable {
|
||||
pageNum: number;
|
||||
pageSize: number;
|
||||
total: number;
|
||||
}
|
||||
|
||||
interface PaginationProps {
|
||||
pageable: Pageable;
|
||||
handleSizeChange: (size: number) => void;
|
||||
handleCurrentChange: (currentPage: number) => void;
|
||||
}
|
||||
|
||||
defineProps<PaginationProps>();
|
||||
</script>
|
||||
@ -0,0 +1,58 @@
|
||||
<template>
|
||||
<RenderTableColumn v-bind="column" />
|
||||
</template>
|
||||
|
||||
<script setup lang="tsx" name="TableColumn">
|
||||
import { inject, ref, useSlots } from "vue";
|
||||
import { ColumnProps, RenderScope, HeaderRenderScope } from "@themeGeeker/components/ProTable/interface";
|
||||
import { filterEnum, formatValue, handleProp, handleRowAccordingToProp } from "@themeGeeker/utils";
|
||||
|
||||
defineProps<{ column: ColumnProps }>();
|
||||
|
||||
const slots = useSlots();
|
||||
|
||||
const enumMap = inject("enumMap", ref(new Map()));
|
||||
|
||||
// 渲染表格数据
|
||||
const renderCellData = (item: ColumnProps, scope: RenderScope<any>) => {
|
||||
return enumMap.value.get(item.prop) && item.isFilterEnum
|
||||
? filterEnum(handleRowAccordingToProp(scope.row, item.prop!), enumMap.value.get(item.prop)!, item.fieldNames)
|
||||
: formatValue(handleRowAccordingToProp(scope.row, item.prop!));
|
||||
};
|
||||
|
||||
// 获取 tag 类型
|
||||
const getTagType = (item: ColumnProps, scope: RenderScope<any>) => {
|
||||
return (
|
||||
filterEnum(handleRowAccordingToProp(scope.row, item.prop!), enumMap.value.get(item.prop), item.fieldNames, "tag") || "primary"
|
||||
);
|
||||
};
|
||||
|
||||
const RenderTableColumn = (item: ColumnProps) => {
|
||||
return (
|
||||
<>
|
||||
{item.isShow && (
|
||||
<el-table-column
|
||||
{...item}
|
||||
align={item.align ?? "center"}
|
||||
showOverflowTooltip={item.showOverflowTooltip ?? item.prop !== "operation"}
|
||||
>
|
||||
{{
|
||||
default: (scope: RenderScope<any>) => {
|
||||
if (item._children) return item._children.map(child => RenderTableColumn(child));
|
||||
if (item.render) return item.render(scope);
|
||||
if (item.prop && slots[handleProp(item.prop)]) return slots[handleProp(item.prop)]!(scope);
|
||||
if (item.tag) return <el-tag type={getTagType(item, scope)}>{renderCellData(item, scope)}</el-tag>;
|
||||
return renderCellData(item, scope);
|
||||
},
|
||||
header: (scope: HeaderRenderScope<any>) => {
|
||||
if (item.headerRender) return item.headerRender(scope);
|
||||
if (item.prop && slots[`${handleProp(item.prop)}Header`]) return slots[`${handleProp(item.prop)}Header`]!(scope);
|
||||
return item.label;
|
||||
}
|
||||
}}
|
||||
</el-table-column>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
</script>
|
||||
321
src/renderer/themes/geeker/components/ProTable/index.vue
Normal file
321
src/renderer/themes/geeker/components/ProTable/index.vue
Normal file
@ -0,0 +1,321 @@
|
||||
<!-- 📚📚📚 Pro-Table 文档: https://juejin.cn/post/7166068828202336263 -->
|
||||
|
||||
<template>
|
||||
<!-- 查询表单 -->
|
||||
<SearchForm
|
||||
v-show="isShowSearch"
|
||||
:search="_search"
|
||||
:reset="_reset"
|
||||
:columns="searchColumns"
|
||||
:search-param="searchParam"
|
||||
:search-col="searchCol"
|
||||
/>
|
||||
|
||||
<!-- 表格主体 -->
|
||||
<div class="card table-main">
|
||||
<!-- 表格头部 操作按钮 -->
|
||||
<div class="table-header">
|
||||
<div class="header-button-lf">
|
||||
<slot name="tableHeader" :selected-list="selectedList" :selected-list-ids="selectedListIds" :is-selected="isSelected" />
|
||||
</div>
|
||||
<div v-if="toolButton" class="header-button-ri">
|
||||
<slot name="toolButton">
|
||||
<el-button v-if="showToolButton('refresh')" :icon="Refresh" circle @click="getTableList" />
|
||||
<el-button v-if="showToolButton('setting') && columns.length" :icon="Operation" circle @click="openColSetting" />
|
||||
<el-button
|
||||
v-if="showToolButton('search') && searchColumns?.length"
|
||||
:icon="Search"
|
||||
circle
|
||||
@click="isShowSearch = !isShowSearch"
|
||||
/>
|
||||
</slot>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 表格主体 -->
|
||||
<el-table
|
||||
ref="tableRef"
|
||||
v-bind="$attrs"
|
||||
:id="uuid"
|
||||
:data="processTableData"
|
||||
:border="border"
|
||||
:row-key="rowKey"
|
||||
@selection-change="selectionChange"
|
||||
>
|
||||
<!-- 默认插槽 -->
|
||||
<slot />
|
||||
<template v-for="item in tableColumns" :key="item">
|
||||
<!-- selection || radio || index || expand || sort -->
|
||||
<el-table-column
|
||||
v-if="item.type && columnTypes.includes(item.type)"
|
||||
v-bind="item"
|
||||
:align="item.align ?? 'center'"
|
||||
:reserve-selection="item.type == 'selection'"
|
||||
>
|
||||
<template #default="scope">
|
||||
<!-- expand -->
|
||||
<template v-if="item.type == 'expand'">
|
||||
<component :is="item.render" v-bind="scope" v-if="item.render" />
|
||||
<slot v-else :name="item.type" v-bind="scope" />
|
||||
</template>
|
||||
<!-- radio -->
|
||||
<el-radio v-if="item.type == 'radio'" v-model="radio" :label="scope.row[rowKey]">
|
||||
<i></i>
|
||||
</el-radio>
|
||||
<!-- sort -->
|
||||
<el-tag v-if="item.type == 'sort'" class="move">
|
||||
<el-icon> <DCaret /></el-icon>
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- other -->
|
||||
<TableColumn v-else :column="item">
|
||||
<template v-for="slot in Object.keys($slots)" #[slot]="scope">
|
||||
<slot :name="slot" v-bind="scope" />
|
||||
</template>
|
||||
</TableColumn>
|
||||
</template>
|
||||
<!-- 插入表格最后一行之后的插槽 -->
|
||||
<template #append>
|
||||
<slot name="append" />
|
||||
</template>
|
||||
<!-- 无数据 -->
|
||||
<template #empty>
|
||||
<div class="table-empty">
|
||||
<slot name="empty">
|
||||
<img src="@themeGeeker/assets/images/notData.png" alt="notData" />
|
||||
<div>暂无数据</div>
|
||||
</slot>
|
||||
</div>
|
||||
</template>
|
||||
</el-table>
|
||||
<!-- 分页组件 -->
|
||||
<slot name="pagination">
|
||||
<Pagination
|
||||
v-if="pagination"
|
||||
:pageable="pageable"
|
||||
:handle-size-change="handleSizeChange"
|
||||
:handle-current-change="handleCurrentChange"
|
||||
/>
|
||||
</slot>
|
||||
</div>
|
||||
<!-- 列设置 -->
|
||||
<ColSetting v-if="toolButton" ref="colRef" v-model:col-setting="colSetting" />
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="ProTable">
|
||||
import { ref, watch, provide, onMounted, unref, computed, reactive } from "vue";
|
||||
import { ElTable } from "element-plus";
|
||||
import { useTable } from "@themeGeeker/hooks/useTable";
|
||||
import { useSelection } from "@themeGeeker/hooks/useSelection";
|
||||
import { BreakPoint } from "@themeGeeker/components/Grid/interface";
|
||||
import { ColumnProps, TypeProps } from "@themeGeeker/components/ProTable/interface";
|
||||
import { Refresh, Operation, Search } from "@element-plus/icons-vue";
|
||||
import { generateUUID, handleProp } from "@themeGeeker/utils";
|
||||
import SearchForm from "@themeGeeker/components/SearchForm/index.vue";
|
||||
import Pagination from "./components/Pagination.vue";
|
||||
import ColSetting from "./components/ColSetting.vue";
|
||||
import TableColumn from "./components/TableColumn.vue";
|
||||
import Sortable from "sortablejs";
|
||||
|
||||
export interface ProTableProps {
|
||||
columns: ColumnProps[]; // 列配置项 ==> 必传
|
||||
data?: any[]; // 静态 table data 数据，若存在则不会使用 requestApi 返回的 data ==> 非必传
|
||||
requestApi?: (params: any) => Promise<any>; // 请求表格数据的 api ==> 非必传
|
||||
requestAuto?: boolean; // 是否自动执行请求 api ==> 非必传（默认为true）
|
||||
requestError?: (params: any) => void; // 表格 api 请求错误监听 ==> 非必传
|
||||
dataCallback?: (data: any) => any; // 返回数据的回调函数，可以对数据进行处理 ==> 非必传
|
||||
title?: string; // 表格标题 ==> 非必传
|
||||
pagination?: boolean; // 是否需要分页组件 ==> 非必传（默认为true）
|
||||
initParam?: any; // 初始化请求参数 ==> 非必传（默认为{}）
|
||||
border?: boolean; // 是否带有纵向边框 ==> 非必传（默认为true）
|
||||
toolButton?: ("refresh" | "setting" | "search")[] | boolean; // 是否显示表格功能按钮 ==> 非必传（默认为true）
|
||||
rowKey?: string; // 行数据的 Key，用来优化 Table 的渲染，当表格数据多选时，所指定的 id ==> 非必传（默认为 id）
|
||||
searchCol?: number | Record<BreakPoint, number>; // 表格搜索项 每列占比配置 ==> 非必传 { xs: 1, sm: 2, md: 2, lg: 3, xl: 4 }
|
||||
}
|
||||
|
||||
// 接受父组件参数，配置默认值
|
||||
const props = withDefaults(defineProps<ProTableProps>(), {
|
||||
columns: () => [],
|
||||
requestAuto: true,
|
||||
pagination: true,
|
||||
initParam: {},
|
||||
border: true,
|
||||
toolButton: true,
|
||||
rowKey: "id",
|
||||
searchCol: () => ({ xs: 1, sm: 2, md: 2, lg: 3, xl: 4 })
|
||||
});
|
||||
|
||||
// table 实例
|
||||
const tableRef = ref<InstanceType<typeof ElTable>>();
|
||||
|
||||
// 生成组件唯一id
|
||||
const uuid = ref("id-" + generateUUID());
|
||||
|
||||
// column 列类型
|
||||
const columnTypes: TypeProps[] = ["selection", "radio", "index", "expand", "sort"];
|
||||
|
||||
// 是否显示搜索模块
|
||||
const isShowSearch = ref(true);
|
||||
|
||||
// 控制 ToolButton 显示
|
||||
const showToolButton = (key: "refresh" | "setting" | "search") => {
|
||||
return Array.isArray(props.toolButton) ? props.toolButton.includes(key) : props.toolButton;
|
||||
};
|
||||
|
||||
// 单选值
|
||||
const radio = ref("");
|
||||
|
||||
// 表格多选 Hooks
|
||||
const { selectionChange, selectedList, selectedListIds, isSelected } = useSelection(props.rowKey);
|
||||
|
||||
// 表格操作 Hooks
|
||||
const { tableData, pageable, searchParam, searchInitParam, getTableList, search, reset, handleSizeChange, handleCurrentChange } =
|
||||
useTable(props.requestApi, props.initParam, props.pagination, props.dataCallback, props.requestError);
|
||||
|
||||
// 清空选中数据列表
|
||||
const clearSelection = () => tableRef.value!.clearSelection();
|
||||
|
||||
// 初始化表格数据 && 拖拽排序
|
||||
onMounted(() => {
|
||||
dragSort();
|
||||
props.requestAuto && getTableList();
|
||||
props.data && (pageable.value.total = props.data.length);
|
||||
});
|
||||
|
||||
// 处理表格数据
|
||||
const processTableData = computed(() => {
|
||||
if (!props.data) return tableData.value;
|
||||
if (!props.pagination) return props.data;
|
||||
return props.data.slice(
|
||||
(pageable.value.pageNum - 1) * pageable.value.pageSize,
|
||||
pageable.value.pageSize * pageable.value.pageNum
|
||||
);
|
||||
});
|
||||
|
||||
// 监听页面 initParam 改化，重新获取表格数据
|
||||
watch(() => props.initParam, getTableList, { deep: true });
|
||||
|
||||
// 接收 columns 并设置为响应式
|
||||
const tableColumns = reactive<ColumnProps[]>(props.columns);
|
||||
|
||||
// 扁平化 columns
|
||||
const flatColumns = computed(() => flatColumnsFunc(tableColumns));
|
||||
|
||||
// 定义 enumMap 存储 enum 值（避免异步请求无法格式化单元格内容 || 无法填充搜索下拉选择）
|
||||
const enumMap = ref(new Map<string, { [key: string]: any }[]>());
|
||||
const setEnumMap = async ({ prop, enum: enumValue }: ColumnProps) => {
|
||||
if (!enumValue) return;
|
||||
|
||||
// 如果当前 enumMap 存在相同的值 return
|
||||
if (enumMap.value.has(prop!) && (typeof enumValue === "function" || enumMap.value.get(prop!) === enumValue)) return;
|
||||
|
||||
// 当前 enum 为静态数据，则直接存储到 enumMap
|
||||
if (typeof enumValue !== "function") return enumMap.value.set(prop!, unref(enumValue!));
|
||||
|
||||
// 为了防止接口执行慢，而存储慢，导致重复请求，所以预先存储为[]，接口返回后再二次存储
|
||||
enumMap.value.set(prop!, []);
|
||||
|
||||
// 当前 enum 为后台数据需要请求数据，则调用该请求接口，并存储到 enumMap
|
||||
const { data } = await enumValue();
|
||||
enumMap.value.set(prop!, data);
|
||||
};
|
||||
|
||||
// 注入 enumMap
|
||||
provide("enumMap", enumMap);
|
||||
|
||||
// 扁平化 columns 的方法
|
||||
const flatColumnsFunc = (columns: ColumnProps[], flatArr: ColumnProps[] = []) => {
|
||||
columns.forEach(async col => {
|
||||
if (col._children?.length) flatArr.push(...flatColumnsFunc(col._children));
|
||||
flatArr.push(col);
|
||||
|
||||
// column 添加默认 isShow && isSetting && isFilterEnum 属性值
|
||||
col.isShow = col.isShow ?? true;
|
||||
col.isSetting = col.isSetting ?? true;
|
||||
col.isFilterEnum = col.isFilterEnum ?? true;
|
||||
|
||||
// 设置 enumMap
|
||||
await setEnumMap(col);
|
||||
});
|
||||
return flatArr.filter(item => !item._children?.length);
|
||||
};
|
||||
|
||||
// 过滤需要搜索的配置项 && 排序
|
||||
const searchColumns = computed(() => {
|
||||
return flatColumns.value
|
||||
?.filter(item => item.search?.el || item.search?.render)
|
||||
.sort((a, b) => a.search!.order! - b.search!.order!);
|
||||
});
|
||||
|
||||
// 设置 搜索表单默认排序 && 搜索表单项的默认值
|
||||
searchColumns.value?.forEach((column, index) => {
|
||||
column.search!.order = column.search?.order ?? index + 2;
|
||||
const key = column.search?.key ?? handleProp(column.prop!);
|
||||
const defaultValue = column.search?.defaultValue;
|
||||
if (defaultValue !== undefined && defaultValue !== null) {
|
||||
searchParam.value[key] = defaultValue;
|
||||
searchInitParam.value[key] = defaultValue;
|
||||
}
|
||||
});
|
||||
|
||||
// 列设置 ==> 需要过滤掉不需要设置的列
|
||||
const colRef = ref();
|
||||
const colSetting = tableColumns!.filter(item => {
|
||||
const { type, prop, isSetting } = item;
|
||||
return !columnTypes.includes(type!) && prop !== "operation" && isSetting;
|
||||
});
|
||||
const openColSetting = () => colRef.value.openColSetting();
|
||||
|
||||
// 定义 emit 事件
|
||||
const emit = defineEmits<{
|
||||
search: [];
|
||||
reset: [];
|
||||
dragSort: [{ newIndex?: number; oldIndex?: number }];
|
||||
}>();
|
||||
|
||||
const _search = () => {
|
||||
search();
|
||||
emit("search");
|
||||
};
|
||||
|
||||
const _reset = () => {
|
||||
reset();
|
||||
emit("reset");
|
||||
};
|
||||
|
||||
// 表格拖拽排序
|
||||
const dragSort = () => {
|
||||
const tbody = document.querySelector(`#${uuid.value} tbody`) as HTMLElement;
|
||||
Sortable.create(tbody, {
|
||||
handle: ".move",
|
||||
animation: 300,
|
||||
onEnd({ newIndex, oldIndex }) {
|
||||
const [removedItem] = processTableData.value.splice(oldIndex!, 1);
|
||||
processTableData.value.splice(newIndex!, 0, removedItem);
|
||||
emit("dragSort", { newIndex, oldIndex });
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 暴露给父组件的参数和方法 (外部需要什么，都可以从这里暴露出去)
|
||||
defineExpose({
|
||||
element: tableRef,
|
||||
tableData: processTableData,
|
||||
radio,
|
||||
pageable,
|
||||
searchParam,
|
||||
searchInitParam,
|
||||
isSelected,
|
||||
selectedList,
|
||||
selectedListIds,
|
||||
|
||||
// 下面为 function
|
||||
getTableList,
|
||||
search,
|
||||
reset,
|
||||
handleSizeChange,
|
||||
handleCurrentChange,
|
||||
clearSelection,
|
||||
enumMap
|
||||
});
|
||||
</script>
|
||||
@ -0,0 +1,86 @@
|
||||
import { VNode, ComponentPublicInstance, Ref } from "vue";
|
||||
import { BreakPoint, Responsive } from "@/components/Grid/interface";
|
||||
import { TableColumnCtx } from "element-plus/es/components/table/src/table-column/defaults";
|
||||
import { ProTableProps } from "@/components/ProTable/index.vue";
|
||||
import ProTable from "@/components/ProTable/index.vue";
|
||||
|
||||
export interface EnumProps {
|
||||
label?: string; // 选项框显示的文字
|
||||
value?: string | number | boolean | any[]; // 选项框值
|
||||
disabled?: boolean; // 是否禁用此选项
|
||||
tagType?: string; // 当 tag 为 true 时，此选择会指定 tag 显示类型
|
||||
children?: EnumProps[]; // 为树形选择时，可以通过 children 属性指定子选项
|
||||
[key: string]: any;
|
||||
}
|
||||
|
||||
export type TypeProps = "index" | "selection" | "radio" | "expand" | "sort";
|
||||
|
||||
export type SearchType =
|
||||
| "input"
|
||||
| "input-number"
|
||||
| "select"
|
||||
| "select-v2"
|
||||
| "tree-select"
|
||||
| "cascader"
|
||||
| "date-picker"
|
||||
| "time-picker"
|
||||
| "time-select"
|
||||
| "switch"
|
||||
| "slider";
|
||||
|
||||
export type SearchRenderScope = {
|
||||
searchParam: { [key: string]: any };
|
||||
placeholder: string;
|
||||
clearable: boolean;
|
||||
options: EnumProps[];
|
||||
data: EnumProps[];
|
||||
};
|
||||
|
||||
export type SearchProps = {
|
||||
el?: SearchType; // 当前项搜索框的类型
|
||||
label?: string; // 当前项搜索框的 label
|
||||
props?: any; // 搜索项参数，根据 element plus 官方文档来传递，该属性所有值会透传到组件
|
||||
key?: string; // 当搜索项 key 不为 prop 属性时，可通过 key 指定
|
||||
tooltip?: string; // 搜索提示
|
||||
order?: number; // 搜索项排序（从大到小）
|
||||
span?: number; // 搜索项所占用的列数，默认为 1 列
|
||||
offset?: number; // 搜索字段左侧偏移列数
|
||||
defaultValue?: string | number | boolean | any[] | Ref<any>; // 搜索项默认值
|
||||
render?: (scope: SearchRenderScope) => VNode; // 自定义搜索内容渲染（tsx语法）
|
||||
} & Partial<Record<BreakPoint, Responsive>>;
|
||||
|
||||
export type FieldNamesProps = {
|
||||
label: string;
|
||||
value: string;
|
||||
children?: string;
|
||||
};
|
||||
|
||||
export type RenderScope<T> = {
|
||||
row: T;
|
||||
$index: number;
|
||||
column: TableColumnCtx<T>;
|
||||
[key: string]: any;
|
||||
};
|
||||
|
||||
export type HeaderRenderScope<T> = {
|
||||
$index: number;
|
||||
column: TableColumnCtx<T>;
|
||||
[key: string]: any;
|
||||
};
|
||||
|
||||
export interface ColumnProps<T = any>
|
||||
extends Partial<Omit<TableColumnCtx<T>, "type" | "children" | "renderCell" | "renderHeader">> {
|
||||
type?: TypeProps; // 列类型
|
||||
tag?: boolean | Ref<boolean>; // 是否是标签展示
|
||||
isShow?: boolean | Ref<boolean>; // 是否显示在表格当中
|
||||
isSetting?: boolean | Ref<boolean>; // 是否在 ColSetting 中可配置
|
||||
search?: SearchProps | undefined; // 搜索项配置
|
||||
enum?: EnumProps[] | Ref<EnumProps[]> | ((params?: any) => Promise<any>); // 枚举字典
|
||||
isFilterEnum?: boolean | Ref<boolean>; // 当前单元格值是否根据 enum 格式化（示例：enum 只作为搜索项数据）
|
||||
fieldNames?: FieldNamesProps; // 指定 label && value && children 的 key 值
|
||||
headerRender?: (scope: HeaderRenderScope<T>) => VNode; // 自定义表头内容渲染（tsx语法）
|
||||
render?: (scope: RenderScope<T>) => VNode | string; // 自定义单元格内容渲染（tsx语法）
|
||||
_children?: ColumnProps<T>[]; // 多级表头
|
||||
}
|
||||
|
||||
export type ProTableInstance = Omit<InstanceType<typeof ProTable>, keyof ComponentPublicInstance | keyof ProTableProps>;
|
||||
@ -0,0 +1,96 @@
|
||||
<template>
|
||||
<component
|
||||
:is="column.search?.render ?? `el-${column.search?.el}`"
|
||||
v-bind="{ ...handleSearchProps, ...placeholder, searchParam: _searchParam, clearable }"
|
||||
v-model.trim="_searchParam[column.search?.key ?? handleProp(column.prop!)]"
|
||||
:data="column.search?.el === 'tree-select' ? columnEnum : []"
|
||||
:options="['cascader', 'select-v2'].includes(column.search?.el!) ? columnEnum : []"
|
||||
>
|
||||
<template v-if="column.search?.el === 'cascader'" #default="{ data }">
|
||||
<span>{{ data[fieldNames.label] }}</span>
|
||||
</template>
|
||||
<template v-if="column.search?.el === 'select'">
|
||||
<component
|
||||
:is="`el-option`"
|
||||
v-for="(col, index) in columnEnum"
|
||||
:key="index"
|
||||
:label="col[fieldNames.label]"
|
||||
:value="col[fieldNames.value]"
|
||||
></component>
|
||||
</template>
|
||||
<slot v-else></slot>
|
||||
</component>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="SearchFormItem">
|
||||
import { computed, inject, ref } from "vue";
|
||||
import { handleProp } from "@themeGeeker/utils";
|
||||
import { ColumnProps } from "@themeGeeker/components/ProTable/interface";
|
||||
|
||||
interface SearchFormItem {
|
||||
column: ColumnProps;
|
||||
searchParam: { [key: string]: any };
|
||||
}
|
||||
const props = defineProps<SearchFormItem>();
|
||||
|
||||
// Re receive SearchParam
|
||||
const _searchParam = computed(() => props.searchParam);
|
||||
|
||||
// 判断 fieldNames 设置 label && value && children 的 key 值
|
||||
const fieldNames = computed(() => {
|
||||
return {
|
||||
label: props.column.fieldNames?.label ?? "label",
|
||||
value: props.column.fieldNames?.value ?? "value",
|
||||
children: props.column.fieldNames?.children ?? "children"
|
||||
};
|
||||
});
|
||||
|
||||
// 接收 enumMap (el 为 select-v2 需单独处理 enumData)
|
||||
const enumMap = inject("enumMap", ref(new Map()));
|
||||
const columnEnum = computed(() => {
|
||||
let enumData = enumMap.value.get(props.column.prop);
|
||||
if (!enumData) return [];
|
||||
if (props.column.search?.el === "select-v2" && props.column.fieldNames) {
|
||||
enumData = enumData.map((item: { [key: string]: any }) => {
|
||||
return { ...item, label: item[fieldNames.value.label], value: item[fieldNames.value.value] };
|
||||
});
|
||||
}
|
||||
return enumData;
|
||||
});
|
||||
|
||||
// 处理透传的 searchProps (el 为 tree-select、cascader 的时候需要给下默认 label && value && children)
|
||||
const handleSearchProps = computed(() => {
|
||||
const label = fieldNames.value.label;
|
||||
const value = fieldNames.value.value;
|
||||
const children = fieldNames.value.children;
|
||||
const searchEl = props.column.search?.el;
|
||||
let searchProps = props.column.search?.props ?? {};
|
||||
if (searchEl === "tree-select") {
|
||||
searchProps = { ...searchProps, props: { ...searchProps, label, children }, nodeKey: value };
|
||||
}
|
||||
if (searchEl === "cascader") {
|
||||
searchProps = { ...searchProps, props: { ...searchProps, label, value, children } };
|
||||
}
|
||||
return searchProps;
|
||||
});
|
||||
|
||||
// 处理默认 placeholder
|
||||
const placeholder = computed(() => {
|
||||
const search = props.column.search;
|
||||
if (["datetimerange", "daterange", "monthrange"].includes(search?.props?.type) || search?.props?.isRange) {
|
||||
return {
|
||||
rangeSeparator: search?.props?.rangeSeparator ?? "至",
|
||||
startPlaceholder: search?.props?.startPlaceholder ?? "开始时间",
|
||||
endPlaceholder: search?.props?.endPlaceholder ?? "结束时间"
|
||||
};
|
||||
}
|
||||
const placeholder = search?.props?.placeholder ?? (search?.el?.includes("input") ? "请输入" : "请选择");
|
||||
return { placeholder };
|
||||
});
|
||||
|
||||
// 是否有清除按钮 (当搜索项有默认值时，清除按钮不显示)
|
||||
const clearable = computed(() => {
|
||||
const search = props.column.search;
|
||||
return search?.props?.clearable ?? (search?.defaultValue == null || search?.defaultValue == undefined);
|
||||
});
|
||||
</script>
|
||||
94
src/renderer/themes/geeker/components/SearchForm/index.vue
Normal file
94
src/renderer/themes/geeker/components/SearchForm/index.vue
Normal file
@ -0,0 +1,94 @@
|
||||
<template>
|
||||
<div v-if="columns.length" class="card table-search">
|
||||
<el-form ref="formRef" :model="searchParam">
|
||||
<Grid ref="gridRef" :collapsed="collapsed" :gap="[20, 0]" :cols="searchCol">
|
||||
<GridItem v-for="(item, index) in columns" :key="item.prop" v-bind="getResponsive(item)" :index="index">
|
||||
<el-form-item>
|
||||
<template #label>
|
||||
<el-space :size="4">
|
||||
<span>{{ `${item.search?.label ?? item.label}` }}</span>
|
||||
<el-tooltip v-if="item.search?.tooltip" effect="dark" :content="item.search?.tooltip" placement="top">
|
||||
<i :class="'iconfont icon-yiwen'"></i>
|
||||
</el-tooltip>
|
||||
</el-space>
|
||||
<span> :</span>
|
||||
</template>
|
||||
<SearchFormItem :column="item" :search-param="searchParam" />
|
||||
</el-form-item>
|
||||
</GridItem>
|
||||
<GridItem suffix>
|
||||
<div class="operation">
|
||||
<el-button type="primary" :icon="Search" @click="search"> 搜索 </el-button>
|
||||
<el-button :icon="Delete" @click="reset"> 重置 </el-button>
|
||||
<el-button v-if="showCollapse" type="primary" link class="search-isOpen" @click="collapsed = !collapsed">
|
||||
{{ collapsed ? "展开" : "合并" }}
|
||||
<el-icon class="el-icon--right">
|
||||
<component :is="collapsed ? ArrowDown : ArrowUp"></component>
|
||||
</el-icon>
|
||||
</el-button>
|
||||
</div>
|
||||
</GridItem>
|
||||
</Grid>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts" name="SearchForm">
|
||||
import { computed, ref } from "vue";
|
||||
import { ColumnProps } from "@themeGeeker/components/ProTable/interface";
|
||||
import { BreakPoint } from "@themeGeeker/components/Grid/interface";
|
||||
import { Delete, Search, ArrowDown, ArrowUp } from "@element-plus/icons-vue";
|
||||
import SearchFormItem from "./components/SearchFormItem.vue";
|
||||
import Grid from "@themeGeeker/components/Grid/index.vue";
|
||||
import GridItem from "@themeGeeker/components/Grid/components/GridItem.vue";
|
||||
|
||||
interface ProTableProps {
|
||||
columns?: ColumnProps[]; // 搜索配置列
|
||||
searchParam?: { [key: string]: any }; // 搜索参数
|
||||
searchCol: number | Record<BreakPoint, number>;
|
||||
search: (params: any) => void; // 搜索方法
|
||||
reset: (params: any) => void; // 重置方法
|
||||
}
|
||||
|
||||
// 默认值
|
||||
const props = withDefaults(defineProps<ProTableProps>(), {
|
||||
columns: () => [],
|
||||
searchParam: () => ({})
|
||||
});
|
||||
|
||||
// 获取响应式设置
|
||||
const getResponsive = (item: ColumnProps) => {
|
||||
return {
|
||||
span: item.search?.span,
|
||||
offset: item.search?.offset ?? 0,
|
||||
xs: item.search?.xs,
|
||||
sm: item.search?.sm,
|
||||
md: item.search?.md,
|
||||
lg: item.search?.lg,
|
||||
xl: item.search?.xl
|
||||
};
|
||||
};
|
||||
|
||||
// 是否默认折叠搜索项
|
||||
const collapsed = ref(true);
|
||||
|
||||
// 获取响应式断点
|
||||
const gridRef = ref();
|
||||
const breakPoint = computed<BreakPoint>(() => gridRef.value?.breakPoint);
|
||||
|
||||
// 判断是否显示 展开/合并 按钮
|
||||
const showCollapse = computed(() => {
|
||||
let show = false;
|
||||
props.columns.reduce((prev, current) => {
|
||||
prev +=
|
||||
(current.search![breakPoint.value]?.span ?? current.search?.span ?? 1) +
|
||||
(current.search![breakPoint.value]?.offset ?? current.search?.offset ?? 0);
|
||||
if (typeof props.searchCol !== "number") {
|
||||
if (prev >= props.searchCol[breakPoint.value]) show = true;
|
||||
} else {
|
||||
if (prev >= props.searchCol) show = true;
|
||||
}
|
||||
return prev;
|
||||
}, 0);
|
||||
return show;
|
||||
});
|
||||
</script>
|
||||
@ -0,0 +1,63 @@
|
||||
.select-filter {
|
||||
width: 100%;
|
||||
.select-filter-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-bottom: 1px dashed var(--el-border-color-light);
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
.select-filter-item-title {
|
||||
margin-top: -2px;
|
||||
span {
|
||||
font-size: 14px;
|
||||
color: var(--el-text-color-regular);
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
.select-filter-notData {
|
||||
margin: 18px 0;
|
||||
font-size: 14px;
|
||||
color: var(--el-text-color-regular);
|
||||
}
|
||||
.select-filter-list {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
padding: 0;
|
||||
margin: 13px 0;
|
||||
li {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 5px 15px;
|
||||
margin-right: 16px;
|
||||
font-size: 13px;
|
||||
color: var(--el-color-primary);
|
||||
list-style: none;
|
||||
cursor: pointer;
|
||||
background: var(--el-color-primary-light-9);
|
||||
border: 1px solid var(--el-color-primary-light-5);
|
||||
border-radius: 32px;
|
||||
&:hover {
|
||||
color: #ffffff;
|
||||
background: var(--el-color-primary);
|
||||
border-color: var(--el-color-primary);
|
||||
transition: 0.1s;
|
||||
}
|
||||
&.active {
|
||||
font-weight: bold;
|
||||
color: #ffffff;
|
||||
background: var(--el-color-primary);
|
||||
border-color: var(--el-color-primary);
|
||||
}
|
||||
.el-icon {
|
||||
margin-right: 4px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
span {
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
110
src/renderer/themes/geeker/components/SelectFilter/index.vue
Normal file
110
src/renderer/themes/geeker/components/SelectFilter/index.vue
Normal file
@ -0,0 +1,110 @@
|
||||
<template>
|
||||
<div class="select-filter">
|
||||
<div v-for="item in data" :key="item.key" class="select-filter-item">
|
||||
<div class="select-filter-item-title">
|
||||
<span>{{ item.title }} ：</span>
|
||||
</div>
|
||||
<span v-if="!item.options.length" class="select-filter-notData">暂无数据 ~</span>
|
||||
<el-scrollbar>
|
||||
<ul class="select-filter-list">
|
||||
<li
|
||||
v-for="option in item.options"
|
||||
:key="option.value"
|
||||
:class="{
|
||||
active:
|
||||
option.value === selected[item.key] ||
|
||||
(Array.isArray(selected[item.key]) && selected[item.key].includes(option.value))
|
||||
}"
|
||||
@click="select(item, option)"
|
||||
>
|
||||
<slot :row="option">
|
||||
<el-icon v-if="option.icon">
|
||||
<component :is="option.icon" />
|
||||
</el-icon>
|
||||
<span>{{ option.label }}</span>
|
||||
</slot>
|
||||
</li>
|
||||
</ul>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="selectFilter">
|
||||
import { ref, watch } from "vue";
|
||||
|
||||
interface OptionsProps {
|
||||
value: string | number;
|
||||
label: string;
|
||||
icon?: string;
|
||||
}
|
||||
|
||||
interface SelectDataProps {
|
||||
title: string; // 列表标题
|
||||
key: string; // 当前筛选项 key 值
|
||||
multiple?: boolean; // 是否为多选
|
||||
options: OptionsProps[]; // 筛选数据
|
||||
}
|
||||
|
||||
interface SelectFilterProps {
|
||||
data?: SelectDataProps[]; // 选择的列表数据
|
||||
defaultValues?: { [key: string]: any }; // 默认值
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<SelectFilterProps>(), {
|
||||
data: () => [],
|
||||
defaultValues: () => ({})
|
||||
});
|
||||
|
||||
// 重新接收默认值
|
||||
const selected = ref<{ [key: string]: any }>({});
|
||||
watch(
|
||||
() => props.defaultValues,
|
||||
() => {
|
||||
props.data.forEach(item => {
|
||||
if (item.multiple) selected.value[item.key] = props.defaultValues[item.key] ?? [""];
|
||||
else selected.value[item.key] = props.defaultValues[item.key] ?? "";
|
||||
});
|
||||
},
|
||||
{ deep: true, immediate: true }
|
||||
);
|
||||
|
||||
// emit
|
||||
const emit = defineEmits<{
|
||||
change: [value: any];
|
||||
}>();
|
||||
|
||||
/**
|
||||
* @description 选择筛选项
|
||||
* @param {Object} item 选中的哪项列表
|
||||
* @param {Object} option 选中的值
|
||||
* @return void
|
||||
* */
|
||||
const select = (item: SelectDataProps, option: OptionsProps) => {
|
||||
if (!item.multiple) {
|
||||
// * 单选
|
||||
if (selected.value[item.key] !== option.value) selected.value[item.key] = option.value;
|
||||
} else {
|
||||
// * 多选
|
||||
// 如果选中的是第一个值，则直接设置
|
||||
if (item.options[0].value === option.value) selected.value[item.key] = [option.value];
|
||||
// 如果选择的值已经选中了，则删除选中的值
|
||||
if (selected.value[item.key].includes(option.value)) {
|
||||
let currentIndex = selected.value[item.key].findIndex((s: any) => s === option.value);
|
||||
selected.value[item.key].splice(currentIndex, 1);
|
||||
// 当全部删光时，把第第一个值选中
|
||||
if (selected.value[item.key].length == 0) selected.value[item.key] = [item.options[0].value];
|
||||
} else {
|
||||
// 未选中点击值的时候，追加选中值
|
||||
selected.value[item.key].push(option.value);
|
||||
// 单选中全部并且点击到了未选中的值，把第一个值删除掉
|
||||
if (selected.value[item.key].includes(item.options[0].value)) selected.value[item.key].splice(0, 1);
|
||||
}
|
||||
}
|
||||
emit("change", selected.value);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import "./index.scss";
|
||||
</style>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user