<template>
    <ap-container>
        <ap-main margin="1111">
            <div v-if="!showPage">
                <el-input v-model="secretKey" placeholder="请输入授权秘钥！" show-password style="width: 200px"></el-input>
                <el-button type="primary" @click="checkPageAuth">确定</el-button>
            </div>
            <ap-table v-if="showPage" ref="tDevDbSourceRef" :options.sync="tDevDbSourceOpt"></ap-table>
        </ap-main>
    </ap-container>
</template>

<script>
export default {
    name: 'DevDbSource',
    data() {
        let columns = [
            {
                prop: 'fdName',
                label: '连接名',
                type: 'input',
                width: 150,
            }, {
                prop: 'fdDbName',
                label: '数据库名称',
                type: 'input',
                width: 100,
            }, {
                prop: 'fdUrl',
                label: '数据库地址',
                type: 'input',
                minWidth: 200,
                showOverflowTooltip: true
            }, {
                prop: 'fdUserName',
                label: '数据库用户名',
                type: 'input',
                width: 100,
            }, {
                prop: 'fdPassword',
                label: '数据库密码',
                type: 'input',
                width: 100,
                html: function (value, row) {
                    return "******";
                }
            }, {
                prop: 'fdComment',
                label: '备注',
                type: 'input',
                minWidth: 150,
            }, {
                prop: "fdDisabled",
                label: "是否有效",
                type: "select",
                width: 100,
                selectOptions: [{label: "失效", value: 1}, {label: "有效", value: 0}],
                addDefaultValue: 0,
                align: "center",
                html: function (value, row) {
                    if (value == 1) {
                        return '<div class="ap-tag-danger">失效</div>'
                    } else if (value == 0) {
                        return '<div class="ap-tag-success">有效</el-tag>';
                    }
                }
            },
        ];
        let tableOpt = {
            title: "数据源管理",
            columns: columns,
            editPk: "fdId", //默认fdId
            deletePk: "fdId", // 默认fdId
            dataUrl: "/apd/db/TDevDbSource/getTDevDbSourceGridList",
            saveUrl: "/apd/db/TDevDbSource/saveTDevDbSourceGridData",
            deleteUrl: "/apd/db/TDevDbSource/deleteTDevDbSourceGridData",
            toolbarBtn: ["add", "edit", "del", "cancel", "refresh", "save"],
            initData: true, // 默认false
            params: {}
        };
        return {
            tDevDbSourceOpt: tableOpt,
            secretKey: '',
            showPage: false
        }
    },
    methods: {
        checkPageAuth() {
            this.$request({
                url: '/apd/db/TDevDbAuth/checkPageAuth',
                method: 'post',
                data: {
                    secretKey: this.secretKey
                }
            }).then(response => {
                if (response.data) {
                    this.showPage = true;
                } else {
                    this.$message.error("授权秘钥错误！")
                }
            })
        }
    }
}
</script>

<style scoped>
</style>
