ui end

pages/chart/group/index.js

@@ -1,5 +1,16 @@
 Page({
-    data: {},
+    data: {
+        typeName: '宠物',
+        billList: [
+            {"title":"狗粮","type":"expend","dateTime":"01-06","from":"支付宝","money":"35.00"},
+            {"title":"狗粮","type":"expend","dateTime":"01-06","from":"支付宝","money":"35.00"},
+            {"title":"狗粮","type":"expend","dateTime":"01-06","from":"支付宝","money":"35.00"},
+            {"title":"猫抓板","type":"expend","dateTime":"01-06","from":"支付宝","money":"35.00"},
+            {"title":"狗粮","type":"expend","dateTime":"01-06","from":"支付宝","money":"35.00"},
+            {"title":"狗粮","type":"expend","dateTime":"01-06","from":"支付宝","money":"35.00"},
+            {"title":"狗粮","type":"expend","dateTime":"01-06","from":"支付宝","money":"35.00"},
+        ]
+    },
     onLoad: function (options) {
 
     }

pages/chart/group/index.wxml

@@ -0,0 +1,23 @@
+<view class="main_look">
+    <view class="look_content">
+        <view class="pay_look">
+            <view class="inline_box font_big">{{typeName}}分类总计</view>
+        </view>
+        <view class="pay_look">
+            <text class="center_look font_big">{{ 89310.23 }}</text>
+        </view>
+    </view>
+</view>
+<view wx:if="{{billList != null && billList.length > 0}}">
+    <t-cell-group theme="card">
+        <t-cell wx:for="{{billList}}" wx:key="index"
+                title="{{item.title}}"
+                description="{{item.dateTime}} • {{item.from}}"
+                align="top"
+                image="/image/bill/5.png"
+                note="{{item.money}}"
+                class="t-cell-{{item.type}}"
+                url="{{'/pages/bill/index?id=' + item.id}}"
+        />
+    </t-cell-group>
+</view>

pages/chart/group/index.wxss

@@ -0,0 +1,19 @@
+.main_look {
+    padding: 0 30rpx;
+    margin-bottom: 20rpx;
+}
+.look_content {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    height: 200rpx;
+    background-color: #111111;
+    background-size:100% 100%;
+    font-weight: bold;
+}
+.pay_look {
+    padding: 0 20rpx;
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+}