Commit 282ab2c9 authored by 罗林杰's avatar 罗林杰

修改sql审核

parent 6fb21cea
......@@ -85,7 +85,7 @@
return treeData !== '' ? treeData : data;
}
const getTitle = computed(() => (!unref(isUpdate) ? '新建主体' : '编辑主体'));
const getTitle = computed(() => (!unref(isUpdate) ? '新建文件夹' : '编辑主体'));
async function handleSubmit() {
try {
......
<template>
<div class="m-4 mr-0 overflow-hidden bg-white">
<div class="m-4 mr-0 overflow-hidden bg-white" style="margin-bottom: -20px">
<BasicTree
ref="treeRef1"
toolbar
search
treeWrapperClassName="h-[calc(100%-35px)] overflow-auto"
:clickRowToExpand="true"
:defaultExpandAll="true"
:treeData="treeData"
:fieldNames="{ key: 'businessId', title: 'label'}"
@select="handleSelect"
/>
</div>
<a-input placeholder="" style="margin: 10px 0;">
<div class="overflow-hidden bg-white">
<a-input placeholder="" style="margin: 10px 0">
<template #prefix>
<Icon icon="ant-design:search-outlined" :size="20" />
</template>
......@@ -28,75 +15,69 @@
:treeData="treeDataTwo"
:fieldNames="{ key: 'selectedDeptId', title: 'name' }"
@select="handleSelect"
/>
</div>
</template>
<script lang="ts" setup>
import { nextTick, onMounted, ref, unref } from 'vue';
import { BasicTree, TreeActionType, TreeItem } from '@/components/Tree';
import { Nullable } from '@vben/types';
import { treeDataList, treeDataListTwo } from './mock';
import Icon from "@/components/Icon/Icon.vue";
import {tableList} from "./mock";
defineOptions({ name: 'DeptTree' });
const emit = defineEmits(['select']);
const treeData = ref<TreeItem[]>([]);
const treeDataTwo = ref<TreeItem[]>([]);
const treeRef1 = ref<Nullable<TreeActionType>>(null);
const treeRef2 = ref<Nullable<TreeActionType>>(null);
async function fetch() {
// 合并树形数据和表格数据
treeData.value = mergeTreeDataWithTableList(treeDataListTwo, tableList);
treeData.value = treeDataList;
treeDataTwo.value = treeDataListTwo;
await nextTick(() => {
getTree(treeRef1).expandAll(true);
getTree(treeRef2).expandAll(true);
});
}
import { nextTick, onMounted, ref, unref } from 'vue';
import { BasicTree, TreeActionType, TreeItem } from '@/components/Tree';
import { Nullable } from '@vben/types';
import { treeDataListTwo, tableList } from './mock';
import Icon from '@/components/Icon/Icon.vue';
defineOptions({ name: 'DeptTree' });
const emit = defineEmits(['select']);
const treeData = ref<TreeItem[]>([]);
const treeDataTwo = ref<TreeItem[]>([]);
const treeRef1 = ref<Nullable<TreeActionType>>(null);
const treeRef2 = ref<Nullable<TreeActionType>>(null);
async function fetch() {
// 合并树形数据和表格数据
treeData.value = mergeTreeDataWithTableList(treeDataListTwo, tableList);
treeDataTwo.value = treeDataListTwo;
await nextTick(() => {
getTree(treeRef1).expandAll(true);
getTree(treeRef2).expandAll(true);
});
}
// 合并数据的函数
function mergeTreeDataWithTableList(treeDataListTwo, tableList) {
return treeDataListTwo.map((treeNode) => {
// 找到对应的tableList项,合并name属性
const tableItem = tableList.find((item) => item.selectedDeptId === treeNode.selectedDeptId);
if (tableItem) {
treeNode.name = tableItem.name; // 将tableList中的name添加到treeNode
}
// 合并数据的函数
function mergeTreeDataWithTableList(treeDataListTwo, tableList) {
return treeDataListTwo.map((treeNode) => {
// 找到对应的tableList项,合并name属性
const tableItem = tableList.find((item) => item.selectedDeptId === treeNode.selectedDeptId);
if (tableItem) {
treeNode.name = tableItem.name; // 将tableList中的name添加到treeNode
}
// 如果有子节点,递归处理
if (treeNode.children && treeNode.children.length > 0) {
treeNode.children = mergeTreeDataWithTableList(treeNode.children, tableList);
}
return treeNode;
});
}
// 如果有子节点,递归处理
if (treeNode.children && treeNode.children.length > 0) {
treeNode.children = mergeTreeDataWithTableList(treeNode.children, tableList);
function getTree(treeRef) {
const tree = unref(treeRef);
if (!tree) {
throw new Error('tree is null!');
}
return treeNode;
});
}
function getTree(treeRef) {
const tree = unref(treeRef);
if (!tree) {
throw new Error('tree is null!');
return tree;
}
return tree;
}
function handleSelect(selectedDeptId) {
emit('select', selectedDeptId[0]);
console.log('selectedDeptId:', selectedDeptId);
}
function handleSelect(selectedDeptId) {
emit('select', selectedDeptId[0]);
console.log('selectedDeptId:', selectedDeptId);
}
onMounted(() => {
fetch();
});
onMounted(() => {
fetch();
});
</script>
<template>
<BasicModal v-bind="$attrs" @register="registerModal" :title="title" @ok="handleSubmit">
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { addFileFormSchema } from './mainBody.data';
import { useMessage } from '@/hooks/web/useMessage';
import { TreeData } from './mock';
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
let isBucket = ref();
const title = ref('');
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { updateSchema, resetFields }] = useForm({
baseColProps: { span: 24 },
schemas: addFileFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
isBucket.value = data.isBacket;
title.value = data.title;
// //重置表单数据
resetFields();
setModalProps({ confirmLoading: false });
const treeList = handleTree(TreeData, 'businessId', undefined, undefined, undefined);
updateSchema([
{
field: 'taskId',
componentProps: {
treeData: treeList,
},
},
]);
});
/**确定按钮*/
async function handleSubmit() {
if (isBucket.value === 1) {
createMessage.success('新建文件夹成功!');
} else {
createMessage.success('新建文件成功!');
}
closeModal();
}
/**数组对象转成树*/
function handleTree(data, id, parentId, children, rootId) {
id = id || 'id';
parentId = parentId || 'parentId';
children = children || 'children';
rootId =
rootId ||
Math.min.apply(
Math,
data.map((item) => {
return item[parentId];
}),
) ||
0;
// 对源数据深度克隆
const cloneData = JSON.parse(JSON.stringify(data));
// 循环所有项
const treeData = cloneData.filter((father) => {
const branchArr = cloneData.filter((child) => {
// 返回每一项的子级数组
return father[id] === child[parentId];
});
branchArr.length > 0 ? (father.children = branchArr) : '';
// 返回第一层
return father[parentId] === rootId;
});
return treeData !== '' ? treeData : data;
}
</script>
<template >
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex" >
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex flex-col" class="toolbar" style="width: 910px;">
<div class="toolbar" style="background: white" >
<div class="tools" >
<template>
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<PageWrapper
dense
contentFullHeight
fixedHeight
contentClass="flex flex-col"
class="toolbar"
style="width: 910px"
>
<div class="toolbar" style="background: white">
<div class="tools">
<a-button type="primary" style="float: right; margin: 10px 15px 10px 0">保存</a-button>
</div>
</div>
<BasicForm
style="background: white"
size="middle"
:bordered="false"
:column="2"
:model="info"
@register="registerGuideModeForm"
style="background: white"
size="middle"
:bordered="false"
:column="2"
:model="info"
@register="registerGuideModeForm"
>
<template #ruleContentSlot>
<div class="editor">
......@@ -25,89 +30,99 @@
<template #buttonSlot>
<div class="buttonVerification">
<a-button style="margin-left: 100px; width: 80px" type="primary">检查</a-button>
<Alert style="height: 34px; margin-left: 10px; " message="检查通过" type="success" show-icon closable />
<Alert style="height: 34px; margin-left: 10px; display: none;" message="检查信息说明" type="info" show-icon closable />
<Alert style="height: 34px; margin-left: 10px; display: none;" message="检查异常" type="warning" show-icon closable />
<Alert style="height: 34px; margin-left: 10px; display: none;" message="检查错误" type="error" show-icon closable />
<Alert
style="height: 34px; margin-left: 10px"
message="检查通过"
type="success"
show-icon
closable
/>
<Alert
style="height: 34px; margin-left: 10px; display: none"
message="检查信息说明"
type="info"
show-icon
closable
/>
<Alert
style="height: 34px; margin-left: 10px; display: none"
message="检查异常"
type="warning"
show-icon
closable
/>
<Alert
style="height: 34px; margin-left: 10px; display: none"
message="检查错误"
type="error"
show-icon
closable
/>
</div>
</template>
</BasicForm>
</PageWrapper>
</PageWrapper>
</template>
<script lang="ts" setup>
import {computed, onMounted} from 'vue';
import {PageWrapper} from "@/components/Page";
import {tableList} from "@/views/scriptDevelopment/sqlAudit/mock";
import {personSchema} from "@/views/scriptDevelopment/sqlAudit/mainBody.data";
import {BasicForm, useForm} from "@/components/Form";
import CodeEditor from "@/components/CodeEditor/src/CodeEditor.vue";
import {Alert} from "ant-design-vue";
const pros = defineProps({
deptId: {
type: Number,
default: 0,
}
})
// 初始化 info 为一个响应式对象
const info = computed(() => {
const list = tableList;
const index = list.findIndex((item) => {
return item.selectedDeptId === pros.deptId; // 添加 return 关键字
import { computed, onMounted } from 'vue';
import { PageWrapper } from '@/components/Page';
import { tableList } from '@/views/scriptDevelopment/sqlAudit/mock';
import { personSchema } from '@/views/scriptDevelopment/sqlAudit/mainBody.data';
import { BasicForm, useForm } from '@/components/Form';
import CodeEditor from '@/components/CodeEditor/src/CodeEditor.vue';
import { Alert } from 'ant-design-vue';
const pros = defineProps({
deptId: {
type: Number,
default: 0,
},
});
// 初始化 info 为一个响应式对象
const info = computed(() => {
const list = tableList;
const index = list.findIndex((item) => {
return item.selectedDeptId === pros.deptId; // 添加 return 关键字
});
if (index !== -1) {
return list[index];
}
return {};
});
console.log('list', list);
console.log('index', index);
console.log('deptId', pros.deptId);
if (index !== -1) {
return list[index];
}
return {};
});
console.log("info数据:",info);
function palyStart() {
setFieldsValue(info.value);
}
onMounted(() => {
console.log('tableList', tableList)
palyStart();
});
const [registerGuideModeForm, {setFieldsValue}] = useForm({
labelWidth: 100,
schemas: personSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
function palyStart() {
setFieldsValue(info.value);
}
onMounted(() => {
palyStart();
});
const [registerGuideModeForm, { setFieldsValue }] = useForm({
labelWidth: 100,
schemas: personSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
</script>
<style scoped>
.editor {
width: 784px;
background-color: white;
height: 333px;
border: 1px solid #d9d9d9;
padding: 16px;
margin-bottom: 8px;
}
.buttonVerification{
height: 162px;
display: flex;
}
.editor {
width: 784px;
background-color: white;
height: 333px;
border: 1px solid #d9d9d9;
padding: 16px;
margin-bottom: 8px;
}
.buttonVerification {
height: 162px;
display: flex;
}
</style>
<template>
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex" >
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<DeptTree class="w-1/4 xl:w-1/5" @select="handleSelect" />
<editAuditRulesModal
style="background: #cc0000;"
class="w-3/4 xl:w-4/5"
v-if="isSpecificDeptSelected"
:deptId="selectedDeptId"
/>
<BasicTable
@register="registerTable"
class="w-3/4 xl:w-4/5"
:searchInfo="searchInfo"
v-else
>
<template #bodyCell="{ column }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
icon: 'ant-design:form-outlined',
},
{
icon: 'ant-design:exclamation-circle-outlined',
<div class="w-3/4 xl:w-4/5">
<editAuditRulesModal
style="background: #cc0000"
v-if="isSpecificDeptSelected"
:deptId="selectedDeptId"
/>
<BasicTable @register="registerTable" :searchInfo="searchInfo" v-else>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
icon: 'bx:rename',
tooltip: '重命名',
onClick: resetName.bind(null, record),
},
{
icon: 'tdesign:folder-move',
tooltip: '移动',
onClick: handleMove.bind(null, 1),
},
{
icon: 'material-symbols-light:delete-outline',
tooltip: '删除',
popConfirm: {
title: '是否确认删除',
placement: 'left',
confirm: handleDelete.bind(null),
},
{
icon: 'ant-design:ellipsis-outlined',
},
]"
},
]"
/>
</template>
</template>
<template #toolbar>
<a-input
style="width: 200px; margin-right: auto"
placeholder="输入关键字搜索"
allowClear
/>
<a-button @click="handleDeleteIds">删除</a-button>
<a-button @click="handleMove(1)">移动</a-button>
<a-button type="primary" @click="handleNewFolder(1)">新建文件夹</a-button>
<a-button type="primary" @click="handleNewFile(0)">新建文件</a-button>
</template>
</template>
<template #toolbar>
<a-input style="width: 200px; margin-right: auto" placeholder="输入关键字搜索" allowClear />
<a-button >删除</a-button>
<a-button >移动</a-button>
<a-button type="primary">新建文件夹</a-button>
<a-button type="primary">新建文件</a-button>
</template>
</BasicTable>
</BasicTable>
</div>
<MoveFile @register="registerMoveFile" />
<AddFile @register="registerAddFile" />
<Rename @register="registerRename" />
</PageWrapper>
</template>
<script lang="ts" setup>
import { reactive, computed } from 'vue';
import {BasicTable, TableAction, useTable} from '@/components/Table';
import { PageWrapper } from '@/components/Page';
import DeptTree from './DeptTree.vue';
import { ref } from 'vue';
import { tableList } from './mock';
import { columns } from './mainBody.data';
import EditAuditRulesModal from "@/views/scriptDevelopment/sqlAudit/editAuditRulesModal.vue";
defineOptions({ name: 'AccountManagement' });
const isSpecificDeptSelected = computed(() => {
return [23, 24, 25].includes(selectedDeptId.value);
});
// 选中的部门ID
const selectedDeptId = ref<string | null>(null);
const searchInfo = reactive<Recordable>({});
const [
registerTable,
{ },
] = useTable({
api: async (params) => {
console.log('tableList', tableList);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: tableList.length,
code: '',
message: '',
data: tableList,
};
return { ...response };
},
rowKey: 'businessId',
columns,
formConfig: {
labelWidth: 10,
autoSubmitOnEnter: true,
},
rowSelection: true,
useSearchForm: false,
showIndexColumn: false,
showTableSetting: false,
bordered: true,
handleSearchInfoFn(info) {
console.log('handleSearchInfoFn', info);
return info;
},
actionColumn: {
width: 170,
title: '操作',
dataIndex: 'action',
},
});
// 处理选择节点事件
const handleSelect = (deptId) => {
selectedDeptId.value = deptId;
console.log('选择节点selectedDeptId:', deptId);
}
import { reactive, computed, ref } from 'vue';
import { BasicTable, TableAction, useTable } from '@/components/Table';
import { PageWrapper } from '@/components/Page';
import DeptTree from './DeptTree.vue';
import { tableList } from './mock';
import { columns } from './mainBody.data';
import editAuditRulesModal from '@/views/scriptDevelopment/sqlAudit/editAuditRulesModal.vue';
import { useMessage } from '@/hooks/web/useMessage';
import { useModal } from '@/components/Modal';
import MoveFile from './moveFile.vue';
import AddFile from './addFile.vue';
import Rename from './renameModal.vue';
defineOptions({ name: 'AccountManagement' });
const { createMessage, createConfirm } = useMessage();
const isSpecificDeptSelected = computed(() => {
return [21, 23, 24, 25].includes(selectedDeptId.value);
});
const selectedDeptId = ref<string | null>(null);
const searchInfo = reactive<Recordable>({});
const [registerMoveFile, { openModal: openMoveFileModal }] = useModal();
const [registerAddFile, { openModal: openAddFileModal }] = useModal();
const [registerRename, { openModal: openRenameModal }] = useModal();
const [registerTable] = useTable({
api: async () => {
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: tableList.length,
code: '',
message: '',
data: tableList,
};
return { ...response };
},
rowKey: 'businessId',
columns,
formConfig: {
labelWidth: 10,
autoSubmitOnEnter: true,
},
rowSelection: true,
useSearchForm: false,
showIndexColumn: false,
showTableSetting: false,
bordered: true,
handleSearchInfoFn(info) {
return info;
},
actionColumn: {
width: 170,
title: '操作',
dataIndex: 'action',
},
});
/** 移动按钮*/
function handleMove(isMove) {
openMoveFileModal(true, {
isMove: isMove,
});
}
function handleDelete() {
createMessage.success('删除成功!');
}
function handleNewFolder(isBucket) {
openAddFileModal(true, {
isBucket: isBucket,
title: '新建文件夹',
});
}
function handleNewFile(isBucket) {
openAddFileModal(true, {
isBucket: isBucket,
title: '新建文件',
});
}
function resetName(record) {
openRenameModal(true, {
name: record.name,
title: '重命名',
});
}
function handleDeleteIds() {
createConfirm({
iconType: 'warning',
title: '确认删除',
content: '确认批量删除选中数据吗?',
onOk() {
createMessage.success('删除成功!');
},
});
}
// 处理选择节点事件
const handleSelect = (deptId) => {
selectedDeptId.value = deptId;
};
</script>
import {BasicColumn, FormSchema} from '@/components/Table';
import { BasicColumn, FormSchema } from '@/components/Table';
export const columns: BasicColumn[] = [
{
......@@ -42,12 +42,10 @@ export const columns: BasicColumn[] = [
width: 150,
sorter: true,
},
];
export const personSchema: FormSchema[] = [
{
field: 'name',
component: 'Input',
colProps: { lg: 11, md: 11 },
......@@ -59,12 +57,11 @@ export const personSchema: FormSchema[] = [
label: '规则描述',
colProps: { lg: 11, md: 11 },
component: 'InputTextArea',
},
{
field: 'ruleHandling',
label: '规则处置',
colProps: { lg: 11, md: 11, },
colProps: { lg: 11, md: 11 },
component: 'Select',
required: true,
componentProps: {
......@@ -97,4 +94,51 @@ export const personSchema: FormSchema[] = [
slot: 'buttonSlot',
},
];
export const MoveFormSchema: any[] = [
{
field: 'taskId',
label: '路径',
component: 'TreeSelect',
colProps: { lg: 24, md: 24 },
componentProps: {
fieldNames: {
label: 'workSpaceName',
value: 'businessId',
},
getPopupContainer: () => document.body,
},
required: true,
},
];
export const addFileFormSchema: any[] = [
{
field: 'taskId',
label: '路径',
component: 'TreeSelect',
colProps: { lg: 24, md: 24 },
componentProps: {
fieldNames: {
label: 'workSpaceName',
value: 'businessId',
},
getPopupContainer: () => document.body,
},
required: true,
},
{
field: 'name',
component: 'Input',
label: '名称',
required: true,
colProps: { lg: 24, md: 24 },
},
];
export const renameSchema: FormSchema[] = [
{
field: 'name',
label: '名称',
component: 'Input',
required: true,
colProps: { lg: 24, md: 24 },
},
];
export const tableList: any[] = [
{
selectedDeptId: 21,
name: 'is_Param_Of_b',
ruleDescription: 'is_Param_Of_b',
ruleType: '自定义规则',
ruleHandling: '禁止执行',
creationTime: '2019/12/12 21:21:21',
updateTime: '2019/12/12 21:21:21',
owner: 'admin',
sql: 'SELECT COUNT(*)\n' + 'FROM $(table a}',
},
{
selectedDeptId: 23,
name: 'has_agg',
......@@ -14,8 +22,8 @@ export const tableList: any[] = [
sql:
'sql.type = createtable\n' +
'and\n' +
'{\n'+
'sql.partitions.size * sql.buckets.size <= 10000\n'+
'{\n' +
'sql.partitions.size * sql.buckets.size <= 10000\n' +
'}',
},
{
......@@ -46,44 +54,129 @@ export const tableList: any[] = [
'FROM $(table a}\n' +
'WHERE ${column a}IS NOT NULL AND ${column a}NOT IN (${range a})',
},
];
export const treeDataList = [
export const treeDataListTwo = [
{
label: '审核规则',
businessId: 1,
name: '审核规则',
selectedDeptId: 1,
children: [
{
// {
// label: 'admin_个人工作区',
// businessId: 2,
// children: [
// { label: '个人工作区1', businessId: 6 },
// { label: '个人工作区2', businessId: 7 },
// ],
// },
// { label: '共享工作区', businessId: 3 },
// { label: '商城工作区', businessId: 4 },
// { label: '指标工作区', businessId: 5 },
}
name: '提示规则',
selectedDeptId: 11,
children: [{ selectedDeptId: 21 }],
},
{
name: '错误问题规则',
selectedDeptId: 12,
children: [{ selectedDeptId: 23 }, { selectedDeptId: 24 }, { selectedDeptId: 25 }],
},
],
},
];
export const treeDataListTwo = [
export const TreeData: any[] = [
{
name: '提示规则',
selectedDeptId: 21,
children: [
],
delFlag: '0',
flag: '1',
businessId: 100,
parentWorkSpaceName: '审核规则',
workSpaceName: '审核规则',
parentId: 0,
'code:': '001',
ancestors: '0',
orderNum: 0,
children: [],
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
{
name: '错误问题规则',
selectedDeptId: 22,
children: [
{selectedDeptId: 23 },
{selectedDeptId: 24 },
{selectedDeptId: 25 },
],
delFlag: '0',
flag: '1',
businessId: 101,
parentWorkSpaceName: '审核规则',
workSpaceName: '提示规则',
parentId: 100,
'code:': '002',
ancestors: '0,100',
orderNum: 1,
children: [],
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
{
delFlag: '0',
flag: '1',
businessId: 201,
parentWorkSpaceName: '提示规则',
workSpaceName: 'is_Param_Of_b',
parentId: 101,
'code:': '003',
ancestors: '0,100',
orderNum: 1,
children: [],
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
{
delFlag: '0',
flag: '1',
businessId: 102,
parentWorkSpaceName: '审核规则',
workSpaceName: '错误问题规则',
parentId: 100,
'code:': '004',
ancestors: '0,100',
orderNum: 2,
children: [],
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
{
delFlag: '0',
flag: '1',
businessId: 202,
parentWorkSpaceName: '错误问题规则',
workSpaceName: 'has_agg',
parentId: 102,
'code:': '004',
ancestors: '0,100',
orderNum: 2,
children: [],
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
{
delFlag: '0',
flag: '1',
businessId: 203,
parentWorkSpaceName: '错误问题规则',
workSpaceName: 'is_Param_Of_Agg',
parentId: 102,
'code:': '004',
ancestors: '0,100',
orderNum: 2,
children: [],
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
{
delFlag: '0',
flag: '1',
businessId: 204,
parentWorkSpaceName: '错误问题规则',
workSpaceName: 'is_Location_Exists',
parentId: 102,
'code:': '004',
ancestors: '0,100',
orderNum: 2,
children: [],
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
];
<template>
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup>
import { ref, computed } from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { MoveFormSchema } from './mainBody.data';
import { useMessage } from '@/hooks/web/useMessage';
import { TreeData } from './mock';
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const rowData = ref([]);
let isMove = ref();
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { updateSchema, resetFields }] = useForm({
baseColProps: { span: 24 },
schemas: MoveFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
rowData.value = [];
isMove.value = data.isMove;
// //重置表单数据
resetFields();
setModalProps({ confirmLoading: false });
const treeList = handleTree(TreeData, 'businessId', undefined, undefined, undefined);
updateSchema([
{
field: 'taskId',
componentProps: {
treeData: treeList,
},
},
]);
});
const getTitle = computed(() => '移动');
/**确定按钮*/
async function handleSubmit() {
if (isMove.value === 1) {
createMessage.success('移动成功!');
} else {
createMessage.success('复制成功!');
}
closeModal();
}
/**数组对象转成树*/
function handleTree(data, id, parentId, children, rootId) {
id = id || 'id';
parentId = parentId || 'parentId';
children = children || 'children';
rootId =
rootId ||
Math.min.apply(
Math,
data.map((item) => {
return item[parentId];
}),
) ||
0;
// 对源数据深度克隆
const cloneData = JSON.parse(JSON.stringify(data));
// 循环所有项
const treeData = cloneData.filter((father) => {
const branchArr = cloneData.filter((child) => {
// 返回每一项的子级数组
return father[id] === child[parentId];
});
branchArr.length > 0 ? (father.children = branchArr) : '';
// 返回第一层
return father[parentId] === rootId;
});
return treeData !== '' ? treeData : data;
}
</script>
<template>
<BasicModal
width="30%"
v-bind="$attrs"
@register="registerModal"
:title="title"
@ok="handleSubmit"
>
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup>
import { onMounted, ref } from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { useMessage } from '@/hooks/web/useMessage';
import { BasicForm, useForm } from '@/components/Form';
import { renameSchema } from '@/views/scriptDevelopment/sqlAudit/mainBody.data';
defineOptions({ name: 'KnowledgeModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const title = ref();
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { setFieldsValue, resetFields }] = useForm({
schemas: renameSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
const name = data.name;
setFieldsValue({ name });
setModalProps({ confirmLoading: false });
title.value = data.title;
});
async function handleSubmit() {
closeModal();
createMessage.success('提交成功');
resetFields;
}
onMounted(() => {});
</script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment