1
0
mirror of https://github.com/PanJiaChen/vue-element-admin.git synced 2025-08-10 12:01:57 +08:00

support to quick guide (#910)

* support to quick guide

* supporte window

* renamed content name

Co-authored-by: elsiosanchez <elsiossanches@gmail.com>
This commit is contained in:
Elsio Sanchez 2021-06-11 17:11:36 -04:00 committed by GitHub
parent c678fcb045
commit 6794660098
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 62 additions and 11 deletions

View File

@ -40,6 +40,7 @@
<component <component
:is="componentRender" :is="componentRender"
:id="field.panelType !== 'form' ? field.columnName : ''"
:ref="field.columnName" :ref="field.columnName"
:metadata="fieldAttributes" :metadata="fieldAttributes"
:value-model="recordDataFields" :value-model="recordDataFields"
@ -50,6 +51,7 @@
<component <component
:is="componentRender" :is="componentRender"
v-else v-else
:id="field.panelType !== 'form' ? field.columnName : ''"
key="is-table-template" key="is-table-template"
:class="classField" :class="classField"
:metadata="fieldAttributes" :metadata="fieldAttributes"

View File

@ -16,7 +16,7 @@
</div> </div>
<div class="right-menu"> <div class="right-menu">
<template v-if="device!=='mobile'"> <template v-if="device!=='mobile'">
<el-tooltip v-if="showGuide" content="Guia" placement="top-start"> <el-tooltip :content="$t('route.guide')" placement="top-start">
<el-button icon="el-icon-info" type="text" style="color: black;font-size: larger" @click.prevent.stop="guide" /> <el-button icon="el-icon-info" type="text" style="color: black;font-size: larger" @click.prevent.stop="guide" />
</el-tooltip> </el-tooltip>
<search id="header-search" class="right-menu-item" /> <search id="header-search" class="right-menu-item" />
@ -101,7 +101,7 @@ export default {
}, },
showGuide() { showGuide() {
const typeViews = this.$route.meta.type const typeViews = this.$route.meta.type
if (!this.isEmptyValue(typeViews) && typeViews === 'form') { if (!this.isEmptyValue(typeViews) && typeViews !== 'window') {
return true return true
} }
return false return false
@ -123,24 +123,28 @@ export default {
}) })
return uri return uri
},
fieldPanel() {
return this.$store.getters.getFieldsListFromPanel(this.$route.meta.uuid).filter(field => field.isShowedFromUser)
},
fieldWindow() {
const windowUuid = this.$store.getters.getWindow(this.$route.meta.uuid).currentTab.uuid
const list = this.$store.getters.getFieldsListFromPanel(windowUuid)
if (!this.isEmptyValue(list)) {
return list.filter(field => field.isShowedFromUserDefault)
}
return []
} }
}, },
mounted() { mounted() {
this.driver = new Driver() this.driver = new Driver()
}, },
methods: { methods: {
guide(value) { guide() {
const stepsPos = steps.filter(steps => this.isEmptyValue(steps.panel)) const value = this.formatGuide(this.$route.meta.type)
value = this.showCollection && this.isShowedPOSKeyLaout ? steps : stepsPos
this.driver.defineSteps(value) this.driver.defineSteps(value)
this.driver.start() this.driver.start()
}, },
handleOpen(key, keyPath) {
console.log(key, keyPath)
},
handleClose(key, keyPath) {
console.log(key, keyPath)
},
isMenuOption() { isMenuOption() {
this.isMenuMobile = !this.isMenuMobile this.isMenuMobile = !this.isMenuMobile
}, },
@ -157,6 +161,51 @@ export default {
this.$router.push({ this.$router.push({
name: 'Profile' name: 'Profile'
}, () => {}) }, () => {})
},
formatGuide(type) {
let field
switch (type) {
case 'report':
field = this.fieldPanel.map(steps => {
return {
element: '#' + steps.columnName,
popover: {
title: steps.name,
description: steps.description,
position: 'top'
}
}
})
break
case 'process':
field = this.fieldPanel.map(steps => {
return {
element: '#' + steps.columnName,
popover: {
title: steps.name,
description: steps.description,
position: 'top'
}
}
})
break
case 'window':
field = this.fieldWindow.map(steps => {
return {
element: '#' + steps.columnName,
popover: {
title: steps.name,
description: steps.description,
position: 'top'
}
}
})
break
case 'form':
field = this.showCollection && this.isShowedPOSKeyLaout ? steps : steps.filter(steps => this.isEmptyValue(steps.panel))
break
}
return field
} }
} }
} }