临时提交
blak-kong
2 years ago
parent
479306b979
commit
7ce4b95528
@ -0,0 +1,14 @@
|
|||||||
|
.popup-status-title {
|
||||||
|
margin-bottom: 50rpx;
|
||||||
|
}
|
||||||
|
.popup-status-box {
|
||||||
|
width: 120rpx;
|
||||||
|
height: 120rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
margin: 0 auto;
|
||||||
|
margin-bottom: 50rpx;
|
||||||
|
.popup-status {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,159 @@
|
|||||||
|
import classnames from "classnames";
|
||||||
|
import { Component } from "react";
|
||||||
|
|
||||||
|
import {
|
||||||
|
Block,
|
||||||
|
View,
|
||||||
|
Image,
|
||||||
|
Text,
|
||||||
|
Button,
|
||||||
|
PageMeta,
|
||||||
|
ScrollView,
|
||||||
|
} from "@tarojs/components";
|
||||||
|
|
||||||
|
import { Popup } from "@antmjs/vantui";
|
||||||
|
|
||||||
|
import "./popup.less";
|
||||||
|
import "./popup-status.less";
|
||||||
|
|
||||||
|
/** props
|
||||||
|
* isLarge 是否大尺寸
|
||||||
|
* isShow 是否显示
|
||||||
|
* isClose 右上角关闭图标
|
||||||
|
* title 弹窗标题
|
||||||
|
* content 弹窗内容
|
||||||
|
* confirmButtonText 确定按钮
|
||||||
|
* textAlgin 文本对齐 left right center
|
||||||
|
* type: 1注册
|
||||||
|
* @confirm 关闭回调
|
||||||
|
*/
|
||||||
|
export default class PopupStatus extends Component<any, any> {
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
this.state = {
|
||||||
|
name: "图标状态提示组件",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
async onLoad() {}
|
||||||
|
componentDidMount() {}
|
||||||
|
|
||||||
|
componentWillUnmount() {}
|
||||||
|
|
||||||
|
componentDidShow() {}
|
||||||
|
|
||||||
|
componentDidHide() {}
|
||||||
|
|
||||||
|
async initData() {}
|
||||||
|
|
||||||
|
onClose = () => {
|
||||||
|
this.props.close();
|
||||||
|
};
|
||||||
|
|
||||||
|
onConfirm = () => {
|
||||||
|
this.props.confirm();
|
||||||
|
};
|
||||||
|
|
||||||
|
onClickStop = (e) => {
|
||||||
|
e.stopPropagation();
|
||||||
|
};
|
||||||
|
|
||||||
|
onTouchMove = () => {
|
||||||
|
return true;
|
||||||
|
};
|
||||||
|
|
||||||
|
render() {
|
||||||
|
let {
|
||||||
|
title,
|
||||||
|
content,
|
||||||
|
confirmButtonText,
|
||||||
|
textAlgin,
|
||||||
|
isShow,
|
||||||
|
isClose,
|
||||||
|
isBtn,
|
||||||
|
isLarge,
|
||||||
|
myClassName,
|
||||||
|
zIndex,
|
||||||
|
type,
|
||||||
|
} = this.props;
|
||||||
|
if (!zIndex) zIndex = 10001;
|
||||||
|
return (
|
||||||
|
<Block>
|
||||||
|
<PageMeta pageStyle={isShow ? "overflow: hidden;" : ""} />
|
||||||
|
<Popup
|
||||||
|
className={myClassName}
|
||||||
|
overlayStyle={`width: 100vw;padding: 0;z-index: ${
|
||||||
|
zIndex || 10001
|
||||||
|
} !important`}
|
||||||
|
show={isShow}
|
||||||
|
closeOnClickOverlay={false}
|
||||||
|
round
|
||||||
|
onClick={this.onClickStop}
|
||||||
|
>
|
||||||
|
{isClose && (
|
||||||
|
<View
|
||||||
|
className="at-icon at-icon-close common-close"
|
||||||
|
onClick={this.onClose}
|
||||||
|
></View>
|
||||||
|
)}
|
||||||
|
<View
|
||||||
|
className={classnames("common-box", {
|
||||||
|
"common-large": isLarge,
|
||||||
|
})}
|
||||||
|
catchMove
|
||||||
|
>
|
||||||
|
{title && (
|
||||||
|
<View
|
||||||
|
className={classnames(
|
||||||
|
"common-popup-title",
|
||||||
|
"opup-status-title",
|
||||||
|
{
|
||||||
|
"margin-samll": isLarge,
|
||||||
|
}
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
{title}
|
||||||
|
</View>
|
||||||
|
)}
|
||||||
|
<View className="common-popup-content-box">
|
||||||
|
<ScrollView
|
||||||
|
scrollY
|
||||||
|
className={classnames("common-popup-content", {
|
||||||
|
"text-left": textAlgin === "left",
|
||||||
|
"text-right": textAlgin === "right",
|
||||||
|
"text-center": textAlgin === "center",
|
||||||
|
})}
|
||||||
|
>
|
||||||
|
<View className="popup-status-box">
|
||||||
|
{type === "success" && (
|
||||||
|
<Image
|
||||||
|
className="popup-status"
|
||||||
|
src={require("../../img/status/success.png")}
|
||||||
|
mode="aspectFit"
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
{type === "error" && (
|
||||||
|
<Image
|
||||||
|
className="popup-status"
|
||||||
|
src={require("../../img/status/error.png")}
|
||||||
|
mode="aspectFit"
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</View>
|
||||||
|
{content}
|
||||||
|
</ScrollView>
|
||||||
|
</View>
|
||||||
|
|
||||||
|
{isBtn && (
|
||||||
|
<View className="alert-popup-btns">
|
||||||
|
<Button className="alert-popup-btn" onClick={this.onConfirm}>
|
||||||
|
{confirmButtonText}
|
||||||
|
</Button>
|
||||||
|
</View>
|
||||||
|
)}
|
||||||
|
</View>
|
||||||
|
</Popup>
|
||||||
|
</Block>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 150 KiB After Width: | Height: | Size: 80 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
Loading…
Reference in New Issue