<template>
  <div>
    <el-card>
      <el-form label-position="left" label-width="120px" :model="addUserForm" ref="addUserForm">
        <el-form-item label="登录账号:" label-width="120px" prop="account">
          <el-input v-model="addUserForm.account"
                    clearable
                    @change="changeAccount(addUserForm.account)"
                    size="small"
                    style="width: 200px;margin-left: 5px;"
                    placeholder="请输入登录账号"></el-input>
        </el-form-item>
        <el-form-item label="姓名:" label-width="120px" prop="userName">
          <el-input v-model="addUserForm.userName"
                    clearable
                    disabled
                    size="small"
                    style="width: 200px;margin-left: 5px;"
                    placeholder="请输入姓名"></el-input>
        </el-form-item>
        <el-form-item label="角色维护:">
          <el-checkbox-group v-model="addUserForm.roleIds">
            <el-checkbox v-for="role in roleList" :label="role.roleId" :key="role.roleId">{{role.name}}</el-checkbox><br/>
          </el-checkbox-group>
        </el-form-item>
        <el-form-item label="是否作废:" label-width="120px" prop="status">
          <el-radio v-model="addUserForm.status" label="0">正常</el-radio>
          <el-radio v-model="addUserForm.status" label="1">作废</el-radio>
        </el-form-item>
        <el-form-item style="margin-left: 100px;">
          <el-button type="primary" @click="addInnerUser" :loading="addBtnLoading">提交</el-button>
          <el-button type="primary" @click="cancel(true)">取消</el-button>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>

<script>
import {addInnerUser,getInnerUserInfo} from "@/api/system/user";

export default {
  name: "AddInnerUserPage",
  data() {
    return {
      userId: null,
      addUserForm: {
        account: '',
        userName: '',
        status: '0',
        roleIds:[]
      },
      roleList:[
        {roleId:6,name:'标注员(内部)'},
        {roleId:5,name:'资源管理负责人 '},
        {roleId:4,name:'分类管理负责人'},
        {roleId:3,name:'任务分配负责人'},
        {roleId:2,name:'人员管理负责人'}
      ],
      userDetail: {},
      addBtnLoading: false
    }
  },
  mounted() {
    this.initForm()
  },
  methods: {
    initForm() {
      this.addUserForm = {
        account: '',
        userName: '',
        status: '0',
        roleIds:[]
      }
      this.addUserForm.roleIds.push(6)
    },
    changeAccount(account){
      if (account==null||account.trim()==''){
        this.$message.error("请输入账号")
        return
      }else {
        getInnerUserInfo(account.trim()).then(res=>{
          this.addUserForm.userName=res.result.displayName
        },err=>{

        })
      }
    },
    addInnerUser() {
      this.addBtnLoading = true

      //新增
      this.$refs.addUserForm.validate((valid) => {
        if (valid) {
          if (this.addUserForm.roleIds==null||this.addUserForm.roleIds==[]||this.addUserForm.roleIds.length<1){
            this.$message.error('用户角色不能为空')
            this.addBtnLoading = false
          }
          addInnerUser(this.addUserForm).then(res => {
            this.$message.success('新增内部用户成功')
            this.addBtnLoading = false
            this.cancel(true)
          }, err => {
            this.addBtnLoading = false
          })
        } else {
          this.addBtnLoading = false
          return false;
        }
      });

    },
    cancel(val) {
      this.$store.dispatch('tagsView/delView', this.$route).then(() => {
        this.$router.push({name: 'UserManagement', params: {flush: val}})
      })
    },
  }
}
</script>

<style scoped>

</style>
