|
@@ -0,0 +1,303 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <div id="pdfDom" ref="pdfDom" style="width: 840px">
|
|
|
+ <div style="display: flex; align-items: center">
|
|
|
+ <div>
|
|
|
+ <img
|
|
|
+ :src="pdfData.companyPic"
|
|
|
+ alt=""
|
|
|
+ fit="scale-down"
|
|
|
+ style="height: 60px; width: 60px"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div style="padding: 10px 30px" class="center-class">
|
|
|
+ <div
|
|
|
+ style="font-size: 16px; color: rgb(132, 151, 176); font-weight: 700"
|
|
|
+ >
|
|
|
+ {{ pdfData.buyCorporationName }}
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ Add:
|
|
|
+ {{ pdfData.buyAddress }} , {{ pdfData.buyCityName }} ,
|
|
|
+ {{ pdfData.buyProvinceName }} , {{ pdfData.buyCountryName }} ,
|
|
|
+ {{ pdfData.buyPostalCode }}
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ TEL: {{ pdfData.buyContactNumber }}
|
|
|
+ <span style="margin: 0 10px">FAX:0591-38165700</span>
|
|
|
+ WEB:https://www.bridgestylefurnishings.com/
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ style="margin-top: 30px; font-size: 16px; font-weight: 700"
|
|
|
+ class="center-class"
|
|
|
+ >
|
|
|
+ 采购合同
|
|
|
+ </div>
|
|
|
+ <div style="margin: 10px 0px 20px 0px" class="center-class">
|
|
|
+ {{ pdfData.code }}
|
|
|
+ </div>
|
|
|
+ <div style="display: flex; justify-content: space-between">
|
|
|
+ <div>
|
|
|
+ 甲方: <br />
|
|
|
+ 公司名称:{{ pdfData.buyCorporationName }}<br />
|
|
|
+ 联系人:{{ pdfData.buyContactName }} <br />
|
|
|
+ 电话:{{ pdfData.buyContactNumber }}
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ 乙方: <br />
|
|
|
+ 公司名称:{{ pdfData.sellCorporationName }} <br />
|
|
|
+ 联系人:{{ pdfData.sellContactName }}<br />
|
|
|
+ 电话:{{ pdfData.sellContactNumber }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <table border="1" style="width: 100%" class="table">
|
|
|
+ <tr>
|
|
|
+ <td style="width: 15%" class="center-class">产品图片</td>
|
|
|
+ <td style="width: 20%" class="center-class">LOGO图</td>
|
|
|
+ <td style="width: 15%" class="center-class">产品名称</td>
|
|
|
+ <td style="width: 13%" class="center-class">尺寸cm</td>
|
|
|
+ <td style="width: 12%" class="center-class">数量</td>
|
|
|
+ <td style="width: 13%" class="center-class">单价</td>
|
|
|
+ <td style="width: 12%" class="center-class">总价</td>
|
|
|
+ </tr>
|
|
|
+ <template
|
|
|
+ v-if="
|
|
|
+ pdfData.ehsdPurchaseProductList &&
|
|
|
+ pdfData.ehsdPurchaseProductList.length > 0
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <tr v-for="item in pdfData.ehsdPurchaseProductList" :key="item.id">
|
|
|
+ <td style="width: 15%" class="center-class">
|
|
|
+ <img
|
|
|
+ :src="item.fileList[0].fileUrl"
|
|
|
+ alt=""
|
|
|
+ fit="scale-down"
|
|
|
+ style="height: 60px; width: 60px"
|
|
|
+ v-if="item.fileList && item.fileList.length > 0"
|
|
|
+ />
|
|
|
+ </td>
|
|
|
+ <td style="width: 20%" class="center-class"></td>
|
|
|
+ <td style="width: 15%" class="center-class">
|
|
|
+ {{ item.productName }}
|
|
|
+ </td>
|
|
|
+ <td style="width: 13%" class="center-class">
|
|
|
+ {{ item.productModel }}
|
|
|
+ </td>
|
|
|
+ <td style="width: 12%" class="center-class">
|
|
|
+ {{ item.quantity }}
|
|
|
+ </td>
|
|
|
+ <td style="width: 13%" class="center-class">
|
|
|
+ {{ pdfData.currency }} {{ item.price }}
|
|
|
+ </td>
|
|
|
+ <td style="width: 12%" class="center-class">
|
|
|
+ {{ pdfData.currency }} {{ moneyFormat(item.amount, 2) }}
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <tr>
|
|
|
+ <td colspan="6">合计:</td>
|
|
|
+ <td class="center-class">
|
|
|
+ {{ pdfData.currency }} {{ moneyFormat(pdfData.amount, 2) }}
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td colspan="7">大写: {{ NumberToChinese(pdfData.amount) }}</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td>乙方收款账户:</td>
|
|
|
+ <td colspan="6">
|
|
|
+ 银行: {{ pdfData.openingBank }}<br />
|
|
|
+ 账户名: {{ pdfData.openingName }}<br />
|
|
|
+ 联系人: {{ pdfData.contactPerson }}<br />
|
|
|
+ 账户: {{ pdfData.accountOpening }}
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td>收货地址:</td>
|
|
|
+ <td colspan="6">
|
|
|
+ {{ pdfData.buyProvinceName }} , {{ pdfData.buyCityName }} ,
|
|
|
+ {{ pdfData.buyAddress }} ,
|
|
|
+ {{ pdfData.buyPostalCode }}
|
|
|
+ <br />
|
|
|
+ {{ pdfData.buyContactName }} {{ pdfData.buyContactNumber }}
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td>交货时间:</td>
|
|
|
+ <td colspan="6">{{ pdfData.deliveryTime }}</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td>付款方式:</td>
|
|
|
+ <td colspan="6">
|
|
|
+ {{ dictValueLabel(pdfData.paymentMethod, fundsPaymentMethod) }}
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td colspan="7">
|
|
|
+ <div v-html="getHtml(pdfData.remark)"></div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td colspan="3">
|
|
|
+ 甲方:<br />
|
|
|
+ {{ pdfData.buyCorporationName }}
|
|
|
+ </td>
|
|
|
+ <td colspan="4">
|
|
|
+ 乙方:<br />
|
|
|
+ {{ pdfData.sellCorporationName }}
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+ <div
|
|
|
+ v-if="
|
|
|
+ pdfData.ehsdPurchaseProductList &&
|
|
|
+ pdfData.ehsdPurchaseProductList.length > 0
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="border-class"
|
|
|
+ v-for="item in pdfData.ehsdPurchaseProductList"
|
|
|
+ :key="item.id"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ style="border-bottom: 1px solid #000; padding: 2px 5px"
|
|
|
+ class="center-class"
|
|
|
+ >
|
|
|
+ {{ item.productName }}
|
|
|
+ </div>
|
|
|
+ <div style="padding: 2px 5px; min-height: 22px">
|
|
|
+ <div v-html="getHtml(item.remark)"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 出货 -->
|
|
|
+ <div style="height: 20px"></div>
|
|
|
+ <table border="1" style="width: 100%" class="table">
|
|
|
+ <tr>
|
|
|
+ <td class="center-class">出货时间</td>
|
|
|
+ <td class="center-class">产品名称</td>
|
|
|
+ <td class="center-class">出货数量</td>
|
|
|
+ </tr>
|
|
|
+ <template
|
|
|
+ v-if="
|
|
|
+ pdfData.packDetailProductList &&
|
|
|
+ pdfData.packDetailProductList.length > 0
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <tr v-for="item in pdfData.packDetailProductList" :key="item.id">
|
|
|
+ <td>{{ item.shipmentTime }}</td>
|
|
|
+ <td>{{ item.productName }}</td>
|
|
|
+ <td>{{ item.quantity }}</td>
|
|
|
+ </tr>
|
|
|
+ </template>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { NumberToChinese } from "@/utils/util.js";
|
|
|
+const { proxy } = getCurrentInstance();
|
|
|
+const pdfData = ref({});
|
|
|
+const props = defineProps({
|
|
|
+ rowData: Object,
|
|
|
+});
|
|
|
+const fundsPaymentMethod = ref([]);
|
|
|
+proxy.getDictOne(["unit", "funds_payment_method"]).then((res) => {
|
|
|
+ fundsPaymentMethod.value = res["funds_payment_method"].map((x) => ({
|
|
|
+ label: x.dictValue,
|
|
|
+ value: x.dictKey,
|
|
|
+ }));
|
|
|
+});
|
|
|
+
|
|
|
+const getHtml = (str) => {
|
|
|
+ if (str) {
|
|
|
+ let newStr = str.replace(/<p\b/gi, "<div"); // 使用正则表达式替换<p>为<div
|
|
|
+ return newStr.replace(/<\/p>/gi, "</div>"); // 使用正则表达式替换</p>为</div>
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+const handlePrintPdf = (row) => {
|
|
|
+ proxy.post("/ehsdPurchase/detail", { id: row.id }).then((res) => {
|
|
|
+ pdfData.value = res;
|
|
|
+ // 拿去多公司配置的logo图
|
|
|
+ if (pdfData.value.buyCorporationId) {
|
|
|
+ proxy
|
|
|
+ .post("/fileInfo/getList", {
|
|
|
+ businessIdList: [pdfData.value.buyCorporationId],
|
|
|
+ fileType: 1,
|
|
|
+ })
|
|
|
+ .then((fileObj) => {
|
|
|
+ pdfData.value.companyPic =
|
|
|
+ fileObj[pdfData.value.buyCorporationId][0].fileUrl;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ // 拿取产品图
|
|
|
+ if (
|
|
|
+ pdfData.value.ehsdPurchaseProductList &&
|
|
|
+ pdfData.value.ehsdPurchaseProductList.length > 0
|
|
|
+ ) {
|
|
|
+ let arr = pdfData.value.ehsdPurchaseProductList.map((x) => x.productId);
|
|
|
+ proxy
|
|
|
+ .post("/fileInfo/getList", {
|
|
|
+ businessIdList: arr,
|
|
|
+ })
|
|
|
+ .then((fileObj) => {
|
|
|
+ for (
|
|
|
+ let i = 0;
|
|
|
+ i < pdfData.value.ehsdPurchaseProductList.length;
|
|
|
+ i++
|
|
|
+ ) {
|
|
|
+ const e = pdfData.value.ehsdPurchaseProductList[i];
|
|
|
+ for (const key in fileObj) {
|
|
|
+ if (e.productId === key) {
|
|
|
+ e.fileList = fileObj[key];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
+if (props.rowData && props.rowData.id) {
|
|
|
+ handlePrintPdf(props.rowData);
|
|
|
+}
|
|
|
+
|
|
|
+watch(
|
|
|
+ () => props.rowData.id,
|
|
|
+ (val) => {
|
|
|
+ if (props.rowData && props.rowData.id) {
|
|
|
+ handlePrintPdf(props.rowData);
|
|
|
+ }
|
|
|
+ }
|
|
|
+);
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+#pdfDom {
|
|
|
+ font-size: 13px;
|
|
|
+ padding: 30px 60px;
|
|
|
+}
|
|
|
+.center-class {
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+.border-class {
|
|
|
+ margin-top: 20px;
|
|
|
+ border: 1px solid #000;
|
|
|
+}
|
|
|
+.table {
|
|
|
+ border-collapse: collapse;
|
|
|
+ border-spacing: 0;
|
|
|
+ td {
|
|
|
+ padding: 2px 5px;
|
|
|
+ text-align: left;
|
|
|
+ }
|
|
|
+ .center-class {
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|