From 9382eab44c3be56e5517dad86cfd26257ea03a98 Mon Sep 17 00:00:00 2001
From: XT-202209211744\Administrator <623844246@qq.com>
Date: Wed, 02 Nov 2022 22:41:36 +0800
Subject: [PATCH] 最新
---
src/assets/css/style.css | 44 +++++++++++
src/main.js | 1
src/App.vue | 29 ++++---
src/router/index.js | 163 ++++++++++++++++++++++++++--------------
4 files changed, 167 insertions(+), 70 deletions(-)
diff --git a/src/App.vue b/src/App.vue
index 51d7db5..565493a 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -13,12 +13,7 @@
</div>
<div class="body-box">
<transition
- :duration="1000"
- mode="out-in"
- appear
- enter-active-class="animated fadeInRight"
- leave-active-class="animated fadeOut"
- appear-active-class="animated zoomInDown"
+ :name="transitionName"
>
<router-view></router-view>
</transition>
@@ -46,19 +41,26 @@
// this.$store.state.className = window.localStorage.getItem('styleName')?window.localStorage.getItem('styleName'):'red'
},
watch: {
- $route(val) {
- let title = val.meta.title || "首页";
+ $route(to, from) {
+ let title = to.meta.title || "首页";
this.title = title;
-
- if (val.meta.iconRight) {
- this.iconRight = val.meta.iconRight;
+ if (to.meta.iconRight) {
+ this.iconRight = to.meta.iconRight;
} else {
this.iconRight = "default";
}
- if (val.meta.hasHeader) {
+ if (to.meta.hasHeader) {
this.hasHeader = true;
} else {
this.hasHeader = false;
+ }
+ if (to.meta.index > from.meta.index) {
+ console.log("slide-left");
+ //设置动画名称
+ this.transitionName = "slide-left";
+ } else {
+ console.log("slide-right");
+ this.transitionName = "slide-right";
}
}
},
@@ -66,7 +68,8 @@
return {
title: "首页",
hasHeader: false,
- iconRight: "default"
+ iconRight: "default",
+ transitionName: ''
};
}
};
diff --git a/src/assets/css/style.css b/src/assets/css/style.css
new file mode 100644
index 0000000..df1d29e
--- /dev/null
+++ b/src/assets/css/style.css
@@ -0,0 +1,44 @@
+.slide-right-enter-active,
+.slide-right-leave-active,
+.slide-left-enter-active,
+.slide-left-leave-active {
+ width: 100vw;
+ will-change: transform;
+ transition: all 500ms;
+ position: absolute;
+}
+
+.slide-right-enter {
+ opacity: 0;
+ transform: translate3d(-100%, 0, 0);
+}
+
+.slide-right-leave-active {
+ opacity: 0;
+ transform: translate3d(100%, 0, 0);
+}
+
+.slide-left-enter {
+ opacity: 0;
+ transform: translate3d(100%, 0, 0);
+}
+
+.slide-left-leave-active {
+ opacity: 0;
+ transform: translate3d(-100%, 0, 0);
+}
+.direction-enter,
+.direction-leave-to {
+ transform: translate3d(100%, 0, 0);
+}
+
+.direction-view {
+ position: absolute;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ width: 100vw;
+ z-index: 100;
+ overflow: hidden;
+ transition: transform 0.3s;
+}
\ No newline at end of file
diff --git a/src/main.js b/src/main.js
index 6fdac9a..38e4f53 100644
--- a/src/main.js
+++ b/src/main.js
@@ -12,6 +12,7 @@
import Vant from 'vant';
import 'vant/lib/index.css';
import { Swipe, SwipeItem, Skeleton } from 'vant';
+import './assets/css/style.css';
diff --git a/src/router/index.js b/src/router/index.js
index 958a76f..58eb37d 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -48,7 +48,7 @@
Vue.use(Router)
const routerPush = Router.prototype.push
-Router.prototype.push = function push (location) {
+Router.prototype.push = function push(location) {
return routerPush.call(this, location).catch(error => error)
}
@@ -62,7 +62,8 @@
name: 'home',
meta: {
title: '首页',
- requireAuth: true
+ requireAuth: true,
+ index: 0
},
component: Home
}, {
@@ -71,7 +72,8 @@
meta: {
title: '购买',
requireAuth: true,
- hasHeader: true
+ hasHeader: true,
+ index: 1
},
component: Buy
}, {
@@ -80,7 +82,8 @@
meta: {
title: 'new',
requireAuth: false,
- hasHeader: false
+ hasHeader: false,
+ index: 2
},
component: NewPage
},
@@ -88,14 +91,16 @@
path: '/register',
name: 'register',
meta: {
- title: '注册'
+ title: '注册',
+ index: 3
},
component: Register
}, {
path: '/forget',
name: 'forget',
meta: {
- title: '忘记密码'
+ title: '忘记密码',
+ index: 4
},
component: Forget
}, {
@@ -103,7 +108,8 @@
name: 'login',
meta: {
title: '账户登录',
- hasHeader: true
+ hasHeader: true,
+ index: 5
},
component: Login
}, {
@@ -111,7 +117,8 @@
name: 'openaccount',
meta: {
title: '开户',
- hasHeader: true
+ hasHeader: true,
+ index: 6
},
component: OpenAccount
}, {
@@ -120,14 +127,16 @@
meta: {
title: '行情',
requireAuth: false,
- hasHeader: false
+ hasHeader: false,
+ index: 7
},
component: List
}, {
path: '/indexsearchlist',
name: '指数查询',
meta: {
- title: '指数查询'
+ title: '指数查询',
+ index: 8
},
component: IndexSearchlist
}, {
@@ -135,14 +144,16 @@
name: 'indexlist',
meta: {
title: '指数列表',
- requireAuth: false
+ requireAuth: false,
+ index: 9
},
component: IndexList
}, {
path: '/searchlist',
name: '个股查询',
meta: {
- title: '个股查询'
+ title: '个股查询',
+ index: 10
},
component: Searchlist
}, {
@@ -150,7 +161,8 @@
name: 'searchmylist',
meta: {
title: '自选查询',
- requireAuth: true
+ requireAuth: true,
+ index: 11
},
component: SearchMylist
}, {
@@ -159,7 +171,8 @@
meta: {
title: '自选列表',
requireAuth: true,
- hasHeader: true
+ hasHeader: true,
+ index: 12
},
component: MyList
@@ -169,7 +182,8 @@
meta: {
title: '详情',
requireAuth: false,
- hasHeader: true
+ hasHeader: true,
+ index: 13
},
component: ListDetail
}, {
@@ -178,7 +192,8 @@
meta: {
title: '详情',
requireAuth: false,
- hasHeader: true
+ hasHeader: true,
+ index: 14
},
component: ListDetail2
},
@@ -189,7 +204,8 @@
title: '指数购买',
requireAuth: false,
hasHeader: true,
- iconRight:'search'
+ iconRight: 'search',
+ index: 15
},
component: indexBuy
},
@@ -200,7 +216,8 @@
title: '两融交易',
requireAuth: false,
hasHeader: true,
- iconRight:'search'
+ iconRight: 'search',
+ index: 16
},
component: TwoBuy
},
@@ -211,7 +228,8 @@
title: '分仓交易',
requireAuth: false,
hasHeader: true,
- iconRight:'search'
+ iconRight: 'search',
+ index: 17
},
component: SubWarehouseBuy
}, {
@@ -221,6 +239,7 @@
title: '期货购买',
requireAuth: false,
hasHeader: true,
+ index: 18
},
component: futuresBuy
}, {
@@ -228,7 +247,8 @@
name: 'inquiry',
meta: {
title: '询价',
- requireAuth: true
+ requireAuth: true,
+ index: 19
},
component: Inquiry
}, {
@@ -237,16 +257,18 @@
meta: {
title: '我的',
requireAuth: false,
- hasHeader: true
+ hasHeader: true,
+ index: 20
},
component: User
},
- {
+ {
path: '/transfer',
name: 'transfer',
meta: {
title: '资金互转',
- requireAuth: true
+ requireAuth: true,
+ index: 21
},
component: Transfer
}, {
@@ -256,6 +278,7 @@
title: '持仓',
requireAuth: false,
hasHeader: true,
+ index: 22
},
component: OrderList
},
@@ -265,7 +288,8 @@
meta: {
title: '查询持仓',
requireAuth: true,
- hasHeader:true
+ hasHeader: true,
+ index: 23
},
component: holdOrderList
}, {
@@ -274,7 +298,8 @@
meta: {
title: '查询持仓',
requireAuth: true,
- hasHeader:true
+ hasHeader: true,
+ index: 24
},
component: holdOrderList2
}, {
@@ -283,7 +308,8 @@
meta: {
title: '查询平仓',
requireAuth: true,
- hasHeader: true
+ hasHeader: true,
+ index: 25
},
component: sellOrderList
}, {
@@ -292,7 +318,8 @@
meta: {
title: '查询平仓',
requireAuth: true,
- hasHeader: true
+ hasHeader: true,
+ index: 26
},
component: sellOrderList2
}, {
@@ -301,7 +328,8 @@
meta: {
title: '资金明细',
requireAuth: true,
- hasHeader: true
+ hasHeader: true,
+ index: 27
},
component: Detail
}, {
@@ -310,7 +338,8 @@
meta: {
title: '银行卡',
requireAuth: true,
- hasHeader: true
+ hasHeader: true,
+ index: 28
},
component: Card
}, {
@@ -319,7 +348,8 @@
meta: {
title: '认证',
requireAuth: true,
- hasHeader: true
+ hasHeader: true,
+ index: 29
},
component: Authentication
}, {
@@ -327,7 +357,8 @@
name: 'aggre',
meta: {
title: '合作协议',
- requireAuth: true
+ requireAuth: true,
+ index: 30
},
component: Aggre
}, {
@@ -336,7 +367,8 @@
meta: {
title: '充值',
requireAuth: true,
- hasHeader: true
+ hasHeader: true,
+ index: 31
},
component: Recharge
@@ -346,7 +378,8 @@
meta: {
title: '确认充值',
requireAuth: true,
- hasHeader: true
+ hasHeader: true,
+ index: 32
},
component: RechargeSure
@@ -356,7 +389,8 @@
meta: {
title: '充值记录',
requireAuth: true,
- hasHeader: true
+ hasHeader: true,
+ index: 33
},
component: RechargeList
}, {
@@ -365,7 +399,8 @@
meta: {
title: '提现',
requireAuth: true,
- hasHeader:true
+ hasHeader: true,
+ index: 34
},
component: Cash
}, {
@@ -374,7 +409,8 @@
meta: {
title: '添加银行卡',
requireAuth: true,
- hasHeader:true
+ hasHeader: true,
+ index: 35
},
component: AddCard
@@ -384,7 +420,8 @@
meta: {
title: '提现记录',
requireAuth: true,
- hasHeader:true
+ hasHeader: true,
+ index: 36
},
component: Cashlist
@@ -393,7 +430,8 @@
name: 'setting',
meta: {
title: '设置',
- requireAuth: true
+ requireAuth: true,
+ index: 37
},
component: Setting
}, {
@@ -401,7 +439,8 @@
name: 'agree',
meta: {
title: '注册协议',
- requireAuth: true
+ requireAuth: true,
+ index: 38
},
component: Agree
}, {
@@ -409,7 +448,8 @@
name: 'trade',
meta: {
title: '交易⻛险揭示书',
- requireAuth: true
+ requireAuth: true,
+ index: 39
},
component: Trage
},
@@ -418,40 +458,44 @@
name: 'alertdetail',
meta: {
title: '公告详情',
- requireAuth: true
+ requireAuth: true,
+ index: 40
},
component: Alertdetail
},
{
path: '/funds',
- name:'funds',
+ name: 'funds',
meta: {
title: '配资主页',
requireAuth: true,
hasHeader: true,
- iconRight: 'setting'
+ iconRight: 'setting',
+ index: 41
},
component: () => import('../page/funds/index')
},
{
path: '/days',
- name:'days',
+ name: 'days',
meta: {
title: '按天配资',
requireAuth: true,
hasHeader: true,
- iconRight: 'setting'
+ iconRight: 'setting',
+ index: 42
},
component: () => import('../page/funds/days')
},
{
path: '/xingu',
- name:'xingu',
+ name: 'xingu',
meta: {
title: '新股申购',
requireAuth: true,
hasHeader: true,
- iconRight: 'setting'
+ iconRight: 'setting',
+ index: 43
},
component: () => import('../page/funds/xingu')
},
@@ -462,6 +506,7 @@
title: '查询股票',
requireAuth: true,
hasHeader: true,
+ index: 44
},
component: () => import('../page/list/search')
},
@@ -472,6 +517,7 @@
title: '消息记录',
requireAuth: true,
hasHeader: true,
+ index: 45
},
component: () => import('../page/user/notify')
}, {
@@ -481,29 +527,32 @@
title: '分仓配资',
requireAuth: false,
hasHeader: true,
+ index: 46,
},
component: FundsList
},
- {
+ {
path: '/newLogin',
name: 'newLogin',
meta: {
title: '新登录',
requireAuth: false,
hasHeader: true,
+ index: 47
},
component: newLogin
},
{
- path: '/newRegister',
- name: 'newRegister',
- meta: {
- title: '新注册',
- requireAuth: false,
- hasHeader: false,
- },
- component: newRegister
- },
+ path: '/newRegister',
+ name: 'newRegister',
+ meta: {
+ title: '新注册',
+ requireAuth: false,
+ hasHeader: false,
+ index: 48
+ },
+ component: newRegister
+ },
{
// 会匹配所有路径
path: '*',
--
Gitblit v1.9.3