<template>
  <div class="el-cert">
    <!--查询组件3开始-->
    <div class="common_infoquery_pc_3">
      <div class="container">
        <div class="row">
          <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
            <div class="xueshi-search">
              <input type="text" class="inp1" v-model="ucCertNo" placeholder="证书编号">
              <input type="text" class="inp1"  v-model="ucIdcard" placeholder="身份证号">
              <input type="text" class="inp1"  v-model="ucName" placeholder="姓名">
              <input type="button" class="btn1" @click="init" value="查询">
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
            <div class="xueshi-result">
              <span class="title">查询结果</span>
              <table>
                <tr>
                  <th>证书编号</th>
                  <th>身份证号码</th>
                  <th>姓名</th>
                  <th>总学时</th>
                  <!--<th>操作</th> -->
                </tr>
                <tr v-for="(list,i) in resultList" :key="i">
                  <td>{{list.ucCertNo}}</td>
                  <td>{{list.ucIdcard}}</td>
                  <td>{{list.ucName}}</td>
                  <td>{{list.ucScore}}</td>
                 <!-- <td class="xueshi-check"><a>查看学时明细</a></td>  -->
                </tr>


              </table>
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
            <div class="search-result-page">
              <div style="margin-top:30px;">
                <el-pagination
                background
                layout="total, sizes, prev, pager, next, jumper"
                :page-sizes="[10, 20, 50, 100]"
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="currentPage4"
                :total="totalCount">
                </el-pagination>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="common_infoquery_pc_3_pop common_popbg" style="display: none;">
        <!--弹窗-->
        <div class="common_pop">
          <span class="common_pop_close"></span>
          <span class="sp1">学时明细</span>
          <!--弹窗标题-->
          <div class="xueshi-result">
            <table>
              <tr>
                <th>获取时间</th>
                <th>获取学时</th>
                <th>来源</th>
                <th>累计学时</th>
              </tr>
              <tr>
                <td>2020.10.12 15:34</td>
                <td>25</td>
                <td>三岗培训课程</td>
                <td>48</td>
              </tr>
              <tr>
                <td>2020.10.12 15:34</td>
                <td>25</td>
                <td>三岗培训课程</td>
                <td>48</td>
              </tr>
              <tr>
                <td>2020.10.12 15:34</td>
                <td>25</td>
                <td>三岗培训课程</td>
                <td>48</td>
              </tr>
              <tr>
                <td>2020.10.12 15:34</td>
                <td>25</td>
                <td>三岗培训课程</td>
                <td>48</td>
              </tr>
              <tr>
                <td>2020.10.12 15:34</td>
                <td>25</td>
                <td>三岗培训课程</td>
                <td>48</td>
              </tr>
            </table>
          </div>
        </div>
      </div>

  <!-- $(".common_pop_close").click(function(){
  $(".common_infoquery_pc_3_pop").hide();
  });
  $(".xueshi-check a").click(function() {
    $(".common_infoquery_pc_3_pop").show();
    $(".common_infoquery_pc_3_pop .common_pop").css("margin-top", $(window).height() / 2 - $(".common_infoquery_pc_3_pop .common_pop").height() / 2); //垂直居中
  }); -->

    </div>
    <!--查询组件3结束-->
  </div>
</template>

<script>
import formMixin from "../../../src/mixins/formMixin";
import lenye_base from "lenye_base";
import * as $ from "fy-kit";
import msg from "../../message";
import pagination from "../../pagination";
export default {
  name: "ElCert",
  mixins: [formMixin],
  data() {
    return {
      ucIdcard:'',
      ucName: '',
      ucCertNo: '',
      resultList:[],
       currentPage4: 1,
         totalCount:0,
         rows:10,
         page:1
    };
  },
  components: {
    msg,
    pagination
  },
  mounted() {
    this.ucIdcard = $.util.urlParams("ucIdcard") || '';
    this.ucName = $.util.urlParams("ucName") || '';
    this.ucCertNo = $.util.urlParams("ucCertNo") || '';

      this.init();


  },
  methods: {
     handleSizeChange(val) {
        console.log(`每页 ${val} 条`);
        this.rows = val;
         this.isearch();
    },
    handleCurrentChange(val) {
        console.log(`当前页: ${val}`);
        this.page = val;
        this.isearch();
    },
    init(){
      if( ($.string.trim(this.ucIdcard) && $.string.trim(this.ucCertNo) )  || ( $.string.trim(this.ucIdcard) && $.string.trim(this.ucName) ) || ( $.string.trim(this.ucName) && $.string.trim(this.ucCertNo) ) ){
        this.isearch();
      }else {
        msg.warning('需要同时满足两个查询条件才能准确查询出结果')
      }
    },
    isearch() {
      $.util
        .ajax(
          lenye_base.base_data.getapiUrl() +
            "/cert-service/common/ctUserCert/queryManagePage.do",
          lenye_base.base_data.getformatting({
            sites: lenye_base.site_data.getsiteData().siteId,
            ucIdcard: this.ucIdcard,
            ucName: this.ucName,
            ucCertNo: this.ucCertNo,
            page:this.page,
            rows:this.rows
          })
        )
        .then(res => {
          if (res.success == "1") {
            this.resultList = res.data;
             this.totalCount = res.totalCount;
          }else{
            msg.error(res.message);
          }
        });
    }
  }
};
</script>
