ngds/backendEle/src/views/config/api-opt.vue

<template>
  <div v-loading="loading">
    <div class="panel" v-if="permission.hasPermission(`config/api`)">
      <div class="panel-heading">
        百度OCR
      </div>
      <div class="panel-wrapper">
        <div class="panel-body">
          <el-table :data="ocrTableData" stripe style="width: 100%;">
            <el-table-column prop="DESCRIPTION" label="接口">
              <template slot-scope="scope">
                <el-tag type="warning" size="small" class="no-border">{{scope.row.DESCRIPTION}}</el-tag>
              </template>
            </el-table-column>
            <el-table-column label="是否启用">
              <template slot-scope="scope">
                <span v-if="scope.row.STATUS==='1'">已启用</span>
                <span v-if="scope.row.STATUS==='0'">已停用</span>
              </template>
            </el-table-column>
            <el-table-column label="修改人">
              <template slot-scope="scope">
                {{scope.row.UPDATE_ADMIN_NAME}}
              </template>
            </el-table-column>
            <el-table-column label="修改时间">
              <template slot-scope="scope">
                {{tool.formatDate(scope.row.UPDATED_AT)}}
              </template>
            </el-table-column>
            <el-table-column fixed="right" label="操作" width="180">
              <template slot-scope="scope">
                <el-dropdown size="small" trigger="click" @click.stop="" v-if="permission.hasPermission(`config/ocr-api-edit`)">
                  <el-button type="primary" size="small">
                    Action<i class="el-icon-arrow-down el-icon--right"></i>
                  </el-button>
                  <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item command="edit" @click.native="handleEdit('ocr', scope.row)">Edit</el-dropdown-item>
                  </el-dropdown-menu>
                </el-dropdown>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
    </div>

    <div class="panel" v-if="permission.hasPermission(`config/api`)">
      <div class="panel-heading">
        短信接口
      </div>
      <div class="panel-wrapper">
        <div class="panel-body">
          <el-table :data="smsTableData" stripe style="width: 100%;">
            <el-table-column prop="DESCRIPTION" label="接口">
              <template slot-scope="scope">
                <el-tag type="warning" size="small" class="no-border">{{scope.row.DESCRIPTION}}</el-tag>
              </template>
            </el-table-column>
            <el-table-column label="是否启用">
              <template slot-scope="scope">
                <span v-if="scope.row.STATUS==='1'">已启用</span>
                <span v-if="scope.row.STATUS==='0'">已停用</span>
              </template>
            </el-table-column>
            <el-table-column label="修改人">
              <template slot-scope="scope">
                {{scope.row.UPDATE_ADMIN_NAME}}
              </template>
            </el-table-column>
            <el-table-column label="修改时间">
              <template slot-scope="scope">
                {{tool.formatDate(scope.row.UPDATED_AT)}}
              </template>
            </el-table-column>
            <el-table-column fixed="right" label="操作" width="180">
              <template slot-scope="scope">
                <el-dropdown size="small" trigger="click" @click.stop="" v-if="permission.hasPermission(`config/sms-api-edit`)">
                  <el-button type="primary" size="small">
                    Action<i class="el-icon-arrow-down el-icon--right"></i>
                  </el-button>
                  <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item command="edit" @click.native="handleEdit('sms', scope.row)">Edit</el-dropdown-item>
                  </el-dropdown-menu>
                </el-dropdown>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
    </div>

  </div>
</template>

<script>
import Vue from 'vue'
import network from '@/utils/network'
import tool from '@/utils/tool'
import permission from '@/utils/permission'

export default {
  name: 'config_api-opt',
  mounted () {
    this.getData()
  },
  data () {
    return {
      ocrTableData: null,
      smsTableData: null,
      loading: true,
      tool: tool,
      permission: permission,
    }
  },
  methods: {
    handleEdit (type, row) {
      this.$router.push({path: `/config/api-edit/${type}/${row.ID}`})
    },
    getData () {
      network.getData('config/ocr-api').then(response => {
        this.ocrTableData = response.list
        return network.getData('config/sms-api')
      }).then(response => {
        this.smsTableData = response.list
        this.loading = false
      })
    },
  }
}
</script>

<style scoped>

</style>