|
|
@@ -285,6 +285,40 @@
|
|
|
</div>
|
|
|
<div ref="courseWatchChart" class="chart-container"></div>
|
|
|
</el-card>
|
|
|
+
|
|
|
+ <el-row :gutter="20" class="charts-section">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-card shadow="never">
|
|
|
+ <div slot="header" class="chart-header">
|
|
|
+ <span>答题红包金额TOP10</span>
|
|
|
+ <div class="legend">
|
|
|
+ <el-radio-group v-model="viewerType" size="small" @change="handleDealerChartData">
|
|
|
+ <el-radio-button label="0">按经销商排行</el-radio-button>
|
|
|
+ <el-radio-button label="1">按课程排行</el-radio-button>
|
|
|
+ </el-radio-group>
|
|
|
+ </div>
|
|
|
+ <el-button size="small" plain class="view-more">红包记录 <i class="el-icon-arrow-right"></i></el-button>
|
|
|
+ </div>
|
|
|
+ <div ref="answerRedPackViewerChart" class="chart-container"></div>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-card shadow="never">
|
|
|
+ <div slot="header" class="chart-header">
|
|
|
+ <span>答题红包金额趋势图</span>
|
|
|
+ <div class="legend">
|
|
|
+ <div class="legend-item">
|
|
|
+ <span class="dot viewer-dot"></span>
|
|
|
+ <span>答题红包金额</span>
|
|
|
+ </div>
|
|
|
+ <el-button size="small" plain class="view-more">红包记录 <i class="el-icon-arrow-right"></i></el-button>
|
|
|
+ </div>
|
|
|
+ <div ref="answerRedPackMoneyViewerChart" class="chart-container"></div>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -642,7 +676,27 @@ export default {
|
|
|
this.handleCourseWatchChart()
|
|
|
|
|
|
},
|
|
|
- handleCourseWatchChart(data) {
|
|
|
+ handleAnswerRedPackViewerChart(){
|
|
|
+ let param = this.getParam();
|
|
|
+ param = {...param,statisticalType:this.viewerType};
|
|
|
+ watchCourseTopTen(param).then(res=>{
|
|
|
+ if(res.code === 200){
|
|
|
+ let data = res.data;
|
|
|
+ let watchUserCountList = data.map(e=>e.watchUserCount);
|
|
|
+ let completedUserCountList = data.map(e=>e.completedUserCount);
|
|
|
+ let answerUserCountList = data.map(e=>e.answerUserCount);
|
|
|
+ let correctUserCountList = data.map(e=>e.correctUserCount);
|
|
|
+ let courseNameList = data.map(e=>e.courseName);
|
|
|
+ courseWatchOption.xAxis.data = courseNameList;
|
|
|
+ courseWatchOption.series[0].data = watchUserCountList;
|
|
|
+ courseWatchOption.series[1].data = completedUserCountList;
|
|
|
+ courseWatchOption.series[2].data = answerUserCountList;
|
|
|
+ courseWatchOption.series[3].data = correctUserCountList;
|
|
|
+ this.courseWatchChart.setOption(courseWatchOption)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handleCourseWatchChart() {
|
|
|
let param = this.getParam();
|
|
|
param = {...param,statisticalType:this.viewerType};
|
|
|
watchCourseTopTen(param).then(res=>{
|
