report.vue 4.7 KB
<!--活动状态-->
<template>
  <div class="template-box content_div_main">
     <el-form :inline="true" class="search-form" size="small">
        <el-form-item label="人口库:">
          <el-select v-model="dbname" class="br0 bra bla">
            <el-option value="" label="请选择库类型"></el-option>
            <el-option v-for="item in crucialData"  :key="item.unid" :value="item.code" :label="item.name"></el-option>
          </el-select>
        </el-form-item>
         <el-form-item label="姓名:">
          <el-input type="text" class="bla bra br0" v-model="facename" placeholder=""></el-input>
        </el-form-item>
         <el-form-item label="证件号:">
          <el-input type="text" class="bla" placeholder="请输入证件号" v-model="facecardid"></el-input>
        </el-form-item>
         <el-form-item label="性别:">
           <el-select v-model="facesex" class="br0 bra bla">
            <el-option value="" label="请选择性别"></el-option>
            <el-option :value="1" label="男"></el-option>
            <el-option :value="2" label="女"></el-option>
          </el-select>
        </el-form-item>
         <el-form-item>
          <el-button  class="search-btn" @click="getData" icon="el-icon-search">查询</el-button>
          <!-- <el-button  class="search-btn ml10"  @click="addGroupUser()" icon="el-icon-upload">导出</el-button> -->
        </el-form-item>
      </el-form>
    <el-row class="table_m_type">
      <el-table :data="tableData" style="width: 100%" height="680" >
        <el-table-column type="index" label="#"></el-table-column>
        <el-table-column prop="name" label="姓名" align="center"></el-table-column>
        <el-table-column prop="sex" label="性别" :formatter="setSex" align="center"></el-table-column>
        <el-table-column label="出生日期" property="birthday" :formatter="setBirthday"> </el-table-column>
        <el-table-column label="身份证号" property="card_id"></el-table-column>
        <el-table-column label="操作" width="200" align="center">
          <template slot-scope="scope">
            <div class="tab-btn-box">
              <span @click="showImg(scope.row)" class="table-btn">抓拍图片</span>
              <span @click="activityStatus(scope.row)" class="table-btn">活动状态</span>
           </div>
          </template>
        </el-table-column>
      </el-table>
    </el-row>
    <el-row class="block">
      <el-pagination
        class="mt10"
        @current-change="handleCurrentChange" :current-page.sync="currentPage"
        :page-size="limit"
        background
        layout="prev, pager, next"
        :total="total">
      </el-pagination>
    </el-row>
    <el-row>
      <statusdetails ref="detail"></statusdetails>
    </el-row>
  </div>
</template>

<script>
import statusdetails from './detail'
export default {
  components:{
    statusdetails
  },
  data() {
    return {
      address: "",
      camera: "",
      crucialData: [],
      tableData: [],
      value: "",
      value1: "",
      offset:0,
      limit:20,
      total:0,
      currentPage:0,
      dbname:'',
      facename:'',
      communityunid:'',
      facecardid:'',
      facesex:''

    };
  },
  methods: {
    showImg(data){
      this.$refs.detail.initImg(data)
    },
    activityStatus(data){
      this.$refs.detail.initchart(data)
    },
    setSex(row, column, cellValue) {
        var sex = "";
        if (cellValue == "1") sex = "男";
        if (cellValue == "2") sex = "女";
        return sex;
    },
    setBirthday(row, column, cellValue) {
      var data = "";
      if (cellValue) data = cellValue.split(" ")[0];
      return data;
    },
    initDbData(){
         this.axios.get(this.API.url + "/codes/custom/cates/4DD23AF66E/codes").then((response)=> {
           this.crucialData = response.data.list_data;
      });
     },
    getData() {
        this.axios
          .get(this.API.faceweb + "/faces/crucial_faces", {
            params: {
              offset: this.offset,
              limit: this.limit,
              is_crucial: true,
              is_active: true,
              sex: this.facesex,
              name__like: this.facename,
              card_id__like: this.facecardid,
              crucial_type: this.dbname,
              resident_unids: this.communityunid,
            }
          }).then( (response) =>{
            this.tableData = response.data.list_data;
            this.total = response.data.total_num;
          });
      },
    handleCurrentChange(){

    }
  },
  created() {
    this.getData();
    this.initDbData();
  }
};
</script>
<style lang="stylus" scoped>
.search-box {
  color: #333;
  background: #fff;
}
.show-img-box{
  height 60px
  width 60px
  img{
    height 100%
    width 100%
  }
}
</style>