Compare commits
4 Commits
82de2eff42
...
922791a0f5
| Author | SHA1 | Date | |
|---|---|---|---|
|
922791a0f5 | ||
|
|
6bfa1bf6b7 | ||
|
|
6aa985bfca | ||
|
|
7db95ed677 |
@@ -3,8 +3,8 @@ import { $ } from "mdui"
|
||||
export default class MduiPatchedTextAreaElement extends HTMLElement {
|
||||
static observedAttributes = ['value', 'placeholder']
|
||||
declare inputDiv?: HTMLDivElement
|
||||
declare inputPlaceHolderDiv?: HTMLDivElement
|
||||
declare inputContainerDiv?: HTMLDivElement
|
||||
declare placeholder?: string | number | null
|
||||
constructor() {
|
||||
super()
|
||||
|
||||
@@ -18,8 +18,10 @@ export default class MduiPatchedTextAreaElement extends HTMLElement {
|
||||
this.inputContainerDiv = new DOMParser().parseFromString(`
|
||||
<div style="overflow-y: auto; height: 100%;">
|
||||
<div role="textbox" aria-multiline="true" aria-labelledby="txtboxMultilineLabel" contentEditable="true" style="outline: none !important; color: rgb(var(--mdui-color-on-surface-variant)); display: inline-block; word-break: break-word; white-space: pre-wrap;"></div>
|
||||
<div style="display: none;"></div>
|
||||
<style>
|
||||
[contenteditable="true"]:empty:before {
|
||||
content: attr(data-placeholder);
|
||||
}
|
||||
*::-webkit-scrollbar {
|
||||
width: 7px;
|
||||
height: 10px;
|
||||
@@ -51,15 +53,8 @@ export default class MduiPatchedTextAreaElement extends HTMLElement {
|
||||
</div>
|
||||
`, 'text/html').body.firstChild as HTMLDivElement
|
||||
|
||||
console.log(this.inputContainerDiv.children)
|
||||
this.inputDiv = this.inputContainerDiv.children[0] as HTMLDivElement
|
||||
this.inputPlaceHolderDiv = this.inputContainerDiv.children[1] as HTMLDivElement
|
||||
|
||||
this.inputDiv.addEventListener('input', () => {
|
||||
// TODO: 修复 placeholder
|
||||
this.inputPlaceHolderDiv!.style.display = this.value == '' ? '' : 'none'
|
||||
this.inputDiv!.style.display = this.value == '' ? 'none' : ''
|
||||
})
|
||||
this.inputDiv.addEventListener('blur', () => {
|
||||
if (this._lastValue !== this.value) {
|
||||
this._lastValue = this.value || ''
|
||||
@@ -73,16 +68,19 @@ export default class MduiPatchedTextAreaElement extends HTMLElement {
|
||||
|
||||
this.inputDiv.style.width = '100%'
|
||||
|
||||
$(this.inputDiv).attr('data-placeholder', $(this).attr('placeholder'))
|
||||
|
||||
shadow.appendChild(this.inputContainerDiv)
|
||||
}
|
||||
attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null) {
|
||||
console.log(this.inputDiv, name, oldValue, newValue)
|
||||
switch (name) {
|
||||
case 'value': {
|
||||
this.value = newValue || ''
|
||||
break
|
||||
}
|
||||
case 'placeholder': {
|
||||
this.inputPlaceHolderDiv && (this.inputPlaceHolderDiv.innerText = newValue || '')
|
||||
this.inputDiv && $(this.inputDiv).attr('data-placeholder', newValue)
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
@@ -44,10 +44,21 @@ export default function ChatFragment({
|
||||
const inputRef = React.useRef<TextField>()
|
||||
const chatPagePanelRef = React.useRef<ChatPanelRef>()
|
||||
|
||||
/**
|
||||
* 发送消息, 成功则清空文本
|
||||
*/
|
||||
async function performSendMessage() {
|
||||
await chatInfo.sendMessageOrThrow(inputRef.current!.value)
|
||||
inputRef.current!.value = ''
|
||||
}
|
||||
/**
|
||||
* 拉取更多消息
|
||||
* 本质是修改获取的偏移?
|
||||
* WIP
|
||||
*/
|
||||
async function pullMoreMessages() {
|
||||
|
||||
}
|
||||
|
||||
return (
|
||||
<div style={{
|
||||
@@ -66,13 +77,13 @@ export default function ChatFragment({
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
}}>
|
||||
{
|
||||
{/* {
|
||||
openedInDialog && <mdui-button-icon icon="arrow_back" onClick={() => AppState.closeChat()} style={{
|
||||
alignSelf: 'center',
|
||||
marginLeft: '5px',
|
||||
marginRight: '5px',
|
||||
}}></mdui-button-icon>
|
||||
}
|
||||
} */}
|
||||
<mdui-tabs ref={tabRef} value={tabItemSelected} style={{
|
||||
position: 'sticky',
|
||||
display: "flex",
|
||||
@@ -227,68 +238,7 @@ export default function ChatFragment({
|
||||
<input accept="image/*" type="file" name="上传对话头像"></input>
|
||||
</div>
|
||||
{
|
||||
/* chatInfo.getType() == 'group' && <PreferenceLayout>
|
||||
<PreferenceUpdater.Provider value={groupPreferenceStore.createUpdater()}>
|
||||
<PreferenceHeader
|
||||
title="群组资料" />
|
||||
<Preference
|
||||
title="上传新的头像"
|
||||
icon="image"
|
||||
disabled={!chatInfo.isAdmin()}
|
||||
onClick={() => {
|
||||
uploadChatAvatarRef.current!.click()
|
||||
}} />
|
||||
<TextFieldPreference
|
||||
title="设置群名称"
|
||||
icon="edit"
|
||||
id="group_title"
|
||||
state={groupPreferenceStore.state.group_title || ''}
|
||||
disabled={!chatInfo.isAdmin()} />
|
||||
<TextFieldPreference
|
||||
title="设置群别名"
|
||||
icon="edit"
|
||||
id="group_name"
|
||||
description="以便于添加, 可留空"
|
||||
state={groupPreferenceStore.state.group_name || ''}
|
||||
disabled={!chatInfo.isAdmin()} />
|
||||
<PreferenceHeader
|
||||
title="入群设定" />
|
||||
<SwitchPreference
|
||||
title="允许入群"
|
||||
icon="person_add"
|
||||
id="allow_new_member_join"
|
||||
disabled={!chatInfo.isAdmin()}
|
||||
state={groupPreferenceStore.state.allow_new_member_join || false} />
|
||||
<SwitchPreference
|
||||
title="允许成员邀请"
|
||||
description="目前压根没有这项功能, 甚至还不能查看成员列表, 以后再说吧"
|
||||
id="allow_new_member_from_invitation"
|
||||
icon="_"
|
||||
disabled={true || !chatInfo.isAdmin()}
|
||||
state={groupPreferenceStore.state.allow_new_member_from_invitation || false} />
|
||||
<SelectPreference
|
||||
title="入群验证方式"
|
||||
icon="_"
|
||||
id="new_member_join_method"
|
||||
selections={{
|
||||
disabled: "无需验证",
|
||||
allowed_by_admin: "只需要管理员批准 (WIP)",
|
||||
answered_and_allowed_by_admin: "需要回答问题并获得管理员批准 (WIP)",
|
||||
}}
|
||||
disabled={!chatInfo.isAdmin() || !groupPreferenceStore.state.allow_new_member_join}
|
||||
state={groupPreferenceStore.state.new_member_join_method || 'disabled'} />
|
||||
{
|
||||
groupPreferenceStore.state.new_member_join_method == 'answered_and_allowed_by_admin'
|
||||
&& <TextFieldPreference
|
||||
title="设置问题"
|
||||
icon="_"
|
||||
id="answered_and_allowed_by_admin_question"
|
||||
description="WIP"
|
||||
state={groupPreferenceStore.state.answered_and_allowed_by_admin_question || ''}
|
||||
disabled={true || !chatInfo.isAdmin()} />
|
||||
}
|
||||
</PreferenceUpdater.Provider>
|
||||
</PreferenceLayout> */
|
||||
// 群组设置?
|
||||
}
|
||||
{
|
||||
chatInfo.getType() == 'private' && (
|
||||
|
||||
64
client/ui/chat-fragment/settings/GroupSettingsFragment.tsx
Normal file
64
client/ui/chat-fragment/settings/GroupSettingsFragment.tsx
Normal file
@@ -0,0 +1,64 @@
|
||||
export default function GroupSettingsFragment() {
|
||||
/* chatInfo.getType() == 'group' && <PreferenceLayout>
|
||||
<PreferenceUpdater.Provider value={groupPreferenceStore.createUpdater()}>
|
||||
<PreferenceHeader
|
||||
title="群组资料" />
|
||||
<Preference
|
||||
title="上传新的头像"
|
||||
icon="image"
|
||||
disabled={!chatInfo.isAdmin()}
|
||||
onClick={() => {
|
||||
uploadChatAvatarRef.current!.click()
|
||||
}} />
|
||||
<TextFieldPreference
|
||||
title="设置群名称"
|
||||
icon="edit"
|
||||
id="group_title"
|
||||
state={groupPreferenceStore.state.group_title || ''}
|
||||
disabled={!chatInfo.isAdmin()} />
|
||||
<TextFieldPreference
|
||||
title="设置群别名"
|
||||
icon="edit"
|
||||
id="group_name"
|
||||
description="以便于添加, 可留空"
|
||||
state={groupPreferenceStore.state.group_name || ''}
|
||||
disabled={!chatInfo.isAdmin()} />
|
||||
<PreferenceHeader
|
||||
title="入群设定" />
|
||||
<SwitchPreference
|
||||
title="允许入群"
|
||||
icon="person_add"
|
||||
id="allow_new_member_join"
|
||||
disabled={!chatInfo.isAdmin()}
|
||||
state={groupPreferenceStore.state.allow_new_member_join || false} />
|
||||
<SwitchPreference
|
||||
title="允许成员邀请"
|
||||
description="目前压根没有这项功能, 甚至还不能查看成员列表, 以后再说吧"
|
||||
id="allow_new_member_from_invitation"
|
||||
icon="_"
|
||||
disabled={true || !chatInfo.isAdmin()}
|
||||
state={groupPreferenceStore.state.allow_new_member_from_invitation || false} />
|
||||
<SelectPreference
|
||||
title="入群验证方式"
|
||||
icon="_"
|
||||
id="new_member_join_method"
|
||||
selections={{
|
||||
disabled: "无需验证",
|
||||
allowed_by_admin: "只需要管理员批准 (WIP)",
|
||||
answered_and_allowed_by_admin: "需要回答问题并获得管理员批准 (WIP)",
|
||||
}}
|
||||
disabled={!chatInfo.isAdmin() || !groupPreferenceStore.state.allow_new_member_join}
|
||||
state={groupPreferenceStore.state.new_member_join_method || 'disabled'} />
|
||||
{
|
||||
groupPreferenceStore.state.new_member_join_method == 'answered_and_allowed_by_admin'
|
||||
&& <TextFieldPreference
|
||||
title="设置问题"
|
||||
icon="_"
|
||||
id="answered_and_allowed_by_admin_question"
|
||||
description="WIP"
|
||||
state={groupPreferenceStore.state.answered_and_allowed_by_admin_question || ''}
|
||||
disabled={true || !chatInfo.isAdmin()} />
|
||||
}
|
||||
</PreferenceUpdater.Provider>
|
||||
</PreferenceLayout> */
|
||||
}
|
||||
Reference in New Issue
Block a user