feat:增加换组弹窗

src/components/student/ChangeGroupModal.vue

@@ -0,0 +1,94 @@
+<!--
+ * @Author: lixg lixg@dongwu-inc.com
+ * @Date: 2022-12-20 17:00:37
+ * @LastEditors: lixg lixg@dongwu-inc.com
+ * @LastEditTime: 2023-01-31 15:51:36
+ * @FilePath: /fe-manage/src/components/student/ChangeLevelModal.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <a-modal
+    style="padding: 0"
+    :closable="true"
+    :visible="changegroupV"
+    :footer="null"
+    centered="true"
+    wrapClassName="changeModal"
+  >
+    <div class="con">
+      <div class="header">
+        <div class="inhe">
+          <div class="mod"></div>
+          <div class="tz">换组</div>
+          <div class="mg" @click="closeChangeModal"></div>
+        </div>
+      </div>
+      <div class="mid">
+        <div class="inher">
+          <!-- <div class="cur">当前关卡：关卡2</div> -->
+          <div class="select">
+            <a-select
+              v-model:value="selectStage"
+              style="width: 100%"
+              placeholder="请选择小组"
+              :options="option"
+              allowClear
+            ></a-select>
+          </div>
+          <div class="btn">
+            <button
+              class="sameb btn1"
+              @click="closeChangeModal"
+              style="cursor: pointer"
+            >
+              取消
+            </button>
+            <button
+              class="sameb btn2"
+              @click="changeGroup"
+              style="cursor: pointer"
+            >
+              确定
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  </a-modal>
+</template>
+<script setup>
+import { computed, defineEmits, defineProps, ref } from "vue";
+// import { moveStudent } from "@/api/index1";
+// import { message } from "ant-design-vue";
+
+const props = defineProps({
+  changegroupV: {
+    type: Boolean,
+    default: false,
+  },
+  stage: {
+    type: Array,
+    default: () => [],
+  },
+  ids: {
+    type: Array,
+    default: () => [],
+  },
+});
+
+const option = computed(() => {
+  return props.stage.map((e) => ({ label: e.name, value: e.id }));
+});
+console.log("changegroupV", props.changegroupV);
+const selectStage = ref();
+
+const emit = defineEmits({});
+
+const closeChangeModal = () => {
+  emit("update:changegroupV", false);
+};
+//确认换组
+const changeGroup = (item) => {
+  console.log("换组", item);
+};
+</script>

src/components/student/TableStudent.vue

@@ -216,12 +216,7 @@
           <!--					</div>-->
           <a-space :size="2">
             <slot name="extension" v-bind:data="{ record }"></slot>
-            <a-button
-              v-if="type === 1"
-              @click="updateStatus(0, record.id)"
-              type="link"
-              >换组</a-button
-            >
+
             <a-button
               v-if="type === 3 && record.status !== 0"
               @click="updateStatus(0, record.id)"

src/views/projectcenter/TaskPage.vue

@@ -723,6 +723,9 @@
                     <a-button @click="settingTopFlag(record)" type="link">{{
                       record.topFlag ? "取消优秀" : "优秀学员"
                     }}</a-button>
+                    <a-button type="link" @click="showChangeGroupModal()"
+                      >换组</a-button
+                    >
                   </template>
                 </TableStudent>
               </a-tab-pane>
@@ -2043,6 +2046,10 @@
       type="课程二维码"
     />
     <!-- 二维码弹窗 -->
+
+    <!-- 换组弹窗 -->
+    <ChangeGroupModal v-model:changegroupV="changegroupV" />
+    <!-- 换组弹窗 -->
   </div>
 </template>
 <script>
@@ -2098,6 +2105,7 @@ import TrainClass from "@/components/project/TrainClass";
 import ProjectManager from "@/components/project/ProjectManagerNew";
 import TableStudent from "@/components/student/TableStudent";
 import { getStuPage } from "@/api/index1";
+import ChangeGroupModal from "@/components/student/ChangeGroupModal.vue";
 export default {
   name: "taskPage",
   components: {
@@ -2129,6 +2137,7 @@ export default {
     AddCertificate,
     CreateCertificate,
     ProjectVoteManage,
+    ChangeGroupModal,
   },
   setup() {
     const store = useStore();
@@ -2827,6 +2836,8 @@ export default {
       facestudent: "",
 
       modal1Visible: false, // 证书预览
+
+      changegroupV: false, //换组弹窗
     });
 
     const levelList = reactive({
@@ -3032,6 +3043,12 @@ export default {
       state.canclestu1 = false;
     };
 
+    //显示学员换组弹窗
+    const showChangeGroupModal = () => {
+      state.changegroupV = true;
+      console.log("点击换组", state.changegroupV);
+    };
+
     const showModal2 = (classify, item) => {
       state.stuMemberClassify = classify;
       state.projectGroupId =
@@ -4607,6 +4624,7 @@ export default {
       searchGroup,
       cancelyou,
       cancelcanyou,
+      showChangeGroupModal,
       changePaginationStu,
       handleChange,
       toEdit,