From 9f14a435039c4159cdc015bb567adc6a3f84306f Mon Sep 17 00:00:00 2001
From: xiaoyong931011 <15274802129@163.com>
Date: Wed, 22 Dec 2021 15:35:29 +0800
Subject: [PATCH] 20211216
---
src/main/resources/templates/febs/views/video/video/video-add.html | 183 ++++++++++++++++++++++++++++-----------------
1 files changed, 112 insertions(+), 71 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..a0051eb 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>
@@ -47,6 +47,7 @@
<button type="button" class="layui-btn" id="thumbUpload">上传图片</button>
<div class="layui-upload-list">
<img class="layui-upload-img" id="thumb" style="width: 150px;"/>
+ <input class="layui-input febs-hide" name="thumb" autocomplete="off" />
</div>
</div>
</div>
@@ -64,52 +65,13 @@
<table class="layui-table">
<thead>
<tr>
- <th>排序</th>
- <th>视频标题</th>
- <th>视频缩略图</th>
+ <th>章节标题</th>
+ <th>缩略图</th>
<th>资源名称</th>
<th>操作</th>
</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>
</tbody>
</table>
</div>
@@ -140,28 +102,25 @@
{{# layui.each(d, function(index, item){ }}
<tr>
<th>
- {{item.seq}}
<input type="text" class="febs-hide" name="sourceId" value="{{item.id}}"/>
+ <input type="text" class="layui-input" name="name" placeholder="" value=""/>
</th>
<th>
- <input type="text" class="layui-input" 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>
- <input type="text" class="febs-hide" name="itemThumb" />
+ <input type="text" class="febs-hide" autocomplete="off" name="itemThumb" />
{{# } else { }}
- <img class="layui-upload-img item-img" src="" style="width: 150px;"/>
+ <img class="layui-upload-img item-img" src="{{item.thumb}}" style="width: 150px;"/>
<button class="layui-btn layui-btn-xs febs-hide" type="button">点击上传</button>
- <input type="text" class="febs-hide" name="itemThumb" />
+ <input type="text" class="febs-hide" autocomplete="off" name="itemThumb" />
{{# } }}
</div>
</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 +144,7 @@
form.verify(validate);
form.render();
+ // 已添加的item数据
var itemData = [];
var videoCate = xmSelect.render({
el: '#video-cate',
@@ -203,8 +163,6 @@
})
$("#addItem").on('click', function() {
-
-
febs.modal.open('选择视频资源', 'video/source/select/list', {
area: $(window).width() <= 750 ? '90%' : '50%',
offset: '30px',
@@ -212,8 +170,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 +188,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 +212,7 @@
});
});
- var uploadInst = upload.render({
+ upload.render({
elem: '#thumbUpload'
,url: 'common/upload'
,before: function(obj){
@@ -264,6 +228,7 @@
return layer.msg('上传失败');
}
+ $('#thumb').next().val(res.data[0])
layer.msg('上传成功', {icon: 1});
}
,error: function(){
@@ -272,9 +237,9 @@
});
// 表格中的图片上传
- function bindUpload() {
+ function bindUpload(id) {
upload.render({
- elem: '.upload'
+ elem: '.upload' + id
,url: ctx + 'common/upload' //改成您自己的上传接口
// ,accept: 'file'
,before: function(obj){
@@ -318,15 +283,91 @@
});
}
- bindUpload();
-
form.on('submit(video-add-form-submit)', function (data) {
- // febs.post(ctx + 'user', data.field, function () {
- // layer.closeAll();
- // febs.alert.success('新增用户成功，初始密码为 1234qwer');
- // $('#febs-user').find('#query').click();
- // });
+ 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);
+ });
+
+ if (!data.field.thumb) {
+ febs.alert.warn('未上传缩略图');
+ return;
+ }
+
+ var field = {};
+ field.items = itemData;
+ field.title = data.field.title;
+ field.cateIds = cateIds.join(",");
+ field.thumb = data.field.thumb;
+ field.isFree = data.field.isFree;
+ field.intro = data.field.intro;
+ console.log(field);
+
+ $.ajax({
+ url : ctx + 'video/video/add',
+ type : "post",
+ dataType : "json",
+ contentType : "application/json",
+ data : JSON.stringify(field),
+ success : function(res) {
+ console.log(res)
+ if (res.code != 200) {
+ febs.alert.warn(res.message);
+ return;
+ }
+ febs.alert.success('新增成功');
+ $('#febs-video').find('#query').click();
+ layer.closeAll();
+ },
+ error : function(err) {
+ layer.msg("请求错误");
+ }
+ })
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