<template>
  <div v-loading="loading">
    <div class="white-box">
      <el-form ref="form" :model="form" label-width="250px" class="form-page">
        <el-form-item label="体系名称" width="150">
          <el-input v-model="form.systemName"></el-input>
        </el-form-item>
        <el-form-item label="领导会员编号">
          <el-tooltip class="item" effect="dark" content="输入账号后点击空白处，可检测该账号的会员姓名" placement="top-start">
            <el-input v-model="form.leaderUserName" :disabled="isEdit" @change="handleChkUser">
              <template slot="append">【{{leaderRealName}}】</template>
            </el-input>
          </el-tooltip>
        </el-form-item>
        <el-form-item label="备注">
          <el-input v-model="form.remark"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onSubmit" :loading="submitButtonStat">保存</el-button>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>
  import Vue from 'vue'
  import store from '@/utils/vuexStore'
  import network from '@/utils/network'
  import tool from '@/utils/tool'

  export default {
    name: 'user_system-edit',
    mounted() {
      store.state.socket.onMessageCallback = this.onMessageCallback
      if (this.$route.name === 'user_system-edit') {
          network.getData('user/system-edit/' + this.$route.params.id).then(response => {
            this.form.systemName = response.oneData.SYSTEM_NAME
            this.form.leaderUserName = response.oneData.LEADER_NAME
            this.form.remark = response.oneData.CREATE_REMARK
            this.loading = false
            this.isEdit = true
            this.handleChkUser()
          }).catch(response => {
            this.$router.go(-1)
          })
      } else {
        this.loading = false
      }
    },
    data() {
      return {
        form: {
          systemName: null,
          leaderUserName: null,
          remark: null,
        },
        leaderRealName: null,
        loading: true,
        submitButtonStat: false,
        isEdit: false,
        openBanks: null,
      }
    },
    methods: {
      handleChkUser() {
        if (this.form.leaderUserName) {
          this.loading = true
          network.getData('user/full-info', {userName: this.form.leaderUserName}).then(response => {
            this.leaderRealName = response.REAL_NAME
            this.loading = false
          }).catch(response => {
            this.loading = false
          })
        }
      },
      onSubmit() {
        this.submitButtonStat = true
        let path = 'user/system-add'
        if (this.$route.name === 'user_system-edit') {
          path = 'user/system-edit/' + this.$route.params.id
        }
        network.postData(path, this.form).then(response => {
          this.$message({
            message: response,
            type: 'success'
          })
          this.submitButtonStat = false
          this.$router.go(-1)
        }).catch(response => {
          this.submitButtonStat = false
        })
      },
      onMessageCallback() {
        //this.$router.go(-1)
      },
    }
  }
</script>

<style scoped>

</style>
