From 6c70a6eaeac528e8741422e9ec0dd2c4bd3da923 Mon Sep 17 00:00:00 2001
From: wancat <wancat@wancat.cc>
Date: Thu, 24 Aug 2023 12:26:09 +0800
Subject: [PATCH] feat: add box shadow to pwd node

---
 app/src/components/FileNode.vue  | 12 ++++++++++--
 app/src/components/TreeChart.vue |  8 +++++++-
 2 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/app/src/components/FileNode.vue b/app/src/components/FileNode.vue
index 7039748..ee4636e 100644
--- a/app/src/components/FileNode.vue
+++ b/app/src/components/FileNode.vue
@@ -2,7 +2,7 @@
   <a href="#" :class="nodeClass()">{{ node.discovered ? node.name : '???' }}</a>
   <ul :class="nodeClass()" v-if="node.children && node.children.length > 0">
     <li :class="nodeClass()" v-for="child in node.children" :key="child.path">
-      <FileNode :node="child" />
+      <FileNode :node="child" :pwd="pwd" />
     </li>
   </ul>
 </template>
@@ -13,9 +13,17 @@ const props = defineProps({
     type: Object,
     required: true,
   },
+  pwd: {
+    type: String,
+    required: true,
+    default: '',
+  },
 })
 
 function nodeClass() {
-  return props.node.discovered ? 'discovered' : ''
+  const classes = []
+  if (props.node.discovered) classes.push('discovered')
+  if (props.node.path === props.pwd) classes.push('pwd')
+  return classes
 }
 </script>
diff --git a/app/src/components/TreeChart.vue b/app/src/components/TreeChart.vue
index 19c8041..9c2769a 100644
--- a/app/src/components/TreeChart.vue
+++ b/app/src/components/TreeChart.vue
@@ -3,6 +3,8 @@ import { onMounted, ref } from 'vue'
 import FileNode from './FileNode.vue'
 import socket from '../utils/socket.js'
 
+const pwd = ref('/home/rudeus')
+
 const graph = ref({
   path: '/',
   name: '/',
@@ -66,7 +68,7 @@ onMounted(() => {
   <div class="tree w-max h-max">
     <ul>
       <li>
-        <FileNode :node="graph" />
+        <FileNode :node="graph" :pwd="pwd" />
       </li>
     </ul>
   </div>
@@ -175,4 +177,8 @@ ul.discovered,
 li.discovered {
   border-color: #94a0b4;
 }
+
+a.pwd {
+  box-shadow: 0 0 10px rgba(255, 255, 255, 0.5); /* 水平偏移、垂直偏移、模糊半徑、顏色 */
+}
 </style>