Skip to content

B
bms-vue-obear
Commit 58977c51 authored by daywrite's avatar daywrite
Browse files
Options

商机成交

parent 67581f5c
Show whitespace changes
Inline Side-by-side
Showing with 100 additions and 276 deletions
src/components/analysis/analysis/analysisHome.vue
View file @ 58977c51
...@@ -77,6 +77,7 @@ import countArr from './countArr' ...@@ -77,6 +77,7 @@ import countArr from './countArr'
import TimeSearchForm from './timeSearchForm' import TimeSearchForm from './timeSearchForm'
import singleRadioTool from '../../common/singleRadioTool' import singleRadioTool from '../../common/singleRadioTool'
import individualContributions from './individualContributions.js' import individualContributions from './individualContributions.js'
import salesAchievements from './salesAchievements.js'
import { import {
requestAPI, requestAPI,
api api
...@@ -84,7 +85,7 @@ import { ...@@ -84,7 +85,7 @@ import {
export default { export default {
name: 'caseHome', name: 'caseHome',
mixins: [individualContributions], mixins: [individualContributions, salesAchievements],
components: { components: {
SearchHeader, SearchHeader,
...@@ -116,10 +117,10 @@ export default { ...@@ -116,10 +117,10 @@ export default {
this.getFilter() this.getFilter()
this.getSalesChart() this.getSalesChart()
// 利润图表 // 利润图表
this.c31() // this.c31()
this.c32() // this.c32()
this.c33() // this.c33()
this.c34() // this.c34()
}, },
getSalesChart () { getSalesChart () {
...@@ -127,279 +128,12 @@ export default { ...@@ -127,279 +128,12 @@ export default {
.then(res => { .then(res => {
this.result.countList = res.counts this.result.countList = res.counts
this.c1(res.chars['individualContributions']) this.c1(res.chars['individualContributions'])
this.c3('c3-1', res.chars.salesAchievements.child.chartSalesArchievementJournalAccount)
this.c3('c3-2', res.chars.salesAchievements.child.chartSalesArchievementProfits)
this.c3('c3-3', res.chars.salesAchievements.child.chartSalesArchievementProjects)
this.c3('c3-4', res.chars.salesAchievements.child.chartSalesArchievementProfitRate)
}) })
}, },
/* eslint-disable */
c34 () {
Highcharts.chart('c3-4', {
chart: {
type: 'column'
},
title: {
text: '堆叠柱形图'
},
xAxis: {
categories: ['苹果', '橘子']
},
yAxis: {
min: 0,
title: {
text: '水果消费总量'
},
stackLabels: { // 堆叠数据标签
enabled: true,
style: {
fontWeight: 'bold',
color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
}
}
},
legend: {
align: 'right',
x: -30,
verticalAlign: 'top',
y: 25,
floating: true,
backgroundColor: (Highcharts.theme && Highcharts.theme.background2) || 'white',
borderColor: '#CCC',
borderWidth: 1,
shadow: false
},
tooltip: {
formatter: function () {
return '<b>' + this.x + '</b><br/>' +
this.series.name + ': ' + this.y + '<br/>' +
'总量: ' + this.point.stackTotal;
}
},
plotOptions: {
column: {
stacking: 'normal',
dataLabels: {
enabled: true,
color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
style: {
// 如果不需要数据标签阴影，可以将 textOutline 设置为 'none'
textOutline: '1px 1px black'
}
}
}
},
series: [{
name: '小张',
data: [5, 3]
}, {
name: '小彭',
data: [2, 2]
}, {
name: '小潘',
data: [3, 4]
}]
});
},
c33 () {
Highcharts.chart('c3-3', {
chart: {
type: 'column'
},
title: {
text: '堆叠柱形图'
},
xAxis: {
categories: ['苹果', '橘子']
},
yAxis: {
min: 0,
title: {
text: '水果消费总量'
},
stackLabels: { // 堆叠数据标签
enabled: true,
style: {
fontWeight: 'bold',
color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
}
}
},
legend: {
align: 'right',
x: -30,
verticalAlign: 'top',
y: 25,
floating: true,
backgroundColor: (Highcharts.theme && Highcharts.theme.background2) || 'white',
borderColor: '#CCC',
borderWidth: 1,
shadow: false
},
tooltip: {
formatter: function () {
return '<b>' + this.x + '</b><br/>' +
this.series.name + ': ' + this.y + '<br/>' +
'总量: ' + this.point.stackTotal;
}
},
plotOptions: {
column: {
stacking: 'normal',
dataLabels: {
enabled: true,
color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
style: {
// 如果不需要数据标签阴影，可以将 textOutline 设置为 'none'
textOutline: '1px 1px black'
}
}
}
},
series: [{
name: '小张',
data: [5, 3]
}, {
name: '小彭',
data: [2, 2]
}, {
name: '小潘',
data: [3, 4]
}]
});
},
c32 () {
Highcharts.chart('c3-2', {
chart: {
type: 'column'
},
title: {
text: '堆叠柱形图'
},
xAxis: {
categories: ['苹果', '橘子']
},
yAxis: {
min: 0,
title: {
text: '水果消费总量'
},
stackLabels: { // 堆叠数据标签
enabled: true,
style: {
fontWeight: 'bold',
color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
}
}
},
legend: {
align: 'right',
x: -30,
verticalAlign: 'top',
y: 25,
floating: true,
backgroundColor: (Highcharts.theme && Highcharts.theme.background2) || 'white',
borderColor: '#CCC',
borderWidth: 1,
shadow: false
},
tooltip: {
formatter: function () {
return '<b>' + this.x + '</b><br/>' +
this.series.name + ': ' + this.y + '<br/>' +
'总量: ' + this.point.stackTotal;
}
},
plotOptions: {
column: {
stacking: 'normal',
dataLabels: {
enabled: true,
color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
style: {
// 如果不需要数据标签阴影，可以将 textOutline 设置为 'none'
textOutline: '1px 1px black'
}
}
}
},
series: [{
name: '小张',
data: [5, 3]
}, {
name: '小彭',
data: [2, 2]
}, {
name: '小潘',
data: [3, 4]
}]
});
},
c31 () {
Highcharts.chart('c3-1', {
chart: {
type: 'column'
},
title: {
text: '堆叠柱形图'
},
xAxis: {
categories: ['苹果', '橘子']
},
yAxis: {
min: 0,
title: {
text: '水果消费总量'
},
stackLabels: { // 堆叠数据标签
enabled: true,
style: {
fontWeight: 'bold',
color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
}
}
},
legend: {
align: 'right',
x: -30,
verticalAlign: 'top',
y: 25,
floating: true,
backgroundColor: (Highcharts.theme && Highcharts.theme.background2) || 'white',
borderColor: '#CCC',
borderWidth: 1,
shadow: false
},
tooltip: {
formatter: function () {
return '<b>' + this.x + '</b><br/>' +
this.series.name + ': ' + this.y + '<br/>' +
'总量: ' + this.point.stackTotal;
}
},
plotOptions: {
column: {
stacking: 'normal',
dataLabels: {
enabled: true,
color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
style: {
// 如果不需要数据标签阴影，可以将 textOutline 设置为 'none'
textOutline: '1px 1px black'
}
}
}
},
series: [{
name: '小张',
data: [5, 3]
}, {
name: '小彭',
data: [2, 2]
}, {
name: '小潘',
data: [3, 4]
}]
});
// }
},
// 1.查询条件 // 1.查询条件
getFilter () { getFilter () {
......
src/components/analysis/analysis/salesAchievements.js 0 → 100644
View file @ 58977c51
export default {
methods: {
/* eslint-disable */
c3 (id, data) {
let _data = data.values
Highcharts.chart(id, {
chart: {
type: 'column'
},
title: {
text: ''
},
xAxis: {
title: {
text: _data.xAxisTitle
},
gridLineWidth: 1,
categories: _data.categories
},
yAxis: {
min: 0,
title: {
text: ''
},
gridLineWidth: 1,
labels: {
formatter: function () {
return (this.value / 10000) + '万'
},
},
// 柱状图顶部 总计
stackLabels: {
enabled: true,
style: {
fontWeight: 'bold',
color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
}
}
},
legend: {
enabled: false
},
tooltip: {
formatter: function () {
let ret = ''
let _x = this.x
if (_x === '平均') {
ret += `<b>${_x}</b><br/>${this.point.stackTotal}`
} else {
ret += `<b>${this.series.name}</b><br/>
项目名称：${this.series.userOptions.projectName}<br/>
商机金额：${this.series.userOptions.money}`
}
return ret
}
},
plotOptions: {
column: {
stacking: 'normal',
dataLabels: {
// 柱状图里面是否显示value值
// enabled: true,
color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
style: {
// 如果不需要数据标签阴影，可以将 textOutline 设置为 'none'
textOutline: '1px 1px black'
}
}
}
},
series: [{
name: '北京方太国际有限公司',
projectName: '测试App功能',
money: '493500元',
data: [493500]
}, {
name: '北京方太国际有限公司',
projectName: '测试App功能',
money: '493500元',
data: [493500]
}, {
name: '上海假冒国际有限公司',
projectName: '测试App功能',
money: '493500元',
data: [9988000, 7834479.11]
}]
});
}
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment