<template>
  <div class="trial-myinfo-left">
    <div class="trial-myinfo-left-bottom">
      <div class="trial-myinfo-head">
        <!-- 用户基本信息 -->
        {{ $t("trials:trials-myinfo:title:basicInfo") }}
      </div>
      <el-form ref="userForm" label-position="right" :model="user" :rules="userFormRules" label-width="120px">
        <el-form-item v-if="user.Code" label="ID: " prop="Code">
          <el-input v-model="user.Code" disabled />
        </el-form-item>
        <!-- 姓 -->
        <el-form-item :disabled="user.UserTypeEnum === 8" :label="$t('trials:trials-myinfo:form:surname')"
          prop="LastName">
          <el-input v-model="user.LastName" :placeholder="$t('trials:trials-myinfo:form:surname')" />
        </el-form-item>
        <!-- 名 -->
        <el-form-item :disabled="user.UserTypeEnum === 8" :label="$t('trials:trials-myinfo:form:givenname')"
          prop="FirstName">
          <el-input v-model="user.FirstName" :placeholder="$t('trials:trials-myinfo:form:givenname')" />
        </el-form-item>
        <!-- 单位$t('trials:trials-myinfo:form:organization'):disabled="user.IsZhiZhun" -->
        <el-form-item :label="$t('trials:trials-myinfo:form:organization')" prop="OrganizationName">
          <el-input v-model="user.OrganizationName" placeholder="" />
        </el-form-item>
        <!-- 部门 -->
        <el-form-item :label="$t('trials:trials-myinfo:form:department')" prop="DepartmentName">
          <el-input v-model="user.DepartmentName" :placeholder="$t('trials:trials-myinfo:form:organization')" />
        </el-form-item>
        <!-- 职位 -->
        <el-form-item :label="$t('trials:trials-myinfo:form:position')" prop="PositionName">
          <el-input v-model="user.PositionName" :placeholder="$t('trials:trials-myinfo:form:position')" />
        </el-form-item>
      </el-form>
      <!-- 保存 -->
      <el-button class="trial-info-btn" type="primary" size="small" @click="handleSave">
        {{ $t("trials:trials-myinfo:button:save") }}
      </el-button>
    </div>
  </div>
</template>
<script>
import { updateUser } from "@/api/admin.js";
export default {
  name: "mine",
  props: {
    user: {
      required: true,
      default: () => {
        return {};
      },
    },
    userTypeOptions: {
      required: true,
      default: () => {
        return [];
      },
    },
  },
  data() {
    return {
      userFormRules: {
        UserName: [
          {
            required: true,
            message: this.$t("common:ruleMessage:specify"),
            trigger: "blur",
          },
        ],
        UserTypeId: [
          {
            required: true,
            message: this.$t("common:ruleMessage:select"),
            trigger: ["blur", "change"],
          },
        ],
        IsZhiZhun: [
          {
            required: true,
            message: this.$t("common:ruleMessage:select"),
            trigger: ["blur", "change"],
          },
        ],
        OrganizationName: [
          {
            required: true,
            message: this.$t("common:ruleMessage:specify"),
            trigger: "blur",
          },
        ],
        LastName: [
          {
            required: true,
            message: this.$t("common:ruleMessage:specify"),
            trigger: "blur",
          },
          { max: 50, message: `${this.$t("common:ruleMessage:maxLength")} 50` },
        ],
        FirstName: [
          {
            required: true,
            message: this.$t("common:ruleMessage:specify"),
            trigger: "blur",
          },
          { max: 50, message: `${this.$t("common:ruleMessage:maxLength")} 50` },
        ],
        Sex: [
          {
            required: true,
            message: this.$t("common:ruleMessage:specify"),
            trigger: "blur",
          },
        ],
        Status: [
          {
            required: true,
            message: this.$t("common:ruleMessage:specify"),
            trigger: "blur",
          },
        ],
      },
    };
  },
  methods: {
    handleSave() {
      this.$refs.userForm.validate((valid) => {
        console.log(valid);
        if (valid) {
          this.isDisabled = true;
          const selectedUserType = this.userTypeOptions.filter((item) => {
            return item.Id === this.user.UserTypeId;
          });
          if (selectedUserType.length > 0) {
            this.user.userTypeEnum = selectedUserType[0].UserTypeEnum;
          }
          // if (this.user.IsZhiZhun === true) {
          //   this.user.OrganizationName = 'ZhiZhun'
          // }
          if (this.user.Id) {
            updateUser(this.user)
              .then((res) => {
                this.isDisabled = false;
                this.$message.success(
                  this.$t("trials:trials-myinfo:message:updateSuccessfully")
                );
                this.$emit("getUserInfo");
              })
              .catch(() => {
                this.isDisabled = false;
              });
          }
        }
      });
    },
  },
};
</script>