<template>
    <el-container>
        <el-main>
            <el-card style="background-color: #F5F7FA">
                <!-- 搜素区域 -->
                <div>
                    <el-row>
                        <el-col :span="4">
                            <el-input v-model="messageNote_queryInfo.serverName" placeholder="服务器名称"
                                      size="medium" clearable prefix-icon="el-icon-search"></el-input>
                        </el-col>
                        <el-col :span="4">
                            <el-input v-model="messageNote_queryInfo.virtualHostName"
                                      size="medium" clearable prefix-icon="el-icon-search"
                                      placeholder="虚拟主机名称"></el-input>
                        </el-col>
                        <el-col :span="4">
                            <el-input v-model="messageNote_queryInfo.exchangeName" placeholder="交换机名称"
                                      size="medium" clearable prefix-icon="el-icon-search"></el-input>
                        </el-col>
                        <el-col :span="4">
                            <el-input v-model="messageNote_queryInfo.routingKeyName" placeholder="路由键名称"
                                      size="medium" clearable prefix-icon="el-icon-search"></el-input>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="4">
                            <el-input v-model="messageNote_queryInfo.username" placeholder="用户名称"
                                      size="medium" clearable prefix-icon="el-icon-search"></el-input>
                        </el-col>
                        <el-col :span="4">
                            <el-input v-model="messageNote_queryInfo.alias_sendContent" placeholder="发送内容"
                                      size="medium" clearable prefix-icon="el-icon-search"></el-input>
                        </el-col>
                        <el-col :span="4">
                            <el-date-picker v-model="messageNote_queryInfo.sendTimeBegin" placeholder="时间段-开始"
                                            type="date" value-format="yyyy-MM-dd"
                                            size="medium" style="width: auto"></el-date-picker>
                        </el-col>
                        <el-col :span="4">
                            <el-date-picker v-model="messageNote_queryInfo.sendTimeEnd" placeholder="时间段-结束"
                                            type="date" value-format="yyyy-MM-dd"
                                            size="medium" style="width: auto"></el-date-picker>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="15">
                            <el-button type="success" style="width:150px" size="medium" @click="messageNote_getList">
                                查询消息记录
                            </el-button>
                            <el-button type="primary" style="width:150px" size="medium"
                                       @click="messageNote_toAddDialog">
                                发送消息
                            </el-button>
                            <el-button type="warning" style="width:150px" size="medium"
                                       @click="messageNote_openDeleteTime">
                                设置保留时间
                            </el-button>
                        </el-col>
                    </el-row>
                </div>
                <!-- 列表区域 -->
                <div style="margin-top: 20px;">
                    <el-table :data="messageNote_page.messageNoteList" border
                              v-loading="messageNote_loading.listLoading"
                              @selection-change="messageNote_selectChange"
                              element-loading-text="获取消息收发记录，拼命加载中">
                        <el-table-column type="selection" width="55" align="center"></el-table-column>
                        <el-table-column type="index" align="center"></el-table-column>
                        <el-table-column label="用户名称" prop="username" align="center" width="220"></el-table-column>
                        <el-table-column label="服务器名称" prop="serverName" align="center" width="220"></el-table-column>
                        <el-table-column label="虚拟主机名称" prop="virtualHostName" align="center"
                                         width="220"></el-table-column>
                        <el-table-column label="交换机名称" prop="exchangeName" align="center" width="220"></el-table-column>
                        <el-table-column label="路由键名称" prop="routingKeyName" align="center"
                                         width="220"></el-table-column>
                        <el-table-column label="消息发送时间" prop="alias_sendTime" align="center"
                                         width="220">
                        </el-table-column>
                        <el-table-column label="发送内容" prop="alias_sendContent" align="center"
                                         width="220">
                        </el-table-column>
                        <el-table-column label="相关描述" prop="description" align="center"
                                         width="220">
                        </el-table-column>
                        <el-table-column label="操作" width="245px" align="center" fixed="right">
                            <template slot-scope="scope">
                                <!-- 编辑按钮-->
                                <el-tooltip effect="dark" content="查看" placement="top-start" :enterable="false">
                                    <el-button type="primary" icon="el-icon-edit" size="mini"
                                               @click="messageNote_toEditDialog(scope.$index,scope.row)">查看
                                    </el-button>
                                </el-tooltip>
                                <!-- 删除按钮-->
                                <el-tooltip effect="dark" content="删除" placement="top-start" :enterable="false">
                                    <el-button type="danger" icon="el-icon-delete" size="mini"
                                               :loading="messageNote_loading.delLoading"
                                               @click="messageNote_remove(scope.$index,scope.row)">删除
                                    </el-button>
                                </el-tooltip>
                            </template>
                        </el-table-column>
                    </el-table>
                </div>
                <!--分页区域-->
                <div style="margin-top: 10px">
                    <el-row :gutter="24">
                        <el-col :span="5">
                            <el-button type="danger" icon="el-icon-delete"
                                       :loading="messageNote_loading.batchDelLoading"
                                       :disabled="this.messageNote_page.selectList.length===0"
                                       @click="messageNote_batchRemove">批量删除
                            </el-button>
                        </el-col>
                        <el-col :span="10" style="margin-top: 5px">
                            <el-pagination
                                    @size-change="messageNote_handleSizeChange"
                                    @current-change="messageNote_handleCurrentChange"
                                    :current-page="messageNote_queryInfo.pageNum"
                                    :page-sizes="[10,20,30,50,100,200]"
                                    :page-size="messageNote_queryInfo.pageSize"
                                    layout="total, sizes, prev, pager, next, jumper"
                                    :total="messageNote_page.total">
                            </el-pagination>
                        </el-col>
                    </el-row>
                </div>
            </el-card>
        </el-main>
        <!-- 设置定时删除，对话框区域 -->
        <div>
            <el-dialog title="设置保留消息记录时间"
                       :visible.sync="messageNote_dialog.deleteTimeDialog"
                       style="margin-top: -50px" text-align="center" width="60%"
                       @close="messageNote_deleteTimeDialogClosed">
                <el-form :inline="true" label-width="200px" status-icon style="margin-top: 0px" align="center"
                         :model="schedulingDelete" :rules="messageNote_addFormRules" ref="messageNote_addFormRef">
                    <el-form-item label="默认保留最新记录消息天数：" prop="deleteTime">
                        <el-input-number style="width: 150px" v-model="schedulingDelete.deleteTime"
                                         :min="1" :max="100" controls-position="right">
                        </el-input-number>
                        <span style="margin-left:5px;font-size: 15px"><strong>天</strong></span>
                    </el-form-item>
                </el-form>
                <div slot="footer" class="dialog-footer" style="text-align: center;margin-top: -20px">
                    <el-button type="info" @click="messageNote_dialog.deleteTimeDialog = false" size="medium"
                               style="width: 100px">取消
                    </el-button>
                    <el-button type="primary" @click="messageNote_setDeleteTime"
                               :loading="messageNote_loading.addLoading"
                               size="medium" style="width: 100px">设置
                    </el-button>
                </div>
            </el-dialog>
        </div>
        <!-- 增加，对话框区域 -->
        <div>
            <el-dialog title="发送消息"
                       :visible.sync="messageNote_dialog.addDialog"
                       style="margin-top: -50px" text-align="center" width="65%"
                       @close="messageNote_addDialogClosed">

                <el-form :inline="true" label-width="120px" status-icon style="margin-top: -10px" align="center"
                         :model="messageNote_addForm" :rules="messageNote_addFormRules" ref="messageNote_addFormRef">
                    <el-form-item label="用户名称：" prop="userId">
                        <el-select v-model="messageNote_addForm.userId" prefix-icon="el-icon-search" clearable
                                   style="width:300px" size="medium" filterable
                                   placeholder="请选择用户">
                            <el-option
                                    v-for="item in (messageNote_config.userInfoList)"
                                    :key="item.id"
                                    :label="item.username"
                                    :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="服务器名称：" prop="serverId">
                        <el-select v-model="messageNote_addForm.serverId" prefix-icon="el-icon-search" clearable
                                   style="width:300px" size="small"
                                   @change="messageNote_server_addChange"
                                   placeholder="请选择所属服务器">
                            <el-option
                                    v-for="item in (messageNote_config.serverList)"
                                    :key="item.id"
                                    :label="item.serverName"
                                    :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>

                    <el-form-item label="虚拟主机名称：" prop="virtualHostId">
                        <el-select v-model="messageNote_addForm.virtualHostId" prefix-icon="el-icon-search" clearable
                                   style="width:300px" size="small"
                                   @change="messageNote_virtualHost_addChange"
                                   :disabled="messageNote_addForm.serverId===''"
                                   placeholder="请选择虚拟主机名称">
                            <el-option
                                    v-for="item in (messageNote_config.virtualHostList)"
                                    :key="item.id"
                                    :label="item.virtualHostName"
                                    :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>

                    <el-form-item label="交换机名称：" prop="exchangeId">
                        <el-select v-model="messageNote_addForm.exchangeId" prefix-icon="el-icon-search" clearable
                                   style="width:300px" size="small"
                                   @change="messageNote_exchange_addChange"
                                   :disabled="messageNote_addForm.virtualHostId===''"
                                   placeholder="请选择交换机名称">
                            <el-option
                                    v-for="item in (messageNote_config.exchangeList)"
                                    :key="item.id"
                                    :label="item.exchangeName"
                                    :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>

                    <el-form-item label="路由键名称：" prop="routingKeyId">
                        <el-select v-model="messageNote_addForm.routingKeyId" prefix-icon="el-icon-search" clearable
                                   style="width:300px" size="small"
                                   :disabled="messageNote_addForm.exchangeId===''"
                                   placeholder="请选择路由键名称">
                            <el-option
                                    v-for="item in (messageNote_config.routingKeyList)"
                                    :key="item.id"
                                    :label="item.routingKeyName"
                                    :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="消息发送时间：" prop="sendTime">
                        <el-date-picker v-model="messageNote_addForm.sendTime" clearable type="datetime"
                                        value-format="yyyy-MM-dd HH:mm:ss"
                                        placeholder="选择发送时间" size="small" style="width:300px"></el-date-picker>
                    </el-form-item>
                    <!--                    <el-form-item label="消息获取时间：" prop="receiveTime">-->
                    <!--                        <el-date-picker v-model="messageNote_addForm.receiveTime" clearable type="datetime"-->
                    <!--                                        value-format="yyyy-MM-dd HH:mm:ss"-->
                    <!--                                        placeholder="消息获取时间" size="small" style="width:300px"></el-date-picker>-->
                    <!--                    </el-form-item>-->

                    <el-form-item label="发送内容：" prop="alias_sendContent">
                        <el-input v-model="messageNote_addForm.alias_sendContent" style="width:300px" size="small"
                                  clearable type="textarea" :rows="1"
                                  placeholder="请输入发送内容">
                        </el-input>
                    </el-form-item>
                    <el-form-item label="相关描述：" prop="description">
                        <el-input v-model="messageNote_addForm.description" style="width:300px" size="small"
                                  clearable type="textarea" :rows="1"
                                  placeholder="请输入相关描述">
                        </el-input>
                    </el-form-item>
                </el-form>
                <div slot="footer" class="dialog-footer" style="text-align: center;margin-top: -20px">
                    <el-button type="info" @click="messageNote_dialog.addDialog = false" size="medium"
                               style="width: 100px">取消
                    </el-button>
                    <el-button type="primary" @click="messageNote_add" :loading="messageNote_loading.addLoading"
                               size="medium" style="width: 100px">添加
                    </el-button>
                </div>
            </el-dialog>
        </div>
        <!-- 编辑，对话框区域 -->
        <div>
            <el-dialog title="查看消息记录"
                       :visible.sync="messageNote_dialog.editDialog"
                       style="margin-top: -50px" text-align="center" width="65%"
                       @close="messageNote_editDialogClosed">

                <el-form :inline="true" label-width="120px" status-icon style="margin-top: -10px" align="center"
                         :model="messageNote_editForm" :rules="messageNote_editFormRules" ref="messageNote_editFormRef">
                    <el-form-item label="用户名称：" prop="username">
                        <el-input v-model="messageNote_editForm.username" style="width:300px" size="small"
                                  readonly
                                  placeholder="用户名称">
                        </el-input>

                        <!--                        <el-select v-model="messageNote_editForm.userId" prefix-icon="el-icon-search" clearable-->
                        <!--                                   style="width:300px" size="medium" filterable disabled-->
                        <!--                                   placeholder="请选择用户">-->
                        <!--                            <el-option-->
                        <!--                                    v-for="item in (messageNote_config.userInfoList)"-->
                        <!--                                    :key="item.id"-->
                        <!--                                    :label="item.username"-->
                        <!--                                    :value="item.id">-->
                        <!--                            </el-option>-->
                        <!--                        </el-select>-->
                    </el-form-item>

                    <el-form-item label="服务器名称：" prop="serverName">
                        <el-input v-model="messageNote_editForm.serverName" style="width:300px" size="small"
                                  readonly
                                  placeholder="服务器名称">
                        </el-input>
                        <!--                        <el-select v-model="messageNote_editForm.serverId" prefix-icon="el-icon-search" clearable-->
                        <!--                                   disabled-->
                        <!--                                   style="width:300px" size="small"-->
                        <!--                                   @change="messageNote_server_editChange"-->
                        <!--                                   placeholder="请选择所属服务器">-->
                        <!--                            <el-option-->
                        <!--                                    v-for="item in (messageNote_config.serverList)"-->
                        <!--                                    :key="item.id"-->
                        <!--                                    :label="item.serverName"-->
                        <!--                                    :value="item.id">-->
                        <!--                            </el-option>-->
                        <!--                        </el-select>-->
                    </el-form-item>

                    <el-form-item label="虚拟主机名称：" prop="virtualHostName">
                        <el-input v-model="messageNote_editForm.virtualHostName" style="width:300px" size="small"
                                  readonly
                                  placeholder="虚拟主机名称">
                        </el-input>
                        <!-- :disabled="messageNote_editForm.serverId===''" -->
                        <!--                        <el-select v-model="messageNote_editForm.virtualHostId" prefix-icon="el-icon-search" clearable-->
                        <!--                                   disabled-->
                        <!--                                   style="width:300px" size="small"-->
                        <!--                                   @change="messageNote_virtualHost_editChange"-->
                        <!--                                   placeholder="请选择虚拟主机名称">-->
                        <!--                            <el-option-->
                        <!--                                    v-for="item in (messageNote_config.virtualHostList)"-->
                        <!--                                    :key="item.id"-->
                        <!--                                    :label="item.virtualHostName"-->
                        <!--                                    :value="item.id">-->
                        <!--                            </el-option>-->
                        <!--                        </el-select>-->
                    </el-form-item>

                    <el-form-item label="交换机名称：" prop="exchangeName">
                        <el-input v-model="messageNote_editForm.exchangeName" style="width:300px" size="small"
                                  readonly
                                  placeholder="交换机名称">
                        </el-input>
                        <!--  :disabled="messageNote_editForm.virtualHostId===''" -->
                        <!--                        <el-select v-model="messageNote_editForm.exchangeId" prefix-icon="el-icon-search" clearable-->
                        <!--                                   disabled-->
                        <!--                                   style="width:300px" size="small"-->
                        <!--                                   @change="messageNote_exchange_editChange"-->
                        <!--                                   placeholder="请选择交换机名称">-->
                        <!--                            <el-option-->
                        <!--                                    v-for="item in (messageNote_config.exchangeList)"-->
                        <!--                                    :key="item.id"-->
                        <!--                                    :label="item.exchangeName"-->
                        <!--                                    :value="item.id">-->
                        <!--                            </el-option>-->
                        <!--                        </el-select>-->
                    </el-form-item>

                    <el-form-item label="路由键名称：" prop="routingKeyName">
                        <el-input v-model="messageNote_editForm.routingKeyName" style="width:300px" size="small"
                                  readonly
                                  placeholder="路由键名称">
                        </el-input>
                        <!-- :disabled="messageNote_editForm.exchangeId===''" -->
                        <!--                        <el-select v-model="messageNote_editForm.routingKeyId" prefix-icon="el-icon-search" clearable-->
                        <!--                                   disabled-->
                        <!--                                   style="width:300px" size="small"-->
                        <!--                                   placeholder="请选择路由键名称">-->
                        <!--                            <el-option-->
                        <!--                                    v-for="item in (messageNote_config.routingKeyList)"-->
                        <!--                                    :key="item.id"-->
                        <!--                                    :label="item.routingKeyName"-->
                        <!--                                    :value="item.id">-->
                        <!--                            </el-option>-->
                        <!--                        </el-select>-->
                    </el-form-item>
                    <el-form-item label="消息发送时间：" prop="alias_sendTime">
                        <el-input v-model="messageNote_editForm.alias_sendTime" style="width:300px" size="small"
                                  readonly
                                  placeholder="消息发送时间">
                        </el-input>
                        <!--                        <el-date-picker v-model="messageNote_editForm.sendTime" disabled clearable type="datetime"-->
                        <!--                                        value-format="yyyy-MM-dd HH:mm:ss"-->
                        <!--                                        placeholder="选择发送时间" size="small" style="width:300px"></el-date-picker>-->
                    </el-form-item>

                    <el-form-item label="发送内容：" prop="alias_sendContent">
                        <el-input v-model="messageNote_editForm.alias_sendContent" style="width:300px" size="small"
                                  clearable readonly type="textarea" :rows="1"
                                  placeholder="请输入发送内容">
                        </el-input>
                    </el-form-item>

                    <el-form-item label="相关描述：" prop="description">
                        <el-input v-model="messageNote_editForm.description" style="width:300px" size="small"
                                  clearable readonly type="textarea" :rows="1"
                                  placeholder="请输入相关描述">
                        </el-input>
                    </el-form-item>
                </el-form>
                <div slot="footer" class="dialog-footer" style="text-align: center;margin-top: -20px">
                    <el-button type="info" @click="messageNote_dialog.editDialog = false" size="medium"
                               style="width: 100px">取消
                    </el-button>
                    <el-button type="primary" @click="messageNote_dialog.editDialog = false" size="medium"
                               style="width: 100px">关闭
                    </el-button>
                    <!--                    <el-button type="primary" @click="messageNote_edit" :loading="messageNote_loading.editLoading"-->
                    <!--                               size="medium" style="width: 100px">查看-->
                    <!--                    </el-button>-->
                </div>
            </el-dialog>
        </div>
    </el-container>
</template>

<script>
    import {
        selectMessageNoteList,
        insertMessageNote,
        updateMessageNote,
        deleteMessageNote,
        batchRemoveMessageNote, getServerList, getHostList, getExchangeList, getQueueList, getRoutingKeyList,
        getDeleteTime, setDeleteTime, getUserInfoList
    } from "../../api/message_bus";

    export default {
        // 消息收发记录
        name: "MessageNote",

        data() {
            return {
                /**
                 * messageNote，配置与参数
                 */
                messageNote_config: {
                    // 用户信息列表
                    userInfoList: [],
                    // 服务器列表
                    serverList: [],
                    // 虚拟主机列表
                    virtualHostList: [],
                    // 交换机列表
                    exchangeList: [],
                    // 队列-列表
                    queueList: [],
                    // 路由键列表
                    routingKeyList: [],
                },
                /**
                 *  messageNote，搜索参数
                 */
                messageNote_queryInfo: {
                    // 用户名称
                    username: '',
                    // 消息内容，别名
                    alias_sendContent: '',
                    // 服务器名称
                    serverName: '',
                    // 虚拟主机名称
                    virtualHostName: '',
                    // 交换机名称
                    exchangeName: '',
                    // 队列名称
                    queueName: '',
                    // 路由键名称
                    routingKeyName: '',
                    // 时间段查询，开始
                    sendTimeBegin: undefined,
                    // 时间段查询，结束
                    sendTimeEnd: undefined,
                    // 当前页数
                    pageNum: 1,
                    // 每页条数
                    pageSize: 10
                },
                /**
                 * messageNote，分页
                 */
                messageNote_page: {
                    // 路由键列表
                    messageNoteList: [],
                    // 总条数
                    total: 0,
                    // 批量删除，选中列表
                    selectList: [],
                },
                /**
                 * 设置删除时间，参数
                 */
                schedulingDelete: {
                    deleteTime: 2,
                },

                /**
                 * messageNote，新增表单
                 */
                messageNote_addForm: {
                    // 用户名称
                    username: '',
                    // 服务器id
                    serverId: '',
                    // 服务器名称
                    serverName: '',
                    // 虚拟主机id
                    virtualHostId: '',
                    // 交换机id
                    exchangeId: '',
                    // 路由键id
                    routingKeyId: '',
                    // 消息发送时间
                    sendTime: undefined,
                    // 消息接收时间
                    receiveTime: undefined,
                    // 发送消息内容，别名
                    alias_sendContent: '',
                    // 相关描述
                    description: '',
                },
                /**
                 * messageNote，编辑表单
                 */
                messageNote_editForm: {},
                /**
                 * messageNote，加载
                 */
                messageNote_loading: {
                    // 列表加载
                    listLoading: false,
                    // 添加加载
                    addLoading: false,
                    // 编辑加载
                    editLoading: false,
                    // 删除加载
                    delLoading: false,
                    // 批量删除加载
                    batchDelLoading: false,
                },
                /**
                 *  messageNote,对话框管理
                 */
                messageNote_dialog: {
                    // 添加对话框
                    addDialog: false,
                    // 编辑对话框
                    editDialog: false,
                    // 定时删除记录对话框
                    deleteTimeDialog: false,

                },

                /**
                 * messageNote,添加表单，验证规则
                 */
                messageNote_addFormRules: {
                    // 用户名称
                    username: [
                        {required: true, message: '请输入用户名称', trigger: ['blur', 'change']},
                    ],
                    // 服务器ID
                    serverId: [
                        {required: true, message: '请选择服务器名称', trigger: ['blur', 'change']},
                    ],
                    // 虚拟主机ID
                    virtualHostId: [
                        {required: true, message: '请选择虚拟主机名称', trigger: ['blur', 'change']},
                    ],
                    // 交换机ID
                    exchangeId: [
                        {required: true, message: '请选择交换机名称', trigger: ['blur', 'change']},
                    ],
                    // 队列ID
                    queueId: [
                        {required: true, message: '请选择队列名称', trigger: ['blur', 'change']},
                    ],
                    // 路由键ID
                    routingKeyId: [
                        {required: true, message: '请选择路由键名称', trigger: ['blur', 'change']},
                    ],
                    // 发送时间
                    sendTime: [
                        {required: true, message: '请选择消息发送时间', trigger: ['blur', 'change']},
                    ],
                    // 接收时间
                    receiveTime: [
                        {required: true, message: '请选择消息接收时间', trigger: ['blur', 'change']},
                    ],
                    // 发送内容
                    alias_sendContent: [
                        {required: true, message: '请输入消息发送内容', trigger: ['blur', 'change']},
                    ],
                    // 相关描述
                    description: [
                        {required: true, message: '请输入相关描述', trigger: ['blur', 'change']},
                    ],
                },
                /**
                 * messageNote,编辑表单，验证规则
                 */
                messageNote_editFormRules: {
                    // 用户名称
                    username: [
                        {required: true, message: '请输入用户名称', trigger: ['blur', 'change']},
                    ],
                    // 服务器ID
                    serverId: [
                        {required: true, message: '请选择服务器名称', trigger: ['blur', 'change']},
                    ],
                    // 虚拟主机ID
                    virtualHostId: [
                        {required: true, message: '请选择虚拟主机名称', trigger: ['blur', 'change']},
                    ],
                    // 交换机ID
                    exchangeId: [
                        {required: true, message: '请选择交换机名称', trigger: ['blur', 'change']},
                    ],
                    // 队列ID
                    queueId: [
                        {required: true, message: '请选择队列名称', trigger: ['blur', 'change']},
                    ],
                    // 路由键ID
                    routingKeyId: [
                        {required: true, message: '请选择路由键名称', trigger: ['blur', 'change']},
                    ],
                    // 发送时间
                    sendTime: [
                        {required: true, message: '请选择消息发送时间', trigger: ['blur', 'change']},
                    ],
                    // 接收时间
                    receiveTime: [
                        {required: true, message: '请选择消息接收时间', trigger: ['blur', 'change']},
                    ],
                    // 发送内容
                    alias_sendContent: [
                        {required: true, message: '请输入消息发送内容', trigger: ['blur', 'change']},
                    ],
                    // 相关描述
                    description: [
                        {required: true, message: '请输入相关描述', trigger: ['blur', 'change']},
                    ],
                },
                /**
                 * Boolean属性，选择列表
                 */
                booleanList: [
                    {
                        value: true,
                        label: '是'
                    },
                    {
                        value: false,
                        label: '否'
                    },
                ],
            }
        },
        methods: {
            /**
             * 分页查询，监听 pageSize 改变的事件
             */
            messageNote_handleSizeChange(newSize) {
                this.messageNote_queryInfo.pageSize = newSize;
                //刷新列表
                this.messageNote_getList();
            },
            /**
             * 分页查询，监听 pageNum 改变的事件
             */
            messageNote_handleCurrentChange(newPage) {
                this.messageNote_queryInfo.pageNum = newPage;
                //刷新列表
                this.messageNote_getList();
            },
            /**
             * messageNote,分页查询
             */
            messageNote_getList() {
                // 开启加载
                this.messageNote_loading.listLoading = true;
                selectMessageNoteList(this.messageNote_queryInfo).then((response) => {
                    let res = response.data;
                    if (res.code !== '200') {
                        // 关闭加载
                        this.messageNote_loading.listLoading = false;
                        return this.$message.error('获取消息收发记录，失败！');
                    }
                    // 获取列表数据
                    this.messageNote_page.messageNoteList = res.data;
                    // 获取列表的总记录数
                    this.messageNote_page.total = res.total;
                    // 关闭加载
                    this.messageNote_loading.listLoading = false;
                    this.$message.success('获取消息收发记录，成功！');
                }).catch(error => {
                    // 关闭加载
                    this.messageNote_loading.listLoading = false;
                    this.$message.error(error.toString());
                });
            },
            /**
             * messageNote，添加对话框，打开事件
             */
            messageNote_toAddDialog() {
                this.messageNote_dialog.addDialog = true;
            },
            /**
             * queue，添加对话框，关闭事件
             */
            messageNote_addDialogClosed() {
                // 重置对话框
                this.$refs.messageNote_addFormRef.resetFields();
            },
            /**
             * messageNote，添加功能
             */
            messageNote_add() {
                // 进行表单的预验证
                this.$refs.messageNote_addFormRef.validate(valid => {
                    // 未通过，表单预校验
                    if (!valid) return;
                    // 通过，表单预检验，开启加载
                    this.messageNote_loading.addLoading = true;
                    insertMessageNote(this.messageNote_addForm).then((response) => {
                        let res = response.data;
                        // 添加失败
                        if (res.code !== '200') {
                            if (res.code === '999') {
                                // 关闭加载
                                this.messageNote_loading.addLoading = false;
                                return this.$message.error('未知异常，添加消息收发记录，失败');
                            }
                            // 关闭加载
                            this.messageNote_loading.addLoading = false;
                            return this.$message.error('添加消息收发记录，失败');
                        }
                        // 添加，成功
                        this.$message.success('添加消息收发记录，成功');
                        // 关闭加载
                        this.messageNote_loading.addLoading = false;
                        // 隐藏对话框
                        this.messageNote_dialog.addDialog = false;
                        // 刷新列表
                        this.messageNote_getList();
                    }).catch(error => {
                        // 关闭加载
                        this.messageNote_loading.addLoading = false;
                        this.$message.error(error.toString());
                    });
                })
            },
            /**
             * messageNote，编辑对话框，打开事件
             */
            messageNote_toEditDialog(index, row) {
                this.messageNote_selectServerList();
                this.messageNote_selectHostList(row.serverId);
                // this.messageNote_selectQueueList(row.virtualHostId);
                this.messageNote_selectExchangeList(row.virtualHostId);
                this.messageNote_selectRoutingKeyList(row.exchangeId);
                this.messageNote_editForm = Object.assign({}, row);
                this.messageNote_dialog.editDialog = true;
            },
            /**
             * messageNote，编辑对话框，关闭事件
             */
            messageNote_editDialogClosed() {
                //重置对话框
                this.$refs.messageNote_editFormRef.resetFields();
            },
            /**
             * messageNote，编辑功能
             */
            messageNote_edit() {
                //进行表单的预验证
                this.$refs.messageNote_editFormRef.validate(valid => {
                    // 未通过，表单预校验
                    if (!valid) return;
                    // 通过，表单预检验，开启加载
                    this.messageNote_loading.editLoading = true;
                    updateMessageNote(this.messageNote_editForm).then((response) => {
                        let res = response.data;
                        if (res.code !== '200') {
                            if (res.code === '999') {
                                // 关闭加载
                                this.messageNote_loading.editLoading = false;
                                return this.$message.error('未知异常，编辑消息收发记录，失败');
                            }
                            //关闭加载
                            this.messageNote_loading.editLoading = false;
                            return this.$message.error('编辑消息收发记录，失败');
                        }
                        // 关闭加载
                        this.messageNote_loading.editLoading = false;
                        this.$message.success('编辑队列信息，成功！');
                        // 隐藏对话框
                        this.messageNote_dialog.editDialog = false;
                        // 刷新列表
                        this.messageNote_getList();
                    }).catch(error => {
                        // 关闭加载
                        this.messageNote_loading.editLoading = false;
                        this.$message.error(error.toString());
                    });
                })
            },
            /**
             * messageNote，删除功能
             */
            messageNote_remove(index, row) {
                // 弹框询问是否删除？
                this.$confirm('此操作永久删除该消息收发记录, 是否继续?', '警告', {
                        confirmButtonText: '确定删除',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }
                ).then(() => {
                    // 开启加载
                    this.messageNote_loading.delLoading = true;
                    // 特殊情况，sendTime与后端接收格式不对（但又不能改）
                    row.sendTime = undefined;
                    deleteMessageNote(row).then((response) => {
                        let res = response.data;
                        if (res.code !== '200') {
                            // 关闭加载
                            this.messageNote_loading.delLoading = false;
                            return this.$message.error('删除消息记录信息，失败');
                        }
                        // 关闭加载
                        this.messageNote_loading.delLoading = false;
                        this.$message.success(res.msg);
                        // 刷新列表
                        this.messageNote_getList();
                    }).catch(error => {
                        // 关闭加载
                        this.messageNote_loading.delLoading = false;
                        this.$message.error(error.toString());
                    });
                }).catch(() => {
                });
            },
            /**
             * messageNote，批量删除---选中
             */
            messageNote_selectChange: function (selectList) {
                this.messageNote_page.selectList = selectList;
            },
            /**
             * messageNote，批量删除功能
             */
            messageNote_batchRemove() {
                const ids = this.messageNote_page.selectList.map(item => item.id).toString();
                this.$confirm('此操作将永久删除选中的消息收发记录, 是否继续?', '警告', {
                        confirmButtonText: '确定删除',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }
                ).then(() => {
                    // 开启加载
                    this.messageNote_loading.batchDelLoading = true;
                    let params = {ids: ids};
                    batchRemoveMessageNote(params).then(response => {
                        let res = response.data;
                        if (res.code !== '200') {
                            // 关闭加载
                            this.messageNote_loading.batchDelLoading = false;
                            return this.$message.error('批量删除消息收发记录，失败');
                        }
                        this.$message.success(res.msg);
                        // 关闭加载
                        this.messageNote_loading.batchDelLoading = false;
                        // 刷新列表
                        this.messageNote_getList();
                    }).catch(error => {
                        // 关闭加载
                        this.messageNote_loading.batchDelLoading = false;
                        this.$message.error(error.toString());
                    });
                }).catch(() => {
                });
            },

            /**
             * 打开,设置定时删除对话框
             */
            messageNote_openDeleteTime() {
                this.messageNote_dialog.deleteTimeDialog = true;
            },

            /**
             * 设置定时删除对话框,关闭时间
             */
            messageNote_deleteTimeDialogClosed() {
                this.selectDeleteTime();
            },
            /**
             * 获取删除时间
             */
            selectDeleteTime() {
                getDeleteTime().then((response) => {
                    let res = response.data;
                    console.log(res)
                    if (res.code !== '200') {
                        return this.$message.error('获取删除时间，失败！');
                    }
                    this.schedulingDelete.deleteTime = res.data.deleteTime;
                }).catch(error => {
                    this.$message.error(error.toString());
                });
            },
            /**
             * 设置删除时间
             */
            messageNote_setDeleteTime() {
                const params = {deleteTime: this.schedulingDelete.deleteTime}
                setDeleteTime(params).then((response) => {
                    let res = response.data;
                    console.log(res)
                    if (res.code !== '200') {
                        return this.$message.error('设置删除时间，失败！');
                    }
                    this.$message.success('设置删除时间，成功！');
                    // 隐藏对话框
                    this.messageNote_dialog.deleteTimeDialog = false;
                }).catch(error => {
                    this.$message.error(error.toString());
                });
            },
            /**
             * 获取服务器列表
             */
            messageNote_selectServerList() {
                getServerList().then((response) => {
                    let res = response.data;
                    if (res.code !== '200') {
                        return this.$message.error('获取服务器列表，失败！');
                    }
                    // 获取服务器列表数据
                    this.messageNote_config.serverList = res.data;
                }).catch(error => {
                    this.$message.error(error.toString());
                });
            },

            /**
             * 获取虚拟主机列表
             */
            messageNote_selectHostList(id) {
                let params = {serverId: id};
                getHostList(params).then((response) => {
                    let res = response.data;
                    if (res.code !== '200') {
                        return this.$message.error('获取虚拟主机列表，失败！');
                    }
                    // 获取虚拟主机列表数据
                    this.messageNote_config.virtualHostList = res.data;
                }).catch(error => {
                    this.$message.error(error.toString());
                });
            },

            /**
             * 获取交换机列表
             */
            messageNote_selectExchangeList(id) {
                let params = {virtualHostId: id};
                getExchangeList(params).then((response) => {
                    let res = response.data;
                    if (res.code !== '200') {
                        return this.$message.error('获取交换机列表，失败！');
                    }
                    // 获取交换机列表数据
                    this.messageNote_config.exchangeList = res.data;
                }).catch(error => {
                    this.$message.error(error.toString());
                });
            },
            /**
             * 获取队列-列表
             */
            messageNote_selectQueueList(id) {
                let params = {virtualHostId: id};
                getQueueList(params).then((response) => {
                    let res = response.data;
                    if (res.code !== '200') {
                        return this.$message.error('获取队列-列表，失败！');
                    }
                    // 获取队列-列表数据
                    this.messageNote_config.queueList = res.data;
                }).catch(error => {
                    this.$message.error(error.toString());
                });
            },
            /**
             * 获取路由键-列表
             */
            messageNote_selectRoutingKeyList(id) {
                let params = {exchangeId: id};
                getRoutingKeyList(params).then((response) => {
                    let res = response.data;
                    if (res.code !== '200') {
                        return this.$message.error('获取路由键列表，失败！');
                    }
                    // 获取路由键列表数据
                    this.messageNote_config.routingKeyList = res.data;
                }).catch(error => {
                    this.$message.error(error.toString());
                });
            },

            /**
             * 添加方法，服务器ID值，改变
             */
            messageNote_server_addChange(value) {
                console.log("服务器ID值:" + value);
                // 现将对应的虚拟主机和交换机的ID清空
                this.messageNote_addForm.virtualHostId = undefined;
                this.messageNote_addForm.exchangeId = undefined;
                // 根据服务器ID，获取出对应的虚拟主机的列表
                this.messageNote_selectHostList(value);
                //
                // let obj = {};
                // this.messageNote_config.serverList.map(
                //     (item) => {
                //         if (item.serverId === value) {
                //             obj = item;
                //         }
                //     }
                // );
                // console.log(obj);
                // this.messageNote_addForm.serverName = obj.serverName;
            },
            /**
             * 添加方法，虚拟主机ID值，改变
             */
            messageNote_virtualHost_addChange(value) {
                console.log("虚拟主机ID值:" + value);
                // 先将对应的交换机和队列的ID清空
                this.messageNote_addForm.exchangeId = undefined;
                this.messageNote_addForm.queueId = undefined;

                // 根据虚拟主机ID，获取出对应的交换机和队列的列表
                this.messageNote_selectExchangeList(value);
                // this.messageNote_selectQueueList(value);
            },
            /**
             * 添加方法，交换机ID值，改变
             */
            messageNote_exchange_addChange(value) {
                console.log("交换机ID值:" + value);
                // 先将对应的路由键的ID清空
                this.messageNote_addForm.routingKeyId = undefined;
                // 根据交换机ID，获取出对应的路由键的列表
                this.messageNote_selectRoutingKeyList(value);
            },
            /**
             * 编辑方法，服务器ID值，改变
             */
            messageNote_server_editChange(value) {
                console.log("服务器ID值:" + value);
                // 现将对应的虚拟主机和交换机的ID清空
                this.messageNote_editForm.virtualHostId = undefined;
                this.messageNote_editForm.exchangeId = undefined;
                // 根据服务器ID，获取出对应的虚拟主机的列表
                this.messageNote_selectHostList(value);
            },
            /**
             * 编辑方法，虚拟主机ID值，改变
             */
            messageNote_virtualHost_editChange(value) {
                console.log("虚拟主机ID值:" + value);
                // 先将对应的交换机和队列的ID清空
                this.messageNote_editForm.exchangeId = undefined;
                this.messageNote_editForm.queueId = undefined;

                // 根据虚拟主机ID，获取出对应的交换机和队列的列表
                this.messageNote_selectExchangeList(value);
                // this.messageNote_selectQueueList(value);
            },
            /**
             * 编辑方法，交换机ID值，改变
             */
            messageNote_exchange_editChange(value) {
                console.log("交换机ID值:" + value);
                // 先将对应的路由键的ID清空
                this.messageNote_editForm.routingKeyId = undefined;
                // 根据交换机ID，获取出对应的路由键的列表
                this.messageNote_selectRoutingKeyList(value);
            },
            /**
             * 获取所有用户的信息
             */
            note_getUserInfoList() {
                getUserInfoList().then((response) => {
                    let res = response.data;
                    if (res.code !== '200') {
                        return this.$message.error('获取用户信息列表，失败！');
                    }
                    // 获取列表数据
                    this.messageNote_config.userInfoList = res.data;
                }).catch(error => {
                    this.$message.error(error.toString());
                });
            },
        },
        created() {
            // 刷新列表
            // this.messageNote_getList();
            // 获取删除时间
            this.selectDeleteTime();
        },
        mounted() {
            this.messageNote_selectServerList();
            this.note_getUserInfoList();
        },
        computed: {},
    }
</script>

<style scoped>

</style>