131 lines
3.5 KiB
Vue
131 lines
3.5 KiB
Vue
<template>
|
|
<div v-if="columns?.length">
|
|
<DynamicTable row-key="id"
|
|
header-title="模板管理"
|
|
title-tooltip=""
|
|
:data-request="Api.saleQuotationTemplate.saleQuotationTemplateList"
|
|
:columns="columns"
|
|
bordered
|
|
size="small">
|
|
<template #toolbar>
|
|
<a-button type="primary"
|
|
:disabled="!$auth('sale_quotation:sale_quotation_group:create')"
|
|
@click="openEditModal({})">
|
|
新增
|
|
</a-button>
|
|
</template>
|
|
</DynamicTable>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="tsx">
|
|
import { useTable } from '@/components/core/dynamic-table';
|
|
import { baseColumns, type TableColumnItem, type TableListItem } from './columns';
|
|
import Api from '@/api/';
|
|
import { useFormModal, useModal } from '@/hooks/useModal';
|
|
import { formSchemas } from './formSchemas';
|
|
|
|
import { ref, onMounted } from 'vue';
|
|
import fileDownload from 'js-file-download';
|
|
defineOptions({
|
|
name: 'SaleQuotationTemplate',
|
|
});
|
|
const [DynamicTable, dynamicTableInstance] = useTable({ formProps: { autoSubmitOnEnter: true } });
|
|
const [showModal] = useFormModal();
|
|
|
|
// saleQuotationTemplateList;
|
|
let columns = ref<TableColumnItem[]>();
|
|
onMounted(() => {
|
|
columns.value = [
|
|
...baseColumns,
|
|
{
|
|
title: '操作',
|
|
maxWidth: 150,
|
|
width: 150,
|
|
minWidth: 150,
|
|
fixed: 'right',
|
|
dataIndex: 'ACTION',
|
|
hideInSearch: true,
|
|
actions: ({ record }) => [
|
|
|
|
{
|
|
icon: 'ant-design:edit-outlined',
|
|
tooltip: '编辑',
|
|
auth: {
|
|
perm: 'sale_quotation:sale_quotation_group:update',
|
|
effect: 'disable',
|
|
},
|
|
onClick: () => openEditModal(record),
|
|
},
|
|
{
|
|
icon: 'ant-design:delete-outlined',
|
|
color: 'red',
|
|
tooltip: '删除此模板',
|
|
auth: 'sale_quotation:sale_quotation_group:delete',
|
|
popConfirm: {
|
|
title: '你确定要删除吗？',
|
|
placement: 'left',
|
|
onConfirm: () => delRowConfirm(record.id),
|
|
},
|
|
},
|
|
{
|
|
icon: 'ant-design:file-excel-outlined',
|
|
tooltip: '导出',
|
|
auth: {
|
|
perm: 'sale_quotation:sale_quotation:export',
|
|
effect: 'disable',
|
|
},
|
|
onClick: () => onExport(record),
|
|
},
|
|
],
|
|
},
|
|
];
|
|
});
|
|
|
|
|
|
const onExport = async (record:TableListItem) => {
|
|
const response = await Api.saleQuotation.exportSaleQuotation(record.id);
|
|
fileDownload(response, `${record.name}.xls`);
|
|
}
|
|
|
|
/**
|
|
* @description 打开新增/编辑弹窗
|
|
*/
|
|
const openEditModal = async (record: Partial<TableListItem>) => {
|
|
const [formRef] = await showModal({
|
|
modalProps: {
|
|
title: `${record.id ? '编辑' : '新增'}模板`,
|
|
width: '50%',
|
|
onFinish: async (values) => {
|
|
if (record.id) {
|
|
await Api.saleQuotationTemplate.saleQuotationTemplateUpdate({ id: record.id }, values);
|
|
} else {
|
|
await Api.saleQuotationTemplate.saleQuotationTemplateCreate(values);
|
|
}
|
|
dynamicTableInstance?.reload();
|
|
},
|
|
},
|
|
formProps: {
|
|
labelWidth: 100,
|
|
schemas: formSchemas,
|
|
},
|
|
});
|
|
|
|
// 如果是编辑的话，需要获取角色详情
|
|
if (record.id) {
|
|
const info = await Api.saleQuotationTemplate.saleQuotationTemplateInfo({ id: record.id });
|
|
formRef?.setFieldsValue({
|
|
...info,
|
|
});
|
|
}
|
|
};
|
|
const delRowConfirm = async (record) => {
|
|
await Api.saleQuotationTemplate.saleQuotationTemplateDelete({ id: record });
|
|
dynamicTableInstance?.reload();
|
|
};
|
|
|
|
|
|
</script>
|
|
|
|
<style lang="less" scoped></style>
|