diff --git a/src/project/pidu/AppDataStatistics/AppDataOverview.vue b/src/project/pidu/AppDataStatistics/AppDataOverview.vue
new file mode 100644
index 00000000..08ecea55
--- /dev/null
+++ b/src/project/pidu/AppDataStatistics/AppDataOverview.vue
@@ -0,0 +1,154 @@
+<template>
+  <div class="AppDataOverview">
+    <div class="head">
+      <div class="head_title">
+        <span>数据总览</span>
+        <span>数据截至 昨日24:00</span>
+      </div>
+      <div class="head_data">
+        <div class="head_data_item" v-for="(e,ind) in monthData" :key="ind">
+          <span class="dot"></span>
+          <span>{{ e }} {{ data[e] }}</span>
+        </div>
+      </div>
+    </div>
+
+    <div class="information">
+      <div class="u-sub">
+        <u-subsection :list="list" :current="current"  @change="sectionChange"></u-subsection>
+      </div>
+
+      <div class="card_list">
+        <div class="card" v-for="(item,index) in dataArray" :key="index">
+          <div class="card_name">{{ item }}</div>
+          <div class="card_num">{{ Number(data[item]).toLocaleString('en-US') }}</div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "AppDataOverview",
+  data() {
+    return {
+      list: [
+        { name: '本周' },
+        { name: '本月' }
+      ],
+      current: 0,
+      data: {},
+      dataArray: ['新增居民档案','居民档案更新','新增网格员','新增走访记录','新增矛盾调解','新增宣发记录'],
+      monthData: ['本月访问次数','本月访问人数'],
+      beginDate: ''
+    }
+  },
+  onShow() {
+    this.getData()
+  },
+  methods: {
+    sectionChange(e) {
+      this.current = e
+      this.getData()
+    },
+    getData() {
+      this.$http.post(`/app/appwxcpopenstatistics/statistics`,null, {
+        params: {
+          beginDate: this.beginDate,
+          type: this.current==0? '1':'2'
+        }
+      }).then(res=> {
+        if(res?.data) {
+          this.data = res.data
+        }
+      })
+    }
+  },
+  onLoad(o) {
+    document.title = '慧政务'
+    this.beginDate = o.beginDate
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.AppDataOverview {
+  .head {
+    height: 212px;
+    background: #3975C6;
+    .head_title { 
+      color: #FFFFFF;
+      padding: 32px;
+      box-sizing: border-box;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      span:first-child {
+        font-size: 44px;
+      }
+      span:last-child {
+        font-size: 24px;
+      }
+    }
+    .head_data {
+      display: flex;
+      padding: 0 32px;
+      box-sizing: border-box;
+      .head_data_item {
+        flex: 1;
+        color: #FFFFFF;
+        .dot {
+          display: inline-block;
+          width: 8px;
+          height: 8px;
+          border-radius: 4px;
+          background: #FFFFFF;
+          margin-right: 8px;
+        }
+      }
+    }
+  }
+
+  .information {
+    width: 100%;
+    border-radius: 16px;
+    padding: 32px;
+    box-sizing: border-box;
+
+    .u-sub {
+      padding: 32px;
+      box-sizing: border-box;
+      background: #FFFFFF;
+      border-radius: 16px 16px 0 0;
+    }
+
+    .card_list {
+      width: 100%;
+      display: flex;
+      align-items: center;
+      flex-wrap: wrap;
+      background: #FFFFFF;
+      padding: 0 32px;
+      box-sizing: border-box;
+      border-radius: 0 0 16px 16px;
+      
+      .card {
+        width: 50%;
+        height: 160px;
+        text-align: center;
+        .card_name {
+          margin-top: 32px;
+          color: #666666;
+        }
+        .card_num {
+          font-size: 36px;
+          color: #000000;
+          font-weight: 600;
+          margin-top: 12px;
+        }
+      }
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/project/pidu/AppDataStatistics/AppDataStatistics.vue b/src/project/pidu/AppDataStatistics/AppDataStatistics.vue
new file mode 100644
index 00000000..18e564e4
--- /dev/null
+++ b/src/project/pidu/AppDataStatistics/AppDataStatistics.vue
@@ -0,0 +1,160 @@
+<template>
+  <div class="AppDataStatistics">
+    <AiTopFixed>
+      <div class="area-content">
+        <!-- <AiAreaPicker v-model="areaId" :name.sync="areaName" :area-id="user.areaId" @select="areaSelect">
+          <div flex>
+            <img src="./img/location.png" alt="" class="icon-img">
+            <AiMore v-model="areaName" icon="arrow-down"/>
+          </div>
+        </AiAreaPicker> -->
+        <AiPagePicker type="dept" :selected.sync="deptList" nodeKey="id" single @select="deptSelect">
+          <span class="label" v-if="deptList.length">{{deptList[0].name}}</span>
+          <span v-else style="color:#fff;">部门名称</span>
+          <u-icon name="arrow-down" color="#fff" size="24" style="margin-left:8px;"/>
+        </AiPagePicker>
+      </div>
+    </AiTopFixed>
+    <div class="tab-list">
+      <div :class="index == tabIndex ? 'tab-item active' : 'tab-item'" v-for="(item, index) in tabList" :key="index" @click="tabClick(index)">{{ item.text }}<span></span></div>
+    </div>
+    <component ref='list' :is="tabList[tabIndex].component" :departmentId="departmentId" class="component" />
+  </div>
+</template>
+
+<script>
+import sensitive from './components/sensitive'
+import wechat from './components/wechat'
+import message from './components/message'
+import { mapState } from 'vuex'
+
+export default {
+  name: "AppDataStatistics",
+  appName: "数据统计",
+  data() {
+    return {
+      tabList: [
+        {
+          text: '微信统计',
+          component: wechat
+        },
+        {
+          text: '会话统计',
+          component: message
+        },
+        {
+          text: '敏感词统计',
+          component: sensitive
+        },
+      ],
+      tabIndex: 0,
+      // areaId: '',
+      // areaName: '',
+      departmentId: '',
+      deptList: [],
+
+    }
+  },
+  computed: {
+    ...mapState(['user'])
+  },
+  components: {sensitive, wechat, message},
+  methods: {
+    tabClick(index) {
+      this.tabIndex = index
+    },
+    toOverData() {
+      uni.navigateTo({url:'./AppDataOverview'})
+    },
+    areaSelect(e) {
+      this.areaId = e
+      this.refreshList()
+    },
+    deptSelect(e) {
+      this.deptList = e
+      this.departmentId = e[0].id
+      this.refreshList()
+    },
+    refreshList() {
+      this.$nextTick(() => this.$refs.list.getData())
+    },
+    refreshTally() {
+      this.$http.post('/app/appwxcpopenstatistics/tally').then(res=> {
+        if(res.code == 0) {
+          console.log('手动触发成功');
+        }
+      })
+    }
+    
+  },
+  onLoad() {
+    this.deptList = [{name: this.user.departName, id: this.user.departId}]
+    this.departmentId = this.user.departId
+    // this.refreshTally()
+  },
+  onShow() {
+    document.title = "数据统计"
+    // this.areaId = this.user.areaId
+    // this.areaName = this.user.areaName
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.AppDataStatistics {
+  width: 100%;
+  height: 100%;
+  background-color: #F5F6F7;
+  padding-bottom: 112px;
+  ::v-deep .AiTopFixed {
+    .content {
+      background-color: #3975C6;
+      color: #fff;
+    }
+    .icon-img{
+      width: 48px;
+      height: 48px;
+    }
+  }
+  ::v-deep .AiMore{
+    span{
+      color: #fff;
+    }
+  }
+  .tab-list {
+    width: 100%;
+    line-height: 88px;
+    display: flex;
+    background-color: #fff;
+    position: fixed;
+    z-index: 9;
+
+    .tab-item {
+      flex: 1;
+      text-align: center;
+      font-size: 28px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      color: #666;
+      position: relative;
+    }
+    .active {
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      color: #000;
+      span {
+        position: absolute;
+        bottom: 0;
+        left: 50%;
+        margin-left: -25px;
+        width: 50px;
+        height: 6px;
+        background: #3399FF;
+        border-radius: 4px;
+      }
+    }
+  }
+  .component{
+    padding-top: 88px;
+  }
+}
+</style>
diff --git a/src/project/pidu/AppDataStatistics/components/message.vue b/src/project/pidu/AppDataStatistics/components/message.vue
new file mode 100644
index 00000000..237d5974
--- /dev/null
+++ b/src/project/pidu/AppDataStatistics/components/message.vue
@@ -0,0 +1,486 @@
+<template>
+  <div class="message">
+    <div class="head">
+      <span>消息回复率</span>
+    </div>
+
+    <div class="echarts_list">
+      <div id="echarts1"></div>
+      <div id="echarts2"></div>
+      <div id="echarts3"></div>
+    </div>
+
+    <div class="head">
+      <span>单聊统计</span>
+    </div>
+
+    <div class="card">
+      <div class="item" :class="privateCurrent == 0? 'active':''" @click="privateCurrent = 0,getPrivateData()">
+        <div class="item_name">单聊会话</div>
+        <div class="item_num" v-if="privateCard">{{ Number(privateCard.chatCnt).toLocaleString('en-US') }}</div>
+        <div class="item_num" v-else>0</div>
+      </div>
+      <div class="item" :class="privateCurrent == 1? 'active':''" @click="privateCurrent = 1,getPrivateData()">
+        <div class="item_name">单聊消息</div>
+        <div class="item_num" v-if="privateCard">{{ Number(privateCard.messageCnt).toLocaleString('en-US') }}</div>
+        <div class="item_num" v-else>0</div>
+      </div>
+    </div>
+
+    <div class="privateChat_box">
+      <div id="privateChat" v-if="privateData.length > 0"></div>
+      <AiEmpty style="padding-top: 10px;" description="暂无数据" v-else></AiEmpty>
+    </div>
+
+    <div class="head">
+      <span>群聊统计</span>
+    </div>
+
+    <div class="card">
+      <div class="item" :class="groupCurrent == 0? 'active':''" @click="groupCurrent = 0,getGroupData()">
+        <div class="item_name">活跃群聊</div>
+        <div class="item_num" v-if="groupCard">{{ Number(groupCard.chatHasMsg).toLocaleString('en-US') }}</div>
+        <div class="item_num" v-else>0</div>
+      </div>
+      <div class="item" :class="groupCurrent == 1? 'active':''" @click="groupCurrent = 1,getGroupData()">
+        <div class="item_name">活跃群成员</div>
+        <div class="item_num" v-if="groupCard">{{ Number(groupCard.memberHasMsg).toLocaleString('en-US') }}</div>
+        <div class="item_num" v-else>0</div>
+      </div>
+      <div class="item" :class="groupCurrent == 2? 'active':''" @click="groupCurrent = 2,getGroupData()">
+        <div class="item_name">群聊消息</div>
+        <div class="item_num" v-if="groupCard">{{ Number(groupCard.msgTotal).toLocaleString('en-US') }}</div>
+        <div class="item_num" v-else>0</div>
+      </div>
+    </div>
+
+    <div class="groupChat_box">
+      <div id="groupChat" v-if="groupData.length > 0"></div>
+      <AiEmpty style="padding-top: 10px;" description="暂无数据" v-else></AiEmpty>
+    </div>
+
+  </div>
+</template>
+
+<script>
+import echarts from "echarts"
+export default {
+  name: 'message',
+  props: {
+    departmentId: String
+  },
+  data() {
+    return {
+      privateCard: {},
+      privateData: [],
+      privateDate: [],
+      privateMsg: [],
+      privateCurrent: 0,
+      groupCard: {},
+      groupData: [],
+      groupDate: [],
+      groupMsg: [],
+      groupCurrent: 0,
+      replyData: {},
+    }
+  },
+  created() {
+    this.getData()
+  },
+  methods: {
+    getData() {
+      // 回复率
+      this.$http.post(`/app/wxgroupstatistic/replyPercentage?departmentId=${this.departmentId}`).then(res=> {
+        if(res?.data) {
+          this.replyData = res.data
+          this.getEcharts1(this.replyData)
+          this.getEcharts2(this.replyData)
+          this.getEcharts3(this.replyData)
+        }
+      })
+      this.getPrivateData()
+      this.getGroupData()
+    },
+    getPrivateData() {
+      // 单聊统计
+      this.$http.post(`/app/wxgroupstatistic/getUserChatNumber?departmentId=${this.departmentId}`).then(res=> {
+        if(res?.data) {
+          this.privateCard = res.data.单聊总和
+          this.privateData = res.data.条形统计
+          this.privateDate = this.privateData?.map(v=> v.dateDay)
+          if(this.privateCurrent == 0) {
+            this.privateMsg = this.privateData?.map(v=> v.chatCnt)
+          } else if(this.privateCurrent == 1) {
+            this.privateMsg = this.privateData?.map(v=> v.messageCnt)
+          }
+          this.$nextTick(()=> {
+            this.getPrivateChat(this.privateDate,this.privateMsg)
+          })
+        }
+      })
+    },
+    getGroupData() {
+      // 群聊统计
+      this.$http.post(`/app/wxgroupstatistic/getgroupChatNumber?departmentId=${this.departmentId}`).then(res=> {
+        if(res?.data) {
+          this.groupCard = res.data.群聊总和
+          this.groupData = res.data.条形统计
+          this.groupDate = this.groupData?.map(v=> v.dateDay)
+          if(this.groupCurrent == 0) {
+            this.groupMsg = this.groupData?.map(v=>v.chatHasMsg)
+          } else if(this.groupCurrent ==1) {
+            this.groupMsg = this.groupData?.map(v=>v.memberHasMsg)
+          } else if(this.groupCurrent == 2) {
+            this.groupMsg = this.groupData?.map(v=>v.msgTotal)
+          }
+          this.$nextTick(()=> {
+            this.getGroupChat(this.groupDate,this.groupMsg)
+          })
+        }
+      })
+    },
+    getEcharts1({replyPercentage}) {
+      let echarts1 = document.getElementById('echarts1');
+      let myChart1 = echarts.init(echarts1);
+      let option = {
+        // tooltip: {
+        //   trigger: 'item',
+        // },
+        title: {
+          zlevel: 0,
+          text: [`{name|昨日}\n{value|${ replyPercentage } %}`],
+          top: 'center',
+          left: '46%',
+          textAlign: 'center',
+          textStyle: {
+            rich: {
+              name: {
+                color: '#999999',
+                fontSize: 13,
+                lineHeight: 15
+              },
+              value: {
+                color: '#333333',
+                fontSize: 13,
+                lineHeight: 16
+              }
+            },
+          },
+        },
+        color: ['#3975C6','#C7C7C7'], 
+        series: [
+          {
+            name: '昨天',
+            type: 'pie',
+            radius: ['50%', '70%'],
+            avoidLabelOverlap: false,
+            hoverAnimation: false,
+            labelLine: {
+              show: false,
+            },
+            data: [
+              { value: replyPercentage, name: '' },
+              { value: 100 - replyPercentage, name: '' },
+            ]
+          }
+        ]
+      };
+      option && myChart1.setOption(option);
+    },
+    getEcharts2({weekSum}) {
+      let echarts2 = document.getElementById('echarts2');
+      let myChart2 = echarts.init(echarts2);
+      let option = {
+        // tooltip: {
+        //   trigger: "item",
+        // },
+        title: {
+          zlevel: 0,
+          text: [`{name|近7天}\n{value|${ weekSum } %}`],
+          top: 'center',
+          left: '46%',
+          textAlign: 'center',
+          textStyle: {
+            rich: {
+              name: {
+                color: '#999999',
+                fontSize: 13,
+                lineHeight: 15
+              },
+              value: {
+                color: '#333333',
+                fontSize: 13,
+                lineHeight: 16
+              }
+            },
+          },
+        },
+        color: ['#3975C6','#C7C7C7'], 
+        series: [
+          {
+            name: '近7天',
+            type: 'pie',
+            radius: ['50%', '70%'],
+            avoidLabelOverlap: false,
+            hoverAnimation: false,
+            labelLine: {
+              show: false,
+            },
+            data: [
+              { value: weekSum, name: '' },
+              { value: 100 - weekSum, name: '' },
+            ]
+          }
+        ]
+      };
+      option && myChart2.setOption(option);
+    },
+    getEcharts3({monthSum}) {
+      let echarts3 = document.getElementById('echarts3');
+      let myChart3 = echarts.init(echarts3);
+      let option = {
+        // tooltip: {
+        //   trigger: "item",
+        // },
+        title: {
+          zlevel: 0,
+          text: [`{name|近30天}\n{value|${ monthSum } %}`],
+          top: 'center',
+          left: '46%',
+          textAlign: 'center',
+          textStyle: {
+            rich: {
+              name: {
+                color: '#999999',
+                fontSize: 13,
+                lineHeight: 15
+              },
+              value: {
+                color: '#333333',
+                fontSize: 13,
+                lineHeight: 16
+              }
+            },
+          },
+        },
+        color: ['#3975C6','#C7C7C7'], 
+        series: [
+          {
+            name: '近30天',
+            type: 'pie',
+            radius: ['50%', '70%'],
+            avoidLabelOverlap: false,
+            hoverAnimation: false,
+            labelLine: {
+              show: false,
+            },
+            data: [
+              { value: monthSum, name: '' },
+              { value: 100 - monthSum, name: '' },
+            ]
+          }
+        ]
+      };
+      option && myChart3.setOption(option);
+    },
+    getPrivateChat(privateDate,privateMsg) {
+      let privateDom = document.getElementById('privateChat');
+      let myChartPrivate = echarts.init(privateDom);
+      let option = {
+        tooltip: {
+          trigger: "axis",
+        },
+        xAxis: {
+          type: 'category',
+          data: privateDate,
+          axisTick: {
+            show: false,
+          }
+        },
+        yAxis: {
+          type: 'value',
+          axisLine: {
+            show: false,
+          },
+          axisTick: {
+            show: false,
+          }
+        },
+        series: [
+          {
+            data: privateMsg,
+            type: 'line',
+            lineStyle: {
+              color: '#3975C6', // 折线线条颜色
+            },
+            itemStyle: {
+              color: '#3975C6', // 折角颜色
+            },
+            areaStyle: {
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [  // 渐变颜色
+                  {
+                    offset: 0,
+                    color: '#2891ff33',
+                  },
+                  {
+                    offset: 1,
+                    color: '#2891ff00',
+                  },
+                ],
+                global: false,
+              },
+            },
+          }
+        ]
+      };
+      option && myChartPrivate.setOption(option);
+    },
+    getGroupChat(groupDate,groupMsg) {
+      let groupDom = document.getElementById('groupChat');
+      let myChartGroup = echarts.init(groupDom);
+      let option = {
+        tooltip: {
+          trigger: "axis",
+        },
+        xAxis: {
+          type: 'category',
+          data: groupDate,
+          axisTick: {
+            show: false,
+          }
+        },
+        yAxis: {
+          type: 'value',
+          axisLine: {
+            show: false,
+          },
+          axisTick: {
+            show: false,
+          }
+        },
+        series: [
+          {
+            data: groupMsg,
+            type: 'line',
+            lineStyle: {
+              color: '#3975C6', // 折线线条颜色
+            },
+            itemStyle: {
+              color: '#3975C6', // 折角颜色
+            },
+            areaStyle: {
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [  // 渐变颜色
+                  {
+                    offset: 0,
+                    color: '#2891ff33',
+                  },
+                  {
+                    offset: 1,
+                    color: '#2891ff00',
+                  },
+                ],
+                global: false,
+              },
+            },
+          }
+        ]
+      };
+      option && myChartGroup.setOption(option);
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.message {
+  padding: 0 32px;
+  box-sizing: border-box;
+  .head {
+    margin-top: 32px;
+    span {
+      font-size: 32px;
+      color: #333333;
+      font-weight: 600;
+    }
+  }
+
+  .card {
+    padding: 8px;
+    box-sizing: border-box;
+    display: flex;
+    text-align: center;
+    align-items: center;
+    background: #FFF;
+    border-radius: 16px 16px 0 0;
+    margin-top: 24px;
+
+    .item {
+      flex: 1;
+      padding: 16px 0;
+      box-sizing: border-box;
+
+      .item_name {
+        color: #666666;
+      }
+
+      .item_num {
+        color: #000000;
+        font-size: 36px;
+        font-weight: 600;
+      }
+
+      .imgs {
+        width: 30px;
+        height: 30px;
+      }
+    }
+    .active {
+      background: #EBF1F9;
+      border-radius: 16px;
+    }
+  }
+
+  .privateChat_box,
+  .groupChat_box {
+    width: 100%;
+    height: 514px;
+    background: #FFF;
+    border-radius: 0 0 16px 16px;
+    
+    #privateChat,
+    #groupChat {
+      width: 100%;
+      height: 100%;
+    }
+  }
+
+  .echarts_list {
+    width: 100%;
+    height: 256px;
+    background: #FFF;
+    border-radius: 8px;
+    margin-top: 24px;
+    display: flex;
+
+    #echarts1,
+    #echarts2,
+    #echarts3 {
+      flex: 1;
+      width: 100%;
+      height: 100%;
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/project/pidu/AppDataStatistics/components/sensitive.vue b/src/project/pidu/AppDataStatistics/components/sensitive.vue
new file mode 100644
index 00000000..e719f672
--- /dev/null
+++ b/src/project/pidu/AppDataStatistics/components/sensitive.vue
@@ -0,0 +1,277 @@
+<template>
+  <div class="sensitive">
+    <div class="card">
+      <div class="item">
+        <div class="item_name">敏感词累计</div>
+        <div class="item_num">{{ Number(friendsCard.customerTotal).toLocaleString('en-US') }}</div>
+      </div>
+      <div class="item">
+        <div class="item_name">群聊敏感词</div>
+        <div class="item_num">{{ Number(friendsCard.addCustomerCount).toLocaleString('en-US') }}
+          <img src="../img/up.png" alt="" class="imgs" v-show="friendsCard.addCustomerCount != 0">
+        </div>
+      </div>
+      <div class="item">
+        <div class="item_name">私聊敏感词</div>
+        <div class="item_num">{{ Number(friendsCard.removeCustomerCount).toLocaleString('en-US') }}
+          <img src="../img/down.png" alt="" class="imgs" v-show="friendsCard.removeCustomerCount !=0"></div>
+      </div>
+    </div>
+
+    <div class="head">
+      <span>群聊敏感词统计</span>
+    </div>
+    <div class="friends_box">
+      <div id="friends" v-if="friendsData.length > 0"></div>
+      <AiEmpty style="padding-top: 10px;" description="暂无数据" v-else></AiEmpty>
+    </div>
+
+    <div class="head">
+      <span>单聊敏感词统计</span>
+    </div>
+    <div class="groups_box">
+      <div id="groups" v-if="groupsData.length > 0"></div>
+      <AiEmpty style="padding-top: 10px;" description="暂无数据" v-else></AiEmpty>
+    </div>
+  </div>
+</template>
+
+<script>
+import echarts from 'echarts';
+export default {
+  name: "sensitive",
+  props: {
+    departmentId: String
+  },
+  data() {
+    return {
+      friendsCard: {},
+      friendsData: [],
+      friendsMonth: [],
+      friendsNumber: [],
+      groupsCard: {},
+      groupsData: [],
+      groupsMonth: [],
+      groupsNumber: []
+    }
+  },
+  created() {
+    this.getData()
+  },
+  methods: {
+    getData() {
+      // 居民好友
+      this.$http.post(`/app/wxgroupstatistic/getCustommerNumber?departmentId=${this.departmentId}`).then(res=> {
+        if(res?.data) {
+          this.friendsCard = res.data.居民统计
+          this.friendsData = res.data.居民好友数
+          this.friendsMonth = this.friendsData.map(e=> e.month)
+          this.friendsNumber = this.friendsData.map(e=> e.totalNumber)
+          this.$nextTick(()=> {
+            this.getFriendsEcharts(this.friendsMonth,this.friendsNumber)
+          })
+        }
+      })
+      // 居民群
+      this.$http.post(`/app/wxgroupstatistic/getGroupNumber?departmentId=${this.departmentId}`).then(res=> {
+        if(res?.data) {
+          this.groupsCard = res.data.居民群统计
+          this.groupsData = res.data.群成员数
+          this.groupsMonth = this.groupsData.map(e=> e.month)
+          this.groupsNumber = this.groupsData.map(e=> e.totalNumber)
+          this.$nextTick(()=> {
+            this.getGroupsEcharts(this.groupsMonth,this.groupsNumber)
+          })
+        }
+      })
+    },
+    getFriendsEcharts(friendsMonth,friendsNumber) {
+      let friendsDom = document.getElementById('friends');
+      let myFriendsChart = echarts.init(friendsDom);
+      let option = {
+        tooltip: {
+          trigger: "axis",
+        },
+        xAxis: {
+          type: 'category',
+          data: friendsMonth,
+          axisTick: {
+            show: false,
+          }
+        },
+        yAxis: {
+          type: 'value',
+          axisLine: {
+            show: false,
+          },
+          axisTick: {
+            show: false,
+          }
+        },
+        grid:{
+          x:50,
+          y:50,
+	      },
+        series: [
+          {
+            data: friendsNumber,
+            type: 'line',
+            lineStyle: {
+              color: '#3975C6', // 折线线条颜色
+            },
+            itemStyle: {
+              color: '#3975C6', // 折角颜色
+            },
+            areaStyle: {
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [  // 渐变颜色
+                  {
+                    offset: 0,
+                    color: '#2891ff33',
+                  },
+                  {
+                    offset: 1,
+                    color: '#2891ff00',
+                  },
+                ],
+                global: false,
+              },
+            },
+          }
+        ]
+      };
+      option && myFriendsChart.setOption(option);
+    },
+    getGroupsEcharts(groupsMonth,groupsNumber) {
+      let groupsDom = document.getElementById('groups');
+      let myGroupsChart = echarts.init(groupsDom);
+      let option = {
+        tooltip: {
+          trigger: "axis",
+        },
+        xAxis: {
+          type: 'category',
+          data: groupsMonth,
+          axisTick: {
+            show: false,
+          }
+        },
+        yAxis: {
+          type: 'value',
+          axisLine: {
+            show: false,
+          },
+          axisTick: {
+            show: false,
+          }
+        },
+        grid:{
+          x:50,
+          y:50,
+	      },
+        series: [
+          {
+            data: groupsNumber,
+            type: 'line',
+            lineStyle: {
+              color: '#3975C6', // 折线线条颜色
+            },
+            itemStyle: {
+              color: '#3975C6', // 折角颜色
+            },
+            areaStyle: {
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [  // 渐变颜色
+                  {
+                    offset: 0,
+                    color: '#2891ff33',
+                  },
+                  {
+                    offset: 1,
+                    color: '#2891ff00',
+                  },
+                ],
+                global: false,
+              },
+            },
+          }
+        ]
+      };
+      option && myGroupsChart.setOption(option);
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.sensitive {
+  padding: 0 32px;
+  box-sizing: border-box;
+  .head {
+    margin-top: 32px;
+    span:first-child {
+      font-size: 32px;
+      color: #333333;
+      font-weight: 600;
+    }
+    span:last-child {
+      font-size: 26px;
+      color: #999999;
+    }
+  }
+
+  .card {
+    padding: 24px 0;
+    box-sizing: border-box;
+    display: flex;
+    text-align: center;
+    align-items: center;
+    background: #FFF;
+    border-radius: 16px;
+    margin-top: 24px;
+
+    .item {
+      flex: 1;
+
+      .item_name {
+        color: #666666;
+      }
+
+      .item_num {
+        color: #000000;
+        font-size: 36px;
+        font-weight: 600;
+      }
+
+      .imgs {
+        width: 30px;
+        height: 30px;
+      }
+    }
+  }
+
+  .friends_box,
+  .groups_box {
+    margin-top: 24px;
+    width: 100%;
+    height: 514px;
+    background: #FFF;
+    
+    #friends,
+    #groups {
+      width: 100%;
+      height: 100%;
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/project/pidu/AppDataStatistics/components/wechat.vue b/src/project/pidu/AppDataStatistics/components/wechat.vue
new file mode 100644
index 00000000..0adb4ad4
--- /dev/null
+++ b/src/project/pidu/AppDataStatistics/components/wechat.vue
@@ -0,0 +1,300 @@
+<template>
+  <div class="wechat">
+    <div class="head">
+      <span>居民好友统计</span><span>(统计数据为去重后的数据)</span>
+    </div>
+
+    <div class="card">
+      <div class="item">
+        <div class="item_name">居民好友</div>
+        <div class="item_num">{{ Number(friendsCard.customerTotal).toLocaleString('en-US') }}</div>
+      </div>
+      <div class="item">
+        <div class="item_name">昨日新增</div>
+        <div class="item_num">{{ Number(friendsCard.addCustomerCount).toLocaleString('en-US') }}
+          <img src="../img/up.png" alt="" class="imgs" v-show="friendsCard.addCustomerCount != 0">
+        </div>
+      </div>
+      <div class="item">
+        <div class="item_name">昨日流失</div>
+        <div class="item_num">{{ Number(friendsCard.removeCustomerCount).toLocaleString('en-US') }}
+          <img src="../img/down.png" alt="" class="imgs" v-show="friendsCard.removeCustomerCount !=0"></div>
+      </div>
+    </div>
+
+    <div class="friends_box">
+      <div id="friends" v-if="friendsData.length > 0"></div>
+      <AiEmpty style="padding-top: 10px;" description="暂无数据" v-else></AiEmpty>
+    </div>
+
+    <div class="head">
+      <span>居民群统计</span><span>(统计数据为去重后的数据)</span>
+    </div>
+
+    <div class="card">
+      <div class="item">
+        <div class="item_name">居民群</div>
+        <div class="item_num">{{ Number(groupsCard.groupSum).toLocaleString('en-US') }}</div>
+      </div>
+      <div class="item">
+        <div class="item_name">群成员</div>
+        <div class="item_num">{{ Number(groupsCard.totalSum).toLocaleString('en-US') }}</div>
+      </div>
+      <div class="item">
+        <div class="item_name">昨日新增</div>
+        <div class="item_num">{{ Number(groupsCard.increaseSum).toLocaleString('en-US') }}
+          <img src="../img/up.png" alt="" class="imgs" v-show="groupsCard.increaseSum"></div>
+      </div>
+      <div class="item">
+        <div class="item_name">昨日流失</div>
+        <div class="item_num">{{ Number(groupsCard.decreaseSum).toLocaleString('en-US') }}
+          <img src="../img/down.png" alt="" class="imgs" v-show="groupsCard.decreaseSum"></div>
+      </div>
+    </div>
+
+    <div class="groups_box">
+      <div id="groups" v-if="groupsData.length > 0"></div>
+      <AiEmpty style="padding-top: 10px;" description="暂无数据" v-else></AiEmpty>
+    </div>
+  </div>
+</template>
+
+<script>
+import echarts from 'echarts';
+export default {
+  name: "wechat",
+  props: {
+    departmentId: String
+  },
+  data() {
+    return {
+      friendsCard: {},
+      friendsData: [],
+      friendsMonth: [],
+      friendsNumber: [],
+      groupsCard: {},
+      groupsData: [],
+      groupsMonth: [],
+      groupsNumber: []
+    }
+  },
+  created() {
+    this.getData()
+  },
+  methods: {
+    getData() {
+      // 居民好友
+      this.$http.post(`/app/wxgroupstatistic/getCustommerNumber?departmentId=${this.departmentId}`).then(res=> {
+        if(res?.data) {
+          this.friendsCard = res.data.居民统计
+          this.friendsData = res.data.居民好友数
+          this.friendsMonth = this.friendsData.map(e=> e.month)
+          this.friendsNumber = this.friendsData.map(e=> e.totalNumber)
+          this.$nextTick(()=> {
+            this.getFriendsEcharts(this.friendsMonth,this.friendsNumber)
+          })
+        }
+      })
+      // 居民群
+      this.$http.post(`/app/wxgroupstatistic/getGroupNumber?departmentId=${this.departmentId}`).then(res=> {
+        if(res?.data) {
+          this.groupsCard = res.data.居民群统计
+          this.groupsData = res.data.群成员数
+          this.groupsMonth = this.groupsData.map(e=> e.month)
+          this.groupsNumber = this.groupsData.map(e=> e.totalNumber)
+          this.$nextTick(()=> {
+            this.getGroupsEcharts(this.groupsMonth,this.groupsNumber)
+          })
+        }
+      })
+    },
+    getFriendsEcharts(friendsMonth,friendsNumber) {
+      let friendsDom = document.getElementById('friends');
+      let myFriendsChart = echarts.init(friendsDom);
+      let option = {
+        tooltip: {
+          trigger: "axis",
+        },
+        xAxis: {
+          type: 'category',
+          data: friendsMonth,
+          axisTick: {
+            show: false,
+          }
+        },
+        yAxis: {
+          type: 'value',
+          axisLine: {
+            show: false,
+          },
+          axisTick: {
+            show: false,
+          }
+        },
+        grid:{
+          x:50,
+          y:50,
+	      },
+        series: [
+          {
+            data: friendsNumber,
+            type: 'line',
+            lineStyle: {
+              color: '#3975C6', // 折线线条颜色
+            },
+            itemStyle: {
+              color: '#3975C6', // 折角颜色
+            },
+            areaStyle: {
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [  // 渐变颜色
+                  {
+                    offset: 0,
+                    color: '#2891ff33',
+                  },
+                  {
+                    offset: 1,
+                    color: '#2891ff00',
+                  },
+                ],
+                global: false,
+              },
+            },
+          }
+        ]
+      };
+      option && myFriendsChart.setOption(option);
+    },
+    getGroupsEcharts(groupsMonth,groupsNumber) {
+      let groupsDom = document.getElementById('groups');
+      let myGroupsChart = echarts.init(groupsDom);
+      let option = {
+        tooltip: {
+          trigger: "axis",
+        },
+        xAxis: {
+          type: 'category',
+          data: groupsMonth,
+          axisTick: {
+            show: false,
+          }
+        },
+        yAxis: {
+          type: 'value',
+          axisLine: {
+            show: false,
+          },
+          axisTick: {
+            show: false,
+          }
+        },
+        grid:{
+          x:50,
+          y:50,
+	      },
+        series: [
+          {
+            data: groupsNumber,
+            type: 'line',
+            lineStyle: {
+              color: '#3975C6', // 折线线条颜色
+            },
+            itemStyle: {
+              color: '#3975C6', // 折角颜色
+            },
+            areaStyle: {
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [  // 渐变颜色
+                  {
+                    offset: 0,
+                    color: '#2891ff33',
+                  },
+                  {
+                    offset: 1,
+                    color: '#2891ff00',
+                  },
+                ],
+                global: false,
+              },
+            },
+          }
+        ]
+      };
+      option && myGroupsChart.setOption(option);
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.wechat {
+  padding: 0 32px;
+  box-sizing: border-box;
+  .head {
+    margin-top: 32px;
+    span:first-child {
+      font-size: 32px;
+      color: #333333;
+      font-weight: 600;
+    }
+    span:last-child {
+      font-size: 26px;
+      color: #999999;
+    }
+  }
+
+  .card {
+    padding: 24px 0;
+    box-sizing: border-box;
+    display: flex;
+    text-align: center;
+    align-items: center;
+    background: #FFF;
+    border-radius: 16px;
+    margin-top: 24px;
+
+    .item {
+      flex: 1;
+
+      .item_name {
+        color: #666666;
+      }
+
+      .item_num {
+        color: #000000;
+        font-size: 36px;
+        font-weight: 600;
+      }
+
+      .imgs {
+        width: 30px;
+        height: 30px;
+      }
+    }
+  }
+
+  .friends_box,
+  .groups_box {
+    margin-top: 24px;
+    width: 100%;
+    height: 514px;
+    background: #FFF;
+    
+    #friends,
+    #groups {
+      width: 100%;
+      height: 100%;
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/project/pidu/AppDataStatistics/img/down.png b/src/project/pidu/AppDataStatistics/img/down.png
new file mode 100644
index 00000000..4e2fa711
Binary files /dev/null and b/src/project/pidu/AppDataStatistics/img/down.png differ
diff --git a/src/project/pidu/AppDataStatistics/img/location.png b/src/project/pidu/AppDataStatistics/img/location.png
new file mode 100644
index 00000000..c6f04638
Binary files /dev/null and b/src/project/pidu/AppDataStatistics/img/location.png differ
diff --git a/src/project/pidu/AppDataStatistics/img/up.png b/src/project/pidu/AppDataStatistics/img/up.png
new file mode 100644
index 00000000..3f93b69f
Binary files /dev/null and b/src/project/pidu/AppDataStatistics/img/up.png differ