我想在我的网络应用程序中使用完整日历库的特定工作表的值创建日历。
如果我在 JavaScript 函数中手动添加值，我可以获得结果。但我不知道什么可以与Sheet的值建立链接。
你能帮我吗？
代码.gs：
const classeur = SpreadsheetApp.getActiveSpreadsheet();
const fBDD = classeur.getSheetByName("BDD");
function doGet() {
return HtmlService.createTemplateFromFile("Index").evaluate().setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
}
function include(filename){
return HtmlService.createHtmlOutputFromFile(filename).getContent();
}
索引.html：
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<?!= include('JavaScript'); ?>
<?!= include('CSS'); ?>
</head>
<body>
<div id='calendar'></div>
</body>
<script>
document.addEventListener("DOMContentLoaded",loadCalendar);
</script>
</html>
JavaScript.html：
<script src='https://cdn.jsdelivr.net/npm/[email protected]/index.global.min.js'></script>
<script>
function loadView(options){
var id = typeof options.id === "undefined" ? "app" : options.id;
var cb = typeof options.callback === "undefined" ? function(){} : options.callback;
}
function loadCalendar(){
loadView({func: "loadSearchView", callback: showCalendar()});
}
function showCalendar() {
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
initialView: 'dayGridMonth',
initialDate: new Date(),
headerToolbar: {
left: 'prev,next today',
center: 'title',
right: 'dayGridMonth,timeGridWeek,timeGridDay'
},
events: [
{
title: 'Event 1',
start: '2024-11-02T09:00:00',
end: '2024-11-02T13:00:00'
},
{
title: 'Event 2',
start: '2024-11-09T08:45:00',
end: '2024-11-09T12:45:00'
},
{
title: 'Event 3',
start: '2024-11-09T10:00:00',
end: '2024-11-09T12:00:00'
},
{
title: 'Event 4',
start: '2024-11-11T13:45:00',
end: '2024-11-12T15:00:00'
}
]
});
calendar.render();
}
</script>
虽然我不确定是否能正确理解你的预期结果，但是下面的修改怎么样？
Code.gs请添加以下功能。
function getValues() {
const ss = SpreadsheetApp.getActiveSpreadsheet();
const sheet = ss.getSheetByName("BDD");
const timeZone = Session.getScriptTimeZone(); // or ss.getSpreadsheetTimeZone()
const ar = sheet.getRange("A2:C" + sheet.getLastRow()).getValues().map(([a, b, c]) => ({ title: a, start: Utilities.formatDate(b, timeZone, "yyyy-MM-dd\'T\'HH:mm:ss"), end: Utilities.formatDate(c, timeZone, "yyyy-MM-dd\'T\'HH:mm:ss") }));
return ar;
}
JavaScript.html请将函数
showCalendarfunction showCalendar() {
google.script.run.withSuccessHandler(events => {
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
initialView: 'dayGridMonth',
initialDate: new Date(),
headerToolbar: {
left: 'prev,next today',
center: 'title',
right: 'dayGridMonth,timeGridWeek,timeGridDay'
},
events
});
calendar.render();
}).getValues();
}
google.script.rungetValues