|
|
@@ -181,7 +181,7 @@
|
|
|
<span class="hall-id">(ID: {{ hall.id }})</span>
|
|
|
</div>
|
|
|
<div class="hall-description" v-if="hall.hallDescription">
|
|
|
- {{ hall.hallDescription }}
|
|
|
+ {{ displayHallDescription(hall.hallDescription) }}
|
|
|
</div>
|
|
|
<div class="hall-images">
|
|
|
<template v-if="getHallImages(hall.hallImage || '').length > 0">
|
|
|
@@ -826,6 +826,13 @@ const handleExport = () => {
|
|
|
);
|
|
|
};
|
|
|
|
|
|
+// 在 <script setup> 部分适当位置添加工具函数
|
|
|
+/** 将文本截断到指定长度(默认20个字符),超出部分以省略号结尾 */
|
|
|
+const displayHallDescription = (desc: string, maxLen = 20) => {
|
|
|
+ if (!desc) return '';
|
|
|
+ return desc.length > maxLen ? desc.slice(0, maxLen) + '...' : desc;
|
|
|
+};
|
|
|
+
|
|
|
onMounted(() => {
|
|
|
getList();
|
|
|
getHallList();
|
|
|
@@ -887,19 +894,19 @@ onMounted(() => {
|
|
|
font-size: 12px;
|
|
|
color: #606266;
|
|
|
margin-bottom: 4px;
|
|
|
- line-height: 1.3;
|
|
|
max-height: 36px;
|
|
|
+ max-width: 240px; /* 新增:限制最大宽度,防止下拉框过宽 */
|
|
|
overflow: hidden;
|
|
|
+ white-space: nowrap; /* 单行显示 */
|
|
|
text-overflow: ellipsis;
|
|
|
- display: -webkit-box;
|
|
|
- -webkit-line-clamp: 2;
|
|
|
- -webkit-box-orient: vertical;
|
|
|
+ display: block;
|
|
|
}
|
|
|
|
|
|
+/* 下拉框图片容器:每行最多 6 张图片 */
|
|
|
.hall-images {
|
|
|
- display: flex;
|
|
|
+ display: grid;
|
|
|
+ grid-template-columns: repeat(6, 40px); /* 6 列,每列宽 40px */
|
|
|
gap: 4px;
|
|
|
- flex-wrap: wrap;
|
|
|
}
|
|
|
|
|
|
.hall-image {
|