|
|
@@ -106,24 +106,64 @@
|
|
|
|
|
|
<!-- 右侧快捷入口 -->
|
|
|
<div class="quick-access">
|
|
|
- <button
|
|
|
- type="button"
|
|
|
- class="quick-btn"
|
|
|
- @click="router.push('/todo-list?type=oa')"
|
|
|
+ <el-dropdown
|
|
|
+ trigger="click"
|
|
|
+ popper-class="quick-access-dropdown"
|
|
|
+ @command="handleQuickAccessCommand"
|
|
|
>
|
|
|
- <img src="../assets//images//td.png" class="w-5 h-5" alt="" />
|
|
|
- <span class="btn-label text-[#a1a1aa]!">我的待办</span>
|
|
|
- <span class="text-[#6b2973]! font-bold">{{ todo }}</span>
|
|
|
- </button>
|
|
|
- <button
|
|
|
- type="button"
|
|
|
- class="quick-btn"
|
|
|
- @click="router.push('/oa-done-list?type=oa')"
|
|
|
+ <button type="button" class="quick-btn quick-btn--dropdown">
|
|
|
+ <img src="../assets//images//td.png" class="w-5 h-5" alt="" />
|
|
|
+ <span class="btn-label text-[#a1a1aa]!">我的待办</span>
|
|
|
+ <span class="text-[#6b2973]! font-bold">{{ todo }}</span>
|
|
|
+ <!-- <Icon icon="mdi:chevron-down" class="quick-btn__arrow" /> -->
|
|
|
+ </button>
|
|
|
+ <template #dropdown>
|
|
|
+ <el-dropdown-menu>
|
|
|
+ <el-dropdown-item command="todo-oa">
|
|
|
+ <div class="p-2 flex items-center gap-3 text-[#e43c2f]!">
|
|
|
+ <span>OA</span>
|
|
|
+ <span>{{ oatodo }}</span>
|
|
|
+ </div>
|
|
|
+ </el-dropdown-item>
|
|
|
+ <el-dropdown-item command="todo-crm">
|
|
|
+ <div class="p-2 flex items-center gap-3 text-[#e43c2f]!">
|
|
|
+ <span>CRM</span>
|
|
|
+ <span>{{ crmtodo }}</span>
|
|
|
+ </div>
|
|
|
+ </el-dropdown-item>
|
|
|
+ </el-dropdown-menu>
|
|
|
+ </template>
|
|
|
+ </el-dropdown>
|
|
|
+ <el-dropdown
|
|
|
+ trigger="click"
|
|
|
+ popper-class="quick-access-dropdown"
|
|
|
+ @command="handleQuickAccessCommand"
|
|
|
>
|
|
|
- <Icon icon="mdi:check" class="btn-icon" />
|
|
|
- <span class="btn-label text-[#a1a1aa]!">我的已办</span>
|
|
|
- <span class="p-2 inline-block text-[#2da04d]!">{{ done }}</span>
|
|
|
- </button>
|
|
|
+ <button type="button" class="quick-btn quick-btn--dropdown">
|
|
|
+ <Icon icon="mdi:check" class="btn-icon" />
|
|
|
+ <span class="btn-label text-[#a1a1aa]!">我的已办</span>
|
|
|
+ <span class="p-2 inline-block text-[#2da04d]!">{{
|
|
|
+ done
|
|
|
+ }}</span>
|
|
|
+ <!-- <Icon icon="mdi:chevron-down" class="quick-btn__arrow" /> -->
|
|
|
+ </button>
|
|
|
+ <template #dropdown>
|
|
|
+ <el-dropdown-menu>
|
|
|
+ <el-dropdown-item command="done-oa">
|
|
|
+ <div class="p-2 flex items-center gap-3 text-[#2da04d]!">
|
|
|
+ <span>OA</span>
|
|
|
+ <span>{{ oadone }}</span>
|
|
|
+ </div>
|
|
|
+ </el-dropdown-item>
|
|
|
+ <el-dropdown-item command="done-crm">
|
|
|
+ <div class="p-2 flex items-center gap-3 text-[#2da04d]!">
|
|
|
+ <span>CRM</span>
|
|
|
+ <span>{{ crmdone }}</span>
|
|
|
+ </div></el-dropdown-item
|
|
|
+ >
|
|
|
+ </el-dropdown-menu>
|
|
|
+ </template>
|
|
|
+ </el-dropdown>
|
|
|
<!-- <button
|
|
|
type="button"
|
|
|
class="quick-btn"
|
|
|
@@ -471,6 +511,7 @@ import {
|
|
|
ssoLogin,
|
|
|
zentaoSsoLogin,
|
|
|
getOATasks,
|
|
|
+ getCRMTasks,
|
|
|
getNotices,
|
|
|
getRedHeadFiles,
|
|
|
getNews,
|
|
|
@@ -635,6 +676,20 @@ const handleSearch = () => {
|
|
|
// 如果需要跳转到独立搜索页,可以在这里添加 router.push
|
|
|
};
|
|
|
|
|
|
+const handleQuickAccessCommand = (command: string) => {
|
|
|
+ const routeMap: Record<string, string> = {
|
|
|
+ "todo-oa": "/todo-list?type=oa",
|
|
|
+ "todo-crm": "/crm-todo-list?type=crm",
|
|
|
+ "done-oa": "/oa-done-list?type=oa",
|
|
|
+ "done-crm": "/crm-done-list?type=crm",
|
|
|
+ };
|
|
|
+
|
|
|
+ const target = routeMap[command];
|
|
|
+ if (target) {
|
|
|
+ router.push(target);
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
const filteredSections = computed(() => {
|
|
|
const keyword = searchKeyword.value.trim().toLowerCase();
|
|
|
|
|
|
@@ -700,17 +755,33 @@ const currentNoticeList = computed(
|
|
|
|
|
|
let todo = ref(0);
|
|
|
let done = ref(0);
|
|
|
+let oatodo = ref(0);
|
|
|
+let oadone = ref(0);
|
|
|
+let crmtodo = ref(0);
|
|
|
+let crmdone = ref(0);
|
|
|
const loadHomeData = async () => {
|
|
|
await loadNoticeList(activeNoticeTab.value);
|
|
|
|
|
|
if (!userStore.getUser.username) return;
|
|
|
|
|
|
- const [oaRes, newsRes] = await Promise.all([
|
|
|
+ const [oaRes, crmRes, crmDoneRes, newsRes] = await Promise.all([
|
|
|
getOATasks({
|
|
|
id: userStore.getUser.username,
|
|
|
pageNum: 1,
|
|
|
pageSize: 10,
|
|
|
}),
|
|
|
+ await getCRMTasks({
|
|
|
+ id: userStore.getUser.username,
|
|
|
+ type: "pending",
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ }),
|
|
|
+ await getCRMTasks({
|
|
|
+ id: userStore.getUser.username,
|
|
|
+ type: "approved",
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ }),
|
|
|
getNews({
|
|
|
pageNum: 1,
|
|
|
pageSize: 10,
|
|
|
@@ -718,8 +789,13 @@ const loadHomeData = async () => {
|
|
|
]);
|
|
|
|
|
|
oaTasks.value = oaRes.todoList.slice(0, 3);
|
|
|
- todo.value = oaRes.todoCount;
|
|
|
- done.value = oaRes.doneCount;
|
|
|
+ todo.value = Number(oaRes.todoCount) + crmRes.todoCount;
|
|
|
+ done.value = Number(oaRes.doneCount) + crmDoneRes.todoCount;
|
|
|
+
|
|
|
+ oatodo.value = oaRes.todoCount;
|
|
|
+ oadone.value = oaRes.doneCount;
|
|
|
+ crmtodo.value = crmRes.todoCount;
|
|
|
+ crmdone.value = crmDoneRes.todoCount;
|
|
|
newsList.value = newsRes.list.slice(0, 3);
|
|
|
};
|
|
|
|
|
|
@@ -1002,7 +1078,7 @@ onMounted(async () => {
|
|
|
await loadHomeData();
|
|
|
});
|
|
|
|
|
|
-const handleNoticeItemClick = async (notice) => {
|
|
|
+const handleNoticeItemClick = async (notice: any) => {
|
|
|
const res = await ssoLogin({
|
|
|
username: userStore.getUser.username,
|
|
|
});
|
|
|
@@ -1048,7 +1124,7 @@ const handleNoticeItemClick = async (notice) => {
|
|
|
}
|
|
|
};
|
|
|
|
|
|
-const handleTask = async (row) => {
|
|
|
+const handleTask = async (row: any) => {
|
|
|
const res = await ssoLogin({
|
|
|
username: userStore.getUser.username,
|
|
|
});
|
|
|
@@ -1815,6 +1891,16 @@ onUnmounted(() => {
|
|
|
transform 0.2s ease;
|
|
|
}
|
|
|
|
|
|
+.quick-btn--dropdown {
|
|
|
+ border: none;
|
|
|
+ background: transparent;
|
|
|
+ outline: none;
|
|
|
+}
|
|
|
+
|
|
|
+.quick-btn--dropdown:focus-visible {
|
|
|
+ outline: none;
|
|
|
+}
|
|
|
+
|
|
|
.quick-btn:hover {
|
|
|
background: rgba(28, 40, 72, 0.8);
|
|
|
border-color: rgba(109, 137, 213, 0.4);
|
|
|
@@ -1830,6 +1916,11 @@ onUnmounted(() => {
|
|
|
white-space: nowrap;
|
|
|
}
|
|
|
|
|
|
+.quick-btn__arrow {
|
|
|
+ font-size: 16px;
|
|
|
+ color: #8a9ab0;
|
|
|
+}
|
|
|
+
|
|
|
.badge {
|
|
|
display: inline-flex;
|
|
|
align-items: center;
|
|
|
@@ -1891,4 +1982,42 @@ onUnmounted(() => {
|
|
|
font-size: 14px;
|
|
|
color: #79b0ff; /* 蓝色 */
|
|
|
}
|
|
|
+/* 下拉菜单主体 */
|
|
|
+:deep(.el-dropdown-menu) {
|
|
|
+ background-color: rgba(0, 0, 0, 0.75) !important;
|
|
|
+ border: none !important;
|
|
|
+ border-radius: 5px;
|
|
|
+ box-shadow: none !important; /* 关键:去除阴影导致的“白边”视觉效果 */
|
|
|
+ padding: 0 !important;
|
|
|
+}
|
|
|
+
|
|
|
+/* Popper 容器及箭头 */
|
|
|
+:deep(.el-popper) {
|
|
|
+ background: transparent !important; /* 改为透明,避免容器背景干扰 */
|
|
|
+ border: none !important;
|
|
|
+ box-shadow: none !important;
|
|
|
+}
|
|
|
+
|
|
|
+/* 去除可能存在的箭头边框 */
|
|
|
+:deep(.el-popper__arrow),
|
|
|
+:deep(.el-popper__arrow)::before {
|
|
|
+ display: none !important;
|
|
|
+}
|
|
|
+
|
|
|
+/* 菜单项 */
|
|
|
+:deep(.el-dropdown-menu__item) {
|
|
|
+ background: #192a5b !important;
|
|
|
+ color: #fff !important; /* 确保文字颜色可见 */
|
|
|
+ padding: 0 !important;
|
|
|
+ margin: 0 !important;
|
|
|
+ border: none !important;
|
|
|
+}
|
|
|
+
|
|
|
+:deep(.el-dropdown-menu__item):hover {
|
|
|
+ background: #182342 !important;
|
|
|
+ color: #fff !important;
|
|
|
+}
|
|
|
+:deep(.el-dropdown-menu) {
|
|
|
+ outline: none !important;
|
|
|
+}
|
|
|
</style>
|