<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> 
 |