<template>
  <div class="app-container">
    <div class="table1" v-if="isTable1">
      <div class="search">
        <el-select v-model="table1.parammaps.pastureid" filterable placeholder="全部牧场" class="filter-item" style="width: 120px;" clearable>
          <el-option v-for="item in table1.pastureList" :key="item.pastureid" :label="item.pasturename" :value="item.pastureid" />
        </el-select>
        <el-date-picker v-model="table1.parammaps.inputDatetime" type="daterange"  class="filter-item" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" />
        <el-button class="successBorder" @click="handleSearch1">查询</el-button>
        <el-button class="successBorder" @click="handleRefresh1">重置</el-button>
      </div>
      <div class="table">
        <el-table
          :key="table1.tableKey"
          v-loading="table1.listLoading"
          element-loading-text="给我一点时间"
          :data="table1.list"
          border
          fit
          highlight-current-row
          style="width: 100%;"
          :row-style="rowStyle"
          :cell-style="cellStyle"
          class="elTable table-fixed"
        >
          <el-table-column label="序号" align="center" type="index" width="50px">
            <template slot-scope="scope">
              <span v-if="table1.pageNum">{{ scope.$index + (table1.pageNum-1) * table1.pageSize + 1 }}</span>
              <span v-else>1</span>
            </template>
          </el-table-column>
          <el-table-column sortable label="牧场" min-width="60px" align="center" prop="牧场" />
          <el-table-column sortable label="成母牛数" min-width="60px" align="center" prop="成母牛数" />
          <el-table-column sortable label="脖环佩戴数" min-width="60px" align="center" prop="佩戴脖环数" />
          <el-table-column sortable label="泌乳牛未佩戴" min-width="60px" align="center" prop="泌乳牛未佩戴脖环数" />
          <el-table-column sortable label="干奶牛未佩戴" min-width="60px" align="center" prop="干奶牛未佩戴" />
          <el-table-column sortable label="青年牛未佩戴" min-width="60px" align="center" prop="青年牛未佩戴" />
          <el-table-column sortable label="脖环工作数" min-width="60px" align="center" prop="脖环工作数量" />
          <el-table-column sortable label="异常脖环" min-width="60px" align="center" prop="异常脖环">
            <template slot-scope="{row}">
              <a @click="clickCell1(row)" style="text-decoration: underline;color: #0000FF;">{{ row['异常脖环数量'] }}</a>
            </template>
          </el-table-column>
          <el-table-column sortable label="安装接收器数量" min-width="60px" align="center" prop="接收器安装数量">
            <template slot-scope="{row}">
              <a @click="clickCell2(row)" style="text-decoration: underline;color: #0000FF;">{{ row['接收器安装数量'] }}</a>
            </template>
          </el-table-column>

          <el-table-column sortable label="接收器工作数量" min-width="60px" align="center" prop="接收器工作数量" />
          <el-table-column sortable label="8小时接收率" min-width="60px" align="center" prop="8小时接收率">
            <template slot-scope="{row}">
              <a @click="clickCell3(row)" style="text-decoration: underline;color: #0000FF;">{{ row['8小时接收率'] }}</a>
            </template>
          </el-table-column>
          <el-table-column sortable label="脖环数据丢失头数" min-width="60px" align="center" prop="记录丢失牛只数">
            <template slot-scope="{row}">
              <a @click="clickCell4(row)" style="text-decoration: underline;color: #0000FF;">{{ row['记录丢失牛只数'] }}</a>
            </template>
          </el-table-column>
          <el-table-column sortable label="脖环数据丢失数量" min-width="60px" align="center" prop="丢失记录数">
            <template slot-scope="{row}">
              <a @click="clickCell5(row)" style="text-decoration: underline;color: #0000FF;">{{ row['丢失记录数'] }}</a>
            </template>
          </el-table-column>
          <el-table-column sortable label="统计时间" min-width="60px" align="center" prop="统计时间" />
        </el-table>
        <pagination v-show="table1.total>0" :total="table1.total" :page.sync="table1.offset" :limit.sync="table1.pagecount" @pagination="getList1" />
      </div>
    </div>

    <!-- 异常脖环 -->
    <div class="table2" v-if="isTable2">
      <div class="search">
        <el-select v-model="table2.parammaps.reason" filterable placeholder="异常类型" class="filter-item" style="width: 120px;" clearable>
          <el-option v-for="item in table2.exceptionTypeList" :key="item.id" :label="item.name" :value="item.id" />
        </el-select>
        <el-select v-model="table2.parammaps.measure" filterable placeholder="检查结果" class="filter-item" style="width: 120px;" clearable>
          <el-option v-for="item in table2.inspectionResultsList" :key="item.id" :label="item.name" :value="item.id" />
        </el-select>
        <el-button class="successBorder" @click="handleSearch2">查询</el-button>
        <el-button class="successBorder" @click="handleRefresh2">重置</el-button>
      </div>
      <div class="top">
        牧场:{{temp['牧场']}}<br/>
        日期:{{temp['统计时间']}}<br/>
      </div>
      <div class="table">
        <el-table
          :key="table2.tableKey"
          v-loading="table2.listLoading"
          element-loading-text="给我一点时间"
          :data="table2.list"
          border
          fit
          highlight-current-row
          style="width: 100%;"
          :row-style="rowStyle"
          :cell-style="cellStyle"
          class="elTable table-fixed"
        >
          <el-table-column label="序号" align="center" type="index" width="50px">
            <template slot-scope="scope">
              <span v-if="table2.pageNum">{{ scope.$index + (table2.pageNum-1) * table2.pageSize + 1 }}</span>
              <span v-else>1</span>
            </template>
          </el-table-column>
          <el-table-column sortable label="牛号" min-width="60px" align="center" prop="COW_NUM" />
          <el-table-column sortable label="脖环号" min-width="60px" align="center" prop="REGIST_NUM_2" />
          <el-table-column sortable label="脖环佩戴日期" min-width="60px" align="center" prop="REGIST_NUM_2DATE" />
          <el-table-column sortable label="牛舍号" min-width="60px" align="center" prop="HOUSE_NAME" />
          <el-table-column sortable label="异常类型" min-width="60px" align="center" prop="reason" />
          <el-table-column sortable label="接收数量" min-width="60px" align="center" prop="lose" />
          <el-table-column sortable label="高活动量数量" min-width="60px" align="center" prop=" loseh" />
          <el-table-column sortable label="电池电量" min-width="60px" align="center" prop="voltage" />
          <el-table-column sortable label="检查结果" min-width="60px" align="center" prop="measure" />
          <el-table-column sortable label="最后统计时间" min-width="60px" align="center" prop="createtime" />
        </el-table>
        <pagination v-show="table2.total>=0" :total="table2.total" :page.sync="table2.offset" :limit.sync="table2.pagecount" @pagination="getList2()" />
      </div>
      <el-button class="export" style="float: right;margin-top: 10px;" @click="goBack()">返回</el-button>
    </div>

    <!-- 安装接收器数量 -->
    <div class="table3" v-if="isTable3">
      <div class="top">
       牧场:{{temp['牧场']}}<br/>
       日期:{{temp['统计时间']}}<br/>
      </div>
      <div class="table">
        <el-table
          :key="table3.tableKey"
          v-loading="table3.listLoading"
          element-loading-text="给我一点时间"
          :data="table3.list"
          border
          fit
          highlight-current-row
          style="width: 100%;"
          :row-style="rowStyle"
          :cell-style="cellStyle"
          class="elTable table-fixed"
        >
          <el-table-column label="序号" align="center" type="index" width="50px">
            <template slot-scope="scope">
              <span v-if="table3.pageNum">{{ scope.$index + (table3.pageNum-1) * table3.pageSize + 1 }}</span>
              <span v-else>1</span>
            </template>
          </el-table-column>
          <el-table-column sortable label="牛舍号" min-width="60px" align="center" prop="PHYSICALNAME" />
          <el-table-column sortable label="接收器编号" min-width="60px" align="center" prop="filed2" />
          <el-table-column sortable label="接收器定位" min-width="60px" align="center" prop="filed2">
            <template slot-scope="{row}">
              <a @click="clickReceiverPositioning(row)" style="text-decoration: underline;color: #0000FF;">{{ row.filed2 }}</a>
            </template>
          </el-table-column>
          <el-table-column sortable label="2小时接收率" min-width="60px" align="center" prop="p2h" />
          <el-table-column sortable label="4小时接收率" min-width="60px" align="center" prop="p4h" />
          <el-table-column sortable label="6小时接收率" min-width="60px" align="center" prop="p6h" />
          <el-table-column sortable label="8小时接收率" min-width="60px" align="center" prop="p8h" />
          <el-table-column sortable label="24小时接收率" min-width="60px" align="center" prop="p24h" />
          <el-table-column sortable label="最后统计时间" min-width="60px" align="center" prop="createtime" />
        </el-table>
        <pagination v-show="table3.total>=0" :total="table3.total" :page.sync="table3.offset" :limit.sync="table3.pagecount" @pagination="getList3()" />
      </div>
      <el-button class="export" style="float: right;margin-top: 10px;" @click="goBack()">返回</el-button>

      <el-dialog :title="textMap[set.dialogStatus]" :visible.sync="set.dialogFormVisible" :close-on-click-modal="false"
        width="50%">
        <div class="set">
          <div class="content">
            <div class="draggable-box" id="box">
              <img :src="set.bgImg" style="height: 100%;width: 100%;">
              <div class="draggable-item"  v-for="(item,index) in set.positionList" :key="index" :style="item.style"> {{item.title}} </div>
            </div>
          </div>
        </div>
        <div slot="footer" class="dialog-footer" style="bottom: 10px;">
          <el-button class="cancelClose1" @click="set.dialogFormVisible = false; ">返回</el-button>
        </div>
      </el-dialog>
    </div>

    <!-- 8小时接收率 -->
    <div class="table4" v-if="isTable4">
      <div class="top">
        牧场:{{temp['牧场']}}<br/>
        日期:{{temp['统计时间']}}<br/>
      </div>
      <div class="table">
        <el-table
          :key="table4.tableKey"
          v-loading="table4.listLoading"
          element-loading-text="给我一点时间"
          :data="table4.list"
          border
          fit
          highlight-current-row
          style="width: 100%;"
          :row-style="rowStyle"
          :cell-style="cellStyle"
          class="elTable table-fixed"
        >
          <el-table-column label="序号" align="center" type="index" width="50px">
            <template slot-scope="scope">
              <span v-if="table4.pageNum">{{ scope.$index + (table4.pageNum-1) * table4.pageSize + 1 }}</span>
              <span v-else>1</span>
            </template>
          </el-table-column>
          <el-table-column sortable label="牛舍名称" min-width="60px" align="center" prop="HOUSE_NAME" />
          <el-table-column sortable label="2小时接收率" min-width="60px" align="center" prop="p2h" />
          <el-table-column sortable label="4小时接收率" min-width="60px" align="center" prop="p4h" />
          <el-table-column sortable label="6小时接收率" min-width="60px" align="center" prop="p6h" />
          <el-table-column sortable label="8小时接收率" min-width="60px" align="center" prop="p8h" />
          <el-table-column sortable label="最后统计时间" min-width="60px" align="center" prop="createtime" />
        </el-table>
        <pagination v-show="table4.total>0" :total="table4.total" :page.sync="table4.offset" :limit.sync="table4.pagecount" @pagination="getList4()" />
      </div>
      <el-button class="export" style="float: right;margin-top: 10px;" @click="goBack()">返回</el-button>
    </div>

    <!-- 脖环数据丢失头数 -->
    <div class="table5" v-if="isTable5">
      <div class="top">
        牧场:{{temp['牧场']}}<br/>
        日期:{{temp['统计时间']}}<br/>
      </div>
      <div class="table">
        <el-table
          :key="table5.tableKey"
          v-loading="table5.listLoading"
          element-loading-text="给我一点时间"
          :data="table5.list"
          border
          fit
          highlight-current-row
          style="width: 100%;"
          :row-style="rowStyle"
          :cell-style="cellStyle"
          class="elTable table-fixed"
        >
          <el-table-column label="序号" align="center" type="index" width="50px">
            <template slot-scope="scope">
              <span v-if="table5.pageNum">{{ scope.$index + (table5.pageNum-1) * table5.pageSize + 1 }}</span>
              <span v-else>1</span>
            </template>
          </el-table-column>
          <el-table-column sortable label="牛号" min-width="60px" align="center" prop="COW_NUM" />
          <el-table-column sortable label="脖环号" min-width="60px" align="center" prop="REGIST_NUM_2" />
          <el-table-column sortable label="脖环佩戴日期" min-width="60px" align="center" prop="REGIST_NUM_2DATE" />
          <el-table-column sortable label="牛舍号" min-width="60px" align="center" prop="HOUSE_NAME" />
          <el-table-column sortable label="丢失数据条数" min-width="60px" align="center" prop="lose" />
          <el-table-column sortable label="电池电量" min-width="60px" align="center" prop="voltage" />
          <el-table-column sortable label="最后统计时间" min-width="60px" align="center" prop="createtime" />
        </el-table>
        <pagination v-show="table5.total>0" :total="table5.total" :page.sync="table5.offset" :limit.sync="table5.pagecount" @pagination="getList5()" />
      </div>
      <el-button class="export" style="float: right;margin-top: 10px;" @click="goBack()">返回</el-button>
    </div>

    <!-- 脖环数据丢失数量 -->
      <div class="table6" v-if="isTable6">
        <div class="top">
         牧场:{{temp['牧场']}}<br/>
         日期:{{temp['统计时间']}}<br/>
        </div>
        <div class="table">
          <el-table
            :key="table6.tableKey"
            v-loading="table6.listLoading"
            element-loading-text="给我一点时间"
            :data="table6.list"
            border
            fit
            highlight-current-row
            style="width: 100%;"
            :row-style="rowStyle"
            :cell-style="cellStyle"
            class="elTable table-fixed"
          >
            <el-table-column label="序号" align="center" type="index" width="50px">
              <template slot-scope="scope">
                <span v-if="table6.pageNum">{{ scope.$index + (table6.pageNum-1) * table6.pageSize + 1 }}</span>
                <span v-else>1</span>
              </template>
            </el-table-column>
            <el-table-column sortable label="牛号" min-width="60px" align="center" prop="COW_NUM" />
            <el-table-column sortable label="脖环号" min-width="60px" align="center" prop="REGIST_NUM_2" />
            <el-table-column sortable label="脖环佩戴日期" min-width="60px" align="center" prop="REGIST_NUM_2DATE" />
            <el-table-column sortable label="牛舍号" min-width="60px" align="center" prop="HOUSE_NAME" />
            <el-table-column sortable label="电池电量" min-width="60px" align="center" prop="voltage" />
            <el-table-column sortable label="最后统计时间" min-width="60px" align="center" prop="createtime" />
          </el-table>
          <pagination v-show="table6.total>0" :total="table6.total" :page.sync="table6.offset" :limit.sync="table6.pagecount" @pagination="getList6" />
        </div>
        <el-button class="export" style="float: right;margin-top: 10px;" @click="goBack()">返回</el-button>
      </div>

  </div>
</template>

<script>
  import Pagination from '@/components/Pagination'
  import { postJson,getJson } from '@/api/common'
  import { parseTime } from '@/utils/index.js'
  import Cookies from 'js-cookie'
  export default {
    name: 'NeckRingOperation',
    components: { Pagination },
    data() {
      return {
        table1:{
          pastureList:[],
          page: 1, offset: 1, pagecount: parseInt(Cookies.get('pageCount')),
          parammaps: { pastureid:'',inputDatetime:'',startdate:'',enddate:'' },
          tableKey: 0, list: [], total: 0, listLoading: false
        },
        // 异常脖环
        table2:{
          exceptionTypeList:[{id:-1,name:'疑似脱落'},{id:1,name:'无信号'},{id:2,name:'接收少'},{id:3,name:'电量低'},{id:4,name:'数据延迟'},{id:5,name:'活动量低'},{id:6,name:'数据丢失'},{id:7,name:'数据丢失明细'}],
          inspectionResultsList:[{id:0,name:'信号范围之外'},{id:1,name:'更换'}],
          page: 1, offset: 1, pagecount: parseInt(Cookies.get('pageCount')),
          parammaps: { reason:'',measure:''},
          tableKey: 0, list: [], total: 0, listLoading: false
        },
        // 安装接收器数量
        table3:{
          page: 1, offset: 1, pagecount: parseInt(Cookies.get('pageCount')),
          parammaps: {},
          tableKey: 0, list: [], total: 0, listLoading: false
        },

        // 8小时接收率
        table4:{
          page: 1, offset: 1, pagecount: parseInt(Cookies.get('pageCount')),
          parammaps: {},
          tableKey: 0, list: [], total: 0, listLoading: false
        },
        // 脖环数据丢失头数
        table5:{
          page: 1, offset: 1, pagecount: parseInt(Cookies.get('pageCount')),
          parammaps: {},
          tableKey: 0, list: [], total: 0, listLoading: false
        },
        // 脖环数据丢失数量
        table6:{
          page: 1, offset: 1, pagecount: parseInt(Cookies.get('pageCount')),
          parammaps: {},
          tableKey: 0, list: [], total: 0, listLoading: false
        },
        temp:{},
        isTable1:true,
        isTable2:false,
        isTable3:false,
        isTable4:false,
        isTable5:false,
        isTable6:false,
        set: {
          dialogStatus: '',
          dialogFormVisible: false,
          temp: {},
          positionList:[],//位置列表
          bgImg:'https://s3.bmp.ovh/imgs/2022/07/20/6c1ac9b5151fca72.png'
        },
        textMap: {
          setTxt: '查看'
        },
        rowStyle: { maxHeight: 30 + 'px', height: 30 + 'px' },
        cellStyle: { padding: 0 + 'px' }
      }
    },
    created() {
      this.getList1()
      this.getPastureList()
    },
    methods: {
      getPastureList(){
        let data = 'index=' + 1
        + '&pagesize=' + ''
        let url = 'public/pasture?'
        getJson(url,data).then(response => {
          if (response.code == 200) {
            this.table1.pastureList = response.data.list
          } else {
            this.table1.pastureList = []
          }
        })
      },
      getList1() {
        this.table1.listLoading = true
        if(this.table1.parammaps.inputDatetime !== '' && this.table1.parammaps.inputDatetime !== null){
          this.table1.parammaps.startdate = parseTime(this.table1.parammaps.inputDatetime[0],'{y}-{m}-{d}')
          this.table1.parammaps.enddate = parseTime(this.table1.parammaps.inputDatetime[1],'{y}-{m}-{d}')
        }else{
          this.table1.parammaps.startdate = ''
          this.table1.parammaps.enddate = ''
          this.table1.parammaps.inputDatetime = ''
        }
        let data = {
          name:'getOperation',
          page: this.table1.page, offset: this.table1.offset, pagecount: this.table1.pagecount, returntype: 'Map',
          parammaps: this.table1.parammaps
        }
        let url = 'authdata/GetDataByName'
         postJson(url,data).then(response => {
          if (response.data.list !== null) {
            console.log('table数据', response.data.list)
            this.table1.list = response.data.list
            this.table1.pageNum = response.data.pageNum
            this.table1.pageSize = response.data.pageSize
          } else {
            this.table1.list = []
          }
          this.table1.total = response.data.total
          setTimeout(() => {
            this.table1.listLoading = false
          }, 100)
        })
      },
      handleSearch1(){
        this.table1.offset = 1
        this.getList1()
      },
      handleRefresh1(){
        this.table1.offset = 1
        this.table1.parammaps.pastureid = ''
        this.table1.parammaps.inputDatetime = ''
        this.getList1()
      },
      clickCell1(row){
        //异常脖环
        this.temp = Object.assign({}, row)
        this.isTable1 = false
        this.isTable2 = true
        this.isTable3 = false
        this.isTable4 = false
        this.isTable5 = false
        this.isTable6 = false
        this.getList2()
      },
      clickCell2(row){
        // 安装接收器数量
        this.temp = Object.assign({}, row)
        this.isTable1 = false
        this.isTable2 = false
        this.isTable3 = true
        this.isTable4 = false
        this.isTable5 = false
        this.isTable6 = false
        this.getList3()
      },
      clickCell3(row){
        // 8小时接收率
        this.temp = Object.assign({}, row)
        this.isTable1 = false
        this.isTable2 = false
        this.isTable3 = false
        this.isTable4 = true
        this.isTable5 = false
        this.isTable6 = false
        this.getList4()
      },
      clickCell4(row){
        // 脖环数据丢失头数
        this.temp = Object.assign({}, row)
        this.isTable1 = false
        this.isTable2 = false
        this.isTable3 = false
        this.isTable4 = false
        this.isTable5 = true
        this.isTable6 = false
        this.getList5()
      },
      clickCell5(row){
        // 脖环数据丢失数量
        this.temp = Object.assign({}, row)
        this.isTable1 = false
        this.isTable2 = false
        this.isTable3 = false
        this.isTable4 = false
        this.isTable5 = false
        this.isTable6 = true
        this.getList6()
      },
      //异常脖环
      getList2() {
        this.table2.listLoading = true
        this.table2.parammaps.pastureid = this.temp.FARM_UUID
        let data = {
          name:'getAbnormal',
          page: this.table2.page, offset: this.table2.offset, pagecount: this.table2.pagecount, returntype: 'Map',
          parammaps: this.table2.parammaps
        }
        let url = 'authdata/GetDataByName'
        postJson(url,data).then(response => {
          if (response.data.list !== null) {
            console.log('table数据', response.data.list)
            this.table2.list = response.data.list
            this.table2.pageNum = response.data.pageNum
            this.table2.pageSize = response.data.pageSize
          } else {
            this.table2.list = []
          }
          this.table2.total = response.data.total
          setTimeout(() => {
            this.table2.listLoading = false
          }, 100)
        })
      },
      handleSearch2(){
        this.table2.offset = 1
        this.getList2()
      },
      handleRefresh2(){
        this.table2.offset = 1
        this.getList2()
      },
      // 安装接收器数量
      getList3() {
        this.table3.listLoading = true
        this.table3.parammaps.pastureid = this.temp.FARM_UUID
        let data = {
          name:'getNumberOfReceivers',
          page: this.table3.page, offset: this.table3.offset, pagecount: this.table3.pagecount, returntype: 'Map',
          parammaps: this.table3.parammaps
        }
        let url = 'authdata/GetDataByName'
        postJson(url,data).then(response => {
          if (response.data.list !== null) {
            console.log('table数据', response.data.list)
            this.table3.list = response.data.list
            this.table3.pageNum = response.data.pageNum
            this.table3.pageSize = response.data.pageSize
          } else {
            this.table3.list = []
          }
          this.table3.total = response.data.total
          setTimeout(() => {
            this.table3.listLoading = false
          }, 100)
        })
      },
      clickReceiverPositioning(row){
        console.log('查看')
        row.list = [{
          title:1,
          enable:1,
          style:{
            left: '100px',
            top: '100px',
          }
          },{
          title:2,
          enable:0,
          style:{
            left: '30px',
            top: '0',
          }
        }]
        row.list.forEach((item,key)=>{
          item.display = false
          item.enable == 1 ? item.style.background = 'green' : item.style.background = 'red'
        })
        this.set.positionList = row.list
        this.set.temp = Object.assign({}, row)
        this.set.dialogFormVisible = true
        this.set.dialogStatus = 'setTxt'
      },
      // 8小时接收率
      getList4() {
        this.table4.listLoading = true
        this.table4.parammaps.pastureid = this.temp.FARM_UUID
        let data = {
          name:'getReceiverReceptionRate',
          page: this.table4.page, offset: this.table4.offset, pagecount: this.table4.pagecount, returntype: 'Map',
          parammaps: this.table4.parammaps
        }
        let url = 'authdata/GetDataByName'
        postJson(url,data).then(response => {
          if (response.data.list !== null) {
            console.log('table数据', response.data.list)
            this.table4.list = response.data.list
            this.table4.pageNum = response.data.pageNum
            this.table4.pageSize = response.data.pageSize
          } else {
            this.table4.list = []
          }
          this.table4.total = response.data.total
          setTimeout(() => {
            this.table4.listLoading = false
          }, 100)
        })
      },
      // 脖环数据丢失头数
      getList5() {
        this.table5.listLoading = true
        this.table5.parammaps.pastureid = this.temp.FARM_UUID
        let data = {
          name:'getLoseCattleNumbers',
          page: this.table5.page, offset: this.table5.offset, pagecount: this.table5.pagecount, returntype: 'Map',
          parammaps: this.table5.parammaps
        }
        let url = 'authdata/GetDataByName'
        postJson(url,data).then(response => {
          if (response.data.list !== null) {
            console.log('table数据', response.data.list)
            this.table5.list = response.data.list
            this.table5.pageNum = response.data.pageNum
            this.table5.pageSize = response.data.pageSize
          } else {
            this.table5.list = []
          }
          this.table5.total = response.data.total
          setTimeout(() => {
            this.table5.listLoading = false
          }, 100)
        })
      },

      // 脖环数据丢失数量
      getList6() {
        this.table6.listLoading = true
        this.table6.parammaps.pastureid = this.temp.FARM_UUID
        let data = {
          name:'getMissingRecord',
          page: this.table6.page, offset: this.table6.offset, pagecount: this.table6.pagecount, returntype: 'Map',
          parammaps: this.table6.parammaps
        }
        let url = 'authdata/GetDataByName'
        postJson(url,data).then(response => {
          if (response.data.list !== null) {
            console.log('table数据', response.data.list)
            this.table6.list = response.data.list
            this.table6.pageNum = response.data.pageNum
            this.table6.pageSize = response.data.pageSize
          } else {
            this.table6.list = []
          }
          this.table6.total = response.data.total
          setTimeout(() => {
            this.table6.listLoading = false
          }, 100)
        })
      },
      goBack(){
        this.isTable1 = true
        this.isTable2 = false
        this.isTable3 = false
        this.isTable4 = false
        this.isTable5 = false
        this.isTable6 = false
        this.getList1()
      }
    }
  }
</script>

<style scoped lang="scss">
  .draggable-box {
    position: relative;
    border: 1px solid #333;
    margin-left: 5%;
    margin-top: 20px;
    width: 90%;
    height: 500px;
  }
  .draggable-item{
    width: 30px;
    height: 30px;
    border-radius:50%;
    position: absolute;
    text-align: center;
    line-height: 30px;
    color: #fff;
  }
  .follow{
    cursor: pointer;
    position: absolute;
    height: 40px;
    width: 40px;
    background: #fff;
    color: red;
    line-height: 20px;
    left: 35px;
    top: 0;
  }
  .follow span{
    text-decoration: underline;
  }
</style>
