<template>
  <div>
    <crumbs title="规则查询" :minWidth="titleWidth" class="knowledgeTitle">
      <el-form :inline="true" class="demo-form-inline">
        <el-form-item label="规则名称：">
          <el-input
            size="mini"
            v-model.trim="filter.description"
            placeholder="请输入"
            clearable
          ></el-input>
        </el-form-item>
        <el-form-item label="规则类型：">
          <el-select
            v-model="filter.ruleType"
            clearable
            placeholder="请选择"
            size="mini"
          >
            <el-option
              v-for="item in ruleTypeList"
              :key="item.val"
              :label="item.name"
              :value="item.val"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="规则术语类型：">
          <el-select
            v-model="filter.libType"
            clearable
            placeholder="请选择"
            size="mini"
          >
            <el-option
              v-for="item in ruleTermTypeList"
              :key="item.val"
              :label="item.name"
              :value="item.val"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="医学标准术语：">
          <el-input
            size="mini"
            v-model.trim="filter.libName"
            placeholder="请输入"
            clearable
          ></el-input>
        </el-form-item>
      </el-form>
      <el-form class="secLine" :inline="true">
        <el-form-item label="基础规则术语类型：">
          <el-select
            v-model="filter.baseLibType"
            clearable
            placeholder="请选择"
            size="mini"
          >
            <el-option
              v-for="item in baseTermTypeList"
              :key="item.val"
              :label="item.name"
              :value="item.val"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="基础医学标准术语：">
          <el-input
            size="mini"
            v-model.trim="filter.baseLibName"
            placeholder="请输入"
            clearable
          ></el-input>
        </el-form-item>
        <el-form-item>
          <el-button size="mini" @click="filterDatas">确认</el-button>
        </el-form-item>
      </el-form>
    </crumbs>
    <div class="contents knowledgeContents">
      <el-table :data="list" border style="width: 100%">
        <el-table-column
          type="index"
          :index="indexMethod"
          label="编号"
          width="120"
        ></el-table-column>
        <el-table-column prop="ruleTypeName" label="规则类型" width="240">
        </el-table-column>
        <el-table-column
          prop="libTypeName"
          label="规则术语类型"
        ></el-table-column>
        <el-table-column prop="libName" label="医学标准术语"> </el-table-column>
        <el-table-column label="操作" width="120" fixed="right">
          <template slot-scope="scope">
            <el-button type="text" size="small" @click="checkData(scope.row)"
              >查看</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <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>
    <el-dialog
      title="查看"
      :visible.sync="dialogVisible"
      :before-close="closecheckDialog"
      width="80rem"
      v-if="dialogVisible"
      :close-on-click-modal="false"
      :fullscreen="true"
    >
      <CheckRule
        :mergeCells="mergeCells"
        :rulelist="rulelist"
        :ruleTeamNum="ruleTeamNum"
        :baseTypeList="baseTypeList"
        :baseTermTypeList="baseTermTypeList"
        :row="row"
        :filterp="filter"
        :description="filter.description"
        :baseLibType="filter.baseLibType"
        :baseLibName="filter.baseLibName"
      >
      </CheckRule>
      <div style="text-align: center">
        <el-button @click="closecheckDialog" style="width: 180px"
          >关闭</el-button
        >
      </div>
    </el-dialog>
  </div>
</template>

<script>
import api from "@api/knowledgeLib.js";
import config from "@api/config.js";
import utils from "@api/utils.js";
import CheckRule from "./DiagCheckRule.vue";

export default {
  name: "ZskRuleCheck",
  data: function () {
    return {
      list: [],
      searched: false,
      filter: {
        // 	parStatus: '',
        // 	parDescription: '',
        // 	parConceptName: '',
        // 	parRuleType: '',
        description: "", //规则名称
        ruleType: "", //规则类型
        libType: "", //规则术语类型
        libName: "", //医学标准术语
        baseLibType: "", //基础规则术语类型
        baseLibName: "", //基础医学标准术语
      },
      ruleTeamNum: 0, //规则组个数
      ruleTypeList: [], //规则类型列表  1
      ruleTermTypeList: [], //规则术语类型列表  2
      conceptList: [], //医学标准术语列表 3
      baseTypeList: [], //基础规则类型列表  4
      baseTermTypeList: [], //基础规则术语类型列表 5
      rulelist: [], //查看
      cacheData: {},
      currentPage: 1,
      pageSize: config.pageSize,
      pageSizeArr: config.pageSizeArr,
      pageLayout: config.pageLayout,
      total: 0,
      titleWidth: "970px", //头部最小宽度
      dialogVisible: false,
      row: {},
      loading: null, //loading对象,
      mergeCells: [], //单元格合并规则
    };
  },
  components: {
    CheckRule,
  },
  created() {
    const that = this;
    this.getDict();
    //返回时避免参数未赋值就获取列表
    setTimeout(function () {
      that.getDataList();
    });
  },
  watch: {
    filter: {
      handler: function () {
        this.searched = false;
      },
      deep: true,
    },
  },
  // beforeRouteEnter(to, from, next) {
  //     next(vm => {
  //         //const pm = to.param;
  //         Object.assign(vm, to.params);
  //         vm.inCurrentPage=to.params.currentPage;
  //     })
  // },
  methods: {
    getDict() {
      api
        .zskgetDict()
        .then((res) => {
          if (res.data.code == "0") {
            const data = res.data.data;
            this.ruleTypeList = data[-101];
            this.ruleTermTypeList = data[-102];
            this.baseTypeList = data[-103];
            this.baseTermTypeList = data[-104];
          }
        })
        .catch((error) => {
          console.log(error);
        });
    },
    statusTrans(type) {
      const obj = this.ruleTypeList.find((it) => it.type === type);
      return obj && obj.name;
    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.currentPage = utils.getCurrentPage(
        this.currentPage,
        this.total,
        this.pageSize
      );
      this.getDataList();
    },
    filterDatas() {
      this.currentPage = 1;
      this.getDataList(1);
    },
    getDataList(flag, isTurnPage) {
      const params = this.getFilterItems(isTurnPage);
      this.searched = true;
      api
        .zskgetRulePage(params)
        .then((res) => {
          if (res.data.code == "0") {
            const data = res.data.data;
            this.list = data.records;
            if (!flag) {
              //搜索时不缓存
              this.cacheData[params.current] = data.records;
            } else {
              this.cacheData = {};
            }
            this.total = data.total;
            if (this.inCurrentPage !== undefined) {
              this.currentPage = this.inCurrentPage;
              this.inCurrentPage = undefined;
            }
          } else {
            this.warning(res.data.msg || "获取列表数据失败");
          }
        })
        .catch((error) => {
          loading.close();
          console.log(error);
        });
    },
    getFilterItems(isTurnPage) {
      //翻页时筛选条件没点确定则清空
      if (isTurnPage && !this.searched) {
        this.clearFilter();
      }
      const param = {
        current: this.inCurrentPage || this.currentPage,
        size: this.pageSize,
        libName: this.filter.libName.trim(),
        libType: this.filter.libType,
        ruleType: this.filter.ruleType,
        baseLibName: this.filter.baseLibName.trim(),
        baseLibType: this.filter.baseLibType,
        description: this.filter.description.trim(),
      };
      return param;
    },
    indexMethod(index) {
      return (this.currentPage - 1) * this.pageSize + index + 1;
    },
    currentChange(next) {
      this.currentPage = next;
      /*if (this.cacheData[next]) {       //如果已请求过该页数据，则使用缓存不重复请求
				            this.list = this.cacheData[next];
				          } else {*/
      this.getDataList(1, true);
      //}
    },
    warning(msg, type) {
      this.$message({
        showClose: true,
        message: msg,
        type: type || "warning",
      });
    },
    checkData(row) {
      console.log(123);
      this.row = row;
      if (!this.searched) {
        this.clearFilter();
      }
      const param = {
        baseLibName: this.filter.baseLibName,
        baseLibType: this.filter.baseLibType,
        description: this.filter.description,
        libName: row.libName,
        libType: row.libType,
        ruleType: row.ruleType,
      };
      const loading = this.$loading({
        lock: true,
        text: "Loading",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)",
      });
      api
        .zskgetRuleDetail(param)
        .then((res) => {
          loading.close();
          if (res.data.code == "0") {
            this.dialogVisible = true;
            let datalist = [];
            const data = res.data.data.ruleConditionDTOList;
            this.ruleTeamNum = data.length;
            let mergeArr = [];
            for (let i in data) {
              let datai = data[i];
              const dtoList = datai.ruleBaseDTOList;
              for (let j = 0; j < dtoList.length; j++) {
                const isFirst = j === 0;
                if (isFirst) {
                  const len = datalist.length;
                  mergeArr.push(
                    { row: len, col: 0, rowspan: dtoList.length, colspan: 1 },
                    { row: len, col: 1, rowspan: dtoList.length, colspan: 1 },
                    { row: len, col: 2, rowspan: dtoList.length, colspan: 1 },
                    { row: len, col: 3, rowspan: dtoList.length, colspan: 1 }
                  );
                }
                datalist.push({
                  id: +i + 1,
                  rowspan: isFirst ? dtoList.length : 0,
                  colspan: isFirst ? 1 : 0,
                  ruleGroup: datai.ruleGroup,
                  hasSubCond: datai.hasSubCond,
                  msg: datai.msg,
                  description: datai.description,
                  ...dtoList[j],
                });
              }
            }
            this.rulelist = datalist;
            this.mergeCells = mergeArr;
            console.log(this.rulelist);
          } else {
            this.$message(res.data.msg || "获取详情失败，请稍后重试");
          }
        })
        .catch((error) => {
          console.log(error);
        });
    },
    closecheckDialog() {
      this.dialogVisible = false;
    },
    clearFilter() {
      this.filter = {
        description: "",
        ruleType: "",
        libType: "",
        libName: "",
        baseLibType: "",
        baseLibName: "",
      };
    },
  },
};
</script>

<style lang="less" scoped>
@import "../../less/admin.less";

/deep/ .container.knowledgeTitle {
  height: 80px;
}

/deep/ .contents.knowledgeContents {
  padding: 104px 20px 0;
}

/deep/ .secLine.el-form {
  float: right;
  display: block;
  position: relative;
  top: -5px;
}

.delete {
  color: red;
}

.review {
  color: #22ccc8;
}

#upFile {
  display: none !important;
}

.unvailable {
  color: #fe7d3d;

  &:hover {
    color: #f19061;
  }
}

/deep/.el-dialog__body {
  padding-top: 0px;
  height: auto;
}
/deep/.el-dialog__title {
  color: #333333;
  font-weight: bold;
  font-size: 16px;
}
/deep/.el-dialog__header {
  border-left: 4px #48c5d7 solid;
}
/deep/.elx-header--column.col--ellipsis > .elx-cell .elx-cell--title {
  overflow: unset;
  text-overflow: unset;
  white-space: break-spaces;
  text-align: center;
}
/deep/.elx-table
  .elx-body--column.col--ellipsis:not(.col--actived)
  > .elx-cell {
  text-align: center;
}
/deep/.elx-table .elx-body--row.row--current {
  background-color: unset;
}
</style>
