2018-02-01 12:17:04 +00:00
|
|
|
<template>
|
2022-05-04 12:11:36 +00:00
|
|
|
<errors v-if="error" :errorCode="error.status" />
|
2024-09-16 21:01:16 +00:00
|
|
|
<form @submit="save" class="card active">
|
2024-08-24 22:02:33 +00:00
|
|
|
<div class="card-title">
|
|
|
|
<h2 v-if="user.id === 0">{{ $t("settings.newUser") }}</h2>
|
|
|
|
<h2 v-else>{{ $t("settings.user") }} {{ user.username }}</h2>
|
|
|
|
</div>
|
2018-02-01 12:17:04 +00:00
|
|
|
|
2024-08-24 22:02:33 +00:00
|
|
|
<div class="card-content">
|
|
|
|
<user-form
|
|
|
|
:user="user"
|
|
|
|
:createUserDir="createUserDir"
|
|
|
|
:isDefault="false"
|
|
|
|
:isNew="isNew"
|
|
|
|
@update:user="(updatedUser) => (user = updatedUser)"
|
|
|
|
@update:createUserDir="(updatedDir) => (createUserDir = updatedDir)"
|
|
|
|
/>
|
|
|
|
</div>
|
2018-02-01 12:17:04 +00:00
|
|
|
|
2024-08-24 22:02:33 +00:00
|
|
|
<div class="card-action">
|
|
|
|
<button
|
|
|
|
v-if="!isNew"
|
|
|
|
@click.prevent="deletePrompt"
|
|
|
|
type="button"
|
|
|
|
class="button button--flat button--red"
|
|
|
|
:aria-label="$t('buttons.delete')"
|
|
|
|
:title="$t('buttons.delete')"
|
|
|
|
>
|
|
|
|
{{ $t("buttons.delete") }}
|
|
|
|
</button>
|
|
|
|
<input class="button button--flat" type="submit" :value="$t('buttons.save')" />
|
2021-02-19 13:15:46 +00:00
|
|
|
</div>
|
2024-08-24 22:02:33 +00:00
|
|
|
</form>
|
2018-02-01 12:17:04 +00:00
|
|
|
</template>
|
|
|
|
<script>
|
2024-08-24 22:02:33 +00:00
|
|
|
import { mutations, state } from "@/store";
|
2021-03-21 11:51:58 +00:00
|
|
|
import { users as api, settings } from "@/api";
|
2024-07-30 17:45:27 +00:00
|
|
|
import UserForm from "@/components/settings/UserForm.vue";
|
|
|
|
import Errors from "@/views/Errors.vue";
|
2024-09-16 21:01:16 +00:00
|
|
|
import { notify } from "@/notify";
|
2018-02-01 12:17:04 +00:00
|
|
|
|
|
|
|
export default {
|
2021-03-21 11:51:58 +00:00
|
|
|
name: "user",
|
2019-01-05 16:12:09 +00:00
|
|
|
components: {
|
2021-03-21 11:51:58 +00:00
|
|
|
UserForm,
|
2021-04-16 15:07:05 +00:00
|
|
|
Errors,
|
2019-01-05 16:12:09 +00:00
|
|
|
},
|
2023-12-20 20:44:25 +00:00
|
|
|
data() {
|
2018-02-01 12:17:04 +00:00
|
|
|
return {
|
2021-04-16 15:07:05 +00:00
|
|
|
error: null,
|
2018-02-01 12:17:04 +00:00
|
|
|
originalUser: null,
|
2024-09-16 21:01:16 +00:00
|
|
|
user: {
|
|
|
|
scope: ".",
|
|
|
|
username: "",
|
|
|
|
perm: { admin: false },
|
|
|
|
},
|
2023-10-11 01:03:33 +00:00
|
|
|
showDelete: false,
|
2022-06-03 13:59:36 +00:00
|
|
|
createUserDir: false,
|
2021-03-21 11:51:58 +00:00
|
|
|
};
|
2018-02-01 12:17:04 +00:00
|
|
|
},
|
2021-03-21 11:51:58 +00:00
|
|
|
created() {
|
|
|
|
this.fetchData();
|
2018-02-01 12:17:04 +00:00
|
|
|
},
|
2019-01-05 16:12:09 +00:00
|
|
|
computed: {
|
2024-08-24 22:02:33 +00:00
|
|
|
settings() {
|
|
|
|
return state.settings;
|
|
|
|
},
|
2021-03-21 11:51:58 +00:00
|
|
|
isNew() {
|
2024-09-16 21:01:16 +00:00
|
|
|
return state.route.path.startsWith("/settings/users/new");
|
2021-03-21 11:51:58 +00:00
|
|
|
},
|
2019-01-05 16:12:09 +00:00
|
|
|
},
|
2018-02-01 12:17:04 +00:00
|
|
|
methods: {
|
2021-03-21 11:51:58 +00:00
|
|
|
async fetchData() {
|
2024-09-16 21:01:16 +00:00
|
|
|
if (!state.route.path.startsWith("/settings")) {
|
|
|
|
return
|
|
|
|
}
|
2024-08-24 22:02:33 +00:00
|
|
|
mutations.setLoading("users", true);
|
2019-01-05 16:12:09 +00:00
|
|
|
try {
|
|
|
|
if (this.isNew) {
|
2022-06-03 13:59:36 +00:00
|
|
|
let { defaults, createUserDir } = await settings.get();
|
|
|
|
this.createUserDir = createUserDir;
|
2019-01-05 16:12:09 +00:00
|
|
|
this.user = {
|
|
|
|
...defaults,
|
2021-03-21 11:51:58 +00:00
|
|
|
username: "",
|
2024-07-30 17:45:27 +00:00
|
|
|
password: "",
|
2019-01-05 16:12:09 +00:00
|
|
|
rules: [],
|
|
|
|
lockPassword: false,
|
2021-03-21 11:51:58 +00:00
|
|
|
id: 0,
|
|
|
|
};
|
2019-01-05 16:12:09 +00:00
|
|
|
} else {
|
2024-09-16 21:01:16 +00:00
|
|
|
const id = Array.isArray(state.route.params.id)
|
|
|
|
? state.route.params.id.join("")
|
|
|
|
: state.route.params.id;
|
2021-03-21 11:51:58 +00:00
|
|
|
this.user = { ...(await api.get(id)) };
|
2018-02-01 12:17:04 +00:00
|
|
|
}
|
2019-01-05 16:12:09 +00:00
|
|
|
} catch (e) {
|
2024-09-16 21:01:16 +00:00
|
|
|
notify.showError(e);
|
2021-04-16 15:07:05 +00:00
|
|
|
this.error = e;
|
|
|
|
} finally {
|
2024-08-24 22:02:33 +00:00
|
|
|
mutations.setLoading("users", false);
|
2018-02-01 12:17:04 +00:00
|
|
|
}
|
|
|
|
},
|
2021-03-21 11:51:58 +00:00
|
|
|
deletePrompt() {
|
2024-07-30 17:45:27 +00:00
|
|
|
mutations.showHover({ name: "deleteUser", props: { user: this.user } });
|
2018-02-01 12:17:04 +00:00
|
|
|
},
|
2021-03-21 11:51:58 +00:00
|
|
|
async save(event) {
|
2024-09-16 21:01:16 +00:00
|
|
|
let user = this.user
|
2021-03-21 11:51:58 +00:00
|
|
|
event.preventDefault();
|
2019-01-05 16:12:09 +00:00
|
|
|
try {
|
|
|
|
if (this.isNew) {
|
2021-03-21 11:51:58 +00:00
|
|
|
const loc = await api.create(user);
|
|
|
|
this.$router.push({ path: loc });
|
2024-09-16 21:01:16 +00:00
|
|
|
notify.showSuccess(this.$t("settings.userCreated"));
|
2019-01-05 16:12:09 +00:00
|
|
|
} else {
|
2021-03-21 11:51:58 +00:00
|
|
|
await api.update(user);
|
2024-09-16 21:01:16 +00:00
|
|
|
notify.showSuccess(this.$t("settings.userUpdated"));
|
2018-02-01 12:17:04 +00:00
|
|
|
}
|
2019-01-05 16:12:09 +00:00
|
|
|
} catch (e) {
|
2024-09-16 21:01:16 +00:00
|
|
|
notify.showError(e);
|
2018-02-01 12:17:04 +00:00
|
|
|
}
|
2021-03-21 11:51:58 +00:00
|
|
|
},
|
|
|
|
},
|
|
|
|
};
|
2018-02-01 12:17:04 +00:00
|
|
|
</script>
|