Browse Source

【锦水pc端】-【添加数据总览模块】-weikai 2020-07-14

feature/syp_points
weikai 5 years ago
parent
commit
503f898b9d
  1. 153
      src/views/modules/analysis/issue/hottest-issue-list.vue
  2. 30
      src/views/modules/analysis/issue/hottest-issue.vue
  3. 191
      src/views/modules/analysis/issue/issue-classified-statistic-second.vue
  4. 216
      src/views/modules/analysis/issue/issue-classified-statistic.vue
  5. 427
      src/views/modules/analysis/issue/issue-detail-view.vue
  6. 152
      src/views/modules/analysis/issue/latest-issue-list.vue
  7. 30
      src/views/modules/analysis/issue/latest-issue.vue
  8. 300
      src/views/modules/analysis/item/difficult-Item-list.vue
  9. 30
      src/views/modules/analysis/item/difficult-Item.vue
  10. 152
      src/views/modules/analysis/item/hottest-item-list.vue
  11. 30
      src/views/modules/analysis/item/hottest-item.vue
  12. 436
      src/views/modules/analysis/item/item-detail-view.vue
  13. 150
      src/views/modules/analysis/item/unsolved-item-list.vue
  14. 30
      src/views/modules/analysis/item/unsolved-item.vue
  15. 153
      src/views/modules/analysis/topic/hottest-topic-list.vue
  16. 30
      src/views/modules/analysis/topic/hottest-topic.vue
  17. 151
      src/views/modules/analysis/topic/latest-topic-list.vue
  18. 30
      src/views/modules/analysis/topic/latest-topic.vue
  19. 272
      src/views/modules/analysis/topic/topic-detail.vue

153
src/views/modules/analysis/issue/hottest-issue-list.vue

@ -0,0 +1,153 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-news__topic}">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item label="所属机构">
<el-cascader v-model="ids" :options="options" :props="{ checkStrictly: true }" clearable filterable>
</el-cascader>
</el-form-item>
<el-form-item label="议题摘要" prop="topicContent">
<el-input v-model="dataForm.issueContent" placeholder="请输入关键字模糊搜索" clearable ></el-input>
</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 label="序号" type="index" show-overflow-tooltip align="center" width="50"></el-table-column>
<el-table-column prop="issueContent" label="议题摘要" header-align="center" align="center"></el-table-column>
<el-table-column prop="allDeptNames" 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="createdTime" 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 prop="expressAttitudeNum" 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 type="text" size="small" @click="detailAction(scope.row.id)">{{ $t('look') }}</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>
</div>
</el-card>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
export default {
mixins: [mixinViewModule],
name: 'hottestIssueList',
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '/analysis/issue/pageHottestIssue',
getDataListIsPage: true
},
closeVisible: false,
detailVisible: false,
dataForm: {
id: '',
streetId: '',
communityId: '',
gridId: '',
startTime: '',
endTime: '',
topicContent: ''
},
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()
}
}
},
ids: [],
options: []
}
},
components: {
},
created: function () {
this.getOptions()
},
watch: {
'ids': function (val) {
if (val.length === 0) {
this.dataForm.streetId = ''
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 1) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 2) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = ''
}
if (val.length === 3) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = this.ids[2]
}
}
},
methods: {
getOptions () {
this.$http.get(`/sys/user/deptOptions/getByLoginUser`).then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.options = res.data.options
}).catch(() => {})
},
detailAction (id) {
this.$parent.selectComponent = 'IssueDetailView'
this.$router.push({ path: '/analysis-issue-hottest-issue', query: { id: id } })
}
}
}
</script>

30
src/views/modules/analysis/issue/hottest-issue.vue

@ -0,0 +1,30 @@
<template>
<keep-alive include="hottestIssueList">
<component :is="selectComponent"></component>
</keep-alive>
</template>
<script>
import HottestIssueList from './hottest-issue-list'
import IssueDetailView from './issue-detail-view'
export default {
data () {
return {
selectComponent: HottestIssueList
}
},
components: {
HottestIssueList,
IssueDetailView
},
methods: {
init () {
this.selectComponent = HottestIssueList
}
}
}
</script>
<style lang="scss" scoped>
</style>

191
src/views/modules/analysis/issue/issue-classified-statistic-second.vue

@ -0,0 +1,191 @@
<template>
<el-dialog
:visible.sync="visible"
:title="title"
:close-on-click-modal="false"
:close-on-press-escape="false">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item label="所属机构">
<el-cascader v-model="ids" :options="options" :props="{ checkStrictly: true }" clearable filterable>
</el-cascader>
</el-form-item>
<el-form-item label="排序">
<el-select v-model="dataForm.sort" placeholder="请选择">
<el-option
v-for="item in sortOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<div class="block">
<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>
</div>
</el-form>
<el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle" style="width: 100%;">
<el-table-column label="序号" type="index" show-overflow-tooltip align="center" width="50"></el-table-column>
<el-table-column prop="categoryName" label="分类名称" header-align="center" align="center"></el-table-column>
<el-table-column prop="categoryNum" label="议题项目总数" header-align="center" align="center"></el-table-column>
<el-table-column prop="issueNum" label="议题数" header-align="center" align="center"></el-table-column>
<el-table-column prop="itemNum" label="项目数" header-align="center" align="center"></el-table-column>
<el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="150" v-if="false">
<template slot-scope="scope">
<el-button type="text" size="small" @click="queryThirdList(scope.row.categoryName)">查看三级目录</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>
<!-- 弹窗, 新增 / 修改 -->
<!-- <issue-classified-statistic-third v-if="thirdVisible" ref="issueClassifiedStatisticThird" @refreshDataList="getDataList"></issue-classified-statistic-third> -->
</el-dialog>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
// import IssueClassifiedStatisticThird from './issue-classified-statistic-third'
export default {
mixins: [mixinViewModule],
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '/analysis/issue/pageCategoryAnalysis',
getDataListIsPage: true
},
// thirdVisible: false,
visible: false,
title: '',
dataForm: {
id: '',
streetId: '',
communityId: '',
gridId: '',
startTime: '',
endTime: '',
sort: 'desc',
categoryLevel: '',
categoryName: ''
},
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()
}
}
},
ids: [],
options: [],
sortOptions: [{
value: 'desc',
label: '议题项目总数最多'
}, {
value: 'asc',
label: '议题项目总数最少'
}]
}
},
components: {
// IssueClassifiedStatisticThird
},
created: function () {
this.getOptions()
},
watch: {
'ids': function (val) {
if (val.length === 0) {
this.dataForm.streetId = ''
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 1) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 2) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = ''
}
if (val.length === 3) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = this.ids[2]
}
}
},
methods: {
init () {
this.visible = true
this.$nextTick(() => {
this.getDataList()
})
},
getOptions () {
this.$http.get(`/sys/user/deptOptions/getByLoginUser`).then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.options = res.data.options
}).catch(() => {})
}
// queryThirdList (categoryName) {
// this.thirdVisible = true
// this.$nextTick(() => {
// this.$refs.issueClassifiedStatisticThird.ids = this.ids
// this.$refs.issueClassifiedStatisticThird.dataForm.categoryName = categoryName
// this.$refs.issueClassifiedStatisticThird.dataForm.streetId = this.dataForm.streetId
// this.$refs.issueClassifiedStatisticThird.dataForm.communityId = this.dataForm.communityId
// this.$refs.issueClassifiedStatisticThird.dataForm.gridId = this.dataForm.gridId
// this.$refs.issueClassifiedStatisticThird.dataForm.startTime = this.dataForm.startTime
// this.$refs.issueClassifiedStatisticThird.dataForm.endTime = this.dataForm.endTime
// this.$refs.issueClassifiedStatisticThird.dataForm.sort = this.dataForm.sort
// this.$refs.issueClassifiedStatisticThird.dataForm.categoryLevel = '3'
// this.$refs.issueClassifiedStatisticThird.init()
// })
// }
}
}
</script>

216
src/views/modules/analysis/issue/issue-classified-statistic.vue

@ -0,0 +1,216 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-news__topic}">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item label="所属机构">
<el-cascader v-model="ids" :options="options" :props="{ checkStrictly: true }" clearable filterable>
</el-cascader>
</el-form-item>
<el-form-item label="类目筛选">
<el-select v-model="dataForm.categoryLevel" placeholder="请选择">
<el-option
v-for="item in categoryLevelOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="排序">
<el-select v-model="dataForm.sort" placeholder="请选择">
<el-option
v-for="item in sortOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</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 label="序号" type="index" show-overflow-tooltip align="center" width="50"></el-table-column>
<el-table-column prop="categoryName" label="分类名称" header-align="center" align="center"></el-table-column>
<el-table-column prop="categoryNum" label="议题项目总数" header-align="center" align="center"></el-table-column>
<el-table-column prop="issueNum" label="议题数" header-align="center" align="center"></el-table-column>
<el-table-column prop="itemNum" 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 type="text" size="small" @click="querySecondList(scope.row.categoryName)" v-if="scope.row.categoryLevel==1">查看二级目录</el-button>
<el-button type="text" size="small" @click="queryThirdList(scope.row.categoryName)" v-if="scope.row.categoryLevel==2">查看三级目录</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>
<!-- 弹窗, 新增 / 修改 -->
<issue-classified-statistic-second v-if="secondVisible" ref="issueClassifiedStatisticSecond" @refreshDataList="getDataList"></issue-classified-statistic-second>
</div>
</el-card>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
import IssueClassifiedStatisticSecond from './issue-classified-statistic-second'
export default {
mixins: [mixinViewModule],
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '/analysis/issue/pageCategoryAnalysis',
getDataListIsPage: true
},
secondVisible: false,
dataForm: {
id: '',
streetId: '',
communityId: '',
gridId: '',
startTime: '',
endTime: '',
sort: 'desc',
categoryLevel: '1'
},
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()
}
}
},
ids: [],
options: [],
categoryLevelOptions: [{
value: '1',
label: '一级类目'
}, {
value: '2',
label: '二级类目'
}, {
value: '3',
label: '三季类目'
}],
sortOptions: [{
value: 'desc',
label: '议题项目总数最多'
}, {
value: 'asc',
label: '议题项目总数最少'
}]
}
},
components: {
IssueClassifiedStatisticSecond
},
created: function () {
this.getOptions()
},
watch: {
'ids': function (val) {
if (val.length === 0) {
this.dataForm.streetId = ''
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 1) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 2) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = ''
}
if (val.length === 3) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = this.ids[2]
}
}
},
methods: {
getOptions () {
this.$http.get(`/sys/user/deptOptions/getByLoginUser`).then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.options = res.data.options
}).catch(() => {})
},
querySecondList (categoryName) {
this.secondVisible = true
this.$nextTick(() => {
this.$refs.issueClassifiedStatisticSecond.ids = this.ids
this.$refs.issueClassifiedStatisticSecond.title = this.categoryName
this.$refs.issueClassifiedStatisticSecond.dataForm.categoryName = categoryName
this.$refs.issueClassifiedStatisticSecond.dataForm.streetId = this.dataForm.streetId
this.$refs.issueClassifiedStatisticSecond.dataForm.communityId = this.dataForm.communityId
this.$refs.issueClassifiedStatisticSecond.dataForm.gridId = this.dataForm.gridId
this.$refs.issueClassifiedStatisticSecond.dataForm.startTime = this.dataForm.startTime
this.$refs.issueClassifiedStatisticSecond.dataForm.endTime = this.dataForm.endTime
this.$refs.issueClassifiedStatisticSecond.dataForm.sort = this.dataForm.sort
this.$refs.issueClassifiedStatisticSecond.dataForm.categoryLevel = '2'
this.$refs.issueClassifiedStatisticSecond.init()
})
},
queryThirdList (categoryName) {
console.log('categoryName=' + categoryName)
this.secondVisible = true
this.$nextTick(() => {
console.log(' this.ids=' + this.ids)
this.$refs.issueClassifiedStatisticSecond.ids = this.ids
this.$refs.issueClassifiedStatisticSecond.title = this.categoryName
this.$refs.issueClassifiedStatisticSecond.dataForm.categoryName = categoryName
this.$refs.issueClassifiedStatisticSecond.dataForm.streetId = this.dataForm.streetId
this.$refs.issueClassifiedStatisticSecond.dataForm.communityId = this.dataForm.communityId
this.$refs.issueClassifiedStatisticSecond.dataForm.gridId = this.dataForm.gridId
this.$refs.issueClassifiedStatisticSecond.dataForm.startTime = this.dataForm.startTime
this.$refs.issueClassifiedStatisticSecond.dataForm.endTime = this.dataForm.endTime
this.$refs.issueClassifiedStatisticSecond.dataForm.sort = this.dataForm.sort
this.$refs.issueClassifiedStatisticSecond.dataForm.categoryLevel = '3'
this.$refs.issueClassifiedStatisticSecond.init()
})
}
}
}
</script>

427
src/views/modules/analysis/issue/issue-detail-view.vue

@ -0,0 +1,427 @@
<template>
<div class="project-handle">
<el-form :model="dataForm" ref="dataForm" style="width: 100%; height: 100%;">
<div class="project-detail">
<div class="project-detail-tip">议题详情</div>
<el-form label-position="right" label-width="120px">
<el-form-item label="议题内容:">
<div>{{dataForm.issueContent}}</div>
<el-image v-for="url in dataForm.images"
style="width: 100px; height: 100px; margin-right: 10px"
:key="url"
:src="url"
:preview-src-list="previewImgList"
@click="clickImg(url)">
</el-image>
</el-form-item>
<el-form-item label="所属网格:" prop="ownGrid">
<div>{{dataForm.allDeptNames}}</div>
</el-form-item>
<el-form-item v-if="dataForm.groupName && dataForm.groupName.length > 0" label="议题来源:" prop="ownGrid">
<div>{{dataForm.groupName}}</div>
</el-form-item>
<el-form-item v-if="!dataForm.groupName || dataForm.groupName.length == 0" label="议题来源:" prop="ownGrid">
<div>党群议事</div>
</el-form-item>
<el-form-item label="上报时间:">
<div>{{dataForm.distributeTime}}</div>
</el-form-item>
<el-form-item label="上报人:">
<div>{{dataForm.nickName}}</div>
</el-form-item>
<el-form-item label="电话:" prop="mobile">
<div>{{dataForm.mobile}}</div>
</el-form-item>
<el-form-item label="所属类别:" prop="categoryName">
<div>{{dataForm.categoryName}}</div>
</el-form-item>
<el-form-item label="议题态度:">
<span>表达态度 {{dataForm.approveNum + dataForm.opposeNum + dataForm.commentNum}}</span>&nbsp;&nbsp;
<span>评论 {{dataForm.commentNum}}</span>&nbsp;&nbsp;
<span>支持 {{dataForm.approveNum}}</span>&nbsp;&nbsp;
<span>不支持 {{dataForm.opposeNum}}</span>
</el-form-item>
<el-form-item label="议题评论:">
<el-button type="text" @click="innerVisible = true">查看评论</el-button>
</el-form-item>
</el-form>
<div class="container">
<div class="location"><span style="font-weight: bold;color: #606266">上报位置:</span> {{dataForm.address}}</div>
<div id="map"></div>
</div>
</div>
<div class="project-progress">
<div class="project-progress-tip">处理进展</div>
<el-timeline>
<el-timeline-item
v-for="(item, index) in timeLineList"
:key="item.id"
:color="item.type === 'init' ? 'red' : item.type === 'project' ? '#009688' : '#ffa546'">
<div :id="`content${index}`" style="line-height:25px; ">
<div
:style="{ marginBottom: '10px', width: '35px', height: '20px', fontSize: '12px', borderRadius: '4px', background: item.type === 'project' ? '#009688': item.type === 'issue' || item.type === 'issue-project' ? '#ffa546' : '', color: '#fff', textAlign: 'center', lineHeight: '20px'}"
v-if="item.type !== 'init'">
{{item.type === 'project' ? '项目': item.type === 'issue' || item.type === 'issue-project' ? '议题' : ''}}
</div>
<div><span style="font-weight: bold; color: rgb(96, 98, 102);">[{{item | formatState}}]</span> {{item.createdTime}}</div>
<div v-if="item.state === 3">
<div><span style="font-weight: bold; color: rgb(96, 98, 102);">来源社群</span>{{item.groupName}}</div>
<div><span style="font-weight: bold; color: rgb(96, 98, 102);">处理人</span>{{item.handlerDept}}</div>
<div><span style="font-weight: bold; color: rgb(96, 98, 102);">处理人电话</span>{{item.mobile}}</div>
</div>
<div v-if="item.state !== 3">
<div><span style="font-weight: bold; color: rgb(96, 98, 102);">处理部门</span>{{item.handlerDept}}</div>
</div>
<div v-if="item.itemDeptDTOS && item.itemDeptDTOS.length > 0" style="width: 100%; display: flex;">
<div><span style="font-weight: bold; color: rgb(96, 98, 102);">吹哨部门</span> </div>
<div>
<span v-for="(csDept, index1) in item.itemDeptDTOS" :key="index1">
{{ csDept.deptName }}<br/>
</span>
</div>
</div>
<div><span style="font-weight: bold; color: rgb(96, 98, 102);">处理意见</span> {{item.advice}}</div>
<div style="display: flex;">
<el-image v-for="url in item.images"
style="width: 60px; height: 60px; object-fit: cover; margin-right: 8px; border-radius: 2px;"
:key="url"
:src="url"
:preview-src-list="previewImgList"
alt="处理图片"
@click="clickImg(url)">
</el-image>
</div>
</div>
</el-timeline-item>
</el-timeline>
</div>
<div style="width: 100%; text-align:center; float:left;">
<el-button size="medium" style="width: 95px" type="primary" @click="back">返回</el-button>
</div>
</el-form>
<el-dialog width="90%" title="评论" :visible.sync="innerVisible" append-to-body>
<el-table :data="commentsDTOs" border style="width: 100%;">
<el-table-column prop="user.userName" label="发言人" header-align="center" align="center"></el-table-column>
<el-table-column prop="commentTime" label="发言时间" header-align="center" align="center"></el-table-column>
<el-table-column prop="content" label="发言内容" header-align="center" align="center"></el-table-column>
<el-table-column prop="replyComment.userName" label="被回复人" header-align="center" align="center"></el-table-column>
<el-table-column prop="replyComment.content" label="被回复内容" header-align="center" align="center"></el-table-column>
<el-table-column :label="$t('handle')" header-align="center" align="center" width="150" v-if="false">
<template slot-scope="scope">
<el-button v-if="scope.row.shieldFlag === '0'" type="button" size="small" @click="deleteComment(scope.row.commentId)">屏蔽</el-button>
<el-button v-if="scope.row.shieldFlag === '1'" type="text" size="small">已屏蔽</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
:current-page="pageIndex"
:page-sizes="[10, 20, 50, 100]"
:page-size="limitVal"
:total="total"
layout="total, sizes, prev, pager, next, jumper"
@size-change="pageSizeChangeHandleNew"
@current-change="pageCurrentChangeHandleNew">
</el-pagination>
</el-dialog>
</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 'element-ui/lib/theme-chalk/image.css'
export default {
name: 'IssueDetailView',
data () {
return {
map: '',
innerVisible: false,
dataForm: {
id: '',
nickName: '',
distributeTime: '',
issueContent: '',
handleProgressResultDTOS: [],
issueProgressResultDTOS: [],
images: []
},
previewImgList: [],
order: '',
orderField: '',
pageIndex: 1,
limitVal: 10,
total: 0,
commentsDTOs: [],
timeLineList: []
}
},
mounted () {
this.dataForm.id = this.$route.query.id
this.init()
},
filters: {
formatState (item) {
if (item.type === 'project') {
if (item.state === 0 && item.itemDeptDTOS && item.itemDeptDTOS.length > 0) {
return '吹哨'
} else if (item.state === 0 && item.itemDeptDTOS && item.itemDeptDTOS.length === 0) {
return '回应'
} else if (item.state === 5) {
return '关闭'
} else if (item.state === 10) {
return '结案'
} else if (item.state === 15) {
return '上报网格化平台'
} else if (item.state === 20) {
return '网格化平台-受理'
} else if (item.state === 25) {
return '网格化平台-立案'
} else if (item.state === 30) {
return '网格化平台-派遣'
} else if (item.state === 35) {
return '网格化平台-中间再派'
} else if (item.state === 40) {
return '网格化平台-接单'
} else if (item.state === 45) {
return '网格化平台-处理'
} else if (item.state === 50) {
return '网格化平台-中间督办'
} else if (item.state === 55) {
return '网格化平台-催办'
} else if (item.state === 60) {
return '网格化平台-结案'
}
} else if (item.type === 'issue' || item.type === 'init') {
if (item.state === 0) {
return '审核通过'
} else if (item.state === 1) {
return '回应'
} else if (item.state === 2) {
return '关闭'
} else if (item.state === 3) {
return '转议题'
}
} else if (item.type === 'issue-project') {
return '转项目'
}
}
},
methods: {
back () {
this.$parent.init()
},
initBmap (latitude, longitude) {
this.map = new BMap.Map('map')
const point = new BMap.Point(longitude, latitude)
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.getInfo()
this.getCommentList()
}
})
},
deleteComment (val) {
this.$http['post']('/events/issue/deleteComment', { commentIds: [val] }).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.getCommentList()
}
})
}).catch(() => {})
},
clickImg (url) {
this.previewImgList = []
this.previewImgList.push(url)
},
getInfo () {
this.$http.get(`/events/issue/issueContentDetail/${this.dataForm.id}`).then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.dataForm = {
...this.dataForm,
...res.data
}
this.dataForm.handleProgressResultDTOS.forEach((item, index, arr) => {
if (index === arr.length - 1) {
item.type = 'issue-project'
} else {
item.type = 'project'
}
})
this.dataForm.issueProgressResultDTOS.forEach((item, index, arr) => {
if (index === arr.length - 1) {
item.type = 'init'
} else {
item.type = 'issue'
}
})
this.timeLineList = [...this.dataForm.handleProgressResultDTOS, ...this.dataForm.issueProgressResultDTOS]
this.$nextTick(() => {
this.timeLineList.forEach((item, index) => {
const oDiv = document.getElementById(`content${index}`)
const oBorder = oDiv.parentNode.parentNode.parentNode.firstChild
if (item.type === 'issue' || item.type === 'issue-project') {
oBorder.style.borderLeft = '1px solid #ffa546'
} else if (item.type === 'project') {
oBorder.style.borderLeft = '1px solid #009688'
}
})
})
this.initBmap(this.dataForm.issueLatitude, this.dataForm.issueLongitude)
}).catch(() => {})
},
pageSizeChangeHandleNew (val) {
this.pageIndex = 1
this.limitVal = val
this.getCommentList()
},
pageCurrentChangeHandleNew (val) {
this.pageIndex = val
this.getCommentList()
},
getCommentList () {
this.$http.get('/events/issue/comments', { params: { id: this.dataForm.id, order: this.order, orderField: this.orderField, page: this.pageIndex, limit: this.limitVal }
}).then(({ data: res }) => {
if (res.code !== 0) {
this.commentsDTOs = []
this.total = 0
return this.$message.error(res.msg)
}
this.commentsDTOs = res.data.list
this.total = res.data.total
}).catch(() => {})
}
}
}
</script>
<style lang="scss">
.project-handle {
.el-timeline {
padding-left: 9px;
font-size: 13px;
}
}
.el-form-item__label {
font-weight: bold;
}
</style>
<style lang="scss" scoped>
.project-handle {
width: 100%;
height: calc(100vh - 120px);
background: #ffffff;
box-sizing: border-box;
padding: 10px;
.project-detail {
width: 79%;
height: 80%;
border: 2px solid #ccc;
box-sizing: border-box;
padding: 10px;
padding-top: 20px;
float:left;
margin-bottom: 1%;
position:relative;
.project-detail-tip {
position: absolute;
top: 0;
left:0;
width: 80px;
height: 30px;
line-height: 30px;
color: #ffffff;
background: #4ac38b;
text-align:center;
}
.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: 80%;
float: right;
border: 2px solid #ccc;
box-sizing: border-box;
margin-left: 1%;
padding-top: 20px;
overflow-y:auto;
position: relative;
padding-top: 40px;
.project-progress-tip {
position: absolute;
top: 0;
left:0;
width: 80px;
height: 30px;
line-height: 30px;
color: #ffffff;
background: #0098ff;
text-align:center;
}
&::-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>

152
src/views/modules/analysis/issue/latest-issue-list.vue

@ -0,0 +1,152 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-news__topic}">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item label="所属机构">
<el-cascader v-model="ids" :options="options" :props="{ checkStrictly: true }" clearable filterable>
</el-cascader>
</el-form-item>
<el-form-item label="议题摘要" prop="topicContent">
<el-input v-model="dataForm.issueContent" placeholder="请输入关键字模糊搜索" clearable ></el-input>
</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 label="序号" type="index" show-overflow-tooltip align="center" width="50"></el-table-column>
<el-table-column prop="issueContent" label="议题摘要" header-align="center" align="center"></el-table-column>
<el-table-column prop="allDeptNames" 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="createdTime" 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 prop="expressAttitudeNum" 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 type="text" size="small" @click="detailAction(scope.row.id)">{{ $t('look') }}</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>
</div>
</el-card>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
export default {
mixins: [mixinViewModule],
name: 'latestIssueList',
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '/analysis/issue/pageLatestIssue',
getDataListIsPage: true
},
closeVisible: false,
dataForm: {
id: '',
streetId: '',
communityId: '',
gridId: '',
startTime: '',
endTime: '',
topicContent: ''
},
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()
}
}
},
ids: [],
options: []
}
},
components: {
},
created: function () {
this.getOptions()
},
watch: {
'ids': function (val) {
if (val.length === 0) {
this.dataForm.streetId = ''
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 1) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 2) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = ''
}
if (val.length === 3) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = this.ids[2]
}
}
},
methods: {
getOptions () {
this.$http.get(`/sys/user/deptOptions/getByLoginUser`).then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.options = res.data.options
}).catch(() => {})
},
detailAction (id) {
this.$parent.selectComponent = 'IssueDetailView'
this.$router.push({ path: '/analysis-issue-latest-issue', query: { id: id } })
}
}
}
</script>

30
src/views/modules/analysis/issue/latest-issue.vue

@ -0,0 +1,30 @@
<template>
<keep-alive include="latestIssueList">
<component :is="selectComponent"></component>
</keep-alive>
</template>
<script>
import LatestIssueList from './latest-issue-list'
import IssueDetailView from './issue-detail-view'
export default {
data () {
return {
selectComponent: LatestIssueList
}
},
components: {
LatestIssueList,
IssueDetailView
},
methods: {
init () {
this.selectComponent = LatestIssueList
}
}
}
</script>
<style lang="scss" scoped>
</style>

300
src/views/modules/analysis/item/difficult-Item-list.vue

@ -0,0 +1,300 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-news__topic}">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item label="所属机构">
<el-cascader v-model="ids" :options="options" :props="{ checkStrictly: true }" clearable filterable>
</el-cascader>
</el-form-item>
<el-form-item label="排序规则">
<el-select v-model="dataForm.orderType" placeholder="请选择">
<el-option
v-for="item in sortOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="转项目时间"
prop="changeItemStartTime">
<el-date-picker v-model="dataForm.changeItemStartTime"
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="changeItemEndTime">
<el-date-picker v-model="dataForm.changeItemEndTime"
type="date"
:picker-options="pickerBeginDateAfter"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
placeholder="选择日期时间">
</el-date-picker>
</el-form-item>
<el-form-item label="项目状态">
<el-select v-model="dataForm.itemState" placeholder="全部" clearable >
<el-option
v-for="item in itemStateOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="处理完毕时间"
prop="processedStartTime">
<el-date-picker v-model="dataForm.processedStartTime"
type="date"
:picker-options="pickerBeginDateBefore1"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
placeholder="选择日期时间">
</el-date-picker>
</el-form-item>
<el-form-item label="至"
label-width="25px"
prop="processedEndTime">
<el-date-picker v-model="dataForm.processedEndTime"
type="date"
:picker-options="pickerBeginDateAfter1"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
placeholder="选择日期时间">
</el-date-picker>
</el-form-item>
<el-form-item label="满意度">
<el-select v-model="dataForm.evaluationScore" placeholder="全部" clearable >
<el-option
v-for="item in evaluationScoreOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="是否流转网格化平台">
<el-select v-model="dataForm.reportFlag" placeholder="全部" clearable >
<el-option
v-for="item in reportFlagOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</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 label="序号" type="index" show-overflow-tooltip align="center" 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="operatNum" label="处理次数" header-align="center" align="center" ></el-table-column>
<el-table-column prop="reportFlag" label="是否流转网格化平台" header-align="center" align="center" :formatter="showReportFlagFormatter"></el-table-column>
<el-table-column prop="deptNum" label="涉及部门数量" header-align="center" align="center" ></el-table-column>
<el-table-column prop="itemState" label="项目状态" header-align="center" align="center" :formatter="showItemStateNameFormatter"></el-table-column>
<el-table-column prop="processedTime" label="处理完毕时间" header-align="center" align="center"></el-table-column>
<el-table-column prop="takeTime" label="处理时长(h)" header-align="center" align="center" ></el-table-column>
<el-table-column prop="allDeptNames" label="项目来源网格" header-align="center" align="center"></el-table-column>
<el-table-column prop="evaluationScore" label="居民满意度评价" header-align="center" align="center" :formatter="showEvaluationScoreNameFormatter"></el-table-column>
<el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="150">
<template slot-scope="scope">
<el-button type="text" size="small" @click="look(scope.row.id)">{{ $t('look') }}</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>
</div>
</el-card>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
export default {
mixins: [mixinViewModule],
name: 'difficultItemList',
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '/analysis/item/pageDifficultItem',
getDataListIsPage: true
},
sortOptions: [{
value: '0',
label: '耗时最长'
}, {
value: '1',
label: '涉及部门最多'
},
{
value: '2',
label: '处理次数最多'
}],
itemStateOptions: [{
value: '0',
label: '处理中'
},
{
value: '5',
label: '已关闭'
}, {
value: '10',
label: '已结案'
}],
evaluationScoreOptions: [{
value: '0',
label: '不满意'
},
{
value: '1',
label: '基本满意'
}, {
value: '2',
label: '非常满意'
}],
reportFlagOptions: [{
value: '0',
label: '否'
},
{
value: '1',
label: '是'
}],
closeVisible: false,
dataForm: {
id: '',
streetId: '',
communityId: '',
gridId: '',
orderType: '',
changeItemStartTime: '',
changeItemEndTime: '',
itemState: '',
processedStartTime: '',
processedEndTime: '',
evaluationScore: '',
reportFlag: ''
},
pickerBeginDateBefore: {
disabledDate: (time) => {
let beginDateVal = this.dataForm.changeItemStartTime
if (beginDateVal) {
return time.getTime() > new Date(beginDateVal).getTime()
}
}
},
pickerBeginDateAfter: {
disabledDate: (time) => {
let EndDateVal = this.dataForm.changeItemEndTime
if (EndDateVal) {
return time.getTime() < new Date(EndDateVal).getTime()
}
}
},
pickerBeginDateBefore1: {
disabledDate: (time) => {
let beginDateVal = this.dataForm.processedStartTime
if (beginDateVal) {
return time.getTime() > new Date(beginDateVal).getTime()
}
}
},
pickerBeginDateAfter1: {
disabledDate: (time) => {
let EndDateVal = this.dataForm.processedEndTime
if (EndDateVal) {
return time.getTime() < new Date(EndDateVal).getTime()
}
}
},
ids: [],
options: []
}
},
components: {
},
created: function () {
this.getOptions()
},
watch: {
'ids': function (val) {
if (val.length === 0) {
this.dataForm.streetId = ''
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 1) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 2) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = ''
}
if (val.length === 3) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = this.ids[2]
}
}
},
methods: {
showReportFlagFormatter: function (row, column) {
if (row.reportFlag) {
let dict = this.reportFlagOptions.filter(item => item.value === row.reportFlag)[0]
if (dict) {
return dict.label
}
}
return ''
},
showItemStateNameFormatter: function (row, column) {
if (row.itemState) {
let dict = this.itemStateOptions.filter(item => item.value === row.itemState)[0]
if (dict) {
return dict.label
}
}
return ''
},
showEvaluationScoreNameFormatter: function (row, column) {
if (row.evaluationScore) {
let dict = this.evaluationScoreOptions.filter(item => item.value === row.evaluationScore)[0]
if (dict) {
return dict.label
}
}
return ''
},
getOptions () {
this.$http.get(`/sys/user/deptOptions/getByLoginUser`).then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.options = res.data.options
}).catch(() => {})
},
look (id) {
this.$parent.selectComponent = 'ItemDetailView'
this.$router.push({ path: '/analysis-item-difficult-Item', query: { id: id } })
}
}
}
</script>

30
src/views/modules/analysis/item/difficult-Item.vue

@ -0,0 +1,30 @@
<template>
<keep-alive include="difficultItemList">
<component :is="selectComponent"></component>
</keep-alive>
</template>
<script>
import DifficultItemList from './difficult-Item-list'
import ItemDetailView from './item-detail-view'
export default {
data () {
return {
selectComponent: DifficultItemList
}
},
components: {
DifficultItemList,
ItemDetailView
},
methods: {
init () {
this.selectComponent = DifficultItemList
}
}
}
</script>
<style lang="scss" scoped>
</style>

152
src/views/modules/analysis/item/hottest-item-list.vue

@ -0,0 +1,152 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-news__topic}">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item label="所属机构">
<el-cascader v-model="ids" :options="options" :props="{ checkStrictly: true }" clearable filterable>
</el-cascader>
</el-form-item>
<el-form-item label="项目摘要" prop="topicContent">
<el-input v-model="dataForm.searchContent" placeholder="请输入关键字模糊搜索" clearable ></el-input>
</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 label="序号" type="index" show-overflow-tooltip align="center" width="50"></el-table-column>
<el-table-column prop="itemContent" label="项目摘要" header-align="center" align="center"></el-table-column>
<el-table-column prop="allDeptNames" 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="releaseTime" 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 prop="expressAttitudeNum" 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 type="text" size="small" @click="look(scope.row.id)">{{ $t('look') }}</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>
</div>
</el-card>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
export default {
mixins: [mixinViewModule],
name: 'hottestItemList',
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '/analysis/item/pageHottestItem',
getDataListIsPage: true
},
closeVisible: false,
dataForm: {
id: '',
streetId: '',
communityId: '',
gridId: '',
startTime: '',
endTime: '',
searchContent: ''
},
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()
}
}
},
ids: [],
options: []
}
},
components: {
},
created: function () {
this.getOptions()
},
watch: {
'ids': function (val) {
if (val.length === 0) {
this.dataForm.streetId = ''
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 1) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 2) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = ''
}
if (val.length === 3) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = this.ids[2]
}
}
},
methods: {
getOptions () {
this.$http.get(`/sys/user/deptOptions/getByLoginUser`).then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.options = res.data.options
}).catch(() => {})
},
look (id) {
this.$parent.selectComponent = 'ItemDetailView'
this.$router.push({ path: '/analysis-item-hottest-item', query: { id: id } })
}
}
}
</script>

30
src/views/modules/analysis/item/hottest-item.vue

@ -0,0 +1,30 @@
<template>
<keep-alive include="hottestItemList">
<component :is="selectComponent"></component>
</keep-alive>
</template>
<script>
import HottestItemList from './hottest-item-list'
import ItemDetailView from './item-detail-view'
export default {
data () {
return {
selectComponent: HottestItemList
}
},
components: {
HottestItemList,
ItemDetailView
},
methods: {
init () {
this.selectComponent = HottestItemList
}
}
}
</script>
<style lang="scss" scoped>
</style>

436
src/views/modules/analysis/item/item-detail-view.vue

@ -0,0 +1,436 @@
<template>
<div class="project-handle">
<el-form :model="dataForm" ref="dataForm" style="width: 100%; height: 100%;">
<div class="project-detail">
<div class="project-detail-tip">项目详情</div>
<el-form label-position="right" label-width="145px">
<el-form-item label="项目内容:">
<div>{{dataForm.itemContent}}</div>
<el-image v-for="url in dataForm.images"
style="width: 100px; height: 100px; margin-right: 10px"
:key="url"
:src="url"
:preview-src-list="previewImgList"
@click="clickImg(url)">
</el-image>
</el-form-item>
<el-form-item v-if="dataForm.groupName && dataForm.groupName.length > 0" label="项目来源:" prop="ownGrid">
<div>{{dataForm.groupName}}</div>
</el-form-item>
<el-form-item label="上报时间:">
<div>{{dataForm.distributeTime}}</div>
</el-form-item>
<el-form-item label="上报人:">
<div>{{dataForm.nickName}}</div>
</el-form-item>
<el-form-item label="电话:" prop="mobile">
<div>{{dataForm.mobile}}</div>
</el-form-item>
<el-form-item label="所属类别:" prop="categoryName">
<div>{{dataForm.categoryName}}</div>
</el-form-item>
<el-form-item label="项目态度:">
<span>表达态度 {{dataForm.approveNum + dataForm.opposeNum + dataForm.commentNum}}</span>&nbsp;&nbsp;
<span>评论 {{dataForm.commentNum}}</span>&nbsp;&nbsp;
<span>支持 {{dataForm.approveNum}}</span>&nbsp;&nbsp;
<span>不支持 {{dataForm.opposeNum}}</span>
</el-form-item>
<el-form-item label="项目评论:">
<el-button type="text" @click="innerVisible = true">查看评论</el-button>
</el-form-item>
<el-form-item label="用户满意度评价:" v-if="dataForm.itemState === 10">
<div>{{dataForm.evaluationScore}}</div>
</el-form-item>
<el-form-item label="用户满意度评价内容:" v-if="dataForm.itemState === 10">
<div>{{dataForm.evaluationContent}}</div>
</el-form-item>
<el-form-item label="部门满意度评价:" v-if="dataForm.itemState === 10">
<div v-for="(deptEvaluateResultDTO, index) in dataForm.deptEvaluateResultDTOS" :key="index" style="margin: 5px">
<span>{{deptEvaluateResultDTO.deptName}}</span> &nbsp;&nbsp;
<span>{{deptEvaluateResultDTO.evaluationLevel}}</span>
</div>
</el-form-item>
</el-form>
<div class="container">
<div class="location"><span style="font-weight: bold;color: #606266">上报位置:</span> {{dataForm.issueAddress}}</div>
<div id="map"></div>
</div>
</div>
<div class="project-progress">
<div class="project-progress-tip">处理进展</div>
<el-timeline>
<el-timeline-item
v-for="(item, index) in timeLineList"
:key="item.id"
:color="item.type === 'init' ? 'red' : item.type === 'project' ? '#009688' : '#ffa546'">
<div :id="`content${index}`" style="line-height:25px; ">
<div
:style="{ marginBottom: '10px', width: '35px', height: '20px', fontSize: '12px', borderRadius: '4px', background: item.type === 'project' ? '#009688': item.type === 'issue' || item.type === 'issue-project' ? '#ffa546' : '', color: '#fff', textAlign: 'center', lineHeight: '20px'}"
v-if="item.type !== 'init'">
{{item.type === 'project' ? '项目': item.type === 'issue' || item.type === 'issue-project' ? '议题' : ''}}
</div>
<div><span style="font-weight: bold; color: rgb(96, 98, 102);">[{{item | formatState}}]</span> {{item.createdTime}}</div>
<div v-if="item.state === 3">
<div><span style="font-weight: bold; color: rgb(96, 98, 102);">来源社群</span>{{item.groupName}}</div>
<div><span style="font-weight: bold; color: rgb(96, 98, 102);">处理人</span>{{item.handlerDept}}</div>
<div><span style="font-weight: bold; color: rgb(96, 98, 102);">处理人电话</span>{{item.mobile}}</div>
</div>
<div v-if="item.state !== 3">
<div><span style="font-weight: bold; color: rgb(96, 98, 102);">处理部门</span>{{item.handlerDept}}</div>
</div>
<div v-if="item.itemDeptDTOS && item.itemDeptDTOS.length > 0" style="width: 100%; display: flex;">
<div><span style="font-weight: bold; color: rgb(96, 98, 102);">被吹哨部门</span> </div>
<div>
<span v-for="(csDept, index1) in item.itemDeptDTOS" :key="index1">
{{ csDept.deptName }}<br/>
</span>
</div>
</div>
<div><span style="font-weight: bold; color: rgb(96, 98, 102);">处理意见</span> {{item.advice}}</div>
<div style="display: flex;">
<el-image v-for="url in item.images"
style="width: 60px; height: 60px; object-fit: cover; margin-right: 8px; border-radius: 2px;"
:key="url"
:src="url"
:preview-src-list="previewImgList"
alt="处理图片"
@click="clickImg(url)">
</el-image>
</div>
</div>
</el-timeline-item>
</el-timeline>
</div>
<div style="width: 100%; text-align:center; float:left;">
<el-button size="medium" style="width: 95px" type="primary" @click="back">返回</el-button>
</div>
</el-form>
<el-dialog width="90%" title="评论" :visible.sync="innerVisible" append-to-body>
<el-table :data="commentsDTOs" border style="width: 100%;">
<el-table-column prop="user.userName" label="发言人" header-align="center" align="center"></el-table-column>
<el-table-column prop="commentTime" label="发言时间" header-align="center" align="center"></el-table-column>
<el-table-column prop="content" label="发言内容" header-align="center" align="center"></el-table-column>
<el-table-column prop="replyComment.userName" label="被回复人" header-align="center" align="center"></el-table-column>
<el-table-column prop="replyComment.content" label="被回复内容" header-align="center" align="center"></el-table-column>
<el-table-column :label="$t('handle')" header-align="center" align="center" width="150" v-if="false">
<template slot-scope="scope">
<el-button v-if="scope.row.shieldFlag === '0'" type="button" size="small" @click="deleteComment(scope.row.commentId)">屏蔽</el-button>
<el-button v-if="scope.row.shieldFlag === '1'" type="text" size="small">已屏蔽</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
:current-page="pageIndex"
:page-sizes="[10, 20, 50, 100]"
:page-size="limitVal"
:total="total"
layout="total, sizes, prev, pager, next, jumper"
@size-change="pageSizeChangeHandleNew"
@current-change="pageCurrentChangeHandleNew">
</el-pagination>
</el-dialog>
</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 'element-ui/lib/theme-chalk/image.css'
export default {
name: 'itemCloseDetailView',
data () {
return {
map: '',
innerVisible: false,
dataForm: {
id: '',
nickName: '',
distributeTime: '',
itemContent: '',
handleProgressResultDTOS: [],
issueProgressResultDTOS: [],
images: []
},
previewImgList: [],
order: '',
orderField: '',
pageIndex: 1,
limitVal: 10,
total: 0,
commentsDTOs: [],
timeLineList: []
}
},
mounted () {
this.dataForm.id = this.$route.query.id
this.init()
},
filters: {
formatState (item) {
if (item.type === 'project') {
if (item.state === 0 && item.itemDeptDTOS && item.itemDeptDTOS.length > 0) {
return '吹哨'
} else if (item.state === 0 && item.itemDeptDTOS && item.itemDeptDTOS.length === 0) {
return '回应'
} else if (item.state === 5) {
return '关闭'
} else if (item.state === 10) {
return '结案'
} else if (item.state === 15) {
return '上报网格化平台'
} else if (item.state === 20) {
return '网格化平台-受理'
} else if (item.state === 25) {
return '网格化平台-立案'
} else if (item.state === 30) {
return '网格化平台-派遣'
} else if (item.state === 35) {
return '网格化平台-中间再派'
} else if (item.state === 40) {
return '网格化平台-接单'
} else if (item.state === 45) {
return '网格化平台-处理'
} else if (item.state === 50) {
return '网格化平台-中间督办'
} else if (item.state === 55) {
return '网格化平台-催办'
} else if (item.state === 60) {
return '网格化平台-结案'
}
} else if (item.type === 'issue' || item.type === 'init') {
if (item.state === 0) {
return '审核通过'
} else if (item.state === 1) {
return '回应'
} else if (item.state === 2) {
return '关闭'
} else if (item.state === 3) {
return '转议题'
}
} else if (item.type === 'issue-project') {
return '转项目'
}
}
},
methods: {
back () {
this.$parent.init()
// this.$router.push({ path: this.$route.path })
},
initBmap (latitude, longitude) {
this.map = new BMap.Map('map')
const point = new BMap.Point(longitude, latitude)
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.getInfo()
this.getCommentList()
}
})
},
clickImg (url) {
this.previewImgList = []
this.previewImgList.push(url)
},
deleteComment (val) {
this.$http['post']('/events/item/deleteComment', { commentIds: [val] }).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.getCommentList()
}
})
}).catch(() => {})
},
getInfo () {
this.$http.get(`/events/item/contentDetail/${this.dataForm.id}`).then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.dataForm = {
...this.dataForm,
...res.data
}
this.dataForm.handleProgressResultDTOS.forEach((item, index, arr) => {
if (index === arr.length - 1) {
item.type = 'issue-project'
} else {
item.type = 'project'
}
})
this.dataForm.issueProgressResultDTOS.forEach((item, index, arr) => {
if (index === arr.length - 1) {
item.type = 'init'
} else {
item.type = 'issue'
}
})
this.timeLineList = [...this.dataForm.handleProgressResultDTOS, ...this.dataForm.issueProgressResultDTOS]
this.$nextTick(() => {
this.timeLineList.forEach((item, index) => {
const oDiv = document.getElementById(`content${index}`)
const oBorder = oDiv.parentNode.parentNode.parentNode.firstChild
console.log(111)
if (item.type === 'issue' || item.type === 'issue-project') {
oBorder.style.borderLeft = '1px solid #ffa546'
} else if (item.type === 'project') {
oBorder.style.borderLeft = '1px solid #009688'
}
})
})
this.initBmap(this.dataForm.issueLatitude, this.dataForm.issueLongitude)
}).catch(() => {})
},
pageSizeChangeHandleNew (val) {
this.pageIndex = 1
this.limitVal = val
this.getCommentList()
},
pageCurrentChangeHandleNew (val) {
this.pageIndex = val
this.getCommentList()
},
getCommentList () {
this.$http.get('/events/item/comments', { params: { id: this.dataForm.id, order: this.order, orderField: this.orderField, page: this.pageIndex, limit: this.limitVal }
}).then(({ data: res }) => {
if (res.code !== 0) {
this.commentsDTOs = []
this.total = 0
return this.$message.error(res.msg)
}
this.commentsDTOs = res.data.list
this.total = res.data.total
}).catch(() => {})
}
}
}
</script>
<style lang="scss">
.project-handle {
.el-timeline {
padding-left: 9px;
font-size: 13px;
}
}
.el-form-item__label {
font-weight: bold;
}
</style>
<style lang="scss" scoped>
.project-handle {
width: 100%;
height: calc(100vh - 120px);
background: #ffffff;
box-sizing: border-box;
padding: 10px;
.project-detail {
width: 79%;
height: 80%;
border: 2px solid #ccc;
box-sizing: border-box;
padding: 10px;
float:left;
margin-bottom: 1%;
position: relative;
padding-top: 20px;
.project-detail-tip {
position: absolute;
top: 0;
left:0;
width: 80px;
height: 30px;
line-height: 30px;
color: #ffffff;
background: #4ac38b;
text-align:center;
}
.el-form {
width: 58%;
height: 100%;
float:left;
overflow-y:auto;
&::-webkit-scrollbar {
width: 5px;
height: 1px;
}
&::-webkit-scrollbar-thumb {
border-radius: 5px;
background: #aaa;
}
&::-webkit-scrollbar-track {
border-radius: 10px;
background: #fff;
}
}
.container {
width: 40%;
height: 80%;
float: right;
.location {
height: 30px;
line-height: 30px;
}
#map {
width: 100%;
height: calc(100% - 30px);
}
}
}
.project-progress {
width: 20%;
height: 80%;
float: right;
border: 2px solid #ccc;
box-sizing: border-box;
margin-left: 1%;
padding-top: 20px;
overflow-y:auto;
position: relative;
padding-top: 40px;
.project-progress-tip {
position: absolute;
top: 0;
left:0;
width: 80px;
height: 30px;
line-height: 30px;
color: #ffffff;
background: #0098ff;
text-align:center;
}
&::-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>

150
src/views/modules/analysis/item/unsolved-item-list.vue

@ -0,0 +1,150 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-news__topic}">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item label="所属机构">
<el-cascader v-model="ids" :options="options" :props="{ checkStrictly: true }" clearable filterable>
</el-cascader>
</el-form-item>
<el-form-item label="项目摘要" prop="topicContent">
<el-input v-model="dataForm.searchContent" placeholder="请输入关键字模糊搜索" clearable ></el-input>
</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 label="序号" type="index" show-overflow-tooltip align="center" width="50"></el-table-column>
<el-table-column prop="itemContent" label="项目内容" header-align="center" align="center" ></el-table-column>
<el-table-column prop="releaseTime" label="转项目时间" header-align="center" align="center" ></el-table-column>
<el-table-column prop="allDeptNames" 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="solveNum" label="处理次数" header-align="center" align="center" ></el-table-column>
<el-table-column prop="latestHandleTime" label="最新进展处理时间" header-align="center" align="center" ></el-table-column>
<el-table-column prop="latestHandleDeptName" 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 type="text" size="small" @click="look(scope.row.id)">{{ $t('look') }}</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>
</div>
</el-card>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
export default {
mixins: [mixinViewModule],
name: 'unSolvedItemList',
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '/analysis/item/pageUnsolvedItem',
getDataListIsPage: true
},
closeVisible: false,
dataForm: {
id: '',
streetId: '',
communityId: '',
gridId: '',
startTime: '',
endTime: '',
searchContent: ''
},
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()
}
}
},
ids: [],
options: []
}
},
components: {
},
created: function () {
this.getOptions()
},
watch: {
'ids': function (val) {
if (val.length === 0) {
this.dataForm.streetId = ''
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 1) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 2) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = ''
}
if (val.length === 3) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = this.ids[2]
}
}
},
methods: {
getOptions () {
this.$http.get(`/sys/user/deptOptions/getByLoginUser`).then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.options = res.data.options
}).catch(() => {})
},
look (id) {
this.$parent.selectComponent = 'ItemDetailView'
this.$router.push({ path: '/analysis-item-unsolved-item', query: { id: id } })
}
}
}
</script>

30
src/views/modules/analysis/item/unsolved-item.vue

@ -0,0 +1,30 @@
<template>
<keep-alive include="unSolvedItemList">
<component :is="selectComponent"></component>
</keep-alive>
</template>
<script>
import UnSolvedItemList from './unsolved-item-list'
import ItemDetailView from './item-detail-view'
export default {
data () {
return {
selectComponent: UnSolvedItemList
}
},
components: {
UnSolvedItemList,
ItemDetailView
},
methods: {
init () {
this.selectComponent = UnSolvedItemList
}
}
}
</script>
<style lang="scss" scoped>
</style>

153
src/views/modules/analysis/topic/hottest-topic-list.vue

@ -0,0 +1,153 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-news__topic}">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item label="所属机构">
<el-cascader v-model="ids" :options="options" :props="{ checkStrictly: true }" clearable filterable>
</el-cascader>
</el-form-item>
<el-form-item label="话题摘要" prop="topicContent">
<el-input v-model="dataForm.topicContent" placeholder="请输入关键字模糊搜索" clearable ></el-input>
</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 label="序号" type="index" show-overflow-tooltip align="center" width="50"></el-table-column>
<el-table-column prop="topicContent" label="话题摘要" header-align="center" align="center"></el-table-column>
<el-table-column prop="allDeptNames" label="来源网格" header-align="center" align="center"></el-table-column>
<el-table-column prop="groupName" 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="releaseTime" 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 prop="expressAttitudeNum" 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 type="text" size="small" @click="look(scope.row.id)">{{ $t('look') }}</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>
</div>
</el-card>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
export default {
mixins: [mixinViewModule],
name: 'hottestTopicList',
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '/analysis/topic/pageHottestTopic',
getDataListIsPage: true
},
closeVisible: false,
dataForm: {
id: '',
streetId: '',
communityId: '',
gridId: '',
startTime: '',
endTime: '',
topicContent: ''
},
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()
}
}
},
ids: [],
options: []
}
},
components: {
},
created: function () {
this.getOptions()
},
watch: {
'ids': function (val) {
if (val.length === 0) {
this.dataForm.streetId = ''
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 1) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 2) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = ''
}
if (val.length === 3) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = this.ids[2]
}
}
},
methods: {
getOptions () {
this.$http.get(`/sys/user/deptOptions/getByLoginUser`).then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.options = res.data.options
}).catch(() => {})
},
look (id) {
this.$parent.selectComponent = 'TopicDetail'
this.$router.push({ path: '/analysis-topic-hottest-topic', query: { id: id } })
}
}
}
</script>

30
src/views/modules/analysis/topic/hottest-topic.vue

@ -0,0 +1,30 @@
<template>
<keep-alive include="hottestTopicList">
<component :is="selectComponent"></component>
</keep-alive>
</template>
<script>
import HottestTopicList from './hottest-topic-list'
import TopicDetail from './topic-detail'
export default {
data () {
return {
selectComponent: HottestTopicList
}
},
components: {
HottestTopicList,
TopicDetail
},
methods: {
init () {
this.selectComponent = HottestTopicList
}
}
}
</script>
<style lang="scss" scoped>
</style>

151
src/views/modules/analysis/topic/latest-topic-list.vue

@ -0,0 +1,151 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-news__topic}">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item label="所属机构">
<el-cascader v-model="ids" :options="options" :props="{ checkStrictly: true }" clearable filterable>
</el-cascader>
</el-form-item>
<el-form-item label="话题摘要" prop="topicContent">
<el-input v-model="dataForm.topicContent" placeholder="请输入关键字模糊搜索" clearable ></el-input>
</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 label="序号" type="index" show-overflow-tooltip align="center" width="50"></el-table-column>
<el-table-column prop="topicContent" label="话题摘要" header-align="center" align="center"></el-table-column>
<el-table-column prop="allDeptNames" label="来源网格" header-align="center" align="center"></el-table-column>
<el-table-column prop="groupName" 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="releaseTime" 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 prop="expressAttitudeNum" 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 type="text" size="small" @click="look(scope.row.id)">{{ $t('look') }}</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>
</div>
</el-card>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
export default {
mixins: [mixinViewModule],
name: 'latestTopicList',
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '/analysis/topic/pageLatestTopic',
getDataListIsPage: true
},
closeVisible: false,
dataForm: {
id: '',
streetId: '',
communityId: '',
gridId: '',
startTime: '',
endTime: '',
topicContent: ''
},
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()
}
}
},
ids: [],
options: []
}
},
components: {
},
created: function () {
this.getOptions()
},
watch: {
'ids': function (val) {
if (val.length === 0) {
this.dataForm.streetId = ''
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 1) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = ''
this.dataForm.gridId = ''
}
if (val.length === 2) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = ''
}
if (val.length === 3) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = this.ids[2]
}
}
},
methods: {
getOptions () {
this.$http.get(`/sys/user/deptOptions/getByLoginUser`).then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.options = res.data.options
}).catch(() => {})
},
look (id) {
this.$parent.selectComponent = 'TopicDetail'
this.$router.push({ path: '/analysis-topic-latest-topic', query: { id: id } })
}
}
}
</script>

30
src/views/modules/analysis/topic/latest-topic.vue

@ -0,0 +1,30 @@
<template>
<keep-alive include="latestTopicList">
<component :is="selectComponent"></component>
</keep-alive>
</template>
<script>
import LatestTopicList from './latest-topic-list'
import TopicDetail from './topic-detail'
export default {
data () {
return {
selectComponent: LatestTopicList
}
},
components: {
LatestTopicList,
TopicDetail
},
methods: {
init () {
this.selectComponent = LatestTopicList
}
}
}
</script>
<style lang="scss" scoped>
</style>

272
src/views/modules/analysis/topic/topic-detail.vue

@ -0,0 +1,272 @@
<template>
<div class="project-handle">
<el-form :model="dataForm" ref="dataForm" style="width: 100%; height: 100%;">
<div class="project-detail">
<div class="project-detail-tip">话题详情</div>
<el-form label-position="right" label-width="120px">
<el-form-item label="话题内容:" prop="eventContent">
<div>{{dataForm.topicContent}}</div>
<el-image v-for="url in dataForm.images"
style="width: 100px; height: 100px; margin-right: 10px"
:key="url"
:src="url"
:preview-src-list="previewImgList"
@click="clickImg(url)">
</el-image>
</el-form-item>
<el-form-item label="所属网格:" prop="allDeptNames">
<div>{{dataForm.allDeptNames}}</div>
</el-form-item>
<el-form-item label="话题来源:" prop="groupName">
<div>{{dataForm.groupName}}</div>
</el-form-item>
<el-form-item label="发言人:" prop="nickName">
<div>{{dataForm.nickname}}</div>
</el-form-item>
<el-form-item label="评论:">
<el-button type="primary" @click="innerVisible = true">点击查看评论</el-button>
</el-form-item>
</el-form>
<div class="container">
<div class="location"><span style="font-weight: bold;color: #606266">上报位置:</span> {{dataForm.topicAddress}}</div>
<div id="map"></div>
</div>
</div>
<div style="width: 100%; text-align:center; float:left;">
<el-button size="medium" style="width: 95px" type="primary" @click="back">返回</el-button>
</div>
</el-form>
<el-dialog width="90%" title="评论" :visible.sync="innerVisible" append-to-body>
<el-table :data="commentsDTOs" border style="width: 100%;">
<el-table-column prop="user.userName" label="发言人" header-align="center" align="center"></el-table-column>
<el-table-column prop="commentTime" label="发言时间" header-align="center" align="center"></el-table-column>
<el-table-column prop="content" label="发言内容" header-align="center" align="center"></el-table-column>
<el-table-column prop="replyComment.userName" label="被回复人" header-align="center" align="center"></el-table-column>
<el-table-column prop="replyComment.content" label="被回复内容" header-align="center" align="center"></el-table-column>
<el-table-column :label="$t('handle')" header-align="center" align="center" width="150" v-if="false">
<template slot-scope="scope">
<el-button v-if="scope.row.shieldFlag === '0'" type="button" size="small" @click="deleteComment(scope.row.commentId)">屏蔽</el-button>
<el-button v-if="scope.row.shieldFlag === '1'" type="text" size="small">已屏蔽</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
:current-page="pageIndex"
:page-sizes="[10, 20, 50, 100]"
:page-size="limitVal"
:total="total"
layout="total, sizes, prev, pager, next, jumper"
@size-change="pageSizeChangeHandleNew"
@current-change="pageCurrentChangeHandleNew">
</el-pagination>
</el-dialog>
</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 'element-ui/lib/theme-chalk/image.css'
export default {
data () {
return {
innerVisible: false,
dataForm: {
id: ''
},
previewImgList: [],
order: '',
orderField: '',
pageIndex: 1,
limitVal: 10,
total: 0,
commentsDTOs: []
}
},
mounted () {
this.dataForm.id = this.$route.query.id
this.init()
},
methods: {
back () {
this.$parent.init()
},
initBmap (latitude, longitude) {
this.map = new BMap.Map('map')
const point = new BMap.Point(longitude, latitude)
var marker = new BMap.Marker(point)
this.map.addOverlay(marker)
this.map.centerAndZoom(point, 13)
this.map.enableScrollWheelZoom(true)
},
clickImg (url) {
this.previewImgList = []
this.previewImgList.push(url)
},
init () {
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
this.getInfo()
this.getCommentList()
}
})
},
//
getInfo () {
this.$http.get(`/group/topic/detail/${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.topicLatitude, this.dataForm.topicLongitude)
}).catch(() => {})
},
pageSizeChangeHandleNew (val) {
this.pageIndex = 1
this.limitVal = val
this.getCommentList()
},
pageCurrentChangeHandleNew (val) {
this.pageIndex = val
this.getCommentList()
},
getCommentList () {
this.$http.get('/group/topiccomment/comments', { params: { id: this.dataForm.id, order: this.order, orderField: this.orderField, page: this.pageIndex, limit: this.limitVal }
}).then(({ data: res }) => {
if (res.code !== 0) {
this.commentsDTOs = []
this.total = 0
return this.$message.error(res.msg)
}
this.commentsDTOs = res.data.list
this.total = res.data.total
}).catch(() => {})
},
deleteComment (val) {
this.$http['post'](
'/group/topiccomment/deleteComment', { commentIds: [val] }).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.getCommentList()
}
})
}).catch(() => {})
}
}
}
</script>
<style lang="scss">
.project-handle {
.el-timeline {
padding-left: 9px;
font-size: 13px;
}
}
.el-form-item__label {
font-weight: bold;
}
</style>
<style lang="scss" scoped>
.project-handle {
width: 100%;
height: calc(100vh - 120px);
background: #ffffff;
box-sizing: border-box;
padding: 10px;
.project-detail {
width: 100%;
height: 80%;
border: 2px solid #ccc;
box-sizing: border-box;
padding: 10px;
padding-top: 20px;
float:left;
margin-bottom: 1%;
position:relative;
.project-detail-tip {
position: absolute;
top: 0;
left:0;
width: 80px;
height: 30px;
line-height: 30px;
color: #ffffff;
background: #4ac38b;
text-align:center;
}
.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>
Loading…
Cancel
Save