feat(wechat): upload image to oa

ArtisanCloud · Nov 20, 2023 · f4ba923 · f4ba923
1 parent 07f9c28
commit f4ba923
Show file tree

Hide file tree

Showing 5 changed files with 75 additions and 23 deletions.
diff --git a/index.html b/index.html
@@ -1,15 +1,17 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <link rel="shortcut icon" type="image/x-icon" href="https://unpkg.byted-static.com/latest/byted/arco-config/assets/favicon.ico">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+<head>
+    <meta charset="UTF-8"/>
+    <link rel="shortcut icon" type="image/x-icon"
+          href="https://unpkg.byted-static.com/latest/byted/arco-config/assets/favicon.ico">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+    <meta name="referrer" content="never">
     <title>PowerX Dashboard</title>
     <link rel="stylesheet" href="/css/loading.css">
-  </head>
-  <body>
-    <div id="app">
-      <div class="first-loading-wrp">
+</head>
+<body>
+<div id="app">
+    <div class="first-loading-wrp">
         <div class="loading-wrp">
           <span class="dot dot-spin">
             <i></i>
@@ -19,8 +21,8 @@
           </span>
         </div>
         <h1>PowerX Dashboard</h1>
-      </div>
     </div>
-    <script type="module" src="/src/main.ts"></script>
-  </body>
+</div>
+<script type="module" src="/src/main.ts"></script>
+</body>
 </html>
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -39,7 +39,7 @@
     "@fullcalendar/timegrid": "^6.1.6",
     "@fullcalendar/vue3": "^6.1.6",
     "@vueuse/core": "^9.3.0",
-    "@yaoyaochi/weyui": "^1.3.3",
+    "@yaoyaochi/weyui": "^1.4.0",
     "axios": "^0.24.0",
     "dayjs": "^1.11.7",
     "lodash": "^4.17.21",

diff --git a/src/api/wechat/official-account/media.ts b/src/api/wechat/official-account/media.ts
@@ -1,7 +1,7 @@
 import axios from 'axios';
 import { PrefixUriAdmin } from '@/api';
 
-const UriOAMedia = '/wechat/official-account/medias';
+export const UriOAMedia = '/wechat/official-account/medias';
 
 export interface GetMediaRequest {
   mediaId: string;
@@ -36,3 +36,34 @@ export function GetMediaOtherList(request: GetMediaOtherListRequest) {
     request,
   );
 }
+
+export interface UploadMediaRequest {
+  media: any;
+}
+
+export interface UploadMediaReply {
+  success: boolean;
+  data: any;
+}
+
+export function UploadMedia(request: UploadMediaRequest) {
+  return axios.post<UploadMediaReply>(
+    `${PrefixUriAdmin + UriOAMedia}`,
+    request,
+  );
+}
+
+export interface DeleteMediaRequest {
+  mediaId: string;
+}
+
+export interface DeleteMediaReply {
+  success: boolean;
+  data: any;
+}
+
+export function DeleteMedia(request: DeleteMediaRequest) {
+  return axios.delete<DeleteMediaReply>(
+    `${PrefixUriAdmin + UriOAMedia}/${request.mediaId}`,
+  );
+}
diff --git a/src/views/wechat/official-account/media/index.vue b/src/views/wechat/official-account/media/index.vue
@@ -1,19 +1,20 @@
 <template>
   <div class="content">
     <w-offi-account-media
-      action="/api/wechat/media/uploadOtherMedia"
+      :action="`${PrefixUriAdmin + UriOAMedia}/upload`"
+      :headers="header"
       :media-data="mediaData"
       :total="total"
       :current="current"
       :page-size="pageSize"
-      :page-size-options="[10, 20, 30, 50, 100]"
+      :page-size-options="[5, 10, 20, 30, 50, 100]"
       :tem-url="temUrl"
       @on-down-load="downLoadImage"
-      @on-delete="deleteImg"
+      @on-delete="onDeleteMedia"
       @page-change="pageChange"
       @page-size-change="pageSizeChange"
-      @on-change-tab="onChangeTab"
-      @on-preview="onPreview"
+      @onChangeTab="onChangeTab"
+      @onPreview="onPreview"
     />
   </div>
 </template>
@@ -22,9 +23,17 @@
   import { onMounted, ref } from 'vue';
   import { WOffiAccountMedia } from '@yaoyaochi/weyui';
   import {
+    DeleteMedia,
     GetMedia,
     GetMediaOtherList,
+    UriOAMedia,
   } from '@/api/wechat/official-account/media';
+  import { PrefixUriAdmin } from '@/api';
+  import { getToken } from '@/utils/auth';
+
+  const header = ref<Record<string, any>>({});
+  const token = getToken();
+  header.value.Authorization = `Bearer ${token}`;
 
   const total = ref(0); // 总条数
   const pageSize = ref(10); // 每页条数
@@ -36,10 +45,11 @@
 
   const refreshMediaList = async (type: string) => {
     const res = await GetMediaOtherList({
-      type: dataType.value,
+      type,
       offset: current.value,
       count: pageSize.value,
     });
+    console.log(res);
     mediaData.value.item = res.data.item;
     total.value = res.data.total_count;
   };
@@ -56,6 +66,15 @@
     }
   };
 
+  const onDeleteMedia = async (itemId: string) => {
+    // 删除图片
+    console.log(itemId);
+    const res = await DeleteMedia({ mediaId: itemId });
+    if (res.data.success) {
+      await refreshMediaList(dataType.value);
+    }
+  };
+
   const onChangeTab = async (item: any) => {
     // 切换tab
     dataType.value = item;