Parcourir la source

会员页面数据&&订单数据&&弹窗分享自定义

viczhq il y a 2 mois
Parent
commit
417915c3ce

+ 10 - 8
src/api/request.js

@@ -45,19 +45,21 @@ export default async (options = { method: 'GET', data: {} }) => {
45 45
       case 200:
46 46
         return data;
47 47
       case 400:
48
-        // Taro.showToast({
49
-        //   title: '传参有误',
50
-        //   icon: 'none',
51
-        //   mask: true,
52
-        // });
53
-        throw new Error('传参有误');
48
+        Taro.showToast({
49
+          title: msg,
50
+          icon: 'none',
51
+          mask: true,
52
+        });
53
+        // throw new Error('传参有误');
54
+        break;
54 55
       case 422:
55 56
         // Taro.showToast({
56 57
         //   title: 'Validation Error',
57 58
         //   icon: 'none',
58 59
         //   mask: true,
59 60
         // });
60
-        throw new Error('Validation Error');
61
+        // throw new Error('Validation Error');
62
+        break;
61 63
       case 500:
62 64
         Taro.showToast({
63 65
           title: '需要登录',
@@ -78,7 +80,7 @@ export default async (options = { method: 'GET', data: {} }) => {
78 80
           url: '/pages/login/index',
79 81
         });
80 82
         // throw new Error('需要登录');
81
-        return
83
+        break
82 84
       default:
83 85
         Taro.showToast({
84 86
           title: `${msg || '请求失败'}`,

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

@@ -33,6 +33,9 @@ const ProductList = forwardRef((props, ref) => {
33 33
 
34 34
   const [selectedProducts, setSelectedProducts] = useState([]); // 商品选择状态
35 35
   const [shareModalOpened, setShareModalOpened] = useState(false); // 分享弹窗状态
36
+  const [currentShareProduct, setCurrentShareProduct] = useState(null); // 当前分享商品
37
+  const [shareTitle, setShareTitle] = useState(""); // 分享标题
38
+  const [shareLink, setShareLink] = useState(""); // 分享链接
36 39
   // 监听选中状态变化
37 40
   useEffect(() => {
38 41
     // 每当 selectedProducts 变化时,调用父组件的回调
@@ -89,22 +92,39 @@ const ProductList = forwardRef((props, ref) => {
89 92
       onAddProduct && onAddProduct(productId, index);
90 93
     }
91 94
   };
95
+  // 设置分享标题
96
+  const handleShareTitleChange = (newTitle) => {
97
+    setShareTitle(newTitle);
98
+  };
99
+  useEffect(() => {
100
+    if (shareModalOpened) {
101
+      // 设置分享内容
102
+      setShareContent({
103
+        title: shareTitle || currentShareProduct.item_title,
104
+        path: `/pages/indexSub/productDetail/index?id=${
105
+          currentShareProduct.id
106
+        }&&isShare=${true}&&shareJump=${shareLink}`,
107
+        imageUrl: currentShareProduct.image_url,
108
+      });
109
+    }
110
+  }, [shareTitle]);
92 111
   // 分享商品
93 112
   const shareProduct = (product, e) => {
94 113
     e.stopPropagation(); // 防止事件穿透
114
+    setCurrentShareProduct(product);
95 115
     getShareJump({
96 116
       share_type: 1,
97 117
       share_id: product.id,
98 118
     }).then((res) => {
99
-      // 设置分享内容
119
+      // 打开分享弹窗
100 120
       setShareContent({
101
-        title: product.item_title,
121
+        title: shareTitle || product.item_title,
102 122
         path: `/pages/indexSub/productDetail/index?id=${
103 123
           product.id
104 124
         }&&isShare=${true}&&shareJump=${res.share_unique_value}`,
105 125
         imageUrl: product.image_url,
106 126
       });
107
-      // 打开分享弹窗
127
+      setShareLink(res.share_unique_value);
108 128
       setShareModalOpened(true);
109 129
     });
110 130
   };
@@ -184,12 +204,7 @@ const ProductList = forwardRef((props, ref) => {
184 204
                 <View className="profit-line">
185 205
                   <View className="save-money">
186 206
                     <Image className="bg" src={saveMoneyBg} mode="aspectFit" />
187
-                    <View className="content">
188
-                      <Text className="label">自购省</Text>
189
-                      <Text className="money">
190
-                        ¥{product.estimated_commission}
191
-                      </Text>
192
-                    </View>
207
+                    <View className="content">立 即 购 买</View>
193 208
                   </View>
194 209
                   <View className="share-earn">
195 210
                     <Image className="bg" src={shareEarnBg} mode="aspectFit" />
@@ -226,9 +241,15 @@ const ProductList = forwardRef((props, ref) => {
226 241
       {isNoMore && <View className="no-more">没有更多了~</View>}
227 242
       {/* 分享弹窗 */}
228 243
       <ShareModal
229
-        onClose={() => setShareModalOpened(false)}
244
+        onClose={() => {
245
+          setShareModalOpened(false);
246
+          setCurrentShareProduct(null);
247
+          setShareTitle("");
248
+          setShareLink("");
249
+        }}
230 250
         isOpened={shareModalOpened}
231
-        title="分享赚"
251
+        product={currentShareProduct}
252
+        onShareTitleChange={handleShareTitleChange}
232 253
       />
233 254
     </View>
234 255
   );

+ 16 - 2
src/components/index/ProductList/index.less

@@ -133,6 +133,16 @@
133 133
 
134 134
         .save-money {
135 135
           color: #F6C71A;
136
+          display: flex;
137
+          align-items: center;
138
+          justify-content: center;
139
+          .content {
140
+            width: 74px;
141
+            height: 88px;
142
+            font-size: 28px;
143
+            line-height: 41px;
144
+            text-align: center;
145
+          }
136 146
         }
137 147
 
138 148
         .share-earn {
@@ -178,13 +188,17 @@
178 188
               justify-content: center;
179 189
               font-size: 28px;
180 190
               color: #FFFFFF;
191
+
181 192
               &::after {
182 193
                 border: none;
183 194
               }
184 195
             }
196
+
185 197
             .button-hover {
186
-              background-color: transparent !important; /* 移除背景高亮 */
187
-              box-shadow: none !important;             /* 移除可能的阴影 */
198
+              background-color: transparent !important;
199
+              /* 移除背景高亮 */
200
+              box-shadow: none !important;
201
+              /* 移除可能的阴影 */
188 202
             }
189 203
 
190 204
             .label,

+ 36 - 8
src/components/shareModal/index.jsx

@@ -1,17 +1,45 @@
1 1
 import { AtModal, AtModalContent } from "taro-ui";
2
-import { View, Image, Text, Button } from "@tarojs/components";
2
+import { View, Image, Text, Button, Input } from "@tarojs/components";
3 3
 import "./index.less";
4
+import { useState, useEffect } from "react";
4 5
 
5 6
 export default function shareModal(props) {
6
-  const { title, isOpened, onClose } = props;
7
+  const {  isOpened, onClose, product, onShareTitleChange } = props;
8
+  const [shareTitle, setShareTitle] = useState('');
9
+
10
+  useEffect(() => {
11
+    if (product?.item_title) {
12
+      setShareTitle(product.item_title);
13
+    }
14
+  }, [product]);
15
+  useEffect(() => {
16
+    if (!isOpened) {
17
+      setShareTitle('');
18
+    }
19
+  }, [isOpened]);
20
+  const handleInputChange = (e) => {
21
+    const newTitle = e.detail.value;
22
+    setShareTitle(newTitle);
23
+    onShareTitleChange?.(newTitle);
24
+  }
7 25
   return (
8
-    <AtModal isOpened={isOpened} closeOnClickOverlay={true} onClose={onClose}>
9
-      <AtModalContent>
10
-        <View className="container">
11
-          <View className="title">{title}</View>
12
-          <Button openType="share" onClick={onClose}>分享</Button>
13
-        </View>
26
+    <View className="share-modal">
27
+      <AtModal isOpened={isOpened} closeOnClickOverlay={true} onClose={onClose}>
28
+        <AtModalContent>
29
+          {product && (
30
+          <View className="container">
31
+            <Image className="product-image" src={product.image_url} mode="aspectFill" />
32
+            <View className="title">{product.item_title}</View>
33
+            <Input onInput={handleInputChange} className="input" value={shareTitle} />
34
+            <Button openType="share" onClick={onClose}>
35
+              <View className="share-button">
36
+                分享
37
+              </View>
38
+            </Button>
39
+          </View>
40
+        )}
14 41
       </AtModalContent>
15 42
     </AtModal>
43
+    </View>
16 44
   );
17 45
 }

+ 80 - 13
src/components/shareModal/index.less

@@ -1,21 +1,88 @@
1
-  .at-modal__container {
2
-    width: 610px !important;
3
-  }
1
+  .share-modal{ 
2
+    .at-modal__container {
3
+      width: 610px !important;
4
+    }
5
+
4 6
   .at-modal__content {
5
-    max-height: none !important;  // 移除最大高度限制
6
-    min-height: auto !important;  // 移除最小高度限制
7
-    height: auto !important;      // 高度自适应
7
+    max-height: none !important; // 移除最大高度限制
8
+    min-height: auto !important; // 移除最小高度限制
9
+    height: auto !important; // 高度自适应
10
+  }
11
+  .at-modal__content{
12
+    padding-left: 0;
13
+    padding-right: 0;
8 14
   }
9
-.container{
15
+  .container {
10 16
     display: flex;
11 17
     flex-direction: column;
12 18
     align-items: center;
13 19
     justify-content: center;
14
-    .title{
15
-        color: #000000;
16
-        font-size: 32px;
17
-        font-weight: bold;
18
-        line-height: 46px;
19
-        margin-bottom: 20px;
20
+
21
+    .product-image {
22
+      width: 386px;
23
+      height: 385px;
24
+      border-radius: 16px;
25
+    }
26
+
27
+    .title {
28
+      width: 386px;
29
+      font-size: 24px;
30
+      color: #555555;
31
+      margin-top: 10px;
32
+      white-space: nowrap; // 文本不换行
33
+      overflow: hidden; // 溢出隐藏
34
+      text-overflow: ellipsis; // 显示省略号
35
+    }
36
+    .input{
37
+      margin-top: 30px;
38
+      width: 480px;
39
+      height: 72px;
40
+      border-radius: 20px;
41
+      border: 4px solid #FFE000;
42
+      padding-left: 16px;
43
+      font-weight: 700;
44
+      font-size: 28px;
45
+      color: #333333;
20 46
     }
47
+    .share-button {
48
+      text-align: center;
49
+      line-height: 80px;
50
+      width: 480px;
51
+      height: 80px;
52
+      background-color: #ffe000;
53
+      border-radius: 40px;
54
+      font-weight: 700;
55
+      font-size: 28px;
56
+      color: #000000;
57
+      margin-top: 50px;
58
+    }
59
+
60
+    // 清除Button默认样式
61
+    Button {
62
+      padding: 0;
63
+      margin: 0;
64
+      background: none;
65
+      border: none;
66
+      line-height: normal;
67
+      height: 100%;
68
+      width: 100%;
69
+      display: flex;
70
+      flex-direction: column;
71
+      align-items: center;
72
+      justify-content: center;
73
+      font-size: 28px;
74
+      color: #FFFFFF;
75
+
76
+      &::after {
77
+        border: none;
78
+      }
79
+    }
80
+
81
+    .button-hover {
82
+      background-color: transparent !important;
83
+      /* 移除背景高亮 */
84
+      box-shadow: none !important;
85
+      /* 移除可能的阴影 */
86
+    }
87
+  }
21 88
 }

BIN
src/images/index/save-money.png


BIN
src/images/seckill/heighTop.jpg


BIN
src/images/seckill/seckillTop.jpg


BIN
src/images/seckill/seckillTop.png


+ 10 - 2
src/pages/index/index.jsx

@@ -40,6 +40,14 @@ export default class Index extends Component {
40 40
       this.getProductList(true);
41 41
     });
42 42
   };
43
+  // 轮播图点击
44
+  handleBannerClick = (item) => {
45
+    if(item.type_jpath==1){
46
+      Taro.navigateTo({
47
+        url: `${item.jpath}`
48
+      })
49
+    }
50
+  };
43 51
   // 修改 tab 切换处理函数
44 52
   handleClick(value) {
45 53
     this.setState(
@@ -155,12 +163,12 @@ export default class Index extends Component {
155 163
               circular
156 164
               autoplay
157 165
               indicatorDots
158
-              indicatorColor="#e8e8e8"
166
+              indicatorColor="#e8e8e8"banner
159 167
               indicatorActiveColor="#ffffff"
160 168
             >
161 169
               {homeData.banner &&
162 170
                 homeData.banner.map((item) => (
163
-                  <SwiperItem className="banner-item" key={item.id}>
171
+                  <SwiperItem onClick={() => this.handleBannerClick(item)} className="banner-item" key={item.id}>
164 172
                     <Image
165 173
                       className="banner-img"
166 174
                       src={item.img}

+ 1 - 1
src/pages/indexSub/highCommission/index.jsx

@@ -1,7 +1,7 @@
1 1
 import { Component } from "react";
2 2
 import { View, Image } from "@tarojs/components";
3 3
 import "./index.less";
4
-import seckillImg from "../../../images/seckill/seckillTop.png";
4
+import seckillImg from "../../../images/seckill/heighTop.jpg";
5 5
 import ProductList from "../../../components/index/ProductList";
6 6
 import { getRecommendProductList } from "../../../service";
7 7
 import { getShareContent } from "../../../common/share";

+ 6 - 6
src/pages/indexSub/productDetail/index.jsx

@@ -46,10 +46,10 @@ export default class Index extends Component {
46 46
         productDetail: res,
47 47
       },
48 48
       () => {
49
-        let session_key = Taro.getStorageSync("session_key");
50
-        if (session_key) {
51
-          this.getProductPromotion(); //获取商品推广转链
52
-        }
49
+        // let session_key = Taro.getStorageSync("session_key");
50
+        // if (session_key) {
51
+        //   this.getProductPromotion(); //获取商品推广转链
52
+        // }
53 53
       }
54 54
     );
55 55
   };
@@ -289,8 +289,8 @@ export default class Index extends Component {
289 289
                   onClick={this.handleBuy}
290 290
                   className="bottom-buy-right-share"
291 291
                 >
292
-                  <Image src={selfBuy} mode="aspectFit" />
293
-                  <Text className="bottom-buy-text">自购省</Text>
292
+                  {/* <Image src={selfBuy} mode="aspectFit" /> */}
293
+                  <Text className="bottom-buy-text">立即购买</Text>
294 294
                 </View>
295 295
               </>
296 296
             ) : (

+ 1 - 1
src/pages/indexSub/seckillIndex/index.jsx

@@ -1,7 +1,7 @@
1 1
 import { Component } from "react";
2 2
 import { View, Image } from "@tarojs/components";
3 3
 import "./index.less";
4
-import seckillImg from "../../../images/seckill/seckillTop.png";
4
+import seckillImg from "../../../images/seckill/seckillTop.jpg";
5 5
 import ProductList from "../../../components/index/ProductList";
6 6
 import { getRecommendProductList } from "../../../service";
7 7
 import { getShareContent } from "../../../common/share";

+ 10 - 5
src/pages/login/index.jsx

@@ -1,5 +1,5 @@
1 1
 import { Component } from "react";
2
-import { View, Image, Button } from "@tarojs/components";
2
+import { View, Image, Button, getCurrentInstance } from "@tarojs/components";
3 3
 import Taro from "@tarojs/taro";
4 4
 import { AtCheckbox } from "taro-ui";
5 5
 import { login, getUserInfo, bindShareJump } from "../../service";
@@ -11,6 +11,11 @@ export default class Index extends Component {
11 11
   state = {
12 12
     isChecked: false,
13 13
   };
14
+  // 页面卸载
15
+  componentWillUnmount() {
16
+    Taro.removeStorageSync("currentPage");
17
+    global.globalData.optionsData = {};
18
+  }
14 19
   // 同意协议
15 20
   handleCheckboxChange = (value) => {
16 21
     this.setState({
@@ -23,7 +28,7 @@ export default class Index extends Component {
23 28
       url: "/pages/mineSub/userSpecification/index",
24 29
     });
25 30
   };
26
-
31
+  
27 32
   // handleGetPhoneNumber = (e) => {
28 33
   //   if (e.detail.errMsg === "getPhoneNumber:ok") {
29 34
   //     // 处理获取到的手机号信息
@@ -76,12 +81,13 @@ export default class Index extends Component {
76 81
         }
77 82
 
78 83
         // 再获取用户信息
79
-        const userInfoRes = getUserInfo();
84
+        const userInfoRes = await getUserInfo();
80 85
         Taro.setStorageSync("userInfo", userInfoRes);
81 86
 
82 87
         // 最后处理页面跳转
88
+        
83 89
         let lastPage = Taro.getStorageSync("currentPage");
84
-        if (lastPage == "pages/mineSub/login/index") {
90
+        if (!lastPage || lastPage === "pages/mineSub/login/index") {
85 91
           lastPage = "pages/index/index";
86 92
         }
87 93
         await Taro.reLaunch({
@@ -92,7 +98,6 @@ export default class Index extends Component {
92 98
       },
93 99
     });
94 100
   };
95
-
96 101
   render() {
97 102
     const checkboxOption = [
98 103
       {

+ 26 - 11
src/pages/member/index.jsx

@@ -40,7 +40,10 @@ export default class Index extends Component {
40 40
       this.getVipInfo(); //获取会员首页数据
41 41
     }
42 42
   }
43
-
43
+  // 去订单列表
44
+  handleOrderClick = (type) => {
45
+    Taro.navigateTo({ url: `/pages/memberSub/earningsOrder/index?type=${type}` });
46
+  }
44 47
   render() {
45 48
     const { vipInfo } = this.state;
46 49
     return (
@@ -97,10 +100,10 @@ export default class Index extends Component {
97 100
                 <Text className="label">累计收益</Text>
98 101
               </View>
99 102
             </View>
100
-            {/* <view onClick={() => Taro.navigateTo({ url: `/pages/memberSub/earningsDetail/index` })} className="estimated-income-detail">
103
+            <view onClick={() => Taro.navigateTo({ url: `/pages/memberSub/earningsDetail/index` })} className="estimated-income-detail">
101 104
               收益详情
102 105
               <Image className="to-detail" src={toDetail} />
103
-            </view> */}
106
+            </view>
104 107
           </View>
105 108
 
106 109
           {/* 可提现金额 */}
@@ -115,12 +118,12 @@ export default class Index extends Component {
115 118
                   ¥{vipInfo.draw_money.store_earnings_now}
116 119
                 </Text>
117 120
 
118
-                {/* <View className="warning-icon-box">
121
+                <View className="warning-icon-box">
119 122
                   <Image className="warning-icon" src={warning} />
120 123
                   <Text className="warning-text">未完成提现认证</Text>
121
-                </View> */}
124
+                </View>
122 125
               </View>
123
-              {/* <View onClick={() => Taro.navigateTo({ url: `/pages/memberSub/cashOut/index` })} className="right">点击提现</View> */}
126
+              <View onClick={() => Taro.navigateTo({ url: `/pages/memberSub/cashOut/index` })} className="right">点击提现</View>
124 127
             </View>
125 128
           </View>
126 129
           {/* 今日订单 */}
@@ -130,10 +133,10 @@ export default class Index extends Component {
130 133
                 <Image className="today-order-icon" src={order} />
131 134
                 <Text className="today-order-title">今日订单</Text>
132 135
               </View>
133
-              {/* <View onClick={() => Taro.navigateTo({ url: `/pages/memberSub/earningsOrder/index` })} className="today-order-header-right">
136
+              <View onClick={() => this.handleOrderClick(2)} className="today-order-header-right">
134 137
                 历史订单
135 138
                 <AtIcon value='chevron-right' size='10' color='#A1A1A1'></AtIcon>
136
-              </View> */}
139
+              </View>
137 140
             </View>
138 141
 
139 142
             <View className="today-order-content">
@@ -141,14 +144,26 @@ export default class Index extends Component {
141 144
                 <Text className="label">订单总量</Text>
142 145
                 <Text className="amount">{vipInfo.order.order_all}</Text>
143 146
               </View>
144
-              <View className="order-item">
147
+              <View className="order-item" onClick={() => this.handleOrderClick(2)}>
145 148
                 <Text className="label">推广订单</Text>
146 149
                 <Text className="amount">{vipInfo.order.order_promotion}</Text>
147 150
               </View>
148
-              <View className="order-item">
149
-                <Text className="label">购买历史</Text>
151
+              <View className="order-item" onClick={() => this.handleOrderClick(2)}>
152
+                <Text className="label">已付款订单</Text>
153
+                <Text className="amount">{vipInfo.order.unissued_order_cnt}</Text>
154
+              </View>            
155
+              <View className="order-item" onClick={() => this.handleOrderClick(2)}>
156
+                <Text className="label">已收货订单</Text>
157
+                <Text className="amount">{vipInfo.order.on_arrival_order_cnt}</Text>
158
+              </View>
159
+              <View className="order-item" onClick={() => this.handleOrderClick(2)}>
160
+                <Text className="label">已结算订单</Text>
150 161
                 <Text className="amount">{vipInfo.order.order_pay}</Text>
151 162
               </View>
163
+              <View className="order-item" onClick={() => this.handleOrderClick(2)}>
164
+                <Text className="label">已失效订单</Text>
165
+                <Text className="amount">{vipInfo.order.dead_order_cnt}</Text>
166
+              </View>
152 167
             </View>
153 168
           </View>
154 169
         </View>

+ 9 - 8
src/pages/member/index.less

@@ -2,7 +2,7 @@
2 2
     position: relative;
3 3
     min-height: 100vh;
4 4
     background-color: #f9f9f9;
5
-    padding-bottom: 30px;
5
+    // padding-bottom: 30px;
6 6
     .member-bg {
7 7
         position: absolute;
8 8
         top: 0;
@@ -28,12 +28,14 @@
28 28
         align-items: center;
29 29
         background-color: #fefaef;
30 30
         border-radius: 20px;
31
-
32 31
         .member-info-card-header {
33 32
             height: 385px;
34 33
             padding-top: 101px;
35 34
             box-sizing: border-box;
36
-
35
+            display: flex;
36
+            align-items: center;
37
+            justify-content: center;
38
+            flex-direction: column;
37 39
             .avatar {
38 40
                 width: 170px;
39 41
                 height: 170px;
@@ -286,22 +288,21 @@
286 288
         }
287 289
         .today-order-content {
288 290
             width: 100%;
289
-            height: 142px;
290 291
             border-radius: 20px;
291 292
             background-color: #fff;
292
-            padding: 0 20px;
293
+            padding: 27px 20px 0 20px;
293 294
             box-sizing: border-box;
294 295
             display: flex;
295 296
             justify-content: space-between;
296 297
             align-items: center;
297
-
298
+            flex-wrap: wrap;
298 299
             .order-item {
299
-                flex: 1;
300 300
                 display: flex;
301 301
                 flex-direction: column;
302 302
                 align-items: center;
303 303
                 justify-content: space-between;
304
-
304
+                width: 33.33%;
305
+                margin-bottom: 35px;
305 306
                 .label {
306 307
                     font-size: 24px;
307 308
                     color: #A1A1A1;

+ 49 - 29
src/pages/memberSub/earningsDetail/index.jsx

@@ -1,61 +1,81 @@
1 1
 import { Component } from 'react'
2 2
 import { View, Text } from '@tarojs/components'
3
+import { getEarningsDetail } from '../../../service'
3 4
 import './index.less'
4 5
 
5 6
 export default class Index extends Component {
6
-
7
-  componentWillMount () { }
8
-
9
-  componentDidMount () { }
10
-
11
-  componentWillUnmount () { }
12
-
13
-  componentDidShow () { }
14
-
15
-  componentDidHide () { }
7
+  state = {
8
+    earningsDetail: {},//收益详情
9
+  }
10
+  componentDidShow () {
11
+    this.getEarningsDetail();
12
+  }
13
+  // 获取收益详情
14
+  getEarningsDetail = async () => {
15
+    const res = await getEarningsDetail();
16
+    this.setState({ earningsDetail: res });
17
+  }
16 18
 
17 19
   render () {
20
+    const { earningsDetail } = this.state;
21
+    const today_data = earningsDetail.today_data || {}; 
22
+    const this_month_data = earningsDetail.this_month_data || {};
23
+    const last_month_data = earningsDetail.last_month_data || {}; 
24
+    const historical_month_data = earningsDetail.historical_month_data || {}; 
18 25
     return (
19 26
       <View className='index'>
20 27
         <View className='earnings-list'>
21 28
           <View className='earnings-list-item'>
22 29
             <View className='item-line title-one'>
23 30
               <Text className='title'>今天预估总收益</Text>
24
-              <Text className='money'>¥100.00</Text>
31
+              <Text className='money'>¥{today_data.assess_amount || '0.00'}</Text>
25 32
             </View>
26 33
             <View className='dotted-line'></View>
27 34
             <View className='item-line title-two'>
28 35
               <Text className='title'>预估推广收益</Text>
29
-              <Text className='money'>¥70.00</Text>
36
+              <Text className='money'>¥{today_data.assess_amount || '0.00'}</Text>
37
+            </View>
38
+          </View>
39
+          <View className='earnings-list-item'>
40
+            <View className='item-line title-one'>
41
+              <Text className='title'>本月预估总收益</Text>
42
+              <Text className='money'>¥{this_month_data.assess_amount || '0.00'}</Text>
30 43
             </View>
31
-            <View className='line'></View>
44
+            <View className='dotted-line'></View>
32 45
             <View className='item-line title-two'>
33 46
               <Text className='title'>预估推广收益</Text>
34
-              <Text className='money'>¥70.00</Text>
47
+              <Text className='money'>¥{this_month_data.assess_amount || '0.00'}</Text>
35 48
             </View>
36
-            <View className='item-line'>
37
-              <Text className='title'>惊喜红包</Text>
38
-              <Text className='money'>¥70.00</Text>
39
-            </View>
40
-            <View className='item-line'>
41
-              <Text className='title'>惊喜红包</Text>
49
+            {/* <View className='line'></View>
50
+            <View className='item-line title-two'>
51
+              <Text className='title'>预估推广收益</Text>
42 52
               <Text className='money'>¥70.00</Text>
43 53
             </View>
44 54
             <View className='item-line'>
45 55
               <Text className='title'>惊喜红包</Text>
46 56
               <Text className='money'>¥70.00</Text>
57
+            </View> */}
58
+          </View>
59
+          <View className='earnings-list-item'>
60
+            <View className='item-line title-one'>
61
+              <Text className='title'>上月预估总收益</Text>
62
+              <Text className='money'>¥{last_month_data.assess_amount || '0.00'}</Text>
47 63
             </View>
48
-            <View className='item-line'>
49
-              <Text className='title'>惊喜红包</Text>
50
-              <Text className='money'>¥70.00</Text>
64
+            <View className='dotted-line'></View>
65
+            <View className='item-line title-two'>
66
+              <Text className='title'>预估推广收益</Text>
67
+              <Text className='money'>¥{last_month_data.assess_amount || '0.00'}</Text>
51 68
             </View>
52
-            <View className='item-line'>
53
-              <Text className='title'>惊喜红包</Text>
54
-              <Text className='money'>¥70.00</Text>
69
+          </View>
70
+          <View className='earnings-list-item'>
71
+            <View className='item-line title-one'>
72
+              <Text className='title'>历史预估总收益</Text>
73
+              <Text className='money'>¥{historical_month_data.assess_amount || '0.00'}</Text>
55 74
             </View>
56
-            <View className='item-line'>
57
-              <Text className='title'>惊喜红包</Text>
58
-              <Text className='money'>¥70.00</Text>
75
+            <View className='dotted-line'></View>
76
+            <View className='item-line title-two'>
77
+              <Text className='title'>预估推广收益</Text>
78
+              <Text className='money'>¥{historical_month_data.assess_amount || '0.00'}</Text>
59 79
             </View>
60 80
           </View>
61 81
         </View>

+ 1 - 1
src/pages/memberSub/earningsDetail/index.less

@@ -20,7 +20,7 @@
20 20
             box-sizing: border-box;
21 21
             background-color: #fff;
22 22
             border-radius: 20px;
23
-
23
+            margin-bottom: 20px;
24 24
             .item-line {
25 25
                 display: flex;
26 26
                 justify-content: space-between;

+ 157 - 67
src/pages/memberSub/earningsOrder/index.jsx

@@ -1,40 +1,95 @@
1 1
 import { Component } from "react";
2
-import { View, Text, Image, Picker } from "@tarojs/components";
3
-import { AtDivider } from "taro-ui";
2
+import { View, Text, Image, Input } from "@tarojs/components";
3
+import { AtDivider, AtIcon, AtActivityIndicator } from "taro-ui";
4 4
 import "./index.less";
5
-import selectIcon from "../../../images/productManagement/selectIcon.png";
6 5
 import vip from "../../../images/earningsOrder/vip.png";
7 6
 import Taro from "@tarojs/taro";
7
+import { getEarningsOrderTab, getEarningsOrderList } from "../../../service";
8 8
 
9 9
 export default class Index extends Component {
10 10
   state = {
11 11
     current: 0,
12
-    productOptions: ["全部", "咸鱼商品", "自建商品"], //商品下拉选项
13
-    selectedProduct: "全部", //商品默认名称
14
-    timeOptions: ["全部时间", "一个月前", "一周前"], //下单时间下拉选项
15
-    selectTime: "下单时间", //下单时间
16
-    tabList: [
17
-      { title: "全部", num: 0 },
18
-      { title: "已付款", num: 0 },
19
-      { title: "已完成", num: 2 },
20
-      { title: "已结算", num: 10 },
21
-      { title: "无效", num: 0 },
22
-    ],
12
+    orderType: 2,//默认为推广订单
13
+    value: "", //搜索值
14
+    tabList: [{ title: "全部" }],
15
+    page: 1, //页数
16
+    loading: false, //加载状态
17
+    totalPages: 1, // 添加总页数
18
+    isNoMore: false,
19
+    orderList: [],//订单列表
20
+    userInfo: {},//个人信息
23 21
   };
22
+  componentDidShow() {
23
+    const { router } = Taro.getCurrentInstance();
24
+    const params = router.params;
25
+    this.setState({
26
+      orderType: params.type||2,
27
+    },()=>{
28
+      this.getEarningsOrderTab();
29
+    });
30
+  }
31
+  // 获取个人信息
32
+  getUserInfo = async () => {
33
+    const res = await getUserInfo();
34
+    this.setState({ userInfo: res });
35
+  }
36
+  // 获取收益订单列表
37
+  getEarningsOrderList = async (isRefresh) => {
38
+    const { page } = this.state;
39
+    this.setState({ loading: true });
40
+
41
+    const res = await getEarningsOrderList({
42
+      tab_name: this.state.tabList[this.state.current].title,
43
+      page,
44
+      page_size: 10,
45
+      search_name: this.state.value,
46
+      user_type:this.state.orderType
47
+    });
24 48
 
49
+    this.setState(
50
+      (prevState) => ({
51
+        orderList: isRefresh
52
+          ? res.income_list
53
+          : [...prevState.orderList, ...res.income_list],
54
+        totalPages: res.total_pages,
55
+        loading: false,
56
+        isNoMore: res.total_pages <= page,
57
+      }));
58
+  };
59
+  // 获取收益订单tab
60
+  getEarningsOrderTab = async () => {
61
+    const res = await getEarningsOrderTab();
62
+    const newTabList = res.tabs.map((item) => ({
63
+      title: item,
64
+    }));
65
+    this.setState({
66
+      tabList: newTabList,
67
+    },()=>{
68
+      this.getEarningsOrderList(true);
69
+    });
70
+  };
71
+  // 订单类型切换
72
+  handleOrderTypeClick = (type) => {
73
+    this.setState({ orderType: type, page: 1, value: '' },()=>{
74
+      this.getEarningsOrderList(true);
75
+    });
76
+  };
77
+  // tab切换
25 78
   handleTabClick = (index) => {
26
-    this.setState({ current: index });
79
+    this.setState({ current: index, page: 1, value: '' },()=>{
80
+      this.getEarningsOrderList(true);
81
+    });
27 82
   };
28
-  // 下单时间下拉选项
29
-  timeSelectOption = (e) => {
30
-    const selectTime = this.state.timeOptions[e.detail.value];
31
-    this.setState({ selectTime });
83
+  // 输入
84
+  handleChange = (e) => {
85
+    const value = e.detail.value;
86
+    this.setState({ value });
32 87
   };
33
-  // 商品下拉选项
34
-  productSelectOption = (e) => {
35
-    const selectedProduct = this.state.productOptions[e.detail.value];
36
-    this.setState({ selectedProduct });
88
+  // 搜索
89
+  handleSearch = () => {
90
+    this.getEarningsOrderList(true);
37 91
   };
92
+  // 复制
38 93
   handleCopy = async (text) => {
39 94
     try {
40 95
       await Taro.setClipboardData({
@@ -53,11 +108,29 @@ export default class Index extends Component {
53 108
       });
54 109
     }
55 110
   };
56
-
111
+  // 页面上拉触底
112
+  onReachBottom = () => {
113
+    const { page, totalPages, loading } = this.state;
114
+    if (page < totalPages && !loading) {
115
+      this.setState(
116
+        (prevState) => ({ page: prevState.page + 1 }),
117
+        () => this.getEarningsOrderList()
118
+      );
119
+    }
120
+  };
57 121
   render() {
58
-    const { current, tabList } = this.state;
122
+    const { current, tabList, value, orderList, loading, isNoMore, orderType } = this.state;
59 123
     return (
60 124
       <View className="index">
125
+        {/* 订单类型切换 */}
126
+        <View className="order-type-switch">
127
+          <View className={`order-type-item ${orderType == 2 ? "active" : ""}`} onClick={() => this.handleOrderTypeClick(2)}>
128
+            <Text>推广订单</Text>
129
+          </View>
130
+          <View className={`order-type-item ${orderType == 1 ? "active" : ""}`} onClick={() => this.handleOrderTypeClick(1)}>
131
+            <Text>购买订单</Text>
132
+          </View>
133
+        </View>
61 134
         {/* tab切换 */}
62 135
         <View className="tab-container">
63 136
           {tabList.map((tab, index) => (
@@ -67,65 +140,59 @@ export default class Index extends Component {
67 140
               onClick={() => this.handleTabClick(index)}
68 141
             >
69 142
               <Text>{tab.title}</Text>
70
-              {tab.num > 0 && <Text className="tag">{tab.num}</Text>}
143
+              {/* {tab.num > 0 && <Text className="tag">{tab.num}</Text>} */}
71 144
             </View>
72 145
           ))}
73 146
         </View>
74
-        {/* 下拉筛选 */}
75
-        <View className="filter-container">
76
-          <Picker
77
-            mode="selector"
78
-            range={this.state.timeOptions}
79
-            onChange={this.timeSelectOption}
80
-          >
81
-            <View className="filter-item">
82
-              <Text>{this.state.selectTime}</Text>
83
-              <Image src={selectIcon} className="select-icon" />
147
+        {/* 搜索 */}
148
+        <View className="search-container">
149
+          <View className="search-bar">
150
+            <AtIcon
151
+              className="search-icon"
152
+              value="search"
153
+              size="20"
154
+              color="#ACACAC"
155
+            ></AtIcon>
156
+            <Input
157
+              type="text"
158
+              className="search-input"
159
+              placeholder=""
160
+              value={value}
161
+              onInput={this.handleChange}
162
+            />
163
+            <View onClick={this.handleSearch} className="search-button">
164
+              搜索
84 165
             </View>
85
-          </Picker>
86
-          <Picker
87
-            mode="selector"
88
-            range={this.state.productOptions}
89
-            onChange={this.productSelectOption}
90
-          >
91
-            <View className="filter-item">
92
-              <Text>{this.state.selectedProduct}</Text>
93
-              <Image src={selectIcon} className="select-icon" />
94
-            </View>
95
-          </Picker>
166
+          </View>
96 167
         </View>
97 168
         {/* 订单列表 */}
98 169
         <View className="order-list">
99
-          <View className="order-item">
100
-            {/* 头部信息 */}
101
-            <View className="order-header">
170
+          {orderList.map((item, index) => (
171
+            <View className="order-item" key={index}>
172
+              {/* 头部信息 */}
173
+              {/* <View className="order-header">
102 174
               <View className="user-info">
103 175
                 <Image className="avatar" src="" />
104 176
                 <Text className="username">张三</Text>
105 177
               </View>
106
-              <Text className="pay-status">已付款</Text>
107
-            </View>
108
-            <AtDivider content="" />
178
+              <Text className="pay-status">{item.state_text}</Text>
179
+            </View> */}
109 180
             {/* 订单信息 */}
110 181
             <View className="order-info">
111 182
               <View className="order-details">
112 183
                 <View className="detail-item">
113 184
                   <Text className="label">订单编号:</Text>
114
-                  <Text className="value">2024031512345</Text>
185
+                  <Text className="value">{item.order_number}</Text>
115 186
                   <Text
116 187
                     className="copy-text"
117
-                    onClick={() => this.handleCopy("2024031512345")}
188
+                    onClick={() => this.handleCopy(item.order_number)}
118 189
                   >
119 190
                     复制
120 191
                   </Text>
121 192
                 </View>
122 193
                 <View className="detail-item">
123 194
                   <Text className="label">下单时间:</Text>
124
-                  <Text className="value">2024-03-15 12:34:56</Text>
125
-                </View>
126
-                <View className="detail-item">
127
-                  <Text className="label">订单类型:</Text>
128
-                  <Text className="value">普通订单</Text>
195
+                  <Text className="value">{item.pay_time}</Text>
129 196
                 </View>
130 197
               </View>
131 198
               <View className="member-info">
@@ -136,24 +203,47 @@ export default class Index extends Component {
136 203
 
137 204
             {/* 产品信息 */}
138 205
             <View className="product-info">
139
-              <Image className="product-image" src="" />
206
+              <Image mode="aspectFill" className="product-image" src={item.item_pic_url} />
140 207
               <View className="product-details">
141 208
                 <Text className="product-name">
142
-                  这是一个很长的产品名称这是一个很长的产品名称这是一个很长的产品名称
209
+                  {item.item_title}
143 210
                 </Text>
144
-                <View className="promotion-info">
145
-                  <View className="tag">推广收入</View>
146
-                  <Text className="amount">¥99.99</Text>
211
+                {orderType == 2 && (
212
+                  <View className="promotion-info">
213
+                    <View className="tag">推广收入</View>
214
+                    <Text className="amount">¥{item.assess_amount_text}</Text>
215
+                  </View>
216
+                )}
217
+                <View className="payment-info">
147 218
                 </View>
148 219
                 <View className="payment-info">
149 220
                   <Text className="label">实付金额:</Text>
150
-                  <Text className="amount">¥199.99</Text>
221
+                  <Text className="amount">¥{item.actual_paid_fee}</Text>
222
+                </View>
151 223
                 </View>
152 224
               </View>
153 225
             </View>
154
-          </View>
226
+          ))}
155 227
         </View>
228
+        {/* 加载中 */}
229
+        {loading && (
230
+          <View className="loading">
231
+            <AtActivityIndicator
232
+              content="加载中..."
233
+              isOpened={loading}
234
+              mode="center"
235
+              color="#fdf764"
236
+            />
237
+          </View>
238
+        )}
239
+        {/* 没有更多 */}
240
+        {isNoMore && (
241
+          <View className="no-more">
242
+            <AtDivider fontSize={18} fontColor="#949494" content="我是有底线的" />
243
+          </View>
244
+        )}
156 245
       </View>
157 246
     );
158 247
   }
159 248
 }
249
+

+ 64 - 18
src/pages/memberSub/earningsOrder/index.less

@@ -2,7 +2,27 @@
2 2
     background-color: #f9f9f9; // ... 其他样式 ...
3 3
     min-height: 100vh;
4 4
 }
5
-
5
+// 订单类型切换
6
+.order-type-switch {
7
+    display: flex;
8
+    justify-content: space-between;
9
+    background-color: #fff;
10
+    padding: 20px 134px 10px 134px;
11
+    align-items: center;
12
+    box-sizing: border-box;
13
+    .order-type-item {
14
+        font-size: 30px;
15
+        color: #999999;
16
+        padding: 7px 26px;
17
+        line-height: 43px;
18
+        box-sizing: border-box;
19
+        border-radius: 40px;
20
+    }
21
+    .order-type-item.active {
22
+        color: #fff;
23
+        background-color: #fa9703;
24
+    }
25
+}
6 26
 // tab切换
7 27
 .tab-container {
8 28
     display: flex;
@@ -10,7 +30,7 @@
10 30
     background-color: #fff;
11 31
     padding: 22px 34px;
12 32
     box-sizing: border-box;
13
-
33
+    align-items: center;
14 34
     .tab-item {
15 35
         font-size: 26px;
16 36
         color: #000000;
@@ -34,28 +54,41 @@
34 54
     }
35 55
 }
36 56
 
37
-// 下拉筛选
38
-.filter-container {
39
-    border-top: 1px solid #F4F4F4;
40
-    background-color: #fff;
41
-    height: 70px;
42
-    padding: 0 134px;
57
+// 搜索
58
+.search-container {
43 59
     display: flex;
44 60
     align-items: center;
45
-    justify-content: space-between;
61
+    justify-content: center;
62
+    position: relative;
63
+    background-color: #fff;
64
+    padding: 20px 34px;
46 65
 
47
-    .filter-item {
66
+    .search-bar {
67
+        width: 90%;
48 68
         display: flex;
49 69
         align-items: center;
50
-        font-size: 26px;
51
-        color: #000000;
70
+        border-radius: 14px;
71
+        padding:18px;
72
+        background-color: #f6f6f6;
52 73
 
53
-        .select-icon {
54
-            width: 14px;
55
-            height: 14px;
56
-            margin-left: 4px;
74
+        .search-icon {
75
+            margin-right: 18px;
76
+        }
77
+
78
+        .search-input {
79
+            flex: 1;
80
+            border: none;
81
+            outline: none;
82
+            background-color: transparent;
83
+        }
84
+
85
+        .search-button {
86
+            font-weight: 500;
87
+            font-size: 28px;
88
+            color: #FAA803;
57 89
         }
58 90
     }
91
+
59 92
 }
60 93
 
61 94
 // 订单列表样式
@@ -108,7 +141,7 @@
108 141
             display: flex;
109 142
             justify-content: space-between;
110 143
             padding-bottom: 24px;
111
-
144
+            padding-top: 24px;
112 145
             .order-details {
113 146
                 .detail-item {
114 147
                     display: flex;
@@ -165,7 +198,6 @@
165 198
             .product-image {
166 199
                 width: 297px;
167 200
                 height: 168px;
168
-                background-color: red;
169 201
                 border-radius: 8px;
170 202
                 margin-right: 16px;
171 203
             }
@@ -238,4 +270,18 @@
238 270
             }
239 271
         }
240 272
     }
273
+}
274
+// 加载中
275
+.loading {
276
+    width: 100%;
277
+    position: relative;
278
+    height: 60px;
279
+  }
280
+// 没有更多
281
+.no-more {
282
+    padding:0 33px;
283
+    box-sizing: border-box;
284
+    .at-divider__content{
285
+        background-color: #f9f9f9;
286
+    }
241 287
 }

+ 2 - 0
src/pages/memberSub/productManagement/index.less

@@ -86,6 +86,7 @@
86 86
         display: flex;
87 87
         justify-content: space-between;
88 88
         align-items: center;
89
+        z-index: 1;
89 90
         .bottom-buy-left {
90 91
             display: flex;
91 92
             align-items: center;
@@ -144,6 +145,7 @@
144 145
         width: 100%;
145 146
         height: 176px;
146 147
         background-color: #fff;
148
+        z-index: 1;
147 149
         .operation-product-top{
148 150
             height: 50%;
149 151
             display: flex;

+ 5 - 3
src/pages/memberSub/storeManagement/index.jsx

@@ -37,9 +37,11 @@ export default class Index extends Component {
37 37
       store_id: this.state.shopId,
38 38
       page,
39 39
       page_size: 10,
40
+      tag_name:'全部'
40 41
     }) : await getMyShopList({
41 42
       page,
42 43
       page_size: 10,
44
+      tag_name:'全部'
43 45
     });
44 46
 
45 47
     this.setState((prevState) => ({
@@ -52,7 +54,6 @@ export default class Index extends Component {
52 54
   componentDidShow() {
53 55
     const { router } = Taro.getCurrentInstance();
54 56
     const params = router.params;
55
-    console.log(params,1111);
56 57
     
57 58
     this.setState({
58 59
       isManager: JSON.parse(params.isManager), //是否是店长
@@ -81,9 +82,10 @@ export default class Index extends Component {
81 82
   };
82 83
   // 配置分享内容
83 84
   onShareAppMessage() {
85
+    const name = Taro.getStorageSync('userInfo').name;
84 86
     return {
85
-      title: "店铺",
86
-      path: `/pages/memberSub/storeManagement/index?shopId=${this.state.shopDetail.id}&isShare=true&isManager=false&&shareJump=${res.share_unique_value}`,
87
+      title: `${name}的店铺`,
88
+      path: `/pages/memberSub/storeManagement/index?shopId=${this.state.shopDetail.id}&isShare=true&isManager=false`,
87 89
       imageUrl: ''
88 90
     }
89 91
     return getShareJump({

+ 25 - 4
src/service/index.js

@@ -1,6 +1,6 @@
1 1
 //接口集成
2 2
 import Request from '../api/request';
3
-// ------------------------首页
3
+// -----------------------------------------------------------首页
4 4
 // 获取首页数据
5 5
 export const getHomeData = data =>
6 6
   Request({
@@ -57,7 +57,7 @@ export const getSearchProductList = data =>
57 57
     method: 'POST',
58 58
     data,
59 59
   })
60
-// -----------------------用户
60
+// -------------------------------------------------------------用户
61 61
 // 获取用户详情
62 62
 export const getUserInfo = data =>
63 63
   Request({
@@ -93,7 +93,7 @@ export const getShareJump = data =>
93 93
     method: 'POST',
94 94
     data,
95 95
   })
96
-// ---------------------会员
96
+// -------------------------------------------------------会员
97 97
 // 获取会员详情
98 98
 export const getVipInfo = data =>
99 99
   Request({
@@ -157,7 +157,28 @@ export const updateProductSort = data =>
157 157
     method: 'POST',
158 158
     data,
159 159
   })
160
-// -----------------------登录
160
+  // 收益订单tab
161
+  export const getEarningsOrderTab = data =>
162
+  Request({
163
+    url: '/vip/get_income_order_tabs',
164
+    method: 'POST',
165
+    data,
166
+  })
167
+  // 收益订单
168
+  export const getEarningsOrderList = data =>
169
+  Request({
170
+    url: '/vip/get_income_order_data',
171
+    method: 'POST',
172
+    data,
173
+  })
174
+  // 收益详情
175
+  export const getEarningsDetail = data =>
176
+  Request({
177
+    url: '/vip/get_income_order_detail',
178
+    method: 'POST',
179
+    data,
180
+  })
181
+// -----------------------------------------登录
161 182
 // 登录
162 183
 export const login = data =>
163 184
   Request({