From da79d6d4d78aec2323a07a9e5faf09e2ef44a3a6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=A7=89?= <huan0016@gmail.com>
Date: Sat, 7 Oct 2023 02:01:22 +0800
Subject: [PATCH] =?UTF-8?q?avatar=20=E9=99=8D=E4=BD=8E=E7=82=B9=E9=94=99?=
 =?UTF-8?q?=E6=A6=82=E7=8E=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/client.js | 116 ++++++++++++++++++++++-------------------------
 1 file changed, 53 insertions(+), 63 deletions(-)

diff --git a/public/client.js b/public/client.js
index 2f7c91a..76f6aae 100644
--- a/public/client.js
+++ b/public/client.js
@@ -225,73 +225,63 @@ export default class ClientList {
     add(item) {
         this.element.appendChild(ListItem({
             id: item.id,
-            onclick: event => {
-            },
+            onclick: event => document.body.appendChild(Dialog({
+                children: [
+                    Avatar({
+                        src: item.avatar ?? '/favicon.ico',
+                        style: {
+                            width: '240px',
+                            height: '240px',
+                            borderRadius: '8px',
+                            margin: '0 auto',
+                            display: 'block',
+                            cursor: 'pointer'
+                        },
+                        onclick: event => {
+                            console.log('点击上传图片')
+                            const input = document.createElement('input')
+                            input.type = 'file'
+                            input.accept = 'image/*'
+                            input.onchange = async event => {
+                                const file = event.target.files[0]
+                                const reader = new FileReader()
+                                reader.readAsDataURL(file)
+                                reader.onload = async event => {
+                                    const base64 = event.target.result
+                                    localStorage.setItem('avatar', base64)
+                                    window.location.reload() // 简单刷新页面
+                                }
+                            }
+                            input.click()
+                        }
+                    }),
+                    Input({
+                        style: {
+                            width: '100px',
+                            border: '2px dotted #bbb',
+                            borderRadius: '50%',
+                            outline: 'none',
+                            padding: '5px 0',
+                            textAlign: 'center',
+                            position: 'absolute',
+                            bottom: '-2px',
+                        },
+                        value: item.name ?? item.id,
+                        type: 'text',
+                        placeholder: '请设置你的昵称',
+                        onchange: event => {
+                            localStorage.setItem('username', event.target.value)
+                            window.location.reload() // 简单刷新页面
+                        }
+                    })
+                ]
+            })),
             children: [
                 Avatar({
-                    src: item.avatar ?? '/favicon.ico',
-                    onclick: event => {
-                        event.stopPropagation()
-                        // 点击插入一个弹出层
-                        document.body.appendChild(Dialog({
-                            children: [
-                                Avatar({
-                                    src: item.avatar ?? '/favicon.ico',
-                                    style: {
-                                        width: '240px',
-                                        height: '240px',
-                                        borderRadius: '8px',
-                                        margin: '0 auto',
-                                        display: 'block',
-                                        cursor: 'pointer'
-                                    },
-                                    onclick: event => {
-                                        // 点击上传图片
-                                        console.log('点击上传图片')
-                                        const input = document.createElement('input')
-                                        input.type = 'file'
-                                        input.accept = 'image/*'
-                                        input.onchange = async event => {
-                                            const file = event.target.files[0]
-                                            const reader = new FileReader()
-                                            reader.readAsDataURL(file)
-                                            reader.onload = async event => {
-                                                const base64 = event.target.result
-                                                localStorage.setItem('avatar', base64)
-                                                window.location.reload() // 简单刷新页面
-                                            }
-                                        }
-                                        input.click()
-                                    }
-                                }),
-                                Input({
-                                    style: {
-                                        width: '100px',
-                                        border: '2px dotted #bbb',
-                                        borderRadius: '50%',
-                                        outline: 'none',
-                                        padding: '5px 0',
-                                        textAlign: 'center',
-                                        position: 'absolute',
-                                        bottom: '-2px',
-                                    },
-                                    value: item.name ?? item.id,
-                                    type: 'text',
-                                    placeholder: '请设置你的昵称',
-                                    onchange: event => {
-                                        localStorage.setItem('username', event.target.value)
-                                        window.location.reload() // 简单刷新页面
-                                    }
-                                })
-                            ]
-                        }))
-                    }
+                    src: item.avatar ?? '/favicon.ico'
                 }),
                 Span({
-                    textContent: item.name ?? item.id,
-                    onclick: event => {
-                        event.stopPropagation()
-                    }
+                    textContent: item.name ?? item.id
                 })
             ]
         }))