Files
JY1.0/src/views/Outsourcing/OutsourcingTaskQuery/index.vue
2020-04-30 17:04:27 +08:00

317 lines
9.0 KiB
Vue

<template>
<div class="app-container">
<el-col :span="10">
<el-card>
<el-input v-model="manufacturers" size="small" placeholder="厂家或外协任务单号" style="width:160px" clearable @keyup.enter.native="pageSize=20;pageList=1;fetchData()"/>
<el-button type="primary" size="mini" icon="el-icon-search" style="margin-left:10px" plain @click="pageSize=10;pageList=1;fetchData()">查询</el-button>
</el-card>
<el-card>
<el-table v-loading="loading2" :data="List" :row-class-name="tableData1ClassName" highlight-current-row size="mini" height="550" border @row-click="searchProcess" >
<el-table-column label="表单号" prop="表单号" align="center" min-width="200px">
<template slot-scope="scope">
{{ scope.row.表单号 }}
</template>
</el-table-column>
<el-table-column label="外协厂家" prop="外协厂家" align="center" min-width="200px">
<template slot-scope="scope">
{{ scope.row.外协厂家名称 }}
</template>
</el-table-column>
</el-table>
<div class="block" style="margin-top: 10px;">
<el-pagination
v-show="!loading2"
:current-page="currentPage"
:page-sizes="[10, 20, 30, 40]"
:page-size="pageSize"
:total="total"
layout="total, sizes, prev, pager, next, jumper"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"/>
</div>
</el-card>
</el-col>
<el-col :span="14">
<el-card>
<el-button v-positive="'loading'" :disabled="loading" type="warning" size="mini" icon="el-icon-arrow-down" style="margin-left:10px" plain @click="getSpareParts">收货</el-button>
<el-table v-loading="loading" :data="List3" border size="mini" height="595" style="width: 100%" @selection-change="handleSelectionChange">
<el-table-column :selectable="selectable" type="selection" align="center" width="55"/>
<el-table-column label="收货状态" width="100" align="center">
<template slot-scope="scope">
<el-tag v-if="scope.row.到货状态===1" type="success" size="small" style="margin: 0px">已收货</el-tag>
<el-tag v-else type="info" size="small" style="margin: 0px">未收货</el-tag>
</template>
</el-table-column>
<el-table-column label="零件图号" align="center" >
<template slot-scope="scope">
{{ scope.row.零件图号 }}
</template>
</el-table-column>
<el-table-column label="零件名称" align="center" >
<template slot-scope="scope">
{{ scope.row.零件名称 }}
</template>
</el-table-column>
<el-table-column label="数量" align="center" >
<template slot-scope="scope">
{{ scope.row.批次数量 }}
</template>
</el-table-column>
<el-table-column label="计划到货日期" align="center" >
<template slot-scope="scope">
{{ scope.row.到货日期 }}
</template>
</el-table-column>
<el-table-column label="到货日期" align="center" >
<template slot-scope="scope">
{{ scope.row.到货时间 }}
</template>
</el-table-column>
</el-table>
</el-card>
</el-col>
</div>
</template>
<script>
import { getTable, Arrival, getParts } from '@/api/Outsourcing/OutsourcingTaskQuery'
import { mapGetters } from 'vuex'
import elInput from 'element-ui/packages/input'
export default {
components: {
elInput
},
data() {
return {
工艺计划流水号: [],
OutsouringNumber: [],
wancheng: '',
gongxulsh: [],
bianliang: [],
card: false,
费用: '',
加工价格合计: 0,
材料价格合计: 0,
其他价格合计: 0,
运费: 0,
总计: 0,
大写金额: '',
任务单号: '',
任务下达日期: '',
外协厂家: '',
外协员: '',
外协员电话: '',
联系人: '',
联系人电话: '',
最早时间: '',
最晚时间: '',
// 以上是新增的
loading: false,
loading1: false,
loading2: false,
num: null,
num1: null,
num2: null,
name1: '',
time: '',
time1: '',
time2: '',
input: '',
contrast: 3000000000000,
contrast1: 0,
param: 0,
partNumber: '',
processingPrice: null,
materialPrice: null,
formNumber: '',
coOperationProcess: [],
ManufactorNumber: null,
ManufactorNumber1: null,
manufacturers: '',
dialogFormVisible: false,
dialogFormVisible1: false,
data2: [],
List: [],
money: null,
sum: 0,
num10: [],
title: '',
result: 0,
documentStatus: null,
sign: null,
Number: null,
form: {
表单号: '',
下达任务日期: '',
外协厂家: '',
运费: null
},
rules: {
外协厂家: [{ required: true, message: '请选择外协厂家', trigger: 'change' }],
运费: [{ required: true, message: '请输入运费', trigger: 'blur' }]
},
code: 0,
code1: 0,
processNum: [],
single: null,
procedure: [],
List1: [],
List2: [],
List3: [],
Explain: '',
freight: null,
defaultProps: {
children: 'children',
label: 'label'
},
process: [[]],
returns: [],
零件图号: [],
零件名称: [],
批次数量: [],
外协预算总价格: [],
加工价格_成交: [],
外协分类: [],
材料费: [],
材料价格_价格: [],
其他价格: [],
机加工开始时间: [],
机加工结束时间: [],
外协加工任务单明细流水号: [],
total: null, // 总条数
pageSize: 20, // 每页显示条数
pageList: 1, // 后台获取页
currentPage: 1 // 显示当前页
}
},
computed: {
...mapGetters([
'sidebar',
'avatar',
'name',
'id'
])
},
created() {
this.fetchData()
},
methods: {
fetchData() {
this.loading2 = true
this.List = []
this.List3 = []
var check
this.manufacturers ? check = 1 : check = 0
getTable(check, this.manufacturers, this.pageList, this.pageSize).then(response => {
this.total = parseInt(response.data.total)
this.List = response.data.rows
this.loading2 = false
})
},
// 控制某行是否可选
selectable(row, index) {
return parseInt(row.到货状态) !== 1 // 已经到货
},
// 查询
searchProcess(row) {
this.loading = true
this.Number = row.外协加工任务单流水号
this.List3 = []
getParts(row.外协加工任务单流水号).then(response => {
this.List3 = response.data
console.log(response.data, 111)
this.loading = false
})
},
handleSelectionChange(val) {
this.OutsouringNumber = []
this.工艺计划流水号 = []
for (let i = 0; i < val.length; i++) {
this.OutsouringNumber.push(val[i].外协加工任务单明细流水号)
this.工艺计划流水号.push(val[i].工艺计划流水号)
}
},
// 收货
getSpareParts() {
if (this.OutsouringNumber.length !== 0) {
this.loading = true
Arrival(this.Number, this.OutsouringNumber, this.工艺计划流水号).then(response => {
if (response.data[0].result === '1') {
this.$message.success('到货成功')
this.fetchData()
getParts(this.Number).then(response => {
this.List3 = response.data
this.loading = false
})
} else {
this.$message.error('到货失败')
}
})
} else {
this.$message.warning('请选择零件')
}
},
tableData1ClassName({ row, rowIndex }) {
row.index = rowIndex
if (row.到货状态 === '1') {
return 'WXDHdh'
}
},
// 分页
handleSizeChange(val) {
this.pageList = 1
this.pageSize = val
this.fetchData()
},
handleCurrentChange(val) {
this.pageList = val
this.fetchData()
}
}
}
</script>
<style scoped>
.el-card{
margin-bottom: 0px;
}
</style>
<style>
.WXDHdh{
background: #9bd7fc !important;
}
td{
width: 100px;
height: 30px;
text-align:center;
}
#tableHead td{
border:1px solid black;
}
.tableData td{
border:1px solid black;
}
#tableFoot td{
border:1px solid black;
}
.tbodyHead td{
text-align: left;
}
.foot td{
width: 7%;
text-align: left;
}
</style>
<style>
.el-table .chajia {
background: #EBF953;
}
.el-table .chengjiao {
background: #AEF199;
}
.el-input__inner {
height: 30px;
}
</style>