feat(blockingData): 增加筛选功能并调整样式

- 在数据大屏页面添加日期、主管、班组长等筛选条件
- 调整模块标题和图表标题的字体大小、颜色和对齐方式
- 修改漏检列表中的区域选择器和时间选择器配置

src/views/blockingData/blockingDataScreen/components/ModuleContainer.vue

@@ -43,7 +43,7 @@ defineProps({
 }
 
 .module-title {
-  font-size: 20px;
+  font-size: 27px;
   font-weight: 600;
   color: #2E75B6;
   text-align: center;

src/views/blockingData/blockingDataScreen/components/ModuleFour.vue

@@ -202,10 +202,10 @@ onMounted(() => {
 }
 
 .chart-title {
-  font-size: 12px;
-  color: #333;
+  font-size: 17px;
+  color: black;
   margin-bottom: 5px;
-  text-align: center;
+  text-align: left;
 }
 
 .echarts {

src/views/blockingData/blockingDataScreen/components/ModuleOne.vue

@@ -553,11 +553,10 @@ onMounted(() => {
 }
 
 .chart-title {
-  font-size: 12px;
-  color: #333;
-  margin-bottom: 8px;
-  text-align: center;
-  font-weight: 500;
+  font-size: 17px;
+  color: black;
+  margin-bottom: 5px;
+  text-align: left;
 }
 
 .echarts {

src/views/blockingData/blockingDataScreen/components/ModuleThree.vue

@@ -83,11 +83,10 @@ onMounted(() => {
 }
 
 .chart-title {
-  font-size: 12px;
-  color: #333;
-  margin-bottom: 8px;
-  text-align: center;
-  font-weight: 500;
+ font-size: 17px;
+  color: black;
+  margin-bottom: 5px;
+  text-align: left;
 }
 
 .echarts {

src/views/blockingData/blockingDataScreen/index.vue

@@ -3,7 +3,62 @@
     <div class="screen-header">
       <div class="header-title">盛世鹰眸质控系统【查堵】（安检站）</div>
     </div>
-    
+
+    <div class="filter-section">
+      <div class="filter-row">
+        <div class="filter-item">
+          <span class="filter-label">日期：</span>
+          <el-date-picker v-model="filterParams.dateRange" type="daterange" range-separator="-" start-placeholder="开始日期"
+            end-placeholder="结束日期" value-format="YYYY-MM-DD HH:mm:ss" :default-time="defaultTime"
+            style="width: 280px" />
+        </div>
+
+        <div class="filter-item">
+          <span class="filter-label">分管主管：</span>
+          <el-select v-model="filterParams.supervisor" placeholder="请选择主管" filterable clearable style="width: 200px">
+            <el-option v-for="item in supervisorOptions" :key="item.value" :label="item.label" :value="item.value" />
+          </el-select>
+        </div>
+
+        <div class="filter-item">
+          <span class="filter-label">分管班组长：</span>
+          <el-select v-model="filterParams.teamLeader" placeholder="请选择班组长" filterable clearable style="width: 200px">
+            <el-option v-for="item in teamLeaderOptions" :key="item.value" :label="item.label" :value="item.value" />
+          </el-select>
+        </div>
+        <div class="filter-item">
+          <span class="filter-label">区域：</span>
+          <el-select v-model="filterParams.area" placeholder="请选择区域" clearable style="width: 200px">
+            <el-option label="整体" value="整体" />
+            <el-option label="T1" value="T1" />
+            <el-option label="T2" value="T2" />
+          </el-select>
+        </div>
+
+        <div class="filter-item">
+          <span class="filter-label">漏检物品：</span>
+          <el-select v-model="filterParams.missedItem" placeholder="请选择漏检物品" clearable style="width: 200px">
+            <el-option v-for="item in missedItemOptions" :key="item.value" :label="item.label" :value="item.value" />
+          </el-select>
+        </div>
+        <div class="filter-item">
+          <span class="filter-label">分大队：</span>
+          <el-select v-model="filterParams.brigade" placeholder="请选择大队" clearable style="width: 200px">
+            <el-option label="全站" value="全站" />
+            <el-option label="安检一大队" value="安检一大队" />
+            <el-option label="安检二大队" value="安检二大队" />
+            <el-option label="安检三大队" value="安检三大队" />
+          </el-select>
+        </div>
+        <div class="filter-actions">
+          <el-button type="primary" @click="handleFilter">查询</el-button>
+          <el-button @click="resetFilter">重置</el-button>
+        </div>
+      </div>
+
+
+    </div>
+
     <div class="screen-content">
       <div class="grid-layout">
         <div class="grid-item">
@@ -24,10 +79,91 @@
 </template>
 
 <script setup>
+import { ref, reactive, onMounted } from 'vue'
+import { listDept } from '@/api/system/dept'
 import ModuleOne from './components/ModuleOne.vue'
 import ModuleTwo from './components/ModuleTwo.vue'
 import ModuleThree from './components/ModuleThree.vue'
 import ModuleFour from './components/ModuleFour.vue'
+
+// 默认时间设置
+const defaultTime = [
+  new Date(2000, 1, 1, 0, 0, 0),
+  new Date(2000, 1, 1, 23, 59, 59)
+]
+
+// 筛选参数
+const filterParams = reactive({
+  dateRange: [],
+  supervisor: '',
+  teamLeader: '',
+  area: '',
+  missedItem: '',
+  brigade: ''
+})
+
+// 选项数据
+const supervisorOptions = ref([])
+const teamLeaderOptions = ref([])
+const missedItemOptions = ref([
+  { label: '物品A', value: '1' },
+  { label: '物品B', value: '2' },
+  { label: '物品C', value: '3' }
+])
+
+// 获取所有用户数据并筛选主管和班组长
+const fetchUserData = async () => {
+  try {
+    listDept({}).then(response => {
+      const deptList = response.data || []
+     
+      teamLeaderOptions.value = deptList.filter(item => item.deptType === 'TEAMS').map(item => ({
+        value: item.deptId,
+        label: item.deptName
+      }))
+      supervisorOptions.value = deptList.filter(item => item.deptType === 'MANAGER').map(item => ({
+        value: item.deptId,
+        label: item.deptName
+      }))
+    })
+  } catch (error) {
+    console.error('获取用户数据失败:', error)
+  }
+}
+
+// 设置默认日期范围（从年初1月1日到现在）
+const setDefaultDateRange = () => {
+  const now = new Date()
+  const startOfYear = new Date(now.getFullYear(), 0, 1, 0, 0, 0)
+  const endOfToday = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 23, 59, 59)
+
+  filterParams.dateRange = [startOfYear, endOfToday]
+}
+
+// 处理筛选
+const handleFilter = () => {
+  console.log('筛选参数:', filterParams)
+  // 这里可以调用API或更新图表数据
+}
+
+// 重置筛选
+const resetFilter = () => {
+  Object.assign(filterParams, {
+    dateRange: [],
+    supervisor: '',
+    teamLeader: '',
+    area: '',
+    missedItem: '',
+    brigade: ''
+  })
+  setDefaultDateRange()
+}
+
+// 组件挂载时设置默认日期和获取用户数据
+onMounted(() => {
+  setDefaultDateRange()
+  fetchUserData()
+})
 </script>
 
 <style lang="less" scoped>
@@ -46,7 +182,7 @@ import ModuleFour from './components/ModuleFour.vue'
   align-items: center;
   justify-content: space-between;
   padding: 0 30px;
- 
+
   // border-bottom: 2px solid rgba(112, 207, 231, 0.5);
 }
 
@@ -57,10 +193,42 @@ import ModuleFour from './components/ModuleFour.vue'
   // text-shadow: 0 0 10px rgba(112, 207, 231, 0.5);
 }
 
+.filter-section {
+  // background: #f8f9fa;
+  padding: 20px 30px;
+  border-bottom: 1px solid #e8e8e8;
+}
 
+.filter-row {
+  display: flex;
+  align-items: center;
+  gap: 20px;
+  margin-bottom: 15px;
+
+  &:last-child {
+    margin-bottom: 0;
+  }
+}
 
+.filter-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
 
+.filter-label {
+  font-size: 14px;
+  color: #606266;
+  font-weight: 500;
+  white-space: nowrap;
+}
 
+.filter-actions {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  margin-left: auto;
+}
 
 .screen-content {
   flex: 1;
@@ -76,7 +244,6 @@ import ModuleFour from './components/ModuleFour.vue'
 }
 
 .grid-item {
- 
   width: 100%;
 }
 </style>

src/views/blockingData/missedInspectionList/index.vue

@@ -120,7 +120,7 @@
           <el-col :span="12">
             <el-form-item label="区域" prop="areaId">
               <el-select v-model="form.areaId" placeholder="请选择区域" style="width: 100%">
-                <el-option v-for="item in areaOptions" :key="item.code" :label="item.name" :value="item.positionId" />
+                <el-option v-for="item in areaOptions" :key="item.id" :label="item.name" :value="item.id" />
               </el-select>
             </el-form-item>
           </el-col>
@@ -143,7 +143,7 @@
         <el-row :gutter="20">
           <el-col :span="12">
             <el-form-item label="漏检时间" prop="missCheckTime">
-              <el-time-picker v-model="form.missCheckTime" placeholder="请选择漏检时间" value-format="HH:mm"
+              <el-date-picker v-model="form.missCheckTime" type="datetime" placeholder="请选择漏检时间" value-format="YYYY-MM-DD HH:mm"
                 style="width: 100%" />
             </el-form-item>
           </el-col>
@@ -160,8 +160,8 @@
           <el-col :span="12">
             <el-form-item label="上岗位置" prop="channelId">
               <el-select v-model="form.channelId" placeholder="请选择上岗位置" style="width: 100%">
-                <el-option v-for="item in channelOptions" :key="item.code" :label="item.name"
-                  :value="item.positionId" />
+                <el-option v-for="item in channelOptions" :key="item.id" :label="item.name"
+                  :value="item.id" />
               </el-select>
             </el-form-item>
           </el-col>