feat:修改创建关卡多选框样式以及关卡tab

src/assets/scss/common.scss

@@ -210,7 +210,11 @@ display: none;
     overflow-x: scroll;
     display: flex;
     flex-direction: column;
-    
+    height: 100%;
+		.contentMain {
+      flex: 1;
+			overflow-y: scroll;
+		}
    
 	}}
 	//抽屉--------------------------------------------------------

src/views/learningpath/LearningPath.vue

@@ -137,8 +137,22 @@
               @click="chooseImg(item.id)"
               v-for="item in imgData"
               :key="item.key"
+              style="
+                border-radius: 8px;
+                width: 136px;
+                height: 106px;
+                background-size: 100%;
+                background-repeat: no-repeat;
+              "
+              :style="{
+                border:
+                  learnPathBg === item.id
+                    ? '2px solid rgba(78, 166, 255, 1)'
+                    : '2px solid rgba(78, 166, 255, 0)',
+                'background-image': 'url(' + item.source + ')',
+              }"
             >
-              <img class="im" :src="item.source" />
+              <!-- <img class="im" :src="item.source" /> -->
             </div>
           </div>
         </div>
@@ -245,6 +259,7 @@ export default {
           source: require("../../assets/images/leveladd/3.png"),
         },
       ],
+      learnPathBg: null, //选择的路径图背景
       currentPage: 1,
       tableDataTotal: 100,
       pageSize: 10,
@@ -371,6 +386,7 @@ export default {
     };
     const chooseImg = (id) => {
       console.log(id);
+      state.learnPathBg = id;
     };
     const getTableDate = () => {
       let data = state.tableData;

src/views/learningpath/LevelAdd.vue

@@ -48,7 +48,7 @@
             <div class="sametab">
               <div class="Lhead">
                 <a-input
-                  v-model:value="value"
+                  v-model:value="gatename"
                   style="width: 270px; height: 40px; border-radius: 8px"
                   placeholder="关卡名称"
                 />
@@ -268,6 +268,7 @@ export default {
   methods: {},
   setup() {
     const state = reactive({
+      gatename: null, //关卡名称
       projectNameList: [
         {
           id: 1,
@@ -354,7 +355,7 @@ export default {
   },
 };
 </script>
-<style scoped lang="scss">
+<style lang="scss">
 .clearfix:before,
 .clearfix:after {
   content: " ";
@@ -513,6 +514,11 @@ export default {
       margin-top: 10px;
       // margin-left: 10px;
     }
+    .ant-tabs > .ant-tabs-nav,
+    .ant-tabs > div > .ant-tabs-nav {
+      margin-left: 0px !important;
+      padding-left: 32px !important;
+    }
     .cont {
       display: flex;
       .pad {

src/views/learningpath/LevelAddDetail.vue

@@ -247,6 +247,11 @@
               :scroll="{ x: 1500, y: 300 }"
               @expand="expandTable"
               :pagination="false"
+              :row-selection="{
+                columnWidth: '40px',
+                selectedRowKeys: selectedRowKeys,
+                onChange: onSelectChange,
+              }"
             />
             <!-- :pagination= showSizeChanger: true, showQuickJumper: true,
       hideOnSinglePage: true, pageSizeOptions: [], pageSize: pageSize, current:
@@ -374,16 +379,11 @@ export default {
       projectNameList2: [
         {
           id: 1,
-          value: "批量操作",
-          label: "批量操作",
-        },
-        {
-          id: 2,
           value: "删除任务",
           label: "删除任务",
         },
         {
-          id: 3,
+          id: 2,
           value: "移动任务到关卡",
           label: "移动任务到关卡",
         },
@@ -556,6 +556,7 @@ export default {
       tableDataTotal: 100,
       pageSize: 10,
       visible: false,
+      selectedRowKeys: [],
     });
     const selectProjectName = (value, index) => {
       console.log("value", value, index);
@@ -576,18 +577,29 @@ export default {
           dataIndex: "state",
           // width: "30%",
           key: "state",
-          width: 90,
+          width: 40,
-          align: "center",
+          align: "left",
-          className: "h",
+          className: "classify",
           scopedSlots: { customRender: "action" }, //引入的插槽
           customRender: (text) => {
-            console.log(text.record.checked1);
+            // console.log(text.record.checked1);
             return (
               <div class="racona">
+                <div
+                  class="img"
+                  style={{ cursor: "pointer" }}
+                  onClick={() => {
+                    console.log("点击了");
+                  }}
+                ></div>
+                <span> {text.record.lei}</span>
+
+                {/**
 								<div class="img"></div>
-                <a-checkbox class="ch" v-model:checked={text.record.checkedd}>
+                <a-checkbox class="ch" checked={text.record.checkedd}>
                   {text.record.lei}
                 </a-checkbox>
+*/}
               </div>
             );
           },
@@ -610,15 +622,19 @@ export default {
           className: "h",
           scopedSlots: { customRender: "action" }, //引入的插槽
           customRender: (text) => {
-            console.log(text.record.checked1);
+            // console.log(text.record.checked1);
             return (
               <div class="opat">
                 <div class="opacationt clearfix">
                   <a-switch
                     style="margin-left:-50px;margin-top:3px"
-                    v-model:checked={text.record.checked1}
+                    checked={text.record.checked1}
                     size="small"
                     active-color="red"
+                    onClick={() => {
+                      console.log("点击了");
+                      text.record.checked1 = !text.record.checked1;
+                    }}
                   />
                   <div class="showt clearfix">
                     <div
@@ -669,6 +685,11 @@ export default {
       return columns;
     };
 
+    const onSelectChange = (selectedRowKeys) => {
+      console.log("selectedRowKeys changed: ", selectedRowKeys);
+      state.selectedRowKeys = selectedRowKeys;
+    };
+
     return {
       ...toRefs(state),
       selectProjectName,
@@ -677,12 +698,13 @@ export default {
       showDrawer,
       afterVisibleChange,
       drawercolumns,
+      onSelectChange,
     };
   },
 };
 </script>
 
-<style  lang="scss" >
+<style lang="scss">
 .clearfix:after,
 .clearfix:before {
   content: " ";
@@ -1098,6 +1120,21 @@ export default {
           }
         }
         .tableBox {
+          .classify {
+            margin-left: 10px !important;
+            padding-left: 9px !important;
+          }
+          .ant-checkbox-wrapper {
+            align-items: center;
+            margin-top: -2px;
+          }
+          .ant-table-selection-column {
+            padding: 0px !important;
+            padding-left: 68px !important;
+          }
+          .ant-table-thead > tr > th {
+            background-color: rgba(239, 244, 252, 1);
+          }
           // margin: 20px 38px 30px;
           th.h {
             background-color: #eff4fc !important;
@@ -1181,14 +1218,16 @@ export default {
     // background-color: #bfa;
     display: flex;
     align-items: center;
-    justify-content: center;
+    // justify-content: center;
     height: 100%;
     .img {
-      margin-left: -40px;
+      // margin-left: -40px;
-      margin-top: -2px;
+      // margin-top: -2px;
       width: 17px;
       height: 14px;
       background-image: url("../../assets/images/leveladd/z1.png");
+      position: absolute;
+      left: -47px;
     }
     .ch {
       margin-left: 10px;