<template> 
 | 
  <GlobalWindow 
 | 
    :title="title" 
 | 
    :visible.sync="visible" 
 | 
    :confirm-working="isWorking" 
 | 
    @confirm="submission" 
 | 
  > 
 | 
    <el-form :model="form" ref="form" :rules="rules"> 
 | 
      <el-form-item label="绑定工序" prop="procedureIds"> 
 | 
        <el-select v-model="form.procedureIds" multiple filterable clearable placeholder="请选择绑定工序" @change="selectP"> 
 | 
          <el-checkbox style="margin-left: 20px" v-model="checked" @change='selectAll'>全选</el-checkbox> 
 | 
          <el-option 
 | 
            v-for="item in options" 
 | 
            :key="item.id" 
 | 
            :label="item.name" 
 | 
            :value="item.id"> 
 | 
          </el-option> 
 | 
         </el-select> 
 | 
      </el-form-item> 
 | 
    </el-form> 
 | 
  </GlobalWindow> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
import BaseOpera from '@/components/base/BaseOpera' 
 | 
import GlobalWindow from '@/components/common/GlobalWindow' 
 | 
import { getProductes, updateById } from '@/api/ext/companyUserExt' 
 | 
export default { 
 | 
  name: 'OperaCategoryExtWindow', 
 | 
  extends: BaseOpera, 
 | 
  components: { GlobalWindow }, 
 | 
  props: { 
 | 
    id: { 
 | 
      type: String, 
 | 
      required: false, 
 | 
      default: () => '' 
 | 
    } 
 | 
  }, 
 | 
  data () { 
 | 
    return { 
 | 
      checked: false, 
 | 
      options: [], // 工序数据 
 | 
      form: { // 表单数据 
 | 
        id: null, 
 | 
        departmentId: null, 
 | 
        procedureIds: [] 
 | 
      }, 
 | 
      rules: { // 验证规则 
 | 
        procedureIds: [ 
 | 
          { required: true, message: '请选择工序', trigger: 'blur' } 
 | 
        ] 
 | 
      } 
 | 
    } 
 | 
  }, 
 | 
  created () { 
 | 
    this.config({ 
 | 
      api: '/system/user', 
 | 
      'field.id': 'id' 
 | 
    }) 
 | 
  }, 
 | 
  methods: { 
 | 
    open (title, target) { 
 | 
      this.title = title 
 | 
      this.visible = true 
 | 
      // console.log(target) 
 | 
      // 编辑 
 | 
      this.$nextTick(() => { 
 | 
        for (const key in this.form) { 
 | 
          this.form[key] = target[key] 
 | 
        } 
 | 
        this.form.id = target.userId 
 | 
        this.getProducte() 
 | 
        const tps = target.procedureIds.split(',') 
 | 
        this.form.procedureIds = [] 
 | 
        for (const item of tps) { 
 | 
          this.form.procedureIds.push(parseInt(item)) 
 | 
        } 
 | 
         
 | 
        this.selectP() 
 | 
      }) 
 | 
    }, 
 | 
    // 提交工序 
 | 
    submission () { 
 | 
      this.isWorking = true 
 | 
      this.$refs.form.validate((valid) => { 
 | 
        if (valid) { 
 | 
          updateById(this.form).then(res => { 
 | 
            // this.$tip.success('绑定成功') 
 | 
            this.visible = false 
 | 
            this.isWorking = false 
 | 
            this.$emit('success', '1') 
 | 
            setTimeout(() => { 
 | 
              this.$dialog.attentionConfirm('工序绑定成功,用户需重新登录后生效').then(() => {}) 
 | 
            }, 300) 
 | 
          }).catch(e => { 
 | 
            this.$tip.error(e) 
 | 
            this.isWorking = false 
 | 
          }) 
 | 
        } else { 
 | 
          return false 
 | 
        } 
 | 
      }) 
 | 
    }, 
 | 
    // 获取工序数据 
 | 
    getProducte () { 
 | 
      getProductes({ orginId: this.form.departmentId}) 
 | 
        .then((res) => { 
 | 
          this.options = res 
 | 
          this.selectP() 
 | 
        }).catch((err) => { 
 | 
          console.log(err) 
 | 
        }) 
 | 
    }, 
 | 
    selectAll () { 
 | 
      this.form.procedureIds = [] 
 | 
      if (this.checked) { 
 | 
        this.options.forEach((item) => { this.form.procedureIds.push( item.id )}); 
 | 
      } 
 | 
    }, 
 | 
    selectP () { 
 | 
      this.checked = false 
 | 
      console.log(this.form.procedureIds.length, this.options.length); 
 | 
      if (this.form.procedureIds.length === this.options.length) { 
 | 
        this.checked = true 
 | 
      } 
 | 
    } 
 | 
  } 
 | 
} 
 | 
</script> 
 |