This commit is contained in:
lixin
2018-12-24 19:47:38 +08:00
parent cd052f438f
commit f10c1b1cd3
13 changed files with 562 additions and 61 deletions

View File

@@ -0,0 +1,19 @@
// 导出Excel方法表格id不加扩展名的文件名sheet名
export function exportExcelMethod(tableId, fileName, sheetName) {
tableToExcel(tableId, fileName, sheetName)
}
const tableToExcel = (function() {
const uri = 'data:application/vnd.ms-excel;base64,'
// 设置导出表格的单元格默认高度/宽度/边框样式/字体颜色/背景颜色/居中网页显示表格宽度建议1240tr/td视情况而定
const template = `<html xmlns:x="urn:schemas-microsoft-com:office:excel"><head><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><meta charset="UTF-8"><style type="text/css">table td {border: 1px solid #000000;width:100px;text-align: center;color: #000000;} th {border: 1px solid #000000;width:100px;text-align: center;color: #000000;}</style></head><body><table>{table}</table></body></html>`
const base64 = function(s) { return window.btoa(unescape(encodeURIComponent(s))) }
const format = function(s, c) { return s.replace(/{(\w+)}/g, function(m, p) { return c[p] }) }
return function(table, filename, sheetname) {
if (!table.nodeType) table = document.getElementById(table)
const ctx = { worksheet: sheetname || 'Worksheet', table: table.innerHTML }
const aTag = document.createElement('a')
aTag.href = uri + base64(format(template, ctx))
aTag.download = filename
aTag.click()
}
})()

View File

@@ -1,6 +1,6 @@
<template>
<div class="app-container">
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tabs v-model="activeName">
<el-tab-pane label="采购部采购" name="first">
<el-card>
<span>采购合同编号:</span>
@@ -28,7 +28,6 @@
:value="item.value"/>
</el-select>
<el-button size="small" type="success" icon="el-icon-search" style="margin: 0 0 0 10px" @click="searchPartinfo()">查询</el-button>
<el-button size="small" type="primary" icon="el-icon-download" style="margin: 0 0 0 10px" @click="searchPartinfo()">导出</el-button>
</el-card>
<el-card>
<el-table
@@ -210,6 +209,11 @@
{{ scope.row.到货单号 }}
</template>
</el-table-column>
<el-table-column label="到货日期" align="center" min-width="100">
<template slot-scope="scope">
{{ scope.row.到货日期 }}
</template>
</el-table-column>
<el-table-column label="业务号" align="center" min-width="50">
<template slot-scope="scope">
{{ scope.row.业务号 }}
@@ -245,16 +249,17 @@
{{ scope.row.备注 }}
</template>
</el-table-column>
<el-table-column label="操作" align="center" min-width="200px">
<el-table-column label="操作" align="center" min-width="300px">
<template slot-scope="scope" align="center">
<el-button size="small" type="primary" icon="el-icon-edit" style="margin: 0 0 0 10px" @click="chooseListinfor(scope.row)">编辑</el-button>
<el-button size="small" type="danger" icon="el-icon-delete" style="margin: 0 0 0 10px" @click="dropListinfor(scope.row)">删除</el-button>
<el-button size="small" type="primary" icon="el-icon-download" style="margin: 0 0 0 10px" @click="exportCard(scope.row)">导出</el-button>
</template>
</el-table-column>
</el-table>
<div class="block" style="margin-top: 10px;">
<el-pagination
:current-page="PageCurrent3"
:current-page="pageCurrent3"
:page-sizes="[10, 20, 30, 40]"
:page-size="10"
:total="total3"
@@ -264,7 +269,10 @@
</div>
<el-table
v-loading="listLoading4"
id = "cardDetail"
:data="tableData4"
:summary-method="calculateContractSum"
:show-summary="true"
border
style="width: 100%;"
size="mini"
@@ -294,7 +302,7 @@
{{ scope.row.图号 }}
</template>
</el-table-column>
<el-table-column label="数量" align="center" min-width="100">
<el-table-column label="数量" align="center" min-width="100" prop="数量">
<template slot-scope="scope">
{{ scope.row.数量 }}
</template>
@@ -304,18 +312,126 @@
{{ scope.row.本币单价 }}
</template>
</el-table-column>
<el-table-column label="本币金额" align="center" min-width="100">
<el-table-column label="本币金额" align="center" min-width="100" prop="sum">
<template slot-scope="scope">
{{ scope.row.本币单价 * scope.row.数量 }}
{{ scope.row.sum = scope.row.本币单价 * scope.row.数量 }}
</template>
</el-table-column>
<el-table-column label="操作" align="center" min-width="200">
<el-table-column label="操作" align="center" min-width="80">
<template slot-scope="scope">
<el-button :disabled="scope.row.是否出库" size="small" type="danger" icon="el-icon-delete" style="margin: 0 0 10px 10px" @click="dropCarddetail(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
<el-dialog :visible.sync="dialogVisibleExport" center style="min-height: 300px" width="60%">
<el-card>
<div id="print">
<div style="text-align: center">
<h2> </h2>
<hr>
<table class="tgClass" style="table-layout: fixed; width: 820px;margin: auto">
<colgroup>
<col style="width: 120px">
<col style="width: 250px">
<col style="width: 110px">
<col style="width: 100px">
<col style="width: 120px">
<col style="width: 120px">
</colgroup>
<tr>
<td class="tg-s268">入库单号:</td>
<td class="tg-0lax" style="text-align: left">{{ inbondCard[0] }}</td>
<td class="tg-0lax">入库日期:</td>
<td class="tg-0lax" style="text-align: left">{{ inbondCard[1] }}</td>
<td class="tg-0lax">仓库名称:</td>
<td class="tg-0lax" style="text-align: left">{{ inbondCard[2] }}</td>
</tr>
<tr>
<td class="tg-0lax">订单编号:</td>
<td class="tg-0lax" style="text-align: left">{{ inbondCard[3] }}</td>
<td class="tg-0lax">到货单号:</td>
<td class="tg-0lax" style="text-align: left">{{ inbondCard[4] }}</td>
<td class="tg-0lax">业务编号:</td>
<td class="tg-0lax" style="text-align: left">{{ inbondCard[5] }}</td>
</tr>
<tr>
<td class="tg-0lax">供货单位:</td>
<td class="tg-0lax" style="text-align: left">{{ inbondCard[6] }}</td>
<td class="tg-0lax">部门名称:</td>
<td class="tg-0lax" style="text-align: left">{{ inbondCard[7] }}</td>
<td class="tg-0lax">业务人员:</td>
<td class="tg-0lax" style="text-align: left">{{ inbondCard[8] }}</td>
</tr>
<tr>
<td class="tg-0lax">到货日期:</td>
<td class="tg-0lax" style="text-align: left">{{ inbondCard[9] }}</td>
<td class="tg-0lax">业务类型:</td>
<td class="tg-0lax" style="text-align: left">{{ inbondCard[10] }}</td>
<td class="tg-0lax">采购类型:</td>
<td class="tg-0lax" style="text-align: left">{{ inbondCard[11] }}</td>
</tr>
<tr>
<td class="tg-0lax">入库类别:</td>
<td class="tg-0lax" style="text-align: left">{{ inbondCard[12] }}</td>
<td class="tg-0lax">备注信息:</td>
<td class="tg-0lax" style="text-align: left">{{ inbondCard[13] }}</td>
<td class="tg-0lax"/>
<td class="tg-0lax"/>
</tr>
</table>
</div>
<div style="margin-top: 10px">
<table class="tg" style="table-layout: fixed; width: 820px; margin: auto">
<colgroup>
<col style="width: 150px">
<col style="width: 150px">
<col style="width: 120px">
<col style="width: 100px">
<col style="width: 100px">
<col style="width: 100px">
<col style="width: 100px">
</colgroup>
<tr>
<th class="tg-c3ow">存货编码</th>
<th class="tg-c3ow">存货名称</th>
<th class="tg-c3ow">规格型号</th>
<th class="tg-baqh">零件图号</th>
<th class="tg-c3ow">数量</th>
<th class="tg-c3ow">本币单价</th>
<th class="tg-c3ow">本币金额</th>
</tr>
<tr v-for="(list, index) in tableData4" :key="index">
<td class="tg-c3ow">{{ index + 1 }}</td>
<td class="tg-c3ow">{{ list.名称 }}</td>
<td class="tg-c3ow">{{ list.规格 }}</td>
<td class="tg-baqh">{{ list.零件图号 }}</td>
<td class="tg-c3ow">{{ list.数量 }}</td>
<td class="tg-c3ow">{{ list.本币单价 }}</td>
<td class="tg-c3ow">{{ list.本币单价 * parseInt(list.数量) }}</td>
</tr>
<tr>
<td class="tg-c3ow"/>
<td class="tg-c3ow"/>
<td class="tg-c3ow"/>
<td class="tg-baqh">合计</td>
<td class="tg-c3ow">{{ inbondCard[14] }}</td>
<td class="tg-c3ow">总价</td>
<td class="tg-c3ow">{{ inbondCard[15] }}</td>
</tr>
</table>
</div>
<div style="margin-top: 20px; text-align: right">
<span style="margin-right: 50px">制单人:{{ '李鑫' }}</span>
<span style="margin-right: 50px">审核人:{{ '李鑫' }}</span>
</div>
</div>
</el-card>
<div slot="footer" class="dialog-footer">
<el-button size="small" @click="dialogVisibleExport=false">取消</el-button>
<el-button type="primary" size="small" @click="printCard">打印</el-button>
</div>
</el-dialog>
<el-dialog :visible.sync="dialogVisible1" title="增加采购入库单" center style="min-height: 300px" width="400px">
<el-form ref="form" :model="form" :rules="rules" label-position="left" label-width="110px">
<el-form-item label="合同名称" prop="合同名称">
@@ -368,7 +484,7 @@
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button size="small" @click="dialogVisible1=false">取消</el-button>
<el-button size="small" @click="dialogVisibleExport=false">取消</el-button>
<el-button type="primary" size="small" @click="submitCard">确定</el-button>
</div>
</el-dialog>
@@ -432,8 +548,10 @@
</template>
<script>
import { searchContract, searchInventory, searchInbound, searchShopInbound, searchInboundCard, addInboundCard, searchAffairPeople, addInboundCardDetail, searchInboundCardDetail, deleteInboundCardDetail, searchShopContract } from '@/api/Inventory/InboundCard'
import { searchContract, searchInventory, searchInbound, searchShopInbound, searchInboundCard, addInboundCard, searchAffairPeople, addInboundCardDetail, searchInboundCardDetail, deleteInboundCardDetail, searchShopContract, editInboundCard } from '@/api/Inventory/InboundCard'
import { mapGetters } from 'vuex'
import $ from 'jquery'
export default {
data() {
return {
@@ -490,7 +608,19 @@ export default {
numberGroup: [],
priceGroup: [],
DetailNumber: '',
CardDetailNumber: '' // 入库单明细流水号
CardDetailNumber: '', // 入库单明细流水号
contractSum: '',
total: 0,
pageCurrent: 1,
pageSize: 10,
total2: 0,
pageCurrent2: 1,
pageSize2: 10,
total3: 0,
pageCurrent3: 1,
pageSize3: 10,
dialogVisibleExport: false,
inbondCard: []
}
},
computed: {
@@ -644,7 +774,11 @@ export default {
searchDetail(row) {
this.DetailNumber = row.采购入库单流水号
searchInboundCardDetail(this.DetailNumber).then(response => {
this.tableData4 = response.data
const data = response.data
for (let i = 0; i < data[i].length; i++) {
data[i].数量 = parseInt(data[i].数量)
}
this.tableData4 = data
})
},
// 删除领料单明细
@@ -671,11 +805,117 @@ export default {
message: '已取消删除'
})
})
},
calculateContractSum(param) {
const { columns, data } = param
const sums = []
columns.forEach((column, index) => {
const values = data.map(item => Number(item[column.property]))
if (!values.every(value => isNaN(value))) {
sums[index] = values.reduce((prev, curr) => {
const value = Number(curr)
if (!isNaN(value)) {
return prev + curr
} else {
return prev
}
}, 0)
sums[7] += ' 元'
} else if (index === 4) {
sums[index] = '合计'
return
} else if (index === 6) {
sums[index] = '总价'
return
}
})
return sums
},
handleSizeChange(val) { // 询价单列表分页
this.pageSize = val
},
handleCurrentChange(val) { // 询价单列表分页
this.pageCurrent = val
},
handleSizeChange2(val) { // 询价单列表分页
this.pageSize2 = val
},
handleCurrentChange2(val) { // 询价单列表分页
this.pageCurrent2 = val
},
handleSizeChange3(val) { // 询价单列表分页
this.pageSize2 = val
},
handleCurrentChange3(val) { // 询价单列表分页
this.pageCurrent2 = val
},
editCard() {
editInboundCard(this.CardDetailNumber).then(response => {
if (response.data[0].result === '1') {
this.$message.success('删除成功')
searchInboundCardDetail(this.DetailNumber).then(response => {
this.tableData4 = response.data
})
} else {
this.$message.error('数据占用')
}
})
},
exportCard(row) {
this.dialogVisibleExport = true
this.inbondCard[0] = row.入库单号
this.inbondCard[1] = row.入库日期.substring(0, row.入库日期.length - 8)
this.inbondCard[2] = row.仓库名称
this.inbondCard[3] = row.采购合同编号
this.inbondCard[4] = row.到货单号
this.inbondCard[5] = row.业务号
this.inbondCard[6] = row.供应商名称
this.inbondCard[7] = '库存'
this.inbondCard[8] = row.姓名
this.inbondCard[9] = row.到货日期.substring(0, row.到货日期.length - 8)
this.inbondCard[10] = row.业务类型
this.inbondCard[11] = row.采购类型
this.inbondCard[12] = row.入库类别
this.inbondCard[13] = row.备注
this.DetailNumber = row.采购入库单流水号
searchInboundCardDetail(this.DetailNumber).then(response => {
this.tableData4 = response.data
return this.tableData4
}).then(data => {
var sum = 0
var total = 0
for (let i = 0; i < data.length; i++) {
sum += parseInt(data[i].数量)
total += data[i].本币单价 * parseInt(data[i].数量)
}
this.inbondCard[14] = sum
this.inbondCard[15] = total
})
},
printCard() {
const htmlNode = $('#print').html() // #print为需要打印的dom节点id
const body = $('body')
body.children().hide()
const printNode = $(htmlNode)
body.append(printNode)
window.print()
body.children().show()
printNode.remove()
}
}
}
</script>
<style scoped>
.tg {border-collapse:collapse;border-spacing:0;}
.tg td{font-family:Arial, sans-serif;font-size:14px;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;border-color:black;}
.tg th{font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;border-color:black;}
.tg .tg-baqh{text-align:center;vertical-align:top}
.tg .tg-c3ow{border-color:inherit;text-align:center;vertical-align:top}
.tgClass {border-collapse:collapse;border-spacing:0;}
.tgtgClass td{font-family:Arial, sans-serif;font-size:14px;padding:10px 5px;border-style:solid;border-width:0px;overflow:hidden;word-break:normal;}
.tgtgClass th{font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding:10px 5px;border-style:solid;border-width:0px;overflow:hidden;word-break:normal;}
.tgtgClass .tg-s268{text-align:left}
.tgtgClass .tg-0lax{text-align:left;vertical-align:top}
</style>