<style>
  .page-content p {
    margin: 0 !important;
  }

  .quetion_Title {
    background: transparent !important;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    width: 400px;
  }
</style>
<template>
  <div class="page-body">
    <div class="page-search row items-center">
      <div class="col row wrap q-mr-lg q-col-gutter-md">
        <div class="col-3">
          <q-input @input="resetSearch" filled clearable v-model="msg.CustomerName" label="同业名称" maxlength="20" />
        </div>
        <div class="col-3">
          <q-input @input="resetSearch" filled clearable v-model="msg.CustomerId" label="同业ID" maxlength="20" />
        </div>
        <div class="col-3">
          <q-input @input="resetSearch" filled clearable v-model="msg.ContactNumber" label="电话" maxlength="20" />
        </div>
        <div class="col-3">
          <q-select @input="resetSearch" clearable filled v-model="msg.ApproveState" :options="ApproveStateList"
            emit-value map-options label="审核状态" />
        </div>
      </div>
    </div>
    <div class="page-content">
      <div>
        <q-tabs style="margin-bottom:20px;" v-model="tabCheck" @input="resetSearch()" narrow-indicator dense
          align="left" class="text-primary">
          <q-tab :ripple="false" :name="1" label="正式客户" />
          <q-tab :ripple="false" :name="2" label="非正式客户" />
          <q-tab :ripple="false" :name="3" label="未通过客户" />
          <q-tab :ripple="false" :name="4" label="黑名单客户" />
        </q-tabs>
      </div>
      <b2bcustomlist :dataList="dataList" :authObj="authObj" :loading="loading" @success="getList"
        :visibleColumns="visibleColumns" sticky="sticky-tow-column-table sticky-right-column-table"></b2bcustomlist>
      <q-pagination class="full-width justify-end" v-model="msg.pageIndex" color="primary" :max="pageCount"
        :input="true" @input="changePage" />
    </div>
  </div>
</template>
<script>
  import {
    GetCustomerPage_v2,
    RemoveCustomer
  } from "../../api/sale/peemanagement";
  import b2bcustomlist from "../../components/sale/b2bcustomlist";
  export default {
    meta: {
      title: "同行管理"
    },
    components: {
      b2bcustomlist
    },
    data() {
      return {
        pageCount: 0,
        msg: {
          pageIndex: 1,
          pageSize: 12,
          rowsPerPage: 12,
          CustomerName: "", //客户名称
          ContactNumber: "", //联系电话
          ApproveState: "", //审核状态
          QCustomerState: "" //账号状态
        },
        loading: false,
        visibleColumns: [
          "CustomerName",
          "CustomerType",
          "EnterpriseName",
          "ContactNumber",
          "StuNum",
          "OrderNum",
          "OrderSales",
          "ApproveStateStr",
          "CreateByName",
          "CreateTimeStr",
          "QQ",
          "WeChatNo",
        ],
        tabCheck: 1,
        //审核状态列表
        ApproveStateList: [{
            label: "通过",
            value: "1"
          },
          {
            label: "拒绝",
            value: "2"
          }
        ],
        dataList: [],
        //判断显示
        authObj: {
          isShowEdit: true, //显示新增、修改、删除
          isShowBankBook: true, //显示幸福存折
          isShowRebate: true //是否显示返佣
        }
      };
    },
    created() {},
    mounted() {
      this.getList();
    },
    methods: {
      //重新查询
      resetSearch() {
        this.msg.pageIndex = 1;
        this.getList();
      },
      //翻页
      changePage(val) {
        this.msg.pageIndex = val;
        this.getList();
      },
      //获取分页数据
      getList() {
        this.msg.QCustomerState = this.tabCheck;
        GetCustomerPage_v2(this.msg)
          .then(res => {
            this.dataList = res.Data.PageData;
            this.loading = false;
            this.pageCount = res.Data.PageCount;
          })
          .catch(() => {
            this.loading = false;
          });
      }
    }
  };
</script>
<style lang="sass">
  @import url('~assets/css/table.sass')
</style>