|
@@ -14,7 +14,8 @@
|
|
|
action: () => newPriceSheet(),
|
|
|
},
|
|
|
]"
|
|
|
- @get-list="getList">
|
|
|
+ @get-list="getList"
|
|
|
+ >
|
|
|
<template #amount="{ item }">
|
|
|
<div>
|
|
|
<span style="padding-right: 4px">{{ item.currency }}</span>
|
|
@@ -30,18 +31,36 @@
|
|
|
</div>
|
|
|
|
|
|
<el-dialog title="打印" v-if="openPrint" v-model="openPrint" width="860">
|
|
|
- <div id="pdfDom" style="width: 800px; padding: 16px; font-size: 12px !important">
|
|
|
+ <div
|
|
|
+ id="pdfDom"
|
|
|
+ style="width: 800px; padding: 16px; font-size: 12px !important"
|
|
|
+ >
|
|
|
<div style="font-size: 18px; text-align: center">
|
|
|
- {{ getLabel(printDetails.sellCorporationId, corporationList, "nameEn") }}
|
|
|
+ {{
|
|
|
+ getLabel(printDetails.sellCorporationId, corporationList, "nameEn")
|
|
|
+ }}
|
|
|
</div>
|
|
|
<div style="text-align: center">
|
|
|
- {{ printDetails.sellCountryName }},{{ printDetails.sellProvinceName }},{{ printDetails.sellCityName }},{{ printDetails.sellAddress }}
|
|
|
+ {{ printDetails.sellCountryName }},{{
|
|
|
+ printDetails.sellProvinceName
|
|
|
+ }},{{ printDetails.sellCityName }},{{ printDetails.sellAddress }}
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ font-size: 14px;
|
|
|
+ color: #409eff;
|
|
|
+ text-align: center;
|
|
|
+ padding-top: 16px;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ QUOTATION
|
|
|
</div>
|
|
|
- <div style="font-size: 14px; color: #409eff; text-align: center; padding-top: 16px">QUOTATION</div>
|
|
|
<div style="padding-top: 8px">
|
|
|
<div>Reference NO. : {{ printDetails.code }}</div>
|
|
|
<div style="display: flex">
|
|
|
- <div style="width: 50%">DATE: {{ moment(printDetails.createTime).format("DD/MMM/yyyy") }}</div>
|
|
|
+ <div style="width: 50%">
|
|
|
+ DATE: {{ moment(printDetails.createTime).format("DD/MMM/yyyy") }}
|
|
|
+ </div>
|
|
|
<div style="width: 50%">Valid Date:</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -49,32 +68,64 @@
|
|
|
<div style="width: 50%; border-right: 1px solid black">
|
|
|
<div style="color: #409eff">VENDOR:</div>
|
|
|
<div>
|
|
|
- {{ getLabel(printDetails.sellCorporationId, corporationList, "nameEn") }}
|
|
|
+ {{
|
|
|
+ getLabel(
|
|
|
+ printDetails.sellCorporationId,
|
|
|
+ corporationList,
|
|
|
+ "nameEn"
|
|
|
+ )
|
|
|
+ }}
|
|
|
</div>
|
|
|
<div style="padding: 16px 0">
|
|
|
- {{ printDetails.sellCountryName }},{{ printDetails.sellProvinceName }},{{ printDetails.sellCityName }},{{ printDetails.sellAddress }}
|
|
|
+ {{ printDetails.sellCountryName }},{{
|
|
|
+ printDetails.sellProvinceName
|
|
|
+ }},{{ printDetails.sellCityName }},{{ printDetails.sellAddress }}
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ {{ printDetails.sellContactName }},{{
|
|
|
+ printDetails.sellContactNumber
|
|
|
+ }}
|
|
|
</div>
|
|
|
- <div>{{ printDetails.sellContactName }},{{ printDetails.sellContactNumber }}</div>
|
|
|
</div>
|
|
|
<div style="width: 50%">
|
|
|
<div style="color: #409eff">BUYER:</div>
|
|
|
<div>
|
|
|
- {{ getLabel(printDetails.buyCorporationId, customerList, "name") }}
|
|
|
+ {{
|
|
|
+ getLabel(printDetails.buyCorporationId, customerList, "name")
|
|
|
+ }}
|
|
|
</div>
|
|
|
<div style="padding: 16px 0">
|
|
|
- {{ printDetails.buyCountryName }},{{ printDetails.buyProvinceName }},{{ printDetails.buyCityName }},{{ printDetails.buyAddress }}
|
|
|
+ {{ printDetails.buyCountryName }},{{
|
|
|
+ printDetails.buyProvinceName
|
|
|
+ }},{{ printDetails.buyCityName }},{{ printDetails.buyAddress }}
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ {{ printDetails.buyContactName }},{{
|
|
|
+ printDetails.buyContactNumber
|
|
|
+ }}
|
|
|
</div>
|
|
|
- <div>{{ printDetails.buyContactName }},{{ printDetails.buyContactNumber }}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div style="height: 16px"></div>
|
|
|
<div style="border: 1px solid black">
|
|
|
<div style="display: flex; width: 100%">
|
|
|
- <div style="width: 33%; border-bottom: 1px solid black; border-right: 1px solid black">
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ width: 33%;
|
|
|
+ border-bottom: 1px solid black;
|
|
|
+ border-right: 1px solid black;
|
|
|
+ "
|
|
|
+ >
|
|
|
<div style="color: #409eff">COUNTRY OF ORIGIN:</div>
|
|
|
<div>{{ printDetails.sellCountryName }}</div>
|
|
|
</div>
|
|
|
- <div style="width: 34%; border-bottom: 1px solid black; border-right: 1px solid black">
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ width: 34%;
|
|
|
+ border-bottom: 1px solid black;
|
|
|
+ border-right: 1px solid black;
|
|
|
+ "
|
|
|
+ >
|
|
|
<div style="color: #409eff">COUNTRY OF DESTINATION:</div>
|
|
|
<div>{{ printDetails.buyCountryName }}</div>
|
|
|
</div>
|
|
@@ -84,13 +135,25 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div style="display: flex; width: 100%">
|
|
|
- <div style="width: 33%; border-bottom: 1px solid black; border-right: 1px solid black">
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ width: 33%;
|
|
|
+ border-bottom: 1px solid black;
|
|
|
+ border-right: 1px solid black;
|
|
|
+ "
|
|
|
+ >
|
|
|
<div style="color: #409eff">TERMS OF DELIVERY:</div>
|
|
|
<div>
|
|
|
{{ dictValueLabel(printDetails.tradeMethods, tradeMethods) }}
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div style="width: 34%; border-bottom: 1px solid black; border-right: 1px solid black">
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ width: 34%;
|
|
|
+ border-bottom: 1px solid black;
|
|
|
+ border-right: 1px solid black;
|
|
|
+ "
|
|
|
+ >
|
|
|
<div style="color: #409eff">CURRENCY:</div>
|
|
|
<div>
|
|
|
{{ dictValueLabel(printDetails.currency, accountCurrency) }}
|
|
@@ -99,7 +162,9 @@
|
|
|
<div style="width: 33%; border-bottom: 1px solid black">
|
|
|
<div style="color: #409eff">EXPORT BY/VIA:</div>
|
|
|
<div>
|
|
|
- {{ dictValueLabel(printDetails.transportMethod, shippingMethod) }}
|
|
|
+ {{
|
|
|
+ dictValueLabel(printDetails.transportMethod, shippingMethod)
|
|
|
+ }}
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -115,19 +180,47 @@
|
|
|
</div>
|
|
|
<div style="height: 16px"></div>
|
|
|
<div class="baseRow" style="display: flex; color: #409eff">
|
|
|
- <div class="contentRow" style="width: 50px; text-align: center">NO.</div>
|
|
|
- <div class="contentRow" style="width: calc(100% - 450px); text-align: center">COMMODITY, SPECIFICATION</div>
|
|
|
- <div class="contentRow" style="width: 100px; text-align: center">UNIT</div>
|
|
|
- <div class="contentRow" style="width: 100px; text-align: center">QUANTITY</div>
|
|
|
- <div class="contentRow" style="width: 100px; text-align: center">UNIT PRICE</div>
|
|
|
- <div class="contentRow" style="width: 100px; text-align: center">TOTAL PRICE</div>
|
|
|
+ <div class="contentRow" style="width: 50px; text-align: center">
|
|
|
+ NO.
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="contentRow"
|
|
|
+ style="width: calc(100% - 450px); text-align: center"
|
|
|
+ >
|
|
|
+ COMMODITY, SPECIFICATION
|
|
|
+ </div>
|
|
|
+ <div class="contentRow" style="width: 100px; text-align: center">
|
|
|
+ UNIT
|
|
|
+ </div>
|
|
|
+ <div class="contentRow" style="width: 100px; text-align: center">
|
|
|
+ QUANTITY
|
|
|
+ </div>
|
|
|
+ <div class="contentRow" style="width: 100px; text-align: center">
|
|
|
+ UNIT PRICE
|
|
|
+ </div>
|
|
|
+ <div class="contentRow" style="width: 100px; text-align: center">
|
|
|
+ TOTAL PRICE
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- <div v-if="printDetails.quotationProductList && printDetails.quotationProductList.length > 0">
|
|
|
- <div class="baseRow" style="display: flex" v-for="(item, index) in printDetails.quotationProductList" :key="item.productId">
|
|
|
+ <div
|
|
|
+ v-if="
|
|
|
+ printDetails.quotationProductList &&
|
|
|
+ printDetails.quotationProductList.length > 0
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="baseRow"
|
|
|
+ style="display: flex"
|
|
|
+ v-for="(item, index) in printDetails.quotationProductList"
|
|
|
+ :key="item.productId"
|
|
|
+ >
|
|
|
<div class="contentRow" style="width: 50px; text-align: center">
|
|
|
{{ index + 1 }}
|
|
|
</div>
|
|
|
- <div class="contentRow" style="width: calc(100% - 450px); text-align: center">
|
|
|
+ <div
|
|
|
+ class="contentRow"
|
|
|
+ style="width: calc(100% - 450px); text-align: center"
|
|
|
+ >
|
|
|
{{ item.productName }}
|
|
|
</div>
|
|
|
<div class="contentRow" style="width: 100px; text-align: center">
|
|
@@ -145,33 +238,73 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="baseRow" style="display: flex; color: #409eff">
|
|
|
- <div class="contentRow" style="width: calc(100% - 400px); text-align: center">SUBTOTAL:</div>
|
|
|
- <div class="contentRow" style="width: 100px; text-align: center"></div>
|
|
|
+ <div
|
|
|
+ class="contentRow"
|
|
|
+ style="width: calc(100% - 400px); text-align: center"
|
|
|
+ >
|
|
|
+ SUBTOTAL:
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="contentRow"
|
|
|
+ style="width: 100px; text-align: center"
|
|
|
+ ></div>
|
|
|
<div class="contentRow" style="width: 100px; text-align: center">
|
|
|
{{ statistics("quantity", 0) }}
|
|
|
</div>
|
|
|
- <div class="contentRow" style="width: 100px; text-align: center"></div>
|
|
|
+ <div
|
|
|
+ class="contentRow"
|
|
|
+ style="width: 100px; text-align: center"
|
|
|
+ ></div>
|
|
|
<div class="contentRow" style="width: 100px; text-align: center">
|
|
|
{{ statistics("amount", 2) }}
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div v-if="printDetails.quotationPayList && printDetails.quotationPayList.length > 0">
|
|
|
- <div class="baseRow" style="display: flex" v-for="(item, index) in printDetails.quotationPayList" :key="index">
|
|
|
- <div class="contentRow" style="width: calc(100% - 100px); text-align: right; color: #409eff">{{ item.payName }}:</div>
|
|
|
+ <div
|
|
|
+ v-if="
|
|
|
+ printDetails.quotationPayList &&
|
|
|
+ printDetails.quotationPayList.length > 0
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="baseRow"
|
|
|
+ style="display: flex"
|
|
|
+ v-for="(item, index) in printDetails.quotationPayList"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="contentRow"
|
|
|
+ style="
|
|
|
+ width: calc(100% - 100px);
|
|
|
+ text-align: right;
|
|
|
+ color: #409eff;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ {{ item.payName }}:
|
|
|
+ </div>
|
|
|
<div class="contentRow" style="width: 100px; text-align: center">
|
|
|
{{ item.amount }}
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="baseRow" style="display: flex">
|
|
|
- <div class="contentRow" style="width: calc(100% - 100px); text-align: right; color: #409eff">TOTAL PRICE:</div>
|
|
|
+ <div
|
|
|
+ class="contentRow"
|
|
|
+ style="width: calc(100% - 100px); text-align: right; color: #409eff"
|
|
|
+ >
|
|
|
+ TOTAL PRICE:
|
|
|
+ </div>
|
|
|
<div class="contentRow" style="width: 100px; text-align: center">
|
|
|
{{ getAllMoney(statistics("amount", 2)) }}
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="baseRow" style="display: flex; border-bottom: 1px solid black">
|
|
|
+ <div
|
|
|
+ class="baseRow"
|
|
|
+ style="display: flex; border-bottom: 1px solid black"
|
|
|
+ >
|
|
|
<div class="contentRow" style="width: 100%">
|
|
|
- {{ translateIntoEnglish(printDetails.amount, printDetails.currency) }}
|
|
|
+ {{
|
|
|
+ translateIntoEnglish(printDetails.amount, printDetails.currency)
|
|
|
+ }}
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- <div style="height: 16px"></div>
|
|
@@ -203,20 +336,30 @@
|
|
|
<div style="width: 50%">
|
|
|
<div style="color: #409eff">CONFIRMED BY VENDOR:</div>
|
|
|
<div>
|
|
|
- {{ getLabel(printDetails.sellCorporationId, corporationList, "nameEn") }}
|
|
|
+ {{
|
|
|
+ getLabel(
|
|
|
+ printDetails.sellCorporationId,
|
|
|
+ corporationList,
|
|
|
+ "nameEn"
|
|
|
+ )
|
|
|
+ }}
|
|
|
</div>
|
|
|
</div>
|
|
|
<div style="width: 50%">
|
|
|
<div style="color: #409eff">CONFIRMED BY BUYER:</div>
|
|
|
<div>
|
|
|
- {{ getLabel(printDetails.buyCorporationId, customerList, "name") }}
|
|
|
+ {{
|
|
|
+ getLabel(printDetails.buyCorporationId, customerList, "name")
|
|
|
+ }}
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<template #footer>
|
|
|
<el-button @click="openPrint = false" size="large">取消</el-button>
|
|
|
- <el-button type="primary" @click="clickDownload()" size="large">下载PDF</el-button>
|
|
|
+ <el-button type="primary" @click="clickDownload()" size="large"
|
|
|
+ >下载PDF</el-button
|
|
|
+ >
|
|
|
</template>
|
|
|
</el-dialog>
|
|
|
</div>
|
|
@@ -386,14 +529,16 @@ const config = computed(() => {
|
|
|
];
|
|
|
});
|
|
|
const getDict = () => {
|
|
|
- proxy.post("/saleQuotation/page", { pageNum: 1, pageSize: 999 }).then((res) => {
|
|
|
- accountList.value = res.rows.map((item) => {
|
|
|
- return {
|
|
|
- label: item.alias,
|
|
|
- value: item.id,
|
|
|
- };
|
|
|
+ proxy
|
|
|
+ .post("/saleQuotation/page", { pageNum: 1, pageSize: 999 })
|
|
|
+ .then((res) => {
|
|
|
+ accountList.value = res.rows.map((item) => {
|
|
|
+ return {
|
|
|
+ label: item.alias,
|
|
|
+ value: item.id,
|
|
|
+ };
|
|
|
+ });
|
|
|
});
|
|
|
- });
|
|
|
proxy.post("/corporation/page", { pageNum: 1, pageSize: 999 }).then((res) => {
|
|
|
corporationList.value = res.rows.map((item) => {
|
|
|
return {
|
|
@@ -412,20 +557,22 @@ const getDict = () => {
|
|
|
};
|
|
|
});
|
|
|
});
|
|
|
- proxy.getDictOne(["trade_mode", "account_currency", "shipping_method"]).then((res) => {
|
|
|
- tradeMethods.value = res["trade_mode"].map((x) => ({
|
|
|
- label: x.dictValue,
|
|
|
- value: x.dictKey,
|
|
|
- }));
|
|
|
- accountCurrency.value = res["account_currency"].map((x) => ({
|
|
|
- label: x.dictValue,
|
|
|
- value: x.dictKey,
|
|
|
- }));
|
|
|
- shippingMethod.value = res["shipping_method"].map((x) => ({
|
|
|
- label: x.dictValue,
|
|
|
- value: x.dictKey,
|
|
|
- }));
|
|
|
- });
|
|
|
+ proxy
|
|
|
+ .getDictOne(["trade_mode", "account_currency", "shipping_method"])
|
|
|
+ .then((res) => {
|
|
|
+ tradeMethods.value = res["trade_mode"].map((x) => ({
|
|
|
+ label: x.dictValue,
|
|
|
+ value: x.dictKey,
|
|
|
+ }));
|
|
|
+ accountCurrency.value = res["account_currency"].map((x) => ({
|
|
|
+ label: x.dictValue,
|
|
|
+ value: x.dictKey,
|
|
|
+ }));
|
|
|
+ shippingMethod.value = res["shipping_method"].map((x) => ({
|
|
|
+ label: x.dictValue,
|
|
|
+ value: x.dictKey,
|
|
|
+ }));
|
|
|
+ });
|
|
|
};
|
|
|
const getList = async (req) => {
|
|
|
sourceList.value.pagination = { ...sourceList.value.pagination, ...req };
|
|
@@ -477,7 +624,10 @@ const clickDownload = () => {
|
|
|
};
|
|
|
const statistics = (label, index) => {
|
|
|
let num = 0;
|
|
|
- if (printDetails.value.quotationProductList && printDetails.value.quotationProductList.length > 0) {
|
|
|
+ if (
|
|
|
+ printDetails.value.quotationProductList &&
|
|
|
+ printDetails.value.quotationProductList.length > 0
|
|
|
+ ) {
|
|
|
printDetails.value.quotationProductList.map((item) => {
|
|
|
if (item[label]) {
|
|
|
num = parseFloat(Number(num) + Number(item[label])).toFixed(index);
|
|
@@ -498,7 +648,10 @@ const getLabel = (key, list, label) => {
|
|
|
};
|
|
|
const getAllMoney = (num) => {
|
|
|
let money = num;
|
|
|
- if (printDetails.value.quotationPayList && printDetails.value.quotationPayList.length > 0) {
|
|
|
+ if (
|
|
|
+ printDetails.value.quotationPayList &&
|
|
|
+ printDetails.value.quotationPayList.length > 0
|
|
|
+ ) {
|
|
|
printDetails.value.quotationPayList.map((item) => {
|
|
|
if (item.amount) {
|
|
|
money = parseFloat(Number(money) + Number(item.amount)).toFixed(2);
|