<template>
  <div>
    <van-nav-bar fixed>
      <template #title>
        <div>
          调试信息
        </div>
      </template>
    </van-nav-bar>
    <br>
    <van-divider/>

    <van-form label-align="right" label-width="70">
      <van-cell-group>
        <van-field v-model="userInfo.account" readonly   autosize rows="1" label="账号：" type="textarea"/>
        <van-field v-model="userInfo.nickName" readonly  autosize rows="1" label="姓名：" type="textarea"/>
        <van-field v-model="userInfo.genderName" readonly autosize rows="1" label="性别：" type="textarea"/>
        <van-field v-model="userInfo.userId" readonly autosize rows="1" label="用户ID：" type="textarea"/>
        <van-field v-model="userInfo.token" readonly autosize rows="1" label="Token：" type="textarea"/>
        <van-field v-model="userInfo.domain" readonly autosize rows="1" label="接入地址：" type="textarea"/>
      </van-cell-group>
    </van-form>
    <br>
    <van-button style="margin-left: 10%;width: 80%" round type="primary" color="#1989fa" @click="copyUserInfo()">
      复制
    </van-button>
    <br> <br>
    <van-button style="margin-left: 10%;width: 80%" round type="danger" color="#EC808D" @click="handleBack()">
      关闭
    </van-button>
  </div>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      userInfo: {},
    }
  },
  created() {
    let userInfo = sessionStorage.getItem("userInfo")
    if (userInfo) {
      this.userInfo = JSON.parse(userInfo)
      this.userInfo.genderName = (this.userInfo.gender == null ? '未知' : this.userInfo.gender == 1 ? '男' : '女')
    }
  },
  methods: {
    copyUserInfo() {
      let textarea = document.createElement('textarea');
      textarea.style.position = 'fixed';
      textarea.style.opacity = 0;
      textarea.value = JSON.stringify(this.userInfo);
      document.body.appendChild(textarea);
      textarea.select();
      document.execCommand('copy');
      document.body.removeChild(textarea);
      this.$toast.tips('已复制到剪贴板！');
    },
    handleBack() {
      this.$router.go(-1);
    }
  }
}
</script>
<style scoped lang="less">

</style>