refactor: define setup in script label
This commit is contained in:
zchengo
+427
-473
@@ -170,7 +170,7 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted, createVNode } from 'vue';
|
||||
import { SearchOutlined, ExclamationCircleOutlined, ExportOutlined } from '@ant-design/icons-vue';
|
||||
import moment from 'moment'
|
||||
@@ -179,507 +179,461 @@ import { queryProductList } from "../api/product";
|
||||
import { queryCustomerOption } from "../api/customer";
|
||||
import { message, Modal } from 'ant-design-vue';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
SearchOutlined,
|
||||
ExportOutlined
|
||||
},
|
||||
setup() {
|
||||
// 合同表格字段
|
||||
const columns = [{
|
||||
title: '合同编号',
|
||||
dataIndex: 'id',
|
||||
width: 100,
|
||||
fixed: 'left',
|
||||
ellipsis: true,
|
||||
}, {
|
||||
title: '合同名称',
|
||||
dataIndex: 'name',
|
||||
width: 100,
|
||||
fixed: 'left',
|
||||
ellipsis: true,
|
||||
}, {
|
||||
title: '客户名称',
|
||||
dataIndex: 'cname',
|
||||
width: 240,
|
||||
}, {
|
||||
title: '合同金额',
|
||||
dataIndex: 'amount',
|
||||
width: 100,
|
||||
}, {
|
||||
title: '合同开始时间',
|
||||
dataIndex: 'beginTime',
|
||||
width: 150,
|
||||
}, {
|
||||
title: '合同结束时间',
|
||||
dataIndex: 'overTime',
|
||||
width: 150,
|
||||
}, {
|
||||
title: '备注',
|
||||
dataIndex: 'remarks',
|
||||
width: 240,
|
||||
ellipsis: true,
|
||||
}, {
|
||||
title: '签约状态',
|
||||
dataIndex: 'status',
|
||||
width: 100,
|
||||
ellipsis: true,
|
||||
}, {
|
||||
title: '创建时间',
|
||||
dataIndex: 'created',
|
||||
width: 185,
|
||||
customRender: text => {
|
||||
return text.value == 0 ? '' : moment(text.value * 1000).format('YYYY-MM-DD HH:mm:ss')
|
||||
}
|
||||
}, {
|
||||
title: '更新时间',
|
||||
dataIndex: 'updated',
|
||||
width: 185,
|
||||
customRender: text => {
|
||||
return text.value == 0 ? '' : moment(text.value * 1000).format('YYYY-MM-DD HH:mm:ss')
|
||||
}
|
||||
}];
|
||||
|
||||
// 合同表格字段
|
||||
const columns = [{
|
||||
title: '合同编号',
|
||||
dataIndex: 'id',
|
||||
width: 100,
|
||||
fixed: 'left',
|
||||
ellipsis: true,
|
||||
}, {
|
||||
title: '合同名称',
|
||||
dataIndex: 'name',
|
||||
width: 100,
|
||||
fixed: 'left',
|
||||
ellipsis: true,
|
||||
}, {
|
||||
title: '客户名称',
|
||||
dataIndex: 'cname',
|
||||
width: 240,
|
||||
}, {
|
||||
title: '合同金额',
|
||||
dataIndex: 'amount',
|
||||
width: 100,
|
||||
}, {
|
||||
title: '合同开始时间',
|
||||
dataIndex: 'beginTime',
|
||||
width: 150,
|
||||
}, {
|
||||
title: '合同结束时间',
|
||||
dataIndex: 'overTime',
|
||||
width: 150,
|
||||
}, {
|
||||
title: '备注',
|
||||
dataIndex: 'remarks',
|
||||
width: 240,
|
||||
ellipsis: true,
|
||||
}, {
|
||||
title: '签约状态',
|
||||
dataIndex: 'status',
|
||||
width: 100,
|
||||
ellipsis: true,
|
||||
}, {
|
||||
title: '创建时间',
|
||||
dataIndex: 'created',
|
||||
width: 185,
|
||||
customRender: text => {
|
||||
return text.value == 0 ? '' : moment(text.value * 1000).format('YYYY-MM-DD HH:mm:ss')
|
||||
}
|
||||
}, {
|
||||
title: '更新时间',
|
||||
dataIndex: 'updated',
|
||||
width: 185,
|
||||
customRender: text => {
|
||||
return text.value == 0 ? '' : moment(text.value * 1000).format('YYYY-MM-DD HH:mm:ss')
|
||||
}
|
||||
}];
|
||||
// 新建或编辑合同，已添加产品表格字段
|
||||
const productColumns = [{
|
||||
title: '产品名称',
|
||||
dataIndex: 'name',
|
||||
width: 100,
|
||||
}, {
|
||||
title: '产品类别',
|
||||
dataIndex: 'type',
|
||||
width: 90,
|
||||
}, {
|
||||
title: '单位',
|
||||
dataIndex: 'unit',
|
||||
width: 80,
|
||||
}, {
|
||||
title: '价格',
|
||||
dataIndex: 'price',
|
||||
width: 100,
|
||||
}, {
|
||||
title: '数量',
|
||||
dataIndex: 'count',
|
||||
width: 120,
|
||||
}, {
|
||||
title: '合计',
|
||||
dataIndex: 'total',
|
||||
width: 100,
|
||||
}, {
|
||||
title: '操作',
|
||||
dataIndex: 'operation',
|
||||
width: 100,
|
||||
}]
|
||||
|
||||
// 新建或编辑合同，已添加产品表格字段
|
||||
const productColumns = [{
|
||||
title: '产品名称',
|
||||
dataIndex: 'name',
|
||||
width: 100,
|
||||
}, {
|
||||
title: '产品类别',
|
||||
dataIndex: 'type',
|
||||
width: 90,
|
||||
}, {
|
||||
title: '单位',
|
||||
dataIndex: 'unit',
|
||||
width: 80,
|
||||
}, {
|
||||
title: '价格',
|
||||
dataIndex: 'price',
|
||||
width: 100,
|
||||
}, {
|
||||
title: '数量',
|
||||
dataIndex: 'count',
|
||||
width: 120,
|
||||
}, {
|
||||
title: '合计',
|
||||
dataIndex: 'total',
|
||||
width: 100,
|
||||
}, {
|
||||
title: '操作',
|
||||
dataIndex: 'operation',
|
||||
width: 100,
|
||||
}]
|
||||
// 产品表格字段
|
||||
const productListColumns = [{
|
||||
title: '产品名称',
|
||||
dataIndex: 'name',
|
||||
width: 100,
|
||||
fixed: 'left',
|
||||
ellipsis: true,
|
||||
}, {
|
||||
title: '是否上下架',
|
||||
dataIndex: 'status',
|
||||
width: 120,
|
||||
}, {
|
||||
title: '产品类型',
|
||||
dataIndex: 'type',
|
||||
width: 100,
|
||||
}, {
|
||||
title: '产品单位',
|
||||
dataIndex: 'unit',
|
||||
width: 100,
|
||||
}, {
|
||||
title: '产品编码',
|
||||
dataIndex: 'code',
|
||||
width: 150,
|
||||
}, {
|
||||
title: '价格',
|
||||
dataIndex: 'price',
|
||||
width: 150,
|
||||
}, {
|
||||
title: '产品描述',
|
||||
dataIndex: 'description',
|
||||
width: 240,
|
||||
ellipsis: true,
|
||||
}, {
|
||||
title: '创建时间',
|
||||
dataIndex: 'created',
|
||||
width: 185,
|
||||
customRender: text => {
|
||||
let m = moment(text.value * 1000).format('YYYY-MM-DD HH:mm:ss')
|
||||
return m == 'Invalid date' ? '' : m
|
||||
}
|
||||
}, {
|
||||
title: '更新时间',
|
||||
dataIndex: 'updated',
|
||||
width: 185,
|
||||
customRender: text => {
|
||||
let m = moment(text.value * 1000).format('YYYY-MM-DD HH:mm:ss')
|
||||
return m == 'Invalid date' ? '' : m
|
||||
}
|
||||
}, {
|
||||
title: '创建人',
|
||||
dataIndex: 'creator',
|
||||
width: 150,
|
||||
}];
|
||||
|
||||
// 产品表格字段
|
||||
const productListColumns = [{
|
||||
title: '产品名称',
|
||||
dataIndex: 'name',
|
||||
width: 100,
|
||||
fixed: 'left',
|
||||
ellipsis: true,
|
||||
}, {
|
||||
title: '是否上下架',
|
||||
dataIndex: 'status',
|
||||
width: 120,
|
||||
}, {
|
||||
title: '产品类型',
|
||||
dataIndex: 'type',
|
||||
width: 100,
|
||||
}, {
|
||||
title: '产品单位',
|
||||
dataIndex: 'unit',
|
||||
width: 100,
|
||||
}, {
|
||||
title: '产品编码',
|
||||
dataIndex: 'code',
|
||||
width: 150,
|
||||
}, {
|
||||
title: '价格',
|
||||
dataIndex: 'price',
|
||||
width: 150,
|
||||
}, {
|
||||
title: '产品描述',
|
||||
dataIndex: 'description',
|
||||
width: 240,
|
||||
ellipsis: true,
|
||||
}, {
|
||||
title: '创建时间',
|
||||
dataIndex: 'created',
|
||||
width: 185,
|
||||
customRender: text => {
|
||||
let m = moment(text.value * 1000).format('YYYY-MM-DD HH:mm:ss')
|
||||
return m == 'Invalid date' ? '' : m
|
||||
}
|
||||
}, {
|
||||
title: '更新时间',
|
||||
dataIndex: 'updated',
|
||||
width: 185,
|
||||
customRender: text => {
|
||||
let m = moment(text.value * 1000).format('YYYY-MM-DD HH:mm:ss')
|
||||
return m == 'Invalid date' ? '' : m
|
||||
}
|
||||
}, {
|
||||
title: '创建人',
|
||||
dataIndex: 'creator',
|
||||
width: 150,
|
||||
}];
|
||||
// 表单校验
|
||||
const rules = {
|
||||
name: [{ required: true, message: '请输入合同名称', trigger: 'blur' }],
|
||||
cid: [{ required: true, message: '请选择客户', trigger: 'blur' }],
|
||||
status: [{ required: true, message: '请选择合同状态' }]
|
||||
};
|
||||
|
||||
// 表单校验
|
||||
const rules = {
|
||||
name: [{ required: true, message: '请输入合同名称', trigger: 'blur' }],
|
||||
cid: [{ required: true, message: '请选择客户', trigger: 'blur' }],
|
||||
status: [{ required: true, message: '请选择合同状态' }]
|
||||
};
|
||||
// 合同属性
|
||||
let contract = reactive({
|
||||
id: undefined,
|
||||
name: undefined,
|
||||
amount: undefined,
|
||||
beginTime: '',
|
||||
overTime: '',
|
||||
cid: undefined,
|
||||
remarks: undefined,
|
||||
status: undefined,
|
||||
productlist: [],
|
||||
});
|
||||
|
||||
// 合同属性
|
||||
let contract = reactive({
|
||||
id: undefined,
|
||||
name: undefined,
|
||||
amount: undefined,
|
||||
beginTime: '',
|
||||
overTime: '',
|
||||
cid: undefined,
|
||||
remarks: undefined,
|
||||
status: undefined,
|
||||
productlist: [],
|
||||
});
|
||||
const data = reactive({
|
||||
contractId: 0,
|
||||
contractList: [],
|
||||
contractIds: [],
|
||||
productList: [],
|
||||
productIds: [],
|
||||
addedProductList: [],
|
||||
customerOption: [],
|
||||
defaultSelectedIds: []
|
||||
})
|
||||
|
||||
const data = reactive({
|
||||
contractId: 0,
|
||||
contractList: [],
|
||||
contractIds: [],
|
||||
productList: [],
|
||||
productIds: [],
|
||||
addedProductList: [],
|
||||
customerOption: [],
|
||||
defaultSelectedIds: []
|
||||
})
|
||||
// 表格分页
|
||||
let pagination = reactive({
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
total: undefined,
|
||||
})
|
||||
|
||||
// 表格分页
|
||||
let pagination = reactive({
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
total: undefined,
|
||||
})
|
||||
// 点击搜索
|
||||
const onSearch = () => { getContractList() };
|
||||
|
||||
// 点击搜索
|
||||
const onSearch = () => { getContractList() };
|
||||
const title = ref('');
|
||||
const visible = ref(false);
|
||||
const disabled = ref(true)
|
||||
const operation = ref(0);
|
||||
const contractFormRef = ref();
|
||||
const keyWord = ref('')
|
||||
const productListVisible = ref(false);
|
||||
|
||||
const title = ref('');
|
||||
const visible = ref(false);
|
||||
const disabled = ref(true)
|
||||
const operation = ref(0);
|
||||
const contractFormRef = ref();
|
||||
const keyWord = ref('')
|
||||
const productListVisible = ref(false);
|
||||
// 点击新建合同
|
||||
const onCreate = () => {
|
||||
title.value = '新建合同'
|
||||
operation.value = 1
|
||||
visible.value = true
|
||||
}
|
||||
|
||||
// 点击新建合同
|
||||
const onCreate = () => {
|
||||
title.value = '新建合同'
|
||||
operation.value = 1
|
||||
visible.value = true
|
||||
// 点击编辑合同
|
||||
const onEdit = (row) => {
|
||||
title.value = '编辑合同'
|
||||
operation.value = 2
|
||||
getCustomerOption()
|
||||
let param = { id: row.id }
|
||||
queryContractInfo(param).then((res) => {
|
||||
if (res.data.code == 0) {
|
||||
let p = res.data.data
|
||||
contract.id = p.id
|
||||
contract.name = p.name
|
||||
contract.cid = p.cid
|
||||
contract.amount = p.amount
|
||||
contract.beginTime = p.beginTime
|
||||
contract.overTime = p.overTime
|
||||
contract.remarks = p.remarks
|
||||
contract.status = p.status
|
||||
contract.productlist = p.productlist
|
||||
data.addedProductList = p.productlist
|
||||
}
|
||||
})
|
||||
data.contractId = row.id
|
||||
visible.value = true
|
||||
}
|
||||
|
||||
// 点击编辑合同
|
||||
const onEdit = (row) => {
|
||||
title.value = '编辑合同'
|
||||
operation.value = 2
|
||||
getCustomerOption()
|
||||
let param = { id: row.id }
|
||||
queryContractInfo(param).then((res) => {
|
||||
if (res.data.code == 0) {
|
||||
let p = res.data.data
|
||||
contract.id = p.id
|
||||
contract.name = p.name
|
||||
contract.cid = p.cid
|
||||
contract.amount = p.amount
|
||||
contract.beginTime = p.beginTime
|
||||
contract.overTime = p.overTime
|
||||
contract.remarks = p.remarks
|
||||
contract.status = p.status
|
||||
contract.productlist = p.productlist
|
||||
data.addedProductList = p.productlist
|
||||
}
|
||||
})
|
||||
data.contractId = row.id
|
||||
visible.value = true
|
||||
}
|
||||
|
||||
// 点击保存合同
|
||||
const onSave = () => {
|
||||
contractFormRef.value.validateFields().then(() => {
|
||||
if (operation.value == 1) {
|
||||
let param = {
|
||||
name: contract.name,
|
||||
cid: contract.cid,
|
||||
amount: contract.amount,
|
||||
beginTime: contract.beginTime,
|
||||
overTime: contract.overTime,
|
||||
remarks: contract.remarks,
|
||||
status: contract.status,
|
||||
productlist: data.addedProductList,
|
||||
}
|
||||
createContract(param).then((res) => {
|
||||
if (res.data.code == 0) {
|
||||
message.success('保存成功')
|
||||
data.defaultSelectedIds = []
|
||||
getContractList()
|
||||
}
|
||||
})
|
||||
}
|
||||
if (operation.value == 2) {
|
||||
let param = {
|
||||
id: contract.id,
|
||||
name: contract.name,
|
||||
cid: contract.cid,
|
||||
amount: contract.amount,
|
||||
beginTime: contract.beginTime,
|
||||
overTime: contract.overTime,
|
||||
remarks: contract.remarks,
|
||||
status: contract.status,
|
||||
productlist: data.addedProductList,
|
||||
}
|
||||
updateContract(param).then((res) => {
|
||||
if (res.data.code == 0) {
|
||||
message.success('保存成功')
|
||||
data.defaultSelectedIds = []
|
||||
getContractList()
|
||||
}
|
||||
})
|
||||
}
|
||||
contractFormRef.value.resetFields()
|
||||
visible.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
// 点击删除合同
|
||||
const onDelete = () => {
|
||||
// 点击保存合同
|
||||
const onSave = () => {
|
||||
contractFormRef.value.validateFields().then(() => {
|
||||
if (operation.value == 1) {
|
||||
let param = {
|
||||
ids: data.contractIds
|
||||
name: contract.name,
|
||||
cid: contract.cid,
|
||||
amount: contract.amount,
|
||||
beginTime: contract.beginTime,
|
||||
overTime: contract.overTime,
|
||||
remarks: contract.remarks,
|
||||
status: contract.status,
|
||||
productlist: data.addedProductList,
|
||||
}
|
||||
Modal.confirm({
|
||||
title: '确定删除选中的' + data.contractIds.length + '项吗?',
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
centered: true,
|
||||
cancelText: '取消',
|
||||
okText: '确定',
|
||||
onOk() {
|
||||
deleteContract(param).then((res) => {
|
||||
if (res.data.code == 0) {
|
||||
getContractList()
|
||||
disabled.value = true
|
||||
message.success('删除成功')
|
||||
}
|
||||
})
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
},
|
||||
});
|
||||
createContract(param).then((res) => {
|
||||
if (res.data.code == 0) {
|
||||
message.success('保存成功')
|
||||
data.defaultSelectedIds = []
|
||||
getContractList()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 初始化数据
|
||||
onMounted(() => { getContractList() })
|
||||
|
||||
// 点击全部合同
|
||||
const onContracts = () => {
|
||||
keyWord.value = ''
|
||||
getContractList()
|
||||
}
|
||||
|
||||
// 分页查询合同列表
|
||||
const onPagination = (page) => {
|
||||
pagination.current = page
|
||||
getContractList()
|
||||
}
|
||||
const getContractList = () => {
|
||||
if (operation.value == 2) {
|
||||
let param = {
|
||||
id: parseInt(keyWord.value == '' ? '0' : keyWord.value),
|
||||
pageNum: pagination.current,
|
||||
pageSize: pagination.pageSize
|
||||
id: contract.id,
|
||||
name: contract.name,
|
||||
cid: contract.cid,
|
||||
amount: contract.amount,
|
||||
beginTime: contract.beginTime,
|
||||
overTime: contract.overTime,
|
||||
remarks: contract.remarks,
|
||||
status: contract.status,
|
||||
productlist: data.addedProductList,
|
||||
}
|
||||
queryContractList(param).then((res) => {
|
||||
updateContract(param).then((res) => {
|
||||
if (res.data.code == 0) {
|
||||
pagination.total = res.data.data.total
|
||||
data.contractList = res.data.data.list
|
||||
message.success('保存成功')
|
||||
data.defaultSelectedIds = []
|
||||
getContractList()
|
||||
}
|
||||
})
|
||||
}
|
||||
contractFormRef.value.resetFields()
|
||||
visible.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
// 点击添加产品
|
||||
const onAddProduct = () => {
|
||||
let param = {
|
||||
pageNum: pagination.current,
|
||||
pageSize: pagination.pageSize
|
||||
}
|
||||
queryProductList(param).then((res) => {
|
||||
// 点击删除合同
|
||||
const onDelete = () => {
|
||||
let param = {
|
||||
ids: data.contractIds
|
||||
}
|
||||
Modal.confirm({
|
||||
title: '确定删除选中的' + data.contractIds.length + '项吗?',
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
centered: true,
|
||||
cancelText: '取消',
|
||||
okText: '确定',
|
||||
onOk() {
|
||||
deleteContract(param).then((res) => {
|
||||
if (res.data.code == 0) {
|
||||
pagination.total = res.data.data.total
|
||||
data.productList = res.data.data.list
|
||||
getContractList()
|
||||
disabled.value = true
|
||||
message.success('删除成功')
|
||||
}
|
||||
})
|
||||
data.defaultSelectedIds = []
|
||||
if (data.addedProductList.length > 0) {
|
||||
for (let i = 0; i < data.addedProductList.length; i++) {
|
||||
data.defaultSelectedIds[i] = data.addedProductList[i].id
|
||||
}
|
||||
}
|
||||
productListVisible.value = true
|
||||
}
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
// 分页查询产品列表
|
||||
const onPaginationProduct = (page) => {
|
||||
pagination.current = page
|
||||
let param = {
|
||||
pageNum: pagination.current,
|
||||
pageSize: pagination.pageSize
|
||||
}
|
||||
queryProductList(param).then((res) => {
|
||||
if (res.data.code == 0) {
|
||||
pagination.total = res.data.data.total
|
||||
data.productList = res.data.data.list
|
||||
}
|
||||
// 初始化数据
|
||||
onMounted(() => { getContractList() })
|
||||
|
||||
// 点击全部合同
|
||||
const onContracts = () => {
|
||||
keyWord.value = ''
|
||||
getContractList()
|
||||
}
|
||||
|
||||
// 分页查询合同列表
|
||||
const onPagination = (page) => {
|
||||
pagination.current = page
|
||||
getContractList()
|
||||
}
|
||||
const getContractList = () => {
|
||||
let param = {
|
||||
id: parseInt(keyWord.value == '' ? '0' : keyWord.value),
|
||||
pageNum: pagination.current,
|
||||
pageSize: pagination.pageSize
|
||||
}
|
||||
queryContractList(param).then((res) => {
|
||||
if (res.data.code == 0) {
|
||||
pagination.total = res.data.data.total
|
||||
data.contractList = res.data.data.list
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 点击添加产品
|
||||
const onAddProduct = () => {
|
||||
let param = {
|
||||
pageNum: pagination.current,
|
||||
pageSize: pagination.pageSize
|
||||
}
|
||||
queryProductList(param).then((res) => {
|
||||
if (res.data.code == 0) {
|
||||
pagination.total = res.data.data.total
|
||||
data.productList = res.data.data.list
|
||||
}
|
||||
})
|
||||
data.defaultSelectedIds = []
|
||||
if (data.addedProductList.length > 0) {
|
||||
for (let i = 0; i < data.addedProductList.length; i++) {
|
||||
data.defaultSelectedIds[i] = data.addedProductList[i].id
|
||||
}
|
||||
}
|
||||
productListVisible.value = true
|
||||
}
|
||||
|
||||
// 分页查询产品列表
|
||||
const onPaginationProduct = (page) => {
|
||||
pagination.current = page
|
||||
let param = {
|
||||
pageNum: pagination.current,
|
||||
pageSize: pagination.pageSize
|
||||
}
|
||||
queryProductList(param).then((res) => {
|
||||
if (res.data.code == 0) {
|
||||
pagination.total = res.data.data.total
|
||||
data.productList = res.data.data.list
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 已选中的合同ID
|
||||
const onSelectedConteactIds = selectedRowKeys => {
|
||||
data.contractIds = selectedRowKeys
|
||||
if (data.contractIds.length !== 0) {
|
||||
disabled.value = false
|
||||
} else {
|
||||
disabled.value = true
|
||||
}
|
||||
};
|
||||
|
||||
// 已选中的产品ID
|
||||
const onSelectedProductIds = selectedRowKeys => {
|
||||
data.productIds = selectedRowKeys
|
||||
data.defaultSelectedIds = selectedRowKeys
|
||||
};
|
||||
|
||||
// 删除选中的产品
|
||||
const delProduct = (row) => {
|
||||
for (let i = 0; i < data.addedProductList.length; i++) {
|
||||
if (data.addedProductList[i].id == row.id) {
|
||||
data.addedProductList.splice(i, 1);
|
||||
}
|
||||
}
|
||||
calculatedAmount()
|
||||
}
|
||||
|
||||
// 点击确定选中的产品ID
|
||||
const onConfirm = () => {
|
||||
console.log("xzx", data.productIds)
|
||||
let param = {
|
||||
id: data.contractId,
|
||||
pids: data.productIds
|
||||
}
|
||||
queryContractPlist(param).then((res) => {
|
||||
if (res.data.code == 0) {
|
||||
data.addedProductList = res.data.data
|
||||
}
|
||||
})
|
||||
productListVisible.value = false
|
||||
}
|
||||
|
||||
// 查询客户选项
|
||||
const getCustomerOption = () => {
|
||||
queryCustomerOption().then((res) => {
|
||||
if (res.data.code == 0) {
|
||||
data.customerOption = res.data.data
|
||||
console.log("zxxzc", data.customerOption)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const changeCustomerOption = (value) => {
|
||||
contract.cid.value = value
|
||||
}
|
||||
|
||||
// 计算金额
|
||||
const calculatedAmount = () => {
|
||||
contract.amount = 0
|
||||
let totalAmount = 0
|
||||
for (let i = 0; i < data.addedProductList.length; i++) {
|
||||
totalAmount = totalAmount + (data.addedProductList[i].price * data.addedProductList[i].count)
|
||||
}
|
||||
contract.amount = totalAmount
|
||||
}
|
||||
|
||||
// 点击合同取消按钮
|
||||
const onCancel = () => {
|
||||
contractFormRef.value.resetFields()
|
||||
data.addedProductList = []
|
||||
data.contractId = undefined
|
||||
visible.value = false
|
||||
};
|
||||
|
||||
// 导出表格
|
||||
const onExport = () => {
|
||||
contractExport().then((res) => {
|
||||
if (res.data.type == 'application/json') {
|
||||
message.error('导出错误！')
|
||||
} else {
|
||||
let blob = new Blob([res.data], {
|
||||
type: "application/vnd.ms-excel"
|
||||
})
|
||||
let a = document.createElement('a')
|
||||
a.setAttribute("download", "合同信息.xlsx");
|
||||
a.href = window.URL.createObjectURL(blob)
|
||||
a.click()
|
||||
window.URL.revokeObjectURL(a.href)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 已选中的合同ID
|
||||
const onSelectedConteactIds = selectedRowKeys => {
|
||||
data.contractIds = selectedRowKeys
|
||||
if (data.contractIds.length !== 0) {
|
||||
disabled.value = false
|
||||
} else {
|
||||
disabled.value = true
|
||||
}
|
||||
};
|
||||
|
||||
// 已选中的产品ID
|
||||
const onSelectedProductIds = selectedRowKeys => {
|
||||
data.productIds = selectedRowKeys
|
||||
data.defaultSelectedIds = selectedRowKeys
|
||||
};
|
||||
|
||||
// 删除选中的产品
|
||||
const delProduct = (row) => {
|
||||
for (let i = 0; i < data.addedProductList.length; i++) {
|
||||
if (data.addedProductList[i].id == row.id) {
|
||||
data.addedProductList.splice(i, 1);
|
||||
}
|
||||
}
|
||||
calculatedAmount()
|
||||
}
|
||||
|
||||
// 点击确定选中的产品ID
|
||||
const onConfirm = () => {
|
||||
console.log("xzx", data.productIds)
|
||||
let param = {
|
||||
id: data.contractId,
|
||||
pids: data.productIds
|
||||
}
|
||||
queryContractPlist(param).then((res) => {
|
||||
if (res.data.code == 0) {
|
||||
data.addedProductList = res.data.data
|
||||
}
|
||||
})
|
||||
productListVisible.value = false
|
||||
}
|
||||
|
||||
// 查询客户选项
|
||||
const getCustomerOption = () => {
|
||||
queryCustomerOption().then((res) => {
|
||||
if (res.data.code == 0) {
|
||||
data.customerOption = res.data.data
|
||||
console.log("zxxzc", data.customerOption)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const changeCustomerOption = (value) => {
|
||||
contract.cid.value = value
|
||||
}
|
||||
|
||||
// 计算金额
|
||||
const calculatedAmount = () => {
|
||||
contract.amount = 0
|
||||
let totalAmount = 0
|
||||
for (let i = 0; i < data.addedProductList.length; i++) {
|
||||
totalAmount = totalAmount + (data.addedProductList[i].price * data.addedProductList[i].count)
|
||||
}
|
||||
contract.amount = totalAmount
|
||||
}
|
||||
|
||||
// 点击合同取消按钮
|
||||
const onCancel = () => {
|
||||
contractFormRef.value.resetFields()
|
||||
data.addedProductList = []
|
||||
data.contractId = undefined
|
||||
visible.value = false
|
||||
};
|
||||
|
||||
// 导出表格
|
||||
const onExport = () => {
|
||||
contractExport().then((res) => {
|
||||
if (res.data.type == 'application/json'){
|
||||
message.error('导出错误！')
|
||||
} else {
|
||||
let blob = new Blob([res.data], {
|
||||
type: "application/vnd.ms-excel"
|
||||
})
|
||||
let a = document.createElement('a')
|
||||
a.setAttribute("download", "合同信息.xlsx");
|
||||
a.href = window.URL.createObjectURL(blob)
|
||||
a.click()
|
||||
window.URL.revokeObjectURL(a.href)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 点击取消产品列表
|
||||
const onCancelProductList = () => {
|
||||
productListVisible.value = false
|
||||
data.contractId = undefined
|
||||
pagination.current = 1,
|
||||
pagination.total = undefined
|
||||
}
|
||||
|
||||
return {
|
||||
columns,
|
||||
productColumns,
|
||||
productListColumns,
|
||||
rules,
|
||||
data,
|
||||
onSelectedConteactIds,
|
||||
onSelectedProductIds,
|
||||
onSearch,
|
||||
contract,
|
||||
title,
|
||||
visible,
|
||||
disabled,
|
||||
productListVisible,
|
||||
operation,
|
||||
onCreate,
|
||||
onEdit,
|
||||
contractFormRef,
|
||||
onSave,
|
||||
onCancel,
|
||||
onDelete,
|
||||
onCancelProductList,
|
||||
getContractList,
|
||||
keyWord,
|
||||
onConfirm,
|
||||
onAddProduct,
|
||||
getCustomerOption,
|
||||
changeCustomerOption,
|
||||
calculatedAmount,
|
||||
delProduct,
|
||||
pagination,
|
||||
onPagination,
|
||||
onExport,
|
||||
onContracts,
|
||||
onPaginationProduct,
|
||||
};
|
||||
},
|
||||
// 点击取消产品列表
|
||||
const onCancelProductList = () => {
|
||||
productListVisible.value = false
|
||||
data.contractId = undefined
|
||||
pagination.current = 1,
|
||||
pagination.total = undefined
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user