<template>
<div class="examination">
    <div class="common-head-search">
      <el-form :inline="true">
        <el-form-item label='物料名称'>
          <el-input v-model="search.matName" size="small" placeholder="请输入物料名称" style="width: 150px;"></el-input>
        </el-form-item>
        <el-form-item label='任务名称'>
          <el-input v-model="search.testItemName" size="small" placeholder="请输入任务名称" style="width: 150px;"></el-input>
        </el-form-item>
        <el-form-item label='提交人'>
          <el-input v-model="search.auditMan" size="small" placeholder="请输入提交人" style="width: 150px;"></el-input>
        </el-form-item>
        <el-form-item label="提交日期">
          <el-date-picker
           v-model="search.times"
           type="daterange"
           range-separator="至"
           start-placeholder="开始日期"
           end-placeholder="结束日期"
           size="small"
           style="width:300px"
           format="yyyy-MM-dd"
           value-format="yyyy-MM-dd">
          </el-date-picker>
        </el-form-item>
        <el-form-item>
          <el-button icon="el-icon-search" type="goon" :loading = "loading1" size="mini" @click="searchData">查询</el-button>
          <el-button icon="el-icon-refresh" type="info" :loading = "loading1" plain size="mini" @click="resetData">重置</el-button>
        </el-form-item>
      </el-form>
    </div>
      <el-row>
          <el-col :span='5'>
            <div class="common-title-div">
              <div class="common-title-name">
                <img style="width: 25px; height: 25px" src='../../../assets/img/imgScreen/logo.png' />
                任务名称
              </div>
              <div>
              </div>
            </div>
            <div class="common-table-div">
              <el-table ref="excelTable" :height="theight1"
                v-loading="tableLoading1"
                :data="tableData1"
                highlight-current-row
                :summary-method="getSummaries"
                @row-click="handleCurrentChange"
                :header-cell-style="tableHeaderCellStyle"
                show-summary
                border
                style="width: 100%"
                :icorePanelShown="100"
                :icore-filter-flag="icoreFilterFlag"
              >
                <el-table-column sortable show-overflow-tooltip align="center" min-width="100" prop="TEST_ITEM_NAME" label="测试任务名称"></el-table-column>
              </el-table>
            </div>
          </el-col>
          <el-col :span='19'>
            <div class="common-title-div">
              <div class="common-title-name">
                <img style="width: 25px; height: 25px" src='../../../assets/img/imgScreen/logo.png' />
                原始记录
              </div>
              <div class="common-button-div">
                  <el-button
                  icon="el-icon-download"
                  type="goon"
                  size="mini"
                  :loading="tableExportLoading"
                  @click="doExport"
                  >导出</el-button
                  >
              </div>
            </div>
            <div class="common-table-div" id="topTable">
              <el-table ref="excelTable" :height="theight1"
                v-loading="tableLoading2"
                :data="tableData2"
                @selection-change="searchFollow1"
                highlight-current-row
                :summary-method="getSummaries"
                show-summary
                border
                style="width: 100%"
                :icorePanelShown="100"
                :icore-filter-flag="icoreFilterFlag"
              >
                <!-- <el-table-column type="index" label="NO" fixed="left" align="center" width="45"></el-table-column>
                <el-table-column type="selection" width="45" fixed="left" align="center"></el-table-column> -->
                <!-- <el-table-column sortable show-overflow-tooltip align="center" min-width="120px" prop="CAR_NO" label="委托编号"></el-table-column> -->
                <el-table-column show-overflow-tooltip sortable min-width="120" fixed align='center' prop="CAR_NO" label="委托编号">
                  <template slot-scope="scope">
                    <div :class="{'color-blue' : scope.row.CAR_NO}"
                        @click.stop="showPrototype(scope.row)">{{scope.row.CAR_NO}}
                    </div>
                  </template>
                </el-table-column>
                <el-table-column show-overflow-tooltip sortable min-width="120" fixed align='center' prop="SAMPLE_NO" label="中心编号">
                  <template slot-scope="scope">
                    <div :class="{'color-blue' : scope.row.SAMPLE_NO}"
                        @click.stop="showHistory(scope.row)">{{scope.row.SAMPLE_NO}}
                    </div>
                  </template>
                </el-table-column>
                <el-table-column sortable show-overflow-tooltip align="center" fixed min-width="120" prop="STD_NAME" label="标样编号"></el-table-column>
                <el-table-column sortable show-overflow-tooltip align="center" min-width="120" prop="MAT_NAME" label="物料名称"></el-table-column>
                <el-table-column sortable show-overflow-tooltip align="center" min-width="80" prop="CHECK_MAN" label="提交人"></el-table-column>
                <el-table-column sortable show-overflow-tooltip align="center" min-width="120" prop="CHECK_TIME" label="提交时间"></el-table-column>
                <el-table-column sortable show-overflow-tooltip align="center" min-width="80" prop="APPR_MAN" label="三审人"></el-table-column>
                <el-table-column sortable show-overflow-tooltip align="center" min-width="120" prop="APPR_TIME" label="三审时间"></el-table-column>
                <el-table-column sortable show-overflow-tooltip align="center" min-width="80" prop="AUDIT_MAN" label="四审人"></el-table-column>
                <el-table-column sortable show-overflow-tooltip align="center" min-width="120" prop="AUDIT_TIME" label="四审时间"></el-table-column>
                <el-table-column sortable show-overflow-tooltip align="center" min-width="120" prop="NANT_NO" label="使用设备"></el-table-column>
                <el-table-column sortable show-overflow-tooltip align="center" min-width="120" prop="MEMO" label="检测标准"></el-table-column>
                <el-table-column label="分析项目" show-overflow-tooltip>
                  <template v-for="col in cols">
                    <el-table-column :prop="col.ANLY_ITEM_NO" show-overflow-tooltip align='center' :key="col.ANLY_ITEM_NO" :label="col.ANLY_ITEM_NAME+'('+col.UNIT_NAME+')'"></el-table-column>
                  </template>
                </el-table-column>
                
              </el-table>
              <div class="common-foot-style">
                <el-pagination
                  @size-change="handleSizeChangeMain"
                  @current-change="handleCurrentChangeMain"
                  :current-page.sync="page.pageIndex"
                  :page-sizes="[10, 20, 30, 40, 100 , 200]"
                  :page-size="page.pageSize"
                  size="mini"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="page.total"
                  background
                ></el-pagination>
              </div>
            </div>
          </el-col>
        </el-row>
        <div
          is="historyAlert"
          :showFlag="historyShowFlag"
          :Params="Params"
          @refresh="refresh"
        ></div>
        <div
          is="prototype"
          :showFlag="historyShowFlag1"
          :Params="Params1"
          @refresh="refresh1"
        ></div>
</div>
</template>
<script>
import {getCookie,formatDate} from '@/utils/util.js';
import {cookieUserId, cookieUserName} from '@/config/config.js'
import historyAlert from '../../testAnalysis/components/testManagement/historyAlert';
import prototype from './prototype';
let userName = getCookie(cookieUserName);
let userId = getCookie(cookieUserId);
export default {
    components: {historyAlert , prototype},
    data () {
        return{
            search:{
                matName: '',
                testItemName: '',
                auditMan: '',
                times: []
            },
            multipleSelection1:[], //选中的数据
            loading1:false,
            tableLoading1: false,
            tableLoading2: false,
            click_main:{},
            click_main1:{},
            tableData1:[],
            tableData2:[],
            Params: {},
            Params1: {},
            historyShowFlag:false,
            historyShowFlag1: false,
            cols:[],
            page:{
                pageIndex: 1,
                pageSize:100,
                total:0
            },
            theight1: 500,
            icoreFilterFlag: true,
            tableExportLoading: false,
        }
    },
    created(){
        this.theight1 = window.innerHeight -180;
        let aaa = new Date()
        let bbb =  new Date().getTime() -60000*60*24*7;
        aaa.setTime(bbb);
        this.search.times =  [this.getYNM(aaa), this.getYNM(new Date())]
    },
    mounted() {
      
    },
    methods:{
        getYNM(date) {
            let year = date.getFullYear().toString();
            let month = date.getMonth() + 1;
            let day = date.getDate();
            month = month < 10 ? "0" + month : month;
            day = day < 10 ? "0" + day : day;
            return `${year}-${month}-${day}`;
        },
        searchData(){
            if(!this.search.times){
                this.$message.error('请先选择时间');
                return true;
            }
            this.page.pageIndex = 1
            this.page.pageSize = 100
            this.doMain();
        },
        doMain(){
            let startTime = ''
            let endTime = ''
            if (!this.search.times) {
                startTime = ''
                endTime = ''
            }else{
                startTime = this.search.times[0] + ' 00:00:00'
                endTime = this.search.times[1] + ' 23:59:59'
            }
            let obj = {
                validFlag: '1',
                stateFlag: '0',
                auditMan: this.search.auditMan,
                testItemName: this.search.testItemName,
                matName: this.search.matName,
                startTime: startTime,
                endTime: endTime
            }
            
            this.loading1 = true
            this.axios.post('pass/testManagement/v1/limssampletests/queryLimsSampleTestRecord',obj, {individualType: 'json'}).then(res =>{
                if (res.code == 0 || res.code == 200) {
                    this.tableData1 = res.data
                }else{
                    this.$message.error(res.message)
                }
                this.loading1 = false;
            }).catch(err =>{
                this.loading1 = false;
                this.$message.error(err.message)
            })
        },
        doMain2(){
            let startTime = ''
            let endTime = ''
            if (!this.search.times) {
                startTime = ''
                endTime = ''
            }else{
                startTime = this.search.times[0] + ' 00:00:00'
                endTime = this.search.times[1] + ' 23:59:59'
            }
            let obj = {
                pageIndex: this.page.pageIndex,
                pageSize: this.page.pageSize,
                object:{
                    validFlag: '1',
                    stateFlag: '0',
                    auditMan: this.search.auditMan,
                    testItemName: this.click_main.TEST_ITEM_NAME,
                    matName: this.search.matName,
                    testItemNo: this.click_main.TEST_ITEM_NO,
                    matName: this.search.matName,
                },
                startTime: startTime,
                endTime: endTime
            }
            this.tableLoading2 = true
            this.axios.post('pass/testManagement/v1/limssampletests/queryLimsSampleTestRecordList',obj, {individualType: 'json'}).then(res =>{
                if (res.code == 0 || res.code == 200) {
                    this.tableData2 = res.data.data.list
                    this.cols = res.data.head
                    this.page.total = res.data.data.total
                }else{
                    this.$message.error(res.message)
                }
                this.tableLoading2 = false;
            }).catch(err =>{
                this.tableLoading2 = false;
                this.$message.error(err.message)
            })
        },
        showPrototype(row){
          if (!row){
            return this.$message.warning('查询标样记录失败，参数错误!')
          }
          if(row.MAT_NAME == '标准点'){
            return this.$message.warning('标样任务无标样记录，请选择检验任务点击!')
          }
          let obj = {
            checkNo: row.CHECK_NO,
            checkTime: row.CHECK_TIME,
            stdName: row.STD_NAME,
            testItemName: this.click_main.TEST_ITEM_NAME,
          }
          this.axios.post('pass/testManagement/v1/limssampletests/queryPrototype',obj,{ individualType: 'json'}).then(res => {
            if (res.code == 0 || res.code == 200){
              //打开窗口
              this.historyShowFlag1 = !this.historyShowFlag1
              this.Params1 = Object.assign([{}], res.data)
            }else {
              this.$message.warning('查询标样记录失败!')
            }
          }).catch(e => {
            this.$message.error(e.message);
          })
        },
        showHistory(row){
          if (!row){
            return this.$message.warning('查询历史记录失败，参数错误!')
          }
          this.axios.post('pass/testManagement/v1/limssamplehistorys/queryHistoryTest',row,{ individualType: 'json'}).then(res => {
            if (res.code == 0 || res.code == 200){
              //打开窗口
              this.historyShowFlag = !this.historyShowFlag
              this.Params = Object.assign([{}], res.data)
            }else {
              this.$message.warning('查询历史记录失败!')
            }
          }).catch(e => {
            this.$message.error(e.message);
          })
        },
        refresh () {

        },
        refresh1(){

        },
        // 导出
        doExport() {
            if (this.tableData2.length === 0) {
                this.$message.warning("表格无数据不能导出");
                return true;
            }
            this.tableExportLoading = true;
            setTimeout(() => {
                setTimeout(() => {
                setTimeout(() => {
                    this.tableExportLoading = false;
                    this.doExport2();
                }, 0);
                }, 0);
            }, 0);
        },
        doExport2() {
            this.$nextTick(() => {
                let table = document.querySelector("#topTable .el-table");
                let header = document.querySelector(
                "#topTable .el-table .el-table__header thead"
                );
                let body = document.querySelector(
                "#topTable .el-table .el-table__body"
                );
                header.border = "1";
                body.border = "1";
                let bd = body.outerHTML;
                let bd1 = header.outerHTML;
                let ex = '<th class="gutter" style="width: 0px;"></th>';
                let ex2 = '<th class="gutter" style="width: 10px;"></th>';
                ex = new RegExp(ex, "g").test(bd1) ? ex : ex2;
                let bd2 = bd1.replace(new RegExp(ex, "g"), "");
                let html =
                '<html><head><meta charset="utf-8" /></head><body>' +
                '<table cellspacing="0" cellpadding="0" border="1" class="el-table__header" style="width: 1036px;">'+
                bd2 +
                '</table>'+
                bd +
                "</body></html>";
                let blob = new Blob([html], { type: "application/vnd.ms-excel" });
                let link = document.createElement("a");
                link.download = "原始记录.xls";
                link.href = URL.createObjectURL(blob);
                link.click();
                header.border = "0";
                body.border = "0";
            });
        },
        resetData(){
            this.search.matName = '',
            this.search.testItemName = '',
            this.search.auditMan = ''
            let aaa = new Date()
            let bbb =  new Date().getTime() -60000*60*24*7;
            aaa.setTime(bbb);
            this.search.times =  [this.getYNM(aaa), this.getYNM(new Date())]
        },
        searchFollow1 (val){
            this.multipleSelection1 = val
        },
        handleCurrentChange(val){
            this.click_main = val
            this.doMain2()
        },
        handleCurrentChangeStdName(val){
            this.click_main1 = val
        },
        handleSizeChangeMain(pageSize) {
            this.pageIndex = 1;
            this.pageSize = pageSize;
            this.searchData();
        },
        handleCurrentChangeMain(pageIndex) {
            this.pageIndex = pageIndex;
            this.searchData();
        },
        tableHeaderCellStyle () {
            return 'color: rgb(255,255,255);border-bottom: 1px solid #DCDFE7;'
        },
        getSummaries(param) {
            const { columns, data } = param;
            const sums = [];
            columns.forEach((column, index) => {
                if (index === 0) {
                sums[index] = "合计：" + data.length;
                }
            });
            return sums;
        },
    }
}
</script>