From 4641a877cd6a94e4d35dca7f7f14bc1443e2d2ad Mon Sep 17 00:00:00 2001 From: luobisheng <727299681@qq.com> Date: 星期二, 29 十一月 2022 17:59:55 +0800 Subject: [PATCH] 上传处置类型修改 --- src/views/operate/message/myIndex/update/index.vue | 876 ++++++++++++++++++++++++++++++--------------------------- 1 files changed, 462 insertions(+), 414 deletions(-) diff --git a/src/views/operate/message/myIndex/update/index.vue b/src/views/operate/message/myIndex/update/index.vue index 2c25012..9ea2741 100644 --- a/src/views/operate/message/myIndex/update/index.vue +++ b/src/views/operate/message/myIndex/update/index.vue @@ -1,435 +1,483 @@ <template> - <div class="createUser"> - <main> - <div class="mainContent"> - <el-form ref="user" label-width="140px" autoComplete="on" :model="role" :rules="createRoleRules" - label-position="right"> - <!-- 娑堟伅鏍忕洰 --> - <el-form-item class="optionItem" label="娑堟伅鏍忕洰:" prop="messageType"> - <div class="message-item"> - <div class="message-item__left"> - <el-select v-model="role.messageType" placeholder="璇烽�夋嫨娑堟伅鏍忕洰"> - <el-option v-for="item in colList" :key="item.id" :label="item.columnName" - :value="item.id"> - </el-option> - </el-select> - </div> - <span class="message-add" @click='dialogCreate = true'> 娣诲姞鏍忕洰</span> - </div> - </el-form-item> - <!-- 娑堟伅鏍囬 --> - <el-form-item class="optionItems" label="娑堟伅鏍囬:" prop="head"> - <div class="message-item__left"> - <el-input v-model="role.head" placeholder="璇烽�夋嫨娑堟伅鏍囬"></el-input> - </div> - </el-form-item> - <!-- 鎺ユ敹瀵硅薄 --> - <el-form-item class="optionItem" label="鎺ユ敹瀵硅薄:" prop="targetTo"> - <div class="message-item__left"> - <el-select v-model="role.targetTo" placeholder="璇烽�夋嫨鎺ユ敹瀵硅薄" > - <el-option :value="role.targetTo"> - <el-tree ref="tree" :data="departList" :props="defaultProps" show-checkbox - @check="handleCheck" default-expand-all node-key="id"> - </el-tree> - </el-option> - </el-select> - </div> - </el-form-item> - <!-- 娑堟伅鍐呭 --> - <el-form-item class="optionItem" label="娑堟伅鍐呭:" prop="body"> - <MyEditor ref="edit" @getMyBody="getMyBody"></MyEditor> - <!-- <el-input type="textarea" v-model="role.description" placeholder="璇疯緭鍏ユ弿杩板唴瀹�200瀛椾互鍐�"></el-input> --> - </el-form-item> - <!-- 鎻愰啋鏂瑰紡 --> - <el-form-item class="optionItem" label="鎻愰啋鏂瑰紡:" prop="channelCode"> - <el-radio-group v-model="role.channelCode"> - <el-radio label="01">绔欏唴淇�</el-radio> - <el-radio label="02">閭欢</el-radio> - <el-radio label="03">鐭俊</el-radio> - </el-radio-group> - <span class="message-tip">(鐭俊鍙敤鏁�: 1000鏉�)</span> - </el-form-item> - <el-form-item> - <div class="optionBtn"> - <el-button type="primary" @click.native.prevent="handleSubmit(0)" class="btn save">淇濆瓨 - </el-button> - <el-button type="primary" @click.native.prevent="handleSubmit(1)" class="btn submit">鍙戝竷 - </el-button> - <el-button type="primary" @click.native.prevent="handleView" class="btn submit">棰勮 - </el-button> - <el-button class="btn cancel" @click.native.prevent="handleReset">閲嶇疆</el-button> - </div> - </el-form-item> - </el-form> - <!-- 鏂板鏍忕洰 --> - <el-dialog title="娣诲姞鏍忕洰" :visible.sync="dialogCreate" v-if="dialogCreate" width="60%" - :before-close="handleConfirmClose" append-to-body> - <MyColumnAdd @closeDialog="closeDialog"></MyColumnAdd> - </el-dialog> - <!-- 棰勮娑堟伅 --> - <el-dialog title="娑堟伅棰勮" :visible.sync="dialogView" v-if="dialogView" width="60%" - :before-close="handleConfirmClose" append-to-body> - <MyColView :info="info" @closeDialog="closeDialog"></MyColView> - </el-dialog> + <div class="createUser"> + <main> + <div class="mainContent"> + <el-form + ref="user" + label-width="140px" + autoComplete="on" + :model="role" + :rules="createRoleRules" + label-position="right" + :disabled="edit" + > + <!-- 鎻愰啋鏂瑰紡 --> + <el-form-item class="optionItem" label="鎻愰啋鏂瑰紡:" prop="channelCode" > + <el-radio-group v-model="role.channelCode"> + <el-radio label="01">绔欏唴淇�</el-radio> + <el-radio label="03">閭欢</el-radio> + </el-radio-group> + <span class="message-tip">(鐭俊鍙敤鏁�: 1000鏉�)</span> + </el-form-item> + <!-- 娑堟伅鏍忕洰 --> + <el-form-item + v-if="role.channelCode === '01'" + class="optionItem" + label="娑堟伅鏍忕洰:" + prop="messageType" + > + <div class="message-item"> + <div class="message-item__left"> + <el-select + v-model="role.messageType" + placeholder="璇烽�夋嫨娑堟伅鏍忕洰" + > + <el-option + v-for="item in colList" + :key="item.id" + :label="item.columnName" + :value="item.id" + > + </el-option> + </el-select> + </div> + <span class="message-add" @click="dialogCreate = true"> + 娣诲姞鏍忕洰</span + > </div> - </main> - </div> + </el-form-item> + <!-- 娑堟伅鏍囬 --> + <el-form-item class="optionItems" label="娑堟伅鏍囬:" prop="head"> + <div class="message-item__left"> + <el-input + v-model="role.head" + placeholder="璇烽�夋嫨娑堟伅鏍囬" + ></el-input> + </div> + </el-form-item> + <!-- 鎺ユ敹瀵硅薄 --> + <el-form-item class="optionItem" label="鎺ユ敹瀵硅薄:" prop="targetTo"> + <div class="message-item__left"> + <el-select v-model="role.targetTo" placeholder="璇烽�夋嫨鎺ユ敹瀵硅薄"> + <el-option :value="role.targetTo"> + <el-tree + ref="tree" + :data="departList" + :props="defaultProps" + show-checkbox + @check="handleCheck" + default-expand-all + :default-checked-keys="checkedList" + node-key="id" + > + </el-tree> + </el-option> + </el-select> + </div> + </el-form-item> + <!-- 娑堟伅鍐呭 --> + <el-form-item class="optionItem" label="娑堟伅鍐呭:" prop="body"> + <MyEditor ref="edit"></MyEditor> + </el-form-item> + <el-form-item> + <div class="optionBtn"> + <el-button + type="primary" + @click.native.prevent="handleSubmit(0)" + class="btn save" + v-if="this.type=='update'||this.type=='create'" + >淇濆瓨 + </el-button> + <el-button + type="primary" + @click.native.prevent="handleSubmit(1)" + class="btn submit" + v-if="this.type=='update'||this.type=='create'" + >鍙戝竷 + </el-button> + <el-button + type="primary" + @click.native.prevent="handleView" + class="btn submit" + v-if="this.type=='update'||this.type=='create'" + >棰勮 + </el-button> + <el-button class="btn cancel" @click.native.prevent="handleReset" v-if="this.type=='update'||this.type=='create'" + >閲嶇疆</el-button + > + </div> + </el-form-item> + </el-form> + <!-- 鏂板鏍忕洰 --> + <el-dialog + title="娣诲姞鏍忕洰" + :visible.sync="dialogCreate" + v-if="dialogCreate" + width="60%" + :before-close="handleConfirmClose" + append-to-body + > + <MyColumnAdd @closeDialog="closeDialog"></MyColumnAdd> + </el-dialog> + <!-- 棰勮娑堟伅 --> + <el-dialog + title="娑堟伅棰勮" + :visible.sync="dialogView" + v-if="dialogView" + width="60%" + :before-close="handleConfirmClose" + append-to-body + > + <MyColView :info="info" @closeDialog="closeDialog"></MyColView> + </el-dialog> + </div> + </main> + </div> </template> <script> -import MyEditor from '@/components/edit' -import MyColumnAdd from '@/views/operate/message/mycontrol/createUser' -import MyColView from '../messageView' +import MyEditor from "@/components/edit"; +import MyColumnAdd from "@/views/operate/message/mycontrol/createUser"; +import MyColView from "../messageView"; +import { sendMessage, updateMessage, getMessageById } from "@/api/operate/messageManagement"; + export default { - components: { MyEditor, MyColumnAdd,MyColView }, - data() { - const validateNickname = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欐秷鎭爮鐩�")); - } else { - callback(); + components: { MyEditor, MyColumnAdd, MyColView }, + props: ["type", "myDataRow"], + data() { + const validateEditor = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('璇疯緭鍏�')); + } + }; + return { + role: { + messageType: null, + head: "", + targetTo: "", + body: "", + channelCode: null, + }, + createRoleRules: { + messageType: [ + { + required: true, + trigger: ["blur", "change"], + message: "璇疯緭鍏ユ秷鎭爮鐩�", + }, + ], + head: [{ required: true, trigger: "blur", message: "璇烽�夋嫨娑堟伅鏍囬" }], + targetTo: [ + { required: true, trigger: "blur", message: "璇烽�夋嫨鎺ュ彈瀵硅薄" }, + ], + body: [ + { + required: true, + validator: validateEditor + }, + ], + }, + edit: false, + colList: [], + departList: [], + typeList: [], + dialogCreate: false, + dialogView: false, + defaultProps: { + children: "children", + label: "departName", + }, + checkedList: [], + tempNameArr: [], + info: {}, + sendUser: "", + }; + }, + created() { + this.getColumnList(); + this.getDepartList(); + this.getLoginUserInfo(); + if(this.type=="view"){ + this.edit=true; + } + if (this.type !== "create" && this.myDataRow) { + getMessageById(this.myDataRow.id) + .then(res => { + this.role = res; + if (res.targetTo) { + this.checkedList = res.targetTo.split(','); + this.role.targetTo = `${this.checkedList}浜篳; } - }; - const validatePass = (rule, value, callback) => { - if (!value) { - callback(); - } else { - callback(); - } - }; - const validateTruename = (rule, value, callback) => { - if (value.length !== 0) { - callback(); - } else { - callback(new Error('璇烽�夋嫨鎺ユ敹瀵硅薄')); - } - }; - return { - role: { - messageType: '', - head: '', - targetTo: '', - targetFrom: null, - body: '', - channelCode: '01', - }, - createRoleRules: { - messageType: [ - { required: true, trigger: "blur", validator: validateNickname }, - ], - head: [ - { required: false, trigger: "blur", validator: validatePass }, - ], - targetTo: [ - { required: false, trigger: "blur", validator: validateTruename }, - ], - }, - colList: [], - departList: [], - typeList: [], - dialogCreate: false, - dialogView: false, - defaultProps: { - children: 'children', - label: 'departName', - // disabled: function (data, node) { - // if (data.createTime) { - // return !data.leaf - // } - // } - }, - checkedList: [], - tempNameArr:[], - info:{}, - sendUser:"" + }) + .catch(err => this.$message.error(`${err}`)) + } + }, + mounted() { + if (this.type !== 'create') { + this.$refs.edit.editor.txt.append(this.myDataRow.body); + } + + }, + methods: { + // 鍏抽棴寮圭獥 + handleConfirmClose(done) { + this.$confirm("纭鍏抽棴?").then((_) => { + done(); + }); + }, + + // 鑾峰彇鏍忕洰 + async getColumnList() { + await this.$axios({ + method: "get", + url: "sccg/message_column/getShowColumn", + }).then((res) => { + this.colList = res.data; + }); + }, + // 鍏抽棴寮圭獥 + closeDialog({ flag, index }) { + this.dialogCreate = flag; + if (index === 1) { + // 閲嶆柊璁剧疆鏍忕洰 + this.getColumnList(); + } + }, + getType(){ + return this.type; + }, + // 鑾峰彇閮ㄩ棬鏍� + async getDepartList() { + await this.$axios({ + method: "get", + url: "sccg/depart/tree", + }).then((res) => { + res.data.forEach((item) => { + this.departList.push(this.setChildren(item)); + }); + }); + }, + + // 閫掑綊children + setChildren(obj) { + if (obj.children !== null) { + if (obj.children.length !== 0) { + obj.children.forEach((item) => { + return this.setChildren(item); + }); } - }, - created() { - this.setColumnList(); - this.setDepartList(); - this.getLoginUserInfo(); - }, - methods: { - // 鍏抽棴寮圭獥 - handleConfirmClose(done) { - this.$confirm('纭鍏抽棴?') - .then(_ => { - done(); - }) - }, - // 璁剧疆鏍忕洰 - async setColumnList() { - this.colList = await this.getColumnList(); - }, - // 鑾峰彇鏍忕洰 - async getColumnList() { - let arr; - await this.$axios({ - method: 'get', - url: 'sccg/message_column/getAllColumn' - }) - .then(res => { - console.log(res); - arr = res.data; - }) - return arr; - }, - // 鍏抽棴寮圭獥 - closeDialog({ flag, index }) { - this.dialogCreate = flag; - if (index === 1) { - // 閲嶆柊璁剧疆鏍忕洰 - this.setColumnList(); - } - }, - // 鑾峰彇閮ㄩ棬鏍� - async getDepartList() { - let arr - await this.$axios({ - method: 'get', - url: 'sccg/depart/tree' - }) - .then(res => { - arr = res.data - }) - return arr; - }, - // 璁剧疆閮ㄩ棬鏍� - async setDepartList() { - this.departList = await this.filterDepartList(); - }, - // 澶勭悊閮ㄩ棬鏍� - async filterDepartList() { - let arr = await this.getDepartList(); - const { setChildren } = this; - // console.log(setChildren); - arr.forEach(item => { - setChildren(item); - }) - return arr; - }, - // 閫掑綊children - setChildren(obj) { - if (obj.children !== null) { - if (obj.children.length !== 0) { - obj.children.forEach(item => { - return this.setChildren(item); - }) - } - } else { - if (obj.userInfoDTOS.length !== 0) { - obj.children = []; - obj.userInfoDTOS.forEach(item => { - obj.children.push({ id: item.userId, departName: item.username }) - }) - } - } - }, - // 閫変腑id - handleCheck(data, node) { - let arr = [],nameArr = [] - console.log(node.checkedNodes) - node.checkedNodes.forEach(item => { - if(!item.hasOwnProperty('departType')){ - arr.push(item.id) - nameArr.push(item.departName) - } - }) - this.checkedList = arr - this.tempNameArr = nameArr - console.log(this.tempNameArr) - this.role.targetTo = arr.length + '浜�' - }, - // 鏂板缓/淇濆瓨娑堟伅(1:鏂板缓,0淇濆瓨娑堟伅) - handleSubmit(mystatus) { - this.$refs.user.validate((valid) => { - if (valid) { - const { role, checkedList } = this; - console.log(checkedList); - this.$axios({ - method: 'post', - url: 'sccg/message/sendMessage', - data: { - body: role.body, - channelCode: `${role.channelCode}`, - head: role.head, - messageType: role.messageType, - sendTime: new Date(), - targetTo: checkedList.join(','), - targetFrom: `${role.targetFrom}`, - status: mystatus, - } - }) - .then(res => { - if (res.code === 200) { - this.$message({ - type: 'success', - message: mystatus === 1 ? '鍙戦�佹垚鍔�' : '淇濆瓨鎴愬姛', - }) - this.$emit('closeMyDialog', { flag: false, index: 1 }); - } - }) - } else { - return false; - } - }) - }, - // 鑾峰緱娑堟伅浣� - getMyBody(obj) { - console.log(obj); - this.role.body = obj; - }, - // 閲嶇疆琛ㄥ崟 - handleReset() { - this.$refs.edit.editor.txt.clear(); - // this.$refs.edit.wangEditor.txt.html('<p><br></p>') - this.setDepartList(); - this.$refs.user.resetFields(); - }, - // 鑾峰彇褰撳墠鐧诲綍鐢ㄦ埛淇℃伅 - getLoginUserInfo() { - const name = sessionStorage.getItem('name'); - this.$axios({ - method: 'get', - url: 'sccg/admin/info?name=' + name, - }) - .then(res => { - this.role.targetFrom = res.data.userId - this.sendUser = res.data.username - }) - }, - // 娑堟伅棰勮 - handleView() { - this.$refs.user.validate((valid) => { - if (valid) { - const { role,getColText,tempNameArr,sendUser } = this - this.dialogView = true; - let info = {} - // 鑾峰緱鏍忕洰娑堟伅 - info.channelCode = role.channelCode === '01'? '绔欏唴淇�': role.channelCode === '02' ? '閭欢':'鐭俊' - info.messageType = getColText(role.messageType) - info.body = role.body - info.head = role.head - info.targetTo = tempNameArr - info.targetFrom = sendUser - this.info = info - } else { - return false - } - }) - }, - // 鑾峰緱鏍忕洰娑堟伅 - getColText(id){ - console.log(id) - const {colList} = this - let str = '' - colList.forEach(item=>{ - item.id === id ? str = item.columnName : '' - }) - return str + } else { + if (obj.userInfoDTOS.length !== 0) { + obj.children = []; + obj.userInfoDTOS.forEach((item) => { + obj.children.push({ id: item.userId, departName: item.username }); + }); } + } + return obj; }, - props: ['closeMyDialog'] -} + + // 閫変腑id + handleCheck(data, node) { + const checkedNodes = node.checkedNodes.filter(item => !item.children); + this.checkedList = checkedNodes.map(item => item.id); + this.tempNameArr = checkedNodes.map(item => item.departName); + this.role.targetTo = this.checkedList.length ? this.checkedList.length + "浜�" : null; + }, + + // 鏂板缓/淇濆瓨娑堟伅(1:鏂板缓,0淇濆瓨娑堟伅) + handleSubmit(mystatus) { + this.role.body = this.$refs.edit.editor.txt.html(); + this.$refs.user.validate((valid) => { + if (valid) { + const { body, head, messageType, channelCode } = this.role; + const params = { + body, + head, + messageType, + channelCode: `${channelCode}`, + sendTime: new Date(), + targetTo: this.checkedList.join(","), + status: mystatus, + }; + if (this.role.channelCode === '03') { + delete params.messageType; + } + if (this.type === "create") { + sendMessage(params) + .then(() => { + this.$emit("closeMyDialog"); + this.$message({ type: "success", message: "鎿嶄綔鎴愬姛" }); + }) + .catch((err) => + this.$message({ + type: "error", + message: err.data || err.message, + }) + ); + } else { + updateMessage({ id: this.myDataRow.id, ...params }) + .then(() => { + this.$emit("closeMyDialog"); + this.$message({ type: "success", message: "鎿嶄綔鎴愬姛" }); + }) + .catch((err) => + this.$message({ + type: "error", + message: err.data || err.message, + }) + ); + } + } else { + this.$message.error({ type: "warning", message: "璇锋鏌ュ繀濉」" }); + } + }); + }, + + // 閲嶇疆琛ㄥ崟 + handleReset() { + this.$refs.edit.editor.txt.clear(); + this.$refs.user.resetFields(); + }, + + // 鑾峰彇褰撳墠鐧诲綍鐢ㄦ埛淇℃伅 + getLoginUserInfo() { + const name = sessionStorage.getItem("name"); + this.$axios({ + method: "get", + url: "sccg/admin/info?name=" + name, + }).then((res) => { + this.role.targetFrom = res.data.userId; + this.sendUser = res.data.username; + }); + }, + + // 娑堟伅棰勮 + handleView() { + this.role.body = this.$refs.edit.editor.txt.html(); + this.$refs.user.validate((valid) => { + if (valid) { + const { body, head, channelCode } = this.role; + this.dialogView = true; + this.info = { + body, + head, + channelCode: + channelCode === "01" + ? "绔欏唴淇�" + : channelCode === "03" + ? "閭欢" + : "鐭俊", + messageType: this.role.messageType, + targetTo: this.tempNameArr, + targetFrom: this.sendUser + }; + } else { + this.$message({ type: "warning", message: "璇锋鏌ュ繀濉」" }); + } + }); + } + }, +}; </script> <style lang="scss" scoped> .createUser { - border-radius: 1px; + border-radius: 1px; + background-color: #09152f; + + main { + text-align: left; + padding: 0 55px; background-color: #09152f; - main { - text-align: left; - padding: 0 55px; + .mainContent { + display: flex; + justify-content: center; + padding-top: 50px; + &:deep(.el-dialog__title) { + color: #4b9bb7; + } + &::v-deep .el-form-item__label { + color: #4b9bb7; + } + + &::v-deep .el-input__inner { + width: 400px; background-color: #09152f; - padding-bottom: 50px; + border: 1px solid #17324c; + } - .mainContent { - display: flex; - justify-content: center; - padding-top: 50px; - &:deep(.el-dialog__title) { - color: #4b9bb7; - } - &::v-deep .el-form-item__label { - color: #4b9bb7; - } + .message-item__left { + width: 400px; + } - &::v-deep .el-input__inner { - width: 400px; - background-color: #09152f; - border: 1px solid #17324c; - } - - .message-item__left { - width: 400px; - } - - .message-add { - &:hover { - cursor: pointer; - } - } - - .el-form-item__content :deep(.el-select) { - width: 400px; - } - - :deep(.el-input) { - width: 400px; - } - - .message-item { - display: flex; - - span { - margin-left: 20px; - color: #4b9bb7; - } - } - - .message-tip { - margin-left: 20px; - } - - :deep(.el-input--suffix) { - width: 400px; - } - - &::v-deep .el-textarea__inner { - background-color: #09152f; - border: 1px solid #17324c; - } - - .el-form-item__content { - width: 400px; - - .el-select { - width: 100%; - } - } - - .optionHandleSp { - display: flex; - - .areaNumber, - .moreNumber { - flex: 1; - } - - .telNumber { - flex: 2; - } - } - - .optionBtn { - display: flex; - margin-top: 20px; - - .btn { - padding: 12px 50px; - } - } - + .message-add { + &:hover { + cursor: pointer; } + } + + .el-form-item__content :deep(.el-select) { + width: 400px; + } + + :deep(.el-input) { + width: 400px; + } + + .message-item { + display: flex; + + span { + margin-left: 20px; + color: #4b9bb7; + } + } + + .message-tip { + margin-left: 20px; + } + + :deep(.el-input--suffix) { + width: 400px; + } + + &::v-deep .el-textarea__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + + .el-form-item__content { + width: 400px; + + .el-select { + width: 100%; + } + } + + .optionHandleSp { + display: flex; + + .areaNumber, + .moreNumber { + flex: 1; + } + + .telNumber { + flex: 2; + } + } + + .optionBtn { + display: flex; + margin-top: 20px; + + .btn { + padding: 12px 50px; + } + } } + } } </style> \ No newline at end of file -- Gitblit v1.8.0