Skip to content

Commit a337594

Browse files
XiaJunjie2020XiaJunjie2020
committed
feat: edit table[comment], field[comment, checked]
1 parent 76bff9c commit a337594

File tree

6 files changed

+125
-111
lines changed

6 files changed

+125
-111
lines changed

‎backend/apps/datasource/api/datasource.py‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
from fastapi import APIRouter
22
from ..crud.datasource import get_datasource_list, check_status, create_ds, update_ds, delete_ds, getTables, getFields, \
3-
execSql, update_table_and_fields, getTablesByDs, chooseTables
3+
execSql, update_table_and_fields, getTablesByDs, chooseTables, preview
44
from common.core.deps import SessionDep
55
from ..models.datasource import CoreDatasource, CreateDatasource, EditObj, CoreTable
66
from ..crud.table import get_tables_by_ds_id
@@ -73,3 +73,8 @@ async def field_list(session: SessionDep, id: int):
7373
@router.post("/editLocalComment")
7474
async def edit_local(session: SessionDep, data: EditObj):
7575
update_table_and_fields(session, data)
76+
77+
78+
@router.post("/previewData/{id}")
79+
async def edit_local(session: SessionDep, id: int, data: EditObj):
80+
return preview(session, id, data)

‎backend/apps/datasource/crud/datasource.py‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -167,3 +167,11 @@ def update_table_and_fields(session: SessionDep, data: EditObj):
167167
update_table(session, data.table)
168168
for field in data.fields:
169169
update_field(session, field)
170+
171+
172+
def preview(session: SessionDep, id: int, data: EditObj):
173+
ds = session.query(CoreDatasource).filter(CoreDatasource.id == id).first()
174+
sql: str = ""
175+
if ds.type == "mysql":
176+
sql = f"""SELECT {", ".join([f.field_name for f in data.fields if f.checked])} FROM {data.table.table_name} LIMIT 100"""
177+
return exec_sql(ds, sql)

‎backend/apps/datasource/crud/field.py‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,12 @@ def delete_field_by_ds_id(session: SessionDep, id: int):
99

1010

1111
def get_fields_by_table_id(session: SessionDep, id: int):
12-
return session.query(CoreField).filter(CoreField.table_id == id).order_by(
13-
CoreField.field_name.asc()).all()
12+
return session.query(CoreField).filter(CoreField.table_id == id).all()
1413

1514

1615
def update_field(session: SessionDep, item: CoreField):
17-
session.add(item)
16+
record = session.query(CoreField).filter(CoreField.id == item.id).first()
17+
record.checked = item.checked
18+
record.custom_comment = item.custom_comment
19+
session.add(record)
1820
session.commit()

‎backend/apps/datasource/crud/table.py‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,5 +14,8 @@ def get_tables_by_ds_id(session: SessionDep, id: int):
1414

1515

1616
def update_table(session: SessionDep, item: CoreTable):
17-
session.add(item)
17+
record = session.query(CoreTable).filter(CoreTable.id == item.id).first()
18+
record.checked = item.checked
19+
record.custom_comment = item.custom_comment
20+
session.add(record)
1821
session.commit()

‎frontend/src/api/datasource.ts‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,5 +11,8 @@ export const datasourceApi = {
1111
getFields: (id: Number, table_name: string) => request.post(`/datasource/getFields/${id}/${table_name}`),
1212
execSql: (id: Number, sql: string) => request.post(`/datasource/execSql/${id}/${sql}`),
1313
chooseTables: (id: Number, data: any) => request.post(`/datasource/chooseTables/${id}`, data),
14-
tableList: (id: Number) => request.post(`/datasource/tableList/${id}`)
14+
tableList: (id: Number) => request.post(`/datasource/tableList/${id}`),
15+
fieldList: (id: Number) => request.post(`/datasource/fieldList/${id}`),
16+
edit: (data: any) => request.post('/datasource/editLocalComment', data),
17+
previewData: (id: Number, data: any) => request.post(`/datasource/previewData/${id}`, data),
1518
}

‎frontend/src/views/ds/TableList.vue‎

Lines changed: 98 additions & 105 deletions
Original file line numberDiff line numberDiff line change
@@ -5,145 +5,132 @@
55
<el-button text :icon="ArrowLeft" @click="back()" />
66
{{ props.dsName }}
77
</div>
8-
<el-button type="primary" @click="save()">
9-
Save
10-
</el-button>
118
</el-row>
12-
<el-row class="data">
13-
<el-table-v2
14-
:columns="tableColumns"
15-
:data="tableData"
16-
:width="1000"
17-
:height="800"
18-
fixed
19-
/>
9+
<el-row class="container">
10+
<el-col :span="4">
11+
Tables
12+
<el-input v-model="searchValue" />
13+
<div>
14+
<div v-for="item in tableList" class="table-item" @click="clickTable(item)">{{ item.table_name }}</div>
15+
</div>
16+
</el-col>
17+
<el-col :span="20">
18+
<div v-if="fieldList.length === 0">No data</div>
19+
<div v-else>
20+
<div style="display: flex;justify-content: space-between;align-items: center;">
21+
<div style="display: flex;justify-content: start;align-items: center;">
22+
<span>{{ currentTable.table_name }}</span>
23+
<span>&nbsp;|&nbsp;</span>
24+
<span>
25+
<el-input v-model="currentTable.custom_comment" />
26+
</span>
27+
</div>
28+
<el-button type="primary" @click="save()">
29+
Save
30+
</el-button>
31+
</div>
32+
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
33+
<el-tab-pane label="Table Schema" name="schema">
34+
<el-table :data="fieldList" style="width: 100%">
35+
<el-table-column prop="field_name" label="Name" width="180" />
36+
<el-table-column prop="field_type" label="Type" width="180" />
37+
<el-table-column prop="field_comment" label="Comment" />
38+
<el-table-column label="Custom Comment">
39+
<template #default="scope">
40+
<div style="display: flex; align-items: center">
41+
<el-input v-model="scope.row.custom_comment" />
42+
</div>
43+
</template>
44+
</el-table-column>
45+
<el-table-column label="Status" width="180">
46+
<template #default="scope">
47+
<div style="display: flex; align-items: center">
48+
<el-switch
49+
v-model="scope.row.checked"
50+
size="small"
51+
/>
52+
</div>
53+
</template>
54+
</el-table-column>
55+
</el-table>
56+
</el-tab-pane>
57+
<el-tab-pane label="Preview" name="preview">
58+
<div>Preview 100 items</div>
59+
<el-table :data="previewData.data" style="width: 100%;height: 600px;">
60+
<el-table-column v-for="c in previewData.fields" :prop="c" :label="c"/>
61+
</el-table>
62+
</el-tab-pane>
63+
</el-tabs>
64+
</div>
65+
</el-col>
2066
</el-row>
21-
<el-drawer
22-
v-model="drawer"
23-
direction="btt"
24-
:destroy-on-close="true"
25-
:close-on-click-modal="false"
26-
size="80%"
27-
>
28-
<template #header>
29-
<div>Detail</div>
30-
</template>
31-
<template #default>
32-
<el-row :gutter="20">
33-
<el-table-v2
34-
:columns="fieldColumns"
35-
:data="fieldData"
36-
:width="1000"
37-
:height="800"
38-
fixed
39-
/>
40-
</el-row>
41-
</template>
42-
<template #footer>
43-
<div style="flex: auto">
44-
<el-button @click="cancelClick">Cancel</el-button>
45-
<el-button type="primary" @click="confirmClick">Confirm</el-button>
46-
</div>
47-
</template>
48-
</el-drawer>
4967
</div>
5068
</template>
5169

5270
<script lang="tsx" setup>
5371
import { ref } from 'vue'
5472
import { datasourceApi } from '@/api/datasource'
55-
import { ElButton } from 'element-plus'
56-
import { h } from 'vue'
5773
import { onMounted } from 'vue'
5874
import { ArrowLeft } from '@element-plus/icons-vue'
75+
import type { TabsPaneContext } from 'element-plus'
5976
6077
const props = defineProps({
6178
dsId: { type: [Number], required: true },
6279
dsName: { type: [String], required: true }
6380
})
6481
65-
const drawer = ref<boolean>(false)
66-
const tableColumns = ref<any>([
67-
{
68-
key:"tableName",
69-
dataKey:"tableName",
70-
title: 'Table Name',
71-
width: 150,
72-
},
73-
{
74-
key:"tableComment",
75-
dataKey:"tableComment",
76-
title: 'Table Comment',
77-
width: 300,
78-
},
79-
{
80-
key: 'operations',
81-
title: 'Operations',
82-
cellRenderer: ({ rowData }: { rowData: any }) => {
83-
return h(ElButton,{
84-
onClick: () => showFields(rowData.tableName)
85-
},"Show Fields")
86-
},
87-
width: 150,
88-
align: 'center',
89-
}
90-
])
91-
const tableData = ref<any>([])
92-
const fieldColumns = ref<any>([
93-
{
94-
key:"fieldName",
95-
dataKey:"fieldName",
96-
title: 'Field Name',
97-
width: 150,
98-
},
99-
{
100-
key:"fieldType",
101-
dataKey:"fieldType",
102-
title: 'Field Type',
103-
width: 150,
104-
},
105-
{
106-
key:"fieldComment",
107-
dataKey:"fieldComment",
108-
title: 'Field Comment',
109-
width: 300,
110-
}
111-
])
112-
const fieldData = ref<any>([])
11382
const dsId = ref<Number>(0)
83+
const searchValue = ref('')
84+
const tableList = ref<any>([])
85+
const currentTable = ref<any>({})
86+
const fieldList = ref<any>([])
87+
const previewData = ref<any>({})
88+
89+
const activeName = ref('schema')
90+
91+
const buildData = () => {
92+
return {"table": currentTable.value, "fields": fieldList.value}
93+
}
11494
11595
const back = () => {
11696
history.back()
11797
}
11898
11999
const save = () => {
120-
121-
}
122-
123-
const showFields = (tableName: string) =>{
124-
drawer.value = true
125-
datasourceApi.getFields(dsId.value, tableName).then((res) => {
126-
fieldData.value = res
100+
datasourceApi.edit(buildData()).then(() => {
101+
ElMessage({
102+
message: 'Save success',
103+
type: 'success',
104+
showClose: true
105+
})
127106
})
128107
}
129108
130-
const cancelClick = () => {
131-
drawer.value = false
109+
const clickTable = (table: any) => {
110+
currentTable.value = table
111+
datasourceApi.fieldList(table.id).then((res) => {
112+
fieldList.value = res
113+
datasourceApi.previewData(dsId.value, buildData()).then((res) => {
114+
previewData.value = res
115+
})
116+
})
132117
}
133118
134-
const confirmClick = () => {
135-
// save something
136-
cancelClick()
119+
const handleClick = (tab: TabsPaneContext) => {
120+
if(tab.paneName === 'preview') {
121+
datasourceApi.previewData(dsId.value, buildData()).then((res) => {
122+
previewData.value = res
123+
})
124+
}
137125
}
138126
139127
onMounted(() => {
140128
dsId.value = props.dsId
141-
datasourceApi.getTables(props.dsId).then((res) => {
142-
tableData.value = res
129+
fieldList.value = []
130+
datasourceApi.tableList(props.dsId).then((res) => {
131+
tableList.value = res
143132
})
144133
})
145-
146-
defineExpose({ open })
147134
</script>
148135

149136
<style lang="less" scoped>
@@ -158,5 +145,11 @@ defineExpose({ open })
158145
display: flex;
159146
align-items: center;
160147
}
148+
.container{
149+
height: 100%;
150+
.table-item{
151+
margin: 10px;
152+
}
153+
}
161154
}
162155
</style>

0 commit comments

Comments
 (0)