|
@@ -0,0 +1,384 @@
|
|
|
+<template>
|
|
|
+ <div
|
|
|
+ v-loading="loadingStatus"
|
|
|
+ element-loading-text="获取数据中,请稍后"
|
|
|
+ element-loading-spinner="el-icon-loading"
|
|
|
+ element-loading-background="rgba(0, 0, 0, 0.2)"
|
|
|
+ ref="print"
|
|
|
+ >
|
|
|
+ <div style="border: 1px solid black; height: calc(100vh - 182px - 56px); overflow: auto" id="tableId">
|
|
|
+ <el-table
|
|
|
+ :data="tableList"
|
|
|
+ :cell-style="{ padding: '0' }"
|
|
|
+ :row-style="{ height: '35px' }"
|
|
|
+ header-row-class-name="tableHeader"
|
|
|
+ border
|
|
|
+ height="calc(100vh - 182px - 56px)"
|
|
|
+ :span-method="objectSpanMethod"
|
|
|
+ >
|
|
|
+ <el-table-column label="订单时间" prop="contractTime" width="150" />
|
|
|
+ <el-table-column label="订单号" prop="contractCode" width="154" />
|
|
|
+ <el-table-column label="万里牛单号" prop="tradeNo" width="150" />
|
|
|
+ <el-table-column label="SKU品号" prop="productColorCode" width="120" />
|
|
|
+ <el-table-column label="SKU品名" prop="productColorName" min-width="220" />
|
|
|
+ <el-table-column label="SKU数量" prop="quantity" width="120" />
|
|
|
+ <el-table-column label="BOM品号" prop="bomColorCode" width="120" />
|
|
|
+ <el-table-column label="BOM品名" prop="bomColorName" min-width="320" />
|
|
|
+ <el-table-column label="数量" width="85">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span v-if="scope.row.bomColorQuantity">{{ Number(scope.row.bomColorQuantity) }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="单价" prop="contractTime" width="85">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span v-if="scope.row.dataResource === 1">{{ scope.row.productPrice }}</span>
|
|
|
+ <span v-else>{{ scope.row.price }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="激光LOGO" prop="contractTime" width="85">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span v-if="scope.row.processingLayout === '20' && scope.row.dataResource === 1 && scope.row.processPrice && Number(scope.row.processPrice) !== 0">
|
|
|
+ {{ Number(scope.row.processPrice) }}
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="激光体位线" prop="contractTime" width="85">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span v-if="scope.row.processingLayout === '10' && scope.row.dataResource === 1 && scope.row.processPrice && Number(scope.row.processPrice) !== 0">
|
|
|
+ {{ Number(scope.row.processPrice) }}
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="代发费" prop="contractTime" width="85">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span v-if="scope.row.dataResource === 1 && scope.row.deliverGoodsPrice && Number(scope.row.deliverGoodsPrice) !== 0">
|
|
|
+ {{ Number(scope.row.deliverGoodsPrice) }}
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="快递包材费" prop="contractTime" width="90">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span v-if="scope.row.dataResource === 1 && scope.row.deliverGoodsPrice && Number(scope.row.deliverGoodsPrice) !== 0">
|
|
|
+ {{ Number(scope.row.deliverGoodsPrice) }}
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="包装人工费" prop="contractTime" width="90">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span v-if="scope.row.dataResource === 1 && scope.row.deliverGoodsPrice && Number(scope.row.deliverGoodsPrice) !== 0">
|
|
|
+ {{ Number(scope.row.deliverGoodsPrice) }}
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="SKU单价" prop="skuPrice" width="100" />
|
|
|
+ <el-table-column label="小计" prop="subtotalAmount" width="100" />
|
|
|
+ <el-table-column label="售后数量" prop="aftermarketQuantity" width="100" />
|
|
|
+ <el-table-column label="售后金额" prop="aftermarketAmount" width="100" />
|
|
|
+ <el-table-column label="合计" prop="amount" width="110" />
|
|
|
+ </el-table>
|
|
|
+ <!-- <table class="tableOne" border="0" cellpadding="0" cellspacing="0">
|
|
|
+ <tr>
|
|
|
+ <th colspan="20" style="border-right: 0; border-top: 0">
|
|
|
+ <div style="text-align: center; font-size: 30px; padding: 8px">{{ rowData.subsidiaryName }}-胜德体育体育对账单</div>
|
|
|
+ </th>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <th colspan="20" style="border-bottom: 1px solid black; border-right: 0">
|
|
|
+ <div style="text-align: center; font-size: 18px; padding-bottom: 8px">
|
|
|
+ ( 对账时间: {{ rowData.reconciliationStartTime }} - {{ rowData.reconciliationEndTime }} )
|
|
|
+ </div>
|
|
|
+ </th>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <th style="width: 130px">订单时间</th>
|
|
|
+ <th style="width: 134px">订单号</th>
|
|
|
+ <th style="width: 130px">万里牛单号</th>
|
|
|
+ <th style="width: 100px">SKU品号</th>
|
|
|
+ <th style="min-width: 200px">SKU品名</th>
|
|
|
+ <th style="width: 80px">SKU数量</th>
|
|
|
+ <th style="width: 100px">BOM品号</th>
|
|
|
+ <th style="min-width: 300px">BOM品名</th>
|
|
|
+ <th style="width: 65px">数量</th>
|
|
|
+ <th style="width: 65px">单价</th>
|
|
|
+ <th style="width: 65px">激光LOGO</th>
|
|
|
+ <th style="width: 65px">激光体位线</th>
|
|
|
+ <th style="width: 65px">代发费</th>
|
|
|
+ <th style="width: 70px">快递包材费</th>
|
|
|
+ <th style="width: 70px">包装人工费</th>
|
|
|
+ <th style="width: 80px">SKU单价</th>
|
|
|
+ <th style="width: 80px">小计</th>
|
|
|
+ <th style="width: 80px">售后数量</th>
|
|
|
+ <th style="width: 80px">售后金额</th>
|
|
|
+ <th style="border-right: 0; width: 90px">合计</th>
|
|
|
+ </tr>
|
|
|
+ <tbody v-for="(item, index) in tableList" :key="index">
|
|
|
+ <tr v-for="(itemBom, indexBom) in item.bomDetails" :key="indexBom">
|
|
|
+ <td style="text-align: left; word-break: break-all" v-if="indexBom === 0" :rowspan="item.bomDetails.length">{{ item.contractTime }}</td>
|
|
|
+ <td style="text-align: left; word-break: break-all" v-if="indexBom === 0" :rowspan="item.bomDetails.length">{{ item.contractCode }}</td>
|
|
|
+ <td style="text-align: left; word-break: break-all" v-if="indexBom === 0" :rowspan="item.bomDetails.length">{{ item.tradeNo }}</td>
|
|
|
+ <td style="text-align: left; word-break: break-all" v-if="indexBom === 0" :rowspan="item.bomDetails.length">{{ item.productColorCode }}</td>
|
|
|
+ <td style="text-align: left; word-break: break-all" v-if="indexBom === 0" :rowspan="item.bomDetails.length">{{ item.productColorName }}</td>
|
|
|
+ <td v-if="indexBom === 0" :rowspan="item.bomDetails.length">
|
|
|
+ <span v-if="item.quantity">{{ Number(item.quantity) }}</span>
|
|
|
+ <span v-else>0</span>
|
|
|
+ </td>
|
|
|
+ <td style="text-align: left; word-break: break-all">{{ itemBom.bomColorCode }}</td>
|
|
|
+ <td style="text-align: left; word-break: break-all">{{ itemBom.bomColorName }}</td>
|
|
|
+ <td>
|
|
|
+ <span v-if="itemBom.bomColorQuantity">{{ Number(itemBom.bomColorQuantity) }}</span>
|
|
|
+ </td>
|
|
|
+ <td>
|
|
|
+ <span v-if="itemBom.dataResource === 1">{{ item.productPrice }}</span>
|
|
|
+ <span v-else>{{ itemBom.price }}</span>
|
|
|
+ </td>
|
|
|
+ <td>
|
|
|
+ <span v-if="item.processingLayout === '20' && itemBom.dataResource === 1 && item.processPrice && Number(item.processPrice) !== 0">{{
|
|
|
+ item.processPrice
|
|
|
+ }}</span>
|
|
|
+ </td>
|
|
|
+ <td>
|
|
|
+ <span v-if="item.processingLayout === '10' && itemBom.dataResource === 1 && item.processPrice && Number(item.processPrice) !== 0">{{
|
|
|
+ item.processPrice
|
|
|
+ }}</span>
|
|
|
+ </td>
|
|
|
+ <td>
|
|
|
+ <span v-if="itemBom.dataResource === 1 && item.deliverGoodsPrice && Number(item.deliverGoodsPrice) !== 0">{{ item.deliverGoodsPrice }}</span>
|
|
|
+ </td>
|
|
|
+ <td>
|
|
|
+ <span v-if="itemBom.dataResource === 1 && item.expressPrice && Number(item.expressPrice) !== 0">{{ item.expressPrice }}</span>
|
|
|
+ </td>
|
|
|
+ <td>
|
|
|
+ <span v-if="itemBom.dataResource === 1 && item.expensePrice && Number(item.expensePrice) !== 0">{{ item.expensePrice }}</span>
|
|
|
+ </td>
|
|
|
+ <td v-if="indexBom === 0" :rowspan="item.bomDetails.length">
|
|
|
+ <span>{{ item.skuPrice }}</span>
|
|
|
+ </td>
|
|
|
+ <td v-if="indexBom === 0" :rowspan="item.bomDetails.length">
|
|
|
+ <span>{{ item.subtotalAmount }}</span>
|
|
|
+ </td>
|
|
|
+ <td v-if="indexBom === 0" :rowspan="item.bomDetails.length">
|
|
|
+ <span v-if="item.aftermarketQuantity && Number(item.aftermarketQuantity) !== 0">{{ item.aftermarketQuantity }}</span>
|
|
|
+ </td>
|
|
|
+ <td v-if="indexBom === 0" :rowspan="item.bomDetails.length">
|
|
|
+ <span v-if="item.aftermarketAmount && Number(item.aftermarketAmount) !== 0">-{{ item.aftermarketAmount }}</span>
|
|
|
+ </td>
|
|
|
+ <td style="border-right: 0" v-if="indexBom === 0" :rowspan="item.bomDetails.length">
|
|
|
+ <span>{{ item.amount }}</span>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </tbody>
|
|
|
+ <tr>
|
|
|
+ <td>总计:</td>
|
|
|
+ <td colspan="18"></td>
|
|
|
+ <td style="border-right: 0">
|
|
|
+ <span>{{ getAggregate() }}</span>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td>备注:</td>
|
|
|
+ <td colspan="19" style="border-right: 0"></td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td>交货地点:</td>
|
|
|
+ <td colspan="19" style="border-right: 0"></td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td colspan="3" style="padding: 8px 4px; font-size: 16px; font-weight: 700; text-align: left; border-right: 0">申请人:</td>
|
|
|
+ <td colspan="5" style="padding: 8px 4px; font-size: 16px; font-weight: 700; text-align: left; border-right: 0">胜德体育体育总经理:</td>
|
|
|
+ <td colspan="12" style="padding: 8px 4px; font-size: 16px; font-weight: 700; text-align: left; border-right: 0">申请日期:</td>
|
|
|
+ </tr>
|
|
|
+ </table> -->
|
|
|
+ </div>
|
|
|
+ <div style="width: 100%; text-align: center; margin-top: 16px" class="no-print">
|
|
|
+ <el-button type="primary" size="small" @click="clickExcel">导出Excel</el-button>
|
|
|
+ <el-button type="primary" size="small" @click="clickPrint">打印</el-button>
|
|
|
+ <el-button size="small" @click="clickCancel">关 闭</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { summaryPrintDetail } from '@/api/shengde/group/finance/summary'
|
|
|
+import { editAmount } from '@/api/shengde/group/finance/reconciliation'
|
|
|
+import $ from 'jquery'
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: 'summaryPrint',
|
|
|
+ props: {
|
|
|
+ rowData: Object,
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ loadingStatus: false,
|
|
|
+ loadingText: '',
|
|
|
+ tableList: [],
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getDetails()
|
|
|
+ },
|
|
|
+ mounted() {},
|
|
|
+ methods: {
|
|
|
+ getDetails() {
|
|
|
+ this.loadingStatus = true
|
|
|
+ summaryPrintDetail({ id: this.rowData.id }).then(
|
|
|
+ (res) => {
|
|
|
+ let table = []
|
|
|
+ res.data.data.map((item) => {
|
|
|
+ if (item.bomDetails && item.bomDetails.length > 0) {
|
|
|
+ item.bomDetails.map((itemBom) => {
|
|
|
+ table.push({
|
|
|
+ contractTime: item.contractTime,
|
|
|
+ contractCode: item.contractCode,
|
|
|
+ tradeNo: item.tradeNo,
|
|
|
+ productColorCode: item.productColorCode,
|
|
|
+ productColorName: item.productColorName,
|
|
|
+ quantity: item.quantity,
|
|
|
+ bomColorCode: itemBom.bomColorCode,
|
|
|
+ bomColorName: itemBom.bomColorName,
|
|
|
+ bomColorQuantity: itemBom.bomColorQuantity,
|
|
|
+ price: itemBom.price,
|
|
|
+ productPrice: item.productPrice,
|
|
|
+ processPrice: item.processPrice,
|
|
|
+ deliverGoodsPrice: item.deliverGoodsPrice,
|
|
|
+ expressPrice: item.expressPrice,
|
|
|
+ expensePrice: item.expensePrice,
|
|
|
+ skuPrice: item.skuPrice,
|
|
|
+ subtotalAmount: item.subtotalAmount,
|
|
|
+ aftermarketQuantity: item.aftermarketQuantity,
|
|
|
+ aftermarketAmount: item.aftermarketAmount,
|
|
|
+ amount: item.amount,
|
|
|
+ dataResource: itemBom.dataResource,
|
|
|
+ processingLayout: item.processingLayout,
|
|
|
+ })
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.tableList = Object.freeze(this.mergeRow(table))
|
|
|
+ this.loadingStatus = false
|
|
|
+ let data = {
|
|
|
+ id: this.rowData.id,
|
|
|
+ amount: Number(this.getAggregate()),
|
|
|
+ }
|
|
|
+ editAmount(data).then()
|
|
|
+ },
|
|
|
+ (err) => {
|
|
|
+ this.loadingStatus = false
|
|
|
+ console.log('summaryPrintDetail: ' + err)
|
|
|
+ }
|
|
|
+ )
|
|
|
+ },
|
|
|
+ clickPrint() {
|
|
|
+ this.$print(this.$refs.print)
|
|
|
+ },
|
|
|
+ clickExcel() {
|
|
|
+ $('#tableId').table2excel({
|
|
|
+ exclude: '.noExl',
|
|
|
+ sheetName: '销售对账汇总',
|
|
|
+ filename: '销售对账汇总',
|
|
|
+ exclude_img: false,
|
|
|
+ exclude_links: false,
|
|
|
+ exclude_inputs: true,
|
|
|
+ })
|
|
|
+ },
|
|
|
+ clickCancel() {
|
|
|
+ this.$emit('clickCancel', false)
|
|
|
+ },
|
|
|
+ getAggregate() {
|
|
|
+ let allMoney = 0
|
|
|
+ if (this.tableList && this.tableList.length > 0) {
|
|
|
+ this.tableList.map((item) => {
|
|
|
+ if (item.bomDetails && item.bomDetails.length > 0) {
|
|
|
+ item.bomDetails.map((itemBom) => {
|
|
|
+ if (itemBom.amount) {
|
|
|
+ allMoney = parseFloat(Number(allMoney) + Number(itemBom.amount)).toFixed(2)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ return allMoney
|
|
|
+ },
|
|
|
+ mergeRow(list) {
|
|
|
+ for (let field in list[0]) {
|
|
|
+ let k = 0
|
|
|
+ let i = 0
|
|
|
+ while (k < list.length) {
|
|
|
+ list[k][field + 'Span'] = 1
|
|
|
+ list[k][field + 'Dis'] = false
|
|
|
+ for (i = k + 1; i <= list.length - 1; i++) {
|
|
|
+ if (
|
|
|
+ list[k][field] === list[i][field] &&
|
|
|
+ list[k].contractTime === list[i].contractTime &&
|
|
|
+ list[k].contractCode === list[i].contractCode &&
|
|
|
+ list[k].tradeNo === list[i].tradeNo &&
|
|
|
+ list[k].productColorCode === list[i].productColorCode &&
|
|
|
+ list[k].productColorName === list[i].productColorName
|
|
|
+ ) {
|
|
|
+ list[k][field + 'Span']++
|
|
|
+ list[k][field + 'Dis'] = false
|
|
|
+ list[i][field + 'Span'] = 1
|
|
|
+ list[i][field + 'Dis'] = true
|
|
|
+ } else {
|
|
|
+ break
|
|
|
+ }
|
|
|
+ }
|
|
|
+ k = i
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return list
|
|
|
+ },
|
|
|
+ objectSpanMethod({ rowIndex, columnIndex }) {
|
|
|
+ if ([0, 1, 2, 3, 4, 5, 15, 16, 17, 18, 19].includes(columnIndex)) {
|
|
|
+ let spanName = [
|
|
|
+ 'contractTime',
|
|
|
+ 'contractCode',
|
|
|
+ 'tradeNo',
|
|
|
+ 'productColorCode',
|
|
|
+ 'productColorName',
|
|
|
+ 'quantity',
|
|
|
+ 'skuPrice',
|
|
|
+ 'subtotalAmount',
|
|
|
+ 'aftermarketQuantity',
|
|
|
+ 'aftermarketAmount',
|
|
|
+ 'amount',
|
|
|
+ ]
|
|
|
+ const row1 = this.tableList[rowIndex][spanName[columnIndex] + 'Span']
|
|
|
+ const colspan = this.tableList[rowIndex][spanName[columnIndex] + 'Dis'] ? 0 : 1
|
|
|
+ const rowspan = colspan === 1 ? row1 : 0
|
|
|
+ return {
|
|
|
+ rowspan: rowspan,
|
|
|
+ colspan: colspan,
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.tableOne {
|
|
|
+ border-top: 1px solid black;
|
|
|
+ border-bottom: 1px solid black;
|
|
|
+ line-height: 20px;
|
|
|
+ overflow: auto;
|
|
|
+ width: 130%;
|
|
|
+}
|
|
|
+.tableOne th {
|
|
|
+ font-weight: 700;
|
|
|
+ border-right: 1px solid black;
|
|
|
+}
|
|
|
+.tableOne td {
|
|
|
+ border-right: 1px solid black;
|
|
|
+ border-top: 1px solid black;
|
|
|
+ text-align: center;
|
|
|
+ padding: 4px;
|
|
|
+}
|
|
|
+::v-deep {
|
|
|
+ .tableHeader th {
|
|
|
+ background-color: #edf0f5;
|
|
|
+ height: 35px;
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|