This repository has been archived on 2023-08-30. You can view files and clone it, but cannot push or open issues/pull-requests.
bytedo
/
wcui
Archived
1
0
Fork 0

layer组件增加iframe类型;优化meditor的表情插入

old
宇天 2018-06-29 02:45:50 +08:00
parent 775e5d6f66
commit 565db7ee12
3 changed files with 48 additions and 11 deletions

View File

@ -10,7 +10,7 @@
import 'drag/index' import 'drag/index'
import './skin/default.scss' import './skin/default.scss'
Anot.ui.layer = '1.0.0-base' Anot.ui.layer = '1.0.0-normal'
let layerDom = {} let layerDom = {}
let layerObj = {} let layerObj = {}
@ -196,9 +196,26 @@ class __layer__ {
} }
} }
//base版没有iframe类型 // iframe类型补一个自适应高度的方法
if (this.init.state.type === 4) { if (this.init.state.type === 4) {
this.init.state.type = 7 this.init.methods.autoSize = function() {
let { layer, frame } = this.$refs
frame.onload = function() {
setTimeout(function() {
try {
let $body = frame.contentWindow.document.body
let { clientWidth, clientHeight } = $body
Anot(layer).css({
width: clientWidth,
height: clientHeight,
marginLeft: -clientWidth / 2,
marginTop: -clientHeight / 2
})
Anot(frame).css({ height: clientHeight })
} catch (err) {}
}, 500)
}
}
} }
return this return this
} }
@ -226,6 +243,10 @@ class __layer__ {
layBox.classList.add('layer-box') layBox.classList.add('layer-box')
layBox.classList.add('skin-' + state.skin) layBox.classList.add('skin-' + state.skin)
if (state.extraClass) {
layBox.classList.add(state.extraClass)
delete state.extraClass
}
if (typeof state.shift === 'string') { if (typeof state.shift === 'string') {
layBox.classList.add('__' + state.shift) layBox.classList.add('__' + state.shift)
} else { } else {
@ -376,6 +397,7 @@ class __layer__ {
} }
show() { show() {
let vm = this.vm
let { state, $id } = this.init let { state, $id } = this.init
let container = state.container let container = state.container
@ -498,7 +520,7 @@ class __layer__ {
} }
const _layer = { const _layer = {
alert: function(content, title, cb) { alert(content, title, cb) {
let opt = { content, fixed: true } let opt = { content, fixed: true }
if (typeof title === 'function') { if (typeof title === 'function') {
@ -513,7 +535,7 @@ const _layer = {
} }
return _layer.open(opt) return _layer.open(opt)
}, },
confirm: function(content, title, yescb, nocb) { confirm(content, title, yescb, nocb) {
let opt = { content, fixed: true, type: 2 } let opt = { content, fixed: true, type: 2 }
if (typeof title === 'function') { if (typeof title === 'function') {
@ -534,7 +556,17 @@ const _layer = {
} }
return _layer.open(opt) return _layer.open(opt)
}, },
toast: function(txt, type = 'info', timeout = 2500) { frame(url, extra = {}) {
let opt = {
content: `<iframe ref="frame" class="frame-box" src="${url}"></iframe>`,
menubar: false,
maskClose: true,
type: 4,
...extra
}
return _layer.open(opt)
},
toast(txt, type = 'info', timeout = 2500) {
if (typeof type === 'number') { if (typeof type === 'number') {
timeout = type timeout = type
type = 'info' type = 'info'
@ -569,7 +601,7 @@ const _layer = {
return _layer.open(opt) return _layer.open(opt)
}, },
loading: function(style, container, cb) { loading(style, container, cb) {
style = style >>> 0 style = style >>> 0
style = style < 1 ? 1 : style > 5 ? 5 : style style = style < 1 ? 1 : style > 5 ? 5 : style
@ -595,7 +627,7 @@ const _layer = {
fixed: true fixed: true
}) })
}, },
tips: function(content, container, opt = {}) { tips(content, container, opt = {}) {
if (!(container instanceof HTMLElement)) { if (!(container instanceof HTMLElement)) {
return Anot.error('layer "tips" require a DOM object') return Anot.error('layer "tips" require a DOM object')
} }
@ -617,7 +649,7 @@ const _layer = {
}) })
return _layer.open(opt) return _layer.open(opt)
}, },
prompt: function(title, yescb) { prompt(title, yescb) {
if (typeof yescb !== 'function') { if (typeof yescb !== 'function') {
return console.error( return console.error(
'argument [callback] requires a function, but ' + 'argument [callback] requires a function, but ' +
@ -636,7 +668,7 @@ const _layer = {
return _layer.open(opt) return _layer.open(opt)
}, },
close: close, close: close,
open: function(opt) { open(opt) {
if (typeof opt === 'string') { if (typeof opt === 'string') {
opt = 'layerwrap-' + opt opt = 'layerwrap-' + opt
if (!layerObj[opt]) { if (!layerObj[opt]) {

View File

@ -74,6 +74,12 @@
&.type-3 {max-width:600px;min-width:300px;} &.type-3 {max-width:600px;min-width:300px;}
&.type-4 {padding:0;
.layer-content {padding:0;}
.frame-box {width:100%;height:100%;margin:0;padding:0;border:0;resize: none;}
}
/* tips类弹层(type 5) */ /* tips类弹层(type 5) */
&.type-5 {visibility:hidden;position:fixed;z-index:65534;min-width:75px;max-width:600px;padding:10px;line-height:1.5;color:#fff;background:rgba(0,0,0,.5);box-shadow:none; &.type-5 {visibility:hidden;position:fixed;z-index:65534;min-width:75px;max-width:600px;padding:10px;line-height:1.5;color:#fff;background:rgba(0,0,0,.5);box-shadow:none;

View File

@ -245,7 +245,6 @@ const addon = {
</ul>`, </ul>`,
insert: function(val) { insert: function(val) {
that.insert(val, false) that.insert(val, false)
this.close()
} }
}) })
}, },