From 342bbfc9bc1bfba9a25debd7414640e491a01d89 Mon Sep 17 00:00:00 2001
From: Paul Wilde <paul@wilde.cloud>
Date: Thu, 23 Mar 2023 17:05:16 +0000
Subject: [PATCH] added vet and med search

---
 src/components/CustomerSearch.vue    |  3 +-
 src/components/MedSearch.vue         | 81 ++++++++++++++++++++++++
 src/components/ProductSearch.vue     |  4 +-
 src/components/VetSearch.vue         | 73 ++++++++++++++++++++++
 src/views/contracts/ContractEdit.vue | 12 ++--
 src/views/customers/CustomerList.vue |  2 +-
 src/views/medfeeds/MedFeedsEdit.vue  | 92 +++++++++++++---------------
 src/views/medfeeds/MedFeedsList.vue  | 84 ++++++++++++-------------
 8 files changed, 249 insertions(+), 102 deletions(-)
 create mode 100644 src/components/MedSearch.vue
 create mode 100644 src/components/VetSearch.vue

diff --git a/src/components/CustomerSearch.vue b/src/components/CustomerSearch.vue
index 3a8b2fb..cdb9c97 100644
--- a/src/components/CustomerSearch.vue
+++ b/src/components/CustomerSearch.vue
@@ -11,8 +11,7 @@
                                  v-slot="{ item }" 
                                  key-field="acc_no"
                                  >
-                                 <v-list-item>
-                                     <v-btn icon="mdi-arrow-right" title="select" @click="selectCustomer(item)" size="small" color="success"></v-btn>
+                                 <v-list-item @click="selectCustomer(item)">
                                      {{ item.acc_no }} - {{ item.name }}
                                  </v-list-item>
                 </RecycleScroller>
diff --git a/src/components/MedSearch.vue b/src/components/MedSearch.vue
new file mode 100644
index 0000000..300d89b
--- /dev/null
+++ b/src/components/MedSearch.vue
@@ -0,0 +1,81 @@
+<template>
+    <v-card title="Med Search">
+        <v-card-text>
+            <v-text-field label="Search" v-model="med_search" append-icon="mdi-magnify" @click:append="searchMeds" @keyup.enter.prevent="searchMeds"></v-text-field>
+            <v-progress-linear indeterminate :active="meds_loading">
+            </v-progress-linear>
+            <v-list>
+                <RecycleScroller class="scroller"
+                                 :items="meds"
+                                 :item-size="50"
+                                 v-slot="{ item }" 
+                                 key-field="id"
+                                 >
+                                 <v-list-item @click="setMed(item)">
+                                     {{ item.med_code }} : {{ item.name }}
+                                 </v-list-item>
+                </RecycleScroller>
+            </v-list>
+        </v-card-text>
+    </v-card>
+</template>
+<script>
+import axios from 'axios'
+export default {
+    props:{
+    },
+    data() {
+        return {
+            med_search: "",
+            meds: [],
+            meds_loading: null
+        }
+    },
+    emits: ['returnMed'],
+    created() {
+        this.allMeds()
+    },
+    methods: {
+        allMeds(){
+            this.meds_loading = true
+            console.log("Searching for " + this.med_search)
+            let url = this.$api_url + "/meds/list"
+            axios.get(url)
+                .then(resp => {
+                    this.meds = resp.data
+                })
+                .catch(err => {
+                    console.log(err)
+                })
+                .finally(() => {
+                    this.meds_loading = false
+                })
+        },
+        searchMeds() {
+            this.meds_loading = true
+            console.log("Searching for " & this.med_search)
+            let url = this.$api_url + "/meds/search/" + this.med_search
+            axios.get(url)
+                .then(resp => {
+                    console.log(resp)
+                    this.meds = resp.data
+                })
+                .catch(err => {
+                    console.log(err)
+                })
+                .finally(() => {
+                    this.meds_loading = false
+                })
+        },
+        setMed(p){
+            this.$emit('returnMed',p)
+        }
+    }
+}
+</script>
+<style scoped>
+.scroller {
+    height:500px;
+}
+</style>
+
diff --git a/src/components/ProductSearch.vue b/src/components/ProductSearch.vue
index ad8363c..7797da1 100644
--- a/src/components/ProductSearch.vue
+++ b/src/components/ProductSearch.vue
@@ -11,8 +11,8 @@
                                  v-slot="{ item }" 
                                  key-field="code"
                                  >
-                                 <v-list-item>
-                                     <v-btn icon="mdi-arrow-right" title="select" @click="setProduct(item)" size="small" color="success"></v-btn>
+                                 <v-list-item @click="setProduct(item)">
+
                                      {{ item.code }} - {{ item.name }}
                                  </v-list-item>
                 </RecycleScroller>
diff --git a/src/components/VetSearch.vue b/src/components/VetSearch.vue
new file mode 100644
index 0000000..0f22c9a
--- /dev/null
+++ b/src/components/VetSearch.vue
@@ -0,0 +1,73 @@
+<template>
+    <v-card title="Vet Search">
+        <v-card-text>
+            <v-text-field label="Search" v-model="vet_search" append-icon="mdi-magnify" @click:append="searchVets" @keyup.enter.prevent="searchVets"></v-text-field>
+            <v-progress-linear indeterminate :active="vets_loading">
+            </v-progress-linear>
+            <v-list>
+                <RecycleScroller class="scroller"
+                                 :items="vets"
+                                 :item-size="50"
+                                 v-slot="{ item }" 
+                                 key-field="id"
+                                 >
+                                 <v-list-item @click="setVet(item)">
+                                     {{ item.practice }}
+                                     <v-tooltip activator="parent"
+                                                location="end">
+                                         {{ item.practice }}
+                                         <template v-for="(c,index) in item.contacts" :key="index">
+                                             <template v-if="c != ''">
+                                                 {{ c }}<br/>
+                                             </template>
+                                         </template>
+                                     </v-tooltip>
+
+                                 </v-list-item>
+                </RecycleScroller>
+            </v-list>
+        </v-card-text>
+    </v-card>
+</template>
+<script>
+import axios from 'axios'
+export default {
+    props:{
+    },
+    data() {
+        return {
+            vet_search: "",
+            vets: [],
+            vets_loading: null
+        }
+    },
+    emits: ['returnVet'],
+    methods: {
+        searchVets() {
+            this.vets_loading = true
+            console.log("Searching for " & this.vet_search)
+            let url = this.$api_url + "/vets/search/" + this.vet_search
+            axios.get(url)
+                .then(resp => {
+                    console.log(resp)
+                    this.vets = resp.data
+                })
+                .catch(err => {
+                    console.log(err)
+                })
+                .finally(() => {
+                    this.vets_loading = false
+                })
+        },
+        setVet(p){
+            this.$emit('returnVet',p)
+        }
+    }
+}
+</script>
+<style scoped>
+.scroller {
+    height:500px;
+}
+</style>
+
diff --git a/src/views/contracts/ContractEdit.vue b/src/views/contracts/ContractEdit.vue
index 3d7321d..89d4c24 100644
--- a/src/views/contracts/ContractEdit.vue
+++ b/src/views/contracts/ContractEdit.vue
@@ -4,10 +4,9 @@
             <v-container>
                 <v-row>
                     <v-col cols="6">
-                        <v-text-field readonly="true" variant="none" prepend-icon="mdi-magnify" @click:prepend="showCustomerSearch">
-                            {{ contract.customer.acc_no }} - {{ contract.customer.name }}
+                        <v-text-field readonly variant="solo" prepend-icon="mdi-magnify" @click:prepend="showCustomerSearch" label="Customer" :model-value="contract.customer.acc_no + ' - ' + contract.customer.name">
                         </v-text-field>
-                        <v-text-field type="number" variant="outlined" label="Tonnage Per Month" v-model="contract.tonnage_per_month"></v-text-field>
+                        <v-text-field type="number" variant="solo" label="Tonnage Per Month" v-model="contract.tonnage_per_month"></v-text-field>
                     </v-col>
                     <v-col cols="6">
                         <label>
@@ -44,7 +43,7 @@
                                 {{ p.code }} - {{ p.name }}
                             </td>
                             <td>
-                                <v-text-field type="number" density="compact" variant="outlined" v-model="p.price"></v-text-field>
+                                <v-text-field type="number" density="compact" variant="underlined" v-model="p.price"></v-text-field>
                             </td>
                             <td>
                                 <v-btn size="small" color="error" title="Remove" variant="plain" @click="removeProduct(p.code)" icon="mdi-minus"></v-btn>
@@ -65,8 +64,8 @@
                             </label>
                         </v-col>
                         <v-col cols="12">
-                            <v-textarea rows=3 label="Comments" v-model="contract.comments"></v-textarea>
-                            <v-textarea rows=3 label="Office Comments" v-model="contract.office_comments"></v-textarea>
+                            <v-textarea rows=3 label="Comments" variant="outlined" v-model="contract.comments"></v-textarea>
+                            <v-textarea rows=3 label="Office Comments" variant="outlined" v-model="contract.office_comments"></v-textarea>
                         </v-col>
                     </v-row>
                     <ErrorBanner :errors="errors" />
@@ -140,6 +139,7 @@ export default {
             }
         }
     },
+    emits: ['closetab','contractupdate'],
     methods: {
         close() {
             this.$emit('closetab','list')
diff --git a/src/views/customers/CustomerList.vue b/src/views/customers/CustomerList.vue
index 4957b37..b571175 100644
--- a/src/views/customers/CustomerList.vue
+++ b/src/views/customers/CustomerList.vue
@@ -122,7 +122,7 @@ export default {
 </script>
 <style>
 .scroller {
-    height: 600px;
+    height: 300px;
 }
 .scroller.small {
     height: 200px;
diff --git a/src/views/medfeeds/MedFeedsEdit.vue b/src/views/medfeeds/MedFeedsEdit.vue
index 49762d1..02f26d6 100644
--- a/src/views/medfeeds/MedFeedsEdit.vue
+++ b/src/views/medfeeds/MedFeedsEdit.vue
@@ -1,53 +1,20 @@
 <template>
-    <v-card :title="title">
-        <v-card-subtitle>
-            Medicated Feed : 
-            <template v-if="mf.isNew">New</template>
-            <template v-else>{{ mf.id }} - {{ mf.customer.name }}</template>
-        </v-card-subtitle>
+    <v-card :title="title" :subtitle="'Medicated Feed : ' + mf.id">
         <v-card-text>
             <v-container>
                 <v-row>
                     <v-col cols="6">
-                        <v-text-field readonly="true" variant="none" prepend-icon="mdi-magnify" @click:prepend="showCustomerSearch">
-                            {{ mf.customer.acc_no }} - {{ mf.customer.name }}
+                        <v-text-field label="Customer" readonly variant="outlined" prepend-icon="mdi-magnify" @click:prepend="showCustomerSearch" :model-value="mf.customer.acc_no + ' - ' + mf.customer.name">
+                        </v-text-field>
+                        <v-text-field label="Vet" readonly variant="outlined" prepend-icon="mdi-magnify" @click:prepend="showVetSearch" :model-value="mf.vet.practice">
                         </v-text-field>
-                    </v-col>
-                    <v-col cols="6">
-                        <v-autocomplete label="Vet" 
-                                        :items="vets"
-                                        v-model="mf.vet.practice"
-                                        v-model:search="search[2]"
-                                        :loading="searching[2]"
-                                        append-icon="mdi-magnify"
-                                        item-title="practice"
-                                        item-value="id"
-                                        @keyup.enter="searchVets()"
-                                        @click:append="searchVets()"
-                                        no-data-text="No results (press Enter to search)"
-                                        ></v-autocomplete>
-                    </v-col>
-                    <v-col cols="6">
-                        <v-autocomplete label="Medication" 
-                                        :items="medications"
-                                        v-model="mf.medication.name"
-                                        v-model:search="search[3]"
-                                        :loading="searching[3]"
-                                        append-icon="mdi-magnify"
-                                        item-title="name"
-                                        item-value="id"
-                                        @keyup.enter="searchMeds()"
-                                        no-data-text="No results (press Enter to search)"
-                                        @click:append="searchMeds()"
-                                        ></v-autocomplete>
 
                     </v-col>
                     <v-col cols="6">
                         <v-card title="Medication :">
-                            <v-card-subtitle>
-                                Name : {{ mf.medication.name }}<br/>
-                            </v-card-subtitle>
                             <v-card-text>
+                                <v-text-field label="Medication" readonly variant="outlined" prepend-icon="mdi-magnify" @click:prepend="showMedSearch" :model-value="mf.medication.name">
+                                </v-text-field>
                                 <template v-for="(i, idx) in mf.medication.info" :key="idx" >
                                     <template v-if="i != ''">
                                         {{ i }}<br/>
@@ -61,8 +28,7 @@
                 </v-row>
                 <v-row>
                     <v-col cols="12">
-                        <v-text-field readonly="true" variant="none" prepend-icon="mdi-magnify" @click:prepend="showProductSearch">
-                            {{ mf.product.code }} - {{ mf.product.name }}
+                        <v-text-field label="Product" readonly variant="outlined" prepend-icon="mdi-magnify" @click:prepend="showProductSearch" :model-value="mf.product.code + ' - ' + mf.product.name">
                         </v-text-field>
                     </v-col>
                     <v-col cols="6">
@@ -80,7 +46,7 @@
                         <v-switch color="blue" label="Repeat prescription" v-model="mf.repeat"></v-switch>
                     </v-col>
                     <v-col cols="6">
-                        <v-textarea :disabled="!mf.repeat" label="Repeat Message" v-model="mf.repeat_message"></v-textarea>
+                        <v-textarea :disabled="!mf.repeat" label="Repeat Message" v-model="mf.repeat_message" variant="outlined"></v-textarea>
                     </v-col>
                 </v-row>
             </v-container>
@@ -104,12 +70,20 @@
     <v-dialog v-model="search[1]">
         <ProductSearch @returnProduct="setProduct"></ProductSearch>
     </v-dialog>
+    <v-dialog v-model="search[2]">
+        <VetSearch @returnVet="setVet"></VetSearch>
+    </v-dialog>
+    <v-dialog v-model="search[3]">
+        <MedSearch @returnMed="setMed"></MedSearch>
+    </v-dialog>
 </template>
 <script> 
 import DatePicker from '@vuepic/vue-datepicker'
 import axios from 'axios';
 import CustomerSearch from '@/components/CustomerSearch.vue'
 import ProductSearch from '@/components/ProductSearch.vue'
+import VetSearch from '@/components/VetSearch.vue'
+import MedSearch from '@/components/MedSearch.vue'
 export default {
     props:{
         set_mf: {}
@@ -117,7 +91,9 @@ export default {
     components: {
         DatePicker,
         CustomerSearch,
-        ProductSearch
+        ProductSearch,
+        VetSearch,
+        MedSearch
     },
     watch: {
         set_mf(newval) {
@@ -143,6 +119,7 @@ export default {
             }
         }
     },
+    emits: ['closetab','medfeedupdated'],
     methods: {
         close() {
             this.$emit('closetab','list')
@@ -152,12 +129,13 @@ export default {
             axios.put(url,{
                 medfeed: medfeed
             })
-            .then(resp => {
-                console.log(resp)
-            })
-            .catch(err => {
-                console.log(err)
-            })
+                .then(resp => {
+                    console.log(resp)
+                    this.$emit('medfeedupdated')
+                })
+                .catch(err => {
+                    console.log(err)
+                })
         },
         showCustomerSearch(){
             this.search[0] = true
@@ -172,7 +150,21 @@ export default {
         setProduct(p) {
             this.mf.product = p
             this.search[1] = false
-        }
+        },
+        showVetSearch() {
+            this.search[2] = true
+        },
+        setVet(v) {
+            this.mf.vet = v
+            this.search[2] = false
+        },
+        showMedSearch() {
+            this.search[3] = true
+        },
+        setMed(med) {
+            this.mf.medication = med
+            this.search[3] = false
+        },
     },
 }
 </script>
diff --git a/src/views/medfeeds/MedFeedsList.vue b/src/views/medfeeds/MedFeedsList.vue
index fd2d775..7fa11e8 100644
--- a/src/views/medfeeds/MedFeedsList.vue
+++ b/src/views/medfeeds/MedFeedsList.vue
@@ -24,51 +24,50 @@
                     <v-progress-linear indeterminate color="blue" :active="loading"></v-progress-linear>
                     <RecycleScroller class="scroller"
                                      :items="filteredMedFeeds"
-                                     :item-size="130"
+                                     :item-size="108"
                                      v-slot="{ item }" 
-                                     key-field="id"
-                                     >
-                                     <v-row class="item" :class="{ at_risk : item.customer.at_risk }"> 
-                                         <v-col cols="4">
-                                             Medicated Feed : {{ item.id }}<br/>
-                                             {{ item.customer.acc_no }} - {{ item.customer.name }}
-                                         </v-col>
-                    <v-col>
-                        {{ item.medication.name }} {{ item.medication.inclusion_rate }}<br />
-                        {{ item.product.name }}
-                    </v-col>
-                    <v-col>
-                        Required : {{ formatDate(item.date_required,"DD/MM/YYYY") }} <br/>
-                        Repeat Prescription? : <v-icon v-if="item.repeat">mdi-refresh</v-icon>
-                    </v-col>
-                    <v-col>
-                        <div class="d-flex justify-space-around align-center flex-column flex-sm-row fill-height">
-                            <v-btn>
-                                More
-                                <v-overlay activator="parent" class="align-center justify-center">
-                                    <v-container>
-                                        <v-card width="600">
-                                            <v-card-title>Info</v-card-title>
-                                            <v-card-subtitle>Repeat Message</v-card-subtitle>
-                                            <v-card-text>{{ item.repeat_message }}</v-card-text>
-                                            <v-card-actions>
-                                                <v-btn class="mb-2 mr-2" color="blue" @click="reportScriptReq(item)">Script Request</v-btn>
-                                                <v-btn class="mb-2 mr-2" color="blue" @click="reportOrderForm(item)">Order Form</v-btn>
-                                            </v-card-actions>
-                                        </v-card>
-                                    </v-container>
-                                </v-overlay>
-                            </v-btn><br/>
-                            <v-btn v-if="site_info.features.editmedfeed" color="warning" @click="editMedFeed(item)">Edit</v-btn>
-                        </div>
-                    </v-col>
-                                     </v-row>
+                                     key-field="id">
+                    <v-row class="item" :class="{ at_risk : item.customer.at_risk }"> 
+                        <v-col cols="4">
+                            Medicated Feed : {{ item.id }}<br/>
+                            {{ item.customer.acc_no }} - {{ item.customer.name }}
+                        </v-col>
+                        <v-col>
+                            {{ item.medication.name }} {{ item.medication.inclusion_rate }}<br />
+                            {{ item.product.name }}
+                        </v-col>
+                        <v-col>
+                            Required : {{ formatDate(item.date_required,"DD/MM/YYYY") }} <br/>
+                            Repeat Prescription? : <v-icon v-if="item.repeat">mdi-refresh</v-icon>
+                        </v-col>
+                        <v-col>
+                            <div class="d-flex justify-space-around align-center flex-column flex-sm-row fill-height">
+                                <v-btn>
+                                    More
+                                    <v-overlay activator="parent" class="align-center justify-center">
+                                        <v-container>
+                                            <v-card width="600">
+                                                <v-card-title>Info</v-card-title>
+                                                <v-card-subtitle>Repeat Message</v-card-subtitle>
+                                                <v-card-text>{{ item.repeat_message }}</v-card-text>
+                                                <v-card-actions>
+                                                    <v-btn class="mb-2 mr-2" color="blue" @click="reportScriptReq(item)">Script Request</v-btn>
+                                                    <v-btn class="mb-2 mr-2" color="blue" @click="reportOrderForm(item)">Order Form</v-btn>
+                                                </v-card-actions>
+                                            </v-card>
+                                        </v-container>
+                                    </v-overlay>
+                                </v-btn><br/>
+                                <v-btn v-if="site_info.features.editmedfeed" color="warning" @click="editMedFeed(item)">Edit</v-btn>
+                            </div>
+                        </v-col>
+                    </v-row>
                     </RecycleScroller>
                 </v-col>
             </v-row>
         </v-window-item>
         <v-window-item value="edit">
-            <MedFeedsEdit :set_mf="selected_mf" @closetab="tab = 'list'" @medfeedupdate="medfeedUpdated" />
+            <MedFeedsEdit :set_mf="selected_mf" @closetab="tab = 'list'" @medfeedupdated="medfeedUpdated" />
         </v-window-item>
         <v-window-item value="scriptreq">
             <ScriptReq :mf="selected_mf" :user="user_info"></ScriptReq>
@@ -175,6 +174,9 @@ export default {
             }
             this.edit = true
             this.tab = "edit"
+        },
+        medfeedUpdated(){
+            this.getMedFeedsList()
         }
     }
 }
@@ -185,9 +187,9 @@ export default {
 }
 
 .item {
-    height: 138px;
+    height: 100px;
     overflow-y:hidden;
-    padding: 0 12px;
+    padding: 0 1em;
     margin-bottom:2px;
     display: flex;
     align-items: center;