Package Exports

v-jntable

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (v-jntable) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

v-jntable

a project for janan 主要封装了element的table用来满足项目的table的各种情况

Build Setup

# install dependencies
npm install v-jntable --save

vue项目中的引用
import vJntable from 'v-jntable'
Vue.use(vJntable)

 <v-jntable
      :tableData="equipmentsData"
      :handle-width="300"
      :pagination="true"
      :check-select="true"
      :serial-number="true"
      :handle-btn="true"
      :icon-handle="false"
      :pagiData="pagiData"
      :title-configure="titleData"
      :handle-configure="handleData"
      v-on:handleClick="handleClick"
      v-on:selectionChange="selectionChange"
      v-on:handlePageChange="pageChange"
      v-on:handleSizeChange="handleSizeChange"
    ></v-jntable>

参数说明

参数	说明	类型	可选值	默认值
tableData	table所展示的数据	Array	-	-
pagiData	分页的数据	objectpagiData	-	{}
handle-width	操作项的宽度	number	-	200
pagination	是否有分页	boolean	-	false
check-select	是否有勾选	boolean	-	false
serial-number	是否有序列	boolean	-	false
handle-btn	是否有操作列	boolean	-	false
title-configure	表头的数据值	Arraytitle	-	[]
handle-configure	操作列的具体值	Arrayhandle	-	[]
icon-handle-configure	带有图标的操作列的具体值	Arrayicon	-	[]

pagiData是object，对应的参数如下

pagiData

参数	说明	类型	可选值	默认值
currentPage	当前所在页	number	-	1
pageSizes	当前页可选择的显示的个数集合	Array	-	[10, 20, 30, 40]
pageSize	当前页的个数	number	-	10
total	总个数	number	-	0

pagiSizes是可以选择的每页可以显示的数据条数

title-configure

参数	说明	类型	可选值	默认值
prop	当前列得数据的key的名称	string	-	-
label	当前列表头的名称	string	-	-
popoverData	弹出框显示的内容。当ifPopover为true时，该字段必填	ArraypopoverData	-	10
shortNum	最多显示文字的个数	number	-	-
ifPopover	是否需要弹出框	boolean	-	-
width	该列的宽度	string	-	-
ifOnline	当前列是否是在离线	boolean	-	-

popoverData是当ifPopover为true时必填

{
      prop: "inTemp",
      label: "箱内温度",
      popoverData: [{ prop: "inTemp1", label: '箱内温度1' }, { prop: "inTemp2", label: '箱内温度2' }, { prop: "inTemp3", label: '箱内温度3' }],
      shortNum: "4",
      ifPopover: true,
      width: "69"
    }

popoverData

参数	说明	类型	可选值	默认值
prop	弹出框显示得数据的key的名称	string	-	-
label	弹出框显示数据的名称	string	-	-

{ prop: "inTemp1", label: '箱内温度1' }

handle-configure

参数	说明	类型	可选值	默认值
key	当前操作的key，该key自定义当点击操作后返回相同的key，用于识别点击的哪个操作按钮	string	-	-
btnName	当前操作的名称	string	-	-
btn	当前操作是否可显示	boolean	-	-

{
      key: 'modify',
      btnName: '编辑',
      btn: true,
    }

icon-handle-configure

参数	说明	类型	可选值	默认值
prop	当前列得数据的key的名称	string	-	-
label	当前列表头的名称	string	-	-
width	该列的宽度	string	-	-
btnIcon	icon的名称	string	-	-

{
      prop: 'virtualLed',
      label: '虚拟站牌',
      width: '69',
      btnIcon: 'el-jn-icon-dianzizhanpai',
    }

事件

事件名	说明	参数
selectionChange	当前所在页	-
handlePageChange	当前所在页	-
handleSizeChange	当前所在页	-

事件无说明