新增书记看板页面和弹窗

src/assets/scss/dataBoard/dialog-small.scss

@@ -0,0 +1,52 @@
+
+.dialog-small {
+
+  /deep/ .el-dialog {
+    background: url(~@/assets/images/overview/dia_con.png) !important;
+    background-size: 100% 100% !important;
+    width: 100%;
+    position: relative;
+    z-index: revert !important;
+
+    &:before {
+      content: '';
+      display: block;
+      width: 100%;
+      background: url("@/assets/images/overview/dia_head.png") no-repeat !important;
+      height: 29px !important;
+      position: absolute;
+      top: -29px !important;
+      background-size: 100% !important;
+    }
+
+    &:after {
+      content: '';
+      display: block;
+      width: 100%;
+      background: url("@/assets/images/overview/dia_foot.png") no-repeat !important;
+      height: 36px !important;
+      position: absolute;
+      bottom: -36px !important;
+      background-size: 100% !important;
+    }
+  }
+
+  /deep/ .el-dialog__body {
+    padding: 0 20px 30px;
+  }
+
+  /deep/ .el-dialog__header {
+    border: 0 !important;
+    padding: 0;
+  }
+
+  /deep/ .el-dialog__headerbtn {
+    top: 0;
+    right: 32px;
+
+    .el-dialog__close {
+      color: #ffffff;
+      font-weight: 600;
+    }
+  }
+}

src/assets/scss/dataBoard/dialog.scss

@@ -2,14 +2,14 @@
 /deep/ .el-dialog {
   background: url(~@/assets/images/manyidu/dialog_con.png);
   background-size: 100% 100%;
-  width: 1118px;
+  width: 100%;
   position: relative;
   z-index: revert !important;
 
   &:before {
     content: '';
     display: block;
-    width: 1118px;
+    width: 100%;
     background: url(~@/assets/images/manyidu/dialog_head.png) no-repeat;
     height: 40px;
     position: absolute;
@@ -20,7 +20,7 @@
   &:after {
     content: '';
     display: block;
-    width: 1118px;
+    width: 100%;
     background: url(~@/assets/images/manyidu/dialog_foot.png) no-repeat;
     height: 36px;
     position: absolute;

src/assets/scss/dataBoard/table2.scss

@@ -0,0 +1,63 @@
+.table {
+
+  /deep/ .el-table td,
+  /deep/ .el-table tr {
+    padding: 10px 0px !important;
+    border: none !important;
+  }
+
+  /deep/ .el-table th {
+    padding: 6px 14px !important;
+    border: none !important;
+  }
+
+  /deep/ .el-table td,
+  /deep/ .el-table th {
+    background: none !important;
+  }
+
+  /deep/ .el-table td {
+    font-size: 14px;
+    font-weight: 400;
+    color: #FFFFFF;
+    text-shadow: 1px 2px 4px rgba(10, 32, 60, 0.51);
+  }
+
+  /deep/ .el-table tr {
+    background: none !important;
+    background-size: 100% !important;
+
+
+    &:hover {
+      background-color: rgba(26, 149, 255, 0.3) !important;
+    }
+  }
+
+  /deep/ .el-table {
+    background: none !important;
+
+    &:before {
+      background: none !important;
+    }
+  }
+
+  /deep/ .el-table__body-wrapper tr {
+    &:nth-child(odd) {
+      background: rgba(#0E3873, .4) !important;
+    }
+  }
+  /deep/ .el-table__header-wrapper tr {
+    color: #A3B9DA !important;
+    font-size: 14px;
+    font-weight: 400;
+    opacity: 0.76;
+
+    &:hover {
+      background: none !important;
+    }
+  }
+
+  /deep/ .el-table__header-wrapper {
+    background: none;
+  }
+}

src/assets/scss/dataBoard/tree.scss

@@ -3,6 +3,7 @@
   border: 1px solid #488CC5;
   border-radius: 2px;
   height: 600px;
+  overflow: hidden;
   overflow-y: auto;
 
   .el-tree {
@@ -21,6 +22,7 @@
   position: relative;
   text-indent: 2em;
 }
+/deep/ .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content,
 /deep/ .el-tree-node:focus>.el-tree-node__content,
 /deep/ .el-tree-node__content:hover {
   background: linear-gradient(90deg, #2aadff80 0%, #8fd4ff0f 50%) !important;
@@ -36,5 +38,6 @@
 }
 /deep/ .el-tree-node__expand-icon {
   position: absolute;
-  right: 0;
+  right: 10px;
+  text-indent: 0;
 }

src/router/index.js

@@ -430,6 +430,37 @@ export const dataBoardRoutes = {
         isTab: false,
       },
     },
+
+    {
+      path: "overview/dissatisfiedProblemNumber/12345Hotline",
+      props: true,
+      component: () => import("@/views/dataBoard/overview/dissatisfiedProblemNumber/12345Hotline"),
+      name: "dataBoard-overview-dissatisfiedProblemNumber-12345Hotline",
+      meta: {
+        title: "12345热线不满意数",
+        isTab: false,
+      },
+    },
+    {
+      path: "overview/dissatisfiedProblemNumber/provinceSatisfaction",
+      props: true,
+      component: () => import("@/views/dataBoard/overview/dissatisfiedProblemNumber/provinceSatisfaction"),
+      name: "dataBoard-overview-dissatisfiedProblemNumber-provinceSatisfaction",
+      meta: {
+        title: "满意度调查不满意数",
+        isTab: false,
+      },
+    },
+    {
+      path: "overview/dissatisfiedProblemNumber/selfInspect",
+      props: true,
+      component: () => import("@/views/dataBoard/overview/dissatisfiedProblemNumber/selfInspect"),
+      name: "dataBoard-overview-selfInspect",
+      meta: {
+        title: "社区自查不满意数",
+        isTab: false,
+      },
+    },
     {
       path: "overview/resident",
       props: true,

src/views/dataBoard/cpts/CallPhone.vue

@@ -0,0 +1,30 @@
+<template>
+  <el-button class="tel-btn" :icon="icon" plain round size="small" type="primary">{{text}}</el-button>
+</template>
+
+<script>
+export default {
+  name: "CallPhone",
+  props: {
+    icon: {
+      type: String,
+      default: ""
+    },
+    text: {
+      type: String,
+      default: "拨打"
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+.tel-btn {
+  margin-left: 10px;
+  color: #06ebff;
+  border: 1px solid #06ebff;
+  border-radius: 18px;
+  background: rgba(#06ebff, 0.3);
+}
+</style>

src/views/dataBoard/overview/components/Bmysxxq.vue

@@ -0,0 +1,282 @@
+<template>
+  <div>
+
+    <el-dialog
+        :before-close="handleClose"
+        :modal="true"
+        :modal-append-to-body="false"
+        :visible.sync="dialogVisible"
+        class="dissatisfied-detail"
+        title=""
+        width="1118px"
+    >
+      <div class="content">
+        <div class="main-title main-title2">
+          <Title :text="!isSelect?'不满意事项详情':'共性需求派单'"/>
+        </div>
+        <div class="contents">
+          <el-row>
+            <el-col :span="12">
+              <div class="items">
+                <div class="label">需求类别：</div>
+                <div class="value">教育讲座类-健康知识专业讲座</div>
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="items">
+                <div class="label">需求标题：</div>
+                <div class="value">教育讲座类共性需求</div>
+              </div>
+            </el-col>
+            <el-col :span="24">
+              <div class="items">
+                <div class="label">详细说明：</div>
+                <div class="value">
+                  健康生活方式，是指有益于健康的习惯化的行为方式。主要表现为生活有规律，没有不良嗜好，讲求个人卫生、环境卫生、饮食卫生，讲科学、不迷
+                  信，平时注意保健、生病及时就医，积极参加健康有益的文体活动和社会活动等等。
+                </div>
+              </div>
+            </el-col>
+          </el-row>
+
+          <el-row v-if="isSelect">
+            <el-col :span="24">
+              <div class="items">
+                <div class="label">服务方：</div>
+                <el-select v-model="form.roles" class="select" popper-class="selectPopClass">
+                  <el-option label="志愿者" value="1"/>
+                </el-select>
+                <el-select v-model="form.user" class="select" popper-class="selectPopClass">
+                  <el-option label="王军（13210141412）" value="1"/>
+                </el-select>
+                <CallPhone icon="el-icon-phone"/>
+              </div>
+            </el-col>
+            <el-col :span="24">
+              <div class="items">
+                <div class="label">自动通知服务方：</div>
+                <el-radio-group v-model="form.noticeType" text-color="#fff" class="select" popper-class="selectPopClass">
+                  <el-radio label="短信通知" value="1"/>
+                  <el-radio label="微信公众号通知" value="2"/>
+                </el-radio-group>
+              </div>
+            </el-col>
+            <el-col :span="24">
+              <div class="items">
+                <div class="label">服务范围：</div>
+                <el-select v-model="form.range" class="select" popper-class="selectPopClass">
+                  <el-option label="志愿者" value="1"/>
+                </el-select>
+              </div>
+            </el-col>
+            <el-col :span="24">
+              <div class="items">
+                <div class="label">服务时间：</div>
+                <el-date-picker
+                    v-model="form.date"
+                    :append-to-body="false"
+                    class="select"
+                    end-placeholder="结束日期"
+                    format="yyyy-MM-dd"
+                    popper-class="date-current-weiyi"
+                    range-separator="至"
+                    start-placeholder="开始日期"
+                    type="daterange"
+                    value-format="yyyy-MM-dd"
+                />
+              </div>
+            </el-col>
+          </el-row>
+
+          <div v-if="!isSelect" class="btn-group">
+            <el-button class="green" plain round type="success" @click="handleDispatch">资源调度</el-button>
+          </div>
+
+          <div v-else class="btn-group">
+            <el-button class="cancel" plain round type="success" @click="handleCancel">取消</el-button>
+            <el-button class="sure" plain round type="warning" @click="handleSure">确定</el-button>
+          </div>
+
+        </div>
+      </div>
+    </el-dialog>
+    <ResourceScheduling ref="ResourceScheduling"/>
+
+  </div>
+</template>
+
+<script>
+import Title from "@/views/dataBoard/satisfactionEval/components/Title";
+import ResourceScheduling from "@/views/dataBoard/overview/components/ResourceScheduling.vue";
+import CallPhone from "@/views/dataBoard/cpts/CallPhone";
+
+export default {
+  name: "ServiceDetails",
+  components: {Title, ResourceScheduling, CallPhone},
+  data() {
+    return {
+      dialogVisible: false,
+      isSelect: false,
+      form: {
+        roles: "",
+        user: "",
+      }
+    };
+  },
+  methods: {
+    handleClose(done) {
+      this.dialogVisible = false;
+    },
+    open(id) {
+      this.dialogVisible = true;
+      this.getDetail(id);
+    },
+    getDetail(id) {
+
+    },
+    handleDispatch() {
+      this.$refs.ResourceScheduling.open()
+    },
+    handleSupervision() {
+      this.$refs.supervision.open()
+    },
+    handleCancel() {
+
+    },
+    handleSure() {
+
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/scss/dataBoard/dialog.scss";
+
+.contents {
+  padding: 40px 50px;
+
+  .items {
+    font-size: 14px;
+    position: relative;
+    display: flex;
+    align-items: flex-start;
+    margin-bottom: 17px;
+    line-height: 34px;
+
+    .label {
+      color: #9CB4D3;
+      white-space: nowrap;
+    }
+
+    .value {
+      color: #FFFFFF;
+    }
+  }
+}
+
+.hr {
+  height: 1px;
+  margin: 25px 0;
+  opacity: .4;
+  border-bottom: 1px #0E79D6 dashed;
+}
+
+
+.btn-group {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-top: 20px;
+
+  .green {
+    color: #00CD96;
+    border: 1px solid #00CD96;
+    background: rgba(39, 189, 127, 0.3);
+  }
+
+  .el-button {
+    width: 136px;
+    height: 36px;
+    margin: 0 20px;
+  }
+
+  .orange {
+    color: #FD8904;
+    border: 1px solid #FD8904;
+    background: rgba(253, 137, 4, 0.3);
+  }
+
+  .sure {
+    color: #8ED3FF;
+    border: 1px solid #006CFF;
+    background: rgba(0, 108, 255, 0.5);
+  }
+
+  .cancel {
+    color: #B6D2FF;
+    border: 1px solid #6496E8;
+    background: rgba(116, 146, 194, 0.6);
+  }
+
+}
+
+.select {
+  margin-right: 16px;
+}
+
+/deep/ .el-date-editor .el-range-separator {
+  color: #fff;
+}
+/deep/ .el-radio {
+  color: #fff;
+}
+/deep/ .el-input__inner {
+  width: 360px;
+  height: 40px;
+  color: #fff;
+  border: 1px solid #0E3978;
+  border-radius: 20px;
+  background: rgba(0, 23, 66, 0.72);
+}
+
+/deep/ .el-range-editor .el-range-input {
+  background: none;
+  color: #fff;
+}
+
+::v-deep .date-current-weiyi {
+  background: rgba(3, 19, 51, 0.9);
+  border-color: #006cff;
+  box-shadow: inset 0px 0px 16px 0px rgba(0, 145, 255, 1);
+
+  .el-date-picker__header-label {
+    color: #ffffff;
+  }
+
+  .el-picker-panel__icon-btn {
+    color: #ffffff;
+  }
+
+  .el-month-table {
+    td {
+      .cell {
+        color: #ffffff;
+      }
+    }
+  }
+
+  .el-month-table td.current:not(.disabled) .cell {
+    color: #fff;
+    background-color: #409eff;
+  }
+
+  .el-month-table td.today:not(.disabled) .cell {
+    color: #0056d6;
+  }
+
+  .el-date-picker__header--bordered {
+    border-bottom: solid 1px #006cff;
+  }
+}
+</style>

src/views/dataBoard/overview/components/DemandSwiperList.vue

@@ -10,8 +10,7 @@
             class="item f-flex bto-border"
             @click="handleView(item)"
         >
-          <span>{{ item.createdTime }}</span>
-          <span>{{ item.eventContent }}</span>
+          <slot :data="item"/>
         </div>
       </swiper-slide>
     </swiper>
@@ -42,7 +41,7 @@ export default {
           delay: 1000, // 自动切换的间隔时间，单位是毫秒
           disableOnInteraction: true, // 用户操作后是否禁止自动切换
         },
-        loop: true, // 是否启用循环模式
+        loop: false, // 是否启用循环模式
         speed: 2000, // 滑动速度，单位是毫秒
       },
     }
@@ -52,7 +51,7 @@ export default {
   },
   methods: {
     handleView(item) {
-
+      this.$emit('showDetail', item.id)
     }
   }
 }

src/views/dataBoard/overview/components/DissatisfiedDetails.vue

@@ -0,0 +1,182 @@
+<template>
+  <el-dialog
+      :before-close="handleClose"
+      :modal="true"
+      :modal-append-to-body="false"
+      :visible.sync="dialogVisible"
+      class="dissatisfied-detail"
+      title=""
+      width="1118px"
+  >
+    <div class="main-title main-title2">
+      <Title text="不满意事项详情"/>
+    </div>
+    <div class="content">
+
+      <el-row :gutter="20">
+        <el-col :span="10">
+          <div class="sub-title">事项详情</div>
+          <div class="detail">
+            <p>
+              {{ unsatisfiedMattersModel.reason }}
+            </p>
+            <ul>
+              <li>
+                <span>事项来源：</span
+                >{{
+                  satisfactionSourceOptions[
+                      unsatisfiedMattersModel.satisfactionSource
+                      ]
+                }}
+              </li>
+              <li>
+                <span>事项类型：</span
+                >{{ unsatisfiedMattersModel.satisfactionCategoryName }}
+              </li>
+              <li>
+                <span>所属月份：</span
+                >{{ unsatisfiedMattersModel.satisfactionCategoryName }}
+              </li>
+              <li>
+                <span>所属社区：</span
+                >{{ unsatisfiedMattersModel.organizationName }}
+              </li>
+              <li><span>提交人：</span>{{ unsatisfiedMattersModel.name }}</li>
+              <li>
+                <span>提交人电话：</span>{{ unsatisfiedMattersModel.mobile }}
+              </li>
+            </ul>
+          </div>
+        </el-col>
+        <el-col :offset="4" :span="10">
+          <div class="sub-title">回访记录</div>
+          <div class="log">
+            <div
+                v-for="(item, index) in followUpRecordDetails"
+                class="log-item"
+            >
+              <div class="name">
+                {{ item.followUpUser }}（{{ item.roleName }}）
+              </div>
+              <div>{{ item.followUpDate }}</div>
+              <div>
+                {{ item.followUpWay }} <i class="el-icon-arrow-right"></i>
+              </div>
+            </div>
+          </div>
+        </el-col>
+      </el-row>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import Title from "@/views/dataBoard/satisfactionEval/components/Title";
+
+export default {
+  name: "DissatisfiedDetails",
+  components: {Title},
+  data() {
+    return {
+      dialogVisible: false,
+      unsatisfiedMattersModel: "",
+      unsatisfiedHisCount: "",
+      followUpRecordDetails: "",
+      satisfactionSourceOptions: {
+        satisfaction_12345: "12345投诉",
+        satisfaction_province: "省满意度调查",
+        satisfaction_community: "社区满意度自查",
+      },
+    };
+  },
+  methods: {
+    handleClose(done) {
+      this.dialogVisible = false;
+    },
+    open(id) {
+      this.dialogVisible = true;
+      this.getDetail(id);
+    },
+    getDetail(id) {
+      this.$http
+          .post(
+              "/governance/satisfactionDetailList/getUnsatisfiedMattersDetailInfo",
+              {id}
+          )
+          .then(({data: {data}}) => {
+            this.unsatisfiedMattersModel = data.unsatisfiedMattersModel;
+            this.unsatisfiedHisCount = data.unsatisfiedHisCount;
+            this.followUpRecordDetails = data.followUpRecordDetails;
+            if (this.unsatisfiedMattersModel.satisfactionSource) {
+              this.unsatisfiedMattersModel.satisfactionSource =
+                  satisfactionSourceOptions.filter(
+                      (item) =>
+                          item.value === this.unsatisfiedMattersModel.satisfactionSource
+                  )[0].label;
+            }
+          });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/scss/dataBoard/dialog.scss";
+
+.dissatisfied-detail {
+  .sub-title {
+    font-size: 18px;
+    font-weight: 500;
+    line-height: 22px;
+    margin-bottom: 14px;
+    padding-left: 26px;
+    color: #ffffff;
+    background: url("@/assets/images/manyidu/icon_fk.png") no-repeat left center;
+  }
+
+  .detail {
+    p {
+      font-size: 14px;
+      font-weight: 400;
+      line-height: 32px;
+      margin: 0 0 10px;
+      color: #ffffff;
+    }
+
+    ul {
+      margin: 0;
+      padding: 0;
+      list-style-type: none;
+    }
+
+    li {
+      line-height: 32px;
+      color: #ffffff;
+
+      span {
+        color: #9cb4d3;
+      }
+    }
+  }
+
+  .log {
+    padding-left: 26px;
+
+    .log-item {
+      display: flex;
+      justify-content: space-between;
+      width: 100%;
+      padding: 9px 0;
+      color: #fff;
+      background: url("@/assets/images/manyidu/hf_line.png") bottom center no-repeat;
+
+      .name {
+        flex: 0 0 33.33333%;
+      }
+    }
+  }
+  .content {
+    padding: 0 60px;
+  }
+}
+</style>

src/views/dataBoard/overview/components/EventDetail.vue

@@ -0,0 +1,407 @@
+<template>
+  <div>
+    <el-dialog
+        :destroy-on-close="true"
+        :modal="true"
+        :modal-append-to-body="false"
+        :visible="showDialog"
+        width="1118px"
+        @close="handleClose"
+
+    >
+      <div class="main-title main-title2">
+        <Title text="事件详情"/>
+      </div>
+      <div v-loading="loading"
+           class="eventWrap"
+           element-loading-background="rgba(0, 0, 0, 0.5)"
+           element-loading-spinner="el-icon-loading"
+           element-loading-text="加载中"
+      >
+        <el-row :gutter="32">
+          <el-col
+              :span="13"
+              style="padding-left: 40px"
+          >
+            <div class="leftEvent">
+              <div class="eventDetails">
+                <img
+                    :height="18"
+                    :width="18"
+                    src="@/assets/images/manyidu/tc-title-icon.png"
+                />事项详情
+              </div>
+              <div class="eventItem">
+                {{ item.eventContent }}
+              </div>
+              <div class="eventItem">
+                <span>所属组织：</span>
+                <span>{{ item.gridName }}</span>
+              </div>
+              <div class="eventItem">
+                <span>上报渠道：</span>
+                <span>{{ item.sourceTypeName }}</span>
+              </div>
+              <div class="eventItem">
+                <span>事件类型：</span>
+                <span>{{ item.categoryName }}</span>
+              </div>
+              <div class="eventItem">
+                <span>接受时间：</span>
+                <span>{{ item.happenTime }}</span>
+              </div>
+              <div class="eventItem">
+                <span>联系人：</span>
+                <span>{{ item.name }}</span>
+              </div>
+              <div class="eventItem">
+                <span>联系电话：</span>
+                <span>{{ item.mobile }}</span>
+                <CallPhone icon="el-icon-phone"/>
+              </div>
+              <div class="eventItem">
+                <span>详细地址：</span>
+                <span>{{ item.address }}</span>
+              </div>
+              <div class="eventItem">
+                <span>办结时限：</span>
+                <span>{{ item.latestOperatedTime }}</span>
+              </div>
+              <div class="eventItem">
+                <span>满意度评价：</span>
+                <span>{{ item.satisfactionName }}</span>
+              </div>
+            </div>
+          </el-col>
+          <el-col
+              :span="11"
+          >
+            <div class="rightEvent m-info">
+              <div class="eventDetails">
+                <img
+                    :height="18"
+                    :width="18"
+                    src="@/assets/images/manyidu/tc-title-icon.png"
+                />办理进展
+              </div>
+              <!-- <el-timeline class="timeline" :reverse="true">
+                  <el-timeline-item v-for="(item, index) in activities" :key="index" :class="index == activities.length - 1 ? 'sucess' : ''">
+                    <div class="status-box">
+                      <div class="status1" v-if="index == activities.length - 1">回复</div>
+                      <div class="status2" v-else>完成并回复</div>
+                      <div class="timestamp">{{ item.timeLimit ? $moment(item.timeLimit).format("YYYY-MM-DD hh:mm:ss") : "" }}</div>
+                    </div>
+                    <div class="content">
+                      <div class="field">回复人：</div>
+                      <div class="value">{{ item.departmentName }}</div>
+                    </div>
+                    <div class="content">
+                      <div class="field">回复内容：</div>
+                      <div class="value">{{ item.publicReply }}</div>
+                    </div>
+                  </el-timeline-item>
+                </el-timeline> -->
+              <div v-if="activities.length > 0">
+                <!-- <el-card :class="{ 'box-card': source === 'visiual' }" style="min-height: calc(88vh - 50px); overflow: auto"> -->
+                <div class="m-process">
+                  <div class="list">
+                    <div
+                        v-for="(item, index) in activities"
+                        :key="item.processId"
+                        :class="[index === 0 ? 'z-on' : '']"
+                        class="item"
+                    >
+                      <div class="item-row">
+                        <template v-if="item.agencyId">
+                          <div class="name">指派</div>
+                        </template>
+                        <template v-if="!item.timeLimit">
+                          <div class="name">完成并回复</div>
+                        </template>
+                        <template v-if="!item.agencyId && item.timeLimit">
+                          <div class="name">{{ item.processName }}</div>
+                        </template>
+                        <div class="date">
+                          {{
+                            item.processTime ? getTrueTime(item.processTime) : ""
+                          }}
+                        </div>
+                      </div>
+                      <div v-if="item.type === 'event'">
+                        <template v-if="item.agencyId">
+                          <div class="detail">
+                            <div class="detail-field">指派人：</div>
+                            <div class="detail-value">
+                              {{ item.departmentName }}
+                            </div>
+                          </div>
+                          <div class="detail">
+                            <div class="detail-field">指派部门：</div>
+                            <div class="detail-value">
+                              {{ item.agencyName }}
+                            </div>
+                          </div>
+                          <div class="detail">
+                            <div class="detail-field">转办意见：</div>
+                            <div class="detail-value">
+                              {{ item.publicReply }}
+                            </div>
+                          </div>
+                          <div class="detail">
+                            <div class="detail-field">办结时限：</div>
+                            <div class="detail-value">
+                              {{ item.timeLimit }}
+                            </div>
+                          </div>
+                        </template>
+                        <template v-else>
+                          <div class="detail">
+                            <div class="detail-field">回复人：</div>
+                            <div class="detail-value">
+                              {{ item.departmentName }}
+                            </div>
+                          </div>
+                          <div class="detail">
+                            <div class="detail-field">回复内容：</div>
+                            <div class="detail-value">
+                              {{ item.publicReply }}
+                            </div>
+                          </div>
+                          <div v-if="item.timeLimit" class="detail">
+                            <div class="detail-field">办结时限：</div>
+                            <div class="detail-value">
+                              {{ getTrueTime(item.timeLimit) }}
+                            </div>
+                          </div>
+                        </template>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <!-- </el-card> -->
+              </div>
+            </div>
+          </el-col>
+        </el-row>
+
+        <div class="btn-group">
+          <el-button class="green" plain round type="success" @click="handleDispatch">资源调度</el-button>
+          <el-button class="orange" plain round type="warning" @click="handleSupervision">催办督办</el-button>
+        </div>
+
+      </div>
+    </el-dialog>
+    <ResourceScheduling ref="ResourceScheduling"/>
+    <Supervision ref="supervision"/>
+  </div>
+</template>
+
+<script>
+import Title from "@/views/dataBoard/satisfactionEval/components/Title";
+import CallPhone from "@/views/dataBoard/cpts/CallPhone.vue";
+import ResourceScheduling from "@/views/dataBoard/overview/components/ResourceScheduling.vue";
+import Supervision from "@/views/dataBoard/overview/components/Supervision.vue";
+
+export default {
+  name: "EventDetail",
+  components: {
+    CallPhone,
+    Title,
+    ResourceScheduling,
+    Supervision
+  },
+  props: {
+    id: {
+      type: String,
+      default: "",
+    },
+    showDialog: {
+      type: Boolean,
+      default: false,
+    },
+  },
+
+  data() {
+    return {
+      item: {},
+      loading: false,
+      loading1: false,
+      activities: [],
+    };
+  },
+
+  computed: {},
+  watch: {
+    showDialog: {
+      handler(val) {
+        if (val) {
+          this.getDetailsData(this.id);
+          this.getProcessData(this.id);
+        } else {
+          this.item = {}
+          this.activities = []
+        }
+      },
+      immediate: true,
+    },
+  },
+  mounted() {
+  },
+
+  methods: {
+    handleClose() {
+      this.$emit("close", false);
+      this.item = {};
+    },
+    handleDispatch() {
+      this.$refs.ResourceScheduling.open()
+    },
+    handleSupervision() {
+      this.$refs.supervision.open()
+    },
+    openImg(src) {
+      window.open(src);
+    },
+
+    getTrueTime(time) {
+      return this.$moment(time * 1000).format("YYYY-MM-DD hh:mm");
+    },
+
+    getDetailsData(id) {
+      this.loading = true;
+      this.$http
+          .post("/governance/icEvent/detail", {icEventId: id})
+          .then((res) => {
+            const {code, data, msg} = res.data;
+            if (code === 0) {
+              this.item = data;
+              this.loading = false;
+            } else {
+              this.loading = false;
+              this.$message.error(msg);
+            }
+          });
+    },
+
+    getProcessData(id) {
+      this.$http
+          .post("/governance/icEvent/process", {icEventId: id})
+          .then((res) => {
+            const {code, data, msg} = res.data;
+            if (code === 0) {
+              this.activities = data;
+              this.loading1 = false;
+            } else {
+              this.loading1 = false;
+              this.$message.error(msg);
+            }
+          });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped src="@/assets/scss/dataBoard/popup-info.scss"></style>
+
+<style lang="scss" scoped>
+@import "@/assets/scss/modules/shequzhili/event-info.scss";
+@import "@/assets/scss/dataBoard/dialog.scss";
+
+@mixin fontStyle {
+  color: #fff !important;
+  font-size: 14px !important;
+}
+
+.eventWrap {
+  overflow-x: hidden;
+  //height: 798px;
+  overflow-y: auto;
+  width: 1094px;
+  padding: 24px;
+
+  .eventDetails {
+    font-size: 18px;
+    margin: 0px 24px 48px 0;
+    color: #ffffff;
+
+    img {
+      margin-top: -4px;
+      margin-right: 8px;
+    }
+  }
+
+  .m-info {
+    padding: 0px !important;
+
+    .m-process {
+      margin: 0 !important;
+
+      .name {
+        @include fontStyle;
+      }
+
+      .date {
+        @include fontStyle;
+      }
+
+      .detail {
+        @include fontStyle;
+
+        .detail-field {
+          flex: none !important;
+        }
+      }
+    }
+  }
+
+  .leftEvent {
+    color: #fff;
+
+    .eventItem {
+      font-size: 14px;
+      margin-bottom: 23px;
+      color: #FFFFFF;
+
+      span:first-child {
+        color: #9CB4D3
+      }
+
+      span:last-child {
+      }
+    }
+  }
+
+  .rightEvent {
+    color: #fff;
+  }
+}
+
+
+.btn-group {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-top: 20px;
+
+  .green {
+    color: #00CD96;
+    border: 1px solid #00CD96;
+    background: rgba(39, 189, 127, 0.3);
+  }
+
+  .el-button {
+    width: 136px;
+    height: 36px;
+    margin: 0 20px;
+  }
+
+  .orange {
+    color: #FD8904;
+    border: 1px solid #FD8904;
+    background: rgba(253, 137, 4, 0.3);
+  }
+
+
+}
+
+</style>

src/views/dataBoard/overview/components/EventDispatchOrder.vue

@@ -0,0 +1,353 @@
+<template>
+  <div>
+
+    <el-dialog
+        :before-close="handleClose"
+        :modal="true"
+        :modal-append-to-body="false"
+        :visible.sync="dialogVisible"
+        class="dissatisfied-detail"
+        title=""
+        width="1118px"
+    >
+      <div class="content">
+        <div class="main-title main-title2">
+          <Title text="事件派单"/>
+        </div>
+        <div class="contents">
+          <el-row>
+            <el-col :span="12">
+              <div class="items">
+                <div class="label">需求类别：</div>
+                <div class="value">教育讲座类-健康知识专业讲座</div>
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="items">
+                <div class="label">需求标题：</div>
+                <div class="value">教育讲座类共性需求</div>
+              </div>
+            </el-col>
+            <el-col :span="24">
+              <div class="items">
+                <div class="label">详细说明：</div>
+                <div class="value">
+                  健康生活方式，是指有益于健康的习惯化的行为方式。主要表现为生活有规律，没有不良嗜好，讲求个人卫生、环境卫生、饮食卫生，讲科学、不迷
+                  信，平时注意保健、生病及时就医，积极参加健康有益的文体活动和社会活动等等。
+                </div>
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="items" style="align-items: center">
+                <div class="label">处理方式：</div>
+                <el-radio-group v-model="form.noticeType" class="select" popper-class="selectPopClass"
+                                text-color="#fff">
+                  <el-radio label="指派" value="1"/>
+                  <el-radio label="转财务" value="2"/>
+                </el-radio-group>
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="items">
+                <div class="label">处理部门：</div>
+                <div class="value">XX社区第一网格 杨军（网格员）</div>
+              </div>
+            </el-col>
+            <el-col :span="24">
+
+              <div class="items">
+                <div class="label">转办意见：</div>
+              </div>
+            </el-col>
+            <el-col :span="24">
+              <div class="items">
+                <el-input
+                    v-model="form.explain"
+                    :autosize="{ minRows: 5, maxRows: 10}"
+                    class="input"
+                    maxlength="500"
+                    placeholder="请输入转办意见"
+                    type="textarea"/>
+              </div>
+            </el-col>
+
+            <el-col :span="24">
+              <div class="items">
+                <div class="label">图片/附件：</div>
+              </div>
+            </el-col>
+            <el-col :span="24">
+              <div class="items">
+                <el-upload
+                    :auto-upload="false"
+                    action="#"
+                    list-type="picture-card">
+                  <div slot="default">
+                    <i class="el-icon-plus"></i>
+                    <div class="text">添加图片</div>
+                  </div>
+
+                  <div slot="file" slot-scope="{file}">
+                    <img
+                        :src="file.url"
+                        alt="" class="el-upload-list__item-thumbnail"
+                    >
+                    <span class="el-upload-list__item-actions">
+                      <span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
+                        <i class="el-icon-zoom-in"></i>
+                      </span>
+                      <span v-if="!disabled" class="el-upload-list__item-delete" @click="handleDownload(file)">
+                        <i class="el-icon-download"></i>
+                      </span>
+                      <span v-if="!disabled" class="el-upload-list__item-delete" @click="handleRemove(file)">
+                        <i class="el-icon-delete"></i>
+                      </span>
+                    </span>
+                  </div>
+                </el-upload>
+
+              </div>
+            </el-col>
+            <el-col :span="24">
+              <div class="items">
+                <div class="label">办结时限：</div>
+                <el-date-picker
+                    v-model="form.date"
+                    :append-to-body="false"
+                    format="yyyy-MM-dd"
+                    placeholder="开始日期"
+                    popper-class="date-current-weiyi"
+                    value-format="yyyy-MM-dd"
+                />
+              </div>
+            </el-col>
+          </el-row>
+
+
+          <div class="btn-group">
+            <el-button class="cancel" plain round type="success" @click="handleCancel">取消</el-button>
+            <el-button class="sure" plain round type="warning" @click="handleSure">确定</el-button>
+          </div>
+
+        </div>
+      </div>
+    </el-dialog>
+    <el-dialog :visible.sync="imageVisible" append-to-body width="300px">
+      <img :src="dialogImageUrl" alt="" width="100%">
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import Title from "@/views/dataBoard/satisfactionEval/components/Title";
+import ResourceScheduling from "@/views/dataBoard/overview/components/ResourceScheduling.vue";
+import CallPhone from "@/views/dataBoard/cpts/CallPhone";
+
+export default {
+  name: "EventDispatchOrder",
+  components: {Title, ResourceScheduling, CallPhone},
+  data() {
+    return {
+      dialogVisible: false,
+      form: {
+        roles: "",
+        user: "",
+      },
+      dialogImageUrl: '',
+      imageVisible: false,
+      disabled: false
+    };
+  },
+  methods: {
+    handleClose(done) {
+      this.dialogVisible = false;
+    },
+    open(id) {
+      this.dialogVisible = true;
+      this.getDetail(id);
+    },
+    getDetail(id) {
+
+    },
+    handleDispatch() {
+      this.$refs.ResourceScheduling.open()
+    },
+    handleSupervision() {
+      this.$refs.supervision.open()
+    },
+    handleCancel() {
+
+    },
+    handleSure() {
+
+    },
+
+    handleRemove(file) {
+      console.log(file);
+    },
+    handlePictureCardPreview(file) {
+      this.dialogImageUrl = file.url;
+      this.imageVisible = true;
+    },
+    handleDownload(file) {
+      console.log(file);
+    }
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/scss/dataBoard/dialog.scss";
+
+.contents {
+  padding: 40px 50px;
+
+  .items {
+    font-size: 14px;
+    line-height: 34px;
+    position: relative;
+    display: flex;
+    align-items: flex-start;
+    margin-bottom: 17px;
+
+    .label {
+      white-space: nowrap;
+      color: #9CB4D3;
+    }
+
+    .value {
+      color: #FFFFFF;
+    }
+  }
+}
+
+.hr {
+  height: 1px;
+  margin: 25px 0;
+  opacity: .4;
+  border-bottom: 1px #0E79D6 dashed;
+}
+
+
+.btn-group {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-top: 20px;
+
+  .green {
+    color: #00CD96;
+    border: 1px solid #00CD96;
+    background: rgba(39, 189, 127, 0.3);
+  }
+
+  .el-button {
+    width: 136px;
+    height: 36px;
+    margin: 0 20px;
+  }
+
+  .orange {
+    color: #FD8904;
+    border: 1px solid #FD8904;
+    background: rgba(253, 137, 4, 0.3);
+  }
+
+  .sure {
+    color: #8ED3FF;
+    border: 1px solid #006CFF;
+    background: rgba(0, 108, 255, 0.5);
+  }
+
+  .cancel {
+    color: #B6D2FF;
+    border: 1px solid #6496E8;
+    background: rgba(116, 146, 194, 0.6);
+  }
+
+}
+
+.select {
+  margin-right: 16px;
+}
+
+/deep/ .el-date-editor .el-range-separator {
+  color: #fff;
+}
+
+/deep/ .el-radio {
+  color: #fff;
+}
+
+/deep/ .el-input__inner {
+  width: 360px;
+  height: 40px;
+  color: #fff;
+  border: 1px solid #0E3978;
+  border-radius: 20px;
+  background: rgba(0, 23, 66, 0.72);
+}
+
+/deep/ .el-range-editor .el-range-input {
+  color: #fff;
+  background: none;
+}
+
+::v-deep .date-current-weiyi {
+  border-color: #006cff;
+  background: rgba(3, 19, 51, 0.9);
+  box-shadow: inset 0px 0px 16px 0px rgba(0, 145, 255, 1);
+
+  .el-date-picker__header-label {
+    color: #ffffff;
+  }
+
+  .el-picker-panel__icon-btn {
+    color: #ffffff;
+  }
+
+  .el-month-table {
+    td {
+      .cell {
+        color: #ffffff;
+      }
+    }
+  }
+
+  .el-month-table td.current:not(.disabled) .cell {
+    color: #fff;
+    background-color: #409eff;
+  }
+
+  .el-month-table td.today:not(.disabled) .cell {
+    color: #0056d6;
+  }
+
+  .el-date-picker__header--bordered {
+    border-bottom: solid 1px #006cff;
+  }
+}
+
+/deep/ .el-textarea__inner {
+  color: #fff;
+  border: 1px solid #0E3978;
+  border-radius: 2px;
+  background: rgba(0, 23, 66, 0.72);
+}
+
+/deep/ .el-upload--picture-card {
+  color: #fff;
+  border: 1px solid #0E3978;
+  border-radius: 2px;
+  background: rgb(0, 23, 66);
+  line-height: normal;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  opacity:  0.72;
+  .text {
+    margin-top: 10px;
+  }
+}
+</style>

src/views/dataBoard/overview/components/MapDialog/CommunityList.vue

@@ -0,0 +1,92 @@
+<template>
+  <div>
+    <div class="table">
+      <el-table v-loading="loading" :data="list" height="600px"
+                element-loading-background="rgba(0, 0, 0, 0.3)">
+        <el-table-column label="序号" type="index" width="80"/>
+        <el-table-column label="月度" prop="key" width="100"/>
+        <el-table-column label="所属社区" prop="key" width="150"/>
+        <el-table-column label="文化设施" prop="key" width="150"/>
+        <el-table-column label="体育设施" prop="key" width="150"/>
+        <el-table-column label="生态环境" prop="key" width="150"/>
+        <el-table-column label="社会治安" prop="key" width="150"/>
+        <el-table-column label="社会救助" prop="key" width="150"/>
+        <el-table-column label="老有所养" prop="key" width="150"/>
+        <el-table-column label="基础教育" prop="key" width="150"/>
+        <el-table-column label="病有所医" prop="key" width="150"/>
+        <el-table-column label="提交时间" prop="key" width="150"/>
+        <el-table-column label="姓名" prop="key" width="100"/>
+        <el-table-column label="电话" prop="mobile" width="100">
+          <template slot-scope="scope">
+            {{ $sensitive(scope.row.mobile, 3, 7) }}
+          </template>
+        </el-table-column>
+        <el-table-column label="是否回访" prop="key" width="150"/>
+        <el-table-column label="消除风险" prop="key" width="150"/>
+        <el-table-column label="操作" prop="op" width="250">
+          <template slot-scope="scope">
+            <span class="view" @click="handleViews(scope.row)">查看</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <Pagination
+          v-show="total > 0"
+          :limit.sync="queryParams.pageSize"
+          :page.sync="queryParams.pageNo"
+          :total="total"
+          @pagination="getList"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import Pagination from "@/views/dataBoard/satisfactionEval/components/Pagination";
+
+export default {
+  name: "CommunityList",
+  components: {Pagination},
+  props: {
+    catVal: {
+      type: [String, Number],
+      default: ""
+    }
+  },
+  data() {
+    return {
+      total: 10,
+      queryParams: {},
+      list: [],
+      loading: false,
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+    getList() {
+
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/scss/dataBoard/table2.scss";
+
+.table {
+  margin-top: 20px;
+}
+
+.handle {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #9A69EC;
+}
+
+.view {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #007FF1;
+}
+</style>

src/views/dataBoard/overview/components/MapDialog/DemandList.vue

@@ -0,0 +1,91 @@
+<template>
+  <div>
+    <Tabs v-model="type" :list="typeList" @changeVal="typeChange"/>
+    <div class="table">
+      <el-table v-loading="loading" :data="list" element-loading-background="rgba(0, 0, 0, 0.3)"
+                height="250px">
+        <el-table-column label="需求类别" prop="key"/>
+        <el-table-column label="需求内容" prop="key"/>
+        <el-table-column label="需求人" prop="key"/>
+        <el-table-column label="需求人联系电话" prop="key" width="200"/>
+        <el-table-column label="状态" prop="key"/>
+        <el-table-column label="服务方" prop="key"/>
+        <el-table-column label="操作" prop="op" width="250">
+          <template slot-scope="scope">
+            <CallPhone text="拨打电话"/>
+            <span class="handle">处理</span>
+            <span class="view" @click="handleViews(scope.row)">查看</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <Pagination
+          v-show="total > 0"
+          :limit.sync="queryParams.pageSize"
+          :page.sync="queryParams.pageNo"
+          :total="total"
+          @pagination="getList"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import Pagination from "@/views/dataBoard/satisfactionEval/components/Pagination";
+import Tabs from "@/views/dataBoard/satisfactionEval/components/Tabs/index.vue";
+import CallPhone from "@/views/dataBoard/cpts/CallPhone";
+
+export default {
+  name: "DisputeDispatch",
+  components: {Pagination, Tabs, CallPhone},
+  data() {
+    return {
+      total: 10,
+      queryParams: {},
+      type: "1",
+      list: [],
+      loading: false,
+      typeList: [
+        {
+          label: "个性服务",
+          value: "1",
+        },
+        {
+          label: "共性需求",
+          value: "2",
+        }
+      ],
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+    getList() {
+
+    },
+    typeChange() {
+
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/scss/dataBoard/table2.scss";
+
+.table {
+  margin-top: 20px;
+}
+
+.handle {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #9A69EC;
+}
+
+.view {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #007FF1;
+}
+</style>

src/views/dataBoard/overview/components/MapDialog/DifficultyCharts.vue

@@ -0,0 +1,213 @@
+<template>
+  <div class="charts">
+    <div id="DifficultyCharts"></div>
+  </div>
+</template>
+
+<script>
+
+import * as echarts from "echarts";
+
+export default {
+  name: "DifficultyCharts",
+  props: {
+    data: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {}
+  },
+  mounted() {
+    this.$http.get('/governance/icEventOld/statisticsByCategory').then(({data: {data}}) => {
+      this.initCharts(data ? data : [])
+    })
+  },
+  methods: {
+    initCharts(data) {
+      let div = document.getElementById('DifficultyCharts');
+      this.myChart = echarts.init(div);
+      let chartData = data.map((item) => {
+        return {
+          name: item.name,
+          count: item.value,
+        };
+      })
+      let xData = chartData.map(item => item.name);
+      let yData = chartData.map(item => item.value)
+      let color = [[
+        {
+          offset: 0,
+          color: 'rgba(0, 84, 255, 0)' // 0% 处的颜色
+        },
+        {
+          offset: 1,
+          color: 'rgba(38, 244, 248, 1)' // 100% 处的颜色
+        }
+      ]]
+      let num = yData
+      const max = Math.max(...num)
+      let barArray = new Array(xData.length).fill((parseInt(max / 100) + 1) * 100)
+      var option = {
+        title: {
+          show: false,
+          text: '',
+          x: 'center',
+          top: '15px',
+          textStyle: {
+            color: '#333333',
+            fontWeight: 500,
+            fontSize: 18,
+          },
+        },
+        tooltip: {
+          trigger: 'axis',
+          backgroundColor: 'rgba(13,33,71,0.5)',
+          borderColor: 'rgba(143,174,252,0.6)',
+          padding: 8,
+          textStyle: {
+            color: '#fff',
+          },
+          formatter: function (params) {
+            var res = '<div"><p>' + params[0].name + '：' + params[0].value + '</p></div>'
+            return res;
+          },
+        },
+        dataZoom: [
+          {
+            "type": "slider",
+            "start": 0,
+            "end": parseInt((5 / xData.length) * 10) / 10 * 100,
+            "height": 10,
+            "bottom": 0,
+            "showDetail": false,
+            "showDataShadow": false,
+            "borderColor": "transparent"
+          }
+        ],
+        grid: {
+          top: '18%',
+          left: '2%',
+          right: '4%',
+          bottom: '8%',
+          containLabel: true
+        },
+        xAxis: [
+          {
+            type: 'category',
+            axisTick: {
+              show: false,
+            },
+            splitLine: {
+              show: false,
+            },
+            axisLine: {
+              lineStyle: {
+                color: '#323c41'
+              }
+            },
+            axisLabel: {
+              align: 'center',
+              interval: 0,
+              textStyle: {
+                fontSize: 12,
+                color: '#A3B9DA'
+              }
+            },
+            boundaryGap: true,
+            data: xData,
+          }, {
+            type: 'category',
+            data: xData,
+            axisLine: {show: false},
+            axisLabel: {
+              show: false,
+            },
+            boundaryGap: true,
+
+          }
+        ],
+
+        yAxis: [
+          {
+            type: 'value',
+            name: '单位：件',
+            nameLocation: 'end',
+            splitLine: {
+              show: true,
+              lineStyle: {
+                color: 'rgba(4,187,255,0.18)',
+                type: 'dashed'
+              },
+            },
+            nameTextStyle: {
+              color: '#A3B9DA',
+              textStyle: {
+                fontSize: 12
+              },
+              align: 'center'
+            },
+            axisLabel: {
+              show: true,
+              color: '#A3B9DA',
+              textStyle: {
+                fontSize: 12
+              }
+            },
+            axisTick: {
+              show: false
+            }
+          }
+        ],
+        series: [
+          {
+            name: "",
+            type: 'bar',
+            barWidth: 20,
+            itemStyle: {
+              opacity: 1,
+              color: new echarts.graphic.LinearGradient(
+                  0,
+                  1,
+                  0,
+                  0,
+                  color[0],
+                  false
+              )
+            },
+            data: yData,
+          },
+          {
+            name: '',
+            type: 'bar',
+            barWidth: 50,
+            barGap: '-60%',
+            data: barArray,
+            itemStyle: {
+              normal: {
+                color: 'rgba(22,153,152, 0.1)'
+              }
+            },
+            zlevel: -1,
+            xAxisIndex: 1,
+          }
+        ],
+      };
+      this.myChart.setOption(option);
+      window.addEventListener("resize", () => this.myChart.resize());
+      this.loading = false
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+.charts {
+  #DifficultyCharts {
+    width: 100%;
+    height: 350px;
+  }
+}
+</style>

src/views/dataBoard/overview/components/MapDialog/DisputeDispatch.vue

@@ -0,0 +1,94 @@
+<template>
+  <div>
+    <Tabs v-model="type" :list="typeList" @changeVal="typeChange"/>
+    <div class="table">
+      <el-table v-loading="loading" :data="list" element-loading-background="rgba(0, 0, 0, 0.3)"
+                height="250px">
+        <el-table-column label="资源类型" prop="key"/>
+        <el-table-column label="所属网格" prop="key"/>
+        <el-table-column label="姓名/名称" prop="key"/>
+        <el-table-column label="联系电话" prop="key"/>
+        <el-table-column label="状态" prop="name"/>
+        <el-table-column label="距离" prop="name"/>
+      </el-table>
+      <Pagination
+          v-show="total > 0"
+          :limit.sync="queryParams.pageSize"
+          :page.sync="queryParams.pageNo"
+          :total="total"
+          @pagination="getList"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import Pagination from "@/views/dataBoard/satisfactionEval/components/Pagination";
+import Tabs from "@/views/dataBoard/satisfactionEval/components/Tabs/index.vue";
+
+export default {
+  name: "DisputeDispatch",
+  components: {Pagination, Tabs},
+  data() {
+    return {
+      total: 10,
+      queryParams: {},
+      type: "1",
+      list: [],
+      loading: false,
+      typeList: [
+        {
+          label: "网格员",
+          value: "1",
+        },
+        {
+          label: "公益岗",
+          value: "2",
+        },
+        {
+          label: "志愿者",
+          value: "3",
+        },
+        {
+          label: "社区自组织",
+          value: "4",
+        },
+        {
+          label: "联建单位",
+          value: "5",
+        },
+      ],
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+    getList() {
+
+    },
+    typeChange() {
+
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+@import "@/assets/scss/dataBoard/table2.scss";
+.table {
+  margin-top: 20px;
+}
+
+.handle {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #9A69EC;
+}
+
+.view {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #007FF1;
+}
+</style>

src/views/dataBoard/overview/components/MapDialog/List12345.vue

@@ -0,0 +1,83 @@
+<template>
+  <div>
+    <div class="table">
+      <el-table v-loading="loading" :data="list" height="600px"
+                element-loading-background="rgba(0, 0, 0, 0.3)">
+        <el-table-column label="序号" type="index" width="80"/>
+        <el-table-column label="所属网格" prop="key" width="120"/>
+        <el-table-column label="接收时间" prop="key" width="180"/>
+        <el-table-column label="问题描述" prop="key" width="120"/>
+        <el-table-column label="办结时限" prop="key" width="120"/>
+        <el-table-column label="联系人" prop="key" width="120"/>
+        <el-table-column label="联系电话" prop="key" width="120"/>
+        <el-table-column label="状态" prop="name" width="120"/>
+        <el-table-column label="操作" prop="op" width="250">
+          <template slot-scope="scope">
+            <CallPhone text="拨打电话"/>
+            <span class="handle">处理</span>
+            <span class="view" @click="handleViews(scope.row)">查看</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <Pagination
+          v-show="total > 0"
+          :limit.sync="queryParams.pageSize"
+          :page.sync="queryParams.pageNo"
+          :total="total"
+          @pagination="getList"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import Pagination from "@/views/dataBoard/satisfactionEval/components/Pagination";
+import CallPhone from "@/views/dataBoard/cpts/CallPhone";
+
+export default {
+  name: "List12345",
+  components: {Pagination,CallPhone},
+  props: {
+    catVal: {
+      type: [String,Number],
+      default: ""
+    }
+  },
+  data() {
+    return {
+      total: 10,
+      queryParams: {},
+      list: [],
+      loading: false,
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+    getList() {
+
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/scss/dataBoard/table2.scss";
+
+.table {
+  margin-top: 20px;
+}
+
+.handle {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #9A69EC;
+}
+
+.view {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #007FF1;
+}
+</style>

src/views/dataBoard/overview/components/MapDialog/Njjwtqk.vue

@@ -0,0 +1,83 @@
+<template>
+  <div>
+    <div class="table">
+      <el-table v-loading="loading" :data="list" :height="catVal === 1|| catVal === 2?'250px':'600px'"
+                element-loading-background="rgba(0, 0, 0, 0.3)">
+        <el-table-column label="所属网格" prop="key" width="120"/>
+        <el-table-column label="接收时间" prop="key" width="180"/>
+        <el-table-column label="问题描述" prop="key" width="120"/>
+        <el-table-column label="语音" prop="key" width="120"/>
+        <el-table-column label="办结时限" prop="key" width="120"/>
+        <el-table-column label="联系人" prop="key" width="120"/>
+        <el-table-column label="联系电话" prop="key" width="120"/>
+        <el-table-column label="状态" prop="name" width="120"/>
+        <el-table-column label="操作" prop="op" width="250">
+          <template slot-scope="scope">
+            <CallPhone text="拨打电话"/>
+            <span class="handle">处理</span>
+            <span class="view" @click="handleViews(scope.row)">查看</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <Pagination
+          v-show="total > 0"
+          :limit.sync="queryParams.pageSize"
+          :page.sync="queryParams.pageNo"
+          :total="total"
+          @pagination="getList"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import Pagination from "@/views/dataBoard/satisfactionEval/components/Pagination";
+import CallPhone from "@/views/dataBoard/cpts/CallPhone";
+
+export default {
+  name: "Njjwtqk",
+  components: {Pagination, CallPhone},
+  props: {
+    catVal: {
+      type: [String, Number],
+      default: ""
+    }
+  },
+  data() {
+    return {
+      total: 10,
+      queryParams: {},
+      list: [],
+      loading: false,
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+    getList() {
+
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/scss/dataBoard/table2.scss";
+
+.table {
+  margin-top: 20px;
+}
+
+.handle {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #9A69EC;
+}
+
+.view {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #007FF1;
+}
+</style>

src/views/dataBoard/overview/components/MapDialog/ResourceDispatch.vue

@@ -0,0 +1,105 @@
+<template>
+  <div>
+    <Tabs v-model="type" :list="typeList" @changeVal="typeChange"/>
+    <div class="table">
+      <el-table v-loading="loading" :data="list" element-loading-background="rgba(0, 0, 0, 0.3)"
+                height="250px">
+        <el-table-column label="资源类型" prop="key"/>
+        <el-table-column label="所属网格" prop="key"/>
+        <el-table-column label="姓名/名称" prop="key"/>
+        <el-table-column label="联系电话" prop="key"/>
+        <el-table-column label="状态" prop="name"/>
+        <el-table-column label="距离" prop="name"/>
+        <el-table-column label="操作" prop="op" width="250">
+          <template slot-scope="scope">
+            <CallPhone text="拨打电话"/>
+            <span class="view" @click="handleViews(scope.row)">查看</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <Pagination
+          v-show="total > 0"
+          :limit.sync="queryParams.pageSize"
+          :page.sync="queryParams.pageNo"
+          :total="total"
+          @pagination="getList"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import Pagination from "@/views/dataBoard/satisfactionEval/components/Pagination";
+import Tabs from "@/views/dataBoard/satisfactionEval/components/Tabs/index.vue";
+import CallPhone from "@/views/dataBoard/cpts/CallPhone";
+
+export default {
+  name: "DisputeDispatch",
+  components: {Pagination, Tabs, CallPhone},
+  data() {
+    return {
+      total: 10,
+      queryParams: {},
+      type: "1",
+      list: [],
+      loading: false,
+      typeList: [
+        {
+          label: "网格员",
+          value: "1",
+        },
+        {
+          label: "公益岗",
+          value: "2",
+        },
+        {
+          label: "志愿者",
+          value: "3",
+        },
+        {
+          label: "社区自组织",
+          value: "4",
+        },
+        {
+          label: "联建单位",
+          value: "5",
+        },
+        {
+          label: "15分钟生活圈商家",
+          value: "5",
+        },
+      ],
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+    getList() {
+
+    },
+    typeChange() {
+
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+@import "@/assets/scss/dataBoard/table2.scss";
+.table {
+  margin-top: 20px;
+}
+
+.handle {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #9A69EC;
+}
+
+.view {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #007FF1;
+}
+</style>

src/views/dataBoard/overview/components/MapDialog/SatisfactionList.vue

@@ -0,0 +1,87 @@
+<template>
+  <div>
+    <div class="table">
+      <el-table v-loading="loading" :data="list" height="600px"
+                element-loading-background="rgba(0, 0, 0, 0.3)">
+        <el-table-column label="序号" type="index" width="80"/>
+        <el-table-column label="月度" prop="key" width="100"/>
+        <el-table-column label="所属社区" prop="key" width="150"/>
+        <el-table-column label="事项来源" prop="key" width="150"/>
+        <el-table-column label="问题" prop="key" width="220"/>
+        <el-table-column label="提交时间" prop="key" width="150"/>
+        <el-table-column label="姓名" prop="key" width="100"/>
+        <el-table-column label="电话" prop="mobile" width="100">
+          <template slot-scope="scope">
+            {{ $sensitive(scope.row.mobile, 3, 7) }}
+          </template>
+        </el-table-column>
+        <el-table-column label="是否完成" prop="key" width="150"/>
+        <el-table-column label="消除风险" prop="key" width="150"/>
+        <el-table-column label="状态" prop="name" width="120"/>
+        <el-table-column label="操作" prop="op" width="250">
+          <template slot-scope="scope">
+            <span class="view" @click="handleViews(scope.row)">查看</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <Pagination
+          v-show="total > 0"
+          :limit.sync="queryParams.pageSize"
+          :page.sync="queryParams.pageNo"
+          :total="total"
+          @pagination="getList"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import Pagination from "@/views/dataBoard/satisfactionEval/components/Pagination";
+
+export default {
+  name: "SatisfactionList",
+  components: {Pagination},
+  props: {
+    catVal: {
+      type: [String,Number],
+      default: ""
+    }
+  },
+  data() {
+    return {
+      total: 10,
+      queryParams: {},
+      list: [],
+      loading: false,
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+    getList() {
+
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/scss/dataBoard/table2.scss";
+
+.table {
+  margin-top: 20px;
+}
+
+.handle {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #9A69EC;
+}
+
+.view {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #007FF1;
+}
+</style>

src/views/dataBoard/overview/components/MapDialog/index.vue

@@ -0,0 +1,292 @@
+<template>
+  <div>
+    <el-dialog
+        :before-close="handleClose"
+        :modal="true"
+        :modal-append-to-body="false"
+        :visible.sync="dialogVisible"
+        class="dissatisfied-detail"
+        title=""
+        width="1366px"
+    >
+      <div class="content">
+        <div class="main-title main-title2">
+
+          <Title :text="
+          type === 'njjwtqk'?'难解决问题情况':
+          type === 'bmysxqk'?'不满意事项情况':
+          type === 'xqwwcqk'?'需求未完成情况':''
+          "/>
+        </div>
+
+        <div class="contents">
+          <el-row :gutter="30">
+            <el-col :span="5">
+              <div class="tree">
+                <el-tree
+                    ref="tree"
+                    :data="type === 'njjwtqk'?njjwtqkTree:type === 'bmysxqk'?bmysxqkTree:type === 'xqwwcqk'?xqwwcqkTree:[]"
+                    :default-expand-all="true"
+                    :props="defaultProps"
+                    highlight-current
+                    icon-class="el-icon-arrow-right"
+                    node-key="value"
+                    @node-click="handleNodeClick"
+                />
+              </div>
+            </el-col>
+            <el-col :span="19">
+              <template v-if="type === 'njjwtqk'">
+                <div class="eventDetails">
+                  <img
+                      :height="18"
+                      :width="18"
+                      src="@/assets/images/manyidu/tc-title-icon.png"
+                  />
+                  {{
+                    catVal === 1 ? '难点堵点分类统计' :
+                        catVal === 2 ? '矛盾纠纷资源调度' :
+                            catVal === 3 ? '自身问题事件列表' :
+                                catVal === 4 ? '超出服务范围事件列表' : ''
+                  }}
+                </div>
+                <DifficultyCharts v-if="catVal === 1" style="margin-bottom: 56px;"/>
+                <DisputeDispatch v-if="catVal === 2" style="margin-bottom: 56px;"/>
+                <Njjwtqk :catVal="catVal"/>
+              </template>
+
+              <template v-if="type === 'bmysxqk'">
+                <div class="eventDetails">
+                  <img :height="18" :width="18" src="@/assets/images/manyidu/tc-title-icon.png"/>
+                  不满意事项列表
+                </div>
+                <List12345 v-if="catVal === 1" :catVal="catVal"/>
+                <CommunityList v-if="catVal === 2" :catVal="catVal"/>
+                <SatisfactionList v-if="catVal === 3" :catVal="catVal"/>
+              </template>
+
+              <template v-if="type === 'xqwwcqk'">
+                <div class="eventDetails">
+                  <img :height="18" :width="18" src="@/assets/images/manyidu/tc-title-icon.png"/>
+                  {{ catLabel }}-资源调度
+                </div>
+                <ResourceDispatch :catVal="catVal"/>
+                <div class="eventDetails">
+                  <img :height="18" :width="18" src="@/assets/images/manyidu/tc-title-icon.png"/>
+                  {{ catLabel }}-需求列表
+                </div>
+                <DemandList :catVal="catVal"/>
+              </template>
+            </el-col>
+          </el-row>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import Title from "@/views/dataBoard/satisfactionEval/components/Title";
+import DifficultyCharts from "./DifficultyCharts";
+import Njjwtqk from "./Njjwtqk.vue";
+import List12345 from "./List12345.vue";
+import CommunityList from "./CommunityList.vue";
+import SatisfactionList from "./SatisfactionList.vue";
+import DisputeDispatch from "./DisputeDispatch";
+import DemandList from "./DemandList";
+import ResourceDispatch from "./ResourceDispatch";
+import titleSmall from "@/views/dataBoard/satisfactionEval/components/Title/titleSmall.vue";
+import Pagination from "@/views/dataBoard/satisfactionEval/components/Pagination";
+
+export default {
+  name: "MapDialog",
+  components: {
+    Title,
+    DifficultyCharts,
+    Njjwtqk,
+    titleSmall,
+    DisputeDispatch,
+    Pagination,
+    List12345,
+    CommunityList,
+    SatisfactionList,
+    DemandList,
+    ResourceDispatch
+  },
+  props: {
+    type: {
+      type: String,
+      default: '',
+      required: true
+    }
+  },
+  data() {
+    return {
+      total: 10,
+      queryParams: {},
+      dialogVisible: false,
+      njjwtqkTree: [
+        {
+          label: '难点堵点',
+          value: 1
+        }, {
+          label: '矛盾纠纷',
+          value: 2
+        }, {
+          label: '自身问题',
+          value: 3
+        }, {
+          label: '超出服务范围',
+          value: 4
+        }
+      ],
+      bmysxqkTree: [
+        {
+          label: '12345政务热线',
+          value: 1,
+          children: [{
+            label: '城市综合',
+            value: 4
+          }, {
+            label: '城乡建设',
+            value: 5
+          }]
+        }, {
+          label: '社区自查',
+          value: 2,
+          children: [{
+            label: '文化设施',
+            value: 6
+          }, {
+            label: '病有所医',
+            value: 7
+          }, {
+            label: '社会救助',
+            value: 8
+          }]
+        }, {
+          label: '满意度调查',
+          value: 3,
+          children: [{
+            label: '文化设施',
+            value: 9
+          }, {
+            label: '基础教育',
+            value: 10
+          }, {
+            label: '体育设施',
+            value: 11
+          }]
+        }
+      ],
+      xqwwcqkTree: [
+        {
+          label: '教育讲座类',
+          value: 1
+        }, {
+          label: '社会治理类',
+          value: 2
+        }, {
+          label: '公益事业类',
+          value: 3
+        }, {
+          label: '公共服务类',
+          value: 4
+        }, {
+          label: '设施维护类',
+          value: 5
+        }, {
+          label: '技能培训类',
+          value: 6
+        }, {
+          label: '岗位提供类',
+          value: 7
+        }
+      ],
+      defaultProps: {
+        children: 'children',
+        label: 'label'
+      },
+      catVal: 1,
+      catLabel: ''
+    };
+  },
+  methods: {
+    handleClose(done) {
+      this.dialogVisible = false;
+    },
+    open(data) {
+      this.dialogVisible = true;
+      this.getDetail(data);
+      this.catLabel = this.xqwwcqkTree[0].label;
+      this.$nextTick(() => {
+        this.$refs.tree.setCurrentKey(this.catVal)
+      })
+    },
+    getDetail({orgId}) {
+      if (this.type === 'njjwtqk') {
+        this.$http.post('/governance/icEventOld/getMarkersByMarkType', {
+          agencyId: orgId,
+          type: 2
+        }).then(({data: {data}}) => {
+          console.log('data', data)
+        })
+      }
+    },
+    handleViews() {
+      this.$refs.ResourceInfo.open()
+    },
+    handleNodeClick(item) {
+      this.catLabel = item.label
+      console.log(this.getTopLevel(item.value))
+      this.catVal = this.getTopLevel(item.value) || item.value
+    },
+    getTopLevel(key) {
+      const currentNode = this.$refs.tree.getNode(key);
+      let parentNode = currentNode;
+      if (!parentNode) {
+        return parentNode
+      }
+      while (parentNode.level > 1) {
+        parentNode = parentNode.parent;
+      }
+      console.log(parentNode, parentNode.level, 'parentNode')
+
+      return parentNode.data.value
+    }
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/scss/dataBoard/dialog.scss";
+@import "@/assets/scss/dataBoard/tree.scss";
+@import "@/assets/scss/dataBoard/table2.scss";
+
+.handle {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #9A69EC;
+}
+
+.view {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #007FF1;
+}
+
+.eventDetails {
+  font-size: 18px;
+  margin-bottom: 26px;
+  color: #ffffff;
+
+  img {
+    margin-top: -4px;
+    margin-right: 8px;
+  }
+}
+
+.tree {
+  height: 700px;
+}
+</style>

src/views/dataBoard/overview/components/MapResourceInfo.vue

@@ -0,0 +1,138 @@
+<template>
+  <div>
+    <div class="dialog-small">
+
+      <el-dialog
+          :before-close="handleClose"
+          :modal="true"
+          :modal-append-to-body="false"
+          :visible.sync="dialogVisible"
+          title=""
+          width="416px"
+      >
+        <template #title>
+          <Title noBg text="资源信息卡"/>
+        </template>
+        <div class="content">
+          <div class="items">
+            <div class="label">资源类型：</div>
+            <div class="value">联建单位</div>
+          </div>
+          <div class="items">
+            <div class="label">单位名称：</div>
+            <div class="value">青岛**消毒科技有限公司</div>
+          </div>
+          <div class="items">
+            <div class="label">分类：</div>
+            <div class="value">区域单位党建</div>
+          </div>
+          <div class="items">
+            <div class="label">服务事项：</div>
+            <div class="value">青岛**消毒科技有限公司</div>
+          </div>
+          <div class="items">
+            <div class="label">联系人：</div>
+            <div class="value">王军</div>
+          </div>
+          <div class="items">
+            <div class="label">联系电话：</div>
+            <div class="value">133****8989</div>
+            <CallPhone icon="el-icon-phone"/>
+          </div>
+          <div class="items">
+            <div class="label">所在位置：</div>
+            <div class="value">xxxxxxxxxxxxxxxxxxxxxxxxxxxxx</div>
+          </div>
+          <div class="btn-group">
+            <el-button class="sure" plain round type="warning" @click="handleSure">查看更多</el-button>
+          </div>
+        </div>
+      </el-dialog>
+    </div>
+
+    <MapResourceInfoMore ref="MapResourceInfoMore"/>
+  </div>
+</template>
+
+<script>
+import Title from "@/views/dataBoard/satisfactionEval/components/Title";
+import CallPhone from "@/views/dataBoard/cpts/CallPhone";
+import MapResourceInfoMore from "@/views/dataBoard/overview/components/MapResourceInfoMore";
+
+export default {
+  name: "MapResourceInfo",
+  components: {Title, CallPhone, MapResourceInfoMore},
+  data() {
+    return {
+      dialogVisible: false,
+      explain: ""
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+    handleClose(done) {
+      this.dialogVisible = false;
+    },
+    open(id) {
+      this.dialogVisible = true;
+    },
+    handleSure() {
+      this.$refs.MapResourceInfoMore.open()
+    }
+  }
+}
+</script>
+
+<style lang="scss" src="@/assets/scss/dataBoard/dialog-small.scss" scoped></style>
+<style lang="scss" scoped>
+
+.content {
+  padding: 0 25px;
+
+  .items {
+    font-size: 14px;
+    position: relative;
+    display: flex;
+    align-items: center;
+    margin-bottom: 17px;
+
+    .label {
+      color: #9CB4D3;
+    }
+
+    .value {
+      color: #FFFFFF;
+    }
+  }
+}
+
+
+.btn-group {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-top: 20px;
+
+  .el-button {
+    width: 136px;
+    height: 36px;
+    margin: 0 20px;
+  }
+
+  .sure {
+    color: #8ED3FF;
+    border: 1px solid #006CFF;
+    background: rgba(0, 108, 255, 0.5);
+  }
+
+  .cancel {
+    color: #B6D2FF;
+    border: 1px solid #6496E8;
+    background: rgba(116, 146, 194, 0.6);
+  }
+
+}
+
+</style>

src/views/dataBoard/overview/components/MapResourceInfoMore.vue

@@ -0,0 +1,163 @@
+<template>
+  <el-dialog
+      :before-close="handleClose"
+      :modal="true"
+      :modal-append-to-body="false"
+      :visible.sync="dialogVisible"
+      class="dissatisfied-detail"
+      title=""
+      width="1118px"
+  >
+    <div class="content">
+      <div class="main-title main-title2">
+        <Title text="查看更多"/>
+      </div>
+
+      <div class="contents">
+        <el-row>
+          <el-col :span="12">
+            <div class="items">
+              <div class="label">所属网格：</div>
+              <div class="value">xxxx社区第一网格</div>
+            </div>
+          </el-col>
+        </el-row>
+        <Tabs v-model="type" :list="typeList" @changeVal="typeChange"/>
+        <div class="table">
+          <el-table v-loading="loading" :data="list" element-loading-background="rgba(0, 0, 0, 0.3)"
+                    height="250px">
+            <el-table-column label="序号" type="index"/>
+
+            <el-table-column label="服务时间" prop="key" v-if="type === 1"/>
+            <el-table-column label="需求类型" prop="key" v-if="type === 1"/>
+            <el-table-column label="需求内容" prop="key" v-if="type === 1"/>
+            <el-table-column label="满意度" prop="key" v-if="type === 1"/>
+            <el-table-column label="状态" prop="key" v-if="type === 1"/>
+
+            <el-table-column label="服务类型" prop="key" v-if="type !== 1"/>
+            <el-table-column label="服务事项" prop="key" v-if="type !== 1"/>
+            <el-table-column label="来自" prop="key" v-if="type !== 1"/>
+            <el-table-column label="服务时间" prop="key" v-if="type !== 1"/>
+            <el-table-column label="服务人数" prop="key" v-if="type !== 1"/>
+
+            <el-table-column label="操作" prop="op">
+              <template slot-scope="scope">
+                <span class="view" @click="handleViews(scope.row)">查看</span>
+              </template>
+            </el-table-column>
+          </el-table>
+          <Pagination
+              v-show="total > 0"
+              :limit.sync="queryParams.pageSize"
+              :page.sync="queryParams.pageNo"
+              :total="total"
+              @pagination="getList"
+          />
+        </div>
+      </div>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import Pagination from "@/views/dataBoard/satisfactionEval/components/Pagination";
+import Tabs from "@/views/dataBoard/satisfactionEval/components/Tabs/index.vue";
+import CallPhone from "@/views/dataBoard/cpts/CallPhone";
+import Title from "@/views/dataBoard/satisfactionEval/components/Title";
+
+export default {
+  name: "MapResourceInfoMore",
+  components: {Pagination, Tabs, CallPhone, Title},
+  data() {
+    return {
+      dialogVisible: false,
+      total: 10,
+      queryParams: {},
+      type: "1",
+      list: [],
+      loading: false,
+      typeList: [
+        {
+          label: "个性服务",
+          value: 1,
+        },
+        {
+          label: "服务找人",
+          value: 2,
+        },
+        {
+          label: "温暖找人",
+          value: 3,
+        },
+        {
+          label: "岗位找人",
+          value: 4,
+        },
+        {
+          label: "技能找人",
+          value: 5,
+        },
+      ],
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+    handleClose(done) {
+      this.dialogVisible = false;
+    },
+    open(id) {
+      this.dialogVisible = true;
+    },
+    getList() {
+
+    },
+    typeChange() {
+
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/scss/dataBoard/table2.scss";
+
+@import "~@/assets/scss/dataBoard/dialog.scss";
+
+.contents {
+  padding: 40px 50px;
+
+  .items {
+    font-size: 14px;
+    position: relative;
+    display: flex;
+    align-items: center;
+    margin-bottom: 17px;
+
+    .label {
+      color: #9CB4D3;
+    }
+
+    .value {
+      color: #FFFFFF;
+    }
+  }
+}
+
+.table {
+  margin-top: 20px;
+}
+
+.handle {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #9A69EC;
+}
+
+.view {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #007FF1;
+}
+</style>

src/views/dataBoard/overview/components/RequirementList.vue

@@ -3,14 +3,26 @@
     <div class="tab" style="margin-top: 0;">
       <Tabs :list="tab" :value="tabval" @changeVal="(val) => tabval = val"/>
     </div>
-    <DemandSwiperList v-if="tabval === 1" :list="list"/>
+    <DemandSwiperList v-if="tabval === 1" :list="userDemandList" @showDetail="showDetail">
+      <template slot-scope="item">
+        <span>{{ item.demandUser }}</span>
+        <span>{{ item.content }}</span>
+      </template>
+
+    </DemandSwiperList>
     <DemandCharts v-else/>
     <div class="tab">
-      <Tabs :list="tab2" :value="tabval2"  @changeVal="(val) => tabval2 = val"/>
+      <Tabs :list="tab2" :value="tabval2" @changeVal="(val) => tabval2 = val"/>
     </div>
-    <DemandSwiperList v-if="tabval2 === 1" :list="list"/>
+    <DemandSwiperList v-if="tabval2 === 1" :list="commonDemandList" @showDetail="showDetail2">
+      <template slot-scope="item">
+        <span>{{ item.createdTime }}</span>
+        <span>{{ item.title }}</span>
+      </template>
+    </DemandSwiperList>
     <DemandCharts v-else/>
     <ServiceDetails ref="ServiceDetails"/>
+    <Bmysxxq ref="Bmysxxq"/>
   </div>
 </template>
 
@@ -19,6 +31,7 @@ import Tabs from "@/views/dataBoard/cpts/Tabs.vue";
 import DemandSwiperList from "@/views/dataBoard/overview/components/DemandSwiperList.vue";
 import DemandCharts from "@/views/dataBoard/overview/components/DemandCharts.vue";
 import ServiceDetails from "@/views/dataBoard/overview/components/ServiceDetails.vue";
+import Bmysxxq from "@/views/dataBoard/overview/components/Bmysxxq.vue";
 
 export default {
   name: "RequirementList",
@@ -26,25 +39,15 @@ export default {
     Tabs,
     DemandCharts,
     DemandSwiperList,
-    ServiceDetails
+    ServiceDetails,
+    Bmysxxq
   },
   data() {
     return {
       tabval: 1,
       tabval2: 1,
-      list: [{
-        createdTime: '今天',
-        eventContent: '失能老人基础护理服务',
-      }, {
-        createdTime: '昨天',
-        eventContent: '失能老人基础护理服务',
-      }, {
-        createdTime: '5-20',
-        eventContent: '失能老人基础护理服务',
-      }, {
-        createdTime: '5-19',
-        eventContent: '失能老人基础护理服务',
-      }],
+      userDemandList: [],
+      commonDemandList: [],
       tab: [{
         label: '个性需求未完成清单',
         value: 1
@@ -62,9 +65,27 @@ export default {
     }
   },
   mounted() {
-    this.$refs.ServiceDetails.open();
+    this.getUserDemandList()
+    this.getCommonDemandList()
   },
-  methods: {}
+  methods: {
+    showDetail() {
+      this.$refs.ServiceDetails.open();
+    },
+    showDetail2() {
+      this.$refs.Bmysxxq.open();
+    },
+    getUserDemandList() {
+      this.$http.post('/governance/userdemand/pagelist').then(({data}) => {
+        this.userDemandList = data.list || []
+      })
+    },
+    getCommonDemandList() {
+      this.$http.get('/governance/commonDemand/list?assignFlag=0').then(({data}) => {
+        this.commonDemandList = data.list || []
+      })
+    }
+  }
 }
 </script>
 

src/views/dataBoard/overview/components/ResourceInfo.vue

@@ -0,0 +1,135 @@
+<template>
+  <div class="dialog-small">
+
+    <el-dialog
+        :before-close="handleClose"
+        :modal="true"
+        :modal-append-to-body="false"
+        :visible.sync="dialogVisible"
+        class="dissatisfied-detail"
+        title=""
+        width="416px"
+    >
+      <template #title>
+        <Title noBg text="资源信息卡"/>
+      </template>
+      <div class="content">
+        <div class="items">
+          <div class="label">资源类型：</div>
+          <div class="value">网格员</div>
+        </div>
+        <div class="items">
+          <div class="label">联系电话：</div>
+          <div class="value">133****8989</div>
+          <CallPhone icon="el-icon-phone"/>
+        </div>
+
+        <div class="items">
+          <div class="label">联系人：</div>
+          <div class="value">王军</div>
+        </div>
+
+        <div class="items">
+          <div class="label">状态：</div>
+          <div class="value">巡查中</div>
+        </div>
+
+        <div class="items">
+          <div class="label">所在位置：</div>
+          <div class="value">xxxxxxxxxxxxxxxxxxxxxxxxxxxxx</div>
+        </div>
+        <div class="btn-group">
+          <el-button class="sure" plain round type="warning" @click="handleSure">派单</el-button>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import Title from "@/views/dataBoard/satisfactionEval/components/Title";
+import CallPhone from "@/views/dataBoard/cpts/CallPhone";
+
+export default {
+  name: "Supervision",
+  components: {Title, CallPhone},
+  data() {
+    return {
+      dialogVisible: false,
+      explain: ""
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+    handleClose(done) {
+      this.dialogVisible = false;
+    },
+    open(id) {
+      this.dialogVisible = true;
+    },
+    handleSure() {
+
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/scss/dataBoard/dialog-small.scss";
+
+.content {
+  padding: 0 25px;
+
+  .items {
+    font-size: 14px;
+    position: relative;
+    display: flex;
+    align-items: center;
+    margin-bottom: 17px;
+
+    .label {
+      color: #9CB4D3;
+    }
+
+    .value {
+      color: #FFFFFF;
+    }
+  }
+}
+
+/deep/ .el-textarea__inner {
+  color: #fff;
+  border: 1px solid #0E3978;
+  border-radius: 2px;
+  background: rgba(0, 23, 66, 0.72);
+}
+
+.btn-group {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-top: 20px;
+
+  .el-button {
+    width: 136px;
+    height: 36px;
+    margin: 0 20px;
+  }
+
+  .sure {
+    color: #8ED3FF;
+    border: 1px solid #006CFF;
+    background: rgba(0, 108, 255, 0.5);
+  }
+
+  .cancel {
+    color: #B6D2FF;
+    border: 1px solid #6496E8;
+    background: rgba(116, 146, 194, 0.6);
+  }
+
+}
+
+</style>

src/views/dataBoard/overview/components/ResourceScheduling.vue

@@ -1,82 +1,109 @@
 <template>
-  <el-dialog
-      :before-close="handleClose"
-      :modal="true"
-      :modal-append-to-body="false"
-      :visible.sync="dialogVisible"
-      class="dissatisfied-detail"
-      title=""
-      width="1118px"
-  >
-    <div class="content">
-      <div class="main-title main-title2">
-        <Title text="资源调度"/>
-      </div>
-
-      <div class="contents">
-        <el-row>
-          <el-col :span="6">
-            <div class="tree">
-              <el-tree
-                  :data="data"
-                  :default-expand-all="true"
-                  :props="defaultProps"
-                  icon-class="el-icon-arrow-right"
-                  @node-click="handleNodeClick"
-              />
-            </div>
-          </el-col>
+  <div>
+    <el-dialog
+        :before-close="handleClose"
+        :modal="true"
+        :modal-append-to-body="false"
+        :visible.sync="dialogVisible"
+        class="dissatisfied-detail"
+        title=""
+        width="1366px"
+    >
+      <div class="content">
+        <div class="main-title main-title2">
+          <Title text="资源调度"/>
+        </div>
 
-        </el-row>
+        <div class="contents">
+          <el-row :gutter="30">
+            <el-col :span="5">
+              <div class="tree">
+                <el-tree
+                    :data="data"
+                    :default-expand-all="true"
+                    :props="defaultProps"
+                    icon-class="el-icon-arrow-right"
+                    @node-click="handleNodeClick"
+                />
+              </div>
+            </el-col>
+            <el-col :span="19">
+              <div class="table">
+                <el-table v-loading="loading" :data="list" element-loading-background="rgba(0, 0, 0, 0.3)"
+                          max-height="600px">
+                  <el-table-column label="资源类型" prop="orgName" width="120"/>
+                  <el-table-column label="所属组织" prop="name" width="180"/>
+                  <el-table-column label="姓名/名称" prop="name" width="120"/>
+                  <el-table-column label="联系电话" prop="name" width="120"/>
+                  <el-table-column label="状态" prop="name" width="120"/>
+                  <el-table-column label="距离" prop="name" width="120"/>
+                  <el-table-column label="操作" prop="op" width="250">
+                    <template slot-scope="scope">
+                      <CallPhone text="拨打电话"/>
+                      <span class="handle">处理</span>
+                      <span class="view" @click="handleViews(scope.row)">查看</span>
+                    </template>
+                  </el-table-column>
+                </el-table>
+              </div>
+            </el-col>
+          </el-row>
+        </div>
       </div>
-    </div>
-  </el-dialog>
+    </el-dialog>
+    <ResourceInfo ref="ResourceInfo"/>
+  </div>
 </template>
 
 <script>
 import Title from "@/views/dataBoard/satisfactionEval/components/Title";
+import CallPhone from "@/views/dataBoard/cpts/CallPhone";
+import ResourceInfo from "@/views/dataBoard/overview/components/ResourceInfo";
 
 export default {
   name: "ResourceScheduling",
-  components: {Title},
+  components: {Title, CallPhone, ResourceInfo},
   data() {
     return {
+      loading: false,
       dialogVisible: false,
-      data: [{
-        label: '一级 1',
-        children: [{
-          label: '二级 1-1',
+      list: [{}, {}],
+      data: [
+        {
+          label: '一级 1',
           children: [{
-            label: '三级 1-1-1'
-          }]
-        }]
-      }, {
-        label: '一级 2',
-        children: [{
-          label: '二级 2-1',
-          children: [{
-            label: '三级 2-1-1'
+            label: '二级 1-1',
+            children: [{
+              label: '三级 1-1-1'
+            }]
           }]
         }, {
-          label: '二级 2-2',
+          label: '一级 2',
           children: [{
-            label: '三级 2-2-1'
-          }]
-        }]
-      }, {
-        label: '一级 3',
-        children: [{
-          label: '二级 3-1',
-          children: [{
-            label: '三级 3-1-1'
+            label: '二级 2-1',
+            children: [{
+              label: '三级 2-1-1'
+            }]
+          }, {
+            label: '二级 2-2',
+            children: [{
+              label: '三级 2-2-1'
+            }]
           }]
         }, {
-          label: '二级 3-2',
+          label: '一级 3',
           children: [{
-            label: '三级 3-2-1'
+            label: '二级 3-1',
+            children: [{
+              label: '三级 3-1-1'
+            }]
+          }, {
+            label: '二级 3-2',
+            children: [{
+              label: '三级 3-2-1'
+            }]
           }]
-        }]
-      }],
+        }],
       defaultProps: {
         children: 'children',
         label: 'label'
@@ -93,6 +120,9 @@ export default {
     },
     getDetail(id) {
 
+    },
+    handleViews() {
+      this.$refs.ResourceInfo.open()
     },
     handleNodeClick() {
 
@@ -104,4 +134,17 @@ export default {
 <style lang="scss" scoped>
 @import "@/assets/scss/dataBoard/dialog.scss";
 @import "@/assets/scss/dataBoard/tree.scss";
+@import "@/assets/scss/dataBoard/table2.scss";
+
+.handle {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #9A69EC;
+}
+
+.view {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #007FF1;
+}
 </style>

src/views/dataBoard/overview/components/ServiceDetails.vue

@@ -45,7 +45,7 @@
               <div class="items">
                 <div class="label">上报人联系电话：</div>
                 <div class="value">182****8989</div>
-                <el-button class="tel-btn" icon="el-icon-phone" plain round size="small" type="primary">拨打</el-button>
+                <CallPhone icon="el-icon-phone"/>
               </div>
             </el-col>
             <el-col :span="12">
@@ -67,7 +67,7 @@
               <div class="items">
                 <div class="label">需求人联系电话：</div>
                 <div class="value">133****5656</div>
-                <el-button class="tel-btn" icon="el-icon-phone" plain round size="small" type="primary">拨打</el-button>
+                <CallPhone icon="el-icon-phone"/>
               </div>
             </el-col>
             <el-col :span="12">
@@ -86,7 +86,7 @@
             </el-col>
           </el-row>
           <div class="hr"></div>
-          <el-row>
+          <el-row v-if="!isSelect">
             <el-col :span="12">
               <div class="items">
                 <div class="label">服务方：</div>
@@ -97,33 +97,60 @@
               <div class="items">
                 <div class="label">服务方联系电话：</div>
                 <div class="value">156****5656</div>
-                <el-button class="tel-btn" icon="el-icon-phone" plain round size="small" type="primary">拨打</el-button>
+                <CallPhone icon="el-icon-phone"/>
+              </div>
+            </el-col>
+          </el-row>
+          <el-row v-else>
+            <el-col :span="24">
+              <div class="items">
+                <div class="label">服务方：</div>
+                <el-select v-model="form.roles" class="select" popper-class="selectPopClass">
+                  <el-option label="志愿者" value="1"/>
+                </el-select>
+                <el-select v-model="form.user" class="select" popper-class="selectPopClass">
+                  <el-option label="王军（13210141412）" value="1"/>
+                </el-select>
+                <CallPhone icon="el-icon-phone"/>
               </div>
             </el-col>
           </el-row>
 
-          <div class="btn-group">
+          <div v-if="!isSelect" class="btn-group">
             <el-button class="green" plain round type="success" @click="handleDispatch">资源调度</el-button>
-            <el-button class="orange" plain round type="warning">催办督办</el-button>
+            <el-button class="orange" plain round type="warning" @click="handleSupervision">催办督办</el-button>
+          </div>
+
+          <div v-else class="btn-group">
+            <el-button class="cancel" plain round type="success" @click="handleCancel">取消</el-button>
+            <el-button class="sure" plain round type="warning" @click="handleSure">确定</el-button>
           </div>
 
         </div>
       </div>
     </el-dialog>
     <ResourceScheduling ref="ResourceScheduling"/>
+    <Supervision ref="supervision"/>
   </div>
 </template>
 
 <script>
 import Title from "@/views/dataBoard/satisfactionEval/components/Title";
 import ResourceScheduling from "@/views/dataBoard/overview/components/ResourceScheduling.vue";
+import Supervision from "@/views/dataBoard/overview/components/Supervision.vue";
+import CallPhone from "@/views/dataBoard/cpts/CallPhone";
 
 export default {
   name: "ServiceDetails",
-  components: {Title, ResourceScheduling},
+  components: {Title, ResourceScheduling, CallPhone, Supervision},
   data() {
     return {
       dialogVisible: false,
+      isSelect: false,
+      form: {
+        roles: "",
+        user: "",
+      }
     };
   },
   methods: {
@@ -139,13 +166,22 @@ export default {
     },
     handleDispatch() {
       this.$refs.ResourceScheduling.open()
-    }
+    },
+    handleSupervision() {
+      this.$refs.supervision.open()
+    },
+    handleCancel() {
+
+    },
+    handleSure() {
+
+    },
   },
 };
 </script>
 
 <style lang="scss" scoped>
-@import "@/assets/scss/dataBoard/dialog.scss";
+@import "~@/assets/scss/dataBoard/dialog.scss";
 
 .contents {
   padding: 40px 50px;
@@ -154,6 +190,7 @@ export default {
     font-size: 14px;
     position: relative;
     display: flex;
+    align-items: center;
     margin-bottom: 17px;
 
     .label {
@@ -173,14 +210,6 @@ export default {
   border-bottom: 1px #0E79D6 dashed;
 }
 
-.tel-btn {
-  margin-top: -10px;
-  margin-left: 10px;
-  color: #06ebff;
-  border: 1px solid #06ebff;
-  border-radius: 18px;
-  background: rgba(#06ebff, 0.3);
-}
 
 .btn-group {
   display: flex;
@@ -191,19 +220,45 @@ export default {
   .green {
     color: #00CD96;
     border: 1px solid #00CD96;
-    border-radius: 18px;
     background: rgba(39, 189, 127, 0.3);
   }
 
   .el-button {
+    width: 136px;
+    height: 36px;
     margin: 0 20px;
   }
 
   .orange {
     color: #FD8904;
     border: 1px solid #FD8904;
-    border-radius: 18px;
     background: rgba(253, 137, 4, 0.3);
   }
+
+  .sure {
+    color: #8ED3FF;
+    border: 1px solid #006CFF;
+    background: rgba(0, 108, 255, 0.5);
+  }
+
+  .cancel {
+    color: #B6D2FF;
+    border: 1px solid #6496E8;
+    background: rgba(116, 146, 194, 0.6);
+  }
+
+}
+
+.select {
+  margin-right: 16px;
+}
+
+/deep/ .el-input__inner {
+  width: 360px;
+  height: 40px;
+  color: #fff;
+  border: 1px solid #0E3978;
+  border-radius: 20px;
+  background: rgba(0, 23, 66, 0.72);
 }
 </style>

src/views/dataBoard/overview/components/Supervision.vue

@@ -0,0 +1,151 @@
+<template>
+  <div class="dialog-small">
+
+    <el-dialog
+        :before-close="handleClose"
+        :modal="true"
+        :modal-append-to-body="false"
+        :visible.sync="dialogVisible"
+        class="dissatisfied-detail"
+        title=""
+        width="416px"
+    >
+      <template #title>
+        <Title noBg text="催办督办"/>
+      </template>
+      <div class="content">
+        <div class="items">
+          <div class="label">当前办理部门：</div>
+          <div class="value">XXX社区</div>
+        </div>
+
+        <div class="items">
+          <div class="label">转入该部门时间：</div>
+          <div class="value">2023-09-10 15:30</div>
+        </div>
+
+        <div class="items">
+          <div class="label">联系人：</div>
+          <div class="value">王军</div>
+        </div>
+
+        <div class="items">
+          <div class="label">联系电话：</div>
+          <div class="value">133****8989</div>
+          <CallPhone icon="el-icon-phone"/>
+        </div>
+
+        <div class="items">
+          <div class="label">时间状态：</div>
+          <div class="value">办理中</div>
+        </div>
+
+        <div class="items">
+          <div class="label">催办说明：</div>
+        </div>
+        <div class="items">
+          <el-input
+              v-model="explain"
+              :autosize="{ minRows: 5, maxRows: 10}"
+              class="input"
+              maxlength="500"
+              placeholder="请填写催办说明，不超过500字"
+              type="textarea"/>
+        </div>
+
+        <div class="btn-group">
+          <el-button class="cancel" plain round type="success" @click="handleClose">取消</el-button>
+          <el-button class="sure" plain round type="warning" @click="handleSure">确定</el-button>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import Title from "@/views/dataBoard/satisfactionEval/components/Title";
+import CallPhone from "@/views/dataBoard/cpts/CallPhone";
+
+export default {
+  name: "Supervision",
+  components: {Title, CallPhone},
+  data() {
+    return {
+      dialogVisible: false,
+      explain: ""
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+    handleClose(done) {
+      this.dialogVisible = false;
+    },
+    open(id) {
+      this.dialogVisible = true;
+    },
+    handleSure() {
+
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/scss/dataBoard/dialog-small.scss";
+
+.content {
+  padding: 0 25px;
+
+  .items {
+    font-size: 14px;
+    position: relative;
+    display: flex;
+    align-items: center;
+    margin-bottom: 17px;
+
+    .label {
+      color: #9CB4D3;
+    }
+
+    .value {
+      color: #FFFFFF;
+    }
+  }
+}
+
+/deep/ .el-textarea__inner {
+  color: #fff;
+  border: 1px solid #0E3978;
+  border-radius: 2px;
+  background: rgba(0, 23, 66, 0.72);
+}
+
+.btn-group {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-top: 20px;
+
+  .el-button {
+    width: 136px;
+    height: 36px;
+    margin: 0 20px;
+  }
+
+  .sure {
+    color: #8ED3FF;
+    border: 1px solid #006CFF;
+    background: rgba(0, 108, 255, 0.5);
+  }
+
+  .cancel {
+    color: #B6D2FF;
+    border: 1px solid #6496E8;
+    background: rgba(116, 146, 194, 0.6);
+  }
+
+}
+
+</style>

src/views/dataBoard/overview/components/map-top.vue

@@ -1,8 +1,15 @@
 <template>
   <div class="m-per m-l77">
-    <el-autocomplete v-model="keyWord" :fetch-suggestions="querySearch" :placeholder="searchPlaceholder"
-                     :value-key="'value'" class="input-with-select inset" popper-class="selectPopClass">
-      <el-select slot="prepend" v-model="searchSelect" placeholder="请选择" popper-class="selectPopClass">
+    <el-autocomplete
+        v-model="keyWord"
+        :fetch-suggestions="querySearch"
+        :placeholder="searchPlaceholder"
+        :value-key="'value'"
+        class="input-with-select inset"
+        popper-class="selectPopClass"
+        @select="handleSelect"
+    >
+      <el-select slot="prepend" v-model="searchSelect" @change="keyWord = ''" placeholder="请选择" popper-class="selectPopClass">
         <el-option label="需求" value="1"></el-option>
         <el-option label="问题" value="2"></el-option>
         <el-option label="资源" value="3"></el-option>
@@ -10,13 +17,28 @@
       </el-select>
       <el-button slot="append" type="primary" @click="search">搜索</el-button>
     </el-autocomplete>
+    <ServiceDetails ref="ServiceDetails"/>
+    <EventDetails :id="rowId" :showDialog="showDialog" @close="showDialog = false"/>
+
+    <MapResourceInfo ref="MapResourceInfo"/>
+    <DissatisfiedDetails ref="DissatisfiedDetails" :id="rowId" />
   </div>
 </template>
 <script>
 import {requestGet} from "@/js/dai/request";
+import ServiceDetails from "@/views/dataBoard/overview/components/ServiceDetails.vue";
+import EventDetails from "@/views/dataBoard/overview/components/EventDetail.vue";
+import DissatisfiedDetails from "@/views/dataBoard/overview/components/DissatisfiedDetails.vue";
+import MapResourceInfo from "@/views/dataBoard/overview/components/MapResourceInfo.vue";
 
 export default {
   name: "map-top",
+  components: {
+    ServiceDetails,
+    EventDetails,
+    DissatisfiedDetails,
+    MapResourceInfo
+  },
   props: {
     currentLevelData: {
       type: Object,
@@ -37,6 +59,8 @@ export default {
       numData: {},
       searchSelect: "1",
       keyWord: "",
+      showDialog: false,
+      rowId: '',
     };
   },
   watch: {
@@ -65,6 +89,24 @@ export default {
     }
   },
   methods: {
+    handleSelect(data) {
+      console.log(data,'data')
+      this.rowId = data.label
+      if(this.searchSelect === '1') {
+        this.$refs.ServiceDetails.open(data.label);
+      }
+      if(this.searchSelect === '2') {
+        this.showDialog = true
+      }
+
+      if(this.searchSelect=== '3') {
+        this.$refs.MapResourceInfo.open(data.label)
+      }
+
+      if (this.searchSelect === '4') {
+        this.$refs.DissatisfiedDetails.open(data.label);
+      }
+    },
     selectIcon(type) {
       this.selectIndex = type;
       this.$emit("changeType", type);

src/views/dataBoard/overview/components/wtqd.vue

@@ -100,37 +100,38 @@
           class="f-hflex"
           @click="
           $router.push(
-            '/dataBoard/satisfactionEval/potentialPeople?type=shuji&countType=service&satisfactionSource=satisfaction_12345'
+            '/dataBoard/overview/dissatisfiedProblemNumber/12345Hotline'
           )
         "
       >
         <div><span class="f-pingfang">12345热线不满意数</span></div>
-        <div class="f-darkGray"><b class="f-font34 f-yellow">0</b>人</div>
+        <div class="f-darkGray"><b class="f-font34 f-yellow">{{ event12345Num || 0 }}</b>人</div>
       </div>
       <div
           class="f-hflex"
           @click="
           $router.push(
-            '/dataBoard/satisfactionEval/potentialPeople?type=shuji&countType=service&satisfactionSource=satisfaction_province'
+            '/dataBoard/overview/dissatisfiedProblemNumber/provinceSatisfaction'
           )
         "
       >
         <div><span class="f-pingfang">满意度调查不满意数</span></div>
-        <div class="f-darkGray"><b class="f-font34 f-green">0</b>人</div>
+        <div class="f-darkGray"><b class="f-font34 f-green">{{ provinceSatisfactionNum || 0 }}</b>人</div>
       </div>
       <div
           class="f-hflex"
           @click="
           $router.push(
-            '/dataBoard/satisfactionEval/potentialPeople?type=shuji&countType=service&satisfactionSource=satisfaction_community'
+            '/dataBoard/overview/dissatisfiedProblemNumber/selfInspect'
           )
         "
       >
         <div><span class="f-pingfang">社区自评不满意数</span></div>
-        <div class="f-darkGray"><b class="f-font34 f-skyBlue">0</b>人</div>
+        <div class="f-darkGray"><b class="f-font34 f-skyBlue">{{ selfInspectNum || 0 }}</b>人</div>
       </div>
     </div>
     <EventDetails :id="this.rowId" :showDialog="showDialog" @close="close"/>
+    <EventDispatchOrder ref="EventDispatchOrder"/>
 
   </div>
 </template>
@@ -139,10 +140,18 @@ import titleSmall from "@/views/dataBoard/satisfactionEval/components/Title/titl
 import "swiper/dist/css/swiper.css";
 import {swiper, swiperSlide} from "vue-awesome-swiper";
 import {requestPost} from "@/js/dai/request";
-import EventDetails from "@/views/dataBoard/cpts/event-details.vue";
+import EventDetails from "@/views/dataBoard/overview/components/EventDetail.vue";
+import EventDispatchOrder from "@/views/dataBoard/overview/components/EventDispatchOrder.vue";
 
 export default {
   name: "wtqd",
+  components: {
+    titleSmall,
+    swiper,
+    swiperSlide,
+    EventDetails,
+    EventDispatchOrder
+  },
   props: {
     currentLevelData: {
       type: Object,
@@ -156,9 +165,9 @@ export default {
       overview: "",
       loading: false,
       rffxDate: "",
-      event12345Num: "",
-      provinceSatisfactionNum: "",
-      selfInspectNum: "",
+      event12345Num: 0,
+      provinceSatisfactionNum: 0,
+      selfInspectNum: 0,
 
       endTime: "",
       startTime: "",
@@ -184,7 +193,7 @@ export default {
       listLoading: true,
 
       showDialog: false,
-      rowId: ''
+      rowId: '',
     };
   },
   watch: {
@@ -199,13 +208,10 @@ export default {
     this.getReport(this.currentLevelData);
     this.getData();
     this.fetchDataAndProcess()
+    this.getSatisfactionEvent()
+    // this.$refs.EventDispatchOrder.open()
   },
-  components: {
-    titleSmall,
-    swiper,
-    swiperSlide,
-    EventDetails
-  },
+
   //
   methods: {
     getReport({orgId, orgLevel}) {
@@ -288,6 +294,15 @@ export default {
     close() {
       this.showDialog = false;
     },
+// 获取不满意问题数
+    getSatisfactionEvent() {
+      this.$http.get('/governance/satisfactionOverview/satisfactionEvent').then(({data: {data}}) => {
+            this.event12345Num = data.event12345Num || 0
+            this.provinceSatisfactionNum = data.provinceSatisfactionNum || 0
+            this.selfInspectNum = data.selfInspectNum || 0
+          }
+      )
+    }
   },
 };
 </script>
@@ -302,20 +317,6 @@ export default {
   height: 200px;
 }
 
-/deep/ .el-input__inner {
-  width: 90px !important;
-  height: 24px !important;
-  color: #a0cdff;
-  border: 1px solid #125aaa !important;
-  border-radius: 12px !important;
-  background: #021c49 !important;
-}
-
-/deep/ .el-input__icon {
-  line-height: 24px !important;
-  color: #a0cdff;
-}
-
 .f-hflex {
   width: 83px;
 }

src/views/dataBoard/overview/dissatisfiedProblemNumber/12345Hotline.vue

@@ -0,0 +1,122 @@
+<template>
+  <div>
+    <Breadcrumb :list="breadcrumbList"/>
+    <div class="table">
+      <el-table v-loading="loading"
+                :data="list"
+                element-loading-background="rgba(0,0,0,0.5)"
+                element-loading-spinner="el-icon-loading"
+                element-loading-text="加载中..."
+      >
+        <el-table-column label="序号" type="index" width="80"/>
+
+        <el-table-column label="所属网格" prop="key"/>
+        <el-table-column label="接收时间" prop="key"/>
+        <el-table-column label="问题描述" prop="key"/>
+        <el-table-column label="语音" prop="key"/>
+        <el-table-column label="办结时限" prop="key"/>
+        <el-table-column label="联系人" prop="key"/>
+        <el-table-column label="联系人电话" prop="mobile">
+          <template slot-scope="scope">
+            {{ $sensitive(scope.row.mobile, 3, 7) }}
+          </template>
+        </el-table-column>
+        <el-table-column label="状态" prop="key"/>
+        <el-table-column label="操作" sortable>
+          <template slot-scope="{ row }">
+            <CallPhone text="拨打电话"/>
+            <span class="handle">处理</span>
+            <span class="view" @click="handleView(scope.row)">查看</span>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+
+    <Pagination v-show="total > 0" :limit.sync="queryParams.pageSize" :page.sync="queryParams.pageNo" :total="total"
+                @pagination="getList"/>
+    <sjwjj :id="rowId" :showDialog="showDialog" @close="close"/>
+  </div>
+</template>
+
+<script>
+import Breadcrumb from "@/views/dataBoard/satisfactionEval/components/Breadcrumb";
+import Pagination from "@/views/dataBoard/satisfactionEval/components/Pagination";
+import Title from "@/views/dataBoard/satisfactionEval/components/Title";
+import sjwjj from "@/views/dataBoard/satisfactionEval/potentialPeople/details/sjwjj.vue";
+import CallPhone from '@/views/dataBoard/cpts/CallPhone.vue'
+
+export default {
+  name: "12345Hotline",
+  components: {Breadcrumb, Pagination, Title, sjwjj, CallPhone},
+  data() {
+    return {
+      queryParams: {
+        reportUserId: this.$route.query.reportUserId,
+        pageNo: 1,
+        pageSize: 10,
+      },
+      total: 0,
+      breadcrumbList: [
+        {
+          path: "/dataBoard/overview/index",
+          name: "书记看板",
+        },
+        {
+          path: "",
+          name: "12345投诉列表",
+        },
+      ],
+      list: [],
+      showDialog: false,
+      rowId: "",
+      loading: true
+    };
+  },
+  activated() {
+    this.queryParams.reportUserId = this.$route.query.reportUserId;
+    this.queryParams.pageNo = 1;
+    this.getList();
+  },
+  methods: {
+    search() {
+      this.queryParams.pageNo = 1;
+      this.getList();
+    },
+    getList() {
+      this.loading = true
+      this.$http.get("/?" + this.$paramsFormat(this.queryParams)).then(({data: {data}}) => {
+        this.list = data.list;
+        this.total = data.total;
+        this.loading = false
+      });
+    },
+    handleView({id}) {
+      this.showDialog = true;
+      this.rowId = id;
+    },
+    close() {
+      this.showDialog = false;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/scss/dataBoard/table.scss";
+
+.table {
+  margin-top: 40px;
+}
+
+.handle {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #9A69EC;
+}
+
+.view {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #007FF1;
+}
+</style>

src/views/dataBoard/overview/dissatisfiedProblemNumber/provinceSatisfaction.vue

@@ -0,0 +1,121 @@
+<template>
+  <div>
+    <Breadcrumb :list="breadcrumbList"/>
+    <div class="table">
+      <el-table v-loading="loading"
+                :data="list"
+                element-loading-background="rgba(0,0,0,0.5)"
+                element-loading-spinner="el-icon-loading"
+                element-loading-text="加载中..."
+      >
+        <el-table-column label="序号" type="index" width="80"/>
+
+        <el-table-column label="月度" prop="key"/>
+        <el-table-column label="所属社区" prop="key"/>
+        <el-table-column label="事项来源" prop="key"/>
+        <el-table-column label="问题" prop="key"/>
+        <el-table-column label="提交时间" prop="key"/>
+        <el-table-column label="姓名" prop="key"/>
+        <el-table-column label="电话" prop="mobile">
+          <template slot-scope="scope">
+            {{ $sensitive(scope.row.mobile, 3, 7) }}
+          </template>
+        </el-table-column>
+        <el-table-column label="是否完成" prop="key"/>
+        <el-table-column label="消除风险" prop="key"/>
+        <el-table-column label="操作" sortable>
+          <template slot-scope="{ row }">
+            <span class="view" @click="handleView(scope.row)">查看</span>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+
+    <Pagination v-show="total > 0" :limit.sync="queryParams.pageSize" :page.sync="queryParams.pageNo" :total="total"
+                @pagination="getList"/>
+    <sjwjj :id="rowId" :showDialog="showDialog" @close="close"/>
+  </div>
+</template>
+
+<script>
+import Breadcrumb from "@/views/dataBoard/satisfactionEval/components/Breadcrumb";
+import Pagination from "@/views/dataBoard/satisfactionEval/components/Pagination";
+import Title from "@/views/dataBoard/satisfactionEval/components/Title";
+import sjwjj from "@/views/dataBoard/satisfactionEval/potentialPeople/details/sjwjj.vue";
+import CallPhone from '@/views/dataBoard/cpts/CallPhone.vue'
+
+export default {
+  name: "provinceSatisfaction",
+  components: {Breadcrumb, Pagination, Title, sjwjj, CallPhone},
+  data() {
+    return {
+      queryParams: {
+        reportUserId: this.$route.query.reportUserId,
+        pageNo: 1,
+        pageSize: 10,
+      },
+      total: 0,
+      breadcrumbList: [
+        {
+          path: "/dataBoard/overview/index",
+          name: "书记看板",
+        },
+        {
+          path: "",
+          name: "满意度调查不满意列表",
+        },
+      ],
+      list: [],
+      showDialog: false,
+      rowId: "",
+      loading: true
+    };
+  },
+  activated() {
+    this.queryParams.reportUserId = this.$route.query.reportUserId;
+    this.queryParams.pageNo = 1;
+    this.getList();
+  },
+  methods: {
+    search() {
+      this.queryParams.pageNo = 1;
+      this.getList();
+    },
+    getList() {
+      this.loading = true
+      this.$http.get("/?" + this.$paramsFormat(this.queryParams)).then(({data: {data}}) => {
+        this.list = data.list;
+        this.total = data.total;
+        this.loading = false
+      });
+    },
+    handleView({id}) {
+      this.showDialog = true;
+      this.rowId = id;
+    },
+    close() {
+      this.showDialog = false;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/scss/dataBoard/table.scss";
+
+.table {
+  margin-top: 40px;
+}
+
+.handle {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #9A69EC;
+}
+
+.view {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #007FF1;
+}
+</style>

src/views/dataBoard/overview/dissatisfiedProblemNumber/selfInspect.vue

@@ -0,0 +1,127 @@
+<template>
+  <div>
+    <Breadcrumb :list="breadcrumbList"/>
+    <div class="table">
+      <el-table v-loading="loading"
+                :data="list"
+                element-loading-background="rgba(0,0,0,0.5)"
+                element-loading-spinner="el-icon-loading"
+                element-loading-text="加载中..."
+      >
+        <el-table-column label="序号" type="index" width="80"/>
+
+        <el-table-column label="月度" prop="key"/>
+        <el-table-column label="所属社区" prop="key"/>
+        <el-table-column label="文化设施" prop="key"/>
+        <el-table-column label="体育设施" prop="key"/>
+        <el-table-column label="生态环境" prop="key"/>
+        <el-table-column label="社会治安" prop="key"/>
+        <el-table-column label="社会救助" prop="key"/>
+        <el-table-column label="老有所养" prop="key"/>
+        <el-table-column label="基础教育" prop="key"/>
+        <el-table-column label="病有所医" prop="key"/>
+        <el-table-column label="提交时间" prop="key"/>
+        <el-table-column label="姓名" prop="key"/>
+        <el-table-column label="电话" prop="mobile">
+          <template slot-scope="scope">
+            {{ $sensitive(scope.row.mobile, 3, 7) }}
+          </template>
+        </el-table-column>
+        <el-table-column label="是否回访" prop="key"/>
+        <el-table-column label="消除风险" prop="key"/>
+        <el-table-column label="操作" sortable>
+          <template slot-scope="{ row }">
+            <span class="view" @click="handleView(scope.row)">查看</span>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+
+    <Pagination v-show="total > 0" :limit.sync="queryParams.pageSize" :page.sync="queryParams.pageNo" :total="total"
+                @pagination="getList"/>
+    <sjwjj :id="rowId" :showDialog="showDialog" @close="close"/>
+  </div>
+</template>
+
+<script>
+import Breadcrumb from "@/views/dataBoard/satisfactionEval/components/Breadcrumb";
+import Pagination from "@/views/dataBoard/satisfactionEval/components/Pagination";
+import Title from "@/views/dataBoard/satisfactionEval/components/Title";
+import sjwjj from "@/views/dataBoard/satisfactionEval/potentialPeople/details/sjwjj.vue";
+import CallPhone from '@/views/dataBoard/cpts/CallPhone.vue'
+
+export default {
+  name: "selfInspect",
+  components: {Breadcrumb, Pagination, Title, sjwjj, CallPhone},
+  data() {
+    return {
+      queryParams: {
+        reportUserId: this.$route.query.reportUserId,
+        pageNo: 1,
+        pageSize: 10,
+      },
+      total: 0,
+      breadcrumbList: [
+        {
+          path: "/dataBoard/overview/index",
+          name: "书记看板",
+        },
+        {
+          path: "",
+          name: "社区自查不满意数",
+        },
+      ],
+      list: [],
+      showDialog: false,
+      rowId: "",
+      loading: true
+    };
+  },
+  activated() {
+    this.queryParams.reportUserId = this.$route.query.reportUserId;
+    this.queryParams.pageNo = 1;
+    this.getList();
+  },
+  methods: {
+    search() {
+      this.queryParams.pageNo = 1;
+      this.getList();
+    },
+    getList() {
+      this.loading = true
+      this.$http.get("/?" + this.$paramsFormat(this.queryParams)).then(({data: {data}}) => {
+        this.list = data.list;
+        this.total = data.total;
+        this.loading = false
+      });
+    },
+    handleView({id}) {
+      this.showDialog = true;
+      this.rowId = id;
+    },
+    close() {
+      this.showDialog = false;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/scss/dataBoard/table.scss";
+
+.table {
+  margin-top: 40px;
+}
+
+.handle {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #9A69EC;
+}
+
+.view {
+  font-size: 14px;
+  margin-left: 10px;
+  color: #007FF1;
+}
+</style>

src/views/dataBoard/overview/index.vue

@@ -30,6 +30,25 @@
           </div>
           <grid-map ref="map" :level="currentLevel" :peopleType="peopleType" :srcGridData="orgData"
                     @clickAgency="clickAgencyItem" @clickDotBtn="handleClickDotBtn"/>
+          <div class="map-legend">
+            <div class="legend-title">
+              供需匹配地图
+            </div>
+            <div class="legend-list">
+              <div class="legend-item blue">
+                未完成需求
+              </div>
+              <div class="legend-item orange">
+                难解决问题
+              </div>
+              <div class="legend-item green">
+                可调配资源
+              </div>
+              <div class="legend-item red">
+                不满意问题
+              </div>
+            </div>
+          </div>
         </div>
         <!-- <div class="m-box m-rybox">
           <title-box :text="`${customerName}${peopleList[peopleType]}`">
@@ -72,7 +91,6 @@
           </title-box>
           <sq12345 :currentLevelData="currentLevelData" :date="sq12345Date" />
         </div> -->
-
         <!-- 社区&网格-->
         <!-- <div v-if="currentLevel === 'community' || currentLevel === 'grid'" class="m-box">
           <title-box text="人房数据动态更新" />
@@ -99,7 +117,6 @@
           <EventAndFollowUp :currentLevelData="currentLevelData" :date="sjhfDate" v-if="eventType === 1" />
           <FollowUp :currentLevelData="currentLevelData" :date="sjhfDate" v-if="eventType === 2" />
         </div> -->
-
         <!-- 网格 -->
         <!-- <div v-if="currentLevel === 'grid'" class="m-box">
           <title-box text="社区网格数据更新排行">
@@ -111,7 +128,14 @@
         </div> -->
       </div>
     </div>
-
+    <!--
+      -- MapDialog
+      -- type必填
+      -- njjwtqk = 难解决问题情况
+      -- bmysxqk = 不满意事项情况
+      -- xqwwcqk = 需求未完成情况
+    -->
+    <MapDialog ref="MapDialog" type="xqwwcqk" />
     <cpt-loading v-show="false"/>
   </div>
 </template>
@@ -135,6 +159,7 @@ import GridUpdateRanking from "@/views/dataBoard/overview/components/GridUpdateR
 import CommunityResult from "@/views/dataBoard/overview/components/CommunityResult.vue";
 import EventAndFollowUp from "@/views/dataBoard/overview/components/EventAndFollowUp.vue";
 import wtqd from "@/views/dataBoard/overview/components/wtqd.vue";
+import MapDialog from "@/views/dataBoard/overview/components/MapDialog/index.vue";
 
 import RankingGridData from "@/views/dataBoard/overview/components/RankingGridData.vue";
 import FollowUp from "@/views/dataBoard/overview/components/FollowUp.vue";
@@ -167,7 +192,8 @@ export default {
     FollowUp,
     Tabs,
     wtqd,
-    RequirementList
+    RequirementList,
+    MapDialog
   },
 
   data() {
@@ -244,6 +270,7 @@ export default {
     // this.init(queryOrgId, queryOrgLevel);
     this.changeCustomerName();
     this.getMapData();
+    // this.$refs.map.setNumpoint()
   },
 
   watch: {
@@ -433,6 +460,7 @@ export default {
           orgLevel: this.currentLevel,
         };
         this.peopleType = this.currentLevel === "grid" ? "unit" : "staffAgency";
+        // this.$refs.MapDialog.open(this.currentLevelData)
       });
     },
 
@@ -495,8 +523,9 @@ export default {
 </script>
 <style lang="scss" scoped>
 .g-center {
-  width: 930px!important;
+  width: 930px !important;
 }
+
 .up-style {
   width: 51%;
 
@@ -542,4 +571,82 @@ export default {
 .sjkb-map {
   width: 930px;
 }
+
+.map-legend {
+  width: 148px;
+  color: #fff;
+  position: absolute;
+  bottom: 20px;
+  right: 17px;
+  .legend-title {
+    font-size: 16px;
+    font-weight: bold;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    height: 32px;
+    background: url("@/assets/images/overview/map_legend_title.png");
+    margin-bottom: 4px;
+  }
+
+  .legend-list {
+    border: 1px solid #488CC5;
+    background: rgba(#0A2351, 0.66);
+    padding: 19px 12px;
+    width: 126px;
+    box-sizing: border-box;
+    margin: 0 auto;
+    .legend-item {
+      font-size: 14px;
+      display: flex;
+      align-items: center;
+      margin-bottom: 7px;
+      &:before {
+        margin-right: 6px;
+      }
+      &.blue {
+        &:before {
+          display: block;
+          width: 16px;
+          height: 18px;
+          content: '';
+          background: url("@/assets/images/overview/map_legend_blue.png");
+        }
+      }
+
+      &.orange {
+        &:before {
+          display: block;
+          width: 16px;
+          height: 18px;
+          content: '';
+          background: url("@/assets/images/overview/map_legend_orange.png");
+        }
+      }
+
+      &.green {
+        &:before {
+          display: block;
+          width: 16px;
+          height: 18px;
+          content: '';
+          background: url("@/assets/images/overview/map_legend_green.png");
+        }
+      }
+
+      &.red {
+        &:before {
+          display: block;
+          width: 16px;
+          height: 18px;
+          content: '';
+          background: url("@/assets/images/overview/map_legend_red.png");
+        }
+      }
+    }
+  }
+
+}
+
 </style>

src/views/dataBoard/satisfactionEval/components/Pagination/index.vue

@@ -121,14 +121,15 @@ export default {
     color: #A3B9DA;
   }
   /deep/ .el-input__inner {
-    background: rgba(0,23,66,0.3);
-    border: 1px solid #126AC5;
-    border-radius: 2px;
-    color: #A3B9DA;
+    background: rgba(0,23,66,0.3)!important;
+    border: 1px solid #126AC5!important;
+    border-radius: 2px!important;
+    color: #A3B9DA!important;
+    height: 28px!important;
   }
   /deep/ .el-pagination.is-background .el-pager li:not(.disabled).active {
-    background: #1A95FF;
-    border-radius: 2px;
+    background: #1A95FF!important;
+    border-radius: 2px!important;
     color: #FFFFFF!important;
   }
 }