MachineCallEmpty.vue 6.4 KB
<template>
  <j-modal
    :title="title"
    :width="width"
    :visible="visible"
    :confirmLoading="confirmLoading"
    switchFullscreen
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭">
    <a-spin :spinning="confirmLoading">
      <a-form-model ref="form" :model="model" :rules="validatorRules">
        <a-row>
          <a-col :span="24">
            <a-form-model-item label="托盘类型" :labelCol="labelCol" :wrapperCol="wrapperCol"
                               :rules="[{ required: true, message: '请选择托盘类型!' }]">
              <j-search-select-tag
                placeholder="请选择料架类型"
                v-model="model.containerType"
                dict="container_type,name,code,code='A' OR code='B' OR code='W'"
                :pageSize="5"
                :async="true">
              </j-search-select-tag>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item v-if="this.zoneCode!=='A1'" label="机台" :labelCol="labelCol" :wrapperCol="wrapperCol" prop=""
                               :rules="[{ required: true, message: '请选择机台!' }]">
              <a-select
                v-model="model.machineCode"
                placeholder="请选择机台"
                style="width: 100%"
                @change="changeMachine"
              >
                <a-select-option v-for="(machine, index) in machineList" :key="index" :value="machine">
                  {{ machine }}
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="点位" :labelCol="labelCol" :wrapperCol="wrapperCol" prop=""
                               :rules="[{ required: true, message: '请选择点位!' }]">
              <j-popup v-if="this.zoneCode==='A1'" v-model="model.toPortCode" code="getA1MachineLocationList" field="code" orgFields="code" destFields="code" :multi="false"/>
              <a-select v-else
                v-model="model.toPortCode"
                placeholder="请选择点位"
                style="width: 100%"
              >
                <a-select-option v-for="item in portList" :key="item.code" :value="item.code">
                  {{ item.code }}
                </a-select-option>
              </a-select>
<!--              <j-tree-select-->
<!--                ref="treeSelect"-->
<!--                placeholder="请选择父级节点"-->
<!--                v-model="model.pid"-->
<!--                dict="location,name,id"-->
<!--                pidField="pid"-->
<!--                pidValue="0"-->
<!--                :disabled="disabled">-->
<!--              </j-tree-select>-->
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </a-spin>
  </j-modal>
</template>

<script>


import {shelfCallEmptyOutByMany, createEmptyOut} from '@/api/api'
import {selectOutPort} from '@/api/api'
import JSelectMultiEmptyContainer from "@comp/jeecgbiz/JSelectMultiEmptyContainer";
import {getAction} from "../../../../api/manage";
import {clearAll} from "../../../../utils/storage";

export default {
  name: "MachineCallEmpty",
  components: {JSelectMultiEmptyContainer},
  data() {
    return {
      title: "操作",
      width: 500,
      portList: [],
      zoneCode: '',
      machineList: [],
      querySource: {},
      visible: false,
      model: {},
      labelCol: {
        xs: {span: 24},
        sm: {span: 5},
      },
      wrapperCol: {
        xs: {span: 24},
        sm: {span: 16},
      },

      confirmLoading: false,
      validatorRules: {
        containerType: [
          {required: true, message: '请选择托盘类型!'},
        ], machineCode: [
          {required: true, message: '请选择机台!'},
        ], toPortCode: [
          {required: true, message: '请选择点位!'},
        ],
      },
      url: {
        add: "/task/taskHeader/callEmptyOut",
      }

    }
  },
  created() {
    //备份model原始值
    this.modelDefault = JSON.parse(JSON.stringify(this.model));
  },
  methods: {
    add() {
      // $("select").change(function() {	alert("选项已被改变");	console.log($('select').val());});
      this.edit(this.modelDefault);
    },
    edit(zoneCode) {
      // this.getPortList();
      // this.model = Object.assign({}, record);
      this.visible = true;
      this.zoneCode = zoneCode;
      if(zoneCode!=='A1'){
        this.getMachineList(zoneCode);
      }else {
        this.getPortList("");
      }
    },
    close() {
      this.$emit('close');
      this.visible = false;
      this.$refs.form.clearValidate();
    },
    async getMachineList(zoneCode) {
      let params = {"zoneCode": zoneCode}
      getAction("/config/location/getMachineListByZoneCode", params).then((res) => {
        if (res.success) {
          this.machineList = res.result;
        }
        if (res.code === 510) {
          this.$message.warning(res.message)
        }
      })
    },
    changeMachine() {
      this.getPortList(this.model.machineCode);
    },
    async getPortList(machineCode) {
      let params = {"machineCode": machineCode, "zoneCode": this.zoneCode}
      getAction("/config/location/list", params).then((res) => {
        if (res.success) {
          if (this.zoneCode !== 'A1') {
            this.portList = res.result.records;
          } else {
            this.portList = res.result.records.filter(item => {
              return item.machineCode !== null && item.machineCode !== undefined && item.machineCode !== '';
            });
          }
        }
        if (res.code === 510) {
          this.$message.warning(res.message)
        }
      })
    },
    handleOk() {
      const that = this;
      // 触发表单验证
      this.$refs.form.validate(valid => {
        if (valid) {
          that.confirmLoading = true;
          shelfCallEmptyOutByMany(this.model).then((res) => {
            if (res.success) {
              that.$message.success(res.message);
              that.$emit('ok');
              that.model.containerCode = '';
              that.model.toPortCode = '';
            } else {
              that.$message.warning(res.message);
            }
          }).finally(() => {
            that.model = {}
            that.confirmLoading = false;
            that.close();
          })
        } else {
          return false
        }
      })
    },
    handleCancel() {
      this.close()
    },


  }
}
</script>