diff --git a/app.js b/app.js
index 73eb13e..2298819 100644
--- a/app.js
+++ b/app.js
@@ -20,33 +20,33 @@ App({
TRANSFER: 'TRANSFER',
REPAYMENT: 'REPAYMENT',
billIcon : [
- {label: '度假', icon: '/image/bill/0.png'},
- {label: '电影', icon: '/image/bill/1.png'},
- {label: '聚餐', icon: '/image/bill/2.png'},
- {label: '网购', icon: '/image/bill/3.png'},
- {label: '医疗', icon: '/image/bill/4.png'},
- {label: '游戏', icon: '/image/bill/5.png'},
- {label: '孩子', icon: '/image/bill/6.png'},
- {label: '化妆品', icon: '/image/bill/7.png'},
- {label: '生日', icon: '/image/bill/8.png'},
- {label: '车票', icon: '/image/bill/9.png'},
- {label: '水果', icon: '/image/bill/10.png'},
- {label: '红包', icon: '/image/bill/11.png'},
- {label: '借钱', icon: '/image/bill/11.png'}
+ {icon: '/image/bill/0.png'},
+ {icon: '/image/bill/1.png'},
+ {icon: '/image/bill/2.png'},
+ {icon: '/image/bill/3.png'},
+ {icon: '/image/bill/4.png'},
+ {icon: '/image/bill/5.png'},
+ {icon: '/image/bill/6.png'},
+ {icon: '/image/bill/7.png'},
+ {icon: '/image/bill/8.png'},
+ {icon: '/image/bill/9.png'},
+ {icon: '/image/bill/10.png'},
+ {icon: '/image/bill/11.png'},
+ {icon: '/image/bill/12.png'}
],
accountIcon : [
- {label: '工商银行', icon: '/image/account/0.png'},
- {label: '基金', icon: '/image/account/1.png'},
- {label: '交通银行', icon: '/image/account/2.png'},
- {label: '农信社', icon: '/image/account/3.png'},
- {label: '农业银行', icon: '/image/account/4.png'},
- {label: '建设银行', icon: '/image/account/5.png'},
- {label: '招商银行', icon: '/image/account/6.png'},
- {label: '中国银行', icon: '/image/account/7.png'},
- {label: '现金', icon: '/image/account/8.png'},
- {label: '微信', icon: '/image/account/9.png'},
- {label: '负债', icon: '/image/account/10.png'},
- {label: '支付宝', icon: '/image/account/11.png'}
+ {icon: '/image/account/0.png'},
+ {icon: '/image/account/1.png'},
+ {icon: '/image/account/2.png'},
+ {icon: '/image/account/3.png'},
+ {icon: '/image/account/4.png'},
+ {icon: '/image/account/5.png'},
+ {icon: '/image/account/6.png'},
+ {icon: '/image/account/7.png'},
+ {icon: '/image/account/8.png'},
+ {icon: '/image/account/9.png'},
+ {icon: '/image/account/10.png'},
+ {icon: '/image/account/11.png'}
]
},
$api: api,
diff --git a/app.wxss b/app.wxss
index 8458ada..e02345e 100644
--- a/app.wxss
+++ b/app.wxss
@@ -89,7 +89,6 @@ t-cell {
}
/* 占位置 */
.empty-view {
- color: red;
margin-top: 200rpx;
}
.placeholder {
diff --git a/pages/account/detail/index.js b/pages/account/detail/index.js
index f407dcd..1c1007d 100644
--- a/pages/account/detail/index.js
+++ b/pages/account/detail/index.js
@@ -27,6 +27,9 @@ Page({
this.setData({dateRange,dateRangeText})
},
onShow() {
+ this.updateList()
+ },
+ updateList() {
app.$api.listBillByAccount({
sid:this.data.sid,
dateRange:this.data.dateRangeText,
@@ -55,6 +58,7 @@ Page({
dateRange: value,
dateRangeText: valueText
});
+ this.updateList()
},
showDialog() {
diff --git a/pages/chart/index.js b/pages/chart/index.js
index 4c3d6d2..11e2dd5 100644
--- a/pages/chart/index.js
+++ b/pages/chart/index.js
@@ -1,128 +1,51 @@
+const app = getApp();
import * as echarts from '../../ec-canvas/echarts';
let pieData = [];
+let pieChart;
+let line1Chart;
let line1Data = [];
+let line2Chart;
let line2Data = [];
function initPieChart(canvas, width, height, dpr) {
- if (pieData.length <= 0){
- return;
- }
- const chart = echarts.init(canvas, null, {
+ pieChart = echarts.init(canvas, null, {
width: 400,
height: 250,
devicePixelRatio: dpr // new
});
- canvas.setChart(chart);
- var option = {
- backgroundColor: "#3C4043",
- series: [{
- label: {
- normal: {
- fontSize: 14
- }
- },
- type: 'pie',
- center: ['50%', '50%'],
- radius: ['0%', '70%'],
- data: pieData
- }]
- };
- chart.setOption(option);
- chart.on('click', 'series.pie', function(param) {
- console.log(param);
+ canvas.setChart(pieChart);
+ let option = app.$utils.getPieOption(pieData);
+ pieChart.setOption(option);
+ pieChart.on('click', 'series.pie', function(param) {
wx.navigateTo({
url: "./group/index?expendId=" + param.data.sId + '&rangeDate=' + param.data.sDate
})
});
- return chart;
+ return pieChart
}
-
function initLineChart1(canvas, width, height, dpr) {
- const chart = echarts.init(canvas, null, {
+ line1Chart = echarts.init(canvas, null, {
width: 400,
height: 300,
devicePixelRatio: dpr // new
});
- canvas.setChart(chart);
- var option = {
- legend: {
- data: ['支出', '收入', '转账','还款'],
- top: 20,
- left: 'center',
- backgroundColor: 'white',
- z: 100
- },
- grid: {
- containLabel: true
- },
- tooltip: {
- show: true,
- trigger: 'axis'
- },
- xAxis: {
- type: 'category',
- boundaryGap: false,
- show: false
- },
- yAxis: {
- x: 'center',
- type: 'value',
- splitLine: {
- lineStyle: {
- type: 'dashed'
- }
- }
- },
- series: line1Data
- };
- chart.setOption(option);
- return chart;
+ canvas.setChart(line1Chart);
+ let option = app.$utils.getDayLineOption(line1Data);
+ line1Chart.setOption(option);
+ return line1Chart;
}
function initLineChart2(canvas, width, height, dpr) {
- const chart = echarts.init(canvas, null, {
+ line2Chart = echarts.init(canvas, null, {
width: 400,
height: 300,
devicePixelRatio: dpr // new
});
- canvas.setChart(chart);
- var option = {
- legend: {
- data: ['支出', '收入', '转账','还款'],
- top: 20,
- left: 'center',
- backgroundColor: 'white',
- z: 100
- },
- grid: {
- containLabel: true
- },
- tooltip: {
- show: true,
- trigger: 'axis'
- },
- xAxis: {
- type: 'category',
- boundaryGap: false,
- show: false
- },
- yAxis: {
- x: 'center',
- type: 'value',
- splitLine: {
- lineStyle: {
- type: 'dashed'
- }
- }
- // show: false
- },
- series: line2Data
- };
- chart.setOption(option);
- return chart;
+ canvas.setChart(line2Chart);
+ let option = app.$utils.getMonthLineOption(line2Data);
+ line2Chart.setOption(option);
+ return line2Chart;
}
-const app = getApp();
Page({
data: {
- // 指定选择区间起始值
start: '2000-01-01 00:00:00',
end: '2030-09-09 12:12:12',
showDateVisible:false,
@@ -172,6 +95,8 @@ Page({
});
})
}
+ let option = app.$utils.getPieOption(pieData);
+ pieChart.setOption(option);
this.setData({payTypeList})
}
})
@@ -228,6 +153,10 @@ Page({
smooth: true,
data: res.data.lineMonthRepayment
})
+ let line1Option = app.$utils.getDayLineOption(line1Data);
+ line1Chart.setOption(line1Option);
+ let line2Option = app.$utils.getDayLineOption(line2Data);
+ line2Chart.setOption(line2Option);
}
})
app.$api.listBillByAMonth({'rangeDate':this.data.showDate}).then(res => {
@@ -273,9 +202,8 @@ Page({
[mode]: value
// [`${mode}Text`]: value,
});
- // this.updateView()
+ this.updateView()
this.hidePicker()
- wx.redirectTo({url:"./index?rangeDate=" + this.data.showDate})
}
});
diff --git a/pages/chart/index.wxml b/pages/chart/index.wxml
index 686edfe..ea8c9ed 100644
--- a/pages/chart/index.wxml
+++ b/pages/chart/index.wxml
@@ -44,24 +44,21 @@
/>
-
-
-
+
-
+
- 本月
-
- 近6月
+
+
+
-
-
+
diff --git a/pages/chart/index.wxss b/pages/chart/index.wxss
index e98ea02..5c9dd8d 100644
--- a/pages/chart/index.wxss
+++ b/pages/chart/index.wxss
@@ -2,29 +2,11 @@
width:100%;
height:500rpx;
position: absolute;
- top: 78rpx;
+ top: 200rpx;
bottom: 0;
left: -20rpx;
right: 0;
}
-.chart-box2 {
- width:100%;
- height:500rpx;
- position: absolute;
- top: 498rpx;
- left: -20rpx;
- right: 0;
-}
-.chart_title{
- margin-top: 18rpx;
- margin-left: 25rpx;
- color: orange;
-}
-.chart-title2{
- margin-top: 50rpx;
- margin-left: 25rpx;
- color: orange;
-}
ec-canvas {
width: 100%;
height: 100%;
diff --git a/utils/util.js b/utils/util.js
index b8e1511..10c39b3 100644
--- a/utils/util.js
+++ b/utils/util.js
@@ -27,6 +27,95 @@ const formatNumber = n => {
return n[1] ? n : `0${n}`
}
+const getPieOption = pieData => {
+ let option = {
+ backgroundColor: "#3C4043",
+ series: [{
+ label: {
+ normal: {
+ fontSize: 14
+ }
+ },
+ type: 'pie',
+ center: ['50%', '50%'],
+ radius: ['0%', '70%'],
+ data: pieData
+ }]
+ }
+ return option
+}
+
+const getDayLineOption = lineData => {
+ let option = {
+ legend: {
+ data: ['支出', '收入', '转账','还款'],
+ top: 20,
+ left: 'center',
+ backgroundColor: 'white',
+ z: 100
+ },
+ grid: {
+ containLabel: true
+ },
+ tooltip: {
+ show: true,
+ trigger: 'axis'
+ },
+ xAxis: {
+ type: 'category',
+ boundaryGap: false,
+ show: false
+ },
+ yAxis: {
+ x: 'center',
+ type: 'value',
+ splitLine: {
+ lineStyle: {
+ type: 'dashed'
+ }
+ }
+ },
+ series: lineData
+ }
+ return option
+}
+
+const getMonthLineOption = lineData => {
+ let option = {
+ legend: {
+ data: ['支出', '收入', '转账','还款'],
+ top: 20,
+ left: 'center',
+ backgroundColor: 'white',
+ z: 100
+ },
+ grid: {
+ containLabel: true
+ },
+ tooltip: {
+ show: true,
+ trigger: 'axis'
+ },
+ xAxis: {
+ type: 'category',
+ boundaryGap: false,
+ show: false
+ },
+ yAxis: {
+ x: 'center',
+ type: 'value',
+ splitLine: {
+ lineStyle: {
+ type: 'dashed'
+ }
+ }
+ // show: false
+ },
+ series: lineData
+ };
+ return option
+}
+
const getToken = () => {
const map = ['E','q','u','i','n','W','A','b','C','d']
const errKey = ['f','g','h','j','k','l']
@@ -56,5 +145,8 @@ module.exports = {
formatTime,
formatDate,
formatDateMonth,
- getToken
+ getToken,
+ getPieOption,
+ getDayLineOption,
+ getMonthLineOption
}