refactor: 合并代码修改部分页面显示

frontend/src/business/components/common/components/MsScheduleConfig.vue

@@ -6,13 +6,15 @@
           <span class="character">SCHEDULER</span>
         </span>
       <el-switch :disabled="!schedule.value || isReadOnly" v-model="schedule.enable" @change="scheduleChange"/>
-        <ms-schedule-edit :is-read-only="isReadOnly" :schedule="schedule" :save="save" :custom-validate="customValidate" ref="scheduleEdit"/>
+      <ms-schedule-edit :is-read-only="isReadOnly" :schedule="schedule" :save="save" :custom-validate="customValidate"
+                        ref="scheduleEdit"/>
 
     </div>
     <div>
         <span>
-          {{$t('schedule.next_execution_time')}}：
-          <span :class="{'disable-character': !schedule.enable}" v-if="!schedule.enable">{{$t('schedule.not_set')}}</span>
+          {{ $t('schedule.next_execution_time') }}：
+          <span :class="{'disable-character': !schedule.enable}"
+                v-if="!schedule.enable">{{ $t('schedule.not_set') }}</span>
           <crontab-result v-if="schedule.enable" :enable-simple-mode="true" :ex="schedule.value" ref="crontabResult"/>
         </span>
     </div>
@@ -20,12 +22,14 @@
 </template>
 
 <script>
-    import MsScheduleEdit from "./MsScheduleEdit";
-    import CrontabResult from "../cron/CrontabResult";
+import MsScheduleEdit from "./MsScheduleEdit";
+import CrontabResult from "../cron/CrontabResult";
 
-    function defaultCustomValidate() {return {pass: true};}
+function defaultCustomValidate() {
+  return {pass: true};
+}
 
-    export default {
+export default {
   name: "MsScheduleConfig",
   components: {CrontabResult, MsScheduleEdit},
   data() {
@@ -40,7 +44,9 @@
       type: Function,
       default() {
         return {
-              checkOpen() {return true;}
+          checkOpen() {
+            return true;
+          }
         }
       }
     },
@@ -67,38 +73,38 @@
       this.$refs.crontabResult.expressionChange();
     }
   }
-    }
+}
 </script>
 
 <style scoped>
 
-  .schedule-config {
+.schedule-config {
   float: right;
   width: 250px;
   height: 15px;
   line-height: 25px;
-  }
+}
 
-  .el-icon-date {
+.el-icon-date {
   font-size: 20px;
   margin-left: 5px;
-  }
+}
 
-  .character {
+.character {
   font-weight: bold;
   margin: 0 5px;
-  }
+}
 
-  .disable-character {
+.disable-character {
   color: #cccccc;
-  }
+}
 
-  .el-switch {
+.el-switch {
   margin: 0 5px;
-  }
+}
 
-  .cron-ico {
+.cron-ico {
   cursor: pointer;
-  }
+}
 
 </style>

frontend/src/business/components/common/components/MsScheduleEdit.vue

@@ -1,8 +1,6 @@
 <template>
-  <el-dialog :close-on-click-modal="false" width="35%" class="schedule-edit" :visible.sync="dialogVisible"
+  <el-dialog :close-on-click-modal="false" width="70%" class="schedule-edit" :visible.sync="dialogVisible"
              @close="close">
-    <template>
-      <div>
     <el-tabs v-model="activeName" @tab-click="handleClick">
       <el-tab-pane :label="$t('schedule.edit_timer_task')" name="first">
         <el-form :model="form" :rules="rules" ref="from">
@@ -11,16 +9,16 @@
             <el-input :disabled="isReadOnly" v-model="form.cronValue" class="inp"
                       :placeholder="$t('schedule.please_input_cron_expression')"/>
             <!--          <el-button type="primary" @click="showCronDialog">{{$t('schedule.generate_expression')}}</el-button>-->
-                <el-button :disabled="isReadOnly" type="primary" @click="saveCron">{{$t('commons.save')}}</el-button>
+            <el-button :disabled="isReadOnly" type="primary" @click="saveCron">{{ $t('commons.save') }}</el-button>
           </el-form-item>
           <el-form-item>
             <el-link :disabled="isReadOnly" type="primary" @click="showCronDialog">
-                  {{$t('schedule.generate_expression')}}
+              {{ $t('schedule.generate_expression') }}
             </el-link>
           </el-form-item>
           <crontab-result :ex="form.cronValue" ref="crontabResult"/>
         </el-form>
-            <el-dialog :title="$t('schedule.generate_expression')" :visible.sync="showCron" :modal="false">
+        <el-dialog :title="$t('schedule.generate_expression')" width="70%" :visible.sync="showCron" :modal="false">
           <crontab @hide="showCron=false" @fill="crontabFill" :expression="schedule.value" ref="crontab"/>
         </el-dialog>
       </el-tab-pane>
@@ -85,23 +83,21 @@
         </template>
       </el-tab-pane>
     </el-tabs>
-      </div>
-    </template>
   </el-dialog>
 </template>
 
 <script>
 
-  import Crontab from "../cron/Crontab";
-  import CrontabResult from "../cron/CrontabResult";
-  import {cronValidate} from "../../../../common/js/cron";
-  import {listenGoBack, removeGoBackListener} from "../../../../common/js/utils";
+import Crontab from "../cron/Crontab";
+import CrontabResult from "../cron/CrontabResult";
+import {cronValidate} from "@/common/js/cron";
+import {listenGoBack, removeGoBackListener} from "@/common/js/utils";
 
-  function defaultCustomValidate() {
+function defaultCustomValidate() {
   return {pass: true};
-  }
+}
 
-  export default {
+export default {
   name: "MsScheduleEdit",
   components: {CrontabResult, Crontab},
   props: {
@@ -221,18 +217,18 @@
       return time2 - time1;
     }
   }
-  }
+}
 </script>
 
 <style scoped>
 
-  .inp {
+.inp {
   width: 50%;
   margin-right: 20px;
-  }
+}
 
-  .el-form-item {
+.el-form-item {
   margin-bottom: 10px;
-  }
+}
 
 </style>