2022.4.2布局调整，非空校验

fhKeeper/formulahousekeeper/timesheet/src/views/settings/timetype.vue

@@ -36,28 +36,28 @@
         <!--设置时长样式内容-->
         <p style="margin-left:10px;color:#666;">员工工作时长上报方式设置</p>
         <el-row :gutter="20" style="padding-top:10px;width:100%;margin:0 auto;padding-left:10px;padding-right:10px;">
-        <el-col :span="8" >
+        <el-col :span="6" >
         <!-- 上下午固定时长-->
         <div class="panel" >
         <el-radio v-model="timeType.type" :label="0" style="width:100%">全天/上午/下午便捷上报
-        <el-form  ref="form1" :model="timeType" :rules="rules" label-width="120px" style="color:#333;">
+        <el-form  ref="form1" :model="timeType" :rules="rules" label-width="5rem" style="color:#333;">
         <el-form-item>
         </el-form-item>  
-        <span style="color:#999;">请设置时长</span>
+        <span style="color:#999;display:block;line-height:2rem;margin:1rem 0;">请设置时长</span>
         <el-form-item label="全天时长" prop="allday">
-            <el-select v-model="timeType.allday" placeholder="请选择工作时长" style="width:150px;" @change="timeChange">
+            <el-select v-model="timeType.allday" placeholder="请选择工作时长" style="width:120px;" @change="timeChange">
                 <el-option v-for="item in times" :key="item" :label="item.toFixed(1)" :value="item"></el-option>
             </el-select>
             小时
         </el-form-item>
         <el-form-item label="上午时长" prop="am" >
-            <el-select v-model="timeType.am" placeholder="请选择工作时长" style="width:150px;" @change="timeChange">
+            <el-select v-model="timeType.am" placeholder="请选择工作时长" style="width:120px;" @change="timeChange">
                 <el-option v-for="item in halfTime" :key="item" :label="item.toFixed(1)" :value="item"></el-option>
             </el-select>
             小时
         </el-form-item>
         <el-form-item label="下午时长" prop="pm" >
-            <el-select v-model="timeType.pm" disabled placeholder="请选择工作时长" style="width:150px;" >
+            <el-select v-model="timeType.pm" disabled placeholder="请选择工作时长" style="width:120px;" >
                 <el-option v-for="item in halfTime" :key="item" :label="item.toFixed(1)" :value="item"></el-option>
             </el-select>
             小时
@@ -67,37 +67,37 @@
         </div>
         </el-col>
         <!-- 选择小时数样式 -->
-        <el-col :span="8">   
+        <el-col :span="6">   
         <div class="panel">
         <el-radio v-model="timeType.type" :label="1">自行选择工作时长
-        <div  class="sample">
-        <p>
+        <el-form  class="sample" style="color:#333;">
+        <p style="color:#999;display:block;line-height:2rem">
             展示样例
         </p>
-        <div>
-            工作时长: 
-            <el-select v-model="selectTime" >
+        <el-form-item label="工作时长">
+            <el-select v-model="selectTime" style="width:120px">
                 <el-option v-for="item in timeRange" :key="item" :value="item.toFixed(1)">{{item.toFixed(1)}}</el-option>
             </el-select>
             小时
-        </div>
+        </el-form-item>
         
-        </div>
+        </el-form>
         </el-radio>
         </div>
         
         </el-col>
         <!--选择时间段样式 -->
-        <el-col :span="8">  
+        <el-col :span="6">  
         <div  class="panel" >
             <el-radio v-model="timeType.type" :label="2">自行选择时间范围
-            <div class="sample">
-            <p>
+            <el-form class="sample" style="color:#333;">
+            <p style="color:#999;display:block;line-height:2rem">
             展示样例
             </p>
             
-            <div style="width:500px;">
-               开始时间： <el-time-picker
+            <el-form-item label="开始时间">
+               <el-time-picker
+               style="width:160px;"
                     v-model="startTime"
                     :picker-options="{
                         start: '08:30',
@@ -106,9 +106,10 @@
                     format="HH:mm"
                     placeholder="任意时间点">
                 </el-time-picker>
-            </div>
-            <div style="margin-top:5px;">
-               结束时间： <el-time-picker
+            </el-form-item>
+            <el-form-item label="结束时间">
+               <el-time-picker
+               style="width:160px;"
                             v-model="endTime"
                             :picker-options="{
                                 start: '08:30',
@@ -118,27 +119,27 @@
                             format="HH:mm"
                             placeholder="任意时间点">
                         </el-time-picker>
-            </div>
-                </div>
+            </el-form-item>
+            </el-form>
             </el-radio> 
         </div>
         </el-col>
 
         <!--选择按比例分配样式 -->
-        <el-col :span="8">  
+        <el-col :span="6">  
         <div  class="panel" >
             <el-radio v-model="timeType.type" :label="3">按比例分配时间
-            <div class="sample">
-            <p>
+            <el-form class="sample" style="color:#333;">
+            <p style="color:#999;display:block;line-height:2rem">
             展示样例
             </p>
             
-            <div style="width:300px;">
-                <el-col span="6">用时占比： </el-col>
-                <el-col span="8"><el-slider v-model="progress" :step="10" style="width:100px;margin-top:-12px;" ></el-slider></el-col>
-                <el-col span="10"><span style="margin-left:10px;float:right;"><span style="margin-right:10px;">{{progress}}%</span>{{(progress*8/100).toFixed(1)}}小时</span></el-col>
-            </div>
-                </div>
+            <el-form-item label="用时占比">
+                <!-- <el-col span="6">用时占比： </el-col> -->
+                <el-col span="12" style="padding-left:0;padding-right:0;"><el-slider v-model="progress" :step="10" style="width:100px;" ></el-slider></el-col>
+                <el-col span="2" style="padding-left:0;padding-right:0;"><span style="margin-left:10px;"><span style="margin-right:10px;">{{progress}}%</span>{{(progress*8/100).toFixed(1)}}小时</span></el-col>
+            </el-form-item>
+            </el-form>
             </el-radio> 
         </div>
         </el-col>
@@ -480,11 +481,25 @@
                         }
                         if(param.customDegreeActive) {
                             param.customDegreeActive = 1
+                            if(param.customDegreeName.replace(/^ +| +$/g,'') == ''){
+                                this.$message({
+                                    message:"请输入 自定义日报填报列表 的字段名称",
+                                    type:"error"
+                                })
+                                return
+                            }
                         } else {
                             param.customDegreeActive = 0
                         }
                         if(param.customDataActive) {
                             param.customDataActive = 1
+                            if(param.customDataName.replace(/^ +| +$/g,'') == ''){
+                                this.$message({
+                                    message:"请输入 自定义日报填报数值 的字段名称",
+                                    type:"error"
+                                })
+                                return
+                            }
                         } else {
                             param.customDataActive = 0
                         }
@@ -565,7 +580,7 @@
     padding:15px;height:300px;box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)
 }
 .sample {
-    margin-top:30px;
+    margin-top:22px;
     color: #999;
 }
 .tip {