| <template> | 
|   <GlobalWindow | 
|     :title="title" | 
|     :visible.sync="visible" | 
|     :confirm-working="isWorking" | 
|     @confirm="confirm" | 
|   > | 
|     <el-form :model="form" ref="form" :rules="rules"> | 
|       <el-form-item label="工厂:" prop="factoryId"> | 
|         <el-select v-model="form.factoryId" placeholder="请选择工厂" :disabled="isEdit" filterable clearable @change="selectFactoey(form.factoryId, 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="materialId"> | 
|         <el-select v-model="form.materialId" clearable filterable placeholder="请选择" @change="selectMaterial(form.materialId, false)"> | 
|           <el-option | 
|             v-for="item in materials" | 
|             :key="item.id" | 
|             :label="item.mmodel.name" | 
|             :value="item.materialId" | 
|           ></el-option> | 
|         </el-select> | 
|       </el-form-item> | 
|       <el-form-item label="工序:" prop="procedureId"> | 
|         <el-select v-model="form.procedureId" clearable filterable placeholder="请选择"> | 
|           <el-option | 
|             v-for="item in productes" | 
|             :key="item.id" | 
|             :label="item.name" | 
|             :value="item.id" | 
|           > | 
|           </el-option> | 
|         </el-select> | 
|       </el-form-item> | 
|       <el-form-item label="计划日期:" prop="planDate"> | 
|         <el-date-picker | 
|           v-model="form.planDate" | 
|           value-format="yyyy-MM-dd" | 
|           placeholder="请选择计划日期" | 
|           :picker-options="pickerOptions" | 
|         ></el-date-picker> | 
|       </el-form-item> | 
|       <el-form-item label="计划数量:" prop="num"> | 
|         <el-input v-model="form.num" placeholder="请输入" max="10" v-trim/> | 
|       </el-form-item> | 
|       <el-form-item label="生产批次号" prop="batch"> | 
|         <el-input v-model="form.batch" placeholder="请输入" max="30" v-trim/> | 
|       </el-form-item> | 
|       <el-form-item label="优先级:" prop="urgent"> | 
|         <el-input v-model="form.urgent" placeholder="请输入" max="4" v-trim/> | 
|       </el-form-item> | 
|     </el-form> | 
|   </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' | 
| export default { | 
|   name: 'OperaPlansExtWindow', | 
|   extends: BaseOpera, | 
|   components: { GlobalWindow }, | 
|   data () { | 
|     return { | 
|       options: [ | 
|         { name: '11', id: '1' }, | 
|         { name: '22', id: '2' } | 
|       ], | 
|       isEdit: false, | 
|       // 表单数据 | 
|       form: { | 
|         id: null, | 
|         factoryId: null, | 
|         materialId: null, | 
|         num: null, | 
|         batch: null, | 
|         procedureId: null, | 
|         planDate: '', | 
|         urgent: '' | 
|       }, | 
|       materials: [], | 
|       // factory: [], | 
|       productes: [], | 
|       pickerOptions: {}, | 
|       // 验证规则 | 
|       rules: { | 
|         materialId: [{ required: true, message: '请选择物料', trigger: 'change' }], | 
|         factoryId: [{ required: true, message: '请选择工厂', trigger: 'change' }], | 
|         procedureId: [{ required: true, message: '请选择工序', trigger: 'change' }], | 
|         planDate: [{ required: true, message: '请选择日期', trigger: 'change' }], | 
|         num: [ | 
|           { required: true, message: '请输入计划数量', trigger: 'blur' }, | 
|           // { max: 10, message: '输入字数不超过10', trigger: 'change' }, | 
|           { pattern: /^[0-9]+$/, message: '只可以输入数字', trigger: 'change' } | 
|         ], | 
|         batch: [ | 
|           { required: true, message: '请输入生产批次号', trigger: 'blur' } | 
|           // { max: 30, message: '输入字数不超过30', trigger: 'change' } | 
|         ], | 
|         urgent: [ | 
|           // { max: 4, message: '输入字数不超过4', trigger: 'change' }, | 
|           { pattern: /^[0-9]+$/, message: '只可以输入数字', trigger: 'change' } | 
|         ] | 
|       } | 
|     } | 
|   }, | 
|   inject: ['factories'], | 
|   created () { | 
|     this.config({ | 
|       api: '/ext/plansExt', | 
|       'field.id': 'id' | 
|     }) | 
|     this.pickerOptions.disabledDate = (time) => { | 
|         // 一天 | 
|       let tempTime = 3600 * 1000 * 24  | 
|       return time.getTime() < new Date()-tempTime | 
|     } | 
|   }, | 
|   methods: { | 
|     open (title, target) { | 
|       this.title = title | 
|       this.visible = true | 
|       this.isEdit = false | 
|       this.getFactories(target != null) | 
|       // 新建 | 
|       if (target == null) { | 
|         this.$nextTick(() => { | 
|           this.$refs.form.resetFields() | 
|           this.form[this.configData['field.id']] = null | 
|         }) | 
|         return | 
|       } | 
|       // 编辑 | 
|       this.$nextTick(() => { | 
|         this.isEdit = true | 
|         for (const key in this.form) { | 
|           this.form[key] = target[key] | 
|         } | 
|         this.form.num = parseInt(target.num) | 
|         if (target.urgent) { | 
|           this.form.urgent = parseInt(target.urgent) | 
|         } else { | 
|           this.form.urgent = '' | 
|         } | 
|          | 
|       }) | 
|     }, | 
|     getFactories (isEdit) { | 
|       // console.log(isEdit) | 
|       this.materials = [] | 
|        | 
|       if (this.factories() && !isEdit) { | 
|         this.form.factoryId = this.factories()[0].id | 
|       } | 
|       this.selectFactoey(this.form.factoryId, isEdit) | 
|       // getDepartmentListByConditon({ | 
|       //   type: 1 | 
|       // }) | 
|       //   .then(res => { | 
|       //     // console.log(res) | 
|       //     this.factories = res | 
|            | 
|       //   }) | 
|       //   .catch(err => { | 
|       //     console.log(err) | 
|       //   }) | 
|     }, | 
|     selectFactoey (v, isEdit) { | 
|       this.productes = [] | 
|       if (!isEdit) { | 
|         this.form.materialId = null | 
|       } | 
|       // console.log(v) | 
|       getBomMaterialList({ departId: v }) | 
|         .then(res => { | 
|           // console.log(res) | 
|           this.materials = res | 
|           if (isEdit) { | 
|             this.selectMaterial(this.form.materialId, isEdit) | 
|           } | 
|         }) | 
|         .catch(err => { | 
|           console.log(err) | 
|         }) | 
|     }, | 
|     selectMaterial (id, isEdit) { | 
|       let routeId; | 
|       for (const item of this.materials) { | 
|         if (item.materialId === id) { | 
|           routeId = item.routeId | 
|         } | 
|       } | 
|       if (!isEdit) { | 
|         this.form.procedureId = null | 
|       } | 
|       proceList(routeId) | 
|         .then(res => { | 
|           // console.log(res) | 
|           this.productes = res.proceList | 
|         }).catch(err => { | 
|           console.log(err) | 
|         }) | 
|     } | 
|   } | 
| } | 
| </script> |