vxe-table

1. 安装：
   npm install xe-utils vxe-table@legacy
2. 在main.js引入

	import Vue from 'vue'
	import VXETable from 'vxe-table'
	import 'vxe-table/lib/style.css'
	
	Vue.use(VXETable)

3. 使用

		<vxe-table
          ref="xTable"
          :loading="tableData.loading"
          align="center"
          show-overflow
          :row-config="{isCurrent: true, isHover: true}"
          :data="tableData.initData"
          @checkbox-change="checkboxChangeEvent"
          @checkbox-all="checkboxChangeEvent"
          empty-text="没有更多数据了！">
          <!-- 序号 -->
          <!-- <vxe-column type="seq" width="60"></vxe-column> -->
          <!-- 复选框 -->
          <!-- <vxe-column type="checkbox" width="60"></vxe-column> -->
          <vxe-column
              v-for="c in tableData.tableCols"
              :key="c.key"
              :type="c.type"
              :field="c.field"
              :title="c.title"
              :fixed="c.fixed"
              :width="c.width"
              :filters="c.filters">
          </vxe-column>
          <vxe-column title="操作" width="120" show-overflow>
              <template #default="{ row }">
                  <vxe-button type="text" @click="handleDetail(row)">详细</vxe-button>
                  <vxe-button type="text" @click="handleEdit(row)">修改</vxe-button>
              </template>
          </vxe-column>
      </vxe-table>
      <vxe-pager
          style="text-align: center;margin-top: 10px !important;" 
          v-show="tableData.totalResult > 0"
          :current-page="tableData.currentPage"
          :page-sizes="[10, 20,30]"
          :total="tableData.totalResult"
          :layouts="['PrevPage', 'JumpNumber', 'NextPage', 'Sizes', 'Total']"
          @page-change="handlePageChange">
      </vxe-pager>

		tableCols: [
	          //{ key: 0, type: 'seq', width: 50, fixed: null }, // 序号
	          { key: 0, type: 'checkbox', width: 50, fixed: null }, // 复选框
	          { key: 1, field: "BSID", title: "业务ID"},
	          { key: 2, field: "name", title: "业务名称"},
	          { key: 3, field: "b_source_name", title: "业务来源"},
	          { key: 4, field: "area", title: "业务部署地市"},
	          { key: 5, field: "b_assort_name", title: "业务分类"},
	          { key: 6, field: "c_name", title: "客户名称"},
	          { key: 7, field: "v4_segment", title: "IPV4地址段"},
	          { key: 8, field: "v6_segment", title: "IPV6地址段"},                    
	          { key: 9, field: "updated_time", title: "操作时间", width: "200"},
	      ],
	      initData: [],
	      selectData: [],