<div :class="{ 'grid': true, 'show-paging-bar': isEnablePagingBar, 'hidden-paging-bar': !isEnablePagingBar }"> <i-form> <el-table v-if="isDisplay === true" :default-sort="{ prop: minorSortPSDEF, order: Object.is(minorSortDir, 'ASC') ? 'ascending' : Object.is(minorSortDir, 'DESC') ? 'descending' : '' }" @sort-change="onSortChange($event)" :border="isDragendCol" :highlight-current-row ="isSingleSelect" :row-class-name="getRowClassName.bind(_self)" :cell-class-name="getCellClassName.bind(_self)" size="mini" stripe @row-click="rowClick($event)" @select-all="selectAll($event)" @select="select($event)" @row-class-name="onRowClassName($event)" @row-dblclick="rowDBLClick($event)" ref='multipleTable' :data="items" :show-header="!isHideHeader"> <template slot="empty"> 无数据 <span class="quick-toolbar"> </span> </template> <template v-if="!isSingleSelect"> <el-table-column align="center" type='selection' :width="checkboxColWidth"></el-table-column> </template> <template v-if="getColumnState('connectionname')"> <el-table-column show-overflow-tooltip :prop="'connectionname'" :label="$t('entities.connection.main_grid.columns.connectionname')" :width="150" :align="'left'" :sortable="'custom'"> <template v-slot:header="{column}"> <span class="column-header "> {{$t('entities.connection.main_grid.columns.connectionname')}} </span> </template> <template v-slot="{row,column,$index}"> <span>{{row.connectionname}}</span> </template> </el-table-column> </template> <template v-if="getColumnState('statecode')"> <el-table-column show-overflow-tooltip :prop="'statecode'" :label="$t('entities.connection.main_grid.columns.statecode')" :width="100" :align="'left'" :sortable="'custom'"> <template v-slot:header="{column}"> <span class="column-header "> {{$t('entities.connection.main_grid.columns.statecode')}} </span> </template> <template v-slot="{row,column,$index}"> <template > <codelist :value="row.statecode" tag='Connection__StateCode' codelistType='STATIC' ></codelist> </template> </template> </el-table-column> </template> <template v-if="getColumnState('statuscode')"> <el-table-column show-overflow-tooltip :prop="'statuscode'" :label="$t('entities.connection.main_grid.columns.statuscode')" :width="100" :align="'left'" :sortable="'custom'"> <template v-slot:header="{column}"> <span class="column-header "> {{$t('entities.connection.main_grid.columns.statuscode')}} </span> </template> <template v-slot="{row,column,$index}"> <template > <codelist :value="row.statuscode" tag='Connection__StatusCode' codelistType='STATIC' ></codelist> </template> </template> </el-table-column> </template> <template v-if="getColumnState('record1rolename')"> <el-table-column show-overflow-tooltip :prop="'record1rolename'" :label="$t('entities.connection.main_grid.columns.record1rolename')" :width="150" :align="'left'" :sortable="'custom'"> <template v-slot:header="{column}"> <span class="column-header "> {{$t('entities.connection.main_grid.columns.record1rolename')}} </span> </template> <template v-slot="{row,column,$index}"> <span>{{row.record1rolename}}</span> </template> </el-table-column> </template> <template v-if="getColumnState('record2rolename')"> <el-table-column show-overflow-tooltip :prop="'record2rolename'" :label="$t('entities.connection.main_grid.columns.record2rolename')" :width="150" :align="'left'" :sortable="'custom'"> <template v-slot:header="{column}"> <span class="column-header "> {{$t('entities.connection.main_grid.columns.record2rolename')}} </span> </template> <template v-slot="{row,column,$index}"> <span>{{row.record2rolename}}</span> </template> </el-table-column> </template> <template v-if="adaptiveState"> <el-table-column></el-table-column> </template> </el-table> <row class='grid-pagination' v-show="items.length > 0"> <page class='pull-right' @on-change="pageOnChange($event)" @on-page-size-change="onPageSizeChange($event)" :transfer="true" :total="totalRecord" show-sizer :current="curPage" :page-size="limit" :page-size-opts="[10, 20, 30, 40, 50, 60, 70, 80, 90, 100]" show-elevator show-total> <span> <span class="page-column"> <poptip transfer placement="top-start"> <i-button icon="md-menu">{{$t('app.gridpage.choicecolumns')}}</i-button> <div slot="content"> <template v-for="col in allColumns"> <div :key="col.name"><el-checkbox v-model="col.show" @change="onColChange()">{{$t(col.langtag)}}</el-checkbox></div> </template> </div> </poptip> </span> <span v-if="selections.length > 0" class="batch-toolbar"> </span> <span class="page-button"><i-button icon="md-refresh" :title="$t('app.gridpage.refresh')" @click="pageRefresh()"></i-button></span> <span> {{$t('app.gridpage.show')}} <span> <template v-if="items.length === 1"> 1 </template> <template v-else> <span>{{(curPage - 1) * limit + 1}} - {{totalRecord > curPage * limit ? curPage * limit : totalRecord}}</span> </template> </span> {{$t('app.gridpage.records')}},{{$t('app.gridpage.totle')}} {{totalRecord}} {{$t('app.gridpage.records')}} </span> </span> </page> </row> </i-form> </div>