omair/exchange-2.0
1
0
Fork 0
mirror of https://gitlab.com/uldvstar/exchange-2.0.git synced 2026-08-19 04:24:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

List & view customer details components

Browse Source
This commit is contained in:
Fairuz
2021-05-21 21:12:23 +08:00
parent 8939d142a0
commit de74523ac2
4 changed files with 144 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/assets/vue/components/companies/elements/CompanyDetailsComponent.vue
+64
View File
@@ -0,0 +1,64 @@
<template>
<div class="row align-items-center m-b-10 parentContainer">
<div class="container p-0 m-0" @click="backToCompanyList()">
<i class="fa fa-arrow-left fs-11 align-middle"></i>
<span class="fs-11 m-0 align-middle pl-2 text-uppercase">Back to list</span>
</div>
<div class="row w-100 m-0 p-0">
<div class="col-auto p-0 pt-2 m-b-10" :style="minWidth">
<div class="h5 m-0">{{this.company_details ? this.company_details.name : ""}}</div>
</div>
<div class="col-12 p-0">
<label class="muted" :style="minWidth">Reference</label>
<label>{{this.company_details ? this.company_details.reference : ""}}</label>
</div>
<div class="col-12 p-0">
<label class="muted" :style="minWidth">Business Type</label>
<label>{{this.company_details ? getBusinessTypeDesc(this.company_details.business_type) : ""}}</label>
</div>
<div class="col-12 p-0">
<label class="muted" :style="minWidth">Contacts</label>
<label><i class="fa fa-envelope"></i>&nbsp;{{this.company_details ? this.company_details.contact.email : ""}}</label>
</div>
<div class="col-12 p-0">
<label class="muted" :style="minWidth">&nbsp;</label>
<label><i class="fa fa-phone"></i>&nbsp;{{this.company_details ? this.company_details.contact.phone : ""}}</label>
</div>
<div class="col-12 p-0">
<label class="muted" :style="minWidth">Total Booking</label>
<label>{{this.company_details ? this.company_details.bookings.length : ""}}</label>
</div>
</div>
</div>
</template>
<script>
import componentHandler from '../../../general/mixins/componentHandler';
export default {
props:{
company_details:{
type:Object,
required:true
},
},
data(){
return {
minWidth:{
minWidth:'100px',
},
minWidth150:{
minWidth:'150px',
},
}
},
methods: {
backToCompanyList() {
this.$root.$emit('backToCompanyList');
},
getBusinessTypeDesc(type){
return (type==1) ? 'Company Account':'Personal Account';
}
},
mixins: [componentHandler]
}
</script>
resources/assets/vue/components/companies/elements/CompanyListComponent.vue
+34
View File
@@ -0,0 +1,34 @@
<template>
<div class="row align-items-center m-b-10 parentContainer">
<div class="row w-100 m-0 p-0 d-block">
<div class="col-auto pull-left mt-2">
<div class="font-heading all-caps fs-11">{{this.item.name}}</div>
</div>
<div class="col-auto text-right pull-right" :style="minWidth">
<button type="button" @click="viewCompany()" class="btn btn-xs btn-primary fs-11">View</button>
</div>
</div>
</div>
</template>
<script>
import componentHandler from '../../../general/mixins/componentHandler';
export default {
data(){
return {
minWidth:{
minWidth:'100px',
},
minWidth150:{
minWidth:'150px',
},
}
},
methods: {
viewCompany() {
this.$root.$emit('viewCompany', this.item);
}
},
mixins: [componentHandler]
}
</script>
resources/assets/vue/components/companies/sections/CompanyQuickViewSectionComponent.vue
+34
View File
@@ -0,0 +1,34 @@
<template>
<div class="col-12">
<list-component v-show="!this.show_details" key="2" :section="this.section" :endpoint="route('api.company.list')" :options="{per_page: 25,with_bookings:true}">
<template slot="list" slot-scope="{data}">
<company-list-component :data="data"></company-list-component>
</template>
</list-component>
<company-details-component v-show="this.show_details" :company_details="company_details"></company-details-component>
</div>
</template>
<script>
import componentHandler from '../../../general/mixins/componentHandler';
export default {
data(){
return {
section: 'companyQuickViewSection',
show_details: false,
company_details: null
}
},
mounted() {
this.$root.$on('backToCompanyList', () => {
this.show_details=false;
this.$store.dispatch('reloadList', {'name': this.section});
});
this.$root.$on('viewCompany', (company_details) => {
this.show_details=true;
this.company_details=company_details;
});
},
mixins: [componentHandler]
}
</script>
resources/views/pages/settings.blade.php
+11 -5
View File
@@ -461,7 +461,7 @@
<div class="row justify-content-end">
<div class="col">
<div class="row fs-12 text-center">
<div class="col p-t-20 p-b-20 bg-master-lighter tabButton" tab-name="payments">
<div class="col p-t-20 p-b-20 bg-master-lighter tabButton active" tab-name="customer-list">
<div class="row justify-content-center m-b-5">
<div class="col-auto">
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
@@ -484,7 +484,7 @@
<div class="row justify-content-end">
<div class="col">
<div class="row fs-12 text-center">
<div class="col p-t-20 p-b-20 bg-master-lighter tabButton active" tab-name="transactions">
<div class="col p-t-20 p-b-20 bg-master-lighter tabButton " tab-name="transactions">
<div class="row justify-content-center m-b-5">
<div class="col-auto">
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
@@ -506,9 +506,8 @@
</div>
<div class="row no-margin">
<div class="col bg-white padding-25">
<div class="row tabsContainer tabContent" tab-name="transfers">
<div class="col no-padding">
</div>
<div class="row tabsContainer tabContent" tab-name="customer-list">
<company-quick-view-section-component></company-quick-view-section-component>
</div>
<div class="row tabsContainer hide tabContent" tab-name="PO">
<div class="col">
@@ -534,3 +533,10 @@
</div>
</div>
@endsection
<script>
import CompanyQuickViewSectionComponent
from "../../assets/vue/components/companies/sections/CompanyQuickViewSectionComponent";
export default {
components: {CompanyQuickViewSectionComponent}
}
</script>