Bladeren bron

feat: 数据源设置默认选中第一项+权限设置默认选中第一项调整

outaozhen 3 jaren geleden
bovenliggende
commit
0d0713b7b7

+ 7 - 0
src/pages/Permission/BackRole/components/RoleLeftMenu/index.less

@@ -30,3 +30,10 @@
     }
   }
 }
+.ant-tree-treenode-selected {
+  .department-node {
+    .extra {
+      display: flex;
+    }
+  }
+}

+ 15 - 13
src/pages/Permission/BackRole/components/RoleLeftMenu/index.tsx

@@ -94,19 +94,21 @@ const RoleLeftMenu: React.FC<RoleLeftMenuProps> = ({
             )}
             <div className="extra">
               <FormOutlined className="pr-2" onClick={() => setActiveID(item.key)} />
-              <Popconfirm
-                disabled={!showDelIcon}
-                title="确认删除吗?"
-                onText="确认"
-                cancelText="取消"
-                onConfirm={() => tryDelRoleBg(item.key)}
-                icon={<QuestionCircleOutlined style={{ color: 'red' }} />}>
-                <DeleteOutlined
-                  onClick={() => {
-                    !showDelIcon && message.warning('请先移除该角色下的所有用户')
-                  }}
-                />
-              </Popconfirm>
+              {item.key === defaultActiveRole ? (
+                <Popconfirm
+                  disabled={!showDelIcon}
+                  title="确认删除吗?"
+                  onText="确认"
+                  cancelText="取消"
+                  onConfirm={() => tryDelRoleBg(item.key)}
+                  icon={<QuestionCircleOutlined style={{ color: 'red' }} />}>
+                  <DeleteOutlined
+                    onClick={() => {
+                      !showDelIcon && message.warning('请先移除该角色下的所有用户')
+                    }}
+                  />
+                </Popconfirm>
+              ) : null}
             </div>
           </div>
         )

+ 7 - 1
src/pages/Permission/FrontRole/components/RoleLeftMenu/index.less

@@ -20,7 +20,6 @@
       cursor: pointer;
     }
   }
-
   &:hover {
     .extra {
       display: flex;
@@ -30,3 +29,10 @@
     }
   }
 }
+.ant-tree-treenode-selected {
+  .department-node {
+    .extra {
+      display: flex;
+    }
+  }
+}

+ 3 - 7
src/pages/Permission/FrontRole/components/RoleLeftMenu/index.tsx

@@ -32,7 +32,6 @@ const RoleLeftMenu: React.FC<RoleLeftMenuProps> = ({
 }) => {
   const formRef = useRef<ProFormInstance>(null)
   const [inputFocusID, setInputFocusID] = useState<Nullable<string>>(null)
-  const [activeKey, setActiveKey] = useState([menuRoles[0]?.key])
   const { run: tryAddRole } = useRequest((params: API.CreateRoleParams) => addRoleMenu(params), {
     manual: true,
     onSuccess: () => {
@@ -94,7 +93,7 @@ const RoleLeftMenu: React.FC<RoleLeftMenuProps> = ({
             )}
             <div className="extra">
               <FormOutlined className="pr-2" onClick={() => setInputFocusID(item.key)} />
-              {activeKey === item.key && (
+              {defaultActiveRole === item.key && (
                 <Popconfirm
                   disabled={!showDelIcon}
                   title="确认删除吗?"
@@ -155,11 +154,8 @@ const RoleLeftMenu: React.FC<RoleLeftMenuProps> = ({
           <DirectoryTree
             itemHeight={32}
             height={virtualHeight - 32}
-            selectedKeys={[activeKey]}
-            onSelect={(keys, node) => {
-              setActiveKey(keys[0])
-              onSelect(keys[0], node.node.roleType)
-            }}
+            defaultSelectedKeys={[menuRoles[0]?.key]}
+            onSelect={(keys, node) => onSelect(keys[0], node.node.roleType)}
             showIcon={false}
             treeData={renderTreeNode(menuRoles)}
           />

+ 2 - 2
src/pages/Permission/FrontRole/index.tsx

@@ -59,7 +59,7 @@ const Role = () => {
           }))
       )
 
-      result?.length && onSelect?.(state.currentRoleID ?? result[0]?.ID, result[0]?.roleType)
+      result?.length && onSelect?.(state.currentRoleID ?? result[2]?.ID, result[0]?.roleType)
     }
   })
 
@@ -113,7 +113,7 @@ const Role = () => {
     <PageContainer title={false}>
       <div className="h-full w-full flex flex-row">
         <RoleLeftMenu
-          defaultActiveRole={state.currentRoleID ?? menuRoles[0]?.ID}
+          defaultActiveRole={state.currentRoleID ?? menuRoles[2]?.ID}
           onSelect={onSelect}
           menuRoles={menuRoles}
           showDelIcon={!state.roleStaff.length}

+ 27 - 21
src/pages/Schema/Option/components/LeftMenu/index.tsx

@@ -12,11 +12,12 @@ const { DirectoryTree } = Tree
 
 type LeftMenuProps = {
   onSelect: (key: string) => void
+  defaultActiveID: string
   options: API.DataSourceMenuItem[]
   initFn: () => Promise<void>
 }
 
-const LeftMenu: React.FC<LeftMenuProps> = ({ onSelect, options, showDelIcon, initFn }) => {
+const LeftMenu: React.FC<LeftMenuProps> = ({ onSelect, defaultActiveID, options, showDelIcon, initFn }) => {
   const [activeID, setActiveID] = useState<Nullable<string>>(null)
   const formRef = useRef<ProFormInstance>(null)
   const handleOnSelect: DirectoryTreeProps['onSelect'] = (keys, node) => {
@@ -80,19 +81,21 @@ const LeftMenu: React.FC<LeftMenuProps> = ({ onSelect, options, showDelIcon, ini
             )}
             <div className="extra">
               <FormOutlined className="pr-2" onClick={() => setActiveID(item.ID)} />
-              <Popconfirm
-                disabled={!showDelIcon}
-                title="确认删除吗?"
-                onText="确认"
-                cancelText="取消"
-                onConfirm={() => tryDelRole(item.ID)}
-                icon={<QuestionCircleOutlined style={{ color: 'red' }} />}>
-                <DeleteOutlined
-                  onClick={() => {
-                    !showDelIcon && message.warning('该数据源已绑定子项,不允许删除')
-                  }}
-                />
-              </Popconfirm>
+              {item.ID === defaultActiveID ? (
+                <Popconfirm
+                  disabled={!showDelIcon}
+                  title="确认删除吗?"
+                  onText="确认"
+                  cancelText="取消"
+                  onConfirm={() => tryDelRole(item.ID)}
+                  icon={<QuestionCircleOutlined style={{ color: 'red' }} />}>
+                  <DeleteOutlined
+                    onClick={() => {
+                      !showDelIcon && message.warning('该数据源已绑定子项,不允许删除')
+                    }}
+                  />
+                </Popconfirm>
+              ) : null}
             </div>
           </div>
         )
@@ -141,13 +144,16 @@ const LeftMenu: React.FC<LeftMenuProps> = ({ onSelect, options, showDelIcon, ini
         id="role-list"
         className="p-4 bg-white rounded-b-20px"
         style={{ height: 'calc(100% - 1rem*2 - 20px)' }}>
-        <DirectoryTree
-          treeData={renderTreeNode(options.map(item => ({ title: item.name, key: item.ID, ...item })))}
-          height={virtualHeigh - 32}
-          onSelect={handleOnSelect}
-          showIcon={false}
-          defaultExpandAll
-        />
+        {options.length ? (
+          <DirectoryTree
+            treeData={renderTreeNode(options.map(item => ({ title: item.name, key: item.ID, ...item })))}
+            height={virtualHeigh - 32}
+            defaultSelectedKeys={[options[0]?.ID]}
+            onSelect={handleOnSelect}
+            showIcon={false}
+            defaultExpandAll
+          />
+        ) : null}
       </div>
     </div>
   )

+ 3 - 1
src/pages/Schema/Option/index.tsx

@@ -58,7 +58,8 @@ const Option = () => {
       setState({
         ...state,
         menuData: result,
-        menuDataItems: result.find(i => i.ID === state.activeID)?.items
+        activeID: result[0].ID,
+        menuDataItems: result[0].items
       })
     }
   })
@@ -196,6 +197,7 @@ const Option = () => {
       <div className="h-full w-full flex flex-row">
         <LeftMenu
           onSelect={onSelect}
+          defaultActiveID={state.activeID}
           showDelIcon={!state.menuDataItems?.length}
           options={state.menuData}
           initFn={() => tryFetchList()}