chen
/
electron-ban-pai
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

新增表单

master
Lee 2022-02-16 12:50:47 +08:00
parent 9e9070e489
commit 06fe1a16a3
1 changed files with 462 additions and 316 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

778
src/components/babyActivity.vue
View File

@ -1,316 +1,462 @@
<template>
<div>
<error-page v-if="showError" @closeError="closeError"></error-page>
<!-- 主体内容 -->
<div v-if="!showError" class="main">
<!-- 左侧 -->
<div class="main-left">
<!-- 班级情况 -->
<div class="class-left-one">
<div class="baby-left-content">
<div class="class-left-title">
<div class="pultitle">班级情况</div>
</div>
<div class="baby-content-box">
<div class="class-situation class-item-box" v-if="className!=''">{{className}}</div>
<!-- 班级老师 -->
<div class="class-item-box" v-if="teatherArr.length!=0">
<div class="teather-title">班级老师</div>
<div class="teather-box">
<div v-for="(item,index) in teatherArr" :key="index">
<img v-if="item.AvatarUrl!=''" :src="item.AvatarUrl" >
<img v-else src="../../static/img/kindergartenIntroduce/teacher-icon.jpg" >
<span>{{item.TeacherName}}</span>
<!-- <label @click="goDetail(index)" style="font-size: 14px;margin-top: 10px;color: #9c7cfa;">查看详情</label> -->
</div>
</div>
</div>
<div class="plan-box">
<v-touch v-on:swipeleft="touchDayEv" v-on:swiperight="touchDayEv">
<button type="button">查看周计划</button>
</v-touch>
<v-touch v-on:swipeleft="touchMonthEv" v-on:swiperight="touchMonthEv">
<button type="button">查看月计划</button>
</v-touch>
</div>
<!-- 当前活动 -->
<!-- 一种排版 -->
<!-- <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 v-for="(item,index) in dangArr" :key="index">
<div v-if="item.NowTimePart!=null" class="class-item-box" style="height: 210px;">
<div class="teather-title">当前活动</div>
<div class="class-active">
<label>{{item.NowTimePart}}</label>
<label>{{item.NowCourse || '暂无活动'}}</label>
</div>
</div>
<div v-if="item.NextTimePart!=null" class="class-item-box" style="height: 210px;">
<div class="teather-title">当前活动</div>
<div class="class-active">
<label>{{item.NextTimePart}}</label>
<label>{{item.NextCourse || '暂无活动'}}</label>
</div>
</div>
</div> -->
</div>
</div>
</div>
</div>
<!-- 周计划弹框 -->
<div v-if="isDay" class="notice-k" @click="closeNotice">
<div @click.stop="isDay=true" class="notice-box">
<div class="notice-title-box">
<!-- <img src="../../static/img/home/flower.png"> -->
<div>第15周工作计划</div>
<!-- <img src="../../static/img/home/flower.png"> -->
</div>
<div style="padding: 0 20px;">
<div class="second-title">啥地方叫了</div>
<div class="line"></div>
<div class="three-content left-notice" style="height: auto;max-height: 600px;overflow: hidden;overflow-y: scroll;">
<div class="">阿萨德立方空间</div>
</div>
</div>
</div>
</div>
<!-- 月计划弹框 -->
<div v-if="isMonth" class="notice-k" @click="closeNotice">
<div @click.stop="isMonth=true" class="notice-box">
<div class="notice-title-box">
<div>(2022-2)月主题活动及工作要点</div>
</div>
<div style="padding: 0 20px;">
<div class="second-title">啥地方叫了</div>
<div class="line"></div>
<div class="three-content left-notice" style="height: auto;max-height: 600px;overflow: hidden;overflow-y: scroll;">
<div class="">阿萨德立方空间</div>
</div>
</div>
</div>
</div>
<!-- 右侧 -->
<div class="class-main-right">
<div v-if="!showDetail">
<div class="class-left-title">
<!-- <div class="pultitle" >宝宝课表第{{weekNum}}周（{{dateTime}}）</div> -->
<div class="pultitle" >宝宝课表第{{weekNum}}周</div>
</div>
<div class="baby-content-box">
<div class="time-title-box">
<div v-for="(item,index) in kebiaoArr" :key="index">{{item}}</div>
</div>
<template v-if="dataArr.length!=0">
<div class="tiam-data-box" v-for="(item,index) in dataArr" :key="index">
<div class="time-left" :style="{background:['#C3AEFF','#F1D470','#FF9393'][index]}">{{item.Ampm}}</div>
<div style="width: 100%;">
<div class="time-right-box" v-for="(itemt,indext) in item.Content" :key="indext">
<div class="time-item clips1" style="border-radius: 10px 0 0 10px;display: flex;">
<div></div>
<div>{{itemt.TimePart}}</div>
</div>
<div class="clips1 time-item">{{itemt.Week1Name}}</div>
<div class="clips1 time-item">{{itemt.Week2Name}}</div>
<div class="clips1 time-item">{{itemt.Week3Name}}</div>
<div class="clips1 time-item">{{itemt.Week4Name}}</div>
<div class="clips1 time-item">{{itemt.Week5Name}}</div>
</div>
</div>
</div>
</template>
<loading :isShow="showLoading_right"></loading>
</div>
</div>
<div v-if="showDetail" style="background-color: #FFFFFF;border: 3px solid #7240c5;width: 100%;height: 100%;border-radius: 20px;overflow: hidden;">
<teacherStyleDetail :teacherInfo="teacherInfo" @backstyle="backstyle"></teacherStyleDetail>
</div>
</div>
</div>
</div>
</template>
<script>
import teacherStyleDetail from '@/components/teacherStyleDetail.vue';
export default {
components:{
teacherStyleDetail
},
name: 'babyActivity',
data() {
return {
weekNum:0,
dateTime:0,
className:'',
teatherArr:[],
kebiaoArr:['时间','星期一','星期二','星期三','星期四','星期五'],
dataArr:[],
isNothing:false,
dangArr:[],
timer:null,
showLoading_right:true,
showError:false,
showDetail:false,
teacherInfo:{},
isDay:false,
isMonth:false
}
},
methods: {
// 手指滑动事件
touchDayEv(){
console.log(151);
this.isDay = true;
},
touchMonthEv(){
this.isMonth = true;
},
// 关闭通知公告弹框
closeNotice(){
this.isDay = false;
this.isMonth = false;
},
// 查看教师详情
goDetail(e){
if(this.$storage.get('network')){
this.teacherInfo = this.teatherArr[e];
console.log(this.teatherArr[e]);
// this.showLoading = true;
this.getteachers_demeanor_detailEv(this.teacherInfo.TeacherGuid);
} else {
this.showError = true;
}
},
// 关闭教师详情
backstyle(){
this.showDetail = false;
},
async getteachers_demeanor_detailEv(guid) {
console.log(guid,'guid');
if(this.$storage.get('network')){
let data = await this.$axios({
// 调用 serviceAPI
url: this.$https.getteachers_demeanor_detail,
methods: "get",
params: {
Guid:guid,
OrgGuid:this.$storage.get('orgGuid')
},
});
this.teacherInfo = data.data.data;
this.$storage.set('teacherInfo',this.teacherInfo);
} else {
this.teacherInfo = this.$storage.get('teacherInfo');
}
this.showDetail = true;
// this.showLoading = false;
},
closeError(){
this.showError = false;
},
// 查看一周的宝宝课表
async getbabycourseEv() {
if(this.$storage.get('network')){
this.showError = false;
let data = await this.$axios({
url: this.$https.getbabycourse,
methods: "get",
params: {
EquipmentID: this.$storage.get('EquipmentID'),
},
});
if(data.data.data!=undefined){
let newData = data.data.data;
// 第几周
this.weekNum = newData[0].NowWeekNo;
this.$storage.set('weekNum',this.weekNum);
// 时间
let newTime = newData[0].NowDate.slice(0,10).split('/');
this.dateTime = `${newTime[2]}年${newTime[1]}月${newTime[0]}日`;
this.$storage.set('dateTimeacti',this.dateTime);
// 一周安排
this.dataArr = newData[0].WeekData;
this.$storage.set('dataArracti',this.dataArr);
}
} else {
this.weekNum = this.$storage.get('weekNum');
this.dateTime = this.$storage.get('dateTimeacti');
this.dataArr = this.$storage.get('dataArracti');
if(this.weekNum==undefined){
this.showError = true;
}
}
this.showLoading_right = false;
},
// 当前活动
async schedulingWebEv() {
if(this.$storage.get('network')){
let data = await this.$axios({
url: this.$https.schedulingWeb_two,
methods: "get",
params: {
EquipmentID: this.$storage.get('EquipmentID'),
},
});
if(data.data.data!=undefined){
// let newDataa = data.data.data;
// let newDate = new Date();
// let timeDate = `${newDate.getHours()}.${newDate.getMinutes()}`;
// if('8.00'*100 <= timeDate*100 && timeDate*100 <= '11.55'*100) {
// this.dangArr = newDataa[0].WeekData[0];
// } else if('11.55'*100 <= timeDate*100 && timeDate*100 <= '15.00'*100) {
// this.dangArr = newDataa[0].WeekData[1];
// } else if('15.00'*100 <= timeDate*100 && timeDate*100 <= '17.00'*100) {
// this.dangArr = newDataa[0].WeekData[2];
// }
this.dangArr = data.data.data;
this.$storage.set('dangArracti',this.dangArr);
}
} else {
this.dangArr = this.$storage.get('dangArracti');
}
},
// 班级情况
async classStatusEv() {
if(this.$storage.get('network')){
let data = await this.$axios({
url: this.$https.classStatus,
methods: "get",
params: {
EquipmentID: this.$storage.get('EquipmentID'),
},
});
if(data.data.data!=undefined){
this.teatherArr = data.data.data.Teachers;
this.className = data.data.data.ClassName;
this.$storage.set('teatherArracti',this.teatherArr);
this.$storage.set('classNameactu',this.className);
}
} else {
this.teatherArr = this.$storage.get('teatherArracti');
this.className = this.$storage.get('classNameactu');
}
},
},
mounted() {
// 查看一周的宝宝课表
this.getbabycourseEv();
// 当前活动
this.schedulingWebEv();
// 班级情况
this.classStatusEv();
// 各一分钟调用一次当前活动
this.timer = setInterval(()=>{
this.schedulingWebEv();
},1000*60)
},
destroyed(){
clearInterval(this.timer);
}
}
</script>
<template>
<div>
<error-page v-if="showError" @closeError="closeError"></error-page>
<!-- 主体内容 -->
<div v-if="!showError" class="main">
<!-- 左侧 -->
<div class="main-left">
<!-- 班级情况 -->
<div class="class-left-one">
<div class="baby-left-content">
<div class="class-left-title">
<div class="pultitle">班级情况</div>
</div>
<div class="baby-content-box">
<div class="class-situation class-item-box" v-if="className!=''">{{className}}</div>
<!-- 班级老师 -->
<div class="class-item-box" v-if="teatherArr.length!=0">
<div class="teather-title">班级老师</div>
<div class="teather-box">
<div v-for="(item,index) in teatherArr" :key="index">
<img v-if="item.AvatarUrl!=''" :src="item.AvatarUrl" >
<img v-else src="../../static/img/kindergartenIntroduce/teacher-icon.jpg" >
<span>{{item.TeacherName}}</span>
<!-- <label @click="goDetail(index)" style="font-size: 14px;margin-top: 10px;color: #9c7cfa;">查看详情</label> -->
</div>
</div>
</div>
<div class="plan-box">
<v-touch v-on:swipeleft="touchDayEv" v-on:swiperight="touchDayEv">
<button type="button">查看周计划</button>
</v-touch>
<v-touch v-on:swipeleft="touchMonthEv" v-on:swiperight="touchMonthEv">
<button type="button">查看月计划</button>
</v-touch>
</div>
<!-- 当前活动 -->
<!-- 一种排版 -->
<!-- <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 v-for="(item,index) in dangArr" :key="index">
<div v-if="item.NowTimePart!=null" class="class-item-box" style="height: 210px;">
<div class="teather-title">当前活动</div>
<div class="class-active">
<label>{{item.NowTimePart}}</label>
<label>{{item.NowCourse || '暂无活动'}}</label>
</div>
</div>
<div v-if="item.NextTimePart!=null" class="class-item-box" style="height: 210px;">
<div class="teather-title">当前活动</div>
<div class="class-active">
<label>{{item.NextTimePart}}</label>
<label>{{item.NextCourse || '暂无活动'}}</label>
</div>
</div>
</div> -->
</div>
</div>
</div>
</div>
<!-- 周计划弹框 -->
<div v-if="isDay" class="notice-k" @click="closeNotice">
<div @click.stop="isDay=true" class="notice-box notice-open-01 ">
<div class="notice-title-box notice-title-other">
<!-- <img src="../../static/img/home/flower.png"> -->
<div>第15周工作计划</div>
<!-- <img src="../../static/img/home/flower.png"> -->
</div>
<div style="padding: 0 20px;">
<!-- <div class="second-title">啥地方叫了</div>
<div class="line"></div>
<div class="three-content left-notice" style="height: auto;max-height: 600px;overflow: hidden;overflow-y: scroll;">
<div class="">阿萨德立方空间</div>
</div> -->
<div class="notice-table notice-table-01">
<table>
<tr>
<td colspan="5">班级：</td>
<td colspan="5">时间：</td>
</tr>
<tr>
<td>上周情况分析</td>
<td colspan="7"></td>
<td class="td-03" colspan="2" rowspan="3">家长工作：</td>
</tr>
<tr>
<td class="td-01">内容</td>
<td class="td-02">星期</td>
<td>一</td>
<td>二</td>
<td>三</td>
<td>四</td>
<td>五</td>
<td>生成与调整</td>
</tr>
<tr>
<td class="td-01">学<br />习<br />活<br />动</td>
<td class="td-02">上午</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td class="td-01" rowspan="2">户<br />外<br />活<br />动</td>
<td class="td-02">上午</td>
<td>
1.体能：<br>
2.游戏：<br>
3.自选器械：
</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td rowspan="2"></td>
<td class="td-03" colspan="2" rowspan="3">早午操指导重点：</td>
</tr>
<tr>
<td>下午</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td class="td-01" rowspan="2">游<br />戏<br />活<br />动</td>
<td class="td-02">上午</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td rowspan="2"></td>
</tr>
<tr>
<td>下午</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td colspan="2">延时活动</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td class="td-03" colspan="2" rowspan="3">环创与资源利用：</td>
</tr>
<tr>
<td colspan="2">生活活动<br />(观察引导重点)</td>
<td colspan="6"></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<!-- 月计划弹框 -->
<div v-if="isMonth" class="notice-k" @click="closeNotice">
<div @click.stop="isMonth=true" class="notice-box notice-open-02">
<div class="notice-title-box notice-title-other">
<div>(2022-2)月主题活动及工作要点</div>
</div>
<div style="padding: 0 20px;">
<!-- <div class="second-title">啥地方叫了</div>
<div class="line"></div>
<div class="three-content left-notice" style="height: auto;max-height: 600px;overflow: hidden;overflow-y: scroll;">
<div class="">阿萨德立方空间</div>
</div> -->
<div class="notice-table notice-table-02">
<table>
<tr>
<td colspan="2">班级：</td>
<td colspan="3">时间：</td>
</tr>
<tr>
<td>本月主题</td>
<td colspan="4"></td>
</tr>
<tr>
<td>主题目标及价值</td>
<td colspan="4"></td>
</tr>
<tr>
<td>本月重点工作</td>
<td colspan="4">
内容包含（保教工作）
（环境创设）
（班务工作）
</td>
</tr>
<tr>
<td>生活活动</td>
<td colspan="4"></td>
</tr>
<tr>
<td>游戏活动</td>
<td colspan="2">
<p>目标</p>
</td>
<td colspan="2">
<p>环境与材料调整</p>
</td>
</tr>
<tr>
<td>学习活动</td>
<td colspan="2">
<p>每周主题（简写）</p>
第一周：<br />
第二周：<br />
第三周：<br />
第四周：
</td>
<td colspan="2">
<p>预设活动</p>
</td>
</tr>
<tr>
<td>体育锻炼</td>
<td colspan="4"></td>
</tr>
<tr>
<td>家园共育</td>
<td colspan="4"></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<!-- 右侧 -->
<div class="class-main-right">
<div v-if="!showDetail">
<div class="class-left-title">
<!-- <div class="pultitle" >宝宝课表第{{weekNum}}周（{{dateTime}}）</div> -->
<div class="pultitle" >宝宝课表第{{weekNum}}周</div>
</div>
<div class="baby-content-box">
<div class="time-title-box">
<div v-for="(item,index) in kebiaoArr" :key="index">{{item}}</div>
</div>
<template v-if="dataArr.length!=0">
<div class="tiam-data-box" v-for="(item,index) in dataArr" :key="index">
<div class="time-left" :style="{background:['#C3AEFF','#F1D470','#FF9393'][index]}">{{item.Ampm}}</div>
<div style="width: 100%;">
<div class="time-right-box" v-for="(itemt,indext) in item.Content" :key="indext">
<div class="time-item clips1" style="border-radius: 10px 0 0 10px;display: flex;">
<div></div>
<div>{{itemt.TimePart}}</div>
</div>
<div class="clips1 time-item">{{itemt.Week1Name}}</div>
<div class="clips1 time-item">{{itemt.Week2Name}}</div>
<div class="clips1 time-item">{{itemt.Week3Name}}</div>
<div class="clips1 time-item">{{itemt.Week4Name}}</div>
<div class="clips1 time-item">{{itemt.Week5Name}}</div>
</div>
</div>
</div>
</template>
<loading :isShow="showLoading_right"></loading>
</div>
</div>
<div v-if="showDetail" style="background-color: #FFFFFF;border: 3px solid #7240c5;width: 100%;height: 100%;border-radius: 20px;overflow: hidden;">
<teacherStyleDetail :teacherInfo="teacherInfo" @backstyle="backstyle"></teacherStyleDetail>
</div>
</div>
</div>
</div>
</template>
<script>
import teacherStyleDetail from '@/components/teacherStyleDetail.vue';
export default {
components:{
teacherStyleDetail
},
name: 'babyActivity',
data() {
return {
weekNum:0,
dateTime:0,
className:'',
teatherArr:[],
kebiaoArr:['时间','星期一','星期二','星期三','星期四','星期五'],
dataArr:[],
isNothing:false,
dangArr:[],
timer:null,
showLoading_right:true,
showError:false,
showDetail:false,
teacherInfo:{},
isDay:false,
isMonth:false
}
},
methods: {
// 手指滑动事件
touchDayEv(){
console.log(151);
this.isDay = true;
},
touchMonthEv(){
this.isMonth = true;
},
// 关闭通知公告弹框
closeNotice(){
this.isDay = false;
this.isMonth = false;
},
// 查看教师详情
goDetail(e){
if(this.$storage.get('network')){
this.teacherInfo = this.teatherArr[e];
console.log(this.teatherArr[e]);
// this.showLoading = true;
this.getteachers_demeanor_detailEv(this.teacherInfo.TeacherGuid);
} else {
this.showError = true;
}
},
// 关闭教师详情
backstyle(){
this.showDetail = false;
},
async getteachers_demeanor_detailEv(guid) {
console.log(guid,'guid');
if(this.$storage.get('network')){
let data = await this.$axios({
// 调用 serviceAPI
url: this.$https.getteachers_demeanor_detail,
methods: "get",
params: {
Guid:guid,
OrgGuid:this.$storage.get('orgGuid')
},
});
this.teacherInfo = data.data.data;
this.$storage.set('teacherInfo',this.teacherInfo);
} else {
this.teacherInfo = this.$storage.get('teacherInfo');
}
this.showDetail = true;
// this.showLoading = false;
},
closeError(){
this.showError = false;
},
// 查看一周的宝宝课表
async getbabycourseEv() {
if(this.$storage.get('network')){
this.showError = false;
let data = await this.$axios({
url: this.$https.getbabycourse,
methods: "get",
params: {
EquipmentID: this.$storage.get('EquipmentID'),
},
});
if(data.data.data!=undefined){
let newData = data.data.data;
// 第几周
this.weekNum = newData[0].NowWeekNo;
this.$storage.set('weekNum',this.weekNum);
// 时间
let newTime = newData[0].NowDate.slice(0,10).split('/');
this.dateTime = `${newTime[2]}年${newTime[1]}月${newTime[0]}日`;
this.$storage.set('dateTimeacti',this.dateTime);
// 一周安排
this.dataArr = newData[0].WeekData;
this.$storage.set('dataArracti',this.dataArr);
}
} else {
this.weekNum = this.$storage.get('weekNum');
this.dateTime = this.$storage.get('dateTimeacti');
this.dataArr = this.$storage.get('dataArracti');
if(this.weekNum==undefined){
this.showError = true;
}
}
this.showLoading_right = false;
},
// 当前活动
async schedulingWebEv() {
if(this.$storage.get('network')){
let data = await this.$axios({
url: this.$https.schedulingWeb_two,
methods: "get",
params: {
EquipmentID: this.$storage.get('EquipmentID'),
},
});
if(data.data.data!=undefined){
// let newDataa = data.data.data;
// let newDate = new Date();
// let timeDate = `${newDate.getHours()}.${newDate.getMinutes()}`;
// if('8.00'*100 <= timeDate*100 && timeDate*100 <= '11.55'*100) {
// this.dangArr = newDataa[0].WeekData[0];
// } else if('11.55'*100 <= timeDate*100 && timeDate*100 <= '15.00'*100) {
// this.dangArr = newDataa[0].WeekData[1];
// } else if('15.00'*100 <= timeDate*100 && timeDate*100 <= '17.00'*100) {
// this.dangArr = newDataa[0].WeekData[2];
// }
this.dangArr = data.data.data;
this.$storage.set('dangArracti',this.dangArr);
}
} else {
this.dangArr = this.$storage.get('dangArracti');
}
},
// 班级情况
async classStatusEv() {
if(this.$storage.get('network')){
let data = await this.$axios({
url: this.$https.classStatus,
methods: "get",
params: {
EquipmentID: this.$storage.get('EquipmentID'),
},
});
if(data.data.data!=undefined){
this.teatherArr = data.data.data.Teachers;
this.className = data.data.data.ClassName;
this.$storage.set('teatherArracti',this.teatherArr);
this.$storage.set('classNameactu',this.className);
}
} else {
this.teatherArr = this.$storage.get('teatherArracti');
this.className = this.$storage.get('classNameactu');
}
},
},
mounted() {
// 查看一周的宝宝课表
this.getbabycourseEv();
// 当前活动
this.schedulingWebEv();
// 班级情况
this.classStatusEv();
// 各一分钟调用一次当前活动
this.timer = setInterval(()=>{
this.schedulingWebEv();
},1000*60)
},
destroyed(){
clearInterval(this.timer);
}
}
</script>