483 lines
17 KiB
Vue
483 lines
17 KiB
Vue
<template>
|
||
<div>
|
||
<el-form ref="addform" :model="formData" label-width="120px">
|
||
<el-row gutter="20">
|
||
<el-col :span="24">
|
||
<el-form-item label="活动名称" prop="title">
|
||
<el-input v-model="formData.title" :disabled="title_disabled" clearable placeholder="请输入活动名称"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<!-- <vi-title title="模式一"></vi-title>-->
|
||
<div style="letter-spacing: 1px;color: rgb(24, 103, 176);margin-left: 26px; font-weight: bolder">模式一</div>
|
||
<el-row>
|
||
<el-col :span="5">
|
||
<el-form-item label="发送对象" prop="type">
|
||
<el-radio v-model="formData.type" :disabled="hold" border label="system"
|
||
@change="ChangeType">系统角色
|
||
</el-radio>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<el-form-item label="所属模块" prop="module">
|
||
<el-select v-model="formData.module" :disabled="hold" style="width: 100%" @change="getRoleListByMenuId">
|
||
<el-option
|
||
v-for="item in menuOptions"
|
||
:key="item.id"
|
||
:label="item.name"
|
||
:value="item.id">
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="5">
|
||
<el-form-item
|
||
v-if="formData.module=='aca4d14498c145ceb5b24ed70776aae2'||formData.module=='733d7266652740a3aeac9da97ab5eeca'"
|
||
label="所属教代会"
|
||
prop="teacherMeetingId">
|
||
<el-select v-model="formData.teacherMeetingId" :disabled="hold" clearable
|
||
filterable
|
||
placeholder="所属教代会">
|
||
<el-option v-for="item in meetingOptions" :key="item.id"
|
||
:label="item.jdhallname"
|
||
:value="item.id">
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
|
||
<el-col :span="8">
|
||
<el-form-item label="发送角色" prop="roleIds">
|
||
<el-select v-model="formData.roleIds" :disabled="hold" clearable filterable multiple style="width: 100%"
|
||
@change="changeRole">
|
||
<el-option v-for="item in roleList" :label="item.name" :value="item.id"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<!-- <vi-title title="模式二"></vi-title>-->
|
||
<div style="letter-spacing: 1px;color: rgb(24, 103, 176);margin-left: 26px; font-weight: bolder">模式二</div>
|
||
<el-row>
|
||
<el-col :span="12">
|
||
<el-form-item label="发送对象" prop="activityGroupId">
|
||
<el-select v-model="formData.activityGroupId" :disabled="hold" clearable
|
||
placeholder="请在活动基础管理中设置人员范围" style="width: 100%" @change="getActivityUserData">
|
||
<el-option v-for="item in activityGroupList"
|
||
:label="item.groupName"
|
||
:value="item.groupId"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
|
||
</el-row>
|
||
|
||
<!-- <vi-title title="模式三"></vi-title>-->
|
||
<div style="letter-spacing: 1px;color: rgb(24, 103, 176);margin-left: 26px; font-weight: bolder">模式三</div>
|
||
<el-row>
|
||
<el-col :span="12">
|
||
<el-form-item label="发送对象" prop="type">
|
||
<el-radio v-model="formData.type" :disabled="hold" border label="user" @change="ChangeType">
|
||
自定义人员
|
||
</el-radio>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
|
||
<el-form-item>
|
||
<div v-if="formData.type=='system'" class="btn-group tool-button mt5">
|
||
<el-input v-model="pageForm1.searchKeyword" clearable placeholder="请输入内容"
|
||
style="width: 100%"
|
||
@keyup.enter.native="doSearch">
|
||
<el-select slot="prepend" v-model="pageForm1.searchName" placeholder="查询类型"
|
||
style="width: 80px;">
|
||
<el-option label="姓名" value="u.username"></el-option>
|
||
<el-option label="工号" value="u.loginname"></el-option>
|
||
</el-select>
|
||
</el-input>
|
||
</div>
|
||
<div v-if="formData.type=='system'" class="btn-group tool-button mt5">
|
||
<el-button icon="el-icon-search" type="primary" @click="changeRole">搜索</el-button>
|
||
</div>
|
||
<div v-if="!hold" class="pull-right offscreen-right mt5">
|
||
<el-button v-if="formData.type=='user'" icon="el-icon-search" @click="openSelect">选择用户
|
||
</el-button>
|
||
<el-button icon="el-icon-delete" type="danger" @click="doDeleteUser">清空用户</el-button>
|
||
</div>
|
||
<el-table
|
||
:data="formData.users"
|
||
:default-sort="{prop: 'opAt', order: 'descending'}"
|
||
header-align="center"
|
||
max-height="400px"
|
||
style="width: 100%;margin-top: 10px;margin-bottom: 10px;overflow-y: auto;"
|
||
@selection-change="(val)=>{selections = val.map(v=>v.loginname)}">
|
||
|
||
<el-table-column label="序号" type="index" width="80">
|
||
<template scope="scope">
|
||
<span>{{ scope.$index + (pageForm1.pageNumber - 1) * pageForm1.pageSize + 1 }} </span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="用户名" prop="loginName"></el-table-column>
|
||
<el-table-column label="姓名" prop="userName"></el-table-column>
|
||
<el-table-column label="手机" prop="mobile"></el-table-column>
|
||
<el-table-column label="所属单位" prop="unitName"></el-table-column>
|
||
<el-table-column label="院级工会" prop="unionName"></el-table-column>
|
||
<el-table-column v-if="formData.type=='user'&&!hold" align="center" fixed="right" header-align="center"
|
||
label="操作">
|
||
<template scope="{$index,row}">
|
||
<el-button size="mini" type="primary" @click="doDelete($index,row)">删除</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
<el-row v-if="formData.type!='user'" class="el-pagination-container" style="margin-bottom: 0px">
|
||
<el-pagination
|
||
:current-page="pageForm1.pageNumber"
|
||
:page-size="pageForm1.pageSize"
|
||
:page-sizes="[5,10, 20, 30, 50]"
|
||
:total="pageForm1.totalCount"
|
||
layout="total, sizes, prev, pager, next"
|
||
@size-change=" pageSizeChange1 "
|
||
@current-change="pageNumberChange1">
|
||
</el-pagination>
|
||
</el-row>
|
||
</el-form-item>
|
||
|
||
<vi-title title="消息发送方式"></vi-title>
|
||
<el-form-item label="发送方式" prop="sendTypes">
|
||
<el-checkbox-group v-model="formData.sendTypes" size="medium">
|
||
<el-checkbox :disabled="hold" border label="msg">短信发送</el-checkbox>
|
||
<!-- <el-checkbox :disabled="hold" border label="WeChat">微信发送</el-checkbox>-->
|
||
</el-checkbox-group>
|
||
</el-form-item>
|
||
<el-form-item label="发送内容模板" prop="contentId">
|
||
|
||
<el-select v-model="formData.contentId" :disabled="hold" clearable
|
||
placeholder="请选择内容模板" style="width: 100%">
|
||
<el-option v-for="item in contentList"
|
||
:label="item.name"
|
||
:value="item.id"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
|
||
|
||
<!-- <el-form-item label="发送内容" prop="content">
|
||
<el-input
|
||
:disabled="hold"
|
||
v-model="formData.content"
|
||
:rows="6"
|
||
placeholder="请输入内容"
|
||
type="textarea">
|
||
</el-input>
|
||
|
||
</el-form-item>-->
|
||
</el-form>
|
||
|
||
<el-dialog
|
||
:append-to-body="true" :visible.sync="selectDialogVisible"
|
||
title="选择用户"
|
||
:close-on-click-modal="false" @closed="diaClosed"
|
||
width="65%">
|
||
<div class="btn-group tool-button mt5">
|
||
<el-input v-model="pageForm.searchKeyword" clearable placeholder="请输入内容"
|
||
style="width: 100%"
|
||
@keyup.enter.native="doSearch">
|
||
<el-select slot="prepend" v-model="pageForm.searchName" placeholder="查询类型"
|
||
style="width: 80px;">
|
||
<el-option label="姓名" value="username"></el-option>
|
||
<el-option label="工号" value="loginname"></el-option>
|
||
</el-select>
|
||
</el-input>
|
||
|
||
</div>
|
||
<div class="btn-group tool-button mt5">
|
||
<el-button icon="el-icon-search" type="primary" @click="doSearch">搜索</el-button>
|
||
</div>
|
||
<el-table
|
||
:data="tableData"
|
||
:size="tableSize"
|
||
ref="table"
|
||
row-key="id"
|
||
:default-sort="{prop: 'opAt', order: 'descending'}"
|
||
header-align="center"
|
||
size="small"
|
||
style="width: 100%;margin-top: 10px;margin-bottom: 10px;overflow-y: auto"
|
||
@selection-change="handleSelectionChange">
|
||
<el-table-column type="selection" width="35" :reserve-selection="true"></el-table-column>
|
||
<el-table-column label="序号" type="index" width="80">
|
||
<template scope="scope">
|
||
<span>{{ scope.$index + (pageForm.pageNumber - 1) * pageForm.pageSize + 1 }} </span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="用户名" prop="loginName"></el-table-column>
|
||
<el-table-column label="姓名" prop="userName"></el-table-column>
|
||
<el-table-column label="手机" prop="mobile"></el-table-column>
|
||
<el-table-column label="所属单位" prop="unitName"></el-table-column>
|
||
<el-table-column label="院级工会" prop="unionName"></el-table-column>
|
||
</el-table>
|
||
<el-pagination
|
||
:current-page="pageForm.pageNumber"
|
||
:page-size="pageForm.pageSize"
|
||
:page-sizes="[5,10, 20, 30, 50]"
|
||
:total="pageForm.totalCount"
|
||
layout="total, sizes, prev, pager, next"
|
||
@size-change="pageSizeChange"
|
||
@current-change="pageNumberChange">
|
||
</el-pagination>
|
||
|
||
<span slot="footer" class="dialog-footer">
|
||
<el-button @click="selectDialogVisible = false"> 取 消 </el-button>
|
||
<el-button type="primary" @click="addUser"> 确 定 </el-button>
|
||
</span>
|
||
</el-dialog>
|
||
</div>
|
||
|
||
|
||
</template>
|
||
|
||
|
||
<script>
|
||
module.exports = {
|
||
model: {
|
||
prop: 'formData',
|
||
event: 'change'
|
||
},
|
||
props: {
|
||
title_disabled: {
|
||
type: Boolean,
|
||
default: false,
|
||
},
|
||
notify_id: {
|
||
type: String,
|
||
default: "",
|
||
},
|
||
hold: {
|
||
type: Boolean,
|
||
default: false,
|
||
},
|
||
formData: {
|
||
type: Object,
|
||
default: () => {
|
||
}
|
||
}
|
||
},
|
||
data() {
|
||
return {
|
||
contentList: [
|
||
// {id: "3cddb3bd15974d91baf82b3c59d07abe", name: "XX老师,喜气卷地百花开，千福万福道贺来！祝您新婚快乐！——校工会"},
|
||
{id: "9e92d6f686974ce7b5055e0f3a98d4b4", name: "XX老师，悉知亲人离世，望节哀顺变。保重身体。—校工会"}
|
||
],
|
||
tableSize: '',
|
||
notifyId: "",
|
||
hold: false,
|
||
selectDialogVisible: false,
|
||
users: [],
|
||
selectUsers: [],
|
||
activityGroupList: [],
|
||
roleList: [],
|
||
meetingOptions: [],
|
||
menuOptions: [],
|
||
tableData: [],
|
||
// formData: {
|
||
// type: "",
|
||
// sendTypes: []
|
||
// },
|
||
pageForm1: {
|
||
groupId: "",
|
||
searchName: 'u.username',
|
||
pageNumber: 1,
|
||
pageSize: 5,
|
||
totalCount: 0,
|
||
},
|
||
pageForm: {
|
||
searchName: "username",
|
||
searchKeyword: "",
|
||
pageNumber: 1,
|
||
pageSize: 10,
|
||
totalCount: 0,
|
||
pageOrderName: "",
|
||
pageOrderBy: ""
|
||
},
|
||
}
|
||
},
|
||
watch: {
|
||
formData(val) {
|
||
this.$emit('change', val);
|
||
}
|
||
|
||
},
|
||
methods: {
|
||
diaClosed() {
|
||
this.$refs.table.clearSelection()
|
||
this.selectUsers = [];
|
||
this.pageForm.searchKeyword = '';
|
||
},
|
||
handleSelectionChange(val) {
|
||
this.selectUsers = val;
|
||
},
|
||
async doDelete(index, row) {
|
||
try {
|
||
const confirm = await this.$confirm('您确定要删除吗?', '提示', {
|
||
confirmButtonText: '确定',
|
||
cancelButtonText: '取消',
|
||
type: 'warning'
|
||
})
|
||
if (confirm) {
|
||
this.formData.users.splice(index, 1)
|
||
}
|
||
} catch (e) {
|
||
console.log(e)
|
||
}
|
||
},
|
||
doDeleteUser() {
|
||
this.$set(this.formData, "users", [])
|
||
this.$forceUpdate();
|
||
},
|
||
addUser() {
|
||
this.formData.users = this.formData.users.concat(this.selectUsers)
|
||
this.selectDialogVisible = false;
|
||
},
|
||
pageSizeChange1(val) {
|
||
this.pageForm1.pageSize = val;
|
||
if (this.formData.roleIds.length > 0) {
|
||
this.changeRole();
|
||
} else if (this.formData.activityGroupId != "") {
|
||
this.getActivityUserData()
|
||
|
||
} else {
|
||
this.getUsersByTitleId(this.formData.id)
|
||
}
|
||
},
|
||
pageNumberChange1(val) {
|
||
this.pageForm1.pageNumber = val;
|
||
if (this.formData.roleIds.length > 0) {
|
||
this.changeRole();
|
||
} else if (this.formData.activityGroupId != "") {
|
||
this.getActivityUserData()
|
||
|
||
} else {
|
||
this.getUsersByTitleId(this.formData.id)
|
||
}
|
||
},
|
||
async ChangeType() {
|
||
this.$set(this.formData, "roleIds", [])
|
||
this.$set(this.formData, "module", "")
|
||
this.$set(this.formData, "teacherMeetingId", "")
|
||
this.$set(this.formData, "activityGroupId", "")
|
||
|
||
// this.$set(this.formData, "type", "")
|
||
this.$set(this.formData, "users", [])
|
||
|
||
},
|
||
async getRoleListByMenuId() {
|
||
const {data} = await $.post("/platform/msgNotify/send/getRoleListByMenuId", {menuId: this.formData.module})
|
||
this.roleList = data
|
||
if (!this.formData.id) {
|
||
this.$set(this.formData, "roleIds", [])
|
||
this.$set(this.formData, "users", [])
|
||
}
|
||
|
||
},
|
||
async getMenuOptions() {
|
||
const {data} = await $.get("/platform/sys/role/getMenuOptions")
|
||
this.menuOptions = data
|
||
if (!this.formData.id) {
|
||
this.$set(this.formData, "roleIds", [])
|
||
this.$set(this.formData, "users", [])
|
||
}
|
||
},
|
||
async changeRole() {
|
||
const data = await $.post("/platform/msgNotify/send/getUserByRoleId", {
|
||
roleIds: JSON.stringify(this.formData.roleIds),
|
||
module: this.formData.module,
|
||
teacherMeetingId: this.formData.teacherMeetingId,
|
||
pageSize: this.pageForm1.pageSize,
|
||
pageNumber: this.pageForm1.pageNumber,
|
||
searchName: this.pageForm1.searchName,
|
||
searchKeyword: this.pageForm1.searchKeyword
|
||
})
|
||
this.formData.users = data.data.list;
|
||
this.pageForm1.totalCount = data.data.totalCount;
|
||
|
||
|
||
},
|
||
async getActivityUserData() {
|
||
this.$set(this.formData, "roleIds", [])
|
||
this.$set(this.formData, "module", "")
|
||
this.$set(this.formData, "teacherMeetingId", "")
|
||
this.$set(this.formData, "type", "")
|
||
this.$set(this.formData, "users", [])
|
||
const pageForm = clone(this.pageForm1)
|
||
pageForm.groupId = this.formData.activityGroupId
|
||
const resp = await $.post('/platform/activity/basic/user/pageData', pageForm)
|
||
if (resp.code === 0) {
|
||
this.formData.users = resp.data.list
|
||
this.pageForm1.totalCount = resp.data.totalCount
|
||
}
|
||
},
|
||
async openSelect() {
|
||
this.pageData()
|
||
this.selectDialogVisible = true
|
||
},
|
||
doSearch() {
|
||
this.tableKey = new Date().getTime()
|
||
this.pageForm.pageNumber = 1
|
||
this.pageData()
|
||
},
|
||
pageNumberChange(val) {
|
||
this.pageForm.pageNumber = val;
|
||
this.pageData();
|
||
},
|
||
pageSizeChange(val) {
|
||
this.pageForm.pageSize = val;
|
||
this.pageData();
|
||
},
|
||
pageData() {
|
||
const pageForm = clone(this.pageForm)
|
||
pageForm.users = JSON.stringify(this.formData.users.map(v => v.id))
|
||
$.post('/platform/msgNotify/send/pageData', pageForm, (data) => {
|
||
if (data.code == 0) {
|
||
this.tableData = data.data.list;
|
||
this.pageForm.totalCount = data.data.totalCount;
|
||
} else {
|
||
this.$message.error(data.msg);
|
||
}
|
||
}, "json");
|
||
},
|
||
async findOne(id) {
|
||
const {data} = await $.post("/platform/msgNotify/send/findOne", {id: id})
|
||
data.sendTypes = data.sendTypes
|
||
data.activityGroupId = data.activityGroupId ? parseInt(data.activityGroupId) : ""
|
||
this.formData = data
|
||
},
|
||
async getUsersByTitleId(id, type) {
|
||
const data = await $.post("/platform/msgNotify/send/getUsersByTitleId", {...this.pageForm1, id: id, type: type})
|
||
if (data.data.totalCount) {
|
||
this.$set(this.formData, "users", data.data.list)
|
||
} else {
|
||
this.$set(this.formData, "users", data.data)
|
||
}
|
||
this.pageForm1.totalCount = data.data.totalCount;
|
||
},
|
||
async getActivityGroup() {
|
||
const resp = await $.get('/platform/activity/basic/scope/getActivityUserScopeGroup')
|
||
this.activityGroupList = resp.data
|
||
},
|
||
|
||
},
|
||
async created() {
|
||
this.meetingOptions = await proposal.getOpenMeeting()
|
||
await this.getActivityGroup()
|
||
|
||
await this.getMenuOptions()
|
||
// console.log(this.hold)
|
||
if (this.notify_id) {
|
||
await this.findOne(this.notify_id)
|
||
await this.getUsersByTitleId(this.notify_id, this.formData.type)
|
||
setTimeout(async () => {
|
||
await this.getRoleListByMenuId()
|
||
}, 100)
|
||
}
|
||
}
|
||
}
|
||
</script> |