xiaohaizhao před 6 měsíci
rodič
revize
8244d70300

+ 2 - 1
project.private.config.json

@@ -3,7 +3,8 @@
     "setting": {
         "urlCheck": false,
         "autoAudits": false,
-        "compileHotReLoad": true
+        "compileHotReLoad": true,
+        "bigPackageSizeSupport": false
     },
     "condition": {
         "miniprogram": {

+ 104 - 13
salesPanel/customerBlance/index.js

@@ -4,6 +4,8 @@ const _Http = getApp().globalData.http,
         symbol,
         precision
     }).format();
+
+import * as echarts from '../ec-canvas/echarts';
 Component({
     properties: {
 
@@ -77,21 +79,110 @@ Component({
                     title: res.data,
                     icon: "none"
                 })
-                let data = res.data,
-                    dividend = wx.getStorageSync('languagecode') == 'ZH' ? 10000 : 1000;
-                data.target_l = CNY(data.target_l / dividend, "");
-                data.nowTarget_l = CNY(data.nowTarget_l / dividend, "");
-                data.unamount = CNY(data.unamount / dividend);
-                data.amount = CNY(data.amount / dividend, "");
-                data.unnowTarget_l = CNY(data.unnowTarget_l / dividend);
-                data.wcamount = (data.wcamount * 100).toFixed(2) - 0; // 达成率
-                data.tbxsje = (data.tbxsje * 100).toFixed(2) - 0; // 同比增长率
-                data.hbxsje = (data.hbxsje * 100).toFixed(2) - 0; // 环比增长率
-                data.wcnowTarget_l = (data.wcnowTarget_l * 100).toFixed(2); // 累计目标达成率
-                data.init = true;
-
+                this.initChart(res.data)
             })
         },
+        initChart(data) {
+            console.log("data", data)
+            const dividend = wx.getStorageSync('languagecode') == 'ZH' ? 10000 : 1000,
+                colors = ['#6CD2A1', '#5F9DFC', '#ECB937'];
+            const option = {
+                color: colors,
+                tooltip: {
+                    trigger: 'axis',
+                    axisPointer: {
+                        type: 'cross'
+                    }
+                },
+                legend: {
+                    data: ['去年同期金额(万元)', '本年金额(万元)', '同比增长率']
+                },
+                xAxis: [{
+                    type: 'category',
+                    axisTick: {
+                        alignWithLabel: true
+                    },
+                    data: data.tbzzl.map(v => v.date)
+                }],
+                yAxis: [{
+                        type: 'value',
+                        name: '',
+                        position: 'left',
+                        alignTicks: true,
+                        axisLine: {
+                            show: true,
+                            lineStyle: {
+                                color: colors[2]
+                            }
+                        },
+                        axisLabel: {
+                            formatter: '{value}'
+                        }
+                    }, {
+                        type: 'value',
+                        name: '',
+                        position: 'right',
+                        alignTicks: true,
+                        axisLine: {
+                            show: false,
+                            lineStyle: {
+                                color: colors[0]
+                            }
+                        },
+                        axisLabel: {
+                            formatter: '{value}'
+                        }
+                    },
+                    {
+                        type: 'value',
+                        name: '',
+                        position: 'right',
+                        alignTicks: true,
+                        offset: 80,
+                        axisLine: {
+                            show: false,
+                            lineStyle: {
+                                color: colors[1]
+                            }
+                        },
+                        axisLabel: {
+                            formatter: '{value}'
+                        }
+                    },
+
+                ],
+                series: [{
+                        name: '去年同期金额(万元)',
+                        type: 'bar',
+                        data: data.balance.filter(v => v.name == '去年同期金额').map(v => (v.value / dividend).toFixed(2)),
+                    },
+                    {
+                        name: '本年金额(万元)',
+                        type: 'bar',
+                        yAxisIndex: 1,
+                        data: data.balance.filter(v => v.name == '本年金额').map(v => (v.value / dividend).toFixed(2))
+                    },
+                    {
+                        name: '同比增长率',
+                        type: 'line',
+                        yAxisIndex: 2,
+                        data: data.tbzzl.map(v => (v.value * 100).toFixed(2)),
+                    }
+                ]
+            };
+
+            // 渲染图表
+            this.chartComponent = this.selectComponent('#mychart');
+            this.chartComponent.init((canvas, width, height) => {
+                const chart = echarts.init(canvas, null, {
+                    width,
+                    height
+                });
+                chart.setOption(option);
+                return chart;
+            });
+
+        },
         changeDate({
             detail
         }) {

+ 3 - 1
salesPanel/customerBlance/index.json

@@ -1,4 +1,6 @@
 {
     "component": true,
-    "usingComponents": {}
+    "usingComponents": {
+        "ec-canvas": "../ec-canvas/ec-canvas"
+    }
 }

+ 10 - 0
salesPanel/customerBlance/index.scss

@@ -78,4 +78,14 @@
 		}
 	}
 
+}
+
+.chart {
+	width: 100%;
+	height: 600rpx;
+
+	ec-canvas {
+		width: 100%;
+		height: 100%;
+	}
 }

+ 4 - 0
salesPanel/customerBlance/index.wxml

@@ -14,4 +14,8 @@
 			<view class="iconfont icon-xiangxiazhankai" />
 		</view>
 	</view>
+
+	<view class="chart">
+		<ec-canvas id="mychart" canvas-id="chart" ec="{{ ec }}"></ec-canvas>
+	</view>
 </view>