style：新增提醒 修改考勤按钮 新增签到/签退/请假通知框

src/components/drawers/ActiveAttendance.vue

@@ -76,13 +76,13 @@
           </div>
         </div>
         <div class="btnss" style="margin-top: 20px">
-          <div class="btn btn1" @click="showqdModal">
+          <div class="btn btn2" @click="showqdModal">
             <div class="wz">批量签到</div>
           </div>
           <div class="btn btn2" @click="showqtModal">
             <div class="wz">批量签退</div>
           </div>
-          <div class="btn btn2">
+          <div class="btn btn1">
             <div class="img2"></div>
             <div class="wz">导出数据</div>
           </div>
@@ -205,6 +205,96 @@
       </div>
     </div>
   </a-modal>
+  <!-- 单独签到弹窗 -->
+  <a-modal
+    v-model:visible="singleqdModal"
+    :footer="null"
+    :closable="closeCopy"
+    wrapClassName="CopyModal"
+    centered="true"
+  >
+    <div class="delete">
+      <div class="del_header"></div>
+      <div class="del_main">
+        <div class="header">
+          <div class="icon"></div>
+          <span>提示</span>
+          <div class="close_exit" @click="closesingleqdModal"></div>
+        </div>
+        <div class="body">
+          <span>您确定要签到吗</span>
+        </div>
+        <div class="del_btnbox">
+          <div class="del_btn btn1">
+            <div class="btnText" @click="delete_exit">取消</div>
+          </div>
+          <div class="del_btn btn2">
+            <div class="btnText" @click="delete_exit">确定</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </a-modal>
+  <!-- 单独签退弹窗 -->
+  <a-modal
+    v-model:visible="singleqtModal"
+    :footer="null"
+    :closable="closeCopy"
+    wrapClassName="CopyModal"
+    centered="true"
+  >
+    <div class="delete">
+      <div class="del_header"></div>
+      <div class="del_main">
+        <div class="header">
+          <div class="icon"></div>
+          <span>提示</span>
+          <div class="close_exit" @click="closesingleqtModal"></div>
+        </div>
+        <div class="body">
+          <span>您确定要签退吗</span>
+        </div>
+        <div class="del_btnbox">
+          <div class="del_btn btn1">
+            <div class="btnText" @click="delete_exit">取消</div>
+          </div>
+          <div class="del_btn btn2">
+            <div class="btnText" @click="delete_exit">确定</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </a-modal>
+  <!-- 单独请假弹窗 -->
+  <a-modal
+    v-model:visible="singleqjModal"
+    :footer="null"
+    :closable="closeCopy"
+    wrapClassName="CopyModal"
+    centered="true"
+  >
+    <div class="delete">
+      <div class="del_header"></div>
+      <div class="del_main">
+        <div class="header">
+          <div class="icon"></div>
+          <span>提示</span>
+          <div class="close_exit" @click="closesingleqjModal"></div>
+        </div>
+        <div class="body">
+          <span>您确定要请假吗</span>
+        </div>
+        <div class="del_btnbox">
+          <div class="del_btn btn1">
+            <div class="btnText" @click="delete_exit">取消</div>
+          </div>
+          <div class="del_btn btn2">
+            <div class="btnText" @click="delete_exit">确定</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </a-modal>
 </template>
 
 <script>
@@ -230,6 +320,9 @@ export default {
       selectedRowKeys: [],
       qtModal: false, //批量签退
       qdModal: false, //批量签到
+      singleqjModal: false, //单独请假
+      singleqdModal: false, //单独签到
+      singleqtModal: false, //单独签退
       closeCopy: false,
       projectNameList: [
         {
@@ -424,6 +517,7 @@ export default {
               checked={value.signIn}
               onChange={(e) => {
                 console.log("点击签到", e);
+                showsingleqdModal();
               }}
             >
               签到
@@ -432,6 +526,7 @@ export default {
               checked={value.signOut}
               onChange={(e) => {
                 console.log("点击签退", e);
+                showsingleqtModal();
               }}
             >
               签退
@@ -440,6 +535,7 @@ export default {
               checked={value.leave}
               onChange={(e) => {
                 console.log("点击请假", e);
+                showsingleqjModal();
               }}
             >
               请假
@@ -551,6 +647,24 @@ export default {
     const closeqtModal = () => {
       state.qtModal = false;
     };
+    const showsingleqdModal = () => {
+      state.singleqdModal = true;
+    };
+    const showsingleqtModal = () => {
+      state.singleqtModal = true;
+    };
+    const showsingleqjModal = () => {
+      state.singleqjModal = true;
+    };
+    const closesingleqdModal = () => {
+      state.singleqdModal = false;
+    };
+    const closesingleqtModal = () => {
+      state.singleqtModal = false;
+    };
+    const closesingleqjModal = () => {
+      state.singleqjModal = false;
+    };
     return {
       ...toRefs(state),
       selectProjectName,
@@ -563,6 +677,12 @@ export default {
       showqtModal,
       closeqtModal,
       closeqdModal,
+      showsingleqdModal,
+      showsingleqtModal,
+      showsingleqjModal,
+      closesingleqdModal,
+      closesingleqtModal,
+      closesingleqjModal,
     };
   },
 };
@@ -713,7 +833,7 @@ export default {
               .img2 {
                 width: 17px;
                 height: 16px;
-                background-image: url(../../assets/images/coursewareManage/export.png);
+                background-image: url(../../assets/images/coursewareManage/export1.png);
                 background-size: 100% 100%;
                 margin-right: 7px;
               }

src/components/drawers/FaceManage.vue

@@ -52,7 +52,7 @@
           </div>
         </div>
         <div class="btnss" style="margin-top: 20px">
-          <div class="btn btn1" style="margin-right: 20px">
+          <div class="btn btn1" style="margin-right: 20px" @click="showopen">
             <div class="img1"></div>
             <div class="wz">催促学习</div>
           </div>
@@ -136,6 +136,10 @@
           <button class="btn btn2" @click="check">确定</button>
         </div>
       </a-modal>
+      <div class="noticebox" v-show="open">
+        <div><img src="../../assets/images/taskpage/check.png" /></div>
+        <div class="notext">催促学员成功</div>
+      </div>
     </div>
   </a-drawer>
   <!-- 录入成绩抽屉 -->
@@ -143,7 +147,7 @@
 </template>
 
 <script>
-import { toRefs, reactive } from "vue";
+import { toRefs, reactive, onMounted, onUnmounted } from "vue";
 import EntryScores from "./EntryScores.vue";
 export default {
   name: "FaceManage",
@@ -165,6 +169,7 @@ export default {
       currentPage: 1,
       tableDataTotal: 100,
       showdonemodal: false,
+      open: false,
       selectedRowKeys: [],
       projectNameList: [
         {
@@ -351,7 +356,18 @@ export default {
       // }
       // state.selectedRowKeys = selectedRowKeys;
     };
-
+    const showopen = () => {
+      state.open = true;
+    };
+    let timer;
+    onMounted(() => {
+      timer = setInterval(() => {
+        state.open = false;
+      }, 3000);
+    });
+    onUnmounted(() => {
+      clearInterval(timer);
+    });
     return {
       ...toRefs(state),
       selectProjectName,
@@ -363,6 +379,7 @@ export default {
       showEntryScore,
       showdoneModal,
       closedoneModal,
+      showopen,
     };
   },
 };
@@ -381,6 +398,7 @@ export default {
 //   }
 
 // }
+
 //面授管理弹窗
 .FacMa {
   .ant-modal {
@@ -498,6 +516,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;
@@ -615,7 +650,7 @@ export default {
           .img1 {
             width: 15px;
             height: 17px;
-            background-image: url(../../assets/images/courseManage/search0.png);
+            background-image: url(../../assets/images/basicinfo/call.png);
             background-size: 100% 100%;
             margin-right: 7px;
           }