From 9cb9637f10c527da0a60f778323b5dd14314bcef Mon Sep 17 00:00:00 2001 From: wzy <wzy19931122ai@163.com> Date: Wed, 15 Dec 2021 23:17:07 +0800 Subject: [PATCH] fix video add no complete --- src/main/resources/templates/febs/views/video/video/video-add.html | 192 +++++++++++++++++++++++++++++++++--------------- 1 files changed, 132 insertions(+), 60 deletions(-) diff --git a/src/main/resources/templates/febs/views/video/video/video-add.html b/src/main/resources/templates/febs/views/video/video/video-add.html index 573dae2..fd8ad51 100644 --- a/src/main/resources/templates/febs/views/video/video/video-add.html +++ b/src/main/resources/templates/febs/views/video/video/video-add.html @@ -24,7 +24,7 @@ <div class="layui-col-md6"> <label class="layui-form-label febs-form-item-require">视频标题:</label> <div class="layui-input-block"> - <input type="text" name="username" minlength="2" maxlength="10" lay-verify="range|username" + <input type="text" name="title" minlength="2" maxlength="10" lay-verify="range" autocomplete="off" class="layui-input"> </div> </div> @@ -72,44 +72,44 @@ </tr> </thead> <tbody id="itemList"> - <tr> - <th> - 1 - </th> - <th> - <input type="text" class="layui-input" placeholder="" /> - </th> - <th> - <div class="upload"> - <img class="layui-upload-img item-img febs-hide" style="width: 150px;"/> - <button class="layui-btn layui-btn-xs" type="button">点击上传</button> - <input type="text" class="febs-hide" name="itemThumb" /> - </div> - </th> - <th>123</th> - <th> - <button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button> - </th> - </tr> - <tr> - <th> - 2 - </th> - <th> - <input type="text" class="layui-input" placeholder="" /> - </th> - <th> - <div class="upload"> - <img class="layui-upload-img item-img" src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.jj20.com%2Fup%2Fallimg%2Ftp05%2F19100120461512E-0-lp.jpg&refer=http%3A%2F%2Fimg.jj20.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg" style="width: 150px;"/> - <button class="layui-btn layui-btn-xs febs-hide" type="button">点击上传</button> - <input type="text" class="febs-hide" name="itemThumb" /> - </div> - </th> - <th>123</th> - <th> - <button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button> - </th> - </tr> +<!-- <tr>--> +<!-- <th>--> +<!-- 1--> +<!-- </th>--> +<!-- <th>--> +<!-- <input type="text" class="layui-input" placeholder="" />--> +<!-- </th>--> +<!-- <th>--> +<!-- <div class="upload">--> +<!-- <img class="layui-upload-img item-img febs-hide" style="width: 150px;"/>--> +<!-- <button class="layui-btn layui-btn-xs" type="button">点击上传</button>--> +<!-- <input type="text" class="febs-hide" name="itemThumb" />--> +<!-- </div>--> +<!-- </th>--> +<!-- <th>123</th>--> +<!-- <th>--> +<!-- <button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button>--> +<!-- </th>--> +<!-- </tr>--> +<!-- <tr>--> +<!-- <th>--> +<!-- 2--> +<!-- </th>--> +<!-- <th>--> +<!-- <input type="text" class="layui-input" placeholder="" />--> +<!-- </th>--> +<!-- <th>--> +<!-- <div class="upload">--> +<!-- <img class="layui-upload-img item-img" src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.jj20.com%2Fup%2Fallimg%2Ftp05%2F19100120461512E-0-lp.jpg&refer=http%3A%2F%2Fimg.jj20.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg" style="width: 150px;"/>--> +<!-- <button class="layui-btn layui-btn-xs febs-hide" type="button">点击上传</button>--> +<!-- <input type="text" class="febs-hide" name="itemThumb" />--> +<!-- </div>--> +<!-- </th>--> +<!-- <th>123</th>--> +<!-- <th>--> +<!-- <button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button>--> +<!-- </th>--> +<!-- </tr>--> </tbody> </table> </div> @@ -144,10 +144,10 @@ <input type="text" class="febs-hide" name="sourceId" value="{{item.id}}"/> </th> <th> - <input type="text" class="layui-input" placeholder="" value=""/> + <input type="text" class="layui-input" name="name" placeholder="" value=""/> </th> <th> - <div class="upload"> + <div class="upload{{item.id}}"> {{# if(!item.thumb || item.thumb == ''){ }} <img class="layui-upload-img item-img febs-hide" src="" style="width: 150px;"/> <button class="layui-btn layui-btn-xs" type="button">点击上传</button> @@ -161,7 +161,7 @@ </th> <th>{{item.name}}</th> <th> - <button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button> + <button class="layui-btn layui-btn-xs layui-btn-danger item-delete" type="button">删除</button> </th> </tr> {{# }); }} @@ -185,6 +185,7 @@ form.verify(validate); form.render(); + // 已添加的item数据 var itemData = []; var videoCate = xmSelect.render({ el: '#video-cate', @@ -203,8 +204,6 @@ }) $("#addItem").on('click', function() { - - febs.modal.open('选择视频资源', 'video/source/select/list', { area: $(window).width() <= 750 ? '90%' : '50%', offset: '30px', @@ -212,8 +211,8 @@ yes: function (index, layero) { var selectData = table.checkStatus('videoSourceSelectTable').data; + // 去重 var noRepeatData = []; - // 需要去重 if (itemData.length != 0) { for (var i = 0; i < selectData.length; i++) { var flag = true; @@ -230,16 +229,22 @@ } } else { - itemData = selectData; + noRepeatData = selectData; } - var data = itemData.concat(noRepeatData); - $itemList.empty(); - laytpl(templateHtml).render(data, function(html) { - $itemList.append(html); - }) + if (noRepeatData.length > 0) { + itemData = itemData.concat(noRepeatData); + laytpl(templateHtml).render(noRepeatData, function(html) { + $itemList.append(html); + }) - bindUpload(); + for (var i = 0; i < noRepeatData.length; i++) { + bindUpload(noRepeatData[i].id); + } + } +`` + deleteUnBind(); + deleteBind(); layer.close(layer.index); }, btn2: function () { @@ -248,7 +253,7 @@ }); }); - var uploadInst = upload.render({ + upload.render({ elem: '#thumbUpload' ,url: 'common/upload' ,before: function(obj){ @@ -272,9 +277,9 @@ }); // 表格中的图片上传 - function bindUpload() { + function bindUpload(id) { upload.render({ - elem: '.upload' + elem: '.upload' + id ,url: ctx + 'common/upload' //改成您自己的上传接口 // ,accept: 'file' ,before: function(obj){ @@ -318,15 +323,82 @@ }); } - bindUpload(); - form.on('submit(video-add-form-submit)', function (data) { - // febs.post(ctx + 'user', data.field, function () { + var $tr = $("#itemList").find("tr"); + var itemLength = $tr.length; + if (itemLength == 0) { + layer.msg('请添加章节!'); + return; + } + + var cateIds = videoCate.getValue('value'); + if (cateIds.length <= 0) { + febs.alert.warn('至少选择一个目录'); + return false; + } + + var itemData = []; + $tr.each(function() { + var data = {}; + var sourceId = $(this).find("input[name = 'sourceId']").val(); + var videoItemName = $(this).find("input[name = 'name']").val(); + var itemThumb = $(this).find("input[name = 'itemThumb']").val(); + + data.sourceId = sourceId; + data.name = videoItemName; + data.thumb = itemThumb; + itemData.push(data); + }); + + + var field = {}; + field.items = itemData; + field.title = data.field.title; + field.cateIds = cateIds.join(","); + field.thumb = data.field.thumb; + console.log(field); + + // febs.post(ctx + 'video/video/add', data.field, function () { // layer.closeAll(); - // febs.alert.success('新增用户成功,初始密码为 1234qwer'); - // $('#febs-user').find('#query').click(); // }); + + $.ajax({ + url : ctx + 'video/video/add', + type : "post", + dataType : "json", + contentType : "application/json", + data : JSON.stringify(field), + success : function(res) { + console.log(res) + }, + error : function(err) { + + } + }) return false; }); + + function deleteBind() { + $(".item-delete").each(function(index, element) { + $(this).on("click", function() { + var $tr = $(this).parents("tr"); + var id = $tr.find("input[name='sourceId']").val(); + for (var i = 0; i < itemData.length; i++) { + if (itemData[i].id == id) { + itemData.splice(i, 1); + break; + } + } + + $tr.remove(); + }); + }) + } + + function deleteUnBind() { + $(".item-delete").each(function(index, element) { + $(this).unbind('click'); + }) + } }); </script> \ No newline at end of file -- Gitblit v1.9.1