diff --git a/package-lock.json b/package-lock.json
index b50afba..75db310 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2217,9 +2217,9 @@
       "dev": true
     },
     "node_modules/@types/node": {
-      "version": "18.15.7",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-18.15.7.tgz",
-      "integrity": "sha512-LFmUbFunqmBn26wJZgZPYZPrDR1RwGOu2v79Mgcka1ndO6V0/cwjivPTc4yoK6n9kmw4/ls1r8cLrvh2iMibFA=="
+      "version": "18.15.10",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-18.15.10.tgz",
+      "integrity": "sha512-9avDaQJczATcXgfmMAW3MIWArOO7A+m90vuCFLr8AotWf8igO/mRoYukrk2cqZVtv38tHs33retzHEilM7FpeQ=="
     },
     "node_modules/@types/normalize-package-data": {
       "version": "2.4.1",
@@ -3974,9 +3974,9 @@
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001469",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001469.tgz",
-      "integrity": "sha512-Rcp7221ScNqQPP3W+lVOYDyjdR6dC+neEQCttoNr5bAyz54AboB4iwpnWgyi8P4YUsPybVzT4LgWiBbI3drL4g==",
+      "version": "1.0.30001470",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001470.tgz",
+      "integrity": "sha512-065uNwY6QtHCBOExzbV6m236DDhYCCtPmQUCoQtwkVqzud8v5QPidoMr6CoMkC2nfp6nksjttqWQRRh75LqUmA==",
       "funding": [
         {
           "type": "opencollective",
@@ -5242,9 +5242,9 @@
       "dev": true
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.4.339",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.339.tgz",
-      "integrity": "sha512-MSXHBJGcbBydq/DQDlpBeUKnJ6C7aTiNCTRpfDV5Iz0sNr/Ng6RJFloq82AAicp/SrmDq4zF6XsKG0B8Xwn1UQ=="
+      "version": "1.4.340",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.340.tgz",
+      "integrity": "sha512-zx8hqumOqltKsv/MF50yvdAlPF9S/4PXbyfzJS6ZGhbddGkRegdwImmfSVqCkEziYzrIGZ/TlrzBND4FysfkDg=="
     },
     "node_modules/emoji-regex": {
       "version": "8.0.0",
@@ -8299,9 +8299,15 @@
       }
     },
     "node_modules/nanoid": {
-      "version": "3.3.4",
-      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz",
-      "integrity": "sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==",
+      "version": "3.3.6",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.6.tgz",
+      "integrity": "sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
       "bin": {
         "nanoid": "bin/nanoid.cjs"
       },
diff --git a/src/assets/css/app.css b/src/assets/css/app.css
index 6cb5970..088a3eb 100644
--- a/src/assets/css/app.css
+++ b/src/assets/css/app.css
@@ -81,3 +81,6 @@ table tr.at_risk:hover {
     align-items: center;
     border-bottom: 1px solid #000;
 }
+.clickable {
+    cursor:pointer;
+}
diff --git a/src/router/index.js b/src/router/index.js
index dd3ebe1..f063e94 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -59,6 +59,11 @@ const routes = [
         name: 'complaintslist',
         component: ComplaintsList
     },
+    {
+        path: '/customers/complaints/list/:id',
+        name: 'complaintslistid',
+        component: ComplaintsList
+    },
     {
         path: '/sop/printed',
         name: 'sopprinted',
diff --git a/src/views/complaints/ComplaintsList.vue b/src/views/complaints/ComplaintsList.vue
index d8fa2e5..27def12 100644
--- a/src/views/complaints/ComplaintsList.vue
+++ b/src/views/complaints/ComplaintsList.vue
@@ -5,56 +5,65 @@
             <v-tab title="Edit" v-model="edit" v-if="edit" />
                 <v-tab title="Report" v-model="report" v-if="report" />
     </v-tabs>
-    <v-window v-model="tab">
-        <v-window-item v-model="list">
-            <v-col cols="12" xs="12" sm="12" md="12" lg=8>
-                <v-text-field 
-                                             clearable
-                                             label="Search"
-                                             variant="outlined"
-                                             v-model="searchQuery"
-                                             density="compact"
-                                             append-inner-icon="mdi-magnify"></v-text-field>
-                <v-btn v-if="site_info.features.addcomplaint" color="warning" prepend-icon="mdi-plus" variant="text">Add</v-btn>
-                <v-progress-linear indeterminate color="orange" :active="loading"></v-progress-linear>
-                <v-card variant="outlined">
-                    <RecycleScroller class="scroller"
-                                     :items="filteredComplaints"
-                                     :item-size="100"
-                                     v-slot="{ item }" 
-                                     key-field="id">
-                    <v-row dense class="item" :class="{ 'bg-red-lighten-4' : item.at_risk }">
-                        <v-col cols="4">
-                            Complaint : {{ item.id }}<br/>
-                            <span class="text-caption">
-                                Complaint Date : {{ item.complaint_date }}<br/>
-                                Sales Order: {{ item.sop.doc_no }}<br/>
-                            </span>
-                        </v-col>
-                        <v-col cols="4" class="text-body-2">
-                            {{ item.customer.acc_no }} - {{ item.customer.name }}<br/>
-                            Reason : {{ item.reason }}<br/>
-                            Driver : {{ item.driver.name }}
-                        </v-col>
+        <v-window v-model="tab">
+            <v-window-item v-model="list">
+                <v-col cols="12" xs="12" sm="12" md="12" lg=8>
+                    <v-text-field 
+                                                 clearable
+                                                 label="Search"
+                                                 variant="outlined"
+                                                 v-model="searchQuery"
+                                                 density="compact"
+                                                 append-inner-icon="mdi-magnify"></v-text-field>
+                    <v-row justify="space-between">
                         <v-col cols=4>
-                            <div class="d-flex justify-space-around align-center flex-column flex-sm-row fill-height">
-                                <v-row>
-                                        <v-icon icon="mdi-exclamation" v-if="item.at_risk" color="red" title="At Risk"></v-icon>
-                                        <v-icon icon="mdi-play" v-if="item.active" title="Active"></v-icon>
-                                </v-row>
-                                <v-btn @click="showInfo(item)" color="blue-lighten-1">View</v-btn>
-                                <v-btn v-if="site_info.features.editcomplaint" color="orange-lighten-2">Edit</v-btn>
-                            </div>
+                            <v-btn v-if="site_info.features.addcomplaint" color="warning" prepend-icon="mdi-plus" variant="text">Add</v-btn>
+                        </v-col>
+                        <v-col cols=3>
+                            <v-btn align="end" variant="text" @click="showActive = !showActive">
+                                Showing <span v-if="showActive">Active Only</span><span v-else>Inactive</span>
+                            </v-btn>
                         </v-col>
                     </v-row>
-                    </RecycleScroller>
-                </v-card>
-            </v-col>
-        </v-window-item>
-    </v-window>
-    <v-dialog v-model="showComplaintInfo">
-        <ComplaintInfo :in_complaint="selected_complaint" @return="doInfoReturn" />
-    </v-dialog>
+                    <v-progress-linear indeterminate color="orange" :active="loading"></v-progress-linear>
+                    <v-card variant="outlined">
+                        <RecycleScroller class="scroller"
+                                         :items="filteredComplaints"
+                                         :item-size="100"
+                                         v-slot="{ item }" 
+                                         key-field="id">
+                        <v-row dense class="item" :class="{ 'bg-red-lighten-4' : item.at_risk }">
+                            <v-col cols="4">
+                                Complaint : {{ item.id }}<br/>
+                                <span class="text-caption">
+                                    Complaint Date : {{ item.complaint_date }}<br/>
+                                    Sales Order: {{ item.sop.doc_no }}<br/>
+                                </span>
+                            </v-col>
+                            <v-col cols="4" class="text-body-2">
+                                {{ item.customer.acc_no }} - {{ item.customer.name }}<br/>
+                                Reason : {{ item.reason }}<br/>
+                                Driver : {{ item.driver.name }}
+                            </v-col>
+                            <v-col cols=4>
+                                <div class="d-flex justify-space-around align-center flex-column flex-sm-row fill-height">
+                                    <v-row>
+                                        <v-icon icon="mdi-exclamation" v-if="item.at_risk" color="red" title="At Risk"></v-icon>
+                                        <v-icon icon="mdi-play" v-if="item.active" title="Active"></v-icon>
+                                    </v-row>
+                                    <v-btn @click="showInfo(item)" color="blue-lighten-1">View</v-btn>
+                                    <v-btn v-if="site_info.features.editcomplaint" color="orange-lighten-2">Edit</v-btn>
+                                </div>
+                            </v-col>
+                        </v-row>
+                        </RecycleScroller>
+                    </v-card>
+                </v-col>
+            </v-window-item>
+        </v-window>
+        <v-dialog v-model="showComplaintInfo">
+            <ComplaintInfo :in_complaint="selected_complaint" @return="doInfoReturn" />
+        </v-dialog>
 </template>
 <script>
 import axios from 'axios'
@@ -62,6 +71,7 @@ import ComplaintInfo from '@/components/ComplaintInfo.vue'
 export default {
     props: {
         site_info:{},
+        user_info:{}
     },
     components: {
         ComplaintInfo
@@ -105,16 +115,22 @@ export default {
         getComplaintsList(){
             this.loading = true
             let url = this.$api_url + "/customers/complaints/list"
-            console.log("Getting Complaint list...")
+            let c_id = this.$route.params.id || ""
+            console.log("Getting Contracts list..." + c_id)
             axios.get(url,{
                 params: {
                     limit: this.limit,
-                    query: this.searchQuery
+                    query: this.searchQuery,
+                    c_id: c_id
                 }
             }).then(resp => {
                 this.list = resp.data
-                this.loading = false
+                console.log(this.list)
                 this.listreceived = true
+            }).catch(err => {
+                console.log(err)
+            }).finally(() => {
+                this.loading = false
             })
         },
         showInfo(complaint) {
diff --git a/src/views/customers/CustomerList.vue b/src/views/customers/CustomerList.vue
index 62bf8af..2056329 100644
--- a/src/views/customers/CustomerList.vue
+++ b/src/views/customers/CustomerList.vue
@@ -1,6 +1,5 @@
 <template>
     <v-text-field 
-        clearable
         label="Search"
         variant="outlined"
         v-model="searchQuery"
@@ -22,27 +21,37 @@
                             key-field="acc_no"
                             v-slot="{ item }"
                             >
-                            <v-list-item >
-                                <template v-slot:title >
-                                    <v-card @click="getCustomerInfo(item)">
+                            <v-list-item  >
+                                <v-sheet class="clickable" @click="getCustomerInfo(item)" rounded :class="{ 'bg-error' : item.at_risk }">
+                                    <v-icon v-if="item.acc_no == selected_cust.acc_no">mdi-checkbox-marked-outline</v-icon>
+                                    <v-icon v-else>mdi-checkbox-blank-outline</v-icon>
                                         {{ item.acc_no }} - {{ item.name }}: 
                                         <span class="text-caption">{{ item.address.line_1 }}, {{ item.address.line_2 }}, <br/>
                                             {{ item.address.city }}, {{ item.address.county}}, {{ item.address.postcode }},
                                         </span>
-                                    </v-card>
+                                </v-sheet>
+                                <template v-slot:append>
+                                    <v-btn-toggle>
+                                        <v-btn @click.prevent="viewOrders(item)" color="blue-lighten-1" title="View Orders">
+                                            <v-icon>mdi-cart-outline</v-icon>
+                                        </v-btn>
+                                        <v-btn @click.prevent="goToContracts(item)" color="blue-lighten-1" title="View Contracts">
+                                            <v-icon>mdi-file-edit-outline</v-icon>
+                                            <v-badge v-if="item.contract_count > 0" color="blue-lighten-4" floating :content="item.contract_count">
+                                            </v-badge>
+                                        </v-btn>
+                                        <v-btn @click.prevent="goToMedFeeds(item)" color="orange-lighten-1" title="View Med Feeds">
+                                            <v-icon>mdi-pill</v-icon>
+                                            <v-badge v-if="item.medfeed_count > 0" color="orange-lighten-4" floating :content="item.medfeed_count">
+                                            </v-badge>
+                                        </v-btn>
+                                        <v-btn @click.prevent="goToComplaints(item)" color="orange-lighten-1" title="View Complaints">
+                                            <v-icon>mdi-exclamation-thick</v-icon>
+                                            <v-badge v-if="item.complaint_count > 0" color="red-lighten-4" floating :content="item.complaint_count">
+                                            </v-badge>
+                                        </v-btn>
+                                    </v-btn-toggle>
                                 </template>
-                    <template v-slot:append>
-                        <v-btn @click.prevent="goToContracts(item)" class="text-none" color="blue-lighten-1" title="View Contracts">
-                            Contracts
-                            <v-badge v-if="item.contract_count > 0" color="blue-lighten-4" floating :content="item.contract_count">
-                            </v-badge>
-                        </v-btn>
-                        <v-btn @click.prevent="goToMedFeeds(item)" class="text-none" color="orange-lighten-1" title="View Med Feeds">
-                            Med Feeds
-                            <v-badge v-if="item.medfeed_count > 0" color="orange-lighten-4" floating :content="item.medfeed_count">
-                            </v-badge>
-                        </v-btn>
-                    </template>
                             </v-list-item>
                     </RecycleScroller>
                 </v-list>
@@ -108,6 +117,12 @@ export default {
         goToMedFeeds(c){
             this.$router.push('/customers/medicated-feeds/list/' + c.id)
         },
+        goToComplaints(c){
+            this.$router.push('/customers/complaints/list/' + c.id)
+        },
+        viewOrders(c){
+            this.$router.push('/customers/orders/list/' + c.id)
+        },
         async getCustomerList() { 
             this.customers_loading = true
             let url = this.$api_url + "/customers/list"
@@ -126,7 +141,7 @@ export default {
     }
 }
 </script>
-<style>
+<style scoped>
 .scroller {
     height: 300px;
 }