调整 useBaseStore 为 useBase

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "front-next",
-	"version": "5.2.3",
+	"version": "5.2.4",
 	"scripts": {
 		"dev": "vite --host",
 		"build": "vite build",

src/App.vue

@@ -20,9 +20,9 @@
 <script lang="ts" setup>
 import { ElConfigProvider } from "element-plus";
 import zhCn from "element-plus/lib/locale/lang/zh-cn";
-import { useBaseStore } from "/$/base";
+import { useBase } from "/$/base";
 
-const { app } = useBaseStore();
+const { app } = useBase();
 </script>
 
 <style lang="scss" src="./assets/css/index.scss"></style>

src/cool/bootstrap.ts

@@ -2,7 +2,7 @@ import { createPinia } from "pinia";
 import { App } from "vue";
 import { useModule } from "./module";
 import { router, viewer } from "./router";
-import { useBaseStore } from "/$/base";
+import { useBase } from "/$/base";
 import mitt from "mitt";
 import VueECharts from "vue-echarts";
 import ElementPlus from "element-plus";
@@ -23,7 +23,7 @@ export async function bootstrap(Vue: App) {
 	Vue.component("v-chart", VueECharts);
 
 	// 基础
-	const { app, user, menu } = useBaseStore();
+	const { app, user, menu } = useBase();
 
 	// 加载模块
 	useModule(Vue);

src/cool/router/index.ts

@@ -8,7 +8,7 @@ import {
 	RouteRecordRaw
 } from "vue-router";
 import { storage, config } from "/@/cool";
-import { useBaseStore } from "/$/base";
+import { useBase } from "/$/base";
 import { cloneDeep, isArray } from "lodash";
 
 // 视图文件
@@ -50,7 +50,7 @@ const router = createRouter({
 
 // 路由守卫
 router.beforeEach((to: any, _: any, next: NavigationGuardNext) => {
-	const { user, process } = useBaseStore();
+	const { user, process } = useBase();
 
 	if (user.token) {
 		if (to.path.includes("/login")) {

src/cool/service/request.ts

@@ -4,7 +4,7 @@ import "nprogress/nprogress.css";
 import { ElMessage } from "element-plus";
 import { isDev, config } from "/@/cool";
 import { storage } from "/@/cool/utils";
-import { useBaseStore } from "/$/base";
+import { useBase } from "/$/base";
 import { router } from "../router";
 
 axios.defaults.timeout = 30000;
@@ -26,7 +26,7 @@ axios.interceptors.request.eject(axios._req);
 // @ts-ignore
 axios._req = axios.interceptors.request.use(
 	(req: any) => {
-		const { user } = useBaseStore();
+		const { user } = useBase();
 
 		if (req.url) {
 			// 请求进度条

src/modules/base/common/permission.ts

@@ -1,8 +1,8 @@
-import { useBaseStore } from "../store";
+import { useStore } from "../store";
 import { isObject } from "lodash";
 
 function parse(value: any) {
-	const { menu } = useBaseStore();
+	const { menu } = useStore();
 
 	if (typeof value == "string") {
 		return value ? menu.perms.some((e: any) => e.includes(value.replace(/\s/g, ""))) : false;

src/modules/base/common/resize.ts

@@ -1,8 +1,8 @@
 import { useEventListener } from "@vueuse/core";
-import { useBaseStore } from "../store";
+import { useStore } from "../store";
 
 function resize() {
-	const { app } = useBaseStore();
+	const { app } = useStore();
 	app.setBrowser();
 	app.isFold = app.browser.isMini;
 }

src/modules/base/components/select/index.vue

@@ -0,0 +1,61 @@
+<template>
+	<el-select v-model="value" @change="onChange" clearable>
+		<el-option
+			v-for="(item, index) in options"
+			:key="index"
+			:label="item.label"
+			:value="item.value"
+		></el-option>
+	</el-select>
+</template>
+
+<script lang="ts">
+import { useCrud } from "@cool-vue/crud";
+import { defineComponent, PropType, ref, watch } from "vue";
+
+export default defineComponent({
+	name: "cl-select",
+
+	props: {
+		modelValue: [String, Number],
+		options: {
+			type: Array as PropType<Array<{ label: string; value: any }>>,
+			default: () => []
+		},
+		prop: String
+	},
+
+	emits: ["update:modelValue", "change"],
+
+	setup(props, { emit }) {
+		// cl-crud
+		const Crud = useCrud();
+		const value = ref();
+
+		// 值改变
+		function onChange(val: string) {
+			emit("update:modelValue", val);
+			emit("change", val);
+
+			if (props.prop) {
+				Crud.value?.refresh({ page: 1, [props.prop]: val === "" ? undefined : val });
+			}
+		}
+
+		watch(
+			() => props.modelValue,
+			(val) => {
+				value.value = val;
+			},
+			{
+				immediate: true
+			}
+		);
+
+		return {
+			value,
+			onChange
+		};
+	}
+});
+</script>

src/modules/base/index.ts

@@ -1,4 +1,10 @@
+import { useStore } from "./store";
 import "./static/css/index.scss";
 
-export * from "./store";
+export function useBase() {
+	return {
+		...useStore()
+	};
+}
+
 export * from "./common";

src/modules/base/pages/error-page/components/error-page.vue

@@ -35,7 +35,7 @@
 <script lang="ts">
 import { defineComponent, ref } from "vue";
 import { useCool } from "/@/cool";
-import { useBaseStore } from "/$/base/store";
+import { useBase } from "/$/base";
 
 export default defineComponent({
 	props: {
@@ -45,7 +45,7 @@ export default defineComponent({
 
 	setup() {
 		const { router } = useCool();
-		const { user, menu } = useBaseStore();
+		const { user, menu } = useBase();
 
 		const url = ref<string>("");
 		const isLogout = ref<boolean>(false);

src/modules/base/pages/layout/components/process.vue

@@ -2,6 +2,7 @@
 	<div class="app-process">
 		<div class="app-process__back" @click="router.back">
 			<el-icon :size="15"><arrow-left /></el-icon>
+			<span>返回</span>
 		</div>
 
 		<div :ref="setRefs('scroller')" class="app-process__scroller">
@@ -30,10 +31,10 @@ import { last } from "lodash";
 import { useCool } from "/@/cool";
 import { ArrowLeft, Close } from "@element-plus/icons-vue";
 import { ContextMenu } from "@cool-vue/crud";
-import { useBaseStore } from "/$/base";
+import { useBase } from "/$/base";
 
 const { refs, setRefs, route, router } = useCool();
-const { process } = useBaseStore();
+const { process } = useBase();
 
 // 跳转
 function toPath() {

src/modules/base/pages/layout/components/route-nav.vue

@@ -19,14 +19,14 @@
 import { computed, defineComponent, ref, watch } from "vue";
 import _ from "lodash";
 import { useCool } from "/@/cool";
-import { useBaseStore } from "/$/base/store";
+import { useBase } from "/$/base";
 
 export default defineComponent({
 	name: "route-nav",
 
 	setup() {
 		const { route } = useCool();
-		const { app, menu } = useBaseStore();
+		const { app, menu } = useBase();
 
 		// 数据列表
 		const list = ref<any[]>([]);

src/modules/base/pages/layout/components/slider.vue

@@ -13,7 +13,7 @@
 
 <script lang="tsx">
 import { defineComponent, ref, watch, h } from "vue";
-import { useBaseStore } from "/$/base";
+import { useBase } from "/$/base";
 import { useCool } from "/@/cool";
 import Logo from "/@/assets/logo.png";
 
@@ -24,7 +24,7 @@ export default defineComponent({
 		MenuNav: {
 			setup() {
 				const { router, route } = useCool();
-				const { menu } = useBaseStore();
+				const { menu } = useBase();
 
 				// 是否可见
 				const visible = ref<boolean>(true);
@@ -58,7 +58,7 @@ export default defineComponent({
 			},
 
 			render(ctx: any) {
-				const { app } = useBaseStore();
+				const { app } = useBase();
 
 				function deepMenu(list: any[], index: number) {
 					return list
@@ -145,7 +145,7 @@ export default defineComponent({
 		return {
 			toHome,
 			Logo,
-			...useBaseStore()
+			...useBase()
 		};
 	}
 });

src/modules/base/pages/layout/components/topbar.vue

@@ -48,12 +48,12 @@
 </template>
 
 <script lang="ts" setup>
-import { useBaseStore } from "/$/base";
+import { useBase } from "/$/base";
 import { useCool } from "/@/cool";
 import RouteNav from "./route-nav.vue";
 
 const { router } = useCool();
-const { user, app } = useBaseStore();
+const { user, app } = useBase();
 
 // 跳转
 function onCommand(name: string) {

src/modules/base/pages/layout/components/views.vue

@@ -10,9 +10,9 @@
 
 <script lang="ts" setup>
 import { computed } from "vue";
-import { useBaseStore } from "/$/base";
+import { useBase } from "/$/base";
 
-const { app, process } = useBaseStore();
+const { app, process } = useBase();
 
 // 缓存列表
 const caches = computed(() => {

src/modules/base/pages/layout/index.vue

@@ -19,9 +19,9 @@ import Topbar from "./components/topbar.vue";
 import Slider from "./components/slider.vue";
 import Process from "./components/process.vue";
 import Views from "./components/views.vue";
-import { useBaseStore } from "/$/base";
+import { useBase } from "/$/base";
 
-const { app } = useBaseStore();
+const { app } = useBase();
 </script>
 
 <style lang="scss" scoped>

src/modules/base/pages/login/index.vue

@@ -58,7 +58,7 @@
 import { defineComponent, reactive, ref } from "vue";
 import { ElMessage } from "element-plus";
 import { useCool } from "/@/cool";
-import { useBaseStore } from "/$/base";
+import { useBase } from "/$/base";
 import Captcha from "./components/captcha.vue";
 import Logo from "/@/assets/logo-text.png";
 
@@ -75,7 +75,7 @@ export default defineComponent({
 
 	setup() {
 		const { refs, setRefs, router, service } = useCool();
-		const { user, menu } = useBaseStore();
+		const { user, menu } = useBase();
 
 		// 状态1
 		const saving = ref<boolean>(false);

src/modules/base/store/index.ts

@@ -3,7 +3,7 @@ import { useMenuStore } from "./menu";
 import { useProcessStore } from "./process";
 import { useUserStore } from "./user";
 
-export function useBaseStore() {
+export function useStore() {
 	const app = useAppStore();
 	const menu = useMenuStore();
 	const process = useProcessStore();

src/modules/base/store/user.ts

@@ -1,6 +1,6 @@
 import { defineStore } from "pinia";
 import { ref } from "vue";
-import { href, storage } from "/@/cool/utils";
+import { storage } from "/@/cool/utils";
 import { service, config, router } from "/@/cool";
 
 interface User {

src/modules/base/views/components/dept-tree.vue

@@ -27,7 +27,6 @@
 			<el-tree
 				v-loading="loading"
 				node-key="id"
-				highlight-current
 				default-expand-all
 				:data="list"
 				:props="{
@@ -41,9 +40,14 @@
 			>
 				<template #default="{ node, data }">
 					<div class="dept-tree__node">
-						<span class="dept-tree__node-label" @click="rowClick(data)">{{
-							node.label
-						}}</span>
+						<span
+							class="dept-tree__node-label"
+							:class="{
+								'is-active': data.id == info?.id
+							}"
+							@click="rowClick(data)"
+							>{{ node.label }}</span
+						>
 						<span
 							v-if="app.browser.isMini"
 							class="dept-tree__node-icon"
@@ -68,7 +72,7 @@ import { deepTree, revDeepTree } from "/@/cool/utils";
 import { isArray } from "lodash";
 import { ContextMenu, useForm } from "@cool-vue/crud";
 import { Refresh, Operation, MoreFilled } from "@element-plus/icons-vue";
-import { useBaseStore, checkPerm } from "/$/base";
+import { useBase, checkPerm } from "/$/base";
 
 export default defineComponent({
 	name: "dept-tree",
@@ -98,6 +102,9 @@ export default defineComponent({
 		// 树形列表
 		const list = ref<any[]>([]);
 
+		// 选中
+		const info = ref();
+
 		// 加载中
 		const loading = ref<boolean>(false);
 
@@ -119,12 +126,18 @@ export default defineComponent({
 
 		// 刷新
 		async function refresh() {
-			isDrag.value = false;
 			loading.value = true;
+			isDrag.value = false;
 
 			await service.base.sys.department.list().then((res: any[]) => {
 				list.value = deepTree(res);
-				emit("list-change", list.value);
+
+				if (!info.value) {
+					info.value = list.value[0];
+				}
+
+				// 模拟点击
+				rowClick(info.value);
 			});
 
 			loading.value = false;
@@ -132,9 +145,12 @@ export default defineComponent({
 
 		// 获取 ids
 		function rowClick(e: any) {
-			const ids = e.children ? revDeepTree(e.children).map((e) => e.id) : [];
-			ids.unshift(e.id);
-			emit("row-click", { item: e, ids });
+			if (e) {
+				const ids = e.children ? revDeepTree(e.children).map((e) => e.id) : [];
+				ids.unshift(e.id);
+				info.value = e;
+				emit("row-click", { item: e, ids });
+			}
 		}
 
 		// 编辑部门
@@ -211,6 +227,10 @@ export default defineComponent({
 						deleteUser: f
 					})
 					.then(() => {
+						if (e.id == info.value.id) {
+							info.value = null;
+						}
+
 						if (f) {
 							ElMessage.success("删除成功");
 						} else {
@@ -346,6 +366,7 @@ export default defineComponent({
 		return {
 			Form,
 			list,
+			info,
 			loading,
 			isDrag,
 			onContextMenu,
@@ -356,7 +377,7 @@ export default defineComponent({
 			rowEdit,
 			rowDel,
 			treeOrder,
-			...useBaseStore()
+			...useBase()
 		};
 	}
 });
@@ -433,6 +454,11 @@ export default defineComponent({
 			overflow: hidden;
 			text-overflow: ellipsis;
 			white-space: nowrap;
+
+			&.is-active {
+				color: var(--color-primary);
+				font-weight: bold;
+			}
 		}
 
 		&-icon {

src/modules/base/views/info.vue

@@ -40,12 +40,12 @@ export default {
 <script lang="ts" setup>
 import { ElMessage } from "element-plus";
 import { reactive, ref } from "vue";
-import { useBaseStore } from "/$/base";
+import { useBase } from "/$/base";
 import { useCool } from "/@/cool";
 import { cloneDeep } from "lodash";
 
 const { service } = useCool();
-const { user } = useBaseStore();
+const { user } = useBase();
 
 // 表单数据
 const form = reactive<any>(cloneDeep(user.info));

src/modules/base/views/user.vue

@@ -3,11 +3,7 @@
 		<div class="pane">
 			<!-- 组织架构 -->
 			<div class="dept" :class="[isExpand ? '_expand' : '_collapse']">
-				<dept-tree
-					@row-click="onDeptRowClick"
-					@user-add="onDeptUserAdd"
-					@list-change="onDeptListChange"
-				/>
+				<dept-tree @row-click="onDeptRowClick" @user-add="onDeptUserAdd" />
 			</div>
 
 			<!-- 成员列表 -->
@@ -18,7 +14,7 @@
 						<el-icon v-else><arrow-right /></el-icon>
 					</div>
 
-					<span>成员列表</span>
+					<span>成员列表（{{ selects.dept?.name }}）</span>
 				</div>
 
 				<div class="user__container">
@@ -94,12 +90,12 @@ import { useTable, useUpsert, useCrud } from "@cool-vue/crud";
 import { reactive, ref, watch } from "vue";
 import { ArrowLeft, ArrowRight } from "@element-plus/icons-vue";
 import { useCool } from "/@/cool";
-import { useBaseStore } from "../store";
+import { useBase } from "/$/base";
 import DeptMoveForm from "./components/dept-move";
 import DeptTree from "./components/dept-tree.vue";
 
 const { service } = useCool();
-const { app } = useBaseStore();
+const { app } = useBase();
 
 const DeptMove = ref<any>();
 
@@ -112,18 +108,10 @@ const selects = reactive<any>({
 	ids: []
 });
 
-// 部门列表
-const dept = ref<any[]>([]);
-
 // cl-crud 配置
-const Crud = useCrud(
-	{
-		service: service.base.sys.user
-	},
-	(app) => {
-		app.refresh();
-	}
-);
+const Crud = useCrud({
+	service: service.base.sys.user
+});
 
 // cl-table 配置
 const Table = useTable({
@@ -322,19 +310,9 @@ const Upsert = useUpsert({
 	],
 
 	onSubmit(_, data, { next }) {
-		let departmentId = data.departmentId;
-
-		if (!departmentId) {
-			departmentId = selects.dept.id;
-
-			if (!departmentId) {
-				departmentId = dept.value[0].id;
-			}
-		}
-
 		next({
 			...data,
-			departmentId
+			departmentId: selects.dept.id
 		});
 	},
 
@@ -363,17 +341,6 @@ const Upsert = useUpsert({
 	}
 });
 
-// 监听屏幕大小变化
-watch(
-	() => app.browser.isMini,
-	(val: boolean) => {
-		isExpand.value = !val;
-	},
-	{
-		immediate: true
-	}
-);
-
 // 刷新列表
 function refresh(params: any) {
 	Crud.value?.refresh(params);
@@ -406,11 +373,6 @@ function onDeptUserAdd(item: any) {
 	});
 }
 
-// 部门列表监听
-function onDeptListChange(list: any[]) {
-	dept.value = list;
-}
-
 // 是否显示部门
 function deptExpand() {
 	isExpand.value = !isExpand.value;
@@ -428,6 +390,17 @@ async function toMove(e?: any) {
 
 	DeptMove.value.toMove(ids);
 }
+
+// 监听屏幕大小变化
+watch(
+	() => app.browser.isMini,
+	(val: boolean) => {
+		isExpand.value = !val;
+	},
+	{
+		immediate: true
+	}
+);
 </script>
 
 <style lang="scss" scoped>

src/modules/upload/components/index.vue

@@ -137,7 +137,7 @@ import { useCool } from "/@/cool";
 import { extname, module, uuid } from "/@/cool/utils";
 import { isArray, isNumber } from "lodash";
 import { ElMessage } from "element-plus";
-import { useBaseStore } from "/$/base";
+import { useBase } from "/$/base";
 import Draggable from "vuedraggable";
 import { fileSize, fileName } from "../utils";
 import dayjs from "dayjs";
@@ -182,7 +182,7 @@ const emit = defineEmits(["update:modelValue", "upload", "success", "error", "pr
 const { service } = useCool();
 
 // 缓存
-const { user } = useBaseStore();
+const { user } = useBase();
 
 // 模块配置
 const { options } = module.get("upload");

src/modules/upload/components/space.vue

@@ -112,7 +112,7 @@ import { isEmpty } from "lodash";
 import Category from "./space/category.vue";
 import FileItem from "./space/file-item.vue";
 import { useCool } from "/@/cool";
-import { useBaseStore } from "/$/base";
+import { useBase } from "/$/base";
 import { Notebook, ArrowLeft, UploadFilled } from "@element-plus/icons-vue";
 
 const props = defineProps({
@@ -134,7 +134,7 @@ const emit = defineEmits(["update:modelValue", "confirm"]);
 const { service } = useCool();
 
 // 缓存
-const { app } = useBaseStore();
+const { app } = useBase();
 
 // 模块配置
 const { options } = module.get("upload");

src/modules/upload/components/space/category.vue

@@ -38,12 +38,12 @@ import { computed, inject, onMounted, ref } from "vue";
 import { isEmpty } from "lodash";
 import { useCool } from "/@/cool";
 import { ContextMenu, useForm } from "@cool-vue/crud";
-import { useBaseStore } from "/$/base/store";
+import { useBase } from "/$/base";
 
 const { service } = useCool();
 
 // 缓存
-const { app } = useBaseStore();
+const { app } = useBase();
 
 // 接收
 const space = inject<any>("space");

vite.config.ts

@@ -56,11 +56,11 @@ export default (): UserConfig => {
 			polyfillDynamicImport: false, // 必须为false
 			rollupOptions: {
 				output: {
-					manualChunks(id) {
-						if (id.includes("node_modules")) {
-							return id.toString().split("node_modules/")[1].split("/")[0].toString();
-						}
-					}
+					// manualChunks(id) {
+					// 	if (id.includes("node_modules")) {
+					// 		return id.toString().split("node_modules/")[1].split("/")[0].toString();
+					// 	}
+					// }
 				}
 			}
 		}