From 36081edf9f0a887078b90fc4a31615d4fe290878 Mon Sep 17 00:00:00 2001
From: mackt <1033530438@qq.com>
Date: Sat, 6 Apr 2024 19:14:57 +0800
Subject: [PATCH] update(comment): Add tumb feature and check empty string when
 submit.

---
 public/img/download/logo_android.png              | Bin 498 -> 0 bytes
 public/img/download/logo_apple.png                | Bin 544 -> 0 bytes
 .../icon/{like-active.svg => thumb-active.svg}    |   0
 public/img/icon/{like.svg => thumb.svg}           |   0
 src/components/Comment/ButtonBar.tsx              |   9 ++++++---
 src/components/Comment/Comment.tsx                |   1 -
 src/components/Comment/CommentForm.tsx            |   2 +-
 src/components/Comment/CommentInput.tsx           |   2 +-
 src/components/Comment/CommentItem.tsx            |   5 -----
 src/components/Comment/CommentSubInput.tsx        |  10 ----------
 src/components/Comment/CommentSubItem.tsx         |   2 +-
 11 files changed, 9 insertions(+), 22 deletions(-)
 delete mode 100644 public/img/download/logo_android.png
 delete mode 100644 public/img/download/logo_apple.png
 rename public/img/icon/{like-active.svg => thumb-active.svg} (100%)
 rename public/img/icon/{like.svg => thumb.svg} (100%)
 delete mode 100644 src/components/Comment/CommentSubInput.tsx

diff --git a/public/img/download/logo_android.png b/public/img/download/logo_android.png
deleted file mode 100644
index a6256c0d98ffed9d6b53c31dcb3b17a6227da09b..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 498
zcmV<O0S*3%P)<h;3K|Lk000e1NJLTq001xm001xu1^@s6R|5Hm00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH0f$LMK~#7F?bq*7
zgD?~T@Q3GjI|5E%JArWmyFt5w-2gYx4RC{wK%D@cfNoGXc)nb6X9yt@NH}`;es}Lm
zA*A`A6o4_t7-MW6h*(fm6kCXl@_eB<%1=mvGT!5#3&jc|p}cZz6GPv<f#Fuxbpi1l
zt?zdbn{092@}pYHlkeWjvw>77^Mmzc6-*=xY~{Izl=LKy(hGV~FqIG}gFw2#X3L)`
zHu`!;vDT48d*1v|d{KN;ob+{VrMb_t><p<ndZEGTUSTe%mc0wcHEQgKETg7pXm@=K
zauXAf5~`)N#I$1WFP#e1IFI<1piJLzUOR{dyX*BF<RUSBQ^W2-%k-|FA23`)A!H%3
ze`wY)6{;hyvxTg5q4VQlyeo#JbMY>tsFt;@=ed1C4PmCwJ?RP@dvvE4KhUp1^+%+_
zaY|J4>%UF0w-+)`;dA;(ceD+2qBGKy>w#|w30Mx%H;k^O0@9=Frmq4Iuq+$b&0Eh4
opP<g{OR<#s$QWacF~*qo3*OPO$Pq24r2qf`07*qoM6N<$g3njjPXGV_

diff --git a/public/img/download/logo_apple.png b/public/img/download/logo_apple.png
deleted file mode 100644
index 9f9d1ca6bbbfec403bf566a2199fb70dafef6ac5..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 544
zcmV+*0^j|KP)<h;3K|Lk000e1NJLTq001xm001xu1^@s6R|5Hm00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH0kug)K~#7F?bv}$
z!ax)T;J?NJaD#3j8;BFA6W|82fjEIW0k8oZP$xhppiWRWc>ZTgB&AJWuYJ`f_a%Qw
zY=wK}?r|*;1VIo4JrR)+^TceJErx^xo-lj)HJk!C*r}XbU<f$SSgMUN1jT$Wd&3aa
zT>Vbx{snB6r^!2Wiw<3)1MW)m<q$>Dq2h4D?3gu=Cq*lDg^ie$e@oG~Qa?YHx$eT;
zm(F)n>A7Y-9RFv6KFE1Luagx6-iqFW8NrHF_w%l8n-rm5#FEeRCG35`g6O7ATaU0H
z`MkF_hZVm0Qf%$vNxKHFVJm?rZ2{IBuN^#DZzZ%2@bq5_@cxFi1*EX$y~eZ!e8QG%
z(-U~m7T~?e8d!+OK1f?Y0(&vz_CYZ$NIzSNpC2`5svTF8F0?{FVrH&Axk&-;M%=q!
zH>AE;>H><}#TVF1VYzLWW_MUV)broBfU)GaixxKM13zdc-P?;*3#}<)F5Ss|2OpsY
ze&~!ZuN8+9X3cyd?_BN|);(&uLEa`$xoygW@AIKn1vtf(yJN1Hj9Jw@;5we~3OVjR
i6ZfzSK@bGNU-<@U_TY1jkc~b70000<MNUMnLSTXtn&<EU

diff --git a/public/img/icon/like-active.svg b/public/img/icon/thumb-active.svg
similarity index 100%
rename from public/img/icon/like-active.svg
rename to public/img/icon/thumb-active.svg
diff --git a/public/img/icon/like.svg b/public/img/icon/thumb.svg
similarity index 100%
rename from public/img/icon/like.svg
rename to public/img/icon/thumb.svg
diff --git a/src/components/Comment/ButtonBar.tsx b/src/components/Comment/ButtonBar.tsx
index 8e3cc28..7091a95 100644
--- a/src/components/Comment/ButtonBar.tsx
+++ b/src/components/Comment/ButtonBar.tsx
@@ -27,6 +27,7 @@ export default function ButtonBar({
   };
 
   const handleThumbup = async () => {
+    setThumbup(!thumbup);
     const res = await onThumbup();
     if (res) setThumbup(!thumbup);
   };
@@ -51,14 +52,16 @@ export default function ButtonBar({
         </div>
       )}
       {/* 点赞 */}
-      <div className="flex flex-row items-center w-[49px] h-[24px] group cursor-pointer" onClick={handleThumbup}>
+      <div className="w-[49px] h-[24px] group cursor-pointer" onClick={handleThumbup}>
         {thumbupCount > 0 && (
-          <div className="mr-[2px] pt-[5px] text-[rgba(0,0,0,0.7)] text-[12px] leading-[16.8px] group-hover:text-theme">
+          <div
+            className={`float-left mr-[2px] pt-[5px] ${thumbup ? 'text-theme' : 'text-[rgba(0, 0, 0, 0.7)]'} text-[12px] leading-[16.8px] group-hover:text-theme`}
+          >
             {thumbupCount}
           </div>
         )}
         <div
-          className={`w-[24px] h-[24px] ${thumbup ? 'bg-[url(/img/icon/thumb-active.svg)]' : 'bg-[url(/img/icon/thumb.svg)]'} group-hover:bg-[bg-[url(/img/icon/thumb-active.svg)]]`}
+          className={`float-left w-[24px] h-[24px] ${thumbup ? 'bg-[url(/img/icon/thumb-active.svg)]' : 'bg-[url(/img/icon/thumb.svg)]'} group-hover:bg-[url(/img/icon/thumb-active.svg)]`}
         />
       </div>
     </div>
diff --git a/src/components/Comment/Comment.tsx b/src/components/Comment/Comment.tsx
index 65d0f78..2743b83 100644
--- a/src/components/Comment/Comment.tsx
+++ b/src/components/Comment/Comment.tsx
@@ -39,7 +39,6 @@ export default function Comment({ journalId, className, totalCommentReply, total
 
   // 加载评论
   const handleLoadMore = useCallback(async () => {
-    console.log(commentList.length, totalCommentReplyInt);
     if (commentList.length >= totalCommentReplyInt) return;
     if (loading) return;
     setLoading(true);
diff --git a/src/components/Comment/CommentForm.tsx b/src/components/Comment/CommentForm.tsx
index e915333..498d81a 100644
--- a/src/components/Comment/CommentForm.tsx
+++ b/src/components/Comment/CommentForm.tsx
@@ -31,7 +31,7 @@ export default function CommentItem({ onSubmit }: Props) {
       />
       <Button
         type="primary"
-        disabled={loading || !value}
+        disabled={loading || !value.trim()}
         className="w-[80px] h-[35px] my-[15px] rounded-[16px] text-[13px] leading-[18.2px]"
         onClick={handleSubmit}
       >
diff --git a/src/components/Comment/CommentInput.tsx b/src/components/Comment/CommentInput.tsx
index 4884b4a..5b95762 100644
--- a/src/components/Comment/CommentInput.tsx
+++ b/src/components/Comment/CommentInput.tsx
@@ -18,7 +18,7 @@ export default function CommentInput({ nickName, avatar, className, onSubmit }:
   const [loading, setLoading] = useState<boolean>(false);
 
   const btnDisabled = useMemo(() => {
-    return loading && !value;
+    return loading && !value.trim();
   }, [loading, value]);
 
   const handleReplySubmit = async () => {
diff --git a/src/components/Comment/CommentItem.tsx b/src/components/Comment/CommentItem.tsx
index 5ded39f..799b46e 100644
--- a/src/components/Comment/CommentItem.tsx
+++ b/src/components/Comment/CommentItem.tsx
@@ -9,11 +9,6 @@ import SubCommentItem from './CommentSubItem';
 import { Avatar } from '@/components';
 import { apiCommentThumbup, apiCommentSave, apiGetSubComment } from '@/services';
 
-// 回复
-const handleReply = async (params: { content: string; journalId: string; parentId: string }) => {
-  await apiCommentSave(params);
-};
-
 export default function CommentItem({
   _id,
   avatar,
diff --git a/src/components/Comment/CommentSubInput.tsx b/src/components/Comment/CommentSubInput.tsx
deleted file mode 100644
index 83aa37f..0000000
--- a/src/components/Comment/CommentSubInput.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-/** 子评论输入框 */
-import { Avatar } from '@/components';
-
-export default function CommentSubInput() {
-  return (
-    <div>
-      <Avatar />
-    </div>
-  );
-}
diff --git a/src/components/Comment/CommentSubItem.tsx b/src/components/Comment/CommentSubItem.tsx
index f53c88f..e60c002 100644
--- a/src/components/Comment/CommentSubItem.tsx
+++ b/src/components/Comment/CommentSubItem.tsx
@@ -15,7 +15,7 @@ export default function SubCommentItem({
         <div className="ml-[5px]">
           <div className="w-[630px] text-[13px] leading-[20px] text-overflow">
             <span className="text-[rgba(0,0,0,0.4)]">{`${nickName}:  `}</span>
-            <span className="text-base">{content}</span>
+            <span className="text-base text-overflow">{content}</span>
             {/* 归属地 */}
           </div>
           <div className="mt-[4px] text-[rgba(0,0,0,0.4)] text-[10px] leading-[14px]">{`${publishTime} ${location}`}</div>