359359 </div >
360360 </template >
361361 </el-dialog >
362+
363+ <!-- 编辑部署计划对话框 -->
364+ <el-dialog
365+ v-model =" showEditDialog"
366+ title =" 编辑部署计划"
367+ width =" 500px"
368+ :before-close =" cancelEdit"
369+ >
370+ <div class =" edit-deployment-form" >
371+ <div class =" form-item" >
372+ <label class =" form-label" >服务名称</label >
373+ <div class =" form-value" >{{ editingDeployment?.service || selectedNode?.name || '未知服务' }}</div >
374+ </div >
375+
376+ <div class =" form-item" >
377+ <label class =" form-label" >版本号</label >
378+ <div class =" form-value" >{{ editingDeployment?.version }}</div >
379+ </div >
380+
381+ <div class =" form-item" >
382+ <label class =" form-label" >计划发布时间 <span class =" required" >*</span ></label >
383+ <el-date-picker
384+ v-model =" editForm.scheduleTime"
385+ type =" datetime"
386+ placeholder =" 选择发布时间"
387+ format =" YYYY-MM-DD HH:mm"
388+ value-format =" YYYY-MM-DDTHH:mm"
389+ style =" width : 100% "
390+ />
391+ </div >
392+ </div >
393+
394+ <template #footer >
395+ <div class =" dialog-footer" >
396+ <el-button @click =" cancelEdit" >取消</el-button >
397+ <el-button type =" primary" @click =" saveEditDeployment" >保存</el-button >
398+ </div >
399+ </template >
400+ </el-dialog >
362401 </div >
363402</template >
364403
@@ -402,6 +441,13 @@ const selectedSlice = ref<{ nodeId: string; label: string } | null>(null)
402441// 指标图表引用
403442const latencyChartRef = ref <HTMLElement >()
404443const trafficChartRef = ref <HTMLElement >()
444+
445+ // 编辑部署对话框状态
446+ const showEditDialog = ref (false )
447+ const editingDeployment = ref <any >(null )
448+ const editForm = ref ({
449+ scheduleTime: ' '
450+ })
405451const errorsChartRef = ref <HTMLElement >()
406452const saturationChartRef = ref <HTMLElement >()
407453
@@ -800,6 +846,7 @@ const deploymentPlansForDisplay = computed(() => {
800846
801847 return {
802848 id: plan .id ,
849+ service: plan .service , // 保留服务名称字段
803850 version: plan .version ,
804851 status: statusMap [plan .status ] || plan .status ,
805852 time: generateTimeDisplay (),
@@ -1032,7 +1079,53 @@ const createRelease = async () => {
10321079}
10331080
10341081const editRelease = (release : any ) => {
1035- ElMessage .info (' 编辑发布功能待实现' )
1082+ editingDeployment .value = release
1083+ // 将计划时间转换为本地时间格式(YYYY-MM-DDTHH:mm)
1084+ if (release .scheduleTime ) {
1085+ const date = new Date (release .scheduleTime )
1086+ const year = date .getFullYear ()
1087+ const month = String (date .getMonth () + 1 ).padStart (2 , ' 0' )
1088+ const day = String (date .getDate ()).padStart (2 , ' 0' )
1089+ const hours = String (date .getHours ()).padStart (2 , ' 0' )
1090+ const minutes = String (date .getMinutes ()).padStart (2 , ' 0' )
1091+ editForm .value .scheduleTime = ` ${year }-${month }-${day }T${hours }:${minutes } `
1092+ } else {
1093+ editForm .value .scheduleTime = ' '
1094+ }
1095+ showEditDialog .value = true
1096+ }
1097+
1098+ // 保存编辑的部署计划
1099+ const saveEditDeployment = async () => {
1100+ if (! editingDeployment .value ) return
1101+
1102+ try {
1103+ // 将本地时间转换为ISO格式
1104+ const scheduleTime = editForm .value .scheduleTime ? new Date (editForm .value .scheduleTime ).toISOString () : undefined
1105+
1106+ const result = await apiService .updateDeployment (editingDeployment .value .id , {
1107+ scheduleTime: scheduleTime
1108+ })
1109+
1110+ if (result .status === 200 ) {
1111+ ElMessage .success (' 部署计划已更新' )
1112+ showEditDialog .value = false
1113+ // 刷新发布计划列表
1114+ await loadServiceDeploymentPlans (selectedNode .value ?.name || ' ' )
1115+ } else {
1116+ ElMessage .error (' 更新部署计划失败' )
1117+ }
1118+ } catch (error ) {
1119+ console .error (' 更新部署计划失败:' , error )
1120+ ElMessage .error (' 更新部署计划失败' )
1121+ }
1122+ }
1123+
1124+ // 取消编辑
1125+ const cancelEdit = () => {
1126+ showEditDialog .value = false
1127+ editingDeployment .value = null
1128+ editForm .value .scheduleTime = ' '
10361129}
10371130
10381131const confirmCancel = async (plan : any ) => {
@@ -1934,4 +2027,42 @@ const disposeMetricsCharts = () => {
19342027 align-items : stretch ;
19352028 }
19362029}
2030+
2031+ /* 编辑部署对话框样式 */
2032+ .edit-deployment-form {
2033+ padding : 20px 0 ;
2034+ }
2035+
2036+ .form-item {
2037+ margin-bottom : 20px ;
2038+ }
2039+
2040+ .form-label {
2041+ display : block ;
2042+ font-size : 14px ;
2043+ font-weight : 500 ;
2044+ color : #374151 ;
2045+ margin-bottom : 8px ;
2046+ }
2047+
2048+ .form-label .required {
2049+ color : #ef4444 ;
2050+ margin-left : 4px ;
2051+ }
2052+
2053+ .form-value {
2054+ font-size : 14px ;
2055+ color : #6b7280 ;
2056+ padding : 8px 12px ;
2057+ background-color : #f9fafb ;
2058+ border : 1px solid #e5e7eb ;
2059+ border-radius : 6px ;
2060+ min-height : 20px ;
2061+ }
2062+
2063+ .dialog-footer {
2064+ display : flex ;
2065+ justify-content : flex-end ;
2066+ gap : 12px ;
2067+ }
19372068 </style >
0 commit comments