<template>
  <div>
    <crumbs
      :title="
        type === 'success'
          ? `${titleName}-成功条数`
          : `${titleName}-失败条数`
      "
      class="topBack"
      :param="$route.params"
      linkTo="AutoKnowledgeMapRuleTest"
    >
      <el-form :inline="true" class="demo-form-inline">
        <el-form-item label="规则术语类型：">
          <el-select v-model="autoType" clearable filterable placeholder="请选择" size="mini">
            <el-option
              v-for="item in typeAutoList"
              :key="item.libType"
              :label="item.libTypeName"
              :value="item.libType"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="规则医学标准术语：">
          <el-input size="mini" v-model="autoRule" placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item label="基础规则术语类型：">
          <el-select v-model="baseType" clearable filterable placeholder="请选择" size="mini">
            <el-option
              v-for="item in typeBaseList"
              :key="item.libType"
              :label="item.libTypeName"
              :value="item.libType"
            ></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <el-form :inline="true" class="demo-form-inline btmAction">
        <el-form-item label="基础规则医学标准术语：">
          <el-input size="mini" v-model="baseHosTxt" placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item label="失败原因：">
          <el-input size="mini" v-model="whyTxt" placeholder="请输入"></el-input>
        </el-form-item>
         <el-form-item>
          <el-button size="mini" @click="filterDatas">确认</el-button>
        </el-form-item>
        <el-form-item style="marginbottom: 0px">
          <el-button size="mini" @click="exportData">导出</el-button>
        </el-form-item>
      </el-form>
    </crumbs>
    <div style="margin: 100px 20px 0">
      <el-table :data="list" border>
        <el-table-column
          :resizable="false"
          type="index"
          :index="indexMethod"
          label="编号"
          width="80"
        ></el-table-column>
        <el-table-column
          :resizable="false"
          prop="gmtModified"
          label="测试时间"
          :show-overflow-tooltip="true"
        ></el-table-column>
        <el-table-column
          :resizable="false"
          prop="ruleLibTypeName"
          label="规则术语类型"
          :show-overflow-tooltip="true"
        ></el-table-column>
        <el-table-column
          :resizable="false"
          prop="ruleLibName"
          label="规则医学标准术语"
          :show-overflow-tooltip="true"
        ></el-table-column>
        <el-table-column
          :resizable="false"
          prop="ruleHisName"
          label="规则医院术语"
          :show-overflow-tooltip="true"
        ></el-table-column>
        <el-table-column
          :resizable="false"
          prop="ruleHisDetailName"
          label="规则医院术语细项"
          :show-overflow-tooltip="true"
        ></el-table-column>
        <el-table-column
          :resizable="false"
          prop="groupType"
          label="规则组别"
          :show-overflow-tooltip="true"
        ></el-table-column>
        <el-table-column
          :resizable="false"
          prop="ruleBaseType"
          className="collectTwo"
          :show-overflow-tooltip="true"
          label="基础规则类型"
        >
          <template slot-scope="scope">
            <div v-html="returnDom(scope.row.baseRules,'ruleBaseType')"></div>
          </template>
        </el-table-column>
        <el-table-column
          :resizable="false"
          prop="ruleBaseLibTypeName"
          label="基础规则术语类型"
          :show-overflow-tooltip="true"
          className="collectTwo"
        >
          <template slot-scope="scope">
            <div v-html="returnDom(scope.row.baseRules,'ruleBaseLibTypeName')"></div>
          </template>
        </el-table-column>
        <el-table-column
          :resizable="false"
          prop="ruleBaseLibName"
          label="基础规则医学标准术语"
          :show-overflow-tooltip="true"
          className="collectTwo"
        >
          <template slot-scope="scope">
            <div v-html="returnDom(scope.row.baseRules,'ruleBaseLibName')"></div>
          </template>
        </el-table-column>
        <el-table-column
          :resizable="false"
          prop="ruleBaseHisName"
          label="基础规则医院术语"
          :show-overflow-tooltip="true"
          className="collectTwo"
        >
          <template slot-scope="scope">
            <div v-html="returnDom(scope.row.baseRules,'ruleBaseHisName')"></div>
          </template>
        </el-table-column>
        <el-table-column
          :resizable="false"
          prop="ruleBaseHisDetailName"
          label="基础规则医院术语细项"
          :show-overflow-tooltip="true"
          className="collectTwo"
        >
          <template slot-scope="scope">
            <div v-html="returnDom(scope.row.baseRules,'ruleBaseHisDetailName')"></div>
          </template>
        </el-table-column>
        <el-table-column
          :resizable="false"
          prop="ruleBaseInputValue"
          label="基础规则输入值"
          :show-overflow-tooltip="true"
          className="collectTwo"
        >
          <template slot-scope="scope">
            <div v-html="returnDom(scope.row.baseRules,'ruleBaseInputValue','ruleBaseUnit')"></div>
          </template>
        </el-table-column>
        <el-table-column
          :resizable="false"
          prop="referenceValue"
          label="基础规则参考值"
          :show-overflow-tooltip="true"
          className="collectTwo"
        >
          <template slot-scope="scope">
            <div v-html="returnDom(scope.row.baseRules,'referenceValue')"></div>
          </template>
        </el-table-column>
        <el-table-column
          :resizable="false"
          prop="output"
          label="实际结果"
          :show-overflow-tooltip="true"
        ></el-table-column>
        <el-table-column
          :resizable="false"
          prop="expectedOutput"
          label="预期结果"
          :show-overflow-tooltip="true"
        ></el-table-column>

        <el-table-column label="测试结果">
          <template slot-scope="scope">
            {{ scope.row.success === 1 ? '成功' : '失败' }}
          </template>
        </el-table-column>
        <el-table-column
          v-if="type !== 'success'"
          :resizable="false"
          prop="message"
          label="失败原因"
          :show-overflow-tooltip="true"
        ></el-table-column>
      </el-table>
      <div class="pagination pagepage">
        <el-pagination
          :current-page.sync="currentPage"
          @current-change="currentChange"
          background
          :page-size="pageSize"
          :page-sizes="pageSizeArr"
          @size-change="handleSizeChange"
          :layout="pageLayout"
          :total="total"
        ></el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
import api from '@api/knowledgeTree.js';
import config from '@api/config.js';
import utils from '@api/utils.js';
export default {
  name:'AutoBillCommonTest',
  data() {
    return {
      list: [],
      currentPage: 1,
      pageSize: config.pageSize,
      pageSizeArr: config.pageSizeArr,
      pageLayout: config.pageLayout,
      total: 0,
      type: '',
      autoType:'',//规则术语类型
      typeAutoList:[],
      autoRule:'',//规则医学标准术语
      baseType:'',
      typeBaseList:[],
      baseHosTxt:'',
      whyTxt:'',
      titleName:''
    };
  },
  created() {
    let params = this.handleInitData();;
    // if(localAuto&&!this.$route.param){
    //   params = JSON.parse(localAuto);
    // }else{
    //   alert(999)
    //   params = this.handleInitData();
    //   localStorage.setItem('localAuto',JSON.stringify(params))
    // }
    this.getDataList();
    this.getDroplistData(params);
  },
  methods: {
    returnDom(list,name,unit){
      let str = ''
      if(name === 'ruleBaseType'){
        const params = JSON.parse(localStorage.getItem("zskDicts"));
        for(let i = 0;i < list.length;i++){
          for(let j = 0;j < params.length;j++){
            if(list[i].ruleBaseType == params[j].val){
              // if(params[j].name){
                str += `<p style="border-bottom:${i == list.length-1?'0':'1px solid #EBEEF5'};overflow: hidden;text-overflow: ellipsis;white-space: nowrap;" class="collTxt">
                      ${params[j].name||'&nbsp;'}
                  </p>`
              // }
            }
          }
        }
      }else{
        for(let i = 0;i < list.length;i++){
          // if(list[i][name]){
            str += `<p style="border-bottom:${i == list.length-1?'0':'1px solid #EBEEF5'};overflow: hidden;text-overflow: ellipsis;white-space: nowrap;" class="collTxt">
                  ${list[i][name]?list[i][unit]?(list[i][name]+list[i][unit]):list[i][name]:'&nbsp;'}
              </p>`
          // }
        }
      }
      //  str += `<p style="padding:0 10px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;border-bottom:${i == list.length-1?'0':'1px solid #EBEEF5'};" class="collTxt">
      return str
    },
    getDroplistData(params){
      let param = {
        success:params.success,
        resultId:params.resultId
      }
      api.getDroplistData(param).then((res)=>{
        const result = res.data
        if(result.code == 0){
          this.typeAutoList = result.data.ruleLibType||[]
          this.typeBaseList = result.data.ruleBaseLibType||[]
        }
      })
    },
    filterDatas(){
      this.getDataList();
    },
    handleInitData() {
      const localAuto = JSON.parse(localStorage.getItem('localAuto'));
      const { data, type,hospitalName } = this.$route.params;
      this.type = type||localAuto.type;
      this.titleName = localAuto.caseName||data.caseName.replace(/\_/,'-')
      return {
        current: this.inCurrentPage || this.currentPage,
        size: this.pageSize,
        resultId: data && data.resultId||localAuto.resultId,
        success: type === 'success' ? 1 : type === 'failed'? 0 : localAuto.type === 'success' ? 1 : 0,
        ruleLibType:this.autoType||null,//规则术语类型
        ruleLibName:this.autoRule,//规则医学标准术语（模糊查询）
        hospitalName:hospitalName||localAuto.hospitalName,
        ruleBaseLibType:this.baseType,//基础规则术语类型
        ruleBaseLibName:this.baseHosTxt,//基础规则医学标准术语（模糊查询）
        message:this.whyTxt,//失败原因（模糊查询
      };
    },
    indexMethod(index) {
      return (this.currentPage - 1) * this.pageSize + index + 1;
    },
    currentChange(next) {
      this.currentPage = next;
      this.getDataList(true);
    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.currentPage = utils.getCurrentPage(
        this.currentPage,
        this.total,
        this.pageSize
      );
      this.getDataList();
    },

    getDataList() {
      const params = this.handleInitData();
      this.searched = true;
      const loading = this.$loading({
        lock: true,
        text: 'Loading',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)',
      });
      api.getResultRulePage(params).then((res) => {
        loading.close();
        if (res.data.code === '0') {
          this.list = res.data.data && res.data.data.records;
        }
        this.total = res.data.data && res.data.data.total;
        if (this.inCurrentPage !== undefined) {
          this.currentPage = this.inCurrentPage;
          this.inCurrentPage = undefined;
        }
      });
    },
    // 导出
    exportData() {
      let parm = this.handleInitData();
      // let params = {
      //   success: parm.success,
      //   resultId: parm.resultId,
      //   billType: 1, //1：通用，2：输血
      // };
      this.$alert('确定要导出规则测试结果吗？', '', {
        confirmButtonText: '确定',
        title: '提示',
        type: 'warning',
      })
        .then(() => {
          api.ruleExportExcel(parm).then((res) => {
            if (res.status === 200) {
              this.$message({ message: '导出成功', type: 'success' });
              utils.downloadExportedData(
                res.data,
                `${parm.hospitalName}-${this.titleName}测试结果.xls`
              );
            }
          });
        })
        .catch(() => {});
    },
  },
};
</script>

<style lang="less">
.collectTwo .cell {
  padding:0 8px;
}
</style>
<style lang="less" scoped>
@import '../../less/admin.less';
.topBack {
  height:80px !important;
  .el-form-item {
    margin-bottom:0;
  }
}
.contents {
  display:inline-block !important;
}
.btmAction {
  position:relative;
  bottom:12px;
  float:right;
}
.collectTwo {
  .cell {
    padding:0 !important;
    .collTxt {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      border-bottom:1px solid #EBEEF5;
      &:last-child{
        border-bottom:0;
      }
    }
  }
}
</style>