online 客户端

online/src/components/LineExample.js

@@ -36,8 +36,8 @@ export default {
                             display: false,
                         },
                         label: '',
-                        color: '#FFA200',
-                        borderColor: '#FFA200',
+                        color: '#E75296',
+                        borderColor: '#E75296',
                         backgroundColor: 'rgba(255,255,255,0)',
                         data: this.datadatasets
                     }

online/src/page/login.vue

@@ -3,13 +3,30 @@
         <div class="topImg">
             <img src="../static/images/login/head.png"/>
         </div>
-        <div class="control">
+        <div class="control" v-if="controlShow">
             <mu-text-field v-model="input" placeholder="｜请输入手机号"></mu-text-field>
             <mu-button color="info" small round v-if="btnShow" @click="errorToast">继续</mu-button>
             <mu-button color="primary" small round v-else @click="stepVertify">继续</mu-button>
         </div>
         <div class="vertify" v-if="vertifyShow">
-            <vue-simple-verify ref="verify" @success="success" />
+            <vue-simple-verify ref="verify" @success="success"/>
+        </div>
+        <div class="code" v-if="codeShow">
+            <div class="cubesContainer">
+                <mu-text-field ref="vcodeInput" v-model="vcode"></mu-text-field>
+                <ul @click="focusVcode">
+                    <li></li>
+                    <li></li>
+                    <li></li>
+                    <li></li>
+                </ul>
+            </div>
+            <div class="tips" v-if="tipsState">
+                <span v-if="codeState" style="color: #E75296">验证码错误</span>
+                <span v-else style="color: #AACC03">验证码正确</span>
+            </div>
+            <mu-button color="info" small round v-if="codebtnShow" @click="errorCodeToast">继续</mu-button>
+            <mu-button color="primary" small round v-else @click="stepCode">继续</mu-button>
         </div>
     </div>
 </template>
@@ -20,9 +37,15 @@
     export default {
         data() {
             return {
-                btnShow: true, //true  false
+                controlShow: true, //true
+                btnShow: true, //true
                 vertifyShow: false,
+                codeShow: false,
+                codebtnShow: false,
+                tipsState: false,
+                codeState: true,
                 input: '',
+                vcode: '',
             }
         },
         watch: {
@@ -32,6 +55,21 @@
                     // 校验手机号格式
                     if (globalCheckPhone(newName)) {
                         that.btnShow = false;
+                    } else {
+                        that.btnShow = true;
+                    }
+                },
+                deep: true,
+                immediate: true
+            },
+            vcode: {
+                handler(newName, oldName) {
+                    let that = this;
+                    // 校验验证码
+                    if (newName.length == 4) {
+                        that.codebtnShow = false;
+                    } else {
+                        that.codebtnShow = true;
                     }
                 },
                 deep: true,
@@ -42,12 +80,29 @@
             errorToast() {
                 this.Toast('手机号格式不正确');
             },
-            success(){
-
+            errorCodeToast() {
+                this.Toast('验证码不正确');
             },
-            stepVertify(){
+            success() {
+                this.vertifyShow = false;
+                this.codeShow = true;
+                // todo 发送验证码
+            },
+            stepVertify() {
                 this.btnShow = false;
                 this.vertifyShow = true;
+                this.controlShow = false;
+            },
+            stepCode() {
+                // login ajax todo
+                this.tipsState = true;
+                this.$router.push({path:'/'});
+            },
+            // 获取焦点
+            focusVcode(){
+                this.$nextTick(() =>{
+                    this.$refs.vcodeInput.focus()
+                })
             }
         }
     }
@@ -92,6 +147,48 @@
         margin-top: 20%;
     }
 
+    .vertify {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        margin-top: 20%;
+    }
+
+    .code {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        margin-top: 20%;
+    }
+
+    .code .cubesContainer {
+        width: 100%;
+        height: 50px;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+    }
+
+    .cubesContainer ul {
+        position: relative;
+        bottom: 60px;
+        width: 200px;
+        height: 60px;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+    }
+
+    .cubesContainer li {
+        width: 40px;
+        height: 40px;
+        border: 1px solid #E75296;
+        float: left;
+        margin-right: 10px;
+    }
+
     /deep/ .mu-input {
         overflow: hidden;
         display: block;
@@ -111,6 +208,7 @@
         box-shadow: none;
         float: right;
     }
+
     /deep/ .mu-info-color {
         background: #E2E2E2;
     }
@@ -118,4 +216,25 @@
     /deep/ .mu-raised-button {
         min-width: 66px;
     }
+
+    /deep/ .cubesContainer .mu-input__focus {
+        color: #fff;
+    }
+
+    .cubesContainer /deep/ .mu-text-field-input {
+        height: 50px;
+        line-height: 50px;
+        font-size: 30px;
+        color: #E75296;
+        text-indent: 40px;
+        letter-spacing: 33px;
+    }
+
+    .cubesContainer /deep/ .mu-input-line {
+        background: none;
+    }
+    .tips {
+        float: left;
+        margin-left: 15%;
+    }
 </style>

online/src/page/mainpage.vue

@@ -1,407 +1,37 @@
 <template>
-    <div id="mainPage">
-        <img class="banner" src="../static/images/main/banner.png"/>
-        <span class="shopNum">
-            俱乐部场馆共 {{ list.length }} 处
-        </span>
-        <ul class="list">
-            <li v-for="l in list" @click="goAppoint(l)" v-if="parseInt(l.Status) == 1">
-                <div class="lt">
-                    <img src="../static/images/main/shop2.jpg" width="100%" height="100%" v-show="parseInt(l.ShopID) == 3"/>
-                    <img src="../static/images/main/shop.jpg" width="100%" height="100%" v-show="parseInt(l.ShopID) == 4"/>
-                    <img src="../static/images/main/shop3.png" width="100%" height="100%" v-show="parseInt(l.ShopID) == 5"/>
-                </div>
-                <div class="rt">
-                    <h4 style="background-color: #FFA310" v-if="l.ShopID == 3">{{ l.ShopName.substr(5,12) }}</h4>
-                    <h4 style="background-color: #37CB00" v-if="l.ShopID == 4">{{ l.ShopName.substr(5,12) }}</h4>
-                    <h4 style="background-color: #028FE1" v-if="l.ShopID == 5">{{ l.ShopName.substr(5,12) }}</h4>
-                    <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>
-        <alert ref="alertPart"></alert>
+    <div class="container">
+        <div class="top"></div>
+        <div class="row"></div>
+        <div class="middle"></div>
+        <div class="row"></div>
+        <div class="bottom">
+            <h5>5分钟心率趋势图</h5>
+            <span>最大心率 : 128      平均心率 : 92</span>
+            <Line-example
+                    :width="390"
+                    :height="200"
+                    :dataLabels="dataLabels"
+                    :datadatasets="datadatasets"
+            />
+        </div>
     </div>
 </template>
 
 <script>
-    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'
-
+    import LineExample from '../components/LineExample'
     export default {
         data() {
             return {
-                thisTab: '预约课程',
-                shopNum: 0,
-                recordNum: 0,
-                Dannum: 0,
-                GetHotelCounts: 0,
-                GetDetectorNum: 0,
-                currShopId: 0,
-                list: [],
-            }
-        },
-        mounted() {
-            this.getManagerSelfQuery();
-            // this.alertInfo(document.body.clientWidth)
-            // navigator.geolocation.getCurrentPosition(function (position) {
-            //   console.log(position.coords.longitude);
-            // },function (err) {
-            //     console.log(err);
-            // })
-        },
-        destroyed() {
-        },
-        watch: {
-            $route(to) {
-                if (to.name == 'main') {
-                    this.getList();
-                }
-            },
-            'active'() {
-                this.getList();
+                dataLabels: [],
+                datadatasets: [],
             }
         },
-        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();
-                }
-            });
-        },
         components: {
-            bottomTab, alert
+            LineExample
         }
     }
 </script>
 
 <style scoped>
-    #mainPage {
-        width: 100%;
-        height: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        background: #f2f2f2;
-        overflow-y: scroll;
-    }
-
-    #mainPage .banner {
-        width: 100%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-    }
-
-    .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;
-        padding-top: 6px;
-        text-align: center;
-    }
-
-    .list {
-        width: 98%;
-        overflow: hidden;
-        display: block;
-        margin: 0 auto;
-        padding-left: 1%;
-        padding-right: 1%;
-        margin-top: 10px;
-        padding-bottom: 40px;
-    }
-
-    .list li {
-        width: 100%;
-        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 {
-        height: 100%;
-        float: left;
-    }
-    .list .lt {
-        width: 33%;
-        height: 100%;
-        overflow: hidden;
-        float: left;
-    }
-
-    .list .rt {
-        /*width: 65%;*/
-        float: left;
-        padding-left: 15px;
-    }
-
-    .list .rt h5 {
-        font-family: "PingFang SC";
-        font-weight: normal;
-        font-size: 16px;
-        text-align: left;
-        color: #3b3b3b;
-        margin: 0;
-        margin-top: 3px;
-        margin-bottom: 0px;
-    }
-
-    .list .rt h4 {
-        width: auto;
-        font-family: "PingFang SC";
-        font-weight: normal;
-        font-size: 16px;
-        float: left;
-        padding-left: 12px;
-        padding-right: 12px;
-        margin-top: 12px;
-        margin-bottom: 12px;
-        border-radius: 250px;
-        color: #fff;
-        text-align: center;
-    }
-
-    .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: 320px) {
-        .list .rt {
-            width: 50%;
-        }
-
-        .list .rt em {
-            font-size: 14px;
-        }
-    }
-
-    @media (min-width: 321px) and (max-width: 344px) {
-        .list .rt {
-            width: 50%;
-        }
-
-        .list .rt em {
-            font-size: 14px;
-        }
-    }
-
-    @media (min-width: 345px) and (max-width: 360px) {
-        .list .rt {
-            width: 57%;
-        }
-    }
-
-    @media (min-width: 361px) and (max-width: 375px) {
-        .list .rt {
-            width: 60%;
-            /*background-color: red;*/
-        }
-    }
-
-    @media (min-width: 376px) and (max-width: 396px) {
-        .list .rt {
-            width: 61%;
-        }
-    }
-
-    @media (min-width: 397px) and (max-width: 414px) {
-        .list .rt {
-            width: 61%;
-        }
-    }
-
-    @media (min-width: 415px) and (max-width: 480px) {
-        .list .rt {
-            width: 61%;
-        }
-    }
-
-    @media (min-width: 481px) and (max-width: 640px) {
-
-    }
 
 </style>

online/src/page/mainpage2.vue

@@ -0,0 +1,407 @@
+<template>
+    <div id="mainPage">
+        <img class="banner" src="../static/images/main/banner.png"/>
+        <span class="shopNum">
+            俱乐部场馆共 {{ list.length }} 处
+        </span>
+        <ul class="list">
+            <li v-for="l in list" @click="goAppoint(l)" v-if="parseInt(l.Status) == 1">
+                <div class="lt">
+                    <img src="../static/images/main/shop2.jpg" width="100%" height="100%" v-show="parseInt(l.ShopID) == 3"/>
+                    <img src="../static/images/main/shop.jpg" width="100%" height="100%" v-show="parseInt(l.ShopID) == 4"/>
+                    <img src="../static/images/main/shop3.png" width="100%" height="100%" v-show="parseInt(l.ShopID) == 5"/>
+                </div>
+                <div class="rt">
+                    <h4 style="background-color: #FFA310" v-if="l.ShopID == 3">{{ l.ShopName.substr(5,12) }}</h4>
+                    <h4 style="background-color: #37CB00" v-if="l.ShopID == 4">{{ l.ShopName.substr(5,12) }}</h4>
+                    <h4 style="background-color: #028FE1" v-if="l.ShopID == 5">{{ l.ShopName.substr(5,12) }}</h4>
+                    <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>
+        <alert ref="alertPart"></alert>
+    </div>
+</template>
+
+<script>
+    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();
+            // this.alertInfo(document.body.clientWidth)
+            // navigator.geolocation.getCurrentPosition(function (position) {
+            //   console.log(position.coords.longitude);
+            // },function (err) {
+            //     console.log(err);
+            // })
+        },
+        destroyed() {
+        },
+        watch: {
+            $route(to) {
+                if (to.name == 'main') {
+                    this.getList();
+                }
+            },
+            'active'() {
+                this.getList();
+            }
+        },
+        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();
+                }
+            });
+        },
+        components: {
+            bottomTab, alert
+        }
+    }
+</script>
+
+<style scoped>
+    #mainPage {
+        width: 100%;
+        height: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        background: #f2f2f2;
+        overflow-y: scroll;
+    }
+
+    #mainPage .banner {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+    }
+
+    .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;
+        padding-top: 6px;
+        text-align: center;
+    }
+
+    .list {
+        width: 98%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        padding-left: 1%;
+        padding-right: 1%;
+        margin-top: 10px;
+        padding-bottom: 40px;
+    }
+
+    .list li {
+        width: 100%;
+        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 {
+        height: 100%;
+        float: left;
+    }
+    .list .lt {
+        width: 33%;
+        height: 100%;
+        overflow: hidden;
+        float: left;
+    }
+
+    .list .rt {
+        /*width: 65%;*/
+        float: left;
+        padding-left: 15px;
+    }
+
+    .list .rt h5 {
+        font-family: "PingFang SC";
+        font-weight: normal;
+        font-size: 16px;
+        text-align: left;
+        color: #3b3b3b;
+        margin: 0;
+        margin-top: 3px;
+        margin-bottom: 0px;
+    }
+
+    .list .rt h4 {
+        width: auto;
+        font-family: "PingFang SC";
+        font-weight: normal;
+        font-size: 16px;
+        float: left;
+        padding-left: 12px;
+        padding-right: 12px;
+        margin-top: 12px;
+        margin-bottom: 12px;
+        border-radius: 250px;
+        color: #fff;
+        text-align: center;
+    }
+
+    .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: 320px) {
+        .list .rt {
+            width: 50%;
+        }
+
+        .list .rt em {
+            font-size: 14px;
+        }
+    }
+
+    @media (min-width: 321px) and (max-width: 344px) {
+        .list .rt {
+            width: 50%;
+        }
+
+        .list .rt em {
+            font-size: 14px;
+        }
+    }
+
+    @media (min-width: 345px) and (max-width: 360px) {
+        .list .rt {
+            width: 57%;
+        }
+    }
+
+    @media (min-width: 361px) and (max-width: 375px) {
+        .list .rt {
+            width: 60%;
+            /*background-color: red;*/
+        }
+    }
+
+    @media (min-width: 376px) and (max-width: 396px) {
+        .list .rt {
+            width: 61%;
+        }
+    }
+
+    @media (min-width: 397px) and (max-width: 414px) {
+        .list .rt {
+            width: 61%;
+        }
+    }
+
+    @media (min-width: 415px) and (max-width: 480px) {
+        .list .rt {
+            width: 61%;
+        }
+    }
+
+    @media (min-width: 481px) and (max-width: 640px) {
+
+    }
+
+</style>

online/src/router/index.js

@@ -115,8 +115,8 @@ router.beforeEach((to,from,next)=>{
         next();
     }else{
         //如果token存在，就正常跳转，如果不存在，则说明未登陆，则跳转到'login'
-        isLogin? next() : next("/login");
-        // next();
+        // isLogin? next() : next("/login");
+        next();
     }
 });