From bdf42122f7de70750ca78cea34cd572ccd97da10 Mon Sep 17 00:00:00 2001
From: Paul Wilde <paul@wilde.cloud>
Date: Fri, 3 Mar 2023 11:06:42 +0000
Subject: [PATCH] slightly better edit med feeds layout

---
 src/views/medfeeds/MedFeedsEdit.vue | 124 ++++++++++++++--------------
 1 file changed, 64 insertions(+), 60 deletions(-)

diff --git a/src/views/medfeeds/MedFeedsEdit.vue b/src/views/medfeeds/MedFeedsEdit.vue
index ba157ce..30e2712 100644
--- a/src/views/medfeeds/MedFeedsEdit.vue
+++ b/src/views/medfeeds/MedFeedsEdit.vue
@@ -10,85 +10,89 @@
                 <v-row>
                     <v-col cols="6">
                         <v-autocomplete  label="Customer"
-                            :items="customers"
-                            v-model="mf.customer"
-                            v-model:search="search[1]"
-                            item-title="full_title"
-                            return-object
-                            :loading="searching[1]"
-                            append-icon="mdi-magnify"
-                            @keyup.enter="searchCustomers()"
-                            @click:append="searchCustomers()"
-                               no-data-text="No results (press Enter to search)"
-                            ></v-autocomplete>
+                                         :items="customers"
+                                         v-model="mf.customer"
+                                         v-model:search="search[1]"
+                                         item-title="full_title"
+                                         return-object
+                                         :loading="searching[1]"
+                                         append-icon="mdi-magnify"
+                                         @keyup.enter="searchCustomers()"
+                                         @click:append="searchCustomers()"
+                                         no-data-text="No results (press Enter to search)"
+                                         ></v-autocomplete>
                     </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-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>
-                        {{ mf.medication }}
+                                        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">
-                        Name : {{ mf.medication.name }}<br/>
-                        Info : <template v-for="(i, idx) in mf.medication.info" :key="idx" >
-                            <template v-if="i != ''">
-                                {{ i }}<br/>
-                            </template>
-                        </template>
-                        Med Code : {{ mf.medication.med_code }}<br/>
-                        Inclusion Rate : {{ mf.medication.inclusion_rate }}
+                        <v-card title="Medication :">
+                            <v-card-subtitle>
+                                Name : {{ mf.medication.name }}<br/>
+                            </v-card-subtitle>
+                            <v-card-text>
+                                <template v-for="(i, idx) in mf.medication.info" :key="idx" >
+                                    <template v-if="i != ''">
+                                        {{ i }}<br/>
+                                    </template>
+                                </template>
+                                Med Code : {{ mf.medication.med_code }}<br/>
+                                Inclusion Rate : {{ mf.medication.inclusion_rate }}
+                            </v-card-text>
+                        </v-card>
                     </v-col>
                 </v-row>
                 <v-row>
                     <v-col cols="6">
-                        {{ mf.product }}
                         <v-autocomplete label="Product"
                                         :items="products"
-                                        item-title="name"
-                            v-model="mf.product"
-                            return-object
-                            v-model:search="search[4]"
-                            append-icon="mdi-magnify"
-                            :loading="searching[4]"
-                            @keyup.enter="searchProducts()"
-                            @click:append="searchProducts()"
-                               no-data-text="No results (press Enter to search)"
-                            ></v-autocomplete>
+                                        item-title="code"
+                                        v-model="mf.product"
+                                        return-object
+                                        v-model:search="search[4]"
+                                        append-icon="mdi-magnify"
+                                        :loading="searching[4]"
+                                        @keyup.enter="searchProducts()"
+                                        @click:append="searchProducts()"
+                                        no-data-text="No results (press Enter to search)"
+                                        ></v-autocomplete>
+                    </v-col>
+                    <v-col cols="6">
+                        <v-card :title="mf.product.name"></v-card>
                     </v-col>
                     <v-col cols="6">
-                        {{ mf.product.name }}
                         <v-text-field label="Tonnage" type="number" v-model="mf.tonnage"></v-text-field>
                     </v-col>
-                </v-row>
-                <v-row>
                     <v-col cols="6">
                         <label>
                             Date Required :
-                        <DatePicker v-model="mf.date_required" format="dd/MM/yyyy" />
+                            <DatePicker v-model="mf.date_required" format="dd/MM/yyyy" />
                         </label>
                     </v-col>
                 </v-row>
@@ -97,18 +101,18 @@
                         <v-switch color="blue" label="Repeat prescription" v-model="mf.repeat"></v-switch>
                     </v-col>
                     <v-col cols="6">
-                        <v-textarea label="Repeat Message" v-model="mf.repeat_message"></v-textarea>
+                        <v-textarea :disabled="!mf.repeat" label="Repeat Message" v-model="mf.repeat_message"></v-textarea>
                     </v-col>
                 </v-row>
             </v-container>
         </v-card-text>
         <v-card-actions>
             <v-btn v-if="!mf.isNew" color="red-darken-1"
-                   variant="text"
-                   @click="saveMedFeed(mf)">Save</v-btn>
+                                    variant="text"
+                                    @click="saveMedFeed(mf)">Save</v-btn>
             <v-btn v-if="mf.isNew" color="red-darken-1"
-                   variant="text"
-                   @click="saveMedFeed(mf)">Add</v-btn>
+                                   variant="text"
+                                   @click="saveMedFeed(mf)">Add</v-btn>
             <v-spacer></v-spacer>
             <v-btn color="blue-darken-1"
                    variant="text"