feat(portraitManagement): 完善各层级人事画像大屏功能

1. 为SearchBar新增deptType参数，适配不同层级部门搜索选择
2. 重构站点画像运行数据页面，移除静态模拟数据改为动态接口获取
3. 迁移部门/团队/小组画像的统计组件到运行数据页，精简profile组件代码
4. 新增部门/团队/小组画像的动态数据获取逻辑

src/views/portraitManagement/components/SearchBar.vue

@@ -1,44 +1,40 @@
 <template>
   <div class="ep-topbar" @click="visible = false">
     <div class="time-btns">
-      <div :class="currentTime==='week' ? 'primary' : 'default'" @click="selectTime('week')">近一周</div>
-      <div :class="currentTime==='month' ? 'primary' : 'default'" @click="selectTime('month')">近一月</div>
-      <div :class="currentTime==='quarter' ? 'primary' : 'default'" @click="selectTime('quarter')">近三月</div>
-      <div :class="currentTime==='year' ? 'primary' : 'default'" @click="selectTime('year')">近一年</div>
-      <div :class="currentTime==='custom' ? 'primary' : 'default'" @click="selectTime('custom')">自定义时间范围</div>
-      <div class="custom-style-date-picker-wrap" v-if="currentTime==='custom'">
-        <el-date-picker
-          class="custom-style-date-picker"
-          v-model="dateRange"
-          type="daterange"
-          range-separator="至"
-          start-placeholder="开始"
-          end-placeholder="结束"
-          style="width:320px"
-          @change="() => searchHandler()"
-        />
+      <div :class="currentTime === 'week' ? 'primary' : 'default'" @click="selectTime('week')">近一周</div>
+      <div :class="currentTime === 'month' ? 'primary' : 'default'" @click="selectTime('month')">近一月</div>
+      <div :class="currentTime === 'quarter' ? 'primary' : 'default'" @click="selectTime('quarter')">近三月</div>
+      <div :class="currentTime === 'year' ? 'primary' : 'default'" @click="selectTime('year')">近一年</div>
+      <div :class="currentTime === 'custom' ? 'primary' : 'default'" @click="selectTime('custom')">自定义时间范围</div>
+      <div class="custom-style-date-picker-wrap" v-if="currentTime === 'custom'">
+        <el-date-picker class="custom-style-date-picker" v-model="dateRange" type="daterange" range-separator="至"
+          start-placeholder="开始" end-placeholder="结束" style="width:320px" @change="() => searchHandler()" />
       </div>
     </div>
     <el-popover class="popover" title="" :visible="visible" placement="bottom-start" trigger="click" width="45vw">
       <template #reference>
-        <div class="primary" style="border-radius: 6px;" @click.stop="visible = !visible">组织架构/模糊搜索</div>
+        <div class="primary" style="border-radius: 6px;" @click.stop="visible = !visible">{{ props.deptType === 'user' ?
+          '组织架构/模糊搜索' : '部门选择' }}</div>
       </template>
 
       <div class="custom-el-style">
         <div>
-          <el-autocomplete v-model="personName" :fetch-suggestions="queryUsers" placeholder="搜索员工/团队画像" style="width:320px;" clearable>
-            <template #suffix
-              ><el-icon><Search /></el-icon
-            ></template>
+          <el-autocomplete v-model="personName" :fetch-suggestions="props.deptType === 'user' ? queryUsers : queryDept"
+            :placeholder="props.deptType === 'user' ? '搜索员工/团队画像' : '搜索部门'" style="width:320px;" clearable>
+            <template #suffix><el-icon>
+                <Search />
+              </el-icon></template>
             <template #default="{ item }">
-              <span>{{ item.nickName }}</span>
-              <span v-if="item.deptName" style="font-size:12px;color:#999;margin-left:8px">{{ item.deptName }}</span>
+              <span>{{ item.nickName || item.deptName }}</span>
+              <span v-if="item.deptName && item.nickName" style="font-size:12px;color:#999;margin-left:8px">{{
+                item.deptName }}</span>
             </template>
           </el-autocomplete>
           <div class="primary" style="border-radius: 6px;" @click="() => searchHandler()">模糊搜索</div>
         </div>
         <div style="margin-top: 20px;">
-          <el-tree :data="departments" :default-expanded-keys="[100]" :props="{ value: 'id', showPrefix: false }" accordion @node-click="handleNodeClick" />
+          <el-tree :data="departments" :default-expanded-keys="[100]" :props="{ value: 'id', showPrefix: false }"
+            accordion @node-click="handleNodeClick" />
         </div>
       </div>
     </el-popover>
@@ -48,7 +44,15 @@
 <script setup>
 import { onMounted, onUnmounted } from 'vue'
 import { searchPortraitUsers } from '@/api/score/index'
-import { getDeptUserTree } from '@/api/item/items'
+import { getDeptList } from '@/api/item/items'
+import { listDept } from '@/api/system/dept'
+
+const props = defineProps({
+  deptType: {
+    type: String,
+    default: 'user'
+  }
+})
 
 const visible = defineModel('visible', false)
 const emit = defineEmits(['search'])
@@ -65,6 +69,31 @@ const queryUsers = async (query, cb) => {
   } catch (_) { cb([]) }
 }
 
+const queryDept = async (query, cb) => {
+  if (!query?.trim()) { cb([]); return }
+  try {
+    const res = await listDept({ deptName: query.trim(), deptType: props.deptType })
+    cb((res.data || []).map(d => ({ ...d, value: d.deptName })))
+  } catch (_) { cb([]) }
+}
+
+const filterDeptTree = (data, targetType) => {
+  const filterNode = (node) => {
+    if (node.deptType === targetType) {
+      return { ...node, children: undefined }
+    }
+    if (node.children && node.children.length > 0) {
+      const filteredChildren = node.children.map(child => filterNode(child)).filter(Boolean)
+      if (filteredChildren.length > 0) {
+        return { ...node, children: filteredChildren }
+      }
+    }
+    return null
+  }
+
+  return data.map(node => filterNode(node)).filter(Boolean)
+}
+
 const getTimeRange = () => {
   if (currentTime.value === 'custom') {
     if (dateRange.value?.length === 2) {
@@ -73,16 +102,16 @@ const getTimeRange = () => {
     return {}
   }
   const end = new Date(), begin = new Date()
-  if (currentTime.value === 'week') begin.setDate(end.getDate()-7)
-  else if (currentTime.value === 'month') begin.setMonth(end.getMonth()-1)
-  else if (currentTime.value === 'quarter') begin.setMonth(end.getMonth()-3)
-  else begin.setFullYear(end.getFullYear()-1)
+  if (currentTime.value === 'week') begin.setDate(end.getDate() - 7)
+  else if (currentTime.value === 'month') begin.setMonth(end.getMonth() - 1)
+  else if (currentTime.value === 'quarter') begin.setMonth(end.getMonth() - 3)
+  else begin.setFullYear(end.getFullYear() - 1)
   return { beginTime: formatDate(begin), endTime: formatDate(end) }
 }
 
 const formatDate = (d) => {
   const dt = new Date(d)
-  return `${dt.getFullYear()}-${String(dt.getMonth()+1).padStart(2,'0')}-${String(dt.getDate()).padStart(2,'0')}`
+  return `${dt.getFullYear()}-${String(dt.getMonth() + 1).padStart(2, '0')}-${String(dt.getDate()).padStart(2, '0')}`
 }
 
 const selectTime = (t) => {
@@ -91,15 +120,37 @@ const selectTime = (t) => {
 }
 
 const searchHandler = (query = {}) => {
-  const queryParams = { ...getTimeRange(), personName: personName.value, ...query }
-  if (queryParams.personName) {
+  const queryParams = { ...getTimeRange(), ...query }
+  if (props.deptType === 'user') {
+    if (queryParams.personName) {
+      emit('search', queryParams)
+    }
+  } else {
     emit('search', queryParams)
   }
 }
 
 const handleNodeClick = (node) => {
-  if (node.nodeType === 'user') {
-    searchHandler({ personName: node.label })
+  if (props.deptType === 'user') {
+    if (node.nodeType === 'user') {
+      personName.value = node.label
+      searchHandler({ personName: node.label })
+    }
+  } else {
+    if (node.deptType === props.deptType) {
+      personName.value = node.deptName || node.name || node.label;
+      let obj = {}
+      if(props.deptType === 'BRIGADE') {
+        obj = { deptId: node.deptId || node.id }
+      } 
+      if(props.deptType === 'MANAGER') {
+        obj = { teamId: node.deptId || node.id }
+      }
+      if(props.deptType === 'TEAMS') {
+        obj = { groupId: node.deptId || node.id }
+      }
+      searchHandler(obj)
+    }
   }
 }
 
@@ -126,17 +177,20 @@ const resetStyle = () => {
 
 onMounted(async () => {
   setStyle()
-  const res = await getDeptUserTree()
-  departments.value = res.data
+  const res = await getDeptList({ deptType: props.deptType })
+  if (props.deptType === 'user') {
+    departments.value = res.data
+  } else {
+    departments.value = filterDeptTree(res.data, props.deptType)
+  }
 })
 onUnmounted(() => {
   resetStyle()
 })
 
 defineExpose({
-  getDefQuery () {
+  getDefQuery() {
     return {
-      personName: '',
       ...getTimeRange()
     }
   }
@@ -160,21 +214,25 @@ defineExpose({
     gap: 10px;
     flex-wrap: wrap;
     margin-right: 40px;
-    & > div {
+
+    &>div {
       padding: 8px 24px;
       border-radius: 28px;
       font-weight: 500;
     }
   }
+
   .primary {
     background: linear-gradient(125deg, #2AB3E6, #9605FC);
     color: #fff;
     padding: 8px 24px;
   }
+
   .default {
     background: #1C1936;
     color: #4C4C93;
     position: relative;
+
     &::before {
       content: '';
       position: absolute;
@@ -186,12 +244,14 @@ defineExpose({
       opacity: 0.5;
     }
   }
+
   .custom-style-date-picker-wrap {
     position: relative;
     border-radius: 19px;
     height: 38px;
     padding: 0 !important;
     --el-text-color-primary: #fff;
+
     &::before {
       content: '';
       position: absolute;
@@ -207,53 +267,60 @@ defineExpose({
 </style>
 
 <style lang="scss">
-  .custom-el-style {
-    width:100%;
-    padding: 10px;
-    position: relative;
-    background: #1c1936;
-    border-radius: 8px;
-    --el-text-color-regular: #fff;
-    --el-fill-color-blank: #17122A;
-    --el-border-color: linear-gradient(150deg, #0f46fa 0%, #bd03fb 100%);
-    --el-border-color-hover: linear-gradient(150deg, #0f46fa 0%, #bd03fb 100%);
-    .primary {
-      background: linear-gradient(125deg, #2AB3E6, #9605FC);
-      color: #fff;
-      padding: 6px 20px;
-      display: inline-block;
-      margin-left: 15px;
-    }
-    &::before {
-      content: '';
-      position: absolute;
-      inset: -2px;
-      border-radius: 10px;
-      background: linear-gradient(150deg, #0f46fa 0%, #0f46fa 10%, #020E15, #020E15, #020E15, #bd03fb 90%, #bd03fb 100%);
-      filter: brightness(2) contrast(150%);
-      z-index: -2;
-      opacity: 0.5;
-    }
-    .el-input__wrapper {
-    }
-    .el-tree {
-      background-color: #1c1936;
-      color: #fff;
-      .el-tree-node__content {
-        --el-tree-node-hover-bg-color: #5c676d;
-      }
-    }
-  }
-  .el-autocomplete-suggestion {
-    background: #17122A;
+.custom-el-style {
+  width: 100%;
+  padding: 10px;
+  position: relative;
+  background: #1c1936;
+  border-radius: 8px;
+  --el-text-color-regular: #fff;
+  --el-fill-color-blank: #17122A;
+  --el-border-color: linear-gradient(150deg, #0f46fa 0%, #bd03fb 100%);
+  --el-border-color-hover: linear-gradient(150deg, #0f46fa 0%, #bd03fb 100%);
+
+  .primary {
+    background: linear-gradient(125deg, #2AB3E6, #9605FC);
+    color: #fff;
+    padding: 6px 20px;
+    display: inline-block;
+    margin-left: 15px;
   }
-  .custom-style-date-picker {
-    background: #1C1936 !important;
-    box-shadow: none !important;
-    height: 38px !important;
-    border-radius: 19px;
+
+  &::before {
+    content: '';
+    position: absolute;
+    inset: -2px;
+    border-radius: 10px;
+    background: linear-gradient(150deg, #0f46fa 0%, #0f46fa 10%, #020E15, #020E15, #020E15, #bd03fb 90%, #bd03fb 100%);
+    filter: brightness(2) contrast(150%);
+    z-index: -2;
+    opacity: 0.5;
   }
-  .el-popper {
-    --el-popover-padding: 0px;
+
+  .el-input__wrapper {}
+
+  .el-tree {
+    background-color: #1c1936;
+    color: #fff;
+
+    .el-tree-node__content {
+      --el-tree-node-hover-bg-color: #5c676d;
+    }
   }
+}
+
+.el-autocomplete-suggestion {
+  background: #17122A;
+}
+
+.custom-style-date-picker {
+  background: #1C1936 !important;
+  box-shadow: none !important;
+  height: 38px !important;
+  border-radius: 19px;
+}
+
+.el-popper {
+  --el-popover-padding: 0px;
+}
 </style>

src/views/portraitManagement/deptProfile/component/profile.vue

@@ -26,33 +26,6 @@
           :chartData3="postData"
         />
       </div>
-
-      <div class="content-row">
-        <ProfilePassRate
-          :chartData1="passRatePassData"
-          :chartData2="passRateLineData"
-        />
-      </div>
-
-      <div class="content-row">
-        <ProfileSeizedInfo :chartData1="seizedTotal" />
-        <ProfileSeizedDistribution :chartData1="seizedDistributionData" />
-      </div>
-
-      <div class="content-row">
-        <ProfileDailySeizedLine :chartData1="dailyLineData" />
-        <ProfileDailySeizedArea
-          :chartData1="dailyAreaPersonA"
-          :chartData2="dailyAreaPersonB"
-          :chartData3="dailyAreaPersonC"
-          :chartData4="dailyAreaPersonD"
-          :chartData5="dailyAreaPersonE"
-        />
-      </div>
-
-      <div class="content-row">
-        <ProfileDailySeizedBar :chartData1="dailyBarData" />
-      </div>
     </div>
   </div>
 </template>
@@ -63,12 +36,6 @@ import ProfileRadar from '../../components/ProfileRadar.vue'
 import ProfileMembers from '../../components/ProfileMembers.vue'
 import ProfileBasicDistribution from '../../components/ProfileBasicDistribution.vue'
 import ProfilePositionDistribution from '../../components/ProfilePositionDistribution.vue'
-import ProfilePassRate from '../../components/ProfilePassRate.vue'
-import ProfileSeizedInfo from '../../components/ProfileSeizedInfo.vue'
-import ProfileSeizedDistribution from '../../components/ProfileSeizedDistribution.vue'
-import ProfileDailySeizedLine from '../../components/ProfileDailySeizedLine.vue'
-import ProfileDailySeizedArea from '../../components/ProfileDailySeizedArea.vue'
-import ProfileDailySeizedBar from '../../components/ProfileDailySeizedBar.vue'
 
 const props = defineProps({
   queryParams: {
@@ -159,25 +126,6 @@ const postData = ref({
   colors: ['#ff6b6b', '#ee5a24']
 })
 
-const passRatePassData = ref([370, 352, 330, 387, 426, 342, 325, 384, 445, 407, 382, 401, 380, 464, 342, 443, 305, 394, 334, 430, 364, 362, 400, 420])
-const passRateLineData = ref([4.5, 5, 4, 6, 7, 5, 4, 6, 8, 7, 6, 7, 6, 8, 5, 7, 4, 6, 5, 7, 6, 6, 6.5, 7])
-
-const seizedTotal = ref(1658)
-
-const seizedDistributionData = ref([
-  { value: 20, name: '打火机', itemStyle: { color: '#ff9f43' } },
-  { value: 30, name: '管制刀具', itemStyle: { color: '#ff6b6b' } },
-  { value: 50, name: '其他违禁品', itemStyle: { color: '#4da6ff' } }
-])
-
-const dailyLineData = ref([120, 132, 101, 134, 90, 230, 210, 182, 191, 234, 290, 330])
-const dailyAreaPersonA = ref([120, 132, 101, 134, 90, 230, 210, 182, 191, 234, 290, 330])
-const dailyAreaPersonB = ref([220, 182, 191, 234, 290, 330, 310, 123, 144, 210, 182, 191])
-const dailyAreaPersonC = ref([150, 232, 201, 154, 190, 330, 410, 201, 154, 190, 330, 410])
-const dailyAreaPersonD = ref([320, 332, 301, 334, 390, 330, 320, 332, 301, 334, 390, 330])
-const dailyAreaPersonE = ref([820, 932, 901, 934, 1290, 1330, 1320, 820, 932, 901, 934, 1290])
-const dailyBarData = ref([120, 200, 150, 80, 70, 110, 130, 90, 160, 140, 180])
-
 watch(() => props.queryParams, (newParams) => {
   fetchData(newParams)
 }, { deep: true })

src/views/portraitManagement/deptProfile/component/runData.vue

@@ -1,6 +1,33 @@
 <template>
   <div class="operation-data">
     <div class="row">
+      <ProfilePassRate
+        :chartData1="passRatePassData"
+        :chartData2="passRateLineData"
+      />
+    </div>
+
+    <div class="row">
+      <ProfileSeizedInfo :chartData1="seizedTotal" />
+      <ProfileSeizedDistribution :chartData1="seizedDistributionData" />
+    </div>
+
+    <div class="row">
+      <ProfileDailySeizedLine :chartData1="dailyLineData" />
+      <ProfileDailySeizedArea
+        :chartData1="dailyAreaPersonA"
+        :chartData2="dailyAreaPersonB"
+        :chartData3="dailyAreaPersonC"
+        :chartData4="dailyAreaPersonD"
+        :chartData5="dailyAreaPersonE"
+      />
+    </div>
+
+    <div class="row">
+      <ProfileDailySeizedBar :chartData1="dailyBarData" />
+    </div>
+
+    <div class="row">
       <ChannelCheckChart :chartsData="chartsData" />
     </div>
     <div class="row">
@@ -70,7 +97,32 @@ import TestResult from '../../components/TestResult.vue';
 import TestArea from '../../components/TestArea.vue';
 import SupervisionDistribution from '../../components/SupervisionDistribution.vue';
 import InterceptionDistribution from '../../components/InterceptionDistribution.vue';
+import ProfilePassRate from '../../components/ProfilePassRate.vue';
+import ProfileSeizedInfo from '../../components/ProfileSeizedInfo.vue';
+import ProfileSeizedDistribution from '../../components/ProfileSeizedDistribution.vue';
+import ProfileDailySeizedLine from '../../components/ProfileDailySeizedLine.vue';
+import ProfileDailySeizedArea from '../../components/ProfileDailySeizedArea.vue';
+import ProfileDailySeizedBar from '../../components/ProfileDailySeizedBar.vue';
+
+
+const passRatePassData = ref([370, 352, 330, 387, 426, 342, 325, 384, 445, 407, 382, 401, 380, 464, 342, 443, 305, 394, 334, 430, 364, 362, 400, 420])
+const passRateLineData = ref([4.5, 5, 4, 6, 7, 5, 4, 6, 8, 7, 6, 7, 6, 8, 5, 7, 4, 6, 5, 7, 6, 6, 6.5, 7])
+
+const seizedTotal = ref(1658)
+
+const seizedDistributionData = ref([
+  { value: 20, name: '打火机', itemStyle: { color: '#ff9f43' } },
+  { value: 30, name: '管制刀具', itemStyle: { color: '#ff6b6b' } },
+  { value: 50, name: '其他违禁品', itemStyle: { color: '#4da6ff' } }
+])
 
+const dailyLineData = ref([120, 132, 101, 134, 90, 230, 210, 182, 191, 234, 290, 330])
+const dailyAreaPersonA = ref([120, 132, 101, 134, 90, 230, 210, 182, 191, 234, 290, 330])
+const dailyAreaPersonB = ref([220, 182, 191, 234, 290, 330, 310, 123, 144, 210, 182, 191])
+const dailyAreaPersonC = ref([150, 232, 201, 154, 190, 330, 410, 201, 154, 190, 330, 410])
+const dailyAreaPersonD = ref([320, 332, 301, 334, 390, 330, 320, 332, 301, 334, 390, 330])
+const dailyAreaPersonE = ref([820, 932, 901, 934, 1290, 1330, 1320, 820, 932, 901, 934, 1290])
+const dailyBarData = ref([120, 200, 150, 80, 70, 110, 130, 90, 160, 140, 180])
 
 const chartsData = ref([
   {

src/views/portraitManagement/deptProfile/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="group-profile-page">
     <Page title="安检人事管理可视化大屏" :tabs="['能力画像', '运行数据']" @tab-change="handleTabChange">
-      <SearchBar v-model:visible="searchVisible" @search="handleSearch" />
+      <SearchBar v-model:visible="searchVisible" @search="handleSearch" :deptType="'BRIGADE'"/>
       <PentagonGroup :items="pentagonItems" />
       <Profile v-if="activeTab === 0" :query-params="queryParams" />
       <RunData v-else />

src/views/portraitManagement/groupProfile/component/profile.vue

@@ -26,33 +26,6 @@
           :chartData3="postData"
         />
       </div>
-
-      <div class="content-row">
-        <ProfilePassRate
-          :chartData1="passRatePassData"
-          :chartData2="passRateLineData"
-        />
-      </div>
-
-      <div class="content-row">
-        <ProfileSeizedInfo :chartData1="seizedTotal" />
-        <ProfileSeizedDistribution :chartData1="seizedDistributionData" />
-      </div>
-
-      <div class="content-row">
-        <ProfileDailySeizedLine :chartData1="dailyLineData" />
-        <ProfileDailySeizedArea
-          :chartData1="dailyAreaPersonA"
-          :chartData2="dailyAreaPersonB"
-          :chartData3="dailyAreaPersonC"
-          :chartData4="dailyAreaPersonD"
-          :chartData5="dailyAreaPersonE"
-        />
-      </div>
-
-      <div class="content-row">
-        <ProfileDailySeizedBar :chartData1="dailyBarData" />
-      </div>
     </div>
   </div>
 </template>
@@ -63,12 +36,6 @@ import ProfileRadar from '../../components/ProfileRadar.vue'
 import ProfileMembers from '../../components/ProfileMembers.vue'
 import ProfileBasicDistribution from '../../components/ProfileBasicDistribution.vue'
 import ProfilePositionDistribution from '../../components/ProfilePositionDistribution.vue'
-import ProfilePassRate from '../../components/ProfilePassRate.vue'
-import ProfileSeizedInfo from '../../components/ProfileSeizedInfo.vue'
-import ProfileSeizedDistribution from '../../components/ProfileSeizedDistribution.vue'
-import ProfileDailySeizedLine from '../../components/ProfileDailySeizedLine.vue'
-import ProfileDailySeizedArea from '../../components/ProfileDailySeizedArea.vue'
-import ProfileDailySeizedBar from '../../components/ProfileDailySeizedBar.vue'
 
 const props = defineProps({
   queryParams: {
@@ -159,25 +126,6 @@ const postData = ref({
   colors: ['#ff6b6b', '#ee5a24']
 })
 
-const passRatePassData = ref([370, 352, 330, 387, 426, 342, 325, 384, 445, 407, 382, 401, 380, 464, 342, 443, 305, 394, 334, 430, 364, 362, 400, 420])
-const passRateLineData = ref([4.5, 5, 4, 6, 7, 5, 4, 6, 8, 7, 6, 7, 6, 8, 5, 7, 4, 6, 5, 7, 6, 6, 6.5, 7])
-
-const seizedTotal = ref(1658)
-
-const seizedDistributionData = ref([
-  { value: 20, name: '打火机', itemStyle: { color: '#ff9f43' } },
-  { value: 30, name: '管制刀具', itemStyle: { color: '#ff6b6b' } },
-  { value: 50, name: '其他违禁品', itemStyle: { color: '#4da6ff' } }
-])
-
-const dailyLineData = ref([120, 132, 101, 134, 90, 230, 210, 182, 191, 234, 290, 330])
-const dailyAreaPersonA = ref([120, 132, 101, 134, 90, 230, 210, 182, 191, 234, 290, 330])
-const dailyAreaPersonB = ref([220, 182, 191, 234, 290, 330, 310, 123, 144, 210, 182, 191])
-const dailyAreaPersonC = ref([150, 232, 201, 154, 190, 330, 410, 201, 154, 190, 330, 410])
-const dailyAreaPersonD = ref([320, 332, 301, 334, 390, 330, 320, 332, 301, 334, 390, 330])
-const dailyAreaPersonE = ref([820, 932, 901, 934, 1290, 1330, 1320, 820, 932, 901, 934, 1290])
-const dailyBarData = ref([120, 200, 150, 80, 70, 110, 130, 90, 160, 140, 180])
-
 watch(() => props.queryParams, (newParams) => {
   fetchData(newParams)
 }, { deep: true })

src/views/portraitManagement/groupProfile/component/runData.vue

@@ -1,6 +1,33 @@
 <template>
   <div class="operation-data">
     <div class="row">
+      <ProfilePassRate
+        :chartData1="passRatePassData"
+        :chartData2="passRateLineData"
+      />
+    </div>
+
+    <div class="row">
+      <ProfileSeizedInfo :chartData1="seizedTotal" />
+      <ProfileSeizedDistribution :chartData1="seizedDistributionData" />
+    </div>
+
+    <div class="row">
+      <ProfileDailySeizedLine :chartData1="dailyLineData" />
+      <ProfileDailySeizedArea
+        :chartData1="dailyAreaPersonA"
+        :chartData2="dailyAreaPersonB"
+        :chartData3="dailyAreaPersonC"
+        :chartData4="dailyAreaPersonD"
+        :chartData5="dailyAreaPersonE"
+      />
+    </div>
+
+    <div class="row">
+      <ProfileDailySeizedBar :chartData1="dailyBarData" />
+    </div>
+
+    <div class="row">
       <ChannelCheckChart :chartsData="chartsData" />
     </div>
     <div class="row">
@@ -46,16 +73,17 @@
     </div>
     <div class="row">
       <div class="col">
-        <SupervisionDistribution :chartsData="chartsData"/>
+        <SupervisionDistribution :chartsData="supervisionData"/>
       </div>
       <div class="col">
-        <InterceptionDistribution :chartsData="chartsData" />
+        <InterceptionDistribution :chartsData="interceptionData" />
       </div>
     </div>
   </div>
 </template>
 
 <script setup>
+import { watch } from 'vue'
 import ChannelCheckChart from '../../components/ChannelCheckChart.vue';
 import SeizedInfo from '../../components/SeizedInfo.vue';
 import SeizedItems from '../../components/SeizedItems.vue';
@@ -70,7 +98,39 @@ import TestResult from '../../components/TestResult.vue';
 import TestArea from '../../components/TestArea.vue';
 import SupervisionDistribution from '../../components/SupervisionDistribution.vue';
 import InterceptionDistribution from '../../components/InterceptionDistribution.vue';
+import ProfilePassRate from '../../components/ProfilePassRate.vue';
+import ProfileSeizedInfo from '../../components/ProfileSeizedInfo.vue';
+import ProfileSeizedDistribution from '../../components/ProfileSeizedDistribution.vue';
+import ProfileDailySeizedLine from '../../components/ProfileDailySeizedLine.vue';
+import ProfileDailySeizedArea from '../../components/ProfileDailySeizedArea.vue';
+import ProfileDailySeizedBar from '../../components/ProfileDailySeizedBar.vue';
+import { realtimeInterceptionItem, supervisionProblemPosition } from '@/api/portraitManagement/portraitManagement';
+
+const props = defineProps({
+  queryParams: {
+    type: Object,
+    default: () => ({})
+  }
+})
+
+const passRatePassData = ref([370, 352, 330, 387, 426, 342, 325, 384, 445, 407, 382, 401, 380, 464, 342, 443, 305, 394, 334, 430, 364, 362, 400, 420])
+const passRateLineData = ref([4.5, 5, 4, 6, 7, 5, 4, 6, 8, 7, 6, 7, 6, 8, 5, 7, 4, 6, 5, 7, 6, 6, 6.5, 7])
 
+const seizedTotal = ref(1658)
+
+const seizedDistributionData = ref([
+  { value: 20, name: '打火机', itemStyle: { color: '#ff9f43' } },
+  { value: 30, name: '管制刀具', itemStyle: { color: '#ff6b6b' } },
+  { value: 50, name: '其他违禁品', itemStyle: { color: '#4da6ff' } }
+])
+
+const dailyLineData = ref([120, 132, 101, 134, 90, 230, 210, 182, 191, 234, 290, 330])
+const dailyAreaPersonA = ref([120, 132, 101, 134, 90, 230, 210, 182, 191, 234, 290, 330])
+const dailyAreaPersonB = ref([220, 182, 191, 234, 290, 330, 310, 123, 144, 210, 182, 191])
+const dailyAreaPersonC = ref([150, 232, 201, 154, 190, 330, 410, 201, 154, 190, 330, 410])
+const dailyAreaPersonD = ref([320, 332, 301, 334, 390, 330, 320, 332, 301, 334, 390, 330])
+const dailyAreaPersonE = ref([820, 932, 901, 934, 1290, 1330, 1320, 820, 932, 901, 934, 1290])
+const dailyBarData = ref([120, 200, 150, 80, 70, 110, 130, 90, 160, 140, 180])
 
 const chartsData = ref([
   {
@@ -119,6 +179,46 @@ const chartsData = ref([
     name: '烟火'
   },
 ])
+
+const supervisionData = ref([])
+const interceptionData = ref([])
+
+const fetchSupervisionData = async () => {
+  try {
+    const res = await supervisionProblemPosition(props.queryParams)
+    if (res.code === 200 && res.data) {
+      supervisionData.value = res.data.map(item => ({
+        num: item.total,
+        name: item.name
+      }))
+    }
+  } catch (error) {
+    console.error('获取各岗位监察问题分布数据失败', error)
+  }
+}
+
+const fetchInterceptionData = async () => {
+  try {
+    const res = await realtimeInterceptionItem(props.queryParams)
+    if (res.code === 200 && res.data) {
+      interceptionData.value = res.data.map(item => ({
+        num: item.total,
+        name: item.name
+      }))
+    }
+  } catch (error) {
+    console.error('获取实时质控拦截物品分布数据失败', error)
+  }
+}
+
+const fetchData = () => {
+  fetchSupervisionData()
+  fetchInterceptionData()
+}
+
+watch(() => props.queryParams, () => {
+  fetchData()
+}, { deep: true, immediate: true })
   
 
 </script>

src/views/portraitManagement/groupProfile/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="group-profile-page">
     <Page title="安检人事管理可视化大屏" :tabs="['能力画像', '运行数据']" @tab-change="handleTabChange">
-      <SearchBar v-model:visible="searchVisible" @search="handleSearch" />
+      <SearchBar v-model:visible="searchVisible" @search="handleSearch"  :deptType="'TEAMS'" />
       <PentagonGroup :items="pentagonItems" />
       <Profile v-if="activeTab === 0" :query-params="queryParams" />
       <RunData v-else />

src/views/portraitManagement/stationProfile/component/runData.vue

@@ -87,7 +87,7 @@ import EventWorkArea from '../../components/EventWorkArea.vue'
 import TestItems from '../../components/TestItems.vue'
 import TestResult from '../../components/TestResult.vue'
 import TestArea from '../../components/TestArea.vue'
-import { securityTestItemClassification } from '@/api/portraitManagement/portraitManagement'
+import { securityTestItemClassification, securityTestPassingStatus, securityTestRegion } from '@/api/portraitManagement/portraitManagement'
 
 const props = defineProps({
   queryParams: {
@@ -157,9 +157,41 @@ const fetchSeizedItemsData = async () => {
     console.error('获取安保测试物品分类数据失败', error)
   }
 }
+const securityTestPassData = ref([])
+const securityTestAreaData = ref([])
+
+const fetchSecurityTestPassData = async () => {
+  try {
+    const res = await securityTestPassingStatus(props.queryParams)
+    if (res.code === 200 && res.data) {
+      securityTestPassData.value = res.data.map(item => ({
+        num: item.total,
+        name: item.name
+      }))
+    }
+  } catch (error) {
+    console.error('获取安保测试通过情况数据失败', error)
+  }
+}
+
+const fetchSecurityTestAreaData = async () => {
+  try {
+    const res = await securityTestRegion(props.queryParams)
+    if (res.code === 200 && res.data) {
+      securityTestAreaData.value = res.data.map(item => ({
+        num: item.total,
+        name: item.name
+      }))
+    }
+  } catch (error) {
+    console.error('获取安保测试区域情况数据失败', error)
+  }
+}
 
 const fetchData = () => {
   fetchSeizedItemsData()
+  fetchSecurityTestPassData()
+  fetchSecurityTestAreaData()
 }
 
 watch(() => props.queryParams, () => {
@@ -216,19 +248,7 @@ const unsafePostDistData = [
 
 
 
-const securityTestPassData = [
-  { num: 44, name: '通过' },
-  { num: 4, name: '未通过' }
-]
 
-const securityTestAreaData = [
-  { num: 100, name: 'T3国内出发（4层）' },
-  { num: 246, name: 'T3（8层出发）' },
-  { num: 160, name: 'T3国际出发' },
-  { num: 300, name: 'T3国际转国内' },
-  { num: 100, name: 'T1要客服务区西' },
-  { num: 167, name: 'T1要客服务区东' }
-]
 
 const hourlyPassChartRef = ref(null)
 let hourlyPassChart = null

src/views/portraitManagement/stationProfile/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="station-profile-page">
     <Page title="旅检部综合信息展示大屏" :tabs="['站点画像', '运行数据']" @tab-change="handleTabChange">
-      <SearchBar v-model:visible="searchVisible" @search="handleSearch" />
+      <SearchBar v-model:visible="searchVisible" @search="handleSearch" :deptType="'STATION'" />
       <PentagonGroup :items="pentagonItems" />
       <Profile v-if="activeTab === 0" :query-params="queryParams" />
       <RunData v-else :query-params="queryParams" />

src/views/portraitManagement/teamProfile/component/profile.vue

@@ -26,33 +26,6 @@
           :chartData3="postData"
         />
       </div>
-
-      <div class="content-row">
-        <ProfilePassRate
-          :chartData1="passRatePassData"
-          :chartData2="passRateLineData"
-        />
-      </div>
-
-      <div class="content-row">
-        <ProfileSeizedInfo :chartData1="seizedTotal" />
-        <ProfileSeizedDistribution :chartData1="seizedDistributionData" />
-      </div>
-
-      <div class="content-row">
-        <ProfileDailySeizedLine :chartData1="dailyLineData" />
-        <ProfileDailySeizedArea
-          :chartData1="dailyAreaPersonA"
-          :chartData2="dailyAreaPersonB"
-          :chartData3="dailyAreaPersonC"
-          :chartData4="dailyAreaPersonD"
-          :chartData5="dailyAreaPersonE"
-        />
-      </div>
-
-      <div class="content-row">
-        <ProfileDailySeizedBar :chartData1="dailyBarData" />
-      </div>
     </div>
   </div>
 </template>
@@ -63,12 +36,6 @@ import ProfileRadar from '../../components/ProfileRadar.vue'
 import ProfileMembers from '../../components/ProfileMembers.vue'
 import ProfileBasicDistribution from '../../components/ProfileBasicDistribution.vue'
 import ProfilePositionDistribution from '../../components/ProfilePositionDistribution.vue'
-import ProfilePassRate from '../../components/ProfilePassRate.vue'
-import ProfileSeizedInfo from '../../components/ProfileSeizedInfo.vue'
-import ProfileSeizedDistribution from '../../components/ProfileSeizedDistribution.vue'
-import ProfileDailySeizedLine from '../../components/ProfileDailySeizedLine.vue'
-import ProfileDailySeizedArea from '../../components/ProfileDailySeizedArea.vue'
-import ProfileDailySeizedBar from '../../components/ProfileDailySeizedBar.vue'
 
 const props = defineProps({
   queryParams: {
@@ -159,25 +126,6 @@ const postData = ref({
   colors: ['#ff6b6b', '#ee5a24']
 })
 
-const passRatePassData = ref([370, 352, 330, 387, 426, 342, 325, 384, 445, 407, 382, 401, 380, 464, 342, 443, 305, 394, 334, 430, 364, 362, 400, 420])
-const passRateLineData = ref([4.5, 5, 4, 6, 7, 5, 4, 6, 8, 7, 6, 7, 6, 8, 5, 7, 4, 6, 5, 7, 6, 6, 6.5, 7])
-
-const seizedTotal = ref(1658)
-
-const seizedDistributionData = ref([
-  { value: 20, name: '打火机', itemStyle: { color: '#ff9f43' } },
-  { value: 30, name: '管制刀具', itemStyle: { color: '#ff6b6b' } },
-  { value: 50, name: '其他违禁品', itemStyle: { color: '#4da6ff' } }
-])
-
-const dailyLineData = ref([120, 132, 101, 134, 90, 230, 210, 182, 191, 234, 290, 330])
-const dailyAreaPersonA = ref([120, 132, 101, 134, 90, 230, 210, 182, 191, 234, 290, 330])
-const dailyAreaPersonB = ref([220, 182, 191, 234, 290, 330, 310, 123, 144, 210, 182, 191])
-const dailyAreaPersonC = ref([150, 232, 201, 154, 190, 330, 410, 201, 154, 190, 330, 410])
-const dailyAreaPersonD = ref([320, 332, 301, 334, 390, 330, 320, 332, 301, 334, 390, 330])
-const dailyAreaPersonE = ref([820, 932, 901, 934, 1290, 1330, 1320, 820, 932, 901, 934, 1290])
-const dailyBarData = ref([120, 200, 150, 80, 70, 110, 130, 90, 160, 140, 180])
-
 watch(() => props.queryParams, (newParams) => {
   fetchData(newParams)
 }, { deep: true })

src/views/portraitManagement/teamProfile/component/runData.vue

@@ -1,6 +1,33 @@
 <template>
   <div class="operation-data">
     <div class="row">
+      <ProfilePassRate
+        :chartData1="passRatePassData"
+        :chartData2="passRateLineData"
+      />
+    </div>
+
+    <div class="row">
+      <ProfileSeizedInfo :chartData1="seizedTotal" />
+      <ProfileSeizedDistribution :chartData1="seizedDistributionData" />
+    </div>
+
+    <div class="row">
+      <ProfileDailySeizedLine :chartData1="dailyLineData" />
+      <ProfileDailySeizedArea
+        :chartData1="dailyAreaPersonA"
+        :chartData2="dailyAreaPersonB"
+        :chartData3="dailyAreaPersonC"
+        :chartData4="dailyAreaPersonD"
+        :chartData5="dailyAreaPersonE"
+      />
+    </div>
+
+    <div class="row">
+      <ProfileDailySeizedBar :chartData1="dailyBarData" />
+    </div>
+
+    <div class="row">
       <ChannelCheckChart :chartsData="chartsData" />
     </div>
     <div class="row">
@@ -70,7 +97,32 @@ import TestResult from '../../components/TestResult.vue';
 import TestArea from '../../components/TestArea.vue';
 import SupervisionDistribution from '../../components/SupervisionDistribution.vue';
 import InterceptionDistribution from '../../components/InterceptionDistribution.vue';
+import ProfilePassRate from '../../components/ProfilePassRate.vue';
+import ProfileSeizedInfo from '../../components/ProfileSeizedInfo.vue';
+import ProfileSeizedDistribution from '../../components/ProfileSeizedDistribution.vue';
+import ProfileDailySeizedLine from '../../components/ProfileDailySeizedLine.vue';
+import ProfileDailySeizedArea from '../../components/ProfileDailySeizedArea.vue';
+import ProfileDailySeizedBar from '../../components/ProfileDailySeizedBar.vue';
+
+
+const passRatePassData = ref([370, 352, 330, 387, 426, 342, 325, 384, 445, 407, 382, 401, 380, 464, 342, 443, 305, 394, 334, 430, 364, 362, 400, 420])
+const passRateLineData = ref([4.5, 5, 4, 6, 7, 5, 4, 6, 8, 7, 6, 7, 6, 8, 5, 7, 4, 6, 5, 7, 6, 6, 6.5, 7])
+
+const seizedTotal = ref(1658)
+
+const seizedDistributionData = ref([
+  { value: 20, name: '打火机', itemStyle: { color: '#ff9f43' } },
+  { value: 30, name: '管制刀具', itemStyle: { color: '#ff6b6b' } },
+  { value: 50, name: '其他违禁品', itemStyle: { color: '#4da6ff' } }
+])
 
+const dailyLineData = ref([120, 132, 101, 134, 90, 230, 210, 182, 191, 234, 290, 330])
+const dailyAreaPersonA = ref([120, 132, 101, 134, 90, 230, 210, 182, 191, 234, 290, 330])
+const dailyAreaPersonB = ref([220, 182, 191, 234, 290, 330, 310, 123, 144, 210, 182, 191])
+const dailyAreaPersonC = ref([150, 232, 201, 154, 190, 330, 410, 201, 154, 190, 330, 410])
+const dailyAreaPersonD = ref([320, 332, 301, 334, 390, 330, 320, 332, 301, 334, 390, 330])
+const dailyAreaPersonE = ref([820, 932, 901, 934, 1290, 1330, 1320, 820, 932, 901, 934, 1290])
+const dailyBarData = ref([120, 200, 150, 80, 70, 110, 130, 90, 160, 140, 180])
 
 const chartsData = ref([
   {

src/views/portraitManagement/teamProfile/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="group-profile-page">
     <Page title="安检人事管理可视化大屏" :tabs="['能力画像', '运行数据']" @tab-change="handleTabChange">
-      <SearchBar v-model:visible="searchVisible" @search="handleSearch" />
+      <SearchBar v-model:visible="searchVisible" @search="handleSearch" :deptType="'MANAGER'"/>
       <PentagonGroup :items="pentagonItems" />
       <Profile v-if="activeTab === 0" :query-params="queryParams" />
       <RunData v-else />