|
|
@@ -370,35 +370,84 @@
|
|
|
</article>
|
|
|
|
|
|
<div class="quick-todo-bar">
|
|
|
- <div
|
|
|
- @click="router.push('/todo-list?type=oa')"
|
|
|
- class="flex flex-col items-start justify-center gap-2 cursor-pointer"
|
|
|
+ <el-dropdown
|
|
|
+ trigger="click"
|
|
|
+ popper-class="quick-access-dropdown"
|
|
|
+ @command="handleQuickAccessCommand"
|
|
|
>
|
|
|
- <div class="number">{{ todo }}</div>
|
|
|
- <div class="flex gap-2 items-center">
|
|
|
- <div class="!text-[10px] text-white/60">我的待办</div>
|
|
|
- <Icon
|
|
|
- icon="mdi:clipboard-text-outline"
|
|
|
- color="#7f2c33"
|
|
|
- class="icon"
|
|
|
- />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div
|
|
|
- class="flex flex-col items-center justify-center gap-2 cursor-pointer"
|
|
|
- @click="router.push('/oa-done-list?type=oa')"
|
|
|
+ <button type="button" class="quick-todo-btn">
|
|
|
+ <div class="number">{{ todo }}</div>
|
|
|
+ <div class="flex gap-2 items-center">
|
|
|
+ <div class="!text-[10px] text-white/60">我的待办</div>
|
|
|
+ <Icon
|
|
|
+ icon="mdi:clipboard-text-outline"
|
|
|
+ color="#7f2c33"
|
|
|
+ class="icon"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </button>
|
|
|
+ <template #dropdown>
|
|
|
+ <el-dropdown-menu>
|
|
|
+ <el-dropdown-item command="todo-oa">
|
|
|
+ <div
|
|
|
+ class="p-2 flex items-center gap-3 text-[#f56c6c]!"
|
|
|
+ >
|
|
|
+ <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-[#f56c6c]!"
|
|
|
+ >
|
|
|
+ <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"
|
|
|
>
|
|
|
- <div class="number text-white!">{{ done }}</div>
|
|
|
- <div class="flex gap-2 items-center pl-2">
|
|
|
- <div class="!text-[10px] text-white/60">已完成</div>
|
|
|
- <Icon
|
|
|
- icon="mdi:check-circle-outline"
|
|
|
- color="#2d8767"
|
|
|
- class="icon"
|
|
|
- />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ <button
|
|
|
+ type="button"
|
|
|
+ class="quick-todo-btn quick-todo-btn--center"
|
|
|
+ >
|
|
|
+ <div class="number text-white!">{{ done }}</div>
|
|
|
+ <div class="flex gap-2 items-center pl-2">
|
|
|
+ <div class="!text-[10px] text-white/60">已完成</div>
|
|
|
+ <Icon
|
|
|
+ icon="mdi:check-circle-outline"
|
|
|
+ color="#2d8767"
|
|
|
+ class="icon"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </button>
|
|
|
+ <template #dropdown>
|
|
|
+ <el-dropdown-menu>
|
|
|
+ <el-dropdown-item command="done-oa">
|
|
|
+ <div
|
|
|
+ class="p-2 flex items-center gap-3 text-[#2d8767]!"
|
|
|
+ >
|
|
|
+ <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-[#2d8767]!"
|
|
|
+ >
|
|
|
+ <span>CRM</span>
|
|
|
+ <span>{{ crmdone }}</span>
|
|
|
+ </div>
|
|
|
+ </el-dropdown-item>
|
|
|
+ </el-dropdown-menu>
|
|
|
+ </template>
|
|
|
+ </el-dropdown>
|
|
|
</div>
|
|
|
</div>
|
|
|
</section>
|
|
|
@@ -1947,6 +1996,29 @@ onUnmounted(() => {
|
|
|
/* margin-bottom: 16px; */
|
|
|
}
|
|
|
|
|
|
+.quick-todo-btn {
|
|
|
+ display: flex;
|
|
|
+ flex: 1;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: flex-start;
|
|
|
+ justify-content: center;
|
|
|
+ gap: 8px;
|
|
|
+ border: none;
|
|
|
+ background: transparent;
|
|
|
+ padding: 0;
|
|
|
+ color: inherit;
|
|
|
+ cursor: pointer;
|
|
|
+ outline: none;
|
|
|
+}
|
|
|
+
|
|
|
+.quick-todo-btn--center {
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.quick-todo-btn:hover {
|
|
|
+ transform: translateY(-1px);
|
|
|
+}
|
|
|
+
|
|
|
.todo-item {
|
|
|
display: flex;
|
|
|
align-items: center;
|
