趋势分析

components/viewDate/index.js

@@ -13,10 +13,37 @@ Component({
         onChange: {
             type: Function,
         },
+        fields: {
+            type: String,
+            value: "day", //有效值 year,month,day，表示选择器的粒度
+        },
+        end: {
+            type: [String, Number]
+        },
+        start: {
+            type: [String, Number]
+        }
     },
     lifetimes: {
         attached: function () {
-            getApp().globalData.Language.getLanguagePackage(this)
+            const fields = this.properties.fields;
+            let value = new Date();
+
+            if (fields === "year") {
+                value = value.getFullYear().toString();
+            } else if (fields === "month") {
+                const year = value.getFullYear();
+                const month = (value.getMonth() + 1).toString().padStart(2, '0');
+                value = `${year}-${month}`;
+            } else if (fields === "day") {
+                value = value.toISOString().split('T')[0];
+            }
+
+            this.setData({
+                value
+            });
+
+            getApp().globalData.Language.getLanguagePackage(this);
         }
     },
     data: {

components/viewDate/index.wxml

@@ -3,7 +3,7 @@
         <view class="iconfont {{iconName}}">{{language[title]||title}}</view>
     </view>
     <view class="right">
-        <picker mode='date' value='{{value}}' style="width: 100%;" style="flex: 1;" bindchange='onChange'>
+        <picker mode='date' value='{{value}}'  fields='{{fields}}' start="{{start}}" end='{{end}}' style="width: 100%;" style="flex: 1;" bindchange='onChange'>
             <view style='color:#3874F6;'>{{value}}</view>
         </picker>
         <view class="iconfont icon-xiangxiazhankai" />

salesPanel/customerBlance/index.js

@@ -171,13 +171,6 @@ Component({
                     },
 
                 ],
-                dataZoom: [{
-                    type: 'slider',
-                    show: true,
-                    xAxisIndex: 0,
-                    start: 0,
-                    end: 100
-                }],
                 series: [{
                         name: `${getMapText('去年同期金额')}(${getMapText('万元')})`,
                         type: 'bar',

salesPanel/customerBlance/index.scss

@@ -85,7 +85,7 @@ page {
 }
 
 .chart {
-    height: 600rpx;
+    height: 540rpx;
     width: 100vw;
 }
 
@@ -94,10 +94,10 @@ page {
 
     ec-canvas {
         position: absolute;
-        top: -640rpx;
+        top: -590rpx;
         width: 690rpx;
-        height: 600rpx;
+        height: 570rpx;
         z-index: 2;
-        right: 10rpx;
+        right: 0rpx;
     }
 }

salesPanel/index/index.js

@@ -22,8 +22,33 @@ Page({
         }, {
             label: "报价分析",
             model: "#BiddingAnalysis"
+        }, {
+            label: "订单趋势分析",
+            model: "#OrderTrendAnalysis"
+        }, {
+            label: "订单类型占比分析"
+        }, {
+            label: "订单产品类别占比分析"
+        }, {
+            label: "出货趋势分析",
+            model: "#ClearisTrendAnalysis"
+        }, {
+            label: "近12月延期出货情况分析"
+        }, {
+            label: "未出货已延期情况分析"
+        }, {
+            label: "开票金额趋势分析",
+            model: "#InvoiceTrendAnalysis"
+        }, {
+            label: "近12月出货未开票金额趋势分析"
+        }, {
+            label: "已下单未出货分析"
+        }, {
+            label: "出货未开票分析"
+        }, {
+            label: "财务回款分析"
         }],
-        tabsActive: 3,
+        tabsActive: 4,
         showFiltrate: false,
         dataid: wx.getStorageSync('userMsg').userid,
         username: wx.getStorageSync('userMsg').name,

salesPanel/index/index.json

@@ -2,7 +2,10 @@
     "usingComponents": {
         "Panel": "../panel/index",
         "CustomerBlance": "../customerBlance/index",
-        "biddingAnalysis": "../biddingAnalysis/index"
+        "biddingAnalysis": "../biddingAnalysis/index",
+        "OrderTrendAnalysis": "../trendAnalysis/index",
+        "ClearisTrendAnalysis": "../trendAnalysis/index",
+        "InvoiceTrendAnalysis": "../trendAnalysis/index"
     },
     "navigationBarTitleText": "销售数据"
 }

salesPanel/index/index.wxml

@@ -18,6 +18,9 @@
     <Panel slot='销售面板' id='Panel' />
     <CustomerBlance slot='客户账户余额分析' id='CustomerBlance' />
     <biddingAnalysis slot='报价分析' id='BiddingAnalysis' />
+    <OrderTrendAnalysis slot="订单趋势分析" mode='订单趋势分析' id="OrderTrendAnalysis" />
+    <ClearisTrendAnalysis slot="出货趋势分析" mode='出货趋势分析' id="ClearisTrendAnalysis" />
+    <InvoiceTrendAnalysis slot="开票金额趋势分析" mode='开票金额趋势分析' id="InvoiceTrendAnalysis" />
 </Yl_FunTabs>
 <Yl_Filtrate1 id="Yl_Filtrate1" show='{{showFiltrate}}' list="{{[]}}" bindhandle="handleFilter" bindinterrupt='interrupt'>
     <organization slot='head' defaultIsleave='1' dimissionF id='organization' />

salesPanel/trendAnalysis/index.js

@@ -0,0 +1,194 @@
+const _Http = getApp().globalData.http,
+    currency = require("../../utils/currency"),
+    CNY = (value, symbol = "￥", precision = 2) => currency(value, {
+        symbol,
+        precision
+    }).format();
+
+import * as echarts from '../ec-canvas/echarts';
+Component({
+    properties: {
+        mode: {
+            type: String
+        }
+    },
+    options: {
+        addGlobalClass: true
+    },
+    lifetimes: {
+        attached: function () {
+            getApp().globalData.Language.getLanguagePackage(this)
+        }
+    },
+    data: {
+        year: new Date().getFullYear().toString(),
+        "content": {
+            dataid: wx.getStorageSync('userMsg').userid,
+            username: wx.getStorageSync('userMsg').name,
+            year: new Date().getFullYear().toString(),
+            where: {}
+        },
+        isbooked: 0,
+    },
+    methods: {
+        async getList(init = false) {
+            let content = this.data.content
+            const {
+                dataid,
+                type,
+                username,
+                isleave
+            } = getCurrentPages()[getCurrentPages().length - 1].data;
+            if (content.dataid != dataid || content.type != type || isleave != isleave) init = true
+            content.dataid = dataid;
+            content.type = type;
+            content.username = username;
+            content.where.isleave = isleave;
+            if (this.properties.mode == '出货趋势分析') content.isbooked = this.data.isbooked;
+            let ids = {
+                '订单趋势分析': 20231012094804,
+                '出货趋势分析': 20231012152004,
+                '开票金额趋势分析': 20231016095304
+            }
+            _Http.basic({
+                "id": ids[this.properties.mode],
+                content
+            }).then(res => {
+                console.log(this.properties.mode, res)
+                if (res.code != '1') return wx.showToast({
+                    title: res.data,
+                    icon: "none"
+                })
+                this.initChart(res.data)
+            })
+        },
+        onCheckboxChange(e) {
+            this.setData({
+                isbooked: this.data.isbooked == 0 ? 1 : 0
+            })
+            this.getList(true)
+        },
+        initChart(data) {
+            const dividend = wx.getStorageSync('languagecode') == 'ZH' ? 10000 : 1000,
+                colors = ['#6CD2A1', '#5F9DFC', '#ECB937', '#F69240'],
+                getMapText = getApp().globalData.Language.getMapText;
+            let legend = [`${getMapText('去年同期金额')}(${getMapText('万元')})`, `${getMapText('本期金额')}(${getMapText('万元')})`, `${getMapText('同比增长率')}`],
+                series = [{
+                        name: `${getMapText('去年同期金额')}(${getMapText('万元')})`,
+                        type: 'bar',
+                        data: data.map(v => (v.amount / dividend).toFixed(2)),
+                        smooth: true
+                    },
+                    {
+                        name: `${getMapText('本期金额')}(${getMapText('万元')})`,
+                        type: 'bar',
+                        yAxisIndex: 1,
+                        data: data.map(v => (v.oldamount / dividend).toFixed(2)),
+                        smooth: true
+                    },
+                    {
+                        name: getMapText('同比增长率'),
+                        type: 'line',
+                        yAxisIndex: 2,
+                        data: data.map(v => (v.tbzzl * 100).toFixed(2)),
+                        smooth: true
+                    }
+                ]
+
+            if (this.properties.mode == '出货趋势分析') {
+                legend.push(getMapText('准交率'))
+                series.push({
+                    name: getMapText('准交率'),
+                    type: 'line',
+                    yAxisIndex: 2,
+                    data: data.map(v => (v.zjl * 100).toFixed(2)),
+                    smooth: true
+                })
+
+            }
+            const option = {
+                color: colors,
+                tooltip: {
+                    trigger: 'axis',
+                },
+                legend: {
+                    data: legend
+                },
+                xAxis: [{
+                    type: 'category',
+                    axisTick: {
+                        alignWithLabel: true
+                    },
+                    data: data.map(v => v.date),
+                    axisLabel: {
+                        interval: 0,
+                        rotate: 45
+                    }
+                }],
+                yAxis: [{
+                        type: 'value',
+                        name: '',
+                        position: 'right',
+                        offset: 80,
+                        alignTicks: true,
+                        axisLine: {
+                            show: true,
+                        },
+                        axisLabel: {
+                            formatter: '{value}'
+                        }
+                    },
+                    {
+                        type: 'value',
+                        name: '',
+                        position: 'left',
+                        alignTicks: true,
+                        axisLine: {
+                            show: false,
+                        },
+                        axisLabel: {
+                            formatter: '{value}',
+                            rotate: 45
+                        }
+                    },
+                    {
+                        type: 'value',
+                        name: '',
+                        position: 'right',
+                        alignTicks: true,
+                        offset: 80,
+                        axisLine: {
+                            show: false,
+                            lineStyle: {
+                                color: colors[1]
+                            }
+                        },
+                        axisLabel: {
+                            formatter: '{value}'
+                        }
+                    },
+
+                ],
+                series
+            };
+            this.chartComponent = this.selectComponent('#mychart');
+            this.chartComponent.init((canvas, width, height, dpr) => {
+                const chart = echarts.init(canvas, null, {
+                    width,
+                    height,
+                    devicePixelRatio: dpr
+                });
+                chart.setOption(option);
+                return chart;
+            });
+        },
+        changeDate({
+            detail
+        }) {
+            this.setData({
+                "content.year": detail
+            })
+            this.getList(true)
+        },
+    }
+})

salesPanel/trendAnalysis/index.json

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

salesPanel/trendAnalysis/index.scss

@@ -0,0 +1,7 @@
+@import "../customerBlance/index.scss";
+
+.chart2 {
+	ec-canvas {
+		top: -590rpx;
+	}
+}

salesPanel/trendAnalysis/index.wxml

@@ -0,0 +1,15 @@
+<viewDate title='年度' fields='year' end="{{year}}" bind:onChange='changeDate' />
+<view wx:if="{{mode == '出货趋势分析'}}" class="global-card" style="margin-bottom: 0;">
+	<checkbox-group bindchange="onCheckboxChange" style="display: flex; align-items: center;">
+		<label style="font-size: 12px; display: flex; align-items: center;">
+			<checkbox value="{{isbooked}}" style="transform: scale(0.8);" color="#296DEF" />
+			是否包含备货数据
+		</label>
+	</checkbox-group>
+</view>
+<view class="global-card">
+				<view class="chart"></view>
+</view>
+<view class="chart2">
+				<ec-canvas id="mychart" canvas-id="chart" ec="{{ ec }}"></ec-canvas>
+</view>