提交报告厅审核界面修改

web/src/views/hq/hallAudit/index.vue

@@ -4,9 +4,9 @@
       <div ref="searchRef" v-show="showSearch" class="mb-[10px]">
         <el-card shadow="hover">
           <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="100px">
-            <el-form-item label="报告厅ID" prop="hallId">
+            <!-- <el-form-item label="报告厅ID" prop="hallId">
               <el-input v-model="queryParams.hallId" placeholder="请输入报告厅ID" clearable @keyup.enter="handleQuery" />
-            </el-form-item>
+            </el-form-item> -->
             <el-form-item label="报告厅名称" prop="hallName">
               <el-input v-model="queryParams.hallName" placeholder="请输入报告厅名称" clearable @keyup.enter="handleQuery" />
             </el-form-item>
@@ -53,7 +53,14 @@
         </el-row>
       </template>
 
-      <el-table v-loading="loading" border :data="hallReservationList" @selection-change="handleSelectionChange" style="margin-bottom: 0">
+      <el-table
+        v-loading="loading"
+        border
+        :data="hallReservationList"
+        @selection-change="handleSelectionChange"
+        @row-dblclick="handleView"
+        style="margin-bottom: 0"
+      >
         <el-table-column type="selection" width="55" align="center" />
         <el-table-column label="报告厅ID" align="center" prop="hallId" />
         <el-table-column label="报告厅名称" align="center" prop="hallName" />
@@ -80,13 +87,9 @@
               :hide-after="100"
               effect="dark"
             >
-              <span class="purpose-text">
-                {{
-                  scope.row.reservationPurpose && scope.row.reservationPurpose.length > 100
-                    ? scope.row.reservationPurpose.substring(0, 100) + '...'
-                    : scope.row.reservationPurpose
-                }}
-              </span>
+              <div class="purpose-text line-clamp-3">
+                {{ scope.row.reservationPurpose }}
+              </div>
             </el-tooltip>
           </template>
         </el-table-column>
@@ -112,17 +115,13 @@
               :hide-after="100"
               effect="dark"
             >
-              <span class="audit-remark-text">
-                {{
-                  scope.row.auditRemark && scope.row.auditRemark.length > 100
-                    ? scope.row.auditRemark.substring(0, 100) + '...'
-                    : scope.row.auditRemark
-                }}
-              </span>
+              <div class="audit-remark-text line-clamp-3">
+                {{ scope.row.auditRemark }}
+              </div>
             </el-tooltip>
           </template>
         </el-table-column>
-        <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="220">
+        <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="220" fixed="right">
           <template #default="scope">
             <!-- 查看按钮，所有记录都可以查看 -->
             <el-tooltip content="查看" placement="top">
@@ -180,9 +179,9 @@
           <span class="form-text">{{ viewForm.hallName }}</span>
         </el-form-item>
         <!-- 报告厅图片展示区域 -->
-        <el-form-item label="报告厅图片" v-if="viewHallImages.length > 0">
+        <el-form-item label="报告厅图片">
           <div class="view-hall-images">
-            <div class="image-gallery">
+            <div class="image-gallery" v-if="viewHallImages.length > 0">
               <div v-for="(image, index) in viewHallImages" :key="index" class="image-item" @click="previewImage(image, index)">
                 <img :src="image" class="gallery-image" @error="handleImageError" />
                 <div class="image-overlay">
@@ -190,6 +189,10 @@
                 </div>
               </div>
             </div>
+            <div v-else class="no-images-placeholder">
+              <el-icon><Picture /></el-icon>
+              <span>暂无图片</span>
+            </div>
           </div>
         </el-form-item>
         <el-form-item label="预约开始时间">
@@ -430,7 +433,7 @@ const getHallList = async () => {
 const getHallImages = (imageUrl: string): string[] => {
   if (!imageUrl || imageUrl.trim() === '') return [];
   // 支持多种分隔符：逗号、分号、空格
-  const separators = /[,;|\s]+/;
+  const separators = /[,;|\\s]+/;
   const images = imageUrl
     .split(separators)
     .map((url) => url.trim())
@@ -855,22 +858,31 @@ onMounted(() => {
 
 /* 表格中预约用途文本样式 */
 .purpose-text {
-  display: inline-block;
-  max-width: 100%;
+  display: -webkit-box;
   word-break: break-all;
   word-wrap: break-word;
   line-height: 1.4;
   cursor: pointer;
+  padding: 0 4px;
 }
 
 /* 表格中审核备注文本样式 */
 .audit-remark-text {
-  display: inline-block;
-  max-width: 100%;
+  display: -webkit-box;
   word-break: break-all;
   word-wrap: break-word;
   line-height: 1.4;
   cursor: pointer;
+  padding: 0 4px;
+}
+
+/* 三行省略样式 */
+.line-clamp-3 {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+  max-height: 4.2em;
 }
 
 /* 查看详情表单样式 */
@@ -920,11 +932,6 @@ onMounted(() => {
   width: 100%;
 }
 
-/* 选中报告厅的图片展示区域 */
-.selected-hall-images {
-  width: 100%;
-}
-
 .image-gallery {
   display: flex;
   flex-wrap: wrap;
@@ -977,6 +984,30 @@ onMounted(() => {
   font-size: 20px;
 }
 
+/* 暂无图片占位样式 */
+.no-images-placeholder {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  max-width: 450px;
+  height: 120px;
+  background-color: #f5f7fa;
+  border: 2px dashed #dcdfe6;
+  border-radius: 8px;
+  color: #909399;
+}
+
+.no-images-placeholder .el-icon {
+  font-size: 32px;
+  margin-bottom: 8px;
+}
+
+.no-images-placeholder span {
+  font-size: 14px;
+}
+
 /* 审核对话框样式 */
 .audit-form .form-text {
   color: #303133;