From 10e4d0dae19bf42f0d14db73861de207ad38c011 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A6=BA=E7=8B=A8?= <18119604035@163.com>
Date: Tue, 4 Apr 2023 11:19:44 +0800
Subject: [PATCH] =?UTF-8?q?=E7=AE=A1=E7=90=86=E4=BA=BA=E5=91=98=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E9=87=8D=E6=9E=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../system/adminroles/compenents/create.tsx   | 42 +++++++++++--------
 .../system/adminroles/compenents/update.tsx   | 41 ++++++++++--------
 2 files changed, 48 insertions(+), 35 deletions(-)

diff --git a/src/pages/system/adminroles/compenents/create.tsx b/src/pages/system/adminroles/compenents/create.tsx
index 7acf767..329407f 100644
--- a/src/pages/system/adminroles/compenents/create.tsx
+++ b/src/pages/system/adminroles/compenents/create.tsx
@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from "react";
-import { Modal, Select, Form, Input, message } from "antd";
+import { Drawer, Select, Space, Button, Form, Input, message } from "antd";
 import styles from "./create.module.less";
 import { adminRole } from "../../../../api/index";
 
@@ -74,37 +74,45 @@ export const SystemAdminrolesCreate: React.FC<PropInterface> = ({
 
   return (
     <>
-      <Modal
+      <Drawer
         title="新建角色"
-        centered
-        forceRender
-        open={open}
-        width={416}
-        onOk={() => form.submit()}
-        onCancel={() => onCancel()}
+        onClose={onCancel}
         maskClosable={false}
+        open={open}
+        footer={
+          <Space className="j-r-flex">
+            <Button onClick={() => onCancel()}>取 消</Button>
+            <Button onClick={() => form.submit()} type="primary">
+              确 认
+            </Button>
+          </Space>
+        }
+        width={634}
       >
         <div className="float-left mt-24">
           <Form
             form={form}
-            name="basic"
-            labelCol={{ span: 8 }}
-            wrapperCol={{ span: 16 }}
+            name="adminroles-create"
+            labelCol={{ span: 5 }}
+            wrapperCol={{ span: 19 }}
             initialValues={{ remember: true }}
             onFinish={onFinish}
             onFinishFailed={onFinishFailed}
             autoComplete="off"
           >
             <Form.Item
-              label="角色名"
+              label="角色名称"
               name="name"
-              rules={[{ required: true, message: "请输入角色名!" }]}
+              rules={[{ required: true, message: "请输入角色名称!" }]}
             >
-              <Input style={{ width: 200 }} placeholder="请输入角色名" />
+              <Input
+                style={{ width: 424 }}
+                placeholder="请在此处输入角色名称"
+              />
             </Form.Item>
             <Form.Item label="操作权限" name="action_ids">
               <Select
-                style={{ width: 200 }}
+                style={{ width: 424 }}
                 mode="multiple"
                 allowClear
                 placeholder="请选择权限"
@@ -113,7 +121,7 @@ export const SystemAdminrolesCreate: React.FC<PropInterface> = ({
             </Form.Item>
             <Form.Item label="数据权限" name="permission_ids">
               <Select
-                style={{ width: 200 }}
+                style={{ width: 424 }}
                 mode="multiple"
                 allowClear
                 placeholder="请选择权限"
@@ -122,7 +130,7 @@ export const SystemAdminrolesCreate: React.FC<PropInterface> = ({
             </Form.Item>
           </Form>
         </div>
-      </Modal>
+      </Drawer>
     </>
   );
 };
diff --git a/src/pages/system/adminroles/compenents/update.tsx b/src/pages/system/adminroles/compenents/update.tsx
index 9486fd6..9a2b17c 100644
--- a/src/pages/system/adminroles/compenents/update.tsx
+++ b/src/pages/system/adminroles/compenents/update.tsx
@@ -1,10 +1,10 @@
 import React, { useState, useEffect } from "react";
-import { Modal, Form, Input, Select, message } from "antd";
+import { Drawer, Select, Space, Button, Form, Input, message } from "antd";
 import styles from "./update.module.less";
 import { adminRole } from "../../../../api/index";
 
 interface PropInterface {
-  id: number;
+  id: any;
   open: boolean;
   onCancel: () => void;
 }
@@ -24,7 +24,7 @@ export const SystemAdminrolesUpdate: React.FC<PropInterface> = ({
   }, []);
 
   useEffect(() => {
-    if (id === 0 || "undefined" || "") {
+    if (id === undefined) {
       return;
     }
     getDetail();
@@ -86,22 +86,27 @@ export const SystemAdminrolesUpdate: React.FC<PropInterface> = ({
 
   return (
     <>
-      <Modal
-        title="编辑角色"
-        centered
-        forceRender
-        open={open}
-        width={416}
-        onOk={() => form.submit()}
-        onCancel={() => onCancel()}
+      <Drawer
+        title="新建角色"
+        onClose={onCancel}
         maskClosable={false}
+        open={open}
+        footer={
+          <Space className="j-r-flex">
+            <Button onClick={() => onCancel()}>取 消</Button>
+            <Button onClick={() => form.submit()} type="primary">
+              确 认
+            </Button>
+          </Space>
+        }
+        width={634}
       >
         <div className="float-left mt-24">
           <Form
             form={form}
-            name="basic"
-            labelCol={{ span: 8 }}
-            wrapperCol={{ span: 16 }}
+            name="adminroles-update"
+            labelCol={{ span: 5 }}
+            wrapperCol={{ span: 19 }}
             initialValues={{ remember: true }}
             onFinish={onFinish}
             onFinishFailed={onFinishFailed}
@@ -112,11 +117,11 @@ export const SystemAdminrolesUpdate: React.FC<PropInterface> = ({
               name="name"
               rules={[{ required: true, message: "请输入角色名!" }]}
             >
-              <Input style={{ width: 200 }} placeholder="请输入角色名" />
+              <Input style={{ width: 424 }} placeholder="请输入角色名" />
             </Form.Item>
             <Form.Item label="操作权限" name="action_ids">
               <Select
-                style={{ width: 200 }}
+                style={{ width: 424 }}
                 mode="multiple"
                 allowClear
                 placeholder="请选择权限"
@@ -125,7 +130,7 @@ export const SystemAdminrolesUpdate: React.FC<PropInterface> = ({
             </Form.Item>
             <Form.Item label="数据权限" name="permission_ids">
               <Select
-                style={{ width: 200 }}
+                style={{ width: 424 }}
                 mode="multiple"
                 allowClear
                 placeholder="请选择权限"
@@ -134,7 +139,7 @@ export const SystemAdminrolesUpdate: React.FC<PropInterface> = ({
             </Form.Item>
           </Form>
         </div>
-      </Modal>
+      </Drawer>
     </>
   );
 };