<template>
  <template-page
    ref="pageRef"
    :getList="getList"
    :operation="operation()"
    :optionsEvensGroup="optionsEvensGroup"
    :columnParsing="columnParsing"
    :tableAttributes="tableAttributes"
    :tableEvents="tableEvents"
  >
    <Popu v-if="!isShow">
      <el-page-header slot="head" :content="content" @back="handleClose" />
      <Distributor :cid="id" />
    </Popu>
  </template-page>
</template>

<script>
import TemplatePage from '@/components/template/template-page-1.vue'
import Popu from '@/components/template/popu.vue'

import { getCustomerlist, policyCustomerCountListV2 } from '@/api/policy_list'
// import Minxin from '@/mixin'
import Distributor from './components/Distributor'

export default {
  mixins: [],
  data() {
    return {
      content: '详情',
      // 关闭新增弹窗
      handleClose: () => {
        this.isShow = true
        this.$refs.pageRef.refreshList()
      },
      // 事件组合
      optionsEvensGroup: [],
      // 表格属性
      tableAttributes: {
        // 启用勾选列
        selectColumn: false
      },
      // 表格事件
      tableEvents: {
        'selection-change': this.selectionChange
      },
      recordSelected: [],

      //
      isCollapse: true,
      isShow: true,
      id: '',
      input: '',
      dataList: [],
      screenForm: {
        code: '',
        remark: '',
        title: ''
      }
    }
  },
  methods: {
    // 列表请求函数
    getList: policyCustomerCountListV2,
    // 列表导出函数
    // exportList: exportLevelList,
    // 表格列解析渲染数据更改
    columnParsing(item, defaultData) {
      return defaultData
    },
    // 监听勾选变化
    selectionChange(data) {
      this.recordSelected = data
    },
    operation() {
      return (h, { row, index, column }) => {
        return (
          <div class="operation-btns">
            <el-button
              size="mini"
              type="text"
              onClick={async () => {
                this.id = row.id
                this.isShow = false
              }}
            >
              详情
            </el-button>
          </div>
        )
      }
    }

    // getList() {
    //   this.listLoading = true
    //   const params = {
    //     pageNum: this.currentPage,
    //     pageSize: this.pageSize,
    //     code: this.screenForm.code,
    //     remark: this.screenForm.remark,
    //     title: this.screenForm.title
    //   }
    //   getCustomerlist(params).then(res => {
    //     console.log(res)
    //     this.dataList = res.data.records
    //     this.listTotal = res.data.total
    //     this.listLoading = false
    //   })
    // }
  },
  components: {
    TemplatePage,
    Popu,
    Distributor
  }
}
</script>

<style lang="scss" scoped>
.mg {
  margin: 20px 0;
}
.app-main {
  margin-top: 100%;
}
.btn {
  text-align: right;
}
</style>
