huangxw vor 10 Monaten
Ursprung
Commit
6d2cf6cbde
2 geänderte Dateien mit 27 neuen und 41 gelöschten Zeilen
  1. 23 37
      src/components/ImageUpload/index.vue
  2. 4 4
      src/views/cdt/menus/form/index.vue

+ 23 - 37
src/components/ImageUpload/index.vue

@@ -1,42 +1,28 @@
 <template>
-  <div class="component-upload-image">
-    <el-upload
-      ref="imageUpload"
-      multiple
-      :action="uploadImgUrl"
-      list-type="picture-card"
-      :on-success="handleUploadSuccess"
-      :before-upload="handleBeforeUpload"
-      :limit="limit"
-      :on-error="handleUploadError"
-      :on-exceed="handleExceed"
-      :before-remove="handleDelete"
-      :show-file-list="true"
-      :headers="headers"
-      :file-list="fileList"
-      :on-preview="handlePictureCardPreview"
-      :class="{ hide: fileList.length >= limit }"
-    >
-      <el-icon class="avatar-uploader-icon">
-        <plus />
-      </el-icon>
-    </el-upload>
-    <!-- 上传提示 -->
-    <div v-if="showTip" class="el-upload__tip">
-      请上传
-      <template v-if="fileSize">
-        大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b>
-      </template>
-      <template v-if="fileType">
-        格式为 <b style="color: #f56c6c">{{ fileType.join('/') }}</b>
-      </template>
-      的文件
-    </div>
+    <div class="component-upload-image">
+        <el-upload ref="imageUpload" multiple :action="uploadImgUrl" list-type="picture-card" :on-success="handleUploadSuccess" :before-upload="handleBeforeUpload" :limit="limit" :on-error="handleUploadError" :on-exceed="handleExceed" :before-remove="handleDelete" :show-file-list="true" :headers="headers" :file-list="fileList" :on-preview="handlePictureCardPreview" :class="{ hide: fileList.length >= limit }">
+            <el-icon class="avatar-uploader-icon">
+                <plus />
+            </el-icon>
+        </el-upload>
+        <!-- 上传提示 -->
+        <div v-if="showTip" class="el-upload__tip">
+            请上传
+            <template v-if="fileSize">
+                大小不超过
+                <b style="color: #f56c6c">{{ fileSize }}MB</b>
+            </template>
+            <template v-if="fileType">
+                格式为
+                <b style="color: #f56c6c">{{ fileType.join('/') }}</b>
+            </template>
+            的文件
+        </div>
 
-    <el-dialog v-model="dialogVisible" title="预览" width="800px" append-to-body>
-      <img :src="dialogImageUrl" style="display: block; max-width: 100%; margin: 0 auto" />
-    </el-dialog>
-  </div>
+        <el-dialog v-model="dialogVisible" title="预览" width="800px" append-to-body>
+            <img :src="dialogImageUrl" style="display: block; max-width: 100%; margin: 0 auto" />
+        </el-dialog>
+    </div>
 </template>
 
 <script setup lang="ts">

+ 4 - 4
src/views/cdt/menus/form/index.vue

@@ -79,13 +79,13 @@
                                 </el-form-item>
                             </el-col>
                             <el-col :span="8">
-                                <el-form-item label="封面图" prop="price">
-                                    <el-input v-model="form.price" clearable placeholder="请输入套餐价格"></el-input>
+                                <el-form-item label="封面图" prop="coverImg">
+                                    <imageUpload v-model="form.coverImg" :limit="1" isString :isShowTip="false"></imageUpload>
                                 </el-form-item>
                             </el-col>
                             <el-col :span="8">
-                                <el-form-item label="产品图" prop="price">
-                                    <el-input v-model="form.price" clearable placeholder="请输入套餐价格"></el-input>
+                                <el-form-item label="产品图" prop="proImg">
+                                    <imageUpload v-model="form.proImg" :limit="5" isString :isShowTip="false"></imageUpload>
                                 </el-form-item>
                             </el-col>
                         </el-row>