verdnatura/salix-front
verdnatura
/
salix-front
2
3
Fork 1
Code Issues Pull Requests 85 Releases Wiki Activity

refactor: simplify code
gitea/salix-front/pipeline/pr-dev This commit looks good Details

This commit is contained in:
Alex Moreno 2024-06-18 10:53:21 +02:00
parent cd8e99e1df
commit ae75908e46
3 changed files with 78 additions and 133 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

104
src/pages/Account/AccountCreate.vue
View File

@ -4,7 +4,6 @@ import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import FormModelPopup from 'components/FormModelPopup.vue'; import FormModelPopup from 'components/FormModelPopup.vue';
import VnRow from 'components/ui/VnRow.vue';
import VnSelect from 'src/components/common/VnSelect.vue'; import VnSelect from 'src/components/common/VnSelect.vue';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import VnInput from 'src/components/common/VnInput.vue'; import VnInput from 'src/components/common/VnInput.vue';
@ -29,7 +28,6 @@ const redirectToAccountBasicData = (_, { id }) => {
@on-fetch="(data) => (rolesOptions = data)" @on-fetch="(data) => (rolesOptions = data)"
auto-load auto-load
/> />
<FormModelPopup <FormModelPopup
:title="t('account.card.newUser')" :title="t('account.card.newUser')"
url-create="VnUsers" url-create="VnUsers"
@ -38,68 +36,46 @@ const redirectToAccountBasicData = (_, { id }) => {
@on-data-saved="redirectToAccountBasicData" @on-data-saved="redirectToAccountBasicData"
> >
<template #form-inputs="{ data, validate }"> <template #form-inputs="{ data, validate }">
<VnRow class="row q-gutter-md q-mb-md"> <div class="column q-gutter-sm">
<div class="col"> <VnInput
<VnInput v-model="data.name"
v-model="data.name" :label="t('account.create.name')"
:label="t('account.create.name')" :rules="validate('VnUser.name')"
:rules="validate('VnUser.name')" />
/> <VnInput
</div> v-model="data.nickname"
</VnRow> :label="t('account.create.nickname')"
<VnRow class="row q-gutter-md q-mb-md"> :rules="validate('VnUser.nickname')"
<div class="col"> />
<VnInput <VnInput
v-model="data.nickname" v-model="data.email"
:label="t('account.create.nickname')" :label="t('account.create.email')"
:rules="validate('VnUser.nickname')" type="email"
/> :rules="validate('VnUser.email')"
</div> />
</VnRow> <VnSelect
<VnRow class="row q-gutter-md q-mb-md"> :label="t('account.create.role')"
<div class="col"> v-model="data.roleFk"
<VnInput :options="rolesOptions"
v-model="data.email" option-value="id"
:label="t('account.create.email')" option-label="name"
type="email" map-options
:rules="validate('VnUser.email')" hide-selected
/> :rules="validate('VnUser.roleFk')"
</div> />
</VnRow> <VnInput
<VnRow class="row q-gutter-md q-mb-md"> v-model="data.password"
<div class="col"> :label="t('account.create.password')"
<VnSelect type="password"
:label="t('account.create.role')" :rules="validate('VnUser.password')"
v-model="data.roleFk" />
:options="rolesOptions" <QCheckbox
option-value="id" :label="t('account.create.active')"
option-label="name" v-model="data.active"
map-options :toggle-indeterminate="false"
hide-selected :rules="validate('VnUser.active')"
:rules="validate('VnUser.roleFk')" />
/> </div>
</div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<VnInput
v-model="data.password"
:label="t('account.create.password')"
type="password"
:rules="validate('VnUser.password')"
/>
</div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<QCheckbox
:label="t('account.create.active')"
v-model="data.active"
:toggle-indeterminate="false"
:rules="validate('VnUser.active')"
/>
</div>
</VnRow>
</template> </template>
</FormModelPopup> </FormModelPopup>
</template> </template>

34
src/pages/Account/Card/AccountBasicData.vue
View File

@ -33,30 +33,16 @@ watch(
@on-data-saved="formModelRef.fetch()" @on-data-saved="formModelRef.fetch()"
> >
<template #form="{ data }"> <template #form="{ data }">
<VnRow class="row q-gutter-md q-mb-md"> <div class="q-gutter-y-sm">
<div class="col"> <VnInput v-model="data.name" :label="t('account.card.nickname')" />
<VnInput v-model="data.name" :label="t('account.card.nickname')" /> <VnInput v-model="data.nickname" :label="t('account.card.alias')" />
</div> <VnInput v-model="data.email" :label="t('account.card.email')" />
</VnRow> <VnSelect
<VnRow class="row q-gutter-md q-mb-md"> v-model="data.lang"
<div class="col"> :options="['es', 'en']"
<VnInput v-model="data.nickname" :label="t('account.card.alias')" /> :label="t('account.card.lang')"
</div> />
</VnRow> </div>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<VnInput v-model="data.email" :label="t('account.card.email')" />
</div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<VnSelect
v-model="data.lang"
:options="['es', 'en']"
:label="t('account.card.lang')"
/>
</div>
</VnRow>
</template> </template>
</FormModel> </FormModel>
</template> </template>

73
src/pages/Account/Card/AccountPrivileges.vue
View File

@ -1,24 +1,17 @@
<script setup> <script setup>
import { ref, watch } from 'vue'; import { ref } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import VnRow from 'components/ui/VnRow.vue';
import FormModel from 'components/FormModel.vue'; import FormModel from 'components/FormModel.vue';
import VnSelect from 'src/components/common/VnSelect.vue'; import VnSelect from 'src/components/common/VnSelect.vue';
const { t } = useI18n(); const { t } = useI18n();
const route = useRoute(); const route = useRoute();
const loading = ref(false);
const rolesOptions = ref([]); const rolesOptions = ref([]);
const formModelRef = ref(null); const formModelRef = ref();
watch(
() => route.params.id,
() => formModelRef.value.reset()
);
</script> </script>
<template> <template>
<FetchData <FetchData
@ -27,40 +20,30 @@ watch(
auto-load auto-load
@on-fetch="(data) => (rolesOptions = data)" @on-fetch="(data) => (rolesOptions = data)"
/> />
<div class="flex justify-center"> <FormModel
<QSpinner v-if="loading" color="primary" size="md" /> ref="formModelRef"
<FormModel model="AccountPrivileges"
v-else :url="`VnUsers/${route.params.id}`"
ref="formModelRef" :url-create="`VnUsers/${route.params.id}/privileges`"
model="AccountPrivileges" auto-load
:url="`VnUsers/${route.params.id}`" @on-data-saved="formModelRef.fetch()"
:url-create="`VnUsers/${route.params.id}/privileges`" >
auto-load <template #form="{ data }">
@on-data-saved="formModelRef.fetch()" <div class="q-gutter-y-sm">
> <QCheckbox
<template #form="{ data }"> v-model="data.hasGrant"
<VnRow class="row q-gutter-md q-mb-md"> :label="t('account.card.privileges.delegate')"
<div class="col"> />
<QCheckbox <VnSelect
v-model="data.hasGrant" :label="t('account.card.role')"
:label="t('account.card.privileges.delegate')" v-model="data.roleFk"
/> :options="rolesOptions"
</div> option-value="id"
</VnRow> option-label="name"
<VnRow class="row q-gutter-md q-mb-md"> hide-selected
<div class="col"> :required="true"
<VnSelect />
:label="t('account.card.role')" </div>
v-model="data.roleFk" </template>
:options="rolesOptions" </FormModel>
option-value="id"
option-label="name"
hide-selected
:required="true"
/>
</div>
</VnRow>
</template>
</FormModel>
</div>
</template> </template>