<template>
  <ifbp-page>
    <ifbp-breadcrumb name="用户信息设置"></ifbp-breadcrumb>
    <!-- 用户信息详情 -->
    <ifbp-main-area type="detail">
      <ifbp-panel title="用户信息" :icons="userIcons">
        <ifbp-template 
                     ref="userFormRef"
                     tplId="userFormId"
                     :funnode="funnode"
                     :nexuskey="nexuskey"
                     show-type="form"
                     :tplData="userFormData"
                     :methods="userFormMethods"
                     :editable="userFormEdit"
                     :form-show-message="userFormEdit">
        </ifbp-template>
        <div class="fr">
          <el-button type="default" v-if="userFormEdit" @click="cancalUser">取消</el-button>
          <el-button type="primary" v-if="userFormEdit" @click="confirmUser">保存</el-button>
        </div>
        <div style="clear:both;"></div>
      </ifbp-panel>
    </ifbp-main-area>
  </ifbp-page>
</template>
<script>
  export default {
    data(){
      var vm = this;
      return {
        funnode: 'YHGL',
        nexuskey: 'USER_DETAIL',
        userIcons: [{
          icon: 'edit',
          show: true,
          click: function () {
            vm.userFormEdit = true;
            vm.userIcons[0].show = false;
          }
        }],
        userFormData: {
          user: {}
        },
        originalValueUser: '',
        userFormEdit: false,
        userFormMethods: {},

        delDialogVisible: false,
        isHide: true,
        isNew: true,
        formData: {},
        currentPage: 1,
        pk_user: '59dd1f14-474d-413a-8adf-0958133e6ef3',
        currentValueUser: '',
        userEdit: false,
      };
    },
    created(){
      this.request();
    },
    methods: {
      /**
       *   用户详情
       **/
      request() {
        //用户
        this.$http({
          url: '/ifbp-app-sm/sm/user/' + this.$root.$router.currentRoute.params.id,
          method: 'get'
        }).then((res) => {
          if(res.data.success === true) {
            this.originalValueUser = JSON.parse(JSON.stringify(res.data.data));
            this.$nextTick(() => {
              if(this.$refs["userFormRef"]) {
                this.$refs["userFormRef"].setData("user",JSON.parse(JSON.stringify(res.data.data)));
               } else {
                this.$set(this.tplData, 'uitemplateFormData', JSON.parse(JSON.stringify(res.data.data)));
              }
            });
          } else {
            this.$message({
              message: res.data.data,
              type: 'error'
            });
          }
        });
      },
      /**
       *  一些控制页面状态的方法
       *  都在按钮上绑着
       **/
      // 返回list页面
      backInfo() {
        this.$router.push('/userInfo');
      },
      /**
       *  修改用户信息
       *
       **/
      // 确认修改
      confirmUser(){
        this.$refs.userFormRef.getFormComp().validate((valid) => {
          if(valid) {
            let submitData = this.$refs.userFormRef.getData("user");
            this.$http({
              url: '/ifbp-app-sm/sm/user/update',
              method: 'put',
              data: submitData,
            }).then((res) => {
              if (res.data.success) {
                this.$message({
                  message: '修改成功',
                  type: 'success'
                });
                this.userFormEdit = false;
                this.$nextTick(() => {
                  if(this.$refs["userFormRef"]) {
                    this.$refs["userFormRef"].setData("user",JSON.parse(JSON.stringify(submitData)));
                  } else {
                    this.$set(this.tplData, 'uitemplateFormData', JSON.parse(JSON.stringify(submitData)));
                  }
                });
                this.userIcons[0].show = true;
              } else {
                this.$message({
                  message: res.data.error.errorMessage,
                  type: 'error'
                });
              }
            });
          }else {
            // 验证失败
          }
        });
      },
      cancalUser() {
        this.userFormEdit = false;
        this.userIcons[0].show = true;
        this.$nextTick(() => {
          this.$refs.userFormRef.setFormData(JSON.parse(JSON.stringify(this.originalValueUser)));
        });
      },
    }
  };

</script>
<style scoped>
.part-title{
  height: 54px;
  line-height: 54px;
  margin-bottom: 20px;
  font-weight: 700;
  color: #333;
  font-size: 14px;
}
</style>
