From 2362f8bce1fc26a28b3c2a019ae3216efa399de5 Mon Sep 17 00:00:00 2001
From: 15179599649 <zhangyiyao89@qq.com>
Date: Mon, 11 Mar 2024 09:05:22 +0800
Subject: [PATCH] 细节样式调整
---
src/components/task/CreatePlan.vue | 606 ++++++++++++++++++++++++++++++++++--------------------
1 files changed, 381 insertions(+), 225 deletions(-)
diff --git a/src/components/task/CreatePlan.vue b/src/components/task/CreatePlan.vue
index 6fc96bd..3a2d363 100644
--- a/src/components/task/CreatePlan.vue
+++ b/src/components/task/CreatePlan.vue
@@ -1,54 +1,66 @@
<template>
<div class="create-plan-wrapper">
- <div class="header">
- 创建计划
- </div>
+ <div class="header">创建计划</div>
<div class="content">
- <a-form ref="valueRef" layout="horizontal" :hideRequiredMark="true" :rules="rules" :model="planBody"
- labelAlign="left">
+ <a-form
+ ref="valueRef"
+ layout="horizontal"
+ :hideRequiredMark="true"
+ :rules="rules"
+ :model="planBody"
+ labelAlign="left"
+ >
<a-form-item label="计划名称" name="name" :labelCol="{ span: 23 }">
- <a-input style="background: black;" placeholder="请输入计划名称" v-model:value="planBody.name"/>
+ <a-input style="background: black;" placeholder="请输入计划名称" v-model:value="planBody.name" />
</a-form-item>
<!-- 航线 -->
<a-form-item class="text-r" label="执行航线" :wrapperCol="{ offset: 7 }" name="file_id">
- <router-link :to="{ name: 'select-plan' }" @click="selectRoute">
- 选择航线
- </router-link>
+ <router-link :to="{ name: 'select-plan' }" @click="selectRoute">选择航线</router-link>
</a-form-item>
<a-form-item v-if="planBody.file_id" style="margin-top: -15px;">
<div class="wayline-panel" style="padding-top: 5px;">
<div class="title">
<a-tooltip :title="wayline.name">
- <div class="pr10" style="width: 120px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;">
+ <div
+ class="pr10"
+ style="width: 120px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;"
+ >
{{
- wayline.name
+ wayline.name
}}
</div>
</a-tooltip>
<div class="ml10">
- <UserOutlined/>
+ <UserOutlined />
</div>
<a-tooltip :title="wayline.user_name">
- <div class="ml5 pr10"
- style="width: 80px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;">{{
- wayline.user_name
+ <div
+ class="ml5 pr10"
+ style="width: 80px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;"
+ >
+ {{
+ wayline.user_name
}}
</div>
</a-tooltip>
</div>
<div class="ml10 mt5" style="color: hsla(0,0%,100%,0.65);">
<span>
- <RocketOutlined/>
+ <RocketOutlined />
</span>
- <span class="ml5">{{
- Object.keys(EDeviceType)[Object.values(EDeviceType).indexOf(wayline.drone_model_key)]
- }}</span>
+ <span class="ml5">
+ {{
+ Object.keys(EDeviceType)[Object.values(EDeviceType).indexOf(wayline.drone_model_key)]
+ }}
+ </span>
<span class="ml10">
- <CameraFilled style="border-top: 1px solid; padding-top: -3px;"/>
+ <CameraFilled style="border-top: 1px solid; padding-top: -3px;" />
</span>
- <span class="ml5" v-for="payload in wayline.payload_model_keys" :key="payload.id">
- {{ Object.keys(EDeviceType)[Object.values(EDeviceType).indexOf(payload)] }}
- </span>
+ <span
+ class="ml5"
+ v-for="payload in wayline.payload_model_keys"
+ :key="payload.id"
+ >{{ Object.keys(EDeviceType)[Object.values(EDeviceType).indexOf(payload)] }}</span>
</div>
<div class="mt5 ml10" style="color: hsla(0,0%,100%,0.35);">
<span class="mr10">更新时间: {{ new Date(wayline.update_time).toLocaleString() }}</span>
@@ -57,26 +69,36 @@
</a-form-item>
<!-- 设备 -->
- <a-form-item class="text-r" label="执行设备" :wrapperCol="{ offset: 10 }" v-model:value="planBody.dock_sn"
- name="dock_sn">
- <router-link :to="{ name: 'select-plan' }" @click="selectDevice"
- style="width: 100%;flex:1;text-align: right;">选择设备
- </router-link>
+ <a-form-item
+ class="text-r"
+ label="执行设备"
+ :wrapperCol="{ offset: 10 }"
+ v-model:value="planBody.dock_sn"
+ name="dock_sn"
+ >
+ <router-link
+ :to="{ name: 'select-plan' }"
+ @click="selectDevice"
+ style="width: 100%;flex:1;text-align: right;"
+ >选择设备</router-link>
</a-form-item>
<a-form-item v-if="planBody.dock_sn" style="margin-top: -15px;">
<div class="panel" style="padding-top: 5px;" @click="selectDock(dock)">
<div class="title">
<a-tooltip :title="dock.nickname">
- <div class="pr10" style="width: 120px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;">
+ <div
+ class="pr10"
+ style="width: 120px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;"
+ >
{{
- dock.nickname
+ dock.nickname
}}
</div>
</a-tooltip>
</div>
<div class="ml10 mt5" style="color: hsla(0,0%,100%,0.65);">
<span>
- <RocketOutlined/>
+ <RocketOutlined />
</span>
<span class="ml5">{{ dock.children?.nickname ?? 'No drone' }}</span>
</div>
@@ -86,46 +108,84 @@
<!-- 任务类型 -->
<a-form-item label="任务策略" class="plan-timer-form-item" :labelCol="{ span: 23 }">
<div style="white-space: nowrap;">
- <a-radio-group class="task-plan-radio-group" v-model:value="planBody.task_type" button-style="solid">
- <a-radio-button v-for="type in TaskTypeOptions" :value="type.value" :key="type.value">
- {{ type.label }}
- </a-radio-button>
+ <a-radio-group
+ class="task-plan-radio-group"
+ v-model:value="planBody.task_type"
+ button-style="solid"
+ >
+ <a-radio-button
+ v-for="type in TaskTypeOptions"
+ :value="type.value"
+ :key="type.value"
+ >{{ type.label }}</a-radio-button>
</a-radio-group>
</div>
</a-form-item>
<!-- 执行时间 (单次定时)-->
- <a-form-item label="执行时间" v-if="planBody.task_type === TaskType.Timed" name="select_execute_time"
- :labelCol="{ span: 23 }">
- <a-date-picker v-model:value="planBody.select_execute_time" format="YYYY-MM-DD HH:mm:ss" show-time
- placeholder="请选择开始时间"/>
+ <a-form-item
+ label="执行时间"
+ v-if="planBody.task_type === TaskType.Timed"
+ name="select_execute_time"
+ :labelCol="{ span: 23 }"
+ >
+ <a-date-picker
+ v-model:value="planBody.select_execute_time"
+ format="YYYY-MM-DD HH:mm:ss"
+ show-time
+ placeholder="请选择开始时间"
+ />
</a-form-item>
<!-- 执行日期-->
- <a-form-item label="执行日期"
- v-if="planBody.task_type === TaskType.Repeat || planBody.task_type === TaskType.Continuous"
- name="time_range" :labelCol="{ span: 23 }">
- <a-range-picker v-model:value="planBody.time_range" format="YYYY-MM-DD"
- :placeholder="['开始时间','结束时间']"/>
+ <a-form-item
+ label="执行日期"
+ v-if="planBody.task_type === TaskType.Repeat || planBody.task_type === TaskType.Continuous"
+ name="time_range"
+ :labelCol="{ span: 23 }"
+ >
+ <a-range-picker
+ v-model:value="planBody.time_range"
+ format="YYYY-MM-DD"
+ :placeholder="['开始时间','结束时间']"
+ />
</a-form-item>
<!-- 执行时间 (重复定时)-->
<div v-if="planBody.task_type === TaskType.Repeat">
<div class="execute-time-arr-item">
<a-form-item
- v-for="(item, index) in planBody.executeTimeRepeatArr"
- :key="item.index"
- :label="index === 0 ? '执行时间' : ''"
- :name="item.index+'repValue'"
- :labelCol="{ span: 23 }"
- :rules="[{
+ v-for="(item, index) in planBody.executeTimeRepeatArr"
+ :key="item.index"
+ :label="index === 0 ? '执行时间' : ''"
+ :name="item.index+'repValue'"
+ :labelCol="{ span: 23 }"
+ :rules="[{
required: true,
trigger: ['change','blur'],
validator: validateRepeatExecuteTime
}]"
>
- <a-time-picker v-model:value="item.value" @change="onRepeatChange(item)" format="HH:mm"/>
- <a-button @click="addTime" type="default" shape="circle" :size="componentOptions.size">
+ <div style="display:flex;align-items:center;">
+ <a-time-picker
+ v-model:value="item.value"
+ @change="onRepeatChange(item)"
+ format="HH:mm"
+ placeholder="请选择"
+ />
+ <p class="iconMargin" style="height:25px">
+ <PlusCircleOutlined
+ style="fontSize:18px;color:#ffffff;padding-top:10px;"
+ class="PlusCircle"
+ @click="addTime"
+ />
+ <MinusCircleOutlined
+ style="fontSize:18px;color:#ffffff"
+ @click="deleteTime(item)"
+ />
+ </p>
+ </div>
+ <!-- <a-button @click="addTime" type="default" shape="circle" :size="componentOptions.size">
<template #icon>
<PlusCircleOutlined/>
</template>
@@ -134,7 +194,7 @@
<template #icon>
<MinusCircleOutlined/>
</template>
- </a-button>
+ </a-button>-->
</a-form-item>
</div>
</div>
@@ -142,141 +202,208 @@
<!-- 执行时间 (连续执行)-->
<div v-if="planBody.task_type === TaskType.Continuous">
<a-form-item
- v-for="(item, index) in planBody.executeTimeContinuousArr"
- :key="item.index"
- :label="index === 0 ? '执行时间' : ''"
- :name="item.index+'conValue'"
- :labelCol="{ span: 23 }"
- :rules="{
+ v-for="(item, index) in planBody.executeTimeContinuousArr"
+ :key="item.index"
+ :label="index === 0 ? '执行时间' : ''"
+ :name="item.index+'conValue'"
+ :labelCol="{ span: 23 }"
+ :rules="{
required: true,
trigger: ['change', 'blur'],
validator: validateContinuousExecuteTime
}"
>
-
<div class="execute-time-arr-continuous-item">
<div class="time-select">
<div class="time-item">
- <a-time-picker style="width: 100px;" v-model:value="item.value[0]" @change="onContinuousChange(item)"
- format="HH:mm"/>
+ <a-time-picker
+ style="width: 100px;"
+ v-model:value="item.value[0]"
+ @change="onContinuousChange(item)"
+ format="HH:mm"
+ placeholder="请选择"
+ />
</div>
- <div style="color: white">-</div>
+ <div style="color: white">—</div>
<div class="time-item">
- <a-time-picker style="width: 100px;" v-model:value="item.value[1]" @change="onContinuousChange(item)"
- format="HH:mm"/>
+ <a-time-picker
+ style="width: 100px;"
+ placeholder="请选择"
+ v-model:value="item.value[1]"
+ @change="onContinuousChange(item)"
+ format="HH:mm"
+ />
</div>
</div>
<div class="btn-group">
- <a-button @click="addTime" type="default" shape="circle" :size="componentOptions.size">
+ <p class="iconMargin" style="height:23px">
+ <PlusCircleOutlined
+ style="fontSize:17px;color:#ffffff;padding-top:10px;"
+ class="PlusCircle"
+ @click="addTime"
+ />
+ <MinusCircleOutlined
+ style="fontSize:17px;color:#ffffff"
+ @click="deleteTime(item)"
+ />
+ </p>
+ <!-- <a-button
+ @click="addTime"
+ type="default"
+ shape="circle"
+ :size="componentOptions.size"
+ >
<template #icon>
- <PlusCircleOutlined/>
+ <PlusCircleOutlined />
</template>
</a-button>
- <a-button @click="deleteTime(item)" type="default" shape="circle" :size="componentOptions.size">
+ <a-button
+ @click="deleteTime(item)"
+ type="default"
+ shape="circle"
+ :size="componentOptions.size"
+ >
<template #icon>
- <MinusCircleOutlined/>
+ <MinusCircleOutlined />
</template>
- </a-button>
+ </a-button>-->
</div>
</div>
</a-form-item>
</div>
<!-- 任务开始执行的电量-->
- <a-form-item label="任务开始执行的电量" v-if=" planBody.task_type === TaskType.Continuous"
- name="min_battery_capacity" :labelCol="{ span: 23 }">
- <a-input style="background: black;" v-model:value="planBody.min_battery_capacity"/>
+ <a-form-item
+ label="任务开始执行的电量"
+ v-if=" planBody.task_type === TaskType.Continuous"
+ name="min_battery_capacity"
+ :labelCol="{ span: 23 }"
+ >
+ <a-input style="background: black;" v-model:value="planBody.min_battery_capacity" />
</a-form-item>
<!-- 重复频率-->
- <a-form-item label="重复频率"
- v-if="planBody.task_type === TaskType.Repeat || planBody.task_type === TaskType.Continuous"
- name="rep_fre_val"
- :labelCol="{ span: 23 }">
+ <a-form-item
+ label="重复频率"
+ v-if="planBody.task_type === TaskType.Repeat || planBody.task_type === TaskType.Continuous"
+ name="rep_fre_val"
+ :labelCol="{ span: 23 }"
+ >
<div class="rep-fre-item">
<div>每</div>
<div style="width: 150px">
- <a-input style="background: black;" v-model:value="planBody.rep_fre_val"/>
+ <a-input style="background: black;" v-model:value="planBody.rep_fre_val" />
</div>
- <div style="width: 100px">
- <a-select v-model:value="planBody.rep_fre_type" style="background-color: black"
- :options="FrequencyTypeOptions"></a-select>
+ <div style="width: 100px;">
+ <a-select
+ v-model:value="planBody.rep_fre_type"
+ style="background-color: black"
+ :options="FrequencyTypeOptions"
+ ></a-select>
</div>
</div>
</a-form-item>
<!-- 重复频率-->
<a-form-item
- v-if="(planBody.task_type === TaskType.Repeat || planBody.task_type === TaskType.Continuous) && planBody.rep_fre_type === FrequencyType.week"
- :labelCol="{ span: 23 }">
- <a-button class="btn" :class="[item.checked?'btn-selected':'btn-unselected'] "
- v-for="(item,index) in weekNumArr" :key="index" size="small" @click="selectWeekBtn(item)">
- {{ item.label }}
- </a-button>
+ v-if="(planBody.task_type === TaskType.Repeat || planBody.task_type === TaskType.Continuous) && planBody.rep_fre_type === FrequencyType.week"
+ :labelCol="{ span: 23 }"
+ class="repetitiveFrequency"
+ >
+ <a-button
+ class="btn"
+ :class="[item.checked?'btn-selected':'btn-unselected'] "
+ v-for="(item,index) in weekNumArr"
+ :key="index"
+ size="small"
+ @click="selectWeekBtn(item)"
+ >{{ item.label }}</a-button>
</a-form-item>
<!-- 重复规则-->
- <a-form-item label="重复规则"
- v-if="(planBody.task_type === TaskType.Repeat || planBody.task_type === TaskType.Continuous) && planBody.rep_fre_type === FrequencyType.month"
- :labelCol="{ span: 23 }">
+ <a-form-item
+ label="重复规则"
+ v-if="(planBody.task_type === TaskType.Repeat || planBody.task_type === TaskType.Continuous) && planBody.rep_fre_type === FrequencyType.month"
+ :labelCol="{ span: 23 }"
+ >
<div class="rep-rule-item">
<div class="rep-rule-type">
- <a-select v-model:value="planBody.rep_rule_type" style="background-color: black"
- :options="RepeatRuleTypeOptions"></a-select>
+ <a-select
+ v-model:value="planBody.rep_rule_type"
+ style="background-color: black"
+ :options="RepeatRuleTypeOptions"
+ ></a-select>
</div>
<div v-if="planBody.rep_rule_type === RepeatRuleType.day" class="rep-rule-val-day">
- <a-button class="btn" :class="[item.checked?'btn-selected':'btn-unselected'] "
- v-for="(item,index) in dayNumArr" :key="index" size="small" @click="selectBtn(item)">
- {{ item.value }}
- </a-button>
+ <a-button
+ class="btn"
+ :class="[item.checked?'btn-selected':'btn-unselected'] "
+ v-for="(item,index) in dayNumArr"
+ :key="index"
+ size="small"
+ @click="selectBtn(item)"
+ >{{ item.value }}</a-button>
</div>
<div v-if="planBody.rep_rule_type === RepeatRuleType.week" class="rep-rule-val-week">
- <a-select v-model:value="repeatRuleValueWeek[0]" style="background-color: black"
- :options="WhichWeekOptions"></a-select>
- <a-select v-model:value="repeatRuleValueWeek[1]" style="background-color: black"
- :options="WhichDayOptions"></a-select>
+ <a-select
+ v-model:value="repeatRuleValueWeek[0]"
+ style="background-color: black"
+ :options="WhichWeekOptions"
+ ></a-select>
+ <a-select
+ v-model:value="repeatRuleValueWeek[1]"
+ style="background-color: black"
+ :options="WhichDayOptions"
+ ></a-select>
</div>
</div>
</a-form-item>
<!-- RTH Altitude Relative to Dock -->
<a-form-item label="相对机场返航高度（ALT）" :labelCol="{ span: 23 }" name="rth_altitude">
- <a-input-number v-model:value="planBody.rth_altitude" :min="20" :max="1500" class="width-100" required>
- </a-input-number>
+ <a-input-number
+ v-model:value="planBody.rth_altitude"
+ :min="20"
+ :max="1500"
+ class="width-100"
+ required
+ ></a-input-number>
</a-form-item>
<!-- Lost Action -->
<a-form-item label="航线飞行中失联" :labelCol="{ span: 23 }" name="out_of_control_action">
<div style="white-space: nowrap;">
<a-radio-group v-model:value="planBody.out_of_control_action" button-style="solid">
- <a-radio-button v-for="action in OutOfControlActionOptions" :value="action.value" :key="action.value">
- {{ action.label }}
- </a-radio-button>
+ <a-radio-button
+ v-for="action in OutOfControlActionOptions"
+ :value="action.value"
+ :key="action.value"
+ >{{ action.label }}</a-radio-button>
</a-radio-group>
</div>
</a-form-item>
<a-form-item class="width-100" style="margin-bottom: 40px;">
<div class="footer">
- <a-button class="mr10" style="background: #3c3c3c;" @click="closePlan">取消
- </a-button>
- <a-button type="primary" @click="onSubmit" :disabled="disabled">确定
- </a-button>
+ <a-button class="mr10" style="background: #3c3c3c;" @click="closePlan">取消</a-button>
+ <a-button type="primary" @click="onSubmit" :disabled="disabled">确定</a-button>
</div>
</a-form-item>
</a-form>
</div>
</div>
- <div v-if="drawerVisible"
- style="position: absolute; left: 335px; width: 280px; height: 100vh; float: right; top: 0; z-index: 1000; color: white; background: #282828;">
+ <div
+ v-if="drawerVisible"
+ style="position: absolute; left: 350px; width: 280px; height: 100vh; float: right; top: 0; z-index: 1000; color: white; background: #282828;"
+ >
<div>
- <router-view :name="routeName"/>
+ <router-view :name="routeName" />
</div>
<div style="position: absolute; top: 15px; right: 10px;">
<a style="color: white;" @click="closePanel">
- <CloseOutlined/>
+ <CloseOutlined />
</a>
</div>
</div>
@@ -290,7 +417,7 @@
MinusCircleOutlined,
PlusCircleOutlined,
RocketOutlined,
- UserOutlined
+ UserOutlined,
} from '@ant-design/icons-vue'
import { ELocalStorageKey, ERouterName } from '/@/types'
import { useMyStore } from '/@/store'
@@ -308,7 +435,7 @@
TaskType,
TaskTypeOptions,
WhichDayOptions,
- WhichWeekOptions
+ WhichWeekOptions,
} from '/@/types/task'
import moment, { Moment } from 'moment'
import { RuleObject } from 'ant-design-vue/es/form/interface'
@@ -349,31 +476,31 @@
rep_rule_type: 1,
executeTimeContinuousArr: [{ index: 1, value: [] }],
- executeTimeRepeatArr: [{ index: 1, value: '' }]
+ executeTimeRepeatArr: [{ index: 1, value: '' }],
})
watch(
planBody.executeTimeRepeatArr,
(newVal) => {
if (newVal.length) {
- newVal.forEach(item => {
+ newVal.forEach((item) => {
planBody[`${item.index}repValue`] = item.value
})
}
},
- { deep: true, immediate: true }
+ { deep: true, immediate: true },
)
watch(
planBody.executeTimeContinuousArr,
(newVal) => {
if (newVal.length) {
- newVal.forEach(item => {
+ newVal.forEach((item) => {
planBody[`${item.index}conValue`] = item.value
})
}
},
- { deep: true, immediate: true }
+ { deep: true, immediate: true },
)
// 重复规则为按星期时
@@ -393,7 +520,7 @@
dayNumArr.value.push({
index: i + 1,
value: i + 1,
- checked: false
+ checked: false,
})
}
}
@@ -405,12 +532,12 @@
function selectBtn (item: any) {
item.checked = !item.checked
- repeatRuleValueDay.value = dayNumArr.value.filter(e => e.checked).map(e => e.value)
+ repeatRuleValueDay.value = dayNumArr.value.filter((e) => e.checked).map((e) => e.value)
}
function selectWeekBtn (item: any) {
item.checked = !item.checked
- repeatFrequencyValueWeek.value = weekNumArr.value.filter(e => e.checked).map(e => e.value)
+ repeatFrequencyValueWeek.value = weekNumArr.value.filter((e) => e.checked).map((e) => e.value)
}
const drawerVisible = ref(false)
@@ -418,7 +545,7 @@
const rules = {
name: [
{ required: true, message: '请输入计划名称' },
- { max: 20, message: '计划名称长度在2-20之间', trigger: 'blur' }
+ { max: 20, message: '计划名称长度在2-20之间', trigger: 'blur' },
],
file_id: [{ required: true, message: '请选择航线' }],
dock_sn: [{ required: true, message: '请选择设备' }],
@@ -433,7 +560,7 @@
throw new Error('返航高度需在20-500米之间')
}
},
- }
+ },
],
min_battery_capacity: [
{
@@ -447,8 +574,8 @@
planBody.min_battery_capacity = 90
}
},
- trigger: 'blur'
- }
+ trigger: 'blur',
+ },
],
out_of_control_action: [{ required: true, message: '请选择航线飞行中失联' }],
rep_fre_val: [
@@ -459,9 +586,9 @@
throw new Error('重复频率不能为空')
}
},
- trigger: ['blur', 'change']
- }
- ]
+ trigger: ['blur', 'change'],
+ },
+ ],
}
function validateContinuousExecuteTime (rule: RuleObject, value: Moment[]) {
@@ -498,13 +625,13 @@
const index = planBody.executeTimeRepeatArr[planBody.executeTimeRepeatArr.length - 1].index
planBody.executeTimeRepeatArr.push({
index: index + 1,
- value: ''
+ value: '',
})
} else if (planBody.task_type === TaskType.Continuous) {
const index = planBody.executeTimeContinuousArr[planBody.executeTimeContinuousArr.length - 1].index
planBody.executeTimeContinuousArr.push({
index: index + 1,
- value: []
+ value: [],
})
}
}
@@ -512,106 +639,110 @@
// 删除执行时间
function deleteTime (item: any) {
if (planBody.task_type === TaskType.Repeat) {
- planBody.executeTimeRepeatArr = planBody.executeTimeRepeatArr.filter(e => e.index !== item.index)
+ planBody.executeTimeRepeatArr = planBody.executeTimeRepeatArr.filter((e) => e.index !== item.index)
} else if (planBody.task_type === TaskType.Continuous) {
- planBody.executeTimeContinuousArr = planBody.executeTimeContinuousArr.filter(e => e.index !== item.index)
+ planBody.executeTimeContinuousArr = planBody.executeTimeContinuousArr.filter((e) => e.index !== item.index)
}
}
function onSubmit () {
- valueRef.value.validate().then(() => {
- disabled.value = true
- const createPlanBody = { ...planBody } as unknown as CreatePlan
+ valueRef.value
+ .validate()
+ .then(() => {
+ disabled.value = true
+ const createPlanBody = ({ ...planBody } as unknown) as CreatePlan
- switch (planBody.task_type) {
- case TaskType.Timed:
- if (planBody.select_execute_time) {
- createPlanBody.task_days = [moment(planBody.select_execute_time).unix()]
- createPlanBody.task_periods = [createPlanBody.task_days]
- }
- break
- case TaskType.Repeat:
-
- createPlanBody.task_type = 2
-
- createPlanBody.task_days = [moment(planBody.time_range[0]).unix(), moment(planBody.time_range[1]).unix()]
- createPlanBody.task_periods = []
- // 执行时间
- planBody.executeTimeRepeatArr.forEach(item => {
- createPlanBody.task_periods.push([moment(item.value).unix()])
- })
-
- if (planBody.rep_fre_type === FrequencyType.month) {
- // 频率为月
- if (planBody.rep_rule_type === RepeatRuleType.day) {
- // 规则为按日期
- createPlanBody.rep_rule_val = repeatRuleValueDay.value
- } else {
- // 规则为按星期
- createPlanBody.rep_rule_val = repeatRuleValueWeek.value
+ switch (planBody.task_type) {
+ case TaskType.Timed:
+ if (planBody.select_execute_time) {
+ createPlanBody.task_days = [moment(planBody.select_execute_time).unix()]
+ createPlanBody.task_periods = [createPlanBody.task_days]
}
- } else if (planBody.rep_fre_type === FrequencyType.week) {
- createPlanBody.rep_rule_val = repeatFrequencyValueWeek.value
- }
+ break
+ case TaskType.Repeat:
+ createPlanBody.task_type = 2
- break
- case TaskType.Continuous:
- // createPlanBody.task_type = 2
- createPlanBody.task_days = [moment(planBody.time_range[0]).unix(), moment(planBody.time_range[1]).unix()]
+ createPlanBody.task_days = [moment(planBody.time_range[0]).unix(), moment(planBody.time_range[1]).unix()]
+ createPlanBody.task_periods = []
+ // 执行时间
+ planBody.executeTimeRepeatArr.forEach((item) => {
+ createPlanBody.task_periods.push([moment(item.value).unix()])
+ })
- if (planBody.rep_fre_type === FrequencyType.month) {
- // 频率为月
- if (planBody.rep_rule_type === RepeatRuleType.day) {
- // 规则为按日期
- createPlanBody.rep_rule_val = repeatRuleValueDay.value
- } else {
- // 规则为按星期
- createPlanBody.rep_rule_val = repeatRuleValueWeek.value
+ if (planBody.rep_fre_type === FrequencyType.month) {
+ // 频率为月
+ if (planBody.rep_rule_type === RepeatRuleType.day) {
+ // 规则为按日期
+ createPlanBody.rep_rule_val = repeatRuleValueDay.value
+ } else {
+ // 规则为按星期
+ createPlanBody.rep_rule_val = repeatRuleValueWeek.value
+ }
+ } else if (planBody.rep_fre_type === FrequencyType.week) {
+ createPlanBody.rep_rule_val = repeatFrequencyValueWeek.value
}
- } else if (planBody.rep_fre_type === FrequencyType.week) {
- createPlanBody.rep_rule_val = repeatFrequencyValueWeek.value
- }
- createPlanBody.task_periods = []
- // 执行时间
- planBody.executeTimeContinuousArr.forEach(item => {
- createPlanBody.task_periods.push([moment(item.value[0]).unix(), moment(item.value[1]).unix()])
- })
- break
- }
+ break
+ case TaskType.Continuous:
+ // createPlanBody.task_type = 2
+ createPlanBody.task_days = [moment(planBody.time_range[0]).unix(), moment(planBody.time_range[1]).unix()]
- createPlanBody.rth_altitude = Number(createPlanBody.rth_altitude)
- if (wayline.value && wayline.value.template_types && wayline.value.template_types.length > 0) {
- createPlanBody.wayline_type = wayline.value.template_types[0]
- }
+ if (planBody.rep_fre_type === FrequencyType.month) {
+ // 频率为月
+ if (planBody.rep_rule_type === RepeatRuleType.day) {
+ // 规则为按日期
+ createPlanBody.rep_rule_val = repeatRuleValueDay.value
+ } else {
+ // 规则为按星期
+ createPlanBody.rep_rule_val = repeatRuleValueWeek.value
+ }
+ } else if (planBody.rep_fre_type === FrequencyType.week) {
+ createPlanBody.rep_rule_val = repeatFrequencyValueWeek.value
+ }
+ createPlanBody.task_periods = []
+ // 执行时间
+ planBody.executeTimeContinuousArr.forEach((item) => {
+ createPlanBody.task_periods.push([moment(item.value[0]).unix(), moment(item.value[1]).unix()])
+ })
- if (planBody.task_type === TaskType.Immediate || planBody.task_type === TaskType.Timed) {
- createPlan(workspaceId, createPlanBody)
- .then(res => {
- disabled.value = false
- }).finally(() => {
- closePlan()
- })
- } else {
- createPlanBody.execute_start_time_arr = getFlyTimeList(createPlanBody)
- console.log(createPlanBody, '-----------------------')
-
- if (planBody.task_type === TaskType.Repeat) {
- createPlanBody.task_type = 1
- } else if (planBody.task_type === TaskType.Continuous) {
- createPlanBody.task_type = 2
+ break
}
- createPlanCondition(workspaceId, createPlanBody)
- .then(res => {
- disabled.value = false
- }).finally(() => {
- closePlan()
- })
- }
- }).catch((e: any) => {
- console.log('validate err', e)
- })
+ createPlanBody.rth_altitude = Number(createPlanBody.rth_altitude)
+ if (wayline.value && wayline.value.template_types && wayline.value.template_types.length > 0) {
+ createPlanBody.wayline_type = wayline.value.template_types[0]
+ }
+
+ if (planBody.task_type === TaskType.Immediate || planBody.task_type === TaskType.Timed) {
+ createPlan(workspaceId, createPlanBody)
+ .then((res) => {
+ disabled.value = false
+ })
+ .finally(() => {
+ closePlan()
+ })
+ } else {
+ createPlanBody.execute_start_time_arr = getFlyTimeList(createPlanBody)
+ console.log(createPlanBody, '-----------------------')
+
+ if (planBody.task_type === TaskType.Repeat) {
+ createPlanBody.task_type = 1
+ } else if (planBody.task_type === TaskType.Continuous) {
+ createPlanBody.task_type = 2
+ }
+
+ createPlanCondition(workspaceId, createPlanBody)
+ .then((res) => {
+ disabled.value = false
+ })
+ .finally(() => {
+ closePlan()
+ })
+ }
+ })
+ .catch((e: any) => {
+ console.log('validate err', e)
+ })
}
function closePlan () {
@@ -642,7 +773,7 @@
height: 100vh;
display: flex;
flex-direction: column;
- width: 285px;
+ width: 100%;
.header {
height: 52px;
@@ -659,8 +790,9 @@
}
.content {
- height: calc(100% - 54px);
+ height: calc(100vh - 110px);
overflow-y: auto;
+ padding-right: 30px;
form {
margin: 10px;
@@ -676,7 +808,9 @@
background-color: #232323;
color: #fff;
}
-
+ .ant-time-picker {
+ width: 100px !important;
+ }
.ant-input-suffix {
color: #fff;
}
@@ -715,7 +849,6 @@
.btn-group {
display: flex;
}
-
}
.rep-fre-item {
@@ -739,14 +872,12 @@
text-align: center;
line-height: 15px;
}
-
}
.rep-rule-val-week {
display: flex;
margin-top: 5px;
}
-
}
.btn-selected {
@@ -758,7 +889,6 @@
background: #3c3c3c !important;
color: white !important;
}
-
}
.footer {
@@ -825,4 +955,30 @@
font-weight: bold;
margin: 0px 10px 0 10px;
}
-}</style>
+}
+
+.anticon-plus-circle {
+ margin-left: 5px;
+}
+.anticon-minus-circle {
+ margin-left: 3px;
+}
+.iconMargin {
+ display: inline-block;
+}
+.ant-form-item {
+ margin-bottom: 0px !important;
+}
+.ant-time-picker-panel-combobox {
+ width: 100px !important;
+}
+.ant-time-picker-panel-input-wrap {
+ width: 100px !important;
+}
+.ant-time-picker-panel-select {
+ width: 50px !important;
+}
+.repetitiveFrequency {
+ margin-top: 10px !important;
+}
+</style>
--
Gitblit v1.9.3