HC_YFZX
/
vue-vben-admin
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

基本配置模块完善

main
zzq 2024-03-20 17:27:32 +08:00
parent df07807df9
commit 07b6bb9a2f
5 changed files with 179 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/api/formdesign/index.ts
View File

@ -1,14 +1,16 @@
import { defHttp } from '@/utils/http/axios';
import { parseMinWidth } from 'element-plus/es/components/table/src/util';
import { DemoOptionsItem, selectParams, AccountListGetResultModel, AccountParams,NoOptionsParam } from './model/index';
enum Api {
FORMSTYPES_LIST = '/api/SysDataItemDetail/Load',
FORMS_LIST = '/api/FormScheme/LoadFormPage',
DATABASE_LIST = '/api/CodeTable/LoadCodeTablePage',
OUTKEY_LIST = '/api/CodeTable/GetForms',
GETBASE_LIST = '/api/FormScheme/GetForm',
ADDFORM_DATA = '/api/FormScheme/AddForm',
EDITFORM_DATA = '/api/FormScheme/UpdateForm?id='
FORMSTYPES_LIST = '/api/SysDataItemDetail/Load', //字典
FORMS_LIST = '/api/FormScheme/LoadFormPage', //查询表单列表
DATABASE_LIST = '/api/CodeTable/LoadCodeTablePage', //数据对象选择表
OUTKEY_LIST = '/api/CodeTable/GetForms', //获取数据表
GETBASE_LIST = '/api/FormScheme/GetForm', //获取列表详情
ADDFORM_DATA = '/api/FormScheme/AddForm', //新增表单设计
EDITFORM_DATA = '/api/FormScheme/UpdateForm?id=', //编辑表单设计
ADDSql_DATA = '/api/FormScheme/GetDataColName?dbCode=', // 添加编辑SQL
}
/**
@ -35,4 +37,8 @@ export const addFormDesignData = (params: NoOptionsParam) =>
export const editFormDesignData = (params: NoOptionsParam) =>
defHttp.post<AccountListGetResultModel>({ url: Api.EDITFORM_DATA+params.info.id, params });
export const addFormSqlData = (params: NoOptionsParam) =>
defHttp.post<AccountListGetResultModel>({ url: Api.ADDSql_DATA+params.dbCode+"&sql="+params.sql, params });

13
src/views/demo/onlineform/formdesign/FormModal.vue
View File

@ -135,18 +135,9 @@
console.log('adddata',data)
if(data.table){
data.table.forEach(item =>{
arr.push({
id: item.id,
name: item.name,
field: item.field,
comment: item.comment,
relationField: item.relationField,
relationName: item.relationName,
type: item.type
})
arr.push(item)
})
}
if(isAddVisible.value){ //新增
let schems
if(saveFormDatas.value.scheme.scheme){
@ -185,7 +176,6 @@
}
function submitClick(){
console.log('123333211',saveFormDatas)
isSubmitClick.value = true
@ -198,6 +188,7 @@
info: saveFormDatas.value.info,
scheme: saveFormDatas.value.scheme
}
console.log('param',param)
if(isAddVisible.value){
addFormDesignData( param ).then((res: AreaRespVO[]) =>{
console.log('addsuccess',res)

15
src/views/demo/onlineform/formdesign/form/index.data.ts
View File

@ -56,7 +56,7 @@ export const viewsColumns: BasicColumn[] = [
enable = false
}
const color = enable ? '#67c23a' : '#e6a23c';
const text = enable ? '主表' : '子表';
const text = enable ? '主' : '子';
return h(Tag, { color: color }, () => text);
},
},
@ -317,5 +317,18 @@ export const formSqlSchema: FormSchema[] = [
placeholder: '请输入',
},
},
{
field: 'sql',
component: 'InputTextArea',
label: 'SQL',
colProps: {
span: 24,
},
defaultValue: '',
required: true,
componentProps: {
placeholder: '@param 与主表关联参数值，比如 where id = @param;',
},
}
]

106
src/views/demo/onlineform/formdesign/form/index.vue
View File

@ -146,14 +146,14 @@
<BasicTable @register="registerViewsTable">
<template v-slot:bodyCell="{ column, record, index }">
<template v-if="column.key === 'relationFieldConnect'">
<div v-if="record.type == 'chlid'">
<div v-if="record.type !== 'main'">
<a-select
ref="select"
placeholder="请选择"
size="small"
v-model:value="record.field"
:options="record.outColumnKey"
:field-names="{ label: 'dbColumnName', value: 'dbColumnName' }"
:options="record.columns"
:field-names="{ label: 'label', value: 'value' }"
></a-select>
</div>
</template>
@ -185,14 +185,14 @@
<DataObject @register="registerModal" @backrows="handleBackRows" />
<sqlModal @register="registerSqlModal"></sqlModal>
<sqlModal @register="registerSqlModal" @backrows="handleSqlBackDatas"></sqlModal>
</template>
<script lang="ts" setup>
import { ref,defineProps,watch } from 'vue';
import { PlusOutlined } from '@ant-design/icons-vue';
import { message } from 'ant-design-vue';
import { getFormsTypeList,getOutKeyList } from '@/api/formdesign/index'
import { getOutKeyList } from '@/api/formdesign/index'
import { BasicForm, useForm } from '/@/components/Form';
import { formSchema , columns,connectColumns,viewsColumns } from './index.data';
@ -222,6 +222,7 @@
watch(()=>props.formScheme,(newValue,oldValue)=>{
if(newValue){
if(newValue.scheme.scheme){
console.log('newValue',newValue)
let schemObj = JSON.parse(newValue.scheme.scheme)
let obj = {
name: newValue.info.name,
@ -234,16 +235,22 @@
console.log('schemObj',schemObj)
setFieldsValue(obj)
setTimeout(()=>{
handleTableData(schemObj.db)
if(schemObj.rdb){
handleConnectTableData(schemObj.rdb)
if(newValue.info.formType == 1){
setTableDataViews(schemObj.db)
}else{
handleTableData(schemObj.db)
if(schemObj.rdb){
handleConnectTableData(schemObj.rdb)
}
}
},100)
}
}
},{immediate:true,deep:true})
watch(()=>props.isNextSteps,(newValue,oldValue)=>{
if(newValue){
validate()
let formArr = getFieldsValue()
if(!formArr.name || !formArr.category || !formArr.DbCode){
@ -252,7 +259,34 @@
}
if(formArr.formType==1){
emit('formDataNoBack');
let tableArr = getDataSourceViews()
let obj = {
form: formArr,
table: tableArr
}
let tabArr = []
if(tableArr && tableArr.length > 0){
if(tableArr.length == 1){
emit('formDataBack', obj);
}else{
tableArr.forEach(item =>{
if( item.type != 'main'){
tabArr.push(item.field)
}
})
}
}else{
emit('formDataNoBack');
message.error("请添加数据库表",2)
return
}
if(tabArr.includes(undefined)){
emit('formDataNoBack');
message.error("请完善数据库表信息",2)
}else{
emit('formDataBack', obj);
}
}else{
let tableArr = getDataSourceMain()
let connectTab = getDataSourceConnect()
@ -339,7 +373,7 @@
});
const [registerViewsTable, { setTableData:setTableDataViews, getDataSource:getDataSourceViews }] = useTable({
const [registerViewsTable, { reload:reloadViews,setTableData:setTableDataViews, getDataSource:getDataSourceViews }] = useTable({
title: '',
rowKey: 'id',
columns: viewsColumns,
@ -423,17 +457,6 @@
}
}
function handleAddSqlData() {
const anyformobj = ref<any>(myDataBaseFormRef.value.getFieldsValue());
if(anyformobj.value.DbCode){
openSqleModal(true, {});
}else{
message.warning("请选择数据库")
}
}
function handleDelete(record: Recordable) {
let arr = getDataSourceMain()
@ -635,9 +658,46 @@
setTableDataConnect(arr)
reloadConnect()
}
function handleAddSqlData() {
const anyformobj = ref<any>(myDataBaseFormRef.value.getFieldsValue());
let viesObj = getDataSourceViews() || []
if(anyformobj.value.DbCode){
openSqleModal(true, {DbCode:anyformobj.value.DbCode,length:viesObj.length});
}else{
message.warning("请选择数据库")
}
}
function handleSqlBackDatas(ModuleId = '') {
console.log('ModuleId',ModuleId)
let viesObj = getDataSourceViews() || []
console.log('viesObj',viesObj)
viesObj.push(ModuleId)
viesObj.forEach((item,index) =>{
item.index = index
if(index==0){
item.type = 'main'
}else{
item.type = 'chlid'
}
})
setTableDataViews(viesObj)
reloadViews()
}
function handleViewsDelete(record: Recordable) {
let arr = getDataSourceViews()
let newArr = []
arr.forEach(item =>{
if(item.index !== record.index){
newArr.push(item)
}
})
setTableDataViews(newArr)
reloadViews()
}
</script>
<style lang="less">
.l-rblock{

87
src/views/demo/onlineform/formdesign/form/sqlModal.vue
View File

@ -27,29 +27,76 @@
</template>
<script lang="ts" setup>
import { BasicModal, useModalInner } from '/@/components/Modal';
import { BasicForm, useForm } from '/@/components/Form';
import { formSqlSchema } from './index.data';
import { ref,defineProps,watch } from 'vue';
import { BasicModal, useModalInner } from '/@/components/Modal';
import { BasicForm, useForm } from '/@/components/Form';
import { formSqlSchema } from './index.data';
import { message } from 'ant-design-vue';
import { addFormSqlData } from '@/api/formdesign/index'
const emit = defineEmits(['backrows']);
const [registerModal, { closeModal, setModalProps }] = useModalInner((data: any) => {
})
const [registerForm, { getFieldsValue, setFieldsValue, resetFields, validate }] = useForm({
labelWidth: 100,
schemas: formSqlSchema,
showActionButtonGroup: false,
baseColProps: { lg: 24, md: 24 },
});
function modalSuReClick(){
const emit = defineEmits(['backrows']);
const receiveParam = ref()
const [registerModal, { closeModal, setModalProps }] = useModalInner((data: any) => {
console.log('dddd',data)
receiveParam.value = data
console.log('receiveParam',receiveParam)
setFieldsValue()
})
const [registerForm, { getFieldsValue, setFieldsValue, resetFields, validate }] = useForm({
labelWidth: 100,
schemas: formSqlSchema,
showActionButtonGroup: false,
baseColProps: { lg: 24, md: 24 },
});
// emit('backrows', rows);
closeModal()
}
function modalSuReClick(){
let objData = getFieldsValue()
let param = {
dbCode: receiveParam.value.DbCode,
sql: objData.sql
}
validate()
if(objData.name && objData.sql){
addFormSqlData(param).then((res: AreaRespVO[]) => {
let arr = []
res.forEach(item =>{
arr.push({
label: item,
value: item
})
})
let backObj = {
name: objData.name,
sql: objData.sql,
columns:arr,
basetable: ''
}
if(receiveParam.value.length>0){
if(objData.sql.includes('where')){
backObj.basetable = objData.sql.split('from ')[1].split(' where')[1]
}else{
message.warning("请在语句中设置关联参数")
return
}
}else{
backObj.basetable = objData.sql.split('from ')[1]
}
emit('backrows', backObj)
closeModal()
})
}
// emit('backrows', rows);
// closeModal()
}
</script>