<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>
|
</avue-crud>
|
</basicContainer>
|
</template>
|
|
<script setup name="voucherSubjectFee" lang="ts">
|
import { listVoucherSubjectSetting } from "@/api/cwgl/voucherSubjectSetting";
|
|
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";
|
|
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',
|
// },
|
accountSet: {
|
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: 'select', // 如果需要树形可以改为 'tree'
|
search: true,
|
props: {
|
label: 'subjectName',
|
value: 'subjectName' // 建议绑定 ID 作为 value
|
},
|
// 关键：监听选中值的变化
|
change: ({ value, column, item }) => {
|
// item 是当前选中的整行数据对象
|
if (item) {
|
form.value.subjectCode = item.subjectCode; // 赋值科目代码
|
form.value.subjectType = item.subjectType; // 赋值科目类别
|
|
// 注意：请确认 listVoucherSubjectSetting 接口返回的对象中有 expenseName 字段
|
// 如果接口字段叫 feeName，则改为 item.feeName
|
form.value.feeName = item.expenseName;
|
} else {
|
// 如果清空了选择，则重置相关字段
|
form.value.subjectCode = '';
|
form.value.subjectType = '';
|
form.value.feeName = '';
|
}
|
},
|
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;
|
},
|
// --- 关键修改：处理弹窗打开前的逻辑 ---
|
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) {
|
// 假设接口返回的数据在 res.data 或 res.rows 中
|
const listData = res.rows || [];
|
|
// 如果你需要树形展示，可以使用 handleTree 转换
|
subjectNameCol.type = 'tree';
|
subjectNameCol.dicData = proxy.handleTree(listData, "id");
|
|
|
}
|
});
|
|
},
|
})
|
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);
|
}
|
</script>
|
