合并

src/app.config.ts

@@ -2,11 +2,6 @@ export default {
   pages: [
     'pages/index/index',
     'pages/user/index',
-    'pages/searchList/searchList',
-    'pages/searchList/hightSearchList',
-    'pages/searchList/search',
-    'pages/classList/index',
-    'pages/details/index',
   ],
   window: {
     backgroundTextStyle: 'light',
@@ -34,4 +29,38 @@ export default {
     'backgroundColor': '#fff',
     'borderStyle': 'white'
   },
+  subPackages: [
+    {
+      root: "pages/search",
+      pages: [
+        "index"
+      ]
+    },
+    {
+      root: "pages/classList",
+      pages: [
+        "index"
+      ]
+    },
+    {
+      root: "pages/details",
+      pages: [
+        "index"
+      ]
+    },
+    {
+      root: "pages/searchList",
+      pages: [
+        "searchList",
+        "hightSearchList",
+        "search"
+      ]
+    },
+    {
+      root: "pages/userEdit",
+      pages: [
+        "index"
+      ]
+    }
+  ]
 }

src/pages/user/index.config.ts

@@ -1,3 +1,4 @@
 export default {
-  navigationBarTitleText: '我的'
+  navigationBarTitleText: '我的',
+  navigationStyle: 'custom'
 }

src/pages/user/index.module.scss

@@ -1,4 +1,97 @@
 .main{
+  background-color: #F8F8F8;
+  height: 100vh;
+  .header{
+    background-image: url(https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.jj20.com%2Fup%2Fallimg%2F1113%2F052420110515%2F200524110515-2-1200.jpg&refer=http%3A%2F%2Fimg.jj20.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1652840455&t=6d2fd53931578ef6e213a929a77d059c);
+    background-size: cover;
+    height: 710px;
+    position: relative;
+    .card-main{
+      margin-top: 33%;
+    }
+  }
+  .header-card{
+    position: absolute;left: 50%;bottom: 5%;
+    transform: translateX(-50%);
+  }
+  .crad{
+      width: 702px;
+      background: rgba(255,255,255,0.95);
+      border-radius: 20px;
+      padding: 30px;
+      box-sizing: border-box;
+      box-shadow: 0px 6px 12px 0px rgba(0,0,0,0.05); 
+  }
+  .card-info{
+      display: flex;justify-content: space-between;
+      position: absolute;top: -16%;left: 0;right: 0;
+      width: 702px;
+      padding: 0 30px;
+      box-sizing: border-box;
+  }
+  .arcd-info-left{
+    display: flex;align-items: flex-end;
+  }
+  .arcd-info-left-portrait{
+      width: 170px;
+      height: 170px;
+      background: rgba(0,0,0,0.00);
+      border: 4px solid #ffffff;
+      border-radius: 50%;
+      overflow: hidden;
+  }
+  .arcd-info-left-portrait image{
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+  }
+  .arcd-info-left-desc{
+      margin-left: 24px;
+  }
+  .arcd-info-left-nickname{
+      font-size: 44px;
+      font-weight: 700;
+      color: #000000;
+  }
+  .arcd-info-left-phone{
+      font-size: 24px;
+      font-weight: 400;
+      color: #3c3c3c;
+  }
+  .card-info-right{
+      font-size: 26px;
+  }
 
-    
+  .card-main-title{
+      display: flex;justify-content: space-between;
+      align-items: center;
+      border-bottom: 2px solid #dddddd;
+      padding: 0 5px 15px;
+      box-sizing: border-box;
+  }
+  .card-main-title text{
+    font-size: 22px;
+    font-weight: 400;
+    color: #ababab;
+  }
+  .card-main-title-content{
+      display: grid;
+      grid-template-columns: repeat(5,1fr);
+  }
+  .card-main-title-content-item{
+      font-size: 24px;
+      font-weight: 400;
+      color: #3c3c3c;
+      text-align: center;
+      margin-top: 30px;
+  }
+  .card-main-title-content-item image{
+      width: 68px;
+      height: 68px;
+      border: 2px solid #cccccc;
+      margin-bottom: 5px;
+  }
+  .main-card{
+    margin: 34px auto 0;
+  }
 }

src/pages/user/index.tsx

@@ -1,13 +1,83 @@
-import { View } from '@tarojs/components'
+import { View,Image,Text } from "@tarojs/components"
-import Search from '@/components/search'
+import { memo } from "react"
 import styles  from './index.module.scss'
 
 export default () => {
-  return (
+
-    <View className={styles.main}>
+    return (
-      <View className={styles.search}>
+        <View className={styles.main}>
-        <Search disabled={true} style={{width: '263rpx'}}/>
+            <Header/>
-      </View>
+            <Main/>
-    </View>
+        </View>
-  )
+    )
 }
+
+// 头部 | 订单
+const Header = memo(()=>{
+    let menu = [{text: "待配布"},{text: "待付款"},{text: "待发货"},{text: "已发货"},{text: "已发货"}]
+    return (
+        <View className={styles.header}>
+            <View className={`${styles.crad} ${styles['header-card']}`}>
+                <View className={styles['card-info']}>
+                    <View className={styles['arcd-info-left']}>
+                        <View className={styles['arcd-info-left-portrait']}>
+                            <Image src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.jj20.com%2Fup%2Fallimg%2F1113%2F052420110515%2F200524110515-2-1200.jpg&refer=http%3A%2F%2Fimg.jj20.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1652840455&t=6d2fd53931578ef6e213a929a77d059c"/>
+                        </View>
+                        <View className={styles['arcd-info-left-desc']}>
+                            <View className={styles['arcd-info-left-nickname']}>麦兜</View>
+                            <View className={styles['arcd-info-left-phone']}>131****1132</View>
+                        </View>
+                    </View>
+                    <View className={styles['card-info-right']}>
+                        1
+                    </View>
+                </View>
+                <View className={styles['card-main']}>
+                    <View className={styles['card-main-title']}>
+                        <View>订单</View>
+                        <Text>全部</Text>
+                    </View>
+                    <View className={styles['card-main-title-content']}>
+                      {
+                        menu.map((item,index)=>{
+                          return (
+                            <View className={styles['card-main-title-content-item']}>
+                                <Image src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.jj20.com%2Fup%2Fallimg%2F1113%2F052420110515%2F200524110515-2-1200.jpg&refer=http%3A%2F%2Fimg.jj20.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1652840455&t=6d2fd53931578ef6e213a929a77d059c"/>
+                                <View>待配布</View>
+                            </View>
+                          )
+                        })
+                      }
+                        
+                    </View>
+                </View>
+            </View>
+        </View>
+    )
+})
+
+// 功能
+const Main = memo(()=>{
+    let menu = [{text: "我的收藏"},{text: "颜色对比"},{text: "分享推广"},{text: "团队邀请"}]
+    return (
+        <View className={`${styles.crad} ${styles['main-card']}`}>
+            <View className={styles['card-main']}>
+                <View style={{border: "none"}} className={styles['card-main-title']}>
+                    <View>功能</View>
+                </View>
+                <View className={styles['card-main-title-content']}>
+                    {
+                      menu.map((item,index)=>{
+                        return (
+                          <View key={index} className={styles['card-main-title-content-item']}>
+                              <Image src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.jj20.com%2Fup%2Fallimg%2F1113%2F052420110515%2F200524110515-2-1200.jpg&refer=http%3A%2F%2Fimg.jj20.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1652840455&t=6d2fd53931578ef6e213a929a77d059c"/>
+                              <View>{item.text}</View>
+                          </View>
+                        )
+                      })
+                    }
+                </View>
+            </View>
+        </View>
+    )
+})

src/pages/userEdit/index.tsx

@@ -0,0 +1,6 @@
+
+import "./index.scss"
+
+export default ()=>{
+  return "1"
+}