diff --git a/src/api/model/device.js b/src/api/model/device.js
index 07f8fd5..de0a582 100644
--- a/src/api/model/device.js
+++ b/src/api/model/device.js
@@ -66,4 +66,21 @@ export function getUuid(){
     url: '/model/dcBaseDeviceinfo/getUuid',
     method: 'post',
   })
-}
\ No newline at end of file
+}
+
+//获取字段筛选项
+export function getfilterItem(){
+  return request({
+    url: '/model/dcBaseDeviceinfo/getfilterItem',
+    method: 'get',
+  })
+}
+
+//获取列表带筛选值
+export function listWithFilterColumn(data){
+  return request({
+    url: '/model/dcBaseDeviceinfo/listWithFilterColumn',
+    method: 'post',
+    data: data
+  });
+}
diff --git a/src/views/model/device/index.vue b/src/views/model/device/index.vue
index a0ddbbf..306a1fc 100644
--- a/src/views/model/device/index.vue
+++ b/src/views/model/device/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="app-container">
-    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="120px">
+    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="100px" class="my-custom-form">
       <el-row>
         <el-col :span="4">
           <el-form-item label="中台设备编码" prop="centerDeviceCode">
@@ -160,8 +160,8 @@
           </el-form-item>
         </el-col>
         <el-col :span="4" v-show="collapseVisible">
-          <el-form-item label="设备分组" prop="deviceGroupId">
-            <el-select v-model="queryParams.deviceGroupId" placeholder="请选择设备分组ID" clearable>
+          <el-form-item label="设备分组" prop="deviceGroupName">
+            <el-select v-model="queryParams.deviceGroupName" placeholder="请选择设备分组ID" clearable>
               <el-option label="请添加设备分组" value="" />
             </el-select>
           </el-form-item>
@@ -212,39 +212,46 @@
       <right-toolbar v-model:showSearch="showSearch" @queryTable="getList">
       </right-toolbar>
     </el-row>
-    <el-table v-loading="loading" :data="deviceList" @selection-change="handleSelectionChange" :max-height="tableHeight" :border="true" :column-width-draggable="true">
+    <el-table ref="deviceTable" v-loading="loading" :data="deviceList" @selection-change="handleSelectionChange" @sort-change="sortChange" @filter-change="filterChange" :max-height="tableHeight" :border="true" :column-width-draggable="true">
       <el-table-column type="selection" width="55" align="center" fixed="left"/>
-      <el-table-column label="中台设备编码" align="center" prop="centerDeviceCode" :width="120"/>
-      <el-table-column label="设备名称" align="center" prop="deviceName" :width="120"/>
-      <el-table-column label="通讯来源类型" align="center" prop="deviceSource" :width="120"/>
-      <el-table-column label="是否可用" align="center" prop="enabledFlag" :width="120">
+      <el-table-column label="中台设备编码" align="center" prop="centerDeviceCode" :width="150"/>
+      <el-table-column label="设备名称" align="center" prop="deviceName" :width="120" sortable/>
+      <el-table-column label="通讯来源类型" align="center" prop="deviceSource" :width="150" column-key="deviceSource" filter-placement="bottom-end"
+        :filters="getfilterNameItem('deviceSource')" :filter-method="filterMethod" sortable/>
+      <el-table-column label="是否可用" align="center" prop="enabledFlag" :width="120" column-key="enabledFlag" filter-placement="bottom-end"
+        :filters="getfilterNameItem('enabledFlag')" :filter-method="filterMethod" sortable>
         <template #default="scope">
           <dict-tag :options="enabledFlagTable" :value="scope.row.enabledFlag"/>
         </template>
       </el-table-column>
-      <el-table-column label="设备类型" align="center" prop="deviceType" :width="120">
+      <el-table-column label="设备类型" align="center" prop="deviceType" :width="120" column-key="deviceType" filter-placement="bottom-end"
+        :filters="getfilterNameItem('deviceType')" :filter-method="filterMethod" sortable>
         <template #default="scope">
           <dict-tag :options="dc_device_type" :value="scope.row.deviceType"/>
         </template>
       </el-table-column>
-      <el-table-column label="所属组织名称" align="center" prop="orgName" :width="120" />
-      <el-table-column label="位置编码" align="center" prop="locationCode" :width="120"/>
-      <el-table-column label="位置名称" align="center" prop="locationName" :width="120"/>
-      <el-table-column label="设备应用范围" align="center" prop="deviceClass" :width="120"/>
-      <el-table-column label="接口名称" align="center" prop="apiName" :width="120"/>
-      <el-table-column label="服务器地址" align="center" prop="serverIp" :width="120"/>
-      <el-table-column label="从属网关ID" align="center" prop="gatewayId" :width="120"/>
-      <el-table-column label="纬度" align="center" prop="latValue" :width="120"/>
-      <el-table-column label="经度" align="center" prop="lagValue" :width="120"/>
-      <el-table-column label="是否告警" align="center" prop="alertEnabled" :width="120">
+      <el-table-column label="所属组织名称" align="center" prop="orgName" :width="150" sortable/>
+      <el-table-column label="位置编码" align="center" prop="locationCode" :width="120" sortable/>
+      <el-table-column label="位置名称" align="center" prop="locationName" :width="120" sortable/>
+      <el-table-column label="设备应用范围" align="center" prop="deviceClass" :width="150" sortable/>
+      <el-table-column label="接口名称" align="center" prop="apiName" :width="120" sortable/>
+      <el-table-column label="服务器地址" align="center" prop="serverIp" :width="120" sortable/>
+      <el-table-column label="从属网关ID" align="center" prop="gatewayId" :width="120" sortable/>
+      <el-table-column label="纬度" align="center" prop="latValue" :width="120" sortable/>
+      <el-table-column label="经度" align="center" prop="lagValue" :width="120" sortable/>
+      <el-table-column label="是否告警" align="center" prop="alertEnabled" :width="120" column-key="alertEnabled" filter-placement="bottom-end"
+        :filters="getfilterNameItem('alertEnabled')" :filter-method="filterMethod" sortable>
         <template #default="scope">
           <dict-tag :options="alertEnabledTable" :value="scope.row.alertEnabled"/>
         </template>
       </el-table-column>
-      <el-table-column label="设备模型" align="center" prop="deviceModelId" :width="120">
+      <el-table-column label="设备模型" align="center" prop="deviceModelId" :width="120" column-key="deviceModelId" filter-placement="bottom-end"
+        :filters="getfilterNameItem('deviceModelId')" :filter-method="filterMethod" sortable>
       </el-table-column>
-      <el-table-column label="租户号" align="center" prop="tentantId" :width="120"/>
-      <el-table-column label="设备分组" align="center" prop="deviceGroupId" :width="120"/>
+      <el-table-column label="租户号" align="center" prop="tentantId" :width="120" sortable/>
+      <el-table-column label="设备分组" align="center" prop="deviceGroupName" :width="120"  column-key="deviceGroupName" filter-placement="bottom-end"
+        :filters="getfilterNameItem('deviceGroupName')" :filter-method="filterMethod" sortable/>
+      <el-table-column label="设备排序" align="center" prop="sort" :width="120" sortable/>
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width"  :width="300" :fixed="fixedColumns?'right':false">
         <template #header>
           <div class="fixed-column-header"  style="text-align: center;display: block;" @dblclick="toggleFixedColumns">
@@ -273,8 +280,8 @@
     <pagination
       v-show="total>0"
       :total="total"
-      v-model:page="queryParams.pageNum"
-      v-model:limit="queryParams.pageSize"
+      v-model:page="params.pageNum"
+      v-model:limit="params.pageSize"
       @pagination="getList"
     />
 
@@ -328,7 +335,7 @@
           </el-col>
           <el-col :span="12">
             <el-form-item label="设备类型" prop="deviceType">
-              <el-select v-model="form.deviceTypeId" placeholder="请选择设备类型">
+              <el-select v-model="form.deviceType" placeholder="请选择设备类型">
                 <el-option
                   v-for="dict in dc_device_type"
                   :key="dict.value"
@@ -415,12 +422,17 @@
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="设备分组" prop="deviceGroupId">
-              <el-select v-model="form.deviceGroupId" placeholder="请选择设备分组ID">
+            <el-form-item label="设备分组" prop="deviceGroupName">
+              <el-select v-model="form.deviceGroupName" placeholder="请选择设备分组ID">
                 <el-option label="请选择字典生成" value="" />
               </el-select>
             </el-form-item>
           </el-col>
+          <el-col :span="12">
+            <el-form-item label="设备排序" prop="sort">
+              <el-input v-model="form.sort" placeholder="请输入租户号" />
+            </el-form-item>
+          </el-col>
         </el-row>
       </el-form>
       <template #footer>
@@ -447,9 +459,16 @@
       margin-right: 5px;
     }
   }
+  .my-custom-form .el-form-item {
+      .el-select{
+        width:100%;
+      }
+      margin-right: 0 !important;
+      width: 96%;
+  }
 </style>
 <script setup name="Device">
-import { getUuid, listDevice, getDevice, delDevice, addDevice, updateDevice } from "@/api/model/device";
+import { getUuid, listDevice, getDevice, delDevice, addDevice, updateDevice, listWithFilterColumn } from "@/api/model/device";
 import { deptTreeSelect } from "@/api/system/user";
 import lock from "@/assets/icons/svg/lock.svg";
 import { ref,onMounted,onUnmounted } from "vue";
@@ -471,7 +490,10 @@ const deptOptions = ref([]);
 const disabled = ref(false);
 const fixedColumns = ref(true);
 const tableHeight = ref("0px");
-const pageSize = ref(10);
+const sortItemMap = ref({});
+const queryParamFilter = ref({});
+const sortProps = ref([]);
+
 const enabledFlag = ref([
   {label: '可用', value: true, elTagType: 'default', elTagClass: null}, 
   {label: '不可用', value: false, elTagType: 'default', elTagClass: null}
@@ -491,9 +513,11 @@ const alertEnabledTable = ref([
 
 const data = reactive({
   form: {},
-  queryParams: {
+  params: {
     pageNum: 1,
     pageSize: 10,
+  },
+  queryParams: {
     centerDeviceCode: null,
     deviceName: null,
     deviceSource: null,
@@ -514,7 +538,7 @@ const data = reactive({
     alertEnabled: null,
     deviceModelId: null,
     tentantId: null,
-    deviceGroupId: null
+    deviceGroupName: null
   },
   rules: {
     deviceName: [
@@ -541,14 +565,23 @@ const data = reactive({
   }
 });
 
-const { queryParams, form, rules } = toRefs(data);
+const { queryParams, form, rules, params } = toRefs(data);
 
 /** 查询设备信息列表 */
 function getList() {
   loading.value = true;
-  listDevice(queryParams.value).then(response => {
-    deviceList.value = response.rows;
-    total.value = response.total;
+  let param = {
+    "obj":queryParams.value,
+    "params":queryParamFilter.value,
+    "sort":sortProps.value,
+    "pageNum": params.value.pageNum,
+    "pageSize": params.value.pageSize,
+  }
+  listWithFilterColumn(param).then(response => {
+    deviceList.value = response.data.tableData.rows;
+    total.value = response.data.tableData.total;
+    sortItemMap.value = response.data.filter;
+    queryParamFilter.value = new Object();
     loading.value = false;
   });
 }
@@ -592,20 +625,24 @@ function reset() {
     deleteBy: null,
     deleteTime: null,
     id: null,
-    deviceGroupId: null
+    deviceGroupName: null
   };
   proxy.resetForm("deviceRef");
 }
 
 /** 搜索按钮操作 */
 function handleQuery() {
-  queryParams.value.pageNum = 1;
+  params.value.pageNum = 1;
   getList();
 }
 
 /** 重置按钮操作 */
 function resetQuery() {
   proxy.resetForm("queryRef");
+  proxy.$refs.deviceTable.clearSort();
+  proxy.$refs.deviceTable.clearFilter();
+  queryParamFilter.value = new Object();
+  sortProps.value = new Array();
   handleQuery();
 }
 
@@ -768,6 +805,117 @@ const calculateTableHeight = () => {
   });
 };
 
+function getfilterNameItem(value){
+  console.log("sortItemMap");
+  console.log(sortItemMap);
+  let result = '';
+  let resultItem = new Object();
+  if(value==='enabledFlag'){
+    if(sortItemMap.value[value]?.length>0){
+      result = sortItemMap.value[value].map(element=>{
+        enabledFlag.value.forEach(item=>{
+          if(item.value===element.text){
+            resultItem = item.label;
+          }
+        });
+        return {
+          text: resultItem,
+          value: element.value,
+        };
+      });
+    }
+  }else if(value==='alertEnabled'){
+    if(sortItemMap.value[value]?.length>0){
+      result = sortItemMap.value[value].map(element=>{
+        alertEnabled.value.forEach(item=>{
+          if(item.value===element.text){
+            resultItem = item.label;
+          }
+        });
+        return {
+          text: resultItem,
+          value: element.value,
+        };
+      });
+    }
+  }else if(value==='deviceType'){
+    if(sortItemMap.value[value]?.length>0){
+      result = sortItemMap.value[value].map(element=>{
+        dc_device_type.value.forEach(item=>{
+          if(item.value===String(element.text)){
+            resultItem = item.label;
+          }
+        });
+        return {
+          text: resultItem,
+          value: element.value,
+        };
+      });
+    }
+  }else{
+    result = sortItemMap.value[value];
+  }
+  return result;
+}
+
+
+function filterChange(filterItem) {
+  const outerObjectKeys = Object.keys(filterItem);
+  if(outerObjectKeys.length===1){
+    queryParamFilter.value[outerObjectKeys[0]] = filterItem[outerObjectKeys[0]];
+  }
+  
+  loading.value = true;
+  let param = {
+    "obj":queryParams.value,
+    "params":queryParamFilter.value,
+    "sort":sortProps.value,
+    "pageNum": params.value.pageNum,
+    "pageSize": params.value.pageSize,
+  }
+  listWithFilterColumn(param).then(response => {
+    deviceList.value = response.data.tableData.rows;
+    total.value = response.data.tableData.total;
+    sortItemMap.value = response.data.filter;
+    queryParamFilter.value = new Object();
+    loading.value = false;
+  });
+
+}
+
+function filterMethod(value, row, column){
+  if(column==null){
+    return;
+  }
+  if(queryParamFilter.value[column.property] == null || queryParamFilter.value[column.property].length==0){
+    queryParamFilter.value[column.property]=[];
+    queryParamFilter.value[column.property].push(value);
+  }else{
+    let flag = false;
+    queryParamFilter.value[column.property].forEach(item=>{
+      if(item==value){
+        flag = true;
+      }
+    })
+    if(!flag){
+      queryParamFilter.value[column.property].push(value);    
+    }
+    
+  }
+  
+}
+
+function sortChange({column, prop, order }){
+  if(column==null){
+    return;
+  }
+  sortProps.value = sortProps.value.filter(item => item.prop !== prop);
+  if(order!=null){
+    sortProps.value.push({prop:prop,order:order});
+  }
+  getList();
+}
+
 getDeptTree();
 getList();
-</script>
+</script>
\ No newline at end of file