暂存修改穿梭框

public/index.html

@@ -117,6 +117,18 @@
     }
 
     /* 组织机构数选择组件样式修改 end */
+
+    /* 项目管理 - 选择单位组件样式 start */
+    .tree-transfer .ant-transfer-list-body-customize-wrapper {
+      overflow-y: auto !important;
+      height: 500px !important;
+    }
+
+    .tree-transfer .ant-transfer-list-content {
+      height: 500px !important;
+    }
+
+    /* 项目管理 - 选择单位组件样式 end */
   </style>
   <!-- require cdn assets css -->
   <% for (var i in htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.css) { %>

src/config/router.config.js

@@ -94,7 +94,7 @@ export const asyncRouterMap = [
             path: '/project/unitSelect',
             name: 'unitSelect',
             component: () => import('@/views/project/ProjectUnitSelect'),
-            meta: { title: '部门选择', keepAlive: true, permission: ['form'] }
+            meta: { title: '选择单位', keepAlive: true, permission: ['form'] }
           },
           {
             path: '/form/step-form',

src/views/project/ProjectList.vue

@@ -129,13 +129,13 @@ export default {
         },
         { title: '创建人员', key: 'createBy', dataIndex: 'createBy' },
         { title: '创建时间', key: 'createDate', dataIndex: 'createDate' },
-        // {
+        {
-        //   title: '操作',
+          title: '操作',
-        //   width: 200,
+          width: 200,
-        //   key: 'status',
+          key: 'status',
-        //   align: 'center',
+          align: 'center',
-        //   scopedSlots: { customRender: 'action' },
+          scopedSlots: { customRender: 'action' },
-        // },
+        },
       ],
 
       // 加载数据方法 必须为 Promise 对象

src/views/project/ProjectUnitSelect.vue

@@ -1,23 +1,24 @@
 <template>
-  <div>
+  <page-header-wrapper title="请选择单位">
+    <!-- showSearch -->
+    <!-- height: '500px',overflowY: 'auto' -->
     <a-transfer
       class="tree-transfer"
-      :data-source="treeData"
+      :data-source="dataSource"
-      :list-style="{
-        height: '600px',
-      }"
       :titles="['全部单位列表', '已经选中单位']"
       :target-keys="targetKeys"
       :render="(item) => item.title"
-      :show-select-all="false"
+      :operations="['选  中', '取  消']"
+      :show-select-all="true"
+      :filter-option="filterOption"
       @change="onChange"
     >
       <template slot="children" slot-scope="{ props: { direction, selectedKeys }, on: { itemSelect } }">
+        <!--  checkStrictly -->
         <a-tree
           v-if="direction === 'left'"
           blockNode
           checkable
-          checkStrictly
           defaultExpandAll
           :checkedKeys="[...selectedKeys, ...targetKeys]"
           :treeData="treeData"
@@ -34,20 +35,43 @@
         />
       </template>
     </a-transfer>
-  </div>
+  </page-header-wrapper>
 </template>
+
+
 <script>
 const treeData = [
-  { id: '0-0', title: '0-0' },
   {
-    id: '0-1',
+    title: '三峡大学',
-    title: '0-1',
+    key: '0001',
     children: [
-      { id: '0-1-0', title: '0-1-0' },
+      { title: '三峡大学文学院', key: '00010001' },
-      { id: '0-1-1', title: '0-1-1' },
+      {
+        title: '三峡大学水利学院',
+        key: '00010002',
+        children: [
+          { title: '三峡大学水利学院第一学院', key: '000100020001' },
+          { title: '三峡大学水利学院第二学院', key: '000100020002' },
+          { title: '三峡大学水利学院第三学院', key: '000100020003' },
+          { title: '三峡大学水利学院第四学院', key: '000100020004' },
+          { title: '三峡大学水利学院第五学院', key: '000100020005' },
+          { title: '三峡大学水利学院第六学院', key: '000100020006' },
+          { title: '三峡大学水利学院第一学院', key: '000100020007' },
+          { title: '三峡大学水利学院第二学院', key: '000100020008' },
+          { title: '三峡大学水利学院第三学院', key: '000100020009' },
+          { title: '三峡大学水利学院第四学院', key: '000100020010' },
+          { title: '三峡大学水利学院第五学院', key: '000100020011' },
+          { title: '三峡大学水利学院第六学院', key: '000100020012' },
+          { title: '三峡大学水利学院第一学院', key: '000100020013' },
+          { title: '三峡大学水利学院第二学院', key: '000100020014' },
+          { title: '三峡大学水利学院第三学院', key: '000100020015' },
+          { title: '三峡大学水利学院第四学院', key: '000100020016' },
+          { title: '三峡大学水利学院第五学院', key: '000100020017' },
+          { title: '三峡大学水利学院第六学院', key: '000100020018' },
+        ],
+      },
     ],
   },
-  { id: '0-2', title: '0-3' },
 ]
 
 const transferDataSource = []
@@ -64,8 +88,9 @@ function isChecked(selectedKeys, eventKey) {
 }
 
 function handleTreeData(data, targetKeys = []) {
+  console.log("执行了handleTreeData函数：",data,targetKeys)
   data.forEach((item) => {
-    item['disabled'] = targetKeys.includes(item.id)
+    item['disabled'] = targetKeys.includes(item.key)
     if (item.children) {
       handleTreeData(item.children, targetKeys)
     }
@@ -78,6 +103,15 @@ export default {
     return {
       targetKeys: [],
       dataSource: transferDataSource,
+
+      // 加载数据方法 必须为 Promise 对象
+      loadData: (parameter) => {
+        console.log('加载数据方法', parameter)
+        return transferDataSource
+        // return getProjectList(Object.assign(parameter, this.queryParam)).then((res) => {
+        //   return res
+        // })
+      },
     }
   },
   computed: {
@@ -94,15 +128,24 @@ export default {
       const { eventKey } = e.node
       itemSelect(eventKey, !isChecked(checkedKeys, eventKey))
     },
+    //搜索使用
+    filterOption(value, tree) {
+      console.log('filterOption:', value, tree)
+      // getParentKey(value, tree) {
+      if (!value) return
+
+      for (let i = 0; i < tree.length; i++) {
+        const node = tree[i]
+
+        if (node.children) {
+          if (node.children.some((item) => item.title.indexOf(value) > -1)) {
+            this.expandedKeys.push(node.key)
+          }
+
+          this.filterOption(value, node.children)
+        }
+      }
+    },
   },
 }
 </script>
-
-
-<style scoped>
-.tree-transfer .ant-transfer-list:first-child {
-  width: 50%;
-  flex: none;
-  height: 100%;
-}
-</style>