feat: 仪表板编辑状态时,拦截浏览器路由切换

This commit is contained in:
wangjiahao 2022-05-07 10:43:08 +08:00
parent 586f4b0307
commit c8b37c0f48
11 changed files with 59 additions and 11 deletions

View File

@ -1427,6 +1427,7 @@ export default {
sure_bt: 'Confirm'
},
panel: {
edit_leave_tips: 'Do You Want To Abandon And Leave The Current Page?',
hyperlinks: 'Hyperlinks',
is_live: 'Is Live',
yes: 'Yes',

View File

@ -1428,6 +1428,7 @@ export default {
sure_bt: '確定'
},
panel: {
edit_leave_tips: '是否放弃编辑离开当前界面?',
hyperlinks: '超鏈接',
is_live: '是否直播',
yes: '是',

View File

@ -1435,6 +1435,7 @@ export default {
sure_bt: '确定'
},
panel: {
edit_leave_tips: '是否放弃编辑离开当前界面?',
hyperlinks: '超链接',
is_live: '是否直播',
yes: '是',

View File

@ -54,6 +54,12 @@
<div class="content unicode" style="display: block;">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont">&#xe61b;</span>
<div class="name">批量操作</div>
<div class="code-name">&amp;#xe61b;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe666;</span>
<div class="name">图片</div>
@ -564,9 +570,9 @@
<pre><code class="language-css"
>@font-face {
font-family: 'iconfont';
src: url('iconfont.woff2?t=1650596962167') format('woff2'),
url('iconfont.woff?t=1650596962167') format('woff'),
url('iconfont.ttf?t=1650596962167') format('truetype');
src: url('iconfont.woff2?t=1651808824317') format('woff2'),
url('iconfont.woff?t=1651808824317') format('woff'),
url('iconfont.ttf?t=1651808824317') format('truetype');
}
</code></pre>
<h3 id="-iconfont-">第二步:定义使用 iconfont 的样式</h3>
@ -592,6 +598,15 @@
<div class="content font-class">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont icon-piliang-copy"></span>
<div class="name">
批量操作
</div>
<div class="code-name">.icon-piliang-copy
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-tupian"></span>
<div class="name">
@ -1357,6 +1372,14 @@
<div class="content symbol">
<ul class="icon_lists dib-box">
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-piliang-copy"></use>
</svg>
<div class="name">批量操作</div>
<div class="code-name">#icon-piliang-copy</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-tupian"></use>

View File

@ -1,8 +1,8 @@
@font-face {
font-family: "iconfont"; /* Project id 2459092 */
src: url('iconfont.woff2?t=1650596962167') format('woff2'),
url('iconfont.woff?t=1650596962167') format('woff'),
url('iconfont.ttf?t=1650596962167') format('truetype');
src: url('iconfont.woff2?t=1651808824317') format('woff2'),
url('iconfont.woff?t=1651808824317') format('woff'),
url('iconfont.ttf?t=1651808824317') format('truetype');
}
.iconfont {
@ -13,6 +13,10 @@
-moz-osx-font-smoothing: grayscale;
}
.icon-piliang-copy:before {
content: "\e61b";
}
.icon-tupian:before {
content: "\e666";
}

File diff suppressed because one or more lines are too long

View File

@ -5,6 +5,13 @@
"css_prefix_text": "icon-",
"description": "",
"glyphs": [
{
"icon_id": "5807789",
"name": "批量操作",
"font_class": "piliang-copy",
"unicode": "e61b",
"unicode_decimal": 58907
},
{
"icon_id": "1278123",
"name": "图片",

View File

@ -12,7 +12,6 @@ import bus from '@/utils/bus'
import DeMainContainer from '@/components/dataease/DeMainContainer'
import DeContainer from '@/components/dataease/DeContainer'
import PanelMain from '@/views/panel/list/PanelMain'
import ChartEdit from '@/views/chart/view/ChartEdit'
import PanelEdit from '@/views/panel/edit'
export default {
@ -22,7 +21,8 @@ export default {
return {
component: PanelMain,
componentName: 'PanelMain',
param: {}
param: {},
contentHasSave: false
}
},
computed: {
@ -30,10 +30,21 @@ export default {
return this.$route.path.indexOf('panel') > -1 && (this.componentName === 'PanelEdit' || this.componentName === 'ChartEdit')
}
},
watch: {
$route(to, from) {
beforeRouteLeave(to, from, next) {
if (this.componentName === 'PanelEdit') {
next(false)
if (confirm(this.$t('panel.edit_leave_tips'))) {
next()
}
} else {
next()
}
},
watch: {
// $route(to, from) {
// console.log('route change')
// }
},
mounted() {
bus.$on('to-msg-share', params => {
this.toMsgShare(params)