1

admin/src/permission.js

@@ -8,9 +8,9 @@ import getPageTitle from '@/utils/get-page-title'
 
 NProgress.configure({ showSpinner: false }) // NProgress Configuration
 
-const whiteList = ['/login', '/auth-redirect'] // no redirect whitelist
+const whiteList = ['/login', '/auth-redirect', '/home', '/line_on_sale'] // no redirect whitelist
 
-router.beforeEach(async(to, from, next) => {
+router.beforeEach(async (to, from, next) => {
   // start progress bar
   NProgress.start()
 
@@ -49,7 +49,8 @@ router.beforeEach(async(to, from, next) => {
           // remove token and go to login page to re-login
           await store.dispatch('user/resetToken')
           Message.error(error || 'Has Error')
-          next(`/login?redirect=${to.path}`)
+          // next(`/login?redirect=${to.path}`)
+          next(`/home?redirect=${to.path}`)
           NProgress.done()
         }
       }
@@ -62,7 +63,8 @@ router.beforeEach(async(to, from, next) => {
       next()
     } else {
       // other pages that do not have permission to access are redirected to the login page.
-      next(`/login?redirect=${to.path}`)
+      // next(`/login?redirect=${to.path}`)
+      next(`/home?redirect=${to.path}`)
       NProgress.done()
     }
   }

admin/src/router/index.js

@@ -28,6 +28,16 @@ export const constantRoutes = [
     component: () => import('@/views/login/index'),
     hidden: true
   },
+  {
+    path: '/home',
+    component: () => import('@/views/home/index'),
+    hidden: true
+  },
+  {
+    path: '/line_on_sale',
+    component: () => import('@/views/home/line_on_sale'),
+    hidden: true
+  },
   {
     path: '/auth-redirect',
     component: () => import('@/views/login/auth-redirect'),
@@ -280,7 +290,7 @@ export const asyncRoutes = [
         }
       }
     ]
-  },{
+  }, {
     path: '/log',
     component: Layout,
     redirect: '/log/index',

admin/src/views/home/components/overflow_concealment.vue

@@ -0,0 +1,51 @@
+<template>
+    <p class="desc_conten" ref="desc_conten">{{ content }}<el-button @click="open(content)" class="desc_btn" v-show="isTruncated" type="primary">查看</el-button></p>
+</template>
+
+<script>
+export default {
+  name: 'home',
+  data() {
+    return {
+        isTruncated:false
+    }
+  },
+  props:{
+    content:{
+      type:String,
+      default:''
+    }
+  },
+  mounted() {
+    this.checkTruncation()
+    window.addEventListener('resize',this.checkTruncation)
+  },
+  destroyed() {
+    window.removeEventListener('resize',this.checkTruncation)
+  },
+  methods: {
+    open(val){
+            this.$alert(val, '内容', {
+            confirmButtonText: '确定',
+            // showConfirmButton:false
+            });
+        },
+        checkTruncation() {
+            this.isTruncated =  this.$refs['desc_conten'].offsetWidth<this.$refs['desc_conten'].scrollWidth
+        },
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.desc_conten{
+    white-space: nowrap;
+    overflow: hidden;
+    position: relative;
+    .desc_btn{
+        position: absolute;
+        right: 0;
+    }
+    // text-overflow: ellipsis;
+}
+</style>

admin/src/views/home/index.vue

@@ -0,0 +1,89 @@
+<template>
+    <div class="app-container">
+        <div class="title">新国旅内部管系统</div>
+        <div class="content">
+            <div class="content_box">
+                <div class="item" @click="$router.push('/login')">
+                    <img src="@/assets/home/verification.png" alt="">
+                    <p>订单核销系统</p>
+                </div>
+                <div class="item" @click="$router.push('/line_on_sale')">
+                    <img src="@/assets/home/route.png" alt="">
+                    <p>售卖中线路</p>
+                </div>
+                <div class="item">
+                    <img src="@/assets/home/visa.png" alt="">
+                    <p>签证系统</p>
+                </div>
+            </div>
+        </div>
+        <div class="bottom">新国旅 版权所有 粤ICP备 xsiks545454号 粤公网安备 xsiks545454号</div>
+    </div>
+  </template>
+  
+  <script>
+  export default {
+    name: 'home',
+    data() {
+      return {
+        driver: null
+      }
+    },
+    mounted() {
+      
+    },
+    methods: {
+
+    }
+  }
+  </script>
+  <style lang="scss" scoped>
+  .app-container{
+    background: url('~@/assets/home/bg.png') no-repeat;
+    background-size: 100% 100%;
+    height: 100%;
+}
+  .title {
+    font-size: 40px;
+    text-align: center;
+    margin-top: 80px;
+    color: #425B93;
+    font-weight: bold
+  }
+  .content_box{
+    display: flex;
+    justify-content: center;
+    margin-top: 128px;
+    .item{
+        background: #4D72D5;
+        border-radius: 20px;
+        padding: 50px 18px;
+        width: 260px;
+        cursor: pointer;
+        text-align: center;
+        & + .item {
+            margin-left: 114px;
+        }
+        img{
+            width: 80px;
+            height: 80px;
+        }
+        p{
+            color: #fff;
+            font-size: 30px;
+            font-weight: bold;
+            margin: 40px 0 0 0;
+            // margin-top: 40px;
+        }
+    }
+}
+.bottom{
+    text-align: center;
+    color: #425B93;
+    font-size: 14px;
+    position: fixed;
+    bottom: 56px;
+    left: 50%;
+    transform: translateX(-50%)
+}
+  </style>

admin/src/views/home/line_on_sale.vue

@@ -0,0 +1,169 @@
+<template>
+    <div class="lineOnSale">
+        <div class="lineOnSale_list">
+            <img src="@/assets/home/fff.png" alt="">
+            <div class="lineOnSale_centent">
+                <div class="lineOnSale_title">天上人间—马尔代夫7日自由行7天</div>
+                <div class="lineOnSale_price">
+                    <div class="desc">
+                        <p>行程天数：</p>
+                        <overflowConcealment :content="'天上人间—马尔代夫7日自尔代夫7日自由行7天天上人间—马尔代夫7夫7日自由日自由行7天'"></overflowConcealment>
+                    </div>
+                    <div class="desc">
+                        <p>购物店：</p>
+                        <overflowConcealment :content="'马尔代夫'"></overflowConcealment>
+                    </div>
+                </div>
+                <div class="lineOnSale_price">
+                    <div class="desc">
+                        <p>是否含大交通：</p>
+                        <overflowConcealment :content="'否'"></overflowConcealment>
+                    </div>
+                    <div class="desc">
+                        <p>可售卖平台：</p>
+                        <overflowConcealment :content="'否'"></overflowConcealment>
+                    </div>
+                </div>
+                <div class="lineOnSale_price">
+                    <div class="desc">
+                        <p>卖点：</p>
+                        <overflowConcealment :content="'誉为印度洋的珍珠'"></overflowConcealment>
+                    </div>
+                    <div class="desc">
+                        <p>佣金：</p>
+                        <overflowConcealment :content="'6521615'"></overflowConcealment>
+                    </div>
+                </div>
+                <div class="lineOnSale_price">
+                    <div class="desc">
+                        <p>赠送项目：</p>
+                        <overflowConcealment :content="'沙巴岛一日游'"></overflowConcealment>
+                    </div>
+                    <div class="desc">
+                        <p>卖价：</p>
+                        <overflowConcealment :content="'6546466'"></overflowConcealment>
+                    </div>
+                </div>
+            </div>
+            <div class="lineOnSale_right">
+                <div class="lineOnSale_btn">
+                    <el-button class="btn" type="primary">下载行程</el-button>
+                    <el-button class="btn" type="primary">下载话术</el-button>
+                    <el-button class="btn" type="primary">下载图片</el-button>
+                    <el-button class="btn" type="primary">下载视频</el-button>
+                </div>
+            </div>
+        </div>
+    </div>
+  </template>
+  
+  <script>
+  import overflowConcealment from './components/overflow_concealment'
+  export default {
+    name: 'lineOnSale',
+    data() {
+      return {
+        isTruncated:false
+      }
+    },
+    components: {
+        overflowConcealment
+    },
+    mounted() {
+
+    },
+    methods: {
+        handleDownload(url) {
+            if (url) {
+                window.open(url)
+            } else {
+                this.$message({
+                showClose: true,
+                message: '暂无下载链接'
+                })
+            }
+        }
+    }
+  }
+  </script>
+  <style lang="scss" scoped>
+  ::v-deep.el-button + .el-button{
+    margin: 0;
+}
+.desc_conten{
+    white-space: nowrap;
+    overflow: hidden;
+    position: relative;
+    .desc_btn{
+        position: absolute;
+        right: 0;
+    }
+    // text-overflow: ellipsis;
+}
+    .lineOnSale{
+        padding: 60px 30px;
+        margin: 0 100px;
+        .lineOnSale_list{
+            display: flex;
+            img{
+                width: 290px;
+                height: 290px;
+            }
+            .lineOnSale_centent{
+                margin-left: 50px;
+                .lineOnSale_title{
+                    font-size: 24px;
+                    color: #000000;
+                    line-height: 30px;
+                    font-weight: bold;
+                }
+                .lineOnSale_price{
+                    display: flex;
+                    margin-top: 5px;
+                    justify-content: space-around;
+                    .desc{
+                        ::v-deep.el-button--medium{
+                            padding: 6px 10px;
+                        }
+                    }
+                    div{
+                        width: 540px;
+                        & + div{
+                            margin-left: 40px;
+                        }
+                        p{
+                            font-size: 15px;
+                            color: #2E2E2E;
+                            line-height: 30px;
+                            margin: 0;
+                            font-weight: bold;
+                        }
+                        // p:nth-child(1){
+                        //     font-weight: bold;
+                        // }
+                        p:nth-child(2){
+                            font-size: 14px;
+                            color: rgba(0, 0, 0, 0.60);
+                        }
+                    }
+                }
+            }
+        }
+        .lineOnSale_right{
+            margin-left: 20px;
+            ::v-deep.el-button{
+                display: block;
+            }
+            display: flex;
+            align-items: center;
+            .btn{
+                width: 160px;
+                height: 36px;
+                font-weight: bold;
+                & + .btn{
+                    margin-top: 10px;
+                }
+            }
+        }
+    }
+  </style>

admin/vue.config.js

@@ -38,7 +38,7 @@ module.exports = {
     },
     proxy: {
       '/dev-api': { // 接口地址 以 api开头的都走下面的配置
-        target: 'http://127.0.0.1:8787', // 代理目标地址为后端服务器地址 127.0.0.1 192.168.1.2
+        target: 'http://192.168.1.8:8787', // 代理目标地址为后端服务器地址 127.0.0.1 192.168.1.2
         ws: true, // 是否支持 websocket 请求 支持
         changeOrigin: true, // 是否启用跨域
         pathRewrite: {