haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-16 07:08:55 +00:00
Code Issues Releases Wiki Activity

[share dialog - upload link'] redesigned the 'link details' panel (#6539)

Browse Source
This commit is contained in:
llj
2024-08-12 23:30:15 +08:00
committed by GitHub
parent 58e4e66243
commit 991c8bf478
1 changed files with 64 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

127
frontend/src/components/dialog/generate-upload-link.js
View File

@@ -281,77 +281,78 @@ class GenerateUploadLink extends React.Component {
let sharedUploadInfo = this.state.sharedUploadInfo; let sharedUploadInfo = this.state.sharedUploadInfo;
return ( return (
<div> <div>
<Form className="mb-4"> <dl>
<FormGroup> <dt className="text-secondary font-weight-normal">{gettext('Upload Link')}</dt>
<dt className="text-secondary font-weight-normal">{gettext('Upload Link:')}</dt> <dd>
<dd> <SharedLink
<SharedLink link={sharedUploadInfo.link}
link={sharedUploadInfo.link} linkExpired={sharedUploadInfo.is_expired}
linkExpired={sharedUploadInfo.is_expired} copyLink={this.onCopyUploadLink}
copyLink={this.onCopyUploadLink} />
/> </dd>
</dd>
</FormGroup>
{sharedUploadInfo.password && ( {sharedUploadInfo.password && (
<FormGroup className="mb-0"> <>
<dt className="text-secondary font-weight-normal">{gettext('Password:')}</dt> <dt className="text-secondary font-weight-normal">{gettext('Password')}</dt>
<dd className="d-flex"> <dd>
<div className="d-flex align-items-center"> <InputGroup className="share-link-details-item">
<input id="stored-password" className="border-0 mr-1" type="text" value={this.state.storedPasswordVisible ? sharedUploadInfo.password : '****************************************'} readOnly={true} size={Math.max(sharedUploadInfo.password.length, 10)} /> {this.state.storedPasswordVisible ?
<span <Input type="text" readOnly={true} value={sharedUploadInfo.password} /> :
tabIndex="0" <Input type="text" readOnly={true} value={'***************'} />
role="button" }
aria-label={this.state.storedPasswordVisible ? gettext('Hide') : gettext('Show')} <InputGroupAddon addonType="append">
onKeyDown={this.onIconKeyDown} <Button
onClick={this.toggleStoredPasswordVisible} aria-label={this.state.storedPasswordVisible ? gettext('Hide') : gettext('Show')}
className={`eye-icon sf3-font sf3-font-eye${this.state.storedPasswordVisible ? '' : '-slash'}`} onClick={this.toggleStoredPasswordVisible}
> className={`link-operation-icon eye-icon sf3-font sf3-font-eye${this.state.storedPasswordVisible ? '' : '-slash'}`}
</span> >
</div> </Button>
</InputGroupAddon>
</InputGroup>
</dd> </dd>
</FormGroup> </>
)} )}
{sharedUploadInfo.expire_date && ( {sharedUploadInfo.expire_date && (
<FormGroup className="mb-0"> <>
<dt className="text-secondary font-weight-normal">{gettext('Expiration Date:')}</dt> <dt className="text-secondary font-weight-normal">{gettext('Expiration Date')}</dt>
{!this.state.isEditingExpiration && <dd>
<dd style={{ width: '250px' }} onMouseEnter={this.handleMouseOverExpirationEditIcon} onMouseLeave={this.handleMouseOutExpirationEditIcon}> {this.state.isEditingExpiration ? (
{moment(sharedUploadInfo.expire_date).format('YYYY-MM-DD HH:mm:ss')} <div className="ml-4">
{this.state.isExpirationEditIconShow && ( <SetLinkExpiration
<a href="#" minDays={uploadLinkExpireDaysMin}
role="button" maxDays={uploadLinkExpireDaysMax}
aria-label={gettext('Edit')} defaultDays={uploadLinkExpireDaysDefault}
title={gettext('Edit')} expType={this.state.expType}
className="sf3-font sf3-font-rename attr-action-icon" setExpType={this.setExpType}
onClick={this.editExpirationToggle}> expireDays={this.state.expireDays}
</a> onExpireDaysChanged={this.onExpireDaysChanged}
)} expDate={this.state.expDate}
</dd> onExpDateChanged={this.onExpDateChanged}
} />
{this.state.isEditingExpiration && <div className={this.state.expType == 'by-days' ? 'mt-2' : 'mt-3'}>
<div className="ml-4"> <button className="btn btn-primary mr-2" onClick={this.updateExpiration}>{gettext('Update')}</button>
<SetLinkExpiration <button className="btn btn-secondary" onClick={this.editExpirationToggle}>{gettext('Cancel')}</button>
minDays={uploadLinkExpireDaysMin} </div>
maxDays={uploadLinkExpireDaysMax}
defaultDays={uploadLinkExpireDaysDefault}
expType={this.state.expType}
setExpType={this.setExpType}
expireDays={this.state.expireDays}
onExpireDaysChanged={this.onExpireDaysChanged}
expDate={this.state.expDate}
onExpDateChanged={this.onExpDateChanged}
/>
<div className={this.state.expType == 'by-days' ? 'mt-2' : 'mt-3'}>
<button className="btn btn-primary mr-2" onClick={this.updateExpiration}>{gettext('Update')}</button>
<button className="btn btn-secondary" onClick={this.editExpirationToggle}>{gettext('Cancel')}</button>
</div> </div>
</div> ) : (
} <InputGroup className="share-link-details-item">
</FormGroup> <Input type="text" readOnly={true} value={moment(sharedUploadInfo.expire_date).format('YYYY-MM-DD HH:mm:ss')} />
<InputGroupAddon addonType="append">
<Button
aria-label={gettext('Edit')}
title={gettext('Edit')}
className="link-operation-icon sf3-font sf3-font-rename"
onClick={this.editExpirationToggle}
>
</Button>
</InputGroupAddon>
</InputGroup>
)}
</dd>
</>
)} )}
</Form> </dl>
{canSendShareLinkEmail && !isSendLinkShown && <Button onClick={this.toggleSendLink} className="mr-2">{gettext('Send')}</Button>} {canSendShareLinkEmail && !isSendLinkShown && <Button onClick={this.toggleSendLink} className="mr-2">{gettext('Send')}</Button>}
{!isSendLinkShown && <Button onClick={this.deleteUploadLink}>{gettext('Delete')}</Button>} {!isSendLinkShown && <Button onClick={this.deleteUploadLink}>{gettext('Delete')}</Button>}
{isSendLinkShown && {isSendLinkShown &&