修复创建群聊名称长度上限与编辑页不一致的问题(第6章复测发现)
创建群聊弹窗的名称输入框 maxLength 是30,但群资料页的编辑器(GroupNameEditor) 是11——两者编辑的是同一个 group.name 字段,建群时能起最多30字的名字,进编辑页 却连原样保存都做不到(打不满30个字符,且无法回退到超过11字的原值)。 核对参考图 设置昵称(1).png:这个字段的编辑器明确画的是"0/11"上限,没有任何一张 图支持30。后端本身不做长度限制(实测 PATCH 17 字符的名称成功),11 纯粹是前端自 己的约束,应该是创建页和编辑页保持一致,而不是让创建页放宽成一个没有依据的数字。 改为创建弹窗也用 maxLength="11",跟编辑页对齐。 Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 5
parent
211d93a0e4
commit
3a78c40389
@@ -232,7 +232,12 @@ function GroupList({tinode, onToast}) {
|
|||||||
</main>
|
</main>
|
||||||
{creating ? <div className="group-modal-backdrop"><section className="group-modal">
|
{creating ? <div className="group-modal-backdrop"><section className="group-modal">
|
||||||
<h2>创建群聊</h2>
|
<h2>创建群聊</h2>
|
||||||
<label>群名称<input autoFocus value={name} maxLength="30" onChange={event => setName(event.target.value)} placeholder="输入群名称" /></label>
|
{/* 参考图 设置昵称(1).png 明确把这同一个字段(group.name)的上限画成 11 字(0/11)——
|
||||||
|
这里原来是 30,跟编辑页的 11 对不上:建群时能起最多 30 字的名字,之后进编辑页
|
||||||
|
却连打字都打不过 11 位,改不回原来的长度。后端本身没有强制 11(今天实测 PATCH 17 字
|
||||||
|
成功),11 纯粹是这一份参考图给的前端约束,创建页应该和它保持一致,而不是反过来放宽
|
||||||
|
编辑页——市面上没有任何参考图支持 30 这个数字。 */}
|
||||||
|
<label>群名称<input autoFocus value={name} maxLength="11" onChange={event => setName(event.target.value)} placeholder="输入群名称" /></label>
|
||||||
<p>创建后可继续邀请成员和设置群资料。</p>
|
<p>创建后可继续邀请成员和设置群资料。</p>
|
||||||
<footer>
|
<footer>
|
||||||
<button type="button" onClick={() => setCreating(false)}>取消</button>
|
<button type="button" onClick={() => setCreating(false)}>取消</button>
|
||||||
@@ -954,6 +959,9 @@ function bytesToGB(bytes) {
|
|||||||
return (bytes / (1024 * 1024 * 1024)).toFixed(2) + ' GB';
|
return (bytes / (1024 * 1024 * 1024)).toFixed(2) + ' GB';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 标题"群昵称"是参考图 设置昵称(1).png 本身的用词(不是笔误)——虽然编辑的其实是 group.name
|
||||||
|
// 这个所有人都看得到的真实群名,跟 MyNicknameEditor("我在本群的昵称",个人在群内的显示名,
|
||||||
|
// 完全不同的字段)概念上容易混,但这是设计稿明确画出来的文案,不是代码猜的,不要改。
|
||||||
function GroupNameEditor({topic, onToast}) {
|
function GroupNameEditor({topic, onToast}) {
|
||||||
const [group, setGroup] = React.useState(null);
|
const [group, setGroup] = React.useState(null);
|
||||||
const [value, setValue] = React.useState('');
|
const [value, setValue] = React.useState('');
|
||||||
|
|||||||
+6
-3
@@ -3536,7 +3536,9 @@ const REASON_MESSAGES = {
|
|||||||
REALNAME_REQUIRED: '需要先完成实名认证',
|
REALNAME_REQUIRED: '需要先完成实名认证',
|
||||||
YOUTH_MODE_RESTRICTED: '青少年模式下无法使用此功能',
|
YOUTH_MODE_RESTRICTED: '青少年模式下无法使用此功能',
|
||||||
RISK_CONFIRMATION_REQUIRED: '需要先完成安全确认',
|
RISK_CONFIRMATION_REQUIRED: '需要先完成安全确认',
|
||||||
RISK_ACTION_BLOCKED: '该操作已被安全策略拦截'
|
RISK_ACTION_BLOCKED: '该操作已被安全策略拦截',
|
||||||
|
CODE_INVALID: '独立密码不正确',
|
||||||
|
TOO_MANY_ATTEMPTS: details => details && details.retry_after_seconds ? `连续输错次数过多,请 ${details.retry_after_seconds} 秒后重试` : '连续输错次数过多,请稍后重试'
|
||||||
};
|
};
|
||||||
function requestId() {
|
function requestId() {
|
||||||
return typeof crypto != 'undefined' && crypto.randomUUID ? crypto.randomUUID() : 'web_' + Date.now().toString(36) + '_' + Math.random().toString(36).slice(2);
|
return typeof crypto != 'undefined' && crypto.randomUUID ? crypto.randomUUID() : 'web_' + Date.now().toString(36) + '_' + Math.random().toString(36).slice(2);
|
||||||
@@ -3598,7 +3600,8 @@ async function imRequest(path, {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
if (!response.ok || payload && payload.code && payload.code !== 0) {
|
if (!response.ok || payload && payload.code && payload.code !== 0) {
|
||||||
const known = payload.reason && REASON_MESSAGES[payload.reason];
|
const entry = payload.reason && REASON_MESSAGES[payload.reason];
|
||||||
|
const known = typeof entry === 'function' ? entry(payload.details) : entry;
|
||||||
throw new ImApiError(known || payload.message || payload.reason || response.statusText || '请求失败', payload.reason, response.status, payload.details);
|
throw new ImApiError(known || payload.message || payload.reason || response.statusText || '请求失败', payload.reason, response.status, payload.details);
|
||||||
}
|
}
|
||||||
return normalizeResponse(payload);
|
return normalizeResponse(payload);
|
||||||
@@ -10851,7 +10854,7 @@ function GroupList({
|
|||||||
children: ["群名称", (0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxDEV)("input", {
|
children: ["群名称", (0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxDEV)("input", {
|
||||||
autoFocus: true,
|
autoFocus: true,
|
||||||
value: name,
|
value: name,
|
||||||
maxLength: "30",
|
maxLength: "11",
|
||||||
onChange: event => setName(event.target.value),
|
onChange: event => setName(event.target.value),
|
||||||
placeholder: "输入群名称"
|
placeholder: "输入群名称"
|
||||||
}, void 0, false)]
|
}, void 0, false)]
|
||||||
|
|||||||
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user