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/draft/index.vue | 208 ++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 208 insertions(+), 0 deletions(-)
diff --git a/src/views/mp/draft/index.vue b/src/views/mp/draft/index.vue
new file mode 100644
index 0000000..5209d22
--- /dev/null
+++ b/src/views/mp/draft/index.vue
@@ -0,0 +1,208 @@
+<template>
+ <doc-alert title="鍏紬鍙峰浘鏂�" url="https://doc.iocoder.cn/mp/article/" />
+
+ <!-- 鎼滅储宸ヤ綔鏍� -->
+ <ContentWrap>
+ <el-form
+ class="-mb-15px"
+ :model="queryParams"
+ ref="queryFormRef"
+ :inline="true"
+ label-width="68px"
+ >
+ <el-form-item label="鍏紬鍙�" prop="accountId">
+ <WxAccountSelect @change="onAccountChanged" />
+ </el-form-item>
+ <el-form-item>
+ <el-button
+ type="primary"
+ plain
+ @click="handleAdd"
+ v-hasPermi="['mp:draft:create']"
+ :disabled="accountId === 0"
+ >
+ <Icon icon="ep:plus" />鏂板
+ </el-button>
+ </el-form-item>
+ </el-form>
+ </ContentWrap>
+
+ <!-- 鍒楄〃 -->
+ <ContentWrap>
+ <DraftTable
+ :loading="loading"
+ :list="list"
+ @update="onUpdate"
+ @delete="onDelete"
+ @publish="onPublish"
+ />
+ <!-- 鍒嗛〉璁板綍 -->
+ <Pagination
+ :total="total"
+ v-model:page="queryParams.pageNo"
+ v-model:limit="queryParams.pageSize"
+ @pagination="getList"
+ />
+ </ContentWrap>
+
+ <!-- 娣诲姞鎴栦慨鏀硅崏绋垮璇濇 -->
+ <el-dialog
+ :title="isCreating ? '鏂板缓鍥炬枃' : '淇敼鍥炬枃'"
+ width="80%"
+ v-model="showDialog"
+ :before-close="onBeforeDialogClose"
+ destroy-on-close
+ >
+ <NewsForm v-model="newsList" v-loading="isSubmitting" :is-creating="isCreating" />
+ <template #footer>
+ <el-button @click="showDialog = false">鍙� 娑�</el-button>
+ <el-button type="primary" @click="onSubmitNewsItem">鎻� 浜�</el-button>
+ </template>
+ </el-dialog>
+</template>
+
+<script lang="ts" setup>
+import WxAccountSelect from '@/views/mp/components/wx-account-select'
+import * as MpDraftApi from '@/api/mp/draft'
+import * as MpFreePublishApi from '@/api/mp/freePublish'
+import {
+ type Article,
+ type NewsItem,
+ NewsForm,
+ DraftTable,
+ createEmptyNewsItem
+} from './components/'
+// import drafts from './mock' // 鍙互鐢ㄦ敼鏈湴鏁版嵁妯℃嫙锛岄伩鍏岮PI璋冪敤瓒呴檺
+
+defineOptions({ name: 'MpDraft' })
+
+const message = useMessage() // 娑堟伅
+
+const accountId = ref(-1)
+provide('accountId', accountId)
+
+const loading = ref(true) // 鍒楄〃鐨勫姞杞戒腑
+const list = ref<any[]>([]) // 鍒楄〃鐨勬暟鎹�
+const total = ref(0) // 鍒楄〃鐨勬�婚〉鏁�
+
+const queryParams = reactive({
+ pageNo: 1,
+ pageSize: 10,
+ accountId: accountId
+})
+
+// ========== 鑽夌鏂板缓 or 淇敼 ==========
+const showDialog = ref(false)
+const newsList = ref<NewsItem[]>([])
+const mediaId = ref('')
+const isCreating = ref(true)
+const isSubmitting = ref(false)
+
+/** 渚﹀惉鍏紬鍙峰彉鍖� **/
+const onAccountChanged = (id: number) => {
+ accountId.value = id
+ queryParams.pageNo = 1
+ getList()
+}
+
+// 鍏抽棴寮圭獥
+const onBeforeDialogClose = async (onDone: () => {}) => {
+ try {
+ await message.confirm('淇敼鍐呭鍙兘杩樻湭淇濆瓨锛岀‘瀹氬叧闂悧?')
+ onDone()
+ } catch {
+ //
+ }
+}
+
+// ======================== 鍒楄〃鏌ヨ ========================
+/** 鏌ヨ鍒楄〃 */
+const getList = async () => {
+ loading.value = true
+ try {
+ const drafts = await MpDraftApi.getDraftPage(queryParams)
+ drafts.list.forEach((draft) => {
+ const newsList = draft.content.newsItem
+ // 灏� thumbUrl 杞垚 picUrl锛屼繚璇� wx-news 缁勪欢鍙互棰勮灏侀潰
+ newsList.forEach((item) => {
+ item.picUrl = item.thumbUrl
+ })
+ })
+ list.value = drafts.list
+ total.value = drafts.total
+ } finally {
+ loading.value = false
+ }
+}
+
+// ======================== 鏂板/淇敼鑽夌 ========================
+/** 鏂板鎸夐挳鎿嶄綔 */
+const handleAdd = () => {
+ isCreating.value = true
+ newsList.value = [createEmptyNewsItem()]
+ showDialog.value = true
+}
+
+/** 鏇存柊鎸夐挳鎿嶄綔 */
+const onUpdate = (item: Article) => {
+ mediaId.value = item.mediaId
+ newsList.value = JSON.parse(JSON.stringify(item.content.newsItem))
+ isCreating.value = false
+ showDialog.value = true
+}
+
+/** 鎻愪氦鎸夐挳 */
+const onSubmitNewsItem = async () => {
+ isSubmitting.value = true
+ try {
+ if (isCreating.value) {
+ await MpDraftApi.createDraft(accountId.value, newsList.value)
+ message.notifySuccess('鏂板鎴愬姛')
+ } else {
+ await MpDraftApi.updateDraft(accountId.value, mediaId.value, newsList.value)
+ message.notifySuccess('鏇存柊鎴愬姛')
+ }
+ } finally {
+ showDialog.value = false
+ isSubmitting.value = false
+ await getList()
+ }
+}
+
+// ======================== 鑽夌绠卞彂甯� ========================
+const onPublish = async (item: Article) => {
+ const mediaId = item.mediaId
+ const content =
+ '浣犳鍦ㄩ�氳繃鍙戝竷鐨勬柟寮忓彂琛ㄥ唴瀹广�� 鍙戝竷涓嶅崰鐢ㄧ兢鍙戞鏁帮紝涓�澶╁彲澶氭鍙戝竷銆�' +
+ '宸插彂甯冨唴瀹逛笉浼氭帹閫佺粰鐢ㄦ埛锛屼篃涓嶄細灞曠ず鍦ㄥ叕浼楀彿涓婚〉涓�� ' +
+ '鍙戝竷鍚庯紝浣犲彲浠ュ墠寰�鍙戣〃璁板綍鑾峰彇閾炬帴锛屼篃鍙互灏嗗彂甯冨唴瀹规坊鍔犲埌鑷畾涔夎彍鍗曘�佽嚜鍔ㄥ洖澶嶃�佽瘽棰樺拰椤甸潰妯℃澘涓��'
+ try {
+ await message.confirm(content)
+ await MpFreePublishApi.submitFreePublish(accountId.value, mediaId)
+ message.notifySuccess('鍙戝竷鎴愬姛')
+ await getList()
+ } catch {
+ //
+ }
+}
+
+/** 鍒犻櫎鎸夐挳鎿嶄綔 */
+const onDelete = async (item: Article) => {
+ const mediaId = item.mediaId
+ try {
+ await message.confirm('姝ゆ搷浣滃皢姘镐箙鍒犻櫎璇ヨ崏绋�, 鏄惁缁х画?')
+ await MpDraftApi.deleteDraft(accountId.value, mediaId)
+ message.notifySuccess('鍒犻櫎鎴愬姛')
+ await getList()
+ } catch {
+ //
+ }
+}
+</script>
+
+<style lang="scss" scoped>
+.pagination {
+ float: right;
+ margin-right: 25px;
+}
+</style>
--
Gitblit v1.8.0