Added claim RMA section
gitea/salix-front/pipeline/head There was a failure building this commit
Details
gitea/salix-front/pipeline/head There was a failure building this commit
Details
This commit is contained in:
parent
c0454ed3e8
commit
2363ab4670
|
@ -33,6 +33,7 @@ const $props = defineProps({
|
|||
});
|
||||
|
||||
defineEmits(['onNavigate']);
|
||||
defineExpose({ fetch });
|
||||
|
||||
const isLoading = ref(false);
|
||||
const hasMoreData = ref(false);
|
||||
|
|
|
@ -166,8 +166,10 @@ export default {
|
|||
claims: 'Claims',
|
||||
list: 'List',
|
||||
createClaim: 'Create claim',
|
||||
rmaList: 'RMA',
|
||||
summary: 'Summary',
|
||||
basicData: 'Basic Data'
|
||||
basicData: 'Basic Data',
|
||||
rma: 'RMA'
|
||||
},
|
||||
list: {
|
||||
customer: 'Customer',
|
||||
|
@ -206,6 +208,7 @@ export default {
|
|||
state: 'State',
|
||||
packages: 'Packages',
|
||||
picked: 'Picked',
|
||||
returnOfMaterial: 'Return of material authorization (RMA)'
|
||||
},
|
||||
},
|
||||
components: {
|
||||
|
|
|
@ -190,6 +190,7 @@ export default {
|
|||
state: 'Estado',
|
||||
packages: 'Bultos',
|
||||
picked: 'Recogida',
|
||||
returnOfMaterial: 'Autorización de retorno de materiales (RMA)'
|
||||
},
|
||||
summary: {
|
||||
customer: 'Cliente',
|
||||
|
|
|
@ -3,7 +3,7 @@ import Navbar from 'src/components/Navbar.vue';
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<q-layout view="hHh lpR fFf">
|
||||
<q-layout view="hHh LpR fFf">
|
||||
<Navbar />
|
||||
<router-view></router-view>
|
||||
</q-layout>
|
||||
|
|
|
@ -208,6 +208,13 @@ function onReset() {
|
|||
:rules="validate('claim.packages')"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<q-input
|
||||
v-model="claim.rma"
|
||||
:label="t('claim.basicData.returnOfMaterial')"
|
||||
:rules="validate('claim.rma')"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
|
|
|
@ -153,11 +153,17 @@ function stateColor(code) {
|
|||
</q-item-section>
|
||||
<q-item-section>{{ t('claim.pageTitles.basicData') }}</q-item-section>
|
||||
</q-item>
|
||||
<q-item :to="{ name: 'ClaimRma' }" clickable v-ripple>
|
||||
<q-item-section avatar>
|
||||
<q-icon name="vn:barcode" />
|
||||
</q-item-section>
|
||||
<q-item-section>{{ t('claim.pageTitles.rma') }}</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-scroll-area>
|
||||
</q-drawer>
|
||||
<q-page-container>
|
||||
<router-view></router-view>
|
||||
<router-view v-if="claim.id" :claim="claim"></router-view>
|
||||
</q-page-container>
|
||||
</template>
|
||||
|
||||
|
|
|
@ -0,0 +1,80 @@
|
|||
<script setup>
|
||||
import { onMounted } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
// import { useQuasar } from 'quasar';
|
||||
// import axios from 'axios';
|
||||
import SmartCard from 'src/components/SmartCard.vue';
|
||||
|
||||
onMounted(() => fetch());
|
||||
|
||||
const $props = defineProps({
|
||||
claim: {
|
||||
type: Object,
|
||||
required: true,
|
||||
},
|
||||
});
|
||||
|
||||
const filter = {
|
||||
where: {
|
||||
code: $props.claim.rma,
|
||||
},
|
||||
};
|
||||
|
||||
function fetch() {
|
||||
//console.log($props.claim);
|
||||
}
|
||||
|
||||
// const route = useRoute();
|
||||
// const quasar = useQuasar();
|
||||
const { t } = useI18n();
|
||||
</script>
|
||||
<template>
|
||||
<q-page class="q-pa-md column items-center" style="padding-top: 66px">
|
||||
<q-page-sticky expand position="top">
|
||||
<q-toolbar class="bg-primary z-top" style="text-align: right">
|
||||
<q-btn icon="add" label="Add" color="dark" />
|
||||
</q-toolbar>
|
||||
</q-page-sticky>
|
||||
|
||||
<div class="card-list">
|
||||
<!-- <q-card class="q-mb-md" style="position: sticky:top:0">
|
||||
<q-card-actions align="right">
|
||||
<q-btn icon="add" label="Add" color="primary" />
|
||||
</q-card-actions>
|
||||
</q-card> -->
|
||||
|
||||
<smart-card ref="card" url="/ClaimRmas" :filter="filter" sort-by="id DESC" auto-load>
|
||||
<template #labels="{ row }">
|
||||
<q-list>
|
||||
<q-item class="q-pa-none">
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('claim.rma.code') }}</q-item-label>
|
||||
<q-item-label>{{ row.code }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
<q-list>
|
||||
<q-item class="q-pa-none">
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('claim.rma.worker') }}</q-item-label>
|
||||
<q-item-label>{{ row.workerFk }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</template>
|
||||
<template #actions="{ row }">
|
||||
<q-btn flat round color="orange" icon="vn:bin" @click="confirm(row.id)">
|
||||
<q-tooltip>{{ t('claim.rma.remove') }}</q-tooltip>
|
||||
</q-btn>
|
||||
</template>
|
||||
</smart-card>
|
||||
</div>
|
||||
</q-page>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
.card-list {
|
||||
width: 100%;
|
||||
max-width: 60em;
|
||||
}
|
||||
</style>
|
|
@ -0,0 +1,106 @@
|
|||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useQuasar } from 'quasar';
|
||||
import axios from 'axios';
|
||||
import SmartCard from 'src/components/SmartCard.vue';
|
||||
|
||||
const quasar = useQuasar();
|
||||
const { t } = useI18n();
|
||||
|
||||
const card = ref(null);
|
||||
const newRma = ref({
|
||||
code: '',
|
||||
crated: new Date(),
|
||||
});
|
||||
|
||||
function submit() {
|
||||
const formData = newRma.value;
|
||||
if (formData.code === '') return;
|
||||
|
||||
axios
|
||||
.post('ClaimRmas', formData)
|
||||
.then(() => {
|
||||
newRma.value = {
|
||||
code: '',
|
||||
crated: new Date(),
|
||||
};
|
||||
})
|
||||
.then(() => card.value.fetch());
|
||||
}
|
||||
|
||||
const confirmShown = ref(false);
|
||||
const rmaId = ref(null);
|
||||
function confirm(id) {
|
||||
confirmShown.value = true;
|
||||
rmaId.value = id;
|
||||
}
|
||||
|
||||
function remove() {
|
||||
const id = rmaId.value;
|
||||
axios.delete(`ClaimRmas/${id}`).then(() => {
|
||||
confirmShown.value = false;
|
||||
|
||||
quasar.notify({
|
||||
type: 'positive',
|
||||
message: 'Entry deleted',
|
||||
icon: 'check',
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function hide() {
|
||||
rmaId.value = null;
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-page class="q-pa-md column items-center">
|
||||
<div class="card-list">
|
||||
<q-card class="q-pa-md q-mb-md">
|
||||
<q-form @submit="submit">
|
||||
<q-input v-model="newRma.code" label="New RMA..."></q-input>
|
||||
</q-form>
|
||||
</q-card>
|
||||
|
||||
<smart-card ref="card" url="/ClaimRmas" sort-by="id DESC" auto-load>
|
||||
<template #labels="{ row }">
|
||||
<q-list>
|
||||
<q-item class="q-pa-none">
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('claim.rma.code') }}</q-item-label>
|
||||
<q-item-label>{{ row.code }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</template>
|
||||
<template #actions="{ row }">
|
||||
<q-btn flat round color="orange" icon="vn:bin" @click="confirm(row.id)">
|
||||
<q-tooltip>{{ t('claim.rma.remove') }}</q-tooltip>
|
||||
</q-btn>
|
||||
</template>
|
||||
</smart-card>
|
||||
</div>
|
||||
</q-page>
|
||||
|
||||
<q-dialog v-model="confirmShown" persistent @hide="hide">
|
||||
<q-card>
|
||||
<q-card-section class="row items-center">
|
||||
<q-avatar icon="warning" color="primary" text-color="white" />
|
||||
<span class="q-ml-sm">You are about to delete this entry. Are you sure?</span>
|
||||
</q-card-section>
|
||||
|
||||
<q-card-actions align="right">
|
||||
<q-btn flat label="Cancel" color="primary" v-close-popup />
|
||||
<q-btn flat label="Yes" color="primary" @click="remove()" autofocus />
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
.card-list {
|
||||
width: 100%;
|
||||
max-width: 60em;
|
||||
}
|
||||
</style>
|
|
@ -25,6 +25,16 @@ export default {
|
|||
},
|
||||
component: () => import('src/pages/Claim/ClaimList.vue'),
|
||||
},
|
||||
{
|
||||
name: 'ClaimRmaList',
|
||||
path: 'rma',
|
||||
meta: {
|
||||
title: 'rmaList',
|
||||
icon: 'vn:barcode',
|
||||
roles: ['claimManager']
|
||||
},
|
||||
component: () => import('src/pages/Claim/ClaimRmaList.vue'),
|
||||
},
|
||||
{
|
||||
name: 'ClaimCreate',
|
||||
path: 'create',
|
||||
|
@ -33,7 +43,7 @@ export default {
|
|||
icon: 'vn:addperson',
|
||||
},
|
||||
component: () => import('src/pages/Claim/ClaimCreate.vue'),
|
||||
},
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
|
@ -58,6 +68,16 @@ export default {
|
|||
roles: ['salesPerson']
|
||||
},
|
||||
component: () => import('src/pages/Claim/Card/ClaimBasicData.vue'),
|
||||
},
|
||||
{
|
||||
name: 'ClaimRma',
|
||||
path: 'rma',
|
||||
meta: {
|
||||
title: 'rma',
|
||||
roles: ['claimManager']
|
||||
},
|
||||
component: () => import('src/pages/Claim/Card/ClaimRma.vue'),
|
||||
props: { claim: true }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
|
Loading…
Reference in New Issue