日常提交

cliclitv · May 12, 2024 · b85de81 · b85de81
1 parent 58d7b96
commit b85de81
Show file tree

Hide file tree

Showing 6 changed files with 197 additions and 41 deletions.
diff --git a/fre/src/comment/comment.tsx b/fre/src/comment/comment.tsx
@@ -4,49 +4,35 @@ import { push } from '../use-route'
 import { addComment, getComments, getUser } from '../util/api'
 import './comment.css'
 
-export default function Comment({ post, live }) {
+export default function Comment({ post }) {
     console.log(post)
     const [comment, setComment] = useState('')
     const [comments, setComments] = useState([])
 
     const [pos, setPos] = useState(0)
     useEffect(() => {
-        if (live) {
-            getComments(0, post.id).then(res => {
-                setComments((res as any).comments || [])
-            })
-        } else {
-            getComments(post.id, 0).then(res => {
-                setComments((res as any).comments || [])
-            })
-        }
+
+        getComments(post.id, 0).then(res => {
+            setComments((res as any).comments || [])
+        })
+
     }, [])
 
     function submit() {
         if (comment.length < 1) {
             return
         }
-        if (live) {
-            addComment({
-                pid: 0,
-                rid: post.id,
-                pos,
-                ruid: post.id,
-                content: comment,
-            } as any).then(res => {
-                alert(res.msg)
-            })
-        } else {
-            addComment({
-                pid: post.id,
-                rid: 0,
-                pos,
-                ruid: post.uid,
-                content: comment,
-            } as any).then(res => {
-                alert(res.msg)
-            })
-        }
+
+        addComment({
+            pid: post.id,
+            rid: 0,
+            pos,
+            ruid: post.uid,
+            content: comment,
+        } as any).then((res: any) => {
+            alert(res.msg)
+        })
+
     }
     const user = getUser() || {}
     return <div>
@@ -61,6 +47,7 @@ export default function Comment({ post, live }) {
 
 
             {comments && comments.map(item => {
+                //@ts-ignore
                 const time = dayjs(item.time).format('MM-DD-YYYY')
                 return <div className="comment-item">
                     <Avatar uqq={item.uqq}></Avatar>

diff --git a/fre/src/danmaku/danmaku.css b/fre/src/danmaku/danmaku.css
@@ -0,0 +1,84 @@
+.comment {
+    width: 420px;
+    position: relative;
+    margin-bottom: 80px;
+}
+
+.comment-item {
+    box-sizing: border-box;
+    padding: 10px;
+    display: flex;
+}
+
+.comment-block{
+    flex: 1;
+}
+
+.comment-item .avatar{
+    margin: 0;
+    display: block;
+    padding: 5px 10px;
+}
+
+.comment-item p{
+    padding: 5px;
+}
+
+.comment-item p:nth-child(1){
+    color: #ddd;
+}
+
+.comment-item p:nth-child(3){
+    color: #888;
+    font-size: 12px;
+}
+
+.comment h1 {
+    font-weight: normal;
+    font-size: 12px!important;
+    color: #ddd!important;
+    padding: 10px;
+}
+
+.comment-item li {
+    display: flex;
+    align-items: center;
+}
+
+.comment-input {
+    display: flex;
+    align-items: center;
+    padding: 20px;
+    position: fixed;
+    z-index: 99999;
+    bottom: 0;
+    width: 400px;
+    background: #111;
+    box-sizing: border-box;
+}
+
+.comment-input input {
+    background: var(--primary-bg);
+    color: #fff;
+    height: 30px;
+    border: 0px;
+    border-radius: 30px;
+    padding: 0 10px;
+    flex: 1;
+}
+
+.comment-input button {
+    position: absolute;
+    right: 20px;
+    height: 30px;
+    padding: 0 10px;
+}
+
+.rate ul {
+    display: flex;
+    justify-content: center;
+}
+
+.comment-item ul {
+    display: flex;
+}
diff --git a/fre/src/danmaku/danmaku.tsx b/fre/src/danmaku/danmaku.tsx
@@ -0,0 +1,59 @@
+import { useEffect, useState, Fragment } from 'fre'
+import Avatar from '../component/avatar/avatar'
+import { push } from '../use-route'
+import { addDanmaku, getDanmakus, getUser } from '../util/api'
+import './comment.css'
+
+export default function Danmaku({ post,p }) {
+    const [comment, setDanmaku] = useState('')
+    const [comments, setDanmakus] = useState([])
+    useEffect(() => {
+
+        getDanmakus(post.id, 0).then(res => {
+            setDanmakus((res as any).comments || [])
+        })
+
+    }, [])
+
+    function submit() {
+        if (comment.length < 1) {
+            return
+        }
+        addDanmaku({
+            pid: post.id,
+            p: 0,
+            pos:0,
+            color:'#fffff',
+            content: comment,
+        } as any).then((res: any) => {
+            alert(res.msg)
+        })
+
+    }
+    const user = getUser() || {}
+    return <div>
+        <div class="comment">
+            <div className="comment-input">
+                <Avatar uqq={user.qq} uname={user.name} noname={true}></Avatar>
+                <input type="text" placeholder="Duang~" onInput={(e) => setDanmaku(e.target.value)} />
+                {user.id ? <button onClick={submit}>发送</button> : <button onclick={() => push('/login')}>登录</button>}
+            </div>
+
+            <h1>共有{comments ? comments.length : 0}条讨论</h1>
+
+
+            {comments && comments.map(item => {
+                //@ts-ignore
+                const time = dayjs(item.time).format('MM-DD-YYYY')
+                return <div className="comment-item">
+                    <div className="comment-block">
+                        <p><a href={`https://www.clicli.cc/comment/delete/${item.id}?token=${window.localStorage.getItem('token')}`} target="_blank"><del>#{item.id}</del></a></p>
+                        <p>{item.content}</p>
+                        <p>{time}</p>
+                    </div>
+
+                </div>
+            })}
+        </div>
+    </div>
+}
diff --git a/fre/src/play/play.tsx b/fre/src/play/play.tsx
@@ -6,13 +6,14 @@ import './play.css'
 import Avatar from '../component/avatar/avatar'
 import { push } from '../use-route'
 import Comment from '../comment/comment'
+import Danmaku from '../danmaku/danmaku'
 
 export default function Post({ gv }) {
     const [id, fp] = getAv(gv)
     const [post, setPost] = useState({} as any)
     const [videos, setVideos] = useState([])
     const [play, setPlay] = useState("")
-    const [show, setShow] = useState(false)
+    const [show, setShow] = useState(0)
     const [idx, setId] = useState(fp - 1)
 
     useEffect(() => {
@@ -32,7 +33,6 @@ export default function Post({ gv }) {
 
     const changeid = (i) => {
         setPlay(videos[i][1])
-        getPv(id)
         setId(i)
     }
 
@@ -49,8 +49,9 @@ export default function Post({ gv }) {
                                 <Avatar uqq={post.uqq} uname={post.uname} />
                             </div>
                             <ul class="tab">
-                                <li class={show && 'active'} onclick={() => setShow(true)}>分P</li>
-                                <li class={!show && 'active'} onclick={() => setShow(false)}>讨论</li>
+                                <li class={(show == 0) && 'active'} onclick={() => setShow(0)}>分P</li>
+                                <li class={(show == 1) && 'active'} onclick={() => setShow(1)}>讨论</li>
+                                <li class={(show == 2) && 'active'} onclick={() => setShow(2)}>弹幕</li>
                             </ul>
                         </div>
 
@@ -62,19 +63,23 @@ export default function Post({ gv }) {
                             {post.tag && post.tag.split(' ').filter(t => t.length > 0).map(tag => {
                                 return <li>{tag}</li>
                             })}
-                            {((getUser() || {}).level & 0b1110) > 0 ? <li onclick={() => push(`/draft/${id}`)}>编辑草稿 ⯈</li>:null}
+                            {((getUser() || {}).level & 0b1110) > 0 ? <li onclick={() => push(`/draft/${id}`)}>编辑草稿 ⯈</li> : null}
                         </div>
                     </div>
                 </div>
                 {
-                    show && <ul>
+                    (show == 0) && <ul>
                         {videos.map((name, index) => {
                             return <li class={index == idx ? 'active' : ''} onClick={() => changeid(index)}>{`P${index + 1}. ${videos[index][0]}`}</li>
                         })}
                     </ul>
                 }
                 {
-                    !show && post.id && <Comment post={post}></Comment>
+                    (show == 1) && post.id && <Comment post={post}></Comment>
+                }
+
+                {
+                    (show == 2) && post.id && <Danmaku post={post} p={idx}></Danmaku>
                 }
             </div>
         </div>

diff --git a/fre/src/util/api.ts b/fre/src/util/api.ts
@@ -33,7 +33,7 @@ function replaceContent(c = '') {
     .replace(/img[0-9].doubanio.com/g, 'doubanimg.deno.dev')
 }
 
-export function addPost({ title, content, status, sort, tag,  videos }) {
+export function addPost({ title, content, status, sort, tag, videos }) {
   videos = replaceContent(videos)
   return post('https://www.clicli.cc/post/add', {
     title,
@@ -119,7 +119,7 @@ export function updateArticle({ pid, oid, title, content, bio, id }) {
   })
 }
 
-export function getComments(pid,rid, page?, pageSize?) {
+export function getComments(pid, rid, page?, pageSize?) {
   console.log(pid)
   return get(`https://www.clicli.cc/comments?pid=${pid}&rid=${rid}&page=${page || 1}&pageSize=${pageSize || 1000}`)
 }
@@ -133,7 +133,23 @@ export function addComment({ pid, uid, pos, content, rid = 0, ruid, read = 0 })
   })
 }
 
+export function getDanmakus(pid, p, page?, pageSize?) {
+  console.log(pid)
+  return get(`https://www.clicli.cc/danmakus?pid=${pid}&p=${p}&page=${page || 1}&pageSize=${pageSize || 1000}`)
+}
+
+export function addDanmaku({ pid, p, uid, color, pos, content }) {
+  return post('https://www.clicli.cc/danmaku/add', {
+    content,
+    color,
+    p,
+    pos: pos.toString(),
+    uid: getUser().id,
+    pid
+  })
+}
+
 
-export function getUsers(level, page, pageSize){
+export function getUsers(level, page, pageSize) {
   return get(`https://www.clicli.cc/users?level=${level}&page=${page}&pageSize=${pageSize}`)
 }
diff --git a/main.go b/main.go
@@ -58,11 +58,16 @@ func RegisterHandler() *httprouter.Router {
 	router.POST("/user/update/:id", svc.UpdateUser)
 	router.GET("/users", svc.GetUsers)
 	router.GET("/user", svc.GetUser)
+
 	router.POST("/comment/add", svc.AddComment) // 需要限流
 	router.POST("/comment/read", svc.ReadComments)
 	router.GET("/comment/delete/:id", svc.DeleteComment)
 	router.GET("/comments", svc.GetComments)
 
+	router.POST("/danmaku/add", svc.AddDanmaku) // 需要限流
+	router.GET("/danmaku/delete/:id", svc.DeleteDanmaku)
+	router.GET("/danmakus", svc.GetDanmakus)
+
 	router.POST("/post/update/:id", svc.UpdatePost)
 	router.POST("/post/add", svc.AddPost)
 	router.GET("/post/:id", svc.GetPost)