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

update RFM search bar include date range for frequency and monetary

Browse Source
This commit is contained in:
edmondlang
2022-03-06 18:45:16 +08:00
parent f02edf5ed4
commit 3852ba78cf
1 changed files with 48 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/assets/vue/components/companies/sections/CustomerSectionComponent.vue
+48 -3
View File
@@ -16,20 +16,49 @@
<label class="all-caps">Bookings Frequency</label>
<input type="text" class="form-control" v-model.lazy="parameters.frequency">
</validation-wrapper-component>
<div class="row">
<div class="col p-r-0">
<validation-wrapper-component :validator="$v.parameters.frequency">
<label class="all-caps">Date From</label>
<date-picker-component :parameters="parameters" v-model.lazy="parameters.frequencyDateFrom"></date-picker-component>
</validation-wrapper-component>
</div>
<div class="col p-l-0">
<validation-wrapper-component :validator="$v.parameters.frequency">
<label class="all-caps">Date To</label>
<date-picker-component :parameters="parameters" v-model.lazy="parameters.frequencyDateTo"></date-picker-component>
</validation-wrapper-component>
</div>
</div>
</div>
<div class="col-12 col-md mb-2 mb-md-0">
<validation-wrapper-component :validator="$v.parameters.monetary">
<label class="all-caps">Total Payments</label>
<input type="text" class="form-control" v-model.lazy="parameters.monetary">
</validation-wrapper-component>
<div class="row">
<div class="col p-r-0">
<validation-wrapper-component :validator="$v.parameters.frequency">
<label class="all-caps">Date From</label>
<date-picker-component :parameters="parameters" v-model.lazy="parameters.monetaryDateFrom"></date-picker-component>
</validation-wrapper-component>
</div>
<div class="col p-l-0">
<validation-wrapper-component :validator="$v.parameters.frequency">
<label class="all-caps">Date To</label>
<date-picker-component :parameters="parameters" v-model.lazy="parameters.monetaryDateTo"></date-picker-component>
</validation-wrapper-component>
</div>
</div>
</div>
<div class="col-12 col-md-auto d-flex justify-content-center align-items-center">
<button type="button" class="btn btn-lg btn-primary fs-11 w-100" @click="submitSearch()">Search</button>
<div class="col-12 col-md-auto d-flex align-items-center flex-md-column justify-content-center">
<button type="button" class="btn btn-lg btn-primary fs-11 w-100 d-block m-r-5 mr-md-0 mb-md-1 mb-0" @click="submitSearch()">Search</button>
<button type="button" class="btn btn-lg btn-secondary fs-11 w-100 d-block m-l-5 ml-md-0 mt-md-1 0t-0" @click="reserSearch()">Reset</button>
</div>
</div>
</div>
</div>
<div class="row no-margin" v-show="search">
<div class="row no-margin" v-show="search" :key="serachSectionKey">
<div class="col bg-white padding-25">
<list-component :section="section" :endpoint="route('api.company.list')" :options="{'with_total_payments': true, 'recency': recency, 'frequency': frequency, 'monetary': monetary, 'business_type': 2, with_bookings:true, order_by:{ column:'total_payments', DESC:true}}">
<template slot="list" slot-scope="{data}">
@@ -53,16 +82,32 @@ export default {
section: 'customerSectionComponent',
isLoading: false,
search: false,
serachSectionKey: 2,
parameters: {
recency: '2022-02-15',
frequency: 0,
frequencyDateFrom: '2021-01-01',
frequencyDateTo: '2022-01-01',
monetary : 0,
monetaryDateFrom: '2021-01-01',
monetaryDateTo: '2022-02-15',
}
}
},
methods: {
submitSearch(){
this.search = true;
this.serachSectionKey ++;
},
reserSearch() {
this.parameters.recency = '2022-02-15';
this.parameters.frequency = 0;
this.parameters.frequencyDateFrom ='2021-01-01';
this.parameters.frequencyDateTo = '2022-01-01';
this.parameters.monetary = 0;
this.parameters.monetaryDateFrom = '2021-01-01';
this.parameters.monetaryDateTo = '2022-02-15';
this.serachSectionKey ++;
}
},
validations: {