Commit b9c142a7 authored by 张伯涛's avatar 张伯涛

部分修改

parent b344acb0
<template>
<div class="m-4 mr-0 overflow-hidden bg-white">
<BasicTree
title="主体"
ref="treeRef"
toolbar
search
treeWrapperClassName="h-[calc(100%-35px)] overflow-auto"
:clickRowToExpand="true"
:defaultExpandAll="true"
:treeData="treeData"
:fieldNames="{ key: 'key', title: 'title' }"
@select="handleSelect"
/>
</div>
</template>
<script lang="ts" setup>
import {nextTick, onMounted, ref, unref} from 'vue';
import {BasicTree, TreeActionType, TreeItem} from '@/components/Tree';
import { getDeptList } from '@/api/system/dept/dept';
import {Nullable} from "@vben/types";
import {treeDataList} from "./mock";
defineOptions({ name: 'DeptTree' });
const emit = defineEmits(['select']);
const treeData = ref<TreeItem[]>([]);
const treeRef = ref<Nullable<TreeActionType>>(null);
async function fetch() {
treeData.value = treeDataList
await nextTick(() => {
getTree().expandAll(true)
})
}
function getTree() {
const tree = unref(treeRef);
if (!tree) {
throw new Error('tree is null!');
}
return tree;
}
function handleSelect(keys) {
emit('select', keys[0]);
}
onMounted(() => {
fetch();
});
</script>
<template>
<div>
引用文档
</div>
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<DeptTree class="w-1/4 xl:w-1/5" @select="handleSelect" />
<BasicTable @register="registerTable" class="w-3/4 xl:w-4/5" :searchInfo="searchInfo">
<template #toolbar>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary" >复制到</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary" @click="handleDeleteIds" >删除</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary" >移动</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary" >导出</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary" >批量发布</a-button>
<a-button type="primary" >新增文档分类</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary" >新增文档管理</a-button>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
label: '移动',
},
{
label: '删除',
},
{
label: '复制',
},
{
label: '查看详情',
},
]"
/>
</template>
</template>
</BasicTable>
</PageWrapper>
</template>
<script lang="ts" setup>
import { reactive,unref,onDeactivated,onMounted } from 'vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
<script>
export default {
name: "index"
import { PageWrapper } from '@/components/Page';
import DeptTree from './DeptTree.vue';
import { useMessage } from '@/hooks/web/useMessage';
import { useModal } from '@/components/Modal';
import {tableList} from "./mock";
import { columns, searchFormSchema } from './referenceDocument.data';
import { useGo } from '@/hooks/web/usePage';
import { downloadByData } from '@/utils/file/download';
import { useRoute,onBeforeRouteLeave } from 'vue-router';
import { useFilterStore } from '@/store/modules/filterData';
import {useUserStore} from "@/store/modules/user";
import {router} from "@/router";
defineOptions({ name: 'AccountManagement' });
const { createMessage,createConfirm } = useMessage();
const filterStore = useFilterStore();
const route = useRoute();
const go = useGo();
const searchInfo = reactive<Recordable>({});
const [registerTable, { reload, updateTableDataRecord, getSearchInfo,getForm,getRowSelection }] = useTable({
title: '主体管理列表',
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',
rowSelection: true,
columns,
formConfig: {
labelWidth: 120,
schemas: searchFormSchema,
autoSubmitOnEnter: true,
resetFunc: () => {
searchInfo.deptId=''
},
},
useSearchForm: true,
showTableSetting: false,
bordered: true,
handleSearchInfoFn(info) {
console.log('handleSearchInfoFn', info);
return info;
},
actionColumn: {
width: 170,
title: '操作',
dataIndex: 'action',
// slots: { customRender: 'action' },
},
});
function handleDeleteIds() {
createConfirm({
iconType: 'warning',
title: '确认删除',
content: '确认批量删除选中数据吗?',
onOk() {
createMessage.success('批量删除成功!');
},
});
}
function showDetails(record) {
router.push({
path: '/mainBody/details',
});
}
/** 重置密码弹窗确定按钮*/
/** 删除按钮*/
function handleDelete(record: Recordable) {
createMessage.success('删除成功!');
reload();
}
/** 导出按钮*/
async function handleExport() {
}
/** 导入成功*/
function handleImportSuccess() {
reload();
}
/** 新增/编辑成功*/
function handleSuccess({ isUpdate, values }) {
if (isUpdate) {
// 演示不刷新表格直接更新内部数据。
// 注意:updateTableDataRecord要求表格的rowKey属性为string并且存在于每一行的record的keys中
const result = updateTableDataRecord(values.id, values);
console.log(result);
reload();
} else {
reload();
}
}
/** 部门树的select*/
function handleSelect(deptId = '') {
searchInfo.deptId = deptId;
reload();
}
</script>
<style scoped>
function handleView(record: Recordable) {
go('/system/account_detail/' + record.id);
}
onMounted(() => {
});
</style>
</script>
export const tableList: any[] = [
{
businessId: 1,
name: '目录示例',
num: '111',
flag: '已发布',
group: '默认工作组',
},
{
businessId: 2,
name: '目录示例',
num: '222',
flag: '已发布',
group: '默认工作组',
},
{
businessId: 3,
name: '目录示例',
num: '333',
flag: '已发布',
group: '默认工作组',
},
{
businessId: 4,
name: '目录示例',
num: '444',
flag: '已发布',
group: '默认工作组',
},
{
businessId: 5,
name: '目录示例',
num: '555',
flag: '已发布',
group: '默认工作组',
},
]
export const treeDataList = [
{
title: '引用文档管理',
key: 1,
icon: 'home|svg',
children: [
{ title: '共享工作区', key: 2 },
{ title: '商城工作区', key: 3 },
{ title: '数据中台工作区02', key: 4 },
{ title: '数据中台工作区03', key: 5 },
],
},
]
import {getAllRoleList} from '@/api/system/role/role';
import { BasicColumn, FormSchema } from '@/components/Table';
import {h} from "vue";
import {Tag} from "ant-design-vue";
import { Switch } from 'ant-design-vue';
import {useMessage} from "@/hooks/web/useMessage";
import {changeFlagApi} from "@/api/system/user/user"; // 引入开关组件
type CheckedType = boolean | string | number;
export const columns: BasicColumn[] = [
{
title: '文档名称',
dataIndex: 'name',
width: 120,
},
{
title: '文档编号',
dataIndex: 'num',
width: 120,
},
{
title: '发布状态',
dataIndex: 'flag',
width: 120,
},
{
title: '权属工作组',
dataIndex: 'group',
width: 120,
},
];
export const searchFormSchema: FormSchema[] = [
{
field: 'name',
label: '文档名称',
component: 'Input',
colProps: { span: 8 },
componentProps: {
placeholder: '输入文档名称',
},
},
{
field: 'num',
label: '文档编号',
component: 'Input',
colProps: { span: 8 },
componentProps: {
placeholder: '输入文档编号',
},
},
];
export const resetPasswordFormSchema: any[] = [
{
field: 'newPassword',
label: '新密码',
component: 'InputPassword',
componentProps: {
placeholder: '请输入8~16位,由字母和数字混合所组成的新密码',
},
required: true,
// ifShow: false,
},
]
const passwordCheck = (rule, value, callback) => {
const pattern = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{8,16}$/
if (!pattern.test(value)) {
callback(new Error('新密码必须为数字与字母的组合'))
}
callback()
}
export const accountFormSchema: any[] = [
{
field: 'username',
label: '登录名',
component: 'Input',
// helpMessage: ['本字段演示异步验证', '不能输入带有admin的用户名'],
rules: [
{
required: true,
message: '请输入登录名',
},
],
},
{
field: 'password',
label: '密码',
component: 'InputPassword',
rules: [
{
required: true,
message: '请输入用户密码',
},
{ min: 8, max: 16, message: '长度在 8 到 16 个字符', trigger: 'blur' },
{
validator: passwordCheck,
trigger: 'blur'
}
],
},
{
field: 'name',
label: '姓名',
component: 'Input',
},
{
field: 'nickName',
label: '昵称',
component: 'Input',
},
{
field: 'sex',
label: '性别',
component: 'Select',
componentProps: {
options: [
{ label: '男', value: '1' },
{ label: '女', value: '0' },
],
},
},
{
field: 'phone',
label: '手机号码',
component: 'Input',
rules: [
{ required: false, message: '请输入手机号码', trigger: 'blur' },
{
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
message: '请输入正确的手机号码',
trigger: 'blur'
}
],
},
{
field: 'idNumber',
label: '身份证号',
component: 'Input',
rules: [
{
required: false,
message: '请输入身份证号',
trigger: 'blur'
},
{ min: 18, max: 18, message: '长度18字符', trigger: 'blur' }
],
},
{
field: 'email',
label: '邮箱',
component: 'Input',
rules: [
{ required: false, message: '请输入邮箱地址', trigger: 'blur' },
{
type: 'email',
message: '请输入正确的邮箱地址',
trigger: ['blur', 'change']
}
],
},
{
field: 'flag',
label: '状态',
component: 'RadioGroup',
colProps: { lg: 24, md: 24 },
componentProps: {
options: [
{ label: '启用', value: '1' },
{ label: '停用', value: '0' },
],
},
required: true,
},
{
field: 'deptId',
label: '所属部门',
component: 'TreeSelect',
colProps: { lg: 24, md: 24 },
componentProps: {
fieldNames: {
label: 'deptName',
value: 'businessId',
},
getPopupContainer: () => document.body,
},
required: true,
},
{
field: 'roleList',
label: '角色',
component: 'ApiSelect',
colProps: { lg: 24, md: 24 },
componentProps: {
// placeholder: '公开给',
mode: 'multiple',
api: getAllRoleList,
labelField: 'roleName',
valueField: 'businessId',
resultField:'data',
},
required: true,
},
{
label: '备注',
field: 'remarks',
component: 'InputTextArea',
colProps: { lg: 24, md: 24 },
},
];
<template>
<BasicModal width="40%" v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup>
import {ref, computed, unref, reactive} from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { formSchema } from './mainBody.data';
import {treeDataList} from './mock'
import { useMessage } from '@/hooks/web/useMessage';
import {getMenuList} from "@/api/system/menu/menu";
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const isUpdate = ref(true);
const rowId = ref('');
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 24, md: 24 },
schemas: formSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
console.log('1111111111111111111111111111111')
resetFields();
setModalProps({ confirmLoading: false });
isUpdate.value = !!data?.isUpdate;
if (unref(isUpdate)) {
// 通过id获取行详情信息
// 塞值
setFieldsValue({
...data.record,
});
}
updateSchema({
field: 'path',
componentProps: {
treeData: treeDataList
},
});
});
const getTitle = computed(() => ('新建文件夹'));
async function handleSubmit() {
try {
const values = await validate();
setModalProps({ confirmLoading: true });
// TODO custom api
closeModal();
emit('success', { isUpdate: unref(isUpdate), values: { ...values, id: rowId.value } });
} finally {
setModalProps({ confirmLoading: false });
}
}
</script>
......@@ -11,15 +11,15 @@
</div>
</div>
<div class="title_right">
<div class="item">
<div v-if="showUpdate === '2'" class="item" @click="handleUpdate">
<Icon icon="ant-design:reload-outlined" :size="28" :color="'#068CFF'" />
<div class="name">手动更新</div>
</div>
<div class="item">
<Icon icon="ant-design:setting-outlined" :size="28" :color="'#068CFF'" />
<div class="name">基本信息</div>
</div>
<div class="item">
<!-- <div class="item">-->
<!-- <Icon icon="ant-design:setting-outlined" :size="28" :color="'#068CFF'" />-->
<!-- <div class="name">基本信息</div>-->
<!-- </div>-->
<div class="item" @click="handleSubmit">
<Icon icon="ant-design:save-outlined" :size="28" :color="'#068CFF'" />
<div class="name">保存</div>
</div>
......@@ -27,7 +27,7 @@
</div>
<Tabs default-active-key="1">
<Tabs.TabPane key="1" tab="主体配置">
<setup/>
<Setup ref="child" @change="handleChange"/>
</Tabs.TabPane>
<Tabs.TabPane key="2" tab="引用关系">
<referenceRelationship/>
......@@ -37,10 +37,30 @@
</template>
<script lang="ts" setup>
import {reactive,ref, unref, onDeactivated, onMounted, computed} from 'vue';
import Icon from '@/components/Icon/Icon.vue';
import { Card, Col, Row, Space, message,Tabs,Badge } from 'ant-design-vue';
import referenceRelationship from './referenceRelationship/index.vue';
import setup from './setup/index.vue';
import Setup from './setup/index.vue'
import {useMessage} from "@/hooks/web/useMessage";
import {Nullable} from "@vben/types";
import {TreeActionType} from "@/components/Tree";
const { createMessage,createConfirm } = useMessage();
const child = ref(null);
const showUpdate = ref('1');
function handleSubmit() {
createMessage.success('保存成功!');
}
function handleUpdate() {
console.log('aaaaaaaa',child.value)
if (child.value) {
console.log('bbbbbbbbb')
child.value.handleShowDetails();
}
}
function handleChange({ type }) {
showUpdate.value = type
}
</script>
<style scoped lang="scss">
......@@ -66,6 +86,7 @@ import setup from './setup/index.vue';
align-items: center;
justify-content: space-between;
.item{
cursor: pointer;
width: 100px;
text-align: center;
}
......
<template>
<div class="m-4 mr-0 overflow-hidden bg-white">
<BasicTree
title="主体"
title=""
ref="treeRef"
toolbar
search
......@@ -20,7 +20,7 @@ import {h, nextTick, onMounted, ref, unref} from 'vue';
import {BasicTree, TreeActionType, TreeItem} from '@/components/Tree';
import { getDeptList } from '@/api/system/dept/dept';
import {Nullable} from "@vben/types";
import {treeDataList} from "./mock";
import {detailtreeDataList} from "./mock";
import {DeleteOutlined, EditOutlined, FolderOutlined, PlusOutlined} from "@ant-design/icons-vue";
defineOptions({ name: 'DeptTree' });
......@@ -31,7 +31,7 @@ import {DeleteOutlined, EditOutlined, FolderOutlined, PlusOutlined} from "@ant-d
async function fetch() {
treeData.value = treeDataList
treeData.value = detailtreeDataList
await nextTick(() => {
getTree().expandAll(true)
})
......
......@@ -14,7 +14,10 @@
<Tabs.TabPane key="1" tab="主体信息">
<Tabs default-active-key="1">
<Tabs.TabPane key="1" tab="列信息">
<BasicTable @register="registerTableThree">
<BasicTable v-if="type=== '1'" @register="registerTableThree">
</BasicTable>
<BasicTable v-if="type=== '2'" @register="registerTableThreeTwo">
</BasicTable>
</Tabs.TabPane>
......@@ -46,6 +49,7 @@
</div>
</template>
<script lang="ts" setup>
import { defineExpose } from 'vue';
import { Card, Col, Row, Space, message,Tabs,Badge } from 'ant-design-vue';
import Icon from '@/components/Icon/Icon.vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
......@@ -56,12 +60,12 @@ import detailDrawer from './detailDrawer.vue'
import DeptTree from './DeptTree.vue';
import { useMessage } from '@/hooks/web/useMessage';
import { useModal } from '@/components/Modal';
import {tableListViewTwo,tableListView,tableListViewThree} from "./mock";
import {tableListViewTwo, tableListView, tableListViewThree, tableListViewThreeTwo} from "./mock";
import { useGo } from '@/hooks/web/usePage';
import { useRoute,onBeforeRouteLeave } from 'vue-router';
import { useFilterStore } from '@/store/modules/filterData';
import {router} from "@/router";
import {FormSchema, columns,Threecolumns, Twocolumns} from "./mainBody.data";
import {FormSchema, columns, Threecolumns, Twocolumns, ThreecolumnsTwo} from "./mainBody.data";
import {useDrawer} from "@/components/Drawer";
defineOptions({ name: 'AccountManagement' });
......@@ -74,6 +78,7 @@ import {useDrawer} from "@/components/Drawer";
const type = ref('1')
const showDetails = ref(false)
const [registerDrawer, { openDrawer }] = useDrawer();
const emit = defineEmits(['change']);
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate,getFieldsValue }] = useForm({
......@@ -143,7 +148,7 @@ const [registerTableThree, ] = useTable({
pageNu: "1",
pageSize: "10",
pages: "1",
total: tableListViewThree.length,
total:tableListViewThree.length,
code:'',
message:'',
data: tableListViewThree,
......@@ -152,7 +157,7 @@ const [registerTableThree, ] = useTable({
return { ...response};
},
columns:Threecolumns,
columns: Threecolumns,
useSearchForm: false,
showTableSetting: false,
......@@ -161,13 +166,37 @@ const [registerTableThree, ] = useTable({
});
const [registerTableThreeTwo, ] = useTable({
title: '',
api: async (params) => {
console.log(params)
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total:tableListViewThreeTwo.length,
code:'',
message:'',
data: tableListViewThreeTwo,
};
return { ...response};
},
columns: ThreecolumnsTwo,
useSearchForm: false,
showTableSetting: false,
bordered: true,
});
function handleShowDetails() {
console.log('1111')
showDetails.value = true
openDrawer(true);
}
/** 部门树的select*/
function handleSelect(deptId = '') {
searchInfo.deptId = deptId;
......@@ -181,15 +210,19 @@ onMounted(() => {
//调用接口 返回的参数赋值给dictValue
if(value === '1') {
type.value = '1'
emit('change', { type: type.value});
}else {
type.value = '2'
emit('change', { type: type.value});
}
},
},
});
})
defineExpose({
handleShowDetails
});
</script>
<style lang="scss" scoped>
.mainBody_setup_module{
......
......@@ -48,6 +48,66 @@ export const Threecolumns: BasicColumn[] = [
width: 120,
},
]
export const ThreecolumnsTwo: BasicColumn[] = [
{
title: '表名',
dataIndex: 'orderName',
editable:true,
edit:true,
width: 120,
},
{
title: '列名',
dataIndex: 'colName',
width: 120,
},
{
title: '中文名',
dataIndex: 'chinaName',
editable:true,
edit:true,
width: 120,
},
{
title: '字段描述',
dataIndex: 'des',
editable:true,
edit:true,
width: 120,
},
{
title: '字段类型',
dataIndex: 'type',
width: 120,
},
{
title: '可空',
dataIndex: 'empty',
width: 120,
},
{
title: '时间字段',
dataIndex: 'time',
editable:true,
edit: true,
editComponent: 'Checkbox',
editValueMap: (value) => {
return value ? '是' : '否';
},
width: 120,
},
{
title: '主体标识',
dataIndex: 'mainFlag',
editable:true,
edit: true,
editComponent: 'Checkbox',
editValueMap: (value) => {
return value ? '是' : '否';
},
width: 120,
},
]
export const Twocolumns: BasicColumn[] = [
{
title: '取消时间',
......@@ -113,6 +173,7 @@ export const FormSchema: FormSchema[] = [
{
field: 'valueOne',
label: '数据源',
defaultValue:'1',
component: 'Select',
componentProps: {
placeholder: '数据源',
......
......@@ -32,6 +32,41 @@ export const tableListViewThree: any[] = [
time: '1',
},
]
export const tableListViewThreeTwo: any[] = [
{
businessId: 1,
orderName: 'order_creation_details',
colName: 'city',
chinaName: '城市',
des: '城市',
type: 'varchar(255)',
empty: '是',
time: '1',
mainFlag: '是',
},
{
businessId: 1,
orderName: 'order_creation_details',
colName: 'city',
chinaName: '城市',
des: '城市',
type: 'varchar(255)',
empty: '是',
time: '1',
mainFlag: '是',
},
{
businessId: 1,
orderName: 'order_creation_details',
colName: 'city',
chinaName: '城市',
des: '城市',
type: 'varchar(255)',
empty: '是',
time: '1',
mainFlag: '是',
},
]
export const tableListViewTwo: any[] = [
{
businessId: 1,
......@@ -154,7 +189,26 @@ export const tableList: any[] = [
updateDate: '2024-10-25 10:04:05',
},
]
export const detailtreeDataList = [
{
title: 'audit_test',
key: '0-0',
icon: 'home|svg',
children: [
{ title: 'test', key: '0-0-0' },
],
},
{
title: 'default',
key: '0-1',
icon: 'home|svg',
children: [
{ title: 'csv_test', key: '0-0-1' },
{ title: 'fs_assets', key: '0-0-2' },
{ title: 'index1055', key: '0-0-3' },
],
},
]
export const treeDataList = [
{
title: 'audit_test',
......
......@@ -3,11 +3,11 @@
<DeptTree class="w-1/4 xl:w-1/5" @select="handleSelect" />
<BasicTable @register="registerTable" class="w-3/4 xl:w-4/5" :searchInfo="searchInfo">
<template #toolbar>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary" >删除</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary" @click="handleDeleteIds">删除</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary" >导出</a-button>
<a-button type="primary" @click="handleImport">导入</a-button>
<a-button type="primary" >新增文件夹</a-button>
<a-button type="primary" >新增主体</a-button>
<a-button type="primary" @click="handleAdd" >新增文件夹</a-button>
<a-button type="primary" @click="handleAddMainBody" >新增主体</a-button>
</template>
<template #name="{ text, record }">
<a @click="showDetails(record)"> {{ text }}</a>
......@@ -18,12 +18,20 @@
:actions="[
{
label: '编辑',
onClick: handleEdit.bind(null, record),
},
{
label: '预览',
{
label: '移动',
onClick: handleRemove.bind(null, record),
},
{
label: '更多',
color: 'error',
label: '删除',
popConfirm: {
title: '是否确认删除',
placement: 'left',
confirm: handleDelete.bind(null, record),
},
},
]"
/>
......@@ -31,17 +39,20 @@
</template>
</BasicTable>
<importModal @register="registerImport" @success="handleImportSuccess" />
<addFolder @register="register"/>
<remove-modal @register="registerRemove"/>
<main-body-modal @register="registerMain"/>
</PageWrapper>
</template>
<script lang="ts" setup>
import { reactive,unref,onDeactivated,onMounted } from 'vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import addFolder from "@/views/mainBody/addFolder.vue";
import { PageWrapper } from '@/components/Page';
import DeptTree from './DeptTree.vue';
import { useMessage } from '@/hooks/web/useMessage';
import { useModal } from '@/components/Modal';
import importModal from './importModal.vue';
import ImportModal from './importModal.vue';
import {tableList} from "./mock";
import { columns, searchFormSchema } from './mainBody.data';
import { useGo } from '@/hooks/web/usePage';
......@@ -50,12 +61,18 @@
import { useFilterStore } from '@/store/modules/filterData';
import {useUserStore} from "@/store/modules/user";
import {router} from "@/router";
import AddFolder from "@/views/mainBody/addFolder.vue";
import RemoveModal from "@/views/mainBody/removeModal.vue";
import MainBodyModal from "@/views/mainBody/mainBodyModal.vue";
defineOptions({ name: 'AccountManagement' });
const { createMessage } = useMessage();
const { createMessage,createConfirm } = useMessage();
const filterStore = useFilterStore();
const route = useRoute();
const go = useGo();
const [register, { openModal }] = useModal();
const [registerImport, { openModal: openImportModal }] = useModal();
const [registerRemove, { openModal: openRemoveModal}] = useModal();
const [registerMain, { openModal: openMainModal}] = useModal();
const searchInfo = reactive<Recordable>({});
const [registerTable, { reload, updateTableDataRecord, getSearchInfo,getForm,getRowSelection }] = useTable({
title: '主体管理列表',
......@@ -110,12 +127,40 @@
openImportModal(true,{
})
}
/** 新建文件夹*/
function handleAdd() {
openModal(true);
}
function handleAddMainBody() {
openMainModal(true,{
isUpdate: false,
})
}
function handleEdit(record: Recordable) {
openMainModal(true,{
record,
isUpdate: true,
})
}
function handleDeleteIds() {
createConfirm({
iconType: 'warning',
title: '确认删除',
content: '确认批量删除选中数据吗?',
onOk() {
createMessage.success('批量删除成功!');
},
});
}
/** 重置密码弹窗确定按钮*/
/** 删除按钮*/
function handleDelete(record: Recordable) {
createMessage.success('删除成功!');
reload();
}
function handleRemove() {
openRemoveModal(true)
}
/** 导出按钮*/
async function handleExport() {
......
......@@ -62,6 +62,77 @@ export const columns: BasicColumn[] = [
},
];
export const formSchemaRemove: any = [
{
field: 'path',
label: '文件夹路径',
component: 'Input',
colProps: { span: 8 },
componentProps: {
placeholder: '输入文件夹路径',
},
},
]
export const formSchemaMain: any = [
{
field: 'name',
label: '主体名称',
component: 'Input',
colProps: { span: 8 },
componentProps: {
placeholder: '输入主体名称',
},
},
{
field: 'des',
label: '描述',
component: 'Input',
colProps: { span: 8 },
componentProps: {
placeholder: '输入描述',
},
},
{
field: 'from',
label: '来源',
component: 'Select',
componentProps: {
placeholder: '选择来源',
options: [
{ label: 'Inceptor', value: 'Inceptor' },
{ label: 'oracle', value: 'oracle' },
{ label: 'oracle2', value: 'oracle2' },
{ label: '指标汇总表', value: '指标汇总表' },
],
},
colProps: { span: 8 },
},
]
export const formSchema: any = [
{
field: 'name',
label: '文件夹名称',
component: 'Input',
colProps: { span: 8 },
componentProps: {
placeholder: '输入文件夹名称',
},
},
{
field: 'path',
label: '文件夹路径',
component: 'TreeSelect',
colProps: { span: 8 },
componentProps: {
fieldNames: {
label: 'title',
value: 'key',
},
getPopupContainer: () => document.body,
},
},
]
export const searchFormSchema: FormSchema[] = [
{
field: 'name',
......
<template>
<BasicModal width="40%" v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup>
import {ref, computed, unref, reactive} from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { formSchemaMain } from './mainBody.data';
import { useMessage } from '@/hooks/web/useMessage';
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const isUpdate = ref(true);
const rowId = ref('');
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 24, md: 24 },
schemas: formSchemaMain,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields();
setModalProps({ confirmLoading: false });
isUpdate.value = !!data?.isUpdate;
if (unref(isUpdate)) {
// 通过id获取行详情信息
// 塞值
setFieldsValue({
...data.record,
});
}
});
const getTitle = computed(() => (!unref(isUpdate) ? '新建主体' : '编辑主体'));
async function handleSubmit() {
try {
const values = await validate();
setModalProps({ confirmLoading: true });
// TODO custom api
closeModal();
emit('success', { isUpdate: unref(isUpdate), values: { ...values, id: rowId.value } });
} finally {
setModalProps({ confirmLoading: false });
}
}
</script>
......@@ -64,11 +64,11 @@ export const tableList: any[] = [
},
]
export const treeDataList = [
{
title: '主体管理',
key: 1,
icon: 'home|svg',
children: [
{ title: 'admin_个人工作区', key: 2 },
{ title: '共享工作区', key: 3 },
......
<template>
<BasicModal width="40%" v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup>
import {ref, computed, unref, reactive} from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { formSchemaRemove } from './mainBody.data';
import { useMessage } from '@/hooks/web/useMessage';
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const isUpdate = ref(true);
const rowId = ref('');
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 24, md: 24 },
schemas: formSchemaRemove,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields();
setModalProps({ confirmLoading: false });
isUpdate.value = !!data?.isUpdate;
if (unref(isUpdate)) {
// 通过id获取行详情信息
// 塞值
setFieldsValue({
...data.record,
});
}
});
const getTitle = computed(() => ('新建文件夹'));
async function handleSubmit() {
try {
const values = await validate();
setModalProps({ confirmLoading: true });
// TODO custom api
closeModal();
emit('success', { isUpdate: unref(isUpdate), values: { ...values, id: rowId.value } });
} finally {
setModalProps({ confirmLoading: false });
}
}
</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