日历插件FullCalendar4.3.1如何更好的运用与后台交互，未带增删改

最新推荐文章于 2024-08-08 07:09:35 发布

weixin_40864484

最新推荐文章于 2024-08-08 07:09:35 发布

阅读量1.6k

点赞数

分类专栏： js 日历插件文章标签：日历插件FullCalendar4.3.1

本文链接：https://blog.csdn.net/weixin_40864484/article/details/100743906

版权

js 同时被 2 个专栏收录

1 篇文章 0 订阅

订阅专栏

日历插件

1 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
    <title>@@@@@@</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <meta name="author" content="LuMingMing,ChenYue"/>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/style/exercise/css/core.css">
</head>

<div id="calendar"></div>
<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/jModal.js"></script>
   <script type="text/javascript" src="${pageContext.request.contextPath}/style/exercise/js/core.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/style/exercise/js/daygrid.js"></script>
	

    <script type="text/javascript">
        $(document).ready(function () {
                var calendarEl = document.getElementById('calendar');

                var calendar = new FullCalendar.Calendar(calendarEl, {
                    plugins: ['interaction', 'dayGrid', 'timeGrid'],
                    header: {
                        left: 'prev,next',
                        center: 'title', // 标题
                        right: 'today' // 今天 上月，下月
                    },
                    eventTimeFormat: {
                        hour: '2-digit',
                        minute: '2-digit',
                        hour12: false
                    },
                    displayEventEnd: true,
                    events: function (fetchInfo, successCallback, failureCallback) {
                        var now = new Date();
                        var data = timeChange(now.toLocaleDateString());
                        var events = [];
                        $.ajax({
                            type: "POST",
                            url: "${pageContext.request.contextPath}/crm/customer/followup/getList",
                            data: data,
                            dataType: "json",
                            eventLimit: true,
                            success: function (result) {
                                $.each(result.rows, function (i, j) {
                                    events.push({
                                        id: j.id,
                                        title: j.customerName,
                                        start: j.startDate,           // will be parsed
                                        end: j.endDate
                                    });
                                })
                                //回调渲染日历
                                successCallback(events);
                            }
                        })
                    },

                });

                calendar.render();

                // 中文
                calendar.setOption('locale', "zh-cn");

                //选择上下页事件
                $('#calendar').find('.fc-prev-button,.fc-next-button').on("click", function () {
                    var calendarstring = calendar.view.title.replace("年", "-").replace("月", "-") + "01 00:00:00"
                    var data = timeChange(calendarstring);
                    var events = [];
                    $.ajax({
                        type: "POST",
                        url: "${pageContext.request.contextPath}/crm/customer/followup/getList",
                        data: data,
                        dataType: "json",
                        success: function (result) {
                            $.each(result.rows, function (i, j) {
                                events.push({
                                    id: j.id,
                                    title: j.customerName,
                                    start: j.startDate,           // will be parsed
                                    end: j.endDate
                                });
                            })
                            //回调渲染日历
                            calendar.removeAllEventSources();
                            calendar.addEventSource(events);
                        }
                    })
                });
            }
           });

        //    时间函数
        function timeChange(s) {
            var now = new Date(s);
            var now2 = new Date(s);
            now2.setMonth(now.getMonth() + 1);
            month = now.getMonth() + 1;
            month2 = now2.getMonth() + 1;
            var date = {
                start: now.getFullYear() + "-" + month + "-01",
                end: now2.getFullYear() + "-" + month2 + "-01"
            }
            var data = {
                startDate: date.start,
                endDate: date.end,
                marketerId:${marketerId},
                pageNumber: 1,
                pageSize: 1000,
            }
            return data;
        }
    </script>
</body>
</html>