feat:催促学习,催促考试

src/components/drawers/TestManage.vue

@@ -54,7 +54,7 @@
           </div>
         </div>
         <div class="btnss" style="margin-top: 20px">
-          <div class="btn btn1" style="margin-right: 20px; cursor: pointer">
+          <div class="btn btn1" @click="showopen" style="margin-right: 20px; cursor: pointer">
             <div class="img2"></div>
             <div class="wz">催促考试</div>
           </div>
@@ -80,12 +80,17 @@
         <button class="btn1">取消</button>
         <button class="btn2">确定</button>
       </div>
+      <div class="noticebox" v-show="open">
+        <div><img src="../../assets/images/taskpage/check.png"/></div>
+        <div class="notext">催促学员成功</div>
+      </div>
     </div>
   </a-drawer>
+  
 </template>
 
 <script>
-import { toRefs, reactive } from "vue";
+import { toRefs, reactive, onMounted, onUnmounted} from "vue";
 export default {
   name: "TestManage",
   props: {
@@ -102,6 +107,7 @@ export default {
   setup(props, ctx) {
     const state = reactive({
       name: null,
+      open: false,
       projectNameList: [
         {
           id: 1,
@@ -291,11 +297,25 @@ export default {
     const closeDrawer = () => {
       ctx.emit("update:TMvisible", false);
     };
-
+    const showopen=()=>{
+        state.open = true;
+    };
+    let timer;
+    onMounted(()=> {
+      timer = setInterval(()=>{
+        state.open = false;
+      },3000);
+    });
+    onUnmounted(()=>{
+      clearInterval(timer);
+    });
     return {
       ...toRefs(state),
       selectProjectName,
       closeDrawer,
+      showopen,
+      onMounted,
+      onUnmounted,
     };
   },
 };
@@ -324,6 +344,24 @@ export default {
     overflow-x: scroll;
     display: flex;
     flex-direction: column;
+    position: relative;
+    .noticebox {
+      width: 240px;
+      height: 64px;
+      background: rgba(255, 255, 255, 1);
+      border-radius: 4px;
+      position: absolute;
+      top: 161px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      .notext {
+        color: rgba(51, 51, 51, 1);
+        font-size: 14px;
+        font-weight: 500;
+        margin-left: 20px;
+      }
+    }
     .header {
       height: 73px;
       border-bottom: 1px solid #e8e8e8;

src/components/drawers/TimeManage.vue

@@ -54,7 +54,7 @@
           </div>
         </div>
         <div class="btnss" style="margin-top: 20px">
-          <div class="btn btn1" style="margin-right: 20px">
+          <div class="btn btn1" @click="showopen"  style="margin-right: 20px">
             <div class="img1"></div>
             <div class="wz">催促学习</div>
           </div>
@@ -91,12 +91,16 @@
         <button class="btn1">取消</button>
         <button class="btn2">确定</button>
       </div>
+      <div class="noticebox" v-show="open">
+        <div><img src="../../assets/images/taskpage/check.png"/></div>
+        <div class="notext">催促学员成功</div>
+      </div>
     </div>
   </a-drawer>
 </template>
 
 <script>
-import { toRefs, reactive } from "vue";
+import { toRefs, reactive, onMounted, onUnmounted} from "vue";
 export default {
   name: "TimeManage",
   props: {
@@ -113,6 +117,7 @@ export default {
   setup(props, ctx) {
     const state = reactive({
       name: null,
+      open: false,
       pageSize: 10,
       currentPage: 1,
       tableDataTotal: 100,
@@ -269,10 +274,25 @@ export default {
     const closeDrawer = () => {
       ctx.emit("update:Tvisible", false);
     };
+    const showopen=()=>{
+        state.open = true;
+    };
+    let timer;
+    onMounted(()=> {
+      timer = setInterval(()=>{
+        state.open = false;
+      },3000);
+    });
+    onUnmounted(()=>{
+      clearInterval(timer);
+    });
     return {
       ...toRefs(state),
       selectProjectName,
       closeDrawer,
+      showopen,
+      onMounted,
+      onUnmounted,
     };
   },
 };
@@ -297,6 +317,23 @@ export default {
     overflow-x: scroll;
     display: flex;
     flex-direction: column;
+    .noticebox {
+      width: 240px;
+      height: 64px;
+      background: rgba(255, 255, 255, 1);
+      border-radius: 4px;
+      position: absolute;
+      top: 161px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      .notext {
+        color: rgba(51, 51, 51, 1);
+        font-size: 14px;
+        font-weight: 500;
+        margin-left: 20px;
+      }
+    }
     .header {
       height: 73px;
       border-bottom: 1px solid #e8e8e8;