|
@@ -12,8 +12,24 @@
|
|
|
</template>
|
|
|
</el-alert>
|
|
|
<p class="title">声部分布</p>
|
|
|
- <el-divider class="divider"></el-divider>
|
|
|
- <div>
|
|
|
+ <!-- <el-divider class="divider"></el-divider> -->
|
|
|
+
|
|
|
+ <descriptions :column="4" class="descriptions">
|
|
|
+ <descriptions-item
|
|
|
+ :label="item.key"
|
|
|
+ :key="index"
|
|
|
+ v-for="(item, index) in subject"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ v-if="item.value"
|
|
|
+ class="col-value"
|
|
|
+ @click="getSoundInfo(item.courseScheduleId)"
|
|
|
+ >
|
|
|
+ {{ item.value }}人
|
|
|
+ </div>
|
|
|
+ </descriptions-item>
|
|
|
+ </descriptions>
|
|
|
+ <!-- <div>
|
|
|
<el-row class="row">
|
|
|
<el-col
|
|
|
class="col"
|
|
@@ -27,18 +43,24 @@
|
|
|
>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
- </div>
|
|
|
+ </div> -->
|
|
|
<p class="title">年级分布</p>
|
|
|
- <el-divider class="divider"></el-divider>
|
|
|
- <el-row class="row">
|
|
|
- <el-col class="col" :span="6" v-for="(item, index) in grade" :key="index">
|
|
|
- <span class="col-title">{{ gradeMap[item.key] }}:</span>
|
|
|
- <span class="col-value" @click="getGradeInfo(String(item.key))"
|
|
|
- >{{ item.value }}人</span
|
|
|
+ <!-- <el-divider class="divider"></el-divider> -->
|
|
|
+ <descriptions :column="6" class="descriptions">
|
|
|
+ <descriptions-item
|
|
|
+ :label="gradeMap[item.key]"
|
|
|
+ :key="index"
|
|
|
+ v-for="(item, index) in grade"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ v-if="item.value"
|
|
|
+ class="col-value"
|
|
|
+ @click="getGradeInfo(String(item.key))"
|
|
|
>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
-
|
|
|
+ {{ item.value }}人
|
|
|
+ </div>
|
|
|
+ </descriptions-item>
|
|
|
+ </descriptions>
|
|
|
<el-alert :closable="false" class="alert marginBtm22" type="info">
|
|
|
<template slot="title">
|
|
|
<div class="shapeWrap">
|
|
@@ -55,17 +77,30 @@
|
|
|
</div>
|
|
|
</template>
|
|
|
</el-alert>
|
|
|
- <el-row class="row">
|
|
|
+ <descriptions :column="4" class="descriptions">
|
|
|
+ <descriptions-item
|
|
|
+ :label="item.key"
|
|
|
+ :key="index"
|
|
|
+ v-for="(item, index) in teacher"
|
|
|
+ >
|
|
|
+ <div v-if="item.value" @click="getSoundInfo(item.courseScheduleId)">
|
|
|
+ <overflow-text :text="item.value || ''"></overflow-text>
|
|
|
+ </div>
|
|
|
+ </descriptions-item>
|
|
|
+ </descriptions>
|
|
|
+ <!-- <el-row class="row">
|
|
|
<el-col
|
|
|
class="col"
|
|
|
:span="6"
|
|
|
v-for="(item, index) in teacher"
|
|
|
:key="index"
|
|
|
>
|
|
|
- <span class="col-title">{{ item.key }}:</span>
|
|
|
- <span>{{ item.value }}</span>
|
|
|
+ <span class="col-title">
|
|
|
+ <overflow-text :text="item.key || ''"></overflow-text>:</span
|
|
|
+ >
|
|
|
+ <span>:</span>
|
|
|
</el-col>
|
|
|
- </el-row>
|
|
|
+ </el-row> -->
|
|
|
<!-- studentMaster -->
|
|
|
<el-dialog
|
|
|
width="1200px"
|
|
@@ -133,19 +168,32 @@ export default {
|
|
|
});
|
|
|
}
|
|
|
this.subject = res.data.subject;
|
|
|
+
|
|
|
+ if (this.subject.length > 0 && this.subject.length < 4) {
|
|
|
+ // 样式丑 至少对齐一排
|
|
|
+ for (let i = 0; i <= 4 - this.subject.length; i++) {
|
|
|
+ this.subject.push({ key: null, value: null });
|
|
|
+ }
|
|
|
+ }
|
|
|
this.teacher = res.data.teacher;
|
|
|
+ if (this.teacher.length > 0 && this.teacher.length < 4) {
|
|
|
+ // 样式丑 至少对齐一排
|
|
|
+ for (let i = 0; i <= 4 - this.subject.length; i++) {
|
|
|
+ this.teacher.push({ key: null, value: null });
|
|
|
+ }
|
|
|
+ }
|
|
|
} catch (e) {
|
|
|
console.log(e);
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
getSoundInfo(val) {
|
|
|
- this.$set(this,'searchForm',{
|
|
|
+ this.$set(this, "searchForm", {
|
|
|
search: "",
|
|
|
subjectId: val,
|
|
|
currentGradeNum: "",
|
|
|
isBuyInstrumentsInsurance: "",
|
|
|
- })
|
|
|
+ });
|
|
|
// this.searchForm = {
|
|
|
// search: "",
|
|
|
// subjectId: val,
|
|
@@ -156,12 +204,12 @@ export default {
|
|
|
this.studentVisible = true;
|
|
|
},
|
|
|
getGradeInfo(val) {
|
|
|
- this.$set(this,'searchForm',{
|
|
|
+ this.$set(this, "searchForm", {
|
|
|
search: "",
|
|
|
subjectId: "",
|
|
|
- currentGradeNum:val,
|
|
|
+ currentGradeNum: val,
|
|
|
isBuyInstrumentsInsurance: "",
|
|
|
- })
|
|
|
+ });
|
|
|
// this.searchForm = {
|
|
|
// search: "",
|
|
|
// subjectId: "",
|
|
@@ -204,6 +252,13 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+.descriptions {
|
|
|
+ margin-bottom: 30px;
|
|
|
+ .col-value {
|
|
|
+ color: #14928a;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+}
|
|
|
.shapeWrap {
|
|
|
display: flex;
|
|
|
flex-direction: row;
|