prsx-crm/packageA/salesHourglass/index.js

const _Http = getApp().globalData.http,
    currency = require("../../utils/currency"),
    CNY = (value, symbol = "", precision = 2) => currency(value, {
        symbol,
        precision
    }).format(),
    conversion = n => {
        const integer = (n + '').split(".")[0] + '',
            length = integer.length,
            regexp = /(?:\.0*|(\.\d+?)0+)$/
        if (length <= 4) {
            const index = 4 - length;
            return { //元
                show: CNY(n, "￥", index).replace(regexp, '$1'),
                value: CNY(n, '￥')
            }
        } else if (length <= 8) {
            return { //万-千万

                show: CNY(currency(n).divide(wx.getStorageSync('languagecode') == 'ZH' ? 10000 : 1000)).replace(regexp, '$1') + getApp().globalData.Language.getMapText('万元'),
                value: CNY(n)
            }
        } else {
            return { //亿
                show: CNY(currency(n).divide(100000000)).replace(regexp, '$1') + getApp().globalData.Language.getMapText('亿'),
                value: CNY(n)
            }
        }
    };


import {
    createElement
} from '@antv/f2';
import Chart from './modules/chart';
import barChart from './modules/barChart';
import {
    jsx as _jsx
} from "@antv/f2/jsx-runtime";
Page({
    data: {
        onRenderChart: () => {},
        onRenderBarChart: () => {},
        showFiltrate: false,
        "where": {
            "begindate": "",
            "enddate": "",
            "departmentid": ""
        },
        content: {
            nocache: true,
            dataid: wx.getStorageSync('userMsg').userid,
            type: 0,
            dateType: 0,
            where: {
                begdate: "",
                enddate: "",
                tradefield: "",
                isleave: 1,
                unfinish: 1
            }
        },
        showComingYear: true,
        filtratelist: [{
            label: "是否包含失败、结案项目",
            showName: "name", //显示字段
            valueKey: "unfinish", //返回Key
            selectKey: "value",
            index: 1,
            default: 1,
            list: [{
                name: "包含",
                value: 0
            }, {
                name: "不包含",
                value: 1
            }]
        }, {
            label: "时间筛选",
            showName: "name", //显示字段
            valueKey: "dateType", //返回Key
            selectKey: "id",
            value: "id", //选中值
            index: 0,
            default: 0,
            interrupt: true,
            relevance: "dateRange",
            list: [{
                name: "全部",
                id: 0,
                queryMonths: -1
            }, {
                name: "近一年",
                id: 1,
                queryMonths: 12
            }, {
                name: "近九个月",
                id: 2,
                queryMonths: 9
            }, {
                name: "近六个月",
                id: 3,
                queryMonths: 6
            }, {
                name: "近三个月",
                id: 4,
                queryMonths: 3
            }]
        }],
        firstTwelveMonths: {
            dealaccuracyrate: '0%',
            totaldealamount: 0,
            totaldeviationamount: 0,
            totalsignamount_due: 0
        },
        projectPhases: [],
        stagename: ['全部'],
        showStagename: [],
        projectPhasesShow: false
    },
    onLoad(options) {
        _Http.basic({
            "id": 20221223141802,
            "content": {
                "pageNumber": 1,
                "pageSize": 9999,
                "where": {
                    "condition": ""
                }
            }
        }, false).then(res => {
            console.log("获取领域", res)
            let filtratelist = this.data.filtratelist
            if (res.code == '1') {
                filtratelist.splice(filtratelist.length - 2, 0, {
                    label: "领域",
                    index: null,
                    showName: "tradefield", //显示字段
                    valueKey: "tradefield", //返回Key
                    selectKey: "tradefield", //传参 代表选着字段 不传参返回整个选择对象
                    value: "", //选中值
                    list: res.data
                })
                this.setData({
                    filtratelist
                })
            }
        })
        getApp().globalData.Language.getLanguagePackage(this, '销售漏斗');
        _Http.basic({
            "id": 20221128143604,
            "content": {
                "pageNumber": 1,
                "pageSize": 99,
                "where": {
                    "condition": "",
                    "allprojecttype": "",
                    "projecttype": ""
                }
            }
        }).then(res => {
            if (res.code == 1) {
                let list = res.data;
                list.unshift({
                    stagename: '全部'
                })
                this.setData({
                    projectPhases: [{
                        label: "项目阶段",
                        index: [0],
                        type: "checkbox",
                        interrupt: true,
                        showName: "stagename", //显示字段
                        valueKey: "stagename", //返回Key
                        selectKey: "stagename", //传参 代表选着字段 不传参返回整个选择对象
                        value: ['全部'], //选中值
                        list
                    }],
                    showStagename: [getApp().globalData.Language.getMapText('全部')]
                })
            }
        })
    },
    onReady() {
        this.setChartData();
        this.selectComponent("#organization").setData({
            isleave: 1
        })
        this.selectComponent("#organization").initDepAndUser();
        // this.selectComponent("#Yl_Filtrate1").queryMonths(12)
    },
    interrupt({
        detail
    }) {
        if (detail.data.label == "时间筛选") this.selectComponent("#Yl_Filtrate1").queryMonths(detail.item.queryMonths)

    },
    openFiltrate() {
        this.setData({
            showFiltrate: true
        })
    },
    handleFilter({
        detail
    }) {
        console.log(detail)
        if (detail.name == "close") return;
        if (detail.name == 'reset') {
            this.selectComponent("#organization").setData({
                isleave: 1
            })
            this.selectComponent("#organization").initDepAndUser()
            this.setData({
                'content.dataid': wx.getStorageSync('userMsg').userid,
                'content.type': 0,
                'content.where.isleave': 1,
                'content.where.tradefield': "",
                'content.where.unfinish': 1,
            })
        } else {
            let active = this.selectComponent("#organization").data.result,
                isleave = this.selectComponent("#organization").data.isleave;
            let type = active.userid ? 0 : 1,
                dataid = type == 0 ? active.userid : active.departmentid
            console.log(isleave)
            this.setData({
                'content.dataid': dataid,
                'content.type': type,
                'content.where.tradefield': detail.tradefield,
                'content.where.isleave': isleave || 1,
                'content.where.unfinish': detail.unfinish || 0,
            })
        }
        this.data.content.where.begdate = detail.startdate;
        this.data.content.where.enddate = detail.enddate;
        if (detail.startdate && detail.enddate) {
            this.data.content.dateType = 0;
        } else {
            this.data.content.dateType = detail.dateType && detail.dateType != 'id' ? dateType : 0
        }
        this.setChartData();
    },
    setChartData() {
        this.setData({
            statistics: [],
            comingYear: []
        })
        _Http.basic({
            "id": 20230630151504,
            "content": this.data.content
        }).then(res => {
            console.log("漏斗数据", res)
            if (res.code != '1') return wx.showToast({
                title: res.msg,
                icon: "none"
            })
            if (res.data.length) res.data.pop();
            let full = Math.max(...res.data.map(v => v.wide));
            let statistics = res.data.map((v, i) => {
                v.action = getApp().globalData.Language.getMapText(v.stagename)
                v.zhl = i == 0 ? '' : getApp().globalData.Language.getMapText('转换率') + `:${(v.zhl * 100).toFixed(2)}%`
                v.percent = v.wide / full;
                v.totalinvestment = conversion(v.totalinvestment).value
                v.budgetary = conversion(v.budgetary).value
                v.signamount_due = conversion(v.signamount_due).value
                if (i == 0) {
                    v.totaldealamount = CNY(v.totaldealamount, '￥')
                    v.totalsignamount_due = CNY(v.totalsignamount_due, '￥')
                }
                return v
            })
            let cHeight = statistics.length * 74;
            if (cHeight < 200) cHeight = 200;
            this.setData({
                statistics,
                full,
                cHeight: cHeight + 'rpx',
                onRenderChart: res.data.length == 0 ? () => {} : () => {
                    return this.renderChart();
                }
            });
        })
        this.setComingYear()
    },
    setComingYear() {
        this.setData({
            showComingYear: false
        })
        let content = JSON.parse(JSON.stringify(this.data.content))
        content.stagename = this.data.stagename[0] == '全部' ? [] : this.data.stagename;
        _Http.basic({
            "id": 20241028162104,
            content
        }).then(res => {
            console.log("前12个月总数据", res)
            this.setData({
                showComingYear: true
            })
            if (res.code != '1') return wx.showToast({
                title: res.msg,
                icon: "none"
            })
            const comingYear = res.data.array.map(v => {
                return {
                    name: getApp().globalData.Language.getMapText('预计签约金额'),
                    value: (v.signamount_due / (wx.getStorageSync('languagecode') == 'ZH' ? 10000 : 1000)).toFixed(0) - 0,
                    date: v.signdate_due
                }
            }).concat(res.data.array.map(v => {
                return {
                    name: getApp().globalData.Language.getMapText('预计成交金额'),
                    value: (v.dealamount_due / (wx.getStorageSync('languagecode') == 'ZH' ? 10000 : 1000)).toFixed(0) - 0,
                    date: v.signdate_due
                }

            }))
            console.log("comingYear", comingYear)
            let data = res.data;
            this.setData({
                firstTwelveMonths: {
                    "dealTotalCount": data.dealTotalCount, //成交项目数
                    "failTotalCount": data.failTotalCount, //失败项目数
                    "dealRate": (data.dealRate * 100).toFixed(2) + '%', //项目成交率
                    "positiveCount": data.positiveCount, //预计成交正偏差项目数合计
                    "positiveOffsetAmount": CNY(((data.positiveOffsetAmount || 0) / (wx.getStorageSync('languagecode') == 'ZH' ? 10000 : 1000)).toFixed(2), ''), //预计成交正偏差金额合计
                    "negativeCount": data.negativeCount, //预计成交负偏差项目数合计
                    "negativeOffsetAmount": CNY(((data.negativeOffsetAmount || 0) / (wx.getStorageSync('languagecode') == 'ZH' ? 10000 : 1000)).toFixed(2), ''), //预计成交负偏差金额合计
                    "offsetCount": data.offsetCount, //预计成交准确项目数
                    "rightRate": (data.rightRate * 100).toFixed(2) + '%', //预测额成交准确率

                    "dealAmount": CNY(((data.dealAmount || 0) / (wx.getStorageSync('languagecode') == 'ZH' ? 10000 : 1000)).toFixed(2), ''), //项目成交金额合计
                    "signAmount": CNY(((data.signAmount || 0) / (wx.getStorageSync('languagecode') == 'ZH' ? 10000 : 1000)).toFixed(2), ''), //预计签约金额合计
                },
                comingYear,
                onRenderBarChart: res.data.length == 0 ? () => {} : () => {
                    return this.renderBarChart();
                }
            })
        })
    },
    openProjectPhases() {
        this.setData({
            projectPhasesShow: true
        })
    },
    phasesInterrupt({
        detail
    }) {
        if (detail.item.stagename == '全部') {
            detail.list[0].index = [0];
            detail.list[0].value = ['全部'];
        } else {
            if (detail.list[0].index.length) {
                detail.list[0].index = detail.list[0].index.filter(v => v);
                detail.list[0].value = detail.list[0].index.filter(v => v != '全部');
            } else {
                detail.list[0].index = [0];
                detail.list[0].value = ['全部'];
            }
        }
        this.setData({
            projectPhases: detail.list
        })
    },
    phasesHandleFilter({
        detail
    }) {
        if (detail.name != "confirm") return;
        let stagename = ['全部']
        try {
            if (detail.stagename[0] != 0) {
                stagename = detail.stagename.map(v => this.data.projectPhases[0].list[v].stagename)
            }
        } catch (error) {

        }
        this.setData({
            stagename,
            showStagename: stagename.map(v => getApp().globalData.Language.getMapText(v))
        })
        this.setComingYear()
    },
    renderChart() {
        console.log("renderChart")
        return createElement(Chart, {
            data: this.data.statistics
        });
    },
    renderBarChart() {
        console.log("renderBarChart")
        return createElement(barChart, {
            data: this.data.comingYear
        });
    }
})