9 changed files with 544 additions and 4 deletions
After Width: | Height: | Size: 1.8 KiB |
After Width: | Height: | Size: 2.8 KiB |
After Width: | Height: | Size: 1.8 KiB |
After Width: | Height: | Size: 1.5 KiB |
After Width: | Height: | Size: 1.6 KiB |
After Width: | Height: | Size: 2.1 KiB |
@ -0,0 +1,386 @@ |
|||
<template> |
|||
<div> |
|||
<div class="dialog-h-content scroll-h"> |
|||
<div class="m-row"> |
|||
<div class="m-info"> |
|||
<div class="info-prop"> |
|||
<span class="info-title-3">活动类型:</span> |
|||
<span>{{ formData.actTypeName }}</span> |
|||
</div> |
|||
|
|||
<div class="info-prop"> |
|||
<span class="info-title-3">举办活动时间:</span> |
|||
<span>{{ formData.holdTime ?formData.holdTime :'--' }}</span> |
|||
</div> |
|||
|
|||
<div class="info-prop"> |
|||
<span class="info-title-3">活动主题:</span> |
|||
<span>{{ formData.topic}}</span> |
|||
</div> |
|||
|
|||
<div class="info-prop"> |
|||
<span class="info-title-3">活动地点:</span> |
|||
<span>{{ formData.address?formData.address:'--'}}</span> |
|||
</div> |
|||
|
|||
<div class="info-prop"> |
|||
<span class="info-title-3">自动发布时间:</span> |
|||
<span>{{ formData.autoPublicTypeDesc?formData.autoPublicTypeDesc:'--'}}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-3">发布活动党组织:</span> |
|||
<span>{{formData.publishPartyOrgName?formData.publishPartyOrgName:'--' }}</span> |
|||
</div> |
|||
|
|||
<div class="info-prop"> |
|||
<span class="info-title-3">参加活动党组织:</span> |
|||
<span>{{ formData.joinNames?formData.joinNames:'--' }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-3">参加人员:</span> |
|||
<span>{{ formData.joinUserTypeName?formData.joinUserTypeName:'--' }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-3">自动通知参加人员:</span> |
|||
<span>{{ formData.isAutoInform==='1'?'是':'否' }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-3">活动介绍:</span> |
|||
<span>{{ formData.introduce?formData.introduce:'--' }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-3">附件:</span> |
|||
<file-list v-if="formData.attachmentList.length>0" |
|||
:fileList="formData.attachmentList"></file-list> |
|||
<span v-else>--</span> |
|||
|
|||
</div> |
|||
|
|||
</div> |
|||
</div> |
|||
|
|||
</div> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapGetters } from 'vuex' |
|||
import { Loading } from 'element-ui' // 引入Loading服务 |
|||
import { requestPost, requestGet } from '@/js/dai/request' |
|||
import fileList from './fileList' |
|||
|
|||
|
|||
let loading // 加载动画 |
|||
export default { |
|||
data () { |
|||
return { |
|||
btnDisable: false, |
|||
|
|||
formData: {}, |
|||
|
|||
fileList: [], |
|||
uploadUlr: window.SITE_CONFIG['apiURL'] + '/oss/file/uploadvariedfile', |
|||
|
|||
} |
|||
}, |
|||
|
|||
watch: { |
|||
"formData.holdTime": function (val) { |
|||
let array = val.split('-') |
|||
this.formData.holdYearId = array[0] |
|||
this.formData.holdMonthId = array[0] + array[1] |
|||
} |
|||
}, |
|||
components: { fileList }, |
|||
async mounted () { |
|||
this.startLoading() |
|||
|
|||
|
|||
await this.loadInfo() |
|||
|
|||
|
|||
|
|||
this.endLoading() |
|||
|
|||
}, |
|||
|
|||
methods: { |
|||
|
|||
|
|||
|
|||
async loadInfo () { |
|||
const url = `/resi/partymember/icPartyAct/act-detail/${this.icPartyActId}`; |
|||
// const url = `http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/act-detail/${this.icPartyActId}`; |
|||
|
|||
let params = {} |
|||
|
|||
const { data, code, msg } = await requestPost(url, params) |
|||
|
|||
if (code === 0) { |
|||
this.formData = { ...data } |
|||
this.formData.publichIdArray = [] |
|||
if (data.publishOrgPathShow) { |
|||
this.formData.publichIdArray = data.publishOrgPathShow.split(':') |
|||
} else { |
|||
let array = data.publishOrgPath.split(':') |
|||
array.forEach(element => { |
|||
if (this.isInTree(element)) { |
|||
this.formData.publichIdArray.push(element) |
|||
} |
|||
|
|||
}); |
|||
} |
|||
|
|||
this.formData.joinIdArray = [] |
|||
this.formData.joinNames = '' |
|||
data.joinOrgList.forEach(element => { |
|||
if (element.joinOrgPathShow) { |
|||
this.formData.joinIdArray.push(element.joinOrgPathShow.split(':')) |
|||
} else { |
|||
let array = element.joinOrgPath.split(':') |
|||
let joinIdTemp = [] |
|||
array.forEach(element => { |
|||
if (this.isInTree(element)) { |
|||
joinIdTemp.push(element) |
|||
} |
|||
|
|||
}); |
|||
|
|||
this.formData.joinIdArray.push(joinIdTemp) |
|||
} |
|||
|
|||
this.formData.joinNames = this.formData.joinNames + element.joinOrgName + ',' |
|||
|
|||
}); |
|||
|
|||
console.log('info-joinIdArray', this.formData.joinIdArray) |
|||
|
|||
if (this.formData.joinNames) { |
|||
this.formData.joinNames = this.formData.joinNames.substring(0, this.formData.joinNames.length - 1) |
|||
} |
|||
|
|||
this.fileList = [... this.formData.attachmentList] |
|||
|
|||
} else { |
|||
this.$message.error(msg) |
|||
} |
|||
}, |
|||
|
|||
//剔除树上没有的id |
|||
isInTree (id) { |
|||
let inTree = false |
|||
const fn = (obj) => { |
|||
if (Array.isArray(obj)) { |
|||
|
|||
|
|||
obj.forEach((item) => { |
|||
// |
|||
if (item.id === id) { |
|||
inTree = true |
|||
} else { |
|||
|
|||
} |
|||
|
|||
fn(item.children); |
|||
}); |
|||
|
|||
} |
|||
|
|||
|
|||
}; |
|||
fn(this.publishOptions); |
|||
return inTree |
|||
|
|||
}, |
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
handlePreview (src) { |
|||
console.log(src) |
|||
if (src) { |
|||
window.open(src); |
|||
} |
|||
}, |
|||
|
|||
|
|||
beforeUpload (file) { |
|||
const array = file.name.split('.') |
|||
const extension = array[array.length - 1] |
|||
|
|||
const formatarray = ['jpg', 'png', 'jpeg', 'bmp', 'mp4', 'wma', 'm4a', 'mp3', 'doc', 'docx', 'xls', 'xlsx', 'pdf'] |
|||
|
|||
if (formatarray.indexOf(extension) === -1) { |
|||
this.$message.error('只支持图片、word、pdf') |
|||
return false |
|||
} |
|||
|
|||
}, |
|||
|
|||
handleFileRemove (file) { |
|||
|
|||
if (file && file.status === "success") { |
|||
this.fileList.splice(this.fileList.findIndex(item => item.uid === file.uid), 1) |
|||
} |
|||
}, |
|||
|
|||
handleFileSuccess (res, file) { |
|||
|
|||
if (res.code === 0 && res.msg === 'success') { |
|||
const array = file.name.split('.') |
|||
const fileType = array[array.length - 1] |
|||
|
|||
const picArray = ['jpg', 'png', 'jpeg', 'bmp'] |
|||
const videoarray = ['mp4', 'wma', 'm4a'] |
|||
const docArray = ['doc', 'docx', 'xls', 'xlsx', 'pdf'] |
|||
const mp3Array = ['mp3'] |
|||
|
|||
if (picArray.indexOf(fileType) > -1) { |
|||
file.format = 'image' |
|||
} else if (videoarray.indexOf(fileType) > -1) { |
|||
file.format = 'video' |
|||
} else if (docArray.indexOf(fileType) > -1) { |
|||
file.format = 'doc' |
|||
} else if (mp3Array.indexOf(fileType) > -1) { |
|||
file.format = 'voice' |
|||
} |
|||
|
|||
file.url = res.data.url |
|||
file.type = fileType |
|||
|
|||
// file.attachmentName = file.name |
|||
// file.attachmentType = file.type |
|||
// file.attachmentUrl = file.url |
|||
file.format = file.attachmentFormat |
|||
|
|||
|
|||
this.fileList.push(file) |
|||
console.log(this.fileList) |
|||
} else this.$message.error(res.msg) |
|||
}, |
|||
|
|||
//下载 |
|||
handleFileDownload (file) { |
|||
|
|||
var a = document.createElement('a'); |
|||
var event = new MouseEvent('click'); |
|||
a.download = file.name; |
|||
console.log(a) |
|||
a.href = file.url; |
|||
a.dispatchEvent(event); |
|||
|
|||
|
|||
}, |
|||
handleCancle () { |
|||
this.resetData() |
|||
this.$emit('handleClose') |
|||
|
|||
}, |
|||
|
|||
|
|||
|
|||
resetData () { |
|||
|
|||
this.formData = { |
|||
icPartyActId: '',//编辑活动时必传 |
|||
actType: '',// 活动类型,来源于活动类型接口value |
|||
holdYearId: '',//活动开始时间所属年份:yyyy |
|||
holdMonthId: '',//活动开始时间所属月份:yyyyMM |
|||
holdTime: '',//活动开始时间:yyyy-MM-dd HH:mm:ss |
|||
topic: '',// 活动主题 |
|||
address: '',// 活动地址 |
|||
latitude: '',//活动地点纬度 |
|||
longitude: '',// 活动地点经度 |
|||
autoPublicType: '',//自动发布时间key; 来源于字典表接口 |
|||
publishPartyOrgId: '',// 发布活动党组织id |
|||
publishPartyOrgName: '',// 发布活动党组织名称 |
|||
publishOrgPid: '',// 参加活动党组织ID的上级节点 |
|||
publishOrgType: '',//党组织类型 0省委,1市委,2区委,3党工委,4党委,5支部;6党小组 |
|||
publishOrgPathShow: '',//PUBLISH_PARTY_ORG_ID的全路径,包含自身。方便前端回显 |
|||
joinUserType: '',//参加人员类型,0:全体党员;1:支部委员 |
|||
isAutoInform: '',// 是否自动通知参加人员,0否;1是 |
|||
introduce: '',// 活动介绍 |
|||
joinOrgList: [], |
|||
attachmentList: [], |
|||
joinIdArray: [], |
|||
publichIdArray: [] |
|||
|
|||
} |
|||
|
|||
}, |
|||
// 开启加载动画 |
|||
startLoading () { |
|||
loading = Loading.service({ |
|||
lock: true, // 是否锁定 |
|||
text: '正在加载……', // 加载中需要显示的文字 |
|||
background: 'rgba(0,0,0,.7)' // 背景颜色 |
|||
}) |
|||
}, |
|||
// 结束加载动画 |
|||
endLoading () { |
|||
// clearTimeout(timer); |
|||
if (loading) { |
|||
loading.close() |
|||
} |
|||
} |
|||
}, |
|||
computed: { |
|||
dataRule () { |
|||
return { |
|||
|
|||
actType: [ |
|||
{ required: true, message: '活动类型不能为空', trigger: 'change' }, |
|||
], |
|||
holdTime: [ |
|||
{ required: true, message: '活动举办时间不能为空', trigger: 'change' } |
|||
], |
|||
|
|||
topic: [ |
|||
{ required: true, message: '活动主题不能为空', trigger: 'change' } |
|||
], |
|||
address: [ |
|||
{ required: true, message: '活动地点不能为空', trigger: 'change' } |
|||
], |
|||
autoPublicType: [ |
|||
{ required: true, message: '自动发布时间不能为空', trigger: 'change' } |
|||
], |
|||
joinUserType: [ |
|||
{ required: true, message: '参加人员不能为空', trigger: 'change' } |
|||
], |
|||
joinIdArray: [ |
|||
{ required: true, message: '参加活动党组织不能为空', trigger: 'change' } |
|||
], |
|||
publichIdArray: [ |
|||
{ required: true, message: '发布活动党组织不能为空', trigger: 'change' } |
|||
], |
|||
|
|||
} |
|||
}, |
|||
|
|||
|
|||
}, |
|||
props: { |
|||
|
|||
formType: { //表单操作类型 add新增,edit编辑,detail详情 |
|||
type: String, |
|||
required: '' |
|||
}, |
|||
icPartyActId: { |
|||
type: String, |
|||
required: '' |
|||
}, |
|||
defaultTime: { |
|||
type: String, |
|||
required: '' |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped > |
|||
@import "@/assets/scss/modules/management/detail-main.scss"; |
|||
</style> |
@ -0,0 +1,131 @@ |
|||
<template> |
|||
<div> |
|||
<div class="div-file" |
|||
v-for="(item,index) in fileList" |
|||
:key="index"> |
|||
<img v-if="item.type==='xls'||item.type==='xlsx'" |
|||
src="@/assets/img/excel.png" |
|||
class="image"> |
|||
<img v-else-if="item.type==='pdf'" |
|||
src="@/assets/img/pdf.png" |
|||
class="image"> |
|||
<img v-else-if="item.type==='doc'||item.type==='docx'" |
|||
src="@/assets/img/word.png" |
|||
class="image"> |
|||
|
|||
<img v-else-if="item.type==='mp4'||item.type==='wma'||item.type==='m4a'||item.type==='mp3'" |
|||
src="@/assets/img/video.png" |
|||
class="image"> |
|||
<img v-else |
|||
src="@/assets/img/image.png" |
|||
class="image"> |
|||
<div @click="watchFile(item.url)" |
|||
class="name">{{item.name}}</div> |
|||
</div> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapGetters } from 'vuex' |
|||
import { Loading } from 'element-ui' // 引入Loading服务 |
|||
import { requestPost, requestGet } from '@/js/dai/request' |
|||
|
|||
|
|||
let loading // 加载动画 |
|||
export default { |
|||
data () { |
|||
return { |
|||
// const formatarray = ['jpg', 'png', 'jpeg', 'bmp', 'mp4', 'wma', 'm4a', 'mp3', 'doc', 'docx', 'xls', 'xlsx', 'pdf'] |
|||
btnDisable: false, |
|||
|
|||
formData: {}, |
|||
|
|||
fileList: [], |
|||
uploadUlr: window.SITE_CONFIG['apiURL'] + '/oss/file/uploadvariedfile', |
|||
|
|||
} |
|||
}, |
|||
|
|||
watch: { |
|||
|
|||
}, |
|||
components: {}, |
|||
async mounted () { |
|||
this.startLoading() |
|||
|
|||
|
|||
|
|||
this.endLoading() |
|||
|
|||
}, |
|||
|
|||
methods: { |
|||
|
|||
watchFile (src) { |
|||
if (src) { |
|||
window.open(src); |
|||
} |
|||
}, |
|||
handleCancle () { |
|||
this.resetData() |
|||
this.$emit('handleClose') |
|||
|
|||
}, |
|||
|
|||
|
|||
|
|||
|
|||
// 开启加载动画 |
|||
startLoading () { |
|||
loading = Loading.service({ |
|||
lock: true, // 是否锁定 |
|||
text: '正在加载……', // 加载中需要显示的文字 |
|||
background: 'rgba(0,0,0,.7)' // 背景颜色 |
|||
}) |
|||
}, |
|||
// 结束加载动画 |
|||
endLoading () { |
|||
// clearTimeout(timer); |
|||
if (loading) { |
|||
loading.close() |
|||
} |
|||
} |
|||
}, |
|||
computed: { |
|||
|
|||
|
|||
|
|||
}, |
|||
props: { |
|||
|
|||
fileList: { |
|||
type: String, |
|||
default: () => [] |
|||
}, |
|||
|
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped > |
|||
.div-file { |
|||
display: flex; |
|||
align-items: center; |
|||
padding-bottom: 10px; |
|||
|
|||
.image { |
|||
width: 25px; |
|||
height: 25px; |
|||
} |
|||
|
|||
.name { |
|||
margin-left: 10px; |
|||
color: rgb(0, 149, 255); |
|||
border-bottom: 1px solid rgb(0, 149, 255); |
|||
cursor: pointer; |
|||
font-size: 14px; |
|||
} |
|||
} |
|||
</style> |
Loading…
Reference in new issue