diff --git a/frontend/src/views/CreateTask.vue b/frontend/src/views/CreateTask.vue
index cab59c0..ea8eb4b 100644
--- a/frontend/src/views/CreateTask.vue
+++ b/frontend/src/views/CreateTask.vue
@@ -68,7 +68,7 @@
               <div class="task-types-list">
                 <div
                   v-for="(item, index) in formData.taskTypes"
-                  :key="item.id || index"
+                  :key="item.id"
                   class="task-type-item"
                   :class="{ 'dragging': dragIndex === index, 'drag-over': dragOverIndex === index }"
                   @dragover.prevent="handleDragOver($event, index)"
@@ -630,6 +630,7 @@ const previewUploading = ref(false)
 
 // 任务类型项接口
 interface TaskTypeItem {
+  id?: string // 唯一标识符，用于拖拽排序
   taskTypeId: number | undefined
   taskTypePath?: (string | number)[]  // 级联选择路径 [level1Id, level2Id, level3Id]
   quantity: number
@@ -653,12 +654,17 @@ const designersCache = reactive<Record<string, any[]>>({})
 const dragIndex = ref<number | null>(null)
 const dragOverIndex = ref<number | null>(null)
 
+// 生成唯一ID
+const generateTaskTypeId = () => {
+  return `task-type-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`
+}
+
 // 表单数据
 const formData = reactive({
   title: '',
   isPipeline: true,  // 固定为流水线任务
   pipelineMode: 'sequential' as 'sequential' | 'parallel',  // 固定为顺序流水线
-  taskTypes: [{ taskTypeId: undefined, taskTypePath: undefined, quantity: 1, receiverId: undefined, selectedDeptId: undefined }] as TaskTypeItem[],  // 任务类型数组
+  taskTypes: [{ id: generateTaskTypeId(), taskTypeId: undefined, taskTypePath: undefined, quantity: 1, receiverId: undefined, selectedDeptId: undefined }] as TaskTypeItem[],  // 任务类型数组
   taskSubType: '',  // 动态加载，初始为空
   brandId: undefined,
   platformId: undefined,
@@ -928,6 +934,7 @@ const getDesignersForItem = (item: TaskTypeItem) => {
 // 添加任务类型
 const addTaskType = () => {
   formData.taskTypes.push({
+    id: generateTaskTypeId(),
     taskTypeId: undefined,
     taskTypePath: undefined,
     quantity: 1,
@@ -1012,8 +1019,12 @@ const handleDrop = (e: DragEvent, targetIndex: number) => {
   console.log('拖拽排序:', sourceIndex, '->', targetIndex)
   
   // 交换位置 - 使用 splice 原地修改数组以确保响应式更新
-  const [removed] = formData.taskTypes.splice(sourceIndex, 1)
-  formData.taskTypes.splice(targetIndex, 0, removed)
+  const newTaskTypes = [...formData.taskTypes]
+  const [removed] = newTaskTypes.splice(sourceIndex, 1)
+  newTaskTypes.splice(targetIndex, 0, removed)
+  
+  // 直接替换整个数组以触发 Vue 的响应式更新
+  formData.taskTypes = newTaskTypes
   
   // 重新计算积分（pipelineGroups 是 computed，会自动更新）
   calculateScore()
@@ -1896,6 +1907,7 @@ const loadTaskForEdit = async (taskId: number) => {
               
               for (const detail of details) {
                 taskTypeItems.push({
+                  id: generateTaskTypeId(),
                   taskTypeId: detail.typeId,
                   quantity: detail.quantity || 1,
                   receiverId: detail.receiverId || subTask.receiverId,
@@ -1906,6 +1918,7 @@ const loadTaskForEdit = async (taskId: number) => {
               console.warn('解析typeDetails失败:', e)
               // 解析失败时使用子任务的基本信息
               taskTypeItems.push({
+                id: generateTaskTypeId(),
                 taskTypeId: subTask.taskTypeId,
                 quantity: subTask.quantity || 1,
                 receiverId: subTask.receiverId,
@@ -1915,6 +1928,7 @@ const loadTaskForEdit = async (taskId: number) => {
           } else {
             // 没有typeDetails时使用子任务的基本信息
             taskTypeItems.push({
+              id: generateTaskTypeId(),
               taskTypeId: subTask.taskTypeId,
               quantity: subTask.quantity || 1,
               receiverId: subTask.receiverId,