Skip to content

B
bigDataSystem
Commit 4c1f1ce0 authored by 罗林杰's avatar 罗林杰
Browse files
Options

修改自助建表

parent 9b9405d4
Show whitespace changes
Inline Side-by-side
Showing with 255 additions and 145 deletions
src/views/scriptDevelopment/functionManagement/DeptTree.vue
View file @ 4c1f1ce0
<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>
<div class="overflow-hidden bg-white">
<a-input placeholder="" style="margin: 10px 0;">
<template #prefix>
<Icon icon="ant-design:search-outlined" :size="20" />
......
src/views/scriptDevelopment/functionManagement/index.vue
View file @ 4c1f1ce0
<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;"
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
<div class="w-3/4 xl:w-4/5" v-else>
<div style="display: flex; align-items: center; background-color: white">
<Icon icon="majesticons:table-plus-line" :size="40" :color="'#e9a064'" />
<div style="margin-left: 10px">
<span class="title">test</span>
<div>
<span class="path">自助建表文件/test</span>
</div>
</div>
<a-button style="margin-left: 700px" type="primary" @click="handleDeleteIds">删除</a-button>
<a-button style="margin-left: 10px" type="primary" @click="handleMove(1)">移动</a-button>
<a-button style="margin-left: 10px" type="primary" @click="handleExport('文件')"
>导出</a-button
>
<a-button style="margin-left: 10px" type="primary" @click="handleImport">导入</a-button>
<a-button style="margin-left: 10px" type="primary" @click="handleNewFolder"
>新建文件夹</a-button
>
<template #bodyCell="{ column }">
<a-button style="margin-left: 10px" type="primary" @click="handleNewFile"
>新建文件</a-button
>
</div>
<BasicTable @register="registerTable" :searchInfo="searchInfo">
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
icon: 'ant-design:ellipsis-outlined',
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),
},
},
]"
/>
......@@ -26,48 +59,54 @@
</template>
<template #toolbar>
<a-input style="width: 200px; margin-right: auto" placeholder="输入关键字搜索" allowClear />
<a-button type="primary">导入</a-button>
<a-button type="primary">导出</a-button>
<a-button type="primary">删除</a-button>
<a-button type="primary">移动</a-button>
<a-button type="primary">新建文件夹</a-button>
<a-button type="primary">新建</a-button>
<a-input
style="width: 200px; margin-right: auto"
placeholder="输入关键字搜索"
allowClear
/>
</template>
</BasicTable>
</div>
<MoveFile @register="registerMoveFile" />
<AddFile @register="registerAddFile" />
<Rename @register="registerRename" />
<importModal @register="registerImport" />
</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 "./editAuditRulesModal.vue";
defineOptions({ name: 'AccountManagement' });
const isSpecificDeptSelected = computed(() => {
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 './editAuditRulesModal.vue';
import Icon from '@/components/Icon/Icon.vue';
import { useMessage } from '@/hooks/web/useMessage';
import { useModal } from '@/components/Modal';
import MoveFile from '@/views/scriptDevelopment/selfServiceTableCreation/moveFile.vue';
import AddFile from '@/views/scriptDevelopment/selfServiceTableCreation/addFile.vue';
import Rename from '@/views/scriptDevelopment/selfServiceTableCreation/renameModal.vue';
import { exportRoleList } from '@/api/system/role/role';
import { downloadByData } from '@/utils/file/download';
import importModal from '@/views/scriptDevelopment/sqlDevelopment/importModal/importModal.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({
});
const { createMessage, createConfirm } = useMessage();
// 选中的部门ID
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 [registerImport, { openModal: openImportModal }] = useModal();
const [registerTable, {}] = useTable({
api: async (params) => {
console.log('tableList', tableList);
const response = {
......@@ -84,12 +123,10 @@ const [
},
rowKey: 'businessId',
columns,
formConfig: {
labelWidth: 10,
autoSubmitOnEnter: true,
},
rowSelection: true,
useSearchForm: false,
......@@ -101,21 +138,63 @@ const [
return info;
},
actionColumn: {
width: 80,
title: '操作',
dataIndex: 'action',
},
});
// 处理选择节点事件
const handleSelect = (deptId) => {
});
function handleDeleteIds() {
createConfirm({
iconType: 'warning',
title: '删除',
content: '确定要删除吗？',
onOk: async () => {
createMessage.success('删除成功');
},
});
}
/** 移动按钮*/
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: '重命名',
});
}
/** 导出按钮*/
async function handleExport(name) {
console.log('导出----');
const params = Object.assign({});
const data = await exportRoleList(params);
downloadByData(data, name + '.xlsx');
}
/** 导入按钮*/
function handleImport() {
openImportModal(true, {});
}
// 处理选择节点事件
const handleSelect = (deptId) => {
selectedDeptId.value = deptId;
console.log('选择节点selectedDeptId:', deptId);
}
};
</script>
src/views/scriptDevelopment/functionManagement/mock.ts
View file @ 4c1f1ce0
export const tableList: any[] = [
{
selectedDeptId: 23,
......@@ -25,9 +22,7 @@ export const tableList: any[] = [
creationTime: '2019/12/12 21:21:21',
updateTime: '2019/12/12 21:21:21',
owner: 'admin',
},
];
export const treeDataList = [
......@@ -47,25 +42,25 @@ export const treeDataList = [
// { label: '共享工作区', businessId: 3 },
// { label: '商城工作区', businessId: 4 },
// { label: '指标工作区', businessId: 5 },
}
},
],
},
];
export const treeDataListTwo = [
{
name: '函数',
selectedDeptId: 1,
children: [
{
name: '预置函数',
selectedDeptId: 21,
children: [
{}
],
children: [{ selectedDeptId: 23 }],
},
{
name: '自定义函数',
selectedDeptId: 22,
children: [
{ selectedDeptId: 23 },
{ selectedDeptId: 24 },
{ selectedDeptId: 25 },
children: [{ selectedDeptId: 24 }, { selectedDeptId: 25 }],
},
],
},
];
src/views/scriptDevelopment/selfServiceTableCreation/index.vue
View file @ 4c1f1ce0
......@@ -19,9 +19,13 @@
<a-button style="margin-left: 500px" type="primary" @click="handleMove(0)">复制到</a-button>
<a-button style="margin-left: 10px" type="primary" @click="handleDeleteIds">删除</a-button>
<a-button style="margin-left: 10px" type="primary" @click="handleMove(1)">移动</a-button>
<a-button style="margin-left: 10px" type="primary">导出</a-button>
<a-button style="margin-left: 10px" type="primary">导出模版</a-button>
<a-button style="margin-left: 10px" type="primary">导入</a-button>
<a-button style="margin-left: 10px" type="primary" @click="handleExport('文件')"
>导出</a-button
>
<a-button style="margin-left: 10px" type="primary" @click="handleExport('模板')"
>导出模版</a-button
>
<a-button style="margin-left: 10px" type="primary" @click="handleImport">导入</a-button>
<a-button style="margin-left: 10px" type="primary" @click="handleNewFolder"
>新建文件夹</a-button
>
......@@ -69,6 +73,7 @@
<MoveFile @register="registerMoveFile" />
<AddFile @register="registerAddFile" />
<Rename @register="registerRename" />
<importModal @register="registerImport" />
</PageWrapper>
</template>
<script lang="ts" setup>
......@@ -85,6 +90,9 @@
import AddFile from './addFile.vue';
import Rename from './renameModal.vue';
import Icon from '@/components/Icon/Icon.vue';
import { exportRoleList } from '@/api/system/role/role';
import { downloadByData } from '@/utils/file/download';
import importModal from '@/views/scriptDevelopment/sqlDevelopment/importModal/importModal.vue';
defineOptions({ name: 'AccountManagement' });
......@@ -96,6 +104,7 @@
const [registerMoveFile, { openModal: openMoveFileModal }] = useModal();
const [registerAddFile, { openModal: openAddFileModal }] = useModal();
const [registerRename, { openModal: openRenameModal }] = useModal();
const [registerImport, { openModal: openImportModal }] = useModal();
// 选中的部门ID
const selectedDeptId = ref<string | null>(null);
......@@ -176,6 +185,18 @@
title: '重命名',
});
}
/** 导出按钮*/
async function handleExport(name) {
console.log('导出----');
const params = Object.assign({});
const data = await exportRoleList(params);
downloadByData(data, name + '.xlsx');
}
/** 导入按钮*/
function handleImport() {
openImportModal(true, {});
}
// 处理选择节点事件
const handleSelect = (deptId) => {
selectedDeptId.value = deptId;
......
src/views/scriptDevelopment/selfServiceTableCreation/mock.ts
View file @ 4c1f1ce0
......@@ -19,6 +19,36 @@ export const tableList: any[] = [
'CLUSTERED BY (`ID`) INTO 3 BUCKETS\n' +
'STORED AS ORC;',
},
{
selectedDeptId: 24,
name: 'text1',
database: 'customerdb',
tableType: 'ORC',
creationTime: '2019/11/17 10:34:48',
updateTime: '2019/11/17 11:17:00',
owner: 'admin',
sql:
'CREATE TABLE `customerdb.customertable`{\n' +
' `ID` STRING COMMENT `用户ID`NOT NULL,\n' +
' `name` VARCHAR(255) COMMENT `姓名`,\n' +
'} COMMENT `客户信息表`\n' +
'PARTITIONED BY RANGE {\n' +
' `email` VARCHAR(255),\n' +
'}\n' +
'CLUSTERED BY (`ID`) INTO 3 BUCKETS\n' +
'STORED AS ORC;',
},
{
selectedDeptId: 25,
name: 'text2',
database: 'customerdb',
tableType: 'ORC',
creationTime: '2019/11/17 10:34:48',
updateTime: '2019/11/17 11:17:00',
owner: 'admin',
sql:
'CREATE TABLE `customerdb.customertable`{\n' + ' `ID` STRING COMMENT `用户ID`NOT NULL,\n',
},
];
export const fieldConfigurationList: any[] = [
......@@ -49,7 +79,7 @@ export const treeDataList = [
{
name: '自助建表文件',
selectedDeptId: 21,
children: [{ selectedDeptId: 23 }],
children: [{ selectedDeptId: 23 }, { selectedDeptId: 24 }, { selectedDeptId: 25 }],
},
];
export const TreeData: any[] = [
......
src/views/scriptDevelopment/sqlDevelopment/importModal/importModal.vue
View file @ 4c1f1ce0
......@@ -26,7 +26,6 @@
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { importFormSchema } from './tempalte.data';
import {onMountedOrActivated} from "@vben/hooks";
const emit = defineEmits(['success', 'register']);
const isUpdate = ref(true);
......@@ -61,7 +60,6 @@
// onMounted(){}
// const getTitle = computed(() => '新建文件');
const getTitle = '导入文件选择';
......
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