wanghaobo
/
zhiyun
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

添加目录的完成

Browse Source
main
whb 2 years ago
parent a4e58d6747
commit 578aef8fb0
8 changed files with 515 additions and 101 deletions
Show Stats Download Patch File Download Diff File

111
src/main/resources/templates/layui-v2.6.8/academicList.html
Unescape Escape View File

@ -8,6 +8,43 @@
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="layui/css/layui.css" tppabs="//res.ilayuis.com/layui/dist/css/layui.css" media="all"> <link rel="stylesheet" href="layui/css/layui.css" tppabs="//res.ilayuis.com/layui/dist/css/layui.css" media="all">
<!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 --> <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
<style>
.select-img-wrap {
width: calc(100% - 40px);
margin: 0 20px;
}
.select-img-wrap .dir-img-icon {
position: relative;
}
.select-img-wrap .dir-img-icon .icon {
width: 70px;
height: 70px;
cursor: pointer;
vertical-align: bottom;
background: #e7e7e7;
}
.select-img-wrap .dir-img-icon.active::before {
content: "";
position: absolute;
right: 10px;
bottom: 10px;
}
.select-img-wrap .dir-img-icon.active::after {
content: "";
width: 16px;
height: 8px;
border: 3px solid #FF5722;
border-bottom: 0;
border-left: 0;
position: absolute;
right: 10px;
bottom: 10px;
transform: rotate(135deg);
}
</style>
</head> </head>
<body> <body>
@ -255,6 +292,8 @@
<script> <script>
function addDir(data) { function addDir(data) {
var $ = layui.jquery
var dirImg = ''
//弹框 //弹框
layer.open({ layer.open({
type: 1, type: 1,
@ -262,9 +301,16 @@
title: ['添加页面', 'font-size:18px;'], title: ['添加页面', 'font-size:18px;'],
area: ['600px', '600px'], area: ['600px', '600px'],
btn: ['提交', '取消'] btn: ['提交', '取消']
, yes: function (index, layero) { , yes: function (index, layero) {
// 获取所有图标元素
var dirName = $('#dirName').val()
var params = {
dirName: dirName,
dirImg: dirImg,
}
//修改操作 //修改操作
$.get("http://localhost:8080/application/addDirectory", $("#addDirectory").serialize(), $.get("http://localhost:8080/academin/addDirectory", params,
function (data) { function (data) {
if ("success" == data.msg) { if ("success" == data.msg) {
layer.msg(data.msg); layer.msg(data.msg);
@ -279,6 +325,15 @@
// alert("取消") // alert("取消")
} }
}); });
$(".select-img-wrap").on('click', '.dir-img-icon>img', function (event){
const parentEl = $(this).parent('.dir-img-icon')
const siblingsEl = $(parentEl).siblings('.dir-img-icon')
parentEl.addClass('active')
Array.from(siblingsEl).forEach(item=>{
$(item).removeClass('active')
})
dirImg = $(this).attr('src')
})
} }
</script> </script>
@ -296,22 +351,48 @@
class="layui-input"> class="layui-input">
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item" style="display: flex;flex-direction: column">
<label class="layui-form-label">目录名称</label> <label class="layui-form-label">选择icon</label>
<div class="layui-input-block"> <!-- <input type="hidden" name="dirImg" id="dirImg" class="layui-form-label">选择icon</input>-->
<input type="text" name="dirName" id="dirName" required lay-verify="required" autocomplete="off" <div class="layui-row layui-col-space20 select-img-wrap">
class="layui-input"> <div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon1" class="icon" src="https://picsum.photos/id/237/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon2" class="icon" src="https://picsum.photos/id/238/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon3" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
</div> </div>
</div> </div>
<!-- <div class="layui-form-item">-->
<!-- <label class="layui-form-label">选择icon</label>-->
<!-- <div name="dirImg" class="layui-container" id="test10">-->
<!-- <div><img src="./images/01.png"></div>-->
<!-- <div><img src="./images/01.png"></div>-->
<!-- <div><img src="./images/01.png"></div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
</form> </form>
</script> </script>
<script> <script>

110
src/main/resources/templates/layui-v2.6.8/applicationList.html
Unescape Escape View File

@ -8,6 +8,43 @@
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="layui/css/layui.css" tppabs="//res.ilayuis.com/layui/dist/css/layui.css" media="all"> <link rel="stylesheet" href="layui/css/layui.css" tppabs="//res.ilayuis.com/layui/dist/css/layui.css" media="all">
<!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 --> <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
<style>
.select-img-wrap {
width: calc(100% - 40px);
margin: 0 20px;
}
.select-img-wrap .dir-img-icon {
position: relative;
}
.select-img-wrap .dir-img-icon .icon {
width: 70px;
height: 70px;
cursor: pointer;
vertical-align: bottom;
background: #e7e7e7;
}
.select-img-wrap .dir-img-icon.active::before {
content: "";
position: absolute;
right: 10px;
bottom: 10px;
}
.select-img-wrap .dir-img-icon.active::after {
content: "";
width: 16px;
height: 8px;
border: 3px solid #FF5722;
border-bottom: 0;
border-left: 0;
position: absolute;
right: 10px;
bottom: 10px;
transform: rotate(135deg);
}
</style>
</head> </head>
<body> <body>
@ -228,6 +265,8 @@
<script> <script>
function addDir(data) { function addDir(data) {
var $ = layui.jquery
var dirImg = ''
//弹框 //弹框
layer.open({ layer.open({
type: 1, type: 1,
@ -235,9 +274,16 @@
title: ['添加页面', 'font-size:18px;'], title: ['添加页面', 'font-size:18px;'],
area: ['600px', '600px'], area: ['600px', '600px'],
btn: ['提交', '取消'] btn: ['提交', '取消']
, yes: function (index, layero) { , yes: function (index, layero) {
// 获取所有图标元素
var dirName = $('#dirName').val()
var params = {
dirName: dirName,
dirImg: dirImg,
}
//修改操作 //修改操作
$.get("http://localhost:8080/application/addDirectory", $("#addDirectory").serialize(), $.get("http://localhost:8080/application/addDirectory", params,
function (data) { function (data) {
if ("success" == data.msg) { if ("success" == data.msg) {
layer.msg(data.msg); layer.msg(data.msg);
@ -252,7 +298,17 @@
// alert("取消") // alert("取消")
} }
}); });
$(".select-img-wrap").on('click', '.dir-img-icon>img', function (event){
const parentEl = $(this).parent('.dir-img-icon')
const siblingsEl = $(parentEl).siblings('.dir-img-icon')
parentEl.addClass('active')
Array.from(siblingsEl).forEach(item=>{
$(item).removeClass('active')
})
dirImg = $(this).attr('src')
})
} }
</script> </script>
<script type="text/html" id="addForm"> <script type="text/html" id="addForm">
@ -268,22 +324,48 @@
class="layui-input"> class="layui-input">
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item" style="display: flex;flex-direction: column">
<label class="layui-form-label">选择icon</label> <label class="layui-form-label">选择icon</label>
<div class="layui-input-block"> <!-- <input type="hidden" name="dirImg" id="dirImg" class="layui-form-label">选择icon</input>-->
<input type="text" name="dirImg" id="dirImg" required lay-verify="required" autocomplete="off" <div class="layui-row layui-col-space20 select-img-wrap">
class="layui-input"> <div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon1" class="icon" src="https://picsum.photos/id/237/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon2" class="icon" src="https://picsum.photos/id/238/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon3" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
</div> </div>
</div> </div>
<!-- <div class="layui-form-item">-->
<!-- <label class="layui-form-label">选择icon</label>-->
<!-- <div name="dirImg" class="layui-container" id="test10">-->
<!-- <div><img src="./images/01.png"></div>-->
<!-- <div><img src="./images/01.png"></div>-->
<!-- <div><img src="./images/01.png"></div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
</form> </form>
</script> </script>
<script> <script>

37
src/main/resources/templates/layui-v2.6.8/downloadList.html
Unescape Escape View File

@ -8,6 +8,43 @@
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="layui/css/layui.css" tppabs="//res.ilayuis.com/layui/dist/css/layui.css" media="all"> <link rel="stylesheet" href="layui/css/layui.css" tppabs="//res.ilayuis.com/layui/dist/css/layui.css" media="all">
<!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 --> <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
<style>
.select-img-wrap {
width: calc(100% - 40px);
margin: 0 20px;
}
.select-img-wrap .dir-img-icon {
position: relative;
}
.select-img-wrap .dir-img-icon .icon {
width: 70px;
height: 70px;
cursor: pointer;
vertical-align: bottom;
background: #e7e7e7;
}
.select-img-wrap .dir-img-icon.active::before {
content: "";
position: absolute;
right: 10px;
bottom: 10px;
}
.select-img-wrap .dir-img-icon.active::after {
content: "";
width: 16px;
height: 8px;
border: 3px solid #FF5722;
border-bottom: 0;
border-left: 0;
position: absolute;
right: 10px;
bottom: 10px;
transform: rotate(135deg);
}
</style>
</head> </head>
<style> <style>

102
src/main/resources/templates/layui-v2.6.8/gameList.html
Unescape Escape View File

@ -8,6 +8,43 @@
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="layui/css/layui.css" tppabs="//res.ilayuis.com/layui/dist/css/layui.css" media="all"> <link rel="stylesheet" href="layui/css/layui.css" tppabs="//res.ilayuis.com/layui/dist/css/layui.css" media="all">
<!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 --> <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
<style>
.select-img-wrap {
width: calc(100% - 40px);
margin: 0 20px;
}
.select-img-wrap .dir-img-icon {
position: relative;
}
.select-img-wrap .dir-img-icon .icon {
width: 70px;
height: 70px;
cursor: pointer;
vertical-align: bottom;
background: #e7e7e7;
}
.select-img-wrap .dir-img-icon.active::before {
content: "";
position: absolute;
right: 10px;
bottom: 10px;
}
.select-img-wrap .dir-img-icon.active::after {
content: "";
width: 16px;
height: 8px;
border: 3px solid #FF5722;
border-bottom: 0;
border-left: 0;
position: absolute;
right: 10px;
bottom: 10px;
transform: rotate(135deg);
}
</style>
</head> </head>
<body> <body>
@ -248,16 +285,25 @@
<script> <script>
function addDir(data) { function addDir(data) {
var $ = layui.jquery
var dirImg = ''
//弹框 //弹框
layer.open({ layer.open({
type: 1, type: 1,
content: $("#addForm").html(), content: $("#addForm").html(),
title: ['添加目录', 'font-size:18px;'], title: ['添加页面', 'font-size:18px;'],
area: ['600px', '600px'], area: ['600px', '600px'],
btn: ['提交', '取消'] btn: ['提交', '取消']
, yes: function (index, layero) { , yes: function (index, layero) {
// 获取所有图标元素
var dirName = $('#dirName').val()
var params = {
dirName: dirName,
dirImg: dirImg,
}
//修改操作 //修改操作
$.get("http://localhost:8080/application/addDirectory", $("#addDirectory").serialize(), $.get("http://localhost:8080/game/addDirectory", params,
function (data) { function (data) {
if ("success" == data.msg) { if ("success" == data.msg) {
layer.msg(data.msg); layer.msg(data.msg);
@ -272,6 +318,15 @@
// alert("取消") // alert("取消")
} }
}); });
$(".select-img-wrap").on('click', '.dir-img-icon>img', function (event){
const parentEl = $(this).parent('.dir-img-icon')
const siblingsEl = $(parentEl).siblings('.dir-img-icon')
parentEl.addClass('active')
Array.from(siblingsEl).forEach(item=>{
$(item).removeClass('active')
})
dirImg = $(this).attr('src')
})
} }
</script> </script>
@ -289,11 +344,46 @@
class="layui-input"> class="layui-input">
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item" style="display: flex;flex-direction: column">
<label class="layui-form-label">选择icon</label> <label class="layui-form-label">选择icon</label>
<div class="layui-input-block"> <!-- <input type="hidden" name="dirImg" id="dirImg" class="layui-form-label">选择icon</input>-->
<input type="text" name="dirImg" id="dirImg" required lay-verify="required" autocomplete="off" <div class="layui-row layui-col-space20 select-img-wrap">
class="layui-input"> <div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon1" class="icon" src="https://picsum.photos/id/237/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon2" class="icon" src="https://picsum.photos/id/238/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon3" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
</div> </div>
</div> </div>
</form> </form>

1
src/main/resources/templates/layui-v2.6.8/inviteList.html
Unescape Escape View File

@ -37,7 +37,6 @@
content: ""; content: "";
width: 16px; width: 16px;
height: 8px; height: 8px;
/*border: 3px solid #00FFFF;*/
border: 3px solid #FF5722; border: 3px solid #FF5722;
border-bottom: 0; border-bottom: 0;
border-left: 0; border-left: 0;

109
src/main/resources/templates/layui-v2.6.8/knowledgeList.html
Unescape Escape View File

@ -8,6 +8,43 @@
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="layui/css/layui.css" tppabs="//res.ilayuis.com/layui/dist/css/layui.css" media="all"> <link rel="stylesheet" href="layui/css/layui.css" tppabs="//res.ilayuis.com/layui/dist/css/layui.css" media="all">
<!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 --> <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
<style>
.select-img-wrap {
width: calc(100% - 40px);
margin: 0 20px;
}
.select-img-wrap .dir-img-icon {
position: relative;
}
.select-img-wrap .dir-img-icon .icon {
width: 70px;
height: 70px;
cursor: pointer;
vertical-align: bottom;
background: #e7e7e7;
}
.select-img-wrap .dir-img-icon.active::before {
content: "";
position: absolute;
right: 10px;
bottom: 10px;
}
.select-img-wrap .dir-img-icon.active::after {
content: "";
width: 16px;
height: 8px;
border: 3px solid #FF5722;
border-bottom: 0;
border-left: 0;
position: absolute;
right: 10px;
bottom: 10px;
transform: rotate(135deg);
}
</style>
</head> </head>
<body> <body>
@ -245,6 +282,8 @@
<script> <script>
function addDir(data) { function addDir(data) {
var $ = layui.jquery
var dirImg = ''
//弹框 //弹框
layer.open({ layer.open({
type: 1, type: 1,
@ -252,9 +291,16 @@
title: ['添加页面', 'font-size:18px;'], title: ['添加页面', 'font-size:18px;'],
area: ['600px', '600px'], area: ['600px', '600px'],
btn: ['提交', '取消'] btn: ['提交', '取消']
, yes: function (index, layero) { , yes: function (index, layero) {
// 获取所有图标元素
var dirName = $('#dirName').val()
var params = {
dirName: dirName,
dirImg: dirImg,
}
//修改操作 //修改操作
$.get("http://localhost:8080/application/addDirectory", $("#addDirectory").serialize(), $.get("http://localhost:8080/knowledge/addDirectory", params,
function (data) { function (data) {
if ("success" == data.msg) { if ("success" == data.msg) {
layer.msg(data.msg); layer.msg(data.msg);
@ -269,6 +315,15 @@
// alert("取消") // alert("取消")
} }
}); });
$(".select-img-wrap").on('click', '.dir-img-icon>img', function (event){
const parentEl = $(this).parent('.dir-img-icon')
const siblingsEl = $(parentEl).siblings('.dir-img-icon')
parentEl.addClass('active')
Array.from(siblingsEl).forEach(item=>{
$(item).removeClass('active')
})
dirImg = $(this).attr('src')
})
} }
</script> </script>
@ -286,22 +341,48 @@
class="layui-input"> class="layui-input">
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item" style="display: flex;flex-direction: column">
<label class="layui-form-label">选择icon</label> <label class="layui-form-label">选择icon</label>
<div class="layui-input-block"> <!-- <input type="hidden" name="dirImg" id="dirImg" class="layui-form-label">选择icon</input>-->
<input type="text" name="dirImg" id="dirImg" required lay-verify="required" autocomplete="off" <div class="layui-row layui-col-space20 select-img-wrap">
class="layui-input"> <div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon1" class="icon" src="https://picsum.photos/id/237/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon2" class="icon" src="https://picsum.photos/id/238/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon3" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
</div> </div>
</div> </div>
<!-- <div class="layui-form-item">-->
<!-- <label class="layui-form-label">选择icon</label>-->
<!-- <div name="dirImg" class="layui-container" id="test10">-->
<!-- <div><img src="./images/01.png"></div>-->
<!-- <div><img src="./images/01.png"></div>-->
<!-- <div><img src="./images/01.png"></div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
</form> </form>
</script> </script>
<script> <script>

40
src/main/resources/templates/layui-v2.6.8/serveList.html
Unescape Escape View File

@ -36,7 +36,6 @@
content: ""; content: "";
width: 16px; width: 16px;
height: 8px; height: 8px;
/*border: 3px solid #00FFFF;*/
border: 3px solid #FF5722; border: 3px solid #FF5722;
border-bottom: 0; border-bottom: 0;
border-left: 0; border-left: 0;
@ -45,44 +44,7 @@
bottom: 10px; bottom: 10px;
transform: rotate(135deg); transform: rotate(135deg);
} }
</style> <style> </style>
.select-img-wrap {
width: calc(100% - 40px);
margin: 0 20px;
}
.select-img-wrap .dir-img-icon {
position: relative;
}
.select-img-wrap .dir-img-icon .icon {
width: 70px;
height: 70px;
cursor: pointer;
vertical-align: bottom;
background: #e7e7e7;
}
.select-img-wrap .dir-img-icon.active::before {
content: "";
position: absolute;
right: 10px;
bottom: 10px;
}
.select-img-wrap .dir-img-icon.active::after {
content: "";
width: 16px;
height: 8px;
/*border: 3px solid #00FFFF;*/
border: 3px solid #FF5722;
border-bottom: 0;
border-left: 0;
position: absolute;
right: 10px;
bottom: 10px;
transform: rotate(135deg);
}
</style>
</head> </head>
<body> <body>

106
src/main/resources/templates/layui-v2.6.8/textualList.html
Unescape Escape View File

@ -8,6 +8,43 @@
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="layui/css/layui.css" tppabs="//res.ilayuis.com/layui/dist/css/layui.css" media="all"> <link rel="stylesheet" href="layui/css/layui.css" tppabs="//res.ilayuis.com/layui/dist/css/layui.css" media="all">
<!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 --> <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
<style>
.select-img-wrap {
width: calc(100% - 40px);
margin: 0 20px;
}
.select-img-wrap .dir-img-icon {
position: relative;
}
.select-img-wrap .dir-img-icon .icon {
width: 70px;
height: 70px;
cursor: pointer;
vertical-align: bottom;
background: #e7e7e7;
}
.select-img-wrap .dir-img-icon.active::before {
content: "";
position: absolute;
right: 10px;
bottom: 10px;
}
.select-img-wrap .dir-img-icon.active::after {
content: "";
width: 16px;
height: 8px;
border: 3px solid #FF5722;
border-bottom: 0;
border-left: 0;
position: absolute;
right: 10px;
bottom: 10px;
transform: rotate(135deg);
}
</style>
</head> </head>
<body> <body>
@ -221,6 +258,8 @@
</script> </script>
<script> <script>
function addDir(data) { function addDir(data) {
var $ = layui.jquery
var dirImg = ''
//弹框 //弹框
layer.open({ layer.open({
type: 1, type: 1,
@ -228,9 +267,16 @@
title: ['添加页面', 'font-size:18px;'], title: ['添加页面', 'font-size:18px;'],
area: ['600px', '600px'], area: ['600px', '600px'],
btn: ['提交', '取消'] btn: ['提交', '取消']
, yes: function (index, layero) { , yes: function (index, layero) {
// 获取所有图标元素
var dirName = $('#dirName').val()
var params = {
dirName: dirName,
dirImg: dirImg,
}
//修改操作 //修改操作
$.get("http://localhost:8080/application/addDirectory", $("#addDirectory").serialize(), $.get("http://localhost:8080/textual/addDirectory", params,
function (data) { function (data) {
if ("success" == data.msg) { if ("success" == data.msg) {
layer.msg(data.msg); layer.msg(data.msg);
@ -245,7 +291,15 @@
// alert("取消") // alert("取消")
} }
}); });
$(".select-img-wrap").on('click', '.dir-img-icon>img', function (event){
const parentEl = $(this).parent('.dir-img-icon')
const siblingsEl = $(parentEl).siblings('.dir-img-icon')
parentEl.addClass('active')
Array.from(siblingsEl).forEach(item=>{
$(item).removeClass('active')
})
dirImg = $(this).attr('src')
})
} }
</script> </script>
@ -263,19 +317,47 @@
class="layui-input"> class="layui-input">
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item" style="display: flex;flex-direction: column">
<label class="layui-form-label">选择icon</label> <label class="layui-form-label">选择icon</label>
<div class="layui-container" id="test10"> <!-- <input type="hidden" name="dirImg" id="dirImg" class="layui-form-label">选择icon</input>-->
<div class="layui-row"> <div class="layui-row layui-col-space20 select-img-wrap">
<div class="layui-col-md4" lay-event="addData"> <div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img src="./images/01.png" alt="图片1"> <img id="icon1" class="icon" src="https://picsum.photos/id/237/70/70" alt="图片1">
<img src="./images/01.png" alt="图片1"> </div>
<img src="./images/01.png" alt="图片1"> <div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
</div> <img id="icon2" class="icon" src="https://picsum.photos/id/238/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon3" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon4" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div>
<div name="dirImg" class="layui-col-md2 dir-img-icon" lay-event="addData">
<img id="icon5" class="icon" src="https://picsum.photos/70/70" alt="图片1">
</div> </div>
</div> </div>
</div> </div>
</form> </form>
</script> </script>

Write Preview
Loading…
Cancel
Save