运营平台加账单日、结算日

src/views/dispatch/add.vue

 <template>
   <div class="app-container" style="padding: 20px 50px">
+    <p class="tips">
+      <div class="tipscontent">
+        <el-icon size="14px"><WarningFilled/></el-icon>
+        温馨提醒：账单日：当到达所设定的特定日期，系统将通知财务对上月预支工资账单进行结算。<br>
+        <div style="margin-left: 77px;">结算日：到达账单日时，如果财务没有主动结算上月预支工资账单，系统将依据设定的结算日自动予以结算。</div>
+       </div>
+    </p>
+
     <el-form
         :inline="true"
         label-position="right"
@@ -43,17 +51,23 @@
               type="date"
               placeholder="注册日期"
               value-format="YYYY-MM-DD"
-              style="width: 200px"
+              style="width: 195px"
           />
         </el-form-item>
       <el-form-item label="联系人" prop="contracts">
         <el-input v-model="formLabelAlign.contracts" maxlength="20" />
       </el-form-item>
+      <el-form-item label="账单日" prop="bill_day" >
+        <el-input v-model="formLabelAlign.bill_day" type="number" />
+      </el-form-item>
+      <el-form-item label="结算日" prop="settle_day">
+        <el-input v-model="formLabelAlign.settle_day" type="number" />
+      </el-form-item>
       <el-form-item label="联系电话" prop="contract_number">
         <el-input v-model="formLabelAlign.contract_number" />
       </el-form-item>
       <el-form-item label="公司地址（省市县区）" prop="ssq_id">
-        <el-cascader v-model="formLabelAlign.ssq_id" :options="regionData" @change="handleSsqChange()" style="width: 200px"/>
+        <el-cascader v-model="formLabelAlign.ssq_id" :options="regionData" @change="handleSsqChange()" style="width: 195px"/>
       </el-form-item>
       <el-form-item label="详细地址" prop="address">
         <el-input v-model="formLabelAlign.address"  maxlength="50"/>
@@ -109,6 +123,12 @@ const rules = ref({
   register_time:[{ validator: validateTime, trigger: ['blur', 'change'] }],
   contract_number: [{ pattern: /^\d[0-9\-]{5,11}\d$/, message: "请输入正确的手机号或座机号", trigger: "blur" }],
   contracts: [{ required: true, message: "请输入联系人", trigger: ['blur', 'change']}],
+  bill_day: [{ required: true, message: "请输入账单日", trigger: ['blur', 'change']},
+      { pattern : /^\d+$/, message: "请输入正整数", trigger: ['blur', 'change']},
+      { validator: validateNumber, trigger: ['blur', 'change']}],
+  settle_day: [{ required: true, message: "请输入结算日", trigger: ['blur', 'change']},
+      { pattern : /^\d+$/, message: "请输入正整数", trigger: ['blur', 'change']},
+      { validator: validateNumber, trigger: ['blur', 'change']}],
 })
 
 //编辑时获取详情
@@ -126,6 +146,8 @@ if(id){
       contract_number: data.contractNumber,
       ssq_id: [data.provinceId,data.cityId,data.countyId],
       address: data.address,
+      bill_day: data.billDay,
+      settle_day: data.settleDay
     }
   })
 }
@@ -182,6 +204,14 @@ function validateTime(rule, value, callback) {
     callback();
   }
 }
+//校验数字
+function validateNumber(rule,value,callback) {
+  if(value<1 || value>31){
+    callback(new Error("请输入1-31之间的数字"));
+  }else {
+    callback();
+  }
+}
 
 function handleSsqChange () {
   let ssq_id = formLabelAlign.value.ssq_id;
@@ -219,3 +249,20 @@ function submitForm(){
 
 
 </script>
+
+<style lang="scss">
+.tips{
+  margin-top: 0px;
+  padding: 8px;
+  color: #ED6F1C;
+  background: #FFFAE8;
+  line-height: 1.4;
+  font-size: 12px;
+  display: flex;
+  justify-content: flex-start;
+}
+
+.tipscontent{
+  margin-left: 7.4%;
+}
+</style>
\ No newline at end of file

src/views/dispatch/index.vue

@@ -44,6 +44,8 @@
         <el-table-column label="派遣公司名称" align="left" prop="name"  width="260" fixed />
         <el-table-column label="默认账号" align="left" prop="default_account" width="180" fixed/>
         <el-table-column label="前缀" align="left" prop="prefix" width="100"/>
+        <el-table-column label="账单日" align="center" prop="bill_day" />
+        <el-table-column label="结算日" align="center" prop="settle_day" />
         <el-table-column label="规模" align="center" prop="scale" />
         <el-table-column label="联系人" align="center" prop="contracts" />
         <el-table-column label="联系电话" align="center" prop="contract_number" width="120"/>