style：甘特图菜单添加设备筛选框

src/views/mes/ganttChart/index.vue

@@ -12,6 +12,11 @@
           class="!w-360px"
         />
       </el-form-item>
+      <el-form-item label="设备" prop="deviceIds">
+        <el-select v-model="queryParams.deviceIds" placeholder="请选择设备" clearable multiple collapse-tags class="!w-240px">
+          <el-option v-for="item in deviceOptions" :key="item.value" :label="item.label" :value="item.value" />
+        </el-select>
+      </el-form-item>
       <el-form-item>
         <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" />查询</el-button>
         <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" />重置</el-button>
@@ -21,7 +26,7 @@
 
   <ContentWrap>
     <div v-loading="loading">
-      <ScheduleGanttPanel :schedule-list="scheduleList" :editable="false" height="calc(100vh - 320px)" />
+      <ScheduleGanttPanel :schedule-list="filteredList" :editable="false" height="calc(100vh - 320px)" />
     </div>
   </ContentWrap>
 </template>
@@ -68,7 +73,20 @@ const buildDefaultRange = () => {
 const queryRange = ref<string[]>(buildDefaultRange())
 const queryParams = reactive({
   startTime: queryRange.value[0],
-  endTime: queryRange.value[1]
+  endTime: queryRange.value[1],
+  deviceIds: [] as (string | number)[]
+})
+
+const deviceOptions = computed(() =>
+  scheduleList.value.map((device) => ({
+    label: device.deviceName,
+    value: device.deviceId
+  }))
+)
+
+const filteredList = computed(() => {
+  if (!queryParams.deviceIds.length) return scheduleList.value
+  return scheduleList.value.filter((device) => queryParams.deviceIds.includes(device.deviceId))
 })
 
 const getList = async () => {