<template>
  <el-dialog :title="title" :visible.sync="dialogVisible" width="60%" :before-close="handleClose" center>
    <div class="select-form">
      <el-form ref="form" :model="form" label-width="120px" :disabled="isDisabled">
        <el-form-item label="组织类型" prop="type">
          <el-select v-model="form.type" placeholder="请选择创建区域或服务供应商" @change="typeChange">
            <el-option label="区域" value="AT"></el-option>
            <el-option label="服务供应商" value="AE"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <el-divider></el-divider>
      <div class="form">
        <ATform @success="success" @setLoading="setLoading" ref="ATformRef" v-if="form.type === 'AT'" />
        <AEform @success="success" ref="AEformRef" v-if="form.type === 'AE'" />
      </div>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button @click="handleClose">取 消</el-button>
      <el-button type="primary" :loading="loading" @click="submit">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import ATform from './ATform.vue';
import AEform from './AEform.vue';
export default {
  components: {ATform, AEform},
  data() {
    return {
      loading: false,
      dialogVisible: false,
      isDisabled: false,
      extDrugEntId: '',
      title: '新增',
      type: 'add',
      form: {
        type: ''
      }
    };
  },
  methods: {
    editFn(row) {
      console.log('ROW', row);

      this.type = 'edit';
      this.title = '编辑';
      this.isDisabled = true;
      this.form.type = row.agentType;
      this.typeChange();
      this.dialogVisible = true;
      if (row.provAbbr) {
        row.provAbbrList = row.provAbbr.split('1');
      }
      const info = JSON.parse(JSON.stringify(row));
      this.$nextTick(() => {
        if (this.form.type === 'AT') {
          this.$refs.ATformRef.editShow(info);
        }
        if (this.form.type === 'AE') {
          this.$refs.AEformRef.editShow(info);
        }
      });
    },
    show(extDrugEntId) {
      this.type = 'add';
      this.title = '添加';
      this.isDisabled = false;
      this.dialogVisible = true;
      this.extDrugEntId = extDrugEntId;
    },
    handleClose() {
      if (this.$refs.ATformRef) {
        this.$refs.ATformRef.restForm();
      }
      if (this.$refs.AEformRef) {
        this.$refs.AEformRef.restForm();
      }
      this.form.type = '';
      this.dialogVisible = false;
    },
    setLoading(flag) {
      this.loading = flag;
    },
    success() {
      this.handleClose();
      this.$emit('addSuccess');
    },
    typeChange() {
      this.$nextTick(() => {
        if (this.$refs.ATformRef) {
          this.$refs.ATformRef.uploadComShowFn();
        }
        if (this.$refs.AEformRef) {
          this.$refs.AEformRef.uploadComShowFn();
        }
      });
    },
    submit() {
      if (this.$refs.ATformRef) {
        this.$refs.ATformRef.submitFn(this.extDrugEntId, this.type);
      }
      if (this.$refs.AEformRef) {
        this.$refs.AEformRef.submitFn(this.extDrugEntId, this.type);
      }
    }
  }
};
</script>

<style lang="scss" scoped>
.form {
  padding: 0 60px;
}
</style>
