以月份为周期计算

A.需求

1.需要使用moment插件

2.需求:根据开始日期和周期计算下次到期事件

B.具体操作

 1.找到文件目录

 2.在控制台输入命令

npm install moment --save

3.package.json中查看(moment插件安装成功)

4.在需要的文件引入moment插件

1.注意:moment获取天数用get.("dates")

<template>  
        <el-form-item label="检定时间" prop="fVerificationDate" >
                <el-date-picker
            v-model="dataForm.fVerificationDate"
            type="date"
            placeholder="选择日期" @input="fVerificationCycleCalculate2" 
          
            >
          </el-date-picker>
      </el-form-item>

      <el-form-item label="检定周期/月" prop="fVerificationCycle">
        <el-input v-model="dataForm.fVerificationCycle" placeholder="检定周期" @input="fVerificationCycleCalculate2"></el-input>
      </el-form-item>

      <el-form-item label="下次检定日期" prop="fNextVerificationDate">
        <!-- <el-input v-model="dataForm.fNextVerificationDate" placeholder="下次检定日期"></el-input> -->
           <el-date-picker
            v-model="dataForm.fNextVerificationDate"
            type="date"
            placeholder="选择日期" disabled>    //disabled 去掉可修改
          </el-date-picker>
      </el-form-item>

</template>

<script>

//引入moment组件   注意最下面需要添加   components:{moment},
  import moment from 'moment'    

 export default {
    data () {
      return {
           dataForm{
              fVerificationCycle: '',
              fNextVerificationDate: '',
              fVerificationDate: '',
                  },
           }
        },
    methods:{
               //检定周期计算/月
      fVerificationCycleCalculate2(){
            //判断检定时间,和周期不为空
        if(this.dataForm.fVerificationDate != null&&this.dataForm.fVerificationCycle !=''){
          console.log(this.dataForm.fVerificationDate)
          var a=moment(this.dataForm.fVerificationDate)
          var b=parseInt(this.dataForm.fVerificationCycle)

          var y=a.get('years')
          var m=a.get('months')
          var d=a.get('dates')  //特别注意:这里获取天数用   get("dates")
          // var d=moment.duration(a).asDays()
          //计算月份 获取月份+1加周期月份b
          var ms=m+1+b 
         
          if(parseInt(ms/12)>0){//大于12个月轮换一年
            y=y+(parseInt(ms/12))
            ms=ms-12*(parseInt(ms/12))
          }
          if(ms==0){//无0月,元月及1月。
            ms=1
          }
          var z =y + "-" + (ms < 10 ? ("0" + ms) : ms) + "-" + (d < 10 ? ("0" + d) : d) + '';
          this.dataForm.fNextVerificationDate=z
         
        }

      },
       },
   components:{moment},
}

</script>



 以天数为周期计算结束时间

1.直接上代码

注意:开始日期格式为时间戳

<template>  
        <el-form-item label="检定时间" prop="fVerificationDate" >
                <el-date-picker
            v-model="dataForm.fVerificationDate"
            type="date"
             value-format="timestamp"
            placeholder="选择日期" @input="fVerificationCycleCalculate2" 
          
            >
          </el-date-picker>
      </el-form-item>

      <el-form-item label="检定周期/月" prop="fVerificationCycle">
        <el-input v-model="dataForm.fVerificationCycle" placeholder="检定周期" @input="fVerificationCycleCalculate2"></el-input>
      </el-form-item>

      <el-form-item label="下次检定日期" prop="fNextVerificationDate">
        <!-- <el-input v-model="dataForm.fNextVerificationDate" placeholder="下次检定日期"></el-input> -->
           <el-date-picker
            v-model="dataForm.fNextVerificationDate"
            type="date"
            placeholder="选择日期" disabled>    //disabled 去掉可修改
          </el-date-picker>
      </el-form-item>

</template>

<script>

//引入moment组件   注意最下面需要添加   components:{moment},
  import moment from 'moment'    

 export default {
    data () {
      return {
           dataForm{
              fVerificationCycle: '',
              fNextVerificationDate: '',
              fVerificationDate: '',
                  },
           }
        },
    methods:{
               //检定周期计算/天
      fVerificationCycleCalculate(){      //日期传入格式为时间戳格式 value-format="timestamp"
        console.log("检定时间:"+this.dataForm.fVerificationDate) ;
        console.log("检定周期"+(this.dataForm.fVerificationCycle));
        if(this.dataForm.fVerificationDate != null&&this.dataForm.fVerificationCycle !=''){
          console.log("检定周期"+(this.dataForm.fVerificationCycle)*(24 * 60 * 60 * 1000));

              this.dataForm.fNextVerificationDate=this.dataForm.fVerificationDate+((this.dataForm.fVerificationCycle)*(24 * 60 * 60 * 1000))
              console.log("下次检定日期"+this.dataForm.fNextVerificationDate);
           }
      },
       },
   components:{moment},
}

</script>

 

Logo

前往低代码交流专区

更多推荐