diff --git a/src/assets/img/shuju/top/1.png b/src/assets/img/shuju/top/1.png
new file mode 100644
index 000000000..1f4ddc87f
Binary files /dev/null and b/src/assets/img/shuju/top/1.png differ
diff --git a/src/assets/img/shuju/top/2.png b/src/assets/img/shuju/top/2.png
new file mode 100644
index 000000000..fc2e96ca4
Binary files /dev/null and b/src/assets/img/shuju/top/2.png differ
diff --git a/src/assets/img/shuju/top/3.png b/src/assets/img/shuju/top/3.png
new file mode 100644
index 000000000..7e89e2154
Binary files /dev/null and b/src/assets/img/shuju/top/3.png differ
diff --git a/src/assets/scss/modules/visual/people.scss b/src/assets/scss/modules/visual/people.scss
index dc7217eb4..f382abc1a 100644
--- a/src/assets/scss/modules/visual/people.scss
+++ b/src/assets/scss/modules/visual/people.scss
@@ -6,6 +6,8 @@
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
+    margin-top: 5px;
+
     .g-l {
         width: 850px;
         margin-bottom: 20px;
@@ -177,7 +179,7 @@
 .m-pop {
     @include shield;
     background-color: rgba(#000, 0.9);
-    overflow-y: scroll;
+    overflow-y: auto;
 
     .wrap {
         position: relative;
@@ -288,7 +290,7 @@
 
 .m-relation {
     position: relative;
-    margin-top: 20px;
+    margin-top: 10px;
 
     .title {
         padding: 10px;
@@ -455,7 +457,7 @@
     }
     .tb {
         height: 300px;
-        overflow-y: scroll;
+        overflow-y: auto;
         @include scrollBar;
     }
 }
@@ -463,7 +465,7 @@
 .m-row {
     display: flex;
     justify-content: space-between;
-    margin-top: 20px;
+    margin-top: 10px;
 
     .m-list {
         width: calc(50% - 3px);
@@ -484,11 +486,124 @@
             span {
                 display: block;
             }
+
+            a {
+                display: block;
+                color: rgba(#fff, 0.5);
+                font-size: 22px;
+                font-family: PingFang SC;
+                font-weight: 800;
+                margin-right: 10px;
+                cursor: pointer;
+
+                &.z-on {
+                    color: #fff;
+                    cursor: default;
+
+                    &:hover {
+                        color: #fff;
+                        text-decoration: none;
+                    }
+                }
+
+                &:hover {
+                    color: rgba(#fff, 0.5);
+                    text-decoration: underline;
+                }
+            }
         }
-        .list {
+
+        .list-wrap {
             height: 480px;
-            overflow-y: scroll;
+            overflow-y: auto;
             @include scrollBar;
+
+            .list {
+                .item {
+                    position: relative;
+                    background-color: #104ba4;
+                    padding: 10px 20px;
+                    margin-bottom: 4px;
+                    cursor: pointer;
+                    transition: all ease 0.1s;
+
+                    .item-row {
+                        display: flex;
+                        justify-content: space-between;
+                        align-items: center;
+
+                        .item-l {
+                            width: 25%;
+                        }
+                        .item-r {
+                            width: 75%;
+                        }
+
+                        &:hover {
+                            &::before {
+                                content: "";
+                                position: absolute;
+                                display: block;
+                                left: 0;
+                                top: 0;
+                                bottom: 0;
+                                width: 6px;
+                                background: linear-gradient(270deg, #0336ff, #01b4ff);
+                                border-radius: 2px;
+                            }
+
+                            &::after {
+                                content: "";
+                                position: absolute;
+                                display: block;
+                                left: 15px;
+                                top: 0;
+                                bottom: 0;
+                                margin: auto 0;
+                                width: 0;
+                                height: 0;
+                                border-width: 10px;
+                                border-style: solid;
+                                border-color: transparent transparent transparent #20edff;
+                            }
+                        }
+                    }
+
+                    .item-point {
+                        text-align: center;
+                        padding-left: 10%;
+                        height: 16px;
+                        font-size: 22px;
+                        font-family: PingFang SC;
+                        font-weight: bold;
+                        color: #ffffff;
+                        line-height: 12px;
+                    }
+
+                    .item-title {
+                        padding: 10px 0;
+                        font-size: 18px;
+                        font-family: PingFang SC;
+                        font-weight: 400;
+                        color: #ffffff;
+                        line-height: 24px;
+                    }
+
+                    .item-date {
+                        padding: 10px 0;
+                        border-top: 1px dashed #8398d9;
+                        font-size: 14px;
+                        font-family: PingFang SC;
+                        font-weight: 400;
+                        color: #ffffff;
+                        opacity: 0.67;
+                    }
+                    &:hover {
+                        box-shadow: 0 0 30px 5px inset #22f;
+                        background-color: darken(#104ba4, 12);
+                    }
+                }
+            }
         }
     }
 }
diff --git a/src/views/modules/visual/basicinfo/cpts/demand-info.vue b/src/views/modules/visual/basicinfo/cpts/demand-info.vue
new file mode 100644
index 000000000..31ed33e1e
--- /dev/null
+++ b/src/views/modules/visual/basicinfo/cpts/demand-info.vue
@@ -0,0 +1,503 @@
+<template>
+  <div class="m-pop">
+    <div class="wrap">
+      <cpt-card>
+        <div class="title">
+          <img src="@/assets/img/shuju/title-tip.png" />
+          <span>更多信息</span>
+        </div>
+
+        <div class="btn-close" @click="handleClose">
+          <img src="@/assets/img/shuju/people/close.png" />
+        </div>
+
+        <div
+          :key="'fieldSubList' + index"
+          v-for="(fieldSubList, index) in fieldList"
+        >
+          <div class="list">
+            <div class="item" v-if="index == 0">
+              <span class="item-field">所属网格：</span>
+              <span>{{ gridName }}</span>
+            </div>
+            <div class="item" v-if="index == 0">
+              <span class="item-field">所属小区：</span>
+              <span>{{ xiaoquName }}</span>
+            </div>
+            <div class="item" v-if="index == 0">
+              <span class="item-field">所属楼宇：</span>
+              <span>{{ louName }}-{{ danyuanName }}</span>
+            </div>
+            <div class="item" v-if="index == 0">
+              <span class="item-field">所属家庭：</span>
+              <span>{{ homeName }}</span>
+            </div>
+            <div class="item" :key="field.itemId" v-for="field in fieldSubList">
+              <span class="item-field">{{ field.label }}：</span>
+
+              <span
+                v-if="
+                  field.itemType == 'select' ||
+                  field.itemType == 'radio' ||
+                  field.itemType == 'checkbox' ||
+                  field.itemType == 'cascader'
+                "
+                >{{
+                  info[field.columnName] == null
+                    ? "--"
+                    : getOptionLabel(
+                        field.options,
+                        info[field.columnName],
+                        field.itemType
+                      )
+                }}</span
+              >
+
+              <span v-else>{{
+                info[field.columnName] == null ? "--" : info[field.columnName]
+              }}</span>
+            </div>
+          </div>
+
+          <div class="line"></div>
+        </div>
+
+        <div class="tabs">
+          <div
+            class="tab-btn"
+            @click="subStartGroupIndex"
+            v-if="groupList.length > 9"
+          >
+            <img src="@/assets/img/shuju/people/arrow-double-left.png" />
+          </div>
+          <div
+            v-show="index >= startGroupIndex && index < startGroupIndex + 9"
+            class="tab"
+            :class="groupIndex % groupList.length == index ? 'z-on' : ''"
+            :key="'tab' + index"
+            @click="groupIndex = index"
+            v-for="(item, index) in groupList"
+          >
+            {{ item.label }}
+          </div>
+          <div
+            class="tab-btn"
+            @click="addStartGroupIndex"
+            v-if="groupList.length > 9"
+          >
+            <img src="@/assets/img/shuju/people/arrow-double-right.png" />
+          </div>
+        </div>
+
+        <div
+          :key="'group' + index"
+          v-show="groupIndex % groupList.length == index"
+          v-for="(group, index) in groupList"
+        >
+          <div v-if="group.tableName == 'ic_resi_demand' && Array.isArray(allInfo.ic_resi_demand) && allInfo.ic_resi_demand.length>0">
+            <div
+              class="list"
+              :key="'ic_resi_demand' + infoIndex"
+              v-for="(infoItem, infoIndex) in allInfo.ic_resi_demand"
+            >
+              <div
+                class="item"
+                :key="field.itemId"
+                v-for="field in group.itemList"
+              >
+                <span class="item-field">{{ field.label }}：</span>
+                <span
+                  v-if="
+                    field.itemType == 'select' ||
+                    field.itemType == 'radio' ||
+                    field.itemType == 'checkbox' ||
+                    field.itemType == 'cascader'
+                  "
+                  >{{
+                    infoItem[field.columnName] == null
+                      ? "--"
+                      : getOptionLabel(
+                          field.options,
+                          infoItem[field.columnName],
+                          field.itemType
+                        )
+                  }}</span
+                >
+
+                <span v-else>{{
+                  infoItem[field.columnName] == null
+                    ? "--"
+                    : infoItem[field.columnName]
+                }}</span>
+              </div>
+            </div>
+          </div>
+          <div class="list" v-else>
+            <div
+              class="item"
+              :key="field.itemId"
+              v-for="field in group.itemList"
+            >
+              <span class="item-field">{{ field.label }}：</span>
+              <span
+                v-if="
+                  field.itemType == 'select' ||
+                  field.itemType == 'radio' ||
+                  field.itemType == 'checkbox' ||
+                  field.itemType == 'cascader'
+                "
+                >{{
+                  !allInfo[group.tableName] ||
+                  allInfo[group.tableName][0][field.columnName] == null
+                    ? "--"
+                    : getOptionLabel(
+                        field.options,
+                        allInfo[group.tableName][0][field.columnName],
+                        field.itemType
+                      )
+                }}</span
+              >
+
+              <span v-else>{{
+                !allInfo[group.tableName] ||
+                allInfo[group.tableName][0][field.columnName] == null
+                  ? "--"
+                  : allInfo[group.tableName][0][field.columnName]
+              }}</span>
+            </div>
+          </div>
+        </div>
+      </cpt-card>
+    </div>
+  </div>
+</template>
+
+<script>
+import cptCard from "@/views/modules/visual/cpts/card";
+import { requestPost } from "@/js/dai/request";
+
+export default {
+  name: "demandInfo",
+  props: {
+    userId: {
+      type: String,
+      default: "",
+    },
+    gridName: {
+      type: String,
+      default: "",
+    },
+  },
+
+  components: {
+    cptCard,
+  },
+
+  data() {
+    return {
+      fieldList: [],
+      groupList: [],
+      groupIndex: 0,
+      startGroupIndex: 0,
+      info: {},
+      allInfo: {},
+
+      xiaoquList: [],
+      louList: [],
+      danyuanList: [],
+      homeList: [],
+    };
+  },
+
+  computed: {
+    xiaoquName() {
+      const {
+        xiaoquList,
+        info: { VILLAGE_ID },
+      } = this;
+      if (Array.isArray(xiaoquList) && xiaoquList.length > 0 && VILLAGE_ID) {
+        let item = xiaoquList.find((item) => item.value == VILLAGE_ID);
+        if (item) {
+          return item.label;
+        }
+      }
+      return "";
+    },
+    louName() {
+      const {
+        louList,
+        info: { BUILD_ID },
+      } = this;
+      if (Array.isArray(louList) && louList.length > 0 && BUILD_ID) {
+        let item = louList.find((item) => item.value == BUILD_ID);
+        if (item) {
+          return item.label;
+        }
+      }
+      return "";
+    },
+    danyuanName() {
+      const {
+        danyuanList,
+        info: { UNIT_ID },
+      } = this;
+      if (Array.isArray(danyuanList) && danyuanList.length > 0 && UNIT_ID) {
+        let item = danyuanList.find((item) => item.value == UNIT_ID);
+        if (item) {
+          return item.label;
+        }
+      }
+      return "";
+    },
+    danyuanName() {
+      const {
+        danyuanList,
+        info: { UNIT_ID },
+      } = this;
+      if (Array.isArray(danyuanList) && danyuanList.length > 0 && UNIT_ID) {
+        let item = danyuanList.find((item) => item.value == UNIT_ID);
+        if (item) {
+          return item.label;
+        }
+      }
+      return "";
+    },
+    homeName() {
+      const {
+        homeList,
+        info: { HOME_ID },
+      } = this;
+      if (Array.isArray(homeList) && homeList.length > 0 && HOME_ID) {
+        let item = homeList.find((item) => item.value == HOME_ID);
+        if (item) {
+          return item.label;
+        }
+      }
+      return "";
+    },
+  },
+
+  watch: {
+    userId() {
+      this.getApiData();
+    },
+  },
+
+  mounted() {
+    this.getApiData();
+  },
+
+  methods: {
+    addStartGroupIndex() {
+      const { startGroupIndex, groupList } = this;
+      if (startGroupIndex < groupList.length - 9) {
+        this.startGroupIndex = startGroupIndex + 1;
+      } else {
+        this.startGroupIndex = groupList.length - 9;
+      }
+    },
+    subStartGroupIndex() {
+      const { startGroupIndex, groupList } = this;
+      if (startGroupIndex > 0) {
+        this.startGroupIndex = startGroupIndex - 1;
+      } else {
+        this.startGroupIndex = 0;
+      }
+    },
+    handleClose() {
+      this.$emit("close");
+    },
+
+    async getApiData() {
+      await this.getField();
+      await this.getInfo();
+      this.getXiaoquList();
+      this.getLouList();
+      this.getDanyuanList();
+      this.getHomeList();
+    },
+
+    getOptionLabel(options, value, type = "") {
+      if (Array.isArray(options)) {
+        let valueArr = value.split(",");
+        if (type == "cascader") {
+          if (valueArr.length > 0) {
+            let level1 = options.find((item) => item.value == valueArr[0]);
+            if (level1) {
+              if (valueArr.length > 1 && level1.children) {
+                let level2 = level1.children.find(
+                  (item) => item.value == valueArr[1]
+                );
+                if (level2) {
+                  return level1.label + "-" + level2.label;
+                }
+              }
+              return level1.label;
+            }
+          }
+        } else {
+          return valueArr
+            .map((val) => {
+              let item = options.find((item) => item.value == val);
+              if (item && item.label) {
+                return item.label;
+              }
+              return "--";
+            })
+            .join("、");
+        }
+      }
+      return "--";
+    },
+
+    //加载组织数据
+    async getField() {
+      const url = "/oper/customize/icform/getcustomerform";
+
+      const { data, code, msg } = await requestPost(url, {
+        dynamic: true,
+        formCode: "resi_base_info",
+      });
+
+      if (code === 0) {
+        this.groupList = data.groupList;
+        this.fieldList = (function (arr) {
+          let col = [];
+          let ele = [];
+          for (let i = 0; i < arr.length; i++) {
+            let item = arr[i];
+            if (item.itemType == "divider" || i == arr.length - 1) {
+              col.push([...ele]);
+              ele = [];
+            } else {
+              ele.push(item);
+            }
+          }
+          return col;
+        })(data.itemList);
+
+        this.fieldList.forEach((subList, index) => {
+          subList.forEach(async (item, subIndex) => {
+            if (item.optionSourceType == "remote" && item.optionSourceValue) {
+              this.fieldList[index][subIndex].options = await this.getOptions(
+                item.optionSourceValue
+              );
+            }
+          });
+        });
+      } else {
+        this.$message.error(msg);
+      }
+    },
+
+    //加载组织数据
+    async getInfo() {
+      const url = "/epmetuser/icresiuser/detail";
+
+      const { data, code, msg } = await requestPost(url, {
+        icResiUserId: this.userId,
+        formCode: "resi_base_info",
+      });
+
+      if (code === 0) {
+        this.info = data.ic_resi_user[0];
+        this.allInfo = data;
+
+        this.fieldList.forEach((subList, index) => {
+          subList.forEach((item, subIndex) => {
+            if (
+              item.itemType == "radio" &&
+              item.childGroup &&
+              this.allInfo[item.tableName] &&
+              this.allInfo[item.tableName][0][item.columnName] == "1"
+            ) {
+              this.groupList = [...this.groupList, item.childGroup];
+            }
+          });
+        });
+        console.log("1111111111111111111111111", this.groupList);
+
+        this.groupList.forEach((subList, index) => {
+          subList.itemList.forEach(async (item, subIndex) => {
+            if (item.optionSourceType == "remote" && item.optionSourceValue) {
+              this.groupList[index].itemList[subIndex].options =
+                await this.getOptions(item.optionSourceValue);
+            }
+          });
+        });
+      } else {
+        this.$message.error(msg);
+      }
+    },
+
+    //加载组织数据
+    async getOptions(url) {
+      if (!url) return [];
+
+      const { data, code, msg } = await requestPost(url, {});
+
+      if (code === 0) {
+        return data;
+      } else {
+        return [];
+      }
+    },
+
+    async getXiaoquList() {
+      const url = "/gov/org/icneighborhood/neighborhoodoption";
+
+      const { data, code, msg } = await requestPost(url, {
+        agencyId: this.info.AGENCY_ID,
+        gridId: this.info.GRID_ID,
+      });
+
+      if (code === 0) {
+        this.xiaoquList = data;
+      } else {
+        this.$message.error(msg);
+      }
+    },
+    async getLouList() {
+      const url = "/gov/org/icbuilding/buildingoption";
+
+      const { data, code, msg } = await requestPost(url, {
+        neighborHoodId: this.info.VILLAGE_ID,
+      });
+
+      if (code === 0) {
+        this.louList = data;
+      } else {
+        this.$message.error(msg);
+      }
+    },
+    async getDanyuanList() {
+      const url = "/gov/org/icbuildingunit/unitoption";
+
+      const { data, code, msg } = await requestPost(url, {
+        buildingId: this.info.BUILD_ID,
+      });
+
+      if (code === 0) {
+        this.danyuanList = data;
+      } else {
+        this.$message.error(msg);
+      }
+    },
+    async getHomeList() {
+      const url = "/gov/org/ichouse/houseoption";
+
+      const { data, code, msg } = await requestPost(url, {
+        unitId: this.info.UNIT_ID,
+      });
+
+      if (code === 0) {
+        this.homeList = data;
+      } else {
+        this.$message.error(msg);
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" src="@/assets/scss/modules/visual/people.scss" scoped></style>
diff --git a/src/views/modules/visual/basicinfo/cpts/incident-info.vue b/src/views/modules/visual/basicinfo/cpts/incident-info.vue
new file mode 100644
index 000000000..31ed33e1e
--- /dev/null
+++ b/src/views/modules/visual/basicinfo/cpts/incident-info.vue
@@ -0,0 +1,503 @@
+<template>
+  <div class="m-pop">
+    <div class="wrap">
+      <cpt-card>
+        <div class="title">
+          <img src="@/assets/img/shuju/title-tip.png" />
+          <span>更多信息</span>
+        </div>
+
+        <div class="btn-close" @click="handleClose">
+          <img src="@/assets/img/shuju/people/close.png" />
+        </div>
+
+        <div
+          :key="'fieldSubList' + index"
+          v-for="(fieldSubList, index) in fieldList"
+        >
+          <div class="list">
+            <div class="item" v-if="index == 0">
+              <span class="item-field">所属网格：</span>
+              <span>{{ gridName }}</span>
+            </div>
+            <div class="item" v-if="index == 0">
+              <span class="item-field">所属小区：</span>
+              <span>{{ xiaoquName }}</span>
+            </div>
+            <div class="item" v-if="index == 0">
+              <span class="item-field">所属楼宇：</span>
+              <span>{{ louName }}-{{ danyuanName }}</span>
+            </div>
+            <div class="item" v-if="index == 0">
+              <span class="item-field">所属家庭：</span>
+              <span>{{ homeName }}</span>
+            </div>
+            <div class="item" :key="field.itemId" v-for="field in fieldSubList">
+              <span class="item-field">{{ field.label }}：</span>
+
+              <span
+                v-if="
+                  field.itemType == 'select' ||
+                  field.itemType == 'radio' ||
+                  field.itemType == 'checkbox' ||
+                  field.itemType == 'cascader'
+                "
+                >{{
+                  info[field.columnName] == null
+                    ? "--"
+                    : getOptionLabel(
+                        field.options,
+                        info[field.columnName],
+                        field.itemType
+                      )
+                }}</span
+              >
+
+              <span v-else>{{
+                info[field.columnName] == null ? "--" : info[field.columnName]
+              }}</span>
+            </div>
+          </div>
+
+          <div class="line"></div>
+        </div>
+
+        <div class="tabs">
+          <div
+            class="tab-btn"
+            @click="subStartGroupIndex"
+            v-if="groupList.length > 9"
+          >
+            <img src="@/assets/img/shuju/people/arrow-double-left.png" />
+          </div>
+          <div
+            v-show="index >= startGroupIndex && index < startGroupIndex + 9"
+            class="tab"
+            :class="groupIndex % groupList.length == index ? 'z-on' : ''"
+            :key="'tab' + index"
+            @click="groupIndex = index"
+            v-for="(item, index) in groupList"
+          >
+            {{ item.label }}
+          </div>
+          <div
+            class="tab-btn"
+            @click="addStartGroupIndex"
+            v-if="groupList.length > 9"
+          >
+            <img src="@/assets/img/shuju/people/arrow-double-right.png" />
+          </div>
+        </div>
+
+        <div
+          :key="'group' + index"
+          v-show="groupIndex % groupList.length == index"
+          v-for="(group, index) in groupList"
+        >
+          <div v-if="group.tableName == 'ic_resi_demand' && Array.isArray(allInfo.ic_resi_demand) && allInfo.ic_resi_demand.length>0">
+            <div
+              class="list"
+              :key="'ic_resi_demand' + infoIndex"
+              v-for="(infoItem, infoIndex) in allInfo.ic_resi_demand"
+            >
+              <div
+                class="item"
+                :key="field.itemId"
+                v-for="field in group.itemList"
+              >
+                <span class="item-field">{{ field.label }}：</span>
+                <span
+                  v-if="
+                    field.itemType == 'select' ||
+                    field.itemType == 'radio' ||
+                    field.itemType == 'checkbox' ||
+                    field.itemType == 'cascader'
+                  "
+                  >{{
+                    infoItem[field.columnName] == null
+                      ? "--"
+                      : getOptionLabel(
+                          field.options,
+                          infoItem[field.columnName],
+                          field.itemType
+                        )
+                  }}</span
+                >
+
+                <span v-else>{{
+                  infoItem[field.columnName] == null
+                    ? "--"
+                    : infoItem[field.columnName]
+                }}</span>
+              </div>
+            </div>
+          </div>
+          <div class="list" v-else>
+            <div
+              class="item"
+              :key="field.itemId"
+              v-for="field in group.itemList"
+            >
+              <span class="item-field">{{ field.label }}：</span>
+              <span
+                v-if="
+                  field.itemType == 'select' ||
+                  field.itemType == 'radio' ||
+                  field.itemType == 'checkbox' ||
+                  field.itemType == 'cascader'
+                "
+                >{{
+                  !allInfo[group.tableName] ||
+                  allInfo[group.tableName][0][field.columnName] == null
+                    ? "--"
+                    : getOptionLabel(
+                        field.options,
+                        allInfo[group.tableName][0][field.columnName],
+                        field.itemType
+                      )
+                }}</span
+              >
+
+              <span v-else>{{
+                !allInfo[group.tableName] ||
+                allInfo[group.tableName][0][field.columnName] == null
+                  ? "--"
+                  : allInfo[group.tableName][0][field.columnName]
+              }}</span>
+            </div>
+          </div>
+        </div>
+      </cpt-card>
+    </div>
+  </div>
+</template>
+
+<script>
+import cptCard from "@/views/modules/visual/cpts/card";
+import { requestPost } from "@/js/dai/request";
+
+export default {
+  name: "demandInfo",
+  props: {
+    userId: {
+      type: String,
+      default: "",
+    },
+    gridName: {
+      type: String,
+      default: "",
+    },
+  },
+
+  components: {
+    cptCard,
+  },
+
+  data() {
+    return {
+      fieldList: [],
+      groupList: [],
+      groupIndex: 0,
+      startGroupIndex: 0,
+      info: {},
+      allInfo: {},
+
+      xiaoquList: [],
+      louList: [],
+      danyuanList: [],
+      homeList: [],
+    };
+  },
+
+  computed: {
+    xiaoquName() {
+      const {
+        xiaoquList,
+        info: { VILLAGE_ID },
+      } = this;
+      if (Array.isArray(xiaoquList) && xiaoquList.length > 0 && VILLAGE_ID) {
+        let item = xiaoquList.find((item) => item.value == VILLAGE_ID);
+        if (item) {
+          return item.label;
+        }
+      }
+      return "";
+    },
+    louName() {
+      const {
+        louList,
+        info: { BUILD_ID },
+      } = this;
+      if (Array.isArray(louList) && louList.length > 0 && BUILD_ID) {
+        let item = louList.find((item) => item.value == BUILD_ID);
+        if (item) {
+          return item.label;
+        }
+      }
+      return "";
+    },
+    danyuanName() {
+      const {
+        danyuanList,
+        info: { UNIT_ID },
+      } = this;
+      if (Array.isArray(danyuanList) && danyuanList.length > 0 && UNIT_ID) {
+        let item = danyuanList.find((item) => item.value == UNIT_ID);
+        if (item) {
+          return item.label;
+        }
+      }
+      return "";
+    },
+    danyuanName() {
+      const {
+        danyuanList,
+        info: { UNIT_ID },
+      } = this;
+      if (Array.isArray(danyuanList) && danyuanList.length > 0 && UNIT_ID) {
+        let item = danyuanList.find((item) => item.value == UNIT_ID);
+        if (item) {
+          return item.label;
+        }
+      }
+      return "";
+    },
+    homeName() {
+      const {
+        homeList,
+        info: { HOME_ID },
+      } = this;
+      if (Array.isArray(homeList) && homeList.length > 0 && HOME_ID) {
+        let item = homeList.find((item) => item.value == HOME_ID);
+        if (item) {
+          return item.label;
+        }
+      }
+      return "";
+    },
+  },
+
+  watch: {
+    userId() {
+      this.getApiData();
+    },
+  },
+
+  mounted() {
+    this.getApiData();
+  },
+
+  methods: {
+    addStartGroupIndex() {
+      const { startGroupIndex, groupList } = this;
+      if (startGroupIndex < groupList.length - 9) {
+        this.startGroupIndex = startGroupIndex + 1;
+      } else {
+        this.startGroupIndex = groupList.length - 9;
+      }
+    },
+    subStartGroupIndex() {
+      const { startGroupIndex, groupList } = this;
+      if (startGroupIndex > 0) {
+        this.startGroupIndex = startGroupIndex - 1;
+      } else {
+        this.startGroupIndex = 0;
+      }
+    },
+    handleClose() {
+      this.$emit("close");
+    },
+
+    async getApiData() {
+      await this.getField();
+      await this.getInfo();
+      this.getXiaoquList();
+      this.getLouList();
+      this.getDanyuanList();
+      this.getHomeList();
+    },
+
+    getOptionLabel(options, value, type = "") {
+      if (Array.isArray(options)) {
+        let valueArr = value.split(",");
+        if (type == "cascader") {
+          if (valueArr.length > 0) {
+            let level1 = options.find((item) => item.value == valueArr[0]);
+            if (level1) {
+              if (valueArr.length > 1 && level1.children) {
+                let level2 = level1.children.find(
+                  (item) => item.value == valueArr[1]
+                );
+                if (level2) {
+                  return level1.label + "-" + level2.label;
+                }
+              }
+              return level1.label;
+            }
+          }
+        } else {
+          return valueArr
+            .map((val) => {
+              let item = options.find((item) => item.value == val);
+              if (item && item.label) {
+                return item.label;
+              }
+              return "--";
+            })
+            .join("、");
+        }
+      }
+      return "--";
+    },
+
+    //加载组织数据
+    async getField() {
+      const url = "/oper/customize/icform/getcustomerform";
+
+      const { data, code, msg } = await requestPost(url, {
+        dynamic: true,
+        formCode: "resi_base_info",
+      });
+
+      if (code === 0) {
+        this.groupList = data.groupList;
+        this.fieldList = (function (arr) {
+          let col = [];
+          let ele = [];
+          for (let i = 0; i < arr.length; i++) {
+            let item = arr[i];
+            if (item.itemType == "divider" || i == arr.length - 1) {
+              col.push([...ele]);
+              ele = [];
+            } else {
+              ele.push(item);
+            }
+          }
+          return col;
+        })(data.itemList);
+
+        this.fieldList.forEach((subList, index) => {
+          subList.forEach(async (item, subIndex) => {
+            if (item.optionSourceType == "remote" && item.optionSourceValue) {
+              this.fieldList[index][subIndex].options = await this.getOptions(
+                item.optionSourceValue
+              );
+            }
+          });
+        });
+      } else {
+        this.$message.error(msg);
+      }
+    },
+
+    //加载组织数据
+    async getInfo() {
+      const url = "/epmetuser/icresiuser/detail";
+
+      const { data, code, msg } = await requestPost(url, {
+        icResiUserId: this.userId,
+        formCode: "resi_base_info",
+      });
+
+      if (code === 0) {
+        this.info = data.ic_resi_user[0];
+        this.allInfo = data;
+
+        this.fieldList.forEach((subList, index) => {
+          subList.forEach((item, subIndex) => {
+            if (
+              item.itemType == "radio" &&
+              item.childGroup &&
+              this.allInfo[item.tableName] &&
+              this.allInfo[item.tableName][0][item.columnName] == "1"
+            ) {
+              this.groupList = [...this.groupList, item.childGroup];
+            }
+          });
+        });
+        console.log("1111111111111111111111111", this.groupList);
+
+        this.groupList.forEach((subList, index) => {
+          subList.itemList.forEach(async (item, subIndex) => {
+            if (item.optionSourceType == "remote" && item.optionSourceValue) {
+              this.groupList[index].itemList[subIndex].options =
+                await this.getOptions(item.optionSourceValue);
+            }
+          });
+        });
+      } else {
+        this.$message.error(msg);
+      }
+    },
+
+    //加载组织数据
+    async getOptions(url) {
+      if (!url) return [];
+
+      const { data, code, msg } = await requestPost(url, {});
+
+      if (code === 0) {
+        return data;
+      } else {
+        return [];
+      }
+    },
+
+    async getXiaoquList() {
+      const url = "/gov/org/icneighborhood/neighborhoodoption";
+
+      const { data, code, msg } = await requestPost(url, {
+        agencyId: this.info.AGENCY_ID,
+        gridId: this.info.GRID_ID,
+      });
+
+      if (code === 0) {
+        this.xiaoquList = data;
+      } else {
+        this.$message.error(msg);
+      }
+    },
+    async getLouList() {
+      const url = "/gov/org/icbuilding/buildingoption";
+
+      const { data, code, msg } = await requestPost(url, {
+        neighborHoodId: this.info.VILLAGE_ID,
+      });
+
+      if (code === 0) {
+        this.louList = data;
+      } else {
+        this.$message.error(msg);
+      }
+    },
+    async getDanyuanList() {
+      const url = "/gov/org/icbuildingunit/unitoption";
+
+      const { data, code, msg } = await requestPost(url, {
+        buildingId: this.info.BUILD_ID,
+      });
+
+      if (code === 0) {
+        this.danyuanList = data;
+      } else {
+        this.$message.error(msg);
+      }
+    },
+    async getHomeList() {
+      const url = "/gov/org/ichouse/houseoption";
+
+      const { data, code, msg } = await requestPost(url, {
+        unitId: this.info.UNIT_ID,
+      });
+
+      if (code === 0) {
+        this.homeList = data;
+      } else {
+        this.$message.error(msg);
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" src="@/assets/scss/modules/visual/people.scss" scoped></style>
diff --git a/src/views/modules/visual/basicinfo/cpts/topic-info.vue b/src/views/modules/visual/basicinfo/cpts/topic-info.vue
new file mode 100644
index 000000000..31ed33e1e
--- /dev/null
+++ b/src/views/modules/visual/basicinfo/cpts/topic-info.vue
@@ -0,0 +1,503 @@
+<template>
+  <div class="m-pop">
+    <div class="wrap">
+      <cpt-card>
+        <div class="title">
+          <img src="@/assets/img/shuju/title-tip.png" />
+          <span>更多信息</span>
+        </div>
+
+        <div class="btn-close" @click="handleClose">
+          <img src="@/assets/img/shuju/people/close.png" />
+        </div>
+
+        <div
+          :key="'fieldSubList' + index"
+          v-for="(fieldSubList, index) in fieldList"
+        >
+          <div class="list">
+            <div class="item" v-if="index == 0">
+              <span class="item-field">所属网格：</span>
+              <span>{{ gridName }}</span>
+            </div>
+            <div class="item" v-if="index == 0">
+              <span class="item-field">所属小区：</span>
+              <span>{{ xiaoquName }}</span>
+            </div>
+            <div class="item" v-if="index == 0">
+              <span class="item-field">所属楼宇：</span>
+              <span>{{ louName }}-{{ danyuanName }}</span>
+            </div>
+            <div class="item" v-if="index == 0">
+              <span class="item-field">所属家庭：</span>
+              <span>{{ homeName }}</span>
+            </div>
+            <div class="item" :key="field.itemId" v-for="field in fieldSubList">
+              <span class="item-field">{{ field.label }}：</span>
+
+              <span
+                v-if="
+                  field.itemType == 'select' ||
+                  field.itemType == 'radio' ||
+                  field.itemType == 'checkbox' ||
+                  field.itemType == 'cascader'
+                "
+                >{{
+                  info[field.columnName] == null
+                    ? "--"
+                    : getOptionLabel(
+                        field.options,
+                        info[field.columnName],
+                        field.itemType
+                      )
+                }}</span
+              >
+
+              <span v-else>{{
+                info[field.columnName] == null ? "--" : info[field.columnName]
+              }}</span>
+            </div>
+          </div>
+
+          <div class="line"></div>
+        </div>
+
+        <div class="tabs">
+          <div
+            class="tab-btn"
+            @click="subStartGroupIndex"
+            v-if="groupList.length > 9"
+          >
+            <img src="@/assets/img/shuju/people/arrow-double-left.png" />
+          </div>
+          <div
+            v-show="index >= startGroupIndex && index < startGroupIndex + 9"
+            class="tab"
+            :class="groupIndex % groupList.length == index ? 'z-on' : ''"
+            :key="'tab' + index"
+            @click="groupIndex = index"
+            v-for="(item, index) in groupList"
+          >
+            {{ item.label }}
+          </div>
+          <div
+            class="tab-btn"
+            @click="addStartGroupIndex"
+            v-if="groupList.length > 9"
+          >
+            <img src="@/assets/img/shuju/people/arrow-double-right.png" />
+          </div>
+        </div>
+
+        <div
+          :key="'group' + index"
+          v-show="groupIndex % groupList.length == index"
+          v-for="(group, index) in groupList"
+        >
+          <div v-if="group.tableName == 'ic_resi_demand' && Array.isArray(allInfo.ic_resi_demand) && allInfo.ic_resi_demand.length>0">
+            <div
+              class="list"
+              :key="'ic_resi_demand' + infoIndex"
+              v-for="(infoItem, infoIndex) in allInfo.ic_resi_demand"
+            >
+              <div
+                class="item"
+                :key="field.itemId"
+                v-for="field in group.itemList"
+              >
+                <span class="item-field">{{ field.label }}：</span>
+                <span
+                  v-if="
+                    field.itemType == 'select' ||
+                    field.itemType == 'radio' ||
+                    field.itemType == 'checkbox' ||
+                    field.itemType == 'cascader'
+                  "
+                  >{{
+                    infoItem[field.columnName] == null
+                      ? "--"
+                      : getOptionLabel(
+                          field.options,
+                          infoItem[field.columnName],
+                          field.itemType
+                        )
+                  }}</span
+                >
+
+                <span v-else>{{
+                  infoItem[field.columnName] == null
+                    ? "--"
+                    : infoItem[field.columnName]
+                }}</span>
+              </div>
+            </div>
+          </div>
+          <div class="list" v-else>
+            <div
+              class="item"
+              :key="field.itemId"
+              v-for="field in group.itemList"
+            >
+              <span class="item-field">{{ field.label }}：</span>
+              <span
+                v-if="
+                  field.itemType == 'select' ||
+                  field.itemType == 'radio' ||
+                  field.itemType == 'checkbox' ||
+                  field.itemType == 'cascader'
+                "
+                >{{
+                  !allInfo[group.tableName] ||
+                  allInfo[group.tableName][0][field.columnName] == null
+                    ? "--"
+                    : getOptionLabel(
+                        field.options,
+                        allInfo[group.tableName][0][field.columnName],
+                        field.itemType
+                      )
+                }}</span
+              >
+
+              <span v-else>{{
+                !allInfo[group.tableName] ||
+                allInfo[group.tableName][0][field.columnName] == null
+                  ? "--"
+                  : allInfo[group.tableName][0][field.columnName]
+              }}</span>
+            </div>
+          </div>
+        </div>
+      </cpt-card>
+    </div>
+  </div>
+</template>
+
+<script>
+import cptCard from "@/views/modules/visual/cpts/card";
+import { requestPost } from "@/js/dai/request";
+
+export default {
+  name: "demandInfo",
+  props: {
+    userId: {
+      type: String,
+      default: "",
+    },
+    gridName: {
+      type: String,
+      default: "",
+    },
+  },
+
+  components: {
+    cptCard,
+  },
+
+  data() {
+    return {
+      fieldList: [],
+      groupList: [],
+      groupIndex: 0,
+      startGroupIndex: 0,
+      info: {},
+      allInfo: {},
+
+      xiaoquList: [],
+      louList: [],
+      danyuanList: [],
+      homeList: [],
+    };
+  },
+
+  computed: {
+    xiaoquName() {
+      const {
+        xiaoquList,
+        info: { VILLAGE_ID },
+      } = this;
+      if (Array.isArray(xiaoquList) && xiaoquList.length > 0 && VILLAGE_ID) {
+        let item = xiaoquList.find((item) => item.value == VILLAGE_ID);
+        if (item) {
+          return item.label;
+        }
+      }
+      return "";
+    },
+    louName() {
+      const {
+        louList,
+        info: { BUILD_ID },
+      } = this;
+      if (Array.isArray(louList) && louList.length > 0 && BUILD_ID) {
+        let item = louList.find((item) => item.value == BUILD_ID);
+        if (item) {
+          return item.label;
+        }
+      }
+      return "";
+    },
+    danyuanName() {
+      const {
+        danyuanList,
+        info: { UNIT_ID },
+      } = this;
+      if (Array.isArray(danyuanList) && danyuanList.length > 0 && UNIT_ID) {
+        let item = danyuanList.find((item) => item.value == UNIT_ID);
+        if (item) {
+          return item.label;
+        }
+      }
+      return "";
+    },
+    danyuanName() {
+      const {
+        danyuanList,
+        info: { UNIT_ID },
+      } = this;
+      if (Array.isArray(danyuanList) && danyuanList.length > 0 && UNIT_ID) {
+        let item = danyuanList.find((item) => item.value == UNIT_ID);
+        if (item) {
+          return item.label;
+        }
+      }
+      return "";
+    },
+    homeName() {
+      const {
+        homeList,
+        info: { HOME_ID },
+      } = this;
+      if (Array.isArray(homeList) && homeList.length > 0 && HOME_ID) {
+        let item = homeList.find((item) => item.value == HOME_ID);
+        if (item) {
+          return item.label;
+        }
+      }
+      return "";
+    },
+  },
+
+  watch: {
+    userId() {
+      this.getApiData();
+    },
+  },
+
+  mounted() {
+    this.getApiData();
+  },
+
+  methods: {
+    addStartGroupIndex() {
+      const { startGroupIndex, groupList } = this;
+      if (startGroupIndex < groupList.length - 9) {
+        this.startGroupIndex = startGroupIndex + 1;
+      } else {
+        this.startGroupIndex = groupList.length - 9;
+      }
+    },
+    subStartGroupIndex() {
+      const { startGroupIndex, groupList } = this;
+      if (startGroupIndex > 0) {
+        this.startGroupIndex = startGroupIndex - 1;
+      } else {
+        this.startGroupIndex = 0;
+      }
+    },
+    handleClose() {
+      this.$emit("close");
+    },
+
+    async getApiData() {
+      await this.getField();
+      await this.getInfo();
+      this.getXiaoquList();
+      this.getLouList();
+      this.getDanyuanList();
+      this.getHomeList();
+    },
+
+    getOptionLabel(options, value, type = "") {
+      if (Array.isArray(options)) {
+        let valueArr = value.split(",");
+        if (type == "cascader") {
+          if (valueArr.length > 0) {
+            let level1 = options.find((item) => item.value == valueArr[0]);
+            if (level1) {
+              if (valueArr.length > 1 && level1.children) {
+                let level2 = level1.children.find(
+                  (item) => item.value == valueArr[1]
+                );
+                if (level2) {
+                  return level1.label + "-" + level2.label;
+                }
+              }
+              return level1.label;
+            }
+          }
+        } else {
+          return valueArr
+            .map((val) => {
+              let item = options.find((item) => item.value == val);
+              if (item && item.label) {
+                return item.label;
+              }
+              return "--";
+            })
+            .join("、");
+        }
+      }
+      return "--";
+    },
+
+    //加载组织数据
+    async getField() {
+      const url = "/oper/customize/icform/getcustomerform";
+
+      const { data, code, msg } = await requestPost(url, {
+        dynamic: true,
+        formCode: "resi_base_info",
+      });
+
+      if (code === 0) {
+        this.groupList = data.groupList;
+        this.fieldList = (function (arr) {
+          let col = [];
+          let ele = [];
+          for (let i = 0; i < arr.length; i++) {
+            let item = arr[i];
+            if (item.itemType == "divider" || i == arr.length - 1) {
+              col.push([...ele]);
+              ele = [];
+            } else {
+              ele.push(item);
+            }
+          }
+          return col;
+        })(data.itemList);
+
+        this.fieldList.forEach((subList, index) => {
+          subList.forEach(async (item, subIndex) => {
+            if (item.optionSourceType == "remote" && item.optionSourceValue) {
+              this.fieldList[index][subIndex].options = await this.getOptions(
+                item.optionSourceValue
+              );
+            }
+          });
+        });
+      } else {
+        this.$message.error(msg);
+      }
+    },
+
+    //加载组织数据
+    async getInfo() {
+      const url = "/epmetuser/icresiuser/detail";
+
+      const { data, code, msg } = await requestPost(url, {
+        icResiUserId: this.userId,
+        formCode: "resi_base_info",
+      });
+
+      if (code === 0) {
+        this.info = data.ic_resi_user[0];
+        this.allInfo = data;
+
+        this.fieldList.forEach((subList, index) => {
+          subList.forEach((item, subIndex) => {
+            if (
+              item.itemType == "radio" &&
+              item.childGroup &&
+              this.allInfo[item.tableName] &&
+              this.allInfo[item.tableName][0][item.columnName] == "1"
+            ) {
+              this.groupList = [...this.groupList, item.childGroup];
+            }
+          });
+        });
+        console.log("1111111111111111111111111", this.groupList);
+
+        this.groupList.forEach((subList, index) => {
+          subList.itemList.forEach(async (item, subIndex) => {
+            if (item.optionSourceType == "remote" && item.optionSourceValue) {
+              this.groupList[index].itemList[subIndex].options =
+                await this.getOptions(item.optionSourceValue);
+            }
+          });
+        });
+      } else {
+        this.$message.error(msg);
+      }
+    },
+
+    //加载组织数据
+    async getOptions(url) {
+      if (!url) return [];
+
+      const { data, code, msg } = await requestPost(url, {});
+
+      if (code === 0) {
+        return data;
+      } else {
+        return [];
+      }
+    },
+
+    async getXiaoquList() {
+      const url = "/gov/org/icneighborhood/neighborhoodoption";
+
+      const { data, code, msg } = await requestPost(url, {
+        agencyId: this.info.AGENCY_ID,
+        gridId: this.info.GRID_ID,
+      });
+
+      if (code === 0) {
+        this.xiaoquList = data;
+      } else {
+        this.$message.error(msg);
+      }
+    },
+    async getLouList() {
+      const url = "/gov/org/icbuilding/buildingoption";
+
+      const { data, code, msg } = await requestPost(url, {
+        neighborHoodId: this.info.VILLAGE_ID,
+      });
+
+      if (code === 0) {
+        this.louList = data;
+      } else {
+        this.$message.error(msg);
+      }
+    },
+    async getDanyuanList() {
+      const url = "/gov/org/icbuildingunit/unitoption";
+
+      const { data, code, msg } = await requestPost(url, {
+        buildingId: this.info.BUILD_ID,
+      });
+
+      if (code === 0) {
+        this.danyuanList = data;
+      } else {
+        this.$message.error(msg);
+      }
+    },
+    async getHomeList() {
+      const url = "/gov/org/ichouse/houseoption";
+
+      const { data, code, msg } = await requestPost(url, {
+        unitId: this.info.UNIT_ID,
+      });
+
+      if (code === 0) {
+        this.homeList = data;
+      } else {
+        this.$message.error(msg);
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" src="@/assets/scss/modules/visual/people.scss" scoped></style>
diff --git a/src/views/modules/visual/basicinfo/people.vue b/src/views/modules/visual/basicinfo/people.vue
index e62bd04bf..4335105fd 100644
--- a/src/views/modules/visual/basicinfo/people.vue
+++ b/src/views/modules/visual/basicinfo/people.vue
@@ -304,16 +304,17 @@
               :loading="demand.loading"
               :header="demand.header"
               :list="demand.list"
+              @operate="handleOperateDemandList"
             ></cpt-tb>
 
-            <div class="m-pagination">
+            <div class="m-pagination" v-if="demand.total > demand.pageSize">
               <el-pagination
                 :current-page="demand.pageNo"
                 :page-size="demand.pageSize"
                 :total="demand.total"
                 background
                 layout="prev, pager, next"
-                @current-change="handlePageNoChange_demand"
+                @current-change="handlePageNoChangeDemand"
               >
               </el-pagination>
             </div>
@@ -326,9 +327,71 @@
           <cpt-card>
             <div class="title">
               <img src="@/assets/img/shuju/title-tip.png" />
-              <span>上报事件</span>
+              <a
+                :class="{ 'z-on': showedIncidentOrTopic == 'incident' }"
+                @click="showedIncidentOrTopic = 'incident'"
+                >上报事件</a
+              >
+              <a
+                :class="{ 'z-on': showedIncidentOrTopic == 'topic' }"
+                @click="showedIncidentOrTopic = 'topic'"
+                >发布话题</a
+              >
+            </div>
+            <div class="list-wrap" v-show="showedIncidentOrTopic == 'incident'">
+              <div class="list">
+                <div
+                  class="item"
+                  :key="'incident' + index"
+                  v-for="(item, index) in incident.list"
+                  @click="handleClickIncident(index)"
+                >
+                  <div class="item-title">{{ item.eventContent }}</div>
+                  <div class="item-date">{{ item.reportTime }}</div>
+                </div>
+              </div>
+
+              <div
+                class="m-pagination"
+                v-if="incident.total > incident.pageSize"
+              >
+                <el-pagination
+                  :current-page="incident.pageNo"
+                  :page-size="incident.pageSize"
+                  :total="incident.total"
+                  background
+                  layout="prev, pager, next"
+                  @current-change="handlePageNoChangeIncident"
+                >
+                </el-pagination>
+              </div>
+            </div>
+
+            <div class="list-wrap" v-show="showedIncidentOrTopic == 'topic'">
+              <div class="list">
+                <div
+                  class="item"
+                  :key="'topic' + index"
+                  v-for="(item, index) in topic.list"
+                  @click="handleClickTopic(index)"
+                >
+                  <div class="item-title">{{ item.eventContent }}</div>
+                  <div class="item-date">{{ item.reportTime }}</div>
+                </div>
+              </div>
+
+              <div class="m-pagination" v-if="topic.total > topic.pageSize">
+                <el-pagination
+                  :current-page="topic.pageNo"
+                  :page-size="topic.pageSize"
+                  :total="topic.total"
+                  background
+                  layout="prev, pager, next"
+                  @current-change="handlePageNoChangeTopic"
+                >
+                </el-pagination>
+              </div>
             </div>
-            <div class="list"></div>
           </cpt-card>
         </div>
 
@@ -338,11 +401,67 @@
               <img src="@/assets/img/shuju/title-tip.png" />
               <span>积分记录</span>
             </div>
-            <div class="list"></div>
+
+            <div class="list-wrap">
+              <div class="list">
+                <div
+                  class="item"
+                  :key="'point' + index"
+                  v-for="(item, index) in point.list"
+                  @click="handleClickPoint(index)"
+                >
+                  <div class="item-row">
+                    <div class="item-l">
+                      <div class="item-point">{{ item.point }}</div>
+                    </div>
+                    <div class="item-r">
+                      <div class="item-title">{{ item.title }}</div>
+                      <div class="item-date">{{ item.dateTime }}</div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+
+              <div class="m-pagination" v-if="point.total > point.pageSize">
+                <el-pagination
+                  :current-page="point.pageNo"
+                  :page-size="point.pageSize"
+                  :total="point.total"
+                  background
+                  layout="prev, pager, next"
+                  @current-change="handlePageNoChangePoint"
+                >
+                </el-pagination>
+              </div>
+            </div>
           </cpt-card>
         </div>
       </div>
     </div>
+
+    <demand-info
+      v-show="showedDemandInfo"
+      v-if="userId"
+      :userId="userId"
+      :gridName="info.gridName"
+      @close="showedDemandInfo = false"
+    />
+
+    <incident-info
+      v-show="incident.showedInfo"
+      v-if="userId"
+      :userId="userId"
+      :gridName="info.gridName"
+      @close="incident.showedInfo = false"
+    />
+
+    <topic-info
+      v-show="topic.showedInfo"
+      v-if="userId"
+      :userId="userId"
+      :gridName="info.gridName"
+      @close="topic.showedInfo = false"
+    />
   </div>
 </template>
 
@@ -351,6 +470,9 @@ import { Loading } from "element-ui"; //引入Loading服务
 import { requestPost } from "@/js/dai/request";
 import cptCard from "@/views/modules/visual/cpts/card";
 import peopleMore from "@/views/modules/visual/basicinfo/cpts/people-more";
+import demandInfo from "@/views/modules/visual/basicinfo/cpts/demand-info";
+import incidentInfo from "@/views/modules/visual/basicinfo/cpts/incident-info";
+import topicInfo from "@/views/modules/visual/basicinfo/cpts/topic-info";
 import cptTb from "@/views/modules/visual/cpts/tb";
 
 export default {
@@ -358,10 +480,12 @@ export default {
   data() {
     return {
       showedMoreInfo: false,
+      showedDemandInfo: false,
 
       userId: "",
 
       info: {
+        epmetUserId: "",
         financialSituation: { monthlyIncome: "", retirementAmount: "" },
         gridName: "",
         houseInfo: [],
@@ -413,10 +537,44 @@ export default {
         ],
         header: ["序号", "服务时间", "需求类型", "需求内容", "状态", "操作"],
         list: [],
+        srcList: [],
+        currentIndex: 0,
         pageSize: 5,
         pageNo: 1,
         total: 0,
       },
+
+      showedIncidentOrTopic: "incident",
+
+      incident: {
+        loading: false,
+        list: [],
+        pageSize: 10,
+        pageNo: 1,
+        total: 0,
+        showedInfo: false,
+        currentIndex: 0,
+      },
+
+      topic: {
+        loading: false,
+        list: [],
+        pageSize: 10,
+        pageNo: 1,
+        total: 0,
+        showedInfo: false,
+        currentIndex: 0,
+      },
+
+      point: {
+        loading: false,
+        list: [],
+        pageSize: 10,
+        pageNo: 1,
+        total: 0,
+        showedInfo: false,
+        currentIndex: 0,
+      },
     };
   },
 
@@ -434,6 +592,9 @@ export default {
     cptCard,
     peopleMore,
     cptTb,
+    demandInfo,
+    incidentInfo,
+    topicInfo
   },
 
   watch: {
@@ -454,10 +615,13 @@ export default {
   methods: {
     handleSearch() {},
 
-    getApiData() {
-      this.getInfo();
+    async getApiData() {
+      await this.getInfo();
       this.getHouseInfo();
       this.getDemandData();
+      this.getIncidentData();
+      this.getTopicData();
+      this.getPointData();
     },
 
     toUserInfo(uid) {
@@ -496,16 +660,23 @@ export default {
       }
     },
 
-    handlePageNoChange_demand(val) {
+    handlePageNoChangeDemand(val) {
       this.demand.pageNo = val;
       this.getDemandData();
     },
 
+    handleOperateDemandList(index, type) {
+      if (type == "查看") {
+        this.showedDemandInfo = true;
+        this.demand.currentIndex = index;
+      }
+    },
+
     //加载组织数据
     async getDemandData() {
-      const url =
-        "http://yapi.elinkservice.cn/mock/245/heart/userdemand/mydemand";
+      const url = "/heart/userdemand/mydemand";
       let params = {
+        epmetUserId: this.info.epmetUserId,
         userId: this.userId,
         pageNo: this.demand.pageNo,
         pageSize: this.demand.pageSize,
@@ -520,12 +691,109 @@ export default {
           return [
             { type: "index" },
             item.wantServiceTime,
-            item.content,
             item.categoryName,
+            item.content,
             item.statusName,
             { type: "operate", list: ["查看"] },
           ];
         });
+        this.demand.srcList = data.list;
+      } else {
+        this.$message.error(msg);
+      }
+    },
+
+    handlePageNoChangeIncident(val) {
+      this.incident.pageNo = val;
+      this.getIncidentData();
+    },
+
+    handleClickIncident(index) {
+      this.incident.showedInfo = true;
+      this.incident.currentIndex = index;
+    },
+
+    //加载组织数据
+    async getIncidentData() {
+      const url =
+        "http://yapi.elinkservice.cn/mock/245/gov/project/resievent/pageuserreported";
+      let params = {
+        epmetUserId: this.info.epmetUserId,
+        userId: this.userId,
+        pageNo: this.incident.pageNo,
+        pageSize: this.incident.pageSize,
+      };
+
+      const { data, code, msg } = await requestPost(url, params);
+      this.incident.loading = false;
+
+      if (code === 0) {
+        this.incident.total = data.total;
+        this.incident.list = data.list;
+      } else {
+        this.$message.error(msg);
+      }
+    },
+
+    handlePageNoChangeTopic(val) {
+      this.topic.pageNo = val;
+      this.getTopicData();
+    },
+
+    handleClickTopic(index) {
+      this.topic.showedInfo = true;
+      this.topic.currentIndex = index;
+    },
+
+    //加载组织数据
+    async getTopicData() {
+      const url =
+        "http://yapi.elinkservice.cn/mock/245/gov/project/resievent/pageuserreported";
+      let params = {
+        epmetUserId: this.info.epmetUserId,
+        userId: this.userId,
+        pageNo: this.topic.pageNo,
+        pageSize: this.topic.pageSize,
+      };
+
+      const { data, code, msg } = await requestPost(url, params);
+      this.topic.loading = false;
+
+      if (code === 0) {
+        this.topic.total = data.total;
+        this.topic.list = data.list;
+      } else {
+        this.$message.error(msg);
+      }
+    },
+
+    handlePageNoChangePoint(val) {
+      this.point.pageNo = val;
+      this.getPointData();
+    },
+
+    handleClickPoint(index) {
+      this.point.showedInfo = true;
+      this.point.currentIndex = index;
+    },
+
+    //加载组织数据
+    async getPointData() {
+      const url =
+        "http://yapi.elinkservice.cn/mock/245/point/resi/point/pageuserpoint";
+      let params = {
+        epmetUserId: this.info.epmetUserId,
+        userId: this.userId,
+        pageNo: this.point.pageNo,
+        pageSize: this.point.pageSize,
+      };
+
+      const { data, code, msg } = await requestPost(url, params);
+      this.point.loading = false;
+
+      if (code === 0) {
+        this.point.total = data.total;
+        this.point.list = data.list;
       } else {
         this.$message.error(msg);
       }