track.vue 2.27 KB
<template>
  <div class="statusdetail">
    <el-dialog
      title="轨迹状态"
      :visible.sync="show"
      width="50%"
      :before-close="handleClose">
      <el-table :data="trackData" height="400">
        <el-table-column property="counttime" label="日期">
        </el-table-column>
        <el-table-column property="name" label="姓名"></el-table-column>
        <el-table-column property="gateId" label="抓怕地址" :formatter="gateFormatter"></el-table-column>
        <el-table-column property="pic_url" label="抓怕图片">
		 <template slot-scope="scope">
			  <div class="img-box">
			   <img :src="API.picUrl+'picture/'+scope.row.facePath+scope.row.facePic" alt="">
			  </div>
		  </template>
        </el-table-column>
        <el-row>
            <div class="block">
                <el-pagination class="flr mt10" @current-change="handleCurrentChange" :current-page.sync="page.currentPage" :page-size="page.limit" layout="total,prev, pager, next, jumper" :total="page.total">
                </el-pagination>
            </div>
        </el-row>
      </el-table>
      <span slot="footer" class="dialog-footer">
        <el-button @click="show = false">取 消</el-button>
        <el-button type="primary" @click="show = false">确 定</el-button>
      </span>
</el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      show:false,
      page: {
        offset: 0,
        currentPage: 1,
        limit: 10,
        total: 0
      },
      trackData: [],
    }
  },
    props: {
        accunid: {},
        faceunid: {},
        gateData:{
          type:Array
        }
    },
  methods:{
    init(data){
      this.show = true;
       this.trackData=data
    },
    gateFormatter(data){
      let val="";
      this.gateData.forEach(item=>{
        if(item.id==data.gateId){
          val=item.name;
        }
      })
      return val;
    },
     handleCurrentChange(val) {
        this.page.currentPage = val;
        this.page.offset = (val - 1) * this.page.limit;
        this.init();
      },
    handleClose(){
      this.show = false;
    },
  },
  mounted(){
  }
}
</script>

<style lang="stylus" scoped>
.activitychart{
  height 40vh
  width 40vw
}
.img-box{
  height 60px
  width 60px
  img{
    height 100%
    width 100%
  }
}
</style>