Kaynağa Gözat

个人中心模块

viczhq 3 hafta önce
ebeveyn
işleme
e645b0dbbd
35 değiştirilmiş dosya ile 898 ekleme ve 30 silme
  1. 22 1
      project.private.config.json
  2. 14 1
      src/app.config.js
  3. 22 11
      src/components/index/ProductList/index.jsx
  4. 0 1
      src/components/index/ProductList/index.less
  5. BIN
      src/images/aliPayIcon.png
  6. BIN
      src/images/mine/edit.png
  7. BIN
      src/images/mine/loginOut.png
  8. BIN
      src/images/mine/norm.png
  9. BIN
      src/images/statementRecordsIcon.png
  10. BIN
      src/images/wallet.png
  11. 3 0
      src/pages/Alipay/index.config.js
  12. 55 0
      src/pages/Alipay/index.jsx
  13. 62 0
      src/pages/Alipay/index.less
  14. 3 0
      src/pages/cashOut/index.config.js
  15. 54 0
      src/pages/cashOut/index.jsx
  16. 118 0
      src/pages/cashOut/index.less
  17. 3 0
      src/pages/cashOutRecord/index.config.js
  18. 45 0
      src/pages/cashOutRecord/index.jsx
  19. 84 0
      src/pages/cashOutRecord/index.less
  20. 3 0
      src/pages/infoEdit/index.config.js
  21. 76 0
      src/pages/infoEdit/index.jsx
  22. 53 0
      src/pages/infoEdit/index.less
  23. 1 1
      src/pages/mine/index.config.js
  24. 44 13
      src/pages/mine/index.jsx
  25. 73 0
      src/pages/mine/index.less
  26. 4 2
      src/pages/productManagement/index.jsx
  27. 3 0
      src/pages/productSub/infoEdit/index.config.js
  28. 25 0
      src/pages/productSub/infoEdit/index.jsx
  29. 4 0
      src/pages/productSub/infoEdit/index.less
  30. 3 0
      src/pages/statementRecords/index.config.js
  31. 49 0
      src/pages/statementRecords/index.jsx
  32. 48 0
      src/pages/statementRecords/index.less
  33. 3 0
      src/pages/userSpecification/index.config.js
  34. 24 0
      src/pages/userSpecification/index.jsx
  35. 0 0
      src/pages/userSpecification/index.less

+ 22 - 1
project.private.config.json

@@ -9,8 +9,29 @@
9 9
     "miniprogram": {
10 10
       "list": [
11 11
         {
12
+          "name": "pages/infoEdit/index",
13
+          "pathName": "pages/productSub/infoEdit/index",
14
+          "query": "",
15
+          "launchMode": "default",
16
+          "scene": null
17
+        },
18
+        {
19
+          "name": "pages/productManagement/index",
20
+          "pathName": "pages/productManagement/index",
21
+          "query": "",
22
+          "launchMode": "default",
23
+          "scene": null
24
+        },
25
+        {
26
+          "name": "pages/storeManagement/index",
27
+          "pathName": "pages/storeManagement/index",
28
+          "query": "isManager=true",
29
+          "launchMode": "default",
30
+          "scene": null
31
+        },
32
+        {
12 33
           "name": "pages/productManagement/index",
13
-          "pathName": "pages/earningsOrder/index",
34
+          "pathName": "pages/mine/index",
14 35
           "query": "",
15 36
           "launchMode": "default",
16 37
           "scene": null

+ 14 - 1
src/app.config.js

@@ -10,9 +10,22 @@ export default defineAppConfig({
10 10
     "pages/productManagement/index",
11 11
     "pages/productClassify/index",
12 12
     "pages/earningsDetail/index",
13
-    "pages/earningsOrder/index"
13
+    "pages/earningsOrder/index",
14
+    "pages/infoEdit/index",
15
+    "pages/userSpecification/index",
16
+    "pages/cashOut/index",
17
+    "pages/cashOutRecord/index",
18
+    "pages/statementRecords/index",
19
+    "pages/Alipay/index"
14 20
   ],
15 21
   subpackages: [
22
+    {
23
+      "root": "pages/productSub",
24
+      "pages": [
25
+        "infoEdit/index"
26
+      ],
27
+      independent: true
28
+    },
16 29
   ],
17 30
   navigateToMiniProgramAppIdList: [
18 31
     "ttf31985a46c214faf"

+ 22 - 11
src/components/index/ProductList/index.jsx

@@ -1,4 +1,4 @@
1
-import React, { useState } from "react";
1
+import React, { useState, useEffect } from "react";
2 2
 import { View, Text, Image } from "@tarojs/components";
3 3
 import { AtCheckbox } from "taro-ui";
4 4
 import Taro from "@tarojs/taro";
@@ -11,6 +11,7 @@ const ProductList = (props) => {
11 11
   const { isSeckill } = props; //是否是秒杀产品引用
12 12
   const { isManagement } = props; //是否是管理产品引用
13 13
   const { isManagementStatus } = props; //是否是管理状态引用
14
+  const { isSelectAll } = props; //是否是全选
14 15
   const [selectedProducts, setSelectedProducts] = useState([]); // 管理选中的商品列表
15 16
   // 模拟商品数据
16 17
   const products = [
@@ -47,16 +48,26 @@ const ProductList = (props) => {
47 48
   ];
48 49
   // 跳转产品详情
49 50
   const toDetail = (id) => {
50
-    // if(isManagementStatus){
51
-    //   handleChange()
52
-    // }else{
53
-    //   Taro.navigateTo({
54
-    //     url: `/pages/productDetail/index?id=${id}`,
55
-    //   });
56
-    // }
51
+    if (isManagementStatus) {
52
+      selectProduct(id);
53
+    } else {
54
+      Taro.navigateTo({
55
+        url: `/pages/productDetail/index?id=${id}`,
56
+      });
57
+    }
57 58
   };
59
+  // 监听 isSelectAll 的变化
60
+  useEffect(() => {
61
+    if (isSelectAll) {
62
+      // 如果 isSelectAll 为 true,选中所有商品
63
+      setSelectedProducts(products.map((product) => product.id));
64
+    } else {
65
+      // 如果 isSelectAll 为 false,取消所有选中
66
+      setSelectedProducts([]);
67
+    }
68
+  }, [isSelectAll]); // 依赖项是 isSelectAll
58 69
   // 单选
59
-  const handleChange = (productId) => {
70
+  const selectProduct = (productId) => {
60 71
     setSelectedProducts((prevSelected) => {
61 72
       const isSelected = prevSelected.includes(productId);
62 73
       if (isSelected) {
@@ -78,12 +89,12 @@ const ProductList = (props) => {
78 89
       )}
79 90
       {products.map((product, index) => (
80 91
         <View key={product.id}>
81
-          <View className="product-item">
92
+          <View onClick={() => toDetail(product.id)} className="product-item">
82 93
             {isManagement && isManagementStatus && (
83 94
               <AtCheckbox
84 95
                 options={[{ value: product.id.toString(), label: "" }]} // 确保每个复选框的 options 是独立的
85 96
                 selectedList={selectedProducts.map((id) => id.toString())}
86
-                onChange={(selectedList) => handleChange(product.id)} // 传递当前 product.id
97
+                onChange={(selectedList) => selectProduct(product.id)} // 传递当前 product.id
87 98
               />
88 99
             )}
89 100
             <View className="right">

+ 0 - 1
src/components/index/ProductList/index.less

@@ -59,7 +59,6 @@
59 59
 
60 60
 
61 61
         .self-tag {
62
-          display: inline-block;
63 62
           padding: 2px 8px;
64 63
           background: #FFD43A;
65 64
           border-radius: 4px;

BIN
src/images/aliPayIcon.png


BIN
src/images/mine/edit.png


BIN
src/images/mine/loginOut.png


BIN
src/images/mine/norm.png


BIN
src/images/statementRecordsIcon.png


BIN
src/images/wallet.png


+ 3 - 0
src/pages/Alipay/index.config.js

@@ -0,0 +1,3 @@
1
+export default definePageConfig({
2
+  navigationBarTitleText: '支付宝'
3
+})

+ 55 - 0
src/pages/Alipay/index.jsx

@@ -0,0 +1,55 @@
1
+import { Component } from "react";
2
+import { View, Text, Image } from "@tarojs/components";
3
+import { AtInput } from "taro-ui";
4
+import "./index.less";
5
+import aliPayIcon from "../../images/aliPayIcon.png";
6
+export default class Index extends Component {
7
+  state = {
8
+    name: "", // 账户姓名
9
+    account: "", // 支付宝账户
10
+  };
11
+
12
+  handleChangeName(value) {
13
+    this.setState({ name: value });
14
+  }
15
+  handleChangeAccount(value) {
16
+    this.setState({ account: value });
17
+  }
18
+  render() {
19
+    return (
20
+      <View className="index">
21
+        {/* 支付宝信息 */}
22
+        <View className="alipay-info">
23
+          <AtInput
24
+            name="value"
25
+            title="账户姓名"
26
+            type="text"
27
+            placeholder="请输入账户姓名"
28
+            value={this.state.name}
29
+            onChange={this.handleChangeName.bind(this)}
30
+          />
31
+          <AtInput
32
+            name="value"
33
+            title="支付宝账户"
34
+            type="text"
35
+            placeholder="请输入支付宝账户"
36
+            value={this.state.account}
37
+            onChange={this.handleChangeAccount.bind(this)}
38
+          />
39
+        </View>
40
+        {/* 注意 */}
41
+        <View className="attention">
42
+          <View className="attention-top">
43
+            <Image src={aliPayIcon} className="attention-icon" />
44
+            注意:
45
+          </View>
46
+          <View className="attention-bottom">
47
+            所维护的支付宝账户所有人需要与提现认证提交的自然人为同一人,避免影响提现
48
+          </View>
49
+        </View>
50
+        {/* 提交 */}
51
+        <View className="submit">提交</View>
52
+      </View>
53
+    );
54
+  }
55
+}

+ 62 - 0
src/pages/Alipay/index.less

@@ -0,0 +1,62 @@
1
+.index {
2
+    padding: 30px 16px;
3
+    background-color: #f9f9f9;
4
+    box-sizing: border-box;
5
+    min-height: 100vh;
6
+
7
+    .alipay-info {
8
+        padding: 0 17px;
9
+        border-radius: 20px;
10
+        background-color: #fff;
11
+        box-sizing: border-box;
12
+        overflow: hidden;
13
+
14
+        .at-input__title {
15
+            font-size: 28px;
16
+            color: #000000;
17
+        }
18
+
19
+        .at-input {
20
+            margin-left: 0;
21
+        }
22
+    }
23
+
24
+    // 注意
25
+    .attention {
26
+        padding: 22px 41px 22px 19px;
27
+        box-sizing: border-box;
28
+        background-color: #fdf7e7;
29
+        border-radius: 20px;
30
+        margin-top: 20px;
31
+        font-size: 26px;
32
+        color: #A0A0A0;
33
+        line-height: 38px;
34
+
35
+        .attention-top {
36
+            display: flex;
37
+            align-items: center;
38
+
39
+            .attention-icon {
40
+                width: 38px;
41
+                height: 38px;
42
+                margin-right: 10px;
43
+            }
44
+        }
45
+    }
46
+    // 提交
47
+    .submit{
48
+        background-color: #f6c71a;
49
+        margin: 0 16px;
50
+        position: fixed;
51
+        bottom: 30px;
52
+        left: 0;
53
+        right: 0;
54
+        height: 88px;
55
+        display: flex;
56
+        align-items: center;
57
+        justify-content: center;
58
+        font-size: 28px;
59
+        color: #000000;
60
+        border-radius: 70px;
61
+    }
62
+}

+ 3 - 0
src/pages/cashOut/index.config.js

@@ -0,0 +1,3 @@
1
+export default definePageConfig({
2
+  navigationBarTitleText: '提现'
3
+})

+ 54 - 0
src/pages/cashOut/index.jsx

@@ -0,0 +1,54 @@
1
+import { Component } from 'react'
2
+import { View, Text } from '@tarojs/components'
3
+import { AtList, AtListItem } from "taro-ui"
4
+import './index.less'
5
+
6
+export default class Index extends Component {
7
+
8
+  render () {
9
+    return (
10
+      <View className='index'>  
11
+      {/* 提现 */}
12
+        <View className='cash-out'>
13
+          <View className='balance-section'>
14
+          <View className='balance-info'>
15
+            <Text className='label'>可提现金额</Text>
16
+            <View className='amount'>
17
+              <Text className='integer'>¥888.</Text>
18
+              <Text className='decimal'>00</Text>
19
+            </View>
20
+          </View>
21
+          <View className='action'>
22
+            <View className='withdraw-btn'>提现</View>
23
+          </View>
24
+        </View>
25
+      </View>
26
+      {/* 提现功能 */}
27
+      <View className='cash-out-function'>
28
+        <AtList>
29
+        <AtListItem title='提现认证' extraText='认证审核中' arrow='right' />
30
+        <AtListItem title='标题记录' extraText='' arrow='right' />
31
+        <AtListItem title='支付账户' extraText='需维护支付宝账户信息' arrow='right' />
32
+        <AtListItem title='标题结算单记录' extraText='6月结算单已出' arrow='right' />
33
+        </AtList>
34
+      </View>
35
+      {/* 结算单说明 */}
36
+      <View className='settlement-statement'>
37
+        <Text className='title'>结算单说明</Text>
38
+        <View className='contentBox'>
39
+        <View className='content indent'>1. 每月 <Text className='highlight'>27</Text>号 出上月结算单</View>
40
+        <View className='content sub-content'>收益可在当月27号至30号全天申请提现</View>
41
+        <View className='content sub-content'>错过需要等下个月,提现金额会在1-5个工作日到账</View>
42
+        <View className='content indent'>2. 会员需要在提现前完成 提现认证 并审核通过</View>
43
+        <View className='content sub-content'>维护完善 支付宝账户信息,否则将影响提现进行</View>
44
+        <View className='content indent'>3. 结算单收益:订单完成时间在上个月的总收益</View>
45
+        <View className='content sub-content'>上个月【已付款】但未完成订单可在下个月提现</View>
46
+        <View className='content indent'>4. 可提现金额已扣除各项税费,提现金额需大于1元</View>
47
+        <View className='content indent'>5. 本月未提现收益不会清 0</View>
48
+        <View className='content sub-content'>会累积到账户余额,下个月合并提现</View>
49
+        </View>
50
+      </View>
51
+      </View>
52
+    )
53
+  }
54
+}

+ 118 - 0
src/pages/cashOut/index.less

@@ -0,0 +1,118 @@
1
+.index {
2
+    min-height: 100vh;
3
+    background-color: #f0f2f5;
4
+    padding: 20px 16px 0 16px;
5
+    box-sizing: border-box;
6
+
7
+}
8
+
9
+.cash-out {
10
+    .balance-section {
11
+        display: flex;
12
+        justify-content: space-between;
13
+        align-items: center;
14
+        background-color: #fff;
15
+        border-radius: 20px;
16
+        padding: 0 17px;
17
+        box-sizing: border-box;
18
+
19
+        .balance-info {
20
+            padding: 35px 0 25px 0;
21
+            box-sizing: border-box;
22
+
23
+            .label {
24
+                font-size: 28px;
25
+                color: #000000;
26
+                display: block;
27
+                margin-bottom: 11px;
28
+                line-height: 41px;
29
+                font-weight: 500;
30
+            }
31
+
32
+            .amount {
33
+                display: flex;
34
+                align-items: baseline;
35
+                font-weight: 700;
36
+                line-height: 70px;
37
+                color: #F6C71A;
38
+
39
+                .integer {
40
+                    font-size: 48px;
41
+                }
42
+
43
+                .decimal {
44
+                    font-size: 36px;
45
+                }
46
+            }
47
+        }
48
+
49
+        .action {
50
+            .withdraw-btn {
51
+                color: #F6C71A;
52
+                padding: 13px 53px;
53
+                line-height: 38px;
54
+                border-radius: 60px;
55
+                font-size: 26px;
56
+                border: 1px solid #F6C71A;
57
+            }
58
+        }
59
+    }
60
+}
61
+
62
+// 提现功能
63
+.cash-out-function {
64
+    margin-top: 20px;
65
+    border-radius: 20px;
66
+    background-color: #fff;
67
+    overflow: hidden;
68
+
69
+    .item-content__info-title {
70
+        font-weight: 500;
71
+        font-size: 28px;
72
+        color: #000000;
73
+    }
74
+    .item-extra__info{
75
+        font-size: 24px;
76
+    }
77
+    .at-list__item-extra{
78
+        max-width: 400px;
79
+    }
80
+    .at-list__item .item-extra__icon-arrow{
81
+        font-size: 32px;
82
+    }
83
+    .at-list__item{
84
+        padding: 31px 17px;
85
+    }
86
+}
87
+// 结算单说明
88
+.settlement-statement{
89
+    margin-top: 30px;
90
+    padding: 0 17px;
91
+    box-sizing: border-box;
92
+    .title{
93
+        font-size: 24px;
94
+        line-height: 35px;
95
+        color: #000000;
96
+    }
97
+    .contentBox{
98
+        margin-top: 10px;
99
+    }
100
+    .content{
101
+        font-size: 22px;
102
+        line-height: 32px;
103
+        color: #B5B5B5;
104
+        
105
+        &.indent {
106
+            padding-left: 24px;
107
+            text-indent: -24px;
108
+        }
109
+        
110
+        &.sub-content {
111
+            padding-left: 24px;
112
+        }
113
+
114
+        .highlight{
115
+            color: #EC8F2B;
116
+        }
117
+    }
118
+}

+ 3 - 0
src/pages/cashOutRecord/index.config.js

@@ -0,0 +1,3 @@
1
+export default definePageConfig({
2
+  navigationBarTitleText: '提现记录'
3
+})

+ 45 - 0
src/pages/cashOutRecord/index.jsx

@@ -0,0 +1,45 @@
1
+import { Component } from 'react'
2
+import { View, Text, Image } from '@tarojs/components'
3
+import './index.less'
4
+import wallet from '../../images/wallet.png'
5
+export default class Index extends Component {
6
+
7
+  componentWillMount () { }
8
+
9
+  componentDidMount () { }
10
+
11
+  componentWillUnmount () { }
12
+
13
+  componentDidShow () { }
14
+
15
+  componentDidHide () { }
16
+
17
+  render () {
18
+    return (
19
+      <View className='index'>
20
+        {/* 提现记录 */}
21
+        <View className='cash-out-record'>
22
+          {/* 累计提现金额 */}
23
+          <View className='total-amount'>
24
+            <View className='left'>
25
+              <Image src={wallet} className='icon' />
26
+              <Text className='title'>累计提现金额</Text>
27
+            </View>
28
+            <View className='amount'>
29
+              <Text className='integer'>¥10000.</Text>
30
+              <Text className='decimal'>00</Text>
31
+            </View>
32
+          </View>
33
+          {/* 提现记录 */}
34
+          <View className='record-item'>
35
+            <View className='item-time'>2024-06-27 10:00:00</View>
36
+            <View className='item-amount'>
37
+              <View className='amount'>¥ 10000.00</View>
38
+              <View className='status'>提现成功</View>
39
+            </View>
40
+          </View>
41
+        </View>
42
+      </View>
43
+    )
44
+  }
45
+}

+ 84 - 0
src/pages/cashOutRecord/index.less

@@ -0,0 +1,84 @@
1
+.index {
2
+    background-color: #f9f9f9;
3
+    min-height: 100vh;
4
+    padding: 30px 16px 0 16px;
5
+    box-sizing: border-box;
6
+
7
+    .cash-out-record {
8
+        .total-amount {
9
+            height: 170px;
10
+            background-color: #fff;
11
+            display: flex;
12
+            justify-content: space-between;
13
+            align-items: center;
14
+            padding: 0 17px;
15
+            box-sizing: border-box;
16
+
17
+            .left {
18
+                display: flex;
19
+                align-items: center;
20
+
21
+                .icon {
22
+                    width: 60px;
23
+                    height: 60px;
24
+                    margin-right: 10px;
25
+                }
26
+
27
+                .title {
28
+                    color: #000000;
29
+                    line-height: 41px;
30
+                    font-size: 28px;
31
+                }
32
+            }
33
+
34
+            .amount {
35
+                display: flex;
36
+                align-items: baseline;
37
+                color: #F6C71A;
38
+                font-weight: bold;
39
+
40
+                .integer {
41
+                    font-size: 48px;
42
+                }
43
+
44
+                .decimal {
45
+                    font-size: 36px;
46
+                }
47
+            }
48
+        }
49
+
50
+        // 提现记录
51
+        .record-item {
52
+            background-color: #fff;
53
+            padding: 46px 16px 0 16px;
54
+            box-sizing: border-box;
55
+            border-radius: 20px;
56
+            display: flex;
57
+            justify-content: space-between;
58
+            height: 170px;
59
+            margin-top: 26px;
60
+            .item-time {
61
+                font-size: 26px;
62
+                color: #000000;
63
+                line-height: 38px;
64
+            }
65
+
66
+            .item-amount {
67
+                display: flex;
68
+                flex-direction: column;
69
+                align-items: flex-end;
70
+                .status {
71
+                    font-size: 24px;
72
+                    color: #91A95B;
73
+                    line-height: 35px;
74
+                }
75
+
76
+                .amount {
77
+                    font-size: 28px;
78
+                    color: #000000;
79
+                    line-height: 41px;
80
+                }
81
+            }
82
+        }
83
+    }
84
+}

+ 3 - 0
src/pages/infoEdit/index.config.js

@@ -0,0 +1,3 @@
1
+export default definePageConfig({
2
+  navigationBarTitleText: '编辑个人信息'
3
+})

+ 76 - 0
src/pages/infoEdit/index.jsx

@@ -0,0 +1,76 @@
1
+import { Component } from "react";
2
+import { View, Text, Image } from "@tarojs/components";
3
+import { AtInput } from "taro-ui";
4
+import "./index.less";
5
+
6
+export default class Index extends Component {
7
+  state = {
8
+    wxAccount: "",
9
+    nickName: "",
10
+    phone: "",
11
+  };
12
+  handleAccountChange (value) {
13
+    this.setState({
14
+      wxAccount: value,
15
+    });
16
+    return value;
17
+  }
18
+  handleNickNameChange (value) {
19
+    this.setState({
20
+      nickName: value,
21
+    });
22
+    return value;
23
+  }
24
+  handlePhoneChange (value) {
25
+    this.setState({
26
+      phone: value,
27
+    });
28
+    return value;
29
+  }
30
+  render() {
31
+    return (
32
+      <View className="index">
33
+        {/* 头像 */}
34
+        <View className="info-edit">
35
+          <Image
36
+            src="https://video-img.fyshark.com/1731495433480WechatIMG674.jpg"
37
+            className="info-edit-img"
38
+          />
39
+          <Text className="info-edit-title">更换头像</Text>
40
+        </View>
41
+        {/* 内容 */}
42
+        <View className="info-edit-content">
43
+          <AtInput
44
+            name="value"
45
+            title="微信账号"
46
+            type="text"
47
+            placeholder="请输入微信账号"
48
+            value={this.state.wxAccount}
49
+            onChange={this.handleAccountChange.bind(this)}
50
+          />
51
+          <AtInput
52
+            name="value"
53
+            title="鱼市昵称"
54
+            type="text"
55
+            placeholder="请输入鱼市昵称"
56
+            value={this.state.nickName}
57
+            onChange={this.handleNickNameChange.bind(this)}
58
+          />
59
+          <AtInput
60
+          border={false}  
61
+            name="value"
62
+            title="手机号"
63
+            type="text"
64
+            placeholder="请输入手机号"
65
+            value={this.state.phone}
66
+            onChange={this.handlePhoneChange.bind(this)}
67
+          />
68
+        </View>
69
+        {/* 提交按钮 */}
70
+        <View className="info-edit-submit">
71
+          <Text className="info-edit-submit-text">提交</Text>
72
+        </View>
73
+      </View>
74
+    );
75
+  }
76
+}

+ 53 - 0
src/pages/infoEdit/index.less

@@ -0,0 +1,53 @@
1
+.index{
2
+    padding-top: 67px;
3
+    background-color: #f5f5f5;
4
+    min-height: 100vh;
5
+    // 头像
6
+    .info-edit{
7
+        display: flex;
8
+        flex-direction: column;
9
+        align-items: center;
10
+        justify-content: center;
11
+        margin-bottom: 36px;
12
+        .info-edit-img{
13
+            width: 210px;
14
+            height: 210px;
15
+            border-radius: 50%;
16
+            margin-bottom: 14px;
17
+        }
18
+        .info-edit-title{
19
+            line-height: 41px;
20
+            font-size: 28px;
21
+            color: #F09A31;
22
+        }
23
+    }
24
+    // 内容
25
+    .info-edit-content{
26
+        margin: 0 16px;
27
+        border-radius: 20px;
28
+        overflow: hidden;
29
+        padding: 0 20px;
30
+        background-color: #fff;
31
+        .at-input__title{
32
+            font-size: 28px;
33
+            color: #222222;
34
+        }
35
+    }
36
+    // 提交按钮
37
+    .info-edit-submit{
38
+        position: fixed;
39
+        bottom: 30px;
40
+        left: 0;
41
+        right: 0;
42
+        margin: 0 16px;
43
+        background-color: #f6c71a;
44
+        border-radius: 70px;
45
+        height: 88px;
46
+        font-size: 28px;
47
+        color: #000000;
48
+        font-weight: 700;
49
+        display: flex;
50
+        justify-content: center;
51
+        align-items: center;
52
+    }
53
+}

+ 1 - 1
src/pages/mine/index.config.js

@@ -1,3 +1,3 @@
1 1
 export default definePageConfig({
2
-  navigationBarTitleText: '我的小店'
2
+  navigationBarTitleText: '鱼市'
3 3
 })

+ 44 - 13
src/pages/mine/index.jsx

@@ -1,23 +1,54 @@
1 1
 import { Component } from 'react'
2
-import { View, Text } from '@tarojs/components'
2
+import Taro from '@tarojs/taro'
3
+import { View, Text, Image } from '@tarojs/components'
4
+import { AtList, AtListItem } from "taro-ui"
3 5
 import './index.less'
4
-
6
+import loginOut from '../../images/mine/loginOut.png'
7
+import edit from '../../images/mine/edit.png'
8
+import norm from '../../images/mine/norm.png'
5 9
 export default class Index extends Component {
6
-
7
-  componentWillMount () { }
8
-
9
-  componentDidMount () { }
10
-
11
-  componentWillUnmount () { }
12
-
13
-  componentDidShow () { }
14
-
15
-  componentDidHide () { }
10
+  handleLogout = () => {
11
+    Taro.showModal({
12
+      title: '',
13
+      content: '退出后,请重新登录!',
14
+      cancelText: '暂不退出',
15
+      confirmText: '退出登录',
16
+      cancelColor: '#000000',
17
+      confirmColor: '#F6C71A',
18
+      success: function (res) {
19
+        if (res.confirm) {
20
+          console.log('用户点击退出登录')
21
+        }
22
+      }
23
+    })
24
+  }
16 25
 
17 26
   render () {
18 27
     return (
19 28
       <View className='index'>
20
-        <Text>我的</Text>
29
+        {/* 个人信息 */}
30
+        <View className="info">
31
+          <Image src='' className="avatar" />
32
+          <View className="info-right">
33
+            <View className='user-info'>
34
+            <View className="name">张三</View>
35
+            <View className="account">138001</View>
36
+            </View>
37
+            <Image className='edit-icon' src={edit}></Image>
38
+          </View>
39
+        </View>
40
+        {/* 功能 */}
41
+        <View className='function'>
42
+          <AtList>
43
+            <AtListItem title='用户规范' arrow='right' thumb={norm}/>
44
+            <AtListItem 
45
+              title='退出登录' 
46
+              arrow='right' 
47
+              thumb={loginOut}
48
+              onClick={this.handleLogout}
49
+            />
50
+          </AtList>
51
+        </View>
21 52
       </View>
22 53
     )
23 54
   }

+ 73 - 0
src/pages/mine/index.less

@@ -0,0 +1,73 @@
1
+.index {
2
+    background-color: #f5f5f5;
3
+    padding: 0 16px;
4
+    box-sizing: border-box;
5
+    min-height: 100vh;
6
+
7
+    .info {
8
+        height: 170px;
9
+        display: flex;
10
+        align-items: center;
11
+        padding: 0 18px;
12
+        box-sizing: border-box;
13
+        justify-content: space-between;
14
+
15
+        .avatar {
16
+            width: 116px;
17
+            height: 116px;
18
+            border-radius: 50%;
19
+            margin-right: 18px;
20
+            background-color: red;
21
+        }
22
+
23
+        .info-right {
24
+            display: flex;
25
+            align-items: center;
26
+            justify-content: space-between;
27
+            flex: 1;
28
+
29
+            .user-info {
30
+                color: #000000;
31
+
32
+                .name {
33
+                    font-size: 34px;
34
+                    line-height: 49px;
35
+                }
36
+
37
+                .account {
38
+                    font-size: 28px;
39
+                    line-height: 41px;
40
+                }
41
+            }
42
+
43
+            .edit-icon {
44
+                width: 28px;
45
+                height: 28px;
46
+            }
47
+        }
48
+    }
49
+
50
+    // 功能
51
+    .function {
52
+        border-radius: 20px;
53
+        overflow: hidden;
54
+        background-color: #ffffff;
55
+
56
+        .at-list__item .item-extra__icon-arrow {
57
+            font-size: 44px;
58
+        }
59
+
60
+        .at-list__item--thumb .item-thumb {
61
+            width: 40px;
62
+            height: 40px;
63
+        }
64
+
65
+        .item-content__info-title {
66
+            font-size: 28px;
67
+            color: #000000;
68
+        }
69
+        .at-list__item{
70
+            padding: 31px 17px;
71
+        }
72
+    }
73
+}

+ 4 - 2
src/pages/productManagement/index.jsx

@@ -14,10 +14,11 @@ export default class Index extends Component {
14 14
   state = {
15 15
     isManagementStatus: false, //是否是管理状态
16 16
     current: 0, //tabs坐标
17
+    isSelectAll: false, //是否全选
17 18
     selectedOption: "全部商品", //商品默认名称
18 19
     tabList: [{ title: "在售中 (20)" }], //tabs标题
19 20
     options: ["全部商品", "选项2", "选项3"], //商品下拉选项
20
-    checkedList: ["all"], //全选
21
+    checkedList: [""], //全选
21 22
     checkboxOption: [
22 23
       {
23 24
         value: "allValue",
@@ -52,6 +53,7 @@ export default class Index extends Component {
52 53
   handleChange(value) {
53 54
     this.setState({
54 55
       checkedList: value,
56
+      isSelectAll:!this.state.isSelectAll
55 57
     });
56 58
   }
57 59
   render() {
@@ -88,7 +90,7 @@ export default class Index extends Component {
88 90
                   </View>
89 91
                 </View>
90 92
                 {/* 商品列表 */}
91
-                <ProductList isManagement={true} isManagementStatus={this.state.isManagementStatus}/>
93
+                <ProductList isSelectAll={this.state.isSelectAll} isManagement={true} isManagementStatus={this.state.isManagementStatus}/>
92 94
               </View>
93 95
             </AtTabsPane>
94 96
           </AtTabs>

+ 3 - 0
src/pages/productSub/infoEdit/index.config.js

@@ -0,0 +1,3 @@
1
+export default definePageConfig({
2
+  navigationBarTitleText: '编辑个人信息'
3
+})

+ 25 - 0
src/pages/productSub/infoEdit/index.jsx

@@ -0,0 +1,25 @@
1
+import { Component } from 'react'
2
+import { View, Text, Image } from '@tarojs/components'
3
+import './index.less'
4
+import vip from '../../../images/index/back-top.png'
5
+export default class Index extends Component {
6
+
7
+  componentWillMount () { }
8
+
9
+  componentDidMount () { }
10
+
11
+  componentWillUnmount () { }
12
+
13
+  componentDidShow () { }
14
+
15
+  componentDidHide () { }
16
+
17
+  render () {
18
+    return (
19
+      <View className='index'>
20
+        <Image src='https://video-img.fyshark.com/1731495433480WechatIMG674.jpg' className='vip-icon' />
21
+        <Text>编辑个人信息</Text>
22
+      </View>
23
+    )
24
+  }
25
+}

+ 4 - 0
src/pages/productSub/infoEdit/index.less

@@ -0,0 +1,4 @@
1
+Image{
2
+    height: 200px;
3
+    width: 200px;
4
+}

+ 3 - 0
src/pages/statementRecords/index.config.js

@@ -0,0 +1,3 @@
1
+export default definePageConfig({
2
+  navigationBarTitleText: '结算单记录'
3
+})

+ 49 - 0
src/pages/statementRecords/index.jsx

@@ -0,0 +1,49 @@
1
+import { Component } from 'react'
2
+import { View, Text, Image } from '@tarojs/components'
3
+import './index.less'
4
+import statementRecordsIcon from '../../images/statementRecordsIcon.png'
5
+export default class Index extends Component {
6
+
7
+
8
+  state = {
9
+    records: [
10
+      { month: '2020年06月结算单', amount: '70' },
11
+      { month: '2020年05月结算单', amount: '85' },
12
+      { month: '2020年04月结算单', amount: '92' },
13
+      { month: '2020年04月结算单', amount: '92' },
14
+      { month: '2020年04月结算单', amount: '92' },
15
+      { month: '2020年04月结算单', amount: '92' },
16
+      { month: '2020年04月结算单', amount: '92' },
17
+      { month: '2020年04月结算单', amount: '92' },
18
+      { month: '2020年04月结算单', amount: '92' },
19
+      { month: '2020年04月结算单', amount: '92' },
20
+      { month: '2020年04月结算单', amount: '92' },
21
+      { month: '2020年04月结算单', amount: '92' },
22
+      { month: '2020年04月结算单', amount: '92' },
23
+      { month: '2020年04月结算单', amount: '92' },
24
+      { month: '2020年04月结算单', amount: '92' },
25
+      { month: '2020年04月结算单', amount: '92' },
26
+    ]
27
+  }
28
+
29
+  render () {
30
+    return (
31
+      <View className='index'>
32
+        {/* 结算单记录列表 */}
33
+        <View className='record-list'>
34
+          {this.state.records.map((item, index) => (
35
+            <View className='record-item' key={index}>
36
+              <View className='left'>
37
+                <Image src={statementRecordsIcon} className='icon' />
38
+                <Text className='month'>{item.month}</Text>
39
+              </View>
40
+              <View className='right'>
41
+                <Text className='amount'>¥{item.amount}</Text>
42
+              </View>
43
+            </View>
44
+          ))}
45
+        </View>
46
+      </View>
47
+    )
48
+  }
49
+}

+ 48 - 0
src/pages/statementRecords/index.less

@@ -0,0 +1,48 @@
1
+.index {
2
+    background-color: #f9f9f9;
3
+    padding: 30px 16px;
4
+    min-height: 100vh;
5
+    box-sizing: border-box;
6
+    .record-list {
7
+        background-color: #fff;
8
+        padding: 0 17px;
9
+        border-radius: 20px;
10
+        overflow: hidden;
11
+
12
+        .record-item {
13
+            display: flex;
14
+            justify-content: space-between;
15
+            align-items: center;
16
+            height: 100px;
17
+            border-bottom: 1px solid #D8D8D8;
18
+
19
+            &:last-child {
20
+                border-bottom: none;
21
+            }
22
+
23
+            .left {
24
+                display: flex;
25
+                align-items: center;
26
+
27
+                .icon {
28
+                    height: 52px;
29
+                    width: 52px;
30
+                    margin-right: 10px;
31
+                }
32
+
33
+                .month {
34
+                    color: #444444;
35
+                    font-size: 28px;
36
+                }
37
+            }
38
+
39
+            .right {
40
+                .amount {
41
+                    color: #666666;
42
+                    font-size: 28px;
43
+                    font-weight: 500;
44
+                }
45
+            }
46
+        }
47
+    }
48
+}

+ 3 - 0
src/pages/userSpecification/index.config.js

@@ -0,0 +1,3 @@
1
+export default definePageConfig({
2
+  navigationBarTitleText: '用户规范'
3
+})

+ 24 - 0
src/pages/userSpecification/index.jsx

@@ -0,0 +1,24 @@
1
+import { Component } from 'react'
2
+import { View, Text } from '@tarojs/components'
3
+import './index.less'
4
+
5
+export default class Index extends Component {
6
+
7
+  componentWillMount () { }
8
+
9
+  componentDidMount () { }
10
+
11
+  componentWillUnmount () { }
12
+
13
+  componentDidShow () { }
14
+
15
+  componentDidHide () { }
16
+
17
+  render () {
18
+    return (
19
+      <View className='index'>
20
+        <Text>用户规范</Text>
21
+      </View>
22
+    )
23
+  }
24
+}

+ 0 - 0
src/pages/userSpecification/index.less