302 lines
8.9 KiB
Vue
302 lines
8.9 KiB
Vue
<template>
|
|
<ai-detail class="AppAnnounceDetail">
|
|
<template slot="title">
|
|
<ai-title title="表单详情" isShowBack isShowBottomBorder @onBackClick="cancel(false)">
|
|
</ai-title>
|
|
</template>
|
|
<template slot="content">
|
|
<ai-card title="基础信息">
|
|
<template #content>
|
|
<ai-wrapper>
|
|
<ai-info-item label="任务名称" isLine :value="info.taskTitle"></ai-info-item>
|
|
<ai-info-item label="创建时间" :value="info.createTime"></ai-info-item>
|
|
<ai-info-item label="群发时间" :value="info.choiceTime"></ai-info-item>
|
|
<ai-info-item label="结束时间" :value="info.taskEndTime" v-if="info.sendChannel === '1'"></ai-info-item>
|
|
</ai-wrapper>
|
|
</template>
|
|
</ai-card>
|
|
<ai-card>
|
|
<template #title>
|
|
<div class="AppAnnounceDetail-title">
|
|
<span :class="[currIndex === 0 ? 'active' : '']" @click="currIndex = 0">填写统计</span>
|
|
<span :class="[currIndex === 1 ? 'active' : '']" @click="currIndex = 1">考核统计</span>
|
|
</div>
|
|
</template>
|
|
<template #content>
|
|
<div class="content-item" v-if="currIndex === 0">
|
|
<div class="bottom">
|
|
<ai-search-bar>
|
|
<template #left>
|
|
<el-button type="primary" @click="isShow = true">导出明细</el-button>
|
|
<ai-select
|
|
v-model="search1.type"
|
|
clearable
|
|
placeholder="请选择完成情况">
|
|
</ai-select>
|
|
</template>
|
|
<template #right>
|
|
<el-input
|
|
v-model="search1.name"
|
|
size="small"
|
|
placeholder="请输入参评人、评分人姓名"
|
|
clearable
|
|
v-throttle="() => {search.current = 1, getList()}"
|
|
@clear="search.current = 1, search.name = '', getList()"
|
|
suffix-icon="iconfont iconSearch">
|
|
</el-input>
|
|
</template>
|
|
</ai-search-bar>
|
|
<ai-table
|
|
:tableData="tableData1"
|
|
:col-configs="colConfigs1"
|
|
:total="total1"
|
|
border
|
|
tableSize="small"
|
|
:current.sync="search1.current"
|
|
:size.sync="search1.size"
|
|
@getList="getMemberInfo">
|
|
<el-table-column slot="user" label="成员" align="left">
|
|
<template slot-scope="{ row }">
|
|
<div class="userinfo">
|
|
<span>{{ row.groupOwnerName }}</span>
|
|
<span style="color: #999">{{ row.mainDepartmentName }}</span>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
</ai-table>
|
|
</div>
|
|
</div>
|
|
<div class="content-item" v-if="currIndex === 1">
|
|
<div class="bottom">
|
|
<ai-search-bar>
|
|
<template #left>
|
|
<el-button type="primary" @click="isShow = true">导出明细</el-button>
|
|
</template>
|
|
<template #right>
|
|
<el-input
|
|
v-model="search1.name"
|
|
size="small"
|
|
placeholder="请输入参评人姓名"
|
|
clearable
|
|
v-throttle="() => {search.current = 1, getList()}"
|
|
@clear="search.current = 1, search.name = '', getList()"
|
|
suffix-icon="iconfont iconSearch">
|
|
</el-input>
|
|
</template>
|
|
</ai-search-bar>
|
|
<ai-table
|
|
:tableData="tableData2"
|
|
:col-configs="colConfigs2"
|
|
:total="total2"
|
|
border
|
|
tableSize="small"
|
|
:current.sync="search2.current"
|
|
:size.sync="search2.size"
|
|
@getList="getGroupInfo">
|
|
<el-table-column slot="user" label="群主" align="center">
|
|
<template slot-scope="{ row }">
|
|
<div class="userinfo">
|
|
<span>{{ row.groupOwnerName }}</span>
|
|
<span style="color: #999">{{ row.mainDepartmentName }}</span>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
</ai-table>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</ai-card>
|
|
</template>
|
|
</ai-detail>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapState } from 'vuex'
|
|
export default {
|
|
name: 'Detail',
|
|
|
|
props: {
|
|
instance: Function,
|
|
dict: Object,
|
|
params: Object
|
|
},
|
|
|
|
data () {
|
|
return {
|
|
total1: 0,
|
|
isShowPhone: false,
|
|
total2: 0,
|
|
user1: [],
|
|
user2: [],
|
|
name1: '',
|
|
name2: '',
|
|
radio1: '未执行',
|
|
search1: {
|
|
current: 1,
|
|
size: 10,
|
|
deptartId: '',
|
|
type: 0,
|
|
sendStatus: '0'
|
|
},
|
|
search2: {
|
|
current: 1,
|
|
size: 10,
|
|
deptartId: '',
|
|
type: 1,
|
|
sendStatus: '0'
|
|
},
|
|
memberInfo: {},
|
|
groupInfo: {},
|
|
tableData1: [],
|
|
fileList: [],
|
|
tableData2: [],
|
|
info: {},
|
|
content: '',
|
|
currIndex: 0,
|
|
colConfigs1: [
|
|
{ slot: 'user', label: '成员' },
|
|
{ prop: 'groupCount', label: '预计送达居民群', align: 'center' }
|
|
],
|
|
colConfigs2: [
|
|
{ prop: 'groupName', label: '居民群' },
|
|
{ prop: 'memberCount', label: '群人数', align: 'center' },
|
|
{ slot: 'user', label: '群主', align: 'center' },
|
|
],
|
|
groups: [],
|
|
timer: null,
|
|
min: 60,
|
|
isDisabled: false,
|
|
rejecterId: ''
|
|
}
|
|
},
|
|
|
|
computed: {
|
|
...mapState(['user'])
|
|
},
|
|
|
|
created () {
|
|
this.getInfo(this.params.id)
|
|
},
|
|
|
|
methods: {
|
|
getMemberInfo () {
|
|
this.instance.post(`/app/appmasssendingtask/detailStatistics`, null, {
|
|
params: {
|
|
...this.search1,
|
|
taskId: this.params.id
|
|
}
|
|
}).then(res => {
|
|
if (res.code === 0) {
|
|
this.tableData1 = res.data.executedList.records
|
|
this.total1 = res.data.executedList.total
|
|
this.memberInfo = res.data
|
|
}
|
|
})
|
|
},
|
|
|
|
getGroupInfo () {
|
|
this.instance.post(`/app/appmasssendingtask/detailStatistics`, null, {
|
|
params: {
|
|
...this.search2,
|
|
taskId: this.params.id
|
|
}
|
|
}).then(res => {
|
|
if (res.code === 0) {
|
|
this.tableData2 = res.data.executedList.records.map(v => {
|
|
return {
|
|
...v,
|
|
groupName: v.groupName || '未命名群聊'
|
|
}
|
|
})
|
|
this.total2 = res.data.executedList.total
|
|
this.groupInfo = res.data
|
|
}
|
|
})
|
|
},
|
|
|
|
getInfo (id) {
|
|
this.instance.post(`/app/appmasssendingtask/queryDetailById?id=${id}`).then(res => {
|
|
if (res.code === 0) {
|
|
this.info = res.data
|
|
if (res.data.status === '4' && res.data.remindTime) {
|
|
this.countdown()
|
|
}
|
|
|
|
const content = res.data.contents.filter(v => v.msgType === '0')
|
|
|
|
if (content.length) {
|
|
this.content = content[0].content
|
|
}
|
|
|
|
this.fileList = res.data.contents.filter(v => v.msgType !== '0').map(v => {
|
|
return {
|
|
...v,
|
|
...v.sysFile
|
|
}
|
|
})
|
|
|
|
this.info.wxGroups = res.data.wxGroups.map(v => {
|
|
this.groups.push(...v.groupIds.split(','))
|
|
|
|
return {
|
|
...v,
|
|
groupIds: v.groupIds.split(',')
|
|
}
|
|
})
|
|
|
|
if (res.data.examines && res.data.examines.length) {
|
|
const user = res.data.examines.filter(v => v.examineStatus === '2')
|
|
|
|
if (user.length) {
|
|
this.rejecterId = user[0].examineUserId
|
|
}
|
|
}
|
|
}
|
|
})
|
|
},
|
|
|
|
cancel (isRefresh) {
|
|
this.$emit('change', {
|
|
type: 'List',
|
|
isRefresh: !!isRefresh
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.AppAnnounceDetail {
|
|
::v-deep .AppAnnounceDetail-title {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
span {
|
|
height: 100%;
|
|
line-height: 56px;
|
|
margin-right: 32px;
|
|
color: #888888;
|
|
font-size: 16px;
|
|
font-weight: 600;
|
|
transition: all ease 0.3s;
|
|
border-bottom: 3px solid transparent;
|
|
cursor: pointer;
|
|
user-select: none;
|
|
|
|
&:hover {
|
|
color: #222;
|
|
}
|
|
|
|
&:last-child {
|
|
margin-right: 0;
|
|
}
|
|
|
|
&.active {
|
|
color: #222222;
|
|
border-bottom: 3px solid #2266FF;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|