模塊五 管理端-預(yù)約設(shè)置

模塊五管理端-預(yù)約設(shè)置《JavaEE企業(yè)級應(yīng)用開發(fā)項目教程（SSM）》知識目標(biāo)/Target了解ApachePOI，能夠說出ApachePOI的概念和作用掌握ApachePOI讀取文件的方法，能夠使用ApachePOI讀取Excel文件中的信息技能目標(biāo)/Target掌握批量導(dǎo)入預(yù)約設(shè)置信息的實現(xiàn)方法，能夠使用ApachePOI實現(xiàn)批量導(dǎo)入預(yù)約設(shè)置信息掌握預(yù)約設(shè)置信息的展示方法，能夠使用日歷展示預(yù)約設(shè)置信息掌握預(yù)約信息的設(shè)置方法，能夠基于日歷實現(xiàn)預(yù)約信息的設(shè)置章節(jié)概述/

Summary鑒于醫(yī)療資源和醫(yī)療空間的有限，傳智健康管理端提供了預(yù)約設(shè)置功能，該功能可以設(shè)置健康管理機(jī)構(gòu)每天可接納的體檢用戶數(shù)量，其設(shè)置方式有兩種，一種是通過批量導(dǎo)入的方式設(shè)置，一種是在日歷中直接設(shè)置。目錄/Contents010203批量導(dǎo)入預(yù)約設(shè)置信息日歷展示預(yù)約設(shè)置信息基于日歷實現(xiàn)預(yù)約設(shè)置批量導(dǎo)入預(yù)約設(shè)置信息5-1任務(wù)描述預(yù)約設(shè)置可以通過上傳包含可預(yù)約人數(shù)信息的文件，然后讀取文件中的可預(yù)約人數(shù)信息，來完成批量導(dǎo)入預(yù)約設(shè)置信息。任務(wù)描述在預(yù)約設(shè)置頁面單擊“模板下載”按鈕下載模板文件。任務(wù)描述按照Excel模板文件格式要求填寫每天可預(yù)約的人數(shù)，填寫完成后，單擊“上傳文件”按鈕將模板文件上傳至數(shù)據(jù)庫。任務(wù)分析(1)創(chuàng)建Excel模板文件，添加到程序的指定目錄中。(2)為ordersetting.html頁面的“模板下載”按鈕綁定單擊事件，在單擊事件觸發(fā)后提交模板下載的請求。1.模板下載（1）提交上傳文件請求。（2）接收和處理上傳文件請求。（3）保存預(yù)約設(shè)置信息。（4）提示新增結(jié)果。2.上傳文件批量導(dǎo)入預(yù)約設(shè)置信息任務(wù)分析批量導(dǎo)入預(yù)約設(shè)置信息的實現(xiàn)過程知識進(jìn)階ApachePOI是用Java編寫的免費開源的跨平臺的JavaAPI，ApachePOI提供API給Java程序，實現(xiàn)對MicrosoftOffice格式文件進(jìn)行讀和寫的功能。由于本任務(wù)通過上傳讀取Excel文件的方式實現(xiàn)批量導(dǎo)入預(yù)約設(shè)置信息的功能，所以接下來以讀取Excel文件為例，演示ApachePOI讀取文件的步驟。ApachePOI知識進(jìn)階在health_parent父工程的pom.xml文件中引入ApachePOI的依賴信息。<properties>

<poi.version>3.14</poi.version></properties><dependencyManagement>

<dependencies>

<dependency>

<groupId>org.apache.poi</groupId>

<artifactId>poi</artifactId>

<version>${poi.version}</version> </dependency> <dependency>

<groupId>org.apache.poi</groupId>

<artifactId>poi-ooxml</artifactId>

<version>${poi.version}</version> </dependency>

</dependencies></dependencyManagement>ApachePOI（1）引入ApachePOI依賴信息知識進(jìn)階在health_common子模塊的pom.xml文件中引入ApachePOI的依賴信息。<dependencies>

<dependency><groupId>org.apache.poi</groupId><artifactId>poi</artifactId></dependency><dependency><groupId>org.apache.poi</groupId><artifactId>poi-ooxml</artifactId></dependency></dependencies>ApachePOI（1）引入ApachePOI依賴信息知識進(jìn)階ApachePOI（2）Excel文件的常用對象//根據(jù)文件創(chuàng)建工作簿對象HSSFWorkbookworkbook=newHSSFWorkbook(newFileInputStream("D:\\test.xls"));//獲取第1個工作表HSSFSheetsheet=workbook.getSheetAt(0);//遍歷工作表獲得行對象for(Rowrow:sheet){//遍歷行對象獲取單元格對象for(Cellcell:row){//獲得單元格中的值Stringvalue=cell.getStringCellValue();System.out.println(value);}}workbook.close();ApachePOI的文檔中提供了操作Excel文件的常用對象，下面對這些常用對象的獲取進(jìn)行演示。知識進(jìn)階ApachePOI（2）Excel文件的常用對象

//根據(jù)文件創(chuàng)建工作簿對象XSSFWorkbookwb=newXSSFWorkbook("D:\\hello.xlsx");//獲取工作表XSSFSheetst=wb.getSheetAt(0);//獲取當(dāng)前工作表最后一行的行號，行號從0開始intlastRowNum=st.getLastRowNum();for(inti=0;i<=lastRowNum;i++){//根據(jù)行號獲取行對象XSSFRowrow=st.getRow(i);shortlastCellNum=row.getLastCellNum();for(shortj=0;j<lastCellNum;j++){Stringvalue=row.getCell(j).getStringCellValue();System.out.println(value);}}workbook.close();ApachePOI的文檔中提供了操作Excel文件的常用對象，下面對這些常用對象的獲取進(jìn)行演示。知識進(jìn)階ApachePOI官方網(wǎng)站提供的API文檔中包含讀取Excel文件的使用案例，為了讀者能更便捷地使用ApachePOI讀取Excel文件，我們將ApachePOI官方網(wǎng)站提供的使用案例進(jìn)行簡單改造，封裝成工具類POIUtils，這樣本任務(wù)可以直接調(diào)用POIUtils工具類實現(xiàn)Excel文件的讀取。在health_common模塊的com.itheima.utils包下創(chuàng)建POIUtils類，在類中定義readExcel()方法，用于讀取上傳的文件內(nèi)容。ApachePOI（3）封裝工具類任務(wù)實現(xiàn)在health_backend子模塊的src/main/webapp目錄下創(chuàng)建template文件夾，在template文件夾中創(chuàng)建一個名稱為ordersetting_template的XLSX格式的Excel文件作為模板文件，在該模板文件中將默認(rèn)的Sheet工作表重命名為預(yù)約設(shè)置模板，其中包含的字段有日期、可預(yù)約人數(shù)等。本書提供的配套資源中提供了對應(yīng)的模板文件。1.模板下載（1）準(zhǔn)備模板任務(wù)實現(xiàn)在ordersetting.html頁面中定義downloadTemplate()方法，用于模板下載。downloadTemplate(){window.location.href="../../template/ordersetting_template.xlsx";}1.模板下載（2）定義模板下載方法設(shè)置單擊“模板下載”按鈕時調(diào)用downloadTemplate()方法。<el-buttonstyle="margin-bottom:20px;margin-right:20px"type="primary"

@click="downloadTemplate()">模板下載</el-button>任務(wù)實現(xiàn)啟動Zookeeper服務(wù)，在IDEA中依次啟動health_service_provider和health_backend。在瀏覽器中訪問http://localhost:82/pages/ordersetting.htm。1.模板下載（3）測試模板下載任務(wù)實現(xiàn)在預(yù)約設(shè)置頁面，單擊“模板下載”按鈕，下載模板文件。1.模板下載（3）測試模板下載任務(wù)實現(xiàn)在ordersetting.html頁面中提供了上傳組件el-upload，需要為上傳組件el-upload設(shè)置屬性值。<el-uploadaction="/ordersetting/upload.do"

name="excelFile"

:show-file-list="false"

:before-upload="beforeUpload"

:on-success="handleSuccess"><el-buttontype="primary">上傳文件</el-button></el-upload>表示上傳的文件提交到后臺的地址是否顯示已上傳文件列表上傳文件之前執(zhí)行的鉤子函數(shù)文件上傳成功時執(zhí)行的鉤子函數(shù)上傳文件的名稱2.上傳文件（1）定義文件上傳方法任務(wù)實現(xiàn)在ordersetting.html頁面中定義beforeUpload()方法，用于校驗文件格式。beforeUpload(file){constisXLS=file.type==='application/vnd.ms-excel';if(isXLS){returntrue;}constisXLSX=file.type==='application/vnd'+'.openxmlformats-officedocument.spreadsheetml.sheet';if(isXLSX){returntrue;}this.$message.error('上傳文件只能是XLS或者XLSX格式!');returnfalse;}判斷文件格式是否為XLS判斷文件格式是否為XLSX2.上傳文件（1）定義文件上傳方法任務(wù)實現(xiàn)在ordersetting.html頁面中定義handleSuccess()方法，返回上傳成功或失敗的提示信息。handleSuccess(response,file){if(response.flag){

//上傳成功this.$message({message:response.message,type:'success'});}else{this.$message.error(response.message);//上傳失敗}console.log(response,file,fileList);}2.上傳文件（1）定義文件上傳方法任務(wù)實現(xiàn)在health_common子模塊的com.itheima.pojo包下創(chuàng)建OrderSetting類，在OrderSetting類中聲明預(yù)約設(shè)置的屬性，定義屬性的getter/setter方法，并定義OrderSetting類的構(gòu)造方法等。2.上傳文件（2）創(chuàng)建預(yù)約設(shè)置類任務(wù)實現(xiàn)在health_backend子模塊的com.itheima.controller包下創(chuàng)建控制器類OrderSettingController，在類中定義upload()方法，用于處理上傳Excel文件的請求。@RestController

@RequestMapping("/ordersetting")publicclassOrderSettingController{@Reference//查找服務(wù)privateOrderSettingServiceorderSettingService;@RequestMapping("/upload")publicResultupload(@RequestParam("excelFile")MultipartFileexcelFile){try{List<String[]>list=POIUtils.readExcel(excelFile);List<OrderSetting>data=newArrayList<>();//預(yù)約設(shè)置集合

省略

遍歷list，為data賦值

的過程orderSettingService.add(data);//調(diào)用服務(wù)接口，發(fā)送請求returnnewResult(true,MessageConstant.IMPORT_ORDERSETTING_SUCCESS);}catch(Exceptione){e.printStackTrace();returnnewResult(false,MessageConstant.IMPORT_ORDERSETTING_FAIL);}

}}2.上傳文件（3）實現(xiàn)導(dǎo)入預(yù)約設(shè)置信息控制器任務(wù)實現(xiàn)在health_interface子模塊的com.itheima.service包下創(chuàng)建接口OrderSettingService，在接口中定義add()方法，用于批量導(dǎo)入預(yù)約設(shè)置信息。publicinterfaceOrderSettingService{//文件上傳（Excel）publicvoidadd(List<OrderSetting>data);}2.上傳文件（4）創(chuàng)建導(dǎo)入預(yù)約設(shè)置信息服務(wù)任務(wù)實現(xiàn)在health_service_provider子模塊的com.itheima.service.impl包下創(chuàng)建OrderSettingService接口的實現(xiàn)類OrderSettingServiceImpl，重寫接口的add()方法實現(xiàn)批量導(dǎo)入預(yù)約設(shè)置信息。publicvoidadd(List<OrderSetting>list){if(list!=null&&list.size()>0){//判斷l(xiāng)istfor(OrderSettingorderSetting:list){//遍歷list//判斷當(dāng)前日期是否已經(jīng)進(jìn)行了預(yù)約設(shè)置longcount=orderSettingDao.findCountByOrderDate(orderSetting.getOrderDate());if(count>0){……//查詢當(dāng)前日期的已預(yù)約人數(shù)，如已預(yù)約人數(shù)大于設(shè)置的可預(yù)約人數(shù)，不能進(jìn)行預(yù)約設(shè)置//更新預(yù)約設(shè)置orderSettingDao.editNumberByOrderDate(orderSetting);}else{orderSettingDao.add(orderSetting);//新增預(yù)約設(shè)置}}}}2.上傳文件（5）實現(xiàn)導(dǎo)入預(yù)約設(shè)置信息服務(wù)任務(wù)實現(xiàn)在health_service_provider子模塊的com.itheima.dao包下創(chuàng)建持久層接口OrderSettingDao，用于處理與預(yù)約設(shè)置相關(guān)的操作。publicinterfaceOrderSettingDao{//查詢指定日期的預(yù)約設(shè)置publiclongfindCountByOrderDate(DateorderDate);//查詢指定日期的已預(yù)約人數(shù)publicintfindByReservations(DateorderDate);//更新預(yù)約設(shè)置publicvoideditNumberByOrderDate(OrderSettingorderSetting);//導(dǎo)入預(yù)約設(shè)置publicvoidadd(OrderSettingorderSetting);}2.上傳文件（6）實現(xiàn)持久層導(dǎo)入預(yù)約設(shè)置信息任務(wù)實現(xiàn)在health_service_provider模塊的src/main/resources目錄的com.itheima.dao目錄中創(chuàng)建與OrderSettingDao接口同名的映射文件OrderSettingDao.xml。在文件中使用<select>元素映射查詢語句，分別查詢指定日期的預(yù)約設(shè)置、指定日期的已預(yù)約人數(shù)。<!--查詢指定日期的預(yù)約設(shè)置--><selectid="findCountByOrderDate"parameterType="java.util.Date"resultType="java.lang.Long">SELECTcount(*)FROMt_ordersettingWHEREorderDate=#{orderDate}</select><!--查詢指定日期的已預(yù)約人數(shù)--><selectid="findByReservations"resultType="java.lang.Integer">SELECTreservationsFROMt_ordersettingWHEREorderDate=#{orderDate}</select>2.上傳文件（6）實現(xiàn)持久層導(dǎo)入預(yù)約設(shè)置信息任務(wù)實現(xiàn)在映射文件OrderSettingDao.xml中使用<update>元素映射更新語句，更新預(yù)約設(shè)置；使用<insert>元素映射新增語句，導(dǎo)入預(yù)約設(shè)置。<!--更新預(yù)約設(shè)置--><updateid="editNumberByOrderDate"parameterType="com.itheima.pojo.OrderSetting">UPDATEt_ordersettingSETnumber=#{number}WHEREorderDate=#{orderDate}</update><!--導(dǎo)入預(yù)約設(shè)置--><insertid="add"parameterType="com.itheima.pojo.OrderSetting">INSERTINTOt_ordersetting(number,orderDate)VALUES(#{number},#{orderDate})</insert>2.上傳文件（6）實現(xiàn)持久層導(dǎo)入預(yù)約設(shè)置信息任務(wù)實現(xiàn)啟動Zookeeper服務(wù)，在IDEA依次啟動health_service_provider和health_backend。在瀏覽器中訪問http://localhost:82/pages/ordersetting.html，單擊“上傳文件”按鈕，彈出選擇文件對話框。2.上傳文件（7）測試導(dǎo)入預(yù)約設(shè)置信息任務(wù)實現(xiàn)在預(yù)約設(shè)置頁面中，單擊“打開”按鈕上傳模板文件實現(xiàn)批量導(dǎo)入，如果導(dǎo)入成功，在頁面提示“批量導(dǎo)入預(yù)約設(shè)置數(shù)據(jù)成功”。2.上傳文件（7）測試導(dǎo)入預(yù)約設(shè)置信息任務(wù)實現(xiàn)查看數(shù)據(jù)表t_ordersetting中的數(shù)據(jù)，驗證導(dǎo)入預(yù)約設(shè)置信息的結(jié)果。2.上傳文件（7）測試導(dǎo)入預(yù)約設(shè)置信息日歷展示預(yù)約設(shè)置信息5-2任務(wù)描述在訪問ordersetting.html頁面時，日歷展示區(qū)中展示每天的預(yù)約設(shè)置信息；單擊“今天”、“<”或者“>”時，查詢并顯示當(dāng)月、上個月或者下個月的預(yù)約設(shè)置信息。日歷展示預(yù)約設(shè)置信息就是在訪問ordersetting.html頁面時，以日歷的形式在頁面上展示每個月中每一天的預(yù)約設(shè)置情況。本任務(wù)需要在訪問頁面時查詢預(yù)約設(shè)置信息并展示在日歷中，在單擊“今天”、“<”或者“>”按鈕查詢指定日期下的預(yù)約設(shè)置信息并展示在日歷中。任務(wù)分析任務(wù)分析（1）日歷初始化（2）接收和處理查詢預(yù)約設(shè)置信息請求（3）查詢預(yù)約設(shè)置信息（6）展示指定日期下的查詢結(jié)果（5）提交查詢指定日期下的預(yù)約設(shè)置信息的請求（4）展示查詢結(jié)果任務(wù)分析日歷展示預(yù)約設(shè)置信息的實現(xiàn)過程任務(wù)實現(xiàn)要想在日歷初始化時展示預(yù)約設(shè)置信息，需要在initData()方法中增加查詢預(yù)約設(shè)置信息的代碼，然后將查詢結(jié)果通過數(shù)據(jù)雙向綁定的方式進(jìn)行展示。initData:function(cur){省略初始化日歷模型的代碼

axios.get("/ordersetting/getOrderSettingByMonth.do?month="

+this.currentYear+"-"+this.currentMonth).then((res)=>{if(res.data.flag){this.leftobj=res.data.data;}else{this.$message.error(res.data.message);}});}（1）日歷初始化任務(wù)實現(xiàn)在health_backend子模塊的OrderSettingController類中定義getOrderSettingByMonth()方法，用于接收并處理根據(jù)日期查詢預(yù)約設(shè)置信息的請求。@RequestMapping("/getOrderSettingByMonth")publicResultgetOrderSettingByMonth(Stringmonth){try{//調(diào)用服務(wù)接口，發(fā)起請求，返回listList<Map<String,Object>>list=orderSettingService.getOrderSettingByMonth(month);returnnewResult(true,MessageConstant.GET_ORDERSETTING_SUCCESS,list);//成功}catch(Exceptione){e.printStackTrace();returnnewResult(false,MessageConstant.GET_ORDERSETTING_FAIL);//失敗}}（2）實現(xiàn)查詢預(yù)約設(shè)置信息控制器任務(wù)實現(xiàn)在health_interface子模塊的OrderSettingService接口中定義getOrderSettingByMonth()方法，用于根據(jù)日期查詢預(yù)約設(shè)置信息。//根據(jù)年月查詢對應(yīng)的預(yù)約設(shè)置信息publicList<Map<String,Object>>getOrderSettingByMonth(Stringmonth);（3）創(chuàng)建日歷展示預(yù)約設(shè)置信息服務(wù)任務(wù)實現(xiàn)在health_service_provider子模塊的OrderSettingServiceImpl類中重寫OrderSettingService接口的getOrderSettingByMonth()方法，用于根據(jù)日期查詢預(yù)約設(shè)置信息。@OverridepublicList<Map<String,Object>>getOrderSettingByMonth(Stringmonth){省略設(shè)置參數(shù)的過程List<OrderSetting>list=orderSettingDao.getOrderSettingByMonth(map);List<Map<String,Object>>data=newArrayList<>();for(OrderSettingorderSetting:list){//遍歷查詢結(jié)果Map<String,Object>orderSettingData=newHashMap<>();orderSettingData.put("date",orderSetting.getOrderDate().getDate());orderSettingData.put("number",orderSetting.getNumber());orderSettingData.put("reservations",orderSetting.getReservations());data.add(orderSettingData);//添加值}returndata;}（4）實現(xiàn)日歷展示預(yù)約設(shè)置信息服務(wù)任務(wù)實現(xiàn)在health_service_provider子模塊的OrderSettingDao接口中定義getOrderSettingByMonth()方法，根據(jù)日期查詢對應(yīng)的預(yù)約設(shè)置信息。//根據(jù)年月查詢對應(yīng)的預(yù)約設(shè)置信息publicList<OrderSetting>getOrderSettingByMonth(Map<String,String>map);（5）實現(xiàn)持久層查詢預(yù)約設(shè)置信息任務(wù)實現(xiàn)在health_service_provider子模塊的OrderSettingDao.xml映射文件中使用<select>元素映射查詢語句，根據(jù)日期查詢對應(yīng)的預(yù)約設(shè)置信息。<!--根據(jù)年月查詢對應(yīng)的預(yù)約設(shè)置信息--><selectid="getOrderSettingByMonth"parameterType="map"resultType="com.itheima.pojo.OrderSetting"> SELECT*FROMt_ordersetting WHEREorderDateBETWEEN#{begin}AND#{end}</select>通過BETWEEN...AND關(guān)鍵字實現(xiàn)條件查詢，查詢滿足條件范圍的預(yù)約設(shè)置信息。（5）實現(xiàn)持久層查詢預(yù)約設(shè)置信息任務(wù)實現(xiàn)依次啟動Zookeeper、health_service_provider和health_backend。在瀏覽器中訪問http://localhost:82/pages/ordersetting.html。注意：紅色標(biāo)識的日期表示預(yù)約已滿，藍(lán)色標(biāo)識的日期表示還可以預(yù)約，但是只有在當(dāng)前日期之后的日期才可以被預(yù)約。（6）測試日歷展示預(yù)約設(shè)置信息任務(wù)實現(xiàn)在ordersetting.html頁面中為“今天”、“<”或者“>”按鈕綁定單擊事件，并設(shè)置單擊時要執(zhí)行的方法。<divclass="choose">

<span@click="goCurrentMonth(currentYear,currentMonth)"

class="gotoday">今天</span><span@click="pickPre(currentYear,currentMonth)">?</span><span@click="pickNext(currentYear,currentMonth)">?</span></div>（7）定義指定年月查詢預(yù)約設(shè)置的方法任務(wù)實現(xiàn)在ordersetting.html頁面中定義goCurrentMonth()方法、pickPre()方法和pickNext()方法，用于查詢當(dāng)前月、上個月、下個月的預(yù)約設(shè)置信息。goCurrentMonth:function(year,month){//切換到當(dāng)前月份vard=newDate();this.initData(this.formatDate(d.getFullYear(),d.getMonth()+1,1));},pickPre:function(year,month){//向前一個月vard=newDate(this.formatDate(year,month,1));d.setDate(0);this.initData(this.formatDate(d.getFullYear(),d.getMonth()+1,1));},pickNext:function(year,month){//向后一個月vard=newDate(this.formatDate(year,month,1));d.setDate(35);////獲取指定天之后的日期this.initData(this.formatDate(d.getFullYear(),d.getMonth()+1,1));}formDate()方法用于格式化時間，返回類似2022-11-13格式的字符串。（7）定義指定年月查詢預(yù)約設(shè)置的方法任務(wù)實現(xiàn)啟動Zookeeper、health_service_provider和health_backend。在瀏覽器中訪問http://localhost:82/pages/ordersetting.html，單擊“<”按鈕，查詢2021年10月的預(yù)約設(shè)置信息并展示在日歷。（8）測試指定年月查詢預(yù)約設(shè)置基于日歷實現(xiàn)預(yù)約設(shè)置5-3任務(wù)描述在預(yù)約設(shè)置對話框中填寫可預(yù)約人數(shù)后，單擊“確定”按鈕即可完成預(yù)約設(shè)置。在傳智健康管理端預(yù)約設(shè)置的日歷中，每個日期都有一個“設(shè)置”按鈕，通過單擊“設(shè)置”按鈕會彈出預(yù)約設(shè)置對話框，在該對話框中可以設(shè)置當(dāng)前日期的預(yù)約人數(shù)。任務(wù)分析彈出預(yù)約設(shè)置對話框提交預(yù)約設(shè)置請求接收和處理預(yù)約設(shè)置的請求保存預(yù)約設(shè)置提示預(yù)約設(shè)置結(jié)果12345為頁面的“設(shè)置”按鈕綁定單擊事件，在單擊事件觸發(fā)后彈出預(yù)約設(shè)置對話框。為預(yù)約設(shè)置對話框的“確定”按鈕綁定單擊事件，在單擊事件觸發(fā)后提交表單數(shù)據(jù)。OrderSettingController類中的editNumberByOrderDate()方法接收頁面提交的請求。保存預(yù)約設(shè)置之前判斷當(dāng)前日期是否已經(jīng)有過預(yù)約設(shè)置，在更新預(yù)約設(shè)置時，需要比較數(shù)據(jù)庫中的已預(yù)約人數(shù)和當(dāng)前頁面輸入的可預(yù)約人數(shù)的大小。ordersetting.html頁面根據(jù)返回結(jié)果提示預(yù)約設(shè)置成功或失敗的信息。任務(wù)分析基于日歷實現(xiàn)預(yù)約設(shè)置的實現(xiàn)過程任務(wù)實現(xiàn)在ordersetting.html頁面中定義handleOrderSet()方法，用于彈出預(yù)約設(shè)置對話框和提交預(yù)約設(shè)置的請求。handleOrderSet(day){

this.$prompt("請輸入可預(yù)約人數(shù)","預(yù)約設(shè)置",{confirmButtonText:'確定',

cancelButtonText:'取消',inputPattern:/^[0-9]*[1-9][0-9]*$/,

inputErrorMessage:'請輸入數(shù)字'}).then(({value})=>{

axios.post("/ordersetting/editNumberByOrderDate.do",{number:value,

orderDate:this.formatDate(day.getFullYear(),day.getMonth()+1,day.getDate())}).then((res)=>{if(res.data.flag){

//查詢成功this.$message({type:'success',

message:res.data.message});

this.initData(this.formatDate(day.getFullYear(),day.getMonth()+1,1));//獲取最新的預(yù)約設(shè)置}else{this.$message.error(res.data.message);}});})}表示輸入的可預(yù)約人數(shù)表示被修改的日期表示輸入0~9的數(shù)字組合（1）彈出預(yù)約設(shè)置對話框任務(wù)實現(xiàn)為ordersetting.html頁面的“設(shè)置”按鈕綁定單擊事件，并設(shè)置單擊時調(diào)用handleOrderSet()方法，彈出預(yù)約設(shè)置對話框。<buttonv-if="dayobject.day>today"@click="handleOrderSet(dayobject.day)" class="orderbtn">設(shè)置</button>（1）彈出預(yù)約設(shè)置對話框任務(wù)實現(xiàn)在health_backend子模塊的OrderSettingController