center/dataease-dm
center/dataease-dm
13
0
Fork 0
forked from github/dataease
Code Pull Requests Activity

Merge branch 'dev' into pr@dev_dataset_source

Browse Source
This commit is contained in:
dataeaseShu 2022-09-20 16:15:09 +08:00
commit 9e5b36dc46
16 changed files with 1202 additions and 1221 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
backend/src/main/java/io/dataease/dto/panel/PanelGroupDTO.java
View File

@ -15,6 +15,8 @@ import java.util.Map;
*/
@Data
public class PanelGroupDTO extends PanelGroupWithBLOBs implements ITreeBase<PanelGroupDTO> {
@ApiModelProperty("创建用户名")
private String creatorName;
@ApiModelProperty("标签")
private String label;
@ApiModelProperty("是否叶子节点")

8
backend/src/main/java/io/dataease/ext/ExtPanelGroupMapper.xml
View File

@ -9,11 +9,17 @@
<result column="default_panel_id" jdbcType="VARCHAR" property="defaultPanelId"/>
<result column="default_panel_name" jdbcType="VARCHAR" property="defaultPanelName"/>
<result column="source_panel_name" jdbcType="VARCHAR" property="sourcePanelName"/>
<result column="creator_name" jdbcType="VARCHAR" property="creatorName"/>
<result column="is_default" property="isDefault"/>
</resultMap>
<select id="findOneWithPrivileges" resultMap="BaseResultMapDTO">
select panel_group.*,panel_group.name as label , get_auths(panel_group.id,'panel',#{userId}) as `privileges` from panel_group where id =#{panelId}
select panel_group.*,
panel_group.name as label,
(select nick_name from sys_user where username = panel_group.create_by) as creator_name,
get_auths(panel_group.id, 'panel', #{userId}) as `privileges`
from panel_group
where id = #{panelId}
</select>
<select id="panelGroupInit" resultMap="BaseResultMapDTO">

6
backend/src/main/java/io/dataease/service/chart/ChartViewService.java
View File

@ -1521,6 +1521,12 @@ public class ChartViewService {
getIndex = i;
}
}
if (StringUtils.equalsIgnoreCase(fieldType, "extStack")) {
List<ChartViewFieldDTO> stack = gson.fromJson(view.getXAxis(), new TypeToken<List<ChartViewFieldDTO>>() {
}.getType());
index += stack.size();
getIndex += stack.size();
}
List<String[]> sortResult = resultCustomSort(fieldList, sqlData);
if (ObjectUtils.isNotEmpty(chartViewFieldDTO) && (getIndex >= index)) {
// 获取自定义值与data对应列的结果

1
frontend/src/api/panel/panel.js
View File

@ -168,6 +168,7 @@ export function initPanelData(panelId, useCache = false, callback) {
status: response.data.status,
createBy: response.data.createBy,
createTime: response.data.createTime,
creatorName: response.data.creatorName,
updateBy: response.data.updateBy,
updateTime: response.data.updateTime
})

6
frontend/src/components/canvas/components/Editor/Preview.vue
View File

@ -9,7 +9,7 @@
<span>{{ $t('panel.panel_off') }}</span>
</div>
</el-row>
<el-row v-else-if="componentDataShow.length===0" class="custom-position">
<el-row v-else-if="componentDataShow && componentDataShow.length===0" class="custom-position">
{{ $t('panel.panelNull') }}
</el-row>
<div
@ -163,7 +163,7 @@ export default {
scaleWidth: '100',
scaleHeight: '100',
timer: null,
componentDataShow: [],
componentDataShow: null,
mainWidth: '100%',
mainHeight: '100%',
searchCount: 0,
@ -253,7 +253,7 @@ export default {
},
// 此处单独计算componentData的值 不放入全局mapState中
componentDataInfo() {
return this.componentDataShow
return this.componentDataShow||[]
},
...mapState([
'isClickComponent'

2
frontend/src/components/canvas/components/Editor/SettingMenu.vue
View File

@ -130,7 +130,7 @@ export default {
},
paste() {
this.$store.commit('paste', true)
this.$store.commit('paste', false)
this.$store.commit('recordSnapshot', 'paste')
},

11
frontend/src/components/canvas/custom-component/UserView.vue
View File

@ -137,7 +137,7 @@ import { adaptCurTheme, customAttrTrans, customStyleTrans, recursionTransObj } f
import ChartComponentS2 from '@/views/chart/components/ChartComponentS2'
import PluginCom from '@/views/system/plugin/PluginCom'
import LabelNormalText from '@/views/chart/components/normal/LabelNormalText'
import { viewPropsSave } from '@/api/chart/chart'
import { viewEditSave, viewPropsSave } from '@/api/chart/chart'
import { checkAddHttp } from '@/utils/urlUtils'
import DeRichTextView from '@/components/canvas/custom-component/DeRichTextView'
import Vue from 'vue'
@ -582,6 +582,15 @@ export default {
this.chart['position'] = this.inTab ? 'tab' : 'panel'
// 记录当前数据
this.panelViewDetailsInfo[id] = JSON.stringify(this.chart)
if(this.element.needAdaptor){
const customStyleObj = JSON.parse(this.chart.customStyle)
const customAttrObj = JSON.parse(this.chart.customAttr)
adaptCurTheme(customStyleObj, customAttrObj)
this.chart.customStyle = JSON.stringify(customStyleObj)
this.chart.customAttr = JSON.stringify(customAttrObj)
viewEditSave(this.panelInfo.id,{ id: this.chart.id, customStyle: this.chart.customStyle, customAttr: this.chart.customAttr })
this.$store.commit('adaptorStatusDisable',this.element.id)
}
this.sourceCustomAttrStr = this.chart.customAttr
this.sourceCustomStyleStr = this.chart.customStyle
this.chart.drillFields = this.chart.drillFields ? JSON.parse(this.chart.drillFields) : []

10
frontend/src/components/canvas/store/copy.js
View File

@ -4,6 +4,8 @@ import generateID from '@/components/canvas/utils/generateID'
import { deepCopy } from '@/components/canvas/utils/utils'
import { chartBatchCopy, chartCopy } from '@/api/chart/chart'
import { uuid } from 'vue-uuid'
import { adaptCurThemeCommonStyle } from '@/components/canvas/utils/style'
import Vue from "vue";
export default {
state: {
@ -85,7 +87,7 @@ export default {
state.isCut = false
},
paste(state, isMouse) {
paste(state, needAdaptor) {
if (!state.copyData) {
toast('请选择组件')
return
@ -103,12 +105,13 @@ export default {
if (data.type === 'view') {
chartCopy(data.propValue.viewId, state.panel.panelInfo.id).then(res => {
const newView = deepCopy(data)
Vue.set(newView, 'needAdaptor', needAdaptor)
newView.id = uuid.v1()
newView.propValue.viewId = res.data
if (newView.filters && newView.filters.length) {
newView.filters = []
}
needAdaptor && adaptCurThemeCommonStyle(newView)
store.commit('addComponent', { component: newView })
})
} else if (data.type === 'de-tabs') {
@ -120,17 +123,20 @@ export default {
const newViewId = uuid.v1()
sourceAndTargetIds[item.content.propValue.viewId] = newViewId
item.content.propValue.viewId = newViewId
Vue.set(item.content, 'needAdaptor', needAdaptor)
if (item.content.filters && item.content.filters.length) {
item.content.filters = []
}
}
})
chartBatchCopy({ 'sourceAndTargetIds': sourceAndTargetIds }, state.panel.panelInfo.id).then((rsp) => {
needAdaptor && adaptCurThemeCommonStyle(newCop)
store.commit('addComponent', { component: newCop })
})
} else {
const newCop = deepCopy(data)
newCop.id = uuid.v1()
needAdaptor && adaptCurThemeCommonStyle(newCop)
store.commit('addComponent', { component: newCop })
}
if (state.isCut) {

7
frontend/src/store/index.js
View File

@ -708,6 +708,13 @@ const data = {
},
setInEditorStatus(state, status) {
state.isInEditor = status
},
adaptorStatusDisable(state,componentId) {
state.componentData.forEach(item => {
if(item.id === componentId){
item.needAdaptor = false
}
})
}
},
modules: {

2
frontend/src/views/panel/list/common/PanelDetailInfo.vue
View File

@ -2,7 +2,7 @@
<el-row>
<el-col class="info-item">
<p class="info-title">{{ $t('panel.create_by') }}</p>
<p class="info-content">{{ panelInfo.createBy }}</p>
<p class="info-content">{{ panelInfo.creatorName }}</p>
</el-col>
<el-col class="info-item">
<p class="info-title">{{ $t('panel.create_time') }}</p>

726
frontend/src/views/system/datasource/DsConfiguration.vue
View File

File diff suppressed because it is too large Load Diff

785
frontend/src/views/system/datasource/DsForm.vue
View File

File diff suppressed because it is too large Load Diff

338
frontend/src/views/system/datasource/DsMain.vue
View File

@ -1,170 +1,214 @@
<template>
<div
class="de-ds-container"
:class="[{ 'is-driver-mgm': currentMgm === 'driverMgm' }]"
v-loading="$store.getters.loadingMap[$store.getters.currentPath]"
>
<div v-if="currentMgm === 'driverMgm'" class="dsr-route-title">
<div>
<i class="el-icon-arrow-left back-button" @click="jump" />
<span>{{ $t('driver.mgm') }}</span>
</div>
<deBtn type="primary" @click="addDriver" icon="el-icon-plus"
>{{ $t('driver.add') }}
</deBtn>
<div class="ds-table de-serach-table">
<el-row class="top-operate">
<el-col :span="10">
<span class="table-name">{{ params.name }}</span>
</el-col>
<el-col :span="14" class="right-user">
<el-input
:placeholder="$t('system_parameter_setting.search_keywords')"
prefix-icon="el-icon-search"
class="name-email-search"
size="small"
clearable
ref="search"
v-model="nikeName"
@blur="initSearch"
@clear="initSearch"
>
</el-input>
</el-col>
</el-row>
<div class="table-container">
<grid-table
v-loading="loading"
:tableData="tableData"
:columns="[]"
:pagination="paginationConfig"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
>
<el-table-column
key="name"
prop="name"
:label="$t('datasource.table_name')"
/>
<el-table-column
slot="__operation"
:label="$t('commons.operating')"
key="__operation"
fixed="right"
width="168"
>
<template slot-scope="scope">
<el-button
@click="createtDataset(scope.row)"
class="text-btn mar3 mar6"
type="text"
>{{ $t("datasource.create_dataset") }}</el-button
>
<el-button
@click="selectDataset(scope.row)"
class="text-btn"
type="text"
>{{ $t("dataset.detail") }}</el-button
>
</template>
</el-table-column>
</grid-table>
</div>
<de-aside-container style="padding: 0 0" type="datasource">
<ds-tree
@switch-mgm="switchMgm"
ref="dsTree"
:datasource="datasource"
@switch-main="switchMain"
/>
</de-aside-container>
<de-main-container>
<component
:is="component"
v-if="!!component"
:params="param"
:t-data="tData"
:ds-types="dsTypes"
@refresh-type="refreshType"
@switch-component="switchMain"
/>
<el-empty
v-else
:image-size="125"
:description="$t(`datasource.${swTips}`)"
:image="image"
></el-empty>
</de-main-container>
<el-drawer
:title="$t('dataset.detail')"
:visible.sync="userDrawer"
custom-class="user-drawer-task ds-table-drawer"
size="840px"
v-closePress
direction="rtl"
>
<el-row style="margin-top: 12px" :gutter="24">
<el-col :span="12">
<p class="table-name">
{{ $t("datasource.table_name") }}
</p>
<p class="table-value">
{{ dsTableDetail.name }}
</p>
</el-col>
<el-col :span="12">
<p class="table-name">
{{ $t("datasource.table_description") }}
</p>
<p class="table-value">
{{ dsTableDetail.remark || "-" }}
</p>
</el-col>
</el-row>
<el-table
:data="dsTableData"
stripe
style="width: 100%">
<el-table-column
prop="date"
:label="$t('panel.column_name')">
</el-table-column>
<el-table-column
prop="name"
:label="$t('dataset.field_type')">
</el-table-column>
<el-table-column
prop="name"
:label="$t('datasource.field_description')">
</el-table-column>
</el-table>
</el-drawer>
</div>
</template>
<script>
import DeMainContainer from '@/components/dataease/DeMainContainer'
import DeAsideContainer from '@/components/dataease/DeAsideContainer'
import DsTree from './DsTree'
import DsForm from './DsForm'
import dsTable from './dsTable'
import DriverForm from './DriverFormDetail'
import keyEnter from "@/components/msgCfm/keyEnter.js";
import GridTable from "@/components/gridTable/index.vue";
import { dsTable } from "@/api/dataset/dataset";
export default {
name: 'DsMain',
components: { DeMainContainer, DeAsideContainer, DsTree },
mixins: [keyEnter],
components: { GridTable },
props: {
params: {
type: Object,
default: () => {},
},
},
data() {
return {
image: require('@/assets/None_Select_ds.png'),
component: '',
datasource: {},
param: null,
tData: null,
currentMgm: 'dsMgm',
dsTypes: []
}
userDrawer: false,
dsTableDetail: {},
nikeName: "",
loading: false,
paginationConfig: {
currentPage: 1,
pageSize: 10,
total: 0,
},
dsTableData: [{date: 1}],
tableData: [{ name: 1 }],
};
},
computed: {
swTips() {
return this.currentMgm === 'driverMgm' ? 'on_the_left' : 'on_the_left'
}
created() {
// this.initSearch();
},
methods: {
jump() {
this.$refs.dsTree.dsMgm()
this.switchMgm('dsMgm')
createtDataset(row) {},
selectDataset(row) {
this.dsTableDetail = row;
this.userDrawer = true;
},
switchMgm(type) {
this.currentMgm = type
handleSizeChange(pageSize) {
this.paginationConfig.currentPage = 1;
this.paginationConfig.pageSize = pageSize;
this.search();
},
addDriver() {
this.$refs.dsTree.addDriver()
handleCurrentChange(currentPage) {
this.paginationConfig.currentPage = currentPage;
this.search();
},
// 切换main区内容
switchMain(param) {
const { component, componentParam, tData, dsTypes } = param
this.component = ''
this.param = null
this.$nextTick(() => {
switch (component) {
case 'DsForm':
this.component = DsForm
this.param = componentParam
this.tData = tData
this.dsTypes = dsTypes
break
case 'DriverForm':
this.component = DriverForm
this.param = componentParam
this.tData = tData
this.dsTypes = dsTypes
break
case 'dsTable':
this.component = dsTable
this.param = componentParam
break
default:
this.component = ''
this.param = null
break
}
})
initSearch() {
this.handleCurrentChange(1);
},
refreshType(datasource) {
this.datasource = datasource
this.$refs.dsTree && this.$refs.dsTree.refreshType(datasource)
search() {
this.loading = true;
const param = {
conditions: [],
};
if (this.nikeName) {
param.conditions.push({
field: `dataset_table_task.name`,
operator: "like",
value: this.nikeName,
});
}
const { currentPage, pageSize } = this.paginationConfig;
dsTable(currentPage, pageSize, this.params.id).then((response) => {
this.tableData = response.data.listObject;
this.paginationConfig.total = response.data.itemCount;
this.loading = false;
});
},
msg2Current(sourceParam) {
this.$refs.dsTree && this.$refs.dsTree.markInvalid(sourceParam)
}
}
}
},
};
</script>
<style scoped lang="scss">
.de-ds-container {
<style lang="scss">
.ds-table-drawer {
.table-value,
.table-name {
font-family: PingFang SC;
font-size: 14px;
font-weight: 400;
margin: 0;
}
.table-name {
color: var(--deTextSecondary, #646a73);
}
.table-value {
margin: 4px 0 24px 0;
color: var(--deTextPrimary, #1f2329);
}
}
.ds-table {
height: 100%;
// height: calc(100vh - 56px);
width: 100%;
overflow: hidden;
flex-wrap: wrap;
display: flex;
padding: 10px 14px;
box-sizing: border-box;
.el-empty {
height: 100%;
.table-name {
font-family: PingFang SC;
font-size: 16px;
font-weight: 500;
line-height: 24px;
color: var(--deTextPrimary, #1f2329);
}
.table-container {
height: calc(100% - 50px);
}
.el-table__fixed-right::before {
background: transparent;
}
}
.ms-aside-container {
height: calc(100vh - 56px);
padding: 0px;
min-width: 260px;
max-width: 460px;
}
.dsr-route-title {
width: 100%;
margin: -2px 0 22px 0;
display: flex;
justify-content: space-between;
align-content: center;
}
.is-driver-mgm {
background-color: var(--MainBG, #f5f6f7);
padding: 24px;
.ms-aside-container,
.ms-main-container {
height: calc(100vh - 170px);
background-color: var(--ContentBG, #ffffff);
.tree-style {
padding-top: 24px;
}
}
.ms-main-container {
flex: 1;
position: relative;
padding: 24px 0 70px 24px;
}
}
</style>
</style>

408
frontend/src/views/system/datasource/DsTree.vue
View File

@ -3,7 +3,7 @@
<el-col>
<el-row class="title-css" v-show="showView === 'Datasource'">
<el-col class="title-text" :span="12">
{{ $t('commons.datasource') }}
{{ $t("commons.datasource") }}
</el-col>
<el-col class="title-operate" :span="12">
<el-tooltip
@ -111,11 +111,7 @@
v-if="data.type === 'folder'"
effect="dark"
:content="
$t(
showView === 'Driver'
? 'driver.add'
: 'datasource.add_data_source'
)
$t(showView === 'Driver' ? 'driver.add' : 'datasource.add_data_source')
"
placement="top"
>
@ -137,11 +133,11 @@
<slot>
<el-dropdown-item command="edit">
<i class="el-icon-edit"></i>
{{ $t('chart.edit') }}
{{ $t("chart.edit") }}
</el-dropdown-item>
<el-dropdown-item command="delete">
<i class="el-icon-delete"></i>
{{ $t('chart.delete') }}
{{ $t("chart.delete") }}
</el-dropdown-item>
</slot>
</el-dropdown-menu>
@ -170,10 +166,7 @@
:rules="rule"
>
<el-form-item :label="$t('datasource.driver_name')" prop="name">
<el-input
v-model="driverForm.name"
:placeholder="$t('fu.search_bar.please_input')"
/>
<el-input v-model="driverForm.name" :placeholder="$t('fu.search_bar.please_input')" />
</el-form-item>
<el-form-item :label="$t('datasource.drive_type')" prop="type">
<el-select
@ -196,9 +189,9 @@
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<deBtn secondary @click="close()">{{ $t('commons.cancel') }}</deBtn>
<deBtn secondary @click="close()">{{ $t("commons.cancel") }}</deBtn>
<deBtn type="primary" size="mini" @click="saveDriver(driverForm)"
>{{ $t('commons.save') }}
>{{ $t("commons.save") }}
</deBtn>
</div>
</el-dialog>
@ -213,18 +206,10 @@
>
<el-tabs v-model="tabActive" @tab-click="changeTab">
<el-tab-pane :label="$t('datasource.all')" name="all"> </el-tab-pane>
<el-tab-pane
:label="$t('datasource.relational_database')"
name="reDb"
>
</el-tab-pane>
<el-tab-pane
:label="$t('datasource.non_relational_database')"
name="noReDb"
>
</el-tab-pane>
<el-tab-pane :label="$t('datasource.other')" name="other">
<el-tab-pane :label="$t('datasource.relational_database')" name="reDb"> </el-tab-pane>
<el-tab-pane :label="$t('datasource.non_relational_database')" name="noReDb">
</el-tab-pane>
<el-tab-pane :label="$t('datasource.other')" name="other"> </el-tab-pane>
<div class="db-container">
<div
@click="addDb(db)"
@ -245,8 +230,8 @@
</el-col>
</template>
<script>
import { mapGetters } from 'vuex'
import i18n from '@/lang'
import { mapGetters } from "vuex";
import i18n from "@/lang";
import {
listDatasource,
listDatasourceByType,
@ -256,370 +241,372 @@ import {
addDriver,
delDriver,
listDriverByType,
updateDriver
} from '@/api/system/datasource'
import { ApplicationContext } from '@/utils/ApplicationContext'
import deTextarea from '@/components/deCustomCm/deTextarea.vue'
import msgCfm from '@/components/msgCfm'
updateDriver,
} from "@/api/system/datasource";
import { ApplicationContext } from "@/utils/ApplicationContext";
import deTextarea from "@/components/deCustomCm/deTextarea.vue";
import msgCfm from "@/components/msgCfm";
export default {
name: 'DsTree',
name: "DsTree",
mixins: [msgCfm],
components: { deTextarea },
props: {
datasource: {
type: Object,
default: null
}
default: null,
},
},
data() {
return {
tabActive: 'all',
tabActive: "all",
dsTypeRelate: false,
expandedArray: [],
tData: [],
dsTypes: [],
dsTypesForDriver: [],
showSearchInput: false,
key: '',
showView: 'Datasource',
dialogTitle: '',
key: "",
showView: "Datasource",
dialogTitle: "",
editDriver: false,
driverForm: {
name: '',
desc: '',
type: ''
name: "",
desc: "",
type: "",
},
params: {},
rule: {
name: [
{
required: true,
message: i18n.t('datasource.input_name'),
trigger: 'blur'
message: i18n.t("datasource.input_name"),
trigger: "blur",
},
{
min: 2,
max: 50,
message: i18n.t('datasource.input_limit_2_25', [2, 25]),
trigger: 'blur'
}
message: i18n.t("datasource.input_limit_2_25", [2, 25]),
trigger: "blur",
},
],
desc: [
{
required: true,
message: i18n.t('datasource.input_name'),
trigger: 'blur'
message: i18n.t("datasource.input_name"),
trigger: "blur",
},
{
min: 2,
max: 200,
message: i18n.t('datasource.input_limit_2_25', [2, 25]),
trigger: 'blur'
}
message: i18n.t("datasource.input_limit_2_25", [2, 25]),
trigger: "blur",
},
],
type: [
{
required: true,
message: i18n.t('datasource.please_choose_type'),
trigger: 'blur'
}
]
}
}
message: i18n.t("datasource.please_choose_type"),
trigger: "blur",
},
],
},
};
},
watch: {
key(val) {
this.$refs.myDsTree.filter(val)
}
this.$refs.myDsTree.filter(val);
},
},
computed: {
...mapGetters(['user'])
...mapGetters(["user"]),
},
created() {
this.queryTreeDatas()
this.datasourceTypes()
this.queryTreeDatas();
this.datasourceTypes();
},
methods: {
changeTab() {},
filterNode(value, data) {
if (!value) return true
return data.name.indexOf(value) !== -1
if (!value) return true;
return data.name.indexOf(value) !== -1;
},
showSearchWidget() {
this.showSearchInput = true
this.showSearchInput = true;
},
closeSearchWidget() {
this.key = ''
this.showSearchInput = false
this.key = "";
this.showSearchInput = false;
},
queryTreeDatas() {
if (this.showView === 'Datasource') {
if (this.showView === "Datasource") {
listDatasource().then((res) => {
this.tData = this.buildTree(res.data)
})
this.tData = this.buildTree(res.data);
});
}
if (this.showView === 'Driver') {
if (this.showView === "Driver") {
listDrivers().then((res) => {
this.tData = this.buildTree(res.data)
})
this.tData = this.buildTree(res.data);
});
}
},
datasourceTypes() {
listDatasourceType().then((res) => {
this.dsTypes = res.data
this.dsTypes = res.data;
this.dsTypes.forEach((item) => {
if (item.isJdbc) {
this.dsTypesForDriver.push(item)
this.dsTypesForDriver.push(item);
}
})
})
});
});
},
refreshType(datasource) {
const method =
this.showView === 'Datasource' ? listDatasourceByType : listDriverByType
let typeData = []
this.showView === "Datasource"
? listDatasourceByType
: listDriverByType;
let typeData = [];
method(datasource.type).then((res) => {
typeData = this.buildTree(res.data)
typeData = this.buildTree(res.data);
if (typeData.length === 0) {
const index = this.tData.findIndex((item) => {
if (item.id === datasource.type) {
return true
return true;
}
})
this.tData.splice(index, 1)
});
this.tData.splice(index, 1);
} else {
let find = false
let find = false;
for (let index = 0; index < this.tData.length; index++) {
if (typeData[0].id === this.tData[index].id) {
this.tData[index].children = typeData[0].children
this.tData[index].children = typeData[0].children;
for (let i = 0; i < this.tData[index].children.length; i++) {
if (this.tData[index].children[i].id === datasource.id) {
this.showInfo({ data: this.tData[index].children[i] })
this.showInfo({ data: this.tData[index].children[i] });
}
}
find = true
find = true;
}
}
if (!find) {
this.tData.push(typeData[0])
this.tData.push(typeData[0]);
}
}
})
});
},
buildTree(array) {
const types = {}
const newArr = []
const types = {};
const newArr = [];
for (let index = 0; index < array.length; index++) {
const element = array[index]
const element = array[index];
if (this.msgNodeId) {
if (element.id === this.msgNodeId) {
element.msgNode = true
element.msgNode = true;
}
}
if (!(element.type in types)) {
types[element.type] = []
types[element.type] = [];
// newArr.push(...element, ...{ children: types[element.type] })
newArr.push({
id: element.type,
name: element.typeDesc,
type: 'folder',
children: types[element.type]
})
type: "folder",
children: types[element.type],
});
}
types[element.type].push(element)
types[element.type].push(element);
// newArr.children.push({ id: element.id, label: element.name })
}
return newArr
return newArr;
},
addFolder() {
if (this.showView === 'Driver') {
this.dialogTitle = this.$t('datasource.add_driver')
this.editDriver = true
this.switchMain('DriverForm', {}, this.tData, this.dsTypes)
if (this.showView === "Driver") {
this.dialogTitle = this.$t("datasource.add_driver");
this.editDriver = true;
this.switchMain("DriverForm", {}, this.tData, this.dsTypes);
} else {
this.dsTypeRelate = true
this.dsTypeRelate = true;
}
},
addDriver() {
this.dialogTitle = this.$t('datasource.add_driver')
this.editDriver = true
this.dialogTitle = this.$t("datasource.add_driver");
this.editDriver = true;
},
driverMgm() {
this.$emit('switch-main', {})
this.$emit('switch-mgm', 'driverMgm')
this.showView = 'Driver'
this.expandedArray = []
this.tData = []
this.queryTreeDatas()
this.$emit("switch-main", {});
this.$emit("switch-mgm", "driverMgm");
this.showView = "Driver";
this.expandedArray = [];
this.tData = [];
this.queryTreeDatas();
},
dsMgm() {
this.$emit('switch-main', {})
this.showView = 'Datasource'
this.expandedArray = []
this.tData = []
this.queryTreeDatas()
this.$emit("switch-main", {});
this.showView = "Datasource";
this.expandedArray = [];
this.tData = [];
this.queryTreeDatas();
},
addDb({ type }) {
this.$router.push({
name: 'datasource-form',
params: { type }
})
name: "datasource-form",
params: { type },
});
},
addFolderWithType(data) {
if (this.showView === 'Driver') {
this.driverForm.type = data.id
this.dialogTitle = this.$t('datasource.add_driver')
this.editDriver = true
if (this.showView === "Driver") {
this.driverForm.type = data.id;
this.dialogTitle = this.$t("datasource.add_driver");
this.editDriver = true;
} else {
this.$router.push({
name: 'datasource-form',
params: { type: data.id }
})
name: "datasource-form",
params: { type: data.id },
});
}
},
nodeClick(node, data) {
if (node.type === 'folder') return
this.showInfo(data)
if (node.type === "folder") return;
this.showInfo(data);
},
clickFileMore(param) {
const { optType, data } = param
const { optType, data } = param;
switch (optType) {
case 'edit':
this.edit(data)
break
case 'delete':
this._handleDelete(data)
break
case "edit":
this.edit(data);
break;
case "delete":
this._handleDelete(data);
break;
default:
break
break;
}
},
showInfo(row) {
if (this.showView === 'Driver') {
const param = { ...row.data, ...{ showModel: 'show' } }
if (this.showView === "Driver") {
const param = { ...row.data, ...{ showModel: "show" } };
this.switchMain(
this.showView === 'Datasource' ? 'DsForm' : 'DriverForm',
this.showView === "Datasource" ? "DsForm" : "DriverForm",
param,
this.tData,
this.dsTypes
)
);
} else {
this.switchMain('dsTable', row.data)
this.switchMain("dsTable", row.data);
}
},
handleCommand(type, data) {
switch (type) {
case 'edit':
this._handleEditer(data)
break
case 'delete':
this._handleDelete(data)
break
case "edit":
this._handleEditer(data);
break;
case "delete":
this._handleDelete(data);
break;
default:
break
break;
}
},
_handleEditer(row) {
if (this.showView === 'Datasource') {
const param = { ...row, ...{ showModel: 'show' } }
this.switchMain('DsForm', param, this.tData, this.dsTypes)
if (this.showView === "Datasource") {
const param = { ...row, ...{ showModel: "show" } };
this.switchMain(
'DsForm',
param,
this.tData,
this.dsTypes
);
return
}
this.editDriver = true
this.dialogTitle = this.$t('datasource.edit_driver')
this.driverForm = row
this.editDriver = true;
this.dialogTitle = this.$t('datasource.edit_driver');
this.driverForm = row;
},
_handleDelete(datasource) {
const params = {
title:
this.showView === 'Datasource'
? 'datasource.this_data_source'
: 'datasource.delete_this_driver',
title: this.showView === "Datasource" ? 'datasource.this_data_source' : 'datasource.delete_this_driver',
cb: () => {
let method = delDriver
let parma = { type: datasource.type, id: datasource.id }
if (this.showView === 'Datasource') {
method = delDs
parma = datasource.id
let method = delDriver;
let parma = { type: datasource.type, id: datasource.id };
if (this.showView === "Datasource") {
method = delDs;
parma = datasource.id;
}
method(parma).then((res) => {
if (res.success) {
this.openMessageSuccess('commons.delete_success')
this.switchMain('', {}, this.tData, this.dsTypes)
this.refreshType(datasource)
this.openMessageSuccess("commons.delete_success");
this.switchMain("", {}, this.tData, this.dsTypes);
this.refreshType(datasource);
} else {
this.openMessageSuccess(res.message, 'error')
this.openMessageSuccess(res.message, "error")
}
})
});
}
}
this.handlerConfirm(params)
},
switchMain(component, componentParam, tData, dsTypes) {
if (component === 'DsForm') {
if (component === "DsForm") {
this.$router.push({
name: 'datasource-form',
name: "datasource-form",
params: {
...componentParam,
msgNodeId: this.msgNodeId
}
})
return
msgNodeId: this.msgNodeId,
},
});
return;
}
this.$emit('switch-main', {
this.$emit("switch-main", {
component,
componentParam,
tData,
dsTypes
})
dsTypes,
});
},
markInvalid(msgParam) {
const param = JSON.parse(msgParam)
const msgNodeId = param.id
this.msgNodeId = msgNodeId
const param = JSON.parse(msgParam);
const msgNodeId = param.id;
this.msgNodeId = msgNodeId;
this.$nextTick(() => {
this.tData.forEach((folder) => {
const nodes = folder.children
const nodes = folder.children;
nodes.forEach((node) => {
if (node.id === msgNodeId) {
node.msgNode = true
node.msgNode = true;
}
})
})
})
});
});
});
},
close() {
this.$refs['driverForm'].resetFields()
this.editDriver = false
this.$refs["driverForm"].resetFields();
this.editDriver = false;
this.driverForm = {
name: '',
desc: '',
type: ''
}
name: "",
desc: "",
type: "",
};
},
saveDriver(driverForm) {
this.$refs['driverForm'].validate((valid) => {
this.$refs["driverForm"].validate((valid) => {
if (valid) {
const req = driverForm.id ? updateDriver : addDriver
const req = driverForm.id ? updateDriver : addDriver;
req(driverForm).then((res) => {
this.openMessageSuccess('dataset.save_success')
this.refreshType(driverForm)
this.close()
})
this.openMessageSuccess("dataset.save_success")
this.refreshType(driverForm);
this.close();
});
} else {
return false
return false;
}
})
}
}
}
});
},
},
};
</script>
<style lang="scss" scoped>
.custom-tree-container {
margin-top: 16px;
}
.custom-tree-node {
flex: 1;
display: flex;
@ -629,7 +616,6 @@ export default {
padding-right: 8px;
width: 100%;
}
.custom-tree-node-list {
flex: 1;
display: flex;
@ -638,33 +624,27 @@ export default {
font-size: 14px;
padding: 0 8px;
width: calc(100% - 40px);
.child {
/*display: none;*/
visibility: hidden;
}
&:hover .child {
/*display: inline;*/
visibility: visible;
}
}
.tree-list ::v-deep .el-tree-node__expand-icon.is-leaf {
display: none;
}
.tree-style {
padding: 16px 24px;
height: 100%;
overflow-y: auto;
.title-text {
line-height: 26px;
color: #1f2329;
margin-bottom: 16px;
}
.title-operate {
text-align: right;
i {
@ -681,7 +661,6 @@ export default {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
.db-card {
height: 193px;
width: 270px;
@ -705,7 +684,6 @@ export default {
padding: 8px 12px;
border-top: 1px solid rgba(#1f2329, 0.15);
}
&:hover {
box-shadow: 0px 6px 24px rgba(31, 35, 41, 0.08);
}

108
frontend/src/views/system/datasource/dsTable.vue
View File

@ -45,13 +45,13 @@
@click="createtDataset(scope.row)"
class="text-btn mar3 mar6"
type="text"
>{{ $t('datasource.create_dataset') }}</el-button
>{{ $t("datasource.create_dataset") }}</el-button
>
<el-button
@click="selectDataset(scope.row)"
class="text-btn"
type="text"
>{{ $t('dataset.detail') }}</el-button
>{{ $t("dataset.detail") }}</el-button
>
</template>
</el-table-column>
@ -68,7 +68,7 @@
<el-row style="margin-top: 12px" :gutter="24">
<el-col :span="12">
<p class="table-name">
{{ $t('datasource.table_name') }}
{{ $t("datasource.table_name") }}
</p>
<p class="table-value">
{{ dsTableDetail.name }}
@ -76,98 +76,104 @@
</el-col>
<el-col :span="12">
<p class="table-name">
{{ $t('datasource.table_description') }}
{{ $t("datasource.table_description") }}
</p>
<p class="table-value">
{{ dsTableDetail.remark || '-' }}
{{ dsTableDetail.remark || "-" }}
</p>
</el-col>
</el-row>
<el-table :data="dsTableData" stripe style="width: 100%">
<el-table-column prop="date" :label="$t('panel.column_name')">
</el-table-column>
<el-table-column prop="name" :label="$t('dataset.field_type')">
</el-table-column>
<el-table-column
prop="name"
:label="$t('datasource.field_description')"
>
</el-table-column>
</el-table>
<el-table
:data="dsTableData"
stripe
style="width: 100%">
<el-table-column
prop="date"
:label="$t('panel.column_name')">
</el-table-column>
<el-table-column
prop="name"
:label="$t('dataset.field_type')">
</el-table-column>
<el-table-column
prop="name"
:label="$t('datasource.field_description')">
</el-table-column>
</el-table>
</el-drawer>
</div>
</template>
<script>
import keyEnter from '@/components/msgCfm/keyEnter.js'
import GridTable from '@/components/gridTable/index.vue'
import { dsTable } from '@/api/dataset/dataset'
import keyEnter from "@/components/msgCfm/keyEnter.js";
import GridTable from "@/components/gridTable/index.vue";
import { dsTable } from "@/api/dataset/dataset";
export default {
mixins: [keyEnter],
components: { GridTable },
props: {
params: {
type: Object,
default: () => {}
}
default: () => {},
},
},
data() {
return {
userDrawer: false,
dsTableDetail: {},
nikeName: '',
nikeName: "",
loading: false,
paginationConfig: {
currentPage: 1,
pageSize: 10,
total: 0
total: 0,
},
dsTableData: [],
tableData: []
}
dsTableData: [{date: 1}],
tableData: [{ name: 1 }],
};
},
created() {
this.initSearch()
// this.initSearch();
},
methods: {
createtDataset(row) {},
selectDataset(row) {
this.dsTableDetail = row
this.userDrawer = true
this.dsTableDetail = row;
this.userDrawer = true;
},
handleSizeChange(pageSize) {
this.paginationConfig.currentPage = 1
this.paginationConfig.pageSize = pageSize
this.search()
this.paginationConfig.currentPage = 1;
this.paginationConfig.pageSize = pageSize;
this.search();
},
handleCurrentChange(currentPage) {
this.paginationConfig.currentPage = currentPage
this.search()
this.paginationConfig.currentPage = currentPage;
this.search();
},
initSearch() {
this.handleCurrentChange(1)
this.handleCurrentChange(1);
},
search() {
this.loading = true
this.loading = true;
const param = {
conditions: []
}
conditions: [],
};
if (this.nikeName) {
param.conditions.push({
field: `dataset_table_task.name`,
operator: 'like',
value: this.nikeName
})
operator: "like",
value: this.nikeName,
});
}
const { currentPage, pageSize } = this.paginationConfig
const { currentPage, pageSize } = this.paginationConfig;
dsTable(currentPage, pageSize, this.params.id).then((response) => {
this.tableData = response.data.listObject
this.paginationConfig.total = response.data.itemCount
this.loading = false
})
}
}
}
this.tableData = response.data.listObject;
this.paginationConfig.total = response.data.itemCount;
this.loading = false;
});
},
},
};
</script>
<style lang="scss">
@ -198,13 +204,11 @@ export default {
line-height: 24px;
color: var(--deTextPrimary, #1f2329);
}
.table-container {
height: calc(100% - 50px);
}
.el-table__fixed-right::before {
background: transparent;
}
}
</style>
</style>

3
frontend/src/views/system/datasource/form.vue
View File

@ -3,7 +3,8 @@
</template>
<script>
export default {}
export default {
}
</script>
<style>