<template>
    <div class="height100 overflow-a">
        <div class="obpm-title">
            <div class="d-inline-block">
                <i class="el-icon-folder title-icon"></i>
                <div class="title-name d-inline-block ml-2">{{$t("tabs.cb_info")}}</div>
            </div>
            <div class="bar d-inline-block float-right">
                <el-button type="primary" size="small" @click="onSaveBtn">{{$t("btns.save")}}</el-button>
            </div>
        </div>
        <div class="overflow-a" :style="{height: tableHeight}">
            <div class="mt-3">
                <h6>{{$t('cbinfo.bpm_title')}}：</h6>{{$t('cbinfo.bpm_desc')}}<br>
                <h6>{{$t('cbinfo.cb_config')}}:</h6>
                <table>
                    <tbody>
                        <tr><td>(1)URL:{{$t('cbinfo.cb_desc1')}}</td></tr>
                        <tr><td>(2)Token:{{$t('cbinfo.cb_desc2')}}</td></tr>
                        <tr><td>(3)EncodingAESkey:{{$t('cbinfo.cb_desc3')}}</td></tr>
                    </tbody>
                </table>
            </div>
            <div class="mt-3">
                <el-form :inline="true" class="demo-form-inline" @submit.native.prevent size="mini" label-position="left" label-width="120px">
                    <el-row>
                        <el-col :span="8">
                            <el-form-item label="URL:" >
                                <el-input v-model="cbInfo.URL"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" :offset='2'>
                            <el-form-item label="Token:" >
                                <el-input v-model="cbInfo.Token"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="8">
                            <el-form-item label="EncodingAESkey:">
                                <el-input v-model="cbInfo.EncodingAESkey"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
            </div>
            <div class="mt-3">
                <h6>{{$t('cbinfo.cb_log')}}</h6>
                <el-table
                ref="tableList"
                size='small'>
                <el-table-column
                    prop="targetHost"
                    :label="$t('cbinfo.callServerAddress')">
                </el-table-column>
                <el-table-column
                    prop="callBackTime"
                    :label="$t('cbinfo.cbTime')">
                </el-table-column>
                <el-table-column
                    prop="callBackResult"
                    :label="$t('cbinfo.cbResult')">
                </el-table-column>
                <el-table-column
                    prop="callBackParam"
                    :label="$t('cbinfo.cbPramas')">
                </el-table-column>
                <el-table-column
                    prop="token"
                    :label="$t('cbinfo.cbToken')">
                </el-table-column>
                <el-table-column
                    prop="key"
                    :label="$t('cbinfo.cbKey')">
                </el-table-column>
            </el-table>
            </div>
        </div>
    </div>
</template>
<script>
import { updateApplication,getApplications,getCbLogData} from "@/service/CommonApi.js";

export default {
    name:'cbInfo',
    data(){
        return {
            tableHeight: document.documentElement.clientHeight - 50 - 41 - 32 - 60 + "px",
            cbInfo:{
                URL:'',
                Token:'',
                EncodingAESkey:''
            },
            detail:{

            },
            data:[
                {

                }
            ]
        }
    },
    created(){
        this.getApplications();
        this.getLogData();
    },
    methods:{
        
        getApplications(){
            let appId = JSON.parse(this.$route.query.params).appId;
            getApplications({id:appId}, {
                onSucess: response => {
                    if (response.data.errcode == 0) {
                        this.detail = response.data.data;
                        this.cbInfo.URL=this.detail.url;
                        this.cbInfo.Token=this.detail.token;
                        this.cbInfo.EncodingAESkey=this.detail.encodingAESkey;
                    }
                }
            });
        },
        onSaveBtn(){
            let params={...this.detail,...this.cbInfo}
            updateApplication(params, {
              onSucess: response => {
                if (response.data.errcode == 0) {
                  this.$message({
                    message: this.$t('msg.ss'),
                    type: 'success'
                  });
                }
              }
            });
        },
        getLogData(){
            let appId = JSON.parse(this.$route.query.params).appId;
            getCbLogData(appId, {
              onSucess: response => {
                if (response.data.errcode == 0) {
                  this.data=response.data.data
                }
              }
            });
        },
    }
}
</script>