mirror of
https://github.com/cool-team-official/cool-admin-vue.git
synced 2026-02-03 06:18:12 +00:00
修改字典 0 的错误问题
This commit is contained in:
parent
0a58a05d86
commit
4efb765721
@ -16,6 +16,9 @@
|
|||||||
<!-- 刷新按钮 -->
|
<!-- 刷新按钮 -->
|
||||||
<cl-refresh-btn />
|
<cl-refresh-btn />
|
||||||
|
|
||||||
|
<!-- 全选 -->
|
||||||
|
<el-button type="primary" @click="selectAll">全选</el-button>
|
||||||
|
|
||||||
<cl-filter label="状态">
|
<cl-filter label="状态">
|
||||||
<cl-select :options="options.status" prop="status" :width="120" />
|
<cl-select :options="options.status" prop="status" :width="120" />
|
||||||
</cl-filter>
|
</cl-filter>
|
||||||
@ -27,11 +30,11 @@
|
|||||||
|
|
||||||
<cl-row>
|
<cl-row>
|
||||||
<!-- 数据表格 -->
|
<!-- 数据表格 -->
|
||||||
<cl-table ref="Table" :auto-height="false" />
|
<cl-table ref="Table" :auto-height="false" @selection-change="onSelectionChange" />
|
||||||
</cl-row>
|
</cl-row>
|
||||||
|
|
||||||
<cl-row>
|
<cl-row>
|
||||||
<span>已选 {{ Table?.selection.length }} 人</span>
|
<span>已选 {{ selection.length }} 人</span>
|
||||||
<cl-flex1 />
|
<cl-flex1 />
|
||||||
<!-- 分页控件 -->
|
<!-- 分页控件 -->
|
||||||
<cl-pagination />
|
<cl-pagination />
|
||||||
@ -48,12 +51,15 @@
|
|||||||
<script lang="ts" setup name="select-user">
|
<script lang="ts" setup name="select-user">
|
||||||
import { useCrud, useForm, useTable } from "@cool-vue/crud";
|
import { useCrud, useForm, useTable } from "@cool-vue/crud";
|
||||||
import { useCool } from "/@/cool";
|
import { useCool } from "/@/cool";
|
||||||
import { nextTick, reactive, ref, watch } from "vue";
|
import { PropType, nextTick, reactive, ref, watch } from "vue";
|
||||||
import { cloneDeep } from "lodash";
|
import { cloneDeep } from "lodash";
|
||||||
|
|
||||||
|
// 替换你的类型
|
||||||
|
type Item = Eps.BaseSysUserEntity;
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
modelValue: {
|
modelValue: {
|
||||||
type: Array,
|
type: Array as PropType<Item[]>,
|
||||||
default: () => []
|
default: () => []
|
||||||
},
|
},
|
||||||
isDisabled: Boolean,
|
isDisabled: Boolean,
|
||||||
@ -134,7 +140,10 @@ const Table = useTable({
|
|||||||
const Crud = useCrud({
|
const Crud = useCrud({
|
||||||
service: service.base.sys.user,
|
service: service.base.sys.user,
|
||||||
async onRefresh(params, { next }) {
|
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) => {
|
list.value.forEach((e) => {
|
||||||
@ -155,16 +164,37 @@ async function refresh(params?: any) {
|
|||||||
// 弹窗是否可见
|
// 弹窗是否可见
|
||||||
const visible = ref(false);
|
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() {
|
function open() {
|
||||||
visible.value = true;
|
visible.value = true;
|
||||||
|
|
||||||
|
// 清空数据
|
||||||
|
loadIds.value = [];
|
||||||
|
|
||||||
|
// 设置已选
|
||||||
|
selection.value = cloneDeep(list.value);
|
||||||
|
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
refresh({
|
refresh({
|
||||||
size: 10
|
size: 2
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@ -176,7 +206,20 @@ function close() {
|
|||||||
|
|
||||||
// 选择
|
// 选择
|
||||||
function select() {
|
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();
|
close();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -102,7 +102,7 @@
|
|||||||
<script lang="tsx" name="demo-crud" setup>
|
<script lang="tsx" name="demo-crud" setup>
|
||||||
import { useCrud, useUpsert, useTable, useAdvSearch, setFocus, useSearch } from "@cool-vue/crud";
|
import { useCrud, useUpsert, useTable, useAdvSearch, setFocus, useSearch } from "@cool-vue/crud";
|
||||||
import { useDict } from "/$/dict";
|
import { useDict } from "/$/dict";
|
||||||
import { reactive } from "vue";
|
import { onMounted, reactive } from "vue";
|
||||||
import { ElMessage, ElMessageBox } from "element-plus";
|
import { ElMessage, ElMessageBox } from "element-plus";
|
||||||
import { useCool } from "/@/cool";
|
import { useCool } from "/@/cool";
|
||||||
import FormBtn from "../components/form-btn.vue";
|
import FormBtn from "../components/form-btn.vue";
|
||||||
@ -255,9 +255,12 @@ const Upsert = useUpsert({
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: "选择用户",
|
label: "",
|
||||||
prop: "userIds",
|
prop: "userIds",
|
||||||
group: "select",
|
group: "select",
|
||||||
|
props: {
|
||||||
|
labelWidth: "0px"
|
||||||
|
},
|
||||||
component: {
|
component: {
|
||||||
name: "slot-userIds"
|
name: "slot-userIds"
|
||||||
}
|
}
|
||||||
@ -267,9 +270,6 @@ const Upsert = useUpsert({
|
|||||||
label: "工作",
|
label: "工作",
|
||||||
prop: "occupation",
|
prop: "occupation",
|
||||||
group: "other",
|
group: "other",
|
||||||
hook: {
|
|
||||||
bind: "string"
|
|
||||||
},
|
|
||||||
component: {
|
component: {
|
||||||
name: "el-tree-select",
|
name: "el-tree-select",
|
||||||
props: {
|
props: {
|
||||||
@ -420,10 +420,7 @@ const Table = useTable({
|
|||||||
prop: "occupation",
|
prop: "occupation",
|
||||||
dict: dict.get("occupation"),
|
dict: dict.get("occupation"),
|
||||||
dictColor: true,
|
dictColor: true,
|
||||||
minWidth: 120,
|
minWidth: 120
|
||||||
formatter(row) {
|
|
||||||
return String(row.occupation);
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: "状态",
|
label: "状态",
|
||||||
|
|||||||
@ -34,7 +34,7 @@ const useDictStore = defineStore("dict", () => {
|
|||||||
for (const [i, arr] of Object.entries(res)) {
|
for (const [i, arr] of Object.entries(res)) {
|
||||||
arr.forEach((e) => {
|
arr.forEach((e) => {
|
||||||
e.label = e.name;
|
e.label = e.name;
|
||||||
e.value = e.value || e.id;
|
e.value = e.value ?? e.id;
|
||||||
});
|
});
|
||||||
|
|
||||||
d[i] = deepTree(arr, "desc");
|
d[i] = deepTree(arr, "desc");
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user