🦄 refactor: 写法优化

hookehuyr
Commit 12150758bd213416b38955f991c0132ebdfad038 12150758 1 parent d730824d
Showing 1 changed file with 47 additions and 69 deletions
src/views/me/callMe.vue
--- a/src/views/me/callMe.vue
View file @1215075
+++ b/src/views/me/callMe.vue
View file @1215075
@@ -12,7 +12,7 @@
             <p>{{ item.kg_name }}</p>
           </van-col>
           <van-col span="4" style="text-align: center;">
-            <p style="color: #333333; position: relative; text-align: right;" @click="setComment(item, 'reply')">
+            <p style="color: #333333; position: relative; text-align: right;" @click="openCommentBox(item, 'reply')">
               回复
               <span v-if="item.is_new" class="spot">·</span>
             </p>
@@ -21,13 +21,17 @@
         </van-row>
         <van-row>
           <van-col>
-            <span style="color: #222222;">{{ item.c_action }}<span style="color: #0B3A72;">@{{ item.c_name }}</span>：{{
+            <span style="color: #222222;">
-            item.note }}</span>
+              {{ item.c_action }}
+              <span style="color: #0B3A72;">@{{ item.c_name }}</span>
+              ：{{ item.note }}
+            </span>
           </van-col>
         </van-row>
       </div>
-      <div style="padding: 1rem; background-color: #F7F7F7;" @click="openComment(item)">
+      <div style="padding: 1rem; background-color: #F7F7F7;"
+        @click="go('/client/videoDetail/comment', { prod_id: item.prod_id, perf_id: item.perf_id, book_id: item.book_id })">
         <van-row>
           <van-col span="8" style="position: relative;">
             <van-image width="8rem" height="5rem" fit="cover" :src="item.cover" style="vertical-align: text-bottom;">
@@ -57,17 +61,16 @@
 import { no_image, icon_avatar } from '@/utils/generateIcons.js'
 import CommentBox from '@/components/CommentBox/index.vue'
 import { ref, onActivated } from 'vue'
-import { useRoute, useRouter, onBeforeRouteLeave } from 'vue-router'
+import { useRoute, onBeforeRouteLeave } from 'vue-router'
-// import axios from '@/utils/axios';
-import _ from 'lodash'
 import { Toast } from 'vant';
 // import { addPages, store } from '@/hooks/useKeepAlive'
 import { myAtmeAPI } from '@/api/C/me'
 import { addCommentAPI, addReplyAPI } from '@/api/C/perf'
 import { myCommentTimeAPI } from '@/api/C/perf'
+import { useGo } from '@/hooks/useGo'
+const go = useGo()
 const $route = useRoute();
-const $router = useRouter();
 onBeforeRouteLeave(async () => {
   // 更新留言阅读情况
@@ -85,11 +88,11 @@ const emptyStatus = ref(false);
 //
 const onLoad = async () => {
   const { data } = await myAtmeAPI({ limit: limit.value, offset: offset.value });
-  _.each(data, item => {
+  data.forEach(item => {
-    let arr = _.split(item.target_name, '@'); // 分割评论的动作和姓名
+    const arr = item.target_name.split('@'); // 分割评论的动作和姓名
     item.c_action = arr[0]; // 评论动作
     item.c_name = arr[1]; // 评论姓名
-  })
+  });
   commentList.value = [...commentList.value, ...data];
   offset.value = commentList.value.length;
   loading.value = false;
@@ -109,35 +112,34 @@ const onLoad = async () => {
 /******** 留言框相关操作 START *******/
 // 回复评论控件
 const showCommentBoxPopup = ref(false);
-const commentType = ref(''); // 类型 comment 为评论 / 类型 reply 为回复
+const commentType = ref(''); // 类型 comment 为评论 ｜ 类型 reply 为回复
-
+const commentId = ref('')
+const replayUser = ref('')
 /**
- * 回复/评论 功能
+ * @param {*} name 评论姓名
- * @param {*} v 单行评论数据
+ * @param {*} id 评论ID
  * @param {*} type 类型 comment 为评论/类型 reply 为回复
+ * @description 打开 回复/评论 控件
  */
-const commentId = ref('')
+const openCommentBox = ({ name, id }, type) => {
-const replayUser = ref('')
-// 打开评论弹框组件
-const setComment = (v, type) => {
   showCommentBoxPopup.value = true;
   commentType.value = type;
-  replayUser.value = v.name;
+  replayUser.value = name;
-  commentId.value = v.id;
+  commentId.value = id;
 }
 /**
- * 留言/回复 回调
  * @param {*} note 留言内容
  * @param {*} prod_id 作品ID
  * @param {*} comment_id 评论ID
+ * @description 留言/回复 提交回调
  */
 const submitCommentBox = async (note) => {
-  let params = { note };
+  let params = { note }; // 基础传值结构，包含留言内容
   if (commentType.value === 'comment') {
     params.prod_id = $route.query.prod_id;
-    const { msg } = await addCommentAPI(params);
+    const { code } = await addCommentAPI(params);
-    if (msg === 'OK') {
+    if (code) {
       Toast.success('发布成功')
       // 刷新列表
       location.reload()
@@ -145,8 +147,8 @@ const submitCommentBox = async (note) => {
   }
   if (commentType.value === 'reply') {
     params.comment_id = commentId.value;
-    const { msg } = await addReplyAPI(params);
+    const { code } = await addReplyAPI(params);
-    if (msg === 'OK') {
+    if (code) {
       Toast.success('发布成功')
       // 刷新列表
       location.reload()
@@ -154,62 +156,38 @@ const submitCommentBox = async (note) => {
   }
 }
-const closeCommentBox = (v) => { // 关闭留言框
+/**
+ * @param {*} v 
+ * @description 关闭留言框回调
+ */
+const closeCommentBox = (v) => {
   showCommentBoxPopup.value = v;
 }
 /******** 留言框相关操作 START *******/
-const onClick = (item) => {
+// const onClick = (item) => {
-  // 调整书籍详情页
+//   // 调整书籍详情页
-  $router.push({
+//   $router.push({
-    path: '/client/videoDetail',
+//     path: '/client/videoDetail',
-    query: {
+//     query: {
-      prod_id: item.prod_id,
+//       prod_id: item.prod_id,
-      perf_id: item.perf_id,
+//       perf_id: item.perf_id,
-      book_id: item.book_id
+//       book_id: item.book_id
-    }
+//     }
-  });
+//   });
-}
+// }
-
-const openComment = (item) => {
-  $router.push({
-    path: '/client/videoDetail/comment',
-    query: {
-      prod_id: item.prod_id,
-      perf_id: item.perf_id,
-      book_id: item.book_id
-    }
-  });
-}
 /****************** keepAlive 模块 *******************/
 // TAG: keepAlive 缓存页面
 // addPages();
-onActivated(() => { // keepAlive 重置后执行回调
+// onActivated(() => { // keepAlive 重置后执行回调
-});
+// });
 /*********************************************************/
 </script>
-<script>
-export default {
-  name: 'callMe',
-  data () {
-    return {
-
-    }
-  },
-  mounted () {
-
-  },
-  methods: {
-
-  }
-}
-</script>
-
 <style lang="less" scoped>
 .comment-wrapper {
   color: #999999;