<template>
  <div>
    <el-breadcrumb separator="/" class="bread_crumb1 bread_left">
      <el-breadcrumb-item :to="{ path: '/user' }">{{ $t("lang.personalCenter") }}</el-breadcrumb-item>
      <el-breadcrumb-item>{{ $t("lang.profile") }}</el-breadcrumb-item>
    </el-breadcrumb>
    <block-radius class="info_block">
      <el-tabs v-model="activeName" @tab-click="changeTab">
        <el-tab-pane label="个人信息详情" name="0"></el-tab-pane>
        <el-tab-pane label="业务系统详情" name="1"></el-tab-pane>
      </el-tabs>
      <el-form ref="form" :model="form">
        <el-form-item>
          <p>账号：</p>
          <el-input v-model="form.accountNo"></el-input>
        </el-form-item>
        <el-form-item>
          <p>密码：</p>
          <el-input v-model="form.password"></el-input>
        </el-form-item>
        <el-form-item>
          <p>昵称：</p>
          <el-input v-model="form.nickname"></el-input>
        </el-form-item>
        <el-form-item>
          <p>头像：</p>
          <upload-file
            :multiple="false"
            :max="1"
            type="cropper"
            :readOnly="false"
            :list="imgList"
            @getNewList="getNewList"
          ></upload-file>
        </el-form-item>
        <el-form-item>
          <p>联系人：</p>
          <el-input v-model="form.contactPerson"></el-input>
        </el-form-item>
        <el-form-item>
          <p>手机号：</p>
          <el-input v-model="form.phone"></el-input>
        </el-form-item>
        <el-form-item>
          <p>邮箱：</p>
          <el-input v-model="form.email"></el-input>
        </el-form-item>
        <el-form-item>
          <p>组织机构：</p>
          <el-input v-model="form.organization"></el-input>
        </el-form-item>
        <el-form-item>
          <p>当前角色：</p>
          <el-input v-model="form.role"></el-input>
        </el-form-item>
      </el-form>
    </block-radius>
  </div>
</template>

<script>
import BlockRadius from "@/components/block-radius";
import UploadFile from "@/components/upload_file";
export default {
  components: {
    BlockRadius,
    UploadFile
  },
  data: () => ({
    activeName: "0",
    form: {
      accountNo: "",
      password: "",
      nickname: "",
      contactPerson: "",
      phone: "",
      email: "",
      organization: "",
      role: ""
    },
    imgList: []
  }),
  mounted() {
    this.imgList.push("https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg")
  },
  methods: {
    changeTab() {},
    getNewList(val) {
      console.log(val);
    }
  }
};
</script>
<style scoped>
.info_block {
  margin: 0 20px;
}
</style>