<template>
  <div>
    <!-- 表单 -->
    <van-form @submit="onSubmit">
      <van-field
        v-model="user.name"
        class="m"
        name="NAME"
        label="中文名"
        placeholder="请填写中文名"
        :rules="[{ required: false }]"
      />
      <van-field
        v-model="user.email"
        class="m"
        name="EMAIL"
        label="邮箱地址"
        placeholder="请填写邮箱地址"
        :rules="[{ required: false }]"
      />
      <van-field
        v-model="user.phone"
        class="m"
        type="number"
        name="PHONE"
        label="手机号"
        placeholder="请填写手机号"
        :rules="[{ required: false }]"
      />
      <van-field
        v-model="user.company"
        class="m"
        readonly
        label="公司"
        placeholder="公司"
        :rules="[{ required: false }]"
      />
      <van-field
        v-model="user.departmentName"
        readonly
        class="m"
        label="部门"
        placeholder="请选择部门"
        :rules="[{ required: false }]"
      />
      <van-field
        v-model="user.seatNo"
        readonly
        label="座位"
        placeholder="请填写座位"
        :rules="[{ required: false }]"
      />

      <!-- <van-field v-model="user.englishName" type="" name="英文名" label="英文名" placeholder="请填写英文名"
				:rules="[{ required: false }]" /> -->
      <!-- <van-field v-model="user.stationNum" type="" name="工号" label="工号" placeholder="请填写工号"
				:rules="[{ required: false }]" /> -->
      <!-- 弹窗物品类型 -->
      <!-- <van-popup v-model="show" position="bottom">
				<van-picker title="选择部门" show-toolbar value-key="department" :columns="departmenList"
					@confirm="onConfirm" @cancel="show = false" />
			</van-popup> -->
      <!--上司部门-->
      <!-- <van-field v-model="user.leaderDepartment" readonly @click="show2 = true" class="m" type="" name="上司部门"
				label="上司部门" placeholder="请选择上司部门" :rules="[{ required: false }]" />
			<van-popup v-model="show2" position="bottom">
				<van-picker title="选择上司部门" show-toolbar value-key="department" :columns="departmenList"
					@confirm="onConfirm2" @cancel="show2 = false" />
			</van-popup> -->
      <!--上司姓名-->
      <!-- <van-field v-model="user.leaderName" readonly @click="show3 = true" class="m" type="" name="上司" label="上司"
				placeholder="请选择上司" :rules="[{ required: false }]" />
			<van-popup v-model="show3" position="bottom">
				<van-picker title="选择上司" show-toolbar value-key="name" :columns="leaderList" @confirm="onConfirm3"
					@cancel="show3 = false" />
			</van-popup> -->
      <!-- <van-field v-model="user.costCenterName" readonly class="m" type="" name="成本中心" label="成本中心"
				placeholder="请填写成本中心" :rules="[{ required: false }]" /> -->
      <!-- <van-field v-model="user.build" type="" name="幢/座" label="幢/座" placeholder="请填写幢/座"
				:rules="[{ required: false }]" /> -->
      <!-- <van-field v-model="user.floor" type="" name="楼层" label="楼层" placeholder="请填写楼层"
				:rules="[{ required: false }]" /> -->
      <!-- <van-field v-model="user.remark" type="" name="备注" label="备注" placeholder="请填写备注"
				:rules="[{ required: false }]" /> -->
      <div style="margin: 16px;">
        <van-button round block type="info" native-type="submit"
          >保存</van-button
        >
      </div>
    </van-form>
  </div>
</template>

<script>
import { Form, Toast, Field } from "vant";
import { getUserByUserId, UserUpdate } from "../api/index";
export default {
  data() {
    return {
      titlename: "个人信息",
      user: {},
      userId: "",
      departmenList: [],
      leaderList: []
    };
  },
  created: function() {
    this.getUserByUserIdAPI();
  },
  methods: {
    // 获取信息
    async getUserByUserIdAPI() {
      const res = await getUserByUserId({ id: localStorage.getItem("userId") });
      this.user = res.userInfo;
      console.log(res, "res");
    },

    async onSubmit(value) {
      const res = await UserUpdate({ ...value });
      if (res.msg == "success") {
        Toast("修改成功");
        this.$router.push("/My");
      }
      console.log(res);
    }
  }
};
</script>

<style lang="less" scoped>
/deep/.van-form {
  .van-button--info {
    background-color: #0c2469;
    border: 1px solid #0c2469;
    border-radius: 5px;
  }

  .m .van-field__label::before {
    content: "*";
    color: red;
  }

  .van-cell {
    font-size: 0.26rem;
  }

  .textarea {
    font-size: 0.26rem;
    padding: 10px 16px;
    color: #646566;

    textarea {
      width: 98%;
      height: 150px;
      border-color: #e5e5e5;
      color: #999999;
      margin-top: 16px;
      padding: 10px 1%;
    }
  }
}

/deep/.van-field__control {
  text-align: right;
}
</style>
