feat:修改创建小组弹窗,随机分组抽屉(差内容)

src/components/drawers/SubsetManage.vue

@@ -0,0 +1,107 @@
+<template>
+  <a-drawer
+    :visible="Svisible"
+    class="drawerStyle"
+    placement="right"
+    width="40%"
+    @after-visible-change="afterVisibleChange"
+  >
+    <div class="drawerMain">
+      <div class="header">
+        <div class="headerTitle">随机分组</div>
+        <img
+          style="width: 29px; height: 29px; cursor: pointer"
+          src="../../assets/images/basicinfo/close.png"
+          @click="closeDrawer"
+        />
+      </div>
+      <div class="main">
+        
+      </div>
+      <div class="btnn">
+        <button class="btn1">取消</button>
+        <button class="btn2">确定</button>
+      </div>
+    </div>
+  </a-drawer>
+</template>
+
+<script>
+export default {
+  name: "SubsetManage",
+  props: {
+    Svisible: {
+      type: Boolean,
+      default: false,
+    },
+  },
+};
+</script>
+
+<style scoped lang="scss" >
+.drawerStyle {
+  .ant-drawer-content-wrapper {
+    // max-width: 1000px;
+    .ant-drawer-header {
+      display: none !important;
+    }
+    .ant-drawer-body {
+      padding: 0;
+    }
+  }
+  .drawerMain {
+    min-width: 600px;
+    margin: 0px 32px 0px 32px;
+    overflow-x: scroll;
+    display: flex;
+    flex-direction: column;
+    .header {
+      height: 73px;
+      border-bottom: 1px solid #e8e8e8;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      // background-color: red;
+      margin-bottom: 20px;
+      .headerTitle {
+        font-size: 18px;
+        font-weight: 600;
+        color: #333333;
+        line-height: 25px;
+        // margin-left: 24px;
+      }
+    }
+
+    .btnn {
+      height: 72px;
+      width: 100%;
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.16);
+      .btn1 {
+        width: 100px;
+        height: 40px;
+        border: 1px solid #4ea6ff;
+        border-radius: 8px;
+        color: #4ea6ff;
+        background-color: #fff;
+        cursor: pointer;
+      }
+      .btn2 {
+        cursor: pointer;
+        width: 100px;
+        height: 40px;
+        background: #4ea6ff;
+        border-radius: 8px;
+        border: 0;
+        margin-left: 15px;
+        color: #fff;
+      }
+    }
+  }
+}
+</style>

src/views/projectcenter/TaskPage.vue

@@ -512,7 +512,7 @@
                               </div>
                               <div class="clear">清空</div>
                             </div>
-                            <div class="tab" style="margin: 20px 32px 0 32px">
+                            <div class="tab" style="margin: 20px 32px 30px 32px">
                               <a-table
                                 style="border: 1px solid #f2f6fe"
                                 :columns="tablecolumns"
@@ -563,7 +563,7 @@
                                         <img src="../../assets/images/courseManage/add0.png"/>
                                         <span class="btn1text">创建小组</span>
                                     </div>
-                                    <div class="btn2">
+                                    <div class="btn2" @click="showSubset">
                                         <img src="../../assets/images/courseManage/reset2.png"/>
                                         <span class="btn2text">随机分组</span>
                                     </div>
@@ -696,6 +696,8 @@
     <time-manage v-model:Tvisible="visible" />
     <!-- 面授管理抽屉 -->
     <face-manage v-model:Fvisible="FaceVisivle" />
+    <!-- 学员（小组管理）创建小组抽屉 -->
+    <subset-manage v-model:Svisible="subsetVisivle" />
 <!-- 概览（无数据）-项目发布弹窗 -->
     <div>
       <a-modal
@@ -817,7 +819,7 @@
           <div class="name">
             <div class="star" style="margin-top: -4px">
               <img
-                style="width: 10px; height: 10px"
+                style="width: 10px; height: 10px;margin-left: 15px"
                 src="../../assets/images/basicinfo/asterisk.png"
               />
             </div>
@@ -844,9 +846,10 @@
 import { reactive, toRefs } from "vue";
 import TimeManage from "../../components/drawers/TimeManage";
 import FaceManage from "../../components/drawers/FaceManage";
+import SubsetManage from "../../components/drawers/SubsetManage";
 export default {
     name:"taskPage",
-    components: { TimeManage, FaceManage },
+    components: { TimeManage, FaceManage, SubsetManage },
     setup(){
         const state = reactive({
             goodstuList: [
@@ -886,7 +889,7 @@ export default {
                 group: "天天向上",
                 progress: "5/20",
                 diploma: "0",
-                stutime: "2022-10-31 23:12:00",
+                stutime: "2022-10-21 23:12:00",
                 putin: "手动加入",
               },
               {
@@ -897,7 +900,7 @@ export default {
                 group: "好好学习",
                 progress: "5/20",
                 diploma: "0",
-                stutime: "2022-10-31 23:12:00",
+                stutime: "2022-10-11 23:12:00",
                 putin: "手动加入",
               },
               {
@@ -968,6 +971,10 @@ export default {
                 width: 50,
                 align: "center",
                 className: "h",
+                sorter: {
+                  compare: (a, b) => a.stutime - b.stutime,
+                  multiple: 3,
+                },
               },
               {
                 title: "加入方式",
@@ -988,6 +995,7 @@ export default {
             ],
             visible: false, //时间管理
             FaceVisivle: false, //面授管理
+            subsetVisivle: false, //随机小组
             pubproject: false,
             stugroup: false,
             checked: false,
@@ -1018,6 +1026,11 @@ export default {
       //面授管理的抽屉
       // console.log("点击管理");
       state.FaceVisivle = true;
+    };
+    const showSubset = () => {
+      //面授管理的抽屉
+      // console.log("点击管理");
+      state.subsetVisivle = true;
     };
         return {
             ...toRefs(state),
@@ -1027,6 +1040,7 @@ export default {
             closeModal2,
             showTime,
       showFace,
+      showSubset,
     };
   },
 };