diff --git a/pages/message/common-phrases.vue b/pages/message/common-phrases.vue index f338ded..2afd68d 100644 --- a/pages/message/common-phrases.vue +++ b/pages/message/common-phrases.vue @@ -179,21 +179,14 @@ > {{ phraseForm.content.length }}/500 - 图片附件 - - - - × - - - + - - + @@ -276,7 +269,8 @@ import { ref, computed, onMounted } from "vue"; import { storeToRefs } from "pinia"; import api from "@/utils/api"; import useAccountStore from "@/store/account"; -import { chooseAndUploadImage, normalizeFileUrl } from "@/utils/file"; +import formFiles from "@/components/form-template/form-cell/form-files.vue"; +import { normalizeFileUrl } from "@/utils/file"; const { doctorInfo } = storeToRefs(useAccountStore()); @@ -491,18 +485,8 @@ const previewFiles = (files, index = 0) => { uni.previewImage({ urls, current: urls[index] || urls[0] }); }; -const addPhraseImage = async () => { - if (phraseForm.value.files.length >= 9) { - uni.showToast({ title: "最多上传9张图片", icon: "none" }); - return; - } - const url = await chooseAndUploadImage({ count: 1 }); - if (!url) return; - phraseForm.value.files.push({ type: "image", url: normalizeFileUrl(url), name: "图片" }); -}; - -const removePhraseImage = (index) => { - phraseForm.value.files.splice(index, 1); +const handlePhraseFilesChange = ({ value }) => { + phraseForm.value.files = normalizeFiles(value); }; const savePhrase = async () => { @@ -1334,54 +1318,21 @@ $border-color: #edf0f5; margin: -14rpx 0 32rpx; } -.image-grid { - display: flex; - flex-wrap: wrap; - gap: 16rpx; +.phrase-files-cell { + display: block; margin-bottom: 30rpx; -} -.image-item, -.image-add { - position: relative; - width: 142rpx; - height: 142rpx; - border-radius: 12rpx; - overflow: hidden; - background: #f7f8fb; -} + :deep(.files-wrap) { + padding: 0; + border-bottom: 0; + background: transparent; + } -.image-thumb { - width: 100%; - height: 100%; -} - -.image-remove { - position: absolute; - top: 6rpx; - right: 6rpx; - width: 34rpx; - height: 34rpx; - line-height: 34rpx; - text-align: center; - color: #fff; - font-size: 26rpx; - border-radius: 50%; - background: rgba(0, 0, 0, 0.55); -} - -.image-add { - display: flex; - align-items: center; - justify-content: center; - color: #98a2b3; - border: 1px dashed #cfd3dc; - box-sizing: border-box; -} - -.image-add-icon { - font-size: 52rpx; - line-height: 52rpx; + :deep(.files-label) { + color: $text-main; + font-size: 28rpx; + font-weight: 500; + } } .phrase-textarea {