协同宣发
This commit is contained in:
yanran200730
@@ -10,25 +10,37 @@
|
||||
<ai-card title="基本信息">
|
||||
<template #content>
|
||||
<div class="ai-form">
|
||||
<el-form-item label="任务名称" prop="name" style="width: 100%;" :rules="[{ required: true, message: '请输入任务名称', trigger: 'blur' }]">
|
||||
<el-form-item label="任务名称" prop="taskTitle" style="width: 100%;" :rules="[{ required: true, message: '请输入任务名称', trigger: 'blur' }]">
|
||||
<el-input size="small" placeholder="请输入任务名称" v-model="form.taskTitle" :maxlength="15" show-word-limit></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="发送范围" style="width: 100%;" prop="sendScope">
|
||||
<el-radio-group v-model="form.sendScope">
|
||||
<el-form-item label="发送范围" style="width: 100%;" prop="sendScope" :rules="[{ required: true, message: '请选择发送范围', trigger: 'change' }]">
|
||||
<el-radio-group v-model="form.sendScope" @change="onScopeChange">
|
||||
<el-radio label="0">全部居民群</el-radio>
|
||||
<el-radio label="1">按部门选择</el-radio>
|
||||
<el-radio label="2">按网格选择</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="选择群主" prop="departmentName" style="width: 100%;" :rules="[{ required: true, message: '请选择部门', trigger: 'change' }]">
|
||||
<el-input size="small" :autosize="{ minRows: 2, maxRows: 10}" placeholder="请选择..." disabled v-model="form.departmentName">
|
||||
<ai-user-get slot="append" isStrictly :instance="instance" isChooseUnit>
|
||||
<el-button type="info">选择</el-button>
|
||||
</ai-user-get>
|
||||
</el-input>
|
||||
<el-form-item label="选择群主" v-if="form.sendScope !== '0'" prop="wxGroupsName" style="width: 100%;" :rules="[{ required: true, message: '请选择选择群主', trigger: 'change' }]">
|
||||
<div class="AppAnnounceDetail-select">
|
||||
<el-input size="small" class="AppAnnounceDetail-select__input" placeholder="请选择..." disabled v-model="form.wxGroupsName"></el-input>
|
||||
<div class="select-left" v-if="form.groupIds.length">
|
||||
<span v-for="(item, index) in form.groupIds" :key="index">
|
||||
<ai-open-data type="departmentName" :openid="item"></ai-open-data>
|
||||
</span>
|
||||
</div>
|
||||
<i v-if="!form.groupIds.length">请选择</i>
|
||||
<ai-picker
|
||||
:instance="instance"
|
||||
multiple
|
||||
:action="form.sendScope === '1' ? '/app/wxcp/wxdepartment/departList' : '/app/appgirdinfo/girdList'"
|
||||
v-model="form.groupIds"
|
||||
@change="onSelcetChange">
|
||||
<div class="select-right">选择</div>
|
||||
</ai-picker>
|
||||
</div>
|
||||
<div class="tips">
|
||||
<p>消息预计送达居民群数：</p>
|
||||
<span>215</span>
|
||||
<span>{{ form.groupIds.length }}</span>
|
||||
<el-tooltip
|
||||
placement="top"
|
||||
content="任务开始后，3天内15分钟更新1次，3天后访问页面时触发更新，1时间最多刷新1次">
|
||||
@@ -36,7 +48,7 @@
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="发送内容" prop="content" style="width: 100%;" :rules="[{ required: true, message: '请选择部门', trigger: 'change' }]">
|
||||
<el-form-item label="发送内容" prop="content" style="width: 100%;" :rules="[{ required: true, message: '请输入发送内容', trigger: 'blur' }]">
|
||||
<el-input size="small" type="textarea" :rows="6" placeholder="请输入文本内容..." v-model="form.content"></el-input>
|
||||
<div class="add">
|
||||
<div class="fileList" v-if="fileList.length">
|
||||
@@ -126,12 +138,19 @@
|
||||
active-text="开启后，创建的群发任务需要审批人进行审批">
|
||||
</el-switch>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="form.enableExamine === '1'" label="审批人员" prop="departmentName" style="width: 100%;" :rules="[{ required: true, message: '请选择部门', trigger: 'change' }]">
|
||||
<el-input size="small" :autosize="{ minRows: 2, maxRows: 10}" placeholder="请选择..." disabled v-model="form.departmentName">
|
||||
<ai-user-get slot="append" isStrictly :instance="instance" isChooseUnit>
|
||||
<el-button type="info">选择</el-button>
|
||||
<el-form-item v-if="form.enableExamine === '1'" label="审批人员" prop="examines" style="width: 100%;" :rules="[{ required: true, message: '请选择审批人员', trigger: 'change' }]">
|
||||
<div class="AppAnnounceDetail-select">
|
||||
<el-input class="AppAnnounceDetail-select__input" size="small" placeholder="请选择..." v-model="form.examinesName"> </el-input>
|
||||
<div class="select-left" v-if="form.examines.length">
|
||||
<span v-for="(item, index) in form.examines" :key="index">
|
||||
<ai-open-data type="userName" :openid="item.id"></ai-open-data>
|
||||
</span>
|
||||
</div>
|
||||
<i v-if="!form.examines.length">请选择</i>
|
||||
<ai-user-get :instance="instance" v-model="form.examines" @change="onUserChange">
|
||||
<div class="select-right">选择</div>
|
||||
</ai-user-get>
|
||||
</el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</template>
|
||||
@@ -143,7 +162,9 @@
|
||||
<div class="right-content">
|
||||
<div class="msg-list">
|
||||
<div class="msg-item" v-if="form.content">
|
||||
<div class="msg-item__left"></div>
|
||||
<div class="msg-item__left">
|
||||
<img v-if="user.info.avatar" :src="user.info.avatar" />
|
||||
</div>
|
||||
<div class="msg-item__right">
|
||||
<div class="msg-wrapper msg-text">
|
||||
<p>{{ form.content }}</p>
|
||||
@@ -151,7 +172,9 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="msg-item" v-for="(item, index) in fileList" :key="index">
|
||||
<div class="msg-item__left"></div>
|
||||
<div class="msg-item__left">
|
||||
<img v-if="user.info.avatar" :src="user.info.avatar" />
|
||||
</div>
|
||||
<div class="msg-item__right" :class="[['1', '2'].indexOf(item.msgType) !== -1 ? 'left-border' : '']">
|
||||
<div class="msg-wrapper msg-img" v-if="item.msgType === '1'">
|
||||
<img :src="item.url" />
|
||||
@@ -256,13 +279,14 @@
|
||||
</template>
|
||||
<template #footer>
|
||||
<el-button @click="cancel">取消</el-button>
|
||||
<el-button type="primary" @click="confirm" style="width: 120px;">通知成员发送</el-button>
|
||||
<el-button type="primary" @click="confirm">定时发送</el-button>
|
||||
<el-button type="primary" @click="confirm(0)" style="width: 120px;">通知成员发送</el-button>
|
||||
<el-button type="primary" @click="confirm(1)">定时发送</el-button>
|
||||
</template>
|
||||
</ai-detail>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapActions, mapState } from 'vuex'
|
||||
export default {
|
||||
name: 'Add',
|
||||
|
||||
@@ -297,10 +321,13 @@
|
||||
enableExamine: '0',
|
||||
examines: [],
|
||||
wxGroups: [],
|
||||
groupIds: [],
|
||||
wxGroupsName: '',
|
||||
sendScope: '0',
|
||||
sendType: 0,
|
||||
name: '',
|
||||
taskTitle: ''
|
||||
taskTitle: '',
|
||||
examinesName: ''
|
||||
},
|
||||
id: '',
|
||||
tagsList: []
|
||||
@@ -317,25 +344,22 @@
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
...mapState(['user'])
|
||||
},
|
||||
|
||||
created () {
|
||||
this.getTags()
|
||||
|
||||
if (this.params && this.params.departmentId && !this.params.id) {
|
||||
this.department = [{
|
||||
id: String(this.params.departmentId),
|
||||
name: this.params.departmentName
|
||||
}]
|
||||
this.form.departmentIds = [this.params.departmentId]
|
||||
this.form.departmentName = this.params.departmentName
|
||||
}
|
||||
|
||||
if (this.params && this.params.id) {
|
||||
this.id = this.params.id
|
||||
this.getInfo(this.params.id)
|
||||
} else {
|
||||
this.getWxGroups()
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
...mapActions(['initOpenData', 'transCanvas']),
|
||||
|
||||
getInfo (id) {
|
||||
this.instance.post(`/app/wxcp/wxuser/queryDetailById?id=${id}`).then(res => {
|
||||
if (res.code === 0) {
|
||||
@@ -349,6 +373,47 @@
|
||||
})
|
||||
},
|
||||
|
||||
onUserChange (e) {
|
||||
if (e.length) {
|
||||
this.form.examinesName = '1'
|
||||
} else {
|
||||
this.form.wxGroupsName = ''
|
||||
}
|
||||
},
|
||||
|
||||
onScopeChange (e) {
|
||||
if (e === '0') {
|
||||
this.getWxGroups()
|
||||
} else {
|
||||
this.form.groupIds = []
|
||||
}
|
||||
},
|
||||
|
||||
onSelcetChange (e) {
|
||||
if (e.length) {
|
||||
this.form.wxGroupsName = '1'
|
||||
} else {
|
||||
this.form.wxGroupsName = ''
|
||||
}
|
||||
this.getWxGroups()
|
||||
},
|
||||
|
||||
getWxGroups () {
|
||||
this.instance.post(`/app/appmasssendingtask/queryWxGroups?sendScope=${this.form.sendScope}`, null, {
|
||||
data: {
|
||||
groupIds: this.form.groupIds.join(',')
|
||||
},
|
||||
headers: {'Content-Type': 'application/json;charset=utf-8'},
|
||||
transformRequest: [function (data) {
|
||||
return data.groupIds
|
||||
}]
|
||||
}).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.form.wxGroups = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
onLinkConfirm () {
|
||||
this.$refs.linkForm.validate((valid) => {
|
||||
if (valid) {
|
||||
@@ -442,7 +507,9 @@
|
||||
this.fileList.push({
|
||||
...res.data.file,
|
||||
media: res.data.media,
|
||||
msgType: type
|
||||
msgType: type,
|
||||
imgPicUrl: res.data.file.url,
|
||||
mediaId: res.data.media.mediaId
|
||||
})
|
||||
|
||||
this.$message.success('上传成功')
|
||||
@@ -460,20 +527,32 @@
|
||||
}
|
||||
},
|
||||
|
||||
getTags () {
|
||||
this.instance.post(`/app/wxcp/wxtag/listAll`).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.tagsList = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
confirm () {
|
||||
confirm (sendType) {
|
||||
this.$refs.form.validate((valid) => {
|
||||
if (valid) {
|
||||
const api = this.id ? '/app/wxcp/wxuser/update' : '/app/wxcp/wxuser/add'
|
||||
this.instance.post(api, {
|
||||
...this.form
|
||||
if (sendType === 1) {
|
||||
return false
|
||||
}
|
||||
|
||||
const contents = [
|
||||
{
|
||||
content: this.form.content,
|
||||
msgType: '0'
|
||||
},
|
||||
...this.fileList
|
||||
]
|
||||
|
||||
this.instance.post(`/app/appmasssendingtask/addOrUpdate`, {
|
||||
...this.form,
|
||||
id: this.params.id,
|
||||
wxGroups: this.form.wxGroups,
|
||||
contents,
|
||||
examines: this.form.examines.length ? this.form.examines.map(v => {
|
||||
return {
|
||||
...v,
|
||||
examineUserId: v.id
|
||||
}
|
||||
}) : []
|
||||
}).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('提交成功')
|
||||
@@ -547,6 +626,10 @@
|
||||
}
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.add {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -625,14 +708,14 @@
|
||||
top: 0;
|
||||
width: 338px;
|
||||
height: 675px;
|
||||
padding: 90px 15px 90px 32px;
|
||||
padding: 80px 15px 100px 32px;
|
||||
|
||||
.phone {
|
||||
position: absolute;
|
||||
left: 14px;
|
||||
top: 14px;
|
||||
left: 13px;
|
||||
top: 4px;
|
||||
z-index: 1;
|
||||
width: 310px;
|
||||
width: 314px;
|
||||
height: 647px;
|
||||
}
|
||||
|
||||
@@ -662,6 +745,12 @@
|
||||
background: #2891FF;
|
||||
border-radius: 4px;
|
||||
flex-shrink: 1;
|
||||
overflow: hidden;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.msg-item__right {
|
||||
@@ -826,6 +915,68 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.AppAnnounceDetail-select {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-height: 32px;
|
||||
background: #F5F5F5;
|
||||
border-radius: 2px;
|
||||
border: 1px solid #D0D4DC;
|
||||
|
||||
& > i {
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
padding: 0 12px;
|
||||
color: #888888;
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.AppAnnounceDetail-select__input {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: -1;
|
||||
opacity: 0;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.select-right {
|
||||
height: 100%;
|
||||
padding: 0 12px;
|
||||
color: #222222;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
transition: all ease 0.3s;
|
||||
|
||||
&:hover {
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
|
||||
.select-left {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex: 1;
|
||||
padding: 5px 0 5px 12px;
|
||||
border-right: 1px solid #D0D4DC;
|
||||
background: #fff;
|
||||
|
||||
span {
|
||||
height: 22px;
|
||||
line-height: 22px;
|
||||
margin: 0 4px 5px 0;
|
||||
padding: 0 8px;
|
||||
font-size: 12px;
|
||||
color: #222222;
|
||||
background: #F3F4F7;
|
||||
border-radius: 2px;
|
||||
border: 1px solid #D0D4DC;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tips {
|
||||
|
||||
Reference in New Issue
Block a user