名次

commpents/match-achieve/ranking.js

@@ -4,14 +4,14 @@ Component({
      * 组件的属性列表
      */
     properties: {
-
+        list: { type: Array },
     },
 
     /**
      * 组件的初始数据
      */
     data: {
-
+        
     },
 
     /**

commpents/match-achieve/ranking.less

@@ -0,0 +1,38 @@
+.list {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    padding: 5px;
+    background-color: #fff;
+    height: 50px;
+    margin: 0 0 4px 0;
+
+    .rank {
+        width: 50px;
+        height: 50px;
+        border-radius: 50%;
+        background-color: #cccccc;
+        text-align: center;
+        line-height: 50px;
+        color: #fff;
+        font-size: 18px;
+        font-weight: 700;
+    }
+
+    .rank_1 {
+        background-color: rgb(255, 196, 0);
+    }
+
+    .rank_2 {
+        background-color: rgb(219, 151, 48);
+    }
+
+    .rank_3 {
+        background-color: rgb(255, 114, 79);
+    }
+
+    .name {
+        width: 75vw;
+        line-height: 50px;
+    }
+}

commpents/match-achieve/ranking.wxml

@@ -1,2 +1,4 @@
-<!--commpents/match-achieve/ranking.wxml-->
-<text>commpents/match-achieve/ranking.wxml</text>
+<view class="list" wx:for="{{list}}" wx:key="item">
+    <view class=" rank {{index == '0' ? 'rank_1' : index=='1'? 'rank_2' :index=='2'?'rank_3':'rank'}}">{{index+1}}</view>
+    <view class="name">{{item.name}}</view>
+</view>

commpents/match-achieve/ranking.wxss

@@ -1 +1,33 @@
-/* commpents/match-achieve/ranking.wxss */
+.list {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  padding: 5px;
+  background-color: #fff;
+  height: 50px;
+  margin: 0 0 4px 0;
+}
+.list .rank {
+  width: 50px;
+  height: 50px;
+  border-radius: 50%;
+  background-color: #cccccc;
+  text-align: center;
+  line-height: 50px;
+  color: #fff;
+  font-size: 18px;
+  font-weight: 700;
+}
+.list .rank_1 {
+  background-color: #ffc400;
+}
+.list .rank_2 {
+  background-color: #db9730;
+}
+.list .rank_3 {
+  background-color: #ff724f;
+}
+.list .name {
+  width: 75vw;
+  line-height: 50px;
+}

pages/matchInfo/achieve.js

@@ -7,7 +7,7 @@ Page({
     data: {
         frameStyle: { useTop: true, name: '赛事信息', leftArrow: true, useBar: false },
         tabs: {
-            active: 'a',
+            active: 'c',
             list: [
                 { title: '小组赛', name: 'a' },
                 { title: '淘汰赛', name: 'b' },
@@ -17,7 +17,14 @@ Page({
             ],
         },
         options: {},
-        info: {}
+        info: {},
+        list: [
+            { name: '张三' },
+            { name: '李四' },
+            { name: '王二麻子' },
+            { name: '孙二' },
+            { name: '赵五' },
+        ]
     },
     // 跳转菜单
     back(e) {

pages/matchInfo/achieve.wxml

@@ -13,7 +13,7 @@
                         <achieve-2></achieve-2>
                     </view>
                     <view wx:elif="{{tabs.active=='c'}}" class="c">
-                        <achieve-3></achieve-3>
+                        <achieve-3 list="{{list}}"></achieve-3>
                     </view>
                     <view wx:elif="{{tabs.active=='d'}}" class="d">
                         <achieve-4></achieve-4>