[mod]超融合-无数据时增加默认显示

init
wangxi 4 years ago
parent f1646e7ec6
commit 526ce5c6ec

@ -4,7 +4,7 @@
<a-tabs default-active-key="1" class="tab-style" @change="handleTabsChange" > <a-tabs default-active-key="1" class="tab-style" @change="handleTabsChange" >
<a-tab-pane key="1" tab="行政班概况"> <a-tab-pane key="1" tab="行政班概况">
<div style="width:100%"> <div v-if="getData" style="width:100%">
<div class="leftContent"> <div class="leftContent">
<div style="text-align: center;font-weight: bold">行政班类别统计汇总</div> <div style="text-align: center;font-weight: bold">行政班类别统计汇总</div>
<m-echarts <m-echarts
@ -22,9 +22,10 @@
</div> </div>
</div> </div>
<div v-else style="text-align: center;margin: 4rem 0">暂无数据</div>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="2" tab="教学班概况"> <a-tab-pane key="2" tab="教学班概况">
<table border="1" class="table-style" > <table v-if="getData" border="1" class="table-style" >
<thead> <thead>
<tr style="background:#E8F3FF;"> <tr style="background:#E8F3FF;">
<th style="text-align:center;">学科</th> <th style="text-align:center;">学科</th>
@ -51,9 +52,10 @@
</tbody> </tbody>
</table> </table>
<div v-else style="text-align: center;margin: 4rem 0">暂无数据</div>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="3" tab="走班概况" > <a-tab-pane key="3" tab="走班概况" >
<div class="go-class"> <div v-if="getData" class="go-class">
<div class="top-content"> <div class="top-content">
<div class="left-line"></div> <div class="left-line"></div>
<div class="text">学生走班情况汇总</div> <div class="text">学生走班情况汇总</div>
@ -102,8 +104,10 @@
</div> </div>
</div> </div>
</div> </div>
<div v-else style="text-align: center;margin: 4rem 0">暂无数据</div>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="4" tab="男女比例" > <a-tab-pane key="4" tab="男女比例" >
<div v-if="getData">
<div style="width:50%;display: inline-block;height:370px"> <div style="width:50%;display: inline-block;height:370px">
<m-echarts <m-echarts
v-if="sexPieFlag" v-if="sexPieFlag"
@ -125,6 +129,8 @@
> >
</m-bar-echarts> </m-bar-echarts>
</div> </div>
</div>
<div v-else style="text-align: center;margin: 4rem 0">暂无数据</div>
</a-tab-pane> </a-tab-pane>
</a-tabs> </a-tabs>
<div class="select-style" > <div class="select-style" >
@ -256,7 +262,8 @@
], ],
xAxisName:"", xAxisName:"",
yAxisName:"人数", yAxisName:"人数",
} },
getData:true,
} }
}, },
@ -267,6 +274,8 @@
methods:{ methods:{
handleTaskChange:function (key) { handleTaskChange:function (key) {
this.task_id=key; this.task_id=key;
if(key!==''){
this.getData=true;
if(this.type==='1'){ if(this.type==='1'){
this.administrativeTable=false; this.administrativeTable=false;
this.pieFlag=false; this.pieFlag=false;
@ -282,9 +291,15 @@
this.sexLineFlag=false; this.sexLineFlag=false;
this.getSexStatic() this.getSexStatic()
} }
}else {
this.getData=false;
}
}, },
handleTabsChange:function (key) { handleTabsChange:function (key) {
this.type=key; this.type=key;
if(this.task_id!==''){
this.getData=true;
if(key==='1'){ if(key==='1'){
this.getClassCountCompareByType(); this.getClassCountCompareByType();
this.getClassCountCompareByTypeDetail(); this.getClassCountCompareByTypeDetail();
@ -295,6 +310,10 @@
}else { }else {
this.getSexStatic() this.getSexStatic()
} }
}else {
this.getData=false;
}
}, },
// //
getClassCountCompareByType:function () { getClassCountCompareByType:function () {
@ -503,13 +522,15 @@
if(result[0].data.success === true){ if(result[0].data.success === true){
this.taskFlag=true; this.taskFlag=true;
if(result[0].data.list.length!==0){ if(result[0].data.list.length!==0){
this.getData=true;
this.taskList=result[0].data.list; this.taskList=result[0].data.list;
this.task_id=result[0].data.list[0].divide_id; this.task_id=result[0].data.list[0].divide_id;
this.getClassCountCompareByType(); this.getClassCountCompareByType();
this.getClassCountCompareByTypeDetail(); this.getClassCountCompareByTypeDetail();
}else { }else {
this.stageList=[{stage_name:'暂无数据',stage_id:''}]; this.getData=false;
this.taskList=[{divide_name:'暂无数据',divide_id:''}];
} }
} }

@ -12,6 +12,7 @@
</div> </div>
<a-tabs default-active-key="1" class="tab-style" @change="handleTabsChange" > <a-tabs default-active-key="1" class="tab-style" @change="handleTabsChange" >
<a-tab-pane key="1" tab="行政班概况"> <a-tab-pane key="1" tab="行政班概况">
<div v-if="getData">
<div style="height:3rem;overflow: hidden"> <div style="height:3rem;overflow: hidden">
<img src="./image/u5561.svg" class="img-style" @click="administrativeImgClick('table')"/> <img src="./image/u5561.svg" class="img-style" @click="administrativeImgClick('table')"/>
<img src="./image/u5560.svg" class="img-style" @click="administrativeImgClick('pie')" /> <img src="./image/u5560.svg" class="img-style" @click="administrativeImgClick('pie')" />
@ -34,8 +35,11 @@
<a-table v-if="administrativeTable" style="min-height: 10rem;margin-bottom:2rem" :columns="columns" :data-source="tableData" size="small" :pagination="false" rowKey='class_id'> <a-table v-if="administrativeTable" style="min-height: 10rem;margin-bottom:2rem" :columns="columns" :data-source="tableData" size="small" :pagination="false" rowKey='class_id'>
</a-table> </a-table>
</div> </div>
</div>
<div v-else style="text-align: center;margin: 4rem 0">暂无数据</div>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="2" tab="教学班概况"> <a-tab-pane key="2" tab="教学班概况">
<div v-if="getData">
<div class="class-style"> <div class="class-style">
<div class="block-style" :style="{background:index===type?'#00A4FF':'#C6D7F2'}" v-for="(item,type) in this.administrativeClass" :key="item.subject_id" @click="handleCardClick(item.subject_id,type)"> <div class="block-style" :style="{background:index===type?'#00A4FF':'#C6D7F2'}" v-for="(item,type) in this.administrativeClass" :key="item.subject_id" @click="handleCardClick(item.subject_id,type)">
<img :src="require('./image/'+item.imgsrc+'.svg')" style="margin-bottom: .4rem" /> <img :src="require('./image/'+item.imgsrc+'.svg')" style="margin-bottom: .4rem" />
@ -64,9 +68,11 @@
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div>
<div v-else style="text-align: center;margin: 4rem 0">暂无数据</div>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="3" tab="走班概况" > <a-tab-pane key="3" tab="走班概况" >
<div class="goClass"> <div v-if="getData" class="goClass">
<div class="left-con"> <div class="left-con">
<div style="height:370px"> <div style="height:370px">
<m-echarts <m-echarts
@ -99,8 +105,10 @@
</div> </div>
</div> </div>
</div> </div>
<div v-else style="text-align: center;margin: 4rem 0">暂无数据</div>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="4" tab="男女比例" > <a-tab-pane key="4" tab="男女比例" >
<div v-if="getData">
<div style="height:3rem;overflow: hidden"> <div style="height:3rem;overflow: hidden">
<img src="./image/u5729.svg" class="img-style" @click="sexImgClick('pie')"/> <img src="./image/u5729.svg" class="img-style" @click="sexImgClick('pie')"/>
<img src="./image/u5560.svg" class="img-style" @click="sexImgClick('line')" /> <img src="./image/u5560.svg" class="img-style" @click="sexImgClick('line')" />
@ -126,6 +134,8 @@
> >
</m-bar-echarts> </m-bar-echarts>
</div> </div>
</div>
<div v-else style="text-align: center;margin: 4rem 0">暂无数据</div>
</a-tab-pane> </a-tab-pane>
</a-tabs> </a-tabs>
@ -257,7 +267,8 @@
], ],
xAxisName:"", xAxisName:"",
yAxisName:"人数", yAxisName:"人数",
} },
getData:true,
} }
}, },
@ -276,6 +287,8 @@
}, },
handleTaskChange:function (key) { handleTaskChange:function (key) {
this.task_id=key; this.task_id=key;
if(key!==''){
this.getData=true;
if(this.type==='1'){ if(this.type==='1'){
this.administrativeTable=false; this.administrativeTable=false;
this.pieFlag=false; this.pieFlag=false;
@ -291,21 +304,27 @@
this.sexLineFlag=false; this.sexLineFlag=false;
this.getSexStatic() this.getSexStatic()
} }
}else {
this.getData=false;
}
}, },
handleTabsChange:function (key) { handleTabsChange:function (key) {
this.type=key; this.type=key;
if(this.task_id!==''){
this.getData=true;
if(key==='1'){ if(key==='1'){
this.showPie=true;
this.getClassCountCompareByType(); this.getClassCountCompareByType();
this.getClassCountCompareByTypeDetail(); this.getClassCountCompareByTypeDetail();
}else if(key==='2'){ }else if(key==='2'){
this.index=0;
this.getClassComprehensiveInfo(); this.getClassComprehensiveInfo();
}else if(key==='3'){ }else if(key==='3'){
this.getStudentTeachingClassInfo(); this.getStudentTeachingClassInfo();
}else { }else {
this.getSexStatic() this.getSexStatic()
} }
}else {
this.getData=false;
}
}, },
administrativeImgClick:function (key) { administrativeImgClick:function (key) {
if(key==='pie'){ if(key==='pie'){
@ -336,13 +355,15 @@
if(result[0].data.success === true){ if(result[0].data.success === true){
this.taskFlag=true; this.taskFlag=true;
if(result[0].data.list.length!==0){ if(result[0].data.list.length!==0){
this.getData=true;
this.taskList=result[0].data.list; this.taskList=result[0].data.list;
this.task_id=result[0].data.list[0].divide_id; this.task_id=result[0].data.list[0].divide_id;
this.getClassCountCompareByType(); this.getClassCountCompareByType();
this.getClassCountCompareByTypeDetail(); this.getClassCountCompareByTypeDetail();
}else { }else {
this.stageList=[{stage_name:'暂无数据',stage_id:''}]; this.getData=false;
this.taskList=[{divide_name:'暂无数据',divide_id:''}];
} }
} }

@ -4,8 +4,7 @@
<div > <div >
<div class="left-content"> <div class="left-content">
<div style="font-size: 18px;margin-bottom:1rem">异动数据统计分析</div> <div style="font-size: 18px;margin-bottom:1rem">异动数据统计分析</div>
<div></div> <div style="height:370px;width:100%;margin:0 auto" v-if="getData">
<div style="height:370px;width:100%;margin:0 auto">
<m-bar-echarts <m-bar-echarts
v-if="classesFlag" v-if="classesFlag"
:echartStyle="classesSubstituteData.style" :echartStyle="classesSubstituteData.style"
@ -20,6 +19,7 @@
</m-bar-echarts> </m-bar-echarts>
</div> </div>
<div style="margin-top: 8rem;" v-else></div>
</div> </div>
<div class="right-content"> <div class="right-content">
<div class="module" style="background: #F4593A"> <div class="module" style="background: #F4593A">
@ -77,7 +77,8 @@
], ],
xAxisName:"日期", xAxisName:"日期",
yAxisName:"异动课节", yAxisName:"异动课节",
} },
getData:true,
} }
}, },
@ -124,6 +125,7 @@
}],(result)=>{ }],(result)=>{
if(result[0].data.success === true){ if(result[0].data.success === true){
this.classesFlag=true; this.classesFlag=true;
this.getData=true;
let nameList=[]; let nameList=[];
let classes=[]; let classes=[];
let substitute=[]; let substitute=[];
@ -143,6 +145,8 @@
this.classesSubstituteData.seriesData[1].data=substitute; this.classesSubstituteData.seriesData[1].data=substitute;
this.classesSubstituteData.seriesData[1].name=nameList[1]; this.classesSubstituteData.seriesData[1].name=nameList[1];
}else {
this.getData=false;
} }
}) })
} }

@ -20,7 +20,7 @@
</div> </div>
<div> <div>
<div style="height:370px;width:96%;margin:1rem auto;"> <div style="height:370px;width:96%;margin:1rem auto;" v-if="getData">
<m-bar-echarts <m-bar-echarts
v-if="classesFlag" v-if="classesFlag"
:echartStyle="classesSubstituteData.style" :echartStyle="classesSubstituteData.style"
@ -35,6 +35,7 @@
</m-bar-echarts> </m-bar-echarts>
</div> </div>
<div v-else style="margin: 5rem 0;text-align: center">暂无数据</div>
</div> </div>
</div> </div>
@ -77,7 +78,8 @@
], ],
xAxisName:"日期", xAxisName:"日期",
yAxisName:"异动课节", yAxisName:"异动课节",
} },
getData:true
} }
}, },
@ -124,6 +126,7 @@
}],(result)=>{ }],(result)=>{
if(result[0].data.success === true){ if(result[0].data.success === true){
this.classesFlag=true; this.classesFlag=true;
this.getData=true;
let nameList=[]; let nameList=[];
let classes=[]; let classes=[];
let substitute=[]; let substitute=[];
@ -143,6 +146,8 @@
this.classesSubstituteData.seriesData[1].data=substitute; this.classesSubstituteData.seriesData[1].data=substitute;
this.classesSubstituteData.seriesData[1].name=nameList[1]; this.classesSubstituteData.seriesData[1].name=nameList[1];
}else{
this.getData=false;
} }
}) })
} }

@ -30,7 +30,7 @@
</div> </div>
<div class="right-content"> <div class="right-content">
<div>听评课趋势统计</div> <div>听评课趋势统计</div>
<div v-if="this.trendStatistical.yAxis.length!==0">
<div style="width:100%;overflow: hidden"> <div style="width:100%;overflow: hidden">
<a-select style="width:6rem;float: right" v-if="stageFlag" value-key="item.stage_name" :default-value=this.stageList[0].stage_name <a-select style="width:6rem;float: right" v-if="stageFlag" value-key="item.stage_name" :default-value=this.stageList[0].stage_name
@change="handleSelectStage($event,'line')"> @change="handleSelectStage($event,'line')">
@ -39,6 +39,7 @@
</a-select-option> </a-select-option>
</a-select> </a-select>
</div> </div>
<div v-if="this.trendStatistical.yAxis.length!==0">
<l-echarts <l-echarts
v-if="lineFlag" v-if="lineFlag"
:echartStyle="trendStatistical.style" :echartStyle="trendStatistical.style"

@ -11,6 +11,7 @@
</a-select-option> </a-select-option>
</a-select> </a-select>
</div> </div>
<div v-if="this.courseDistribution.e.length!==0">
<m-echarts <m-echarts
v-if="pieFlag" v-if="pieFlag"
:echartStyle="courseDistribution.s" :echartStyle="courseDistribution.s"
@ -19,6 +20,12 @@
:isRing=true :isRing=true
v-on:currentEchartData="getCourseProgressPie" v-on:currentEchartData="getCourseProgressPie"
></m-echarts> ></m-echarts>
</div>
<div v-else="">
<div>
<div class="bgImg"></div>
</div>
</div>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="2" tab="听评课趋势统计" > <a-tab-pane key="2" tab="听评课趋势统计" >
<div style="width:100%;overflow: hidden"> <div style="width:100%;overflow: hidden">
@ -29,6 +36,7 @@
</a-select-option> </a-select-option>
</a-select> </a-select>
</div> </div>
<div v-if="this.trendStatistical.yAxis.length!==0">
<l-echarts <l-echarts
v-if="lineFlag" v-if="lineFlag"
:echartStyle="trendStatistical.style" :echartStyle="trendStatistical.style"
@ -37,6 +45,12 @@
:isType="trendStatistical.type" :isType="trendStatistical.type"
v-on:trendStatistical="getCourseProgressLine" v-on:trendStatistical="getCourseProgressLine"
></l-echarts> ></l-echarts>
</div>
<div v-else="">
<div>
<div class="bgImg"></div>
</div>
</div>
</a-tab-pane> </a-tab-pane>
</a-tabs> </a-tabs>
</div> </div>
@ -221,6 +235,13 @@
text-align: center; text-align: center;
} }
} }
.bgImg{
text-align: center;
margin: 0 auto;
width:16rem;
height:16rem;
background: url('./image/bgImg.png') center center no-repeat;
}
} }

Loading…
Cancel
Save