<template>
  <div>
    <div class="selfClass" :style="{height}">
      <el-card :bordered="false" style="width:600px;margin:50px auto auto auto">
        <div style="text-align: center">
          <el-row>
            <el-col :span="24">
            <div class="self-avatar">
              <h2>微信绑定</h2>
            </div>
            </el-col>
            <el-col :span="24">
            <div v-if="nickname">
              <img :src="headimgurl" width="200" height="200">
              {{ nickname }}<br>
              <a href="#" @click="_rebind()">重新绑定</a>
            </div>
            <div v-if="redirect_uri">
              <Wxlogin :appid="appid" :scope="scope" :redirect_uri="redirect_uri" />
            </div>
            </el-col>
          </el-row>
        </div>
      </el-card>
    </div>
  </div>
</template>
<script>
import { sysCompany } from '../../../api'
import global from '../../../api/config'
import Wxlogin from './wxlogin.vue'

export default {
  components: {
    Wxlogin
  },
  data() {
    return {
      appid: 'wx92793f505ed4520b',
      scope: 'snsapi_login',
      redirect_uri: '',
      headimgurl: '',
      nickname: ''
    }
  },
  computed: {
    height: function() {
      return this.$tableHeight('', 120) + 'px'
    }
  },
  mounted() {
    this._open()
  },
  methods: {
    _open() {
      this.redirect_uri = ''
      this.nickname = ''
      // 查询我的企业相关信息(每次都查询相关信息)
      this._getCompanyInfo()
    },
    _getCompanyInfo: async function() {
      const result = await sysCompany.getMy()
      this._show(result.userPlatform)
    },
    _show(userPlatform) {
      if (this.$string(userPlatform).isEmpty()) {
        this.redirect_uri =
          'http://sso.patzn.com/wxbind?t=' +
          new Date().getTime() +
          '%26env=' +
          global.env
        this.nickname = ''
      } else {
        this.headimgurl = userPlatform.headimgurl
        this.nickname = userPlatform.nickname
      }
    },
    _rebind() {
      this._show(null)
    }
  }
}
</script>
<style>
.selfClass {
  background: #eee;
  padding: 20px;
}

.self-avatar {
  margin-bottom: 20px;
  border-bottom: 1px solid #eee;
  padding-bottom: 10px;
  text-align: center;
}
</style>
