github/dootask
1
0
Fork 0
mirror of https://github.com/kuaifan/dootask.git synced 2026-01-13 01:28:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

调整路由

Browse Source
This commit is contained in:
kuaifan 2022-05-29 18:38:31 +08:00
parent 461546e914
commit c0ca50edf6
8 changed files with 76 additions and 149 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

151
resources/assets/js/App.vue
View File

@ -1,10 +1,8 @@
<template>
<div id="app">
<transition :name="transitionName">
<keep-alive>
<router-view class="child-view" :class="{'view-768': $store.state.windowMax768}"></router-view>
</keep-alive>
</transition>
<keep-alive>
<router-view class="child-view" :class="{'view-768': $store.state.windowMax768}"></router-view>
</keep-alive>
<Spinner/>
<RightBottom/>
<NetworkException/>
@ -14,22 +12,31 @@
</div>
</template>
<style lang="scss" scoped>
.child-view {
position: absolute;
width: 100%;
min-height: 100%;
transition: all .3s cubic-bezier(.55, 0, .1, 1);
}
</style>
<script>
import Spinner from "./components/Spinner";
import RightBottom from "./components/RightBottom";
import PreviewImageState from "./components/PreviewImage/state";
import {mapState} from "vuex";
import NetworkException from "./components/NetworkException";
import AudioManager from "./components/AudioManager";
import {mapState} from "vuex";
export default {
components: {AudioManager, NetworkException, PreviewImageState, RightBottom, Spinner},
data() {
return {
routePath: this.$route.path,
transitionName: null,
manifestUrl: null
routePath: null,
manifestUrl: null,
inter: null,
}
},
@ -39,19 +46,13 @@ export default {
},
mounted() {
this.sessionStorage('/', 1);
let pathname = window.location.pathname;
if (pathname && this.sessionStorage(pathname) === 0) {
this.sessionStorage(pathname, this.sessionStorage('::count') + 1);
}
//
setInterval(this.searchEnter, 1000);
//
this.inter = setInterval(this.searchEnter, 1000);
window.addEventListener('resize', this.windowSizeListener);
window.addEventListener('scroll', this.windowScrollListener);
},
beforeDestroy() {
this.inter && clearInterval(this.inter);
window.removeEventListener('resize', this.windowSizeListener);
window.removeEventListener('scroll', this.windowScrollListener);
},
@ -61,21 +62,16 @@ export default {
},
watch: {
'$route'(To, From) {
this.routePath = To.path;
if (this.transitionName === null) {
this.transitionName = 'app-slide-no';
return;
}
if (typeof To.name === 'undefined' || typeof From.name === 'undefined') {
return;
}
this.slideType(To, From);
'$route': {
handler(to) {
this.routePath = to.path
},
immediate: true,
},
routePath: {
handler(path) {
if (this.userId > 0) {
if (path && this.userId > 0) {
path = path.replace(/^\/manage\/file\/\d+\/(\d+)$/, "/single/file/$1")
this.$store.dispatch("websocketPath", path)
}
@ -123,72 +119,6 @@ export default {
},
methods: {
slideType(To, From) {
let isBack = this.$router.isBack;
this.$router.isBack = false;
//
let ToIndex = this.sessionStorage(To.path);
let FromIndex = this.sessionStorage(From.path);
if (ToIndex && ToIndex < FromIndex) {
isBack = true; //后退
this.sessionStorage(true, ToIndex);
} else {
isBack = false; //前进
this.sessionStorage(To.path, this.sessionStorage('::count') + 1);
}
//
if (To.meta.slide === false || From.meta.slide === false) {
//取消动画
this.transitionName = 'app-slide-no'
} else if (To.meta.slide === 'up' || From.meta.slide === 'up' || To.meta.slide === 'down' || From.meta.slide === 'down') {
//上下动画
if (isBack) {
this.transitionName = 'app-slide-down'
} else {
this.transitionName = 'app-slide-up'
}
} else {
//左右动画（默认）
if (isBack) {
this.transitionName = 'app-slide-right'
} else {
this.transitionName = 'app-slide-left'
}
}
},
sessionStorage(path, num) {
let conut = 0;
let history = JSON.parse(window.sessionStorage['__history__'] || '{}');
if (path === true) {
let items = {};
for (let i in history) {
if (history.hasOwnProperty(i)) {
if (parseInt(history[i]) <= num) {
items[i] = history[i];
conut++;
}
}
}
history = items;
history['::count'] = Math.max(num, conut);
window.sessionStorage['__history__'] = JSON.stringify(history);
return history;
}
if (typeof num === 'undefined') {
return parseInt(history[path] || 0);
}
if (path === "/") num = 1;
history[path] = num;
for (let key in history) {
if (history.hasOwnProperty(key) && key !== '::count') {
conut++;
}
}
history['::count'] = Math.max(num, conut);
window.sessionStorage['__history__'] = JSON.stringify(history);
},
searchEnter() {
let row = $A(".sreachBox");
if (row.length === 0) {
@ -284,36 +214,3 @@ export default {
}
}
</script>
<style lang="scss" scoped>
.child-view {
position: absolute;
width: 100%;
min-height: 100%;
transition: all .3s cubic-bezier(.55, 0, .1, 1);
}
.app-slide-no-leave-to {display: none;}
/**
* 左右模式
*/
.app-slide-left-leave-active{z-index:1;transform:translate(0,0)}
.app-slide-left-leave-to{z-index:1;transform:translate(0,0)}
.app-slide-left-enter-active{opacity:0;z-index:2;transform:translate(30%,0)}
.app-slide-left-enter-to{opacity:1;z-index:2;transform:translate(0,0)}
.app-slide-right-leave-active{opacity:1;z-index:2;transform:translate(0,0)}
.app-slide-right-leave-to{opacity:0;z-index:2;transform:translate(30%,0)}
.app-slide-right-enter-active{z-index:1;transform:translate(0,0)}
.app-slide-right-enter{z-index:1;transform:translate(0,0)}
/**
* 上下模式
*/
.app-slide-up-leave-active{z-index:1;transform:translate(0,0)}
.app-slide-up-leave-to{z-index:1;transform:translate(0,0)}
.app-slide-up-enter-active{opacity:0;z-index:2;transform:translate(0,20%)}
.app-slide-up-enter-to{opacity:1;z-index:2;transform:translate(0,0)}
.app-slide-down-leave-active{opacity:1;z-index:2;transform:translate(0,0)}
.app-slide-down-leave-to{opacity:0;z-index:2;transform:translate(0,20%)}
.app-slide-down-enter-active{z-index:1;transform:translate(0,0)}
.app-slide-down-enter{z-index:1;transform:translate(0,0)}
</style>

37
resources/assets/js/app.js vendored
View File

@ -92,23 +92,40 @@ if (!isElectron && !isEEUiApp) {
});
}
// 加载函数
// 加载路由
Vue.prototype.goForward = function(location, isReplace) {
if (typeof location === 'string') location = {name: location};
if (typeof location === 'string') {
location = {name: location};
}
if (app.$store.state.routeHistorys.length === 0) {
app.$store.state.routeHistorys.push(app.$route)
}
if (isReplace === true) {
app.$router.replace(location).then(() => {}).catch(() => {});
app.$router.replace(location).then(to => {
app.$store.state.routeHistorys.pop();
app.$store.state.routeHistorys.push(to);
}).catch(_ => {});
} else {
app.$router.push(location).then(() => {}).catch(() => {});
app.$router.push(location).then(to => {
const length = app.$store.state.routeHistorys.push(to)
length > 120 && app.$store.state.routeHistorys.splice(length - 100)
app.$store.state.routeHistoryLast = length >= 2 ? app.$store.state.routeHistorys[length - 2] : {};
}).catch(_ => {});
}
};
// 返回函数
Vue.prototype.goBack = function (number) {
let history = $A.jsonParse(window.sessionStorage['__history__'] || '{}');
if ($A.runNum(history['::count']) > 2) {
app.$router.go(typeof number === 'number' ? number : -1);
// 返回路由
Vue.prototype.goBack = function () {
if (app.$store.state.routeHistorys.length > 1) {
app.$router.back();
//
app.$store.state.routeHistorys.pop();
const length = app.$store.state.routeHistorys.length;
app.$store.state.routeHistoryLast = length >= 2 ? app.$store.state.routeHistorys[length - 2] : {};
} else {
app.$router.replace(typeof number === "object" ? number : {path: '/'}).catch(_ => {});
app.$router.replace({path: '/'}).catch(_ => {});
app.$store.state.routeHistorys = [];
app.$store.state.routeHistoryLast = {};
}
};

1
resources/assets/js/pages/manage/components/ChatInput/index.vue
View File

@ -519,7 +519,6 @@ export default {
// Clipboard Matcher (保留图片跟空格，清除其余所以样式)
this.quill.clipboard.addMatcher(Node.ELEMENT_NODE, (node, delta) => {
delta.ops = delta.ops.map(op => {
console.log(op);
const obj = {
attributes: {},
insert: op.insert

11
resources/assets/js/pages/manage/components/DialogWrapper.vue
View File

@ -8,7 +8,7 @@
@dragleave.prevent="chatDragOver(false, $event)">
<slot name="head">
<div class="dialog-nav" :class="{completed:$A.dialogCompleted(dialogData)}">
<div class="dialog-back" @click="goBack">
<div class="dialog-back" @click="onBack">
<i class="taskfont">&#xe72d;</i>
<div v-if="msgUnreadOnly" class="back-num">{{msgUnreadOnly}}</div>
</div>
@ -698,6 +698,15 @@ export default {
this.msgNew = 0;
}
}, 100)
},
onBack() {
const {name, params} = this.$store.state.routeHistoryLast;
if (name === this.$route.name && /\d+/.test(params.dialogId)) {
this.goForward({name: this.$route.name});
} else {
this.goBack();
}
}
}
}

11
resources/assets/js/pages/manage/components/ProjectPanel.vue
View File

@ -3,7 +3,7 @@
<PageTitle :title="projectData.name"/>
<div class="project-titbox">
<div class="project-title">
<div class="project-back" @click="goBack">
<div class="project-back" @click="onBack">
<i class="taskfont">&#xe72d;</i>
</div>
<h1>{{projectData.name}}</h1>
@ -1438,6 +1438,15 @@ export default {
}
}
this.$store.dispatch('toggleProjectParameter', data);
},
onBack() {
const {name, params} = this.$store.state.routeHistoryLast;
if (name === this.$route.name && /\d+/.test(params.projectId)) {
this.goForward({name: this.$route.name, params: {projectId: 'all'}});
} else {
this.goBack();
}
}
}
}

6
resources/assets/js/pages/manage/project.vue
View File

@ -4,7 +4,7 @@
<ProjectPanel/>
<ProjectDialog v-if="projectData.cacheParameter.chat"/>
</template>
<ProjectList v-else-if="routeName === 'manage-project'"/>
<ProjectList v-if="!$isDesktop" v-show="projectId === 0"/>
</div>
</template>
@ -24,10 +24,6 @@ export default {
...mapState(['cacheProjects', 'wsOpenNum']),
...mapGetters(['projectData']),
routeName() {
return this.$route.name
},
projectId() {
const {projectId} = this.$route.params;
return parseInt(/^\d+$/.test(projectId) ? projectId : 0);

4
resources/assets/js/routes.js vendored
View File

@ -7,9 +7,6 @@ export default [
{
name: 'manage',
path: '/manage',
meta: {
slide: false
},
component: () => import('./pages/manage.vue'),
children: [
{
@ -94,7 +91,6 @@ export default [
{
name: 'valid-email',
path: '/single/valid/email',
meta: {title: '验证绑定邮箱'},
component: () => import('./pages/single/validEmail.vue')
},
{

4
resources/assets/js/store/state.js vendored
View File

@ -7,6 +7,10 @@ const stateData = {
// 浏览器宽度≤768返回true
windowMax768: window.innerWidth <= 768,
// 路由记录
routeHistorys: [],
routeHistoryLast: {},
// 加载状态
loadDashboardTasks: false,
loadUserBasic: false,