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

修改sql审核

parent 6fb21cea
...@@ -85,7 +85,7 @@ ...@@ -85,7 +85,7 @@
return treeData !== '' ? treeData : data; return treeData !== '' ? treeData : data;
} }
const getTitle = computed(() => (!unref(isUpdate) ? '新建主体' : '编辑主体')); const getTitle = computed(() => (!unref(isUpdate) ? '新建文件夹' : '编辑主体'));
async function handleSubmit() { async function handleSubmit() {
try { try {
......
<template> <template>
<div class="m-4 mr-0 overflow-hidden bg-white"> <div class="overflow-hidden bg-white">
<div class="m-4 mr-0 overflow-hidden bg-white" style="margin-bottom: -20px"> <a-input placeholder="" style="margin: 10px 0">
<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;">
<template #prefix> <template #prefix>
<Icon icon="ant-design:search-outlined" :size="20" /> <Icon icon="ant-design:search-outlined" :size="20" />
</template> </template>
...@@ -28,75 +15,69 @@ ...@@ -28,75 +15,69 @@
:treeData="treeDataTwo" :treeData="treeDataTwo"
:fieldNames="{ key: 'selectedDeptId', title: 'name' }" :fieldNames="{ key: 'selectedDeptId', title: 'name' }"
@select="handleSelect" @select="handleSelect"
/> />
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { nextTick, onMounted, ref, unref } from 'vue'; import { nextTick, onMounted, ref, unref } from 'vue';
import { BasicTree, TreeActionType, TreeItem } from '@/components/Tree'; import { BasicTree, TreeActionType, TreeItem } from '@/components/Tree';
import { Nullable } from '@vben/types'; import { Nullable } from '@vben/types';
import { treeDataList, treeDataListTwo } from './mock'; import { treeDataListTwo, tableList } from './mock';
import Icon from "@/components/Icon/Icon.vue"; import Icon from '@/components/Icon/Icon.vue';
import {tableList} from "./mock";
defineOptions({ name: 'DeptTree' });
defineOptions({ name: 'DeptTree' });
const emit = defineEmits(['select']);
const emit = defineEmits(['select']);
const treeData = ref<TreeItem[]>([]);
const treeData = ref<TreeItem[]>([]); const treeDataTwo = ref<TreeItem[]>([]);
const treeDataTwo = ref<TreeItem[]>([]); const treeRef1 = ref<Nullable<TreeActionType>>(null);
const treeRef1 = ref<Nullable<TreeActionType>>(null); const treeRef2 = ref<Nullable<TreeActionType>>(null);
const treeRef2 = ref<Nullable<TreeActionType>>(null);
async function fetch() {
async function fetch() { // 合并树形数据和表格数据
// 合并树形数据和表格数据 treeData.value = mergeTreeDataWithTableList(treeDataListTwo, tableList);
treeData.value = mergeTreeDataWithTableList(treeDataListTwo, tableList); treeDataTwo.value = treeDataListTwo;
treeData.value = treeDataList; await nextTick(() => {
treeDataTwo.value = treeDataListTwo; getTree(treeRef1).expandAll(true);
await nextTick(() => { getTree(treeRef2).expandAll(true);
getTree(treeRef1).expandAll(true); });
getTree(treeRef2).expandAll(true); }
});
}
// 合并数据的函数 // 合并数据的函数
function mergeTreeDataWithTableList(treeDataListTwo, tableList) { function mergeTreeDataWithTableList(treeDataListTwo, tableList) {
return treeDataListTwo.map((treeNode) => { return treeDataListTwo.map((treeNode) => {
// 找到对应的tableList项,合并name属性 // 找到对应的tableList项,合并name属性
const tableItem = tableList.find((item) => item.selectedDeptId === treeNode.selectedDeptId); const tableItem = tableList.find((item) => item.selectedDeptId === treeNode.selectedDeptId);
if (tableItem) { if (tableItem) {
treeNode.name = tableItem.name; // 将tableList中的name添加到treeNode treeNode.name = tableItem.name; // 将tableList中的name添加到treeNode
} }
// 如果有子节点,递归处理
if (treeNode.children && treeNode.children.length > 0) {
treeNode.children = mergeTreeDataWithTableList(treeNode.children, tableList);
}
return treeNode;
});
}
// 如果有子节点,递归处理 function getTree(treeRef) {
if (treeNode.children && treeNode.children.length > 0) { const tree = unref(treeRef);
treeNode.children = mergeTreeDataWithTableList(treeNode.children, tableList); if (!tree) {
throw new Error('tree is null!');
} }
return tree;
return treeNode;
});
}
function getTree(treeRef) {
const tree = unref(treeRef);
if (!tree) {
throw new Error('tree is null!');
} }
return tree;
}
function handleSelect(selectedDeptId) { function handleSelect(selectedDeptId) {
emit('select', selectedDeptId[0]); emit('select', selectedDeptId[0]);
console.log('selectedDeptId:', selectedDeptId); console.log('selectedDeptId:', selectedDeptId);
} }
onMounted(() => { onMounted(() => {
fetch(); fetch();
}); });
</script> </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 > <template>
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex" > <PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<PageWrapper
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex flex-col" class="toolbar" style="width: 910px;"> dense
<div class="toolbar" style="background: white" > contentFullHeight
<div class="tools" > 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> <a-button type="primary" style="float: right; margin: 10px 15px 10px 0">保存</a-button>
</div> </div>
</div> </div>
<BasicForm <BasicForm
style="background: white" style="background: white"
size="middle" size="middle"
:bordered="false" :bordered="false"
:column="2" :column="2"
:model="info" :model="info"
@register="registerGuideModeForm" @register="registerGuideModeForm"
> >
<template #ruleContentSlot> <template #ruleContentSlot>
<div class="editor"> <div class="editor">
...@@ -25,89 +30,99 @@ ...@@ -25,89 +30,99 @@
<template #buttonSlot> <template #buttonSlot>
<div class="buttonVerification"> <div class="buttonVerification">
<a-button style="margin-left: 100px; width: 80px" type="primary">检查</a-button> <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
<Alert style="height: 34px; margin-left: 10px; display: none;" message="检查信息说明" type="info" show-icon closable /> style="height: 34px; margin-left: 10px"
<Alert style="height: 34px; margin-left: 10px; display: none;" message="检查异常" type="warning" show-icon closable /> message="检查通过"
<Alert style="height: 34px; margin-left: 10px; display: none;" message="检查错误" type="error" show-icon closable /> 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> </div>
</template> </template>
</BasicForm> </BasicForm>
</PageWrapper> </PageWrapper>
</PageWrapper> </PageWrapper>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import {computed, onMounted} from 'vue'; import { computed, onMounted } from 'vue';
import {PageWrapper} from "@/components/Page"; import { PageWrapper } from '@/components/Page';
import {tableList} from "@/views/scriptDevelopment/sqlAudit/mock"; import { tableList } from '@/views/scriptDevelopment/sqlAudit/mock';
import {personSchema} from "@/views/scriptDevelopment/sqlAudit/mainBody.data"; import { personSchema } from '@/views/scriptDevelopment/sqlAudit/mainBody.data';
import {BasicForm, useForm} from "@/components/Form"; import { BasicForm, useForm } from '@/components/Form';
import CodeEditor from "@/components/CodeEditor/src/CodeEditor.vue"; import CodeEditor from '@/components/CodeEditor/src/CodeEditor.vue';
import {Alert} from "ant-design-vue"; import { Alert } from 'ant-design-vue';
const pros = defineProps({ const pros = defineProps({
deptId: { deptId: {
type: Number, type: Number,
default: 0, default: 0,
} },
}) });
// 初始化 info 为一个响应式对象 // 初始化 info 为一个响应式对象
const info = computed(() => { const info = computed(() => {
const list = tableList; const list = tableList;
const index = list.findIndex((item) => { const index = list.findIndex((item) => {
return item.selectedDeptId === pros.deptId; // 添加 return 关键字 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> </script>
<style scoped> <style scoped>
.editor { .editor {
width: 784px; width: 784px;
background-color: white; background-color: white;
height: 333px; height: 333px;
border: 1px solid #d9d9d9; border: 1px solid #d9d9d9;
padding: 16px; padding: 16px;
margin-bottom: 8px; margin-bottom: 8px;
} }
.buttonVerification{
height: 162px;
display: flex;
}
.buttonVerification {
height: 162px;
display: flex;
}
</style> </style>
<template> <template>
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex" > <PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<DeptTree class="w-1/4 xl:w-1/5" @select="handleSelect" /> <DeptTree class="w-1/4 xl:w-1/5" @select="handleSelect" />
<editAuditRulesModal <div class="w-3/4 xl:w-4/5">
style="background: #cc0000;" <editAuditRulesModal
class="w-3/4 xl:w-4/5" style="background: #cc0000"
v-if="isSpecificDeptSelected" v-if="isSpecificDeptSelected"
:deptId="selectedDeptId" :deptId="selectedDeptId"
/> />
<BasicTable <BasicTable @register="registerTable" :searchInfo="searchInfo" v-else>
@register="registerTable" <template #bodyCell="{ column, record }">
class="w-3/4 xl:w-4/5" <template v-if="column.key === 'action'">
:searchInfo="searchInfo" <TableAction
v-else :actions="[
> {
<template #bodyCell="{ column }"> icon: 'bx:rename',
<template v-if="column.key === 'action'"> tooltip: '重命名',
<TableAction onClick: resetName.bind(null, record),
:actions="[ },
{ {
icon: 'ant-design:form-outlined', icon: 'tdesign:folder-move',
tooltip: '移动',
}, onClick: handleMove.bind(null, 1),
{ },
icon: 'ant-design:exclamation-circle-outlined', {
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> </BasicTable>
</div>
<template #toolbar> <MoveFile @register="registerMoveFile" />
<a-input style="width: 200px; margin-right: auto" placeholder="输入关键字搜索" allowClear /> <AddFile @register="registerAddFile" />
<a-button >删除</a-button> <Rename @register="registerRename" />
<a-button >移动</a-button>
<a-button type="primary">新建文件夹</a-button>
<a-button type="primary">新建文件</a-button>
</template>
</BasicTable>
</PageWrapper> </PageWrapper>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { reactive, computed } from 'vue'; import { reactive, computed, ref } from 'vue';
import {BasicTable, TableAction, useTable} from '@/components/Table'; import { BasicTable, TableAction, useTable } from '@/components/Table';
import { PageWrapper } from '@/components/Page'; import { PageWrapper } from '@/components/Page';
import DeptTree from './DeptTree.vue'; import DeptTree from './DeptTree.vue';
import { ref } from 'vue'; import { tableList } from './mock';
import { tableList } from './mock'; import { columns } from './mainBody.data';
import { columns } from './mainBody.data'; import editAuditRulesModal from '@/views/scriptDevelopment/sqlAudit/editAuditRulesModal.vue';
import { useMessage } from '@/hooks/web/useMessage';
import EditAuditRulesModal from "@/views/scriptDevelopment/sqlAudit/editAuditRulesModal.vue"; import { useModal } from '@/components/Modal';
import MoveFile from './moveFile.vue';
defineOptions({ name: 'AccountManagement' }); import AddFile from './addFile.vue';
import Rename from './renameModal.vue';
const isSpecificDeptSelected = computed(() => { defineOptions({ name: 'AccountManagement' });
return [23, 24, 25].includes(selectedDeptId.value);
}); const { createMessage, createConfirm } = useMessage();
const isSpecificDeptSelected = computed(() => {
return [21, 23, 24, 25].includes(selectedDeptId.value);
// 选中的部门ID });
const selectedDeptId = ref<string | null>(null); const selectedDeptId = ref<string | null>(null);
const searchInfo = reactive<Recordable>({});
const searchInfo = reactive<Recordable>({});
const [ const [registerMoveFile, { openModal: openMoveFileModal }] = useModal();
registerTable, const [registerAddFile, { openModal: openAddFileModal }] = useModal();
{ }, const [registerRename, { openModal: openRenameModal }] = useModal();
] = useTable({
const [registerTable] = useTable({
api: async (params) => { api: async () => {
console.log('tableList', tableList); const response = {
const response = { pageNu: '1',
pageNu: '1', pageSize: '10',
pageSize: '10', pages: '1',
pages: '1', total: tableList.length,
total: tableList.length, code: '',
code: '', message: '',
message: '', data: tableList,
data: tableList, };
};
return { ...response };
return { ...response }; },
}, rowKey: 'businessId',
rowKey: 'businessId',
columns,
formConfig: {
columns, labelWidth: 10,
formConfig: { autoSubmitOnEnter: true,
labelWidth: 10, },
autoSubmitOnEnter: true, rowSelection: true,
useSearchForm: false,
}, showIndexColumn: false,
rowSelection: true, showTableSetting: false,
useSearchForm: false, bordered: true,
showIndexColumn: false, handleSearchInfoFn(info) {
showTableSetting: false, return info;
bordered: true, },
handleSearchInfoFn(info) { actionColumn: {
console.log('handleSearchInfoFn', info); width: 170,
return info; title: '操作',
}, dataIndex: 'action',
actionColumn: { },
width: 170, });
title: '操作', /** 移动按钮*/
dataIndex: 'action', function handleMove(isMove) {
}, openMoveFileModal(true, {
}); isMove: isMove,
});
}
// 处理选择节点事件 function handleDelete() {
const handleSelect = (deptId) => { createMessage.success('删除成功!');
selectedDeptId.value = deptId; }
function handleNewFolder(isBucket) {
console.log('选择节点selectedDeptId:', deptId); 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> </script>
import {BasicColumn, FormSchema} from '@/components/Table'; import { BasicColumn, FormSchema } from '@/components/Table';
export const columns: BasicColumn[] = [ export const columns: BasicColumn[] = [
{ {
...@@ -42,12 +42,10 @@ export const columns: BasicColumn[] = [ ...@@ -42,12 +42,10 @@ export const columns: BasicColumn[] = [
width: 150, width: 150,
sorter: true, sorter: true,
}, },
]; ];
export const personSchema: FormSchema[] = [ export const personSchema: FormSchema[] = [
{ {
field: 'name', field: 'name',
component: 'Input', component: 'Input',
colProps: { lg: 11, md: 11 }, colProps: { lg: 11, md: 11 },
...@@ -59,12 +57,11 @@ export const personSchema: FormSchema[] = [ ...@@ -59,12 +57,11 @@ export const personSchema: FormSchema[] = [
label: '规则描述', label: '规则描述',
colProps: { lg: 11, md: 11 }, colProps: { lg: 11, md: 11 },
component: 'InputTextArea', component: 'InputTextArea',
}, },
{ {
field: 'ruleHandling', field: 'ruleHandling',
label: '规则处置', label: '规则处置',
colProps: { lg: 11, md: 11, }, colProps: { lg: 11, md: 11 },
component: 'Select', component: 'Select',
required: true, required: true,
componentProps: { componentProps: {
...@@ -97,4 +94,51 @@ export const personSchema: FormSchema[] = [ ...@@ -97,4 +94,51 @@ export const personSchema: FormSchema[] = [
slot: 'buttonSlot', 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[] = [ 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, selectedDeptId: 23,
name: 'has_agg', name: 'has_agg',
...@@ -14,8 +22,8 @@ export const tableList: any[] = [ ...@@ -14,8 +22,8 @@ export const tableList: any[] = [
sql: sql:
'sql.type = createtable\n' + 'sql.type = createtable\n' +
'and\n' + 'and\n' +
'{\n'+ '{\n' +
'sql.partitions.size * sql.buckets.size <= 10000\n'+ 'sql.partitions.size * sql.buckets.size <= 10000\n' +
'}', '}',
}, },
{ {
...@@ -46,44 +54,129 @@ export const tableList: any[] = [ ...@@ -46,44 +54,129 @@ export const tableList: any[] = [
'FROM $(table a}\n' + 'FROM $(table a}\n' +
'WHERE ${column a}IS NOT NULL AND ${column a}NOT IN (${range a})', 'WHERE ${column a}IS NOT NULL AND ${column a}NOT IN (${range a})',
}, },
]; ];
export const treeDataListTwo = [
export const treeDataList = [
{ {
label: '审核规则', name: '审核规则',
businessId: 1, selectedDeptId: 1,
children: [ children: [
{ {
// { name: '提示规则',
// label: 'admin_个人工作区', selectedDeptId: 11,
// businessId: 2, children: [{ selectedDeptId: 21 }],
// children: [ },
// { label: '个人工作区1', businessId: 6 }, {
// { label: '个人工作区2', businessId: 7 }, name: '错误问题规则',
// ], selectedDeptId: 12,
// }, children: [{ selectedDeptId: 23 }, { selectedDeptId: 24 }, { selectedDeptId: 25 }],
// { label: '共享工作区', businessId: 3 }, },
// { label: '商城工作区', businessId: 4 },
// { label: '指标工作区', businessId: 5 },
}
], ],
}, },
]; ];
export const treeDataListTwo = [ export const TreeData: any[] = [
{ {
name: '提示规则', delFlag: '0',
selectedDeptId: 21, flag: '1',
children: [ 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: '错误问题规则', delFlag: '0',
selectedDeptId: 22, flag: '1',
children: [ businessId: 101,
{selectedDeptId: 23 }, parentWorkSpaceName: '审核规则',
{selectedDeptId: 24 }, workSpaceName: '提示规则',
{selectedDeptId: 25 }, 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