refactor: 优化数据集数据预览tab请求数据策略

This commit is contained in:
junjun 2022-06-23 10:05:58 +08:00
parent f91cbcf9a9
commit 46f8cd634d
4 changed files with 89 additions and 41 deletions

View File

@ -361,12 +361,15 @@ export default {
pre[next[from]] = next[to] pre[next[from]] = next[to]
return pre return pre
}, {}) }, {})
originName.match(/(?<=\[).+?(?=\])/g).forEach(ele => { const on = originName.match(/(?<=\[).+?(?=\])/g)
if (name2Auto) { if (on) {
name2Auto.push(nameIdMap[ele]) on.forEach(ele => {
} if (name2Auto) {
name2Id = name2Id.replace(ele, nameIdMap[ele]) name2Auto.push(nameIdMap[ele])
}) }
name2Id = name2Id.replace(ele, nameIdMap[ele])
})
}
return name2Id return name2Id
}, },
@ -382,7 +385,8 @@ export default {
this.fieldForm.tableId = this.param.id this.fieldForm.tableId = this.param.id
this.fieldForm.columnIndex = this.tableFields.dimensionList.length + this.tableFields.quotaList.length this.fieldForm.columnIndex = this.tableFields.dimensionList.length + this.tableFields.quotaList.length
} }
post('/dataset/field/save', {...this.fieldForm, originName: this.setNameIdTrans('name', 'id', originName) }).then(response => { post('/dataset/field/save', { ...this.fieldForm, originName: this.setNameIdTrans('name', 'id', originName) }).then(response => {
localStorage.setItem('reloadDsData', 'true')
this.closeCalcField() this.closeCalcField()
}) })
}, },

View File

@ -346,8 +346,10 @@ export default {
post('/dataset/field/save', item).then(response => { post('/dataset/field/save', item).then(response => {
this.initField() this.initField()
localStorage.setItem('reloadDsData', 'true')
}).catch(res => { }).catch(res => {
this.initField() this.initField()
localStorage.setItem('reloadDsData', 'true')
}) })
}, },
@ -398,6 +400,7 @@ export default {
showClose: true showClose: true
}) })
this.initField() this.initField()
localStorage.setItem('reloadDsData', 'true')
}) })
}).catch(() => { }).catch(() => {
}) })
@ -411,6 +414,7 @@ export default {
}).then(() => { }).then(() => {
this.isSyncField = true this.isSyncField = true
post('/dataset/table/syncField/' + this.param.id, null).then(response => { post('/dataset/table/syncField/' + this.param.id, null).then(response => {
localStorage.setItem('reloadDsData', 'true')
setTimeout(() => { setTimeout(() => {
this.isSyncField = false this.isSyncField = false
this.initField() this.initField()

View File

@ -14,14 +14,22 @@
@show="showTab" @show="showTab"
@hide="hideTab" @hide="hideTab"
> >
<dataset-chart-detail type="dataset" :data="table" :tab-status="tabStatus"/> <dataset-chart-detail type="dataset" :data="table" :tab-status="tabStatus" />
<!-- <svg-icon slot="reference" class="title-text" icon-class="more_v" style="cursor: pointer;" />--> <!-- <svg-icon slot="reference" class="title-text" icon-class="more_v" style="cursor: pointer;" />-->
<i slot="reference" class="el-icon-warning icon-class" <i
style="margin-left: 4px;cursor: pointer;font-size: 14px;"/> slot="reference"
class="el-icon-warning icon-class"
style="margin-left: 4px;cursor: pointer;font-size: 14px;"
/>
</el-popover> </el-popover>
<el-row v-if="hasDataPermission('manage',param.privileges)" style="float: right"> <el-row v-if="hasDataPermission('manage',param.privileges)" style="float: right">
<el-dropdown v-if="table.type ==='excel'" style="margin-right: 10px;" size="small" trigger="click" <el-dropdown
@command="clickEditExcel"> v-if="table.type ==='excel'"
style="margin-right: 10px;"
size="small"
trigger="click"
@command="clickEditExcel"
>
<el-button size="mini"> <el-button size="mini">
{{ $t('dataset.edit_excel') }} {{ $t('dataset.edit_excel') }}
</el-button> </el-button>
@ -45,53 +53,80 @@
</el-button> </el-button>
</el-row> </el-row>
</el-row> </el-row>
<el-divider/> <el-divider />
<el-tabs v-model="tabActive" @tab-click="tabClick"> <el-tabs v-model="tabActive" @tab-click="tabClick">
<el-tab-pane :label="$t('dataset.data_preview')" name="dataPreview"> <el-tab-pane :label="$t('dataset.data_preview')" name="dataPreview">
<tab-data-preview :param="param" :table="table" :fields="fields" :data="data" :page="page" <tab-data-preview
:form="tableViewRowForm" @reSearch="reSearch"/> :param="param"
:table="table"
:fields="fields"
:data="data"
:page="page"
:form="tableViewRowForm"
@reSearch="reSearch"
/>
</el-tab-pane> </el-tab-pane>
<el-tab-pane :label="$t('dataset.field_manage')" :lazy="true" name="fieldEdit"> <el-tab-pane :label="$t('dataset.field_manage')" :lazy="true" name="fieldEdit">
<field-edit v-if="tabActive === 'fieldEdit'" :param="param" :table="table"/> <field-edit v-if="tabActive === 'fieldEdit'" :param="param" :table="table" />
</el-tab-pane> </el-tab-pane>
<el-tab-pane <el-tab-pane
v-if="!hideCustomDs && table.type !== 'union' && table.type !== 'custom' && !(table.type === 'sql' && table.mode === 0)" v-if="!hideCustomDs && table.type !== 'union' && table.type !== 'custom' && !(table.type === 'sql' && table.mode === 0)"
:label="$t('dataset.join_view')" name="joinView"> :label="$t('dataset.join_view')"
<union-view :param="param" :table="table"/> name="joinView"
>
<union-view :param="param" :table="table" />
</el-tab-pane> </el-tab-pane>
<el-tab-pane <el-tab-pane
v-if="table.mode === 1 && (table.type === 'excel' || table.type === 'db' || table.type === 'sql' || table.type === 'api')" v-if="table.mode === 1 && (table.type === 'excel' || table.type === 'db' || table.type === 'sql' || table.type === 'api')"
:label="$t('dataset.update_info')" name="updateInfo"> :label="$t('dataset.update_info')"
<update-info v-if="tabActive=='updateInfo'" :param="param" :table="table"/> name="updateInfo"
>
<update-info v-if="tabActive=='updateInfo'" :param="param" :table="table" />
</el-tab-pane> </el-tab-pane>
<el-tab-pane v-if="isPluginLoaded && hasDataPermission('manage',param.privileges)" :lazy="true" <el-tab-pane
:label="$t('dataset.row_permissions')" name="rowPermissions"> v-if="isPluginLoaded && hasDataPermission('manage',param.privileges)"
<plugin-com v-if="isPluginLoaded && tabActive=='rowPermissions'" ref="RowPermissions" :lazy="true"
component-name="RowPermissions" :obj="table"/> :label="$t('dataset.row_permissions')"
name="rowPermissions"
>
<plugin-com
v-if="isPluginLoaded && tabActive=='rowPermissions'"
ref="RowPermissions"
component-name="RowPermissions"
:obj="table"
/>
</el-tab-pane> </el-tab-pane>
<el-tab-pane v-if="isPluginLoaded && hasDataPermission('manage',param.privileges)" :lazy="true" <el-tab-pane
:label="$t('dataset.column_permissions')" name="columnPermissions"> v-if="isPluginLoaded && hasDataPermission('manage',param.privileges)"
<plugin-com v-if="isPluginLoaded && tabActive=='columnPermissions'" ref="ColumnPermissions" :lazy="true"
component-name="ColumnPermissions" :obj="table"/> :label="$t('dataset.column_permissions')"
name="columnPermissions"
>
<plugin-com
v-if="isPluginLoaded && tabActive=='columnPermissions'"
ref="ColumnPermissions"
component-name="ColumnPermissions"
:obj="table"
/>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</el-row> </el-row>
</template> </template>
<script> <script>
import {post} from '@/api/dataset/dataset' import { post } from '@/api/dataset/dataset'
import TabDataPreview from './TabDataPreview' import TabDataPreview from './TabDataPreview'
import UpdateInfo from './UpdateInfo' import UpdateInfo from './UpdateInfo'
import DatasetChartDetail from '../common/DatasetChartDetail' import DatasetChartDetail from '../common/DatasetChartDetail'
import UnionView from './UnionView' import UnionView from './UnionView'
import FieldEdit from './FieldEdit' import FieldEdit from './FieldEdit'
import {pluginLoaded} from '@/api/user' import { pluginLoaded } from '@/api/user'
import PluginCom from '@/views/system/plugin/PluginCom' import PluginCom from '@/views/system/plugin/PluginCom'
export default { export default {
name: 'ViewTable', name: 'ViewTable',
components: {FieldEdit, UnionView, DatasetChartDetail, UpdateInfo, TabDataPreview, PluginCom}, components: { FieldEdit, UnionView, DatasetChartDetail, UpdateInfo, TabDataPreview, PluginCom },
props: { props: {
param: { param: {
type: Object, type: Object,
@ -121,12 +156,12 @@ export default {
} }
}, },
computed: { computed: {
hideCustomDs: function () { hideCustomDs: function() {
return this.$store.getters.hideCustomDs return this.$store.getters.hideCustomDs
} }
}, },
watch: { watch: {
'param': function () { 'param': function() {
this.tabActive = 'dataPreview' this.tabActive = 'dataPreview'
this.initTable(this.param.id) this.initTable(this.param.id)
} }
@ -168,7 +203,7 @@ export default {
this.table = response.data this.table = response.data
this.initPreviewData(this.page) this.initPreviewData(this.page)
}).catch(res => { }).catch(res => {
this.$emit('switchComponent', {name: ''}) this.$emit('switchComponent', { name: '' })
}) })
} }
}, },
@ -202,25 +237,25 @@ export default {
}, },
edit() { edit() {
this.$emit('switchComponent', {name: 'FieldEdit', param: {table: this.table}}) this.$emit('switchComponent', { name: 'FieldEdit', param: { table: this.table }})
}, },
editSql() { editSql() {
this.$emit('switchComponent', { this.$emit('switchComponent', {
name: 'AddSQL', name: 'AddSQL',
param: {id: this.table.sceneId, tableId: this.table.id, table: this.table} param: { id: this.table.sceneId, tableId: this.table.id, table: this.table }
}) })
}, },
editCustom() { editCustom() {
this.$emit('switchComponent', { this.$emit('switchComponent', {
name: 'AddCustom', name: 'AddCustom',
param: {id: this.table.sceneId, tableId: this.table.id, table: this.table} param: { id: this.table.sceneId, tableId: this.table.id, table: this.table }
}) })
}, },
editUnion() { editUnion() {
this.$emit('switchComponent', { this.$emit('switchComponent', {
name: 'AddUnion', name: 'AddUnion',
param: {id: this.table.sceneId, tableId: this.table.id, table: this.table} param: { id: this.table.sceneId, tableId: this.table.id, table: this.table }
}) })
}, },
@ -241,13 +276,13 @@ export default {
case '0': case '0':
this.$emit('switchComponent', { this.$emit('switchComponent', {
name: 'AddExcel', name: 'AddExcel',
param: {id: this.table.sceneId, tableId: this.table.id, editType: 0, table: this.table} param: { id: this.table.sceneId, tableId: this.table.id, editType: 0, table: this.table }
}) })
break break
case '1': case '1':
this.$emit('switchComponent', { this.$emit('switchComponent', {
name: 'AddExcel', name: 'AddExcel',
param: {id: this.table.sceneId, tableId: this.table.id, editType: 1, table: this.table} param: { id: this.table.sceneId, tableId: this.table.id, editType: 1, table: this.table }
}) })
break break
} }
@ -273,7 +308,11 @@ export default {
tabClick() { tabClick() {
if (this.tabActive === 'dataPreview') { if (this.tabActive === 'dataPreview') {
this.initTable(this.param.id) const reload = localStorage.getItem('reloadDsData')
if (reload === 'true') {
localStorage.setItem('reloadDsData', 'false')
this.initTable(this.param.id)
}
} }
} }
} }

View File

@ -49,6 +49,7 @@ export default {
}, },
methods: { methods: {
initDs() { initDs() {
localStorage.setItem('reloadDsData', 'false')
checkCustomDs().then(res => { checkCustomDs().then(res => {
this.$store.dispatch('dataset/setHideCustomDs', res.data) this.$store.dispatch('dataset/setHideCustomDs', res.data)
}) })