feat: currentProject功能

src/views/HomeMain.vue

@@ -55,14 +55,20 @@
           </svg>
           <p>{{ $t('Header.NewProject') }}</p>
         </div>
+        <div
+          class="current-projct"
+          @click="handleNavigateToCurrentProject"
+          :class="{
+            disabled: disabledCurrentProject,
+            filled: !disabledCurrentProject,
+            active: currentProjectActive
+          }"
+        >
+          <FolderOpenOutlined class="current-project-icon" />
+          <span>{{ $t('Habit.currentProject') }}</span>
+        </div>
+        <div class="divider" />
         <div class="navList">
-          <div
-            class="current-projct"
-            @click="handleNavigateToCurrentProject"
-            :class="{ disabled: disabledCurrentProject }"
-          >
-            {{ $t('Habit.currentProject') }}
-          </div>
           <div
             class="tools list"
             v-for="item in navTypeList"
@@ -450,7 +456,7 @@ import TaskPage from '@/component/HomePage/TaskPage.vue'
 import UpgradePlan from '@/component/HomePage/UpgradePlan.vue'
 import { Https } from '@/tool/https'
 import { Modal, message } from 'ant-design-vue'
-import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
+import { ExclamationCircleOutlined, FolderOpenOutlined } from '@ant-design/icons-vue'
 import RobotAssist from '@/component/HomePage/RobotAssist.vue'
 import scaleVideo from '@/component/HomePage/scaleVideo.vue'
 import newPosted from '@/component/HomePage/newPosted.vue'
@@ -482,7 +488,8 @@ export default defineComponent({
     TaskPage,
     home,
     projectSetting,
-    bindEmail
+    bindEmail,
+    FolderOpenOutlined
   },
   setup() {
     const store = useStore()
@@ -1001,14 +1008,18 @@ export default defineComponent({
       return store.state.Workspace.projectPath
     })
 
-		const disabledCurrentProject = computed(() => {
-			if(!currentProjectPath.value) return true
-			if(route.fullPath === currentProjectPath.value) return true
-			return false
+    const disabledCurrentProject = computed(() => {
+      if (!currentProjectPath.value) return true
+
+      return false
     })
 
-		const handleNavigateToCurrentProject = () => {
-			console.log('store地址',currentProjectPath.value,'当前路径',route.fullPath)
+    const currentProjectActive = computed(() => {
+      return currentProjectPath.value === route.fullPath
+    })
+
+    const handleNavigateToCurrentProject = () => {
+      if (currentProjectActive.value) return
       if (currentProjectPath.value) {
         router.push(currentProjectPath.value)
       }
@@ -1047,8 +1058,9 @@ export default defineComponent({
       newProject,
       bathGeneration,
       toUserManual,
-			currentProjectPath,
-			disabledCurrentProject,
+      currentProjectPath,
+      disabledCurrentProject,
+      currentProjectActive,
       handleNavigateToCurrentProject
     }
   },
@@ -2190,23 +2202,42 @@ export default defineComponent({
 }
 
 .current-projct {
-  // text-align: center;
-  padding: 1.2rem;
-  font-size: 1.8rem;
+  font-size: 2rem;
   cursor: pointer;
-  font-weight: 500;
+  border: 2px solid rgba(0, 0, 0, 0.1);
   border-radius: 2rem;
-  border: 2px solid #000;
-  text-align: center;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 25.1rem;
+  padding: calc(2rem - 2px) 0;
+  margin-top: 2rem;
+  &.filled {
+    background-color: #fff;
+  }
+
+  .current-project-icon {
+    margin-right: 1.3rem;
+  }
 
   &.disabled {
-    color: #a5b0c2;
-    border-color: #a5b0c2;
+    color: #9a9a9a;
+    border-color: rgba(0, 0, 0, 0.1);
+    background: #f5f5f5;
+    cursor: not-allowed;
+  }
+  &.active {
     cursor: not-allowed;
   }
 
-  &:hover {
-    background: #fff;
+  &.filled:hover {
+    border-color: rgba(0, 0, 0, 0.5);
   }
 }
+.divider {
+  width: 100%;
+  height: 1px;
+  margin-top: 3rem;
+  background-color: rgba(0, 0, 0, 0.1);
+}
 </style>