Skip to content
项目
群组
代码片段
帮助
正在加载...
帮助
提交反馈
为 GitLab 提交贡献
登录
切换导航
iBiz-Vue-Mob-R7-Res
项目
项目
详情
动态
版本
周期分析
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
统计图
议题
0
议题
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
CI / CD
CI / CD
流水线
作业
计划
统计图
Wiki
Wiki
代码片段
代码片段
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
统计图
创建新议题
作业
提交
议题看板
打开侧边栏
iBiz-R7前端标准模板
iBiz-Vue-Mob-R7-Res
提交
219d41fe
提交
219d41fe
编写于
8月 29, 2020
作者:
KK
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
富文本样式优化
上级
050a9f09
变更
4
隐藏空白字符变更
内嵌
并排
正在显示
4 个修改的文件
包含
61 行增加
和
78 行删除
+61
-78
app-mob-rich-text-editor.less
...ts/app-mob-rich-text-editor/app-mob-rich-text-editor.less
+11
-0
app-mob-rich-text-editor.vue
...nts/app-mob-rich-text-editor/app-mob-rich-text-editor.vue
+28
-29
app-rich-text.less
src/components/app-rich-text/app-rich-text.less
+19
-12
app-rich-text.vue
src/components/app-rich-text/app-rich-text.vue
+3
-37
未找到文件。
src/components/app-mob-rich-text-editor/app-mob-rich-text-editor.less
0 → 100644
浏览文件 @
219d41fe
.app-mob-rich-text-editor{
width: 100%;
height: 100%;
justify-content: flex-end;
display: flex;
.app-mob-rich-text-editor-icon{
margin-right: 4px;
color: #777272;
font-size: 18px;
}
}
\ No newline at end of file
src/components/app-mob-rich-text-editor/app-mob-rich-text-editor.vue
浏览文件 @
219d41fe
<
template
>
<
template
>
<div>
<div
class=
"app-mob-rich-text-editor"
@
click=
"open"
>
<div
v-html=
"reValue"
></div><ion-icon
name=
"options-outline"
@
click=
"open"
></ion-icon>
<div
v-html=
"reValue"
></div>
</div>
<ion-icon
class=
"app-mob-rich-text-editor-icon"
v-if=
"!reValue"
name=
"options-outline"
@
click=
"open"
></ion-icon>
</div>
</
template
>
</
template
>
<
script
lang =
'ts'
>
<
script
lang =
'ts'
>
import
{
Vue
,
Component
,
Prop
,
Model
,
Watch
}
from
'vue-property-decorator'
;
import
{
Vue
,
Component
,
Prop
,
Model
,
Watch
}
from
'vue-property-decorator'
;
...
@@ -9,48 +10,49 @@ import { Vue, Component, Prop, Model, Watch } from 'vue-property-decorator';
...
@@ -9,48 +10,49 @@ import { Vue, Component, Prop, Model, Watch } from 'vue-property-decorator';
export
default
class
AppRichTextEditor
extends
Vue
{
export
default
class
AppRichTextEditor
extends
Vue
{
/**
/**
*
输入
值
* 值
*
*
* @type {string}
* @type {string}
* @memberof App
Input
* @memberof App
RichTextEditor
*/
*/
@
Prop
()
public
value
?:
any
;
@
Prop
()
public
value
?:
any
;
/**
* 绑定值
*
* @type {string}
* @memberof AppRichTextEditor
*/
get
reValue
(){
get
reValue
(){
return
this
.
value
;
return
this
.
value
;
}
}
/**
* 获取值
*
* @type {string}
* @memberof AppRichTextEditor
*/
set
reValue
(
value
:
any
){
set
reValue
(
value
:
any
){
this
.
$emit
(
"change"
,
value
);
this
.
$emit
(
"change"
,
value
);
}
}
/**
/**
*
类型
*
打开富文本
*
*
* @type {string}
* @type {string}
* @memberof App
Input
* @memberof App
RichTextEditor
*/
*/
@
Prop
()
public
type
?:
string
;
public
open
(){
this
.
openPopupModal
({
viewname
:
'app-rich-text'
,
title
:
'app-rich-text'
},{},{
value
:
this
.
value
});
}
/**
/**
*
占位提示文字
*
模态打开富文本
*
*
* @type {string}
* @type {string}
* @memberof App
Input
* @memberof App
RichTextEditor
*/
*/
@
Prop
()
public
placeholder
?:
string
;
public
messages
=
""
;
public
onEditorBlur
(){}
public
onEditorFocus
(){}
public
onEditorReady
(){}
public
open
(){
this
.
openPopupModal
({
viewname
:
'app-rich-text'
,
title
:
'app-rich-text'
},{},{
value
:
this
.
value
});
}
private
async
openPopupModal
(
view
:
any
,
context
:
any
,
param
:
any
):
Promise
<
any
>
{
private
async
openPopupModal
(
view
:
any
,
context
:
any
,
param
:
any
):
Promise
<
any
>
{
const
result
:
any
=
await
this
.
$appmodal
.
openModal
(
view
,
context
,
param
);
const
result
:
any
=
await
this
.
$appmodal
.
openModal
(
view
,
context
,
param
);
if
(
result
||
Object
.
is
(
result
.
ret
,
'OK'
))
{
if
(
result
||
Object
.
is
(
result
.
ret
,
'OK'
))
{
...
@@ -58,11 +60,8 @@ export default class AppRichTextEditor extends Vue {
...
@@ -58,11 +60,8 @@ export default class AppRichTextEditor extends Vue {
}
}
}
}
public
openViewClose
(
result
:
any
)
{
}
}
}
</
script
>
</
script
>
<
style
lang=
"less"
>
<
style
lang=
"less"
>
@import './app-mob-rich-text-editor.less';
</
style
>
</
style
>
\ No newline at end of file
src/components/app-rich-text/app-rich-text.less
浏览文件 @
219d41fe
.quill-editor {
.richtext{
height: calc(100% - 10vh);
.quill-editor {
-webkit-touch-callout: text !important;
-webkit-touch-callout: text !important;
-webkit-user-select: text !important;
-webkit-user-select: text !important;
-khtml-user-select: text !important;
-khtml-user-select: text !important;
-moz-user-select: text !important;
-moz-user-select: text !important;
-ms-user-select: text !important;
-ms-user-select: text !important;
img{
max-width: 90%;
}
}
}
.richtext{
height: calc(100% - 20vh);
.quill-editor-button {
}
.quill-editor-button{
text-align: center;
text-align: center;
position: absolute;
position: absolute;
bottom: 0;
bottom: 0;
width: 100%
width: 100%;
ion-button{
ion-button {
width: 58%;
width: 48%;
}
}
}
}
\ No newline at end of file
.ql-container {
height: calc(100% - 65px);
}
}
\ No newline at end of file
src/components/app-rich-text/app-rich-text.vue
浏览文件 @
219d41fe
...
@@ -90,7 +90,7 @@ export default class AppRichTextEditor extends Vue {
...
@@ -90,7 +90,7 @@ export default class AppRichTextEditor extends Vue {
* @memberof AppRichTextEditor
* @memberof AppRichTextEditor
*/
*/
public
mounted
()
{
public
mounted
()
{
this
.
resloutValue
=
JSON
.
parse
(
this
.
_viewparams
).
value
;
this
.
resloutValue
=
JSON
.
parse
(
this
.
_viewparams
).
value
?
JSON
.
parse
(
this
.
_viewparams
).
value
:
""
;
}
}
/**
/**
...
@@ -156,7 +156,6 @@ export default class AppRichTextEditor extends Vue {
...
@@ -156,7 +156,6 @@ export default class AppRichTextEditor extends Vue {
if
(
response
&&
response
.
data
&&
response
.
status
===
200
)
{
if
(
response
&&
response
.
data
&&
response
.
status
===
200
)
{
let
data
:
any
=
response
.
data
;
let
data
:
any
=
response
.
data
;
if
(
process
.
env
.
NODE_ENV
===
"development"
)
{
if
(
process
.
env
.
NODE_ENV
===
"development"
)
{
this
.
devFiles
.
push
(
Object
.
assign
({},
data
,
{
url
:
file
.
content
}));
this
.
dataProcess
(
Object
.
assign
({},
data
,
{
url
:
file
.
content
}));
this
.
dataProcess
(
Object
.
assign
({},
data
,
{
url
:
file
.
content
}));
}
}
}
else
{
}
else
{
...
@@ -174,46 +173,13 @@ export default class AppRichTextEditor extends Vue {
...
@@ -174,46 +173,13 @@ export default class AppRichTextEditor extends Vue {
private
dataProcess
(
file
:
any
):
void
{
private
dataProcess
(
file
:
any
):
void
{
let
_uploadUrl
=
`
${
Environment
.
BaseUrl
}${
Environment
.
UploadFile
}
`
;
let
_uploadUrl
=
`
${
Environment
.
BaseUrl
}${
Environment
.
UploadFile
}
`
;
this
.
uploadUrl
=
_uploadUrl
;
this
.
uploadUrl
=
_uploadUrl
;
if
(
process
.
env
.
NODE_ENV
===
"development"
)
{
let
index
=
this
.
devFiles
.
findIndex
((
devFile
:
any
)
=>
Object
.
is
(
devFile
.
id
,
file
.
id
)
);
if
(
index
!==
-
1
)
{
file
.
url
=
this
.
devFiles
[
index
].
url
;
file
.
isImage
=
true
;
}
}
let
_downloadUrl
=
`
${
this
.
downloadUrl
}
/
${
file
.
id
}
`
;
let
_downloadUrl
=
`
${
this
.
downloadUrl
}
/
${
file
.
id
}
`
;
file
.
isImage
=
true
;
file
.
isImage
=
true
;
file
.
url
=
_downloadUrl
;
file
.
url
=
_downloadUrl
;
this
.
resloutValue
=
'<img src="'
+
file
.
url
+
'" alt="">'
;
this
.
resloutValue
=
this
.
resloutValue
+
'<img src="'
+
file
.
url
+
'" alt="">'
;
}
}
}
}
</
script
>
</
script
>
<
style
lang=
"less"
>
<
style
lang=
"less"
>
.richtext{
@import './app-rich-text.less';
.quill-editor {
-webkit-touch-callout: text !important;
-webkit-user-select: text !important;
-khtml-user-select: text !important;
-moz-user-select: text !important;
-ms-user-select: text !important;
}
.richtext {
height: calc(100% - 10vh);
}
.quill-editor-button {
text-align: center;
position: absolute;
bottom: 0;
width: 100%;
ion-button {
width: 48%;
}
}
.ql-container {
height: calc(100% - 65px);
}
}
</
style
>
</
style
>
\ No newline at end of file
编辑
预览
Markdown
格式
0%
请重试
or
添加新附件
添加附件
取消
您添加了
0
人
到此讨论。请谨慎行事。
先完成此消息的编辑!
取消
想要评论请
注册
或
登录