增加创建计划组件

src/components/PlanList.vue

@@ -37,56 +37,38 @@
       </el-table>
     </el-card>
 
-    <!-- 添加/编辑计划对话框 -->
-    <el-dialog v-model="dialogVisible" :title="dialogTitle" width="50%">
-      <el-form :model="currentPlan" label-width="120px">
-        <el-form-item label="计划名称">
-          <el-input v-model="currentPlan.name" />
-        </el-form-item>
-        <el-form-item label="描述">
-          <el-input v-model="currentPlan.description" type="textarea" />
-        </el-form-item>
-        <el-form-item label="执行类型">
-          <el-select v-model="currentPlan.execution_type" placeholder="请选择执行类型">
-            <el-option label="自动执行" value="automatic" />
-            <el-option label="手动执行" value="manual" />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="内容类型" v-if="!isEdit">
-          <el-radio-group v-model="contentType">
-            <el-radio label="tasks">任务</el-radio>
-            <el-radio label="sub_plans">子计划</el-radio>
-          </el-radio-group>
-        </el-form-item>
-      </el-form>
-      <template #footer>
-        <span class="dialog-footer">
-          <el-button @click="dialogVisible = false">取消</el-button>
-          <el-button type="primary" @click="savePlan">保存</el-button>
-        </span>
-      </template>
-    </el-dialog>
+    <!-- 使用新的计划表单组件 -->
+    <PlanForm 
+      v-model:visible="dialogVisible" 
+      :plan-data="currentPlan" 
+      :is-edit="isEdit"
+      @success="handlePlanSuccess"
+      @cancel="handlePlanCancel"
+    />
   </div>
 </template>
 
 <script>
 import apiClient from '../api/index.js';
+import PlanForm from './PlanForm.vue';
 
 export default {
   name: 'PlanList',
+  components: {
+    PlanForm
+  },
   data() {
     return {
       plans: [],
       dialogVisible: false,
-      dialogTitle: '',
       isEdit: false,
-      contentType: 'tasks',
       currentPlan: {
         id: null,
         name: '',
         description: '',
         execution_type: 'automatic',
-        content_type: 'tasks'
+        execute_num: 0,
+        cron_expression: ''
       },
       startingPlanId: null
     };
@@ -107,19 +89,19 @@ export default {
     },
     
     addPlan() {
-      this.dialogTitle = '添加计划';
       this.currentPlan = {
         id: null,
         name: '',
         description: '',
-        execution_type: 'automatic'
+        execution_type: 'automatic',
+        execute_num: 0,
+        cron_expression: ''
       };
       this.isEdit = false;
       this.dialogVisible = true;
     },
     
     editPlan(plan) {
-      this.dialogTitle = '编辑计划';
       this.currentPlan = { ...plan };
       this.isEdit = true;
       this.dialogVisible = true;
@@ -156,28 +138,33 @@ export default {
       }
     },
     
-    async savePlan() {
+    // 处理计划表单提交成功
+    async handlePlanSuccess(planData) {
       try {
         if (this.isEdit) {
           // 编辑计划
-          await apiClient.plans.update(this.currentPlan.id, this.currentPlan);
+          await apiClient.plans.update(planData.id, planData);
           this.$message.success('计划更新成功');
         } else {
           // 添加新计划
-          const planData = {
-            ...this.currentPlan,
-            content_type: this.contentType
+          const planRequest = {
+            ...planData,
+            content_type: 'tasks' // 默认使用任务类型
           };
           
-          await apiClient.plans.create(planData);
+          await apiClient.plans.create(planRequest);
           this.$message.success('计划添加成功');
         }
         
-        this.dialogVisible = false;
         await this.loadPlans();
       } catch (err) {
         this.$message.error('保存失败: ' + (err.message || '未知错误'));
       }
+    },
+    
+    // 处理计划表单取消
+    handlePlanCancel() {
+      this.dialogVisible = false;
     }
   }
 };