فهرست منبع

修改字典 0 的错误问题

神仙都没用 1 سال پیش
والد
کامیت
4efb765721
3فایلهای تغییر یافته به همراه58 افزوده شده و 18 حذف شده
  1. 51 8
      src/modules/demo/components/select-user.vue
  2. 6 9
      src/modules/demo/views/crud.vue
  3. 1 1
      src/modules/dict/store/dict.ts

+ 51 - 8
src/modules/demo/components/select-user.vue

@@ -16,6 +16,9 @@
 				<!-- 刷新按钮 -->
 				<cl-refresh-btn />
 
+				<!-- 全选 -->
+				<el-button type="primary" @click="selectAll">全选</el-button>
+
 				<cl-filter label="状态">
 					<cl-select :options="options.status" prop="status" :width="120" />
 				</cl-filter>
@@ -27,11 +30,11 @@
 
 			<cl-row>
 				<!-- 数据表格 -->
-				<cl-table ref="Table" :auto-height="false" />
+				<cl-table ref="Table" :auto-height="false" @selection-change="onSelectionChange" />
 			</cl-row>
 
 			<cl-row>
-				<span>已选 {{ Table?.selection.length }} 人</span>
+				<span>已选 {{ selection.length }} 人</span>
 				<cl-flex1 />
 				<!-- 分页控件 -->
 				<cl-pagination />
@@ -48,12 +51,15 @@
 <script lang="ts" setup name="select-user">
 import { useCrud, useForm, useTable } from "@cool-vue/crud";
 import { useCool } from "/@/cool";
-import { nextTick, reactive, ref, watch } from "vue";
+import { PropType, nextTick, reactive, ref, watch } from "vue";
 import { cloneDeep } from "lodash";
 
+// 替换你的类型
+type Item = Eps.BaseSysUserEntity;
+
 const props = defineProps({
 	modelValue: {
-		type: Array,
+		type: Array as PropType<Item[]>,
 		default: () => []
 	},
 	isDisabled: Boolean,
@@ -134,7 +140,10 @@ const Table = useTable({
 const Crud = useCrud({
 	service: service.base.sys.user,
 	async onRefresh(params, { next }) {
-		await next(params);
+		const res = await next(params);
+
+		// 添加已加载列表的 id
+		loadIds.value.push(...res.list.map((e) => e.id));
 
 		// 数据反选
 		list.value.forEach((e) => {
@@ -155,16 +164,37 @@ async function refresh(params?: any) {
 // 弹窗是否可见
 const visible = ref(false);
 
+// 已选的数据列表,双向绑定用
+const list = ref<Item[]>([]);
+
 // 已选列表
-const list = ref<Eps.BaseSysUserEntity[]>([]);
+const selection = ref<any[]>([]);
+
+// 已加载列表的 id
+const loadIds = ref<number[]>([]);
+
+// 监听已选列表
+function onSelectionChange(arr: Item[]) {
+	// 已加载的
+	const ids = Array.from(new Set(loadIds.value));
+
+	// 过滤掉已加载的,再加上已选的
+	selection.value = selection.value.filter((e) => !ids.includes(e.id!)).concat(...arr);
+}
 
 // 打开选择弹窗
 function open() {
 	visible.value = true;
 
+	// 清空数据
+	loadIds.value = [];
+
+	// 设置已选
+	selection.value = cloneDeep(list.value);
+
 	nextTick(() => {
 		refresh({
-			size: 10
+			size: 2
 		});
 	});
 }
@@ -176,7 +206,20 @@ function close() {
 
 // 选择
 function select() {
-	list.value = cloneDeep(Table.value?.selection || []);
+	list.value = cloneDeep(selection.value || []);
+	close();
+}
+
+// 全选
+async function selectAll() {
+	// 全部数据
+	await Crud.value?.service.page({ page: 1, size: 10000 }).then((res) => {
+		list.value = res.list;
+	});
+
+	// 当前页数据
+	// list.value = Table.value?.data || [];
+
 	close();
 }
 

+ 6 - 9
src/modules/demo/views/crud.vue

@@ -102,7 +102,7 @@
 <script lang="tsx" name="demo-crud" setup>
 import { useCrud, useUpsert, useTable, useAdvSearch, setFocus, useSearch } from "@cool-vue/crud";
 import { useDict } from "/$/dict";
-import { reactive } from "vue";
+import { onMounted, reactive } from "vue";
 import { ElMessage, ElMessageBox } from "element-plus";
 import { useCool } from "/@/cool";
 import FormBtn from "../components/form-btn.vue";
@@ -255,9 +255,12 @@ const Upsert = useUpsert({
 			}
 		},
 		{
-			label: "选择用户",
+			label: "",
 			prop: "userIds",
 			group: "select",
+			props: {
+				labelWidth: "0px"
+			},
 			component: {
 				name: "slot-userIds"
 			}
@@ -267,9 +270,6 @@ const Upsert = useUpsert({
 			label: "工作",
 			prop: "occupation",
 			group: "other",
-			hook: {
-				bind: "string"
-			},
 			component: {
 				name: "el-tree-select",
 				props: {
@@ -420,10 +420,7 @@ const Table = useTable({
 			prop: "occupation",
 			dict: dict.get("occupation"),
 			dictColor: true,
-			minWidth: 120,
-			formatter(row) {
-				return String(row.occupation);
-			}
+			minWidth: 120
 		},
 		{
 			label: "状态",

+ 1 - 1
src/modules/dict/store/dict.ts

@@ -34,7 +34,7 @@ const useDictStore = defineStore("dict", () => {
 				for (const [i, arr] of Object.entries(res)) {
 					arr.forEach((e) => {
 						e.label = e.name;
-						e.value = e.value || e.id;
+						e.value = e.value ?? e.id;
 					});
 
 					d[i] = deepTree(arr, "desc");