修改

2025-01-06 15:33:27 +08:00 · 2025-01-06 15:33:27 +08:00 · 6198994ead
commit 6198994ead
parent 7144a67989
16 changed files with 955 additions and 348 deletions
--- a/android/app/src/main/AndroidManifest.xml
+++ b/android/app/src/main/AndroidManifest.xml
@ -27,6 +27,7 @@
        android:icon="@mipmap/ic_launcher"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:allowBackup="false"
+        
        android:theme="@style/LaunchTheme">
        
        <meta-data
@ -35,6 +36,7 @@
            
        <activity
            android:name=".MainActivity"
+            android:screenOrientation="portrait"
            android:label="@string/app_name"
            android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|screenSize|smallestScreenSize|uiMode"
            android:launchMode="singleTask"
--- a/package-lock.json
+++ b/package-lock.json
@ -17,6 +17,7 @@
        "@react-navigation/bottom-tabs": "^6.4.0",
        "@react-navigation/native": "^6.1.18",
        "@react-navigation/stack": "^6.3.8",
+        "@shm-open/react-native-wechat": "^1.3.0",
        "@ui-kitten/components": "^5.3.1",
        "@ui-kitten/eva-icons": "^5.3.1",
        "axios": "^1.7.7",
@ -5390,6 +5391,26 @@
        "join-component": "^1.1.0"
      }
    },
+    "node_modules/@shm-open/react-native-wechat": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmmirror.com/@shm-open/react-native-wechat/-/react-native-wechat-1.3.0.tgz",
+      "integrity": "sha512-CMCWU/EIudAD/ZKNbA+HQA0hlKr/uapQiXy2zjfn2UIN0vxoKVcqXCqv+OQYiBppgknkeBBOKZsr3XJxjnlGOQ==",
+      "dependencies": {
+        "@shm-open/utilities": "^1.7.0"
+      },
+      "peerDependencies": {
+        "react-native": "*"
+      }
+    },
+    "node_modules/@shm-open/utilities": {
+      "version": "1.13.3",
+      "resolved": "https://registry.npmmirror.com/@shm-open/utilities/-/utilities-1.13.3.tgz",
+      "integrity": "sha512-PCjPqHAoSF3I9X5arn4kAIl8LSvH3qitzNvrsmXzmT3dz4320tY6zerSJNqlhi3jx/Cuhc674m7S957CP/0jJw==",
+      "dependencies": {
+        "fast-deep-equal": "^3.1.3",
+        "hoist-non-react-statics": "^3.3.2"
+      }
+    },
    "node_modules/@sideway/address": {
      "version": "4.1.5",
      "resolved": "https://registry.npmmirror.com/@sideway/address/-/address-4.1.5.tgz",
--- a/package.json
+++ b/package.json
@ -19,6 +19,7 @@
    "@react-navigation/bottom-tabs": "^6.4.0",
    "@react-navigation/native": "^6.1.18",
    "@react-navigation/stack": "^6.3.8",
+    "@shm-open/react-native-wechat": "^1.3.0",
    "@ui-kitten/components": "^5.3.1",
    "@ui-kitten/eva-icons": "^5.3.1",
    "axios": "^1.7.7",
--- a/src/components/DeviceControl.tsx
+++ b/src/components/DeviceControl.tsx
@ -137,6 +137,7 @@ const DeviceControl: React.FC<DeviceControlProps> = ({ defaultDevice, onDeviceUp

        try {
            const response = await apiService.ring(defaultDevice.sn);
+            // const response = { code: 500 };
            console.log('响铃API响应:', response);

            if (response.code != 200) {
@ -295,6 +296,8 @@ const DeviceControl: React.FC<DeviceControlProps> = ({ defaultDevice, onDeviceUp
                            </>
                        ) : (
                            <>
+                                {/* <Spinner size='small' status='warning' /> */}
+                                <View style={{width:rpx(8),height:rpx(8)}}></View>
                                <Text style={[styles.statusText, styles.connected]}>连接成功</Text>
                                <Image
                                    source={{ uri: 'https://lxnapi.ccttiot.com/bike/img/static/udli5LEVfOT62XShk99A' }}
@ -359,8 +362,9 @@ const styles = StyleSheet.create({
        height: rpx(60),
        backgroundColor: '#FFFFFF',
        borderRadius: rpx(30),
-        flexDirection: 'row',
+        flexDirection: 'row', // 确保是行方向
        alignItems: 'center',
+        justifyContent: 'space-between', // 从左开始对齐
        paddingHorizontal: rpx(20),
        shadowColor: '#000',
        shadowOffset: {
@ -386,7 +390,7 @@ const styles = StyleSheet.create({
    bluetooth: {
        width: rpx(60),
        height: rpx(60),
-        marginLeft: 'auto',
+        marginLeft: rpx(10),
    },
    Bind_type: {
        flexDirection: 'row',
--- a/src/navigation/HomeStack.tsx
+++ b/src/navigation/HomeStack.tsx
@ -21,6 +21,9 @@ import deviceDetailSet from '../views/device/deviceDetailSet';
 import HelpCenterPage from '../views/user/HelpCenterPage';
 import XmlRenderPage from '../views/user/XmlRenderPage';
 import Feedback from '../views/user/feedback';
+import FranchisePage from '../views/user/FranchisePage';
+import StoreCenter from '../views/user/StoreCenter';
+import Upuser from '../views/user/Upuser';
 const Stack = createStackNavigator<HomeStackParamList>();

 const createScreenOptions = (title: string): StackNavigationOptions => {
@ -70,6 +73,13 @@ export default function HomeStackNavigator({ navigation, route }: Props) {
          headerShown: false,
        }}
      />
+      <Stack.Screen 
+        name="Upuser" 
+        component={Upuser}
+        options={{
+          headerShown: false,
+        }}
+      />
      <Stack.Screen 
        name="ShareDetailScreen" 
        component={ShareDetailScreen}
@ -77,6 +87,20 @@ export default function HomeStackNavigator({ navigation, route }: Props) {
          headerShown: false,
        }}
      />
+      <Stack.Screen 
+        name="StoreCenter" 
+        component={StoreCenter}
+        options={{
+          headerShown: false,
+        }}
+      />
+      <Stack.Screen 
+        name="FranchisePage" 
+        component={FranchisePage}
+        options={{
+          headerShown: false,
+        }}
+      />
      <Stack.Screen 
        name="TestBule" 
        component={TestBule}
--- a/src/navigation/types.tsx
+++ b/src/navigation/types.tsx
@ -34,6 +34,9 @@ export type HomeStackParamList = {
  HelpCenterPage: undefined;
  XmlRenderPage: undefined;
  Feedback: undefined;
+  FranchisePage: undefined;
+  StoreCenter: undefined;
+  Upuser: undefined;
 };

 // 导航属性类型
--- a/src/utils/api.ts
+++ b/src/utils/api.ts
@ -134,6 +134,8 @@ export const apiService = {
  getQiniuToken: () => api.get('/common/qiniu/uploadInfo'),
  // 获取车型
  getModelList: () => api.get('/appVerify/modelList'),
+  // 获取车型图片
+  getmodelPicList: () => api.get('/app/modelPic/list'),
  // 获取帮助中心分类
  getClassifyList: () => api.get('/app/classify/list'),
  // 获取帮助中心文章列表
--- a/src/views/Home/MiniMap.tsx
+++ b/src/views/Home/MiniMap.tsx
@ -38,7 +38,7 @@ const MiniMap: React.FC<DeviceControlProps> = ({ defaultDevice }) => {
    const diff = now - timestamp;
    
    if (diff < 60000) { // 小于1分钟
-      return '刚刚';
+      return '刚刚刚'
    } else if (diff < 3600000) { // 小于1小时
      return `${Math.floor(diff / 60000)}分钟前`;
    } else if (diff < 86400000) { // 小于24小时
@ -144,6 +144,7 @@ const styles = StyleSheet.create({
    flexDirection: 'row',
    alignItems: 'center',
    marginBottom: rpx(8),
+    flexWrap: 'wrap', // 确保内容可以换行
  },
  cont_left_top_txt: {
    fontWeight: '500',
@ -155,6 +156,10 @@ const styles = StyleSheet.create({
    fontWeight: '400',
    fontSize: rpx(24),
    color: '#808080',
+    flexShrink: 1,
+    flexWrap: 'wrap',
+    // 增加宽度以确保显示完整文本
+    maxWidth: '80%',
  },
  cont_left_bot: {
    fontWeight: '400',
--- a/src/views/Home/NormaIndex.tsx
+++ b/src/views/Home/NormaIndex.tsx
@ -215,19 +215,16 @@ const NormaIndex: React.FC = () => {
                                <Text style={styles.KmLi_tits1}>剩余里程</Text>
                            </View>
                        </View>
-                        {/* <View style={styles.KmLi}>
-                            <View style={styles.KmLi_top}>
-                                <Text style={styles.titTxt}>110</Text>
-                                <Text style={styles.KmLi_tits}>km</Text>
-                            </View>
-                            <View style={styles.KmLi_bot}>
-                                <Image
-                                    source={{ uri: 'https://lxnapi.ccttiot.com/bike/img/static/uDg93bCzlPFiFBtS71Al' }}
-                                    style={{ width: rpx(32), height: rpx(32) }}
-                                />
-                                <Text style={styles.KmLi_tits1}>剩余里程</Text>
-                            </View>
-                        </View> */}
+                        <View style={styles.KmLi}>
+                        <Image
+            source={{
+                uri: defaultDevice?.onlineStatus == 1
+                    ? 'https://lxnapi.ccttiot.com/bike/img/static/urtPj1qV49sm3s2jpVrp'
+                    : 'https://lxnapi.ccttiot.com/bike/img/static/ujjpXsitJOPzW06nFf3U'
+            }}
+            style={{ width: rpx(60), height: rpx(60), marginLeft: rpx(5) }}
+        />
+                        </View>
                    </View>
                    <DeviceControl defaultDevice={defaultDevice} onDeviceUpdate={handleDeviceUpdate} />
                 
--- a/src/views/ProfileScreen.jsx
+++ b/src/views/ProfileScreen.jsx
@ -15,6 +15,7 @@ import { useAuth } from '../context/AuthContext';
 import { rpx } from '../utils/rpx';
 import { apiService } from '../utils/api'; 
 import { auth } from '../utils/auth';
+
 const ProfileScreen = () => {
  const navigation = useNavigation();
  const { setIsLoggedIn } = useAuth();
@ -42,9 +43,7 @@ const ProfileScreen = () => {

  const handleLogout = async () => {
    try {
-      await auth.removeToken(); // 清除本地存储的 token
-      // setIsLoggedIn(false); // 更新登录状态
-      // 不需要手动导航，因为 AppNavigator 会根据 isLoggedIn 自动处理导航
+      await auth.removeToken();
      getUserInfo();
    } catch (error) {
      console.error('退出登录失败:', error);
@ -58,7 +57,6 @@ const ProfileScreen = () => {
    >
      <ScrollView style={styles.scrollView}>
        <View style={styles.page}>
-          {/* 头部区域 */}
          <View style={styles.header}>
            <View style={styles.headerLeft}>
              <Image
@ -85,20 +83,8 @@ const ProfileScreen = () => {
            </TouchableOpacity>
          </View>

-          {/* 管理与服务区域 */}
          <Text style={styles.tit}>管理与服务</Text>
          <View style={styles.content}>
-            {/* <TouchableOpacity 
-              style={styles.item}
-              onPress={() => navigation.navigate('OrderList')}
-            >
-              <Image
-                source={{ uri: 'https://lxnapi.ccttiot.com/bike/img/static/uVEbrRDbZXvELwK73KAi' }}
-                style={styles.itemIcon}
-              />
-              <Text style={styles.itemText}>我的订单</Text>
-            </TouchableOpacity> */}
-
            <TouchableOpacity 
              style={styles.item}
              onPress={() => navigation.navigate('HelpCenterPage')}
@ -121,34 +107,46 @@ const ProfileScreen = () => {
              <Text style={styles.itemText}>意见和反馈</Text>
            </TouchableOpacity>

-            {/* {userInfo.isAuthentication === false && (
-              <TouchableOpacity 
+            {(userInfo.userType === '01' || userInfo.userType === '00') && userInfo.status !== '2' && (
+              <TouchableOpacity  
                style={styles.item}
-                onPress={() => navigation.navigate('IdVerification')}
+                onPress={() => navigation.navigate('FranchisePage')}
              >
                <Image
-                  source={{ uri: 'https://lxnapi.ccttiot.com/bike/img/static/unrltNyYYRXUutaqtuJY' }}
+                  source={{ uri: 'https://lxnapi.ccttiot.com/bike/img/static/uRSuZdHyAvTpM8JV7qod' }}
                  style={styles.itemIcon}
                />
-                <Text style={styles.itemText}>实名认证</Text>
+                <Text style={styles.itemText}>升级商户（车辆出租）</Text>
              </TouchableOpacity>
-            )} */}
+            )}

-            {/* {userInfo.userType === '02' && (
-              <TouchableOpacity 
-                style={[styles.item, styles.lastItem]}
-                onPress={() => navigation.navigate('MerchantPortal')}
+            {(userInfo.userType === '01' || userInfo.userType === '00') && userInfo.status === '2' && (
+              <TouchableOpacity  
+                style={styles.item}
+                onPress={() => navigation.navigate('Upuser')}
              >
                <Image
-                  source={{ uri: 'https://lxnapi.ccttiot.com/bike/img/static/u1SsqJYSQ8jTK9PkhFtF' }}
+                  source={{ uri: 'https://lxnapi.ccttiot.com/bike/img/static/uRSuZdHyAvTpM8JV7qod' }}
                  style={styles.itemIcon}
                />
-                <Text style={styles.itemText}>商户端</Text>
+                <Text style={styles.itemText}>升级商户(审核中)</Text>
              </TouchableOpacity>
-            )} */}
+            )}
+
+            {userInfo.userType === '02' && (
+              <TouchableOpacity  
+                style={styles.item}
+                onPress={() => navigation.navigate('StoreCenter')}
+              >
+                <Image
+                  source={{ uri: 'https://lxnapi.ccttiot.com/bike/img/static/u8APNZv3jTaaqQKPH27G' }}
+                  style={styles.itemIcon}
+                />
+                <Text style={styles.itemText}>商户中心</Text>
+              </TouchableOpacity>
+            )}
          </View>

-          {/* 退出登录按钮 */}
          <Button
            style={styles.logoutButton}
            status='danger'
--- a/src/views/device/deviceDetailSet.tsx
+++ b/src/views/device/deviceDetailSet.tsx
@ -173,7 +173,7 @@ const deviceDetailSet = () => {
    };

    const fetchModelList = async () => {
-        const response = await apiService.getModelList();
+        const response = await apiService.getmodelPicList();
        if (response.code == 200) {
            setModelData(response.data);
            const brands = Array.from(new Set(response.data.map(item => item.brandName)));
--- a/src/views/device/deviceMap.tsx
+++ b/src/views/device/deviceMap.tsx
@ -114,13 +114,13 @@ const DeviceMap = () => {
  // 跳转到高德地图
  const openAMap = async () => {
    if (!deviceLocation) return;
-
+  
    const url = Platform.select({
-      android: `androidamap://navi?sourceApplication=appname&lat=${deviceLocation.latitude}&lon=${deviceLocation.longitude}&dev=0&style=2`,
-      ios: `iosamap://navi?sourceApplication=appname&lat=${deviceLocation.latitude}&lon=${deviceLocation.longitude}&dev=0&style=2`,
+      android: `androidamap://route/plan/?sourceApplication=appname&dlat=${deviceLocation.latitude}&dlon=${deviceLocation.longitude}&dname=车辆位置&dev=0&t=0`,
+      ios: `iosamap://path?sourceApplication=appname&dlat=${deviceLocation.latitude}&dlon=${deviceLocation.longitude}&dname=车辆位置&dev=0&t=0`,
    });
-    const fallbackUrl = `https://uri.amap.com/navigation?to=${deviceLocation.longitude},${deviceLocation.latitude},目的地&mode=car&coordinate=gaode`;
-
+    const fallbackUrl = `https://uri.amap.com/navigation?to=${deviceLocation.longitude},${deviceLocation.latitude},车辆位置&mode=car&coordinate=gaode`;
+  
    try {
      const supported = await Linking.canOpenURL(url);
      if (supported) {
@ -133,7 +133,6 @@ const DeviceMap = () => {
      await Linking.openURL(fallbackUrl);
    }
  };
-
  // 格式化时间
  const formatTime = (timeString: string) => {
    if (!timeString) return '12:00';
@ -198,7 +197,7 @@ const DeviceMap = () => {
      <View style={styles.bottomCard}>
        <View style={styles.addressInfo}>
          <Text style={styles.addressText}>
-            {deviceLocation.address || '获取地址中...'}
+            {/* {deviceLocation.address || '获取地址中...'} */}
          </Text>
          <TouchableOpacity onPress={()=>{
           const response =  apiService.ring(sn);
--- a/src/views/user/FranchisePage.tsx
+++ b/src/views/user/FranchisePage.tsx
@ -0,0 +1,174 @@
+import React, { useEffect, useState } from 'react';
+import { View, StyleSheet, ActivityIndicator, Text, TouchableOpacity } from 'react-native';
+import { WebView } from 'react-native-webview';
+import { TopNavigation, TopNavigationAction, Icon, IconElement } from '@ui-kitten/components';
+import { useRoute, useNavigation } from '@react-navigation/native';
+import { apiService } from '../../utils/api';
+import { rpx } from '../../utils/rpx';
+
+const BackIcon = (props): IconElement => (
+    <Icon
+        {...props}
+        name='arrow-back'
+        fill='#000000'
+    />
+);
+
+const FranchisePage = () => {
+    const navigation = useNavigation();
+    const route = useRoute();
+    const [xmlContent, setXmlContent] = useState('');
+    const [title, setTitle] = useState('详情');
+    const [loading, setLoading] = useState(true);
+    const [isAgreed, setIsAgreed] = useState(false);
+
+    const navigateBack = () => {
+        navigation.goBack();
+    };
+
+    const BackAction = () => (
+        <TopNavigationAction
+            icon={BackIcon}
+            onPress={navigateBack}
+        />
+    );
+
+    const replaceImgWithImage = (content) => {
+        content = content.replace(/&nbsp;/g, '\u00A0');
+        content = content.replace(/<img([^>]*)>/g, (match, group1) => {
+            let cleanedGroup = group1.replace(/\s*\/$/, '');
+            return `<img style="width: 85vw; height: auto;" ${cleanedGroup} />`;
+        });
+        return content;
+    };
+
+    const fetchArticleById = async () => {
+        const response = await apiService.getArticleById(29);
+        console.log(response, '1111111111111');
+        const modifiedContent = replaceImgWithImage(response.data.content);
+        setXmlContent(modifiedContent);
+        setTitle(response.data.title || '详情');
+        setLoading(false);
+    }
+
+    useEffect(() => {
+        fetchArticleById();
+    }, []);
+
+    const handleApply = () => {
+        if (isAgreed) {
+            console.log('申请成为商家');
+        } else {
+            alert('请先同意协议');
+        }
+    };
+
+    return (
+        <View style={styles.container}>
+            <TopNavigation
+                title={title}
+                alignment='center'
+                accessoryLeft={BackAction}
+                style={styles.header}
+            />
+            {loading ? (
+                <ActivityIndicator size="large" color="#0000ff" style={styles.loading} />
+            ) : (
+                <WebView
+                    originWhitelist={['*']}
+                    source={{ html: xmlContent }}
+                    style={styles.webview}
+                    scalesPageToFit={false}
+                    injectedJavaScript={`
+                        const meta = document.createElement('meta');
+                        meta.setAttribute('content', 'width=device-width, initial-scale=1, maximum-scale=1');
+                        meta.setAttribute('name', 'viewport');
+                        document.getElementsByTagName('head')[0].appendChild(meta);
+                    `}
+                />
+            )}
+            <View style={styles.footer}>
+                <TouchableOpacity
+                    style={styles.agreementContainer}
+                    onPress={() => setIsAgreed(!isAgreed)}
+                >
+                    <View style={styles.checkbox}>
+                        {isAgreed && <Text style={styles.checkmark}>✓</Text>}
+                    </View>
+                    <Text style={styles.agreementText}>同意《{title}》</Text>
+                </TouchableOpacity>
+                <TouchableOpacity
+                    style={styles.applyButton}
+                    onPress={handleApply}
+                >
+                    <Text style={styles.applyButtonText}>申请成为商家</Text>
+                </TouchableOpacity>
+            </View>
+        </View>
+    );
+};
+
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+    },
+    header: {
+        backgroundColor: 'transparent',
+        elevation: 0,
+        shadowOpacity: 0,
+    },
+    webview: {
+        width: rpx(750),
+        flex: 1,
+    },
+    loading: {
+        flex: 1,
+        justifyContent: 'center',
+        alignItems: 'center',
+    },
+    footer: {
+        padding: rpx(20),
+        borderTopWidth: 1,
+        borderColor: '#ccc',
+        backgroundColor: '#fff',
+        alignItems: 'center',
+    },
+    agreementContainer: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        marginBottom: rpx(10),
+    },
+    checkbox: {
+        width: rpx(24),
+        height: rpx(24),
+        borderWidth: 1,
+        borderColor: '#000',
+        justifyContent: 'center',
+        alignItems: 'center',
+        marginRight: rpx(8),
+    },
+    checkmark: {
+        fontSize: rpx(18),
+        color: '#000',
+    },
+    agreementText: {
+        fontSize: rpx(24),
+        color: '#000',
+    },
+    applyButton: {
+        marginTop: rpx(20),
+        marginBottom: rpx(20),
+        backgroundColor: '#007bff',
+        paddingVertical: rpx(26),
+        paddingHorizontal: rpx(30),
+        borderRadius: rpx(15),
+        width: '85%',
+        alignItems: 'center',
+    },
+    applyButtonText: {
+        color: '#fff',
+        fontSize: rpx(32),
+    },
+});
+
+export default FranchisePage;
--- a/src/views/user/StoreCenter.tsx
+++ b/src/views/user/StoreCenter.tsx
@ -0,0 +1,154 @@
+import React, { useEffect, useState } from 'react';
+import { View, StyleSheet, ActivityIndicator, Text, TouchableOpacity, Image } from 'react-native';
+import { WebView } from 'react-native-webview';
+import { TopNavigation, TopNavigationAction, Icon, IconElement } from '@ui-kitten/components';
+import { useRoute, useNavigation } from '@react-navigation/native';
+import { apiService } from '../../utils/api';
+import { rpx } from '../../utils/rpx';
+
+import * as WeChat from "@shm-open/react-native-wechat"
+// 初始化微信 SDK
+
+
+const BackIcon = (props): IconElement => (
+    <Icon
+        {...props}
+        name='arrow-back'
+        fill='#000000'
+    />
+);
+
+const FranchisePage = () => {
+    const navigation = useNavigation();
+    const route = useRoute();
+    const [xmlContent, setXmlContent] = useState('');
+    const [title, setTitle] = useState('详情');
+    const [loading, setLoading] = useState(true);
+
+    const navigateBack = () => {
+        navigation.goBack();
+    };
+
+    const BackAction = () => (
+        <TopNavigationAction
+            icon={BackIcon}
+            onPress={navigateBack}
+        />
+    );
+
+    const replaceImgWithImage = (content) => {
+        content = content.replace(/&nbsp;/g, '\u00A0');
+        content = content.replace(/<img([^>]*)>/g, (match, group1) => {
+            let cleanedGroup = group1.replace(/\s*\/$/, '');
+            return `<img style="width: 85vw; height: auto;" ${cleanedGroup} />`;
+        });
+        return content;
+    };
+    const openWeChatMiniProgram = async () => {
+        WeChat.registerApp('wxe51234567890', "");  //注册wechat  
+
+        const flag = await WeChat.isWXAppInstalled()  //判断是否安装微信
+
+        if (!flag) {
+            // return Alert.alert('提示', '您还未安装微信客户端');
+            
+        }
+
+        let MiniProgram = {
+            userName: '	wx8a05cf95418a6859',  //不是小程序的AppID 是原始ID
+            path: 'pages/pagehome/pagehome',  //要跳转到小程序的那一页
+            miniprogramType: 0,  //小程序类型   RELEASE = 0,TEST = 1,PREVIEW = 2
+        }
+
+        await WeChat.openMiniprogram(MiniProgram)  //开始跳转至微信小程序
+
+    };
+    const fetchArticleById = async () => {
+        const response = await apiService.getArticleById(30);
+        console.log(response, '1111111111111');
+        const modifiedContent = replaceImgWithImage(response.data.content);
+        setXmlContent(modifiedContent);
+        setTitle(response.data.title || '详情');
+        setLoading(false);
+    }
+
+    useEffect(() => {
+        fetchArticleById();
+    }, []);
+
+    return (
+        <View style={styles.container}>
+            <TopNavigation
+                title={title}
+                alignment='center'
+                accessoryLeft={BackAction}
+                style={styles.header}
+            />
+            {loading ? (
+                <ActivityIndicator size="large" color="#0000ff" style={styles.loading} />
+            ) : (
+                <WebView
+                    originWhitelist={['*']}
+                    source={{ html: xmlContent }}
+                    style={styles.webview}
+                    scalesPageToFit={false}
+                    injectedJavaScript={`
+                        const meta = document.createElement('meta');
+                        meta.setAttribute('content', 'width=device-width, initial-scale=1, maximum-scale=1');
+                        meta.setAttribute('name', 'viewport');
+                        document.getElementsByTagName('head')[0].appendChild(meta);
+                    `}
+                />
+            )}
+            <TouchableOpacity
+                style={styles.floatingButton}
+                onPress={openWeChatMiniProgram}
+            >
+                <Image
+                    source={{ uri: 'https://lxnapi.ccttiot.com/bike/img/static/uJsh6S6UmCJgnMs5MqPG' }}
+                    style={styles.floatingImage}
+                />
+                <Text style={styles.floatingText}>跳转到小程序</Text>
+            </TouchableOpacity>
+        </View>
+    );
+};
+
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+    },
+    header: {
+        backgroundColor: 'transparent',
+        elevation: 0,
+        shadowOpacity: 0,
+    },
+    webview: {
+        width: rpx(750),
+        flex: 1,
+    },
+    loading: {
+        flex: 1,
+        justifyContent: 'center',
+        alignItems: 'center',
+    },
+    floatingButton: {
+        position: 'absolute',
+        right: rpx(20),
+        bottom: rpx(200),
+        backgroundColor: 'rgba(0, 0, 0, 0.5)',
+        borderRadius: rpx(25),
+        padding: rpx(10),
+        alignItems: 'center',
+    },
+    floatingImage: {
+        width: rpx(50),
+        height: rpx(50),
+    },
+    floatingText: {
+        color: '#ffffff',
+        marginTop: rpx(5),
+    },
+});
+
+export default FranchisePage;
--- a/src/views/user/Upuser.tsx
+++ b/src/views/user/Upuser.tsx
@ -0,0 +1,65 @@
+import React from 'react';
+import { View, StyleSheet, ImageBackground, Image } from 'react-native';
+import { TopNavigation, TopNavigationAction, Icon, Text } from '@ui-kitten/components';
+import { rpx } from '../../utils/rpx';
+
+const BackIcon = (props) => (
+  <Icon {...props} name='arrow-back' />
+);
+
+const Upuser = ({ navigation }) => {
+
+  const navigateBack = () => {
+    navigation.goBack();
+  };
+
+  const BackAction = () => (
+    <TopNavigationAction icon={BackIcon} onPress={navigateBack} />
+  );
+
+  return (
+    <ImageBackground 
+      source={{ uri: 'https://lxnapi.ccttiot.com/bike/img/static/uYRs7Cv2Pbp95w3KjGO3' }} 
+      style={styles.container}
+    >
+      <TopNavigation
+        title='系统审核中'
+        alignment='center'
+        accessoryLeft={BackAction}
+      />
+      <View style={styles.content}>
+        <Image
+          source={{ uri: 'https://lxnapi.ccttiot.com/bike/img/static/uVnIDwcwQP7oo12PeYVJ' }}
+          style={styles.image}
+        />
+        <Text category='h6' style={styles.message}>
+          系统正在审核你的信息中，请稍后查看。
+        </Text>
+      </View>
+    </ImageBackground>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    width: '100%',
+    height: '100%',
+  },
+  content: {
+    flex: 1,
+    paddingTop: rpx(200),
+    alignItems: 'center',
+  },
+  image: {
+    width: rpx(440),
+    height: rpx(340),
+  },
+  message: {
+    marginTop: rpx(40),
+    textAlign: 'center',
+    color: '#333',
+  },
+});
+
+export default Upuser;
--- a/yarn.lock
+++ b/yarn.lock