|
|
@@ -0,0 +1,170 @@
|
|
|
+const _Http = getApp().globalData.http;
|
|
|
+import * as echarts from '../../ec-canvas/echarts';
|
|
|
+Component({
|
|
|
+ options: {
|
|
|
+ addGlobalClass: true
|
|
|
+ },
|
|
|
+ lifetimes: {
|
|
|
+ attached: function () {
|
|
|
+ getApp().globalData.Language.getLanguagePackage(this)
|
|
|
+ this.setData({
|
|
|
+ "content.dataid": wx.getStorageSync('userMsg').userid,
|
|
|
+ "content.username": wx.getStorageSync('userMsg').name,
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data: {
|
|
|
+ year: new Date().getFullYear().toString(),
|
|
|
+ "content": {
|
|
|
+ dateType: "15-30天",
|
|
|
+ enddate: new Date().toISOString().split('T')[0],
|
|
|
+ where: {},
|
|
|
+ pageNumber: 1,
|
|
|
+ pageSize: 20,
|
|
|
+ pageTotal: 1
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ async getList(init = false) {
|
|
|
+ if (init.detail != undefined) init = init.detail;
|
|
|
+ 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 (init) {
|
|
|
+ content.pageNumber = 1;
|
|
|
+ content.pageSize = 20;
|
|
|
+ }
|
|
|
+ if (content.pageNumber > content.pageTotal) return;
|
|
|
+ _Http.basic({
|
|
|
+ "id": 20231015130604,
|
|
|
+ content
|
|
|
+ }).then(res => {
|
|
|
+ console.log("有效线索未跟进天数分析", res)
|
|
|
+ this.selectComponent('#ListBox').RefreshToComplete();
|
|
|
+ if (res.code != '1') return wx.showToast({
|
|
|
+ title: res.data,
|
|
|
+ icon: "none"
|
|
|
+ })
|
|
|
+ this.setData({
|
|
|
+ list: res.pageNumber == 1 ? res.data : this.data.list.concat(res.data),
|
|
|
+ "content.pageNumber": res.pageNumber + 1,
|
|
|
+ "content.pageSize": res.pageSize,
|
|
|
+ "content.pageTotal": res.pageTotal,
|
|
|
+ "total": res.total,
|
|
|
+ })
|
|
|
+ if (init) this.initChart(res.data[0].trend)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ initChart(data) {
|
|
|
+ const colors = ['#6395FA'],
|
|
|
+ getMapText = getApp().globalData.Language.getMapText;
|
|
|
+ let that = this,
|
|
|
+ countDown = null;
|
|
|
+
|
|
|
+ function changeDateType(params) {
|
|
|
+ clearTimeout(countDown)
|
|
|
+ countDown = setTimeout(() => {
|
|
|
+ let data = that.data.list[0].trend.find(v => getMapText(v.key) === getMapText(params.name));
|
|
|
+ console.log("data", data)
|
|
|
+ if (data.key === that.data.content.dateType) return;
|
|
|
+ that.setData({
|
|
|
+ "content.dateType": data.key,
|
|
|
+ "content.pageNumber": 1,
|
|
|
+ })
|
|
|
+ that.getList();
|
|
|
+ }, 200)
|
|
|
+ }
|
|
|
+ let legend = [getMapText('线索数')],
|
|
|
+ series = [{
|
|
|
+ name: getMapText('线索数'),
|
|
|
+ type: 'bar',
|
|
|
+ data: data.map(v => v.value),
|
|
|
+ smooth: true
|
|
|
+ }]
|
|
|
+ const option = {
|
|
|
+ color: colors,
|
|
|
+ tooltip: {
|
|
|
+ trigger: 'axis',
|
|
|
+ confine: true, // Ensure tooltip stays within the chart area
|
|
|
+ formatter: function (params) {
|
|
|
+ changeDateType(params[0])
|
|
|
+ return params.map((item, index) =>
|
|
|
+ `${index === 0 ? item.axisValue + '\n' : ''}${item.marker}${item.seriesName}: ${item.value}`
|
|
|
+ ).join('\n');
|
|
|
+ },
|
|
|
+ textStyle: {
|
|
|
+ fontSize: 10, // Reduced font size
|
|
|
+ lineHeight: 14 // Adjusted line height for smaller tooltip height
|
|
|
+ }
|
|
|
+ },
|
|
|
+ legend: {
|
|
|
+ data: legend,
|
|
|
+ left: 'left' // Display legend on the left
|
|
|
+ },
|
|
|
+ xAxis: [{
|
|
|
+ type: 'category',
|
|
|
+ axisTick: {
|
|
|
+ alignWithLabel: true
|
|
|
+ },
|
|
|
+ data: data.map(v => getMapText(v.key)),
|
|
|
+ axisLabel: {
|
|
|
+ interval: 0,
|
|
|
+ rotate: 45
|
|
|
+ }
|
|
|
+ }],
|
|
|
+ yAxis: [{
|
|
|
+ type: 'value',
|
|
|
+ position: 'left',
|
|
|
+ axisLine: {
|
|
|
+ show: true,
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ formatter: '{value}'
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ lineStyle: {
|
|
|
+ type: 'dashed' // Dashed grid lines for better readability
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }],
|
|
|
+ series: series.map(item => ({
|
|
|
+ ...item,
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ position: 'inside', // Display the label inside the bar
|
|
|
+ formatter: '{c}', // Show the value of the bar
|
|
|
+ fontSize: 10, // Adjust font size for better readability
|
|
|
+ color: '#FFFFFF' // Set font color to white
|
|
|
+ }
|
|
|
+ }))
|
|
|
+ };
|
|
|
+ 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.enddate": detail
|
|
|
+ })
|
|
|
+ this.getList(true)
|
|
|
+ },
|
|
|
+ }
|
|
|
+})
|