|
@@ -31,14 +31,22 @@
|
|
</el-card>
|
|
</el-card>
|
|
</el-col>
|
|
</el-col>
|
|
|
|
|
|
- <el-col :span="24" class="card-box">
|
|
|
|
|
|
+ <el-col :span="12" class="card-box">
|
|
<el-card>
|
|
<el-card>
|
|
- <div slot="header"><span>代金券类别发放统计</span></div>
|
|
|
|
|
|
+ <div slot="header"><span>代金券发放比例</span></div>
|
|
<div class="el-table el-table--enable-row-hover el-table--medium">
|
|
<div class="el-table el-table--enable-row-hover el-table--medium">
|
|
<div ref="activities" style="height: 550px" />
|
|
<div ref="activities" style="height: 550px" />
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
</el-card>
|
|
</el-col>
|
|
</el-col>
|
|
|
|
+ <el-col :span="12" class="card-box">
|
|
|
|
+ <el-card>
|
|
|
|
+ <div slot="header">
|
|
|
|
+ <span>代金券发放数</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div ref="usedmemory" style="height: 550px" />
|
|
|
|
+ </el-card>
|
|
|
|
+ </el-col>
|
|
</el-row>
|
|
</el-row>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
@@ -68,6 +76,7 @@ export default {
|
|
handleQuery() {
|
|
handleQuery() {
|
|
this.$modal.loading("正在加载活动统计数据,请稍候!");
|
|
this.$modal.loading("正在加载活动统计数据,请稍候!");
|
|
this.getActivity();
|
|
this.getActivity();
|
|
|
|
+ this.getUser();
|
|
},
|
|
},
|
|
// 重置
|
|
// 重置
|
|
resetQuery() {
|
|
resetQuery() {
|
|
@@ -98,6 +107,46 @@ export default {
|
|
myChart.setOption(option);
|
|
myChart.setOption(option);
|
|
this.$modal.closeLoading();
|
|
this.$modal.closeLoading();
|
|
},
|
|
},
|
|
|
|
+ async getUser() {
|
|
|
|
+ const res = await issuedCountTyType(this.queryParams);
|
|
|
|
+ const data = res?.data;
|
|
|
|
+ const myChart = echarts.init(this.$refs.usedmemory);
|
|
|
|
+ const option = {
|
|
|
|
+ xAxis: {
|
|
|
|
+ type: 'category',
|
|
|
|
+ data: (() => {
|
|
|
|
+ let list = [];
|
|
|
|
+ data.map((item) => {
|
|
|
|
+ list.push(item.name);
|
|
|
|
+ });
|
|
|
|
+ return list;
|
|
|
|
+ })(),
|
|
|
|
+ },
|
|
|
|
+ yAxis: {
|
|
|
|
+ type: 'value'
|
|
|
|
+ },
|
|
|
|
+ series: [
|
|
|
|
+ {
|
|
|
|
+ data,
|
|
|
|
+ type: 'bar',
|
|
|
|
+ label: {
|
|
|
|
+ show: true,
|
|
|
|
+ position: 'top'
|
|
|
|
+ },
|
|
|
|
+ itemStyle: {
|
|
|
|
+ normal: {
|
|
|
|
+ color: function(params) {
|
|
|
|
+ return '#3f48cc'
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ ]
|
|
|
|
+ };
|
|
|
|
+ myChart.setOption(option);
|
|
|
|
+
|
|
|
|
+ this.$modal.closeLoading();
|
|
|
|
+ }
|
|
}
|
|
}
|
|
};
|
|
};
|
|
</script>
|
|
</script>
|