layui框架实战案例(25):laydate中mark的数据后端生成

mark,自定义日期标记。该属性是对 calendar 属性的进一步延伸,灵活度更高。属性可批量设置多个日期标记,如:

javascript 复制代码
mark: {
  '0-10-14': '生日', //每年每月的某一天
  '0-0-10': '工资', // 每月 10 号
  '2008-8-8': '开幕', // 指定的日期
}

其中日期的格式必须是2008-8-8,而不能是2024-03-07,即当月份和天数是个位数时,不能用0补足。

场景描述

如在mysql数据库中遍历循环出对应的时间阶段,格式如何:

php 复制代码
// 定义多组起始和结束日期
$datePairs = [
    ['start' => '2023-03-12 08:00', 'end' => '2023-03-13 12:00'],
    ['start' => '2023-03-16 08:00', 'end' => '2023-03-17 12:00'],
    ['start' => '2023-03-19 08:00', 'end' => '2023-03-20 12:00'],
    ['start' => '2023-04-01 09:00', 'end' => '2023-04-03 15:00'],
];

封装函数

php 复制代码
function generateDateRanges($datePairs)
{
    //初始化最终合并的日期数组
    $mergedDateArray = [];

    //遍历每一组起始和结束日期
    foreach ($datePairs as $pair) {
        $startDateStr = $pair['start'];
        $endDateStr = $pair['end'];

        //创建DateTime对象
        $startDate = new DateTime($startDateStr);
        $endDate = new DateTime($endDateStr);

        //将起始日期的时间设置为午夜开始
        $startDate->setTime(0, 0, 0);

        //临时数组,用于存储当前日期对的日期范围
        $tempDateArray = [];

        //循环遍历当前日期对的日期范围
        $currentDate = clone $startDate; //克隆起始日期,以避免修改原始对象
        while ($currentDate <= $endDate) {
            //只添加日期部分(不包括时间)到临时数组中
            $tempDateArray[] = $currentDate->format('Y-n-j');
            //将当前日期增加一天
            $currentDate->modify('+1 day');
        }

        //将当前日期对的日期范围合并到最终数组中
        $mergedDateArray = array_merge($mergedDateArray, $tempDateArray);
    }

    //去除重复日期(如果需要)
    $mergedDateArray = array_unique($mergedDateArray);

    //按日期顺序排序(如果需要)
    sort($mergedDateArray);

    //转换日期格式,并生成你想要的输出格式
    $output = [];
    foreach ($mergedDateArray as $date) {
        $output[$date] = '';
    }

    //排序输出数组(如果需要)
    ksort($output);
    return $output;
}
  • 使用$currentDate->format('Y-n-j')来格式化日期,其中Y代表四位数的年份,n代表不带前导零的月份,j代表不带前导零的天数。这样,输出的日期将不会包含任何前导零;

  • 运行上述代码将得到一个日期数组,其中的键是格式化为Y-n-j的日期字符串,值则是空字符串。如果想要包含其他的值,修改 r e s u l t [ result[ result[formattedDate] = '';

  • 在遍历每个日期范围时,对$endDate使用了modify('+1 day'),这是因为DateTime对象在比较时是不包含结束日期那一天的。所以,人为地增加一天,以确保包含结束日期那天的数据。

  • 使用array_unique函数来去除数组中的重复日期(尽管在这个特定例子中由于我们按日期顺序添加,所以实际上不会有重复,但保留这一步可以作为一般性处理)。然后,使用sort函数对日期数组进行排序,确保输出结果是按日期顺序排列的。


@漏刻有时

相关推荐
Мартин.3 小时前
[Meachines] [Easy] Sea WonderCMS-XSS-RCE+System Monitor 命令注入
前端·xss
昨天;明天。今天。4 小时前
案例-表白墙简单实现
前端·javascript·css
数云界4 小时前
如何在 DAX 中计算多个周期的移动平均线
java·服务器·前端
风清扬_jd4 小时前
Chromium 如何定义一个chrome.settingsPrivate接口给前端调用c++
前端·c++·chrome
安冬的码畜日常4 小时前
【玩转 JS 函数式编程_006】2.2 小试牛刀:用函数式编程(FP)实现事件只触发一次
开发语言·前端·javascript·函数式编程·tdd·fp·jasmine
ChinaDragonDreamer4 小时前
Vite:为什么选 Vite
前端
小御姐@stella4 小时前
Vue 之组件插槽Slot用法(组件间通信一种方式)
前端·javascript·vue.js
GISer_Jing4 小时前
【React】增量传输与渲染
前端·javascript·面试
eHackyd4 小时前
前端知识汇总(持续更新)
前端
万叶学编程7 小时前
Day02-JavaScript-Vue
前端·javascript·vue.js