✨ feat: 完善用户没有实名认证和添加儿童时的操作跳转

hookehuyr
Commit 61e6913da24332fa28b1877146b25bf650532473 61e6913d 1 parent 242e05cc
Showing 5 changed files with 116 additions and 30 deletions
src/components/CommentList/index.vue
src/views/client/bookDetail.vue
src/views/client/videoDetailComment.vue
src/views/me/handleUser.vue
src/views/me/verifyUser.vue
--- a/src/components/CommentList/index.vue
View file @61e6913
+++ b/src/components/CommentList/index.vue
View file @61e6913
@@ -26,8 +26,7 @@
           <div class="comment-wrapper">
             <van-row style="font-size: 0.9rem;">
               <van-col span="4">
-                <van-image round width="3rem" height="3rem"
+                <van-image round width="3rem" height="3rem" :src="item.avatar ? item.avatar : icon_avatar" />
-                  :src="item.avatar ? item.avatar : icon_avatar" />
               </van-col>
               <van-col span="14">
                 <p>{{ item.name }}</p>
@@ -53,10 +52,9 @@
   </van-popup>
   <!-- 写评论时，如果没有实名认证提示弹框 -->
-  <notice-overlay :show="showNotice" text="前往认证" @on-submit="onSubmit" @on-close="onClose">
+  <notice-overlay :show="showNotice" :text="noticeText" @on-submit="onSubmit" @on-close="onClose">
     <div style="color: #333333;">
-      <p>您还没有实名认证</p>
+      <div v-html="noticeHtml" />
-      <p>请前往个人中心进行实名认证</p>
     </div>
   </notice-overlay>
 </template>
@@ -102,17 +100,32 @@ const commentType = ref('comment'); // 类型 comment 为评论/类型 reply 为
  * @param {*} v 单行评论数据
  * @param {*} type 类型 comment 为评论/类型 reply 为回复
  */
+const noticeText = ref('')
+const noticeHtml = ref('')
 const commentId = ref('')
 const replayUser = ref('')
 const setComment = (v, type) => { //
-  if (userInfo.value.can_upload) {
+  if (userInfo.value.can_upload === 1) {
     showCommentBoxPopup.value = true;
     commentType.value = type;
     replayUser.value = v.name;
     commentId.value = props.data.id;
-  } else {
+  } else if (userInfo.value.can_upload === -1) { // 未实名认证
+    closeBtn();
+    showNotice.value = true;
+    noticeText.value = '前往认证'
+    noticeHtml.value = `
+      <p>您还没有实名认证</p>
+      <p>请前往个人中心进行实名认证</p>
+    `
+  } else if (userInfo.value.can_upload === -2) { // 没有默认儿童
     closeBtn();
     showNotice.value = true;
+    noticeText.value = '前往新增'
+    noticeHtml.value = `
+      <p>您还没有新增儿童</p>
+      <p>请前往个人中心进行新增</p>
+    `
   }
 }
@@ -168,9 +181,28 @@ const onClose = () => { // 关闭提示框回调
 }
 // 跳转个人中心
 const onSubmit = () => {
+  setTimeout(() => {
+    showNotice.value = false;
+  }, 1000);
+  if (userInfo.value.can_upload === -1) { // 未实名认证
     $router.push({
-    path: '/me/verifyUser'
+      path: '/me/verifyUser',
+      query: {
+        back_url: $route.fullPath
+      }
     });
+  } else if (userInfo.value.can_upload === -2) { // 没有默认儿童
+    $router.push({
+      path: '/me/handleUser',
+      query: {
+        perf_id: '',
+        kg_id: '',
+        kg_name: '',
+        type: 'ADD',
+        back_url: $route.fullPath
+      }
+    });
+  }
 }
 const show = ref(false);
@@ -209,6 +241,8 @@ const onLoad = () => {
         if (!replyList.value.length) {
           finishedTextStatus.value = false;
           emptyStatus.value = true;
+        } else {
+          emptyStatus.value = false;
         }
       } else {
         console.warn(res);
--- a/src/views/client/bookDetail.vue
View file @61e6913
+++ b/src/views/client/bookDetail.vue
View file @61e6913
@@ -2,7 +2,7 @@
  * @Author: hookehuyr hookehuyr@gmail.com
  * @Date: 2022-05-21 09:35:14
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2022-06-09 15:23:36
+ * @LastEditTime: 2022-06-09 16:34:04
  * @FilePath: /tswj/src/views/client/bookDetail.vue
  * @Description:
 -->
@@ -143,7 +143,7 @@ const $route = useRoute();
 const $router = useRouter();
 const { toggleLanguage, onLoad, columns, prod_list, finished, loading, bookInfo, showPicker, checkLocalism, checkMandarin, onConfirm, chooseLanguage, finishedTextStatus, emptyStatus } = useVideoList();
-const { userInfo } = useDefaultPerf($route.query.id);
+let { userInfo } = useDefaultPerf($route.query.id);
 const donateInfo = ref({})
 const userType = Cookies.get('userType')
@@ -205,9 +205,15 @@ const onClose = () => { // 关闭提示框回调
 }
 // 跳转个人中心
 const onSubmit = () => {
+  setTimeout(() => {
+    showNotice.value = false;
+  }, 1000);
   if (userInfo.value.can_upload === -1) { // 未实名认证
     $router.push({
-      path: '/me/verifyUser'
+      path: '/me/verifyUser',
+      query: {
+        back_url: $route.fullPath
+      }
     });
   } else if (userInfo.value.can_upload === -2) { // 没有默认儿童
     $router.push({
@@ -216,7 +222,8 @@ const onSubmit = () => {
         perf_id: '',
         kg_id: '',
         kg_name: '',
-        type: 'ADD'
+        type: 'ADD',
+        back_url: $route.fullPath
       }
     });
   }
@@ -302,6 +309,9 @@ onActivated(() => { // keepAlive 重置后执行回调
   // 更新页面名称，因为不刷新副作用~
   document.title = $route.meta.title;
+  // 更新是否实名认证和儿童信息
+  const data = useDefaultPerf($route.query.id);
+  userInfo = data.userInfo;
 });
 onBeforeRouteLeave(() => {
--- a/src/views/client/videoDetailComment.vue
View file @61e6913
+++ b/src/views/client/videoDetailComment.vue
View file @61e6913
 <template>
   <div class="">
-    <van-list v-model:loading="loading" :finished="finished" :finished-text="finishedTextStatus ? '没有更多了' : ''" @load="onLoad" :immediate-check="false">
+    <van-list v-model:loading="loading" :finished="finished" :finished-text="finishedTextStatus ? '没有更多了' : ''"
+      @load="onLoad" :immediate-check="false">
       <template v-for="(item, key) in commentList" :key="key">
         <div class="comment-wrapper">
           <van-row style="font-size: 0.9rem;">
@@ -26,7 +27,8 @@
             <van-col offset="4" span="20">
               <div v-if="item.total" class="reply-wrapper">
                 <template v-for="(reply, index) in item.reply_list" :key="index">
-                    <p v-if="reply.reply_to"><span>{{ reply.name }}</span>&nbsp;回复&nbsp;<span>@{{ reply.reply_to }}：</span><span class="content">{{ reply.note }}</span></p>
+                  <p v-if="reply.reply_to"><span>{{ reply.name }}</span>&nbsp;回复&nbsp;<span>@{{ reply.reply_to
+                      }}：</span><span class="content">{{ reply.note }}</span></p>
                   <p v-else><span>{{ reply.name }}：</span><span class="content">{{ reply.note }}</span></p>
                 </template>
                 <p @click="getReplyList(item)">共{{ item.total }}条回复 ></p>
@@ -36,25 +38,21 @@
         </div>
       </template>
     </van-list>
-    <van-empty v-if="emptyStatus"
+    <van-empty v-if="emptyStatus" class="custom-image" :image="no_image" description="暂无留言" />
-      class="custom-image"
-      :image="no_image"
-      description="暂无留言"
-    />
     <div style="height: 5rem;"></div>
     <div class="reply-btn" @click="setComment('', 'comment')">
       <div class="text">写下你友善的留言</div>
     </div>
   </div>
-  <comment-list :showPopup="showCommentListPopup" :data="commentData" @on-close="closeCommentList"></comment-list>
+  <comment-list :show-popup="showCommentListPopup" :data="commentData" @on-close="closeCommentList" />
-  <comment-box :showPopup="showCommentBoxPopup" :type="commentType" :replayUser="replayUser" @on-submit="submitCommentBox" @on-close="closeCommentBox"></comment-box>
+  <comment-box :show-popup="showCommentBoxPopup" :type="commentType" :replay-user="replayUser"
+    @on-submit="submitCommentBox" @on-close="closeCommentBox" />
   <!-- 写评论时，如果没有实名认证提示弹框 -->
-  <notice-overlay :show="showNotice" text="前往认证" @on-submit="onSubmit" @on-close="onClose">
+  <notice-overlay :show="showNotice" :text="noticeText" @on-submit="onSubmit" @on-close="onClose">
     <div style="color: #333333;">
-      <p>您还没有实名认证</p>
+      <div v-html="noticeHtml" />
-      <p>请前往个人中心进行实名认证</p>
     </div>
   </notice-overlay>
 </template>
@@ -119,6 +117,8 @@ const onLoad = () => {
       if (!commentList.value.length) {
         finishedTextStatus.value = false;
         emptyStatus.value = true;
+      } else {
+        emptyStatus.value = false;
       }
     } else {
       console.warn(res);
@@ -169,9 +169,28 @@ const onClose = () => { // 关闭提示框回调
 }
 // 跳转个人中心
 const onSubmit = () => {
+  setTimeout(() => {
+    showNotice.value = false;
+  }, 1000);
+  if (userInfo.value.can_upload === -1) { // 未实名认证
     $router.push({
-    path: '/me/verifyUser'
+      path: '/me/verifyUser',
+      query: {
+        back_url: $route.fullPath
+      }
+    });
+  } else if (userInfo.value.can_upload === -2) { // 没有默认儿童
+    $router.push({
+      path: '/me/handleUser',
+      query: {
+        perf_id: '',
+        kg_id: '',
+        kg_name: '',
+        type: 'ADD',
+        back_url: $route.fullPath
+      }
     });
+  }
 }
@@ -185,16 +204,30 @@ const commentType = ref('comment'); // 类型 comment 为评论/类型 reply 为
  * @param {*} v 单行评论数据
  * @param {*} type 类型 comment 为评论/类型 reply 为回复
  */
+const noticeText = ref('')
+const noticeHtml = ref('')
 const commentId = ref('')
 const replayUser = ref('')
 const setComment = (v, type) => {
-  if (userInfo.value.can_upload) {
+  if (userInfo.value.can_upload === 1) {
     showCommentBoxPopup.value = true;
     commentType.value = type;
     replayUser.value = v.name;
     commentId.value = v.id;
-  } else {
+  } else if (userInfo.value.can_upload === -1) { // 未实名认证
     showNotice.value = true;
+    noticeText.value = '前往认证'
+    noticeHtml.value = `
+      <p>您还没有实名认证</p>
+      <p>请前往个人中心进行实名认证</p>
+    `
+  } else if (userInfo.value.can_upload === -2) { // 没有默认儿童
+    showNotice.value = true;
+    noticeText.value = '前往新增'
+    noticeHtml.value = `
+      <p>您还没有新增儿童</p>
+      <p>请前往个人中心进行新增</p>
+    `
   }
 }
@@ -221,8 +254,8 @@ const submitCommentBox = (note) => {
   }
   axios.post(`/srv/?a=${url}`, data)
   .then(res => {
-    if (res.data.code === 1) {
     showCommentBoxPopup.value = false;
+    if (res.data.code === 1) {
       Toast.success('发布成功')
       // 刷新列表
       if (commentType.value === 'comment') {
--- a/src/views/me/handleUser.vue
View file @61e6913
+++ b/src/views/me/handleUser.vue
View file @61e6913
@@ -134,8 +134,12 @@ const saveInfo = () => {
           message: '保存成功',
           duration: 1000,
           onClose: () => {
+            if ($route.query.back_url) {
+              $router.push($route.query.back_url)
+            } else {
               $router.go(-1)
             }
+          }
         });
       } else {
         console.warn(res);
--- a/src/views/me/verifyUser.vue
View file @61e6913
+++ b/src/views/me/verifyUser.vue
View file @61e6913
@@ -44,11 +44,12 @@ import MyButton from '@/components/MyButton/index.vue'
 import { wxInfo } from '@/utils/tools';
 import { ref, onMounted, nextTick } from 'vue'
-import { useRouter } from 'vue-router'
+import { useRoute, useRouter } from 'vue-router'
 import axios from '@/utils/axios';
 import { Toast } from 'vant';
 import { styleColor } from '@/constant.js';
+const $route = useRoute();
 const $router = useRouter();
 const themeVars = {
@@ -178,7 +179,11 @@ const onSubmit = (values) => {
     .then(res => {
       if (res.data.code === 1) {
         Toast.success('录入成功')
-        $router.go(-1);
+        if ($route.query.back_url) {
+          $router.push($route.query.back_url)
+        } else {
+          $router.go(-1)
+        }
       } else {
         console.warn(res.data);
         if (!res.data.show) return false;