Files
JY1.0/src/views/Outsourcing/OutsourcingQCSearch/index.vue
2020-02-07 19:58:22 +08:00

280 lines
12 KiB
Vue

<template>
<div class="app-container">
<el-card>
<el-input v-model="orderNumber" clearable style="width: 210px;margin:0px 10px" placeholder="输入外协到货单或外协厂家" size="small"/>
<!-- <span style="margin-left: 10px">外协厂家:</span>-->
<!-- <el-input v-model="outsourcingSupplier" clearable style="width: 200px;margin:0px 10px" placeholder="请输入外协厂家" size="small"/>-->
<el-button type="success" size="small" icon="el-icon-search" style="margin-left: 10px;" @click="pageCurrent1=1;pageSize1=10;searchTable1()">查询</el-button>
<el-table v-loading="" :data="tableData1" border stripe style="width: 100%;max-height: 600px;" height="400px" size="mini" @row-click="searchTable2">
<el-table-column label="序号" align="center" width="55" type="index"/>
<el-table-column label="外协到货单号" prop="外协到货单编号" align="center" min-width="100">
<template slot-scope="scope">
{{ scope.row.外协到货单编号 }}
</template>
</el-table-column>
<el-table-column label="外协厂家" prop="外协厂家名称" align="center" min-width="100">
<template slot-scope="scope">
{{ scope.row.外协厂家名称 }}
</template>
</el-table-column>
<el-table-column label="创建日期" align="center" min-width="100">
<template slot-scope="scope">
{{ scope.row.操作日期.split(' ')[0] }}
</template>
</el-table-column>
</el-table>
<!-- <div class="block" style="margin: 10px 0;">-->
<!-- <el-pagination-->
<!-- :current-page="pageCurrent1"-->
<!-- :page-sizes="[10, 20, 30, 40]"-->
<!-- :page-size="pageSize1"-->
<!-- :total="total1"-->
<!-- style="display:inline-block;width:50%"-->
<!-- layout="total, sizes, prev, pager, next, jumper"-->
<!-- @size-change="handleSizeChange1"-->
<!-- @current-change="handleCurrentChange1"/>-->
<!-- </div>-->
<el-table v-loading="" :data="tableData2" :summary-method="getSummaries" show-summary border stripe style="width: 100%;min-height: 400px" height="420px" size="mini">
<el-table-column label="序号" align="center" width="50px" type="index"/>
<el-table-column label="零件名称" align="center" min-width="70px">
<template slot-scope="scope">
{{ scope.row.零件名称 }}
</template>
</el-table-column>
<el-table-column label="零件图号" align="center" min-width="120px">
<template slot-scope="scope">
{{ scope.row.零件图号 }}
</template>
</el-table-column>
<el-table-column label="零件数" align="center" width="70px">
<template slot-scope="scope">
{{ scope.row.批次数量 }}
</template>
</el-table-column>
<el-table-column label="质检人员" align="center" width="70px">
<template slot-scope="scope">
{{ scope.row.姓名 }}
</template>
</el-table-column>
<el-table-column label="检验数" align="center" width="70px">
<template slot-scope="scope">
{{ scope.row.数量 || 0 }}
</template>
</el-table-column>
<el-table-column label="不合格数" align="center" min-width="140px">
<template slot-scope="scope">
{{ scope.row.不合格数量 || 0 }}
</template>
</el-table-column>
<el-table-column label="不合格原因" align="center" width="90px">
<template slot-scope="scope">
{{ scope.row.不合格原因文本 }}
</template>
</el-table-column>
<el-table-column label="处理结果" align="center" width="70px">
<template slot-scope="scope">
{{ scope.row.不合格处理文本 }}
</template>
</el-table-column>
<el-table-column label="检验时间" align="center" min-width="135px">
<template slot-scope="scope">
{{ scope.row.操作时间.split(' ')[0] || '—' }}
</template>
</el-table-column>
<el-table-column label="形位" align="center" width="90px">
<template slot-scope="scope">
<el-popover placement="right" width="500" trigger="click">
<el-table :data="gridData" highlight-current-row stripe size="mini">
<el-table-column width="50px" align="center" type="index" label="序号"/>
<el-table-column min-width="150px" align="center" label="类别">
<template slot-scope="scope">
{{ scope.row.类别 }}
</template>
</el-table-column>
<el-table-column min-width="100px" align="center" label="数值">
<template slot-scope="scope">
{{ scope.row.数值 }}
</template>
</el-table-column>
<el-table-column min-width="100" align="center" label="零件数量">
<template slot-scope="scope">
{{ scope.row.零件数量 }}
</template>
</el-table-column>
</el-table>
<el-button slot="reference" type="text" plain size="mini" icon="el-icon-search" @click="searchTableDetail(1, scope.row.外协到货单明细流水号)">形位</el-button>
</el-popover>
</template>
</el-table-column>
<el-table-column label="尺寸" align="center" width="90px">
<template slot-scope="scope">
<el-popover placement="right" width="500" trigger="click">
<el-table :data="gridData" highlight-current-row stripe size="mini">
<el-table-column width="50" align="center" type="index" label="序号"/>
<el-table-column min-width="150" align="center" label="类别">
<template slot-scope="scope">
{{ scope.row.类别 }}
</template>
</el-table-column>
<el-table-column min-width="100" align="center" label="数值">
<template slot-scope="scope">
{{ scope.row.数值 }}
</template>
</el-table-column>
<el-table-column min-width="100" align="center" label="零件数量">
<template slot-scope="scope">
{{ scope.row.零件数量 }}
</template>
</el-table-column>
</el-table>
<el-button slot="reference" type="text" plain size="mini" icon="el-icon-search" @click="searchTableDetail(2, scope.row.外协到货单明细流水号)">尺寸</el-button>
</el-popover>
</template>
</el-table-column>
<el-table-column label="外观" align="center" width="90px">
<template slot-scope="scope">
<el-popover placement="right" width="500" trigger="click">
<el-table :data="gridData" highlight-current-row stripe size="mini">
<el-table-column width="50" align="center" type="index" label="序号"/>
<el-table-column min-width="150" align="center" label="类别">
<template slot-scope="scope">
{{ scope.row.类别 }}
</template>
</el-table-column>
<el-table-column min-width="100" align="center" label="数值">
<template slot-scope="scope">
{{ scope.row.数值 }}
</template>
</el-table-column>
<el-table-column min-width="100" align="center" label="零件数量">
<template slot-scope="scope">
{{ scope.row.零件数量 }}
</template>
</el-table-column>
</el-table>
<el-button slot="reference" type="text" plain size="mini" icon="el-icon-search" @click="searchTableDetail(3, scope.row.外协到货单明细流水号)">外观</el-button>
</el-popover>
</template>
</el-table-column>
</el-table>
</el-card>
</div>
</template>
<script>
import { searchTable1, searchTable2, searchTableDetail } from '@/api/Outsourcing/OutsourcingQCSearch'
export default {
name: 'OutsourcingQCSearch',
data() {
return {
orderNumber: '',
outsourcingSupplier: '',
tableData1: [],
// pageCurrent1: 1,
// pageSize1: 10,
// total1: 0,
tableData2: [],
pageCurrent2: 1,
pageSize2: 10,
total2: 0,
gridData: []
}
},
mounted() {
this.searchTable1()
},
methods: {
// 合计
getSummaries(param) {
const { columns, data } = param
const sums = []
columns.forEach((column, index) => {
if (index === 0) {
sums[index] = '总价'
} else if (index === 3) {
const values = data.map(item => Number(item['批次数量']) || 0)
if (!values.every(value => isNaN(value))) {
sums[index] = values.reduce((prev, curr) => {
const value = Number(curr)
if (!isNaN(value)) {
return Number((prev + curr).toFixed(2))
} else {
return Number((prev).toFixed(2))
}
}, 0)
sums[index] += ''
} else {
sums[index] = 'N/A'
}
} else if (index === 4) {
const values = data.map(item => Number(item['数量']) || 0)
if (!values.every(value => isNaN(value))) {
sums[index] = values.reduce((prev, curr) => {
const value = Number(curr)
if (!isNaN(value)) {
return Number((prev + curr).toFixed(2))
} else {
return Number((prev).toFixed(2))
}
}, 0)
sums[index] += ''
} else {
sums[index] = 'N/A'
}
} else if (index === 5) {
const values = data.map(item => Number(item['不合格数量']) || 0)
if (!values.every(value => isNaN(value))) {
sums[index] = values.reduce((prev, curr) => {
const value = Number(curr)
if (!isNaN(value)) {
return Number((prev + curr).toFixed(2))
} else {
return Number((prev).toFixed(2))
}
}, 0)
sums[index] += ''
} else {
sums[index] = 'N/A'
}
} else if (index === 6) {
sums[index] = '检验比例:' + ((sums[4] / sums[3]) * 100).toFixed(2) + '%'
}
})
return sums
},
// 查询到货单列表
searchTable1() {
let check1, check2
this.orderNumber ? check1 = 1 : check1 = 0
this.outsourcingSupplier ? check2 = 1 : check2 = 0
searchTable1(check1, this.orderNumber, check2, this.outsourcingSupplier).then(response => {
this.tableData1 = response.data
this.total1 = response.data.total
})
},
// handleSizeChange1(val) {
// this.pageSize1 = val
// this.pageCurrent1 = 1
// this.searchTable1()
// },
// handleCurrentChange1(val) {
// this.pageCurrent1 = val
// this.searchTable1()
// },
searchTable2(row) {
searchTable2(row.外协到货单流水号).then(response => {
this.tableData2 = response.data
})
},
searchTableDetail(type, num) {
searchTableDetail(type, num).then(response => {
this.gridData = response.data
})
}
}
}
</script>
<style scoped>
</style>