小程序隐私授权查询、规范弹窗、规范导航栏

master
blak-kong 2 years ago
parent 0c10eb610c
commit efe3f31f6c

@ -1,4 +1,5 @@
export default defineAppConfig({ export default defineAppConfig({
__usePrivacyCheck__: true,
pages: [ pages: [
'pages/index/index', 'pages/index/index',
'pages/login/login', 'pages/login/login',

@ -103,6 +103,16 @@ image {
flex-direction: column; flex-direction: column;
} }
.text-left {
text-align: left;
}
.text-right {
text-align: right;
}
.text-center {
text-align: center;
}
// 全局覆盖组件库样式 // 全局覆盖组件库样式
page { page {
--primary-color: #000; --primary-color: #000;

@ -48,6 +48,7 @@ class RegisterModal extends Component<any, any> {
Dialog_.alert({ Dialog_.alert({
title: "提示", title: "提示",
message: "暂未授权注册,请点击注册", message: "暂未授权注册,请点击注册",
theme: "round-button",
}).then((value) => { }).then((value) => {
this.resetColor(); this.resetColor();
this.goRegister(); this.goRegister();

@ -21,7 +21,9 @@
left: 0; left: 0;
right: 0; right: 0;
display: flex; display: flex;
justify-content: center; // justify-content: center;
justify-content: space-between;
align-items: center;
background: #fff; background: #fff;
z-index: 99; z-index: 99;
.logo { .logo {
@ -29,6 +31,13 @@
align-items: center; align-items: center;
width: 220rpx; width: 220rpx;
} }
.back {
width: 80rpx;
padding: 20rpx 0;
text-align: center;
color: #666;
font-size: 42rpx;
}
} }
.nav_top_padding { .nav_top_padding {

@ -4,7 +4,7 @@ import Taro from "@tarojs/taro";
import "./navbar.less"; import "./navbar.less";
import { Block, View, Text, Image, Input, Button } from "@tarojs/components"; import { Block, View, Text, Image, Input, Button } from "@tarojs/components";
import { back } from "../../utils/traoAPI";
export default class Navbar extends Component<any, any> { export default class Navbar extends Component<any, any> {
constructor(props) { constructor(props) {
super(props); super(props);
@ -33,6 +33,10 @@ export default class Navbar extends Component<any, any> {
this.setStatusBar(); this.setStatusBar();
} }
back = () => {
back();
};
setStatusBar() { setStatusBar() {
Taro.getSystemInfoAsync({ Taro.getSystemInfoAsync({
success: (res) => { success: (res) => {
@ -55,6 +59,7 @@ export default class Navbar extends Component<any, any> {
} }
render() { render() {
let { isBack } = this.props;
let { statusBarHeight, navigationBarHeight, navHeight } = this.state; let { statusBarHeight, navigationBarHeight, navHeight } = this.state;
const statusBarHeightRpx = statusBarHeight * 2; const statusBarHeightRpx = statusBarHeight * 2;
const navigationBarHeightRpx = navigationBarHeight * 2; const navigationBarHeightRpx = navigationBarHeight * 2;
@ -69,21 +74,23 @@ export default class Navbar extends Component<any, any> {
paddingTop: statusBarHeightRpx + "rpx", paddingTop: statusBarHeightRpx + "rpx",
}} }}
> >
<View className="back">
{isBack && (
<View
className="at-icon at-icon-chevron-left"
onClick={this.back}
></View>
)}
</View>
<View className="logo"> <View className="logo">
<Image src="https://oss.flossom.com/logo2.png" mode="widthFix" /> <Image src="https://oss.flossom.com/logo2.png" mode="widthFix" />
</View> </View>
<View className="back"></View>
</View> </View>
<View <View
className="nav_top_padding" className="nav_top_padding"
style={{ paddingBottom: navHeightRpx + "rpx" }} style={{ paddingBottom: navHeightRpx + "rpx" }}
></View> ></View>
{/* <View style="background:#fff;" className="nav">
<View className="nav_box">
<View className="logo">
<Image src="https://oss.flossom.com/logo2.png" mode="widthFix" />
</View>
</View>
</View> */}
</Block> </Block>
); );
} }

@ -0,0 +1,59 @@
.alert-box {
width: 650rpx;
// height: 800rpx;
padding: 40rpx;
padding-bottom: 80rpx;
box-sizing: border-box;
.alert-popup-title {
font-size: 36rpx;
font-weight: 700;
text-align: center;
color: #000;
}
}
.alert-popup-content-box {
margin-top: 60rpx;
}
.alert-popup-content {
font-size: 28rpx;
margin-bottom: 20rpx;
}
.alert-popup-content.is-alert {
color: #41a9fc;
text-decoration: underline;
}
.alert-popup-content.is-last {
margin-bottom: 0;
}
.alert-popup-btns {
display: flex;
margin-top: 76rpx;
justify-content: center;
}
.alert-popup-btn {
width: 480rpx;
height: 80rpx;
line-height: 80rpx;
font-size: 30rpx;
text-align: center;
border: 1rpx solid #000;
border-radius: 40rpx;
color: #fff;
background-color: #000;
}
// .alert-popup-btn:first-child {
// margin-left: 22rpx;
// background-color: transparent;
// }
// .confirm-popup-btn:last-child {
// color: #fff;
// background-color: #000;
// }

@ -0,0 +1,101 @@
import classnames from "classnames";
import { Component } from "react";
import {
Block,
View,
Text,
Image,
Input,
Button,
PageMeta,
} from "@tarojs/components";
import { Popup } from "@antmjs/vantui";
import "@antmjs/vantui/lib/popup/index.less";
import "@antmjs/vantui/lib/transition/index.less";
import "@antmjs/vantui/lib/overlay/index.less";
import "./popup-alert.less";
import { go } from "../../utils/traoAPI";
/*** props
* isShow
* title
* content
* confirmButtonText
* textAlgin left right center
* type: 1
* @confirm
* ***/
export default class PopupAlert extends Component<any, any> {
constructor(props) {
super(props);
this.state = {
name: "确认组件",
};
}
async onLoad() {}
componentDidMount() {}
componentWillUnmount() {}
componentDidShow() {}
componentDidHide() {}
async initData() {}
onConfirm = () => {
let { type } = this.props;
switch (type) {
case "1":
go("/pages/register/register");
break;
}
this.props.confirm();
};
onClickStop = (e) => {
e.stopPropagation();
};
render() {
let { title, content, confirmButtonText, textAlgin } = this.props;
return (
<Block>
<PageMeta pageStyle={this.props.isShow ? "overflow: hidden;" : ""} />
<Popup
show={this.props.isShow}
round
overlayStyle="width: 100vw;padding: 0;"
onClick={this.onClickStop}
>
<View className="alert-box">
<View className="alert-popup-title">{title}</View>
<View className="alert-popup-content-box">
<View
className={classnames("alert-popup-content", {
"text-left": textAlgin === "left",
"text-right": textAlgin === "right",
"text-center": textAlgin === "center",
})}
>
{content}
</View>
</View>
<View className="alert-popup-btns">
<Button className="alert-popup-btn" onClick={this.onConfirm}>
{confirmButtonText}
</Button>
</View>
</View>
</Popup>
</Block>
);
}
}

@ -0,0 +1,57 @@
.confirm-box {
width: 650rpx;
// height: 800rpx;
padding: 40rpx;
padding-bottom: 80rpx;
box-sizing: border-box;
.confirm-popup-title {
font-size: 36rpx;
font-weight: 700;
text-align: center;
color: #000;
}
}
.confirm-popup-content-box {
margin-top: 60rpx;
}
.confirm-popup-content {
font-size: 28rpx;
margin-bottom: 20rpx;
}
.confirm-popup-content.is-confirm {
color: #41a9fc;
text-decoration: underline;
}
.confirm-popup-content.is-last {
margin-bottom: 0;
}
.confirm-popup-btns {
display: flex;
margin-top: 76rpx;
justify-content: space-around;
}
.confirm-popup-btn {
width: 240rpx;
height: 80rpx;
line-height: 80rpx;
font-size: 30rpx;
text-align: center;
border: 1rpx solid #000;
border-radius: 40rpx;
}
.confirm-popup-btn:first-child {
margin-left: 22rpx;
background-color: transparent;
}
.confirm-popup-btn:last-child {
color: #fff;
background-color: #000;
}

@ -0,0 +1,112 @@
import classnames from "classnames";
import { Component } from "react";
import {
Block,
View,
Text,
Image,
Input,
Button,
PageMeta,
} from "@tarojs/components";
import { Popup } from "@antmjs/vantui";
// import "@antmjs/vantui/lib/index.less";
import "@antmjs/vantui/lib/popup/index.less";
import "@antmjs/vantui/lib/transition/index.less";
import "@antmjs/vantui/lib/overlay/index.less";
import "./popup-confirm.less";
/*** props
* isShow
* title
* content
* cancelButtonText
* confirmButtonText
* textAlgin left right center
* type: 1
* @confirm
* ***/
export default class PopupConfirm extends Component<any, any> {
constructor(props) {
super(props);
this.state = {
name: "确认组件",
// isShowconfirmPopup: true,
};
}
async onLoad() {}
componentDidMount() {}
componentWillUnmount() {}
componentDidShow() {
// 是否已授权隐私
// if (Taro.getStorageSync("isconfirmPopup") !== "true") {
// // this.setState({
// // showconfirmPopup: true,
// // });
// this.props.closeconfirm();
// }
}
componentDidHide() {}
async initData() {}
onClose = () => {
this.props.close();
};
onConfirm = () => {
this.props.confirm();
};
onClickStop = (e) => {
e.stopPropagation();
};
render() {
let { title, content, cancelButtonText, confirmButtonText, textAlgin } =
this.props;
return (
<Block>
<PageMeta pageStyle={this.props.isShow ? "overflow: hidden;" : ""} />
<Popup
show={this.props.isShow}
round
overlayStyle="width: 100vw;padding: 0;"
// onClose={this.onClose}
onClick={this.onClickStop}
>
<View className="confirm-box">
<View className="confirm-popup-title">{title}</View>
<View className="confirm-popup-content-box">
<View
className={classnames("alert-popup-content", {
"text-left": textAlgin === "left",
"text-right": textAlgin === "right",
"text-center": textAlgin === "center",
})}
>
{content}
</View>
</View>
<View className="confirm-popup-btns">
<Button className="confirm-popup-btn" onClick={this.onClose}>
{cancelButtonText}
</Button>
<Button className="confirm-popup-btn" onClick={this.onConfirm}>
{confirmButtonText}
</Button>
</View>
</View>
</Popup>
</Block>
);
}
}

@ -6,8 +6,9 @@
box-sizing: border-box; box-sizing: border-box;
.privacy-popup-title { .privacy-popup-title {
font-size: 36rpx; font-size: 36rpx;
font-weight: 500; font-weight: 700;
text-align: center; text-align: center;
color: #000;
} }
} }

@ -35,7 +35,6 @@ export default class PopupPrivacy extends Component<any, any> {
componentWillUnmount() {} componentWillUnmount() {}
componentDidShow() { componentDidShow() {
// console.log("isShowPrivacyPopup show", this.state);
// 是否已授权隐私 // 是否已授权隐私
// if (Taro.getStorageSync("isPrivacyPopup") !== "true") { // if (Taro.getStorageSync("isPrivacyPopup") !== "true") {
// // this.setState({ // // this.setState({
@ -70,9 +69,9 @@ export default class PopupPrivacy extends Component<any, any> {
}, },
}); });
}; };
handleAgreePrivacyAuthorization = () => { handleAgreePrivacyAuthorization = (event) => {
Taro.setStorageSync("isPrivacyPopup", "true"); Taro.setStorageSync("isPrivacyPopup", "true");
this.props.closePrivacy(); this.props.closePrivacy(); // 通知父组件关闭
}; };
onClickStop = (e) => { onClickStop = (e) => {
@ -80,7 +79,6 @@ export default class PopupPrivacy extends Component<any, any> {
}; };
render() { render() {
// let { isShowPrivacyPopup } = this.state;
return ( return (
<Block> <Block>
<PageMeta <PageMeta
@ -90,7 +88,7 @@ export default class PopupPrivacy extends Component<any, any> {
show={this.props.isShowPrivacyPopup} show={this.props.isShowPrivacyPopup}
round round
overlayStyle="width: 100vw;padding: 0;" overlayStyle="width: 100vw;padding: 0;"
onClose={this.onClose} // onClose={this.onClose}
onClick={this.onClickStop} onClick={this.onClickStop}
> >
<View className="privacy-box"> <View className="privacy-box">
@ -110,15 +108,15 @@ export default class PopupPrivacy extends Component<any, any> {
</View> </View>
</View> </View>
<View className="privacy-popup-btns"> <View className="privacy-popup-btns">
<button <Button
className="privacy-popup-btn" className="privacy-popup-btn"
onClick={this.onDisagreeTap} onClick={this.onDisagreeTap}
> >
退 退
</button> </Button>
<Button <Button
className="privacy-popup-btn" className="privacy-popup-btn"
open-type="agreePrivacyAuthorization" openType="agreePrivacyAuthorization"
onAgreePrivacyAuthorization={ onAgreePrivacyAuthorization={
this.handleAgreePrivacyAuthorization this.handleAgreePrivacyAuthorization
} }

@ -17,8 +17,7 @@ import "taro-ui/dist/style/components/button.scss"; // 按需引入
import "./entry.less"; import "./entry.less";
import "./Animista.less"; import "./Animista.less";
import "./fade.css"; import "./fade.css";
import { go } from "../../utils/traoAPI";
const app = Taro.getApp();
export default class Entry extends Component<any, any> { export default class Entry extends Component<any, any> {
constructor(props) { constructor(props) {
@ -75,6 +74,8 @@ export default class Entry extends Component<any, any> {
}; };
}); });
this.setState({ welcomeList }); this.setState({ welcomeList });
} else {
go("/pages/index/index");
} }
} }

@ -1026,20 +1026,3 @@ page {
} }
} }
} }
// .nav {
// z-index: 99;
// width: 100%;
// padding-top: 48rpx;
// background-color: #fff;
// .logo {
// width: 223rpx;
// }
// .nav_box {
// position: relative;
// display: flex;
// align-items: center;
// justify-content: center;
// height: 64rpx;
// }
// }

@ -6,22 +6,19 @@ import { Block, View, Text, Image, PageMeta, Button } from "@tarojs/components";
/*** redux ***/ /*** redux ***/
import { connect } from "react-redux"; import { connect } from "react-redux";
import { setColor, resetColor } from "../../store/features/navigation";
import { userRefresh } from "../../store/features/userInfo"; import { userRefresh } from "../../store/features/userInfo";
/*** redux end ***/ /*** redux end ***/
/** 自定义组件 **/ /** 自定义组件 **/
import AtCalendar from "../../components/calendar"; import AtCalendar from "../../components/calendar";
import PopupPrivacy from "../../components/popup/popup-privacy"; import PopupPrivacy from "../../components/popup/popup-privacy";
import PopupAlert from "../../components/popup/popup-alert";
import type CustomTabBar from "../../custom-tab-bar"; import type CustomTabBar from "../../custom-tab-bar";
import Navbar from "../../components/navbar/navbar"; import Navbar from "../../components/navbar/navbar";
import RegisterModal from "../../components/modal/registerModal/registerModal";
/** 自定义组件 **/ /** 自定义组件 **/
import { Dialog } from "@antmjs/vantui";
const Dialog_ = Dialog.createOnlyDialog();
import { GetUserMobile, RefreshWxUserInfo } from "../../utils/Interface"; import { GetUserMobile, RefreshWxUserInfo } from "../../utils/Interface";
import { setGlobalData } from "../../utils/global";
// css引入 // css引入
import "taro-ui/rn/style/components/calendar.scss"; import "taro-ui/rn/style/components/calendar.scss";
@ -56,17 +53,14 @@ class Index extends Component<any, any> {
info: {}, // 护理推荐点击参与活动的信息 info: {}, // 护理推荐点击参与活动的信息
weekinfo: undefined, weekinfo: undefined,
currentDate: dayjs().format("YYYY-MM-DD"), currentDate: dayjs().format("YYYY-MM-DD"),
isNotRegister: false, // 是否未注册
}; };
} }
async onLoad() { async onLoad() {
const menu = Taro.getMenuButtonBoundingClientRect(); const menu = Taro.getMenuButtonBoundingClientRect();
this.setState({ menu }); this.setState({ menu });
const isFirst = Taro.getStorageSync("isWelcome");
if (isFirst) {
this.RefreshWxUserInfo();
}
} }
componentDidMount() {} componentDidMount() {}
@ -76,10 +70,36 @@ class Index extends Component<any, any> {
componentDidShow() { componentDidShow() {
const tabbar = Taro.getTabBar<CustomTabBar>(this.pageCtx); const tabbar = Taro.getTabBar<CustomTabBar>(this.pageCtx);
tabbar?.setSelected(2); tabbar?.setSelected(2);
this.showInit();
} }
componentDidHide() {} componentDidHide() {}
showInit() {
const isFirst = Taro.getStorageSync("isWelcome");
if (isFirst) {
// this.RefreshWxUserInfo();
Taro.getPrivacySetting({
success: (res) => {
console.log(res); // 返回结果为: res = { needAuthorization: true/false, privacyContractName: '《xxx隐私保护指引》' }
if (res.needAuthorization) {
// 需要弹出隐私协议
const isPrivacyPopup = Taro.getStorageSync("isPrivacyPopup");
if (!isPrivacyPopup) {
// 隐私确认弹窗
this.setState({ isShowPrivacyPopup: true });
}
} else {
// 用户已经同意过隐私协议,所以不需要再弹出隐私协议,也能调用隐私接口
}
},
fail: () => {},
complete: () => {},
});
}
}
getUserInfo() {} getUserInfo() {}
RefreshWxUserInfo = async () => { RefreshWxUserInfo = async () => {
@ -89,24 +109,25 @@ class Index extends Component<any, any> {
} }
}; };
setColor = (color) => {
this.props.setColor(color);
};
resetColor = () => {
this.props.resetColor();
};
goRegister() { goRegister() {
go("/pages/register/register"); go("/pages/register/register");
} }
addNewDevice = () => { addNewDevice = () => {
if (this.isRegister()) {
// todo
}
};
// 是否已注册
isRegister() {
let mobile = Taro.getStorageSync("mobile"); let mobile = Taro.getStorageSync("mobile");
console.log("mobile", mobile);
if (!mobile) { if (!mobile) {
this.alertRegister(); this.alertRegister();
return false;
}
return true;
} }
};
showPrivacy = () => { showPrivacy = () => {
this.setState({ isShowPrivacyPopup: true }); this.setState({ isShowPrivacyPopup: true });
@ -116,18 +137,14 @@ class Index extends Component<any, any> {
this.setState({ isShowPrivacyPopup: false }); this.setState({ isShowPrivacyPopup: false });
}; };
closeAlert = () => {
this.setState({ isNotRegister: false });
};
public alertRegister = () => { public alertRegister = () => {
if (!this.props.mobile) { if (!this.props.mobile) {
this.setColor("#4C4C4C"); this.setState({ isNotRegister: true }); // 打开弹窗
setTimeout(() => { return;
Dialog_.alert({
title: "提示",
message: "暂未授权注册,请点击注册",
}).then((value) => {
this.resetColor();
this.goRegister();
});
}, 300);
} else { } else {
go("/pages/instrument/instrument"); go("/pages/instrument/instrument");
} }
@ -138,18 +155,36 @@ class Index extends Component<any, any> {
this.setState({ currentDate: value }); this.setState({ currentDate: value });
}; };
// 护理记录
toNursingRecords = () => {
this.setState({ isNotRegister: true }); // 打开弹窗
if (this.isRegister()) {
// todo
}
};
render() { render() {
let { currentDate, isShowPrivacyPopup } = this.state; let { currentDate, isShowPrivacyPopup, isNotRegister } = this.state;
return ( return (
<Block> <Block>
<Dialog_ /> {/* {isNotRegister ? <RegisterModal /> : ""} */}
<PopupAlert
isShow={isNotRegister}
title="提示"
content="暂未授权注册,请点击注册"
confirmButtonText="确定"
textAlgin="center"
type="1"
confirm={this.closeAlert}
/>
<PopupPrivacy <PopupPrivacy
isShowPrivacyPopup={isShowPrivacyPopup} isShowPrivacyPopup={isShowPrivacyPopup}
closePrivacy={this.closePrivacy} closePrivacy={this.closePrivacy}
/> />
<Navbar></Navbar> <Navbar></Navbar>
<View className="index"> <View className="index">
<View className="date-title"> <View className="date-title" onClick={this.toNursingRecords}>
<Text style={{ fontSize: "26rpx", color: "#666" }}></Text> <Text style={{ fontSize: "26rpx", color: "#666" }}></Text>
<View className="at-icon at-icon-chevron-right"></View> <View className="at-icon at-icon-chevron-right"></View>
</View> </View>
@ -203,12 +238,6 @@ const mapStateToProps = (state) => ({
mobile: state.userInfo.mobile, mobile: state.userInfo.mobile,
}); });
const mapDispatchToProps = (dispatch) => ({ const mapDispatchToProps = (dispatch) => ({
setColor(color) {
dispatch(setColor(color));
},
resetColor() {
dispatch(resetColor());
},
userRefresh(data) { userRefresh(data) {
dispatch(userRefresh(data)); dispatch(userRefresh(data));
}, },

@ -101,8 +101,9 @@ class Initiate extends Component<any, any> {
const { code } = await Taro.login(); const { code } = await Taro.login();
const { data } = await WCUserLogin({ code }); const { data } = await WCUserLogin({ code });
if (data.code === 200) { if (data.code === 200) {
setGlobalData("token", data.data.token); // setGlobalData("token", data.data.token);
// Taro.setStorageSync("mobile", data.data.mobile); Taro.setStorageSync("token", data.data.token);
Taro.setStorageSync("mobile", data.data.mobile);
this.props.setMobile(data.data.mobile); this.props.setMobile(data.data.mobile);
} }
} }

@ -1,3 +1,3 @@
export default definePageConfig({ export default definePageConfig({
navigationBarTitleText: "模板页", navigationBarTitleText: "用户信息",
}); });

@ -7,6 +7,7 @@ import formdata from "./wx-formdata/formData";
export const Ajax = (params) => { export const Ajax = (params) => {
const app = Taro.getApp(); const app = Taro.getApp();
// const domain = getGlobalData("domain")
const domain = getGlobalData("domain") || "http://192.168.10.147:80"; const domain = getGlobalData("domain") || "http://192.168.10.147:80";
// console.log("Ajaxdomain", app, domain); // console.log("Ajaxdomain", app, domain);
// Taro.showLoading({ // Taro.showLoading({
@ -15,7 +16,7 @@ export const Ajax = (params) => {
// }); // });
// 防止多次点击 // 防止多次点击
const requestUrlList = getGlobalData("requestUrlList") || []; const requestUrlList = getGlobalData("requestUrlList") || [];
const whiteList = ["/Api/MessageList"]; const whiteList = []; // 白名单
if ( if (
requestUrlList.indexOf(params.url) > -1 && requestUrlList.indexOf(params.url) > -1 &&
whiteList.indexOf(params.url) < 0 whiteList.indexOf(params.url) < 0
@ -29,7 +30,8 @@ export const Ajax = (params) => {
url: domain + params.url, url: domain + params.url,
method: params.method || "GET", method: params.method || "GET",
header: { header: {
Authorization: "Bearer " + getGlobalData("token") || "", // Authorization: "Bearer " + getGlobalData("token") || "",
Authorization: "Bearer " + Taro.getStorageSync("token"),
...params.header, ...params.header,
}, },
data: params.data, data: params.data,
@ -179,7 +181,8 @@ export const AjaxFormData = (params) => {
url: domain + params.url, url: domain + params.url,
method: params.method || "GET", method: params.method || "GET",
header: { header: {
Authorization: "Bearer " + getGlobalData("token") || "", // Authorization: "Bearer " + getGlobalData("token") || "",
Authorization: "Bearer " + Taro.getStorageSync("token"),
...params.header, ...params.header,
"content-type": params.data.contentType, "content-type": params.data.contentType,
}, },

Loading…
Cancel
Save