Files
JY1.0/src/views/Assembly/TypicalAssemblyMaintenance/index.vue
liushuai ae627cc871 刘帅
2018-12-25 10:55:47 +08:00

478 lines
17 KiB
Vue

<template>
<div class="app-container">
<el-card style="margin-bottom: 20px">
<span>机床分类:</span>
<el-select v-model="machineTypeValue" placeholder="机床分类" size="small" style="width:150px" @change="SearchMachine">
<el-option
v-for="item in machineType"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
<span>机床编号:</span>
<el-select v-model="machineNumberValue1" placeholder="机床编号" size="small" style="width:150px" @change="searchGroup()">
<el-option
v-for="item in machineNumber2"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
<el-button type="success" icon="el-icon-search" style="margin-left: 10px;" size="small" @click="searchDetail">查询</el-button>
<el-button type="primary" size="small" icon="el-icon-tickets" @click="handleAdd">增加</el-button>
<el-button type="danger" size="small" icon="el-icon-delete" @click="deleteTable">删除</el-button>
</el-card>
<el-card style="background-color: #DCDCDC">
<div v-for="(item, key) in dataAll" :key="key" style="margin-bottom: 30px">
<el-table
:data="item.table1"
border
style="width: 100%;margin-top: 15px">
<el-table-column
label="序号"
width="80"
align="center">
<template slot-scope="scope">
{{ scope.row.序号 }}
</template>
</el-table-column>
<el-table-column
label="组号"
width="240"
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" width="300">
<template slot-scope="scope">
<el-button
size="mini"
icon="el-icon-edit"
type="primary"
@click="handleEdit(scope.row, 'form2')">编辑</el-button>
<el-button
size="mini"
icon="el-icon-delete"
type="danger"
@click="deleteGroup(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<el-table :data="item.table2" size="mini" border style="width: 100%">
<el-table-column label="序号" width="90" align="center">
<template slot-scope="scope">
<el-input v-model="scope.row.序号" size="mini" style="width:60px" @change="update(scope.row)"/>
</template>
</el-table-column>
<el-table-column label="工序名称" width="230" align="center">
<template slot-scope="scope">
<el-input
v-model="scope.row.工序名称"
size="mini"
style="width:200px"
@dblclick.native="tableSearch(scope.row)"
@change="update(scope.row)"/>
</template>
</el-table-column>
<el-table-column label="工艺内容及装配具体要求" align="center">
<template slot-scope="scope">
<el-input
v-model="scope.row.工艺内容及装配具体要求"
:rows="1"
size="mini"
type="textarea"
@change="update(scope.row)"/>
</template>
</el-table-column>
<el-table-column label="质检" align="center" width="120">
<template slot-scope="scope">
<el-input v-model="scope.row.质检" size="mini" align="center" @change="update(scope.row)"/>
</template>
</el-table-column>
<el-table-column label="工艺工时" align="center" width="120">
<template slot-scope="scope">
<el-input v-model="scope.row.工艺工时" size="mini" align="center" @change="update2(scope.row)"/>
</template>
</el-table-column>
<el-table-column label="操作" align="center" width="300">
<template slot-scope="scope">
<el-button
size="mini"
icon="el-icon-arrow-up"
type="primary"
@click="upOne(scope.row)"/>
<el-button
size="mini"
icon="el-icon-arrow-down"
type="primary"
@click="downOne(scope.row)"/>
<el-button
size="mini"
icon="el-icon-circle-plus-outline"
type="primary"
@click="insertOne(scope.row)"/>
<el-button
size="mini"
icon="el-icon-delete"
type="danger"
@click="deleteOne(scope.row)"/>
</template>
</el-table-column>
</el-table>
</div>
</el-card>
<el-dialog :visible.sync="dialogFormVisible2" title="工序名称、工序要求选择" center width="400px">
<el-form ref="form1" :model="form1" label-position="left" label-width="125px" class="demo-ruleForm">
<el-form-item label="工序名称分类">
<el-select v-model="processNameClassValue" placeholder="分类" size="small" @change="cChange()">
<el-option
v-for="item in processNameClass"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
</el-form-item>
<el-form-item label="工序名称">
<el-select v-model="processNameValue" placeholder="名称" size="small" @change="nChange()">
<el-option
v-for="item in processName"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
</el-form-item>
<el-form-item label="工序要求">
<el-input v-model="processRequestValue" placeholder="要求" size="small"/>
</el-form-item>
<el-form-item>
<el-button size="mini" type="primary" @click="confirmSelect()">确定选择</el-button>
</el-form-item>
</el-form>
</el-dialog>
<el-dialog :title="title" :visible.sync="dialogFormVisible4" center width="400px">
<el-form ref="form2" :model="form2" :rules="rules" label-position="left" label-width="125px" class="demo-ruleForm">
<el-form-item label="序号" prop="序号">
<el-input v-model="form2.序号" placeholder="序号" size="small"/>
</el-form-item>
<el-form-item label="组件" prop="组件">
<el-select v-model="form2.组件" multiple placeholder="组件" size="small">
<el-option
v-for="item in GroupNumber"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
</el-form-item>
<el-form-item label="装配任务" prop="装配任务">
<el-input v-model="form2.装配任务" placeholder="装配任务" type="textarea" size="small"/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible4=false">取消</el-button>
<el-button v-show="title==='增加组件工艺'" type="primary" @click="submitAdd()">确定</el-button>
<el-button v-show="title==='编辑组件工艺'" type="primary" @click="submitEdit()">确定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { SearchMachine, searchDetail, searchProcess, update, submitAdd, submitEdit, insertOne, update2, upOne, downOne, deleteOne,
deleteGroup, initmachineType, initprocessNameClass, initProcessName, update1, searchGroup } from '@/api/Assembly/TypicalAssemblyMaintenance'
import '@/icon/iconfont.css'
export default {
data() {
return {
title: '',
radio: 0,
checked: false,
number: '',
machineNumberValue1: '',
machineNumber2: [],
machineTypeValue: '',
machineType: [],
AssemblyTask: '',
Group: '',
GroupNumberValue: [],
GroupNumberValue1: '',
GroupNumber: [],
GroupNum: '',
GroupProcessNumber: '',
SerialNumber: '',
SerialNumberGroup: [],
isShow2: false,
processNameClassValue: '',
processNameClass: [],
processNameValue: '',
Process: '',
processName: [],
Procedure: '',
ProcedureNameGroup: [],
processRequestValue: '',
ProcessContentGroup: [],
QualityTesting: [],
ProcessSequence: [],
tableData: [],
tableData1: [],
tableData2: [],
tableData3: [],
loading: false,
form1: {},
form2: {
序号: '',
组件: [],
装配任务: ''
},
rules: {
序号: [{ required: true, message: '请输入序号', trigger: 'blur' }],
组件: [{ required: true, message: '请选择组件', trigger: 'change' }],
装配任务: [{ required: true, message: '请输入装配任务', trigger: 'blur' }]
},
num1: '',
result: 0,
dialogFormVisible2: false,
dialogFormVisible4: false,
dataAll: []
}
},
created() {
this.fetchData()
},
methods: {
fetchData() {
initprocessNameClass().then(response => { // 初始化工序分类
for (let i = 0; i < response.data.length; i++) {
this.processNameClass.push({
label: response.data[i].工序分类名称,
value: response.data[i].工序分类流水号
})
}
})
initmachineType().then(response => { // 初始化机床分类
for (let i = 0; i < response.data.length; i++) {
this.machineType.push({
label: response.data[i].机床分类名称,
value: response.data[i].机床分类流水号
})
}
})
},
SearchMachine() {
this.machineNumberValue1 = ''
this.machineNumber2 = []
SearchMachine(this.machineTypeValue).then(response => { // 典型机床查询
for (let i = 0; i < response.data.length; i++) {
this.machineNumber2.push({
label: response.data[i].机床图号,
value: response.data[i].机床流水号
})
}
})
},
searchGroup() {
this.GroupNumber = []
this.GroupNumberValue = []
searchGroup(this.machineNumberValue1).then(response => {
for (let i = 0; i < response.data.length; i++) {
this.GroupNumber.push({
label: response.data[i].组号,
value: response.data[i].组件流水号
})
}
})
},
async searchDetail() { // 主表查询
this.dataAll = []
if (this.machineNumberValue1 !== '') {
const response = await searchDetail(this.machineNumberValue1)
const data = response.data
for (let i = 0; i < data.length; i++) {
const response2 = await searchProcess(data[i].组件工艺流水号)
this.dataAll.push({
table1: [data[i]],
table2: response2.data
})
}
} else {
this.$message.warning('请先选择机床编号')
}
},
update(row) {
update(row.装配工序流水号, row.序号, row.工序名称, row.工艺内容及装配具体要求, row.质检).then(response => {
console.log(response.data, '工艺要求修改成功', 505)
})
},
update2(row) {
update2(row.装配工序流水号, row.工艺工时).then(response => {
console.log(response.data, '工艺要求修改成功', 505)
})
},
handleAdd() {
if (this.machineNumberValue1 !== '') {
this.addForm('form2', [this.dialogFormVisible4 = true, this.title = '增加组件工艺', this.Group = '', this.GroupNumberValue1 = ''])
} else {
this.$message.warning('请先选择机床编号')
}
},
handleEdit(row, formName) {
if (this.$refs[formName] !== undefined) {
this.$refs[formName].resetFields()
}
this.GroupProcessNumber = row.组件工艺流水号
this.GroupNumberValue1 = ''
this.title = '编辑组件工艺'
this.dialogFormVisible4 = true
this.form2.序号 = row.序号
this.form2.装配任务 = row.装配任务
this.Group = ''
console.log(row, 1111)
this.form2.组件 = (row.组件流水号.split(',')).map(Number)
console.log(this.form2.组件)
},
submitAdd() {
this.GroupNumberValue1 = this.form2.组件[0]
for (let h = 1; h < this.form2.组件.length; h++) {
this.GroupNumberValue1 += ',' + this.form2.组件[h]
}
for (let i = 0; i < this.form2.组件.length; i++) {
for (let j = 0; j < this.GroupNumber.length; j++) {
if (this.form2.组件[i] === this.GroupNumber[j].value) {
this.form2.组件[i] = this.GroupNumber[j].label
}
}
this.Group += this.form2.组件[i] + '组 '
}
this.addTable(submitAdd, [this.machineNumberValue1, this.form2.序号, this.Group, this.form2.装配任务, this.GroupNumberValue1], 'form2', function() { this.dialogFormVisible4 = false; this.searchDetail() })
},
submitEdit() {
this.GroupNumberValue1 = this.form2.组件[0]
for (let h = 1; h < this.form2.组件.length; h++) {
this.GroupNumberValue1 += ',' + this.form2.组件[h]
}
for (let i = 0; i < this.form2.组件.length; i++) {
for (let j = 0; j < this.GroupNumber.length; j++) {
if (this.form2.组件[i] === this.GroupNumber[j].value) {
this.form2.组件[i] = this.GroupNumber[j].label
}
}
this.Group += this.form2.组件[i] + '组 '
}
this.editTable(submitEdit, [this.GroupProcessNumber, this.form2.序号, this.Group, this.form2.装配任务, this.GroupNumberValue1], 'form2', function() { this.searchDetail(); this.dialogFormVisible4 = false })
},
deleteGroup(row) {
this.$confirm('此操作将永久删除该行, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
deleteGroup(row.组件工艺流水号).then(response => {
if (response.data[0].result === '1') {
this.$message.success('删除成功')
this.searchDetail()
} else { this.$message.error('删除失败') }
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
},
insertOne(row) {
insertOne(row.组件工艺流水号).then(response => {})
this.searchDetail()
},
deleteTable() {
this.$confirm('此操作将永久删除该工艺, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.result = 0
for (var i = 0; i < this.dataAll.length; i++) {
deleteGroup(this.dataAll[i].table1[0].组件工艺流水号).then(response => {
this.result += parseInt(response.data[0].result)
if (this.result === this.dataAll.length) {
this.$message.success('删除成功')
this.searchDetail()
}
})
}
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
},
upOne(row) {
upOne(row.装配工序流水号, row.组件工艺流水号, row.工序顺序).then(response => {})
this.searchDetail()
},
downOne(row) {
downOne(row.装配工序流水号, row.组件工艺流水号, row.工序顺序).then(response => {})
this.searchDetail()
},
deleteOne(row) {
deleteOne(row.装配工序流水号).then(response => {})
this.searchDetail()
},
cChange() {
this.processName = []
initProcessName(this.processNameClassValue).then(response => { // 初始化工序分类
this.tableData = response.data
for (let i = 0; i < response.data.length; i++) {
this.processName.push({
label: response.data[i].工序名称,
value: response.data[i].工序名称流水号
})
}
})
},
nChange() {
for (let i = 0; i < this.tableData.length; i++) {
if (this.processNameValue === this.tableData[i].工序名称流水号) {
this.Process = this.tableData[i].工序名称
this.processRequestValue = this.tableData[i].工艺内容及装配具体要求
}
}
},
tableSearch(row) {
this.dialogFormVisible2 = true
this.processNameClassValue = ''
this.processNameValue = ''
this.processRequestValue = ''
this.Procedure = row.装配工序流水号
this.number = row.序号
},
confirmSelect() {
update1(this.Procedure, this.number, this.Process, this.processRequestValue).then(response => {
if (response.data[0].result === '1') {
this.dialogFormVisible2 = false
this.$message.success('选择成功')
this.searchDetail()
} else {
this.$message.success('选择失败')
}
})
}
}
}
</script>
<style scoped>
span{
margin: 10px 0px 10px 10px;
}
</style>