From a1d7e81859f554f3a53680cc35f0f49bf1f77098 Mon Sep 17 00:00:00 2001
From: wwf <1971391498@qq.com>
Date: 星期四, 14 五月 2026 14:37:02 +0800
Subject: [PATCH] 导入项目

---
 src/views/mp/components/wx-reply/components/TabMusic.vue |  116 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 116 insertions(+), 0 deletions(-)

diff --git a/src/views/mp/components/wx-reply/components/TabMusic.vue b/src/views/mp/components/wx-reply/components/TabMusic.vue
new file mode 100644
index 0000000..6421d24
--- /dev/null
+++ b/src/views/mp/components/wx-reply/components/TabMusic.vue
@@ -0,0 +1,116 @@
+<template>
+  <div>
+    <el-row align="middle" justify="center">
+      <el-col :span="6">
+        <el-row align="middle" justify="center" class="thumb-div">
+          <el-col :span="24">
+            <el-row align="middle" justify="center">
+              <img style="width: 100px" v-if="reply.thumbMediaUrl" :src="reply.thumbMediaUrl" />
+              <icon v-else icon="ep:plus" />
+            </el-row>
+            <el-row align="middle" justify="center" style="margin-top: 2%">
+              <div class="thumb-but">
+                <el-upload
+                  :action="UPLOAD_URL"
+                  :headers="HEADERS"
+                  multiple
+                  :limit="1"
+                  :file-list="fileList"
+                  :data="uploadData"
+                  :before-upload="beforeImageUpload"
+                  :on-success="onUploadSuccess"
+                >
+                  <template #trigger>
+                    <el-button type="primary" link>鏈湴涓婁紶</el-button>
+                  </template>
+                  <el-button type="primary" link @click="showDialog = true" style="margin-left: 5px"
+                    >绱犳潗搴撻�夋嫨
+                  </el-button>
+                </el-upload>
+              </div>
+            </el-row>
+          </el-col>
+        </el-row>
+        <el-dialog
+          title="閫夋嫨鍥剧墖"
+          v-model="showDialog"
+          width="80%"
+          append-to-body
+          destroy-on-close
+        >
+          <WxMaterialSelect
+            type="image"
+            :account-id="reply.accountId"
+            @select-material="selectMaterial"
+          />
+        </el-dialog>
+      </el-col>
+      <el-col :span="18">
+        <el-input v-model="reply.title" placeholder="璇疯緭鍏ユ爣棰�" />
+        <div style="margin: 20px 0"></div>
+        <el-input v-model="reply.description" placeholder="璇疯緭鍏ユ弿杩�" />
+      </el-col>
+    </el-row>
+    <div style="margin: 20px 0"></div>
+    <el-input v-model="reply.musicUrl" placeholder="璇疯緭鍏ラ煶涔愰摼鎺�" />
+    <div style="margin: 20px 0"></div>
+    <el-input v-model="reply.hqMusicUrl" placeholder="璇疯緭鍏ラ珮璐ㄩ噺闊充箰閾炬帴" />
+  </div>
+</template>
+
+<script lang="ts" setup>
+import WxMaterialSelect from '@/views/mp/components/wx-material-select'
+import type { UploadRawFile } from 'element-plus'
+import { UploadType, useBeforeUpload } from '@/views/mp/hooks/useUpload'
+import { getAccessToken } from '@/utils/auth'
+import { Reply } from './types'
+
+const message = useMessage()
+
+const UPLOAD_URL = import.meta.env.VITE_BASE_URL + '/admin-api/mp/material/upload-temporary'
+const HEADERS = { Authorization: 'Bearer ' + getAccessToken() } // 璁剧疆涓婁紶鐨勮姹傚ご閮�
+
+const props = defineProps<{
+  modelValue: Reply
+}>()
+const emit = defineEmits<{
+  (e: 'update:modelValue', v: Reply)
+}>()
+const reply = computed<Reply>({
+  get: () => props.modelValue,
+  set: (val) => emit('update:modelValue', val)
+})
+
+const showDialog = ref(false)
+const fileList = ref([])
+const uploadData = reactive({
+  accountId: reply.value.accountId,
+  type: 'thumb', // 闊充箰绫诲瀷涓簍humb
+  title: '',
+  introduction: ''
+})
+
+const beforeImageUpload = (rawFile: UploadRawFile) => useBeforeUpload(UploadType.Image, 2)(rawFile)
+
+const onUploadSuccess = (res: any) => {
+  if (res.code !== 0) {
+    message.error('涓婁紶鍑洪敊锛�' + res.msg)
+    return false
+  }
+
+  // 娓呯┖涓婁紶鏃剁殑鍚勭鏁版嵁
+  fileList.value = []
+  uploadData.title = ''
+  uploadData.introduction = ''
+
+  // 涓婁紶濂界殑鏂囦欢锛屾湰璐ㄦ槸涓礌鏉愶紝鎵�浠ュ彲浠ヨ繘琛岄�変腑
+  selectMaterial(res.data)
+}
+
+const selectMaterial = (item: any) => {
+  showDialog.value = false
+
+  reply.value.thumbMediaId = item.mediaId
+  reply.value.thumbMediaUrl = item.url
+}
+</script>

--
Gitblit v1.8.0