tmr-admin/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">
          <template slot-scope="scope">
            <span >{{scope.row.msgtypeName}}</span>
            <!-- <span @click="clickType(scope.row)">{{scope.row.msgtypeName}}</span> -->
          </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.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>

    <!-- 数据类型 -->
    <el-dialog :title="textMap[type.dialogStatus]"  :visible.sync="type.dialogFormVisible" :close-on-click-modal="false" width="50%">
      <div class="app-type">
        <div class="table" v-if="type.temp.msgtypeName == '搅拌'">
          <el-table
            :key="type.table.tableKey"
            v-loading="type.table.listLoading"
            element-loading-text="给我一点时间"
            :data="type.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="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-column label="原料" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="原料顺序" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="理论重量" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="实际重量" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="开始时间" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="结束时间" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="驾驶员" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="自拌料-饲料顺序" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="自拌料-饲料名称" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="自拌料-饲料重量" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="实际重量修改记录" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="修改时间" min-width="90px" align="center" prop="createTime" />
          </el-table>
        </div>
        <div class="table" v-else-if="type.temp.msgtypeName == '配方'">
          <el-table
            :key="type.table.tableKey"
            v-loading="type.table.listLoading"
            element-loading-text="给我一点时间"
            :data="type.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="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-column label="重量" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="顺序" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="允许误差" min-width="90px" align="center" prop="createTime" />
          </el-table>
        </div>
        <div class="table" v-else-if="type.temp.msgtypeName == '发料'">
          <el-table
            :key="type.table.tableKey"
            v-loading="type.table.listLoading"
            element-loading-text="给我一点时间"
            :data="type.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="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-column label="存栏" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="发料顺序" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="理论重量" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="实际重量" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="开始时间" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="结束时间" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="驾驶员" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="配方名称" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="饲料顺序" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="饲料名称" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="饲料重量" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="自拌料-饲料顺序" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="自拌料-饲料名称" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="自拌料-饲料重量" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="实际重量修改记录" min-width="90px" align="center" prop="createTime" />
            <el-table-column label="修改时间" min-width="90px" align="center" prop="createTime" />
          </el-table>
        </div>
        <div class="table" v-else>
          <el-table
            :key="type.table.tableKey"
            v-loading="type.table.listLoading"
            element-loading-text="给我一点时间"
            :data="type.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="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>
        </div>
        <span v-if="type.table.listLoading == false" style="margin-right: 30px;margin-top: 10px;font-size: 14px;">共{{ type.table.total }}条</span>
        <div slot="footer" class="dialog-footer">
          <el-button class="cancelClose1" @click="type.dialogFormVisible = false;getList()">关闭</el-button>
        </div>
      </div>
    </el-dialog>
  </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:[],
      textMap: {
        type: '搅拌数据类型详情',
      },
      type:{
        dialogFormVisible: false,
        dialogStatus: '',
        table:{
          tableKey: 0,
          list: [],
          total: 0,
          listLoading: false,
        },
        temp:{}
      },
      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(){

    },
    clickType(row){
      this.type.temp = Object.assign({},row)
      this.type.temp.msgtypeName = '搅拌'
      this.type.dialogStatus = 'type'
      this.type.dialogFormVisible = true
    }
  }
}
</script>