Commit 26ca97d2f62075c447e20e61808bacb3ec9aa1a4
1 parent
0e75a67f
mp：初始化【自动回复】菜单
Showing
2 changed files
with
356 additions
and
1 deletions
yudao-ui-admin/src/views/mp/autoReply/index.vue
0 → 100644
| 1 | +<!-- | ||
| 2 | +MIT License | ||
| 3 | + | ||
| 4 | +Copyright (c) 2020 www.joolun.com | ||
| 5 | + | ||
| 6 | +Permission is hereby granted, free of charge, to any person obtaining a copy | ||
| 7 | +of this software and associated documentation files (the "Software"), to deal | ||
| 8 | +in the Software without restriction, including without limitation the rights | ||
| 9 | +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell | ||
| 10 | +copies of the Software, and to permit persons to whom the Software is | ||
| 11 | +furnished to do so, subject to the following conditions: | ||
| 12 | + | ||
| 13 | +The above copyright notice and this permission notice shall be included in all | ||
| 14 | +copies or substantial portions of the Software. | ||
| 15 | + | ||
| 16 | +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR | ||
| 17 | +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, | ||
| 18 | +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE | ||
| 19 | +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER | ||
| 20 | +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, | ||
| 21 | +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE | ||
| 22 | +SOFTWARE. | ||
| 23 | + 芋道源码： | ||
| 24 | + ① 移除 avue 框架，使用 element-ui 重写 | ||
| 25 | +--> | ||
| 26 | +<template> | ||
| 27 | + <div class="app-container"> | ||
| 28 | + <!-- 搜索工作栏 --> | ||
| 29 | + <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> | ||
| 30 | + <el-form-item label="公众号" prop="accountId"> | ||
| 31 | + <el-select v-model="queryParams.accountId" placeholder="请选择公众号"> | ||
| 32 | + <el-option v-for="item in accounts" :key="parseInt(item.id)" :label="item.name" :value="parseInt(item.id)" /> | ||
| 33 | + </el-select> | ||
| 34 | + </el-form-item> | ||
| 35 | + <el-form-item> | ||
| 36 | + <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button> | ||
| 37 | + <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button> | ||
| 38 | + </el-form-item> | ||
| 39 | + </el-form> | ||
| 40 | + | ||
| 41 | + <!-- tab 切换 --> | ||
| 42 | + <el-tabs v-model="type" @tab-click="handleClick"> | ||
| 43 | + <!-- 操作工具栏 --> | ||
| 44 | + <el-row :gutter="10" class="mb8"> | ||
| 45 | + <el-col :span="1.5"> | ||
| 46 | + <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" | ||
| 47 | + v-hasPermi="['mp:auto-reply:create']" v-if="list.length <= 0">新增 | ||
| 48 | + </el-button> | ||
| 49 | + </el-col> | ||
| 50 | + <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> | ||
| 51 | + </el-row> | ||
| 52 | + <!-- 列表 --> | ||
| 53 | + <el-tab-pane name="1"> | ||
| 54 | + <span slot="label"><i class="el-icon-star-off"></i> 关注时回复</span> | ||
| 55 | + <el-table v-loading="loading" :data="list"> | ||
| 56 | + <el-table-column label="编号" align="center" prop="id"/> | ||
| 57 | + <el-table-column label="回复消息类型" align="center" prop="responseMessageType"/> | ||
| 58 | + <el-table-column label="创建时间" align="center" prop="createTime" width="180"> | ||
| 59 | + <template slot-scope="scope"> | ||
| 60 | + <span>{{ parseTime(scope.row.createTime) }}</span> | ||
| 61 | + </template> | ||
| 62 | + </el-table-column> | ||
| 63 | + <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> | ||
| 64 | + <template slot-scope="scope"> | ||
| 65 | + <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" | ||
| 66 | + v-hasPermi="['mp:auto-reply:update']">修改 | ||
| 67 | + </el-button> | ||
| 68 | + <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" | ||
| 69 | + v-hasPermi="['mp:auto-reply:delete']">删除 | ||
| 70 | + </el-button> | ||
| 71 | + </template> | ||
| 72 | + </el-table-column> | ||
| 73 | + </el-table> | ||
| 74 | + </el-tab-pane> | ||
| 75 | + <el-tab-pane name="2"> | ||
| 76 | + <span slot="label"><i class="el-icon-chat-line-round"></i> 消息回复</span> | ||
| 77 | + <el-table v-loading="loading" :data="list"> | ||
| 78 | + <el-table-column label="编号" align="center" prop="id"/> | ||
| 79 | + <el-table-column label="请求消息类型" align="center" prop="requestMessageType"/> | ||
| 80 | + <el-table-column label="回复消息类型" align="center" prop="responseMessageType"/> | ||
| 81 | + <el-table-column label="创建时间" align="center" prop="createTime" width="180"> | ||
| 82 | + <template slot-scope="scope"> | ||
| 83 | + <span>{{ parseTime(scope.row.createTime) }}</span> | ||
| 84 | + </template> | ||
| 85 | + </el-table-column> | ||
| 86 | + <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> | ||
| 87 | + <template slot-scope="scope"> | ||
| 88 | + <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" | ||
| 89 | + v-hasPermi="['mp:auto-reply:update']">修改 | ||
| 90 | + </el-button> | ||
| 91 | + <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" | ||
| 92 | + v-hasPermi="['mp:auto-reply:delete']">删除 | ||
| 93 | + </el-button> | ||
| 94 | + </template> | ||
| 95 | + </el-table-column> | ||
| 96 | + </el-table> | ||
| 97 | + </el-tab-pane> | ||
| 98 | + <el-tab-pane name="3"> | ||
| 99 | + <span slot="label"><i class="el-icon-news"></i> 关键词回复</span> | ||
| 100 | + <el-table v-loading="loading" :data="list"> | ||
| 101 | + <el-table-column label="编号" align="center" prop="id"/> | ||
| 102 | + <el-table-column label="关键词" align="center" prop="requestKeyword"/> | ||
| 103 | + <el-table-column label="匹配类型" align="center" prop="requestMatch"/> | ||
| 104 | + <el-table-column label="回复消息类型" align="center" prop="responseMessageType"/> | ||
| 105 | + <el-table-column label="创建时间" align="center" prop="createTime" width="180"> | ||
| 106 | + <template slot-scope="scope"> | ||
| 107 | + <span>{{ parseTime(scope.row.createTime) }}</span> | ||
| 108 | + </template> | ||
| 109 | + </el-table-column> | ||
| 110 | + <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> | ||
| 111 | + <template slot-scope="scope"> | ||
| 112 | + <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" | ||
| 113 | + v-hasPermi="['mp:auto-reply:update']">修改 | ||
| 114 | + </el-button> | ||
| 115 | + <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" | ||
| 116 | + v-hasPermi="['mp:auto-reply:delete']">删除 | ||
| 117 | + </el-button> | ||
| 118 | + </template> | ||
| 119 | + </el-table-column> | ||
| 120 | + </el-table> | ||
| 121 | + </el-tab-pane> | ||
| 122 | + </el-tabs> | ||
| 123 | + | ||
| 124 | + <el-dialog :title="handleType === 'add' ? '新增回复消息' : '修改回复消息'" :visible.sync="dialog1Visible" width="50%"> | ||
| 125 | + <el-form label-width="100px"> | ||
| 126 | + <el-form-item label="请求消息类型" v-if="type == '2'"> | ||
| 127 | + <el-select v-model="objData.reqType" placeholder="请选择"> | ||
| 128 | + <el-option | ||
| 129 | + v-for="item in dictData.get('wx_req_type')" | ||
| 130 | + :key="item.value" | ||
| 131 | + :label="item.label" | ||
| 132 | + :value="item.value" | ||
| 133 | + :disabled="item.disabled" | ||
| 134 | + v-if="item.value !== 'event'"> | ||
| 135 | + </el-option> | ||
| 136 | + </el-select> | ||
| 137 | + </el-form-item> | ||
| 138 | + <el-form-item label="匹配类型" v-if="type === '3'"> | ||
| 139 | + <el-select v-model="objData.repMate" placeholder="请选择" style="width: 100px"> | ||
| 140 | + <el-option | ||
| 141 | + v-for="item in dictData.get('wx_rep_mate')" | ||
| 142 | + :key="item.value" | ||
| 143 | + :label="item.label" | ||
| 144 | + :value="item.value"> | ||
| 145 | + </el-option> | ||
| 146 | + </el-select> | ||
| 147 | + </el-form-item> | ||
| 148 | + <el-form-item label="关键词" v-if="type === '3'"> | ||
| 149 | + <el-input placeholder="请输入内容" v-model="objData.reqKey" clearable> </el-input> | ||
| 150 | + </el-form-item> | ||
| 151 | + <el-form-item label="回复消息"> | ||
| 152 | + <WxReplySelect :objData="objData" v-if="hackResetWxReplySelect"></WxReplySelect> | ||
| 153 | + </el-form-item> | ||
| 154 | + </el-form> | ||
| 155 | + <span slot="footer" class="dialog-footer"> | ||
| 156 | + <el-button @click="dialog1Visible = false">取 消</el-button> | ||
| 157 | + <el-button type="primary" @click="handleSubmit">确 定</el-button> | ||
| 158 | + </span> | ||
| 159 | + </el-dialog> | ||
| 160 | + </div> | ||
| 161 | +</template> | ||
| 162 | + | ||
| 163 | +<script> | ||
| 164 | +// import { getPage, getObj, addObj, putObj, delObj } from '@/api/wxmp/wxautoreply' | ||
| 165 | +// import { tableOption1, tableOption2, tableOption3 } from '@/const/crud/wxmp/wxautoreply' | ||
| 166 | +import WxReplySelect from '@/views/mp/components/wx-reply/main.vue' | ||
| 167 | +import { getSimpleAccounts } from "@/api/mp/account"; | ||
| 168 | +import { getTagPage } from "@/api/mp/tag"; | ||
| 169 | + | ||
| 170 | +export default { | ||
| 171 | + name: 'mpAutoReply', | ||
| 172 | + components: { | ||
| 173 | + WxReplySelect | ||
| 174 | + }, | ||
| 175 | + data() { | ||
| 176 | + return { | ||
| 177 | + // tab 类型（1、关注时回复；2、消息回复；3、关键词回复） | ||
| 178 | + type:'1', | ||
| 179 | + // 遮罩层 | ||
| 180 | + loading: true, | ||
| 181 | + // 显示搜索条件 | ||
| 182 | + showSearch: true, | ||
| 183 | + // 总条数 | ||
| 184 | + total: 0, | ||
| 185 | + // 自动回复列表 | ||
| 186 | + list: [], | ||
| 187 | + // 查询参数 | ||
| 188 | + queryParams: { | ||
| 189 | + pageNo: 1, | ||
| 190 | + pageSize: 10, | ||
| 191 | + accountId: undefined, | ||
| 192 | + }, | ||
| 193 | + | ||
| 194 | + dialog1Visible:false, | ||
| 195 | + objData:{ | ||
| 196 | + repType : 'text' | ||
| 197 | + }, | ||
| 198 | + handleType: null, | ||
| 199 | + dictData: new Map(), | ||
| 200 | + hackResetWxReplySelect: false, | ||
| 201 | + | ||
| 202 | + // 公众号账号列表 | ||
| 203 | + accounts: [] | ||
| 204 | + } | ||
| 205 | + }, | ||
| 206 | + created() { | ||
| 207 | + getSimpleAccounts().then(response => { | ||
| 208 | + this.accounts = response.data; | ||
| 209 | + // 默认选中第一个 | ||
| 210 | + if (this.accounts.length > 0) { | ||
| 211 | + this.queryParams.accountId = this.accounts[0].id; | ||
| 212 | + } | ||
| 213 | + // 加载数据 | ||
| 214 | + this.getList(); | ||
| 215 | + }) | ||
| 216 | + | ||
| 217 | + // this.getPage(this.page) | ||
| 218 | + this.dictData.set('wx_rep_mate',[{ | ||
| 219 | + value: '1', | ||
| 220 | + label: '全匹配' | ||
| 221 | + },{ | ||
| 222 | + value: '2', | ||
| 223 | + label: '半匹配' | ||
| 224 | + }]) | ||
| 225 | + this.dictData.set('wx_req_type',[{ | ||
| 226 | + value: 'text', | ||
| 227 | + label: '文本' | ||
| 228 | + },{ | ||
| 229 | + value: 'image', | ||
| 230 | + label: '图片' | ||
| 231 | + },{ | ||
| 232 | + value: 'voice', | ||
| 233 | + label: '语音' | ||
| 234 | + },{ | ||
| 235 | + value: 'video', | ||
| 236 | + label: '视频' | ||
| 237 | + },{ | ||
| 238 | + value: 'shortvideo', | ||
| 239 | + label: '小视频' | ||
| 240 | + },{ | ||
| 241 | + value: 'location', | ||
| 242 | + label: '地理位置' | ||
| 243 | + },{ | ||
| 244 | + value: 'link', | ||
| 245 | + label: '链接消息' | ||
| 246 | + },{ | ||
| 247 | + value: 'event', | ||
| 248 | + label: '事件推送' | ||
| 249 | + }]) | ||
| 250 | + }, | ||
| 251 | + methods: { | ||
| 252 | + /** 查询列表 */ | ||
| 253 | + getList() { | ||
| 254 | + // 如果没有选中公众号账号，则进行提示。 | ||
| 255 | + if (!this.queryParams.accountId) { | ||
| 256 | + this.$message.error('未选中公众号，无法查询标签') | ||
| 257 | + return false | ||
| 258 | + } | ||
| 259 | + | ||
| 260 | + this.loading = false | ||
| 261 | + // 处理查询参数 | ||
| 262 | + let params = {...this.queryParams} | ||
| 263 | + // 执行查询 | ||
| 264 | + getTagPage(params).then(response => { | ||
| 265 | + this.list = response.data.list | ||
| 266 | + this.total = response.data.total | ||
| 267 | + this.loading = false | ||
| 268 | + }) | ||
| 269 | + }, | ||
| 270 | + /** 搜索按钮操作 */ | ||
| 271 | + handleQuery() { | ||
| 272 | + this.queryParams.pageNo = 1 | ||
| 273 | + this.getList() | ||
| 274 | + }, | ||
| 275 | + /** 重置按钮操作 */ | ||
| 276 | + resetQuery() { | ||
| 277 | + this.resetForm('queryForm') | ||
| 278 | + // 默认选中第一个 | ||
| 279 | + if (this.accounts.length > 0) { | ||
| 280 | + this.queryParams.accountId = this.accounts[0].id; | ||
| 281 | + } | ||
| 282 | + this.handleQuery() | ||
| 283 | + }, | ||
| 284 | + | ||
| 285 | + handleAdd(){ | ||
| 286 | + this.hackResetWxReplySelect = false//销毁组件 | ||
| 287 | + this.$nextTick(() => { | ||
| 288 | + this.hackResetWxReplySelect = true//重建组件 | ||
| 289 | + }) | ||
| 290 | + this.handleType = 'add' | ||
| 291 | + this.dialog1Visible = true | ||
| 292 | + this.objData = { | ||
| 293 | + repType : 'text' | ||
| 294 | + } | ||
| 295 | + }, | ||
| 296 | + handleEdit(row){ | ||
| 297 | + this.hackResetWxReplySelect = false//销毁组件 | ||
| 298 | + this.$nextTick(() => { | ||
| 299 | + this.hackResetWxReplySelect = true//重建组件 | ||
| 300 | + }) | ||
| 301 | + this.handleType = 'edit' | ||
| 302 | + this.dialog1Visible = true | ||
| 303 | + this.objData = Object.assign({}, row) | ||
| 304 | + }, | ||
| 305 | + handleClick(tab, event){ | ||
| 306 | + this.tableData = [] | ||
| 307 | + this.page.currentPage = 1 | ||
| 308 | + this.type = tab.name | ||
| 309 | + this.getPage(this.page) | ||
| 310 | + }, | ||
| 311 | + handleDel: function(row, index) { | ||
| 312 | + var _this = this | ||
| 313 | + this.$confirm('是否确认删除此数据', '提示', { | ||
| 314 | + confirmButtonText: '确定', | ||
| 315 | + cancelButtonText: '取消', | ||
| 316 | + type: 'warning' | ||
| 317 | + }).then(function() { | ||
| 318 | + return delObj(row.id) | ||
| 319 | + }).then(data => { | ||
| 320 | + _this.$message({ | ||
| 321 | + showClose: true, | ||
| 322 | + message: '删除成功', | ||
| 323 | + type: 'success' | ||
| 324 | + }) | ||
| 325 | + this.getPage(this.page) | ||
| 326 | + }).catch(function(err) { }) | ||
| 327 | + }, | ||
| 328 | + handleSubmit(row){ | ||
| 329 | + if(this.handleType === 'add'){ | ||
| 330 | + addObj(Object.assign({ | ||
| 331 | + type:this.type | ||
| 332 | + }, this.objData)).then(data => { | ||
| 333 | + this.$message({ | ||
| 334 | + showClose: true, | ||
| 335 | + message: '添加成功', | ||
| 336 | + type: 'success' | ||
| 337 | + }) | ||
| 338 | + this.getPage(this.page) | ||
| 339 | + this.dialog1Visible = false | ||
| 340 | + }) | ||
| 341 | + } | ||
| 342 | + if(this.handleType === 'edit'){ | ||
| 343 | + putObj(this.objData).then(data => { | ||
| 344 | + this.$message({ | ||
| 345 | + showClose: true, | ||
| 346 | + message: '修改成功', | ||
| 347 | + type: 'success' | ||
| 348 | + }) | ||
| 349 | + this.getPage(this.page) | ||
| 350 | + this.dialog1Visible = false | ||
| 351 | + }) | ||
| 352 | + } | ||
| 353 | + }, | ||
| 354 | + } | ||
| 355 | +} | ||
| 356 | +</script> |
yudao-ui-admin/src/views/mp/tag/index.vue
| 1 | <template> | 1 | <template> |
| 2 | <div class="app-container"> | 2 | <div class="app-container"> |
| 3 | - | ||
| 4 | <!-- 搜索工作栏 --> | 3 | <!-- 搜索工作栏 --> |
| 5 | <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> | 4 | <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> |
| 6 | <el-form-item label="公众号" prop="accountId"> | 5 | <el-form-item label="公众号" prop="accountId"> |