Commit b3fdb6111175b790e5ab8ec8f86884662517460c

Authored by zhangyan
1 parent 47bd14ed

no message

@@ -2,6 +2,7 @@ @@ -2,6 +2,7 @@
2 "pages": [ 2 "pages": [
3 "pages/me/d_index", 3 "pages/me/d_index",
4 "pages/team/team", 4 "pages/team/team",
  5 + "pages/team/t_detail",
5 "pages/rank/rank", 6 "pages/rank/rank",
6 "pages/seller/seller", 7 "pages/seller/seller",
7 "pages/seller/s_detail", 8 "pages/seller/s_detail",
@@ -79,6 +79,9 @@ @@ -79,6 +79,9 @@
79 .bg-orange{ 79 .bg-orange{
80 background:#ffc16a; 80 background:#ffc16a;
81 } 81 }
  82 +.bg-gray{
  83 + background:#f7f7f7;
  84 +}
82 85
83 /*flex布局*/ 86 /*flex布局*/
84 .flex-lt{ 87 .flex-lt{
@@ -139,6 +142,14 @@ @@ -139,6 +142,14 @@
139 flex-direction: column; 142 flex-direction: column;
140 -webkit-flex-direction: column; 143 -webkit-flex-direction: column;
141 } 144 }
  145 +.flex-vr{
  146 + display: flex;
  147 + display: -webkit-flex;
  148 + justify-content: flex-end;
  149 + align-items: center;
  150 + flex-direction: column;
  151 + -webkit-flex-direction: column;
  152 +}
142 .flex-rr{ 153 .flex-rr{
143 display: flex; 154 display: flex;
144 display: -webkit-flex; 155 display: -webkit-flex;
@@ -185,4 +196,8 @@ page{ @@ -185,4 +196,8 @@ page{
185 .click-icon{ 196 .click-icon{
186 width:40rpx; 197 width:40rpx;
187 height:40rpx; 198 height:40rpx;
  199 +}
  200 +.cut{
  201 + width:100%;
  202 + height:20rpx;
188 } 203 }
@@ -3,17 +3,17 @@ Component({ @@ -3,17 +3,17 @@ Component({
3 list:[ 3 list:[
4 { 4 {
5 id:1, 5 id:1,
6 - title:'寄养所', 6 + title:'寄养寄养',
7 isactive:true 7 isactive:true
8 }, 8 },
9 { 9 {
10 id:2, 10 id:2,
11 - title:'医院', 11 + title:'宠物医院',
12 isactive:false 12 isactive:false
13 }, 13 },
14 { 14 {
15 id:3, 15 id:3,
16 - title:'美容', 16 + title:'美容洗澡',
17 isactive:false 17 isactive:false
18 } 18 }
19 ] 19 ]
1 -<view class="top-tab flex-cm bg-white fixed left top">  
2 - <view class="flex-lm">  
3 - <block wx:for="{{list}}">  
4 - <view class="black-font font32r {{item.isactive==true ? 'orange-font border-bottom' : ''}} top-tab-block flex-cm">{{item.title}}</view>  
5 - </block>  
6 - </view> 1 +<view class="top-tab flex-cm bg-white fixed left top flex-lr">
  2 + <block wx:for="{{list}}">
  3 + <view class="black-font font30r {{item.isactive==true ? 'orange-font border-bottom' : ''}} top-tab-block flex-cm">{{item.title}}</view>
  4 + </block>
7 </view> 5 </view>
@@ -5,13 +5,12 @@ @@ -5,13 +5,12 @@
5 padding:0 40rpx; 5 padding:0 40rpx;
6 box-sizing:border-box; 6 box-sizing:border-box;
7 z-index:99; 7 z-index:99;
8 - box-shadow:0 0 5px rgba(0,0,0,.1); 8 + border-bottom:1px solid #efeef3;
9 } 9 }
10 .top-tab-block{ 10 .top-tab-block{
11 padding:0 24rpx; 11 padding:0 24rpx;
12 height:76rpx; 12 height:76rpx;
13 box-sizing:border-bottom; 13 box-sizing:border-bottom;
14 - margin:0 35rpx;  
15 } 14 }
16 .border-bottom{ 15 .border-bottom{
17 padding-top:2px; 16 padding-top:2px;
1 -<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1540432983366" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8783" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><defs><style type="text/css"></style></defs><path d="M510.352119 912.416237c-220.548741 0-399.339141-178.82643-399.339141-399.403615S289.803378 113.622281 510.352119 113.622281c220.550637 0 399.341037 178.813156 399.341037 399.390341S730.902756 912.416237 510.352119 912.416237zM510.352119 163.544178c-192.982281 0-349.421037 156.461511-349.421037 349.468444S317.369837 862.482963 510.352119 862.482963s349.421037-156.463407 349.421037-349.470341S703.3344 163.544178 510.352119 163.544178zM660.104533 537.979259 535.313067 537.979259l0 124.81043c0 13.778489-11.174874 24.957156-24.959052 24.957156-13.784178 0-24.957156-11.178667-24.957156-24.957156l0-124.81043-124.795259 0c-13.784178 0-24.959052-11.17677-24.959052-24.966637 0-13.780385 11.17677-24.957156 24.959052-24.957156l124.795259 0 0-124.816119c0-13.778489 11.174874-24.951467 24.957156-24.951467 13.786074 0 24.959052 11.171081 24.959052 24.951467l0 124.816119 124.791467 0c13.786074 0 24.959052 11.17677 24.959052 24.957156C685.063585 526.802489 673.890607 537.979259 660.104533 537.979259z" p-id="8784" fill="#666666"></path></svg>  
@@ -104,5 +104,10 @@ Page({ @@ -104,5 +104,10 @@ Page({
104 sort:true, 104 sort:true,
105 home:false 105 home:false
106 }) 106 })
  107 + },
  108 + teamdetail:function(){
  109 + wx.navigateTo({
  110 + url:'../team/t_detail'
  111 + })
107 } 112 }
108 }) 113 })
@@ -110,21 +110,23 @@ @@ -110,21 +110,23 @@
110 </view> 110 </view>
111 <view class="pet-list"> 111 <view class="pet-list">
112 <block wx:for="{{blocks}}"> 112 <block wx:for="{{blocks}}">
113 - <view class="pet-list-single flex-lt"> 113 + <view class="pet-list-single flex-lt" bindtap="teamdetail">
114 <view><image class="pet-image" src="http://qn.colorcun.com/b.png" mode="scaleToFill"></image></view> 114 <view><image class="pet-image" src="http://qn.colorcun.com/b.png" mode="scaleToFill"></image></view>
115 <view class="pet-info"> 115 <view class="pet-info">
116 <view class="black-font font32r font-bold">#组队一起遛,组队一起遛</view> 116 <view class="black-font font32r font-bold">#组队一起遛,组队一起遛</view>
117 <view class="gray-deep-font font26r font-siny flex-lr" style="margin-top:14rpx;">唐城遗址公园<view>距离<text class="orange-font font30r">500</text>m</view></view> 117 <view class="gray-deep-font font26r font-siny flex-lr" style="margin-top:14rpx;">唐城遗址公园<view>距离<text class="orange-font font30r">500</text>m</view></view>
118 <view class="gray-deep-font font26r" style="margin-top:14rpx;">周四 11-01 16:40</view> 118 <view class="gray-deep-font font26r" style="margin-top:14rpx;">周四 11-01 16:40</view>
119 <view class="flex-lm" style="margin-top:20rpx;"> 119 <view class="flex-lm" style="margin-top:20rpx;">
120 - <block wx:for="{{pets}}"> 120 + <!--<block wx:for="{{pets}}">
121 <block wx:if="{{index<4}}"> 121 <block wx:if="{{index<4}}">
122 <image src="/pages/image/topic3.jpg" style="width:50rpx;height:50rpx;border-radius:50%;margin-right:10rpx;"></image> 122 <image src="/pages/image/topic3.jpg" style="width:50rpx;height:50rpx;border-radius:50%;margin-right:10rpx;"></image>
123 </block> 123 </block>
124 - </block>  
125 - <block wx:if="{{pets.length>4}}"> 124 + </block>-->
  125 + <image src="/pages/image/topic3.jpg" style="width:50rpx;height:50rpx;border-radius:50%;margin-right:10rpx;"></image>
  126 + <view class="gray-font font24r font-siny">爱喵铲屎官</view>
  127 + <!--<block wx:if="{{pets.length>4}}">
126 <view class="gray-deep-font font24r font-siny">等{{pets.length}}人加入</view> 128 <view class="gray-deep-font font24r font-siny">等{{pets.length}}人加入</view>
127 - </block> 129 + </block>-->
128 </view> 130 </view>
129 <!--<view class="pet-join orange-font font28r flex-cm">参与</view>--> 131 <!--<view class="pet-join orange-font font28r flex-cm">参与</view>-->
130 </view> 132 </view>
@@ -26,7 +26,7 @@ @@ -26,7 +26,7 @@
26 .banner-mask{ 26 .banner-mask{
27 width:100%; 27 width:100%;
28 height:100%; 28 height:100%;
29 - background:rgba(0,0,0,.2); 29 + background:rgba(0,0,0,.1);
30 position:absolute; 30 position:absolute;
31 left:0; 31 left:0;
32 top:0; 32 top:0;
1 <!--榜单--> 1 <!--榜单-->
2 <view class="rank"> 2 <view class="rank">
  3 + <view class="rank-head flex-lr">
  4 + <view class="rank-head-block flex-vc">
  5 + <view class="rank-com rank-F">
  6 + <view class="rank-com rank-S">
  7 + <view class="rank-com rank-T" style="background-image: url(http://qn.colorcun.com/b.png);"></view>
  8 + </view>
  9 + </view>
  10 + <view class="rank-sort white-font bg-orange flex-cm font28r">2</view>
  11 + <view class="black-font font32r rank-house-title">橙子小馒头</view>
  12 + <view class="rank-pet-title flex-cm">
  13 + <view class="black-font font26r">小煎包</view>
  14 + <view class="gray-deep-font font24r" style="margin-left:10rpx;">16个月</view>
  15 + </view>
  16 + <view class="rank-care flex-cm">
  17 + <image src="/pages/image/collection.svg" class="rank-care-icon"></image>
  18 + <view class="gray-deep-font font26r font-siny">10012</view>
  19 + </view>
  20 + <view class="rank-care-act orange-font font28r flex-cm">关 注</view>
  21 + </view>
  22 + <view class="rank-head-block flex-vc rank-head-block-active">
  23 + <view class="rank-com rank-F">
  24 + <view class="rank-com rank-S">
  25 + <view class="rank-com rank-T" style="background-image: url(http://qn.colorcun.com/b.png);"></view>
  26 + </view>
  27 + </view>
  28 + <view class="rank-sort white-font bg-orange flex-cm font28r" style="width:46rpx;height:46rpx;top:-40rpx;">1</view>
  29 + <view class="black-font font34r rank-house-title font-bold">橙子小馒头</view>
  30 + <view class="rank-pet-title flex-cm">
  31 + <view class="black-font font30r">小煎包</view>
  32 + <view class="gray-deep-font font26r" style="margin-left:10rpx;">16个月</view>
  33 + </view>
  34 + <view class="rank-care flex-cm">
  35 + <image src="/pages/image/collection.svg" class="rank-care-icon" style="width:36rpx;height:36rpx;"></image>
  36 + <view class="gray-deep-font font28r">10023</view>
  37 + </view>
  38 + <view class="rank-care-act orange-font font30r flex-cm">关 注</view>
  39 + </view>
  40 + <view class="rank-head-block flex-vc">
  41 + <view class="rank-com rank-F">
  42 + <view class="rank-com rank-S">
  43 + <view class="rank-com rank-T" style="background-image: url(http://qn.colorcun.com/b.png);"></view>
  44 + </view>
  45 + </view>
  46 + <view class="rank-sort white-font bg-orange flex-cm font28r">3</view>
  47 + <view class="black-font font32r rank-house-title">橙子小馒头</view>
  48 + <view class="rank-pet-title flex-cm">
  49 + <view class="black-font font26r">小煎包</view>
  50 + <view class="gray-deep-font font24r" style="margin-left:10rpx;">16个月</view>
  51 + </view>
  52 + <view class="rank-care flex-cm">
  53 + <image src="/pages/image/collection.svg" class="rank-care-icon"></image>
  54 + <view class="gray-deep-font font26r font-siny">10001</view>
  55 + </view>
  56 + <view class="rank-care-act orange-font font28r flex-cm">关 注</view>
  57 + </view>
  58 + </view>
  59 + <view class="cut bg-gray"></view>
3 <block wx:for="{{blocks}}"> 60 <block wx:for="{{blocks}}">
4 <view class="rank-block bg-white flex-lm"> 61 <view class="rank-block bg-white flex-lm">
5 - <image src="/pages/image/topic2.jpg" class="rank-headimg"></image>  
6 - <view class="flex-vl rank-info">  
7 - <view class="flex-lr" style="width:100%;">  
8 - <view>  
9 - <view class="black-font font-bold font32r" style="margin-bottom:14rpx;">小煎包</view>  
10 - <view class="gray-font font20r font-siny">1岁零2个月</view> 62 + <view class="gray-deep-font font30r">{{index+4}}</view>
  63 + <image src="/pages/image/topic3.jpg" class="rank-headimg"></image>
  64 + <view class="flex-lr rank-info">
  65 + <view class="flex-vl" style="width:100%;">
  66 + <view class="black-font font-bold font34r" style="margin-bottom:14rpx;">橙子小馒头</view>
  67 + <view class="flex-lm">
  68 + <view class="black-font font28r font-siny">小煎包</view>
  69 + <view class="gray-deep-font font24r font-siny" style="margin-left:12rpx;">18个月</view>
11 </view> 70 </view>
12 - <view class="orange-font font28r rank-title flex-cm">活跃之星</view>  
13 </view> 71 </view>
14 - <view class="black-font font26r font-siny rank-info-detail font-more-two">虽然到目前为止家里还没进过贼,但是,这种事情最好别发生了,我对我家那傻狗没信心等等等等</view> 72 + <view class="rank-info-care flex-lm">
  73 + <image src="/pages/image/collection.svg" class="rank-care-icon"></image>
  74 + <view class="gray-deep-font font26r font-siny">10001</view>
  75 + </view>
15 </view> 76 </view>
16 </view> 77 </view>
17 </block> 78 </block>
@@ -4,33 +4,122 @@ @@ -4,33 +4,122 @@
4 padding-bottom:120rpx; 4 padding-bottom:120rpx;
5 margin-top:30rpx; 5 margin-top:30rpx;
6 } 6 }
  7 +.rank-head{
  8 + width:100%;
  9 + padding:0 30rpx;
  10 + padding-bottom:40rpx;
  11 + box-sizing:border-box;
  12 +}
  13 +.rank-head-block{
  14 +
  15 +}
  16 +.rank-com{
  17 + width:160rpx;
  18 + height:200rpx;
  19 + overflow: hidden;
  20 + background:pink;
  21 +}
  22 +.rank-F, .rank-S{
  23 + visibility: hidden;
  24 +}
  25 +.rank-F{
  26 + transform: rotate(120deg);
  27 + -ms-transform: rotate(120deg);
  28 + -moz-transform: rotate(120deg);
  29 + -webkit-transform: rotate(120deg);
  30 +}
  31 +.rank-S{
  32 + transform: rotate(-60deg);
  33 + -ms-transform: rotate(-60deg);
  34 + -moz-transform: rotate(-60deg);
  35 + -webkit-transform: rotate(-60deg);
  36 +}
  37 +.rank-T{
  38 + transform: rotate(-60deg);
  39 + -ms-transform: rotate(-60deg);
  40 + -moz-transform: rotate(-60deg);
  41 + -webkit-transform: rotate(-60deg);
  42 + visibility: visible;
  43 + background: no-repeat 50% center;
  44 + background-size: 200% auto;
  45 +}
  46 +.rank-sort{
  47 + width:40rpx;
  48 + height:40rpx;
  49 + border-radius:50%;
  50 + position:relative;
  51 + top:-30rpx;
  52 +}
  53 +.rank-house-title{
  54 + margin-top:14rpx;
  55 +}
  56 +.rank-pet-title{
  57 + margin-top:10rpx;
  58 +}
  59 +.rank-care{
  60 + margin-top:14rpx;
  61 +}
  62 +.rank-care-icon{
  63 + width:30rpx;
  64 + height:30rpx;
  65 + margin-right:10rpx;
  66 +}
  67 +.rank-care-act{
  68 + width:120rpx;
  69 + height:46rpx;
  70 + border:1px solid #fe9401;
  71 + border-radius:23rpx;
  72 + margin-top:22rpx;
  73 +}
  74 +.rank-head-block-active{
  75 + width:190rpx;
  76 +}
  77 +.rank-head-block-active .rank-com{
  78 + width:190rpx;
  79 + height:237.5rpx;
  80 +}
  81 +.rank-head-block-active .rank-house-title{
  82 + margin-top:-30rpx;
  83 +}
  84 +.rank-head-block-active .rank-pet-title{
  85 + margin-top:10rpx;
  86 +}
  87 +.rank-head-block-active .rank-care{
  88 + margin-top:10rpx;
  89 +}
  90 +.rank-head-block-active .rank-care-act{
  91 + width:140rpx;
  92 + height:50rpx;
  93 + border:1px solid #fe9401;
  94 + border-radius:25rpx;
  95 + margin-top:18rpx;
  96 +}
7 .rank-block{ 97 .rank-block{
8 - width:690rpx;  
9 - height:210rpx; 98 + width:100%;
  99 + height:170rpx;
10 margin:0 auto; 100 margin:0 auto;
11 - box-shadow:0 0 5px rgba(0,0,0,.1);  
12 - margin-bottom:30rpx; 101 + border-bottom:1px solid #efeef3;
13 padding:0 30rpx; 102 padding:0 30rpx;
14 box-sizing:border-box; 103 box-sizing:border-box;
15 border-radius:10rpx; 104 border-radius:10rpx;
16 } 105 }
17 .rank-headimg{ 106 .rank-headimg{
18 - width:140rpx;  
19 - height:140rpx;  
20 - border-radius:10rpx; 107 + width:110rpx;
  108 + height:110rpx;
  109 + border-radius:50%;
  110 + margin-left:30rpx;
21 } 111 }
22 .rank-info{ 112 .rank-info{
23 - width:490rpx; 113 + width:520rpx;
24 padding-left:20rpx; 114 padding-left:20rpx;
25 box-sizing:border-box; 115 box-sizing:border-box;
26 } 116 }
27 -.rank-info-detail{  
28 - width:100%; 117 +.rank-info-care{
29 margin-top:14rpx; 118 margin-top:14rpx;
30 } 119 }
31 .rank-title{ 120 .rank-title{
32 - height:44rpx;  
33 - padding:0 16rpx; 121 + width:120rpx;
  122 + height:46rpx;
34 border-radius:22rpx; 123 border-radius:22rpx;
35 border:1px solid #fe9401; 124 border:1px solid #fe9401;
36 } 125 }
1 <toptab></toptab> 1 <toptab></toptab>
2 -<!--<view class="seller-server flex-lr">  
3 - <block wx:for="{{sellericons}}">  
4 - <view class="flex-vc">  
5 - <image src="{{item.isactive==true ? item.iconactive : item.icon}}" class="seller-icon" style="width:{{item.widhei}}rpx;height:{{item.widhei}}rpx;margin-bottom:{{item.marbottom}}rpx;"></image>  
6 - <view class="{{item.isactive==true ? 'orange-font' : 'gray-deep-font'}} font28r font-siny">{{item.title}}</view>  
7 - </view>  
8 - </block>  
9 -</view>-->  
10 -<view class="banner"> 2 +<!--<view class="banner">
11 <image src="/pages/image/seller-detail.jpg" class="banner-img"></image> 3 <image src="/pages/image/seller-detail.jpg" class="banner-img"></image>
12 -</view> 4 +</view>-->
13 <view class="seller-list"> 5 <view class="seller-list">
14 <view class="best-info-title flex-cm"> 6 <view class="best-info-title flex-cm">
15 <view class="best-line bg-black"></view> 7 <view class="best-line bg-black"></view>
@@ -18,6 +10,19 @@ @@ -18,6 +10,19 @@
18 <view class="best-react bg-black"></view> 10 <view class="best-react bg-black"></view>
19 <view class="best-line bg-black"></view> 11 <view class="best-line bg-black"></view>
20 </view> 12 </view>
  13 + <swiper next-margin="90rpx" display-multiple-items="2">
  14 + <block wx:for="{{sellericons}}">
  15 + <swiper-item>
  16 + <view class="recommand-seller">
  17 + <image src="/pages/image/seller-detail.jpg" class="recommand-seller-image"></image>
  18 + <view class="recommand-seller-info flex-lr">
  19 + <view class="black-font font30r font-bold">爱家生活馆</view>
  20 + <view class="orange-font font28r ">2.5km</view>
  21 + </view>
  22 + </view>
  23 + </swiper-item>
  24 + </block>
  25 + </swiper>
21 <block wx:for="{{sellericons}}"> 26 <block wx:for="{{sellericons}}">
22 <view class="flex-lm seller-block" bindtap="sellerdetail"> 27 <view class="flex-lm seller-block" bindtap="sellerdetail">
23 <image src="/pages/image/pet-seller.jpg" class="seller-image"></image> 28 <image src="/pages/image/pet-seller.jpg" class="seller-image"></image>
1 -.seller-server{  
2 - width:100%;  
3 - height:140rpx;  
4 - padding:0 80rpx;  
5 - box-sizing:border-box;  
6 -}  
7 -.seller-icon{  
8 - width:40rpx;  
9 - height:40rpx;  
10 - margin-bottom:10rpx;  
11 -}  
12 -.banner{ 1 +.seller-list{
13 margin-top:80rpx; 2 margin-top:80rpx;
14 - margin-bottom:40rpx;  
15 -}  
16 -.banner-img{  
17 - width:100%;  
18 - height:400rpx;  
19 } 3 }
20 .best-info-title{ 4 .best-info-title{
21 - margin:40rpx 0; 5 + padding:30rpx 0;
22 } 6 }
23 .best-react{ 7 .best-react{
24 width:8rpx; 8 width:8rpx;
@@ -29,6 +13,29 @@ @@ -29,6 +13,29 @@
29 width:80rpx; 13 width:80rpx;
30 height:1px; 14 height:1px;
31 } 15 }
  16 +swiper{
  17 + width:100%;
  18 + height:280rpx;
  19 + border-bottom:1px solid #efeef3;
  20 +}
  21 +swiper-item{
  22 + width:330rpx!important;
  23 +}
  24 +.recommand-seller{
  25 + width:300rpx;
  26 + margin-left:30rpx;
  27 +}
  28 +.recommand-seller-image{
  29 + width:100%;
  30 + height:200rpx;
  31 + border-radius:12rpx;
  32 +}
  33 +.recommand-seller-info{
  34 + width:100%;
  35 + height:70rpx;
  36 + padding:0 8rpx;
  37 + box-sizing:border-box;
  38 +}
32 .seller-list{ 39 .seller-list{
33 padding-bottom:120rpx; 40 padding-bottom:120rpx;
34 } 41 }
@@ -42,9 +49,10 @@ @@ -42,9 +49,10 @@
42 border-bottom:1px solid #efeef3; 49 border-bottom:1px solid #efeef3;
43 } 50 }
44 .seller-image{ 51 .seller-image{
45 - width:240rpx; 52 + width:260rpx;
46 height:180rpx; 53 height:180rpx;
47 margin-right:30rpx; 54 margin-right:30rpx;
  55 + border-radius:12rpx;
48 } 56 }
49 .seller-book{ 57 .seller-book{
50 height:40rpx; 58 height:40rpx;
  1 +Page({
  2 + data:{
  3 + joiner:[1,2,3,4,5]
  4 + }
  5 +})
  1 +<view>
  2 + <view class="banner-main">
  3 + <image src="http://qn.colorcun.com/b.png" class="banner-img"></image>
  4 + <view class="banner-mask flex-vl">
  5 + <view class="white-font font-bold font36r" style="margin-top:20rpx;">#组队一起遛,组队一起遛</view>
  6 + <view class="team-detail">
  7 + <view class="white-font font28r font-siny">地址:西安市雁塔区唐城遗址公园</view>
  8 + <view class="white-font font28r font-siny">时间:周四 11-01 16:50</view>
  9 + </view>
  10 + <view class="white-font font26r font-siny team-share flex-cm">分享行程</view>
  11 + </view>
  12 + </view>
  13 + <view class="team-info bg-white">
  14 + <view class="team-person flex-lr">
  15 + <view class="flex-lm">
  16 + <image src="/pages/image/topic3.jpg" class="team-homimg"></image>
  17 + <view class="orange-font font28r font-siny">爱喵铲屎官</view>
  18 + </view>
  19 + <view class="bg-orange white-font flex-cm font24r team-join">参与</view>
  20 + </view>
  21 + <view class="team-info-content black-font font28r font-siny flex-vl">
  22 + <view>相约一起周末遛宠,</view>
  23 + <view>晒晒太阳,</view>
  24 + <view>打发时间</view>
  25 + </view>
  26 + <view style="height:20rpx;background:#f7f7f7;"></view>
  27 + <view class="gray-deep-font font26r font-siny joiner-count flex-cm">
  28 + <view class="joiner-line"></view>
  29 + <view style="padding:0 12rpx;">共{{joiner.length+1}}人参与</view>
  30 + <view class="joiner-line"></view>
  31 + </view>
  32 + <view class="joiner-list">
  33 + <view class="flex-lr joiner-single">
  34 + <view class="flex-lm">
  35 + <image src="/pages/image/topic2.jpg" class="joiner-img"></image>
  36 + <view class="black-font font26r font-siny">爱喵铲屎官</view>
  37 + </view>
  38 + <view class="gray-deep-font font26r font-siny">发起者</view>
  39 + </view>
  40 + <block wx:for="{{joiner}}">
  41 + <view class="flex-lr joiner-single">
  42 + <view class="flex-lm">
  43 + <image src="http://qn.colorcun.com/b.png" class="joiner-img"></image>
  44 + <view class="black-font font26r font-siny">橙子小馒头</view>
  45 + </view>
  46 + <view class="gray-font font26r font-siny">参与者</view>
  47 + </view>
  48 + </block>
  49 + </view>
  50 + </view>
  51 +</view>
  1 +.banner-main{
  2 + width:100%;
  3 + height:400rpx;
  4 + position:relative;
  5 +}
  6 +.banner-img{
  7 + width:100%;
  8 + height:100%;
  9 +}
  10 +.banner-mask{
  11 + width:100%;
  12 + height:100%;
  13 + padding:30rpx;
  14 + box-sizing:border-box;
  15 + background:rgba(0,0,0,.1);
  16 + position:absolute;
  17 + left:0;
  18 + top:0;
  19 +}
  20 +.team-share{
  21 + width:140rpx;
  22 + height:46rpx;
  23 + border:1px solid #fafafa;
  24 + border-radius:23rpx;
  25 + position:absolute;
  26 + right:40rpx;
  27 + bottom:50rpx;
  28 +}
  29 +.team-info{
  30 + width:100%;
  31 + min-height:500rpx;
  32 + padding:30rpx 0;
  33 + box-sizing:border-box;
  34 + position:relative;
  35 + top:-20rpx;
  36 + border-top-left-radius:20rpx;
  37 + border-top-right-radius:20rpx;
  38 + overflow:hidden;
  39 + margin-bottom:30rpx;
  40 +}
  41 +.team-person{
  42 + width:670rpx;
  43 + padding:0 14rpx;
  44 + padding-bottom:30rpx;
  45 + border-bottom:1px solid #efeef3;
  46 + box-sizing:border-box;
  47 + margin:0 auto;
  48 +}
  49 +.team-homimg{
  50 + width:70rpx;
  51 + height:70rpx;
  52 + border-radius:50%;
  53 + margin-right:14rpx;
  54 +}
  55 +.team-join{
  56 + width:120rpx;
  57 + height:50rpx;
  58 + border-radius:25rpx;
  59 +}
  60 +.team-detail{
  61 + width:60%;
  62 + padding-top:24rpx;
  63 + margin-left:40%;
  64 +}
  65 +.team-detail>view{
  66 + margin-top:20rpx;
  67 +}
  68 +.team-info-content{
  69 + width:670rpx;
  70 + margin:0 auto;
  71 + padding:50rpx 20rpx;
  72 + line-height:1.8;
  73 +}
  74 +.joiner-count{
  75 + padding:30rpx 40rpx;
  76 +}
  77 +.joiner-line{
  78 + width:60rpx;
  79 + height:1px;
  80 + background:#999;
  81 +}
  82 +.joiner-list{
  83 + width:670rpx;
  84 + margin:0 auto;
  85 +}
  86 +.joiner-single{
  87 + width:100%;
  88 + padding:20rpx 0;
  89 +}
  90 +.joiner-img{
  91 + width:60rpx;
  92 + height:60rpx;
  93 + border-radius:50%;
  94 + margin-right:14rpx;
  95 +}
@@ -20,5 +20,16 @@ Page({ @@ -20,5 +20,16 @@ Page({
20 }, 20 },
21 ], 21 ],
22 pets:[1,2,3,4,5,6] 22 pets:[1,2,3,4,5,6]
  23 + },
  24 + onLoad:function(){
  25 +
  26 + },
  27 + onShow:function(){
  28 +
  29 + },
  30 + teamdetail:function(){
  31 + wx.navigateTo({
  32 + url:'t_detail'
  33 + })
23 } 34 }
24 }) 35 })
@@ -21,24 +21,27 @@ @@ -21,24 +21,27 @@
21 </view> 21 </view>
22 </view> 22 </view>
23 </view>--> 23 </view>-->
24 - <view class="pet-list-single flex-lt">  
25 - <view><image class="pet-image" src="http://qn.colorcun.com/b.png" mode="scaleToFill"></image></view>  
26 - <view class="pet-info">  
27 - <view class="black-font font32r font-bold" style="width:450rpx;">#组队一起遛,组队一起遛</view>  
28 - <view class="gray-deep-font font26r font-siny flex-lr" style="margin-top:14rpx;">唐城遗址公园<view>距离<text class="orange-font font30r">500</text>m</view></view>  
29 - <view class="gray-deep-font font26r" style="margin-top:14rpx;">周四 11-01 16:40</view>  
30 - <view class="flex-lm" style="margin-top:20rpx;">  
31 - <block wx:for="{{pets}}"> 24 + <view class="pet-list-single flex-lt" bindtap="teamdetail">
  25 + <view><image class="pet-image" src="http://qn.colorcun.com/b.png" mode="scaleToFill"></image></view>
  26 + <view class="pet-info">
  27 + <view class="black-font font32r font-bold" style="width:450rpx;">#组队一起遛,组队一起遛</view>
  28 + <view class="gray-deep-font font26r font-siny flex-lr" style="margin-top:14rpx;">唐城遗址公园<view>距离<text class="orange-font font30r">500</text>m</view></view>
  29 + <view class="gray-deep-font font26r" style="margin-top:14rpx;">周四 11-01 16:40</view>
  30 + <view class="flex-lm" style="margin-top:20rpx;">
  31 + <!--<block wx:for="{{pets}}">
32 <block wx:if="{{index<4}}"> 32 <block wx:if="{{index<4}}">
33 <image src="/pages/image/topic3.jpg" style="width:50rpx;height:50rpx;border-radius:50%;margin-right:10rpx;"></image> 33 <image src="/pages/image/topic3.jpg" style="width:50rpx;height:50rpx;border-radius:50%;margin-right:10rpx;"></image>
34 </block> 34 </block>
35 - </block>  
36 - <block wx:if="{{pets.length>4}}"> 35 + </block>-->
  36 + <!--<block wx:if="{{pets.length>4}}">
37 <view class="gray-deep-font font24r font-siny">等{{pets.length}}人加入</view> 37 <view class="gray-deep-font font24r font-siny">等{{pets.length}}人加入</view>
38 - </block>  
39 - </view> 38 + </block>-->
  39 + <image src="/pages/image/topic3.jpg" style="width:50rpx;height:50rpx;border-radius:50%;margin-right:10rpx;"></image>
  40 + <view class="gray-font font24r font-siny">爱喵铲屎官</view>
  41 + </view>
  42 +
40 <!--<view class="pet-join orange-font font28r flex-cm">参与</view>--> 43 <!--<view class="pet-join orange-font font28r flex-cm">参与</view>-->
41 - </view> 44 + </view>
42 </view> 45 </view>
43 </block> 46 </block>
44 <view class="gray-font font26r flex-cm" style="padding:20rpx 0;">已经到底啦~</view> 47 <view class="gray-font font26r flex-cm" style="padding:20rpx 0;">已经到底啦~</view>