feat: 我的页面及相关页面文本修改

src/pages/user/about/index.scss

@@ -1,4 +1,7 @@
 .index {
-   
+}
 
-}
+.login-logo {
+  width: 130px * 2;
+  height: 160px * 2;
+}

src/pages/user/about/index.tsx

@@ -1,39 +1,54 @@
-import Flex from '@/component/flex';
-import Layout from '@/component/layout';
-import { PropsWithChildren, useContext, useMemo } from 'react';
-import { Image, View } from '@tarojs/components';
-import './index.scss'
-import ImageUtil from '@/utils/imgUtils';
-import AppContext from '@/context/appContext';
-import Label from '@/component/label';
+import Flex from "@/component/flex";
+import Layout from "@/component/layout";
+import { PropsWithChildren, useContext, useMemo } from "react";
+import { Image, View } from "@tarojs/components";
+import "./index.scss";
+import ImageUtil from "@/utils/imgUtils";
+import AppContext from "@/context/appContext";
+import Label from "@/component/label";
 
-interface IAboutProps {
-
-}
+interface IAboutProps {}
 
 const About = (props: PropsWithChildren<IAboutProps>) => {
-    const appContext = useContext(AppContext);
-    const { screenWidth } = appContext.systemInfo!;
-    const imgBackStyle = useMemo(() => {
-        return { ...ImageUtil.calculationHeight(1125 / 957, (screenWidth)), position: "relative" } as React.CSSProperties;
-    }, []);
-    return (
-        <Layout  >
-            <Flex style={{ height: "100vh" }} >
-                <View style={imgBackStyle}  >
-                    <Image className='background-image' src={require(`../../../assets/bg_aboutus@3x.png`)} />
-                    <Flex rowGap="sm" className='background-content' >
-                        <View style={{ height: 200 }} />
-                        <Flex alignItem="center" className='login-back-logo-wrap' >
-                            <Image style={{ ...ImageUtil.calculationHeight(268 / 352, 120) }} className='login-logo' src={require("@/assets/logo.png")} />
-                        </Flex>
-                    </Flex>
-                </View>
-                <Flex flex={2} />
-                <Label style={{ marginBottom: Math.max(appContext.padding.bottom, 16), textAlign: "center" }} type="secondary" >重庆甜瓜科技有限公司</Label>
+  const appContext = useContext(AppContext);
+  const { screenWidth } = appContext.systemInfo!;
+  const imgBackStyle = useMemo(() => {
+    return {
+      ...ImageUtil.calculationHeight(1125 / 957, screenWidth),
+      position: "relative",
+    } as React.CSSProperties;
+  }, []);
+  return (
+    <Layout>
+      <Flex style={{ height: "100vh" }}>
+        <View style={imgBackStyle}>
+          <Image
+            className="background-image"
+            src={require(`../../../assets/bg_aboutus@3x.png`)}
+          />
+          <Flex rowGap="sm" className="background-content">
+            <View style={{ height: 200 }} />
+            <Flex alignItem="center" className="login-back-logo-wrap">
+              <Image
+                className="login-logo"
+                src={require("@/assets/logo.png")}
+              />
             </Flex>
-        </Layout>
-    )
-}
+          </Flex>
+        </View>
+        <Flex flex={2} />
+        <Label
+          style={{
+            marginBottom: Math.max(appContext.padding.bottom, 16),
+            textAlign: "center",
+          }}
+          type="secondary"
+        >
+          贵州梵诚融资担保有限公司
+        </Label>
+      </Flex>
+    </Layout>
+  );
+};
 
-export default About;
+export default About;

src/pages/user/login/index.scss

@@ -1,31 +1,33 @@
 .login {
-    .login-back {
-        background: linear-gradient(180deg, rgba(73, 108, 242, 0.2) 0%, rgba(73, 108, 242, 0) 100%);
-        height: 100vh;
-    }
+  .login-back {
+    background: linear-gradient(
+      180deg,
+      rgba(73, 108, 242, 0.2) 0%,
+      rgba(73, 108, 242, 0) 100%
+    );
+    height: 100vh;
+  }
 
-    .login-logo {
-        width: 134px*2;
-        height: 176px*2;
-    }
-
-    .login-aggrement{
-        color: $primary-color;
-    }
+  .login-logo {
+    width: 130px * 2;
+    height: 160px * 2;
+  }
 
+  .login-aggrement {
+    color: $primary-color;
+  }
 }
-.icon-title{
-    position: relative;
-    .icon-back{
-        position: absolute;
-        bottom: 40%;
-        left: 5%;
-        display: inline-block;
-        width: 20px;
-        height: 20px;
-        border-top: 4px solid black;
-        border-left: 4px solid black;
-        transform: rotate(-45deg);
-    }
-
+.icon-title {
+  position: relative;
+  .icon-back {
+    position: absolute;
+    bottom: 40%;
+    left: 5%;
+    display: inline-block;
+    width: 20px;
+    height: 20px;
+    border-top: 4px solid black;
+    border-left: 4px solid black;
+    transform: rotate(-45deg);
+  }
 }

src/pages/user/mine/index.scss

@@ -1,36 +1,144 @@
 .mine {
-    .mine-avatar {
-        width: 128px;
-        height: 128px;
-    }
-
-    .mine-menu {
-        padding: 24px 16PX;
-
-        .mine-menu-wrap {
-            height: 172px;
-            background-color: #F9F9FF;
-            width: 100%;
-            border: none;
-            border-radius: 0;
-            box-shadow: none;
-            color: #000000;
-            font-weight: 400;
-            &::after{
-                border: none;
-            }
-        }
-
-        .mine-menu-icon {
-            width: 60px;
-            height: 60px;
-        }
-    }
-
-    .mine-item-icon {
+  height: 100vh;
+  background-color: #f3f4f8;
+
+  .mine-apply-panel {
+    background-color: #fff;
+    box-sizing: border-box;
+    padding: 32px 40px;
+    border-radius: 16px;
+    margin: 0 auto;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+
+    .mine-apply-panel-title {
+      font-size: 28px;
+      color: #14172f;
+      font-weight: 500;
+    }
+
+    .mine-apply-panel-money {
+      font-size: 80px;
+      color: #14172f;
+      font-weight: 500;
+    }
+
+    .mine-apply-panel-button {
+      font-size: 32px;
+      font-weight: 500;
+      color: #fff;
+      background-color: #007aff;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      border-radius: 50px;
+      height: 80px;
+      padding: 0 44px;
+    }
+
+    .mine-apply-panel-tip {
+      font-size: 24px;
+      color: #818aa4;
+    }
+
+    .split-char {
+      width: 3px;
+      height: 30px;
+      background-color: #818aa4;
+    }
+  }
+
+  .mine-tools-panel-title {
+    font-size: 34px;
+    color: #14172f;
+    font-weight: 500;
+    margin: 20px 0;
+  }
+  .mine-tools-panel {
+    width: 100%;
+    box-sizing: border-box;
+    border-radius: 16px;
+    padding: 0 36px;
+    background-color: #fff;
+    margin: 0 auto;
+
+    .mine-tools-item {
+      display: flex;
+      justify-content: flex-start;
+      text-align: left;
+      align-items: center;
+      width: 100%;
+      height: 112px;
+      padding: 0 12px;
+      box-sizing: border-box;
+      display: flex;
+      background-color: transparent;
+      border: none;
+      box-shadow: none;
+
+      &::after {
+        border: none;
+      }
+      &:not(:last-child) {
+        border-bottom: 1px solid #f2f2f2;
+      }
+
+      .mine-tools-item-icon {
         width: 48px;
         height: 48px;
-        padding-right: 24px;
+        margin-right: 20px;
+      }
+      .mine-tools-item-title {
+        flex-grow: 1;
+        font-size: 30px;
+        color: #14172f;
+      }
+
+      .icon-arrow {
+        width: 40px;
+        height: 40px;
+      }
+    }
+  }
+
+  .mine-image-wechat-official {
+    aspect-ratio: auto;
+    height: 180px;
+    width: 100%;
+  }
+
+  .mine-avatar {
+    width: 128px;
+    height: 128px;
+  }
+
+  .mine-menu {
+    padding: 24px 16px;
+
+    .mine-menu-wrap {
+      height: 172px;
+      background-color: #f9f9ff;
+      width: 100%;
+      border: none;
+      border-radius: 0;
+      box-shadow: none;
+      color: #000000;
+      font-weight: 400;
+      &::after {
+        border: none;
+      }
+    }
+
+    .mine-menu-icon {
+      width: 60px;
+      height: 60px;
     }
+  }
 
-}
+  .mine-item-icon {
+    width: 48px;
+    height: 48px;
+    padding-right: 24px;
+  }
+}

src/pages/user/mine/index.tsx

@@ -1,83 +1,239 @@
-import Flex from '@/component/flex';
-import Label from '@/component/label';
-import Layout from '@/component/layout';
-import Padding, { EdgeInsets } from '@/component/padding';
-import SizeBox from '@/component/sizeBox';
-import AppContext from '@/context/appContext';
-import ImageUtil from '@/utils/imgUtils';
-import { Image, View } from '@tarojs/components';
-import { PropsWithChildren, useContext } from 'react';
-import './index.scss'
-import { Cell } from "@taroify/core"
-import { Arrow } from "@taroify/icons"
-import useStore from '@/hooks/useRedux';
-import RouteUtil from '@/utils/routeUtil';
-import Taro from '@tarojs/taro';
-import Button from '@/component/button';
+import Flex from "@/component/flex";
+import UserApi from "@/apis/userApi";
+import APPConfig from "@/config";
+import { useRequest } from "ahooks";
+import Label from "@/component/label";
+import Layout from "@/component/layout";
+import Padding, { EdgeInsets } from "@/component/padding";
+import SizeBox from "@/component/sizeBox";
+import AppContext from "@/context/appContext";
+import ImageUtil from "@/utils/imgUtils";
+import { Image, View, Text, Button as TaroButton } from "@tarojs/components";
+import { PropsWithChildren, useContext } from "react";
+import "./index.scss";
+import { Cell } from "@taroify/core";
+import { Arrow } from "@taroify/icons";
+import useStore from "@/hooks/useRedux";
+import RouteUtil from "@/utils/routeUtil";
+import UserHelper from "@/helper/userHelper";
+import Taro from "@tarojs/taro";
+import Button from "@/component/button";
 
-interface IMineProps {
-
-}
+interface IMineProps {}
 
 const Mine = (props: PropsWithChildren<IMineProps>) => {
-    const { screenSize } = useContext(AppContext);
-    const userInfo = useStore(p => p.userInfo);
-    return (
-        <Layout className='mine' bottomBarIndex={1} >
-            <View style={{ ...ImageUtil.calculationHeight(750 / 328, screenSize.width), position: "relative" }} >
-                <Image src={require('@/assets/icon_mine_back.png')} className="background-image" />
-                <Flex justifyContent="flex-end" className='background-content' >
-                    <Padding padding={EdgeInsets.symmetric({ horizontal: 32 })} >
-                        <Flex columnGap={32} direction="row" alignItem="center" >
-                            <Image src={require('@/assets/icon_mine_avatar.png')} className="mine-avatar" />
-                            <Label bold >
-                                {
-                                    userInfo ?
-                                        `HI，${userInfo.userMobile}` :
-                                        "点击此处登录"
-                                }
-
-                            </Label>
-                        </Flex>
-                    </Padding>
-                </Flex>
-            </View>
-            <SizeBox height={16} />
-            <Flex direction="row" className='mine-menu' >
-                <Flex onClick={() => {
-                    // https://huirong.bicredit.xin/
-                    RouteUtil.toWebViewPage({ url: "https://h5.bicredit.xin/view/webapp/business-cooperation.html" })
-                }} columnGap="sm" direction="row" alignItem="center" justifyContent="center" flex={1} className='mine-menu-wrap' >
-                    <Label>商务合作</Label>
-                    <Image src={require('@/assets/icon_mine_business.png')} className="mine-menu-icon" />
-                </Flex>
-                <SizeBox width={16} />
-                <Flex flex={1} >
-                    <Button className='mine-menu-wrap' open-type="contact" session-from="sessionFrom">
-                        <Flex columnGap="sm" direction="row" alignItem="center" justifyContent="center" style={{ height: "100%" }} flex={1} >
-                            在线客服
-                            <Image src={require('@/assets/icon_mine_service.png')} className="mine-menu-icon" />
-                        </Flex>
-
-                    </Button>
-                </Flex>
-
-
+  const appContext = useContext(AppContext);
+  const { screenSize } = useContext(AppContext);
+  const { statusBarHeight } = appContext.systemInfo!;
+  const userInfo = useStore((p) => p.userInfo);
+  const indexInfoResult = useRequest(() => {
+    return UserApi.getIndexInfoUsingPost({
+      params: { appId: APPConfig.APPID },
+    }).toData();
+  });
+  return (
+    <Layout className="mine" bottomBarIndex={1}>
+      <SizeBox height={statusBarHeight}></SizeBox>
+      <SizeBox height={72}></SizeBox>
+      <View
+        className="mine-apply-panel"
+        style={{
+          ...ImageUtil.calculationHeight(
+            750 / 324,
+            appContext.systemInfo!.screenWidth - 32
+          ),
+          position: "relative",
+        }}
+      >
+        <Text className="mine-apply-panel-title">最高可申请（元）</Text>
+        <Flex justifyContent="space-between" alignItem="center" direction="row">
+          <Text className="mine-apply-panel-money">200,000</Text>
+          <Button
+            className="mine-apply-panel-button"
+            onClick={() => {
+              UserHelper.afterLogin({
+                pop: false,
+                callback: async () => {
+                  indexInfoResult.data &&
+                    RouteUtil.toWebViewPage({
+                      url: indexInfoResult.data.link,
+                    });
+                },
+              });
+            }}
+          >
+            立即申请
+          </Button>
+        </Flex>
+        <Flex
+          justifyContent="flex-start"
+          alignItem="center"
+          direction="row"
+          columnGap={12}
+          className="mine-apply-panel-tip"
+        >
+          <Text>年利率7.2%起</Text>
+          <View className="split-char"></View>
+          <Text>期限3-36个月</Text>
+          <View className="split-char"></View>
+          <Text>持牌放款</Text>
+        </Flex>
+      </View>
+      {/* <View
+        style={{
+          ...ImageUtil.calculationHeight(750 / 328, screenSize.width),
+          position: "relative",
+        }}
+        onClick={() => {
+          UserHelper.afterLogin({
+            pop: false,
+            callback: async () => {},
+          });
+        }}
+      >
+        <Flex justifyContent="flex-end" className="background-content">
+          <Padding padding={EdgeInsets.symmetric({ horizontal: 32 })}>
+            <Flex columnGap={32} direction="row" alignItem="center">
+              <Image
+                src={require("@/assets/icon_mine_avatar.png")}
+                className="mine-avatar"
+              />
+              <Label bold>
+                {userInfo ? `HI，${userInfo.userMobile}` : "点击此处登录"}
+              </Label>
+            </Flex>
+          </Padding>
+        </Flex>
+      </View> */}
+      <SizeBox height={16} />
+      <Padding padding={EdgeInsets.symmetric({ horizontal: 32 })}>
+        <View className="mine-tools-panel-title">我的工具</View>
+        <View className="mine-tools-panel">
+          <TaroButton
+            open-type="contact"
+            session-from="sessionFrom"
+            className="mine-tools-item"
+          >
+            <Image
+              src={require("@/assets/new-edition/icon-service.svg")}
+              className="mine-tools-item-icon"
+            />
+            <Text className="mine-tools-item-title">在线客服</Text>
+            <Image
+              src={require("@/assets/new-edition/icon-arrow-right.svg")}
+              className="icon-arrow"
+            />
+          </TaroButton>
+          <View
+            className="mine-tools-item"
+            onClick={() => {
+              RouteUtil.push("/pages/user/setting/index");
+            }}
+          >
+            <Image
+              src={require("@/assets/new-edition/icon-setting.svg")}
+              className="mine-tools-item-icon"
+            />
+            <View className="mine-tools-item-title">系统设置</View>
+            <Image
+              src={require("@/assets/new-edition/icon-arrow-right.svg")}
+              className="icon-arrow"
+            />
+          </View>
+        </View>
+      </Padding>
+      <SizeBox height={20} />
+      <Padding padding={EdgeInsets.symmetric({ horizontal: 32 })}>
+        <Image
+          onClick={() => {
+            // https://huirong.bicredit.xin/
+            RouteUtil.toWebViewPage({
+              url: "https://mp.weixin.qq.com/s/X0OAslHaFjld6Zf2ifVC5A",
+            });
+          }}
+          src={require("@/assets/new-edition/wechat-official.png")}
+          className="mine-image-wechat-official"
+        />
+      </Padding>
+      {/* <Flex direction="row" className="mine-menu">
+        <Flex
+          onClick={() => {
+            // https://huirong.bicredit.xin/
+            RouteUtil.toWebViewPage({
+              url: "https://h5.bicredit.xin/view/webapp/business-cooperation.html",
+            });
+          }}
+          columnGap="sm"
+          direction="row"
+          alignItem="center"
+          justifyContent="center"
+          flex={1}
+          className="mine-menu-wrap"
+        >
+          <Label>商务合作</Label>
+          <Image
+            src={require("@/assets/icon_mine_business.png")}
+            className="mine-menu-icon"
+          />
+        </Flex>
+        <SizeBox width={16} />
+        <Flex flex={1}>
+          <Button
+            className="mine-menu-wrap"
+            open-type="contact"
+            session-from="sessionFrom"
+          >
+            <Flex
+              columnGap="sm"
+              direction="row"
+              alignItem="center"
+              justifyContent="center"
+              style={{ height: "100%" }}
+              flex={1}
+            >
+              在线客服
+              <Image
+                src={require("@/assets/icon_mine_service.png")}
+                className="mine-menu-icon"
+              />
             </Flex>
-            <SizeBox height={16} />
-            <Cell size="large"
-                onClick={() => {
-                    RouteUtil.push("/pages/user/aggrement/index")
-                }}
-                icon={<Image src={require('@/assets/icon_mine_aggrement.png')} className="mine-item-icon" />} title="用户协议" rightIcon={<Arrow />}  ></Cell>
-            <SizeBox height={8} />
-            {/* <Cell size="large" icon={<Image src={require('@/assets/icon_mine_upgrade.png')} className="mine-item-icon" />} title="检查更新" rightIcon={<Arrow />}  ></Cell>
+          </Button>
+        </Flex>
+      </Flex> */}
+      <SizeBox height={16} />
+      {/* <Cell
+        size="large"
+        onClick={() => {
+          RouteUtil.push("/pages/user/aggrement/index");
+        }}
+        icon={
+          <Image
+            src={require("@/assets/icon_mine_aggrement.png")}
+            className="mine-item-icon"
+          />
+        }
+        title="用户协议"
+        rightIcon={<Arrow />}
+      ></Cell>
+      <SizeBox height={8} /> */}
+      {/* <Cell size="large" icon={<Image src={require('@/assets/icon_mine_upgrade.png')} className="mine-item-icon" />} title="检查更新" rightIcon={<Arrow />}  ></Cell>
             <SizeBox height={8} /> */}
-            <Cell onClick={() => {
-                RouteUtil.push("/pages/user/setting/index")
-            }} size="large" icon={<Image src={require('@/assets/icon_mine_setting.png')} className="mine-item-icon" />} title="设置" rightIcon={<Arrow />}  ></Cell>
-        </Layout>
-    )
-}
+      {/* <Cell
+        onClick={() => {
+          RouteUtil.push("/pages/user/setting/index");
+        }}
+        size="large"
+        icon={
+          <Image
+            src={require("@/assets/icon_mine_setting.png")}
+            className="mine-item-icon"
+          />
+        }
+        title="设置"
+        rightIcon={<Arrow />}
+      ></Cell> */}
+    </Layout>
+  );
+};
 
-export default Mine;
+export default Mine;