诊断任务管理-添加编辑时间组件优化

src/api/iot/diagnoseMission.js

@@ -53,7 +53,7 @@ export function list(query) {
 //删除任务
 export function deleteMission(missionId) {
   return request({
-    url: `/iot/diagnoseMission/deleteMission/${missionId}`,
+    url: `/iot/diagnoseMission/deleteMission?missionId=${missionId}`,
     method: 'get'
   })
 }

src/views/iot/diagnoseMission/dialog.addMission.vue

@@ -18,26 +18,20 @@
           </el-row>
           <el-row>
             <el-col :span="19">
-              <el-form-item prop="beginTime" label="开始时间">
-                <el-input
-                  v-model="formData.beginTime"
-                  :maxlength="8"
-                  placeholder="请输入开始时间"
-                  clearable
-                />
+              <el-form-item  prop="beginTime" label="开始时间">
+                <el-time-picker style="width:100%"  v-model="formData.beginTime" value-format="HH:mm:ss"
+                                 placeholder="开始时间"  @change="startDateChanged">
+                </el-time-picker>
               </el-form-item>
             </el-col>
           </el-row>
 
           <el-row>
             <el-col :span="19">
-              <el-form-item prop="endTime" label="结束时间">
-                <el-input
-                  v-model="formData.endTime"
-                  :maxlength="8"
-                  placeholder="请输入结束时间"
-                  clearable
-                />
+              <el-form-item  prop="endTime" label="结束时间">
+                <el-time-picker style="width:100%"  v-model="formData.endTime"  value-format="HH:mm:ss"
+                                 placeholder="结束时间"  @change="endDateChanged">
+                </el-time-picker>
               </el-form-item>
             </el-col>
           </el-row>
@@ -81,6 +75,7 @@
 <script>
 import {mapMutations, mapState} from "vuex";
 import {addMission,editMission} from "@/api/iot/diagnoseMission";
+import dayjs from "dayjs";
 
 export default {
   components: {},
@@ -118,15 +113,14 @@ export default {
   },
   methods: {
     ...mapMutations([]),
-    reset(other = {}) {
+    reset() {
       return {
         missionId: null,
         name: null,
-        startTime: null,
-        endTime: null,
+        beginTime: "00:00:00",
+        endTime: "23:59:59",
         cycle: "",
         enabled: 1,
-        ...other,
       };
     },
     async show(formData) {
@@ -148,6 +142,7 @@ export default {
     async onSubmit() {
       this.$refs["form"].validate(async (valid) => {
         if (valid) {
+
             if (!this.formData.missionId) {
               await addMission(this.formData).then(r => {
                   this.$modal.msgSuccess("新增成功");
@@ -162,6 +157,16 @@ export default {
         }
       });
     },
+    startDateChanged(time) {
+      if (dayjs(this.formData.beginTime).isAfter(dayjs(this.formData.endTime))) {
+        this.formData.endTime = this.formData.beginTime;
+      }
+    },
+    endDateChanged(time) {
+      if (dayjs(this.formData.beginTime).isAfter(dayjs(this.formData.endTime))) {
+        this.formData.beginTime = this.formData.endTime;
+      }
+    },
 
     validatePort(rule, value, callback) {
       if (!value) {