kyfx
/
api-testing
mirror of https://github.com/LinuxSuRen/api-testing.git
5
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

support to show database and tables

This commit is contained in:
rick 2025-02-27 08:46:12 +08:00
parent 35c828fe25
commit 8d87986c7c
No known key found for this signature in database
GPG Key ID: 260A80C757EC6783
1 changed files with 61 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

87
console/atest-ui/src/views/DataManager.vue
View File

@ -10,7 +10,25 @@ const sqlQuery = ref('')
const queryResult = ref([])
const columns = ref([])
const queryTip = ref('')
const databases = ref([])
const tables = ref([])
const currentDatabase = ref('')
interface Tree {
label: string
children?: Tree[]
}
const tablesTree: Tree[] = []
watch(tables, (t) => {
// clear tablesTree
tablesTree.splice(0, tablesTree.length)
t.forEach((i) => {
tablesTree.push({
label: i,
})
})
console.log(tablesTree)
})
watch(store, (s) => {
stores.value.forEach((e: Store) => {
if (e.name === s) {
@ -46,7 +64,7 @@ const ormDataHandler = (data) => {
const result = []
const cols = new Set()
data.Rows.forEach(e => {
data.items.forEach(e => {
const obj = {}
e.data.forEach(item => {
obj[item.key] = item.value
@ -55,6 +73,8 @@ const ormDataHandler = (data) => {
result.push(obj)
})
databases.value = data.meta.databases
tables.value = data.meta.tables
queryResult.value = result
columns.value = Array.from(cols).sort((a, b) => {
if (a === 'id') return -1;
@ -103,30 +123,45 @@ const executeQuery = async () => {
<template>
<div>
<el-form @submit.prevent="executeQuery">
<el-row :gutter="10">
<el-col :span="2">
<el-form-item>
<el-select v-model="store" placeholder="Select store">
<el-option v-for="item in stores" :key="item.name" :label="item.name"
:value="item.name" :disabled="!item.ready" :kind="item.kind.name"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="18">
<el-form-item>
<el-input v-model="sqlQuery" :placeholder="queryTip" @keyup.enter="executeQuery"></el-input>
</el-form-item>
</el-col>
<el-col :span="2">
<el-form-item>
<el-button type="primary" @click="executeQuery">Execute</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-table :data="queryResult">
<el-table-column v-for="col in columns" :key="col" :prop="col" :label="col"></el-table-column>
</el-table>
<el-container>
<el-aside width="200px">
<el-select v-model="currentDatabase" placeholder="Select database">
<el-option v-for="item in databases" :key="item" :label="item"
:value="item"></el-option>
</el-select>
<el-tree :data="tablesTree" />
</el-aside>
<el-container>
<el-header>
<el-form @submit.prevent="executeQuery">
<el-row :gutter="10">
<el-col :span="2">
<el-form-item>
<el-select v-model="store" placeholder="Select store">
<el-option v-for="item in stores" :key="item.name" :label="item.name"
:value="item.name" :disabled="!item.ready" :kind="item.kind.name"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="18">
<el-form-item>
<el-input v-model="sqlQuery" :placeholder="queryTip" @keyup.enter="executeQuery"></el-input>
</el-form-item>
</el-col>
<el-col :span="2">
<el-form-item>
<el-button type="primary" @click="executeQuery">Execute</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-header>
<el-main>
<el-table :data="queryResult">
<el-table-column v-for="col in columns" :key="col" :prop="col" :label="col"></el-table-column>
</el-table>
</el-main>
</el-container>
</el-container>
</div>
</template>