<!--
  @description: 供应商入库申请表
  @Modifier:qrf
  @routerPath:
  @date: 2020/9/18-13:41
-->
<template>
  <div>
    <el-dialog
      :visible.sync="dialog"
      :close-on-click-modal="false"
      title="供应商入库申请表"
      width="50%"
      min-width="700px"
      custom-class="el-dialog_table"
    >
      <el-form
        ref="form"
        :rules="rules"
        :model="formData"
        :inline-message="true"
        class="main mb10"
      >
        <table class="from_table">
          <tr>
            <td>
              <el-form-item label="申报供应范围" prop="supplyScope" />
            </td>
            <td>
              <el-input v-model="formData.supplyScope" disabled style="width: calc(100% - 156px );" />
              <!-- 请选择 -->
              <el-button type="primary" @click="dialogData.dialog=true">
                选择
              </el-button>
              <el-button type="primary" plain @click="categoryTreeInfo('clear')">
                清空
              </el-button>
            </td>
          </tr>
          <tr>
            <td>
              <el-form-item label="调查方式" prop="nvestigationMethod" />
            </td>
            <td>
              <el-select v-model="formData.nvestigationMethod" placeholder="请选择活动区域">
                <el-option label="实地考察" value="shidikaocha" />
                <el-option label="问卷调查" value="wenjuandiaocha" />
                <el-option label="综合" value="zonghe" />
                <el-option label="其他" value="qita" />
              </el-select>
            </td>
          </tr>
          <tr>
            <td>
              <el-form-item label="是否新供应商" prop="newSupply" />
            </td>
            <td>
              <el-radio-group v-model="formData.newSupply">
                <el-radio label="是" />
                <el-radio label="否" />
              </el-radio-group>
            </td>
          </tr>
          <tr>
            <td>
              <el-form-item label="推荐理由" prop="reason" />
            </td>
            <td>
              <el-input v-model="formData.reason" type="textarea" />
            </td>
          </tr>
        </table>
      </el-form>
      <!--底部操作按钮-->
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="ensure('form')">提交</el-button>
        <el-button @click="dialog = false">取消</el-button>
      </span>
    </el-dialog>
    <!-- 供货范围 -->
    <category-tree-dialog :dialog-data="dialogData" @categoryTreeInfo="categoryTreeInfo" />
  </div>
</template>

<script>
/* api */
// import { auditDepartInfo } from '@api/supplier/supplierBaseInfo'
/* api */
import { submitDeclarationForInviteReferer } from '@/api/supplier/declaraTionrecord.js'
import { supplierGroupMixin } from '@/views/supplier/mixins/supplierGroupMixin'
/* 校验方法*/
import { characters1_auto } from '@/assets/js/validate'
import categoryTreeDialog from '@/views/common/tools/categoryTree-dialog'// 供货范围-弹框
export default {
  name: 'EditorDeclarationPassed',
  components: {
    'category-tree-dialog': categoryTreeDialog // 供货范围选择弹框
  },
  mixins: [supplierGroupMixin],
  data() {
    return {
      dialog: false, // 弹窗状态 false 关闭 true 打开
      list: [],
      formData: {
        departName: '', // 推荐单位名称
        qualificationsType: '01', // 类型
        supplierName: '', // 供应名称
        supplierId: '', // 供应商id
        supplyScope: '', // 供货范围
        supplyScopeId: '', // 供货范围id
        list: [], // 推荐单位
        reason: '', // 推荐理由
        remark: '', // 备注
        status: '01', // 状态 00保存 01提交
        nvestigationMethod: '',
        newSupply: ''
        // departname: '', // 所属机构
        // departid: '' // 所属机构id
      },
      rules: {
        supplyScope: [{ required: true, message: '请选择', trigger: 'blur' }], // 申报供应范围
        nvestigationMethod: [{ required: true, message: '请选择', trigger: 'blur' }], // 调查方式
        reason: [{ required: true, validator: characters1_auto, trigger: 'blur' }] // 推荐理由
      },
      // 弹窗-展示/隐藏状态 true 展示/false 隐藏
      dialogData: {
        title: '供货范围',
        dialog: false, // 供货范围
        selectCodes: [] // 当前选中的供货范围Code
      }
    }
  },
  created() {
    this.loadData()
  },
  methods: {
    openDialog() {
      this.dialog = true
    },
    // 范围选择/清空
    categoryTreeInfo(data) {
      if (data === 'clear') { // 清空
        this.formData.supplyScope = ''// 名称
        this.formData.supplyScopeId = ''// 代码
      } else { // 选择
        this.formData.supplyScope = data.labels// 名称
        this.formData.supplyScopeId = data.keys// 代码
      }
    },
    // 提交
    ensure(formName) {
      // 校验输入内容
      this.$refs[formName].validate((valid, field) => {
        if (valid) { // 校验通过
          submitDeclarationForInviteReferer(this.formData).then(res => {
            this.$message({
              message: '成功',
              type: 'success'
            })
            this.$emit('call-back') // 提交成功触发父组件重新获取列表
            this.dialog = false
          })
        }
      })
    }
  }
}
</script>

<style></style>
