fix: 修复编辑无法修改链接的问题

Author: hanxi

front/src/components/LinkDialog.vue

@@ -122,12 +122,12 @@ const props = defineProps<{
     show: boolean
     mode: 'add' | 'update'
     link?: Link
-    categories: string[] // 新增 categories prop
+    categories: string[]
 }>()
 
 const emit = defineEmits<{
     (e: 'update:show', value: boolean): void
-    (e: 'submit', value: Link): void
+    (e: 'submit', value: any): void
 }>()
 
 const query = ref('')
@@ -141,6 +141,25 @@ const formData = ref({
     sortIndex: 0,
 })
 
+const oldUrl = ref<string | undefined>('')
+
+// 当 link 属性改变时更新表单数据
+watch(() => props.link, (newLink) => {
+    if (newLink) {
+        formData.value = { ...newLink }
+        oldUrl.value = newLink.url
+    } else {
+        formData.value = {
+            name: '',
+            url: '',
+            icon: '',
+            category: '',
+            sortIndex: 0,
+        }
+        oldUrl.value = ''
+    }
+}, { immediate: true })
+
 // 处理分类输入
 const handleCategoryInput = (event: Event) => {
     const value = (event.target as HTMLInputElement).value
@@ -158,20 +177,6 @@ const filteredCategories = computed(() => {
     )
 })
 
-// 当 link 属性改变时更新表单数据
-watch(() => props.link, (newLink) => {
-    if (newLink) {
-        formData.value = { ...newLink }
-    } else {
-        formData.value = {
-            name: '',
-            url: '',
-            icon: '',
-            category: '',
-            sortIndex: 0,
-        }
-    }
-}, { immediate: true })
 
 // 获取图标
 const fetchIcon = async () => {
@@ -193,7 +198,11 @@ const fetchIcon = async () => {
 
 // 提交表单
 const handleSubmit = () => {
-    emit('submit', { ...formData.value })
+    if (props.mode === 'update') {
+        emit('submit', { link: { ...formData.value }, oldUrl: oldUrl.value })
+    } else {
+        emit('submit', { link: { ...formData.value } })
+    }
     emit('update:show', false)
 }
 </script>

front/src/views/Nav.vue

@@ -219,7 +219,8 @@ const closeAddDialog = () => {
     isAddDialogOpen.value = false
 }
 
-const handleAdd = async (link: Link) => {
+const handleAdd = async (payload: { link: Link }) => {
+    const { link } = payload
     try {
         await api.addLink(link)
         await fetchLinks()
@@ -238,9 +239,11 @@ const closeUpdateDialog = () => {
     isUpdateDialogOpen.value = false
 }
 
-const handleUpdate = async (link: Link) => {
+const handleUpdate = async (payload: { link: Link, oldUrl: string }) => {
+    const { link, oldUrl: prevUrl } = payload
     try {
-        await api.updateLink(store.links.findIndex((l: Link) => l.url === link.url), link)
+        const index = store.links.findIndex((l: Link) => l.url === prevUrl)
+        await api.updateLink(index, link)
         await fetchLinks()
         closeUpdateDialog()
     } catch (error) {