Fix ws and device page

pages/admin/gps/users/index.vue

@@ -33,6 +33,30 @@
     <CustomSubHeader>
       <CBreadcrumb class="border-0 mb-0"> کاربران جی پی اس </CBreadcrumb>
     </CustomSubHeader>
+
+    <CCard>
+      <CCardHeader>
+        <slot name="header">
+          <i class="fas fa-filter"></i>
+          <b>فیلتر ها</b>
+        </slot>
+      </CCardHeader>
+
+      <CCardBody>
+        <CRow>
+          <CCol sm="12">
+            <h4>جستجو در لیست:</h4>
+            <el-input
+              v-model="filterText"
+              clearable
+              placeholder="نام - شماره موبایل - کد ملی - استان - شهر"
+              style="display: inline-block; max-width: 500px; margin-top: 8px"
+            ></el-input>
+          </CCol>
+        </CRow>
+      </CCardBody>
+    </CCard>
+
     <CCard>
       <CCardHeader>
         <slot name="header">
@@ -42,7 +66,7 @@
       </CCardHeader>
 
       <CCardBody>
-        <el-table :data="users" style="width: 100%">
+        <el-table :data="filteredItems" style="width: 100%">
           <el-table-column type="index" label="#"> </el-table-column>
 
           <el-table-column prop="first_name" label="نام" width="200px"> </el-table-column>
@@ -96,7 +120,9 @@ export default {
     return {
       users: [],
       centerDialogVisible: false,
-      user: {}
+      user: {},
+     filterText :''
+
     }
   },
 
@@ -106,6 +132,23 @@ export default {
     },
     usersTypeList() {
       return this.$route.query?.type
+    },
+    filteredItems() {
+      const filterText = this.filterText
+      if (!this.filterText.length) return this.users
+      else {
+        return this.users.filter(item => {
+          return (
+            item.first_name.includes(filterText) ||
+            item.last_name.includes(filterText) ||
+            item.mobile_number.includes(filterText) ||
+            item.national_code.includes(filterText) ||
+            item.province_name?.includes(filterText) ||
+            item.city_name?.includes(filterText) ||
+            (item.first_name + ' ' + item.last_name).includes(filterText)
+          )
+        })
+      }
     }
   },
   watch: {