Signed-off-by: Changpeng Duan <838560574@qq.com>

app/src/App.vue

@@ -28,4 +28,8 @@
         font-style: normal;
     }
 
+    /*叹号问题*/
+    .mu-warning-text-color {
+      float: left;
+    }
 </style>

app/src/api/getApiRes.js

@@ -146,4 +146,9 @@ export function SchoolTimetablePreview(postdata) {
     let url = headapi + 'v1/SchoolTimeTable/SchoolTimetablePreview';
     return getApiBasic(url, postdata);
 }
+// CleCk查询
+export function VipUserCleCkSum(postdata) {
+    let url = headapi + 'v1/Weixin/VipUserCleCkSum';
+    return getApiBasic(url, postdata);
+}
 

app/src/components/alert.vue

@@ -0,0 +1,32 @@
+<template>
+  <div>
+    <mu-dialog title="警告" width="360" :open.sync="openSimple">
+       {{text}}
+      <mu-button slot="actions" flat color="primary" @click="closeSimpleDialog">关闭</mu-button>
+    </mu-dialog>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      openSimple: false,
+      text:'1111'
+    };
+  },
+  methods: {
+    openSimpleDialog(info) {
+      this.openSimple = true;
+      this.text = info;
+    },
+    closeSimpleDialog() {
+      this.openSimple = false;
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

app/src/main.js

@@ -14,6 +14,8 @@ Vue.use(Message);
 import NProgress from 'muse-ui-progress';
 Vue.use(NProgress);
 
+// import VConsole from 'vconsole/dist/vconsole.min.js' //import vconsole
+// let vConsole = new VConsole() // 初始化
 
 Vue.use(MuseUI);
 Vue.locale = () => {

app/src/page/appoint.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="pages">
         <img src="../static/images/main/banner.png" height="121" width="414"/>
-        <mu-tabs :value.sync="active" color="#F2F2F2" indicator-color="#33CAF7">
+        <mu-tabs :value.sync="active" color="#F2F2F2" indicator-color="#ffffff">
             <mu-tab v-for="(day,i) in weeks">{{day.name}} <br> <em>{{day.data}}</em></mu-tab>
         </mu-tabs>
         <div class="context">
@@ -65,6 +65,7 @@
                 <mu-button slot="actions" flat color="primary" @click="confirmAppoint">确定</mu-button>
             </mu-dialog>
         </div>
+      <alert ref="alertPart"></alert>
     </div>
 </template>
 
@@ -79,6 +80,7 @@
         testTable,
     } from '../api/getApiRes.js'
 
+    import alert from '../components/alert'
     let qs = require('qs');
     import Global from '../Global.js'
 
@@ -103,6 +105,9 @@
             this.getFurtherDays();
         },
         methods: {
+          alertInfo(info){
+            this.$refs.alertPart.openSimpleDialog(info);
+          },
             goPage(url) {
                 this.$router.push({path: '/' + url, query: {
                         shopId: this.$route.query.shopId
@@ -167,11 +172,11 @@
                 OderAddByVipUser(postdata).then(res => {
                     let json = res;
                     if (json.Code == 0) {
-                        that.Toast('已成功预约', 'success');
+                        that.alertInfo('已成功预约', 'success');
                         that.openAlert = false;
                         that.getList();
                     } else {
-                        that.Toast(json.Memo + ',错误码：' + json.Code);
+                        that.alertInfo(json.Memo + ',错误码：' + json.Code);
                     }
                 })
             },
@@ -204,19 +209,19 @@
                         OderCancelByVipUser(postdata).then(res => {
                             let json = res;
                             if (json.Code == 0) {
-                                that.Toast('当前课程已取消预约', 'success');
+                                that.alertInfo('当前课程已取消预约', 'success');
                                 that.getList();
                             } else {
-                                that.Toast(json.Memo + ',错误码：' + json.Code);
+                                that.alertInfo(json.Memo + ',错误码：' + json.Code);
                             }
                         })
                     } else {
-                        this.$toast.message('点击了取消');
+                        this.alertInfo('点击了取消');
                     }
                 });
             },
             isDisable(row) {
-                this.Toast('课程不可预约，请选择其他课程或其他时间预约', 'info');
+                this.alertInfo('课程不可预约，请选择其他课程或其他时间预约', 'info');
             },
             getList() {
                 let that = this;
@@ -240,7 +245,7 @@
                             })
                         }
                     } else {
-                        that.Toast(json.Memo + ',错误码：' + json.Code);
+                        that.alertInfo(json.Memo + ',错误码：' + json.Code);
                     }
                 })
             },
@@ -260,7 +265,7 @@
             }
         },
         components: {
-            bottomTab
+            bottomTab,alert
         }
     }
 </script>
@@ -312,7 +317,7 @@
 
     /deep/ .mu-tab-wrapper {
         height: 51px;
-        background: #fff;
+        background: #f4f4f4;
         color: #363636;
         box-shadow: 1px 0px 6px rgba(0, 0, 0, 0.16);
         border-radius: 8px 8px 0px 0px;
@@ -322,9 +327,9 @@
     /deep/ .mu-tab-active .mu-tab-wrapper {
         height: 56px;
         border-radius: 8px 8px 0px 0px;
-        background: #33caf7;
+        background: #ffffff;
         box-shadow: 1px 0px 6px rgba(0, 0, 0, 0.16);
-        color: #fff;
+        color: #000;
     }
 
     /deep/ .mu-tab-wrapper em {

app/src/page/login.vue

@@ -1,630 +1,647 @@
 <template>
-    <div id="skin-blur-violate">
-        <section id="login">
-            <header>
-                <img src="../static/images/login/logo.png" height="109" width="109" id="logo"/>
-                <img src="../static/images/login/title.png" height="100%" width="274px"/>
-            </header>
-            <div class="clearfix"></div>
-            <!-- Login -->
-            <form class="box tile animated active" id="box-login">
-                <h2 class="m-t-0 m-b-15"></h2>
-                <div class="rowHeight">
-                    <input type="text" class="login-control login_account" placeholder="输入手机号"
-                           v-model="login.phone">
-                </div>
-                <div class="rowHeight">
-                    <input type="number" class="login-control login_valid" placeholder="输入右侧图形码"
-                           v-model="login.uservalid">
-                    <img id="imgValidcode" :src="valImgSrc" :title="InvisibilityGiveitatry" @click="getValImgSrc">
-                </div>
-                <div class="rowHeight">
-                    <input type="number" class="login-control login_pwd" placeholder="输入验证码" v-model="login.userpwd"
-                           @keyup.enter="pwdLoginBtn">
-                    <mu-button id="getValidSms" :disabled="getValidSmsState" color="success" @click="getValidSmsBtn">
-                        {{btnText}}
-                    </mu-button>
-                </div>
-                <div class="btn_center">
-                    <span class="btn btn-md login_btn" @click="pwdLoginBtn">登    录</span>
-                </div>
-            </form>
-        </section>
-        <mu-snackbar :position="normal.position" :open.sync="normal.open" :color="normal.color">
-            {{normal.message}}
-            <mu-button flat slot="action" color="secondary" @click="normal.open = false">{{"close"}}</mu-button>
-        </mu-snackbar>
-    </div>
+  <div id="skin-blur-violate">
+    <section id="login">
+      <header>
+        <img src="../static/images/login/logo.png" height="109" width="109" id="logo"/>
+        <img src="../static/images/login/title.png" height="100%" width="274px"/>
+      </header>
+      <div class="clearfix"></div>
+      <!-- Login -->
+      <form class="box tile animated active" id="box-login">
+        <h2 class="m-t-0 m-b-15"></h2>
+        <div class="rowHeight">
+          <input type="text" class="login-control login_account" placeholder="输入手机号"
+                 v-model="login.phone">
+        </div>
+        <div class="rowHeight">
+          <input type="number" class="login-control login_valid" placeholder="输入右侧图形码"
+                 v-model="login.uservalid">
+          <img id="imgValidcode" :src="valImgSrc" :title="InvisibilityGiveitatry" @click="getValImgSrc">
+        </div>
+        <div class="rowHeight">
+          <input type="number" class="login-control login_pwd" placeholder="输入验证码" v-model="login.userpwd"
+                 @keyup.enter="pwdLoginBtn">
+          <mu-button id="getValidSms" :disabled="getValidSmsState" color="success" @click="getValidSmsBtn">
+            {{ btnText }}
+          </mu-button>
+        </div>
+        <div class="btn_center">
+          <span class="btn btn-md login_btn" @click="pwdLoginBtn">登    录</span>
+        </div>
+      </form>
+    </section>
+    <mu-snackbar :position="normal.position" :open.sync="normal.open" :color="normal.color">
+      {{ normal.message }}
+      <mu-button flat slot="action" color="secondary" @click="normal.open = false">{{ "close" }}</mu-button>
+    </mu-snackbar>
+  </div>
 </template>
 
 <script>
-    import {
-        SignIn,
-        GenVerifyPic,
-        GetPhoneVFCode,
-        PhoneSignIn,
-        WXBind,
-        testSelect
-    } from '../api/getApiRes.js'
-
-    let qs = require('qs');
-
-    export default {
-        data() {
-            let samepass = (rule, value, callback) => {
-                if (value !== this.form.newpwd) {
-                    callback(new Error('两次输入密码不一致!'));
-                } else {
-                    callback();
-                }
-            };
-            let pwdPass = (rule, value, callback) => {
-                let re = /^[0-9a-zA-Z_]{1,}$/;
-                if (value.search(re) == -1) {
-                    callback(new Error('错了哦，密码只能由字母、数字及下划线组成'));
-                } else {
-                    callback()
-                }
-            };
-            let phonetest = (rule, value, callback) => {
-                let re = /^1[3|4|5|7|8|9][0-9]\d{8}$/;
-                if (value.search(re) == -1) {
-                    callback(new Error('错了哦，手机号码格式不正确'));
-                } else {
-                    callback()
-                }
-            };
-            return {
-                Password: "Password",
-                VerificationCode: "Verification Code",
-                InvisibilityGiveitatry: "无效?再点一下试试吧!",
-                valImgSrc: '',//
-                picId: '',//
-                getValidSmsState: false,//
-                overtime: '',
-                btnText: '获取验证码',
-                normal: normal,
-                login: {
-                    phone: '',
-                    userpwd: '',
-                    uservalid: '',
-                },
-                rules: {
-                    username: [
-                        {required: true, message: '请输入用户名', trigger: 'blur'},
-                        {min: 6, max: 32, message: '长度在 6 到 32 个字符', trigger: 'blur'},
-                    ],
-                    phone: [
-                        {required: true, message: '请输入手机号', trigger: 'blur'},
-                        {min: 11, max: 12, message: '手机号长度是11位', trigger: 'blur'},
-                        {validator: phonetest, trigger: 'blur'}
-                    ],
-                    re_phonevalid: [
-                        {required: true, message: '请输入验证码', trigger: 'blur'},
-                        {min: 4, max: 4, message: '长度在 4 个字符', trigger: 'blur'},
-                    ],
-                    newpwd: [
-                        {required: true, message: '请输入新密码', trigger: 'blur'},
-                        {min: 6, max: 32, message: '长度在 6 到 32 个字符', trigger: 'blur'},
-                        {validator: pwdPass, trigger: 'blur'}
-                    ],
-                    again: [
-                        {required: true, message: '请输入确认密码', trigger: 'blur'},
-                        {min: 6, max: 32, message: '长度在 6 到 32 个字符', trigger: 'blur'},
-                        {validator: pwdPass, trigger: 'blur'},
-                        {validator: samepass, trigger: 'blur'},
-                    ],
-                }
-            }
-        },
-        mounted() {
-            // 获取图形验证码
-            this.getValImgSrc();
-            this.overtime = new Date();
-            let userAgent = navigator.userAgent;
-            if (userAgent.indexOf("Mozilla") > -1) {//判断是否Mozilla浏览器
-                // 浏览器测试
-            } else {
-                this.checkcode();
-            }
-
-        },
-        methods: {
-            // 获取CODE
-            checkcode() {
-                // 0213tIFa1fBjAz0OVDIa1LfXwc03tIFK
-                console.log(this.getUrlKey('state'));
-                if (this.getUrlKey('state') == 123) {
-                    // 取到值了
-                    localStorage.code = this.getUrlKey('code');
-                    console.log(localStorage.code);
-                } else {
-                    // 第一次加载
-                    this.GetOpenId();
-                }
-            },
-            // 获取公众号ID
-            GetOpenId() {
-                let origin = location.href;
-                let urlNow = encodeURIComponent(origin);
-                let scope = 'snsapi_userinfo';    //snsapi_userinfo   //静默授权 用户无感知
-                // let appid = 'wx36cb8b6661d71811';//正式
-                let appid = 'wx685402342cfa5650';//测试
-                let state = '123';
-                let url = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + appid + '&redirect_uri=' + urlNow + '&response_type=code&scope=' + scope + '&state=' + state + '#wechat_redirect';
-                self.location = url;
-            },
-            getUrlKey(name) {
-                return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [, ""])[1].replace(/\+/g, '%20')) || null;
-            },
-            // 获取验证码
-            getValidSmsBtn() {
-                let that = this;
-                let phone = that.login.phone;
-                let uservalid = that.login.uservalid;
-                if (!phone) {
-                    that.Toast('手机号不能为空');
-                    return false
-                }
-                if (phone.length != 11) {
-                    that.Toast('手机号只能是11位');
-                    return false
-                }
-                if (!globalCheckPhone(phone)) {
-                    that.Toast('手机号格式不正确');
-                    return false
-                }
-                if (!uservalid) {
-                    that.Toast('图形验证码不能为空');
-                    return false
-                }
-                if (uservalid.length != 4) {
-                    that.Toast('图形验证码只能是4位');
-                    return false
-                }
-                let param = {
-                    token: localStorage.token,
-                    phone: phone,
-                    codeType: 1,
-                    picId: this.valImgId,
-                    picCode: uservalid,
-                };
-                let postdata = qs.stringify(param);
-                GetPhoneVFCode(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.Toast('短信验证码已发送', 'success');
-                        that.calcTime();
-                    } else {
-                        that.Toast(json.Memo);
-                    }
-                })
-            },
-            calcTime() {
-                // 短信倒数计时
-                let countdown = 60;
-                let that = this;
-                //设置button效果，开始计时
-                that.getValidSmsState = true;
-                that.btnText = countdown + "S"
-                //启动计时器，1秒执行一次
-                let timer = setInterval(function () {
-                    if (countdown == 0) {
-                        clearInterval(timer);//停止计时器
-                        that.getValidSmsState = false;
-                        that.btnText = "重新发送"
-                    } else {
-                        countdown--;
-                        that.btnText = countdown + "S"
-                    }
-                }, 1000);
-            },
-            clearLogin() {
-                this.login.username = '';
-                this.login.userpwd = '';
-                this.login.uservalid = '';
-                this.getValImgSrc();
-            },
-            // 点击验证码切换
-            getValImgSrc() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    width: 100,
-                    height: 30,
-                    noiseCount: 10,
-                    length: 4,
-                    source: 123456789,
-                };
-                let postdata = qs.stringify(param);
-                GenVerifyPic(postdata).then(res => {
-                    let json = res;
-                    that.valImgSrc = json.Pic;
-                    that.valImgId = json.Id;
-                })
-            },
-            // pwd登录
-            pwdLoginBtn() {
-                let that = this;
-                let phone = this.login.phone;
-                let userpwd = this.login.userpwd;
-                // 重置验证码超时
-                that.overtime = new Date();
-                if (!that.globalValid(phone, 10, 12, '手机号', that)) return;
-                if (!that.globalValid(userpwd, 5, 7, '短信验证码', that)) return;
-                this.loginInfo();
-            },
-            // 校验内容长度
-            globalValid(data, mins, maxs, text, that) {
-                let thisVal = data;
-                let thisLeng = thisVal.length;
-                let min = parseInt(mins);
-                let max = parseInt(maxs);
-                let dispalyMin = min + 1;
-                if (thisVal == '') {
-                    this.Toast(text + ' ' + '不能为空');
-                    return false
-                } else if (thisLeng <= min) {
-                    this.Toast(text + '最少' + dispalyMin + '字符');
-                    return false
-                } else if (thisLeng > max) {
-                    this.Toast(text + '超过限制长度');
-                    return false
-                } else {
-                    return true
-                }
-            },
-            // pwd登陆
-            loginInfo: function () {
-                const that = this;
-                let current = new Date();
-                let betweenTime = current - that.overtime;
-                let s = 120;
-                if (betweenTime > s * 1000) {
-                    that.changeValImg();
-                    that.$toast.message('验证码已超时，请重新输入');
-                    return false
-                }
-                let param = {
-                    phone: that.login.phone,
-                    code: that.login.userpwd,
-                    channel: 3
-                };
-                let postdata = qs.stringify(param);
-                PhoneSignIn(postdata).then(res => {
-                    if (res.Code == 0) {
-                        that.res = res.Rs;
-                        localStorage.token = res.Rs.token;
-                        // that.bindWx();
-                        // 607862e8828013be90c2ccb78468b43a
-                        // test
-                        that.$router.push({path: '/'});
-                    } else {
-                        if (res.Code == 10005) {
-                            that.$refs.userpwd.value = '';
-                            that.Toast('密码错误，请重新输入');
-                        } else {
-                            that.Toast(res.Memo + ',错误代码：' + res.Code);
-                            that.form.valid = '';
-                        }
-                    }
-                })
-            },
-            bindWx() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    code: localStorage.code,
-                };
-                let postdata = qs.stringify(param);
-                WXBind(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.$router.push({path: '/'});
-                    } else {
-                        that.Toast(res.Memo + ',错误代码：' + res.Code);
-                    }
-                })
-            },
-            getUserInfo(token) {
-                let that = this;
-                let param = {
-                    token: token,
-                };
-                let postdata = qs.stringify(param);
-                testSelect(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        var userLevel = json.Rs.Rolesname;
-                        localStorage.userLevel = userLevel;
-                        localStorage.comId = json.Rs.Comid;
-                        localStorage.Insname = json.Rs.Insname;
-                        that.$router.push({path: '/'});
-                    } else {
-                        that.$toast.message(json.Memo);
-                    }
-                })
-            }
-        },
-        components: {}
-    }
-</script>
-
-<style scoped>
-    #skin-blur-violate {
-        position: relative;
-        top: 0;
-        left: 0;
-        right: 0;
-        bottom: 0;
-        width: 100%;
-        height: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        background: #3B3B3B;
-        background: url("../static/images/login/bg.png") top center no-repeat;
-        background-size: 100% 100%;
-    }
-
-    #login {
-        width: 90%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-    }
-
-    #login .box {
-        margin: 0 auto;
-        position: inherit;
-        margin-top: 20px;
-        border-radius: 9px;
-        padding: 20px 20px;
-    }
-
-    h1 {
-        color: #FFA200;
-        font-size: 30px;
-    }
-
-    header p {
-        font-size: 14px;
-        color: #7B7B7B;
-    }
-
-    #login header {
-        text-align: center;
-        margin-top: 15%;
-    }
-
-    #box-login h2 {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-bottom: 20px;
-        text-align: center;
-        font-size: 24px;
-        color: #fff;
-    }
-
-    #tableBordered {
-        margin: 0;
-        padding: 0;
-    }
-
-    #tableBordered h5 {
-        margin: 0;
-        text-align: center;
-        padding: 0;
-    }
-
-    #login .box {
-        margin: 0 auto;
-        position: inherit;
-        margin-top: 20px;
-        border-radius: 9px !important;
-    }
-
-    #login header {
-        text-align: center;
-        margin-top: 15%;
-    }
-
-    #tableBordered {
-        margin: 0;
-        padding: 0;
-    }
-
-    #tableBordered h5 {
-        margin: 0;
-        text-align: center;
-        padding: 0;
-    }
-
-    #imgValidcode {
-        position: relative;
-        float: right;
-        /*bottom: 54px;*/
-        width: 100px;
-        height: 50px;
-        background: #eee;
-    }
-
-    .login_btn {
-        width: 100%;
-        height: 50px;
-        line-height: 50px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-top: 42px;
-        background: #E75296;
-        color: #fff;
-        font-size: 14px;
-        text-align: center;
-        border: none;
-        padding: 0;
-        font-size: 24px;
-        margin-bottom: 3%;
-    }
-
-    .clear_btn {
-        width: 100%;
-        height: 40px;
-        line-height: 40px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        background: rgba(255, 255, 255, 0.32);
-        color: #FFCC00;
-        font-size: 14px;
-        text-align: center;
-        border: none;
-        padding: 0;
-    }
-
-    header p {
-        margin-top: 10px;
-    }
-
-    #login .login-control {
-        width: 100%;
-        height: 50px;
-        line-height: 50px;
-        background: rgba(255, 255, 255, 0.4);
-        margin-bottom: 3px;
-        text-indent: 10px;
-        border: none;
-
-    }
-
-    #login .login-control::placeholder {
-        color: #000000;
-        font-size: 16px;
-    }
-
-    #logo {
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-top: 10%;
-        margin-bottom: 10px;
-    }
-
-    .rowHeight {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        height: 50px;
-        margin-bottom: 3px;
-    }
-
-    #getValidSms {
-        width: 100px;
-        height: 50px;
-        background: #fff;
-        border: 1px solid #fff;
-        opacity: 0.6;
-        position: relative;
-        /*bottom: 55px;*/
-        float: right;
-        text-align: center;
-        color: #E75296;
-        line-height: 20px;
-        font-size: 12px;
-    }
-
-    #login .login_valid {
-        width: 173px;
-        float: left;
-    }
-
-    #login .login_pwd {
-        width: 173px;
-        float: left;
-    }
-
-    @media only screen and (max-width: 640px) {
-
-    }
-
-    @media only screen and (max-width: 480px) {
-        #login .login_valid {
-            width: 195px;
-        }
-
-        #login .login_pwd {
-            width: 195px;
-        }
-    }
-
-    @media only screen and (max-width: 414px) {
-        #login .login_valid {
-            width: 223px;
-        }
-
-        #login .login_pwd {
-            width: 223px;
-        }
-    }
-
-    @media only screen and (max-width: 400px) {
-
-        #login .login_valid {
-            width: 218px;
-        }
-
-        #login .login_pwd {
-            width: 218px;
+import {
+  SignIn,
+  GenVerifyPic,
+  GetPhoneVFCode,
+  PhoneSignIn,
+  WXBind,
+  testSelect
+} from '../api/getApiRes.js'
+
+let qs = require('qs');
+
+export default {
+  data() {
+    let samepass = (rule, value, callback) => {
+      if (value !== this.form.newpwd) {
+        callback(new Error('两次输入密码不一致!'));
+      } else {
+        callback();
+      }
+    };
+    let pwdPass = (rule, value, callback) => {
+      let re = /^[0-9a-zA-Z_]{1,}$/;
+      if (value.search(re) == -1) {
+        callback(new Error('错了哦，密码只能由字母、数字及下划线组成'));
+      } else {
+        callback()
+      }
+    };
+    let phonetest = (rule, value, callback) => {
+      let re = /^1[3|4|5|7|8|9][0-9]\d{8}$/;
+      if (value.search(re) == -1) {
+        callback(new Error('错了哦，手机号码格式不正确'));
+      } else {
+        callback()
+      }
+    };
+    return {
+      Password: "Password",
+      VerificationCode: "Verification Code",
+      InvisibilityGiveitatry: "无效?再点一下试试吧!",
+      valImgSrc: '',//
+      picId: '',//
+      getValidSmsState: false,//
+      overtime: '',
+      btnText: '获取验证码',
+      normal: normal,
+      login: {
+        phone: '',
+        userpwd: '',
+        uservalid: '',
+      },
+      rules: {
+        username: [
+          {required: true, message: '请输入用户名', trigger: 'blur'},
+          {min: 6, max: 32, message: '长度在 6 到 32 个字符', trigger: 'blur'},
+        ],
+        phone: [
+          {required: true, message: '请输入手机号', trigger: 'blur'},
+          {min: 11, max: 12, message: '手机号长度是11位', trigger: 'blur'},
+          {validator: phonetest, trigger: 'blur'}
+        ],
+        re_phonevalid: [
+          {required: true, message: '请输入验证码', trigger: 'blur'},
+          {min: 4, max: 4, message: '长度在 4 个字符', trigger: 'blur'},
+        ],
+        newpwd: [
+          {required: true, message: '请输入新密码', trigger: 'blur'},
+          {min: 6, max: 32, message: '长度在 6 到 32 个字符', trigger: 'blur'},
+          {validator: pwdPass, trigger: 'blur'}
+        ],
+        again: [
+          {required: true, message: '请输入确认密码', trigger: 'blur'},
+          {min: 6, max: 32, message: '长度在 6 到 32 个字符', trigger: 'blur'},
+          {validator: pwdPass, trigger: 'blur'},
+          {validator: samepass, trigger: 'blur'},
+        ],
+      }
+    }
+  },
+  mounted() {
+    // 入口状态有 3 种
+    // 1.全新登入，拿weixinId 拿验证码 ，绑定 ，登陆
+    // 2.token 未失效用户，直接进入内页，继续凭token使用
+    // 3.token 已失效用户，删掉本地token ，重新按照1的模式登陆
+    if (localStorage.token) {
+      // 凭借旧token直接登陆
+      this.$router.push({path: '/'});
+    } else {
+      // 获取图形验证码
+      this.getValImgSrc();
+      this.overtime = new Date();
+      let from = this.$route.query.from;//获取来源
+      let userAgent = navigator.userAgent;
+      if (from == 'app') {//判断是否微信浏览器
+        // 浏览器测试
+        console.log('from app & brower');
+      } else {
+        console.log('form wx');
+        this.checkcode();
+      }
+    }
+  },
+  methods: {
+    // 获取CODE
+    checkcode() {
+      // 0213tIFa1fBjAz0OVDIa1LfXwc03tIFK
+      if (this.getUrlKey('state') == 123) {
+        // 取到值了
+        localStorage.code = this.getUrlKey('code');
+        // console.log('code:' + localStorage.code);
+      } else {
+        // 第一次加载
+        this.GetOpenId();
+      }
+    },
+    // 获取公众号ID
+    GetOpenId() {
+      let origin = location.href;
+      // let origin = 'http://wx.xfeilong.com';
+      let urlNow = encodeURIComponent(origin);
+      let scope = 'snsapi_userinfo';    //snsapi_userinfo   //静默授权 用户无感知
+      let appid = 'wx36cb8b6661d71811';//正式
+      let state = '123';
+      let url = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + appid + '&redirect_uri=' + urlNow + '&response_type=code&scope=' + scope + '&state=' + state + '#wechat_redirect';
+      self.location = url;
+    },
+    getUrlKey(name) {
+      return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [, ""])[1].replace(/\+/g, '%20')) || null;
+    },
+    // 获取验证码
+    getValidSmsBtn() {
+      let that = this;
+      let phone = that.login.phone;
+      let uservalid = that.login.uservalid;
+      if (!phone) {
+        that.Toast('手机号不能为空');
+        return false
+      }
+      if (phone.length != 11) {
+        that.Toast('手机号只能是11位');
+        return false
+      }
+      if (!globalCheckPhone(phone)) {
+        that.Toast('手机号格式不正确');
+        return false
+      }
+      if (!uservalid) {
+        that.Toast('图形验证码不能为空');
+        return false
+      }
+      if (uservalid.length != 4) {
+        that.Toast('图形验证码只能是4位');
+        return false
+      }
+      let param = {
+        token: localStorage.token,
+        phone: phone,
+        codeType: 1,
+        picId: this.valImgId,
+        picCode: uservalid,
+      };
+      let postdata = qs.stringify(param);
+      GetPhoneVFCode(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.Toast('短信验证码已发送', 'success');
+          that.calcTime();
+        } else {
+          that.Toast(json.Memo);
         }
-        #getValidSms {
-            font-size: 13px;
-        }
-    }
-
-    @media only screen and (max-width: 375px) {
-        #login .login_valid {
-            width: 190px;
+      })
+    },
+    calcTime() {
+      // 短信倒数计时
+      let countdown = 60;
+      let that = this;
+      //设置button效果，开始计时
+      that.getValidSmsState = true;
+      that.btnText = countdown + "S"
+      //启动计时器，1秒执行一次
+      let timer = setInterval(function () {
+        if (countdown == 0) {
+          clearInterval(timer);//停止计时器
+          that.getValidSmsState = false;
+          that.btnText = "重新发送"
+        } else {
+          countdown--;
+          that.btnText = countdown + "S"
         }
-
-        #login .login_pwd {
-            width: 190px;
-        }
-
-        #getValidSms {
-            font-size: 14px;
-        }
-    }
-
-    @media only screen and (max-width: 360px) {
-        #login .login_valid {
-            width: 160px;
+      }, 1000);
+    },
+    clearLogin() {
+      this.login.username = '';
+      this.login.userpwd = '';
+      this.login.uservalid = '';
+      this.getValImgSrc();
+    },
+    // 点击验证码切换
+    getValImgSrc() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        width: 100,
+        height: 30,
+        noiseCount: 10,
+        length: 4,
+        source: 123456789,
+      };
+      let postdata = qs.stringify(param);
+      GenVerifyPic(postdata).then(res => {
+        let json = res;
+        that.valImgSrc = json.Pic;
+        that.valImgId = json.Id;
+      })
+    },
+    // pwd登录
+    pwdLoginBtn() {
+      let that = this;
+      let phone = this.login.phone;
+      let userpwd = this.login.userpwd;
+      // 重置验证码超时
+      that.overtime = new Date();
+      if (!that.globalValid(phone, 10, 12, '手机号', that)) return;
+      if (!that.globalValid(userpwd, 5, 7, '短信验证码', that)) return;
+      this.loginInfo();
+    },
+    // 校验内容长度
+    globalValid(data, mins, maxs, text, that) {
+      let thisVal = data;
+      let thisLeng = thisVal.length;
+      let min = parseInt(mins);
+      let max = parseInt(maxs);
+      let dispalyMin = min + 1;
+      if (thisVal == '') {
+        this.Toast(text + ' ' + '不能为空');
+        return false
+      } else if (thisLeng <= min) {
+        this.Toast(text + '最少' + dispalyMin + '字符');
+        return false
+      } else if (thisLeng > max) {
+        this.Toast(text + '超过限制长度');
+        return false
+      } else {
+        return true
+      }
+    },
+    // pwd登陆
+    loginInfo: function () {
+      const that = this;
+      let current = new Date();
+      let betweenTime = current - that.overtime;
+      let s = 120;
+      if (betweenTime > s * 1000) {
+        that.changeValImg();
+        that.$toast.message('验证码已超时，请重新输入');
+        return false
+      }
+      let param = {
+        phone: that.login.phone,
+        code: that.login.userpwd,
+        channel: 3
+      };
+      let postdata = qs.stringify(param);
+      PhoneSignIn(postdata).then(res => {
+        if (res.Code == 0) {
+          that.res = res.Rs;
+          // 使用token做免校验登陆
+          localStorage.token = res.Rs.token;
+          // 如果是wx登陆就执行绑定操作
+          let from = this.$route.query.from;//获取来源
+          if (from != 'app') {
+            that.bindWx();
+          }
+
+          // 607862e8828013be90c2ccb78468b43a
+          // test
+          that.$router.push({path: '/'});
+        } else {
+          if (res.Code == 10005) {
+            that.$refs.userpwd.value = '';
+            that.Toast('密码错误，请重新输入');
+          } else {
+            that.Toast(res.Memo + ',错误代码：' + res.Code);
+            that.form.valid = '';
+          }
         }
-
-        #login .login_pwd {
-            width: 160px;
+      })
+    },
+    bindWx() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        code: localStorage.code,
+      };
+      let postdata = qs.stringify(param);
+      WXBind(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // that.$router.push({path: '/'});
+        } else {
+          // that.Toast(res.Memo + ',错误代码：' + res.Code);
         }
-
-        #getValidSms {
-            font-size: 14px;
+      })
+    },
+    getUserInfo(token) {
+      let that = this;
+      let param = {
+        token: token,
+      };
+      let postdata = qs.stringify(param);
+      testSelect(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          var userLevel = json.Rs.Rolesname;
+          localStorage.userLevel = userLevel;
+          localStorage.comId = json.Rs.Comid;
+          localStorage.Insname = json.Rs.Insname;
+          that.$router.push({path: '/'});
+        } else {
+          that.$toast.message(json.Memo);
         }
+      })
     }
+  },
+  components: {}
+}
+</script>
 
-    @media only screen and (max-width: 320px) {
-        #login .login_valid {
-            width: 144px;
-        }
-
-        #login .login_pwd {
-            width: 144px;
-        }
-
-        #getValidSms {
-            font-size: 12px;
-        }
-    }
+<style scoped>
+#skin-blur-violate {
+  position: relative;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  background: #3B3B3B;
+  background: url("../static/images/login/bg.png") top center no-repeat;
+  background-size: 100% 100%;
+}
+
+#login {
+  width: 90%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+}
+
+#login .box {
+  margin: 0 auto;
+  position: inherit;
+  margin-top: 20px;
+  border-radius: 9px;
+  padding: 20px 20px;
+}
+
+h1 {
+  color: #FFA200;
+  font-size: 30px;
+}
+
+header p {
+  font-size: 14px;
+  color: #7B7B7B;
+}
+
+#login header {
+  text-align: center;
+  margin-top: 15%;
+}
+
+#box-login h2 {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-bottom: 20px;
+  text-align: center;
+  font-size: 24px;
+  color: #fff;
+}
+
+#tableBordered {
+  margin: 0;
+  padding: 0;
+}
+
+#tableBordered h5 {
+  margin: 0;
+  text-align: center;
+  padding: 0;
+}
+
+#login .box {
+  margin: 0 auto;
+  position: inherit;
+  margin-top: 20px;
+  border-radius: 9px !important;
+}
+
+#login header {
+  text-align: center;
+  margin-top: 15%;
+}
+
+#tableBordered {
+  margin: 0;
+  padding: 0;
+}
+
+#tableBordered h5 {
+  margin: 0;
+  text-align: center;
+  padding: 0;
+}
+
+#imgValidcode {
+  position: relative;
+  float: right;
+  /*bottom: 54px;*/
+  width: 100px;
+  height: 50px;
+  background: #eee;
+}
+
+.login_btn {
+  width: 100%;
+  height: 50px;
+  line-height: 50px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-top: 42px;
+  background: #E75296;
+  color: #fff;
+  font-size: 14px;
+  text-align: center;
+  border: none;
+  padding: 0;
+  font-size: 24px;
+  margin-bottom: 3%;
+}
+
+.clear_btn {
+  width: 100%;
+  height: 40px;
+  line-height: 40px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  background: rgba(255, 255, 255, 0.32);
+  color: #FFCC00;
+  font-size: 14px;
+  text-align: center;
+  border: none;
+  padding: 0;
+}
+
+header p {
+  margin-top: 10px;
+}
+
+#login .login-control {
+  width: 100%;
+  height: 50px;
+  line-height: 50px;
+  background: rgba(255, 255, 255, 0.4);
+  margin-bottom: 3px;
+  text-indent: 10px;
+  border: none;
+
+}
+
+#login .login-control::placeholder {
+  color: #000000;
+  font-size: 16px;
+}
+
+#logo {
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-top: 10%;
+  margin-bottom: 10px;
+}
+
+.rowHeight {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  height: 50px;
+  margin-bottom: 3px;
+}
+
+#getValidSms {
+  width: 100px;
+  height: 50px;
+  background: #fff;
+  border: 1px solid #fff;
+  opacity: 0.6;
+  position: relative;
+  /*bottom: 55px;*/
+  float: right;
+  text-align: center;
+  color: #E75296;
+  line-height: 20px;
+  font-size: 12px;
+}
+
+#login .login_valid {
+  width: 173px;
+  float: left;
+}
+
+#login .login_pwd {
+  width: 173px;
+  float: left;
+}
+
+@media only screen and (max-width: 640px) {
+
+}
+
+@media only screen and (max-width: 480px) {
+  #login .login_valid {
+    width: 195px;
+  }
+
+  #login .login_pwd {
+    width: 195px;
+  }
+}
+
+@media only screen and (max-width: 414px) {
+  #login .login_valid {
+    width: 223px;
+  }
+
+  #login .login_pwd {
+    width: 223px;
+  }
+}
+
+@media only screen and (max-width: 400px) {
+
+  #login .login_valid {
+    width: 218px;
+  }
+
+  #login .login_pwd {
+    width: 218px;
+  }
+
+  #getValidSms {
+    font-size: 13px;
+  }
+}
+
+@media only screen and (max-width: 375px) {
+  #login .login_valid {
+    width: 190px;
+  }
+
+  #login .login_pwd {
+    width: 190px;
+  }
+
+  #getValidSms {
+    font-size: 14px;
+  }
+}
+
+@media only screen and (max-width: 360px) {
+  #login .login_valid {
+    width: 160px;
+  }
+
+  #login .login_pwd {
+    width: 160px;
+  }
+
+  #getValidSms {
+    font-size: 14px;
+  }
+}
+
+@media only screen and (max-width: 320px) {
+  #login .login_valid {
+    width: 144px;
+  }
+
+  #login .login_pwd {
+    width: 144px;
+  }
+
+  #getValidSms {
+    font-size: 12px;
+  }
+}
 
 
 </style>

app/src/page/mainpage.vue

@@ -1,326 +1,338 @@
 <template>
-    <div id="mainPage">
-        <img src="../static/images/main/banner.png" height="121" width="414"/>
-        <span class="shopNum">
-            俱乐部场馆共 {{list.length}} 处
+  <div id="mainPage">
+    <img src="../static/images/main/banner.png" height="121" width="414"/>
+    <span class="shopNum">
+            俱乐部场馆共 {{ list.length }} 处
         </span>
-        <ul class="list">
-            <li v-for="l in list" @click="goAppoint(l)" v-if="l.Status == 1 ">
-                <img src="../static/images/main/771.png" height="133" width="130"/>
-                <div class="rt">
-                    <h5>{{l.ShopName}}</h5>
-                    <span>今日预约名额剩余
-                        <i v-if="l.RemainOrdernum > 0">{{l.RemainOrdernum}}</i>
-                        <i v-if="l.RemainOrdernum == 0" class="red">{{l.RemainOrdernum}}</i>
+    <ul class="list">
+      <li v-for="l in list" @click="goAppoint(l)" v-if="l.Status == 1 ">
+        <img src="../static/images/main/771.png" height="133" width="130"/>
+        <div class="rt">
+          <h5>{{ l.ShopName }}</h5>
+          <span>今日预约名额剩余
+                        <i v-if="l.RemainOrdernum > 0">{{ l.RemainOrdernum }}</i>
+                        <i v-if="l.RemainOrdernum == 0" class="red">{{ l.RemainOrdernum }}</i>
                         人</span>
-                    <span>地址：{{l.Addr}}</span>
-                    <em class="green" v-if="l.WxStatus == 1 && l.IsJoin ==1">点击预约</em>
-                    <em class="red" v-else>不可预约</em>
-                </div>
-            </li>
-            <div class="tips" v-if="list == ''">
-                <p style="text-align: center">
-                    暂无可预约的门店
-                </p>
-            </div>
-        </ul>
-        <bottomTab :curTab="thisTab"></bottomTab>
-    </div>
+          <span>地址：{{ l.Addr }}</span>
+          <em class="green" v-if="l.WxStatus == 1 && l.IsJoin ==1">点击预约</em>
+          <em class="red" v-else>不可预约</em>
+        </div>
+      </li>
+      <div class="tips" v-if="list == ''">
+        <p style="text-align: center">
+          暂无可预约的门店
+        </p>
+      </div>
+    </ul>
+    <bottomTab :curTab="thisTab"></bottomTab>
+    <alert ref="alertPart"></alert>
+  </div>
 </template>
 
 <script>
-    import {
-        ManagerSelfQuery,
-        OrderShopQuery,
-        testSelect,
-        testTable,
-    } from '../api/getApiRes.js'
-
-    import bottomTab from '../components/bottomTab'
-    import axios from 'axios';
-
-    let qs = require('qs');
-    import Global from '../Global.js'
-
-    export default {
-        data() {
-            return {
-                thisTab: '预约课程',
-                shopNum: 0,
-                recordNum: 0,
-                Dannum: 0,
-                GetHotelCounts: 0,
-                GetDetectorNum: 0,
-                currShopId: 0,
-                list: [],
-            }
-        },
-        mounted() {
-
-            this.getManagerSelfQuery();
-        },
-        destroyed() {
-        },
-        methods: {
-            getManagerSelfQuery() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                };
-                let postdata = qs.stringify(param);
-                ManagerSelfQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        this.currShopId = json.Rs.ShopId;
-                        this.getList();
-                    } else {
-                        that.$toast.message(json.Memo);
-                        if (json.Code == 1010) {
-                            that.$router.push({path: '/login'});
-                        }
-                    }
-                })
-            },
-            getList() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                };
-                let postdata = qs.stringify(param);
-                OrderShopQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.list = json.Rs;
-                        if (that.list) {
-                            that.shopNum = json.Rs.length;
-                        }
-                    } else {
-                        that.$toast.message(json.Memo);
-                    }
-                })
-            },
-            onGoNewPage(path) {
-                this.$router.push({path: '/' + path});
-            },
-            goPage(pages) {
-                this.$router.push({path: pages});
-            },
-            goAppoint(row) {
-                let that = this;
-                if(row.IsJoin == 0){
-                    that.Toast('您不是该店会员，不可预约');
-                    return false
-                }
-                if (row.Status == 2) {
-                    that.Toast(row.name + '不可预约');
-                    return false
-                } else {
-                    this.$router.push({
-                        path: '/appoint', query: {
-                            shopId: row.ShopID
-                        }
-                    });
-                }
-            }
-        },
-        beforeRouteEnter(to, from, next) {
-            next(vm => {
-                //因为当钩子执行前，组件实例还没被创建
-                // vm 就是当前组件的实例相当于上面的 this，所以在 next 方法里你就可以把 vm 当 this 来用了。
-                if (to.name == '') {
-                    vm.getList();
-                }
-            });
-        },
-        watch: {
-            $route(to) {
-                if (to.name == '') {
-                    this.getList();
-                }
-            },
-            'active'() {
-                this.getList();
-            }
-        },
-        components: {
-            bottomTab
+import {
+  ManagerSelfQuery,
+  OrderShopQuery,
+} from '../api/getApiRes.js'
+
+import bottomTab from '../components/bottomTab'
+import alert from '../components/alert'
+import axios from 'axios';
+
+let qs = require('qs');
+import Global from '../Global.js'
+
+export default {
+  data() {
+    return {
+      thisTab: '预约课程',
+      shopNum: 0,
+      recordNum: 0,
+      Dannum: 0,
+      GetHotelCounts: 0,
+      GetDetectorNum: 0,
+      currShopId: 0,
+      list: [],
+    }
+  },
+  mounted() {
+    this.getManagerSelfQuery();
+  },
+  destroyed() {
+  },
+  methods: {
+    alertInfo(info){
+      this.$refs.alertPart.openSimpleDialog(info);
+    },
+    getManagerSelfQuery() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+      };
+      let postdata = qs.stringify(param);
+      ManagerSelfQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          this.currShopId = json.Rs.ShopId;
+          this.getList();
+        } else {
+          that.alertInfo(json.Memo);
+          if (json.Code == 1010) {
+            localStorage.clear();
+            console.log(1010);
+            that.$router.push({path: '/login'});
+          }
+        }
+      })
+    },
+    getList() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+      };
+      let postdata = qs.stringify(param);
+      OrderShopQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.list = json.Rs;
+          if (that.list) {
+            that.shopNum = json.Rs.length;
+          }
+        } else {
+          that.alertInfo(json.Memo);
+          // 权限失效后，删掉本地token
+          if (json.Code == 1004) {
+            localStorage.clear();
+            console.log(1010);
+            this.$router.push({path: '/login'});
+          }
         }
+      })
+    },
+    onGoNewPage(path) {
+      this.$router.push({path: '/' + path});
+    },
+    goPage(pages) {
+      this.$router.push({path: pages});
+    },
+    goAppoint(row) {
+      let that = this;
+      if (row.IsJoin == 0) {
+        that.alertInfo('您不是该店会员，不可预约');
+        return false
+      }
+      if (row.Status == 2) {
+        that.alertInfo(row.name + '不可预约');
+        return false
+      } else {
+        this.$router.push({
+          path: '/appoint', query: {
+            shopId: row.ShopID
+          }
+        });
+      }
     }
+  },
+  beforeRouteEnter(to, from, next) {
+    next(vm => {
+      //因为当钩子执行前，组件实例还没被创建
+      // vm 就是当前组件的实例相当于上面的 this，所以在 next 方法里你就可以把 vm 当 this 来用了。
+      if (to.name == '') {
+        vm.getList();
+      }
+    });
+  },
+  watch: {
+    $route(to) {
+      if (to.name == '') {
+        this.getList();
+      }
+    },
+    'active'() {
+      this.getList();
+    }
+  },
+  components: {
+    bottomTab, alert
+  }
+}
 </script>
 
 <style scoped>
-    #mainPage {
-        width: 100%;
-        height: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        background: #f2f2f2;
-    }
-
-    .goPage {
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        background: #fff;
-        height: 50px;
-        line-height: 50px;
-        padding: 0 20px;
-        color: #333;
-        font-size: 18px;
-        border-bottom: 1px solid #f2f2f2;
-    }
-
-    .goPage span {
-        float: left;
-    }
-
-    .goPage i {
-        float: right;
-        margin-top: 12px;
-    }
-
-    .goPage img {
-        overflow: hidden;
-        display: block;
-        width: 8px;
-        height: 14px;
-        float: right;
-        margin-top: 16px;
-        margin-right: 10px;
-    }
-
-    .goTitle i {
-        margin-top: 10px;
-        float: right;
-    }
-
-    .mapContainer {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        max-height: 317px;
-    }
-
-    .shopNum {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        font-family: "PingFang SC";
-        font-weight: 300;
-        font-size: 14px;
-        color: #909090;
-        text-align: center;
-    }
-
-    .list {
-        width: 94%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding-left: 3%;
-        padding-right: 3%;
-        margin-top: 10px;
-        padding-bottom: 20px;
-    }
-
-    .list li {
-        width: 100%;
-        height: 133px;
-        background: transparent;
-        margin-bottom: 20px;
-        border-radius: 13px;
-        background: #fff;
-        box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
-        overflow: hidden;
-    }
-
-    .list img {
-        float: left;
-    }
-
-    .list .rt {
-        width: 58%;
-        float: left;
-        padding-left: 15px;
-    }
-
-    .list .rt h5 {
-        font-family: "PingFang SC";
-        font-weight: normal;
-        font-size: 18px;
-        text-align: left;
-        color: #3b3b3b;
-        margin: 0;
-        margin-top: 18px;
-        margin-bottom: 7px;
-    }
-
-    .list .rt span {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        font-family: "PingFang SC";
-        font-weight: normal;
-        font-size: 12px;
-        text-align: left;
-        color: #909090;
-    }
-
-    .list .rt em {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        font-family: "PingFang SC";
-        font-weight: normal;
-        font-size: 16px;
-        padding-right: 1px;
-        margin-top: 5px;
-        float: right;
-        text-align: right;
-    }
-
-    .list .rt em.green {
-        color: #37cb00;
-    }
-
-    .list .rt em.red {
-        color: #F8847F;
-    }
-    .red {
-        color: #F8847F;
-    }
-
-    @media only screen and (max-width: 640px) {
-
-    }
-
-    @media only screen and (max-width: 480px) {
-
-    }
-
-    @media only screen and (max-width: 375px) {
-
-    }
-
-    @media only screen and (max-width: 360px) {
-
-    }
-
-    @media only screen and (max-width: 320px) {
-            .list .rt {
-                width: 52%;
-            }
-        .list .rt em {
-            font-size: 14px;
-        }
-    }
-
-    @media only screen and (min-width: 641px) {
-
-    }
+#mainPage {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  background: #f2f2f2;
+}
+
+.goPage {
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  background: #fff;
+  height: 50px;
+  line-height: 50px;
+  padding: 0 20px;
+  color: #333;
+  font-size: 18px;
+  border-bottom: 1px solid #f2f2f2;
+}
+
+.goPage span {
+  float: left;
+}
+
+.goPage i {
+  float: right;
+  margin-top: 12px;
+}
+
+.goPage img {
+  overflow: hidden;
+  display: block;
+  width: 8px;
+  height: 14px;
+  float: right;
+  margin-top: 16px;
+  margin-right: 10px;
+}
+
+.goTitle i {
+  margin-top: 10px;
+  float: right;
+}
+
+.mapContainer {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  max-height: 317px;
+}
+
+.shopNum {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  font-family: "PingFang SC";
+  font-weight: 300;
+  font-size: 14px;
+  color: #909090;
+  text-align: center;
+}
+
+.list {
+  width: 94%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  padding-left: 3%;
+  padding-right: 3%;
+  margin-top: 10px;
+  padding-bottom: 20px;
+}
+
+.list li {
+  width: 100%;
+  height: 133px;
+  background: transparent;
+  margin-bottom: 20px;
+  border-radius: 13px;
+  background: #fff;
+  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
+  overflow: hidden;
+}
+
+.list img {
+  float: left;
+}
+
+.list .rt {
+  width: 58%;
+  float: left;
+  padding-left: 15px;
+}
+
+.list .rt h5 {
+  font-family: "PingFang SC";
+  font-weight: normal;
+  font-size: 18px;
+  text-align: left;
+  color: #3b3b3b;
+  margin: 0;
+  margin-top: 18px;
+  margin-bottom: 7px;
+}
+
+.list .rt span {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  font-family: "PingFang SC";
+  font-weight: normal;
+  font-size: 12px;
+  text-align: left;
+  color: #909090;
+}
+
+.list .rt em {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  font-family: "PingFang SC";
+  font-weight: normal;
+  font-size: 16px;
+  padding-right: 1px;
+  margin-top: 5px;
+  float: right;
+  text-align: right;
+}
+
+.list .rt em.green {
+  color: #37cb00;
+}
+
+.list .rt em.red {
+  color: #F8847F;
+}
+
+.red {
+  color: #F8847F;
+}
+
+@media only screen and (max-width: 640px) {
+
+}
+
+@media only screen and (max-width: 480px) {
+
+}
+
+@media only screen and (max-width: 375px) {
+
+}
+
+@media only screen and (max-width: 360px) {
+
+}
+
+@media only screen and (max-width: 320px) {
+  .list .rt {
+    width: 52%;
+  }
+
+  .list .rt em {
+    font-size: 14px;
+  }
+}
+
+@media only screen and (min-width: 641px) {
+
+}
 </style>

app/src/page/mine.vue

@@ -32,25 +32,25 @@
       <div class="dataSum">
         <div class="row">
           <em>卡路里（月度）</em>
-          <span>{{ user.CalorieMonth }}</span>
+          <span>{{ ckRs.CleMonth }}</span>
         </div>
       </div>
       <div class="dataSum">
         <div class="row">
           <em>总卡路里</em>
-          <span>{{ user.CalorieTotal }}</span>
+          <span>{{ ckRs.Cle }}</span>
         </div>
       </div>
       <div class="dataSum">
         <div class="row">
           <em>CK（月度）</em>
-          <span>{{ user.CKMonth }}</span>
+          <span>{{ ckRs.CkMonth }}</span>
         </div>
       </div>
       <div class="dataSum">
         <div class="row">
           <em>总CK</em>
-          <span>{{ user.CKTotal }}</span>
+          <span>{{ ckRs.Ck }}</span>
         </div>
       </div>
       <div class="btn_center">
@@ -67,6 +67,7 @@ import bottomTab from '../components/bottomTab'
 import {
   VipUserSelfQuery,
   OrderShopQuery,
+  VipUserCleCkSum,
   testSelect,
   testTable,
 } from '../api/getApiRes.js'
@@ -89,8 +90,10 @@ export default {
         timeLong: '',
       },
       user: {
+        Ck: 0,
         CKMonth: 0,
-        CKTotal: 0,
+        Cle: 0,
+        CleMonth: 0,
         CalorieMonth: 0,
         CalorieTotal: 0,
         ClassFinish: 0,
@@ -101,6 +104,12 @@ export default {
         Phone: '',
         VipType: 0,
       },
+      ckRs:{
+        Ck: 0,
+        CKMonth: 0,
+        Cle: 0,
+        CleMonth: 0,
+      },
       schools: [],
     }
   },
@@ -115,13 +124,12 @@ export default {
       let that = this;
       let param = {
         token: localStorage.token,
-        active: 1
       };
       let postdata = qs.stringify(param);
-      VipUserSelfQuery(postdata).then(res => {
+      VipUserCleCkSum(postdata).then(res => {
         let json = res;
         if (json.Code == 0) {
-          that.user = json.Rs;
+          that.ckRs = json;
         } else {
           that.$toast.message(json.Memo);
         }

app/src/page/record.vue

@@ -5,12 +5,12 @@
             <span class="num">
                 记录共 {{ num }} 条
             </span>
-      <mu-tabs :value.sync="active" color="#F2F2F2" indicator-color="#E75296" center>
+      <mu-tabs :value.sync="active" color="#F2F2F2" indicator-color="#ffffff" center>
         <mu-tab>已预约</mu-tab>
         <mu-tab>预约记录</mu-tab>
         <mu-tab>消费记录</mu-tab>
       </mu-tabs>
-      <div class="whiteCube"></div>
+<!--      <div class="whiteCube"></div>-->
       <ul class="list">
         <mu-load-more @refresh="refresh" :refreshing="refreshing" :loading="loading" @load="load">
           <li v-for="l in list">
@@ -74,6 +74,7 @@
     <!--        <span v-if="scope.row.Status == 2">已取消</span>-->
     <!--        <span v-if="scope.row.Status == 3">预约未到</span>-->
     <!--        <span v-if="scope.row.Status == 4">已完成</span>-->
+    <alert ref="alertPart"></alert>
   </div>
 </template>
 
@@ -87,6 +88,7 @@ import {
   testSelect,
   testTable,
 } from '../api/getApiRes.js'
+import alert from '../components/alert'
 
 let qs = require('qs');
 import Global from '../Global.js'
@@ -115,6 +117,9 @@ export default {
     this.getList();
   },
   methods: {
+    alertInfo(info){
+      this.$refs.alertPart.openSimpleDialog(info);
+    },
     refresh() {
     },
     load() {
@@ -142,14 +147,14 @@ export default {
           OderCancelByVipUser(postdata).then(res => {
             let json = res;
             if (json.Code == 0) {
-              that.Toast('当前课程已取消预约', 'success');
+              that.alertInfo('当前课程已取消预约', 'success');
               that.getList();
             } else {
-              that.Toast(json.Memo + ',错误码：' + json.Code);
+              that.alertInfo(json.Memo + ',错误码：' + json.Code);
             }
           })
         } else {
-          this.$toast.message('点击了取消');
+          this.alertInfo('点击了取消');
         }
       });
     },
@@ -173,7 +178,7 @@ export default {
               that.num = 0
             }
           } else {
-            that.Toast(json.Memo + ',错误码：' + json.Code);
+            that.alertInfo(json.Memo + ',错误码：' + json.Code);
           }
         });
       }
@@ -195,7 +200,7 @@ export default {
             that.num = json.Rs.length;
           }
         } else {
-          that.$toast.message(json.Memo);
+          that.alertInfo(json.Memo);
         }
       })
     },
@@ -251,7 +256,7 @@ export default {
     }
   },
   components: {
-    bottomTab
+    bottomTab,alert
   }
 }
 </script>
@@ -290,7 +295,7 @@ export default {
 /deep/ .mu-tab-wrapper {
   height: 35px;
   line-height: 25px;
-  background: #fff;
+  background: #f4f4f4;
   color: #363636;
   box-shadow: 1px 0px 6px rgba(0, 0, 0, 0.16);
   border-radius: 8px 8px 0px 0px;
@@ -302,9 +307,9 @@ export default {
   height: 35px;
   line-height: 25px;
   border-radius: 8px 8px 0px 0px;
-  background: #E75296;
+  background: #ffffff;
   box-shadow: 1px 0px 6px rgba(0, 0, 0, 0.16);
-  color: #fff;
+  color: #000;
 }
 
 /deep/ .mu-tab-wrapper em {
@@ -323,7 +328,7 @@ export default {
   overflow: hidden;
   display: block;
   margin: 0 auto;
-  padding-top: 6px;
+  padding-top: 0px;
   padding-bottom: 30px;
   background: #f2f2f2;
 }

app/src/router/index.js

@@ -102,7 +102,7 @@ const router = new VueRouter({
 router.beforeEach((to,from,next)=>{
     NProgress.start()
     const isLogin = localStorage.token? true : false;
-    if(to.path == '/login' || to.path == '/register'){//'login'和'register'相当于是路由白名单
+    if(to.path == '/login' ){//'login'和'register'相当于是路由白名单
         next();
     }else{
         //如果token存在，就正常跳转，如果不存在，则说明未登陆，则跳转到'login'

pc/src/Global.js

@@ -311,6 +311,7 @@ turnResToOptionByUsers = function (data) {
 }
 
 turnClassResToOption = function (data) {
+    if (data == null) return false
     if (!data) return false
     let ids = data.map(item => {
         return {

pc/src/api/Navs.js

@@ -1,140 +1,140 @@
 let navs = [
-{
-    "clmid": "1",
-    "clmcode": "index",
-    "clmname": "系统首页",
-    "clmurl": "/",
-    "prname": "",
-    "show": 3,
-    "grouplist": "2,5",
-    "icon": "el-icon-house",
-}, {
-    "clmid": "2",
-    "clmcode": "member",
-    "clmname": "会员管理",
-    "clmurl": "/member",
-    "prname": "",
-    "show": 3,
-    "grouplist": "2,5",
-    "icon": "el-icon-user",
-}, {
-    "clmid": "3",
-    "clmcode": "lesson",
-    "clmname": "课程管理",
-    "clmurl": "/lesson",
-    "prname": "",
-    "show": 3,
-    "grouplist": "2,5",
-    "icon": "el-icon-collection",
-}, {
-    "clmid": "4",
-    "clmcode": "lessonTable",
-    "clmname": "课程表模板",
-    "clmurl": "/lessonTable",
-    "prname": "",
-    "show": 3,
-    "grouplist": "2,5",
-    "icon": "el-icon-tickets",
-}, {
-    "clmid": "5",
-    "clmcode": "lessonManage",
-    "clmname": "课程表管理",
-    "clmurl": "/lessonManage",
-    "prname": "",
-    "show": 3,
-    "grouplist": "2,5",
-    "icon": "el-icon-date",
-}, {
-    "clmid": "6",
-    "clmcode": "coach",
-    "clmname": "教练管理",
-    "clmurl": "/coach",
-    "prname": "",
-    "show": 999,
-    "grouplist": "2,5",
-    "icon": "el-icon-medal-1",
-}, {
-    "clmid": "7",
-    "clmcode": "appoint",
-    "clmname": "预约管理",
-    "clmurl": "/appoint",
-    "prname": "",
-    "show": 3,
-    "grouplist": "2,5",
-    "icon": "el-icon-time",
-}, {
-    "clmid": "8",
-    "clmcode": "record",
-    "clmname": "预约记录",
-    "clmurl": "/record",
-    "prname": "",
-    "show": 3,
-    "grouplist": "2,5",
-    "icon": "el-icon-document-copy",
-}, {
-    "clmid": "9",
-    "clmcode": "cost",
-    "clmname": "消费记录",
-    "clmurl": "/cost",
-    "prname": "",
-    "show": 3,
-    "grouplist": "2,5",
-    "icon": "el-icon-bank-card",
-}, {
-    "clmid": "10",
-    "clmcode": "finish",
-    "clmname": "下课管理",
-    "clmurl": "/finish",
-    "prname": "",
-    "show": 3,
-    "grouplist": "2,5",
-    "icon": "el-icon-bell",
-}, {
-    "clmid": "11",
-    "clmcode": "setting",
-    "clmname": "系统设置",
-    "clmurl": "/setting",
-    "prname": "",
-    "show": 3,
-    "grouplist": "2,5",
-    "icon": "el-icon-setting",
-}, {
-    "clmid": "12",
-    "clmcode": "adminManage",
-    "clmname": "管理员管理",
-    "clmurl": "/adminManage",
-    "prname": "",
-    "show": 2,
-    "grouplist": "2,5",
-    "icon": "el-icon-user",
-}, {
-    "clmid": "13",
-    "clmcode": "shop",
-    "clmname": "店面管理",
-    "clmurl": "/shopManage",
-    "prname": "",
-    "show": 2,
-    "grouplist": "2,5",
-    "icon": "el-icon-s-shop",
-}, {
-    "clmid": "14",
-    "clmcode": "log",
-    "clmname": "操作日志",
-    "clmurl": "/log",
-    "prname": "",
-    "show": 2,
-    "grouplist": "2,5",
-    "icon": "el-icon-s-claim",
-}, {
-    "clmid": "15",
-    "clmcode": "setting",
-    "clmname": "系统设置",
-    "clmurl": "/adminSetting",
-    "prname": "",
-    "show": 2,
-    "grouplist": "2,5",
-    "icon": "el-icon-setting",
-},
+    {
+        "clmid": "1",
+        "clmcode": "index",
+        "clmname": "系统首页",
+        "clmurl": "/",
+        "prname": "",
+        "show": 3,
+        "grouplist": "2,5",
+        "icon": "el-icon-house",
+    }, {
+        "clmid": "2",
+        "clmcode": "member",
+        "clmname": "会员管理",
+        "clmurl": "/member",
+        "prname": "",
+        "show": 3,
+        "grouplist": "2,5",
+        "icon": "el-icon-user",
+    }, {
+        "clmid": "3",
+        "clmcode": "lesson",
+        "clmname": "课程管理",
+        "clmurl": "/lesson",
+        "prname": "",
+        "show": 3,
+        "grouplist": "2,5",
+        "icon": "el-icon-collection",
+    }, {
+        "clmid": "4",
+        "clmcode": "lessonTable",
+        "clmname": "课程表模板",
+        "clmurl": "/lessonTable",
+        "prname": "",
+        "show": 3,
+        "grouplist": "2,5",
+        "icon": "el-icon-tickets",
+    }, {
+        "clmid": "5",
+        "clmcode": "lessonManage",
+        "clmname": "课程表管理",
+        "clmurl": "/lessonManage",
+        "prname": "",
+        "show": 3,
+        "grouplist": "2,5",
+        "icon": "el-icon-date",
+    }, {
+        "clmid": "6",
+        "clmcode": "coach",
+        "clmname": "教练管理",
+        "clmurl": "/coach",
+        "prname": "",
+        "show": 999,
+        "grouplist": "2,5",
+        "icon": "el-icon-medal-1",
+    }, {
+        "clmid": "7",
+        "clmcode": "appoint",
+        "clmname": "预约管理",
+        "clmurl": "/appoint",
+        "prname": "",
+        "show": 3,
+        "grouplist": "2,5",
+        "icon": "el-icon-time",
+    }, {
+        "clmid": "8",
+        "clmcode": "record",
+        "clmname": "预约记录",
+        "clmurl": "/record",
+        "prname": "",
+        "show": 3,
+        "grouplist": "2,5",
+        "icon": "el-icon-document-copy",
+    }, {
+        "clmid": "9",
+        "clmcode": "cost",
+        "clmname": "消费记录",
+        "clmurl": "/cost",
+        "prname": "",
+        "show": 3,
+        "grouplist": "2,5",
+        "icon": "el-icon-bank-card",
+    }, {
+        "clmid": "10",
+        "clmcode": "finish",
+        "clmname": "下课管理",
+        "clmurl": "/finish",
+        "prname": "",
+        "show": 3,
+        "grouplist": "2,5",
+        "icon": "el-icon-bell",
+    }, {
+        "clmid": "11",
+        "clmcode": "setting",
+        "clmname": "系统设置",
+        "clmurl": "/setting",
+        "prname": "",
+        "show": 3,
+        "grouplist": "2,5",
+        "icon": "el-icon-setting",
+    }, {
+        "clmid": "12",
+        "clmcode": "shop",
+        "clmname": "店面管理",
+        "clmurl": "/shopManage",
+        "prname": "",
+        "show": 2,
+        "grouplist": "2,5",
+        "icon": "el-icon-s-shop",
+    }, {
+        "clmid": "13",
+        "clmcode": "adminManage",
+        "clmname": "管理员管理",
+        "clmurl": "/adminManage",
+        "prname": "",
+        "show": 2,
+        "grouplist": "2,5",
+        "icon": "el-icon-user",
+    }, {
+        "clmid": "14",
+        "clmcode": "log",
+        "clmname": "操作日志",
+        "clmurl": "/log",
+        "prname": "",
+        "show": 2,
+        "grouplist": "2,5",
+        "icon": "el-icon-s-claim",
+    }, {
+        "clmid": "15",
+        "clmcode": "setting",
+        "clmname": "系统设置",
+        "clmurl": "/adminSetting",
+        "prname": "",
+        "show": 2,
+        "grouplist": "2,5",
+        "icon": "el-icon-setting",
+    },
     {
         "clmid": "1",
         "clmcode": "index",
@@ -153,7 +153,7 @@ let navs = [
         "show": 4,
         "grouplist": "2,5",
         "icon": "el-icon-user",
-    },{
+    }, {
         "clmid": "3",
         "clmcode": "lesson",
         "clmname": "课程管理",
@@ -162,7 +162,7 @@ let navs = [
         "show": 4,
         "grouplist": "2,5",
         "icon": "el-icon-collection",
-    },  {
+    }, {
         "clmid": "5",
         "clmcode": "lessonManage",
         "clmname": "课程表管理",

pc/src/assets/css/panel.css

@@ -30,7 +30,7 @@
     padding: 5px;
 }
 
-.panel  /deep/  h5 {
+.panel /deep/ h5 {
     margin: 0;
     text-align: left;
     font-size: 18px;
@@ -84,7 +84,7 @@
     background-color: #fff;
     margin-top: 0px;
     margin-bottom: 10px;
-    padding: 0!important;
+    padding: 0 !important;
 }
 
 .panel /deep/ .el-input {
@@ -278,36 +278,46 @@
     margin: 0 auto;
     margin-bottom: 10px;
 }
-/deep/.el-select .el-input .el-select__caret {
-    line-height: 20px!important;
-}
- .el-table--border th, .el-table__fixed-right-patch {
-    background-color: #F0F2F5!important;
-}
- .panel /deep/ .el-col-4 {
-     padding-left: 3px!important;
-     padding-right: 3px!important;
- }
- .panel /deep/ .el-input__icon {
-     line-height: 20px;
- }
-  .el-transfer__buttons {
-     /*width: 66px;*/
- }
-.el-transfer .el-button+.el-button {
+
+/deep/ .el-select .el-input .el-select__caret {
+    line-height: 20px !important;
+}
+
+.el-table--border th, .el-table__fixed-right-patch {
+    background-color: #F0F2F5 !important;
+}
+
+.panel /deep/ .el-col-4 {
+    padding-left: 3px !important;
+    padding-right: 3px !important;
+}
+
+.panel /deep/ .el-input__icon {
+    line-height: 20px;
+}
+
+.el-transfer__buttons {
+    /*width: 66px;*/
+}
+
+.el-transfer .el-button + .el-button {
     /*margin-left: 0;*/
 }
+
 /deep/ .el-checkbox {
     margin-right: 0;
 }
- .el-transfer-panel__item.el-checkbox .el-checkbox__label {
+
+.el-transfer-panel__item.el-checkbox .el-checkbox__label {
     text-align: left;
     float: left;
-     text-indent: 20px;
+    text-indent: 20px;
+}
+
+.el-transfer__buttons button {
+    /*float: right;*/
 }
- .el-transfer__buttons button {
-     /*float: right;*/
- }
+
 .el-dialog__body {
     padding-top: 4px;
 }
@@ -316,20 +326,59 @@
 .el-color-picker__trigger {
     border-radius: 250px;
 }
+
 .el-color-picker__color-inner {
     border-radius: 250px;
 }
+
 .el-color-picker__color {
     border-radius: 250px;
 }
+
 .el-tabs__item.is-active {
     color: #fff;
     background: #409EFF;
 }
+
 /*隐藏调色盘*/
 .el-color-dropdown__main-wrapper {
-    display: none!important;
+    display: none !important;
 }
+
 /deep/ .el-color-dropdown__main-wrapper {
-    display: none!important;
+    display: none !important;
+}
+
+/* 处理input type = number的上下箭头*/
+input::-webkit-outer-spin-button,
+input::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+}
+
+input[type="number"] {
+    -moz-appearance: textfield;
+}
+/*ipad only*/
+@media only screen and (max-width: 1366px) {
+    .panel .panel_control em {
+        font-size: 12px;
+        width: 60px;
+    }
+    .panel /deep/ .el-input__inner {
+        /*width: 130px;*/
+    }
+    .panel /deep/ .el-date-editor--daterange {
+        width: 100%;
+    }
+    .panel /deep/ .el-date-editor .el-range-separator {
+        width: 20px;
+        padding: 0;
+    }
+    .panel /deep/ .el-input__inner {
+        padding-right:3px
+    }
+    .panel .el-date-editor .el-range-input {
+        width: 44%;
+    }
 }
+

pc/src/components/Navside.vue

@@ -1,249 +1,282 @@
 <template>
-    <div class="Navside">
-        <div class="logoContainer">
-            <img src="../assets/img/nav/logo.png" height="40" width="180"/>
-        </div>
-        <div class="userContainer">
-            <img src="../assets/img/nav/head.png" height="51" width="51"/>
-            <span>{{ShopName}}</span>
-            <em>{{userLevelText}}</em>
-        </div>
-        <el-row :class="[{'shortnav':isCollapse},{'longNav':!isCollapse}]">
-            <el-col :span="24">
-                <el-menu
-                        :default-active="userLevelDeafult"
-                        class="el-menu-vertical-demo"
-                        @open="handleOpen"
-                        @close="handleClose"
-                        @select="handleSelect"
-                        background-color="#ffffff"
-                        text-color="#777777"
-                        active-text-color="#fff"
-                        router
-                >
-                    <el-menu-item :index="nav.clmid" :route="nav.clmurl" v-for="nav in navs"
-                                  v-if="nav.show == userLevel">
-                        <i :class="nav.icon"></i>
-                        <span slot="title">{{nav.clmname}}</span>
-                    </el-menu-item>
-                </el-menu>
-            </el-col>
-        </el-row>
+  <div class="Navside">
+    <div class="logoContainer">
+      <img src="../assets/img/nav/logo.png" height="40" width="180"/>
     </div>
+    <div class="userContainer">
+      <img src="../assets/img/nav/head.png" height="51" width="51"/>
+      <span>{{ ShopName }}</span>
+      <em>{{ userLevelText }}</em>
+    </div>
+    <el-row :class="[{'shortnav':isCollapse},{'longNav':!isCollapse}]">
+      <el-col :span="24">
+        <el-menu
+            :default-active="userLevelDeafult"
+            class="el-menu-vertical-demo"
+            @open="handleOpen"
+            @close="handleClose"
+            @select="handleSelect"
+            background-color="#ffffff"
+            text-color="#777777"
+            active-text-color="#fff"
+            router
+            :collapse="isCollapse"
+        >
+          <el-menu-item :index="nav.clmid" :route="nav.clmurl" v-for="nav in navs"
+                        v-if="nav.show == userLevel">
+            <i :class="nav.icon"></i>
+            <span slot="title">{{ nav.clmname }}</span>
+          </el-menu-item>
+        </el-menu>
+      </el-col>
+    </el-row>
+  </div>
 </template>
 <script>
-    import Navs from '../api/Navs';
-    import {
-        ManagerSelfQuery,
-        ShopListQuery
-    } from '../api/getApiRes.js'
-
-    let qs = require('qs');
-    export default {
-        data() {
-            return {
-                wildState: 0,
-                navs: [],
-                ShopName: '',
-                userLevelText: '',
-                userLevel: 0,
-                userLevelDeafult: "",
-            }
-        },
-        props: ['isCollapse'],
-        mounted() {
-            this.userLevelDeafult = this.$route.meta.clmid;
-            this.getTableQuery();
-            this.getManagerSelfQuery();
-
-        },
-        methods: {
-            handleSelect(i, s, t) {
-                // this.$emit('TabsAdd', i);//触发事件
-            },
-            getTableQuery() {
-                // 菜单
-                this.navs = Navs;
-            },
-            getManagerSelfQuery() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                };
-                let postdata = qs.stringify(param);
-                ManagerSelfQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.userLevelText = json.Rs.Role.Name;
-                        // 1 会员 2 系统 3 店铺 4 教练
-                        switch (parseInt(json.Rs.Role.Id)) {
-                            case 1:
-                                that.userLevel = 1;
-                                break;
-                            case 2:
-                                that.userLevel = 2;
-                                break;
-                            case 3:
-                                that.userLevel = 3;
-                                break;
-                            case 4:
-                                that.userLevel = 4;
-                                break;
-                        }
-                        localStorage.shopId = json.Rs.ShopId;
-                        this.panelSelect(json.Rs.ShopId);
-                    } else {
-                        if(json.Code == 1010){
-                            that.$message.error(json.Memo);
-                            that.$router.push({path: '/login', query: {status: 1}});
-                            return false
-                        }else{
-                            that.$message.error(json.Memo);
-                        }
-                    }
-                })
-            },
-            // 获取所属店铺
-            panelSelect(ShopId) {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                };
-                let postdata = qs.stringify(param);
-                ShopListQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        json.Rs.map(function (item) {
-                            if (item.ShopID == ShopId) {
-                                that.ShopName = item.ShopName;
-                            }
-                        })
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            handleOpen(key, keyPath) {
-                // console.log(key, keyPath);
-            },
-            handleClose(key, keyPath) {
-                // console.log(key, keyPath);
-            },
-        },
-        watch: {
-            $route(to, from) {
-                this.userLevelDeafult = to.meta.clmid
-            },
-        },
+import Navs from '../api/Navs';
+import {
+  ManagerSelfQuery,
+  ShopListQuery
+} from '../api/getApiRes.js'
+
+let qs = require('qs');
+export default {
+  data() {
+    return {
+      wildState: 0,
+      navs: [],
+      ShopName: '',
+      userLevelText: '',
+      userLevel: 0,
+      userLevelDeafult: "",
     }
+  },
+  props: ['isCollapse'],
+  mounted() {
+    this.userLevelDeafult = this.$route.meta.clmid;
+    this.getTableQuery();
+    this.getManagerSelfQuery();
+
+  },
+  methods: {
+    handleSelect(i, s, t) {
+      // this.$emit('TabsAdd', i);//触发事件
+    },
+    getTableQuery() {
+      // 菜单
+      this.navs = Navs;
+    },
+    getManagerSelfQuery() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+      };
+      let postdata = qs.stringify(param);
+      ManagerSelfQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.userLevelText = json.Rs.Role.Name;
+          // 1 会员 2 系统 3 店铺 4 教练
+          switch (parseInt(json.Rs.Role.Id)) {
+            case 1:
+              that.userLevel = 1;
+              break;
+            case 2:
+              that.userLevel = 2;
+              break;
+            case 3:
+              that.userLevel = 3;
+              break;
+            case 4:
+              that.userLevel = 4;
+              break;
+          }
+          localStorage.shopId = json.Rs.ShopId;
+          this.panelSelect(json.Rs.ShopId);
+        } else {
+          if (json.Code == 1010) {
+            that.$message.error(json.Memo);
+            that.$router.push({path: '/login', query: {status: 1}});
+            return false
+          } else {
+            that.$message.error(json.Memo);
+          }
+        }
+      })
+    },
+    // 获取所属店铺
+    panelSelect(ShopId) {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+      };
+      let postdata = qs.stringify(param);
+      ShopListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          json.Rs.map(function (item) {
+            if (item.ShopID == ShopId) {
+              that.ShopName = item.ShopName;
+            }
+          })
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    handleOpen(key, keyPath) {
+      // console.log(key, keyPath);
+    },
+    handleClose(key, keyPath) {
+      // console.log(key, keyPath);
+    },
+  },
+  watch: {
+    $route(to, from) {
+      this.userLevelDeafult = to.meta.clmid
+    },
+  },
+}
 </script>
 <style scoped>
-    /*注释*/
-    .Navside {
-        width: 100%;
-        height: 910px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        /*overflow-y: scroll;*/
-        overflow-y: hidden;
-        background-color: #fff;
-        z-index: 4444;
-    }
+/*注释*/
+.Navside {
+  width: 100%;
+  height: 910px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  /*overflow-y: scroll;*/
+  overflow-y: hidden;
+  background-color: #fff;
+  z-index: 4444;
+}
 
-    .logoContainer {
-        width: 256px;
-        height: 72px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        background: #3799FF;
-    }
+.logoContainer {
+  width: 256px;
+  height: 72px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  background: #3799FF;
+}
 
-    .logoContainer img {
-        width: 100%;
-        height: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-top: 1px;
-    }
+.logoContainer img {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-top: 1px;
+}
 
-    .userContainer {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-bottom: 16px;
-        padding-top: 19px;
-        padding-bottom: 19px;
-        border-bottom: 1px solid #F0F2F5;
-        background: #fff;
-    }
+.userContainer {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-bottom: 16px;
+  padding-top: 19px;
+  padding-bottom: 19px;
+  border-bottom: 1px solid #F0F2F5;
+  background: #fff;
+}
 
-    .userContainer img {
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-bottom: 16px;
-    }
+.userContainer img {
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-bottom: 16px;
+}
 
-    .userContainer span {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        color: #565656;
-        font-size: 16px;
-    }
+.userContainer span {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  color: #565656;
+  font-size: 16px;
+}
 
-    .userContainer em {
-        width: 125px;
-        height: 26px;
-        line-height: 26px;
-        text-align: center;
-        color: #fff;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        background: #E75296;
-        border-radius: 250px;
-        font-style: normal;
-        margin-top: 8px;
-    }
+.userContainer em {
+  width: 125px;
+  height: 26px;
+  line-height: 26px;
+  text-align: center;
+  color: #fff;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  background: #E75296;
+  border-radius: 250px;
+  font-style: normal;
+  margin-top: 8px;
+}
 
-    /deep/ .el-menu {
-        border: none;
-    }
+/deep/ .el-menu {
+  border: none;
+}
 
-    /deep/ .el-menu-item {
-    }
+/deep/ .el-menu-item {
+}
 
-    /deep/ .el-menu-item span {
-        text-align: left;
-        float: left;
-        margin-left: 70px;
-    }
+/deep/ .el-menu-item span {
+  text-align: left;
+  float: left;
+  margin-left: 70px;
+}
 
-    /deep/ .el-menu-item.is-active {
-        background-color: #3799FF !important;
-        color: #fff !important;
-    }
+/deep/ .el-menu-item.is-active {
+  background-color: #3799FF !important;
+  color: #fff !important;
+}
 
-    /deep/ .el-menu-item:hover {
-        background-color: #3799FF !important;
-        color: #fff !important;
-    }
+/deep/ .el-menu-item:hover {
+  background-color: #3799FF !important;
+  color: #fff !important;
+}
 
-    /deep/ .el-menu-item:hover i {
-        color: #fff !important;
-    }
+/deep/ .el-menu-item:hover i {
+  color: #fff !important;
+}
 
-    /deep/ .el-menu-item i {
-        position: relative;
-        float: left;
-        line-height: 55px;
-        left: 60px;
-    }
+/deep/ .el-menu-item i {
+  position: relative;
+  float: left;
+  line-height: 55px;
+  left: 60px;
+}
+
+/*ipad only*/
+@media only screen and (max-width: 1366px) {
+  .userContainer em {
+    width: 100%;
+    overflow: hidden;
+    display: block;
+    margin: 0 auto;
+    font-size: 12px;
+  }
+
+  .el-menu-item {
+    padding: 0 !important;
+    margin: 0;
+  }
 
+  .el-menu-item i {
+    left: 20px;
+    padding: 0;
+    margin: 0;
+    float: left;
+    line-height: 40px;
+  }
+  /deep/ .el-tooltip {
+    padding: 0!important;
+  }
+  .userContainer span {
+    font-size: 12px;
+  }
+  .el-menu-item, .el-submenu__title {
+    height: 40px;
+  }
+}
 </style>

pc/src/router/index.js

@@ -74,7 +74,7 @@ const routes = [
                 component: () => import('@/views/AdminManage.vue'),
                 meta: {
                     title: "管理员管理",
-                    clmid: "12",
+                    clmid: "13",
                 }
             },{
                 path: '/log',
@@ -90,7 +90,7 @@ const routes = [
                 component: () => import('@/views/ShopManage.vue'),
                 meta: {
                     title: "店面管理",
-                    clmid: "13",
+                    clmid: "12",
                 }
             },{
                 path: '/adminSetting',

pc/src/views/AdminManage.vue

@@ -1,752 +1,787 @@
 <template>
-    <div class="context">
-        <div class="panel">
-            <h5>管理员管理</h5>
-            <div class="panel-body">
-                <div class="panel_control">
-                    <el-row :gutter="20">
-                        <el-col :span="4">
-                            <em>姓名:</em>
-                            <el-input v-model="panel.name" placeholder="请输入用户名"></el-input>
-                        </el-col>
-                        <el-col :span="4">
-                            <em>手机号:</em>
-                            <el-input v-model="panel.phone" placeholder="请输入手机号"></el-input>
-                        </el-col>
-                        <el-col :span="4">
-                            <em>店面:</em>
-                            <el-select v-model="panel.shopId">
-                                <el-option
-                                        v-for="item in panel.options"
-                                        :key="item.value"
-                                        :label="item.label"
-                                        :value="item.value">
-                                </el-option>
-                            </el-select>
-                        </el-col>
-                        <el-col :span="4">
-                            <em>类型:</em>
-                            <el-select v-model="panel.adminType">
-                                <el-option
-                                        v-for="item in panel.typeList"
-                                        :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-row>
-                </div>
-            </div>
+  <div class="context">
+    <div class="panel">
+      <h5>管理员管理</h5>
+      <div class="panel-body">
+        <div class="panel_control">
+          <el-row :gutter="20">
+            <el-col :span="4">
+              <em>姓名:</em>
+              <el-input v-model="panel.name" placeholder="请输入用户名"></el-input>
+            </el-col>
+            <el-col :span="4">
+              <em>手机号:</em>
+              <el-input v-model="panel.phone" placeholder="请输入手机号" type="number" ></el-input>
+            </el-col>
+            <el-col :span="4">
+              <em>店面:</em>
+              <el-select v-model="panel.shopId">
+                <el-option
+                    v-for="item in panel.options"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value">
+                </el-option>
+              </el-select>
+            </el-col>
+            <el-col :span="4">
+              <em>类型:</em>
+              <el-select v-model="panel.adminType">
+                <el-option
+                    v-for="item in panel.typeList"
+                    :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 :disabled="serachBtnStatus">查询</el-button>
+            </el-col>
+          </el-row>
         </div>
-        <div class="change">
-            <el-button @click="addAdmin">新增</el-button>
-            <el-button @click="editList">编辑</el-button>
-            <el-button @click="delList">删除</el-button>
-        </div>
-        <div class="table">
-            <el-table
-                    :data="tableData"
-                    border
-                    is-horizontal-resize
-                    :default-sort="{prop: 'date', order: 'descending'}"
-                    element-loading-background="rgba(0, 0, 0, 0.8)"
-                    class=""
-                    @selection-change="handleSelectionChange" @current-change="clickChange"
-            > @current-change="clickChange"
-                >
-                @current-change="clickChange"
-                >
-                <el-table-column label="选择" width="55">
-                    <template slot-scope="scope">
-                        <el-radio v-model="tableRadio" :label="scope.row"><i></i></el-radio>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        type="index"
-                        label="序号"
-                        align="center"
+      </div>
+    </div>
+    <div class="change">
+      <el-button @click="addAdmin"type="primary">新增</el-button>
+      <el-button @click="editList">编辑</el-button>
+      <el-button @click="delList">删除</el-button>
+    </div>
+    <div class="table">
+      <el-table
+          :data="tableData"
+          border
+          is-horizontal-resize
+          :default-sort="{prop: 'date', order: 'descending'}"
+          element-loading-background="rgba(0, 0, 0, 0.8)"
+          class=""
+          @selection-change="handleSelectionChange" @current-change="clickChange"
+      > @current-change="clickChange"
+        >
+        @current-change="clickChange"
+        >
+        <el-table-column label="选择" width="55">
+          <template slot-scope="scope">
+            <el-radio v-model="tableRadio" :label="scope.row"><i></i></el-radio>
+          </template>
+        </el-table-column>
+        <el-table-column
+            type="index"
+            label="序号"
+            align="center"
 
-                        width="50">
-                </el-table-column>
-                <el-table-column
-                        prop="Usercode"
-                        label="用户名"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="Name"
-                        label="姓名"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="Phone"
-                        label="手机号"
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="AdminType "
-                        label="角色"
-                >
-                    <template slot-scope="scope">
-                        <!--                        // 1 会员 2 系统 3 店铺 4 教练-->
-                        <span v-if="scope.row.AdminType  == 1" style="color: #005EA2">会员</span>
-                        <span v-if="scope.row.AdminType  == 2" style="color: green">系统管理员</span>
-                        <span v-if="scope.row.AdminType  == 3" style="color: #8c939d">店铺管理员</span>
-                        <span v-if="scope.row.AdminType  == 4">教练</span>
-                    </template>
-                </el-table-column>
+            width="50">
+        </el-table-column>
+        <el-table-column
+            prop="Usercode"
+            label="用户名"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="Name"
+            label="姓名"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="Phone"
+            label="手机号"
+        >
+        </el-table-column>
+        <el-table-column
+            prop="AdminType "
+            label="角色"
+        >
+          <template slot-scope="scope">
+            <!--                        // 1 会员 2 系统 3 店铺 4 教练-->
+            <span v-if="scope.row.AdminType  == 1" style="color: #005EA2">会员</span>
+            <span v-if="scope.row.AdminType  == 2" style="color: green">系统管理员</span>
+            <span v-if="scope.row.AdminType  == 3" style="color: #8c939d">店铺管理员</span>
+            <span v-if="scope.row.AdminType  == 4">教练</span>
+          </template>
+        </el-table-column>
 
-                <el-table-column
-                        prop="ShopName"
-                        label="所属门店"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="LastLoginTime"
-                        label="上次登陆时间"
-                        :formatter="filterFmtDate"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="Memo"
-                        label="备注"
-                        sortable
-                >
-                    <template slot-scope="scope">
-                        <el-popover
-                                placement="top"
-                                title="备注"
-                                width="200"
-                                trigger="hover"
-                                :content="scope.row.Memo">
+        <el-table-column
+            prop="ShopName"
+            label="所属门店"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="LastLoginTime"
+            label="上次登陆时间"
+            :formatter="filterFmtDate"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="Memo"
+            label="备注"
+            sortable
+        >
+          <template slot-scope="scope">
+            <el-popover
+                placement="top"
+                title="备注"
+                width="200"
+                trigger="hover"
+                :content="scope.row.Memo">
                             <span slot="reference"
-                                  v-if="scope.row.Memo.length > 10">{{scope.row.Memo.substr(0,10)}} ....</span>
-                        </el-popover>
-                        <span v-if="scope.row.Memo.length <= 10">{{scope.row.Memo}}</span>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="Status"
-                        label="操作"
-                >
-                    <template slot-scope="scope">
-                        <el-button type="danger" size="mini" v-if="scope.row.Status == 1"
-                                   @click="runAndPause(scope.row,8)">禁用
-                        </el-button>
-                        <el-button type="success" size="mini" v-if="scope.row.Status == 8"
-                                   @click="runAndPause(scope.row,1)">启用
-                        </el-button>
-                    </template>
-                </el-table-column>
-            </el-table>
-            <br>
-            <el-pagination
-                    background
-                    :total="pageination.total"
-                    :page-size="pageination.pageItem"
-                    @current-change="pageChange"
-            ></el-pagination>
-        </div>
-
-        <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="650px">
-            <div>
-                <el-form ref="form" :model="form" label-width="80px">
-                    <el-form-item label="登陆账号">
-                        <el-input v-model="form.userCode"></el-input>
-                    </el-form-item>
-                    <el-form-item label="密码">
-                        <el-input v-model="form.password" type="password"></el-input>
-                    </el-form-item>
-                    <el-form-item label="姓名">
-                        <el-input v-model="form.name"></el-input>
-                    </el-form-item>
-                    <el-form-item label="手机号">
-                        <el-input v-model="form.phone"></el-input>
-                    </el-form-item>
-                    <el-form-item label="所属门店">
-                        <el-select v-model="form.shopId" placeholder="请选择所属门店">
-                            <el-option
-                                    v-for="item in shops"
-                                    :key="item.value"
-                                    :label="item.label"
-                                    :value="item.value"
-                            ></el-option>
-                        </el-select>
-                    </el-form-item>
-                    <el-form-item label="用户角色">
-                        <el-select v-model="form.adminType " placeholder="请选择用户角色">
-                            <el-option
-                                    v-for="item in form.adminTypeList"
-                                    :key="item.value"
-                                    :label="item.label"
-                                    :value="item.value"
-                            ></el-option>
-                        </el-select>
-                    </el-form-item>
-                    <el-form-item label="备注">
-                        <el-input v-model="form.memo"></el-input>
-                    </el-form-item>
-                </el-form>
-            </div>
-            <div class="dialogFooter">
-                <el-button type="primary" size="small" @click="confirmAdmin" v-if="form.btnState == 0">确定</el-button>
-                <el-button type="primary" size="small" @click="confirmEdit" v-if="form.btnState == 1">确定</el-button>
-                <el-button @click="dialogVisible = false" size="small">取消</el-button>
-            </div>
-        </el-dialog>
+                                  v-if="scope.row.Memo.length > 10">{{ scope.row.Memo.substr(0, 10) }} ....</span>
+            </el-popover>
+            <span v-if="scope.row.Memo.length <= 10">{{ scope.row.Memo }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="Status"
+            label="操作"
+        >
+          <template slot-scope="scope">
+            <el-button type="danger" size="mini" v-if="scope.row.Status == 1"
+                       @click="runAndPause(scope.row,8)">禁用
+            </el-button>
+            <el-button type="success" size="mini" v-if="scope.row.Status == 8"
+                       @click="runAndPause(scope.row,1)">启用
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <br>
+      <el-pagination
+          background
+          :total="pageination.total"
+          :page-size="pageination.pageItem"
+          @current-change="pageChange"
+      ></el-pagination>
     </div>
+
+    <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="650px">
+      <div>
+        <el-form ref="form" :model="form" label-width="80px">
+          <el-form-item label="登陆账号">
+            <el-input v-model="form.userCode"></el-input>
+          </el-form-item>
+          <el-form-item label="密码">
+            <el-input v-model="form.password" type="password"></el-input>
+          </el-form-item>
+          <el-form-item label="姓名">
+            <el-input v-model="form.name"></el-input>
+          </el-form-item>
+          <el-form-item label="手机号">
+            <el-input v-model="form.phone"></el-input>
+          </el-form-item>
+          <el-form-item label="所属门店">
+            <el-select v-model="form.shopId" placeholder="请选择所属门店">
+              <el-option
+                  v-for="item in shops"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="用户角色">
+            <el-select v-model="form.adminType " placeholder="请选择用户角色">
+              <el-option
+                  v-for="item in form.adminTypeList"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="备注">
+            <el-input v-model="form.memo"></el-input>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="dialogFooter">
+        <el-button type="primary" size="small" @click="confirmAdmin" v-if="form.btnState == 0">确定</el-button>
+        <el-button type="primary" size="small" @click="confirmEdit" v-if="form.btnState == 1">确定</el-button>
+        <el-button @click="dialogVisible = false" size="small">取消</el-button>
+      </div>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
-    import Global from '../Global.js'
-    import {
-        ShopManagerListQuery,
-        ShopListQuery,
-        ShopManagerAdd,
-        ShopManagerEdit,
-        ShopManagerStatusEdit,
-        testTable,
-        testSelect
-    } from "../api/getApiRes";
+import Global from '../Global.js'
+import {
+  ShopManagerListQuery,
+  ShopListQuery,
+  ShopManagerAdd,
+  ShopManagerEdit,
+  ShopManagerStatusEdit,
+  testTable,
+  testSelect
+} from "../api/getApiRes";
 
-    let qs = require('qs');
-    export default {
-        data() {
-            return {
-                dialogVisible: false,
-                dialogTitle: '新增',
-                // panel 配置项目
-                panel: {
-                    userCode: '',
-                    name: '',
-                    phone: '',
-                    shopId: '',
-                    options: [],
-                    draw: 1,
-                    start: 0,
-                    recordsTotal: 0,
-                    tableData: [],
-                    allTableData: [],
-                    limit: '10',
-                    multipleSort: false,
-                    loading: false,
-                    fileList: [],
-                    multipleSelection: [],
-                    detectedmac: '',
-                    time1: globalBt(),
-                    type: ' ',
-                    adminType: '',
-                    typeList: [
-                        {value: '', label: '全部'},
-                        {value: 3, label: '店铺管理员'},
-                        {value: 4, label: '教练'},
-                    ],
-                },
-                multipleSelection: [],
-                pageination: {
-                    pageItem: 100,
-                    pageoptions: pageOptions(),
-                    total: 100,
-                    pageIndex: 1,
-                },
-                form: {
-                    shopId: '',
-                    userId: '',
-                    userCode: '',
-                    password: '',
-                    name: '',
-                    phone: '',
-                    memo: '',
-                    btnState: 0,
-                    adminType: 3,
-                    adminTypeList: [
-                        {value: 3, label: '店铺管理员'},
-                        {value: 4, label: '教练'},
-                    ],
-                },
-                shops: [],
-                tableData: [],
-                tableRadio: []
-            }
-        },
-        mounted() {
-            this.getTableQuery();
-        },
-        methods: {
-            clickChange(item) {
-                this.tableRadio = item
-            },
-            // 新增 确认提交
-            confirmAdmin() {
-                let that = this;
-                // checkNum
-                if (!that.form.userCode) {
-                    this.$message.error('错了哦，登陆账号不能为空');
-                    return false
-                }
-                if (that.form.name.length > 20) {
-                    this.$message.error('错了哦，登陆账号字数超过20个字');
-                    return false
-                }
-                if (!that.form.password) {
-                    this.$message.error('错了哦，密码不能为空');
-                    return false
-                }
-                if (that.form.password.length < 6) {
-                    this.$message.error('错了哦，密码字数小于6个字');
-                    return false
-                }
-                if (that.form.password.length > 8) {
-                    this.$message.error('错了哦，密码字数超过8个字');
-                    return false
-                }
-                if (!that.form.name) {
-                    this.$message.error('错了哦，姓名不能为空');
-                    return false
-                }
-                if (that.form.name.length > 8) {
-                    this.$message.error('错了哦，姓名字数超过8个字');
-                    return false
-                }
-                if (!that.form.phone) {
-                    this.$message.error('错了哦，手机号码不能为空');
-                    return false
-                }
-                if (!globalCheckPhone(that.form.phone)) {
-                    this.$message.error('错了哦，手机号格式不正确');
-                    return false
-                }
-                if (that.form.memo) {
-                    if (that.form.name.memo > 200) {
-                        this.$message.error('错了哦，备注字数超过200个字');
-                        return false
-                    }
-                }
+let qs = require('qs');
+export default {
+  data() {
+    return {
+      dialogVisible: false,
+      dialogTitle: '新增',
+      // panel 配置项目
+      panel: {
+        userCode: '',
+        name: '',
+        phone: '',
+        shopId: '',
+        options: [],
+        draw: 1,
+        start: 0,
+        recordsTotal: 0,
+        tableData: [],
+        allTableData: [],
+        limit: '10',
+        multipleSort: false,
+        loading: false,
+        fileList: [],
+        multipleSelection: [],
+        detectedmac: '',
+        time1: globalBt(),
+        type: ' ',
+        adminType: '',
+        typeList: [
+          {value: '', label: '全部'},
+          {value: 3, label: '店铺管理员'},
+          {value: 4, label: '教练'},
+        ],
+      },
+      multipleSelection: [],
+      pageination: {
+        pageItem: 100,
+        pageoptions: pageOptions(),
+        total: 100,
+        pageIndex: 1,
+      },
+      form: {
+        shopId: '',
+        userId: '',
+        userCode: '',
+        password: '',
+        name: '',
+        phone: '',
+        memo: '',
+        btnState: 0,
+        adminType: 3,
+        adminTypeList: [
+          {value: 3, label: '店铺管理员'},
+          {value: 4, label: '教练'},
+        ],
+      },
+      shops: [],
+      tableData: [],
+      tableRadio: [],
+      serachBtnStatus: false,
+    }
+  },
+  mounted() {
+    this.getShopListSelect();
+    this.getTableQuery();
+  },
+  methods: {
+    // 获取店面列表
+    getShopListSelect(){
+      let that = this;
+      let param = {
+        token: localStorage.token,
+      };
+      let postdata = qs.stringify(param);
+      ShopListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          if (json.Rs == '') {
+            that.$message.error('当前没有可选的店铺，请先在店面管理中添加店铺!');
+            return false
+          }
+          that.panel.options = turnShopResToOption(json.Rs);
+          that.panel.options.unshift({value: '', label: "全部"});
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    clickChange(item) {
+      this.tableRadio = item
+    },
+    // 新增 确认提交
+    confirmAdmin() {
+      let that = this;
+      // checkNum
+      if (!that.form.userCode) {
+        this.$message.error('错了哦，登陆账号不能为空');
+        return false
+      }
+      if (that.form.name.length > 20) {
+        this.$message.error('错了哦，登陆账号字数超过20个字');
+        return false
+      }
+      if (!that.form.password) {
+        this.$message.error('错了哦，密码不能为空');
+        return false
+      }
+      if (that.form.password.length < 6) {
+        this.$message.error('错了哦，密码字数小于6个字');
+        return false
+      }
+      if (that.form.password.length > 8) {
+        this.$message.error('错了哦，密码字数超过8个字');
+        return false
+      }
+      if (!that.form.name) {
+        this.$message.error('错了哦，姓名不能为空');
+        return false
+      }
+      if (that.form.name.length > 8) {
+        this.$message.error('错了哦，姓名字数超过8个字');
+        return false
+      }
+      if (!that.form.phone) {
+        this.$message.error('错了哦，手机号码不能为空');
+        return false
+      }
+      if (!globalCheckPhone(that.form.phone)) {
+        this.$message.error('错了哦，手机号格式不正确');
+        return false
+      }
+      if (that.form.memo) {
+        if (that.form.name.memo > 200) {
+          this.$message.error('错了哦，备注字数超过200个字');
+          return false
+        }
+      }
 
-                let param = {
-                    token: localStorage.token,
-                    shopId: that.form.shopId,
-                    usercode: that.form.userCode,
-                    password: that.form.password,
-                    name: that.form.name,
-                    phone: that.form.phone,
-                    adminType: that.form.adminType,
-                    memo: that.form.memo,
-                };
-                let postdata = qs.stringify(param);
-                ShopManagerAdd(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogVisible = false;
-                        that.$message({
-                            showClose: true,
-                            message: '管理员添加成功！',
-                            type: 'success'
-                        });
+      let param = {
+        token: localStorage.token,
+        shopId: that.form.shopId,
+        usercode: that.form.userCode,
+        password: that.form.password,
+        name: that.form.name,
+        phone: that.form.phone,
+        adminType: that.form.adminType,
+        memo: that.form.memo,
+      };
+      let postdata = qs.stringify(param);
+      ShopManagerAdd(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogVisible = false;
+          that.$message({
+            showClose: true,
+            message: '管理员添加成功！',
+            type: 'success'
+          });
 
-                        // 重载列表
-                        that.getTableQuery();
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            confirmEdit() {
-                // ShopManagerEdit
-                let that = this;
-                // checkNum
-                if (!that.form.userCode) {
-                    this.$message.error('错了哦，登陆账号不能为空');
-                    return false
-                }
-                if (that.form.name.length > 20) {
-                    this.$message.error('错了哦，登陆账号字数超过20个字');
-                    return false
-                }
+          // 重载列表
+          that.getTableQuery();
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    confirmEdit() {
+      // ShopManagerEdit
+      let that = this;
+      // checkNum
+      if (!that.form.userCode) {
+        this.$message.error('错了哦，登陆账号不能为空');
+        return false
+      }
+      if (that.form.name.length > 20) {
+        this.$message.error('错了哦，登陆账号字数超过20个字');
+        return false
+      }
 
-                // 密码有输入才检测，没输入默认传空不修改
-                if (that.form.password) {
-                    if (that.form.password.length < 6) {
-                        this.$message.error('错了哦，密码字数小于6个字');
-                        return false
-                    }
-                    if (that.form.password.length > 8) {
-                        this.$message.error('错了哦，密码字数超过8个字');
-                        return false
-                    }
-                }
-                if (!that.form.name) {
-                    this.$message.error('错了哦，姓名不能为空');
-                    return false
-                }
-                if (that.form.name.length > 8) {
-                    this.$message.error('错了哦，姓名字数超过8个字');
-                    return false
-                }
-                if (!that.form.phone) {
-                    this.$message.error('错了哦，手机号码不能为空');
-                    return false
-                }
-                if (!globalCheckPhone(that.form.phone)) {
-                    this.$message.error('错了哦，手机号格式不正确');
-                    return false
-                }
-                if (that.form.memo) {
-                    if (that.form.name.memo > 200) {
-                        this.$message.error('错了哦，备注字数超过200个字');
-                        return false
-                    }
-                }
+      // 密码有输入才检测，没输入默认传空不修改
+      if (that.form.password) {
+        if (that.form.password.length < 6) {
+          this.$message.error('错了哦，密码字数小于6个字');
+          return false
+        }
+        if (that.form.password.length > 8) {
+          this.$message.error('错了哦，密码字数超过8个字');
+          return false
+        }
+      }
+      if (!that.form.name) {
+        this.$message.error('错了哦，姓名不能为空');
+        return false
+      }
+      if (that.form.name.length > 8) {
+        this.$message.error('错了哦，姓名字数超过8个字');
+        return false
+      }
+      if (!that.form.phone) {
+        this.$message.error('错了哦，手机号码不能为空');
+        return false
+      }
+      if (!globalCheckPhone(that.form.phone)) {
+        this.$message.error('错了哦，手机号格式不正确');
+        return false
+      }
+      if (that.form.memo) {
+        if (that.form.name.memo > 200) {
+          this.$message.error('错了哦，备注字数超过200个字');
+          return false
+        }
+      }
 
-                let param = {
-                    token: localStorage.token,
-                    userId: that.form.userId,
-                    shopId: that.form.shopId,
-                    usercode: that.form.userCode,
-                    password: that.form.password,
-                    name: that.form.name,
-                    phone: that.form.phone,
-                    memo: that.form.memo,
-                };
-                let postdata = qs.stringify(param);
-                ShopManagerEdit(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogVisible = false;
-                        that.$message({
-                            showClose: true,
-                            message: '管理员信息修改成功！',
-                            type: 'success'
-                        });
+      let param = {
+        token: localStorage.token,
+        userId: that.form.userId,
+        shopId: that.form.shopId,
+        usercode: that.form.userCode,
+        password: that.form.password,
+        name: that.form.name,
+        phone: that.form.phone,
+        memo: that.form.memo,
+      };
+      let postdata = qs.stringify(param);
+      ShopManagerEdit(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogVisible = false;
+          that.$message({
+            showClose: true,
+            message: '管理员信息修改成功！',
+            type: 'success'
+          });
 
-                        // 重载列表
-                        that.getTableQuery();
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 加载选项
-            panelSelect() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                };
-                let postdata = qs.stringify(param);
-                ShopListQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        if (json.Rs == '') {
-                            that.$message.error('当前没有可选的店铺，请先在店面管理中添加店铺!');
-                            return false
-                        }
-                        that.panel.options = turnShopResToOption(json.Rs);
-                        that.shops = turnShopResToOption(json.Rs);
-                        that.form.shopId = json.Rs[0].ShopID;
-                        that.panel.options.unshift({value: '', label: "全部"});
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 删除
-            delList() {
-                let that = this;
-                if (this.tableRadio.length == 0) {
-                    this.$message.error("请先选中一条记录");
-                    return false
-                }
-                let userId = this.tableRadio.Id;
+          // 重载列表
+          that.getTableQuery();
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 加载选项
+    panelSelect() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+      };
+      let postdata = qs.stringify(param);
+      ShopListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          if (json.Rs == '') {
+            that.$message.error('当前没有可选的店铺，请先在店面管理中添加店铺!');
+            return false
+          }
+          that.panel.options = turnShopResToOption(json.Rs);
+          that.shops = turnShopResToOption(json.Rs);
+          that.form.shopId = json.Rs[0].ShopID;
+          that.panel.options.unshift({value: '', label: "全部"});
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 删除
+    delList() {
+      let that = this;
+      if (this.tableRadio.length == 0) {
+        this.$message.error("请先选中一条记录");
+        return false
+      }
+      let userId = this.tableRadio.Id;
 
-                let param = {
-                    token: localStorage.token,
-                    userId: userId,
-                    status: 9,//0禁用1启用9删除
-                };
-                let postdata = qs.stringify(param);
+      let param = {
+        token: localStorage.token,
+        userId: userId,
+        status: 9,//0禁用1启用9删除
+      };
+      let postdata = qs.stringify(param);
 
-                this.$confirm('此操作将永久删除该管理员, 是否继续?', '提示', {
-                    confirmButtonText: '确定',
-                    cancelButtonText: '取消',
-                    type: 'warning'
-                }).then(() => {
-                    ShopManagerStatusEdit(postdata).then(res => {
-                        let json = res;
-                        if (json.Code == 0) {
-                            that.$message({
-                                showClose: true,
-                                message: '选中的管理员已删除！',
-                                type: 'success'
-                            });
-                            // 重载列表
-                            that.getTableQuery();
-                        } else {
-                            that.$message.error(json.Memo);
-                        }
-                    });
-                }).catch(() => {
-                    this.$message({
-                        type: 'info',
-                        message: '已取消删除'
-                    });
-                });
-            },
-            runAndPause(row, status) {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    userId: row.Id,
-                    status: status,
-                };
-                let postdata = qs.stringify(param);
-                ShopManagerStatusEdit(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.$message({
-                            showClose: true,
-                            message: '管理员状态已修改成功！',
-                            type: 'success'
-                        });
-                        // 重载列表
-                        that.getTableQuery();
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            clearForm() {
-                // clear
-                this.form.shopId = 0;
-                this.form.name = '';
-                this.form.userCode = '';
-                this.form.password = '';
-                this.form.phone = '';
-                this.form.memo = '';
-            },
-            // 新增管理员
-            addAdmin() {
-                this.clearForm();
-                // 重载店面列表
-                this.panelSelect();
-                this.dialogVisible = true;
-                this.dialogTitle = '新增';
-                this.form.btnState = 0;
-            },
-            // 编辑管理员
-            editList() {
-                let that = this;
-                this.clearForm();
-                // 重载门店列表
-                this.panelSelect();
-                console.log(this.tableRadio);
-                if (this.tableRadio.length == 0) {
-                    this.$message.error("请先选中一条记录");
-                    return false
-                }
-                let row = this.tableRadio;
-                this.form.shopid = row.ShopId;
-                this.form.userId = row.Id;
-                this.form.name = row.Name;
-                this.form.userCode = row.Usercode;
-                this.form.password = '';
-                this.form.phone = row.Phone;
-                this.form.memo = row.Memo;
-                this.form.adminType = row.AdminType;
-                this.dialogVisible = true;
-                this.dialogTitle = '编辑';
-                this.form.btnState = 1;
-            },
-            handleSelectionChange(val) {
-                this.multipleSelection = val;
-            },
-            // 查询按钮
-            query() {
-                this.getTableQuery();
-                this.$message.success('查询完毕');
-            },
-            // 页面数据查询
-            getTableQuery() {
-                let that = this;
-                that.loading = true;
-                let param = {
-                    token: localStorage.token,
-                    shopId: this.panel.shopId,
-                    name: this.panel.name,
-                    phone: this.panel.phone,
-                    adminType: this.panel.adminType,
-                    start: 1,//
-                    tableMax: 9999,//
-                };
-                let postdata = qs.stringify(param);
-                ShopManagerListQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.loading = false;
-                        if (json.Rs) {
-                            that.allTableData = json.Rs;
-                            that.recordsTotal = json.Rs.length;
-                        } else {
-                            that.allTableData = [];
-                            that.recordsTotal = 0;
-                        }
-                        // 设置分页数据
-                        that.setPaginations();
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 设置分页数据
-            setPaginations() {
-                // 分页属性
-                let that = this;
-                that.pageination.total = that.recordsTotal;
-                // 默认分页
-                that.tableData = that.allTableData.filter((item, index) => {
-                    return index < that.pageination.pageItem;
-                });
-            },
-            // 每页显示数量
-            handleSizeChange() {
-                let that = this;
-                that.tableData = that.allTableData.filter((item, index) => {
-                    return index < that.pageination.pageItem;
-                });
-                that.draw = that.pageination.pageItem;
-                that.getTableQuery();
-            },
-            // 翻页
-            pageChange(pageIndex) {
-                let that = this;
-                // 获取当前页
-                let index = that.pageination.pageItem * (pageIndex - 1);
-                // 数据总数
-                let nums = that.pageination.pageItem * pageIndex;
-                // 容器
-                let tables = [];
-                for (var i = index; i < nums; i++) {
-                    if (that.allTableData[i]) {
-                        tables.push(that.allTableData[i])
-                    }
-                    this.tableData = tables;
-                }
-                that.start = index * that.draw;
-                that.getTableQuery();
-            },
-            // 自动排序
-            sortChange(params) {
-                console.log(params)
-            },
-            // 过滤时间
-            filterFmtDate(value, row, column) {
-                let that = this;
-                return nonTfmtDate(column, 11);
-            },
-            // 过滤金额
-            filterMoney(value, row, column) {
-                let that = this;
-                return parseFloat(column).toFixed(2);
-            },
-        },
-        watch: {
-            $route(to) {
-                if (to.name == 'AdminManage') {
-                    this.getTableQuery();
-                }
-            },
-        },
-    }
+      this.$confirm('此操作将永久删除该管理员, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        ShopManagerStatusEdit(postdata).then(res => {
+          let json = res;
+          if (json.Code == 0) {
+            that.$message({
+              showClose: true,
+              message: '选中的管理员已删除！',
+              type: 'success'
+            });
+            // 重载列表
+            that.getTableQuery();
+          } else {
+            that.$message.error(json.Memo);
+          }
+        });
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除'
+        });
+      });
+    },
+    runAndPause(row, status) {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        userId: row.Id,
+        status: status,
+      };
+      let postdata = qs.stringify(param);
+      ShopManagerStatusEdit(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.$message({
+            showClose: true,
+            message: '管理员状态已修改成功！',
+            type: 'success'
+          });
+          // 重载列表
+          that.getTableQuery();
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    clearForm() {
+      // clear
+      this.form.shopId = 0;
+      this.form.name = '';
+      this.form.userCode = '';
+      this.form.password = '';
+      this.form.phone = '';
+      this.form.memo = '';
+    },
+    // 新增管理员
+    addAdmin() {
+      this.clearForm();
+      // 重载店面列表
+      this.panelSelect();
+      this.dialogVisible = true;
+      this.dialogTitle = '新增';
+      this.form.btnState = 0;
+    },
+    // 编辑管理员
+    editList() {
+      let that = this;
+      this.clearForm();
+      // 重载门店列表
+      this.panelSelect();
+      console.log(this.tableRadio);
+      if (this.tableRadio.length == 0) {
+        this.$message.error("请先选中一条记录");
+        return false
+      }
+      let row = this.tableRadio;
+      this.form.shopid = row.ShopId;
+      this.form.userId = row.Id;
+      this.form.name = row.Name;
+      this.form.userCode = row.Usercode;
+      this.form.password = '';
+      this.form.phone = row.Phone;
+      this.form.memo = row.Memo;
+      this.form.adminType = row.AdminType;
+      this.dialogVisible = true;
+      this.dialogTitle = '编辑';
+      this.form.btnState = 1;
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    // 查询按钮
+    query() {
+      // 按钮倒计时
+      let that = this;
+      that.serachBtnStatus = true;
+      let totalTime = 2
+      let clock = window.setInterval(() => {
+        totalTime--
+        if (totalTime < 0) {
+          totalTime = 2;
+          that.serachBtnStatus = false;
+        }
+      }, 1000)
+      this.getTableQuery();
+      this.$message.success('查询完毕');
+    },
+    // 页面数据查询
+    getTableQuery() {
+      let that = this;
+      that.loading = true;
+      let param = {
+        token: localStorage.token,
+        shopId: this.panel.shopId,
+        name: this.panel.name,
+        phone: this.panel.phone,
+        adminType: this.panel.adminType,
+        start: 1,//
+        tableMax: 9999,//
+      };
+      let postdata = qs.stringify(param);
+      ShopManagerListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.loading = false;
+          if (json.Rs) {
+            that.allTableData = json.Rs;
+            that.recordsTotal = json.Rs.length;
+          } else {
+            that.allTableData = [];
+            that.recordsTotal = 0;
+          }
+          // 设置分页数据
+          that.setPaginations();
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 设置分页数据
+    setPaginations() {
+      // 分页属性
+      let that = this;
+      that.pageination.total = that.recordsTotal;
+      // 默认分页
+      that.tableData = that.allTableData.filter((item, index) => {
+        return index < that.pageination.pageItem;
+      });
+    },
+    // 每页显示数量
+    handleSizeChange() {
+      let that = this;
+      that.tableData = that.allTableData.filter((item, index) => {
+        return index < that.pageination.pageItem;
+      });
+      that.draw = that.pageination.pageItem;
+      that.getTableQuery();
+    },
+    // 翻页
+    pageChange(pageIndex) {
+      let that = this;
+      // 获取当前页
+      let index = that.pageination.pageItem * (pageIndex - 1);
+      // 数据总数
+      let nums = that.pageination.pageItem * pageIndex;
+      // 容器
+      let tables = [];
+      for (var i = index; i < nums; i++) {
+        if (that.allTableData[i]) {
+          tables.push(that.allTableData[i])
+        }
+        this.tableData = tables;
+      }
+      that.start = index * that.draw;
+      // that.getTableQuery();
+    },
+    // 自动排序
+    sortChange(params) {
+      console.log(params)
+    },
+    // 过滤时间
+    filterFmtDate(value, row, column) {
+      let that = this;
+      return nonTfmtDate(column, 11);
+    },
+    // 过滤金额
+    filterMoney(value, row, column) {
+      let that = this;
+      return parseFloat(column).toFixed(2);
+    },
+  },
+  watch: {
+    $route(to) {
+      if (to.name == 'AdminManage') {
+        this.getShopListSelect();
+        this.getTableQuery();
+      }
+    },
+  },
+}
 </script>
 
 <style scoped>
-    @import "../assets/css/panel.css";
+@import "../assets/css/panel.css";
 
-    .context {
-        height: 770px;
-        overflow-y: scroll;
+.context {
+  height: 770px;
+  overflow-y: scroll;
 
-        display: block;
-        margin: 0 auto;
-        background-color: #fff !important;
-        padding: 30px;
-        padding-bottom: 60px;
-    }
+  display: block;
+  margin: 0 auto;
+  background-color: #fff !important;
+  padding: 30px;
+  padding-bottom: 60px;
+}
 
-    .panel-body {
-        padding: 20px;
-        background: #F0F2F5;
-    }
+.panel-body {
+  padding: 20px;
+  background: #F0F2F5;
+}
 
-    .change {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding-top: 10px;
-        padding-bottom: 10px;
-    }
+.change {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
 
-    .change button {
-        float: left;
-    }
+.change button {
+  float: left;
+}
 
-    .change button.pull-right {
-        float: right;
-    }
+.change button.pull-right {
+  float: right;
+}
 
-    .dialogTitle {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        color: #000000;
-        font-size: 18px;
-        text-align: center;
-    }
+.dialogTitle {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  color: #000000;
+  font-size: 18px;
+  text-align: center;
+}
 
-    .dialogTitle em {
-        float: none;
-        font-style: normal;
-        color: #3799FF;
-        margin: 0;
-    }
+.dialogTitle em {
+  float: none;
+  font-style: normal;
+  color: #3799FF;
+  margin: 0;
+}
 
-    /deep/ .el-transfer-panel__item .el-checkbox__input {
-        left: 40px;
-    }
+/deep/ .el-transfer-panel__item .el-checkbox__input {
+  left: 40px;
+}
 
-    .dialogFooter {
-        width: 90%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-top: 10px;
-    }
+.dialogFooter {
+  width: 90%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-top: 10px;
+}
 
-    .dialogFooter button {
-        float: right;
-        margin-left: 10px;
-    }
+.dialogFooter button {
+  float: right;
+  margin-left: 10px;
+}
 
-    /deep/ .el-dialog .el-select .el-input__inner {
-        width: 240px;
-    }
+/deep/ .el-dialog .el-select .el-input__inner {
+  width: 240px;
+}
 
-    /deep/ .el-dialog .el-select {
-        width: 530px;
-    }
+/deep/ .el-dialog .el-select {
+  width: 530px;
+}
 
-    /deep/ .el-dialog .el-select .el-input__inner {
-        width: 530px;
-    }
+/deep/ .el-dialog .el-select .el-input__inner {
+  width: 530px;
+}
 </style>

pc/src/views/EditLessonManage.vue

@@ -1,746 +1,787 @@
 <template>
-    <div class="context">
-        <div class="panel">
-            <h5>{{pageTitle}}</h5>
-        </div>
-        <div class="panel-body">
-            <div class="panel_control">
-                <el-row :gutter="20">
-                    <el-col :span="5">
-                        <em><span style="color: red">*</span> 课程表名称:</em>
-                        <el-input v-model="panel.name" placeholder="请输入课程表名称" :disabled="panel.inputState"></el-input>
-                    </el-col>
-                    <el-col :span="5" v-if="!panel.inputState">
-                        <em><span style="color: red">*</span> 课程表时间:</em>
-                        <el-date-picker
-                                v-model="panel.week"
-                                type="week"
-                                :picker-options="{'firstDayOfWeek': 1}"
-                                format="yyyy 第 WW 周"
-                                placeholder="选择周">
-                        </el-date-picker>
-                    </el-col>
-                    <!--        todo-->
-                    <!--        <el-button class="seeTemp">预览课程表</el-button>-->
-                    <el-button type="default" class="seeTemp" @click="$router.push('/lessonManage')">返回课程表</el-button>
-                </el-row>
-            </div>
-        </div>
-        <br>
-        <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
-            <el-tab-pane label="星期一" name="1"></el-tab-pane>
-            <el-tab-pane label="星期二" name="2"></el-tab-pane>
-            <el-tab-pane label="星期三" name="3"></el-tab-pane>
-            <el-tab-pane label="星期四" name="4"></el-tab-pane>
-            <el-tab-pane label="星期五" name="5"></el-tab-pane>
-            <el-tab-pane label="星期六" name="6"></el-tab-pane>
-            <el-tab-pane label="星期天" name="7"></el-tab-pane>
-        </el-tabs>
-
-
-        <!--        todo 读取后台保存状态，新保存后不跳走-->
-        <div class="table">
-            <el-table
-                    v-for="tab in tabs"
-                    :data="tab.tableData"
-                    v-if="tab.days == activeName"
-                    border
-                    is-horizontal-resize
-                    :default-sort="{prop: 'date', order: 'descending'}"
-                    element-loading-background="rgba(0, 0, 0, 0.8)"
-                    class=""
-                    @selection-change="handleSelectionChange"
->
+  <div class="context">
+    <div class="panel">
+      <h5>{{ pageTitle }}</h5>
+    </div>
+    <div class="panel-body">
+      <div class="panel_control">
+        <el-row :gutter="20">
+          <el-col :span="5">
+            <em><span style="color: red">*</span> 课程表名称:</em>
+            <el-input v-model="panel.name" placeholder="请输入课程表名称" :disabled="panel.inputState"></el-input>
+          </el-col>
+          <el-col :span="5" v-if="!panel.inputState">
+            <em><span style="color: red">*</span> 课程表时间:</em>
+            <el-date-picker
+                v-model="panel.week"
+                type="week"
+                :picker-options="{'firstDayOfWeek': 1}"
+                format="yyyy 第 WW 周"
+                placeholder="选择周">
+            </el-date-picker>
+          </el-col>
+          <!--        todo-->
+          <!--        <el-button class="seeTemp">预览课程表</el-button>-->
+          <el-button type="default" class="seeTemp" @click="$router.push('/lessonManage')">返回课程表</el-button>
+        </el-row>
+      </div>
+    </div>
+    <br>
+    <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
+      <el-tab-pane label="星期一" name="1"></el-tab-pane>
+      <el-tab-pane label="星期二" name="2"></el-tab-pane>
+      <el-tab-pane label="星期三" name="3"></el-tab-pane>
+      <el-tab-pane label="星期四" name="4"></el-tab-pane>
+      <el-tab-pane label="星期五" name="5"></el-tab-pane>
+      <el-tab-pane label="星期六" name="6"></el-tab-pane>
+      <el-tab-pane label="星期天" name="7"></el-tab-pane>
+    </el-tabs>
+
+
+    <!--        todo 读取后台保存状态，新保存后不跳走-->
+    <div class="table">
+      <el-table
+          v-for="tab in tabs"
+          :data="tab.tableData"
+          v-if="tab.days == activeName"
+          border
+          is-horizontal-resize
+          :default-sort="{prop: 'date', order: 'descending'}"
+          element-loading-background="rgba(0, 0, 0, 0.8)"
+          class=""
+          @selection-change="handleSelectionChange"
+      >
+        >
+        <el-table-column
+            prop="timeScope"
+            label="时间"
+            width="260px"
+            align="center"
+        >
+          <template slot-scope="scope">
+            <el-time-picker
+                is-range
+                v-model="scope.row.timeLong"
+                range-separator="至"
+                start-placeholder="开始时间"
+                end-placeholder="结束时间"
+                placeholder="选择时间范围"
+                :readonly="scope.row.Locking == 1"
+            >
+            </el-time-picker>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="ClassId"
+            label="课程"
+            align="center"
+        >
+          <!--                    locking是1的不可编辑课程和时间-->
+          <template slot-scope="scope">
+            <el-select v-model="scope.row.ClassId" @change="getRowTop(scope.row)" :disabled="scope.row.Locking == 1">
+              <el-option
+                  v-for="item in panel.options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+              </el-option>
+            </el-select>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="OrderToplimit"
+            label="预约名额"
+            align="center"
+        >
+          <template slot-scope="scope">
+            <el-input-number v-model="scope.row.OrderToplimit" :min="1" :max="9999"
+                             label=""></el-input-number>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="ConsumeHour"
+            label="消耗课时"
+            align="center"
+        >
+          <template slot-scope="scope">
+            <el-input-number v-model="scope.row.ConsumeHour" :min="0" :max="9999"
+                             label=""></el-input-number>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="WxVisible"
+            label="微信可见"
+        >
+          <template slot-scope="scope">
+            <el-switch
+                v-model="scope.row.WxVisible"
+                :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="WxOrder"
+            label="微信可预约"
+        >
+          <template slot-scope="scope">
+            <el-switch
+                v-model="scope.row.WxOrder"
+                :active-value="1"
+                :inactive-value="0"
+                active-color="#409EFF"
+                inactive-color="#D9D9D9"
+                @change=changeWechatOrder($event,scope.row.ClassSelf)
             >
-                <el-table-column
-                        prop="timeScope"
-                        label="时间"
-                        width="260px"
-                        align="center"
-                >
-                    <template slot-scope="scope">
-                        <el-time-picker
-                                is-range
-                                v-model="scope.row.timeLong"
-                                range-separator="至"
-                                start-placeholder="开始时间"
-                                end-placeholder="结束时间"
-                                placeholder="选择时间范围"
-                                :readonly="scope.row.Locking == 1"
-                        >
-                        </el-time-picker>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="ClassId"
-                        label="课程"
-                        align="center"
-                >
-<!--                    locking是1的不可编辑课程和时间-->
-                    <template slot-scope="scope">
-                        <el-select v-model="scope.row.ClassId" @change="getRowTop(scope.row)" :disabled="scope.row.Locking == 1">
-                            <el-option
-                                    v-for="item in panel.options"
-                                    :key="item.value"
-                                    :label="item.label"
-                                    :value="item.value">
-                            </el-option>
-                        </el-select>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="OrderToplimit"
-                        label="预约名额"
-                        align="center"
-                >
-                    <template slot-scope="scope">
-                        <el-input-number v-model="scope.row.OrderToplimit" :min="1" :max="9999"
-                                         label=""></el-input-number>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="ConsumeHour"
-                        label="消耗课时"
-                        align="center"
-                >
-                    <template slot-scope="scope">
-                        <el-input-number v-model="scope.row.ConsumeHour" :min="0" :max="9999"
-                                         label=""></el-input-number>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="WxVisible"
-                        label="微信可见"
-                >
-                    <template slot-scope="scope">
-                        <el-switch
-                                v-model="scope.row.WxVisible"
-                                :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="WxOrder"
-                        label="微信可预约"
-                >
-                    <template slot-scope="scope">
-                        <el-switch
-                                v-model="scope.row.WxOrder"
-                                :active-value="1"
-                                :inactive-value="0"
-                                active-color="#409EFF"
-                                inactive-color="#D9D9D9"
-                                @change=changeWechatOrder($event,scope.row.ClassSelf)
-                        >
-                        </el-switch>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="Status"
-                        label="操作"
-                        width="100px"
-                        align="center"
-                >
-                    <template slot-scope="scope">
-                        <el-button type="text" class="red" @click="delRow(scope)" v-if="scope.row.Locking != 1">删除</el-button>
-                        <el-button type="text" class="gary" @click="delRow(scope)" v-if="scope.row.Locking == 1">删除</el-button>
-                    </template>
-                </el-table-column>
-            </el-table>
-            <div class="rowBottom">
-                <el-button type="default" @click="$router.push('/lessonManage')">返回课程表</el-button>
-                <!--                ID为0是新建,不为0是修改-->
-                <el-button type="primary" class="pull-right" @click="confirmLessonTable"
-                           v-if="this.$route.query.id == 0">提交
-                </el-button>
-                <el-button type="primary" class="pull-right" @click="confirmEditLessonTable"
-                           v-if="this.$route.query.id != 0">提交
-                </el-button>
-                <el-button type="primary" class="pull-right" @click="addRow">新增课表</el-button>
-            </div>
-            <div>
-                <br>
-                <em class="red wrning">
-                    *所有操作提交后生效
-                </em>
-            </div>
-        </div>
+            </el-switch>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="Status"
+            label="操作"
+            width="100px"
+            align="center"
+        >
+          <template slot-scope="scope">
+            <el-button type="text" class="red" @click="delRow(scope)" v-if="scope.row.Locking != 1">删除</el-button>
+            <el-button type="text" class="gary" @click="delRow(scope)" v-if="scope.row.Locking == 1">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="rowBottom">
+        <el-button type="default" @click="$router.push('/lessonManage')">返回课程表</el-button>
+        <!--                ID为0是新建,不为0是修改-->
+        <el-button type="primary" class="pull-right" @click="confirmLessonTable"
+                   v-if="this.$route.query.id == 0" :disabled="serachBtnStatus">提交
+        </el-button>
+        <el-button type="primary" class="pull-right" @click="confirmEditLessonTable"
+                   v-if="this.$route.query.id != 0" :disabled="serachBtnStatus">提交
+        </el-button>
+        <el-button type="primary" class="pull-right" @click="addRow">新增课表</el-button>
+      </div>
+      <div>
         <br>
-        <el-dialog title="增删课程会员" :visible.sync="dialogVisible">
-            <div class="dialogTitle">
-                <span>基础功能</span>
-            </div>
-            <div>
-                <el-transfer filterable v-model="dialogValue" :data="dialogdata"></el-transfer>
-            </div>
-            <div class="dialogFooter">
-                <el-button type="primary" size="small">确定</el-button>
-                <el-button @click="dialogVisible = false" size="small">取消</el-button>
-            </div>
-        </el-dialog>
+        <em class="red wrning">
+          *所有操作提交后生效
+        </em>
+      </div>
     </div>
+    <br>
+    <el-dialog title="增删课程会员" :visible.sync="dialogVisible">
+      <div class="dialogTitle">
+        <span>基础功能</span>
+      </div>
+      <div>
+        <el-transfer filterable v-model="dialogValue" :data="dialogdata"></el-transfer>
+      </div>
+      <div class="dialogFooter">
+        <el-button type="primary" size="small">确定</el-button>
+        <el-button @click="dialogVisible = false" size="small">取消</el-button>
+      </div>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
-    import Global from '../Global.js'
-    import {
-        SttPlanBasicAdd,
-        SttPlanDetailListQuery,
-        SttPlanDetailBatchSave,
-        STTBasicAdd,
-        SttPlanBasicEdit,
-        STTDetailListQuery,
-        STTDetailBatchSave,
-        STTBasicEdit,
-        testTable,
-        testTableLong,
-        testSelect,
-        ClassListQuery,
-        STTDetailAllowDelCheck,
-        ClassDetailOne
-    } from "../api/getApiRes";
-
-    let qs = require('qs');
-    export default {
-        data() {
-            return {
-                pageTitle: '新增课程表',
-                dialogVisible: false,
-                dialogdata: [],
-                dialogValue: [],
-                temId: '',
-                activeName: '1',
-                tableData: [],
-                // panel 配置项目
-                panel: {
-                    inputState: false,
-                    name: '',
-                    usercode: '',
-                    username: '',
-                    compname: '',
-                    keyword: '',
-                    USERCODE: '',
-                    week: '',
-                    taskstatus: 99,
-                    draw: 1,
-                    start: 0,
-                    recordsTotal: 0,
-                    tableData: [],
-                    allTableData: [],
-                    limit: '10',
-                    multipleSort: false,
-                    loading: false,
-                    fileList: [],
-                    multipleSelection: [],
-                    detectedmac: '',
-                    options: [],
-                    time1: globalBt(),
-                },
-                multipleSelection: [],
-                pageination: {
-                    pageItem: 100,
-                    pageoptions: pageOptions(),
-                    total: 100,
-                    pageIndex: 1,
-                },
-                testRow: {
-                    timeLong: [new Date(2016, 9, 10, 8, 1), new Date(2016, 9, 10, 9, 2)],
-                    BeginStr: '08:30',
-                    EndStr: '09:30',
-                    ClassId: '',
-                    OrderToplimit: 1,
-                    ConsumeHour: 1,
-                    WxOrder: 1,
-                    WxVisible: 0,
-                },
-                tabs: [
-                    {
-                        tableData: [], days: '1'
-                    },
-                    {
-                        tableData: [
-                            // {name:'1'},
-                        ], days: '2'
-                    },
-                    {
-                        tableData: [], days: '3'
-                    },
-                    {
-                        tableData: [], days: '4'
-                    },
-                    {
-                        tableData: [], days: '5'
-                    },
-                    {
-                        tableData: [], days: '6'
-                    },
-                    {
-                        tableData: [], days: '7'
-                    },
-                ]
-            }
+import Global from '../Global.js'
+import {
+  SttPlanBasicAdd,
+  SttPlanDetailListQuery,
+  SttPlanDetailBatchSave,
+  STTBasicAdd,
+  SttPlanBasicEdit,
+  STTDetailListQuery,
+  STTDetailBatchSave,
+  STTBasicEdit,
+  testTable,
+  testTableLong,
+  testSelect,
+  ClassListQuery,
+  STTDetailAllowDelCheck,
+  ClassDetailOne
+} from "../api/getApiRes";
+
+let qs = require('qs');
+export default {
+  data() {
+    return {
+      pageTitle: '新增课程表',
+      dialogVisible: false,
+      dialogdata: [],
+      dialogValue: [],
+      temId: '',
+      activeName: '1',
+      tableData: [],
+      // panel 配置项目
+      panel: {
+        inputState: false,
+        name: '',
+        usercode: '',
+        username: '',
+        compname: '',
+        keyword: '',
+        USERCODE: '',
+        week: '',
+        taskstatus: 99,
+        draw: 1,
+        start: 0,
+        recordsTotal: 0,
+        tableData: [],
+        allTableData: [],
+        limit: '10',
+        multipleSort: false,
+        loading: false,
+        fileList: [],
+        multipleSelection: [],
+        detectedmac: '',
+        options: [],
+        time1: globalBt(),
+      },
+      multipleSelection: [],
+      pageination: {
+        pageItem: 100,
+        pageoptions: pageOptions(),
+        total: 100,
+        pageIndex: 1,
+      },
+      testRow: {
+        timeLong: [new Date(2016, 9, 10, 8, 1), new Date(2016, 9, 10, 9, 2)],
+        BeginStr: '08:30',
+        EndStr: '09:30',
+        ClassId: '',
+        OrderToplimit: 1,
+        ConsumeHour: 1,
+        WxOrder: 1,
+        WxVisible: 0,
+      },
+      tabs: [
+        {
+          tableData: [], days: '1'
         },
-        mounted() {
-            // 加载课程选项
-            this.panelSelect();
-            if (parseInt(this.$route.query.id) == 0) {
-                //  深拷贝赋初始值
-                this.pageTitle = '新增课程表'
-                this.deepValue();
-                this.panel.name = '';
-                this.panel.week = '';
-                this.panel.inputState = false
-            } else {
-                // 读取赋值
-                this.pageTitle = '编辑课程表'
-                this.getTableQuery();
-                this.panel.inputState = true
-            }
+        {
+          tableData: [], days: '2'
         },
-        methods: {
-            // 加载选项
-            panelSelect() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    vipType: '',
-                    start: 1,
-                    expDay: 0,
-                    tableMax: 9999,
-                };
-                let postdata = qs.stringify(param);
-                ClassListQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // that.dialogdata = json.Rs;
-                        that.panel.options = turnClassResToOption(json.Rs)
-                        console.log(that.panel.options);
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 选择课程后，获取当前课程的建议上课人数和课时消耗
-            getRowTop(row) {
-                let that = this;
-                console.log(row);
-                let param = {
-                    token: localStorage.token,
-                    classId: row.ClassId,
-                };
-                let postdata = qs.stringify(param);
-                ClassDetailOne(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        row.OrderToplimit = json.Rs.TopLimit;
-                        row.ConsumeHour = json.Rs.ConsumeHour;
-                        // row.WxOrder = json.Rs.WxOrder; //不支持联动
-                        row.WxVisible = json.Rs.WxVisible;
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            confirmEditLessonTable() {
-                let id = this.$route.query.id
-                // 提交课程内容,不再修改课程名称和时间的信息
-                this.EditLessonTable(id);
-            },
-            // 删除
-            delRow(scope) {
-                if(!scope.row.StdId){
-                    let delIndex = parseInt(scope.$index)
-                    let curIndex = parseInt(this.activeName) - 1;
-                    this.tabs[curIndex].tableData.splice(delIndex, 1)
-                }else{
-                    this.checkCannotDel(scope)
-                }
-            },
-            // 检测课表中课程可否删除
-            checkCannotDel(scope) {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    stdId : scope.row.StdId ,
-                };
-                let postdata = qs.stringify(param);
-                STTDetailAllowDelCheck(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        let delIndex = parseInt(scope.$index)
-                        let curIndex = parseInt(this.activeName) - 1;
-                        this.tabs[curIndex].tableData.splice(delIndex, 1)
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 提交课程
-            confirmLessonTable() {
-                if (!this.panel.name) {
-                    this.$message.error('名称不能为空');
-                    return false
-                }
-                if (this.panel.name.length < 3) {
-                    this.$message.error('名称不能小于3个字符');
-                    return false
-                }
-                if (this.panel.name.length > 20) {
-                    this.$message.error('名称不能大于20个字符');
-                    return false
-                }
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    name: this.panel.name,
-                    incomingDate: nonTfmtDatetoLength(this.panel.week, 10),//对应日期 字符串 年-月-日 格式,
-                };
-                let postdata = qs.stringify(param);
-                STTBasicAdd(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.panel.tabId = json.Id;
-                        // 提交课程内容
-                        that.EditLessonTable(json.Id);
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 保存课程
-            EditLessonTable(planId) {
-                let that = this;
-                // 校验提交的数据
-                if (!this.checkData) {
-                    return false
-                }
-                // 提交数据
-                let planRs = [];
-                let thisRow = {};
-                for (let i = 0; i < this.tabs.length; i++) {
-                    for (let j = 0; j < this.tabs[i].tableData.length; j++) {
-                        thisRow = this.tabs[i].tableData[j];
-                        thisRow.LessonIndex = parseInt(j + 1);
-                        if (planId) {
-                            thisRow.StbId = parseInt(planId);
-                        } else {
-                            thisRow.StbId = parseInt(this.$route.query.id);
-                        }
-                        thisRow.WeekDay = parseInt(i + 1);
-                        thisRow.BeginStr = getHoursAndMin(thisRow.timeLong[0]);
-                        thisRow.EndStr = getHoursAndMin(thisRow.timeLong[1]);
-                        thisRow.StdId = thisRow.StdId ? thisRow.StdId : 0;
-                        this.$delete(thisRow, 'Base');
-                        this.$delete(thisRow, 'SpdId');
-                        planRs.push(thisRow);
-                    }
-                }
-
-                let res = JSON.stringify(planRs);
-                // 如果传入0就用url里的，如果非0就用传入的
-                // let uploadPlanId = planId == 0 ? this.$route.query.id : planId;
-                let param = {
-                    token: localStorage.token,
-                    stbId: planId,
-                    stbRs: res,
-                };
-                let postdata = qs.stringify(param);
-                STTDetailBatchSave(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.$message({
-                            showClose: true,
-                            message: '课程已上传成功！',
-                            type: 'success'
-                        });
-                        this.$router.push({
-                            path: '/lessonManage'
-                        });
-                        // this.getTableQuery();
-                    } else {
-                        this.$router.push({
-                            path: '/lessonManage'
-                        });
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 检查数据
-            checkData() {
-                // todo
-                let tableDate = this.tabs;
-                tableDate.map(function (item) {
-                    console.log(item);
-                })
-
-            },
-            // 新增一行
-            addRow() {
-                // 读取当前周几
-                let index = parseInt(this.activeName) - 1;
-                let rows = this.testRow;
-                let res = this.deepClone(rows);
-                this.tabs[index].tableData.push(res);
-            },
-            //  深拷贝赋初始值
-            deepValue() {
-                let that = this;
-                let valus = [
-                    this.testRow
-                ];
-                this.tabs.map(function (item) {
-                    let res = that.deepClone(valus);
-                    item.tableData = res;
-                })
-            },
-            deepClone(obj) {
-                let _obj = JSON.stringify(obj),
-                    objClone = JSON.parse(_obj);
-                return objClone
-            },
-            handleClick() {
-            },
-            changeWechat(e, row) {
-                // if(parseInt(e) == 0){
-                //     this.$message.success('当前课程微信已不可见');
-                // }else{
-                //     this.$message.success('当前课程微信不可见');
-                // }
-            },
-            changeWechatOrder(e, row) {
-                // if(parseInt(e) == 0){
-                //     this.$message.success('当前课程微信已不可预约');
-                // }else{
-                //     this.$message.success('当前课程微信可预约');
-                // }
-            },
-            // 增删会员课程
-            lessonStudenChange() {
-                this.dialogVisible = true
-            },
-            handleSelectionChange(val) {
-                this.multipleSelection = val;
-            },
-            // 页面数据查询
-            getTableQuery() {
-                let that = this;
-                that.loading = true;
-                let param = {
-                    token: localStorage.token,
-                    stbId: this.$route.query.id,//
-                };
-                // 只能读取，不能修改
-                this.panel.name = this.$route.query.name;
-
-
-                let postdata = qs.stringify(param);
-                STTDetailListQuery(postdata).then(res => {
-                    let json = res;
-                    let Rs = json.Rs
-                    let bt = '';
-                    let et = '';
-                    if (json.Code == 0) {
-                        that.loading = false;
-                        // 清掉上次的记录
-                        for (let i = 0; i < that.tabs.length; i++) {
-                            that.tabs[i].tableData = []
-                        }
-                        if (Rs) {
-                            // 遍历分配
-                            Rs.map(function (item) {
-                                for (let i = 0; i < 7; i++) {
-                                    if (item.WeekDay == i + 1) {
-                                        bt = new Date(2016, 9, 10, item.BeginStr.substr(0, 2), item.BeginStr.substr(3, 2));
-                                        et = new Date(2016, 9, 10, item.EndStr.substr(0, 2), item.EndStr.substr(3, 2));
-                                        item.timeLong = [bt, et];
-                                        that.tabs[i].tableData.push(item);
-
-                                    }
-                                }
-                            })
-                        } else {
-                            that.allTableData = [];
-                            that.recordsTotal = 0;
-                        }
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
+        {
+          tableData: [], days: '3'
         },
-        watch: {
-            $route(to) {
-                if (to.name == 'EditLessonManage') {
-                    this.temId = this.$route.query.id;
-                    this.panelSelect();
-                }
-            },
-            temId(e) {
-                if (parseInt(e) == 0) {
-                    this.pageTitle = '新增课程表'
-                    this.deepValue();
-                    this.panel.name = '';
-                    this.panel.week = '';
-                    this.panel.inputState = false
-                } else {
-                    this.pageTitle = '编辑课程表'
-                    this.getTableQuery();
-                    this.panel.inputState = true
-                }
-            },
+        {
+          tableData: [], days: '4'
         },
+        {
+          tableData: [], days: '5'
+        },
+        {
+          tableData: [], days: '6'
+        },
+        {
+          tableData: [], days: '7'
+        },
+      ],
+      serachBtnStatus: false,
     }
-</script>
-
-<style scoped>
-    @import "../assets/css/panel.css";
-
-    em {
-        font-style: normal;
-    }
-
-    .context {
-        overflow: hidden;
-        height: 770px;
-
-        overflow-y: scroll;
-        display: block;
-        margin: 0 auto;
-        background-color: #fff !important;
-        min-height: 100%;
-        padding: 30px;
-        padding-bottom: 10px;
-    }
-
-    .panel-body {
-        padding: 20px;
-        background: #F0F2F5;
-    }
-
-    .change {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding-top: 10px;
-        padding-bottom: 10px;
-    }
-
-    .change button {
-        float: left;
-    }
-
-    .change button.pull-right {
-        float: right;
-    }
-
-    .dialogTitle {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        color: #000000;
-        font-size: 18px;
-        text-align: center;
-    }
-
-    .dialogTitle span {
-        width: 169px;
-        height: 40px;
-        line-height: 40px;
-        text-align: center;
-        color: #fff;
-        background: #3799FF;
-        border-radius: 250px;
-        font-size: 18px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-bottom: 30px;
-    }
-
-    .dialogTitle em {
-        float: none;
-        font-style: normal;
-        color: #3799FF;
-        margin: 0;
-    }
-
-    /deep/ .el-transfer-panel__item .el-checkbox__input {
-        left: 40px;
-    }
-
-    .dialogFooter {
-        width: 90%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-top: 10px;
-    }
-
-    .dialogFooter button {
-        float: right;
-        margin-left: 10px;
-    }
-
-    /deep/ .panel_control .el-input {
-        width: 200px;
-        float: left;
-    }
-
-    .panel_control em {
-        float: left;
-        font-size: 14px;
-        color: #545454;
-        line-height: 45px;
-        margin-right: 10px;
-    }
-
-    .seeTemp {
-        /*position: relative;*/
-        float: right;
-        bottom: 0px;
-        z-index: 222;
-    }
-
-    .table {
-        position: relative;
-        /*top: -50px;*/
-        top: 0px;
-    }
-
-    .el-range-editor.el-input__inner {
-        width: 220px;
-        padding: 3px 6px;
-    }
-
-    .rowBottom {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-top: 10px;
-    }
-
-    .rowBottom button {
-        float: left;
-        margin-right: 10px;
+  },
+  mounted() {
+    // 加载课程选项
+    this.panelSelect();
+    if (parseInt(this.$route.query.id) == 0) {
+      //  深拷贝赋初始值
+      this.pageTitle = '新增课程表'
+      this.deepValue();
+      this.panel.name = '';
+      this.panel.week = '';
+      this.panel.inputState = false
+    } else {
+      // 读取赋值
+      this.pageTitle = '编辑课程表'
+      this.getTableQuery();
+      this.panel.inputState = true
     }
+  },
+  methods: {
+    // 加载选项
+    panelSelect() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        vipType: '',
+        start: 1,
+        expDay: 0,
+        tableMax: 9999,
+      };
+      let postdata = qs.stringify(param);
+      ClassListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // that.dialogdata = json.Rs;
+          if (json.Rs == null) return false
+          that.panel.options = turnClassResToOption(json.Rs)
+          console.log(that.panel.options);
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 选择课程后，获取当前课程的建议上课人数和课时消耗
+    getRowTop(row) {
+      let that = this;
+      console.log(row);
+      let param = {
+        token: localStorage.token,
+        classId: row.ClassId,
+      };
+      let postdata = qs.stringify(param);
+      ClassDetailOne(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          row.OrderToplimit = json.Rs.TopLimit;
+          row.ConsumeHour = json.Rs.ConsumeHour;
+          // row.WxOrder = json.Rs.WxOrder; //不支持联动
+          row.WxVisible = json.Rs.WxVisible;
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    confirmEditLessonTable() {
+      let id = this.$route.query.id
+      // 提交课程内容,不再修改课程名称和时间的信息
+      this.EditLessonTable(id);
+    },
+    // 删除
+    delRow(scope) {
+      if (!scope.row.StdId) {
+        let delIndex = parseInt(scope.$index)
+        let curIndex = parseInt(this.activeName) - 1;
+        this.tabs[curIndex].tableData.splice(delIndex, 1)
+      } else {
+        this.checkCannotDel(scope)
+      }
+    },
+    // 检测课表中课程可否删除
+    checkCannotDel(scope) {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        stdId: scope.row.StdId,
+      };
+      let postdata = qs.stringify(param);
+      STTDetailAllowDelCheck(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          let delIndex = parseInt(scope.$index)
+          let curIndex = parseInt(this.activeName) - 1;
+          this.tabs[curIndex].tableData.splice(delIndex, 1)
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 提交课程
+    confirmLessonTable() {
+      if (!this.panel.name) {
+        this.$message.error('名称不能为空');
+        return false
+      }
+      if (this.panel.name.length < 3) {
+        this.$message.error('名称不能小于3个字符');
+        return false
+      }
+      if (this.panel.name.length > 20) {
+        this.$message.error('名称不能大于20个字符');
+        return false
+      }
+      let that = this;
+
+      that.serachBtnStatus = true;
+      let totalTime = 2
+      let clock = window.setInterval(() => {
+        totalTime--
+        if (totalTime < 0) {
+          totalTime = 2;
+          that.serachBtnStatus = false;
+        }
+      }, 1000)
+
+
+      let param = {
+        token: localStorage.token,
+        name: this.panel.name,
+        incomingDate: nonTfmtDatetoLength(this.panel.week, 10),//对应日期 字符串 年-月-日 格式,
+      };
+      let postdata = qs.stringify(param);
+      STTBasicAdd(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.panel.tabId = json.Id;
+          // 提交课程内容
+          that.EditLessonTable(json.Id);
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 保存课程
+    EditLessonTable(planId) {
+      let that = this;
+      // 校验提交的数据
+      if (!this.checkData) {
+        return false
+      }
+      // 提交数据
+      let planRs = [];
+      let thisRow = {};
+      for (let i = 0; i < this.tabs.length; i++) {
+        for (let j = 0; j < this.tabs[i].tableData.length; j++) {
+          thisRow = this.tabs[i].tableData[j];
+          thisRow.LessonIndex = parseInt(j + 1);
+          if (planId) {
+            thisRow.StbId = parseInt(planId);
+          } else {
+            thisRow.StbId = parseInt(this.$route.query.id);
+          }
+          thisRow.WeekDay = parseInt(i + 1);
+          thisRow.BeginStr = getHoursAndMin(thisRow.timeLong[0]);
+          thisRow.EndStr = getHoursAndMin(thisRow.timeLong[1]);
+          thisRow.StdId = thisRow.StdId ? thisRow.StdId : 0;
+          this.$delete(thisRow, 'Base');
+          this.$delete(thisRow, 'SpdId');
+          planRs.push(thisRow);
+        }
+      }
+
+      let res = JSON.stringify(planRs);
+      // 如果传入0就用url里的，如果非0就用传入的
+      // let uploadPlanId = planId == 0 ? this.$route.query.id : planId;
+      let param = {
+        token: localStorage.token,
+        stbId: planId,
+        stbRs: res,
+      };
+      let postdata = qs.stringify(param);
+      STTDetailBatchSave(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.$message({
+            showClose: true,
+            message: '课程已上传成功！',
+            type: 'success'
+          });
+          this.$router.push({
+            path: '/lessonManage'
+          });
+          // 提交后清掉内存里的课表
+          this.clearTableRAM();
+          // this.getTableQuery();
+        } else {
+          this.$router.push({
+            path: '/lessonManage'
+          });
+          // 提交后清掉内存里的课表
+          this.clearTableRAM();
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    clearTableRAM(){
+      this.tabs = [
+        {
+          tableData: [], days: '1'
+        },
+        {
+          tableData: [], days: '2'
+        },
+        {
+          tableData: [], days: '3'
+        },
+        {
+          tableData: [], days: '4'
+        },
+        {
+          tableData: [], days: '5'
+        },
+        {
+          tableData: [], days: '6'
+        },
+        {
+          tableData: [], days: '7'
+        },
+      ];
+
+    },
+    // 检查数据
+    checkData() {
+      // todo
+      let tableDate = this.tabs;
+      tableDate.map(function (item) {
+        console.log(item);
+      })
+
+    },
+    // 新增一行
+    addRow() {
+      // 读取当前周几
+      let index = parseInt(this.activeName) - 1;
+      let rows = this.testRow;
+      let res = this.deepClone(rows);
+      this.tabs[index].tableData.push(res);
+    },
+    //  深拷贝赋初始值
+    deepValue() {
+      let that = this;
+      let valus = [
+        this.testRow
+      ];
+      this.tabs.map(function (item) {
+        let res = that.deepClone(valus);
+        item.tableData = res;
+      })
+    },
+    deepClone(obj) {
+      let _obj = JSON.stringify(obj),
+          objClone = JSON.parse(_obj);
+      return objClone
+    },
+    handleClick() {
+    },
+    changeWechat(e, row) {
+      // if(parseInt(e) == 0){
+      //     this.$message.success('当前课程微信已不可见');
+      // }else{
+      //     this.$message.success('当前课程微信不可见');
+      // }
+    },
+    changeWechatOrder(e, row) {
+      // if(parseInt(e) == 0){
+      //     this.$message.success('当前课程微信已不可预约');
+      // }else{
+      //     this.$message.success('当前课程微信可预约');
+      // }
+    },
+    // 增删会员课程
+    lessonStudenChange() {
+      this.dialogVisible = true
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    // 页面数据查询
+    getTableQuery() {
+      let that = this;
+      that.loading = true;
+      let param = {
+        token: localStorage.token,
+        stbId: this.$route.query.id,//
+      };
+      // 只能读取，不能修改
+      this.panel.name = this.$route.query.name;
+
+
+      let postdata = qs.stringify(param);
+      STTDetailListQuery(postdata).then(res => {
+        let json = res;
+        let Rs = json.Rs
+        let bt = '';
+        let et = '';
+        if (json.Code == 0) {
+          that.loading = false;
+          // 清掉上次的记录
+          for (let i = 0; i < that.tabs.length; i++) {
+            that.tabs[i].tableData = []
+          }
+          if (Rs) {
+            // 遍历分配
+            Rs.map(function (item) {
+              for (let i = 0; i < 7; i++) {
+                if (item.WeekDay == i + 1) {
+                  bt = new Date(2016, 9, 10, item.BeginStr.substr(0, 2), item.BeginStr.substr(3, 2));
+                  et = new Date(2016, 9, 10, item.EndStr.substr(0, 2), item.EndStr.substr(3, 2));
+                  item.timeLong = [bt, et];
+                  that.tabs[i].tableData.push(item);
 
-    .wrning {
-        float: right;
-        font-size: 12px;
-    }
+                }
+              }
+            })
+          } else {
+            that.allTableData = [];
+            that.recordsTotal = 0;
+          }
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+  },
+  watch: {
+    $route(to) {
+      if (to.name == 'EditLessonManage') {
+        this.temId = this.$route.query.id;
+        this.panelSelect();
+        if (parseInt(this.temId) == 0) {
+          this.pageTitle = '新增课程表'
+          this.deepValue();
+          this.panel.name = '';
+          this.panel.week = '';
+          this.panel.inputState = false
+        } else {
+          this.pageTitle = '编辑课程表'
+          this.getTableQuery();
+          this.panel.inputState = true
+        }
+      }
+    },
+  },
+}
+</script>
 
-    .rowBottom button.pull-right {
-        float: right;
-    }
-    .gary {
-        color: #8c939d;
-    }
+<style scoped>
+@import "../assets/css/panel.css";
+
+em {
+  font-style: normal;
+}
+
+.context {
+  overflow: hidden;
+  height: 770px;
+
+  overflow-y: scroll;
+  display: block;
+  margin: 0 auto;
+  background-color: #fff !important;
+  min-height: 100%;
+  padding: 30px;
+  padding-bottom: 10px;
+}
+
+.panel-body {
+  padding: 20px;
+  background: #F0F2F5;
+}
+
+.change {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
+
+.change button {
+  float: left;
+}
+
+.change button.pull-right {
+  float: right;
+}
+
+.dialogTitle {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  color: #000000;
+  font-size: 18px;
+  text-align: center;
+}
+
+.dialogTitle span {
+  width: 169px;
+  height: 40px;
+  line-height: 40px;
+  text-align: center;
+  color: #fff;
+  background: #3799FF;
+  border-radius: 250px;
+  font-size: 18px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-bottom: 30px;
+}
+
+.dialogTitle em {
+  float: none;
+  font-style: normal;
+  color: #3799FF;
+  margin: 0;
+}
+
+/deep/ .el-transfer-panel__item .el-checkbox__input {
+  left: 40px;
+}
+
+.dialogFooter {
+  width: 90%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-top: 10px;
+}
+
+.dialogFooter button {
+  float: right;
+  margin-left: 10px;
+}
+
+/deep/ .panel_control .el-input {
+  width: 200px;
+  float: left;
+}
+
+.panel_control em {
+  float: left;
+  font-size: 14px;
+  color: #545454;
+  line-height: 45px;
+  margin-right: 10px;
+}
+
+.seeTemp {
+  /*position: relative;*/
+  float: right;
+  bottom: 0px;
+  z-index: 222;
+}
+
+.table {
+  position: relative;
+  /*top: -50px;*/
+  top: 0px;
+}
+
+.el-range-editor.el-input__inner {
+  width: 220px;
+  padding: 3px 6px;
+}
+
+.rowBottom {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-top: 10px;
+}
+
+.rowBottom button {
+  float: left;
+  margin-right: 10px;
+}
+
+.wrning {
+  float: right;
+  font-size: 12px;
+}
+
+.rowBottom button.pull-right {
+  float: right;
+}
+
+.gary {
+  color: #8c939d;
+}
 </style>

pc/src/views/EditLessonTable.vue

@@ -1,720 +1,762 @@
 <template>
-    <div class="context">
-        <div class="panel">
-            <h5>{{pageTitle}}</h5>
-        </div>
-        <div class="panel-body">
-            <div class="panel_control">
-                <el-row :gutter="20">
-                    <el-col :span="9">
-                        <em> <span style="color: red">*</span>课程表模板名称:</em>
-                        <el-input v-model="panel.name" placeholder="请输入课程表模板名称"></el-input>
-                    </el-col>
-                    <!--                    默认不通用-->
-                    <!--        todo-->
-                    <!--        <el-button class="seeTemp" @click.native="seeWeekTemp">预览模板</el-button>-->
-                    <el-button type="default" class="seeTemp" @click="$router.push('/lessonTable')">返回课程表模板</el-button>
-                </el-row>
-            </div>
-        </div>
-        <br>
-        <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
-            <el-tab-pane label="星期一" name="1"></el-tab-pane>
-            <el-tab-pane label="星期二" name="2"></el-tab-pane>
-            <el-tab-pane label="星期三" name="3"></el-tab-pane>
-            <el-tab-pane label="星期四" name="4"></el-tab-pane>
-            <el-tab-pane label="星期五" name="5"></el-tab-pane>
-            <el-tab-pane label="星期六" name="6"></el-tab-pane>
-            <el-tab-pane label="星期天" name="7"></el-tab-pane>
-        </el-tabs>
-
-        <div class="table">
-            <el-table
-                    v-for="tab in tabs"
-                    :data="tab.tableData"
-                    v-if="tab.days == activeName"
-                    border
-                    is-horizontal-resize
-                    :default-sort="{prop: 'date', order: 'descending'}"
-                    element-loading-background="rgba(0, 0, 0, 0.8)"
-                    class=""
-                    @selection-change="handleSelectionChange"
->
-            >
-                <el-table-column
-                        prop="timeScope"
-                        label="时间"
-                        width="260px"
-                        align="center"
-                >
-                    <template slot-scope="scope">
-                        <el-time-picker
-                                is-range
-                                v-model="scope.row.timeLong"
-                                range-separator="至"
-                                start-placeholder="开始时间"
-                                end-placeholder="结束时间"
-                                placeholder="选择时间范围">
-                        </el-time-picker>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="ClassId"
-                        label="课程"
-                        align="center"
-                >
-                    <template slot-scope="scope">
-                        <el-select v-model="scope.row.ClassId" @change="getRowTop(scope.row)">
-                            <el-option
-                                    v-for="item in panel.options"
-                                    :key="item.value"
-                                    :label="item.label"
-                                    :value="item.value">
-                            </el-option>
-                        </el-select>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="TopLimit"
-                        label="预约名额"
-                        align="center"
-                >
-                    <template slot-scope="scope">
-                        <el-input-number v-model="scope.row.TopLimit" :min="1" :max="9999" label=""></el-input-number>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="ConsumeHour"
-                        label="消耗课时"
-                        align="center"
-                >
-                    <template slot-scope="scope">
-                        <el-input-number v-model="scope.row.ConsumeHour" :min="0" :max="9999"
-                                         label=""></el-input-number>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="Status"
-                        label="操作"
-                        width="100px"
-                        align="center"
-                >
-                    <template slot-scope="scope">
-                        <el-button type="text" class="red" @click="delRow(scope)">删除</el-button>
-                    </template>
-                </el-table-column>
-            </el-table>
-            <div class="rowBottom">
-                <el-button type="default" @click="$router.push('/lessonTable')">返回课程表模板</el-button>
-
-                <!--                ID为0是新建,不为0是修改-->
-                <el-button type="primary" class="pull-right" @click="confirmLessonTable"
-                           v-if="this.$route.query.id == 0">提交
-                </el-button>
-                <el-button type="primary" class="pull-right" @click="confirmEditLessonTable"
-                           v-if="this.$route.query.id != 0">提交
-                </el-button>
-                <el-button type="primary" class="pull-right" @click="addRow">新增课表</el-button>
-            </div>
-            <div>
-                <br>
-                <em class="red wrning">
-                    *所有操作提交后生效
-                </em>
-            </div>
-        </div>
+  <div class="context">
+    <div class="panel">
+      <h5>{{ pageTitle }}</h5>
+    </div>
+    <div class="panel-body">
+      <div class="panel_control">
+        <el-row :gutter="20">
+          <el-col :span="9">
+            <em> <span style="color: red">*</span>课程表模板名称:</em>
+            <el-input v-model="panel.name" placeholder="请输入课程表模板名称"></el-input>
+          </el-col>
+          <!--                    默认不通用-->
+          <!--        todo-->
+          <!--        <el-button class="seeTemp" @click.native="seeWeekTemp">预览模板</el-button>-->
+          <el-button type="default" class="seeTemp" @click="$router.push('/lessonTable')">返回课程表模板</el-button>
+        </el-row>
+      </div>
+    </div>
+    <br>
+    <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
+      <el-tab-pane label="星期一" name="1"></el-tab-pane>
+      <el-tab-pane label="星期二" name="2"></el-tab-pane>
+      <el-tab-pane label="星期三" name="3"></el-tab-pane>
+      <el-tab-pane label="星期四" name="4"></el-tab-pane>
+      <el-tab-pane label="星期五" name="5"></el-tab-pane>
+      <el-tab-pane label="星期六" name="6"></el-tab-pane>
+      <el-tab-pane label="星期天" name="7"></el-tab-pane>
+    </el-tabs>
+
+    <div class="table">
+      <el-table
+          v-for="tab in tabs"
+          :data="tab.tableData"
+          v-if="tab.days == activeName"
+          border
+          is-horizontal-resize
+          :default-sort="{prop: 'date', order: 'descending'}"
+          element-loading-background="rgba(0, 0, 0, 0.8)"
+          class=""
+          @selection-change="handleSelectionChange"
+      >
+        >
+        <el-table-column
+            prop="timeScope"
+            label="时间"
+            width="260px"
+            align="center"
+        >
+          <template slot-scope="scope">
+            <el-time-picker
+                is-range
+                v-model="scope.row.timeLong"
+                range-separator="至"
+                start-placeholder="开始时间"
+                end-placeholder="结束时间"
+                placeholder="选择时间范围">
+            </el-time-picker>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="ClassId"
+            label="课程"
+            align="center"
+        >
+          <template slot-scope="scope">
+            <el-select v-model="scope.row.ClassId" @change="getRowTop(scope.row)">
+              <el-option
+                  v-for="item in panel.options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+              </el-option>
+            </el-select>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="TopLimit"
+            label="预约名额"
+            align="center"
+        >
+          <template slot-scope="scope">
+            <el-input-number v-model="scope.row.TopLimit" :min="1" :max="9999" label=""></el-input-number>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="ConsumeHour"
+            label="消耗课时"
+            align="center"
+        >
+          <template slot-scope="scope">
+            <el-input-number v-model="scope.row.ConsumeHour" :min="0" :max="9999"
+                             label=""></el-input-number>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="Status"
+            label="操作"
+            width="100px"
+            align="center"
+        >
+          <template slot-scope="scope">
+            <el-button type="text" class="red" @click="delRow(scope)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="rowBottom">
+        <el-button type="default" @click="$router.push('/lessonTable')">返回课程表模板</el-button>
+
+        <!--                ID为0是新建,不为0是修改-->
+        <el-button type="primary" class="pull-right" @click="confirmLessonTable"
+                   v-if="this.$route.query.id == 0" :disabled="serachBtnStatus">提交
+        </el-button>
+        <el-button type="primary" class="pull-right" @click="confirmEditLessonTable"
+                   v-if="this.$route.query.id != 0" :disabled="serachBtnStatus">提交
+        </el-button>
+        <el-button type="primary" class="pull-right" @click="addRow">新增课程</el-button>
+      </div>
+      <div>
         <br>
-
-
-        <el-dialog title="增删课程会员" :visible.sync="dialogVisible">
-            <div class="dialogTitle">
-                <span>基础功能</span>
-            </div>
-            <div>
-                <el-transfer filterable v-model="dialogValue" :data="dialogdata"></el-transfer>
-            </div>
-            <div class="dialogFooter">
-                <el-button type="primary" size="small">确定</el-button>
-                <el-button @click="dialogVisible = false" size="small">取消</el-button>
-            </div>
-        </el-dialog>
-
-        <el-dialog title="预览" :visible.sync="previewShow" width="1200px">
-            <preview :preview-date="previewDate" :big-title="BigTitle" :small-title="smallTitle"></preview>
-            <div class="dialogFooter">
-                <el-button @click="previewShow = false" size="small">关闭</el-button>
-            </div>
-        </el-dialog>
+        <em class="red wrning">
+          *所有操作提交后生效
+        </em>
+      </div>
     </div>
+    <br>
+
+
+    <el-dialog title="增删课程会员" :visible.sync="dialogVisible">
+      <div class="dialogTitle">
+        <span>基础功能</span>
+      </div>
+      <div>
+        <el-transfer filterable v-model="dialogValue" :data="dialogdata"></el-transfer>
+      </div>
+      <div class="dialogFooter">
+        <el-button type="primary" size="small">确定</el-button>
+        <el-button @click="dialogVisible = false" size="small">取消</el-button>
+      </div>
+    </el-dialog>
+
+    <el-dialog title="预览" :visible.sync="previewShow" width="1200px">
+      <preview :preview-date="previewDate" :big-title="BigTitle" :small-title="smallTitle"></preview>
+      <div class="dialogFooter">
+        <el-button @click="previewShow = false" size="small">关闭</el-button>
+      </div>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
-    import Global from '../Global.js'
-    import preview from '@/components/preview.vue'
-
-    import {
-        SttPlanBasicAdd,
-        SttPlanDetailListQuery,
-        SttPlanDetailBatchSave,
-        SttPlanBasicEdit,
-        ClassDetailOne,
-        testTable,
-        testTableLong,
-        testSelect, ClassListQuery, SttPlanPreview
-    } from "../api/getApiRes";
-
-    let qs = require('qs');
-    export default {
-        data() {
-            return {
-                previewShow: false,
-                previewDate: {},
-                BigTitle: '',
-                smallTitle: '',
-                pageTitle: '新增课程表模板',
-                dialogVisible: false,
-                dialogdata: [],
-                dialogValue: [],
-                temId: '',
-                activeName: '1',
-                tableData: [],
-                // panel 配置项目
-                panel: {
-                    name: '',
-                    usercode: '',
-                    username: '',
-                    compname: '',
-                    keyword: '',
-                    USERCODE: '',
-                    taskstatus: 99,
-                    draw: 1,
-                    start: 0,
-                    recordsTotal: 0,
-                    tableData: [],
-                    allTableData: [],
-                    limit: '10',
-                    multipleSort: false,
-                    loading: false,
-                    fileList: [],
-                    multipleSelection: [],
-                    detectedmac: '',
-                    options: [],
-                    time1: globalBt(),
-                },
-                multipleSelection: [],
-                pageination: {
-                    pageItem: 100,
-                    pageoptions: pageOptions(),
-                    total: 100,
-                    pageIndex: 1,
-                },
-                testRow: {
-                    timeLong: [new Date(2016, 9, 10, 8, 40), new Date(2016, 9, 10, 9, 40)],
-                    BeginStr: '08:30',
-                    EndStr: '09:30',
-                    ClassId: '',
-                    TopLimit: 1,
-                    ConsumeHour: 0,
-                },
-                tabs: [
-                    {
-                        tableData: [], days: '1'
-                    },
-                    {
-                        tableData: [
-                            // {name:'1'},
-                        ], days: '2'
-                    },
-                    {
-                        tableData: [], days: '3'
-                    },
-                    {
-                        tableData: [], days: '4'
-                    },
-                    {
-                        tableData: [], days: '5'
-                    },
-                    {
-                        tableData: [], days: '6'
-                    },
-                    {
-                        tableData: [], days: '7'
-                    },
-                ],
-                DataAssemblyRs: []
-            }
+import Global from '../Global.js'
+import preview from '@/components/preview.vue'
+
+import {
+  SttPlanBasicAdd,
+  SttPlanDetailListQuery,
+  SttPlanDetailBatchSave,
+  SttPlanBasicEdit,
+  ClassDetailOne,
+  testTable,
+  testTableLong,
+  testSelect, ClassListQuery, SttPlanPreview
+} from "../api/getApiRes";
+
+let qs = require('qs');
+export default {
+  data() {
+    return {
+      previewShow: false,
+      previewDate: {},
+      BigTitle: '',
+      smallTitle: '',
+      pageTitle: '新增课程表模板',
+      dialogVisible: false,
+      dialogdata: [],
+      dialogValue: [],
+      temId: '',
+      activeName: '1',
+      tableData: [],
+      // panel 配置项目
+      panel: {
+        name: '',
+        usercode: '',
+        username: '',
+        compname: '',
+        keyword: '',
+        USERCODE: '',
+        taskstatus: 99,
+        draw: 1,
+        start: 0,
+        recordsTotal: 0,
+        tableData: [],
+        allTableData: [],
+        limit: '10',
+        multipleSort: false,
+        loading: false,
+        fileList: [],
+        multipleSelection: [],
+        detectedmac: '',
+        options: [],
+        time1: globalBt(),
+      },
+      multipleSelection: [],
+      pageination: {
+        pageItem: 100,
+        pageoptions: pageOptions(),
+        total: 100,
+        pageIndex: 1,
+      },
+      testRow: {
+        timeLong: [new Date(2016, 9, 10, 8, 40), new Date(2016, 9, 10, 9, 40)],
+        BeginStr: '08:30',
+        EndStr: '09:30',
+        ClassId: '',
+        TopLimit: 1,
+        ConsumeHour: 0,
+      },
+      tabs: [
+        {
+          tableData: [], days: '1'
         },
-        mounted() {
-            // 加载课程选项
-            this.panelSelect();
-            if (this.$route.query.id == 0) {
-                this.pageTitle = '新增课程表模板'
-                //  深拷贝赋初始值
-                this.deepValue();
-                this.panel.name = '';
-            } else {
-                this.pageTitle = '编辑课程表模板'
-                // 读取赋值
-                this.getTableQuery();
-            }
+        {
+          tableData: [], days: '2'
         },
-        methods: {
-            // 加载选项
-            panelSelect() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    vipType: '',
-                    start: 1,
-                    expDay: 0,
-                    tableMax: 9999,
-                };
-                let postdata = qs.stringify(param);
-                ClassListQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.panel.options = turnClassResToOption(json.Rs)
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 选择课程后，获取当前课程的建议上课人数和课时消耗
-            getRowTop(row) {
-                let that = this;
-                console.log(row);
-                let param = {
-                    token: localStorage.token,
-                    classId: row.ClassId,
-                };
-                let postdata = qs.stringify(param);
-                ClassDetailOne(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        row.TopLimit = json.Rs.TopLimit;
-                        row.ConsumeHour = json.Rs.ConsumeHour;
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            confirmEditLessonTable() {
-                let that = this;
-                if (!this.panel.name) {
-                    this.$message.error('模板名称不能为空');
-                    return false
-                }
-                if (this.panel.name.length < 3) {
-                    this.$message.error('模板名称不能小于3个字符');
-                    return false
-                }
-                if (this.panel.name.length > 20) {
-                    this.$message.error('模板名称不能大于20个字符');
-                    return false
-                }
-                let param = {
-                    token: localStorage.token,
-                    planId: this.$route.query.id,
-                    planName: this.panel.name
-                };
-                let postdata = qs.stringify(param);
-                SttPlanBasicEdit(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        let id = that.$route.query.id
-                        // 提交课程内容
-                        that.EditLessonTable(id);
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 删除
-            delRow(scope) {
-                let delIndex = parseInt(scope.$index)
-                let curIndex = parseInt(this.activeName) - 1;
-                this.tabs[curIndex].tableData.splice(delIndex, 1)
-            },
-            // 提交课程模板
-            confirmLessonTable() {
-                if (!this.panel.name) {
-                    this.$message.error('模板名称不能为空');
-                    return false
-                }
-                if (this.panel.name.length < 3) {
-                    this.$message.error('模板名称不能小于3个字符');
-                    return false
-                }
-                if (this.panel.name.length > 20) {
-                    this.$message.error('模板名称不能大于20个字符');
-                    return false
-                }
-                // if (!this.checkData()){
-                //     return false
-                // }
-                // console.log('准备完毕了');
-                // return false
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    planName: this.panel.name,
-                };
-                let postdata = qs.stringify(param);
-                SttPlanBasicAdd(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.panel.tabId = json.Id;
-                        // 提交课程内容
-                        that.EditLessonTable(json.Id);
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 数据组装
-            DataAssembly() {
-                let thisRow = {};
-                for (let i = 0; i < this.tabs.length; i++) {
-                    for (let j = 0; j < this.tabs[i].tableData.length; j++) {
-                        thisRow = this.tabs[i].tableData[j];
-                        thisRow.lessonIndex = parseInt(j);
-                        if (planId) {
-                            thisRow.PlanId = parseInt(planId);
-                        } else {
-                            thisRow.PlanId = parseInt(this.$route.query.id);
-                        }
-                        thisRow.WeekDay = parseInt(i + 1);
-                        thisRow.BeginStr = getHoursAndMin(thisRow.timeLong[0]);
-                        thisRow.EndStr = getHoursAndMin(thisRow.timeLong[1]);
-                        this.$delete(thisRow, 'Base');
-                        this.$delete(thisRow, 'SpdId');
-                        this.DataAssemblyRs.push(thisRow)
-                    }
-                }
-            },
-            // 修改课程模板
-            EditLessonTable(planId) {
-                let that = this;
-                // 提交数据
-
-                let planRs = [];
-                let thisRow = {};
-                for (let i = 0; i < this.tabs.length; i++) {
-                    for (let j = 0; j < this.tabs[i].tableData.length; j++) {
-                        thisRow = this.tabs[i].tableData[j];
-                        thisRow.lessonIndex = parseInt(j);
-                        if (planId) {
-                            thisRow.PlanId = parseInt(planId);
-                        } else {
-                            thisRow.PlanId = parseInt(this.$route.query.id);
-                        }
-                        thisRow.WeekDay = parseInt(i + 1);
-                        thisRow.BeginStr = getHoursAndMin(thisRow.timeLong[0]);
-                        thisRow.EndStr = getHoursAndMin(thisRow.timeLong[1]);
-                        this.$delete(thisRow, 'Base');
-                        this.$delete(thisRow, 'SpdId');
-                        planRs.push(thisRow)
-                    }
-                }
-
-                let res = JSON.stringify(planRs);
-                // 如果传入0就用url里的，如果非0就用传入的
-                // let uploadPlanId = planId == 0 ? this.$route.query.id : planId;
-                let param = {
-                    token: localStorage.token,
-                    // planId: this.$route.query.id,
-                    planId: planId,
-                    planRs: res,
-                };
-                let postdata = qs.stringify(param);
-                // 得等数组装完才能校验
-                SttPlanDetailBatchSave(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.$message({
-                            showClose: true,
-                            message: '课程模板已上传成功！',
-                            type: 'success'
-                        });
-                        this.$router.push({
-                            path: '/lessonTable'
-                        });
-                        // this.getTableQuery();
-                    } else {
-                        this.$router.push({
-                            path: '/lessonTable'
-                        });
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 检查数据
-            checkData() {
-                // 目前报错规则：StbId  WeekDay ClassId 不能为空为 0 BeginStr EndStr 必须是5位数字符串
-                let that = this;
-                this.DataAssembly();
-                let tableDate = this.DataAssemblyRs;
-                tableDate.map(function (item) {
-                    if (!item.ClassId) {
-                        let days = numberToWeekdays(item.WeekDay);
-                        let lessonIndex = parseInt(item.lessonIndex + 1);
-                        that.$message.error(days + '第' + lessonIndex + '节课有课程未选择，请选择后再提交');
-                        return false
-                    } else {
-                        return true
-                    }
-                })
-            },
-            // 新增一行
-            addRow() {
-                // 读取当前周几
-                let index = parseInt(this.activeName) - 1;
-                let rows = this.testRow;
-                let res = this.deepClone(rows);
-                this.tabs[index].tableData.push(res);
-            },
-            //  深拷贝赋初始值
-            deepValue() {
-                let that = this;
-                let valus = [
-                    this.testRow
-                    // {BeginStr: '08:30', EndStr: '09:30', ClassId: 0, TopLimit: 0, ConsumeHour: 0},
-                ];
-                this.tabs.map(function (item) {
-                    let res = that.deepClone(valus);
-                    item.tableData = res;
-                })
-            },
-            deepClone(obj) {
-                let _obj = JSON.stringify(obj),
-                    objClone = JSON.parse(_obj);
-                return objClone
-            },
-            handleClick() {
-            },
-            // 增删会员课程
-            lessonStudenChange() {
-                this.dialogVisible = true
-            },
-            handleSelectionChange(val) {
-                this.multipleSelection = val;
-            },
-            // 页面数据查询
-            getTableQuery() {
-                let that = this;
-                that.loading = true;
-                let param = {
-                    token: localStorage.token,
-                    planId: this.$route.query.id,//
-                };
-                this.panel.name = this.$route.query.name;
-                let postdata = qs.stringify(param);
-                SttPlanDetailListQuery(postdata).then(res => {
-                    let json = res;
-                    let Rs = json.Rs
-                    let bt = '';
-                    let et = '';
-                    if (json.Code == 0) {
-                        that.loading = false;
-                        // 清掉上次的记录
-                        for (let i = 0; i < that.tabs.length; i++) {
-                            that.tabs[i].tableData = []
-                        }
-                        if (Rs) {
-                            // 遍历分配
-                            Rs.map(function (item) {
-                                for (let i = 0; i < 7; i++) {
-                                    if (item.WeekDay == i + 1) {
-                                        bt = new Date(2016, 9, 10, item.BeginStr.substr(0, 2), item.BeginStr.substr(3, 2));
-                                        et = new Date(2016, 9, 10, item.EndStr.substr(0, 2), item.EndStr.substr(3, 2));
-                                        item.timeLong = [bt, et];
-                                        that.tabs[i].tableData.push(item);
-
-                                    }
-                                }
-                            })
-                        } else {
-                            that.allTableData = [];
-                            that.recordsTotal = 0;
-                        }
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            seeWeekTemp() {
-                // 只看保存过的
-            },
-            // 去重
-            unique(arr) {
-                const res = new Map();
-                return arr.filter((arr) => !res.has(arr.EndStr) && res.set(arr.EndStr, 1))
-            }
+        {
+          tableData: [], days: '3'
         },
-        watch: {
-            $route(to) {
-                if (to.name == 'EditLessonTable') {
-                    this.temId = this.$route.query.id;
-                    this.panelSelect();
-                }
-            },
-            temId(e) {
-                if (parseInt(e) == 0) {
-                    this.pageTitle = '新增课程表模板'
-                    this.deepValue();
-                    this.panel.name = '';
-                } else {
-                    this.pageTitle = '编辑课程表模板'
-                    this.getTableQuery();
-                }
-            },
+        {
+          tableData: [], days: '4'
         },
-        components: {
-            preview
-        }
-    }
-</script>
-
-<style scoped>
-    @import "../assets/css/panel.css";
-
-    em {
-        font-style: normal;
-    }
-
-    .context {
-        height: 770px;
-
-        overflow-y: scroll;
-
-        display: block;
-        margin: 0 auto;
-        background-color: #fff !important;
-        padding: 30px;
-    }
-
-    .panel-body {
-        padding: 20px;
-        background: #F0F2F5;
-    }
-
-    .change {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding-top: 10px;
-        padding-bottom: 10px;
-    }
-
-    .change button {
-        float: left;
-    }
-
-    .change button.pull-right {
-        float: right;
-    }
-
-    .dialogTitle {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        color: #000000;
-        font-size: 18px;
-        text-align: center;
-    }
-
-    .dialogTitle span {
-        width: 169px;
-        height: 40px;
-        line-height: 40px;
-        text-align: center;
-        color: #fff;
-        background: #3799FF;
-        border-radius: 250px;
-        font-size: 18px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-bottom: 30px;
-    }
-
-    .dialogTitle em {
-        float: none;
-        font-style: normal;
-        color: #3799FF;
-        margin: 0;
-    }
-
-    /deep/ .el-transfer-panel__item .el-checkbox__input {
-        left: 40px;
-    }
-
-    .dialogFooter {
-        width: 90%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-top: 10px;
-    }
-
-    .dialogFooter button {
-        float: right;
-        margin-left: 10px;
-    }
-
-    /deep/ .panel_control .el-input {
-        width: 200px;
-        float: left;
-    }
-
-    .panel_control em {
-        float: left;
-        font-size: 14px;
-        color: #545454;
-        line-height: 45px;
-        margin-right: 10px;
-    }
-
-    .seeTemp {
-        /*position: relative;*/
-        float: right;
-        bottom: 0px;
-        z-index: 22;
-        margin-left: 10px;
-    }
-
-    .table {
-        position: relative;
-        /*top: -50px;*/
-        top: 0px;
-    }
-
-    .el-range-editor.el-input__inner {
-        width: 220px;
-        padding: 3px 6px;
-    }
-
-    .rowBottom {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-top: 10px;
+        {
+          tableData: [], days: '5'
+        },
+        {
+          tableData: [], days: '6'
+        },
+        {
+          tableData: [], days: '7'
+        },
+      ],
+      DataAssemblyRs: [],
+      serachBtnStatus: false,
     }
-
-    .rowBottom button {
-        float: left;
-        margin-right: 10px;
+  },
+  mounted() {
+    // 加载课程选项
+    this.panelSelect();
+    if (this.$route.query.id == 0) {
+      this.pageTitle = '新增课程表模板'
+      //  深拷贝赋初始值
+      this.deepValue();
+      this.panel.name = '';
+    } else {
+      this.pageTitle = '编辑课程表模板'
+      // 读取赋值
+      this.getTableQuery();
     }
+  },
+  methods: {
+    // 加载选项
+    panelSelect() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        vipType: '',
+        start: 1,
+        expDay: 0,
+        tableMax: 9999,
+      };
+      let postdata = qs.stringify(param);
+      ClassListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          if (json.Rs == null) return false
+          that.panel.options = turnClassResToOption(json.Rs)
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 选择课程后，获取当前课程的建议上课人数和课时消耗
+    getRowTop(row) {
+      let that = this;
+      console.log(row);
+      let param = {
+        token: localStorage.token,
+        classId: row.ClassId,
+      };
+      let postdata = qs.stringify(param);
+      ClassDetailOne(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          row.TopLimit = json.Rs.TopLimit;
+          row.ConsumeHour = json.Rs.ConsumeHour;
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    confirmEditLessonTable() {
+      let that = this;
+
+      // 按钮倒计时
+      that.serachBtnStatus = true;
+      let totalTime = 2
+      let clock = window.setInterval(() => {
+        totalTime--
+        if (totalTime < 0) {
+          totalTime = 2;
+          that.serachBtnStatus = false;
+        }
+      }, 1000)
+
+      if (!this.panel.name) {
+        this.$message.error('模板名称不能为空');
+        return false
+      }
+      if (this.panel.name.length < 3) {
+        this.$message.error('模板名称不能小于3个字符');
+        return false
+      }
+      if (this.panel.name.length > 20) {
+        this.$message.error('模板名称不能大于20个字符');
+        return false
+      }
+      let param = {
+        token: localStorage.token,
+        planId: this.$route.query.id,
+        planName: this.panel.name
+      };
+      let postdata = qs.stringify(param);
+      SttPlanBasicEdit(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          let id = that.$route.query.id
+          // 提交课程内容
+          that.EditLessonTable(id);
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 删除
+    delRow(scope) {
+      let delIndex = parseInt(scope.$index)
+      let curIndex = parseInt(this.activeName) - 1;
+      this.tabs[curIndex].tableData.splice(delIndex, 1)
+    },
+    // 提交课程模板
+    confirmLessonTable() {
+      if (!this.panel.name) {
+        this.$message.error('模板名称不能为空');
+        return false
+      }
+      if (this.panel.name.length < 3) {
+        this.$message.error('模板名称不能小于3个字符');
+        return false
+      }
+      if (this.panel.name.length > 20) {
+        this.$message.error('模板名称不能大于20个字符');
+        return false
+      }
+      // if (!this.checkData()){
+      //     return false
+      // }
+      // console.log('准备完毕了');
+      // return false
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        planName: this.panel.name,
+      };
+      let postdata = qs.stringify(param);
+      SttPlanBasicAdd(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.panel.tabId = json.Id;
+          // 提交课程内容
+          that.EditLessonTable(json.Id);
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 数据组装
+    DataAssembly() {
+      let thisRow = {};
+      for (let i = 0; i < this.tabs.length; i++) {
+        for (let j = 0; j < this.tabs[i].tableData.length; j++) {
+          thisRow = this.tabs[i].tableData[j];
+          thisRow.lessonIndex = parseInt(j);
+          if (planId) {
+            thisRow.PlanId = parseInt(planId);
+          } else {
+            thisRow.PlanId = parseInt(this.$route.query.id);
+          }
+          thisRow.WeekDay = parseInt(i + 1);
+          thisRow.BeginStr = getHoursAndMin(thisRow.timeLong[0]);
+          thisRow.EndStr = getHoursAndMin(thisRow.timeLong[1]);
+          this.$delete(thisRow, 'Base');
+          this.$delete(thisRow, 'SpdId');
+          this.DataAssemblyRs.push(thisRow)
+        }
+      }
+    },
+    // 修改课程模板
+    EditLessonTable(planId) {
+      let that = this;
+      // 提交数据
+
+      let planRs = [];
+      let thisRow = {};
+      for (let i = 0; i < this.tabs.length; i++) {
+        for (let j = 0; j < this.tabs[i].tableData.length; j++) {
+          thisRow = this.tabs[i].tableData[j];
+          thisRow.lessonIndex = parseInt(j);
+          if (planId) {
+            thisRow.PlanId = parseInt(planId);
+          } else {
+            thisRow.PlanId = parseInt(this.$route.query.id);
+          }
+          thisRow.WeekDay = parseInt(i + 1);
+          thisRow.BeginStr = getHoursAndMin(thisRow.timeLong[0]);
+          thisRow.EndStr = getHoursAndMin(thisRow.timeLong[1]);
+          this.$delete(thisRow, 'Base');
+          this.$delete(thisRow, 'SpdId');
+          planRs.push(thisRow)
+        }
+      }
+
+      let res = JSON.stringify(planRs);
+      // 如果传入0就用url里的，如果非0就用传入的
+      // let uploadPlanId = planId == 0 ? this.$route.query.id : planId;
+      let param = {
+        token: localStorage.token,
+        // planId: this.$route.query.id,
+        planId: planId,
+        planRs: res,
+      };
+      let postdata = qs.stringify(param);
+      // 得等数组装完才能校验
+      SttPlanDetailBatchSave(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.$message({
+            showClose: true,
+            message: '课程模板已上传成功！',
+            type: 'success'
+          });
+          this.$router.push({
+            path: '/lessonTable'
+          });
+          // 提交后清掉内存里的课表
+          this.clearTableRAM();
+
+          // this.getTableQuery();
+        } else {
+          this.$router.push({
+            path: '/lessonTable'
+          });
+          // 提交后清掉内存里的课表
+          this.clearTableRAM();
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    clearTableRAM() {
+      this.tabs = [
+        {
+          tableData: [], days: '1'
+        },
+        {
+          tableData: [], days: '2'
+        },
+        {
+          tableData: [], days: '3'
+        },
+        {
+          tableData: [], days: '4'
+        },
+        {
+          tableData: [], days: '5'
+        },
+        {
+          tableData: [], days: '6'
+        },
+        {
+          tableData: [], days: '7'
+        },
+      ];
+
+    },
+    // 检查数据
+    checkData() {
+      // 目前报错规则：StbId  WeekDay ClassId 不能为空为 0 BeginStr EndStr 必须是5位数字符串
+      let that = this;
+      this.DataAssembly();
+      let tableDate = this.DataAssemblyRs;
+      tableDate.map(function (item) {
+        if (!item.ClassId) {
+          let days = numberToWeekdays(item.WeekDay);
+          let lessonIndex = parseInt(item.lessonIndex + 1);
+          that.$message.error(days + '第' + lessonIndex + '节课有课程未选择，请选择后再提交');
+          return false
+        } else {
+          return true
+        }
+      })
+    },
+    // 新增一行
+    addRow() {
+      // 读取当前周几
+      let index = parseInt(this.activeName) - 1;
+      let rows = this.testRow;
+      let res = this.deepClone(rows);
+      this.tabs[index].tableData.push(res);
+    },
+    //  深拷贝赋初始值
+    deepValue() {
+      let that = this;
+      let valus = [
+        this.testRow
+        // {BeginStr: '08:30', EndStr: '09:30', ClassId: 0, TopLimit: 0, ConsumeHour: 0},
+      ];
+      this.tabs.map(function (item) {
+        let res = that.deepClone(valus);
+        item.tableData = res;
+      })
+    },
+    deepClone(obj) {
+      let _obj = JSON.stringify(obj),
+          objClone = JSON.parse(_obj);
+      return objClone
+    },
+    handleClick() {
+    },
+    // 增删会员课程
+    lessonStudenChange() {
+      this.dialogVisible = true
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    // 页面数据查询
+    getTableQuery() {
+      let that = this;
+      that.loading = true;
+      let param = {
+        token: localStorage.token,
+        planId: this.$route.query.id,//
+      };
+      this.panel.name = this.$route.query.name;
+      let postdata = qs.stringify(param);
+      SttPlanDetailListQuery(postdata).then(res => {
+        let json = res;
+        let Rs = json.Rs
+        let bt = '';
+        let et = '';
+        if (json.Code == 0) {
+          that.loading = false;
+          // 清掉上次的记录
+          for (let i = 0; i < that.tabs.length; i++) {
+            that.tabs[i].tableData = []
+          }
+          if (Rs) {
+            // 遍历分配
+            Rs.map(function (item) {
+              for (let i = 0; i < 7; i++) {
+                if (item.WeekDay == i + 1) {
+                  bt = new Date(2016, 9, 10, item.BeginStr.substr(0, 2), item.BeginStr.substr(3, 2));
+                  et = new Date(2016, 9, 10, item.EndStr.substr(0, 2), item.EndStr.substr(3, 2));
+                  item.timeLong = [bt, et];
+                  that.tabs[i].tableData.push(item);
 
-    .wrning {
-        float: right;
-        font-size: 12px;
+                }
+              }
+            })
+          } else {
+            that.allTableData = [];
+            that.recordsTotal = 0;
+          }
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    seeWeekTemp() {
+      // 只看保存过的
+    },
+    // 去重
+    unique(arr) {
+      const res = new Map();
+      return arr.filter((arr) => !res.has(arr.EndStr) && res.set(arr.EndStr, 1))
     }
+  },
+  watch: {
+    $route(to) {
+      if (to.name == 'EditLessonTable') {
+        this.temId = this.$route.query.id;
+        this.panelSelect();
+        if (parseInt(this.temId) == 0) {
+          this.pageTitle = '新增课程表模板'
+          this.deepValue();
+          this.panel.name = '';
+        } else {
+          this.pageTitle = '编辑课程表模板'
+          this.getTableQuery();
+          console.log(123);
+        }
+      }
+    },
+  },
+  components: {
+    preview
+  }
+}
+</script>
 
-    .rowBottom button.pull-right {
-        float: right;
-    }
+<style scoped>
+@import "../assets/css/panel.css";
+
+em {
+  font-style: normal;
+}
+
+.context {
+  height: 770px;
+
+  overflow-y: scroll;
+
+  display: block;
+  margin: 0 auto;
+  background-color: #fff !important;
+  padding: 30px;
+}
+
+.panel-body {
+  padding: 20px;
+  background: #F0F2F5;
+}
+
+.change {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
+
+.change button {
+  float: left;
+}
+
+.change button.pull-right {
+  float: right;
+}
+
+.dialogTitle {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  color: #000000;
+  font-size: 18px;
+  text-align: center;
+}
+
+.dialogTitle span {
+  width: 169px;
+  height: 40px;
+  line-height: 40px;
+  text-align: center;
+  color: #fff;
+  background: #3799FF;
+  border-radius: 250px;
+  font-size: 18px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-bottom: 30px;
+}
+
+.dialogTitle em {
+  float: none;
+  font-style: normal;
+  color: #3799FF;
+  margin: 0;
+}
+
+/deep/ .el-transfer-panel__item .el-checkbox__input {
+  left: 40px;
+}
+
+.dialogFooter {
+  width: 90%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-top: 10px;
+}
+
+.dialogFooter button {
+  float: right;
+  margin-left: 10px;
+}
+
+/deep/ .panel_control .el-input {
+  width: 200px;
+  float: left;
+}
+
+.panel_control em {
+  float: left;
+  font-size: 14px;
+  color: #545454;
+  line-height: 45px;
+  margin-right: 10px;
+}
+
+.seeTemp {
+  /*position: relative;*/
+  float: right;
+  bottom: 0px;
+  z-index: 22;
+  margin-left: 10px;
+}
+
+.table {
+  position: relative;
+  /*top: -50px;*/
+  top: 0px;
+}
+
+.el-range-editor.el-input__inner {
+  width: 220px;
+  padding: 3px 6px;
+}
+
+.rowBottom {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-top: 10px;
+}
+
+.rowBottom button {
+  float: left;
+  margin-right: 10px;
+}
+
+.wrning {
+  float: right;
+  font-size: 12px;
+}
+
+.rowBottom button.pull-right {
+  float: right;
+}
 </style>

pc/src/views/Index.vue

@@ -1,127 +1,185 @@
 <template>
-    <div class="IndexContainer">
-        <el-container>
-            <el-aside :class="[{'shortElaside':isCollapse},{'lognElaside':!isCollapse}]">
-                <Navside :isCollapse="isCollapse"></Navside>
-            </el-aside>
-            <el-container>
-                <el-header>
-                    <Headside @lefthide="left_hide"></Headside>
-                </el-header>
-                <el-main>
-                    <keep-alive>
-                        <router-view></router-view>
-                    </keep-alive>
-                </el-main>
-                <el-footer v-if="true"><p class="footer">济南佰意兴网络科技有限公司提供技术支持</p></el-footer>
-            </el-container>
-        </el-container>
-    </div>
+  <div class="IndexContainer">
+    <el-container>
+      <el-aside :class="[{'shortElaside':isCollapse},{'lognElaside':!isCollapse}]">
+        <Navside :isCollapse="isCollapse"></Navside>
+      </el-aside>
+      <el-container>
+        <el-header>
+          <Headside @lefthide="left_hide"></Headside>
+        </el-header>
+        <el-main>
+          <keep-alive>
+            <router-view></router-view>
+          </keep-alive>
+        </el-main>
+        <el-footer v-if="true"><p class="footer">济南佰意兴网络科技有限公司提供技术支持</p></el-footer>
+      </el-container>
+    </el-container>
+  </div>
 </template>
 
 <script>
-    // @ is an alias to /src
-    import Headside from '@/components/Headside.vue'
-    import Navside from '@/components/Navside.vue'
-    import Navs from '../api/Navs';
+// @ is an alias to /src
+import Headside from '@/components/Headside.vue'
+import Navside from '@/components/Navside.vue'
+import Navs from '../api/Navs';
 
-    export default {
-        name: 'Home',
-        data() {
-            return {
-                isCollapse: false,
-                aSideState: false,
-                thisClick: 0,
-                tabwildState: 1,
-                navs: Navs,
-                handleTabsList: [{
-                    title: '系统首页',
-                    name: '1',
-                    clmurl: '/',
-                }],
-                editableTabsValue: '1'
-            }
-        },
-        methods: {
-            left_hide() {
-                this.aSideState = !this.aSideState;
-                this.isCollapse = !this.isCollapse;
-            },
-        },
-        components: {
-            Headside,
-            Navside
-        }
+export default {
+  name: 'Home',
+  data() {
+    return {
+      isCollapse: document.body.clientWidth < 1366,
+      aSideState: false,
+      thisClick: 0,
+      tabwildState: 1,
+      navs: Navs,
+      handleTabsList: [{
+        title: '系统首页',
+        name: '1',
+        clmurl: '/',
+      }],
+      editableTabsValue: '1'
     }
+  },
+  mounted() {
+    // checkScreen
+    if (document.body.clientWidth < 1024) {
+      this.$message.warning('请横屏使用本系统');
+    }
+  },
+  methods: {
+    left_hide() {
+      this.aSideState = !this.aSideState;
+      this.isCollapse = !this.isCollapse;
+    },
+  },
+  components: {
+    Headside,
+    Navside
+  }
+}
 </script>
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style>
-    .el-header {
-        padding: 0 !important;
-        height: 72px !important;
-    }
+.el-header {
+  padding: 0 !important;
+  height: 72px !important;
+}
 
-    .shortElaside {
-        width: 60px !important;
-        overflow: hidden;
-        height: 100%;
-        float: left;
-    }
-
-    .lognElaside {
-        width: 256px !important;
-        overflow: hidden;
-        height: 100%;
-        float: left;
-    }
+.shortElaside {
+  width: 60px !important;
+  overflow: hidden;
+  height: 100%;
+  float: left;
+}
 
-    /deep/ .nav {
-        width: 60px;
-    }
+.lognElaside {
+  width: 256px !important;
+  overflow: hidden;
+  height: 100%;
+  float: left;
+}
 
+/deep/ .nav {
+  width: 60px;
+}
 
+.IndexContainer {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background: #F0F2F5;
+}
 
-    .IndexContainer {
-        position: absolute;
-        top: 0;
-        bottom: 0;
-        left: 0;
-        right: 0;
-        background: #F0F2F5;
-    }
+.IndexContainer > .el-container {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+}
 
-    .IndexContainer > .el-container {
-        width: 100%;
-        height: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-    }
+.footer {
+  position: absolute;
+  bottom: 0px;
+  width: 100%;
+  padding: 10px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  text-align: center;
+  text-indent: -30%;
+  font-size: 12px;
+  color: #BDBDBD;
+  background: #F0F2F5;
+  z-index: 222;
+}
 
-    .footer {
-        position: absolute;
-        bottom: 0px;
-        width: 100%;
-        padding: 10px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        text-align: center;
-        text-indent: -30%;
-        font-size: 12px;
-        color: #BDBDBD;
-        background: #F0F2F5;
-        z-index: 222;
-    }
+.el-main {
+  width: 100%;
+  height: 100%;
+  /*min-height: 800px;*/
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  overflow-y: hidden;
+  padding: 10px 20px;
+}
 
+/*ipad only*/
+@media only screen and (max-width: 1366px) {
+  .lognElaside {
+    width: 70px!important;
+  }
+  .logoContainer img {
+    display: none!important;
+  }
   .el-main {
-        width: 100%;
-        min-height: 800px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        overflow-y: hidden;
-        padding: 10px 20px;
-    }
+    padding: 3px!important;
+    overflow-y: scroll;
+  }
+  .el-main > .context {
+    /*height: 640px;*/
+    /*overflow-y: scroll;*/
+    padding: 6px!important;
+  }
+  .table {
+    /*width: 950px;*/
+    /*overflow-x: scroll;*/
+  }
+  .el-dialog {
+    max-width: 960px;
+  }
+  .el-dialog__body {
+    padding: 3px;
+  }
+  .el-transfer__buttons {
+    width: 60px;
+    padding: 3px;
+  }
+  .el-transfer .el-button + .el-button {
+    float: right;
+  }
+  .el-container.is-vertical {
+    position: absolute;
+    left: 60px;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    height: 100%;
+  }
+  .context {
+    border-radius: 12px;
+    height: 823px!important;
+    overflow-y: scroll;
+  }
+  .el-dialog {
+    padding: 5px;
+    padding-bottom: 15px;
+  }
+}
 </style>

pc/src/views/Lesson.vue

@@ -1,865 +1,878 @@
 <template>
-    <div class="context">
-        <div class="panel">
-            <h5>课程管理</h5>
-        </div>
-        <div class="change">
-            <el-button type="primary" @click="addLesson" v-if="userLevel != 4">新增课程</el-button>
-            <el-button @click="lessonStudenChange" v-if="userLevel != 4">增删课程会员</el-button>
-            <el-button @click="delList" v-if="userLevel != 4">删除</el-button>
-            <el-button @click="query">刷新</el-button>
-        </div>
-        <div class="table">
-            <el-table
-                    :data="tableData"
-                    border
-                    is-horizontal-resize
-                    :default-sort="{prop: 'date', order: 'descending'}"
-                    element-loading-background="rgba(0, 0, 0, 0.8)"
-                    @selection-change="handleSelectionChange"
-                    @current-change="clickChange"
+  <div class="context">
+    <div class="panel">
+      <h5>课程管理</h5>
+    </div>
+    <div class="change">
+      <el-button type="primary" @click="addLesson" v-if="userLevel != 4">新增课程</el-button>
+      <el-button @click="lessonStudenChange" v-if="userLevel != 4">增删课程会员</el-button>
+      <el-button @click="delList" v-if="userLevel != 4">删除</el-button>
+      <el-button @click="query" :disabled="serachBtnStatus">刷新</el-button>
+    </div>
+    <div class="table">
+      <el-table
+          :data="tableData"
+          border
+          is-horizontal-resize
+          :default-sort="{prop: 'date', order: 'descending'}"
+          element-loading-background="rgba(0, 0, 0, 0.8)"
+          @selection-change="handleSelectionChange"
+          @current-change="clickChange"
+      >
+        >
+        <el-table-column label="选择" width="55">
+          <template slot-scope="scope">
+            <el-radio v-model="tableRadio" :label="scope.row"><i></i></el-radio>
+          </template>
+        </el-table-column>
+        <el-table-column
+            type="index"
+            label="序号"
+            align="center"
+
+            width="50">
+        </el-table-column>
+        <el-table-column
+            prop="ClassSelf.ClassName"
+            label="课程名称"
+        >
+        </el-table-column>
+        <el-table-column
+            prop="ClassSelf.ClassType"
+            label="是否跨店"
+            width="110"
+            align="center"
+            sortable
+        >
+          <template slot-scope="scope">
+            <span v-if="scope.row.ClassSelf.ClassType == 1">是</span>
+            <span v-if="scope.row.ClassSelf.ClassType == 0">否</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="ClassSelf.ShopId"
+            label="课程类型"
+            width="110"
+            align="center"
+            sortable
+        >
+          <template slot-scope="scope">
+            <span v-if="scope.row.ClassSelf.ClassType != 0">占用课时</span>
+            <span v-if="scope.row.ClassSelf.ClassType == 0">不占课时</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="ClassSelf.ConsumeHour"
+            label="消耗课时"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="ClassSelf.TopLimit"
+            label="建议上课人数"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="ClassSelf.WxVisible"
+            label="微信可见"
+            v-if="userLevel != 4"
+        >
+          <template slot-scope="scope">
+            <el-switch
+                v-model="scope.row.ClassSelf.WxVisible"
+                :active-value="1"
+                :inactive-value="0"
+                active-color="#409EFF"
+                inactive-color="#D9D9D9"
+                @change=changeWechat($event,scope.row.ClassSelf)
             >
-                >
-                <el-table-column label="选择" width="55">
-                    <template slot-scope="scope">
-                        <el-radio v-model="tableRadio" :label="scope.row"><i></i></el-radio>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        type="index"
-                        label="序号"
-                        align="center"
-
-                        width="50">
-                </el-table-column>
-                <el-table-column
-                        prop="ClassSelf.ClassName"
-                        label="课程名称"
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="ClassSelf.ClassType"
-                        label="是否跨店"
-                        width="110"
-                        align="center"
-                        sortable
-                >
-                    <template slot-scope="scope">
-                        <span v-if="scope.row.ClassSelf.ClassType == 1">是</span>
-                        <span v-if="scope.row.ClassSelf.ClassType == 0">否</span>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="ClassSelf.ShopId"
-                        label="课程类型"
-                        width="110"
-                        align="center"
-                        sortable
-                >
-                    <template slot-scope="scope">
-                        <span v-if="scope.row.ClassSelf.ClassType != 0">占用课时</span>
-                        <span v-if="scope.row.ClassSelf.ClassType == 0">不占课时</span>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="ClassSelf.ConsumeHour"
-                        label="消耗课时"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="ClassSelf.TopLimit"
-                        label="建议上课人数"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="ClassSelf.WxVisible"
-                        label="微信可见"
-                        v-if="userLevel != 4"
-                >
-                    <template slot-scope="scope">
-                        <el-switch
-                                v-model="scope.row.ClassSelf.WxVisible"
-                                :active-value="1"
-                                :inactive-value="0"
-                                active-color="#409EFF"
-                                inactive-color="#D9D9D9"
-                                @change=changeWechat($event,scope.row.ClassSelf)
-                        >
-                        </el-switch>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="ClassSelf.ClassColor"
-                        label="课程颜色"
-                        width="110"
-                        v-if="userLevel != 4"
-                >
-                    <template slot-scope="scope">
-                        <el-color-picker :predefine="predefineColors"  v-model="scope.row.ClassSelf.ClassColor"
-                                         @change="changeColor(scope.row.ClassSelf.ClassColor,scope.row.ClassSelf)"></el-color-picker>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="ClassSelf.Memo"
-                        label="备注">
-                    <template slot-scope="scope">
-                        <el-popover
-                                placement="top"
-                                title="标题"
-                                width="200"
-                                trigger="hover"
-                                :content="scope.row.ClassSelf.Memo">
+            </el-switch>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="ClassSelf.ClassColor"
+            label="课程颜色"
+            width="110"
+            v-if="userLevel != 4"
+        >
+          <template slot-scope="scope">
+            <el-color-picker :predefine="predefineColors" v-model="scope.row.ClassSelf.ClassColor"
+                             @change="changeColor(scope.row.ClassSelf.ClassColor,scope.row.ClassSelf)"></el-color-picker>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="ClassSelf.Memo"
+            label="备注">
+          <template slot-scope="scope">
+            <el-popover
+                placement="top"
+                title="标题"
+                width="200"
+                trigger="hover"
+                :content="scope.row.ClassSelf.Memo">
                             <span slot="reference"
-                                  v-if="scope.row.ClassSelf.Memo.length > 6">{{scope.row.ClassSelf.Memo.substr(0,6)}} ....</span>
-                        </el-popover>
-                        <span v-if="scope.row.ClassSelf.Memo.length <= 6">{{scope.row.ClassSelf.Memo}}</span>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="ClassSelf.ClassId"
-                        label="操作"
-                >
-                    <template slot-scope="scope">
-                        <el-button type="text" @click="editLesson(scope.row.ClassSelf)" v-if="userLevel != 4">编辑</el-button>
-                        <el-button type="text" @click="Lessonmember(scope.row.Userlist)">课程会员</el-button>
-                    </template>
-                </el-table-column>
-
-            </el-table>
-            <br>
-            <el-pagination
-                    background
-                    :total="pageination.total"
-                    :page-size="pageination.pageItem"
-                    @current-change="pageChange"
-            ></el-pagination>
-        </div>
-
-        <el-dialog :title="dialogTitle" :visible.sync="dialogLesson" :width="form.btnType == 0? '1200px':'650px'">
-            <div>
-                <div class="pull-left">
-                    <el-form ref="form" :model="form" label-width="160px">
-                        <el-form-item label="课程名称" :required="true">
-                            <el-input v-model="form.ClassName"></el-input>
-                        </el-form-item>
-                        <el-form-item label="消耗课时">
-                            <el-input-number v-model="form.ConsumeHour" :min="0" :max="99999"
-                                             label="（天）"></el-input-number>
-                        </el-form-item>
-                        <el-form-item label="建议上课人数">
-                            <el-input-number v-model="form.TopLimit" :min="0" :max="99999"
-                                             label="（天）"></el-input-number>
-                        </el-form-item>
-                        <el-form-item label="微信可见" >
-                            <el-switch
-                                    v-model="form.wxVisible"
-                                    :active-value="1"
-                                    :inactive-value="0"
-                                    active-color="#409EFF"
-                                    inactive-color="#D9D9D9">
-                            </el-switch>
-                        </el-form-item>
-                        <el-form-item label="是否可选课">
-                            <el-switch
-                                    v-model="form.classType"
-                                    :active-value="1"
-                                    :inactive-value="0"
-                                    active-color="#409EFF"
-                                    inactive-color="#D9D9D9">
-                            </el-switch>
-                        </el-form-item>
-                        <!--<el-form-item label="是否跨店">-->
-                            <!--<el-switch-->
-                                    <!--v-model="form.allUse"-->
-                                    <!--:active-value="0"-->
-                                    <!--:inactive-value="1"-->
-                                    <!--active-color="#409EFF"-->
-                                    <!--inactive-color="#D9D9D9"-->
-                                    <!--:disabled="true"-->
-                            <!--&gt;-->
-                            <!--</el-switch>-->
-                        <!--</el-form-item>-->
-                        <el-form-item label="课程颜色">
-                            <el-color-picker :predefine="predefineColors"  v-model="form.ClassColor" ></el-color-picker>
-                        </el-form-item>
-                        <el-form-item label="备注">
-                            <el-input v-model="form.Memo"></el-input>
-                        </el-form-item>
-                    </el-form>
-                </div>
-                <div class="pull-right" v-if="form.btnType == 0">
-                    <el-form ref="form" :model="form" label-width="160px">
-                        <el-form-item label="课程会员人数">
-                            <el-transfer filterable v-model="form.dialogValue" :data="form.dialogdata"
-                                         :titles="['全部会员','已选会员']"></el-transfer>
-                        </el-form-item>
-                    </el-form>
-                </div>
-            </div>
-            <div class="dialogFooter">
-                <el-button type="primary" size="small" v-if="form.btnType == 0" @click="confirmAddLesson">确定</el-button>
-                <el-button type="primary" size="small" v-if="form.btnType == 1" @click="confirmEditLesson">确定
-                </el-button>
-                <el-button size="small" @click="dialogLesson = false">取消</el-button>
-            </div>
-        </el-dialog>
-
-        <el-dialog title="增删课程会员" :visible.sync="dialogVisible" width="650px">
-            <div class="dialogTitle">
-                <span>基础功能</span>
-            </div>
-            <div>
-                <el-transfer filterable v-model="dialogValue" :data="form.dialogdata"
-                             :titles="['会员列表', '已添加会员']"></el-transfer>
-            </div>
-            <div class="dialogFooter">
-                <el-button type="primary" size="small" @click="cofirmClassVipuserEdit">确定</el-button>
-                <el-button @click=" dialogVisible = false" size="small">取消</el-button>
-            </div>
-        </el-dialog>
-
-        <el-dialog title="课程会员" :visible.sync="dialogTableVisible" style="overflow-y: scroll">
-            <el-table :data="gridData">
-                <el-table-column property="Name" label="姓名" width="200"></el-table-column>
-                <el-table-column property="Phone" label="手机"></el-table-column>
-                <el-table-column property="VipType" label="会员类型">
-                    <template slot-scope="scope">
-                        <span v-if="scope.row.VipType == 1">年费会员</span>
-                        <span v-if="scope.row.VipType == 2">充值会员</span>
-                    </template>
-                </el-table-column>
-                <el-table-column property="ExpTime" label="有效期" :formatter="filterFmtDate"></el-table-column>
-            </el-table>
-        </el-dialog>
+                                  v-if="scope.row.ClassSelf.Memo.length > 6">{{ scope.row.ClassSelf.Memo.substr(0, 6) }} ....</span>
+            </el-popover>
+            <span v-if="scope.row.ClassSelf.Memo.length <= 6">{{ scope.row.ClassSelf.Memo }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="ClassSelf.ClassId"
+            label="操作"
+        >
+          <template slot-scope="scope">
+            <el-button type="text" @click="editLesson(scope.row.ClassSelf)" v-if="userLevel != 4">编辑</el-button>
+            <el-button type="text" @click="Lessonmember(scope.row.Userlist)">课程会员</el-button>
+          </template>
+        </el-table-column>
+
+      </el-table>
+      <br>
+      <el-pagination
+          background
+          :total="pageination.total"
+          :page-size="pageination.pageItem"
+          @current-change="pageChange"
+      ></el-pagination>
     </div>
+
+    <el-dialog :title="dialogTitle" :visible.sync="dialogLesson" :width="form.btnType == 0? '1200px':'650px'">
+      <div>
+        <div class="pull-left">
+          <el-form ref="form" :model="form" label-width="160px">
+            <el-form-item label="课程名称" :required="true">
+              <el-input v-model="form.ClassName"></el-input>
+            </el-form-item>
+            <el-form-item label="消耗课时">
+              <el-input-number v-model="form.ConsumeHour" :min="0" :max="99999"
+                               label="（天）"></el-input-number>
+            </el-form-item>
+            <el-form-item label="建议上课人数">
+              <el-input-number v-model="form.TopLimit" :min="0" :max="99999"
+                               label="（天）"></el-input-number>
+            </el-form-item>
+            <el-form-item label="微信可见">
+              <el-switch
+                  v-model="form.wxVisible"
+                  :active-value="1"
+                  :inactive-value="0"
+                  active-color="#409EFF"
+                  inactive-color="#D9D9D9">
+              </el-switch>
+            </el-form-item>
+            <el-form-item label="是否可选课">
+              <el-switch
+                  v-model="form.classType"
+                  :active-value="1"
+                  :inactive-value="0"
+                  active-color="#409EFF"
+                  inactive-color="#D9D9D9">
+              </el-switch>
+            </el-form-item>
+            <!--<el-form-item label="是否跨店">-->
+            <!--<el-switch-->
+            <!--v-model="form.allUse"-->
+            <!--:active-value="0"-->
+            <!--:inactive-value="1"-->
+            <!--active-color="#409EFF"-->
+            <!--inactive-color="#D9D9D9"-->
+            <!--:disabled="true"-->
+            <!--&gt;-->
+            <!--</el-switch>-->
+            <!--</el-form-item>-->
+            <el-form-item label="课程颜色">
+              <el-color-picker :predefine="predefineColors" v-model="form.ClassColor"></el-color-picker>
+            </el-form-item>
+            <el-form-item label="备注">
+              <el-input v-model="form.Memo"></el-input>
+            </el-form-item>
+          </el-form>
+        </div>
+        <div class="pull-right" v-if="form.btnType == 0">
+          <el-form ref="form" :model="form" label-width="160px">
+            <el-form-item label="课程会员">
+              <el-transfer filterable v-model="form.dialogValue" :data="form.dialogdata"
+                           :titles="['全部会员','已选会员']"></el-transfer>
+            </el-form-item>
+          </el-form>
+        </div>
+      </div>
+      <div class="dialogFooter">
+        <el-button type="primary" size="small" v-if="form.btnType == 0" @click="confirmAddLesson">确定</el-button>
+        <el-button type="primary" size="small" v-if="form.btnType == 1" @click="confirmEditLesson">确定
+        </el-button>
+        <el-button size="small" @click="dialogLesson = false">取消</el-button>
+      </div>
+    </el-dialog>
+
+    <el-dialog title="增删课程会员" :visible.sync="dialogVisible" width="650px">
+      <div class="dialogTitle">
+        <span>基础功能</span>
+      </div>
+      <div>
+        <el-transfer filterable v-model="dialogValue" :data="form.dialogdata"
+                     :titles="['会员列表', '已添加会员']"></el-transfer>
+      </div>
+      <div class="dialogFooter">
+        <el-button type="primary" size="small" @click="cofirmClassVipuserEdit">确定</el-button>
+        <el-button @click=" dialogVisible = false" size="small">取消</el-button>
+      </div>
+    </el-dialog>
+
+    <el-dialog title="课程会员" :visible.sync="dialogTableVisible" style="overflow-y: scroll">
+      <el-table :data="gridData">
+        <el-table-column property="Name" label="姓名" width="200"></el-table-column>
+        <el-table-column property="Phone" label="手机"></el-table-column>
+        <el-table-column property="VipType" label="会员类型">
+          <template slot-scope="scope">
+            <span v-if="scope.row.VipType == 1">年费会员</span>
+            <span v-if="scope.row.VipType == 2">充值会员</span>
+          </template>
+        </el-table-column>
+        <el-table-column property="ExpTime" label="有效期" :formatter="filterFmtDate"></el-table-column>
+      </el-table>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
-    import Global from '../Global.js'
-    import {
-        ClassAdd,
-        ClassEdit,
-        ClassListQuery,
-        ClassColorEdit,
-        ClassStatusEdit,
-        VipUserListQuery,
-        ClassVisibleStatusEdit,
-        ClassVipuserQuery,
-        ClassVipuserEdit,
-        testTable,
-        testSelect
-    } from "../api/getApiRes";
-
-    let qs = require('qs');
-    export default {
-        data() {
-            return {
-                dialogLesson: false,//新增课程
-                dialogVisible: false,
-                dialogTableVisible: false,
-                dialogTitle: '',
-                dialogdata: [],
-                gridData: [],
-                dialogValue: [],
-                allTableData: [],
-                // panel 配置项目
-                panel: {
-                    usercode: '',
-                    username: '',
-                    compname: '',
-                    keyword: '',
-                    USERCODE: '',
-                    taskstatus: 99,
-                    tableData: [],
-                    allTableData: [],
-                    draw: 1,
-                    start: 0,
-                    recordsTotal: 0,
-                    limit: '10',
-                    multipleSort: false,
-                    loading: false,
-                    fileList: [],
-                    multipleSelection: [],
-                    detectedmac: '',
-                    options: [
-                        {value: 99, label: '全部'},
-                        {value: 1, label: '进行中'},
-                        {value: 2, label: '已完成'},
-                    ],
-                    time1: globalBt(),
-                },
-                form: {
-                    ClassName: "",
-                    ConsumeHour: 0,
-                    TopLimit: 0,
-                    wxVisible: 1,
-                    classType: 1,
-                    ClassColor: "#ffffff",
-                    teacherId: "",
-                    classId: "",
-                    allUse: "",
-                    Memo: "",
-                    dialogdata: [],//穿梭待选
-                    dialogValue: [],//穿梭已选
-                },
-                multipleSelection: [],
-                pageination: {
-                    pageItem: 100,
-                    pageoptions: pageOptions(),
-                    total: 100,
-                    pageIndex: 1,
-                },
-                tableData: [],
-                tableRadio: [],
-                userLevel:localStorage.userLevel,
-                predefineColors: [
-                    '#8ABFF7',
-                    '#73C1BC',
-                    '#ADE5C7',
-                    '#CBECF0',
-                    '#DCEDC8',
-                    '#EBF2DB',
-                    '#C9D1FD',
-                    '#C6ACF4',
-                    '#E2B5FA',
-                    '#E1BEE7',
-                    '#FFA5D9',
-                    '#F89A9A',
-                    '#F2B1AC',
-                    '#F8BBD0',
-                    '#FFCDD2',
-                    '#FCC66C',
-                    '#D6B9A7',
-                    '#D9D9C4',
-                    '#FCECBE',
-                    '#E9E9E9',
-                ]
-            }
-        },
-        mounted() {
-            this.panelSelect();
-            this.getTableQuery();
-        },
-        methods: {
-            clickChange(item) {
-                this.tableRadio = item
-            },
-
-            // 课程会员增删
-            cofirmClassVipuserEdit() {
-                let that = this;
-                let userlist = that.dialogValue.toString();
-                let param = {
-                    token: localStorage.token,
-                    classId: this.form.classId,
-                    userlist: userlist,
-                };
-                let postdata = qs.stringify(param);
-                ClassVipuserEdit(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.$message({
-                            showClose: true,
-                            message: '接口修改成功！',
-                            type: 'success'
-                        });
-                        that.dialogVisible = false;
-                        that.getTableQuery();
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 确认添加课程
-            confirmAddLesson() {
-                let that = this;
-
-                // checkNum
-                if (!that.form.ClassName) {
-                    this.$message.error('错了哦，课程名称不能为空');
-                    return false
-                }
-                if (that.form.ClassName.length > 20) {
-                    this.$message.error('错了哦，课程名称字数超过20个字');
-                    return false
-                }
-                if (that.form.Memo) {
-                    if (that.form.Memo.length > 200) {
-                        this.$message.error('错了哦，备注字数超过200个字');
-                        return false
-                    }
-                }
-
-                let userlist = that.form.dialogValue.toString();
-                let param = {
-                    token: localStorage.token,
-                    shopId: localStorage.shopId,
-                    className: that.form.ClassName,
-                    consumeHour: that.form.ConsumeHour,
-                    topLimit: that.form.TopLimit,
-                    classType: that.form.classType,
-                    wxVisible: that.form.wxVisible,
-                    classColor: that.form.ClassColor,
-                    userlist: userlist,
-                    teacherId: 0,//预留
-                    memo: that.form.Memo,
-                };
-                let postdata = qs.stringify(param);
-                ClassAdd(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogLesson = false;
-                        // 重载列表
-                        that.getTableQuery();
-                        that.$message({
-                            showClose: true,
-                            message: '添加课程成功！',
-                            type: 'success'
-                        });
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            confirmEditLesson() {
-                let that = this;
-                // checkNum
-                if (!that.form.ClassName) {
-                    this.$message.error('错了哦，课程名称不能为空');
-                    return false
-                }
-                if (that.form.ClassName.length > 20) {
-                    this.$message.error('错了哦，课程名称字数超过20个字');
-                    return false
-                }
-                if (that.form.Memo) {
-                    if (that.form.Memo.length > 200) {
-                        this.$message.error('错了哦，备注字数超过200个字');
-                        return false
-                    }
-                }
-
-                let teacherId = that.form.dialogValue ? that.form.dialogValue.toString() : '';
-                // 通用是0，非通用是shopid
-                let shopId = that.form.allUse == 0 ? 0 : localStorage.ShopId;
-                let param = {
-                    token: localStorage.token,
-                    shopId: shopId,
-                    classId: that.form.classId,
-                    className: that.form.ClassName,
-                    consumeHour: that.form.ConsumeHour,
-                    topLimit: that.form.TopLimit,
-                    classType: that.form.classType,
-                    wxVisible: that.form.wxVisible,
-                    classColor: that.form.ClassColor,
-                    teacherId: teacherId,
-                    memo: that.form.Memo,
-                };
-                let postdata = qs.stringify(param);
-                ClassEdit(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogLesson = false;
-                        // 重载列表
-                        that.getTableQuery();
-                        that.$message({
-                            showClose: true,
-                            message: '会员课程调整成功！',
-                            type: 'success'
-                        });
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 新增课程
-            addLesson() {
-                this.form.btnType = 0; //新增
-                // clear
-                this.form.ClassName = '';
-                this.form.ConsumeHour = 0;
-                this.form.TopLimit = 0;
-                this.form.wxVisible = 1;
-                this.form.ClassColor = "#ffffff";
-                this.form.Memo = "";
-                this.form.dialogValue = [];
-                this.dialogLesson = true;
-                this.dialogTitle = '新增课程'
-                this.panelSelect();
-            },
-            // 改色
-            changeColor(c, row) {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    classId: row.ClassId,//
-                    classColor: c,//
-                };
-                let postdata = qs.stringify(param);
-                ClassColorEdit(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.$message({
-                            showClose: true,
-                            message: '课程颜色已编辑',
-                            type: 'success'
-                        });
-                        // 重载列表
-                        that.getTableQuery();
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 删除
-            delList() {
-                let that = this;
-                if (this.tableRadio.length == 0) {
-                    this.$message.error("请先选中一条记录");
-                    return false
-                }
-                let row = that.tableRadio;
-                let param = {
-                    token: localStorage.token,
-                    classId: row.ClassSelf.ClassId,
-                    status: 9,//0禁用1启用9删除
-                };
-                let postdata = qs.stringify(param);
-
-                this.$confirm('此操作将永久删除该课程, 是否继续?', '提示', {
-                    confirmButtonText: '确定',
-                    cancelButtonText: '取消',
-                    type: 'warning'
-                }).then(() => {
-                    ClassStatusEdit(postdata).then(res => {
-                        let json = res;
-                        if (json.Code == 0) {
-                            that.$message({
-                                showClose: true,
-                                message: '选中的课程已删除！',
-                                type: 'success'
-                            });
-                            // 重载列表
-                            that.getTableQuery();
-                        } else {
-                            that.$message.error(json.Memo);
-                        }
-                    });
-                }).catch(() => {
-                    this.$message({
-                        type: 'info',
-                        message: '已取消删除'
-                    });
-                });
-            },
-            // 加载选项
-            panelSelect() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    vipType: '',
-                    start: 1,
-                    expDay: '',
-                    tableMax: 9999,
-                };
-                let postdata = qs.stringify(param);
-                VipUserListQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // that.dialogdata = json.Rs;
-                        that.form.dialogdata = turnResToOption(json.Rs)
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 微信可见与否
-            changeWechat(e, row) {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    classId: row.ClassId,//
-                    wxVisible: e,//
-                };
-                let postdata = qs.stringify(param);
-                ClassVisibleStatusEdit(postdata).then(res => {
-                    let json = res;
-                    let text = parseInt(e) == 1 ? '可见' : '不可见';
-                    if (json.Code == 0) {
-                        that.$message({
-                            showClose: true,
-                            message: '当前用户微信已' + text,
-                            type: 'success'
-                        });
-                        // 重载列表
-                        that.getTableQuery();
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 增删会员课程
-            lessonStudenChange() {
-                this.panelSelect();
-                if (this.tableRadio.length == 0) {
-                    this.$message.error("请先选中一条记录");
-                    return false
-                }
-                let row = this.tableRadio;
-                let userArrary = [];
-                row.Userlist.map(function (item) {
-                    userArrary.push(item.Id)
-                });
-                this.form.classId = row.ClassSelf.ClassId;
-                this.dialogValue = userArrary;
-                this.dialogVisible = true
-                // 读取左侧会员列表
-            },
-            handleSelectionChange(val) {
-                this.multipleSelection = val;
-            },
-            clearForm() {
-                // clear
-                this.form.ClassName = '';
-                this.form.ConsumeHour = 0;
-                this.form.TopLimit = 0;
-                this.form.wxVisible = 1;
-                this.form.ClassColor = '';
-                this.form.Memo = '';
-            },
-            // 编辑
-            editLesson(row) {
-                let that = this;
-                this.clearForm();
-                this.form.btnType = 1; //编辑
-                this.form.ClassName = row.ClassName;
-                this.form.ConsumeHour = row.ConsumeHour;
-                this.form.TopLimit = row.TopLimit;
-                this.form.wxVisible = row.WxVisible;
-                this.form.ClassColor = row.ClassColor;
-                this.form.Memo = row.Memo;
-                this.form.dialogValue = row.teacherId;
-                this.form.classId = row.ClassId
-                this.form.ShopId = row.ShopId;
-                this.form.allUse = row.ShopId;
-                this.dialogLesson = true;
-                // 读取已选的会员
-                console.log(row);
-                this.form.dialogValue = [];
-
-                this.dialogTitle = '编辑课程'
-            },
-            Lessonmember(Userlist) {
-                this.dialogTableVisible = true;
-                this.gridData = Userlist;
-            },
-            // 查询按钮
-            query() {
-                this.getTableQuery();
-                this.$message.success('查询完毕');
-            },
-            // 页面数据查询
-            getTableQuery() {
-                let that = this;
-                that.loading = true;
-                let param = {
-                    token: localStorage.token,
-                    supregionid: 0,//
-                    regionid: this.panel.regionid,//
-                    comid: 1,//
-                    tagname: that.panel.tagname,//标签名
-                    start: 1,//
-                    tableMax: 9999,//
-                };
-                let postdata = qs.stringify(param);
-                ClassListQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.loading = false;
-                        if (json.Rs) {
-                            that.allTableData = json.Rs;
-                            that.recordsTotal = json.Rs.length;
-                        } else {
-                            that.allTableData = [];
-                            that.recordsTotal = 0;
-                        }
-
-                        // 设置分页数据
-                        that.setPaginations();
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 设置分页数据
-            setPaginations() {
-                // 分页属性
-                let that = this;
-                that.pageination.total = that.recordsTotal;
-                // 默认分页
-                that.tableData = that.allTableData.filter((item, index) => {
-                    return index < that.pageination.pageItem;
-                });
-            },
-            // 每页显示数量
-            handleSizeChange() {
-                let that = this;
-                that.tableData = that.allTableData.filter((item, index) => {
-                    return index < that.pageination.pageItem;
-                });
-                that.draw = that.pageination.pageItem;
-                that.getTableQuery();
-            },
-            // 翻页
-            pageChange(pageIndex) {
-                let that = this;
-                // 获取当前页
-                let index = that.pageination.pageItem * (pageIndex - 1);
-                // 数据总数
-                let nums = that.pageination.pageItem * pageIndex;
-                // 容器
-                let tables = [];
-                for (var i = index; i < nums; i++) {
-                    if (that.allTableData[i]) {
-                        tables.push(that.allTableData[i])
-                    }
-                    this.tableData = tables;
-                }
-                that.start = index * that.draw;
-                that.getTableQuery();
-            },
-            // 过滤时间
-            filterFmtDate(value, row, column) {
-                let that = this;
-                if (column == "0001-01-01T08:05:43+08:05") {
-                    return '无有效期';
-                } else {
-                    return nonTfmtDate(column, 11);
-                }
-            },
-        },
-        watch: {
-            $route(to) {
-                if (to.name == 'Lesson') {
-                    this.panelSelect();
-                    this.getTableQuery();
-                }
-            },
-        },
+import Global from '../Global.js'
+import {
+  ClassAdd,
+  ClassEdit,
+  ClassListQuery,
+  ClassColorEdit,
+  ClassStatusEdit,
+  VipUserListQuery,
+  ClassVisibleStatusEdit,
+  ClassVipuserQuery,
+  ClassVipuserEdit,
+  testTable,
+  testSelect
+} from "../api/getApiRes";
+
+let qs = require('qs');
+export default {
+  data() {
+    return {
+      serachBtnStatus: false,
+      dialogLesson: false,//新增课程
+      dialogVisible: false,
+      dialogTableVisible: false,
+      dialogTitle: '',
+      dialogdata: [],
+      gridData: [],
+      dialogValue: [],
+      allTableData: [],
+      // panel 配置项目
+      panel: {
+        usercode: '',
+        username: '',
+        compname: '',
+        keyword: '',
+        USERCODE: '',
+        taskstatus: 99,
+        tableData: [],
+        allTableData: [],
+        draw: 1,
+        start: 0,
+        recordsTotal: 0,
+        limit: '10',
+        multipleSort: false,
+        loading: false,
+        fileList: [],
+        multipleSelection: [],
+        detectedmac: '',
+        options: [
+          {value: 99, label: '全部'},
+          {value: 1, label: '进行中'},
+          {value: 2, label: '已完成'},
+        ],
+        time1: globalBt(),
+      },
+      form: {
+        ClassName: "",
+        ConsumeHour: 0,
+        TopLimit: 0,
+        wxVisible: 1,
+        classType: 1,
+        ClassColor: "#ffffff",
+        teacherId: "",
+        classId: "",
+        allUse: "",
+        Memo: "",
+        dialogdata: [],//穿梭待选
+        dialogValue: [],//穿梭已选
+      },
+      multipleSelection: [],
+      pageination: {
+        pageItem: 100,
+        pageoptions: pageOptions(),
+        total: 100,
+        pageIndex: 1,
+      },
+      tableData: [],
+      tableRadio: [],
+      userLevel: localStorage.userLevel,
+      predefineColors: [
+        '#8ABFF7',
+        '#73C1BC',
+        '#ADE5C7',
+        '#CBECF0',
+        '#DCEDC8',
+        '#EBF2DB',
+        '#C9D1FD',
+        '#C6ACF4',
+        '#E2B5FA',
+        '#E1BEE7',
+        '#FFA5D9',
+        '#F89A9A',
+        '#F2B1AC',
+        '#F8BBD0',
+        '#FFCDD2',
+        '#FCC66C',
+        '#D6B9A7',
+        '#D9D9C4',
+        '#FCECBE',
+        '#E9E9E9',
+      ]
     }
+  },
+  mounted() {
+    this.panelSelect();
+    this.getTableQuery();
+  },
+  methods: {
+    clickChange(item) {
+      this.tableRadio = item
+    },
+
+    // 课程会员增删
+    cofirmClassVipuserEdit() {
+      let that = this;
+      let userlist = that.dialogValue.toString();
+      let param = {
+        token: localStorage.token,
+        classId: this.form.classId,
+        userlist: userlist,
+      };
+      let postdata = qs.stringify(param);
+      ClassVipuserEdit(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.$message({
+            showClose: true,
+            message: '接口修改成功！',
+            type: 'success'
+          });
+          that.dialogVisible = false;
+          that.getTableQuery();
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 确认添加课程
+    confirmAddLesson() {
+      let that = this;
+
+      // checkNum
+      if (!that.form.ClassName) {
+        this.$message.error('错了哦，课程名称不能为空');
+        return false
+      }
+      if (that.form.ClassName.length > 8) {
+        this.$message.error('错了哦，课程名称字数超过8个字');
+        return false
+      }
+      if (that.form.Memo) {
+        if (that.form.Memo.length > 200) {
+          this.$message.error('错了哦，备注字数超过200个字');
+          return false
+        }
+      }
+
+      let userlist = that.form.dialogValue.toString();
+      let param = {
+        token: localStorage.token,
+        shopId: localStorage.shopId,
+        className: that.form.ClassName,
+        consumeHour: that.form.ConsumeHour,
+        topLimit: that.form.TopLimit,
+        classType: that.form.classType,
+        wxVisible: that.form.wxVisible,
+        classColor: that.form.ClassColor,
+        userlist: userlist,
+        teacherId: 0,//预留
+        memo: that.form.Memo,
+      };
+      let postdata = qs.stringify(param);
+      ClassAdd(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogLesson = false;
+          // 重载列表
+          that.getTableQuery();
+          that.$message({
+            showClose: true,
+            message: '添加课程成功！',
+            type: 'success'
+          });
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    confirmEditLesson() {
+      let that = this;
+      // checkNum
+      if (!that.form.ClassName) {
+        this.$message.error('错了哦，课程名称不能为空');
+        return false
+      }
+      if (that.form.ClassName.length > 8) {
+        this.$message.error('错了哦，课程名称字数超过8个字');
+        return false
+      }
+      if (that.form.Memo) {
+        if (that.form.Memo.length > 200) {
+          this.$message.error('错了哦，备注字数超过200个字');
+          return false
+        }
+      }
+
+      let teacherId = that.form.dialogValue ? that.form.dialogValue.toString() : '';
+      // 通用是0，非通用是shopid
+      let shopId = that.form.allUse == 0 ? 0 : localStorage.ShopId;
+      let param = {
+        token: localStorage.token,
+        shopId: shopId,
+        classId: that.form.classId,
+        className: that.form.ClassName,
+        consumeHour: that.form.ConsumeHour,
+        topLimit: that.form.TopLimit,
+        classType: that.form.classType,
+        wxVisible: that.form.wxVisible,
+        classColor: that.form.ClassColor,
+        teacherId: teacherId,
+        memo: that.form.Memo,
+      };
+      let postdata = qs.stringify(param);
+      ClassEdit(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogLesson = false;
+          // 重载列表
+          that.getTableQuery();
+          that.$message({
+            showClose: true,
+            message: '会员课程调整成功！',
+            type: 'success'
+          });
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 新增课程
+    addLesson() {
+      this.form.btnType = 0; //新增
+      // clear
+      this.form.ClassName = '';
+      this.form.ConsumeHour = 0;
+      this.form.TopLimit = 0;
+      this.form.wxVisible = 1;
+      this.form.ClassColor = "#ffffff";
+      this.form.Memo = "";
+      this.form.dialogValue = [];
+      this.dialogLesson = true;
+      this.dialogTitle = '新增课程'
+      this.panelSelect();
+    },
+    // 改色
+    changeColor(c, row) {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        classId: row.ClassId,//
+        classColor: c,//
+      };
+      let postdata = qs.stringify(param);
+      ClassColorEdit(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.$message({
+            showClose: true,
+            message: '课程颜色已编辑',
+            type: 'success'
+          });
+          // 重载列表
+          that.getTableQuery();
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 删除
+    delList() {
+      let that = this;
+      if (this.tableRadio.length == 0) {
+        this.$message.error("请先选中一条记录");
+        return false
+      }
+      let row = that.tableRadio;
+      let param = {
+        token: localStorage.token,
+        classId: row.ClassSelf.ClassId,
+        status: 9,//0禁用1启用9删除
+      };
+      let postdata = qs.stringify(param);
+
+      this.$confirm('此操作将永久删除该课程, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        ClassStatusEdit(postdata).then(res => {
+          let json = res;
+          if (json.Code == 0) {
+            that.$message({
+              showClose: true,
+              message: '选中的课程已删除！',
+              type: 'success'
+            });
+            // 重载列表
+            that.getTableQuery();
+          } else {
+            that.$message.error(json.Memo);
+          }
+        });
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除'
+        });
+      });
+    },
+    // 加载选项
+    panelSelect() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        vipType: '',
+        start: 1,
+        expDay: '',
+        tableMax: 9999,
+      };
+      let postdata = qs.stringify(param);
+      VipUserListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          if (json.Rs == null) return false
+          // that.dialogdata = json.Rs;
+          that.form.dialogdata = turnResToOption(json.Rs)
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 微信可见与否
+    changeWechat(e, row) {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        classId: row.ClassId,//
+        wxVisible: e,//
+      };
+      let postdata = qs.stringify(param);
+      ClassVisibleStatusEdit(postdata).then(res => {
+        let json = res;
+        let text = parseInt(e) == 1 ? '可见' : '不可见';
+        if (json.Code == 0) {
+          that.$message({
+            showClose: true,
+            message: '当前用户微信已' + text,
+            type: 'success'
+          });
+          // 重载列表
+          that.getTableQuery();
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 增删会员课程
+    lessonStudenChange() {
+      this.panelSelect();
+      if (this.tableRadio.length == 0) {
+        this.$message.error("请先选中一条记录");
+        return false
+      }
+      let row = this.tableRadio;
+      let userArrary = [];
+      row.Userlist.map(function (item) {
+        userArrary.push(item.Id)
+      });
+      this.form.classId = row.ClassSelf.ClassId;
+      this.dialogValue = userArrary;
+      this.dialogVisible = true
+      // 读取左侧会员列表
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    clearForm() {
+      // clear
+      this.form.ClassName = '';
+      this.form.ConsumeHour = 0;
+      this.form.TopLimit = 0;
+      this.form.wxVisible = 1;
+      this.form.ClassColor = '';
+      this.form.Memo = '';
+    },
+    // 编辑
+    editLesson(row) {
+      let that = this;
+      this.clearForm();
+      this.form.btnType = 1; //编辑
+      this.form.ClassName = row.ClassName;
+      this.form.ConsumeHour = row.ConsumeHour;
+      this.form.TopLimit = row.TopLimit;
+      this.form.wxVisible = row.WxVisible;
+      this.form.ClassColor = row.ClassColor;
+      this.form.Memo = row.Memo;
+      this.form.dialogValue = row.teacherId;
+      this.form.classId = row.ClassId
+      this.form.ShopId = row.ShopId;
+      this.form.allUse = row.ShopId;
+      this.dialogLesson = true;
+      // 读取已选的会员
+      console.log(row);
+      this.form.dialogValue = [];
+
+      this.dialogTitle = '编辑课程'
+    },
+    Lessonmember(Userlist) {
+      this.dialogTableVisible = true;
+      this.gridData = Userlist;
+    },
+    // 查询按钮
+    query() {
+      let that = this;
+      this.getTableQuery();
+      that.serachBtnStatus = true;
+      let totalTime = 2
+      let clock = window.setInterval(() => {
+        totalTime--
+        if (totalTime < 0) {
+          totalTime = 2;
+          that.serachBtnStatus = false;
+        }
+      }, 1000)
+      this.$message.success('查询完毕');
+    },
+    // 页面数据查询
+    getTableQuery() {
+      let that = this;
+      that.loading = true;
+      let param = {
+        token: localStorage.token,
+        supregionid: 0,//
+        regionid: this.panel.regionid,//
+        comid: 1,//
+        tagname: that.panel.tagname,//标签名
+        start: 1,//
+        tableMax: 9999,//
+      };
+      let postdata = qs.stringify(param);
+      ClassListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.loading = false;
+          if (json.Rs) {
+            that.allTableData = json.Rs;
+            that.recordsTotal = json.Rs.length;
+          } else {
+            that.allTableData = [];
+            that.recordsTotal = 0;
+          }
+
+          // 设置分页数据
+          that.setPaginations();
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 设置分页数据
+    setPaginations() {
+      // 分页属性
+      let that = this;
+      that.pageination.total = that.recordsTotal;
+      // 默认分页
+      that.tableData = that.allTableData.filter((item, index) => {
+        return index < that.pageination.pageItem;
+      });
+    },
+    // 每页显示数量
+    handleSizeChange() {
+      let that = this;
+      that.tableData = that.allTableData.filter((item, index) => {
+        return index < that.pageination.pageItem;
+      });
+      that.draw = that.pageination.pageItem;
+      that.getTableQuery();
+    },
+    // 翻页
+    pageChange(pageIndex) {
+      let that = this;
+      // 获取当前页
+      let index = that.pageination.pageItem * (pageIndex - 1);
+      // 数据总数
+      let nums = that.pageination.pageItem * pageIndex;
+      // 容器
+      let tables = [];
+      for (var i = index; i < nums; i++) {
+        if (that.allTableData[i]) {
+          tables.push(that.allTableData[i])
+        }
+        this.tableData = tables;
+      }
+      that.start = index * that.draw;
+      // that.getTableQuery();
+    },
+    // 过滤时间
+    filterFmtDate(value, row, column) {
+      let that = this;
+      if (column == "0001-01-01T08:05:43+08:05") {
+        return '无有效期';
+      } else {
+        return nonTfmtDate(column, 11);
+      }
+    },
+  },
+  watch: {
+    $route(to) {
+      if (to.name == 'Lesson') {
+        this.panelSelect();
+        this.getTableQuery();
+      }
+    },
+  },
+}
 </script>
 
 <style scoped>
-    @import "../assets/css/panel.css";
-
-    .context {
-        height: 770px;
-        overflow-y: scroll;
-
-        display: block;
-        margin: 0 auto;
-        background-color: #fff !important;
-        padding: 30px;
-    }
-
-    .panel-body {
-        padding: 20px;
-        background: #F0F2F5;
-    }
-
-    .change {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding-top: 10px;
-        padding-bottom: 10px;
-    }
-
-    .change button {
-        float: left;
-    }
-
-    .change button.pull-right {
-        float: right;
-    }
-
-    .dialogTitle {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        color: #000000;
-        font-size: 18px;
-        text-align: center;
-    }
-
-    .dialogTitle span {
-        width: 169px;
-        height: 40px;
-        line-height: 40px;
-        text-align: center;
-        color: #fff;
-        background: #3799FF;
-        border-radius: 250px;
-        font-size: 18px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-bottom: 30px;
-    }
-
-    .dialogTitle em {
-        float: none;
-        font-style: normal;
-        color: #3799FF;
-        margin: 0;
-    }
-
-    /deep/ .el-transfer-panel__item .el-checkbox__input {
-        left: 40px;
-    }
-
-    .dialogFooter {
-        width: 90%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-top: 10px;
-    }
-
-    .dialogFooter button {
-        float: right;
-        margin-left: 10px;
-    }
-
-    .pull-left {
-        width: 30%;
-        float: left;
-    }
-
-    .pull-right {
-        width: 70%;
-        float: right;
-    }
-
-    /deep/ .el-transfer-panel__item .el-checkbox__input {
-        left: 15px;
-    }
-
-    /deep/ .el-dialog .el-input__inner {
-        min-width: 180px;
-    }
-
-    /*隐藏调色盘*/
-     .el-color-dropdown__main-wrapper {
-        display: none!important;
-    }
-    /deep/ .el-color-dropdown__main-wrapper {
-        display: none!important;
-    }
+@import "../assets/css/panel.css";
+
+.context {
+  height: 770px;
+  overflow-y: scroll;
+
+  display: block;
+  margin: 0 auto;
+  background-color: #fff !important;
+  padding: 30px;
+}
+
+.panel-body {
+  padding: 20px;
+  background: #F0F2F5;
+}
+
+.change {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
+
+.change button {
+  float: left;
+}
+
+.change button.pull-right {
+  float: right;
+}
+
+.dialogTitle {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  color: #000000;
+  font-size: 18px;
+  text-align: center;
+}
+
+.dialogTitle span {
+  width: 169px;
+  height: 40px;
+  line-height: 40px;
+  text-align: center;
+  color: #fff;
+  background: #3799FF;
+  border-radius: 250px;
+  font-size: 18px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-bottom: 30px;
+}
+
+.dialogTitle em {
+  float: none;
+  font-style: normal;
+  color: #3799FF;
+  margin: 0;
+}
+
+/deep/ .el-transfer-panel__item .el-checkbox__input {
+  left: 40px;
+}
+
+.dialogFooter {
+  width: 90%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-top: 10px;
+}
+
+.dialogFooter button {
+  float: right;
+  margin-left: 10px;
+}
+
+.pull-left {
+  width: 30%;
+  float: left;
+}
+
+.pull-right {
+  width: 70%;
+  float: right;
+}
+
+/deep/ .el-transfer-panel__item .el-checkbox__input {
+  left: 15px;
+}
+
+/deep/ .el-dialog .el-input__inner {
+  min-width: 180px;
+}
+
+/*隐藏调色盘*/
+.el-color-dropdown__main-wrapper {
+  display: none !important;
+}
+
+/deep/ .el-color-dropdown__main-wrapper {
+  display: none !important;
+}
 </style>

pc/src/views/LessonTable.vue

@@ -511,7 +511,7 @@
                     this.tableData = tables;
                 }
                 that.start = index * that.draw;
-                that.getTableQuery();
+                // that.getTableQuery();
             },
             // 过滤时间
             filterFmtDate(value, row, column) {

pc/src/views/Log.vue

@@ -1,383 +1,445 @@
 <template>
-    <div class="context">
-        <div class="panel">
-            <h5>操作日志</h5>
-            <div class="panel-body">
-                <div class="panel_control">
-                    <el-row :gutter="20">
-                        <el-col :span="5">
-                            <el-date-picker
-                                    v-model="panel.timeScope"
-                                    type="daterange"
-                                    range-separator="至"
-                                    start-placeholder="开始日期"
-                                    end-placeholder="结束日期">
-                            </el-date-picker>
-                        </el-col>
-                        <el-col :span="4">
-                            <em>操作者:</em>
-                            <el-select v-model="panel.userId">
-                                <el-option
-                                        v-for="item in panel.options"
-                                        :key="item.value"
-                                        :label="item.label"
-                                        :value="item.value">
-                                </el-option>
-                            </el-select>
-                        </el-col>
-                        <el-col :span="4">
-                            <em>手机号:</em>
-                            <el-input v-model="panel.phone" placeholder="请输入手机号"></el-input>
-                        </el-col>
-                        <el-col :span="4">
-                            <el-button size="" type="primary" @click="query" plain>查询</el-button>
-                        </el-col>
-                    </el-row>
-                </div>
-            </div>
+  <div class="context">
+    <div class="panel">
+      <h5>操作日志</h5>
+      <div class="panel-body">
+        <div class="panel_control">
+          <el-row :gutter="20">
+            <el-col :span="7">
+              <em>时间:</em>
+              <el-date-picker
+                  v-model="panel.timeScope"
+                  type="daterange"
+                  range-separator="至"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期">
+              </el-date-picker>
+            </el-col>
+            <el-col :span="4">
+              <em>店面:</em>
+              <el-select v-model="panel.shopId">
+                <el-option
+                    v-for="item in panel.shopOptions"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value">
+                </el-option>
+              </el-select>
+            </el-col>
+            <el-col :span="4">
+              <em>操作者:</em>
+              <el-select v-model="panel.userId">
+                <el-option
+                    v-for="item in panel.options"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value">
+                </el-option>
+              </el-select>
+            </el-col>
+            <el-col :span="4">
+              <em>手机号:</em>
+              <el-input v-model="panel.phone"  placeholder="请输入手机号" type="number" ></el-input>
+            </el-col>
+            <el-col :span="4">
+              <el-button size="" type="primary" @click="query" plain :disabled="serachBtnStatus">查询</el-button>
+            </el-col>
+          </el-row>
         </div>
-        <div class="table">
-            <el-table
-                    :data="tableData"
-                    border
-                    is-horizontal-resize
-                    :default-sort="{prop: 'date', order: 'descending'}"
-                    element-loading-background="rgba(0, 0, 0, 0.8)"
-                    class=""
-            >
-                <el-table-column
-                        type="index"
-                        label="序号"
-                        align="center"
-                        width="50">
-                </el-table-column>
-                <el-table-column
-                        prop="CreatedAt"
-                        label="日期"
-                        :formatter="filterFmtDate"
-                        width="180"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="OptName"
-                        label="操作者"
-                        sortable
-                        width="120"
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="OptPhone"
-                        label="手机号"
-                        width="120"
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="Parameter"
-                        label="执行语句"
-                        sortable
-                >
-                    <template slot-scope="scope">
-                        <el-popover
-                                placement="top"
-                                title="具体语句"
-                                trigger="hover"
-                                :content="scope.row.Parameter">
+      </div>
+    </div>
+    <div class="table">
+      <el-table
+          :data="tableData"
+          border
+          is-horizontal-resize
+          :default-sort="{prop: 'date', order: 'descending'}"
+          element-loading-background="rgba(0, 0, 0, 0.8)"
+          class=""
+      >
+        <el-table-column
+            type="index"
+            label="序号"
+            align="center"
+            width="50">
+        </el-table-column>
+        <el-table-column
+            prop="CreatedAt"
+            label="日期"
+            :formatter="filterFmtDate"
+            width="180"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="OptName"
+            label="操作者"
+            sortable
+            width="120"
+        >
+        </el-table-column>
+        <el-table-column
+            prop="OptShop"
+            label="所属店铺"
+            sortable
+            width="120"
+        >
+        </el-table-column>
+        <el-table-column
+            prop="OptPhone"
+            label="手机号"
+            width="120"
+        >
+        </el-table-column>
+        <el-table-column
+            prop="Parameter"
+            label="执行语句"
+            sortable
+        >
+          <template slot-scope="scope">
+            <el-popover
+                placement="top"
+                title="具体语句"
+                trigger="hover"
+                :content="scope.row.Parameter">
                             <span slot="reference"
-                                  v-if="scope.row.Parameter.length > 40">{{scope.row.Parameter.substr(0,40)}} ....</span>
-                        </el-popover>
-                        <span v-if="scope.row.Parameter.length <= 40">{{scope.row.Parameter}}</span>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="OptInfo"
-                        label="操作信息"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="Result"
-                        label="操作结果"
-                        width="120"
-                        sortable
-                >
-                </el-table-column>
-            </el-table>
-            <br>
-            <el-pagination
-                    background
-                    :total="pageination.total"
-                    :page-size="pageination.pageItem"
-                    @current-change="pageChange"
-            ></el-pagination>
-        </div>
-
+                                  v-if="scope.row.Parameter.length > 40">{{ scope.row.Parameter.substr(0, 40) }} ....</span>
+            </el-popover>
+            <span v-if="scope.row.Parameter.length <= 40">{{ scope.row.Parameter }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="OptInfo"
+            label="操作信息"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="Result"
+            label="操作结果"
+            width="120"
+            sortable
+        >
+        </el-table-column>
+      </el-table>
+      <br>
+      <el-pagination
+          background
+          :total="pageination.total"
+          :page-size="pageination.pageItem"
+          @current-change="pageChange"
+      ></el-pagination>
     </div>
+
+  </div>
 </template>
 
 <script>
-    import Global from '../Global.js'
-    import {
-        OptLogListQuery,
-        testTable,
-        testSelect, ShopManagerListQuery
-    } from "../api/getApiRes";
+import Global from '../Global.js'
+import {
+  OptLogListQuery,
+  testTable,
+  testSelect, ShopManagerListQuery, ShopListQuery
+} from "../api/getApiRes";
 
-    let qs = require('qs');
-    export default {
-        data() {
-            return {
-                dialogVisible: false,
-                dialogTitle: '新增管理员',
-                times: globalBt2(7),
-                // panel 配置项目
-                panel: {
-                    userCode: '',
-                    tel: '',
-                    userId: '',
-                    shopList: 0,
-                    options: [],
-                    draw: 1,
-                    start: 0,
-                    recordsTotal: 0,
-                    tableData: [],
-                    allTableData: [],
-                    limit: '10',
-                    multipleSort: false,
-                    loading: false,
-                    fileList: [],
-                    multipleSelection: [],
-                    detectedmac: '',
-                    time1: globalBt(),
-                    timeScope: globalBt2(30),
-                },
-                multipleSelection: [],
-                pageination: {
-                    pageItem: 100,
-                    pageoptions: pageOptions(),
-                    total: 100,
-                    pageIndex: 1,
-                },
-                form: {
-                    name: '',
-                    userCode: '',
-                    shopId: '',
-                },
-                shops: [],
-                tableData: []
-            }
-        },
-        mounted() {
-            this.panelSelect();
-            this.getTableQuery();
-        },
-        methods: {
-            // 加载选项
-            panelSelect() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    start: 1,
-                    tableMax: 999,
-                };
-                let postdata = qs.stringify(param);
-                ShopManagerListQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.panel.options = this.turnResToOptionByUsers(json.Rs);
-                        that.panel.options.unshift({value: '', label: "全部"});
-                        console.log(that.panel.options);
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            turnResToOptionByUsers(data) {
-                if (!data) return false
-                let ids = data.map(item => {
-                    return {
-                        label: item.Name + ' ' + item.Phone,
-                        key: parseInt(item.Id),
-                        value: parseInt(item.Id),
-                    }
-                })
-                return ids
-            },
-            clearForm() {
-                // clear
-                this.form.name = '';
-                this.form.userCode = '';
-                this.form.shopId = '';
-            },
-            handleSelectionChange(val) {
-                this.multipleSelection = val;
-            },
-            // 查询按钮
-            query() {
-                this.getTableQuery();
-                this.$message.success('查询完毕');
-            },
-            // 页面数据查询
-            getTableQuery() {
-                console.log(this.panel.userId);
-                let that = this;
-                // this.getGetChildRegionSelect(0, 1);
-                that.loading = true;
-                // 查询检测设备。上级区域id，区域id必传。regionid传0，查询supregionid对应所有子区域的检测设备。 如果supregionid，regionid都传0，默认查询企业ID下所有检测设备
-                let param = {
-                    token: localStorage.token,
-                    name: this.panel.name,
-                    phone: this.panel.phone,
-                    userId: this.panel.userId,
-                    bt: nonTfmtDatetoLength(that.panel.timeScope[0], 10) + " 00:00:00",
-                    et: nonTfmtDatetoLength(that.panel.timeScope[1], 10) + " 23:59:59",
-                    start: 1,//
-                    tableMax: 9999,//
-                };
-                let postdata = qs.stringify(param);
-                OptLogListQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.loading = false;
-                        if (json.Rs) {
-                            that.allTableData = json.Rs;
-                            that.recordsTotal = json.Rs.length;
-                        } else {
-                            that.allTableData = [];
-                            that.recordsTotal = 0;
-                        }
-                        // 设置分页数据
-                        that.setPaginations();
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 设置分页数据
-            setPaginations() {
-                // 分页属性
-                let that = this;
-                that.pageination.total = that.recordsTotal;
-                // 默认分页
-                that.tableData = that.allTableData.filter((item, index) => {
-                    return index < that.pageination.pageItem;
-                });
-            },
-            // 每页显示数量
-            handleSizeChange() {
-                let that = this;
-                that.tableData = that.allTableData.filter((item, index) => {
-                    return index < that.pageination.pageItem;
-                });
-                that.draw = that.pageination.pageItem;
-                that.getTableQuery();
-            },
-            // 翻页
-            pageChange(pageIndex) {
-                let that = this;
-                // 获取当前页
-                let index = that.pageination.pageItem * (pageIndex - 1);
-                // 数据总数
-                let nums = that.pageination.pageItem * pageIndex;
-                // 容器
-                let tables = [];
-                for (var i = index; i < nums; i++) {
-                    if (that.allTableData[i]) {
-                        tables.push(that.allTableData[i])
-                    }
-                    this.tableData = tables;
-                }
-                that.start = index * that.draw;
-                that.getTableQuery();
-            },
-            // 自动排序
-            sortChange(params) {
-                console.log(params)
-            },
-            // 过滤时间
-            filterFmtDate(value, row, column) {
-                let that = this;
-                return nonTfmtDate(column, 11);
-            },
-        },
+let qs = require('qs');
+export default {
+  data() {
+    return {
+      dialogVisible: false,
+      dialogTitle: '新增管理员',
+      times: globalBt2(7),
+      // panel 配置项目
+      panel: {
+        userCode: '',
+        tel: '',
+        userId: '',
+        shopList: 0,
+        shopId: '',
+        options: [],
+        shopOptions: [],
+        draw: 1,
+        start: 0,
+        recordsTotal: 0,
+        tableData: [],
+        allTableData: [],
+        limit: '10',
+        multipleSort: false,
+        loading: false,
+        fileList: [],
+        multipleSelection: [],
+        detectedmac: '',
+        time1: globalBt(),
+        timeScope: globalBt2(30),
+      },
+      multipleSelection: [],
+      pageination: {
+        pageItem: 100,
+        pageoptions: pageOptions(),
+        total: 100,
+        pageIndex: 1,
+      },
+      form: {
+        name: '',
+        userCode: '',
+        shopId: '',
+      },
+      shops: [],
+      tableData: [],
+      serachBtnStatus: false,
     }
+  },
+  mounted() {
+    this.panelSelect();
+    this.shopPanelSelect();
+    this.getTableQuery();
+  },
+  methods: {
+    shopPanelSelect(){
+      let that = this;
+      let param = {
+        token: localStorage.token,
+      };
+      let postdata = qs.stringify(param);
+      ShopListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          if (json.Rs == '') {
+            that.$message.error('当前没有可选的店铺，请先在店面管理中添加店铺!');
+            return false
+          }
+          that.panel.shopOptions = turnShopResToOption(json.Rs);
+          that.panel.shopOptions.unshift({value: '', label: "全部"});
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 加载选项
+    panelSelect() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        start: 1,
+        tableMax: 999,
+      };
+      let postdata = qs.stringify(param);
+      ShopManagerListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.panel.options = this.turnResToOptionByUsers(json.Rs);
+          that.panel.options.unshift({value: '', label: "全部"});
+          console.log(that.panel.options);
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    turnResToOptionByUsers(data) {
+      if (!data) return false
+      let ids = data.map(item => {
+        return {
+          label: item.Name + ' ' + item.Phone,
+          key: parseInt(item.Id),
+          value: parseInt(item.Id),
+        }
+      })
+      return ids
+    },
+    clearForm() {
+      // clear
+      this.form.name = '';
+      this.form.userCode = '';
+      this.form.shopId = '';
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    // 查询按钮
+    query() {
+      // 按钮倒计时
+      let that = this;
+      that.serachBtnStatus = true;
+      let totalTime = 2
+      let clock = window.setInterval(() => {
+        totalTime--
+        if (totalTime < 0) {
+          totalTime = 2;
+          that.serachBtnStatus = false;
+        }
+      }, 1000)
+
+      this.getTableQuery();
+      this.$message.success('查询完毕');
+    },
+    // 页面数据查询
+    getTableQuery() {
+      let that = this;
+      // this.getGetChildRegionSelect(0, 1);
+      that.loading = true;
+      // 查询检测设备。上级区域id，区域id必传。regionid传0，查询supregionid对应所有子区域的检测设备。 如果supregionid，regionid都传0，默认查询企业ID下所有检测设备
+      let param = {
+        token: localStorage.token,
+        name: this.panel.name,
+        phone: this.panel.phone,
+        userId: this.panel.userId,
+        bt: nonTfmtDatetoLength(that.panel.timeScope[0], 10) + " 00:00:00",
+        et: nonTfmtDatetoLength(that.panel.timeScope[1], 10) + " 23:59:59",
+        start: 1,//
+        tableMax: 9999,//
+        optShopId:this.panel.shopId,
+      };
+      let postdata = qs.stringify(param);
+      OptLogListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.loading = false;
+          if (json.Rs) {
+            that.allTableData = json.Rs;
+            that.recordsTotal = json.Rs.length;
+          } else {
+            that.allTableData = [];
+            that.recordsTotal = 0;
+          }
+          // 设置分页数据
+          that.setPaginations();
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 设置分页数据
+    setPaginations() {
+      // 分页属性
+      let that = this;
+      that.pageination.total = that.recordsTotal;
+      // 默认分页
+      that.tableData = that.allTableData.filter((item, index) => {
+        return index < that.pageination.pageItem;
+      });
+    },
+    // 每页显示数量
+    handleSizeChange() {
+      let that = this;
+      that.tableData = that.allTableData.filter((item, index) => {
+        return index < that.pageination.pageItem;
+      });
+      that.draw = that.pageination.pageItem;
+      that.getTableQuery();
+    },
+    // 翻页
+    pageChange(pageIndex) {
+      let that = this;
+      // 获取当前页
+      let index = that.pageination.pageItem * (pageIndex - 1);
+      // 数据总数
+      let nums = that.pageination.pageItem * pageIndex;
+      // 容器
+      let tables = [];
+      for (var i = index; i < nums; i++) {
+        if (that.allTableData[i]) {
+          tables.push(that.allTableData[i])
+        }
+        this.tableData = tables;
+      }
+      that.start = index * that.draw;
+      // that.getTableQuery();
+    },
+    // 自动排序
+    sortChange(params) {
+      console.log(params)
+    },
+    // 过滤时间
+    filterFmtDate(value, row, column) {
+      let that = this;
+      return nonTfmtDate(column, 11);
+    },
+  },
+}
 </script>
 
 <style scoped>
-    @import "../assets/css/panel.css";
+@import "../assets/css/panel.css";
 
-    .context {
-        height: 770px;
-        overflow-y: scroll;
+.context {
+  height: 770px;
+  overflow-y: scroll;
 
-        display: block;
-        margin: 0 auto;
-        background-color: #fff !important;
-        padding: 30px;
-        padding-bottom: 60px;
-    }
+  display: block;
+  margin: 0 auto;
+  background-color: #fff !important;
+  padding: 30px;
+  padding-bottom: 60px;
+}
 
-    .panel-body {
-        padding: 20px;
-        background: #F0F2F5;
-    }
+.panel-body {
+  padding: 20px;
+  background: #F0F2F5;
+}
 
-    .change {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding-top: 10px;
-        padding-bottom: 10px;
-    }
+.change {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
 
-    .change button {
-        float: left;
-    }
+.change button {
+  float: left;
+}
 
-    .change button.pull-right {
-        float: right;
-    }
+.change button.pull-right {
+  float: right;
+}
 
-    .dialogTitle {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        color: #000000;
-        font-size: 18px;
-        text-align: center;
-    }
+.dialogTitle {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  color: #000000;
+  font-size: 18px;
+  text-align: center;
+}
 
-    .dialogTitle em {
-        float: none;
-        font-style: normal;
-        color: #3799FF;
-        margin: 0;
-    }
+.dialogTitle em {
+  float: none;
+  font-style: normal;
+  color: #3799FF;
+  margin: 0;
+}
 
-    /deep/ .el-transfer-panel__item .el-checkbox__input {
-        left: 40px;
-    }
+/deep/ .el-transfer-panel__item .el-checkbox__input {
+  left: 40px;
+}
 
-    .dialogFooter {
-        width: 90%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-top: 10px;
-    }
+.dialogFooter {
+  width: 90%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-top: 10px;
+}
 
-    .dialogFooter button {
-        float: right;
-        margin-left: 10px;
-    }
+.dialogFooter button {
+  float: right;
+  margin-left: 10px;
+}
 
-    /deep/ .el-date-editor .el-range__icon {
-        line-height: 22px;
-    }
+/deep/ .el-date-editor .el-range__icon {
+  line-height: 22px;
+}
+
+.panel /deep/ .el-date-editor .el-range-separator {
+  line-height: 22px;
+}
+/*ipad only*/
+@media only screen and (max-width: 1366px) {
+  .panel /deep/ .el-date-editor--daterange {
+    width: 100%;
+  }
+}
 
-    .panel /deep/ .el-date-editor .el-range-separator {
-        line-height: 22px;
-    }
 </style>

pc/src/views/Login.vue

@@ -1,293 +1,317 @@
 <template>
-    <div id="bg">
-        <el-container>
-            <el-header></el-header>
-            <el-main>
-                <div class="bg">
+  <div id="bg">
+    <el-container>
+      <el-header></el-header>
+      <el-main>
+        <div class="bg">
 
-                    <el-card class="box-card">
-                        <h5 class="title">
-                            <img src="../assets/img/login/logo.png" alt="">
-                        </h5>
-                        <span class="subtitle">小飞龙场馆管理系统</span>
-                        <el-form ref="form" :model="form" label-width="0px">
-                            <el-form-item label="">
-                                <el-input v-model="form.name" placeholder="用户名"></el-input>
-                            </el-form-item>
-                            <el-form-item label="">
-                                <el-input v-model="form.pwd" placeholder="密码" type="password"></el-input>
-                            </el-form-item>
-                            <el-form-item label="">
-                                <el-input v-model="form.valid" placeholder="验证码"
-                                          @keyup.enter.native="onSubmit"></el-input>
-                                <img id="validImg" :src="valImgSrc" alt="" width="100px" height="42px"
-                                     title="看不清？刷一下试试！" @click="getGenVerifyPic">
-                            </el-form-item>
-                            <br>
-                            <br>
-                            <el-form-item>
-                                <el-button type="primary" @click="onSubmit">登陆</el-button>
-                            </el-form-item>
-                        </el-form>
-                    </el-card>
-                </div>
-            </el-main>
-            <el-footer></el-footer>
-        </el-container>
-    </div>
+          <el-card class="box-card">
+            <h5 class="title">
+              <img src="../assets/img/login/logo.png" alt="">
+            </h5>
+            <span class="subtitle">小飞龙场馆管理系统</span>
+            <el-form ref="form" :model="form" label-width="0px">
+              <el-form-item label="">
+                <el-input v-model="form.name" placeholder="用户名"></el-input>
+              </el-form-item>
+              <el-form-item label="">
+                <el-input v-model="form.pwd" placeholder="密码" type="password"></el-input>
+              </el-form-item>
+              <el-form-item label="">
+                <el-input v-model="form.valid" placeholder="验证码"
+                          @keyup.enter.native="onSubmit"></el-input>
+                <img id="validImg" :src="valImgSrc" alt="" width="100px" height="42px"
+                     title="看不清？刷一下试试！" @click="getGenVerifyPic">
+              </el-form-item>
+              <br>
+              <br>
+              <el-form-item>
+                <el-button type="primary" @click="onSubmit">登陆</el-button>
+              </el-form-item>
+            </el-form>
+          </el-card>
+        </div>
+      </el-main>
+      <el-footer></el-footer>
+    </el-container>
+  </div>
 </template>
 
 <script>
-    import {
-        SignIn,
-        GenVerifyPic,
-        ManagerSelfQuery
-    } from "../api/getApiRes";
+import {
+  SignIn,
+  GenVerifyPic,
+  ManagerSelfQuery
+} from "../api/getApiRes";
 
-    let qs = require('qs');
-    import Global from '../Global.js'
+let qs = require('qs');
+import Global from '../Global.js'
 
 
-    export default {
-        data() {
-            return {
-                form: {
-                    name: '',
-                    pwd: '',
-                    valid: '',
-                    picId: '',
-                },
-                valImgSrc: '',
-                valImgId: '',
-                overtime: '',
-                userLevel: '',
-                userLevelText: '',
-            }
-        },
-        mounted() {
-            this.overtime = new Date();
-            this.getGenVerifyPic();
-            // 如果是手动退出用户
-            if (this.$route.query.status == 1) {
-                // 刷新验证图
-                this.changeValImg();
-                // 重置倒计时
-                this.overtime = new Date();
-            }
-        },
-        methods: {
-            getGenVerifyPic() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    width: 100,
-                    height: 42,
-                    noiseCount: 10,
-                    length: 4,
-                    source: 123456789,
-                };
-                let postdata = qs.stringify(param);
-                GenVerifyPic(postdata).then(res => {
-                    let json = res;
-                    that.valImgSrc = json.Pic;
-                    that.valImgId = json.Id;
-                    that.form.picId = json.Id;
-                })
-            },
-            //            点击验证码切换
-            changeValImg: function () {
-                // 刷新验证图
-                this.getGenVerifyPic();
-            },
-            // 登陆
-            onSubmit() {
-                this.pwdLoginBtn()
-            },
-            // 密码登陆
-            pwdLoginBtn() {
-                let that = this;
-                let username = this.form.name;
-                let userpwd = this.form.pwd;
-                let uservalid = this.form.valid;
-                // 重置验证码超时
-                that.overtime = new Date();
-                if (!globalValid(username, 2, 17, '用户名', that)) return;
-                if (!globalValid(userpwd, 5, 17, '密码', that)) return;
-                if (!globalValid(uservalid, 3, 5, '验证码', that)) return;
-                this.loginInfo();
-            },
-            getManagerSelfQuery() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                };
-                let postdata = qs.stringify(param);
-                ManagerSelfQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.userLevelText = json.Rs.Role.Name;
-                        // 1 会员 2 系统 3 店铺 4 教练
-                        that.userLevel = json.Rs.Role.Id;
-                        localStorage.shopId = json.Rs.ShopId;
-                        localStorage.ShopId = json.Rs.ShopId;
+export default {
+  data() {
+    return {
+      form: {
+        name: '',
+        pwd: '',
+        valid: '',
+        picId: '',
+      },
+      valImgSrc: '',
+      valImgId: '',
+      overtime: '',
+      userLevel: '',
+      userLevelText: '',
+    }
+  },
+  mounted() {
+    this.overtime = new Date();
+    this.getGenVerifyPic();
+    // 如果是手动退出用户
+    if (this.$route.query.status == 1) {
+      // 刷新验证图
+      this.changeValImg();
+      // 重置倒计时
+      this.overtime = new Date();
+    }
+
+    // checkScreen
+    if (document.body.clientWidth < 1024) {
+      this.$message.warning('请横屏使用本系统');
+    }
+  },
+  methods: {
+    getGenVerifyPic() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        width: 100,
+        height: 42,
+        noiseCount: 10,
+        length: 4,
+        source: 123456789,
+      };
+      let postdata = qs.stringify(param);
+      GenVerifyPic(postdata).then(res => {
+        let json = res;
+        that.valImgSrc = json.Pic;
+        that.valImgId = json.Id;
+        that.form.picId = json.Id;
+      })
+    },
+    //            点击验证码切换
+    changeValImg: function () {
+      // 刷新验证图
+      this.getGenVerifyPic();
+    },
+    // 登陆
+    onSubmit() {
+      this.pwdLoginBtn()
+    },
+    // 密码登陆
+    pwdLoginBtn() {
+      let that = this;
+      let username = this.form.name;
+      let userpwd = this.form.pwd;
+      let uservalid = this.form.valid;
+      // 重置验证码超时
+      that.overtime = new Date();
+      if (!globalValid(username, 2, 17, '用户名', that)) return;
+      if (!globalValid(userpwd, 5, 17, '密码', that)) return;
+      if (!globalValid(uservalid, 3, 5, '验证码', that)) return;
+      this.loginInfo();
+    },
+    getManagerSelfQuery() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+      };
+      let postdata = qs.stringify(param);
+      ManagerSelfQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.userLevelText = json.Rs.Role.Name;
+          // 1 会员 2 系统 3 店铺 4 教练
+          that.userLevel = json.Rs.Role.Id;
+          localStorage.shopId = json.Rs.ShopId;
+          localStorage.ShopId = json.Rs.ShopId;
 
-                        switch (parseInt(that.userLevel)) {
-                            case 1:
-                                that.$router.push({path: '/'});
-                                break;
-                            case 2:
-                                that.$router.push({path: '/adminManage'});
-                                break;
-                            case 3:
-                                that.$router.push({path: '/'});
-                                break;
-                            case 4:
-                                that.$router.push({path: '/'});
-                                break;
+          switch (parseInt(that.userLevel)) {
+            case 1:
+              that.$router.push({path: '/'});
+              break;
+            case 2:
+              that.$router.push({path: '/shopManage'});
+              break;
+            case 3:
+              that.$router.push({path: '/'});
+              break;
+            case 4:
+              that.$router.push({path: '/'});
+              break;
 
-                        }
-                    } else {
-                        if (json.Code == 1010) {
-                            that.$message.error(json.Memo);
-                            that.$router.push({path: '/login', query: {status: 1}});
-                            return false
-                        }
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // pwd登陆
-            loginInfo: function () {
-                const that = this;
-                let url = headapi + '?ctl=ajax&mod=index&act=login';
-                let username = this.form.name;
-                let userpwd = this.form.pwd;
-                let uservalid = this.form.valid;
-                let current = new Date();
-                let betweenTime = current - that.overtime;
-                let s = 120;
-                if (betweenTime > s * 1000) {
-                    that.changeValImg();
-                    that.$message.error('验证码已超时，请重新输入');
-                    return false
-                }
-                let param = {
-                    verifyName: username,
-                    verifyCode: userpwd,
-                    picCode: uservalid,
-                    picId: this.form.picId,
-                    channel: 2
-                };
-                let postdata = qs.stringify(param);
-                SignIn(postdata).then(res => {
-                    if (res.Code == 0) {
-                        that.res = res.Rs;
-                        localStorage.userName = username;
-                        localStorage.token = res.Rs.token;
-                        this.getManagerSelfQuery();
-                    } else {
-                        if (res.Code == 10005) {
-                            that.$refs.userpwd.value = '';
-                            that.$notify({
-                                title: '警告',
-                                message: '密码错误，请重新输入',
-                                type: 'warning'
-                            });
-                        } else {
-                            that.$notify({
-                                title: '警告',
-                                message: res.Memo + ',错误代码：' + res.Code,
-                                type: 'warning'
-                            });
-                            that.form.valid = '';
-                            that.changeValImg();
-                        }
-                    }
-                })
-            }
+          }
+        } else {
+          if (json.Code == 1010) {
+            that.$message.error(json.Memo);
+            that.$router.push({path: '/login', query: {status: 1}});
+            return false
+          }
+          that.$message.error(json.Memo);
         }
+      })
+    },
+    // pwd登陆
+    loginInfo: function () {
+      const that = this;
+      let url = headapi + '?ctl=ajax&mod=index&act=login';
+      let username = this.form.name;
+      let userpwd = this.form.pwd;
+      let uservalid = this.form.valid;
+      let current = new Date();
+      let betweenTime = current - that.overtime;
+      let s = 120;
+      if (betweenTime > s * 1000) {
+        that.changeValImg();
+        that.$message.error('验证码已超时，请重新输入');
+        return false
+      }
+      let param = {
+        verifyName: username,
+        verifyCode: userpwd,
+        picCode: uservalid,
+        picId: this.form.picId,
+        channel: 2
+      };
+      let postdata = qs.stringify(param);
+      SignIn(postdata).then(res => {
+        if (res.Code == 0) {
+          that.res = res.Rs;
+          localStorage.userName = username;
+          localStorage.token = res.Rs.token;
+          this.getManagerSelfQuery();
+        } else {
+          if (res.Code == 10005) {
+            that.$refs.userpwd.value = '';
+            that.$notify({
+              title: '警告',
+              message: '密码错误，请重新输入',
+              type: 'warning'
+            });
+          } else {
+            that.$notify({
+              title: '警告',
+              message: res.Memo + ',错误代码：' + res.Code,
+              type: 'warning'
+            });
+            that.form.valid = '';
+            that.changeValImg();
+          }
+        }
+      })
     }
+  },
+}
 </script>
 
 <style scoped>
-    #bg {
-        width: 100%;
-        height: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        background-color: #F0F2F5;
-        background: url("../assets/img/login/bg.png") top center no-repeat;
-        background-size: 100% 100%;
-    }
+#bg {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  background-color: #F0F2F5;
+  background: url("../assets/img/login/bg.png") top center no-repeat;
+  background-size: 100% 100%;
+}
 
-    .title {
-        font-size: 60px;
-        text-align: center;
-        color: #fff;
-        margin-top: 3%;
-        margin-bottom: 5px;
-    }
+.title {
+  font-size: 60px;
+  text-align: center;
+  color: #fff;
+  margin-top: 3%;
+  margin-bottom: 5px;
+}
 
-    .title img {
-        width: 362px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-    }
+.title img {
+  width: 362px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+}
 
-    .subtitle {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        text-align: center;
-        color: #414141;
-        margin-bottom: 79px;
-        font-size: 41px;
-    }
+.subtitle {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  text-align: center;
+  color: #414141;
+  margin-bottom: 79px;
+  font-size: 41px;
+}
 
-    .box-card {
-        width: 577px;
-        height: 733px;
-        overflow: hidden;
-        float: right;
-        margin-top: 40px;
-        margin-right: 10%;
-    }
+.box-card {
+  width: 577px;
+  height: 733px;
+  overflow: hidden;
+  float: right;
+  margin-top: 40px;
+  margin-right: 10%;
+}
 
-    .box-card .boxTitle {
-        font-size: 30px;
-        margin-bottom: 15px;
-    }
+.box-card .boxTitle {
+  font-size: 30px;
+  margin-bottom: 15px;
+}
 
-    #validImg {
-        position: relative;
-        float: right;
-        bottom: 52px;
-    }
+#validImg {
+  position: relative;
+  float: right;
+  bottom: 52px;
+}
 
-    /deep/ .el-form {
-        width: 422px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-    }
+/deep/ .el-form {
+  width: 422px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+}
 
-    /deep/ .el-input__inner {
-        height: 44px;
-        background: #F0F2F5;
-        border-radius: 0;
-        margin-bottom: 10px;
-    }
+/deep/ .el-input__inner {
+  height: 44px;
+  background: #F0F2F5;
+  border-radius: 0;
+  margin-bottom: 10px;
+}
 
-    /deep/ .el-button--primary {
-        width: 100%;
-        height: 52px;
-        /*line-height: 32px;*/
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        font-size: 18px;
-    }
+/deep/ .el-button--primary {
+  width: 100%;
+  height: 52px;
+  /*line-height: 32px;*/
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  font-size: 18px;
+}
+/*ipad only*/
+@media only screen and (max-width: 1366px) {
+  #bg {
+    background-size: 100%;
+    background-color: #F2F2F2;
+  }
+  .box-card {
+    width: 500px;
+    height: 550px;
+    margin-top: 0;
+    margin-right: 1%;
+  }
+  .subtitle {
+    margin-bottom: 10px;
+  }
+  .el-form-item {
+    margin-bottom: 12px;
+  }
+}
 </style>

pc/src/views/Main.vue

@@ -1,935 +1,1059 @@
 <template>
-    <div class="container">
-        <div class="lt">
-            <div class="top">
-                <ul>
-                    <li @click="goPage('member')">
-                        <img src="../assets/img/main/member.png" height="54" width="54"/>
-                        <div class="liRight">
-                            <h5>会员人数</h5>
-                            <span>{{AllCount}}</span>
-                        </div>
-                        <div class="btLine">
-                            <em class="emlt">
-                                <i class="el-icon-caret-top"></i>
-                                今日新增 {{NowCount}}
-                            </em>
-                            <em class="emrt">
-                                <i class="el-icon-caret-top"></i>
-                                昨日新增 {{YesterdayCount}}
-                            </em>
-                        </div>
-                    </li>
-                    <li @click="goPage('record')">
-                        <img src="../assets/img/main/appoint.png" height="54" width="54"/>
-                        <div class="liRight">
-                            <h5>今日预约人数</h5>
-                            <span>{{TodayOrderNum}}</span>
-                        </div>
-                        <div class="btLine">
-                            <em class="emlt">
-                                <i class="el-icon-caret-top"></i>
-                                昨日预约 {{YestodayOrderNum}}
-                            </em>
-                            <em class="emrt">
-                                <i class="el-icon-caret-top"></i>
-                                较昨日新增 {{TodayIncreaseNum}}
-                            </em>
-                        </div>
-                    </li>
-                    <li @click="goPage('lesson')">
-                        <img src="../assets/img/main/lesson.png" height="54" width="54"/>
-                        <div class="liRight">
-                            <h5>课程数量</h5>
-                            <span>{{ClassNum}}</span>
-                        </div>
-                        <div class="btLine">
-                            <em class="emlt">
-                                <i class="el-icon-caret-top"></i>
-                                已预约课程 {{TodayOrderSttNum}}
-                            </em>
-                        </div>
-                    </li>
-                </ul>
+  <div class="container">
+    <div class="lt">
+      <div class="top">
+        <ul>
+          <li @click="goPage('member')">
+            <img src="../assets/img/main/member.png" height="54" width="54"/>
+            <div class="liRight">
+              <h5>会员人数</h5>
+              <span>{{ AllCount }}</span>
             </div>
-
-            <div class="finish">
-                <div class="title">
-                    <h5>下课管理</h5>
-<!--                    <span>{{getNowDate}}</span>-->
-                </div>
-                <ul>
-                    <li v-for="c in PreFinishList">
-                        <div class="finListTitle" :style="{ background:c.ClassColor }">
-                            {{c.ClassName}}
-                        </div>
-                        <div class="context">
-                            <div class="ctl">
-                                <span>上课时间：{{c.BeginStr}} - {{c.EndStr}}</span>
-                                <span>预约人数：{{c.OrderNum}} 人</span>
-                            </div>
-                            <em>{{c.BeginTime|parseDate}}</em>
-                            <el-button type="primary" plain @click="checkClassOverPrepare(c)">下课</el-button>
-                        </div>
-                    </li>
-                    <span class="tips" v-if="PreFinishList == 0">
+            <div class="btLine">
+              <em class="emlt">
+                <i class="el-icon-caret-top"></i>
+                今日新增 {{ NowCount }}
+              </em>
+              <em class="emrt">
+                <i class="el-icon-caret-top"></i>
+                昨日新增 {{ YesterdayCount }}
+              </em>
+            </div>
+          </li>
+          <li @click="goPage('record')">
+            <img src="../assets/img/main/appoint.png" height="54" width="54"/>
+            <div class="liRight">
+              <h5>今日预约人数</h5>
+              <span>{{ TodayOrderNum }}</span>
+            </div>
+            <div class="btLine">
+              <em class="emlt">
+                <i class="el-icon-caret-top"></i>
+                昨日预约 {{ YestodayOrderNum }}
+              </em>
+              <em class="emrt">
+                <i class="el-icon-caret-top"></i>
+                较昨日新增 {{ TodayIncreaseNum }}
+              </em>
+            </div>
+          </li>
+          <li @click="goPage('lesson')">
+            <img src="../assets/img/main/lesson.png" height="54" width="54"/>
+            <div class="liRight">
+              <h5>课程数量</h5>
+              <span>{{ ClassNum }}</span>
+            </div>
+            <div class="btLine">
+              <em class="emlt">
+                <i class="el-icon-caret-top"></i>
+                已预约课程 {{ TodayOrderSttNum }}
+              </em>
+            </div>
+          </li>
+        </ul>
+      </div>
+
+      <div class="finish">
+        <div class="title">
+          <h5>下课管理</h5>
+          <!--                    <span>{{getNowDate}}</span>-->
+        </div>
+        <ul>
+          <li v-for="c in PreFinishList">
+            <div class="finListTitle" :style="{ background:c.ClassColor }">
+              {{ c.ClassName }}
+            </div>
+            <div class="context">
+              <div class="ctl">
+                <span>上课时间：{{ c.BeginStr }} - {{ c.EndStr }}</span>
+                <span>预约人数：{{ c.OrderNum }} 人</span>
+              </div>
+              <em>{{ c.BeginTime|parseDate }}</em>
+              <el-button type="primary" plain @click="checkClassOverPrepare(c)">下课</el-button>
+            </div>
+          </li>
+          <span class="tips" v-if="PreFinishList == 0">
                            <img src="../assets/img/main/empty.jpg" height="116" width="92"/>
                         <br>
                         暂无下课课程
                     </span>
-                </ul>
-            </div>
+        </ul>
+      </div>
 
-            <div class="appoint">
-                <div class="title">
-                    <h5>预约课程</h5>
-                    <span>{{getNowDate}}</span>
-                </div>
-                <div class="appointCard">
-                    <el-card class="box-card" v-for="c in classList" @click.native="goLesson">
-                        <div class="cardTitle ">
-                            {{c.ClassName}}
-                        </div>
-                        <span>
-                           {{c.BeginStr}}
+      <div class="appoint">
+        <div class="title">
+          <h5>预约课程</h5>
+          <span>{{ getNowDate }}</span>
+        </div>
+        <div class="appointCard">
+          <el-card class="box-card" v-for="c in classList" @click.native="goLesson">
+            <div class="cardTitle ">
+              {{ c.ClassName }}
+            </div>
+            <span>
+                           {{ c.BeginStr }}
                         </span>
-                        <em>最大预约人数 <i>{{c.OrderToplimit}}</i></em>
-                        <em>已预约人数 <i>{{c.OrderNum}}</i></em>
-                        <em>预约状态
-                            <s class="blue" v-if="c.WxOrder > 0">可预约</s>
-                            <s class="red" v-if="c.WxOrder == 0">不可预约</s>
-                        </em>
-                    </el-card>
-                    <span class="tips" v-if="classList == 0">
+            <em>最大预约人数 <i>{{ c.OrderToplimit }}</i></em>
+            <em>已预约人数 <i>{{ c.OrderNum }}</i></em>
+            <em>预约状态
+              <s class="blue" v-if="c.WxOrder > 0">可预约</s>
+              <s class="red" v-if="c.WxOrder == 0">不可预约</s>
+            </em>
+          </el-card>
+          <span class="tips" v-if="classList == 0">
                            <img src="../assets/img/main/empty.jpg" height="116" width="92"/>
                         <br>
                         暂无预约课程，请先添加
                       <router-link to="/lessonManage">课程表</router-link>
                     </span>
-                </div>
-            </div>
         </div>
-        <div class="rt">
-            <div class="rtContext">
-                <div class="rtTitle">
-                    <h5>最新预约</h5>
-                    <span @click="goPage('appoint','second')">查看全部</span>
-                </div>
-                <ul>
-                    <!--                    TodayVipOrder-->
-                    <li v-for="as in appointList" @click="goAppointDetail(as.UserName)">
-                        <div class="asTitle">
-                            <img src="../assets/img/main/Oval.png" alt="">
-                            <span>
-                                {{as.UserName}}
-                                {{as.Phone}}  &nbsp; &nbsp; &nbsp;
-                                <em>预约时间：  {{as.Base.CreatedAt |parseDate}}</em>
+      </div>
+    </div>
+    <div class="rt">
+      <div class="rtContext">
+        <div class="rtTitle">
+          <h5>最新预约</h5>
+          <span @click="goPage('appoint','second')">查看全部</span>
+        </div>
+        <ul>
+          <!--                    TodayVipOrder-->
+          <li v-for="as in appointList" @click="goAppointDetail(as.UserName)">
+            <div class="asTitle">
+              <img src="../assets/img/main/Oval.png" alt="">
+              <span>
+                                {{ as.UserName }}
+                                {{ as.Phone }}  &nbsp; &nbsp; &nbsp;
+                                <em>预约时间：  {{ as.Base.CreatedAt |parseDate }}</em>
                           </span>
-                        </div>
-                        <div class="asContent">
-                            <span>上课时间：<em>{{as.CurrentDate.substr(5,6)}} {{as.BeginStr}}</em></span>
-                            <span>预约状态：
+            </div>
+            <div class="asContent">
+              <span>上课时间：<em>{{ as.CurrentDate.substr(5, 6) }} {{ as.BeginStr }}</em></span>
+              <span>预约状态：
                                 <em v-if="as.Status == 1" class="green">已预约</em>
                                 <em v-if="as.Status == 2" class="red">已取消</em>
                                 <em v-if="as.Status == 3" class="yellow">预约未到</em>
                                 <em v-if="as.Status == 4">已完成</em>
                             </span>
-                            <span>预约课程：<s class="blue"
-                                          :style="{ background:as.ClassColor }"> {{as.ClassName}}</s></span>
-                            <span>剩余课时：<em :class="[{'red':as.RemainHour == 0}]">{{as.RemainHour}}课时</em></span>
-                        </div>
-                    </li>
-                    <span class="tips middleTips" v-if="appointList == 0">
+              <span>预约课程：<s class="blue"
+                            :style="{ background:as.ClassColor }"> {{ as.ClassName }}</s></span>
+              <span>剩余课时：<em :class="[{'red':as.RemainHour == 0}]">{{ as.RemainHour }}课时</em></span>
+            </div>
+          </li>
+          <span class="tips middleTips" v-if="appointList == 0">
                            <img src="../assets/img/main/empty.jpg" height="116" width="92"/>
                         <br>
                         暂无预约，可进入
                         <router-link to="/appoint">预约管理</router-link>
                     </span>
-                </ul>
-            </div>
-        </div>
+        </ul>
+      </div>
     </div>
+  </div>
 </template>
 
 <script>
-    import {
-        ClassPreFinishListQuery,
-        WaitingBeginClassList,
-        ClassOngoingList,
-        OrderStatistics,
-        VipUserStatistics,
-        ClassStatistics,
-        ClassOverPrepare,
-        VipUserOrderQuery,
-        LastOrderQuery,
-    } from "../api/getApiRes";
-
-    let qs = require('qs');
-    export default {
-        data() {
-            return {
-                editableTabsValue: '1',
-                getNowDate: getNowDate(),
-                classList: [],
-                PreFinishList: [],
-                appointList: [],
-                TodayClassOrder: [],
-                TodayVipOrder: [],
-                AllCount: 0,
-                YesterdayCount: 0,
-                YestodayOrderNum: 0,
-                NowCount: 0,
-                CountAdd: 0,
-                TodayIncreaseNum: 0,
-                TodayOrderNum: 0,
-                ClassNum: 0,
-                TodayOrderSttNum: 0,
-            }
-        },
-        mounted() {
-            let that = this;
-
-            // 下课管理
-            this.getVipUserStatistics();
-            this.getClassStatistics();
-            this.ClassQuery();
-            this.getVipUserOrderQuery();
-            // 预约统计
-            this.getOrderStatistics();
-            this.getWaitingBeginClassList();
-            this.timer = setInterval(() => {
-                that.getVipUserOrderQuery();
-                this.getVipUserStatistics();
-                this.getClassStatistics();
-                this.ClassQuery();
-                this.getOrderStatistics();
-                this.getWaitingBeginClassList();
-            }, 10000);
-        },
-        destroyed() {
-            clearInterval(this.timer);//页面销毁时清除定时器
-        },
-        methods: {
-            goLesson(){
-                this.$router.push({
-                    path: '/appoint',
-                })
-            },
-            goAppointDetail(name){
-                this.$router.push({
-                    path: '/appoint',
-                    query: {
-                        page:'second',
-                        name:name
-                    }
-                })
-            },
-            goPage(url,page) {
-                this.$router.push({
-                    path: '/' + url,
-                    query: {
-                        page:page
-                    }
-                })
-            },
-            // 会员统计
-            getVipUserStatistics() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                };
-                let postdata = qs.stringify(param);
-                VipUserStatistics(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.AllCount = json.Rs.AllCount;
-                        that.YesterdayCount = json.Rs.YesterdayCount;
-                        that.NowCount = json.Rs.NowCount;
-                        that.CountAdd = json.Rs.CountAdd;
-                    } else {
-                        if (json.Code == 1010) {
-                            that.$message.error(json.Memo);
-                            that.$router.push({path: '/login', query: {status: 1}});
-                            return false
-                        }else{
-                            that.$message.error(json.Memo);
-                        }
-                    }
-                })
-            },
-            // 课程统计
-            getClassStatistics() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                };
-                let postdata = qs.stringify(param);
-                ClassStatistics(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.ClassNum = json.Rs.ClassNum;
-                        that.TodayOrderSttNum = json.Rs.TodayOrderSttNum;
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            getOrderStatistics() {
-                let that = this;
-                that.loading = true;
-                let param = {
-                    token: localStorage.token,
-                };
-                let postdata = qs.stringify(param);
-                OrderStatistics(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.loading = false;
-                        if (json.Rs) {
-                            that.TodayIncreaseNum = json.Rs.TodayIncreaseNum;
-                            that.TodayOrderNum = json.Rs.TodayOrderNum;
-                            that.YestodayOrderNum = json.Rs.YestodayOrderNum;
-                        }
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            checkClassOverPrepare(row) {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    stdId: row.StdId,
-                };
-                let postdata = qs.stringify(param);
-                ClassOverPrepare(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.goFinish(row);
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            goFinish(row) {
-                this.$router.push({
-                    path: '/finishDetail', query: {
-                        id: row.StdId,
-                        classId: row.ClassId,
-                        ClassName: row.ClassName,
-                        BeginTime: row.BeginTime,
-                    }
-                });
-            },
-            getWaitingBeginClassList() {
-                let that = this;
-                that.loading = true;
-                let param = {
-                    token: localStorage.token,
-                };
-                let postdata = qs.stringify(param);
-                WaitingBeginClassList(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.loading = false;
-                        that.classList = json.Rs;
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 下课管理
-            ClassQuery() {
-                let that = this;
-                that.loading = true;
-                let param = {
-                    token: localStorage.token,
-                };
-                let postdata = qs.stringify(param);
-                ClassOngoingList(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.loading = false;
-                        if (json.Rs) {
-                            that.PreFinishList = json.Rs;
-                        }
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 最新预约
-            getVipUserOrderQuery() {
-                let that = this;
-                that.loading = true;
-                let param = {
-                    token: localStorage.token,
-                    classId: 0,
-                    orderDate: globalcurrent(),
-                    stdId: 0,
-                };
-                let postdata = qs.stringify(param);
-                // VipUserOrderQuery(postdata).then(res => {
-                LastOrderQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.loading = false;
-                        if (json.Rs) {
-                            that.appointList = json.Rs;
-                        }
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            }
-        },
-        filters: {
-            parseDate: function (value) {
-                if (!value) {
-                    return false
-                } else {
-                    let res = nonTfmtDatetoLength(value, 10).substr(5, 10);
-                    return res;
-                }
-            },
-        },
-        watch: {
-            $route(to) {
-                if (to.name == 'Main') {
-                    this.getVipUserStatistics();
-                    this.getClassStatistics();
-                    this.ClassQuery();
-                    this.getVipUserOrderQuery();
-                    this.getOrderStatistics();
-                    this.getWaitingBeginClassList();
-                } else {
-                    clearInterval(this.timer);//页面销毁时清除定时器
-                }
-            },
-        },
-    }
+import {
+  ClassPreFinishListQuery,
+  WaitingBeginClassList,
+  ClassOngoingList,
+  OrderStatistics,
+  VipUserStatistics,
+  ClassStatistics,
+  ClassOverPrepare,
+  VipUserOrderQuery,
+  LastOrderQuery,
+} from "../api/getApiRes";
+
+let qs = require('qs');
+export default {
+  data() {
+    return {
+      editableTabsValue: '1',
+      getNowDate: getNowDate(),
+      classList: [],
+      PreFinishList: [],
+      appointList: [],
+      TodayClassOrder: [],
+      TodayVipOrder: [],
+      AllCount: 0,
+      YesterdayCount: 0,
+      YestodayOrderNum: 0,
+      NowCount: 0,
+      CountAdd: 0,
+      TodayIncreaseNum: 0,
+      TodayOrderNum: 0,
+      ClassNum: 0,
+      TodayOrderSttNum: 0,
+    }
+  },
+  mounted() {
+    let that = this;
+
+    // 下课管理
+    this.getVipUserStatistics();
+    this.getClassStatistics();
+    this.ClassQuery();
+    this.getVipUserOrderQuery();
+    // 预约统计
+    this.getOrderStatistics();
+    this.getWaitingBeginClassList();
+    this.timer = setInterval(() => {
+      that.getVipUserOrderQuery();
+      this.getVipUserStatistics();
+      this.getClassStatistics();
+      this.ClassQuery();
+      this.getOrderStatistics();
+      this.getWaitingBeginClassList();
+    }, 10000);
+  },
+  destroyed() {
+    clearInterval(this.timer);//页面销毁时清除定时器
+  },
+  methods: {
+    goLesson() {
+      this.$router.push({
+        path: '/appoint',
+      })
+    },
+    goAppointDetail(name) {
+      this.$router.push({
+        path: '/appoint',
+        query: {
+          page: 'second',
+          name: name
+        }
+      })
+    },
+    goPage(url, page) {
+      this.$router.push({
+        path: '/' + url,
+        query: {
+          page: page
+        }
+      })
+    },
+    // 会员统计
+    getVipUserStatistics() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+      };
+      let postdata = qs.stringify(param);
+      VipUserStatistics(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.AllCount = json.Rs.AllCount;
+          that.YesterdayCount = json.Rs.YesterdayCount;
+          that.NowCount = json.Rs.NowCount;
+          that.CountAdd = json.Rs.CountAdd;
+        } else {
+          if (json.Code == 1010) {
+            that.$message.error(json.Memo);
+            that.$router.push({path: '/login', query: {status: 1}});
+            return false
+          } else {
+            that.$message.error(json.Memo);
+          }
+        }
+      })
+    },
+    // 课程统计
+    getClassStatistics() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+      };
+      let postdata = qs.stringify(param);
+      ClassStatistics(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.ClassNum = json.Rs.ClassNum;
+          that.TodayOrderSttNum = json.Rs.TodayOrderSttNum;
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    getOrderStatistics() {
+      let that = this;
+      that.loading = true;
+      let param = {
+        token: localStorage.token,
+      };
+      let postdata = qs.stringify(param);
+      OrderStatistics(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.loading = false;
+          if (json.Rs) {
+            that.TodayIncreaseNum = json.Rs.TodayIncreaseNum;
+            that.TodayOrderNum = json.Rs.TodayOrderNum;
+            that.YestodayOrderNum = json.Rs.YestodayOrderNum;
+          }
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    checkClassOverPrepare(row) {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        stdId: row.StdId,
+      };
+      let postdata = qs.stringify(param);
+      ClassOverPrepare(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.goFinish(row);
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    goFinish(row) {
+      this.$router.push({
+        path: '/finishDetail', query: {
+          id: row.StdId,
+          classId: row.ClassId,
+          ClassName: row.ClassName,
+          BeginTime: row.BeginTime,
+        }
+      });
+    },
+    getWaitingBeginClassList() {
+      let that = this;
+      that.loading = true;
+      let param = {
+        token: localStorage.token,
+      };
+      let postdata = qs.stringify(param);
+      WaitingBeginClassList(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.loading = false;
+          that.classList = json.Rs;
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 下课管理
+    ClassQuery() {
+      let that = this;
+      that.loading = true;
+      let param = {
+        token: localStorage.token,
+      };
+      let postdata = qs.stringify(param);
+      ClassOngoingList(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.loading = false;
+          if (json.Rs) {
+            that.PreFinishList = json.Rs;
+          }
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 最新预约
+    getVipUserOrderQuery() {
+      let that = this;
+      that.loading = true;
+      let param = {
+        token: localStorage.token,
+        classId: 0,
+        orderDate: globalcurrent(),
+        stdId: 0,
+      };
+      let postdata = qs.stringify(param);
+      // VipUserOrderQuery(postdata).then(res => {
+      LastOrderQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.loading = false;
+          if (json.Rs) {
+            that.appointList = json.Rs;
+          }
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    }
+  },
+  filters: {
+    parseDate: function (value) {
+      if (!value) {
+        return false
+      } else {
+        let res = nonTfmtDatetoLength(value, 10).substr(5, 10);
+        return res;
+      }
+    },
+  },
+  watch: {
+    $route(to) {
+      if (to.name == 'Main') {
+        this.getVipUserStatistics();
+        this.getClassStatistics();
+        this.ClassQuery();
+        this.getVipUserOrderQuery();
+        this.getOrderStatistics();
+        this.getWaitingBeginClassList();
+      } else {
+        clearInterval(this.timer);//页面销毁时清除定时器
+      }
+    },
+  },
+}
 </script>
 
 <style scoped>
 
-    ul, li {
-        list-style: none;
-        margin: 0;
-        padding: 0;
-
-    }
-
-    em {
-        font-style: normal;
-    }
-
-    .container {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding-bottom: 60px;
-    }
-
-    .container .lt {
-        width: 1173px;
-        float: left;
-        margin-top: 0px;
-    }
-
-    .container .rt {
-        width: 436px;
-        height: 100%;
-        float: right;
-    }
-
-    .lt .top {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-    }
-
-    .lt .top li {
-        width: 377px;
-        height: 140px;
-        float: left;
-        background: #fff;
-        border-radius: 12px;
-        margin-right: 20px;
-        cursor: pointer;
-    }
-
-    .lt .top li:nth-child(3) {
-        margin-right: 0;
-    }
-
-    .top li img {
-        float: left;
-        margin-top: 17px;
-        margin-left: 30px;
-        margin-right: 24px;
-    }
-
-    .top li .liRight {
-        width: 200px;
-        float: left;
-        margin-top: 17px;
-    }
-
-    .top .liRight h5 {
-        margin: 0;
-        padding: 0;
-        text-align: left;
-    }
-
-    .top .liRight span {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        text-align: left;
-        font-size: 26px;
-        font-family: Arial;
-        margin-top: 7px;
-        margin-bottom: 20px;
-    }
-
-    .btLine {
-        width: 84%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        border-top: 1px solid #F0F2F5;
-        padding-top: 17px;
-    }
-
-    .btLine em {
-        font-size: 14px;
-    }
-
-    .btLine .emlt {
-        width: 50%;
-        float: left;
-        text-align: left;
-    }
-
-    .btLine i {
-        font-size: 18px;
-        color: #BDBDBD;
-    }
-    .emlt i {
-        float: left;
-    }
-    .finish {
-        width: 100%;
-        min-height: 358px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        background: #fff;
-        margin-top: 15px;
-        border-radius: 12px;
-        padding-top: 15px;
-        padding-bottom: 0px;
-    }
-
-    .finish .title {
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding-left: 30px;
-    }
-
-    .finish .title h5 {
-        margin: 0;
-        float: left;
-        font-size: 18px;
-    }
-
-    .finish .title span {
-        float: right;
-        margin-right: 43px;
-        font-size: 14px;
-        color: #717171;
-    }
-
-    .finish ul {
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding-left: 30px;
-        padding-right: 30px;
-        margin: 0 auto;
-        margin-top: 10px;
-    }
-
-    .finish ul li {
-        width: 347px;
-        height: 149px;
-        overflow: hidden;
-        float: left;
-        margin-bottom: 14px;
-    }
-
-    .finish ul li:nth-child(2) {
-        margin-left: 24px;
-        margin-right: 24px;
-    }
-
-    .finish ul li:nth-child(5) {
-        margin-left: 24px;
-        margin-right: 24px;
-    }
-
-    .finish li .finListTitle {
-        width: 100%;
-        height: 35px;
-        line-height: 35px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        background-color: #3799FF;
-        border-top-left-radius: 7px;
-        border-top-right-radius: 7px;
-        color: #000;
-    }
-
-    .finish li .context {
-        width: 344px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        border: 1px solid #E8E8E8;
-        border-top: none;
-        padding-top: 16px;
-        padding-bottom: 16px;
-        border-bottom-left-radius: 7px;
-        border-bottom-right-radius: 7px;
-    }
-
-    .finish .context em {
-        width: 85px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        height: 40px;
-        line-height: 30px;
-        color: #BDBDBD;
-    }
-
-    .context .ctl {
-        width: 211px;
-        float: left;
-        padding-left: 16px;
-        margin-right: 20px;
-    }
-
-    .ctl span {
-        width: 100%;
-        height: 30px;
-        line-height: 30px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        background-color: #F8F8F8;
-        color: #404040;
-        font-size: 14px;
-        text-align: left;
-        padding-left: 20px;
-        margin-bottom: 15px;
-    }
-
-    .ctl span:nth-child(2) {
-        margin-bottom: 0px;
-    }
-
-    /deep/ .el-button--primary.is-plain {
-        background-color: #fff;
-    }
-
-    /deep/ .el-button--primary.is-plain:hover {
-        color: #005EA2 !important;
-    }
-
-    .blue {
-        color: #3799FF;
-    }
-
-    .appoint {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        background: #fff;
-        margin-top: 15px;
-        border-radius: 12px;
-        padding-top: 15px;
-        padding-bottom: 1px;
-    }
-
-    .appoint .title {
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding-left: 30px;
-    }
-
-    .appoint .title h5 {
-        margin: 0;
-        float: left;
-        font-size: 18px;
-    }
-
-    .appoint .title span {
-        float: right;
-        margin-right: 43px;
-        font-size: 14px;
-        color: #717171;
-    }
-
-    .appoint .appointCard {
-        min-height: 195px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding-top: 25px;
-        padding-bottom: 25px;
-        padding-left: 30px;
-        padding-right: 30px;
-    }
-
-    /deep/ .el-card {
-        width: 150px;
-        float: left;
-        margin-right: 31px;
-        padding: 0;
-        border-radius: 12px;
-    }
-
-    /deep/ .el-card:nth-child(last) {
-        margin-right: 0;
-    }
-
-    /deep/ .el-card__body {
-        padding: 0;
-    }
-
-    .cardTitle {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        height: 40px;
-        line-height: 40px;
-        background: #F0F2F5;
-    }
-
-    .appointCard span {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        color: #777777;
-        font-family: Arial;
-        margin-top: 10px;
-        margin-bottom: 10px;
-        font-size: 16px;
-    }
-
-    .appointCard em {
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        font-size: 12px;
-        margin-bottom: 20px;
-        text-align: left;
-        padding-left: 16px;
-        padding-right: 16px;
-    }
-
-    .appointCard em i {
-        float: right;
-        color: #000000;
-        padding-right: 3px;
-    }
-
-    .appointCard em s {
-        /*width: 47px;*/
-        height: 20px;
-        line-height: 20px;
-        text-align: center;
-        font-style: normal;
-        text-decoration: none;
-        float: right;
-        border-radius: 3px;
-        padding: 0 3px;
-    }
-
-    .appointCard em s.blue {
-        background-color: #E5F2FF;
-        color: #3799FF;
-    }
-    .appointCard em s.red {
-        background-color: #E5F2FF;
-        color: rgb(204,2,2);
-    }
-    .rtContext {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-top: 0px;
-        background: #fff;
-        padding: 0;
-        border-radius: 12px;
-        min-height: 826px;
-        background: #fff;
-    }
-
-    .rtContext .rtTitle {
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding: 10px 30px;
-    }
-
-    .rtTitle h5 {
-        margin: 0;
-        float: left;
-        font-size: 18px;
-    }
-
-    .rtTitle span {
-        float: right;
-        font-size: 14px;
-        color: #BDBDBD;
-        cursor: pointer;
-    }
-
-    .rtContext ul {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        height: 100%;
-        overflow: hidden;
-        overflow-y: scroll;
-        margin: 0 auto;
-        padding-left: 30px;
-        padding-right: 30px;
-    }
-
-    .rtContext li {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        border-bottom: 1px solid #F0F2F5;
-        padding-top: 30px;
-        padding-bottom: 10px;
-        cursor: pointer;
-    }
-
-    .asTitle {
-        width: 100%;
-        height: 30px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        text-align: left;
-        line-height: 20px;
-        color: #000000;
-        font-size: 14px;
-
-    }
-
-    .asTitle img {
-        float: left;
-        margin-right: 5px;
-    }
-
-    .asTitle span {
-        /*width: 26px;*/
-        min-width: 300px;
-        height: 30px;
-        line-height: 26px;
-        float: left;
-        margin-right: 10px;
-    }
-    .asTitle em {
-        float: right;
-        text-align: right;
-    }
-
-    .asContent {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-    }
-
-    .asContent span {
-        width: 50%;
-        float: left;
-        font-size: 14px;
-        color: #BDBDBD;
-        margin-bottom: 10px;
-        text-align: left;
-        text-indent: 8px;
-    }
-
-    .asContent span em {
-        color: #000;
-        text-align: left;
-    }
-
-    .asContent span s {
-        text-decoration: none;
-        color: #000;
-        border-radius: 250px;
-        padding: 3px 5px;
-    }
-
-    .asContent span s.blue {
-        background-color: #E5F2FF;
-    }
-    .box-card {
-        cursor: pointer;
-    }
-
-    .box-card em {
-        font-style: normal;
-    }
-
-    i {
-        font-style: normal;
-    }
-
-    .asContent .green {
-        color: #25CC42;
-    }
-
-    .asContent .red {
-        color: red;
-    }
-
-    .asContent .yellow {
-        color: #FFDD00;
-    }
-
-    /deep/ a {
-        color: #03B1FF;
-    }
-    .tips {
-        color: #333;
-        font-size: 14px!important;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-top: 10px;
-        line-height: 30px;
-    }
-    .middleTips {
-        margin-top: 180px;
-    }
+ul, li {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+
+}
+
+em {
+  font-style: normal;
+}
+
+.container {
+  width: 100%;
+  overflow: hidden;
+  overflow-y: scroll;
+  display: block;
+  margin: 0 auto;
+  padding-bottom: 60px;
+}
+
+.container .lt {
+  width: 1173px;
+  float: left;
+  margin-top: 0px;
+}
+
+.container .rt {
+  width: 436px;
+  height: 100%;
+  float: right;
+}
+
+.lt .top {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+}
+
+.lt .top li {
+  width: 377px;
+  height: 140px;
+  float: left;
+  background: #fff;
+  border-radius: 12px;
+  margin-right: 20px;
+  cursor: pointer;
+}
+
+.lt .top li:nth-child(3) {
+  margin-right: 0;
+}
+
+.top li img {
+  float: left;
+  margin-top: 17px;
+  margin-left: 30px;
+  margin-right: 24px;
+}
+
+.top li .liRight {
+  width: 200px;
+  float: left;
+  margin-top: 17px;
+}
+
+.top .liRight h5 {
+  margin: 0;
+  padding: 0;
+  text-align: left;
+}
+
+.top .liRight span {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  text-align: left;
+  font-size: 26px;
+  font-family: Arial;
+  margin-top: 7px;
+  margin-bottom: 20px;
+}
+
+.btLine {
+  width: 84%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  border-top: 1px solid #F0F2F5;
+  padding-top: 17px;
+}
+
+.btLine em {
+  font-size: 14px;
+}
+
+.btLine .emlt {
+  width: 50%;
+  float: left;
+  text-align: left;
+}
+
+.btLine i {
+  font-size: 18px;
+  color: #BDBDBD;
+}
+
+.emlt i {
+  float: left;
+}
+
+.finish {
+  width: 100%;
+  min-height: 358px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  background: #fff;
+  margin-top: 15px;
+  border-radius: 12px;
+  padding-top: 15px;
+  padding-bottom: 0px;
+}
+
+.finish .title {
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  padding-left: 30px;
+}
+
+.finish .title h5 {
+  margin: 0;
+  float: left;
+  font-size: 18px;
+}
+
+.finish .title span {
+  float: right;
+  margin-right: 43px;
+  font-size: 14px;
+  color: #717171;
+}
+
+.finish ul {
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  padding-left: 30px;
+  padding-right: 30px;
+  margin: 0 auto;
+  margin-top: 10px;
+}
+
+.finish ul li {
+  width: 347px;
+  height: 149px;
+  overflow: hidden;
+  float: left;
+  margin-bottom: 14px;
+}
+
+.finish ul li:nth-child(2) {
+  margin-left: 24px;
+  margin-right: 24px;
+}
+
+.finish ul li:nth-child(5) {
+  margin-left: 24px;
+  margin-right: 24px;
+}
+
+.finish li .finListTitle {
+  width: 100%;
+  height: 35px;
+  line-height: 35px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  background-color: #3799FF;
+  border-top-left-radius: 7px;
+  border-top-right-radius: 7px;
+  color: #000;
+}
+
+.finish li .context {
+  width: 344px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  border: 1px solid #E8E8E8;
+  border-top: none;
+  padding-top: 16px;
+  padding-bottom: 16px;
+  border-bottom-left-radius: 7px;
+  border-bottom-right-radius: 7px;
+}
+
+.finish .context em {
+  width: 85px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  height: 40px;
+  line-height: 30px;
+  color: #BDBDBD;
+}
+
+.context .ctl {
+  width: 211px;
+  float: left;
+  padding-left: 16px;
+  margin-right: 20px;
+}
+
+.ctl span {
+  width: 100%;
+  height: 30px;
+  line-height: 30px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  background-color: #F8F8F8;
+  color: #404040;
+  font-size: 14px;
+  text-align: left;
+  padding-left: 20px;
+  margin-bottom: 15px;
+}
+
+.ctl span:nth-child(2) {
+  margin-bottom: 0px;
+}
+
+/deep/ .el-button--primary.is-plain {
+  background-color: #fff;
+}
+
+/deep/ .el-button--primary.is-plain:hover {
+  color: #005EA2 !important;
+}
+
+.blue {
+  color: #3799FF;
+}
+
+.appoint {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  background: #fff;
+  margin-top: 15px;
+  border-radius: 12px;
+  padding-top: 15px;
+  padding-bottom: 1px;
+}
+
+.appoint .title {
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  padding-left: 30px;
+}
+
+.appoint .title h5 {
+  margin: 0;
+  float: left;
+  font-size: 18px;
+}
+
+.appoint .title span {
+  float: right;
+  margin-right: 43px;
+  font-size: 14px;
+  color: #717171;
+}
+
+.appoint .appointCard {
+  min-height: 195px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  padding-top: 25px;
+  padding-bottom: 25px;
+  padding-left: 30px;
+  padding-right: 30px;
+}
+
+/deep/ .el-card {
+  width: 150px;
+  float: left;
+  margin-right: 31px;
+  padding: 0;
+  border-radius: 12px;
+}
+
+/deep/ .el-card:nth-child(last) {
+  margin-right: 0;
+}
+
+/deep/ .el-card__body {
+  padding: 0;
+}
+
+.cardTitle {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  height: 40px;
+  line-height: 40px;
+  background: #F0F2F5;
+}
+
+.appointCard span {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  color: #777777;
+  font-family: Arial;
+  margin-top: 10px;
+  margin-bottom: 10px;
+  font-size: 16px;
+}
+
+.appointCard em {
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  font-size: 12px;
+  margin-bottom: 14px;
+  text-align: left;
+  padding-left: 16px;
+  padding-right: 16px;
+}
+
+.appointCard em i {
+  float: right;
+  color: #000000;
+  padding-right: 3px;
+}
+
+.appointCard em s {
+  /*width: 47px;*/
+  height: 20px;
+  line-height: 20px;
+  text-align: center;
+  font-style: normal;
+  text-decoration: none;
+  float: right;
+  border-radius: 3px;
+  padding: 0 3px;
+}
+
+.appointCard em s.blue {
+  background-color: #E5F2FF;
+  color: #3799FF;
+}
+
+.appointCard em s.red {
+  background-color: #E5F2FF;
+  color: rgb(204, 2, 2);
+}
+
+.rtContext {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-top: 0px;
+  background: #fff;
+  padding: 0;
+  border-radius: 12px;
+  min-height: 826px;
+  background: #fff;
+}
+
+.rtContext .rtTitle {
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  padding: 10px 30px;
+}
+
+.rtTitle h5 {
+  margin: 0;
+  float: left;
+  font-size: 18px;
+}
+
+.rtTitle span {
+  float: right;
+  font-size: 14px;
+  color: #BDBDBD;
+  cursor: pointer;
+}
+
+.rtContext ul {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  height: 100%;
+  overflow: hidden;
+  overflow-y: scroll;
+  margin: 0 auto;
+  padding-left: 30px;
+  padding-right: 30px;
+}
+
+.rtContext li {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  border-bottom: 1px solid #F0F2F5;
+  padding-top: 30px;
+  padding-bottom: 10px;
+  cursor: pointer;
+}
+
+.asTitle {
+  width: 100%;
+  height: 30px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  text-align: left;
+  line-height: 20px;
+  color: #000000;
+  font-size: 14px;
+
+}
+
+.asTitle img {
+  float: left;
+  margin-right: 5px;
+}
+
+.asTitle span {
+  /*width: 26px;*/
+  min-width: 300px;
+  height: 30px;
+  line-height: 26px;
+  float: left;
+  margin-right: 10px;
+}
+
+.asTitle em {
+  float: right;
+  text-align: right;
+}
+
+.asContent {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+}
+
+.asContent span {
+  width: 50%;
+  float: left;
+  font-size: 14px;
+  color: #BDBDBD;
+  margin-bottom: 10px;
+  text-align: left;
+  text-indent: 8px;
+}
+
+.asContent span em {
+  color: #000;
+  text-align: left;
+}
+
+.asContent span s {
+  text-decoration: none;
+  color: #000;
+  border-radius: 250px;
+  padding: 3px 5px;
+  text-align: center;
+}
+
+.asContent span s.blue {
+  background-color: #E5F2FF;
+}
+
+.box-card {
+  cursor: pointer;
+}
+
+.box-card em {
+  font-style: normal;
+}
+
+i {
+  font-style: normal;
+}
+
+.asContent .green {
+  color: #25CC42;
+}
+
+.asContent .red {
+  color: red;
+}
+
+.asContent .yellow {
+  color: #FFDD00;
+}
+
+/deep/ a {
+  color: #03B1FF;
+}
+
+.tips {
+  color: #333;
+  font-size: 14px !important;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-top: 10px;
+  line-height: 30px;
+}
+
+.middleTips {
+  margin-top: 180px;
+}
+
+/*ipad only*/
+@media only screen and (max-width: 1366px) {
+  .container {
+    padding-top: 6px;
+  }
+  .container .lt {
+    width: 80%;
+  }
+  .lt .top {
+    width: 96%;
+  }
+
+  .lt .top li {
+    width: 32%;
+    margin-right: 2%;
+  }
+
+  .top li .liRight {
+    width: 50%;
+  }
+
+  .btLine em {
+    font-size: 12px;
+    float: left;
+    line-height: 22px;
+  }
+
+  .finish ul li {
+    width: 30%;
+    /*height: 159px;*/
+    overflow: hidden;
+    padding-bottom: 20px;
+  }
+
+  .finish li .context {
+    width: 99%;
+    overflow: hidden;
+    display: block;
+    margin: 0;
+    padding: 0px;
+    height: auto!important;
+    padding-bottom: 5px;
+    border-top-left-radius: 0;
+    border-top-right-radius: 0;
+  }
+
+  .finish li .context .ctl {
+    width: 100%;
+    overflow: hidden;
+    display: block;
+    margin: 0;
+    padding: 0;
+    padding-top: 6px;
+    margin-bottom: 3px;
+  }
+
+  .ctl span {
+    width: 80%;
+    padding: 0;
+    font-size: 12px;
+    text-align: center;
+  }
+
+  .finish {
+    width: 97%;
+  }
+
+  .appoint {
+    width: 97%;
+  }
+
+  .finish .context em {
+    height: 30px;
+    line-height: 40px;
+    font-size: 12px;
+    float: left;
+  }
+  .finish .context {
+    height: auto!important;
+    padding-bottom: 5px;
+  }
+  .el-main > .container {
+    /*height: 772px;*/
+  }
+
+  .container .rt {
+    width: 20%;
+  }
+
+  .rtTitle span {
+    font-size: 12px;
+    line-height: 30px;
+  }
+  .rtContext ul {
+    padding: 2px!important;
+    font-size: 12px;
+  }
+  .asTitle {
+    width: 30px;
+    float: left;
+  }
+  .asContent {
+    width: 82%;
+  }
+  .asContent span {
+    width: 100%;
+    overflow: hidden;
+    display: block;
+    margin: 0 auto;
+    font-size: 12px;
+    height: 20px;
+  }
+}
 </style>

pc/src/views/Member.vue

@@ -11,7 +11,7 @@
             </el-col>
             <el-col :span="4">
               <em>手机号:</em>
-              <el-input v-model="panel.phone" placeholder="请输入手机号"></el-input>
+              <el-input v-model="panel.phone" placeholder="请输入手机号" type="number" ></el-input>
             </el-col>
             <el-col :span="4">
               <em>会员类型:</em>
@@ -36,14 +36,14 @@
               </el-select>
             </el-col>
             <el-col :span="4">
-              <el-button size="" type="primary" @click="query" plain>查询</el-button>
+              <el-button size="" type="primary" @click="query" plain :disabled="serachBtnStatus">查询</el-button>
             </el-col>
           </el-row>
         </div>
       </div>
     </div>
     <div class="change">
-      <el-button @click="addMember" v-if="userLevel != 4">新增会员</el-button>
+      <el-button @click="addMember" v-if="userLevel != 4" type="primary">新增会员</el-button>
       <el-button @click="delList" v-if="userLevel != 4">删除会员</el-button>
       <el-button @click="lessonChange" v-if="userLevel != 4">课时调整</el-button>
       <el-button @click="giftChange" v-if="userLevel != 4">赠送课时调整</el-button>
@@ -377,7 +377,7 @@ export default {
       },
       multipleSelection: [],
       pageination: {
-        pageItem: 100,
+        pageItem: 20,
         pageoptions: pageOptions(),
         total: 100,
         pageIndex: 1,
@@ -404,7 +404,8 @@ export default {
       memberTypes: vipOptions(1),
       tableData: [],
       tableRadio: [],
-      userLevel: localStorage.userLevel
+      userLevel: localStorage.userLevel,
+      serachBtnStatus: false
     }
   },
   mounted() {
@@ -416,7 +417,6 @@ export default {
   methods: {
     // 打开take绑定和拉取take数据
     addTake(row) {
-      this.TakeVisible = true;
       let that = this;
       let param = {
         token: localStorage.token,
@@ -430,6 +430,8 @@ export default {
           if (json.Rs != '') {
             that.Takeoptions = json.Rs;
             that.Takevalue = json.Rs[0].Id;
+            // 有值才能打开
+            this.TakeVisible = true;
           } else {
             that.$message.error('当前用户没有可用的Take账号');
             this.TakeVisible = false;
@@ -878,6 +880,7 @@ export default {
       ClassListQuery(postdata).then(res => {
         let json = res;
         if (json.Code == 0) {
+          if (json.Rs == null) return false
           that.form.dialogdata = turnClassResToOption(json.Rs);
         } else {
           that.$message.error(json.Memo);
@@ -940,8 +943,18 @@ export default {
     },
     // 查询按钮
     query() {
-      this.getTableQuery();
-      this.$message.success('查询完毕');
+      let that = this;
+      that.serachBtnStatus = true;
+      that.getTableQuery();
+      that.$message.success('查询完毕');
+      let totalTime = 2
+      let clock = window.setInterval(() => {
+        totalTime--
+        if (totalTime < 0) {
+          totalTime = 2;
+          that.serachBtnStatus = false;
+        }
+      }, 1000)
     },
     clearForm() {
       // clear
@@ -979,7 +992,6 @@ export default {
             that.allTableData = [];
             that.recordsTotal = 0;
           }
-
           // 设置分页数据
           that.setPaginations();
         } else {
@@ -1005,7 +1017,7 @@ export default {
         return index < that.pageination.pageItem;
       });
       that.draw = that.pageination.pageItem;
-      that.getTableQuery();
+      // that.getTableQuery();
     },
     // 翻页
     pageChange(pageIndex) {
@@ -1023,18 +1035,19 @@ export default {
         this.tableData = tables;
       }
       that.start = index * that.draw;
-      that.getTableQuery();
+      // that.getTableQuery();
     },
     // 过滤时间
     filterFmtDate(value, row, column) {
       let that = this;
-      if (column == "0001-01-01T08:05:43+08:05") {
+      if (column == "0001-01-01T08:05:43+08:05" || column == "0001-01-01T00:00:00Z") {
         return '无有效期';
       } else {
         return nonTfmtDate(column, 11);
       }
     },
-  },
+  }
+  ,
   watch: {
     $route(to) {
       if (to.name == 'Member') {
@@ -1043,8 +1056,10 @@ export default {
         // 读取列表
         this.getTableQuery();
       }
-    },
-  },
+    }
+    ,
+  }
+  ,
 }
 </script>
 

pc/src/views/ShopManage.vue

@@ -1,550 +1,563 @@
 <template>
-    <div class="context">
-        <div class="panel">
-            <h5>店面管理</h5>
-            <div class="panel-body">
-                <div class="panel_control">
-                    <el-row :gutter="20">
-                        <el-col :span="4">
-                            <em>店铺名称:</em>
-                            <el-input v-model="panel.shopName" placeholder="请输入店铺名称"></el-input>
-                        </el-col>
-                        <el-col :span="4">
-                            <em>负责人:</em>
-                            <el-input v-model="panel.contacts" placeholder="请输入负责人"></el-input>
-                        </el-col>
-                        <el-col :span="4">
-                            <em>手机号:</em>
-                            <el-input v-model="panel.phone" placeholder="请输入手机号"></el-input>
-                        </el-col>
-                        <el-col :span="4">
-                            <el-button size="" type="primary" @click="query" plain>查询</el-button>
-                        </el-col>
-                    </el-row>
-                </div>
-            </div>
+  <div class="context">
+    <div class="panel">
+      <h5>店面管理</h5>
+      <div class="panel-body">
+        <div class="panel_control">
+          <el-row :gutter="20">
+            <el-col :span="4">
+              <em>店面名称:</em>
+              <el-input v-model="panel.shopName" placeholder="请输入店面名称"></el-input>
+            </el-col>
+            <el-col :span="4">
+              <em>负责人:</em>
+              <el-input v-model="panel.contacts" placeholder="请输入负责人"></el-input>
+            </el-col>
+            <el-col :span="4">
+              <em>手机号:</em>
+              <el-input v-model="panel.phone" placeholder="请输入手机号" type="number" ></el-input>
+            </el-col>
+            <el-col :span="4">
+              <el-button size="" type="primary" @click="query" plain :disabled="serachBtnStatus">查询</el-button>
+            </el-col>
+          </el-row>
         </div>
-        <div class="change">
-            <el-button @click="addAdmin" type="primary">新增店面</el-button>
-            <el-button @click="editList">编辑店面</el-button>
-            <el-button @click="delList">删除店面</el-button>
-        </div>
-        <div class="table">
-            <el-table
-                    :data="tableData"
-                    border
-                    is-horizontal-resize
-                    :default-sort="{prop: 'date', order: 'descending'}"
-                    element-loading-background="rgba(0, 0, 0, 0.8)"
-                    class=""
-                    @selection-change="handleSelectionChange" @current-change="clickChange"
-            >
-
-                >
-                <el-table-column label="选择" width="55">
-    <template slot-scope="scope">
-        <el-radio  v-model="tableRadio" :label="scope.row"><i></i></el-radio>
-    </template>
-</el-table-column>
-                <el-table-column
-                        type="index"
-                        label="序号"
-                        align="center"
+      </div>
+    </div>
+    <div class="change">
+      <el-button @click="addAdmin" type="primary">新增店面</el-button>
+      <el-button @click="editList">编辑店面</el-button>
+      <el-button @click="delList">删除店面</el-button>
+    </div>
+    <div class="table">
+      <el-table
+          :data="tableData"
+          border
+          is-horizontal-resize
+          :default-sort="{prop: 'date', order: 'descending'}"
+          element-loading-background="rgba(0, 0, 0, 0.8)"
+          class=""
+          @selection-change="handleSelectionChange" @current-change="clickChange"
+      >
 
-                        width="50">
-                </el-table-column>
-                <el-table-column
-                        prop="ShopName"
-                        label="店面名称"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="Addr"
-                        label="位置"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="Contacts"
-                        label="负责人"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="Phone"
-                        label="手机号"
-                >
-                </el-table-column>
-            </el-table>
-            <br>
-            <el-pagination
-                    background
-                    :total="pageination.total"
-                    :page-size="pageination.pageItem"
-                    @current-change="pageChange"
-            ></el-pagination>
-        </div>
+        >
+        <el-table-column label="选择" width="55">
+          <template slot-scope="scope">
+            <el-radio v-model="tableRadio" :label="scope.row"><i></i></el-radio>
+          </template>
+        </el-table-column>
+        <el-table-column
+            type="index"
+            label="序号"
+            align="center"
 
-        <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="650px">
-            <div>
-                <el-form ref="form" :model="form" label-width="80px">
-                    <el-form-item label="店面名称">
-                        <el-input v-model="form.shopName"></el-input>
-                    </el-form-item>
-                    <el-form-item label="位置">
-                        <el-input v-model="form.addr"></el-input>
-                    </el-form-item>
-                    <el-form-item label="负责人">
-                        <el-input v-model="form.contacts"></el-input>
-                    </el-form-item>
-                    <el-form-item label="手机号">
-                        <el-input v-model="form.phone"></el-input>
-                    </el-form-item>
-                </el-form>
-            </div>
-            <div class="dialogFooter">
-                <el-button type="primary" size="small" @click="confirmAdmin" v-if="form.btnState == 0">确定</el-button>
-                <el-button type="primary" size="small" @click="confirmEdite" v-if="form.btnState == 1">确定</el-button>
-                <el-button @click="dialogVisible = false" size="small">取消</el-button>
-            </div>
-        </el-dialog>
+            width="50">
+        </el-table-column>
+        <el-table-column
+            prop="ShopName"
+            label="店面名称"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="Addr"
+            label="位置"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="Contacts"
+            label="负责人"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="Phone"
+            label="手机号"
+        >
+        </el-table-column>
+      </el-table>
+      <br>
+      <el-pagination
+          background
+          :total="pageination.total"
+          :page-size="pageination.pageItem"
+          @current-change="pageChange"
+      ></el-pagination>
     </div>
+
+    <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="650px">
+      <div>
+        <el-form ref="form" :model="form" label-width="80px">
+          <el-form-item label="店面名称">
+            <el-input v-model="form.shopName"></el-input>
+          </el-form-item>
+          <el-form-item label="位置">
+            <el-input v-model="form.addr"></el-input>
+          </el-form-item>
+          <el-form-item label="负责人">
+            <el-input v-model="form.contacts"></el-input>
+          </el-form-item>
+          <el-form-item label="手机号">
+            <el-input v-model="form.phone"></el-input>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="dialogFooter">
+        <el-button type="primary" size="small" @click="confirmAdmin" v-if="form.btnState == 0">确定</el-button>
+        <el-button type="primary" size="small" @click="confirmEdite" v-if="form.btnState == 1">确定</el-button>
+        <el-button @click="dialogVisible = false" size="small">取消</el-button>
+      </div>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
-    import Global from '../Global.js'
-    import {
-        ShopAdd,
-        ShopDetailQuery,
-        ShopEdit,
-        ShopListQuery,
-        ShopStatusEdit,
-        testTable,
-        testSelect
-    } from "../api/getApiRes";
+import Global from '../Global.js'
+import {
+  ShopAdd,
+  ShopDetailQuery,
+  ShopEdit,
+  ShopListQuery,
+  ShopStatusEdit,
+  testTable,
+  testSelect
+} from "../api/getApiRes";
 
-    let qs = require('qs');
-    export default {
-        data() {
-            return {
-                dialogVisible: false,
-                dialogTitle: '新增店面',
-                // panel 配置项目
-                panel: {
-                    shopName: '',
-                    contacts: '',
-                    phone: '',
-                    userCode: '',
-                    tel: '',
-                    shopList: 0,
-                    options: [],
-                    draw: 1,
-                    start: 0,
-                    recordsTotal: 0,
-                    tableData: [],
-                    allTableData: [],
-                    limit: '10',
-                    multipleSort: false,
-                    loading: false,
-                    fileList: [],
-                    multipleSelection: [],
-                    detectedmac: '',
-                    time1: globalBt(),
-                },
-                multipleSelection: [],
-                pageination: {
-                    pageItem: 100,
-                    pageoptions: pageOptions(),
-                    total: 100,
-                    pageIndex: 1,
-                },
-                form: {
-                    shopName: '',
-                    addr: '',
-                    name: '',
-                    contacts: '',
-                    phone: '',
-                    userCode: '',
-                    shopId: '',
-                    btnState: 0,
-                },
-                shops: [],
-                tableData: [],
-                tableRadio: [],
-            }
-        },
-        mounted() {
-            this.getTableQuery();
-        },
-        methods: {
-            clickChange (item) {
-                this.tableRadio = item
-            },
-            // 新增 确认提交
-            confirmAdmin() {
-                let that = this;
-                // checkNum
-                if (!that.form.shopName) {
-                    this.$message.error('错了哦，店面名称不能为空');
-                    return false
-                }
-                if (that.form.shopName.length > 18) {
-                    this.$message.error('错了哦，姓名字数超过18个字');
-                    return false
-                }
-                if (!that.form.addr) {
-                    this.$message.error('错了哦，位置不能为空');
-                    return false
-                }
-                if (that.form.addr.length > 38) {
-                    this.$message.error('错了哦，位置字数超过38个字');
-                    return false
-                }
-                if (!that.form.contacts) {
-                    this.$message.error('错了哦，负责人不能为空');
-                    return false
-                }
-                if (that.form.contacts.length > 8) {
-                    this.$message.error('错了哦，负责人字数超过8个字');
-                    return false
-                }
-                if (!that.form.phone) {
-                    this.$message.error('错了哦，手机号不能为空');
-                    return false
-                }
-                if (!globalCheckPhone(that.form.phone)) {
-                    this.$message.error('错了哦，手机号格式不正确');
-                    return false
-                }
-                let param = {
-                    token: localStorage.token,
-                    shopName: that.form.shopName,
-                    addr: that.form.addr,
-                    contacts: that.form.contacts,
-                    phone: that.form.phone,
-                    shopid: that.form.shopid,
-                };
-                let postdata = qs.stringify(param);
-                ShopAdd(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogVisible = false;
-                        // 重载列表
-                        that.getTableQuery();
-                        that.$message({
-                            showClose: true,
-                            message: '店面添加成功！',
-                            type: 'success'
-                        });
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 修改
-            confirmEdite() {
-                let that = this;
-                // checkNum
-                if (!that.form.shopName) {
-                    this.$message.error('错了哦，店面名称不能为空');
-                    return false
-                }
-                if (that.form.shopName.length > 18) {
-                    this.$message.error('错了哦，姓名字数超过18个字');
-                    return false
-                }
-                if (!that.form.addr) {
-                    this.$message.error('错了哦，位置不能为空');
-                    return false
-                }
-                if (that.form.addr.length > 38) {
-                    this.$message.error('错了哦，位置字数超过38个字');
-                    return false
-                }
-                if (!that.form.contacts) {
-                    this.$message.error('错了哦，负责人不能为空');
-                    return false
-                }
-                if (that.form.contacts.length > 8) {
-                    this.$message.error('错了哦，负责人字数超过8个字');
-                    return false
-                }
-                if (!that.form.phone) {
-                    this.$message.error('错了哦，手机号不能为空');
-                    return false
-                }
-                if (!globalCheckPhone(that.form.phone)) {
-                    this.$message.error('错了哦，手机号格式不正确');
-                    return false
-                }
-                let param = {
-                    token: localStorage.token,
-                    shopName: that.form.shopName,
-                    addr: that.form.addr,
-                    contacts: that.form.contacts,
-                    phone: that.form.phone,
-                    shopId: that.form.shopId,
-                };
-                let postdata = qs.stringify(param);
-                ShopEdit(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogVisible = false;
+let qs = require('qs');
+export default {
+  data() {
+    return {
+      dialogVisible: false,
+      dialogTitle: '新增店面',
+      // panel 配置项目
+      panel: {
+        shopName: '',
+        contacts: '',
+        phone: '',
+        userCode: '',
+        tel: '',
+        shopList: 0,
+        options: [],
+        draw: 1,
+        start: 0,
+        recordsTotal: 0,
+        tableData: [],
+        allTableData: [],
+        limit: '10',
+        multipleSort: false,
+        loading: false,
+        fileList: [],
+        multipleSelection: [],
+        detectedmac: '',
+        time1: globalBt(),
+      },
+      multipleSelection: [],
+      pageination: {
+        pageItem: 100,
+        pageoptions: pageOptions(),
+        total: 100,
+        pageIndex: 1,
+      },
+      form: {
+        shopName: '',
+        addr: '',
+        name: '',
+        contacts: '',
+        phone: '',
+        userCode: '',
+        shopId: '',
+        btnState: 0,
+      },
+      shops: [],
+      tableData: [],
+      tableRadio: [],
+      serachBtnStatus: false,
+    }
+  },
+  mounted() {
+    this.getTableQuery();
+  },
+  methods: {
+    clickChange(item) {
+      this.tableRadio = item
+    },
+    // 新增 确认提交
+    confirmAdmin() {
+      let that = this;
+      // checkNum
+      if (!that.form.shopName) {
+        this.$message.error('错了哦，店面名称不能为空');
+        return false
+      }
+      if (that.form.shopName.length > 18) {
+        this.$message.error('错了哦，姓名字数超过18个字');
+        return false
+      }
+      if (!that.form.addr) {
+        this.$message.error('错了哦，位置不能为空');
+        return false
+      }
+      if (that.form.addr.length > 38) {
+        this.$message.error('错了哦，位置字数超过38个字');
+        return false
+      }
+      if (!that.form.contacts) {
+        this.$message.error('错了哦，负责人不能为空');
+        return false
+      }
+      if (that.form.contacts.length > 8) {
+        this.$message.error('错了哦，负责人字数超过8个字');
+        return false
+      }
+      if (!that.form.phone) {
+        this.$message.error('错了哦，手机号不能为空');
+        return false
+      }
+      if (!globalCheckPhone(that.form.phone)) {
+        this.$message.error('错了哦，手机号格式不正确');
+        return false
+      }
+      let param = {
+        token: localStorage.token,
+        shopName: that.form.shopName,
+        addr: that.form.addr,
+        contacts: that.form.contacts,
+        phone: that.form.phone,
+        shopid: that.form.shopid,
+      };
+      let postdata = qs.stringify(param);
+      ShopAdd(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogVisible = false;
+          // 重载列表
+          that.getTableQuery();
+          that.$message({
+            showClose: true,
+            message: '店面添加成功！',
+            type: 'success'
+          });
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 修改
+    confirmEdite() {
+      let that = this;
+      // checkNum
+      if (!that.form.shopName) {
+        this.$message.error('错了哦，店面名称不能为空');
+        return false
+      }
+      if (that.form.shopName.length > 18) {
+        this.$message.error('错了哦，姓名字数超过18个字');
+        return false
+      }
+      if (!that.form.addr) {
+        this.$message.error('错了哦，位置不能为空');
+        return false
+      }
+      if (that.form.addr.length > 38) {
+        this.$message.error('错了哦，位置字数超过38个字');
+        return false
+      }
+      if (!that.form.contacts) {
+        this.$message.error('错了哦，负责人不能为空');
+        return false
+      }
+      if (that.form.contacts.length > 8) {
+        this.$message.error('错了哦，负责人字数超过8个字');
+        return false
+      }
+      if (!that.form.phone) {
+        this.$message.error('错了哦，手机号不能为空');
+        return false
+      }
+      if (!globalCheckPhone(that.form.phone)) {
+        this.$message.error('错了哦，手机号格式不正确');
+        return false
+      }
+      let param = {
+        token: localStorage.token,
+        shopName: that.form.shopName,
+        addr: that.form.addr,
+        contacts: that.form.contacts,
+        phone: that.form.phone,
+        shopId: that.form.shopId,
+      };
+      let postdata = qs.stringify(param);
+      ShopEdit(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogVisible = false;
 
-                        // 重载列表
-                        that.getTableQuery();
-                        that.$message({
-                            showClose: true,
-                            message: '店面编辑成功！',
-                            type: 'success'
-                        });
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 删除
-            delList() {
-                let that = this;
-                if(this.tableRadio.length == 0){
-                    this.$message.error("请先选中一条记录");
-                    return false
-                }
-                let ShopID = this.tableRadio.ShopID;
+          // 重载列表
+          that.getTableQuery();
+          that.$message({
+            showClose: true,
+            message: '店面编辑成功！',
+            type: 'success'
+          });
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 删除
+    delList() {
+      let that = this;
+      if (this.tableRadio.length == 0) {
+        this.$message.error("请先选中一条记录");
+        return false
+      }
+      let ShopID = this.tableRadio.ShopID;
 
-                let param = {
-                    token: localStorage.token,
-                    shopId: ShopID,
-                    status: 9,//0禁用1启用9删除
-                };
-                let postdata = qs.stringify(param);
+      let param = {
+        token: localStorage.token,
+        shopId: ShopID,
+        status: 9,//0禁用1启用9删除
+      };
+      let postdata = qs.stringify(param);
 
-                this.$confirm('此操作将永久删除该店面, 是否继续?', '提示', {
-                    confirmButtonText: '确定',
-                    cancelButtonText: '取消',
-                    type: 'warning'
-                }).then(() => {
-                    ShopStatusEdit(postdata).then(res => {
-                        let json = res;
-                        if (json.Code == 0) {
-                            that.$message({
-                                showClose: true,
-                                message: '选中的店面已删除！',
-                                type: 'success'
-                            });
-                            // 重载列表
-                            that.getTableQuery();
-                        } else {
-                            that.$message.error(json.Memo);
-                        }
-                    });
-                }).catch(() => {
-                    this.$message({
-                        type: 'info',
-                        message: '已取消删除'
-                    });
-                });
-            },
-            clearForm() {
-                // clear
-                this.form.shopName = '';
-                this.form.addr = '';
-                this.form.name = '';
-                this.form.userCode = '';
-                this.form.shopId = '';
-                this.form.phone = '';
-                this.form.contacts = '';
-            },
-            // 新增店面
-            addAdmin() {
-                this.clearForm();
-                this.dialogVisible = true
-                this.dialogTitle = '新增店面'
-                this.form.btnState = 0; //新增
-            },
-            // 编辑店面
-            editList() {
-                let that = this;
-                // checkNum
-                this.clearForm();
-                this.form.btnState = 1; //编辑
-                if(this.tableRadio.length == 0){
-                    this.$message.error("请先选中一条记录");
-                    return false
-                }
-                let row = this.tableRadio;
-                this.form.shopId = row.ShopID;
-                this.form.shopName = row.ShopName;
-                this.form.addr = row.Addr;
-                this.form.contacts = row.Contacts;
-                this.form.phone = row.Phone;
+      this.$confirm('此操作将永久删除该店面, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        ShopStatusEdit(postdata).then(res => {
+          let json = res;
+          if (json.Code == 0) {
+            that.$message({
+              showClose: true,
+              message: '选中的店面已删除！',
+              type: 'success'
+            });
+            // 重载列表
+            that.getTableQuery();
+          } else {
+            that.$message.error(json.Memo);
+          }
+        });
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除'
+        });
+      });
+    },
+    clearForm() {
+      // clear
+      this.form.shopName = '';
+      this.form.addr = '';
+      this.form.name = '';
+      this.form.userCode = '';
+      this.form.shopId = '';
+      this.form.phone = '';
+      this.form.contacts = '';
+    },
+    // 新增店面
+    addAdmin() {
+      this.clearForm();
+      this.dialogVisible = true
+      this.dialogTitle = '新增店面'
+      this.form.btnState = 0; //新增
+    },
+    // 编辑店面
+    editList() {
+      let that = this;
+      // checkNum
+      this.clearForm();
+      this.form.btnState = 1; //编辑
+      if (this.tableRadio.length == 0) {
+        this.$message.error("请先选中一条记录");
+        return false
+      }
+      let row = this.tableRadio;
+      this.form.shopId = row.ShopID;
+      this.form.shopName = row.ShopName;
+      this.form.addr = row.Addr;
+      this.form.contacts = row.Contacts;
+      this.form.phone = row.Phone;
 
-                this.dialogVisible = true;
-                this.dialogTitle = '编辑店面'
-            },
-            handleSelectionChange(val) {
-                this.multipleSelection = val;
-            },
-            // 查询按钮
-            query() {
-                this.getTableQuery();
-                this.$message.success('查询完毕');
-            },
-            // 页面数据查询
-            getTableQuery() {
-                let that = this;
-                that.loading = true;
-                // 查询检测设备。上级区域id，区域id必传。regionid传0，查询supregionid对应所有子区域的检测设备。 如果supregionid，regionid都传0，默认查询企业ID下所有检测设备
-                let param = {
-                    token: localStorage.token,
-                    shopName: this.panel.shopName,//
-                    contacts: this.panel.contacts,//
-                    phone: this.panel.phone,//
-                };
-                let postdata = qs.stringify(param);
-                ShopListQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.loading = false;
-                        if (json.Rs) {
-                            that.allTableData = json.Rs;
-                            that.recordsTotal = json.Rs.length;
-                        } else {
-                            that.allTableData = [];
-                            that.recordsTotal = 0;
-                        }
-                        // 设置分页数据
-                        that.setPaginations();
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 设置分页数据
-            setPaginations() {
-                // 分页属性
-                let that = this;
-                that.pageination.total = that.recordsTotal;
-                // 默认分页
-                that.tableData = that.allTableData.filter((item, index) => {
-                    return index < that.pageination.pageItem;
-                });
-            },
-            // 每页显示数量
-            handleSizeChange() {
-                let that = this;
-                that.tableData = that.allTableData.filter((item, index) => {
-                    return index < that.pageination.pageItem;
-                });
-                that.draw = that.pageination.pageItem;
-                that.getTableQuery();
-            },
-            // 翻页
-            pageChange(pageIndex) {
-                let that = this;
-                // 获取当前页
-                let index = that.pageination.pageItem * (pageIndex - 1);
-                // 数据总数
-                let nums = that.pageination.pageItem * pageIndex;
-                // 容器
-                let tables = [];
-                for (var i = index; i < nums; i++) {
-                    if (that.allTableData[i]) {
-                        tables.push(that.allTableData[i])
-                    }
-                    this.tableData = tables;
-                }
-                that.start = index * that.draw;
-                that.getTableQuery();
-            },
-            // 自动排序
-            sortChange(params) {
-                console.log(params)
-            },
-            // 过滤时间
-            filterFmtDate(value, row, column) {
-                let that = this;
-                return nonTfmtDate(column, 11);
-            },
-            // 过滤金额
-            filterMoney(value, row, column) {
-                let that = this;
-                return parseFloat(column).toFixed(2);
-            },
-        },
-    }
+      this.dialogVisible = true;
+      this.dialogTitle = '编辑店面'
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    // 查询按钮
+    query() {
+      // 按钮倒计时
+      let that = this;
+      that.serachBtnStatus = true;
+      let totalTime = 2
+      let clock = window.setInterval(() => {
+        totalTime--
+        if (totalTime < 0) {
+          totalTime = 2;
+          that.serachBtnStatus = false;
+        }
+      }, 1000)
+
+      this.getTableQuery();
+      this.$message.success('查询完毕');
+    },
+    // 页面数据查询
+    getTableQuery() {
+      let that = this;
+      that.loading = true;
+      // 查询检测设备。上级区域id，区域id必传。regionid传0，查询supregionid对应所有子区域的检测设备。 如果supregionid，regionid都传0，默认查询企业ID下所有检测设备
+      let param = {
+        token: localStorage.token,
+        shopName: this.panel.shopName,//
+        contacts: this.panel.contacts,//
+        phone: this.panel.phone,//
+      };
+      let postdata = qs.stringify(param);
+      ShopListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.loading = false;
+          if (json.Rs) {
+            that.allTableData = json.Rs;
+            that.recordsTotal = json.Rs.length;
+          } else {
+            that.allTableData = [];
+            that.recordsTotal = 0;
+          }
+          // 设置分页数据
+          that.setPaginations();
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 设置分页数据
+    setPaginations() {
+      // 分页属性
+      let that = this;
+      that.pageination.total = that.recordsTotal;
+      // 默认分页
+      that.tableData = that.allTableData.filter((item, index) => {
+        return index < that.pageination.pageItem;
+      });
+    },
+    // 每页显示数量
+    handleSizeChange() {
+      let that = this;
+      that.tableData = that.allTableData.filter((item, index) => {
+        return index < that.pageination.pageItem;
+      });
+      that.draw = that.pageination.pageItem;
+      that.getTableQuery();
+    },
+    // 翻页
+    pageChange(pageIndex) {
+      let that = this;
+      // 获取当前页
+      let index = that.pageination.pageItem * (pageIndex - 1);
+      // 数据总数
+      let nums = that.pageination.pageItem * pageIndex;
+      // 容器
+      let tables = [];
+      for (var i = index; i < nums; i++) {
+        if (that.allTableData[i]) {
+          tables.push(that.allTableData[i])
+        }
+        this.tableData = tables;
+      }
+      that.start = index * that.draw;
+      // that.getTableQuery();
+    },
+    // 自动排序
+    sortChange(params) {
+      console.log(params)
+    },
+    // 过滤时间
+    filterFmtDate(value, row, column) {
+      let that = this;
+      return nonTfmtDate(column, 11);
+    },
+    // 过滤金额
+    filterMoney(value, row, column) {
+      let that = this;
+      return parseFloat(column).toFixed(2);
+    },
+  },
+}
 </script>
 
 <style scoped>
-    @import "../assets/css/panel.css";
+@import "../assets/css/panel.css";
 
-    .context {
-        height: 770px;
-        overflow-y: scroll;
+.context {
+  height: 770px;
+  overflow-y: scroll;
 
-        display: block;
-        margin: 0 auto;
-        background-color: #fff !important;
-        padding: 30px;
-        padding-bottom: 60px;
-    }
+  display: block;
+  margin: 0 auto;
+  background-color: #fff !important;
+  padding: 30px;
+  padding-bottom: 60px;
+}
 
-    .panel-body {
-        padding: 20px;
-        background: #F0F2F5;
-    }
+.panel-body {
+  padding: 20px;
+  background: #F0F2F5;
+}
 
-    .change {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding-top: 10px;
-        padding-bottom: 10px;
-    }
+.change {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
 
-    .change button {
-        float: left;
-    }
+.change button {
+  float: left;
+}
 
-    .change button.pull-right {
-        float: right;
-    }
+.change button.pull-right {
+  float: right;
+}
 
-    .dialogTitle {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        color: #000000;
-        font-size: 18px;
-        text-align: center;
-    }
+.dialogTitle {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  color: #000000;
+  font-size: 18px;
+  text-align: center;
+}
 
-    .dialogTitle em {
-        float: none;
-        font-style: normal;
-        color: #3799FF;
-        margin: 0;
-    }
+.dialogTitle em {
+  float: none;
+  font-style: normal;
+  color: #3799FF;
+  margin: 0;
+}
 
-    /deep/ .el-transfer-panel__item .el-checkbox__input {
-        left: 40px;
-    }
+/deep/ .el-transfer-panel__item .el-checkbox__input {
+  left: 40px;
+}
 
-    .dialogFooter {
-        width: 90%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-top: 10px;
-    }
+.dialogFooter {
+  width: 90%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-top: 10px;
+}
 
-    .dialogFooter button {
-        float: right;
-        margin-left: 10px;
-    }
+.dialogFooter button {
+  float: right;
+  margin-left: 10px;
+}
 </style>

pc/src/views/appoint.vue

@@ -1,1578 +1,1607 @@
 <template>
-    <div class="context">
-        <!--        panel-->
-        <div class="">
-            <div class="panel">
-                <h5>预约管理</h5>
-            </div>
+  <div class="context">
+    <!--        panel-->
+    <div class="">
+      <div class="panel">
+        <h5>预约管理</h5>
+      </div>
 
-            <div class="timeList">
-                <ul>
-                    <li :class="[{'active': i == choiceDate}]" v-for="(day,i) in weeks" @click="choiceTime(i)"><em>{{day.name}}</em><span>{{day.data}}</span>
-                    </li>
-                </ul>
+      <div class="timeList">
+        <ul>
+          <li :class="[{'active': i == choiceDate}]" v-for="(day,i) in weeks" @click="choiceTime(i)">
+            <em>{{ day.name }}</em><span>{{ day.data }}</span>
+          </li>
+        </ul>
+      </div>
+      <el-tabs v-model="activeName" type="card">
+        <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="请输入手机号" type="number" ></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 :disabled="serachBtnStatus">查询</el-button>
+                </el-col>
+                <el-col :span="4">
+                  <el-button class="pull-right" type="warning" @click="addMember">增加预约</el-button>
+                </el-col>
+              </el-row>
             </div>
-            <el-tabs v-model="activeName" type="card">
-                <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="tableData2"
-                                border
-                                is-horizontal-resize
-                                :default-sort="{prop: 'date', order: 'descending'}"
-                                element-loading-background="rgba(0, 0, 0, 0.8)"
-                                class=""
-                                @selection-change="handleSelectionChange" @current-change="clickChange"
-                        >
-                            >
-                            <el-table-column label="选择" width="55">
-                                <template slot-scope="scope">
-                                    <el-radio v-model="tableRadio" :label="scope.row"><i></i></el-radio>
-                                </template>
-                            </el-table-column>
-                            <el-table-column
-                                    type="index"
-                                    label="序号"
-                                    align="center"
-                                    width="50">
-                            </el-table-column>
-                            <el-table-column
-                                    prop="UserName"
-                                    label="会员名"
-                            >
-                            </el-table-column>
-                            <el-table-column
-                                    prop="Phone"
-                                    label="手机号"
-                                    sortable
-                            >
-                            </el-table-column>
-                            <el-table-column
-                                    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="BeginTime"
-                                    label="上课时间"
-                                    :formatter="filterFmtDate"
-                            >
-                            </el-table-column>
-                            <el-table-column
-                                    prop="Base.CreatedAt"
-                                    label="会员预约时间"
-                                    :formatter="filterFmtDate"
-                                    sortable
-                            >
-                            </el-table-column>
-                            <el-table-column
-                                    prop="ConsumeHour"
-                                    label="消耗课时"
-                                    sortable
-                            >
-                            </el-table-column>
-                            <el-table-column
-                                    prop="RemainHour"
-                                    label="剩余课时"
-                                    sortable
-                            >
-                            </el-table-column>
-                            <el-table-column
-                                    prop="Status"
-                                    label="预约状态"
-                                    sortable
-                            >
-                                <template slot-scope="scope">
-                                    <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="Status"
-                                    label="操作"
-                            >
-                                <template slot-scope="scope">
-                                    <el-button type="danger" size="mini" round
-                                               @click="BtnOrderCancelByManager(scope.row)">取消预约
-                                    </el-button>
-                                </template>
-                            </el-table-column>
-                        </el-table>
-                        <br>
-                        <el-pagination
-                                background
-                                :total="pageination.total"
-                                :page-size="pageination.pageItem"
-                                @current-change="pageChange"
-                        ></el-pagination>
-                    </div>
-                </el-tab-pane>
-                <el-tab-pane label="课程预约列表" name="first">
-                    <div class="table">
-                        <el-table
-                                :data="tableData"
-                                border
-                                is-horizontal-resize
-                                :default-sort="{prop: 'date', order: 'descending'}"
-                                element-loading-background="rgba(0, 0, 0, 0.8)"
-                                class=""
-                                @selection-change="handleSelectionChange" @current-change="clickChange"
-                            >
-                            <el-table-column
-                                    type="index"
-                                    label="序号"
-                                    align="center"
+          </div>
+          <br>
+          <div class="table">
+            <el-table
+                :data="tableData2"
+                border
+                is-horizontal-resize
+                :default-sort="{prop: 'date', order: 'descending'}"
+                element-loading-background="rgba(0, 0, 0, 0.8)"
+                class=""
+                @selection-change="handleSelectionChange" @current-change="clickChange"
+            >
+              >
+              <el-table-column label="选择" width="55">
+                <template slot-scope="scope">
+                  <el-radio v-model="tableRadio" :label="scope.row"><i></i></el-radio>
+                </template>
+              </el-table-column>
+              <el-table-column
+                  type="index"
+                  label="序号"
+                  align="center"
+                  width="50">
+              </el-table-column>
+              <el-table-column
+                  prop="UserName"
+                  label="会员名"
+              >
+              </el-table-column>
+              <el-table-column
+                  prop="Phone"
+                  label="手机号"
+                  sortable
+              >
+              </el-table-column>
+              <el-table-column
+                  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="BeginTime"
+                  label="上课时间"
+                  :formatter="filterFmtDate"
+              >
+              </el-table-column>
+              <el-table-column
+                  prop="Base.CreatedAt"
+                  label="会员预约时间"
+                  :formatter="filterFmtDate"
+                  sortable
+              >
+              </el-table-column>
+              <el-table-column
+                  prop="ConsumeHour"
+                  label="消耗课时"
+                  sortable
+              >
+              </el-table-column>
+              <el-table-column
+                  prop="RemainHour"
+                  label="剩余课时"
+                  sortable
+              >
+              </el-table-column>
+              <el-table-column
+                  prop="Status"
+                  label="预约状态"
+                  sortable
+              >
+                <template slot-scope="scope">
+                  <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="Status"
+                  label="操作"
+              >
+                <template slot-scope="scope">
+                  <el-button type="danger" size="mini" round
+                             @click="BtnOrderCancelByManager(scope.row)">取消预约
+                  </el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+            <br>
+            <el-pagination
+                background
+                :total="pageination.total"
+                :page-size="pageination.pageItem"
+                @current-change="pageChange"
+            ></el-pagination>
+          </div>
+        </el-tab-pane>
+        <el-tab-pane label="课程预约列表" name="first">
+          <div class="table">
+            <el-table
+                :data="tableData"
+                border
+                is-horizontal-resize
+                :default-sort="{prop: 'date', order: 'descending'}"
+                element-loading-background="rgba(0, 0, 0, 0.8)"
+                class=""
+                @selection-change="handleSelectionChange" @current-change="clickChange"
+            >
+              <el-table-column
+                  type="index"
+                  label="序号"
+                  align="center"
 
-                                    width="50">
-                            </el-table-column>
-                            <el-table-column
-                                    prop="BeginTime"
-                                    label="上课时间"
-                                    :formatter="filterFmtDate"
-                            >
-                            </el-table-column>
-                            <el-table-column
-                                    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="Recovered"
-                                    label="预约进度"
-                                    width="220px"
-                                    sortable
-                            >
-                                <template slot-scope="scope">
-                                    <el-progress
-                                            :percentage="parseInt((scope.row.OrderCount/scope.row.OrderToplimit * 100))"
-                                            :format="format"
-                                    ></el-progress>
-                                </template>
-                            </el-table-column>
-                            <el-table-column
-                                    prop="OrderToplimit"
-                                    label="预约名额"
-                            >
-                            </el-table-column>
-                            <el-table-column
-                                    prop="OrderCount"
-                                    label="预约人数"
-                            >
-                            </el-table-column>
-                            <el-table-column
-                                    prop="ConsumeHour"
-                                    label="消耗课时"
-                                    sortable
-                            >
-                            </el-table-column>
-                            <el-table-column
-                                    prop="WxOrder"
-                                    label="微信可预约"
-                            >
-                                <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>
-                                </template>
-                            </el-table-column>
-                            <el-table-column
-                                    prop="StdId"
-                                    label="操作"
-                            >
-                                <template slot-scope="scope">
-                                    <el-button type="text" @click="seeDetail(scope.row)">详情</el-button>
-                                </template>
-                            </el-table-column>
-                        </el-table>
-                        <br>
-                        <el-pagination
-                                background
-                                :total="pageination.total"
-                                :page-size="pageination.pageItem"
-                                @current-change="pageChange"
-                        ></el-pagination>
-                    </div>
-                </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="当前日期" :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"
-                                        :label="item.label"
-                                        :value="item.value">
-                                </el-option>
-                            </el-select>
-                        </el-form-item>
-                        <!--     课程联动查询userlist by classid-->
-                        <el-form-item label="会员" :required="true">
-                            <el-select v-model="form.userId" filterable placeholder="请选择"
-                                       @change="reMainSelect(form.userId)" >
-                                <el-option
-                                        v-for="item in form.userList"
-                                        :key="item.value"
-                                        :label="item.label"
-                                        :value="item.value">
-                                </el-option>
-                            </el-select>
-                        </el-form-item>
-                        <el-form-item label="会员剩余课时">
-                            <el-input v-model="form.remain" placeholder="placeholder" :disabled="true"
-                                      style="width: 220px"></el-input>
-                        </el-form-item>
-                    </el-form>
-                </div>
-            </div>
-            <div class="dialogFooter">
-                <el-button type="primary" size="small" @click="ConfirmOrderAddByManager">确定</el-button>
-                <el-button size="small" @click="dialogMemberVisible = false">取消</el-button>
-            </div>
-        </el-dialog>
-        <el-dialog title="课程会员" :visible.sync="dialogTableVisible" width="650px">
-            <el-table :data="gridData">
-                <el-table-column property="UserName" label="姓名" width="200"></el-table-column>
-                <el-table-column property="Phone" label="手机"></el-table-column>
+                  width="50">
+              </el-table-column>
+              <el-table-column
+                  prop="BeginTime"
+                  label="上课时间"
+                  :formatter="filterFmtDate"
+              >
+              </el-table-column>
+              <el-table-column
+                  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="Recovered"
+                  label="预约比例"
+                  width="220px"
+                  sortable
+              >
+                <template slot-scope="scope">
+                  <el-progress
+                      :percentage="parseInt((scope.row.OrderCount/scope.row.OrderToplimit * 100))"
+                      :format="format"
+                  ></el-progress>
+                </template>
+              </el-table-column>
+              <el-table-column
+                  prop="OrderToplimit"
+                  label="预约名额"
+              >
+              </el-table-column>
+              <el-table-column
+                  prop="OrderCount"
+                  label="预约人数"
+              >
+              </el-table-column>
+              <el-table-column
+                  prop="ConsumeHour"
+                  label="消耗课时"
+                  sortable
+              >
+              </el-table-column>
+              <el-table-column
+                  prop="WxOrder"
+                  label="微信可预约"
+              >
+                <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>
+                </template>
+              </el-table-column>
+              <el-table-column
+                  prop="StdId"
+                  label="操作"
+              >
+                <template slot-scope="scope">
+                  <el-button type="text" @click="seeDetail(scope.row)">详情</el-button>
+                </template>
+              </el-table-column>
             </el-table>
-        </el-dialog>
+            <br>
+            <el-pagination
+                background
+                :total="pageination.total"
+                :page-size="pageination.pageItem"
+                @current-change="pageChange"
+            ></el-pagination>
+          </div>
+        </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="当前日期" :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"
+                    :label="item.label"
+                    :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+            <!--     课程联动查询userlist by classid-->
+            <el-form-item label="会员" :required="true">
+              <el-select v-model="form.userId" filterable placeholder="请选择"
+                         @change="reMainSelect(form.userId)">
+                <el-option
+                    v-for="item in form.userList"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="会员剩余课时">
+              <el-input v-model="form.remain" placeholder="placeholder" :disabled="true"
+                        style="width: 220px"></el-input>
+            </el-form-item>
+          </el-form>
+        </div>
+      </div>
+      <div class="dialogFooter">
+        <el-button type="primary" size="small" @click="ConfirmOrderAddByManager">确定</el-button>
+        <el-button size="small" @click="dialogMemberVisible = false">取消</el-button>
+      </div>
+    </el-dialog>
+    <el-dialog title="预约会员" :visible.sync="dialogTableVisible" width="650px">
+      <el-table :data="gridData">
+        <el-table-column property="UserName" label="姓名" width="200"></el-table-column>
+        <el-table-column property="Phone" label="手机"></el-table-column>
+      </el-table>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
-    import Global from '../Global.js'
-    import {
-        TodayClassOrderQuery,
-        VipUserListQuery,
-        TodayVipOrderQuery,
-        ClassOrderQuery,
-        OrderAddByManager,
-        ClassListByOrderDate,
-        VipUserOrderQuery,
-        OrderCancelByManager,
-        STTDetailWxOrderEdit,
-        testTable,
-        testSelect,
-        WaitingBeginClassList,
-        ShopWxStatusEdit,
-        ClassListQuery,
-        VipUserSimpleQuery
-    } from "../api/getApiRes";
+import Global from '../Global.js'
+import {
+  TodayClassOrderQuery,
+  VipUserListQuery,
+  TodayVipOrderQuery,
+  ClassOrderQuery,
+  OrderAddByManager,
+  ClassListByOrderDate,
+  VipUserOrderQuery,
+  OrderCancelByManager,
+  STTDetailWxOrderEdit,
+  testTable,
+  testSelect,
+  WaitingBeginClassList,
+  ShopWxStatusEdit,
+  ClassListQuery,
+  VipUserSimpleQuery
+} from "../api/getApiRes";
 
-    let qs = require('qs');
-    export default {
-        data() {
-            return {
-                activeName: 'second',
-                choiceDate: 0,//默认为今天
-                tableView: true,//其他dialog
-                dialogVisible: false,//其他dialog
-                dialogTableVisible: false,//其他dialog
-                dialogMemberVisible: false,//新增教练dialog
-                dialogLesson: false,//课时调整
-                dialogGift: false,//赠送课时调整
-                dialogExpTime: false,//有效期调整
-                dialogLessonTable: false,//教练课程
-                dialogTitle: '增加预约',
-                current: getNowDate(),
-                dialogValue: [],
-                weeks: [],
-                gridData: [],
-                // panel 配置项目
-                panel: {
-                    name: '',
-                    phone: '',
-                    classId: '0',
-                    usercode: '',
-                    username: '',
-                    compname: '',
-                    keyword: '',
-                    USERCODE: '',
-                    endType: '',
-                    taskstatus: 99,
-                    draw: 1,
-                    start: 0,
-                    recordsTotal: 0,
-                    recordsTotal2: 0,
-                    tableData: [],
-                    allTableData: [],
-                    allTableData2: [],
-                    limit: '10',
-                    multipleSort: false,
-                    loading: false,
-                    fileList: [],
-                    multipleSelection: [],
-                    detectedmac: '',
-                    options: [
-                        {value: 99, label: '全部'},
-                        {value: 1, label: '进行中'},
-                        {value: 2, label: '已完成'},
-                    ],
-                    endTypeOptions: [
-                        {value: 99, label: '全部'},
-                        {value: 30, label: '近一个月'},
-                        {value: 7, label: '近一周'},
-                        {value: 1, label: '当日'},
-                    ],
-                    // time1: globalBt(),
-                },
-                multipleSelection: [],
-                pageination: {
-                    pageItem: 100,
-                    pageoptions: pageOptions(),
-                    total: 100,
-                    pageIndex: 1,
-                },
-                form: {
-                    name: '',
-                    displayDay: '',
-                    userCode: '',
-                    shopId: '',
-                    stdId: 0,
-                    userId: 0,
-                    memberType: 1,
-                    lesson: 1,
-                    gift: 1,
-                    btnType: 0,//0新建，1编辑编辑
-                    memo: '',
-                    expTime: '',
-                    dialogdata: [],//穿梭待选
-                    dialogValue: [],//穿梭已选
-                    userList: [],//穿梭已选
-                    stdList: [],//穿梭已选
-                    remain: 0,
-                },
-                memberTypes: [
-                    {value: 1, label: '年教练'},
-                    {value: 2, label: '充值教练'},
-                ],
-                tableData: [],
-                tableData2: [],
-                tableRadio: [],
-            }
-        },
-        mounted() {
-            if (this.$route.query.page == 'second') {
-                this.panel.name = this.$route.query.name;
-                this.activeName = 'second'
+let qs = require('qs');
+export default {
+  data() {
+    return {
+      serachBtnStatus: false,
+      activeName: 'second',
+      choiceDate: 0,//默认为今天
+      tableView: true,//其他dialog
+      dialogVisible: false,//其他dialog
+      dialogTableVisible: false,//其他dialog
+      dialogMemberVisible: false,//新增教练dialog
+      dialogLesson: false,//课时调整
+      dialogGift: false,//赠送课时调整
+      dialogExpTime: false,//有效期调整
+      dialogLessonTable: false,//教练课程
+      dialogTitle: '增加预约',
+      current: getNowDate(),
+      dialogValue: [],
+      weeks: [],
+      gridData: [],
+      // panel 配置项目
+      panel: {
+        name: '',
+        phone: '',
+        classId: '0',
+        usercode: '',
+        username: '',
+        compname: '',
+        keyword: '',
+        USERCODE: '',
+        endType: '',
+        taskstatus: 99,
+        draw: 1,
+        start: 0,
+        recordsTotal: 0,
+        recordsTotal2: 0,
+        tableData: [],
+        allTableData: [],
+        allTableData2: [],
+        limit: '10',
+        multipleSort: false,
+        loading: false,
+        fileList: [],
+        multipleSelection: [],
+        detectedmac: '',
+        options: [
+          {value: 99, label: '全部'},
+          {value: 1, label: '进行中'},
+          {value: 2, label: '已完成'},
+        ],
+        endTypeOptions: [
+          {value: 99, label: '全部'},
+          {value: 30, label: '近一个月'},
+          {value: 7, label: '近一周'},
+          {value: 1, label: '当日'},
+        ],
+        // time1: globalBt(),
+      },
+      multipleSelection: [],
+      pageination: {
+        pageItem: 100,
+        pageoptions: pageOptions(),
+        total: 100,
+        pageIndex: 1,
+      },
+      form: {
+        name: '',
+        displayDay: '',
+        userCode: '',
+        shopId: '',
+        stdId: 0,
+        userId: 0,
+        memberType: 1,
+        lesson: 1,
+        gift: 1,
+        btnType: 0,//0新建，1编辑编辑
+        memo: '',
+        expTime: '',
+        dialogdata: [],//穿梭待选
+        dialogValue: [],//穿梭已选
+        userList: [],//穿梭已选
+        stdList: [],//穿梭已选
+        remain: 0,
+      },
+      memberTypes: [
+        {value: 1, label: '年教练'},
+        {value: 2, label: '充值教练'},
+      ],
+      tableData: [],
+      tableData2: [],
+      tableRadio: [],
+    }
+  },
+  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: {
+    clickChange(item) {
+      this.tableRadio = item
+    },
+    // .课程表详情微信可预约状态修改
+    changeWechat(e, appoint) {
+      let that = this;
+      let statusText = appoint.WxOrder == 0 ? "关闭" : "开启";
+      this.$confirm('是否' + statusText + '课程预约?', '微信预约操作', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        let param = {
+          token: localStorage.token,
+          stdId: appoint.StdId,
+          wxOrder: e,
+        };
+        let postdata = qs.stringify(param);
+        STTDetailWxOrderEdit(postdata).then(res => {
+          let json = res;
+          if (json.Code == 0) {
+            that.$message({
+              showClose: true,
+              message: '预约已' + statusText + '！',
+              type: 'success'
+            });
+            // table 重载
+            that.getTableQuery();
+          } else {
+            // 状态返回
+            appoint.WxOrder = e == 0 ? 1 : 0;
+            that.$message.error(json.Memo);
+          }
+        })
+      }).catch(() => {
+        this.appoint = "0"
+        this.$message({
+          type: 'info',
+          message: '已取消当前操作'
+        });
+      });
+    },
+    panelSelect() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+      };
+      let postdata = qs.stringify(param);
+      ClassListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          if (json.Rs == null) return false
+          that.panel.classOptions = turnClassResToOption(json.Rs);
+          that.panel.classOptions.unshift({value: '0', label: '全部'})
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    vipSelect(stdId) {
+      let that = this;
+      // 筛选相同的stdid的classId
+      that.form.stdList.map(function (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 {
-                this.activeName = 'second'
+              that.$message.error(json.Memo);
             }
-            this.ClassSelect();
-            this.panelSelect();
-            // this.getCurrWeekDays();
-            this.getFurtherDays();
-
-        },
-        methods: {
-            clickChange(item) {
-                this.tableRadio = item
-            },
-            // .课程表详情微信可预约状态修改
-            changeWechat(e, appoint) {
-                let that = this;
-                let statusText = appoint.WxOrder == 0 ? "关闭" : "开启";
-                this.$confirm('是否' + statusText + '课程预约?', '微信预约操作', {
-                    confirmButtonText: '确定',
-                    cancelButtonText: '取消',
-                    type: 'warning'
-                }).then(() => {
-                    let param = {
-                        token: localStorage.token,
-                        stdId: appoint.StdId,
-                        wxOrder: e,
-                    };
-                    let postdata = qs.stringify(param);
-                    STTDetailWxOrderEdit(postdata).then(res => {
-                        let json = res;
-                        if (json.Code == 0) {
-                            that.$message({
-                                showClose: true,
-                                message: '预约已' + statusText + '！',
-                                type: 'success'
-                            });
-                            // table 重载
-                            that.getTableQuery();
-                        } else {
-                            // 状态返回
-                            appoint.WxOrder = e == 0 ? 1 : 0;
-                            that.$message.error(json.Memo);
-                        }
-                    })
-                }).catch(() => {
-                    this.appoint = "0"
-                    this.$message({
-                        type: 'info',
-                        message: '已取消当前操作'
-                    });
-                });
-            },
-            panelSelect() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                };
-                let postdata = qs.stringify(param);
-                ClassListQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.panel.classOptions = turnClassResToOption(json.Rs);
-                        that.panel.classOptions.unshift({value: '0', label: '全部'})
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            vipSelect(stdId) {
-                let that = this;
-                // 筛选相同的stdid的classId
-                that.form.stdList.map(function (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);
-                            }
-                        })
-                    }
-                })
-            },
-            reMainSelect(userId){
-                 let that = this;
-                this.form.userList.filter((v)=>{
-                        if(v.key == userId){
-                            that.form.remain = v.RemainHour;
-                        }
-                })
-
-            },
-            ClassSelect() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    start: 1,//
-                    tableMax: 9999,//
-                };
-                let postdata = qs.stringify(param);
-                WaitingBeginClassList(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.form.stdList = turnStdToOption(json.Rs);
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
+          })
+        }
+      })
+    },
+    reMainSelect(userId) {
+      let that = this;
+      this.form.userList.filter((v) => {
+        if (v.key == userId) {
+          that.form.remain = v.RemainHour;
+        }
+      })
 
-            },
-            ConfirmOrderAddByManager() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    stdId: this.form.stdId,
-                    userId: this.form.userId,
-                };
-                let postdata = qs.stringify(param);
-                OrderAddByManager(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.$message({
-                            showClose: true,
-                            message: '预约添加成功！',
-                            type: 'success'
-                        });
-                        this.getTableQuery2();
-                        that.dialogMemberVisible = false;
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 选择日期
-            choiceTime(i) {
-                this.choiceDate = parseInt(i);
-                // 读取当前页
-                if (this.activeName == 'first') {
-                    this.getTableQuery();
-                } else {
-                    // second
-                    this.getTableQuery2();
-                }
-            },
-            seeDetail(row) {
-                let that = this;
-                let dayIndex = parseInt(this.choiceDate);
-                let param = {
-                    token: localStorage.token,
-                    classId: row.ClassId,
-                    orderDate: this.weeks[dayIndex].orderDate,
-                    stdId: row.StdId,
-                };
-                let postdata = qs.stringify(param);
-                VipUserOrderQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        this.dialogTableVisible = true;
-                        this.gridData = json.Rs;
-                        console.log(123);
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            format(percentage) {
-                return percentage === 100 ? '已满' : `${percentage}%`;
-            },
-            // 编辑
-            BtnOrderCancelByManager(row) {
-                let that = this;
-                this.$confirm('是否取消用户  ' + row.UserName + '  的预约？', '取消预约', {
-                    confirmButtonText: '确定',
-                    cancelButtonText: '取消',
-                    type: 'warning'
-                }).then(() => {
-                    let param = {
-                        token: localStorage.token,
-                        orderId: row.OrderId,
-                    };
-                    let postdata = qs.stringify(param);
-                    OrderCancelByManager(postdata).then(res => {
-                        let json = res;
-                        if (json.Code == 0) {
-                            that.$message({
-                                showClose: true,
-                                message: row.UserName + '取消预约成功！',
-                                type: 'success'
-                            });
-                            // table 重载
-                            that.getTableQuery2();
-                        } else {
-                            that.$message.error(json.Memo);
-                        }
-                    })
-                }).catch(() => {
-                    this.$message({
-                        type: 'info',
-                        message: '已取消操作'
-                    });
-                });
-            },
-            // 禁用
-            pauseRow(row) {
-                let that = this;
-                this.$confirm('是否禁用用户' + row.name + '？', '禁用操作', {
-                    confirmButtonText: '确定',
-                    cancelButtonText: '取消',
-                    type: 'warning'
-                }).then(() => {
-                    let param = {
-                        token: localStorage.token,
-                        Id: row.Id,
-                        status: 0,
-                    };
-                    let postdata = qs.stringify(param);
-                    testTable(postdata).then(res => {
-                        let json = res;
-                        if (json.Code == 0) {
-                            that.$message({
-                                showClose: true,
-                                message: row.name + '禁用成功！',
-                                type: 'success'
-                            });
-                            // table 重载
-                            that.getTableQuery();
-                        } else {
-                            that.$message.error(json.Memo);
-                        }
-                    })
-                }).catch(() => {
-                    this.$message({
-                        type: 'info',
-                        message: '已取消禁用'
-                    });
-                });
-            },
-            // 启用
-            runRow(row) {
-                let that = this;
-                this.$confirm('是否启用用户' + row.name + '？', '启用操作', {
-                    confirmButtonText: '确定',
-                    cancelButtonText: '取消',
-                    type: 'warning'
-                }).then(() => {
-                    let param = {
-                        token: localStorage.token,
-                        Id: row.Id,
-                        status: 1,
-                    };
-                    let postdata = qs.stringify(param);
-                    testTable(postdata).then(res => {
-                        let json = res;
-                        if (json.Code == 0) {
-                            that.$message({
-                                showClose: true,
-                                message: row.name + '启用成功！',
-                                type: 'success'
-                            });
-                            // table 重载
-                            that.getTableQuery();
-                        } else {
-                            that.$message.error(json.Memo);
-                        }
-                    })
-                }).catch(() => {
-                    this.$message({
-                        type: 'info',
-                        message: '已取消启用'
-                    });
-                });
-            },
-            // 关闭所有
-            allDialogClose() {
-                this.dialogVisible = false;
-                this.dialogGift = false;
-                this.dialogLesson = false;
-                this.dialogExpTime = false;
-                this.dialogLessonTable = false;
-            },
-            // 用户禁用 todo
-            // 用户启用 todo
-            // 有效期调整
-            ExpTimeChange() {
-                // 仅针对年费用户，使用日期格式
-                this.allDialogClose();
-                if (!this.multipleSelection.length) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，需要先选中至少一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                if (this.multipleSelection.length != 1) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，只能选中一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                let row = this.tableRadio;
-                if (parseInt(row.vipType) == 2) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，充值教练不能调整有效期',
-                        type: 'error'
-                    });
-                    return false
-                }
-                this.form.expTime = row.expTime;
-                this.form.rowName = row.name;
-                this.dialogVisible = true;
-                this.dialogExpTime = true;
-            },
-            // 课时调整
-            lessonChange() {
-                this.allDialogClose();
-                if (!this.multipleSelection.length) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，需要先选中至少一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                if (this.multipleSelection.length != 1) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，只能选中一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                let row = this.tableRadio;
-                this.form.lesson = row.Recovered;
-                this.form.rowName = row.name;
-                this.dialogVisible = true;
-                this.dialogLesson = true;
+    },
+    ClassSelect() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        start: 1,//
+        tableMax: 9999,//
+      };
+      let postdata = qs.stringify(param);
+      WaitingBeginClassList(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.form.stdList = turnStdToOption(json.Rs);
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
 
-            },
-            // 赠送调整
-            giftChange() {
-                this.allDialogClose();
-                if (!this.multipleSelection.length) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，需要先选中至少一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                if (this.multipleSelection.length != 1) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，只能选中一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                let row = this.tableRadio;
-                this.form.gift = row.Recovered;
-                this.form.rowName = row.name;
-                this.dialogVisible = true;
-                this.dialogGift = true;
+    },
+    ConfirmOrderAddByManager() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        stdId: this.form.stdId,
+        userId: this.form.userId,
+      };
+      let postdata = qs.stringify(param);
+      OrderAddByManager(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.$message({
+            showClose: true,
+            message: '预约添加成功！',
+            type: 'success'
+          });
+          this.getTableQuery2();
+          that.dialogMemberVisible = false;
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 选择日期
+    choiceTime(i) {
+      this.choiceDate = parseInt(i);
+      // 读取当前页
+      if (this.activeName == 'first') {
+        this.getTableQuery();
+      } else {
+        // second
+        this.getTableQuery2();
+      }
+    },
+    seeDetail(row) {
+      let that = this;
+      let dayIndex = parseInt(this.choiceDate);
+      let param = {
+        token: localStorage.token,
+        classId: row.ClassId,
+        orderDate: this.weeks[dayIndex].orderDate,
+        stdId: row.StdId,
+      };
+      let postdata = qs.stringify(param);
+      VipUserOrderQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          this.dialogTableVisible = true;
+          this.gridData = json.Rs;
+          console.log(123);
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    format(percentage) {
+      return percentage === 100 ? '已满' : `${percentage}%`;
+    },
+    // 编辑
+    BtnOrderCancelByManager(row) {
+      let that = this;
+      this.$confirm('是否取消用户  ' + row.UserName + '  的预约？', '取消预约', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        let param = {
+          token: localStorage.token,
+          orderId: row.OrderId,
+        };
+        let postdata = qs.stringify(param);
+        OrderCancelByManager(postdata).then(res => {
+          let json = res;
+          if (json.Code == 0) {
+            that.$message({
+              showClose: true,
+              message: row.UserName + '取消预约成功！',
+              type: 'success'
+            });
+            // table 重载
+            that.getTableQuery2();
+          } else {
+            that.$message.error(json.Memo);
+          }
+        })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消操作'
+        });
+      });
+    },
+    // 禁用
+    pauseRow(row) {
+      let that = this;
+      this.$confirm('是否禁用用户' + row.name + '？', '禁用操作', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        let param = {
+          token: localStorage.token,
+          Id: row.Id,
+          status: 0,
+        };
+        let postdata = qs.stringify(param);
+        testTable(postdata).then(res => {
+          let json = res;
+          if (json.Code == 0) {
+            that.$message({
+              showClose: true,
+              message: row.name + '禁用成功！',
+              type: 'success'
+            });
+            // table 重载
+            that.getTableQuery();
+          } else {
+            that.$message.error(json.Memo);
+          }
+        })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消禁用'
+        });
+      });
+    },
+    // 启用
+    runRow(row) {
+      let that = this;
+      this.$confirm('是否启用用户' + row.name + '？', '启用操作', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        let param = {
+          token: localStorage.token,
+          Id: row.Id,
+          status: 1,
+        };
+        let postdata = qs.stringify(param);
+        testTable(postdata).then(res => {
+          let json = res;
+          if (json.Code == 0) {
+            that.$message({
+              showClose: true,
+              message: row.name + '启用成功！',
+              type: 'success'
+            });
+            // table 重载
+            that.getTableQuery();
+          } else {
+            that.$message.error(json.Memo);
+          }
+        })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消启用'
+        });
+      });
+    },
+    // 关闭所有
+    allDialogClose() {
+      this.dialogVisible = false;
+      this.dialogGift = false;
+      this.dialogLesson = false;
+      this.dialogExpTime = false;
+      this.dialogLessonTable = false;
+    },
+    // 用户禁用 todo
+    // 用户启用 todo
+    // 有效期调整
+    ExpTimeChange() {
+      // 仅针对年费用户，使用日期格式
+      this.allDialogClose();
+      if (!this.multipleSelection.length) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，需要先选中至少一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      if (this.multipleSelection.length != 1) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，只能选中一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      let row = this.tableRadio;
+      if (parseInt(row.vipType) == 2) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，充值教练不能调整有效期',
+          type: 'error'
+        });
+        return false
+      }
+      this.form.expTime = row.expTime;
+      this.form.rowName = row.name;
+      this.dialogVisible = true;
+      this.dialogExpTime = true;
+    },
+    // 课时调整
+    lessonChange() {
+      this.allDialogClose();
+      if (!this.multipleSelection.length) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，需要先选中至少一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      if (this.multipleSelection.length != 1) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，只能选中一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      let row = this.tableRadio;
+      this.form.lesson = row.Recovered;
+      this.form.rowName = row.name;
+      this.dialogVisible = true;
+      this.dialogLesson = true;
 
-            },
-            // 增删教练课程
-            lessonStudenChange() {
-                this.allDialogClose();
-                if (!this.multipleSelection.length) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，需要先选中至少一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                if (this.multipleSelection.length != 1) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，只能选中一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                let row = this.tableRadio;
-                this.form.gift = row.Recovered;
-                this.form.rowName = row.name;
-                this.dialogVisible = true;
-                this.dialogLessonTable = true;
-            },
-            // 确认提交新增教练
-            confirmMember() {
-                let that = this;
-                // checkNum
-                if (!that.form.userCode) {
-                    this.$message.error('错了哦，手机号不能为空');
-                    return false
-                }
-                if (!globalCheckPhone(that.form.userCode)) {
-                    this.$message.error('错了哦，手机号格式不正确');
-                    return false
-                }
-                if (!that.form.name) {
-                    this.$message.error('错了哦，教练名不能为空');
-                    return false
-                }
-                if (that.form.name.length > 8) {
-                    this.$message.error('错了哦，教练名字数超过8个字');
-                    return false
-                }
-                if (that.form.memo) {
-                    if (that.form.memo.length > 200) {
-                        this.$message.error('错了哦，备注字数超过200个字');
-                        return false
-                    }
-                }
+    },
+    // 赠送调整
+    giftChange() {
+      this.allDialogClose();
+      if (!this.multipleSelection.length) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，需要先选中至少一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      if (this.multipleSelection.length != 1) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，只能选中一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      let row = this.tableRadio;
+      this.form.gift = row.Recovered;
+      this.form.rowName = row.name;
+      this.dialogVisible = true;
+      this.dialogGift = true;
 
-                let param = {
-                    token: localStorage.token,
-                    userCode: that.form.userCode,
-                    name: that.form.name,
-                    memberType: that.form.memberType,
-                    lesson: that.form.lesson,
-                    gift: that.form.gift,
-                    memo: that.form.memo,
-                    dialogValue: that.form.dialogValue,
-                };
-                let postdata = qs.stringify(param);
-                testSelect(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogMemberVisible = false;
-                        // 重载列表
-                        that.getTableQuery();
-                        that.$message({
-                            showClose: true,
-                            message: '教练添加成功！',
-                            type: 'success'
-                        });
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            confirmEditMember() {
-                console.log(123);
-                let that = this;
-                // checkNum
-                if (!that.form.userCode) {
-                    this.$message.error('错了哦，手机号不能为空');
-                    return false
-                }
-                console.log(that.form.userCode);
-                if (!globalCheckPhone(that.form.userCode)) {
-                    this.$message.error('错了哦，手机号格式不正确');
-                    return false
-                }
-                if (!that.form.name) {
-                    this.$message.error('错了哦，教练名不能为空');
-                    return false
-                }
-                if (that.form.name.length > 8) {
-                    this.$message.error('错了哦，教练名字数超过8个字');
-                    return false
-                }
-                if (that.form.memo) {
-                    if (that.form.memo.length > 200) {
-                        this.$message.error('错了哦，备注字数超过200个字');
-                        return false
-                    }
-                }
-                let param = {
-                    token: localStorage.token,
-                    userCode: that.form.userCode,
-                    name: that.form.name,
-                    memberType: that.form.memberType,
-                    lesson: that.form.lesson,
-                    gift: that.form.gift,
-                    memo: that.form.memo,
-                    dialogValue: that.form.dialogValue,
-                };
-                let postdata = qs.stringify(param);
-                testSelect(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogMemberVisible = false;
-                        // 重载列表
-                        that.getTableQuery();
-                        that.$message({
-                            showClose: true,
-                            message: '教练信息编辑成功！',
-                            type: 'success'
-                        });
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 确认提交课时
-            confirmLesson() {
-                let that = this;
-                // checkNum
+    },
+    // 增删教练课程
+    lessonStudenChange() {
+      this.allDialogClose();
+      if (!this.multipleSelection.length) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，需要先选中至少一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      if (this.multipleSelection.length != 1) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，只能选中一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      let row = this.tableRadio;
+      this.form.gift = row.Recovered;
+      this.form.rowName = row.name;
+      this.dialogVisible = true;
+      this.dialogLessonTable = true;
+    },
+    // 确认提交新增教练
+    confirmMember() {
+      let that = this;
+      // checkNum
+      if (!that.form.userCode) {
+        this.$message.error('错了哦，手机号不能为空');
+        return false
+      }
+      if (!globalCheckPhone(that.form.userCode)) {
+        this.$message.error('错了哦，手机号格式不正确');
+        return false
+      }
+      if (!that.form.name) {
+        this.$message.error('错了哦，教练名不能为空');
+        return false
+      }
+      if (that.form.name.length > 8) {
+        this.$message.error('错了哦，教练名字数超过8个字');
+        return false
+      }
+      if (that.form.memo) {
+        if (that.form.memo.length > 200) {
+          this.$message.error('错了哦，备注字数超过200个字');
+          return false
+        }
+      }
 
-                let param = {
-                    token: localStorage.token,
-                    userCode: that.form.userCode,
-                    lesson: that.form.lesson,
-                };
-                let postdata = qs.stringify(param);
-                testSelect(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogVisible = false;
-                        // 重载列表
-                        that.getTableQuery();
-                        that.$message({
-                            showClose: true,
-                            message: '课时调整成功！',
-                            type: 'success'
-                        });
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 确认提交赠送
-            confirmGift() {
-                let that = this;
-                // checkNum
+      let param = {
+        token: localStorage.token,
+        userCode: that.form.userCode,
+        name: that.form.name,
+        memberType: that.form.memberType,
+        lesson: that.form.lesson,
+        gift: that.form.gift,
+        memo: that.form.memo,
+        dialogValue: that.form.dialogValue,
+      };
+      let postdata = qs.stringify(param);
+      testSelect(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogMemberVisible = false;
+          // 重载列表
+          that.getTableQuery();
+          that.$message({
+            showClose: true,
+            message: '教练添加成功！',
+            type: 'success'
+          });
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    confirmEditMember() {
+      console.log(123);
+      let that = this;
+      // checkNum
+      if (!that.form.userCode) {
+        this.$message.error('错了哦，手机号不能为空');
+        return false
+      }
+      console.log(that.form.userCode);
+      if (!globalCheckPhone(that.form.userCode)) {
+        this.$message.error('错了哦，手机号格式不正确');
+        return false
+      }
+      if (!that.form.name) {
+        this.$message.error('错了哦，教练名不能为空');
+        return false
+      }
+      if (that.form.name.length > 8) {
+        this.$message.error('错了哦，教练名字数超过8个字');
+        return false
+      }
+      if (that.form.memo) {
+        if (that.form.memo.length > 200) {
+          this.$message.error('错了哦，备注字数超过200个字');
+          return false
+        }
+      }
+      let param = {
+        token: localStorage.token,
+        userCode: that.form.userCode,
+        name: that.form.name,
+        memberType: that.form.memberType,
+        lesson: that.form.lesson,
+        gift: that.form.gift,
+        memo: that.form.memo,
+        dialogValue: that.form.dialogValue,
+      };
+      let postdata = qs.stringify(param);
+      testSelect(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogMemberVisible = false;
+          // 重载列表
+          that.getTableQuery();
+          that.$message({
+            showClose: true,
+            message: '教练信息编辑成功！',
+            type: 'success'
+          });
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 确认提交课时
+    confirmLesson() {
+      let that = this;
+      // checkNum
 
-                let param = {
-                    token: localStorage.token,
-                    userCode: that.form.userCode,
-                    gift: that.form.gift,
-                };
-                let postdata = qs.stringify(param);
-                testSelect(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogVisible = false;
-                        // 重载列表
-                        that.getTableQuery();
-                        that.$message({
-                            showClose: true,
-                            message: '赠送课时调整成功！',
-                            type: 'success'
-                        });
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 确认提交有效期
-            confirmExpTime() {
-                let that = this;
-                // checkNum
+      let param = {
+        token: localStorage.token,
+        userCode: that.form.userCode,
+        lesson: that.form.lesson,
+      };
+      let postdata = qs.stringify(param);
+      testSelect(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogVisible = false;
+          // 重载列表
+          that.getTableQuery();
+          that.$message({
+            showClose: true,
+            message: '课时调整成功！',
+            type: 'success'
+          });
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 确认提交赠送
+    confirmGift() {
+      let that = this;
+      // checkNum
 
-                let param = {
-                    token: localStorage.token,
-                    userCode: that.form.userCode,
-                    expTime: that.form.expTime,
-                };
-                let postdata = qs.stringify(param);
-                testSelect(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogVisible = false;
-                        // 重载列表
-                        that.getTableQuery();
-                        that.$message({
-                            showClose: true,
-                            message: '赠送课时调整成功！',
-                            type: 'success'
-                        });
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 确认提交教练课程
-            confirmLessonTable() {
-                let that = this;
-                // checkNum
+      let param = {
+        token: localStorage.token,
+        userCode: that.form.userCode,
+        gift: that.form.gift,
+      };
+      let postdata = qs.stringify(param);
+      testSelect(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogVisible = false;
+          // 重载列表
+          that.getTableQuery();
+          that.$message({
+            showClose: true,
+            message: '赠送课时调整成功！',
+            type: 'success'
+          });
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 确认提交有效期
+    confirmExpTime() {
+      let that = this;
+      // checkNum
 
-                let param = {
-                    token: localStorage.token,
-                    userCode: that.form.userCode,
-                    dialogValue: that.form.dialogValue,
-                };
-                let postdata = qs.stringify(param);
-                testSelect(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogVisible = false;
-                        // 重载列表
-                        that.getTableQuery();
-                        that.$message({
-                            showClose: true,
-                            message: '教练课程调整成功！',
-                            type: 'success'
-                        });
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 新增预约
-            addMember() {
-                this.clearForm();
-                // 加载当前可选课程
-                this.getClassListByOrderDate();
-                this.dialogMemberVisible = true;
-                this.form.displayDay = this.weeks[this.choiceDate].data + ' ' + this.weeks[this.choiceDate].name;
-                this.btnType = 0;
-                this.dialogTitle = '新增预约';
-            },
-            // 加载当前可选课程
-            getClassListByOrderDate() {
-                let that = this;
-                let dayIndex = parseInt(this.choiceDate);
-                let param = {
-                    token: localStorage.token,
-                    orderDate: this.weeks[dayIndex].orderDate,
-                };
-                let postdata = qs.stringify(param);
-                ClassListByOrderDate(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.form.stdList = turnStdToOption(json.Rs);
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 删除
-            delList() {
-                let that = this;
-                // checkNum
-                if (!this.multipleSelection.length) {
-                    that.$message({
-                        showClose: true,
-                        message: '错了哦，需要先选中至少一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                if (this.multipleSelection.length != 1) {
-                    that.$message({
-                        showClose: true,
-                        message: '错了哦，只能选中一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
+      let param = {
+        token: localStorage.token,
+        userCode: that.form.userCode,
+        expTime: that.form.expTime,
+      };
+      let postdata = qs.stringify(param);
+      testSelect(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogVisible = false;
+          // 重载列表
+          that.getTableQuery();
+          that.$message({
+            showClose: true,
+            message: '赠送课时调整成功！',
+            type: 'success'
+          });
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 确认提交教练课程
+    confirmLessonTable() {
+      let that = this;
+      // checkNum
 
-                let detectorid = that.tableRadio.Id;
+      let param = {
+        token: localStorage.token,
+        userCode: that.form.userCode,
+        dialogValue: that.form.dialogValue,
+      };
+      let postdata = qs.stringify(param);
+      testSelect(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogVisible = false;
+          // 重载列表
+          that.getTableQuery();
+          that.$message({
+            showClose: true,
+            message: '教练课程调整成功！',
+            type: 'success'
+          });
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 新增预约
+    addMember() {
+      this.clearForm();
+      // 加载当前可选课程
+      this.getClassListByOrderDate();
+      this.dialogMemberVisible = true;
+      this.form.displayDay = this.weeks[this.choiceDate].data + ' ' + this.weeks[this.choiceDate].name;
+      this.btnType = 0;
+      this.dialogTitle = '新增预约';
+    },
+    // 加载当前可选课程
+    getClassListByOrderDate() {
+      let that = this;
+      let dayIndex = parseInt(this.choiceDate);
+      let param = {
+        token: localStorage.token,
+        orderDate: this.weeks[dayIndex].orderDate,
+      };
+      let postdata = qs.stringify(param);
+      ClassListByOrderDate(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.form.stdList = turnStdToOption(json.Rs);
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 删除
+    delList() {
+      let that = this;
+      // checkNum
+      if (!this.multipleSelection.length) {
+        that.$message({
+          showClose: true,
+          message: '错了哦，需要先选中至少一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      if (this.multipleSelection.length != 1) {
+        that.$message({
+          showClose: true,
+          message: '错了哦，只能选中一条记录',
+          type: 'error'
+        });
+        return false
+      }
 
-                let param = {
-                    token: localStorage.token,
-                    detectorid: detectorid,
-                    status: 9,//0禁用1启用9删除
-                };
-                let postdata = qs.stringify(param);
+      let detectorid = that.tableRadio.Id;
 
-                this.$confirm('此操作将永久删除该教练, 是否继续?', '提示', {
-                    confirmButtonText: '确定',
-                    cancelButtonText: '取消',
-                    type: 'warning'
-                }).then(() => {
-                    testSelect(postdata).then(res => {
-                        let json = res;
-                        if (json.Code == 0) {
-                            that.$message({
-                                showClose: true,
-                                message: '选中的教练已删除！',
-                                type: 'success'
-                            });
-                            // 重载列表
-                            that.getTableQuery();
-                        } else {
-                            that.$message.error(json.Memo);
-                        }
-                    });
-                }).catch(() => {
-                    this.$message({
-                        type: 'info',
-                        message: '已取消删除'
-                    });
-                });
-            },
-            handleSelectionChange(val) {
-                this.multipleSelection = val;
-            },
-            // 查询按钮
-            query() {
-                this.getTableQuery2();
-                this.$message.success('查询完毕');
-            },
-            clearForm() {
-                // clear
-                this.form.stdId = '';
-                this.form.userId = '';
-                this.form.name = '';
-                this.form.userCode = '';
-                this.form.shopId = '';
-                this.form.userList = [];
-            },
-            // 页面数据查询
-            getTableQuery() {
-                let that = this;
-                that.loading = true;
-                let dayIndex = parseInt(this.choiceDate);
-                let param = {
-                    token: localStorage.token,
-                    orderDate: this.weeks[dayIndex].orderDate,
-                };
-                let postdata = qs.stringify(param);
-                ClassOrderQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.loading = false;
-                        if (json.Rs) {
-                            that.allTableData = [];
-                            that.allTableData = json.Rs;
-                            that.recordsTotal = json.Rs.length;
-                        } else {
-                            that.allTableData = [];
-                            that.recordsTotal = 0;
-                        }
+      let param = {
+        token: localStorage.token,
+        detectorid: detectorid,
+        status: 9,//0禁用1启用9删除
+      };
+      let postdata = qs.stringify(param);
 
-                        // 设置分页数据
-                        that.setPaginations();
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            getTableQuery2() {
-                let that = this;
-                that.loading = true;
-                let dayIndex = parseInt(this.choiceDate);
-                let param = {
-                    token: localStorage.token,
-                    classId: this.panel.classId,//
-                    stdId: 0,//
-                    name: this.panel.name,//
-                    phone: this.panel.phone,//
-                    orderDate: this.weeks[dayIndex].orderDate,
-                };
-                let postdata = qs.stringify(param);
-                VipUserOrderQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.loading = false;
-                        if (json.Rs) {
-                            that.allTableData2 = json.Rs;
-                            that.recordsTotal2 = json.Rs.length;
-                        } else {
-                            that.allTableData2 = [];
-                            that.recordsTotal2 = 0;
-                        }
+      this.$confirm('此操作将永久删除该教练, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        testSelect(postdata).then(res => {
+          let json = res;
+          if (json.Code == 0) {
+            that.$message({
+              showClose: true,
+              message: '选中的教练已删除！',
+              type: 'success'
+            });
+            // 重载列表
+            that.getTableQuery();
+          } else {
+            that.$message.error(json.Memo);
+          }
+        });
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除'
+        });
+      });
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    // 查询按钮
+    query() {
+      let that = this;
+      that.serachBtnStatus = true;
+      let totalTime = 2
+      let clock = window.setInterval(() => {
+        totalTime--
+        if (totalTime < 0) {
+          totalTime = 2;
+          that.serachBtnStatus = false;
+        }
+      }, 1000)
+      this.getTableQuery2();
+      this.$message.success('查询完毕');
+    },
+    clearForm() {
+      // clear
+      this.form.stdId = '';
+      this.form.userId = '';
+      this.form.name = '';
+      this.form.userCode = '';
+      this.form.shopId = '';
+      this.form.userList = [];
+    },
+    // 页面数据查询
+    getTableQuery() {
+      let that = this;
+      that.loading = true;
+      let dayIndex = parseInt(this.choiceDate);
+      let param = {
+        token: localStorage.token,
+        orderDate: this.weeks[dayIndex].orderDate,
+      };
+      let postdata = qs.stringify(param);
+      ClassOrderQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.loading = false;
+          if (json.Rs) {
+            that.allTableData = [];
+            that.allTableData = json.Rs;
+            that.recordsTotal = json.Rs.length;
+          } else {
+            that.allTableData = [];
+            that.recordsTotal = 0;
+          }
 
-                        // 设置分页数据
-                        that.setPaginations2();
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 设置分页数据
-            setPaginations() {
-                // 分页属性
-                let that = this;
-                that.pageination.total = that.recordsTotal;
+          // 设置分页数据
+          that.setPaginations();
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    getTableQuery2() {
+      let that = this;
+      that.loading = true;
+      let dayIndex = parseInt(this.choiceDate);
+      let param = {
+        token: localStorage.token,
+        classId: this.panel.classId,//
+        stdId: 0,//
+        name: this.panel.name,//
+        phone: this.panel.phone,//
+        orderDate: this.weeks[dayIndex].orderDate,
+      };
+      let postdata = qs.stringify(param);
+      VipUserOrderQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.loading = false;
+          if (json.Rs) {
+            that.allTableData2 = json.Rs;
+            that.recordsTotal2 = json.Rs.length;
+          } else {
+            that.allTableData2 = [];
+            that.recordsTotal2 = 0;
+          }
 
-                // 默认分页
-                that.tableData = that.allTableData.filter((item, index) => {
-                    return index < that.pageination.pageItem;
-                });
-            },
-            // 设置分页数据
-            setPaginations2() {
-                // 分页属性
-                let that = this;
-                that.pageination.total = that.recordsTotal2;
+          // 设置分页数据
+          that.setPaginations2();
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 设置分页数据
+    setPaginations() {
+      // 分页属性
+      let that = this;
+      that.pageination.total = that.recordsTotal;
 
-                // 默认分页
-                that.tableData2 = that.allTableData2.filter((item, index) => {
-                    return index < that.pageination.pageItem;
-                });
-            },
-            // 每页显示数量
-            handleSizeChange() {
-                let that = this;
-                that.tableData = that.allTableData.filter((item, index) => {
-                    return index < that.pageination.pageItem;
-                });
-                that.draw = that.pageination.pageItem;
-                that.getTableQuery();
-            },
-            // 翻页
-            pageChange(pageIndex) {
-                let that = this;
-                // 获取当前页
-                let index = that.pageination.pageItem * (pageIndex - 1);
-                // 数据总数
-                let nums = that.pageination.pageItem * pageIndex;
-                // 容器
-                let tables = [];
-                for (var i = index; i < nums; i++) {
-                    if (that.allTableData[i]) {
-                        tables.push(that.allTableData[i])
-                    }
-                    this.tableData = tables;
-                }
-                that.start = index * that.draw;
-                that.getTableQuery();
-            },
-            // 自动排序
-            sortChange(params) {
-                console.log(params)
-            },
-            // 过滤时间
-            filterFmtDate(value, row, column) {
-                let that = this;
-                return nonTfmtDate(column, 11);
-            },
-            // 过滤金额
-            filterMoney(value, row, column) {
-                let that = this;
-                return parseFloat(column).toFixed(2);
-            },
-            // 本周
-            getCurrWeekDays() {
-                let now = new Date();
-                let nowTime = now.getTime();
-                let day = now.getDay();
-                let oneDayTime = 24 * 60 * 60 * 1000;
-                let days = '';
-                let item = [];
-                let month = 0;
-                for (let i = 0; i < 7; i++) {
-                    days = new Date(nowTime + (i - day) * oneDayTime);//显示周日
-                    month = days.getMonth() + 1;
-                    item = {
-                        name: this.numberToWeek(days.getDay()),
-                        data: month + '月' + days.getDate() + '日',
-                        orderDate: new Date().getFullYear() + '-' + month + '-' + days.getDate()
+      // 默认分页
+      that.tableData = that.allTableData.filter((item, index) => {
+        return index < that.pageination.pageItem;
+      });
+    },
+    // 设置分页数据
+    setPaginations2() {
+      // 分页属性
+      let that = this;
+      that.pageination.total = that.recordsTotal2;
 
-                    }
-                    this.weeks.push(item)
-                }
-            },
-            // 获取未来7天的
-            getFurtherDays() {
-                let now = new Date();
-                let nowTime = now.getTime();
-                let oneDayTime = 24 * 60 * 60 * 1000;
-                let days = '';
-                let item = [];
-                let month = 0;
-                let day = 0;
-                for (let i = 0; i < 7; i++) {
-                    days = new Date(nowTime + (i) * oneDayTime);//显示周日
-                    month = days.getMonth() + 1;
-                    day = days.getDate();
-                    month = month < 10 ? '0' + month : month;
-                    day = day < 10 ? '0' + day : day;
-                    item = {
-                        name: this.numberToWeek(days.getDay()),
-                        data: days.getMonth() + 1 + '月' + days.getDate() + '日',
-                        orderDate: new Date().getFullYear() + '-' + month + '-' + day
-                    }
-                    this.weeks.push(item)
-                }
-                this.getTableQuery();
-                this.getTableQuery2();
-            },
-            numberToWeek(val) {
-                switch (parseInt(val)) {
-                    case 1:
-                        return '星期一';
-                        break;
-                    case 2:
-                        return '星期二';
-                        break;
-                    case 3:
-                        return '星期三';
-                        break;
-                    case 4:
-                        return '星期四';
-                        break;
-                    case 5:
-                        return '星期五';
-                        break;
-                    case 6:
-                        return '星期六';
-                        break;
-                    case 0:
-                        return '星期天';
-                        break;
-                }
-            }
-        },
-        watch: {
-            $route(to) {
-                if (to.name == 'appoint') {
-                    if (this.$route.query.page == 'second') {
-                        this.activeName = 'second';
-                        this.panel.name = this.$route.query.name;
-                        // second
-                        this.getTableQuery2();
-                    }
-                }
+      // 默认分页
+      that.tableData2 = that.allTableData2.filter((item, index) => {
+        return index < that.pageination.pageItem;
+      });
+    },
+    // 每页显示数量
+    handleSizeChange() {
+      let that = this;
+      that.tableData = that.allTableData.filter((item, index) => {
+        return index < that.pageination.pageItem;
+      });
+      that.draw = that.pageination.pageItem;
+      that.getTableQuery();
+    },
+    // 翻页
+    pageChange(pageIndex) {
+      let that = this;
+      // 获取当前页
+      let index = that.pageination.pageItem * (pageIndex - 1);
+      // 数据总数
+      let nums = that.pageination.pageItem * pageIndex;
+      // 容器
+      let tables = [];
+      for (var i = index; i < nums; i++) {
+        if (that.allTableData[i]) {
+          tables.push(that.allTableData[i])
+        }
+        this.tableData = tables;
+      }
+      that.start = index * that.draw;
+      // that.getTableQuery();
+    },
+    // 自动排序
+    sortChange(params) {
+      console.log(params)
+    },
+    // 过滤时间
+    filterFmtDate(value, row, column) {
+      let that = this;
+      return nonTfmtDate(column, 11);
+    },
+    // 过滤金额
+    filterMoney(value, row, column) {
+      let that = this;
+      return parseFloat(column).toFixed(2);
+    },
+    // 本周
+    getCurrWeekDays() {
+      let now = new Date();
+      let nowTime = now.getTime();
+      let day = now.getDay();
+      let oneDayTime = 24 * 60 * 60 * 1000;
+      let days = '';
+      let item = [];
+      let month = 0;
+      for (let i = 0; i < 7; i++) {
+        days = new Date(nowTime + (i - day) * oneDayTime);//显示周日
+        month = days.getMonth() + 1;
+        item = {
+          name: this.numberToWeek(days.getDay()),
+          data: month + '月' + days.getDate() + '日',
+          orderDate: new Date().getFullYear() + '-' + month + '-' + days.getDate()
 
-            },
-            activeName(val) {
-                // 重置一次选择
-                this.tableRadio = [];
-                if (val == 'first') {
-                    this.getTableQuery();
-                } else {
-                    // second
-                    this.getTableQuery2();
-                }
-            },
         }
+        this.weeks.push(item)
+      }
+    },
+    // 获取未来7天的
+    getFurtherDays() {
+      let now = new Date();
+      let nowTime = now.getTime();
+      let oneDayTime = 24 * 60 * 60 * 1000;
+      let days = '';
+      let item = [];
+      let month = 0;
+      let day = 0;
+      for (let i = 0; i < 7; i++) {
+        days = new Date(nowTime + (i) * oneDayTime);//显示周日
+        month = days.getMonth() + 1;
+        day = days.getDate();
+        month = month < 10 ? '0' + month : month;
+        day = day < 10 ? '0' + day : day;
+        item = {
+          name: this.numberToWeek(days.getDay()),
+          data: days.getMonth() + 1 + '月' + days.getDate() + '日',
+          orderDate: new Date().getFullYear() + '-' + month + '-' + day
+        }
+        this.weeks.push(item)
+      }
+      this.getTableQuery();
+      this.getTableQuery2();
+    },
+    numberToWeek(val) {
+      switch (parseInt(val)) {
+        case 1:
+          return '星期一';
+          break;
+        case 2:
+          return '星期二';
+          break;
+        case 3:
+          return '星期三';
+          break;
+        case 4:
+          return '星期四';
+          break;
+        case 5:
+          return '星期五';
+          break;
+        case 6:
+          return '星期六';
+          break;
+        case 0:
+          return '星期天';
+          break;
+      }
     }
+  },
+  watch: {
+    $route(to) {
+      if (to.name == 'appoint') {
+        if (this.$route.query.page == 'second') {
+          this.activeName = 'second';
+          this.panel.name = this.$route.query.name;
+          // second
+          this.getTableQuery2();
+        }
+      }
+
+    },
+    activeName(val) {
+      // 重置一次选择
+      this.tableRadio = [];
+      if (val == 'first') {
+        this.getTableQuery();
+      } else {
+        // second
+        this.getTableQuery2();
+      }
+    },
+  }
+}
 </script>
 
 <style scoped>
-    @import "../assets/css/panel.css";
+@import "../assets/css/panel.css";
 
-    .context {
-        height: 770px;
+.context {
+  height: 770px;
 
-        overflow-y: scroll;
-        display: block;
-        margin: 0 auto;
-        background-color: #fff !important;
-        padding: 30px;
-    }
+  overflow-y: scroll;
+  display: block;
+  margin: 0 auto;
+  background-color: #fff !important;
+  padding: 30px;
+}
 
-    .panel-body {
-        padding: 20px;
-        background: #F0F2F5;
-    }
+.panel-body {
+  padding: 20px;
+  background: #F0F2F5;
+}
 
-    .change {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding-top: 10px;
-        padding-bottom: 10px;
-    }
+.change {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
 
-    .change button {
-        float: left;
-    }
+.change button {
+  float: left;
+}
 
-    .change button.pull-right {
-        float: right;
-    }
+.change button.pull-right {
+  float: right;
+}
 
-    .dialogTitle {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        color: #000000;
-        font-size: 18px;
-        text-align: center;
-    }
+.dialogTitle {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  color: #000000;
+  font-size: 18px;
+  text-align: center;
+}
 
-    .dialogTitle em {
-        float: none;
-        font-style: normal;
-        color: #3799FF;
-        margin: 0;
-    }
+.dialogTitle em {
+  float: none;
+  font-style: normal;
+  color: #3799FF;
+  margin: 0;
+}
 
-    /deep/ .el-transfer-panel__item .el-checkbox__input {
-        left: 40px;
-    }
+/deep/ .el-transfer-panel__item .el-checkbox__input {
+  left: 40px;
+}
 
-    .dialogFooter {
-        width: 90%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-top: 10px;
-    }
+.dialogFooter {
+  width: 90%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-top: 10px;
+}
 
-    .dialogFooter button {
-        float: right;
-        margin-left: 10px;
-    }
+.dialogFooter button {
+  float: right;
+  margin-left: 10px;
+}
 
-    .dialogContent {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-    }
+.dialogContent {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+}
 
-    .dialogContent .pull-left {
-        width: 30%;
-        float: left;
-    }
+.dialogContent .pull-left {
+  width: 30%;
+  float: left;
+}
 
-    .dialogContent .pull-right {
-        width: 70%;
-        float: right;
-    }
+.dialogContent .pull-right {
+  width: 70%;
+  float: right;
+}
 
-    .current {
-        width: 158px;
-        height: 23px;
-        /*float: left;*/
-        border-radius: 250px;
-        text-align: center;
-        background: #F0F2F5;
-        color: #545454;
-        font-size: 14px;
-        padding: 3px 10px;
-        margin-left: 20px;
-    }
+.current {
+  width: 158px;
+  height: 23px;
+  /*float: left;*/
+  border-radius: 250px;
+  text-align: center;
+  background: #F0F2F5;
+  color: #545454;
+  font-size: 14px;
+  padding: 3px 10px;
+  margin-left: 20px;
+}
 
-    .timeList {
-        width: 800px;
-        overflow: hidden;
-        float: right;
-        position: relative;
-        z-index: 100;
-        cursor: pointer;
-    }
+.timeList {
+  width: 800px;
+  overflow: hidden;
+  float: right;
+  position: relative;
+  z-index: 100;
+  cursor: pointer;
+}
 
-    .timeList ul {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        list-style: none;
-    }
+.timeList ul {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  list-style: none;
+}
 
-    .timeList li {
-        width: 100px;
-        overflow: hidden;
-        list-style: none;
-        float: left;
-        margin-right: 6px;
-        border: 1px solid #ccc;
-        border-bottom: 0;
-        text-align: center;
-        height: 40px;
-        background: #fff;
-        z-index: 222;
-    }
+.timeList li {
+  width: 100px;
+  overflow: hidden;
+  list-style: none;
+  float: left;
+  margin-right: 6px;
+  border: 1px solid #ccc;
+  border-bottom: 0;
+  text-align: center;
+  height: 40px;
+  background: #fff;
+  z-index: 222;
+}
 
-    em {
-        font-style: normal;
-    }
+em {
+  font-style: normal;
+}
 
-    .timeList em {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        font-size: 14px;
-        text-align: center;
-    }
+.timeList em {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  font-size: 14px;
+  text-align: center;
+}
 
-    .timeList span {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        font-size: 12px;
-        text-align: center;
-    }
+.timeList span {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  font-size: 12px;
+  text-align: center;
+}
 
-    .timeList li.active {
-        border: 1px solid #3799FF;
-        border-bottom: 0;
-    }
+.timeList li.active {
+  border: 1px solid #3799FF;
+  border-bottom: 0;
+}
 
-    .timeList li.active em {
-        color: #3799FF;
-    }
+.timeList li.active em {
+  color: #3799FF;
+}
 
-    .timeList li.active span {
-        color: #3799FF;
-    }
+.timeList li.active span {
+  color: #3799FF;
+}
 
-    .panel_control /deep/ .el-input {
-        max-width: 140px;
-        float: left;
-    }
+.panel_control /deep/ .el-input {
+  max-width: 140px;
+  float: left;
+}
 
-    .panel-body em {
-        float: left;
-        line-height: 40px;
-        margin-right: 10px;
-    }
+.panel-body em {
+  float: left;
+  line-height: 40px;
+  margin-right: 10px;
+}
 
-    .gary {
-        border: 1px solid #ccc;
-        border-bottom: 0;
-        color: #ccc;
-    }
+.gary {
+  border: 1px solid #ccc;
+  border-bottom: 0;
+  color: #ccc;
+}
 
-    .pull-right {
-        float: right;
-    }
+.pull-right {
+  float: right;
+}
 
-    .lessons {
-        padding: 1px 7px;
-        border-radius: 250px;
-        float: left;
-        color: #000;
-    }
+.lessons {
+  padding: 1px 7px;
+  border-radius: 250px;
+  float: left;
+  color: #000;
+}
 
-    /deep/ .el-progress__text {
-        position: relative;
-        top: 1px;
-        float: right;
-        line-height: 14px;
-        height: 16px;
-    }
+/deep/ .el-progress__text {
+  position: relative;
+  top: 1px;
+  float: right;
+  line-height: 14px;
+  height: 16px;
+}
 
-    /deep/ .el-progress-bar {
-        width: 190px;
-        float: left;
-        overflow: hidden;
-        margin-top: 5px;
-    }
+/deep/ .el-progress-bar {
+  width: 190px;
+  float: left;
+  overflow: hidden;
+  margin-top: 5px;
+}
 
-    .timeList li.active {
-        color: #fff;
-        background: #409EFF;
-    }
+.timeList li.active {
+  color: #fff;
+  background: #409EFF;
+}
 
-    .timeList li.active span, .timeList li.active em {
-        color: #fff;
-    }
+.timeList li.active span, .timeList li.active em {
+  color: #fff;
+}
+/*ipad only*/
+@media only screen and (max-width: 1366px) {
+  .timeList {
+    width: 510px;
+  }
+  .timeList li {
+    width: 60px;
+    font-size: 12px;
+  }
+  .timeList em {
+    font-size: 12px;
+  }
+  .timeList span {
+    font-size: 12px;
+  }
+}
 </style>

pc/src/views/coach.vue

@@ -11,7 +11,7 @@
                         </el-col>
                         <el-col :span="4">
                             <em>手机号:</em>
-                            <el-input v-model="panel.phone" placeholder="请输入手机号"></el-input>
+                            <el-input v-model="panel.phone" placeholder="请输入手机号" type="number" ></el-input>
                         </el-col>
                         <el-col :span="4">
                             <el-button size="" type="primary" @click="query" plain>查询</el-button>

pc/src/views/cost.vue

@@ -1,1089 +1,1105 @@
 <template>
-    <div class="context">
-        <div class="panel">
-            <h5>消费记录</h5>
-            <div class="panel-body">
-                <div class="panel_control">
-                    <el-row :gutter="20">
-                        <el-col :span="4">
-                            <em>姓名:</em>
-                            <el-input v-model="panel.name" placeholder="请输入姓名"></el-input>
-                        </el-col>
-                        <el-col :span="4">
-                            <em>手机号:</em>
-                            <el-input v-model="panel.phone" placeholder="请输入手机号"></el-input>
-                        </el-col>
-                        <el-col :span="6">
-                            <em>日期:</em>
-                            <el-date-picker
-                                    v-model="panel.timeScope"
-                                    type="daterange"
-                                    range-separator="至"
-                                    start-placeholder="开始日期"
-                                    end-placeholder="结束日期">
-                            </el-date-picker>
-                        </el-col>
-                        <el-col :span="4">
-                            <em>预约课程:</em>
-                            <el-select v-model="panel.classId">
-                                <el-option
-                                        v-for="item in panel.options"
-                                        :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-row>
-                </div>
-            </div>
+  <div class="context">
+    <div class="panel">
+      <h5>消费记录</h5>
+      <div class="panel-body">
+        <div class="panel_control">
+          <el-row :gutter="20">
+            <el-col :span="4">
+              <em>姓名:</em>
+              <el-input v-model="panel.name" placeholder="请输入姓名"></el-input>
+            </el-col>
+            <el-col :span="4">
+              <em>手机号:</em>
+              <el-input v-model="panel.phone" placeholder="请输入手机号" type="number" ></el-input>
+            </el-col>
+            <el-col :span="6">
+              <em>日期:</em>
+              <el-date-picker
+                  v-model="panel.timeScope"
+                  type="daterange"
+                  range-separator="至"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期">
+              </el-date-picker>
+            </el-col>
+            <el-col :span="4">
+              <em>课程名称:</em>
+              <el-select v-model="panel.classId">
+                <el-option
+                    v-for="item in panel.options"
+                    :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 :disabled="serachBtnStatus">查询</el-button>
+            </el-col>
+          </el-row>
         </div>
-        <div class="table">
-            <el-table
-                    :data="tableData"
-                    border
-                    is-horizontal-resize
-                    :default-sort="{prop: 'date', order: 'descending'}"
-                    element-loading-background="rgba(0, 0, 0, 0.8)"
-                    class=""
-                    show-summary
-                    :summary-method="getSummaries"
-                    @selection-change="handleSelectionChange"
->
+      </div>
+    </div>
+    <div class="table">
+      <el-table
+          :data="tableData"
+          border
+          is-horizontal-resize
+          :default-sort="{prop: 'date', order: 'descending'}"
+          element-loading-background="rgba(0, 0, 0, 0.8)"
+          class=""
+          show-summary
+          :summary-method="getSummaries"
+          @selection-change="handleSelectionChange"
+      >
 
-            >
-                <el-table-column
-                        type="index"
-                        label="序号"
-                        align="center"
+        >
+        <el-table-column
+            type="index"
+            label="序号"
+            align="center"
 
-                        width="50">
-                </el-table-column>
-                <el-table-column
-                        prop="Name"
-                        label="会员名"
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="Phone"
-                        label="手机号"
-                >
-                </el-table-column>
-                <el-table-column
-                        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="NormalHour"
-                        label="消费课时"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="PreNormalhour"
-                        label="消费前课时"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="AfterNormalhour"
-                        label="消费后课时"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="GiftHour"
-                        label="消费赠送"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="PreGifthour"
-                        label="消费前赠送"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="AfterGifthour"
-                        label="消费后赠送"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="ShopName"
-                        label="所处门店"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="CreatedAt"
-                        label="时间"
-                        width="180"
-                        :formatter="filterFmtDate"
-                        sortable
-                >
-                </el-table-column>
-            </el-table>
-            <br>
-            <el-pagination
-                    background
-                    :total="pageination.total"
-                    :page-size="pageination.pageItem"
-                    @current-change="pageChange"
-            ></el-pagination>
-        </div>
+            width="50">
+        </el-table-column>
+        <el-table-column
+            prop="Name"
+            label="会员名"
+        >
+        </el-table-column>
+        <el-table-column
+            prop="Phone"
+            label="手机号"
+        >
+        </el-table-column>
+        <el-table-column
+            prop="ClassName"
+            label="课程"
+            width="110"
+            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="NormalHour"
+            label="消费课时"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="PreNormalhour"
+            label="消费前课时"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="AfterNormalhour"
+            label="消费后课时"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="GiftHour"
+            label="消费赠送"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="PreGifthour"
+            label="消费前赠送"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="AfterGifthour"
+            label="消费后赠送"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="ShopName"
+            label="所处门店"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="CreatedAt"
+            label="时间"
+            width="180"
+            :formatter="filterFmtDate"
+            sortable
+        >
+        </el-table-column>
+      </el-table>
+      <br>
+      <el-pagination
+          background
+          :total="pageination.total"
+          :page-size="pageination.pageItem"
+          @current-change="pageChange"
+      ></el-pagination>
+    </div>
 
-        <el-dialog :title="dialogTitle" :visible.sync="dialogMemberVisible" width="1200px">
-            <div class="dialogContent">
-                <div class="pull-left">
-                    <el-form ref="form" :model="form" label-width="160px">
-                        <el-form-item label="手机号">
-                            <el-input v-model="form.userCode"></el-input>
-                        </el-form-item>
-                        <el-form-item label="会员名">
-                            <el-input v-model="form.name"></el-input>
-                        </el-form-item>
-                        <el-form-item label="会员类型">
-                            <el-select v-model="form.memberType" placeholder="请选择所属门店">
-                                <el-option
-                                        v-for="item in memberTypes"
-                                        :key="item.value"
-                                        :label="item.label"
-                                        :value="item.value"
-                                ></el-option>
-                            </el-select>
-                        </el-form-item>
-                        <el-form-item label="课时">
-                            <el-input-number v-model="form.lesson" :min="0" :max="99999" label="（天）"></el-input-number>
-                        </el-form-item>
-                        <el-form-item label="赠送课时">
-                            <el-input-number v-model="form.gift" :min="0" :max="99999" label="（天）"></el-input-number>
-                        </el-form-item>
-                        <el-form-item label="备注">
-                            <el-input v-model="form.memo"></el-input>
-                        </el-form-item>
-                    </el-form>
-                </div>
-                <div class="pull-right">
-                    <el-form ref="form" :model="form" label-width="160px">
-                        <el-form-item label="会员课程">
-                            <el-transfer filterable v-model="form.dialogValue" :data="form.dialogdata"></el-transfer>
-                        </el-form-item>
-                    </el-form>
-                </div>
-            </div>
-            <div class="dialogFooter">
-                <el-button type="primary" size="small" v-if="form.btnType == 0" @click="confirmMember">确定</el-button>
-                <el-button type="primary" size="small" v-if="form.btnType == 1" @click="confirmEditMember">确定
-                </el-button>
-                <el-button size="small" @click="dialogMemberVisible = false">取消</el-button>
-            </div>
-        </el-dialog>
+    <el-dialog :title="dialogTitle" :visible.sync="dialogMemberVisible" width="1200px">
+      <div class="dialogContent">
+        <div class="pull-left">
+          <el-form ref="form" :model="form" label-width="160px">
+            <el-form-item label="手机号">
+              <el-input v-model="form.userCode"></el-input>
+            </el-form-item>
+            <el-form-item label="会员名">
+              <el-input v-model="form.name"></el-input>
+            </el-form-item>
+            <el-form-item label="会员类型">
+              <el-select v-model="form.memberType" placeholder="请选择所属门店">
+                <el-option
+                    v-for="item in memberTypes"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="课时">
+              <el-input-number v-model="form.lesson" :min="0" :max="99999" label="（天）"></el-input-number>
+            </el-form-item>
+            <el-form-item label="赠送课时">
+              <el-input-number v-model="form.gift" :min="0" :max="99999" label="（天）"></el-input-number>
+            </el-form-item>
+            <el-form-item label="备注">
+              <el-input v-model="form.memo"></el-input>
+            </el-form-item>
+          </el-form>
+        </div>
+        <div class="pull-right">
+          <el-form ref="form" :model="form" label-width="160px">
+            <el-form-item label="会员课程">
+              <el-transfer filterable v-model="form.dialogValue" :data="form.dialogdata"></el-transfer>
+            </el-form-item>
+          </el-form>
+        </div>
+      </div>
+      <div class="dialogFooter">
+        <el-button type="primary" size="small" v-if="form.btnType == 0" @click="confirmMember">确定</el-button>
+        <el-button type="primary" size="small" v-if="form.btnType == 1" @click="confirmEditMember">确定
+        </el-button>
+        <el-button size="small" @click="dialogMemberVisible = false">取消</el-button>
+      </div>
+    </el-dialog>
 
-        <el-dialog :visible.sync="dialogVisible">
-            <div class="dialogTitle">
-                <h5>
-                    用户：
-                    <em class="blue">【 {{form.rowName}}】</em>
-                    <span v-if="dialogLesson">当前课时</span>
-                    <span v-if="dialogGift">当前赠送课时</span>
-                    <span v-if="dialogExpTime">当前到期时间</span>
-                    <span v-if="dialogLessonTable">当前会员课程</span>
-                </h5>
-            </div>
-            <div v-if="dialogLesson">
-                <el-input-number v-model="form.lesson" :min="0" :max="9999" label="课时调整"></el-input-number>
-            </div>
-            <div v-if="dialogGift">
-                <el-input-number v-model="form.gift" :min="0" :max="9999" label="赠送课时调整"></el-input-number>
-            </div>
+    <el-dialog :visible.sync="dialogVisible">
+      <div class="dialogTitle">
+        <h5>
+          用户：
+          <em class="blue">【 {{ form.rowName }}】</em>
+          <span v-if="dialogLesson">当前课时</span>
+          <span v-if="dialogGift">当前赠送课时</span>
+          <span v-if="dialogExpTime">当前到期时间</span>
+          <span v-if="dialogLessonTable">当前会员课程</span>
+        </h5>
+      </div>
+      <div v-if="dialogLesson">
+        <el-input-number v-model="form.lesson" :min="0" :max="9999" label="课时调整"></el-input-number>
+      </div>
+      <div v-if="dialogGift">
+        <el-input-number v-model="form.gift" :min="0" :max="9999" label="赠送课时调整"></el-input-number>
+      </div>
 
-            <div v-if="dialogExpTime">
-                <el-date-picker
-                        v-model="form.expTime"
-                        type="date"
-                        placeholder="选择日期">
-                </el-date-picker>
-            </div>
-            <div v-if="dialogLessonTable">
-                <el-transfer filterable v-model="form.dialogValue" :data="form.dialogdata"></el-transfer>
-            </div>
+      <div v-if="dialogExpTime">
+        <el-date-picker
+            v-model="form.expTime"
+            type="date"
+            placeholder="选择日期">
+        </el-date-picker>
+      </div>
+      <div v-if="dialogLessonTable">
+        <el-transfer filterable v-model="form.dialogValue" :data="form.dialogdata"></el-transfer>
+      </div>
 
-            <div class="dialogFooter">
-                <!--                当前课时-->
-                <el-button type="primary" size="small" @click="confirmLesson" v-if="dialogLesson">确定</el-button>
-                <el-button type="primary" size="small" @click="confirmGift" v-if="dialogGift">确定</el-button>
-                <el-button type="primary" size="small" @click="confirmExpTime" v-if="dialogExpTime">确定</el-button>
-                <el-button type="primary" size="small" @click="confirmLessonTable" v-if="dialogLessonTable">确定
-                </el-button>
-                <el-button size="small" @click="dialogVisible = false">取消</el-button>
-            </div>
-        </el-dialog>
-    </div>
+      <div class="dialogFooter">
+        <!--                当前课时-->
+        <el-button type="primary" size="small" @click="confirmLesson" v-if="dialogLesson">确定</el-button>
+        <el-button type="primary" size="small" @click="confirmGift" v-if="dialogGift">确定</el-button>
+        <el-button type="primary" size="small" @click="confirmExpTime" v-if="dialogExpTime">确定</el-button>
+        <el-button type="primary" size="small" @click="confirmLessonTable" v-if="dialogLessonTable">确定
+        </el-button>
+        <el-button size="small" @click="dialogVisible = false">取消</el-button>
+      </div>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
-    import Global from '../Global.js'
-    import {
-        VipUserConsumeListQuery,
-        testTable,
-        testSelect,
-        ClassListQuery,
-    } from "../api/getApiRes";
+import Global from '../Global.js'
+import {
+  VipUserConsumeListQuery,
+  testTable,
+  testSelect,
+  ClassListQuery,
+} from "../api/getApiRes";
 
-    let qs = require('qs');
-    export default {
-        data() {
-            return {
-                dialogVisible: false,//其他dialog
-                dialogMemberVisible: false,//新增会员dialog
-                dialogLesson: false,//课时调整
-                dialogGift: false,//赠送课时调整
-                dialogExpTime: false,//有效期调整
-                dialogLessonTable: false,//会员课程
-                dialogTitle: '新增会员',
-                dialogValue: [],
-                // panel 配置项目
-                panel: {
-                    name: '',
-                    phone: '',
-                    classId: '',
-                    usercode: '',
-                    username: '',
-                    timeScope: globalBt2(30),
-                    compname: '',
-                    keyword: '',
-                    USERCODE: '',
-                    endType: '',
-                    taskstatus: 99,
-                    draw: 1,
-                    start: 0,
-                    recordsTotal: 0,
-                    tableData: [],
-                    allTableData: [],
-                    limit: '10',
-                    multipleSort: false,
-                    loading: false,
-                    fileList: [],
-                    multipleSelection: [],
-                    detectedmac: '',
-                    options: [],
-                    time1: globalBt(),
-                },
-                multipleSelection: [],
-                pageination: {
-                    pageItem: 100,
-                    pageoptions: pageOptions(),
-                    total: 100,
-                    pageIndex: 1,
-                },
-                form: {
-                    name: '',
-                    userCode: '',
-                    shopId: '',
-                    memberType: 1,
-                    lesson: 1,
-                    gift: 1,
-                    btnType: 0,//0新建，1编辑编辑
-                    memo: '',
-                    expTime: '',
-                    dialogdata: [],//穿梭待选
-                    dialogValue: [],//穿梭已选
-                },
-                memberTypes: [
-                    {value: 1, label: '年会员'},
-                    {value: 2, label: '充值会员'},
-                ],
-                tableData: []
-            }
-        },
-        mounted() {
-            this.panelSelect();
-            this.getTableQuery();
-        },
-        methods: {
-            // 编辑
-            editMember(row) {
-                let that = this;
-                this.clearForm();
+let qs = require('qs');
+export default {
+  data() {
+    return {
+      serachBtnStatus: false,
+      dialogVisible: false,//其他dialog
+      dialogMemberVisible: false,//新增会员dialog
+      dialogLesson: false,//课时调整
+      dialogGift: false,//赠送课时调整
+      dialogExpTime: false,//有效期调整
+      dialogLessonTable: false,//会员课程
+      dialogTitle: '新增会员',
+      dialogValue: [],
+      // panel 配置项目
+      panel: {
+        name: '',
+        phone: '',
+        classId: '',
+        usercode: '',
+        username: '',
+        timeScope: globalBt2(30),
+        compname: '',
+        keyword: '',
+        USERCODE: '',
+        endType: '',
+        taskstatus: 99,
+        draw: 1,
+        start: 0,
+        recordsTotal: 0,
+        tableData: [],
+        allTableData: [],
+        limit: '10',
+        multipleSort: false,
+        loading: false,
+        fileList: [],
+        multipleSelection: [],
+        detectedmac: '',
+        options: [],
+        time1: globalBt(),
+      },
+      multipleSelection: [],
+      pageination: {
+        pageItem: 100,
+        pageoptions: pageOptions(),
+        total: 100,
+        pageIndex: 1,
+      },
+      form: {
+        name: '',
+        userCode: '',
+        shopId: '',
+        memberType: 1,
+        lesson: 1,
+        gift: 1,
+        btnType: 0,//0新建，1编辑编辑
+        memo: '',
+        expTime: '',
+        dialogdata: [],//穿梭待选
+        dialogValue: [],//穿梭已选
+      },
+      memberTypes: [
+        {value: 1, label: '年会员'},
+        {value: 2, label: '充值会员'},
+      ],
+      tableData: []
+    }
+  },
+  mounted() {
+    this.panelSelect();
+    this.getTableQuery();
+  },
+  methods: {
+    // 编辑
+    editMember(row) {
+      let that = this;
+      this.clearForm();
 
-                this.form.userCode = row.userCode;
-                this.form.name = row.name;
-                this.form.memberType = row.vipType;
-                this.form.lesson = row.Recovered;
-                this.form.gift = row.Recovered;
-                this.form.memo = row.memo;
-                this.form.btnType = 1;
+      this.form.userCode = row.userCode;
+      this.form.name = row.name;
+      this.form.memberType = row.vipType;
+      this.form.lesson = row.Recovered;
+      this.form.gift = row.Recovered;
+      this.form.memo = row.memo;
+      this.form.btnType = 1;
 
-                this.form.shopId = row.Id;
-                this.dialogMemberVisible = true
-                this.dialogTitle = '编辑会员'
-            },
-            // 禁用
-            pauseRow(row) {
-                let that = this;
-                this.$confirm('是否禁用用户' + row.name + '？', '禁用操作', {
-                    confirmButtonText: '确定',
-                    cancelButtonText: '取消',
-                    type: 'warning'
-                }).then(() => {
-                    let param = {
-                        token: localStorage.token,
-                        Id: row.Id,
-                        status: 0,
-                    };
-                    let postdata = qs.stringify(param);
-                    testTable(postdata).then(res => {
-                        let json = res;
-                        if (json.Code == 0) {
-                            that.$message({
-                                showClose: true,
-                                message: row.name + '禁用成功！',
-                                type: 'success'
-                            });
-                            // table 重载
-                            that.getTableQuery();
-                        } else {
-                            that.$message.error(json.Memo);
-                        }
-                    })
-                }).catch(() => {
-                    this.$message({
-                        type: 'info',
-                        message: '已取消禁用'
-                    });
-                });
-            },
-            // 启用
-            runRow(row) {
-                let that = this;
-                this.$confirm('是否启用用户' + row.name + '？', '启用操作', {
-                    confirmButtonText: '确定',
-                    cancelButtonText: '取消',
-                    type: 'warning'
-                }).then(() => {
-                    let param = {
-                        token: localStorage.token,
-                        Id: row.Id,
-                        status: 1,
-                    };
-                    let postdata = qs.stringify(param);
-                    testTable(postdata).then(res => {
-                        let json = res;
-                        if (json.Code == 0) {
-                            that.$message({
-                                showClose: true,
-                                message: row.name + '启用成功！',
-                                type: 'success'
-                            });
-                            // table 重载
-                            that.getTableQuery();
-                        } else {
-                            that.$message.error(json.Memo);
-                        }
-                    })
-                }).catch(() => {
-                    this.$message({
-                        type: 'info',
-                        message: '已取消启用'
-                    });
-                });
-            },
-            // 表格合计
-            getSummaries(param) {
-                const {columns, data} = param;
-                const sums = [];
-                columns.forEach((column, index) => {
-                    if (index === 0) {
-                        sums[index] = '合计';
-                        return;
-                    }
-                    const values = data.map(item => Number(item[column.property]));
-                    if (!values.every(value => isNaN(value)) && index != 0 && index != 1 && index != 2) {
-                        sums[index] = values.reduce((prev, curr) => {
-                            const value = Number(curr);
-                            if (!isNaN(value)) {
-                                return prev + curr;
-                            } else {
-                                return prev;
-                            }
-                        }, 0);
-                        sums[index] += '';
-                        sums[index] = parseInt(sums[index]);
-                    } else {
-                        sums[index] = '';
-                    }
-                });
-                return sums;
-            },
-            // 关闭所有
-            allDialogClose() {
-                this.dialogVisible = false;
-                this.dialogGift = false;
-                this.dialogLesson = false;
-                this.dialogExpTime = false;
-                this.dialogLessonTable = false;
-            },
-            // 用户禁用 todo
-            // 用户启用 todo
-            // 有效期调整
-            ExpTimeChange() {
-                // 仅针对年费用户，使用日期格式
-                this.allDialogClose();
-                if (!this.multipleSelection.length) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，需要先选中至少一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                if (this.multipleSelection.length != 1) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，只能选中一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                let row = this.tableRadio;
-                if (parseInt(row.vipType) == 2) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，充值会员不能调整有效期',
-                        type: 'error'
-                    });
-                    return false
-                }
-                this.form.expTime = row.expTime;
-                this.form.rowName = row.name;
-                this.dialogVisible = true;
-                this.dialogExpTime = true;
-            },
-            // 课时调整
-            lessonChange() {
-                this.allDialogClose();
-                if (!this.multipleSelection.length) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，需要先选中至少一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                if (this.multipleSelection.length != 1) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，只能选中一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                let row = this.tableRadio;
-                this.form.lesson = row.Recovered;
-                this.form.rowName = row.name;
-                this.dialogVisible = true;
-                this.dialogLesson = true;
+      this.form.shopId = row.Id;
+      this.dialogMemberVisible = true
+      this.dialogTitle = '编辑会员'
+    },
+    // 禁用
+    pauseRow(row) {
+      let that = this;
+      this.$confirm('是否禁用用户' + row.name + '？', '禁用操作', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        let param = {
+          token: localStorage.token,
+          Id: row.Id,
+          status: 0,
+        };
+        let postdata = qs.stringify(param);
+        testTable(postdata).then(res => {
+          let json = res;
+          if (json.Code == 0) {
+            that.$message({
+              showClose: true,
+              message: row.name + '禁用成功！',
+              type: 'success'
+            });
+            // table 重载
+            that.getTableQuery();
+          } else {
+            that.$message.error(json.Memo);
+          }
+        })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消禁用'
+        });
+      });
+    },
+    // 启用
+    runRow(row) {
+      let that = this;
+      this.$confirm('是否启用用户' + row.name + '？', '启用操作', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        let param = {
+          token: localStorage.token,
+          Id: row.Id,
+          status: 1,
+        };
+        let postdata = qs.stringify(param);
+        testTable(postdata).then(res => {
+          let json = res;
+          if (json.Code == 0) {
+            that.$message({
+              showClose: true,
+              message: row.name + '启用成功！',
+              type: 'success'
+            });
+            // table 重载
+            that.getTableQuery();
+          } else {
+            that.$message.error(json.Memo);
+          }
+        })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消启用'
+        });
+      });
+    },
+    // 表格合计
+    getSummaries(param) {
+      const {columns, data} = param;
+      const sums = [];
+      columns.forEach((column, index) => {
+        if (index === 0) {
+          sums[index] = '合计';
+          return;
+        }
+        const values = data.map(item => Number(item[column.property]));
+        if (!values.every(value => isNaN(value)) && index != 0 && index != 1 && index != 2) {
+          sums[index] = values.reduce((prev, curr) => {
+            const value = Number(curr);
+            if (!isNaN(value)) {
+              return prev + curr;
+            } else {
+              return prev;
+            }
+          }, 0);
+          sums[index] += '';
+          sums[index] = parseInt(sums[index]);
+        } else {
+          sums[index] = '';
+        }
+      });
+      return sums;
+    },
+    // 关闭所有
+    allDialogClose() {
+      this.dialogVisible = false;
+      this.dialogGift = false;
+      this.dialogLesson = false;
+      this.dialogExpTime = false;
+      this.dialogLessonTable = false;
+    },
+    // 用户禁用 todo
+    // 用户启用 todo
+    // 有效期调整
+    ExpTimeChange() {
+      // 仅针对年费用户，使用日期格式
+      this.allDialogClose();
+      if (!this.multipleSelection.length) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，需要先选中至少一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      if (this.multipleSelection.length != 1) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，只能选中一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      let row = this.tableRadio;
+      if (parseInt(row.vipType) == 2) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，充值会员不能调整有效期',
+          type: 'error'
+        });
+        return false
+      }
+      this.form.expTime = row.expTime;
+      this.form.rowName = row.name;
+      this.dialogVisible = true;
+      this.dialogExpTime = true;
+    },
+    // 课时调整
+    lessonChange() {
+      this.allDialogClose();
+      if (!this.multipleSelection.length) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，需要先选中至少一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      if (this.multipleSelection.length != 1) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，只能选中一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      let row = this.tableRadio;
+      this.form.lesson = row.Recovered;
+      this.form.rowName = row.name;
+      this.dialogVisible = true;
+      this.dialogLesson = true;
 
-            },
-            // 赠送调整
-            giftChange() {
-                this.allDialogClose();
-                if (!this.multipleSelection.length) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，需要先选中至少一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                if (this.multipleSelection.length != 1) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，只能选中一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                let row = this.tableRadio;
-                this.form.gift = row.Recovered;
-                this.form.rowName = row.name;
-                this.dialogVisible = true;
-                this.dialogGift = true;
+    },
+    // 赠送调整
+    giftChange() {
+      this.allDialogClose();
+      if (!this.multipleSelection.length) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，需要先选中至少一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      if (this.multipleSelection.length != 1) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，只能选中一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      let row = this.tableRadio;
+      this.form.gift = row.Recovered;
+      this.form.rowName = row.name;
+      this.dialogVisible = true;
+      this.dialogGift = true;
 
-            },
-            // 增删会员课程
-            lessonStudenChange() {
-                this.allDialogClose();
-                if (!this.multipleSelection.length) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，需要先选中至少一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                if (this.multipleSelection.length != 1) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，只能选中一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                let row = this.tableRadio;
-                this.form.gift = row.Recovered;
-                this.form.rowName = row.name;
-                this.dialogVisible = true;
-                this.dialogLessonTable = true;
-            },
-            // 确认提交新增会员
-            confirmMember() {
-                let that = this;
-                // checkNum
-                if (!that.form.userCode) {
-                    this.$message.error('错了哦，手机号不能为空');
-                    return false
-                }
-                if (!globalCheckPhone(that.form.userCode)) {
-                    this.$message.error('错了哦，手机号格式不正确');
-                    return false
-                }
-                if (!that.form.name) {
-                    this.$message.error('错了哦，会员名不能为空');
-                    return false
-                }
-                if (that.form.name.length > 8) {
-                    this.$message.error('错了哦，会员名字数超过8个字');
-                    return false
-                }
-                if (that.form.memo) {
-                    if (that.form.memo.length > 200) {
-                        this.$message.error('错了哦，备注字数超过200个字');
-                        return false
-                    }
-                }
+    },
+    // 增删会员课程
+    lessonStudenChange() {
+      this.allDialogClose();
+      if (!this.multipleSelection.length) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，需要先选中至少一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      if (this.multipleSelection.length != 1) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，只能选中一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      let row = this.tableRadio;
+      this.form.gift = row.Recovered;
+      this.form.rowName = row.name;
+      this.dialogVisible = true;
+      this.dialogLessonTable = true;
+    },
+    // 确认提交新增会员
+    confirmMember() {
+      let that = this;
+      // checkNum
+      if (!that.form.userCode) {
+        this.$message.error('错了哦，手机号不能为空');
+        return false
+      }
+      if (!globalCheckPhone(that.form.userCode)) {
+        this.$message.error('错了哦，手机号格式不正确');
+        return false
+      }
+      if (!that.form.name) {
+        this.$message.error('错了哦，会员名不能为空');
+        return false
+      }
+      if (that.form.name.length > 8) {
+        this.$message.error('错了哦，会员名字数超过8个字');
+        return false
+      }
+      if (that.form.memo) {
+        if (that.form.memo.length > 200) {
+          this.$message.error('错了哦，备注字数超过200个字');
+          return false
+        }
+      }
 
-                let param = {
-                    token: localStorage.token,
-                    userCode: that.form.userCode,
-                    name: that.form.name,
-                    memberType: that.form.memberType,
-                    lesson: that.form.lesson,
-                    gift: that.form.gift,
-                    memo: that.form.memo,
-                    dialogValue: that.form.dialogValue,
-                };
-                let postdata = qs.stringify(param);
-                testSelect(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogMemberVisible = false;
-                        // 重载列表
-                        that.getTableQuery();
-                        that.$message({
-                            showClose: true,
-                            message: '会员添加成功！',
-                            type: 'success'
-                        });
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            confirmEditMember() {
-                console.log(123);
-                let that = this;
-                // checkNum
-                if (!that.form.userCode) {
-                    this.$message.error('错了哦，手机号不能为空');
-                    return false
-                }
-                console.log(that.form.userCode);
-                if (!globalCheckPhone(that.form.userCode)) {
-                    this.$message.error('错了哦，手机号格式不正确');
-                    return false
-                }
-                if (!that.form.name) {
-                    this.$message.error('错了哦，会员名不能为空');
-                    return false
-                }
-                if (that.form.name.length > 8) {
-                    this.$message.error('错了哦，会员名字数超过8个字');
-                    return false
-                }
-                if (that.form.memo) {
-                    if (that.form.memo.length > 200) {
-                        this.$message.error('错了哦，备注字数超过200个字');
-                        return false
-                    }
-                }
-                let param = {
-                    token: localStorage.token,
-                    userCode: that.form.userCode,
-                    name: that.form.name,
-                    memberType: that.form.memberType,
-                    lesson: that.form.lesson,
-                    gift: that.form.gift,
-                    memo: that.form.memo,
-                    dialogValue: that.form.dialogValue,
-                };
-                let postdata = qs.stringify(param);
-                testSelect(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogMemberVisible = false;
-                        // 重载列表
-                        that.getTableQuery();
-                        that.$message({
-                            showClose: true,
-                            message: '会员信息编辑成功！',
-                            type: 'success'
-                        });
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 确认提交课时
-            confirmLesson() {
-                let that = this;
-                // checkNum
+      let param = {
+        token: localStorage.token,
+        userCode: that.form.userCode,
+        name: that.form.name,
+        memberType: that.form.memberType,
+        lesson: that.form.lesson,
+        gift: that.form.gift,
+        memo: that.form.memo,
+        dialogValue: that.form.dialogValue,
+      };
+      let postdata = qs.stringify(param);
+      testSelect(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogMemberVisible = false;
+          // 重载列表
+          that.getTableQuery();
+          that.$message({
+            showClose: true,
+            message: '会员添加成功！',
+            type: 'success'
+          });
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    confirmEditMember() {
+      console.log(123);
+      let that = this;
+      // checkNum
+      if (!that.form.userCode) {
+        this.$message.error('错了哦，手机号不能为空');
+        return false
+      }
+      console.log(that.form.userCode);
+      if (!globalCheckPhone(that.form.userCode)) {
+        this.$message.error('错了哦，手机号格式不正确');
+        return false
+      }
+      if (!that.form.name) {
+        this.$message.error('错了哦，会员名不能为空');
+        return false
+      }
+      if (that.form.name.length > 8) {
+        this.$message.error('错了哦，会员名字数超过8个字');
+        return false
+      }
+      if (that.form.memo) {
+        if (that.form.memo.length > 200) {
+          this.$message.error('错了哦，备注字数超过200个字');
+          return false
+        }
+      }
+      let param = {
+        token: localStorage.token,
+        userCode: that.form.userCode,
+        name: that.form.name,
+        memberType: that.form.memberType,
+        lesson: that.form.lesson,
+        gift: that.form.gift,
+        memo: that.form.memo,
+        dialogValue: that.form.dialogValue,
+      };
+      let postdata = qs.stringify(param);
+      testSelect(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogMemberVisible = false;
+          // 重载列表
+          that.getTableQuery();
+          that.$message({
+            showClose: true,
+            message: '会员信息编辑成功！',
+            type: 'success'
+          });
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 确认提交课时
+    confirmLesson() {
+      let that = this;
+      // checkNum
 
-                let param = {
-                    token: localStorage.token,
-                    userCode: that.form.userCode,
-                    lesson: that.form.lesson,
-                };
-                let postdata = qs.stringify(param);
-                testSelect(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogVisible = false;
-                        // 重载列表
-                        that.getTableQuery();
-                        that.$message({
-                            showClose: true,
-                            message: '课时调整成功！',
-                            type: 'success'
-                        });
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 确认提交赠送
-            confirmGift() {
-                let that = this;
-                // checkNum
+      let param = {
+        token: localStorage.token,
+        userCode: that.form.userCode,
+        lesson: that.form.lesson,
+      };
+      let postdata = qs.stringify(param);
+      testSelect(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogVisible = false;
+          // 重载列表
+          that.getTableQuery();
+          that.$message({
+            showClose: true,
+            message: '课时调整成功！',
+            type: 'success'
+          });
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 确认提交赠送
+    confirmGift() {
+      let that = this;
+      // checkNum
 
-                let param = {
-                    token: localStorage.token,
-                    userCode: that.form.userCode,
-                    gift: that.form.gift,
-                };
-                let postdata = qs.stringify(param);
-                testSelect(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogVisible = false;
-                        // 重载列表
-                        that.getTableQuery();
-                        that.$message({
-                            showClose: true,
-                            message: '赠送课时调整成功！',
-                            type: 'success'
-                        });
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 确认提交有效期
-            confirmExpTime() {
-                let that = this;
-                // checkNum
+      let param = {
+        token: localStorage.token,
+        userCode: that.form.userCode,
+        gift: that.form.gift,
+      };
+      let postdata = qs.stringify(param);
+      testSelect(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogVisible = false;
+          // 重载列表
+          that.getTableQuery();
+          that.$message({
+            showClose: true,
+            message: '赠送课时调整成功！',
+            type: 'success'
+          });
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 确认提交有效期
+    confirmExpTime() {
+      let that = this;
+      // checkNum
 
-                let param = {
-                    token: localStorage.token,
-                    userCode: that.form.userCode,
-                    expTime: that.form.expTime,
-                };
-                let postdata = qs.stringify(param);
-                testSelect(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogVisible = false;
-                        // 重载列表
-                        that.getTableQuery();
-                        that.$message({
-                            showClose: true,
-                            message: '赠送课时调整成功！',
-                            type: 'success'
-                        });
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 确认提交会员课程
-            confirmLessonTable() {
-                let that = this;
-                // checkNum
+      let param = {
+        token: localStorage.token,
+        userCode: that.form.userCode,
+        expTime: that.form.expTime,
+      };
+      let postdata = qs.stringify(param);
+      testSelect(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogVisible = false;
+          // 重载列表
+          that.getTableQuery();
+          that.$message({
+            showClose: true,
+            message: '赠送课时调整成功！',
+            type: 'success'
+          });
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 确认提交会员课程
+    confirmLessonTable() {
+      let that = this;
+      // checkNum
 
-                let param = {
-                    token: localStorage.token,
-                    userCode: that.form.userCode,
-                    dialogValue: that.form.dialogValue,
-                };
-                let postdata = qs.stringify(param);
-                testSelect(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        // 关闭弹窗
-                        that.dialogVisible = false;
-                        // 重载列表
-                        that.getTableQuery();
-                        that.$message({
-                            showClose: true,
-                            message: '会员课程调整成功！',
-                            type: 'success'
-                        });
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 加载选项
-            panelSelect() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                };
-                let postdata = qs.stringify(param);
-                ClassListQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.panel.options = turnClassResToOption(json.Rs);
-                        that.panel.options.unshift({label: "全部", value: ''})
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 新增会员
-            addMember() {
-                this.clearForm();
-                this.dialogMemberVisible = true
-                this.btnType = 0;
-                this.dialogTitle = '新增会员'
-            },
-            // 删除
-            delList() {
-                let that = this;
-                // checkNum
-                if (!this.multipleSelection.length) {
-                    that.$message({
-                        showClose: true,
-                        message: '错了哦，需要先选中至少一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
-                if (this.multipleSelection.length != 1) {
-                    that.$message({
-                        showClose: true,
-                        message: '错了哦，只能选中一条记录',
-                        type: 'error'
-                    });
-                    return false
-                }
+      let param = {
+        token: localStorage.token,
+        userCode: that.form.userCode,
+        dialogValue: that.form.dialogValue,
+      };
+      let postdata = qs.stringify(param);
+      testSelect(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          // 关闭弹窗
+          that.dialogVisible = false;
+          // 重载列表
+          that.getTableQuery();
+          that.$message({
+            showClose: true,
+            message: '会员课程调整成功！',
+            type: 'success'
+          });
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 加载选项
+    panelSelect() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        classType:1//去掉午休
+      };
+      let postdata = qs.stringify(param);
+      ClassListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          if (json.Rs == null) return false
+          that.panel.options = turnClassResToOption(json.Rs);
+          that.panel.options.unshift({label: "全部", value: ''})
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 新增会员
+    addMember() {
+      this.clearForm();
+      this.dialogMemberVisible = true
+      this.btnType = 0;
+      this.dialogTitle = '新增会员'
+    },
+    // 删除
+    delList() {
+      let that = this;
+      // checkNum
+      if (!this.multipleSelection.length) {
+        that.$message({
+          showClose: true,
+          message: '错了哦，需要先选中至少一条记录',
+          type: 'error'
+        });
+        return false
+      }
+      if (this.multipleSelection.length != 1) {
+        that.$message({
+          showClose: true,
+          message: '错了哦，只能选中一条记录',
+          type: 'error'
+        });
+        return false
+      }
 
-                let detectorid = that.tableRadio.Id;
+      let detectorid = that.tableRadio.Id;
 
-                let param = {
-                    token: localStorage.token,
-                    detectorid: detectorid,
-                    status: 9,//0禁用1启用9删除
-                };
-                let postdata = qs.stringify(param);
+      let param = {
+        token: localStorage.token,
+        detectorid: detectorid,
+        status: 9,//0禁用1启用9删除
+      };
+      let postdata = qs.stringify(param);
 
-                this.$confirm('此操作将永久删除该会员, 是否继续?', '提示', {
-                    confirmButtonText: '确定',
-                    cancelButtonText: '取消',
-                    type: 'warning'
-                }).then(() => {
-                    testSelect(postdata).then(res => {
-                        let json = res;
-                        if (json.Code == 0) {
-                            that.$message({
-                                showClose: true,
-                                message: '选中的会员已删除！',
-                                type: 'success'
-                            });
-                            // 重载列表
-                            that.getTableQuery();
-                        } else {
-                            that.$message.error(json.Memo);
-                        }
-                    });
-                }).catch(() => {
-                    this.$message({
-                        type: 'info',
-                        message: '已取消删除'
-                    });
-                });
-            },
+      this.$confirm('此操作将永久删除该会员, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        testSelect(postdata).then(res => {
+          let json = res;
+          if (json.Code == 0) {
+            that.$message({
+              showClose: true,
+              message: '选中的会员已删除！',
+              type: 'success'
+            });
+            // 重载列表
+            that.getTableQuery();
+          } else {
+            that.$message.error(json.Memo);
+          }
+        });
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除'
+        });
+      });
+    },
 
-            handleSelectionChange(val) {
-                this.multipleSelection = val;
-            },
-            // 查询按钮
-            query() {
-                this.getTableQuery();
-                this.$message.success('查询完毕');
-            },
-            clearForm() {
-                // clear
-                this.form.name = '';
-                this.form.userCode = '';
-                this.form.shopId = '';
-            },
-            // 页面数据查询
-            getTableQuery() {
-                let that = this;
-                // this.getGetChildRegionSelect(0, 1);
-                that.loading = true;
-                // 查询检测设备。上级区域id，区域id必传。regionid传0，查询supregionid对应所有子区域的检测设备。 如果supregionid，regionid都传0，默认查询企业ID下所有检测设备
-                let param = {
-                    token: localStorage.token,
-                    classId: that.panel.classId,
-                    name: that.panel.name,
-                    phone: that.panel.phone,
-                    bt: nonTfmtDatetoLength(that.panel.timeScope[0], 10) + ' 00:00:01',
-                    et: nonTfmtDatetoLength(that.panel.timeScope[1], 10) + ' 23:59:59',
-                    start: 1,//
-                    tableMax: 9999,//
-                };
-                let postdata = qs.stringify(param);
-                VipUserConsumeListQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.loading = false;
-                        if (json.Rs) {
-                            that.allTableData = json.Rs;
-                            that.recordsTotal = json.Rs.length;
-                        } else {
-                            that.allTableData = [];
-                            that.recordsTotal = 0;
-                        }
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    // 查询按钮
+    query() {
+      // 按钮倒计时
+      let that = this;
+      that.serachBtnStatus = true;
+      let totalTime = 2
+      let clock = window.setInterval(() => {
+        totalTime--
+        if (totalTime < 0) {
+          totalTime = 2;
+          that.serachBtnStatus = false;
+        }
+      }, 1000)
+      this.getTableQuery();
+      this.$message.success('查询完毕');
+    },
+    clearForm() {
+      // clear
+      this.form.name = '';
+      this.form.userCode = '';
+      this.form.shopId = '';
+    },
+    // 页面数据查询
+    getTableQuery() {
+      let that = this;
+      // this.getGetChildRegionSelect(0, 1);
+      that.loading = true;
+      // 查询检测设备。上级区域id，区域id必传。regionid传0，查询supregionid对应所有子区域的检测设备。 如果supregionid，regionid都传0，默认查询企业ID下所有检测设备
+      let param = {
+        token: localStorage.token,
+        classId: that.panel.classId,
+        name: that.panel.name,
+        phone: that.panel.phone,
+        bt: nonTfmtDatetoLength(that.panel.timeScope[0], 10) + ' 00:00:01',
+        et: nonTfmtDatetoLength(that.panel.timeScope[1], 10) + ' 23:59:59',
+        start: 1,//
+        tableMax: 9999,//
+      };
+      let postdata = qs.stringify(param);
+      VipUserConsumeListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.loading = false;
+          if (json.Rs) {
+            that.allTableData = json.Rs;
+            that.recordsTotal = json.Rs.length;
+          } else {
+            that.allTableData = [];
+            that.recordsTotal = 0;
+          }
 
-                        // 设置分页数据
-                        that.setPaginations();
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 导出excel
-            btnExpAll() {
-                let that = this;
-                let url = headapi + '?ctl=ajax&mod=czgl&act=czcx_excel';//获取
-                let bt = globaltime2String(that.panel.time1[0]);
-                let et = globaltime2String(that.panel.time1[1]);
-                let usercode = that.panel.usercode;
-                window.location = url + '&bt=' + bt + '&et=' + et + '&usercode=' + usercode;
-            },
-            // 设置分页数据
-            setPaginations() {
-                // 分页属性
-                let that = this;
-                that.pageination.total = that.recordsTotal;
+          // 设置分页数据
+          that.setPaginations();
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    // 导出excel
+    btnExpAll() {
+      let that = this;
+      let url = headapi + '?ctl=ajax&mod=czgl&act=czcx_excel';//获取
+      let bt = globaltime2String(that.panel.time1[0]);
+      let et = globaltime2String(that.panel.time1[1]);
+      let usercode = that.panel.usercode;
+      window.location = url + '&bt=' + bt + '&et=' + et + '&usercode=' + usercode;
+    },
+    // 设置分页数据
+    setPaginations() {
+      // 分页属性
+      let that = this;
+      that.pageination.total = that.recordsTotal;
 
-                // 默认分页
-                that.tableData = that.allTableData.filter((item, index) => {
-                    return index < that.pageination.pageItem;
-                });
-            },
-            // 每页显示数量
-            handleSizeChange() {
-                let that = this;
-                that.tableData = that.allTableData.filter((item, index) => {
-                    return index < that.pageination.pageItem;
-                });
-                that.draw = that.pageination.pageItem;
-                that.getTableQuery();
-            },
-            // 翻页
-            pageChange(pageIndex) {
-                let that = this;
-                // 获取当前页
-                let index = that.pageination.pageItem * (pageIndex - 1);
-                // 数据总数
-                let nums = that.pageination.pageItem * pageIndex;
-                // 容器
-                let tables = [];
-                for (var i = index; i < nums; i++) {
-                    if (that.allTableData[i]) {
-                        tables.push(that.allTableData[i])
-                    }
-                    this.tableData = tables;
-                }
-                that.start = index * that.draw;
-                that.getTableQuery();
-            },
-            // 自动排序
-            sortChange(params) {
-                console.log(params)
-            },
-            // 过滤时间
-            filterFmtDate(value, row, column) {
-                let that = this;
-                return nonTfmtDate(column, 11);
-            },
-            // 过滤金额
-            filterMoney(value, row, column) {
-                let that = this;
-                return parseFloat(column).toFixed(2);
-            },
-        },
-        watch: {
-            $route(to) {
-                if (to.name == 'cost') {
-                    this.panelSelect();
-                    this.getTableQuery();
-                }
-            },
-        },
-    }
+      // 默认分页
+      that.tableData = that.allTableData.filter((item, index) => {
+        return index < that.pageination.pageItem;
+      });
+    },
+    // 每页显示数量
+    handleSizeChange() {
+      let that = this;
+      that.tableData = that.allTableData.filter((item, index) => {
+        return index < that.pageination.pageItem;
+      });
+      that.draw = that.pageination.pageItem;
+      // that.getTableQuery();
+    },
+    // 翻页
+    pageChange(pageIndex) {
+      let that = this;
+      // 获取当前页
+      let index = that.pageination.pageItem * (pageIndex - 1);
+      // 数据总数
+      let nums = that.pageination.pageItem * pageIndex;
+      // 容器
+      let tables = [];
+      for (var i = index; i < nums; i++) {
+        if (that.allTableData[i]) {
+          tables.push(that.allTableData[i])
+        }
+        this.tableData = tables;
+      }
+      that.start = index * that.draw;
+      // that.getTableQuery();
+    },
+    // 自动排序
+    sortChange(params) {
+      console.log(params)
+    },
+    // 过滤时间
+    filterFmtDate(value, row, column) {
+      let that = this;
+      return nonTfmtDate(column, 11);
+    },
+    // 过滤金额
+    filterMoney(value, row, column) {
+      let that = this;
+      return parseFloat(column).toFixed(2);
+    },
+  },
+  watch: {
+    $route(to) {
+      if (to.name == 'cost') {
+        this.panelSelect();
+        this.getTableQuery();
+      }
+    },
+  },
+}
 </script>
 
 <style scoped>
-    @import "../assets/css/panel.css";
+@import "../assets/css/panel.css";
 
-    .context {
-        height: 770px;
+.context {
+  height: 770px;
 
-        overflow-y: scroll;
-        display: block;
-        margin: 0 auto;
-        background-color: #fff !important;
-        padding: 30px;
-    }
+  overflow-y: scroll;
+  display: block;
+  margin: 0 auto;
+  background-color: #fff !important;
+  padding: 30px;
+}
 
-    .panel-body {
-        padding: 20px;
-        background: #F0F2F5;
-    }
+.panel-body {
+  padding: 20px;
+  background: #F0F2F5;
+}
 
-    .change {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding-top: 10px;
-        padding-bottom: 10px;
-    }
+.change {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
 
-    .change button {
-        float: left;
-    }
+.change button {
+  float: left;
+}
 
-    .change button.pull-right {
-        float: right;
-    }
+.change button.pull-right {
+  float: right;
+}
 
-    .dialogTitle {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        color: #000000;
-        font-size: 18px;
-        text-align: center;
-    }
+.dialogTitle {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  color: #000000;
+  font-size: 18px;
+  text-align: center;
+}
 
-    .dialogTitle em {
-        float: none;
-        font-style: normal;
-        color: #3799FF;
-        margin: 0;
-    }
+.dialogTitle em {
+  float: none;
+  font-style: normal;
+  color: #3799FF;
+  margin: 0;
+}
 
-    /deep/ .el-transfer-panel__item .el-checkbox__input {
-        left: 40px;
-    }
+/deep/ .el-transfer-panel__item .el-checkbox__input {
+  left: 40px;
+}
 
-    .dialogFooter {
-        width: 90%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-top: 10px;
-    }
+.dialogFooter {
+  width: 90%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-top: 10px;
+}
 
-    .dialogFooter button {
-        float: right;
-        margin-left: 10px;
-    }
+.dialogFooter button {
+  float: right;
+  margin-left: 10px;
+}
 
-    .dialogContent {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-    }
+.dialogContent {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+}
 
-    .dialogContent .pull-left {
-        width: 30%;
-        float: left;
-    }
+.dialogContent .pull-left {
+  width: 30%;
+  float: left;
+}
 
-    .dialogContent .pull-right {
-        width: 70%;
-        float: right;
-    }
+.dialogContent .pull-right {
+  width: 70%;
+  float: right;
+}
 
-    .panel /deep/ .el-date-editor--daterange {
-        /*width: 260px;*/
-    }
+.panel /deep/ .el-date-editor--daterange {
+  /*width: 260px;*/
+}
 
-    /deep/ .el-col-4 {
-        width: 15% !important;
-    }
+/deep/ .el-col-4 {
+  width: 15% !important;
+}
 
-    .panel /deep/ .el-input__inner {
-        /*width: 130px;*/
-    }
+.panel /deep/ .el-input__inner {
+  /*width: 130px;*/
+}
 
-    .panel /deep/ .el-input {
-        /*width: 130px;*/
-    }
+.panel /deep/ .el-input {
+  /*width: 130px;*/
+}
 
-    .panel /deep/ .el-select {
-        width: 130px;
-    }
+.panel /deep/ .el-select {
+  width: 130px;
+}
 
-    /deep/ .el-date-editor .el-range-separator {
-        line-height: 22px;
-    }
-    .lessons {
-        padding: 1px 7px;
-        border-radius: 250px;
-        float: left;
-        color: #000;
-    }
+/deep/ .el-date-editor .el-range-separator {
+  line-height: 22px;
+}
+
+.lessons {
+  padding: 1px 7px;
+  border-radius: 250px;
+  float: left;
+  color: #000;
+}
 </style>

pc/src/views/finish.vue

@@ -211,7 +211,6 @@
                             that.allTableData = [];
                             that.recordsTotal = 0;
                         }
-
                         // 设置分页数据
                         that.setPaginations();
                     } else {
@@ -237,7 +236,7 @@
                     return index < that.pageination.pageItem;
                 });
                 that.draw = that.pageination.pageItem;
-                that.getTableQuery();
+                // that.getTableQuery();
             },
             // 翻页
             pageChange(pageIndex) {
@@ -255,7 +254,7 @@
                     this.tableData = tables;
                 }
                 that.start = index * that.draw;
-                that.getTableQuery();
+                // that.getTableQuery();
             },
             // 过滤时间
             filterFmtDate(value, row, column) {

pc/src/views/finishDetail.vue

@@ -13,10 +13,10 @@
                         </el-col>
                         <el-col :span="4">
                             <em>手机号:</em>
-                            <el-input v-model="panel.phone" placeholder="请输入手机号"></el-input>
+                            <el-input v-model="panel.phone" placeholder="请输入手机号" type="number" ></el-input>
                         </el-col>
                         <el-col :span="4">
-                            <el-button size="" type="primary" @click="query" plain>查询</el-button>
+                            <el-button size="" type="primary" @click="query" plain :disabled="serachBtnStatus">查询</el-button>
                         </el-col>
                     </el-row>
                 </div>
@@ -169,6 +169,7 @@
     export default {
         data() {
             return {
+              serachBtnStatus: false,
                 dialogVisible: false,//添加下课会员
                 dialogFinishVisible: false,//确认下课dialog
                 dialogLesson: false,//课时调整
@@ -447,7 +448,6 @@
             confirmLesson() {
                 let that = this;
                 // checkNum
-
                 let param = {
                     token: localStorage.token,
                     userCode: that.form.userCode,
@@ -557,6 +557,16 @@
             },
             // 查询按钮
             query() {
+              let that = this;
+              that.serachBtnStatus = true;
+              let totalTime = 2
+              let clock = window.setInterval(() => {
+                totalTime--
+                if (totalTime < 0) {
+                  totalTime = 2;
+                  that.serachBtnStatus = false;
+                }
+              }, 1000)
                 this.getTableQuery();
                 this.$message.success('查询完毕');
             },
@@ -647,7 +657,7 @@
             filterFmtDate(value, row, column) {
                 let that = this;
                 if (column == "0001-01-01T08:05:43+08:05" || column == "0001-01-01T00:00:00Z") {
-                    return '无有效期';
+                    return '未预约';
                 } else {
                     return nonTfmtDate(column, 11);
                 }

pc/src/views/lessonManage.vue

@@ -1,775 +1,808 @@
 <template>
-    <div class="context">
-        <div class="panel">
-            <h5>课程表管理</h5>
-        </div>
-        <div class="change">
-            <el-button type="primary" @click="addLessonTable" v-if="userLevel != 4">新增课程表</el-button>
-            <el-button type="" @click="copy" v-if="userLevel != 4">复制</el-button>
-            <el-button type="" @click="delList" v-if="userLevel != 4">删除</el-button>
-            <el-button type="" @click="query">刷新</el-button>
-        </div>
-        <div class="table">
-            <el-table
-                    :data="tableData"
-                    border
-                    is-horizontal-resize
-                    :default-sort="{prop: 'date', order: 'descending'}"
-                    element-loading-background="rgba(0, 0, 0, 0.8)"
-                    class=""
-                    @selection-change="handleSelectionChange"                                   @current-change="clickChange"
->
-            >
-                <el-table-column label="选择" width="55">
-    <template slot-scope="scope">
-        <el-radio  v-model="tableRadio" :label="scope.row"><i></i></el-radio>
-    </template>
-</el-table-column>
-                <el-table-column
-                        type="index"
-                        label="序号"
-                        align="center"
+  <div class="context">
+    <div class="panel">
+      <h5>课程表管理</h5>
+    </div>
+    <div class="change">
+      <el-button type="primary" @click="addLessonTable" v-if="userLevel != 4">新增课程表</el-button>
+      <el-button type="" @click="copy" v-if="userLevel != 4">复制</el-button>
+      <el-button type="" @click="delList" v-if="userLevel != 4">删除</el-button>
+      <el-button type="" @click="query" :disabled="serachBtnStatus">刷新</el-button>
+    </div>
+    <div class="table">
+      <el-table
+          :data="tableData"
+          border
+          is-horizontal-resize
+          :default-sort="{prop: 'date', order: 'descending'}"
+          element-loading-background="rgba(0, 0, 0, 0.8)"
+          class=""
+          @selection-change="handleSelectionChange" @current-change="clickChange"
+      >
+        >
+        <el-table-column label="选择" width="55">
+          <template slot-scope="scope">
+            <el-radio v-model="tableRadio" :label="scope.row"><i></i></el-radio>
+          </template>
+        </el-table-column>
+        <el-table-column
+            type="index"
+            label="序号"
+            align="center"
 
-                        width="50">
-                </el-table-column>
-                <el-table-column
-                        prop="Name"
-                        label="日期"
-                >
-                    <template slot-scope="scope">
-                        <div class="rowHeight">
-                            <!--                            已过期-->
-                            <span class="readyTime" v-if="scope.row.Diffweek < 0">
-                               {{scope.row.BeginDate}} - {{scope.row.EndDate}}
+            width="50">
+        </el-table-column>
+        <el-table-column
+            prop="Name"
+            label="日期"
+        >
+          <template slot-scope="scope">
+            <div class="rowHeight">
+              <!--                            已过期-->
+              <span class="readyTime" v-if="scope.row.Diffweek < 0">
+                               {{ scope.row.BeginDate }} - {{ scope.row.EndDate }}
                         </span>
-                            <!--                            已上线-->
-                            <span class="CurTime" v-if="scope.row.Diffweek >= 0">
-                             {{scope.row.BeginDate}} - {{scope.row.EndDate}}
+              <!--                            已上线-->
+              <span class="CurTime" v-if="scope.row.Diffweek >= 0">
+                             {{ scope.row.BeginDate }} - {{ scope.row.EndDate }}
                         </span>
-                            <!--                            当前进行-->
-                            <i class="curIcon" v-if="scope.row.Status == 1 && scope.row.Diffweek == 0"></i>
-                            <span class="runTime" v-if="scope.row.Status == 2 ">
-                              {{scope.row.BeginDate}} - {{scope.row.EndDate}}
+              <!--                            当前进行-->
+              <i class="curIcon" v-if="scope.row.Status == 1 && scope.row.Diffweek == 0"></i>
+              <span class="runTime" v-if="scope.row.Status == 2 ">
+                              {{ scope.row.BeginDate }} - {{ scope.row.EndDate }}
                         </span>
-                        </div>
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="Name"
-                        label="课程表名称"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="CreateColumn.CreatedAt"
-                        label="最后编辑时间"
-                        :formatter="filterFmtDate"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="Online"
-                        label="是否上线"
-                        v-if="userLevel != 4"
-                >
-                    <!--                    上线状态	0：不上线 1:下线-->
-                    <template slot-scope="scope">
-                        <el-switch
-                                v-model="scope.row.Online"
-                                :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"
-                        label="操作"
-                >
-                    <template slot-scope="scope">
-                        <el-button type="text" v-if="scope.row.Diffweek >= 0 && userLevel != 4" @click="editName(scope.row)">编辑名称
-                        </el-button>
-                        <el-button type="text" v-if="scope.row.Diffweek >= 0  && userLevel != 4" @click="goEdit(scope.row)">修改课程
-                        </el-button>
-                        <el-button type="text" @click="seeWeek(scope.row)">预览本周</el-button>
-                    </template>
-                </el-table-column>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="Name"
+            label="课程表名称"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="CreateColumn.CreatedAt"
+            label="最后编辑时间"
+            :formatter="filterFmtDate"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="Online"
+            label="是否上线"
+            v-if="userLevel != 4"
+        >
+          <!--                    上线状态	0：不上线 1:下线-->
+          <template slot-scope="scope">
+            <el-switch
+                v-model="scope.row.Online"
+                :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"
+            label="操作"
+        >
+          <template slot-scope="scope">
+            <el-button type="text" v-if="scope.row.Diffweek >= 0 && userLevel != 4" @click="editName(scope.row)">编辑名称
+            </el-button>
+            <el-button type="text" v-if="scope.row.Diffweek >= 0  && userLevel != 4" @click="goEdit(scope.row)">修改课程
+            </el-button>
+            <el-button type="text" @click="seeWeek(scope.row)">预览本周</el-button>
+          </template>
+        </el-table-column>
 
-            </el-table>
-            <br>
-            <el-pagination
-                    background
-                    :total="pageination.total"
-                    :page-size="pageination.pageItem"
-                    @current-change="pageChange"
-            ></el-pagination>
-        </div>
+      </el-table>
+      <br>
+      <el-pagination
+          background
+          :total="pageination.total"
+          :page-size="pageination.pageItem"
+          @current-change="pageChange"
+      ></el-pagination>
+    </div>
 
-        <el-dialog title="发布课程表" :visible.sync="dialogVisible" width="650px">
-            <div class="dialogTitle">
-                <span>{{form.name}}</span>
-            </div>
-            <div>
-                <span class="demonstration">选择发布日期(按周选取)</span>
-                <br>
-                <br>
-                <el-date-picker
-                        v-model="form.week"
-                        type="week"
-                        :picker-options="{'firstDayOfWeek': 1}"
-                        format="yyyy 第 WW 周"
-                        placeholder="选择周">
-                </el-date-picker>
-                <br>
-                <br>
-                <span>
+    <el-dialog title="发布课程表" :visible.sync="dialogVisible" width="650px">
+      <div class="dialogTitle">
+        <span>{{ form.name }}</span>
+      </div>
+      <div>
+        <span class="demonstration">选择发布日期(按周选取)</span>
+        <br>
+        <br>
+        <el-date-picker
+            v-model="form.week"
+            type="week"
+            :picker-options="{'firstDayOfWeek': 1}"
+            format="yyyy 第 WW 周"
+            placeholder="选择周">
+        </el-date-picker>
+        <br>
+        <br>
+        <span>
                     微信可见
                 </span>
-                <el-switch
-                        v-model="form.wechat"
-                        :active-value="1"
-                        :inactive-value="0"
-                        active-color="#409EFF"
-                        inactive-color="#D9D9D9">
-                </el-switch>
-                <span>
+        <el-switch
+            v-model="form.wechat"
+            :active-value="1"
+            :inactive-value="0"
+            active-color="#409EFF"
+            inactive-color="#D9D9D9">
+        </el-switch>
+        <span>
                     微信可预约
                 </span>
-                <el-switch
-                        v-model="form.appoint"
-                        :active-value="1"
-                        :inactive-value="0"
-                        active-color="#409EFF"
-                        inactive-color="#D9D9D9">
-                </el-switch>
-            </div>
-            <div class="dialogFooter">
-                <el-button type="primary" size="small" @click="public">确定</el-button>
-                <el-button @click="dialogVisible = false" size="small">取消</el-button>
-            </div>
-        </el-dialog>
-        <el-dialog title="复制课程表" :visible.sync="dialogCopyVisible" width="650px">
-            <div>
-                <span class="demonstration">选择发布日期(按周选取)</span>
-                <br>
-                <br>
-<!--                todo 禁用当前周以前的选项  disabledDate(date) {
-   return date.getTime() <= Date.now()-86400000;
- }
--->
-                <el-date-picker
-                        v-model="copyForm.week"
-                        type="week"
-                        :picker-options="{'firstDayOfWeek': 1}"
-                        format="yyyy 第 WW 周"
-                        placeholder="选择周">
-                </el-date-picker>
-            </div>
-            <div class="dialogFooter">
-                <el-button type="primary" size="small" @click="confirmCopy">确定</el-button>
-                <el-button @click="dialogCopyVisible = false" size="small">取消</el-button>
-            </div>
-        </el-dialog>
-        <el-dialog title="编辑名称" :visible.sync="dialogNameVisible" width="650px">
-            <el-form ref="form" :model="form" label-width="160px">
-                <el-form-item label="课程表名称">
-                    <el-input v-model="form.name"></el-input>
-                </el-form-item>
-            </el-form>
-            <div class="dialogFooter">
-                <el-button type="primary" size="small" @click="confirmName">确定</el-button>
-                <el-button @click="dialogNameVisible = false" size="small">取消</el-button>
-            </div>
-        </el-dialog>
-        <el-dialog title="" :visible.sync="previewShow" width="1200px">
-            <preview  :preview-date="previewDate" :big-title="BigTitle" :small-title="smallTitle" ></preview>
-            <div class="dialogFooter">
-                <el-button @click="previewShow = false" size="small">关闭</el-button>
-            </div>
-        </el-dialog>
-    </div>
+        <el-switch
+            v-model="form.appoint"
+            :active-value="1"
+            :inactive-value="0"
+            active-color="#409EFF"
+            inactive-color="#D9D9D9">
+        </el-switch>
+      </div>
+      <div class="dialogFooter">
+        <el-button type="primary" size="small" @click="public">确定</el-button>
+        <el-button @click="dialogVisible = false" size="small">取消</el-button>
+      </div>
+    </el-dialog>
+    <el-dialog title="复制课程表" :visible.sync="dialogCopyVisible" width="650px">
+      <div>
+        <span class="demonstration">选择发布日期(按周选取)</span>
+        <br>
+        <br>
+        <!--                todo 禁用当前周以前的选项  disabledDate(date) {
+           return date.getTime() <= Date.now()-86400000;
+         }
+        -->
+        <el-date-picker
+            v-model="copyForm.week"
+            type="week"
+            :picker-options="{'firstDayOfWeek': 1}"
+            format="yyyy 第 WW 周"
+            placeholder="选择周">
+        </el-date-picker>
+      </div>
+      <div class="dialogFooter">
+        <el-button type="primary" size="small" @click="confirmCopy">确定</el-button>
+        <el-button @click="dialogCopyVisible = false" size="small">取消</el-button>
+      </div>
+    </el-dialog>
+    <el-dialog title="编辑名称" :visible.sync="dialogNameVisible" width="650px">
+      <el-form ref="form" :model="form" label-width="160px">
+        <el-form-item label="课程表名称">
+          <el-input v-model="form.name"></el-input>
+        </el-form-item>
+      </el-form>
+      <div class="dialogFooter">
+        <el-button type="primary" size="small" @click="confirmName">确定</el-button>
+        <el-button @click="dialogNameVisible = false" size="small">取消</el-button>
+      </div>
+    </el-dialog>
+    <el-dialog title="" :visible.sync="previewShow" width="1200px">
+      <preview :preview-date="previewDate" :big-title="BigTitle" :small-title="smallTitle"></preview>
+      <div class="dialogFooter">
+        <el-button @click="previewShow = false" size="small">关闭</el-button>
+      </div>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
-    import Global from '../Global.js'
-    import preview from '../components/preview'
-    import {
-        STTBasicListQuery,
-        STTBasicOfflineEdit,
-        STTBasicStatusEdit,
-        SchoolTimeTableCopy,
-        STTBasicEdit,
-        testSelect,
-        SttPlanPreview,
-        SchoolTimetablePreview,
-    } from "../api/getApiRes";
+import Global from '../Global.js'
+import preview from '../components/preview'
+import {
+  STTBasicListQuery,
+  STTBasicOfflineEdit,
+  STTBasicStatusEdit,
+  SchoolTimeTableCopy,
+  STTBasicEdit,
+  testSelect,
+  SttPlanPreview,
+  SchoolTimetablePreview,
+} from "../api/getApiRes";
 
-    let qs = require('qs');
-    export default {
-        data() {
-            return {
-                previewShow: false,
-                previewDate: {},
-                BigTitle: '',
-                smallTitle: '',
-                dialogVisible: false,
-                dialogCopyVisible: false,
-                dialogNameVisible: false,
-                dialogdata: [],
-                dialogValue: [],
-                // panel 配置项目
-                multipleSelection: [],
-                pageination: {
-                    pageItem: 100,
-                    pageoptions: pageOptions(),
-                    total: 100,
-                    pageIndex: 1,
-                },
-                form: {
-                    Id: '',
-                    name: '',
-                    week: '',
-                    wechat: 1,
-                    appoint: 1,
-                },
-                copyForm: {
-                    stbId: '',
-                    Id: '',
-                    name: '',
-                    week: '',
-                    wechat: 1,
-                    appoint: 1,
-                },
-                tableData: [],
-                tableRadio: [],
-                userLevel:localStorage.userLevel
-            }
-        },
-        mounted() {
-            this.getTableQuery();
-        },
-        methods: {
-            clickChange (item) {
-                this.tableRadio = item
-            },
-            // 编辑名称
-            editName(row) {
-                this.form.name = row.Name;
-                this.form.stbId = row.StbId;
-                this.dialogNameVisible = true;
-            },
-            // 预览本周
-            seeWeek(row) {
-                let that = this;
-                console.log(row);
-                let param = {
-                    token: localStorage.token,
-                    stbId : row.StbId,
-                };
-                let postdata = qs.stringify(param);
-                SchoolTimetablePreview(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.BigTitle = row.Name;
-                        that.smallTitle = row.BeginDate + '至' + row.EndDate;
-                        that.previewDate = json.Rs;
-                        // 前台排序
-                        that.previewDate.SttPreviewClassList.sort((a,b)=>a.ClassIndex-b.ClassIndex);//升序
-                        that.previewShow = true;
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            addLessonTable() {
-                this.$router.push({
-                    path: '/editLessonManage', query: {
-                        id: 0
-                    }
-                });
-            },
-            // 删除
-            delList() {
-                let that = this;
-                if(this.tableRadio.length == 0){
-                    this.$message.error("请先选中一条记录");
-                    return false
-                }
-                let row = that.tableRadio;
+let qs = require('qs');
+export default {
+  data() {
+    return {
+      serachBtnStatus: false,
+      previewShow: false,
+      previewDate: {},
+      BigTitle: '',
+      smallTitle: '',
+      dialogVisible: false,
+      dialogCopyVisible: false,
+      dialogNameVisible: false,
+      dialogdata: [],
+      dialogValue: [],
+      // panel 配置项目
+      multipleSelection: [],
+      pageination: {
+        pageItem: 100,
+        pageoptions: pageOptions(),
+        total: 100,
+        pageIndex: 1,
+      },
+      form: {
+        Id: '',
+        name: '',
+        week: '',
+        wechat: 1,
+        appoint: 1,
+      },
+      copyForm: {
+        stbId: '',
+        Id: '',
+        name: '',
+        week: '',
+        wechat: 1,
+        appoint: 1,
+      },
+      tableData: [],
+      tableRadio: [],
+      userLevel: localStorage.userLevel
+    }
+  },
+  mounted() {
+    this.getTableQuery();
+  },
+  methods: {
+    clickChange(item) {
+      this.tableRadio = item
+    },
+    // 编辑名称
+    editName(row) {
+      this.form.name = row.Name;
+      this.form.stbId = row.StbId;
+      this.dialogNameVisible = true;
+    },
+    // 预览本周
+    seeWeek(row) {
+      let that = this;
+      console.log(row);
+      let param = {
+        token: localStorage.token,
+        stbId: row.StbId,
+      };
+      let postdata = qs.stringify(param);
+      SchoolTimetablePreview(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.BigTitle = row.Name;
+          that.smallTitle = row.BeginDate + '至' + row.EndDate;
+          that.previewDate = json.Rs;
+          // 前台排序
+          that.previewDate.SttPreviewClassList.sort((a, b) => a.ClassIndex - b.ClassIndex);//升序
+          that.previewShow = true;
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    addLessonTable() {
+      this.$router.push({
+        path: '/editLessonManage', query: {
+          id: 0
+        }
+      });
+    },
+    // 删除
+    delList() {
+      let that = this;
+      if (this.tableRadio.length == 0) {
+        this.$message.error("请先选中一条记录");
+        return false
+      }
+      let row = that.tableRadio;
 
-                if (row.Diffweek < 0) {
-                    that.$message({
-                        showClose: true,
-                        message: '已过期的课程表不可删除',
-                        type: 'error'
-                    });
-                    return false
-                }
+      if (row.Diffweek < 0) {
+        that.$message({
+          showClose: true,
+          message: '已过期的课程表不可删除',
+          type: 'error'
+        });
+        return false
+      }
 
-                let param = {
-                    token: localStorage.token,
-                    stbId: row.StbId,
-                    status: 9,//0禁用1启用9删除
-                };
-                let postdata = qs.stringify(param);
+      let param = {
+        token: localStorage.token,
+        stbId: row.StbId,
+        status: 9,//0禁用1启用9删除
+      };
+      let postdata = qs.stringify(param);
 
-                this.$confirm('此操作将永久删除该课程表, 是否继续?', '提示', {
-                    confirmButtonText: '确定',
-                    cancelButtonText: '取消',
-                    type: 'warning'
-                }).then(() => {
-                    STTBasicStatusEdit(postdata).then(res => {
-                        let json = res;
-                        if (json.Code == 0) {
-                            that.$message({
-                                showClose: true,
-                                message: '选中的课程表已删除！',
-                                type: 'success'
-                            });
-                            // 重载列表
-                            that.getTableQuery();
-                        } else {
-                            that.$message.error(json.Memo);
-                        }
-                    });
-                }).catch(() => {
-                    this.$message({
-                        type: 'info',
-                        message: '已取消删除'
-                    });
-                });
-            },
-            // 提交名称修改
-            confirmName() {
-                let that = this;
-                if (!this.form.name) {
-                    this.$message.error('名称不能为空');
-                    return false
-                }
-                if (this.form.name.length < 3) {
-                    this.$message.error('名称不能小于3个字符');
-                    return false
-                }
-                if (this.form.name.length > 20) {
-                    this.$message.error('名称不能大于20个字符');
-                    return false
-                }
-                let param = {
-                    token: localStorage.token,
-                    stbId: this.form.stbId,
-                    name: this.form.name,
-                };
-                let postdata = qs.stringify(param);
-                STTBasicEdit(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.$message({
-                            showClose: true,
-                            message: '名称修改成功！',
-                            type: 'success'
-                        });
-                        this.getTableQuery();
-                        this.dialogNameVisible = false;
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            confirmCopy() {
-                let that = this;
-                let row = this.copyForm;
+      this.$confirm('此操作将永久删除该课程表, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        STTBasicStatusEdit(postdata).then(res => {
+          let json = res;
+          if (json.Code == 0) {
+            that.$message({
+              showClose: true,
+              message: '选中的课程表已删除！',
+              type: 'success'
+            });
+            // 重载列表
+            that.getTableQuery();
+          } else {
+            that.$message.error(json.Memo);
+          }
+        });
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除'
+        });
+      });
+    },
+    // 提交名称修改
+    confirmName() {
+      let that = this;
+      if (!this.form.name) {
+        this.$message.error('名称不能为空');
+        return false
+      }
+      if (this.form.name.length < 3) {
+        this.$message.error('名称不能小于3个字符');
+        return false
+      }
+      if (this.form.name.length > 20) {
+        this.$message.error('名称不能大于20个字符');
+        return false
+      }
+      let param = {
+        token: localStorage.token,
+        stbId: this.form.stbId,
+        name: this.form.name,
+      };
+      let postdata = qs.stringify(param);
+      STTBasicEdit(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.$message({
+            showClose: true,
+            message: '名称修改成功！',
+            type: 'success'
+          });
+          this.getTableQuery();
+          this.dialogNameVisible = false;
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    confirmCopy() {
+      let that = this;
+      let row = this.copyForm;
 
-                if (!row.week) {
-                    that.$message.error('没有选择发布周期');
-                    return false
-                }
-                let param = {
-                    token: localStorage.token,
-                    stbId: row.StbId,
-                    incomingDate: nonTfmtDatetoLength(row.week, 10),//对应日期 字符串 年-月-日 格式,
-                };
-                let postdata = qs.stringify(param);
-                SchoolTimeTableCopy(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.$message({
-                            showClose: true,
-                            message: '课程复制成功！',
-                            type: 'success'
-                        });
-                        this.dialogCopyVisible = false;
-                        this.getTableQuery();
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            copy() {
-                let that = this;
-                this.dialogCopyVisible = true;
-                if(this.tableRadio.length == 0){
-                    this.$message.error("请先选中一条记录");
-                    return false
-                }
-                this.copyForm = that.tableRadio;
-            },
-            // 发布课程表
-            openLessonTable(row) {
-                this.dialogVisible = true;
-                this.form.name = row.name;
-                this.form.Id = row.Id;
-                this.form.week = '';
-            },
-            // 发布
-            public() {
-                let that = this;
-                if (!this.form.week) {
-                    this.$message({
-                        showClose: true,
-                        message: '错了哦，发布周期不能空',
-                        type: 'error'
-                    });
-                    return false
-                }
+      if (!row.week) {
+        that.$message.error('没有选择发布周期');
+        return false
+      }
+      let param = {
+        token: localStorage.token,
+        stbId: row.StbId,
+        incomingDate: nonTfmtDatetoLength(row.week, 10),//对应日期 字符串 年-月-日 格式,
+      };
+      let postdata = qs.stringify(param);
+      SchoolTimeTableCopy(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.$message({
+            showClose: true,
+            message: '课程复制成功！',
+            type: 'success'
+          });
+          this.dialogCopyVisible = false;
+          this.getTableQuery();
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    copy() {
+      let that = this;
+      this.dialogCopyVisible = true;
+      if (this.tableRadio.length == 0) {
+        this.$message.error("请先选中一条记录");
+        return false
+      }
+      this.copyForm = that.tableRadio;
+    },
+    // 发布课程表
+    openLessonTable(row) {
+      this.dialogVisible = true;
+      this.form.name = row.name;
+      this.form.Id = row.Id;
+      this.form.week = '';
+    },
+    // 发布
+    public() {
+      let that = this;
+      if (!this.form.week) {
+        this.$message({
+          showClose: true,
+          message: '错了哦，发布周期不能空',
+          type: 'error'
+        });
+        return false
+      }
 
-                let param = {
-                    token: localStorage.token,
-                    detectorid: this.form.Id,
-                    week: this.form.week,
-                    wechat: this.form.wechat,
-                    appoint: this.form.appoint,
-                };
-                let postdata = qs.stringify(param);
-                testSelect(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.$message({
-                            showClose: true,
-                            message: this.form.name + '已发布！',
-                            type: 'success'
-                        });
-                        // 重载列表
-                        that.getTableQuery();
-                        this.dialogVisible = false;
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                });
-            },
-            // 取消发布
-            unpubilc(row) {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    detectorid: row.Id,
-                    status: 4,//0禁用1启用9删除
-                };
-                let postdata = qs.stringify(param);
-                testSelect(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.$message({
-                            showClose: true,
-                            message: '选中的课程表已复制！',
-                            type: 'success'
-                        });
-                        // 重载列表
-                        that.getTableQuery();
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                });
-            },
-            // 编辑课程表
-            goEdit(row) {
-                // 参数???
-                this.$router.push({
-                    path: '/editLessonManage', query: {
-                        id: row.StbId,
-                        name: row.Name
-                    }
-                });
-            },
-            handleSelectionChange(val) {
-                this.multipleSelection = val;
-            },
-            // 查询按钮
-            query() {
-                this.getTableQuery();
-                this.$message.success('查询完毕');
-            },
-            // 页面数据查询
-            getTableQuery() {
-                let that = this;
-                that.loading = true;
-                let param = {
-                    token: localStorage.token,
-                    start: 1,//
-                    tableMax: 9999,//
-                };
-                let postdata = qs.stringify(param);
-                STTBasicListQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.loading = false;
-                        if (json.Rs) {
-                            that.allTableData = json.Rs;
-                            that.recordsTotal = json.Rs.length;
-                        } else {
-                            that.allTableData = [];
-                            that.recordsTotal = 0;
-                        }
+      let param = {
+        token: localStorage.token,
+        detectorid: this.form.Id,
+        week: this.form.week,
+        wechat: this.form.wechat,
+        appoint: this.form.appoint,
+      };
+      let postdata = qs.stringify(param);
+      testSelect(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.$message({
+            showClose: true,
+            message: this.form.name + '已发布！',
+            type: 'success'
+          });
+          // 重载列表
+          that.getTableQuery();
+          this.dialogVisible = false;
+        } else {
+          that.$message.error(json.Memo);
+        }
+      });
+    },
+    // 取消发布
+    unpubilc(row) {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        detectorid: row.Id,
+        status: 4,//0禁用1启用9删除
+      };
+      let postdata = qs.stringify(param);
+      testSelect(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.$message({
+            showClose: true,
+            message: '选中的课程表已复制！',
+            type: 'success'
+          });
+          // 重载列表
+          that.getTableQuery();
+        } else {
+          that.$message.error(json.Memo);
+        }
+      });
+    },
+    // 编辑课程表
+    goEdit(row) {
+      // 参数???
+      this.$router.push({
+        path: '/editLessonManage', query: {
+          id: row.StbId,
+          name: row.Name
+        }
+      });
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    // 查询按钮
+    query() {
+      let that = this;
+      that.serachBtnStatus = true;
+      let totalTime = 2
+      let clock = window.setInterval(() => {
+        totalTime--
+        if (totalTime < 0) {
+          totalTime = 2;
+          that.serachBtnStatus = false;
+        }
+      }, 1000)
+      this.getTableQuery();
+      this.$message.success('查询完毕');
+    },
+    // 页面数据查询
+    getTableQuery() {
+      let that = this;
+      that.loading = true;
+      let param = {
+        token: localStorage.token,
+        start: 1,//
+        tableMax: 9999,//
+      };
+      let postdata = qs.stringify(param);
+      STTBasicListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.loading = false;
+          if (json.Rs) {
+            that.allTableData = json.Rs;
+            that.recordsTotal = json.Rs.length;
+          } else {
+            that.allTableData = [];
+            that.recordsTotal = 0;
+          }
 
-                        // 设置分页数据
-                        that.setPaginations();
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            // 设置分页数据
-            setPaginations() {
-                // 分页属性
-                let that = this;
-                that.pageination.total = that.recordsTotal;
-                // 默认分页
-                that.tableData = that.allTableData.filter((item, index) => {
-                    return index < that.pageination.pageItem;
-                });
-            },
-            // 每页显示数量
-            handleSizeChange() {
-                let that = this;
-                that.tableData = that.allTableData.filter((item, index) => {
-                    return index < that.pageination.pageItem;
-                });
-                that.draw = that.pageination.pageItem;
-                that.getTableQuery();
-            },
-            // 翻页
-            pageChange(pageIndex) {
-                let that = this;
-                // 获取当前页
-                let index = that.pageination.pageItem * (pageIndex - 1);
-                // 数据总数
-                let nums = that.pageination.pageItem * pageIndex;
-                // 容器
-                let tables = [];
-                for (var i = index; i < nums; i++) {
-                    if (that.allTableData[i]) {
-                        tables.push(that.allTableData[i])
-                    }
-                    this.tableData = tables;
-                }
-                that.start = index * that.draw;
-                that.getTableQuery();
-            },
-            // 自动排序
-            sortChange(params) {
-                console.log(params)
-            },
-            // 过滤时间
-            filterFmtDate(value, row, column) {
-                let that = this;
-                return nonTfmtDate(column, 11);
-            },
-            // 过滤金额
-            filterMoney(value, row, column) {
-                let that = this;
-                return parseFloat(column).toFixed(2);
-            },
-            // 课程表上下线状态修改
-            changeWechat(e, row) {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                    stbId: row.StbId,//
-                    online: e,//
-                };
-                let postdata = qs.stringify(param);
-                STTBasicOfflineEdit(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        let text = parseInt(e) == 1 ? '上线' : '下线';
-                        that.$message({
-                            showClose: true,
-                            message: '当前课程表已' + text,
-                            type: 'success'
-                        });
-                        // 重载列表
-                        that.getTableQuery();
-                    } else {
-                        that.$message.error(json.Memo);
-                        row.Online = 0;
-                    }
-                })
-            },
-        },
-        watch: {
-            $route(to) {
-                if (to.name == 'lessonManage') {
-                    this.getTableQuery();
-                }
-            },
-        },
-        components: {
-            preview
+          // 设置分页数据
+          that.setPaginations();
+        } else {
+          that.$message.error(json.Memo);
         }
-    }
+      })
+    },
+    // 设置分页数据
+    setPaginations() {
+      // 分页属性
+      let that = this;
+      that.pageination.total = that.recordsTotal;
+      // 默认分页
+      that.tableData = that.allTableData.filter((item, index) => {
+        return index < that.pageination.pageItem;
+      });
+    },
+    // 每页显示数量
+    handleSizeChange() {
+      let that = this;
+      that.tableData = that.allTableData.filter((item, index) => {
+        return index < that.pageination.pageItem;
+      });
+      that.draw = that.pageination.pageItem;
+      that.getTableQuery();
+    },
+    // 翻页
+    pageChange(pageIndex) {
+      let that = this;
+      // 获取当前页
+      let index = that.pageination.pageItem * (pageIndex - 1);
+      // 数据总数
+      let nums = that.pageination.pageItem * pageIndex;
+      // 容器
+      let tables = [];
+      for (var i = index; i < nums; i++) {
+        if (that.allTableData[i]) {
+          tables.push(that.allTableData[i])
+        }
+        this.tableData = tables;
+      }
+      that.start = index * that.draw;
+      // that.getTableQuery();
+    },
+    // 自动排序
+    sortChange(params) {
+      console.log(params)
+    },
+    // 过滤时间
+    filterFmtDate(value, row, column) {
+      let that = this;
+      return nonTfmtDate(column, 11);
+    },
+    // 过滤金额
+    filterMoney(value, row, column) {
+      let that = this;
+      return parseFloat(column).toFixed(2);
+    },
+    // 课程表上下线状态修改
+    changeWechat(e, row) {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        stbId: row.StbId,//
+        online: e,//
+      };
+      let postdata = qs.stringify(param);
+      STTBasicOfflineEdit(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          let text = parseInt(e) == 1 ? '上线' : '下线';
+          that.$message({
+            showClose: true,
+            message: '当前课程表已' + text,
+            type: 'success'
+          });
+          // 重载列表
+          that.getTableQuery();
+        } else {
+          that.$message.error(json.Memo);
+          row.Online = 0;
+        }
+      })
+    },
+  },
+  watch: {
+    $route(to) {
+      if (to.name == 'lessonManage') {
+        this.getTableQuery();
+      }
+    },
+  },
+  components: {
+    preview
+  }
+}
 </script>
 
 <style scoped>
-    @import "../assets/css/panel.css";
+@import "../assets/css/panel.css";
 
-    .context {
-        height: 770px;
-        overflow-y: scroll;
+.context {
+  height: 770px;
+  overflow-y: scroll;
+  display: block;
+  margin: 0 auto;
+  background-color: #fff !important;
+  padding: 30px;
+  padding-bottom: 60px;
+}
 
-        display: block;
-        margin: 0 auto;
-        background-color: #fff !important;
-        padding: 30px;
-        padding-bottom: 60px;
-    }
+.panel-body {
+  padding: 20px;
+  background: #F0F2F5;
+}
 
-    .panel-body {
-        padding: 20px;
-        background: #F0F2F5;
-    }
+.change {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
 
-    .change {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding-top: 10px;
-        padding-bottom: 10px;
-    }
+.change button {
+  float: left;
+}
 
-    .change button {
-        float: left;
-    }
+.change button.pull-right {
+  float: right;
+}
 
-    .change button.pull-right {
-        float: right;
-    }
-
-    .dialogTitle {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        color: #000000;
-        font-size: 18px;
-        text-align: center;
-    }
+.dialogTitle {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  color: #000000;
+  font-size: 18px;
+  text-align: center;
+}
 
-    .dialogTitle span {
-        width: 169px;
-        height: 40px;
-        line-height: 40px;
-        text-align: center;
-        color: #fff;
-        background: #3799FF;
-        border-radius: 250px;
-        font-size: 18px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-bottom: 30px;
-    }
+.dialogTitle span {
+  width: 169px;
+  height: 40px;
+  line-height: 40px;
+  text-align: center;
+  color: #fff;
+  background: #3799FF;
+  border-radius: 250px;
+  font-size: 18px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-bottom: 30px;
+}
 
-    .dialogTitle em {
-        float: none;
-        font-style: normal;
-        color: #3799FF;
-        margin: 0;
-    }
+.dialogTitle em {
+  float: none;
+  font-style: normal;
+  color: #3799FF;
+  margin: 0;
+}
 
-    /deep/ .el-transfer-panel__item .el-checkbox__input {
-        left: 40px;
-    }
+/deep/ .el-transfer-panel__item .el-checkbox__input {
+  left: 40px;
+}
 
-    .dialogFooter {
-        width: 90%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-top: 10px;
-    }
+.dialogFooter {
+  width: 90%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-top: 10px;
+}
 
-    .dialogFooter button {
-        float: right;
-        margin-left: 10px;
-    }
+.dialogFooter button {
+  float: right;
+  margin-left: 10px;
+}
 
-    .link {
-        color: #03B1FF;
-        text-decoration: underline;
-    }
+.link {
+  color: #03B1FF;
+  text-decoration: underline;
+}
 
-    .readyTime {
-        width: 90%;
-        height: 30px;
-        line-height: 30px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        border: 1px solid #FFC769;
-        border-radius: 4px;
-        background: #FFF0D6;
-        text-indent: 14px;
-    }
+.readyTime {
+  width: 90%;
+  height: 30px;
+  line-height: 30px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  border: 1px solid #FFC769;
+  border-radius: 4px;
+  background: #FFF0D6;
+  text-indent: 14px;
+}
 
-    .CurTime {
-        width: 90%;
-        height: 27px;
-        line-height: 30px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        border: 1px solid #3799FF;
-        border-radius: 4px;
-        background: #D9ECFF;
-        padding: 3px 6px;
-        text-indent: 14px;
-    }
+.CurTime {
+  width: 90%;
+  height: 27px;
+  line-height: 30px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  border: 1px solid #3799FF;
+  border-radius: 4px;
+  background: #D9ECFF;
+  padding: 3px 6px;
+  text-indent: 14px;
+}
 
-    .runTime {
-        width: 90%;
-        height: 30px;
-        line-height: 30px;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        border: 1px solid #3799FF;
-        border-radius: 4px;
-        background: #D9ECFF;
-        padding: 3px 6px;
-        text-indent: 14px;
-    }
+.runTime {
+  width: 90%;
+  height: 30px;
+  line-height: 30px;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  border: 1px solid #3799FF;
+  border-radius: 4px;
+  background: #D9ECFF;
+  padding: 3px 6px;
+  text-indent: 14px;
+}
 
-    .curIcon {
-        position: relative;
-        left: 4px;
-        top: -34px;
-        width: 24px;
-        height: 24px;
-        float: left;
-        background: url("../assets/img/lessonTable/star.png") top center no-repeat;
-        background-size: 100% 100%;
-    }
+.curIcon {
+  position: relative;
+  left: 4px;
+  top: -34px;
+  width: 24px;
+  height: 24px;
+  float: left;
+  background: url("../assets/img/lessonTable/star.png") top center no-repeat;
+  background-size: 100% 100%;
+}
 
-    .rowHeight {
-        width: 220px;
-        overflow: hidden;
-        display: block;
-        height: 35px;
-        float: left;
-        margin: 0;
+.rowHeight {
+  width: 220px;
+  overflow: hidden;
+  display: block;
+  height: 35px;
+  float: left;
+  margin: 0;
+}
 
-    }
+/*ipad only*/
+@media only screen and (max-width: 1366px) {
+  .CurTime {
+    width: 98%;
+    font-size: 12px;
+    text-align: left;
+    text-indent:3px;
+    padding-left: 0;
+    padding-right: 0;
+  }
+  .rowHeight {
+    width: 100%;
+  }
+  .readyTime {
+    width: 98%;
+    font-size: 12px;
+    text-align: left;
+    text-indent:3px;
+  }
+  .curIcon {
+    left:0
+  }
+}
 </style>

pc/src/views/record.vue

@@ -1,487 +1,507 @@
 <template>
-    <div class="context">
-        <div class="panel">
-            <h5>预约记录</h5>
-            <div class="panel-body">
-                <div class="panel_control">
-                    <el-row :gutter="20">
-                        <el-col :span="4">
-                            <em>姓名:</em>
-                            <el-input v-model="panel.name" placeholder="请输入姓名"></el-input>
-                        </el-col>
-                        <el-col :span="4">
-                            <em>手机号:</em>
-                            <el-input v-model="panel.phone" placeholder="请输入手机号"></el-input>
-                        </el-col>
-                        <el-col :span="6">
-                            <em>日期:</em>
-                            <el-date-picker
-                                    v-model="panel.timeScope"
-                                    type="daterange"
-                                    range-separator="至"
-                                    start-placeholder="开始日期"
-                                    end-placeholder="结束日期">
-                            </el-date-picker>
-                        </el-col>
-                        <el-col :span="4">
-                            <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">
-                            <em>状态:</em>
-                            <el-select v-model="panel.status">
-                                <el-option
-                                        v-for="item in panel.options"
-                                        :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-row>
-                </div>
-            </div>
+  <div class="context">
+    <div class="panel">
+      <h5>预约记录</h5>
+      <div class="panel-body">
+        <div class="panel_control">
+          <el-row :gutter="20">
+            <el-col :span="4">
+              <em>姓名:</em>
+              <el-input v-model="panel.name" placeholder="请输入姓名"></el-input>
+            </el-col>
+            <el-col :span="4">
+              <em>手机号:</em>
+              <el-input v-model="panel.phone" placeholder="请输入手机号" type="number" ></el-input>
+            </el-col>
+            <el-col :span="6">
+              <em>日期:</em>
+              <el-date-picker
+                  v-model="panel.timeScope"
+                  type="daterange"
+                  range-separator="至"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期">
+              </el-date-picker>
+            </el-col>
+            <el-col :span="4">
+              <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">
+              <em>状态:</em>
+              <el-select v-model="panel.status">
+                <el-option
+                    v-for="item in panel.options"
+                    :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" :disabled="serachBtnStatus" plain>查询</el-button>
+            </el-col>
+          </el-row>
         </div>
-        <div class="table">
-            <el-table
-                    :data="tableData"
-                    border
-                    is-horizontal-resize
-                    :default-sort="{prop: 'date', order: 'descending'}"
-                    element-loading-background="rgba(0, 0, 0, 0.8)"
-                    class=""
-                    @selection-change="handleSelectionChange"
->
+      </div>
+    </div>
+    <div class="table">
+      <el-table
+          :data="tableData"
+          border
+          is-horizontal-resize
+          :default-sort="{prop: 'date', order: 'descending'}"
+          element-loading-background="rgba(0, 0, 0, 0.8)"
+          class=""
+          @selection-change="handleSelectionChange"
+      >
 
-            >
-                <el-table-column
-                        type="index"
-                        label="序号"
-                        align="center"
+        >
+        <el-table-column
+            type="index"
+            label="序号"
+            align="center"
 
-                        width="50">
-                </el-table-column>
-                <el-table-column
-                        prop="UserName"
-                        label="会员名"
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="Phone"
-                        label="手机号"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        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="ConsumeHour"
-                        label="课时"
-                        width="80"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="Base.CreatedAt"
-                        label="预约日期"
-                        width="180"
-                        :formatter="filterFmtDate"
-                        sortable
-                >
-                </el-table-column>
-                <el-table-column
-                        prop="BeginStr"
-                        label="上课时间"
-                        width="180"
-                        sortable
-                >
-                    <template slot-scope="scope">
-                        {{ scope.row.BeginTime |filterNoTTime}} - {{scope.row.EndStr}}
-                    </template>
-                </el-table-column>
-                <el-table-column
-                        prop="Status"
-                        label="状态"
-                        sortable
-                >
-                    <template slot-scope="scope">
-                        <span v-if="scope.row.Status == 1" style="color:yellowgreen;">已预约</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:#000;">已完成</span>
-                    </template>
-                </el-table-column>
-            </el-table>
-            <br>
-            <el-pagination
-                    background
-                    :total="pageination.total"
-                    :page-size="pageination.pageItem"
-                    @current-change="pageChange"
-            ></el-pagination>
-        </div>
+            width="50">
+        </el-table-column>
+        <el-table-column
+            prop="UserName"
+            label="会员名"
+        >
+        </el-table-column>
+        <el-table-column
+            prop="Phone"
+            label="手机号"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            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="ConsumeHour"
+            label="课时"
+            width="80"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="Base.CreatedAt"
+            label="预约日期"
+            width="180"
+            :formatter="filterFmtDate"
+            sortable
+        >
+        </el-table-column>
+        <el-table-column
+            prop="BeginStr"
+            label="上课时间"
+            width="180"
+            sortable
+        >
+          <template slot-scope="scope">
+            {{ scope.row.BeginTime |filterNoTTime }} - {{ scope.row.EndStr }}
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="Status"
+            label="状态"
+            sortable
+        >
+          <template slot-scope="scope">
+            <span v-if="scope.row.Status == 1" style="color:yellowgreen;">已预约</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:#000;">已完成</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <br>
+      <el-pagination
+          background
+          :total="pageination.total"
+          :page-size="pageination.pageItem"
+          @current-change="pageChange"
+      ></el-pagination>
     </div>
+  </div>
 </template>
 
 <script>
-    import Global from '../Global.js'
-    import {
-        OrderListQuery,
-        ClassListQuery,
-    } from "../api/getApiRes";
+import Global from '../Global.js'
+import {
+  OrderListQuery,
+  ClassListQuery,
+} from "../api/getApiRes";
 
-    let qs = require('qs');
-    export default {
-        data() {
-            return {
-                dialogVisible: false,//其他dialog
-                dialogMemberVisible: false,//新增会员dialog
-                dialogLesson: false,//课时调整
-                dialogGift: false,//赠送课时调整
-                dialogExpTime: false,//有效期调整
-                dialogLessonTable: false,//会员课程
-                dialogTitle: '新增会员',
-                dialogValue: [],
-                // panel 配置项目
-                panel: {
-                    status: '',
-                    classId: '',
-                    usercode: '',
-                    username: '',
-                    timeScope: globalBt2(30),
-                    compname: '',
-                    keyword: '',
-                    USERCODE: '',
-                    endType: '',
-                    taskstatus: 99,
-                    draw: 1,
-                    start: 0,
-                    recordsTotal: 0,
-                    tableData: [],
-                    allTableData: [],
-                    limit: '10',
-                    multipleSort: false,
-                    loading: false,
-                    fileList: [],
-                    multipleSelection: [],
-                    detectedmac: '',
-                    classOptions:[],
-                    options: [
-                        {value: '', label: '全部'},
-                        {value: 1, label: '已预约'},
-                        {value: 2, label: '已取消'},
-                        {value: 3, label: '预约未到'},
-                        {value: 4, label: '已完成'},
-                    ],
-                    endTypeOptions: [
-                        {value: 99, label: '全部'},
-                        {value: 30, label: '近一个月'},
-                        {value: 7, label: '近一周'},
-                        {value: 1, label: '当日'},
-                    ],
-                    time1: globalBt(),
-                },
-                multipleSelection: [],
-                pageination: {
-                    pageItem: 100,
-                    pageoptions: pageOptions(),
-                    total: 100,
-                    pageIndex: 1,
-                },
-                form: {
-                    name: '',
-                    userCode: '',
-                    shopId: '',
-                    memberType: 1,
-                    lesson: 1,
-                    gift: 1,
-                    btnType: 0,//0新建，1编辑编辑
-                    memo: '',
-                    expTime: '',
-                    dialogdata: [],//穿梭待选
-                    dialogValue: [],//穿梭已选
-                },
-                memberTypes: [
-                    {value: 1, label: '年会员'},
-                    {value: 2, label: '充值会员'},
-                ],
-                tableData: []
-            }
-        },
-        mounted() {
-            this.panelSelect();
-            this.getTableQuery();
-        },
-        methods: {
-            // 加载选项
-            panelSelect() {
-                let that = this;
-                let param = {
-                    token: localStorage.token,
-                };
-                let postdata = qs.stringify(param);
-                ClassListQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.panel.classOptions = turnClassResToOption(json.Rs);
-                        that.panel.classOptions.unshift({value:'',label:'全部'})
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
-            handleSelectionChange(val) {
-                this.multipleSelection = val;
-            },
-            // 查询按钮
-            query() {
-                this.getTableQuery();
-                this.$message.success('查询完毕');
-            },
-            clearForm() {
-                // clear
-                this.form.name = '';
-                this.form.userCode = '';
-                this.form.shopId = '';
-            },
-            // 页面数据查询
-            getTableQuery() {
-                let that = this;
-                // this.getGetChildRegionSelect(0, 1);
-                that.loading = true;
-                // 查询检测设备。上级区域id，区域id必传。regionid传0，查询supregionid对应所有子区域的检测设备。 如果supregionid，regionid都传0，默认查询企业ID下所有检测设备
-                let param = {
-                    token: localStorage.token,
-                    classId: that.panel.classId,//
-                    name: that.panel.name,//
-                    phone: that.panel.phone,//
-                    beginOrdertime: that.panel.beginOrdertime,//
-                    endOrdertime: that.panel.endOrdertime,//
-                    status: that.panel.status,//标签名
-                };
-                let postdata = qs.stringify(param);
-                OrderListQuery(postdata).then(res => {
-                    let json = res;
-                    if (json.Code == 0) {
-                        that.loading = false;
-                        if (json.Rs) {
-                            that.allTableData = json.Rs;
-                            that.recordsTotal = json.Rs.length;
-                        } else {
-                            that.allTableData = [];
-                            that.recordsTotal = 0;
-                        }
+let qs = require('qs');
+export default {
+  data() {
+    return {
+      serachBtnStatus: false,
+      dialogVisible: false,//其他dialog
+      dialogMemberVisible: false,//新增会员dialog
+      dialogLesson: false,//课时调整
+      dialogGift: false,//赠送课时调整
+      dialogExpTime: false,//有效期调整
+      dialogLessonTable: false,//会员课程
+      dialogTitle: '新增会员',
+      dialogValue: [],
+      // panel 配置项目
+      panel: {
+        status: '',
+        classId: '',
+        usercode: '',
+        username: '',
+        timeScope: globalBt2(30),
+        compname: '',
+        keyword: '',
+        USERCODE: '',
+        endType: '',
+        taskstatus: 99,
+        draw: 1,
+        start: 0,
+        recordsTotal: 0,
+        tableData: [],
+        allTableData: [],
+        limit: '10',
+        multipleSort: false,
+        loading: false,
+        fileList: [],
+        multipleSelection: [],
+        detectedmac: '',
+        classOptions: [],
+        options: [
+          {value: '', label: '全部'},
+          {value: 1, label: '已预约'},
+          {value: 2, label: '已取消'},
+          {value: 3, label: '预约未到'},
+          {value: 4, label: '已完成'},
+        ],
+        endTypeOptions: [
+          {value: 99, label: '全部'},
+          {value: 30, label: '近一个月'},
+          {value: 7, label: '近一周'},
+          {value: 1, label: '当日'},
+        ],
+        time1: globalBt(),
+      },
+      multipleSelection: [],
+      pageination: {
+        pageItem: 100,
+        pageoptions: pageOptions(),
+        total: 100,
+        pageIndex: 1,
+      },
+      form: {
+        name: '',
+        userCode: '',
+        shopId: '',
+        memberType: 1,
+        lesson: 1,
+        gift: 1,
+        btnType: 0,//0新建，1编辑编辑
+        memo: '',
+        expTime: '',
+        dialogdata: [],//穿梭待选
+        dialogValue: [],//穿梭已选
+      },
+      memberTypes: [
+        {value: 1, label: '年会员'},
+        {value: 2, label: '充值会员'},
+      ],
+      tableData: []
+    }
+  },
+  mounted() {
+    this.panelSelect();
+    this.getTableQuery();
+  },
+  methods: {
+    // 加载选项
+    panelSelect() {
+      let that = this;
+      let param = {
+        token: localStorage.token,
+        classType:1//去掉午休
+      };
+      let postdata = qs.stringify(param);
+      ClassListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          if (json.Rs == null) return false
+          that.panel.classOptions = turnClassResToOption(json.Rs);
+          that.panel.classOptions.unshift({value: '', label: '全部'})
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    // 查询按钮
+    query() {
+      let that = this;
+      that.serachBtnStatus = true;
+      let totalTime = 2
+      let clock = window.setInterval(() => {
+        totalTime--
+        if (totalTime < 0) {
+          totalTime = 2;
+          that.serachBtnStatus = false;
+        }
+      }, 1000)
+      this.getTableQuery();
+      this.$message.success('查询完毕');
+    },
+    clearForm() {
+      // clear
+      this.form.name = '';
+      this.form.userCode = '';
+      this.form.shopId = '';
+    },
+    // 页面数据查询
+    getTableQuery() {
+      let that = this;
+      // this.getGetChildRegionSelect(0, 1);
+      that.loading = true;
+      // 查询检测设备。上级区域id，区域id必传。regionid传0，查询supregionid对应所有子区域的检测设备。 如果supregionid，regionid都传0，默认查询企业ID下所有检测设备
+      let param = {
+        token: localStorage.token,
+        classId: that.panel.classId,//
+        name: that.panel.name,//
+        phone: that.panel.phone,//
+        beginOrdertime: that.panel.beginOrdertime,//
+        endOrdertime: that.panel.endOrdertime,//
+        status: that.panel.status,//标签名
+      };
+      let postdata = qs.stringify(param);
+      OrderListQuery(postdata).then(res => {
+        let json = res;
+        if (json.Code == 0) {
+          that.loading = false;
+          if (json.Rs) {
+            that.allTableData = json.Rs;
+            that.recordsTotal = json.Rs.length;
+          } else {
+            that.allTableData = [];
+            that.recordsTotal = 0;
+          }
 
-                        // 设置分页数据
-                        that.setPaginations();
-                    } else {
-                        that.$message.error(json.Memo);
-                    }
-                })
-            },
+          // 设置分页数据
+          that.setPaginations();
+        } else {
+          that.$message.error(json.Memo);
+        }
+      })
+    },
 
-            // 设置分页数据
-            setPaginations() {
-                // 分页属性
-                let that = this;
-                that.pageination.total = that.recordsTotal;
+    // 设置分页数据
+    setPaginations() {
+      // 分页属性
+      let that = this;
+      that.pageination.total = that.recordsTotal;
 
-                // 默认分页
-                that.tableData = that.allTableData.filter((item, index) => {
-                    return index < that.pageination.pageItem;
-                });
-            },
-            // 每页显示数量
-            handleSizeChange() {
-                let that = this;
-                that.tableData = that.allTableData.filter((item, index) => {
-                    return index < that.pageination.pageItem;
-                });
-                that.draw = that.pageination.pageItem;
-                that.getTableQuery();
-            },
-            // 翻页
-            pageChange(pageIndex) {
-                let that = this;
-                // 获取当前页
-                let index = that.pageination.pageItem * (pageIndex - 1);
-                // 数据总数
-                let nums = that.pageination.pageItem * pageIndex;
-                // 容器
-                let tables = [];
-                for (var i = index; i < nums; i++) {
-                    if (that.allTableData[i]) {
-                        tables.push(that.allTableData[i])
-                    }
-                    this.tableData = tables;
-                }
-                that.start = index * that.draw;
-                that.getTableQuery();
-            },
-            // 自动排序
-            sortChange(params) {
-                console.log(params)
-            },
-            // 过滤时间
-            filterFmtDate(value, row, column) {
-                let that = this;
-                return nonTfmtDate(column, 11);
-            },
-            // 过滤金额
-            filterMoney(value, row, column) {
-                let that = this;
-                return parseFloat(column).toFixed(2);
-            },
-        },
-        filters: {
-            filterNoTTime: function (value) {
-                if(!value){
-                    return 0
-                }else{
-                    return nonTfmtDatetoLength(value,16);
-                }
-            },
-        },
-        watch: {
-            $route(to) {
-                if (to.name == 'record') {
-                    this.panelSelect();
-                    this.getTableQuery();
-                }
-            },
-        },
-    }
+      // 默认分页
+      that.tableData = that.allTableData.filter((item, index) => {
+        return index < that.pageination.pageItem;
+      });
+    },
+    // 每页显示数量
+    handleSizeChange() {
+      let that = this;
+      that.tableData = that.allTableData.filter((item, index) => {
+        return index < that.pageination.pageItem;
+      });
+      that.draw = that.pageination.pageItem;
+      // that.getTableQuery();
+    },
+    // 翻页
+    pageChange(pageIndex) {
+      let that = this;
+      // 获取当前页
+      let index = that.pageination.pageItem * (pageIndex - 1);
+      // 数据总数
+      let nums = that.pageination.pageItem * pageIndex;
+      // 容器
+      let tables = [];
+      for (var i = index; i < nums; i++) {
+        if (that.allTableData[i]) {
+          tables.push(that.allTableData[i])
+        }
+        this.tableData = tables;
+      }
+      that.start = index * that.draw;
+      // that.getTableQuery();
+    },
+    // 自动排序
+    sortChange(params) {
+      console.log(params)
+    },
+    // 过滤时间
+    filterFmtDate(value, row, column) {
+      let that = this;
+      return nonTfmtDate(column, 11);
+    },
+    // 过滤金额
+    filterMoney(value, row, column) {
+      let that = this;
+      return parseFloat(column).toFixed(2);
+    },
+  },
+  filters: {
+    filterNoTTime: function (value) {
+      if (!value) {
+        return 0
+      } else {
+        return nonTfmtDatetoLength(value, 16);
+      }
+    },
+  },
+  watch: {
+    $route(to) {
+      if (to.name == 'record') {
+        this.panelSelect();
+        this.getTableQuery();
+      }
+    },
+  },
+}
 </script>
 
 <style scoped>
-    @import "../assets/css/panel.css";
+@import "../assets/css/panel.css";
 
-    .context {   height: 770px;
-         overflow-y: scroll;
+.context {
+  height: 770px;
+  overflow-y: scroll;
 
-        display: block;
-        margin: 0 auto;
-        background-color: #fff !important;
-        padding: 30px;
-    }
+  display: block;
+  margin: 0 auto;
+  background-color: #fff !important;
+  padding: 30px;
+}
 
-    .panel-body {
-        padding: 20px;
-        background: #F0F2F5;
-    }
+.panel-body {
+  padding: 20px;
+  background: #F0F2F5;
+}
 
-    .change {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding-top: 10px;
-        padding-bottom: 10px;
-    }
+.change {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
 
-    .change button {
-        float: left;
-    }
+.change button {
+  float: left;
+}
 
-    .change button.pull-right {
-        float: right;
-    }
+.change button.pull-right {
+  float: right;
+}
 
-    .dialogTitle {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        color: #000000;
-        font-size: 18px;
-        text-align: center;
-    }
+.dialogTitle {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  color: #000000;
+  font-size: 18px;
+  text-align: center;
+}
 
-    .dialogTitle em {
-        float: none;
-        font-style: normal;
-        color: #3799FF;
-        margin: 0;
-    }
+.dialogTitle em {
+  float: none;
+  font-style: normal;
+  color: #3799FF;
+  margin: 0;
+}
 
-    /deep/ .el-transfer-panel__item .el-checkbox__input {
-        left: 40px;
-    }
+/deep/ .el-transfer-panel__item .el-checkbox__input {
+  left: 40px;
+}
 
-    .dialogFooter {
-        width: 90%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        margin-top: 10px;
-    }
+.dialogFooter {
+  width: 90%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+  margin-top: 10px;
+}
 
-    .dialogFooter button {
-        float: right;
-        margin-left: 10px;
-    }
+.dialogFooter button {
+  float: right;
+  margin-left: 10px;
+}
 
-    .dialogContent {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-    }
+.dialogContent {
+  width: 100%;
+  overflow: hidden;
+  display: block;
+  margin: 0 auto;
+}
 
-    .dialogContent .pull-left {
-        width: 30%;
-        float: left;
-    }
+.dialogContent .pull-left {
+  width: 30%;
+  float: left;
+}
 
-    .dialogContent .pull-right {
-        width: 70%;
-        float: right;
-    }
+.dialogContent .pull-right {
+  width: 70%;
+  float: right;
+}
 
-    .panel /deep/ .el-date-editor--daterange {
-        /*width: 260px;*/
-    }
+.panel /deep/ .el-date-editor--daterange {
+  /*width: 260px;*/
+}
 
-    /deep/ .el-col-4 {
-        width: 15% !important;
-    }
+/deep/ .el-col-4 {
+  width: 15% !important;
+}
 
-    .panel /deep/ .el-input__inner {
-        /*width: 130px;*/
-    }
+.panel /deep/ .el-input__inner {
+  /*width: 130px;*/
+}
 
-    .panel /deep/ .el-input {
-        /*width: 130px;*/
-    }
+.panel /deep/ .el-input {
+  /*width: 130px;*/
+}
 
-    .panel /deep/ .el-select {
-        width: 130px;
-    }
+.panel /deep/ .el-select {
+  width: 130px;
+}
+
+/deep/ .el-date-editor .el-range-separator {
+  line-height: 22px;
+}
+
+.lessons {
+  padding: 1px 7px;
+  border-radius: 250px;
+  float: left;
+  color: #000;
+}
+/*ipad only*/
+@media only screen and (max-width: 1366px) {
+
+}
 
-    /deep/ .el-date-editor .el-range-separator {
-        line-height: 22px;
-    }
-    .lessons {
-        padding: 1px 7px;
-        border-radius: 250px;
-        float: left;
-        color: #000;
-    }
 </style>