<template>
|
<GlobalWindow
|
:title="title"
|
:visible.sync="visible"
|
:confirm-working="isWorking"
|
@confirm="confirm"
|
>
|
<el-form :model="form" ref="form" label-suffix="：" :rules="rules">
|
<el-form-item label="工厂" prop="factoryId">
|
<el-select v-model="form.factoryId" placeholder="请选择工厂" clearable filterable @change="selectFactoey(form.departId, false)">
|
<el-option
|
v-for="item in factories"
|
:key="item.id"
|
:label="item.name"
|
:value="item.id"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="产品名称" prop="bomId">
|
<el-select v-model="form.bomId" clearable filterable placeholder="请选择产品" @change="selectMaterial(form.bomId, false)">
|
<el-option
|
v-for="item in materials"
|
:key="item.id"
|
:label="item.mmodel.name"
|
:value="item.id"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="工序" prop="routeProcedureId">
|
<el-select v-model="form.routeProcedureId" clearable filterable placeholder="请选择工序">
|
<el-option
|
v-for="item in productes"
|
:key="item.id"
|
:label="item.name"
|
:value="item.dmodelRouteProductId"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="工艺卡文件" prop="fileurl">
|
<div>
|
<el-upload
|
action="1"
|
disabled
|
:file-list="fileList"
|
>
|
<el-button type="primary" @click="$refs.upFile.click()">点击上传</el-button>
|
<div slot="tip" class="el-upload__tip">只能上传jpg、png、pdf文件，单个文件</div>
|
</el-upload>
|
</div>
|
</el-form-item>
|
<el-form-item label="注意事项" prop="tips">
|
<el-input
|
v-model="form.tips"
|
placeholder="请输入工艺卡注意事项，最多200字"
|
v-trim
|
type="textarea"
|
:autosize="{minRows: 4}"
|
maxlength="200"
|
/>
|
</el-form-item>
|
</el-form>
|
<input type="file" @change="uploadAction" ref="upFile" accept=".pdf,.png,.jpg" style="display: none;" />
|
</GlobalWindow>
|
</template>
|
|
<script>
|
import BaseOpera from '@/components/base/BaseOpera'
|
import GlobalWindow from '@/components/common/GlobalWindow'
|
import { getBomMaterialList } from '@/api/ext/bomExt'
|
import { getDepartmentListByConditon } from '@/api/ext/departmentExt'
|
import { routeExt as proceList } from '@/api/ext/routeProcedureExt'
|
// import { queryListByCode } from '@/api/system/dictData'
|
import { upload } from '@/api/ext/routeCardExt'
|
export default {
|
name: 'OperaRouteCardExtWindow',
|
extends: BaseOpera,
|
components: { GlobalWindow },
|
data () {
|
return {
|
// 表单数据
|
form: {
|
id: null,
|
factoryId: null,
|
remark: null,
|
bomId: null,
|
tips: '',
|
fileurl: '',
|
routeProcedureId: ''
|
},
|
fileList: [],
|
factories: [],
|
materials: [],
|
productes: [],
|
// 验证规则
|
rules: {
|
factoryId:[
|
{ required: true, message: '请选择工厂', trigger: 'change' }
|
],
|
bomId:[
|
{ required: true, message: '请选择产品', trigger: 'change' }
|
],
|
routeProcedureId:[
|
{ required: true, message: '请选择工序', trigger: 'change' }
|
],
|
fileurl:[
|
{ required: true, message: '上传工艺卡文件', trigger: 'change' }
|
],
|
}
|
}
|
},
|
inject: ['folder'],
|
created () {
|
this.config({
|
api: '/ext/routeCardExt',
|
'field.id': 'id'
|
})
|
|
},
|
methods: {
|
open (title, target) {
|
this.title = title
|
this.visible = true
|
this.fileList = []
|
// 新建
|
if (target == null) {
|
this.$nextTick(() => {
|
this.getFactories(false)
|
this.$refs.form.resetFields()
|
this.form[this.configData['field.id']] = null
|
})
|
return
|
}
|
|
// 编辑
|
this.$nextTick(() => {
|
console.log('target', target)
|
for (const key in this.form) {
|
this.form[key] = target[key]
|
}
|
this.form.bomId = target.bmodel.bomId
|
this.form.factoryId = parseInt(target.factoryId)
|
this.fileList = [{ name: this.form.remark }]
|
this.getFactories(true)
|
})
|
},
|
getFactories (isEdit) {
|
this.materials = []
|
this.productes = []
|
getDepartmentListByConditon({
|
type: 1
|
})
|
.then(res => {
|
// console.log(res)
|
this.factories = res
|
if (res && !isEdit) {
|
this.form.factoryId = res[0].id
|
}
|
this.selectFactoey(this.form.factoryId, isEdit)
|
})
|
.catch(err => {
|
console.log(err)
|
})
|
},
|
selectFactoey (v, isEdit) {
|
this.productes = []
|
if (!isEdit) {
|
this.form.bomId = null
|
this.form.routeProcedureId = null
|
this.$nextTick(() => {
|
this.$refs.form.clearValidate()
|
})
|
|
}
|
// console.log(v)
|
getBomMaterialList({ departId: v })
|
.then(res => {
|
// console.log(res)
|
this.materials = res
|
if (isEdit) {
|
this.selectMaterial(this.form.bomId, isEdit)
|
}
|
})
|
.catch(err => {
|
console.log(err)
|
})
|
},
|
selectMaterial (id, isEdit) {
|
let routeId;
|
for (const item of this.materials) {
|
if (item.id === id) {
|
routeId = item.routeId
|
}
|
}
|
if (!isEdit) {
|
this.form.routeProcedureId = null
|
}
|
proceList(routeId)
|
.then(res => {
|
// console.log(res)
|
this.productes = res.proceList
|
}).catch(err => {
|
console.log(err)
|
})
|
},
|
handleChange (file, fileList) {
|
console.log(file, fileList)
|
this.fileList = fileList;
|
},
|
uploadAction (file) {
|
const formdate = new FormData()
|
formdate.append('file', file.target.files[0])
|
formdate.append('folder', this.folder())
|
upload(formdate)
|
.then(res => {
|
this.fileList = [{ name: res.originname }]
|
this.form.fileurl = res.imgaddr
|
this.form.remark = res.originname
|
})
|
.catch(err => {
|
this.$message.error(err)
|
})
|
this.$refs.upFile.value = null
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
::v-deep .el-upload {
|
line-height: 0px !important;
|
}
|
</style>
|
