|
|
@@ -13,10 +13,42 @@
|
|
|
</ul>
|
|
|
</div>
|
|
|
<el-tabs v-model="activeName" type="card">
|
|
|
- <el-tab-pane label="课程预览总览" name="first">
|
|
|
+ <el-tab-pane label="会员预约列表" name="second">
|
|
|
+ <div class="panel-body">
|
|
|
+ <div class="panel_control">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="5">
|
|
|
+ <em>会员名:</em>
|
|
|
+ <el-input v-model="panel.name" placeholder="请输入会员名"></el-input>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5">
|
|
|
+ <em>手机号:</em>
|
|
|
+ <el-input v-model="panel.phone" placeholder="请输入手机号"></el-input>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5">
|
|
|
+ <em>预约课程:</em>
|
|
|
+ <el-select v-model="panel.classId">
|
|
|
+ <el-option
|
|
|
+ v-for="item in panel.classOptions"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4">
|
|
|
+ <el-button size="" type="primary" @click="query" plain>查询</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4">
|
|
|
+ <el-button class="pull-right" type="warning" @click="addMember">增加预约</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <br>
|
|
|
<div class="table">
|
|
|
<el-table
|
|
|
- :data="tableData"
|
|
|
+ :data="tableData2"
|
|
|
border
|
|
|
is-horizontal-resize
|
|
|
:default-sort="{prop: 'date', order: 'descending'}"
|
|
|
@@ -31,17 +63,23 @@
|
|
|
<el-table-column
|
|
|
type="index"
|
|
|
label="序号"
|
|
|
+ align="center"
|
|
|
width="50">
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- prop="BeginTime"
|
|
|
- label="上课时间"
|
|
|
- :formatter="filterFmtDate"
|
|
|
+ prop="UserName"
|
|
|
+ label="会员名"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="Phone"
|
|
|
+ label="手机号"
|
|
|
+ sortable
|
|
|
>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
prop="ClassName"
|
|
|
- label="课程"
|
|
|
+ label="预约课程"
|
|
|
sortable
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
@@ -49,24 +87,17 @@
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- prop="Recovered"
|
|
|
- label="预约进度"
|
|
|
- width="220px"
|
|
|
- sortable
|
|
|
+ prop="BeginTime"
|
|
|
+ label="上课时间"
|
|
|
+ :formatter="filterFmtDate"
|
|
|
>
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-progress
|
|
|
- :percentage="parseFloat((scope.row.OrderCount/scope.row.OrderToplimit * 100).toFixed(2))"
|
|
|
- :format="format"
|
|
|
- ></el-progress>
|
|
|
- </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- prop="OrderToplimit"
|
|
|
- label="预约名额"
|
|
|
- width="240px"
|
|
|
+ prop="OrderCreateTime"
|
|
|
+ label="会员预约时间"
|
|
|
+ :formatter="filterFmtDate"
|
|
|
+ sortable
|
|
|
>
|
|
|
-
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
prop="ConsumeHour"
|
|
|
@@ -75,28 +106,31 @@
|
|
|
>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- prop="WxOrder"
|
|
|
- label="微信可预约"
|
|
|
+ prop="RemainHour"
|
|
|
+ label="剩余课时"
|
|
|
+ sortable
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="Status"
|
|
|
+ label="预约状态"
|
|
|
+ sortable
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
- <!-- 0:不可预约 1:可预约-->
|
|
|
- <el-switch
|
|
|
- v-model="scope.row.WxOrder"
|
|
|
- :active-value="1"
|
|
|
- :inactive-value="0"
|
|
|
- active-color="#409EFF"
|
|
|
- inactive-color="#D9D9D9"
|
|
|
- @change=changeWechat($event,scope.row)
|
|
|
- >
|
|
|
- </el-switch>
|
|
|
+ <span v-if="scope.row.Status == 1" style="color: chartreuse">已预约</span>
|
|
|
+ <span v-if="scope.row.Status == 2" style="color: #ccc">已取消</span>
|
|
|
+ <span v-if="scope.row.Status == 3" style="color: red">预约未到</span>
|
|
|
+ <span v-if="scope.row.Status == 4" style="color: #015B9E">已完成</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- prop="StdId"
|
|
|
+ prop="Status"
|
|
|
label="操作"
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
- <el-button type="text" @click="seeDetail(scope.row)">详情</el-button>
|
|
|
+ <el-button type="danger" size="mini" round
|
|
|
+ @click="BtnOrderCancelByManager(scope.row)">取消预约
|
|
|
+ </el-button>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
@@ -109,42 +143,10 @@
|
|
|
></el-pagination>
|
|
|
</div>
|
|
|
</el-tab-pane>
|
|
|
- <el-tab-pane label="会员预约列表" name="second">
|
|
|
- <div class="panel-body">
|
|
|
- <div class="panel_control">
|
|
|
- <el-row :gutter="20">
|
|
|
- <el-col :span="5">
|
|
|
- <em>会员名:</em>
|
|
|
- <el-input v-model="panel.name" placeholder="请输入会员名"></el-input>
|
|
|
- </el-col>
|
|
|
- <el-col :span="5">
|
|
|
- <em>手机号:</em>
|
|
|
- <el-input v-model="panel.phone" placeholder="请输入手机号"></el-input>
|
|
|
- </el-col>
|
|
|
- <el-col :span="5">
|
|
|
- <em>预约课程:</em>
|
|
|
- <el-select v-model="panel.classId">
|
|
|
- <el-option
|
|
|
- v-for="item in panel.classOptions"
|
|
|
- :key="item.value"
|
|
|
- :label="item.label"
|
|
|
- :value="item.value">
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- </el-col>
|
|
|
- <el-col :span="4">
|
|
|
- <el-button size="" type="primary" @click="query" plain>查询</el-button>
|
|
|
- </el-col>
|
|
|
- <el-col :span="4">
|
|
|
- <el-button class="pull-right" type="warning" @click="addMember">增加预约</el-button>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <br>
|
|
|
+ <el-tab-pane label="课程预览总览" name="first">
|
|
|
<div class="table">
|
|
|
<el-table
|
|
|
- :data="tableData2"
|
|
|
+ :data="tableData"
|
|
|
border
|
|
|
is-horizontal-resize
|
|
|
:default-sort="{prop: 'date', order: 'descending'}"
|
|
|
@@ -159,39 +161,46 @@
|
|
|
<el-table-column
|
|
|
type="index"
|
|
|
label="序号"
|
|
|
+ align="center"
|
|
|
+
|
|
|
width="50">
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- prop="UserName"
|
|
|
- label="会员名"
|
|
|
+ prop="BeginTime"
|
|
|
+ label="上课时间"
|
|
|
+ :formatter="filterFmtDate"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- prop="Phone"
|
|
|
- label="手机号"
|
|
|
+ prop="ClassName"
|
|
|
+ label="课程"
|
|
|
sortable
|
|
|
>
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span class="lessons" :style="{ background:scope.row.ClassColor }">{{scope.row.ClassName}}</span>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- prop="ClassName"
|
|
|
- label="预约课程"
|
|
|
+ prop="Recovered"
|
|
|
+ label="预约进度"
|
|
|
+ width="220px"
|
|
|
sortable
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
- <span class="lessons" :style="{ background:scope.row.ClassColor }">{{scope.row.ClassName}}</span>
|
|
|
+ <el-progress
|
|
|
+ :percentage="parseInt((scope.row.OrderCount/scope.row.OrderToplimit * 100))"
|
|
|
+ :format="format"
|
|
|
+ ></el-progress>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- prop="BeginTime"
|
|
|
- label="上课时间"
|
|
|
- :formatter="filterFmtDate"
|
|
|
+ prop="OrderToplimit"
|
|
|
+ label="预约名额"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- prop="OrderCreateTime"
|
|
|
- label="会员预约时间"
|
|
|
- :formatter="filterFmtDate"
|
|
|
- sortable
|
|
|
+ prop="OrderCount"
|
|
|
+ label="预约人数"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
@@ -201,31 +210,28 @@
|
|
|
>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- prop="RemainHour"
|
|
|
- label="剩余课时"
|
|
|
- sortable
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="Status"
|
|
|
- label="预约状态"
|
|
|
- sortable
|
|
|
+ prop="WxOrder"
|
|
|
+ label="微信可预约"
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
- <span v-if="scope.row.Status == 1">已预约</span>
|
|
|
- <span v-if="scope.row.Status == 2">已取消</span>
|
|
|
- <span v-if="scope.row.Status == 3">预约未到</span>
|
|
|
- <span v-if="scope.row.Status == 4">已完成</span>
|
|
|
+ <!-- 0:不可预约 1:可预约-->
|
|
|
+ <el-switch
|
|
|
+ v-model="scope.row.WxOrder"
|
|
|
+ :active-value="1"
|
|
|
+ :inactive-value="0"
|
|
|
+ active-color="#409EFF"
|
|
|
+ inactive-color="#D9D9D9"
|
|
|
+ @change=changeWechat($event,scope.row)
|
|
|
+ >
|
|
|
+ </el-switch>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- prop="Status"
|
|
|
+ prop="StdId"
|
|
|
label="操作"
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
- <el-button type="danger" size="mini" round
|
|
|
- @click="BtnOrderCancelByManager(scope.row)">取消预约
|
|
|
- </el-button>
|
|
|
+ <el-button type="text" @click="seeDetail(scope.row)">详情</el-button>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
@@ -240,14 +246,16 @@
|
|
|
</el-tab-pane>
|
|
|
</el-tabs>
|
|
|
</div>
|
|
|
-
|
|
|
-
|
|
|
<el-dialog :title="dialogTitle" :visible.sync="dialogMemberVisible" width="650px">
|
|
|
<div class="dialogContent">
|
|
|
<div class="">
|
|
|
<el-form ref="form" :model="form" label-width="160px">
|
|
|
- <el-form-item label="课程">
|
|
|
- <el-select v-model="form.stdId" filterable placeholder="请选择" @change="vipSelect(form.stdId)">
|
|
|
+ <el-form-item label="当前日期" :required="true">
|
|
|
+ <el-input v-model="form.displayDay" placeholder="placeholder" :disabled="true" style="width: 220px"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="课程" :required="true">
|
|
|
+ <el-select v-model="form.stdId" filterable placeholder="请选择"
|
|
|
+ @change="vipSelect(form.stdId)">
|
|
|
<el-option
|
|
|
v-for="item in form.stdList"
|
|
|
:key="item.value"
|
|
|
@@ -256,9 +264,9 @@
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
-<!-- todo 课程联动查询userlist by classid-->
|
|
|
- <el-form-item label="会员">
|
|
|
- <el-select v-model="form.userId" filterable placeholder="请选择" >
|
|
|
+ <!-- 课程联动查询userlist by classid-->
|
|
|
+ <el-form-item label="会员" :required="true">
|
|
|
+ <el-select v-model="form.userId" filterable placeholder="请选择">
|
|
|
<el-option
|
|
|
v-for="item in form.userList"
|
|
|
:key="item.value"
|
|
|
@@ -308,10 +316,8 @@
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
- // activeName: 'first',
|
|
|
- activeName: 'first',
|
|
|
+ activeName: 'second',
|
|
|
choiceDate: 0,//默认为今天
|
|
|
- // activeName: 'second',
|
|
|
tableView: true,//其他dialog
|
|
|
dialogVisible: false,//其他dialog
|
|
|
dialogTableVisible: false,//其他dialog
|
|
|
@@ -361,7 +367,7 @@
|
|
|
{value: 7, label: '近一周'},
|
|
|
{value: 1, label: '当日'},
|
|
|
],
|
|
|
- time1: globalBt(),
|
|
|
+ // time1: globalBt(),
|
|
|
},
|
|
|
multipleSelection: [],
|
|
|
pageination: {
|
|
|
@@ -372,6 +378,7 @@
|
|
|
},
|
|
|
form: {
|
|
|
name: '',
|
|
|
+ displayDay: '',
|
|
|
userCode: '',
|
|
|
shopId: '',
|
|
|
stdId: 0,
|
|
|
@@ -396,10 +403,17 @@
|
|
|
}
|
|
|
},
|
|
|
mounted() {
|
|
|
+ if (this.$route.query.page == 'second') {
|
|
|
+ this.panel.name = this.$route.query.name;
|
|
|
+ this.activeName = 'second'
|
|
|
+ } else {
|
|
|
+ this.activeName = 'second'
|
|
|
+ }
|
|
|
this.ClassSelect();
|
|
|
this.panelSelect();
|
|
|
// this.getCurrWeekDays();
|
|
|
this.getFurtherDays();
|
|
|
+
|
|
|
},
|
|
|
methods: {
|
|
|
// .课程表详情微信可预约状态修改
|
|
|
@@ -461,24 +475,23 @@
|
|
|
let that = this;
|
|
|
// 筛选相同的stdid的classId
|
|
|
that.form.stdList.map(function (item) {
|
|
|
- console.log(item);
|
|
|
- if(item.value == stdId){
|
|
|
- let param = {
|
|
|
- token: localStorage.token,
|
|
|
- classId:item.classId
|
|
|
- };
|
|
|
- let postdata = qs.stringify(param);
|
|
|
- // VipUserListQuery
|
|
|
- VipUserSimpleQuery(postdata).then(res => {
|
|
|
- let json = res;
|
|
|
- if (json.Code == 0) {
|
|
|
- that.form.userId = '';
|
|
|
- that.form.userList = turnResToOptionBySimViper(json.Rs);
|
|
|
- } else {
|
|
|
- that.$message.error(json.Memo);
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
+ if (item.value == stdId) {
|
|
|
+ let param = {
|
|
|
+ token: localStorage.token,
|
|
|
+ // classId: item.classId
|
|
|
+ };
|
|
|
+ let postdata = qs.stringify(param);
|
|
|
+ // VipUserListQuery
|
|
|
+ VipUserSimpleQuery(postdata).then(res => {
|
|
|
+ let json = res;
|
|
|
+ if (json.Code == 0) {
|
|
|
+ that.form.userId = '';
|
|
|
+ that.form.userList = turnResToOptionBySimViper(json.Rs);
|
|
|
+ } else {
|
|
|
+ that.$message.error(json.Memo);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
})
|
|
|
},
|
|
|
ClassSelect() {
|
|
|
@@ -560,7 +573,7 @@
|
|
|
// 编辑
|
|
|
BtnOrderCancelByManager(row) {
|
|
|
let that = this;
|
|
|
- this.$confirm('是否取消用户' + row.UserName + '的预约?', '取消预约', {
|
|
|
+ this.$confirm('是否取消用户 ' + row.UserName + ' 的预约?', '取消预约', {
|
|
|
confirmButtonText: '确定',
|
|
|
cancelButtonText: '取消',
|
|
|
type: 'warning'
|
|
|
@@ -1009,7 +1022,8 @@
|
|
|
this.clearForm();
|
|
|
// 加载当前可选课程
|
|
|
this.getClassListByOrderDate();
|
|
|
- this.dialogMemberVisible = true
|
|
|
+ this.dialogMemberVisible = true;
|
|
|
+ this.form.displayDay = this.weeks[this.choiceDate].data +' '+ this.weeks[this.choiceDate].name;
|
|
|
this.btnType = 0;
|
|
|
this.dialogTitle = '新增预约';
|
|
|
},
|
|
|
@@ -1304,8 +1318,12 @@
|
|
|
watch: {
|
|
|
$route(to) {
|
|
|
if (to.name == 'appoint') {
|
|
|
- this.getTableQuery();
|
|
|
+ if (this.$route.query.page == 'second') {
|
|
|
+ this.activeName = 'second'
|
|
|
+ this.panel.name = this.$route.query.name;
|
|
|
+ }
|
|
|
}
|
|
|
+
|
|
|
},
|
|
|
activeName(val) {
|
|
|
if (val == 'first') {
|
|
|
@@ -1510,17 +1528,26 @@
|
|
|
border-radius: 250px;
|
|
|
float: left;
|
|
|
}
|
|
|
+
|
|
|
/deep/ .el-progress__text {
|
|
|
position: relative;
|
|
|
- top:1px;
|
|
|
+ top: 1px;
|
|
|
float: right;
|
|
|
line-height: 14px;
|
|
|
height: 16px;
|
|
|
}
|
|
|
+
|
|
|
/deep/ .el-progress-bar {
|
|
|
width: 190px;
|
|
|
float: left;
|
|
|
overflow: hidden;
|
|
|
margin-top: 5px;
|
|
|
}
|
|
|
+ .timeList li.active {
|
|
|
+ color: #fff;
|
|
|
+ background: #409EFF;
|
|
|
+ }
|
|
|
+ .timeList li.active span, .timeList li.active em {
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
</style>
|