fix(mileage): 修复车牌多选弹窗手机端右侧溢出与粘贴行为
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
- 弹窗改为 right-0 锚右,宽度 min(280px, vw-24px),避免在窄列触发器下右侧溢出 - 移除 onPaste 自动 apply(避免与已输入文本拼接出非预期 token),改为粘贴入框 + 点击「添加」或 Cmd/Ctrl+Enter 确认 - placeholder 文案补充提示 Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -103,23 +103,22 @@ export default function PlateMultiSelect({ allPlates, selected, onChange, placeh
|
|||||||
initial={{ opacity: 0, y: -5 }}
|
initial={{ opacity: 0, y: -5 }}
|
||||||
animate={{ opacity: 1, y: 0 }}
|
animate={{ opacity: 1, y: 0 }}
|
||||||
exit={{ opacity: 0, y: -5 }}
|
exit={{ opacity: 0, y: -5 }}
|
||||||
className="absolute z-50 left-0 right-0 mt-1 bg-white border border-slate-100 rounded-xl shadow-xl w-[280px] max-w-[calc(100vw-32px)]"
|
className="absolute z-50 right-0 mt-1 bg-white border border-slate-100 rounded-xl shadow-xl"
|
||||||
style={{ minWidth: '100%' }}
|
style={{ width: 'min(280px, calc(100vw - 24px))', minWidth: '100%' }}
|
||||||
>
|
>
|
||||||
<div className="p-2 space-y-2">
|
<div className="p-2 space-y-2">
|
||||||
<textarea
|
<textarea
|
||||||
value={text}
|
value={text}
|
||||||
onChange={(e) => setText(e.target.value)}
|
onChange={(e) => setText(e.target.value)}
|
||||||
onPaste={(e) => {
|
placeholder="粘贴或输入车牌 支持换行/逗号/空格分隔,回车或点添加确认"
|
||||||
const pasted = e.clipboardData.getData('text');
|
|
||||||
if (pasted && /[\s,;,;、]/.test(pasted)) {
|
|
||||||
e.preventDefault();
|
|
||||||
apply(text + (text ? ' ' : '') + pasted);
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
placeholder="粘贴或输入车牌 支持换行/逗号/空格分隔"
|
|
||||||
className="w-full bg-slate-50 border-none rounded-lg p-2 text-[11px] text-slate-700 outline-none focus:ring-1 focus:ring-blue-500/30 resize-none"
|
className="w-full bg-slate-50 border-none rounded-lg p-2 text-[11px] text-slate-700 outline-none focus:ring-1 focus:ring-blue-500/30 resize-none"
|
||||||
rows={3}
|
rows={3}
|
||||||
|
onKeyDown={(e) => {
|
||||||
|
if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) {
|
||||||
|
e.preventDefault();
|
||||||
|
apply(text);
|
||||||
|
}
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
<div className="flex justify-between items-center">
|
<div className="flex justify-between items-center">
|
||||||
<span className="text-[10px] text-slate-400">已选 <span className="font-bold text-blue-600">{selected.length}</span> 个</span>
|
<span className="text-[10px] text-slate-400">已选 <span className="font-bold text-blue-600">{selected.length}</span> 个</span>
|
||||||
|
|||||||
Reference in New Issue
Block a user