<template>

  <div>
    <a-page-header
      style="background-color: #FFFFFF;"
      title="客户详情"
      sub-title=""
      @back="showCheckList"
    >
      <a-descriptions :title="info.customerName" :column="3" :bordered="false">
        <a-descriptions-item label="客户编号">{{info.customerNo}}</a-descriptions-item>
        <a-descriptions-item label="客户经理">{{info.manager}}</a-descriptions-item>
        <a-descriptions-item label="经理电话">{{info.phone}}</a-descriptions-item>
      </a-descriptions>
    </a-page-header>

    <a-card :bordered="false" style="margin-top: 10px;">
      <a-form-model
        ref="ruleForm"
        :label-col="{ span: 1 }"
        :wrapper-col="{ span: 23 }"
      >

        <a-card :bordered="false" title="服务列表" style="margin-top: 10px;">
          <a-table size="small"
                   :dataSource="smsNumberList"
                   :columns="smsNumberColumns"
                   rowKey="id"
                   :pagination="ipagination"
                   @change="handleTableChange2">

          </a-table>
        </a-card>


        <a-form-model-item :wrapper-col="{ span: 14, offset: 4 }" style="margin-top: 10px;">
          <a-space>
            <a-button @click="showCheckList">
              返回
            </a-button>
          </a-space>
        </a-form-model-item>

      </a-form-model>

    </a-card>

  </div>

</template>

<script>

import { httpAction, getAction } from '@api/manage'
import '@/assets/less/TableExpand.less'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import {filterObj} from '@/utils/util'

export default {
  name: 'CompanyDetail',
  inject:['closeCurrent'],
  mixins:[JeecgListMixin],
  data () {
    return {
      description: '稽核详情页面',
      info: {},
      url: {
        queryInfo: "/smsCheck/company/queryById",
        smsNumberList: "/smsCheck/smsNumber/list",
        list: "/smsCheck/customerInfo/list",
        listData: "/smsCheck/customerData/list"
      },
      customerNo: '',
      smsNumberList: [],
      smsNumberColumns:[
        {
          title: '用户编号',
          align:"left",
          dataIndex: 'userNo'
        },
        {
          title: '服务号码',
          align:"left",
          dataIndex: 'smsNumber'
        },
        {
          title: '开通状态',
          align:"left",
          dataIndex: 'userState'
        },
        {
          title: '入网时间',
          align:"left",
          dataIndex: 'networkAccessTime'
        },
        {
          title: '操作',
          align:"left",
          dataIndex: 'op',
          scopedSlots: { customRender: 'taskCheck' }
        }
      ],
      ipagination:{
        current: 1,
        pageSize: 5,
        pageSizeOptions: ['5', '10', '20', '30'],
        showTotal: (total, range) => {
          return range[0] + "-" + range[1] + " 共" + total + "条"
        },
        showQuickJumper: true,
        showSizeChanger: true,
        total: 0
      },
      autoSearch: false,
    }
  },
  created() {
    this.info.id = this.$route.query.id;
    this.queryInfoById(this.info.id);
  },
  methods: {
    // 显示列表页面
    showCheckList() {
      this.$router.go(-1);
      this.closeCurrent();
    },
    queryInfoById (id) {
      let url = this.url.queryInfo;
      let params = {
        id: id
      }
      let that = this;
      getAction(url, params).then(res => {
        if (res.success) {
          that.info = res.result;
          that.customerNo = that.info.customerNo;
          if (that.customerNo) {
            that.getSmsNumberList();
          }
        }
      }).finally(() => {

      })
    },
    getSmsNumberList() {
      let httpUrl = this.url.smsNumberList;

      let queryParam = {
        'customerNo': this.customerNo
      };

      let param = Object.assign({},queryParam);
      param.pageNo = this.ipagination.current;
      param.pageSize = this.ipagination.pageSize;

      let params = filterObj(param);
      let that = this;
      // 发送请求
      getAction(httpUrl, params)
        .then((res) => {
          if(res.success){
            that.smsNumberList = res.result.records;
          }else{
            that.smsNumberList = [];
          }
        }).finally(() => {

      })
    },
    handleTableChange2(pagination, filters, sorter) {
      //分页、排序、筛选变化时触发
      if (Object.keys(sorter).length > 0) {
        this.isorter.column = sorter.field;
        this.isorter.order = "ascend" == sorter.order ? "asc" : "desc"
      }
      this.ipagination = pagination;
      this.getSmsNumberList();
    },
  }
}
</script>

<style scoped>
.badge-width-100{
  width: 100%;
}

</style>