Merge branch 'master' of ssh://gitlab.dongwu-inc.com:10022/BOE/fe-manage

src/assets/scss/common.scss

@@ -6,36 +6,65 @@ body {
     // overflow-y: auto;
 }
 //隐藏滚动条----------------------------------------------------------------
-div::-webkit-scrollbar {
+// div::-webkit-scrollbar {
-	display: none !important;
+// 	display: none !important;
-	width: 0 !important;
+// 	width: 0 !important;
-	height: 0 !important;
+// 	height: 0 !important;
-}
+// }
-div::-moz-scrollbar {
+// div::-moz-scrollbar {
-	display: none !important;
+// 	display: none !important;
-	width: 0 !important;
+// 	width: 0 !important;
-	height: 0 !important;
+// 	height: 0 !important;
-}
+// }
-div::-o-scrollbar {
+// div::-o-scrollbar {
-	display: none !important;
+// 	display: none !important;
-	width: 0 !important;
+// 	width: 0 !important;
-	height: 0 !important;
+// 	height: 0 !important;
-}
+// }
-body::-webkit-scrollbar {
+// body::-webkit-scrollbar {
-	display: none !important;;
+// 	display: none !important;;
-	width: 0 !important;
+// 	width: 0 !important;
-	height: 0 !important;
+// 	height: 0 !important;
-}
+// }
-body::-moz-scrollbar {
+// body::-moz-scrollbar {
-	display: none !important;
+// 	display: none !important;
-	width: 0 !important;
+// 	width: 0 !important;
-	height: 0 !important;
+// 	height: 0 !important;
-}
+// }
-body::-o-scrollbar {
+// body::-o-scrollbar {
-	display: none !important;
+// 	display: none !important;
-	width: 0 !important;
+// 	width: 0 !important;
-	height: 0 !important;
+// 	height: 0 !important;
-}
+// }
+
+::-webkit-scrollbar {
+	width: 6px; /*对垂直流动条有效*/
+	height: 6px; /*对水平流动条有效*/
+	}
+	
+	/*定义滚动条的轨道颜色、内阴影及圆角*/
+	::-webkit-scrollbar-track{
+	background-color: rgba(239, 244, 252, 1);
+	border-radius: 6px;
+	}
+	
+	
+	/*定义滑块颜色、内阴影及圆角*/
+	::-webkit-scrollbar-thumb{
+	border-radius: 3px;
+	background-color: rgba(78, 166, 255, 1);
+	}
+	
+	/*定义两端按钮的样式*/
+	::-webkit-scrollbar-button {
+	background-color:cyan;
+	display: none;
+	}
+	
+	/*定义右下角汇合处的样式*/
+	::-webkit-scrollbar-corner {
+	background:rgba(239, 244, 252, 1);;
+	}
 //隐藏滚动条----------------------------------------------------------------
 
 //禁止选中----------------------------------------------------------
@@ -210,7 +239,11 @@ display: none;
     overflow-x: scroll;
     display: flex;
     flex-direction: column;
-    
+    height: 100%;
+		.contentMain {
+      flex: 1;
+			overflow-y: scroll;
+		}
    
 	}}
 	//抽屉--------------------------------------------------------

src/components/BreadCrumb.vue

@@ -61,6 +61,7 @@ export default {
             },
             {
               name: "关卡",
+              href: "/leveladd",
             },
             {
               name: "创建关卡",

src/components/OpenPages.vue

@@ -72,7 +72,7 @@ export default {
 <style scoped lang="scss">
 .openPages {
   width: 100%;
-  height: 50px;
+  // height: 50px;
   display: flex;
   background-color: rgba(255, 255, 255, 1);
   box-shadow: 0px 8px 8px 0px rgba(118, 136, 166, 0.1);

src/views/courselibrary/CoursewareManage.vue

@@ -139,14 +139,16 @@
               >⃰</span
             >
             <span style="margin-right: 14px">授课形式</span>
-            <div class="bc_boxl">
+              <a-radio-group v-model:value="onftvalue">
-              <div class="ol_checkbox"><div class="checkbtn"></div></div>
+                <div class="bc_box">
-              <span style="margin: auto 31px auto 5px">线上</span>
+                  <div class="bc_boxl" @click="bs_unhShow">
-            </div>
+                    <div class="ol_checkbox"><a-radio v-model:checked="checked" :value="1">线上</a-radio></div>
-            <div class="bc_boxr" @click="bs_hShow">
+                  </div>
-              <div class="ol_checkbox"><div class="checkbtn"></div></div>
+                  <div class="bc_boxr" @click="bs_hShow">
-              <span style="margin: auto 31px auto 5px">面授</span>
+                    <div class="ol_checkbox"><a-radio v-model:checked="checked" :value="2">面授</a-radio></div>
-            </div>
+                  </div>
+                </div>
+              </a-radio-group>
           </div>
           <div class="b_sup" :style="{ display: bs_hs ? 'block' : 'none' }">
             <div class="bs_box">
@@ -154,14 +156,12 @@
                 >⃰</span
               >
               <span style="margin-right: 14px">是否设置目录</span>
-              <div class="ol_checkbox">
+              <a-radio-group v-model:value="value">
-                <div class="checkbtn"></div>
+                <div class="bc_box">
-              </div>
+                  <div class="ol_checkbox"><a-radio v-model:checked="checked" :value="1">是</a-radio></div>
-              <span style="margin: auto 45px auto 5px">是</span>
+                  <div class="ol_checkbox"><a-radio v-model:checked="checked" :value="2">否</a-radio></div>
-              <div class="ol_checkbox">
+                </div>
-                <div class="checkbtn"></div>
+              </a-radio-group>
-              </div>
-              <span style="margin: auto 0px auto 5px">否</span>
             </div>
           </div>
           <div class="b_footer">
@@ -624,7 +624,7 @@
                 >
                   <template #bodyCell="{ column }">
                     <template v-if="column.key === 'opacation'">
-                      <a @click="ckxq_hs">取消授权</a>
+                      <a>取消授权</a>
                     </template>
                   </template>
                 </a-table>
@@ -901,13 +901,31 @@
               </div>
               <div class="stmm_i6">
                 <a-table
-                  :columns="columns5"
+                  :columns="columns6"
-                  :data-source="tableData"
+                  :data-source="tableData7"
                   :loading="tableDataTotal === -1 ? true : false"
                   :scroll="{ x: 800 }"
                   expandRowByClick="true"
                   @expand="expandTable"
-                  :pagination="false"
+                  :pagination="{
+                    showSizeChanger: true,
+                    showQuickJumper: true,
+                    hideOnSinglePage: true,
+                    pageSizeOptions: [],
+                    pageSize: pageSize,
+                    current: currentPage,
+                    total: tableDataTotal,
+                    onChange: (page, pageSize) => {
+                      currentPage = page;
+                      // console.log('page', page)
+                      // 加翻页查找代码
+                      // 	this.setState({
+                      // 		currentPage: page,
+                      // 	}, () => {
+                      // 		this.getMilitaryDeployment()
+                      // 	})
+                    },
+                  }"
                 />
               </div>
             </div>
@@ -1177,6 +1195,82 @@ const columns5 = [
         align: "center",
         },
 ];
+const columns6 = [
+        {
+        title: '序号',
+        width: 200,
+        dataIndex: 'num',
+        key: 'num',
+        align: "center",
+      }, {
+        title: '姓名',
+        width: 200,
+        dataIndex: 'name',
+        key: 'name',
+      }, {
+        title: '工号',
+        width: 200,
+        dataIndex: 'number',
+        key: '1',
+        align: "center",
+      }, {
+        title: '部门',
+        width: 200,
+        dataIndex: 'department',
+        key: '2',
+        align: "center",
+      }, {
+        title: ' 岗位',
+        width: 300,
+        dataIndex: 'postion',
+        key: '3',
+        align: "center",
+      }, {
+        title: 'Band',
+        width: 200,
+        dataIndex: 'band',
+        key: '4',
+        align: "center",
+      }, {
+        title: '报名状态',
+        width: 200,
+        dataIndex: 'status',
+        key: '5',
+        align: "center",
+      }, {
+        title: '加入方式',
+        width: 200,
+        dataIndex: 'join',
+        key: '6',
+        align: "center",
+      }, {
+        title: '签到状态',
+        width: 200,
+        dataIndex: 'signstatus',
+        key: '7',
+        align: "center",
+      }, {
+        title: '评估状态',
+        width: 200,
+        dataIndex: 'evastatus',
+        key: '8',
+        align: "center",
+      }, {
+        title: '结业状态',
+        width: 280,
+        dataIndex: 'overstatus',
+        key: '9',
+        align: "center",
+      },{
+        title: '操作',
+        width: 400,
+        className: "h",
+        dataIndex: "operation",
+        key: 'operation',
+        fixed: 'right',
+        align: "center",
+        },
+];
 export default defineComponent({
   components: {
     LoadingOutlined,
@@ -1363,9 +1457,6 @@ export default defineComponent({
           authority: "管理权",
         },
       ],
-      currentPage: 1,
-      tableDataTotal: 50,
-      pageSize: 5,
       tableData6: [
         {
           key: 1,
@@ -1408,6 +1499,86 @@ export default defineComponent({
           createtime: "2022-07-14 14:00:00",
         },
       ],
+      tableData7: [
+        {
+          key: "1",
+          num: 1,
+          name: "李梦",
+          number: "1000",
+          department: "显示事业",
+          postion: "产品经理",
+          band: "Band9",
+          status: "待审核",
+          join: "手动加入",
+          signstatus: "-",
+          evastatus: "-",
+          overstatus: "-",
+          operation: "2022-07-20 9:30",
+        },
+        {
+          key: "2",
+          num: 2,
+          name: "李梦",
+          number: "1001",
+          department: "智慧医工",
+          postion: "产品经理",
+          band: "Band10",
+          status: "已通过",
+          join: "手动加入",
+          signstatus: "已签到",
+          evastatus: "已评估",
+          overstatus: "-",
+          operation: "2022-07-20 9:30",
+        },
+        {
+          key: "3",
+          num: 3,
+          name: "李梦",
+          number: "1002",
+          department: "业务支援",
+          postion: "产品经理",
+          band: "Band10",
+          status: "已拒绝",
+          join: "手动加入",
+          signstatus: "-",
+          evastatus: "-",
+          overstatus: "-",
+          operation: "2022-07-20 9:30",
+        },
+        {
+          key: "4",
+          num: 4,
+          name: "李梦",
+          number: "1003",
+          department: "业务支援",
+          postion: "产品经理",
+          band: "Band9",
+          status: "已通过",
+          join: "报名加入",
+          signstatus: "已签到",
+          evastatus: "-",
+          overstatus: "90/已结业",
+          operation: "2022-07-20 9:30",
+        },
+        {
+          key: "5",
+          num: 5,
+          name: "李梦",
+          number: "1004",
+          department: "业务支援",
+          postion: "产品经理",
+          band: "Band9",
+          status: "已通过",
+          join: "报名加入",
+          signstatus: "请假",
+          evastatus: "-",
+          overstatus: "",
+          operation: "2022-07-20 9:30",
+        },
+      ],
+      currentPage: 1,
+      tableDataTotal: 100,
+      pageSize: 10,
     });
     // const tableDataFunc = () => {
     //   const columns = [
@@ -1577,43 +1748,268 @@ export default defineComponent({
 
     const getTableDate = () => {
       let data = state.tableData;
-      // data.map((value) => {
+      data.map((value) => {
-      //   value.operation = (
+        {
-      //     // value.courseform === '面授' ? 
+          //单层项目
-      //         <div class="op_box">
+          value.operation = (
-      //           <div class="operation">
+            <div class="operation">
-      //             <span class={value.courseform === '面授' ? "activecls" : "errorCls"} style={{ "margin-left": "25px" }} >开课</span>
+              <div class="nSelect">
-      //             <span class={value.ynuse === '停用' ? "activecls" : "errorCls"} style={{ "margin-left": "25px" }} >停用</span>
+                {value.status === "已审核" ? (
-      //             <span class={value.status === '未提交' || value.status === '审核未通过' ? "activecls" : "errorCls"} style={{ "margin-left": "25px" }} >编辑</span>
+                  <div class="nselect">
-      //             <span onClick={() => {}} class={value.status === '已审核' ? "activecls" : "errorCls"} style={{ "margin-left": "25px" }} >管理</span>
+                    
-      //             <span class={value.status === '待审核' ?  "errorCls" : "activecls"} style={{ "margin-left": "25px" }} >复制</span>
+                    <div class='ops1'>
-      //             <span style={{ "margin-left": "25px" }} class="more">
+                      <div class="jc">开课</div>
-      //               <span>授权</span>
+                    </div>
-      //               <div class="moreArrow"></div>
+
-      //               <div class="moreItems">
+                    <div class='ops2'>    
-      //                 <span style="color:#4EA6FF;">权限名单</span>
+                      <div class="jc">管理</div>
-      //                 <div class="mitems1">归属权</div>
+                    </div>
-      //                 <div class="mitems2">管理权</div>
+
-      //                 <div class="mitems3">查看权</div>
+                    <div class='ops3'>                   
-      //               </div>
+                      <div class="jc">复制</div>
-      //             </span>
+                    </div>
-      //             <span
+
-      //               style={{ "margin-left": "21px", "margin-right": "30px" }}
+                    <div class="tableSelect">
-      //               class="more"
+                      <div class='ops4'> 
-      //             >
+                        <a-select
-      //               <span>更多</span>
+                          style="width: 50px;margin-top:2px;margin-left:25px"
-      //               <div class="moreArrow"></div>
+                          value="授权"
-      //               <div class="moreItems"></div>
+                          // options={state.projectNameList}
-      //             </span>
+                          dropdownClassName="tabledropdown"
-      //           </div>
+                        >
-      //         </div>
+                          <a-select-option value="权限名单" label="权限名单">
-      //     );
+                            <div>权限名单</div>
-      // });
+                          </a-select-option>
+                          <a-select-option value="归属权" label="归属权">
+                            <div
+                              onClick={() => {
+                                console.log("点击了");
+                              }}
+                            >
+                              归属权
+                            </div>
+                          </a-select-option>
+                          <a-select-option value="查看权" label="查看权">
+                            <div>查看权</div>
+                          </a-select-option>
+                          <a-select-option value="管理权" label="管理权">
+                            <div>管理权</div>
+                          </a-select-option>
+                        </a-select>
+                      </div>
+                    </div>
+                    <div class="tableSelect">
+                      <div class='ops5'> 
+                        <a-select
+                          style="width: 50px;margin-top:2px;margin-left:25px"
+                          value="更多"
+                          // options={state.projectNameList}
+                          dropdownClassName="tabledropdown"
+                        >
+                          <a-select-option
+                            value="复制"
+                            label="复制"
+                            style="padding-left:35px"
+                          >
+                            <div>复制</div>
+                          </a-select-option>
+                          <a-select-option
+                            value="取消"
+                            label="取消"
+                            style="padding-left:35px"
+                          >
+                            <div
+                              onClick={() => {
+                                console.log("点击了");
+                              }}
+                            >
+                              取消
+                            </div>
+                          </a-select-option>
+                        </a-select>
+                      </div>
+                    </div>
+                  </div>
+                ) : (
+                  <div></div>
+                )}
+                {value.status === "待审核" ? (
+                  <div class="nselect">
+
+                    <div class='ops1'>
+                      <div class="jc">开课</div>
+                    </div>
+
+                    <div class='ops5'> 
+                      <div class="jc">撤回</div>
+                    </div>
+
+                    <div class="tableSelect">
+                      <div class='ops4'> 
+                        <a-select
+                          style="width: 50px;margin-top:2px;margin-left:25px"
+                          value="授权"
+                          // options={state.projectNameList}
+                          dropdownClassName="tabledropdown"
+                        >
+                          <a-select-option value="权限名单" label="权限名单">
+                            <div>权限名单</div>
+                          </a-select-option>
+                          <a-select-option value="归属权" label="归属权">
+                            <div
+                              onClick={() => {
+                                console.log("点击了");
+                              }}
+                            >
+                              归属权
+                            </div>
+                          </a-select-option>
+                          <a-select-option value="查看权" label="查看权">
+                            <div>查看权</div>
+                          </a-select-option>
+                          <a-select-option value="管理权" label="管理权">
+                            <div>管理权</div>
+                          </a-select-option>
+                        </a-select>
+                      </div>
+                    </div>
+                  </div>
+                ) : (
+                  <div></div>
+                )}
+                {value.status === "未提交" ? (
+                  <div class="nselect">
+
+                    <div class='ops1'>
+                      <div class="jc">开课</div>
+                    </div>
+
+                    <div class='ops2'>
+                      <div class="jc">编辑</div>
+                    </div>
+
+                    <div class='ops3'>                   
+                      <div class="jc">复制</div>
+                    </div>
+                  </div>
+                ) : (
+                  <div></div>
+                )}
+                {value.status === "审核未通过" ? (
+                  <div class="nselect">
+                    <div class='ops1'>
+                      <div class="jc">开课</div>
+                    </div>
+
+                    <div class='ops2'>
+                      <div class="jc">编辑</div>
+                    </div>
+
+                    <div class='ops3'>                   
+                      <div class="jc">复制</div>
+                    </div>
+
+
+                    <div class="tableSelect">
+                      <div class='ops4'>  
+                        <a-select
+                          style="width: 50px;margin-top:2px;margin-left:25px"
+                          value="授权"
+                          // options={state.projectNameList}
+                          dropdownClassName="tabledropdown"
+                        >
+                          <a-select-option value="权限名单" label="权限名单">
+                            <div>权限名单</div>
+                          </a-select-option>
+                          <a-select-option value="归属权" label="归属权">
+                            <div
+                              onClick={() => {
+                                console.log("点击了");
+                              }}
+                            >
+                              归属权
+                            </div>
+                          </a-select-option>
+                          <a-select-option value="查看权" label="查看权">
+                            <div>查看权</div>
+                          </a-select-option>
+                          <a-select-option value="管理权" label="管理权">
+                            <div>管理权</div>
+                          </a-select-option>
+                        </a-select>
+                      </div>
+                    </div>
+
+                    <div class='ops5'>      
+                      <div class="jc">删除</div>
+                    </div>
+                  </div>
+                ) : (
+                  <div></div>
+                )}
+              </div>
+            </div>
+          );
+        }
+      });
       state.tableData = data;
     };
     getTableDate();
 
+    const getTableDate2 = () => {
+      let data2 = state.tableData7;
+      data2.map((value) => {
+        {
+          //单层项目
+          value.operation = (
+            <div class="operation">
+              <div class="nSelect">
+                {value.status === "待审核" ? (
+                  <div class="nselect">
+                    <div class='ops1'>
+                      <div class="jc">通过</div>
+                    </div>
+                    <div class='ops1'>
+                      <div class="jc">拒绝</div>
+                    </div>
+                    <div class='ops2'>    
+                      <div class="jc">删除</div>
+                    </div>
+                  </div>
+                ) : (
+                  <div></div>
+                )}
+                {value.status === "已通过" ? (
+                  <div class="nselect">
+                    <div class='ops2'>
+                      <div class="jc">删除</div>
+                    </div>
+                  </div>
+                ) : (
+                  <div></div>
+                )}
+                {value.status === "已拒绝" ? (
+                  <div class="nselect">
+                    <div class='ops2'>
+                      <div class="jc">删除</div>
+                    </div>
+                  </div>
+                ) : (
+                  <div></div>
+                )}
+              </div>
+            </div>
+          );
+        }
+      });
+      state.tableData2 = data2;
+    };
+    getTableDate2();
+
+    const onftvalue = ref();
+
     return {
+      onftvalue,
       current,
       ...toRefs(state),
       fileList,
@@ -1624,10 +2020,12 @@ export default defineComponent({
       columns3,
       columns4,
       columns5,
+      columns6,
       // tableDataFunc,
       handleChange,
       beforeUpload,
       getTableDate,
+      getTableDate2,
     };
   },
 
@@ -1679,13 +2077,13 @@ export default defineComponent({
       hideshow: true,
       bs_hs: true,
       ft_hs:false,
-      om_1: true,
+      om_1: false,
-      ftm_1:true,
+      ftm_1:false,
       om_ckxq: false,
-      gpm_hs:true,
+      gpm_hs:false,
-      stm_hs: true,
+      stm_hs: false,
       cstm_hs:false,
-      sm_hs:true,
+      sm_hs:false,
     });
 
     const of_hShow = () => {
@@ -1704,14 +2102,13 @@ export default defineComponent({
       }
     };
     const bs_hShow = () => {
-      if (state.bs_hs == true) {
-        state.bs_hs = false;
-      } else {
         state.bs_hs = true;
-      }
+    };
+    const bs_unhShow = () => {
+        state.bs_hs = false;
     };
     const createft = () => {
-      if (state.bs_hs == false) {
+      if (state.bs_hs == true) {
         state.of_hs = false;
         state.ft_hs = true;
       }
@@ -1757,6 +2154,7 @@ export default defineComponent({
       of_exit,
       hideShow,
       bs_hShow,
+      bs_unhShow,
       createft,
       ft_exit,
       om_exit,
@@ -1958,21 +2356,11 @@ export default defineComponent({
             background-size: 100% 100%;
           }
         }
-        .checkbtn {
-          width: 7.8px;
-          height: 7.8px;
-          border: 1px solid #4ea6ff;
-          background-color: #4ea6ff;
-          border-radius: 50%;
-        }
         .ol_checkbox {
-          width: 14px;
-          height: 14px;
-          border: 1px solid #000000;
-          border-radius: 50%;
           display: flex;
           align-items: center;
           justify-content: center;
+          margin-left:6px;
         }
         .b_header {
           display: flex;
@@ -1996,10 +2384,13 @@ export default defineComponent({
           display: flex;
           align-items: center;
           margin: 21px auto 14px 80px;
-          .bc_boxl,
+          .bc_box{
-          .bc_boxr {
             display: flex;
-            align-items: center;
+            .bc_boxl,
+            .bc_boxr {
+              display: flex;
+              align-items: center;
+            }
           }
         }
         .b_sup {
@@ -2007,6 +2398,9 @@ export default defineComponent({
           .bs_box {
             display: flex;
             align-items: center;
+            .bc_box{
+              display: flex;
+            }
           }
         }
         .b_footer {
@@ -2094,8 +2488,8 @@ export default defineComponent({
       }
       .m_body {
         display: flex;
-      height: 500px;
+        height: 500px;
-      overflow: auto;
+        overflow: auto;
         .mb_left {
           .mbl_items1 {
             display: flex;
@@ -2189,7 +2583,7 @@ export default defineComponent({
               .accessory_icon {
                 width: 15px;
                 height: 15px;
-                background-color: #4ea6ff;
+                background-image: url(@/assets/images/coursewareManage/enclosure.png);
                 margin-right: 6px;
               }
             }
@@ -2201,52 +2595,28 @@ export default defineComponent({
 
   .tableBox {
     margin: 20px 38px 30px;
-    .op_box {
+    .operation {
       display: flex;
       justify-content: right;
-      .opacation {
+      .nSelect {
-        font-size: 14px;
+        display: flex;
-        font-weight: 400;
+        .nselect {
-        color: #4ea6ff;
+          display: flex;
-        // line-height: 36px;
+          color: #4ea6ff;
-        .activecls {
+          font-size: 14px;
-          display: inline-block;
+          .ops1,.ops2,.ops3,.ops4,.ops5{
-        }
+            margin-left: 20px;
-        .errorCls {
-          display: none;
-        }
-        .more {
-          position: relative;
-          .moreArrow {
-            width: 13px;
-            height: 7px;
-            display: inline-block;
-            background-image: url("@/assets/images/navtop/down.png");
-            background-size: 100%;
-            margin: 2px;
-            margin-left: 7px;
-          }
-          .moreItems {
-            width: 80px;
-            // height: 70px;
-            display: none;
-            background: #ffffff;
-            box-shadow: 2px 3px 9px 3px rgba(0, 0, 0, 0.05);
-            border-radius: 3px;
-            border: 0px solid #dcdcdc;
-            align-items: center;
-            position: absolute;
-            left: 0px;
-            top: 18px;
-            z-index: 9999 !important;
           }
+          // .jc {
+          //   margin-left: 20px;
+          // }
         }
-        .more:hover .moreArrow {
+      }
-          background-image: url("@/assets/images/navtop/up.png");
+      .tableSelect {
-        }
+        margin-left: -30px;
-        .more:hover .moreItems {
+        display: flex;
-          display: block;
+        align-items: center;
-        }
+        justify-content: right;
       }
     }
   }
@@ -3066,6 +3436,15 @@ export default defineComponent({
           }
           .stmm_i6{
             margin-top:20px;
+            .operation,.nselect{
+              display: flex;
+              justify-content: center;
+              color: #4EA6FF;
+              font-size: 14px;
+              .ops1,.ops2{
+                margin-right: 10px;
+              }
+            }
           }
         }
       }

src/views/learningpath/LearningPath.vue

@@ -71,13 +71,11 @@
         :data-source="tableData"
         :loading="tableDataTotal === -1 ? true : false"
         expandRowByClick="true"
-        :scroll="{ x: 1600, y: 800 }"
+        :scroll="{ x: 1600 }"
         @expand="expandTable"
         :pagination="false"
       />
-      <!-- :pagination= showSizeChanger: true, showQuickJumper: true,
+
-      hideOnSinglePage: true, pageSizeOptions: [], pageSize: pageSize, current:
-      currentPage, total: tableDataTotal, -->
       <div class="pa">
         <a-pagination
           showSizeChanger="true"
@@ -137,8 +135,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>
@@ -230,6 +242,76 @@ export default {
           cretime: "2022-07-20 14:00:03",
           haspub: true,
         },
+        {
+          key: 4,
+          number: 4,
+          manager: "ui成长之路",
+          state: "草稿",
+          creater: "管理员",
+          pubtime: "2022-07-20 14:00:03",
+          cretime: "2022-07-20 14:00:03",
+          haspub: true,
+        },
+        {
+          key: 4,
+          number: 4,
+          manager: "ui成长之路",
+          state: "草稿",
+          creater: "管理员",
+          pubtime: "2022-07-20 14:00:03",
+          cretime: "2022-07-20 14:00:03",
+          haspub: true,
+        },
+        {
+          key: 4,
+          number: 4,
+          manager: "ui成长之路",
+          state: "草稿",
+          creater: "管理员",
+          pubtime: "2022-07-20 14:00:03",
+          cretime: "2022-07-20 14:00:03",
+          haspub: true,
+        },
+        {
+          key: 4,
+          number: 4,
+          manager: "ui成长之路",
+          state: "草稿",
+          creater: "管理员",
+          pubtime: "2022-07-20 14:00:03",
+          cretime: "2022-07-20 14:00:03",
+          haspub: true,
+        },
+        {
+          key: 4,
+          number: 4,
+          manager: "ui成长之路",
+          state: "草稿",
+          creater: "管理员",
+          pubtime: "2022-07-20 14:00:03",
+          cretime: "2022-07-20 14:00:03",
+          haspub: true,
+        },
+        {
+          key: 4,
+          number: 4,
+          manager: "ui成长之路",
+          state: "草稿",
+          creater: "管理员",
+          pubtime: "2022-07-20 14:00:03",
+          cretime: "2022-07-20 14:00:03",
+          haspub: true,
+        },
+        {
+          key: 4,
+          number: 4,
+          manager: "ui成长之路",
+          state: "草稿",
+          creater: "管理员",
+          pubtime: "2022-07-20 14:00:03",
+          cretime: "2022-07-20 14:00:03",
+          haspub: true,
+        },
       ],
       imgData: [
         {
@@ -245,6 +327,7 @@ export default {
           source: require("../../assets/images/leveladd/3.png"),
         },
       ],
+      learnPathBg: null, //选择的路径图背景
       currentPage: 1,
       tableDataTotal: 100,
       pageSize: 10,
@@ -371,6 +454,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"></div>
+                <div
-                <a-checkbox class="ch" v-model:checked={text.record.checkedd}>
+                  class="img"
+                  style={{ cursor: "pointer" }}
+                  onClick={() => {
+                    console.log("点击了");
+                  }}
+                ></div>
+                <span> {text.record.lei}</span>
+
+                {/**
+								<div class="img"></div>
+                <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: " ";
@@ -771,6 +793,8 @@ export default {
   height: 100%;
   background-color: #f1f4f8;
   display: flex;
+  // min-width: 1200px;
+  overflow-x: hidden;
   .left {
     margin-right: 20px;
     width: 208px;
@@ -1011,16 +1035,17 @@ export default {
 
     .mid {
       width: 100%;
-      height: 130px;
+      // height: 130px;
       margin-top: 20px;
       margin-bottom: 20px;
       background-color: #fff;
       box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.07);
       display: flex;
       align-items: center;
+      flex-wrap: wrap;
       .item {
-        height: 100%;
+        height: 115px;
-        width: 7.7%;
+        // width: 7.7%;
         display: flex;
         align-items: center;
         .itcon {
@@ -1030,6 +1055,8 @@ export default {
           justify-content: center;
           height: 100%;
           width: 100%;
+          margin-left: 46px;
+          margin-right: 46px;
           .img {
             cursor: pointer;
           }
@@ -1098,6 +1125,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 +1223,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;