nikdoof/rustical
1
1
Fork 0
mirror of https://github.com/lennart-k/rustical.git synced 2025-12-14 04:42:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

frontend: tiny improvement to import forms

Browse Source
This commit is contained in:
Lennart
2025-12-11 20:17:04 +01:00
parent 1b2296c00a
commit 1230e29243
5 changed files with 29 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
crates/frontend/js-components/lib/import-addressbook-form.ts
View File

@@ -32,23 +32,25 @@ export class ImportAddressbookForm extends LitElement {
<form @submit=${this.submit} ${ref(this.form)}> <form @submit=${this.submit} ${ref(this.form)}>
<label> <label>
principal (for group addressbook) principal (for group addressbook)
<select name="principal" value=${this.user} @change=${e => this.principal = e.target.value}> <select name="principal" required .value=${this.user} @change=${e => this.principal = e.target.value}>
<option value=${this.user}>${this.user}</option> <option .value=${this.user}>${this.user}</option>
${window.rusticalUser.memberships.map(membership => html` ${window.rusticalUser.memberships.map(membership => html`
<option value=${membership}>${membership}</option> <option .value=${membership}>${membership}</option>
`)} `)}
</select> </select>
</label> </label>
<br> <br>
<label> <label>
id id
<input type="text" name="id" value=${this.addressbook_id} @change=${e => this.addressbook_id = e.target.value} /> <input type="text" required .value=${this.addressbook_id} @change=${e => this.addressbook_id = e.target.value} />
</label> </label>
<br> <br>
<label> <label>
file file
<input type="file" accept="text/vcard" name="file" @change=${e => this.file = e.target.files[0]} /> <input type="file" accept="text/vcard" required @change=${e => this.file = e.target.files[0]} />
</label> </label>
<br>
<br>
<button type="submit">Import</button> <button type="submit">Import</button>
<button type="submit" @click=${event => { event.preventDefault(); this.dialog.value.close(); this.form.value.reset() }} class="cancel">Cancel</button> <button type="submit" @click=${event => { event.preventDefault(); this.dialog.value.close(); this.form.value.reset() }} class="cancel">Cancel</button>
</form> </form>

12
crates/frontend/js-components/lib/import-calendar-form.ts
View File

@@ -32,23 +32,25 @@ export class ImportCalendarForm extends LitElement {
<form @submit=${this.submit} ${ref(this.form)}> <form @submit=${this.submit} ${ref(this.form)}>
<label> <label>
principal (for group calendars) principal (for group calendars)
<select name="principal" value=${this.user} @change=${e => this.principal = e.target.value}> <select name="principal" required .value=${this.user} @change=${e => this.principal = e.target.value}>
<option value=${this.user}>${this.user}</option> <option .value=${this.user}>${this.user}</option>
${window.rusticalUser.memberships.map(membership => html` ${window.rusticalUser.memberships.map(membership => html`
<option value=${membership}>${membership}</option> <option .value=${membership}>${membership}</option>
`)} `)}
</select> </select>
</label> </label>
<br> <br>
<label> <label>
id id
<input type="text" name="id" value=${this.cal_id} @change=${e => this.cal_id = e.target.value} /> <input type="text" required .value=${this.cal_id} @change=${e => this.cal_id = e.target.value} />
</label> </label>
<br> <br>
<label> <label>
file file
<input type="file" accept="text/calendar" name="file" @change=${e => this.file = e.target.files[0]} /> <input type="file" required accept="text/calendar" @change=${e => this.file = e.target.files[0]} />
</label> </label>
<br>
<br>
<button type="submit">Import</button> <button type="submit">Import</button>
<button type="submit" @click=${event => { event.preventDefault(); this.dialog.value.close(); this.form.value.reset() }} class="cancel">Cancel</button> <button type="submit" @click=${event => { event.preventDefault(); this.dialog.value.close(); this.form.value.reset() }} class="cancel">Cancel</button>
</form> </form>

12
crates/frontend/public/assets/js/import-addressbook-form.mjs
View File

@@ -30,23 +30,25 @@ let ImportAddressbookForm = class extends i {
<form @submit=${this.submit} ${n(this.form)}> <form @submit=${this.submit} ${n(this.form)}>
<label> <label>
principal (for group addressbook) principal (for group addressbook)
<select name="principal" value=${this.user} @change=${(e2) => this.principal = e2.target.value}> <select name="principal" required .value=${this.user} @change=${(e2) => this.principal = e2.target.value}>
<option value=${this.user}>${this.user}</option> <option .value=${this.user}>${this.user}</option>
${window.rusticalUser.memberships.map((membership) => x` ${window.rusticalUser.memberships.map((membership) => x`
<option value=${membership}>${membership}</option> <option .value=${membership}>${membership}</option>
`)} `)}
</select> </select>
</label> </label>
<br> <br>
<label> <label>
id id
<input type="text" name="id" value=${this.addressbook_id} @change=${(e2) => this.addressbook_id = e2.target.value} /> <input type="text" required .value=${this.addressbook_id} @change=${(e2) => this.addressbook_id = e2.target.value} />
</label> </label>
<br> <br>
<label> <label>
file file
<input type="file" accept="text/vcard" name="file" @change=${(e2) => this.file = e2.target.files[0]} /> <input type="file" accept="text/vcard" required @change=${(e2) => this.file = e2.target.files[0]} />
</label> </label>
<br>
<br>
<button type="submit">Import</button> <button type="submit">Import</button>
<button type="submit" @click=${(event) => { <button type="submit" @click=${(event) => {
event.preventDefault(); event.preventDefault();

12
crates/frontend/public/assets/js/import-calendar-form.mjs
View File

@@ -30,23 +30,25 @@ let ImportCalendarForm = class extends i {
<form @submit=${this.submit} ${n(this.form)}> <form @submit=${this.submit} ${n(this.form)}>
<label> <label>
principal (for group calendars) principal (for group calendars)
<select name="principal" value=${this.user} @change=${(e2) => this.principal = e2.target.value}> <select name="principal" required .value=${this.user} @change=${(e2) => this.principal = e2.target.value}>
<option value=${this.user}>${this.user}</option> <option .value=${this.user}>${this.user}</option>
${window.rusticalUser.memberships.map((membership) => x` ${window.rusticalUser.memberships.map((membership) => x`
<option value=${membership}>${membership}</option> <option .value=${membership}>${membership}</option>
`)} `)}
</select> </select>
</label> </label>
<br> <br>
<label> <label>
id id
<input type="text" name="id" value=${this.cal_id} @change=${(e2) => this.cal_id = e2.target.value} /> <input type="text" required .value=${this.cal_id} @change=${(e2) => this.cal_id = e2.target.value} />
</label> </label>
<br> <br>
<label> <label>
file file
<input type="file" accept="text/calendar" name="file" @change=${(e2) => this.file = e2.target.files[0]} /> <input type="file" required accept="text/calendar" @change=${(e2) => this.file = e2.target.files[0]} />
</label> </label>
<br>
<br>
<button type="submit">Import</button> <button type="submit">Import</button>
<button type="submit" @click=${(event) => { <button type="submit" @click=${(event) => {
event.preventDefault(); event.preventDefault();

1
crates/frontend/public/assets/style.css
View File

@@ -341,6 +341,7 @@ form {
input[type="url"], input[type="url"],
input[type="password"], input[type="password"],
input[type="color"], input[type="color"],
input[type="file"],
textarea, textarea,
select { select {
width: 100%; width: 100%;