chore: 优化样式

This commit is contained in:
dap 2025-01-04 17:10:36 +08:00
parent 2b850a5b89
commit 543fb0cf91

View File

@ -126,7 +126,7 @@ const gridOptions: VxeGridProps = {
// //
custom: false, custom: false,
// //
zoom: false, zoom: true,
// //
refresh: false, refresh: false,
}, },
@ -286,10 +286,11 @@ onMounted(() => {
}); });
}); });
/**
* checkedKeys依赖menus 要在外部确保menus先加载
*/
watch(checkedKeys, (value) => { watch(checkedKeys, (value) => {
console.log(props.menus);
const allCheckedKeys = uniq([...value]); const allCheckedKeys = uniq([...value]);
console.log(allCheckedKeys);
// //
const records = tableApi.grid.getData(); const records = tableApi.grid.getData();
setCheckedByKeys(records, allCheckedKeys, association.value); setCheckedByKeys(records, allCheckedKeys, association.value);
@ -302,13 +303,13 @@ const options = [
]; ];
async function handleAssociationChange() { async function handleAssociationChange() {
//
await tableApi.grid.clearCheckboxRow();
// permissions // permissions
const records = tableApi.grid.getData(); const records = tableApi.grid.getData();
records.forEach((item) => { records.forEach((item) => {
allChecked(item, false); allChecked(item, false);
}); });
//
await tableApi.grid.clearCheckboxRow();
} }
/** /**
@ -371,7 +372,7 @@ function getKeys(records: MenuPermissionOption[], handleChildren: boolean) {
function getCheckedKeys() { function getCheckedKeys() {
// //
if (association.value) { if (association.value) {
const records = tableApi.grid.getCheckboxRecords(); const records = tableApi?.grid?.getCheckboxRecords?.() ?? [];
console.log(records); console.log(records);
// //
const nodeKeys = getKeys(records, true); const nodeKeys = getKeys(records, true);
@ -384,9 +385,9 @@ function getCheckedKeys() {
// //
// //
const records = tableApi.grid.getCheckboxRecords(); const records = tableApi?.grid?.getCheckboxRecords?.() ?? [];
// permissions // permissions
const allRecords = tableApi.grid.getData(); const allRecords = tableApi?.grid?.getData?.() ?? [];
const ids = records.map((item) => item.id); const ids = records.map((item) => item.id);
const permissions = getKeys(allRecords, false); const permissions = getKeys(allRecords, false);
const allIds = uniq([...ids, ...permissions]); const allIds = uniq([...ids, ...permissions]);
@ -401,7 +402,19 @@ defineExpose({
<template> <template>
<div class="flex h-full flex-col"> <div class="flex h-full flex-col">
<Alert message="beta功能" type="warning" show-icon /> <Alert class="mx-2 mb-2" message="beta功能" type="warning" show-icon />
<Alert class="mx-2" type="info" show-icon>
<template #message>
<div v-if="tableApi?.grid">
已选中
<span class="text-primary mx-1 font-semibold">
{{ getCheckedKeys().length }}
</span>
个节点
</div>
</template>
</Alert>
<BasicTable> <BasicTable>
<template #toolbar-actions> <template #toolbar-actions>
<RadioGroup <RadioGroup
@ -414,7 +427,7 @@ defineExpose({
</template> </template>
<template #toolbar-tools> <template #toolbar-tools>
<Space> <Space>
<a-button @click="getCheckedKeys">测试expose</a-button> <a-button @click="getCheckedKeys">打印选中的节点</a-button>
<a-button @click="setExpandOrCollapse(false)"> <a-button @click="setExpandOrCollapse(false)">
{{ $t('pages.common.collapse') }} {{ $t('pages.common.collapse') }}
</a-button> </a-button>
@ -438,3 +451,9 @@ defineExpose({
</BasicTable> </BasicTable>
</div> </div>
</template> </template>
<style scoped>
:deep(.ant-alert) {
padding: 4px 8px;
}
</style>