diff --git a/src/views/modules/events/item-deal-detail-view.vue b/src/views/modules/events/item-deal-detail-view.vue
new file mode 100644
index 00000000..16fa24bc
--- /dev/null
+++ b/src/views/modules/events/item-deal-detail-view.vue
@@ -0,0 +1,371 @@
+<template>
+  <div class="project-handle">
+    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" style="width: 100%; height: 100%;">
+      <div class="project-detail">
+        <el-form label-position="right" label-width="120px">
+          <el-form-item label="议题内容:" prop="eventContent">
+            <div>{{dataForm.itemContent}}</div>
+            <span v-for="(imgUrl, index) in dataForm.images" :key="index" style="margin: 5px">
+              <el-popover placement="bottom" title="" trigger="click">
+                <img :src="imgUrl" style='width: 300px;height: 300px;'>
+                <img slot="reference" :src="imgUrl" :alt="imgUrl" style="max-height: 100px;max-width: 100px">
+              </el-popover>
+            </span>
+          </el-form-item>
+          <el-form-item label="上报时间:" prop="distributeTime">
+            <div>{{dataForm.distributeTime}}</div>
+          </el-form-item>
+          <el-form-item label="上报人:" prop="nickName">
+            <div>{{dataForm.nickName}}</div>
+          </el-form-item>
+          <el-form-item label="所属类别:" prop="categoryName">
+            <div>{{dataForm.categoryName}}</div>
+          </el-form-item>
+        </el-form>
+        <div class="container">
+          <div class="location">上报位置: {{dataForm.issueAddress}}</div>
+          <div id="map"></div>
+        </div>
+      </div>
+      <div class="project-progress">
+        <el-timeline>
+          <el-timeline-item
+            v-for="(activity, index) in this.dataForm.handleProgressResultDTOS"
+            :key="index"
+            :icon="activity.icon"
+            :type="activity.type"
+            :color="activity.color"
+            :size="activity.size">
+            <div v-if="activity.itemDeptDTOS.length > 0">{{activity.createdTime}} {{ '【吹哨】' }}</div>
+            <div v-else-if="activity.itemDeptDTOS.length <= 0 && activity.progressName !== '【审核通过】'">{{activity.createdTime}} {{ '【回应】' }}</div>
+            <div v-else>{{activity.createdTime}} {{activity.progressName}}</div>
+            <div>处理部门： {{activity.handlerDept}}</div>
+            <div v-if="activity.itemDeptDTOS.length > 0">
+              吹哨部门：<span v-for="(csDept, index1) in activity.itemDeptDTOS" :key="index1" :size="csDept.size">
+                      {{ csDept.deptName }}
+            </span>
+            </div>
+            <div>处理意见： {{activity.advice}}</div>
+          </el-timeline-item>
+        </el-timeline>
+      </div>
+      <div class="handle-operation">
+        <el-form label-position="right" label-width="120px">
+          <el-form-item label="处理:" prop="handleCategory">
+            <el-select v-model="postDataForm.handleCategory" placeholder="请选择">
+              <el-option
+                      v-for="handleResultDTO in dataForm.handleResultDTOS"
+                      :key="handleResultDTO.processResult"
+                      :label="handleResultDTO.processName"
+                      :value="handleResultDTO.processResult">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="吹哨部门:" prop="deptResultDTOS" v-if="deptResultDTOSVisible">
+            <el-checkbox-group v-model="postDataForm.deptResultDTOS">
+              <el-checkbox v-for="deptResultDTO in dataForm.deptResultDTOS" :label="deptResultDTO" :key="deptResultDTO.deptName">{{deptResultDTO.deptName}}</el-checkbox>
+            </el-checkbox-group>
+          </el-form-item>
+          <el-form-item label="回复居民意见:" prop="handleAdvice">
+            <el-input v-model="postDataForm.handleAdvice" type="textarea" placeholder="请您选择居民诉求的处理情况及答复意见，向居民公开展示"></el-input>
+          </el-form-item>
+          <el-form-item label="项目处理意见:" prop="outHandleAdvice">
+            <el-input v-model="postDataForm.outHandleAdvice" type="textarea" placeholder="请您填写项目的实际办理情况(自己处理、吹哨报道、内部协调)，便于相关部门了解项目的实际情况"></el-input>
+          </el-form-item>
+          <el-form-item label="满意度评价:" prop="evaluateDeptDTOS" v-if="evaluateDeptDTOSVisible">
+            <div v-for="(evaluateDeptDTO, index) in dataForm.evaluateDeptDTOS" :key="index">
+              <label>{{evaluateDeptDTO.deptName}}</label>&nbsp;
+              <el-radio-group v-model="evaluateDeptDTO.evaluationLevel">
+                <el-radio :label="2">非常满意</el-radio>
+                <el-radio :label="1">基本满意</el-radio>
+                <el-radio :label="0">不满意</el-radio>
+              </el-radio-group>
+            </div>
+          </el-form-item>
+        </el-form>
+        <template>
+          <el-button type="primary" @click="dataFormSubmitHandle()">{{ $t('confirm') }}</el-button>
+          <el-button @click="backToItemDeal">返回</el-button>
+        </template>
+      </div>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import BMap from 'BMap'
+import 'element-ui/lib/theme-chalk/timeline.css'
+import 'element-ui/lib/theme-chalk/timeline-item.css'
+import debounce from 'lodash/debounce'
+export default {
+  name: 'itemDealDetailView',
+  data () {
+    return {
+      map: '',
+      dataForm: {
+        id: '',
+        nickName: '',
+        distributeTime: '',
+        itemContent: '',
+        images: [],
+        issueAddress: '',
+        handleProgressResultDTOS: [],
+        handleResultDTOS: [],
+        deptResultDTOS: [],
+        evaluateDeptDTOS: [],
+        handleAdvice: '',
+        outHandleAdvice: '',
+        handleCategory: '',
+        issueLatitude: '',
+        issueLongitude: ''
+      },
+      postDataForm: {
+        id: '',
+        handleAdvice: '',
+        outHandleAdvice: '',
+        handleCategory: '',
+        deptResultDTOS: [],
+        evaluateDeptDTOS: []
+      },
+      deptResultDTOSVisible: false,
+      evaluateDeptDTOSVisible: false
+    }
+  },
+  mounted () {
+    this.dataForm.id = this.$route.query.id
+    this.init()
+  },
+  computed: {
+    dataRule () {
+      return {
+        handleAdvice: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        outHandleAdvice: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        handleCategory: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        deptResultDTOS: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        evaluateDeptDTOS: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  watch: {
+    'postDataForm.handleAdvice': function (val) {
+      this.dataForm.handleAdvice = val
+    },
+    'postDataForm.outHandleAdvice': function (val) {
+      this.dataForm.outHandleAdvice = val
+    },
+    'postDataForm.handleCategory': function (val) {
+      if (val === 1) {
+        this.deptResultDTOSVisible = true
+        this.evaluateDeptDTOSVisible = false
+        for (let index = 0; index < this.dataForm.deptResultDTOS.length; index++) {
+          const deptResultDTO = this.dataForm.deptResultDTOS[index]
+          if (deptResultDTO.selected === true) {
+            this.postDataForm.deptResultDTOS.push(deptResultDTO)
+          }
+        }
+      } else if (val === 10) {
+        if (this.dataForm.evaluateDeptDTOS.length === 0) {
+          return
+        }
+        this.evaluateDeptDTOSVisible = true
+        this.deptResultDTOSVisible = false
+      } else {
+        this.evaluateDeptDTOSVisible = false
+        this.deptResultDTOSVisible = false
+      }
+    }
+  },
+  methods: {
+    backToItemDeal () {
+      this.$parent.selectComponent = 'ItemDeal'
+    },
+    initBmap (latitude, longitude) {
+      this.map = new BMap.Map('map')
+      const point = new BMap.Point(120.38821849395045, 36.120219258412966)
+      var marker = new BMap.Marker(point)
+      this.map.addOverlay(marker)
+      this.map.centerAndZoom(point, 13)
+      this.map.enableScrollWheelZoom(true)
+    },
+    init () {
+      this.$nextTick(() => {
+        if (this.dataForm.id) {
+          this.postDataForm.handleAdvice = ''
+          this.postDataForm.outHandleAdvice = ''
+          this.postDataForm.handleCategory = ''
+          this.postDataForm.deptResultDTOS = []
+          this.postDataForm.evaluateDeptDTOS = []
+          this.getInfo()
+        }
+      })
+    },
+    // 获取信息
+    getInfo () {
+      this.$http.get(`/events/item/${this.dataForm.id}`).then(({ data: res }) => {
+        if (res.code !== 0) {
+          return this.$message.error(res.msg)
+        }
+        this.dataForm = {
+          ...this.dataForm,
+          ...res.data
+        }
+        this.initBmap(this.dataForm.issueLatitude, this.dataForm.issueLongitude)
+        for (let index = 0; index < res.data.handleResultDTOS.length; index++) {
+          const handleResultDTO = res.data.handleResultDTOS[index]
+          if (handleResultDTO.select === true) {
+            this.dataForm.handleCategory = handleResultDTO.processResult
+          }
+        }
+      }).catch(() => {})
+    },
+    // 表单提交
+    dataFormSubmitHandle: debounce(function () {
+      this.postDataForm.id = this.dataForm.id
+      if (this.postDataForm.handleCategory === '') {
+        return this.$message.error('请选择处理选项')
+      }
+      if (this.deptResultDTOSVisible) {
+        if (this.postDataForm.deptResultDTOS === undefined || this.postDataForm.deptResultDTOS.length <= 0) {
+          return this.$message.error('请选择流转对象')
+        }
+      } else {
+        this.postDataForm.deptResultDTOS = []
+      }
+      if (this.postDataForm.handleAdvice === '') {
+        return this.$message.error('回复居民意见不能为空')
+      }
+      if (this.postDataForm.handleAdvice.length > 500) {
+        return this.$message.error('回复居民意见不能超过500字')
+      }
+      if (this.postDataForm.outHandleAdvice === '') {
+        return this.$message.error('项目处理意见不能为空')
+      }
+      if (this.postDataForm.outHandleAdvice > 500) {
+        return this.$message.error('项目处理意见不能超过500字')
+      }
+      if (this.evaluateDeptDTOSVisible) {
+        this.postDataForm.evaluateDeptDTOS = this.dataForm.evaluateDeptDTOS
+        if (this.postDataForm.evaluateDeptDTOS.length !== this.dataForm.evaluateDeptDTOS.length) {
+          return this.$message.error('请完善满意度调查')
+        }
+      } else {
+        this.postDataForm.evaluateDeptDTOS = []
+      }
+      this.$http['post'](
+        '/events/item/itemHandleSubmit', this.postDataForm).then(({ data: res }) => {
+        if (res.code !== 0) {
+          return this.$message.error(res.msg)
+        }
+        this.$message({
+          message: this.$t('prompt.success'),
+          type: 'success',
+          duration: 500,
+          onClose: () => {
+            this.visible = false
+            this.$emit('refreshDataList')
+          }
+        })
+      }).catch(() => {})
+    }, 1000, { 'leading': true, 'trailing': false })
+
+  }
+}
+</script>
+
+<style lang="scss">
+  .project-handle {
+    .el-timeline {
+      padding-left: 9px;
+      font-size: 13px;
+    }
+  }
+</style>
+
+<style lang="scss" scoped>
+.project-handle {
+  width: 100%;
+  height: calc(100vh - 50px - 38px - 15px);
+  background: #ffffff;
+  box-sizing: border-box;
+  padding: 10px;
+  .project-detail {
+    width: 79%;
+    height: 49%;
+    border: 2px solid #ccc;
+    box-sizing: border-box;
+    padding: 10px;
+    float:left;
+    margin-bottom: 1%;
+    .el-form {
+      width: 58%;
+      height: 100%;
+      float:left;
+      overflow-y:auto;
+      &::-webkit-scrollbar {
+        width: 5px;
+        height: 1px;
+      }
+      &::-webkit-scrollbar-thumb {
+        border-radius: 5px;
+        background: #fff;
+      }
+      &::-webkit-scrollbar-track {
+        border-radius: 10px;
+        background: #fff;
+      }
+    }
+    .container {
+      width: 40%;
+      height: 100%;
+      float: right;
+      .location {
+        height: 30px;
+        line-height: 30px;
+      }
+      #map {
+        width: 100%;
+        height: calc(100% - 30px);
+      }
+    }
+  }
+  .project-progress {
+    width: 20%;
+    height: 100%;
+    float: right;
+    border: 2px solid #ccc;
+    box-sizing: border-box;
+    margin-left: 1%;
+    padding-top: 20px;
+    overflow-y:auto;
+    &::-webkit-scrollbar {
+      width: 5px;
+      height: 1px;
+    }
+    &::-webkit-scrollbar-thumb {
+      border-radius: 5px;
+      background: #aaa;
+    }
+    &::-webkit-scrollbar-track {
+      border-radius: 10px;
+      background: #ccc;
+    }
+  }
+  .handle-operation {
+    width: 79%;
+    height: 49%;
+    box-sizing: border-box;
+    border: 2px solid #ccc;
+    float:left;
+  }
+}
+</style>
diff --git a/src/views/modules/events/item-deal-list.vue b/src/views/modules/events/item-deal-list.vue
new file mode 100644
index 00000000..6b8572c7
--- /dev/null
+++ b/src/views/modules/events/item-deal-list.vue
@@ -0,0 +1,235 @@
+<template>
+  <el-card shadow="never"
+           class="aui-card--fill">
+    <div class="mod-item__item}">
+      <el-form :inline="true"
+               :model="dataForm"
+               @keyup.enter.native="getDataList()">
+        <el-form-item label="街道">
+          <el-select v-model="dataForm.streetId"
+                     placeholder="请选择"
+                     clearable
+                     @change="getCommunityList">
+            <el-option v-for="item in streetOptions"
+                       :key="item.id"
+                       :label="item.name"
+                       :value="item.id">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="社区">
+          <el-select v-model="dataForm.communityId"
+                     placeholder="请选择"
+                     clearable
+                     @change="getGridList">
+            <el-option v-for="item in communityOptions"
+                       :key="item.id"
+                       :label="item.name"
+                       :value="item.id">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="网格">
+          <el-select v-model="dataForm.gridId" clearable
+                     placeholder="请选择">
+            <el-option v-for="item in gridOptions"
+                       :key="item.id"
+                       :label="item.name"
+                       :value="item.id">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="时间"
+                      prop="startTime">
+          <el-date-picker v-model="dataForm.startTime"
+                          type="date"
+                          :picker-options="pickerBeginDateBefore"
+                          value-format="yyyy-MM-dd"
+                          format="yyyy-MM-dd"
+                          placeholder="选择日期时间">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="至"
+                      label-width="25px"
+                      prop="endTime">
+          <el-date-picker v-model="dataForm.endTime"
+                          type="date"
+                          :picker-options="pickerBeginDateAfter"
+                          value-format="yyyy-MM-dd"
+                          format="yyyy-MM-dd"
+                          placeholder="选择日期时间">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="getDataList()">{{ $t('query') }}</el-button>
+        </el-form-item>
+      </el-form>
+      <el-table v-loading="dataListLoading"
+                :data="dataList"
+                border
+                @selection-change="dataListSelectionChangeHandle"
+                style="width: 100%;">
+        <el-table-column type="selection"
+                         header-align="center"
+                         align="center"
+                         width="50"></el-table-column>
+        <el-table-column label="序号"
+                         type="index"
+                         show-overflow-tooltip
+                         width="50"></el-table-column>
+        <el-table-column prop="itemContent"
+                         label="项目内容"
+                         header-align="center"
+                         align="center"></el-table-column>
+        <el-table-column prop="createdTime"
+                         label="转成项目时间"
+                         header-align="center"
+                         align="center"></el-table-column>
+        <el-table-column prop="nickName"
+                         label="提交人"
+                         header-align="center"
+                         align="center"></el-table-column>
+        <el-table-column prop="participantsNum"
+                         label="参与人数"
+                         header-align="center"
+                         align="center"></el-table-column>
+        <el-table-column prop="approveNum"
+                         label="支持"
+                         header-align="center"
+                         align="center"></el-table-column>
+        <el-table-column prop="opposeNum"
+                         label="反对"
+                         header-align="center"
+                         align="center"></el-table-column>
+        <el-table-column prop="commentNum"
+                         label="评论数"
+                         header-align="center"
+                         align="center"></el-table-column>
+        <el-table-column prop="browseNum"
+                         label="浏览数"
+                         header-align="center"
+                         align="center"></el-table-column>
+        <el-table-column :label="$t('handle')"
+                         fixed="right"
+                         header-align="center"
+                         align="center"
+                         width="150">
+          <template slot-scope="scope">
+            <el-button v-if="$hasPermission('events:item:deal')"
+                       type="text"
+                       size="small"
+                       @click="dealAction(scope.row.id)">{{ $t('deal') }}</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-pagination :current-page="page"
+                     :page-sizes="[10, 20, 50, 100]"
+                     :page-size="limit"
+                     :total="total"
+                     layout="total, sizes, prev, pager, next, jumper"
+                     @size-change="pageSizeChangeHandle"
+                     @current-change="pageCurrentChangeHandle">
+      </el-pagination>
+      <!-- 弹窗, 新增 / 修改 -->
+      <detail v-if="detailVisible"
+              ref="detail"
+              @refreshDataList="getDataList"></detail>
+    </div>
+  </el-card>
+</template>
+
+<script>
+import mixinViewModule from '@/mixins/view-module'
+import Detail from './item-deal-detail'
+export default {
+  mixins: [mixinViewModule],
+  data () {
+    return {
+      mixinViewModuleOptions: {
+        getDataListURL: '/events/item/page',
+        getDataListIsPage: true
+      },
+      detailVisible: false,
+      dataForm: {
+        id: '',
+        itemState: '0',
+        startTime: '',
+        endTime: '',
+        streetId: '',
+        communityId: '',
+        gridId: ''
+      },
+      streetOptions: [],
+      communityOptions: [],
+      gridOptions: [],
+      pickerBeginDateBefore: {
+        disabledDate: (time) => {
+          let beginDateVal = this.dataForm.startTime
+          if (beginDateVal) {
+            return time.getTime() > new Date(beginDateVal).getTime()
+          }
+        }
+      },
+      pickerBeginDateAfter: {
+        disabledDate: (time) => {
+          let EndDateVal = this.dataForm.endTime
+          if (EndDateVal) {
+            return time.getTime() < new Date(EndDateVal).getTime()
+          }
+        }
+      }
+    }
+  },
+  components: {
+    Detail
+  },
+  created: function () {
+    this.getStreetList()
+  },
+  methods: {
+    dealAction (id) {
+      this.$parent.selectComponent = 'ItemDealDetailView'
+      this.$router.push({ path: '/events-item-deal', query: { id: id } })
+    },
+    getStreetList () {
+      this.$http.get(`/sys/dept/sublist/` + (localStorage.getItem('street') === null ? '1169154711480528897' : localStorage.getItem('street'))).then(({ data: res }) => {
+        if (res.code !== 0) {
+          return this.$message.error(res.msg)
+        }
+        this.streetOptions = res.data
+      }).catch(() => { })
+    },
+    getCommunityList () {
+      if (this.dataForm.streetId === '') {
+        this.communityOptions = []
+        this.gridOptions = []
+        this.dataForm.communityId = ''
+        this.dataForm.gridId = ''
+        return
+      }
+      this.dataForm.communityId = ''
+      this.dataForm.gridId = ''
+      this.$http.get(`/sys/dept/sublist/` + this.dataForm.streetId).then(({ data: res }) => {
+        if (res.code !== 0) {
+          return this.$message.error(res.msg)
+        }
+        this.communityOptions = res.data
+      }).catch(() => { })
+    },
+    getGridList () {
+      if (this.dataForm.communityId === '') {
+        this.gridOptions = []
+        this.dataForm.gridId = ''
+        return
+      }
+      this.dataForm.gridId = ''
+      this.$http.get(`/sys/dept/sublist/` + this.dataForm.communityId).then(({ data: res }) => {
+        if (res.code !== 0) {
+          return this.$message.error(res.msg)
+        }
+        this.gridOptions = res.data
+      }).catch(() => { })
+    }
+  }
+}
+</script>