fix(spider): update node selection to use active nodes instead of all nodes

fix(spider): optimize form update logic to watch specific fields for changes
fix(grpc): adjust sync request ID handling for git and regular spiders

core/task/handler/runner_sync_grpc.go

@@ -33,9 +33,19 @@ func (r *Runner) syncFilesGRPC() (err error) {
 		return err
 	}
 
+	// Determine the ID to use for sync request
+	// For git spiders, use GitId (where files are stored)
+	// For regular spiders, use SpiderId
+	var syncId string
+	if r.s.GitId.IsZero() {
+		syncId = r.s.Id.Hex()
+	} else {
+		syncId = r.s.GitId.Hex()
+	}
+
 	// Prepare request
 	req := &grpc2.FileSyncRequest{
-		SpiderId: r.s.Id.Hex(),
+		SpiderId: syncId,
 		Path:     workingDir,
 		NodeKey:  utils.GetNodeKey(),
 	}
@@ -149,7 +159,13 @@ func (r *Runner) syncFilesGRPC() (err error) {
 		}
 
 		if needsDownload {
-			if err := r.downloadFileGRPC(syncClient, r.s.Id.Hex(), path); err != nil {
+			// For git spiders with sub-folders, prepend GitRootPath to the download path
+			// because the server stores files at workspace/{git_id}/{git_root_path}/...
+			downloadPath := path
+			if workingDir != "" {
+				downloadPath = filepath.Join(workingDir, path)
+			}
+			if err := r.downloadFileGRPC(syncClient, syncId, downloadPath); err != nil {
 				r.Errorf("error downloading file %s: %v", path, err)
 				return err
 			}

frontend/crawlab-ui/src/components/core/schedule/ScheduleForm.vue

@@ -22,7 +22,7 @@ const {
 } = useSchedule(store);
 
 // use node
-const { allNodesSorted: allNodes } = useNode(store);
+const { activeNodesSorted: activeNodes } = useNode(store);
 
 // on enabled change
 const onEnabledChange = async (value: boolean) => {
@@ -201,7 +201,7 @@ defineOptions({ name: 'ClScheduleForm' });
         :placeholder="t('components.schedule.form.selectedNodes')"
       >
         <el-option
-          v-for="n in allNodes"
+          v-for="n in activeNodes"
           :key="n.key"
           :value="n._id"
           :label="n.name"

frontend/crawlab-ui/src/components/core/spider/RunSpiderDialog.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, onBeforeMount, ref, watch } from 'vue';
+import { computed, ref, watch } from 'vue';
 import { useStore } from 'vuex';
 import useSpider from '@/components/core/spider/useSpider';
 import useNode from '@/components/core/node/useNode';
@@ -88,8 +88,19 @@ const updateOptions = () => {
   options.value = getOptions();
 };
 
-watch(() => form.value, updateOptions);
-onBeforeMount(updateOptions);
+// Watch specific form fields instead of entire form object to prevent
+// excessive re-renders with complex git spider objects
+watch(
+  () => [
+    form.value?.mode,
+    form.value?.cmd,
+    form.value?.param,
+    form.value?.priority,
+    form.value?.node_ids,
+  ],
+  updateOptions,
+  { immediate: true }
+);
 defineOptions({ name: 'ClRunSpiderDialog' });
 </script>
 

frontend/crawlab-ui/src/components/core/spider/SpiderForm.vue

@@ -20,11 +20,11 @@ const { get } = useRequest();
 const store = useStore();
 
 // use node
-const { allNodesSorted: allNodes } = useNode(store);
+const { activeNodesSorted: activeNodes, allNodesSorted: allNodes } = useNode(store);
 
 const toRunNodes = computed(() => {
   const { mode, node_ids } = form.value;
-  return getToRunNodes(mode, node_ids, allNodes.value);
+  return getToRunNodes(mode, node_ids, activeNodes.value);
 });
 
 // use spider
@@ -253,7 +253,7 @@ defineOptions({ name: 'ClSpiderForm' });
         :placeholder="t('components.spider.form.selectedNodes')"
       >
         <el-option
-          v-for="n in allNodes"
+          v-for="n in activeNodes"
           :key="n.key"
           :value="n._id"
           :label="n.name"
@@ -261,14 +261,7 @@ defineOptions({ name: 'ClSpiderForm' });
           <span style="margin-right: 5px">
             <cl-node-tag :node="n" icon-only />
           </span>
-          <span>
-            {{
-              n.name +
-              (n.active
-                ? ''
-                : ` (${t('components.node.nodeStatus.label.offline')})`)
-            }}
-          </span>
+          <span>{{ n.name }}</span>
         </el-option>
       </el-select>
     </cl-form-item>