新增宝宝详情
parent
b3ae7796c6
commit
5b13e3dc14
|
|
@ -395,6 +395,7 @@ img {
|
|||
flex-wrap: wrap;
|
||||
overflow: hidden;
|
||||
overflow-y: scroll;
|
||||
position: relative;
|
||||
}
|
||||
.attendance-right::-webkit-scrollbar{
|
||||
display: none;
|
||||
|
|
@ -577,6 +578,25 @@ img {
|
|||
.baby-album-box > img {width: 58px;height: 58px;}
|
||||
.introduce-img {display: flex;flex-wrap: wrap;}
|
||||
.introduce-img img {margin: 10px 10px 0 0;}
|
||||
|
||||
.attenddetail-ring{display: flex;width: 100%;margin-left: 40px;font-size: 16px;color: #666666;}
|
||||
.top-row {display: flex;align-items: center;}
|
||||
.attenddetail-ring >div{margin-right: 90px;}
|
||||
.attenddetail-ring >div div:last-child{margin-top: 20px;}
|
||||
.attendance-con{
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
border-top: 1px solid #D3D3D3;
|
||||
padding-top: 15px;
|
||||
margin-top: 15px;
|
||||
margin-bottom: 78px;
|
||||
}
|
||||
.baby-img01{width: 119px;height: 119px;background: #D3D3D3;border: 5px solid #ECE6FF;border-radius: 50%;}
|
||||
.baby-img02{width: 245px;height: 154px;border-radius: 10px;display: flex;justify-content: center;align-items: center;background-color: #F3F3F3;margin-right: 20px;}
|
||||
.attend-title {text-align: left;padding-right: 50px;width: 100%;}
|
||||
.chengjian{display: flex;margin-top: 5px;font-size: 16px;color: #666666;}
|
||||
.chengjian>div{display: flex;align-items: flex-end;width: 50%;line-height: 30px;}
|
||||
@media screen and (min-width:768px) and (max-width:1400px) {
|
||||
.header-box {
|
||||
height: 70px;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,76 @@
|
|||
<template>
|
||||
<div style="width: 100%;">
|
||||
<div class="yiqing-title attend-title">何雨桐</div>
|
||||
<img src="../../static/img/kindergartenIntroduce/icon-back.png" class="back-img" @click="backNews">
|
||||
<div class="attendance-con">
|
||||
<div class="top-row">
|
||||
<img src="../../static/img/seconds/tu-01.png" class="baby-img01" alt="">
|
||||
<div class="attenddetail-ring">
|
||||
<div>
|
||||
<div>性别：女</div>
|
||||
<div>班级：中二班</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>生日：2017-08-21</div>
|
||||
<div>考勤卡：20152222</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>家长：母亲 何智刚</div>
|
||||
<div>电话号码：181****258</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="yiqing-title attend-title">今日晨检考勤</div>
|
||||
<div class="attendance-con">
|
||||
<div class="chengjian">
|
||||
<div>
|
||||
<img class="baby-img02" src="../../static/img/seconds/tu-01.png" >
|
||||
<div>
|
||||
<div>入院时间：</div>
|
||||
<div>08:20:04</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="baby-img02" >
|
||||
<img src="../../static/img/attendancedetail/icon-wu.png" style="width: 156px;height: 106px;" >
|
||||
</div>
|
||||
<div>
|
||||
<div>离院时间：</div>
|
||||
<div>暂无数据展示</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'attendanceBabuDetail',
|
||||
props:{
|
||||
dataObj:{
|
||||
type:Object,
|
||||
default:()=>{
|
||||
return ''
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
backNews(){
|
||||
this.$emit('backNews',false);
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
|
|
@ -9,7 +9,8 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="attendance-right">
|
||||
<div v-if="!isNothing" class="attendance-right-item-box" v-for="(item,index) in babyArr" :key="index">
|
||||
<div v-if="!showDetail" style="display: flex;flex-wrap: wrap;">
|
||||
<div v-if="!isNothing" class="attendance-right-item-box" @click="goDetail(index)" v-for="(item,index) in babyArr" :key="index">
|
||||
<img :src="item.Head_Img" alt="">
|
||||
<span>{{item.DisplayName}}</span>
|
||||
<div :style="{background:['#9C7CFA','#FF9393','#D3D3D3','#F4B52F'][item.CheckResult]}">{{['正常','未到校','离校','请假'][item.CheckResult]}}</div>
|
||||
|
|
@ -19,36 +20,43 @@
|
|||
<div>{{['没有出勤','暂无离校','暂无未到校','没有请假'][navIndex]}}的宝宝</div>
|
||||
</div>
|
||||
</div>
|
||||
<attendanceBabuDetail v-if="showDetail" :dataObj="dataObj" @backNews="backNews"></attendanceBabuDetail>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import attendanceBabuDetail from '@/components/attendanceBabuDetail.vue';
|
||||
export default {
|
||||
components:{
|
||||
attendanceBabuDetail
|
||||
},
|
||||
name: 'babyActivity',
|
||||
data() {
|
||||
return {
|
||||
navArr:[
|
||||
{icon:require('../../static/img/attendancedetail/icon-attendancedetail.png'),title:'出勤详情',num:12},
|
||||
{icon:require('../../static/img/attendancedetail/icon-attendancedetail.png'),title:'出勤详情',num:0},
|
||||
{icon:require('../../static/img/attendancedetail/icon-lixiao.png'),title:'离校情况',num:0},
|
||||
{icon:require('../../static/img/attendancedetail/icon-weidao.png'),title:'未到校宝宝',num:0},
|
||||
{icon:require('../../static/img/attendancedetail/icon-qingj.png'),title:'请假宝宝',num:0},
|
||||
],
|
||||
navIndex:0,
|
||||
babyArr:[
|
||||
{teatherImg:require('../../static/img/seconds/tu-01.png'),teatherName:'张跑跑',status:0},
|
||||
{teatherImg:require('../../static/img/seconds/tu-01.png'),teatherName:'张跑跑',status:1},
|
||||
{teatherImg:require('../../static/img/seconds/tu-01.png'),teatherName:'张跑跑',status:2},
|
||||
{teatherImg:require('../../static/img/seconds/tu-01.png'),teatherName:'张跑跑',status:3},
|
||||
{teatherImg:require('../../static/img/seconds/tu-01.png'),teatherName:'张跑跑',status:0},
|
||||
{teatherImg:require('../../static/img/seconds/tu-01.png'),teatherName:'张跑跑',status:0},
|
||||
{teatherImg:require('../../static/img/seconds/tu-01.png'),teatherName:'张跑跑',status:0},
|
||||
{teatherImg:require('../../static/img/seconds/tu-01.png'),teatherName:'张跑跑',status:0},
|
||||
],
|
||||
babyArr:[],
|
||||
isNothing:false,
|
||||
cunArr:[]
|
||||
cunArr:[],
|
||||
showDetail:false,
|
||||
dataObj:''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
goDetail(e){
|
||||
console.log(e);
|
||||
this.showDetail = true;
|
||||
},
|
||||
// 继承详情返回事件
|
||||
backNews(e){
|
||||
this.showDetail = e;
|
||||
},
|
||||
chooseNavEv(e){
|
||||
this.navIndex = e;
|
||||
if(e==0){
|
||||
|
|
@ -76,10 +84,26 @@
|
|||
this.navArr[3].num = leftInfo.leaveSchoolNum;
|
||||
this.babyArr = leftInfo.list;
|
||||
this.cunArr = leftInfo.list;
|
||||
}
|
||||
},
|
||||
// 获取出勤详情数量问题
|
||||
async queryattendancebyidEv(){
|
||||
let data = await this.$axios({
|
||||
// 调用 serviceAPI
|
||||
url: this.$https.queryattendancebyid,
|
||||
methods: "get",
|
||||
params: {
|
||||
EquipmentGuid: "yaohaotest001"
|
||||
},
|
||||
});
|
||||
console.log(data.data.data);
|
||||
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
// 获取出勤数据
|
||||
this.checkAttendanceNum();
|
||||
// 获取当前学生信息
|
||||
this.queryattendancebyidEv();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -25,29 +25,13 @@
|
|||
</div>
|
||||
</div>
|
||||
<!-- 当前活动 -->
|
||||
<div v-for="(item,index) in dangArr" :key="index" class="class-item-box" style="height: 210px;">
|
||||
<div v-for="(item,index) in dangArr.Content" :key="index" class="class-item-box" style="height: 210px;">
|
||||
<div class="teather-title">当前活动</div>
|
||||
<div class="class-active">
|
||||
<label>{{item.TimePart}}</label>
|
||||
<label>{{item.Name}}</label>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 当前活动 -->
|
||||
<div class="class-item-box" style="height: 210px;">
|
||||
<div class="teather-title">当前活动</div>
|
||||
<div class="class-active">
|
||||
<label>13:00-15:00</label>
|
||||
<label>户外体育</label>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 当前活动 -->
|
||||
<div class="class-item-box" style="height: 210px;">
|
||||
<div class="teather-title">当前活动</div>
|
||||
<div class="class-active">
|
||||
<label>13:00-15:00</label>
|
||||
<label>户外体育</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -90,19 +74,14 @@
|
|||
data() {
|
||||
return {
|
||||
weekNum:0,
|
||||
dateTime:'2021年12月28日',
|
||||
dateTime:'',
|
||||
className:'',
|
||||
teatherArr:[
|
||||
{name:'张芳芳',headImg:require('../../static/img/seconds/tu-01.png')},
|
||||
{name:'张芳芳',headImg:require('../../static/img/seconds/tu-01.png')},
|
||||
{name:'张芳芳',headImg:require('../../static/img/seconds/tu-01.png')},
|
||||
{name:'张芳芳',headImg:require('../../static/img/seconds/tu-01.png')},
|
||||
{name:'张芳芳',headImg:require('../../static/img/seconds/tu-01.png')},
|
||||
],
|
||||
teatherArr:[],
|
||||
kebiaoArr:['时间','星期一','星期二','星期三','星期四','星期五'],
|
||||
dataArr:[],
|
||||
isNothing:false,
|
||||
dangArr:[]
|
||||
dangArr:[],
|
||||
timer:null
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -135,7 +114,15 @@
|
|||
},
|
||||
});
|
||||
let newData = data.data.data;
|
||||
this.dangArr = newData[0].WeekData;
|
||||
let newDate = new Date();
|
||||
let timeDate = `${newDate.getHours()}.${newDate.getMinutes()}`;
|
||||
if('8.00' <= timeDate && timeDate <= '11.55') {
|
||||
this.dangArr = newData[0].WeekData[0];
|
||||
} else if('11.55' <= timeDate && timeDate <= '15.00') {
|
||||
this.dangArr = newData[0].WeekData[1];
|
||||
} else if('15.00' <= timeDate && timeDate <= '17.00') {
|
||||
this.dangArr = newData[0].WeekData[2];
|
||||
}
|
||||
},
|
||||
// 班级情况
|
||||
async classStatusEv() {
|
||||
|
|
@ -158,6 +145,13 @@
|
|||
this.schedulingWebEv();
|
||||
// 班级情况
|
||||
this.classStatusEv();
|
||||
// 各一分钟调用一次当前活动
|
||||
this.timer = setInterval(()=>{
|
||||
this.schedulingWebEv();
|
||||
},1000)
|
||||
},
|
||||
destroyed(){
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
Binary file not shown.
Loading…
Reference in New Issue