xpz2018
4 years ago
8 changed files with 3 additions and 151 deletions
Split View
Diff Options
-
29components/toast/index.js
-
9components/toast/index.json
-
33components/toast/index.wxml
-
1components/toast/index.wxss
-
70components/toast/toast.js
-
10pages/home/employee-info/index.js
-
1pages/home/employee-info/index.json
-
1pages/home/employee-info/index.wxml
@ -1,29 +0,0 @@ |
|||
import { VantComponent } from '../common/component'; |
|||
VantComponent({ |
|||
props: { |
|||
show: Boolean, |
|||
mask: Boolean, |
|||
message: String, |
|||
forbidClick: Boolean, |
|||
zIndex: { |
|||
type: Number, |
|||
value: 1000, |
|||
}, |
|||
type: { |
|||
type: String, |
|||
value: 'text', |
|||
}, |
|||
loadingType: { |
|||
type: String, |
|||
value: 'circular', |
|||
}, |
|||
position: { |
|||
type: String, |
|||
value: 'middle', |
|||
}, |
|||
}, |
|||
methods: { |
|||
// for prevent touchmove
|
|||
noop() {}, |
|||
}, |
|||
}); |
|||
@ -1,9 +0,0 @@ |
|||
{ |
|||
"component": true, |
|||
"usingComponents": { |
|||
"van-icon": "../icon/index", |
|||
"van-loading": "../loading/index", |
|||
"van-overlay": "../overlay/index", |
|||
"van-transition": "../transition/index" |
|||
} |
|||
} |
|||
@ -1,33 +0,0 @@ |
|||
<van-overlay |
|||
wx:if="{{ mask || forbidClick }}" |
|||
show="{{ show }}" |
|||
z-index="{{ zIndex }}" |
|||
custom-style="{{ mask ? '' : 'background-color: transparent;' }}" |
|||
/> |
|||
<van-transition |
|||
show="{{ show }}" |
|||
custom-style="z-index: {{ zIndex }}" |
|||
custom-class="van-toast__container" |
|||
> |
|||
<view |
|||
class="van-toast van-toast--{{ type === 'text' ? 'text' : 'icon' }} van-toast--{{ position }}" |
|||
catch:touchmove="noop" |
|||
> |
|||
<!-- text only --> |
|||
<text wx:if="{{ type === 'text' }}">{{ message }}</text> |
|||
|
|||
<!-- with icon --> |
|||
<block wx:else> |
|||
<van-loading |
|||
wx:if="{{ type === 'loading' }}" |
|||
color="white" |
|||
type="{{ loadingType }}" |
|||
custom-class="van-toast__loading" |
|||
/> |
|||
<van-icon wx:else class="van-toast__icon" name="{{ type }}" /> |
|||
<text wx:if="{{ message }}" class="van-toast__text">{{ message }}</text> |
|||
</block> |
|||
|
|||
<slot /> |
|||
</view> |
|||
</van-transition> |
|||
@ -1 +0,0 @@ |
|||
@import '../common/index.wxss';.van-toast{display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;box-sizing:initial;color:#fff;color:var(--toast-text-color,#fff);font-size:14px;font-size:var(--toast-font-size,14px);line-height:20px;line-height:var(--toast-line-height,20px);white-space:pre-wrap;word-wrap:break-word;background-color:rgba(0,0,0,.7);background-color:var(--toast-background-color,rgba(0,0,0,.7));border-radius:8px;border-radius:var(--toast-border-radius,8px)}.van-toast__container{position:fixed;top:50%;left:50%;width:-webkit-fit-content;width:fit-content;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);max-width:70%;max-width:var(--toast-max-width,70%)}.van-toast--text{min-width:96px;min-width:var(--toast-text-min-width,96px);padding:8px 12px;padding:var(--toast-text-padding,8px 12px)}.van-toast--icon{width:88px;width:var(--toast-default-width,88px);min-height:88px;min-height:var(--toast-default-min-height,88px);padding:16px;padding:var(--toast-default-padding,16px)}.van-toast--icon .van-toast__icon{font-size:36px;font-size:var(--toast-icon-size,36px)}.van-toast--icon .van-toast__text{padding-top:8px}.van-toast__loading{margin:10px 0}.van-toast--top{-webkit-transform:translateY(-30vh);transform:translateY(-30vh)}.van-toast--bottom{-webkit-transform:translateY(30vh);transform:translateY(30vh)} |
|||
@ -1,70 +0,0 @@ |
|||
import { isObj } from '../common/validator'; |
|||
const defaultOptions = { |
|||
type: 'text', |
|||
mask: false, |
|||
message: '', |
|||
show: true, |
|||
zIndex: 1000, |
|||
duration: 2000, |
|||
position: 'middle', |
|||
forbidClick: false, |
|||
loadingType: 'circular', |
|||
selector: '#van-toast', |
|||
}; |
|||
let queue = []; |
|||
let currentOptions = Object.assign({}, defaultOptions); |
|||
function parseOptions(message) { |
|||
return isObj(message) ? message : { message }; |
|||
} |
|||
function getContext() { |
|||
const pages = getCurrentPages(); |
|||
return pages[pages.length - 1]; |
|||
} |
|||
function Toast(toastOptions) { |
|||
const options = Object.assign( |
|||
Object.assign({}, currentOptions), |
|||
parseOptions(toastOptions) |
|||
); |
|||
const context = options.context || getContext(); |
|||
const toast = context.selectComponent(options.selector); |
|||
if (!toast) { |
|||
console.warn('未找到 van-toast 节点，请确认 selector 及 context 是否正确'); |
|||
return; |
|||
} |
|||
delete options.context; |
|||
delete options.selector; |
|||
toast.clear = () => { |
|||
toast.setData({ show: false }); |
|||
if (options.onClose) { |
|||
options.onClose(); |
|||
} |
|||
}; |
|||
queue.push(toast); |
|||
toast.setData(options); |
|||
clearTimeout(toast.timer); |
|||
if (options.duration != null && options.duration > 0) { |
|||
toast.timer = setTimeout(() => { |
|||
toast.clear(); |
|||
queue = queue.filter((item) => item !== toast); |
|||
}, options.duration); |
|||
} |
|||
return toast; |
|||
} |
|||
const createMethod = (type) => (options) => |
|||
Toast(Object.assign({ type }, parseOptions(options))); |
|||
Toast.loading = createMethod('loading'); |
|||
Toast.success = createMethod('success'); |
|||
Toast.fail = createMethod('fail'); |
|||
Toast.clear = () => { |
|||
queue.forEach((toast) => { |
|||
toast.clear(); |
|||
}); |
|||
queue = []; |
|||
}; |
|||
Toast.setDefaultOptions = (options) => { |
|||
Object.assign(currentOptions, options); |
|||
}; |
|||
Toast.resetDefaultOptions = () => { |
|||
currentOptions = Object.assign({}, defaultOptions); |
|||
}; |
|||
export default Toast; |
|||
Write
Preview
Loading…
Cancel
Save