test-version22
/
MeterSphere
mirror of https://gitee.com/fit2cloud-feizhiyun/MeterSphere.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix(新手引导): 新建用户-新手引导弹窗触发问题处理

This commit is contained in:
lan-yonghui 2023-07-17 17:07:06 +08:00 committed by 刘瑞斌
parent ccee5e5882
commit 10d1be8de7
2 changed files with 170 additions and 158 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

174
framework/sdk-parent/frontend/src/components/guide/Guidance.vue
View File

@ -19,6 +19,7 @@
import MsIntroduction from "../../components/guide/components/Introduction";
import MsSideMenus from "../../components/sidemenu/SideMenus";
import {getSideTask} from "../../api/novice";
import {getCurrentProjectID} from "../../utils/token";
export default {
@ -31,7 +32,14 @@ export default {
mounted() {
this.$refs.introduction.resVisible = localStorage.getItem("introduction") && localStorage.getItem("introduction")
!== 'false' && (localStorage.getItem("guide") === 'true' || localStorage.getItem("step") > 1);
this.checkStep()
if (this.projectId !== 'null') {
this.checkStep()
}
},
computed: {
projectId() {
return getCurrentProjectID();
}
},
methods: {
handleCommand(command) {
@ -43,8 +51,12 @@ export default {
localStorage.setItem("resetGuide", 'true')
localStorage.setItem("guide", 'false')
localStorage.removeItem('step')
this.$router.push('/project/home')
this.$router.go(0);
if(this.$route.path.includes('project')){
this.$router.push('/project/home')
this.$router.go(0);
}else{
this.$router.push('/project/home')
}
break;
case "novice":
this.$refs.sideMenu.toggle(2);
@ -62,22 +74,171 @@ export default {
localStorage.setItem('guide',res.data[0].guideStep > 0 ? 'true' : 'false')
}
} else {
if(localStorage.getItem("guide") !== 'click'){
localStorage.removeItem('step')
}
localStorage.setItem('guide','false')
localStorage.removeItem('step')
}
let microApps = JSON.parse(sessionStorage.getItem("micro_apps"));
if(localStorage.getItem("guide") === 'false' && microApps && microApps['project']) {
let step = localStorage.getItem("step") && localStorage.getItem("resetGuide") !== 'true' ?
localStorage.getItem("step") : "1"
localStorage.getItem("step") : '1'
localStorage.setItem("step", step)
if(step !== '3'){
if(!this.$route.path.includes('/project/home')){
if(this.$route.path.includes('/project/home')){
this.initStepAll()
}else{
this.initStep()
}
}
}
})
},
initStepAll() {
const _this = this
_this.$nextTick(() => {
const tour = _this.$shepherd({
useModalOverlay: true,
exitOnEsc: false,
keyboardNavigation: false,
defaultStepOptions: {
scrollTo: {
behavior: 'smooth',
block: 'center'
},
canClickTarget: false,
// 高亮元素四周要填充的空白像素
modalOverlayOpeningPadding: 0,
// 空白像素的圆角
modalOverlayOpeningRadius: 4
}
})
tour.addSteps([
{
attachTo: {
element: document.querySelector('.shepherd-workspace'),
on: 'bottom-start'
},
buttons: [
{
action: function() {
_this.$refs.introduction.resVisible = true
return _this.gotoCancel(this, true)
},
classes: 'close-btn',
text: _this.$t("shepherd.exit")
},
{
action: function() {
return _this.gotoNext(this, null, 2)
},
classes: 'shep-btn',
text: _this.$t("shepherd.next")
}
],
title: _this.$t("shepherd.step1.title"),
text: _this.$t("shepherd.step1.text")
},
{
attachTo: {
element: document.querySelector('.shepherd-menu'),
on: 'right'
},
buttons: [
{
action: function() {
_this.$refs.introduction.resVisible = localStorage.getItem("step") > 1
return _this.gotoCancel(this, true)
},
classes: 'close-btn',
text: _this.$t("shepherd.exit")
},
{
action: function() {
return _this.gotoNext(this, '/project/home', 3)
},
classes: 'shep-btn',
text: _this.$t("shepherd.next")
}
],
title: _this.$t("shepherd.step2.title"),
text: _this.$t("shepherd.step2.text")
},
{
attachTo: {
element: document.querySelector('.shepherd-project'),
on: 'bottom-end'
},
classes: "custom-width",
buttons: [
{
action: function() {
_this.$refs.introduction.resVisible = localStorage.getItem("step") > 1
return _this.gotoCancel(this, true)
},
classes: 'close-btn',
text: _this.$t("shepherd.exit")
},
{
action: function() {
return _this.gotoNext(this, null, 4)
},
classes: 'shep-btn',
text: _this.$t("shepherd.next")
}
],
title: _this.$t("shepherd.step3.title"),
text: _this.$t("shepherd.step3.text")
},
{
attachTo: {
element: document.querySelector('.shepherd-project-menu'),
on: 'bottom-start'
},
buttons: [
{
action: function() {
_this.$refs.introduction.resVisible = localStorage.getItem("step") > 1
return _this.gotoCancel(this, true)
},
classes: 'close-btn',
text: _this.$t("shepherd.exit")
},
{
action: function() {
return _this.gotoNext(this, '/project/home', 5)
},
classes: 'shep-btn',
text: _this.$t("shepherd.next")
}
],
title: _this.$t("shepherd.step4.title"),
text: _this.$t("shepherd.step4.text")
},
{
arrow:true,
modalOverlayOpeningPadding: 8,
attachTo: {
element: document.querySelector('.shepherd-project-name'),
on: 'right'
},
buttons: [
{
action: function() {
_this.$refs.introduction.resVisible = localStorage.getItem("step") > 1
return _this.gotoCancel(this, false)
},
classes: 'close-btn',
text: _this.$t("shepherd.know")
}
],
title: _this.$t("shepherd.step5.title"),
text: _this.$t("shepherd.step5.text")
}
])
tour.start()
})
},
initStep() {
const _this = this
_this.$nextTick(() => {
@ -139,6 +300,7 @@ export default {
},
{
action: function() {
localStorage.setItem('guide','click')
return _this.gotoNext(this, '/project/home', 3)
},
classes: 'shep-btn',

154
project-management/frontend/src/business/home/ProjectHome.vue
View File

@ -170,13 +170,8 @@ export default {
},
mounted() {
this.$refs.introduction.resVisible = false
let microApps = JSON.parse(sessionStorage.getItem("micro_apps"));
if(localStorage.getItem("guide") === 'false' && microApps && microApps['project']) {
if(localStorage.getItem("step") === '3'){
this.initStep()
}else{
this.initStepAll()
}
if((localStorage.getItem("guide") === 'false' || localStorage.getItem("guide") === 'click') && localStorage.getItem("step") === '3') {
this.initStep()
}
},
methods: {
@ -192,151 +187,6 @@ export default {
edit() {
this.$refs.editProject.edit(this.project);
},
initStepAll() {
const _this = this
_this.$nextTick(() => {
const tour = _this.$shepherd({
useModalOverlay: true,
exitOnEsc: false,
keyboardNavigation: false,
defaultStepOptions: {
scrollTo: {
behavior: 'smooth',
block: 'center'
},
canClickTarget: false,
// 高亮元素四周要填充的空白像素
modalOverlayOpeningPadding: 0,
// 空白像素的圆角
modalOverlayOpeningRadius: 4
}
})
tour.addSteps([
{
attachTo: {
element: document.querySelector('.shepherd-workspace'),
on: 'bottom-start'
},
buttons: [
{
action: function() {
_this.$refs.introduction.resVisible = true
return _this.gotoCancel(this, true)
},
classes: 'close-btn',
text: _this.$t("shepherd.exit")
},
{
action: function() {
return _this.gotoNext(this, null, 2)
},
classes: 'shep-btn',
text: _this.$t("shepherd.next")
}
],
title: _this.$t("shepherd.step1.title"),
text: _this.$t("shepherd.step1.text")
},
{
attachTo: {
element: document.querySelector('.shepherd-menu'),
on: 'right'
},
buttons: [
{
action: function() {
_this.$refs.introduction.resVisible = localStorage.getItem("step") > 1
return _this.gotoCancel(this, true)
},
classes: 'close-btn',
text: _this.$t("shepherd.exit")
},
{
action: function() {
return _this.gotoNext(this, '/project/home', 3)
},
classes: 'shep-btn',
text: _this.$t("shepherd.next")
}
],
title: _this.$t("shepherd.step2.title"),
text: _this.$t("shepherd.step2.text")
},
{
attachTo: {
element: document.querySelector('.shepherd-project'),
on: 'bottom-end'
},
classes: "custom-width",
buttons: [
{
action: function() {
_this.$refs.introduction.resVisible = localStorage.getItem("step") > 1
return _this.gotoCancel(this, true)
},
classes: 'close-btn',
text: _this.$t("shepherd.exit")
},
{
action: function() {
return _this.gotoNext(this, null, 4)
},
classes: 'shep-btn',
text: _this.$t("shepherd.next")
}
],
title: _this.$t("shepherd.step3.title"),
text: _this.$t("shepherd.step3.text")
},
{
attachTo: {
element: document.querySelector('.shepherd-project-menu'),
on: 'bottom-start'
},
buttons: [
{
action: function() {
_this.$refs.introduction.resVisible = localStorage.getItem("step") > 1
return _this.gotoCancel(this, true)
},
classes: 'close-btn',
text: _this.$t("shepherd.exit")
},
{
action: function() {
return _this.gotoNext(this, '/project/home', 5)
},
classes: 'shep-btn',
text: _this.$t("shepherd.next")
}
],
title: _this.$t("shepherd.step4.title"),
text: _this.$t("shepherd.step4.text")
},
{
arrow:true,
modalOverlayOpeningPadding: 8,
attachTo: {
element: document.querySelector('.shepherd-project-name'),
on: 'right'
},
buttons: [
{
action: function() {
_this.$refs.introduction.resVisible = localStorage.getItem("step") > 1
return _this.gotoCancel(this, false)
},
classes: 'close-btn',
text: _this.$t("shepherd.know")
}
],
title: _this.$t("shepherd.step5.title"),
text: _this.$t("shepherd.step5.text")
}
])
tour.start()
})
},
initStep() {
const _this = this
_this.$nextTick(() => {