新增摸大红业务并修复后台链接按钮白字

支持分类筛选、搜索、下单支付建群与固定二维码；合并迁移种子数据；后台表格编辑/详情链接恢复主题色可见。
2026-07-16 18:08:18 +08:00
parent 97a34e0329
commit 6d61027318
49 changed files with 9533 additions and 20 deletions
@@ -0,0 +1,149 @@
+<script setup lang="ts">
+import { onMounted, reactive, ref } from 'vue'
+import { ElMessage } from 'element-plus'
+import { Upload } from '@element-plus/icons-vue'
+import {
+  fetchAdminMohongConfig,
+  updateAdminMohongConfig,
+  type MohongConfig,
+} from '@/features/mohong/api/mohong'
+import { uploadAdminFile } from '@/shared/api/files'
+import { readError } from '@/shared/utils/error'
+
+const loading = ref(false)
+const saving = ref(false)
+const form = reactive<MohongConfig>({
+  default_qrcode_url: '',
+  group_welcome_text: '',
+  order_copy_template: '',
+})
+
+onMounted(load)
+
+async function load() {
+  loading.value = true
+  try {
+    const config = await fetchAdminMohongConfig()
+    Object.assign(form, config)
+  } catch (error) {
+    ElMessage.error(readError(error, '加载配置失败'))
+  } finally {
+    loading.value = false
+  }
+}
+
+async function handleSave() {
+  saving.value = true
+  try {
+    const config = await updateAdminMohongConfig({
+      default_qrcode_url: form.default_qrcode_url,
+      group_welcome_text: form.group_welcome_text,
+      order_copy_template: form.order_copy_template,
+    })
+    Object.assign(form, config)
+    ElMessage.success('已保存')
+  } catch (error) {
+    ElMessage.error(readError(error, '保存失败'))
+  } finally {
+    saving.value = false
+  }
+}
+
+async function uploadQrcode(file: File) {
+  try {
+    const uploaded = await uploadAdminFile(file, 'mohong')
+    form.default_qrcode_url = uploaded.url
+    ElMessage.success('上传成功')
+  } catch (error) {
+    ElMessage.error(readError(error, '上传失败'))
+  }
+  return false
+}
+</script>
+
+<template>
+  <div v-loading="loading" class="admin-page">
+    <div class="page-head">
+      <div>
+        <h2>摸大红配置</h2>
+        <p>全局默认固定二维码、群欢迎语、订单复制模板。商品可覆盖默认二维码。</p>
+      </div>
+      <el-button type="primary" :loading="saving" @click="handleSave">保存配置</el-button>
+    </div>
+
+    <el-form label-width="140px" class="config-form">
+      <el-form-item label="默认固定二维码">
+        <div class="qr-row">
+          <el-image
+            v-if="form.default_qrcode_url"
+            :src="form.default_qrcode_url"
+            fit="contain"
+            style="width: 160px; height: 160px; border-radius: 12px; background: #f7f9fc"
+          />
+          <div class="qr-actions">
+            <el-upload :show-file-list="false" accept="image/*" :before-upload="uploadQrcode">
+              <el-button :icon="Upload">上传二维码</el-button>
+            </el-upload>
+            <el-input v-model="form.default_qrcode_url" placeholder="或直接填写图片 URL" />
+          </div>
+        </div>
+      </el-form-item>
+      <el-form-item label="群欢迎语">
+        <el-input v-model="form.group_welcome_text" type="textarea" :rows="3" />
+      </el-form-item>
+      <el-form-item label="复制文案模板">
+        <el-input v-model="form.order_copy_template" type="textarea" :rows="8" />
+        <div class="hint">
+          可用变量：&#123;&#123;order_no&#125;&#125; &#123;&#123;created_at&#125;&#125;
+          &#123;&#123;product_title&#125;&#125; &#123;&#123;quantity&#125;&#125; &#123;&#123;amount&#125;&#125;
+          &#123;&#123;buyer_name&#125;&#125; &#123;&#123;buyer_phone&#125;&#125; &#123;&#123;unit&#125;&#125;
+        </div>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<style scoped>
+.admin-page {
+  display: grid;
+  gap: 16px;
+}
+.page-head {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  gap: 12px;
+}
+.page-head h2 {
+  margin: 0 0 4px;
+}
+.page-head p {
+  margin: 0;
+  color: #6b7a90;
+  font-size: 13px;
+}
+.config-form {
+  max-width: 820px;
+  padding: 20px;
+  border-radius: 12px;
+  background: #fff;
+  border: 1px solid #eef1f5;
+}
+.qr-row {
+  display: flex;
+  gap: 16px;
+  align-items: flex-start;
+  width: 100%;
+}
+.qr-actions {
+  flex: 1;
+  display: grid;
+  gap: 10px;
+}
+.hint {
+  margin-top: 8px;
+  color: #8a94a6;
+  font-size: 12px;
+  line-height: 1.5;
+}
+</style>