新增

frontend/src/components/ReplyRuleEditor.vue

@@ -21,6 +21,14 @@ const props = defineProps({
   showHeader: {
     type: Boolean,
     default: true
+  },
+  readonly: {
+    type: Boolean,
+    default: false
+  },
+  canUploadCards: {
+    type: Boolean,
+    default: true
   }
 })
 
@@ -39,10 +47,12 @@ const typeOptions = replyTypeOptions.map((opt) => ({
 const cardUploading = ref({})
 
 const addReplyItem = () => {
+  if (props.readonly) return
   replyItems.value = [...replyItems.value, emptyReplyForm()]
 }
 
 const removeReplyItem = (index) => {
+  if (props.readonly) return
   if (replyItems.value.length <= 1) {
     message.warning('至少保留一条回复消息')
     return
@@ -53,6 +63,7 @@ const removeReplyItem = (index) => {
 }
 
 const updateReplyField = (index, field, value) => {
+  if (props.readonly) return
   const next = replyItems.value.map((item, i) =>
     i === index ? { ...item, [field]: value } : item
   )
@@ -60,6 +71,7 @@ const updateReplyField = (index, field, value) => {
 }
 
 const updateReplyFields = (index, fields) => {
+  if (props.readonly) return
   const next = replyItems.value.map((item, i) =>
     i === index ? { ...item, ...fields } : item
   )
@@ -67,6 +79,11 @@ const updateReplyFields = (index, fields) => {
 }
 
 const uploadCardImage = async (index, options) => {
+  if (props.readonly || !props.canUploadCards) {
+    message.warning('当前账号无卡片上传权限')
+    options?.onError?.(new Error('no permission'))
+    return
+  }
   const { file, onSuccess, onError } = options
   cardUploading.value = { ...cardUploading.value, [index]: true }
   try {
@@ -104,7 +121,13 @@ const copyPageUrl = async (url) => {
   <div class="reply-rule-editor">
     <div v-if="showHeader" class="reply-list-header">
       <span class="reply-list-title">自动回复消息</span>
-      <a-button type="dashed" size="small" class="reply-add-btn" @click="addReplyItem">
+      <a-button
+        v-if="!readonly"
+        type="dashed"
+        size="small"
+        class="reply-add-btn"
+        @click="addReplyItem"
+      >
         <template #icon><PlusOutlined /></template>
         添加一条消息
       </a-button>
@@ -114,7 +137,7 @@ const copyPageUrl = async (url) => {
       <div class="reply-item-header">
         <span>消息 {{ replyIndex + 1 }}</span>
         <a-button
-          v-if="replyItems.length > 1"
+          v-if="!readonly && replyItems.length > 1"
           type="text"
           danger
           size="small"
@@ -130,6 +153,7 @@ const copyPageUrl = async (url) => {
           :value="reply.reply_type"
           button-style="solid"
           class="reply-type-group"
+          :disabled="readonly"
           @update:value="(v) => updateReplyField(replyIndex, 'reply_type', v)"
         >
           <a-radio-button v-for="opt in typeOptions" :key="opt.value" :value="opt.value">
@@ -193,6 +217,7 @@ const copyPageUrl = async (url) => {
         <a-form-item label="封面图片" required>
           <div class="card-upload-row">
             <a-upload
+              v-if="canUploadCards && !readonly"
               name="file"
               list-type="picture-card"
               :show-upload-list="false"
@@ -214,6 +239,15 @@ const copyPageUrl = async (url) => {
                 <div>上传封面</div>
               </div>
             </a-upload>
+            <div v-else class="card-upload-placeholder">
+              <img
+                v-if="reply.reply_card_cover_url || reply.reply_card_image_path"
+                :src="reply.reply_card_cover_url || reply.reply_card_image_path"
+                alt="封面"
+                class="card-cover-preview"
+              />
+              <template v-else>无上传权限</template>
+            </div>
             <span class="card-upload-tip">上传后自动转为 PNG favicon（32×32）与卡片封面（256×256）</span>
           </div>
         </a-form-item>