cloud-server-management/src/main/webapp/WEB-INF/view/system/tSite/TSite_add.html
@@ -68,41 +68,29 @@ display: flex; align-items: center; margin-bottom: 10px; padding: 10px; background: #f9f9f9; padding: 8px; background: #f5f7fa; border-radius: 4px; } .field-item label { min-width: 100px; margin: 0 10px 0 0; font-weight: normal; } .field-item .form-control { .field-item input[type="text"] { flex: 1; margin-right: 10px; padding: 5px 10px; border: 1px solid #ddd; border-radius: 3px; } .field-item .btn-remove { color: #f56c6c; cursor: pointer; font-size: 18px; } .btn-add { color: #409EFF; cursor: pointer; color: #1ab394; margin-left: 10px; font-size: 16px; } .btn-add:hover { color: #18a689; } .btn-remove { cursor: pointer; color: #ed5565; font-size: 16px; } .btn-remove:hover { color: #da4453; margin-left: 5px; } .audience-checkboxes { @@ -110,51 +98,145 @@ gap: 20px; } .info-alert { background-color: #e7f4ff; border-left: 4px solid #409EFF; padding: 10px 15px; margin-bottom: 15px; .audience-checkboxes label { display: flex; align-items: center; cursor: pointer; } .audience-checkboxes input[type="checkbox"] { margin-right: 5px; } .time-slots-container { margin-top: 15px; } .time-slot-item { display: flex; align-items: center; margin-bottom: 10px; padding: 8px; background: #f5f7fa; border-radius: 4px; } .time-slot-item input[type="time"] { margin: 0 10px; padding: 5px; border: 1px solid #ddd; border-radius: 3px; } .price-table-container { margin-top: 20px; overflow-x: auto; margin-top: 15px; } .price-table { width: 100%; border-collapse: collapse; background: white; margin-top: 15px; } .price-table th, .price-table td { border: 1px solid #ddd; padding: 8px; padding: 10px; text-align: center; } .price-table th { background-color: #f5f7fa; background-color: #409EFF; color: white; font-weight: bold; color: #333; } .price-table tbody tr:nth-child(even) { background-color: #f9f9f9; } .price-input { width: 80px; padding: 5px; padding: 4px; border: 1px solid #ddd; border-radius: 3px; text-align: center; } .price-cell { display: flex; flex-direction: column; gap: 5px; align-items: center; } .price-label { font-size: 12px; color: #666; margin-bottom: 3px; } .info-alert { background-color: #fff3cd; border: 1px solid #ffc107; border-radius: 4px; padding: 12px; margin-bottom: 20px; color: #856404; } .tab-container { margin-bottom: 20px; } .tab-buttons { display: flex; gap: 10px; margin-bottom: 15px; border-bottom: 2px solid #e4e7ed; } .tab-btn { padding: 10px 20px; border: none; background: none; cursor: pointer; position: relative; color: #606266; } .tab-btn.active { color: #409EFF; } .tab-btn.active::after { content: ''; position: absolute; bottom: -2px; left: 0; right: 0; height: 2px; background-color: #409EFF; } .tab-content { display: none; } .tab-content.active { display: block; } </style> <script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.15&key=77b37f0753049c4e712ea79a24e0719c"></script> <div class="ibox float-e-margins"> <input hidden id="objectType" value="${objectType}"> <input hidden id="objectId" value="${objectId}"> <div class="ibox-content"> <!-- 步骤1:基本信息 --> <div class="step-container active" id="step1_basic_info"> <div class="form-horizontal" id="carInfoForm"> <input hidden id="objectType" value="${objectType}"> <input hidden id="objectId" value="${objectId}"> <input hidden id="role" value="${role}"> @if(objectType==1){ <div class="form-group" > @@ -202,7 +284,6 @@ </div> <#input style="width: 300px" id="name" name="*场地名称" type="text"/> <div class="form-group"> <label class="col-sm-3 control-label">是否可预约:</label> <div class="col-sm-9"> @@ -257,19 +338,148 @@ </div> </div> @} <div class="row btn-group-m-t"> <div class="col-sm-10 col-sm-offset-5" > <#button btnCss="info" name="提交" id="ensure" icon="fa-check" clickFun="TSite.addSubmit()"/> <#button btnCss="primary" name="下一步,设置价格" id="btn_next_price" icon="fa-arrow-right" clickFun="TSite.nextStep()"/> <#button btnCss="danger" name="取消" id="cancel" icon="fa-eraser" clickFun="TSite.close()"/> </div> </div> <div class="row btn-group-m-t"> <div class="col-sm-10 col-sm-offset-5" > <#button btnCss="danger" name="关闭" id="cancel" icon="fa-eraser" clickFun="TSite.close()"/> <#button btnCss="primary" name="下一步,设置价格" id="btn_next_price" icon="fa-arrow-right" clickFun="TSite.nextStep()"/> </div> </div> </div> </div> </div> <!-- 步骤1结束 --> <!-- 步骤2:价格配置 --> <div class="step-container" id="step2_price_config"> <div class="info-alert"> <strong>场地信息:</strong> <span id="display_site_name"></span> <span id="display_next_names"></span> <span id="display_half_names"></span> </div> <!-- 场地配置区域(顶部) --> <div class="price-config-section"> <div class="section-title">时段价格设置</div> <div class="form-group" id="siteMore_step2"> <label class="control-label">多场地配置:<i class="fa fa-plus btn-add" onclick="TSite.addFieldBox()"></i></label> <div id="field_container" style="margin-top: 10px;"> <!-- 动态添加的场地名称 --> </div> </div> <div class="form-group"> <label class="control-label">*是否可预定半场:</label> <div> <label style="margin-right: 20px;"> <input type="radio" name="ishalf_step2" value="2" checked onclick="TSite.updateHalfField(2)"> 否 </label> <label> <input type="radio" name="ishalf_step2" value="1" onclick="TSite.updateHalfField(1)"> 是 </label> </div> </div> <div class="form-group" id="halfCode_step2" style="display:none;"> <label class="control-label">*半场名称:<i class="fa fa-plus btn-add" onclick="TSite.addHalfFieldBox()"></i></label> <div id="half_field_container" style="margin-top: 10px;"> <!-- 动态添加的半场名称 --> </div> </div> </div> <!-- 价格配置区域 --> <div class="price-config-section"> <div class="section-title">价格配置</div> <div class="info-alert"> <i class="fa fa-info-circle"></i> <strong>说明:</strong> 请先选择面向人群和半场配置,然后点击"生成价格表"按钮来创建价格配置表。 </div> <!-- 面向人群 --> <div class="form-group"> <label class="control-label">*面向人群:</label> <div class="audience-checkboxes"> <label> <input type="checkbox" value="1" id="audience_booking"> 订场 </label> <label> <input type="checkbox" value="2" id="audience_walkin" checked> 散客 </label> </div> <small class="text-muted">至少选择一项</small> </div> <!-- 容纳散客数 --> <div class="form-group" id="walkin_capacity_group" style="display:none;"> <label class="control-label">*容纳散客数:</label> <input type="number" id="walkin_capacity" class="form-control" style="width: 200px;" min="1" value="20" placeholder="请输入容纳散客数"> </div> <!-- 生成价格表按钮 --> <div class="form-group"> <button type="button" class="btn btn-primary" onclick="TSite.generatePriceTables()"> <i class="fa fa-table"></i> 生成价格表 </button> <small class="text-muted" style="margin-left: 10px;">修改面向人群或半场配置后,需要重新生成价格表</small> </div> </div> <!-- 订场价格表区域 --> <div class="price-config-section" id="booking_section" style="display:none;"> <div class="section-title"> 订场价格 <button type="button" class="btn btn-sm btn-primary" style="margin-left: 20px;" onclick="TSite.addBookingTimeSlot()"> <i class="fa fa-plus"></i> 添加时段 </button> </div> <div class="price-table-container"> <table class="price-table" id="booking_price_table"> <thead id="booking_thead"> <!-- 表头将根据是否可预订半场动态生成 --> </thead> <tbody id="booking_price_tbody"> <!-- 价格行将动态添加 --> </tbody> </table> </div> </div> <!-- 散客价格表区域 --> <div class="price-config-section" id="walkin_section" style="display:block;"> <div class="section-title"> 散客价格 <button type="button" class="btn btn-sm btn-primary" style="margin-left: 20px;" onclick="TSite.addWalkinTimeSlot()"> <i class="fa fa-plus"></i> 添加时段 </button> </div> <div class="price-table-container"> <table class="price-table" id="walkin_price_table"> <thead id="walkin_thead"> <!-- 表头将根据是否可预订半场动态生成 --> </thead> <tbody id="walkin_price_tbody"> <!-- 价格行将动态添加 --> </tbody> </table> </div> </div> <!-- 底部按钮组 --> <div class="row btn-group-m-t"> <div class="col-sm-10 col-sm-offset-5"> <#button btnCss="default" name="上一步" id="btn_prev" icon="fa-arrow-left" clickFun="TSite.previousStep()"/> <#button btnCss="success" name="保存场地信息" id="btn_save_all" icon="fa-save" clickFun="TSite.saveAllData()"/> <#button btnCss="danger" name="关闭" id="btn_close" icon="fa-eraser" clickFun="TSite.close()"/> </div> </div> </div> <!-- 步骤2结束 --> </div> </div> <script src="${ctxPath}/modular/system/tSite/tSite.js"></script> @@ -331,9 +541,52 @@ function updateHtml(e) { console.log("是否可预约变更:", e); // 暂时不需要特殊处理,价格配置在步骤2进行 laydate.render({ elem: '#start-time', type: "time", format: "HH:mm", ready: formatminutes }); laydate.render({ elem: '#end-time' , type: "time", format: "HH:mm", ready: formatminutes }); function addBox() { var a=" <div class=\"col-sm-8 control-label\" id=\"far\">\n" + " <label class=\"col-sm-2 control-label\">*单个场地名</label>\n" + " <div class=\"col-sm-3\">\n" + " <input type=\"text\" name=\"name1\" class=\"form-control newWidth\" /> \n" + " </div> \n" + " <div class=\"col-sm-1\">\n" + " <i class=\"col-sm-1 fa fa-remove\" onclick=\"delBox(this)\" style=\"margin-top:10px\"></i>\n" + " </div> \n" + " </div> " $("#siteMore").append($(a)) } function addBox1() { var a=" <div class=\"col-sm-8 control-label\" id=\"far\" style=\"margin-left: 210px;\">\n" + " <label class=\"col-sm-2 control-label\">*半场名称:</label>\n" + " <div class=\"col-sm-3\">\n" + " <input type=\"text\" name=\"name2\" class=\"form-control newWidth\" style=\"margin-left: 8px;width: 240px;\"/> \n" + " </div> \n" + " <div class=\"col-sm-1\">\n" + " <i class=\"col-sm-1 fa fa-remove\" onclick=\"delBox(this)\" style=\"margin-top:10px\"></i>\n" + " </div> \n" + " </div> " $("#halfName").append($(a)) } function delBox(o) { $(o).parent("div").parent("div").remove() } function updateHalf(e) { if(e==1){ $("#halfCode").hide() }else { $("#halfCode").show() } } @@ -371,5 +624,109 @@ created() { }, }); var selectElement = document.getElementById('store'); var startTime = document.getElementById('start-time'); var endTime = document.getElementById('end-time'); startTime.disabled = true; endTime.disabled = true; selectElement.addEventListener('change',function () { if (selectElement.value !== ''){ startTime.disabled = false; endTime.disabled = false; }else{ startTime.disabled = true; endTime.disabled = true; } }); function updateHtml(e) { console.log("进入看看") console.log(e) if(e==0){ $("#reservation").hide() }else { $("#reservation").show() } } function updateTime1() { var selectedValue = document.getElementById("siteTypeOne").value; var priceLabel = document.getElementById("priceLabel"); var priceLabel1 = document.getElementById("priceLabel1"); var priceLabel3 = document.getElementById("priceLabel3"); var priceLabel4 = document.getElementById("priceLabel4"); if (selectedValue === "智慧场地") { console.log("=============智慧场地=") priceLabel.innerText = "元/15分钟"; priceLabel1.innerText = "元/15分钟"; priceLabel3.innerText = "元/15分钟"; priceLabel4.innerText = "元/15分钟"; } else { priceLabel.innerText = "元/半小时"; priceLabel1.innerText = "元/半小时"; priceLabel3.innerText = "元/半小时"; priceLabel4.innerText = "元/半小时"; } $("#end-time").val(''); $("#start-time").val(''); } function updateTime(e) { let one = $("#siteTypeOne").val() var timeInputs = document.querySelectorAll('input[type="time"]'); console.log(timeInputs) var selectedTime=''; if(e==1){ var selectedTime = $("#start-time").val(); }else { var selectedTime = $("#end-time").val(); } var hour = selectedTime.split(':')[0]; var minute = selectedTime.split(':')[1]; if(one=="普通场地"){ console.log( one ) if (minute < 30 &&minute>0) { minute = '30'; } else if (minute >30) { hour++; minute = '00'; if (hour<10){ hour = '0'+hour; } } }else { console.log( one,minute ) if (minute <= 15 && minute>0) { console.log(1) minute = '15'; }else if(minute<=30){ console.log(2) minute = '30'; }else if(minute<=45){ console.log(3) minute = '45'; }else if (minute >45) { console.log(4) hour++; minute = '00'; if (hour<10){ hour = '0'+hour; } } } if(e==1){ $("#start-time").val(hour + ':' + minute) }else { $("#end-time").val(hour + ':' + minute) } } </script> @} cloud-server-management/src/main/webapp/WEB-INF/view/system/tSite/TSite_edit.html
@@ -359,11 +359,8 @@ @} <div class="row btn-group-m-t"> <div class="col-sm-10 col-sm-offset-5" > @if(type==1){ <#button btnCss="info" name="提交" id="ensure" icon="fa-check" clickFun="TSiteInfo.addSubmit()"/> <#button btnCss="primary" name="下一步,设置价格" id="btn_next_price" icon="fa-arrow-right" clickFun="TSiteInfo.nextStep()"/> @} <#button btnCss="danger" name="关闭" id="cancel" icon="fa-eraser" clickFun="TSiteInfo.close()"/> <#button btnCss="primary" name="下一步,设置价格" id="btn_next_price" icon="fa-arrow-right" clickFun="TSiteInfo.nextStep()"/> </div> </div> <input hidden id="role" value="${role}"> @@ -430,7 +427,7 @@ <div class="info-alert"> <i class="fa fa-info-circle"></i> <strong>说明:</strong> 点击"添加时段"按钮添加新的时段价格配置。全场价格适用于所有子场地,半场价格适用于所有半场。 请先选择面向人群和半场配置,然后点击"生成价格表"按钮来创建价格配置表。 </div> <!-- 面向人群 --> @@ -444,7 +441,7 @@ <input type="checkbox" value="2" id="audience_walkin" checked> 散客 </label> </div> <small class="text-muted">至少选择一项,选择后对应的价格表才会显示</small> <small class="text-muted">至少选择一项</small> </div> <!-- 容纳散客数 --> @@ -452,6 +449,14 @@ <label class="control-label">*容纳散客数:</label> <input type="number" id="walkin_capacity" class="form-control" style="width: 200px;" min="1" value="20" placeholder="请输入容纳散客数"> </div> <!-- 生成价格表按钮 --> <div class="form-group"> <button type="button" class="btn btn-primary" onclick="TSiteInfo.generatePriceTables()"> <i class="fa fa-table"></i> 生成价格表 </button> <small class="text-muted" style="margin-left: 10px;">修改面向人群或半场配置后,需要重新生成价格表</small> </div> </div> <!-- 订场价格表区域 --> cloud-server-management/src/main/webapp/static/modular/system/tSite/tSite.js
@@ -864,22 +864,742 @@ }); /** * 下一步:跳转到价格配置 * 下一步:切换到价格配置 */ TSite.nextStep = function() { // 验证基本信息是否填写完整 var storeName = $("#name").val(); if (!storeName) { Feng.error("请先填写场地名称!"); var siteName = $("#name").val(); // 验证场地名称 if (!siteName) { Feng.error("请输入场地名称!"); return; } var insuranceEndTime = $("#insuranceEndTime").val(); if (!insuranceEndTime) { Feng.error("请先填写场地责任险有效期!"); // 这些将在步骤二中配置 var isHalf = 2; // 默认不可预定半场 var nextNames = []; var halfNames = []; // 保存信息到全局变量 TSite.priceConfig = { siteName: siteName, isHalf: isHalf, nextNames: nextNames, halfNames: halfNames, timeSlots: [], priceData: {} }; // 显示场地信息 $("#display_site_name").text(siteName); $("#display_next_names").html(""); // 清空 $("#display_half_names").html(""); // 清空 // 切换步骤,仅依赖CSS的active class $("#step1_basic_info").removeClass('active'); $("#step2_price_config").addClass('active'); // 初始化价格配置 TSite.initPriceConfig(); // 滚动到顶部 $('html, body').animate({scrollTop: 0}, 300); } /** * 上一步:返回基本信息 */ TSite.previousStep = function() { // 切换步骤,仅依赖CSS的active class $("#step2_price_config").removeClass('active'); $("#step1_basic_info").addClass('active'); // 滚动到顶部 $('html, body').animate({scrollTop: 0}, 300); } /** * 初始化价格配置 */ TSite.initPriceConfig = function() { // 初始化计数器 TSite.bookingRowIndex = 0; TSite.walkinRowIndex = 0; // 清空价格表 $("#booking_price_tbody").empty(); $("#walkin_price_tbody").empty(); // 隐藏价格表区域 $("#booking_section").hide(); $("#walkin_section").hide(); // 标记价格表未生成 TSite.priceTablesGenerated = false; // 初始化是否可预定半场状态 var isHalf = TSite.priceConfig ? TSite.priceConfig.isHalf : 2; if (isHalf == 1) { $("input[name='ishalf_step2'][value='1']").prop('checked', true); $("#halfCode_step2").show(); } else { $("input[name='ishalf_step2'][value='2']").prop('checked', true); $("#halfCode_step2").hide(); } // 监听人群选择变化 $("#audience_booking, #audience_walkin").off('change').on('change', function() { TSite.updateAudienceUI(); // 如果价格表已生成,提示需要重新生成 if (TSite.priceTablesGenerated) { TSite.clearPriceTables(); } }); // 更新界面(但不显示价格表) TSite.updateAudienceUI(); } /** * 生成价格表 */ TSite.generatePriceTables = function() { // 验证人群选择 var bookingChecked = $("#audience_booking").is(':checked'); var walkinChecked = $("#audience_walkin").is(':checked'); if (!bookingChecked && !walkinChecked) { Feng.error("请至少选择一种面向人群!"); return; } // 提示:需要先保存基本信息 Feng.info("请先点击【提交】按钮保存场地基本信息,保存成功后在编辑页面进行价格配置!"); }; // 验证容纳散客数 if (walkinChecked) { var walkinCapacity = $("#walkin_capacity").val(); if (!walkinCapacity || parseInt(walkinCapacity) <= 0) { Feng.error("请输入有效的容纳散客数!"); return; } } // 清除现有价格表 TSite.clearPriceTables(); // 生成表头 TSite.buildTableHeaders(); // 显示对应的价格表区域 if (bookingChecked) { $("#booking_section").show(); } if (walkinChecked) { $("#walkin_section").show(); } // 标记价格表已生成 TSite.priceTablesGenerated = true; Feng.success("价格表已生成,请添加时段并填写价格!"); } /** * 清除价格表 */ TSite.clearPriceTables = function() { // 清空价格表内容 $("#booking_price_tbody").empty(); $("#walkin_price_tbody").empty(); // 隐藏价格表区域 $("#booking_section").hide(); $("#walkin_section").hide(); // 重置计数器 TSite.bookingRowIndex = 0; TSite.walkinRowIndex = 0; // 标记价格表未生成 TSite.priceTablesGenerated = false; Feng.info("价格配置已清除,请重新生成价格表!"); } /** * 添加场地名 */ TSite.addFieldBox = function() { var html = '<div class="field-item">' + '<label>*单个场地名</label>' + '<input type="text" name="name1_step2" class="form-control" style="flex:1;margin-right:10px;" placeholder="请输入场地名"/>' + '<i class="fa fa-remove btn-remove" onclick="TSite.removeFieldBox(this)"></i>' + '</div>'; $("#field_container").append(html); } /** * 删除场地名 */ TSite.removeFieldBox = function(btn) { $(btn).closest('.field-item').remove(); } /** * 添加半场名称 */ TSite.addHalfFieldBox = function() { var html = '<div class="field-item">' + '<label>*半场名称</label>' + '<input type="text" name="name2_step2" class="form-control" style="flex:1;margin-right:10px;" placeholder="请输入半场名称"/>' + '<i class="fa fa-remove btn-remove" onclick="TSite.removeHalfFieldBox(this)"></i>' + '</div>'; $("#half_field_container").append(html); } /** * 删除半场名称 */ TSite.removeHalfFieldBox = function(btn) { $(btn).closest('.field-item').remove(); } /** * 更新半场字段显示 */ TSite.updateHalfField = function(value) { if (value == 1) { $("#halfCode_step2").show(); // 更新isHalf TSite.priceConfig.isHalf = 1; } else { $("#halfCode_step2").hide(); TSite.priceConfig.isHalf = 2; } // 如果价格表已生成,清除价格表 if (TSite.priceTablesGenerated) { TSite.clearPriceTables(); } } /** * 更新人群相关UI */ TSite.updateAudienceUI = function() { var walkinChecked = $("#audience_walkin").is(':checked'); // 只控制容纳散客数字段的显示/隐藏 // 价格表的显示由生成按钮控制 if (walkinChecked) { $("#walkin_capacity_group").show(); } else { $("#walkin_capacity_group").hide(); } } /** * 构建表头 */ TSite.buildTableHeaders = function() { var isHalf = TSite.priceConfig ? TSite.priceConfig.isHalf : 2; var headerHtml = '<tr>' + '<th rowspan="3" width="120">时段开始</th>' + '<th rowspan="3" width="120">时段结束</th>'; // 周一到周日的表头 var weekDays = ['周一', '周二', '周三', '周四', '周五', '周六', '周日']; if (isHalf == 1) { // 如果可预订半场,每天有4列(全场×2 + 半场×2) for (var i = 0; i < weekDays.length; i++) { headerHtml += '<th colspan="4">' + weekDays[i] + '</th>'; } headerHtml += '<th rowspan="3" width="80">操作</th>' + '</tr>' + '<tr>'; // 第二行:全场/半场 for (var i = 0; i < weekDays.length; i++) { headerHtml += '<th colspan="2">全场</th>' + '<th colspan="2">半场</th>'; } headerHtml += '</tr>' + '<tr>'; // 第三行:现金/玩湃币 for (var i = 0; i < weekDays.length; i++) { headerHtml += '<th width="80">现金</th>' + '<th width="80">玩湃币</th>' + '<th width="80">现金</th>' + '<th width="80">玩湃币</th>'; } } else { // 如果不可预订半场,每天有2列(全场×2) for (var i = 0; i < weekDays.length; i++) { headerHtml += '<th colspan="2">' + weekDays[i] + '</th>'; } headerHtml += '<th rowspan="3" width="80">操作</th>' + '</tr>' + '<tr>'; // 第二行:全场 for (var i = 0; i < weekDays.length; i++) { headerHtml += '<th colspan="2">全场</th>'; } headerHtml += '</tr>' + '<tr>'; // 第三行:现金/玩湃币 for (var i = 0; i < weekDays.length; i++) { headerHtml += '<th width="80">现金</th>' + '<th width="80">玩湃币</th>'; } } headerHtml += '</tr>'; // 设置表头 $("#booking_thead").html(headerHtml); $("#walkin_thead").html(headerHtml); } /** * 添加订场时段 */ TSite.addBookingTimeSlot = function() { var isHalf = TSite.priceConfig ? TSite.priceConfig.isHalf : 2; var index = TSite.bookingRowIndex++; var html = '<tr data-index="' + index + '">' + '<td><input type="time" class="form-control" id="booking_start_' + index + '" value="09:00"></td>' + '<td><input type="time" class="form-control" id="booking_end_' + index + '" value="10:00"></td>'; // 周一到周日,每天的价格输入框 for (var day = 1; day <= 7; day++) { if (isHalf == 1) { // 全场现金、全场玩湃币、半场现金、半场玩湃币 html += '<td><input type="number" class="form-control price-input" id="booking_' + index + '_' + day + '_full_cash" min="0" step="0.01" placeholder="0"></td>' + '<td><input type="number" class="form-control price-input" id="booking_' + index + '_' + day + '_full_coin" min="0" step="0.01" placeholder="0"></td>' + '<td><input type="number" class="form-control price-input" id="booking_' + index + '_' + day + '_half_cash" min="0" step="0.01" placeholder="0"></td>' + '<td><input type="number" class="form-control price-input" id="booking_' + index + '_' + day + '_half_coin" min="0" step="0.01" placeholder="0"></td>'; } else { // 全场现金、全场玩湃币 html += '<td><input type="number" class="form-control price-input" id="booking_' + index + '_' + day + '_full_cash" min="0" step="0.01" placeholder="0"></td>' + '<td><input type="number" class="form-control price-input" id="booking_' + index + '_' + day + '_full_coin" min="0" step="0.01" placeholder="0"></td>'; } } html += '<td><button type="button" class="btn btn-sm btn-danger" onclick="TSite.removeTimeSlot(this)"><i class="fa fa-trash"></i></button></td>' + '</tr>'; $("#booking_price_tbody").append(html); } /** * 添加散客时段 */ TSite.addWalkinTimeSlot = function() { var isHalf = TSite.priceConfig ? TSite.priceConfig.isHalf : 2; var index = TSite.walkinRowIndex++; var html = '<tr data-index="' + index + '">' + '<td><input type="time" class="form-control" id="walkin_start_' + index + '" value="09:00"></td>' + '<td><input type="time" class="form-control" id="walkin_end_' + index + '" value="10:00"></td>'; // 周一到周日,每天的价格输入框 for (var day = 1; day <= 7; day++) { if (isHalf == 1) { // 全场现金、全场玩湃币、半场现金、半场玩湃币 html += '<td><input type="number" class="form-control price-input" id="walkin_' + index + '_' + day + '_full_cash" min="0" step="0.01" placeholder="0"></td>' + '<td><input type="number" class="form-control price-input" id="walkin_' + index + '_' + day + '_full_coin" min="0" step="0.01" placeholder="0"></td>' + '<td><input type="number" class="form-control price-input" id="walkin_' + index + '_' + day + '_half_cash" min="0" step="0.01" placeholder="0"></td>' + '<td><input type="number" class="form-control price-input" id="walkin_' + index + '_' + day + '_half_coin" min="0" step="0.01" placeholder="0"></td>'; } else { // 全场现金、全场玩湃币 html += '<td><input type="number" class="form-control price-input" id="walkin_' + index + '_' + day + '_full_cash" min="0" step="0.01" placeholder="0"></td>' + '<td><input type="number" class="form-control price-input" id="walkin_' + index + '_' + day + '_full_coin" min="0" step="0.01" placeholder="0"></td>'; } } html += '<td><button type="button" class="btn btn-sm btn-danger" onclick="TSite.removeTimeSlot(this)"><i class="fa fa-trash"></i></button></td>' + '</tr>'; $("#walkin_price_tbody").append(html); } /** * 删除时段 */ TSite.removeTimeSlot = function(btn) { $(btn).closest('tr').remove(); } /** * 保存所有数据(基本信息+价格配置) */ TSite.saveAllData = function() { // 验证价格表是否已生成 if (!TSite.priceTablesGenerated) { Feng.error("请先点击【生成价格表】按钮生成价格配置表!"); return; } // 验证人群选择 var bookingChecked = $("#audience_booking").is(':checked'); var walkinChecked = $("#audience_walkin").is(':checked'); if (!bookingChecked && !walkinChecked) { Feng.error("请至少选择一种面向人群!"); return; } // 验证容纳散客数 if (walkinChecked) { var walkinCapacity = parseInt($("#walkin_capacity").val()); if (!walkinCapacity || walkinCapacity <= 0) { Feng.error("请输入有效的容纳散客数!"); return; } } // 收集价格数据 var priceDetails = TSite.collectPriceData(); if (priceDetails.length === 0) { Feng.error("请至少添加一个时段并填写价格!"); return; } // 收集基本信息数据 var basicData = TSite.collectBasicData(); if (!basicData) { return; // 基本信息验证失败 } // 收集场地配置 var nextNames = []; $("input[name='name1_step2']").each(function() { var val = $(this).val(); if (val) { nextNames.push(val); } }); var halfNames = []; $("input[name='name2_step2']").each(function() { var val = $(this).val(); if (val) { halfNames.push(val); } }); var isHalf = $("input[name='ishalf_step2']:checked").val(); // 构建提交数据 var targetAudience = []; if (bookingChecked) targetAudience.push('1'); if (walkinChecked) targetAudience.push('2'); // 合并基本信息和价格配置 basicData.targetAudience = targetAudience.join(','); basicData.walkinCapacity = walkinChecked ? parseInt($("#walkin_capacity").val()) : 0; basicData.nextName = nextNames.join(','); basicData.halfName = halfNames.join(','); basicData.isHalf = parseInt(isHalf); basicData.priceDetails = priceDetails; // 确认提交 layer.confirm('确定要保存场地信息吗?', { btn: ['确定', '取消'] }, function(index) { layer.close(index); // 提交到后端 $.ajax({ url: Feng.ctxPath + "/tSite/addSite", type: "POST", data: JSON.stringify(basicData), contentType: "application/json", success: function(response) { Feng.success("场地信息保存成功!"); // 刷新列表 if (window.parent.TSite && window.parent.TSite.table) { window.parent.TSite.table.refresh(); } // 关闭页面 setTimeout(function() { TSite.close(); }, 1500); }, error: function(xhr, status, error) { var errorMsg = "保存失败"; if (xhr.responseJSON && xhr.responseJSON.message) { errorMsg = xhr.responseJSON.message; } Feng.error(errorMsg); } }); }); } /** * 收集基本信息数据 */ TSite.collectBasicData = function() { var data = { province:"", city:"", cityManagerId:"", storeId:"", siteTypeId:null, appointmentStartTime:"", appointmentEndTime:"", cashPrice:null, playPaiCoin:null, insuranceEndTime:"", name:"", insuranceImg:"", managementPlan:"", operatorId:"", typeName:"", nextName:"", ishalf:"", cashPriceOne:"", playPaiCoinOne:"", halfName:"", introduce:"", imgs:"", reservation:"", isCanBeBooked:"", type:"", }; data.province = $("#pCode").val() data.city = $("#cCode").val() data.cityManagerId = $("#account").val() data.storeId = $("#store").val() data.siteTypeId = $("#siteTypeId").val() data.appointmentStartTime= $("#start-time").val() data.appointmentEndTime = $("#end-time").val() data.cashPrice = $("#cashPrice").val() data.playPaiCoin = $("#playPaiCoin").val() data.insuranceEndTime = $("#insuranceEndTime").val() data.name = $("#name").val() data.insuranceImg = $("#img").val() data.managementPlan = $('#courseVideo').val() data.typeName = $('#siteTypeOne').val() var reservation= $("input[name='reservation']:checked").val(); data.reservation= reservation; data.isCanBeBooked= reservation; var checkbox = document.querySelector('input[name="pt"]'); if (checkbox!=null){ if (checkbox.checked) { data.type = 1 data.operatorId = 0; } else { data.type = 2; } } var SelectValue=""; var getSelectValueMenbers = $("input[name='pt']:checked").each(function(j) { if (j >= 0) { SelectValue += $(this).val() } }); if(SelectValue==''){ let yys = $("#yys").val() if(yys==""){ Feng.info("请选择运营商") return null; } SelectValue= yys } data.operatorId= SelectValue; let introduce = ""; var objectType = $("#objectType").val(); if (objectType==1){ introduce = TSite.editor.getContent(); if(introduce==""){ Feng.info("请输入公告内容") return null; } } data.introduce= introduce; var goodImgs = this.goodsPicArray; if(objectType==1){ if(goodImgs.length==0){ Feng.info("请上传实景图") return null; } } var imgOne =""; for (let i = 0; i <goodImgs.length; i++) { if(i==goodImgs.length-1){ imgOne += (goodImgs[i].response) }else { imgOne+=(goodImgs[i].response+",") } } data.imgs = imgOne // 基本验证 if($("#store").val()=='' ){ Feng.info("请选择门店") return null; } if($("#siteTypeId").val()=='' ){ Feng.info("请选择场地分类") return null; } if($("#name").val()==''){ Feng.info("请输入场地名称") return null; } if($("#insuranceEndTime").val()==''){ Feng.info("请输入场地责任险有效期") return null; } if($("#img").val()==''){ Feng.info("请上传场地责任有效期图片") return null; } if($('#courseVideo').val()==''){ Feng.info("请上传消防及应急管理方案") return null; } return data; } /** * 收集价格数据 */ TSite.collectPriceData = function() { var priceDetails = []; var isHalf = TSite.priceConfig ? TSite.priceConfig.isHalf : 2; var bookingChecked = $("#audience_booking").is(':checked'); var walkinChecked = $("#audience_walkin").is(':checked'); // 收集订场价格 if (bookingChecked) { $("#booking_price_tbody tr").each(function() { var index = $(this).data('index'); var startTime = $("#booking_start_" + index).val(); var endTime = $("#booking_end_" + index).val(); // 验证时段 if (!startTime || !endTime) { Feng.error("订场价格配置中存在空的时段!"); return false; } if (startTime >= endTime) { Feng.error("订场价格配置中,结束时间必须大于开始时间!"); return false; } // 遍历周一到周日 for (var day = 1; day <= 7; day++) { var fullCash = parseFloat($("#booking_" + index + "_" + day + "_full_cash").val() || 0); var fullCoin = parseFloat($("#booking_" + index + "_" + day + "_full_coin").val() || 0); // 全场价格 if (fullCash > 0 || fullCoin > 0) { priceDetails.push({ startTime: startTime, endTime: endTime, dayOfWeek: day, targetAudience: 1, fieldType: 'full', cashPrice: fullCash, coinPrice: fullCoin }); } // 半场价格(如果可预订半场) if (isHalf == 1) { var halfCash = parseFloat($("#booking_" + index + "_" + day + "_half_cash").val() || 0); var halfCoin = parseFloat($("#booking_" + index + "_" + day + "_half_coin").val() || 0); if (halfCash > 0 || halfCoin > 0) { priceDetails.push({ startTime: startTime, endTime: endTime, dayOfWeek: day, targetAudience: 1, fieldType: 'half', cashPrice: halfCash, coinPrice: halfCoin }); } } } }); } // 收集散客价格 if (walkinChecked) { $("#walkin_price_tbody tr").each(function() { var index = $(this).data('index'); var startTime = $("#walkin_start_" + index).val(); var endTime = $("#walkin_end_" + index).val(); // 验证时段 if (!startTime || !endTime) { Feng.error("散客价格配置中存在空的时段!"); return false; } if (startTime >= endTime) { Feng.error("散客价格配置中,结束时间必须大于开始时间!"); return false; } // 遍历周一到周日 for (var day = 1; day <= 7; day++) { var fullCash = parseFloat($("#walkin_" + index + "_" + day + "_full_cash").val() || 0); var fullCoin = parseFloat($("#walkin_" + index + "_" + day + "_full_coin").val() || 0); // 全场价格 if (fullCash > 0 || fullCoin > 0) { priceDetails.push({ startTime: startTime, endTime: endTime, dayOfWeek: day, targetAudience: 2, fieldType: 'full', cashPrice: fullCash, coinPrice: fullCoin }); } // 半场价格(如果可预订半场) if (isHalf == 1) { var halfCash = parseFloat($("#walkin_" + index + "_" + day + "_half_cash").val() || 0); var halfCoin = parseFloat($("#walkin_" + index + "_" + day + "_half_coin").val() || 0); if (halfCash > 0 || halfCoin > 0) { priceDetails.push({ startTime: startTime, endTime: endTime, dayOfWeek: day, targetAudience: 2, fieldType: 'half', cashPrice: halfCash, coinPrice: halfCoin }); } } } }); } return priceDetails; }; cloud-server-management/src/main/webapp/static/modular/system/tSite/tSite_info.js
@@ -640,23 +640,31 @@ * 初始化价格配置 */ TSiteInfo.initPriceConfig = function() { // 监听人群选择 $("#audience_booking, #audience_walkin").off('change').on('change', function() { TSiteInfo.updateAudienceUI(); }); // 清空价格表 $("#booking_price_tbody").empty(); $("#walkin_price_tbody").empty(); // 隐藏价格表区域 $("#booking_section").hide(); $("#walkin_section").hide(); // 标记价格表未生成 TSiteInfo.priceTablesGenerated = false; // 初始化计数器 TSiteInfo.bookingRowIndex = 0; TSiteInfo.walkinRowIndex = 0; // 生成表头 TSiteInfo.buildTableHeaders(); // 监听人群选择变化 $("#audience_booking, #audience_walkin").off('change').on('change', function() { TSiteInfo.updateAudienceUI(); // 如果价格表已生成,提示需要重新生成 if (TSiteInfo.priceTablesGenerated) { TSiteInfo.clearPriceTables(); } }); // 更新界面 // 更新界面(但不显示价格表) TSiteInfo.updateAudienceUI(); // 初始化是否可预定半场状态 @@ -668,6 +676,70 @@ $("input[name='ishalf_step2'][value='2']").prop('checked', true); $("#halfCode_step2").hide(); } } /** * 生成价格表 */ TSiteInfo.generatePriceTables = function() { // 验证人群选择 var bookingChecked = $("#audience_booking").is(':checked'); var walkinChecked = $("#audience_walkin").is(':checked'); if (!bookingChecked && !walkinChecked) { Feng.error("请至少选择一种面向人群!"); return; } // 验证容纳散客数 if (walkinChecked) { var walkinCapacity = $("#walkin_capacity").val(); if (!walkinCapacity || parseInt(walkinCapacity) <= 0) { Feng.error("请输入有效的容纳散客数!"); return; } } // 清除现有价格表 TSiteInfo.clearPriceTables(); // 生成表头 TSiteInfo.buildTableHeaders(); // 显示对应的价格表区域 if (bookingChecked) { $("#booking_section").show(); } if (walkinChecked) { $("#walkin_section").show(); } // 标记价格表已生成 TSiteInfo.priceTablesGenerated = true; Feng.success("价格表已生成,请添加时段并填写价格!"); } /** * 清除价格表 */ TSiteInfo.clearPriceTables = function() { // 清空价格表内容 $("#booking_price_tbody").empty(); $("#walkin_price_tbody").empty(); // 隐藏价格表区域 $("#booking_section").hide(); $("#walkin_section").hide(); // 重置计数器 TSiteInfo.bookingRowIndex = 0; TSiteInfo.walkinRowIndex = 0; // 标记价格表未生成 TSiteInfo.priceTablesGenerated = false; Feng.info("价格配置已清除,请重新生成价格表!"); } /** @@ -714,36 +786,30 @@ TSiteInfo.updateHalfField = function(value) { if (value == 1) { $("#halfCode_step2").show(); // 更新isHalf并重新生成表头 // 更新isHalf TSiteInfo.priceConfig.isHalf = 1; } else { $("#halfCode_step2").hide(); TSiteInfo.priceConfig.isHalf = 2; } // 重新生成表头 TSiteInfo.buildTableHeaders(); // 如果价格表已生成,清除价格表 if (TSiteInfo.priceTablesGenerated) { TSiteInfo.clearPriceTables(); } } /** * 更新人群相关UI */ TSiteInfo.updateAudienceUI = function() { var bookingChecked = $("#audience_booking").is(':checked'); var walkinChecked = $("#audience_walkin").is(':checked'); // 显示/隐藏订场表格 if (bookingChecked) { $("#booking_section").show(); } else { $("#booking_section").hide(); } // 显示/隐藏散客表格和容纳散客数 // 只控制容纳散客数字段的显示/隐藏 // 价格表的显示由生成按钮控制 if (walkinChecked) { $("#walkin_section").show(); $("#walkin_capacity_group").show(); } else { $("#walkin_section").hide(); $("#walkin_capacity_group").hide(); } } @@ -969,6 +1035,12 @@ * 保存价格配置 */ TSiteInfo.savePriceConfig = function() { // 验证价格表是否已生成 if (!TSiteInfo.priceTablesGenerated) { Feng.error("请先点击【生成价格表】按钮生成价格配置表!"); return; } // 验证人群选择 var bookingChecked = $("#audience_booking").is(':checked'); var walkinChecked = $("#audience_walkin").is(':checked'); @@ -1001,10 +1073,7 @@ } var siteId = $("#siteId").val(); if (!siteId) { Feng.error("场地ID不存在,请先保存场地基本信息!"); return; } var isAddMode = !siteId; // 判断是新增模式还是编辑模式 // 收集场地配置 var nextNames = []; @@ -1031,7 +1100,6 @@ if (walkinChecked) targetAudience.push('2'); var data = { siteId: parseInt(siteId), targetAudience: targetAudience.join(','), walkinCapacity: walkinChecked ? parseInt($("#walkin_capacity").val()) : 0, nextName: nextNames.join(','), @@ -1040,6 +1108,16 @@ priceDetails: priceDetails }; if (!isAddMode) { data.siteId = parseInt(siteId); } else { // 新增模式:收集基本信息 data = Object.assign(data, TSiteInfo.collectBasicData()); if (!data.name) { // 如果基本信息收集失败 return; } } // 确认提交 layer.confirm('确定要保存价格配置吗?', { btn: ['确定', '取消'] @@ -1047,13 +1125,16 @@ layer.close(index); // 提交到后端 var url = isAddMode ? "/tSite/addSite" : "/tSite/savePriceConfig"; var successMsg = isAddMode ? "场地添加成功!" : "价格配置保存成功!"; $.ajax({ url: Feng.ctxPath + "/tSite/savePriceConfig", url: Feng.ctxPath + url, type: "POST", data: JSON.stringify(data), contentType: "application/json", success: function(response) { Feng.success("价格配置保存成功!"); Feng.success(successMsg); // 刷新列表 if (window.parent.TSite && window.parent.TSite.table) { window.parent.TSite.table.refresh(); @@ -1075,6 +1156,141 @@ } /** * 收集基本信息数据(用于新增场地) */ TSiteInfo.collectBasicData = function() { var data = { province:"", city:"", cityManagerId:"", storeId:"", siteTypeId:null, appointmentStartTime:"", appointmentEndTime:"", cashPrice:null, playPaiCoin:null, insuranceEndTime:"", name:"", insuranceImg:"", managementPlan:"", operatorId:"", typeName:"", nextName:"", ishalf:"", cashPriceOne:"", playPaiCoinOne:"", halfName:"", introduce:"", imgs:"", reservation:"", isCanBeBooked:"", type:"", }; data.province = $("#pCode").val() data.city = $("#cCode").val() data.cityManagerId = $("#account").val() data.storeId = $("#store").val() data.siteTypeId = $("#siteTypeId").val() data.appointmentStartTime= $("#start-time").val() data.appointmentEndTime = $("#end-time").val() data.cashPrice = $("#cashPrice").val() data.playPaiCoin = $("#playPaiCoin").val() data.insuranceEndTime = $("#insuranceEndTime").val() data.name = $("#name").val() data.insuranceImg = $("#img").val() data.managementPlan = $('#courseVideo').val() data.typeName = $('#siteTypeOne').val() var reservation= $("input[name='reservation']:checked").val(); data.reservation= reservation; data.isCanBeBooked= reservation; var checkbox = document.querySelector('input[name="pt"]'); if (checkbox!=null){ if (checkbox.checked) { data.type = 1 data.operatorId = 0; } else { data.type = 2; } } var SelectValue=""; var getSelectValueMenbers = $("input[name='pt']:checked").each(function(j) { if (j >= 0) { SelectValue += $(this).val() } }); if(SelectValue==''){ let yys = $("#yys").val() if(yys==""){ Feng.info("请选择运营商") return null; } SelectValue= yys } data.operatorId= SelectValue; let introduce = ""; var objectType = $("#objectType").val(); if (objectType==1){ introduce = TSiteInfo.editor.getContent(); if(introduce==""){ Feng.info("请输入公告内容") return null; } } data.introduce= introduce; var goodImgs = TSiteInfo.goodsPicArray; if(objectType==1){ if(goodImgs.length==0){ Feng.info("请上传实景图") return null; } } var imgOne =""; for (let i = 0; i <goodImgs.length; i++) { if(i==goodImgs.length-1){ imgOne += (goodImgs[i].response) }else { imgOne+=(goodImgs[i].response+",") } } data.imgs = imgOne // 基本验证 if($("#store").val()=='' ){ Feng.info("请选择门店") return null; } if($("#siteTypeId").val()=='' ){ Feng.info("请选择场地分类") return null; } if($("#name").val()==''){ Feng.info("请输入场地名称") return null; } if($("#insuranceEndTime").val()==''){ Feng.info("请输入场地责任险有效期") return null; } if($("#img").val()==''){ Feng.info("请上传场地责任有效期图片") return null; } if($('#courseVideo').val()==''){ Feng.info("请上传消防及应急管理方案") return null; } return data; } /** * 收集价格数据 */ TSiteInfo.collectPriceData = function() {