refactro(应用): 优化应用模板界面,防止误触关闭已填信息

This commit is contained in:
wangjiahao 2022-11-24 18:04:21 +08:00
parent 4f9f0fb12e
commit 13dab09d95
10 changed files with 66 additions and 64 deletions

View File

@ -274,7 +274,7 @@ export default {
} else { } else {
return { return {
... ...
getStyle(style, ['top', 'left', 'width', 'height', 'rotate']), getStyle(style, ['top', 'left', 'width', 'height', 'rotate']),
position: 'relative' position: 'relative'
} }
} }

View File

@ -2680,6 +2680,7 @@ export default {
'I18N_USER_TEMPLATE_ERROR': 'Template file error', 'I18N_USER_TEMPLATE_ERROR': 'Template file error',
'i18n_max_user_import_size': 'File size exceeds 10M', 'i18n_max_user_import_size': 'File size exceeds 10M',
app_template: { app_template: {
apply_template: 'Apply template',
execution_time: 'Execution time', execution_time: 'Execution time',
app_manager: 'Application management', app_manager: 'Application management',
app_upload: 'Upload app', app_upload: 'Upload app',

View File

@ -2681,6 +2681,7 @@ export default {
'I18N_USER_TEMPLATE_ERROR': '模版錯誤', 'I18N_USER_TEMPLATE_ERROR': '模版錯誤',
'i18n_max_user_import_size': '文件最大不能超過10M', 'i18n_max_user_import_size': '文件最大不能超過10M',
app_template: { app_template: {
apply_template: '應用模版',
execution_time: '执行时间', execution_time: '执行时间',
app_manager: '應用管理', app_manager: '應用管理',
app_upload: '上傳應用', app_upload: '上傳應用',

View File

@ -2681,6 +2681,7 @@ export default {
'I18N_USER_TEMPLATE_ERROR': '模版错误', 'I18N_USER_TEMPLATE_ERROR': '模版错误',
'i18n_max_user_import_size': '文件最大不能超过10M', 'i18n_max_user_import_size': '文件最大不能超过10M',
app_template: { app_template: {
apply_template: '应用模板',
execution_time: '执行时间', execution_time: '执行时间',
app_manager: '应用管理', app_manager: '应用管理',
app_upload: '上传应用', app_upload: '上传应用',

View File

@ -192,7 +192,7 @@
@command="chartFieldEdit" @command="chartFieldEdit"
> >
<span class="el-dropdown-link"> <span class="el-dropdown-link">
<i class="el-icon-s-tools"/> <i class="el-icon-s-tools" />
</span> </span>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item <el-dropdown-item
@ -267,7 +267,7 @@
@command="chartFieldEdit" @command="chartFieldEdit"
> >
<span class="el-dropdown-link"> <span class="el-dropdown-link">
<i class="el-icon-s-tools"/> <i class="el-icon-s-tools" />
</span> </span>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item <el-dropdown-item
@ -362,7 +362,7 @@
style="padding: 6px;" style="padding: 6px;"
> >
{{ $t('chart.change_chart_type') }} {{ $t('chart.change_chart_type') }}
<i class="el-icon-caret-bottom"/> <i class="el-icon-caret-bottom" />
</el-button> </el-button>
</el-popover> </el-popover>
</span> </span>
@ -490,8 +490,8 @@
> >
<span class="data-area-label"> <span class="data-area-label">
<span v-if="view.type && view.type.includes('table')">{{ <span v-if="view.type && view.type.includes('table')">{{
$t('chart.drag_block_table_data_column') $t('chart.drag_block_table_data_column')
}}</span> }}</span>
<span <span
v-else-if="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'chart-mix' || view.type === 'waterfall' || view.type === 'area')" v-else-if="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'chart-mix' || view.type === 'waterfall' || view.type === 'area')"
>{{ $t('chart.drag_block_type_axis') }}</span> >{{ $t('chart.drag_block_type_axis') }}</span>
@ -499,18 +499,18 @@
v-else-if="view.type && view.type.includes('pie')" v-else-if="view.type && view.type.includes('pie')"
>{{ $t('chart.drag_block_pie_label') }}</span> >{{ $t('chart.drag_block_pie_label') }}</span>
<span v-else-if="view.type && view.type.includes('funnel')">{{ <span v-else-if="view.type && view.type.includes('funnel')">{{
$t('chart.drag_block_funnel_split') $t('chart.drag_block_funnel_split')
}}</span> }}</span>
<span v-else-if="view.type && view.type.includes('radar')">{{ <span v-else-if="view.type && view.type.includes('radar')">{{
$t('chart.drag_block_radar_label') $t('chart.drag_block_radar_label')
}}</span> }}</span>
<span v-else-if="view.type && view.type === 'map'">{{ $t('chart.area') }}</span> <span v-else-if="view.type && view.type === 'map'">{{ $t('chart.area') }}</span>
<span v-else-if="view.type && view.type.includes('treemap')">{{ <span v-else-if="view.type && view.type.includes('treemap')">{{
$t('chart.drag_block_treemap_label') $t('chart.drag_block_treemap_label')
}}</span> }}</span>
<span v-else-if="view.type && view.type === 'word-cloud'">{{ <span v-else-if="view.type && view.type === 'word-cloud'">{{
$t('chart.drag_block_word_cloud_label') $t('chart.drag_block_word_cloud_label')
}}</span> }}</span>
<span v-else-if="view.type && view.type === 'label'">{{ $t('chart.drag_block_label') }}</span> <span v-else-if="view.type && view.type === 'label'">{{ $t('chart.drag_block_label') }}</span>
<span v-show="view.type !== 'richTextView'"> / </span> <span v-show="view.type !== 'richTextView'"> / </span>
<span v-if="view.type && view.type !== 'table-info'">{{ $t('chart.dimension') }}</span> <span v-if="view.type && view.type !== 'table-info'">{{ $t('chart.dimension') }}</span>
@ -633,8 +633,8 @@
> >
<span class="data-area-label"> <span class="data-area-label">
<span v-if="view.type && view.type.includes('table')">{{ <span v-if="view.type && view.type.includes('table')">{{
$t('chart.drag_block_table_data_column') $t('chart.drag_block_table_data_column')
}}</span> }}</span>
<span <span
v-else-if="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'waterfall' || view.type === 'area')" v-else-if="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'waterfall' || view.type === 'area')"
>{{ $t('chart.drag_block_value_axis') }}</span> >{{ $t('chart.drag_block_value_axis') }}</span>
@ -642,30 +642,30 @@
v-else-if="view.type && view.type.includes('pie')" v-else-if="view.type && view.type.includes('pie')"
>{{ $t('chart.drag_block_pie_angel') }}</span> >{{ $t('chart.drag_block_pie_angel') }}</span>
<span v-else-if="view.type && view.type.includes('funnel')">{{ <span v-else-if="view.type && view.type.includes('funnel')">{{
$t('chart.drag_block_funnel_width') $t('chart.drag_block_funnel_width')
}}</span> }}</span>
<span v-else-if="view.type && view.type.includes('radar')">{{ <span v-else-if="view.type && view.type.includes('radar')">{{
$t('chart.drag_block_radar_length') $t('chart.drag_block_radar_length')
}}</span> }}</span>
<span v-else-if="view.type && view.type.includes('gauge')">{{ <span v-else-if="view.type && view.type.includes('gauge')">{{
$t('chart.drag_block_gauge_angel') $t('chart.drag_block_gauge_angel')
}}</span> }}</span>
<span <span
v-else-if="view.type && view.type.includes('text')" v-else-if="view.type && view.type.includes('text')"
>{{ $t('chart.drag_block_label_value') }}</span> >{{ $t('chart.drag_block_label_value') }}</span>
<span v-else-if="view.type && view.type === 'map'">{{ $t('chart.chart_data') }}</span> <span v-else-if="view.type && view.type === 'map'">{{ $t('chart.chart_data') }}</span>
<span v-else-if="view.type && view.type.includes('tree')">{{ <span v-else-if="view.type && view.type.includes('tree')">{{
$t('chart.drag_block_treemap_size') $t('chart.drag_block_treemap_size')
}}</span> }}</span>
<span v-else-if="view.type && view.type === 'chart-mix'">{{ <span v-else-if="view.type && view.type === 'chart-mix'">{{
$t('chart.drag_block_value_axis_main') $t('chart.drag_block_value_axis_main')
}}</span> }}</span>
<span <span
v-else-if="view.type && view.type === 'liquid'" v-else-if="view.type && view.type === 'liquid'"
>{{ $t('chart.drag_block_progress') }}</span> >{{ $t('chart.drag_block_progress') }}</span>
<span v-else-if="view.type && view.type === 'word-cloud'">{{ <span v-else-if="view.type && view.type === 'word-cloud'">{{
$t('chart.drag_block_word_cloud_size') $t('chart.drag_block_word_cloud_size')
}}</span> }}</span>
<span v-show="view.type !== 'richTextView'"> / </span> <span v-show="view.type !== 'richTextView'"> / </span>
<span>{{ $t('chart.quota') }}</span> <span>{{ $t('chart.quota') }}</span>
<i <i
@ -1116,7 +1116,7 @@
class="padding-tab" class="padding-tab"
style="width: 350px;" style="width: 350px;"
> >
<position-adjust/> <position-adjust />
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
@ -1268,7 +1268,7 @@
width="800px" width="800px"
class="dialog-css" class="dialog-css"
> >
<quota-filter-editor :item="quotaItem"/> <quota-filter-editor :item="quotaItem" />
<div <div
slot="footer" slot="footer"
class="dialog-footer" class="dialog-footer"
@ -1295,7 +1295,7 @@
width="800px" width="800px"
class="dialog-css" class="dialog-css"
> >
<dimension-filter-editor :item="dimensionItem"/> <dimension-filter-editor :item="dimensionItem" />
<div <div
slot="footer" slot="footer"
class="dialog-footer" class="dialog-footer"

View File

@ -30,8 +30,8 @@
type="number" type="number"
:min="0" :min="0"
:max="maxLeft" :max="maxLeft"
@change="leftOnChange"
class="hide-icon-number" class="hide-icon-number"
@change="leftOnChange"
> >
<template slot="append">px</template> <template slot="append">px</template>
</el-input> </el-input>

View File

@ -839,7 +839,7 @@ export default {
}) })
}, },
getFields(item) { getFields(item) {
if(item.deExtractType == 0){ if (item.deExtractType == 0) {
const children = this.dateformats const children = this.dateformats
return [ return [
{ label: this.$t('dataset.text'), value: 0 }, { label: this.$t('dataset.text'), value: 0 },
@ -852,7 +852,7 @@ export default {
}, },
{ label: this.$t('dataset.location'), value: 5 } { label: this.$t('dataset.location'), value: 5 }
] ]
}else { } else {
return [ return [
{ label: this.$t('dataset.text'), value: 0 }, { label: this.$t('dataset.text'), value: 0 },
{ label: this.$t('dataset.time'), value: 1 }, { label: this.$t('dataset.time'), value: 1 },
@ -870,7 +870,7 @@ export default {
item.deType = item.deTypeCascader[0] item.deType = item.deTypeCascader[0]
if (item.deTypeCascader.length === 2) { // if (item.deTypeCascader.length === 2) { //
item.dateFormatType = item.deTypeCascader[1] item.dateFormatType = item.deTypeCascader[1]
if(item.dateFormatType !== 'custom'){ if (item.dateFormatType !== 'custom') {
item.dateFormat = item.dateFormatType item.dateFormat = item.dateFormatType
} }
} }

View File

@ -2,10 +2,11 @@
<el-drawer <el-drawer
v-closePress v-closePress
v-loading="$store.getters.loadingMap[$store.getters.currentPath]" v-loading="$store.getters.loadingMap[$store.getters.currentPath]"
:title="'应用模板'" :title="$t('app_template.apply_template')"
:visible.sync="applyDrawer" :visible.sync="applyDrawer"
custom-class="de-user-drawer" custom-class="de-user-drawer"
size="600px" size="600px"
:wrapper-closable="false"
direction="rtl" direction="rtl"
> >
<ds-form <ds-form
@ -19,6 +20,7 @@
<script> <script>
import DsForm from '@/views/system/datasource/DsForm' import DsForm from '@/views/system/datasource/DsForm'
export default { export default {
name: 'AppTemplateApply', name: 'AppTemplateApply',
components: { components: {
@ -30,8 +32,7 @@ export default {
applyDrawer: false applyDrawer: false
} }
}, },
computed: { computed: {},
},
mounted() { mounted() {
}, },
methods: { methods: {
@ -52,7 +53,7 @@ export default {
</script> </script>
<style scoped> <style scoped>
::v-deep .el-drawer__body{ ::v-deep .el-drawer__body {
padding: 0px 0px!important; padding: 0px 0px !important;
} }
</style> </style>

View File

@ -165,8 +165,8 @@
v-show=" show &&showIndex===1" v-show=" show &&showIndex===1"
:canvas-id="canvasId" :canvas-id="canvasId"
/> />
<subject-setting v-show=" show &&showIndex===2"/> <subject-setting v-show=" show &&showIndex===2" />
<assist-component v-show=" show &&showIndex===3"/> <assist-component v-show=" show &&showIndex===3" />
</div> </div>
</el-drawer> </el-drawer>
<!--PC端画布区域--> <!--PC端画布区域-->
@ -181,7 +181,7 @@
:canvas-pid="'0'" :canvas-pid="'0'"
@canvasScroll="canvasScroll" @canvasScroll="canvasScroll"
> >
<canvas-opt-bar slot="optBar"/> <canvas-opt-bar slot="optBar" />
</de-canvas> </de-canvas>
<!--移动端画布区域 保持宽高比2.5--> <!--移动端画布区域 保持宽高比2.5-->
<el-row <el-row
@ -197,7 +197,7 @@
:style="customCanvasMobileStyle" :style="customCanvasMobileStyle"
class="this_mobile_canvas" class="this_mobile_canvas"
> >
<el-row class="this_mobile_canvas_top"/> <el-row class="this_mobile_canvas_top" />
<el-row class="this_mobile_canvas_inner_top"> <el-row class="this_mobile_canvas_inner_top">
{{ panelInfo.name }} {{ panelInfo.name }}
</el-row> </el-row>
@ -215,7 +215,7 @@
:canvas-pid="'0'" :canvas-pid="'0'"
:mobile-layout-status="true" :mobile-layout-status="true"
> >
<canvas-opt-bar slot="optBar"/> <canvas-opt-bar slot="optBar" />
</de-canvas> </de-canvas>
</el-row> </el-row>
<el-row class="this_mobile_canvas_inner_bottom"> <el-row class="this_mobile_canvas_inner_bottom">
@ -245,14 +245,14 @@
/> />
</el-col> </el-col>
</el-row> </el-row>
<el-row class="this_mobile_canvas_bottom"/> <el-row class="this_mobile_canvas_bottom" />
</div> </div>
</el-col> </el-col>
<el-col <el-col
:span="16" :span="16"
class="this_mobile_canvas_cell this_mobile_canvas_wait_cell" class="this_mobile_canvas_cell this_mobile_canvas_wait_cell"
> >
<component-wait/> <component-wait />
</el-col> </el-col>
</el-row> </el-row>
</de-main-container> </de-main-container>
@ -270,7 +270,7 @@
/> />
</div> </div>
<div v-if="showBatchViewToolsAside"> <div v-if="showBatchViewToolsAside">
<chart-style-batch-set/> <chart-style-batch-set />
</div> </div>
<div v-if="!showViewToolsAside&&!showBatchViewToolsAside"> <div v-if="!showViewToolsAside&&!showBatchViewToolsAside">
<el-row style="height: 40px"> <el-row style="height: 40px">
@ -283,11 +283,10 @@
@click="changeRightDrawOpen(false)" @click="changeRightDrawOpen(false)"
/> />
</el-tooltip> </el-tooltip>
<span style="font-weight: bold;font-size: 14px;margin-left: 40px;line-height:40px" <span style="font-weight: bold;font-size: 14px;margin-left: 40px;line-height:40px">{{ $t('panel.position_adjust') }}</span>
>{{ $t('panel.position_adjust') }}</span>
</el-row> </el-row>
<el-row> <el-row>
<position-adjust v-if="curComponent&&!curComponent.auxiliaryMatrix"/> <position-adjust v-if="curComponent&&!curComponent.auxiliaryMatrix" />
</el-row> </el-row>
</div> </div>
</div> </div>
@ -446,8 +445,7 @@
/> />
</el-col> </el-col>
<el-col :span="21"> <el-col :span="21">
<span style="font-size: 13px;margin-left: 10px;font-weight: bold;line-height: 20px" <span style="font-size: 13px;margin-left: 10px;font-weight: bold;line-height: 20px">{{ $t('panel.panel_cache_use_tips') }}</span>
>{{ $t('panel.panel_cache_use_tips') }}</span>
</el-col> </el-col>
</el-row> </el-row>
<div <div
@ -963,11 +961,11 @@ export default {
showPanel(type) { showPanel(type) {
if (this.showIndex === -1 || this.showIndex === type) { if (this.showIndex === -1 || this.showIndex === type) {
this.$nextTick(() => { this.$nextTick(() => {
if (this.show) { if (this.show) {
this.showIndex === -1 this.showIndex === -1
}
this.show = !this.show
} }
this.show = !this.show
}
) )
} }
this.showIndex = type this.showIndex = type

View File

@ -174,7 +174,7 @@
/> />
</span> </span>
<span v-if="data.nodeType === 'folder'"> <span v-if="data.nodeType === 'folder'">
<svg-icon icon-class="scene"/> <svg-icon icon-class="scene" />
</span> </span>
<span <span
:class="data.status" :class="data.status"
@ -211,7 +211,7 @@
<el-dropdown-item <el-dropdown-item
:command="beforeClickEdit('folder', 'new', data, node)" :command="beforeClickEdit('folder', 'new', data, node)"
> >
<svg-icon icon-class="scene"/> <svg-icon icon-class="scene" />
<span style="margin-left: 5px">{{ $t('panel.groupAdd') }}</span> <span style="margin-left: 5px">{{ $t('panel.groupAdd') }}</span>
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item <el-dropdown-item
@ -334,7 +334,7 @@
:label="$t('commons.name')" :label="$t('commons.name')"
prop="name" prop="name"
> >
<el-input v-model="groupForm.name"/> <el-input v-model="groupForm.name" />
</el-form-item> </el-form-item>
</el-form> </el-form>
<div <div
@ -345,8 +345,8 @@
size="mini" size="mini"
@click="close()" @click="close()"
>{{ >{{
$t('panel.cancel') $t('panel.cancel')
}} }}
</el-button> </el-button>
<el-button <el-button
type="primary" type="primary"
@ -422,8 +422,8 @@
size="mini" size="mini"
@click="closeMoveGroup()" @click="closeMoveGroup()"
>{{ >{{
$t('dataset.cancel') $t('dataset.cancel')
}} }}
</el-button> </el-button>
<el-button <el-button
:disabled="groupMoveConfirmDisabled" :disabled="groupMoveConfirmDisabled"