2

src/utils/request.js

@@ -8,7 +8,7 @@ import {
 } from 'ant-design-vue';
 import commonJS from './common.js';
 const router = useRouter()
-const baseURL = "http://192.168.1.3:8800"; // 正式环境线上
+const baseURL = "http://123.249.121.26:8801/"; // 正式环境线上
 // const baseURL2 = "https://a.matripe.com.cn/api_stock"; // 正式环境线上
 let protocol = location.protocol
 let trueUrl = protocol == 'http:' ? baseURL : baseURL2

src/views/message/WysiwygEditor.vue

@@ -20,6 +20,7 @@
 import '@wangeditor/editor/dist/css/style.css'
 import { onBeforeUnmount, ref, shallowRef, onMounted, watch } from 'vue'
 import { Editor, Toolbar } from '@wangeditor/editor-for-vue'
+import { uploadImageApi } from "../../api/contentConfig";
 
 const props = defineProps({
   modelValue: {
@@ -51,9 +52,12 @@ const editorConfig = {
 
 editorConfig.MENU_CONF['uploadImage'] = {
   async customUpload(file, insertFn) {
-    const url = await emit('image-upload', file);
-    if (url) {
-      insertFn(url);
+    try {
+      const response = await uploadImageApi(file);
+      const imageUrl = 'http://123.249.121.26:8801/images/' + response.data;
+      insertFn(imageUrl);
+    } catch (error) {
+      console.error('Image upload failed:', error);
     }
   }
 };

src/views/message/content.vue

@@ -20,7 +20,7 @@
               style="margin-right: 5px;"
             />
           </div>
-          <span v-else v-html="record.content"></span>
+          <span v-else v-text="record.content"></span>
         </template>
         <template v-if="column.key === 'status'">
           <a-tag :color="record.status === 1 ? 'green' : 'orange'">
@@ -107,7 +107,7 @@ const columns = [
 ];
 
 const data = reactive([]);
-const classify = ref(0);
+const classify = ref(1);
 
 const formState = reactive({
   id: null,
@@ -163,19 +163,22 @@ const deleteItem = async (record) => {
   }
 };
 
+
+ 
+
 const handleModalOk = async () => {
   try {
     const data = {
       classify: formState.classify,
       title: formState.title,
       content: formState.classify === 1 ? '' : formState.content,
-      img: formState.img,
+      img: processImagePath(formState.img),
       status: formState.status,
     };
     if (modalMode.value === 'add') {
       await saveContentApi(data);
     } else {
-      await updateContentApi({ ...data, id: formState.id });
+      await updateContentApi({ ...data, recordId: formState.id });
     }
     message.success(modalMode.value === 'add' ? '添加成功' : '编辑成功');
     modalVisible.value = false;
@@ -188,6 +191,13 @@ const handleModalOk = async () => {
 const handleModalCancel = () => {
   modalVisible.value = false;
 };
+const processImagePath = (imgPath) => {
+  const urlPrefix = 'http://123.249.121.26:8801/images/';
+  if (imgPath.startsWith(urlPrefix)) {
+    return imgPath.substring(urlPrefix.length);
+  }
+  return imgPath;
+};
 
 const tabChange = (activeKey) => {
   classify.value = activeKey === 'recommendations' ? 1 : activeKey === 'stores' ? 0 : 2;
@@ -217,10 +227,12 @@ const handleImageChange = ({ fileList }) => {
   formState.images = fileList;
 };
 
+
 const handleEditorImageUpload = async (file) => {
   try {
     const response = await uploadImageApi(file);
-    return response.data; // Return the image URL
+    const imageUrl = `http://123.249.121.26:8801/images/${response.data}`;
+    return imageUrl; // 返回完整的图片路径
   } catch (error) {
     message.error('图片上传失败');
     return '';
@@ -239,7 +251,13 @@ const getBase64 = (file) => {
 const fetchData = async () => {
   try {
     const response = await getContentListApi(1, 10, classify.value);
-    data.splice(0, data.length, ...response.data.records);
+    const records = response.data.records.map(record => {
+      if (record.img) {
+        record.img = 'http://123.249.121.26:8801/images/' + record.img;
+      }
+      return record;
+    });
+    data.splice(0, data.length, ...records);
   } catch (error) {
     message.error('获取数据失败');
   }

src/views/message/index.vue

@@ -7,13 +7,24 @@
     <a-table :columns="columns" :data-source="data" :rowKey="record => record.id">
       <template #bodyCell="{ column, record }">
         <template v-if="column.key === 'img'">
-          <a-image
-            :src="record.img"
-            :width="50"
-            :height="50"
-            style="margin-right: 5px;"
-          />
-        </template>
+      <template v-if="record.img.endsWith('.mp4')">
+        <video
+          :src="record.img"
+          :width="50"
+          :height="50"
+          style="margin-right: 5px;"
+          controls
+        />
+      </template>
+      <template v-else>
+        <a-image
+          :src="record.img"
+          :width="50"
+          :height="50"
+          style="margin-right: 5px;"
+        />
+      </template>
+    </template>
         <template v-if="column.key === 'status'">
           <a-tag :color="record.status === 1 ? 'green' : 'red'">
             {{ record.status === 1 ? '启用' : '不启用' }}
@@ -145,7 +156,7 @@ const handleModalOk = async () => {
 
       await saveCarouselApi(data);
     } else {
-      await updateCarouselApi({ ...data, id: formState.id });
+      await updateCarouselApi({ ...data, recordId: formState.id });
     }
     message.success(modalMode.value === 'add' ? '添加成功' : '编辑成功');
     modalVisible.value = false;
@@ -198,7 +209,14 @@ const getBase64 = (file) => {
 const fetchData = async () => {
   try {
     const response = await getCarouselListApi(1);
-    data.splice(0, data.length, ...response.data.records);
+    // data.splice(0, data.length, ...response.data.records);
+    const records = response.data.records.map(record => {
+      if (record.img) {
+        record.img = 'http://123.249.121.26:8801/images/' + record.img;
+      }
+      return record;
+    });
+    data.splice(0, data.length, ...records);
   } catch (error) {
     message.error('获取数据失败');
   }