前端各种日期的处理（vue）

川长思鸟来 2024-03-16 16:55 51阅读 0赞

1.
            //日期
            pickerOptions: {
              shortcuts: [{
                text: '最近一周',
                onClick(picker) {
                  const end = new Date()
                  const start = new Date()
                  start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
                  picker.$emit('pick', [start, end])
                }
              }, {
                text: '最近一个月',
                onClick(picker) {
                  const end = new Date()
                  const start = new Date()
                  start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
                  picker.$emit('pick', [start, end])
                }
              }, {
                text: '最近三个月',
                onClick(picker) {
                  const end = new Date()
                  const start = new Date()
                  start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
                  picker.$emit('pick', [start, end])
                }
              }]
            }

2.时间/日期格式

<el-table-column align="center" prop="dateDemo" label="某某时间" width="180" :formatter="dateFormat" :show-overflow-tooltip="true"></el-table-column>
    
    //时间格式处理
          dateFormat: function(row, column) {
            var date = row[column.property]
            if (date == undefined) {
              return ''
            }
            return moment(date).format('YYYY-MM-DD HH:mm:ss')
          },

3.开始/结束时间

<el-form-item label="开始日期">
        <el-date-picker v-model="form.startDate" type="date" placeholder="选择日期"
          :picker-options="pickerOptions" popper-class="datePic" value-format="yyyy-MM-dd">        
        </el-date-picker>
    </el-form-item>
    <el-form-item label="结束日期">
         <el-date-picker v-model="form.endDate" type="date"  placeholder="选择日期"
           :picker-options="pickerOptions" popper-class="datePic" value-format="yyyy-MM-dd"></el-date-picker>
    </el-form-item>

pickerOptions: {
              disabledDate(time) {
                return time.getTime() > Date.now();
              },
              shortcuts: [{
                text: '今天',
                onClick(picker) {
                  picker.$emit('pick', new Date());
                }
              },{
                text: '清空',
                onClick(picker) {
                  picker.$emit('pick', '');
                }
              }]
            }

var d1 = new Date(startTime.replace(/\-/g, "\/")); 
          var d2 = new Date(endTime.replace(/\-/g, "\/")); 
    
          if(startTime!="" && endTime!="" && d1 >=d2) 
          {
              alert("开始时间必须小于结束时间！");
              return false; 
          }