0
0
Fork 0
salix-front-mindshore-fork2/src/pages/Supplier/SupplierCreate.vue

70 lines
1.8 KiB
Vue

<script setup>
import { useI18n } from 'vue-i18n';
import { ref } from 'vue';
import suppliersService from 'src/services/suppliers.service';
import { useRouter } from 'vue-router';
import { useStateStore } from 'stores/useStateStore';
import VnSearchbar from 'components/ui/VnSearchbar.vue';
const { t } = useI18n();
const router = useRouter();
const stateStore = useStateStore();
const newSupplierName = ref();
const createSupplier = async () => {
const params = { name: newSupplierName.value };
const response = await suppliersService.createSupplier(params);
if (response.status === 200) router.push({ path: `/supplier/${response.data.id}` });
};
</script>
<template>
<template v-if="stateStore.isHeaderMounted()">
<Teleport to="#searchbar">
<VnSearchbar
data-key="SuppliersList"
:limit="20"
:label="t('Search suppliers')"
/>
</Teleport>
</template>
<QPage class="q-pa-md">
<QForm
@submit="createSupplier()"
class="text-white q-mx-auto"
style="max-width: 800px"
>
<QCard class="card">
<QInput
v-model="newSupplierName"
:label="t('supplier.create.supplierName')"
class="full-width"
/>
</QCard>
<QBtn
:label="t('globals.create')"
type="submit"
color="primary"
class="q-mt-md"
/>
<QBtn :label="t('globals.cancel')" class="q-mt-md" flat />
</QForm>
</QPage>
</template>
<style lang="scss" scoped>
.card {
display: flex;
justify-content: center;
width: 100%;
background-color: #292929;
padding: 40px;
}
</style>
<i18n>
</i18n>