Skip to content

S
SEMI
提交 1e161b69 authored 作者: 刘旭's avatar 刘旭
浏览文件
操作

完成表单配置页面

上级 a824d5d6
隐藏空白字符变更
内嵌 并排
正在显示 包含 130 行增加 和 18 行删除
src/services/api/systemApi/formConfiguration/formConfiguration.ts
浏览文件 @ 1e161b69
......@@ -30,4 +30,12 @@ export function deleteStructure(id: number, dbTableName: string) {
method: "delete",
params: { id, dbTableName }
});
}
export function deleteStructureData(id: number, dbTableName: string) {
return request({
url: "/api/form/table/structure/data/delete",
method: "delete",
params: { id, dbTableName }
});
}
\ No newline at end of file
src/views/manage/formConfiguration.vue
浏览文件 @ 1e161b69
<template>
<div class="app-container">
<el-button type="primary" @click="handleAdd" style="margin-bottom: 20px;">添加</el-button>
<el-space style="margin-bottom: 20px;">
<span style="font-size: 14px;">表单标识：</span>
<el-input v-model="searchValue" placeholder="请输入表单标识" style="margin-right: 20px;" />
<el-button type="primary" @click="handleScreen">筛选</el-button>
</el-space>
<el-button type="primary" @click="handleAdd" style="margin-bottom: 20px; display: block;">添加</el-button>
<el-table v-loading="loading" :data="tableList" border stripe style="width: 100%">
<el-table-column prop="formId" label="表单标识" align="center" />
<el-table-column prop="dbTableName" label="数据库表名称" align="center" />
......@@ -18,12 +23,14 @@
</template>
</el-table-column>
</el-table>
<div style="margin-top: 20px">
<el-pagination v-model:currentPage="tablePage.pageNo" v-model:page-size="tablePage.pageSize"
:page-sizes="[10, 15, 20]" layout="->, total,sizes, prev, pager, next, jumper" :total="tablePage.total"
@size-change="handleSizeChange" @current-change="handleCurrentChange" hide-on-single-page />
</div>
<!-- 详情页面 -->
<el-drawer v-model="visible" :title="title" size="80%" @close="handleClose">
<!-- <el-space v-if="title !== '详情'" style="margin-bottom: 20px;">
<span>表单标识</span>
<el-input v-model="fromIdValue" />
</el-space> -->
<ElDesignForm ref="jsonRef" />
<template #footer>
<span>
......@@ -33,8 +40,23 @@
</template>
</el-drawer>
<!-- 数据页面 -->
<el-dialog v-model="dialogVisible" title="数据" witch="50%">
123
<el-dialog v-model="dialogVisible" v-loading="loadingDialog" title="数据" witch="60%" @close="handleCloseDialog">
<el-table :data="dataList" border stripe>
<el-table-column v-for="item in fieldList" :prop="item.key" :label="item.fieldName" width="200"
align="center"></el-table-column>
<el-table-column label="操作" align="center" width="100" fixed="right">
<template #default="scope">
<el-button link type="danger" size="small" @click="deleteData(scope.row.id)">删除</el-button>
</template>
</el-table-column>
</el-table>
<div style="margin-top: 20px">
<el-pagination v-model:currentPage="tablePageDialog.pageNo" v-model:page-size="tablePageDialog.pageSize"
:page-sizes="[10, 15, 20]" layout="->, total,sizes, prev, pager, next, jumper"
:total="tablePageDialog.total" @size-change="handleSizeChangeDialog"
@current-change="handleCurrentChangeDialog" hide-on-single-page />
</div>
</el-dialog>
</div>
</template>
......@@ -42,15 +64,55 @@
<script setup lang="ts">
import { ref, nextTick } from 'vue'
import { ElMessage, ElMessageBox } from "element-plus";
import { getStructureList, saveStructure, getStructureData, deleteStructure } from '@/services/api/systemApi/formConfiguration/formConfiguration'
import { getStructureList, saveStructure, getStructureData, deleteStructure, deleteStructureData } from '@/services/api/systemApi/formConfiguration/formConfiguration'
const visible = ref(false)
const dialogVisible = ref(false)
const loading = ref(true)
const loadingDialog = ref(true)
const searchValue = ref('')
const tableList = ref()
const jsonRef = ref()
const title = ref('详情')
const structureId = ref()
const dataList = ref()
const fieldList = ref()
const formId = ref()
const dbTableName = ref()
const tablePage = ref({
pageNo: 1,
pageSize: 10,
total: 0
})
const tablePageDialog = ref({
pageNo: 1,
pageSize: 10,
total: 0
})
// 每页新条数
const handleSizeChange = (val: number) => {
tablePage.value.pageSize = val
init(searchValue.value, tablePage.value.pageNo, tablePage.value.pageSize)
};
// 新页数
const handleCurrentChange = (val: number) => {
tablePage.value.pageNo = val
init(searchValue.value, tablePage.value.pageNo, tablePage.value.pageSize)
};
// 每页新条数
const handleSizeChangeDialog = (val: number) => {
tablePageDialog.value.pageSize = val
initStructureData(formId.value, tablePageDialog.value.pageNo, tablePageDialog.value.pageSize)
};
// 新页数
const handleCurrentChangeDialog = (val: number) => {
tablePageDialog.value.pageNo = val
initStructureData(formId.value, tablePageDialog.value.pageNo, tablePageDialog.value.pageSize)
};
const handleScreen = () => init(searchValue.value, tablePage.value.pageNo, tablePage.value.pageSize)
const handleAdd = () => {
title.value = '添加'
......@@ -71,10 +133,10 @@ const handleEdit = (row: any) => {
}
const handleQuery = (row: any) => {
getStructureData(row.formId).then((res: any) => {
console.log(res);
})
formId.value = row.formId
dbTableName.value = row.dbTableName
dialogVisible.value = true
initStructureData(formId.value, tablePageDialog.value.pageNo, tablePageDialog.value.pageSize)
}
const handleDelete = (row: any) => {
......@@ -84,7 +146,25 @@ const handleDelete = (row: any) => {
{ confirmButtonText: '确认', cancelButtonText: '取消', type: 'warning' })
.then(() => {
deleteStructure(row.id, row.dbTableName).then((res: any) => {
if(res.code === 200) init()
if (res.code === 200) {
init(searchValue.value, tablePage.value.pageNo, tablePage.value.pageSize)
ElMessage({ type: 'success', message: '删除成功' })
}
})
}).catch(() => { return false })
}
const deleteData = (id: any) => {
ElMessageBox.confirm(
'确定删除?',
'数据',
{ confirmButtonText: '确认', cancelButtonText: '取消', type: 'warning' })
.then(() => {
deleteStructureData(id, dbTableName.value).then((res: any) => {
if (res.code === 200) {
initStructureData(formId.value, tablePageDialog.value.pageNo, tablePageDialog.value.pageSize)
ElMessage({ type: 'success', message: '删除成功' })
}
})
}).catch(() => { return false })
}
......@@ -95,16 +175,18 @@ const onConfirm = () => {
saveStructure(json).then((res: any) => {
if (res.code === 200) {
jsonRef.value.clear()
init()
init(searchValue.value, tablePage.value.pageNo, tablePage.value.pageSize)
visible.value = false
ElMessage({ type: 'success', message: '添加成功' })
}
})
} else {
saveStructure(json, structureId.value).then((res: any) => {
if (res.code === 200) {
jsonRef.value.clear()
init()
init(searchValue.value, tablePage.value.pageNo, tablePage.value.pageSize)
visible.value = false
ElMessage({ type: 'success', message: '编辑成功' })
}
})
}
......@@ -115,16 +197,37 @@ const handleClose = () => {
visible.value = false
}
const init = () => {
getStructureList().then((res: any) => {
const handleCloseDialog = () => {
dialogVisible.value = false
loadingDialog.value = true
dataList.value = undefined
fieldList.value = undefined
}
const initStructureData = (formId: string, pageNo?: number, pageSize?: number) => {
getStructureData(formId, pageNo, pageSize).then((res: any) => {
if (res.code === 200) {
dataList.value = res.data.dataList
fieldList.value = res.data.fieldList
tablePageDialog.value.total = res.data.total
loadingDialog.value = true
} else {
dataList.value = undefined
fieldList.value = undefined
}
})
}
const init = (formId?: string, pageNo?: number, pageSize?: number) => {
getStructureList(formId, pageNo, pageSize).then((res: any) => {
if (res.code === 200) {
loading.value = false
tableList.value = res.data.records
tablePage.value.total = res.data.total
}
console.log(res);
})
}
init()
init(searchValue.value, tablePage.value.pageNo, tablePage.value.pageSize)
</script>
<style lang="scss">
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论