Skip to content

C
confucius
Commit dbf3aa77 authored by 罗超's avatar 罗超
Browse files
Options

修改

parent fc15b75f
Hide whitespace changes
Inline Side-by-side
Showing with 315 additions and 120 deletions
src/components/sale/continueclass-form.vue
View file @ dbf3aa77
<style>
.Title_remark {
font-size: 12px;
color: #999999;
margin-left: 20px;
}
.conTinuCheckdTable {
width: 100%;
height: auto;
text-align: left;
margin-top: 20px;
font-size: 12px;
}
.conTinuCheckdTable th {
color: #888888;
}
.enrollTotalSearchTable {
width: 100%;
}
.backContius {
color: #2961FE;
cursor: pointer;
}
.contiue_Top {
width: 100%;
padding: 10px;
border-bottom: 1px solid #d1d1d1;
}
.continus_ClassChoice{
padding:20px;
max-height: 460px;
overflow: auto;
}
.el-picker-panel{
z-index:9999!important;
}
.Sysuser_Date .el-range-editor .el-range-input {
background-color: transparent;
}
.Sysuser_Date .el-range-editor.el-input__inner {
background-color: transparent;
}
.conChoiceTeacherTable{
width:100%;
border:1px solid #d1d1d1;
}
.continus_ClassChoice::-webkit-scrollbar {
width: 4px;
height: 8px;
}
.continus_ClassChoice::-webkit-scrollbar-thumb {
border-radius: 4px;
box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
background: #c9c9c9;
}
.continus_ClassChoice::-webkit-scrollbar-track {
box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
border-radius: 4px;
background: #EDEDED;
}
.contius_List{
width:100%;
height:130px;
border:1px solid #d1d1d1;
border-radius: 5px;
margin-bottom:15px;
font-size:12px;
box-shadow: 5px 5px 5px #d4d0d0;
}
.continu_Div{
display: inline-block;
min-height: 90px;
border-right:1px dashed #d1d1d1;
padding:10px;
}
.continu_Div:last-child{
border-right:0;
}
.continu_Btm{
width:100%;
height:30px;
padding:10px;
border-top:1px solid #d1d1d1;
}
</style>
<!--续课-->
<template>
<q-dialog v-model="IsShowContinueClassDialog" content-class="bg-grey-1" persistent transition-show="scale"
transition-hide="scale">
<q-card style="width: 800px;max-width:900px;">
<q-card-section>
<div class="text-h6">续课申请</div>
</q-card-section>
<div style="margin:20px;">
<table>
<thead>
<q-card style="width: 850px;max-width:900px;">
<template v-if="isShowTuike">
<q-card-section>
<div class="text-h6">
续课申请<span class="Title_remark">注：找不到学员？请确认学员是否已退课或已续班</span>
</div>
</q-card-section>
<div style="margin:20px;border-bottom:1px solid #E2E2E2">
<div class="apply_List" v-for="(item,index) in studentList" v-if="item.IsShow">
<span style="width:10%">{{item.GuestName}}</span>
<span style="width:10%">{{item.SexStr}}</span>
<span style="width:10%">{{item.Age}}</span>
<span style="width:20%">{{item.Mobile}}</span>
<span style="width:20%">
<template v-if="item.ClassHours">已学：{{item.ClassHours}}课时</template>
</span>
<span style="width:10%">{{item.GuestStateStr}}</span>
<span style="width:20%;" class="guest_Status">
<span v-if="item.GuestState==1" @click="clickItem(item)">续费</span>
<template v-if="chooseItem&&chooseItem.Id==item.Id">
<span style="margin-left:10px;" @click="cancelApply">取消续费</span>
</template>
</span>
</div>
<table class="conTinuCheckdTable" v-if="classItem.ClassId>0&&studentList.length>0&&isShowAdd">
<tr>
<th width="10%">
姓名
</th>
<th width="10%">
性别
</th>
<th width="10%">
年龄
</th>
<th width="10%">
联系电话
</th>
<th width="10%">
已上课时
</th>
<th width="10%">
状态
</th>
<th width="20%">
操作
</th>
<th>续费班级</th>
<th>续费班级</th>
<th>2人续班单价</th>
<th>应收合计</th>
<th>带班老师</th>
<th>开班日期</th>
</tr>
</thead>
<tbody>
<tr v-for="(item,index) in studentList" v-if="item.IsShow">
<td>
{{item.GuestName}}
</td>
<td>
{{item.SexStr}}
</td>
<td>
{{item.Age}}
</td>
<td>
{{item.Mobile}}
</td>
<td>
{{item.ClassHours}}
</td>
<td>
{{item.GuestStateStr}}
</td>
<tr>
<td>
<q-btn v-if="item.GuestState==1" flat size="xs" icon="iconfont icon-shenhe" color="info" class="q-mr-xs"
label="续费" @click="clickItem(item)" />
<template v-if="chooseItem&&chooseItem.Id==item.Id">
<q-btn flat size="xs" icon="iconfont icon-shenhe" color="info" class="q-mr-xs" label="取消续费"
@click="cancelApply" />
</template>
<span style="color:#2961FE;cursor:pointer;" @click="getRenewClassList()">+点击选择班级</span>
</td>
<td>{{classItem.ClassName}}</td>
<td>¥{{classItem.SellPrice}}</td>
<td>¥{{classItem.OriginalPrice}}</td>
<td>{{classItem.TeacherName}}</td>
<td>{{classItem.OpenTime}}</td>
</tr>
</tbody>
</table>
<q-card-section>
<div class="text-h6">课程列表</div>
</q-card-section>
<table class="enrollTotalSearchTable">
<tbody v-for="(cItem,cIndex) in calssData">
</table>
<table class="conTinuCheckdTable" v-else-if="studentList.length>0&&isShowAdd">
<tr>
<td width="20%">
{{cItem.ClassName}}
<br>
{{cItem.CourseName}}
<br>
{{cItem.ClassHours}} 课时
</td>
<td width="20%">
代课老师 {{cItem.TeacherName}}
<br>
上课教师 {{cItem.RoomName}}
<br>
开班时间 {{cItem.OpenTime}}
<td>
<span class="backContius" @click="getRenewClassList()">+点击选择班级</span>
</td>
<td width="20%">
价格
<br>
续费价格 {{cItem.SellPrice}}
<br>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
<q-input filled stack-label :dense="false" v-model="SaleRemark" style="margin-top: 20px" type="textarea"
class="col-12" label="销售备注" />
<q-separator />
</div>
<q-card-actions align="right" class="bg-white">
<q-btn label="取消" flat color="grey-10" style="font-weight:400 !important" @click="closeContinueClassForm" />
<q-btn label="确认续费" color="accent" class="q-px-md" style="font-weight:400 !important"
@click="setRenewOrder" />
</q-card-actions>
</template>
<template v-else>
<div class="contiue_Top">
<span class="backContius" @click="isShowTuike=true">
<返回</span> <span style="margin-left:20px;">班级选择
</span>
</div>
<div class="col row wrap q-mr-lg q-col-gutter-md" style="margin:10px;">
<div class="col-3">
<q-select @input="getRenewClassList" standout="bg-primary text-white" option-value="SId" option-label="SName"
v-model="classMsg.School_Id" :options="schoolList" emit-value map-options label="关联校区" />
</div>
<div class="col-3">
<q-select filled stack-label option-value="CTypeId" option-label="CTypeName" v-model="classMsg.ClassType"
ref="CouseId" :options="classTypeList" label="班级类型" :dense="false"
emit-value map-options />
</div>
<div class="col-5 Sysuser_Date">
<q-field filled>
 <template v-slot:control>
<el-date-picker v-model="dateList" @change="getRenewClassList()" value-format="yyyy-MM-dd" type="daterange" style="border:none;"
 range-separator="至"  start-placeholder="开始时间"  end-placeholder="结束时间">
  </el-date-picker>       
</template>
</q-field>
</div>
<div class="col-3">
<q-input @change="getRenewClassList" clearable standout="bg-primary text-white" v-model="classMsg.TeacherName"
label="带班老师" @clear="getRenewClassList" maxlength="20" />
</div>
<div class="col-3">
<q-select @input="getRenewClassList" standout="bg-primary text-white" option-value="CourseId"
option-label="CourseName" v-model="classMsg.CouseId" :options="ClassList" emit-value map-options label="学习课程" />
</div>
</div>
<div class="continus_ClassChoice">
<div class="contius_List" v-for="(cItem,cIndex) in calssData">
<div style="display:flex;">
<div class="continu_Div" style="width:30%">
<div>{{cItem.ClassName}}</div>
<div style="margin-top:5px;">{{cItem.CourseName}}</div>
<div style="margin-top:5px;">{{cItem.ClassHours}}课时</div>
</div>
<div class="continu_Div" style="width:20%">
<div>代课老师：{{cItem.TeacherName}}</div>
<div style="margin-top:5px;">上课教师：{{cItem.RoomName}}</div>
<div style="margin-top:5px;">开班时间：<span style="color:red;">{{cItem.OpenTime}}</span></div>
</div>
<div class="continu_Div" style="width:20%">
<div>价格</div>
<div style="margin:5px 0;">续费价格：{{cItem.SellPrice}}</div>
<template v-if="cItem.ClassStepPriceList&&cItem.ClassStepPriceList.length>0">
更多优惠价格
<span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px"></span>
<q-popup-proxy>
<q-banner>
<div class="price-popup">
<div class="price-popup-item" v-for="(x,index2) in cItem.ClassStepPriceList" :key="index2"
style="margin: 5px 0">
<span style="color: #2D2D2D;font-weight: bold">{{x.PersionNum}}人报名<span
style="color:#2860FB;margin-left: 15px">{{x.PersionPrice.toFixed(2)}}</span></span>
更多优惠价格
<span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px"></span>
<q-popup-proxy>
<q-banner>
<div class="price-popup">
<div class="price-popup-item" v-for="(x,index2) in cItem.ClassStepPriceList" :key="index2"
style="margin: 5px 0">
<span style="color: #2D2D2D;font-weight: bold">{{x.PersionNum}}人报名<span
style="color:#2860FB;margin-left: 15px">{{x.PersionPrice.toFixed(2)}}</span></span>
</div>
</div>
</div>
</q-banner>
</q-popup-proxy>
</q-banner>
</q-popup-proxy>
</template>
</td>
<td width="20%">
</div>
<div class="continu_Div" style="width:15%">
招生信息
<br>
计划招收 {{cItem.ClassPersion}}
<br>
已招收 {{cItem.OrderStudentCount}}
</td>
<td rowspan="2" width="20%">
<a style="cursor:pointer" @click="clickClassItem(cItem)">选择此班</a>
</td>
</tr>
<tr>
<td colspan="4">
OP备注 {{cItem.InnerRemark}}
</td>
</tr>
</tbody>
</table>
<q-input filled stack-label :dense="false" v-model="SaleRemark" style="margin-top: 20px" type="textarea"
class="col-12" label="销售备注" />
<q-separator />
</div>
<q-card-actions align="right" class="bg-white">
<q-btn label="取消" flat color="grey-10" style="font-weight:400 !important" @click="closeContinueClassForm" />
<q-btn label="确认续费" color="accent" class="q-px-md" style="font-weight:400 !important" @click="setRenewOrder" />
</q-card-actions>
<div style="margin:5px 0;">计划招收 {{cItem.ClassPersion}}人</div>
<div>已招收 <span style="color:blue;">{{cItem.OrderStudentCount}}</span>人</div>
</div>
<div class="continu_Div" style="width:15%">
<q-btn label="选择此班" size="sm" @click="clickClassItem(cItem)" color="accent q-px-md" style="font-weight:400 !important;display:block;margin:25px 0 0 10px;padding:0;" />
</div>
</div>
<div class="continu_Btm">
OP备注 {{cItem.InnerRemark}}
</div>
</div>
<q-pagination class="full-width justify-end" v-model="classMsg.pageIndex" color="primary" :max="classPageCount"
:input="true" @input="changePage" />
</div>
</template>
</q-card>
</q-dialog>
</template>
<script>
import {
getSchoolDropdown,
} from '../../api/school/index'
import {
GetClassTypeList
} from '../../api/system/index'
import {
queryCourseDropdownList,
} from '../../api/course/index'
import {
getOrderGuestPageList,
saveRenewOrder,
......@@ -177,12 +300,23 @@
classPageCount: 0,
calssData: [],
classItem: {}, //当前点击的班级
isShowTuike: true, //显示退课信息
schoolList: [], //校区列表
classTypeList:[], //班级类型
dateList:[], //日期
ClassList:[], //学习课程
isShowAdd:false,
}
},
created() {
this.continueClassMsg.OrderId = this.saveObj.OrderId;
this.continueClassMsg.ClassId = this.saveObj.ClassId;
this.classMsg.ClassId = this.saveObj.ClassId;
this.getSchool();
this.GetClassTypeList();
this.CourseList();
this.getStudentList();
},
methods: {
......@@ -194,6 +328,7 @@
item.IsShow = true;
})
}
this.isShowAdd=false;
},
//当前点击项
clickItem(item) {
......@@ -202,9 +337,10 @@
item.IsShow = false;
})
}
this.isShowAdd=true;
item.IsShow = true;
this.chooseItem = item;
this.getRenewClassList();
// this.getRenewClassList();
},
//关闭弹窗
closeContinueClassForm() {
......@@ -226,6 +362,14 @@
},
//获取续课列表
getRenewClassList() {
this.isShowTuike = false;
if (this.dateList && this.dateList.length > 0) {
this.classMsg.StartTime = this.dateList[0];
this.classMsg.EndTime = this.dateList[1];
} else {
this.classMsg.StartTime = '';
this.classMsg.EndTime = '';
}
queryRenewClass(this.classMsg).then(res => {
if (res.Code == 1) {
this.classPageCount = res.Data.PageCount;
......@@ -234,7 +378,9 @@
})
},
clickClassItem(cItem) {
console.log(cItem,'cItem');
this.classItem = cItem;
this.isShowTuike=true;
},
//确认续费
setRenewOrder() {
......@@ -286,7 +432,56 @@
this.IsShowContinueClassDialog = false
}
})
}
},
//获取校区列表
getSchool() {
getSchoolDropdown({}).then(res => {
if (res.Code == 1) {
var tempArray = res.Data;
if (!tempArray) {
tempArray = [];
}
tempArray.unshift({
SId: 0,
SName: "不限"
})
this.schoolList = tempArray;
}
})
},
//获取班级类型下拉
GetClassTypeList() {
GetClassTypeList({}).then(res => {
if (res.Code == 1) {
var tempArray = res.Data;
if (!tempArray) {
tempArray = [];
}
tempArray.unshift({
CTypeId: 0,
CTypeName: "不限"
})
this.classTypeList = tempArray;
}
})
},
//获取课程
CourseList() {
queryCourseDropdownList({}).then(res => {
if (res.Code == 1) {
this.ClassList = res.Data;
this.ClassList.unshift({
CourseId: 0,
CourseName: "不限"
})
}
})
},
//翻页
changePage(val) {
this.classMsg.pageIndex = val;
this.getRenewClassList()
},
}
}
......
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