Merge branch '20151115-zxj' of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-portal into 20251117-new-employee

src/components/CustomErrorMessage.vue

@@ -0,0 +1,112 @@
+<template>
+  <transition name="fade">
+    <div v-if="visible" class="custom-info-message" @click="handleClose">
+      <div class="message-content">
+        <div class="icon-wrapper">
+          <span class="icon-text">X</span>
+        </div>
+        <div class="message-text">{{ message }}</div>
+      </div>
+    </div>
+  </transition>
+</template>
+
+<script>
+export default {
+  name: "CustomErrorMessage",
+  data() {
+    return {
+      visible: false,
+      message: "",
+      timer: null,
+    };
+  },
+  methods: {
+    show(msg, duration = 3000) {
+      this.message = msg;
+      this.visible = true;
+
+      if (this.timer) {
+        clearTimeout(this.timer);
+      }
+
+      this.timer = setTimeout(() => {
+        this.hide();
+      }, duration);
+    },
+    hide() {
+      this.visible = false;
+      if (this.timer) {
+        clearTimeout(this.timer);
+        this.timer = null;
+      }
+    },
+    handleClose() {
+      this.hide();
+    },
+  },
+  beforeDestroy() {
+    if (this.timer) {
+      clearTimeout(this.timer);
+    }
+  },
+};
+</script>
+
+<style scoped>
+.custom-info-message {
+  position: fixed;
+  top: 20%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  z-index: 3000;
+  cursor: pointer;
+}
+
+.message-content {
+  display: flex;
+  align-items: center;
+  background: rgba(255, 241, 240, 1);
+  border-radius: 8px;
+  padding: 8px 16px;
+  border: 1px solid rgba(255, 204, 199, 1);
+}
+
+.icon-wrapper {
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+  background: rgba(230, 31, 31, 1);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-right: 12px;
+  flex-shrink: 0;
+}
+
+.icon-wrapper .icon-text {
+  color: #fff;
+  font-size: 12px;
+  font-weight: 400;
+  font-style: normal;
+  line-height: 1;
+}
+
+.message-text {
+  color: rgba(0, 0, 0, 0.88);
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 1.5;
+  flex: 1;
+}
+
+.fade-enter-active,
+.fade-leave-active {
+  transition: opacity 0.3s;
+}
+
+.fade-enter,
+.fade-leave-to {
+  opacity: 0;
+}
+</style>

src/components/NewEmployeeGuideDialog.vue

@@ -18,18 +18,10 @@
           class="footer-btn"
           type="primary"
           :loading="processing"
-          @click="handleConfirmClick"
-          v-if="showBtn"
-        >
-          立即学习
-        </el-button>
-        <el-button
-          v-if="showBtn"
-          class="footer-btn"
-          type="text"
           @click="handleCancelClick"
+          v-if="showBtn"
         >
-          取消
+          关闭
         </el-button>
       </div>
     </div>

src/components/PortalHeader.vue

@@ -422,7 +422,7 @@ export default {
         // 从后端获取用户信息和报名状态
         const res = await getWelcomeData();
         if (res.status === 200 && res.data) {
-          if (res.data?.approvalResults != 1) {
+          if (res.data?.approvalResults && res.data?.approvalResults != 1) {
             this.$router.push("/new-employee/study");
             return;
           }

src/layout/components/TopNav/Index.vue

@@ -426,7 +426,7 @@ export default {
         // 从后端获取用户信息和报名状态
         const res = await getWelcomeData();
         if (res.status === 200 && res.data) {
-          if (res.data?.approvalResults != 1) {
+          if (res.data?.approvalResults && res.data?.approvalResults != 1) {
             this.$router.push("/new-employee/study");
             return;
           }

src/views/new-employee/StudyPage.vue

@@ -218,7 +218,7 @@
     <NewEmployeeGuideDialog
       :visible.sync="guideDialogVisible"
       @close="guideDialogVisible = false"
-      :showBtn="false"
+      :showBtn="true"
     />
     <!-- 转正流程图弹窗 -->
     <el-dialog
@@ -234,6 +234,7 @@
     </el-dialog>
     <!-- 自定义信息提示 -->
     <CustomInfoMessage ref="customMessage" />
+    <CustomErrorMessage ref="errorMessage" />
   </div>
 </template>
 
@@ -252,6 +253,7 @@ import {
   getSzxygProjectInfo,
   enrollRequest,
 } from "@/api/new-employee/newEmployee";
+import CustomErrorMessage from "@/components/CustomErrorMessage.vue";
 import { start } from "nprogress";
 
 export default {
@@ -262,6 +264,7 @@ export default {
     portalFloatTools,
     NewEmployeeGuideDialog,
     CustomInfoMessage,
+    CustomErrorMessage,
   },
   data() {
     return {
@@ -402,25 +405,27 @@ export default {
       }
     },
     async returnEnroll() {
-      // this.$router.push("/new-employee/welcome");
-      const res = await enrollRequest();
-      if (res.data.sendToOaSuccess != 0) {
-        this.$refs.customMessage.show(
-          "报名失败请稍后重试，如果再次失败，请联系：XXXX，联系方式：XXXX。"
-        );
-      } else {
-        this.$refs.customMessage.show("您已重新报名成功");
-        this.approvalResults = 2;
-      }
+      this.$confirm("请确认是否重新报名").then(async () => {
+        const res = await enrollRequest();
+        if (res.data.sendToOaSuccess != 0) {
+          this.$refs.errorMessage.show(
+            "报名失败请稍后重试，如果再次失败，请联系：XXXX，联系方式：XXXX。"
+          );
+        } else {
+          this.$refs.customMessage.show("您已重新报名成功");
+          this.approvalResults = 2;
+        }
+      });
     },
   },
   async mounted() {
     const res = await getWelcomeData();
     // 社招新员工项目标识：0否，1是
-    if (res.data.approvalResults == 1) {
+    if (res.data.approvalResults == 1 || !res.data.approvalResults) {
       this.$refs.customMessage.show("未报名或报名失败，请前往报名页面进行报名");
       this.$router.push("/new-employee/welcome");
     }
+    this.guideDialogVisible = this.$route.query?.fromWelcome == 1;
     // 1报名失败、2审核中、3审核通过、4审核失败
     this.approvalResults = res.data.approvalResults;
     await this.initIds();

src/views/new-employee/WelcomePage.vue

@@ -70,7 +70,7 @@
       @close="handleDialogClose"
     /> -->
     <!-- 自定义信息提示 -->
-    <CustomInfoMessage ref="customMessage" />
+    <CustomErrorMessage ref="customMessage" />
   </div>
 </template>
 
@@ -78,11 +78,11 @@
 import { mapGetters } from "vuex";
 import { getWelcomeData, enrollRequest } from "@/api/new-employee/newEmployee";
 import NewEmployeeGuideDialog from "@/components/NewEmployeeGuideDialog.vue";
-import CustomInfoMessage from "@/components/CustomInfoMessage.vue";
+import CustomErrorMessage from "@/components/CustomErrorMessage.vue";
 
 export default {
   name: "WelcomePage",
-  components: { NewEmployeeGuideDialog, CustomInfoMessage },
+  components: { NewEmployeeGuideDialog, CustomErrorMessage },
   data() {
     return {
       userName: "",
@@ -132,6 +132,8 @@ export default {
             this.$refs.customMessage.show(
               "报名失败请稍后重试，如果再次失败，请联系：XXXX，联系方式：XXXX。"
             );
+          } else {
+            this.$router.push("/new-employee/study?fromWelcome=1");
           }
         } catch (error) {
           console.error("报名请求失败:", error);