@ant-design/icons#SafetyCertificateOutlined TypeScript Examples
The following examples show how to use
@ant-design/icons#SafetyCertificateOutlined.
You can vote up the ones you like or vote down the ones you don't like,
and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: index.tsx From datart with Apache License 2.0 | 5 votes |
Properties = memo(({ allowManage }: PropertiesProps) => {
const [selectedTab, setSelectedTab] = useState('');
const { editorInstance } = useContext(EditorContext);
const t = useI18NPrefix('view.properties');
useEffect(() => {
editorInstance?.layout();
}, [editorInstance, selectedTab]);
const tabTitle = useMemo(
() => [
{ name: 'reference', title: t('reference'), icon: <DatabaseOutlined /> },
{ name: 'variable', title: t('variable'), icon: <FunctionOutlined /> },
{ name: 'model', title: t('model'), icon: <ApartmentOutlined /> },
{
name: 'columnPermissions',
title: t('columnPermissions'),
icon: <SafetyCertificateOutlined />,
},
],
[t],
);
const tabSelect = useCallback(tab => {
setSelectedTab(tab);
}, []);
return allowManage ? (
<Container>
<PaneWrapper selected={selectedTab === 'variable'}>
<Variables />
</PaneWrapper>
<PaneWrapper selected={selectedTab === 'reference'}>
<Resource />
</PaneWrapper>
<PaneWrapper selected={selectedTab === 'model'}>
<DataModelTree />
</PaneWrapper>
<PaneWrapper selected={selectedTab === 'columnPermissions'}>
<ColumnPermissions />
</PaneWrapper>
<VerticalTabs tabs={tabTitle} onSelect={tabSelect} />
</Container>
) : null;
})
Example #2
Source File: Icon.tsx From html2sketch with MIT License | 4 votes |
IconSymbol: FC = () => {
return (
<Row>
{/*<CaretUpOutlined*/}
{/* className="icon"*/}
{/* symbolName={'1.General/2.Icons/1.CaretUpOutlined'}*/}
{/*/>*/}
{/* className="icon"*/}
{/* symbolName={'1.General/2.Icons/2.MailOutlined'}*/}
{/*/>*/}
{/*<StepBackwardOutlined*/}
{/* className="icon"*/}
{/* symbolName={'1.General/2.Icons/2.StepBackwardOutlined'}*/}
{/*/>*/}
{/*<StepForwardOutlined*/}
{/* className="icon"*/}
{/* symbolName={'1.General/2.Icons/2.StepBackwardOutlined'}*/}
{/*/>*/}
<StepForwardOutlined />
<ShrinkOutlined />
<ArrowsAltOutlined />
<DownOutlined />
<UpOutlined />
<LeftOutlined />
<RightOutlined />
<CaretUpOutlined />
<CaretDownOutlined />
<CaretLeftOutlined />
<CaretRightOutlined />
<VerticalAlignTopOutlined />
<RollbackOutlined />
<FastBackwardOutlined />
<FastForwardOutlined />
<DoubleRightOutlined />
<DoubleLeftOutlined />
<VerticalLeftOutlined />
<VerticalRightOutlined />
<VerticalAlignMiddleOutlined />
<VerticalAlignBottomOutlined />
<ForwardOutlined />
<BackwardOutlined />
<EnterOutlined />
<RetweetOutlined />
<SwapOutlined />
<SwapLeftOutlined />
<SwapRightOutlined />
<ArrowUpOutlined />
<ArrowDownOutlined />
<ArrowLeftOutlined />
<ArrowRightOutlined />
<LoginOutlined />
<LogoutOutlined />
<MenuFoldOutlined />
<MenuUnfoldOutlined />
<BorderBottomOutlined />
<BorderHorizontalOutlined />
<BorderInnerOutlined />
<BorderOuterOutlined />
<BorderLeftOutlined />
<BorderRightOutlined />
<BorderTopOutlined />
<BorderVerticleOutlined />
<PicCenterOutlined />
<PicLeftOutlined />
<PicRightOutlined />
<RadiusBottomleftOutlined />
<RadiusBottomrightOutlined />
<RadiusUpleftOutlined />
<RadiusUprightOutlined />
<FullscreenOutlined />
<FullscreenExitOutlined />
<QuestionOutlined />
<PauseOutlined />
<MinusOutlined />
<PauseCircleOutlined />
<InfoOutlined />
<CloseOutlined />
<ExclamationOutlined />
<CheckOutlined />
<WarningOutlined />
<IssuesCloseOutlined />
<StopOutlined />
<EditOutlined />
<CopyOutlined />
<ScissorOutlined />
<DeleteOutlined />
<SnippetsOutlined />
<DiffOutlined />
<HighlightOutlined />
<AlignCenterOutlined />
<AlignLeftOutlined />
<AlignRightOutlined />
<BgColorsOutlined />
<BoldOutlined />
<ItalicOutlined />
<UnderlineOutlined />
<StrikethroughOutlined />
<RedoOutlined />
<UndoOutlined />
<ZoomInOutlined />
<ZoomOutOutlined />
<FontColorsOutlined />
<FontSizeOutlined />
<LineHeightOutlined />
<SortAscendingOutlined />
<SortDescendingOutlined />
<DragOutlined />
<OrderedListOutlined />
<UnorderedListOutlined />
<RadiusSettingOutlined />
<ColumnWidthOutlined />
<ColumnHeightOutlined />
<AreaChartOutlined />
<PieChartOutlined />
<BarChartOutlined />
<DotChartOutlined />
<LineChartOutlined />
<RadarChartOutlined />
<HeatMapOutlined />
<FallOutlined />
<RiseOutlined />
<StockOutlined />
<BoxPlotOutlined />
<FundOutlined />
<SlidersOutlined />
<AndroidOutlined />
<AppleOutlined />
<WindowsOutlined />
<IeOutlined />
<ChromeOutlined />
<GithubOutlined />
<AliwangwangOutlined />
<DingdingOutlined />
<WeiboSquareOutlined />
<WeiboCircleOutlined />
<TaobaoCircleOutlined />
<Html5Outlined />
<WeiboOutlined />
<TwitterOutlined />
<WechatOutlined />
<AlipayCircleOutlined />
<TaobaoOutlined />
<SkypeOutlined />
<FacebookOutlined />
<CodepenOutlined />
<CodeSandboxOutlined />
<AmazonOutlined />
<GoogleOutlined />
<AlipayOutlined />
<AntDesignOutlined />
<AntCloudOutlined />
<ZhihuOutlined />
<SlackOutlined />
<SlackSquareOutlined />
<BehanceSquareOutlined />
<DribbbleOutlined />
<DribbbleSquareOutlined />
<InstagramOutlined />
<YuqueOutlined />
<AlibabaOutlined />
<YahooOutlined />
<RedditOutlined />
<SketchOutlined />
<AccountBookOutlined />
<AlertOutlined />
<ApartmentOutlined />
<ApiOutlined />
<QqOutlined />
<MediumWorkmarkOutlined />
<GitlabOutlined />
<MediumOutlined />
<GooglePlusOutlined />
<AppstoreAddOutlined />
<AppstoreOutlined />
<AudioOutlined />
<AudioMutedOutlined />
<AuditOutlined />
<BankOutlined />
<BarcodeOutlined />
<BarsOutlined />
<BellOutlined />
<BlockOutlined />
<BookOutlined />
<BorderOutlined />
<BranchesOutlined />
<BuildOutlined />
<BulbOutlined />
<CalculatorOutlined />
<CalendarOutlined />
<CameraOutlined />
<CarOutlined />
<CarryOutOutlined />
<CiCircleOutlined />
<CiOutlined />
<CloudOutlined />
<ClearOutlined />
<ClusterOutlined />
<CodeOutlined />
<CoffeeOutlined />
<CompassOutlined />
<CompressOutlined />
<ContactsOutlined />
<ContainerOutlined />
<ControlOutlined />
<CopyrightCircleOutlined />
<CopyrightOutlined />
<CreditCardOutlined />
<CrownOutlined />
<CustomerServiceOutlined />
<DashboardOutlined />
<DatabaseOutlined />
<DeleteColumnOutlined />
<DeleteRowOutlined />
<DisconnectOutlined />
<DislikeOutlined />
<DollarCircleOutlined />
<DollarOutlined />
<DownloadOutlined />
<EllipsisOutlined />
<EnvironmentOutlined />
<EuroCircleOutlined />
<EuroOutlined />
<ExceptionOutlined />
<ExpandAltOutlined />
<ExpandOutlined />
<ExperimentOutlined />
<ExportOutlined />
<EyeOutlined />
<FieldBinaryOutlined />
<FieldNumberOutlined />
<FieldStringOutlined />
<DesktopOutlined />
<DingtalkOutlined />
<FileAddOutlined />
<FileDoneOutlined />
<FileExcelOutlined />
<FileExclamationOutlined />
<FileOutlined />
<FileImageOutlined />
<FileJpgOutlined />
<FileMarkdownOutlined />
<FilePdfOutlined />
<FilePptOutlined />
<FileProtectOutlined />
<FileSearchOutlined />
<FileSyncOutlined />
<FileTextOutlined />
<FileUnknownOutlined />
<FileWordOutlined />
<FilterOutlined />
<FireOutlined />
<FlagOutlined />
<FolderAddOutlined />
<FolderOutlined />
<FolderOpenOutlined />
<ForkOutlined />
<FormatPainterOutlined />
<FrownOutlined />
<FunctionOutlined />
<FunnelPlotOutlined />
<GatewayOutlined />
<GifOutlined />
<GiftOutlined />
<GlobalOutlined />
<GoldOutlined />
<GroupOutlined />
<HddOutlined />
<HeartOutlined />
<HistoryOutlined />
<HomeOutlined />
<HourglassOutlined />
<IdcardOutlined />
<ImportOutlined />
<InboxOutlined />
<InsertRowAboveOutlined />
<InsertRowBelowOutlined />
<InsertRowLeftOutlined />
<InsertRowRightOutlined />
<InsuranceOutlined />
<InteractionOutlined />
<KeyOutlined />
<LaptopOutlined />
<LayoutOutlined />
<LikeOutlined />
<LineOutlined />
<LinkOutlined />
<Loading3QuartersOutlined />
<LoadingOutlined />
<LockOutlined />
<MailOutlined />
<ManOutlined />
<MedicineBoxOutlined />
<MehOutlined />
<MenuOutlined />
<MergeCellsOutlined />
<MessageOutlined />
<MobileOutlined />
<MoneyCollectOutlined />
<MonitorOutlined />
<MoreOutlined />
<NodeCollapseOutlined />
<NodeExpandOutlined />
<NodeIndexOutlined />
<NotificationOutlined />
<NumberOutlined />
<PaperClipOutlined />
<PartitionOutlined />
<PayCircleOutlined />
<PercentageOutlined />
<PhoneOutlined />
<PictureOutlined />
<PoundCircleOutlined />
<PoundOutlined />
<PoweroffOutlined />
<PrinterOutlined />
<ProfileOutlined />
<ProjectOutlined />
<PropertySafetyOutlined />
<PullRequestOutlined />
<PushpinOutlined />
<QrcodeOutlined />
<ReadOutlined />
<ReconciliationOutlined />
<RedEnvelopeOutlined />
<ReloadOutlined />
<RestOutlined />
<RobotOutlined />
<RocketOutlined />
<SafetyCertificateOutlined />
<SafetyOutlined />
<ScanOutlined />
<ScheduleOutlined />
<SearchOutlined />
<SecurityScanOutlined />
<SelectOutlined />
<SendOutlined />
<SettingOutlined />
<ShakeOutlined />
<ShareAltOutlined />
<ShopOutlined />
<ShoppingCartOutlined />
<ShoppingOutlined />
<SisternodeOutlined />
<SkinOutlined />
<SmileOutlined />
<SolutionOutlined />
<SoundOutlined />
<SplitCellsOutlined />
<StarOutlined />
<SubnodeOutlined />
<SyncOutlined />
<TableOutlined />
<TabletOutlined />
<TagOutlined />
<TagsOutlined />
<TeamOutlined />
<ThunderboltOutlined />
<ToTopOutlined />
<ToolOutlined />
<TrademarkCircleOutlined />
<TrademarkOutlined />
<TransactionOutlined />
<TrophyOutlined />
<UngroupOutlined />
<UnlockOutlined />
<UploadOutlined />
<UsbOutlined />
<UserAddOutlined />
<UserDeleteOutlined />
<UserOutlined />
<UserSwitchOutlined />
<UsergroupAddOutlined />
<UsergroupDeleteOutlined />
<VideoCameraOutlined />
<WalletOutlined />
<WifiOutlined />
<BorderlessTableOutlined />
<WomanOutlined />
<BehanceOutlined />
<DropboxOutlined />
<DeploymentUnitOutlined />
<UpCircleOutlined />
<DownCircleOutlined />
<LeftCircleOutlined />
<RightCircleOutlined />
<UpSquareOutlined />
<DownSquareOutlined />
<LeftSquareOutlined />
<RightSquareOutlined />
<PlayCircleOutlined />
<QuestionCircleOutlined />
<PlusCircleOutlined />
<PlusSquareOutlined />
<MinusSquareOutlined />
<MinusCircleOutlined />
<InfoCircleOutlined />
<ExclamationCircleOutlined />
<CloseCircleOutlined />
<CloseSquareOutlined />
<CheckCircleOutlined />
<CheckSquareOutlined />
<ClockCircleOutlined />
<FormOutlined />
<DashOutlined />
<SmallDashOutlined />
<YoutubeOutlined />
<CodepenCircleOutlined />
<AliyunOutlined />
<PlusOutlined />
<LinkedinOutlined />
<AimOutlined />
<BugOutlined />
<CloudDownloadOutlined />
<CloudServerOutlined />
<CloudSyncOutlined />
<CloudUploadOutlined />
<CommentOutlined />
<ConsoleSqlOutlined />
<EyeInvisibleOutlined />
<FileGifOutlined />
<DeliveredProcedureOutlined />
<FieldTimeOutlined />
<FileZipOutlined />
<FolderViewOutlined />
<FundProjectionScreenOutlined />
<FundViewOutlined />
<MacCommandOutlined />
<PlaySquareOutlined />
<OneToOneOutlined />
<RotateLeftOutlined />
<RotateRightOutlined />
<SaveOutlined />
<SwitcherOutlined />
<TranslationOutlined />
<VerifiedOutlined />
<VideoCameraAddOutlined />
<WhatsAppOutlined />
{/*</Col>*/}
</Row>
);
}
Example #3
Source File: Variables.tsx From datart with Apache License 2.0 | 4 votes |
Variables = memo(() => {
const { actions } = useViewSlice();
const dispatch = useDispatch();
const [formType, setFormType] = useState(CommonFormTypes.Add);
const [formVisible, setFormVisible] = useState(false);
const [editingVariable, setEditingVariable] = useState<
undefined | VariableHierarchy
>(void 0);
const [subjectFormVisible, setSubjectFormVisible] = useState(false);
const { editorCompletionItemProviderRef } = useContext(EditorContext);
const variables = useSelector(state =>
selectCurrentEditingViewAttr(state, { name: 'variables' }),
) as VariableHierarchy[];
const stage = useSelector(state =>
selectCurrentEditingViewAttr(state, { name: 'stage' }),
) as ViewViewModelStages;
const sourceId = useSelector(state =>
selectCurrentEditingViewAttr(state, { name: 'sourceId' }),
) as string;
const orgId = useSelector(selectOrgId);
const publicVariables = useSelector(selectVariables);
const t = useI18NPrefix('view.variable');
const tg = useI18NPrefix('global');
useEffect(() => {
if (editorCompletionItemProviderRef) {
editorCompletionItemProviderRef.current?.dispose();
dispatch(
getEditorProvideCompletionItems({
sourceId,
resolve: getItem => {
editorCompletionItemProviderRef.current =
monaco.languages.registerCompletionItemProvider('sql', {
provideCompletionItems: getItem,
});
},
}),
);
}
}, [
dispatch,
sourceId,
variables,
publicVariables,
editorCompletionItemProviderRef,
]);
const listSource = useMemo(
() =>
([] as Array<VariableHierarchy | Variable>)
.concat(variables)
.concat(publicVariables),
[variables, publicVariables],
);
const rowPermissions = useMemo(() => {
try {
return editingVariable?.relVariableSubjects.map(r => ({
...r,
value: r.value && JSON.parse(r.value),
}));
} catch (error) {
errorHandle(error);
throw error;
}
}, [editingVariable]);
useEffect(() => {
dispatch(getRoles(orgId));
dispatch(getVariables(orgId));
}, [dispatch, orgId]);
const showAddForm = useCallback(() => {
setFormType(CommonFormTypes.Add);
setFormVisible(true);
}, []);
const hideForm = useCallback(() => {
setFormVisible(false);
}, []);
const showEditForm = useCallback(
id => () => {
setFormType(CommonFormTypes.Edit);
setEditingVariable(variables.find(v => v.id === id));
setFormVisible(true);
},
[variables],
);
const showSubjectForm = useCallback(
id => () => {
const variable = variables.find(v => v.id === id)!;
setEditingVariable(variable);
setSubjectFormVisible(true);
},
[variables],
);
const hideSubjectForm = useCallback(() => {
setSubjectFormVisible(false);
}, []);
const afterFormClose = useCallback(() => {
setEditingVariable(void 0);
}, []);
const save = useCallback(
(values: VariableFormModel) => {
let defaultValue: any = values.defaultValue;
if (values.valueType === VariableValueTypes.Date && !values.expression) {
defaultValue = values.defaultValue.map(d =>
(d as Moment).format(TIME_FORMATTER),
);
}
try {
if (defaultValue !== void 0 && defaultValue !== null) {
defaultValue = JSON.stringify(defaultValue);
}
} catch (error) {
errorHandle(error);
throw error;
}
if (formType === CommonFormTypes.Add) {
dispatch(
actions.changeCurrentEditingView({
variables: variables.concat({
...values,
id: uuidv4(),
defaultValue,
relVariableSubjects: [],
}),
}),
);
} else {
dispatch(
actions.changeCurrentEditingView({
variables: variables.map(v =>
v.id === editingVariable!.id
? { ...editingVariable!, ...values, defaultValue }
: v,
),
}),
);
}
setFormVisible(false);
},
[dispatch, actions, formType, editingVariable, variables],
);
const del = useCallback(
id => () => {
dispatch(
actions.changeCurrentEditingView({
variables: variables.filter(v => v.id !== id),
}),
);
},
[dispatch, actions, variables],
);
const saveRelations = useCallback(
(changedRowPermissions: RowPermission[]) => {
try {
const changedRowPermissionsRaw = changedRowPermissions.map(cr => ({
...cr,
value: JSON.stringify(
cr.value &&
(editingVariable?.valueType === VariableValueTypes.Date
? cr.value.map(d => (d as Moment).format(TIME_FORMATTER))
: cr.value),
),
}));
if (
!comparePermissionChange(
editingVariable?.relVariableSubjects || [],
changedRowPermissionsRaw,
(oe, ce) =>
oe.useDefaultValue === ce.useDefaultValue &&
oe.value === ce.value,
)
) {
dispatch(
actions.changeCurrentEditingView({
variables: variables.map(v =>
v.id === editingVariable?.id
? {
...editingVariable,
relVariableSubjects: changedRowPermissionsRaw,
}
: v,
),
}),
);
}
setSubjectFormVisible(false);
} catch (error) {
errorHandle(error);
throw error;
}
},
[dispatch, actions, editingVariable, variables],
);
const renderTitleText = useCallback(
item => {
const isPrivate = !!item.relVariableSubjects;
const isDuplicate = isPrivate
? publicVariables.some(v => v.name === item.name)
: variables.some(v => v.name === item.name);
return (
<ListItemTitle className={classnames({ duplicate: isDuplicate })}>
{!isPrivate && <span className="prefix">{t('prefix')}</span>}
{item.name}
{isDuplicate && <span className="suffix">{t('suffix')}</span>}
</ListItemTitle>
);
},
[variables, publicVariables, t],
);
const titleProps = useMemo(
() => ({
title: 'variable',
search: true,
add: {
items: [{ key: 'variable', text: t('add') }],
callback: showAddForm,
},
}),
[showAddForm, t],
);
return (
<Container {...titleProps}>
<ListWrapper>
<List
dataSource={listSource}
loading={
stage === ViewViewModelStages.Loading && {
indicator: <LoadingOutlined />,
}
}
renderItem={item => {
let actions: ReactElement[] = [];
if ((item as VariableHierarchy).relVariableSubjects) {
actions = [
<Button
key="edit"
type="link"
className="btn-hover"
icon={<EditOutlined />}
onClick={showEditForm(item.id)}
/>,
<Popconfirm
key="del"
title={tg('operation.deleteConfirm')}
placement="bottom"
onConfirm={del(item.id)}
>
<Button
type="link"
className="btn-hover"
icon={<DeleteOutlined />}
/>
</Popconfirm>,
];
if (item.type === VariableTypes.Permission) {
actions.unshift(
<Button
key="rel"
type="link"
icon={<TeamOutlined />}
className="btn-hover"
onClick={showSubjectForm(item.id)}
/>,
);
}
}
return (
<ListItem actions={actions}>
<List.Item.Meta
avatar={
item.type === VariableTypes.Query ? (
<SearchOutlined className="query" />
) : (
<SafetyCertificateOutlined className="permission" />
)
}
title={renderTitleText(item)}
/>
</ListItem>
);
}}
/>
</ListWrapper>
<VariableForm
scope={VariableScopes.Private}
orgId={orgId}
editingVariable={editingVariable}
variables={variables}
visible={formVisible}
title={t('formTitle')}
type={formType}
onSave={save}
onCancel={hideForm}
afterClose={afterFormClose}
keyboard={false}
maskClosable={false}
/>
<SubjectForm
scope={VariableScopes.Private}
editingVariable={editingVariable}
visible={subjectFormVisible}
rowPermissions={rowPermissions}
onSave={saveRelations}
onCancel={hideSubjectForm}
afterClose={afterFormClose}
keyboard={false}
maskClosable={false}
/>
</Container>
);
})
Example #4
Source File: index.tsx From anew-server with MIT License | 4 votes |
RoleList: React.FC = () => {
const [createVisible, setCreateVisible] = useState<boolean>(false);
const [updateVisible, setUpdateVisible] = useState<boolean>(false);
const [permsVisible, setPermsVisible] = useState<boolean>(false);
const actionRef = useRef<ActionType>();
const [formValues, setFormValues] = useState<API.RoleList>();
const access = useAccess();
const handleDelete = (record: API.Ids) => {
if (!record) return;
if (Array.isArray(record.ids) && !record.ids.length) return;
const content = `您是否要删除这${Array.isArray(record.ids) ? record.ids.length : ''}项?`;
Modal.confirm({
title: '注意',
content,
onOk: () => {
deleteRole(record).then((res) => {
if (res.code === 200 && res.status === true) {
message.success(res.message);
if (actionRef.current) {
actionRef.current.reload();
}
}
});
},
onCancel() { },
});
};
const columns: ProColumns<API.RoleList>[] = [
{
title: '名称',
dataIndex: 'name',
},
{
title: '关键字',
dataIndex: 'keyword',
search: false,
},
{
title: '说明',
dataIndex: 'desc',
},
{
title: '创建人',
dataIndex: 'creator',
},
{
title: '操作',
dataIndex: 'option',
valueType: 'option',
render: (_, record) => (
<>
<Access accessible={access.hasPerms(['admin', 'role:update:perms'])}>
<Tooltip title="设置权限">
<SafetyCertificateOutlined
style={{ fontSize: '17px', color: 'blue' }}
onClick={() => {
if (record.keyword != 'admin') {
setFormValues(record);
setPermsVisible(true);
} else {
message.info("管理员拥有所有权限");
}
}}
/>
</Tooltip>
</Access>
<Divider type="vertical" />
<Access accessible={access.hasPerms(['admin', 'role:update'])}>
<Tooltip title="修改">
<FormOutlined
style={{ fontSize: '17px', color: '#52c41a' }}
onClick={() => {
setFormValues(record);
setUpdateVisible(true);
}}
/>
</Tooltip>
</Access>
<Divider type="vertical" />
<Access accessible={access.hasPerms(['admin', 'role:delete'])}>
<Tooltip title="删除">
<DeleteOutlined
style={{ fontSize: '17px', color: 'red' }}
onClick={() => handleDelete({ ids: [record.id] })}
/>
</Tooltip>
</Access>
</>
),
},
];
return (
<PageHeaderWrapper>
{/* 权限控制显示内容 */}
{access.hasPerms(['admin', 'role:list']) && <ProTable
actionRef={actionRef}
rowKey="id"
toolBarRender={(action, { selectedRows }) => [
<Access accessible={access.hasPerms(['admin', 'role:create'])}>
<Button key="1" type="primary" onClick={() => setCreateVisible(true)}>
<PlusOutlined /> 新建
</Button>
</Access>,
selectedRows && selectedRows.length > 0 && (
<Access accessible={access.hasPerms(['admin', 'role:delete'])}>
<Button
key="2"
type="primary"
onClick={() => handleDelete({ ids: selectedRows.map((item) => item.id) })}
danger
>
<DeleteOutlined /> 删除
</Button>
</Access>
),
]}
tableAlertRender={({ selectedRowKeys, selectedRows }) => (
<div>
已选择{' '}
<a
style={{
fontWeight: 600,
}}
>
{selectedRowKeys.length}
</a>{' '}
项
</div>
)}
request={async (params) => queryRoles({ params }).then((res) => res.data)}
columns={columns}
rowSelection={{}}
/>}
{createVisible && (
<CreateForm
actionRef={actionRef}
handleChange={setCreateVisible}
modalVisible={createVisible}
/>
)}
{updateVisible && (
<UpdateForm
actionRef={actionRef}
handleChange={setUpdateVisible}
modalVisible={updateVisible}
values={formValues}
/>
)}
{permsVisible && (
<PermsForm
actionRef={actionRef}
handleChange={setPermsVisible}
modalVisible={permsVisible}
values={formValues}
/>
)}
</PageHeaderWrapper>
);
}