|
@@ -0,0 +1,181 @@
|
|
|
|
+<template>
|
|
|
|
+ <div>
|
|
|
|
+ <div id="pdfDom" ref="pdfDom" style="padding: 20px 20px 0; text-align: center;font-size:12px;color:#333333" v-loading="loading">
|
|
|
|
+ <table border="1" style="width: 100%" class="table">
|
|
|
|
+ <tr>
|
|
|
|
+ <td colspan="12" style="text-align:center">{{pdfData.code}} 报价单</td>
|
|
|
|
+ </tr>
|
|
|
|
+ <tr>
|
|
|
|
+ <td style="width:10%">产品编码</td>
|
|
|
|
+ <td style="width:10%">产品名称</td>
|
|
|
|
+ <td style="width:7%">产品数量</td>
|
|
|
|
+ <td style="width:7%">类型</td>
|
|
|
|
+ <td style="width:10%">编码</td>
|
|
|
|
+ <td style="width:10%">名称</td>
|
|
|
|
+ <td style="width:8%" class="align-right">模具</td>
|
|
|
|
+ <td style="width:7%" class="align-right">数量/件</td>
|
|
|
|
+ <td style="width:8%" class="align-right">单价</td>
|
|
|
|
+ <td style="width:7%" class="align-right">总量</td>
|
|
|
|
+ <td style="width:8%" class="align-right">总价</td>
|
|
|
|
+ <td style="width:8%" class="align-right">小计</td>
|
|
|
|
+ </tr>
|
|
|
|
+ <template v-if="pdfData.quotationProductList && pdfData.quotationProductList.length > 0" v-for="(item, index) in pdfData.quotationProductList"
|
|
|
|
+ :key="item.productId">
|
|
|
|
+ <tr v-if="item.quotationEstimateList && item.quotationEstimateList.length>0" v-for="(row, sonIndex) in item.quotationEstimateList"
|
|
|
|
+ :key="row.id">
|
|
|
|
+ <td v-if="sonIndex==0" :rowspan="item.quotationEstimateList.length">{{item.productCode}}</td>
|
|
|
|
+ <td v-if="sonIndex==0" :rowspan="item.quotationEstimateList.length">{{item.productName}}</td>
|
|
|
|
+ <td v-if="sonIndex==0" :rowspan="item.quotationEstimateList.length">{{item.quantity}}</td>
|
|
|
|
+ <td v-if="row.isFirstRow" :rowspan="getRowSpan(item,row.type)">{{getLabel(row.type)}}</td>
|
|
|
|
+ <td>{{row.code}}</td>
|
|
|
|
+ <td>{{row.name}}</td>
|
|
|
|
+ <td class="align-right">
|
|
|
|
+ <span v-if="row.type==1">{{row.moldName}}</span>
|
|
|
|
+ <span v-else>-</span>
|
|
|
|
+ </td>
|
|
|
|
+ <td class="align-right">
|
|
|
|
+ <span v-if="row.type==1">-</span>
|
|
|
|
+ <span v-else>{{row.quantity}}</span>
|
|
|
|
+ </td>
|
|
|
|
+ <td class="align-right">{{moneyFormat(row.price,2)}}</td>
|
|
|
|
+ <td class="align-right">{{row.totalQuantity}}</td>
|
|
|
|
+ <td class="align-right">{{moneyFormat(row.amount,2)}}</td>
|
|
|
|
+ <td v-if="sonIndex==0" :rowspan="item.quotationEstimateList.length" class="align-right">{{moneyFormat(item.productAmount,2)}}</td>
|
|
|
|
+ </tr>
|
|
|
|
+ </template>
|
|
|
|
+ <tr>
|
|
|
|
+ <td colspan="11">报价总金额</td>
|
|
|
|
+ <td class="align-right">{{moneyFormat(pdfData.prodAmount,2)}} </td>
|
|
|
|
+ </tr>
|
|
|
|
+ </table>
|
|
|
|
+ </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 $ from "jquery";
|
|
|
|
+const { proxy } = getCurrentInstance();
|
|
|
|
+const pdfData = ref({});
|
|
|
|
+const props = defineProps({
|
|
|
|
+ rowData: Object,
|
|
|
|
+});
|
|
|
|
+
|
|
|
|
+const loading = ref(false);
|
|
|
|
+const getPdfData = (query) => {
|
|
|
|
+ loading.value = true;
|
|
|
|
+ proxy.post("/quotationEstimate/printPdf", query).then((res) => {
|
|
|
|
+ for (let i = 0; i < res.quotationProductList.length; i++) {
|
|
|
|
+ const iele = res.quotationProductList[i];
|
|
|
|
+ let productAmount = 0;
|
|
|
|
+ let type1Status = true;
|
|
|
|
+ let type2Status = true;
|
|
|
|
+ let type3Status = true;
|
|
|
|
+ if (iele.quotationEstimateList && iele.quotationEstimateList.length > 0) {
|
|
|
|
+ for (let j = 0; j < iele.quotationEstimateList.length; j++) {
|
|
|
|
+ const jele = iele.quotationEstimateList[j];
|
|
|
|
+ productAmount += Number(jele.amount);
|
|
|
|
+ if (jele.type == 1 && type1Status) {
|
|
|
|
+ jele.isFirstRow = true;
|
|
|
|
+ type1Status = false;
|
|
|
|
+ } else if (jele.type == 2 && type2Status) {
|
|
|
|
+ jele.isFirstRow = true;
|
|
|
|
+ type2Status = false;
|
|
|
|
+ } else if (jele.type == 3 && type3Status) {
|
|
|
|
+ jele.isFirstRow = true;
|
|
|
|
+ type3Status = false;
|
|
|
|
+ } else {
|
|
|
|
+ jele.isFirstRow = false;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ iele.productAmount = parseFloat(productAmount).toFixed(2);
|
|
|
|
+ }
|
|
|
|
+ pdfData.value = res;
|
|
|
|
+ loading.value = false;
|
|
|
|
+ });
|
|
|
|
+};
|
|
|
|
+
|
|
|
|
+const getRowSpan = (productData, type) => {
|
|
|
|
+ if (
|
|
|
|
+ productData.quotationEstimateList &&
|
|
|
|
+ productData.quotationEstimateList.length > 0
|
|
|
|
+ ) {
|
|
|
|
+ return productData.quotationEstimateList.filter((x) => x.type == type)
|
|
|
|
+ .length;
|
|
|
|
+ }
|
|
|
|
+};
|
|
|
|
+const labelObj = {
|
|
|
|
+ 1: "原材料",
|
|
|
|
+ 2: "包材辅材",
|
|
|
|
+ 3: "工序",
|
|
|
|
+};
|
|
|
|
+const getLabel = (type) => {
|
|
|
|
+ return labelObj[type];
|
|
|
|
+};
|
|
|
|
+
|
|
|
|
+watch(
|
|
|
|
+ () => props.rowData,
|
|
|
|
+ (val) => {
|
|
|
|
+ if (props.rowData.id) {
|
|
|
|
+ getPdfData({ quotationId: 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>
|
|
|
|
+.table {
|
|
|
|
+ border-collapse: collapse;
|
|
|
|
+ border-spacing: 0;
|
|
|
|
+ width: 100%;
|
|
|
|
+ td {
|
|
|
|
+ text-align: left;
|
|
|
|
+ padding: 4px;
|
|
|
|
+ font-size: 12px;
|
|
|
|
+ // padding: 5px 10px;
|
|
|
|
+ }
|
|
|
|
+ .align-right {
|
|
|
|
+ text-align: right;
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+</style>
|