Commit 16c8c268 authored by youjie's avatar youjie

试听课兼容手机

parent 4e423b93
......@@ -11,7 +11,8 @@
</q-card-section>
<q-card-section class="q-pt-none scroll" style="max-height: 70vh">
<div class="row wrap">
<q-input filled v-model="objOption.ClassDate" class="col-6 q-pr-lg q-pb-lg"
<q-input filled v-model="objOption.ClassDate" class=""
:class="[$q.platform.is.desktop?'col-6 q-pr-lg q-pb-lg':'col-12 q-pb-sm']"
:rules="[val => !!val || '请选择预约日期']" ref="ClassDate" mask="date" label="预约日期">
<template v-slot:append>
<q-icon name="event" class="cursor-pointer">
......@@ -21,8 +22,9 @@
</q-icon>
</template>
</q-input>
<div class="Sysuser_Date col-6 q-pb-lg">
<q-field>
<div class="Sysuser_Date"
:class="[$q.platform.is.desktop?'col-6 q-pb-lg':'col-12 q-pb-sm']">
<q-field filled dense>
<template v-slot:control>
<el-time-select v-model="objOption.ClassTime" ref="ClassTime" style="width:50%" :picker-options="{
start: '09:00',
......@@ -42,15 +44,18 @@
</q-field>
</div>
<q-select filled stack-label option-value="TId" option-label="TeacherName" v-model="objOption.TeacherId"
ref="TeacherId" :options="TeacherList" label="选择教师" :dense="false" class="col-6 q-pr-lg q-pb-lg" emit-value
ref="TeacherId" :options="TeacherList" label="选择教师" :dense="false" class="col-6 q-pr-lg"
:class="[$q.platform.is.desktop?'q-pb-lg':'q-pb-sm']" emit-value
map-options />
<q-select filled stack-label option-value="RoomId" option-label="RoomName" v-model="objOption.ClassRoomId"
ref="ClassRoomId" :options="ClassRoomList" label="关联教室" :dense="false" class="col-6 q-pb-lg" emit-value
ref="ClassRoomId" :options="ClassRoomList" label="关联教室" :dense="false" class="col-6"
:class="[$q.platform.is.desktop?'q-pb-lg':'q-pb-sm']" emit-value
map-options />
<q-select filled stack-label option-value="Id" option-label="LessonName" v-model="objOption.TrialLessonId"
:options="TrialList" label="试听课程" :dense="false" class="col-6 q-pb-lg q-pr-lg" emit-value map-options />
:options="TrialList" label="试听课程" :dense="false" class="col-6 q-pr-lg"
:class="[$q.platform.is.desktop?'q-pb-lg':'q-pb-sm']" emit-value map-options />
<q-select filled stack-label option-value="Name" option-label="Name" v-model="objOption.ClassContent"
ref="ClassContent" :options="ContentList" label="主讲内容" :dense="false" class="col-12 q-pb-lg" emit-value
......@@ -257,4 +262,4 @@
},
}
}
</script>
\ No newline at end of file
</script>
<template>
<div class="page-content">
<q-table :pagination="pageMsg" :loading="loading" no-data-label="暂无相关数据" flat
<div class="page-content"
:class="[$q.platform.is.desktop?'':'']">
<q-table v-if="$q.platform.is.desktop" :pagination="pageMsg" :loading="loading" no-data-label="暂无相关数据" flat
class="sticky-column-table sticky-right-column-table" separator="none" :data="data" :columns="columns"
:visible-columns="visibleColumns" row-key="name">
<template v-slot:top>
<div class="col-2 q-table__title">试听开课管理</div>
<div class="q-table__title"
:class="[$q.platform.is.desktop?'col-2':'col-12']">试听开课管理</div>
<q-space />
</template>
<template v-slot:body-cell-ReservationDate="props">
<q-td>
......@@ -20,7 +22,7 @@
<div style="min-width: 150px;word-break: break-word;white-space: normal;">
{{ props.row.ClassDateStr }} {{ props.row.ClassTime }}
<template v-if="props.row.ClassDateStr&&props.row.ClassDateStr.length>0">-</template>
{{ props.row.EndTime }}
{{ props.row.EndTime }}
</div>
</q-td>
</template>
......@@ -38,6 +40,39 @@
<template v-slot:bottom>
</template>
</q-table>
<template v-if="$q.platform.is.mobile">
<q-card
class="light-shadow q-pa-md bg-grey-1 rounded-borders q-mb-md"
flat
v-for="(x, index) in data"
:key="index"
>
<div class="row justify-between">
<div>学生:<span class="text-blue-5">{{x.StuName}}</span></div>
<div>试听日期:<span class="text-blue-5">{{timeFormatSeconds(x.ReservationDate)}}</span></div>
</div>
<div class="bg-white q-pa-sm q-mt-sm" style="border-radius: 8px;">
<div>
<span class="text-grey-6">试听需求:</span><span v-html="">{{x.Demand}}</span>
</div>
</div>
<div class=" q-pa-sm border-radius q-mt-sm" v-if="x.ClassDateStr||x.TeacherName||x.LessonName||x.RoomName">
<div class="row justify-between" v-if="x.ClassDateStr||x.TeacherName">
<span v-if="x.ClassDateStr">预约时间:<span class="text-blue-5">{{x.ClassDateStr}}</span></span>
<span v-if="x.TeacherName">主讲老师:<span class="text-blue-5">{{x.TeacherName}}</span></span>
</div>
<div class="row justify-between" v-if="x.LessonName||x.RoomName">
<span v-if="x.LessonName">课程名称:<span class="text-blue-5">{{x.LessonName}}</span></span>
<span v-if="x.RoomName">教室:<span class="text-blue-5">{{x.RoomName}}</span></span>
</div>
</div>
<div class="row justify-end">
<q-btn label="修改" color="primary" flat @click="editVisitor(x)"/>
<q-btn label="删除" color="teal-10" flat @click="DeleteVisitorReserve(x.Id)"/>
</div>
</q-card>
</template>
<reserveForm v-if="isShowReserve" :save-obj="reserveObj" @close="closeReserveForm" @success="refreshPage">
</reserveForm>
</div>
......@@ -166,7 +201,7 @@
if (seconds < 10) seconds = '0' + seconds;
timeStr+= ' ' + hours + ':' + min + ':' + seconds;
}
timeStr=year + '-' + month + '-' + day +timeStr;
return timeStr;
},
......@@ -186,8 +221,8 @@ return timeStr;
refreshPage() {
this.$emit('success');
},
//删除试听
DeleteVisitorReserve(Id) {
let that = this;
......@@ -221,4 +256,4 @@ return timeStr;
</script>
<style lang="sass">
@import url('~assets/css/table.sass')
</style>
\ No newline at end of file
</style>
......@@ -5,62 +5,65 @@
</style>
<template>
<div :class="[type?'q-pa-md':'']">
<p class="text-center small text-weight-bold" v-if="type==1">试听开课</p>
<div :class="[$q.platform.is.mobile?'q-pa-md bg-grey-1':'']">
<p class="text-center small text-weight-bold text-h6" v-if="type">试听开课</p>
<div class="row wrap">
<div style="width:100%;margin-bottom:15px;">试听时间:<span style="color:red;">{{timeFormatSeconds(setClassMsg.ReservationDate)}}</span></div>
<div style="width:100%;margin-bottom:15px;">试听需求:<span style="color:red;">{{setClassMsg.Demand}}</span></div>
</div>
<div class="row studentDate">
<q-field filled dense
:class="[type?'col-12 q-pb-sm':'col-6 q-pr-lg q-pb-lg']">
<template v-slot:control>
<el-date-picker v-model="setClassMsg.ClassDate" ref="ClassDate" :rules="[val => !!val || '请选择预约日期']"
style="width:100%" size="mini" type="date" placeholder="预约日期" value-format="yyyy-MM-dd">
</el-date-picker>
</template>
</q-field>
<div class="Student_Date "
:class="[type?'col-12 q-pb-sm':'col-6 q-pr-lg q-pb-lg']">
<q-field filled class="" dense>
<template v-slot:control>
<el-time-select v-model="setClassMsg.ClassTime" size="mini" ref="ClassTime" style="width:50%" :picker-options="{
start: '09:00',
step: '00:15',
end: '21:00',
maxTime: setClassMsg.EndTime
}" placeholder="预约开始时间">
</el-time-select>
<el-time-select v-model="setClassMsg.EndTime" size="mini" dense ref="EndTime" style="width:50%"
:picker-options="{
start: '09:00',
step: '00:15',
end: '21:00',
minTime: setClassMsg.ClassTime
}" placeholder="预约结束时间">
</el-time-select>
</template>
</q-field>
</div>
</div>
<div class="row wrap">
<q-select filled stack-label option-value="TId" option-label="TeacherName" v-model="setClassMsg.TeacherId"
ref="TeacherId" :options="TeacherList" label="选择教师" dense class="col-6"
:class="[type?'q-pr-sm q-pb-sm':'q-pr-lg q-pb-lg']"emit-value
map-options />
<q-select filled stack-label option-value="RoomId" dense option-label="RoomName" v-model="setClassMsg.ClassRoomId"
ref="ClassRoomId" :options="ClassRoomList" label="关联教室" class="col-6"
:class="[type?'q-pl-sm q-pb-sm':'q-pr-lg q-pb-lg']" emit-value
map-options />
<q-select filled stack-label option-value="Id" dense option-label="LessonName" v-model="setClassMsg.TrialLessonId"
:options="TrialList" label="试听课程" class="col-6"
:class="[type?'q-pr-sm':'q-pr-lg q-pb-lg']" emit-value map-options />
</div>
<q-card class="bg-white q-pa-md" flat>
<div class="row studentDate">
<q-field filled dense
:class="[$q.platform.is.mobile?'col-12 q-pb-sm':'col-6 q-pr-lg q-pb-lg']">
<template v-slot:control>
<el-date-picker v-model="setClassMsg.ClassDate" ref="ClassDate" :rules="[val => !!val || '请选择预约日期']"
style="width:100%" size="mini" type="date" placeholder="预约日期" value-format="yyyy-MM-dd">
</el-date-picker>
</template>
</q-field>
<div class="Student_Date "
:class="[$q.platform.is.mobile?'col-12 q-pb-sm':'col-6 q-pr-lg q-pb-lg']">
<q-field filled class="" dense>
<template v-slot:control>
<el-time-select v-model="setClassMsg.ClassTime" size="mini" ref="ClassTime" style="width:49%;margin-right: 1%;" :picker-options="{
start: '09:00',
step: '00:15',
end: '21:00',
maxTime: setClassMsg.EndTime
}" placeholder="预约开始时间">
</el-time-select>
<el-time-select v-model="setClassMsg.EndTime" size="mini" dense ref="EndTime" style="width:49%;margin-left: 1%;"
:picker-options="{
start: '09:00',
step: '00:15',
end: '21:00',
minTime: setClassMsg.ClassTime
}" placeholder="预约结束时间">
</el-time-select>
</template>
</q-field>
</div>
</div>
<div class="row wrap">
<q-select filled stack-label option-value="TId" option-label="TeacherName" v-model="setClassMsg.TeacherId"
ref="TeacherId" :options="TeacherList" label="选择教师" dense class="col-6"
:class="[$q.platform.is.mobile?'q-pr-sm q-pb-sm':'q-pr-lg q-pb-lg']"emit-value
map-options />
<q-select filled stack-label option-value="RoomId" dense option-label="RoomName" v-model="setClassMsg.ClassRoomId"
ref="ClassRoomId" :options="ClassRoomList" label="关联教室" class="col-6"
:class="[$q.platform.is.mobile?'q-pl-sm q-pb-sm':'q-pr-lg q-pb-lg']" emit-value
map-options />
<q-select filled stack-label option-value="Id" dense option-label="LessonName" v-model="setClassMsg.TrialLessonId"
:options="TrialList" label="试听课程" class="col-6"
:class="[$q.platform.is.mobile?'q-pr-sm':'q-pr-lg q-pb-lg']" emit-value map-options />
</div>
</q-card>
<div slot="footer" class="dialog-footer"
:class="[type?'text-center q-pt-lg row':'text-right q-pb-lg']">
<el-button v-if="!type" @click="closeShitingKaiKe()">取 消</el-button>
:class="[$q.platform.is.mobile?'text-center q-pt-lg row':'text-right q-pb-lg']">
<el-button v-if="!$q.platform.is.mobile" @click="closeShitingKaiKe()">取 消</el-button>
<el-button type="primary" @click="SetVisitorReserveClass()"
:class="[type?'col-12':'']">确 定</el-button>
:class="[$q.platform.is.mobile?'col-12':'']">确 定</el-button>
</div>
<statusPrompt v-if="isSuccess" :isSuccess="isSuccess" :isSuccessTitle="isSuccessTitle"></statusPrompt>
</div>
......@@ -214,16 +217,17 @@
}
SetVisitorReserveClass(this.setClassMsg).then(res => {
if (res.Code == 1) {
this.$q.notify({
if(this.type){
this.isSuccess = true
this.isSuccessTitle = '试听课开课成功!'
}else{
this.$q.notify({
icon: "iconfont icon-chenggong",
color: "accent",
timeout: 2000,
message: res.Message,
position: "top"
});
if(this.type){
this.isSuccess = true
this.isSuccessTitle = '试听课开课成功!'
}
this.$emit("success");
} else {
......
......@@ -6,10 +6,13 @@
</style>
<template>
<div class="page-body">
<div class="page-search row items-center">
<div class="col row wrap q-mr-lg q-col-gutter-md">
<div class="col-3">
<div class="col-4 Sysuser_Date">
<div class="page-search"
:class="[$q.platform.is.desktop?'row items-center':'']">
<div class="col row wrap q-col-gutter-md"
:class="[$q.platform.is.desktop?'q-mr-lg':'']">
<div
:class="[$q.platform.is.desktop?'col-3':'col-12']">
<div class="Sysuser_Date">
<q-field filled>
<template v-slot:control>
<el-date-picker v-model="msg.StartClassDate" value-format="yyyy-MM-dd" type="date" placeholder="开始时间"
......@@ -38,6 +41,21 @@
</div>
</div>
<reservelist :data="dataList" :authObj="authObj" :loading="loading" @success="refreshPage"></reservelist>
<q-card
class="light-shadow q-pa-md bg-white rounded-borders q-mb-md"
v-if="msg.pageCount > 0"
flat
>
<q-pagination v-if="$q.platform.is.mobile"
class="full-width justify-end"
v-model="msg.pageIndex"
color="primary"
:max="msg.pageCount"
:input="true"
@update:model-value="changePageHandler"
/>
</q-card>
<q-pagination class="full-width justify-end" v-model="msg.pageIndex" color="primary" :max="PageCount" :input="true"
@input="changePage" />
</div>
......@@ -89,7 +107,7 @@
var month = nowDay.getMonth() + 1; //月
var day = nowDay.getDate(); //日
this.msg.StartClassDate = year + '-' + month + '-' + day
if (this.$route.query) {
if (this.$route.query.StartClassDate) {
this.msg.StartClassDate = this.$route.query.StartClassDate;
......@@ -100,12 +118,16 @@
if (this.$route.query.TeacherId) {
this.msg.TeacherId = Number(this.$route.query.TeacherId);
}
}
}
// this.GetTeacherList();
// this.getClassRoomList();
this.getList()
},
methods: {
changePageHandler(n) {
this.msg.pageIndex = n;
this.getList();
},
//重新查询
resetSearch() {
this.msg.pageIndex = 1;
......@@ -153,4 +175,4 @@
</script>
<style lang="sass">
@import url('~assets/css/table.sass')
</style>
\ No newline at end of file
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment