feat:所有列表添加调整列宽功能
This commit is contained in:
@@ -819,6 +819,7 @@ li{
|
|||||||
.nz-table .el-table {
|
.nz-table .el-table {
|
||||||
border: none;
|
border: none;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
|
display: table-cell!important;
|
||||||
}
|
}
|
||||||
.nz-table::before {
|
.nz-table::before {
|
||||||
height: 0;
|
height: 0;
|
||||||
|
|||||||
@@ -93,7 +93,7 @@
|
|||||||
v-scrollBar:el-table="'small'"
|
v-scrollBar:el-table="'small'"
|
||||||
>
|
>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
:resizable="false"
|
:resizable="true"
|
||||||
v-for="(_item, _index) in setLabels(value)"
|
v-for="(_item, _index) in setLabels(value)"
|
||||||
v-if="_item.show"
|
v-if="_item.show"
|
||||||
:key="`col-${_index}`"
|
:key="`col-${_index}`"
|
||||||
|
|||||||
@@ -39,11 +39,9 @@
|
|||||||
>
|
>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
:resizable="false"
|
:resizable="true"
|
||||||
v-for="(item, index) in tools.customTableTitle"
|
v-for="(item, index) in tools.customTableTitle"
|
||||||
v-if="item.show"
|
v-if="item.show"
|
||||||
:width="item.width"
|
|
||||||
:minWidth="item.minWidth"
|
|
||||||
:key="`col-${index}`"
|
:key="`col-${index}`"
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
:show-overflow-tooltip="item.prop != 'labels' && item.prop != 'alertRule'"
|
:show-overflow-tooltip="item.prop != 'labels' && item.prop != 'alertRule'"
|
||||||
@@ -156,7 +154,7 @@
|
|||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
|
||||||
<el-table-column width="28" :resizable="false">
|
<el-table-column width="28" :resizable="true">
|
||||||
<template slot="header" slot-scope="scope">
|
<template slot="header" slot-scope="scope">
|
||||||
<span @mousedown.stop="!tools.showCustomTableTitle && (tools.showCustomTableTitle = true)" class="nz-table-gear">
|
<span @mousedown.stop="!tools.showCustomTableTitle && (tools.showCustomTableTitle = true)" class="nz-table-gear">
|
||||||
<i class="nz-icon nz-icon-gear"></i>
|
<i class="nz-icon nz-icon-gear"></i>
|
||||||
|
|||||||
@@ -35,10 +35,9 @@
|
|||||||
align="center">
|
align="center">
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
:resizable="false"
|
:resizable="true"
|
||||||
v-for="(item, index) in tableTitle"
|
v-for="(item, index) in tableTitle"
|
||||||
v-if="item.show"
|
v-if="item.show"
|
||||||
:width="item.width"
|
|
||||||
:key="`col-${index}`"
|
:key="`col-${index}`"
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -59,13 +59,11 @@
|
|||||||
align="center">
|
align="center">
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
:resizable="false"
|
:resizable="true"
|
||||||
v-for="(item, index) in tools.customTableTitle"
|
v-for="(item, index) in tools.customTableTitle"
|
||||||
v-if="item.show"
|
v-if="item.show"
|
||||||
:width="item.width"
|
|
||||||
:key="`col-${index}`"
|
:key="`col-${index}`"
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
:min-width="(item.minWidth?item.minWidth+'px':'110px')"
|
|
||||||
:sortable="$tableSet.sortableShow(item.prop,'endpointTab')"
|
:sortable="$tableSet.sortableShow(item.prop,'endpointTab')"
|
||||||
:prop="$tableSet.propTitle(item.prop,'endpointTab')"
|
:prop="$tableSet.propTitle(item.prop,'endpointTab')"
|
||||||
:sort-orders="['ascending', 'descending']"
|
:sort-orders="['ascending', 'descending']"
|
||||||
|
|||||||
@@ -55,7 +55,7 @@
|
|||||||
<!-->-->
|
<!-->-->
|
||||||
<!--</el-table-column>-->
|
<!--</el-table-column>-->
|
||||||
<el-table-column
|
<el-table-column
|
||||||
:resizable="false"
|
:resizable="true"
|
||||||
v-for="(item, index) in tableTitle"
|
v-for="(item, index) in tableTitle"
|
||||||
v-if="item.show"
|
v-if="item.show"
|
||||||
:width="item.width"
|
:width="item.width"
|
||||||
|
|||||||
@@ -45,7 +45,7 @@
|
|||||||
@sort-change="tableDataSort"
|
@sort-change="tableDataSort"
|
||||||
>
|
>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
:resizable="false"
|
:resizable="true"
|
||||||
v-for="(item, index) in tableTitle"
|
v-for="(item, index) in tableTitle"
|
||||||
v-if="item.show"
|
v-if="item.show"
|
||||||
:width="item.width"
|
:width="item.width"
|
||||||
|
|||||||
@@ -85,14 +85,12 @@
|
|||||||
align="center">
|
align="center">
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
:resizable="false"
|
:resizable="true"
|
||||||
v-for="(item, index) in tools.customTableTitle"
|
v-for="(item, index) in tools.customTableTitle"
|
||||||
v-if="item.show"
|
v-if="item.show"
|
||||||
:width="item.width"
|
|
||||||
:key="`col-${index}`"
|
:key="`col-${index}`"
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
show-overflow-tooltip
|
show-overflow-tooltip
|
||||||
min-width="110px"
|
|
||||||
:sort-orders="['ascending', 'descending']"
|
:sort-orders="['ascending', 'descending']"
|
||||||
:sortable="$tableSet.sortableShow(item.prop,'alertRules')"
|
:sortable="$tableSet.sortableShow(item.prop,'alertRules')"
|
||||||
:prop="$tableSet.propTitle(item.prop,'alertRules')"
|
:prop="$tableSet.propTitle(item.prop,'alertRules')"
|
||||||
|
|||||||
@@ -54,15 +54,13 @@
|
|||||||
align="center">
|
align="center">
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
:resizable="false"
|
:resizable="true"
|
||||||
v-for="(item, index) in tools.customTableTitle"
|
v-for="(item, index) in tools.customTableTitle"
|
||||||
v-if="item.show"
|
v-if="item.show"
|
||||||
:width="item.width"
|
|
||||||
:key="`col_${index}`"
|
:key="`col_${index}`"
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
:fixed="item.fixed"
|
:fixed="item.fixed"
|
||||||
:show-overflow-tooltip="item.prop != 'Alert' || item.prop != 'Module'"
|
:show-overflow-tooltip="item.prop != 'Alert' || item.prop != 'Module'"
|
||||||
min-width="110px"
|
|
||||||
:class-name="item.prop == 'option' ? 'content-right-options' : ''"
|
:class-name="item.prop == 'option' ? 'content-right-options' : ''"
|
||||||
:sortable="$tableSet.sortableShow(item.prop,'asset')"
|
:sortable="$tableSet.sortableShow(item.prop,'asset')"
|
||||||
:prop="$tableSet.propTitle(item.prop,'asset')"
|
:prop="$tableSet.propTitle(item.prop,'asset')"
|
||||||
|
|||||||
@@ -53,10 +53,9 @@
|
|||||||
align="center">
|
align="center">
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
:resizable="false"
|
:resizable="true"
|
||||||
v-for="(item, index) in tools.customTableTitle"
|
v-for="(item, index) in tools.customTableTitle"
|
||||||
v-if="item.show"
|
v-if="item.show"
|
||||||
:width="item.width"
|
|
||||||
:key="`col-${index}`"
|
:key="`col-${index}`"
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
:prop="item.prop"
|
:prop="item.prop"
|
||||||
|
|||||||
@@ -53,11 +53,10 @@
|
|||||||
align="center">
|
align="center">
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
:resizable="false"
|
:resizable="true"
|
||||||
show-overflow-tooltip
|
show-overflow-tooltip
|
||||||
v-for="(item, index) in tools.customTableTitle"
|
v-for="(item, index) in tools.customTableTitle"
|
||||||
v-if="item.show"
|
v-if="item.show"
|
||||||
:width="item.width"
|
|
||||||
:key="`col-${index}`"
|
:key="`col-${index}`"
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
:sortable="$tableSet.sortableShow(item.prop,'dc')"
|
:sortable="$tableSet.sortableShow(item.prop,'dc')"
|
||||||
|
|||||||
@@ -45,7 +45,7 @@
|
|||||||
width="40"
|
width="40"
|
||||||
align="center">
|
align="center">
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column :resizable="false" v-for="(item, index) in tools.customTableTitle" v-if="item.show" :width="item.width" :class-name="item.prop == 'modelsDetail'?'detail-column':''"
|
<el-table-column :resizable="true" v-for="(item, index) in tools.customTableTitle" v-if="item.show" :class-name="item.prop == 'modelsDetail'?'detail-column':''"
|
||||||
:key="`col-${index}`" :label="item.label" :sortable="$tableSet.sortableShow(item.prop,'mib')"
|
:key="`col-${index}`" :label="item.label" :sortable="$tableSet.sortableShow(item.prop,'mib')"
|
||||||
:prop="$tableSet.propTitle(item.prop,'mib')"
|
:prop="$tableSet.propTitle(item.prop,'mib')"
|
||||||
:sort-orders="['ascending', 'descending']">
|
:sort-orders="['ascending', 'descending']">
|
||||||
|
|||||||
@@ -49,10 +49,9 @@
|
|||||||
width="40"
|
width="40"
|
||||||
align="center">
|
align="center">
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column :resizable="false"
|
<el-table-column :resizable="true"
|
||||||
v-for="(item, index) in tools.customTableTitle"
|
v-for="(item, index) in tools.customTableTitle"
|
||||||
v-if="item.show"
|
v-if="item.show"
|
||||||
:width="item.width"
|
|
||||||
:key="`col-${index}`"
|
:key="`col-${index}`"
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
:sortable="$tableSet.sortableShow(item.prop,'model')"
|
:sortable="$tableSet.sortableShow(item.prop,'model')"
|
||||||
|
|||||||
@@ -36,10 +36,9 @@
|
|||||||
@sort-change="tableDataSort"
|
@sort-change="tableDataSort"
|
||||||
>
|
>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
:resizable="false"
|
:resizable="true"
|
||||||
v-for="(item, index) in tools.customTableTitle"
|
v-for="(item, index) in tools.customTableTitle"
|
||||||
v-if="item.show"
|
v-if="item.show"
|
||||||
:width="item.width"
|
|
||||||
:key="`col-${index}`"
|
:key="`col-${index}`"
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
:sortable="$tableSet.sortableShow(item.prop,'operationlog')"
|
:sortable="$tableSet.sortableShow(item.prop,'operationlog')"
|
||||||
|
|||||||
@@ -41,9 +41,8 @@
|
|||||||
width="40"
|
width="40"
|
||||||
align="center">
|
align="center">
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column :resizable="false" v-for="(item, index) in tools.customTableTitle"
|
<el-table-column :resizable="true" v-for="(item, index) in tools.customTableTitle"
|
||||||
v-if="item.show"
|
v-if="item.show"
|
||||||
:width="item.width"
|
|
||||||
:key="`col-${index}`"
|
:key="`col-${index}`"
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
:sortable="$tableSet.sortableShow(item.prop,'promServer')"
|
:sortable="$tableSet.sortableShow(item.prop,'promServer')"
|
||||||
|
|||||||
@@ -35,10 +35,9 @@
|
|||||||
style="width: 100%;"
|
style="width: 100%;"
|
||||||
@sort-change="tableDataSort">
|
@sort-change="tableDataSort">
|
||||||
<el-table-column
|
<el-table-column
|
||||||
:resizable="false"
|
:resizable="true"
|
||||||
v-for="(item, index) in tools.customTableTitle"
|
v-for="(item, index) in tools.customTableTitle"
|
||||||
v-if="item.show"
|
v-if="item.show"
|
||||||
:width="item.width"
|
|
||||||
:key="`col-${index}`"
|
:key="`col-${index}`"
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
:sortable="$tableSet.sortableShow(item.prop,'temrminallog')"
|
:sortable="$tableSet.sortableShow(item.prop,'temrminallog')"
|
||||||
|
|||||||
@@ -68,6 +68,7 @@
|
|||||||
@sort-change="tableDataSort"
|
@sort-change="tableDataSort"
|
||||||
@row-dblclick="detailEndpoint"
|
@row-dblclick="detailEndpoint"
|
||||||
@selection-change="(selection)=>{this.batchDeleteObjs=selection}"
|
@selection-change="(selection)=>{this.batchDeleteObjs=selection}"
|
||||||
|
@header-dragend="()=>{this.$refs.endpointTable.doLayout();}"
|
||||||
>
|
>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
:resizable="false"
|
:resizable="false"
|
||||||
@@ -76,13 +77,12 @@
|
|||||||
align="center">
|
align="center">
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
:resizable="false"
|
:resizable="true"
|
||||||
v-for="(item, index) in tools.customTableTitle"
|
v-for="(item, index) in tools.customTableTitle"
|
||||||
v-if="item.show"
|
v-if="item.show"
|
||||||
:width="item.width"
|
|
||||||
:key="`col-${index}`"
|
:key="`col-${index}`"
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
min-width="110px"
|
:min-width="item.width"
|
||||||
:sortable="$tableSet.sortableShow(item.prop,'project')"
|
:sortable="$tableSet.sortableShow(item.prop,'project')"
|
||||||
:prop="$tableSet.propTitle(item.prop,'project')"
|
:prop="$tableSet.propTitle(item.prop,'project')"
|
||||||
:sort-orders="['ascending', 'descending']"
|
:sort-orders="['ascending', 'descending']"
|
||||||
@@ -132,7 +132,7 @@
|
|||||||
<template v-else>-</template>
|
<template v-else>-</template>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column width="28" :resizable="false">
|
<el-table-column width="28" :resizable="true">
|
||||||
<template slot="header" slot-scope="scope">
|
<template slot="header" slot-scope="scope">
|
||||||
<span @mousedown.stop="!tools.showCustomTableTitle && (tools.showCustomTableTitle = true)" class="nz-table-gear">
|
<span @mousedown.stop="!tools.showCustomTableTitle && (tools.showCustomTableTitle = true)" class="nz-table-gear">
|
||||||
<i class="nz-icon nz-icon-gear"></i>
|
<i class="nz-icon nz-icon-gear"></i>
|
||||||
|
|||||||
Reference in New Issue
Block a user