bri-components 1.1.3 → 1.1.4

package/src/components/list/easyTable/v-table/src/table.vue

@@ -1,1565 +0,0 @@
-<template>
-    <div
-        :class="['v-table-views', 'v-table-class',`${className}`]"
-        ref="table"
-        :style="{
-            'width': internalWidth + 'px',
-            'height': getTableHeight,
-            'background-color': tableBgColor
-        }"
-    >
-        <!-- 左列 -->
-        <template v-if="frozenCols.length > 0">
-            <div
-                class="v-table-leftview"
-                :style="{'width':leftViewWidth+'px'}"
-            >
-                <!-- 左列-头 -->
-                <div
-                    :class="{
-                        'v-table-header':true,
-                        'v-table-title-class':true,
-                        'v-table-header-notFixed':!fixTitle
-                    }"
-                    :style="{'width': leftViewWidth+'px','background-color':titleBgColor,'color':titleFontColor}"
-                >
-                    <div
-                        class="v-table-header-inner"
-                        style="display: block;"
-                    >
-                        <table
-                            class="v-table-htable"
-                            border="1"
-                            cellspacing="0"
-                            cellpadding="0"
-                            bordercolor="#E5E5E5"
-                        >
-                            <tbody>
-                                <template v-if="frozenTitleCols.length > 0">
-                                    <tr
-                                        v-for="(row, ridx) in frozenTitleCols"
-                                        :key="ridx"
-                                    >
-                                        <td
-                                            v-for="(col, cidx) in row"
-                                            :key="cidx"
-                                            :class="[col.titleCellClassName]"
-                                            :colspan="col.colspan"
-                                            :rowspan="col.rowspan"
-                                            @mousemove.stop="handleTitleMouseMove($event,col.fields)"
-                                            @mousedown.stop="handleTitleMouseDown($event)"
-                                            @mouseout.stop="handleTitleMouseOut()"
-                                            @click="titleCellClick(col.fields,col.title);"
-                                            @dblclick="titleCellDblClick(col.fields,col.title)"
-                                        >
-                                            <div
-                                                :class="['v-table-title-cell',showVerticalBorder?'vertical-border':'',showHorizontalBorder?'horizontal-border':'']"
-                                                :style="{'width':titleColumnWidth(col.fields)+'px','height':titleColumnHeight(col.rowspan)+'px','text-align':col.titleAlign}"
-                                            >
-                                                <span class="table-title">
-                                                    <span v-if="isSelectionCol(col.fields)">
-                                                        <v-checkbox
-                                                            @change="handleCheckAll"
-                                                            :indeterminate="indeterminate"
-                                                            v-model="isAllChecked"
-                                                            :show-slot="false"
-                                                            label="check-all"
-                                                        ></v-checkbox>
-                                                    </span>
-                                                    <span
-                                                        v-else
-                                                        v-html="col.title"
-                                                    ></span>
-                                                    <span
-                                                        @click="sortControl(col.fields[0])"
-                                                        class="v-table-sort-icon"
-                                                        v-if="enableSort(col.orderBy)"
-                                                    >
-                                                        <slot name="sort">
-                                                            <i :class='["v-icon-up-dir",getCurrentSort(col.fields[0]) ==="asc" ? "checked":""]'></i>
-                                                            <i :class='["v-icon-down-dir",getCurrentSort(col.fields[0]) ==="desc" ? "checked":""]'></i>
-                                                        </slot>
-                                                    </span>
-                                                </span>
-                                                <!--filters-->
-                                                <v-dropdown
-                                                    class="v-table-dropdown"
-                                                    v-if="enableFilters(col.filters,col.fields)"
-                                                    v-model="col.filters"
-                                                    :show-operation="col.filterMultiple"
-                                                    :is-multiple="col.filterMultiple"
-                                                    @on-filter-method="filterEvent"
-                                                    @change="filterConditionChange(col.filterMultiple)"
-                                                >
-                                                    <i :class="['v-table-filter-icon',vTableFiltersIcon(col.filters)]"></i>
-                                                </v-dropdown>
-                                            </div>
-                                        </td>
-                                    </tr>
-                                </template>
-
-                                <template v-else>
-                                    <tr class="v-table-header-row">
-                                        <td
-                                            v-for="(col, fcidx) in frozenCols"
-                                            :key="fcidx"
-                                            :class="[col.titleCellClassName]"
-                                            @mousemove.stop="handleTitleMouseMove($event,col.field)"
-                                            @mousedown.stop="handleTitleMouseDown($event)"
-                                            @mouseout.stop="handleTitleMouseOut()"
-                                            @click="titleCellClick(col.field,col.title);"
-                                            @dblclick="titleCellDblClick(col.field,col.title)"
-                                        >
-                                            <div
-                                                :class="['v-table-title-cell',showVerticalBorder?'vertical-border':'',showHorizontalBorder?'horizontal-border':'']"
-                                                :style="{'width':col.width+'px','height':titleRowHeight+'px','text-align':col.titleAlign}"
-                                            >
-                                                <span class="table-title">
-                                                    <span v-if="col.type === 'selection'">
-                                                        <v-checkbox
-                                                            @change="handleCheckAll"
-                                                            :indeterminate="indeterminate"
-                                                            v-model="isAllChecked"
-                                                            :show-slot="false"
-                                                            label="check-all"
-                                                        ></v-checkbox>
-                                                    </span>
-                                                    <span
-                                                        v-else
-                                                        v-html="col.title"
-                                                    ></span>
-                                                    <span
-                                                        @click="sortControl(col.field)"
-                                                        class="v-table-sort-icon"
-                                                        v-if="enableSort(col.orderBy)"
-                                                    >
-                                                        <slot name="sort">
-                                                            <i :class='["v-icon-up-dir",getCurrentSort(col.field) ==="asc" ? "checked":""]'></i>
-                                                            <i :class='["v-icon-down-dir",getCurrentSort(col.field) ==="desc" ? "checked":""]'></i>
-                                                        </slot>
-                                                    </span>
-                                                </span>
-                                                <!--filters-->
-                                                <v-dropdown
-                                                    class="v-table-dropdown"
-                                                    v-if="enableFilters(col.filters)"
-                                                    v-model="col.filters"
-                                                    :show-operation="col.filterMultiple"
-                                                    :is-multiple="col.filterMultiple"
-                                                    @on-filter-method="filterEvent"
-                                                    @change="filterConditionChange(col.filterMultiple)"
-                                                >
-                                                    <i :class="['v-table-filter-icon',vTableFiltersIcon(col.filters)]"></i>
-                                                </v-dropdown>
-                                            </div>
-                                        </td>
-                                    </tr>
-                                </template>
-                            </tbody>
-                        </table>
-                    </div>
-                </div>
-
-                <!-- 左列-内容 -->
-                <div
-                    class="v-table-body v-table-body-class"
-                    :style="{'width': leftViewWidth+'px', 'height': bodyViewHeight+'px', 'margin-top': titleRowHeight+'px'}"
-                >
-                    <div :class="['v-table-body-inner',vTableBodyInner]">
-                        <v-checkbox-group
-                            v-model="checkboxGroupModel"
-                            @change="handleCheckGroupChange"
-                        >
-                            <table
-                                class="v-table-btable"
-                                border="1"
-                                cellspacing="0"
-                                cellpadding="0"
-                                bordercolor="#E5E5E5"
-                            >
-                                <tbody>
-                                    <tr
-                                        v-for="(item,rowIndex) in internalTableData"
-                                        class="v-table-row"
-                                        :key="rowIndex"
-                                        :style="[trBgColor(rowIndex+1)]"
-                                        @mouseenter.stop="handleMouseEnter(rowIndex)"
-                                        @mouseleave.stop="handleMouseOut(rowIndex)"
-                                    >
-                                        <td
-                                            v-if="cellMergeInit(rowIndex,col.field,item,true)"
-                                            v-for="(col,colIndex) in frozenCols"
-                                            :key="colIndex"
-                                            :colSpan="setColRowSpan(rowIndex,col.field,item).colSpan"
-                                            :rowSpan="setColRowSpan(rowIndex,col.field,item).rowSpan"
-                                            :class="[setColumnCellClassName(rowIndex,col.field,item)]"
-                                        >
-                                            <!--存在列合并-->
-                                            <div
-                                                v-if="isCellMergeRender(rowIndex,col.field,item)"
-                                                :class="['v-table-body-cell',showVerticalBorder ? 'vertical-border':'',showHorizontalBorder?'horizontal-border':'']"
-                                                :style="{'width':getRowWidthByColSpan(rowIndex,col.field,item)+'px','height': getRowHeightByRowSpan(rowIndex,col.field,item)+'px','line-height':getRowHeightByRowSpan(rowIndex,col.field,item)+'px','text-align':col.columnAlign}"
-                                                :title="col.overflowTitle ?  overflowTitle(item,rowIndex,col) :''"
-                                                @click="rowCellClick(rowIndex,item,col);cellEditClick($event,col.isEdit,item,col.field,rowIndex)"
-                                                @dblclick="rowCellDbClick(rowIndex,item,col)"
-                                            >
-                                                <span v-if="cellMergeContentType(rowIndex,col.field,item).isComponent">
-                                                    <component
-                                                        :render="col.render"
-                                                        :row="item"
-                                                        :rowData="item"
-                                                        :column="col"
-                                                        :field="col.field ? col.field : ''"
-                                                        :index="rowIndex"
-                                                        :is="cellMerge(rowIndex,item,col.field).componentName"
-                                                        @on-custom-comp="customCompFunc"
-                                                    ></component>
-                                                </span>
-                                                <span
-                                                    v-else
-                                                    v-html="cellMerge(rowIndex,item,col.field).content"
-                                                ></span>
-                                            </div>
-
-                                            <!--不存在列合并-->
-                                            <div
-                                                v-else
-                                                :class="['v-table-body-cell',showVerticalBorder ? 'vertical-border':'',showHorizontalBorder?'horizontal-border':'']"
-                                                :style="getCellStyle(col, item)"
-                                                :title="col.overflowTitle ?  overflowTitle(item,rowIndex,col) : ''"
-                                                @click="rowCellClick(rowIndex, item, col); cellEditClick($event, col.isEdit, item,col.field, rowIndex)"
-                                                @dblclick="rowCellDbClick(rowIndex, item, col)"
-                                            >
-                                                <span v-if="typeof col.componentName ==='string' && col.componentName.length > 0">
-                                                    <component
-                                                        :render="col.render"
-                                                        :row="item"
-                                                        :rowData="item"
-                                                        :column="col"
-                                                        :field="col.field ? col.field : ''"
-                                                        :index="rowIndex"
-                                                        :is="col.componentName"
-                                                        @on-custom-comp="customCompFunc"
-                                                    ></component>
-                                                </span>
-
-                                                <span
-                                                    v-else-if="typeof col.formatter==='function'"
-                                                    v-html="col.formatter(item,rowIndex,pagingIndex,col.field)"
-                                                ></span>
-
-                                                <span v-else-if="col.type === 'selection'">
-                                                    <v-checkbox
-                                                        @change="handleCheckChange(item)"
-                                                        :show-slot="false"
-                                                        :disabled="item._disabled"
-                                                        :label="rowIndex"
-                                                    ></v-checkbox>
-                                                </span>
-
-                                                <span v-else>
-                                                    {{item[col.field]}}
-                                                </span>
-                                            </div>
-                                        </td>
-                                    </tr>
-                                </tbody>
-                            </table>
-                        </v-checkbox-group>
-                    </div>
-                </div>
-
-                <!-- 左列-底 -->
-                <div
-                    v-if="frozenFooterCols.length > 0"
-                    :class="['v-table-footer','v-table-footer-class']"
-                    :style="{'width': leftViewWidth+'px','height':footerTotalHeight}"
-                >
-                    <table
-                        class="v-table-ftable"
-                        border="1"
-                        cellspacing="0"
-                        cellpadding="0"
-                        bordercolor="#E5E5E5"
-                    >
-                        <tr
-                            class="v-table-row"
-                            v-for="(item,rowIndex) in frozenFooterCols"
-                            :key="rowIndex"
-                        >
-                            <td
-                                v-for="(col,colIndex) in item"
-                                :key="colIndex"
-                                :class="setFooterCellClassName(true,rowIndex,colIndex,col.content)"
-                            >
-                                <div
-                                    :style="{'height':footerRowHeight+'px','line-height':footerRowHeight+'px','width':col.width+'px','text-align':col.align}"
-                                    :class="['v-table-body-cell',vTableBodyCell]"
-                                    v-html="col.content"
-                                ></div>
-                            </td>
-                        </tr>
-                    </table>
-                </div>
-            </div>
-        </template>
-
-        <!-- 中列-->
-        <div
-            class="v-table-centerview"
-            :style="{
-                'width': centerViewWidth + 'px',
-                'height': getTableCenterViewHeight,
-                'margin-left': leftViewWidth + 'px',
-                'margin-right': rightViewWidth + 'px'
-            }"
-        >
-            <!-- 中列 头-->
-            <div
-                :class="{
-                    'v-table-header':true,
-                    'v-table-title-class':true,
-                    'v-table-header-notFixed':!fixTitle
-                }"
-                :style="{'width': centerViewWidth+'px', 'color':titleFontColor}"
-            >
-                <div
-                    class="v-table-header-inner"
-                    style="display: block;"
-                >
-                    <table
-                        class="v-table-htable"
-                        :style="{ 'background-color':titleBgColor }"
-                        border="1"
-                        cellspacing="0"
-                        cellpadding="0"
-                        bordercolor="#E5E5E5"
-                    >
-                        <tbody>
-                            <template v-if="noFrozenTitleCols.length > 0">
-                                <tr
-                                    v-for="(row, nfridx) in noFrozenTitleCols"
-                                    :key="nfridx"
-                                >
-                                    <td
-                                        v-for="(col, cidx) in row"
-                                        :key="cidx"
-                                        :class="[col.titleCellClassName]"
-                                        :colspan="col.colspan"
-                                        :rowspan="col.rowspan"
-                                        @mousemove.stop="handleTitleMouseMove($event,col.fields)"
-                                        @mousedown.stop="handleTitleMouseDown($event)"
-                                        @mouseout.stop="handleTitleMouseOut()"
-                                        @click="titleCellClick(col.fields,col.title);"
-                                        @dblclick="titleCellDblClick(col.fields,col.title)"
-                                    >
-                                        <div
-                                            :class="['v-table-title-cell',showVerticalBorder?'vertical-border':'',showHorizontalBorder?'horizontal-border':'']"
-                                            :style="{'width':titleColumnWidth(col.fields)+'px','height':titleColumnHeight(col.rowspan)+'px','text-align':col.titleAlign}"
-                                        >
-                                            <span class="table-title dsh-ellipsis">
-                                                <span v-if="isSelectionCol(col.fields)">
-                                                    <v-checkbox
-                                                        @change="handleCheckAll"
-                                                        :indeterminate="indeterminate"
-                                                        v-model="isAllChecked"
-                                                        :show-slot="false"
-                                                        label="check-all"
-                                                    ></v-checkbox>
-                                                </span>
-                                                <span
-                                                    v-else
-                                                    v-html="col.title"
-                                                ></span>
-                                            </span>
-
-                                            <span
-                                                v-if="enableSort(col.orderBy)"
-                                                @click="sortControl(col.fields[0])"
-                                                class="v-table-sort-icon"
-                                            >
-                                                <slot name="sort">
-                                                    <i :class='["v-icon-up-dir",getCurrentSort(col.fields[0]) ==="asc" ? "checked":""]'></i>
-                                                    <i :class='["v-icon-down-dir",getCurrentSort(col.fields[0]) ==="desc" ? "checked":""]'></i>
-                                                </slot>
-                                            </span>
-                                            <!--filters-->
-                                            <v-dropdown
-                                                class="v-table-dropdown"
-                                                v-if="enableFilters(col.filters,col.fields)"
-                                                v-model="col.filters"
-                                                :show-operation="col.filterMultiple"
-                                                :is-multiple="col.filterMultiple"
-                                                @on-filter-method="filterEvent"
-                                                @change="filterConditionChange(col.filterMultiple)"
-                                            >
-                                                <i :class="['v-table-filter-icon',vTableFiltersIcon(col.filters)]"></i>
-                                            </v-dropdown>
-                                        </div>
-                                    </td>
-                                </tr>
-                            </template>
-
-                            <template v-else>
-                                <tr class="v-table-header-row">
-                                    <td
-                                        v-for="(col,colIndex) in noFrozenCols"
-                                        :key="colIndex"
-                                        :class="[col.titleCellClassName]"
-                                        @mousemove.stop="handleTitleMouseMove($event,col.field)"
-                                        @mousedown.stop="handleTitleMouseDown($event)"
-                                        @mouseout.stop="handleTitleMouseOut()"
-                                        @click="titleCellClick(col.field,col.title);"
-                                        @dblclick="titleCellDblClick(col.field,col.title)"
-                                    >
-                                        <div
-                                            :class="['v-table-title-cell',showVerticalBorder?'vertical-border':'',showHorizontalBorder?'horizontal-border':'']"
-                                            :style="{'width':col.width+'px','height':titleRowHeight+'px','text-align':col.titleAlign}"
-                                        >
-                                            <Ctooltip
-                                                transfer
-                                                :content="col.title"
-                                                style="display:inline-block;width:100%;"
-                                            >
-                                                <span
-                                                    class="table-title dsh-ellipsis"
-                                                    style="width:100%"
-                                                >
-                                                    <span v-if="col.type === 'selection'">
-                                                        <v-checkbox
-                                                            @change="handleCheckAll"
-                                                            :indeterminate="indeterminate"
-                                                            v-model="isAllChecked"
-                                                            :show-slot="false"
-                                                            label="check-all"
-                                                        ></v-checkbox>
-                                                    </span>
-                                                    <span
-                                                        v-else
-                                                        v-html="col.title"
-                                                    ></span>
-                                                    <!--filters-->
-                                                    <v-dropdown
-                                                        class="v-table-dropdown"
-                                                        v-if="enableFilters(col.filters)"
-                                                        v-model="col.filters"
-                                                        :show-operation="col.filterMultiple"
-                                                        :is-multiple="col.filterMultiple"
-                                                        @on-filter-method="filterEvent"
-                                                        @change="filterConditionChange(col.filterMultiple)"
-                                                    >
-                                                        <i :class="['v-table-filter-icon',vTableFiltersIcon(col.filters)]"></i>
-                                                    </v-dropdown>
-                                                </span>
-                                                <span
-                                                    @click="sortControl(col.field)"
-                                                    class="v-table-sort-icon"
-                                                    v-if="enableSort(col.orderBy)"
-                                                >
-                                                    <slot name="sort">
-                                                        <i :class='["v-icon-up-dir",getCurrentSort(col.field) ==="asc" ? "checked":""]'></i>
-                                                        <i :class='["v-icon-down-dir",getCurrentSort(col.field) ==="desc" ? "checked":""]'></i>
-                                                    </slot>
-                                                </span>
-                                            </Ctooltip>
-                                        </div>
-                                    </td>
-                                </tr>
-                            </template>
-                        </tbody>
-                    </table>
-                </div>
-            </div>
-
-            <!-- 中列 内容-->
-            <div
-                :class="['v-table-body v-table-body-class',vTableRightBody]"
-                :style="{
-                    'width': centerViewWidth + 'px',
-                    'max-height': getTableCenterViewBodyHeight,
-                    'margin-top': titleRowHeight + 'px'
-                }"
-            >
-                <v-checkbox-group
-                    v-model="checkboxGroupModel"
-                    @change="handleCheckGroupChange"
-                >
-                    <table
-                        class="v-table-btable"
-                        border="1"
-                        cellspacing="0"
-                        cellpadding="0"
-                        bordercolor="#E5E5E5"
-                    >
-                        <tbody>
-                            <tr
-                                :key="rowIndex"
-                                v-for="(item,rowIndex) in internalTableData"
-                                class="v-table-row"
-                                :style="[trBgColor(rowIndex+1)]"
-                                @mouseenter.stop="handleMouseEnter(rowIndex)"
-                                @mouseleave.stop="handleMouseOut(rowIndex)"
-                                @click="$emit('click-row', item, rowIndex)"
-                            >
-                                <td
-                                    v-if="cellMergeInit(rowIndex,col.field,item,false)"
-                                    v-for="(col,colIndex) in noFrozenCols"
-                                    :key="colIndex"
-                                    :colSpan="setColRowSpan(rowIndex,col.field,item).colSpan"
-                                    :rowSpan="setColRowSpan(rowIndex,col.field,item).rowSpan"
-                                    :class="[setColumnCellClassName(rowIndex,col.field,item)]"
-                                    @click="clickTd($event, col)"
-                                >
-                                    <!--存在列合并-->
-                                    <div
-                                        v-if="isCellMergeRender(rowIndex,col.field,item)"
-                                        :class="['v-table-body-cell',showVerticalBorder ? 'vertical-border':'',showHorizontalBorder?'horizontal-border':'']"
-                                        :style="{
-                                            'width': getRowWidthByColSpan(rowIndex, col.field, item)+'px',
-                                            'height': getRowHeightByRowSpan(rowIndex, col.field, item)+'px',
-                                            'line-height': getRowHeightByRowSpan(rowIndex, col.field, item)+'px',
-                                            'text-align': col.columnAlign
-                                        }"
-                                        :title="col.overflowTitle ?  overflowTitle(item,rowIndex,col) :''"
-                                        @click="rowCellClick(rowIndex,item,col);cellEditClick($event,col.isEdit,item,col.field,rowIndex)"
-                                        @dblclick="rowCellDbClick(rowIndex,item,col)"
-                                    >
-                                        <span v-if="cellMergeContentType(rowIndex,col.field,item).isComponent">
-                                            <component
-                                                :render="col.render"
-                                                :row="item"
-                                                :rowData="item"
-                                                :column="col"
-                                                :field="col.field ? col.field : ''"
-                                                :index="rowIndex"
-                                                :is="cellMerge(rowIndex,item,col.field).componentName"
-                                                @on-custom-comp="customCompFunc"
-                                            ></component>
-                                        </span>
-                                        <span
-                                            v-else
-                                            v-html="cellMerge(rowIndex,item,col.field).content"
-                                        >
-                                        </span>
-                                    </div>
-
-                                    <!--不存在列合并-->
-                                    <div
-                                        v-else
-                                        :class="['v-table-body-cell',showVerticalBorder ? 'vertical-border':'',showHorizontalBorder?'horizontal-border':'']"
-                                        :style="getCellStyle(col, item)"
-                                        :title="col.overflowTitle ?  overflowTitle(item,rowIndex,col) :''"
-                                        @click="rowCellClick(rowIndex,item,col);cellEditClick($event,col.isEdit,item,col.field,rowIndex)"
-                                        @dblclick="rowCellDbClick(rowIndex,item,col)"
-                                    >
-                                        <span v-if="typeof col.componentName ==='string' && col.componentName.length > 0">
-                                            <component
-                                                :render="col.render"
-                                                :row="item"
-                                                :rowData="item"
-                                                :column="col"
-                                                :field="col.field ? col.field : ''"
-                                                :index="rowIndex"
-                                                :is="col.componentName"
-                                                @on-custom-comp="customCompFunc"
-                                            ></component>
-                                        </span>
-                                        <span
-                                            v-else-if="typeof col.formatter==='function'"
-                                            v-html="col.formatter(item,rowIndex,pagingIndex,col.field)"
-                                        >
-                                        </span>
-                                        <span v-else-if="col.type === 'selection'">
-                                            <v-checkbox
-                                                :show-slot="false"
-                                                :disabled="item._disabled"
-                                                :label="rowIndex"
-                                                @change="handleCheckChange(item)"
-                                            ></v-checkbox>
-                                        </span>
-                                        <span v-else>
-                                            {{item[col.field]}}
-                                        </span>
-                                    </div>
-                                </td>
-                            </tr>
-                        </tbody>
-                    </table>
-                </v-checkbox-group>
-            </div>
-
-            <!-- 中列 footer-->
-            <div
-                v-if="noFrozenFooterCols.length > 0"
-                :class="['v-table-footer','v-table-footer-class',vTableFooter]"
-                :style="{'width': centerViewWidth+'px','height':footerTotalHeight}"
-            >
-                <table
-                    class="v-table-ftable"
-                    border="1"
-                    cellspacing="0"
-                    cellpadding="0"
-                    bordercolor="#E5E5E5"
-                >
-                    <tr
-                        class="v-table-row"
-                        v-for="(item,rowIndex) in noFrozenFooterCols"
-                        :key="rowIndex"
-                    >
-                        <td
-                            v-for="(col,colIndex) in item"
-                            :key="colIndex"
-                            :class="setFooterCellClassName(false,rowIndex,colIndex,col.content)"
-                        >
-                            <div
-                                :style="{'height':footerRowHeight+'px','line-height':footerRowHeight+'px','width':col.width+'px','text-align':col.align}"
-                                :class="['v-table-body-cell',vTableBodyCell]"
-                                v-html="col.content"
-                            ></div>
-                        </td>
-                    </tr>
-                </table>
-            </div>
-        </div>
-
-        <!--右列-->
-        <template v-if="frozenRightCols.length > 0">
-            <div
-                class="v-table-rightview"
-                :style="{'width':rightViewWidth+'px'}"
-            >
-                <!-- 右列-头 -->
-                <div
-                    :class="{
-                        'v-table-header':true,
-                        'v-table-title-class':true,
-                        'v-table-header-notFixed':!fixTitle
-                    }"
-                    :style="{'width': rightViewWidth+'px','background-color':titleBgColor,'color':titleFontColor}"
-                >
-                    <div
-                        class="v-table-header-inner"
-                        style="display: block;"
-                    >
-                        <table
-                            class="v-table-htable"
-                            border="1"
-                            cellspacing="0"
-                            cellpadding="0"
-                            bordercolor="#E5E5E5"
-                        >
-                            <tbody>
-
-                                <template v-if="frozenRightTitleCols.length > 0">
-                                    <tr
-                                        v-for="(row, ridx) in frozenRightTitleCols"
-                                        :key="ridx"
-                                    >
-                                        <td
-                                            v-for="(col, cidx) in row"
-                                            :key="cidx"
-                                            :class="[col.titleCellClassName]"
-                                            :colspan="col.colspan"
-                                            :rowspan="col.rowspan"
-                                            @mousemove.stop="handleTitleMouseMove($event,col.fields)"
-                                            @mousedown.stop="handleTitleMouseDown($event)"
-                                            @mouseout.stop="handleTitleMouseOut()"
-                                            @click="titleCellClick(col.fields,col.title);"
-                                            @dblclick="titleCellDblClick(col.fields,col.title)"
-                                        >
-                                            <div
-                                                :class="['v-table-title-cell',showVerticalBorder?'vertical-border':'',showHorizontalBorder?'horizontal-border':'']"
-                                                :style="{'width':titleColumnWidth(col.fields)+'px','height':titleColumnHeight(col.rowspan)+'px','text-align':col.titleAlign}"
-                                            >
-                                                <span class="table-title">
-                                                    <span v-if="isSelectionCol(col.fields)">
-                                                        <v-checkbox
-                                                            @change="handleCheckAll"
-                                                            :indeterminate="indeterminate"
-                                                            v-model="isAllChecked"
-                                                            :show-slot="false"
-                                                            label="check-all"
-                                                        ></v-checkbox>
-                                                    </span>
-                                                    <span
-                                                        v-else
-                                                        v-html="col.title"
-                                                    ></span>
-                                                    <span
-                                                        @click="sortControl(col.fields[0])"
-                                                        class="v-table-sort-icon"
-                                                        v-if="enableSort(col.orderBy)"
-                                                    >
-                                                        <slot name="sort">
-                                                            <i :class='["v-icon-up-dir",getCurrentSort(col.fields[0]) ==="asc" ? "checked":""]'></i>
-                                                            <i :class='["v-icon-down-dir",getCurrentSort(col.fields[0]) ==="desc" ? "checked":""]'></i>
-                                                        </slot>
-                                                    </span>
-                                                </span>
-                                                <!--filters-->
-                                                <v-dropdown
-                                                    class="v-table-dropdown"
-                                                    v-if="enableFilters(col.filters,col.fields)"
-                                                    v-model="col.filters"
-                                                    :show-operation="col.filterMultiple"
-                                                    :is-multiple="col.filterMultiple"
-                                                    @on-filter-method="filterEvent"
-                                                    @change="filterConditionChange(col.filterMultiple)"
-                                                >
-                                                    <i :class="['v-table-filter-icon',vTableFiltersIcon(col.filters)]"></i>
-                                                </v-dropdown>
-                                            </div>
-                                        </td>
-                                    </tr>
-                                </template>
-
-                                <template v-else>
-                                    <tr class="v-table-header-row">
-                                        <td
-                                            v-for="(col, fcidx) in frozenRightCols"
-                                            :key="fcidx"
-                                            :class="[col.titleCellClassName]"
-                                            @mousemove.stop="handleTitleMouseMove($event,col.field)"
-                                            @mousedown.stop="handleTitleMouseDown($event)"
-                                            @mouseout.stop="handleTitleMouseOut()"
-                                            @click="titleCellClick(col.field,col.title);"
-                                            @dblclick="titleCellDblClick(col.field,col.title)"
-                                        >
-                                            <div
-                                                :class="['v-table-title-cell',showVerticalBorder?'vertical-border':'',showHorizontalBorder?'horizontal-border':'']"
-                                                :style="{'width':col.width+'px','height':titleRowHeight+'px','text-align':col.titleAlign}"
-                                            >
-                                                <span class="table-title">
-                                                    <span v-if="col.type === 'selection'">
-                                                        <v-checkbox
-                                                            @change="handleCheckAll"
-                                                            :indeterminate="indeterminate"
-                                                            v-model="isAllChecked"
-                                                            :show-slot="false"
-                                                            label="check-all"
-                                                        ></v-checkbox>
-                                                    </span>
-                                                    <span
-                                                        v-else
-                                                        v-html="col.title"
-                                                    ></span>
-                                                    <span
-                                                        @click="sortControl(col.field)"
-                                                        class="v-table-sort-icon"
-                                                        v-if="enableSort(col.orderBy)"
-                                                    >
-                                                        <slot name="sort">
-                                                            <i :class='["v-icon-up-dir",getCurrentSort(col.field) ==="asc" ? "checked":""]'></i>
-                                                            <i :class='["v-icon-down-dir",getCurrentSort(col.field) ==="desc" ? "checked":""]'></i>
-                                                        </slot>
-                                                    </span>
-                                                </span>
-                                                <!--filters-->
-                                                <v-dropdown
-                                                    class="v-table-dropdown"
-                                                    v-if="enableFilters(col.filters)"
-                                                    v-model="col.filters"
-                                                    :show-operation="col.filterMultiple"
-                                                    :is-multiple="col.filterMultiple"
-                                                    @on-filter-method="filterEvent"
-                                                    @change="filterConditionChange(col.filterMultiple)"
-                                                >
-                                                    <i :class="['v-table-filter-icon',vTableFiltersIcon(col.filters)]"></i>
-                                                </v-dropdown>
-                                            </div>
-                                        </td>
-                                    </tr>
-                                </template>
-                            </tbody>
-                        </table>
-                    </div>
-                </div>
-
-                <!-- 右列-内容 -->
-                <div
-                    class="v-table-body v-table-body-class"
-                    :style="{'width': rightViewWidth+'px', 'height': bodyViewHeight+'px', 'margin-top': titleRowHeight+'px'}"
-                >
-                    <div :class="['v-table-body-inner',vTableBodyInner]">
-                        <v-checkbox-group
-                            v-model="checkboxGroupModel"
-                            @change="handleCheckGroupChange"
-                        >
-                            <table
-                                class="v-table-btable"
-                                border="1"
-                                cellspacing="0"
-                                cellpadding="0"
-                                bordercolor="#E5E5E5"
-                            >
-                                <tbody>
-                                    <tr
-                                        v-for="(item,rowIndex) in internalTableData"
-                                        class="v-table-row"
-                                        :key="rowIndex"
-                                        :style="[trBgColor(rowIndex+1)]"
-                                        @mouseenter.stop="handleMouseEnter(rowIndex)"
-                                        @mouseleave.stop="handleMouseOut(rowIndex)"
-                                    >
-                                        <td
-                                            v-if="cellMergeInit(rowIndex,col.field,item,true)"
-                                            v-for="(col,colIndex) in frozenRightCols"
-                                            :key="colIndex"
-                                            :colSpan="setColRowSpan(rowIndex,col.field,item).colSpan"
-                                            :rowSpan="setColRowSpan(rowIndex,col.field,item).rowSpan"
-                                            :class="[setColumnCellClassName(rowIndex,col.field,item)]"
-                                        >
-                                            <!--存在列合并-->
-                                            <div
-                                                v-if="isCellMergeRender(rowIndex,col.field,item)"
-                                                :class="['v-table-body-cell',showVerticalBorder ? 'vertical-border':'',showHorizontalBorder?'horizontal-border':'']"
-                                                :style="{'width':getRowWidthByColSpan(rowIndex,col.field,item)+'px','height': getRowHeightByRowSpan(rowIndex,col.field,item)+'px','line-height':getRowHeightByRowSpan(rowIndex,col.field,item)+'px','text-align':col.columnAlign}"
-                                                :title="col.overflowTitle ?  overflowTitle(item,rowIndex,col) :''"
-                                                @click="rowCellClick(rowIndex,item,col);cellEditClick($event,col.isEdit,item,col.field,rowIndex)"
-                                                @dblclick="rowCellDbClick(rowIndex,item,col)"
-                                            >
-                                                <span v-if="cellMergeContentType(rowIndex,col.field,item).isComponent">
-                                                    <component
-                                                        :render="col.render"
-                                                        :row="item"
-                                                        :rowData="item"
-                                                        :column="col"
-                                                        :field="col.field ? col.field : ''"
-                                                        :index="rowIndex"
-                                                        :is="cellMerge(rowIndex,item,col.field).componentName"
-                                                        @on-custom-comp="customCompFunc"
-                                                    ></component>
-                                                </span>
-                                                <span
-                                                    v-else
-                                                    v-html="cellMerge(rowIndex,item,col.field).content"
-                                                ></span>
-                                            </div>
-
-                                            <!--不存在列合并-->
-                                            <div
-                                                v-else
-                                                :class="['v-table-body-cell',showVerticalBorder ? 'vertical-border':'',showHorizontalBorder?'horizontal-border':'']"
-                                                :style="getCellStyle(col, item)"
-                                                :title="col.overflowTitle ?  overflowTitle(item,rowIndex,col) :''"
-                                                @click="rowCellClick(rowIndex,item,col);cellEditClick($event,col.isEdit,item,col.field,rowIndex)"
-                                                @dblclick="rowCellDbClick(rowIndex,item,col)"
-                                            >
-                                                <span v-if="typeof col.componentName ==='string' && col.componentName.length > 0">
-                                                    <component
-                                                        :render="col.render"
-                                                        :row="item"
-                                                        :rowData="item"
-                                                        :column="col"
-                                                        :field="col.field ? col.field : ''"
-                                                        :index="rowIndex"
-                                                        :is="col.componentName"
-                                                        @on-custom-comp="customCompFunc"
-                                                    ></component>
-                                                </span>
-                                                <span
-                                                    v-else-if="typeof col.formatter==='function'"
-                                                    v-html="col.formatter(item,rowIndex,pagingIndex,col.field)"
-                                                ></span>
-                                                <span v-else-if="col.type === 'selection'">
-                                                    <v-checkbox
-                                                        @change="handleCheckChange(item)"
-                                                        :show-slot="false"
-                                                        :disabled="item._disabled"
-                                                        :label="rowIndex"
-                                                    ></v-checkbox>
-                                                </span>
-                                                <span v-else>
-                                                    {{item[col.field]}}
-                                                </span>
-                                            </div>
-                                        </td>
-                                    </tr>
-                                </tbody>
-                            </table>
-                        </v-checkbox-group>
-                    </div>
-                </div>
-
-                <!-- 右列-底 -->
-                <div
-                    v-if="frozenRightFooterCols.length > 0"
-                    :class="['v-table-footer','v-table-footer-class']"
-                    :style="{'width': leftViewWidth+'px','height':footerTotalHeight}"
-                >
-                    <table
-                        class="v-table-ftable"
-                        border="1"
-                        cellspacing="0"
-                        cellpadding="0"
-                        bordercolor="#E5E5E5"
-                    >
-                        <tr
-                            class="v-table-row"
-                            v-for="(item,rowIndex) in frozenFooterCols"
-                            :key="rowIndex"
-                        >
-                            <td
-                                v-for="(col,colIndex) in item"
-                                :key="colIndex"
-                                :class="setFooterCellClassName(true,rowIndex,colIndex,col.content)"
-                            >
-                                <div
-                                    v-html="col.content"
-                                    :class="['v-table-body-cell',vTableBodyCell]"
-                                    :style="{'height':footerRowHeight+'px','line-height':footerRowHeight+'px','width':col.width+'px','text-align':col.align}"
-                                ></div>
-                            </td>
-                        </tr>
-                    </table>
-                </div>
-            </div>
-        </template>
-
-        <table-empty
-            v-if="!isLoading && isTableEmpty"
-            :width="internalWidth"
-            :total-columns-width="totalColumnsWidth"
-            :content-height="errorContentHeight"
-            :title-height="getTotalColumnsHeight()"
-            :error-content="tipContent"
-            :is-loading="isLoading"
-        ></table-empty>
-
-        <loading
-            v-if="isLoading"
-            :loading-content="loadingContent"
-            :title-rows="internalTitleRows"
-            :title-row-height="titleRowHeight"
-            :columns="internalColumns"
-            :loading-opacity="loadingOpacity"
-        ></loading>
-
-        <!--列拖动时的线条-->
-        <div
-            v-show="isDragging"
-            class="v-table-drag-line"
-        ></div>
-    </div>
-</template>
-
-<script>
-
-    import classesMixin from "./classes-mixin.js";
-    import scrollControlMixin from "./scroll-control-mixin.js";
-    import frozenColumnsMixin from "./frozen-columns-mixin.js";
-    import tableResizeMixin from "./table-resize-mixin.js";
-    import sortControlMixin from "./sort-control-mixin.js";
-    import tableEmptyMixin from "./table-empty-mixin.js";
-    import dragWidthMixin from "./drag-width-mixin.js";
-    import cellEditMixin from "./cell-edit-mixin.js";
-    import bodyCellMergeMixin from "./body-cell-merge-mixin.js";
-    import titleCellMergeMixin from "./title-cell-merge-mixin.js";
-    import checkboxSelectionMixin from "./checkbox-selection-mixin.js";
-    import tableFooterMixin from "./table-footer-mixin.js";
-    import scrollBarControlMixin from "./scroll-bar-control-mixin.js";
-    import tableRowMouseEventsMixin from "./table-row-mouse-events-mixin";
-    import tableFiltersMixin from "./table-filters-mixin";
-
-    import utils from "../../src/utils/utils.js";
-    import deepClone from "../../src/utils/deepClone.js";
-
-    import tableEmpty from "./table-empty.vue";
-    import loading from "./loading.vue";
-    import VCheckboxGroup from "../../v-checkbox-group/index.js";
-    import VCheckbox from "../../v-checkbox/index.js";
-    import VDropdown from "../../v-dropdown/index.js";
-
-    export default {
-        name: "v-table",
-        mixins: [classesMixin, tableResizeMixin, frozenColumnsMixin, scrollControlMixin, sortControlMixin, tableEmptyMixin, dragWidthMixin, cellEditMixin, bodyCellMergeMixin, titleCellMergeMixin, checkboxSelectionMixin, tableFooterMixin, scrollBarControlMixin, tableRowMouseEventsMixin, tableFiltersMixin],
-        components: {tableEmpty, loading, VCheckboxGroup, VCheckbox, VDropdown},
-        data () {
-            return {
-                // 本地列表数据
-                internalTableData: [],
-                // 本地宽度
-                internalWidth: 0,
-                // 本地高度
-                internalHeight: 0,
-                // 本地列数据
-                internalColumns: [],
-                // 本地复杂表头数据
-                internalTitleRows: [],
-                errorMsg: " V-Table error: ",
-                // 最大宽度（当width:'max'时）
-                maxWidth: 5000,
-                hasFrozenColumn: false, // 是否拥有固定列（false时最后一列的右边border无边框）
-                hasFrozenRightColumn: false,
-                resizeTimer: null,
-                firstLoad: true, // 表格首次初始化加载，用于区分显示”数据加载中“还是”暂无内容“
-                tipContent: ""
-            };
-        },
-        props: {
-            // 表格自定义class
-            className: {
-                type: String,
-                default: ""
-            },
-
-            width: [Number, String],
-            minWidth: {
-                type: Number,
-                default: 50
-            },
-            height: {
-                type: Number,
-                require: false
-            },
-            minHeight: {
-                type: Number,
-                default: 50
-            },
-            titleRowHeight: {
-                type: Number,
-                default: 38
-            },
-            // 随着浏览器窗口改变，横向自适应
-            isHorizontalResize: {
-                type: Boolean,
-                default: false
-            },
-            // 随着浏览器窗口改变，垂直自适应
-            isVerticalResize: {
-                type: Boolean,
-                default: false
-            },
-
-            // 垂直自适应偏移量
-            verticalResizeOffset: {
-                type: Number,
-                default: 0
-            },
-
-            tableBgColor: {
-                type: String,
-                default: "#fff"
-            },
-
-            // 表头背景颜色
-            titleBgColor: {
-                type: String,
-                default: "#F0F0F0"
-            },
-
-            // 表头字体颜色
-            titleFontColor: {
-                type: String,
-                default: "#5d5d5d"
-            },
-
-            // 奇数行颜色
-            oddBgColor: {
-                type: String,
-                default: ""
-            },
-            // 偶数行颜色
-            evenBgColor: {
-                type: String,
-                default: ""
-            },
-            // 内容行高
-            rowHeight: {
-                type: Number,
-                default: 40
-            },
-            // 多列排序
-            multipleSort: {
-                type: Boolean,
-                default: true
-            },
-            // 是否展示排序
-            showSort: {
-                type: Boolean,
-                default: false
-            },
-            // 只在 升序和倒序切换
-            sortAlways: {
-                type: Boolean,
-                default: false
-            },
-            columns: {
-                type: Array,
-                require: true
-            },
-            fixTitle: {
-                type: Boolean,
-                default: true
-            },
-
-            // 特殊表头
-            titleRows: {
-                type: Array,
-                require: true,
-                default: function () {
-                    return [];
-                }
-            },
-            tableData: {
-                type: Array,
-                require: true,
-                default: function () {
-                    return [];
-                }
-            },
-            // 分页序号
-            pagingIndex: Number,
-            // 没数据时的html
-            errorContent: {
-                type: String,
-                default: "暂无内容..."
-            },
-            // 没数据时内容区域高度
-            errorContentHeight: {
-                type: Number,
-                default: 50
-            },
-            // 是否正在加载,为false 则会显示错误信息（如果加载时间较长，最好设置为true,数据返回后设置为false）
-            isLoading: {
-                type: Boolean,
-                default: false
-            },
-            loadingContent: {
-                type: String,
-                default: '<span><i class="v-icon-spin5 animate-loading-23" style="font-size: 28px;opacity:0.6;"></i></span>'
-            },
-            // 不设置则没有hover效果
-            rowHoverColor: {
-                type: String
-            },
-            rowClickColor: {
-                type: String
-            },
-            showVerticalBorder: {
-                type: Boolean,
-                default: true
-            },
-            showHorizontalBorder: {
-                type: Boolean,
-                default: true
-            },
-            footer: {
-                type: Array,
-                default: function () {
-                    return [
-                        // ["本页总计", "--", "--", 1000, 2000, "--"],
-                        // ["总计", "--", "--", 434784953450, 8858459488458, "--"]
-                    ];
-                }
-            },
-            footerRowHeight: {
-                type: Number,
-                default: 40
-            },
-            columnWidthDrag: {
-                type: Boolean,
-                default: false
-            },
-            loadingOpacity: {
-                type: Number,
-                default: 0.6
-            },
-            // 表体单元格样式回调
-            columnCellClassName: Function,
-            // footer单元格样式回调
-            footerCellClassName: Function,
-            // 行单击回调
-            rowClick: Function,
-            // 行双击回调
-            rowDblclick: Function,
-            // 表头单元格单击回调
-            titleClick: Function,
-            // 表头单元格双击回调
-            titleDblclick: Function,
-            // 鼠标进入行的回调
-            rowMouseEnter: Function,
-            // 鼠标离开行的回调
-            rowMouseLeave: Function,
-            // 单元格编辑完成回调
-            cellEditDone: Function,
-            // 单元格合并
-            cellMerge: Function,
-            // select all
-            selectAll: Function,
-            // 单个checkbox change event
-            selectChange: Function,
-            // checkbox-group change event
-            selectGroupChange: Function,
-            // filter event
-            filterMethod: Function,
-            //
-            columnWidthDragResize: Function
-        },
-        computed: {
-            // 是否是复杂表头
-            isComplexTitle () {
-                return (Array.isArray(this.internalTitleRows) && this.internalTitleRows.length > 0);
-            },
-            // 获取表格高度
-            getTableHeight () {
-                // return `${this.isTableEmpty ? this.tableEmptyHeight : this.internalHeight}px`;
-                return "100%";
-            },
-            getTableCenterViewHeight () {
-                // return undefined;
-                return "100%";
-            },
-            getTableCenterViewBodyHeight () {
-                // return `${this.bodyViewHeight}px`;
-                return "calc(100% - 52px)";
-            },
-
-            // 左侧区域宽度
-            leftViewWidth () {
-                let result = 0;
-                if (this.hasFrozenColumn) {
-                    result = this.frozenCols.reduce((total, curr) => total + curr.width, 0);
-                }
-                return result;
-            },
-            // 左侧区域宽度
-            rightViewWidth () {
-                let result = 0;
-                if (this.hasFrozenRightColumn) {
-                    result = this.frozenRightCols.reduce((total, curr) => total + curr.width, 0);
-                }
-                return result;
-            },
-            // 中侧区域宽度
-            centerViewWidth () {
-                // let width = 5000;
-                // if (this.$refs.table) {
-                //     width = this.$refs.table.clientWidth;
-                // }
-                // let result = width - this.leftViewWidth - this.rightViewWidth;
-                let result = this.internalWidth - this.leftViewWidth - this.rightViewWidth;
-                return this.hasFrozenColumn ? result : result;
-            },
-
-            // 左侧、右侧区域高度
-            bodyViewHeight () {
-                let result;
-                if (this.internalTitleRows.length > 0) {
-                    result = this.internalHeight - this.titleRowHeight * (this.internalTitleRows.length + this.getTitleRowspanTotalCount);
-                } else {
-                    result = this.internalHeight - this.titleRowHeight;
-                }
-
-                // 1px: 当有滚动条时，使滚动条显示全
-                result -= (this.footerTotalHeight + 1);
-
-                return result;
-            },
-
-            // 所有列的总宽度
-            totalColumnsWidth () {
-                return this.internalColumns.reduce(function (total, curr) {
-                    return curr.width ? (total + curr.width + 1) : total;
-                }, 7); // 7代表1px边线+6px滚动条
-            },
-
-            // 获取未固定列的总宽度
-            totalNoFrozenColumnsWidth () {
-
-                return this.noFrozenCols.reduce(function (total, curr) {
-                    return curr.width ? (total + curr.width) : total;
-                }, 0);
-            },
-
-            // 获取所有的字段
-            getColumnsFields () {
-                return this.internalColumns.map((item) => {
-                    return item.field;
-                });
-            },
-
-            // 获取非固定列的字段集合
-            getNoFrozenColumnsFields () {
-                return this.internalColumns.filter(x => !x.isFrozen && !x.isFrozenRight).map((item) => {
-                    return item.field;
-                });
-            },
-
-            // 获取固定左列的字段集合
-            getFrozenColumnsFields () {
-                return this.internalColumns.filter(x => x.isFrozen).map((item) => {
-                    return item.field;
-                });
-            },
-            // 获取固定右列的字段集合
-            getFrozenRightColumnsFields () {
-                return this.internalColumns.filter(x => x.isFrozenRight).map((item) => {
-                    return item.field;
-                });
-            }
-        },
-        created () {
-            this.internalTableData = this.initInternalTableData(this.tableData);
-            this.tipContent = this.errorContent;
-
-            if (Array.isArray(this.columns) && this.columns.length > 0) {
-                this.initColumns();
-            }
-
-            this.updateCheckboxGroupModel();
-            this.initView();
-        },
-        mounted () {
-            this.setScrollbarWidth();
-            this.tableEmpty();
-            this.tableResize();
-
-            if (Array.isArray(this.tableData) && this.tableData.length > 0) {
-
-                this.scrollControl();
-            }
-
-            this.controlScrollBar();
-        },
-        methods: {
-            // 当宽度设置 && 非固定列未设置宽度时（列自适应）初始化列集合
-            initColumns () {
-                this.internalHeight = this.height;
-
-                this.footerTotalHeight = this.getFooterTotalRowHeight;
-
-                this.internalColumns = Array.isArray(this.columns) ? deepClone(this.columns) : [];
-
-                this.internalTitleRows = Array.isArray(this.titleRows) ? deepClone(this.titleRows) : [];
-
-                this.initColumnsFilters();
-
-                this.initResizeColumns();
-
-                this.hasFrozenColumn = this.internalColumns.some(x => x.isFrozen);
-                this.hasFrozenRightColumn = this.internalColumns.some(x => x.isFrozenRight);
-
-                this.initTableWidth();
-                this.setSortColumns();
-
-                let self = this;
-                let widthCountCheck = 0;
-
-                if (self.internalWidth && self.internalWidth > 0) {
-                    self.internalColumns.map(function (item) {
-                        if (!(item.width && item.width > 0)) {
-
-                            widthCountCheck++;
-                            if (self.isHorizontalResize) {
-                                console.error(self.errorMsg + "If you are using the isHorizontalResize property,Please set the value for each column's width");
-                            } else {
-                                item.width = self.internalWidth - self.totalColumnsWidth;
-                            }
-
-                        }
-                    });
-                }
-
-                if (widthCountCheck > 1) {
-                    console.error(this.errorMsg + "Only allow one column is not set width");
-                }
-            },
-
-            // 初始化width
-            initTableWidth () {
-                this.internalWidth = this.isHorizontalResize ? this.maxWidth : this.width;
-            },
-            getCellStyle (col, item) {
-                return {
-                    "width": col.width + "px",
-                    // "height": `${this.rowHeight}px`,
-                    // "line-height": `${this.rowHeight}px`,
-                    "height": undefined,
-                    "padding": "10px 15px",
-                    "line-height": undefined,
-                    "text-align": col.columnAlign
-                };
-            },
-            // // 获取所有列的总高度
-            // getTotalColumnsHeight () {
-            //     return this.titleRowHeight * (this.internalTitleRows ? this.internalTitleRows.length : 1) +
-            //         this.internalTableData.length * (this.rowHeight + 1) +
-            //         this.footerTotalHeight + 1;
-            // },
-            // 获取所有列的总高度
-            getTotalColumnsHeight () {
-                let titleTotalHeight = (this.internalTitleRows && this.internalTitleRows.length > 0) ? this.titleRowHeight * this.internalTitleRows.length : this.titleRowHeight;
-
-                titleTotalHeight += this.footerTotalHeight;
-
-                return titleTotalHeight + this.internalTableData.length * this.rowHeight + 1;
-            },
-            clickTd (e, col) {
-                if (["selection", "expane", "expend"].includes(col.type) || ["操作"].includes(col._name) || ["操作"].includes(col.title)) {
-                    e.stopPropagation();
-                }
-            },
-
-            // custom columns component event
-            customCompFunc (params) {
-                this.$emit("on-custom-comp", params);
-            },
-            // 行颜色
-            trBgColor (num) {
-                return {
-                    "background-color": num % 2 === 0 ? this.oddBgColor : this.evenBgColor
-                };
-            },
-            // 设置 column 列的样式
-            setColumnCellClassName (rowIndex, field, rowData) {
-                return this.columnCellClassName && this.columnCellClassName(rowIndex, field, rowData);
-            },
-
-            // 获取每个表头列的宽度
-            titleColumnWidth (fields) {
-                let result = 0;
-                if (Array.isArray(fields)) {
-                    let matchItems = this.internalColumns.filter((item, index) => {
-                        return fields.some(x => x === item.field);
-                    });
-
-                    result = matchItems.reduce((total, curr) => total + curr.width, 0);
-                } else {
-                    console.error(this.errorMsg + "the fields attribute must be a array in titleRows");
-                }
-                return result;
-            },
-            // 获取每个表头列的高度
-            titleColumnHeight (rowspan) {
-                if (rowspan && rowspan > 0) {
-                    return this.titleRowHeight * rowspan;
-                } else {
-                    return this.titleRowHeight;
-                }
-            },
-            // 超出的title提示
-            overflowTitle (row, rowIndex, col) {
-                let result = "";
-                if (typeof col.formatter === "function") {
-                    let val = col.formatter(row, rowIndex, this.pagingIndex, col.field);
-                    // 如果是html 不处理
-                    if (utils.isHtml(val)) {
-                        result = "";
-                    } else {
-                        result = val;
-                    }
-                } else {
-                    result = row[col.field];
-                }
-                return result;
-            },
-
-            // 当没设置宽度和高度时动态计算
-            initView () {
-                // 当没有设置宽度计算总宽度
-                if (!(this.internalWidth && this.internalWidth > 0)) {
-
-                    if (this.columns && this.columns.length > 0) {
-                        this.internalWidth = this.columns.reduce((total, curr) => total + curr.width, 0);
-
-                    }
-                }
-
-                let totalColumnsHeight = this.getTotalColumnsHeight();
-
-                // 当没有设置高度时计算总高度 || 设置的高度大于所有列高度之和时
-                if (!(this.height && this.height > 0) || this.height > totalColumnsHeight) {
-
-                    if (!this.isVerticalResize) {
-
-                        this.internalHeight = totalColumnsHeight;
-                    }
-
-                } else if (this.height <= totalColumnsHeight) {
-
-                    this.internalHeight = this.height;
-                }
-            },
-
-            initInternalTableData () {
-                return Array.isArray(this.tableData) ? deepClone(this.tableData) : [];
-            },
-            updateErrorContent () {
-                if (!this.firstLoad) {
-                    if (!(this.internalTableData && this.internalTableData.length)) {
-                        this.tipContent = "暂无内容";
-                    }
-                }
-                this.firstLoad = false;
-            },
-            // 对外暴露（隐藏显示切换时）
-            resize () {
-                // fixed bug in IE9 #17
-                this.resizeTimer = setTimeout(x => {
-
-                    this.tableResize();
-                });
-            }
-        },
-        watch: {
-
-            // 重新跟新列信息
-            "columns": {
-                handler: function (newVal) {
-
-                    this.initColumns();
-                    // fix issue #261
-                    this.tableResize();
-                },
-                deep: true
-            },
-            // 重新覆盖复杂表头信息
-            "titleRows": {
-                handler: function (newVal) {
-
-                    this.initColumns();
-                },
-                deep: true
-            },
-
-            // deep watch
-            "tableData": {
-
-                handler: function (newVal) {
-
-                    this.skipRenderCells = [];
-
-                    this.internalTableData = this.initInternalTableData(newVal);
-
-                    this.updateCheckboxGroupModel();
-
-                    this.tableEmpty();
-
-                    if (Array.isArray(newVal) && newVal.length > 0) {
-
-                        this.initView();
-
-                        this.scrollControl();
-                    }
-
-                    this.resize();
-                },
-                deep: true
-            },
-            "pagingIndex": {
-
-                handler: function () {
-
-                    this.clearCurrentRow();
-
-                    this.bodyScrollTop();
-                }
-            }
-        },
-        beforeDestroy () {
-
-            clearTimeout(this.resizeTimer);
-        }
-    };
-</script>