<template>
  <div>
    <a-card style="width: 500px;padding:30px">
      <div>
        <p>服务商信息</p>
      </div>
      <a-divider style="margin: 20px 0 10px 0;" />
      <div class="item">
        <span class="label">服务商名称</span>
        <span class="desc">{{ vdata.agentInfo.agentName }}</span>
      </div>
      <div class="item">
        <span class="label">服务商简称</span>
        <span class="desc">{{ vdata.agentInfo.agentShortName }}</span>
      </div>
      <div class="item">
        <span class="label">登录名</span>
        <span class="desc">{{ vdata.agentInfo.loginUsername }}</span>
      </div>
      <div class="item">
        <span class="label">服务商号</span>
        <span class="desc">{{ vdata.agentInfo.agentNo }}</span>
      </div>
      <div class="item">
        <span class="label">渠道商号</span>
        <span class="desc">{{ vdata.agentInfo.isvNo }}</span>
      </div>
      <div class="item">
        <span class="label">上级服务商号</span>
        <span class="desc">{{ vdata.agentInfo.pid }}</span>
      </div>
      <div class="item">
        <span class="label">注册时间</span>
        <span class="desc">{{ vdata.agentInfo.createdAt }}</span>
      </div>
    </a-card>
  </div>
</template>

<script lang="ts" setup>
import { $getMainUserInfo } from '@/api/manage' // 接口
import {reactive} from 'vue'

const vdata = reactive ({
  agentInfo: {} as any
})

  $getMainUserInfo().then(res => {
    vdata.agentInfo = res
    console.log(vdata.agentInfo)
  })
</script>
<style lang="less" scoped>
p {
    font-size: 16px;
    font-weight: 500;
    margin:0 5px;
  }
.desc {
  font-weight: 500;
  font-size: 14px;
  letter-spacing: 0.05em;
  color: #262626;
}
.label {
  font-weight: 500;
  font-size: 14px;
  letter-spacing: 0.05em;
  color: #999;
}
.item {
  display: flex;
  justify-content: space-between;
  padding: 8px;
}
</style>
