yixr
/
oa_front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: edit button permission issue

This commit is contained in:
louis 2024-04-08 08:34:08 +08:00
parent 6f0f34a33c
commit c0df1d704a
5 changed files with 178 additions and 182 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/api/backend/api/typings.d.ts vendored
View File

@ -1637,7 +1637,7 @@ declare namespace API {
/** 产品名称 */ /** 产品名称 */
name?: string; name?: string;
/** 产品规格 */ /** 产品规格 */
productSpecification: string; productSpecification?: string;
/** 所属公司 */ /** 所属公司 */
companyId?: number; companyId?: number;
/** 单位 */ /** 单位 */

2
src/views/materials-inventory/company/index.vue
View File

@ -12,7 +12,7 @@
<template #toolbar> <template #toolbar>
<a-button <a-button
type="primary" type="primary"
:disabled="!$auth('system:role:create')" :disabled="!$auth('app:company:create')"
@click="openEditModal({})" @click="openEditModal({})"
> >
新增 新增

350
src/views/materials-inventory/product/index.vue
View File

@ -1,21 +1,17 @@
<template> <template>
<div v-if="columns?.length"> <div v-if="columns?.length">
<DynamicTable <DynamicTable row-key="id"
row-key="id"
header-title="产品管理" header-title="产品管理"
title-tooltip="" title-tooltip=""
:data-request="Api.product.productList" :data-request="Api.product.productList"
:columns="columns" :columns="columns"
:exportFileName="'产品'" :exportFileName="'产品'"
bordered bordered
size="small" size="small">
>
<template #toolbar> <template #toolbar>
<a-button <a-button type="primary"
type="primary" :disabled="!$auth('app:product:create')"
:disabled="!$auth('system:role:create')" @click="openEditModal({})">
@click="openEditModal({})"
>
新增 新增
</a-button> </a-button>
</template> </template>
@ -24,180 +20,180 @@
</template> </template>
<script setup lang="tsx"> <script setup lang="tsx">
import { useTable, type LoadDataParams, type TableColumn } from '@/components/core/dynamic-table'; import { useTable, type LoadDataParams, type TableColumn } from '@/components/core/dynamic-table';
import { baseColumns, type TableColumnItem, type TableListItem } from './columns'; import { baseColumns, type TableColumnItem, type TableListItem } from './columns';
import Api from '@/api/'; import Api from '@/api/';
import { useFormModal, useModal } from '@/hooks/useModal'; import { useFormModal, useModal } from '@/hooks/useModal';
import { formSchemas } from './formSchemas'; import { formSchemas } from './formSchemas';
import { Button } from 'ant-design-vue'; import { Button } from 'ant-design-vue';
import AttachmentManage from '@/components/business/attachment-manage/index.vue'; import AttachmentManage from '@/components/business/attachment-manage/index.vue';
import AttachmentUpload from '@/components/business/attachment-upload/index.vue'; import AttachmentUpload from '@/components/business/attachment-upload/index.vue';
import { ref, onMounted, type FunctionalComponent } from 'vue'; import { ref, onMounted, type FunctionalComponent } from 'vue';
import { useDictStore } from '@/store/modules/dict'; import { useDictStore } from '@/store/modules/dict';
defineOptions({ defineOptions({
name: 'Product', name: 'Product',
}); });
const [DynamicTable, dynamicTableInstance] = useTable({ formProps: { autoSubmitOnEnter: true } }); const [DynamicTable, dynamicTableInstance] = useTable({ formProps: { autoSubmitOnEnter: true } });
const [showModal] = useFormModal(); const [showModal] = useFormModal();
const [fnModal] = useModal(); const [fnModal] = useModal();
const isUploadPopupVisiable = ref(false); const isUploadPopupVisiable = ref(false);
let columns = ref<TableColumnItem[]>(); let columns = ref<TableColumnItem[]>();
onMounted(() => { onMounted(() => {
columns.value = [ columns.value = [
...baseColumns, ...baseColumns,
{ {
title: '附件', title: '附件',
width: 50, width: 50,
maxWidth: 50, maxWidth: 50,
hideInSearch: true, hideInSearch: true,
hideInExport: true, hideInExport: true,
dataIndex: 'files', dataIndex: 'files',
customRender: ({ record }) => <FilesRender {...record} />, customRender: ({ record }) => <FilesRender {...record} />,
}, },
{ {
title: '操作', title: '操作',
maxWidth: 150, maxWidth: 150,
width: 150, width: 150,
minWidth: 150, minWidth: 150,
fixed: 'right', fixed: 'right',
dataIndex: 'ACTION', dataIndex: 'ACTION',
hideInSearch: true, hideInSearch: true,
actions: ({ record }) => [ actions: ({ record }) => [
{ {
icon: 'ant-design:edit-outlined', icon: 'ant-design:edit-outlined',
tooltip: '编辑', tooltip: '编辑',
auth: { auth: {
perm: 'app:product:update', perm: 'app:product:update',
effect: 'disable', effect: 'disable',
},
onClick: () => openEditModal(record),
}, },
{ onClick: () => openEditModal(record),
icon: 'ant-design:delete-outlined',
color: 'red',
tooltip: '删除此产品',
auth: 'app:product:delete',
popConfirm: {
title: '你确定要删除吗？',
placement: 'left',
onConfirm: () => delRowConfirm(record.id),
},
},
{
icon: 'ant-design:cloud-upload-outlined',
tooltip: '上传附件',
onClick: () => openAttachmentUploadModal(record),
},
],
},
];
});
const openAttachmentUploadModal = async (record: TableListItem) => {
isUploadPopupVisiable.value = true;
fnModal.show({
width: 800,
title: `产品: ${record.name}`,
content: () => {
return (
<AttachmentUpload
bussinessModule="product"
bussinessRecordId={record.id}
onClose={handleUploadClose}
afterUploadCallback={(files) => {
afterUploadCallback(files, record.id);
}}
></AttachmentUpload>
);
},
destroyOnClose: true,
open: isUploadPopupVisiable.value,
footer: null,
});
};
const handleUploadClose = (hasSuccess: boolean) => {
fnModal.hide();
isUploadPopupVisiable.value = false;
};
const afterUploadCallback = async (
files: { filename: { path: string; id: number } }[],
id: number,
) => {
await Api.product.productUpdate({ id }, { fileIds: files.map((item) => item.filename.id) });
dynamicTableInstance?.reload();
};
/**
* @description 打开新增/编辑弹窗
*/
const openEditModal = async (record: Partial<TableListItem>) => {
const [formRef] = await showModal({
modalProps: {
title: `${record.id ? '编辑' : '新增'}产品`,
width: '50%',
onFinish: async (values) => {
if (record.id) {
await Api.product.productUpdate({ id: record.id }, values);
} else {
await Api.product.productCreate(values);
}
dynamicTableInstance?.reload();
}, },
{
icon: 'ant-design:delete-outlined',
color: 'red',
tooltip: '删除此产品',
auth: 'app:product:delete',
popConfirm: {
title: '你确定要删除吗？',
placement: 'left',
onConfirm: () => delRowConfirm(record.id),
},
},
{
icon: 'ant-design:cloud-upload-outlined',
tooltip: '上传附件',
onClick: () => openAttachmentUploadModal(record),
},
],
},
];
});
const openAttachmentUploadModal = async (record: TableListItem) => {
isUploadPopupVisiable.value = true;
fnModal.show({
width: 800,
title: `产品: ${record.name}`,
content: () => {
return (
<AttachmentUpload
bussinessModule="product"
bussinessRecordId={record.id}
onClose={handleUploadClose}
afterUploadCallback={(files) => {
afterUploadCallback(files, record.id);
}}
></AttachmentUpload>
);
},
destroyOnClose: true,
open: isUploadPopupVisiable.value,
footer: null,
});
};
const handleUploadClose = (hasSuccess: boolean) => {
fnModal.hide();
isUploadPopupVisiable.value = false;
};
const afterUploadCallback = async (
files: { filename: { path: string; id: number } }[],
id: number,
) => {
await Api.product.productUpdate({ id }, { fileIds: files.map((item) => item.filename.id) });
dynamicTableInstance?.reload();
};
/**
* @description 打开新增/编辑弹窗
*/
const openEditModal = async (record: Partial<TableListItem>) => {
const [formRef] = await showModal({
modalProps: {
title: `${record.id ? '编辑' : '新增'}产品`,
width: '50%',
onFinish: async (values) => {
if (record.id) {
await Api.product.productUpdate({ id: record.id }, values);
} else {
await Api.product.productCreate(values);
}
dynamicTableInstance?.reload();
}, },
formProps: { },
labelWidth: 100, formProps: {
schemas: formSchemas, labelWidth: 100,
}, schemas: formSchemas,
},
});
// 如果是编辑的话，需要获取角色详情
if (record.id) {
const info = await Api.product.productInfo({ id: record.id });
formRef?.setFieldsValue({
...info,
}); });
}
};
const delRowConfirm = async (record) => {
await Api.product.productDelete({ id: record });
dynamicTableInstance?.reload();
};
// 如果是编辑的话，需要获取角色详情 const FilesRender: FunctionalComponent<TableListItem> = (product: TableListItem) => {
if (record.id) { const [fnModal] = useModal();
const info = await Api.product.productInfo({ id: record.id }); return (
formRef?.setFieldsValue({ <Button
...info, type="link"
}); onClick={() => {
} openFilesManageModal(fnModal, product);
}; }}
const delRowConfirm = async (record) => { >
await Api.product.productDelete({ id: record }); {product.files?.length || 0}
dynamicTableInstance?.reload(); </Button>
}; );
};
const FilesRender: FunctionalComponent<TableListItem> = (product: TableListItem) => { const openFilesManageModal = (fnModal, product: TableListItem) => {
const [fnModal] = useModal(); const fileIds = product.files?.map((item) => item.id) || [];
return ( fnModal.show({
<Button width: 1200,
type="link" title: `附件管理`,
onClick={() => { content: () => {
openFilesManageModal(fnModal, product); return (
}} <AttachmentManage
> fileIds={fileIds}
{product.files?.length || 0} onDelete={(unlinkIds) => unlinkAttachments(product.id, unlinkIds)}
</Button> ></AttachmentManage>
); );
}; },
destroyOnClose: true,
const openFilesManageModal = (fnModal, product: TableListItem) => { footer: null,
const fileIds = product.files?.map((item) => item.id) || []; });
fnModal.show({ };
width: 1200, const unlinkAttachments = async (id: number, unlinkIds: number[]) => {
title: `附件管理`, await Api.product.unlinkAttachments({ id }, { fileIds: unlinkIds });
content: () => { dynamicTableInstance?.reload();
return ( };
<AttachmentManage
fileIds={fileIds}
onDelete={(unlinkIds) => unlinkAttachments(product.id, unlinkIds)}
></AttachmentManage>
);
},
destroyOnClose: true,
footer: null,
});
};
const unlinkAttachments = async (id: number, unlinkIds: number[]) => {
await Api.product.unlinkAttachments({ id }, { fileIds: unlinkIds });
dynamicTableInstance?.reload();
};
</script> </script>
<style lang="less" scoped></style> <style lang="less" scoped></style>

2
src/views/materials-inventory/project/index.vue
View File

@ -12,7 +12,7 @@
<template #toolbar> <template #toolbar>
<a-button <a-button
type="primary" type="primary"
:disabled="!$auth('system:role:create')" :disabled="!$auth('app:project:create')"
@click="openEditModal({})" @click="openEditModal({})"
> >
新增 新增

4
src/views/system/user/AvatarUpload.vue
View File

@ -43,9 +43,9 @@
if (!isJpgOrPng) { if (!isJpgOrPng) {
message.error('You can only upload JPG/PNG file!'); message.error('You can only upload JPG/PNG file!');
} }
const isLt2M = file.size / 1024 / 1024 < 2; const isLt2M = file.size / 1024 / 1024 < 30;
if (!isLt2M) { if (!isLt2M) {
message.error('Image must smaller than 2MB!'); message.error('Image must smaller than 30MB!');
} }
return isJpgOrPng && isLt2M; return isJpgOrPng && isLt2M;