1. 首次保存后进入编辑页面 2. 修复图片上传问题

src/api/message/sysnotion-config.ts

@@ -1,5 +1,5 @@
 import { http } from '@/utils/http/axios';
-import { RuleFormAdd } from '@/views/message/sysnotion-config/type';
+import { RuleFormAdd, RuleFormView } from '@/views/message/sysnotion-config/type';
 // export interface queryReportConfigListParams {
 //   content?: string;
 //   title?: string;
@@ -22,7 +22,7 @@ export function confirmReportConfig(id: number) {
   });
 }
 export function viewSystemMessage(id: number) {
-  return http.request({
+  return http.request<RuleFormView>({
     url: `/systemMessage/viewSystemMessage?id=${id}`,
     method: 'get',
   });

src/views/message/sysnotion-config/SysnotionConfig.vue

@@ -30,7 +30,7 @@
 
 <script lang="ts" setup>
   import { useRoute, useRouter } from 'vue-router';
-  import { ref, reactive, onMounted, computed } from 'vue';
+  import { ref, reactive, onMounted } from 'vue';
   import { storeToRefs } from 'pinia';
   import { ElMessage } from 'element-plus';
   import { useUserStore } from '@/store/modules/user';
@@ -40,7 +40,7 @@
     updateSystemMessage,
     viewSystemMessage,
   } from '@/api/message/sysnotion-config';
-  import { RuleFormView, MessageTypeEnum, ContentTypeEnum, RuleFormAdd } from './type';
+  import { RuleFormView, MessageTypeEnum, ContentTypeEnum, RuleFormAdd, SysMessageStatus } from './type';
   import BasicInfo from './compontents/BasicInfo.vue';
   import ContentConfig from './compontents/ContentConfig.vue';
   import RightCard from './compontents/RightCard.vue';
@@ -64,6 +64,7 @@
     content: '',
     contentUrl: '',
     operator: info.value.nickname,
+    status: SysMessageStatus.DRAFT
   });
 
   // 原始数据副本
@@ -76,32 +77,27 @@
     router.back();
   };
   const route = useRoute();
-  const sysId = route.query.id;
-  onMounted(() => {
-    if (sysId) {
+  const sysId = Number(route.query.id as string);
+
+  const fetchSystemMessage = async () => {
+    const messageId = sysId || ruleForm.id
+
+    // 查看 或 编辑状态
+    if (messageId) {
       isDisabled.value = true;
-      viewSystemMessage(Number(sysId)).then((res) => {
-        if (!res?.status) {
-          isDisabled.value = false;
-        }
-        ruleForm.id = Number(sysId);
-        ruleForm.title = res.title;
-        ruleForm.introduction = res.introduction ? res.introduction : '';
-        ruleForm.messageType = res.messageType;
-        ruleForm.content = res.content ? res.content : ' ';
-        ruleForm.pushChannel = res.pushChannel;
-        ruleForm.recipientType = res.recipientType;
+      const res = await viewSystemMessage(messageId);
+      if (res.status === SysMessageStatus.DRAFT) {
+        isDisabled.value = false;
+      }
 
-        if (res.recipientType === 2) {
-          // 若选择分组
-          ruleForm.userGroupList = res.userGroupList;
-        } else if (res.recipientType === 3) {
-          // 若选择自定义
-          ruleForm.customUserList = res.customUserList;
-        }
+      ruleForm.id = messageId;
+      Object.entries(res).forEach(([key, value]) => {
+          ruleForm[key] = value;
       });
+      
     }
-  });
+  };
+
 
   // 取消
   const onCancel = () => {
@@ -132,38 +128,31 @@
     //   })
   };
 
+
   // 暂存
   const onSave = async () => {
     // to save dada
     const baseInfoData = await basicInfoRef.value?.validate();
     const contentConfigData = contentConfigRef.value?.buildFormdata();
-    console.log('baseInfoData', baseInfoData);
-    console.log('contentConfigData', contentConfigData);
 
     const params: RuleFormAdd = {
       ...baseInfoData!,
       ...contentConfigData,
     };
     delete params.operator;
+    delete params.status;
 
+    const messageId = sysId || ruleForm.id;
+
+    if (!messageId) {
+      ruleForm.id = await addSystemMessage(params);
+      ElMessage.success('暂存成功!');
+      await router.replace(`/message/sysnotion-config?id=${ruleForm.id}`)
+      fetchSystemMessage();
 
-    if (!sysId) {
-      addSystemMessage(params).then((res) => {
-        if (res) {
-          ruleForm.id = res;
-          ElMessage({
-            message: '暂存成功!',
-            type: 'success',
-          });
-        }
-      });
     } else {
-      updateSystemMessage(params).then(() => {
-        ElMessage({
-            message: '编辑成功!',
-            type: 'success',
-        });
-      });
+      await updateSystemMessage(params)
+      ElMessage.success('编辑成功!');
     }
   };
 
@@ -180,7 +169,7 @@
         message: '下发成功!',
         type: 'success',
       });
-      router.back();
+      router.push('/message/systemNotifications');
     });
   };
 
@@ -194,6 +183,11 @@
     }
     return diff;
   };
+
+
+  onMounted(() => {
+    fetchSystemMessage();
+  });
 </script>
 
 <style lang="scss" scoped>

src/views/message/sysnotion-config/compontents/BasicInfo.vue

@@ -34,17 +34,22 @@
         prop="bannerUrl"
         v-if="ruleForm.messageType === MessageTypeEnum.BANNER"
       >
+        <img v-if="ruleForm.bannerUrl" :src="ruleForm.bannerUrl" class="avatar" />
         <el-upload
+          v-else
           class="avatar-uploader"
           :action="actionUrl"
+          :headers="getHeaders()"
+          :data="{ bizType: 'PROBLEM_REPORT' }"
           :show-file-list="false"
           :on-success="handleAvatarSuccess"
           :before-upload="beforeAvatarUpload"
         >
-          <img v-if="ruleForm.bannerUrl" :src="ruleForm.bannerUrl" class="avatar" />
-          <el-icon v-else class="avatar-uploader-icon"><Plus /></el-icon>
+          <el-icon class="avatar-uploader-icon"><Plus /></el-icon>
         </el-upload>
       </el-form-item>
+
+
       <el-form-item label="推送渠道: " prop="pushChannel">
         <el-checkbox-group v-model="ruleForm.pushChannel">
           <el-checkbox
@@ -88,6 +93,8 @@
   import { messageTypeOptions, pushChannelName } from '../../constant';
   import urlJoin from 'url-join';
   import { useGlobSetting } from '@/hooks/setting';
+  import { getHeaders } from '@/utils/http/axios';
+
   const { urlPrefix } = useGlobSetting();
   interface Props {
     dataSoure: RuleFormView;
@@ -97,7 +104,7 @@
   const labelPosition = ref<FormProps['labelPosition']>('left');
   const childFromRef = ref<InstanceType<typeof PushObject>>();
   const actionUrl = computed(() => {
-    return urlJoin(urlPrefix!, `/skyeye-file-upload/upload`);
+    return urlJoin(urlPrefix!, `/issue/uploadPicture`);
   });
 
   /**
@@ -162,8 +169,10 @@
     }
   };
 
-  const handleAvatarSuccess: UploadProps['onSuccess'] = (response, uploadFile) => {
-    ruleForm.value.bannerUrl = URL.createObjectURL(uploadFile.raw!);
+  const handleAvatarSuccess: UploadProps['onSuccess'] = (response) => {
+    // 注意，这里 response 是 没有被拦截处理
+    ruleForm.value.bannerUrl = response.data.url;
+    console.log(ruleForm.value);
   };
 
   const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => {

src/views/message/sysnotion-config/type.ts

@@ -24,6 +24,11 @@ export interface ObjectFrom {
 
 export interface RuleFormBase {
   id?: number;
+  // 操作人
+  operator?: string;
+  // 消息状态
+  status?: SysMessageStatus;
+
   /**
    * 基础信息配置
    */
@@ -52,7 +57,6 @@ export interface RuleFormBase {
   // 内容详情内容，如果填写链接（二选一）
   contentUrl?: string;
   // 操作人
-  operator?: string;
 }
 
 export interface RuleFormView extends RuleFormBase {
@@ -60,6 +64,7 @@ export interface RuleFormView extends RuleFormBase {
   userGroupList?: GroupList[];
   // 推送对象，如果选择 自定义类型
   customUserList?: UserList[];
+
 }
 
 
@@ -80,3 +85,10 @@ export enum MessageTypeEnum {
   BANNER = 1,
   TEXT = 2,
 }
+
+export enum SysMessageStatus {
+  // 草稿，未发布
+  DRAFT = 0,
+  // 已发布，已推送
+  PUBLISHED = 1
+}