<template>
    <div>
        <el-card class="el-card">

            <el-table v-loading="loading" :data="list" style="width: 100%">
                <el-table-column label="序号" type="index" show-overflow-tooltip="true"></el-table-column>
                <el-table-column label="接口名称" prop="name" show-overflow-tooltip="true"></el-table-column>
                <el-table-column label="接口地址" prop="apiUrl" show-overflow-tooltip></el-table-column>
                <el-table-column label="说明文档" prop="guideUrl"  show-overflow-tooltip></el-table-column>
                <el-table-column label="备注" prop="remark" show-overflow-tooltip></el-table-column>


            </el-table>
            <el-pagination
                :page-size="filterQuery.limit"
                @current-change="handlePageChange"
                layout="prev, pager, next"
                :total="total"
            ></el-pagination>
        </el-card>

    </div>
</template>
<script>

    import {findApi} from "../../../api/param/thirdSysApi";

    export default {
        data() {
            return {
                filterQuery: {
                    type:1,
                    page: 1,
                    limit: 20,
                },
                modifyDialogVisible: false,
                modifyDetailDialogVisible: false,
                list: [],
                inputQuery: null,
                inputDetailQuery: null,
                enableMap: {
                    true: "是",
                    false: "否",
                },
                detailList: null,
                total: 0,
            };
        },

        methods: {
            onReset() {
                this.$router.push({
                    path: "",
                });
                this.filterQuery = {
                    type:1,
                    page: 1,
                    limit: 20,
                };
                this.getList();
            },
            cancelDialog() {
                this.modifyDialogVisible = false;
                this.modifyDetailDialogVisible = false;
            },
            handleCurrentChange(row) {
                this.getDetailList(row);
            },
            getList() {
                this.loading = true;
                findApi(this.filterQuery)
                    .then((response) => {
                        this.loading = false;
                        this.list = response.data.list || [];

                    })
                    .catch(() => {
                        this.loading = false;
                        this.list = [];
                        this.total = 0;
                    });
            },




            onModifySubmit() {
                updateBasicThirdSys(this.inputQuery)
                    .then((response) => {
                        if (response.code == 20000) {
                            this.loading = false;
                            this.cancelDialog();
                            this.getList();
                            this.$message.success(response.data);
                        } else {
                            this.$message.error(response.message);
                        }

                    })
                    .catch(() => {
                        this.loading = false;
                        this.cancelDialog();
                    });
            },


            handleModifyClick(row) {
                this.modifyDialogVisible = true;
                this.inputQuery = row;
            },
        },
        components: {
        },
        mounted() {
        },
        created() {
            this.getList();
        },
    };
</script>
<style scoped>

    .el-card {
        margin-right: 20px;
        /*transition: all .5s;*/
    }

</style>

