|
@@ -4,147 +4,125 @@
|
|
|
:visible.sync="QRvisible"
|
|
:visible.sync="QRvisible"
|
|
|
v-if="QRvisible"
|
|
v-if="QRvisible"
|
|
|
width="90%"
|
|
width="90%"
|
|
|
|
|
+ @close="close"
|
|
|
>
|
|
>
|
|
|
- <div
|
|
|
|
|
- id="printSection"
|
|
|
|
|
- style="
|
|
|
|
|
- display: flex;
|
|
|
|
|
- align-items: center;
|
|
|
|
|
- justify-content: center;
|
|
|
|
|
- flex-direction: column;
|
|
|
|
|
- "
|
|
|
|
|
- >
|
|
|
|
|
- <div>
|
|
|
|
|
- <div
|
|
|
|
|
- style="
|
|
|
|
|
- font-size: 20px;
|
|
|
|
|
- font-weight: 800;
|
|
|
|
|
- padding-right: 20px;
|
|
|
|
|
- width: 400px;
|
|
|
|
|
- margin: 0 auto;
|
|
|
|
|
- "
|
|
|
|
|
- >{{ groupName }}{{ isPrintPrice ? '货物销售单' : '货物签收单' }}</div
|
|
|
|
|
- >
|
|
|
|
|
- </div>
|
|
|
|
|
|
|
+ <div id="printSectionHt">
|
|
|
<div
|
|
<div
|
|
|
|
|
+ v-for="(rowItem, idx) in formData"
|
|
|
|
|
+ :key="rowItem.id || idx"
|
|
|
style="
|
|
style="
|
|
|
- width: 100%;
|
|
|
|
|
- font-size: 12px;
|
|
|
|
|
display: flex;
|
|
display: flex;
|
|
|
- justify-content: space-between;
|
|
|
|
|
- margin-bottom: 5px;
|
|
|
|
|
- margin-top: 5px;
|
|
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+ justify-content: center;
|
|
|
|
|
+ flex-direction: column;
|
|
|
|
|
+ margin-top: 20px;
|
|
|
"
|
|
"
|
|
|
>
|
|
>
|
|
|
- <span style="width: 55%">客户:{{ formData.contactName }}</span>
|
|
|
|
|
-
|
|
|
|
|
- <span style="width: 25%; text-align: right;">单据编码:{{ formData.docNo }}</span>
|
|
|
|
|
- </div>
|
|
|
|
|
- <div
|
|
|
|
|
- style="
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- font-size: 12px;
|
|
|
|
|
- display: flex;
|
|
|
|
|
- justify-content: space-between;
|
|
|
|
|
- margin-bottom: 5px;
|
|
|
|
|
- "
|
|
|
|
|
- >
|
|
|
|
|
- <span style="width: 55%">项目:{{ formData.projectName }}</span>
|
|
|
|
|
- <span style="width: 25%; text-align: right;">单据日期:{{ formData.createTime ? formData.createTime.split(' ')[0] : '' }}</span>
|
|
|
|
|
- </div>
|
|
|
|
|
- <table
|
|
|
|
|
- cellspacing="0"
|
|
|
|
|
- border
|
|
|
|
|
- style="
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- table-layout: fixed;
|
|
|
|
|
- word-break: break-all;
|
|
|
|
|
- word-wrap: break-word;
|
|
|
|
|
- font-size: 12px;
|
|
|
|
|
- "
|
|
|
|
|
- >
|
|
|
|
|
- <tbody>
|
|
|
|
|
- <tr align="center">
|
|
|
|
|
- <!-- <td style="padding: 5px; width: 15%"> 名称 </td> -->
|
|
|
|
|
- <td style="padding: 2px; width: 5%"> 序号 </td>
|
|
|
|
|
- <td style="padding: 2px; width: 24%"> 规格型号 </td>
|
|
|
|
|
- <td style="padding: 2px; width: 6%"> 单位</td>
|
|
|
|
|
- <td style="padding: 2px; width: 8%"> 数量</td>
|
|
|
|
|
- <td style="padding: 2px; width: 10%" v-if="isPrintPrice"> 单价</td>
|
|
|
|
|
- <td style="padding: 2px; width: 6%" v-if="isPrintPrice"> 税率</td>
|
|
|
|
|
- <td style="padding: 2px; width: 10%" v-if="isPrintPrice"> 金额</td>
|
|
|
|
|
- <td style="padding: 2px; width: 10%"> 颜色 </td>
|
|
|
|
|
- <!-- <td style="padding: 5px; width: 10%"> 机型 </td> -->
|
|
|
|
|
- <td style="padding: 2px; width: 12%"> 备注</td>
|
|
|
|
|
- </tr>
|
|
|
|
|
|
|
+ <!-- 标题 -->
|
|
|
|
|
+ <div style="text-align: center; margin-bottom: 20px;">
|
|
|
|
|
+ <h2 style="margin: 0; font-size: 24px; font-weight: bold;">
|
|
|
|
|
+ {{ groupName }}{{ isPrintPrice ? '货物销售单' : '货物签收单' }}
|
|
|
|
|
+ </h2>
|
|
|
|
|
+ </div>
|
|
|
|
|
|
|
|
- <tr align="center" v-for="(item, index) in formData.productList">
|
|
|
|
|
- <!-- <td style="padding: 5px"> {{ item.productName }} </td> -->
|
|
|
|
|
- <td style="padding: 2px"> {{ index + 1 }}</td>
|
|
|
|
|
- <td style="padding: 2px">
|
|
|
|
|
- <!-- {{ item.specification }}/ -->
|
|
|
|
|
- {{ item.modelType }}
|
|
|
|
|
- </td>
|
|
|
|
|
- <td style="padding: 2px"> {{ item.saleUnit }}</td>
|
|
|
|
|
- <td style="padding: 2px"> {{ item.saleCount }}</td>
|
|
|
|
|
- <td style="padding: 2px;" v-if="isPrintPrice"> {{ item.singlePrice }}</td>
|
|
|
|
|
- <td style="padding: 2px;" v-if="isPrintPrice"> {{ item.taxRate }}{{ item.taxRate ? '%' : '0%' }}</td>
|
|
|
|
|
- <td style="padding: 2px;" v-if="isPrintPrice"> {{ item.totalPrice }}</td>
|
|
|
|
|
- <td style="padding: 2px"> {{ item.colorKey }}</td>
|
|
|
|
|
- <!-- <td style="padding: 5px"> {{ item.modelKey }}</td> -->
|
|
|
|
|
- <td style="padding: 2px"> {{ item.remark }}</td>
|
|
|
|
|
- </tr>
|
|
|
|
|
- <tr align="center">
|
|
|
|
|
- <td style="padding: 2px"> 合计 </td>
|
|
|
|
|
- <td style="padding: 2px" colspan="2"> {{ isPrintPrice ? convertToChinese(getTotalValue('totalPrice', 2)) : '' }} </td>
|
|
|
|
|
- <td style="padding: 2px">{{ getTotalValue('totalCount', 2) }} </td>
|
|
|
|
|
- <td style="padding: 2px" v-if="isPrintPrice"> </td>
|
|
|
|
|
- <td style="padding: 2px" v-if="isPrintPrice"> </td>
|
|
|
|
|
- <td style="padding: 2px" v-if="isPrintPrice"> {{ getTotalValue('totalPrice', 2) }} </td>
|
|
|
|
|
- <td style="padding: 2px"> </td>
|
|
|
|
|
- <td style="padding: 2px"> </td>
|
|
|
|
|
- </tr>
|
|
|
|
|
- </tbody>
|
|
|
|
|
- </table>
|
|
|
|
|
- <div
|
|
|
|
|
- style="
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- font-size: 12px;
|
|
|
|
|
- display: flex;
|
|
|
|
|
- justify-content: space-between;
|
|
|
|
|
- margin-top: 5px;
|
|
|
|
|
- "
|
|
|
|
|
- >
|
|
|
|
|
- <div style="flex: 1">
|
|
|
|
|
- <div>业务员:{{ formData.saleOrderList[0]?.salesmanName }}</div>
|
|
|
|
|
|
|
+ <!-- 信息行 -->
|
|
|
|
|
+ <div style="margin-bottom: 10px; width: 100%; font-size: 14px;">
|
|
|
|
|
+ <div style="width: 100%; display: flex;">
|
|
|
|
|
+ <div style="width: 55%;">客户:{{ rowItem.contactName || '' }}</div>
|
|
|
|
|
+ <div style="width: 45%; text-align: right;">单据编码:{{ rowItem.docNo || '' }}</div>
|
|
|
|
|
+ </div>
|
|
|
</div>
|
|
</div>
|
|
|
- <div style="flex: 1">
|
|
|
|
|
- <div>制单人:{{ formData.makerName }}</div>
|
|
|
|
|
|
|
+ <div style="margin-bottom: 10px; width: 100%; font-size: 14px;">
|
|
|
|
|
+ <div style="width: 100%; display: flex;">
|
|
|
|
|
+ <div style="width: 55%;">项目:{{ rowItem.projectName || '' }}</div>
|
|
|
|
|
+ <div style="width: 45%; text-align: right;">单据日期:{{ rowItem.createTime ? rowItem.createTime.split(' ')[0] : '' }}</div>
|
|
|
|
|
+ </div>
|
|
|
</div>
|
|
</div>
|
|
|
- <div style="flex: 1"> 核对人: </div>
|
|
|
|
|
- <div style="flex: 1"> 发货人: </div>
|
|
|
|
|
- </div>
|
|
|
|
|
- <div
|
|
|
|
|
- style="
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- font-size: 12px;
|
|
|
|
|
- display: flex;
|
|
|
|
|
- justify-content: space-between;
|
|
|
|
|
- margin-top: 5px;
|
|
|
|
|
- "
|
|
|
|
|
- >
|
|
|
|
|
- <div style="width: 75%">
|
|
|
|
|
- <!-- <div>地址:{{ formData.receiveAddress }}</div> -->
|
|
|
|
|
- <div>地址:湖南湘江新区宁乡夏铎铺机械工业园</div>
|
|
|
|
|
|
|
+
|
|
|
|
|
+ <!-- 产品表格 -->
|
|
|
|
|
+ <table
|
|
|
|
|
+ border="1"
|
|
|
|
|
+ cellspacing="0"
|
|
|
|
|
+ style="
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ border-collapse: collapse;
|
|
|
|
|
+ font-size: 14px;
|
|
|
|
|
+ "
|
|
|
|
|
+ >
|
|
|
|
|
+ <thead>
|
|
|
|
|
+ <tr>
|
|
|
|
|
+ <th style="border: 1px solid #000; padding: 4px; text-align: center; width: 5%;">序号</th>
|
|
|
|
|
+ <th style="border: 1px solid #000; padding: 4px; text-align: center; width: 24%;">规格型号</th>
|
|
|
|
|
+ <th style="border: 1px solid #000; padding: 4px; text-align: center; width: 6%;">单位</th>
|
|
|
|
|
+ <th style="border: 1px solid #000; padding: 4px; text-align: center; width: 8%;">数量</th>
|
|
|
|
|
+ <th v-if="isPrintPrice" style="border: 1px solid #000; padding: 4px; text-align: center; width: 10%;">单价</th>
|
|
|
|
|
+ <th v-if="isPrintPrice" style="border: 1px solid #000; padding: 4px; text-align: center; width: 6%;">税率</th>
|
|
|
|
|
+ <th v-if="isPrintPrice" style="border: 1px solid #000; padding: 4px; text-align: center; width: 10%;">金额</th>
|
|
|
|
|
+ <th style="border: 1px solid #000; padding: 4px; text-align: center; width: 10%;">颜色</th>
|
|
|
|
|
+ <th style="border: 1px solid #000; padding: 4px; text-align: center; width: 12%;">备注</th>
|
|
|
|
|
+ </tr>
|
|
|
|
|
+ </thead>
|
|
|
|
|
+ <tbody>
|
|
|
|
|
+ <tr v-for="(item, index) in rowItem.productList" :key="item.id || index">
|
|
|
|
|
+ <td style="border: 1px solid #000; padding: 4px; text-align: center;">{{ index + 1 }}</td>
|
|
|
|
|
+ <td style="border: 1px solid #000; padding: 4px; text-align: center;">{{ item.modelType || '' }}</td>
|
|
|
|
|
+ <td style="border: 1px solid #000; padding: 4px; text-align: center;">{{ item.saleUnit || '' }}</td>
|
|
|
|
|
+ <td style="border: 1px solid #000; padding: 4px; text-align: center;">{{ item.saleCount ?? '' }}</td>
|
|
|
|
|
+ <td v-if="isPrintPrice" style="border: 1px solid #000; padding: 4px; text-align: center;">{{ item.singlePrice ?? '' }}</td>
|
|
|
|
|
+ <td v-if="isPrintPrice" style="border: 1px solid #000; padding: 4px; text-align: center;">{{ item.taxRate != null ? item.taxRate + '%' : '0%' }}</td>
|
|
|
|
|
+ <td v-if="isPrintPrice" style="border: 1px solid #000; padding: 4px; text-align: center;">{{ item.totalPrice ?? '' }}</td>
|
|
|
|
|
+ <td style="border: 1px solid #000; padding: 4px; text-align: center;">{{ item.colorKey || '' }}</td>
|
|
|
|
|
+ <td style="border: 1px solid #000; padding: 4px; text-align: center;">{{ item.remark || '' }}</td>
|
|
|
|
|
+ </tr>
|
|
|
|
|
+
|
|
|
|
|
+ <!-- 合计行 -->
|
|
|
|
|
+ <tr>
|
|
|
|
|
+ <td style="border: 1px solid #000; padding: 4px; text-align: center; font-weight: bold;">合计</td>
|
|
|
|
|
+ <td colspan="2" style="border: 1px solid #000; padding: 4px; text-align: center; font-weight: bold;">
|
|
|
|
|
+ {{ isPrintPrice ? convertToChinese(getRowTotal(rowItem, 'totalPrice', 2)) : '' }}
|
|
|
|
|
+ </td>
|
|
|
|
|
+ <td style="border: 1px solid #000; padding: 4px; text-align: center; font-weight: bold;">
|
|
|
|
|
+ {{ getRowTotal(rowItem, 'saleCount', 2) }}
|
|
|
|
|
+ </td>
|
|
|
|
|
+ <td v-if="isPrintPrice" style="border: 1px solid #000; padding: 4px; text-align: center;"></td>
|
|
|
|
|
+ <td v-if="isPrintPrice" style="border: 1px solid #000; padding: 4px; text-align: center;"></td>
|
|
|
|
|
+ <td v-if="isPrintPrice" style="border: 1px solid #000; padding: 4px; text-align: center; font-weight: bold;">
|
|
|
|
|
+ {{ getRowTotal(rowItem, 'totalPrice', 2) }}
|
|
|
|
|
+ </td>
|
|
|
|
|
+ <td style="border: 1px solid #000; padding: 4px; text-align: center;"></td>
|
|
|
|
|
+ <td style="border: 1px solid #000; padding: 4px; text-align: center;"></td>
|
|
|
|
|
+ </tr>
|
|
|
|
|
+ </tbody>
|
|
|
|
|
+ </table>
|
|
|
|
|
+
|
|
|
|
|
+ <!-- 底部信息 -->
|
|
|
|
|
+ <div style="margin-top: 15px; display: flex; width: 100%; font-size: 14px;">
|
|
|
|
|
+ <div style="width: 25%;">
|
|
|
|
|
+ <strong>业务员:</strong>{{ rowItem.saleOrderList && rowItem.saleOrderList[0] ? rowItem.saleOrderList[0].salesmanName : '' }}
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div style="width: 25%;">
|
|
|
|
|
+ <strong>制单人:</strong>{{ rowItem.makerName || '' }}
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div style="width: 25%;">
|
|
|
|
|
+ <strong>核对人:</strong>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div style="width: 25%;">
|
|
|
|
|
+ <strong>发货人:</strong>
|
|
|
|
|
+ </div>
|
|
|
</div>
|
|
</div>
|
|
|
- <div style="width: 25%">
|
|
|
|
|
- <div>客户签字:</div>
|
|
|
|
|
|
|
+ <div style="margin-top: 10px; display: flex; width: 100%; font-size: 14px;">
|
|
|
|
|
+ <div style="width: 75%;">
|
|
|
|
|
+ <strong>地址:</strong>湖南湘江新区宁乡夏铎铺机械工业园
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div style="width: 25%;">
|
|
|
|
|
+ <strong>客户签字:</strong>
|
|
|
|
|
+ </div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div slot="footer">
|
|
<div slot="footer">
|
|
|
- <el-button type="primary" @click="handleExport">导出</el-button>
|
|
|
|
|
|
|
+ <el-button type="primary" @click="exportExcel">导出</el-button>
|
|
|
<el-button @click="print">打印预览</el-button>
|
|
<el-button @click="print">打印预览</el-button>
|
|
|
<el-button @click="close">关闭</el-button>
|
|
<el-button @click="close">关闭</el-button>
|
|
|
</div>
|
|
</div>
|
|
@@ -152,41 +130,46 @@
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
<script>
|
|
|
- import { getSendSaleOrderrecordDetailSplit } from '@/api/saleManage/saleordersendrecord';
|
|
|
|
|
|
|
+ import { getSendSaleOrderCordDetailByIds } from '@/api/saleManage/saleordersendrecord';
|
|
|
import { mapGetters } from 'vuex';
|
|
import { mapGetters } from 'vuex';
|
|
|
import { convertToChinese } from '@/utils/util';
|
|
import { convertToChinese } from '@/utils/util';
|
|
|
|
|
+ import { saveAs } from 'file-saver';
|
|
|
|
|
+
|
|
|
export default {
|
|
export default {
|
|
|
name: 'print',
|
|
name: 'print',
|
|
|
computed: {
|
|
computed: {
|
|
|
...mapGetters(['user'])
|
|
...mapGetters(['user'])
|
|
|
},
|
|
},
|
|
|
props: {
|
|
props: {
|
|
|
- groupName: ''
|
|
|
|
|
|
|
+ groupName: {
|
|
|
|
|
+ type: String,
|
|
|
|
|
+ default: ''
|
|
|
|
|
+ }
|
|
|
},
|
|
},
|
|
|
data() {
|
|
data() {
|
|
|
return {
|
|
return {
|
|
|
- checked: '',
|
|
|
|
|
QRvisible: false,
|
|
QRvisible: false,
|
|
|
isPrintPrice: false,
|
|
isPrintPrice: false,
|
|
|
- formData: {},
|
|
|
|
|
|
|
+ formData: [],
|
|
|
convertToChinese
|
|
convertToChinese
|
|
|
};
|
|
};
|
|
|
},
|
|
},
|
|
|
|
|
|
|
|
methods: {
|
|
methods: {
|
|
|
- async open(id, isPrintPrice) {
|
|
|
|
|
- this.formData = await getSendSaleOrderrecordDetailSplit(id);
|
|
|
|
|
|
|
+ async open(ids, isPrintPrice) {
|
|
|
|
|
+ this.formData = await getSendSaleOrderCordDetailByIds(ids);
|
|
|
this.QRvisible = true;
|
|
this.QRvisible = true;
|
|
|
this.isPrintPrice = isPrintPrice;
|
|
this.isPrintPrice = isPrintPrice;
|
|
|
},
|
|
},
|
|
|
close() {
|
|
close() {
|
|
|
|
|
+ this.formData = [];
|
|
|
this.QRvisible = false;
|
|
this.QRvisible = false;
|
|
|
},
|
|
},
|
|
|
- getTotalValue(key, num) {
|
|
|
|
|
- let val = this.formData?.productList?.reduce((total, item) => {
|
|
|
|
|
- return (total += Number(item[key]));
|
|
|
|
|
|
|
+ // 计算单条单据的合计值
|
|
|
|
|
+ getRowTotal(rowItem, key, num) {
|
|
|
|
|
+ let val = rowItem?.productList?.reduce((total, item) => {
|
|
|
|
|
+ return (total += Number(item[key] || 0));
|
|
|
}, 0);
|
|
}, 0);
|
|
|
-
|
|
|
|
|
return (
|
|
return (
|
|
|
(val &&
|
|
(val &&
|
|
|
parseFloat(val)
|
|
parseFloat(val)
|
|
@@ -196,7 +179,8 @@
|
|
|
);
|
|
);
|
|
|
},
|
|
},
|
|
|
print() {
|
|
print() {
|
|
|
- const printSection = document.getElementById('printSection');
|
|
|
|
|
|
|
+ const printSection = document.getElementById('printSectionHt');
|
|
|
|
|
+ // 创建打印任务
|
|
|
const printWindow = window.open('', '_blank');
|
|
const printWindow = window.open('', '_blank');
|
|
|
printWindow.document.open();
|
|
printWindow.document.open();
|
|
|
printWindow.document.write('<html><head><title>打印预览</title>');
|
|
printWindow.document.write('<html><head><title>打印预览</title>');
|
|
@@ -211,223 +195,206 @@
|
|
|
printWindow.print();
|
|
printWindow.print();
|
|
|
};
|
|
};
|
|
|
},
|
|
},
|
|
|
|
|
+
|
|
|
/**
|
|
/**
|
|
|
- * 获取Excel样式配置
|
|
|
|
|
|
|
+ * 导出Excel
|
|
|
*/
|
|
*/
|
|
|
- getExcelStyles() {
|
|
|
|
|
- const border = 'border-top:1px solid #000;border-right:1px solid #000;border-bottom:1px solid #000;border-left:1px solid #000;';
|
|
|
|
|
|
|
+ exportExcel() {
|
|
|
|
|
+ const border =
|
|
|
|
|
+ 'border-top:1px solid #000;border-right:1px solid #000;border-bottom:1px solid #000;border-left:1px solid #000;';
|
|
|
const cellBase = `${border}padding:4px;mso-number-format:"\\@";vertical-align:middle;text-align:center;mso-horizontal-align:center;`;
|
|
const cellBase = `${border}padding:4px;mso-number-format:"\\@";vertical-align:middle;text-align:center;mso-horizontal-align:center;`;
|
|
|
- return {
|
|
|
|
|
- border,
|
|
|
|
|
- th: `${cellBase}font-weight:bold;font-family:'宋体';font-size:12pt;`,
|
|
|
|
|
- td: `${cellBase}font-family:'宋体';font-size:11pt;`,
|
|
|
|
|
- labelLeft: `${border}padding:4px;mso-number-format:"\\@";vertical-align:middle;text-align:left;mso-horizontal-align:left;font-family:'宋体';font-size:11pt;`
|
|
|
|
|
- };
|
|
|
|
|
- },
|
|
|
|
|
- /**
|
|
|
|
|
- * 获取列配置
|
|
|
|
|
- * @param {boolean} includePrice - 是否包含价格列
|
|
|
|
|
- */
|
|
|
|
|
- getColumnConfig(includePrice) {
|
|
|
|
|
- if (includePrice) {
|
|
|
|
|
- return {
|
|
|
|
|
- widths: [55, 170, 55, 70, 75, 65, 90, 70, 110],
|
|
|
|
|
- headers: ['序号', '规格型号', '单位', '数量', '单价', '税率', '金额', '颜色', '备注'],
|
|
|
|
|
- colspan: 9,
|
|
|
|
|
- infoColspan: { left: 6, right: 3 },
|
|
|
|
|
- footer: { salesman: 2, maker: 2, checker: 3, sender: 2, address: 5, signature: 4 }
|
|
|
|
|
- };
|
|
|
|
|
- }
|
|
|
|
|
- return {
|
|
|
|
|
- widths: [55, 170, 55, 70, 70, 110],
|
|
|
|
|
- headers: ['序号', '规格型号', '单位', '数量', '颜色', '备注'],
|
|
|
|
|
- colspan: 6,
|
|
|
|
|
- infoColspan: { left: 4, right: 2 },
|
|
|
|
|
- footer: { salesman: 2, maker: 1, checker: 1, sender: 2, address: 3, signature: 3 }
|
|
|
|
|
- };
|
|
|
|
|
- },
|
|
|
|
|
- /**
|
|
|
|
|
- * 生成数据行
|
|
|
|
|
- * @param {Array} list - 产品列表
|
|
|
|
|
- * @param {boolean} includePrice - 是否包含价格
|
|
|
|
|
- * @param {string} tdStyle - TD样式
|
|
|
|
|
- */
|
|
|
|
|
- generateRows(list, includePrice, tdStyle) {
|
|
|
|
|
- return list.map((item, index) => {
|
|
|
|
|
- const cells = [];
|
|
|
|
|
- cells.push(`<td align="center" valign="middle" style="${tdStyle}">${index + 1}</td>`);
|
|
|
|
|
- cells.push(`<td align="center" valign="middle" style="${tdStyle}">${item.modelType || ''}</td>`);
|
|
|
|
|
- cells.push(`<td align="center" valign="middle" style="${tdStyle}">${item.saleUnit || ''}</td>`);
|
|
|
|
|
- cells.push(`<td align="center" valign="middle" style="${tdStyle}">${item.saleCount ?? ''}</td>`);
|
|
|
|
|
-
|
|
|
|
|
- if (includePrice) {
|
|
|
|
|
- cells.push(`<td align="center" valign="middle" style="${tdStyle}">${item.singlePrice ?? ''}</td>`);
|
|
|
|
|
- cells.push(`<td align="center" valign="middle" style="${tdStyle}">${item.taxRate ? item.taxRate + '%' : '0%'}</td>`);
|
|
|
|
|
- cells.push(`<td align="center" valign="middle" style="${tdStyle}">${item.totalPrice ?? ''}</td>`);
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- cells.push(`<td align="center" valign="middle" style="${tdStyle}">${item.colorKey || ''}</td>`);
|
|
|
|
|
- cells.push(`<td align="center" valign="middle" style="${tdStyle}">${item.remark || ''}</td>`);
|
|
|
|
|
-
|
|
|
|
|
- return `<tr height="24" style="height:24pt;">${cells.join('')}</tr>`;
|
|
|
|
|
- }).join('');
|
|
|
|
|
- },
|
|
|
|
|
- /**
|
|
|
|
|
- * 生成合计行
|
|
|
|
|
- */
|
|
|
|
|
- generateTotalRow(includePrice, tdStyle, totalCount, totalPrice, totalChinese) {
|
|
|
|
|
- if (includePrice) {
|
|
|
|
|
- return `
|
|
|
|
|
- <tr height="26" style="height:26pt;">
|
|
|
|
|
- <td align="center" valign="middle" style="${tdStyle};font-weight:bold;">合计</td>
|
|
|
|
|
- <td colspan="2" align="center" valign="middle" style="${tdStyle};font-weight:bold;">${totalChinese}</td>
|
|
|
|
|
- <td align="center" valign="middle" style="${tdStyle};font-weight:bold;">${totalCount}</td>
|
|
|
|
|
- <td align="center" valign="middle" style="${tdStyle}"></td>
|
|
|
|
|
- <td align="center" valign="middle" style="${tdStyle}"></td>
|
|
|
|
|
- <td align="center" valign="middle" style="${tdStyle};font-weight:bold;">${totalPrice}</td>
|
|
|
|
|
- <td align="center" valign="middle" style="${tdStyle}"></td>
|
|
|
|
|
- <td align="center" valign="middle" style="${tdStyle}"></td>
|
|
|
|
|
- </tr>
|
|
|
|
|
- `;
|
|
|
|
|
- }
|
|
|
|
|
- return `
|
|
|
|
|
- <tr height="26" style="height:26pt;">
|
|
|
|
|
- <td align="center" valign="middle" style="${tdStyle};font-weight:bold;">合计</td>
|
|
|
|
|
- <td colspan="2" align="center" valign="middle" style="${tdStyle};font-weight:bold;"></td>
|
|
|
|
|
- <td align="center" valign="middle" style="${tdStyle};font-weight:bold;">${totalCount}</td>
|
|
|
|
|
- <td align="center" valign="middle" style="${tdStyle}"></td>
|
|
|
|
|
- <td align="center" valign="middle" style="${tdStyle}"></td>
|
|
|
|
|
- </tr>
|
|
|
|
|
- `;
|
|
|
|
|
- },
|
|
|
|
|
- /**
|
|
|
|
|
- * 生成底部信息行
|
|
|
|
|
- */
|
|
|
|
|
- generateFooterRows(includePrice, labelLeftStyle, config) {
|
|
|
|
|
- let html = `
|
|
|
|
|
- <tr height="28" style="height:28pt;">
|
|
|
|
|
- <td colspan="${config.footer.salesman}" align="left" valign="middle" style="${labelLeftStyle}">业务员:${this.formData.salesmanName || ''}</td>
|
|
|
|
|
- <td colspan="${config.footer.maker}" align="left" valign="middle" style="${labelLeftStyle}">制单人:${this.formData.makerName || ''}</td>
|
|
|
|
|
- <td colspan="${config.footer.checker}" align="left" valign="middle" style="${labelLeftStyle}">核对人:</td>
|
|
|
|
|
- <td colspan="${config.footer.sender}" align="left" valign="middle" style="${labelLeftStyle}">发货人:</td>
|
|
|
|
|
- </tr>
|
|
|
|
|
- <tr height="28" style="height:28pt;">
|
|
|
|
|
- <td colspan="${config.footer.address}" align="left" valign="middle" style="${labelLeftStyle}">地址:湖南湘江新区宁乡夏铎铺机械工业园</td>
|
|
|
|
|
- <td colspan="${config.footer.signature}" align="left" valign="middle" style="${labelLeftStyle}">客户签字:</td>
|
|
|
|
|
- </tr>
|
|
|
|
|
- `;
|
|
|
|
|
-
|
|
|
|
|
- return html;
|
|
|
|
|
- },
|
|
|
|
|
- /**
|
|
|
|
|
- * 生成完整的Excel HTML结构
|
|
|
|
|
- */
|
|
|
|
|
- generateExcelHtml(table, title) {
|
|
|
|
|
- return `
|
|
|
|
|
- <html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40">
|
|
|
|
|
- <head>
|
|
|
|
|
- <meta charset="UTF-8" />
|
|
|
|
|
- <style>
|
|
|
|
|
- br { mso-data-placement: same-cell; }
|
|
|
|
|
- table { mso-displayed-decimal-separator:"."; mso-displayed-thousand-separator:","; }
|
|
|
|
|
- td { mso-ignore:padding; }
|
|
|
|
|
- </style>
|
|
|
|
|
- <!--[if gte mso 9]><xml>
|
|
|
|
|
- <x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet>
|
|
|
|
|
- <x:Name>${title}</x:Name>
|
|
|
|
|
- <x:WorksheetOptions>
|
|
|
|
|
- <x:DefaultRowHeight>260</x:DefaultRowHeight>
|
|
|
|
|
- <x:Print><x:ValidPrinterInfo/><x:HorizontalResolution>600</x:HorizontalResolution><x:VerticalResolution>600</x:VerticalResolution></x:Print>
|
|
|
|
|
- <x:Selected/>
|
|
|
|
|
- <x:DoNotDisplayGridlines/>
|
|
|
|
|
- </x:WorksheetOptions>
|
|
|
|
|
- </x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook>
|
|
|
|
|
- </xml><![endif]-->
|
|
|
|
|
- </head>
|
|
|
|
|
- <body>${table}</body></html>
|
|
|
|
|
- `;
|
|
|
|
|
- },
|
|
|
|
|
- /**
|
|
|
|
|
- * 下载Excel文件
|
|
|
|
|
- */
|
|
|
|
|
- downloadExcel(html, title) {
|
|
|
|
|
- const blob = new Blob(['\ufeff' + html], {
|
|
|
|
|
- type: 'application/vnd.ms-excel;charset=utf-8'
|
|
|
|
|
- });
|
|
|
|
|
- saveAs(blob, `${title}_${this.formData.orderNo || ''}.xls`);
|
|
|
|
|
- },
|
|
|
|
|
- /**
|
|
|
|
|
- * 统一导出Excel方法
|
|
|
|
|
- * @param {boolean} includePrice - 是否包含价格
|
|
|
|
|
- */
|
|
|
|
|
- exportExcel(includePrice = true) {
|
|
|
|
|
- try {
|
|
|
|
|
- const list = this.formData.productList || [];
|
|
|
|
|
- const totalCount = this.getTotalValue('saleCount', 2);
|
|
|
|
|
- const totalPrice = includePrice ? this.getTotalValue('totalPrice', 2) : 0;
|
|
|
|
|
- const totalChinese = includePrice ? convertToChinese(totalPrice) : '';
|
|
|
|
|
|
|
+ const th = `${cellBase}font-weight:bold;font-family:'宋体';font-size:12pt;`;
|
|
|
|
|
+ const td = `${cellBase}font-family:'宋体';font-size:11pt;`;
|
|
|
|
|
+ const labelLeft = `${border}padding:4px;mso-number-format:"\\@";vertical-align:middle;text-align:left;mso-horizontal-align:left;font-family:'宋体';font-size:11pt;`;
|
|
|
|
|
|
|
|
- const styles = this.getExcelStyles();
|
|
|
|
|
- const config = this.getColumnConfig(includePrice);
|
|
|
|
|
-
|
|
|
|
|
- // 生成列定义
|
|
|
|
|
- const colGroup = config.widths
|
|
|
|
|
- .map(w => `<col width="${w}" style="width:${w}pt;" />`)
|
|
|
|
|
- .join('');
|
|
|
|
|
|
|
+ const title = `${this.groupName || ''}${this.isPrintPrice ? '货物销售单' : '货物签收单'}`;
|
|
|
|
|
|
|
|
- // 生成数据行
|
|
|
|
|
- const rows = this.generateRows(list, includePrice, styles.td);
|
|
|
|
|
|
|
+ // 遍历多个单据生成多个表格
|
|
|
|
|
+ let tables = '';
|
|
|
|
|
+ this.formData.forEach((rowItem) => {
|
|
|
|
|
+ const list = rowItem.productList || [];
|
|
|
|
|
+ const totalCount = this.getRowTotal(rowItem, 'saleCount', 2);
|
|
|
|
|
+ const totalPrice = this.isPrintPrice ? this.getRowTotal(rowItem, 'totalPrice', 2) : 0;
|
|
|
|
|
+ const totalChinese = this.isPrintPrice ? convertToChinese(totalPrice) : '';
|
|
|
|
|
+ const salesmanName = rowItem.saleOrderList && rowItem.saleOrderList[0] ? rowItem.saleOrderList[0].salesmanName || '' : '';
|
|
|
|
|
|
|
|
- // 生成标题
|
|
|
|
|
- const title = `${this.groupName || ''}${includePrice ? '货物销售单' : '货物签收单'}`;
|
|
|
|
|
|
|
+ if (this.isPrintPrice) {
|
|
|
|
|
+ // 有价格列的配置
|
|
|
|
|
+ const colWidths = [55, 170, 55, 70, 75, 65, 90, 70, 110];
|
|
|
|
|
+ const totalCols = 9;
|
|
|
|
|
+ const colGroup = colWidths.map(w => `<col width="${w}" style="width:${w}pt;" />`).join('');
|
|
|
|
|
|
|
|
- // 生成表头
|
|
|
|
|
- const headers = config.headers.map(
|
|
|
|
|
- header => `<td align="center" valign="middle" style="${styles.th}">${header}</td>`
|
|
|
|
|
- ).join('');
|
|
|
|
|
|
|
+ const rows = list.map((item, index) => `
|
|
|
|
|
+ <tr height="24" style="height:24pt;">
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}">${index + 1}</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}">${item.modelType || ''}</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}">${item.saleUnit || ''}</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}">${item.saleCount ?? ''}</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}">${item.singlePrice ?? ''}</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}">${item.taxRate != null ? item.taxRate + '%' : '0%'}</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}">${item.totalPrice ?? ''}</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}">${item.colorKey || ''}</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}">${item.remark || ''}</td>
|
|
|
|
|
+ </tr>`
|
|
|
|
|
+ ).join('');
|
|
|
|
|
|
|
|
- // 生成表格
|
|
|
|
|
- const table = `
|
|
|
|
|
|
|
+ tables += `
|
|
|
<table border="1" cellspacing="0" cellpadding="0" align="center"
|
|
<table border="1" cellspacing="0" cellpadding="0" align="center"
|
|
|
style="border-collapse:collapse;border:1px solid #000;mso-border-alt:solid #000 0.5pt;font-family:'宋体';font-size:11pt;text-align:center;">
|
|
style="border-collapse:collapse;border:1px solid #000;mso-border-alt:solid #000 0.5pt;font-family:'宋体';font-size:11pt;text-align:center;">
|
|
|
<colgroup>${colGroup}</colgroup>
|
|
<colgroup>${colGroup}</colgroup>
|
|
|
<tr height="40" style="height:40pt;">
|
|
<tr height="40" style="height:40pt;">
|
|
|
- <td colspan="${config.colspan}" align="center" valign="middle" style="${styles.border}padding:6px;text-align:center;font-family:'宋体';font-size:22pt;font-weight:bold;">${title}</td>
|
|
|
|
|
|
|
+ <td colspan="${totalCols}" align="center" valign="middle" style="${border}padding:6px;text-align:center;font-family:'宋体';font-size:22pt;font-weight:bold;">${title}</td>
|
|
|
</tr>
|
|
</tr>
|
|
|
<tr height="26" style="height:26pt;">
|
|
<tr height="26" style="height:26pt;">
|
|
|
- <td colspan="${config.infoColspan.left}" align="left" valign="middle" style="${styles.labelLeft}">客户:${this.formData.contactName || ''}</td>
|
|
|
|
|
- <td colspan="${config.infoColspan.right}" align="left" valign="middle" style="${styles.labelLeft}">单据编码:${this.formData.docNo || ''}</td>
|
|
|
|
|
|
|
+ <td colspan="6" align="left" valign="middle" style="${labelLeft}">客户:${rowItem.contactName || ''}</td>
|
|
|
|
|
+ <td colspan="3" align="left" valign="middle" style="${labelLeft}">单据编码:${rowItem.docNo || ''}</td>
|
|
|
</tr>
|
|
</tr>
|
|
|
<tr height="26" style="height:26pt;">
|
|
<tr height="26" style="height:26pt;">
|
|
|
- <td colspan="${config.infoColspan.left}" align="left" valign="middle" style="${styles.labelLeft}">项目:${this.formData.projectName || ''}</td>
|
|
|
|
|
- <td colspan="${config.infoColspan.right}" align="left" valign="middle" style="${styles.labelLeft}">单据日期:${this.formData.createTime ? this.formData.createTime.split(' ')[0] : ''}</td>
|
|
|
|
|
|
|
+ <td colspan="6" align="left" valign="middle" style="${labelLeft}">项目:${rowItem.projectName || ''}</td>
|
|
|
|
|
+ <td colspan="3" align="left" valign="middle" style="${labelLeft}">单据日期:${rowItem.createTime ? rowItem.createTime.split(' ')[0] : ''}</td>
|
|
|
|
|
+ </tr>
|
|
|
|
|
+ <tr height="28" style="height:28pt;">
|
|
|
|
|
+ <td align="center" valign="middle" style="${th}">序号</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${th}">规格型号</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${th}">单位</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${th}">数量</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${th}">单价</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${th}">税率</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${th}">金额</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${th}">颜色</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${th}">备注</td>
|
|
|
</tr>
|
|
</tr>
|
|
|
- <tr height="28" style="height:28pt;">${headers}</tr>
|
|
|
|
|
${rows}
|
|
${rows}
|
|
|
- ${this.generateTotalRow(includePrice, styles.td, totalCount, totalPrice, totalChinese)}
|
|
|
|
|
- ${this.generateFooterRows(includePrice, styles.labelLeft, config)}
|
|
|
|
|
|
|
+ <tr height="26" style="height:26pt;">
|
|
|
|
|
+ <td align="center" valign="middle" style="${td};font-weight:bold;">合计</td>
|
|
|
|
|
+ <td colspan="2" align="center" valign="middle" style="${td};font-weight:bold;">${totalChinese}</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td};font-weight:bold;">${totalCount}</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}"></td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}"></td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td};font-weight:bold;">${totalPrice}</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}"></td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}"></td>
|
|
|
|
|
+ </tr>
|
|
|
|
|
+ <tr height="28" style="height:28pt;">
|
|
|
|
|
+ <td colspan="2" align="left" valign="middle" style="${labelLeft}">业务员:${salesmanName}</td>
|
|
|
|
|
+ <td colspan="2" align="left" valign="middle" style="${labelLeft}">制单人:${rowItem.makerName || ''}</td>
|
|
|
|
|
+ <td colspan="3" align="left" valign="middle" style="${labelLeft}">核对人:</td>
|
|
|
|
|
+ <td colspan="2" align="left" valign="middle" style="${labelLeft}">发货人:</td>
|
|
|
|
|
+ </tr>
|
|
|
|
|
+ <tr height="28" style="height:28pt;">
|
|
|
|
|
+ <td colspan="5" align="left" valign="middle" style="${labelLeft}">地址:湖南湘江新区宁乡夏铎铺机械工业园</td>
|
|
|
|
|
+ <td colspan="4" align="left" valign="middle" style="${labelLeft}">客户签字:</td>
|
|
|
|
|
+ </tr>
|
|
|
</table>
|
|
</table>
|
|
|
- `;
|
|
|
|
|
|
|
+ <br style="mso-special-character:line-break;page-break-before:always" />`;
|
|
|
|
|
+ } else {
|
|
|
|
|
+ // 无价格列的配置
|
|
|
|
|
+ const colWidths = [55, 170, 55, 70, 70, 110];
|
|
|
|
|
+ const totalCols = 6;
|
|
|
|
|
+ const colGroup = colWidths.map(w => `<col width="${w}" style="width:${w}pt;" />`).join('');
|
|
|
|
|
|
|
|
- // 生成完整HTML
|
|
|
|
|
- const html = this.generateExcelHtml(table, title);
|
|
|
|
|
|
|
+ const rows = list.map((item, index) => `
|
|
|
|
|
+ <tr height="24" style="height:24pt;">
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}">${index + 1}</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}">${item.modelType || ''}</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}">${item.saleUnit || ''}</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}">${item.saleCount ?? ''}</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}">${item.colorKey || ''}</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}">${item.remark || ''}</td>
|
|
|
|
|
+ </tr>`
|
|
|
|
|
+ ).join('');
|
|
|
|
|
|
|
|
- // 导出文件
|
|
|
|
|
- this.downloadExcel(html, title);
|
|
|
|
|
-
|
|
|
|
|
- } catch (error) {
|
|
|
|
|
- console.error('导出Excel失败:', error);
|
|
|
|
|
- this.$message.error('导出Excel失败,请重试');
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
- /**
|
|
|
|
|
- * 根据isPrintPrice自动选择导出方式
|
|
|
|
|
- */
|
|
|
|
|
- handleExport() {
|
|
|
|
|
- this.exportExcel(this.isPrintPrice);
|
|
|
|
|
|
|
+ tables += `
|
|
|
|
|
+ <table border="1" cellspacing="0" cellpadding="0" align="center"
|
|
|
|
|
+ style="border-collapse:collapse;border:1px solid #000;mso-border-alt:solid #000 0.5pt;font-family:'宋体';font-size:11pt;text-align:center;">
|
|
|
|
|
+ <colgroup>${colGroup}</colgroup>
|
|
|
|
|
+ <tr height="40" style="height:40pt;">
|
|
|
|
|
+ <td colspan="${totalCols}" align="center" valign="middle" style="${border}padding:6px;text-align:center;font-family:'宋体';font-size:22pt;font-weight:bold;">${title}</td>
|
|
|
|
|
+ </tr>
|
|
|
|
|
+ <tr height="26" style="height:26pt;">
|
|
|
|
|
+ <td colspan="4" align="left" valign="middle" style="${labelLeft}">客户:${rowItem.contactName || ''}</td>
|
|
|
|
|
+ <td colspan="2" align="left" valign="middle" style="${labelLeft}">单据编码:${rowItem.docNo || ''}</td>
|
|
|
|
|
+ </tr>
|
|
|
|
|
+ <tr height="26" style="height:26pt;">
|
|
|
|
|
+ <td colspan="4" align="left" valign="middle" style="${labelLeft}">项目:${rowItem.projectName || ''}</td>
|
|
|
|
|
+ <td colspan="2" align="left" valign="middle" style="${labelLeft}">单据日期:${rowItem.createTime ? rowItem.createTime.split(' ')[0] : ''}</td>
|
|
|
|
|
+ </tr>
|
|
|
|
|
+ <tr height="28" style="height:28pt;">
|
|
|
|
|
+ <td align="center" valign="middle" style="${th}">序号</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${th}">规格型号</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${th}">单位</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${th}">数量</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${th}">颜色</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${th}">备注</td>
|
|
|
|
|
+ </tr>
|
|
|
|
|
+ ${rows}
|
|
|
|
|
+ <tr height="26" style="height:26pt;">
|
|
|
|
|
+ <td align="center" valign="middle" style="${td};font-weight:bold;">合计</td>
|
|
|
|
|
+ <td colspan="2" align="center" valign="middle" style="${td};font-weight:bold;"></td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td};font-weight:bold;">${totalCount}</td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}"></td>
|
|
|
|
|
+ <td align="center" valign="middle" style="${td}"></td>
|
|
|
|
|
+ </tr>
|
|
|
|
|
+ <tr height="28" style="height:28pt;">
|
|
|
|
|
+ <td colspan="2" align="left" valign="middle" style="${labelLeft}">业务员:${salesmanName}</td>
|
|
|
|
|
+ <td colspan="1" align="left" valign="middle" style="${labelLeft}">制单人:${rowItem.makerName || ''}</td>
|
|
|
|
|
+ <td colspan="1" align="left" valign="middle" style="${labelLeft}">核对人:</td>
|
|
|
|
|
+ <td colspan="2" align="left" valign="middle" style="${labelLeft}">发货人:</td>
|
|
|
|
|
+ </tr>
|
|
|
|
|
+ <tr height="28" style="height:28pt;">
|
|
|
|
|
+ <td colspan="3" align="left" valign="middle" style="${labelLeft}">地址:湖南湘江新区宁乡夏铎铺机械工业园</td>
|
|
|
|
|
+ <td colspan="3" align="left" valign="middle" style="${labelLeft}">客户签字:</td>
|
|
|
|
|
+ </tr>
|
|
|
|
|
+ </table>
|
|
|
|
|
+ <br style="mso-special-character:line-break;page-break-before:always" />`;
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+
|
|
|
|
|
+ const html = `<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40">
|
|
|
|
|
+ <head>
|
|
|
|
|
+ <meta charset="UTF-8" />
|
|
|
|
|
+ <style>
|
|
|
|
|
+ br { mso-data-placement: same-cell; }
|
|
|
|
|
+ table { mso-displayed-decimal-separator:"."; mso-displayed-thousand-separator:","; }
|
|
|
|
|
+ td { mso-ignore:padding; }
|
|
|
|
|
+ </style>
|
|
|
|
|
+ <!--[if gte mso 9]><xml>
|
|
|
|
|
+ <x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet>
|
|
|
|
|
+ <x:Name>${title}</x:Name>
|
|
|
|
|
+ <x:WorksheetOptions>
|
|
|
|
|
+ <x:DefaultRowHeight>260</x:DefaultRowHeight>
|
|
|
|
|
+ <x:Print><x:ValidPrinterInfo/><x:HorizontalResolution>600</x:HorizontalResolution><x:VerticalResolution>600</x:VerticalResolution></x:Print>
|
|
|
|
|
+ <x:Selected/>
|
|
|
|
|
+ <x:DoNotDisplayGridlines/>
|
|
|
|
|
+ </x:WorksheetOptions>
|
|
|
|
|
+ </x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook>
|
|
|
|
|
+ </xml><![endif]-->
|
|
|
|
|
+ </head>
|
|
|
|
|
+ <body>${tables}</body></html>`;
|
|
|
|
|
+
|
|
|
|
|
+ const blob = new Blob(['\uFEFF' + html], {
|
|
|
|
|
+ type: 'application/vnd.ms-excel;charset=utf-8'
|
|
|
|
|
+ });
|
|
|
|
|
+ const firstDocNo = this.formData[0]?.docNo || '';
|
|
|
|
|
+ const suffix = this.formData.length > 1 ? `等${this.formData.length}条` : firstDocNo;
|
|
|
|
|
+ saveAs(blob, `${title}_${suffix}.xls`);
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
-<style lang="scss"></style>
|
|
|
|
|
|
|
+<style scoped lang="scss">
|
|
|
|
|
+ table {
|
|
|
|
|
+ border-collapse: collapse;
|
|
|
|
|
+ }
|
|
|
|
|
+ th, td {
|
|
|
|
|
+ border: 1px solid #000;
|
|
|
|
|
+ text-align: center;
|
|
|
|
|
+ padding: 8px;
|
|
|
|
|
+ }
|
|
|
|
|
+ @media print {
|
|
|
|
|
+ .no-print {
|
|
|
|
|
+ display: none;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+</style>
|