<template>
  <el-dialog title="修改用户认证" :close-on-click-modal="false" :visible.sync="open" width="800px" append-to-body>
    <el-form ref="form" :model="form" :rules="rules" label-width="80px">
      <el-form-item label="用户编号" prop="usercode">
        <el-input disabled v-model="form.usercode"/>
      </el-form-item>
      <el-form-item label="用户手机" prop="mobile">
        <el-input disabled v-model="form.mobile"/>
      </el-form-item>
      <el-form-item label="实名认证" prop="cardNumAuth">
        <el-select v-model="form.cardNumAuth" clearable size="small" style="width: 95%">
          <el-option
            v-for="dict in userAuthStatusList"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="单身认证" prop="singlePersonAuth">
        <el-select v-model="form.singlePersonAuth" clearable size="small" style="width: 95%">
          <el-option
            v-for="dict in userAuthStatusList"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="学历认证" prop="educationAuth">
        <el-select v-model="form.educationAuth" clearable size="small" style="width: 95%">
          <el-option
            v-for="dict in userAuthStatusList"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="工作认证" prop="jobAuth">
        <el-select v-model="form.jobAuth" clearable size="small" style="width: 95%">
          <el-option
            v-for="dict in userAuthStatusList"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="车辆认证" prop="carAuth">
        <el-select v-model="form.carAuth" clearable size="small" style="width: 95%">
          <el-option
            v-for="dict in userAuthStatusList"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="房子认证" prop="houseAuth">
        <el-select v-model="form.houseAuth" clearable size="small" style="width: 95%">
          <el-option
            v-for="dict in userAuthStatusList"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="婚况认证" prop="marriageAuth">
        <el-select v-model="form.marriageAuth" clearable size="small" style="width: 95%">
          <el-option
            v-for="dict in userAuthStatusList"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
      <el-button @click="open = false">取 消</el-button>
    </div>
  </el-dialog>
</template>

<script>
import {
  appUserTypeList,
  booleanList,
  finishStatusList,
  genderList,
  memberTypeList,
  onlineStatusList,
  professionList,
  userAnnualIncomeList, userAuthStatusList,
  userCarStatusList,
  userChildStatusList,
  userCompanyNatureList,
  userDrinkStatusList,
  userEducationList,
  userFamilyBackgroundList,
  userFamilyRankingList,
  userFindTagList,
  userForPersonalsList,
  userHousingStatusList,
  userLiveAtParentList,
  userLoveAtDistanceList,
  userMarriageList,
  userSignList,
  userSmokeStatusList,
  userSomatotypeList,
  userStatusList,
  userWantChildList,
  userWhenMarriageList,
  userZodiacList,
  videoStatusList
} from '@/constant/statusMap'
import Treeselect from '@riophae/vue-treeselect'
import { getTreeAreaCode } from '@/api/xq/areaCode'
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import { addBanner } from '@/api/xq/banner'
import { addUser, getUser, updateUser } from '@/api/xq/user'
import { getUserAuth, updateUserAuth } from '@/api/xq/userAuth'

export default {
  name: "UserInfo",
  components: { Treeselect },
  data() {
    return {
      userAuthStatusList,
      booleanList,
      open:false,
      buttonLoading: false,
      form:{
        id: undefined,
        mobile: undefined,
        usercode: undefined,
        cardNumAuth: undefined,
        singlePersonAuth: undefined,
        educationAuth: undefined,
        jobAuth: undefined,
        carAuth: undefined,
        houseAuth: undefined,
        marriageAuth: undefined,
      },
      rules:{
        cardNumAuth: [
          { required: true, message: "数据不能为空", trigger: "change" }
        ],
        singlePersonAuth: [
          { required: true, message: "数据不能为空", trigger: "change" }
        ],
        educationAuth: [
          { required: true, message: "数据不能为空", trigger: "change" }
        ],
        jobAuth: [
          { required: true, message: "数据不能为空", trigger: "change" }
        ],
        carAuth: [
          { required: true, message: "数据不能为空", trigger: "change" }
        ],
        houseAuth: [
          { required: true, message: "数据不能为空", trigger: "change" }
        ],
        marriageAuth: [
          { required: true, message: "数据不能为空", trigger: "change" }
        ],
      },
      areaOption: [],
    };
  },
  created() {
  },
  methods: {
    normalizer(node){
      return {
        id: node.id,
        label: node.label,
        children: node.children && node.children.length > 0 ? node.children : 0,
      }
    },
    init(row){
      this.form.id = row.id
      this.open = true;
      this.$nextTick(() => {
        this.$refs['form'].resetFields();
        getUserAuth(row.id).then(response => {
          let userAuth = response.data.userAuth;
          let user = response.data.user;
          this.form = userAuth;
          this.form.nickname = user.nickname
          this.form.mobile = user.mobile
          this.form.usercode = user.usercode
        })
      })
    },
    submitForm(){
      updateUserAuth(this.form).then(data => {
        this.$modal.msgSuccess("新增用户成功");
        this.buttonLoading = false;
        this.open = false
        this.$emit('refreshDataList')
      }).finally(() => {
        this.buttonLoading = false;
      });
    }
  }
};
</script>
