wzy
2021-12-15 9cb9637f10c527da0a60f778323b5dd14314bcef
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) {
                    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>