Procházet zdrojové kódy

fix: 数据结构自定义-右侧变更为Tree

lanjianrong před 5 roky
rodič
revize
69b01de1a8

+ 6 - 0
src/pages/Customer/Company/components/ConnectCompany/index.less

@@ -27,3 +27,9 @@
 .modalFooter {
   padding: 1rem;
 }
+
+.removeTreeSwitcher {
+  :global(.ant-tree-switcher) {
+    display: none;
+  }
+}

+ 26 - 22
src/pages/Customer/Company/components/CustomPerm.jsx

@@ -300,28 +300,32 @@ const CustomPerm = ({ onConfirm }) => {
 
             if (direction === 'right') {
               return (
-                <ul
-                  className="ant-transfer-list-content ant-transfer-list-content-show-remove overflow-y-auto"
-                  style={{ height: state.height }}>
-                  {(state.rightTargetId
-                    ? state.targetKeys.filter(item => item === state.rightTargetId)
-                    : state.targetKeys
-                  ).map(item => (
-                    <li className="ant-transfer-list-content-item" key={item}>
-                      <span className="ant-transfer-list-content-item-text">
-                        {state.transferDataSource.find(i => i.key === item)?.title}
-                      </span>
-                      <span
-                        className="text-hex-d9d9d9 hover:text-hex-886ab5 transition-colors duration-300"
-                        onClick={() => {
-                          const currKeys = state.targetKeys.filter(i => i !== item)
-                          handleUnCheckItem(state.treeKeys, item, { targetKeys: currKeys })
-                        }}>
-                        <DeleteOutlined />
-                      </span>
-                    </li>
-                  ))}
-                </ul>
+                <div className={styles.removeTreeSwitcher}>
+                  <Tree
+                    blockNode={true}
+                    height={state.height}
+                    treeData={
+                      state.rightTargetId
+                        ? state.targetKeys.filter(item => item === state.rightTargetId)
+                        : state.targetKeys
+                    }
+                    titleRender={item => (
+                      <li className="ant-transfer-list-content-item" key={item}>
+                        <span className="ant-transfer-list-content-item-text">
+                          {state.transferDataSource.find(i => i.key === item)?.title}
+                        </span>
+                        <span
+                          className="text-hex-d9d9d9 hover:text-hex-886ab5 transition-colors duration-300"
+                          onClick={() => {
+                            const currKeys = state.targetKeys.filter(i => i !== item)
+                            handleUnCheckItem(state.treeKeys, item, { targetKeys: currKeys })
+                          }}>
+                          <DeleteOutlined />
+                        </span>
+                      </li>
+                    )}
+                  />
+                </div>
               )
             }
           }}