Files
JY1.0/src/views/ManufacturingCenter/CreatePreparationBill/index.vue
Vergil c5bc4b54db a
2020-05-19 10:11:22 +08:00

350 lines
12 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<div>
<el-card style="width: 1030px">
<el-col style="margin: 5px">
<el-input v-model="partName" placeholder="零件图号或名称" size="small" clearable style="width:180px;margin: 3px 0"/>
<el-button size="small" icon="el-icon-search" type="primary" plain style="margin-left: 10px" @click="pageSize=30; pageCurrent=1;searchTable()">查询</el-button>
<el-tooltip :open-delay="1200" effect="dark" content="打印备料单" placement="top"/>
<el-tooltip :open-delay="1200" effect="dark" content="将选中零件分配为外购备料" placement="top">
<el-button :loading="edit2_loading" type="primary" size="small" icon="el-icon-s-shop" plain style="margin-left: 50px" @click="edit2()">外购备料</el-button>
</el-tooltip>
<el-tooltip :open-delay="1200" effect="dark" content="将选中零件分配为自家备料" placement="top">
<el-button :loading="edit_loading" type="distribution" size="small" icon="el-icon-setting" style="margin-left:20px" @click="edit('BL')">自家备料</el-button>
</el-tooltip>
<el-tooltip :open-delay="1200" effect="dark" content="已导出和未导出备料单" placement="top">
<el-checkbox v-model="all" size="small" style="float: right;margin: 8px 10px 0 0">查询全部</el-checkbox>
</el-tooltip>
</el-col>
</el-card>
<el-card style="width: 1030px">
<el-table
v-loading="loading"
:data="tableData"
:header-cell-style="{fontFamily:'YouYuan',fontSize:'14px',fontWeight:200}"
height="760"
style="width: 1015px; margin: 3px 0"
size="mini"
border
stripe
sortable
highlight-current-row
element-loading-text="拼命加载中"
@sort-change="sortChange"
@selection-change="handleSelectionChange">
<!--<el-table v-loading="loading" :data="tableData" height="760" style="width: 1126px; margin: 3px 0" size="mini" border stripe highlight-current-row element-loading-text="拼命加载中" @selection-change="handleSelectionChange">-->
<el-table-column :selectable="checkboxT" type="selection" width="50" align="center"/>
<el-table-column label="进程" prop="备料分配" align="center" width="70" show-overflow-tooltip>
<template slot-scope="scope">
<span v-if="scope.row.备料打印 ==='1' && scope.row.是否外购备料==='0'" type="success" size="mini">自家</span>
<span v-if="scope.row.备料打印 ==='0' && scope.row.是否外购备料==='1'" type="success" size="mini">外购</span>
<span v-if="scope.row.备料打印 ==='0' && scope.row.是否外购备料==='0'" type="warning" size="mini">未分配</span>
<span v-if="scope.row.备料打印 ==='1' && scope.row.是否外购备料==='1'" type="warning" size="mini">自家&外购</span>
</template>
</el-table-column>
<el-table-column label="零件名称" prop="零件名称" align="center" width="140px" sortable="custom" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.零件名称 }}
</template>
</el-table-column>
<el-table-column label="零件图号" prop="零件图号" align="center" width="180px" sortable="custom" show-overflow-tooltip>
<!--<el-table-column label="零件图号" prop="零件图号" align="center" width="180" show-overflow-tooltip>-->
<template slot-scope="scope">
{{ scope.row.零件图号 }}
</template>
</el-table-column>
<el-table-column label="数量" align="center" width="80">
<template slot-scope="scope">
{{ scope.row.批次数量 }}
</template>
</el-table-column>
<el-table-column label="材料" align="center" width="150" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.材料 }}
</template>
</el-table-column>
<el-table-column label="重量(KG)" align="center" width="80" >
<template slot-scope="scope">
{{ scope.row.重量 }}
</template>
</el-table-column>
<el-table-column label="工艺要求" align="center" width="160" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.工艺要求 }}
</template>
</el-table-column>
<el-table-column label="接收时间" align="center" width="90" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.备料任务接受时间 | formatTime }}
</template>
</el-table-column>
<!--<el-table-column label="分配时间" align="center" width="90" show-overflow-tooltip>-->
<!--<template slot-scope="scope">-->
<!--{{ scope.row.备料任务分配时间 | formatTime }}-->
<!--</template>-->
<!--</el-table-column>-->
</el-table>
<span style="font-size: 5px">{{ totalnumber }}条信息选择{{ gouxuan }}</span>
<div class="block">
<el-pagination
v-if="!loading"
:current-page="pageCurrent"
:page-sizes="[10, 20, 30, 40, 100]"
:page-size="pageSize"
:total="total"
layout="total, sizes, prev, pager, next, jumper"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"/>
</div>
</el-card>
<div v-show="false" id="BL">
<table border cellspacing="0px" style="table-layout: fixed; width: 600px;">
<colgroup>
<col style="width: 120px">
<col style="width: 180px">
<col style="width: 110px">
<col style="width: 110px">
<col style="width: 110px">
<col style="width: 450px">
</colgroup>
<tr>
<th colspan="2" height="60px">GAOJING</th>
<th colspan="4" height="60px"><span style="font-weight:bold">备料单</span></th>
</tr>
<tr>
<td align="center">零件名称</td>
<td align="center">零件图号</td>
<td align="center">材料</td>
<td align="center">原材料规格</td>
<td align="center">批次数量</td>
<td align="center">备料</td>
</tr>
<tr v-for="(list, index) in tableData2" :key="index">
<td align="center">{{ list.零件名称 }}</td>
<td align="center">{{ list.零件图号 }}</td>
<td align="center">{{ list.材料 }}</td>
<td align="center">{{ list.原材料规格 }}</td>
<td align="center">{{ list.批次数量 }}</td>
<td>{{ list.工艺要求 }}</td>
</tr>
</table>
</div>
</div>
</template>
<script>
import { searchtable, edit, edit2, getExport } from '@/api/ManufacturingCenter/CreatePreparationBill'
import { exportExcelMethod } from './exportExcel'
import $ from 'jquery'
export default {
data() {
return {
edit2_loading: false,
edit_loading: false,
a: 0,
tableData2: [],
partName: '',
all: false,
loading: false,
Data: [],
tableData: [], // 表格数据
total: null, // 总条数
pageSize: 30, // 每页显示条数
pageCurrent: 1, // 后台获取页
ordername: '',
order: '',
gouxuan: 0,
totalnumber: 0
}
},
created() {
this.searchTable()
},
methods: {
// 复选框
checkboxT(row, rowIndex) {
if (row.备料打印 === '0' && row.是否外购备料 === '0') {
// if(row.lie =='1'){
return true// 禁用
} else {
return false// 不禁用
}
},
sortChange(column, prop, order) {
console.log(column + '-' + column.prop + '-' + column.order, 11111)
if (column.prop === '零件名称') {
this.ordername = 1
} else if (column.prop === '零件图号') { this.ordername = 2 } else {
this.ordername = ''
}
console.log(this.ordername, 9990999)
if (column.order === 'ascending') {
this.order = 1
} else if (column.order === 'descending') { this.order = 2 } else {
this.order = ''
}
this.searchTable()
},
exportTable() {
if (this.tableData2.length === 0) {
this.$message.warning('暂无数据')
} else {
const htmlNode = $('#BL').html()
const body = $('body')
body.children().hide()
const printNode = $(htmlNode)
body.append(printNode)
window.print()
body.children().not('script').show()
printNode.remove()
}
},
// 查询表格数据
searchTable() {
this.loading = true
this.tableData = []
this.Data = []
if (this.partName !== '' && this.partName !== null) {
this.partNamecheck = true
} else {
this.partNamecheck = false
}
searchtable(this.partNamecheck, this.partName, !this.all, 0, this.pageCurrent, this.pageSize, this.ordername, this.order).then(response => {
if (response.data.total === 0) {
this.loading = false
} else {
// this.tableData.push({
// 重量: response.data.rows[0].重量
// })
this.totalnumber = response.data.rows.length
this.tableData = response.data.rows
this.total = response.data.total
this.loading = false
}
})
},
handleSelectionChange(val) {
this.tableData2 = []
this.tableData2 = val
this.gouxuan = val.length
},
edit() {
this.edit_loading = true
var that = this
setTimeout(function() {
that.edit_loading = false
}, 5000)
if (this.tableData2.length === 0) {
this.edit_loading = false
this.$message.warning('暂无数据')
} else {
this.a = 0
for (let i = 0; i < this.tableData2.length; i++) {
edit(this.tableData2[i].工艺计划流水号).then(response => {
this.a += parseInt(response.data[0].result)
if (this.a === this.tableData2.length) {
this.pageSize = 10
this.pageCurrent = 1
this.searchTable()
}
})
}
}
},
edit2() {
this.edit2_loading = true
var that = this
setTimeout(function() {
that.edit2_loading = false
}, 5000)
if (this.tableData2.length === 0) {
this.edit2_loading = false
this.$message.warning('暂无数据')
} else {
this.a = 0
for (let i = 0; i < this.tableData2.length; i++) {
edit2(this.tableData2[i].工艺计划流水号, this.$store.state.user.id).then(response => {
this.a += parseInt(response.data[0].result)
if (this.a === this.tableData2.length) {
this.pageSize = 10
this.pageCurrent = 1
this.searchTable()
}
})
}
}
},
downLoad(tableid) {
if (this.tableData2.length === 0) {
this.$message.warning('暂无数据')
} else {
exportExcelMethod(tableid, '123', 'asd')
}
},
// 分页
handleSizeChange(val) {
this.pageCurrent = 1
this.pageSize = val
this.searchTable()
},
handleCurrentChange(val) {
this.pageCurrent = val
this.searchTable()
},
exportExcel() {
if (this.partName !== '' && this.partName !== null) {
this.partNamecheck = true
} else {
this.partNamecheck = false
}
getExport(this.partNamecheck, this.partName, !this.all, 0).then(res => {
console.log(res.data)
import('@/vendor/Export2Excel').then(excel => {
const tHeader = ['备料分配', '零件名称', '零件图号', '数量', '材料', '重量', '工艺要求']
const filterVal = ['分配状态', '零件名称', '零件图号', '批次数量', '材料', '重量', '工艺要求']
const list = res.data
const data = this.formatJson(filterVal, list)
excel.export_json_to_excel({
header: tHeader,
data,
filename: '备料分配表',
autoWidth: true,
bookType: 'xlsx'
})
})
})
},
formatJson(filterVal, jsonData) {
return jsonData.map(v => filterVal.map(j => {
return v[j]
}))
}
}
}
</script>
<style scoped>
</style>
<style lang="scss">
.button111{
background:rgb(253,246,236);
border-color: #ff9759;
color: #ff9759;
&:hover{
background: #ff9759;
border-color: #ff9759;
color: white;
}
&:focus{
background: #ff9759;
border-color: #ff9759;
color: white;
}
}
</style>