|
|
@@ -1,135 +0,0 @@
|
|
|
-<script lang="ts" setup name="sql_data">
|
|
|
-import { cloneDeep } from 'lodash-es'
|
|
|
-import { getTableByList, getTableFieldsByList } from '@/api/database/dbApi'
|
|
|
-
|
|
|
-const state = reactive({
|
|
|
- layoutMode: 'table',
|
|
|
- sqlStatement: '',
|
|
|
- dataList: [],
|
|
|
- curPage: 1,
|
|
|
-})
|
|
|
-
|
|
|
-const fieldTypes = [
|
|
|
- { name: 'bigint(20)', value: 'bigint(20)' },
|
|
|
- { name: 'varchar(255)', value: 'varchar(255)' },
|
|
|
- { name: 'datetime', value: 'datetime' },
|
|
|
-]
|
|
|
-
|
|
|
-const onBlurEvent = (row: any, column?: any) => {
|
|
|
- const _row = cloneDeep(row)
|
|
|
- // const fieldName=row.fieldName
|
|
|
- // updateDB(row).then(() => {
|
|
|
- // ElMessage.success('修改成功!')
|
|
|
- // })
|
|
|
- window.console.log({ row, _row, name: column.title })
|
|
|
-}
|
|
|
-const onChangeEvent = (row: any) => {
|
|
|
- window.console.log({ row })
|
|
|
-}
|
|
|
-
|
|
|
-const onDel = (row: any) => {
|
|
|
- window.console.log({ row })
|
|
|
-}
|
|
|
-
|
|
|
-const init = async () => {
|
|
|
- const { data } = await getTableByList()
|
|
|
- if (data && data.length > 0) {
|
|
|
- const res = await getTableFieldsByList(data[0])
|
|
|
- state.dataList = res.data
|
|
|
- }
|
|
|
-}
|
|
|
-onMounted(() => {
|
|
|
- init()
|
|
|
-})
|
|
|
-defineExpose({
|
|
|
- init,
|
|
|
-})
|
|
|
-</script>
|
|
|
-
|
|
|
-<template>
|
|
|
- <div class="page-main">
|
|
|
- <tool-bar>
|
|
|
- <template #right>
|
|
|
- <div class="toolBar">
|
|
|
- <el-button title="刷新" circle text>
|
|
|
- <template #icon>
|
|
|
- <el-icon>
|
|
|
- <svg-icon name="ep:refresh" />
|
|
|
- </el-icon>
|
|
|
- </template>
|
|
|
- </el-button>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </tool-bar>
|
|
|
- <el-input v-model="state.sqlStatement" type="textarea" :rows="4" placeholder="请输入内容" clearable />
|
|
|
- <vxe-table
|
|
|
- class=".el-table list-table"
|
|
|
- border
|
|
|
- show-overflow
|
|
|
- :column-config="{ resizable: true }"
|
|
|
- :data="state.dataList"
|
|
|
- :edit-config="{ trigger: 'dblclick', mode: 'cell', showIcon: false }"
|
|
|
- >
|
|
|
- <vxe-column type="seq" width="60" />
|
|
|
- <vxe-column field="comment" title="comment" :edit-render="{ autofocus: '.vxe-input--inner' }">
|
|
|
- <template #edit="{ row, column }">
|
|
|
- <vxe-input v-model="row.comment" type="text" @blur="onBlurEvent(row, column)" />
|
|
|
- </template>
|
|
|
- </vxe-column>
|
|
|
- <vxe-column field="defaultValue" title="defaultValue" :edit-render="{ autofocus: '.vxe-input--inner' }">
|
|
|
- <template #edit="{ row }">
|
|
|
- <vxe-input v-model="row.defaultValue" type="text" @blur="onBlurEvent(row)" />
|
|
|
- </template>
|
|
|
- </vxe-column>
|
|
|
- <vxe-column field="extra" title="extra" :edit-render="{ autofocus: '.vxe-input--inner' }">
|
|
|
- <template #edit="{ row }">
|
|
|
- <vxe-input v-model="row.extra" type="text" @blur="onBlurEvent(row)" />
|
|
|
- </template>
|
|
|
- </vxe-column>
|
|
|
- <vxe-column field="fieldName" title="fieldName" :edit-render="{ autofocus: '.vxe-input--inner' }">
|
|
|
- <template #edit="{ row }">
|
|
|
- <vxe-input v-model="row.fieldName" type="text" @blur="onBlurEvent(row)" />
|
|
|
- </template>
|
|
|
- </vxe-column>
|
|
|
- <vxe-column field="accident_cat_id" title="accident_cat_id" :edit-render="{ autofocus: '.vxe-input--inner' }">
|
|
|
- <template #edit="{ row }">
|
|
|
- <vxe-input v-model="row.accident_cat_id" type="text" @blur="onBlurEvent(row)" />
|
|
|
- </template>
|
|
|
- </vxe-column>
|
|
|
- <vxe-column field="fieldType" title="fieldType" :edit-render="{ autofocus: '.vxe-input--inner' }">
|
|
|
- <template #edit="{ row }">
|
|
|
- <el-select v-model="row.fieldType" @chanbge="onChangeEvent(row)">
|
|
|
- <el-option v-for=" item in fieldTypes" :key="item.value" :value="item.value" :label="item.name" />
|
|
|
- </el-select>
|
|
|
- </template>
|
|
|
- </vxe-column>
|
|
|
- <vxe-column field="key" title="key" :edit-render="{ autofocus: '.vxe-input--inner' }">
|
|
|
- <template #edit="{ row }">
|
|
|
- <vxe-input v-model="row.key" type="text" @blur="onBlurEvent(row)" />
|
|
|
- </template>
|
|
|
- </vxe-column>
|
|
|
- <vxe-column field="nullable" title="nullable" :edit-render="{ autofocus: '.vxe-input--inner' }">
|
|
|
- <template #edit="{ row }">
|
|
|
- <el-select v-model="row.nullable" @chanbge="onChangeEvent(row)">
|
|
|
- <el-option :value="1" label="YES" />
|
|
|
- <el-option :value="0" label="NO" />
|
|
|
- </el-select>
|
|
|
- </template>
|
|
|
- </vxe-column>
|
|
|
- <vxe-column field="操作" title="操作" width="200" align="center">
|
|
|
- <template #default="{ row }">
|
|
|
- <el-button type="danger" size="small" plain @click="onDel(row)">
|
|
|
- 删除
|
|
|
- </el-button>
|
|
|
- </template>
|
|
|
- </vxe-column>
|
|
|
- </vxe-table>
|
|
|
- <el-pagination v-model:current-page="state.curPage" :total="100" layout="total, sizes, ->, prev, pager, next, jumper" style="padding:10px 0" />
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<style lang="scss" scoped>
|
|
|
- .page-main{
|
|
|
- padding: 10px;
|
|
|
- }
|
|
|
-</style>
|