| 1 | <template> | 1 | <template> | 
| 2 | -    <div>消息队列</div> | 2 | +    <el-container> | 
|  |  | 3 | +        <el-main> | 
|  |  | 4 | +            <el-card style="background-color: #F5F7FA"> | 
|  |  | 5 | +                <!-- 搜素区域 --> | 
|  |  | 6 | +                <div> | 
|  |  | 7 | +                    <el-row :gutter="24"> | 
|  |  | 8 | +                        <el-col :span="4"> | 
|  |  | 9 | +                            <el-input v-model="queue_queryInfo.queueName" prefix-icon="el-icon-search" | 
|  |  | 10 | +                                      size="medium" | 
|  |  | 11 | +                                      placeholder="队列名称" clearable style="width:180px"></el-input> | 
|  |  | 12 | +                        </el-col> | 
|  |  | 13 | +                        <el-col :span="4"> | 
|  |  | 14 | +                            <el-cascader | 
|  |  | 15 | +                                    style="width:180px" size="medium" | 
|  |  | 16 | +                                    v-model="queue_queryInfo.virtualHostId" | 
|  |  | 17 | +                                    :options="queue_config.cascade.server_hostList" | 
|  |  | 18 | +                                    :show-all-levels="false" | 
|  |  | 19 | +                                    :change-on-select="false" | 
|  |  | 20 | +                                    clearable | 
|  |  | 21 | +                                    @change="cascadeQueryChange" | 
|  |  | 22 | +                                    :props="queue_config.cascade.defaultParams" | 
|  |  | 23 | +                                    placeholder="请选择所属虚拟主机"></el-cascader> | 
|  |  | 24 | +                        </el-col> | 
|  |  | 25 | +                        <el-col :span="8"> | 
|  |  | 26 | +                            <el-button type="success" style="width:150px" size="medium" @click="queue_getList"> | 
|  |  | 27 | +                                查询交换机 | 
|  |  | 28 | +                            </el-button> | 
|  |  | 29 | +                            <el-button type="primary" style="width:150px" size="medium" @click="queue_toAddDialog"> | 
|  |  | 30 | +                                添加交换机 | 
|  |  | 31 | +                            </el-button> | 
|  |  | 32 | +                        </el-col> | 
|  |  | 33 | +                    </el-row> | 
|  |  | 34 | +                </div> | 
|  |  | 35 | + | 
|  |  | 36 | +                <!-- 列表区域 --> | 
|  |  | 37 | +                <div style="margin-top: 20px;"> | 
|  |  | 38 | +                    <el-table :data="queue_page.queueList" border v-loading="queue_loading.listLoading" | 
|  |  | 39 | +                              @selection-change="queue_selectChange" | 
|  |  | 40 | +                              element-loading-text="获取队列列表,拼命加载中"> | 
|  |  | 41 | +                        <el-table-column type="selection" width="55" align="center"></el-table-column> | 
|  |  | 42 | +                        <el-table-column type="index" align="center"></el-table-column> | 
|  |  | 43 | +                        <el-table-column label="队列名称" prop="queueName" align="center" | 
|  |  | 44 | +                                         width="220"></el-table-column> | 
|  |  | 45 | +                        <el-table-column label="所属虚拟主机" prop="virtualHost.virtualHostName" align="center" | 
|  |  | 46 | +                                         width="220"></el-table-column> | 
|  |  | 47 | +                        <el-table-column label="是否持久化" prop="durability" align="center" width="145"> | 
|  |  | 48 | +                            <template slot-scope="scope"> | 
|  |  | 49 | +                                <span v-if="scope.row.durability ===false">否</span> | 
|  |  | 50 | +                                <span v-if="scope.row.durability ===true">是</span> | 
|  |  | 51 | +                            </template> | 
|  |  | 52 | +                        </el-table-column> | 
|  |  | 53 | +                        <el-table-column label="是否自动删除" prop="autoDelete" align="center" width="145"> | 
|  |  | 54 | +                            <template slot-scope="scope"> | 
|  |  | 55 | +                                <span v-if="scope.row.autoDelete ===false">否</span> | 
|  |  | 56 | +                                <span v-if="scope.row.autoDelete ===true">是</span> | 
|  |  | 57 | +                            </template> | 
|  |  | 58 | +                        </el-table-column> | 
|  |  | 59 | +                        <el-table-column label="扩展参数" prop="arguments" align="center" width="200"> | 
|  |  | 60 | +                        </el-table-column> | 
|  |  | 61 | +                        <el-table-column label="相关描述" prop="description" align="center" width="280"></el-table-column> | 
|  |  | 62 | +                        <!-- fixed="right" --> | 
|  |  | 63 | +                        <el-table-column label="操作" width="225px" align="center" fixed="right"> | 
|  |  | 64 | +                            <template slot-scope="scope"> | 
|  |  | 65 | +                                <!-- 编辑按钮--> | 
|  |  | 66 | +                                <el-tooltip effect="dark" content="编辑" placement="top-start" :enterable="false"> | 
|  |  | 67 | +                                    <el-button type="primary" icon="el-icon-edit" size="mini" | 
|  |  | 68 | +                                               @click="queue_toEditDialog(scope.$index,scope.row)">编辑 | 
|  |  | 69 | +                                    </el-button> | 
|  |  | 70 | +                                </el-tooltip> | 
|  |  | 71 | + | 
|  |  | 72 | +                                <!-- 删除按钮--> | 
|  |  | 73 | +                                <el-tooltip effect="dark" content="删除" placement="top-start" :enterable="false"> | 
|  |  | 74 | +                                    <el-button type="danger" icon="el-icon-delete" size="mini" | 
|  |  | 75 | +                                               :loading="queue_loading.delLoading" | 
|  |  | 76 | +                                               @click="queue_remove(scope.$index,scope.row)">删除 | 
|  |  | 77 | +                                    </el-button> | 
|  |  | 78 | +                                </el-tooltip> | 
|  |  | 79 | +                            </template> | 
|  |  | 80 | +                        </el-table-column> | 
|  |  | 81 | +                    </el-table> | 
|  |  | 82 | +                </div> | 
|  |  | 83 | +                <!--分页区域--> | 
|  |  | 84 | +                <div style="margin-top: 10px"> | 
|  |  | 85 | +                    <el-row :gutter="24"> | 
|  |  | 86 | +                        <el-col :span="5"> | 
|  |  | 87 | +                            <el-button type="danger" icon="el-icon-delete" | 
|  |  | 88 | +                                       :loading="queue_loading.batchDelLoading" | 
|  |  | 89 | +                                       :disabled="this.queue_page.selectList.length===0" | 
|  |  | 90 | +                                       @click="queue_batchRemove">批量删除 | 
|  |  | 91 | +                            </el-button> | 
|  |  | 92 | +                        </el-col> | 
|  |  | 93 | +                        <el-col :span="10" style="margin-top: 5px"> | 
|  |  | 94 | +                            <el-pagination | 
|  |  | 95 | +                                    @size-change="queue_handleSizeChange" | 
|  |  | 96 | +                                    @current-change="queue_handleCurrentChange" | 
|  |  | 97 | +                                    :current-page="queue_queryInfo.pageNum" | 
|  |  | 98 | +                                    :page-sizes="[10,20,30,50]" | 
|  |  | 99 | +                                    :page-size="queue_queryInfo.pageSize" | 
|  |  | 100 | +                                    layout="total, sizes, prev, pager, next, jumper" | 
|  |  | 101 | +                                    :total="queue_page.total"> | 
|  |  | 102 | +                            </el-pagination> | 
|  |  | 103 | +                        </el-col> | 
|  |  | 104 | +                    </el-row> | 
|  |  | 105 | +                </div> | 
|  |  | 106 | +            </el-card> | 
|  |  | 107 | + | 
|  |  | 108 | +            <!-- 增加,对话框区域 --> | 
|  |  | 109 | +            <div> | 
|  |  | 110 | +                <el-dialog title="添加队列" | 
|  |  | 111 | +                           :visible.sync="queue_dialog.addDialog" | 
|  |  | 112 | +                           style="margin-top: -50px" text-align="center" width="60%" | 
|  |  | 113 | +                           @close="queue_addDialogClosed"> | 
|  |  | 114 | + | 
|  |  | 115 | +                    <el-form :inline="true" label-width="120px" status-icon style="margin-top: -10px" align="center" | 
|  |  | 116 | +                             :model="queue_addForm" :rules="queue_addFormRules" ref="queue_addFormRef"> | 
|  |  | 117 | +                        <el-form-item label="队列名称:" prop="queueName"> | 
|  |  | 118 | +                            <el-input v-model="queue_addForm.queueName" style="width:240px" size="small" clearable | 
|  |  | 119 | +                                      placeholder="请输入队列名称"> | 
|  |  | 120 | +                            </el-input> | 
|  |  | 121 | +                        </el-form-item> | 
|  |  | 122 | +                        <el-form-item label="所属虚拟主机:" prop="virtualHostId"> | 
|  |  | 123 | +                            <el-cascader | 
|  |  | 124 | +                                    clearable style="width: 240px" size="small" | 
|  |  | 125 | +                                    v-model="queue_addForm.virtualHostId" | 
|  |  | 126 | +                                    @change="cascadeAddChange" | 
|  |  | 127 | +                                    :options="queue_config.cascade.server_hostList" | 
|  |  | 128 | +                                    :show-all-levels="false" | 
|  |  | 129 | +                                    :change-on-select="false" | 
|  |  | 130 | +                                    :props="queue_config.cascade.defaultParams" | 
|  |  | 131 | +                                    placeholder="请选择所属虚拟主机"></el-cascader> | 
|  |  | 132 | +                        </el-form-item> | 
|  |  | 133 | + | 
|  |  | 134 | +                        <el-form-item label="是否持久化:" prop="durability"> | 
|  |  | 135 | +                            <el-select v-model="queue_addForm.durability" style="width: 240px" clearable size="small" | 
|  |  | 136 | +                                       placeholder="请选择是否持久化"> | 
|  |  | 137 | +                                <el-option | 
|  |  | 138 | +                                        v-for="item in booleanList" | 
|  |  | 139 | +                                        :key="item.value" | 
|  |  | 140 | +                                        :label="item.label" | 
|  |  | 141 | +                                        :value="item.value"> | 
|  |  | 142 | +                                </el-option> | 
|  |  | 143 | +                            </el-select> | 
|  |  | 144 | +                        </el-form-item> | 
|  |  | 145 | +                        <el-form-item label="是否自动删除:" prop="autoDelete"> | 
|  |  | 146 | +                            <el-select v-model="queue_addForm.autoDelete" style="width: 240px" clearable size="small" | 
|  |  | 147 | +                                       placeholder="请选择是否自动删除"> | 
|  |  | 148 | +                                <el-option | 
|  |  | 149 | +                                        v-for="item in booleanList" | 
|  |  | 150 | +                                        :key="item.value" | 
|  |  | 151 | +                                        :label="item.label" | 
|  |  | 152 | +                                        :value="item.value"> | 
|  |  | 153 | +                                </el-option> | 
|  |  | 154 | +                            </el-select> | 
|  |  | 155 | +                        </el-form-item> | 
|  |  | 156 | +                        <el-form-item label="扩展参数:" prop="arguments"> | 
|  |  | 157 | +                            <el-input v-model="queue_addForm.arguments" style="width:240px" clearable size="small" | 
|  |  | 158 | +                                      placeholder="扩展参数(JSON格式)"> | 
|  |  | 159 | +                            </el-input> | 
|  |  | 160 | +                        </el-form-item> | 
|  |  | 161 | +                        <el-form-item label="相关描述:" prop="description"> | 
|  |  | 162 | +                            <el-input v-model="queue_addForm.description" style="width:240px" clearable size="small" | 
|  |  | 163 | +                                      placeholder="相关描述"> | 
|  |  | 164 | +                            </el-input> | 
|  |  | 165 | +                        </el-form-item> | 
|  |  | 166 | +                    </el-form> | 
|  |  | 167 | +                    <div slot="footer" class="dialog-footer" style="text-align: center;margin-top: -20px"> | 
|  |  | 168 | +                        <el-button type="info" @click="queue_dialog.addDialog = false" size="medium" | 
|  |  | 169 | +                                   style="width: 100px">取消 | 
|  |  | 170 | +                        </el-button> | 
|  |  | 171 | +                        <el-button type="primary" @click="queue_add" :loading="queue_loading.addLoading" | 
|  |  | 172 | +                                   size="medium" style="width: 100px">添加 | 
|  |  | 173 | +                        </el-button> | 
|  |  | 174 | +                    </div> | 
|  |  | 175 | +                </el-dialog> | 
|  |  | 176 | +            </div> | 
|  |  | 177 | +            <!-- 编辑,对话框区域 --> | 
|  |  | 178 | +            <div> | 
|  |  | 179 | +                <el-dialog title="编辑队列信息" | 
|  |  | 180 | +                           :visible.sync="queue_dialog.editDialog" | 
|  |  | 181 | +                           style="margin-top: -50px" text-align="center" width="50%" | 
|  |  | 182 | +                           @close="queue_editDialogClosed"> | 
|  |  | 183 | +                    <el-form :inline="true" label-width="120px" status-icon style="margin-top: -10px" align="center" | 
|  |  | 184 | +                             :model="queue_editForm" :rules="queue_editFormRules" ref="queue_editFormRef"> | 
|  |  | 185 | +                        <el-form-item label="队列名称:" prop="queueName"> | 
|  |  | 186 | +                            <el-input v-model="queue_editForm.queueName" style="width:240px" size="small" clearable | 
|  |  | 187 | +                                      placeholder="请输入队列名称"> | 
|  |  | 188 | +                            </el-input> | 
|  |  | 189 | +                        </el-form-item> | 
|  |  | 190 | +                        <el-form-item label="所属虚拟主机:" prop="virtualHostId"> | 
|  |  | 191 | +                            <el-cascader | 
|  |  | 192 | +                                    clearable style="width: 240px" size="small" | 
|  |  | 193 | +                                    v-model="queue_editForm.virtualHostId" | 
|  |  | 194 | +                                    @change="cascadeEditChange" | 
|  |  | 195 | +                                    :options="queue_config.cascade.server_hostList" | 
|  |  | 196 | +                                    :show-all-levels="false" | 
|  |  | 197 | +                                    :change-on-select="false" | 
|  |  | 198 | +                                    :props="queue_config.cascade.defaultParams" | 
|  |  | 199 | +                                    placeholder="请选择所属虚拟主机"></el-cascader> | 
|  |  | 200 | +                        </el-form-item> | 
|  |  | 201 | + | 
|  |  | 202 | +                        <el-form-item label="是否持久化:" prop="durability"> | 
|  |  | 203 | +                            <el-select v-model="queue_editForm.durability" style="width: 240px" clearable size="small" | 
|  |  | 204 | +                                       placeholder="请选择是否持久化"> | 
|  |  | 205 | +                                <el-option | 
|  |  | 206 | +                                        v-for="item in booleanList" | 
|  |  | 207 | +                                        :key="item.value" | 
|  |  | 208 | +                                        :label="item.label" | 
|  |  | 209 | +                                        :value="item.value"> | 
|  |  | 210 | +                                </el-option> | 
|  |  | 211 | +                            </el-select> | 
|  |  | 212 | +                        </el-form-item> | 
|  |  | 213 | +                        <el-form-item label="是否自动删除:" prop="autoDelete"> | 
|  |  | 214 | +                            <el-select v-model="queue_editForm.autoDelete" style="width: 240px" clearable size="small" | 
|  |  | 215 | +                                       placeholder="请选择是否自动删除"> | 
|  |  | 216 | +                                <el-option | 
|  |  | 217 | +                                        v-for="item in booleanList" | 
|  |  | 218 | +                                        :key="item.value" | 
|  |  | 219 | +                                        :label="item.label" | 
|  |  | 220 | +                                        :value="item.value"> | 
|  |  | 221 | +                                </el-option> | 
|  |  | 222 | +                            </el-select> | 
|  |  | 223 | +                        </el-form-item> | 
|  |  | 224 | +                        <el-form-item label="扩展参数:" prop="arguments"> | 
|  |  | 225 | +                            <el-input v-model="queue_editForm.arguments" style="width:240px" clearable size="small" | 
|  |  | 226 | +                                      placeholder="扩展参数(JSON格式)"> | 
|  |  | 227 | +                            </el-input> | 
|  |  | 228 | +                        </el-form-item> | 
|  |  | 229 | +                        <el-form-item label="相关描述:" prop="description"> | 
|  |  | 230 | +                            <el-input v-model="queue_editForm.description" style="width:240px" clearable size="small" | 
|  |  | 231 | +                                      placeholder="相关描述"> | 
|  |  | 232 | +                            </el-input> | 
|  |  | 233 | +                        </el-form-item> | 
|  |  | 234 | +                    </el-form> | 
|  |  | 235 | + | 
|  |  | 236 | +                    <div slot="footer" class="dialog-footer" style="text-align: center"> | 
|  |  | 237 | +                        <el-button type="info" @click="queue_dialog.editDialog = false" size="medium" | 
|  |  | 238 | +                                   style="width: 100px">取消 | 
|  |  | 239 | +                        </el-button> | 
|  |  | 240 | +                        <el-button type="primary" @click="queue_edit" :loading="queue_loading.addLoading" | 
|  |  | 241 | +                                   size="medium" style="width: 100px">编辑 | 
|  |  | 242 | +                        </el-button> | 
|  |  | 243 | +                    </div> | 
|  |  | 244 | +                </el-dialog> | 
|  |  | 245 | +            </div> | 
|  |  | 246 | +        </el-main> | 
|  |  | 247 | +    </el-container> | 
| 3 | </template> | 248 | </template> | 
| 4 |  | 249 |  | 
| 5 | <script> | 250 | <script> | 
|  | @@ -9,7 +254,7 @@ |  | @@ -9,7 +254,7 @@ | 
| 9 | updateBusQueue, | 254 | updateBusQueue, | 
| 10 | deleteBusQueue, | 255 | deleteBusQueue, | 
| 11 | batchRemoveBusQueue, | 256 | batchRemoveBusQueue, | 
| 12 | -        getServerAndHostAndExchangeList, | 257 | +        getServerAndHostList, | 
| 13 | } from "../../api/message_bus"; | 258 | } from "../../api/message_bus"; | 
| 14 |  | 259 |  | 
| 15 | export default { | 260 | export default { | 
|  | @@ -24,7 +269,7 @@ |  | @@ -24,7 +269,7 @@ | 
| 24 | // 级联显示 | 269 | // 级联显示 | 
| 25 | cascade: { | 270 | cascade: { | 
| 26 | // 服务器及虚拟主机列表 | 271 | // 服务器及虚拟主机列表 | 
| 27 | -                        server_host_exchangeList: [], | 272 | +                        server_hostList: [], | 
| 28 | defaultParams: { | 273 | defaultParams: { | 
| 29 | label: 'aliasName', | 274 | label: 'aliasName', | 
| 30 | value: 'id', | 275 | value: 'id', | 
|  | @@ -38,21 +283,424 @@ |  | @@ -38,21 +283,424 @@ | 
| 38 | queue_queryInfo: { | 283 | queue_queryInfo: { | 
| 39 | // 队列名称 | 284 | // 队列名称 | 
| 40 | queueName: '', | 285 | queueName: '', | 
| 41 | -                    // 所属交换机id |  |  | 
| 42 | -                    exchangeId: '', | 286 | +                    // 所属虚拟机id | 
|  |  | 287 | +                    virtualHostId: '', | 
| 43 | // 当前页数 | 288 | // 当前页数 | 
| 44 | pageNum: 1, | 289 | pageNum: 1, | 
| 45 | // 每页条数 | 290 | // 每页条数 | 
| 46 | pageSize: 10 | 291 | pageSize: 10 | 
| 47 | }, | 292 | }, | 
|  |  | 293 | +                /** | 
|  |  | 294 | +                 * queue,分页 | 
|  |  | 295 | +                 */ | 
|  |  | 296 | +                queue_page: { | 
|  |  | 297 | +                    // 路由键列表 | 
|  |  | 298 | +                    queueList: [], | 
|  |  | 299 | +                    // 总条数 | 
|  |  | 300 | +                    total: 0, | 
|  |  | 301 | +                    // 批量删除,选中列表 | 
|  |  | 302 | +                    selectList: [], | 
|  |  | 303 | +                }, | 
|  |  | 304 | +                /** | 
|  |  | 305 | +                 * queue,新增表单 | 
|  |  | 306 | +                 */ | 
|  |  | 307 | +                queue_addForm: { | 
|  |  | 308 | +                    // 队列名称 | 
|  |  | 309 | +                    queueName: '', | 
|  |  | 310 | +                    // 所属虚拟机id | 
|  |  | 311 | +                    virtualHostId: '', | 
|  |  | 312 | +                    // 是否持久化,默认 true | 
|  |  | 313 | +                    durability: true, | 
|  |  | 314 | +                    // 是否自动删除,默认 false | 
|  |  | 315 | +                    autoDelete: false, | 
|  |  | 316 | +                    // 扩展参数,以JSON格式存储 | 
|  |  | 317 | +                    arguments: '', | 
|  |  | 318 | +                    // 相关描述 | 
|  |  | 319 | +                    description: '', | 
|  |  | 320 | +                }, | 
|  |  | 321 | +                /** | 
|  |  | 322 | +                 * queue,编辑表单 | 
|  |  | 323 | +                 */ | 
|  |  | 324 | +                queue_editForm: {}, | 
|  |  | 325 | +                /** | 
|  |  | 326 | +                 * queue,加载 | 
|  |  | 327 | +                 */ | 
|  |  | 328 | +                queue_loading: { | 
|  |  | 329 | +                    // 列表加载 | 
|  |  | 330 | +                    listLoading: false, | 
|  |  | 331 | +                    // 添加加载 | 
|  |  | 332 | +                    addLoading: false, | 
|  |  | 333 | +                    // 编辑加载 | 
|  |  | 334 | +                    editLoading: false, | 
|  |  | 335 | +                    // 删除加载 | 
|  |  | 336 | +                    delLoading: false, | 
|  |  | 337 | +                    // 批量删除加载 | 
|  |  | 338 | +                    batchDelLoading: false, | 
|  |  | 339 | +                }, | 
|  |  | 340 | +                /** | 
|  |  | 341 | +                 *  queue,对话框管理 | 
|  |  | 342 | +                 */ | 
|  |  | 343 | +                queue_dialog: { | 
|  |  | 344 | +                    // 添加对话框 | 
|  |  | 345 | +                    addDialog: false, | 
|  |  | 346 | +                    // 编辑对话框 | 
|  |  | 347 | +                    editDialog: false, | 
|  |  | 348 | +                }, | 
|  |  | 349 | +                /** | 
|  |  | 350 | +                 * queue,添加表单,验证规则 | 
|  |  | 351 | +                 */ | 
|  |  | 352 | +                queue_addFormRules: { | 
|  |  | 353 | +                    // 队列名称 | 
|  |  | 354 | +                    queueName: [ | 
|  |  | 355 | +                        {required: true, message: '请输入队列名称', trigger: ['blur', 'change']}, | 
|  |  | 356 | +                    ], | 
|  |  | 357 | +                    // 所属虚拟机id | 
|  |  | 358 | +                    virtualHostId: [ | 
|  |  | 359 | +                        {required: true, message: '请选择所属虚拟机', trigger: ['blur', 'change']}, | 
|  |  | 360 | +                    ], | 
|  |  | 361 | +                    // 是否持久化,默认 true | 
|  |  | 362 | +                    durability: [ | 
|  |  | 363 | +                        {required: true, message: '请选择是否持久化', trigger: ['blur', 'change']}, | 
|  |  | 364 | +                    ], | 
|  |  | 365 | +                    // 是否自动删除,默认 false | 
|  |  | 366 | +                    autoDelete: [ | 
|  |  | 367 | +                        {required: true, message: '请选择是否自动删除', trigger: ['blur', 'change']}, | 
|  |  | 368 | +                    ], | 
|  |  | 369 | +                    // // 扩展参数,以JSON格式存储 | 
|  |  | 370 | +                    // arguments: [ | 
|  |  | 371 | +                    //     {required: true, message: '扩展参数', trigger: ['blur', 'change']}, | 
|  |  | 372 | +                    // ], | 
|  |  | 373 | +                    // // 相关描述 | 
|  |  | 374 | +                    // description: [ | 
|  |  | 375 | +                    //     {required: true, message: '请输入相关描述', trigger: ['blur', 'change']}, | 
|  |  | 376 | +                    // ], | 
|  |  | 377 | +                }, | 
|  |  | 378 | +                /** | 
|  |  | 379 | +                 * queue,编辑表单,验证规则 | 
|  |  | 380 | +                 */ | 
|  |  | 381 | +                queue_editFormRules: { | 
|  |  | 382 | +                    // 队列名称 | 
|  |  | 383 | +                    queueName: [ | 
|  |  | 384 | +                        {required: true, message: '请输入队列名称', trigger: ['blur', 'change']}, | 
|  |  | 385 | +                    ], | 
|  |  | 386 | +                    // 所属虚拟机id | 
|  |  | 387 | +                    virtualHostId: [ | 
|  |  | 388 | +                        {required: true, message: '请选择所属虚拟机', trigger: ['blur', 'change']}, | 
|  |  | 389 | +                    ], | 
|  |  | 390 | +                    // 是否持久化,默认 true | 
|  |  | 391 | +                    durability: [ | 
|  |  | 392 | +                        {required: true, message: '请选择是否持久化', trigger: ['blur', 'change']}, | 
|  |  | 393 | +                    ], | 
|  |  | 394 | +                    // 是否自动删除,默认 false | 
|  |  | 395 | +                    autoDelete: [ | 
|  |  | 396 | +                        {required: true, message: '请选择是否自动删除', trigger: ['blur', 'change']}, | 
|  |  | 397 | +                    ], | 
|  |  | 398 | +                    // // 扩展参数,以JSON格式存储 | 
|  |  | 399 | +                    // arguments: [ | 
|  |  | 400 | +                    //     {required: true, message: '扩展参数', trigger: ['blur', 'change']}, | 
|  |  | 401 | +                    // ], | 
|  |  | 402 | +                    // // 相关描述 | 
|  |  | 403 | +                    // description: [ | 
|  |  | 404 | +                    //     {required: true, message: '请输入相关描述', trigger: ['blur', 'change']}, | 
|  |  | 405 | +                    // ], | 
|  |  | 406 | +                }, | 
|  |  | 407 | +                /** | 
|  |  | 408 | +                 * Boolean属性,选择列表 | 
|  |  | 409 | +                 */ | 
|  |  | 410 | +                booleanList: [ | 
|  |  | 411 | +                    { | 
|  |  | 412 | +                        value: true, | 
|  |  | 413 | +                        label: '是' | 
|  |  | 414 | +                    }, | 
|  |  | 415 | +                    { | 
|  |  | 416 | +                        value: false, | 
|  |  | 417 | +                        label: '否' | 
|  |  | 418 | +                    }, | 
|  |  | 419 | +                ], | 
| 48 | } | 420 | } | 
| 49 | }, | 421 | }, | 
| 50 | -        methods: {}, | 422 | +        methods: { | 
|  |  | 423 | +            /** | 
|  |  | 424 | +             * 分页查询,监听 pageSize 改变的事件 | 
|  |  | 425 | +             */ | 
|  |  | 426 | +            queue_handleSizeChange(newSize) { | 
|  |  | 427 | +                this.queue_queryInfo.pageSize = newSize; | 
|  |  | 428 | +                //刷新列表 | 
|  |  | 429 | +                this.queue_getList(); | 
|  |  | 430 | +            }, | 
|  |  | 431 | +            /** | 
|  |  | 432 | +             * 分页查询,监听 pageNum 改变的事件 | 
|  |  | 433 | +             */ | 
|  |  | 434 | +            queue_handleCurrentChange(newPage) { | 
|  |  | 435 | +                this.queue_queryInfo.pageNum = newPage; | 
|  |  | 436 | +                //刷新列表 | 
|  |  | 437 | +                this.queue_getList(); | 
|  |  | 438 | +            }, | 
|  |  | 439 | +            /** | 
|  |  | 440 | +             * queue,分页查询 | 
|  |  | 441 | +             */ | 
|  |  | 442 | +            queue_getList() { | 
|  |  | 443 | +                // 开启加载 | 
|  |  | 444 | +                this.queue_loading.listLoading = true; | 
|  |  | 445 | +                selectBusQueueList(this.queue_queryInfo).then((response) => { | 
|  |  | 446 | +                    let res = response.data; | 
|  |  | 447 | +                    if (res.code !== '200') { | 
|  |  | 448 | +                        // 关闭加载 | 
|  |  | 449 | +                        this.queue_loading.listLoading = false; | 
|  |  | 450 | +                        return this.$message.error('获取队列-列表,失败!'); | 
|  |  | 451 | +                    } | 
|  |  | 452 | +                    // 获取列表数据 | 
|  |  | 453 | +                    this.queue_page.queueList = res.data.list; | 
|  |  | 454 | +                    // 获取列表的总记录数 | 
|  |  | 455 | +                    this.queue_page.total = res.data.total; | 
|  |  | 456 | +                    // 关闭加载 | 
|  |  | 457 | +                    this.queue_loading.listLoading = false; | 
|  |  | 458 | +                    this.$message.success('获取队列-列表,成功!'); | 
|  |  | 459 | +                }).catch(error => { | 
|  |  | 460 | +                    // 关闭加载 | 
|  |  | 461 | +                    this.queue_loading.listLoading = false; | 
|  |  | 462 | +                    this.$message.error(error.toString()); | 
|  |  | 463 | +                }); | 
|  |  | 464 | +            }, | 
|  |  | 465 | +            /** | 
|  |  | 466 | +             * queue,添加对话框,打开事件 | 
|  |  | 467 | +             */ | 
|  |  | 468 | +            queue_toAddDialog() { | 
|  |  | 469 | +                this.queue_dialog.addDialog = true; | 
|  |  | 470 | +            }, | 
|  |  | 471 | +            /** | 
|  |  | 472 | +             * queue,添加对话框,关闭事件 | 
|  |  | 473 | +             */ | 
|  |  | 474 | +            queue_addDialogClosed() { | 
|  |  | 475 | +                // 重置对话框 | 
|  |  | 476 | +                this.$refs.queue_addFormRef.resetFields(); | 
|  |  | 477 | +            }, | 
|  |  | 478 | +            /** | 
|  |  | 479 | +             * queue,添加功能 | 
|  |  | 480 | +             */ | 
|  |  | 481 | +            queue_add() { | 
|  |  | 482 | +                // 进行表单的预验证 | 
|  |  | 483 | +                this.$refs.queue_addFormRef.validate(valid => { | 
|  |  | 484 | +                    // 未通过,表单预校验 | 
|  |  | 485 | +                    if (!valid) return; | 
|  |  | 486 | +                    // 通过,表单预检验,开启加载 | 
|  |  | 487 | +                    this.queue_loading.addLoading = true; | 
|  |  | 488 | +                    insertBusQueue(this.queue_addForm).then((response) => { | 
|  |  | 489 | +                        let res = response.data; | 
|  |  | 490 | +                        // 添加失败 | 
|  |  | 491 | +                        if (res.code !== '200') { | 
|  |  | 492 | +                            if (res.code === '400') { | 
|  |  | 493 | +                                // 关闭加载 | 
|  |  | 494 | +                                this.queue_loading.addLoading = false; | 
|  |  | 495 | +                                return this.$message.error('该队列信息,已存在'); | 
|  |  | 496 | +                            } | 
|  |  | 497 | +                            if (res.code === '999') { | 
|  |  | 498 | +                                // 关闭加载 | 
|  |  | 499 | +                                this.queue_loading.addLoading = false; | 
|  |  | 500 | +                                return this.$message.error('未知异常,添加队列,失败'); | 
|  |  | 501 | +                            } | 
|  |  | 502 | +                            // 关闭加载 | 
|  |  | 503 | +                            this.queue_loading.addLoading = false; | 
|  |  | 504 | +                            return this.$message.error('添加队列,失败'); | 
|  |  | 505 | +                        } | 
|  |  | 506 | +                        // 添加,成功 | 
|  |  | 507 | +                        this.$message.success('添加队列,成功'); | 
|  |  | 508 | +                        // 关闭加载 | 
|  |  | 509 | +                        this.queue_loading.addLoading = false; | 
|  |  | 510 | +                        // 隐藏对话框 | 
|  |  | 511 | +                        this.queue_dialog.addDialog = false; | 
|  |  | 512 | +                        // 刷新列表 | 
|  |  | 513 | +                        this.queue_getList(); | 
|  |  | 514 | +                    }).catch(error => { | 
|  |  | 515 | +                        // 关闭加载 | 
|  |  | 516 | +                        this.queue_loading.addLoading = false; | 
|  |  | 517 | +                        this.$message.error(error.toString()); | 
|  |  | 518 | +                    }); | 
|  |  | 519 | +                }) | 
|  |  | 520 | +            }, | 
|  |  | 521 | +            /** | 
|  |  | 522 | +             * queue,编辑对话框,打开事件 | 
|  |  | 523 | +             */ | 
|  |  | 524 | +            queue_toEditDialog(index, row) { | 
|  |  | 525 | +                this.queue_editForm = Object.assign({}, row); | 
|  |  | 526 | +                this.queue_dialog.editDialog = true; | 
|  |  | 527 | +            }, | 
|  |  | 528 | +            /** | 
|  |  | 529 | +             * queue,编辑对话框,关闭事件 | 
|  |  | 530 | +             */ | 
|  |  | 531 | +            queue_editDialogClosed() { | 
|  |  | 532 | +                //重置对话框 | 
|  |  | 533 | +                this.$refs.queue_editFormRef.resetFields(); | 
|  |  | 534 | +            }, | 
|  |  | 535 | +            /** | 
|  |  | 536 | +             * queue,编辑功能 | 
|  |  | 537 | +             */ | 
|  |  | 538 | +            queue_edit() { | 
|  |  | 539 | +                //进行表单的预验证 | 
|  |  | 540 | +                this.$refs.queue_editFormRef.validate(valid => { | 
|  |  | 541 | +                    // 未通过,表单预校验 | 
|  |  | 542 | +                    if (!valid) return; | 
|  |  | 543 | +                    // 通过,表单预检验,开启加载 | 
|  |  | 544 | +                    this.queue_loading.editLoading = true; | 
|  |  | 545 | +                    updateBusQueue(this.queue_editForm).then((response) => { | 
|  |  | 546 | +                        let res = response.data; | 
|  |  | 547 | +                        if (res.code !== '200') { | 
|  |  | 548 | +                            if (res.code === '400') { | 
|  |  | 549 | +                                // 关闭加载 | 
|  |  | 550 | +                                this.queue_loading.editLoading = false; | 
|  |  | 551 | +                                return this.$message.error('该队列信息,已存在'); | 
|  |  | 552 | +                            } | 
|  |  | 553 | +                            if (res.code === '999') { | 
|  |  | 554 | +                                // 关闭加载 | 
|  |  | 555 | +                                this.queue_loading.editLoading = false; | 
|  |  | 556 | +                                return this.$message.error('未知异常,编辑队列信息,失败'); | 
|  |  | 557 | +                            } | 
|  |  | 558 | +                            //关闭加载 | 
|  |  | 559 | +                            this.queue_loading.editLoading = false; | 
|  |  | 560 | +                            return this.$message.error('编辑队列信息,失败'); | 
|  |  | 561 | +                        } | 
|  |  | 562 | +                        // 关闭加载 | 
|  |  | 563 | +                        this.queue_loading.editLoading = false; | 
|  |  | 564 | +                        this.$message.success('编辑队列信息,成功!'); | 
|  |  | 565 | +                        // 隐藏对话框 | 
|  |  | 566 | +                        this.queue_dialog.editDialog = false; | 
|  |  | 567 | +                        // 刷新列表 | 
|  |  | 568 | +                        this.queue_getList(); | 
|  |  | 569 | +                    }).catch(error => { | 
|  |  | 570 | +                        // 关闭加载 | 
|  |  | 571 | +                        this.queue_loading.editLoading = false; | 
|  |  | 572 | +                        this.$message.error(error.toString()); | 
|  |  | 573 | +                    }); | 
|  |  | 574 | +                }) | 
|  |  | 575 | +            }, | 
|  |  | 576 | +            /** | 
|  |  | 577 | +             * queue,删除功能 | 
|  |  | 578 | +             */ | 
|  |  | 579 | +            queue_remove(index, row) { | 
|  |  | 580 | +                // 弹框询问是否删除? | 
|  |  | 581 | +                this.$confirm('此操作永久删除该队列信息, 是否继续?', '警告', { | 
|  |  | 582 | +                        confirmButtonText: '确定删除', | 
|  |  | 583 | +                        cancelButtonText: '取消', | 
|  |  | 584 | +                        type: 'warning' | 
|  |  | 585 | +                    } | 
|  |  | 586 | +                ).then(() => { | 
|  |  | 587 | +                    // 开启加载 | 
|  |  | 588 | +                    this.queue_loading.delLoading = true; | 
|  |  | 589 | +                    deleteBusQueue(row).then((response) => { | 
|  |  | 590 | +                        let res = response.data; | 
|  |  | 591 | +                        if (res.code !== '200') { | 
|  |  | 592 | +                            // 关闭加载 | 
|  |  | 593 | +                            this.queue_loading.delLoading = false; | 
|  |  | 594 | +                            return this.$message.error('删除队列信息,失败'); | 
|  |  | 595 | +                        } | 
|  |  | 596 | +                        // 关闭加载 | 
|  |  | 597 | +                        this.queue_loading.delLoading = false; | 
|  |  | 598 | +                        this.$message.success('删除队列信息,成功!'); | 
|  |  | 599 | +                        // 刷新列表 | 
|  |  | 600 | +                        this.queue_getList(); | 
|  |  | 601 | +                    }).catch(error => { | 
|  |  | 602 | +                        // 关闭加载 | 
|  |  | 603 | +                        this.queue_loading.delLoading = false; | 
|  |  | 604 | +                        this.$message.error(error.toString()); | 
|  |  | 605 | +                    }); | 
|  |  | 606 | +                }).catch(() => { | 
|  |  | 607 | +                }); | 
|  |  | 608 | +            }, | 
|  |  | 609 | +            /** | 
|  |  | 610 | +             * queue,批量删除---选中 | 
|  |  | 611 | +             */ | 
|  |  | 612 | +            queue_selectChange: function (selectList) { | 
|  |  | 613 | +                this.queue_page.selectList = selectList; | 
|  |  | 614 | +            }, | 
|  |  | 615 | +            /** | 
|  |  | 616 | +             * queue,批量删除功能 | 
|  |  | 617 | +             */ | 
|  |  | 618 | +            queue_batchRemove() { | 
|  |  | 619 | +                const ids = this.queue_page.selectList.map(item => item.id).toString(); | 
|  |  | 620 | +                this.$confirm('此操作将永久删除选中的队列信息, 是否继续?', '警告', { | 
|  |  | 621 | +                        confirmButtonText: '确定删除', | 
|  |  | 622 | +                        cancelButtonText: '取消', | 
|  |  | 623 | +                        type: 'warning' | 
|  |  | 624 | +                    } | 
|  |  | 625 | +                ).then(() => { | 
|  |  | 626 | +                    // 开启加载 | 
|  |  | 627 | +                    this.queue_loading.batchDelLoading = true; | 
|  |  | 628 | +                    let params = {ids: ids}; | 
|  |  | 629 | +                    batchRemoveBusQueue(params).then(response => { | 
|  |  | 630 | +                        let res = response.data; | 
|  |  | 631 | +                        if (res.code !== '200') { | 
|  |  | 632 | +                            // 关闭加载 | 
|  |  | 633 | +                            this.queue_loading.batchDelLoading = false; | 
|  |  | 634 | +                            return this.$message.error('批量删除队列信息,失败'); | 
|  |  | 635 | +                        } | 
|  |  | 636 | +                        this.$message.success('批量删除队列信息,成功!'); | 
|  |  | 637 | +                        // 关闭加载 | 
|  |  | 638 | +                        this.queue_loading.batchDelLoading = false; | 
|  |  | 639 | +                        // 刷新列表 | 
|  |  | 640 | +                        this.queue_getList(); | 
|  |  | 641 | +                    }).catch(error => { | 
|  |  | 642 | +                        // 关闭加载 | 
|  |  | 643 | +                        this.queue_loading.batchDelLoading = false; | 
|  |  | 644 | +                        this.$message.error(error.toString()); | 
|  |  | 645 | +                    }); | 
|  |  | 646 | +                }).catch(() => { | 
|  |  | 647 | +                }); | 
|  |  | 648 | +            }, | 
|  |  | 649 | +            /** | 
|  |  | 650 | +             * 服务器与虚拟主机 1:n | 
|  |  | 651 | +             * 获取列表 | 
|  |  | 652 | +             */ | 
|  |  | 653 | +            selectServerAndHostList() { | 
|  |  | 654 | +                getServerAndHostList().then((response) => { | 
|  |  | 655 | +                    let res = response.data; | 
|  |  | 656 | +                    if (res.code !== '200') { | 
|  |  | 657 | +                        return this.$message.error('获取服务器与虚拟主机信息,失败!'); | 
|  |  | 658 | +                    } | 
|  |  | 659 | +                    // 获取列表数据 | 
|  |  | 660 | +                    this.queue_config.cascade.server_hostList = res.data; | 
|  |  | 661 | +                    // this.$message.success('获取虚拟主机列表,成功!'); | 
|  |  | 662 | +                }).catch(error => { | 
|  |  | 663 | +                    this.$message.error(error.toString()); | 
|  |  | 664 | +                }); | 
|  |  | 665 | +            }, | 
|  |  | 666 | +            /** | 
|  |  | 667 | +             * 查询,级联。值改变激发的方法 | 
|  |  | 668 | +             * @param value 改变后的值 | 
|  |  | 669 | +             */ | 
|  |  | 670 | +            cascadeQueryChange(value) { | 
|  |  | 671 | +                let ids = value.join().split(","); | 
|  |  | 672 | +                this.queue_queryInfo.virtualHostId = ids[ids.length - 1]; | 
|  |  | 673 | +            }, | 
|  |  | 674 | +            /** | 
|  |  | 675 | +             * 添加,级联。值改变激发的方法 | 
|  |  | 676 | +             * @param value 改变后的值 | 
|  |  | 677 | +             */ | 
|  |  | 678 | +            cascadeAddChange(value) { | 
|  |  | 679 | +                let ids = value.join().split(","); | 
|  |  | 680 | +                this.queue_addForm.virtualHostId = ids[ids.length - 1]; | 
|  |  | 681 | +            }, | 
|  |  | 682 | +            /** | 
|  |  | 683 | +             * 编辑,级联。值改变激发的方法 | 
|  |  | 684 | +             * @param value 改变后的值 | 
|  |  | 685 | +             */ | 
|  |  | 686 | +            cascadeEditChange(value) { | 
|  |  | 687 | +                let ids = value.join().split(","); | 
|  |  | 688 | +                this.queue_editForm.virtualHostId = ids[ids.length - 1]; | 
|  |  | 689 | +            }, | 
|  |  | 690 | +        }, | 
| 51 | created() { | 691 | created() { | 
| 52 | - | 692 | +            if (this.$route.params.virtualHost_scopeRow !== undefined) { | 
|  |  | 693 | +                // 参数,虚拟主机id | 
|  |  | 694 | +                this.queue_queryInfo.virtualHostId = this.$route.params.virtualHost_scopeRow.id; | 
|  |  | 695 | +                // 刷新列表 | 
|  |  | 696 | +                this.queue_getList(); | 
|  |  | 697 | +            } else { | 
|  |  | 698 | +                // 刷新列表 | 
|  |  | 699 | +                this.queue_getList(); | 
|  |  | 700 | +            } | 
| 53 | }, | 701 | }, | 
| 54 | mounted() { | 702 | mounted() { | 
| 55 | - | 703 | +            this.selectServerAndHostList(); | 
| 56 | }, | 704 | }, | 
| 57 | computed: {}, | 705 | computed: {}, | 
| 58 | } | 706 | } |