elink-star
/
esua-epdc-admin-js
12
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

领导端小程序

feature/syp_points
李鹏飞 5 years ago
parent
a3c0cee84a
commit
71e59750cc
11 changed files with 2801 additions and 1 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 368
      src/views/modules/case/issue-detail.vue
  2. 436
      src/views/modules/case/item-detail.vue
  3. 211
      src/views/modules/case/topic-detail.vue
  4. 573
      src/views/modules/case/typicalcase-add-or-update.vue
  5. 264
      src/views/modules/case/typicalcase-connect-list.vue
  6. 120
      src/views/modules/case/typicalcase-detail.vue
  7. 164
      src/views/modules/case/typicalcase-list.vue
  8. 31
      src/views/modules/case/typicalcase.vue
  9. 471
      src/views/modules/sys/analysis-menu-add-or-update.vue
  10. 133
      src/views/modules/sys/analysis-menu.vue
  11. 31
      src/views/modules/sys/role-add-or-update.vue

368
src/views/modules/case/issue-detail.vue
View File

@ -0,0 +1,368 @@
<template>
<el-dialog :visible.sync="visible" :title="$t('verifyLabel')" :append-to-body="true"
:modal-append-to-body="false"
:close-on-click-modal="false"
:close-on-press-escape="false"
width="80%">
<el-form :model="dataForm" ref="dataForm" style="width: 100%; height: 100%;">
<div class="project-handle">
<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>
<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>
</div>
</el-form>
</el-dialog>
</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 {
map: '',
visible: false,
dataForm: {
id: '',
nickName: '',
distributeTime: '',
issueContent: '',
handleProgressResultDTOS: [],
issueProgressResultDTOS: [],
images: []
},
previewImgList: [],
order: '',
orderField: '',
pageIndex: 1,
limitVal: 10,
total: 0,
commentsDTOs: [],
timeLineList: []
}
},
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.visible = false
},
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 (id) {
this.visible = true
this.dataForm.id = id
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
this.getInfo()
}
})
},
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(() => {})
}
}
}
</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>

436
src/views/modules/case/item-detail.vue
View File

@ -0,0 +1,436 @@
<template>
<el-dialog :visible.sync="visible" :title="$t('verifyLabel')" :append-to-body="true"
:modal-append-to-body="false"
:close-on-click-modal="false"
:close-on-press-escape="false"
width="80%">
<el-form :model="dataForm" ref="dataForm" style="width: 100%; height: 100%;">
<div class="project-handle">
<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.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="上报时间:"
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="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>
<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>
</div>
</el-form>
</el-dialog>
</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'
import debounce from 'lodash/debounce'
export default {
data () {
return {
map: '',
visible: false,
dataForm: {
id: '',
nickName: '',
distributeTime: '',
itemContent: '',
images: [],
issueAddress: '',
handleProgressResultDTOS: [],
issueProgressResultDTOS: [],
handleResultDTOS: [],
deptResultDTOS: [],
evaluateDeptDTOS: [],
handleAdvice: '',
outHandleAdvice: '',
handleCategory: '',
issueLatitude: '',
issueLongitude: ''
},
isAble: false,
previewImgList: [],
deptResult: [],
commentsDTOs: [],
pageIndex: 0,
limitVal: 10,
total: null,
postDataForm: {
id: '',
handleAdvice: '',
outHandleAdvice: '',
handleCategory: '',
deptResultDTOS: [],
evaluateDeptDTOS: []
},
deptResultDTOSVisible: false,
evaluateDeptDTOSVisible: false,
timeLineList: []
}
},
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 '转项目'
}
}
},
computed: {
dataRule () {
return {
}
}
},
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: {
back () {
this.visible = false
},
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 (id) {
this.visible = true
this.dataForm.id = id
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
this.postDataForm.handleAdvice = ''
this.postDataForm.outHandleAdvice = ''
this.postDataForm.handleCategory = ''
this.postDataForm.deptResultDTOS = []
this.postDataForm.evaluateDeptDTOS = []
this.getInfo()
}
})
},
clickImg (url) {
this.previewImgList = []
this.previewImgList.push(url)
},
// 获取信息
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.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)
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(() => { })
}
}
}
</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>

211
src/views/modules/case/topic-detail.vue
View File

@ -0,0 +1,211 @@
<template>
<el-dialog :visible.sync="visible" :title="$t('verifyLabel')" :append-to-body="true"
:modal-append-to-body="false"
:close-on-click-modal="false"
:close-on-press-escape="false"
width="80%">
<div class="project-handle">
<div class="project-detail">
<div class="project-detail-tip">话题详情</div>
<el-form :model="dataForm" ref="dataForm" style="width: 50%; height: 100%;">
<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>
<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>
</div>
</el-dialog>
</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 {
visible: false,
innerVisible: false,
dataForm: {
id: ''
},
previewImgList: [],
order: '',
orderField: '',
pageIndex: 1,
limitVal: 10,
total: 0,
commentsDTOs: []
}
},
methods: {
back () {
this.visible = false
},
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 (id) {
this.visible = true
this.dataForm.id = id
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
this.getInfo()
}
})
},
// 获取信息
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(() => {})
}
}
}
</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>

573
src/views/modules/case/typicalcase-add-or-update.vue
View File

@ -0,0 +1,573 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-news__typicalcase}">
<el-form :inline="true"
:model="dataForm"
:rules="dataRule"
ref="dataForm"
:label-width="$i18n.locale === 'en-US' ? '120px' : '120px'">
<el-row>
<el-form-item label="banner：" v-loading="loading" prop="mainPicture">
<el-upload class="avatar-uploader"
:action="uploadUrl"
:show-file-list="false"
:on-success="handleAvatarActSuccess"
:on-error="handelError"
:before-upload="beforeAvatarUpload">
<img v-if="dataForm.mainPicture"
:src="dataForm.mainPicture"
class="avatar">
<i v-else
class="el-icon-plus avatar-uploader-icon"></i>
<div slot="tip"
class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
</el-upload>
</el-form-item>
</el-row>
<el-row>
<el-form-item label="案例标题：" prop="caseTitle">
<el-input v-model="dataForm.caseTitle" type="text"
maxlength="40"
show-word-limit
placeholder="请输入标题，40字以内"
clearable
style="width:500px"></el-input>
</el-form-item>
</el-row>
<el-row>
<el-form-item label="摘要：" prop="typicalAbstract">
<el-input v-model="dataForm.typicalAbstract" placeholder="文本输入框，限制200字内" type="textarea"
style="width:500px"
maxlength="200"
clearable></el-input>
</el-form-item>
</el-row>
<el-row>
<div v-for="(item, index) in dataForm.dynamicItem" :key="index">
<div style="text-align: left">{{"案例"+(index+1)}}</div>
<el-row>
<el-form-item label="案例来源："
prop="caseSource">
<el-input v-model="item.caseSource"
:disabled="true"
type="text"
clearable
style="width: 40rem;">
</el-input>&emsp;
&emsp;
<el-button @click="addConnect(index)">{{"选择案例"}}</el-button>
</el-form-item>
</el-row>
<el-row>
<el-form-item label="案例类型："prop="associatedType">
<el-select v-model="item.associatedType" :disabled="true">
<el-option label="议题" value="0"></el-option>
<el-option label="项目" value="1"></el-option>
<el-option label="话题" value="2"></el-option>
</el-select>
</el-form-item>
</el-row>
<el-row>
<el-form-item label="内容描述：" prop="contentDescription">
<el-upload ref="upload"
:action="uploadUrl"
id ="quill-upload"
:show-file-list="false"
:before-upload="uploadBeforeUploadHandle"
:on-success="uploadSuccessHandle"
style="display: none;">
<el-button ref="uploadBtn"
type="primary"
id="uploadBtn"
size="small">{{ $t('upload.button') }}</el-button>
</el-upload>
<quill-editor ref="myQuillEditor" v-model="item.contentDescription" :options="editorOption" @focus="onEditorFocus(index)"></quill-editor>
</el-form-item>
</el-row>
</div>
</el-row>
<el-form-item>
<el-button :disabled="isAble" @click="addItem">{{"添加案例"}}</el-button>
</el-form-item>
</el-form>
<el-form>
<el-button type="primary" :disabled="isAble" @click="dataFormSubmitHandle()">{{"发布案例"}}</el-button>
<el-button size="small" :disabled="isAble" style="width: 95px" @click="back">返回</el-button>
</el-form>
<el-form>
<el-row>
</el-row>
</el-form>
<typicalcase-connect-list v-if="connectListVisible" ref="connectList" @refreshDataList="getDataList" v-on:connectResponse="connectResponse"></typicalcase-connect-list>
</div>
</el-card>
</template>
<script>
import debounce from 'lodash/debounce'
import TypicalcaseConnectList from './typicalcase-connect-list'
import { quillEditor } from 'vue-quill-editor'
import CaseInfoList from './typicalcase-list'
import Quill from 'quill'
import Cookies from 'js-cookie'
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'
import mixinViewModule from '@/mixins/view-module'
export default {
mixins: [mixinViewModule],
created () {
this.addItem()
this.addItem()
this.$nextTick(() => {
// 富文本
this.hideUpload = false
this.uploadUrl = `${window.SITE_CONFIG['apiURL']}/oss/file/upload?token=${Cookies.get('token')}`
// if (this.quillEditor) {
// this.quillEditor.deleteText(0, this.quillEditor.getLength())
// } else {
// this.quillEditorHandle()
// }
// 富文本end
})
},
components: {
quillEditor,
TypicalcaseConnectList,
CaseInfoList
},
data () {
return {
fileList: [],
connectListVisible: false,
content: '',
loading: false,
isAble: false,
editorOption: {
placeholder: 'Please enter it here...',
modules:{
toolbar:{
container: [
['bold', 'italic', 'underline', 'strike'],// 加粗，斜体，下划线，删除线
['blockquote'],// 引用
[{ 'header': 1 }, { 'header': 2 }],// 标题，键值对的形式；1、2表示字体大小
[{ 'list': 'ordered'}, { 'list': 'bullet' }],//列表
[{ 'indent': '-1'}, { 'indent': '+1' }],// 缩进
[{ 'direction': 'rtl' }],// 文本方向
[{ 'size': ['small', false, 'large', 'huge'] }],// 字体大小
[{ 'header': [1, 2, 3, 4, 5, 6, false] }],//几级标题
[{ 'color': [] }, { 'background': [] }],// 字体颜色，字体背景颜色
[{ 'font': [] }],//字体
[{ 'align': [] }],//对齐方式
['clean'],//清除字体样式
['image']//上传图片、上传视频
],
handlers: {
'image': function (value) {
if (value) {
// 给个点击触发Element-ui，input框选择图片文件
document.querySelector('#quill-upload input').click()
} else {
this.quill.format('image', false);
}
}
}
}
}
},
uploadUrl: '',
dataForm: {
id: '',
state: 1,
caseTitle: '',
caseNumber: 0,
mainPicture: '',
typicalAbstract: '',
dynamicItem: []
},
imgIndex: 0,
requiredFlag: false
}
},
mounted () {
this.dataForm.id = this.$route.query.id
this.init()
},
computed: {
dataRule () {
return {
caseTitle: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
mainPicture: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
typicalAbstract: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
associatedId: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
]
}
}
},
methods: {
onEditorFocus(index) {
this.imgIndex = index
},
handleChange (file) {
this.beforeAvatarUpload(file)
},
back () {
this.$parent.selectComponent = 'CaseInfoList'
this.$router.push({ path: '/case-typicalcase'})
},
connectResponse (connectResponse) {
// 部门名称
this.dataForm.dynamicItem[connectResponse.caseIndex].caseSource = connectResponse.allDeptNames
// 案例类别
this.dataForm.dynamicItem[connectResponse.caseIndex].associatedType = connectResponse.associatedType
// 内容描述
if (connectResponse.associatedType == 0) {
this.dataForm.dynamicItem[connectResponse.caseIndex].contentDescription = connectResponse.issueContent
} else if (connectResponse.associatedType == 1) {
this.dataForm.dynamicItem[connectResponse.caseIndex].contentDescription = connectResponse.itemContent
} else if (connectResponse.associatedType == 2) {
this.dataForm.dynamicItem[connectResponse.caseIndex].contentDescription = connectResponse.topicContent
}
// 类别
this.dataForm.dynamicItem[connectResponse.caseIndex].category = connectResponse.categoryName
// 案例ID
this.dataForm.dynamicItem[connectResponse.caseIndex].associatedId = connectResponse.id
// 网格Id
this.dataForm.dynamicItem[connectResponse.caseIndex].sourceGridId = connectResponse.gridId
//发布人姓名
if (connectResponse.associatedType == 0) {
this.dataForm.dynamicItem[connectResponse.caseIndex].publisherName = connectResponse.nickName
} else if (connectResponse.associatedType == 1) {
this.dataForm.dynamicItem[connectResponse.caseIndex].publisherName = connectResponse.nickName
} else if (connectResponse.associatedType == 2) {
this.dataForm.dynamicItem[connectResponse.caseIndex].publisherName = connectResponse.nickname
}
// 头像
this.dataForm.dynamicItem[connectResponse.caseIndex].publisherHeader = connectResponse.userFace
// 内容
if (connectResponse.associatedType == 0) {
this.dataForm.dynamicItem[connectResponse.caseIndex].content = connectResponse.issueContent
} else if (connectResponse.associatedType == 1) {
this.dataForm.dynamicItem[connectResponse.caseIndex].content = connectResponse.itemContent
} else if (connectResponse.associatedType == 2) {
this.dataForm.dynamicItem[connectResponse.caseIndex].content = connectResponse.topicContent
}
if (connectResponse.associatedType == 0) {
this.dataForm.dynamicItem[connectResponse.caseIndex].releaseTime = connectResponse.distributeTime
} else if (connectResponse.associatedType == 1) {
this.dataForm.dynamicItem[connectResponse.caseIndex].releaseTime = connectResponse.distributeTime
} else if (connectResponse.associatedType == 2) {
this.dataForm.dynamicItem[connectResponse.caseIndex].releaseTime = connectResponse.createdTime
}
this.dataForm.dynamicItem[connectResponse.caseIndex].expressingAttitude = connectResponse.participantsNum
this.requiredFlag = true
},
addConnect(index){
this.connectListVisible = true
this.$nextTick(() => {
this.$refs.connectList.init(index)
})
},
// 动态添加
addItem () {
this.dataForm.dynamicItem.push({
caseSource: '',
associatedType: '',
contentDescription: '',
category: '',
associatedId: '',
sourceGridId: '',
publisherName: '',
publisherHeader: '',
releaseTime: '',
content: '',
expressingAttitude: ''
})
},
// 富文本编辑器
quillEditorHandle () {
this.quillEditor = new Quill('#J_quillEditor', {
modules: {
toolbar: this.quillEditorToolbarOptions
},
theme: 'snow'
})
this.quillEditor.container.style.height = `${300}px`
// // 自定义上传图片功能 (使用element upload组件)
this.quillEditor.getModule('toolbar').addHandler('image', () => {
this.$refs.uploadBtn.$el.click()
})
// 监听内容变化，动态赋值
this.quillEditor.on('text-change', () => {
this.dataForm.actContent = this.quillEditor.root.innerHTML
if ((this.dataForm.actContent).length > 10000) {
return this.$message.error('您输入的的内容已超过字数')
}
})
},
// 上传图片之前 (富文本)
uploadBeforeUploadHandle (file) {
if (file.type !== 'image/jpg' && file.type !== 'image/jpeg' && file.type !== 'image/png' && file.type !== 'image/gif') {
this.$message.error(this.$t('upload.tip', { 'format': 'jpg、png、gif' }))
return false
}
},
// 上传图片成功 (富文本)
uploadSuccessHandle (res) {
let quill = this.$refs.myQuillEditor[this.imgIndex].quill;
console.log(quill)
if (res.code !== 0) {
return this.$message.error(res.msg)
}
quill.insertEmbed(quill.getSelection().index, 'image', res.data.url)
quill.setSelection(quill.getSelection().index + 1)
},
// 上传图片ends
init () {
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
this.getInfo()
}
})
},
// 获取信息
getInfo () {
this.$http.get(`/cloudAnalysis/typicalcase/${this.dataForm.id}`).then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.dataForm = {
...this.dataForm,
...res.data
}
}).catch(() => {})
this.requiredFlag = true
},
// 表单提交
dataFormSubmitHandle: debounce(function () {
this.$refs['dataForm'].validate((valid) => {
if (!valid) {
return false
}
if(!this.requiredFlag){
alert("请关联案例！")
return false
}
for(let item of this.dataForm.dynamicItem) {
if(item.associatedId != '') {
this.dataForm.caseNumber = this.dataForm.caseNumber + 1
}
}
this.isAble = true;
this.$http[!this.dataForm.id ? 'post' : 'put']('/cloudAnalysis/typicalcase', this.dataForm).then(({ data: res }) => {
if (res.code !== 0) {
this.isAble = false;
return this.$message.error(res.msg)
}
this.$message({
message: this.$t('prompt.success'),
type: 'success',
duration: 500,
onClose: () => {
this.isAble = false;
this.back()
}
})
}).catch(() => {})
})
}, 1000, { 'leading': true, 'trailing': false }),
handleAvatarActSuccess (res, file) {
this.loading = false
this.dataForm.mainPicture = res.data.url
},
beforeAvatarUpload (file) {
this.loading = true
},
handelError () {
this.loading = false
},
}
}
</script>
<style>
.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
.avatar-uploader .el-upload:hover {
border-color: #409eff;
}
.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 178px;
height: 178px;
line-height: 178px;
text-align: center;
}
.avatar {
width: 178px;
height: 178px;
display: block;
}
</style>
<style lang="scss">
.project-handle {
.el-timeline {
padding-left: 9px;
font-size: 13px;
}
.el-textarea {
width: 600px !important;
}
.el-input {
width: 600px !important;
}
}
.el-form-item__label {
font-weight: bold;
}
.quill-editor {
width:60rem;
height: 400px;
.ql-container {
height: 350px;
}
}
</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: 49%;
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: #ccc;
}
&::-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 {
padding-top: 30px;
box-sizing: border-box;
width: 100%;
height: 49%;
box-sizing: border-box;
border: 2px solid #ccc;
float:left;
position: relative;
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-tip {
position: absolute;
top: 0;
left:0;
width: 80px;
height: 30px;
line-height: 30px;
color: #ffffff;
background: #ff7600;
text-align:center;
}
}
}
</style>

264
src/views/modules/case/typicalcase-connect-list.vue
View File

@ -0,0 +1,264 @@
<template>
<el-dialog :visible.sync="visible"
:close-on-click-modal="false"
:close-on-press-escape="false"
width="80%"
height="80%">
<el-card shadow="never" class="aui-card--fill">
<div class="mod-news__typicalcase}">
<el-form :model="dataForm" ref="dataForm" @keyup.enter.native="getDataList" :label-width="$i18n.locale === 'en-US' ? '120px' : '80px'">
<el-form-item label="所属机构">
<el-cascader v-model="ids"
:options="options"
:props="{ checkStrictly: true }"
clearable>
</el-cascader>
</el-form-item>
<el-form-item label="案例类型">
<el-select v-model="dataForm.associatedType" @change="getDataList">
<el-option label="议题" value="0"></el-option>
<el-option label="项目" value="1"></el-option>
<el-option label="话题" value="2"></el-option>
</el-select>
</el-form-item>
<el-form-item label="内容检索">
<el-input v-model="dataForm.keyword" property="请输入内容" style="width: 20rem;"></el-input>
&nbsp;
<el-button @click="getDataList()">{{ $t('query') }}</el-button>
</el-form-item>
</el-form>
<el-table v-loading="dataListLoading" :data="dataList" max-height="250"
style="width: 100%;">
<el-table-column label="单选" width="70">
<template slot-scope="scope">
<el-radio v-model="radio" :label="scope.$index+1"
@change.native= selectAction(scope.row)></el-radio>
</template>
</el-table-column>
<el-table-column v-if="this.dataForm.associatedType == 0" prop="issueContent" label="内容" header-align="center" align="center" style="width: 10%"></el-table-column>
<el-table-column v-if="this.dataForm.associatedType == 1" prop="itemContent" label="内容" header-align="center" align="center" style="width: 10%"></el-table-column>
<el-table-column v-if="this.dataForm.associatedType == 2" prop="topicContent" label="内容" header-align="center" align="center" style="width: 10%"></el-table-column>
<el-table-column v-if="this.dataForm.associatedType == 0" prop="nickName" label="发布人姓名" header-align="center" align="center" style="width: 10%"></el-table-column>
<el-table-column v-if="this.dataForm.associatedType == 1" prop="nickName" label="发布人姓名" header-align="center" align="center" style="width: 10%"></el-table-column>
<el-table-column v-if="this.dataForm.associatedType == 2" prop="nickname" label="发布人姓名" header-align="center" align="center" style="width: 10%"></el-table-column>
<el-table-column prop="createdTime" label="发布时间" header-align="center" align="center" 问题内容style="width: 10%"></el-table-column>
<el-table-column prop="participantsNum" label="表达态度总数" header-align="center" align="center" style="width: 10%"></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="detailHandle(scope.row.id)">{{"查看详细"}}</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>
<el-form>
<el-button type="primary" @click="getInfo()">{{"确定案例"}}</el-button>
</el-form>
</div>
</el-card>
<issue-detail v-if="issueDetailVisible" ref="issueDetails" @refreshDataList="getDataList"></issue-detail>
<item-detail v-if="itemDetailVisible" ref="itemDetails" @refreshDataList="getDataList"></item-detail>
<topic-detail v-if="topicDetailVisible" ref="topicDetails" @refreshDataList="getDataList"></topic-detail>
</el-dialog>
</template>
<script>
import debounce from 'lodash/debounce'
import mixinViewModule from '@/mixins/view-module'
import IssueDetail from './issue-detail'
import ItemDetail from './item-detail'
import TopicDetail from './topic-detail'
export default {
mixins: [mixinViewModule],
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '/events/issue/page',
getDataListIsPage: true
},
visible: false,
radio: 0,
issueDetailVisible: false,
itemDetailVisible: false,
topicDetailVisible: false,
dataForm: {
streetId: '',
communityId: '',
gridId: '',
caseIndex: '',
associatedType: '0',
keyword: '',
selectedType: '0',
selectId: '',
participantsNum: 0
},
ids: [],
options: [],
responseData: []
}
},
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]
}
if (val.length === 2) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
}
if (val.length === 3) {
this.dataForm.streetId = this.ids[0]
this.dataForm.communityId = this.ids[1]
this.dataForm.gridId = this.ids[2]
}
}
},
methods: {
selectAction (item) {
this.dataForm.selectId = item.id
this.dataForm.participantsNum = item.participantsNum
},
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(() => {})
},
// 获取数据列表
init (index) {
this.visible = true
this.dataForm.caseIndex = index
this.$nextTick(() => {
this.getDataList()
})
},
detailHandle (id) {
// 议题
if (this.dataForm.selectedType == 0) {
this.issueDetailVisible = true
this.$nextTick(() => {
this.$refs.issueDetails.init(id)
})
// 项目
} else if (this.dataForm.selectedType == 1) {
this.itemDetailVisible = true
this.$nextTick(() => {
this.$refs.itemDetails.init(id)
})
// 话题
} else if (this.dataForm.selectedType == 2) {
this.topicDetailVisible = true
this.$nextTick(() => {
this.$refs.topicDetails.init(id)
})
} else {
console.log('未选择类型')
}
},
getDataList () {
this.dataListLoading = true
if (this.dataForm.associatedType == 0) {
// 议题
this.dataForm.state = 4
this.mixinViewModuleOptions.getDataListURL = '/events/issue/page'
} else if (this.dataForm.associatedType == 1) {
// 项目
this.dataForm.state = ''
this.mixinViewModuleOptions.getDataListURL = '/events/item/page'
} else if (this.dataForm.associatedType == 2) {
this.dataForm.state = ''
this.dataForm.orderType = ''
// 话题
this.mixinViewModuleOptions.getDataListURL = '/group/topic/page'
} else {
console.log('先选择类型')
}
this.$http.get(
this.mixinViewModuleOptions.getDataListURL,
{
params: {
order: this.order,
orderField: this.orderField,
page: this.mixinViewModuleOptions.getDataListIsPage ? this.page : null,
limit: this.mixinViewModuleOptions.getDataListIsPage ? this.limit : null,
...this.dataForm
}
}
).then(({ data: res }) => {
this.dataListLoading = false
this.radio = 0
if (res.code !== 0) {
this.dataList = []
this.total = 0
return this.$message.error(res.msg)
}
this.dataList = res.data.list
this.total = this.mixinViewModuleOptions.getDataListIsPage ? res.data.total : 0
this.dataForm.selectedType = this.dataForm.associatedType
}).catch(() => {
this.dataListLoading = false
})
},
getInfo () {
if (!this.dataForm.selectId) {
alert("未选择！")
return
}
var url = ''
if (this.dataForm.selectedType == 0) {
url = '/events/issue/issueContentDetail/' + this.dataForm.selectId
} else if (this.dataForm.selectedType == 1) {
url = '/events/item/' + this.dataForm.selectId
} else if (this.dataForm.selectedType == 2) {
url = '/group/topic/detail/' + this.dataForm.selectId
} else {
console.log('未选择类型')
return
}
this.$http.get(url).then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.responseData = {
...this.responseData,
...res.data
}
this.responseData.id = this.dataForm.selectId
this.responseData.associatedType = this.dataForm.selectedType
this.responseData.caseIndex = this.dataForm.caseIndex
this.responseData.participantsNum = this.dataForm.participantsNum
this.$emit('connectResponse', this.responseData)
this.visible = false
}).catch(() => {})
}
},
components: {
IssueDetail,
ItemDetail,
TopicDetail
}
}
</script>

120
src/views/modules/case/typicalcase-detail.vue
View File

@ -0,0 +1,120 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-news__typicalcase}">
<el-form :inline="true"
:model="dataForm"
:rules="dataRule"
ref="dataForm"
:label-width="$i18n.locale === 'en-US' ? '120px' : '120px'">
<el-row>
<el-form-item label="banner：" v-loading="loading" prop="headPic">
<img v-if="dataForm.mainPicture"
:src="dataForm.mainPicture"
class="avatar">
</el-form-item>
</el-row>
<el-row>
<el-form-item label="案例标题："
prop="caseTitle">
{{dataForm.caseTitle}}
</el-form-item>
</el-row>
<el-row>
<el-form-item label="摘要："
prop="typicalAbstract">
{{dataForm.typicalAbstract}}
</el-form-item>
</el-row>
<el-row>
<div v-for="(item, index) in dataForm.dynamicItem" :key="index">
<div style="text-align: left">{{"案例"+(index+1)}}</div>
<el-row>
<el-form-item label="案例来源："
prop="caseSource">
{{item.caseSource}}
</el-form-item>
</el-row>
<el-row>
<el-form-item label="案例类型："prop="associatedType">
<el-select v-model="item.associatedType" disabled="true">
<el-option label="议题" value="0"></el-option>
<el-option label="项目" value="1"></el-option>
<el-option label="话题" value="2"></el-option>
</el-select>
</el-form-item>
</el-row>
<el-row>
<el-form-item prop="contentDescription"
label="内容描述：">
<p class="ql-editor" v-html="item.contentDescription"></p>
</el-form-item>
</el-row>
</div>
</el-row>
</el-form>
<el-form>
<el-button size="small" style="width: 95px" @click="back">返回</el-button>
</el-form>
</div>
</el-card>
</template>
<script>
import debounce from 'lodash/debounce'
import mixinViewModule from '@/mixins/view-module'
import { quillEditor } from 'vue-quill-editor'
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'
export default {
mixins: [mixinViewModule],
components: {
quillEditor
},
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '/cloudAnalysis/typicalcase/detail' + '/' + this.$route.query.id
},
dataForm: {
id: '',
caseTitle: '',
caseNumber: 0,
mainPicture: '',
typicalAbstract: '',
dynamicItem: []
}
}
},
mounted () {
this.dataForm.id = this.$route.query.id
this.init()
},
methods: {
back () {
this.$parent.selectComponent = 'CaseInfoList'
this.$router.push({ path: '/case-typicalcase' })
},
init () {
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
this.getInfo()
}
})
},
// 获取信息
getInfo () {
this.$http.get(`/cloudAnalysis/typicalcase/${this.dataForm.id}`).then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.dataForm = {
...this.dataForm,
...res.data
}
}).catch(() => {})
}
}
}
</script>

164
src/views/modules/case/typicalcase-list.vue
View File

@ -0,0 +1,164 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-news__typicalcase}">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item label="案例标题">
<el-input v-model="dataForm.caseTitle" 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-form>
<!--添加按钮-->
<el-form-item>
<el-button type="primary" @click="addHandle()">{{"新增典型案例"}}</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" header-align="center" align="center" width="150"></el-table-column>
<el-table-column prop="caseTitle" label="优秀案例标题" header-align="center" align="center"></el-table-column>
<el-table-column prop="state" label="状态" :formatter="formatState" header-align="center" align="center"></el-table-column>
<el-table-column prop="caseNumber" 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 :label="$t('handle')" fixed="right" header-align="center" align="center" width="150">
<template slot-scope="scope">
<el-button v-if="$hasPermission('case:actbanner:grounding')" type="text" size="small" @click="changeGroundingHandle(scope.row)">{{ changeGroundingText(scope.row.state) }}</el-button>
<el-button type="text" size="small" @click="detailHandle(scope.row.id)">{{"查看详细"}}</el-button>
<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('delete') }}</el-button>
</template>
</el-table-column>
</el-table>
<!--分页-->
<div style="text-align:center">
<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>
</div>
</el-card>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
import AddOrUpdate from './typicalcase-add-or-update'
import CaseInfoDetailView from './typicalcase-detail'
import {debounce} from 'lodash'
export default {
mixins: [mixinViewModule],
name: 'CaseInfoList',
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '/cloudAnalysis/typicalcase/page',
getDataListIsPage: true,
deleteURL: '/cloudAnalysis/typicalcase',
deleteIsBatch: true
},
dataForm: {
caseTitle: '',
startTime: '',
endTime: ''
},
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: {
AddOrUpdate,
CaseInfoDetailView
},
created: function () {
this.getDataList()
},
methods: {
detailHandle (id) {
this.$parent.selectComponent = 'CaseInfoAdd'
this.$router.push({ path: '/case-typicalcase', query: { id: id } })
},
formatState: function (row, column) {
let state = row.state
if (state == 1) {
return '上架'
} else if (state == 0) {
return '下架'
}
},
changeGroundingText(state){
let status = state
if (status == 1) {
return '下架'
} else if (status == 0) {
return '上架'
}
},
addHandle () {
this.$parent.selectComponent = 'CaseInfoAdd'
this.$router.push({ path: '/case-typicalcase' })
},
changeGroundingHandle: debounce(function (row) {
this.$confirm(this.$t('prompt.info', { 'handle': this.changeGroundingText(row.state) }), this.$t('prompt.title'), {
confirmButtonText: this.$t('confirm'),
cancelButtonText: this.$t('cancel'),
type: 'warning'
}).then(() => {
this.$http.get(`/cloudAnalysis/typicalcase/updateState/${row.id}`).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.getDataList()
}
})
}).catch(() => {})
}).catch(() => {})
}, 1000, { 'leading': true, 'trailing': false })
}
}
</script>

31
src/views/modules/case/typicalcase.vue
View File

@ -0,0 +1,31 @@
<template>
<keep-alive include="caseInfoList">
<component :is="selectComponent"></component>
</keep-alive>
</template>
<script>
import CaseInfoList from './typicalcase-list'
import CaseInfoDetailView from './typicalcase-detail'
import CaseInfoAdd from './typicalcase-add-or-update'
export default {
data () {
return {
selectComponent: CaseInfoList
}
},
components: {
CaseInfoList,
CaseInfoDetailView,
CaseInfoAdd
},
methods: {
init () {
this.selectComponent = CaseInfoList
}
}
}
</script>
<style lang="scss" scoped>
</style>

471
src/views/modules/sys/analysis-menu-add-or-update.vue
View File

@ -0,0 +1,471 @@
<template>
<el-dialog
:visible.sync="visible"
:title="!dataForm.id ? $t('add') : $t('update')"
:close-on-click-modal="false"
:close-on-press-escape="false"
>
<el-form
:model="dataForm"
:rules="dataRule"
ref="dataForm"
@keyup.enter.native="dataFormSubmitHandle()"
label-width="120px"
>
<el-form-item prop="type" :label="$t('menu.type')" size="mini">
<el-radio-group v-model="dataForm.type" :disabled="!!dataForm.id">
<el-radio :label="0">{{ $t('menu.type0') }}</el-radio>
<!-- <el-radio :label="1">{{ $t('menu.type1') }}</el-radio> -->
</el-radio-group>
</el-form-item>
<el-form-item prop="name" :label="$t('menu.name')">
<el-input
v-model="dataForm.name"
:placeholder="$t('menu.name')"
></el-input>
</el-form-item>
<el-form-item prop="menuCode" :label="$t('menu.menuCode')">
<el-input
v-model="dataForm.menuCode"
:placeholder="$t('menu.menuCode')"
></el-input>
</el-form-item>
<el-form-item prop="modelname" label="模块名称">
<el-input
v-model="dataForm.modelname"
placeholder="样式名称"
></el-input>
</el-form-item>
<el-form-item prop="className" label="样式名称">
<el-input
v-model="dataForm.className"
placeholder="样式名称"
></el-input>
</el-form-item>
<el-form-item
prop="parentName"
:label="$t('menu.parentName')"
class="menu-list"
>
<el-popover
v-model="menuListVisible"
ref="menuListPopover"
placement="bottom-start"
trigger="click"
>
<el-tree
:data="menuList"
:props="{ label: 'name', children: 'children' }"
node-key="id"
ref="menuListTree"
:highlight-current="true"
:expand-on-click-node="false"
accordion
@current-change="menuListTreeCurrentChangeHandle"
>
</el-tree>
</el-popover>
<el-input
v-model="dataForm.parentName"
v-popover:menuListPopover
:readonly="true"
:placeholder="$t('menu.parentName')"
>
<i
v-if="dataForm.pid !== '0'"
slot="suffix"
@click.stop="deptListTreeSetDefaultHandle()"
class="el-icon-circle-close el-input__icon"
></i>
</el-input>
</el-form-item>
<!-- <el-form-item
v-if="dataForm.type === 0"
prop="url"
:label="$t('menu.url')"
>
<el-input
v-model="dataForm.url"
:placeholder="$t('menu.url')"
></el-input>
</el-form-item> -->
<el-form-item prop="sort" :label="$t('menu.sort')">
<el-input-number
v-model="dataForm.sort"
controls-position="right"
:min="0"
:label="$t('menu.sort')"
></el-input-number>
</el-form-item>
<el-form-item
v-if="dataForm.type === 0"
label="菜单图标"
v-loading="loading"
prop="icon"
>
<el-upload
class="avatar-uploader"
:action="uploadUrl"
:show-file-list="false"
:on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload"
>
<img v-if="dataForm.icon" :src="dataForm.icon" class="avatar" />
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</el-form-item>
<el-form-item label="子菜单模板" prop="templateId">
<el-select
v-model="dataForm.templateId"
clearable
placeholder="子菜单模板"
>
<el-option
v-for="item in templates"
:key="item.id"
:label="item.templateName"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item prop="remark" label="备注">
<el-input v-model="dataForm.remark" placeholder="备注"></el-input>
</el-form-item>
<el-form-item prop="numFlag"
label="是否显示数字"
size="mini">
<el-radio-group v-model="dataForm.numFlag">
<el-radio label="0">否</el-radio>
<el-radio label="1">是</el-radio>
</el-radio-group>
</el-form-item>
<!-- <el-form-item
v-if="dataForm.type === 1"
prop="permissions"
:label="$t('menu.permissions')"
>
<el-input
v-model="dataForm.permissions"
:placeholder="$t('menu.permissionsTips')"
></el-input>
</el-form-item>
<el-form-item
v-for="(item, index) in dataForm.resourceList"
:key="item.key"
:prop="`resourceList.${index}.resourceUrl`"
:rules="{
required: true,
message: $t('validate.required'),
trigger: 'blur'
}"
:label="index === 0 ? $t('menu.resource') : ''"
class="resource-list"
>
<el-row>
<el-col :span="22">
<el-input
v-model="item.resourceUrl"
:placeholder="$t('menu.resourceUrl')"
>
<el-select
v-model="item.resourceMethod"
slot="prepend"
:placeholder="$t('menu.resourceMethod')"
>
<el-option label="GET" value="GET"></el-option>
<el-option label="POST" value="POST"></el-option>
<el-option label="PUT" value="PUT"></el-option>
<el-option label="DELETE" value="DELETE"></el-option>
</el-select>
</el-input>
</el-col>
<el-col :span="2" class="text-center">
<el-button
@click="resourceDeleteHandle(item)"
size="small"
type="text"
>{{ $t('delete') }}</el-button
>
</el-col>
</el-row>
</el-form-item>
<el-form-item
:label="dataForm.resourceList.length <= 0 ? $t('menu.resource') : ''"
>
<el-button
@click="resourceAddHandle()"
class="aui-button--dashed w-percent-100"
>{{ $t('menu.resourceAddItem') }}</el-button
>
</el-form-item> -->
</el-form>
<template slot="footer">
<el-button @click="visible = false">{{ $t('cancel') }}</el-button>
<el-button type="primary" @click="dataFormSubmitHandle()">{{
$t('confirm')
}}</el-button>
</template>
</el-dialog>
</template>
<script>
import Cookies from 'js-cookie'
import debounce from 'lodash/debounce'
import { getIconList } from '@/utils'
export default {
data () {
return {
visible: false,
menuList: [],
menuListVisible: false,
iconList: [],
iconListVisible: false,
templates: [],
dataForm: {
id: '',
type: 0,
name: '',
pid: '0',
parentName: '',
url: '',
sort: 0,
icon: '',
menuCode: '',
modelname: '',
className: '',
remark: '',
templateId: '',
numFlag: '0'
},
uploadUrl: '',
loading: false
}
},
computed: {
dataRule () {
return {
name: [
{
required: true,
message: this.$t('validate.required'),
trigger: 'blur'
}
],
parentName: [
{
required: true,
message: this.$t('validate.required'),
trigger: 'change'
}
]
}
}
},
watch: {
'dataForm.type' (val) {
this.$refs['dataForm'].clearValidate()
}
},
methods: {
init () {
this.visible = true
this.uploadUrl = `${
window.SITE_CONFIG['apiURL']
}/oss/file/upload?token=${Cookies.get('token')}`
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
this.iconList = getIconList()
this.dataForm.parentName = this.$t('menu.parentNameDefault')
this.getTemplateList()
this.dataForm.resourceList = []
this.getMenuList().then(() => {
if (this.dataForm.id) {
this.getInfo()
}
})
})
},
// 获取菜单列表
getMenuList () {
return this.$http
.get('/sys/analysismenu/list?type=0')
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.menuList = res.data
})
.catch(() => {})
},
// 获取子菜单模板列表
getTemplateList () {
this.$http
.get('/sys/appmenutemplate/list')
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.templates = res.data
})
.catch(() => {})
},
// 获取信息
getInfo () {
this.$http
.get(`/sys/analysismenu/${this.dataForm.id}`)
.then(({ data: res }) => {
console.log('开始执行方法')
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.dataForm = {
...this.dataForm,
...res.data
}
if (this.dataForm.pid === '0') {
return this.deptListTreeSetDefaultHandle()
}
this.$refs.menuListTree.setCurrentKey(this.dataForm.pid)
})
.catch(() => {})
},
// 上级菜单树, 设置默认值
deptListTreeSetDefaultHandle () {
this.dataForm.pid = '0'
this.dataForm.parentName = this.$t('menu.parentNameDefault')
},
// 上级菜单树, 选中
menuListTreeCurrentChangeHandle (data) {
this.dataForm.pid = data.id
this.dataForm.parentName = data.name
this.menuListVisible = false
},
// 图标, 选中
iconListCurrentChangeHandle (icon) {
this.dataForm.icon = icon
this.iconListVisible = false
},
// 菜单资源, 添加
resourceAddHandle () {
this.dataForm.resourceList.push({
key: new Date().getTime(),
resourceMethod: 'GET',
resourceUrl: ''
})
},
// 菜单资源, 删除
resourceDeleteHandle (resource) {
this.dataForm.resourceList = this.dataForm.resourceList.filter(
item => item.key !== resource.key
)
},
// 表单提交
dataFormSubmitHandle: debounce(
function () {
this.$refs['dataForm'].validate(valid => {
if (!valid) {
return false
}
this.$http[!this.dataForm.id ? 'post' : 'put'](
'/sys/analysismenu',
this.dataForm
)
.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 }
),
// 上传图片
handleAvatarSuccess (res, file) {
this.loading = false
this.dataForm.icon = res.data.url
},
beforeAvatarUpload (file) {
this.loading = true
}
}
}
</script>
<style lang="scss">
.mod-sys__menu {
.resource-list {
.el-select .el-input__inner {
min-width: 110px;
text-align: center;
}
}
.menu-list,
.icon-list {
.el-input__inner,
.el-input__suffix {
cursor: pointer;
}
}
&-icon-popover {
width: 458px;
overflow: hidden;
}
&-icon-inner {
width: 478px;
max-height: 258px;
overflow-x: hidden;
overflow-y: auto;
}
&-icon-list {
width: 458px;
padding: 0;
margin: -8px 0 0 -8px;
> .el-button {
padding: 8px;
margin: 8px 0 0 8px;
> span {
display: inline-block;
vertical-align: middle;
width: 18px;
height: 18px;
font-size: 18px;
}
}
}
.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
.avatar-uploader .el-upload:hover {
border-color: #409eff;
}
.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 378px;
height: 178px;
line-height: 178px;
text-align: center;
}
.avatar {
width: 300px;
height: 178px;
display: block;
}
}
</style>

133
src/views/modules/sys/analysis-menu.vue
View File

@ -0,0 +1,133 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-sys__menu">
<el-form
:inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()"
>
<el-form-item>
<el-button
v-if="$hasPermission('sys:menu:save')"
type="primary"
@click="addOrUpdateHandle()"
>{{ $t('add') }}</el-button
>
</el-form-item>
</el-form>
<el-table
v-loading="dataListLoading"
:data="dataList"
border
style="width: 100%;"
>
<table-tree-column
prop="name"
:label="$t('menu.name')"
header-align="center"
width="150"
></table-tree-column>
<el-table-column
prop="icon"
label="菜单图标"
header-align="center"
align="center"
>
<template slot-scope="scope">
<img :src="scope.row.icon" width="40" height="40" />
</template>
</el-table-column>
<el-table-column
prop="type"
:label="$t('menu.type')"
header-align="center"
align="center"
>
<template slot-scope="scope">
<el-tag v-if="scope.row.type === 0" size="small">{{
$t('menu.type0')
}}</el-tag>
<el-tag v-else size="small" type="info">{{
$t('menu.type1')
}}</el-tag>
</template>
</el-table-column>
<el-table-column
prop="sort"
:label="$t('menu.sort')"
header-align="center"
align="center"
></el-table-column>
<el-table-column
prop="numFlag"
label="显示数字"
header-align="center"
align="center"
:formatter="showNumFlagFormatter"
></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('sys:menu:update')"
type="text"
size="small"
@click="addOrUpdateHandle(scope.row.id)"
>{{ $t('update') }}</el-button
>
<el-button
v-if="$hasPermission('sys:menu:delete')"
type="text"
size="small"
@click="deleteHandle(scope.row.id)"
>{{ $t('delete') }}</el-button
>
</template>
</el-table-column>
</el-table>
<!-- 弹窗, 新增 / 修改 -->
<add-or-update
v-if="addOrUpdateVisible"
ref="addOrUpdate"
@refreshDataList="getDataList"
></add-or-update>
</div>
</el-card>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
import TableTreeColumn from '@/components/table-tree-column'
import AddOrUpdate from './analysis-menu-add-or-update'
export default {
mixins: [mixinViewModule],
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '/sys/analysismenu/list',
deleteURL: '/sys/analysismenu'
}
}
},
components: {
TableTreeColumn,
AddOrUpdate
},
methods: {
showNumFlagFormatter: function (row, column) {
if (row.numFlag === '0') {
return '否'
} else if (row.numFlag === '1') {
return '是'
} else {
return '未知'
}
}
}
}
</script>

31
src/views/modules/sys/role-add-or-update.vue
View File

@ -90,6 +90,18 @@
</el-tree>
</el-form-item>
</el-col>
<el-col :span="5">
<el-form-item size="mini"
:label="$t('role.analysisMenuList')">
<el-tree :data="analysisMenuList"
:props="{ label: 'name', children: 'children' }"
node-key="id"
ref="analysisMenuListTree"
accordion
show-checkbox>
</el-tree>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template slot="footer">
@ -112,6 +124,7 @@ export default {
appMenuList: [],
categoryList: [],
roleTypeList: [],
analysisMenuList:[],
dataForm: {
id: '',
name: '',
@ -120,6 +133,7 @@ export default {
appMenuIdList: [],
categoryIdList: [],
whistleDeptIdList: [],
analysisMenuIdList: [],
remark: '',
typeKey: ''
}
@ -147,12 +161,14 @@ export default {
this.$refs.appMenuListTree.setCheckedKeys([])
this.$refs.categoryListTree.setCheckedKeys([])
this.$refs.whistleDeptListTree.setCheckedKeys([])
this.$refs.analysisMenuListTree.setCheckedKeys([])
Promise.all([
this.getMenuList(),
this.getDeptList(),
this.getAppMenuList(),
this.getCategoryList(),
this.getWhistleDeptList()
this.getWhistleDeptList(),
this.getAnalysisMenuList()
]).then(() => {
if (this.dataForm.id) {
this.getInfo()
@ -205,6 +221,14 @@ export default {
this.categoryList = res.data
}).catch(() => { })
},
getAnalysisMenuList () {
return this.$http.get('/sys/analysismenu/select').then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.analysisMenuList = res.data
}).catch(() => { })
},
// 获取信息
getInfo () {
this.$http.get(`/sys/role/${this.dataForm.id}`).then(({ data: res }) => {
@ -219,6 +243,7 @@ export default {
this.$refs.deptListTree.setCheckedKeys(this.dataForm.deptIdList)
this.dataForm.appMenuIdList.forEach(item => this.$refs.appMenuListTree.setChecked(item, true))
this.dataForm.categoryIdList.forEach(item => this.$refs.categoryListTree.setChecked(item, true))
this.dataForm.analysisMenuIdList.forEach(item => this.$refs.analysisMenuListTree.setChecked(item, true))
this.$refs.whistleDeptListTree.setCheckedKeys(this.dataForm.whistleDeptIdList)
}).catch(() => { })
},
@ -241,6 +266,10 @@ export default {
...this.$refs.categoryListTree.getCheckedKeys(),
...this.$refs.categoryListTree.getHalfCheckedKeys()
]
this.dataForm.analysisMenuIdList = [
...this.$refs.analysisMenuListTree.getCheckedKeys(),
...this.$refs.analysisMenuListTree.getHalfCheckedKeys()
]
this.dataForm.whistleDeptIdList = this.$refs.whistleDeptListTree.getCheckedKeys()
this.$http[!this.dataForm.id ? 'post' : 'put']('/sys/role', this.dataForm).then(({ data: res }) => {
if (res.code !== 0) {

Write Preview
Loading…
Cancel
Save