|
@@ -1,289 +1,398 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
- <div id="pdfDom" ref="pdfDom" style="width: 776px">
|
|
|
- <div style="border: 1px solid #000; border-collapse: collapse">
|
|
|
- <div style="text-align: right; padding: 10px 10px 0 0">
|
|
|
- 合同号:{{ pdfData.code }}
|
|
|
- </div>
|
|
|
- <div class="title">购销合同</div>
|
|
|
- <div style="display: flex">
|
|
|
- <div style="display: flex; width: 50%" class="padding-10px">
|
|
|
- <div style="width: 60px">买方:</div>
|
|
|
- <div style="width: calc(100% - 60px)">
|
|
|
- <div>福建宏星电子科技有限公司</div>
|
|
|
- <div class="margin-top-5px">
|
|
|
- 福建省福州市鼓楼区软件大道89号福州软件园A区28号楼五层
|
|
|
- </div>
|
|
|
+ <div id="pdfDom" ref="pdfDom" style="padding: 0px 20px; text-align: center;font-size:12px;color:#333333" v-loading="loading">
|
|
|
+ <div class="title">
|
|
|
+ 福建三梵体育用品实业有限公司
|
|
|
+ </div>
|
|
|
+ <div class="title-info">
|
|
|
+ <div class="vertical-bar"></div>
|
|
|
+ <div class="content">采购订单</div>
|
|
|
+ </div>
|
|
|
+ <div style="display:flex;margin-bottom:0px; font-weight: 600;">
|
|
|
+ <div style="width:50%;padding-right:20px">
|
|
|
+ <div class="row">
|
|
|
+ <div class="left">
|
|
|
+ 供应商:
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+ {{pdfData.sellCorporationName}}
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div style="display: flex; width: 50%" class="padding-10px">
|
|
|
- <div style="width: 60px">卖方:</div>
|
|
|
- <div style="width: calc(100% - 60px)">
|
|
|
- {{ pdfData.supplyName }}
|
|
|
+ <div class="row">
|
|
|
+ <div class="left">
|
|
|
+ 供应商名称:
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+ {{pdfData.sellCorporationName}}
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div style="display: flex" class="margin-top-5px">
|
|
|
- <div style="display: flex; width: 50%" class="padding-10px">
|
|
|
- <div style="width: 60px">经手人:</div>
|
|
|
- <div style="width: calc(100% - 60px)">
|
|
|
- {{ pdfData.purchaseName }}
|
|
|
+ <div class="row">
|
|
|
+ <div class="left">
|
|
|
+ 联系人:
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+ {{pdfData.sellContactName}}
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div style="display: flex; width: 50%" class="padding-10px">
|
|
|
- <div style="width: 60px">经手人:</div>
|
|
|
- <div style="width: calc(100% - 60px)">
|
|
|
- {{ pdfData.contactPerson }}
|
|
|
+ <div class="row">
|
|
|
+ <div class="left">
|
|
|
+ 联系电话:
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+ {{pdfData.sellContactNumber}}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="row">
|
|
|
+ <div class="left">
|
|
|
+ 传真:
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+ {{pdfData.sellCorporationFax}}
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="padding-10px margin-top-5px">
|
|
|
- 买卖双方经协商,一致同意签订以下合同
|
|
|
- </div>
|
|
|
- <div class="padding-10px margin-top-5px" style="padding-bottom: 10px">
|
|
|
- 货物名称、规格型号、单位、数量、单价及金额:
|
|
|
+ <div style="width:50%">
|
|
|
+ <div class="row">
|
|
|
+ <div class="left">
|
|
|
+ 订单编号:
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+ {{pdfData.code}}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="row">
|
|
|
+ <div class="left">
|
|
|
+ 下单日期:
|
|
|
+ </div>
|
|
|
+ <div v-if="pdfData.createTime" class="right">
|
|
|
+ {{pdfData.createTime.substr(0,10)}} {{calculationWeek(pdfData.createTime)}}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="row">
|
|
|
+ <div class="left">
|
|
|
+ 付款方式:
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+ {{dictKeyValue(pdfData.paymentMethod,fundsPaymentMethod)}}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="row">
|
|
|
+ <div class="left">
|
|
|
+ 采购员/联系电话:
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+ {{pdfData.createUserName}} / {{pdfData.createUserPhone}}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="row">
|
|
|
+ <div class="left">
|
|
|
+ 送货地址:
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+ <span v-if="pdfData.sellCountryName">{{pdfData.sellCountryName}},</span>
|
|
|
+ <span v-if="pdfData.sellProvinceName">{{pdfData.sellProvinceName}},</span>
|
|
|
+ <span v-if="pdfData.sellCityName">{{pdfData.sellCityName}},</span>
|
|
|
+ <span v-if="pdfData.buyDetailedAddress">{{pdfData.buyDetailedAddress}}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
</div>
|
|
|
- <table border="1" style="width: 100%" class="table">
|
|
|
- <tr>
|
|
|
- <td style="width: 70px">序号</td>
|
|
|
- <td>品名</td>
|
|
|
- <td>规格型号</td>
|
|
|
- <td style="width: 60px">单位</td>
|
|
|
- <td style="width: 60px">数量</td>
|
|
|
- <td style="width: 100px">单价</td>
|
|
|
- <td style="width: 100px">金额</td>
|
|
|
- </tr>
|
|
|
- <tr v-for="(row, index) in pdfData.purchaseDetailList" :key="row.id">
|
|
|
- <td style="width: 70px">{{ index + 1 }}</td>
|
|
|
- <td>{{ row.productName }}</td>
|
|
|
- <td>{{ row.productSpec }}</td>
|
|
|
- <td style="width: 60px">{{ row.productUnitName }}</td>
|
|
|
- <td style="width: 60px">{{ row.count }}</td>
|
|
|
- <td style="width: 100px">
|
|
|
- <span v-if="pdfData.currency">{{ pdfData.currency }}</span
|
|
|
- >{{ row.price }}
|
|
|
- </td>
|
|
|
- <td style="width: 100px">
|
|
|
- <span v-if="pdfData.currency">{{ pdfData.currency }}</span
|
|
|
- >{{ row.amount }}
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td colspan="4" style="text-align: right">其他收费项目</td>
|
|
|
- <td></td>
|
|
|
- <td></td>
|
|
|
- <td>
|
|
|
- <span v-if="pdfData.currency">{{ pdfData.currency }}</span
|
|
|
- >{{ pdfData.otherMoney }}
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td colspan="4" style="text-align: right">合计</td>
|
|
|
- <td>{{ pdfData.countTotal }}</td>
|
|
|
- <td></td>
|
|
|
- <td>
|
|
|
- <span v-if="pdfData.currency">{{ pdfData.currency }}</span
|
|
|
- >{{ pdfData.amount }}
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td colspan="7" style="text-align: left">
|
|
|
- 合计人民币金额(大写):{{ pdfData.moneyChinese }}
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td>交货地点</td>
|
|
|
- <td colspan="6" style="text-align: left">
|
|
|
- 福建省福州市鼓楼区软件大道89号福州软件园A区28号楼五层
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <table border="1" style="width: 100%" class="table">
|
|
|
+ <tr>
|
|
|
+ <td style="width:7%">序号</td>
|
|
|
+ <!-- <td style="width:12%">销售订单号</td> -->
|
|
|
+ <td style="width:10%">物料编码</td>
|
|
|
+ <td style="width:28%">物料名称</td>
|
|
|
+ <td style="width:10%">规格型号</td>
|
|
|
+ <td style="width:7%"> 颜色</td>
|
|
|
+ <td style="width:7%">单位</td>
|
|
|
+ <td style="width:7%">数量</td>
|
|
|
+ <td style="width:7%">单价</td>
|
|
|
+ <td style="width:7%">金额</td>
|
|
|
+ <td style="width:10%">备注</td>
|
|
|
+ </tr>
|
|
|
+ <tr v-if="pdfData.purchaseProductList && pdfData.purchaseProductList.length > 0" v-for="(item, index) in pdfData.purchaseProductList"
|
|
|
+ :key="item.id">
|
|
|
+ <td>{{index+1}}</td>
|
|
|
+ <!-- <td>{{pdfData.code}}</td> -->
|
|
|
+ <td>{{item.productCode}}</td>
|
|
|
+ <td>{{item.productName}}</td>
|
|
|
+ <td>{{item.productLength }}*{{item.productWidth}}*{{item.productHeight}}</td>
|
|
|
+ <!-- <td>{{dictKeyValue(item.frontalTexture,frontLinesData)}}</td> -->
|
|
|
+ <td>{{item.productColor}}</td>
|
|
|
+ <td>{{dictKeyValue(item.productUnit,materialUnitData)}}</td>
|
|
|
+ <td>{{moneyFormat(item.quantity)}}</td>
|
|
|
+ <td>{{moneyFormat(item.price)}}</td>
|
|
|
+ <td>{{moneyFormat(item.amount)}}</td>
|
|
|
+ <td>{{item.remark}}</td>
|
|
|
+ </tr>
|
|
|
+ <template v-if="
|
|
|
+ pdfData.purchaseProjectList &&
|
|
|
+ pdfData.purchaseProjectList.length > 0
|
|
|
+ ">
|
|
|
+ <tr v-for="(item, index) in pdfData.purchaseProjectList" :key="item.id">
|
|
|
+ <td colspan="8" style="text-align: right">
|
|
|
+ {{ item.payName }}:
|
|
|
</td>
|
|
|
- </tr>
|
|
|
- <!-- <tr>
|
|
|
- <td>交货时间:</td>
|
|
|
- <td colspan="6" style="text-align: left"></td>
|
|
|
- </tr> -->
|
|
|
- <tr>
|
|
|
- <td>保修期</td>
|
|
|
- <td colspan="6" style="text-align: left">一年</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td colspan="7" style="text-align: left; padding: 10px">
|
|
|
- <div>一、交货地点:福州软件园A区28座5层。</div>
|
|
|
- <div class="margin-top-5px">二、运输方式及运费:买方承担。</div>
|
|
|
- <div class="margin-top-5px">
|
|
|
- 三、质量要求:样品品质、型号、规格、数量如同买方确认上表规格所示,不符合则由卖方承担责任。
|
|
|
- </div>
|
|
|
- <div class="margin-top-5px">四、交货时间:2023年4月13日。</div>
|
|
|
- <div class="margin-top-5px">五、付款方式:银行转账。</div>
|
|
|
- <div class="margin-top-5px">六、保修期:一年。</div>
|
|
|
- <div class="margin-top-5px">
|
|
|
- 七、本合同经买卖双方签字盖章后生效,传真件有效。
|
|
|
- </div>
|
|
|
- <div class="margin-top-5px">
|
|
|
- 八、解决合同纠纷:原双方另有约定外,均按《中华人民共和国合同法》有关规定处理。
|
|
|
- </div>
|
|
|
- <div class="margin-top-5px">九、其他约定事项:友好解决。</div>
|
|
|
+ <td colspan="3">
|
|
|
+ {{ moneyFormat(item.amount, 2) }}
|
|
|
</td>
|
|
|
</tr>
|
|
|
- </table>
|
|
|
- <div style="display: flex">
|
|
|
- <div style="width: 50%; padding: 10px">
|
|
|
- <div>买方:</div>
|
|
|
- <div class="margin-top-5px">单位名称:福建宏星电子科技有限公司</div>
|
|
|
- <div class="margin-top-5px">
|
|
|
- 地址:福建省福州市鼓楼区软件大道89号福州软件园A区28号楼五层
|
|
|
- </div>
|
|
|
- <div class="margin-top-5px">电话:</div>
|
|
|
- <div class="margin-top-5px">传真:</div>
|
|
|
- <!-- <div style="opacity: 0.1" class="margin-top-5px">|</div> -->
|
|
|
- <div class="margin-top-5px">代表人签字:</div>
|
|
|
+ </template>
|
|
|
+ <tr>
|
|
|
+ <td colspan="8" style="text-align: right">
|
|
|
+ 合同总金额:
|
|
|
+ </td>
|
|
|
+ <td colspan="3">
|
|
|
+ {{ moneyFormat(pdfData.amount, 2) }}
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+ <div style="margin-top:20px;text-align:left">
|
|
|
+ <!-- <div v-html="getHtmlVal(pdfData.remark)">
|
|
|
+ </div> -->
|
|
|
+ <div v-html="pdfData.remark"></div>
|
|
|
+ </div>
|
|
|
+ <div style="display:flex;margin-top:40px">
|
|
|
+ <div style="width:50%">
|
|
|
+ <div class="rowOne">
|
|
|
+ <div class="left">
|
|
|
+ 供应商签字并盖章:
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="rowOne">
|
|
|
+ <div class="left">
|
|
|
+ 经办人:
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="rowOne">
|
|
|
+ <div class="left">
|
|
|
+ 主管:
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- <div style="width: 50%; padding: 10px">
|
|
|
- <div>卖方:</div>
|
|
|
- <div class="margin-top-5px">单位名称:{{ pdfData.supplyName }}</div>
|
|
|
- <div class="margin-top-5px">统一社会信用代码:</div>
|
|
|
- <div class="margin-top-5px">
|
|
|
- 开户银行:{{ pdfData.openingBank }}
|
|
|
- </div>
|
|
|
- <div class="margin-top-5px">帐号:{{ pdfData.accountOpening }}</div>
|
|
|
- <div class="margin-top-5px">
|
|
|
- 地址:<span
|
|
|
- v-if="
|
|
|
- pdfData.supplyAddress && pdfData.supplyAddress.countryName
|
|
|
- "
|
|
|
- >{{ pdfData.supplyAddress.countryName }}</span
|
|
|
- >
|
|
|
- <span
|
|
|
- v-if="
|
|
|
- pdfData.supplyAddress && pdfData.supplyAddress.provinceName
|
|
|
- "
|
|
|
- >,{{ pdfData.supplyAddress.provinceName }}</span
|
|
|
- >
|
|
|
- <span
|
|
|
- v-if="pdfData.supplyAddress && pdfData.supplyAddress.cityName"
|
|
|
- >,{{ pdfData.supplyAddress.cityName }}</span
|
|
|
- >
|
|
|
- <span
|
|
|
- v-if="pdfData.supplyAddress && pdfData.supplyAddress.areaDetail"
|
|
|
- >,{{ pdfData.supplyAddress.areaDetail }}</span
|
|
|
- >
|
|
|
- </div>
|
|
|
- <div class="margin-top-5px">电话:{{ pdfData.contactNumber }}</div>
|
|
|
- <div class="margin-top-5px">代表人签字:</div>
|
|
|
+ <div class="rowOne">
|
|
|
+ <div class="left">
|
|
|
+ 日期:
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div
|
|
|
- style="padding: 10px; text-align: right; border-top: 1px solid #000"
|
|
|
- >
|
|
|
- 签订日期:{{ pdfData.approvedDate }}
|
|
|
+ <div style="width:50%">
|
|
|
+ <div class="rowOne">
|
|
|
+ <div class="left">
|
|
|
+ 采购签字并盖章:
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="rowOne">
|
|
|
+ <div class="left">
|
|
|
+ 经办人:
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="rowOne">
|
|
|
+ <div class="left">
|
|
|
+ 主管:
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="rowOne">
|
|
|
+ <div class="left">
|
|
|
+ 日期:
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div style="text-align: center;margin-top:20px">
|
|
|
+ <el-button type="primary" v-print="printObj" size="default" v-debounce>打印</el-button>
|
|
|
+ <el-button type="primary" @click="clickDownload()" size="default" v-debounce>下载PDF</el-button>
|
|
|
+ <!-- <el-button type="primary" @click="exportExcel()" size="default" v-debounce>导出Excel</el-button> -->
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
import { NumberToChinese } from "@/utils/util.js";
|
|
|
+import { calculationWeek } from "@/utils/util.js";
|
|
|
+import $ from "jquery";
|
|
|
const { proxy } = getCurrentInstance();
|
|
|
const pdfData = ref({});
|
|
|
const props = defineProps({
|
|
|
rowData: Object,
|
|
|
});
|
|
|
-const productUnit = ref([]);
|
|
|
-proxy.getDictOne(["unit"]).then((res) => {
|
|
|
- productUnit.value = res["unit"].map((x) => ({
|
|
|
- label: x.dictValue,
|
|
|
- value: x.dictKey,
|
|
|
- }));
|
|
|
-});
|
|
|
-const handlePrintPdf = (row) => {
|
|
|
- proxy.post("/purchase/detail", { id: row.id }).then((res) => {
|
|
|
- proxy
|
|
|
- .post("/supplierInfo/detail", { id: res.supplyId })
|
|
|
- .then((supplyData) => {
|
|
|
- res.contactPerson = supplyData.contactPerson;
|
|
|
- res.contactNumber = supplyData.contactNumber;
|
|
|
- res.openingBank = supplyData.openingBank;
|
|
|
- res.accountOpening = supplyData.accountOpening;
|
|
|
- let countTotal = 0;
|
|
|
- let productMoney = 0;
|
|
|
- for (let i = 0; i < res.purchaseDetailList.length; i++) {
|
|
|
- const e = res.purchaseDetailList[i];
|
|
|
- e.productUnitName = proxy.dictValueLabel(
|
|
|
- e.productUnit,
|
|
|
- productUnit.value
|
|
|
- );
|
|
|
- countTotal += Number(e.count);
|
|
|
- productMoney += Number(e.amount);
|
|
|
- }
|
|
|
- res.countTotal = countTotal.toFixed(2);
|
|
|
- res.productMoney = productMoney.toFixed(2);
|
|
|
- res.otherMoney = (res.amount - res.productMoney).toFixed(2);
|
|
|
- res.moneyChinese = NumberToChinese(res.amount);
|
|
|
- res.supplyAddress = {
|
|
|
- countryName: supplyData.countryName,
|
|
|
- provinceName: supplyData.provinceName,
|
|
|
- cityName: supplyData.cityName,
|
|
|
- areaDetail: supplyData.areaDetail,
|
|
|
- };
|
|
|
- if (res.approvedDate) {
|
|
|
- res.approvedDate = res.approvedDate.slice(0, 10);
|
|
|
- }
|
|
|
- pdfData.value = res;
|
|
|
- });
|
|
|
+const materialUnitData = computed(
|
|
|
+ () => proxy.useUserStore().allDict["material_unit"]
|
|
|
+);
|
|
|
+const frontLinesData = computed(
|
|
|
+ () => proxy.useUserStore().allDict["front_lines"]
|
|
|
+);
|
|
|
+const fundsPaymentMethod = computed(
|
|
|
+ () => proxy.useUserStore().allDict["funds_payment_method"]
|
|
|
+);
|
|
|
+const loading = ref(false);
|
|
|
+const getPdfData = (query) => {
|
|
|
+ loading.value = true;
|
|
|
+ proxy.post("/ehsdPurchase/detail", query).then((res) => {
|
|
|
+ pdfData.value = res;
|
|
|
+ loading.value = false;
|
|
|
});
|
|
|
};
|
|
|
-
|
|
|
-if (props.rowData && props.rowData.id) {
|
|
|
- handlePrintPdf(props.rowData);
|
|
|
-}
|
|
|
+const productUnit = ref([]);
|
|
|
+const tradeMethods = ref([]);
|
|
|
+const getBalance = (val) => {
|
|
|
+ if (val) {
|
|
|
+ return proxy.moneyFormat(
|
|
|
+ parseFloat(pdfData.value.totalAmount * (val / 100)).toFixed(2),
|
|
|
+ 2
|
|
|
+ );
|
|
|
+ }
|
|
|
+};
|
|
|
+const getHtmlVal = (val) => {
|
|
|
+ if (val) {
|
|
|
+ return val.replace(/<p>/g, "<div>").replace(/<\/p>/g, "</div>");
|
|
|
+ }
|
|
|
+ return "";
|
|
|
+};
|
|
|
|
|
|
watch(
|
|
|
- () => props.rowData.id,
|
|
|
+ () => props.rowData,
|
|
|
(val) => {
|
|
|
- if (props.rowData && props.rowData.id) {
|
|
|
- handlePrintPdf(props.rowData);
|
|
|
+ if (props.rowData.id) {
|
|
|
+ getPdfData({ id: props.rowData.id });
|
|
|
}
|
|
|
+ },
|
|
|
+ {
|
|
|
+ immediate: true,
|
|
|
+ deep: true,
|
|
|
}
|
|
|
);
|
|
|
+
|
|
|
+const printObj = ref({
|
|
|
+ id: "pdfDom",
|
|
|
+ popTitle: "",
|
|
|
+ extraCss:
|
|
|
+ "https://cdn.bootcdn.net/ajax/libs/animate.css/4.1.1/animate.compat.css, https://cdn.bootcdn.net/ajax/libs/hover.css/2.3.1/css/hover-min.css",
|
|
|
+ extraHead: '<meta http-equiv="Content-Language"content="zh-cn"/>',
|
|
|
+});
|
|
|
+
|
|
|
+const clickDownload = () => {
|
|
|
+ proxy.getPdf("采购订单PDF文件");
|
|
|
+};
|
|
|
+
|
|
|
+const pdfDom = ref(null);
|
|
|
+const exportExcel = () => {
|
|
|
+ // pdfDom.value.exportExcel();
|
|
|
+ // isShowImg.value = false;
|
|
|
+ loading.value = true;
|
|
|
+ setTimeout(() => {
|
|
|
+ $("#pdfDom").table2excel({
|
|
|
+ exclude: ".noExl",
|
|
|
+ sheetName: `销售订单${pdfData.value.code}`,
|
|
|
+ filename: `销售订单${pdfData.value.code}`,
|
|
|
+ exclude_img: false,
|
|
|
+ exclude_links: false,
|
|
|
+ exclude_inputs: true,
|
|
|
+ });
|
|
|
+ // isShowImg.value = true;
|
|
|
+ loading.value = false;
|
|
|
+ }, 500);
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
-#pdfDom {
|
|
|
- font-size: 12px;
|
|
|
- color: #000000;
|
|
|
- padding: 60px 30px;
|
|
|
- .title {
|
|
|
- font-size: 16px;
|
|
|
- font-weight: 700;
|
|
|
- margin-top: 10px;
|
|
|
- margin-bottom: 20px;
|
|
|
- text-align: center;
|
|
|
+.title {
|
|
|
+ font-size: 28px;
|
|
|
+ // font-weight: 700;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+.title-info {
|
|
|
+ text-align: center;
|
|
|
+ width: 100%;
|
|
|
+ margin: 20px 0 50px 0;
|
|
|
+ .vertical-bar {
|
|
|
+ width: 6px;
|
|
|
+ height: 18px;
|
|
|
+ background-color: #f0ab00;
|
|
|
+ // background-color: #000;
|
|
|
+ margin-right: 9px;
|
|
|
+ display: inline-block;
|
|
|
}
|
|
|
- .table {
|
|
|
- // width: calc(100% + 2px) !important;
|
|
|
- border-collapse: collapse;
|
|
|
- border-spacing: 0;
|
|
|
- // margin-left: -1px;
|
|
|
- // margin-right: -1px;
|
|
|
-
|
|
|
- td {
|
|
|
- // text-align: center;
|
|
|
- padding: 5px 10px;
|
|
|
+ .content {
|
|
|
+ // font-weight: 600;
|
|
|
+ font-size: 32px;
|
|
|
+ color: #333333;
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+}
|
|
|
+.row {
|
|
|
+ display: flex;
|
|
|
+ // line-height: 28px;
|
|
|
+ .left {
|
|
|
+ width: 120px;
|
|
|
+ text-align: justify;
|
|
|
+ display: inline-block;
|
|
|
+ &::after {
|
|
|
+ content: "";
|
|
|
+ display: inline-block;
|
|
|
+ width: 100%;
|
|
|
}
|
|
|
- // tr td:last-child {
|
|
|
- // border-right: 0 !important;
|
|
|
- // }
|
|
|
}
|
|
|
- .flex-top-bottom {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- margin: 5px 0px;
|
|
|
+ .right {
|
|
|
+ width: calc(100% - 120px);
|
|
|
+ text-align: left;
|
|
|
+ line-height: 18px;
|
|
|
}
|
|
|
- .padding-10px {
|
|
|
- padding: 0px 10px;
|
|
|
+}
|
|
|
+.rowOne {
|
|
|
+ display: flex;
|
|
|
+ line-height: 32px;
|
|
|
+ .left {
|
|
|
+ width: 120px;
|
|
|
+ text-align: left;
|
|
|
+ // text-align: justify;
|
|
|
+ // display: inline-block;
|
|
|
+ // &::after {
|
|
|
+ // content: "";
|
|
|
+ // display: inline-block;
|
|
|
+ // width: 100%;
|
|
|
+ // }
|
|
|
+ }
|
|
|
+ .right {
|
|
|
+ width: calc(100% - 120px);
|
|
|
+ text-align: left;
|
|
|
}
|
|
|
- .margin-top-5px {
|
|
|
- margin-top: 5px;
|
|
|
+}
|
|
|
+.table {
|
|
|
+ border-collapse: collapse;
|
|
|
+ border-spacing: 0;
|
|
|
+
|
|
|
+ td {
|
|
|
+ text-align: center;
|
|
|
+ padding: 2px 4px;
|
|
|
+ // padding: 5px 10px;
|
|
|
}
|
|
|
}
|
|
|
</style>
|