lcw

src/api/commit.js

@@ -84,3 +84,10 @@ export const qbcjSendFqzl = (data) => {
     data
   });
 };
+export function upImageFileInfo(data) {
+  return request({
+    url: api + '/minio/file/uploadObj',
+    method: 'post',
+    data
+  })
+}

src/api/qt.js

@@ -0,0 +1,279 @@
+import request from "@/utils/request";
+const api = "/mosty-api/mosty-gsxt";
+// 群体性质新增
+export const tbGsxtZdqtAdd = (data) => {
+  return request({
+    url: api + "/tbGsxtZdqt/save",
+    method: "POST",
+    data
+  });
+}
+export const tbGsxtZdqtUpdate = (data) => {
+  return request({
+    url: api + "/tbGsxtZdqt/update",
+    method: "POST",
+    data
+  });
+};
+// 群体查询单条
+export const tbGsxtZdqtSelectVoById = (id) => {
+  return request({
+    url: api + "/tbGsxtZdqt/selectVoById/" + id,
+    method: "GET",
+  });
+}
+
+
+// 新增群体性质
+export const tbZdqtQtxzAdd = (data) => {
+  return request({
+    url: api + "/tbZdqtQtxz/add",
+    method: "POST",
+    data
+  });
+}
+
+// 批量新增群体性质
+export const tbZdqtQtxzBatchAdd = (data) => {
+  return request({
+    url: api + "/tbZdqtQtxz/batchAdd",
+    method: "POST",
+    data
+  });
+}
+// 批量删除群体性质
+export const tbZdqtQtxzBatchDelete = (data) => {
+  return request({
+    url: api + "/tbZdqtQtxz/delete",
+    method: "POST",
+    data
+  });
+}
+// 群体性质查询列表
+export const tbZdqtQtxzSelectPage = (params) => {
+  return request({
+    url: api + "/tbZdqtQtxz/selectPage",
+    method: "get",
+    params
+  });
+}
+// 群体性质更新
+export const tbZdqtQtxzUpdate = (data) => {
+  return request({
+    url: api + "/tbZdqtQtxz/update",
+    method: "POST",
+    data
+  });
+}
+// 重点群体管控信息 -（批量新增）
+export const tbZdqtGkxxBatchAdd = (data) => {
+  return request({
+    url: api + "/tbZdqtGkxx/batchAdd",
+    method: "POST",
+    data
+  });
+}
+// 重点群体管控信息 -（删除）
+export const tbZdqtGkxxDelete = (data) => {
+  return request({
+    url: api + "/tbZdqtGkxx/delete",
+    method: "POST",
+    data
+  });
+}
+// 重点群体管控信息 -（查询列表）
+export const tbZdqtGkxxSelectPage = (params) => {
+  return request({
+    url: api + "/tbZdqtGkxx/selectPage",
+    method: "get",
+    params
+  });
+}
+// 重点群体诉求-（新增）
+export const tbZdqtSqAdd = (data) => {
+  return request({
+    url: api + "/tbZdqtSq/add",
+    method: "POST",
+    data
+  });
+}
+export const tbZdqtSqBatchAdd = (data) => {
+  return request({
+    url: api + "/tbZdqtSq/batchAdd",
+    method: "POST",
+    data
+  });
+}
+
+
+
+
+// 重点群体诉求 -（删除）
+export const tbZdqtSqDelete = (data) => {
+  return request({
+    url: api + "/tbZdqtSq/delete",
+    method: "POST",
+    data
+  });
+}
+// 重点群体诉求 -（更新）
+export const tbZdqtSqUpdate = (data) => {
+  return request({
+    url: api + "/tbZdqtSq/update",
+    method: "POST",
+    data
+  });
+}
+// 重点群体诉求 -（查询列表）
+export const tbZdqtSqSelectPage = (params) => {
+  return request({
+    url: api + "/tbZdqtSq/selectPage",
+    method: "get",
+    params
+  });
+}
+// 重点群体研判 -（新增）
+export const tbZdqtYpAdd = (data) => {
+  return request({
+    url: api + "/tbZdqtYp/add",
+    method: "POST",
+    data
+  });
+}
+// 重点群体研判 -（删除）
+export const tbZdqtYpDelete = (data) => {
+  return request({
+    url: api + "/tbZdqtYp/delete",
+    method: "POST",
+    data
+  });
+}
+// 重点群体研判 -（查询列表）
+export const tbZdqtYpSelectPage = (params) => {
+  return request({
+    url: api + "/tbZdqtYp/selectPage",
+    method: "get",
+    params
+  });
+}
+// 重点群体研判 -（更新）
+export const tbZdqtYpUpdate = (data) => {
+  return request({
+    url: api + "/tbZdqtYp/update",
+    method: "POST",
+    data
+  });
+}
+// 重点群体历史集会 -（新增）
+export const tbZdqtLsjhAdd = (data) => {
+  return request({
+    url: api + "/tbZdqtLsjh/add",
+    method: "POST",
+    data
+  });
+}
+// 重点群体历史集会 -（删除）
+export const tbZdqtLsjhDelete = (data) => {
+  return request({
+    url: api + "/tbZdqtLsjh/delete",
+    method: "POST",
+    data
+  });
+}
+// 重点群体历史集会 -（查询列表）
+export const tbZdqtLsjhSelectPage = (params) => {
+  return request({
+    url: api + "/tbZdqtLsjh/selectPage",
+    method: "get",
+    params
+  });
+}
+// 重点群体历史集会 -（更新）
+export const tbZdqtLsjhUpdate = (data) => {
+  return request({
+    url: api + "/tbZdqtLsjh/update",
+    method: "POST",
+    data
+  });
+}
+// 重点群体工作记录 -（新增）
+export const tbZdqtGzjlAdd = (data) => {
+  return request({
+    url: api + "/tbZdqtGzjl/add",
+    method: "POST",
+    data
+  });
+}
+// 重点群体工作记录 -（删除）
+export const tbZdqtGzjlDelete = (data) => {
+  return request({
+    url: api + "/tbZdqtGzjl/delete",
+    method: "POST",
+    data
+  });
+}
+// 重点群体工作记录 -（查询）
+export const tbZdqtGzjlSelectPage = (params) => {
+  return request({
+    url: api + "/tbZdqtGzjl/selectPage",
+    method: "get",
+    params
+  });
+}
+// 重点群体工作记录 -（修改）
+export const tbZdqtGzjlUpdate = (data) => {
+  return request({
+    url: api + "/tbZdqtGzjl/update",
+    method: "POST",
+    data
+  });
+}
+// 统计
+// 群体人员管控级别统计（app）
+export function zdryGkjbtj(params) {
+  return request({
+    url: api + `/tbGsxtZdqt/zdryGkjbtj`,
+    method: "get",
+    params
+  })
+}
+// 群体人员业务类别统计（app）
+export function zdryYwlbtj(params) {
+  return request({
+    url: api + `/tbGsxtZdqt/zdryYwlbtj`,
+    method: "get",
+    params
+  })
+}
+// 	重点人-区域统计
+export function zdryQytj(params) {
+  return request({
+    url: api + `/tbGsxtZdqt/zdrQytj`,
+    method: "get",
+    params
+  })
+}
+// 群体人员年龄段统计（app）
+export function zdryNldtj(params) {
+  return request({
+    url: api + `/tbGsxtZdqt/zdryNldtj`,
+    method: "get",
+    params
+  })
+}
+// 群体人员职业类别统计（app）
+export function zdryZclbtj(params) {
+  return request({
+    url: api + `/tbGsxtZdqt/zdryZylbtj`,
+    method: "get",
+    params
+  })
+}
+// 群体人员文化程度统计（app）
+export function zdryWhcdtj(params) {
+  return request({
+    url: api + `/tbGsxtZdqt/zdryWhcdtj`,
+    method: "get",
+    params
+  })
+}

src/components/ChooseList/ChooseUser/index.vue

@@ -153,11 +153,28 @@ watch(()=>props.modelValue, (val) => {
     nextTick(() => {
       getListData();
     });
-  } 
+  }
 },{
   immediate: true
 });
+
+// 监听 roleIds 变化，实时更新选择状态
+watch(()=>props.roleIds, () => {
+  if (props.modelValue && tableData.value && tableData.value.length > 0) {
+    nextTick(() => {
+      multipleUser();
+    });
+  }
+}, { deep: true });
 const closed = () => {
+  // 清空新选择的内容
+  multipleSelectionUser.value = [];
+  // 取消表格中所有行的选择状态
+  if (multipleUserRef.value && tableData.value && tableData.value.length > 0) {
+    tableData.value.forEach(item => {
+      multipleUserRef.value.toggleRowSelection(item, false);
+    });
+  }
   emits("update:modelValue", false);
 };
 const reset = () => {
@@ -176,6 +193,7 @@ const keyid = (row) => {
 // 为用户分配角色
 const onComfirm = () => {
   const userList = multipleSelectionUser.value;
+  console.log("userList", userList);
   let list = [];
   let listId = [];
   userList.forEach((val) => {
@@ -185,9 +203,8 @@ const onComfirm = () => {
     }
   });
   emits("choosedUsers", list);
-  let data = { type: props.LeaderType, userList: userList };
+  // let data = { type: props.LeaderType, userList: userList };
-
+  // emits("choosedUsersLeader", data);
-  emits("choosedUsersLeader", data);
   closed();
 };
 /**
@@ -210,12 +227,23 @@ const getListData = () => {
   selectUserDeptPage(params).then((res) => {
     tableData.value = res?.records;
     total.value = Number(res.total);
-    multipleUser();
+    // 使用 nextTick 确保表格已经渲染完成后再执行回显
+    nextTick(() => {
+      multipleUser();
+    });
   });
 };
 
 //列表回显
 function multipleUser() {
+  // 先清空之前的选择，确保选择状态的准确性
+  if (multipleUserRef.value && tableData.value && tableData.value.length > 0) {
+    tableData.value.forEach(item => {
+      multipleUserRef.value.toggleRowSelection(item, false);
+    });
+  }
+  
+  // 根据 roleIds 进行回显
   tableData.value.forEach((item) => {
     if (props.roleIds.some((id) => id == item.id)) {
       multipleUserRef.value.toggleRowSelection(item, true);

src/components/Watermark.vue

@@ -193,6 +193,6 @@ watchEffect(() => {
 .watermark-container {
   position: relative;
   height: 100vh;
-  color: rgba(136, 135, 135, 0.58);
+  /* color: rgba(136, 135, 135, 0.58); */
 }
 </style>

src/router/index.js

@@ -507,6 +507,15 @@ export const publicRoutes = [
               icon: "article"
             }
           },
+          {
+            path: "/analysisReport",
+            name: "AnalysisReport",
+            component: () => import("@/views/backOfficeSystem/AnalysisReport/index"),
+            meta: {
+              title: "研判报告",
+              icon: "article"
+            }
+          },
           {
             path: "/MeetingRoom",
             name: "MeetingRoom",
@@ -617,15 +626,7 @@ export const publicRoutes = [
               icon: "article"
             }
           },
-          // {
+
-          //   path: "/analysisReport",
-          //   name: "AnalysisReport",
-          //   component: () => import("@/views/backOfficeSystem/AnalysisReport/index"),
-          //   meta: {
-          //     title: "分析报告",
-          //     icon: "article"
-          //   }
-          // },
         ]
       }
     ]

src/utils/tools.js

@@ -1,6 +1,15 @@
 
 
 import ImageCompressor from "image-compressor.js";
+
+// 生成10位数的随机数
+export function generateRandom10Digits() {
+  // 生成范围在1000000000到9999999999之间的随机整数
+  const min = 1000000000;
+  const max = 9999999999;
+  return Math.floor(Math.random() * (max - min + 1)) + min;
+}
+
 // 随机颜色 - 把16进制的颜色换成rgba格式
 export function choseRbgb(color, opcity) {
   if (color) {

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/component/BarChart.vue

@@ -0,0 +1,156 @@
+<template>
+  <div ref="chartRef" :style="{ width: width, height: height }" class="chart-container"></div>
+</template>
+
+<script setup>
+import { ref, onMounted, onBeforeUnmount, watch } from 'vue';
+import * as echarts from 'echarts';
+
+// 定义组件属性
+const props = defineProps({
+  title: {
+    type: String,
+    default: '柱状图'
+  },
+  // 图表宽度
+  width: {
+    type: String,
+    default: '100%'
+  },
+  // 图表高度
+  height: {
+    type: String,
+    default: '400px'
+  },
+  // 图表数据
+  chartData: {
+    type: Object,
+    default: () => ({
+      // x轴数据
+      xAxisData: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+      // 系列数据
+      seriesData: [
+        {
+          name: 'Series 1',
+          data: [120, 200, 150, 80, 70, 110, 130],
+          color: '#409EFF'
+        },
+        {
+          name: 'Series 2',
+          data: [86, 99, 150, 320, 200, 130, 210],
+          color: '#67C23A'
+        }
+      ]
+    })
+  },
+  // 图表配置选项
+  chartOptions: {
+    type: Object,
+    default: () => ({})
+  }
+});
+
+const chartRef = ref(null);
+let chartInstance = null;
+
+// 初始化图表
+const initChart = () => {
+  if (!chartRef.value) return;
+
+  // 销毁已存在的图表实例
+  if (chartInstance) {
+    chartInstance.dispose();
+  }
+
+  // 创建新的图表实例
+  chartInstance = echarts.init(chartRef.value);
+
+  // 设置图表配置
+  updateChart();
+};
+
+// 更新图表
+const updateChart = () => {
+  if (!chartInstance) return;
+  const option = {
+    title: {
+      text: props.title,
+      left: 'center'
+    },
+    tooltip: {
+      trigger: 'axis',
+      axisPointer: {
+        type: 'shadow'
+      }
+    },
+    legend: {
+      data: props.chartData.seriesData.map(item => item.name),
+      bottom: 0
+    },
+    grid: {
+      left: '3%',
+      right: '4%',
+      bottom: '15%',
+      top: '15%',
+      containLabel: true
+    },
+    xAxis: {
+      type: 'category',
+      data: props.chartData.xAxisData
+    },
+    yAxis: {
+      type: 'value'
+    },
+    series: props.chartData.seriesData.map(item => ({
+      name: item.name,
+      type: 'bar',
+      barWidth: '30%',
+      emphasis: {
+        focus: 'series'
+      },
+      itemStyle: {
+        color: item.color,
+        borderRadius: [4, 4, 0, 0]
+      },
+      data: item.data
+    })),
+    // 合并用户自定义配置
+    ...props.chartOptions
+  };
+
+  chartInstance.setOption(option);
+};
+
+// 响应式更新图表
+watch(() => [props.chartData, props.chartOptions], () => {
+  updateChart();
+}, { deep: true });
+
+// 处理窗口大小变化
+const handleResize = () => {
+  if (chartInstance) {
+    chartInstance.resize();
+  }
+};
+
+// 组件挂载时初始化图表
+onMounted(() => {
+  initChart();
+  window.addEventListener('resize', handleResize);
+});
+
+// 组件卸载时销毁图表
+onBeforeUnmount(() => {
+  if (chartInstance) {
+    chartInstance.dispose();
+    chartInstance = null;
+  }
+  window.removeEventListener('resize', handleResize);
+});
+</script>
+
+<style scoped>
+.chart-container {
+  position: relative;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/component/LineChart.vue

@@ -0,0 +1,158 @@
+<template>
+  <div ref="chartRef" :style="{ width: width, height: height }" class="chart-container"></div>
+</template>
+
+<script setup>
+import { ref, onMounted, onBeforeUnmount, watch } from 'vue';
+import * as echarts from 'echarts';
+
+// 定义组件属性
+const props = defineProps({
+  title: {
+    type: String,
+    default: '折线图'
+  },
+  // 图表宽度
+  width: {
+    type: String,
+    default: '100%'
+  },
+  // 图表高度
+  height: {
+    type: String,
+    default: '400px'
+  },
+  // 图表数据
+  chartData: {
+    type: Object,
+    default: () => ({
+      // x轴数据
+      xAxisData: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+      // 系列数据
+      seriesData: [
+        {
+          name: 'Series 1',
+          data: [120, 200, 150, 80, 70, 110, 130],
+          color: '#409EFF'
+        },
+        {
+          name: 'Series 2',
+          data: [86, 99, 150, 320, 200, 130, 210],
+          color: '#67C23A'
+        }
+      ]
+    })
+  },
+  // 图表配置选项
+  chartOptions: {
+    type: Object,
+    default: () => ({})
+  }
+});
+
+const chartRef = ref(null);
+let chartInstance = null;
+
+// 初始化图表
+const initChart = () => {
+  if (!chartRef.value) return;
+
+  // 销毁已存在的图表实例
+  if (chartInstance) {
+    chartInstance.dispose();
+  }
+
+  // 创建新的图表实例
+  chartInstance = echarts.init(chartRef.value);
+
+  // 设置图表配置
+  updateChart();
+};
+
+// 更新图表
+const updateChart = () => {
+  if (!chartInstance) return;
+
+  const option = {
+    title: {
+      text: props.title,
+      left: 'center'
+    },
+    tooltip: {
+      trigger: 'axis'
+    },
+    legend: {
+      data: props.chartData.seriesData.map(item => item.name),
+      bottom: 0
+    },
+    grid: {
+      left: '3%',
+      right: '4%',
+      bottom: '15%',
+      top: '15%',
+      containLabel: true
+    },
+    xAxis: {
+      type: 'category',
+      boundaryGap: false,
+      data: props.chartData.xAxisData
+    },
+    yAxis: {
+      type: 'value'
+    },
+    series: props.chartData.seriesData.map(item => ({
+      name: item.name,
+      type: 'line',
+      stack: 'Total',
+      areaStyle: {},
+      emphasis: {
+        focus: 'series'
+      },
+      lineStyle: {
+        width: 3
+      },
+      itemStyle: {
+        color: item.color
+      },
+      data: item.data
+    })),
+    // 合并用户自定义配置
+    ...props.chartOptions
+  };
+
+  chartInstance.setOption(option);
+};
+
+// 响应式更新图表
+watch(() => [props.chartData, props.chartOptions], () => {
+  updateChart();
+}, { deep: true });
+
+// 处理窗口大小变化
+const handleResize = () => {
+  if (chartInstance) {
+    chartInstance.resize();
+  }
+};
+
+// 组件挂载时初始化图表
+onMounted(() => {
+  initChart();
+  window.addEventListener('resize', handleResize);
+});
+
+// 组件卸载时销毁图表
+onBeforeUnmount(() => {
+  if (chartInstance) {
+    chartInstance.dispose();
+    chartInstance = null;
+  }
+  window.removeEventListener('resize', handleResize);
+});
+</script>
+
+<style scoped>
+.chart-container {
+  position: relative;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/component/PieChart.vue

@@ -0,0 +1,182 @@
+<template>
+  <div ref="chartRef" :style="{ width: width, height: height }" class="chart-container"></div>
+</template>
+
+<script setup>
+import { ref, onMounted, onBeforeUnmount, watch } from 'vue';
+import * as echarts from 'echarts';
+
+// 定义组件属性
+const props = defineProps({
+  title: {
+    type: String,
+    default: '饼图'
+  },
+  // 图表宽度
+  width: {
+    type: String,
+    default: '100%'
+  },
+  // 图表高度
+  height: {
+    type: String,
+    default: '400px'
+  },
+  // 图表数据
+  chartData: {
+    type: Object,
+    default: () => ({
+      // 饼图数据
+      seriesData: [
+        {
+          name: 'Category 1',
+          value: 335,
+          color: '#409EFF'
+        },
+        {
+          name: 'Category 2',
+          value: 310,
+          color: '#67C23A'
+        },
+        {
+          name: 'Category 3',
+          value: 234,
+          color: '#E6A23C'
+        },
+        {
+          name: 'Category 4',
+          value: 135,
+          color: '#F56C6C'
+        },
+        {
+          name: 'Category 5',
+          value: 548,
+          color: '#909399'
+        }
+      ]
+    })
+  },
+  // 图表配置选项
+  chartOptions: {
+    type: Object,
+    default: () => ({})
+  },
+  // 饼图半径
+  radius: {
+    type: Array,
+    default: () => ['40%', '70%']
+  }
+});
+
+const chartRef = ref(null);
+let chartInstance = null;
+
+// 初始化图表
+const initChart = () => {
+  if (!chartRef.value) return;
+
+  // 销毁已存在的图表实例
+  if (chartInstance) {
+    chartInstance.dispose();
+  }
+
+  // 创建新的图表实例
+  chartInstance = echarts.init(chartRef.value);
+
+  // 设置图表配置
+  updateChart();
+};
+
+// 更新图表
+const updateChart = () => {
+  if (!chartInstance) return;
+
+  const option = {
+    title: {
+      text: props.title,
+      left: 'center'
+    },
+    tooltip: {
+      trigger: 'item',
+      formatter: '{a} <br/>{b}: {c} ({d}%)'
+    },
+    legend: {
+      orient: 'vertical',
+      left: 'left',
+      data: props.chartData.seriesData.map(item => item.name)
+    },
+    series: [
+      {
+        name: '数据统计',
+        type: 'pie',
+        radius: props.radius,
+        center: ['50%', '60%'],
+        avoidLabelOverlap: false,
+        itemStyle: {
+          borderRadius: 10,
+          borderColor: '#fff',
+          borderWidth: 2
+        },
+        label: {
+          show: false,
+          position: 'center'
+        },
+        emphasis: {
+          label: {
+            show: true,
+            fontSize: '18',
+            fontWeight: 'bold'
+          }
+        },
+        labelLine: {
+          show: false
+        },
+        data: props.chartData.seriesData.map(item => ({
+          name: item.name,
+          value: item.value,
+          itemStyle: {
+            color: item.color
+          }
+        }))
+      }
+    ],
+    // 合并用户自定义配置
+    ...props.chartOptions
+  };
+
+  chartInstance.setOption(option);
+};
+
+// 响应式更新图表
+watch(() => [props.chartData, props.chartOptions, props.radius], () => {
+  updateChart();
+}, { deep: true });
+
+// 处理窗口大小变化
+const handleResize = () => {
+  if (chartInstance) {
+    chartInstance.resize();
+  }
+};
+
+// 组件挂载时初始化图表
+onMounted(() => {
+  initChart();
+  window.addEventListener('resize', handleResize);
+});
+
+// 组件卸载时销毁图表
+onBeforeUnmount(() => {
+  if (chartInstance) {
+    chartInstance.dispose();
+    chartInstance = null;
+  }
+  window.removeEventListener('resize', handleResize);
+});
+</script>
+
+<style scoped>
+.chart-container {
+  position: relative;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/component/appeal.vue

@@ -0,0 +1,71 @@
+<template>
+  <el-dialog :title="titleValue" width="800px" :model-value="modelValue" append-to-body @close="closed">
+    <el-input v-model="sqnrData.sqnr" :autosize="{ minRows: 4, maxRows: 10 }" type="textarea" placeholder="请输入背景信息"
+    class="background-info-input" :disabled="disabled"/>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="closed">取消</el-button>
+        <el-button type="primary" @click="onComfirm">确认</el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { ref ,onMounted, reactive, watch,getCurrentInstance} from "vue";
+import { generateRandom10Digits } from '@/utils/tools'
+const { proxy } = getCurrentInstance()
+const props = defineProps({
+  modelValue: {
+    type: Boolean,
+    default: false
+  },
+  titleValue: {
+    type: String,
+    default: "诉求信息"
+  },
+  data: {
+    type: Object,
+    default: () => { }
+  }
+});
+const emits=defineEmits(["update:modelValue","comfirm"]);
+const sqnrData = reactive({
+  sqnr: "",
+  id: ""
+})
+const closed = () => {
+    sqnrData.sqnr = ''
+  sqnrData.id = ''
+  emits("update:modelValue", false);
+
+};
+const onComfirm = () => {
+  if (!sqnrData.sqnr) {
+    proxy.$message.error('请输入诉求')
+    return
+  }
+  emits("comfirm", { sqnr: sqnrData.sqnr, id: sqnrData.id?sqnrData.id: generateRandom10Digits() });
+  emits("update:modelValue", false);
+}
+watch(() => props.data, (val) => {
+  if (val) {
+    sqnrData.sqnr =val.sqnr
+    sqnrData.id = val.id
+  }
+})
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/css/layout.scss";
+@import "@/assets/css/element-plus.scss";
+</style>
+<style>
+.tabBoxRadio .el-checkbox__inner {
+  border-radius: 50% !important;
+}
+
+.tabBoxRadio .el-table__header-wrapper .el-checkbox {
+  display: none;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/component/groupStaff.vue

@@ -0,0 +1,232 @@
+<template>
+  <el-dialog width="1400px" :model-value="modelValue" append-to-body @close="closed">
+    <template #title>
+        <span class="mr10 f16">选择人员</span>
+    </template>
+    <el-form :model="listQuery" :inline="true">
+        <el-form-item label="人员姓名">
+            <el-input placeholder="请输入人员姓名" v-model="listQuery.ryxm" clearable ></el-input>
+        </el-form-item>
+        <el-form-item label="身份证号">
+            <el-input placeholder="请输入身份证号" v-model="listQuery.sfzh" clearable ></el-input>
+        </el-form-item>
+        <el-form-item label="手机号码">
+            <el-input placeholder="请输入手机号码" v-model="listQuery.sjhm" clearable ></el-input>
+        </el-form-item>
+        <el-form-item>
+            <el-button type="success" @click="handleFilter">查询</el-button>
+            <el-button type="info" @click="reset()"> 重置 </el-button>
+        </el-form-item>
+    </el-form>
+    <div class="tabBox" :class="props.Single ? 'tabBoxRadio' : ''" style="margin-top: 0px">
+    <el-table ref="multipleUserRef" :key="keyTabel" v-loading="loading" @selection-change="handleSelectionChange" :data="tableData" border :row-key="keyid" style="width: 100%" height="450">
+        <el-table-column type="selection" width="55" :reserve-selection="true"/>
+        <el-table-column prop="ryXm" align="center" label="姓名"/>
+        <el-table-column prop="rySfzh" align="center" label="身份证"/>
+        <el-table-column prop="ryXb" align="center" label="性别">
+            <template #default="{ row }">
+              <DictTag :tag="false"  :value="row.ryXb" :options="D_BZ_XB" />
+            </template>
+        </el-table-column>
+        <el-table-column prop="ryMz" align="center" label="民族">
+            <template #default="{ row }">
+                <DictTag :value="row.ryMz" :tag="false" :options="D_BZ_MZ" />
+            </template>
+        </el-table-column>
+        <el-table-column prop="hjdXz" align="center" label="户籍地"/>
+        <el-table-column prop="xzdXz" align="center" label="现居住址"/>
+        <el-table-column prop="ryLxdh" align="center" label="手机号"/>
+        <el-table-column prop="qtXnsf" align="center" label="虚拟身份"/>
+        <el-table-column prop="clCph" align="center" label="车牌号"/>
+        <el-table-column prop="clCjh" align="center" label="车辆识别代码"/>
+        <el-table-column prop="qtTzms" align="center" label="特征描述"/>
+        <el-table-column prop="zdrYjdj" align="center" label="预警等级">
+            <template #default="{ row }">
+                <DictTag :tag="false"  :value="row.zdrYjdj" :options="D_GS_ZDR_YJDJ" />
+            </template>
+        </el-table-column>
+        <el-table-column prop="bqList" align="center" label="人员标签">
+           <template #default="{ row }">
+              <span v-if="row.bqList">
+                <span v-for="(it,idx) in row.bqList" :key="idx"> {{ it.bqMc }}、</span>
+              </span>
+            </template>
+        </el-table-column>
+    </el-table>
+    </div>
+    <div class="fenye flex just-end " :style="{ top: tableHeight + 'px' }">
+    <el-pagination
+      class="pagination"
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"
+      :current-page="listQuery.pageCurrent"
+      :page-sizes="[10, 20, 50, 100]"
+      :page-size="listQuery.pageSize"
+      layout="total, sizes, prev, pager, next, jumper"
+      :total="total"
+    ></el-pagination>
+    </div>
+    <template #footer>
+      <div class="flex just-center">
+        <el-button @click="closed">取消</el-button>
+        <el-button type="primary" @click="onComfirm">确认</el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { qcckGet} from "@/api/qcckApi.js";
+import { defineProps, ref ,getCurrentInstance, watch} from "vue";
+const { proxy } = getCurrentInstance();
+const { D_BZ_XB,D_BZ_MZ,D_GS_ZDR_YJDJ } = proxy.$dict("D_BZ_XB","D_BZ_MZ",'D_GS_ZDR_YJDJ'); //获取字典数据
+const props = defineProps({
+  modelValue: {
+    type: Boolean,
+    default:false
+  },
+  LeaderType: {
+    type: String,
+    default: ""
+  },
+  //是否单选
+  Single: {
+    type: Boolean,
+    default: false
+  },
+  roleIds: {
+    type: Array,
+    default: []
+  },
+});
+const loading = ref(false)
+const total = ref(0);
+const listQuery = ref({
+  pageCurrent: 1,
+  pageSize: 20
+});
+const addPerson = ref()
+const multipleUserRef = ref(null);
+const multipleSelectionUser = ref([]);
+const tableData = ref([]);
+const emits = defineEmits(["update:modelValue", "choosed","choosedAdd"]);
+const keyTabel = ref(0)
+const keyid = (row) => {
+  return row.id;
+};
+
+const closed = () => {
+  // 清空选择数据
+  multipleSelectionUser.value = [];
+  // 取消表格中的所有选择
+  if (multipleUserRef.value && tableData.value.length > 0) {
+    tableData.value.forEach(item => {
+      multipleUserRef.value.toggleRowSelection(item, false);
+    });
+  }
+  emits("update:modelValue", false);
+};
+const reset = () => {
+  listQuery.value = {  pageCurrent: 1, pageSize: 20, };
+  getListData();
+};
+
+
+// 为用户分配角色
+const onComfirm = () => {
+  const userList = multipleSelectionUser.value;
+  let list = [];
+  let listId = [];
+  userList.forEach((val) => {
+    if (listId.indexOf(val.id) == -1) {
+      list.push(val);
+      listId.push(val.id);
+    }
+  });
+  emits("choosed", list);
+  closed();
+};
+
+// 自定义加人
+const changeZdy = (val) => {
+  emits("choosedAdd", val);
+  closed();
+}
+/**
+ * pageSize 改变触发
+ */
+const handleSizeChange = (currentSize) => {
+  listQuery.value.pageSize = currentSize;
+  getListData();
+};
+/**
+ * 页码改变触发
+ */
+const handleCurrentChange = (currentPage) => {
+  listQuery.value.pageCurrent = currentPage;
+  getListData();
+};
+const getListData = () => {
+  keyTabel.value++
+  const params = {...listQuery.value}
+  loading.value = true;
+  qcckGet(params,'/mosty-gsxt/tbGsxtZdry/selectPage').then(res=>{
+    loading.value = false;
+    tableData.value = res.records || [];
+    total.value = res.total;
+    multipleUser();
+  }).catch(()=>{
+    loading.value = false;
+  })
+};
+
+//列表回显
+function multipleUser() {
+  tableData.value.forEach((item) => {
+     multipleUserRef.value.toggleRowSelection(item, false);
+    if (props.roleIds.some((id) => id == item.id)) {
+      multipleUserRef.value.toggleRowSelection(item, true);
+    }
+  });
+}
+
+const handleFilter = () => {
+  listQuery.value.pageCurrent = 1;
+  getListData();
+};
+
+const handleSelectionChange = (val) => {
+  if (props.Single) {
+    if (val.length > 1) {
+      let del_row = val.shift();
+      multipleUserRef.value.toggleRowSelection(del_row, false);
+    }
+    multipleSelectionUser.value = val;
+  } else {
+    multipleSelectionUser.value = val;
+  }
+};
+
+const zdyaddPerson = () => {
+  addPerson.value.init();
+};
+
+watch(()=>props.modelValue,val=>{
+  if(val) handleFilter();
+},{immediate:true})
+
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/css/layout.scss";
+@import "@/assets/css/element-plus.scss";
+</style>
+<style>
+.tabBoxRadio .el-checkbox__inner {
+  border-radius: 50% !important;
+}
+.tabBoxRadio .el-table__header-wrapper .el-checkbox {
+  display: none;
+}
+
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/component/history.vue

@@ -0,0 +1,356 @@
+<template>
+  <el-dialog :title="titleValue" width="800px" :model-value="modelValue" append-to-body @close="closed">
+    <el-form ref="historyForm" style="max-width: 600px" :model="ruleForm" :rules="rules" label-width="auto">
+      <el-form-item label="过激行为" prop="gjxw">
+        <el-input v-model="ruleForm.gjxw" :autosize="{ minRows: 4, maxRows: 10 }" type="textarea" placeholder="请输入研判记录"
+          class="background-info-input" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="活动时间" prop="kssj">
+        <el-date-picker v-model="ruleForm.kssj" value-format="YYYY-MM-DD HH:mm:ss" type="datetimerange"
+          range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" />
+      </el-form-item>
+      <el-form-item label="活动场所" prop="hdcs">
+        <el-input v-model="ruleForm.hdcs" placeholder="请输入活动场所" />
+      </el-form-item>
+    </el-form>
+
+    <div style="padding: 5px;">
+      <div class="butHandle">
+        <h3>涉事人员</h3>
+        <div> <el-button type="primary" @click="showDialog = true">选择</el-button></div>
+      </div>
+      <el-table :data="ruleForm.ssry" :height="200">
+        <el-table-column prop="ryXm" label="姓名" />
+        <el-table-column prop="rySfzh" label="身份证号码" />
+        <el-table-column label="管控级别">
+          <template #default="{ row }">
+            <DictTag :tag="false" :value="row.zdrRyjb" :options="D_GS_ZDR_RYJB" />
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <!-- 文件列表区域 -->
+    <div class="file-attachment-section">
+      <div class="section-title">相关附件</div>
+      <div class="file-list-container">
+        <div v-if="ruleForm?.fileList.length == 0" class="empty-file-list">暂无附件</div>
+        <div v-else class="file-list">
+          <div v-for="(file, index) in ruleForm?.fileList" :key="index" class="file-item">
+            <div class="file-info">
+              <span class="file-name">{{ file.originalName }}</span>
+              <span class="file-time">{{ file.uploadTime }}</span>
+            </div>
+            <div class="file-actions">
+              <el-button type="text" size="small" @click="downloadFile(file)" title="下载文件" :disabled="disabled">
+                <el-icon>
+                  <Download />
+                </el-icon>
+              </el-button>
+              <el-button type="text" size="small" @click="deleteFile(index)" title="删除文件" class="delete-btn"
+                :disabled="disabled">
+                <el-icon>
+                  <Delete />
+                </el-icon>
+              </el-button>
+            </div>
+          </div>
+        </div>
+      </div>
+      <!-- 上传按钮区域 -->
+      <div class="upload-btn-container">
+        <el-upload v-model:file-list="ruleForm.fileList" class="upload-demo" :show-file-list="false" multiple
+          :http-request="handleUploadRequest" :on-remove="handleRemove" :limit="3" :on-exceed="handleExceed">
+          <el-button type="primary" :disabled="disabled">上传文件</el-button>
+        </el-upload>
+      </div>
+    </div>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="closed">取消</el-button>
+        <el-button type="primary" @click="onComfirm">确认</el-button>
+      </div>
+    </template>
+  </el-dialog>
+  <GroupStaff v-model="showDialog" @choosed="addMarks" :roleIds="roleIds" />
+</template>
+
+<script setup>
+import { ref, onMounted, reactive, watch, getCurrentInstance } from "vue";
+import { generateRandom10Digits } from '@/utils/tools'
+import GroupStaff from './groupStaff.vue'
+import { uploadMultipleFiles } from '../model/fileUp'
+import { ElMessage } from 'element-plus';
+const { proxy } = getCurrentInstance()
+const { D_GS_ZDR_RYJB } = proxy.$dict("D_GS_ZDR_RYJB"); //获取字典数据
+
+const props = defineProps({
+  modelValue: {
+    type: Boolean,
+    default: false
+  },
+  titleValue: {
+    type: String,
+    default: "集会记录"
+  },
+  data: {
+    type: Object,
+    default: () => { }
+  }
+});
+const emits = defineEmits(["update:modelValue", "comfirm"]);
+const historyForm = ref(null)
+const showDialog = ref(false)
+const roleIds = ref([])
+const ruleForm = ref({
+  gjxw: "",
+  hdcs: "",
+  kssj: "",
+  ssry: [],
+  fileList: []
+})
+const rules = reactive({
+  gjxw: [
+    { required: true, message: '请输入过激行为', trigger: 'blur' },
+  ],
+  hdcs: [
+    { required: true, message: '请输入活动场所', trigger: 'blur' },
+  ],
+  kssj: [
+    { required: true, message: '请选择时间', trigger: 'blur' },
+  ]
+});
+
+const onComfirm = () => {
+  if (!ruleForm.value.ssry.length) {
+    proxy.$message.error('请选择涉事人员')
+    return
+  }
+  const promes = {
+    ...ruleForm.value,
+    id: ruleForm.value.id ? ruleForm.value.id : generateRandom10Digits(),
+    kssj: ruleForm.value.kssj[0],
+    jssj: ruleForm.value.kssj[1],
+  }
+  emits("comfirm", { ...promes });
+  emits("update:modelValue", false);
+}
+watch(() => props.data, (val) => {
+  if (val) {
+    ruleForm.value = {
+      ...val,
+      kssj: [val.kssj, val.jssj],
+      fileList:val.fj
+    }
+  }
+},{deep: true})
+
+const addMarks = (val) => {
+  ruleForm.value.ssry = val
+  roleIds.value = val.map(item => item.id)
+}
+// 下载文件
+const downloadFile = (file) => {
+  // 实际项目中，这里应该调用下载API
+  console.log('下载文件:', file.name)
+  // 示例：window.open(file.url)
+}
+// 删除文件
+const deleteFile = (index) => {
+  // 实际项目中，这里应该先调用删除API，成功后再从列表中移除
+  ruleForm.value.fileList.splice(index, 1)
+  ElMessage.success('文件已删除')
+}
+
+// 上传相关方法
+const handleUploadRequest = async (options) => {
+  try {
+    // 调用uploadMultipleFiles进行文件上传
+    const result = await uploadMultipleFiles(options.file, {
+      uploadedFiles: ruleForm.value.fileList,
+      fjIds: [], // 如果需要保存文件ID列表，可以在这里传递
+      compressImage: null // 可选的图片压缩函数
+    });
+    // 更新文件列表，添加上传时间信息
+    const index = ruleForm.value.fileList.findIndex(f => f.originalName === options.file.name);
+    if (index !== -1) {
+      ruleForm.value.fileList[index].uploadTime = new Date().toLocaleString('zh-CN');
+    }
+    // 调用成功回调
+    if (options.onSuccess) {
+      options.onSuccess(result);
+    }
+  } catch (error) {
+    console.error('文件上传失败:', error);
+    // 调用失败回调
+    if (options.onError) {
+      options.onError(error);
+    }
+  }
+}
+
+const handleRemove = (uploadFile, uploadFiles) => {
+  // 实际项目中，这里应该先调用删除API，成功后再从列表中移除
+  const index = ruleForm.value.fileList.findIndex(f => f.name === uploadFile.name);
+  if (index !== -1) {
+    ruleForm.value.fileList.splice(index, 1);
+  }
+}
+const closed = () => {
+  ruleForm.value = {
+    gjxw: "",
+    hdcs: "",
+    kssj: "",
+    ssry: [],
+    fj: []
+  }
+  emits("update:modelValue", false);
+};
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/css/layout.scss";
+@import "@/assets/css/element-plus.scss";
+
+.tabBoxRadio .el-checkbox__inner {
+  border-radius: 50% !important;
+}
+
+.tabBoxRadio .el-table__header-wrapper .el-checkbox {
+  display: none;
+}
+
+.file-attachment-section {
+  margin-top: 15px;
+}
+
+.section-title {
+  font-size: 14px;
+  font-weight: 500;
+  color: #303133;
+  margin-bottom: 10px;
+  padding-bottom: 5px;
+  border-bottom: 1px solid #ebeef5;
+}
+
+.file-list-container {
+  max-height: 100px;
+  overflow-y: auto;
+  border: 1px solid #ebeef5;
+  border-radius: 4px;
+  background-color: #ffffff;
+  margin-bottom: 10px;
+}
+
+/* 自定义滚动条样式 */
+.file-list-container::-webkit-scrollbar {
+  width: 6px;
+}
+
+.file-list-container::-webkit-scrollbar-track {
+  background: #f1f1f1;
+  border-radius: 3px;
+}
+
+.file-list-container::-webkit-scrollbar-thumb {
+  background: #c0c4cc;
+  border-radius: 3px;
+}
+
+.file-list-container::-webkit-scrollbar-thumb:hover {
+  background: #909399;
+}
+
+.empty-file-list {
+  padding: 20px;
+  text-align: center;
+  color: #909399;
+  font-size: 12px;
+}
+
+.file-list {
+  padding: 5px;
+}
+
+.file-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 10px;
+  margin-bottom: 2px;
+  background-color: #f8f9fa;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+  cursor: pointer;
+}
+
+.file-item:hover {
+  background-color: #e6f7ff;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+}
+
+.file-info {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  gap: 15px;
+  min-width: 0;
+}
+
+.file-name {
+  flex: 1;
+  font-size: 12px;
+  color: #303133;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.file-size {
+  font-size: 11px;
+  color: #909399;
+  min-width: 60px;
+}
+
+.file-time {
+  font-size: 11px;
+  color: #909399;
+}
+
+.file-actions {
+  display: flex;
+  align-items: center;
+  gap: 5px;
+  margin-left: 10px;
+}
+
+.file-actions .el-button {
+  padding: 0 5px;
+  margin: 0;
+  color: #606266;
+  transition: color 0.3s ease;
+}
+
+.file-actions .el-button:hover {
+  color: #409eff;
+}
+
+.delete-btn:hover {
+  color: #f56c6c !important;
+}
+
+.upload-btn-container {
+  display: flex;
+  justify-content: center;
+  margin-top: 10px;
+}
+
+.butHandle {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+::v-deep .el-range-input {
+  color: #000 !important;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/component/judgmentRecord.vue

@@ -0,0 +1,286 @@
+<template>
+  <el-dialog :title="titleValue" width="800px" :model-value="modelValue" append-to-body @close="closed">
+    <el-input v-model="sqnrData.ypnr" :autosize="{ minRows: 4, maxRows: 10 }" type="textarea" placeholder="请输入研判记录"
+      class="background-info-input" :disabled="disabled"/>
+
+    <!-- 文件列表区域 -->
+    <div class="file-attachment-section">
+      <div class="section-title">相关附件</div>
+      <div class="file-list-container">
+        <div v-if="sqnrData.fileList.length === 0" class="empty-file-list">暂无附件</div>
+        <div v-else class="file-list">
+          <div v-for="(file, index) in sqnrData.fileList" :key="index" class="file-item">
+            <div class="file-info">
+              <span class="file-name">{{ file.originalName }}</span>
+              <span class="file-time">{{ file.uploadTime }}</span>
+            </div>
+            <div class="file-actions">
+              <el-button type="text" size="small" @click="downloadFile(file)" title="下载文件" :disabled="disabled">
+                <el-icon>
+                  <Download />
+                </el-icon>
+              </el-button>
+              <el-button type="text" size="small" @click="deleteFile(index)" title="删除文件" class="delete-btn" :disabled="disabled">
+                <el-icon>
+                  <Delete />
+                </el-icon>
+              </el-button>
+            </div>
+          </div>
+        </div>
+      </div>
+      <!-- 上传按钮区域 -->
+      <div class="upload-btn-container">
+        <el-upload v-model:file-list="sqnrData.fileList" class="upload-demo" :show-file-list="false" multiple
+          :http-request="handleUploadRequest" :on-remove="handleRemove" :limit="3" :on-exceed="handleExceed">
+          <el-button type="primary" :disabled="disabled">上传文件</el-button >
+        </el-upload>
+      </div>
+    </div>
+
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="closed">取消</el-button>
+        <el-button type="primary" @click="onComfirm">确认</el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { ref, onMounted, reactive, watch, getCurrentInstance } from "vue";
+import { generateRandom10Digits } from '@/utils/tools'
+import { uploadMultipleFiles } from '../model/fileUp'
+import { ElMessage } from 'element-plus';
+const { proxy } = getCurrentInstance()
+const props = defineProps({
+  modelValue: {
+    type: Boolean,
+    default: false
+  },
+  titleValue: {
+    type: String,
+    default: "研判记录"
+  },
+  data: {
+    type: Object,
+    default: () => { }
+  }
+});
+const emits = defineEmits(["update:modelValue", "comfirm"]);
+// 文件列表数据
+const sqnrData = reactive({
+  ypnr: "",
+  id: "",
+  fileList:[]
+})
+const closed = () => {
+  sqnrData.ypnr = ''
+  sqnrData.id = ''
+  emits("update:modelValue", false);
+
+};
+const onComfirm = () => {
+  if (!sqnrData.ypnr) {
+    proxy.$message.error('请输入研判内容')
+    return
+  }
+  emits("comfirm", {  id: sqnrData.id ? sqnrData.id : generateRandom10Digits(),...sqnrData });
+  emits("update:modelValue", false);
+}
+watch(() => props.data, (val) => {
+  if (val) {
+    sqnrData.ypnr = val.ypnr
+    sqnrData.id = val.id
+    sqnrData.fileList = val.fj
+  }
+})
+
+
+// 下载文件
+const downloadFile = (file) => {
+  // 实际项目中，这里应该调用下载API
+  console.log('下载文件:', file.name)
+  // 示例：window.open(file.url)
+}
+// 删除文件
+const deleteFile = (index) => {
+  // 实际项目中，这里应该先调用删除API，成功后再从列表中移除
+  sqnrData.fileList.splice(index, 1)
+  ElMessage.success('文件已删除')
+}
+
+// 上传相关方法
+const handleUploadRequest = async (options) => {
+  try {
+    // 调用uploadMultipleFiles进行文件上传
+    const result = await uploadMultipleFiles(options.file, {
+      uploadedFiles: sqnrData.fileList,
+      fjIds: [], // 如果需要保存文件ID列表，可以在这里传递
+      compressImage: null // 可选的图片压缩函数
+    });
+    // 更新文件列表，添加上传时间信息
+    const index = sqnrData.fileList.findIndex(f => f.originalName === options.file.name);
+    if (index !== -1) {
+      sqnrData.fileList[index].uploadTime = new Date().toLocaleString('zh-CN');
+    }
+    // 调用成功回调
+    if (options.onSuccess) {
+      options.onSuccess(result);
+    }
+  } catch (error) {
+    console.error('文件上传失败:', error);
+    // 调用失败回调
+    if (options.onError) {
+      options.onError(error);
+    }
+  }
+}
+
+const handleRemove = (uploadFile, uploadFiles) => {
+  // 实际项目中，这里应该先调用删除API，成功后再从列表中移除
+  const index = sqnrData.fileList.findIndex(f => f.name === uploadFile.name);
+  if (index !== -1) {
+    sqnrData.fileList.splice(index, 1);
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/css/layout.scss";
+@import "@/assets/css/element-plus.scss";
+</style>
+<style>
+.tabBoxRadio .el-checkbox__inner {
+  border-radius: 50% !important;
+}
+
+.tabBoxRadio .el-table__header-wrapper .el-checkbox {
+  display: none;
+}
+
+.file-attachment-section {
+  margin-top: 15px;
+}
+
+.section-title {
+  font-size: 14px;
+  font-weight: 500;
+  color: #303133;
+  margin-bottom: 10px;
+  padding-bottom: 5px;
+  border-bottom: 1px solid #ebeef5;
+}
+
+.file-list-container {
+  max-height: 100px;
+  overflow-y: auto;
+  border: 1px solid #ebeef5;
+  border-radius: 4px;
+  background-color: #ffffff;
+  margin-bottom: 10px;
+}
+
+/* 自定义滚动条样式 */
+.file-list-container::-webkit-scrollbar {
+  width: 6px;
+}
+
+.file-list-container::-webkit-scrollbar-track {
+  background: #f1f1f1;
+  border-radius: 3px;
+}
+
+.file-list-container::-webkit-scrollbar-thumb {
+  background: #c0c4cc;
+  border-radius: 3px;
+}
+
+.file-list-container::-webkit-scrollbar-thumb:hover {
+  background: #909399;
+}
+
+.empty-file-list {
+  padding: 20px;
+  text-align: center;
+  color: #909399;
+  font-size: 12px;
+}
+
+.file-list {
+  padding: 5px;
+}
+
+.file-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 10px;
+  margin-bottom: 2px;
+  background-color: #f8f9fa;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+  cursor: pointer;
+}
+
+.file-item:hover {
+  background-color: #e6f7ff;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+}
+
+.file-info {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  gap: 15px;
+  min-width: 0;
+}
+
+.file-name {
+  flex: 1;
+  font-size: 12px;
+  color: #303133;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.file-size {
+  font-size: 11px;
+  color: #909399;
+  min-width: 60px;
+}
+
+.file-time {
+  font-size: 11px;
+  color: #909399;
+}
+
+.file-actions {
+  display: flex;
+  align-items: center;
+  gap: 5px;
+  margin-left: 10px;
+}
+
+.file-actions .el-button {
+  padding: 0 5px;
+  margin: 0;
+  color: #606266;
+  transition: color 0.3s ease;
+}
+
+.file-actions .el-button:hover {
+  color: #409eff;
+}
+
+.delete-btn:hover {
+  color: #f56c6c !important;
+}
+
+.upload-btn-container {
+  display: flex;
+  justify-content: center;
+  margin-top: 10px;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/component/record.vue

@@ -0,0 +1,338 @@
+<template>
+  <el-dialog :title="titleValue" width="800px" :model-value="modelValue" append-to-body @close="closed">
+    <div style="padding: 5px;">
+      <div class="butHandle">
+        <h3>记录人员</h3>
+        <div> <el-button type="primary" @click="showDialog = true">选择</el-button></div>
+      </div>
+    </div>
+    <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-width="120px">
+      <el-form-item label="姓名" prop="xm">
+        <el-input v-model="ruleForm.xm" type="input" placeholder="请输入姓名" class="background-info-input" readonly />
+      </el-form-item>
+      <el-form-item label="所属部门" prop="ssbm">
+        <el-input v-model="ruleForm.ssbm" type="input" placeholder="请输入姓名" class="background-info-input" readonly />
+      </el-form-item>
+      <el-form-item label="工作记录" prop="gzjl">
+        <el-input v-model="ruleForm.gzjl" :autosize="{ minRows: 4, maxRows: 10 }" type="textarea" placeholder="请输入研判记录"
+          class="background-info-input" />
+      </el-form-item>
+    </el-form>
+    <!-- 文件列表区域 -->
+    <div class="file-attachment-section">
+      <div class="section-title">相关附件</div>
+      <div class="file-list-container">
+        <div v-if="ruleForm?.fileList.length == 0" class="empty-file-list">暂无附件</div>
+        <div v-else class="file-list">
+          <div v-for="(file, index) in ruleForm?.fileList" :key="index" class="file-item">
+            <div class="file-info">
+              <span class="file-name">{{ file.originalName }}</span>
+              <span class="file-time">{{ file.uploadTime }}</span>
+            </div>
+            <div class="file-actions">
+              <el-button type="text" size="small" @click="downloadFile(file)" title="下载文件" :disabled="disabled">
+                <el-icon>
+                  <Download />
+                </el-icon>
+              </el-button>
+              <el-button type="text" size="small" @click="deleteFile(index)" title="删除文件" class="delete-btn"
+                :disabled="disabled">
+                <el-icon>
+                  <Delete />
+                </el-icon>
+              </el-button>
+            </div>
+          </div>
+        </div>
+      </div>
+      <!-- 上传按钮区域 -->
+      <div class="upload-btn-container">
+        <el-upload v-model:file-list="ruleForm.fileList" class="upload-demo" :show-file-list="false" multiple
+          :http-request="handleUploadRequest" :on-remove="handleRemove" :limit="3" :on-exceed="handleExceed">
+          <el-button type="primary" :disabled="disabled">上传文件</el-button>
+        </el-upload>
+      </div>
+    </div>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="closed">取消</el-button>
+        <el-button type="primary" @click="onComfirm">确认</el-button>
+      </div>
+    </template>
+  </el-dialog>
+  <ChooseUser :Single="true" v-model="showDialog" @choosedUsers="addMarks" :roleIds="roleIds" />
+</template>
+
+<script setup>
+import { ref, onMounted, reactive, watch, getCurrentInstance } from "vue";
+import { generateRandom10Digits } from '@/utils/tools'
+import ChooseUser from "@/components/ChooseList/ChooseUser/index.vue";
+import { uploadMultipleFiles } from '../model/fileUp'
+import { ElMessage } from 'element-plus';
+const { proxy } = getCurrentInstance()
+
+const props = defineProps({
+  modelValue: {
+    type: Boolean,
+    default: false
+  },
+  titleValue: {
+    type: String,
+    default: "集会记录"
+  },
+  data: {
+    type: Object,
+    default: () => { }
+  }
+});
+const emits = defineEmits(["update:modelValue", "comfirm"]);
+const showDialog = ref(false)
+const roleIds = ref([])
+const ruleForm = ref({
+  xm: "",
+  gzjl: "",
+  ssbm: "",
+  sfzh: '',
+  ssbmdm: "",
+  fileList: [],
+})
+const rules = ref({
+  gzjl: [
+    { required: true, message: '请输入工作记录', trigger: 'blur' }
+  ]
+})
+const onComfirm = () => {
+  if (!ruleForm.value.xm) {
+    proxy.$message.error('请选择民警')
+    return
+  }
+  const promes = {
+    ...ruleForm.value,
+    id: ruleForm.value.id ? ruleForm.value.id : generateRandom10Digits(),
+  }
+  emits("comfirm", { ...promes });
+  emits("update:modelValue", false);
+}
+watch(() => props.data, (val) => {
+  if (val) {
+    ruleForm.value = {
+      ...val,
+      fileList: val.fj
+    }
+  }
+}, { deep: true })
+
+const addMarks = (val) => {
+  ruleForm.value.sfzh = val[0].idEntityCard
+  ruleForm.value.ssbmdm = val[0].deptId
+  ruleForm.value.xm = val[0].userName
+  ruleForm.value.ssbm = val[0].deptName
+  roleIds.value = val.map(item => item.id)
+}
+// 下载文件
+const downloadFile = (file) => {
+  // 实际项目中，这里应该调用下载API
+  console.log('下载文件:', file.name)
+  // 示例：window.open(file.url)
+}
+// 删除文件
+const deleteFile = (index) => {
+  // 实际项目中，这里应该先调用删除API，成功后再从列表中移除
+  ruleForm.value.fileList.splice(index, 1)
+  ElMessage.success('文件已删除')
+}
+
+// 上传相关方法
+const handleUploadRequest = async (options) => {
+  try {
+    // 调用uploadMultipleFiles进行文件上传
+    const result = await uploadMultipleFiles(options.file, {
+      uploadedFiles: ruleForm.value.fileList,
+      fjIds: [], // 如果需要保存文件ID列表，可以在这里传递
+      compressImage: null // 可选的图片压缩函数
+    });
+    // 更新文件列表，添加上传时间信息
+    const index = ruleForm.value.fileList.findIndex(f => f.originalName === options.file.name);
+    if (index !== -1) {
+      ruleForm.value.fileList[index].uploadTime = new Date().toLocaleString('zh-CN');
+    }
+    // 调用成功回调
+    if (options.onSuccess) {
+      options.onSuccess(result);
+    }
+  } catch (error) {
+    console.error('文件上传失败:', error);
+    // 调用失败回调
+    if (options.onError) {
+      options.onError(error);
+    }
+  }
+}
+
+const handleRemove = (uploadFile, uploadFiles) => {
+  // 实际项目中，这里应该先调用删除API，成功后再从列表中移除
+  const index = ruleForm.value.fileList.findIndex(f => f.name === uploadFile.name);
+  if (index !== -1) {
+    ruleForm.value.fileList.splice(index, 1);
+  }
+}
+const closed = () => {
+  ruleForm.value = {
+    xm: "",
+    ssbm: "",
+    gzjl: "",
+    ssry: [],
+    fileList: []
+  }
+  roleIds.value.length = 0
+  emits("update:modelValue", false);
+};
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/css/layout.scss";
+@import "@/assets/css/element-plus.scss";
+
+.tabBoxRadio .el-checkbox__inner {
+  border-radius: 50% !important;
+}
+
+.tabBoxRadio .el-table__header-wrapper .el-checkbox {
+  display: none;
+}
+
+.file-attachment-section {
+  margin-top: 15px;
+}
+
+.section-title {
+  font-size: 14px;
+  font-weight: 500;
+  color: #303133;
+  margin-bottom: 10px;
+  padding-bottom: 5px;
+  border-bottom: 1px solid #ebeef5;
+}
+
+.file-list-container {
+  max-height: 100px;
+  overflow-y: auto;
+  border: 1px solid #ebeef5;
+  border-radius: 4px;
+  background-color: #ffffff;
+  margin-bottom: 10px;
+}
+
+/* 自定义滚动条样式 */
+.file-list-container::-webkit-scrollbar {
+  width: 6px;
+}
+
+.file-list-container::-webkit-scrollbar-track {
+  background: #f1f1f1;
+  border-radius: 3px;
+}
+
+.file-list-container::-webkit-scrollbar-thumb {
+  background: #c0c4cc;
+  border-radius: 3px;
+}
+
+.file-list-container::-webkit-scrollbar-thumb:hover {
+  background: #909399;
+}
+
+.empty-file-list {
+  padding: 20px;
+  text-align: center;
+  color: #909399;
+  font-size: 12px;
+}
+
+.file-list {
+  padding: 5px;
+}
+
+.file-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 10px;
+  margin-bottom: 2px;
+  background-color: #f8f9fa;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+  cursor: pointer;
+}
+
+.file-item:hover {
+  background-color: #e6f7ff;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+}
+
+.file-info {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  gap: 15px;
+  min-width: 0;
+}
+
+.file-name {
+  flex: 1;
+  font-size: 12px;
+  color: #303133;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.file-size {
+  font-size: 11px;
+  color: #909399;
+  min-width: 60px;
+}
+
+.file-time {
+  font-size: 11px;
+  color: #909399;
+}
+
+.file-actions {
+  display: flex;
+  align-items: center;
+  gap: 5px;
+  margin-left: 10px;
+}
+
+.file-actions .el-button {
+  padding: 0 5px;
+  margin: 0;
+  color: #606266;
+  transition: color 0.3s ease;
+}
+
+.file-actions .el-button:hover {
+  color: #409eff;
+}
+
+.delete-btn:hover {
+  color: #f56c6c !important;
+}
+
+.upload-btn-container {
+  display: flex;
+  justify-content: center;
+  margin-top: 10px;
+}
+
+.butHandle {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+::v-deep .el-range-input {
+  color: #000 !important;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/component/showXz.vue

@@ -0,0 +1,236 @@
+<template>
+  <el-dialog :title="titleValue" width="1400px" :model-value="modelValue" append-to-body @close="closed">
+    <div>
+      <el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
+        <el-form-item label="性质名称">
+          <el-input placeholder="请输入性质名称" v-model="listQuery.bqMc" clearable></el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="success" @click="handleFilter">查询</el-button>
+          <el-button type="info" @click="reset"> 重置 </el-button>
+        </el-form-item>
+      </el-form>
+      <div class="tabBox" :class="props.Single ? 'tabBoxRadio' : ''" :key="keyVal" style="margin-top: 0px">
+        <el-table ref="multipleUserRef" @selection-change="handleSelectionChange" :data="tableData" v-loading="loading"
+          border :row-key="keyid" style="width: 100%" height="450">
+          <el-table-column type="selection" width="55" :reserve-selection="true" />
+          <el-table-column prop="zdmc" align="center" label="性质名称" />
+          <el-table-column prop="dm" align="center" label="性质代码" />
+        </el-table>
+      </div>
+    </div>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="closed">取消</el-button>
+        <el-button type="primary" @click="onComfirm">确认</el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { defineProps, ref, getCurrentInstance, watch } from "vue";
+import { nextTick } from 'vue';
+const { proxy } = getCurrentInstance();
+const { D_ZDQT_QTXZ } = proxy.$dict("D_ZDQT_QTXZ"); //获取字典数据
+const props = defineProps({
+  modelValue: {
+    type: Boolean,
+    default: false
+  },
+  titleValue: {
+    type: String,
+    default: "选择标签"
+  },
+  LeaderType: {
+    type: String,
+    default: ""
+  },
+  //是否单选
+  Single: {
+    type: Boolean,
+    default: false
+  },
+  roleIds: {
+    type: Array,
+    default: []
+  }
+});
+const loading = ref(false);
+const listQuery = ref({
+  pageCurrent: 1,
+  pageSize: 20
+});
+
+const keyVal = ref();
+const multipleUserRef = ref(null);
+const multipleSelectionUser = ref([]);
+const tableData = ref([]);
+const emits = defineEmits(["update:modelValue", "choosed"]);
+const keyid = (row) => {
+  return row.dm;
+};
+const closed = () => {
+  // 清空选中状态
+  multipleSelectionUser.value = [];
+  
+  // 如果表格实例存在，取消所有选中行
+  if (multipleUserRef.value && tableData.value && tableData.value.length > 0) {
+    tableData.value.forEach((item) => {
+      multipleUserRef.value.toggleRowSelection(item, false);
+    });
+  }
+  
+  // 关闭对话框
+  emits("update:modelValue", false);
+};
+
+// 为用户分配角色
+const onComfirm = () => {
+  const userList = multipleSelectionUser.value;
+  let list = [];
+  let listId = [];
+  userList.forEach((val) => {
+    if (listId.indexOf(val.id) == -1) {
+      list.push(val);
+      listId.push(val.id);
+    }
+  });
+  emits("choosed", list);
+  closed();
+};
+
+const getListData = () => {
+  loading.value = true;
+  try {
+    tableData.value = D_ZDQT_QTXZ.value || [];
+    console.log(tableData.value);
+    // 数据加载完成后调用回显函数
+    nextTick(() => {
+      multipleUser();
+    });
+  } catch (error) {
+    console.error('获取数据失败:', error);
+  } finally {
+    loading.value = false;
+  }
+};
+
+//列表回显
+function multipleUser() {
+  if (!multipleUserRef.value || !tableData.value || tableData.value.length === 0) {
+    return;
+  }
+  
+  // 先清空所有选中状态
+  tableData.value.forEach((item) => {
+    multipleUserRef.value.toggleRowSelection(item, false);
+  });
+  // 再设置需要选中的行
+  if (props.roleIds && props.roleIds.length > 0) {
+    const selectedItems = tableData.value.filter(item => 
+      props.roleIds.some(id => id == item.id)
+    );
+    
+    selectedItems.forEach(item => {
+      multipleUserRef.value.toggleRowSelection(item, true);
+    });
+    
+    // 更新选中的数据
+    multipleSelectionUser.value = selectedItems;
+  }
+}
+
+const handleFilter = () => {
+  const originalData = D_ZDQT_QTXZ.value || [];
+  if (listQuery.value.bqMc) {
+    tableData.value = originalData.filter(item => 
+      item.zdmc.includes(listQuery.value.bqMc)
+    );
+  } else {
+    tableData.value = [...originalData];
+  }
+  
+  // 筛选后重新回显
+  nextTick(() => {
+    multipleUser();
+  });
+};
+
+const reset = () => {
+  listQuery.value.bqMc = '';
+  getListData();
+};
+const handleSelectionChange = (val) => {
+  if (props.Single) {
+    if (val.length > 1) {
+      let del_row = val.shift();
+      multipleUserRef.value.toggleRowSelection(del_row, false);
+    }
+    multipleSelectionUser.value = val;
+  } else {
+    multipleSelectionUser.value = val;
+  }
+};
+
+watch(
+  () => props.modelValue,
+  (val) => {
+    if (val) {
+      // 重置查询条件
+      reset();
+      // 重新加载数据
+      getListData();
+    } else {
+      // 关闭时清空选中状态
+      multipleSelectionUser.value = [];
+    }
+  },
+  { immediate: true }
+);
+
+// 监听roleIds变化，重新回显
+watch(
+  () => props.roleIds,
+  () => {
+    if (props.modelValue) {
+      nextTick(() => {
+        multipleUser();
+      });
+    }
+  },
+  { deep: true }
+);
+
+// 监听Single属性变化，确保单选模式下只保留一个选中项
+watch(
+  () => props.Single,
+  () => {
+    if (props.Single && multipleSelectionUser.value.length > 1) {
+      const firstItem = multipleSelectionUser.value[0];
+      multipleSelectionUser.value = [firstItem];
+      // 重新设置选中状态
+      nextTick(() => {
+        multipleUser();
+      });
+    }
+  }
+);
+
+// 引入nextTick
+
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/css/layout.scss";
+@import "@/assets/css/element-plus.scss";
+</style>
+<style>
+.tabBoxRadio .el-checkbox__inner {
+  border-radius: 50% !important;
+}
+
+.tabBoxRadio .el-table__header-wrapper .el-checkbox {
+  display: none;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/components copy/addForm.vue

@@ -0,0 +1,327 @@
+<template>
+  <div class="dialog" v-if="dialogForm">
+    <div class="head_box">
+      <span class="title">{{ title }} 重点群体管理 </span>
+      <div>
+        <el-button type="primary" v-if="!disabled" size="small" :loading="loading" @click="submit">保存</el-button>
+        <el-button size="small" @click="close">关闭</el-button>
+      </div>
+    </div>
+    <div class="form_cnt">
+       <FormMessage :disabled="disabled" v-model="listQuery" labelWidtth="" :formList="formData" labelWidth="120px" ref="elform" :rules="rules">
+        <template #bqList>
+          <div class="marks pointer" @click="handleChooseMarks">
+            <span style="color: rgb(175 178 184);padding-left: 10px;" v-if="!listQuery.bqList || listQuery.bqList.length == 0 ">请选择标签</span>
+            <span v-else >
+              <el-tag @close.stop="closeTag(idx)" type="success" :closable="disabled ? false:true" v-for="(it,idx) in listQuery.bqList" :key="idx">{{ it.bqMc }}</el-tag >
+            </span>
+        </div>
+        </template>  
+        <template #lqxxList>
+          <div class="ww100">
+            <div class="ww100 mb10"><el-button type="primary" v-if="!disabled" @click="handleCjlr('add',null)">新增</el-button></div>
+            <div style="width:99.5%">
+              <MyTable
+                :tableData="listQuery.lqxxList"
+                :tableColumn="pageData.qcjListColumn"
+                :key="pageData.keyCountCj"
+                :tableConfiger="pageData.qcjConfiger"
+                :controlsWidth="pageData.controlsWidth">
+                <template #controls="{ row }">
+                  <el-link type="danger" @click="delDictItem(row)">删除</el-link>
+                </template>
+              </MyTable>
+            </div>
+          </div>
+        </template>
+       </FormMessage>
+      <div class="ml50 mr50"><span class="mr10">管理重点人 : </span><el-button v-if="!disabled" @click="chooseVisible_RY = true" type="primary" >选择</el-button></div>
+      <div class="boxlist ml50 mr50">
+        <MyTable
+          :tableData="listQuery.zdryList"
+          :tableColumn="pageData.zdryColumn"
+          :key="pageData.keyCount"
+          :tableConfiger="pageData.tableConfiger"
+          :controlsWidth="pageData.controlsWidth">
+          <template #ryXb	="{ row }">
+            <DictTag :value="row.ryXb	" :tag="false" :options="props.dic.D_BZ_XB" />
+          </template>
+          <template #controls="{ row }">
+            <el-link type="danger" @click="deleteRow(row)">删除</el-link>
+          </template>
+        </MyTable>
+      </div>
+      <!-- 选择审核人 -->
+      <div class="ww100 mt20 ml50 mr50">
+        <el-steps direction="vertical" :active="listQuery.wccz" space="500" finish-status="success">
+            <el-step title="发起申请" >
+              <template #description>
+                <div class="flex align-center ww100 mt10 mb20">
+                  <el-input v-model="listQuery.sqrXm" readonly class="ww20"></el-input>
+                  <el-input v-model="listQuery.sqrSsbmmc" readonly class="ww20 ml10 mr10"></el-input>
+                  <span class="f12" style="color: #333333;"> 备注发起人和部门根据登陆人自动填写</span>
+                </div>
+              </template>
+            </el-step>
+            <el-step title="审核确认" >
+              <template #description>
+                <div class="flex align-center ww100 mt10 mb20 depBox">
+                  <span class="mr4">审核部门 : </span>
+                  <MOSTY.Department :isAll="true" @getDepValue="getShdep" v-model="listQuery.shrSsbmdm" clearable :placeholder="listQuery.shrSsbmmc ? listQuery.shrSsbmmc : '' "  />
+                </div>
+              </template>
+            </el-step>
+            <el-step title="审批确认" >
+              <template #description>
+                <div class="flex align-center ww100 mt10 mb20 depBox">
+                  <span lass="mr4">审批部门 : </span>
+                  <MOSTY.Department :isAll="true" @getDepValue="getSPdep" v-model="listQuery.sprSsbmdm" clearable :placeholder="listQuery.sprSsbmmc ? listQuery.sprSsbmmc : '' "  />
+                </div>
+              </template>
+            </el-step>
+        </el-steps>
+      </div>
+    </div>
+  </div>
+  <!-- 采集录入 -->
+  <Addcjlr ref="cjlrDialog" @change="addEdteCj"></Addcjlr>
+  <!-- 标签选择 -->
+  <ChooseMarks v-model="chooseMarksVisible" @choosed="addMarks" :roleIds="roleIds" />
+  <!-- 选择布控人员 -->
+  <BkryDialod v-model="chooseVisible_RY" @choosed="choosedPeo" @choosedAdd="choosedAdd" :roleIds="roleIds_RY" />
+</template>
+
+<script setup>
+import { getItem } from "@/utils/storage";
+import * as MOSTY from "@/components/MyComponents/index";
+import Addcjlr from './addcjlr.vue'
+import BkryDialod from '@/components/ChooseList/ChooseZdr/index.vue';
+import ChooseMarks from "@/components/ChooseList/ChooseMarks/index.vue";
+import FormMessage from "@/components/aboutTable/FormMessage.vue";
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import { qcckGet, qcckPost } from "@/api/qcckApi.js";
+import {ref,defineExpose,reactive,onMounted,defineEmits,getCurrentInstance } from "vue";
+const { proxy } = getCurrentInstance();
+const emit = defineEmits(["updateDate"]);
+const props = defineProps({
+  dic: Object
+});
+const cjlrDialog = ref()
+const chooseMarksVisible = ref(false)
+const chooseVisible_RY = ref(false)
+const roleIds = ref([])
+const roleIds_RY = ref([])
+const addPerson = ref([]) //单独新增的数据
+const dialogForm = ref(false); //弹窗
+const rules = reactive({
+  qtMc: [{ required: true, message: "请输入群体名称", trigger: "blur" }],
+  qtFxdj: [{ required: true, message: "请选择风险等级", trigger: "change" }],
+  qtLb: [{ required: true, message: "请选择群体类别", trigger: "change" }],
+  qtClsj: [{ required: true, message: "请选择群体成立时间", trigger: "change" }],
+  bqList: [{ required: true, message: "请选择群体标签", trigger: "change" }],
+  zdrLkyy: [{ required: true, message: "请输入列控原因", trigger: "blur" }],
+});
+const formData = ref([
+  { label: "群体名称", prop: "qtMc", type: "input" },
+  { label: "风险等级", prop: "qtFxdj", type: "select", options: props.dic.D_GS_ZDQT_FXDJ },
+  { label: "群体类别", prop: "qtLb", type: "select", options: props.dic.D_GS_ZDQT_LB },
+  { label: "群体成立时间", prop: "qtClsj", type: "date" },
+  { label: "群体标签", prop: "bqList", type: "slot", width: "100%" },
+  { label: "两群采集录入", prop: "lqxxList", type: "slot", width: "100%" },
+  { label: "管辖单位", prop: "gxSsdwdm",depMc:'gxSsdwmc', type: "department" },
+  { label: "入库开始时间", prop: "zdrRkkssj", type: "datetime" },
+  { label: "入库截至时间", prop: "zdrRkjssj", type: "datetime" },
+  { label: "列控原因", prop: "zdrLkyy", type: "textarea",width: "100%" },
+]);
+const pageData = reactive({
+  keyCountCj: 0,
+  keyCount: 0,
+  tableConfiger: {
+    rowHieght: 61,
+    showSelectType: "checkBox",
+    loading: false,
+  },
+  qcjConfiger: {
+    rowHieght: 61,
+    showSelectType: "null",
+    loading: false,
+  },
+  controlsWidth: 120, //操作栏宽度
+  zdryColumn: [
+    { label: "姓名", prop: "ryXm"},
+    { label: "性别", prop: "ryXb", showSolt: true },
+    { label: "身份证号 ", prop: "rySfzh"},
+    { label: "户籍地", prop: "hjdXz" },
+    { label: "现居地", prop: "xzdXz"},
+    { label: "手机号", prop: "ryLxdh"},
+  ],
+  qcjListColumn:[
+     { label: "微信群", prop: "wxqId" },
+     { label: "QQ群", prop: "qqqId" },
+     { label: "群主昵称", prop: "qzNc" },
+     { label: "群主姓名", prop: "qzXm" },
+     { label: "群主联系电话", prop: "qzLxdh" },
+     { label: "群重要内容", prop: "qzynr" },
+  ]
+});
+const disabled = ref(false)
+const listQuery = ref({}); //表单
+const loading = ref(false);
+const elform = ref();
+const title = ref("");
+
+// 初始化数据
+const init = async (type, row) => {
+  dialogForm.value = true;
+  title.value = type == "add" ? "新增" :  type == 'detail' ?  '详情':"编辑";
+  if(type == 'add'){
+    listQuery.value.sqrXm = getItem("USERNAME");
+    listQuery.value.bkfqrSfzh = getItem("idEntityCard");
+    listQuery.value.sqrSsbmmc = getItem("deptId")[0].deptName;;
+    listQuery.value.sqrSsbmdm = getItem("deptId")[0].deptCode;;
+  }
+  disabled.value = type == 'detail' ? true : false;
+  pageData.tableConfiger.haveControls = type == "detail" ? false: true;
+  pageData.qcjConfiger.haveControls = type == "detail" ? false: true;
+  if(row) getDataById(row.id)
+};
+
+// 根据id查询详情
+const getDataById = (id) => {
+  qcckGet({}, "/mosty-gsxt/tbGsxtZdqt/selectVoById/" + id).then((res) => {
+    listQuery.value = res;
+  });
+};
+
+// 采集录入
+const handleCjlr = (type,row) =>{
+  cjlrDialog.value.init(type,row);
+}
+
+const addEdteCj = (val) =>{
+  if(!listQuery.value.lqxxList) listQuery.value.lqxxList = [];
+  listQuery.value.lqxxList.unshift(val.data);
+  pageData.keyCountCj++;
+}
+
+const  handleChooseMarks = () =>{
+  if(disabled.value) return;
+  chooseMarksVisible.value = true
+}
+
+// 新增标签
+const addMarks =  (val) =>{
+  listQuery.value.bqList = val.map(v=>{
+    return { bqDm:v.bqDm, bqId:v.id, bqLb:v.bqLb, bqLx:v.bqLx, bqMc:v.bqMc }
+  });
+  roleIds.value = val.map(v=>v.id)
+}
+
+// 删除数据
+const closeTag = (idx) =>{
+  listQuery.value.bqList.splice(idx,1)
+  roleIds.value.splice(idx,1)
+}
+
+// 选择人员
+const choosedPeo = (val) =>{
+  roleIds_RY.value = val.map(it=>it.id);
+  let arr = val.map(item=>{
+      let bqArr = item.bqList || [];
+      let bqs = bqArr.map(v=>{
+        return { bqZl:v.bqZl , bqId:v.bqId, bqLx:v.bqLx, bqLb:v.bqLb, bqMc:v.bqMc, bqDm:v.bqDm }
+      })
+      return { id:item.id, fjZp:item.fjZp, ryXm:item.ryXm, ryXb:item.ryXb, rySfzh:item.rySfzh, hjdXz:item.hjdXz, xzdXz:item.xzdXz, ryLxdh:item.ryLxdh, qtXnsf:item.qtXnsf,clCjh:item.clCjh, clCph:item.clCph, qtTzms:item.qtTzms, bqList:bqs }
+  })
+  listQuery.value.zdryList = [...addPerson.value,...arr]; 
+  pageData.keyCount++;
+}
+
+// 单独新增的数据
+const choosedAdd = (item) =>{
+  let obj = { id:item.id, fjZp:item.fjZp, ryXm:item.ryXm, ryXb:item.ryXb, rySfzh:item.rySfzh, hjdXz:item.hjdXz, xzdXz:item.xzdXz, ryLxdh:item.ryLxdh, qtXnsf:item.qtXnsf,clCjh:item.clCjh, clCph:item.clCph, qtTzms:item.qtTzms, bqList:item.bqList }
+  addPerson.value.push(obj) ;//缓存的数据
+  if(!listQuery.value.zdryList) listQuery.value.zdryList = [];
+  listQuery.value.zdryList.unshift(obj);
+}
+
+// 删除数据
+const deleteRow = (row) => {
+  roleIds_RY.value = roleIds_RY.value.filter(id => id != row.id);
+  addPerson.value = addPerson.value.filter(it => it.id != row.id);
+  listQuery.value.zdryList = listQuery.value.zdryList.filter(it => it.id != row.id);
+}
+
+
+// 提交
+const submit = () => {
+  elform.value.submit((data) => {
+    let params = { ...data }
+    loading.value = true;
+    let url = title.value == "新增" ? "/mosty-gsxt/tbGsxtZdqt/save" : "/mosty-gsxt/tbGsxtZdqt/update";
+    qcckPost(params, url).then(() => {
+      loading.value = false;
+      proxy.$message({ type: "success", message: title.value + "成功" });
+      emit("updateDate");
+      close();
+    }).catch(() => { loading.value = false;});
+  });
+};
+
+const getShdep = (val) =>{
+  listQuery.value.shrSsbmmc = val ? val.orgName : ''
+}
+const getSPdep = (val) =>{
+  listQuery.value.sprSsbmmc = val ? val.orgName : ''
+}
+
+const delDictItem = (row) =>{
+  listQuery.value.lqxxList = listQuery.value.lqxxList.filter(v=>{
+    return row.id != v.id
+  })
+}
+
+// 关闭
+const close = () => {
+  listQuery.value = {};
+  dialogForm.value = false;
+  loading.value = false;
+};
+defineExpose({ init });
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
+
+.boxlist {
+  width: calc(99% - 50px);
+  margin-top: 10px;
+  overflow: hidden;
+}
+.marks{
+  width: 100%;
+  min-height: 32px;
+  border: 1px solid #e9e9e9;
+  border-radius: 4px;
+}
+.depBox{
+    border: 1px solid #e9e9e9;
+    width: 305px;
+    padding: 0 0 0 4px;
+    border-radius: 4px;
+    ::v-deep .el-input__inner{
+        border: none;
+    }
+    ::v-deep .el-cascader .el-input.is-focus .el-input__inner{
+        border-color: transparent !important;
+    }
+    ::v-deep .el-input__inner:focus {
+        box-shadow: none;
+    }
+    ::v-deep .el-input.is-disabled .el-input__inner{
+        border-color: transparent !important;
+    }
+  
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/components copy/addcjlr.vue

@@ -0,0 +1,68 @@
+<template>
+  <el-dialog v-model="showDialog" :destroy-on-close="true" title="采集录入" @close="close" :close-on-click-modal="false">
+    <FormMessage v-model="listQuery" :formList="formData" labelWidth="120px" ref="elform" :rules="rules">
+    </FormMessage>
+    <template #footer>
+        <div class="flex just-center">
+            <el-button @click="close">取消</el-button>
+            <el-button type="primary" @click="submitForm">确认</el-button>
+        </div>
+    </template>
+  </el-dialog>
+  
+</template>
+
+<script setup>
+
+import FormMessage from "@/components/aboutTable/FormMessage.vue";
+import { reactive, ref,getCurrentInstance } from 'vue';
+const { proxy } = getCurrentInstance();
+const { D_BZ_XB } = proxy.$dict("D_BZ_XB"); // 获取字典数据
+const elform = ref()
+const showDialog = ref(false)
+const emit = defineEmits(['change'])
+const listQuery = ref({})
+const formData = ref([
+    { label: "微信群", prop: "wxqId", type: "input" ,width:'45%'},
+    { label: "QQ群", prop: "qqqId", type: "input" ,width:'45%'},
+    { label: "群主昵称", prop: "qzNc", type: "input",width:'45%' },
+    { label: "群主姓名", prop: "qzXm", type: "input",width:'45%' },
+    { label: "群主联系电话", prop: "qzLxdh", type: "input",width:'45%' },
+    { label: "群重要内容", prop: "qzynr", type: "textarea",width:'100%' },
+])
+const rules = reactive({
+    wxqId: [{ required: true, message: "请输入微信群", trigger: "blur" }],
+    qqqId: [{ required: true, message: "请输入QQ群", trigger: "blur" }],
+    qzNc: [{ required: true, message: "请输入群主昵称", trigger: "blur" }],
+    qzXm: [{ required: true, message: "请输入群主姓名", trigger: "blur" }],
+    qzLxdh: [{ required: true, message: "请输入群主联系电话", trigger: "blur" }],
+    qZynr: [{ required: true, message: "请输入群重要内容", trigger: "blur" }],
+})
+const type = ref('')
+const init = (lx,row) =>{
+    type.value = lx;
+    if(row) listQuery.value = JSON.parse(JSON.stringify(row))
+    showDialog.value = true;
+}
+
+const submitForm = () =>{
+    elform.value.submit((val)=>{
+        val.id = new Date().getTime();
+        let obj = { type:type.value, data:val }
+        emit('change',obj)
+        showDialog.value = false;
+    })
+}
+
+const close = () =>{
+    elform.value.reset();
+    listQuery.value.bqList = []
+    showDialog.value = false;
+}
+
+defineExpose({init})
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/components copy/zxsForm.vue

@@ -0,0 +1,196 @@
+<template>
+  <div class="dialog" v-if="dialogForm">
+    <div class="head_box">
+      <span class="title">流线索</span>
+      <div>
+        <el-button type="primary" :loading="loading" @click="submit">保存</el-button>
+        <el-button @click="close">关闭</el-button>
+      </div>
+    </div>
+    <div class="form_cnt">
+      <FormMessage v-model="listQuery" :formList="formData" ref="elform" :rules="rules">
+        <template #gapdive>
+          <div style="width: 100%;height: 10px;" class="mb20">
+            <el-divider content-position="left">基础信息</el-divider>
+          </div>
+        </template>
+        <template #gapline>
+          <div style="width: 100%;height: 10px;" class="mb20">
+            <el-divider content-position="left">线索内容</el-divider>
+          </div>
+        </template>
+        <template #scfj>
+          <div style="width: 100%;padding-left: 50px;">
+            <div>上传附件:<span class="f12">（可附电子表格、Word文档、图像、音视频文件）</span> </div>
+            <div><MOSTY.Upload :showBtn="true" :isImg="true" :limit="10" v-model="fjdz" /> </div>
+          </div>
+        </template>
+      </FormMessage>
+      <el-divider content-position="left"><span class="mr20">相关人员</span> </el-divider>
+      <MyTable
+        :tableData="pageForm.tableData"
+        :tableColumn="pageForm.tableColumn"
+        :tableHeight="pageForm.tableHeight"
+        :key="pageForm.keyCount"
+        :tableConfiger="pageForm.tableConfiger"
+        :controlsWidth="pageForm.controlsWidth"
+      >
+      <template #xb="{row}">
+        <DictTag :value="row.xb" :tag="false" :options="props.dic.D_BZ_XB" />
+      </template>
+      <template #bqList="{row}">
+        <div v-if="row.bqList">
+          <el-tag type="success" v-for="(it,idx) in row.bqList" :key="idx">{{ it.bqMc }}</el-tag >
+        </div>
+      </template>
+      </MyTable>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import * as MOSTY from "@/components/MyComponents/index";
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import FormMessage from "@/components/aboutTable/FormMessage.vue";
+import { qcckPost } from "@/api/qcckApi.js";
+import { ref, defineExpose, reactive, onMounted, defineEmits, getCurrentInstance, nextTick } from "vue";
+const emit = defineEmits(["change"]);
+const props = defineProps({
+  dic: Object
+});
+const { proxy } = getCurrentInstance();
+const dialogForm = ref(false); //弹窗
+const rules = reactive({
+  xsMc: [{ required: true, message: "请输入线索名称", trigger: "blur" }],
+  xlLx: [{ required: true, message: "请选择线索类型", trigger: "change" }],
+  qbLy: [{ required: true, message: "请选择情报来源", trigger: "change" }],
+});
+const formData = ref([
+  { prop: "gapdive", type: "slot",width:'100%' },
+  { label: "线索名称", prop: "xsMc", type: "input" },
+  { label: "线索类型", prop: "xlLx", type: "select", options:props.dic.D_GS_XS_LX },
+  { label: "情报来源", prop: "qbLy", type: "select", options:props.dic.D_GS_XS_LY},
+  { label: "指向开始时间", prop: "zxkssj", type: "datetime"},
+  { label: "指向结束时间", prop: "zxjssj", type: "datetime"},
+  { label: "指向地点", prop: "zxdz", type: "input"},
+  { label: "所属专题", prop: "sszt", type: "select",options:props.dic.D_BZ_SSZT},
+  { prop: "gapline", type: "slot",width:'100%' },
+  { prop: "scfj", type: "slot",width:'100%'},
+  { label: "线索内容", prop: "xsNr", type: "textarea",width:'100%'},
+]);
+const fjdz = ref()
+const listQuery = ref({}); //表单
+const loading = ref(false);
+const elform = ref();
+const pageForm = reactive({
+  tableData: [],
+  keyCount: 0,
+  tableConfiger: {
+    rowHieght: 61,
+    showSelectType: "checkBox",
+    loading: false,
+    haveControls:false
+  },
+  controlsWidth: 220,
+  tableColumn: [
+    { label: "姓名", prop: "xm" },
+    { label: "性别", prop: "xb",showSolt:true },
+    { label: "身份证号", prop: "sfzh" },
+    { label: "户籍地", prop: "hjdz" },
+    { label: "户籍地派出所", prop: "hjdpcs" },
+    { label: "标签", prop: "bqList",showSolt:true }
+  ]
+});
+onMounted(()=>{
+  tabHeightFn()
+})
+
+
+// 初始化数据
+const init = (list) => {
+  fjdz.value = []
+  tabHeightFn()
+  dialogForm.value = true;
+  let peo = []
+  list.forEach(item => {
+    if(item.zdryList) peo = peo.concat(item.zdryList);
+  });
+  pageForm.tableData = peo.map((it) => {
+    return {
+      xm: it.ryXm,
+      xb: it.ryXb,
+      sfzh: it.rySfzh,
+      hjdz: it.xzdXz,
+      hjdpcs: it.hjdPcsmc,
+      hjdpcsdm: it.hjdPcsdm,
+      bqList: it.bqList || []
+    };
+  });
+  pageForm.keyCount++;
+};
+
+
+// 提交
+const submit = () => {
+  elform.value.submit((data) => {
+    let params = { ...data ,ryList:pageForm.tableData,cjLx:'0'};
+    params.fjdz = fjdz.value.length > 0 ? fjdz.value.join(','):'';
+    loading.value = true;
+    qcckPost(params, '/mosty-gsxt/qbcj/add').then((res) => {
+      loading.value = false;
+      proxy.$message({ type: "success", message: "成功" });
+      emit("change");
+      close();
+    }).catch(() => {
+      loading.value = false;
+    });
+  });
+};
+
+// 关闭
+const close = () => {
+  fjdz.value = []
+  listQuery.value = {};
+  dialogForm.value = false;
+  loading.value = false;
+};
+
+// 表格高度计算
+const tabHeightFn = () => {
+  pageForm.tableHeight = window.innerHeight  - 720;
+  window.onresize = function () {
+    tabHeightFn();
+  };
+};
+
+defineExpose({ init });
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
+::v-deep .el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
+  color: #0072ff;
+  background: rgba(0, 114, 255, 0.3);
+}
+.boxlist {
+  width: 99%;
+  height: 225px;
+  margin-top: 10px;
+  overflow: hidden;
+}
+
+::v-deep .avatar-uploader{
+  display: flex;
+  align-items: center;
+}
+
+::v-deep .el-upload-list{
+  margin-left: 20px;
+  display: flex;
+  align-items: center;
+}
+::v-deep .el-upload-list__item-name .el-icon{
+  top: 3px;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/components/addForm.vue

@@ -3,325 +3,417 @@
     <div class="head_box">
       <span class="title">{{ title }} 重点群体管理 </span>
       <div>
-        <el-button type="primary" v-if="!disabled" size="small" :loading="loading" @click="submit">保存</el-button>
+        <el-button type="primary" v-if="title == '新增'" size="small" :loading="loading" @click="submit">保存</el-button>
         <el-button size="small" @click="close">关闭</el-button>
       </div>
     </div>
-    <div class="form_cnt">
+    <div class="form_cnt flex just-between">
-       <FormMessage :disabled="disabled" v-model="listQuery" labelWidtth="" :formList="formData" labelWidth="120px" ref="elform" :rules="rules">
+      <div class="left_box">
-        <template #bqList>
+        <ul class="anchor-list">
-          <div class="marks pointer" @click="handleChooseMarks">
+          <li @click="scrollToSection('info-section')" :class="activeSection === 'info-section' ? 'active' : ''">基本信息</li>
-            <span style="color: rgb(175 178 184);padding-left: 10px;" v-if="!listQuery.bqList || listQuery.bqList.length == 0 ">请选择标签</span>
+          <li @click="scrollToSection('backinfo-section')" :class="activeSection === 'backinfo-section' ? 'active' : ''">群体信息</li>
-            <span v-else >
+          <li @click="scrollToSection('groupLabels-section')" :class="activeSection === 'groupLabels-section' ? 'active' : ''">群体标签</li>
-              <el-tag @close.stop="closeTag(idx)" type="success" :closable="disabled ? false:true" v-for="(it,idx) in listQuery.bqList" :key="idx">{{ it.bqMc }}</el-tag >
+          <li @click="scrollToSection('character-section')" :class="activeSection === 'character-section' ? 'active' : ''">群体性质</li>
-            </span>
+          <li @click="scrollToSection('controlInfo-section')" :class="activeSection === 'controlInfo-section' ? 'active' : ''">管控信息</li>
-        </div>
+          <li @click="scrollToSection('featinfo-section')" :class="activeSection === 'featinfo-section' ? 'active' : ''">群体特征</li>
-        </template>  
+          <li @click="scrollToSection('demandsInfo-section')" :class="activeSection === 'demandsInfo-section' ? 'active' : ''">主要诉求</li>
-        <template #lqxxList>
+          <li @click="scrollToSection('requestInfo-section')" :class="activeSection === 'requestInfo-section' ? 'active' : ''">诉求信息</li>
-          <div class="ww100">
+          <li @click="scrollToSection('personnel-section')" :class="activeSection === 'personnel-section' ? 'active' : ''">重点人员</li>
-            <div class="ww100 mb10"><el-button type="primary" v-if="!disabled" @click="handleCjlr('add',null)">新增</el-button></div>
+          <li @click="scrollToSection('judgmentRecord-section')" :class="activeSection === 'judgmentRecord-section' ? 'active' : ''">研判记录</li>
-            <div style="width:99.5%">
+          <li @click="scrollToSection('historyAssembly-section')" :class="activeSection === 'historyAssembly-section' ? 'active' : ''">历史汇集</li>
-              <MyTable
+          <li @click="scrollToSection('joblogging-section')" :class="activeSection === 'joblogging-section' ? 'active' : ''">工作记录</li>
-                :tableData="listQuery.lqxxList"
+        </ul>
-                :tableColumn="pageData.qcjListColumn"
-                :key="pageData.keyCountCj"
-                :tableConfiger="pageData.qcjConfiger"
-                :controlsWidth="pageData.controlsWidth">
-                <template #controls="{ row }">
-                  <el-link type="danger" @click="delDictItem(row)">删除</el-link>
-                </template>
-              </MyTable>
-            </div>
-          </div>
-        </template>
-       </FormMessage>
-      <div class="ml50 mr50"><span class="mr10">管理重点人 : </span><el-button v-if="!disabled" @click="chooseVisible_RY = true" type="primary" >选择</el-button></div>
-      <div class="boxlist ml50 mr50">
-        <MyTable
-          :tableData="listQuery.zdryList"
-          :tableColumn="pageData.zdryColumn"
-          :key="pageData.keyCount"
-          :tableConfiger="pageData.tableConfiger"
-          :controlsWidth="pageData.controlsWidth">
-          <template #ryXb	="{ row }">
-            <DictTag :value="row.ryXb	" :tag="false" :options="props.dic.D_BZ_XB" />
-          </template>
-          <template #controls="{ row }">
-            <el-link type="danger" @click="deleteRow(row)">删除</el-link>
-          </template>
-        </MyTable>
       </div>
-      <!-- 选择审核人 -->
+      <div class="right_box" ref="rightBox">
-      <div class="ww100 mt20 ml50 mr50">
+        <div id="info-section"><Info ref="info" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
-        <el-steps direction="vertical" :active="listQuery.wccz" space="500" finish-status="success">
+        <div id="backinfo-section"><Backinfo ref="backinfo" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
-            <el-step title="发起申请" >
+        <div id="groupLabels-section"><GroupLabels ref="groupLabels" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
-              <template #description>
+        <div id="character-section"><Character ref="character" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
-                <div class="flex align-center ww100 mt10 mb20">
+        <div id="controlInfo-section"><ControlInfo ref="controlInfo" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
-                  <el-input v-model="listQuery.sqrXm" readonly class="ww20"></el-input>
+        <div id="featinfo-section"><Featinfo ref="featinfo" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
-                  <el-input v-model="listQuery.sqrSsbmmc" readonly class="ww20 ml10 mr10"></el-input>
+        <div id="demandsInfo-section"><DemandsInfo ref="demandsInfo" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
-                  <span class="f12" style="color: #333333;"> 备注发起人和部门根据登陆人自动填写</span>
+        <div id="requestInfo-section"><RequestInfo ref="requestInfo" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
-                </div>
+        <div id="portrayal-section" v-if="portrayal"><Portrayal :disabled="disabled" :dataList="listQuery" /></div>
-              </template>
+        <div id="personnel-section"><Personnel ref="personnel" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
-            </el-step>
+        <div id="judgmentRecord-section"><JudgmentRecord ref="judgmentRecord" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
-            <el-step title="审核确认" >
+        <div id="historyAssembly-section"><HistoryAssembly ref="historyAssembly" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
-              <template #description>
+        <div id="joblogging-section"><Joblogging ref="joblogging" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
-                <div class="flex align-center ww100 mt10 mb20 depBox">
-                  <span class="mr4">审核部门 : </span>
-                  <MOSTY.Department :isAll="true" @getDepValue="getShdep" v-model="listQuery.shrSsbmdm" clearable :placeholder="listQuery.shrSsbmmc ? listQuery.shrSsbmmc : '' "  />
-                </div>
-              </template>
-            </el-step>
-            <el-step title="审批确认" >
-              <template #description>
-                <div class="flex align-center ww100 mt10 mb20 depBox">
-                  <span lass="mr4">审批部门 : </span>
-                  <MOSTY.Department :isAll="true" @getDepValue="getSPdep" v-model="listQuery.sprSsbmdm" clearable :placeholder="listQuery.sprSsbmmc ? listQuery.sprSsbmmc : '' "  />
-                </div>
-              </template>
-            </el-step>
-        </el-steps>
       </div>
     </div>
   </div>
-  <!-- 采集录入 -->
+
-  <Addcjlr ref="cjlrDialog" @change="addEdteCj"></Addcjlr>
-  <!-- 标签选择 -->
-  <ChooseMarks v-model="chooseMarksVisible" @choosed="addMarks" :roleIds="roleIds" />
-  <!-- 选择布控人员 -->
-  <BkryDialod v-model="chooseVisible_RY" @choosed="choosedPeo" @choosedAdd="choosedAdd" :roleIds="roleIds_RY" />
 </template>
 
 <script setup>
-import { getItem } from "@/utils/storage";
+import { ref, getCurrentInstance, onUnmounted } from "vue";
-import * as MOSTY from "@/components/MyComponents/index";
+import Info from '../model/info.vue'
-import Addcjlr from './addcjlr.vue'
+import Backinfo from "../model/backinfo.vue";
-import BkryDialod from '@/components/ChooseList/ChooseZdr/index.vue';
+import GroupLabels from '../model/groupLabels.vue'
-import ChooseMarks from "@/components/ChooseList/ChooseMarks/index.vue";
+import Character from "../model/character.vue";
-import FormMessage from "@/components/aboutTable/FormMessage.vue";
+import ControlInfo from '../model/controlInfo'
-import MyTable from "@/components/aboutTable/MyTable.vue";
+import Featinfo from '../model/featinfo'
-import { qcckGet, qcckPost } from "@/api/qcckApi.js";
+import DemandsInfo from '../model/demandsInfo'
-import {ref,defineExpose,reactive,onMounted,defineEmits,getCurrentInstance } from "vue";
+import RequestInfo from '../model/requestInfo'
+import Personnel from '../model/personnel.vue'
+import JudgmentRecord from "../model/judgmentRecord.vue";
+import HistoryAssembly from "../model/historyAssembly.vue";
+import Joblogging from "../model/joblogging.vue";
+import Portrayal from '../model/portrayal.vue'
+import { tbGsxtZdqtSelectVoById, tbZdqtQtxzBatchAdd, tbGsxtZdqtAdd, tbZdqtGkxxBatchAdd, tbZdqtSqBatchAdd } from '@/api/qt'
 const { proxy } = getCurrentInstance();
-const emit = defineEmits(["updateDate"]);
+const dialogForm = ref(false)
-const props = defineProps({
+const listQuery = ref({})
-  dic: Object
-});
-const cjlrDialog = ref()
-const chooseMarksVisible = ref(false)
-const chooseVisible_RY = ref(false)
-const roleIds = ref([])
-const roleIds_RY = ref([])
-const addPerson = ref([]) //单独新增的数据
-const dialogForm = ref(false); //弹窗
-const rules = reactive({
-  qtMc: [{ required: true, message: "请输入群体名称", trigger: "blur" }],
-  qtFxdj: [{ required: true, message: "请选择风险等级", trigger: "change" }],
-  qtLb: [{ required: true, message: "请选择群体类别", trigger: "change" }],
-  qtClsj: [{ required: true, message: "请选择群体成立时间", trigger: "change" }],
-  bqList: [{ required: true, message: "请选择群体标签", trigger: "change" }],
-  zdrLkyy: [{ required: true, message: "请输入列控原因", trigger: "blur" }],
-});
-const formData = ref([
-  { label: "群体名称", prop: "qtMc", type: "input" },
-  { label: "风险等级", prop: "qtFxdj", type: "select", options: props.dic.D_GS_ZDQT_FXDJ },
-  { label: "群体类别", prop: "qtLb", type: "select", options: props.dic.D_GS_ZDQT_LB },
-  { label: "群体成立时间", prop: "qtClsj", type: "date" },
-  { label: "群体标签", prop: "bqList", type: "slot", width: "100%" },
-  { label: "两群采集录入", prop: "lqxxList", type: "slot", width: "100%" },
-  { label: "管辖单位", prop: "gxSsdwdm",depMc:'gxSsdwmc', type: "department" },
-  { label: "入库开始时间", prop: "zdrRkkssj", type: "datetime" },
-  { label: "入库截至时间", prop: "zdrRkjssj", type: "datetime" },
-  { label: "列控原因", prop: "zdrLkyy", type: "textarea",width: "100%" },
-]);
-const pageData = reactive({
-  keyCountCj: 0,
-  keyCount: 0,
-  tableConfiger: {
-    rowHieght: 61,
-    showSelectType: "checkBox",
-    loading: false,
-  },
-  qcjConfiger: {
-    rowHieght: 61,
-    showSelectType: "null",
-    loading: false,
-  },
-  controlsWidth: 120, //操作栏宽度
-  zdryColumn: [
-    { label: "姓名", prop: "ryXm"},
-    { label: "性别", prop: "ryXb", showSolt: true },
-    { label: "身份证号 ", prop: "rySfzh"},
-    { label: "户籍地", prop: "hjdXz" },
-    { label: "现居地", prop: "xzdXz"},
-    { label: "手机号", prop: "ryLxdh"},
-  ],
-  qcjListColumn:[
-     { label: "微信群", prop: "wxqId" },
-     { label: "QQ群", prop: "qqqId" },
-     { label: "群主昵称", prop: "qzNc" },
-     { label: "群主姓名", prop: "qzXm" },
-     { label: "群主联系电话", prop: "qzLxdh" },
-     { label: "群重要内容", prop: "qzynr" },
-  ]
-});
 const disabled = ref(false)
-const listQuery = ref({}); //表单
+const showBut = ref()
-const loading = ref(false);
+const title = ref('新增')
-const elform = ref();
+const portrayal = ref(false)
-const title = ref("");
+const init = (type, row) => {
+  dialogForm.value = true
+  if (type == 'add') {
+    listQuery.value = {}
+    portrayal.value=false
+    disabled.value = false
+    showBut.value = false
+    title.value = '新增'
+  } else {
+    portrayal.value = true
+    if (type == 'edit') {
+      disabled.value = false
+      showBut.value = true
 
-// 初始化数据
+      title.value = '修改'
-const init = async (type, row) => {
+    } else {
-  dialogForm.value = true;
+      disabled.value = true
-  title.value = type == "add" ? "新增" :  type == 'detail' ?  '详情':"编辑";
+      showBut.value = false
-  if(type == 'add'){
+      title.value = '详情'
-    listQuery.value.sqrXm = getItem("USERNAME");
+    }
-    listQuery.value.bkfqrSfzh = getItem("idEntityCard");
+    tbGsxtZdqtSelectVoById(row.id).then(res => {
-    listQuery.value.sqrSsbmmc = getItem("deptId")[0].deptName;;
+      listQuery.value = res
-    listQuery.value.sqrSsbmdm = getItem("deptId")[0].deptCode;;
+      console.log(res);
+    })
   }
-  disabled.value = type == 'detail' ? true : false;
+}
-  pageData.tableConfiger.haveControls = type == "detail" ? false: true;
+const info = ref(null)
-  pageData.qcjConfiger.haveControls = type == "detail" ? false: true;
+const backinfo = ref(null)
-  if(row) getDataById(row.id)
+const groupLabels = ref(null)
-};
+const character = ref(null)
+const controlInfo = ref(null)
+const featinfo = ref(null)
+const demandsInfo = ref(null)
+const requestInfo = ref(null)
+const personnel = ref(null)
+const activeSection = ref('info-section')
+const rightBox = ref(null)
 
-// 根据id查询详情
+// 滚动到指定区域
-const getDataById = (id) => {
+const scrollToSection = (sectionId) => {
-  qcckGet({}, "/mosty-gsxt/tbGsxtZdqt/selectVoById/" + id).then((res) => {
+  const element = document.getElementById(sectionId);
-    listQuery.value = res;
+  if (element && rightBox.value) {
+    // 计算需要滚动的距离
+    const elementTop = element.offsetTop;
+    rightBox.value.scrollTo({
+      top: elementTop - 150, // 减去一些偏移量，让内容更好看
+      behavior: 'smooth' // 平滑滚动
+    });
+    activeSection.value = sectionId;
+  }
+}
+
+// 监听滚动，更新当前激活的锚点
+const handleScroll = () => {
+  if (!rightBox.value) return;
+
+  const scrollPosition = rightBox.value.scrollTop + 50;
+  const sections = [
+    'info-section', 'backinfo-section', 'groupLabels-section',
+    'character-section', 'controlInfo-section', 'featinfo-section',
+    'demandsInfo-section', 'requestInfo-section', 'personnel-section',
+    'judgmentRecord-section', 'historyAssembly-section', 'joblogging-section'
+  ];
+
+  for (let i = sections.length - 1; i >= 0; i--) {
+    const section = document.getElementById(sections[i]);
+    if (section && section.offsetTop <= scrollPosition) {
+      activeSection.value = sections[i];
+      break;
+    }
+  }
+}
+
+// 监听右侧区域的滚动事件
+if (typeof window !== 'undefined') {
+  window.addEventListener('load', () => {
+    if (rightBox.value) {
+      rightBox.value.addEventListener('scroll', handleScroll);
+    }
   });
-};
 
-// 采集录入
+  // 组件卸载时移除事件监听
-const handleCjlr = (type,row) =>{
+  onUnmounted(() => {
-  cjlrDialog.value.init(type,row);
+    if (rightBox.value) {
-}
+      rightBox.value.removeEventListener('scroll', handleScroll);
-
+    }
-const addEdteCj = (val) =>{
-  if(!listQuery.value.lqxxList) listQuery.value.lqxxList = [];
-  listQuery.value.lqxxList.unshift(val.data);
-  pageData.keyCountCj++;
-}
-
-const  handleChooseMarks = () =>{
-  if(disabled.value) return;
-  chooseMarksVisible.value = true
-}
-
-// 新增标签
-const addMarks =  (val) =>{
-  listQuery.value.bqList = val.map(v=>{
-    return { bqDm:v.bqDm, bqId:v.id, bqLb:v.bqLb, bqLx:v.bqLx, bqMc:v.bqMc }
   });
-  roleIds.value = val.map(v=>v.id)
 }
+const submit = async () => {
+  try {
+    // 使用Promise.all处理所有子组件的验证和数据获取
+    const [infoData, backinfoData, groupLabelsData, characterData, controlInfoData, featinfoData, demandsInfoData, requestInfoData, personnelData] = await Promise.all([
+      info.value.throwData(),
+      backinfo.value.throwData(),
+      groupLabels.value.throwData(),
+      character.value.throwData(),
+      controlInfo.value.throwData(),
+      featinfo.value.throwData(),
+      demandsInfo.value.throwData(),
+      requestInfo.value.throwData(),
+      personnel.value.throwData()
+    ]);
 
-// 删除数据
+    const datamasg = {
-const closeTag = (idx) =>{
+      ...infoData,
-  listQuery.value.bqList.splice(idx,1)
+      qtBjzl: backinfoData.qtbjxx,
-  roleIds.value.splice(idx,1)
+      qtFjZl: JSON.stringify(backinfoData.fileList),
-}
+      bqList: groupLabelsData,
+      qttz: featinfoData,
+      zyxx: demandsInfoData,
+      sqfj: requestInfoData.fileList.length > 0 ? JSON.stringify(requestInfoData.fileList) : "",
+      zdryList: personnelData
+    }
 
-// 选择人员
+    const res = await tbGsxtZdqtAdd(datamasg)
-const choosedPeo = (val) =>{
+
-  roleIds_RY.value = val.map(it=>it.id);
+    const qtxz = {
-  let arr = val.map(item=>{
+      list: characterData.map(item => {
-      let bqArr = item.bqList || [];
+        return { ...item, qtid: res }
-      let bqs = bqArr.map(v=>{
-        return { bqZl:v.bqZl , bqId:v.bqId, bqLx:v.bqLx, bqLb:v.bqLb, bqMc:v.bqMc, bqDm:v.bqDm }
       })
-      return { id:item.id, fjZp:item.fjZp, ryXm:item.ryXm, ryXb:item.ryXb, rySfzh:item.rySfzh, hjdXz:item.hjdXz, xzdXz:item.xzdXz, ryLxdh:item.ryLxdh, qtXnsf:item.qtXnsf,clCjh:item.clCjh, clCph:item.clCph, qtTzms:item.qtTzms, bqList:bqs }
+    }
-  })
-  listQuery.value.zdryList = [...addPerson.value,...arr]; 
-  pageData.keyCount++;
-}
 
-// 单独新增的数据
+    const sqxx = {
-const choosedAdd = (item) =>{
+      list: requestInfoData.sqlist.map(item => {
-  let obj = { id:item.id, fjZp:item.fjZp, ryXm:item.ryXm, ryXb:item.ryXb, rySfzh:item.rySfzh, hjdXz:item.hjdXz, xzdXz:item.xzdXz, ryLxdh:item.ryLxdh, qtXnsf:item.qtXnsf,clCjh:item.clCjh, clCph:item.clCph, qtTzms:item.qtTzms, bqList:item.bqList }
+        return { sqnr: item.sqnr, qtid: res }
-  addPerson.value.push(obj) ;//缓存的数据
+      })
-  if(!listQuery.value.zdryList) listQuery.value.zdryList = [];
+    }
-  listQuery.value.zdryList.unshift(obj);
-}
 
-// 删除数据
+    const gkxx = {
-const deleteRow = (row) => {
+      list: controlInfoData.map(item => { return { ...item, qtid: res } })
-  roleIds_RY.value = roleIds_RY.value.filter(id => id != row.id);
+    }
-  addPerson.value = addPerson.value.filter(it => it.id != row.id);
-  listQuery.value.zdryList = listQuery.value.zdryList.filter(it => it.id != row.id);
-}
 
+    await tbZdqtQtxzBatchAdd(qtxz)
+    await tbZdqtGkxxBatchAdd(gkxx)
+    await tbZdqtSqBatchAdd(sqxx)
 
-// 提交
+    proxy.$message({
-const submit = () => {
+      message: '新增成功',
-  elform.value.submit((data) => {
+      type: 'success',
-    let params = { ...data }
+    })
-    loading.value = true;
+
-    let url = title.value == "新增" ? "/mosty-gsxt/tbGsxtZdqt/save" : "/mosty-gsxt/tbGsxtZdqt/update";
+    close()
-    qcckPost(params, url).then(() => {
+  } catch (error) {
-      loading.value = false;
+    console.log(error);
-      proxy.$message({ type: "success", message: title.value + "成功" });
+    proxy.$message({
-      emit("updateDate");
+      message: error.message || '表单验证失败或保存出错，请检查输入信息',
-      close();
+      type: 'error'
-    }).catch(() => { loading.value = false;});
+    })
-  });
+  }
 };
-
-const getShdep = (val) =>{
-  listQuery.value.shrSsbmmc = val ? val.orgName : ''
-}
-const getSPdep = (val) =>{
-  listQuery.value.sprSsbmmc = val ? val.orgName : ''
-}
-
-const delDictItem = (row) =>{
-  listQuery.value.lqxxList = listQuery.value.lqxxList.filter(v=>{
-    return row.id != v.id
-  })
-}
-
 // 关闭
 const close = () => {
-  listQuery.value = {};
+  dialogForm.value = false
-  dialogForm.value = false;
-  loading.value = false;
 };
-defineExpose({ init });
+defineExpose({
+  init
+});
 </script>
 
 <style lang="scss" scoped>
 @import "~@/assets/css/layout.scss";
 @import "~@/assets/css/element-plus.scss";
 
-.boxlist {
+.dialog {
-  width: calc(99% - 50px);
+  background-color: #ffffff;
-  margin-top: 10px;
+  border-radius: 8px;
+  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
   overflow: hidden;
+  animation: fadeIn 0.3s ease;
 }
-.marks{
+
-  width: 100%;
+@keyframes fadeIn {
-  min-height: 32px;
+  from {
-  border: 1px solid #e9e9e9;
+    opacity: 0;
+    transform: translateY(-20px);
+  }
+
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.head_box {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 16px 20px;
+  background-color: #f8f9fa;
+  border-bottom: 1px solid #ebeef5;
+}
+
+.title {
+  font-size: 16px;
+  font-weight: 600;
+  color: #303133;
+}
+
+.form_cnt {
+  display: flex;
+  justify-content: space-between;
+  padding: 20px;
+  min-height: 400px;
+}
+
+.left_box {
+  width: 220px;
+  background-color: #fafafa;
+  border: 1px solid #ebeef5;
+  border-radius: 6px;
+  padding: 15px;
+  transition: all 0.3s ease;
+}
+
+.left_box:hover {
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+  border-color: #409eff;
+}
+
+// 锚点列表样式
+.anchor-list {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+
+.anchor-list li {
+  padding: 10px 15px;
+  margin-bottom: 5px;
+  cursor: pointer;
   border-radius: 4px;
+  transition: all 0.3s ease;
+  font-size: 14px;
+  color: #606266;
+  position: relative;
 }
-.depBox{
+
-    border: 1px solid #e9e9e9;
+.anchor-list li:hover {
-    width: 305px;
+  background-color: #e6f7ff;
-    padding: 0 0 0 4px;
+  color: #409eff;
-    border-radius: 4px;
+}
-    ::v-deep .el-input__inner{
+
-        border: none;
+.anchor-list li.active {
-    }
+  background-color: #409eff;
-    ::v-deep .el-cascader .el-input.is-focus .el-input__inner{
+  color: #ffffff;
-        border-color: transparent !important;
+  font-weight: 500;
-    }
+}
-    ::v-deep .el-input__inner:focus {
+
-        box-shadow: none;
+.anchor-list li.active::before {
-    }
+  content: '';
-    ::v-deep .el-input.is-disabled .el-input__inner{
+  position: absolute;
-        border-color: transparent !important;
+  left: 0;
-    }
+  top: 0;
-  
+  bottom: 0;
+  width: 3px;
+  background-color: #ffffff;
+  border-radius: 0 2px 2px 0;
+}
+
+.right_box {
+  width: calc(100% - 240px);
+  overflow-y: auto;
+  // padding: 15px;
+  background-color: #ffffff;
+  // border: 1px solid #ebeef5;
+  border-radius: 6px;
+
+.right_box>div {
+  background-color: #f8f9fa;
+  border-radius: 6px;
+  padding: 20px;
+  transition: all 0.3s ease;
+  margin-bottom: 10px;
+}
+
+.right_box>div:hover {
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+}
+
+.right_box h3 {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin: 0 0 10px 0;
+  padding-bottom: 10px;
+  border-bottom: 2px solid #409eff;
+  position: relative;
+}
+
+.right_box h3::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  bottom: -2px;
+  width: 60px;
+  height: 2px;
+  background-color: #409eff;
+}
+
+.headline {
+  font-size: 16px;
+  font-weight: 500;
+  color: #303133;
+  margin-bottom: 15px;
+}
+
+// 按钮样式优化
+.el-button {
+  margin-left: 8px;
+  transition: all 0.3s ease;
+}
+
+.el-button:first-child {
+  margin-left: 0;
+}
+}
+// 响应式设计
+@media screen and (max-width: 768px) {
+  .form_cnt {
+    flex-direction: column;
+  }
+
+  .left_box {
+    width: 100%;
+    margin-bottom: 20px;
+  }
+
+  .right_box {
+    width: 100%;
+  }
+
+  .anchor-list {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 5px;
+  }
+
+  .anchor-list li {
+    flex: 1 1 calc(33.333% - 10px);
+    margin-bottom: 5px;
+    text-align: center;
+    padding: 8px 5px;
+    font-size: 12px;
+  }
+}
+
+::v-deep .avatar-uploader {
+  display: flex
 }
 </style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/index copy.vue

@@ -0,0 +1,341 @@
+<template>
+  <div>
+    <div class="titleBox">
+      <PageTitle title="重点群体管理">
+        <el-popover placement="bottom" :visible="visible" :width="400" trigger="click">
+          <template #reference>
+            <el-button type="primary" @click="(visible = !visible), (visiblefp = false)" size="small">布控申请
+            </el-button>
+          </template>
+          <div class="flex just-center">
+            <el-button size="small" type="primary" v-for="it in D_GS_BK_SQLX" :key="it.dm" @click="handleApplication(it)">{{it.zdmc }}</el-button>
+          </div>
+        </el-popover>
+        <el-popover placement="bottom" :visible="visiblefp" :width="400" trigger="click">
+          <template #reference>
+            <el-button size="small" type="primary" @click="(visiblefp = !visiblefp), (visible = false)">指定分配</el-button>
+          </template>
+          <div>
+            <el-input readonly v-model="obj.fpmc" @click="chooseUserVisible = true" placeholder="请选择民警"></el-input>
+            <div class="flex just-center mt10">
+              <el-button @click="(visiblefp = false), (obj = {})" size="small">取消</el-button>
+              <el-button type="primary" @click="handlefp" size="small">分配</el-button>
+            </div>
+          </div>
+        </el-popover>
+
+        <el-button size="small" type="primary" @click="handleZxs">转线索</el-button>
+        <el-button size="small" type="primary" @click="handleMove">移交管控</el-button>
+        <el-button type="primary" size="small" @click="addEdit('add', null)">
+          <el-icon style="vertical-align: middle">
+            <CirclePlus />
+          </el-icon>
+          <span style="vertical-align: middle">新增</span>
+        </el-button>
+      </PageTitle>
+    </div>
+    <!-- 搜索 -->
+    <div ref="searchBox">
+      <Search :searchArr="searchConfiger" @submit="onSearch" />
+    </div>
+    <!-- 表格 -->
+    <div class="tabBox">
+      <MyTable 
+        :tableData="pageData.tableData" 
+        :tableColumn="pageData.tableColumn" 
+        :tableHeight="pageData.tableHeight"
+        :key="pageData.keyCount" 
+        :tableConfiger="pageData.tableConfiger" 
+        :controlsWidth="pageData.controlsWidth"
+        @chooseData="chooseData"
+      >
+        <template #jbxx="{ row }">
+          <div class="flex">
+            <img src="" alt="" style="width: 80px;height: 90px;" />
+             <ul class="tl ml10" style="flex:1 0 0">
+              <li class="one_text_detail">群体名称：{{ row.qtMc }}</li>
+              <li class="flex one_text_detail">群体类别：<DictTag :tag="false" :value="row.qtLb" :options="D_GS_ZDQT_LB" /> </li>
+              <li class="flex one_text_detail">风险等级：<DictTag :tag="false" :value="row.qtFxdj" :options="D_GS_ZDQT_FXDJ" /></li>
+              <li class="one_text_detail">创建时间：{{ row.xtCjsj }}</li>
+            </ul>
+          </div>
+        </template>
+         <template #bqList="{ row }">
+          <ul >
+            <li class="one_text_detail marks mb4" :key="index" v-for="(item, index) in row.bqList">{{ item.bqMc }}({{ item.bqFz || 0  }} 分) </li> 
+          </ul>
+        </template>
+        <template #bgxx="{ row }">
+          <div class="flex one_text_detail">背景资料：{{ row.qtBjzl }}</div>
+          <div class="flex one_text_detail">创建单位：{{ row.xtCjbmmc }}</div>
+        </template>
+        <template #gkxx="{ row }">
+          <div class="flex one_text_detail">管辖单位：{{ row.gxSsdwmc }}</div>
+          <div class="flex one_text_detail">列控原因：{{ row.zdrLkyy }}</div>
+          <div class="flex one_text_detail">开始时间：{{ row.zdrRkkssj }}</div>
+          <div class="flex one_text_detail">截至时间：{{ row.zdrRkjssj }}</div>
+        </template>
+        <template #zdryList="{ row }">
+          <span style="color: #0072ff">{{ row.zdryList ? row.zdryList.length : 0 }}</span>
+        </template>
+        <template #qtZt="{ row }">
+          <DictTag :tag="false" :value="row.qtZt" :options="D_GS_ZDQT_ZT" />
+        </template>
+        <!-- 操作 -->
+        <template #controls="{ row }">
+          <el-link size="small" type="primary" v-if=" row.qtZt == '01'" @click="handleSend(row.id)">送审</el-link>
+          <el-link size="small" type="success" v-if=" row.qtZt == '01'" @click="addEdit('edit', row)">编辑</el-link>
+          <el-link size="small" type="success" @click="addEdit('detail', row)">详情</el-link>
+          <el-link size="small" type="danger" @click="deleteRow(row.id)">删除</el-link>
+        </template>
+      </MyTable>
+      <Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
+        ...pageData.pageConfiger,
+        total: pageData.total
+      }"></Pages>
+    </div>
+    <!-- 编辑 - 新增-->
+    <EditForm v-if="show" @updateDate="getList" ref="editFormDiloag" :dic="{D_BZ_XB,D_GS_ZDQT_LB,D_GS_ZDQT_FXDJ,D_GS_ZDR_CZZT}" />
+    <!-- 选择用户 -->
+    <ChooseUser v-model="chooseUserVisible" @choosedUsers="handleUserSelected" :roleIds="roleIds" />    <!-- 转线索 -->
+    <ZxsForm v-if="showzxs" ref="zxsDilof" @change="getList" :dic="{ D_BZ_SF, D_BZ_XB, D_GS_XS_LY, D_BZ_SSZT, D_GS_XS_LX, D_GS_XS_QTLX }"></ZxsForm>
+  </div>
+</template>
+
+<script setup>
+import ZxsForm from "./components/zxsForm.vue";
+import ChooseUser from "@/components/ChooseList/ChooseUser/index.vue";
+import PageTitle from "@/components/aboutTable/PageTitle.vue";
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import Pages from "@/components/aboutTable/Pages.vue";
+import Search from "@/components/aboutTable/Search.vue";
+import EditForm from "./components/addForm.vue";
+import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
+import { ElMessage } from "element-plus";
+import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
+const { proxy } = getCurrentInstance();
+const { D_GS_ZDR_CZZT,D_GS_BK_SQLX, D_GS_ZDQT_FXDJ, D_GS_ZDR_RYJB, D_GS_ZDQT_LB, D_GS_ZDR_BK_ZT, D_GS_BQ_LX, D_GS_ZDQT_ZT, D_BZ_SF, D_BZ_XB, D_GS_XS_LY, D_BZ_SSZT, D_GS_XS_LX, D_GS_XS_QTLX } = proxy.$dict("D_GS_ZDR_CZZT","D_GS_BK_SQLX", "D_GS_ZDQT_FXDJ", "D_GS_ZDR_RYJB", "D_GS_ZDQT_LB", "D_GS_ZDR_BK_ZT", "D_GS_BQ_LX", "D_GS_ZDQT_ZT", "D_BZ_SF", "D_BZ_XB", "D_GS_XS_LY", "D_BZ_SSZT", "D_GS_XS_LX", "D_GS_XS_QTLX"); //获取字典数据
+const showzxs = ref(false);
+const queryFrom = ref({});
+const ids = ref([]);
+const choosList = ref([]);
+const show = ref(false);
+const chooseUserVisible = ref(false); //审批流程
+const roleIds = ref([]); //角色id
+const editFormDiloag = ref();
+const searchBox = ref(); //搜索框
+const visible = ref(false);
+const visiblefp = ref(false);
+const zxsDilof = ref();
+const obj = ref({});
+const searchConfiger = ref([
+  {
+    label: "群体名称",
+    prop: "qtMc",
+    placeholder: "请输入群体名称",
+    showType: "input"
+  },
+  {
+    label: "群体风险等级",
+    prop: "qtFxdj",
+    placeholder: "请选择群体风险等级",
+    showType: "select",
+    options: D_GS_ZDQT_FXDJ
+  },
+  {
+    label: "重点人人员级别",
+    prop: "zdrRyjb",
+    placeholder: "请选择重点人人员级别",
+    showType: "select",
+    options: D_GS_ZDR_RYJB
+  },
+  {
+    label: "群体类别",
+    prop: "qtLb",
+    placeholder: "请选择群体类别",
+    showType: "select",
+    options: D_GS_ZDQT_LB
+  },
+  {
+    label: "布控状态",
+    prop: "zdrBkZt",
+    placeholder: "请输入布控装态",
+    showType: "select",
+    options: D_GS_ZDR_BK_ZT
+  },
+  {
+    label: "布控类型",
+    prop: "bkzt",
+    placeholder: "请输入布控类型",
+    showType: "select",
+    options: D_GS_BQ_LX
+  }
+]);
+
+const pageData = reactive({
+  tableData: [],
+  keyCount: 0,
+  tableConfiger: {
+    rowHieght: 61,
+    showSelectType: "checkBox",
+    loading: false
+  },
+  total: 0,
+  pageConfiger: {
+    pageSize: 20,
+    pageCurrent: 1
+  },
+  controlsWidth: 150,
+  tableColumn: [
+    { label: "群体基本信息", prop: "jbxx", showSolt: true,width:300 },
+    { label: "背景信息", prop: "bgxx", showSolt: true,width:300 },
+    { label: "标签", prop: "bqList", showSolt: true ,width:200,showOverflowTooltip:true},
+    { label: "管控信息", prop: "gkxx", showSolt: true,width:300 },
+    { label: "稳控人数", prop: "zdryList", showSolt: true },
+    { label: "状态", prop: "qtZt", showSolt: true }
+  ]
+});
+
+onMounted(() => {
+  tabHeightFn();
+  getList();
+});
+
+//送审
+const handleSend = (id) => {
+  proxy.$confirm("确定要送审？", "警告", { type: "warning" }).then(() => {
+    qcckPost({}, "/mosty-gsxt/tbGsxtZdqt/subExamine/"+id).then(() => {
+      proxy.$message({ type: "success", message: "送审成功" });
+      getList();
+    });
+  })
+};
+
+
+// 搜索
+const onSearch = (val) => {
+  queryFrom.value = { ...val };
+  pageData.pageConfiger.pageCurrent = 1;
+  getList();
+};
+
+const changeNo = (val) => {
+  pageData.pageConfiger.pageCurrent = val;
+  getList();
+};
+const changeSize = (val) => {
+  pageData.pageConfiger.pageSize = val;
+  getList();
+};
+
+// 获取列表
+const getList = () => {
+  pageData.tableConfiger.loading = true;
+  let data = { ...pageData.pageConfiger, ...queryFrom.value };
+  qcckGet(data, "/mosty-gsxt/tbGsxtZdqt/selectPage").then((res) => {
+    pageData.tableData = res.records || [];
+    pageData.total = res.total;
+    pageData.tableConfiger.loading = false;
+  }).catch(() => {
+    pageData.tableConfiger.loading = false;
+  });
+};
+
+// 详情
+const addEdit = (type, row) => {
+  show.value = true;
+  visible.value = false;
+  nextTick(() => {
+    editFormDiloag.value.init(type, row);
+  });
+};
+
+const chooseData = (data) => {
+  ids.value = Array.isArray(data) ? data.map((item) => item.id) : [];
+  choosList.value = Array.isArray(data) ? data : [];
+};
+// 选择申请数据数据
+const handleApplication = () => {
+  if (ids.value.length === 0)return ElMessage.error("请先选择需要布控的重点群体");
+  qcckPost({ ids: ids.value }, "/mosty-gsxt/tbGsxtZdqt/addBksq").then(() => {
+    ElMessage.success("申请成功");
+    visible.value = false;
+    getList();
+  }).catch(() => {
+    ElMessage.error("布控申请失败");
+  });
+};
+
+const handleUserSelected = (val) => {
+  obj.value.fpmc = val[0].userName;
+  obj.value.fpid = val[0].id;
+};
+
+const handlefp = () => {
+  if (ids.value.length === 0) return ElMessage.error("请先选择需要分配的重点群体");
+  qcckPost({ ids: ids.value, uid: obj.value.fpid },"/mosty-gsxt/tbGsxtZdqt/addGkmj").then(() => {
+    ElMessage.success("分配成功");
+    visible.value = false;
+    visiblefp.value = false;
+    getList();
+  }).catch(() => {
+    ElMessage.error("分配失败");
+  });
+};
+// 移交管控
+const handleMove = () => {
+  if (ids.value.length === 0) return ElMessage.error("请先选择需要移交管控的重点群体");
+  proxy.$confirm("是否确定移交？", "警告", { type: "warning" }).then(() => {
+    qcckPost({ ids: ids.value }, "/mosty-gsxt/tbGsxtZdqt/addSfyj").then(() => {
+      ElMessage.success("移交管控成功");
+      getList();
+    }).catch(() => {
+      ElMessage.error("移交管控失败");
+    });
+  }).catch(() => { });
+};
+
+const handleZxs = () => {
+  if (ids.value.length === 0) return ElMessage.error("请先选择需要转线索的重点群体");
+  showzxs.value = true;
+  nextTick(() => {
+    zxsDilof.value.init(choosList.value);
+  });
+};
+
+// 删除数据
+const deleteRow = (id) =>{
+  proxy.$confirm("确定要删除", "警告", { type: "warning" }).then(() => {
+    qcckDelete({}, "/mosty-gsxt/tbGsxtZdqt/" + id).then(() => {
+      proxy.$message({ type: "success", message: "删除成功" });
+      getList();
+    });
+  })
+}
+
+// 表格高度计算
+const tabHeightFn = () => {
+  pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
+  window.onresize = function () {
+    tabHeightFn();
+  };
+};
+defineExpose({});
+</script>
+
+<style lang="scss" scoped>
+.marks{
+  padding: 0 4px;
+  white-space: nowrap;
+  background: #73acf1;
+  border-radius: 4px;
+  color: #fff;
+}
+</style>
+
+<style>
+.el-loading-mask {
+  background: rgba(0, 0, 0, 0.5) !important;
+}
+
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/index.vue

@@ -40,41 +40,26 @@
     </div>
     <!-- 表格 -->
     <div class="tabBox">
-      <MyTable 
+      <MyTable
-        :tableData="pageData.tableData" 
+        :tableData="pageData.tableData"
-        :tableColumn="pageData.tableColumn" 
+        :tableColumn="pageData.tableColumn"
         :tableHeight="pageData.tableHeight"
-        :key="pageData.keyCount" 
+        :key="pageData.keyCount"
-        :tableConfiger="pageData.tableConfiger" 
+        :tableConfiger="pageData.tableConfiger"
         :controlsWidth="pageData.controlsWidth"
         @chooseData="chooseData"
       >
-        <template #jbxx="{ row }">
+      <template #qtLb="{ row }">
-          <div class="flex">
+        <DictTag :tag="false" :value="row.qtLb" :options="D_GS_ZDQT_LB" />
-            <img src="" alt="" style="width: 80px;height: 90px;" />
+        </template>
-             <ul class="tl ml10" style="flex:1 0 0">
+        <template #qtFxdj="{ row }">
-              <li class="one_text_detail">群体名称：{{ row.qtMc }}</li>
+        <DictTag :tag="false" :value="row.qtFxdj" :options="D_GS_ZDQT_FXDJ" />
-              <li class="flex one_text_detail">群体类别：<DictTag :tag="false" :value="row.qtLb" :options="D_GS_ZDQT_LB" /> </li>
-              <li class="flex one_text_detail">风险等级：<DictTag :tag="false" :value="row.qtFxdj" :options="D_GS_ZDQT_FXDJ" /></li>
-              <li class="one_text_detail">创建时间：{{ row.xtCjsj }}</li>
-            </ul>
-          </div>
         </template>
          <template #bqList="{ row }">
           <ul >
-            <li class="one_text_detail marks mb4" :key="index" v-for="(item, index) in row.bqList">{{ item.bqMc }}({{ item.bqFz || 0  }} 分) </li> 
+            <li class="one_text_detail marks mb4" :key="index" v-for="(item, index) in row.bqList">{{ item.bqMc }}({{ item.bqFz || 0  }} 分) </li>
           </ul>
         </template>
-        <template #bgxx="{ row }">
-          <div class="flex one_text_detail">背景资料：{{ row.qtBjzl }}</div>
-          <div class="flex one_text_detail">创建单位：{{ row.xtCjbmmc }}</div>
-        </template>
-        <template #gkxx="{ row }">
-          <div class="flex one_text_detail">管辖单位：{{ row.gxSsdwmc }}</div>
-          <div class="flex one_text_detail">列控原因：{{ row.zdrLkyy }}</div>
-          <div class="flex one_text_detail">开始时间：{{ row.zdrRkkssj }}</div>
-          <div class="flex one_text_detail">截至时间：{{ row.zdrRkjssj }}</div>
-        </template>
         <template #zdryList="{ row }">
           <span style="color: #0072ff">{{ row.zdryList ? row.zdryList.length : 0 }}</span>
         </template>
@@ -83,7 +68,7 @@
         </template>
         <!-- 操作 -->
         <template #controls="{ row }">
-          <el-link size="small" type="primary" v-if=" row.qtZt == '01'" @click="handleSend(row.id)">送审</el-link>
+          <el-link size="small" type="primary" v-if=" row.qtZt == '01'" @click="handleSend(row.id)">办结</el-link>
           <el-link size="small" type="success" v-if=" row.qtZt == '01'" @click="addEdit('edit', row)">编辑</el-link>
           <el-link size="small" type="success" @click="addEdit('detail', row)">详情</el-link>
           <el-link size="small" type="danger" @click="deleteRow(row.id)">删除</el-link>
@@ -187,12 +172,20 @@ const pageData = reactive({
   },
   controlsWidth: 150,
   tableColumn: [
-    { label: "群体基本信息", prop: "jbxx", showSolt: true,width:300 },
+    { label: "群体名称", prop: "qtMc" },
-    { label: "背景信息", prop: "bgxx", showSolt: true,width:300 },
+    { label: "群体类别", prop: "qtLb" , showSolt: true},
-    { label: "标签", prop: "bqList", showSolt: true ,width:200,showOverflowTooltip:true},
+    { label: "风险等级", prop: "qtFxdj" , showSolt: true},
-    { label: "管控信息", prop: "gkxx", showSolt: true,width:300 },
+    { label: "背景资料", prop: "qtBjzl" },
+    { label: "背景信息", prop: "bgxx", showSolt: true },
+    { label: "管辖单位", prop: "gxSsdwmc" },
+    { label: "列控原因", prop: "zdrLkyy" },
+    { label: "开始时间", prop: "zdrRkkssj" },
+    { label: "截至时间", prop: "zdrRkjssj" },
     { label: "稳控人数", prop: "zdryList", showSolt: true },
-    { label: "状态", prop: "qtZt", showSolt: true }
+    { label: "状态", prop: "qtZt", showSolt: true },
+    { label: "标签", prop: "bqList", showSolt: true ,showOverflowTooltip:true},
+    { label: "创建单位", prop: "xtCjbmmc" },
+    { label: "创建时间", prop: "xtCjsj" },
   ]
 });
 
@@ -203,9 +196,9 @@ onMounted(() => {
 
 //送审
 const handleSend = (id) => {
-  proxy.$confirm("确定要送审？", "警告", { type: "warning" }).then(() => {
+  proxy.$confirm("确定要办结？", "警告", { type: "warning" }).then(() => {
-    qcckPost({}, "/mosty-gsxt/tbGsxtZdqt/subExamine/"+id).then(() => {
+    qcckPost({}, "/mosty-gsxt//tbGsxtZdqt/qtbj/"+id).then(() => {
-      proxy.$message({ type: "success", message: "送审成功" });
+      proxy.$message({ type: "success", message: "办结成功" });
       getList();
     });
   })

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/model/backinfo.vue

@@ -0,0 +1,323 @@
+<template>
+
+  <div class="backinfo-container">
+    <div class="headClass" style="">
+      <h3>群体信息</h3>
+      <el-button type="primary" v-if="showBut" :disabled="disabled" @click="ClickSave">保存</el-button>
+    </div>
+    <el-input v-model="qtbjxx" :autosize="{ minRows: 4, maxRows: 10 }" type="textarea" placeholder="请输入背景信息"
+      class="background-info-input" :disabled="disabled"/>
+
+    <!-- 文件列表区域 -->
+    <div class="file-attachment-section">
+      <div class="section-title">相关附件</div>
+      <div class="file-list-container">
+        <div v-if="fileList.length === 0" class="empty-file-list">暂无附件</div>
+        <div v-else class="file-list">
+          <div v-for="(file, index) in fileList" :key="index" class="file-item">
+            <div class="file-info">
+              <span class="file-name">{{ file.originalName }}</span>
+              <span class="file-time">{{ file.uploadTime }}</span>
+            </div>
+            <div class="file-actions">
+              <el-button type="text" size="small" @click="downloadFile(file)" title="下载文件" :disabled="disabled">
+                <el-icon>
+                  <Download />
+                </el-icon>
+              </el-button>
+              <el-button type="text" size="small" @click="deleteFile(index)" title="删除文件" class="delete-btn" :disabled="disabled">
+                <el-icon>
+                  <Delete />
+                </el-icon>
+              </el-button>
+            </div>
+          </div>
+        </div>
+      </div>
+      <!-- 上传按钮区域 -->
+      <div class="upload-btn-container">
+        <el-upload v-model:file-list="fileList" class="upload-demo" :show-file-list="false" multiple
+          :http-request="handleUploadRequest" :on-remove="handleRemove" :limit="3" :on-exceed="handleExceed">
+          <el-button type="primary" :disabled="disabled">上传文件</el-button >
+        </el-upload>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref ,watch} from "vue";
+import { ElMessage } from 'element-plus';
+import { Delete, Download } from '@element-plus/icons';
+import { uploadMultipleFiles } from './fileUp'
+import {tbGsxtZdqtUpdate} from '@/api/qt.js'
+const props = defineProps({
+  dataList: {
+    type: Object,
+    default: () => { },
+  }, disabled: {
+    type: Boolean,
+    default: false
+  },
+  showBut: {
+    type: Boolean,
+    default: false
+  },
+})
+const qtbjxx = ref('')
+// 文件列表数据
+const fileList = ref([])
+watch(()=>props.dataList,(val)=>{
+  if (val) {
+    qtbjxx.value=val.qtBjzl
+    fileList.value=val.qtFjZl?JSON.parse(val.qtFjZl):[]
+  }
+},{deep:true})
+
+// 下载文件
+const downloadFile = (file) => {
+  // 实际项目中，这里应该调用下载API
+  console.log('下载文件:', file.name)
+  // 示例：window.open(file.url)
+}
+// 删除文件
+const deleteFile = (index) => {
+  // 实际项目中，这里应该先调用删除API，成功后再从列表中移除
+  fileList.value.splice(index, 1)
+  ElMessage.success('文件已删除')
+}
+
+// 上传相关方法
+const handleUploadRequest = async (options) => {
+  try {
+    // 调用uploadMultipleFiles进行文件上传
+    const result = await uploadMultipleFiles(options.file, {
+      uploadedFiles: fileList.value,
+      fjIds: [], // 如果需要保存文件ID列表，可以在这里传递
+      compressImage: null // 可选的图片压缩函数
+    });
+    // 更新文件列表，添加上传时间信息
+    const index = fileList.value.findIndex(f => f.originalName === options.file.name);
+    if (index !== -1) {
+      fileList.value[index].uploadTime = new Date().toLocaleString('zh-CN');
+    }
+    // 调用成功回调
+    if (options.onSuccess) {
+      options.onSuccess(result);
+    }
+  } catch (error) {
+    console.error('文件上传失败:', error);
+    // 调用失败回调
+    if (options.onError) {
+      options.onError(error);
+    }
+  }
+}
+
+const handleRemove = (uploadFile, uploadFiles) => {
+  // 实际项目中，这里应该先调用删除API，成功后再从列表中移除
+  const index = fileList.value.findIndex(f => f.name === uploadFile.name);
+  if (index !== -1) {
+    fileList.value.splice(index, 1);
+  }
+}
+
+const handleExceed = (files, uploadFiles) => {
+  ElMessage.warning(`最多只能上传 3 个文件`);
+}
+// 修改数据
+const ClickSave = () => {
+  const promes = {
+    id: props.dataList.id,
+    qtBjzl: qtbjxx.value,
+    qtFjZl:fileList.value.length>0?JSON.stringify(fileList.value):null
+  }
+  tbGsxtZdqtUpdate(promes).then((res) => {
+    ElMessage.success('修改成功')
+  }).catch((err) => {
+    ElMessage.error('修改失败')
+  });
+}
+const throwData = () => {
+  return new Promise((resolve) => {
+    // 基本验证：确保背景信息不为空
+    if (!qtbjxx.value.trim()) {
+      throw new Error('请输入群体背景信息');
+    }
+    
+    resolve({
+      qtbjxx: qtbjxx.value,
+      fileList: fileList.value
+    });
+  });
+}
+defineExpose({
+  throwData
+})
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
+
+.backinfo-container {
+  padding: 10px;
+}
+
+.background-info-input {
+  width: 100%;
+  margin-bottom: 15px;
+}
+
+.file-attachment-section {
+  margin-top: 15px;
+}
+
+.section-title {
+  font-size: 14px;
+  font-weight: 500;
+  color: #303133;
+  margin-bottom: 10px;
+  padding-bottom: 5px;
+  border-bottom: 1px solid #ebeef5;
+}
+
+.file-list-container {
+  max-height: 100px;
+  overflow-y: auto;
+  border: 1px solid #ebeef5;
+  border-radius: 4px;
+  background-color: #ffffff;
+  margin-bottom: 10px;
+}
+
+/* 自定义滚动条样式 */
+.file-list-container::-webkit-scrollbar {
+  width: 6px;
+}
+
+.file-list-container::-webkit-scrollbar-track {
+  background: #f1f1f1;
+  border-radius: 3px;
+}
+
+.file-list-container::-webkit-scrollbar-thumb {
+  background: #c0c4cc;
+  border-radius: 3px;
+}
+
+.file-list-container::-webkit-scrollbar-thumb:hover {
+  background: #909399;
+}
+
+.empty-file-list {
+  padding: 20px;
+  text-align: center;
+  color: #909399;
+  font-size: 12px;
+}
+
+.file-list {
+  padding: 5px;
+}
+
+.file-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 10px;
+  margin-bottom: 2px;
+  background-color: #f8f9fa;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+  cursor: pointer;
+}
+
+.file-item:hover {
+  background-color: #e6f7ff;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+}
+
+.file-info {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  gap: 15px;
+  min-width: 0;
+}
+
+.file-name {
+  flex: 1;
+  font-size: 12px;
+  color: #303133;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.file-size {
+  font-size: 11px;
+  color: #909399;
+  min-width: 60px;
+}
+
+.file-time {
+  font-size: 11px;
+  color: #909399;
+}
+
+.file-actions {
+  display: flex;
+  align-items: center;
+  gap: 5px;
+  margin-left: 10px;
+}
+
+.file-actions .el-button {
+  padding: 0 5px;
+  margin: 0;
+  color: #606266;
+  transition: color 0.3s ease;
+}
+
+.file-actions .el-button:hover {
+  color: #409eff;
+}
+
+.delete-btn:hover {
+  color: #f56c6c !important;
+}
+
+.upload-btn-container {
+  display: flex;
+  justify-content: center;
+  margin-top: 10px;
+}
+
+.headClass {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin: 0 0 10px 0;
+  padding-bottom: 10px;
+  border-bottom: 2px solid #409eff;
+  position: relative;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.headClass::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  bottom: -2px;
+  width: 60px;
+  height: 2px;
+  background-color: #409eff;
+}
+
+h3 {
+  margin: 0;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/model/character.vue

@@ -0,0 +1,225 @@
+<template>
+  <div>
+    <div class="headClass" style="">
+      <h3>群体性质</h3>
+      <el-button type="primary" :disabled="disabled" @click="showDialog = true">选择</el-button>
+    </div>
+    <MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
+      :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
+      <!-- 操作 -->
+      <template #controls="{ row }">
+        <el-link type="danger" @click="delDictItem(row)">删除</el-link>
+      </template>
+    </MyTable>
+  </div>
+  <ShowXz v-model="showDialog" @choosed="addMarks" :roleIds="roleIds" />
+</template>
+
+<script setup>
+import { ref, reactive, watch, toRaw, getCurrentInstance, onMounted, onUnmounted } from "vue";
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import ShowXz from '../component/showXz'
+import {  ElMessageBox } from "element-plus";
+import { tbZdqtQtxzBatchAdd, tbZdqtQtxzBatchDelete, tbZdqtQtxzSelectPage } from '@/api/qt.js'
+const { proxy } = getCurrentInstance()
+const props = defineProps({
+  dataList: {
+    type: Object,
+    default: () => { },
+  }, disabled: {
+    type: Boolean,
+    default: false
+  },
+  showBut: {
+    type: Boolean,
+    default: false
+  },
+})
+
+const pageData = reactive({
+  tableData: [],
+  tableColumn: [{
+    prop: 'zdmc',
+    label: '性质名称',
+  }, {
+    prop: 'dm',
+    label: '性质代码',
+  }],
+  tableHeight: '200px',
+  keyCount: 0,
+  tableConfiger: {
+    border: true,
+    stripe: true,
+    showHeader: true,
+    showIndex: true,
+    indexLabel: '序号',
+    indexWidth: 60,
+    align: 'center',
+    showOverflowTooltip: true,
+    haveControls: !props.disabled
+  },
+  controlsWidth: 120,
+
+})
+const listData = ref([])
+watch(() => props.dataList, (val) => {
+  if (val) {
+    listData.value = val
+    getTbZdqtQtxzSelectPage({ qtid: val.id, pageCurrent: 1, pageSize: 1000 })
+  }
+}, { deep: true })
+const showDialog = ref(false)
+const roleIds = ref([])
+//新增接口
+const gettbZdqtQtxzBatchAdd = (val) => {
+  tbZdqtQtxzBatchAdd(val).then(res => {
+    let str = ''
+    if (!props.disabled && props.showBut) {
+      str = '修改成功'
+    } else {
+      str = '添加成功'
+    }
+    proxy.$message({
+      message: str,
+      type: 'success',
+    })
+  })
+}
+// 删除接口
+const deleteTbZdqtQtxzBatchDelete = (val) => {
+  tbZdqtQtxzBatchDelete(val).then(res => {
+    proxy.$message({
+      message: '删除成功',
+      type: 'success',
+    })
+  })
+}
+// 查询接口
+const getTbZdqtQtxzSelectPage = (val) => {
+  tbZdqtQtxzSelectPage(val).then(res => {
+    roleIds.value = res.records.map(item => item.xzdm)
+    pageData.tableData = res.records.map(item => {
+      return {
+        zdmc: item.xzmc,
+        dm: item.xzdm,
+        id: item.id
+      }
+    })
+  })
+}
+// 添加性质标签
+const addMarks = (val) => {
+  pageData.tableData = val.map(v => {
+    return { zdmc: v.zdmc, dm: v.dm }
+  });
+  roleIds.value = val.map(v => v.dm)
+  const promes = {
+    list: pageData.tableData.map(v => {
+      return {
+        qtid: listData.value.id,
+        xzdm: v.dm,
+        xzmc: v.zdmc,
+      }
+    })
+  }
+  if (props.disabled && props.showBut) {
+    gettbZdqtQtxzBatchAdd(promes)
+  }
+}
+// 删除性质标签
+const delDictItem = (row) => {
+  if (!props.disabled && props.showBut) {
+    ElMessageBox.confirm(
+      '是否删除性质标签',
+      '提示',
+      {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning',
+      }
+    )
+      .then(() => {
+        pageData.tableData = pageData.tableData.filter(v => v.dm != row.dm)
+        roleIds.value = roleIds.value.filter(v => v != row.dm)
+        const promes = {ids: [row.id]}
+        deleteTbZdqtQtxzBatchDelete(promes)
+      })
+      .catch(() => {
+        proxy.$message({
+          message: '删除失败',
+          type: 'info',
+        })
+      })
+  } else {
+    pageData.tableData = pageData.tableData.filter(v => v.dm != row.dm)
+    roleIds.value = roleIds.value.filter(v => v != row.dm)
+  }
+}
+// 抛出数据并验证性质列表不为空
+const throwData = () => {
+  return new Promise((resolve) => {
+    // 验证：确保性质列表不为空
+    // if (!pageData.tableData || pageData.tableData.length === 0) {
+    //   throw new Error('请选择群体性质');
+    // }
+
+    resolve(pageData.tableData);
+  });
+}
+defineExpose({
+  throwData
+})
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
+
+.backinfo-container {
+  padding: 10px;
+}
+
+.left_box {
+  width: 200px;
+  border: 1px solid #c8c8c89a;
+  border-radius: 5px;
+  padding: 5px;
+}
+
+.right_box {
+  width: calc(100% - 230px);
+  overflow-y: auto;
+  padding: 5px;
+}
+
+::v-deep .el-form-item__content {
+  display: block !important;
+}
+
+.headClass {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin: 0 0 10px 0;
+  padding-bottom: 10px;
+  border-bottom: 2px solid #409eff;
+  position: relative;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.headClass::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  bottom: -2px;
+  width: 60px;
+  height: 2px;
+  background-color: #409eff;
+}
+
+h3 {
+  margin: 0;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/model/controlInfo.vue

@@ -0,0 +1,252 @@
+<template>
+  <div>
+    <div class="headClass" style="">
+      <h3>群体管控信息</h3>
+      <el-button type="primary" :disabled="disabled" @click="chooseMarksVisible = true">选择</el-button>
+    </div>
+    <MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
+      :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
+      <template #type="{ row }">
+        <DictTag :tag="false" :value="row.type" :options="D_BZ_RYJZLB" />
+      </template>
+      <!-- 操作 -->
+      <template #controls="{ row }">
+        <el-link type="danger" @click="delDictItem(row.id)">删除</el-link>
+      </template>
+    </MyTable>
+  </div>
+  <ChooseUser :Single="false" v-model="chooseMarksVisible" @choosedUsers="addMarks" :roleIds="roleIds" />
+</template>
+
+<script setup>
+import { ref, reactive, watch, toRaw, getCurrentInstance, onMounted, onUnmounted } from "vue";
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import ChooseUser from "@/components/ChooseList/ChooseUser/index.vue";
+import { tbZdqtGkxxBatchAdd, tbZdqtGkxxDelete, tbZdqtGkxxSelectPage } from '@/api/qt.js'
+import { ElMessageBox } from "element-plus";
+const { proxy } = getCurrentInstance();
+const props = defineProps({
+  dataList: {
+    type: Object,
+    default: () => { },
+  }, disabled: {
+    type: Boolean,
+    default: false
+  },
+  showBut: {
+    type: Boolean,
+    default: false
+  },
+})
+const { D_BZ_RYJZLB } = proxy.$dict('D_BZ_RYJZLB')
+const pageData = reactive({
+  tableData: [],
+  tableColumn: [{
+    prop: 'userName',
+    label: '管控人员',
+  }, {
+    prop: 'type',
+    label: '管控警种',
+    showOverflowTooltip: true,
+    showSolt: true,
+
+  }, {
+    prop: 'inDustRialId',
+    label: '警号',
+
+  }, {
+    prop: 'deptName',
+    label: '管控单位',
+  }],
+  tableHeight: '250px',
+  keyCount: 0,
+  tableConfiger: {
+    border: true,
+    stripe: true,
+    showHeader: true,
+    showIndex: true,
+    indexLabel: '序号',
+    indexWidth: 60,
+    align: 'center',
+    showOverflowTooltip: true,
+    haveControls: !props.disabled
+  },
+  controlsWidth: 120,
+
+})
+const listData = ref({})
+watch(() => props.dataList, (val) => {
+  if (val) {
+    listData.value = val
+    pageData.tableData = val.zdryList
+    gettbZdqtGkxxSelectPage()
+  }
+}, { deep: true })
+const roleIds = ref([])
+const chooseMarksVisible = ref(false)
+// 修改函数
+const addMarks = (val) => {
+  pageData.tableData = val
+  roleIds.value = val.map(item => item.id)
+  if (!props.disabled && props.showBut) {
+    const promes = {
+      list: pageData.tableData.map(item => {
+        return {
+          qtid: listData.value.id,
+          gkdwdm: item.deptId,
+          gkdwmc: item.deptName,
+          gkjz: item.type,
+          jh: item.inDustRialId,
+          xm: item.userName,
+        }
+      })
+    }
+    gettbGsxtZdqtAdd(promes)
+  }
+}
+// 删除函数
+const delDictItem = (row) => {
+
+  if (!props.disabled && props.showBut) {
+    ElMessageBox.confirm(
+      '是否删除管控信息',
+      '提示', {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    }
+    )
+      .then(() => {
+        pageData.tableData = pageData.tableData.filter(item => item.id !== row)
+        roleIds.value = roleIds.value.filter(id => id !== row)
+        const promes = { ids: [row] }
+        gettbGsxtZdqtDelete(promes)
+      })
+      .catch(() => {
+        ElMessage({
+          type: 'info',
+          message: '取消删除',
+        })
+      })
+  } else {
+    pageData.tableData = pageData.tableData.filter(item => item.id !== row)
+    roleIds.value = roleIds.value.filter(id => id !== row)
+  }
+}
+// 新增接口
+const gettbGsxtZdqtAdd = (val) => {
+  tbZdqtGkxxBatchAdd(val).then((res) => {
+    proxy.$message.success('添加成功')
+  }).catch((err) => {
+    proxy.$message.error('操作失败')
+  });
+}
+// 删除接口
+const gettbGsxtZdqtDelete = (val) => {
+  tbZdqtGkxxDelete(val).then((res) => {
+    proxy.$message.success('删除成功')
+  }).catch((err) => {
+    proxy.$message.error('操作失败')
+  });
+}
+// 查询接口
+const gettbZdqtGkxxSelectPage = (val) => {
+  const promes = {
+    pageSize: 1000,
+    pageCurrent: 1,
+    qtid: listData.value.id,
+  }
+  tbZdqtGkxxSelectPage(promes).then(res => {
+    pageData.tableData = res.records.map(item => {
+      return {
+        id: item.id,
+        deptId: item.gkdwdm,
+        deptName: item.gkdwmc,
+        type: item.gkjz,
+        inDustRialId: item.jh,
+        userName: item.xm,
+      }
+    })
+    roleIds.value = res.records.map(item => item.id)
+  })
+}
+
+// 抛出数据
+const throwData = () => {
+  return new Promise((resolve, reject) => {
+    // 验证是否有管控人员
+    // if (pageData.tableData.length === 0) {
+    //   reject(new Error('请选择管控人员'));
+    //   return;
+    // }
+
+    const transformedData = pageData.tableData.map(item => {
+      return {
+        gkdwdm: item.deptId,
+        gkdwmc: item.deptName,
+        gkjz: item.type,
+        jh: item.inDustRialId,
+        xm: item.userName,
+      }
+    });
+
+    resolve(transformedData);
+  });
+}
+defineExpose({
+  throwData
+})
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
+
+.backinfo-container {
+  padding: 10px;
+}
+
+.left_box {
+  width: 200px;
+  border: 1px solid #c8c8c89a;
+  border-radius: 5px;
+  padding: 5px;
+}
+
+.right_box {
+  width: calc(100% - 230px);
+  overflow-y: auto;
+  padding: 5px;
+}
+
+::v-deep .el-form-item__content {
+  display: block !important;
+}
+
+.headClass {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin: 0 0 10px 0;
+  padding-bottom: 10px;
+  border-bottom: 2px solid #409eff;
+  position: relative;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.headClass::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  bottom: -2px;
+  width: 60px;
+  height: 2px;
+  background-color: #409eff;
+}
+
+h3 {
+  margin: 0;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/model/demandsInfo.vue

@@ -0,0 +1,223 @@
+<template>
+
+  <div class="backinfo-container">
+    <div class="headClass" style="">
+      <h3 >主要诉求信息</h3>
+      <el-button type="primary"  v-if="showBut" :disabled="disabled"  @click="gettbGsxtZdqtUpdate">保存</el-button>
+    </div>
+    <el-input v-model="zyxx" :disabled="disabled"  :autosize="{ minRows: 4, maxRows: 10 }" type="textarea" placeholder="请输入主要诉求信息"
+      class="background-info-input" />
+  </div>
+
+</template>
+
+<script setup>
+import { ref, watch } from "vue";
+import { ElMessage } from 'element-plus';
+import { tbGsxtZdqtUpdate } from '@/api/qt.js'
+
+const zyxx = ref('')
+
+const props = defineProps({
+  dataList: {
+    type: Object,
+    default: () => { },
+  }, disabled: {
+    type: Boolean,
+    default: false
+  },
+  showBut: {
+    type: Boolean,
+    default: false
+  },
+})
+const listData = ref()
+watch(() => props.dataList, (val) => {
+  if (val) {
+    listData.value = val
+    zyxx.value = val.zyxx
+  }
+}, { deep: true })
+const gettbGsxtZdqtUpdate = () => {
+  if (!props.disabled && props.showBut) {
+    tbGsxtZdqtUpdate({
+      id: listData.value.id,
+      zyxx: zyxx.value
+    }).then((res) => {
+      ElMessage.success('修改成功')
+    }).catch((err) => {
+      ElMessage.error('修改失败')
+    });
+  }
+}
+// 抛出数据
+const throwData = () => {
+  return zyxx.value
+}
+defineExpose({
+  throwData
+})
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
+
+.backinfo-container {
+  padding: 10px;
+}
+
+.background-info-input {
+  width: 100%;
+  margin-bottom: 15px;
+}
+
+.file-attachment-section {
+  margin-top: 15px;
+}
+
+.section-title {
+  font-size: 14px;
+  font-weight: 500;
+  color: #303133;
+  margin-bottom: 10px;
+  padding-bottom: 5px;
+  border-bottom: 1px solid #ebeef5;
+}
+
+.file-list-container {
+  max-height: 100px;
+  overflow-y: auto;
+  border: 1px solid #ebeef5;
+  border-radius: 4px;
+  background-color: #ffffff;
+  margin-bottom: 10px;
+}
+
+/* 自定义滚动条样式 */
+.file-list-container::-webkit-scrollbar {
+  width: 6px;
+}
+
+.file-list-container::-webkit-scrollbar-track {
+  background: #f1f1f1;
+  border-radius: 3px;
+}
+
+.file-list-container::-webkit-scrollbar-thumb {
+  background: #c0c4cc;
+  border-radius: 3px;
+}
+
+.file-list-container::-webkit-scrollbar-thumb:hover {
+  background: #909399;
+}
+
+.empty-file-list {
+  padding: 20px;
+  text-align: center;
+  color: #909399;
+  font-size: 12px;
+}
+
+.file-list {
+  padding: 5px;
+}
+
+.file-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 10px;
+  margin-bottom: 2px;
+  background-color: #f8f9fa;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+  cursor: pointer;
+}
+
+.file-item:hover {
+  background-color: #e6f7ff;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+}
+
+.file-info {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  gap: 15px;
+  min-width: 0;
+}
+
+.file-name {
+  flex: 1;
+  font-size: 12px;
+  color: #303133;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.file-size {
+  font-size: 11px;
+  color: #909399;
+  min-width: 60px;
+}
+
+.file-time {
+  font-size: 11px;
+  color: #909399;
+}
+
+.file-actions {
+  display: flex;
+  align-items: center;
+  gap: 5px;
+  margin-left: 10px;
+}
+
+.file-actions .el-button {
+  padding: 0 5px;
+  margin: 0;
+  color: #606266;
+  transition: color 0.3s ease;
+}
+
+.file-actions .el-button:hover {
+  color: #409eff;
+}
+
+.delete-btn:hover {
+  color: #f56c6c !important;
+}
+
+.upload-btn-container {
+  display: flex;
+  justify-content: center;
+  margin-top: 10px;
+}
+.headClass{
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin: 0 0 10px 0;
+  padding-bottom: 10px;
+  border-bottom: 2px solid #409eff;
+  position: relative;
+  display: flex; justify-content: space-between;
+  align-items: center;
+}
+
+.headClass::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  bottom: -2px;
+  width: 60px;
+  height: 2px;
+  background-color: #409eff;
+}
+h3{
+  margin: 0;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/model/featinfo.vue

@@ -0,0 +1,225 @@
+<template>
+
+  <div class="backinfo-container">
+    <div class="headClass" style="">
+      <h3>群体特征信息</h3>
+      <el-button type="primary" v-if="showBut" :disabled="disabled" @click="gettbGsxtZdqtUpdate">保存</el-button>
+    </div>
+    <el-input v-model="qttz" :disabled="disabled" :autosize="{ minRows: 4, maxRows: 10 }" type="textarea"
+      placeholder="请输入背景信息" class="background-info-input" />
+  </div>
+</template>
+
+<script setup>
+import { ref, watch } from "vue";
+import { ElMessage } from 'element-plus';
+import { tbGsxtZdqtUpdate } from '@/api/qt.js'
+
+const props = defineProps({
+  dataList: {
+    type: Object,
+    default: () => { },
+  }, disabled: {
+    type: Boolean,
+    default: false
+  },
+  showBut: {
+    type: Boolean,
+    default: false
+  },
+})
+const listData = ref()
+const qttz = ref('')
+watch(() => props.dataList, (val) => {
+  if (val) {
+    listData.value = val
+    qttz.value = val.qttz
+  }
+}, { deep: true })
+const gettbGsxtZdqtUpdate = (val) => {
+  if (!props.disabled && props.showBut) {
+    tbGsxtZdqtUpdate({
+      id: listData.value.id,
+      qttz: qttz.value
+    }).then((res) => {
+      ElMessage.success('修改成功')
+    }).catch((err) => {
+      ElMessage.error('修改失败')
+    });
+  }
+
+}
+// 抛出数据
+const throwData = () => {
+  return qttz.value
+}
+defineExpose({
+  throwData
+})
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
+
+.backinfo-container {
+  padding: 10px;
+}
+
+.background-info-input {
+  width: 100%;
+  margin-bottom: 15px;
+}
+
+.file-attachment-section {
+  margin-top: 15px;
+}
+
+.section-title {
+  font-size: 14px;
+  font-weight: 500;
+  color: #303133;
+  margin-bottom: 10px;
+  padding-bottom: 5px;
+  border-bottom: 1px solid #ebeef5;
+}
+
+.file-list-container {
+  max-height: 100px;
+  overflow-y: auto;
+  border: 1px solid #ebeef5;
+  border-radius: 4px;
+  background-color: #ffffff;
+  margin-bottom: 10px;
+}
+
+/* 自定义滚动条样式 */
+.file-list-container::-webkit-scrollbar {
+  width: 6px;
+}
+
+.file-list-container::-webkit-scrollbar-track {
+  background: #f1f1f1;
+  border-radius: 3px;
+}
+
+.file-list-container::-webkit-scrollbar-thumb {
+  background: #c0c4cc;
+  border-radius: 3px;
+}
+
+.file-list-container::-webkit-scrollbar-thumb:hover {
+  background: #909399;
+}
+
+.empty-file-list {
+  padding: 20px;
+  text-align: center;
+  color: #909399;
+  font-size: 12px;
+}
+
+.file-list {
+  padding: 5px;
+}
+
+.file-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 10px;
+  margin-bottom: 2px;
+  background-color: #f8f9fa;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+  cursor: pointer;
+}
+
+.file-item:hover {
+  background-color: #e6f7ff;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+}
+
+.file-info {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  gap: 15px;
+  min-width: 0;
+}
+
+.file-name {
+  flex: 1;
+  font-size: 12px;
+  color: #303133;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.file-size {
+  font-size: 11px;
+  color: #909399;
+  min-width: 60px;
+}
+
+.file-time {
+  font-size: 11px;
+  color: #909399;
+}
+
+.file-actions {
+  display: flex;
+  align-items: center;
+  gap: 5px;
+  margin-left: 10px;
+}
+
+.file-actions .el-button {
+  padding: 0 5px;
+  margin: 0;
+  color: #606266;
+  transition: color 0.3s ease;
+}
+
+.file-actions .el-button:hover {
+  color: #409eff;
+}
+
+.delete-btn:hover {
+  color: #f56c6c !important;
+}
+
+.upload-btn-container {
+  display: flex;
+  justify-content: center;
+  margin-top: 10px;
+}
+
+.headClass {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin: 0 0 10px 0;
+  padding-bottom: 10px;
+  border-bottom: 2px solid #409eff;
+  position: relative;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.headClass::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  bottom: -2px;
+  width: 60px;
+  height: 2px;
+  background-color: #409eff;
+}
+
+h3 {
+  margin: 0;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/model/fileUp.js

@@ -0,0 +1,300 @@
+import request from '@/utils/request';
+import service from '@/utils/request';
+import { upImageFileInfo } from '@/api/commit.js';
+import { ElMessage } from 'element-plus';
+
+// 上传单个文件
+export async function uploadSingleFile(file, options = {}) {
+  try {
+    // 获取文件对象，确保能够正确访问文件信息
+    const fileObj = file.file || file;
+
+    // 创建临时文件对象用于显示
+    const tempFile = {
+      id: `temp_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`,
+      originalName: fileObj.name,
+      uploading: true
+    };
+
+    if (options.uploadedFiles) {
+      options.uploadedFiles.push(tempFile);
+    }
+
+    const isImageFile = fileObj.type.startsWith('image/');
+    // 只有图片文件才压缩
+    let fileData = isImageFile && options.compressImage ? await options.compressImage(fileObj) : fileObj;
+
+    const data = new FormData();
+    data.append("file", fileData);
+
+    // 更新UI状态
+    if (file.status !== undefined) {
+      file.status = "uploading";
+      file.message = "上传中...";
+    }
+
+    const res = await upImageFileInfo(data);
+
+    // 更新文件状态
+    if (options.uploadedFiles) {
+      const fileIndex = options.uploadedFiles.findIndex(f => f.id === tempFile.id);
+      if (fileIndex !== -1) {
+        options.uploadedFiles[fileIndex] = {
+          id: res.id || tempFile.id,
+          originalName: fileObj.name,
+          uploading: false,
+          url: res.url,
+          fileSize: fileObj.size
+        };
+        // 更新文件ID列表
+        if (options.fjIds) {
+          options.fjIds.push(res);
+        }
+      }
+    }
+
+    // 更新文件状态
+    if (file.status !== undefined) {
+      file.status = "done";
+      file.message = "上传成功";
+      file.id = res.id || tempFile.id;
+      file.url = res.url;
+      file.originalName = fileObj.name;
+      file.fileSize = fileObj.size;
+    }
+
+    ElMessage.success('文件上传成功');
+    return res;
+
+  } catch (error) {
+    console.error('文件上传失败:', error);
+    ElMessage.error('文件上传失败');
+
+    // 更新文件状态
+    if (file && file.status !== undefined) {
+      file.status = "failed";
+      file.message = "上传失败";
+    }
+
+    // 获取可能的文件名用于查找
+    const fileName = (file.file?.originalName || file.originalName || '');
+
+    // 移除上传失败的文件
+    if (options.uploadedFiles) {
+      const fileIndex = options.uploadedFiles.findIndex(f =>
+        f.originalName === fileName && f.uploading
+      );
+      if (fileIndex !== -1) {
+        options.uploadedFiles.splice(fileIndex, 1);
+      }
+    }
+
+    throw error;
+  }
+}
+
+// 上传多个文件
+export async function uploadMultipleFiles(files, options = {}) {
+  if (Array.isArray(files)) {
+    // 多个文件上传
+    const results = [];
+    for (const file of files) {
+      try {
+        const result = await uploadSingleFile(file, options);
+        results.push(result);
+      } catch (error) {
+        // 可以选择继续上传其他文件或者中断
+        if (!options.continueOnError) {
+          throw error;
+        }
+      }
+    }
+    return results;
+  } else {
+    // 单个文件上传
+    return [await uploadSingleFile(files, options)];
+  }
+}
+
+// Element Plus 的 el-upload 上传函数
+// export function upImageFileInfo(data) {
+//   return service({
+//     url: '/mosty-api/mosty-base/minio/file/uploadObj',
+//     method: 'post',
+//     data
+//   });
+// }
+
+// 文件下载函数
+export function downloadFile(fileUrl, fileName = '') {
+  return new Promise((resolve, reject) => {
+    const token = localStorage.getItem('token');
+    const xhr = new XMLHttpRequest();
+
+    xhr.open('GET', fileUrl, true);
+    xhr.setRequestHeader('Authorization', token);
+    xhr.responseType = 'blob';
+
+    xhr.onload = function () {
+      if (this.status === 200) {
+        const blob = this.response;
+        const link = document.createElement('a');
+        const url = window.URL.createObjectURL(blob);
+
+        link.href = url;
+        link.download = fileName || 'download';
+        document.body.appendChild(link);
+        link.click();
+
+        // 清理
+        setTimeout(() => {
+          document.body.removeChild(link);
+          window.URL.revokeObjectURL(url);
+        }, 0);
+
+        resolve({ success: true });
+      } else {
+        ElMessage.error('文件下载失败');
+        reject(new Error('下载失败'));
+      }
+    };
+
+    xhr.onerror = function () {
+      ElMessage.error('网络错误，下载失败');
+      reject(new Error('网络错误'));
+    };
+
+    xhr.send();
+  });
+}
+
+// 删除文件前确认
+export function beforeDelete(file) {
+  return new Promise((resolve) => {
+    // 创建一个简单的确认对话框
+    const confirmed = window.confirm(`确定要删除文件"${file.originalName || file.name}"吗？`);
+    resolve(confirmed);
+  });
+}
+
+// 删除文件
+export async function deleteFile(file, options = {}) {
+  try {
+    // 显示确认对话框
+    const confirm = await beforeDelete(file);
+
+    if (confirm) {
+      const fileId = file.id;
+      const url = options.url || '/mosty-api/mosty-base/minio/file/delete';
+      const token = localStorage.getItem('token');
+
+      // 调用删除API
+      const res = await request({
+        url: url,
+        method: 'post',
+        data: { fileId },
+        headers: {
+          'Authorization': token
+        }
+      });
+
+      if (res.code === 10000 || res.status === 200) {
+        // 从已上传文件列表中移除
+        if (options.uploadedFiles) {
+          const fileIndex = options.uploadedFiles.findIndex(f =>
+            f.id === file.id || f.originalName === file.originalName
+          );
+          if (fileIndex !== -1) {
+            options.uploadedFiles.splice(fileIndex, 1);
+          }
+        }
+
+        // 从fileList中移除
+        if (options.fileList) {
+          const listIndex = options.fileList.findIndex(f => f.id === file.id);
+          if (listIndex !== -1) {
+            options.fileList.splice(listIndex, 1);
+          }
+        }
+
+        // 从fjIds中移除
+        if (options.fjIds) {
+          const fjIndex = options.fjIds.findIndex(f => f.id === file.id);
+          if (fjIndex !== -1) {
+            options.fjIds.splice(fjIndex, 1);
+          }
+        }
+
+        ElMessage.success('文件删除成功');
+        return res;
+      } else {
+        ElMessage.error('文件删除失败');
+        throw new Error('删除失败');
+      }
+    }
+  } catch (error) {
+    console.error('文件删除失败:', error);
+    ElMessage.error('文件删除失败');
+    throw error;
+  }
+}
+
+// 格式化文件大小
+export function formatFileSize(bytes) {
+  if (bytes === 0) return '0 Bytes';
+  const k = 1024;
+  const sizes = ['Bytes', 'KB', 'MB', 'GB'];
+  const i = Math.floor(Math.log(bytes) / Math.log(k));
+  return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
+}
+
+// el-upload 组件配置生成器
+export function generateUploadConfig(options = {}) {
+  const {
+    limit = 3,
+    accept = '',
+    action = '/mosty-api/mosty-base/minio/image/upload/id',
+    onSuccess = () => { },
+    onRemove = () => { },
+    onExceed = () => { },
+    beforeRemove = () => { },
+    beforeUpload = () => { }
+  } = options;
+
+  // 获取token
+  const getToken = () => {
+    return localStorage.getItem('token');
+  };
+
+  return {
+    headers: {
+      'Authorization': getToken()
+    },
+    action: action,
+    multiple: true,
+    limit: limit,
+    accept: accept,
+    showFileList: true,
+    onSuccess: (response, uploadFile, uploadFiles) => {
+      ElMessage.success('上传成功');
+      onSuccess(response, uploadFile, uploadFiles);
+    },
+    onRemove: (uploadFile, uploadFiles) => {
+      onRemove(uploadFile, uploadFiles);
+    },
+    onExceed: (files, uploadFiles) => {
+      ElMessage.warning(`最多只能上传 ${limit} 个文件`);
+      onExceed(files, uploadFiles);
+    },
+    beforeRemove: (uploadFile, uploadFiles) => {
+      const result = beforeRemove(uploadFile, uploadFiles);
+      if (result === undefined) {
+        return window.confirm(`确定移除 ${uploadFile.name}？`);
+      }
+      return result;
+    },
+    beforeUpload: (file) => {
+      return beforeUpload(file);
+    }
+  };
+}

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/model/groupLabels.vue

@@ -0,0 +1,208 @@
+<template>
+  <div>
+    <div class="headClass" style="">
+      <h3>群体标签</h3>
+      <el-button type="primary" :disabled="disabled" @click="chooseMarksVisible = true">选择</el-button>
+    </div>
+    <MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
+      :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
+      <template #bqLx="{ row }">
+        <DictTag :tag="false" :value="row.bqLx" :options="D_GS_BQ_DJ" />
+      </template>
+      <template #bqLb="{ row }">
+        <DictTag :tag="false" :value="row.bqLb" :options="D_GS_SSYJ" />
+      </template>
+      <!-- 操作 -->
+      <template #controls="{ row }">
+        <el-link type="danger" @click="delDictItem(row.bqId)">删除</el-link>
+      </template>
+    </MyTable>
+  </div>
+  <ChooseMarks v-model="chooseMarksVisible" @choosed="addMarks" :roleIds="roleIds" />
+</template>
+
+<script setup>
+import { ref, reactive, watch, toRaw, getCurrentInstance, onMounted, onUnmounted } from "vue";
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import ChooseMarks from "@/components/ChooseList/ChooseMarks/index.vue";
+import { tbGsxtZdqtUpdate } from '@/api/qt.js'
+import { ElMessage, ElMessageBox } from "element-plus";
+const { proxy } = getCurrentInstance();
+const { D_GS_BQ_DJ, D_GS_SSYJ } = proxy.$dict("D_GS_BQ_DJ", "D_GS_SSYJ"); //获取字典数据
+const chooseMarksVisible = ref(false)
+const props = defineProps({
+  dataList: {
+    type: Object,
+    default: () => { },
+  }, disabled: {
+    type: Boolean,
+    default: false
+  },
+  showBut: {
+    type: Boolean,
+    default: false
+  },
+})
+const listData = ref({})
+watch(() => props.dataList, (val) => {
+  if (val) {
+    listData.value = val
+    pageData.tableData = val.bqList
+  }
+}, { deep: true })
+const roleIds = ref([])
+// 表格数据
+const pageData = reactive({
+  tableData: [],
+  tableColumn: [{
+    prop: 'bqMc',
+    label: '标签名称',
+    showOverflowTooltip: true
+  }, {
+    prop: 'bqDm',
+    label: '标签代码',
+  }, {
+    showSolt: true,
+    prop: 'bqLx',
+    label: '标签类型',
+  }, {
+    showSolt: true,
+    prop: 'bqLb',
+    label: '标签类别',
+  }],
+  tableHeight: '200px',
+  keyCount: 0,
+  tableConfiger: {
+    border: true,
+    stripe: true,
+    showHeader: true,
+    showIndex: true,
+    indexLabel: '序号',
+    indexWidth: 60,
+    align: 'center',
+    showOverflowTooltip: true,
+    haveControls: !props.disabled
+  },
+  controlsWidth: 200,
+})
+// 修改数据接口
+const zdqtUpdate = (val) => {
+  const params = {
+    id: listData.value.id,
+    bqList: pageData.tableData
+  }
+  tbGsxtZdqtUpdate(params).then(res => {
+    proxy.$message({
+      message: val,
+      type: 'success'
+    })
+  })
+}
+// 新增标签
+const addMarks = (val) => {
+  pageData.tableData = val.map(v => {
+    return { bqDm: v.bqDm, bqId: v.id, bqLb: v.bqLb, bqLx: v.bqLx, bqMc: v.bqMc }
+  });
+  roleIds.value = val.map(v => v.id)
+  if (!props.disabled && props.showBut) {
+    zdqtUpdate("标签添加成功")
+  }
+}
+// 删除标签
+const delDictItem = (val) => {
+  if (!props.disabled && props.showBut) {
+    ElMessageBox.confirm(
+    '是否删除标签',
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    }
+  )
+    .then(() => {
+      pageData.tableData = pageData.tableData.filter(v => v.bqId != val)
+      roleIds.value = roleIds.value.filter(v => v != val)
+        zdqtUpdate("标签删除成功")
+    })
+    .catch(() => {
+      ElMessage({
+        type: 'info',
+        message: '取消删除',
+      })
+    })
+
+  } else {
+    pageData.tableData = pageData.tableData.filter(v => v.bqId != val)
+    roleIds.value = roleIds.value.filter(v => v != val)
+  }
+
+}
+// 抛出数据并验证标签列表不为空
+const throwData = () => {
+  return new Promise((resolve) => {
+    // 验证：确保标签列表不为空
+    if (!pageData.tableData || pageData.tableData.length === 0) {
+      throw new Error('请选择群体标签');
+    }
+    
+    resolve(pageData.tableData);
+  });
+}
+defineExpose({
+  throwData
+})
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
+
+.backinfo-container {
+  padding: 10px;
+}
+
+.left_box {
+  width: 200px;
+  border: 1px solid #c8c8c89a;
+  border-radius: 5px;
+  padding: 5px;
+}
+
+.right_box {
+  width: calc(100% - 230px);
+  overflow-y: auto;
+  padding: 5px;
+}
+
+::v-deep .el-form-item__content {
+  display: block !important;
+}
+
+.headClass {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin: 0 0 10px 0;
+  padding-bottom: 10px;
+  border-bottom: 2px solid #409eff;
+  position: relative;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.headClass::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  bottom: -2px;
+  width: 60px;
+  height: 2px;
+  background-color: #409eff;
+}
+
+h3 {
+  margin: 0;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/model/historyAssembly.vue

@@ -0,0 +1,239 @@
+<template>
+  <div>
+    <div class="headClass" style="">
+      <h3>集会历史</h3>
+      <el-button type="primary" @click="openHistory"  v-if="showBut">新增</el-button>
+    </div>
+    <MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
+      :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
+      <template #timeQuantum="{ row }">
+        {{ `${row.kssj}至${row.jssj}` }}
+      </template>
+      <template #ssry="{ row }">
+        <span v-for="(item, index) in row.ssry" :key="index">{{ item.ryXm }}<span
+            v-if="index < row.ssry.length - 1">,</span></span>
+      </template>
+      <template #fj="{ row }">
+        <span v-for="(item, index) in row.fj" :key="index">{{ item.originalName }}<span
+            v-if="index < row.fj.length - 1">,</span></span>
+      </template>
+      <!-- 操作 -->
+      <template #controls="{ row }">
+        <el-link type="danger" @click="modification(row)">修改</el-link>
+        <el-link type="danger" @click="delDictItem(row.id)">删除</el-link>
+      </template>
+    </MyTable>
+  </div>
+  <History v-model="historyShow" @comfirm="onComfirm" :data="dataAmend" />
+</template>
+<script setup>
+import { ref, reactive, watch,  getCurrentInstance } from "vue";
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import { ElMessageBox } from 'element-plus'
+import { tbZdqtLsjhAdd, tbZdqtLsjhDelete, tbZdqtLsjhSelectPage, tbZdqtLsjhUpdate } from '@/api/qt.js'
+import History from "../component/history.vue";
+const props = defineProps({
+  dataList: {
+    type: Object,
+    default: () => { },
+  }, disabled: {
+    type: Boolean,
+    default: false
+  },
+  showBut: {
+    type: Boolean,
+    default: false
+  },
+})
+const { proxy } = getCurrentInstance();
+const pageData = reactive({
+  tableData: [],
+  tableColumn: [{
+    prop: 'timeQuantum',
+    label: '活动时间',
+    showSolt: true
+  }, {
+    prop: 'gjxw',
+    label: '过激行为',
+  }, {
+    prop: 'hdcs',
+    label: '活动场所',
+  }, {
+    prop: 'ssry',
+    label: '涉事人员',
+    showSolt: true
+  }, {
+    prop: 'fj',
+    label: '附件',
+    showSolt: true
+  }],
+  tableHeight: '200px',
+  keyCount: 0,
+  tableConfiger: {
+    border: true,
+    stripe: true,
+    showHeader: true,
+    showIndex: true,
+    indexLabel: '序号',
+    indexWidth: 60,
+    align: 'center',
+    showOverflowTooltip: true,
+  },
+  controlsWidth: 120,
+
+})
+const listData = ref({})
+const butShow = ref(true)
+watch(() => props.dataList, (val) => {
+  if (val) {
+    listData.value = val
+    gettbZdqtLsjhSelectPage()
+
+  }
+}, { deep: true })
+
+const historyShow = ref(false);
+const dataAmend = ref({});
+const onComfirm = (val) => {
+  let promes = {
+    kssj: val.kssj,
+    jssj: val.jssj,
+    gjxw: val.gjxw,
+    hdcs: val.hdcs,
+    ssry: JSON.stringify(val.ssry),
+    fj: val.fileList.length > 0 ? JSON.stringify(val.fileList) : '',
+    qtid: listData.value.id
+  }
+  if (butShow.value) {
+    tbZdqtLsjhAdd(promes).then((res) => {
+      gettbZdqtLsjhSelectPage()
+      proxy.$message({
+        message: '添加成功',
+        type: 'success'
+      })
+    })
+  } else {
+    promes.id=val.id
+    tbZdqtLsjhUpdate(promes).then((res) => {
+      gettbZdqtLsjhSelectPage()
+      proxy.$message({
+        message: '修改成功',
+        type: 'success'
+      })
+    })
+  }
+
+}
+const openHistory = () => {
+  butShow.value=true
+  historyShow.value = true;
+}
+// 列表
+const gettbZdqtLsjhSelectPage = () => {
+  const promes = {
+    qtid: listData.value.id,
+    pageSize: 1000,
+    pageCurrent: 1
+  }
+  tbZdqtLsjhSelectPage(promes).then((res) => {
+    pageData.tableData = res.records.map(item => {
+      return {
+        ...item,
+        ssry: item.ssry ? JSON.parse(item.ssry) : [],
+        fj: item.fj ? JSON.parse(item.fj) : [],
+      }
+    })
+  })
+}
+// 删除
+const delDictItem = (val) => {
+
+  ElMessageBox.confirm(
+    '是否删除该记录?',
+    '提示',
+    {
+      confirmButtonText: '确定',
+      cancelButtonText: '取消',
+      type: 'warning',
+    }
+  )
+    .then(() => {
+      const promes = { ids: [val] }
+      tbZdqtLsjhDelete(promes).then((res) => {
+        gettbZdqtLsjhSelectPage()
+        proxy.$message({
+          message: '删除成功',
+          type: 'success'
+        })
+      })
+    })
+    .catch(() => {
+      ElMessage({
+        type: 'info',
+        message: '取消删除',
+      })
+    })
+
+
+
+}
+// 修改
+const modification = (val) => {
+  butShow.value=false
+  historyShow.value = true;
+  dataAmend.value = val
+}
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
+
+.backinfo-container {
+  padding: 10px;
+}
+
+.left_box {
+  width: 200px;
+  border: 1px solid #c8c8c89a;
+  border-radius: 5px;
+  padding: 5px;
+}
+
+.right_box {
+  width: calc(100% - 230px);
+  overflow-y: auto;
+  padding: 5px;
+}
+
+::v-deep .el-form-item__content {
+  display: block !important;
+}
+
+.headClass {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin: 0 0 10px 0;
+  padding-bottom: 10px;
+  border-bottom: 2px solid #409eff;
+  position: relative;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.headClass::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  bottom: -2px;
+  width: 60px;
+  height: 2px;
+  background-color: #409eff;
+}
+
+h3 {
+  margin: 0;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/model/info.vue

@@ -0,0 +1,153 @@
+<template>
+  <div>
+    <div class="headClass" style="">
+      <h3>群体背景信息</h3>
+      <el-button type="primary" v-if="showBut" :disabled="disabled" @click="gettbGsxtZdqtUpdate">保存</el-button>
+    </div>
+    <FormMessage v-model="listQuery" :formList="formData" labelWidth="120px" ref="elform" :rules="rules">
+      <template #qtzp>
+        <div style="width: 100%; padding-left: 50px">
+          <MOSTY.Upload :showBtn="false" :limit="1" v-model="listQuery.qtzp" />
+        </div>
+      </template>
+    </FormMessage>
+  </div>
+</template>
+
+<script setup>
+import { ref, watch, reactive, getCurrentInstance } from "vue";
+import FormMessage from "@/components/aboutTable/FormMessage.vue";
+import { tbGsxtZdqtUpdate } from '@/api/qt'
+import * as MOSTY from "@/components/MyComponents/index";
+const props = defineProps({
+  dataList: {
+    type: Object,
+    default: () => { },
+  }, disabled: {
+    type: Boolean,
+    default: false
+  },
+  showBut: {
+    type: Boolean,
+    default: false
+  },
+})
+watch(() => props.dataList, (val) => {
+  listQuery.value = { ...val }
+}, { deep: true })
+const { proxy } = getCurrentInstance();
+const { D_GS_ZDQT_FXDJ, D_GS_ZDQT_LB, D_GS_ZDR_YJDJ, D_BZ_RCBKZT, D_ZDQT_QTXZ } =
+  proxy.$dict('D_GS_ZDQT_FXDJ', 'D_GS_ZDQT_LB', 'D_GS_ZDR_YJDJ', 'D_BZ_RCBKZT', 'D_ZDQT_QTXZ')
+const formData = ref([
+  { label: "群体名称", prop: "qtMc", type: "input", width: '30%' },
+  { label: "群体别名", prop: "qtBm", type: "input", width: '30%' },
+  { label: "风险等级", prop: "qtFxdj", type: "select", options: D_GS_ZDQT_FXDJ, width: '30%' },
+  { label: "群体类别", prop: "qtLb", type: "select", options: D_GS_ZDQT_LB, width: '30%' },
+  { label: "预警等级", prop: "zdrYjdj", type: "select", options: D_GS_ZDR_YJDJ, width: '30%' },
+  { label: "布控状态", prop: "bkzt", type: "select", options: D_BZ_RCBKZT, width: '30%' },
+  { label: "群体成立时间", prop: "qtClsj", type: "date", width: '30%' },
+  { label: "入库时间", prop: "zdrRkkssj", type: "datetime", width: '30%' },
+  { label: "出库时间", prop: "zdrRkjssj", type: "datetime", width: '30%' },
+  { label: "所属部门", prop: "gxSsbmdm", type: "department", width: '30%' },
+  { label: "群体照片", prop: "qtzp", type: "slot", width: '60%' },
+
+])
+const listQuery = ref({})
+const elform = ref(null)
+const rules = reactive({
+  qtMc: [{ required: true, message: "请输入车牌号", trigger: "blur" }],
+  qtFxdj: [{ required: true, message: "请选择风险等级", trigger: "change" }],
+  qtLb: [{ required: true, message: "请选择群体类别", trigger: "change" }],
+  bkzt: [{ required: true, message: "请选择布控状态", trigger: "change" }],
+  qtClsj: [{ required: true, message: "请选择群体成立时间", trigger: "change" }],
+  zdrYjdj: [{ required: true, message: "请选择所预警等级", trigger: "change" }]
+})
+const gettbGsxtZdqtUpdate = () => {
+  const promes = { ...listQuery.value, qtzp: listQuery.value.qtzp ? listQuery.value.qtzp.toString() : '' }
+  tbGsxtZdqtUpdate(promes).then((res) => {
+    proxy.$message({
+      message: '更新成功',
+      type: 'success'
+    })
+  }).catch((err) => {
+
+  });
+}
+// 抛出数据并验证表单
+const throwData = () => {
+  return new Promise((resolve, reject) => {
+    if (elform.value && elform.value.validate) {
+      elform.value.validate((valid) => {
+        if (valid) {
+          resolve({ ...listQuery.value, qtzp: listQuery.value.qtzp ? listQuery.value.qtzp.toString() : '' });
+        } else {
+          reject(new Error('表单验证失败，请检查输入信息'));
+        }
+      });
+    } else {
+      // 如果没有验证方法，直接返回数据
+      resolve({ ...listQuery.value, qtzp: listQuery.value.qtzp ? listQuery.value.qtzp.toString() : '' });
+    }
+  });
+}
+defineExpose({
+  throwData
+})
+
+
+
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
+
+.left_box {
+  width: 200px;
+  border: 1px solid #c8c8c89a;
+  border-radius: 5px;
+  padding: 5px;
+}
+
+.right_box {
+  width: calc(100% - 230px);
+  overflow-y: auto;
+  padding: 5px;
+}
+
+::v-deep .el-form-item__content {
+  display: block !important;
+  width: 100%;
+}
+
+::v-deep .form-item-box {
+  width: 100% !important;
+}
+
+.headClass {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin: 0 0 10px 0;
+  padding-bottom: 10px;
+  border-bottom: 2px solid #409eff;
+  position: relative;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.headClass::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  bottom: -2px;
+  width: 60px;
+  height: 2px;
+  background-color: #409eff;
+}
+
+h3 {
+  margin: 0;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/model/joblogging.vue

@@ -0,0 +1,232 @@
+<template>
+  <div>
+    <div class="headClass" style="">
+      <h3>工作记录</h3>
+      <el-button type="primary"  v-if="showBut" @click="openHistory">新增</el-button>
+    </div>
+    <MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
+      :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
+      <template #fj="{ row }">
+        <span v-for="(item, index) in row.fj" :key="index">{{ item.originalName }}<span
+            v-if="index < row.fj.length - 1">,</span></span>
+      </template>
+      <!-- 操作 -->
+      <template #controls="{ row }">
+        <el-link type="danger" @click="modification(row)">修改</el-link>
+        <el-link type="danger" @click="delDictItem(row.id)">删除</el-link>
+      </template>
+    </MyTable>
+  </div>
+  <Record v-model="recordShow" @comfirm="onComfirm" :data="dataAmend" />
+</template>
+
+<script setup>
+import { ref, reactive, watch, toRaw, getCurrentInstance, onMounted, onUnmounted } from "vue";
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import { ElMessageBox } from 'element-plus'
+import { tbZdqtGzjlAdd, tbZdqtGzjlDelete, tbZdqtGzjlSelectPage, tbZdqtGzjlUpdate } from '@/api/qt.js'
+import Record  from "../component/record.vue";
+const props = defineProps({
+  dataList: {
+    type: Object,
+    default: () => { },
+  }, disabled: {
+    type: Boolean,
+    default: false
+  },
+  showBut: {
+    type: Boolean,
+    default: false
+  },
+})
+const { proxy } = getCurrentInstance();
+const pageData = reactive({
+  tableData: [],
+  tableColumn: [{
+    prop: 'xm',
+    label: '民警',
+  }, {
+    prop: 'sfzh',
+    label: '身份证号',
+  }, {
+    prop: 'gzjl',
+    label: '工作记录',
+  },{
+    prop: 'ssbm',
+    label: '所属部门',
+  },{
+    prop: 'gzjl',
+    label: '工作记录',
+  }, {
+    prop: 'fj',
+    label: '附件',
+    showSolt: true
+  }],
+  tableHeight: '200px',
+  keyCount: 0,
+  tableConfiger: {
+    border: true,
+    stripe: true,
+    showHeader: true,
+    showIndex: true,
+    indexLabel: '序号',
+    indexWidth: 60,
+    align: 'center',
+    showOverflowTooltip: true,
+  },
+  controlsWidth: 120,
+
+})
+const listData = ref({})
+const butShow = ref(true)
+watch(() => props.dataList, (val) => {
+  if (val) {
+    listData.value = val
+    gettbZdqtLsjhSelectPage()
+  }
+}, { deep: true })
+
+const recordShow = ref(false);
+const dataAmend = ref({});
+const onComfirm = (val) => {
+  let promes = {
+    gzjl: val.gzjl,
+    sfzh: val.sfzh,
+    ssbm: val.ssbm,
+    ssbmdm:val.ssbmdm,
+    xm: val.xm,
+    fj: val.fileList.length > 0 ? JSON.stringify(val.fileList) : '',
+    qtid: listData.value.id
+  }
+  if (butShow.value) {
+    tbZdqtGzjlAdd(promes).then((res) => {
+      gettbZdqtLsjhSelectPage()
+      proxy.$message({
+        message: '添加成功',
+        type: 'success'
+      })
+    })
+  } else {
+    promes.id=val.id
+    tbZdqtGzjlUpdate(promes).then((res) => {
+      gettbZdqtLsjhSelectPage()
+      proxy.$message({
+        message: '修改成功',
+        type: 'success'
+      })
+    })
+  }
+
+}
+const openHistory = () => {
+  butShow.value=true
+  recordShow.value = true;
+}
+// 列表
+const gettbZdqtLsjhSelectPage = () => {
+  const promes = {
+    qtid: listData.value.id,
+    pageSize: 1000,
+    pageCurrent: 1
+  }
+  tbZdqtGzjlSelectPage(promes).then((res) => {
+    pageData.tableData = res.records.map(item => {
+      return {
+        ...item,
+        fj: item.fj ? JSON.parse(item.fj) : [],
+      }
+    })
+  })
+}
+// 删除
+const delDictItem = (val) => {
+
+  ElMessageBox.confirm(
+    '是否删除该记录?',
+    '提示',
+    {
+      confirmButtonText: '确定',
+      cancelButtonText: '取消',
+      type: 'warning',
+    }
+  )
+    .then(() => {
+      const promes = { ids: [val] }
+      tbZdqtGzjlDelete(promes).then((res) => {
+        gettbZdqtLsjhSelectPage()
+        proxy.$message({
+          message: '删除成功',
+          type: 'success'
+        })
+      })
+    })
+    .catch(() => {
+      ElMessage({
+        type: 'info',
+        message: '取消删除',
+      })
+    })
+
+
+
+}
+// 修改
+const modification = (val) => {
+  butShow.value=false
+  recordShow.value = true;
+  dataAmend.value = val
+}
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
+
+.backinfo-container {
+  padding: 10px;
+}
+
+.left_box {
+  width: 200px;
+  border: 1px solid #c8c8c89a;
+  border-radius: 5px;
+  padding: 5px;
+}
+
+.right_box {
+  width: calc(100% - 230px);
+  overflow-y: auto;
+  padding: 5px;
+}
+
+::v-deep .el-form-item__content {
+  display: block !important;
+}
+
+.headClass {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin: 0 0 10px 0;
+  padding-bottom: 10px;
+  border-bottom: 2px solid #409eff;
+  position: relative;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.headClass::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  bottom: -2px;
+  width: 60px;
+  height: 2px;
+  background-color: #409eff;
+}
+
+h3 {
+  margin: 0;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/model/judgmentRecord.vue

@@ -0,0 +1,213 @@
+<template>
+  <div>
+    <div class="headClass" style="">
+      <h3>研判记录</h3>
+      <el-button type="primary" v-if="showBut" @click="openJudgment">新增</el-button>
+    </div>
+    <MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
+      :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
+      <template #fj="{row}">
+        <span v-for="(item,index) in row.fj" :key="index">{{ item.originalName }}<span v-if="index < row.fj.length - 1">、</span></span>
+      </template>
+      <!-- 操作 -->
+      <template #controls="{ row }">
+        <el-link type="danger" @click="updeteRecord(row)">修改</el-link>
+        <el-link type="danger" @click="delDictItem(row.id)">删除</el-link>
+      </template>
+    </MyTable>
+  </div>
+  <JudgmentRecord v-model="JudgmentShow" @comfirm="onComfirm" :data="dataAmend" />
+</template>
+
+<script setup>
+import { ref, reactive, watch, toRaw, getCurrentInstance, onMounted, onUnmounted } from "vue";
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import { tbZdqtYpAdd, tbZdqtYpDelete, tbZdqtYpSelectPage, tbZdqtYpUpdate } from '@/api/qt.js'
+import JudgmentRecord from '../component/judgmentRecord.vue'
+const { proxy } = getCurrentInstance();
+const props = defineProps({
+  dataList: {
+    type: Object,
+    default: () => { },
+  }, disabled: {
+    type: Boolean,
+    default: false
+  },
+  showBut: {
+    type: Boolean,
+    default: false
+  },
+})
+const pageData = reactive({
+  tableData: [],
+  tableColumn: [{
+    prop: 'ypnr',
+    label: '研判内容',
+  }, {
+    prop: 'fj',
+    label: '附件',
+    showSolt: true,
+  }],
+  tableHeight: '300px',
+  keyCount: 0,
+  tableConfiger: {
+    border: true,
+    stripe: true,
+    showHeader: true,
+    showIndex: true,
+    indexLabel: '序号',
+    indexWidth: 60,
+    align: 'center',
+    showOverflowTooltip: true,
+  },
+  controlsWidth: 200,
+})
+const listData = ref({})
+watch(() => props.dataList, (val) => {
+  if (val) {
+    listData.value = val
+    gettbZdqtYpSelectPage()
+  }
+}, { deep: true })
+
+const JudgmentShow = ref(false)
+const modifyShow = ref(true)
+const dataAmend = ref()
+const onComfirm = (val) => {
+  if (modifyShow.value) {
+    gettbZdqtYpAdd(val)
+    gettbZdqtYpSelectPage()
+  } else {
+    const promes = { ...val,fj:JSON.stringify(val.fileList) }
+    amendantRecord(promes)
+  }
+}
+const openJudgment = (val) => {
+  JudgmentShow.value = true;
+  modifyShow.value = true
+}
+const delDictItem = (val) => {
+  proxy.$confirm('确定删除吗？', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
+  }).then(() => {
+    deletbZdqtYpDelete(val)
+  }).catch(() => {
+  });
+}
+
+const updeteRecord = (val) => {
+  dataAmend.value = val
+  JudgmentShow.value = true;
+  modifyShow.value = false
+}
+
+//查询列表
+const gettbZdqtYpSelectPage = () => {
+  const promes = {
+    pageCurrent: 1,
+    pageSize: 1000,
+    qtid: props.dataList.id
+  }
+  tbZdqtYpSelectPage(promes).then((res) => {
+    pageData.tableData = res.records.map(item => {
+      return {
+        ...item,
+        fj: item.fj ? JSON.parse(item.fj) : []
+      }
+    })
+  }).catch((err) => {
+  });
+}
+// 新增
+const gettbZdqtYpAdd = (val) => {
+  const params = {
+    qtid: listData.value.id,
+    ypnr: val.ypnr,
+    fj: val.fileList.length > 0 ? JSON.stringify(val.fileList) : ''
+  }
+  tbZdqtYpAdd(params).then(res => {
+    gettbZdqtYpSelectPage()
+    proxy.$message({
+      message: '新增成功',
+      type: 'success',
+    })
+  })
+}
+// 删除
+const deletbZdqtYpDelete = (id) => {
+  tbZdqtYpDelete({
+    ids: [id]
+  }).then(res => {
+    gettbZdqtYpSelectPage()
+    proxy.$message({
+      message: '删除成功',
+      type: 'success',
+    })
+  })
+}
+// 修改
+const amendantRecord = (val) => {
+  tbZdqtYpUpdate(val).then(res => {
+    gettbZdqtYpSelectPage()
+    proxy.$message({
+      message: '修改成功',
+      type: 'success',
+    })
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
+
+.backinfo-container {
+  padding: 10px;
+}
+
+.left_box {
+  width: 200px;
+  border: 1px solid #c8c8c89a;
+  border-radius: 5px;
+  padding: 5px;
+}
+
+.right_box {
+  width: calc(100% - 230px);
+  overflow-y: auto;
+  padding: 5px;
+}
+
+::v-deep .el-form-item__content {
+  display: block !important;
+}
+
+.headClass {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin: 0 0 10px 0;
+  padding-bottom: 10px;
+  border-bottom: 2px solid #409eff;
+  position: relative;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.headClass::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  bottom: -2px;
+  width: 60px;
+  height: 2px;
+  background-color: #409eff;
+}
+
+h3 {
+  margin: 0;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/model/personnel.vue

@@ -0,0 +1,212 @@
+<template>
+  <div>
+    <div class="headClass" style="">
+      <h3>群体成员</h3>
+      <el-button type="primary"  :disabled="disabled"  @click="openDialog">选择</el-button>
+    </div>
+    <MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
+      :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
+      <template #ryzp="{ row }">
+        <el-image style="width: 100px; height: 100px" :src="`/mosty-base/minio/file/download/${row.ryzp}`"
+          fit="cover" />
+      </template>
+      <template #zdrYjdj="{ row }">
+        <DictTag :tag="false" :value="row.zdrYjdj" :options="D_GS_ZDR_YJDJ" />
+      </template>
+      <template #zdrZt="{ row }">
+        <DictTag :tag="false" :value="row.zdrZt" :options="D_GS_ZDR_CZZT" />
+      </template>
+      <!-- 操作 -->
+      <template #controls="{ row }">
+        <el-link type="danger" @click="delDictItem(row.id)">删除</el-link>
+      </template>
+    </MyTable>
+  </div>
+  <GroupStaff v-model="showDialog" @choosed="addMarks" :roleIds="roleIds" />
+</template>
+
+<script setup>
+import { ref, reactive, getCurrentInstance, watch } from "vue";
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import GroupStaff from '../component/groupStaff.vue'
+import { tbGsxtZdqtUpdate } from '@/api/qt.js'
+import { ElMessageBox } from "element-plus";
+const { proxy } = getCurrentInstance();
+const { D_GS_ZDR_YJDJ, D_GS_ZDR_CZZT } = proxy.$dict("D_GS_ZDR_YJDJ", "D_GS_ZDR_CZZT");
+const props = defineProps({
+  dataList: {
+    type: Object,
+    default: () => { },
+  }, disabled: {
+    type: Boolean,
+    default: false
+  },
+  showBut: {
+    type: Boolean,
+    default: false
+  },
+})
+const pageData = reactive({
+  tableData: [],
+  tableColumn: [{
+    prop: 'ryzp',
+    label: '照片',
+    showSolt: true,
+  }, {
+    prop: 'ryXm',
+    label: '姓名',
+  }, {
+    prop: 'rySfzh',
+    label: '身份证号',
+  }, {
+    prop: 'ywlb',
+    label: '业务类别',
+  }, {
+    prop: 'zdrYjdj',
+    label: '管控级别',
+    showSolt: true,
+  }, {
+    prop: 'zdrZt',
+    label: '布控情况',
+    showSolt: true,
+  }],
+  tableHeight: '400px',
+  keyCount: 0,
+  tableConfiger: {
+    border: true,
+    stripe: true,
+    showHeader: true,
+    showIndex: true,
+    indexLabel: '序号',
+    indexWidth: 60,
+    align: 'center',
+    showOverflowTooltip: true,
+  },
+  controlsWidth: 120,
+
+})
+const listData = ref({})
+const showDialog = ref(false)
+const roleIds = ref([])
+watch(() => props.dataList, (val) => {
+  if (val) {
+    listData.value = val
+    pageData.tableData = val.zdryList
+  }
+}, { deep: true })
+const openDialog = () => {
+  showDialog.value = true
+}
+const addMarks = (val) => {
+  pageData.tableData = val
+  roleIds.value = val.map(item => item.id)
+  if (!props.disabled && props.showBut) {
+    gettbGsxtZdqtUpdate(pageData.tableData)
+  }
+}
+// 删除
+const delDictItem = (val) => {
+  if (!props.disabled && props.showBut) {
+    ElMessageBox.confirm(
+      '是否删除性质标签',
+      '提示',
+      {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning',
+      }
+    )
+      .then(() => {
+        if (!props.disabled && props.showBut) {
+          gettbGsxtZdqtUpdate(pageData.tableData)
+          pageData.tableData = pageData.tableData.filter(item => item.id != val)
+          roleIds.value = roleIds.value.filter(item => item != val)
+        }
+      })
+      .catch(() => {
+        proxy.$message({
+          message: '删除失败',
+          type: 'info',
+        })
+      })
+
+  } else {
+    pageData.tableData = pageData.tableData.filter(item => item.id != val)
+    roleIds.value = roleIds.value.filter(item => item != val)
+  }
+}
+// 修改
+const gettbGsxtZdqtUpdate = (val) => {
+  const promes = {
+    id: listData.value.id,
+    zdryList: val
+  }
+  tbGsxtZdqtUpdate(promes).then((res) => {
+    proxy.$message({
+      message: '更新成功',
+      type: 'success',
+    })
+  }).catch((err) => {
+
+  });
+}
+const throwData = () => {
+  return pageData.tableData
+}
+defineExpose({
+  throwData
+})
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
+
+.backinfo-container {
+  padding: 10px;
+}
+
+.left_box {
+  width: 200px;
+  border: 1px solid #c8c8c89a;
+  border-radius: 5px;
+  padding: 5px;
+}
+
+.right_box {
+  width: calc(100% - 230px);
+  overflow-y: auto;
+  padding: 5px;
+}
+
+::v-deep .el-form-item__content {
+  display: block !important;
+}
+
+.headClass {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin: 0 0 10px 0;
+  padding-bottom: 10px;
+  border-bottom: 2px solid #409eff;
+  position: relative;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.headClass::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  bottom: -2px;
+  width: 60px;
+  height: 2px;
+  background-color: #409eff;
+}
+
+h3 {
+  margin: 0;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/model/portrayal.vue

@@ -0,0 +1,317 @@
+<template>
+
+  <div class="backinfo-container">
+    <div class="headClass" style="">
+      <h3>群体成员画像</h3>
+    </div>
+    <div style="display: flex;">
+      <div  style="width: 50%;"><PieChart :chartData="ywlbtj" title="业务类型"/></div>
+      <div style="width: 50%;"><BarChart :chartData="gkjbtj" title="管控级别分布"/></div>
+
+    </div>
+    <div style="display: flex;">
+      <div style="width: 50%;"><PieChart :chartData="qytj" title="区域分布"/></div>
+      <div  style="width: 50%;"><BarChart :chartData="zyfbtj" title="管控级别分布"/></div>
+
+
+    </div>
+    <div  style="display: flex;">
+      <div style="width: 50%;"><LineChart :chartData="nlfbtj" title="年龄分布"/></div>
+      <div style="width: 50%;"><PieChart :chartData="whcdtj" title="文化程度分布"/></div></div>
+  </div>
+</template>
+
+<script setup>
+import { ref ,watch} from "vue";
+import { zdryGkjbtj ,zdryYwlbtj,zdryQytj,zdryNldtj,zdryZclbtj,zdryWhcdtj,tbGsxtZdqtSave} from '@/api/qt.js'
+import BarChart from "../component/BarChart.vue"
+import PieChart from "../component/PieChart.vue"
+import LineChart from "../component/LineChart.vue"
+const props = defineProps({
+  dataList: {
+    type: Object,
+    default: () => { },
+  }, disabled: {
+    type: Boolean,
+    default: false
+  },
+  showBut: {
+    type: Boolean,
+    default: false
+  },
+})
+const listData=ref()
+watch(()=>props.dataList,(val)=>{
+  if (val) {
+    listData.value = val
+    funAll()
+  }
+}, { deep: true })
+const ywlbtj=ref()
+const gkjbtj = ref({
+  xAxisData: [],
+  seriesData:[]
+})
+const qytj = ref()
+const zyfbtj = ref({
+  xAxisData: [],
+  seriesData:[]
+})
+const nlfbtj = ref({
+  xAxisData: [],
+  seriesData:[]
+})
+const whcdtj=ref()
+const funAll = () => {
+  const params = {
+    qtid: listData.value.id
+  }
+  getzdryYwlbtj(params)
+  getzdryGkjbtj(params)
+  getzdryQytj(params)
+  getzdryZclbtj(params)
+  getzdryNldtj(params)
+  getzdryWhcdtj(params)
+}
+// 业务类型
+const getzdryYwlbtj = (val) => {
+  zdryYwlbtj(val).then((res) => {
+    ywlbtj.value = {
+      seriesData: res.map(item => {
+      return {
+        name: item.mc,
+        value: item.sl
+      }
+    })
+    }
+  }).catch((err) => {
+
+  });
+}
+// 管控级别分布
+const getzdryGkjbtj = (val) => {
+  zdryGkjbtj(val).then(res => {
+    gkjbtj.value.xAxisData=res.map(item=>item.mc)
+    gkjbtj.value.seriesData = [{
+      name: '管控级别',
+      data: res.map(item => item.sl),
+      color: '#409EFF'
+    }]
+  })
+}
+// 区域分布
+const getzdryQytj = (val) => {
+  zdryQytj(val).then(res => {
+    qytj.value = {
+      seriesData: res.map(item => {
+        return {
+          name: item.ssbm,
+          value: item.number
+        }
+      })
+    }
+  })
+}
+// 职业分布
+const getzdryZclbtj = (val) => {
+  zdryZclbtj(val).then(res => {
+    zyfbtj.value.xAxisData = res.map(item => item.mc)
+    zyfbtj.value.seriesData = [{
+      name: '职业分布',
+      data: res.map(item => item.sl),
+      color: '#409EFF'
+    }]
+  })
+}
+// 年龄分布
+const getzdryNldtj = (val) => {
+  zdryNldtj(val).then(res => {
+    console.log(res);
+    nlfbtj.value.xAxisData = res.map(item => item.mc)
+    nlfbtj.value.seriesData = [{
+      name: '年龄分布',
+      data: res.map(item => item.sl),
+      color: '#409EFF'
+    }]
+  })
+}
+// 文化程度统计
+const getzdryWhcdtj = (val) => {
+  zdryWhcdtj(val).then(res => {
+    whcdtj.value = {
+      seriesData: res.map(item => {
+        return {
+          name: item.mc,
+          value: item.sl
+        }
+      })
+    }
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
+
+.backinfo-container {
+  padding: 10px;
+}
+
+.background-info-input {
+  width: 100%;
+  margin-bottom: 15px;
+}
+
+.file-attachment-section {
+  margin-top: 15px;
+}
+
+.section-title {
+  font-size: 14px;
+  font-weight: 500;
+  color: #303133;
+  margin-bottom: 10px;
+  padding-bottom: 5px;
+  border-bottom: 1px solid #ebeef5;
+}
+
+.file-list-container {
+  max-height: 100px;
+  overflow-y: auto;
+  border: 1px solid #ebeef5;
+  border-radius: 4px;
+  background-color: #ffffff;
+  margin-bottom: 10px;
+}
+
+/* 自定义滚动条样式 */
+.file-list-container::-webkit-scrollbar {
+  width: 6px;
+}
+
+.file-list-container::-webkit-scrollbar-track {
+  background: #f1f1f1;
+  border-radius: 3px;
+}
+
+.file-list-container::-webkit-scrollbar-thumb {
+  background: #c0c4cc;
+  border-radius: 3px;
+}
+
+.file-list-container::-webkit-scrollbar-thumb:hover {
+  background: #909399;
+}
+
+.empty-file-list {
+  padding: 20px;
+  text-align: center;
+  color: #909399;
+  font-size: 12px;
+}
+
+.file-list {
+  padding: 5px;
+}
+
+.file-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 10px;
+  margin-bottom: 2px;
+  background-color: #f8f9fa;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+  cursor: pointer;
+}
+
+.file-item:hover {
+  background-color: #e6f7ff;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+}
+
+.file-info {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  gap: 15px;
+  min-width: 0;
+}
+
+.file-name {
+  flex: 1;
+  font-size: 12px;
+  color: #303133;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.file-size {
+  font-size: 11px;
+  color: #909399;
+  min-width: 60px;
+}
+
+.file-time {
+  font-size: 11px;
+  color: #909399;
+}
+
+.file-actions {
+  display: flex;
+  align-items: center;
+  gap: 5px;
+  margin-left: 10px;
+}
+
+.file-actions .el-button {
+  padding: 0 5px;
+  margin: 0;
+  color: #606266;
+  transition: color 0.3s ease;
+}
+
+.file-actions .el-button:hover {
+  color: #409eff;
+}
+
+.delete-btn:hover {
+  color: #f56c6c !important;
+}
+
+.upload-btn-container {
+  display: flex;
+  justify-content: center;
+  margin-top: 10px;
+}
+
+.headClass {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin: 0 0 10px 0;
+  padding-bottom: 10px;
+  border-bottom: 2px solid #409eff;
+  position: relative;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.headClass::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  bottom: -2px;
+  width: 60px;
+  height: 2px;
+  background-color: #409eff;
+}
+
+h3 {
+  margin: 0;
+}
+</style>

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/model/requestInfo.vue

@@ -0,0 +1,472 @@
+<template>
+
+  <div class="backinfo-container">
+    <div class="headClass" style="">
+      <h3>诉求信息</h3>
+      <el-button type="primary" :disabled="disabled" @click="openAppel">选择</el-button>
+    </div>
+    <MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
+      :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
+      <!-- 操作 -->
+      <template #controls="{ row }">
+        <el-link type="danger" @click="amend(row)">修改</el-link>
+        <el-link type="danger" @click="delDictItem(row.id)">删除</el-link>
+      </template>
+    </MyTable>
+    <!-- 文件列表区域 -->
+    <div class="file-attachment-section">
+      <div class="section-title">相关附件</div>
+      <div class="file-list-container">
+        <div v-if="fileList.length === 0" class="empty-file-list">暂无附件</div>
+        <div v-else class="file-list">
+          <div v-for="(file, index) in fileList" :key="index" class="file-item">
+            <div class="file-info">
+              <span class="file-name">{{ file.originalName }}</span>
+              <span class="file-time">{{ file.uploadTime }}</span>
+            </div>
+            <div class="file-actions">
+              <el-button type="text" size="small" @click="downloadFile(file)" title="下载文件">
+                <el-icon>
+                  <Download />
+                </el-icon>
+              </el-button>
+              <el-button type="text" size="small" @click="deleteFile(index)" title="删除文件" class="delete-btn">
+                <el-icon>
+                  <Delete />
+                </el-icon>
+              </el-button>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 上传按钮区域 -->
+      <div class="upload-btn-container">
+        <el-upload v-model:file-list="fileList" class="upload-demo" :show-file-list="false" multiple
+          :http-request="handleUploadRequest" :on-remove="handleRemove" :limit="3" :on-exceed="handleExceed">
+          <el-button type="primary" :disabled="disabled">上传文件</el-button>
+        </el-upload>
+      </div>
+    </div>
+  </div>
+  <Appeal v-model="appelShow" @comfirm="onComfirm" :data="dataAmend" />
+
+</template>
+
+<script setup>
+import { ref, reactive, watch, getCurrentInstance } from "vue";
+import { ElMessage } from 'element-plus';
+import { Delete, Download } from '@element-plus/icons';
+import { tbZdqtSqAdd, tbZdqtSqSelectPage, tbZdqtSqDelete, tbZdqtSqUpdate, tbGsxtZdqtUpdate } from '@/api/qt'
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import { ElMessageBox } from "element-plus";
+import { uploadMultipleFiles } from './fileUp'
+import Appeal from '../component/appeal.vue'
+const { proxy } = getCurrentInstance()
+const props = defineProps({
+  dataList: {
+    type: Object,
+    default: () => { },
+  }, disabled: {
+    type: Boolean,
+    default: false
+  },
+  showBut: {
+    type: Boolean,
+    default: false
+  },
+})
+const amendAdd = ref(true)
+const appelShow = ref(false)
+const listData = ref({})
+const dataAmend = ref()
+const pageData = reactive({
+  tableData: [],
+  tableColumn: [{
+    prop: 'sqnr',
+    label: '诉求',
+  }],
+  tableHeight: '300px',
+  keyCount: 0,
+  tableConfiger: {
+    border: true,
+    stripe: true,
+    showHeader: true,
+    showIndex: true,
+    indexLabel: '序号',
+    indexWidth: 60,
+    align: 'center',
+    showOverflowTooltip: true,
+  },
+  controlsWidth: 120,
+
+})
+// 打开弹窗
+const openAppel = () => {
+  appelShow.value = true
+  amendAdd.value = true
+}
+
+// 修改方法
+const amend = (val) => {
+  amendAdd.value = false
+  appelShow.value = true
+  dataAmend.value = val
+}
+// 监听数据
+watch(() => props.dataList, (val) => {
+  if (val) {
+    listData.value = val
+    fileList.value = val.sqfj ? JSON.parse(val.sqfj) : []
+    gettbZdqtSqSelectPage()
+  }
+}, { deep: true })
+// 新增修改
+const onComfirm = (val) => {
+  if (!props.disabled && props.showBut) {
+    let promes = {
+      qtid: listData.value.id,
+      sqnr: val.sqnr,
+    }
+    if (amendAdd.value) {
+      tbZdqtSqAdd(promes).then(() => {
+        gettbZdqtSqSelectPage()
+        proxy.$message({
+          message: '添加成功',
+          type: 'success',
+        })
+      })
+    } else {
+      promes.id = val.id
+      tbZdqtSqUpdate(promes).then(() => {
+        gettbZdqtSqSelectPage()
+        proxy.$message({
+          message: '修改成功',
+          type: 'success',
+        })
+      })
+    }
+  } else {
+    if (amendAdd.value) {
+      pageData.tableData.push(val)
+    } else {
+      let index = pageData.tableData.findIndex(item => item.id === val.id)
+      pageData.tableData[index] = val
+    }
+  }
+}
+// 删除
+const delDictItem = (val) => {
+  if (!props.disabled && props.showBut) {
+    ElMessageBox.confirm(
+      '是否删除诉求信息',
+      '提示',
+      {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning',
+      }
+    )
+      .then(() => {
+        tbZdqtSqDelete({ ids: [val] }).then(() => {
+          proxy.$message({
+            message: '删除成功',
+            type: 'success',
+          })
+        })
+        gettbZdqtSqSelectPage()
+      })
+      .catch(() => {
+        proxy.$message({
+          message: '删除失败',
+          type: 'info',
+        })
+      })
+  } else {
+    pageData.tableData = pageData.tableData.filter(item => item.id !== val)
+  }
+}
+// 查询接口
+const gettbZdqtSqSelectPage = () => {
+  console.log("xxxxxx");
+
+  const promes = {
+    pageCurrent: 1,
+    pageSize: 1000,
+    qtid: listData.value.id
+  }
+  tbZdqtSqSelectPage(promes).then((res) => {
+    pageData.tableData = res.records
+    console.log(res);
+
+  })
+}
+// 修改接口
+const puttbGsxtZdqtUpdate = (str) => {
+
+  const promes = {
+    id: listData.value.id,
+    sqfj: fileList.value.length > 0 ? JSON.stringify(fileList.value) : '',
+  }
+  if (listData.value.id) {
+    tbGsxtZdqtUpdate(promes).then(() => {
+      if (!str) {
+        proxy.$message({
+          message: '删除成功',
+          type: 'success',
+        })
+      }
+
+    })
+  }
+
+
+
+}
+// 文件列表数据
+const fileList = ref([])
+// 正在上传的文件数量
+const uploadingCount = ref(0)
+// 下载文件
+const downloadFile = (file) => {
+  // 实际项目中，这里应该调用下载API
+  console.log('下载文件:', file.name)
+  // 示例：window.open(file.url)
+}
+// 删除文件
+const deleteFile = (index) => {
+  // 实际项目中，这里应该先调用删除API，成功后再从列表中移除
+  fileList.value.splice(index, 1)
+  if (listData.value.id) {
+    puttbGsxtZdqtUpdate()
+  }
+}
+// 检查是否所有文件都已上传完成
+const checkAllFilesUploaded = () => {
+  // 如果没有正在上传的文件，且文件列表不为空，则执行更新
+  if (uploadingCount.value === 0 && fileList.value.length > 0) {
+    puttbGsxtZdqtUpdate('修改成功');
+  }
+}
+
+// 上传相关方法
+const handleUploadRequest = async (options) => {
+  // 增加正在上传的文件计数
+  uploadingCount.value++;
+  try {
+    // 调用uploadMultipleFiles进行文件上传
+    const result = await uploadMultipleFiles(options.file, {
+      uploadedFiles: fileList.value,
+      fjIds: [], // 如果需要保存文件ID列表，可以在这里传递
+      compressImage: null // 可选的图片压缩函数
+    });
+    // 更新文件列表，添加上传时间信息
+    const index = fileList.value.findIndex(f => f.originalName === options.file.name);
+    if (index !== -1) {
+      fileList.value[index].uploadTime = new Date().toLocaleString('zh-CN');
+    }
+    // 调用成功回调
+    if (options.onSuccess) {
+      options.onSuccess(result);
+    }
+  } catch (error) {
+    console.error('文件上传失败:', error);
+    // 调用失败回调
+    if (options.onError) {
+      options.onError(error);
+    }
+  } finally {
+    // 减少正在上传的文件计数
+    uploadingCount.value--;
+    // 检查是否所有文件都已上传完成
+    checkAllFilesUploaded();
+  }
+}
+const handleRemove = (uploadFile, uploadFiles) => {
+  // 实际项目中，这里应该先调用删除API，成功后再从列表中移除
+  const index = fileList.value.findIndex(f => f.name === uploadFile.name);
+  if (index !== -1) {
+    fileList.value.splice(index, 1);
+  }
+}
+
+const handleExceed = (files, uploadFiles) => {
+  ElMessage.warning(`最多只能上传 3 个文件`);
+}
+// 抛出数据
+const throwData = () => {
+  return { sqlist: pageData.tableData, fileList: fileList.value }
+}
+defineExpose({
+  throwData
+})
+
+
+
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
+
+.backinfo-container {
+  padding: 10px;
+}
+
+.background-info-input {
+  width: 100%;
+  margin-bottom: 15px;
+}
+
+.file-attachment-section {
+  margin-top: 15px;
+}
+
+.section-title {
+  font-size: 14px;
+  font-weight: 500;
+  color: #303133;
+  margin-bottom: 10px;
+  padding-bottom: 5px;
+  border-bottom: 1px solid #ebeef5;
+}
+
+.file-list-container {
+  max-height: 100px;
+  overflow-y: auto;
+  border: 1px solid #ebeef5;
+  border-radius: 4px;
+  background-color: #ffffff;
+  margin-bottom: 10px;
+}
+
+/* 自定义滚动条样式 */
+.file-list-container::-webkit-scrollbar {
+  width: 6px;
+}
+
+.file-list-container::-webkit-scrollbar-track {
+  background: #f1f1f1;
+  border-radius: 3px;
+}
+
+.file-list-container::-webkit-scrollbar-thumb {
+  background: #c0c4cc;
+  border-radius: 3px;
+}
+
+.file-list-container::-webkit-scrollbar-thumb:hover {
+  background: #909399;
+}
+
+.empty-file-list {
+  padding: 20px;
+  text-align: center;
+  color: #909399;
+  font-size: 12px;
+}
+
+.file-list {
+  padding: 5px;
+}
+
+.file-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 10px;
+  margin-bottom: 2px;
+  background-color: #f8f9fa;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+  cursor: pointer;
+}
+
+.file-item:hover {
+  background-color: #e6f7ff;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+}
+
+.file-info {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  gap: 15px;
+  min-width: 0;
+}
+
+.file-name {
+  flex: 1;
+  font-size: 12px;
+  color: #303133;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.file-size {
+  font-size: 11px;
+  color: #909399;
+  min-width: 60px;
+}
+
+.file-time {
+  font-size: 11px;
+  color: #909399;
+}
+
+.file-actions {
+  display: flex;
+  align-items: center;
+  gap: 5px;
+  margin-left: 10px;
+}
+
+.file-actions .el-button {
+  padding: 0 5px;
+  margin: 0;
+  color: #606266;
+  transition: color 0.3s ease;
+}
+
+.file-actions .el-button:hover {
+  color: #409eff;
+}
+
+.delete-btn:hover {
+  color: #f56c6c !important;
+}
+
+.upload-btn-container {
+  display: flex;
+  justify-content: center;
+  margin-top: 10px;
+}
+
+.headClass {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin: 0 0 10px 0;
+  padding-bottom: 10px;
+  border-bottom: 2px solid #409eff;
+  position: relative;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.headClass::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  bottom: -2px;
+  width: 60px;
+  height: 2px;
+  background-color: #409eff;
+}
+
+h3 {
+  margin: 0;
+}
+</style>

src/views/backOfficeSystem/JudgmentHome/tsypHome/components/ypHome.vue

@@ -205,7 +205,7 @@ const funAll = (val) => {
   const data = `为全面、客观、准确掌握全区公安机关的执法状况，自治区公安厅基于数据统计，对全区公安机关${endYears.value}年度的执法状况作了客观分析。`
   textContent.value += BiheadlinegTitle('1.接处警情况') + textStyle(data) + Firstlevelheading('一、执法状况总体分析')
   getfxbgYdfx(val)
-  getfxbgTj()
+  getfxbgTj(val)
   getfxbgJqlxtj(val)
   getfxbgJqlytj(val)
   getfxbgDywdtj(val)

vue.config.js

@@ -4,8 +4,8 @@ function resolve(dir) {
   return path.join(__dirname, dir);
 }
 
-const serverHost = "http://192.168.1.32:8006"//波哥
+// const serverHost = "http://192.168.1.32:8006"//波哥
-// const serverHost = "http://192.168.0.231:8006"//线上
+const serverHost = "http://192.168.0.231:8006"//线上
 // const serverHost = "http://192.168.1.117:8006"//周
 // const serverHost = "http://192.168.1.98:8006"//毛毛