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

app/README.md

@@ -39,3 +39,8 @@ normal:normal,
 
 使用
 Toast(msg,color);
+
+###
+20200831
+1. 把新框架结构加入新版 app-template 中
+2. 优化项目结构，删掉无用的页面和资源

app/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "xiaofeilong",
+  "name": "GoAllOut",
   "version": "0.1.0",
   "private": true,
   "scripts": {
@@ -14,6 +14,7 @@
     "muse-ui": "^3.0.2",
     "muse-ui-loading": "^0.2.0",
     "muse-ui-message": "^0.2.1",
+    "muse-ui-progress": "^0.1.0",
     "muse-ui-toast": "^0.3.0",
     "vue": "^2.6.11",
     "vue-router": "^3.1.5"

app/src/App.vue

@@ -18,19 +18,6 @@
         overflow-y: hidden;
     }
 
-    /*#nav {*/
-    /*    padding: 30px;*/
-    /*}*/
-
-    /*#nav a {*/
-    /*    font-weight: bold;*/
-    /*    color: #2c3e50;*/
-    /*}*/
-
-    /*#nav a.router-link-exact-active {*/
-    /*    color: #42b983;*/
-    /*}*/
-
     ul, li {
         list-style: none;
         padding: 0;
@@ -41,20 +28,4 @@
         font-style: normal;
     }
 
-    /*.mu-loading-wrap {*/
-    /*    width: 50px;*/
-    /*    overflow: hidden;*/
-    /*    display: block;*/
-    /*    margin: 0 auto;*/
-    /*    margin-top: 10px;*/
-    /*    background-color: transparent !important;*/
-    /*}*/
-
-    /*.mu-warning-color {*/
-    /*    background: rgb(255, 162, 0) !important;*/
-    /*}*/
-
-    /*.mu-appbar-title {*/
-    /*    font-size: 18px !important;*/
-    /*}*/
 </style>

app/src/main.js

@@ -11,6 +11,9 @@ import Loading from 'muse-ui-loading';
 
 import Message from 'muse-ui-message';
 Vue.use(Message);
+import NProgress from 'muse-ui-progress';
+Vue.use(NProgress);
+
 
 Vue.use(MuseUI);
 Vue.locale = () => {

app/src/page/appoint.vue

@@ -2,7 +2,7 @@
     <div>
         <img src="../static/images/main/banner.png" height="121" width="414"/>
         <mu-tabs :value.sync="active" color="#F2F2F2" indicator-color="#33CAF7" center>
-            <mu-tab v-for="item in 4">8月5日 <br> <em>星期二</em></mu-tab>
+            <mu-tab v-for="item in 5">8月5日 <br> <em>星期二</em></mu-tab>
         </mu-tabs>
         <div class="context">
                 <span class="sum">
@@ -133,7 +133,7 @@
                         testTable(postdata).then(res => {
                             let json = res;
                             if (json.Code == 0) {
-                                that.Toast('当前课程已取消预约','success');
+                                that.Toast('当前课程已取消预约', 'success');
                                 that.getList();
                             } else {
                                 that.Toast(json.Memo + ',错误码：' + json.Code);
@@ -145,13 +145,13 @@
                 });
             },
             isDisable(row) {
-                this.Toast('课程不可预约，请选择其他课程或其他时间预约','info');
+                this.Toast('课程不可预约，请选择其他课程或其他时间预约', 'info');
             },
             getList() {
                 let that = this;
                 let param = {
                     token: localStorage.token,
-                    active:this.active
+                    active: this.active
                 };
                 let postdata = qs.stringify(param);
                 testTable(postdata).then(res => {
@@ -168,7 +168,7 @@
             },
         },
         watch: {
-            'active' () {
+            'active'() {
                 this.getList();
             }
         },
@@ -200,10 +200,12 @@
     }
 
     /deep/ .mu-tab {
-        width: 115px;
         height: 51px;
         margin-right: 6px;
     }
+    /deep/ .mu-tab:nth-child(5) {
+        margin-right: 0px;
+    }
 
     /deep/ .mu-tab-wrapper {
         height: 51px;
@@ -211,7 +213,7 @@
         color: #363636;
         box-shadow: 1px 0px 6px rgba(0, 0, 0, 0.16);
         border-radius: 8px 8px 0px 0px;
-        font-size: 16px;
+        font-size: 14px;
     }
 
     /deep/ .mu-tab-active .mu-tab-wrapper {
@@ -255,6 +257,7 @@
         display: block;
         margin: 0 auto;
         margin-top: 8px;
+        padding-bottom: 30px;
     }
 
     .list li {
@@ -415,6 +418,17 @@
         color: #C9C9C9;
     }
 
+    /deep/ .mu-tabs-center {
+        display: flex;
+        overflow-x: auto;
+        overflow-y: hidden;
+        white-space: nowrap;
+    }
+    /deep/ .mu-tabs-center::-webkit-scrollbar {
+        display: none;
+    }
+
+
     /deep/ .mu-modal-inner {
         width: 90%;
         float: left;

app/src/page/login.vue

@@ -115,6 +115,7 @@
         },
         mounted() {
             // 获取图形验证码
+            // alert(document.body.clientWidth);
             this.getValImgSrc();
             this.overtime = new Date();
         },
@@ -207,8 +208,8 @@
                 let uservalid = this.login.uservalid;
                 // 重置验证码超时
                 that.overtime = new Date();
-                // if (!that.globalValid(phone, 10, 12, '手机号', that)) return;
-                // if (!that.globalValid(uservalid, 3, 5, '短信验证码', that)) return;
+                if (!that.globalValid(phone, 10, 12, '手机号', that)) return;
+                if (!that.globalValid(uservalid, 3, 5, '短信验证码', that)) return;
                 this.loginInfo();
             },
             // 校验内容长度
@@ -486,4 +487,52 @@
         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: 415px) {
+        #login .login_valid {
+            width: 205px;
+        }
+        #login .login_pwd {
+            width: 205px;
+        }
+    }
+    @media only screen and (max-width: 400px) {
+
+        #login .login_valid {
+            width: 195px;
+        }
+        #login .login_pwd {
+            width: 195px;
+        }
+    }
+    @media only screen and (max-width: 375px) {
+
+    }
+    @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) {
+
+    }
+    @media only screen and (min-width: 641px) {
+
+    }
 </style>

app/src/page/mainpage.vue

@@ -160,13 +160,14 @@
     }
 
     .list {
-        width: 96%;
+        width: 94%;
         overflow: hidden;
         display: block;
         margin: 0 auto;
-        padding-left: 2%;
-        padding-right: 2%;
+        padding-left: 3%;
+        padding-right: 3%;
         margin-top: 10px;
+        padding-bottom: 20px;
     }
 
     .list li {
@@ -185,7 +186,7 @@
     }
 
     .list .rt {
-        width: 60%;
+        width: 58%;
         float: left;
         padding-left: 15px;
     }
@@ -221,7 +222,7 @@
         font-family: "PingFang SC";
         font-weight: normal;
         font-size: 16px;
-        padding-right: 31px;
+        padding-right: 1px;
         margin-top: 20px;
         float: right;
         text-align: right;

app/src/page/mine.vue

@@ -8,49 +8,53 @@
             <div class="user">
                 <img src="../static/images/mine/User.png" height="53" width="53"/>
                 <span>{{user.name}}</span>
-                <p @click="change">修改</p>
+<!--                <p @click="change">修改</p>-->
                 <em>{{user.userCode}}</em>
             </div>
             <div class="value">
                 <div class="vTitle year" v-if="user.level == 0"><i></i>年会员</div>
                 <div class="vTitle price" v-if="user.level == 1"><i></i>充值会员</div>
                 <div class="vNum">
-                    总计 {{user.Class}} 课时
+                    <div class="center">
+                        总{{user.kick}}课时
+                    </div>
                     <em>（有效期至2020.12.09）</em>
                 </div>
-                <mu-flex class="demo-linear-progress">
-                    <mu-linear-progress mode="determinate" :value="30"></mu-linear-progress>
+                <mu-flex class="linear-progress">
+                    <mu-linear-progress mode="determinate" :value="30"  :size="10"  color="secondary"></mu-linear-progress>
                 </mu-flex>
                 <div class="limit">
-                    <em>剩余 {{user.remain}} 课时</em>
-                    <span>完成 {{user.sum}} 课时</span>
+                    <em>剩余 {{user.kick}} 课时</em>
+                    <span>完成 {{user.kick}} 课时</span>
                 </div>
             </div>
             <div class="dataSum">
                 <div class="row">
                     <em>卡路里（月度）</em>
-                    <s></s>
-                    <span>{{user.Cal}}</span>
+                    <div class="mid midl"></div>
+                    <span>{{user.kick}}</span>
                 </div>
                 <div class="row">
                     <em>总卡路里</em>
-                    <s></s>
-                    <span>{{user.sumCal}}</span>
+                    <div class="mid"></div>
+                    <span>{{user.kick}}</span>
                 </div>
             </div>
             <div class="dataSum">
                 <div class="row">
                     <em>CK（月度）</em>
-                    <s></s>
-                    <span>{{user.ck}}</span>
+                    <div class="mid midl"></div>
+                    <span>{{user.kick}}</span>
                 </div>
                 <div class="row">
                     <em>总CK</em>
-                    <s></s>
-                    <span>{{user.sumCk}}</span>
+                    <div class="mid"></div>
+                    <span>{{user.kick}}</span>
                 </div>
             </div>
-
+            <div class="btn_center">
+                <span class="btn btn-md login_btn" @click="logoutBtn">退出</span>
+            </div>
         </div>
         <bottomTab :curTab="thisTab"></bottomTab>
     </div>
@@ -83,9 +87,9 @@
                 },
                 user: {
                     name: '',
-                    Class: '',
                     userCode: '',
                     remain: 0,
+                    Class: 0,
                     sum: 0,
                     Cal: 0,
                     sumCal: 0,
@@ -98,6 +102,19 @@
             this.getInfo();
         },
         methods: {
+            logoutBtn(){
+                  let that = this;
+                this.$confirm('是否退出当前账号？', '提示', {
+                    type: 'warning'
+                }).then(({ result }) => {
+                    if (result) {
+                        localStorage.token = '';
+                        that.$router.push({path: '/login'});
+                    } else {
+                        that.$toast.message('点击了取消');
+                    }
+                });
+            },
             getInfo() {
                 let that = this;
                 let param = {
@@ -149,7 +166,7 @@
         margin: 0 auto;
         height: 58px;
         background: #fff;
-        padding: 17px 2%;
+        padding: 17px 3%;
         margin-bottom: 10px;
     }
 
@@ -232,4 +249,161 @@
     .vTitle.price i {
         background: #FFB43C;
     }
+    .vNum {
+        width: 100%;
+        height: 25px;
+        overflow: hidden;
+        display: block;
+        margin: 5px auto;
+    }
+    .center {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        text-align: center;
+    }
+    .vNum em {
+        position: relative;
+        float: right;
+        bottom: 20px;
+        font-family: "PingFang SC";
+        font-weight: 500;
+        font-size: 12px;
+        color: #c9c9c9;
+        padding-right: 3%;
+    }
+    /deep/ .linear-progress {
+        width: 90%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        border-radius: 250px;
+    }
+    .limit {
+        width: 90%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        margin-top: 8px;
+    }
+    .limit em {
+        font-family: "PingFang SC";
+        font-weight: 300;
+        font-size: 12px;
+        text-align: right;
+        color: #e75296;
+        padding-left: 10px;
+    }
+    .limit span {
+        font-family: "PingFang SC";
+        font-weight: 300;
+        font-size: 12px;
+        text-align: right;
+        color: #909090;
+        float: right;
+        text-align: right;
+        padding-right: 10px;
+    }
+    .dataSum {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        height: 95px;
+        background: #fff;
+        margin-top: 10px;
+    }
+    .dataSum .row {
+        width: 94%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        padding: 3% 0;
+    }
+    .dataSum .row em {
+        float: left;
+        font-family: "PingFang SC";
+        font-weight: 300;
+        font-size: 18px;
+        text-align: right;
+        color: #3b3b3b;
+    }
+    .dataSum .row span {
+        font-family: "PingFang SC";
+        font-weight: 500;
+        font-size: 18px;
+        text-align: right;
+        color: #3b3b3b;
+        float: right;
+    }
+    .row .mid {
+        width: 66%;
+        height: 0px;
+        background: transparent;
+        border: 1px dotted #e0e0e0;
+        float: left;
+        margin-top: 11px;
+        margin-right: 5px;
+        margin-left: 10px;
+    }
+    .row .midl {
+        width: 54%;
+        height: 0px;
+    }
+    .login_btn {
+        width: 96%;
+        height: 50px;
+        line-height: 50px;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        margin-top: 10px;
+        margin-bottom: 30px;
+        padding-left: 3%;
+        padding-right: 3%;
+        background: #E75296;
+        color: #fff;
+        font-size: 14px;
+        text-align: center;
+        border: none;
+        padding: 0;
+        font-size: 24px;
+    }
+    @media only screen and (max-width: 640px) {
+
+        }
+        @media only screen and (max-width: 480px) {
+
+        }
+        @media only screen and (max-width: 375px) {
+            .vNum em {
+                padding-right: 0!important;
+            }
+            .row .mid {
+                width: 49%;
+            }
+            .row .midl {
+                width: 44%;
+                height: 0px;
+            }
+        }
+        @media only screen and (max-width: 360px) {
+            .vNum em {
+                padding-right: 0!important;
+            }
+            .row .mid {
+                width: 49%;
+            }
+            .row .midl {
+                width: 44%;
+                height: 0px;
+            }
+        }
+        @media only screen and (max-width: 320px) {
+
+        }
+        @media only screen and (min-width: 641px) {
+
+        }
 </style>

app/src/page/record.vue

@@ -191,6 +191,8 @@
         display: block;
         margin: 0 auto;
         padding-top: 6px;
+        padding-bottom: 30px;
+
     }
 
     .list li {
@@ -199,7 +201,7 @@
         display: block;
         margin: 0 auto;
         background: #fff;
-        padding: 20px 2%;
+        padding: 20px 3%;
         margin-bottom: 10px;
     }
 
@@ -235,6 +237,7 @@
         max-width: 200px;
         /*width: 220px;*/
         float: left;
+        padding-top: 5px;
     }
     .list .rt {
         width: 55px;
@@ -243,6 +246,7 @@
         overflow: hidden;
         display: block;
         margin: 0 auto;
+        padding-top: 4px;
     }
     .md em {
         float: left;

app/src/router/index.js

@@ -1,8 +1,21 @@
 import Vue from 'vue'
 import VueRouter from 'vue-router'
+import NProgress from 'muse-ui-progress';
 
 Vue.use(VueRouter);
 
+let NPconfig = {
+    zIndex: 2000,          // progress z-index
+    top: 0,                // position fixed top
+    speed: 300,            // progress speed
+    color: '#E75296',      // color
+    size: 2,               // progress size
+    className: ''          // progress custom class
+}
+Vue.use(NProgress,NPconfig);
+
+
+
 const routes = [
     {
         path: '/',
@@ -66,7 +79,26 @@ const routes = [
 ];
 
 const router = new VueRouter({
+    mode: 'history',
+    base: process.env.BASE_URL,
     routes
 });
 
+// 路由守卫
+router.beforeEach((to,from,next)=>{
+    NProgress.start()
+    const isLogin = localStorage.token? true : false;
+    next();
+    // if(to.path == '/login' || to.path == '/register'){//'login'和'register'相当于是路由白名单
+    //     next();
+    // }else{
+    //     //如果token存在，就正常跳转，如果不存在，则说明未登陆，则跳转到'login'
+    //     isLogin? next() : next("/login");
+    // }
+});
+
+router.afterEach(() => {
+    NProgress.done()
+})
+
 export default router

app/vue.config.js

@@ -12,7 +12,7 @@ module.exports = {
         }
     },
     // 输出文件目录
-    outputDir: 'D:/wwwroot/wifiDig/build/static_mobile',
+    outputDir: 'D:/wwwroot/flyLongApp/build',
     // outputDir: 'D:/wwwroot/wifiDig/muse/electron/static_mobile',
     // publicPath : './',