<template>
|
<app-dialog-form
|
v-bind="dialogFormProps"
|
>
|
<div class="wrapper">
|
<app-layout-row>
|
<app-layout-col :span="24">
|
<div class="form">
|
<el-form :model="form" label-width="auto">
|
<el-form-item label="表名">
|
<el-input v-model="form.name"/>
|
</el-form-item>
|
</el-form>
|
<el-button size="small" type="primary" @click="onGetList"
|
v-loading="appStore.getLoading('getTableMetaByName')">
|
查询
|
</el-button>
|
</div>
|
</app-layout-col>
|
<app-layout-col :span="24">
|
<app-table-list v-bind="tableListProps"/>
|
</app-layout-col>
|
</app-layout-row>
|
</div>
|
</app-dialog-form>
|
</template>
|
|
<script setup>
|
import {useEntityStore, useAppStore} from '@/store/modules';
|
import {modal} from '@/plugins';
|
import {meta} from '@/hooks';
|
import * as api from './api.js';
|
import * as tools from '@/utils/tools.js';
|
|
const {useMetaData} = meta;
|
|
const entityStore = useEntityStore();
|
const appStore = useAppStore();
|
|
const props = defineProps({
|
subSubmit: {
|
type: Function,
|
default: () => {
|
}
|
}
|
});
|
|
|
const [columns, filters, fields] = useMetaData(
|
'fee_model_band_column',
|
({columnsTools}) => {
|
}
|
);
|
|
const form = reactive({
|
name: '',
|
});
|
|
const tableListRef = ref();
|
|
const tableListProps = {
|
rowKey: 'fieldname',
|
selection: true,
|
ref: tableListRef,
|
title: '字段列表',
|
columns
|
};
|
|
const dialogFormRef = ref();
|
|
const dialogFormProps = {
|
title: '字段选择',
|
ref: dialogFormRef,
|
subSubmit: async () => {
|
const selected = tableListRef.value.getSelectedList();
|
if (selected.length === 0) {
|
modal.msgError('请选择字段！');
|
throw '';
|
}
|
selected.forEach(e => {
|
e.id = tools.uuid();
|
})
|
props.subSubmit(selected);
|
},
|
subReset: async () => {
|
onReset();
|
}
|
};
|
|
const onGetList = async () => {
|
if (!form.name) {
|
modal.msgError("请输入表名！");
|
return;
|
}
|
try {
|
const {meta} = await api.getTableMetaByName({
|
name: form.name
|
});
|
tableListRef.value.setTableData(meta);
|
} catch (e) {
|
modal.msgError("未查到相关数据！");
|
}
|
}
|
|
|
const onReset = () => {
|
form.name = '';
|
tableListRef.value.setTableData([]);
|
tableListRef.value.setSelected([]);
|
}
|
|
const onOpen = async () => {
|
dialogFormRef.value.onOpen();
|
await nextTick();
|
onReset();
|
}
|
|
defineExpose({
|
onOpen
|
});
|
|
</script>
|
|
<style lang='scss'>
|
.wrapper {
|
.form {
|
display: flex;
|
align-items: baseline;
|
}
|
|
.el-button {
|
margin-left: 10px;
|
}
|
}
|
</style>
|
