婷婷综合国产,91蜜桃婷婷狠狠久久综合9色 ,九九九九九精品,国产综合av

主頁 > 知識(shí)庫 > php使用fullcalendar日歷插件詳解

php使用fullcalendar日歷插件詳解

熱門標(biāo)簽:浙江外呼電話系統(tǒng)軟件 芒果電銷機(jī)器人 電梯外呼線路板維修視頻 安陽自動(dòng)外呼系統(tǒng)價(jià)格是多少 上海公司外呼系統(tǒng)線路 地圖標(biāo)注風(fēng)向標(biāo) 十堰ai電話機(jī)器人效果怎么樣 銀川ai電話機(jī)器人 臨沂智能電銷機(jī)器人軟件

最近做課程表的項(xiàng)目,找了好多個(gè)插件感覺都不好用,無意間看到了fullcalendar,還挺簡單的,很方便,先貼一張項(xiàng)目頁面

!DOCTYPE html>
html>
head>
meta charset='utf-8' />
!-- 日歷插件 -->
link href='/public/school/table/fullcalendar.min.css' rel='stylesheet' />
link href='/public/school/table/fullcalendar.print.min.css' rel='stylesheet' media='print' />
script src='/public/school/table/moment.min.js'>/script>
script src='/public/school/table/jquery.min.js'>/script>
script src='/public/school/table/fullcalendar.min.js'>/script>
!-- fullcalendar語言包 -->
script src='/public/school/table/locale-all.js'>/script>

!-- layui -->
link rel="stylesheet" href="/public/school/layui/css/layui.css" rel="external nofollow" media="all">
link rel="stylesheet" href="/public/school/style/admin.css" rel="external nofollow" media="all">
script src="/public/school/layui/layui.js">/script> 

!-- bootstrap -->
link  rel='stylesheet' />
script src='https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js'>/script>
script src='https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js'>/script>
/head>
script>

 //獲取當(dāng)前日期
 var myDate = new Date();
 var defaultDate = myDate.getFullYear() +'-'+(myDate.getMonth()+1)+'-'+myDate.getDate()

 $(document).ready(function() {
 $('#calendar').fullCalendar({
 header: { //頂部顯示信息
 left: 'prev,next today',
 center: 'title',
 right: 'month,agendaWeek,agendaDay,listMonth'
 },
 defaultDate: defaultDate, //默認(rèn)顯示日期
 navLinks: true, // can click day/week names to navigate views
 defaultView:'agendaWeek', //初始化時(shí)的默認(rèn)視圖默認(rèn)顯示周
 allDaySlot: false, //是否顯示all-day
 slotLabelFormat:'H:mm', //左側(cè)時(shí)間顯示格式
 minTime : '06:00:00', //左側(cè)時(shí)間從幾點(diǎn)開始
 maxTime : '22:00:00', //左側(cè)時(shí)間從幾點(diǎn)結(jié)束
 locale: 'zh-cn', //顯示中文
 selectable: true, //設(shè)置是否可被單擊或者拖動(dòng)選擇
 eventLimit: true, //如果數(shù)據(jù)過多超過日歷格子顯示的高度時(shí),多出去的數(shù)據(jù)不會(huì)將格子擠開,而是顯示為 +...more ,點(diǎn)擊后才會(huì)完整顯示所有的數(shù)據(jù)

 // 點(diǎn)擊課程信息事件,并彈窗
 eventClick: function(calEvent, jsEvent, view) {
 console.log('cycle_id:' + calEvent.id); //點(diǎn)擊的課程周期id
 console.log('sel_type:' + calEvent.sel_type); //點(diǎn)擊的課程周期類型 1單次 2重復(fù)
 // 彈出一個(gè)頁面
 layer.open({
  type: 2,
  title: '課程表信息',
  shadeClose: true,
  shade: [0.5, '#000'],
  maxmin: true, //開啟最大化最小化按鈕
  area: ['900px', '650px'],
  content: "/school/Course_Table/cycleInfo.html?cycle_id="+calEvent.id,
  end: function () {
  // 刷新父窗口
  location.reload();
  }
  });
 },

 // 點(diǎn)擊空白區(qū)域,獲取選擇的日期時(shí)間范圍,并彈窗
 select: function(startDate, endDate) {
  selDate = startDate.format('YYYY-MM-DD'); //選中的開始日期
  layer.open({
  type: 2,
  title: '周期排課',
  shadeClose: true,
  shade: [0.5, '#000'],
  maxmin: true, //開啟最大化最小化按鈕
  area: ['900px', '650px'],
  content: "/school/Course_Table/addCycle2.html?selDate="+selDate,
  end: function () {
  // 刷新父窗口
  location.reload();
  }
  });
 },
 
 // 日期顯示格式
 views: {
  month: { 
  titleFormat: 'YYYY年MM月'
 },
 agenda: {
  titleFormat: 'YYYY年MM月DD日'
 },
 week: {
  titleFormat: 'YYYY年MM月DD日'
 },
 },

 // 鼠標(biāo)移上的提示 使用bootstorp的提示
 eventRender: function(eventObj, $el) {
 $el.popover({
  content: eventObj.description,
  trigger: 'hover',
  placement: 'top',
  container: 'body'
 });
 },

 // 獲取要顯示的數(shù)據(jù) 返回的是json格式
 events: function(start,end,timezone, callback) {
 $.ajax({
  url: "{:url('courseTable')}",
  dataType: 'json',
  type:"POST",
  success: function(data) { 
  if (data.status == 0) {
  callback(data.msg);
  }else{
  layer.msg('網(wǎng)絡(luò)錯(cuò)誤');
  }
  },
  error:function () {
  layer.msg('網(wǎng)絡(luò)錯(cuò)誤');
  }
 });
 }
 });


 });

/script>
style>

 body {
 /*margin: 40px 10px;*/
 padding: 0;
 font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
 font-size: 14px;
 }

 #calendar {
 max-width: 1200px;
 margin: 0 auto;

 }

/style>
/head>
body>
div class="layui-fluid" style="margin: 10px">
 div class="layui-card">
 div class="layui-card-body">
 div id='calendar'>/div>
 /div>
 /div>
/div>
script type="text/javascript">
 //加載layui
 layui.use(['layer','element','form'], function(){
 var layer = layui.layer
 ,element = layui.element
 ,form = layui.form;
 });
/script>
/body>
/html>

php后臺(tái)代碼:這里我把要顯示的格式在后臺(tái)封裝好了,到前臺(tái)直接取出來拿來用就可以了。
注意:title和start即標(biāo)題和開始時(shí)間是必須要有的,其他的參數(shù)可選,其中 start 格式是“日期T時(shí)間”,中間有個(gè)字母“T”,看自己情況,description 的內(nèi)容是鼠標(biāo)放上去要顯示的內(nèi)容

public function courseTable()
 {
 if (request()->isPost()) {
       //二維數(shù)組
  $list = model('CourseTable')->getCourseTable($this->sid);
  foreach ($list as $key => $value) {
  $val['id'] = $value['id']; ///課程周期表
  $val['sel_type'] = $value['sel_type']; ///課程周期類型 1單次 2重復(fù)
  $val['title'] = '教師:'.$value['teacher_name']. '班級:'.$value['grade_name'];
  $val['start'] = $value['date'].'T'.$value['start_time'];
  $val['end'] = $value['date'].'T'.$value['end_time'];
  $val['description'] = '教師:'.$value['teacher_name'].'班級:'.$value['grade_name'].'教室:'.$value['room_name'];
  $val['color'] = '#009688';
  $val['textColor'] = '#fff';

  $newList[] = $val;
  }
  
  return return_succ($newList);
 }
 return $this->fetch();
 }

代碼里有注釋,有不懂的可以留言溝通。

官方網(wǎng)站里面有文檔,可以慢慢研究 https://fullcalendar.io/docs

以上所述是小編給大家介紹的php使用fullcalendar日歷插件的教程詳解整合,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!

您可能感興趣的文章:
  • JavaWeb項(xiàng)目FullCalendar日歷插件使用的示例代碼
  • FullCalendar日歷插件應(yīng)用之?dāng)?shù)據(jù)展現(xiàn)(一)

標(biāo)簽:徐州 寧夏 武威 常州 遂寧 吐魯番 遵義 荊門

巨人網(wǎng)絡(luò)通訊聲明:本文標(biāo)題《php使用fullcalendar日歷插件詳解》,本文關(guān)鍵詞  php,使用,fullcalendar,日歷,;如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問題,煩請?zhí)峁┫嚓P(guān)信息告之我們,我們將及時(shí)溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò),涉及言論、版權(quán)與本站無關(guān)。
  • 相關(guān)文章
  • 下面列出與本文章《php使用fullcalendar日歷插件詳解》相關(guān)的同類信息!
  • 本頁收集關(guān)于php使用fullcalendar日歷插件詳解的相關(guān)信息資訊供網(wǎng)民參考!
  • 推薦文章
    主站蜘蛛池模板: 鄯善县| 池州市| 兴义市| 武城县| 崇礼县| 南平市| 上犹县| 集贤县| 通辽市| 华坪县| 北辰区| 鹿邑县| 奇台县| 松阳县| 大关县| 界首市| 渝北区| 华蓥市| 宽城| 措美县| 沙河市| 和田县| 清徐县| 芜湖县| 正镶白旗| 鞍山市| 兴山县| 富民县| 丁青县| 工布江达县| 山阳县| 治多县| 石柱| 洪洞县| 连云港市| 富宁县| 毕节市| 安阳市| 阿拉善右旗| 江口县| 台江县|