优化商品审核页面，优化店铺审核页面的展示。

src/views/hisStore/store/index.vue

@@ -249,10 +249,23 @@
                 <!-- 图片容器（包含图片和删除按钮，仅在有图片时显示） -->
                 <div class="avatar-wrapper" v-if="form.logoUrl">
                   <img :src="form.logoUrl" class="avatar" width="200px">
-                  <!-- 悬停显示的删除按钮 -->
-                  <div class="delete-mask" @click.stop="handleDeleteLogo">
-                    <i class="el-icon-delete"></i>
+                  <!-- 显示删除还是显示放大是更具编辑或者详情来的 -->
+<!--                  <div v-if="isViewMode" class="view-mask" @click.stop="previewImage(form.logoUrl)">-->
+<!--                    <i class="el-icon-zoom-in"></i>-->
+<!--                  </div>-->
+<!--                  <div v-else class="delete-mask" @click.stop="handleDeleteLogo">-->
+<!--                    <i class="el-icon-delete"></i>-->
+<!--                  </div>-->
+<!--                  并排显示就好了-->
+                  <div class="button-group">
+                    <div class="preview-btn" @click.stop="previewImage(form.logoUrl)">
+                      <i class="el-icon-zoom-in"></i>
+                    </div>
+                    <div v-if="!isViewMode" class="delete-btn" @click.stop="handleDeleteLogo">
+                      <i class="el-icon-delete"></i>
+                    </div>
                   </div>
+
                 </div>
                 <!-- 未上传图片时显示的默认图标 -->
                 <i v-else class="el-icon-plus avatar-uploader-icon"></i>
@@ -320,11 +333,24 @@
                 <div class="avatar-wrapper" v-if="form.businessLicense">
                   <img :src="form.businessLicense" class="avatar" width="200px">
                   <!-- 悬停显示的删除按钮 -->
-                  <div class="delete-mask" @click.stop="handleDelete5">
-                    <i class="el-icon-delete"></i>
+<!--                  <div class="delete-mask" @click.stop="handleDelete5">-->
+<!--                    <i class="el-icon-delete"></i>-->
+<!--                  </div>-->
+                  <div class="button-group">
+                    <div class="preview-btn" @click.stop="previewImage(form.businessLicense)">
+                      <i class="el-icon-zoom-in"></i>
+                    </div>
+                    <div v-if="!isViewMode" class="delete-btn" @click.stop="handleDelete5">
+                      <i class="el-icon-delete"></i>
+                    </div>
                   </div>
                 </div>
-                <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                <!-- 未上传图片时显示的默认图标 -->
+                <div v-else class="no-image-placeholder">
+                  <span v-if="isViewMode">用户未上传</span>
+                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                </div>
+
               </el-upload>
             </el-form-item>
             <el-col :span="12">
@@ -372,12 +398,23 @@
                   <div class="avatar-wrapper" v-if="form.drugLicense">
                     <img :src="form.drugLicense" class="avatar" width="200px">
                     <!-- 悬停显示的删除按钮 -->
-                    <div class="delete-mask" @click.stop="handleDelete6">
-                      <i class="el-icon-delete"></i>
+<!--                    <div class="delete-mask" @click.stop="handleDelete6">-->
+<!--                      <i class="el-icon-delete"></i>-->
+<!--                    </div>-->
+                    <div class="button-group">
+                      <div class="preview-btn" @click.stop="previewImage(form.drugLicense)">
+                        <i class="el-icon-zoom-in"></i>
+                      </div>
+                      <div v-if="!isViewMode" class="delete-btn" @click.stop="handleDelete6">
+                        <i class="el-icon-delete"></i>
+                      </div>
                     </div>
                   </div>
-
-                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                  <!-- 未上传图片时显示的默认图标 -->
+                  <div v-else class="no-image-placeholder">
+                    <span v-if="isViewMode">用户未上传</span>
+                    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                  </div>
                 </el-upload>
               </el-form-item>
               <el-col :span="14">
@@ -415,11 +452,23 @@
                   <div class="avatar-wrapper" v-if="form.medicalDevice2">
                     <img :src="form.medicalDevice2" class="avatar" width="200px">
                     <!-- 悬停显示的删除按钮 -->
-                    <div class="delete-mask" @click.stop="handleDelete7">
-                      <i class="el-icon-delete"></i>
+<!--                    <div class="delete-mask" @click.stop="handleDelete7">-->
+<!--                      <i class="el-icon-delete"></i>-->
+<!--                    </div>-->
+                    <div class="button-group">
+                      <div class="preview-btn" @click.stop="previewImage(form.medicalDevice2)">
+                        <i class="el-icon-zoom-in"></i>
+                      </div>
+                      <div v-if="!isViewMode" class="delete-btn" @click.stop="handleDelete7">
+                        <i class="el-icon-delete"></i>
+                      </div>
                     </div>
                   </div>
-                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                  <!-- 未上传图片时显示的默认图标 -->
+                  <div v-else class="no-image-placeholder">
+                    <span v-if="isViewMode">用户未上传</span>
+                    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                  </div>
                 </el-upload>
               </el-form-item>
 
@@ -473,11 +522,23 @@
                   <div class="avatar-wrapper" v-if="form.medicalDevice3">
                     <img :src="form.medicalDevice3" class="avatar" width="200px">
                     <!-- 悬停显示的删除按钮 -->
-                    <div class="delete-mask" @click.stop="handleDelete2">
-                      <i class="el-icon-delete"></i>
+<!--                    <div class="delete-mask" @click.stop="handleDelete2">-->
+<!--                      <i class="el-icon-delete"></i>-->
+<!--                    </div>-->
+                    <div class="button-group">
+                      <div class="preview-btn" @click.stop="previewImage(form.medicalDevice3)">
+                        <i class="el-icon-zoom-in"></i>
+                      </div>
+                      <div v-if="!isViewMode" class="delete-btn" @click.stop="handleDelete2">
+                        <i class="el-icon-delete"></i>
+                      </div>
                     </div>
                   </div>
-                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                  <!-- 未上传图片时显示的默认图标 -->
+                  <div v-else class="no-image-placeholder">
+                    <span v-if="isViewMode">用户未上传</span>
+                    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                  </div>
                 </el-upload>
               </el-form-item>
 
@@ -520,11 +581,23 @@
                   <div class="avatar-wrapper" v-if="form.foodLicense">
                     <img :src="form.foodLicense" class="avatar" width="200px">
                     <!-- 悬停显示的删除按钮 -->
-                    <div class="delete-mask" @click.stop="handleDelete3">
-                      <i class="el-icon-delete"></i>
+<!--                    <div class="delete-mask" @click.stop="handleDelete3">-->
+<!--                      <i class="el-icon-delete"></i>-->
+<!--                    </div>-->
+                    <div class="button-group">
+                      <div class="preview-btn" @click.stop="previewImage(form.foodLicense)">
+                        <i class="el-icon-zoom-in"></i>
+                      </div>
+                      <div v-if="!isViewMode" class="delete-btn" @click.stop="handleDelete3">
+                        <i class="el-icon-delete"></i>
+                      </div>
                     </div>
                   </div>
-                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                  <!-- 未上传图片时显示的默认图标 -->
+                  <div v-else class="no-image-placeholder">
+                    <span v-if="isViewMode">用户未上传</span>
+                    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                  </div>
                 </el-upload>
               </el-form-item>
               <el-form-item label="食品经营许可证/备案凭证编号" prop="foodCode" style="margin-left: 5px">
@@ -856,6 +929,10 @@
       </div>
     </el-dialog>
 
+    <!-- 修改图片预览对话框，增加更大的预览尺寸 -->
+    <el-dialog :visible.sync="imagePreviewVisible" width="1100px" append-to-body :modal-append-to-body="false" @close="imagePreviewVisible = false">
+      <img :src="previewImageUrl" style="width: 100%; height: auto; max-height: 700px; object-fit: contain;" />
+    </el-dialog>
 
 
     <el-dialog
@@ -884,6 +961,8 @@ export default {
   components: { storeDetails, StoreDialog },
   data() {
     return {
+      previewImageUrl: '', // 添加预览图片URL
+      imagePreviewVisible: false,// 添加图片预览对话框可见性控制
       // 新增：控制LOGO上传组件禁用状态
       isDeleting: false,
       promptList:[],
@@ -1107,6 +1186,11 @@ export default {
     })
   },
   methods: {
+    // 添加图片预览方法
+    previewImage(url) {
+      this.previewImageUrl = url;
+      this.imagePreviewVisible = true;
+    },
     handleNoticeInfo() {
       qualifications()
         .then(response => {
@@ -1906,6 +1990,62 @@ export default {
 .agreement-section .el-date-editor--daterange.el-input__inner {
   width: 100%;
 }
+/* 并排按钮样式 */
+.button-group {
+  position: absolute;
+  top: 10px;
+  right: 10px;
+  display: flex;
+  gap: 5px;
+}
+
+.preview-btn,
+.delete-btn {
+  width: 30px;
+  height: 30px;
+  border-radius: 50%;
+  background-color: rgba(0, 0, 0, 0.5);
+  color: white;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  font-size: 16px;
+  transition: background-color 0.3s;
+}
+
+.preview-btn:hover {
+  background-color: rgba(0, 0, 0, 0.7);
+}
+
+.delete-btn:hover {
+  background-color: #f56c6c;
+}
+
+/* 无图片占位符样式 */
+.no-image-placeholder {
+  width: 200px;
+  height: 200px;
+  border: 1px dashed #d9d9d9;
+  border-radius: 6px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #999;
+  background-color: #fafafa;
+}
+
+.avatar-wrapper {
+  position: relative;
+  display: inline-block;
+}
+
+.avatar {
+  width: 200px;
+  height: 200px;
+  object-fit: cover;
+  border-radius: 4px;
+}
 
 
 </style>

src/views/hisStore/storeProductAudit/index.vue

@@ -37,16 +37,7 @@
               />
         </el-select>
       </el-form-item>
-<!--      <el-form-item label="所属公司">-->
-<!--        <el-select style="width: 240px" v-model="companyId" multiple placeholder="请选择企业" clearable size="small" >-->
-<!--          <el-option-->
-<!--            v-for="item in companyOptions"-->
-<!--            :key="item.companyId"-->
-<!--            :label="item.companyName"-->
-<!--            :value="item.companyId"-->
-<!--          />-->
-<!--        </el-select>-->
-<!--      </el-form-item>-->
+
       <el-form-item label="所属店铺">
         <el-select style="width: 240px" v-model="storeId" multiple placeholder="请选择企业" clearable size="small" >
           <el-option
@@ -57,16 +48,6 @@
           />
         </el-select>
       </el-form-item>
-      <!-- <el-form-item label="状态" prop="isShow">
-         <el-select style="width: 240px" v-model="queryParams.isShow" placeholder="请选择状态" clearable size="small" >
-         <el-option
-                v-for="item in isShowOptions"
-                :key="item.dictValue"
-                :label="item.dictLabel"
-                :value="item.dictValue"
-              />
-        </el-select>
-      </el-form-item> -->
 
       <el-form-item>
         <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
@@ -98,11 +79,6 @@
 	    <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
-<!--    <el-tabs type="card" v-model="activeName" @tab-click="handleClick">
-      <el-tab-pane label="出售中" name="1"></el-tab-pane>
-      <el-tab-pane label="待上架" name="0"></el-tab-pane>
-    </el-tabs>-->
-
     <el-table  height="500" border v-loading="loading" :data="storeProductList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column label="ID" align="center" prop="productId" />
@@ -198,7 +174,7 @@
           </div>
         </div>
       </template>
-      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+      <el-form ref="form" :model="form" :rules="rules" label-width="100px" :disabled="isAuditMode">
         <el-row>
           <el-col :span="12">
             <el-form-item label="商品名称" prop="productName">
@@ -929,6 +905,7 @@ export default {
   },
   data() {
     return {
+      isAuditMode: false, // 添加此标志位控制是否为审核模式
       activeValue: '0',
       gmpAuthValue:false,
       certificateValue:false,
@@ -1412,6 +1389,7 @@ export default {
     cancel() {
       this.open = false;
       this.reset();
+      this.isAuditMode = false; // 重置审核模式标志
     },
     // 表单重置
     reset() {
@@ -1673,6 +1651,8 @@ export default {
         }
         this.open = true;
         this.title = "修改商品";
+        // 设置为审核模式，禁用商品信息表单
+        this.isAuditMode = true;
       });
     },
     handleUpdate1(oper) {
@@ -1696,6 +1676,7 @@ export default {
           this.form1.auditReason = null;
           this.form1.attachment = null;
           this.getList();
+          this.isAuditMode = false; // 重置审核模式标志
         }else{
           this.$message.error("审核失败",res.msg);
         }