diff --git a/src/views/dataBoard/renfang/index.vue b/src/views/dataBoard/renfang/index.vue
index a3db2e175..88f1dac24 100644
--- a/src/views/dataBoard/renfang/index.vue
+++ b/src/views/dataBoard/renfang/index.vue
@@ -104,7 +104,7 @@
                 </div>
               </div>
             </div>
-            <div class="item">
+            <div class="item" @click="jumpPath('normal', 'aged', '特殊人群')">
               <div class="item-info">
                 <div>
                   <img
diff --git a/src/views/dataBoard/renfang/resi/classNew.vue b/src/views/dataBoard/renfang/resi/classNew.vue
index 07c0088e5..6fb0639db 100644
--- a/src/views/dataBoard/renfang/resi/classNew.vue
+++ b/src/views/dataBoard/renfang/resi/classNew.vue
@@ -42,6 +42,21 @@
             :value="item.value"
           ></el-option>
         </el-select>
+        &nbsp;
+        <el-select
+          @change="changeSearch"
+          v-model="searchParams.serviceType"
+          :popper-append-to-body="false"
+          :clearable="true"
+          placeholder="请选择服务类型"
+        >
+          <el-option
+            v-for="item in serviceList"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          ></el-option>
+        </el-select>
       </div>
       <div class="second-select" v-if="type == 'dibao'">
         <el-select
@@ -73,6 +88,22 @@
             :value="item.value"
           ></el-option>
         </el-select>
+
+        &nbsp;
+        <el-select
+          @change="changeSearch"
+          v-model="searchParams.serviceType"
+          :popper-append-to-body="false"
+          :clearable="true"
+          placeholder="请选择服务类型"
+        >
+          <el-option
+            v-for="item in serviceList"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          ></el-option>
+        </el-select>
       </div>
       <div class="second-select" v-if="type == 'zhiyuanzhe'">
         <el-select
@@ -104,6 +135,22 @@
             :value="item.value"
           ></el-option>
         </el-select>
+
+        &nbsp;
+        <el-select
+          @change="changeSearch"
+          v-model="searchParams.serviceType"
+          :popper-append-to-body="false"
+          :clearable="true"
+          placeholder="请选择服务类型"
+        >
+          <el-option
+            v-for="item in serviceList"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          ></el-option>
+        </el-select>
       </div>
       <div class="second-select" v-if="type == 'dangyuan'">
         <el-select
@@ -135,6 +182,22 @@
             :value="item.value"
           ></el-option>
         </el-select>
+
+        &nbsp;
+        <el-select
+          @change="changeSearch"
+          v-model="searchParams.serviceType"
+          :popper-append-to-body="false"
+          :clearable="true"
+          placeholder="请选择服务类型"
+        >
+          <el-option
+            v-for="item in serviceList"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          ></el-option>
+        </el-select>
       </div>
       <div class="second-select" v-if="type == 'shiye'">
         <el-select
@@ -181,6 +244,38 @@
             :value="item.value"
           ></el-option>
         </el-select>
+
+        &nbsp;
+        <el-select
+          @change="changeSearch"
+          v-model="searchParams.serviceType"
+          :popper-append-to-body="false"
+          :clearable="true"
+          placeholder="请选择服务类型"
+        >
+          <el-option
+            v-for="item in serviceList"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          ></el-option>
+        </el-select>
+      </div>
+      <div class="second-select" v-if="type == 'special'">
+        <el-select
+          @change="changeSearch"
+          v-model="searchParams.serviceType"
+          :popper-append-to-body="false"
+          :clearable="true"
+          placeholder="请选择服务类型"
+        >
+          <el-option
+            v-for="item in serviceList"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          ></el-option>
+        </el-select>
       </div>
       <div
         class="second-select"
@@ -353,6 +448,28 @@ export default {
           value: ["80", "200"],
         },
       ],
+      serviceList: [
+        {
+          label: "政策找人",
+          value: "policy",
+        },
+        {
+          label: "服务找人",
+          value: "service",
+        },
+        {
+          label: "温暖找人",
+          value: "warm",
+        },
+        {
+          label: "技能找人",
+          value: "skill",
+        },
+        {
+          label: "岗位找人",
+          value: "position",
+        },
+      ],
       colList: [
         {
           align: "left",
@@ -424,6 +541,11 @@ export default {
           name: "党员",
           url: "/actual/base/peopleRoomOverview/partyPageList",
         },
+        {
+          type: "special",
+          name: "特殊人群",
+          url: "/actual/base/peopleRoomOverview/specialPageList",
+        },
         {
           type: "shiye",
           name: "失业人员",
@@ -505,6 +627,19 @@ export default {
           };
         }, 200);
       }
+
+      if (query.serv_type) {
+        setTimeout(() => {
+          const olds = this.serviceList.filter(
+            (item) => query.serv_type == item.label
+          )[0];
+
+          this.oldValsss = null;
+          this.searchParams = {
+            serviceType: olds.value,
+          };
+        }, 200);
+      }
     }
     if (type == "dibao") {
       if (query.lowIncomeType) {
@@ -531,6 +666,18 @@ export default {
           };
         }, 200);
       }
+      if (query.serv_type) {
+        setTimeout(() => {
+          const olds = this.serviceList.filter(
+            (item) => query.serv_type == item.label
+          )[0];
+
+          this.oldValsss = null;
+          this.searchParams = {
+            serviceType: olds.value,
+          };
+        }, 200);
+      }
     }
     if (type == "shiye") {
       if (query.olds) {
@@ -585,6 +732,18 @@ export default {
           this.oldValsss = null;
         }, 200);
       }
+      if (query.serv_type) {
+        setTimeout(() => {
+          const olds = this.serviceList.filter(
+            (item) => query.serv_type == item.label
+          )[0];
+
+          this.oldValsss = null;
+          this.searchParams = {
+            serviceType: olds.value,
+          };
+        }, 200);
+      }
     }
     if (type == "dangyuan") {
       if (query.olds) {
@@ -607,6 +766,32 @@ export default {
           this.oldValsss = null;
         }, 200);
       }
+      if (query.serv_type) {
+        setTimeout(() => {
+          const olds = this.serviceList.filter(
+            (item) => query.serv_type == item.label
+          )[0];
+
+          this.oldValsss = null;
+          this.searchParams = {
+            serviceType: olds.value,
+          };
+        }, 200);
+      }
+    }
+    if (type == "special") {
+      if (query.serv_type) {
+        setTimeout(() => {
+          const olds = this.serviceList.filter(
+            (item) => query.serv_type == item.label
+          )[0];
+
+          this.oldValsss = null;
+          this.searchParams = {
+            serviceType: olds.value,
+          };
+        }, 200);
+      }
     }
     if (type == "zhiyuanzhe") {
       if (query.olds) {
@@ -632,6 +817,18 @@ export default {
           };
         }, 200);
       }
+      if (query.serv_type) {
+        setTimeout(() => {
+          const olds = this.serviceList.filter(
+            (item) => query.serv_type == item.label
+          )[0];
+
+          this.oldValsss = null;
+          this.searchParams = {
+            serviceType: olds.value,
+          };
+        }, 200);
+      }
     }
     if (
       type == "fuwu" ||
diff --git a/src/views/dataBoard/renfang/visualizing/components/dangyuan.vue b/src/views/dataBoard/renfang/visualizing/components/dangyuan.vue
index 8ed932df3..d82174a95 100644
--- a/src/views/dataBoard/renfang/visualizing/components/dangyuan.vue
+++ b/src/views/dataBoard/renfang/visualizing/components/dangyuan.vue
@@ -1,18 +1,24 @@
 <template>
   <div>
     <div class="visualizing laonianren">
-      <div class="visualizing-left">
+      <div class="visualizing-item">
         <div>
           <data-title title="党员年龄统计" />
         </div>
         <div id="dyLeftChart" style="height: 400px"></div>
       </div>
-      <div class="visualizing-right">
+      <div class="visualizing-item">
         <div>
           <data-title title="党员文化程度统计" />
         </div>
         <div id="dyRightChart" style="height: 400px"></div>
       </div>
+      <div class="visualizing-item">
+        <div>
+          <data-title title="党员享受服务情况统计" />
+        </div>
+        <div id="resiServiceChart" style="height: 400px"></div>
+      </div>
     </div>
   </div>
 </template>
@@ -48,6 +54,7 @@ export default {
     return {
       dyLeft: [],
       dyRight: [],
+      resiService: [],
     };
   },
   created() {
@@ -77,6 +84,17 @@ export default {
           this.initRightCharts();
         })
         .catch(() => {});
+
+        this.$http
+        .get("/actual/base/peopleRoomOverview/findPeoplePie/PARTY_FLAG")
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          }
+          this.resiService = dataFormatter(res.data);
+          this.initResiServiceCharts();
+        })
+        .catch(() => {});
     },
     initLeftCharts() {
       let div = document.getElementById("dyLeftChart");
@@ -311,6 +329,124 @@ export default {
       this.myChart2.setOption(option);
       window.addEventListener("resize", () => this.myChart2.resize());
     },
+
+    initResiServiceCharts() {
+      let div = document.getElementById("resiServiceChart");
+      this.myChart3 = echarts.init(div);
+      const option = {
+        color: [
+          "#15a7ed",
+          "#22b998",
+          "#5f6ff4",
+          "#a66eeb",
+          "#faa834",
+          "#fd6200",
+          "#fb3905",
+        ],
+        legend: {
+          orient: "vertical",
+          top: 20,
+          left: 10,
+          icon: "rect",
+          itemHeight: 14,
+          itemWidth: 14,
+          textStyle: {
+            color: "#ffffff",
+            rich: {
+              name: {
+                width: 90,
+                fontSize: 12,
+                color: "#dddee7",
+              },
+              value: {
+                width: 30,
+                align: "right",
+                fontSize: 18,
+              },
+            },
+          },
+          data: this.resiService,
+          formatter: (name) => {
+            if (this.resiService.length) {
+              const item = this.resiService.filter((item) => item.name === name)[0];
+              return `{name|${name}}{value| ${item.value}}`;
+            }
+          },
+        },
+        toolbox: {
+          show: false,
+          feature: {
+            mark: { show: true },
+            dataView: { show: true, readOnly: false },
+            restore: { show: true },
+            saveAsImage: { show: true },
+          },
+        },
+        title: {
+          show: !this.resiService || this.resiService.length == 0, // 是否要展示“暂无数据”矢量图
+          text: " {a|}", // 写入占位符a，以便后续填充内容
+          x: "center",
+          y: "center",
+          subtext: "暂无数据", // 子标题
+          itemGap: -10, // 设置主副标题间隔
+          textStyle: {
+            rich: {
+              a: {
+                height: 128, // 设置图片高度
+                width: 268, // 设置图片宽度
+                backgroundColor: {
+                  // 引入图片，作为背景图，填写相对路径
+                  image: require("@/assets/images/overview/zanwu.png"),
+                },
+              },
+            },
+          },
+          subtextStyle: {
+            // 配置副标题的文字样式
+            fontSize: 12,
+            color: "#ffffff",
+          },
+        },
+        series: [
+          {
+            type: "pie",
+            radius:
+              this.resiService && this.resiService.length > 0 ? [30, 130] : [0, 0],
+            center: ["50%", "50%"],
+            roseType: "area",
+            itemStyle: {
+              borderRadius: 0,
+            },
+            top: 20,
+            left: -40,
+            label: {
+              position: "inside",
+              formatter: "{d}%",
+              textStyle: {
+                color: "#ffffff",
+                fontSize: 12,
+              },
+            },
+            data: this.resiService,
+          },
+        ],
+      };
+      this.myChart3.setOption(option);
+      this.myChart3.on("click", (e) => {
+        this.$router.push({
+          path: "/dataBoard/renfang/resi-class-new",
+          query: {
+            org_id: this.org_id,
+            type_id: "aged",
+            type_name: "党员",
+            pageType: "normal",
+            type: "dangyuan",
+            serv_type: e.data.name,
+          },
+        });
+      });
+      window.addEventListener("resize", () => this.myChart3.resize());
+    },
   },
 };
 </script>
diff --git a/src/views/dataBoard/renfang/visualizing/components/dibaorenyuan.vue b/src/views/dataBoard/renfang/visualizing/components/dibaorenyuan.vue
index 8e14787db..963f90ede 100644
--- a/src/views/dataBoard/renfang/visualizing/components/dibaorenyuan.vue
+++ b/src/views/dataBoard/renfang/visualizing/components/dibaorenyuan.vue
@@ -1,18 +1,24 @@
 <template>
   <div class="dibaorenyuan">
     <div class="visualizing">
-      <div class="visualizing-left">
+      <div class="visualizing-item">
         <div>
           <data-title title="低保类别统计" />
         </div>
         <div id="dbryChart1" style="height: 380px"></div>
       </div>
-      <div class="visualizing-right">
+      <div class="visualizing-item">
         <div>
           <data-title title="低保显示原因统计" />
         </div>
         <div id="dbryChart2" style="height: 380px"></div>
       </div>
+      <div class="visualizing-item">
+        <div>
+          <data-title title="低保享受服务情况统计" />
+        </div>
+        <div id="resiServiceChart" style="height: 400px"></div>
+      </div>
     </div>
     <div class="visualizing">
       <div class="visualizing-left">
@@ -64,6 +70,7 @@ export default {
       dbryData2: [],
       dbryData3: [],
       dbryData4: [],
+      resiService: [],
     };
   },
   created() {
@@ -111,6 +118,16 @@ export default {
           this.dbryDataCharts4();
         })
         .catch(() => {});
+      this.$http
+        .get("/actual/base/peopleRoomOverview/findPeoplePie/SUBSISTENCE_ALLOWANCE_FLAG")
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          }
+          this.resiService = dataFormatter(res.data);
+          this.initResiServiceCharts();
+        })
+        .catch(() => {});
     },
     dbryDataCharts1() {
       let div = document.getElementById("dbryChart1");
@@ -629,6 +646,124 @@ export default {
       });
       window.addEventListener("resize", () => this.myChart4.resize());
     },
+
+    initResiServiceCharts() {
+      let div = document.getElementById("resiServiceChart");
+      this.resiChart = echarts.init(div);
+      const option = {
+        color: [
+          "#15a7ed",
+          "#22b998",
+          "#5f6ff4",
+          "#a66eeb",
+          "#faa834",
+          "#fd6200",
+          "#fb3905",
+        ],
+        legend: {
+          orient: "vertical",
+          top: 20,
+          left: 10,
+          icon: "rect",
+          itemHeight: 14,
+          itemWidth: 14,
+          textStyle: {
+            color: "#ffffff",
+            rich: {
+              name: {
+                width: 90,
+                fontSize: 12,
+                color: "#dddee7",
+              },
+              value: {
+                width: 30,
+                align: "right",
+                fontSize: 18,
+              },
+            },
+          },
+          data: this.resiService,
+          formatter: (name) => {
+            if (this.resiService.length) {
+              const item = this.resiService.filter((item) => item.name === name)[0];
+              return `{name|${name}}{value| ${item.value}}`;
+            }
+          },
+        },
+        toolbox: {
+          show: false,
+          feature: {
+            mark: { show: true },
+            dataView: { show: true, readOnly: false },
+            restore: { show: true },
+            saveAsImage: { show: true },
+          },
+        },
+        title: {
+          show: !this.resiService || this.resiService.length == 0, // 是否要展示“暂无数据”矢量图
+          text: " {a|}", // 写入占位符a，以便后续填充内容
+          x: "center",
+          y: "center",
+          subtext: "暂无数据", // 子标题
+          itemGap: -10, // 设置主副标题间隔
+          textStyle: {
+            rich: {
+              a: {
+                height: 128, // 设置图片高度
+                width: 268, // 设置图片宽度
+                backgroundColor: {
+                  // 引入图片，作为背景图，填写相对路径
+                  image: require("@/assets/images/overview/zanwu.png"),
+                },
+              },
+            },
+          },
+          subtextStyle: {
+            // 配置副标题的文字样式
+            fontSize: 12,
+            color: "#ffffff",
+          },
+        },
+        series: [
+          {
+            type: "pie",
+            radius:
+              this.resiService && this.resiService.length > 0 ? [30, 130] : [0, 0],
+            center: ["50%", "50%"],
+            roseType: "area",
+            itemStyle: {
+              borderRadius: 0,
+            },
+            top: 20,
+            left: -40,
+            label: {
+              position: "inside",
+              formatter: "{d}%",
+              textStyle: {
+                color: "#ffffff",
+                fontSize: 12,
+              },
+            },
+            data: this.resiService,
+          },
+        ],
+      };
+      this.resiChart.setOption(option);
+      this.resiChart.on("click", (e) => {
+        this.$router.push({
+          path: "/dataBoard/renfang/resi-class-new",
+          query: {
+            org_id: this.org_id,
+            type_id: "mlsp",
+            type_name: "低保人员",
+            pageType: "normal",
+            type: "dibao",
+            serv_type: e.data.name,
+          },
+        });
+      });
+      window.addEventListener("resize", () => this.resiChart.resize());
+    },
   },
 };
 </script>
diff --git a/src/views/dataBoard/renfang/visualizing/components/laonianren.vue b/src/views/dataBoard/renfang/visualizing/components/laonianren.vue
index 98902ac35..5867db29e 100644
--- a/src/views/dataBoard/renfang/visualizing/components/laonianren.vue
+++ b/src/views/dataBoard/renfang/visualizing/components/laonianren.vue
@@ -1,18 +1,24 @@
 <template>
   <div>
     <div class="visualizing laonianren">
-      <div class="visualizing-left">
+      <div class="visualizing-item">
         <div>
           <data-title title="老年人年龄统计" />
         </div>
         <div id="lnrLeftChart" style="height: 400px"></div>
       </div>
-      <div class="visualizing-right">
+      <div class="visualizing-item">
         <div>
           <data-title title="老年人居住情况统计" />
         </div>
         <div id="lnrRightChart" style="height: 400px"></div>
       </div>
+      <div class="visualizing-item">
+        <div>
+          <data-title title="老年人享受服务情况统计" />
+        </div>
+        <div id="lnrServiceChart" style="height: 400px"></div>
+      </div>
     </div>
   </div>
 </template>
@@ -48,6 +54,7 @@ export default {
     return {
       lnrLeft: [],
       lnrRight: [],
+      lnrService: [],
     };
   },
   created() {
@@ -77,6 +84,16 @@ export default {
           this.initRightCharts();
         })
         .catch(() => {});
+        this.$http
+        .get("/actual/base/peopleRoomOverview/findPeoplePie/OLD_PEOPLE_FLAG")
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          }
+          this.lnrService = dataFormatter(res.data);
+          this.initLnrServiceCharts();
+        })
+        .catch(() => {});
     },
     initLeftCharts() {
       let div = document.getElementById("lnrLeftChart");
@@ -315,6 +332,123 @@ export default {
       this.myChart2.setOption(option);
       window.addEventListener("resize", () => this.myChart2.resize());
     },
+    initLnrServiceCharts() {
+      let div = document.getElementById("lnrServiceChart");
+      this.myChart3 = echarts.init(div);
+      const option = {
+        color: [
+          "#15a7ed",
+          "#22b998",
+          "#5f6ff4",
+          "#a66eeb",
+          "#faa834",
+          "#fd6200",
+          "#fb3905",
+        ],
+        legend: {
+          orient: "vertical",
+          top: 20,
+          left: 10,
+          icon: "rect",
+          itemHeight: 14,
+          itemWidth: 14,
+          textStyle: {
+            color: "#ffffff",
+            rich: {
+              name: {
+                width: 90,
+                fontSize: 12,
+                color: "#dddee7",
+              },
+              value: {
+                width: 30,
+                align: "right",
+                fontSize: 18,
+              },
+            },
+          },
+          data: this.lnrService,
+          formatter: (name) => {
+            if (this.lnrService.length) {
+              const item = this.lnrService.filter((item) => item.name === name)[0];
+              return `{name|${name}}{value| ${item.value}}`;
+            }
+          },
+        },
+        toolbox: {
+          show: false,
+          feature: {
+            mark: { show: true },
+            dataView: { show: true, readOnly: false },
+            restore: { show: true },
+            saveAsImage: { show: true },
+          },
+        },
+        title: {
+          show: !this.lnrService || this.lnrService.length == 0, // 是否要展示“暂无数据”矢量图
+          text: " {a|}", // 写入占位符a，以便后续填充内容
+          x: "center",
+          y: "center",
+          subtext: "暂无数据", // 子标题
+          itemGap: -10, // 设置主副标题间隔
+          textStyle: {
+            rich: {
+              a: {
+                height: 128, // 设置图片高度
+                width: 268, // 设置图片宽度
+                backgroundColor: {
+                  // 引入图片，作为背景图，填写相对路径
+                  image: require("@/assets/images/overview/zanwu.png"),
+                },
+              },
+            },
+          },
+          subtextStyle: {
+            // 配置副标题的文字样式
+            fontSize: 12,
+            color: "#ffffff",
+          },
+        },
+        series: [
+          {
+            type: "pie",
+            radius:
+              this.lnrService && this.lnrService.length > 0 ? [30, 130] : [0, 0],
+            center: ["50%", "50%"],
+            roseType: "area",
+            itemStyle: {
+              borderRadius: 0,
+            },
+            top: 20,
+            left: -40,
+            label: {
+              position: "inside",
+              formatter: "{d}%",
+              textStyle: {
+                color: "#ffffff",
+                fontSize: 12,
+              },
+            },
+            data: this.lnrService,
+          },
+        ],
+      };
+      this.myChart3.setOption(option);
+      this.myChart3.on("click", (e) => {
+        this.$router.push({
+          path: "/dataBoard/renfang/resi-class-new",
+          query: {
+            org_id: this.org_id,
+            type_id: "aged",
+            type_name: "老年人",
+            pageType: "normal",
+            type: "old",
+            serv_type: e.data.name,
+          },
+        });
+      });
+      window.addEventListener("resize", () => this.myChart3.resize());
+    },
   },
 };
 </script>
diff --git a/src/views/dataBoard/renfang/visualizing/components/shiyerenyuan.vue b/src/views/dataBoard/renfang/visualizing/components/shiyerenyuan.vue
index d6633a692..a269dc361 100644
--- a/src/views/dataBoard/renfang/visualizing/components/shiyerenyuan.vue
+++ b/src/views/dataBoard/renfang/visualizing/components/shiyerenyuan.vue
@@ -21,18 +21,24 @@
       </div>
     </div>
     <div class="visualizing dibaorenyuan">
-      <div class="visualizing-left">
+      <div class="visualizing-item">
         <div>
           <data-title title="技能找人统计" />
         </div>
         <div id="syryChart4" style="height: 380px"></div>
       </div>
-      <div class="visualizing-right">
+      <div class="visualizing-item">
         <div>
           <data-title title="岗位找人统计" />
         </div>
         <div id="syryChart5" style="height: 380px"></div>
       </div>
+      <div class="visualizing-item">
+        <div>
+          <data-title title="失业人员享受服务情况统计" />
+        </div>
+        <div id="resiServiceChart" style="height: 400px"></div>
+      </div>
     </div>
   </div>
 </template>
@@ -71,6 +77,7 @@ export default {
       syryData3: [],
       syryData4: [],
       syryData5: [],
+      resiService: [],
     };
   },
   created() {
@@ -129,6 +136,17 @@ export default {
           this.syryDataCharts5();
         })
         .catch(() => {});
+
+        this.$http
+        .get("/actual/base/peopleRoomOverview/findPeoplePie/UNEMPLOYED_FLAG")
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          }
+          this.resiService = dataFormatter(res.data);
+          this.initResiServiceCharts();
+        })
+        .catch(() => {});
     },
     syryDataCharts1() {
       let div = document.getElementById("syryChart1");
@@ -782,6 +800,123 @@ export default {
       });
       window.addEventListener("resize", () => this.myChart5.resize());
     },
+    initResiServiceCharts() {
+      let div = document.getElementById("resiServiceChart");
+      this.resiChart = echarts.init(div);
+      const option = {
+        color: [
+          "#15a7ed",
+          "#22b998",
+          "#5f6ff4",
+          "#a66eeb",
+          "#faa834",
+          "#fd6200",
+          "#fb3905",
+        ],
+        legend: {
+          orient: "vertical",
+          top: 20,
+          left: 10,
+          icon: "rect",
+          itemHeight: 14,
+          itemWidth: 14,
+          textStyle: {
+            color: "#ffffff",
+            rich: {
+              name: {
+                width: 90,
+                fontSize: 12,
+                color: "#dddee7",
+              },
+              value: {
+                width: 30,
+                align: "right",
+                fontSize: 18,
+              },
+            },
+          },
+          data: this.resiService,
+          formatter: (name) => {
+            if (this.resiService.length) {
+              const item = this.resiService.filter((item) => item.name === name)[0];
+              return `{name|${name}}{value| ${item.value}}`;
+            }
+          },
+        },
+        toolbox: {
+          show: false,
+          feature: {
+            mark: { show: true },
+            dataView: { show: true, readOnly: false },
+            restore: { show: true },
+            saveAsImage: { show: true },
+          },
+        },
+        title: {
+          show: !this.resiService || this.resiService.length == 0, // 是否要展示“暂无数据”矢量图
+          text: " {a|}", // 写入占位符a，以便后续填充内容
+          x: "center",
+          y: "center",
+          subtext: "暂无数据", // 子标题
+          itemGap: -10, // 设置主副标题间隔
+          textStyle: {
+            rich: {
+              a: {
+                height: 128, // 设置图片高度
+                width: 268, // 设置图片宽度
+                backgroundColor: {
+                  // 引入图片，作为背景图，填写相对路径
+                  image: require("@/assets/images/overview/zanwu.png"),
+                },
+              },
+            },
+          },
+          subtextStyle: {
+            // 配置副标题的文字样式
+            fontSize: 12,
+            color: "#ffffff",
+          },
+        },
+        series: [
+          {
+            type: "pie",
+            radius:
+              this.resiService && this.resiService.length > 0 ? [30, 130] : [0, 0],
+            center: ["50%", "50%"],
+            roseType: "area",
+            itemStyle: {
+              borderRadius: 0,
+            },
+            top: 20,
+            left: -40,
+            label: {
+              position: "inside",
+              formatter: "{d}%",
+              textStyle: {
+                color: "#ffffff",
+                fontSize: 12,
+              },
+            },
+            data: this.resiService,
+          },
+        ],
+      };
+      this.resiChart.setOption(option);
+      this.resiChart.on("click", (e) => {
+        this.$router.push({
+          path: "/dataBoard/renfang/resi-class-new",
+          query: {
+            org_id: this.org_id,
+            type_id: "aged",
+            type_name: "失业人员",
+            pageType: "normal",
+            type: "shiye",
+            serv_type: e.data.name,
+          },
+        });
+      });
+      window.addEventListener("resize", () => this.resiChart.resize());
+    },
   },
 };
 </script>
diff --git a/src/views/dataBoard/renfang/visualizing/components/teshurenqun.vue b/src/views/dataBoard/renfang/visualizing/components/teshurenqun.vue
new file mode 100644
index 000000000..9e4a5c0b4
--- /dev/null
+++ b/src/views/dataBoard/renfang/visualizing/components/teshurenqun.vue
@@ -0,0 +1,195 @@
+<template>
+  <div>
+    <div class="visualizing laonianren">
+      <div class="visualizing-item">
+        <div>
+          <data-title title="特殊人群享受服务情况统计" />
+        </div>
+        <div id="resiServiceChart" style="height: 400px"></div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import dataTitle from "@/views/dataBoard/renfang/visualizing/components/dataTitle.vue";
+import * as echarts from "echarts";
+
+function dataFormatter(arr) {
+  return arr.map((item) => {
+    return {
+      name: item.classification,
+      value: Number(item.classificationNum),
+    };
+  });
+}
+export default {
+  name: "teshurenqun",
+  props: {
+    title: {
+      type: String,
+      default: "",
+    },
+    org_id: {
+      type: String,
+      default: "",
+    },
+  },
+  components: {
+    dataTitle,
+  },
+  data() {
+    return {
+      lnrService: [],
+    };
+  },
+  created() {
+    const query = this.$route.query;
+    this.getData();
+  },
+  activated() {},
+  methods: {
+    getData() {
+      this.$http
+        .get("/actual/base/peopleRoomOverview/findPeoplePie/SPECIAL_CROWD_FLAG")
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          }
+          this.lnrService = dataFormatter(res.data);
+          this.initResiServiceCharts();
+        })
+        .catch(() => {});
+    },
+    
+    initResiServiceCharts() {
+      let div = document.getElementById("resiServiceChart");
+      this.myChart3 = echarts.init(div);
+      const option = {
+        color: [
+          "#15a7ed",
+          "#22b998",
+          "#5f6ff4",
+          "#a66eeb",
+          "#faa834",
+          "#fd6200",
+          "#fb3905",
+        ],
+        legend: {
+          orient: "vertical",
+          top: 20,
+          left: 10,
+          icon: "rect",
+          itemHeight: 14,
+          itemWidth: 14,
+          textStyle: {
+            color: "#ffffff",
+            rich: {
+              name: {
+                width: 90,
+                fontSize: 12,
+                color: "#dddee7",
+              },
+              value: {
+                width: 30,
+                align: "right",
+                fontSize: 18,
+              },
+            },
+          },
+          data: this.lnrService,
+          formatter: (name) => {
+            if (this.lnrService.length) {
+              const item = this.lnrService.filter((item) => item.name === name)[0];
+              return `{name|${name}}{value| ${item.value}}`;
+            }
+          },
+        },
+        toolbox: {
+          show: false,
+          feature: {
+            mark: { show: true },
+            dataView: { show: true, readOnly: false },
+            restore: { show: true },
+            saveAsImage: { show: true },
+          },
+        },
+        title: {
+          show: !this.lnrService || this.lnrService.length == 0, // 是否要展示“暂无数据”矢量图
+          text: " {a|}", // 写入占位符a，以便后续填充内容
+          x: "center",
+          y: "center",
+          subtext: "暂无数据", // 子标题
+          itemGap: -10, // 设置主副标题间隔
+          textStyle: {
+            rich: {
+              a: {
+                height: 128, // 设置图片高度
+                width: 268, // 设置图片宽度
+                backgroundColor: {
+                  // 引入图片，作为背景图，填写相对路径
+                  image: require("@/assets/images/overview/zanwu.png"),
+                },
+              },
+            },
+          },
+          subtextStyle: {
+            // 配置副标题的文字样式
+            fontSize: 12,
+            color: "#ffffff",
+          },
+        },
+        series: [
+          {
+            type: "pie",
+            radius:
+              this.lnrService && this.lnrService.length > 0 ? [30, 130] : [0, 0],
+            center: ["50%", "50%"],
+            roseType: "area",
+            itemStyle: {
+              borderRadius: 0,
+            },
+            top: 20,
+            left: -40,
+            label: {
+              position: "inside",
+              formatter: "{d}%",
+              textStyle: {
+                color: "#ffffff",
+                fontSize: 12,
+              },
+            },
+            data: this.lnrService,
+          },
+        ],
+      };
+      this.myChart3.setOption(option);
+      this.myChart3.on("click", (e) => {
+        this.$router.push({
+          path: "/dataBoard/renfang/resi-class-new",
+          query: {
+            org_id: this.org_id,
+            type_id: "aged",
+            type_name: "特殊人群",
+            pageType: "normal",
+            type: "special",
+            serv_type: e.data.name,
+          },
+        });
+      });
+      window.addEventListener("resize", () => this.myChart3.resize());
+    },
+  },
+};
+</script>
+
+<style
+  lang="scss"
+  src="@/assets/scss/dataBoard/renfang/index.scss"
+  scoped
+></style>
+<style lang="scss" scoped>
+.laonianren {
+  padding: 140px 240px;
+}
+</style>
diff --git a/src/views/dataBoard/renfang/visualizing/components/zhiyuanzhe.vue b/src/views/dataBoard/renfang/visualizing/components/zhiyuanzhe.vue
index 57b8de1fb..80a724467 100644
--- a/src/views/dataBoard/renfang/visualizing/components/zhiyuanzhe.vue
+++ b/src/views/dataBoard/renfang/visualizing/components/zhiyuanzhe.vue
@@ -1,18 +1,24 @@
 <template>
   <div>
     <div class="visualizing laonianren">
-      <div class="visualizing-left">
+      <div class="visualizing-item">
         <div>
           <data-title title="志愿者年龄统计" />
         </div>
         <div id="zyzLeftChart" style="height: 400px"></div>
       </div>
-      <div class="visualizing-right">
+      <div class="visualizing-item">
         <div>
           <data-title title="志愿者类别统计" />
         </div>
         <div id="zyzRightChart" style="height: 400px"></div>
       </div>
+      <div class="visualizing-item">
+        <div>
+          <data-title title="志愿者享受服务情况统计" />
+        </div>
+        <div id="resiServiceChart" style="height: 400px"></div>
+      </div>
     </div>
   </div>
 </template>
@@ -48,6 +54,7 @@ export default {
     return {
       zyzLeft: [],
       zyzRight: [],
+      resiService: [],
     };
   },
   created() {
@@ -77,6 +84,17 @@ export default {
           this.initRightCharts();
         })
         .catch(() => {});
+
+      this.$http
+        .get("/actual/base/peopleRoomOverview/findPeoplePie/VOLUNTEER_FLAG")
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          }
+          this.resiService = dataFormatter(res.data);
+          this.initResiServiceCharts();
+        })
+        .catch(() => {});
     },
     initLeftCharts() {
       let div = document.getElementById("zyzLeftChart");
@@ -314,6 +332,124 @@ export default {
       this.myChart2.setOption(option);
       window.addEventListener("resize", () => this.myChart2.resize());
     },
+
+    initResiServiceCharts() {
+      let div = document.getElementById("resiServiceChart");
+      this.resiChart = echarts.init(div);
+      const option = {
+        color: [
+          "#15a7ed",
+          "#22b998",
+          "#5f6ff4",
+          "#a66eeb",
+          "#faa834",
+          "#fd6200",
+          "#fb3905",
+        ],
+        legend: {
+          orient: "vertical",
+          top: 20,
+          left: 10,
+          icon: "rect",
+          itemHeight: 14,
+          itemWidth: 14,
+          textStyle: {
+            color: "#ffffff",
+            rich: {
+              name: {
+                width: 90,
+                fontSize: 12,
+                color: "#dddee7",
+              },
+              value: {
+                width: 30,
+                align: "right",
+                fontSize: 18,
+              },
+            },
+          },
+          data: this.resiService,
+          formatter: (name) => {
+            if (this.resiService.length) {
+              const item = this.resiService.filter((item) => item.name === name)[0];
+              return `{name|${name}}{value| ${item.value}}`;
+            }
+          },
+        },
+        toolbox: {
+          show: false,
+          feature: {
+            mark: { show: true },
+            dataView: { show: true, readOnly: false },
+            restore: { show: true },
+            saveAsImage: { show: true },
+          },
+        },
+        title: {
+          show: !this.resiService || this.resiService.length == 0, // 是否要展示“暂无数据”矢量图
+          text: " {a|}", // 写入占位符a，以便后续填充内容
+          x: "center",
+          y: "center",
+          subtext: "暂无数据", // 子标题
+          itemGap: -10, // 设置主副标题间隔
+          textStyle: {
+            rich: {
+              a: {
+                height: 128, // 设置图片高度
+                width: 268, // 设置图片宽度
+                backgroundColor: {
+                  // 引入图片，作为背景图，填写相对路径
+                  image: require("@/assets/images/overview/zanwu.png"),
+                },
+              },
+            },
+          },
+          subtextStyle: {
+            // 配置副标题的文字样式
+            fontSize: 12,
+            color: "#ffffff",
+          },
+        },
+        series: [
+          {
+            type: "pie",
+            radius:
+              this.resiService && this.resiService.length > 0 ? [30, 130] : [0, 0],
+            center: ["50%", "50%"],
+            roseType: "area",
+            itemStyle: {
+              borderRadius: 0,
+            },
+            top: 20,
+            left: -40,
+            label: {
+              position: "inside",
+              formatter: "{d}%",
+              textStyle: {
+                color: "#ffffff",
+                fontSize: 12,
+              },
+            },
+            data: this.resiService,
+          },
+        ],
+      };
+      this.resiChart.setOption(option);
+      this.resiChart.on("click", (e) => {
+        this.$router.push({
+          path: "/dataBoard/renfang/resi-class-new",
+          query: {
+            org_id: this.org_id,
+            type_id: "aged",
+            type_name: "志愿者",
+            pageType: "normal",
+            type: "zhiyuanzhe",
+            serv_type: e.data.name,
+          },
+        });
+      });
+      window.addEventListener("resize", () => this.resiChart.resize());
+    },
   },
 };
 </script>
diff --git a/src/views/dataBoard/renfang/visualizing/index.vue b/src/views/dataBoard/renfang/visualizing/index.vue
index c38753359..73e07e966 100644
--- a/src/views/dataBoard/renfang/visualizing/index.vue
+++ b/src/views/dataBoard/renfang/visualizing/index.vue
@@ -10,6 +10,7 @@
     <zhiyuanzhe :org_id="org_id" v-if="pageName == '志愿者'" />
     <dangyuan :org_id="org_id" v-if="pageName == '党员'" />
     <shiyerenyuan :org_id="org_id" v-if="pageName == '失业人员'" />
+    <teshurenqun :org_id="org_id" v-if="pageName == '特殊人群'" />
   </div>
 </template>
 
@@ -20,6 +21,7 @@ import dibaorenyuan from "./components/dibaorenyuan.vue";
 import zhiyuanzhe from "./components/zhiyuanzhe.vue";
 import dangyuan from "./components/dangyuan.vue";
 import shiyerenyuan from "./components/shiyerenyuan.vue";
+import teshurenqun from "./components/teshurenqun.vue";
 export default {
   name: "visualizing",
   props: {
@@ -35,6 +37,7 @@ export default {
     zhiyuanzhe,
     dangyuan,
     shiyerenyuan,
+    teshurenqun,
   },
   data() {
     return {