Commit 70616aef authored by daniel's avatar daniel

perf(公告模块优化): 公告模块优化

parent 5622bf4a
...@@ -33,5 +33,9 @@ public class News implements Serializable { ...@@ -33,5 +33,9 @@ public class News implements Serializable {
@JsonIgnore @JsonIgnore
private Date updateDate; private Date updateDate;
private String path;
private String appId;
private String lat;
private String lng;
private int openType;
} }
\ No newline at end of file
...@@ -257,6 +257,7 @@ ...@@ -257,6 +257,7 @@
<select id="getCmptFromEnroll" resultType="com.dlbridge.jadp.plugins.cmpt.dao.model.Cmpt"> <select id="getCmptFromEnroll" resultType="com.dlbridge.jadp.plugins.cmpt.dao.model.Cmpt">
select cmptName,date_format(startTime,'%Y-%m-%d %H:%i:%s') startTime, select cmptName,date_format(startTime,'%Y-%m-%d %H:%i:%s') startTime,
date_format(ifnull(endTime,now()),'%Y-%m-%d %H:%i:%s') endTime,type as cmptType, date_format(ifnull(endTime,now()),'%Y-%m-%d %H:%i:%s') endTime,type as cmptType,
logo,
b.city as city, b.city as city,
b.province as province, b.province as province,
b.area as area, b.area as area,
......
...@@ -70,6 +70,7 @@ public class NewsController { ...@@ -70,6 +70,7 @@ public class NewsController {
@ResponseBody @ResponseBody
public Result save(News news) { public Result save(News news) {
News newDb = newsService.save(news); News newDb = newsService.save(news);
log.info("保存数据 ",newDb.toString());
return Result.success().setContent(newDb); return Result.success().setContent(newDb);
} }
......
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8" %> <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %> <%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %> <%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!doctype html> <!doctype html>
<html> <html>
<head>
<title>资讯</title> <head>
<!-- Bootstrap CSS--> <title>资讯</title>
<link rel="stylesheet" href="${ctxStatic}/newdermon/vendor/bootstrap/css/bootstrap.min.css"> <!-- Bootstrap CSS-->
<!-- Font Awesome CSS--> <link rel="stylesheet" href="${ctxStatic}/newdermon/vendor/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="${ctxStatic}/newdermon/vendor/font-awesome/css/font-awesome.min.css"> <!-- Font Awesome CSS-->
<!-- Fontastic Custom icon font--> <link rel="stylesheet" href="${ctxStatic}/newdermon/vendor/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="${ctxStatic}/newdermon/css/fontastic.css"> <!-- Fontastic Custom icon font-->
<!-- Google fonts - Poppins --> <link rel="stylesheet" href="${ctxStatic}/newdermon/css/fontastic.css">
<link rel="stylesheet" href="${ctxStatic}/newdermon/css/font-css.css"> <!-- Google fonts - Poppins -->
<!-- theme stylesheet--> <link rel="stylesheet" href="${ctxStatic}/newdermon/css/font-css.css">
<link rel="stylesheet" href="${ctxStatic}/newdermon/css/style.default.css?v=<%=System.currentTimeMillis()%>" id="theme-stylesheet"> <!-- theme stylesheet-->
<!-- Custom stylesheet - for your changes--> <link rel="stylesheet"
<link rel="stylesheet" href="${ctxStatic}/newdermon/css/custom.css?v=<%=System.currentTimeMillis()%>"> href="${ctxStatic}/newdermon/css/style.default.css?v=<%=System.currentTimeMillis()%>"
<link rel="stylesheet" href="${ctxStatic}/newdermon/css/juery-ui-1.12.css"> id="theme-stylesheet">
<!-- Favicon--> <!-- Custom stylesheet - for your changes-->
<link rel="shortcut icon" href="https://img.geexek.com/files/home/favicon.ico"> <link rel="stylesheet"
<link rel="stylesheet" href="${ctxStatic}/newdermon/css/custom.css?v=<%=System.currentTimeMillis()%>"> href="${ctxStatic}/newdermon/css/custom.css?v=<%=System.currentTimeMillis()%>">
<link rel="stylesheet" href="${ctxStatic}/newdermon/css/main.css?v=<%=System.currentTimeMillis()%>"> <link rel="stylesheet" href="${ctxStatic}/newdermon/css/juery-ui-1.12.css">
<link rel="stylesheet" href="${ctxStatic}/cmpt/setting.css?v=<%=System.currentTimeMillis()%>"> <!-- Favicon-->
<link rel="shortcut icon" href="https://img.geexek.com/files/home/favicon.ico">
<link rel="stylesheet" href="${ctxStatic}/leaflet/css/leaflet.css?v=<%=System.currentTimeMillis()%>"/> <link rel="stylesheet"
<link rel="stylesheet" href="${ctxStatic}/leaflet/css/leaflet_label.css"/> href="${ctxStatic}/newdermon/css/custom.css?v=<%=System.currentTimeMillis()%>">
<script src="${ctxStatic}/newdermon/vendor/jquery/jquery.min.js"></script> <link rel="stylesheet" href="${ctxStatic}/newdermon/css/main.css?v=<%=System.currentTimeMillis()%>">
<script type="text/javascript" src="${ctxStatic}/leaflet/leaflet.js"></script> <link rel="stylesheet" href="${ctxStatic}/cmpt/setting.css?v=<%=System.currentTimeMillis()%>">
<script type="text/javascript" src="${ctxStatic}/leaflet/label.js"></script>
<script type="text/javascript" charset="utf-8" src="${ctxStatic}/layer/layer.js"></script> <link rel="stylesheet"
<link rel="stylesheet" href="${ctxStatic}/layer/skin/layer.css"> href="${ctxStatic}/leaflet/css/leaflet.css?v=<%=System.currentTimeMillis()%>" />
<script src="https://enroll.geexek.com/js/ueditor/ueditor.config-zs.js?v=<%=System.currentTimeMillis()%>"></script> <link rel="stylesheet" href="${ctxStatic}/leaflet/css/leaflet_label.css" />
<script src="https://enroll.geexek.com/js/ueditor/ueditor.all.js?v=<%=System.currentTimeMillis()%>"></script> <script src="${ctxStatic}/newdermon/vendor/jquery/jquery.min.js"></script>
<script src="${ctxStatic}/newdermon/vendor/popper.js/umd/popper.min.js"></script> <script type="text/javascript" src="${ctxStatic}/leaflet/leaflet.js"></script>
<script src="${ctxStatic}/js/qikoo.js"></script> <script type="text/javascript" src="${ctxStatic}/leaflet/label.js"></script>
<style> <script type="text/javascript" charset="utf-8" src="${ctxStatic}/layer/layer.js"></script>
.container { <link rel="stylesheet" href="${ctxStatic}/layer/skin/layer.css">
position: relative <script
} src="https://enroll.geexek.com/js/ueditor/ueditor.config-zs.js?v=<%=System.currentTimeMillis()%>"></script>
.data-title { <script
width: 100%; src="https://enroll.geexek.com/js/ueditor/ueditor.all.js?v=<%=System.currentTimeMillis()%>"></script>
height: 60px; <script src="${ctxStatic}/newdermon/vendor/popper.js/umd/popper.min.js"></script>
line-height: 60px; <script src="${ctxStatic}/js/qikoo.js"></script>
display: flex; <style>
margin-top: 30px; .container {
} position: relative
.add { }
width: 146px;
height: 40px; .hidden {
background: #ce3939; display: none !important;
position: absolute; }
right: 16px;
text-align: center; .data-title {
line-height: 40px; width: 100%;
top: 0px; height: 60px;
cursor: pointer; line-height: 60px;
border-radius: 4px; display: flex;
} margin-top: 30px;
.data-title > span { }
display: inline-block;
color: #9A9A9A; .add {
font-size: 20px; width: 146px;
} height: 40px;
.item { background: #ce3939;
display: flex; position: absolute;
background: white; right: 16px;
align-items: center; text-align: center;
margin-bottom: 32px; line-height: 40px;
font-size: 20px; top: 0px;
color: #333; cursor: pointer;
box-shadow: 0px 0px 10px 0px rgba(238, 235, 235, 1); border-radius: 4px;
border-radius: 4px; }
}
.title { .data-title>span {
padding-left: 40px; display: inline-block;
font-size: 20px; color: #9A9A9A;
color: #333; font-size: 20px;
display: flex; }
justify-content: center;
align-items: center; .item {
text-overflow: -o-ellipsis-lastline; display: flex;
overflow: hidden; background: white;
text-overflow: ellipsis; align-items: center;
display: -webkit-box; margin-bottom: 32px;
-webkit-line-clamp: 2; font-size: 20px;
line-clamp: 2; color: #333;
-webkit-box-orient: vertical; box-shadow: 0px 0px 10px 0px rgba(238, 235, 235, 1);
} border-radius: 4px;
.type { }
line-height: 90px;
text-align: left; .title {
} padding-left: 40px;
.opt-text { font-size: 20px;
font-size: 14px; color: #333;
color: rgba(153, 153, 153, 1); display: flex;
height: 20px; justify-content: center;
} align-items: center;
.del, .edit { text-overflow: -o-ellipsis-lastline;
overflow: hidden;
display: inline-block; text-overflow: ellipsis;
background-position: center; display: -webkit-box;
background-size: 100%; -webkit-line-clamp: 2;
background-repeat: no-repeat; line-clamp: 2;
margin-right: 8px; -webkit-box-orient: vertical;
} }
.type {
line-height: 90px;
.icon-edit { text-align: left;
width: 16px; }
height: 18px;
background-image: url(/static/images/icons-edit.png); .opt-text {
transform: none; font-size: 14px;
display: inline-block; color: rgba(153, 153, 153, 1);
background-position: center; height: 20px;
background-size: 100%; }
background-repeat: no-repeat;
margin-right: 8px; .del,
} .edit {
.icon-del { display: inline-block;
width: 18px; background-position: center;
height: 18px; background-size: 100%;
background-image: url("/static/images/icon-delete.png"); background-repeat: no-repeat;
display: inline-block; margin-right: 8px;
background-position: center; }
background-size: 100%;
background-repeat: no-repeat;
margin-right: 8px;
margin-top: -3px; .icon-edit {
} width: 16px;
height: 18px;
.opt { background-image: url(/static/images/icons-edit.png);
height: 30px; transform: none;
align-items: center; display: inline-block;
cursor: pointer; background-position: center;
display: flex; background-size: 100%;
line-height: 24px; background-repeat: no-repeat;
} margin-right: 8px;
}
.edit-container {
width: 860px; .icon-del {
height: 740px; width: 18px;
background: rgba(255, 255, 255, 1); height: 18px;
box-shadow: 0px 0px 10px 0px rgba(238, 235, 235, 1); background-image: url("/static/images/icon-delete.png");
border-radius: 4px; display: inline-block;
display: flex; background-position: center;
flex-direction: column; background-size: 100%;
overflow-x: hidden; background-repeat: no-repeat;
padding: 20px 30px; margin-right: 8px;
} margin-top: -3px;
}
/*整体部分*/
::-webkit-scrollbar { .opt {
width: 10px; height: 30px;
height: 10px; align-items: center;
} cursor: pointer;
display: flex;
/*滑动轨道*/ line-height: 24px;
::-webkit-scrollbar-track { }
border-radius: 0px;
background: none; .edit-container {
} width: 860px;
height: 740px;
/*滑块*/ background: rgba(255, 255, 255, 1);
::-webkit-scrollbar-thumb { box-shadow: 0px 0px 10px 0px rgba(238, 235, 235, 1);
border-radius: 5px; border-radius: 4px;
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .2); display: flex;
background-color: rgba(255, 255, 255, .75) flex-direction: column;
} overflow-x: hidden;
padding: 20px 30px;
/*滑块效果*/ }
::-webkit-scrollbar-thumb:hover {
border-radius: 5px; /*整体部分*/
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .2); ::-webkit-scrollbar {
background-color: rgba(85, 85, 85, 0.4); width: 10px;
} height: 10px;
}
#edui1, #edui1_iframeholder {
width: 682px !important; /*滑动轨道*/
} ::-webkit-scrollbar-track {
border-radius: 0px;
.title-area { background: none;
width: 680px; }
height: 100px;
background: rgba(247, 247, 247, 1); /*滑块*/
border-radius: 4px; ::-webkit-scrollbar-thumb {
border: 1px solid rgba(238, 238, 238, 1); border-radius: 5px;
} -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .2);
.input-group{ background-color: rgba(255, 255, 255, .75)
display: block; }
}
/*滑块效果*/
.input-group > label { ::-webkit-scrollbar-thumb:hover {
color: #333; border-radius: 5px;
font-size: 20px; -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .2);
float: left; background-color: rgba(85, 85, 85, 0.4);
} }
.cover { #edui1,
width: 680px; #edui1_iframeholder {
height: 232px; width: 682px !important;
background: rgba(247, 247, 247, 1); }
border-radius: 4px;
border: 1px solid rgba(238, 238, 238, 1); .title-area {
display: flex; width: 680px;
justify-content: center; height: 100px;
align-items: center; background: rgba(247, 247, 247, 1);
cursor: pointer; border-radius: 4px;
background-repeat: no-repeat; border: 1px solid rgba(238, 238, 238, 1);
background-position: center; }
background-size: auto;
} .input-group {
display: block;
input, textarea { }
outline: none;
padding: 5px; .input-group>label {
} color: #333;
font-size: 20px;
.save { float: left;
width: 146px; }
height: 50px;
background: rgba(206, 57, 57, 1); .cover {
border-radius: 4px; width: 680px;
text-align: center; height: 232px;
line-height: 50px; background: rgba(247, 247, 247, 1);
color: white; border-radius: 4px;
margin: 50px auto; border: 1px solid rgba(238, 238, 238, 1);
cursor: pointer; display: flex;
} justify-content: center;
align-items: center;
.icon-back { cursor: pointer;
width: 15px; background-repeat: no-repeat;
height: 18px; background-position: center;
background-image: url("/static/images/icon_back.png"); background-size: auto;
background-size: 100%; }
background-repeat: no-repeat;
margin-right: 5px; input,
} textarea {
outline: none;
.icon-cover { padding: 5px;
width: 34px; }
height: 34px;
background-image: url("/static/images/icon_cover.png"); .save {
background-size: 100%; width: 146px;
background-repeat: no-repeat; height: 50px;
} background: rgba(206, 57, 57, 1);
border-radius: 4px;
.icon-add { text-align: center;
display: inline-block; line-height: 50px;
width: 16px; color: white;
height: 16px; margin: 50px auto;
background-image: url("/static/images/icon-add.png"); cursor: pointer;
background-repeat: no-repeat; }
background-size: 100%;
margin-right: 10px; .icon-back {
} width: 15px;
height: 18px;
input[type="radio"]:before { background-image: url("/static/images/icon_back.png");
content: ""; background-size: 100%;
width: 19px; background-repeat: no-repeat;
height: 19px; margin-right: 5px;
background: white; }
position: absolute;
z-index: 1; .icon-cover {
border-radius: 50%; width: 34px;
border: 1px solid #ce3939; height: 34px;
top: -2px; background-image: url("/static/images/icon_cover.png");
left: -2px; background-size: 100%;
} background-repeat: no-repeat;
}
input[type="radio"] {
position: relative; .icon-add {
cursor: pointer; display: inline-block;
top: -2px; width: 16px;
} height: 16px;
background-image: url("/static/images/icon-add.png");
input[type="radio"]:checked:after { background-repeat: no-repeat;
content: ""; background-size: 100%;
width: 13px; margin-right: 10px;
height: 13px; }
background: #ce3939;
z-index: 2; input[type="radio"]:before {
border-radius: 50%; content: "";
top: 1px; width: 19px;
left: 1px; height: 19px;
display: block; background: white;
position: absolute; position: absolute;
} z-index: 1;
border-radius: 50%;
.notice { border: 1px solid #ce3939;
margin-left: 15px; top: -2px;
height: 40px; left: -2px;
font-size: 20px; }
line-height: 40px;
} input[type="radio"] {
position: relative;
.info { cursor: pointer;
margin-left: 23px; top: -2px;
height: 40px; }
font-size: 20px;
line-height: 40px; input[type="radio"]:checked:after {
} content: "";
.edit-btn{ width: 13px;
cursor: pointer; height: 13px;
display: flex; background: #ce3939;
align-items: center; z-index: 2;
height: 30px; border-radius: 50%;
width: 80px; top: 1px;
float: left; left: 1px;
margin-top: 3px; display: block;
} position: absolute;
.news-title{ }
font-size: 24px;
color: #333; .notice {
float: left; margin-left: 15px;
margin-right: 25px; height: 40px;
} font-size: 20px;
.no-name{ line-height: 40px;
color: #ABABAB;font-size: 24px;margin-right: 25px }
}
</style> .info {
</head> margin-left: 23px;
<body style="background:rgba(246,246,246,1);"> height: 40px;
<jsp:include page="../common/header.jsp"></jsp:include> font-size: 20px;
<div class="page-content d-flex align-items-stretch main-body"> line-height: 40px;
<jsp:include page="../common/menu.jsp"></jsp:include> }
<div class="container rght">
<span class="route-title-main news-title" style="font-size: 24px;color: #333"> .edit-btn {
<c:choose> cursor: pointer;
<c:when test="${empty setting}"> display: flex;
赛事公告 align-items: center;
</c:when> height: 30px;
<c:when test="${empty setting.newsAlias}"> width: 80px;
<span class="no-name">未命名</span> float: left;
</c:when> margin-top: 3px;
<c:otherwise> }
<span>${setting.newsAlias}</span>
</c:otherwise> .news-title {
</c:choose> font-size: 24px;
</span> color: #333;
<div style="cursor: pointer" class="edit-btn"> float: left;
<span class="icon-edit" style="margin: 0px 6px;"></span> margin-right: 25px;
<span class="opt-text" style="color:#ce3939;margin: 0px">编辑</span> }
</div>
<div class="add"> .no-name {
<span class="icon-add"></span> color: #ABABAB;
<span class="add-text" style="color: white">添加公告</span> font-size: 24px;
</div> margin-right: 25px
<div class="data-title"> }
<span style="flex: 12.3;">标题</span> </style>
<span style="flex:2;text-align: left;visibility: hidden">类型</span> </head>
<span style="flex:2">操作</span>
</div> <body style="background:rgba(246,246,246,1);">
<c:forEach var="item" items="${list}"> <jsp:include page="../common/header.jsp"></jsp:include>
<div class="item" data-id="${item.id}"> <div class="page-content d-flex align-items-stretch main-body">
<span class="title" style="flex:11.6">${item.title}</span> <jsp:include page="../common/menu.jsp"></jsp:include>
<span class="type" style="flex:2;visibility: hidden">${item.type == 1 ? '通知':'赛讯' }</span> <div class="container rght">
<div style="flex:2;display: flex;flex-direction: column"> <span class="route-title-main news-title" style="font-size: 24px;color: #333">
<div class="opt edit"> <c:choose>
<span class="icon-edit"></span> <c:when test="${empty setting}">
<span class="opt-text" style="color:#ce3939;">编辑</span> 赛事公告
</c:when>
<c:when test="${empty setting.newsAlias}">
<span class="no-name">未命名</span>
</c:when>
<c:otherwise>
<span>${setting.newsAlias}</span>
</c:otherwise>
</c:choose>
</span>
<div style="cursor: pointer" class="edit-btn">
<span class="icon-edit" style="margin: 0px 6px;"></span>
<span class="opt-text" style="color:#ce3939;margin: 0px">编辑</span>
</div>
<div class="add">
<span class="icon-add"></span>
<span class="add-text" style="color: white">添加公告</span>
</div>
<div class="data-title">
<span style="flex: 12.3;">标题</span>
<span style="flex:2;text-align: left;">类型</span>
<span style="flex:2">操作</span>
</div>
<c:forEach var="item" items="${list}">
<div class="item" data-id="${item.id}">
<span class="title" style="flex:11.6">${item.title}</span>
<span class="type" style="flex:2;">${typeDesc[item.openType]}</span>
<div style="flex:2;display: flex;flex-direction: column">
<div class="opt edit">
<span class="icon-edit"></span>
<span class="opt-text" style="color:#ce3939;">编辑</span>
</div>
<div class="opt del">
<span class="icon-del"></span>
<span class="opt-text">删除</span>
</div>
</div>
</div>
</c:forEach>
</div>
<div style="margin-left: 40px;margin-top: 40px; display: none" class="edit-context">
<div style="margin-bottom: 15px;margin-right: 10px;cursor: pointer" class="back"><span
class="icon-back"></span><span style="font-size: 20px;color: #333">返回</span></div>
<div class="edit-container">
<div class="input-group" style="height: 120px;margin-bottom: 10px;">
<label for="">标题 <span style="color: #ce3939">*</span></label>
<div>
<textarea style="float: right;" class="title-area" type="text" placeholder="标题"
id="title" cols="50" rows="10"></textarea>
</div>
</div>
<div class="input-group" style="height: 80px; align-items: center;display: none">
<label for=""
style="float: left;height: 80px;align-items: center;line-height: 80px;">类型 <span
style="color:#ce3939;">*</span></label>
<div style="float: left; margin-left: 57px;margin-top: 20px;">
<input type="radio" name="type" value="1" checked><span class="notice"
style="margin-right: 180px;">通知</span>
<input type="radio" name="type" value="2"><span class="info">赛讯</span>
</div>
</div>
<div class="input-group"
style="height: 80px; align-items: center;display: flex;flex-direction: row">
<span class="title-new">跳转类型</span><span style="color:#ce3939;">*</span></label>
<div class="label-box"
style="margin-left: 40px;margin-top: 20px;margin-bottom: 20px;">
<select id="openType">
<option value="0">文本</option>
<option value="1">h5</option>
<option value="2">小程序</option>
<option value="3">短连接</option>
<option value="4">内部页面</option>
<option value="5">文档</option>
<option value="6">图片</option>
<option value="7">地图</option>
</select>
</div>
</div>
<div class="input-group hidden" id="path-input" style="height: 120px;margin-bottom: 10px;">
<label for="">路径</label>
<div>
<textarea style="float: right;" class="title-area" type="text"
placeholder="外链填写后,优先展示外链信息公众号必选绑定小程序" id="path" cols="50"
rows="10"></textarea>
</div>
</div>
<div class="input-group hidden" id="appId-input"
style="height: 120px;margin-bottom: 10px;">
<label for="">appId</label>
<div>
<textarea style="float: right;" class="title-area" type="text"
placeholder="小程序appId" id="appId" cols="50" rows="10"></textarea>
</div>
</div>
<div class="input-group hidden" id="lat-input"
style="height: 120px;margin-bottom: 10px;">
<label for="">经度</label>
<div>
<textarea style="float: right;" class="title-area" type="text" placeholder="经度"
id="lat" cols="50" rows="10"></textarea>
</div>
</div>
<div class="input-group hidden" id="lng-input"
style="height: 120px;margin-bottom: 10px;">
<label for="">纬地</label>
<div>
<textarea style="float: right;" class="title-area" type="text" placeholder="维度"
id="lng" cols="50" rows="10"></textarea>
</div>
</div>
<div class="input-group" style="margin-top: 8px;margin-bottom: 30px;height: 240px">
<label id="file-cover">封面<br><span
style="font-size: 16px;color: #ce3939;margin-top: 20px">
<span
style="font-size: 12px;display: inline-block;border-radius: 50%;height: 18px;width: 18px;background: #ce3939;color: white;text-align: center;">注</span>
<span style="display: inline">建议分辨<br>率710*242</span></span></label>
<div style="float: right;">
<div class="cover">
<span class="icon-cover"></span>
</div>
<input id="file" type="file" style="display: none" onchange="uploadFile(this)">
</div>
</div>
<div class="input-group" style="height: 120px;margin-bottom: 10px;">
<label for="">外链</label>
<div>
<textarea style="float: right;" class="title-area" type="text"
placeholder="外链填写后,优先展示外链信息公众号必选绑定小程序" id="linkUrl" cols="50"
rows="10"></textarea>
</div>
</div>
<div class="input-group">
<label for="">内容编辑 <span style="color:#ce3939">*</span></label>
<div id="container" style="float: right"></div>
</div>
<span id="save" class="save">保存</span>
</div>
</div>
<script src="${ctxStatic}/js/news.js"></script>
</div> </div>
<div class="opt del">
<span class="icon-del"></span> <div class="item copy" style="display: none">
<span class="opt-text">删除</span> <span class="title" style="flex:11.6">${item.title}</span>
<%--<span class="type" style="flex:2">${item.type == 1 ? '通知':'赛训' }</span>--%>
<div style="flex:2;display: flex;flex-direction: column">
<div class="opt edit">
<span class="icon-edit"></span>
<span class="opt-text">编辑</span>
</div>
<div class="opt del">
<span class="icon-del"></span>
<span class="opt-text">删除</span>
</div>
</div>
</div> </div>
</div>
</div> <div class="edit-dialog">
</c:forEach> <div style="height: 50px;">
</div> <span style="font-size: 22px;color: #ce3939;">编辑</span>
</div>
<div>
<div style="margin-left: 40px;margin-top: 40px; display: none" class="edit-context"> <input id="newsAlias" type="text" placeholder="请输入名称">
<div style="margin-bottom: 15px;margin-right: 10px;cursor: pointer" class="back"><span class="icon-back"></span><span </div>
style="font-size: 20px;color: #333">返回</span></div> <div style="display: flex; height: 37px;justify-content: center; align-items: center;">
<div class="edit-container"> <span class="zhu">注</span>
<div class="input-group" style="height: 120px"> <span style="font-size: 16px;color: #ce3939;">公告名称最多10个字,如果不填写则小程序不显示公告名称,如下图所示</span>
<label for="">标题 <span style="color: #ce3939">*</span></label> </div>
<div> <div style="text-align: right;margin-top: 30px;">
<textarea style="float: right;" class="title-area" type="text" placeholder="标题" id="title" cols="50" rows="10"></textarea> <span class="cancel">取消</span>
</div> <span class="sure">确定</span>
</div> </div>
<div class="input-group" style="height: 80px; align-items: center;display: none"> <div style="padding: 30px 0px;">
<label for="" style="float: left;height: 80px;align-items: center;line-height: 80px;">类型 <span style="color:#ce3939;">*</span></label> <img width="450px" src="/static/images/demo.png" alt="">
<div style="float: left; margin-left: 57px;margin-top: 20px;"> </div>
<input type="radio" name="type" value="1" checked><span class="notice" style="margin-right: 180px;">通知</span>
<input type="radio" name="type" value="2"><span class="info">赛讯</span>
</div>
</div>
<div class="input-group" style="margin-top: 8px;margin-bottom: 30px;height: 240px">
<label id="file-cover">封面<br><span style="font-size: 16px;color: #ce3939;margin-top: 20px">
<span style="font-size: 12px;display: inline-block;border-radius: 50%;height: 18px;width: 18px;background: #ce3939;color: white;text-align: center;">注</span>
<span style="display: inline">建议分辨<br>率710*242</span></span></label>
<div style="float: right;">
<div class="cover">
<span class="icon-cover"></span>
</div> </div>
<input id="file" type="file" style="display: none" onchange="uploadFile(this)"> <div class="edit-mask"></div>
</div> <style>
</div> .zhu {
<div class="input-group" style="height: 120px"> height: 18px;
<label for="">外链</label> width: 19px;
<div> background: #ce3939;
<textarea style="float: right;" class="title-area" type="text" placeholder="外链填写后,优先展示外链信息公众号必选绑定小程序" id="linkUrl" cols="50" rows="10"></textarea> border-radius: 50%;
</div> display: inline-block;
</div> color: white;
<div class="input-group"> font-size: 12px;
<label for="">内容编辑 <span style="color:#ce3939">*</span></label> text-align: center;
<div id="container" style="float: right"></div> line-height: 18px;
</div> margin: 1px 3px 0px 0px;
}
<span id="save" class="save">保存</span>
</div> .edit-mask {
</div> width: 1920px;
height: 1069px;
<script src="${ctxStatic}/js/news.js"></script> background: rgba(246, 246, 246, 1);
</div> position: fixed;
width: 100%;
<div class="item copy" style="display: none"> height: 100%;
<span class="title" style="flex:11.6">${item.title}</span> z-index: 99;
<%--<span class="type" style="flex:2">${item.type == 1 ? '通知':'赛训' }</span>--%> background: rgba(0, 0, 0, 1);
<div style="flex:2;display: flex;flex-direction: column"> opacity: 0.8;
<div class="opt edit"> left: 0px;
<span class="icon-edit"></span> top: 0px;
<span class="opt-text">编辑</span> display: none;
</div> }
<div class="opt del">
<span class="icon-del"></span> .sure {
<span class="opt-text">删除</span> width: 146px;
</div> height: 42px;
</div> background: rgba(206, 57, 57, 1);
</div> border-radius: 4px;
font-size: 20px;
<div class="edit-dialog"> color: rgba(255, 255, 255, 1);
<div style="height: 50px;"> line-height: 42px;
<span style="font-size: 22px;color: #ce3939;">编辑</span> text-align: center;
</div> cursor: pointer;
<div> }
<input id="newsAlias" type="text" placeholder="请输入名称">
</div> .cancel {
<div style="display: flex; height: 37px;justify-content: center; align-items: center;"> width: 146px;
<span class="zhu">注</span> height: 42px;
<span style="font-size: 16px;color: #ce3939;">公告名称最多10个字,如果不填写则小程序不显示公告名称,如下图所示</span> background: rgba(148, 148, 148, 1);
</div> border-radius: 4px;
<div style="text-align: right;margin-top: 30px;"> font-size: 20px;
<span class="cancel">取消</span> color: rgba(255, 255, 255, 1);
<span class="sure">确定</span> margin-right: 20px;
</div> line-height: 42px;
<div style="padding: 30px 0px;"> text-align: center;
<img width="450px" src="/static/images/demo.png" alt=""> cursor: pointer;
</div> }
</div>
<div class="edit-mask"></div> .edit-dialog {
<style> padding: 40px;
.zhu{ width: 600px;
height: 18px; height: 540px;
width: 19px; background: rgba(255, 255, 255, 1);
background: #ce3939; border-radius: 4px;
border-radius: 50%; position: absolute;
display: inline-block; top: 100px;
color: white; left: 50%;
font-size: 12px; margin-left: -300px;
text-align: center; z-index: 100;
line-height: 18px; display: none;
margin: 1px 3px 0px 0px; }
}
.edit-mask{ .edit-dialog input {
width:1920px; width: 518px;
height:1069px; height: 50px;
background:rgba(246,246,246,1); background: rgba(247, 247, 247, 1);
position: fixed; border-radius: 4px;
width: 100%; border: 1px solid rgba(229, 229, 229, 1);
height: 100%; }
z-index: 99; </style>
background:rgba(0,0,0,1); </body>
opacity:0.8;
left: 0px; </html>
top: 0px; \ No newline at end of file
display: none;
}
.sure{
width: 146px;
height: 42px;
background: rgba(206,57,57,1);
border-radius: 4px;
font-size: 20px;
color: rgba(255,255,255,1);
line-height: 42px;
text-align: center;
cursor: pointer;
}
.cancel{
width: 146px;
height: 42px;
background: rgba(148,148,148,1);
border-radius: 4px;
font-size: 20px;
color: rgba(255,255,255,1);
margin-right: 20px;
line-height: 42px;
text-align: center;
cursor: pointer;
}
.edit-dialog{
padding: 40px;
width:600px;
height:540px;
background:rgba(255,255,255,1);
border-radius:4px;
position: absolute;
top: 100px;
left: 50%;
margin-left: -300px ;
z-index: 100;
display: none;
}
.edit-dialog input{
width: 518px;
height: 50px;
background: rgba(247,247,247,1);
border-radius: 4px;
border: 1px solid rgba(229,229,229,1);
}
</style>
</body>
</html>
...@@ -586,6 +586,10 @@ ...@@ -586,6 +586,10 @@
6: { 6: {
label: '图片', label: '图片',
placeholder: '请输入图片地址', placeholder: '请输入图片地址',
},
7: {
label: '地图',
placeholder: '请输入地址和经纬度',
} }
}, },
typeOptions: [ typeOptions: [
...@@ -612,6 +616,10 @@ ...@@ -612,6 +616,10 @@
{ {
name: '图片', name: '图片',
value: 6, value: 6,
},
{
name: '地图',
value: 7,
} }
], ],
statusType: { statusType: {
......
// 定义 typeDesc 映射
const typeDesc = {
0: {
label: '文本',
placeholder: '请输入文本内容',
},
1: {
label: '网页',
placeholder: '请输入网页地址',
},
2: {
label: '小程序',
placeholder: '请输入小程序地址',
},
3: {
label: '短连接',
placeholder: '请输入短连接地址',
},
4: {
label: '页面',
placeholder: '请输入页面地址',
},
5: {
label: '文档',
placeholder: '请输入文档地址',
},
6: {
label: '图片',
placeholder: '请输入图片地址',
},
7: {
label: '地图',
placeholder: '请输入地址和经纬度',
}
};
$(document).ready(function () { $(document).ready(function () {
editor = UE.getEditor('container'); editor = UE.getEditor('container');
...@@ -10,6 +45,12 @@ $(document).ready(function () { ...@@ -10,6 +45,12 @@ $(document).ready(function () {
} }
let linkUrl = $('#linkUrl').val(); let linkUrl = $('#linkUrl').val();
var content = editor.getContent(); var content = editor.getContent();
// 新增字段
const openType = $('#openType').val();
const path = $('#path').val();
const lat = $('#lat').val();
const lng = $('#lng').val();
const appId = $('#appId').val();
if (!content) { if (!content) {
layer.alert("内容不能为空!"); layer.alert("内容不能为空!");
return; return;
...@@ -19,29 +60,37 @@ $(document).ready(function () { ...@@ -19,29 +60,37 @@ $(document).ready(function () {
type: 'post', type: 'post',
data: { data: {
linkUrl, linkUrl,
id: $('.edit-container').attr('data-id'), title: title, content: editor.getContent(), userId: 1, id: $('.edit-container').attr('data-id'),
cmptId: getCId(), cover: $('#file-cover').attr('data-src'), type: $('input[name="type"]:checked').val() title: title,
appId:appId,
content: editor.getContent(),
userId: 1,
cmptId: getCId(),
cover: $('#file-cover').attr('data-src'),
type: $('input[name="type"]:checked').val(),
// 新增的字段
openType: openType,
path: path,
lat: lat,
lng: lng
}, },
success: function (data) { success: function (data) {
layer.msg('保存成功') layer.msg('保存成功')
console.log(data); window.location.reload();
$('.edit-container').attr('data-id', data.content.id); // $('.edit-container').attr('data-id', data.content.id);
// var length = $('.container .item').length;
// var copy = null;
var length = $('.container .item').length; // if (length == 0) {
var copy = null; // copy = $('.copy').clone().clone();
if (length == 0) { // } else {
copy = $('.copy').clone().clone(); // copy = $('.item').last().clone();
} else { // $('.item[data-id="' + data.content.id + '"]').remove();
copy = $('.item').last().clone(); // }
$('.item[data-id="' + data.content.id + '"]').remove(); // $(copy).find('.title').text(data.content.title);
// $(copy).find('.type').text(data.content.type == 1 ? '通知' : "赛训");
} // $(copy).attr('data-id', data.content.id);
$(copy).find('.title').text(data.content.title); // $(copy).show()
$(copy).find('.type').text(data.content.type == 1 ? '通知' : "赛训"); // $('.container').append($(copy));
$(copy).attr('data-id', data.content.id);
$(copy).show()
$('.container').append($(copy));
} }
}) })
}); });
...@@ -79,6 +128,7 @@ $(document).ready(function () { ...@@ -79,6 +128,7 @@ $(document).ready(function () {
function () { function () {
delNews(id, function () { delNews(id, function () {
obj.remove(); obj.remove();
window.location.reload();
}); });
}, function () { }, function () {
...@@ -102,12 +152,7 @@ $(document).ready(function () { ...@@ -102,12 +152,7 @@ $(document).ready(function () {
success:function (data) { success:function (data) {
if(data.code == 200){ if(data.code == 200){
layer.msg('保存成功'); layer.msg('保存成功');
if($('#newsAlias').val() == '' || $('#newsAlias').val() == undefined){ window.location.reload();
$('.news-title').empty();
$('.news-title').append("<span class=\"no-name\">未命名</span>");
}else{
$('.news-title').text($('#newsAlias').val());
}
$('.edit-mask,.edit-dialog').fadeOut(); $('.edit-mask,.edit-dialog').fadeOut();
} }
} }
...@@ -119,7 +164,42 @@ $(document).ready(function () { ...@@ -119,7 +164,42 @@ $(document).ready(function () {
$('#newsAlias').val(); $('#newsAlias').val();
$('.edit-mask,.edit-dialog').fadeIn(); $('.edit-mask,.edit-dialog').fadeIn();
}) })
// 监听select选项
// 监听 openType 变化
$('#openType').change(function() {
const openType = $(this).val();
updateViews(openType);
});
}); });
// 显示/隐藏必要的参数
function updateViews(openType=0){
const desc = typeDesc[openType];
if (desc) {
// 修改 path 的 label 和 placeholder
$('#path').prev('label').text(desc.label);
$('#path').attr('placeholder', desc.placeholder);
if (openType == '0') { // 地图类型
$('#path-input').addClass('hidden');
} else {
$('#path-input').removeClass('hidden');
}
if (openType == '2') { // 地图类型
$('#appId-input').removeClass('hidden');
} else {
$('#appId-input').addClass('hidden');
}
// 根据类型显示/隐藏经纬度输入框
if (openType == '7') { // 地图类型
$('#lat-input').removeClass('hidden');
$('#lng-input').removeClass('hidden');
} else {
$('#lat-input').addClass('hidden');
$('#lng-input').addClass('hidden');
}
}
}
//文件上传处理 //文件上传处理
function uploadFile(obj) { function uploadFile(obj) {
...@@ -167,12 +247,17 @@ function getNews(id) { ...@@ -167,12 +247,17 @@ function getNews(id) {
$('#title').val(data.content.title) $('#title').val(data.content.title)
$('#linkUrl').val(data.content.linkUrl) $('#linkUrl').val(data.content.linkUrl)
$('input[name="type"][value=' + data.content.type + ']').attr('checked', true) $('input[name="type"][value=' + data.content.type + ']').attr('checked', true)
$('#openType').val(data.content.openType);
$('#path').val(data.content.path);
$('#lat').val(data.content.lat);
$('#lng').val(data.content.lng);
$('#appId').val(data.content.appId);
updateViews(data.content.openType)
if (data.content.cover) { if (data.content.cover) {
$('.cover').css('background-image', "url(" + data.content.cover + ")") $('.cover').css('background-image', "url(" + data.content.cover + ")")
$('.icon-cover').remove(); $('.icon-cover').remove();
$('#file-cover').attr('data-src', data.content.cover) $('#file-cover').attr('data-src', data.content.cover)
} }
editor.setContent(data.content.content) editor.setContent(data.content.content)
} }
layer.closeAll(); layer.closeAll();
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment