mod 配置类型展示,优化样式及布局,调整宽度和对齐方式
parent
63c3e8ab66
commit
4cd6de36c2
|
|
@ -271,13 +271,8 @@
|
|||
{{ getUserName(scope.row.inspector) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="配置类型" align="center" prop="configType" width="150">
|
||||
<el-table-column label="配置类型" align="center" prop="configType" width="180">
|
||||
<template #default="scope">
|
||||
<el-tooltip
|
||||
v-if="getRecordConfigTypes(scope.row.configType).length > 0"
|
||||
:content="getRecordConfigTypes(scope.row.configType).join('、')"
|
||||
placement="top"
|
||||
>
|
||||
<div class="table-config-types">
|
||||
<el-tag
|
||||
v-for="configType in getRecordConfigTypes(scope.row.configType)"
|
||||
|
|
@ -288,9 +283,8 @@
|
|||
>
|
||||
{{ configType }}
|
||||
</el-tag>
|
||||
<span v-if="getRecordConfigTypes(scope.row.configType).length === 0" class="text-gray-400">-</span>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
<span v-else class="text-gray-400">-</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态" align="center" prop="status">
|
||||
|
|
@ -361,13 +355,8 @@
|
|||
{{ getUserName(scope.row.inspector) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="配置类型" align="center" prop="configType" width="150">
|
||||
<el-table-column label="配置类型" align="center" prop="configType" width="180">
|
||||
<template #default="scope">
|
||||
<el-tooltip
|
||||
v-if="getRecordConfigTypes(scope.row.configType).length > 0"
|
||||
:content="getRecordConfigTypes(scope.row.configType).join('、')"
|
||||
placement="top"
|
||||
>
|
||||
<div class="table-config-types">
|
||||
<el-tag
|
||||
v-for="configType in getRecordConfigTypes(scope.row.configType)"
|
||||
|
|
@ -378,9 +367,8 @@
|
|||
>
|
||||
{{ configType }}
|
||||
</el-tag>
|
||||
<span v-if="getRecordConfigTypes(scope.row.configType).length === 0" class="text-gray-400">-</span>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
<span v-else class="text-gray-400">-</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态" align="center" prop="status">
|
||||
|
|
@ -450,13 +438,8 @@
|
|||
{{ getUserName(scope.row.inspector) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="配置类型" align="center" prop="configType" width="150">
|
||||
<el-table-column label="配置类型" align="center" prop="configType" width="180">
|
||||
<template #default="scope">
|
||||
<el-tooltip
|
||||
v-if="getRecordConfigTypes(scope.row.configType).length > 0"
|
||||
:content="getRecordConfigTypes(scope.row.configType).join('、')"
|
||||
placement="top"
|
||||
>
|
||||
<div class="table-config-types">
|
||||
<el-tag
|
||||
v-for="configType in getRecordConfigTypes(scope.row.configType)"
|
||||
|
|
@ -467,9 +450,8 @@
|
|||
>
|
||||
{{ configType }}
|
||||
</el-tag>
|
||||
<span v-if="getRecordConfigTypes(scope.row.configType).length === 0" class="text-gray-400">-</span>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
<span v-else class="text-gray-400">-</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column label="备注" align="center" prop="remark" /> -->
|
||||
|
|
@ -1278,27 +1260,20 @@ watch(list, (newList) => {
|
|||
.table-config-types {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
gap: 4px;
|
||||
justify-content: flex-start;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
|
||||
width: 100%;
|
||||
min-height: 24px;
|
||||
|
||||
.config-type-tag {
|
||||
margin: 0;
|
||||
white-space: nowrap;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.config-type-more {
|
||||
cursor: pointer;
|
||||
background-color: #909399;
|
||||
border-color: #909399;
|
||||
|
||||
&:hover {
|
||||
background-color: #73767a;
|
||||
border-color: #73767a;
|
||||
}
|
||||
max-width: none;
|
||||
overflow: visible;
|
||||
text-overflow: clip;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue