|
|
|
|
@ -0,0 +1,305 @@
|
|
|
|
|
<!--# layout("/common/layout.html",{"jsBase":"/js/jlw/courseInfo/"}){ -->
|
|
|
|
|
<link rel="stylesheet" type="text/css" href="${ctxPath}/css/plugin.css?v=${jsVer}" media="all"/>
|
|
|
|
|
<style>
|
|
|
|
|
.layui-table a {
|
|
|
|
|
margin-right: 10px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.shiping {
|
|
|
|
|
color: red;
|
|
|
|
|
border: 2px solid red;
|
|
|
|
|
border-radius: 5px;
|
|
|
|
|
margin: 3px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.ppt {
|
|
|
|
|
color: #01AAED;
|
|
|
|
|
border: 2px solid #01AAED;
|
|
|
|
|
border-radius: 5px;
|
|
|
|
|
padding: 3px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.pdf {
|
|
|
|
|
color: #FFB800;
|
|
|
|
|
border: 2px solid #FFB800;
|
|
|
|
|
border-radius: 5px;
|
|
|
|
|
padding: 3px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.lianjie {
|
|
|
|
|
color: #009688;
|
|
|
|
|
border: 2px solid #009688;
|
|
|
|
|
border-radius: 5px;
|
|
|
|
|
padding: 3px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.tupian {
|
|
|
|
|
color: #2F4056;
|
|
|
|
|
border: 2px solid #2F4056;
|
|
|
|
|
border-radius: 5px;
|
|
|
|
|
padding: 3px;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
<input name="courseInfoId" type="hidden" value="${courseInfo.courseInfoId}"/>
|
|
|
|
|
<div class="layui-row" style="margin: 0 auto;">
|
|
|
|
|
<a class="layui-btn layui-btn-primary" id="addButton-cancel" style="margin-bottom: 10px;">返回</a>
|
|
|
|
|
<a class="layui-btn bg_button" id="addButton" style="margin-bottom: 10px;">新增章目录</a>
|
|
|
|
|
<a class="layui-btn" id="foldTrue" style="margin-bottom: 10px;">全部展开</a>
|
|
|
|
|
<a class="layui-btn layui-bg-gray" id="foldFalse" style="margin-bottom: 10px;">全部折叠</a>
|
|
|
|
|
</div>
|
|
|
|
|
<table id="courseInfoTable" lay-filter="courseInfoTable"></table>
|
|
|
|
|
<!--# } -->
|
|
|
|
|
<script type="text/javascript" src="${ctxPath}/plugins/xm-select.js?v=${jsVer}"></script>
|
|
|
|
|
<script>
|
|
|
|
|
layui.define(function (exports) { //提示：组件也可以依赖其它组件，如：layui.define('jquery', callback);
|
|
|
|
|
exports('treetable');
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
//调用
|
|
|
|
|
layui.config({
|
|
|
|
|
base: Common.ctxPath + '/plugins/treetable-lay/' //假设这是treetable.js所在的目录 可以把你需要扩展的js插件都放在一个文件夹内
|
|
|
|
|
}).extend({ //设定组件别名
|
|
|
|
|
treetable: 'treetable'
|
|
|
|
|
});
|
|
|
|
|
layui.define(['form', 'transfer', 'table', 'tree', "laytpl", 'element', 'upload', 'treetable'], function (exports) {
|
|
|
|
|
var form = layui.form,
|
|
|
|
|
transfer = layui.transfer,
|
|
|
|
|
upload = layui.upload,
|
|
|
|
|
laytpl = layui.laytpl,
|
|
|
|
|
table = layui.table,
|
|
|
|
|
tree = layui.tree,
|
|
|
|
|
element = layui.element,
|
|
|
|
|
treetable = layui.treetable;
|
|
|
|
|
var courseInfoParentId = $("input[name='courseInfoId']").val();
|
|
|
|
|
var courseInfoTable = function () {
|
|
|
|
|
var ret = Common.getAjax("/jlw/courseInfo/getCourseResources.json", {courseInfoId: courseInfoParentId});
|
|
|
|
|
var data = ret.data;
|
|
|
|
|
if (ret.code == 0) {
|
|
|
|
|
ret.data.forEach(item => {
|
|
|
|
|
item.resourcesInfo.forEach(function (e, i) {
|
|
|
|
|
e.courseInfoParentId = e.courseInfoId;
|
|
|
|
|
e.courseInfoId = 0;
|
|
|
|
|
e.courseInfoName = "资源名称：" + e.resourcesInfoName;
|
|
|
|
|
data.push(e);
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
treetable.render({
|
|
|
|
|
elem: '#courseInfoTable',
|
|
|
|
|
height: Lib.getTableHeight(1),
|
|
|
|
|
cellMinWidth: 100,
|
|
|
|
|
data: data,
|
|
|
|
|
treeColIndex: 0, //树形图标显示在第几列
|
|
|
|
|
treeSpid: courseInfoParentId, //最上级的父级id
|
|
|
|
|
treeIdName: 'courseInfoId', //id字段的名称
|
|
|
|
|
treePidName: 'courseInfoParentId', //父级节点字段
|
|
|
|
|
treeDefaultClose: true, //是否默认折叠
|
|
|
|
|
treeLinkage: true //父级展开时是否自动展开所有子级
|
|
|
|
|
, limit: 1000
|
|
|
|
|
, parseData: function (res) { //将原始数据解析成 table 组件所规定的数据
|
|
|
|
|
return {
|
|
|
|
|
"code": res.status, //解析接口状态
|
|
|
|
|
"msg": res.message, //解析提示文本
|
|
|
|
|
"count": res.total, //解析数据长度
|
|
|
|
|
"data": res.rows.item //解析数据列表
|
|
|
|
|
};
|
|
|
|
|
}
|
|
|
|
|
, cols: [[ // 表头
|
|
|
|
|
/* {
|
|
|
|
|
field: 'LAY_TABLE_INDEX',
|
|
|
|
|
title: '序号',
|
|
|
|
|
align: "center",
|
|
|
|
|
},*/
|
|
|
|
|
{
|
|
|
|
|
field: 'courseInfoName',
|
|
|
|
|
title: '目录名称',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'resourcesInfoType',
|
|
|
|
|
title: '资源类型',
|
|
|
|
|
align: "center",
|
|
|
|
|
templet: function (d) {
|
|
|
|
|
//资源类型(1视频 2PPT 3PDF 4链接 5图片)
|
|
|
|
|
var css = '';
|
|
|
|
|
var value = "";
|
|
|
|
|
if (d.resourcesInfoType === 1) {
|
|
|
|
|
value = "视频";
|
|
|
|
|
css = "shiping";
|
|
|
|
|
} else if (d.resourcesInfoType === 2) {
|
|
|
|
|
value = "PPT";
|
|
|
|
|
css = "ppt";
|
|
|
|
|
} else if (d.resourcesInfoType === 3) {
|
|
|
|
|
value = "PDF";
|
|
|
|
|
css = "pdf";
|
|
|
|
|
} else if (d.resourcesInfoType === 4) {
|
|
|
|
|
value = "链接";
|
|
|
|
|
css = "lianjie";
|
|
|
|
|
} else if (d.resourcesInfoType === 5) {
|
|
|
|
|
value = "图片";
|
|
|
|
|
css = "tupian";
|
|
|
|
|
}
|
|
|
|
|
return '<span class=' + css + '>' + value + '</span>';
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'courseInfoId',
|
|
|
|
|
title: '操作',
|
|
|
|
|
templet: function (d) {
|
|
|
|
|
var htm = '';
|
|
|
|
|
if (d.courseInfoType === 2) {
|
|
|
|
|
htm += '<a class="layui-table-link" lay-event="add">添加子章节</a>';
|
|
|
|
|
} else if (d.courseInfoType === 3) {
|
|
|
|
|
htm += '<a class="layui-table-link" lay-event="updateResources">上传资源</a>';
|
|
|
|
|
htm += '<a class="layui-table-link" lay-event="addLine">添加链接</a>';
|
|
|
|
|
htm += '<a class="layui-table-link" lay-event="addWP">添加图文</a>';
|
|
|
|
|
}
|
|
|
|
|
if (!$.isEmpty(d.resourcesInfoType)) {
|
|
|
|
|
htm += '<a class="layui-table-link" lay-event="look">查看</a>';
|
|
|
|
|
htm += '<a class="layui-table-link" lay-event="update">上传</a>';
|
|
|
|
|
}
|
|
|
|
|
htm += '<a class="layui-table-link" lay-event="edit">编辑</a>';
|
|
|
|
|
htm += '<a class="layui-table-link" lay-event="del">删除</a>';
|
|
|
|
|
htm += '<a class="layui-table-link" lay-event="move">拖动</a>';
|
|
|
|
|
if (!$.isEmpty(d.resourcesInfoType)) {
|
|
|
|
|
htm += '<a class="layui-table-link" lay-event="moveUp">上移</a>';
|
|
|
|
|
htm += '<a class="layui-table-link" lay-event="moveDown">下移</a>';
|
|
|
|
|
}
|
|
|
|
|
return htm;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
]]
|
|
|
|
|
});
|
|
|
|
|
};
|
|
|
|
|
courseInfoTable();
|
|
|
|
|
/*新增章目录*/
|
|
|
|
|
$("#addButton").click(function () {
|
|
|
|
|
var param = {
|
|
|
|
|
courseInfoParentId: courseInfoParentId,
|
|
|
|
|
courseInfoType: 2,
|
|
|
|
|
courseInfoStatus: 1,
|
|
|
|
|
courseInfoName: "未命名"
|
|
|
|
|
};
|
|
|
|
|
postCourseInfo("",param);
|
|
|
|
|
});
|
|
|
|
|
/*返回*/
|
|
|
|
|
$("#addButton-cancel").click(function () {
|
|
|
|
|
parent.Lib.tableRefresh();
|
|
|
|
|
Lib.closeFrame();
|
|
|
|
|
});
|
|
|
|
|
//全部展开
|
|
|
|
|
$("#foldTrue").click(function () {
|
|
|
|
|
treetable.expandAll('#courseInfoTable');
|
|
|
|
|
});
|
|
|
|
|
//全部折叠
|
|
|
|
|
$("#foldFalse").click(function () {
|
|
|
|
|
treetable.foldAll('#courseInfoTable');
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
table.on('tool(courseInfoTable)', function (obj) {
|
|
|
|
|
var data = obj.data;
|
|
|
|
|
var courseInfoId = data.courseInfoId;
|
|
|
|
|
if (obj.event === 'add') {//添加子章节
|
|
|
|
|
var param = {
|
|
|
|
|
courseInfoParentId: courseInfoId,
|
|
|
|
|
courseInfoType: 3,
|
|
|
|
|
courseInfoStatus: 1,
|
|
|
|
|
courseInfoName: "未命名"
|
|
|
|
|
};
|
|
|
|
|
postCourseInfo("",param);
|
|
|
|
|
}else if (obj.event === 'updateResources') {//上传资源
|
|
|
|
|
|
|
|
|
|
}else if (obj.event === 'addLine') {//添加链接
|
|
|
|
|
|
|
|
|
|
}else if (obj.event === 'addWP') {//添加图文
|
|
|
|
|
|
|
|
|
|
}else if (obj.event === 'look') {//查看
|
|
|
|
|
|
|
|
|
|
}else if (obj.event === 'update') {//上传
|
|
|
|
|
|
|
|
|
|
}else if(obj.event === 'edit'){
|
|
|
|
|
layer.open({
|
|
|
|
|
title: "编辑目录名称"
|
|
|
|
|
, content: '<div class="layui-inline" id="editName">\n' +
|
|
|
|
|
'<label class="layui-form-label">目录名称</label>\n' +
|
|
|
|
|
'<div class="layui-input-inline">\n' +
|
|
|
|
|
'<input type="text" id="courseInfoName" name="courseInfoName" class="layui-input" >\n' +
|
|
|
|
|
'</div>\n' +
|
|
|
|
|
'</div>'
|
|
|
|
|
, btn: ['确定', '关闭']
|
|
|
|
|
, shadeClose:true
|
|
|
|
|
, success:function () {
|
|
|
|
|
$("#editRoom input[name='courseInfoName']").val(data.courseInfoName)
|
|
|
|
|
}
|
|
|
|
|
, yes: function (index, layero) {
|
|
|
|
|
let param = {
|
|
|
|
|
"courseInfoId":courseInfoId,
|
|
|
|
|
"courseInfoName": $("#editName input[name='courseInfoName']").val(),
|
|
|
|
|
};
|
|
|
|
|
layer.close(index);
|
|
|
|
|
postCourseInfo(courseInfoId, param);
|
|
|
|
|
},
|
|
|
|
|
btn2: function (index, layero) {
|
|
|
|
|
layer.close(index);
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}else if (obj.event === 'del') {
|
|
|
|
|
layer.confirm('是否确定删除该信息？', function (index) {
|
|
|
|
|
layer.load();
|
|
|
|
|
var ret = Common.postAjax("/jlw/courseInfo/delete.json",{ids:courseInfoId});
|
|
|
|
|
layer.msg(ret.code == 0 ? "删除成功！" : ret.msg, {
|
|
|
|
|
offset: ['50%'],
|
|
|
|
|
icon: ret.code == 0 ? 1 : 2,
|
|
|
|
|
time: 1500 //2秒关闭（如果不配置，默认是3秒）
|
|
|
|
|
}, function () {
|
|
|
|
|
courseInfoTable();
|
|
|
|
|
if (ret.code == 0) {
|
|
|
|
|
Lib.tableRefresh();
|
|
|
|
|
layer.closeAll();
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
/*if(courseInfoParentId != data.courseInfoParentId){
|
|
|
|
|
|
|
|
|
|
}else {
|
|
|
|
|
layer.msg("删除失败！不能删除根节点！", {
|
|
|
|
|
offset: ['50%'],
|
|
|
|
|
icon: 2,
|
|
|
|
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
|
|
|
|
});
|
|
|
|
|
courseInfoTable();
|
|
|
|
|
}*/
|
|
|
|
|
}else if (obj.event === 'move') {//拖动
|
|
|
|
|
|
|
|
|
|
}else if (obj.event === 'moveUp') {//上移
|
|
|
|
|
|
|
|
|
|
}else if (obj.event === 'moveDown') {//下移
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
function postCourseInfo(id, param) {
|
|
|
|
|
layer.load();
|
|
|
|
|
setTimeout(function () {
|
|
|
|
|
var url = "/jlw/courseInfo/add.json";
|
|
|
|
|
if (!$.isEmpty(id)) {
|
|
|
|
|
url = "/jlw/courseInfo/edit.json";
|
|
|
|
|
}
|
|
|
|
|
var ret = Common.postAjax(url, param);
|
|
|
|
|
if (ret.code == 0) {
|
|
|
|
|
courseInfoTable();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
layer.msg(ret.code == 0 ? "操作成功！" : ret.msg, {
|
|
|
|
|
offset: ['50%'],
|
|
|
|
|
icon: ret.code == 0 ? 1 : 2,
|
|
|
|
|
time: 1500 //2秒关闭（如果不配置，默认是3秒）
|
|
|
|
|
}, function () {
|
|
|
|
|
layer.closeAll();
|
|
|
|
|
if (ret.code == 0) {
|
|
|
|
|
Lib.tableRefresh();
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}, 50);
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
</script>
|
Mlxa0324
2 years ago