|
@@ -9,11 +9,11 @@
|
|
|
>
|
|
|
<el-form-item prop="dates">
|
|
|
<el-date-picker
|
|
|
- @change="changeWeek"
|
|
|
- :closeable ="false"
|
|
|
+ @change="changeWeek"
|
|
|
+ :closeable="false"
|
|
|
v-model="searchForm.dates"
|
|
|
value-format="yyyy-MM-dd"
|
|
|
- :picker-options="{ firstDayOfWeek: 1 }"
|
|
|
+ :picker-options="{ firstDayOfWeek: 1 }"
|
|
|
type="daterange"
|
|
|
style="width: 405px"
|
|
|
range-separator="至"
|
|
@@ -29,157 +29,109 @@
|
|
|
</el-form-item>
|
|
|
</saveform>
|
|
|
<!-- 分组添加柱状图 -->
|
|
|
- <el-tabs v-model="activeName" class="submitTab" >
|
|
|
- <el-tab-pane label="人数图表" name="first">
|
|
|
- <ve-histogram
|
|
|
- v-if="activeName=='first'"
|
|
|
- style="width: 100%"
|
|
|
- height="350px"
|
|
|
- :data="chartData"
|
|
|
- :data-empty="dataEmpty"
|
|
|
- :extend="chartExtend"
|
|
|
- :legend="legend"
|
|
|
- :data-zoom="dataZoom"
|
|
|
- ></ve-histogram>
|
|
|
- </el-tab-pane>
|
|
|
- <el-tab-pane label="比例图标" name="second" > <ve-histogram
|
|
|
- v-if="activeName=='second'"
|
|
|
- style="width: 100%"
|
|
|
- height="350px"
|
|
|
- :data="scaleCharData"
|
|
|
- :data-empty="dataEmpty"
|
|
|
- :extend="scalChartExtend"
|
|
|
- :legend="legend"
|
|
|
- :data-zoom="dataZoom"
|
|
|
- ></ve-histogram>
|
|
|
+ <el-tabs v-model="activeName" class="submitTab">
|
|
|
+ <el-tab-pane label="人数图表" name="first">
|
|
|
+ <ve-histogram
|
|
|
+ v-if="activeName == 'first'"
|
|
|
+ style="width: 100%"
|
|
|
+ height="350px"
|
|
|
+ :data="chartData"
|
|
|
+ :data-empty="dataEmpty"
|
|
|
+ :extend="chartExtend"
|
|
|
+ :legend="legend"
|
|
|
+ :data-zoom="dataZoom"
|
|
|
+ ></ve-histogram>
|
|
|
</el-tab-pane>
|
|
|
- </el-tabs>
|
|
|
+ <el-tab-pane label="比例图标" name="second">
|
|
|
+ <ve-histogram
|
|
|
+ v-if="activeName == 'second'"
|
|
|
+ style="width: 100%"
|
|
|
+ height="350px"
|
|
|
+ :data="scaleCharData"
|
|
|
+ :data-empty="dataEmpty"
|
|
|
+ :extend="scalChartExtend"
|
|
|
+ :legend="legend"
|
|
|
+ :data-zoom="dataZoom"
|
|
|
+ ></ve-histogram>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ @click="exportQuestion"
|
|
|
+ style="margin: 16px 0"
|
|
|
+ v-permission="'export/managerDownload/num'"
|
|
|
+ >导出</el-button
|
|
|
+ >
|
|
|
<div class="tableWrap">
|
|
|
<el-table
|
|
|
:data="tableList"
|
|
|
:header-cell-style="{ background: '#EDEEF0', color: '#444' }"
|
|
|
>
|
|
|
- <el-table-column
|
|
|
- width="120px"
|
|
|
- align="center"
|
|
|
- prop="id"
|
|
|
- label="排名"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <div>
|
|
|
- {{scope.$index+1}}
|
|
|
- </div>
|
|
|
- </template>
|
|
|
+ <el-table-column width="120px" align="center" prop="id" label="排名">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ {{ scope.$index + 1 }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
align="center"
|
|
|
prop="organName"
|
|
|
label="分部名称"
|
|
|
></el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="normalNum"
|
|
|
- label="会员人数"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <div>
|
|
|
- {{scope.row.normalNum}}人
|
|
|
- </div>
|
|
|
- </template>
|
|
|
+ <el-table-column align="center" prop="normalNum" label="会员人数">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>{{ scope.row.normalNum }}人</div>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="trainStudentNum"
|
|
|
- label="练习人数"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <div>
|
|
|
- {{scope.row.trainStudentNum}}人
|
|
|
- </div>
|
|
|
- </template></el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="trainRate"
|
|
|
- label="练习率"
|
|
|
+ <el-table-column align="center" prop="trainStudentNum" label="练习人数">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>{{ scope.row.trainStudentNum }}人</div>
|
|
|
+ </template></el-table-column
|
|
|
>
|
|
|
- <template slot-scope="scope">
|
|
|
- <div>
|
|
|
- {{scope.row.trainRate}}%
|
|
|
- </div>
|
|
|
- </template>
|
|
|
+ <el-table-column align="center" prop="trainRate" label="练习率">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>{{ scope.row.trainRate }}%</div>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="id"
|
|
|
- label="≤60分钟"
|
|
|
+ <el-table-column align="center" prop="id" label="≤60分钟">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>{{ scope.row.train1 }}人</div>
|
|
|
+ </template></el-table-column
|
|
|
>
|
|
|
- <template slot-scope="scope">
|
|
|
- <div>
|
|
|
- {{scope.row.train1}}人
|
|
|
- </div>
|
|
|
- </template></el-table-column>
|
|
|
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="id"
|
|
|
- label="60~120分钟"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <div>
|
|
|
- {{scope.row.train2}}人
|
|
|
- </div>
|
|
|
- </template>
|
|
|
+ <el-table-column align="center" prop="id" label="60~120分钟">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>{{ scope.row.train2 }}人</div>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="id"
|
|
|
- label="120~240分钟"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <div>
|
|
|
- {{scope.row.train3}}人
|
|
|
- </div>
|
|
|
- </template>
|
|
|
+ <el-table-column align="center" prop="id" label="120~240分钟">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>{{ scope.row.train3 }}人</div>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="id"
|
|
|
- label=">240分钟"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <div>
|
|
|
- {{scope.row.train4}}人
|
|
|
- </div>
|
|
|
- </template>
|
|
|
+ <el-table-column align="center" prop="id" label=">240分钟">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>{{ scope.row.train4 }}人</div>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="id"
|
|
|
- label="平均练习时长"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <div>
|
|
|
- {{scope.row.avgTrainTime}}分钟
|
|
|
- </div>
|
|
|
- </template>
|
|
|
+ <el-table-column align="center" prop="id" label="平均练习时长">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>{{ scope.row.avgTrainTime }}分钟</div>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="id"
|
|
|
- label="练习达标占比"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <div>
|
|
|
- {{scope.row.trainStandRate}}%
|
|
|
- </div>
|
|
|
- </template>
|
|
|
+ <el-table-column align="center" prop="id" label="练习达标占比">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>{{ scope.row.trainStandRate }}%</div>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column align="center" label="操作" fixed="right">
|
|
|
<template slot-scope="scope">
|
|
|
<el-button
|
|
|
- v-permission="'employeeInfo/update'"
|
|
|
- @click="openTypes('update', scope.row)"
|
|
|
+ v-permission="'/exerciseDurationDetail'"
|
|
|
+ @click="onDetail(scope.row)"
|
|
|
type="text"
|
|
|
>详情</el-button
|
|
|
>
|
|
@@ -190,13 +142,14 @@
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
+import { Export } from "@/utils/downLoadFile";
|
|
|
import saveform from "@/components/save-form";
|
|
|
import dayjs from "dayjs";
|
|
|
import histogram from "v-charts/lib/histogram.common";
|
|
|
import { getNowDateAndMonday, getNowDateAndSunday } from "@/utils/utils";
|
|
|
import { cloudTeacherNum } from "../api";
|
|
|
-let nowTime = new Date()
|
|
|
- nowTime =
|
|
|
+let nowTime = new Date();
|
|
|
+nowTime =
|
|
|
nowTime.getFullYear() +
|
|
|
"-" +
|
|
|
(nowTime.getMonth() + 1) +
|
|
@@ -212,7 +165,7 @@ export const getTimes = (times, keys = []) => {
|
|
|
return {};
|
|
|
};
|
|
|
export default {
|
|
|
- components: { saveform,"ve-histogram": histogram, },
|
|
|
+ components: { saveform, "ve-histogram": histogram },
|
|
|
name: "helpCategory",
|
|
|
data() {
|
|
|
return {
|
|
@@ -220,21 +173,44 @@ export default {
|
|
|
dates: []
|
|
|
},
|
|
|
tableList: [],
|
|
|
- activeName:'first'
|
|
|
+ activeName: "first"
|
|
|
};
|
|
|
},
|
|
|
async mounted() {
|
|
|
-
|
|
|
this.searchForm.dates.push(getNowDateAndMonday(nowTime));
|
|
|
this.searchForm.dates.push(getNowDateAndSunday(nowTime));
|
|
|
this.getList();
|
|
|
},
|
|
|
methods: {
|
|
|
+ exportQuestion() {
|
|
|
+ const { dates } = this.searchForm;
|
|
|
+ Export(
|
|
|
+ this,
|
|
|
+ {
|
|
|
+ url: "/api-web/export/managerDownload",
|
|
|
+ fileName: "云教练练习时长.xls",
|
|
|
+ method: "post",
|
|
|
+ params: {
|
|
|
+ exportEnum: "EXPORT_CLOUD_TEACHER_SUM",
|
|
|
+ ...getTimes(dates, ["startDate", "endDate"])
|
|
|
+ }
|
|
|
+ },
|
|
|
+ "您确定导出云教练练习时长?"
|
|
|
+ );
|
|
|
+ },
|
|
|
+ onDetail(row) {
|
|
|
+ this.$router.push({
|
|
|
+ path: "/exerciseDurationDetail",
|
|
|
+ query: {
|
|
|
+ organId: row.organId
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
search() {
|
|
|
- this.$refs.searchForm.validate((valid) => {
|
|
|
+ this.$refs.searchForm.validate(valid => {
|
|
|
this.pageInfo = {
|
|
|
...this.pageInfo,
|
|
|
- page: 1,
|
|
|
+ page: 1
|
|
|
};
|
|
|
this.getList();
|
|
|
});
|
|
@@ -242,29 +218,30 @@ export default {
|
|
|
onReSet() {
|
|
|
this.pageInfo = {
|
|
|
...this.pageInfo,
|
|
|
- page: 1,
|
|
|
+ page: 1
|
|
|
};
|
|
|
this.$refs.searchForm.resetFields();
|
|
|
this.searchForm.dates.push(getNowDateAndMonday(nowTime));
|
|
|
- this.searchForm.dates.push(getNowDateAndSunday(nowTime));
|
|
|
+ this.searchForm.dates.push(getNowDateAndSunday(nowTime));
|
|
|
this.getList();
|
|
|
},
|
|
|
getDefaultTime() {
|
|
|
const dayjs = this.$helpers.dayjs;
|
|
|
let nowDate = dayjs(new Date()).format("YYYY-MM-DD");
|
|
|
- let lastWeek = dayjs(nowDate).subtract(1, "week").format("YYYY-MM-DD");
|
|
|
+ let lastWeek = dayjs(nowDate)
|
|
|
+ .subtract(1, "week")
|
|
|
+ .format("YYYY-MM-DD");
|
|
|
this.searchForm.dates = [
|
|
|
getNowDateAndMonday(lastWeek),
|
|
|
- getNowDateAndSunday(nowDate),
|
|
|
+ getNowDateAndSunday(nowDate)
|
|
|
];
|
|
|
-
|
|
|
},
|
|
|
changeWeek(val) {
|
|
|
if (val) {
|
|
|
- this.searchForm.dates = [
|
|
|
+ this.searchForm.dates = [
|
|
|
getNowDateAndMonday(val[0]),
|
|
|
- getNowDateAndSunday(val[1]),
|
|
|
- ]
|
|
|
+ getNowDateAndSunday(val[1])
|
|
|
+ ];
|
|
|
} else {
|
|
|
this.getDefaultTime();
|
|
|
}
|
|
@@ -297,7 +274,7 @@ export default {
|
|
|
"train3",
|
|
|
"train4",
|
|
|
"buyRate",
|
|
|
- "avgTrainTime",
|
|
|
+ "avgTrainTime"
|
|
|
];
|
|
|
arr.forEach(str => {
|
|
|
if (this.dataList[str] + "") {
|
|
@@ -311,13 +288,10 @@ export default {
|
|
|
|
|
|
return obj;
|
|
|
},
|
|
|
- scaleItems(){
|
|
|
+ scaleItems() {
|
|
|
let obj = {};
|
|
|
// "eVipStudentNum",
|
|
|
- let arr = [
|
|
|
- "trainRate",
|
|
|
- "trainStandRate",
|
|
|
- ];
|
|
|
+ let arr = ["trainRate", "trainStandRate"];
|
|
|
arr.forEach(str => {
|
|
|
if (this.dataList[str] + "") {
|
|
|
obj[str] = {
|
|
@@ -335,11 +309,10 @@ export default {
|
|
|
left: "10px"
|
|
|
};
|
|
|
},
|
|
|
- scaleCharData(){
|
|
|
+ scaleCharData() {
|
|
|
const temp = {
|
|
|
trainRate: "练习率",
|
|
|
- trainStandRate: "练习达标率",
|
|
|
-
|
|
|
+ trainStandRate: "练习达标率"
|
|
|
};
|
|
|
const values = this.tableList;
|
|
|
|
|
@@ -354,13 +327,9 @@ export default {
|
|
|
months[item.organName][temp[key]] = item[key] || 0;
|
|
|
}
|
|
|
}
|
|
|
- console.log(months,'months')
|
|
|
+ console.log(months, "months");
|
|
|
return {
|
|
|
- columns: [
|
|
|
- "分部",
|
|
|
- "练习率",
|
|
|
- "练习达标率",
|
|
|
- ],
|
|
|
+ columns: ["分部", "练习率", "练习达标率"],
|
|
|
rows: Object.values(months)
|
|
|
};
|
|
|
},
|
|
@@ -370,8 +339,8 @@ export default {
|
|
|
train1: "<=60分钟",
|
|
|
train2: "60-120分钟",
|
|
|
train3: "120-240分钟",
|
|
|
- train3:">240分钟",
|
|
|
- avgTrainTime: "平均时长",
|
|
|
+ train3: ">240分钟",
|
|
|
+ avgTrainTime: "平均时长"
|
|
|
};
|
|
|
const values = this.tableList;
|
|
|
|
|
@@ -386,7 +355,7 @@ export default {
|
|
|
months[item.organName][temp[key]] = item[key] || 0;
|
|
|
}
|
|
|
}
|
|
|
- console.log(months,'months')
|
|
|
+ console.log(months, "months");
|
|
|
return {
|
|
|
columns: [
|
|
|
"分部",
|
|
@@ -395,7 +364,7 @@ export default {
|
|
|
"60-120分钟",
|
|
|
"120-240分钟",
|
|
|
">240分钟",
|
|
|
- "平均时长",
|
|
|
+ "平均时长"
|
|
|
],
|
|
|
rows: Object.values(months)
|
|
|
};
|
|
@@ -514,8 +483,6 @@ export default {
|
|
|
display: inline-block;
|
|
|
}
|
|
|
|
|
|
-
|
|
|
-
|
|
|
::v-deep .el-tabs__active-bar {
|
|
|
background-color: transparent !important;
|
|
|
}
|
|
@@ -527,10 +494,7 @@ export default {
|
|
|
/*去掉切换时el-tab-pane底部的蓝色下划线*/
|
|
|
::v-deep .el-tabs__nav-wrap::after {
|
|
|
background-color: transparent !important;
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
+}
|
|
|
|
|
|
/*去掉tabs底部的下划线*/
|
|
|
-
|
|
|
</style>
|