fix: 消息通知接口联调，页面跳转

spring

昨天 25975d7ec42b1691512ff6f29041bd3bd1a4a1e3

fix: 消息通知接口联调，页面跳转

 src/api/system/message.js

@@ -10,19 +10,20 @@
}

// 查询未读消息数量
export function getUnreadCount() {
export function getUnreadCount(consigneeId) {
  return request({
    url: "/system/notice/getCount",
    method: "get",
    params: { consigneeId },
  });
}

// 标记消息为已读
export function markAsRead(noticeId) {
export function markAsRead(noticeId, status) {
  return request({
    url: "/system/notice/markAsRead",
    method: "post",
    data: { noticeId },
    url: "/system/notice",
    method: "put",
    data: { noticeId, status },
  });
}

@@ -37,8 +38,8 @@
// 确认消息
export function confirmMessage(noticeId, status) {
  return request({
    url: "/system/notice/confirm",
    method: "post",
    url: "/system/notice",
    method: "put",
    data: { noticeId, status },
  });
}

 src/layout/components/Navbar.vue

@@ -344,6 +344,7 @@
    }

  }

}



</style>



<style lang="scss">

@@ -358,4 +359,7 @@
    padding: 0 !important;

  }

}

.el-badge__content.is-fixed{

  top: 12px;

}

</style>


 src/layout/components/NotificationCenter/index.vue

@@ -25,12 +25,12 @@
                </el-icon>
              </div>
              <div class="notification-content-wrapper">
                <div class="notification-title">{{ item.title }}</div>
                <div class="notification-detail">{{ item.content }}</div>
                <div class="notification-title">{{ item.noticeTitle }}</div>
                <div class="notification-detail">{{ item.noticeContent }}</div>
                <div class="notification-time">{{ item.createTime }}</div>
              </div>
              <div class="notification-action">
                <el-button type="primary" size="small" @click="handleConfirm(item.id)">
                <el-button type="primary" size="small" @click="handleConfirm(item)">
                  确认
                </el-button>
              </div>
@@ -53,8 +53,8 @@
                </el-icon>
              </div>
              <div class="notification-content-wrapper">
                <div class="notification-title">{{ item.title }}</div>
                <div class="notification-detail">{{ item.content }}</div>
                <div class="notification-title">{{ item.noticeTitle }}</div>
                <div class="notification-detail">{{ item.noticeContent }}</div>
                <div class="notification-time">{{ item.createTime }}</div>
              </div>
            </div>
@@ -82,7 +82,11 @@
import { Bell } from '@element-plus/icons-vue'
import { listMessage, markAsRead, markAllAsRead, confirmMessage, getUnreadCount } from '@/api/system/message'
import { ElMessage } from 'element-plus'
import useUserStore from '@/store/modules/user'
import { useRouter } from 'vue-router'

const userStore = useUserStore()
const router = useRouter()
const emit = defineEmits(['unreadCountChange'])

const activeTab = ref('unread')
@@ -96,19 +100,25 @@
// 加载消息列表
const loadMessages = async () => {
  try {
    const consigneeId = userStore.id
    if (!consigneeId) {
      console.warn('未获取到当前登录用户ID')
      return
    }
    const params = {
      consigneeId: consigneeId,
      pageNum: pageNum.value,
      pageSize: pageSize.value,
      isRead: activeTab.value === 'read' ? 1 : 0
      status: activeTab.value === 'read' ? 1 : 0
    }
    const res = await listMessage(params)
    if (res.code === 200) {
      if (activeTab.value === 'unread') {
        unreadList.value = res.rows || []
        unreadList.value = res.data.records || []
      } else {
        readList.value = res.rows || []
        readList.value = res.data.records || []
      }
      total.value = res.total || 0
      total.value = res.data.total || 0
    }
  } catch (error) {
    console.error('加载消息列表失败:', error)
@@ -118,7 +128,12 @@
// 加载未读数量
const loadUnreadCount = async () => {
  try {
    const res = await getUnreadCount()
    const consigneeId = userStore.id
    if (!consigneeId) {
      console.warn('未获取到当前登录用户ID')
      return
    }
    const res = await getUnreadCount(consigneeId)
    if (res.code === 200) {
      unreadCount.value = res.data || 0
      emit('unreadCountChange', unreadCount.value)
@@ -135,16 +150,42 @@
}

// 确认消息
const handleConfirm = async (messageId) => {
const handleConfirm = async (item) => {
  try {
    const res = await confirmMessage(messageId, 1)
    console.log('item', item)
    const res = await confirmMessage(item.noticeId, 1)
    if (res.code === 200) {
      ElMessage.success('确认成功')
      // 标记为已读
      await markAsRead(messageId)
      // 重新加载数据
      loadMessages()
      loadUnreadCount()
      
      // 根据 jumpPath 进行页面跳转
      if (item.jumpPath) {
        try {
          // 解析 jumpPath，分离路径和查询参数
          const [path, queryString] = item.jumpPath.split('?')
          let query = {}
          
          if (queryString) {
            // 解析查询参数
            queryString.split('&').forEach(param => {
              const [key, value] = param.split('=')
              if (key && value) {
                query[key] = decodeURIComponent(value)
              }
            })
          }
          
          // 跳转到指定页面
          router.push({
            path: path,
            query: query
          })
        } catch (error) {
          console.error('页面跳转失败:', error)
        }
      }
    }
  } catch (error) {
    console.error('确认消息失败:', error)

 src/views/collaborativeApproval/approvalProcess/index.vue

@@ -7,6 +7,8 @@
      <el-tab-pane label="出差管理" name="3"></el-tab-pane>
      <el-tab-pane label="报销管理" name="4"></el-tab-pane>
      <el-tab-pane label="采购审批" name="5"></el-tab-pane>
      <el-tab-pane label="报价审批" name="6"></el-tab-pane>
      <el-tab-pane label="出库审批" name="7"></el-tab-pane>
    </el-tabs>
    
    <div class="search_form">
@@ -62,12 +64,14 @@
import { Search } from "@element-plus/icons-vue";
import {onMounted, ref, computed, reactive, toRefs, nextTick, getCurrentInstance} from "vue";
import {ElMessageBox} from "element-plus";
import { useRoute } from 'vue-router';
import InfoFormDia from "@/views/collaborativeApproval/approvalProcess/components/infoFormDia.vue";
import ApprovalDia from "@/views/collaborativeApproval/approvalProcess/components/approvalDia.vue";
import {approveProcessDelete, approveProcessListPage} from "@/api/collaborativeApproval/approvalProcess.js";
import useUserStore from "@/store/modules/user";

const userStore = useUserStore();
const route = useRoute();

// 当前选中的标签页，默认为公出管理
const activeTab = ref('1');
@@ -277,6 +281,8 @@
    3: "/approveProcess/exportThree",
    4: "/approveProcess/exportFour",
    5: "/approveProcess/exportFive",
    6: "/approveProcess/exportSix",
    7: "/approveProcess/exportSeven",
  }
  const url = urlMap[type] || urlMap[0]
  const nameMap = {
@@ -286,6 +292,8 @@
    3: "出差管理审批表",
    4: "报销管理审批表",
    5: "采购申请审批表",
    6: "报价审批表",
    7: "出库审批表",
  }
  const fileName = nameMap[type] || nameMap[0]
  proxy.download(url, {}, `${fileName}.xlsx`)
@@ -333,6 +341,21 @@
      });
};
onMounted(() => {
  // 根据URL参数设置标签页和查询条件
  const approveType = route.query.approveType;
  const approveId = route.query.approveId;
  
  if (approveType) {
    // 设置标签页（approveType 对应 activeTab 的 name）
    activeTab.value = String(approveType);
  }
  
  if (approveId) {
    // 设置流程编号查询条件
    searchForm.value.approveId = String(approveId);
  }
  
  // 查询列表
  getList();
});
</script>