CustomTable

CustomTable是基于elementui将表格与分页封装一体的组件,反对失常应用elemenui表格中的属性与办法。

1.应用例子

 <CustomTable      ref="customTable"      :api="'/api/crmemotion/customer-v2/customer-list.do'"      :simpleMode="false"      :ordered="true"      :requestMethod="'post'"      @dataUpdates="dataUpdates"    >      <el-table-column        prop="memberId"        label="相亲ID"        :min-width="TABLELINEWIDTH.ICONID"        sortable      >        <template slot-scope="scope">          <a            class="za-tx"            href="javascript:void(0)"            @click="              common.openPage.customPage(                '跟进客户',                'followUpCustomer',                scope.row.emotionId,                {                  memberId: scope.row.emotionId,                  trueMemberId: scope.row.memberId,                }              )            "          >            {{ scope.row.memberId !== -1 ? scope.row.memberId : '' }}          </a>        </template>      </el-table-column></CustomTable>

2.属性

2.1.应用elementui table属性

基于elementui的customtable能够间接失常elementui对应的属性、事件、插槽个性等,无再次学习的老本。

2.2.申请接口

apirequestMethodrequestConfig属性发送申请。
listName为接口返回列表名,默认为list

  • 目前requestMethod申请形式只反对getpost申请,同时当申请形式为post时组件外部会将申请格局通过qs.stringify()格式化,以反对情感crm的post申请参数格局。
  • requestConfig用于设置axios申请头配置,传入格局例如:

     <CustomTable    :requestConfig="{ 'Content-Type': 'multipart/form-data' }" />
  • 表格外部配有loading属性。
  • 胜利申请后组件通过dataUpdates事件将返回数据data传给父组件

2.3.分页

simpleModecountOptionpageCount设置分页组件属性。

  • simpleMode代表分页是否为简略模式,默认值为否。
  • countOption为页数展现数抉择,仅在一般模式下失效。

2.4.表格配置

ordered设置表格是否有序号