From 5cd763edc85f3b14bc98af906828521d65276f48 Mon Sep 17 00:00:00 2001 From: “dzb” <2632970487@qq.com> Date: 星期四, 13 十月 2022 17:57:11 +0800 Subject: [PATCH] 修改系统框架、消息管理新增 --- src/views/operate/message/myIndex/createUser/index.vue | 188 ++++++++++++++++++++++++++++++++++++++-------- 1 files changed, 155 insertions(+), 33 deletions(-) diff --git a/src/views/operate/message/myIndex/createUser/index.vue b/src/views/operate/message/myIndex/createUser/index.vue index 3b22823..aff2598 100644 --- a/src/views/operate/message/myIndex/createUser/index.vue +++ b/src/views/operate/message/myIndex/createUser/index.vue @@ -7,24 +7,33 @@ <!-- 娑堟伅鏍忕洰 --> <el-form-item class="optionItem" label="娑堟伅鏍忕洰:" prop="messageType"> <div class="message-item"> - <el-input v-model="role.messageType" placeholder="璇峰~鍐欐秷鎭爮鐩�"></el-input> - <span>娣诲姞鏍忕洰</span> + <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"> - <el-select v-model="role.head" placeholder="璇烽�夋嫨娑堟伅鏍囬"> - <el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id"> - </el-option> - </el-select> + <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"> - <el-select v-model="role.targetTo" placeholder="璇烽�夋嫨鎺ユ敹瀵硅薄"> - <el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id"> - </el-option> - </el-select> - <!-- <el-input type="textarea" v-model="role.description" placeholder="璇疯緭鍏ユ弿杩板唴瀹�200瀛椾互鍐�"></el-input> --> + <div class="message-item__left"> + <el-select v-model="role.targetTo" multiple :placeholder="checkNum"> + <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"> @@ -33,14 +42,12 @@ </el-form-item> <!-- 鎻愰啋鏂瑰紡 --> <el-form-item class="optionItem" label="鎻愰啋鏂瑰紡:" prop="channelCode"> - <div class="message-item"> - <el-radio-group v-model="role.channelCode"> - <el-radio :label="1">绔欏唴淇�</el-radio> - <el-radio :label="2">閭欢</el-radio> - <el-radio :label="3">鐭俊</el-radio> - </el-radio-group> - <span class="message-tip">(鐭俊鍙敤鏁�: 1000鏉�)</span> - </div> + <el-radio-group v-model="role.channelCode"> + <el-radio :label="1">绔欏唴淇�</el-radio> + <el-radio :label="2">閭欢</el-radio> + <el-radio :label="3">鐭俊</el-radio> + </el-radio-group> + <span class="message-tip">(鐭俊鍙敤鏁�: 1000鏉�)</span> </el-form-item> <el-form-item> <div class="optionBtn"> @@ -54,15 +61,20 @@ </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> </div> </main> </div> </template> <script> import MyEditor from '@/components/edit' +import MyColumnAdd from '@/views/operate/message/mycontrol/createUser' export default { - components: { MyEditor }, + components: { MyEditor, MyColumnAdd }, data() { const validateNickname = (rule, value, callback) => { if (!value) { @@ -87,11 +99,11 @@ }; return { role: { - messageType:'', - head:'', - targetTo:'', - body:'', - channelCode:1 + messageType: '', + head: '', + targetTo: '', + body: '', + channelCode: 1, }, createRoleRules: { name: [ @@ -104,12 +116,112 @@ { required: false, trigger: "blur", validator: validateTruename }, ], }, + colList: [], + departList: [], + checkNum: '璇烽�夋嫨鎺ユ敹瀵硅薄', typeList: [], + dialogCreate: false, + defaultProps: { + children: 'children', + label: 'departName', + disabled: function (data, node) { + if (data.createTime) { + return !data.leaf + } + } + }, } }, created() { + this.setColumnList(); + this.setDepartList(); }, 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) { + console.log(node.checkedKeys); + // this.checkList = node.checkedKeys; + // if(node.checkedKeys.length === 1){ + // this.role.targetTo = data.departName; + // } + // let per = node.checkedKeys.length; + // per ===0 ? this.checkNum="璇烽�夋嫨鎺ユ敹瀵硅薄" : this.checkNum = ''+per; + } }, props: [''] } @@ -140,19 +252,33 @@ 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){ + + :deep(.el-input) { width: 400px; } - .message-item{ + + .message-item { display: flex; - span{ + + span { margin-left: 20px; color: #4b9bb7; } } + .message-tip { margin-left: 20px; } @@ -197,10 +323,6 @@ } } - } - :deep(.el-select-dropdown){ - width: 400px; - min-width: 400px !important; } } </style> \ No newline at end of file -- Gitblit v1.8.0