|
|
@@ -12,11 +12,10 @@
|
|
|
<div class="tax-tree-panel">
|
|
|
<el-tree
|
|
|
ref="treeRef"
|
|
|
+ :data="treeData"
|
|
|
:props="treeProps"
|
|
|
node-key="id"
|
|
|
highlight-current
|
|
|
- lazy
|
|
|
- :load="loadNode"
|
|
|
:expand-on-click-node="false"
|
|
|
@node-click="handleNodeClick"
|
|
|
@node-dblclick="handleTreeDblClick"
|
|
|
@@ -46,26 +45,27 @@
|
|
|
border
|
|
|
highlight-current-row
|
|
|
height="360px"
|
|
|
+ :row-class-name="rowClassName"
|
|
|
@row-dblclick="handleRowDblClick"
|
|
|
>
|
|
|
<el-table-column label="编码" align="center" prop="taxationNo" min-width="110">
|
|
|
<template #default="{ row }">
|
|
|
- <el-link type="primary" :underline="false">{{ row.taxationNo }}</el-link>
|
|
|
+ <el-link :type="isRowDisabled(row) ? 'info' : 'primary'" :disabled="isRowDisabled(row)" :underline="false">{{ row.taxationNo }}</el-link>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="合并编码" align="center" prop="mergeNo" min-width="130" show-overflow-tooltip>
|
|
|
<template #default="{ row }">
|
|
|
- <el-link type="primary" :underline="false">{{ row.mergeNo }}</el-link>
|
|
|
+ <el-link :type="isRowDisabled(row) ? 'info' : 'primary'" :disabled="isRowDisabled(row)" :underline="false">{{ row.mergeNo }}</el-link>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="名称" align="center" prop="name" min-width="120" show-overflow-tooltip>
|
|
|
<template #default="{ row }">
|
|
|
- <el-link type="primary" :underline="false">{{ row.name }}</el-link>
|
|
|
+ <el-link :type="isRowDisabled(row) ? 'info' : 'primary'" :disabled="isRowDisabled(row)" :underline="false">{{ row.name }}</el-link>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="简称" align="center" prop="abbreviation" min-width="100" show-overflow-tooltip>
|
|
|
<template #default="{ row }">
|
|
|
- <el-link type="primary" :underline="false">{{ row.abbreviation }}</el-link>
|
|
|
+ <el-link :type="isRowDisabled(row) ? 'info' : 'primary'" :disabled="isRowDisabled(row)" :underline="false">{{ row.abbreviation }}</el-link>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<!-- <el-table-column label="说明" align="center" prop="remark" min-width="150" show-overflow-tooltip />
|
|
|
@@ -88,7 +88,7 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
-import { listTaxCode, getTaxCode } from '@/api/system/taxCode';
|
|
|
+import { listTaxCode, getTaxCode, getTaxCodeTree } from '@/api/system/taxCode';
|
|
|
import { TaxCodeVO, TaxCodeQuery } from '@/api/system/taxCode/types';
|
|
|
import useDialog from '@/hooks/useDialog';
|
|
|
|
|
|
@@ -101,8 +101,9 @@ const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
|
|
const dialog = useDialog({ title: '税收编码选择 请双击选择税收编码' });
|
|
|
|
|
|
const treeRef = ref<ElTreeInstance>();
|
|
|
-const treeProps = { label: 'name' };
|
|
|
+const treeProps = { label: 'label', children: 'children' };
|
|
|
const currentEchoId = ref<string | number | undefined>();
|
|
|
+const treeData = ref<any[]>([]);
|
|
|
|
|
|
const listData = ref<TaxCodeVO[]>([]);
|
|
|
const loading = ref(false);
|
|
|
@@ -115,17 +116,18 @@ const queryParams = ref<TaxCodeQuery>({
|
|
|
parentId: undefined,
|
|
|
name: undefined,
|
|
|
taxationNo: undefined,
|
|
|
+
|
|
|
params: {}
|
|
|
});
|
|
|
|
|
|
-/** 懒加载树节点 */
|
|
|
-const loadNode = async (node: any, resolve: (data: any[]) => void) => {
|
|
|
- const parentId = node.level === 0 ? 0 : node.data.id;
|
|
|
+/** 加载树形数据 */
|
|
|
+const loadTreeData = async () => {
|
|
|
try {
|
|
|
- const res = await listTaxCode({ parentId, pageNum: 1, pageSize: 9999, params: {} });
|
|
|
- resolve(res.rows ?? []);
|
|
|
- } catch {
|
|
|
- resolve([]);
|
|
|
+ const res = await getTaxCodeTree();
|
|
|
+ treeData.value = res.data ?? [];
|
|
|
+ } catch (error) {
|
|
|
+ console.error('加载税收编码树失败:', error);
|
|
|
+ treeData.value = [];
|
|
|
}
|
|
|
};
|
|
|
|
|
|
@@ -170,8 +172,7 @@ const getList = async () => {
|
|
|
loading.value = true;
|
|
|
try {
|
|
|
const res = await listTaxCode(queryParams.value);
|
|
|
- // 只展示无下级(isBottom === '0')的叶子节点
|
|
|
- listData.value = (res.rows ?? []).filter((row: TaxCodeVO) => row.isBottom === '0');
|
|
|
+ listData.value = res.rows ?? [];
|
|
|
total.value = res.total ?? 0;
|
|
|
} finally {
|
|
|
loading.value = false;
|
|
|
@@ -202,9 +203,22 @@ const handleSearch = () => {
|
|
|
getList();
|
|
|
};
|
|
|
|
|
|
+/** 判断行是否禁用:非叶子节点(isBottom === 0)不可选 */
|
|
|
+const isRowDisabled = (row: TaxCodeVO): boolean => {
|
|
|
+ return Number((row as any)?.isBottom) === 0;
|
|
|
+};
|
|
|
+
|
|
|
+/** 行样式类名:禁用行显示为灰色 */
|
|
|
+const rowClassName = ({ row }: { row: TaxCodeVO }): string => {
|
|
|
+ return isRowDisabled(row) ? 'tax-code-row-disabled' : '';
|
|
|
+};
|
|
|
+
|
|
|
/** 双击行选择 */
|
|
|
const handleRowDblClick = (row: TaxCodeVO) => {
|
|
|
- if (row.isBottom !== '0') return;
|
|
|
+ if (isRowDisabled(row)) {
|
|
|
+ proxy?.$modal.msgWarning('该节点不是叶子节点,不可选择');
|
|
|
+ return;
|
|
|
+ }
|
|
|
emit('select', row);
|
|
|
dialog.closeDialog();
|
|
|
};
|
|
|
@@ -228,6 +242,7 @@ watch(
|
|
|
() => dialog.visible.value,
|
|
|
async (val) => {
|
|
|
if (val) {
|
|
|
+ await loadTreeData();
|
|
|
await getList();
|
|
|
if (currentEchoId.value) {
|
|
|
await echoById(currentEchoId.value);
|
|
|
@@ -271,4 +286,14 @@ defineExpose({ open, close: dialog.closeDialog });
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
}
|
|
|
+
|
|
|
+:deep(.tax-code-row-disabled) {
|
|
|
+ background-color: var(--el-fill-color-light) !important;
|
|
|
+ color: var(--el-text-color-disabled);
|
|
|
+ cursor: not-allowed;
|
|
|
+}
|
|
|
+
|
|
|
+:deep(.tax-code-row-disabled:hover > td.el-table__cell) {
|
|
|
+ background-color: var(--el-fill-color-light) !important;
|
|
|
+}
|
|
|
</style>
|