From f9381e74edf64cb7dad44227003aecd47d927d40 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A4=9A=E5=95=A6C=E6=A2=A6?= <15709267061@163.com>
Date: Thu, 24 Apr 2025 19:17:53 +0800
Subject: [PATCH] update

---
 src/api/admin.js                              | 56 +++++++++++++
 src/components/upload/UploadAvatar.vue        | 74 +++++++++++++++++
 src/components/upload/UploadOne.vue           | 60 ++++++++++++--
 .../components/EditQR.vue                     | 36 +++++++--
 .../components/QRCode.vue                     | 14 ++--
 .../components/tabs/FrequentlyQuestions.vue   |  8 +-
 .../SecondaryClassificationManagement.vue     | 79 ++++++++++++++-----
 .../AddSecondaryClassificationManagement.vue  | 42 ++++++++--
 src/utils/request.js                          |  4 +-
 9 files changed, 323 insertions(+), 50 deletions(-)
 create mode 100644 src/components/upload/UploadAvatar.vue

diff --git a/src/api/admin.js b/src/api/admin.js
index 2ef53b6..a8a5e55 100644
--- a/src/api/admin.js
+++ b/src/api/admin.js
@@ -391,6 +391,62 @@ const admin = {
             data: data
         });
     },
+    getQRList: async (data) => {
+        return request({
+            url: '/admin/qrcode/getList',
+            method: Method.POST,
+            data: data
+        });
+    },
+    editQRList: async (data) => {
+        return request({
+            url: '/admin/qrcode/edit',
+            method: Method.POST,
+            data: data
+        });
+    },
+    getArticleCategoryList: async (data) => {
+        return request({
+            url: '/admin/articleCategory/getList',
+            method: Method.POST,
+            data: data
+        });
+    },
+    addArticleCategory: async (data) => {
+        return request({
+            url: '/admin/articleCategory/add',
+            method: Method.POST,
+            data: data
+        });
+    },
+    detailArticleCategory: async (data) => {
+        return request({
+            url: '/admin/articleCategory/detail',
+            method: Method.POST,
+            data: data
+        });
+    },
+    editArticleCategory: async (data) => {
+        return request({
+            url: '/admin/articleCategory/edit',
+            method: Method.POST,
+            data: data
+        });
+    },
+    delArticle: async (id) => {
+        return request({
+            url: '/admin/articleCategory/del',
+            method: Method.POST,
+            data: {id}
+        });
+    },
+    weighArticleCategory: async (data) => {
+        return request({
+            url: '/admin/articleCategory/weigh',
+            method: Method.POST,
+            data: data
+        });
+    },
 }
 
 export default admin;
diff --git a/src/components/upload/UploadAvatar.vue b/src/components/upload/UploadAvatar.vue
new file mode 100644
index 0000000..d9ecd84
--- /dev/null
+++ b/src/components/upload/UploadAvatar.vue
@@ -0,0 +1,74 @@
+<script setup>
+import {ref} from "vue";
+import {BASEURL} from "../../utils/request.js";
+import {useUserStore} from "../../pinia/UserStore/index.js";
+
+const UserStore = useUserStore();
+const file = ref();
+const url = defineModel();
+
+const onChange = (_, currentFile) => {
+    if (currentFile.value.response && currentFile.value.response?.data) url.value = currentFile.value.response?.data;
+    file.value = {
+        ...currentFile,
+        // url: URL.createObjectURL(currentFile.file),
+    };
+};
+const onProgress = (currentFile) => {
+    file.value = currentFile;
+};
+</script>
+
+<template>
+    {{ url }}
+    <a-upload
+        :action="BASEURL + '/admin/upload/upload'"
+        :fileList="file ? [file] : []"
+        :show-file-list="false"
+        :headers="{
+            'Access-Token': UserStore.token
+        }"
+        @change="onChange"
+        @progress="onProgress"
+    >
+        <template #upload-button>
+            <div
+                :class="`arco-upload-list-item${
+            file && file.status === 'error' ? ' arco-upload-list-item-error' : ''
+          }`"
+            >
+                <div
+                    class="arco-upload-list-picture custom-upload-avatar"
+                    v-if="file && file.url"
+                >
+                    <img :src="file.url"/>
+                    <div class="arco-upload-list-picture-mask">
+                        <IconEdit/>
+                    </div>
+                    <a-progress
+                        v-if="file.status === 'uploading' && file.percent < 100"
+                        :percent="file.percent"
+                        type="circle"
+                        size="mini"
+                        :style="{
+                position: 'absolute',
+                left: '50%',
+                top: '50%',
+                transform: 'translateX(-50%) translateY(-50%)',
+              }"
+                    />
+                </div>
+                <div class="arco-upload-picture-card" v-else>
+                    <div class="arco-upload-picture-card-text">
+                        <IconPlus/>
+                        <div style="margin-top: 10px; font-weight: 600">Upload</div>
+                    </div>
+                </div>
+            </div>
+        </template>
+    </a-upload>
+</template>
+
+<style scoped lang="scss">
+
+</style>
diff --git a/src/components/upload/UploadOne.vue b/src/components/upload/UploadOne.vue
index 44ac096..bda8bcc 100644
--- a/src/components/upload/UploadOne.vue
+++ b/src/components/upload/UploadOne.vue
@@ -1,6 +1,12 @@
 <script setup>
 import Api from "../../api/index.js";
 
+const {size} = defineProps({
+    size: {
+        type: String,
+        default: '100%'
+    }
+});
 const emits = defineEmits(['success']);
 const files = defineModel('file');
 
@@ -14,13 +20,57 @@ const beforeUpload = (file) => {
 </script>
 
 <template>
-    <a-upload draggable @before-upload="beforeUpload">
-        <template #upload-button v-if="files">
-            <a-image :src="files"></a-image>
-        </template>
-    </a-upload>
+    <div class="x-upload-one">
+        <a-upload draggable @before-upload="beforeUpload">
+            <template #upload-button v-if="files">
+                <div class="x-upload-one-image">
+                    <a-image :preview="false" :src="files"></a-image>
+                </div>
+            </template>
+        </a-upload>
+    </div>
 </template>
 
 <style scoped lang="scss">
+.x-upload-one {
+    width: v-bind(size);
+    height: v-bind(size);
 
+    :deep(.arco-upload-wrapper) {
+        width: v-bind(size);
+        height: v-bind(size);
+
+        .x-upload-one-image {
+            @apply border;
+            width: v-bind(size);
+            height: v-bind(size);
+            display: flex;
+            align-items: center;
+            justify-content: center;
+        }
+
+        .arco-upload {
+            width: v-bind(size);
+            height: v-bind(size);
+
+            .arco-upload-drag {
+                padding: 0;
+                width: v-bind(size);
+                height: v-bind(size);
+                display: flex;
+                flex-direction: column;
+                align-items: center;
+                justify-content: center;
+
+                .arco-upload-drag-text {
+                    padding: 0 5px;
+                }
+
+                svg {
+                    margin-bottom: 0;
+                }
+            }
+        }
+    }
+}
 </style>
diff --git a/src/pages/manage/pages/manage-expert-management/components/EditQR.vue b/src/pages/manage/pages/manage-expert-management/components/EditQR.vue
index 4befc2a..c0c782b 100644
--- a/src/pages/manage/pages/manage-expert-management/components/EditQR.vue
+++ b/src/pages/manage/pages/manage-expert-management/components/EditQR.vue
@@ -1,14 +1,33 @@
 <script setup>
-import {ref} from 'vue';
+import {reactive, ref, watch} from 'vue';
+import UploadOne from "../../../../../components/upload/UploadOne.vue";
+import Api from "../../../../../api/index.js";
+import {Message} from "@arco-design/web-vue";
 
-const {title} = defineProps({
-    title: {
-        type: String,
-        default: '二维码'
+const emits = defineEmits(['success']);
+const {detail} = defineProps({
+    detail: {
+        type: Object,
+        default: {}
     }
 });
 
 const visible = ref(false);
+const form = reactive({
+    qrcode: null,
+    position_text: null,
+});
+watch(
+    () => visible.value,
+    (val) => {
+        if (val) Object.assign(form, detail)
+    }
+)
+const edit = async () => {
+    const {msg} = await Api.admin.editQRList(form);
+    Message.success(msg);
+    emits('success');
+}
 </script>
 
 <template>
@@ -16,15 +35,16 @@ const visible = ref(false);
 
     <a-modal
         ok-text="提交"
-        :title="title"
+        @ok="edit"
+        title="二维码"
         title-align="start"
         v-model:visible="visible">
         <a-form>
             <a-form-item label="位置">
-                <a-input placeholder="首页/添加客服&我的/联系客服"></a-input>
+                <a-input v-model:model-value="form.position_text" disabled></a-input>
             </a-form-item>
             <a-form-item label="二维码">
-                <a-upload></a-upload>
+                <upload-one size="100px" v-model:file="form.qrcode"></upload-one>
             </a-form-item>
         </a-form>
     </a-modal>
diff --git a/src/pages/manage/pages/manage-expert-management/components/QRCode.vue b/src/pages/manage/pages/manage-expert-management/components/QRCode.vue
index 45e04f5..2dec0e5 100644
--- a/src/pages/manage/pages/manage-expert-management/components/QRCode.vue
+++ b/src/pages/manage/pages/manage-expert-management/components/QRCode.vue
@@ -12,7 +12,7 @@ const columns = [
     },
     {
         title: '位置',
-        dataIndex: 'key',
+        dataIndex: 'position_text',
     },
     {
         title: '二维码',
@@ -34,9 +34,9 @@ const vo = reactive({
     total: 0,
 });
 
-const {loading, pagination, initFetchData} = useTableQuery({
+const {loading, pagination, fetchData} = useTableQuery({
     parameter: po,
-    api: Api.system.getData,
+    api: Api.admin.getQRList,
     callback: (data) => {
         Object.assign(vo, data);
     }
@@ -52,15 +52,15 @@ const {loading, pagination, initFetchData} = useTableQuery({
         :data="vo.rows"
         :columns="columns"
         class="flex-grow mt-[20px] w-full">
-        <template v-slot:qrcode>
+        <template v-slot:qrcode="{record}">
             <a-image
                 width="48px"
                 height="48px"
-                src="https://p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/a8c8cdb109cb051163646151a4a5083b.png~tplv-uwbnlip3yd-webp.webp">
+                :src="record.qrcode">
             </a-image>
         </template>
-        <template v-slot:action>
-            <EditQR></EditQR>
+        <template v-slot:action="{record}">
+            <EditQR :detail="record" @success="fetchData"></EditQR>
         </template>
     </a-table>
 </template>
diff --git a/src/pages/manage/pages/manage-expert-management/components/tabs/FrequentlyQuestions.vue b/src/pages/manage/pages/manage-expert-management/components/tabs/FrequentlyQuestions.vue
index 3f12483..5c637e9 100644
--- a/src/pages/manage/pages/manage-expert-management/components/tabs/FrequentlyQuestions.vue
+++ b/src/pages/manage/pages/manage-expert-management/components/tabs/FrequentlyQuestions.vue
@@ -57,9 +57,9 @@ const vo = reactive({
     total: 0,
 });
 
-const {loading, pagination, initFetchData} = useTableQuery({
+const {loading, pagination, fetchData} = useTableQuery({
     parameter: po,
-    api: Api.system.getData,
+    api: Api.admin.getArticlevategoryList,
     callback: (data) => {
         Object.assign(vo, data);
     }
@@ -67,7 +67,9 @@ const {loading, pagination, initFetchData} = useTableQuery({
 </script>
 
 <template>
-    <AddFrequentlyQuestions></AddFrequentlyQuestions>
+    <AddFrequentlyQuestions
+        @success="fetchData">
+    </AddFrequentlyQuestions>
 
     <a-table
         :loading="loading"
diff --git a/src/pages/manage/pages/manage-expert-management/components/tabs/SecondaryClassificationManagement.vue b/src/pages/manage/pages/manage-expert-management/components/tabs/SecondaryClassificationManagement.vue
index 0a29d01..4b11a61 100644
--- a/src/pages/manage/pages/manage-expert-management/components/tabs/SecondaryClassificationManagement.vue
+++ b/src/pages/manage/pages/manage-expert-management/components/tabs/SecondaryClassificationManagement.vue
@@ -4,15 +4,16 @@ import {reactive} from "vue";
 import useTableQuery from "../../../../../../hooks/useTableQuery.js";
 import Api from "../../../../../../api/index.js";
 import AddSecondaryClassificationManagement from "./components/AddSecondaryClassificationManagement.vue";
+import {Message} from "@arco-design/web-vue";
 
 const columns = [
     {
         title: 'ID',
-        dataIndex: 'key',
+        dataIndex: 'id',
     },
     {
         title: '二级分类名称',
-        dataIndex: 'key',
+        dataIndex: 'name',
     },
     {
         title: '排序',
@@ -28,7 +29,8 @@ const columns = [
     },
 ];
 
-const po = reactive({});
+const po1 = reactive({pid: 1});
+const po2 = reactive({pid: 2});
 const vo1 = reactive({
     page: '',
     rows: [],
@@ -40,21 +42,28 @@ const vo2 = reactive({
     total: 0,
 });
 
-const {loading: loading1, pagination: pagination1, initFetchData: initFetchData1} = useTableQuery({
-    parameter: po,
-    api: Api.system.getData,
+const {loading: loading1, pagination: pagination1, fetchData: fetchData1} = useTableQuery({
+    parameter: po1,
+    api: Api.admin.getArticleCategoryList,
     callback: (data) => {
         Object.assign(vo1, data);
     }
 });
 
-const {loading: loading2, pagination: pagination2, initFetchData: initFetchData2} = useTableQuery({
-    parameter: po,
-    api: Api.system.getData,
+const {loading: loading2, pagination: pagination2, fetchData: fetchData2} = useTableQuery({
+    parameter: po2,
+    api: Api.admin.getArticleCategoryList,
     callback: (data) => {
         Object.assign(vo2, data);
     }
 });
+
+const del = async (id) => {
+    const {msg} = await Api.admin.delArticle(id);
+    Message.success(msg);
+    await fetchData1();
+    await fetchData2();
+}
 </script>
 
 <template>
@@ -63,7 +72,11 @@ const {loading: loading2, pagination: pagination2, initFetchData: initFetchData2
             <div class="flex justify-between">
                 <div class="title">常见问题</div>
 
-                <AddSecondaryClassificationManagement :max-class="1"></AddSecondaryClassificationManagement>
+                <AddSecondaryClassificationManagement
+                    @success="fetchData1"
+                    :pid="1"
+                    :max-class="1">
+                </AddSecondaryClassificationManagement>
             </div>
 
             <a-table
@@ -73,15 +86,25 @@ const {loading: loading2, pagination: pagination2, initFetchData: initFetchData2
                 :loading="loading1"
                 :columns="columns"
                 class="w-full h-full">
-                <template v-slot:sort>
-                    <SequenceAdjustment></SequenceAdjustment>
+                <template v-slot:sort="{record}">
+                    <SequenceAdjustment
+                        :id="record.id"
+                        @success="fetchData1"
+                        :api="Api.admin.weighArticleCategory">
+                    </SequenceAdjustment>
                 </template>
-                <template v-slot:action>
+                <template v-slot:action="{record}">
                     <div class="flex gap-[10px]">
-                        <AddSecondaryClassificationManagement :max-class="1">
+                        <AddSecondaryClassificationManagement
+                            @success="fetchData1"
+                            :detail="record"
+                            :pid="1"
+                            :max-class="1">
                             <a-link :hoverable="false">编辑</a-link>
                         </AddSecondaryClassificationManagement>
-                        <a-link :hoverable="false" status="danger">删除</a-link>
+                        <a-popconfirm content="确定删除吗?" @ok="del(record.id)">
+                            <a-link :hoverable="false" status="danger">删除</a-link>
+                        </a-popconfirm>
                     </div>
                 </template>
             </a-table>
@@ -91,7 +114,11 @@ const {loading: loading2, pagination: pagination2, initFetchData: initFetchData2
             <div class="flex justify-between">
                 <div class="title">基础教学</div>
 
-                <AddSecondaryClassificationManagement :max-class="2"></AddSecondaryClassificationManagement>
+                <AddSecondaryClassificationManagement
+                    @success="fetchData2"
+                    :pid="2"
+                    :max-class="2">
+                </AddSecondaryClassificationManagement>
             </div>
 
             <a-table
@@ -101,15 +128,25 @@ const {loading: loading2, pagination: pagination2, initFetchData: initFetchData2
                 :loading="loading2"
                 :columns="columns"
                 class="w-full h-full">
-                <template v-slot:sort>
-                    <SequenceAdjustment></SequenceAdjustment>
+                <template v-slot:sort="{record}">
+                    <SequenceAdjustment
+                        :id="record.id"
+                        @success="fetchData2"
+                        :api="Api.admin.weighArticleCategory">
+                    </SequenceAdjustment>
                 </template>
-                <template v-slot:action>
+                <template v-slot:action="{record}">
                     <div class="flex gap-[10px]">
-                        <AddSecondaryClassificationManagement :max-class="2">
+                        <AddSecondaryClassificationManagement
+                            @success="fetchData2"
+                            :detail="record"
+                            :pid="2"
+                            :max-class="2">
                             <a-link :hoverable="false">编辑</a-link>
                         </AddSecondaryClassificationManagement>
-                        <a-link :hoverable="false" status="danger">删除</a-link>
+                        <a-popconfirm content="确定删除吗?" @ok="del(record.id)">
+                            <a-link :hoverable="false" status="danger">删除</a-link>
+                        </a-popconfirm>
                     </div>
                 </template>
             </a-table>
diff --git a/src/pages/manage/pages/manage-expert-management/components/tabs/components/AddSecondaryClassificationManagement.vue b/src/pages/manage/pages/manage-expert-management/components/tabs/components/AddSecondaryClassificationManagement.vue
index b174c76..ca92fbe 100644
--- a/src/pages/manage/pages/manage-expert-management/components/tabs/components/AddSecondaryClassificationManagement.vue
+++ b/src/pages/manage/pages/manage-expert-management/components/tabs/components/AddSecondaryClassificationManagement.vue
@@ -1,20 +1,34 @@
 <script setup>
 import XSelect from "../../../../../../../components/XSelect/index.vue";
-import {reactive, ref} from "vue";
+import {reactive, ref, watch} from "vue";
+import Api from "../../../../../../../api/index.js";
+import {Message} from "@arco-design/web-vue";
 
-const {maxClass} = defineProps({
-    maxClass: {
+const emits = defineEmits(['success']);
+const {maxClass, pid, detail} = defineProps({
+    pid: {
         type: Number,
         default: 1,
+    },
+    detail: {
+        type: Object,
+        default: {},
     }
 });
 
 const visible = ref(false);
 
 const form = reactive({
-    title: null,
+    name: null,
 });
 
+watch(
+    () => visible.value,
+    (val) => {
+        if (val) Object.assign(form, detail);
+    }
+)
+
 const getData = async () => {
     return new Promise((resolve) => {
         resolve({
@@ -31,6 +45,23 @@ const getData = async () => {
         });
     })
 }
+
+const success = async () => {
+    if (detail.id) {
+        const {msg} = await Api.admin.editArticleCategory({
+            pid,
+            ...form,
+        });
+        Message.success(msg);
+    } else {
+        const {msg} = await Api.admin.addArticleCategory({
+            pid,
+            ...form,
+        });
+        Message.success(msg);
+    }
+    emits('success');
+}
 </script>
 
 <template>
@@ -46,6 +77,7 @@ const getData = async () => {
 
 
     <a-modal
+        @ok="success"
         title="新增二级分类"
         title-align="start"
         v-model:visible="visible">
@@ -61,7 +93,7 @@ const getData = async () => {
                 </XSelect>
             </a-form-item>
             <a-form-item label="二级分类名称">
-                <a-input v-model:model-value="form.title" placeholder="请输入二级分类名称"></a-input>
+                <a-input v-model:model-value="form.name" placeholder="请输入二级分类名称"></a-input>
             </a-form-item>
         </a-form>
     </a-modal>
diff --git a/src/utils/request.js b/src/utils/request.js
index e76c71f..c6d18df 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -3,9 +3,11 @@ import AESCrypto from "./AESCrypto.js";
 import {Message} from '@arco-design/web-vue';
 import {useUserStore} from "../pinia/UserStore/index.js";
 
+export const BASEURL = import.meta.env.MODE === 'development' ? '/baseApi' : import.meta.env.VITE_API_URL;
+
 // 创建 Axios 实例
 const request = axios.create({
-    baseURL: import.meta.env.MODE === 'development' ? '/baseApi' : import.meta.env.VITE_API_URL, // 替换为你的基础 URL
+    baseURL: BASEURL, // 替换为你的基础 URL
     timeout: 10000, // 请求超时设置
 });