diff --git a/src/app.config.ts b/src/app.config.ts index 5f179da..f751595 100644 --- a/src/app.config.ts +++ b/src/app.config.ts @@ -1,10 +1,7 @@ export default { pages: [ 'pages/index/index', - 'pages/search/index', 'pages/user/index', - 'pages/searchList/index', - 'pages/details/index', ], window: { backgroundTextStyle: 'light', @@ -28,4 +25,30 @@ export default { 'backgroundColor': '#fff', 'borderStyle': 'white' }, + subPackages: [ + { + root: "pages/search", + pages: [ + "index" + ] + }, + { + root: "pages/details", + pages: [ + "index" + ] + }, + { + root: "pages/searchList", + pages: [ + "index" + ] + }, + { + root: "pages/userEdit", + pages: [ + "index" + ] + } + ] } diff --git a/src/pages/user/index.config.ts b/src/pages/user/index.config.ts index 2b0700a..c21435b 100644 --- a/src/pages/user/index.config.ts +++ b/src/pages/user/index.config.ts @@ -1,3 +1,4 @@ export default { - navigationBarTitleText: '我的' + navigationBarTitleText: '我的', + navigationStyle: 'custom' } diff --git a/src/pages/user/index.module.scss b/src/pages/user/index.module.scss index 379d769..d6abee5 100644 --- a/src/pages/user/index.module.scss +++ b/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; + } } \ No newline at end of file diff --git a/src/pages/user/index.tsx b/src/pages/user/index.tsx index f95d830..c95df26 100644 --- a/src/pages/user/index.tsx +++ b/src/pages/user/index.tsx @@ -1,13 +1,83 @@ -import { View } from '@tarojs/components' -import Search from '@/components/search' +import { View,Image,Text } from "@tarojs/components" +import { memo } from "react" import styles from './index.module.scss' export default () => { - return ( - - - - - - ) + + return ( + +
+
+ + ) } + +// 头部 | 订单 +const Header = memo(()=>{ + let menu = [{text: "待配布"},{text: "待付款"},{text: "待发货"},{text: "已发货"},{text: "已发货"}] + return ( + + + + + + + + + 麦兜 + 131****1132 + + + + 1 + + + + + 订单 + 全部 + + + { + menu.map((item,index)=>{ + return ( + + + 待配布 + + ) + }) + } + + + + + + ) +}) + +// 功能 +const Main = memo(()=>{ + let menu = [{text: "我的收藏"},{text: "颜色对比"},{text: "分享推广"},{text: "团队邀请"}] + return ( + + + + 功能 + + + { + menu.map((item,index)=>{ + return ( + + + {item.text} + + ) + }) + } + + + + ) +}) \ No newline at end of file diff --git a/src/pages/userEdit/index.scss b/src/pages/userEdit/index.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/pages/userEdit/index.tsx b/src/pages/userEdit/index.tsx new file mode 100644 index 0000000..12d4504 --- /dev/null +++ b/src/pages/userEdit/index.tsx @@ -0,0 +1,6 @@ + +import "./index.scss" + +export default ()=>{ + return "1" +} \ No newline at end of file