forked from verdnatura/salix-front
Add department basic data
This commit is contained in:
parent
2e09fbd968
commit
893b1bb4c8
|
|
@ -58,7 +58,7 @@ const $props = defineProps({
|
|||
mapper: {
|
||||
type: Function,
|
||||
default: null,
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
const emit = defineEmits(['onFetch', 'onDataSaved']);
|
||||
|
|
@ -129,7 +129,7 @@ async function save() {
|
|||
isLoading.value = true;
|
||||
|
||||
try {
|
||||
const body = $props.mapper ? $props.mapper(formData.value) : formData.value
|
||||
const body = $props.mapper ? $props.mapper(formData.value) : formData.value;
|
||||
if ($props.urlCreate) {
|
||||
await axios.post($props.urlCreate, body);
|
||||
notify('globals.dataCreated', 'positive');
|
||||
|
|
@ -179,11 +179,14 @@ watch(formUrl, async () => {
|
|||
});
|
||||
</script>
|
||||
<template>
|
||||
<QBanner v-if="$props.observeFormChanges && hasChanges" class="text-white bg-warning">
|
||||
<QBanner
|
||||
v-if="$props.observeFormChanges && hasChanges"
|
||||
class="text-white bg-warning full-width"
|
||||
>
|
||||
<QIcon name="warning" size="md" class="q-mr-md" />
|
||||
<span>{{ t('globals.changesToSave') }}</span>
|
||||
</QBanner>
|
||||
<div class="column items-center">
|
||||
<div class="column items-center full-width">
|
||||
<QForm
|
||||
v-if="formData"
|
||||
@submit="save"
|
||||
|
|
|
|||
|
|
@ -610,7 +610,6 @@ export default {
|
|||
department: 'Department',
|
||||
summary: 'Summary',
|
||||
},
|
||||
basicData: 'Basic data',
|
||||
name: 'Name',
|
||||
code: 'Code',
|
||||
chat: 'Chat',
|
||||
|
|
|
|||
|
|
@ -610,7 +610,6 @@ export default {
|
|||
department: 'Departamentos',
|
||||
summary: 'Resumen',
|
||||
},
|
||||
basicData: 'Datos básicos',
|
||||
name: 'Nombre',
|
||||
code: 'Código',
|
||||
chat: 'Chat',
|
||||
|
|
|
|||
|
|
@ -1,3 +1,135 @@
|
|||
<script setup></script>
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
<template>Department basic data</template>
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import FormModel from 'components/FormModel.vue';
|
||||
import VnRow from 'components/ui/VnRow.vue';
|
||||
import VnInput from 'src/components/common/VnInput.vue';
|
||||
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
|
||||
|
||||
const route = useRoute();
|
||||
const { t } = useI18n();
|
||||
|
||||
const workersOptions = ref([]);
|
||||
const clientsOptions = ref([]);
|
||||
</script>
|
||||
<template>
|
||||
<fetch-data
|
||||
url="Workers/search"
|
||||
@on-fetch="(data) => (workersOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
<fetch-data url="Clients" @on-fetch="(data) => (clientsOptions = data)" auto-load />
|
||||
<FormModel
|
||||
:url="`Departments/${route.params.id}`"
|
||||
model="department"
|
||||
auto-load
|
||||
class="full-width"
|
||||
>
|
||||
<template #form="{ data, validate }">
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnInput
|
||||
:label="t('department.name')"
|
||||
v-model="data.name"
|
||||
:rules="validate('department.name')"
|
||||
clearable
|
||||
autofocus
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnInput
|
||||
v-model="data.code"
|
||||
:label="t('department.code')"
|
||||
:rules="validate('department.code')"
|
||||
clearable
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnInput
|
||||
:label="t('department.chat')"
|
||||
v-model="data.chatName"
|
||||
:rules="validate('department.chat')"
|
||||
clearable
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnInput
|
||||
v-model="data.notificationEmail"
|
||||
:label="t('department.email')"
|
||||
:rules="validate('department.email')"
|
||||
clearable
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('department.bossDepartment')"
|
||||
v-model="data.workerFk"
|
||||
:options="workersOptions"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
hide-selected
|
||||
map-options
|
||||
:rules="validate('department.workerFk')"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('department.selfConsumptionCustomer')"
|
||||
v-model="data.clientFk"
|
||||
:options="clientsOptions"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
hide-selected
|
||||
map-options
|
||||
:rules="validate('department.clientFk')"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QCheckbox
|
||||
:label="t('department.telework')"
|
||||
v-model="data.isTeleworking"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<QCheckbox
|
||||
:label="t('department.notifyOnErrors')"
|
||||
v-model="data.hasToMistake"
|
||||
:false-value="0"
|
||||
:true-value="1"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QCheckbox
|
||||
:label="t('department.worksInProduction')"
|
||||
v-model="data.isProduction"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<QCheckbox
|
||||
:label="t('department.hasToRefill')"
|
||||
v-model="data.hasToRefill"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QCheckbox
|
||||
:label="t('department.hasToSendMail')"
|
||||
v-model="data.hasToSendMail"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
</template>
|
||||
</FormModel>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -26,9 +26,3 @@ const stateStore = useStateStore();
|
|||
</QPage>
|
||||
</QPageContainer>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Search worker: Buscar trabajador
|
||||
You can search by worker id or name: Puedes buscar por id o nombre del trabajador
|
||||
</i18n>
|
||||
|
|
|
|||
Loading…
Reference in New Issue