<template>
    <div class="basic-param-config">
        <el-scrollbar class="editScroll">
            <el-form
                class="param-config-form"
                ref="server"
                :model="server"
                label-width="210px"
                label-suffix=":"
                :rules="serRules"
            >
                <!-- <h4>redis参数配置</h4> -->
                <el-divider content-position="left">redis参数配置</el-divider>
                <el-row :gutter="10">
                    <el-col :span="16">
                        <el-form-item
                            label="风场Redis数据库地址"
                            prop="redisHost"
                        >
                            <el-input v-model="server.redisHost"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="10">
                    <el-col :span="8">
                        <el-form-item
                            label="风场Redis数据库端口"
                            prop="redisPort"
                        >
                            <el-input
                                v-model.number="server.redisPort"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            label="风场Redis数据库密码"
                            prop="redisPassword"
                        >
                            <el-input v-model="server.redisPassword">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            label="风场Redis数据库索引"
                            prop="redisDatabase"
                        >
                            <el-input
                                v-model.number="server.redisDatabase"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row :gutter="10">
                    <el-col :span="16">
                        <el-form-item
                            label="程序Redis数据库地址"
                            prop="redis2Host"
                        >
                            <el-input v-model="server.redis2Host"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row :gutter="10">
                    <el-col :span="8">
                        <el-form-item
                            label="程序Redis数据库端口"
                            prop="redis2Port"
                        >
                            <el-input
                                v-model.number="server.redis2Port"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            label="程序Redis数据库密码"
                            prop="redis2Password"
                        >
                            <el-input v-model="server.redis2Password">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            label="程序Redis数据库索引"
                            prop="redis2Database"
                        >
                            <el-input
                                v-model.number="server.redis2Database"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="10">
                    <el-col :span="8">
                        <el-form-item
                            label="Redis连接池最大空闲数"
                            prop="maxIdle"
                        >
                            <el-input
                                v-model.number="server.maxIdle"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            label="Redis连接池最小空闲数"
                            prop="minIdle"
                        >
                            <el-input v-model.number="server.minIdle">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            label="Redis连接连接超时时间"
                            prop="timeout"
                        >
                            <el-input v-model.number="server.timeout">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="Redis最大连接数" prop="maxActive">
                            <el-input v-model.number="server.maxActive">
                            </el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="10">
                    <el-col :span="8">
                        <el-form-item
                            label="scada数据system获取的key"
                            prop="systemKeys"
                        >
                            <el-input v-model="server.systemKeys"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            label="scada数据all获取的key"
                            prop="allKeys"
                        >
                            <el-input v-model="server.allKeys"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <!-- <h4>RabbitMQ参数配置</h4> -->
                <el-divider content-position="left"
                    >RabbitMQ参数配置</el-divider
                >
                <el-row :gutter="10">
                    <el-col :span="6">
                        <el-form-item
                            label="是否开启RabbitMQ"
                            prop="rabbitMqOpen"
                        >
                            <el-switch
                                v-model="server.rabbitMqOpen"
                                active-color="#13ce66"
                                inactive-color="#ff4949"
                            >
                            </el-switch>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="10" v-if='server.rabbitMqOpen'>
                    <el-col :span="16">
                        <el-form-item
                            label="RabbitMQ服务地址"
                            prop="rabbitMqHost"
                        >
                            <el-input v-model="server.rabbitMqHost">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="RabbitMQ端口" prop="rabbitMqPort">
                            <el-input v-model.number="server.rabbitMqPort">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            label="RabbitMQ服务登录用户名"
                            prop="rabbitmqUsername"
                        >
                            <el-input v-model="server.rabbitmqUsername">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            label="RabbitMQ登录密码"
                            prop="rabbitmqPassword"
                        >
                            <el-input v-model.number="server.rabbitmqPassword">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            label="RabbitMQ虚拟机"
                            prop="rabbitmqVirtualHost"
                        >
                            <el-input
                                v-model="server.rabbitmqVirtualHost"
                            >
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            label="RabbitMQ连接超时时间"
                            prop="rabbitmqConnectionTimeout"
                        >
                            <el-input
                                v-model.number="
                                    server.rabbitmqConnectionTimeout
                                "
                            >
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            label="消息发送至交换机确认"
                            prop="rabbitmqPublisherConfirmType"
                        >
                            <el-select
                                v-model="server.rabbitmqPublisherConfirmType"
                                placeholder="请选择"
                            >
                                <el-option
                                    v-for="item in confirmTypeOption"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                >
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>

                    <el-col :span="8">
                        <el-form-item
                            label="RabbitMQ交换机名称"
                            prop="rabbitmqExchangeName"
                        >
                            <el-input v-model="server.rabbitmqExchangeName">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            label="redis更新key的Topic"
                            prop="rabbitmqRedisUpdateTopic"
                        >
                            <el-input v-model="server.rabbitmqRedisUpdateTopic">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            label="cms状态数据Topic"
                            prop="rabbitmqCmsStateTopic"
                        >
                            <el-input v-model="server.rabbitmqCmsStateTopic">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            label="cms实时数据Topic"
                            prop="rabbitmqCmsDataTopic"
                        >
                            <el-input v-model="server.rabbitmqCmsDataTopic">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            label="是否开启confirms确认"
                            prop="springRabbitmqPublisherConfirms"
                        >
                            <el-switch
                                v-model="server.springRabbitmqPublisherConfirms"
                                active-color="#13ce66"
                                inactive-color="#ff4949"
                            >
                            </el-switch>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            label="是否开启 return确认"
                            prop="rabbitmqPublisherReturns"
                        >
                            <el-switch
                                v-model="server.rabbitmqPublisherReturns"
                                active-color="#13ce66"
                                inactive-color="#ff4949"
                            >
                            </el-switch>
                        </el-form-item>
                    </el-col>
                </el-row>
                <!-- server参数提交 -->
                <el-row :gutter="10" style="margin: 40px 0 20px">
                    <el-col :span="5">
                        <el-form-item> </el-form-item>
                    </el-col>
                    <el-col :span="14" style="text-align: center">
                        <!-- <el-form-item> -->
                        <!-- <el-button type="info" @click="getSerParams"
                            >获取参数</el-button
                        > -->
                        <el-button
                            type="primary"
                            @click="submitSerForm('server')"
                            >修改参数</el-button
                        >
                        <el-button type="warning" @click="activConfigParams">激活参数</el-button>
                        <!-- <el-button type="danger" @click="resetSerForm('server')"
                            >重置参数</el-button
                        > -->
                        <!-- </el-form-item> -->
                    </el-col>
                </el-row>
            </el-form>
        </el-scrollbar>
    </div>
</template>

<script>
export default {
    name: 'CompParamConfig',
    data() {
        return {
            server: {
                allKeys: '',
                maxIdle: '',
                maxWait: '',
                minIdle: '',
                rabbitMqHost: '',
                rabbitMqOpen: false,
                rabbitMqPort: '',
                rabbitmqCmsDataTopic: '',
                rabbitmqCmsStateTopic: '',
                rabbitmqConnectionTimeout: '',
                rabbitmqExchangeName: '',
                rabbitmqListenerSimpleAcknowledgeMode: '',
                rabbitmqListenerSimplePrefetch: '',
                rabbitmqPassword: '',
                rabbitmqPublisherConfirmType: '',
                rabbitmqPublisherReturns: '',
                rabbitmqRedisUpdateTopic: '',
                rabbitmqUsername: '',
                rabbitmqVirtualHost: '',
                maxActive: '',
                redis2Database: '',
                redis2Host: '',
                redis2Password: '',
                redis2Port: '',
                redisDatabase: '',
                redisHost: '',
                redisPassword: '',
                redisPort: '',
                springRabbitmqPublisherConfirms: '',
                systemKeys: '',
                timeout: '',
            },
            confirmTypeOption: [
                {
                    value: 'correlated',
                    label: 'correlated',
                },
                {
                    value: 'simple',
                    label: 'simple',
                },
                {
                    value: 'none',
                    label: 'none',
                },
            ],
            serRules: {
                redisHost: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                redisPort: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                redisPassword: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                redisDatabase: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                redis2Host: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                redis2Port: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                redis2Password: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                redis2Database: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                maxIdle: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                minIdle: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                timeout: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                maxActive: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                systemKeys: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                allKeys: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                rabbitMqHost: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                rabbitMqPort: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                rabbitmqUsername: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                rabbitmqPassword: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                rabbitmqVirtualHost: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                rabbitmqConnectionTimeout: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                rabbitmqPublisherConfirmType: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                rabbitmqExchangeName: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                rabbitmqRedisUpdateTopic: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                rabbitmqCmsStateTopic: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
                rabbitmqCmsDataTopic: [
                    {
                        required: true,
                        message: '必填',
                        trigger: 'blur',
                    },
                ],
            },
            baseUrl: window.context.Collection
        }
    },
    created() {
        this.getParams()
    },

    methods: {
        getParams() {
            this.$http
                .get(this.baseUrl + '/getServerConfigParams')
                .then((res) => {
                    if (res.data.success) {
                        this.server = res.data.data
                    }
                })
                .catch((err) => {
                    console.log(err)
                })
        },

        //server参数提交
        submitSerForm(server) {
            console.log(server, 'server')
            this.$refs[server].validate((valid) => {
                if (valid) {
                   this.$http
                        .post(
                            this.baseUrl + '/editServerConfigParams',
                            this.server
                        )
                        .then((res) => {
                            console.log(res, res.data)
                            if (res.data.success) {
                                this.$message.success('修改成功')
                                this.getParams()
                            }
                        })
                        .catch((err) => {
                            console.log(err)
                        })
                } else {
                    console.log('error submit!!')
                    return false
                }
            })
        },
        activConfigParams() {
            this.$http
                .post(this.baseUrl + '/activServerConfigParams', this.publicForm)
                .then((res) => {
                    console.log(res, res.data)
                    if (res.data.success) {
                        this.$message.success('激活成功');
                    }
                })
                .catch((err) => {
                    console.log(err)
                })
        }
    },
}
</script>
<style lang="scss" scoped>
.basic-param-config {
    width: 100%;
    height: 100%;
    .editScroll {
        height: 100% !important;
    }
    .param-config-form {
        width: calc(100% - 20px);
        margin: 0 auto;
        box-sizing: border-box;
    }
    h3 {
        font-size: 16px;
    }
    .el-row + .el-divider--horizontal {
        margin-top: 40px;
    }
    /deep/ .el-divider__text {
        font-size: 16px;
        font-weight: bold;
    }
}
</style>
<style>
.basic-param-config .el-scrollbar__wrap {
    overflow-x: hidden !important;
}
</style>