feat(portraitManagement): 新增部门人员画像相关功能

1.  新增部门人员相关API接口，包括成员列表、分布数据等接口
2.  改造维度列表加载逻辑，增加org参数筛选
3.  重构搜索栏时间参数格式适配不同场景
4.  完善岗位画像页面，实现动态获取并展示部门人员数据
5.  优化饼图/柱状图组件，增加响应式更新和默认配色
6.  改造班组画像页面，适配新的字段名并接入所有画像数据接口

src/api/portraitManagement/portraitManagement.js

@@ -23,4 +23,24 @@ export function realtimeInterceptionItem(data) {
 // 各岗位监察问题分布
 export function supervisionProblemPosition(data) {
     return request({ url: '/ledger/supervisionProblem/supervisionProblemPosition', method: 'post', data })
+}
+
+// 获取部门内所有成员列表
+export function getDeptMembers(data) {
+    return request({ url: '/score/dept-portrait/members', method: 'post', data })
+}
+
+// 获取部门成员基本情况分布
+export function getDeptMemberDistribution(data) {
+    return request({ url: '/score/dept-portrait/distribution', method: 'post', data })
+}
+
+// 获取部门成员职位情况分布
+export function getDeptPositionDistribution(data) {
+    return request({ url: '/score/dept-portrait/position-distribution', method: 'post', data })
+}
+
+// 维度得分一览
+export function getDimensionScoreOverview(data) {
+    return request({ url: '/score/dept-portrait/group-portrait', method: 'post', data })
 }

src/views/portraitManagement/components/ProfileBasicDistribution.vue

@@ -18,7 +18,7 @@
 </template>
 
 <script setup>
-import { ref, onMounted, onUnmounted, nextTick } from 'vue'
+import { ref, onMounted, onUnmounted, nextTick, watch } from 'vue'
 import * as echarts from 'echarts'
 import InfoCard from './card.vue'
 
@@ -55,6 +55,7 @@ const defaultPoliticalData = [
   { value: 6, name: '其他', itemStyle: { color: '#4d96ff' } }
 ]
 
+
 const genderChartRef = ref(null)
 let genderChart = null
 const nationChartRef = ref(null)
@@ -62,30 +63,98 @@ let nationChart = null
 const politicalChartRef = ref(null)
 let politicalChart = null
 
-const initPieChart = (ref, data) => {
-  if (!ref) return
-  const chart = echarts.init(ref)
-  const option = {
+const genderColors = ['#ff6b9d', '#4da6ff']
+const nationColors = ['#ff9f43', '#4da6ff', '#a55eea']
+const politicalColors = ['#ff6b6b', '#ffd93d', '#6bcb77', '#4d96ff']
+
+const getGenderColors = (data) => {
+  return data.map((item, index) => ({
+    ...item,
+    itemStyle: { color: item.itemStyle?.color || genderColors[index % genderColors.length] }
+  }))
+}
+
+const getNationColors = (data) => {
+  return data.map((item, index) => ({
+    ...item,
+    itemStyle: { color: item.itemStyle?.color || nationColors[index % nationColors.length] }
+  }))
+}
+
+const getPoliticalColors = (data) => {
+  return data.map((item, index) => ({
+    ...item,
+    itemStyle: { color: item.itemStyle?.color || politicalColors[index % politicalColors.length] }
+  }))
+}
+
+const updateGenderChart = (data) => {
+  if (!genderChartRef.value) return
+  if (!genderChart) {
+    genderChart = echarts.init(genderChartRef.value)
+  }
+  const chartData = data && data.length > 0 ? getGenderColors(data) : defaultGenderData
+  genderChart.setOption({
     series: [{
       type: 'pie',
       radius: ['50%', '70%'],
-      data: data,
+      data: chartData,
       label: { show: true, color: '#fff', fontSize: 11 },
       labelLine: { show: true }
     }]
+  })
+}
+
+const updateNationChart = (data) => {
+  if (!nationChartRef.value) return
+  if (!nationChart) {
+    nationChart = echarts.init(nationChartRef.value)
   }
-  chart.setOption(option)
-  return chart
+  const chartData = data && data.length > 0 ? getNationColors(data) : defaultNationData
+  nationChart.setOption({
+    series: [{
+      type: 'pie',
+      radius: ['50%', '70%'],
+      data: chartData,
+      label: { show: true, color: '#fff', fontSize: 11 },
+      labelLine: { show: true }
+    }]
+  })
 }
 
-const initCharts = () => {
-  const genderData = props.chartData1.length > 0 ? props.chartData1 : defaultGenderData
-  const nationData = props.chartData2.length > 0 ? props.chartData2 : defaultNationData
-  const politicalData = props.chartData3.length > 0 ? props.chartData3 : defaultPoliticalData
+const updatePoliticalChart = (data) => {
+  if (!politicalChartRef.value) return
+  if (!politicalChart) {
+    politicalChart = echarts.init(politicalChartRef.value)
+  }
+  const chartData = data && data.length > 0 ? getPoliticalColors(data) : defaultPoliticalData
+  politicalChart.setOption({
+    series: [{
+      type: 'pie',
+      radius: ['50%', '70%'],
+      data: chartData,
+      label: { show: true, color: '#fff', fontSize: 11 },
+      labelLine: { show: true }
+    }]
+  })
+}
 
-  genderChart = initPieChart(genderChartRef.value, genderData)
-  nationChart = initPieChart(nationChartRef.value, nationData)
-  politicalChart = initPieChart(politicalChartRef.value, politicalData)
+watch(() => props.chartData1, (val) => {
+  updateGenderChart(val)
+}, { deep: true })
+
+watch(() => props.chartData2, (val) => {
+  updateNationChart(val)
+}, { deep: true })
+
+watch(() => props.chartData3, (val) => {
+  updatePoliticalChart(val)
+}, { deep: true })
+
+const initCharts = () => {
+  updateGenderChart(props.chartData1)
+  updateNationChart(props.chartData2)
+  updatePoliticalChart(props.chartData3)
 }
 
 const handleResize = () => {

src/views/portraitManagement/components/ProfilePositionDistribution.vue

@@ -18,7 +18,7 @@
 </template>
 
 <script setup>
-import { ref, onMounted, onUnmounted, nextTick } from 'vue'
+import { ref, onMounted, onUnmounted, nextTick, watch } from 'vue'
 import * as echarts from 'echarts'
 import InfoCard from './card.vue'
 
@@ -38,23 +38,27 @@ const props = defineProps({
 })
 
 const defaultSkillData = {
-  categories: ['等级1', '等级2', '等级3', '等级4', '等级5'],
-  values: [3, 5, 7, 8, 4],
+  categories: [],
+  values: [],
   colors: ['#4da6ff', '#0f46fa']
 }
 
 const defaultOperateData = {
-  categories: ['0-3', '4-7', '8-11', '12-15', '15-18'],
-  values: [4, 2, 3, 5, 8],
+  categories: [],
+  values: [],
   colors: ['#6bcb77', '#2ecc71']
 }
 
 const defaultPostData = {
-  categories: ['前传', '人身', '验证', '开包', '开机'],
-  values: [4, 5, 6, 7, 8],
+  categories: [],
+  values: [],
   colors: ['#ff6b6b', '#ee5a24']
 }
 
+const skillColors = ['#4da6ff', '#0f46fa']
+const operateColors = ['#6bcb77', '#2ecc71']
+const postColors = ['#ff6b6b', '#ee5a24']
+
 const skillChartRef = ref(null)
 let skillChart = null
 const operateChartRef = ref(null)
@@ -62,10 +66,29 @@ let operateChart = null
 const postChartRef = ref(null)
 let postChart = null
 
-const initBarChart = (ref, chartData) => {
-  if (!ref) return
-  const chart = echarts.init(ref)
-  const option = {
+const transformData = (data, defaultData) => {
+  if (!data || data.length === 0) {
+    return {
+      categories: defaultData.categories,
+      values: defaultData.values,
+      colors: defaultData.colors
+    }
+  }
+  return {
+    categories: (data || []).map(item => item.name),
+    values: (data || []).map(item => item.value),
+    colors: defaultData.colors
+  }
+}
+
+const updateSkillChart = (data) => {
+  if (!skillChartRef.value) return
+  if (!skillChart) {
+    skillChart = echarts.init(skillChartRef.value)
+  }
+  const chartData = transformData(data, defaultSkillData)
+ 
+  skillChart.setOption({
     xAxis: {
       type: 'category',
       data: chartData.categories,
@@ -89,19 +112,92 @@ const initBarChart = (ref, chartData) => {
       },
       barWidth: '50%'
     }]
+  })
+}
+
+const updateOperateChart = (data) => {
+  if (!operateChartRef.value) return
+  if (!operateChart) {
+    operateChart = echarts.init(operateChartRef.value)
   }
-  chart.setOption(option)
-  return chart
+  const chartData = transformData(data, defaultOperateData)
+  
+  operateChart.setOption({
+    xAxis: {
+      type: 'category',
+      data: chartData.categories,
+      axisLabel: { color: '#a0c4ff', fontSize: 10 },
+      axisLine: { lineStyle: { color: 'rgba(15,70,250,0.3)' } }
+    },
+    yAxis: {
+      type: 'value',
+      axisLabel: { color: '#a0c4ff', fontSize: 10 },
+      axisLine: { lineStyle: { color: 'rgba(15,70,250,0.3)' } },
+      splitLine: { lineStyle: { color: 'rgba(15,70,250,0.2)' } }
+    },
+    series: [{
+      type: 'bar',
+      data: chartData.values,
+      itemStyle: {
+        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+          { offset: 0, color: chartData.colors[0] },
+          { offset: 1, color: chartData.colors[1] }
+        ])
+      },
+      barWidth: '50%'
+    }]
+  })
 }
 
-const initCharts = () => {
-  const skillData = props.chartData1.length > 0 ? props.chartData1 : defaultSkillData
-  const operateData = props.chartData2.length > 0 ? props.chartData2 : defaultOperateData
-  const postData = props.chartData3.length > 0 ? props.chartData3 : defaultPostData
+const updatePostChart = (data) => {
+  if (!postChartRef.value) return
+  if (!postChart) {
+    postChart = echarts.init(postChartRef.value)
+  }
+  const chartData = transformData(data, defaultPostData)
+  postChart.setOption({
+    xAxis: {
+      type: 'category',
+      data: chartData.categories,
+      axisLabel: { color: '#a0c4ff', fontSize: 10 },
+      axisLine: { lineStyle: { color: 'rgba(15,70,250,0.3)' } }
+    },
+    yAxis: {
+      type: 'value',
+      axisLabel: { color: '#a0c4ff', fontSize: 10 },
+      axisLine: { lineStyle: { color: 'rgba(15,70,250,0.3)' } },
+      splitLine: { lineStyle: { color: 'rgba(15,70,250,0.2)' } }
+    },
+    series: [{
+      type: 'bar',
+      data: chartData.values,
+      itemStyle: {
+        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+          { offset: 0, color: chartData.colors[0] },
+          { offset: 1, color: chartData.colors[1] }
+        ])
+      },
+      barWidth: '50%'
+    }]
+  })
+}
 
-  skillChart = initBarChart(skillChartRef.value, skillData)
-  operateChart = initBarChart(operateChartRef.value, operateData)
-  postChart = initBarChart(postChartRef.value, postData)
+watch(() => props.chartData1, (val) => {
+  updateSkillChart(val)
+}, { deep: true })
+
+watch(() => props.chartData2, (val) => {
+  updateOperateChart(val)
+}, { deep: true })
+
+watch(() => props.chartData3, (val) => {
+  updatePostChart(val)
+}, { deep: true })
+
+const initCharts = () => {
+  updateSkillChart(props.chartData1)
+  updateOperateChart(props.chartData2)
+  updatePostChart(props.chartData3)
 }
 
 const handleResize = () => {

src/views/portraitManagement/components/SearchBar.vue

@@ -97,7 +97,12 @@ const filterDeptTree = (data, targetType) => {
 const getTimeRange = () => {
   if (currentTime.value === 'custom') {
     if (dateRange.value?.length === 2) {
-      return { beginTime: formatDate(dateRange.value[0]), endTime: formatDate(dateRange.value[1]) }
+      if(props.deptType === 'user'){
+        return { beginTime: formatDate(dateRange.value[0]), endTime: formatDate(dateRange.value[1]) }
+      }else{
+        return { startDate: formatDate(dateRange.value[0]), endDate: formatDate(dateRange.value[1]) }
+      }
+     
     }
     return {}
   }
@@ -106,7 +111,11 @@ const getTimeRange = () => {
   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) }
+  if(props.deptType === 'user'){
+    return { beginTime: formatDate(begin), endTime: formatDate(end) }
+  }else{
+    return { startDate: formatDate(begin), endDate: formatDate(end) }
+  }
 }
 
 const formatDate = (d) => {
@@ -140,14 +149,15 @@ const handleNodeClick = (node) => {
     if (node.deptType === props.deptType) {
       personName.value = node.deptName || node.name || node.label;
       let obj = {}
-      if (props.deptType === 'BRIGADE') {
+      
+      if (props.deptType === 'BRIGADE'||props.deptType === 'STATION') {
         obj = { deptId: node.deptId || node.id }
       }
       if (props.deptType === 'MANAGER') {
-        obj = { teamId: node.deptId || node.id }
+        obj = { teamId: node.deptId || node.id,deptId: node.deptId || node.id }
       }
       if (props.deptType === 'TEAMS') {
-        obj = { groupId: node.deptId || node.id }
+        obj = { groupId: node.deptId || node.id,deptId: node.deptIdId || node.id }
       }
       searchHandler(obj)
     }

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

@@ -36,6 +36,7 @@ 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 { getDeptMembers, getDeptMemberDistribution, getDeptPositionDistribution, getDimensionScoreOverview } from '@/api/portraitManagement/portraitManagement'
 
 const props = defineProps({
   queryParams: {
@@ -76,63 +77,113 @@ const teamMembers = ref([
 ])
 
 const memberColumns = ref([
-  { label: '姓名', prop: 'name' },
+  { label: '姓名', prop: 'personName' },
   { label: '年龄', prop: 'age' },
-  { label: '司龄', prop: 'seniority' },
-  { label: '性别', prop: 'gender' },
+  { label: '司龄', prop: 'workYears' },
+  { label: '性别', prop: 'sex' },
   { label: '民族', prop: 'nation' },
-  { label: '政治面貌', prop: 'political' },
-  { label: '职务', prop: 'position' },
+  { label: '政治面貌', prop: 'politicalStatus' },
+  { label: '职务', prop: 'roleNames' },
   { label: '岗位资质', prop: 'qualification' },
-  { label: '职业技能等级', prop: 'skillLevel' },
-  { label: '开机年限', prop: 'operateYears' },
+  { label: '职业技能等级', prop: 'qualificationLevel' },
+  { label: '开机年限', prop: 'xrayOperatorYears' },
   { label: '平均年限', prop: 'avgYears' },
   { label: '综合得分', prop: 'totalScore' }
 ])
 
 const genderData = ref([
-  { value: 6, name: '女', itemStyle: { color: '#ff6b9d' } },
-  { value: 8, name: '男', itemStyle: { color: '#4da6ff' } }
+  
 ])
 
 const nationData = ref([
-  { value: 1, name: '回族', itemStyle: { color: '#ff9f43' } },
-  { value: 8, name: '汉族', itemStyle: { color: '#4da6ff' } },
-  { value: 5, name: '其他', itemStyle: { color: '#a55eea' } }
+ 
 ])
 
 const politicalData = ref([
-  { value: 1, name: '党员', itemStyle: { color: '#ff6b6b' } },
-  { value: 2, name: '共青团员', itemStyle: { color: '#ffd93d' } },
-  { value: 5, name: '群众', itemStyle: { color: '#6bcb77' } },
-  { value: 6, name: '其他', itemStyle: { color: '#4d96ff' } }
+  
 ])
 
-const skillData = ref({
-  categories: ['等级1', '等级2', '等级3', '等级4', '等级5'],
-  values: [3, 5, 7, 8, 4],
-  colors: ['#4da6ff', '#0f46fa']
-})
+const skillData = ref([])
 
-const operateData = ref({
-  categories: ['0-3', '4-7', '8-11', '12-15', '15-18'],
-  values: [4, 2, 3, 5, 8],
-  colors: ['#6bcb77', '#2ecc71']
-})
+const operateData = ref([])
 
 const postData = ref({
   categories: ['前传', '人身', '验证', '开包', '开机'],
   values: [4, 5, 6, 7, 8],
   colors: ['#ff6b6b', '#ee5a24']
 })
+const fetchTeamMembers = async (params) => {
+  try {
+    const res = await getDeptMembers(params)
+    if (res.code === 200 && res.data) {
+      teamMembers.value = res.data
+    }
+  } catch (error) {
+    console.error('获取部门成员列表失败', error)
+  }
+}
 
-watch(() => props.queryParams, (newParams) => {
-  fetchData(newParams)
-}, { deep: true })
+const fetchMemberDistribution = async (params) => {
+  try {
+    const res = await getDeptMemberDistribution(params)
+    if (res.code === 200 && res.data) {
+      
+      genderData.value = res.data.sexDistribution.map(item => ({ value: item.count, name: item.name })) || []
+      nationData.value = res.data.nationDistribution.map(item => ({ value: item.count, name: item.name })) || []
+      politicalData.value = res.data.politicalDistribution.map(item => ({ value: item.count, name: item.name })) || []
+      console.log('genderData', genderData.value)
+      console.log('nationData', nationData.value)
+      console.log('politicalData', politicalData.value)
+    }
+  } catch (error) {
+    console.error('获取部门成员基本情况分布失败', error)
+  }
+}
+
+const fetchPositionDistribution = async (params) => {
+  try {
+    const res = await getDeptPositionDistribution(params)
+    if (res.code === 200 && res.data) {
+      skillData.value = res.data.qualificationDistribution.map(item => ({ value: item.count, name: item.name })) || []
+      operateData.value = res.data.xrayYearDistribution.map(item => ({ value: item.count, name: item.name })) || []
+      postData.value = res.data.positionDistribution.map(item => ({ value: item.count, name: item.name })) || []
+    }
+  } catch (error) {
+    console.error('获取部门成员职位情况分布失败', error)
+  }
+}
 
+const fetchRadarData = async (params) => {
+  try {
+    const res = await getDimensionScoreOverview(params)
+    if (res.code === 200 && res.data) {
+      radarData.value = res.data.radarData || []
+      radarIndicators.value = res.data.radarIndicators || []
+      radarSeries1.value = res.data.radarSeries1 || []
+      radarSeries2.value = res.data.radarSeries2 || []
+    }
+  } catch (error) {
+    console.error('获取维度得分一览失败', error)
+  }
+}
 const fetchData = (params) => {
-  console.log('查询参数:', params)
+  if (!params.deptId && !params.groupId && !params.teamId ) {
+    return
+  }
+  //  console.log('params', params)
+  // debugger
+  fetchTeamMembers(params)
+  fetchMemberDistribution(params)
+  fetchPositionDistribution(params)
+  fetchRadarData(params)
 }
+watch(() => props.queryParams, (newParams) => {
+  fetchData(newParams)
+}, { deep: true, immediate: true })
+
+
+
+
 </script>
 
 <style lang="scss" scoped>

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

@@ -23,10 +23,11 @@
 </template>
 
 <script setup>
-import { ref } from 'vue'
+import { ref, watch } from 'vue'
 import ProfileMembers from '../../components/ProfileMembers.vue'
 import ProfileBasicDistribution from '../../components/ProfileBasicDistribution.vue'
 import ProfilePositionDistribution from '../../components/ProfilePositionDistribution.vue'
+import { getDeptMembers, getDeptMemberDistribution, getDeptPositionDistribution } from '@/api/portraitManagement/portraitManagement'
 
 
 
@@ -48,35 +49,66 @@ const teamColumns = [
   { label: '综合得分', prop: 'totalScore' }
 ]
 
-const teamData = ref([
-  { dept: '旅检一部', empCount: '800', partyCount: '7', avgAge: '25', avgWorkYears: '3', certLevel: '16', avgUpgradeAge: '3', totalScore: '90' },
-  { dept: '旅检二部', empCount: '756', partyCount: '2', avgAge: '28', avgWorkYears: '8', certLevel: '18', avgUpgradeAge: '5', totalScore: '88' },
-  { dept: '旅检三部', empCount: '708', partyCount: '7', avgAge: '25', avgWorkYears: '3', certLevel: '23', avgUpgradeAge: '3', totalScore: '86' }
-])
+const teamData = ref([])
 
-const genderData = [
-  { value: 650, name: '女', itemStyle: { color: '#ff9f9f' } },
-  { value: 750, name: '男', itemStyle: { color: '#7effc4' } }
-]
+const genderData = ref([])
+const nationData = ref([])
+const politicalData = ref([])
 
-const nationData = [
-  { value: 615, name: '汉族', itemStyle: { color: '#7effc4' } },
-  { value: 484, name: '回族', itemStyle: { color: '#4da6ff' } },
-  { value: 156, name: '其他', itemStyle: { color: '#ffd93d' } }
-]
+const skillData = ref([])
+const operateData = ref([])
+const postData = ref([])
 
-const politicalData = [
-  { value: 410, name: '群众', itemStyle: { color: '#ffd93d' } },
-  { value: 540, name: '共青团员', itemStyle: { color: '#4da6ff' } },
-  { value: 270, name: '中共党员', itemStyle: { color: '#ff6b6b' } },
-  { value: 138, name: '预备党员', itemStyle: { color: '#7effc4' } }
-]
+const fetchTeamData = async (params) => {
+  try {
+    const res = await getDeptMembers(params)
+    if (res.code === 200 && res.data) {
+      teamData.value = res.data
+    }
+  } catch (error) {
+    console.error('获取部门成员列表失败', error)
+  }
+}
+
+const fetchMemberDistribution = async (params) => {
+  try {
+    const res = await getDeptMemberDistribution(params)
+    if (res.code === 200 && res.data) {
+      genderData.value = res.data.sexDistribution?.map(item => ({ value: item.count, name: item.name })) || []
+      nationData.value = res.data.nationDistribution?.map(item => ({ value: item.count, name: item.name })) || []
+      politicalData.value = res.data.politicalDistribution?.map(item => ({ value: item.count, name: item.name })) || []
+    }
+  } catch (error) {
+    console.error('获取部门成员基本情况分布失败', error)
+  }
+}
 
-const skillData = []
+const fetchPositionDistribution = async (params) => {
+  try {
+    const res = await getDeptPositionDistribution(params)
+    if (res.code === 200 && res.data) {
+      skillData.value = res.data.qualificationDistribution?.map(item => ({ value: item.count, name: item.name })) || []
+      operateData.value = res.data.xrayYearDistribution?.map(item => ({ value: item.count, name: item.name })) || []
+      postData.value = res.data.positionDistribution?.map(item => ({ value: item.count, name: item.name })) || []
+    }
+  } catch (error) {
+    console.error('获取部门成员职位情况分布失败', error)
+  }
+}
 
-const operateData = []
+const fetchData = (params) => {
+  if (!params.deptId && !params.groupId && !params.teamId) {
+    return
+  }
+  fetchTeamData(params)
+  fetchMemberDistribution(params)
+  fetchPositionDistribution(params)
+}
 
-const postData = []
+watch(() => props.queryParams, (newParams) => {
+  
+  fetchData(newParams)
+}, { deep: true, immediate: true })
 
 </script>
 

src/views/score/dimension/index.vue

@@ -226,7 +226,7 @@ const totalWeight = computed(() => {
 
 async function loadDimensions() {
   dimLoading.value = true
-  const r = await getDimensionAll({ pageNum: 1, pageSize: 100 }).finally(() => dimLoading.value = false)
+  const r = await getDimensionAll({ pageNum: 1, pageSize: 100, org: scoreLevel.value }).finally(() => dimLoading.value = false)
   dimList.value = r.data || []
   if (!selectedDim.value && dimList.value.length) selectDimension(dimList.value[0])
 }