571 lines
15 KiB
Vue
571 lines
15 KiB
Vue
|
<template>
|
|||
|
|
<BasicModal
|
|||
|
|
v-bind="$attrs"
|
|||
|
|
@register="registerModal"
|
|||
|
|
:title="getTitle"
|
|||
|
|
@ok="handleSubmit"
|
|||
|
|
:width="1000"
|
|||
|
|
>
|
|||
|
|
<div class="sub-title">基础信息</div>
|
|||
|
|
<BasicForm @register="registerForm">
|
|||
|
|
<template #code="{ model }">
|
|||
|
|
<a-input
|
|||
|
|
v-model:value="model.purchaseNumber"
|
|||
|
|
placeholder="请输入采购单号"
|
|||
|
|
:readonly="model.isSysNumBoolean"
|
|||
|
|
/>
|
|||
|
|
</template>
|
|||
|
|
<template #isSysNum="{ model }">
|
|||
|
|
<a-checkbox
|
|||
|
|
v-model:checked="model.isSysNumBoolean"
|
|||
|
|
@change="handleSysChange"
|
|||
|
|
style="margin-left: 10px"
|
|||
|
|
>
|
|||
|
|
用系统编号
|
|||
|
|
</a-checkbox>
|
|||
|
|
</template>
|
|||
|
|
<template #isRelation="{ model }">
|
|||
|
|
<a-checkbox
|
|||
|
|
v-model:checked="model.isRelationApplyBoolean"
|
|||
|
|
@change="handleRelationChange"
|
|||
|
|
style="margin-left: 10px"
|
|||
|
|
>
|
|||
|
|
不关联
|
|||
|
|
</a-checkbox>
|
|||
|
|
</template>
|
|||
|
|
<template #user="{ model }">
|
|||
|
|
<SelectUser
|
|||
|
|
v-model:value="model.purchasePersonId"
|
|||
|
|
:multiple="false"
|
|||
|
|
suffix="ant-design:setting-outlined"
|
|||
|
|
placeholder="请选择采购人员"
|
|||
|
|
@change="handleUserChange"
|
|||
|
|
/>
|
|||
|
|
</template>
|
|||
|
|
</BasicForm>
|
|||
|
|
<BasicTable @register="registerTable">
|
|||
|
|
<template #toolbar>
|
|||
|
|
<a-button type="primary" @click="openModal(true, { type: 'checkbox' })"> 添加 </a-button>
|
|||
|
|
<a-button type="primary" danger @click="handleDelete"> 移除</a-button>
|
|||
|
|
</template>
|
|||
|
|
<template #bodyCell="{ column, record }">
|
|||
|
|
<template v-if="column.key === 'price'">
|
|||
|
|
<a-input-number
|
|||
|
|
v-model:value="record.price"
|
|||
|
|
:min="0"
|
|||
|
|
@change="handleNumberChange(record)"
|
|||
|
|
/>
|
|||
|
|
</template>
|
|||
|
|
<template v-if="column.key === 'count'">
|
|||
|
|
<a-input-number
|
|||
|
|
v-model:value="record.count"
|
|||
|
|
:min="0"
|
|||
|
|
@change="handleNumberChange(record)"
|
|||
|
|
/>
|
|||
|
|
</template>
|
|||
|
|
<template v-if="column.key === 'discount'">
|
|||
|
|
<a-input-number
|
|||
|
|
v-model:value="record.discount"
|
|||
|
|
addon-after="%"
|
|||
|
|
:min="0"
|
|||
|
|
@change="handleNumberChange(record)"
|
|||
|
|
/>
|
|||
|
|
</template>
|
|||
|
|
<template v-if="column.key === 'taxRate'">
|
|||
|
|
<a-input-number
|
|||
|
|
v-model:value="record.taxRate"
|
|||
|
|
addon-after="%"
|
|||
|
|
:min="0"
|
|||
|
|
@change="handleNumberChange(record)"
|
|||
|
|
/>
|
|||
|
|
</template>
|
|||
|
|
<template v-if="column.key === 'taxBreak'">
|
|||
|
|
<a-input v-model:value="record.taxBreak" disabled />
|
|||
|
|
</template>
|
|||
|
|
<template v-if="column.key === 'afterTaxAmount'">
|
|||
|
|
<a-input v-model:value="record.afterTaxAmount" disabled />
|
|||
|
|
</template>
|
|||
|
|
<template v-if="column.key === 'deliveryDate'">
|
|||
|
|
<XjrDatePicker v-model:value="record.deliveryDate" format="YYYY-MM-DD" />
|
|||
|
|
</template>
|
|||
|
|
<template v-if="column.key === 'remark'">
|
|||
|
|
<a-input v-model:value="record.remark" />
|
|||
|
|
</template>
|
|||
|
|
</template>
|
|||
|
|
</BasicTable>
|
|||
|
|
<div class="table-bottom">
|
|||
|
|
<span>合计</span>
|
|||
|
|
<div>
|
|||
|
|
<span>
|
|||
|
|
总量：
|
|||
|
|
<span class="price">{{ total.countSum }}</span>
|
|||
|
|
</span>
|
|||
|
|
<span>
|
|||
|
|
总金额：
|
|||
|
|
<span class="price">{{ total.amountSum }}</span>
|
|||
|
|
</span>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="sub-title">附件</div>
|
|||
|
|
<Upload
|
|||
|
|
v-model:value="folderId"
|
|||
|
|
listType="dragger"
|
|||
|
|
:tip="fileTip"
|
|||
|
|
:style="{ width: '200px' }"
|
|||
|
|
/>
|
|||
|
|
<SelectModal @register="registerSelectModal" @success="handleSuccess" />
|
|||
|
|
</BasicModal>
|
|||
|
|
</template>
|
|||
|
|
<script lang="ts" setup>
|
|||
|
|
import { ref, computed, unref } from 'vue';
|
|||
|
|
import { BasicModal, useModalInner, useModal } from '/@/components/Modal';
|
|||
|
|
import { BasicForm, useForm } from '/@/components/Form/index';
|
|||
|
|
import { BasicTable, useTable, BasicColumn, FormSchema } from '/@/components/Table';
|
|||
|
|
import Upload from '/@/components/Form/src/components/Upload.vue';
|
|||
|
|
import SelectModal from '../../bom/components/SelectModal.vue';
|
|||
|
|
import SelectUser from '/@/components/Form/src/components/SelectUser.vue';
|
|||
|
|
import { XjrDatePicker } from '/@/components/DatePicker';
|
|||
|
|
import { getSaleCode } from '/@/api/erp/sale/order';
|
|||
|
|
import { getPurchaseInfo, updatePurchase, addPurchase } from '/@/api/erp/purchase/order';
|
|||
|
|
import { getCaseErpApply } from '/@/api/erp/purchase/apply';
|
|||
|
|
import { getCaseErpApplyList } from '/@/api/erp/purchase/apply';
|
|||
|
|
import { getSupplierList } from '/@/api/erp/supplier/list';
|
|||
|
|
import { getUser } from '/@/api/system/user';
|
|||
|
|
import { useMessage } from '/@/hooks/web/useMessage';
|
|||
|
|
import { useI18n } from '/@/hooks/web/useI18n';
|
|||
|
|
|
|||
|
|
const { t } = useI18n();
|
|||
|
|
|
|||
|
|
const handleApplyChange = async (id) => {
|
|||
|
|
const res = await getCaseErpApply(id);
|
|||
|
|
let userInfo;
|
|||
|
|
if (res.applyUserIds) {
|
|||
|
|
userInfo = await getUser(res.applyUserIds);
|
|||
|
|
}
|
|||
|
|
setFieldsValue({
|
|||
|
|
relatedProject: res.relatedProject,
|
|||
|
|
purchasePersonId: res.applyUserIds,
|
|||
|
|
purchaseDeptId: res.applyDepId,
|
|||
|
|
purchasePhone: userInfo?.mobile || '',
|
|||
|
|
filePath: res.filePath,
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
unref(total).countSum = res.countSum || 0;
|
|||
|
|
unref(total).amountSum = res.amountSum || 0;
|
|||
|
|
|
|||
|
|
setTableData(res.caseErpApplyDetailList || []);
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
const FormSchema: FormSchema[] = [
|
|||
|
|
{
|
|||
|
|
field: 'purchaseNumber',
|
|||
|
|
label: '采购单号',
|
|||
|
|
component: 'Input',
|
|||
|
|
slot: 'code',
|
|||
|
|
required: true,
|
|||
|
|
colProps: { span: 9 },
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'isSysNumBoolean',
|
|||
|
|
label: '',
|
|||
|
|
component: 'Input',
|
|||
|
|
slot: 'isSysNum',
|
|||
|
|
colProps: { span: 3 },
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'applyId',
|
|||
|
|
label: '关联申请单',
|
|||
|
|
component: 'ApiSelect',
|
|||
|
|
colProps: { span: 9 },
|
|||
|
|
componentProps: {
|
|||
|
|
placeholder: '请选择关联申请单',
|
|||
|
|
api: getCaseErpApplyList,
|
|||
|
|
labelField: 'theme',
|
|||
|
|
valueField: 'id',
|
|||
|
|
getPopupContainer: () => document.body,
|
|||
|
|
onChange: handleApplyChange,
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'isRelationApplyBoolean',
|
|||
|
|
label: '',
|
|||
|
|
component: 'Input',
|
|||
|
|
slot: 'isRelation',
|
|||
|
|
colProps: { span: 3 },
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'theme',
|
|||
|
|
label: '订单主题',
|
|||
|
|
component: 'Input',
|
|||
|
|
required: true,
|
|||
|
|
colProps: { span: 24 },
|
|||
|
|
componentProps: {
|
|||
|
|
placeholder: '请输入订单主题',
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'purchaseDate',
|
|||
|
|
label: '采购日期',
|
|||
|
|
component: 'DatePicker',
|
|||
|
|
required: true,
|
|||
|
|
colProps: { span: 12 },
|
|||
|
|
componentProps: {
|
|||
|
|
format: 'YYYY-MM-DD',
|
|||
|
|
placeholder: '请选择采购日期',
|
|||
|
|
getPopupContainer: () => document.body,
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'supplierId',
|
|||
|
|
label: '供应商名称',
|
|||
|
|
component: 'ApiSelect',
|
|||
|
|
colProps: { span: 12 },
|
|||
|
|
componentProps: {
|
|||
|
|
placeholder: '请选择供应商名称',
|
|||
|
|
api: getSupplierList,
|
|||
|
|
labelField: 'name',
|
|||
|
|
valueField: 'id',
|
|||
|
|
getPopupContainer: () => document.body,
|
|||
|
|
onChange: (_, option) => {
|
|||
|
|
if (option) {
|
|||
|
|
setFieldsValue({
|
|||
|
|
supplierPerson: option.person || '',
|
|||
|
|
supplierWay: option.phone || '',
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'supplierPerson',
|
|||
|
|
label: '联系人',
|
|||
|
|
component: 'Input',
|
|||
|
|
colProps: { span: 12 },
|
|||
|
|
componentProps: {
|
|||
|
|
disabled: true,
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'supplierWay',
|
|||
|
|
label: '联系方式',
|
|||
|
|
component: 'Input',
|
|||
|
|
colProps: { span: 12 },
|
|||
|
|
componentProps: {
|
|||
|
|
disabled: true,
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'purchaseDeptId',
|
|||
|
|
label: '采购部门',
|
|||
|
|
component: 'Dept',
|
|||
|
|
colProps: { span: 12 },
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'purchasePersonId',
|
|||
|
|
label: '采购人员',
|
|||
|
|
component: 'Input',
|
|||
|
|
slot: 'user',
|
|||
|
|
colProps: { span: 12 },
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'purchasePhone',
|
|||
|
|
label: '联系电话',
|
|||
|
|
component: 'Input',
|
|||
|
|
colProps: { span: 12 },
|
|||
|
|
componentProps: {
|
|||
|
|
disabled: true,
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'relatedProject',
|
|||
|
|
label: '关联项目',
|
|||
|
|
component: 'DicSelect',
|
|||
|
|
colProps: { span: 12 },
|
|||
|
|
componentProps: {
|
|||
|
|
placeholder: '请选择关联项目',
|
|||
|
|
itemId: '1680768933996957698',
|
|||
|
|
isShowAdd: false,
|
|||
|
|
getPopupContainer: () => document.body,
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'payType',
|
|||
|
|
label: '结算方式',
|
|||
|
|
component: 'DicSelect',
|
|||
|
|
colProps: { span: 12 },
|
|||
|
|
componentProps: {
|
|||
|
|
placeholder: '请选择结算方式',
|
|||
|
|
itemId: '1680821338692333570',
|
|||
|
|
isShowAdd: false,
|
|||
|
|
getPopupContainer: () => document.body,
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'payAddress',
|
|||
|
|
label: '交付地址',
|
|||
|
|
component: 'Input',
|
|||
|
|
colProps: { span: 24 },
|
|||
|
|
componentProps: {
|
|||
|
|
placeholder: '请输入交货地址',
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'remark',
|
|||
|
|
label: '备注',
|
|||
|
|
component: 'InputTextArea',
|
|||
|
|
colProps: { span: 24 },
|
|||
|
|
componentProps: {
|
|||
|
|
placeholder: '请输入备注',
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
];
|
|||
|
|
|
|||
|
|
const columns: BasicColumn[] = [
|
|||
|
|
{
|
|||
|
|
title: '物料编码',
|
|||
|
|
dataIndex: 'code',
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '物料名称',
|
|||
|
|
dataIndex: 'name',
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '规格型号',
|
|||
|
|
dataIndex: 'model',
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '单位',
|
|||
|
|
dataIndex: 'unitName',
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '单价',
|
|||
|
|
dataIndex: 'price',
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '数量',
|
|||
|
|
dataIndex: 'count',
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '折扣',
|
|||
|
|
dataIndex: 'discount',
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '税率',
|
|||
|
|
dataIndex: 'taxRate',
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '税费',
|
|||
|
|
dataIndex: 'taxBreak',
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '税后金额',
|
|||
|
|
dataIndex: 'afterTaxAmount',
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '交付日期',
|
|||
|
|
dataIndex: 'deliveryDate',
|
|||
|
|
},
|
|||
|
|
];
|
|||
|
|
|
|||
|
|
const { notification } = useMessage();
|
|||
|
|
const isUpdate = ref(true);
|
|||
|
|
const rowId = ref('');
|
|||
|
|
const folderId = ref('');
|
|||
|
|
const fileTip = '支持扩展名：.doc .docx .pdf .jpg ...';
|
|||
|
|
|
|||
|
|
const total = ref({
|
|||
|
|
countSum: 0 as any,
|
|||
|
|
amountSum: 0 as any,
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
const emit = defineEmits(['success']);
|
|||
|
|
|
|||
|
|
const [registerForm, { setFieldsValue, resetFields, validate, updateSchema }] = useForm({
|
|||
|
|
labelWidth: 100,
|
|||
|
|
schemas: FormSchema,
|
|||
|
|
showActionButtonGroup: false,
|
|||
|
|
actionColOptions: {
|
|||
|
|
span: 23,
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
const customRow = (record) => {
|
|||
|
|
return {
|
|||
|
|
onClick: () => {
|
|||
|
|
let selectedRowKeys = [...getSelectRowKeys()];
|
|||
|
|
if (selectedRowKeys.indexOf(record.key) >= 0) {
|
|||
|
|
let index = selectedRowKeys.indexOf(record.key);
|
|||
|
|
selectedRowKeys.splice(index, 1);
|
|||
|
|
} else {
|
|||
|
|
selectedRowKeys.push(record.key);
|
|||
|
|
}
|
|||
|
|
setSelectedRowKeys(selectedRowKeys);
|
|||
|
|
},
|
|||
|
|
};
|
|||
|
|
};
|
|||
|
|
const [registerTable, { setSelectedRowKeys, getSelectRowKeys, setTableData, getDataSource }] =
|
|||
|
|
useTable({
|
|||
|
|
title: '采购物料',
|
|||
|
|
columns,
|
|||
|
|
striped: false,
|
|||
|
|
pagination: false,
|
|||
|
|
rowSelection: {
|
|||
|
|
type: 'checkbox',
|
|||
|
|
},
|
|||
|
|
customRow,
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
const [registerSelectModal, { openModal }] = useModal();
|
|||
|
|
|
|||
|
|
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
|||
|
|
resetFields();
|
|||
|
|
setModalProps({ confirmLoading: false, destroyOnClose: true });
|
|||
|
|
|
|||
|
|
isUpdate.value = !!data?.isUpdate;
|
|||
|
|
if (unref(isUpdate)) {
|
|||
|
|
rowId.value = data.id;
|
|||
|
|
const record = await getPurchaseInfo(data.id);
|
|||
|
|
folderId.value = record.filePath || '';
|
|||
|
|
setFieldsValue({
|
|||
|
|
...record,
|
|||
|
|
});
|
|||
|
|
setTableData(record.caseErpPurchaseDetails || []);
|
|||
|
|
unref(total).countSum = record.countSum || 0;
|
|||
|
|
unref(total).amountSum = record.amountSum || 0;
|
|||
|
|
} else {
|
|||
|
|
folderId.value = '';
|
|||
|
|
const code = await getSaleCode();
|
|||
|
|
setFieldsValue({ purchaseNumber: code, isSysNumBoolean: true });
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
const getTitle = computed(() => (!unref(isUpdate) ? '新增订单' : '编辑订单'));
|
|||
|
|
|
|||
|
|
const handleSysChange = async (e) => {
|
|||
|
|
let code = '';
|
|||
|
|
if (e.target.checked) {
|
|||
|
|
code = await getSaleCode();
|
|||
|
|
}
|
|||
|
|
setFieldsValue({ purchaseNumber: code });
|
|||
|
|
};
|
|||
|
|
const handleRelationChange = async (e) => {
|
|||
|
|
updateSchema({
|
|||
|
|
field: 'applyId',
|
|||
|
|
componentProps: { disabled: e.target.checked },
|
|||
|
|
});
|
|||
|
|
if (e.target.checked) {
|
|||
|
|
setFieldsValue({
|
|||
|
|
applyId: '',
|
|||
|
|
relatedProject: '',
|
|||
|
|
purchasePersonId: '',
|
|||
|
|
purchaseDeptId: '',
|
|||
|
|
purchasePhone: '',
|
|||
|
|
filePath: '',
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
unref(total).countSum = 0;
|
|||
|
|
unref(total).amountSum = 0;
|
|||
|
|
|
|||
|
|
setTableData([]);
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
const handleUserChange = (_, options) => {
|
|||
|
|
setFieldsValue({ purchasePhone: options[0]?.mobile });
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
const handleNumberChange = (record) => {
|
|||
|
|
const price = record.price || 0;
|
|||
|
|
const count = record.count || 0;
|
|||
|
|
const discount = record.discount || 0;
|
|||
|
|
const taxRate = record.taxRate || 0;
|
|||
|
|
if (discount) {
|
|||
|
|
record.taxBreak = price * count * (1 - discount / 100) * (taxRate / 100);
|
|||
|
|
} else {
|
|||
|
|
record.taxBreak = price * count * (taxRate / 100);
|
|||
|
|
}
|
|||
|
|
record.afterTaxAmount = price * count * (1 - discount / 100) + record.taxBreak;
|
|||
|
|
record.taxBreak = record.taxBreak.toFixed(2);
|
|||
|
|
record.afterTaxAmount = record.afterTaxAmount.toFixed(2);
|
|||
|
|
|
|||
|
|
handleTotalChange();
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
const handleSuccess = async (data) => {
|
|||
|
|
data.map((x) => {
|
|||
|
|
x.taxRate = 3;
|
|||
|
|
x.count = 0;
|
|||
|
|
});
|
|||
|
|
setTableData([...getDataSource(), ...data]);
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
const handleDelete = () => {
|
|||
|
|
const datasource = getDataSource().filter((x) => !getSelectRowKeys().includes(x.key));
|
|||
|
|
setTableData(datasource);
|
|||
|
|
handleTotalChange();
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
const handleSubmit = async () => {
|
|||
|
|
try {
|
|||
|
|
const values = await validate();
|
|||
|
|
values.filePath = folderId.value;
|
|||
|
|
values.addCaseErpPurchaseDetailDtoList = getDataSource() || [];
|
|||
|
|
Object.assign(values, unref(total));
|
|||
|
|
setModalProps({ confirmLoading: true });
|
|||
|
|
|
|||
|
|
if (!unref(isUpdate)) {
|
|||
|
|
await addPurchase(values);
|
|||
|
|
notification.success({
|
|||
|
|
message: '新增订单',
|
|||
|
|
description: t('成功'),
|
|||
|
|
});
|
|||
|
|
} else {
|
|||
|
|
values.id = rowId.value;
|
|||
|
|
await updatePurchase(values);
|
|||
|
|
notification.success({
|
|||
|
|
message: '编辑订单',
|
|||
|
|
description: t('成功'),
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
closeModal();
|
|||
|
|
emit('success');
|
|||
|
|
} catch (error) {
|
|||
|
|
setModalProps({ confirmLoading: false });
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
const handleTotalChange = () => {
|
|||
|
|
unref(total).countSum = 0;
|
|||
|
|
unref(total).amountSum = 0;
|
|||
|
|
getDataSource().map((item) => {
|
|||
|
|
const price = item.price || 0;
|
|||
|
|
const count = item.count || 0;
|
|||
|
|
unref(total).countSum += count;
|
|||
|
|
unref(total).amountSum += count * price;
|
|||
|
|
});
|
|||
|
|
unref(total).amountSum = unref(total).amountSum.toFixed(2);
|
|||
|
|
};
|
|||
|
|
</script>
|
|||
|
|
<style lang="less" scoped>
|
|||
|
|
.sub-title {
|
|||
|
|
font-weight: bold;
|
|||
|
|
margin: 15px 0 20px 30px;
|
|||
|
|
color: #606266;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.table-bottom {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
border-bottom: 1px solid #ddd;
|
|||
|
|
padding: 5px;
|
|||
|
|
|
|||
|
|
& > div > span {
|
|||
|
|
margin-left: 40px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.price {
|
|||
|
|
color: #f00;
|
|||
|
|
}
|
|||
|
|
</style>
|