From 3e5831c095b41d8cea2fd36b96a22f7b4804b466 Mon Sep 17 00:00:00 2001
From: Yjhon <hbzgyjh@126.com>
Date: Thu, 24 Feb 2022 19:49:23 +0800
Subject: [PATCH] =?UTF-8?q?list=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../project/form/ProjectCourseSelect.vue      | 58 +++++++++++--------
 1 file changed, 33 insertions(+), 25 deletions(-)

diff --git a/src/views/project/form/ProjectCourseSelect.vue b/src/views/project/form/ProjectCourseSelect.vue
index 0ffd086..1436704 100644
--- a/src/views/project/form/ProjectCourseSelect.vue
+++ b/src/views/project/form/ProjectCourseSelect.vue
@@ -3,7 +3,7 @@
     <a-card :bordered="false" title="项目课程选择">
       <a-row type="flex" justify="center" align="top">
         <a-col :span="4" id="tree">
-          <a-menu v-model="menuKey" mode="horizontal" @select="menuChack" >
+          <a-menu v-model="menuKey" mode="horizontal" @select="menuChack">
             <a-menu-item key="sys">系统课程</a-menu-item>
             <a-menu-item key="self">自主课程</a-menu-item>
           </a-menu>
@@ -24,20 +24,21 @@
               </a-row>
             </a-form>
             <!-- onChange: onSelectChange, -->
-            <s-table ref="table" :columns="columns" :data="loadData" :rowKey="(record) => record.id" 
-              :rowSelection="{ selectedRowKeys: selectedRowKeys, selectedRows: selectedRows,onChange: onSelectChange,  onSelect: tableOnSelect ,onSelectAll: tableAllSelected }">
+            <s-table ref="table" :columns="columns" :data="loadData" :rowKey="(record) => record.id" :rowSelection="{ selectedRowKeys: selectedRowKeys, selectedRows: selectedRows,onChange: onSelectChange,  onSelect: tableOnSelect ,onSelectAll: tableAllSelected }">
               <span slot="serial" slot-scope="text, record, index">
                 {{ index + 1 }}
               </span>
             </s-table>
           </a-col>
           <a-col :span="6" id="select">
-            <p>点击列表项取消选择或【<a @click="removeAllSelece">清空所有</a>】</p>
-            <a-list size="small" :data-source="selectedRows" :rowKey="(item) => item.id">
-              <a-list-item slot="renderItem" slot-scope="item" @click="changeList({ item })">
-                {{ item.courseName + '（' + item.courseCode + '）' }}
-              </a-list-item>
-            </a-list>
+            <div class="alist" >
+              <p>点击列表项取消选择或【<a @click="removeAllSelece">清空所有</a>】</p>
+              <a-list size="small" :data-source="selectedRows" :rowKey="(item) => item.id">
+                <a-list-item slot="renderItem" slot-scope="item" @click="changeList({ item })">
+                  {{ item.courseName + '（' + item.courseCode + '）' }}
+                </a-list-item>
+              </a-list>
+            </div>
           </a-col>
         </a-col>
       </a-row>
@@ -72,7 +73,7 @@ export default {
       menuKey: ['sys'], //默认系统课程
 
       // 查询参数
-      queryParam: { name: '', classType: 1 ,type: 1},
+      queryParam: { name: '', classType: 1, type: 1 },
       replaceFields: { children: 'children', title: 'name', key: 'value', value: 'id' },
       expandedKeys: [],
       autoExpandParent: true,
@@ -90,7 +91,7 @@ export default {
       loadData: (parameter) => {
         return listByClass(Object.assign(parameter, this.queryParam)).then((res) => {
           return res
-        }) 
+        })
       },
     }
   },
@@ -106,11 +107,11 @@ export default {
   // 方法集合
   methods: {
     //菜单改变，
-    menuChack(){
-      console.log('menuKey',this.menuKey)
+    menuChack() {
+      console.log('menuKey', this.menuKey)
       let type = 2;
-      console.log('菜单改变',this.menuKey[0])
-      if(this.menuKey[0] === 'self') type = 1;
+      console.log('菜单改变', this.menuKey[0])
+      if (this.menuKey[0] === 'self') type = 1;
       this.queryParam.type = type
       this.getCourseTreeData(type);
       this.$refs.table.refresh(true);
@@ -146,21 +147,21 @@ export default {
     },
 
     /** table取消勾选 */
-    tableOnSelect(record, selected, selectedRows, nativeEvent){
-      if(!selected) { //取消勾选操作
+    tableOnSelect(record, selected, selectedRows, nativeEvent) {
+      if (!selected) { //取消勾选操作
         let keys = this.selectedRowKeys.filter(item => item != record.id);
         let rows = this.selectedRows.filter(item => item.id != record.id);
 
         this.selectedRows = rows;
         this.selectedRowKeys = keys;
-      } 
+      }
     },
     /** table取消全选 */
-    tableAllSelected(selected, selectedRows, changeRows){
-      if(!selected){ //取消勾选操作
-        let exKeys = changeRows.map(value => {return value.id})
-        let keys = this.selectedRowKeys.filter(item => {return !exKeys.includes(item)});
-        let rows = this.selectedRows.filter(item => {return !exKeys.includes(item.id)});
+    tableAllSelected(selected, selectedRows, changeRows) {
+      if (!selected) { //取消勾选操作
+        let exKeys = changeRows.map(value => { return value.id })
+        let keys = this.selectedRowKeys.filter(item => { return !exKeys.includes(item) });
+        let rows = this.selectedRows.filter(item => { return !exKeys.includes(item.id) });
 
         this.selectedRows = rows;
         this.selectedRowKeys = keys;
@@ -213,14 +214,14 @@ export default {
     //查询课程列表
     queryCourseList() {
       console.log('this.treeDataOne-------', this.treeDataOne)
-      listByClass({ classType: this.treeDataOne[0] || 0 ,type: this.menuKey[0] === 'sys'?0:1}).then((res) => {
+      listByClass({ classType: this.treeDataOne[0] || 0, type: this.menuKey[0] === 'sys' ? 0 : 1 }).then((res) => {
         this.courseData = res.data
       })
     },
 
     //获取课程分类数据，转换成树结构
     getCourseTreeData(type) {
-      coursewareClassList({type:type}).then((res) => {
+      coursewareClassList({ type: type }).then((res) => {
         //list转🌲
         const list2tree1 = (list, parentId) => {
           return list.filter((item) => {
@@ -260,4 +261,11 @@ export default {
 }
 </script>
 <style scoped>
+.alist {
+  border: 1px solid #e8e8e8;
+  border-radius: 4px;
+  overflow: auto;
+  padding: 8px 24px;
+  height: 500px;
+}
 </style>
\ No newline at end of file