feat: add media type selection to MediaFormModal and remove redundant type field from API requests in App component

src/App.svelte

@@ -157,7 +157,6 @@
     try {
       const response = await request.post<ApiResponse<Media>>('/media/create', {
         ...media,
-        type: currentCategory
       });
       
       if (response.data.code === 0) {
@@ -176,7 +175,6 @@
     try {
       const response = await request.put<ApiResponse<Media>>(`/media/updateById/${media.id}`, {
         ...media,
-        type: currentCategory
       });
       
       if (response.data.code === 0) {

src/lib/MediaFormModal.svelte

@@ -33,7 +33,15 @@
     { value: 'plan_to_watch', label: '计划中' },
     { value: 'in_progress', label: '进行中' },
     { value: 'completed', label: '已完成' }
-  ] as const;
+  ];
+
+  const typeOptions = [
+    { value: 'game', label: '游戏' },
+    { value: 'book', label: '书籍' },
+    { value: 'movie', label: '电影' },
+    { value: 'anime', label: '番剧' },
+    { value: 'other', label: '其它' },
+  ];
 
   function handleSubmit(e: Event) {
     e.preventDefault();
@@ -85,6 +93,21 @@
           />
         </div>
 
+        <div class="flex justify-between items-center gap-6">
+          <label class="font-medium text-gray-700 whitespace-nowrap" for="status">类别</label>
+          <select
+            id="status"
+            bind:value={media.type}
+            class="w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
+            required
+            aria-required="true"
+          >
+            {#each typeOptions as option}
+              <option value={option.value}>{option.label}</option>
+            {/each}
+          </select>
+        </div>
+
         <div class="flex justify-between items-center gap-6">
           <label class="font-medium text-gray-700 whitespace-nowrap" for="status">状态</label>
           <select
@@ -124,19 +147,21 @@
             aria-label="输入评分，范围0-10"
           />
         </div>
-
+        {#if media.type === 'game' || media.type === 'other'}
-        <div class="flex justify-between items-center gap-6">
+          <div class="flex justify-between items-center gap-6">
-          <label class="font-medium text-gray-700 whitespace-nowrap" for="platform">平台</label>
+            <label class="font-medium text-gray-700 whitespace-nowrap" for="platform">{
-          <input
+              media.type === 'game' ? '平台' : '类别'
-            id="platform"
+            }</label>
-            type="text"
+            <input
-            bind:value={media.platform}
+              id="platform"
-            class="w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
+              type="text"
-            placeholder="例如：Steam、Netflix、Kindle等"
+              bind:value={media.platform}
-            aria-label="输入平台名称"
+              class="w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
-          />
+              placeholder="例如：Steam、Netflix、Kindle等"
-        </div>
+              aria-label="输入平台名称"
-
+            />
+          </div>
+        {/if}
         <div class="flex justify-between items-center gap-6">
           <label class="font-medium text-gray-700 whitespace-nowrap" for="notes">备注</label>
           <textarea