|
@@ -37,9 +37,9 @@
|
|
|
<el-dropdown trigger="click" placement="bottom-end">
|
|
<el-dropdown trigger="click" placement="bottom-end">
|
|
|
<div class="flex items-center gap-2 cursor-pointer pr-6 pt-2">
|
|
<div class="flex items-center gap-2 cursor-pointer pr-6 pt-2">
|
|
|
<el-badge
|
|
<el-badge
|
|
|
- :value="unreadMessageCount"
|
|
|
|
|
|
|
+ :value="unreadMessageCount + oaUnreadCount"
|
|
|
class="item"
|
|
class="item"
|
|
|
- v-if="hasUnreadMessages"
|
|
|
|
|
|
|
+ v-if="hasUnreadMessages || oaHasUnreadCount"
|
|
|
>
|
|
>
|
|
|
<Icon
|
|
<Icon
|
|
|
icon="mdi:bell"
|
|
icon="mdi:bell"
|
|
@@ -76,10 +76,6 @@
|
|
|
@click="markAllAsRead"
|
|
@click="markAllAsRead"
|
|
|
>全部标为已读</span
|
|
>全部标为已读</span
|
|
|
>
|
|
>
|
|
|
-
|
|
|
|
|
- <span v-else class="cursor-pointer text-[#b2aaaa]"
|
|
|
|
|
- >全部已读</span
|
|
|
|
|
- >
|
|
|
|
|
</div>
|
|
</div>
|
|
|
<div
|
|
<div
|
|
|
class="message-item"
|
|
class="message-item"
|
|
@@ -108,14 +104,25 @@
|
|
|
</div>
|
|
</div>
|
|
|
</el-tab-pane>
|
|
</el-tab-pane>
|
|
|
<el-tab-pane label="OA" name="tasks">
|
|
<el-tab-pane label="OA" name="tasks">
|
|
|
|
|
+ <template #label>
|
|
|
|
|
+ <span class="custom-tabs-label">
|
|
|
|
|
+ <span>OA</span>
|
|
|
|
|
+ <el-badge
|
|
|
|
|
+ :value="oaUnreadCount"
|
|
|
|
|
+ class="item ml-1"
|
|
|
|
|
+ v-if="oaHasUnreadCount"
|
|
|
|
|
+ ></el-badge>
|
|
|
|
|
+ </span>
|
|
|
|
|
+ </template>
|
|
|
<div class="tab-content">
|
|
<div class="tab-content">
|
|
|
- <!-- <div>
|
|
|
|
|
|
|
+ <div>
|
|
|
<span
|
|
<span
|
|
|
|
|
+ v-if="oaHasUnreadCount"
|
|
|
class="cursor-pointer text-blue-500"
|
|
class="cursor-pointer text-blue-500"
|
|
|
- @click="markAllAsRead"
|
|
|
|
|
|
|
+ @click="oaMarkAllAsRead"
|
|
|
>全部标为已读</span
|
|
>全部标为已读</span
|
|
|
>
|
|
>
|
|
|
- </div> -->
|
|
|
|
|
|
|
+ </div>
|
|
|
<!-- OA消息 -->
|
|
<!-- OA消息 -->
|
|
|
<div
|
|
<div
|
|
|
class="task-item"
|
|
class="task-item"
|
|
@@ -125,17 +132,15 @@
|
|
|
<div class="task-info">
|
|
<div class="task-info">
|
|
|
<p class="task-title">
|
|
<p class="task-title">
|
|
|
<span
|
|
<span
|
|
|
- class="w-3 h-3 bg-[#f56c6c] rounded-full"
|
|
|
|
|
- ></span
|
|
|
|
|
- >{{ task.contentMajor }}
|
|
|
|
|
|
|
+ v-if="task.status === '0'"
|
|
|
|
|
+ class="inline-block h-2 w-2 bg-[#f56c6c] rounded-full"
|
|
|
|
|
+ ></span>
|
|
|
|
|
+ {{ task.title }}
|
|
|
</p>
|
|
</p>
|
|
|
<p class="message-desc">
|
|
<p class="message-desc">
|
|
|
- {{ timestampToDateTime(task.createTime) }}
|
|
|
|
|
|
|
+ <span>{{ task.oaCreateTime }}</span>
|
|
|
</p>
|
|
</p>
|
|
|
</div>
|
|
</div>
|
|
|
- <el-tag :type="task.priorityTag" size="small">{{
|
|
|
|
|
- task.priorityText
|
|
|
|
|
- }}</el-tag>
|
|
|
|
|
</div>
|
|
</div>
|
|
|
<div v-if="!oaMessagesList.length" class="no-tasks">
|
|
<div v-if="!oaMessagesList.length" class="no-tasks">
|
|
|
暂无新消息
|
|
暂无新消息
|
|
@@ -346,7 +351,7 @@
|
|
|
|
|
|
|
|
<script setup lang="ts">
|
|
<script setup lang="ts">
|
|
|
import { Icon } from "@iconify/vue";
|
|
import { Icon } from "@iconify/vue";
|
|
|
-import { ref, computed, onMounted } from "vue";
|
|
|
|
|
|
|
+import { ref, computed, onMounted, onBeforeUnmount } from "vue";
|
|
|
import { useRouter } from "vue-router";
|
|
import { useRouter } from "vue-router";
|
|
|
import logo from "@/assets/images/logo.png";
|
|
import logo from "@/assets/images/logo.png";
|
|
|
import person from "@/assets/images/person.png";
|
|
import person from "@/assets/images/person.png";
|
|
@@ -357,6 +362,9 @@ import {
|
|
|
getNotifyMessageList,
|
|
getNotifyMessageList,
|
|
|
markMessageAsRead,
|
|
markMessageAsRead,
|
|
|
getUnreadNotifyMessageCount,
|
|
getUnreadNotifyMessageCount,
|
|
|
|
|
+ getOANotifyMessages,
|
|
|
|
|
+ getOANotifyMessageList,
|
|
|
|
|
+ markOAMessageAsRead,
|
|
|
} from "@api/user";
|
|
} from "@api/user";
|
|
|
|
|
|
|
|
import {
|
|
import {
|
|
@@ -367,35 +375,12 @@ import {
|
|
|
} from "@utils/auth";
|
|
} from "@utils/auth";
|
|
|
|
|
|
|
|
import { deleteUserCache } from "@hooks/useCache";
|
|
import { deleteUserCache } from "@hooks/useCache";
|
|
|
|
|
+import { manualLogoutKey, reloginCancelKey } from "@/config/axios/service";
|
|
|
|
|
|
|
|
// 新增消息中心状态
|
|
// 新增消息中心状态
|
|
|
const activeTab = ref("messages");
|
|
const activeTab = ref("messages");
|
|
|
const messages = ref([]);
|
|
const messages = ref([]);
|
|
|
|
|
|
|
|
-const tasks = ref([
|
|
|
|
|
- {
|
|
|
|
|
- title: "审批申请",
|
|
|
|
|
- desc: "部门采购申请等待您审批",
|
|
|
|
|
- dueTime: "今天 17:00",
|
|
|
|
|
- priorityText: "高",
|
|
|
|
|
- priorityTag: "danger",
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- title: "项目汇报",
|
|
|
|
|
- desc: "月度项目进度报告待提交",
|
|
|
|
|
- dueTime: "明天",
|
|
|
|
|
- priorityText: "中",
|
|
|
|
|
- priorityTag: "warning",
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- title: "会议安排",
|
|
|
|
|
- desc: "准备下周团队会议材料",
|
|
|
|
|
- dueTime: "后天",
|
|
|
|
|
- priorityText: "低",
|
|
|
|
|
- priorityTag: "info",
|
|
|
|
|
- },
|
|
|
|
|
-]);
|
|
|
|
|
-
|
|
|
|
|
const isLoggedIn = computed(
|
|
const isLoggedIn = computed(
|
|
|
() => !!userStore.isSetUser || !!userStore.user?.id,
|
|
() => !!userStore.isSetUser || !!userStore.user?.id,
|
|
|
);
|
|
);
|
|
@@ -406,44 +391,74 @@ const userName = computed(() => userStore.user?.nickname || "");
|
|
|
const hasUnreadMessages = computed(() => {
|
|
const hasUnreadMessages = computed(() => {
|
|
|
return messages.value.some((msg) => msg.status === "0");
|
|
return messages.value.some((msg) => msg.status === "0");
|
|
|
});
|
|
});
|
|
|
|
|
+// oa是否有未读
|
|
|
|
|
+const oaHasUnreadCount = computed(() => {
|
|
|
|
|
+ return oaMessagesList.value.some((msg) => msg.status === "0");
|
|
|
|
|
+});
|
|
|
|
|
|
|
|
// 未读消息数量
|
|
// 未读消息数量
|
|
|
const unreadMessageCount = computed(() => {
|
|
const unreadMessageCount = computed(() => {
|
|
|
return messages.value.filter((msg) => msg.status === "0").length;
|
|
return messages.value.filter((msg) => msg.status === "0").length;
|
|
|
});
|
|
});
|
|
|
-
|
|
|
|
|
|
|
+// oa未读消息数量
|
|
|
|
|
+const oaUnreadCount = computed(() => {
|
|
|
|
|
+ return oaMessagesList.value.filter((msg) => msg.status === "0").length;
|
|
|
|
|
+});
|
|
|
// oa未读
|
|
// oa未读
|
|
|
const oaMessagesList = ref([]);
|
|
const oaMessagesList = ref([]);
|
|
|
|
|
|
|
|
const unreadCount = ref(0); // 未读消息数量
|
|
const unreadCount = ref(0); // 未读消息数量
|
|
|
const getUnreadCount = async () => {
|
|
const getUnreadCount = async () => {
|
|
|
- getUnreadNotifyMessageCount().then((data) => {
|
|
|
|
|
- unreadCount.value = data;
|
|
|
|
|
- });
|
|
|
|
|
|
|
+ if (!getAccessToken()) {
|
|
|
|
|
+ unreadCount.value = 0;
|
|
|
|
|
+ return;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ const data = await getUnreadNotifyMessageCount();
|
|
|
|
|
+ unreadCount.value = data;
|
|
|
};
|
|
};
|
|
|
|
|
+let messageTimer: ReturnType<typeof setInterval> | undefined;
|
|
|
|
|
+let unreadTimer: ReturnType<typeof setInterval> | undefined;
|
|
|
onMounted(async () => {
|
|
onMounted(async () => {
|
|
|
if (isLoggedIn.value) {
|
|
if (isLoggedIn.value) {
|
|
|
|
|
+ getUnreadCount();
|
|
|
await getNotifyMessages(userStore.getUser.username);
|
|
await getNotifyMessages(userStore.getUser.username);
|
|
|
const messageList = await getNotifyMessageList(userStore.getUser.username);
|
|
const messageList = await getNotifyMessageList(userStore.getUser.username);
|
|
|
- messages.value = messageList;
|
|
|
|
|
|
|
+ messages.value = messageList.filter((msg: any) => msg.status === "0");
|
|
|
|
|
+
|
|
|
|
|
+ // oa消息
|
|
|
|
|
+ await getOANotifyMessages(userStore.getUser.username);
|
|
|
|
|
+ const oaMessageList = await getOANotifyMessageList(
|
|
|
|
|
+ userStore.getUser.username,
|
|
|
|
|
+ );
|
|
|
|
|
+ oaMessagesList.value = oaMessageList.filter((msg) => msg.status === "0");
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- setInterval(
|
|
|
|
|
|
|
+ messageTimer = setInterval(
|
|
|
async () => {
|
|
async () => {
|
|
|
if (isLoggedIn.value) {
|
|
if (isLoggedIn.value) {
|
|
|
await getNotifyMessages(userStore.getUser.username);
|
|
await getNotifyMessages(userStore.getUser.username);
|
|
|
const messageList = await getNotifyMessageList(
|
|
const messageList = await getNotifyMessageList(
|
|
|
userStore.getUser.username,
|
|
userStore.getUser.username,
|
|
|
);
|
|
);
|
|
|
- messages.value = messageList;
|
|
|
|
|
|
|
+ messages.value = messageList.filter((msg: any) => msg.status === "0");
|
|
|
|
|
+
|
|
|
|
|
+ // oa消息
|
|
|
|
|
+ await getOANotifyMessages(userStore.getUser.username);
|
|
|
|
|
+ const oaMessageList = await getOANotifyMessageList(
|
|
|
|
|
+ userStore.getUser.username,
|
|
|
|
|
+ );
|
|
|
|
|
+ oaMessagesList.value = oaMessageList.filter(
|
|
|
|
|
+ (msg: any) => msg.status === "0",
|
|
|
|
|
+ );
|
|
|
}
|
|
}
|
|
|
},
|
|
},
|
|
|
- 1000 * 60 * 1,
|
|
|
|
|
|
|
+ 1000 * 60 * 5,
|
|
|
);
|
|
);
|
|
|
|
|
|
|
|
- setInterval(
|
|
|
|
|
|
|
+ unreadTimer = setInterval(
|
|
|
() => {
|
|
() => {
|
|
|
- if (userStore.getIsSetUser) {
|
|
|
|
|
|
|
+ if (userStore.getIsSetUser && getAccessToken()) {
|
|
|
console.log("轮询刷新小红点");
|
|
console.log("轮询刷新小红点");
|
|
|
getUnreadCount();
|
|
getUnreadCount();
|
|
|
} else {
|
|
} else {
|
|
@@ -454,6 +469,15 @@ onMounted(async () => {
|
|
|
);
|
|
);
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
|
|
+onBeforeUnmount(() => {
|
|
|
|
|
+ if (messageTimer) {
|
|
|
|
|
+ clearInterval(messageTimer);
|
|
|
|
|
+ }
|
|
|
|
|
+ if (unreadTimer) {
|
|
|
|
|
+ clearInterval(unreadTimer);
|
|
|
|
|
+ }
|
|
|
|
|
+});
|
|
|
|
|
+
|
|
|
function timestampToDateTime(timestamp) {
|
|
function timestampToDateTime(timestamp) {
|
|
|
// 兼容 10位(秒) / 13位(毫秒)
|
|
// 兼容 10位(秒) / 13位(毫秒)
|
|
|
const len = String(timestamp).length;
|
|
const len = String(timestamp).length;
|
|
@@ -483,7 +507,15 @@ const markAllAsRead = async () => {
|
|
|
await markMessageAsRead(userStore.getUser.username);
|
|
await markMessageAsRead(userStore.getUser.username);
|
|
|
// 刷新消息列表
|
|
// 刷新消息列表
|
|
|
const messageList = await getNotifyMessageList(userStore.getUser.username);
|
|
const messageList = await getNotifyMessageList(userStore.getUser.username);
|
|
|
- messages.value = messageList;
|
|
|
|
|
|
|
+ messages.value = messageList.filter((msg: any) => msg.status === "0");
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+// oa全部标为已读
|
|
|
|
|
+const oaMarkAllAsRead = async () => {
|
|
|
|
|
+ await markOAMessageAsRead(userStore.getUser.username);
|
|
|
|
|
+ // 刷新消息列表
|
|
|
|
|
+ const messageList = await getOANotifyMessageList(userStore.getUser.username);
|
|
|
|
|
+ oaMessagesList.value = messageList.filter((msg: any) => msg.status === "0");
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
const goHome = () => {
|
|
const goHome = () => {
|
|
@@ -505,8 +537,10 @@ const onUserCommand = async (command: string) => {
|
|
|
// await userStore.loginOut();
|
|
// await userStore.loginOut();
|
|
|
|
|
|
|
|
deleteUserCache(); // 删除用户缓存
|
|
deleteUserCache(); // 删除用户缓存
|
|
|
|
|
+ sessionStorage.setItem(manualLogoutKey, "true");
|
|
|
|
|
+ sessionStorage.removeItem(reloginCancelKey);
|
|
|
removeToken();
|
|
removeToken();
|
|
|
- window.location.reload();
|
|
|
|
|
|
|
+ window.location.href = "/login";
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
|
</script>
|
|
</script>
|