|
@@ -22,7 +22,11 @@ export default {
|
|
|
},
|
|
|
dataFilterProductSelect: '',
|
|
|
dataFilterPlanSelect: '',
|
|
|
- chartData: {},
|
|
|
+ chartData: {
|
|
|
+ date: [],
|
|
|
+ assignedLicensesYData: [],
|
|
|
+ activatedLicenseYData: []
|
|
|
+ },
|
|
|
chartSelectValue: '',
|
|
|
teamData: {
|
|
|
totalTeam: null,
|
|
@@ -78,8 +82,23 @@ export default {
|
|
|
},
|
|
|
// 获取图表数据
|
|
|
getChartStatistics (type) {
|
|
|
+ if (this.chartSelectValue !== '') {
|
|
|
+ type = this.chartSelectValue
|
|
|
+ }
|
|
|
get('http://81.68.234.235:8032/pdf-tech/vppDashboard/getChartStatistics/' + type).then((res) => {
|
|
|
- console.log(res)
|
|
|
+ if (res.data.code === 200) {
|
|
|
+ this.chartData.date = []
|
|
|
+ this.chartData.assignedLicensesYData = []
|
|
|
+ this.chartData.activatedLicenseYData = []
|
|
|
+ res.data.result.forEach((item) => {
|
|
|
+ this.chartData.date.push(item.date)
|
|
|
+ this.chartData.assignedLicensesYData.push(item.licences.assignedLicenses)
|
|
|
+ this.chartData.activatedLicenseYData.push(item.licences.activatedLicense)
|
|
|
+ })
|
|
|
+ this.drawLine()
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.data.msg)
|
|
|
+ }
|
|
|
})
|
|
|
},
|
|
|
// 获取团队数据
|
|
@@ -107,7 +126,12 @@ export default {
|
|
|
},
|
|
|
// 绘制Echarts图表
|
|
|
drawLine () {
|
|
|
- var myChart = echarts.init(this.$refs.chart)
|
|
|
+ let myChart = echarts.getInstanceByDom(
|
|
|
+ this.$refs.chart
|
|
|
+ )
|
|
|
+ if (myChart == null) {
|
|
|
+ myChart = echarts.init(this.$refs.chart)
|
|
|
+ }
|
|
|
myChart.setOption({
|
|
|
color: ['#1460F3', '#FFAE49'],
|
|
|
tooltip: {
|
|
@@ -131,7 +155,7 @@ export default {
|
|
|
xAxis: {
|
|
|
type: 'category',
|
|
|
boundaryGap: false,
|
|
|
- data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
|
|
|
+ data: this.chartData.date,
|
|
|
axisPointer: {
|
|
|
type: 'line',
|
|
|
lineStyle: {
|
|
@@ -169,8 +193,7 @@ export default {
|
|
|
{
|
|
|
name: 'Assigned Licenses',
|
|
|
type: 'line',
|
|
|
- stack: 'Total',
|
|
|
- data: [120, 132, 101, 134, 90, 230, 210],
|
|
|
+ data: this.chartData.assignedLicensesYData,
|
|
|
lineStyle: {
|
|
|
width: 3
|
|
|
},
|
|
@@ -187,8 +210,7 @@ export default {
|
|
|
{
|
|
|
name: 'Activated Licenses',
|
|
|
type: 'line',
|
|
|
- stack: 'Total',
|
|
|
- data: [220, 182, 191, 234, 290, 330, 310],
|
|
|
+ data: this.chartData.activatedLicenseYData,
|
|
|
lineStyle: {
|
|
|
width: 3
|
|
|
},
|
|
@@ -203,7 +225,7 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
]
|
|
|
- })
|
|
|
+ }, true)
|
|
|
window.onresize = function () {
|
|
|
myChart.resize()
|
|
|
}
|
|
@@ -303,7 +325,7 @@ export default {
|
|
|
<option value="3">Last 30 Days</option>
|
|
|
<option value="4">This Month</option>
|
|
|
</select>
|
|
|
- <div @click="getChartStatistics(chartSelectValue)" class="w-70px h-28px border-[#1460F3] border-1px rounded-4px px-10px py-4px text-14px leading-20px text-[#1460F3] cursor-pointer">Confirm</div>
|
|
|
+ <div @click="getChartStatistics()" class="w-70px h-28px border-[#1460F3] border-1px rounded-4px px-10px py-4px text-14px leading-20px text-[#1460F3] cursor-pointer">Confirm</div>
|
|
|
</div>
|
|
|
<div></div>
|
|
|
</div>
|