Skip to content

G
gk
Commit a90d382d authored by daniel's avatar daniel
Browse files
Options

style(service): 新增富文本编辑器

parent 39a1e160
Hide whitespace changes
Inline Side-by-side
Showing with 32 additions and 16 deletions
src/main/webapp/WEB-INF/views/cmpt/service.jsp
View file @ a90d382d
......@@ -41,6 +41,11 @@
<script type="text/javascript" charset="utf-8" src="${ctxStatic}/layer/layer.js"></script>
<link rel="stylesheet" href="${ctxStatic}/layer/skin/layer.css">
<script
src="https://enroll.geexek.com/js/ueditor/ueditor.config-zs.js?v=<%=System.currentTimeMillis()%>"></script>
<script
src="https://enroll.geexek.com/js/ueditor/ueditor.all.js?v=<%=System.currentTimeMillis()%>"></script>
<link rel="stylesheet" href="/static/cmpt/score.css?<%=System.currentTimeMillis()%>">
<style>
.action {
......@@ -186,17 +191,23 @@
.cover {
width: 100%;
height: 200px;
height: 100px;
background: rgba(247, 247, 247, 1);
border-radius: 4px;
border: 1px solid rgba(238, 238, 238, 1);
display: flex;
justify-content: center;
align-items: center;
}
.cover-img {
width: 300px;
cursor: pointer;
background-repeat: no-repeat;
background-position: center;
background-size: auto;
background-size: cover;
height: 300px;
}
.icon-cover {
......@@ -325,8 +336,8 @@
</ul>
</nav>
</div>
<div class="dialog" v-show="dialog"
style="width: 60vw; height: 80vh; z-index: 99;display: flex;flex-direction: column;">
<div class="dialog" v-show="dialog" style="width:auto;height: 80vh; z-index: 99;display: flex;flex-direction: column;left: 50%;
transform: translateX(-50%);margin-left:0;">
<div>
<span class="title" style="margin-bottom: 10px; color: #CE3939">{{title}}</span>
</div>
......@@ -372,21 +383,14 @@
<span class="title-new">经度</span>
<div>
<input class="input" type="number" v-model="service.lng"
placeholder="请输入经度">
placeholder="请输入经度（如：106.639824000000000）">
</div>
</div>
<div class="func">
<span class="title-new">纬度</span>
<div>
<input class="input" type="number" v-model="service.lat"
placeholder="请输入纬度">
</div>
</div>
<div class="func">
<span class="title-new">内容</span>
<div>
<textarea class="input" v-model="service.content"
placeholder="请输入内容"></textarea>
placeholder="请输入纬度（如：26.672005000000000）">
</div>
</div>
<div class="func">
......@@ -394,18 +398,22 @@
<span style="font-size: 16px;color: #ce3939;margin:10px 0;">
<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">建议分辨率710*242</span>
<span style="display: inline">建议分辨率500*500</span>
</span>
<div>
<label for="file">
<div v-if="!service.imgUrl" class="cover">
<span class="icon-cover"></span>
</div>
<img v-else class="cover" :src="service.imgUrl" />
<img v-else class="cover cover-img" :src="service.imgUrl" />
</label>
<input id="file" type="file" style="display: none" @change="uploadFile">
</div>
</div>
<div class="func">
<span class="title-new">内容</span>
<div id="container"></div>
</div>
<div class="func">
<span class="title-new">备注 1</span>
<div>
......@@ -465,6 +473,7 @@
var app = new Vue({
el: '#sevice',
data: {
editor: null,
list: [],
dialog: false,
title: '新增自助服务',
......@@ -521,6 +530,10 @@
1: '发布'
}
},
mounted() {
const editor = UE.getEditor('container');
this.editor = editor
},
methods: {
// 展示dialog
addService() {
......@@ -612,11 +625,13 @@
layer.msg("经纬度不能为空！", { icon: 5, duration: 1500 });
return;
}
var content = this.editor.getContent();
if (!service.content) {
if (!content) {
layer.msg("内容不能为空！", { icon: 5, duration: 1500 });
return;
}
this.service.content = content
const url = this.service.id ? '/api/joyfulRoad/updJoyfulRichText' : '/api/joyfulRoad/insJoyfulRichText'
$.ajax({
......@@ -673,6 +688,7 @@
success: (data) => {
if (data.content) {
this.service = data.content;
this.editor.setContent(data.content.content)
this.dialog = true;
}
},
......
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