<template>
  <div>
    <xy-dialog ref="dialog" :width="70" :is-show.sync="isShow" :type="'form'" :title="type === 'add' ? '新增学员' : '编辑学员'"
      :form="form" :rules='rules' @submit="submit">
      <template v-slot:username>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;">*</span>姓名：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.username" placeholder="请输入姓名" clearable style="width: 100%;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:sex>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;">*</span>性别：
          </div>
          <div class="xy-table-item-content">
            <el-select v-model="form.sex" placeholder="请选择性别" clearable style="width: 100%;">
              <el-option v-for="(item,index) in sexList" :key="index" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </div>
        </div>
      </template>
      <template v-slot:birthday>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>出生日期：
          </div>
          <div class="xy-table-item-content">
            <el-date-picker style="width: 100%;" v-model="form.birthday" type="date" value-format="yyyy-MM-dd"
              format="yyyy-MM-dd" placeholder="出生日期">
            </el-date-picker>
          </div>
        </div>
      </template>
      <template v-slot:mobile>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;">*</span>联系方式：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.mobile" placeholder="请输入联系方式" clearable style="width: 100%;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:idcard>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>身份证号：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.idcard" placeholder="请输入身份证号" clearable style="width: 100%;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:education>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>学历：
          </div>
          <div class="xy-table-item-content">
            <el-select v-model="form.education" placeholder="请选择学历" clearable style="width: 100%;">
              <el-option v-for="(item,index) in formSelect.education" :key="index" :label="item.value" :value="item.value">
              </el-option>
            </el-select>
          </div>
        </div>
      </template>
      <template v-slot:company_name>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>公司名称：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.company_name" placeholder="请输入公司名称" clearable style="width: 100%;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:company_position>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>职务：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.company_position" placeholder="请输入职务" clearable style="width: 100%;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:company_has_share>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>有无股份：
          </div>
          <div class="xy-table-item-content">
            <el-select v-model="form.company_has_share" placeholder="请选择有无股份" clearable style="width: 100%;">
              <el-option v-for="(item,index) in shareList" :key="index" :label="item.value" :value="item.value">
              </el-option>
            </el-select>
          </div>
        </div>
      </template>
      <template v-slot:type>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>人才类型：
          </div>
          <div class="xy-table-item-content">
            <el-select v-model="typeList" @change="changeType" multiple placeholder="请选择人才类型" clearable style="width: 100%;">
              <el-option v-for="(item,index) in formSelect.type" :key="index" :label="item.value" :value="item.value">
              </el-option>
            </el-select>
          </div>
        </div>
      </template>
      <template v-slot:company_type>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>企业性质：
          </div>
          <div class="xy-table-item-content">
            <el-select v-model="companyTypeList" multiple placeholder="请选择企业性质" clearable style="width: 100%;">
              <el-option v-for="(item,index) in formSelect.company_type" :key="index" :label="item.value" :value="item.value">
              </el-option>
            </el-select>
          </div>
        </div>
      </template>
      <template v-slot:company_fund>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>融资情况：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.company_fund" placeholder="请输入融资情况" clearable style="width: 100%;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:company_area>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>所在区域：
          </div>
          <div class="xy-table-item-content">
            <el-select v-model="form.company_area" placeholder="请选择所在区域" clearable style="width: 100%;">
              <el-option v-for="(item,index) in formSelect.company_area" :key="index" :label="item.value" :value="item.value">
              </el-option>
            </el-select>
          </div>
        </div>
      </template>
      <template v-slot:company_industry>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>所属行业：
          </div>
          <div class="xy-table-item-content">
            <el-select v-model="form.company_industry" placeholder="请选择所属行业" clearable style="width: 100%;">
              <el-option v-for="(item,index) in formSelect.company_industry" :key="index" :label="item.value" :value="item.value">
              </el-option>
            </el-select>
          </div>
        </div>
      </template>
      <template v-slot:company_address>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>公司地址：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.company_address" placeholder="请输入公司地址" clearable style="width: 100%;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:company_product>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>产品：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.company_product" placeholder="请输入产品" clearable style="width: 100%;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:school>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>毕业院校：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.school" placeholder="请输入毕业院校" clearable style="width: 100%;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:speciality>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>专业：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.speciality" placeholder="请输入专业" clearable style="width: 100%;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:overseas_experience>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>海外经验：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.overseas_experience" placeholder="请输入海外经验" clearable style="width: 100%;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:sign_from>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>报名渠道：
          </div>
          <div class="xy-table-item-content">
            <el-select v-model="form.sign_from" placeholder="请选择报名渠道" clearable style="width: 100%;">
              <el-option v-for="(item,index) in formSelect.sign_from" :key="index" :label="item.value" :value="item.value">
              </el-option>
            </el-select>
          </div>
        </div>
      </template>
      <template v-slot:email>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>邮箱：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.email" placeholder="请输入邮箱" clearable style="width: 100%;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:sales_volume>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>销售额/亿：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.sales_volume" placeholder="请输入销售额/亿" clearable style="width: 100%;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:valuation>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>估值：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.valuation" placeholder="请输入估值" clearable style="width: 100%;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:market_value>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>市值：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.market_value" placeholder="请输入市值" clearable style="width: 100%;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:is_yuanhe>
        <div class="xy-table-item">
          <div class="xy-table-item-label" style="font-weight: bold">
            <span style="color: red;font-weight: bold;padding-right: 4px;"></span>是否为元禾投资企业：
          </div>
          <div class="xy-table-item-content">
            <el-select v-model="form.is_yuanhe" placeholder="请选择是否为元禾投资企业" clearable style="width: 100%;">
              <el-option v-for="(item,index) in formSelect.is_yuanhe" :key="index" :label="item.value" :value="item.value">
              </el-option>
            </el-select>
          </div>
        </div>
      </template>
    </xy-dialog>
  </div>
</template>

<script>
  import formMixin from "@/mixin/formMixin.js";
  import {
    show,
    save
  } from '@/api/student/index.js'
  export default {
    mixins: [formMixin],
    data() {
      return {
        isShow: false,
        type: 'add',
        rules: {},
        typeList:[],
        companyTypeList:[],
        form:{
          username:'',
          sex:"",
          birthday:"",
          mobile:"",
          idcard:"",
          education:'',
          company_name:'',
          company_position:'',
          company_has_share:'',
          type:'',
          company_type:'',
          company_fund:'',
          company_area:'',
          company_industry:'',
          company_address:'',
          company_product:'',
          school:'',
          speciality:'',
          overseas_experience:'',
          sign_from:'',
          email:'',
          sales_volume:"",
          valuation:'',
          market_value:"",
          is_yuanhe:''
        }
      }
    },
    methods: {
      submit() {
        this.form.type = this.typeList.join(",")
        this.form.company_type = this.companyTypeList.join(",")
        this.form.name = this.form.username
        save(this.form).then(res => {
          this.$message({
            type: 'success',
            message: '编辑学员信息成功'
          })
          this.isShow = false
          this.$emit('refresh')
        })
      },
      changeType(e){
        console.log("e",e)
      },
      getDetail() {
        show({
          id: this.id,
        }).then(res => {
          this.form = this.base.requestToForm(res,this.form)
          this.typeList = res.type?res.type.split(","):[],
          this.companyTypeList = res.company_type?res.company_type.split(","):[]
        })
      },
    },
    watch: {
      isShow(newVal) {
        if (newVal) {
          if (this.type === 'editor') {
            this.getDetail()
          } else if (this.type === 'check') {
            // this.getSignDetail()
          }
        } else {
          this.id = ''
          this.type = 'add'
          this.typeList = []
          this.companyTypeList = []
          this.$refs['dialog'].reset()
        }
      },
    }
  }
</script>

<style lang="scss" scoped>

</style>
