非IOT打卡
blak-kong
2 years ago
parent
ffa68186c6
commit
fa4a1bcecd
@ -0,0 +1,64 @@
|
||||
.site-popup-content-box {
|
||||
margin: 0;
|
||||
}
|
||||
// .van-popup {
|
||||
// background-color: transparent;
|
||||
// }
|
||||
.site-close {
|
||||
position: absolute;
|
||||
right: 36rpx;
|
||||
top: 36rpx;
|
||||
color: #fff;
|
||||
font-size: 36rpx;
|
||||
z-index: 100009;
|
||||
background-color: #ababab;
|
||||
border-radius: 50%;
|
||||
padding: 8rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.site-popup-btn {
|
||||
position: absolute;
|
||||
bottom: 100rpx;
|
||||
left: calc(50% - 120rpx);
|
||||
width: 240rpx;
|
||||
height: 70rpx;
|
||||
line-height: 70rpx;
|
||||
font-size: 28rpx;
|
||||
text-align: center;
|
||||
border: 1rpx solid #000;
|
||||
border-radius: 40rpx;
|
||||
background-color: #000;
|
||||
color: #fff;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.upload-tips-common-box {
|
||||
padding: 50rpx 20rpx 44rpx 20rpx;
|
||||
.tips-message {
|
||||
margin-top: 30rpx;
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
line-height: 45rpx;
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
|
||||
.popup-btn-one {
|
||||
display: flex;
|
||||
margin-top: 60rpx;
|
||||
justify-content: center;
|
||||
.popup-btn {
|
||||
width: 270rpx;
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
text-align: center;
|
||||
border: 1rpx solid #000;
|
||||
border-radius: 45rpx;
|
||||
color: #fff;
|
||||
background-color: #000;
|
||||
font-family: PingFang SC;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,200 @@
|
||||
import classnames from "classnames";
|
||||
import Taro from "@tarojs/taro";
|
||||
import { Component } from "react";
|
||||
|
||||
import {
|
||||
Block,
|
||||
View,
|
||||
Image,
|
||||
Text,
|
||||
Button,
|
||||
PageMeta,
|
||||
Swiper,
|
||||
SwiperItem,
|
||||
} from "@tarojs/components";
|
||||
|
||||
import { Popup } from "@antmjs/vantui";
|
||||
|
||||
import "./popup.less";
|
||||
import "./popup-instrument-upload-tips.less";
|
||||
import "./fade.css";
|
||||
|
||||
import { go, goJump } from "../../utils/traoAPI";
|
||||
|
||||
/*** props
|
||||
* isLarge 是否大尺寸
|
||||
* isShow 是否显示
|
||||
* data 数据
|
||||
* @confirm 关闭回调
|
||||
* ***/
|
||||
export default class PopupInstrumentUploadTips extends Component<any, any> {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
name: "打卡介绍弹窗",
|
||||
current: 0,
|
||||
toRight: false,
|
||||
isClick: false,
|
||||
};
|
||||
}
|
||||
|
||||
async onLoad() {}
|
||||
componentDidMount() {}
|
||||
|
||||
componentWillUnmount() {}
|
||||
|
||||
componentDidShow() {}
|
||||
|
||||
componentDidHide() {}
|
||||
|
||||
initData = () => {
|
||||
if (this.props.siteData) {
|
||||
let arr = JSON.parse(JSON.stringify(this.props.siteData));
|
||||
this.setState({ siteList: arr });
|
||||
}
|
||||
};
|
||||
|
||||
onClose = () => {
|
||||
this.props.close();
|
||||
};
|
||||
|
||||
onClickStop = (e) => {
|
||||
e.stopPropagation();
|
||||
};
|
||||
|
||||
onChange(event) {
|
||||
const current = event.detail.current;
|
||||
const { current: curCurrent } = this.state;
|
||||
const { siteData } = this.props;
|
||||
if (curCurrent + 2 === siteData.length && current + 1 === siteData.length) {
|
||||
this.setState({ toRight: true });
|
||||
}
|
||||
this.setState({ current });
|
||||
}
|
||||
onClickSwiperItem(item) {
|
||||
goJump(item);
|
||||
}
|
||||
onFinish(event) {
|
||||
const { current } = event.detail;
|
||||
const { toRight, isClick } = this.state;
|
||||
const { siteData } = this.props;
|
||||
if (current === siteData.length - 1) {
|
||||
if (toRight || isClick) {
|
||||
this.setState({ toRight: false, isClick: false });
|
||||
} else {
|
||||
// this.toHomePage();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
onPrev = async () => {
|
||||
let { current } = this.state;
|
||||
this.setState({ current: current - 1 });
|
||||
};
|
||||
onNext = async () => {
|
||||
let { current } = this.state;
|
||||
|
||||
if (current === this.props.data.length) {
|
||||
this.onClose();
|
||||
} else {
|
||||
this.setState({ current: current + 1 });
|
||||
}
|
||||
};
|
||||
|
||||
render() {
|
||||
let { isShow, data, isLarge, title } = this.props;
|
||||
let { current } = this.state;
|
||||
|
||||
return (
|
||||
<Block>
|
||||
<PageMeta pageStyle={isShow ? "overflow: hidden;" : ""} />
|
||||
<Popup
|
||||
style="background-color: #fff;"
|
||||
show={isShow}
|
||||
closeOnClickOverlay={false}
|
||||
round
|
||||
overlayStyle="width: 100vw;padding: 0;"
|
||||
onClick={this.onClickStop}
|
||||
>
|
||||
<View
|
||||
className="at-icon at-icon-close site-close"
|
||||
onClick={this.onClose}
|
||||
></View>
|
||||
<View className={classnames("common-box upload-tips-common-box")}>
|
||||
<View className="site-popup-content-box">
|
||||
<Swiper
|
||||
className="absolutely"
|
||||
style="width: 600rpx;height: 720rpx"
|
||||
current={current}
|
||||
onChange={this.onChange.bind(this)}
|
||||
onAnimationFinish={this.onFinish.bind(this)}
|
||||
duration={800}
|
||||
indicatorDots={false}
|
||||
indicatorColor="#999"
|
||||
indicatorActiveColor="#333"
|
||||
disableTouch={true} // 禁止滑动
|
||||
>
|
||||
{data.map((item, index) => {
|
||||
return (
|
||||
<SwiperItem
|
||||
className="absolutely"
|
||||
onClick={this.onClickSwiperItem.bind(this, item)}
|
||||
key={"swiper_" + index}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
width: "100%",
|
||||
height: "600rpx",
|
||||
}}
|
||||
>
|
||||
<Image
|
||||
className="cover"
|
||||
src={item.file}
|
||||
mode="aspectFit"
|
||||
></Image>
|
||||
</View>
|
||||
<View className="tips-message">
|
||||
{item.message}
|
||||
{item.message}
|
||||
{item.message}
|
||||
{item.message}
|
||||
</View>
|
||||
</SwiperItem>
|
||||
);
|
||||
})}
|
||||
</Swiper>
|
||||
</View>
|
||||
|
||||
<View>
|
||||
{data.length === 1 && (
|
||||
<View className="popup-btn-one">
|
||||
<Button className="popup-btn" onClick={this.onClose}>
|
||||
知道了
|
||||
</Button>
|
||||
</View>
|
||||
)}
|
||||
{data.length > 1 && current === 0 && (
|
||||
<View className="popup-btn-one">
|
||||
<Button className="popup-btn" onClick={this.onPrev}>
|
||||
下一步
|
||||
</Button>
|
||||
</View>
|
||||
)}
|
||||
{data.length > 1 && (
|
||||
<View className="common-popup-btns">
|
||||
<Button className="common-popup-btn2" onClick={this.onPrev}>
|
||||
{current > 0 && current < data.length - 1 && "上一步"}
|
||||
</Button>
|
||||
<Button className="common-popup-btn2" onClick={this.onNext}>
|
||||
{current > 0 && current < data.length - 1 && "下一步"}
|
||||
{current > 0 && current === data.length - 1 && "知道了"}
|
||||
</Button>
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
</View>
|
||||
</Popup>
|
||||
</Block>
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,25 @@
|
||||
import Taro from "@tarojs/taro";
|
||||
import { createSlice } from "@reduxjs/toolkit";
|
||||
|
||||
// 设备连接蓝牙
|
||||
const deviceInfoReducer = createSlice({
|
||||
name: "deviceinfo", // store的名字
|
||||
initialState: {
|
||||
bluetoothInfo: {
|
||||
deviceId: "",
|
||||
servicesuuid: "",
|
||||
characteristicsuuid0: "",
|
||||
characteristicsuuid1: "",
|
||||
characteristicId: "",
|
||||
},
|
||||
},
|
||||
reducers: {
|
||||
setDeviceInfo(state, { payload }) {
|
||||
console.log("payload", payload);
|
||||
state = JSON.parse(JSON.stringify(payload));
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
export const { setDeviceInfo } = deviceInfoReducer.actions;
|
||||
export default deviceInfoReducer.reducer;
|
||||
Loading…
Reference in New Issue