Implement WYSIWYG Editor
This commit is contained in:
Jianqiu Zhang
Vendored
+7
File diff suppressed because one or more lines are too long
+7
File diff suppressed because one or more lines are too long
Vendored
+7
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* froala_editor v2.6.2 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after{clear:both;display:block;content:"";height:0}.hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.fr-view span[style~="color:"] a{color:inherit}.fr-view strong{font-weight:700}.fr-view table{border:0;border-collapse:collapse;empty-cells:show;max-width:100%}.fr-view table.fr-dashed-borders td,.fr-view table.fr-dashed-borders th{border-style:dashed}.fr-view table.fr-alternate-rows tbody tr:nth-child(2n){background:#f5f5f5}.fr-view table td,.fr-view table th{border:1px solid #ddd}.fr-view table td:empty,.fr-view table th:empty{height:20px}.fr-view table td.fr-highlighted,.fr-view table th.fr-highlighted{border:1px double red}.fr-view table td.fr-thick,.fr-view table th.fr-thick{border-width:2px}.fr-view table th{background:#e6e6e6}.fr-view hr{clear:both;user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;page-break-after:always}.fr-view .fr-file{position:relative}.fr-view .fr-file::after{position:relative;content:"\1F4CE";font-weight:400}.fr-view pre{white-space:pre-wrap;word-wrap:break-word}.fr-view[dir=rtl] blockquote{border-left:0;border-right:solid 2px #5e35b1;margin-right:0;padding-right:5px;padding-left:0}.fr-view[dir=rtl] blockquote blockquote{border-color:#00bcd4}.fr-view[dir=rtl] blockquote blockquote blockquote{border-color:#43a047}.fr-view blockquote{border-left:solid 2px #5e35b1;margin-left:0;padding-left:5px;color:#5e35b1}.fr-view blockquote blockquote{border-color:#00bcd4;color:#00bcd4}.fr-view blockquote blockquote blockquote{border-color:#43a047;color:#43a047}.fr-view span.fr-emoticon{font-weight:400;font-family:"Apple Color Emoji","Segoe UI Emoji",NotoColorEmoji,"Segoe UI Symbol","Android Emoji",EmojiSymbols;display:inline;line-height:0}.fr-view span.fr-emoticon.fr-emoticon-img{background-repeat:no-repeat!important;font-size:inherit;height:1em;width:1em;min-height:20px;min-width:20px;display:inline-block;margin:-.1em .1em .1em;line-height:1;vertical-align:middle}.fr-view .fr-text-gray{color:#AAA!important}.fr-view .fr-text-bordered{border-top:solid 1px #222;border-bottom:solid 1px #222;padding:10px 0}.fr-view .fr-text-spaced{letter-spacing:1px}.fr-view .fr-text-uppercase{text-transform:uppercase}.fr-view img{position:relative;max-width:100%}.fr-view img.fr-dib{margin:5px auto;display:block;float:none;vertical-align:top}.fr-view img.fr-dib.fr-fil{margin-left:0}.fr-view img.fr-dib.fr-fir{margin-right:0}.fr-view img.fr-dii{display:inline-block;float:none;vertical-align:bottom;margin-left:5px;margin-right:5px;max-width:calc(100% - (2 * 5px))}.fr-view img.fr-dii.fr-fil{float:left;margin:5px 5px 5px 0;max-width:calc(100% - 5px)}.fr-view img.fr-dii.fr-fir{float:right;margin:5px 0 5px 5px;max-width:calc(100% - 5px)}.fr-view img.fr-rounded{border-radius:100%;-moz-border-radius:100%;-webkit-border-radius:100%;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-view img.fr-bordered{border:solid 10px #CCC;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.fr-view .fr-video{text-align:center;position:relative}.fr-view .fr-video>*{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;max-width:100%;border:0}.fr-view .fr-video.fr-dvb{display:block;clear:both}.fr-view .fr-video.fr-dvb.fr-fvl{text-align:left}.fr-view .fr-video.fr-dvb.fr-fvr{text-align:right}.fr-view .fr-video.fr-dvi{display:inline-block}.fr-view .fr-video.fr-dvi.fr-fvl{float:left}.fr-view .fr-video.fr-dvi.fr-fvr{float:right}.fr-view a.fr-strong{font-weight:700}.fr-view a.fr-green{color:green}.fr-view button.fr-rounded,.fr-view input.fr-rounded,.fr-view textarea.fr-rounded{border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-view button.fr-large,.fr-view input.fr-large,.fr-view textarea.fr-large{font-size:24px}a.fr-view.fr-strong{font-weight:700}a.fr-view.fr-green{color:green}img.fr-view{position:relative;max-width:100%}img.fr-view.fr-dib{margin:5px auto;display:block;float:none;vertical-align:top}img.fr-view.fr-dib.fr-fil{margin-left:0}img.fr-view.fr-dib.fr-fir{margin-right:0}img.fr-view.fr-dii{display:inline-block;float:none;vertical-align:bottom;margin-left:5px;margin-right:5px;max-width:calc(100% - (2 * 5px))}img.fr-view.fr-dii.fr-fil{float:left;margin:5px 5px 5px 0;max-width:calc(100% - 5px)}img.fr-view.fr-dii.fr-fir{float:right;margin:5px 0 5px 5px;max-width:calc(100% - 5px)}img.fr-view.fr-rounded{border-radius:100%;-moz-border-radius:100%;-webkit-border-radius:100%;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}img.fr-view.fr-bordered{border:solid 10px #CCC;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}
|
||||
Vendored
+22
File diff suppressed because one or more lines are too long
@@ -49,7 +49,7 @@
|
||||
标题
|
||||
<input type="text" placeholder="Title" name="title" class="form-control">
|
||||
内容
|
||||
<textarea rows="4" placeholder="Content" name="content" class="form-control"></textarea>
|
||||
<textarea rows="4" id="content" placeholder="Content" name="content" class="form-control"></textarea>
|
||||
<input type="submit" class="btn btn-primary" value="发布公告">
|
||||
</form>
|
||||
</div>
|
||||
@@ -145,4 +145,18 @@
|
||||
{{ $reports->links() }}
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
// WYSIWYG Editor
|
||||
$("textarea#content").froalaEditor({
|
||||
imageUploadParam: 'source',
|
||||
imageUploadParams: {
|
||||
key: "7e945496f2de8cbc710ecca702062e9b",
|
||||
format: "flea-mart"
|
||||
},
|
||||
imageUploadURL: 'https://flimg.neupioneer.com/api/1/upload',
|
||||
requestWithCORS: true,
|
||||
pluginsEnabled: ['image', 'link', 'colors', 'emoticons',
|
||||
'fontSize', 'fontFamily', 'fullscreen']
|
||||
});
|
||||
</script>
|
||||
@endsection
|
||||
|
||||
@@ -79,7 +79,7 @@
|
||||
</div>
|
||||
<br/>
|
||||
<h3>商品介绍</h3>
|
||||
<div style="word-break:break-all">{{ $good->description }}</div>
|
||||
<div style="word-break:break-all">{!! $good->description !!}</div>
|
||||
</div>
|
||||
<script>
|
||||
function add_favlist() {
|
||||
@@ -146,4 +146,4 @@
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
@endsection
|
||||
|
||||
@@ -39,7 +39,7 @@
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="description">商品描述</label>
|
||||
<textarea name="description" id="description" placeholder="商品描述" class="form-control" style="resize:none" rows="6">{{count($errors) ? old('description') : $good->description}}</textarea>
|
||||
<textarea name="description" id="description" placeholder="商品描述" class="form-control" style="resize:none" rows="6">{!! count($errors) ? old('description') : $good->description !!}</textarea>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="price">商品价格</label>
|
||||
@@ -126,6 +126,19 @@
|
||||
prevDiv.innerHTML = '<br/><div class="img" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src=\'' + file.value + '\'"></div>';
|
||||
}
|
||||
}
|
||||
// WYSIWYG Editor
|
||||
$("textarea#description").froalaEditor({
|
||||
imageUploadParam: 'source',
|
||||
imageUploadParams: {
|
||||
key: "7e945496f2de8cbc710ecca702062e9b",
|
||||
format: "flea-mart"
|
||||
},
|
||||
imageUploadURL: 'https://flimg.neupioneer.com/api/1/upload',
|
||||
requestWithCORS: true,
|
||||
pluginsEnabled: ['image', 'link', 'colors', 'emoticons',
|
||||
'fontSize', 'fontFamily', 'fullscreen'],
|
||||
toolbarButtons: ['bold', 'italic', 'underline', 'strikeThrough', 'fontFamily', 'fontSize', 'color', 'align', 'quote', '-', 'insertImage', '|', 'emoticons', 'help', 'fullscreen', '|', 'undo', 'redo']
|
||||
});
|
||||
</script>
|
||||
|
||||
@endsection
|
||||
@endsection
|
||||
|
||||
@@ -7,4 +7,4 @@
|
||||
<h2>{{ $announcement->title }}</h2>
|
||||
{{ $announcement->content }}
|
||||
|
||||
@endsection
|
||||
@endsection
|
||||
|
||||
@@ -10,11 +10,14 @@
|
||||
<link rel="stylesheet" href="/css/cropper.min.css">
|
||||
<script src="/js/jquery-3.2.1.min.js"></script>
|
||||
<script src="/js/tether.min.js"></script>
|
||||
<link rel="stylesheet" href="/css/froala_editor.min.css">
|
||||
<link rel="stylesheet" href="/css/froala_editor.pkgd.min.css">
|
||||
<script src="/js/cropper.min.js"></script>
|
||||
<script src="/js/jquery.slides.min.js"></script>
|
||||
<script src="/js/popper.min.js"></script>
|
||||
<script src="/js/bootstrap.min.js"></script>
|
||||
@yield('asset')
|
||||
<script src="/js/froala_editor.pkgd.min.js"></script>
|
||||
<title>@yield('title') - 先锋市场 Powered by NEUPioneer</title>
|
||||
</head>
|
||||
<body>
|
||||
@@ -25,4 +28,4 @@
|
||||
@yield('navbm')
|
||||
@include('layout.footer')
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
||||
@@ -58,7 +58,7 @@
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
{{$announce->content}}
|
||||
{!! $announce->content !!}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user