ReservationApp
v1.0.0
麻省理工学院许可证
这是使用Google Apps脚本的用餐预订系统。
Google Apps脚本是实现自动化过程的强大自动化工具之一。当Google Apps脚本可用于这种情况时，即使用户远离计算机，自动化也可以延续，这要归功于云计算。此外，Google Apps脚本可以通过Google电子表格服务来管理Google电子表格，并使用HTML快速部署Web应用程序，并使用最少的编码来管理JavaScript。 Ref1 Ref2使用Google电子表格用作数据库，并且Web应用程序用作用户界面时，可以创建各种Web应用程序。在本报告中，为了帮助了解使用Google Apps脚本构建Web应用程序的关键方面，我想介绍一个简单的Web应用程序。在这里，作为示例，由Google Apps脚本，HTML和JavaScript创建的餐饮预订系统作为Web应用程序实现。
该网络应用程序是一个用餐预订系统。该系统的基本条件如下。
在这里，我想向您展示此Web应用程序的演示。在此演示中，最大座位数为50。平均用餐时间为2小时。步骤是30分钟。在这种情况下，运行以下流程。
在此演示中，今天是2024年1月22日。因此，该日历的第一天是2024年1月23日。
完成此流程后，Google电子表格上的“数据”表如下。您可以看到存储了2个预订。
在下一部分中，我想介绍此应用程序的用法。
为了安装此应用程序，我创建了一个简单地复制原始脚本的脚本。为了复制用于实现此预订系统的脚本，请运行以下脚本。
请复制并将以下脚本粘贴到Google Apps脚本的脚本编辑器中。当然，您还可以直接从此存储库中复制并粘贴这些脚本和HTML。
function myFunction ( ) {
const fileIds = [
"1NpxFPiuANcbRrnPTRSUgwjNaprB98cqz6KQUBl_IZLYK-Fhq8skZP0XB" ,
"1JrAE1-MqD7OjOWKbSGI5EDwJVXVl4zIK"
] ;
fileIds . forEach ( id => {
const file = DriveApp . getFileById ( id ) ;
file . makeCopy ( file . getName ( ) ) ;
} ) ;
}当运行此功能myFunction时，您可以在根文件夹中的以下2个文件。
ReservationApp 。sample_html.html 。独立脚本ReservationApp是基本脚本，包括Google Apps脚本和HTML。当您想在Google端使用此应用程序时，只能使用此文件进行。文本文件sample_html.html在Google之外使用。当您想将此Web应用程序放在Google方面时（例如，要将其放在服务器上。），使用sample_html.html 。当时，您需要同时使用ReservationApp和sample_html.html 。
当然，您可以在此存储库中直接下载原始脚本。
详细信息可以在官方文件中看到。
请使用ReservationApp的脚本编辑器进行设置。
https://script.google.com/macros/s/###/exec 。当您修改Web应用程序的Google Apps脚本时，请将部署修改为新版本。这样，修改后的脚本反映在Web应用程序中。请注意。
您可以在我的报告“重新部署Web应用程序的情况下，而无需更改新IDE的Web应用程序”中的详细信息。
当您想在Google方面使用此应用程序时，请使用此应用程序。
请与您的浏览器访问https://script.google.com/macros/s/###/exec的Web应用程序URL。这样，脚本是运行的。
首次运行脚本时，将在根文件夹中创建一个新的Google电子表格ReservationApp_database其中包括3张dashboard ， data和archive 。该电子表格用作仪表板，数据库和旧数据的存档。即使您将此电子表格移至特定文件夹时，脚本也可以。
然后，您可以在浏览器中看到带有“预订页”标题的日历。这是由电子表格仪表板表中的初始示例值创建的。您可以在仪表板纸上看到详细信息。
看到日历后，您可以通过单击日历来保留座位。这也可以在上述演示中看到。
例如，当您想在Google端外使用此应用程序时，例如，当您要在服务器上使用此应用程序时，请使用此应用程序。
在这种情况下，首先，请打开带有文本编辑器的HTML数据的文本文件。并且，请在JavaScript中将您的Web应用程序URL设置为url 。
设置Web应用程序后，请使用浏览器访问HTML。这样，脚本是运行的。
首次运行脚本时，将在根文件夹中创建一个新的Google电子表格ReservationApp_database其中包括3张dashboard ， data和archive 。该电子表格用作仪表板，数据库和旧数据的存档。即使您将此电子表格移至特定文件夹时，脚本也可以。
然后，您可以在浏览器中看到带有“预订页”标题的日历。这是由电子表格仪表板表中的初始示例值创建的。您可以在仪表板纸上看到详细信息。
看到日历后，您可以通过单击日历来保留座位。这也可以在上述演示中看到。
该Web应用程序可以通过电子表格ReservationApp_database上的仪表板表进行管理。请打开电子表格ReservationApp_database仪表板板。Database。您可以看到3列“变量”，“值”和“描述”。您可以在“ C”列的“描述”中看到每个值的详细信息。列“ B”的初始值是测试的样本值。因此，请将这些值修改为您的实际情况。
当您看到数据表时，当您已经将其保留为测试时，您可以看到数据。在此应用程序中，当脚本通过访问Web应用程序运行时，今天之前的旧数据移至存档表。例如，当您更改数据时，打开HTML时，更新的数据会反映在HTML中。请注意。
此应用程序可以设置临时假期。在这种情况下，请手动将其放在数据表中。例如，当今天是2024年1月1日，您想将1月2日至2024年12月5日作为暂时假期，请手动输入2024/01/02 2024/01/05的值，以及临时的Yolarday，以及temporaryHoliday的列表，分别为“ f” f“ to” h h“ h”（“ start”（“ start”，“”，“”，“”，“”，“”，“”，“”）。此后，当您打开Web应用程序时，您可以在日历中查看从2024年1月2日至1月5日的时间假期。
在某些情况下，您需要设置白天和时间。例如，当今天是2024年1月1日，您要设置为2024年1月6日的12:00至17:00，作为保留的日常日常时间，请手动输入2024/01/06 12:00:00 2024/01/06 17:00:00 ，以及保留日的时间，以及reservedDayTime到列的列，”此后，当您打开Web应用程序时，您可以在日历中看到2024/01/06 12:00:00至2024/01/06 17:00:00的日常一天和时间。
关于预订的取消，当您将“取消”放在“数据”表的“状态”列中时，显示日历时会跳过此行。这样，您可以在保留数据行时取消预订。在当前阶段，假定可以取消所有者的一方。因此，当用户想取消预订时，请告诉用户发送电子邮件以取消它。可以在“仪表板”工作表的“协议”表中设置此消息。
请在ReservationApp的脚本编辑器中删除脚本属性spreadsheetId表格的关键和值。这样，当您再次访问Web应用程序时，将在根文件夹中创建一个新的电子表格。在这种情况下，旧电子表格未删除。
此Web应用程序是一个简单的脚本。因此，您可以自由修改复制脚本的脚本。因此，当您要添加和/或修改脚本时，请使用复制的脚本进行操作。
该Web应用程序使用Google Apps脚本创建的Web应用程序。在当前阶段，对Web应用程序的最大访问次数为30。在您的实际情况下，如果有可能同时访问30多个用户，则此应用程序可能不合适。请注意。
在此应用程序中，主要有2个功能doGet和putValues 。
doGet doGet用于从Google Apps脚本和Google外部访问Web应用程序。 Google内部和外部之间的切换是使用查询参数完成的。当您使用浏览器直接访问Web应用程序URL时，将返回htmlservice.htmloutput。这样，您可以在浏览器上看到日历。另一方面，当您使用浏览器访问sample_html.html时，通过在sample_html.html中请求fetch api下载日历数据。这样，您可以在浏览器上看到日历。
putValues putValues用于从HTML侧存储数据。该功能通过假设并发访问在锁锁下运行。通过单击“提交”按钮在HTML上进行预订时，预订数据将以Google Apps脚本为google.script.run for“ inside”和“外部”和“ fetch api”。在Google Apps脚本中，当未重复提交的数据时，将数据放入“数据”表中，并将以下电子邮件发送给用户和所有者。
--- Reservation information ---
Date: 2024-01-01 10:00 to 2024-01-01 12:00
Reserved seats: 2
Name: sample1
Email: sample1@###
Phone: '123
Comment: sample comment
麻省理工学院
Tanaike
捐
V1.0.0（2024年1月22日）
顶部
