Tmr-Multilingual/src/views/basicData/sapLog/index.vue

<template>
  <div class="app-container">
    <div class="search">
      <el-select v-model="table.getdataListParm.parammaps.pastureId" filterable placeholder="牧场" class="filter-item" style="width: 150px;" clearable>
        <el-option v-for="item in pastureList" :key="item.pastureid" :label="item.pastureName" :value="item.pastureid" />
      </el-select>
      <el-select v-model="table.getdataListParm.parammaps.msgtype" placeholder="数据类型" class="filter-item" style="width: 150px;" clearable>
        <el-option v-for="item in dataTypeList" :key="item.Id" :label="item.value" :value="item.Id" />
      </el-select>
      <el-date-picker v-model="table.getdataListParm.parammaps.inputDatetime" class="inputDatetime filter-item" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" style="width: 250px;" />
      <el-button class="successBorder" @click="handleSearch">查询</el-button>
      <el-button class="successBorder" @click="handleRefresh">重置</el-button>
    </div>
    <div class="table">
      <el-table
        :key="table.tableKey"
        v-loading="table.listLoading"
        element-loading-text="给我一点时间"
        :data="table.list"
        border
        fit
        highlight-current-row
        style="width: 100%;"
        :row-style="rowStyle"
        :cell-style="cellStyle"
        class="elTable table-fixed"
      >
        <el-table-column label="牧场" min-width="90px" align="center" prop="pastureName" />
        <el-table-column label="数据类型" min-width="90px" align="center"  prop="msgtypeName" />
        <el-table-column label="请求参数" min-width="120px" align="center">
          <template slot-scope="scope">
              <el-tooltip placement="top" :open-delay="1000">
                <div slot="content">
                  <div> {{ scope.row.request }} </div>
                </div>
                <div style="width: 100%;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">{{ scope.row.request }}</div>
              </el-tooltip>
            </template>
        </el-table-column>
        <el-table-column label="响应参数" min-width="120px" align="center">
          <template slot-scope="scope">
              <el-tooltip placement="top" :open-delay="1000">
                <div slot="content">
                  <div> {{ scope.row.response }} </div>
                </div>
                <div style="width:100%;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">{{ scope.row.response }}</div>
              </el-tooltip>
            </template>
        </el-table-column>
        <el-table-column label="返回状态" min-width="90px" align="center" prop="status" />
        <el-table-column label="消息文本" min-width="90px" align="center" prop="msgtext" />
        <el-table-column label="请求地址" min-width="90px" align="center" prop="url" />
        <el-table-column label="创建时间" min-width="90px" align="center" prop="createTime" />
      </el-table>
    </div>
  </div>

</template>

<script>
  import { GetDataByName,GetDataByNames  } from '@/api/common'
  import { parseTime } from '@/utils/index.js'
  import Cookies from 'js-cookie'
export default {
  name: 'SapLog',
  data() {
    return {
      table:{
        getdataListParm:{
          name: 'getSaplogList',
          page: 1,
          offset: 1,
          pagecount: parseInt(Cookies.get('pageCount')),
          returntype: 'Map',
          parammaps: {
            pastureid: Cookies.get('pastureid'),
            startTime:'',
            endTime:'',
            inputDatetime:''
          }
        },
        tableKey: 0,
        list: [],
        total: 0,
        listLoading: true,
        temp: {}
      },
      requestParams:[
        { name: 'getSapPullDown', offset: 0, pagecount: 0, parammaps: { pastureid: Cookies.get('pastureid') }},
        { name: 'getPastureList', offset: 0, pagecount: 0, parammaps: { pastureid: Cookies.get('pastureid') }},
      ],
      dataTypeList:[],pastureList:[],
      rowStyle: { maxHeight: 30 + 'px', height: 30 + 'px' },
      cellStyle: { padding: 0 + 'px' },
    }
  },
  created() {
    this.getDownList()
    this.getList()
  },

  methods: {
    getDownList(){
      GetDataByNames(this.requestParams).then(response => {
        this.dataTypeList = response.data.getSapPullDown.list
        this.pastureList = response.data.getPastureList.list
      })
    },
    getList() {
      this.table.listLoading = true
      GetDataByName(this.table.getdataListParm).then(response => {
        console.log('table数据', response.data.list)
        if (response.data.list !== null) {
          this.table.list = response.data.list
          this.table.pageNum = response.data.pageNum
          this.table.pageSize = response.data.pageSize
        } else {
          this.table.list = []
        }
        this.table.total = response.data.total
        setTimeout(() => {
          this.table.listLoading = false
        }, 100)
      })
    },
    handleSearch(){
      if (this.table.getdataListParm.parammaps.inputDatetime !== '' && this.table.getdataListParm.parammaps.inputDatetime !== null) {
        this.table.getdataListParm.parammaps.startTime = parseTime(this.table.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
        this.table.getdataListParm.parammaps.endTime = parseTime(this.table.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
      } else {
        this.table.getdataListParm.parammaps.inputDatetime = ''
        this.table.getdataListParm.parammaps.startTime = ''
        this.table.getdataListParm.parammaps.endTime = ''
      }
      this.table.getdataListParm.offset = 1
      this.getList()
    },
    handleRefresh(){

    }
  }
}
</script>