样式优化

This commit is contained in:
yj 2024-10-12 17:07:22 +08:00
parent 10097e70a7
commit 99c421864b
2 changed files with 95 additions and 67 deletions

View File

@ -152,4 +152,20 @@
letter-spacing: 0;
}
}
}
.createRoom {
>div {
display: flex;
align-items: center;
margin-bottom: 14px;
>span {
color: white;
flex-shrink: 0;
font-size: 14px;
text-align: right;
width: 70px;
}
}
}

View File

@ -345,79 +345,91 @@ const Index: React.FC = () => {
</div>
<Modal title={isCreateRoom ? '新建会议室' : '修改会议信息'} open={createRoomModal} footer={null} closable={false} centered width={'400px'}>
<div>
<div>
{isCreateRoom ? <Input
placeholder="请输入房间号"
style={{ marginBottom: '14px' }}
className={styles.letterSpacing}
showCount
maxLength={8}
value={createRoomFrom.roomNum}
onChange={(e) => {
const regex = /^[0-9]*$/;
if (regex.test(e.target.value)) {
setCreateRoomFrom({
...createRoomFrom,
roomNum: e.target.value
})
}
}}
suffix={
<span
style={{ color: '#47D3D0', cursor: 'pointer' }}
onClick={() => {
function generateTimestampWithRandom(): string {
const timestamp = new Date().getTime();
const lastSixDigits = timestamp.toString().slice(-6);
const randomTwoDigits = ('0' + Math.floor(Math.random() * 100)).slice(-2);
return lastSixDigits + randomTwoDigits;
}
<div className={styles.createRoom}>
{isCreateRoom ? <div>
<span></span>
<Input
placeholder="请输入房间号"
style={{ flexGrow: 1 }}
className={styles.letterSpacing}
showCount
maxLength={8}
value={createRoomFrom.roomNum}
onChange={(e) => {
const regex = /^[0-9]*$/;
if (regex.test(e.target.value)) {
setCreateRoomFrom({
...createRoomFrom,
roomNum: generateTimestampWithRandom(),
roomNum: e.target.value
})
}}
>
</span>
}
/> : null}
<Input.TextArea
placeholder="请输入房间名字"
style={{ marginBottom: '14px' }}
showCount
maxLength={30}
value={createRoomFrom.roomName}
onChange={(e) => {
setCreateRoomFrom({
...createRoomFrom,
roomName: e.target.value
})
}}
autoSize />
<Input
placeholder="请输入届"
style={{ marginBottom: '14px' }}
value={createRoomFrom.year}
onChange={(e) => {
const regex = /^[0-9]*$/;
if (regex.test(e.target.value)) {
}
}}
suffix={
<span
style={{ color: '#47D3D0', cursor: 'pointer' }}
onClick={() => {
function generateTimestampWithRandom(): string {
const timestamp = new Date().getTime();
const lastSixDigits = timestamp.toString().slice(-6);
const randomTwoDigits = ('0' + Math.floor(Math.random() * 100)).slice(-2);
return lastSixDigits + randomTwoDigits;
}
setCreateRoomFrom({
...createRoomFrom,
roomNum: generateTimestampWithRandom(),
})
}}
>
</span>
}
/>
</div> : null}
<div>
<span></span>
<Input.TextArea
placeholder="请输入房间名字"
style={{ flexGrow: 1 }}
showCount
maxLength={30}
value={createRoomFrom.roomName}
onChange={(e) => {
setCreateRoomFrom({
...createRoomFrom,
year: e.target.value
roomName: e.target.value
})
}
}}
/>
<Select
placeholder='请选择学科'
style={{ width: '100%', marginBottom: '14px' }}
options={subjectList}
value={createRoomFrom.subject} onChange={(e) => {
setCreateRoomFrom({
...createRoomFrom,
subject: e
})
}} />
}}
autoSize />
</div>
<div>
<span></span>
<Input
placeholder="请输入届"
style={{ flexGrow: 1 }}
value={createRoomFrom.year}
onChange={(e) => {
const regex = /^[0-9]*$/;
if (regex.test(e.target.value)) {
setCreateRoomFrom({
...createRoomFrom,
year: e.target.value
})
}
}}
/>
</div>
<div>
<span></span>
<Select
placeholder='请选择学科'
style={{ flexGrow: 1 }}
options={subjectList}
value={createRoomFrom.subject} onChange={(e) => {
setCreateRoomFrom({
...createRoomFrom,
subject: e
})
}} />
</div>
</div>
<div style={{
display: 'flex', justifyContent: 'center'