jsp随笔-工作使用-直播功能

1.状态功能

 <div class="form-group">
<label for="" class="col-md-3 control-label" style="text-align: right; width: 35%; margin-left: 15px;"> 状态分类</label><div class="col-md-6"><select class="form-control" id="selectStatus" name="selectStatus" style="width: 150px;"><option value="" id="selected" selected="selected">全部</option><option value="0" <c:if test="${selectStatus eq '0'}">selected = "selected"</c:if>>预告</option><option value="1" <c:if test="${selectStatus eq '1'}">selected = "selected"</c:if>>直播中</option><option value="2" <c:if test="${selectStatus eq '2'}">selected = "selected"</c:if>>直播结束</option></select></div></div>

2.序号

<th style="width: 5%;text-align:center;"><label>序号</label>
</th><td align="center">${NO.index+1 }</td>

3.显示

<td align="center"><c:if test="${values.showStatus eq '1'}"> 显示</c:if><c:if test="${values.showStatus eq '0'}"> 隐藏</c:if></td>

4.时间显示

一.单纯的格式化显示

<td align="center"><fmt:formatDate value="${values.createTime}" pattern="yyyy-MM-dd HH:mm:ss"/></td>

 

二.时间的判断显示

<td align="center"><fmt:formatDate var="start"  value="${values.liveStartTime}" pattern="yyyy-MM-dd HH:mm:ss"/><fmt:formatDate var="end" value="${values.liveCloseTime}" pattern="yyyy-MM-dd HH:mm:ss"/><fmt:formatDate value="<%=new Date()%>" pattern="yyyy-MM-dd HH:mm:ss " var="now"/><c:if test="${now le start}">预告中</c:if><c:if test="${now ge start && now le end}">直播中</c:if><c:if test="${now ge end}">直播结束</c:if>
</td>

三.时间的输入

<tr><td align="right"><label for="" class=" control-label"><fontcolor="red">*</font>直播开始时间: </label></td><td colspan="2">
<input type="text" id="liveStartTime" name="liveStartTime" class="form-control Wdate"style="width: 200px;height: 30px;cursor: hand;" value="<fmt:formatDate value="${values.liveStartTime}" pattern="yyyy-MM-dd HH:mm:ss"/>"onClick="WdatePicker({dateFmt:'yyyy-M-d H:mm:ss'})" autocomplete="off"></td>
</tr>

 

5.返回上一级

 <input class="btn btn-primary f1 mr10" type="button" value=返回 onclick="window.history.back()">

 6.图

url路径

//操作完成后的信息提示
$(document).ready(function() {if ('${msg}' != '') {cpp_alert_pop_reload('${msg}');}//初始化图片组件initUploadOneImg("${ctx}/file/upload","${webPath}");
});

1.图的显示

<tr><th style="text-align: right;width: 150px; ">封面图：</th><td><!-- 浏览图片 -->
<input type="file" class="img-file inputxt input-txt" style="display: none"/><!-- 图片参数 -->
<input type="hidden" class="img-val" name="liveImg" id="liveImg" value="${values.liveImg}"/><!-- 图片回显 -->
<div class="img-show img-show_logo avatars" data-img="${values.liveImg}"><img class="img-show_logo" src="" style="display: none;"/>
</div>	</td>							
</tr>

2.图的上传

<tr><th style="text-align: right;width: 150px; ">封面图：</th><td><!-- 浏览图片 -->
<input type="file" class="img-file inputxt input-txt" style="display: none"/><!-- 图片参数 -->
<input type="hidden" class="img-val" name="liveImg" id="liveImg"/><!-- 图片回显 -->
<div class="img-show img-show_logo avatars"><img class="img-show_logo" src="" style="display: none;"/>
</div></td>
</tr>

7.按钮 || 链接 || 提交

// 保存function update() {var msgInfo = "请先修正以下信息后再操作：<br/>";var bo = true;var liveTitle = $("#liveTitle").val();var liveStartTime = $("#liveStartTime").val();var liveCloseTime = $("#liveCloseTime").val();var sort = $("#sort").val();//ar oldName = '<%--${categoryBrandDto.name --%>}';if(liveTitle == ""){msgInfo += "直播名称不能为空！<br/>";bo= false;}if(bo && liveStartTime == ""){msgInfo += "直播开始时间不能为空！<br/>";bo= false;}if(bo && liveCloseTime == ""){msgInfo += "直播结束不能为空！<br/>";bo= false;}if(bo && sort == ""){msgInfo += "直播排序不能为空！<br/>";bo= false;}if(bo){// 提交保存信息$("#mgFrm")[0].submit();}else{$.dialog.alert(msgInfo);}}

8.子窗口获取数据填入

父窗口-方法一

调用不起函数——使用

<script>
function selectGoods(c){var api = frameElement.api, W = api;$.dialog( {title : '选择上架商品',focus : false,content : 'url:${ctx}/specialLiveInfo/goodsList',width : '900px',height : '600px',left :'60%',top: '54%',close : function() {// 调用子窗口方法，得到选择中菜单项值,将值传给页面函数进行显示处理var sel_value = this.content.selValue();if(sel_value != null){if (c==1){fn1(sel_value);}if (c==2){fn2(sel_value);}if (c==3){fn3(sel_value);}if (c==4){fn4(sel_value);}}},parent:api});}// 根据返回的选定内容，进行页面处理（说明：参数名必须为sel_value）function fn1(sel_value){// 将选择的值赋值给父窗口（本页面）的文本框if(typeof(sel_value) != "undefined"){var sels = sel_value.split("@@");var goodsId = sels[0];var marketPrice = sels[1];var totalGoodsStock = sels[2];var goodsName = sels[3];var shopName = sels[4];if(sels[0] !=""){$("#goodsId1").val(goodsId);/*$("#goodsName1").val(goodsName);$("#totalGoodsStock1").val(totalGoodsStock);$("#marketPrice1").val(marketPrice);$("#shopName1").val(shopName);*/}}}// 根据返回的选定内容，进行页面处理（说明：参数名必须为sel_value）function fn2(sel_value){// 将选择的值赋值给父窗口（本页面）的文本框if(typeof(sel_value) != "undefined"){var sels = sel_value.split("@@");var goodsId = sels[0];var marketPrice = sels[1];var totalGoodsStock = sels[2];var goodsName = sels[3];var shopName = sels[4];if(sels[0] !=""){$("#goodsId2").val(goodsId);}}}function fn3(sel_value){// 将选择的值赋值给父窗口（本页面）的文本框if(typeof(sel_value) != "undefined"){var sels = sel_value.split("@@");var goodsId = sels[0];var marketPrice = sels[1];var totalGoodsStock = sels[2];var goodsName = sels[3];var shopName = sels[4];if(sels[0] !=""){$("#goodsId3").val(goodsId);}}}function fn4(sel_value){// 将选择的值赋值给父窗口（本页面）的文本框if(typeof(sel_value) != "undefined"){var sels = sel_value.split("@@");var goodsId = sels[0];var marketPrice = sels[1];var totalGoodsStock = sels[2];var goodsName = sels[3];var shopName = sels[4];if(sels[0] !=""){$("#goodsId4").val(goodsId);}}}
</script>

父窗口方法二

<script>
//类型function selectGoods(c){var url = "${ctx}/specialLiveInfo/goodsList";if(c==1){cpp_dialog_pop_fn("选择商品","1250px","640px",url,fn1,"50%","39%");}else{cpp_dialog_pop_fn("选择商品","1250px","640px",url,fn2,"50%","39%");}}// 根据返回的选定内容，进行页面处理（说明：参数名必须为sel_value）function fn1(sel_value){// 将选择的值赋值给父窗口（本页面）的文本框if(typeof(sel_value) != "undefined"){var sels = sel_value.split("@@");var goodsId = sels[0];var marketPrice = sels[1];var totalGoodsStock = sels[2];var goodsName = sels[3];var shopName = sels[4];if(sels[0] !=""){$("#goodsId1").val(goodsId);$("#goodsName1").val(goodsName);$("#totalGoodsStock1").val(totalGoodsStock);$("#marketPrice1").val(marketPrice);$("#shopName1").val(shopName);}}}// 根据返回的选定内容，进行页面处理（说明：参数名必须为sel_value）function fn2(sel_value){// 将选择的值赋值给父窗口（本页面）的文本框if(typeof(sel_value) != "undefined"){var sels = sel_value.split("@@");var goodsId = sels[0];var marketPrice = sels[1];var totalGoodsStock = sels[2];var goodsName = sels[3];var shopName = sels[4];if(sels[0] !=""){$("#goodsId2").val(goodsId);$("#goodsName2").val(goodsName);$("#totalGoodsStock2").val(totalGoodsStock);$("#marketPrice2").val(marketPrice);$("#shopName2").val(shopName);}}}</script>

子窗口

<script type="text/javascript">// 获取选择菜单的值，并传递给主窗口function xuanze(obj,obj1,obj2,obj3,obj4){$("#selValue").val(obj+"@@"+obj1+"@@"+obj2+"@@"+obj3+"@@"+obj4);// 关闭窗口cpp_close();}// 获取选中的海关编码(说明：获取选择的内容方法名必须为selValue()，否则报错。)function selValue(){var hs_code = $("#selValue").val();return hs_code;}
</script>

9.分页

</form>
<!-- 分页 -->
<div class="pages"><%@ include file="/common/page.jsp"%>
</div>
<!-- 分页 -->
</body>

10.推荐首页

滑动按钮显示

<script src="${ctx}/static/js/js.js"></script>
<script src="${ctx}/static/js/lc_switch.js" type="text/javascript"></script>
<link rel="stylesheet" href="${ctx}/static/style/lc_switch.css"><td align="center"><c:if test="${values.isIndexReco == '0'}">
<input id="isIndexReco${values.id}" name="isIndexReco${values.id}" type="checkbox" value="${values.id}" class="isIndexReco_check"  autocomplete="off"/></c:if><c:if test="${values.isIndexReco == '1'}">
<input id="isIndexReco${values.id}" name="isIndexReco${values.id}" type="checkbox" value="${values.id}" class="isIndexReco_check" checked="checked" autocomplete="off"/></c:if>
</td>

 js

//推荐首页$('.isIndexReco_check').lc_switch();$('body').delegate('.isIndexReco_check', 'lcs-statuschange', function () {var status = ($(this).is(':checked')) ? 'checked' : 'unchecked';console.log('field changed status: ' + status);});//推荐$('body').delegate('.isIndexReco_check', 'lcs-on', function () {var id=$(this).val();$.ajax({type:"get",url:"${ctx }/specialLiveInfo/recommended",data:{id:id,isIndexReco:"1"},async:false,success:function(data){},error:function(){cpp_alert("请求超时")}});});//取消推荐$('body').delegate('.isIndexReco_check', 'lcs-off', function () {var id=$(this).val();$.ajax({type:"get",url:"${ctx }/specialLiveInfo/recommended",data:{id:id,isIndexReco:"0"},async:false,success:function(data){},error:function(){cpp_alert("请求超时")}});});

 java

    /*** 推荐首页*/@GetMapping("/recommended")public String recommended (SpecialLiveinfoQueryDto specialLiveInfoDto){SpecialLiveinfoDto infoDto = specialLiveinfoService.findById(specialLiveInfoDto);Subject currentUser = SecurityUtils.getSubject();Object principal = currentUser.getPrincipal();AdminUserDto adminUser= (AdminUserDto) principal;infoDto.setUpdateTime(new Date());infoDto.setUpdateUser(adminUser.getUserName());infoDto.setIsIndexReco(specialLiveInfoDto.getIsIndexReco());specialLiveinfoService.update(infoDto);return Result.success().getMsg();}