|
|
<template>
|
|
|
<CommonBox title="学生管理" class="moral-education-student-style">
|
|
|
<a-spin class="brandCreat" :spinning="spinning">
|
|
|
<div class="studentManageBox">
|
|
|
<!--左侧学生信息标题部分-->
|
|
|
<div class="studentManageBox-leftTitle">
|
|
|
<img class="bg1" src="../images/titleBg1.png" alt="">
|
|
|
<img class="bg2" src="../images/titleBg2.png" alt="">
|
|
|
<p class="p">
|
|
|
<span>学</span>
|
|
|
<span>生</span>
|
|
|
<span>信</span>
|
|
|
<span>息</span>
|
|
|
</p>
|
|
|
</div>
|
|
|
<div class="studentManageBox-left">
|
|
|
<div class="left-topNum">
|
|
|
<div class="left-topNum-ani">
|
|
|
<dv-decoration-9>
|
|
|
<div class="box-9-content-style">
|
|
|
<div class="box-9-text-style"
|
|
|
style="font-size: 26px;margin-bottom: 10px;font-weight: 700;">
|
|
|
{{allStudeantTotal}}
|
|
|
</div>
|
|
|
<div class="box-9-text-style"
|
|
|
style="font-size: 14px;border-top: 1px solid #0C3163;padding-top: 6px;">学生总数
|
|
|
</div>
|
|
|
</div>
|
|
|
</dv-decoration-9>
|
|
|
</div>
|
|
|
<div class="left-topNum-num">
|
|
|
<div class="numbox1 numbox" v-for="(item,i) in studentManageData1" :key="i">
|
|
|
<p class="num">{{item.total}}</p>
|
|
|
<p class="text">{{item.stage_name}}部</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="left-topNum-gender">
|
|
|
<div class="boy">
|
|
|
<a-row style="width: 100%;height: 100%">
|
|
|
<a-col :span="14" style="height: 100%">
|
|
|
<div class="border"></div>
|
|
|
<span class="gender-style">{{genderBoy}}生</span>
|
|
|
<br>
|
|
|
<i class="total">{{numrBoy}}人</i>
|
|
|
</a-col>
|
|
|
<a-col class="echarts" id="myechartsBoy" ref="myecharts" :span="10"
|
|
|
style="height: 100%"></a-col>
|
|
|
<a-col style="position: absolute; top: 28px;right: 9px; fontSize: 18px;fontWeight: 700;color: #01F6F9">
|
|
|
{{boybili}}%
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
</div>
|
|
|
<div class="gril">
|
|
|
<a-row style="width: 100%;height: 100%;position: relative;">
|
|
|
<a-col :span="14" style="height: 100%">
|
|
|
<div class="border"></div>
|
|
|
<span class="gender-style">{{genderGril}}生</span>
|
|
|
<br>
|
|
|
<i class="total">{{numGril}}人</i>
|
|
|
</a-col>
|
|
|
<a-col class="echarts" id="myechartsGril" ref="myecharts" :span="10"
|
|
|
style="height: 100%"></a-col>
|
|
|
<a-col style="position: absolute; top: 28px;right: 9px; fontSize: 18px;fontWeight: 700;color: #01F6F9">
|
|
|
{{grilbili}}%
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!--学生管理中的左侧表格-->
|
|
|
<div class="bot-collapse">
|
|
|
<a-empty description="暂无数据" v-if="collapseDataEmpty" class="timeLine-empty"/>
|
|
|
<a-collapse :activeKey="currentKey" accordion @change="collapseChange"
|
|
|
v-if="collapseData.length !=0">
|
|
|
<a-collapse-panel v-for="(item,i) in collapseData" :key="i" :show-arrow="false"
|
|
|
:header="item.headText">
|
|
|
<a-table :columns="item.columns" :dataSource="item.tableData" :customRow="getCustomRow"
|
|
|
:pagination="false"></a-table>
|
|
|
</a-collapse-panel>
|
|
|
</a-collapse>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="studentManageBox-right">
|
|
|
<!--行为规范-->
|
|
|
<a-carousel easing="linear" class="topCarousel" effect="fade" autoplay :dots="false">
|
|
|
<div class="right-top right-top1">
|
|
|
<p>1、热爱祖国，热爱人民，热爱中国共产党。</p>
|
|
|
<p>2、遵守法律法规，增强法律意识。遵守校规校纪，遵守社会公德。</p>
|
|
|
<p>3、热爱科学，努力学习，勤思好问，乐于探究，积极参加社会实践和有益的活动。</p>
|
|
|
<p>4、珍爱生命，注意安全，锻炼身体，讲究卫生。</p>
|
|
|
<p>5、自尊自爱，自信自强，生活习惯文明健康。</p>
|
|
|
<p>6、积极参加劳动，勤俭朴素，自己能做的事自己做。</p>
|
|
|
<p>7、孝敬父母，尊敬师长，礼貌待人。</p>
|
|
|
<p>8、热爱集体，团结同学，互相帮助，关心他人。</p>
|
|
|
</div>
|
|
|
<div class="right-top right-top2">
|
|
|
<p>爱祖国 拥护党</p>
|
|
|
<p>尊老师 敬亲长</p>
|
|
|
<p>明事理 懂礼貌</p>
|
|
|
<p>知感恩 担责任</p>
|
|
|
<p>存爱心 能合作</p>
|
|
|
<p>爱劳动 有毅力</p>
|
|
|
<p>常锻炼 身体好</p>
|
|
|
</div>
|
|
|
</a-carousel>
|
|
|
<!--学生荣誉-->
|
|
|
<div class="middleAni">
|
|
|
<a-row class="middleAni-pic" @mouseenter.native="mouseenterSwiper($event)"
|
|
|
@mouseleave.native="mouseleaveSwiper($event)">
|
|
|
<a-col class="middleAni-pic-box">
|
|
|
<a-empty description="暂无数据" v-if="honorDataSourseEmpty"
|
|
|
class="timeLine-empty"/>
|
|
|
<swiper id="mySwiper" :options="swiperOption" ref="mySwiper"
|
|
|
v-if="honorDataSourse.length!=0">
|
|
|
<swiper-slide class="swiper-item divcard swiper-slide"
|
|
|
v-for='(item,index) of honorDataSourse' :key='index'>
|
|
|
<a-row>
|
|
|
<a-col :span="8">
|
|
|
<img src="../images/headSrc1.png" alt="">
|
|
|
</a-col>
|
|
|
<a-col :span="16">
|
|
|
<p style="margin-bottom: 0 !important; ">{{item.student_name}}</p>
|
|
|
<p style="display: inline-block;white-space:nowrap;">
|
|
|
{{item.class_name}}</p>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
<a-row style="color: #3CD5FF;margin:10px 0 15px 0;">
|
|
|
<a-col>{{item.reward_name}}</a-col>
|
|
|
</a-row>
|
|
|
<a-row>
|
|
|
<a-col :span="4" offset="4">
|
|
|
<img src="../images/prizeLogoSrc1.png" alt="">
|
|
|
</a-col>
|
|
|
<a-col :span="10" offset="2"
|
|
|
style="border: 1px solid orange;color: orange;font-size: 12px">
|
|
|
{{item.level_name}}
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
</swiper-slide>
|
|
|
</swiper>
|
|
|
</a-col>
|
|
|
<a-col style="display: inline-block" class="middleAni-title">
|
|
|
<img class="middleAni-title-bg1" src="../images/titleBg1-reverse.png" alt="">
|
|
|
<img class="middleAni-title-bg2" src="../images/titleBg2.png" alt="">
|
|
|
<p class="middleAni-title-p">学   生 荣 誉</p>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
</div>
|
|
|
<!--学生通报-->
|
|
|
<div class="botNotice">
|
|
|
<a-row>
|
|
|
<a-col :span="4" style="border-right: 2px solid #82E8FE;height: 90px;">
|
|
|
<img src="../images/studentNotice.png" alt="" style="margin-bottom: 20px;">
|
|
|
<br>
|
|
|
<span style="color: #82E8FE">学生通报</span>
|
|
|
</a-col>
|
|
|
<a-col :span="19" offset="1">
|
|
|
<a-empty description="暂无数据" v-if="studentNoticeDataEmpty"
|
|
|
class="timeLine-empty"/>
|
|
|
<a-carousel :dot-position="dotposition" easing="linear" class="botNoticeCarousel"
|
|
|
:autoplay="isAutoPaly" @mouseenter="mouseenter" @mouseleave="mouseleave"
|
|
|
:dots="false" v-if="studentNoticeData.length != 0">
|
|
|
<p style="color: #fff !important;text-indent: 2em;font-size: 12px;margin-bottom: 0 !important;"
|
|
|
v-for="(item,i) in studentNoticeData" :key="i" @click="showModal(item)">
|
|
|
{{item.punish_context}}
|
|
|
<br><br>
|
|
|
<span>具体名单如下：</span>
|
|
|
<br>
|
|
|
<span style="display: inline-block;margin-left: 60px;">
|
|
|
{{item.punish_students}}
|
|
|
</span>
|
|
|
<br>
|
|
|
</p>
|
|
|
</a-carousel>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<CommonModal :visible="visible" :modalTitle="modalTitle" :releaseCompany="releaseCompany"
|
|
|
:releasePerson="releasePerson" :releaseTime="releaseTime" :modalContent="modalContent"
|
|
|
:modalContentName="modalContentName"
|
|
|
@cancelModal="cancelModal"></CommonModal>
|
|
|
</a-spin>
|
|
|
</CommonBox>
|
|
|
</template>
|
|
|
<script>
|
|
|
import CommonBox from '../../secondPages/commonBox.vue';
|
|
|
import CommonModal from './commomModal.vue'
|
|
|
import {Carousel, Table, Row, Col, Collapse, Spin, Empty} from 'ant-design-vue';
|
|
|
import {swiper, swiperSlide} from 'vue-awesome-swiper'
|
|
|
import 'swiper/dist/css/swiper.css'
|
|
|
import * as echarts from 'echarts'
|
|
|
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
//对话框数据
|
|
|
visible: false,//对话框显示隐藏
|
|
|
modalTitle: '',//对话框标题
|
|
|
releaseCompany: '',//发布单位
|
|
|
releasePerson: '',//发布人
|
|
|
releaseTime: '',//发布时间
|
|
|
modalContent: '',//内容
|
|
|
modalContentName: '',//名单
|
|
|
//学生管理数据1
|
|
|
studentManageData1: [],
|
|
|
allStudeantTotal: 0,
|
|
|
//学生管理数据2
|
|
|
studentManageData2: [],
|
|
|
genderGril: '',
|
|
|
numGril: '',
|
|
|
genderBoy: '',
|
|
|
numrBoy: '',
|
|
|
boybili: '',
|
|
|
grilbili: '',
|
|
|
spinning: false,
|
|
|
currentKey: '0',
|
|
|
rightTopShow: true,
|
|
|
honorDataSourseIndex: 0,
|
|
|
//学生荣誉
|
|
|
honorDataSourse: [],
|
|
|
swiperOption: {
|
|
|
initialSlide: 0,//默认第几张
|
|
|
loop: true, //循环
|
|
|
autoplay: true, //每张播放时长3秒，自动播放
|
|
|
speed: 800,//滑动速度
|
|
|
slidesPerView: 4,
|
|
|
|
|
|
},
|
|
|
dotposition: 'right',
|
|
|
//学生通报
|
|
|
studentNoticeData: [],
|
|
|
//表格数据
|
|
|
collapseData: [
|
|
|
{
|
|
|
headText: '',
|
|
|
tableData: [],
|
|
|
columns: [
|
|
|
{title: '年级', dataIndex: 'stage_name', key: 'stage_name', align: "center",},
|
|
|
{title: '人数', dataIndex: 'total', key: 'total', align: "center",},
|
|
|
{title: '男生', dataIndex: 'nan_total', key: 'nan_total', align: "center",},
|
|
|
{title: '女生', dataIndex: 'nv_total', key: 'nv_total', align: "center",},
|
|
|
{title: '班级数', dataIndex: 'class_total', key: 'class_total', align: "center",},
|
|
|
]
|
|
|
|
|
|
}, {
|
|
|
headText: '',
|
|
|
tableData: [],
|
|
|
columns: [
|
|
|
{title: '年级', dataIndex: 'stage_name', key: 'stage_name', align: "center",},
|
|
|
{title: '人数', dataIndex: 'total', key: 'total', align: "center",},
|
|
|
{title: '男生', dataIndex: 'nan_total', key: 'nan_total', align: "center",},
|
|
|
{title: '女生', dataIndex: 'nv_total', key: 'nv_total', align: "center",},
|
|
|
{title: '班级数', dataIndex: 'class_total', key: 'class_total', align: "center",},
|
|
|
]
|
|
|
}, {
|
|
|
headText: '',
|
|
|
tableData: [],
|
|
|
columns: [
|
|
|
{title: '年级', dataIndex: 'stage_name', key: 'stage_name', align: "center",},
|
|
|
{title: '人数', dataIndex: 'total', key: 'total', align: "center",},
|
|
|
{title: '男生', dataIndex: 'nan_total', key: 'nan_total', align: "center",},
|
|
|
{title: '女生', dataIndex: 'nv_total', key: 'nv_total', align: "center",},
|
|
|
{title: '班级数', dataIndex: 'class_total', key: 'class_total', align: "center",},
|
|
|
]
|
|
|
},
|
|
|
],
|
|
|
//学生通报是否自动切换
|
|
|
isAutoPaly: true,
|
|
|
honorDataSourseEmpty: false,
|
|
|
studentNoticeDataEmpty: false,
|
|
|
collapseDataEmpty: false,
|
|
|
|
|
|
}
|
|
|
},
|
|
|
computed: {},
|
|
|
watch: {
|
|
|
currentKey(val, old) {
|
|
|
this.currentKey = val
|
|
|
}
|
|
|
},
|
|
|
beforeMount() {
|
|
|
},
|
|
|
created() {
|
|
|
|
|
|
},
|
|
|
mounted() {
|
|
|
this.$nextTick(() => {
|
|
|
|
|
|
})
|
|
|
//学生管理数据1获取
|
|
|
this.getStudentManageData1()
|
|
|
//学生管理数据2获取
|
|
|
this.getStudentManageData2()
|
|
|
//学生管理数据3获取
|
|
|
this.getStudentManageData3()
|
|
|
//学生管理数据4获取
|
|
|
this.getStudentManageData4()
|
|
|
//学生荣誉数据
|
|
|
this.getHonorData()
|
|
|
//学生通报
|
|
|
this.getStudentNoticeData()
|
|
|
// setInterval(() => {
|
|
|
// this.currentKey++
|
|
|
// if (this.currentKey == 4) {
|
|
|
// this.currentKey = 1
|
|
|
// }
|
|
|
// }, 2000)
|
|
|
|
|
|
},
|
|
|
beforeUpdate() {
|
|
|
|
|
|
},
|
|
|
methods: {
|
|
|
//显示学生通报对话框
|
|
|
showModal(accept) {
|
|
|
//console.log('显示学生通报对话框', accept)
|
|
|
this.visible = true
|
|
|
this.modalTitle = accept.punish_title
|
|
|
this.releaseTime = accept.create_time.slice(0, 10) + '\xa0\xa0' + accept.create_time.slice(12, 19)
|
|
|
this.modalContent = accept.punish_context
|
|
|
this.modalContentName = accept.punish_students
|
|
|
},
|
|
|
//关闭对话框
|
|
|
cancelModal() {
|
|
|
this.visible = false
|
|
|
},
|
|
|
//学生管理数据1获取
|
|
|
getStudentManageData1: function () {
|
|
|
let param = {
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": "query_deyu_xuesheng",
|
|
|
"query_param": [
|
|
|
this.BaseConfig.person_info_my.bureau_id + ""
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [],
|
|
|
"query_format": "json",
|
|
|
"query_group": []
|
|
|
}
|
|
|
this.spinning = true;
|
|
|
this.DataexReportInterface.callInterface([{
|
|
|
params: param,
|
|
|
method: "post",
|
|
|
}], (result) => {
|
|
|
// this.getStudentManageData2()
|
|
|
this.spinning = false;
|
|
|
if (result[0].data.result.length != 0) {
|
|
|
this.studentManageData1 = JSON.parse(result[0].data.result)
|
|
|
for (let i = 0; i < this.studentManageData1.length; i++) {
|
|
|
this.allStudeantTotal += this.studentManageData1[i].total
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
//学生管理数据2获取
|
|
|
getStudentManageData2: function () {
|
|
|
let param = {
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": "query_deyu_xuesheng2",
|
|
|
"query_param": [
|
|
|
this.BaseConfig.person_info_my.bureau_id + ""
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [],
|
|
|
"query_format": "json",
|
|
|
"query_group": []
|
|
|
}
|
|
|
this.spinning = true;
|
|
|
this.DataexReportInterface.callInterface([{
|
|
|
params: param,
|
|
|
method: "post",
|
|
|
}], (result) => {
|
|
|
this.spinning = false;
|
|
|
if (result[0].data.result.length != 0) {
|
|
|
this.studentManageData2 = JSON.parse(result[0].data.result)
|
|
|
this.genderGril = this.studentManageData2[0].XB_NAME
|
|
|
this.numGril = this.studentManageData2[0].total
|
|
|
this.genderBoy = this.studentManageData2[1].XB_NAME
|
|
|
this.numrBoy = this.studentManageData2[1].total
|
|
|
this.getEchartsBoy()
|
|
|
this.getEchartsGirl()
|
|
|
}
|
|
|
this.boybili = parseInt(Number(this.numrBoy) / Number(this.allStudeantTotal) * 100) + 1
|
|
|
this.grilbili = parseInt(Number(this.numGril) / Number(this.allStudeantTotal) * 100)
|
|
|
})
|
|
|
},
|
|
|
//学生管理折叠面板数据获取
|
|
|
getStudentManageData3: function () {
|
|
|
let param = {
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": "query_deyu_xuesheng3",
|
|
|
"query_param": [
|
|
|
this.BaseConfig.person_info_my.bureau_id + ""
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [],
|
|
|
"query_format": "json",
|
|
|
"query_group": []
|
|
|
}
|
|
|
this.spinning = true;
|
|
|
this.DataexReportInterface.callInterface([{
|
|
|
params: param,
|
|
|
method: "post",
|
|
|
}], (result) => {
|
|
|
this.spinning = false;
|
|
|
if (result[0].data.result.length != 0) {
|
|
|
let res3 = JSON.parse(result[0].data.result)
|
|
|
this.collapseData[0].headText = '小学部' + '\xa0\xa0\xa0\xa0\xa0\xa0' + '总数' + '\xa0' + '/' + '\xa0' +
|
|
|
res3[0].total + '\xa0\xa0\xa0\xa0\xa0\xa0' + '男生' + '\xa0' + '/' + '\xa0' + res3[0].nan_total +
|
|
|
'\xa0\xa0\xa0\xa0\xa0\xa0' + '女生' + '\xa0' + '/' + '\xa0' + res3[0].nv_total
|
|
|
this.collapseData[1].headText = '中学部' + '\xa0\xa0\xa0\xa0\xa0\xa0' + '总数' + '\xa0' + '/' + '\xa0' +
|
|
|
res3[1].total + '\xa0\xa0\xa0\xa0\xa0\xa0' + '男生' + '\xa0' + '/' + '\xa0' + res3[1].nan_total +
|
|
|
'\xa0\xa0\xa0\xa0\xa0\xa0' + '女生' + '\xa0' + '/' + '\xa0' + res3[1].nv_total
|
|
|
this.collapseData[2].headText = '高中部' + '\xa0\xa0\xa0\xa0\xa0\xa0' + '总数' + '\xa0' + '/' + '\xa0' +
|
|
|
res3[2].total + '\xa0\xa0\xa0\xa0\xa0\xa0' + '男生' + '\xa0' + '/' + '\xa0' + res3[2].nan_total +
|
|
|
'\xa0\xa0\xa0\xa0\xa0\xa0' + '女生' + '\xa0' + '/' + '\xa0' + res3[2].nv_total
|
|
|
} else {
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
},
|
|
|
//学生管理数据4获取
|
|
|
getStudentManageData4: function () {
|
|
|
let param = {
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": "query_deyu_xuesheng4",
|
|
|
"query_param": [
|
|
|
this.BaseConfig.person_info_my.bureau_id + ""
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [],
|
|
|
"query_format": "json",
|
|
|
"query_group": []
|
|
|
}
|
|
|
this.spinning = true;
|
|
|
this.DataexReportInterface.callInterface([{
|
|
|
params: param,
|
|
|
method: "post",
|
|
|
}], (result) => {
|
|
|
this.spinning = false;
|
|
|
if (result[0].data.result.length != 0) {
|
|
|
this.studentManageData4 = JSON.parse(result[0].data.result)
|
|
|
this.studentManageData4.forEach(item => {
|
|
|
if (item.stage_name == '小学') {
|
|
|
this.collapseData[0].tableData.push(item)
|
|
|
} else if (item.stage_name == '初中') {
|
|
|
this.collapseData[1].tableData.push(item)
|
|
|
} else if (item.stage_name == '高中') {
|
|
|
this.collapseData[2].tableData.push(item)
|
|
|
}
|
|
|
})
|
|
|
} else {
|
|
|
this.collapseDataEmpty = true
|
|
|
}
|
|
|
res.forEach(item => {
|
|
|
if (item.stage_name == '小学') {
|
|
|
this.collapseData[0].tableData.push(item)
|
|
|
} else if (item.stage_name == '初中') {
|
|
|
this.collapseData[1].tableData.push(item)
|
|
|
} else if (item.stage_name == '高中') {
|
|
|
this.collapseData[2].tableData.push(item)
|
|
|
}
|
|
|
})
|
|
|
})
|
|
|
},
|
|
|
//学生荣誉
|
|
|
getHonorData() {
|
|
|
let param = {
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": "query_deyu_rongyu",
|
|
|
"query_param": [
|
|
|
this.BaseConfig.person_info_my.bureau_id + ""
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [],
|
|
|
"query_format": "json",
|
|
|
"query_group": []
|
|
|
}
|
|
|
this.spinning = true;
|
|
|
this.DataexReportInterface.callInterface([{
|
|
|
params: param,
|
|
|
method: "post",
|
|
|
}], (result) => {
|
|
|
this.spinning = false;
|
|
|
if (result[0].data.result.length != 0) {
|
|
|
this.honorDataSourse = JSON.parse(result[0].data.result)
|
|
|
} else {
|
|
|
this.honorDataSourseEmpty = true
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
//学生通报
|
|
|
getStudentNoticeData() {
|
|
|
let param = {
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": "query_deyu_tongbao",
|
|
|
"query_param": [
|
|
|
this.BaseConfig.person_info_my.bureau_id + ""
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [],
|
|
|
"query_format": "json",
|
|
|
"query_group": []
|
|
|
}
|
|
|
this.spinning = true;
|
|
|
this.DataexReportInterface.callInterface([{
|
|
|
params: param,
|
|
|
method: "post",
|
|
|
}], (result) => {
|
|
|
this.spinning = false;
|
|
|
if (result[0].data.result != '') {
|
|
|
this.studentNoticeData = JSON.parse(result[0].data.result)
|
|
|
} else {
|
|
|
this.studentNoticeDataEmpty = true
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
collapseChange(key) {
|
|
|
this.currentKey = key
|
|
|
},
|
|
|
getEchartsBoy() {
|
|
|
echarts.init(document.getElementById('myechartsBoy')).setOption({
|
|
|
tooltip: {
|
|
|
trigger: 'item',
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
type: 'pie',
|
|
|
radius: ['75%', '100%'],
|
|
|
center: ['50%', '50%'],
|
|
|
avoidLabelOverlap: false,
|
|
|
color: ['#93A0BD', '#2196f3'],
|
|
|
labelLine: {
|
|
|
show: false
|
|
|
},
|
|
|
label: {
|
|
|
show: false,
|
|
|
position: 'center',
|
|
|
//formatter: '{d}%'
|
|
|
},
|
|
|
tooltip: {
|
|
|
trigger: 'item',
|
|
|
},
|
|
|
data: [
|
|
|
{
|
|
|
value: this.allStudeantTotal,
|
|
|
label: {
|
|
|
normal: {
|
|
|
show: true,
|
|
|
}
|
|
|
}
|
|
|
|
|
|
},
|
|
|
{
|
|
|
value: this.numrBoy,
|
|
|
label: {
|
|
|
normal: {
|
|
|
show: true,
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
]
|
|
|
}
|
|
|
]
|
|
|
})
|
|
|
},
|
|
|
getEchartsGirl() {
|
|
|
echarts.init(document.getElementById('myechartsGril')).setOption({
|
|
|
tooltip: {
|
|
|
trigger: 'item',
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
type: 'pie',
|
|
|
radius: ['75%', '100%'],
|
|
|
center: ['50%', '50%'],
|
|
|
avoidLabelOverlap: false,
|
|
|
color: ['#93A0BD', '#EC808D'],
|
|
|
labelLine: {
|
|
|
show: false
|
|
|
},
|
|
|
tooltip: {
|
|
|
trigger: 'item',
|
|
|
},
|
|
|
data: [
|
|
|
{
|
|
|
value: this.allStudeantTotal,
|
|
|
label: {
|
|
|
normal: {
|
|
|
show: true,
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{value: this.numGril}
|
|
|
]
|
|
|
}
|
|
|
]
|
|
|
})
|
|
|
},
|
|
|
getCustomRow() {
|
|
|
let obj = {style: {}};
|
|
|
obj['style']['color'] = '#fff';
|
|
|
return obj;
|
|
|
},
|
|
|
mouseenter() {
|
|
|
this.isAutoPaly = false
|
|
|
},
|
|
|
mouseleave() {
|
|
|
this.isAutoPaly = true
|
|
|
},
|
|
|
mouseenterSwiper(e) {
|
|
|
this.swiperOption.autoplay = false
|
|
|
this.swiperOption.loop = false
|
|
|
},
|
|
|
mouseleaveSwiper(e) {
|
|
|
this.swiperOption.autoplay = true
|
|
|
this.swiperOption.loop = true
|
|
|
},
|
|
|
},
|
|
|
components: {
|
|
|
CommonBox,
|
|
|
CommonModal,
|
|
|
ARow: Row,
|
|
|
ACol: Col,
|
|
|
ACollapse: Collapse,
|
|
|
ACollapsePanel: Collapse.Panel,
|
|
|
ATable: Table,
|
|
|
ACarousel: Carousel,
|
|
|
ASpin: Spin,
|
|
|
AEmpty: Empty,
|
|
|
//学生荣誉轮播图
|
|
|
swiper,
|
|
|
swiperSlide,
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss" type="text/scss">
|
|
|
.moral-education-student-style {
|
|
|
width: calc(65% - 12px) !important;
|
|
|
height: 600px !important;
|
|
|
padding-right: 0 !important;
|
|
|
|
|
|
.brandCreat {
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
|
|
|
.studentManageBox {
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
|
|
|
.timeLine-empty {
|
|
|
margin-top: 30px;
|
|
|
}
|
|
|
|
|
|
/*‘学生信息’*/
|
|
|
.studentManageBox-leftTitle {
|
|
|
width: 5%;
|
|
|
margin-left: -20px;
|
|
|
position: relative;
|
|
|
|
|
|
.bg1 {
|
|
|
position: absolute;
|
|
|
top: 0;
|
|
|
left: 0;
|
|
|
}
|
|
|
|
|
|
.bg2 {
|
|
|
position: absolute;
|
|
|
top: 8px;
|
|
|
right: 3px;
|
|
|
}
|
|
|
|
|
|
.p {
|
|
|
position: absolute;
|
|
|
top: 30px;
|
|
|
left: 17px;
|
|
|
margin: 0 auto;
|
|
|
color: #fff;
|
|
|
width: 18px;
|
|
|
font-size: 18px;
|
|
|
line-height: 18px;
|
|
|
|
|
|
span {
|
|
|
margin-bottom: 15px;
|
|
|
display: inline-block;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/*左侧*/
|
|
|
.studentManageBox-left {
|
|
|
width: 47%;
|
|
|
height: 100%;
|
|
|
border-right: 1px dashed #fff;
|
|
|
padding-right: 10px;
|
|
|
|
|
|
.left-topNum {
|
|
|
height: 180px;
|
|
|
width: 520px;
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
position: relative;
|
|
|
|
|
|
.left-topNum-ani {
|
|
|
margin: 10px;
|
|
|
width: 150px;
|
|
|
height: 150px;
|
|
|
font-size: 18px;
|
|
|
|
|
|
.box-9-content-style {
|
|
|
width: 150px;
|
|
|
height: 150px;
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
justify-content: center;
|
|
|
align-items: center;
|
|
|
|
|
|
.box-9-text-style {
|
|
|
color: #01F6F9;
|
|
|
font-family: 'lightFont';
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.left-topNum-num {
|
|
|
height: 45%;
|
|
|
margin-left: 24px;
|
|
|
color: #3CD5FF;
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
|
|
|
.numbox {
|
|
|
width: 80px;
|
|
|
height: 80px;
|
|
|
text-align: center;
|
|
|
|
|
|
.num {
|
|
|
font-weight: 700;
|
|
|
margin-top: 16px;
|
|
|
margin-bottom: 20px;
|
|
|
font-size: 34px;
|
|
|
}
|
|
|
|
|
|
.text {
|
|
|
font-size: 14px;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
.left-topNum-num > div:nth-child(2) {
|
|
|
border-left: 2px solid #0C3163;
|
|
|
border-right: 2px solid #0C3163;
|
|
|
margin: 0 20px;
|
|
|
width: 116px;
|
|
|
height: 60px;
|
|
|
margin-top: 10px;
|
|
|
|
|
|
.num {
|
|
|
margin-top: 7px;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.left-topNum-gender {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
height: 90px;
|
|
|
margin-top: 10px;
|
|
|
position: absolute;
|
|
|
top: 80px;
|
|
|
right: 0;
|
|
|
|
|
|
.boy, .gril {
|
|
|
position: relative;
|
|
|
width: 140px;
|
|
|
height: 80px;
|
|
|
padding: 5px;
|
|
|
background: #1A366F;
|
|
|
box-shadow: 5px 5px 13px rgba(255, 255, 255, .3);
|
|
|
|
|
|
.total {
|
|
|
position: absolute;
|
|
|
display: inline-block;
|
|
|
font-size: 22px;
|
|
|
left: 10px;
|
|
|
bottom: 9px;
|
|
|
font-weight: 600;
|
|
|
color: #fff;
|
|
|
white-space: nowrap;
|
|
|
}
|
|
|
|
|
|
.gender-style {
|
|
|
position: absolute;
|
|
|
display: inline-block;
|
|
|
font-size: 14px;
|
|
|
color: #3CD5FF;
|
|
|
left: 30px;
|
|
|
top: 5px;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.boy {
|
|
|
margin-right: 40px;
|
|
|
|
|
|
.border {
|
|
|
position: absolute;
|
|
|
display: inline-block;
|
|
|
width: 10px;
|
|
|
height: 25px;
|
|
|
background: #02A7F0;
|
|
|
border-radius: 5px;
|
|
|
left: 10px;
|
|
|
/*#EC808D*/
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.gril {
|
|
|
.border {
|
|
|
position: absolute;
|
|
|
display: inline-block;
|
|
|
width: 10px;
|
|
|
height: 25px;
|
|
|
background: #EC808D;
|
|
|
border-radius: 5px;
|
|
|
left: 10px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
//表格
|
|
|
.bot-collapse {
|
|
|
margin-top: 20px;
|
|
|
width: 500px;
|
|
|
height: 350px;
|
|
|
|
|
|
/deep/ .ant-collapse .ant-collapse-item:nth-child(1) .ant-table-thead > tr > th {
|
|
|
padding: 2px;
|
|
|
}
|
|
|
|
|
|
/deep/ .ant-collapse .ant-collapse-item:nth-child(1) .ant-table-tbody > tr > td {
|
|
|
padding: 2px;
|
|
|
}
|
|
|
|
|
|
/deep/ .ant-collapse .ant-collapse-item:nth-child(2) .ant-table-thead > tr > th {
|
|
|
padding: 12px;
|
|
|
}
|
|
|
|
|
|
/deep/ .ant-collapse .ant-collapse-item:nth-child(2) .ant-table-tbody > tr > td {
|
|
|
padding: 12px;
|
|
|
}
|
|
|
|
|
|
/deep/ .ant-collapse .ant-collapse-item:nth-child(3) .ant-table-thead > tr > th {
|
|
|
padding: 12px;
|
|
|
}
|
|
|
|
|
|
/deep/ .ant-collapse .ant-collapse-item:nth-child(3) .ant-table-tbody > tr > td {
|
|
|
padding: 12px;
|
|
|
}
|
|
|
|
|
|
/deep/ .ant-collapse {
|
|
|
height: 100%;
|
|
|
background: rgba(0, 0, 0, 0) !important;
|
|
|
border: none !important;
|
|
|
color: #3CD5FF !important;
|
|
|
|
|
|
.ant-collapse-item {
|
|
|
border: none !important;
|
|
|
|
|
|
.ant-collapse-header {
|
|
|
color: #3CD5FF !important;
|
|
|
background: #183A76;
|
|
|
transform: skewX(-20deg);
|
|
|
margin-bottom: 10px;
|
|
|
height: 40px;
|
|
|
font-size: 16px;
|
|
|
|
|
|
}
|
|
|
|
|
|
.ant-collapse-content {
|
|
|
border: none !important;
|
|
|
background: rgba(0, 0, 0, 0) !important;
|
|
|
|
|
|
.ant-collapse-content-box {
|
|
|
height: 200px !important;
|
|
|
border-radius: 10px;
|
|
|
border: 2px dashed #3CD5FF;
|
|
|
color: #fff !important;
|
|
|
margin: 0 auto;
|
|
|
margin-bottom: 10px;
|
|
|
width: 480px;
|
|
|
overflow: hidden;
|
|
|
|
|
|
/deep/ .ant-collapse-content > .ant-collapse-content-box {
|
|
|
padding-top: 5px !important;
|
|
|
}
|
|
|
|
|
|
.ant-table-content {
|
|
|
.ant-table-body {
|
|
|
.ant-table-thead {
|
|
|
.ant-table-align-center {
|
|
|
background: #305795 !important;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.ant-table-tbody {
|
|
|
tr > td {
|
|
|
border-bottom: 1px dashed #fff !important;
|
|
|
background: none;
|
|
|
}
|
|
|
|
|
|
/deep/ tr > td:hover {
|
|
|
background: none !important;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.ant-table-thead > tr > th, .ant-table-tbody > tr > td {
|
|
|
/*padding: 2px;*/
|
|
|
}
|
|
|
|
|
|
.ant-table-thead > tr > th {
|
|
|
border: none;
|
|
|
transform: skewX(-20deg);
|
|
|
border-right: 5px;
|
|
|
color: #f1f1f1;
|
|
|
font-weight: 400;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/*右侧*/
|
|
|
.studentManageBox-right {
|
|
|
width: 47%;
|
|
|
height: 100%;
|
|
|
padding-left: 10px;
|
|
|
|
|
|
.topCarousel {
|
|
|
padding-right: 20px;
|
|
|
width: 100%;
|
|
|
height: 200px;
|
|
|
margin-bottom: 30px;
|
|
|
|
|
|
.right-top {
|
|
|
width: 100%;
|
|
|
height: 200px;
|
|
|
overflow: hidden;
|
|
|
padding-top: 36px;
|
|
|
|
|
|
p {
|
|
|
color: #000;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.right-top2 {
|
|
|
padding-left: 140px;
|
|
|
padding-top: 40px;
|
|
|
background: url("../images/studentManageHonor2.png");
|
|
|
background-size: 100% 100%;
|
|
|
}
|
|
|
|
|
|
.right-top1 {
|
|
|
background: url("../images/studentManageHonor1.png");
|
|
|
background-size: 100% 100%;
|
|
|
}
|
|
|
|
|
|
.right-top2 p {
|
|
|
writing-mode: vertical-lr;
|
|
|
display: inline-block;
|
|
|
font-size: 20px;
|
|
|
font-weight: 600;
|
|
|
margin-right: 20px;
|
|
|
}
|
|
|
|
|
|
.right-top1 p {
|
|
|
margin-left: 47px;
|
|
|
line-height: 6px;
|
|
|
font-size: 12px;
|
|
|
font-weight: 700;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.middleAni {
|
|
|
width: 100%;
|
|
|
height: 155px;
|
|
|
overflow: hidden;
|
|
|
position: relative;
|
|
|
|
|
|
.middleAni-pic {
|
|
|
display: inline-block;
|
|
|
width: 100%;
|
|
|
overflow: hidden;
|
|
|
|
|
|
.middleAni-pic-box {
|
|
|
height: 155px;
|
|
|
width: calc(100% - 50px);
|
|
|
/*width: 200000000px;*/
|
|
|
display: inline-block;
|
|
|
|
|
|
/deep/ .swiper-item, .swiper-slide {
|
|
|
width: 116px !important;
|
|
|
}
|
|
|
|
|
|
.divcard {
|
|
|
width: 116px;
|
|
|
padding: 5px;
|
|
|
padding-top: 15px;
|
|
|
margin-right: 9px;
|
|
|
height: 160px;
|
|
|
text-align: center;
|
|
|
background: #3B487E;
|
|
|
border-radius: 7px;
|
|
|
display: inline-block;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
@keyframes studentHonor {
|
|
|
|
|
|
}
|
|
|
|
|
|
.middleAni-title {
|
|
|
width: 48px;
|
|
|
height: 150px;
|
|
|
position: relative;
|
|
|
position: absolute;
|
|
|
top: 0;
|
|
|
z-index: 5;
|
|
|
margin-left: 2px;
|
|
|
|
|
|
.middleAni-title-bg1 {
|
|
|
position: absolute;
|
|
|
}
|
|
|
|
|
|
.middleAni-title-bg2 {
|
|
|
position: absolute;
|
|
|
top: 5px;
|
|
|
}
|
|
|
|
|
|
.middleAni-title-p {
|
|
|
position: absolute;
|
|
|
top: 33px;
|
|
|
left: 10px;
|
|
|
display: inline-block;
|
|
|
font-size: 18px;
|
|
|
writing-mode: vertical-lr;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.botNotice {
|
|
|
width: 96%;
|
|
|
height: 140px;
|
|
|
background: #284F89;
|
|
|
padding: 20px 10px 15px 20px;
|
|
|
margin-top: 20px;
|
|
|
border-radius: 7px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
}
|
|
|
</style> |
