|
|
@@ -0,0 +1,355 @@
|
|
|
+import Buttons from "@/components/basic/Buttons";
|
|
|
+import { delSession } from "@/services/common";
|
|
|
+import { clear, getInfo, getPerm, logout, uploadPerm } from "@/services/user";
|
|
|
+import { View, Text, Image, Switch } from "@tarojs/components";
|
|
|
+import Taro, { useDidShow, usePullDownRefresh, useShareAppMessage } from "@tarojs/taro";
|
|
|
+import { useDispatch, useSelector } from "react-redux";
|
|
|
+import './Profile.scss'
|
|
|
+import Box from "@/components/layout/Box";
|
|
|
+import { BoxType, NaviBarTitleShowType, TemplateType } from "@/utils/types";
|
|
|
+import Layout from "@/components/layout/layout";
|
|
|
+import { useTranslation } from "react-i18next";
|
|
|
+import TableCell from "@/components/layout/TableCell";
|
|
|
+import { useEffect, useState } from "react";
|
|
|
+import { jumpPage } from "@/features/trackTimeDuration/hooks/Common";
|
|
|
+import Tabbar from "@/components/navigation/TabBar";
|
|
|
+import { getInfoSuccess, updateDebug } from "@/store/user";
|
|
|
+import TitleView from "@/features/trackTimeDuration/components/TitleView";
|
|
|
+import showAlert from "@/components/basic/Alert";
|
|
|
+import { kIsAndroid, kIsIOS, rpxToPx } from "@/utils/tools";
|
|
|
+import dayjs from "dayjs";
|
|
|
+
|
|
|
+let useNavigation, SwitchRN;
|
|
|
+if (process.env.TARO_ENV == 'rn') {
|
|
|
+ useNavigation = require("@react-navigation/native").useNavigation
|
|
|
+ SwitchRN = require('react-native').Switch
|
|
|
+}
|
|
|
+
|
|
|
+export default function Page() {
|
|
|
+ const dispatch = useDispatch();
|
|
|
+ const { t } = useTranslation()
|
|
|
+ const user = useSelector((state: any) => state.user);
|
|
|
+ const [switchOn, setSwitchOn] = useState(false)
|
|
|
+ const [triggered, setTriggered] = useState(true)
|
|
|
+ const [memberAlert, setMemberAlert] = useState(global.memberAlert)
|
|
|
+ const [baseDeviceTime, setBaseDeviceTime] = useState(false)
|
|
|
+ const accessObj = useSelector((state: any) => state.access);
|
|
|
+
|
|
|
+ let navigation;
|
|
|
+ if (useNavigation) {
|
|
|
+ navigation = useNavigation()
|
|
|
+ }
|
|
|
+
|
|
|
+ useEffect(() => {
|
|
|
+ if (process.env.TARO_ENV == 'weapp') {
|
|
|
+ var status = Taro.getStorageSync('isDebug')
|
|
|
+ setSwitchOn(status)
|
|
|
+ }
|
|
|
+ getPermissions()
|
|
|
+
|
|
|
+ if (process.env.TARO_ENV == 'rn') {
|
|
|
+ let Purchases = require("react-native-purchases").default
|
|
|
+ if (kIsIOS) {
|
|
|
+ Purchases.configure({
|
|
|
+ apiKey: 'appl_FNFYDLwHZlXzqrKJFlErWXUHGwx',
|
|
|
+ appUserID: user.id
|
|
|
+ })
|
|
|
+ }
|
|
|
+ else if (kIsAndroid) {
|
|
|
+ Purchases.configure({
|
|
|
+ apiKey: 'goog_cyJSYOsnZpNqsUbCsHSdhqQdQwe',
|
|
|
+ appUserID: user.id
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }, [])
|
|
|
+
|
|
|
+ if (process.env.TARO_ENV == 'weapp') {
|
|
|
+ useShareAppMessage((e) => {
|
|
|
+ return {
|
|
|
+ title: t('share.title'),
|
|
|
+ path: 'pages/clock/Clock'
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ async function getCustomInfo() {
|
|
|
+ // if (process.env.TARO_ENV == 'rn') {
|
|
|
+ // let Purchases = require("react-native-purchases").default
|
|
|
+ // try {
|
|
|
+ // const customerInfo = await Purchases.getCustomerInfo();
|
|
|
+ // console.log('customer info', customerInfo)
|
|
|
+ // // access latest customerInfo
|
|
|
+ // } catch (e) {
|
|
|
+ // console.log('customer info error', e)
|
|
|
+ // // Error fetching customer info
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ function switchChanged(e) {
|
|
|
+ setSwitchOn(e.detail.value)
|
|
|
+ Taro.setStorageSync('isDebug', e.detail.value)
|
|
|
+ global.isDebug = e.detail.value
|
|
|
+ dispatch(updateDebug({ is_debug: e.detail.value }))
|
|
|
+ }
|
|
|
+
|
|
|
+ function alertChanged(e) {
|
|
|
+ setMemberAlert(e.detail.value)
|
|
|
+ global.memberAlert = e.detail.value
|
|
|
+ Taro.setStorage({
|
|
|
+ key: 'memberAlert',
|
|
|
+ data: e.detail.value
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ function baseDeviceChanged(e) {
|
|
|
+ setBaseDeviceTime(e)
|
|
|
+ global.baseDeviceTime = e
|
|
|
+
|
|
|
+ uploadPerm({ expire_based_on_device_time: e }).then(res => {
|
|
|
+ if (global.indexPageRefresh) {
|
|
|
+ global.indexPageRefresh()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ function getPermissions() {
|
|
|
+ getPerm().then(res => {
|
|
|
+ setBaseDeviceTime((res as any).expire_based_on_device_time)
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ useDidShow(() => {
|
|
|
+ // global.updateTab(3)
|
|
|
+ })
|
|
|
+
|
|
|
+ function reset() {
|
|
|
+ showAlert({
|
|
|
+ title: t('feature.common.modal.reset_session_title'),
|
|
|
+ content: t('feature.common.modal.reset_session_content'),
|
|
|
+ showCancel: false,
|
|
|
+ confirm: () => {
|
|
|
+ delSession({ type: 'WX_MP' })
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ function clearF() {
|
|
|
+ showAlert({
|
|
|
+ title: t('feature.common.modal.deluser_title'),
|
|
|
+ content: t('feature.common.modal.deluser_content'),
|
|
|
+ showCancel: true,
|
|
|
+ confirm: () => {
|
|
|
+ dispatch(clear() as any);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ function tapProfile(e) {
|
|
|
+ if (process.env.TARO_ENV == 'weapp') {
|
|
|
+ e.stopPropagation()
|
|
|
+ }
|
|
|
+ if (user.isLogin) {
|
|
|
+ jumpPage('/pages/account/ProfileSetting', 'ProfileSetting', navigation)
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ jumpPage('/pages/account/ChooseAuth', 'ChooseAuth', navigation)
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ function tapBalance(e) {
|
|
|
+ if (user.isLogin) {
|
|
|
+ jumpPage('/pages/store/product_list', 'ProductList', navigation)
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ jumpPage('/pages/account/ChooseAuth', 'ChooseAuth', navigation)
|
|
|
+ if (process.env.TARO_ENV == 'weapp') {
|
|
|
+ e.stopPropagation()
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ function goSetting(e) {
|
|
|
+ console.log('apple')
|
|
|
+ jumpPage('/pages/account/Setting', 'Setting', navigation)
|
|
|
+ if (process.env.TARO_ENV == 'weapp' && e) {
|
|
|
+ e.stopPropagation()
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ usePullDownRefresh(() => {
|
|
|
+ refresh()
|
|
|
+ })
|
|
|
+
|
|
|
+ function refresh() {
|
|
|
+ setTriggered(true)
|
|
|
+ getInfo().then(res => {
|
|
|
+ console.log(res)
|
|
|
+ Taro.stopPullDownRefresh()
|
|
|
+ dispatch(getInfoSuccess(res))
|
|
|
+ setTriggered(false)
|
|
|
+ }).catch(e => {
|
|
|
+ Taro.stopPullDownRefresh()
|
|
|
+ setTriggered(false)
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ function headerView() {
|
|
|
+ return <TitleView title={t('page.more.title')} showAddBtn={false}>
|
|
|
+ </TitleView>
|
|
|
+ }
|
|
|
+
|
|
|
+ function memberdesc() {
|
|
|
+ if (!accessObj.access) {
|
|
|
+ return ''
|
|
|
+ }
|
|
|
+
|
|
|
+ switch (accessObj.access.member.subscription_status) {
|
|
|
+ case 'INITIAL':
|
|
|
+ case 'INACTIVE':
|
|
|
+ case 'INACTIVE_EXPIRED':
|
|
|
+ return 'Unlimited premium access to Pro features forever.';
|
|
|
+ case 'ACTIVE':
|
|
|
+ return t('page.more.member_desc', { time: time_formate(accessObj.access.member.expire) })
|
|
|
+ case 'ACTIVE_RENEWING':
|
|
|
+ return `Your membership will renew on ${time_formate(accessObj.access.member.renewal)}.`
|
|
|
+ case 'ACTIVE_EXPIRING':
|
|
|
+ return `Your membership is expiring soon on ${time_formate(accessObj.access.member.expire)}.`
|
|
|
+
|
|
|
+ }
|
|
|
+ if (accessObj.access.member.type == 'NON_CONSUMABLE') {
|
|
|
+ return 'Unlimited premium access to Pro features forever.'
|
|
|
+ }
|
|
|
+ if (accessObj.access.member.type == 'AUTO_RENEW') {
|
|
|
+ return `Your membership will automatically renew on ${time_formate(accessObj.access.member.expire)}.`
|
|
|
+ // return 'Premium access to Pro features during membership.'
|
|
|
+ }
|
|
|
+ return t('page.more.member_desc', { time: time_formate(accessObj.access.member.expire) })
|
|
|
+ }
|
|
|
+
|
|
|
+ function isMember() {
|
|
|
+ console.log('aaaa')
|
|
|
+ if (!user.isLogin || !accessObj || !accessObj.access) {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ console.log(accessObj.access)
|
|
|
+ switch (accessObj.access.member.subscription_status) {
|
|
|
+ case 'INITIAL':
|
|
|
+ case 'INACTIVE':
|
|
|
+ case 'INACTIVE_EXPIRED':
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ console.log('bbbbb')
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+
|
|
|
+ function time_formate(timestamp) {
|
|
|
+ if (global.language == 'en') {
|
|
|
+ return dayjs(timestamp).format('MMM D HH:mm')
|
|
|
+ }
|
|
|
+
|
|
|
+ return dayjs(timestamp).format('YYYY年MM月DD日 HH:mm')
|
|
|
+ }
|
|
|
+
|
|
|
+ function detail() {
|
|
|
+ return <View className="container">
|
|
|
+
|
|
|
+ <Box>
|
|
|
+ <View className="profile_card" onClick={tapProfile}>
|
|
|
+ <View className="avatar" style={{
|
|
|
+ opacity: user.isLogin ? 1 : 0.4,
|
|
|
+ background: user.isLogin ? 'transparent' : '#fff'
|
|
|
+ }}>
|
|
|
+ {
|
|
|
+ user.isLogin ? <Image src={user.avatar} className="avatar" mode="aspectFill" style={{
|
|
|
+ background: user.isLogin ? 'transparent' : '#fff'
|
|
|
+ }} /> : <Image src={require('@/assets/images/user.png')} className="avatar_placeholder" />
|
|
|
+ }
|
|
|
+ </View>
|
|
|
+ <Text className="nickname">{user.isLogin ? user.nickname : t('page.more.un_login')}</Text>
|
|
|
+ </View>
|
|
|
+ </Box>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ <Box>
|
|
|
+ {
|
|
|
+ !isMember() ? <View className="balance" onClick={tapBalance}>
|
|
|
+ <Text className="title">{t('page.more.stone')}</Text>
|
|
|
+ <Text className="desc" style={{ height: process.env.TARO_ENV == 'weapp' ? rpxToPx(32) : rpxToPx(64) }}>{t('page.more.stone_desc')}</Text>
|
|
|
+ </View> :
|
|
|
+ <View className="balance" onClick={tapBalance}>
|
|
|
+ <Text className="title">{t('page.more.pro_member')}</Text>
|
|
|
+ <Text className="desc">{memberdesc()}</Text>
|
|
|
+ </View>
|
|
|
+ }
|
|
|
+
|
|
|
+ </Box>
|
|
|
+ {
|
|
|
+ user.isLogin && process.env.TARO_ENV == 'rn' && <View onClick={goSetting}>
|
|
|
+ <TableCell title={t('page.more.setting')} showArrow={true} showMarginBottom={true} onClick={goSetting}></TableCell>
|
|
|
+ </View>
|
|
|
+ }
|
|
|
+ {
|
|
|
+ user.isLogin && process.env.TARO_ENV == 'weapp' && <TableCell title={t('page.more.setting')} showArrow={true} showMarginBottom={true} onClick={goSetting}></TableCell>
|
|
|
+ }
|
|
|
+
|
|
|
+ {
|
|
|
+ user.isLogin && user.test_user && <View>
|
|
|
+ <View className="cell_top" onClick={clearF}>
|
|
|
+ <Text className="cell_title">user_id</Text>
|
|
|
+ <Text className="cell_value">{user.id.substring(0, 6)}***{user.id.substring(user.id.length - 10, user.id.length)}</Text>
|
|
|
+ <Image className="cell_arrow" src={require('@/assets/images/arrow3.png')} />
|
|
|
+ </View>
|
|
|
+ <View className="cell_line" style={{ marginLeft: rpxToPx(46), marginRight: rpxToPx(46) }}></View>
|
|
|
+ <View className="cell_center" onClick={reset}>
|
|
|
+ <Text className="cell_title">session</Text>
|
|
|
+ <Text className="cell_value">{t('page.more.reset_session')}</Text>
|
|
|
+ <Image className="cell_arrow" src={require('@/assets/images/arrow3.png')} />
|
|
|
+ </View>
|
|
|
+ <View className="cell_line" style={{ marginLeft: rpxToPx(46), marginRight: rpxToPx(46) }}></View>
|
|
|
+ <View className="cell_center">
|
|
|
+ <Text className="cell_title">member alert</Text>
|
|
|
+ <Switch checked={memberAlert} onChange={alertChanged} />
|
|
|
+ </View>
|
|
|
+ <View className="cell_line" style={{ marginLeft: rpxToPx(46), marginRight: rpxToPx(46) }}></View>
|
|
|
+ <View className="cell_center">
|
|
|
+ <Text className="cell_title">expire based on device time</Text>
|
|
|
+ {
|
|
|
+ process.env.TARO_ENV == 'rn' ? <SwitchRN value={baseDeviceTime} onChange={(e) => { baseDeviceChanged(e.nativeEvent.value) }} /> : <Switch checked={baseDeviceTime} onChange={(e) => { baseDeviceChanged(e.detail.value) }} />
|
|
|
+ }
|
|
|
+
|
|
|
+ </View>
|
|
|
+ <View className="cell_line" style={{ marginLeft: rpxToPx(46), marginRight: rpxToPx(46) }}></View>
|
|
|
+ <View className="cell_bottom">
|
|
|
+ <Text className="cell_title">{t('page.more.debug_mode')}</Text>
|
|
|
+ <Switch checked={switchOn} onChange={switchChanged} />
|
|
|
+ </View>
|
|
|
+
|
|
|
+ </View>
|
|
|
+ }
|
|
|
+ <View style={{ height: 40 }}></View>
|
|
|
+
|
|
|
+ </View>
|
|
|
+ }
|
|
|
+
|
|
|
+ return <View>
|
|
|
+ <Layout title={t('page.more.title')}
|
|
|
+ titleShowStyle={NaviBarTitleShowType.scrollToShow}
|
|
|
+ type={TemplateType.customHeader}
|
|
|
+ header={headerView()}
|
|
|
+ triggered={triggered}
|
|
|
+ refresh={refresh}
|
|
|
+ showPullToRefresh={true}
|
|
|
+ >
|
|
|
+ {
|
|
|
+ detail()
|
|
|
+ }
|
|
|
+ </Layout>
|
|
|
+ <Tabbar index={3} />
|
|
|
+ </View>
|
|
|
+}
|
