liulijun
2026-03-05 98a69d51981ee6a49136024c8b005f134d3313cd
ÏîÄ¿´úÂë/WMS/WMSClient/src/views/Index.vue
@@ -191,12 +191,29 @@
      destroy-on-close
      size="40%"
    >
      <Message :list="messageList"></Message>
      <div style="margin-bottom: 20px;">
        <el-button type="danger" @click="clearAllMessages">全部清除</el-button>
      </div>
      <Message :list="messageList" @delete-message="handleDeleteMessage"></Message>
    </el-drawer>
  </div>
</template>
<style lang="less" scoped>
@import "./index/index.less";
/* ä¸ºæ¶ˆæ¯åˆ—表的drawer添加圆角 */
:deep(.el-drawer__header) {
  padding: 20px;
}
:deep(.el-drawer__body) {
  padding: 0 20px 20px 20px;
}
:deep(.el-drawer) {
  border-radius: 12px 0 0 12px !important;
  overflow: hidden;
}
</style>
<script>
import loading from "@/components/basic/RouterLoading";
@@ -297,7 +314,6 @@
    const theme = ref("blue2");
    const menuOptions = ref([]);
    const permissionInited = ref(false);
    const messageList = reactive([]);
    let _config = getCurrentInstance().appContext.config.globalProperties;
    let router = useRouter();
    const toggleLeft = () => {
@@ -316,7 +332,8 @@
    const handleMessage = (e) => {
      let data = JSON.parse(e.data);
      messageList.push(data);
      // ä½¿ç”¨store的addMessage mutation添加消息
      store.commit('addMessage', data);
      ElNotification({
        title: data.title,
        message: h("i", { style: "color: teal" }, data.message),
@@ -626,7 +643,8 @@
        //开启消息推送(main.js中设置是否开启signalR)2022.05.05
        if (_config.$global.signalR) {
          MessageConfig(http, (result) => {
            messageList.unshift(result);
            // ä½¿ç”¨store的addMessage mutation添加消息
            store.commit('addMessage', result);
            //    console.log(result)
          });
        }
@@ -654,6 +672,59 @@
      });
    };
    created();
    // å¤„理删除单条消息
    const handleDeleteMessage = ({ item, index }) => {
      // ä»Žå…¨å±€æ¶ˆæ¯åˆ—表中删除该消息
      if (_config.$global.messageList && Array.isArray(_config.$global.messageList)) {
        _config.$global.messageList = _config.$global.messageList.filter(msg => msg.id !== item.id);
      }
      // ä»Žstore中删除该消息
      if (store) {
        // ä½¿ç”¨mutation删除单个消息
        store.commit('removeMessage', item.id);
      }
      // å°†åˆ é™¤çš„æ¶ˆæ¯ID添加到messageDeleted数组,用于通知组件重置定时器
      if (_config.$global.messageDeleted && Array.isArray(_config.$global.messageDeleted)) {
        _config.$global.messageDeleted.push(item.id);
      }
      // æ˜¾ç¤ºæˆåŠŸæç¤º
      _config.$message.success('消息已删除');
      // å¼ºåˆ¶ç»„件更新,确保消息列表立即刷新
      proxy.$nextTick(() => {
        // è§¦å‘重渲染
        _config.$forceUpdate && _config.$forceUpdate();
      });
    };
    // æ¸…理全部消息
    const clearAllMessages = () => {
      // èŽ·å–æ‰€æœ‰å½“å‰æ¶ˆæ¯çš„ID,用于重置定时器
      const messageIds = _config.$global.messageList.map(msg => msg.id);
      // å…ˆæ¸…空store中的消息列表
      store.commit('clearMessages');
      // ç„¶åŽæ¸…空全局消息列表,使用重新赋值的方式确保响应式更新
      _config.$global.messageList = [];
      // å°†æ‰€æœ‰åˆ é™¤çš„æ¶ˆæ¯ID添加到messageDeleted数组,用于通知组件重置定时器
      if (_config.$global.messageDeleted && Array.isArray(_config.$global.messageDeleted)) {
        _config.$global.messageDeleted.push(...messageIds);
      }
      // æ˜¾ç¤ºæˆåŠŸæç¤º
      _config.$message.success('消息已全部清除');
      // å¼ºåˆ¶ç»„件更新,确保消息列表立即刷新
      proxy.$nextTick(() => {
        // è§¦å‘重渲染
        _config.$forceUpdate && _config.$forceUpdate();
      });
    };
    return {
      menuWidth,
      isCollapse,
@@ -681,12 +752,17 @@
      to,
      toggleLeft,
      messageModel,
      messageList,
      // ä»Žå…¨å±€å¯¹è±¡ä¸­èŽ·å–æ¶ˆæ¯åˆ—è¡¨
      get messageList() {
        return _config.$global.messageList;
      },
      contextMenuVisible,
      visibleItem,
      closeTabsMenu,
      closeTabs,
      currentMenuId,
      clearAllMessages,
      handleDeleteMessage,
    };
  },
  /**