feat:修改角色

src/views/system/role/index.vue

@@ -2,7 +2,7 @@
   <PageWrapper dense fixedHeight contentFullHeight>
     <BasicTable @register="registerTable">
       <template #toolbar>
-        <a-button type="primary"  @click="handleConfig">
+        <a-button type="primary" @click="handleConfig">
           {{ t('菜单配置') }}
         </a-button>
         <a-button type="primary" v-auth="'role:add'" @click="handleCreate">
@@ -71,8 +71,8 @@
     <menusConfigModal @register="configRef" />
   </PageWrapper>
 </template>
-<script lang="ts">
-  import { defineComponent, h, ref } from 'vue';
+<script lang="ts" setup>
+  import { h, ref } from 'vue';
 
   import { BasicTable, useTable, TableAction, FormSchema, BasicColumn } from '/@/components/Table';
   import {
@@ -95,7 +95,7 @@
   import { useI18n } from '/@/hooks/web/useI18n';
   import MenusConfigModal from '/@/views/system/role/components/menusConfigModal.vue';
   const { t } = useI18n();
-  export const columns: BasicColumn[] = [
+  const columns: BasicColumn[] = [
     {
       title: t('角色名称'),
       dataIndex: 'name',
@@ -148,7 +148,7 @@
     },
   ];
 
-  export const searchFormSchema: FormSchema[] = [
+  const searchFormSchema: FormSchema[] = [
     {
       field: 'name',
       label: t('角色名称'),
@@ -175,209 +175,169 @@
     },
   ];
 
-  export default defineComponent({
-    name: 'RoleManagement',
-    components: {
-      MenusConfigModal,
-      BasicTable,
-      RoleModal,
-      TableAction,
-      RoleAuthModal,
-      AuthModal,
-      SelectDepartment,
-      SelectInterfaceModal,
-      PageWrapper,
+  const { notification } = useMessage();
+  const visible = ref<boolean>(false);
+  const selectedUserId = ref<string[]>([]);
+  const [registerRoleAuthModal, { openModal: openRoleUserModal }] = useModal();
+  const [registerInterfaceModal, { openModal: openInterfaceModal }] = useModal();
+  const [registerModal, { openModal, setModalProps }] = useModal();
+  const [registerRoleModal, { openModal: openRoleModal }] = useModal();
+  const [configRef, { openModal: openConfigModal }] = useModal();
+  const [registerTable, { reload, getSelectRows }] = useTable({
+    title: t('角色列表'),
+    api: getRolePageList,
+    columns,
+    formConfig: {
+      rowProps: {
+        gutter: 16,
+      },
+      schemas: searchFormSchema,
+      actionColOptions: { span: 16 },
     },
-    setup() {
-      const { notification } = useMessage();
-      const visible = ref<boolean>(false);
-      const selectedUserId = ref<string[]>([]);
-      const [registerRoleAuthModal, { openModal: openRoleUserModal }] = useModal();
-      const [registerInterfaceModal, { openModal: openInterfaceModal }] = useModal();
-      const [registerModal, { openModal, setModalProps }] = useModal();
-      const [registerRoleModal, { openModal: openRoleModal }] = useModal();
-      const [configRef, { openModal: openConfigModal }] = useModal();
-      const [registerTable, { reload, getSelectRows }] = useTable({
-        title: t('角色列表'),
-        api: getRolePageList,
-        columns,
-        formConfig: {
-          rowProps: {
-            gutter: 16,
-          },
-          schemas: searchFormSchema,
-          actionColOptions: { span: 16 },
-        },
-        // clickToRowSelect:true,
-        rowSelection: {
-          type: 'radio',
-        },
-        useSearchForm: true,
-        showTableSetting: true,
-        striped: false,
-        showIndexColumn: false,
-        actionColumn: {
-          width: 80,
-          title: t('操作'),
-          dataIndex: 'action',
-          slots: { customRender: 'action' },
-          fixed: undefined,
-        },
-      });
+    // clickToRowSelect:true,
+    rowSelection: {
+      type: 'radio',
+    },
+    useSearchForm: true,
+    showTableSetting: true,
+    striped: false,
+    showIndexColumn: false,
+    actionColumn: {
+      width: 80,
+      title: t('操作'),
+      dataIndex: 'action',
+      slots: { customRender: 'action' },
+      fixed: undefined,
+    },
+  });
 
-      function handleConfig() {
-        let res = warning(true);
-        if (!res) {
-          return;
-        }
-        openConfigModal(true, { id: res.id });
-      }
-      function handleCreate() {
-        openRoleModal(true, {
-          isUpdate: false,
-        });
-      }
-      function handleInterfaceAuth() {
-        let res = warning(true);
-        if (!res) {
-          return;
-        }
-        openInterfaceModal(true, {
-          isUpdate: false,
-          title: t('接口授权') + ' - ' + res.name,
-          id: res.id,
-        });
-      }
-      function handleAuth() {
-        let res = warning(true);
-        if (!res) {
-          return;
-        }
+  function handleConfig() {
+    let res = warning(true);
+    if (!res) {
+      return;
+    }
+    openConfigModal(true, { id: res.id });
+  }
+  function handleCreate() {
+    openRoleModal(true, {
+      isUpdate: false,
+    });
+  }
+  function handleInterfaceAuth() {
+    let res = warning(true);
+    if (!res) {
+      return;
+    }
+    openInterfaceModal(true, {
+      isUpdate: false,
+      title: t('接口授权') + ' - ' + res.name,
+      id: res.id,
+    });
+  }
+  function handleAuth() {
+    let res = warning(true);
+    if (!res) {
+      return;
+    }
 
-        openRoleUserModal(true, {
-          id: res.id,
-        });
-      }
+    openRoleUserModal(true, {
+      id: res.id,
+    });
+  }
 
-      function handleAddUser() {
-        let rows = warning();
-        if (!rows) {
-          return;
-        }
-        getRoleUser(rows.id).then((res) => {
-          selectedUserId.value = res.map((item) => {
-            return item.id;
-          });
-          console.log(selectedUserId.value);
-          visible.value = true;
-        });
-      }
-      function warning(isAdminCantUse = false) {
-        const selectRows = getSelectRows();
-        if (selectRows.length === 0) {
-          notification.warning({
-            message: t('警告'),
-            description: t('必须选中一行！'),
-          }); //提示消息
-          return false;
-        } else if (isAdminCantUse && selectRows[0].id === '1') {
-          notification.warning({
-            message: t('警告'),
-            description: t('超级管理员不允许授权'),
-          });
-          return false;
-        } else {
-          return selectRows[0];
-        }
-      }
-      function handleSelectUserSuccess(rows, type) {
-        const selectRows = getSelectRows();
-        let paramas;
-        if (type === 0) {
-          paramas = { type, id: selectRows[0].id, userIds: rows };
-        } else {
-          paramas = { type, id: selectRows[0].id, departmentIds: rows };
-        }
+  function handleAddUser() {
+    let rows = warning();
+    if (!rows) {
+      return;
+    }
+    getRoleUser(rows.id).then((res) => {
+      selectedUserId.value = res.map((item) => {
+        return item.id;
+      });
+      console.log(selectedUserId.value);
+      visible.value = true;
+    });
+  }
+  function warning(isAdminCantUse = false) {
+    const selectRows = getSelectRows();
+    if (selectRows.length === 0) {
+      notification.warning({
+        message: t('警告'),
+        description: t('必须选中一行！'),
+      }); //提示消息
+      return false;
+    } else if (isAdminCantUse && selectRows[0].id === '1') {
+      notification.warning({
+        message: t('警告'),
+        description: t('超级管理员不允许授权'),
+      });
+      return false;
+    } else {
+      return selectRows[0];
+    }
+  }
+  function handleSelectUserSuccess(rows, type) {
+    const selectRows = getSelectRows();
+    let paramas;
+    if (type === 0) {
+      paramas = { type, id: selectRows[0].id, userIds: rows };
+    } else {
+      paramas = { type, id: selectRows[0].id, departmentIds: rows };
+    }
 
-        addRoleUser(paramas).then((_) => {
-          notification.info({
-            message: t('添加人员'),
-            description: t('成功'),
-          }); //提示消息
-        });
-      }
-      function handleInterfaceSuccess(rows) {
-        const selectRows = getSelectRows();
+    addRoleUser(paramas).then((_) => {
+      notification.info({
+        message: t('添加人员'),
+        description: t('成功'),
+      }); //提示消息
+    });
+  }
+  function handleInterfaceSuccess(rows) {
+    const selectRows = getSelectRows();
 
-        addRoleInterface(selectRows[0].id, rows).then((_) => {
-          notification.info({
-            message: t('接口授权成功'),
-            description: t('成功'),
-          }); //提示消息
-        });
-      }
-      function handleViewUser() {
-        let rows = warning();
-        if (!rows) {
-          return;
-        }
-        getRoleUser(rows.id).then((res) => {
-          openModal(true, res);
-          setModalProps({ title: t('查看成员') });
-        });
-      }
-      function handleRoleAuthSuccess() {}
+    addRoleInterface(selectRows[0].id, rows).then((_) => {
+      notification.info({
+        message: t('接口授权成功'),
+        description: t('成功'),
+      }); //提示消息
+    });
+  }
+  function handleViewUser() {
+    let rows = warning();
+    if (!rows) {
+      return;
+    }
+    getRoleUser(rows.id).then((res) => {
+      openModal(true, res);
+      setModalProps({ title: t('查看成员') });
+    });
+  }
+  function handleRoleAuthSuccess() {}
 
-      function handleEdit(record: Recordable) {
-        openRoleModal(true, {
-          record,
-          isUpdate: true,
-        });
-      }
+  function handleEdit(record: Recordable) {
+    openRoleModal(true, {
+      record,
+      isUpdate: true,
+    });
+  }
 
-      function handleDelete(record: Recordable) {
-        deleteRole([record.id]).then((_) => {
-          reload();
-          notification.success({
-            message: t('删除角色'),
-            description: t('成功'),
-          }); //提示消息
-        });
-      }
+  function handleDelete(record: Recordable) {
+    deleteRole([record.id]).then((_) => {
+      reload();
+      notification.success({
+        message: t('删除角色'),
+        description: t('成功'),
+      }); //提示消息
+    });
+  }
 
-      function handleSuccess() {
-        reload();
-      }
-      function handleHomeAuth() {
-        let res = warning();
-        if (!res) {
-          return;
-        }
-      }
-      return {
-        registerTable,
-        registerRoleModal,
-        handleCreate,
-        handleEdit,
-        handleDelete,
-        handleSuccess,
-        handleAuth,
-        handleAddUser,
-        handleViewUser,
-        handleSelectUserSuccess,
-        handleInterfaceSuccess,
-        registerRoleAuthModal,
-        handleRoleAuthSuccess,
-        registerModal,
-        visible,
-        selectedUserId,
-        registerInterfaceModal,
-        handleInterfaceAuth,
-        handleHomeAuth,
-        t,
-        handleConfig,
-        configRef,
-      };
-    },
-  });
+  function handleSuccess() {
+    reload();
+  }
+  function handleHomeAuth() {
+    let res = warning();
+    if (!res) {
+      return;
+    }
+  }
 </script>