<template>
|
<basicContainer>
|
<el-tabs v-model="activeAccountSet" @tab-click="handleTabClick">
|
<el-tab-pane label="珠海汇畅" name="0"></el-tab-pane>
|
<el-tab-pane label="广珠物流贸易" name="1"></el-tab-pane>
|
</el-tabs>
|
<avue-crud :option="option" :table-loading="pageF.loading" :data="tableData" :page="page"
|
:permission="permissionList" :before-open="beforeOpen" v-model="form" ref="crudRef" @row-update="rowUpdate"
|
@row-save="rowSave" @refresh-change="refreshChange" @row-del="rowDel" @search-change="searchChange"
|
@search-reset="searchReset" @selection-change="selectionChange" @current-change="currentChange"
|
@size-change="sizeChange" @on-load="onLoad">
|
<template #menu-left>
|
<!-- <el-button type="success" icon="Edit" :disabled="pageF.single" v-hasPermi="['cwgl:voucherSubjectFee:edit']"
|
@click="handleUpdate">修改
|
</el-button>
|
<el-button type="danger" icon="Delete" :disabled="pageF.multiple" @click="handleDelete"
|
v-hasPermi="['cwgl:voucherSubjectFee:remove']">删除
|
</el-button> -->
|
<el-button type="warning" plain icon="Download" @click="handleExport"
|
v-hasPermi="['cwgl:voucherSubjectFee:export']">导出
|
</el-button>
|
</template>
|
<template #menu="{ row, index, size }">
|
|
<el-button type="text" icon="View" @click="handleFlow(row)"
|
v-hasPermi="['cwgl:voucherSubjectFee:flow']">日志</el-button>
|
</template>
|
</avue-crud>
|
</basicContainer>
|
<OperationLogModal ref="logModalRef" />
|
|
</template>
|
|
<script setup name="voucherSubjectFee" lang="ts">
|
import { listVoucherSubjectSetting } from "@/api/cwgl/voucherSubjectSetting";
|
import { listVoucherSubjectFeeLog, } from "@/api/cwgl/voucherSubjectFeeLog";
|
|
import { VoucherSubjectFeeI, addVoucherSubjectFee, delVoucherSubjectFee, exportVoucherSubjectFee, getVoucherSubjectFee, listVoucherSubjectFee, updateVoucherSubjectFee } from "@/api/cwgl/voucherSubjectFee";
|
import useCurrentInstance from "@/utils/useCurrentInstance";
|
import { computed, reactive, ref, toRefs } from "vue";
|
import { PagesInterface, PageQueryInterface } from "@/utils/globalInterface";
|
import { usePagePlus } from "@/hooks/usePagePlus";
|
import { hasPermission } from "@/utils/permissionUtils";
|
import OperationLogModal from '@/components/OperationLogModal/index.vue';
|
|
const { proxy } = useCurrentInstance();
|
const crudRef = ref();
|
|
const permissionList = computed(() => {
|
return {
|
addBtn: hasPermission(["cwgl:voucherSubjectFee:add"]),
|
delBtn: hasPermission(["cwgl:voucherSubjectFee:remove"]),
|
editBtn: hasPermission(["cwgl:voucherSubjectFee:edit"]),
|
viewBtn: hasPermission(["cwgl:voucherSubjectFee:query"]),
|
}
|
})
|
|
const data = reactive({
|
form: <VoucherSubjectFeeI>{},
|
queryParams: <VoucherSubjectFeeI & PageQueryInterface>{},
|
page: <PagesInterface>{
|
pageSize: 10,
|
total: 0,
|
currentPage: 1,
|
},
|
selectionList: [],
|
})
|
const { queryParams, form, page, selectionList } = toRefs(data);
|
const option = ref({
|
pageKey: 'VoucherSubjectFee',
|
rowKey: 'id',
|
viewBtn: false,
|
column: {
|
// id: {
|
// label: 'ID',
|
// },
|
type: {
|
label: '账套',
|
minWidth: 120,
|
addDisabled: true,
|
editDisabled: true,
|
type: 'select', dataType: 'string', dicUrl: '/system/dict/data/type/sys_accounting_type',
|
rules: [
|
{
|
required: true,
|
message: "帐套类型不能为空", trigger: "change"
|
}
|
],
|
},
|
subjectName: {
|
label: '科目名称',
|
type: 'tree',
|
search: true,
|
props: {
|
label: 'subjectName', // 下拉树里依然只显示单名（如：差旅费）
|
value: 'subjectName'
|
},
|
change: ({ value, column, item }) => {
|
if (item && Object.keys(item).length > 0) {
|
form.value.subjectCode = item.subjectCode;
|
form.value.subjectType = item.subjectType;
|
form.value.feeName = item.expenseName;
|
|
// 【修改点】在选中时，获取隐藏的 fullName（带 / 的全路径）
|
// 如果没有 fullName（顶级），则使用原始名称
|
form.value.fullPathName = item.fullName || item.subjectName;
|
}
|
else if (!value) {
|
form.value.subjectCode = '';
|
form.value.subjectType = '';
|
form.value.feeName = '';
|
form.value.fullPathName = '';
|
}
|
},
|
rules: [{ required: true, message: "科目名称不能为空", trigger: "change" }],
|
},
|
|
subjectCode: {
|
label: '科目代码',
|
disabled: true, // 自动带出，设为只读
|
},
|
subjectType: {
|
label: '科目类别',
|
minWidth: 150,
|
minWidth: 120,
|
type: 'select', dicUrl: '/system/dict/data/type/sys_subject_category',
|
rules: [
|
{
|
required: true,
|
message: "科目类别不能为空", trigger: "change"
|
}
|
],
|
search: true,
|
},
|
feeType: {
|
label: '费用类别',
|
search: true,
|
minWidth: 150,
|
minWidth: 120,
|
type: 'select', dicUrl: '/system/dict/data/type/sys_expense_category',
|
rules: [
|
{
|
required: true,
|
message: "费用类别不能为空", trigger: "change"
|
}
|
],
|
|
},
|
// type: {
|
// label: '帐套类型',
|
// rules: [
|
// {
|
// required: true,
|
// message: "帐套类型不能为空", trigger: "change"
|
// }
|
// ],
|
// },
|
feeName: {
|
search: true,
|
label: '费用名称',
|
minWidth: 150,
|
minWidth: 120,
|
type: 'select', dicUrl: '/system/dict/data/type/sys_name_harge',
|
rules: [
|
{
|
required: true,
|
message: "费用名称不能为空", trigger: "change"
|
}
|
],
|
},
|
materialType: {
|
search: true,
|
label: '物料类别',
|
minWidth: 150,
|
minWidth: 120,
|
type: 'select', dicUrl: '/system/dict/data/type/sys_material_category',
|
rules: [
|
{
|
required: true,
|
message: "物料类别不能为空", trigger: "change"
|
}
|
],
|
},
|
|
// status: {
|
// label: '状态',
|
// },
|
// delFlag: {
|
// label: '删除标志',
|
// },
|
// createBy: {
|
// label: '创建者',
|
// },
|
// createTime: {
|
// label: '创建时间',
|
// },
|
// updateBy: {
|
// label: '更新者',
|
// },
|
// updateTime: {
|
// label: '更新时间',
|
// },
|
// remark: {
|
// label: '备注',
|
// type: 'textarea', minRows: 3, maxRows: 5,
|
// },
|
}
|
})
|
|
const { tableData, pageF, rowSave, rowUpdate, rowDel, beforeOpen, searchChange,
|
searchReset, selectionChange, onLoad, currentChange, sizeChange, handleDelete, handleExport, handleUpdate, refreshChange } = usePagePlus({
|
form: form,
|
option: option,
|
queryParams: queryParams,
|
idKey: 'id',
|
page: page.value,
|
getListApi: listVoucherSubjectFee,
|
getDetailApi: getVoucherSubjectFee,
|
exportApi: exportVoucherSubjectFee,
|
deleteApi: delVoucherSubjectFee,
|
addApi: addVoucherSubjectFee,
|
updateApi: updateVoucherSubjectFee,
|
handleUpdateFunc: () => {
|
crudRef.value.rowEdit(selectionList.value[0]);
|
},
|
getBeginListFunc: (params = {}) => {
|
// 这里的 params 是 searchChange 等触发时传递的原始参数
|
const nextParams = {
|
...params,
|
type: activeAccountSet.value // 将当前选中的 Tab 值注入 type 字段
|
};
|
// 同步更新 queryParams，确保搜索栏状态一致
|
queryParams.value = nextParams;
|
return nextParams;
|
},
|
handleSelectionChangeFunc: (selection: any) => {
|
selectionList.value = selection;
|
},
|
// --- 关键修改：处理弹窗打开前的逻辑 ---
|
// --- 核心逻辑 1：保存前拦截 ---
|
// 在 usePagePlus 的配置对象中
|
rowSaveBegin: (row, done) => {
|
// 提交时，将 subjectName 替换为我们在 change 时拿到的全路径
|
if (row.fullPathName) {
|
row.subjectName = row.fullPathName;
|
}
|
delete row.fullPathName; // 清理临时变量
|
done(row);
|
},
|
|
rowUpdateBegin: (row, done) => {
|
if (row.fullPathName) {
|
row.subjectName = row.fullPathName;
|
}
|
delete row.fullPathName;
|
done(row);
|
},
|
|
// --- 核心逻辑 3：打开弹窗前加载并处理字典 ---
|
handleBeforeOpenFunc: (type: string) => {
|
if (type === 'add') {
|
form.value.accountSet = activeAccountSet.value;
|
form.value.type = activeAccountSet.value;
|
}
|
|
listVoucherSubjectSetting({ type: activeAccountSet.value }).then(res => {
|
const subjectNameCol = option.value.column.subjectName;
|
if (subjectNameCol) {
|
const listData = res.rows || [];
|
|
// 递归函数：计算全路径，使用 / 分隔
|
const injectFullPath = (list: any[], parentPath = '') => {
|
return list.map(item => {
|
// 【核心修改点】将拼接符改为 /
|
const currentPath = parentPath ? `${parentPath}/${item.subjectName}` : item.subjectName;
|
const newItem = {
|
...item,
|
fullName: currentPath // 此时 fullName 格式为 "管理费用/差旅费"
|
};
|
if (newItem.children && newItem.children.length > 0) {
|
newItem.children = injectFullPath(newItem.children, currentPath);
|
}
|
return newItem;
|
});
|
};
|
|
const treeData = proxy.handleTree(listData, "id");
|
subjectNameCol.dicData = injectFullPath(treeData);
|
}
|
});
|
},
|
|
// ... 其他钩子如 handleUpdateFunc, getBeginListFunc 保持不变 ...
|
})
|
const activeAccountSet = ref('0');
|
|
const handleTabClick = (tab: any) => {
|
const selectedTabName = tab.props.name;
|
console.log("Tab点击的值:", selectedTabName);
|
activeAccountSet.value = selectedTabName;
|
queryParams.value.type = selectedTabName;
|
const nextParams = {
|
...queryParams.value,
|
type: selectedTabName
|
};
|
|
// 4. 重置分页并加载
|
page.value.currentPage = 1;
|
onLoad(page.value, nextParams);
|
}
|
|
const logModalRef = ref(null);
|
const handleFlow = (row: any) => {
|
// 这里可以从 row 中直接获取日志，或者调用后端接口查询
|
// 示例模拟数据
|
listVoucherSubjectFeeLog({ subjectId: row.id }).then((res) => {
|
if (res.code == 200) {
|
logModalRef.value.open(res.rows, 'payable');
|
|
}
|
});
|
}
|
</script>
|
