<template>
    <div class="merchant-management-page">
        <Card>
            <div class="info-item">
                <h3>商户信息</h3>
                <tables
                    ref="tables"
                    v-model="tableData"
                    :columns="columns"
                    :loading="loading"
                />
            </div>
            <div class="info-item">
                <h3>超级管理员信息</h3>
                <div class="info-flex">
                    <p>姓名：{{merchantInfo.contactName}}</p>
                    <p>身份证号：{{merchantInfo.contactIdCardNumber}}</p>
                </div>
                <div class="info-flex">
                    <p>手机号：{{merchantInfo.mobilePhone}}</p>
                    <p>邮箱：{{merchantInfo.contactEmail}}</p>
                </div>
            </div>
            <div class="info-item">
                <h3>结算银行卡信息</h3>
                <div class="info-flex">
                  <p>开户名称：{{merchantInfo.accountName}}</p>
                  <p>银行卡号：{{merchantInfo.accountNumber}}</p>
                </div>
                <div class="info-flex">
                    <p>开户行所在地：{{merchantInfo.bankAddressCode}}</p>
                    <p>开户行名称：{{merchantInfo.bankName}}</p>
                </div>
            </div>
        </Card>
    </div>
</template>
<script>
import Tables from '_c/tables'
import { formatTime } from '@/libs/tools'
export default {
  components: {
    Tables
  },
  data () {
    return {
      tableData: [],
      merchantInfo: '',
      loading: false,
      columns: [
        { title: '商户号', key: 'subMchid', align: 'center', minWidth: 130 },
        { title: '商户类型',
          key: 'type',
          align: 'center',
          minWidth: 130,
          render: (h, params) => {
            return h('span', params.row.type == 2401 ? '小微商户' : params.row.type == 4 ? '个体工商户' : '企业')
          }
        },
        { title: '商户渠道', key: 'shopChannel', align: 'center', minWidth: 130 },
        { title: '申请时间',
          key: 'createTime',
          align: 'center',
          minWidth: 130,
          render: (h, params) => {
            return h('span', formatTime(params.row.createTime))
          }
        },
        // { title: '管理', key: 'orderId', align: 'center', minWidth: 200 }
        { title: '管理',
          minWidth: 190,
          align: 'center',
          render: (h, params) => {
            return h('span', {
              domProps: {
                innerHTML: "请使用超级管理员的微信号扫码登录：<a href='https://pay.weixin.qq.com/partner/public/home'>微信支付商户管理</a>"
              }
            })
          }
        }
      ]
    }
  },
  methods: {
    requestData () {
      this.loading = true
      this.api({
        apiName: 'merchantinfoquerybyadminId',
        complete: () => {
          this.loading = false
        },
        success: (res) => {
          this.tableData = []
          let obj = {
            subMchid: res.data.subMchid,
            type: res.data.type,
            shopChannel: '微信支付',
            createTime: res.data.createTime
            // url: 'https://pay.weixin.qq.com/partner/public/home'
          }
          this.tableData.push(obj)
          this.merchantInfo = res.data
          // this.totalSize = res.total
        }
      })
    }
    // handleDetaild (row) {
    //   return () => {
    //     window.location.href = 'https://pay.weixin.qq.com/partner/public/home'
    //   }
    // }
  },
  created () {
    this.requestData()
  }
}
</script>
<style lang="less" scoped>
.info-item {
  padding: 20px 36px;
  border: 1px solid #dcdee2;
  border-radius: 5px;
  margin-bottom: 15px;
}
.info-flex {
    display: flex;
    p {
        width: 50%;
        margin: 15px 0;
    }
}
</style>
