peisweb/src/components/doctorCheck/PacsTemplate copy.vue

<template>
  <div style="display: flex;">
    <div :style="`width: 220px;height:550px;border: 1px solid #EEE;`">
      <div style="margin:2px 2px 2px 2px;">
        <el-input placeholder="输入关键字进行过滤" v-model="filterText" size="small" />
      </div>
      <div>
        <el-tree :style="`overflow: scroll;width: 200px;height:510px;`" :data="pacsTemplateTree"
          :props="treeprops" :filter-node-method="filterNode" :expand-on-click-node="false"
          highlight-current ref="ref_tree" show-checkbox default-expand-all @check-change="handleCheckChange" >
          <span class="custom-tree-node" slot-scope="{ node, data }">
            <div>
              <span class="treeicons">
                <img style="width:20px;height:20px;vertical-align: sub;" src="@/assets/images/order.png"
                  v-if="!data.parentId" />
              </span>
              <span :class="!data.parentId ? 'maxtitle' : 'mintitle'">{{ node.label }}
              </span>
            </div>
          </span>
        </el-tree>
      </div>
    </div>
    <div :style="`display: block;width:620px; margin-left: 5px;`">      
      <div>
        <span>检查结果：</span>
        <el-input style="width: 100%;" type="textarea" v-model="result" placeholder="请输入描述"
          :autosize="{ minRows: decLineCount, maxRows: decLineCount }" />
      </div>
      <div style="margin-top: 5px;">
        <span>检查结论：</span>
        <div style="display: flex;justify-content: space-between;">
          <el-input style="width: 100%;" type="textarea" v-model="summary" placeholder="请输入结论"
            :autosize="{ minRows: conLineCount, maxRows: conLineCount }" />
        </div>
      </div>
      <div style="display: flex;justify-content: space-between;margin-top: 10px;">
        <div></div>
        <div>
          <!--
          <el-button type="primary" @click="btnTest" class="commonbutton">测试</el-button>
            -->
          <el-button type="primary" @click="btnClear" class="commonbutton">清除</el-button>
          <el-button type="primary" @click="btnDefault" class="commonbutton">默认结果</el-button>
          <el-button type="primary" @click="btnOk" class="commonbutton">确定</el-button>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import moment from "moment";
import { mapState } from "vuex";
import { getapi, postapi, putapi, deletapi } from "@/api/api";
import { hadoopGet, hadoopPost, hadoopPut, hadoopDel } from "../../api/hadoopApi"
import { arrayReduce, arrayExistObj, deepCopy, reMadeOrgTree } from "../../utlis/proFunc";
import { getTreePids, getTreeAllChildIdsById, madeTree } from "../../utlis/tree";

export default {
  components: {},
  props: ["refParams", "refFuncOther"],
  data() {
    return {
      filterText: '',
      description: [],  // 描述      
      conclusion: [],  // 结论
      descriptionChoosedPre: [], // 前次选中
      descriptionChoosed: [],  // 所有选中的描述的集合，切换部位时可用于描述初始化选择
      conclusionChoosed: [],  // 选中的结论
      conclusionAll: [],  // 所有选中的描述，对应的结论
      result: '', // 检查结果
      summary: '', // 小结
      pacsTemplateTree: [], //类别 + 模板树
      treeprops: {
        label: "displayName",  // label/displayName
        value: "id",
        id: "id",
        children: "children",
      }, //树形组件的数据结构 
      
    };
  },
  //<el-tree :data="$store.state.customerOrg.ref_tree" :props="$store.state.customerOrg.treeprops" @node-click="treeclick"></el-tree>
  computed: {
    ...mapState(["window", "dialogWin","doctorCheck"]),

    mainHeight() {
      return this.window.pageHeight - 118;
    },

    tableHeight() {
      return this.mainHeight - 120 - 80 - 80;
    },

    decLineCount(){
      return this.refParams.from == 'dcm' ? 14:16
    },

    conLineCount(){
      return this.refParams.from == 'dcm' ? 7:8
    }
  },
  //创建组件后
  created() {

  },


  //挂载组件完成
  mounted() {
    //获取体检单位列表树信息
    this.getPacsTemplateTree();
    this.init()
  },

  methods: {
    // 初始化数据
    init() {      
      this.btnClear()
      this.description = []
      this.result = this.refParams.result || ''
      this.summary = this.refParams.summary || ''  
      console.log('init')    
    },

    //勾选节点
    handleCheckChange(data, checked, indeterminate) {
      // console.log('data, checked, indeterminate,this.menuInfoSet',data, checked, indeterminate,this.menuInfoSet);

      this.description = []
      this.conclusion = []
      postapi('/api/app/BigtextResultTemplate/GetBigtextResultTemplateDetail', { bigtextResultTemplateIds: [data.id] })
        .then(res => {
          if (res.code > -1) {
            this.description = res.data.descriptionDetail
            this.conclusion = res.data.conclusionDetail
            let opraType = false
            if(checked){   
              // 勾选
              opraType = true
            }else if(!indeterminate){
              // 取消勾选
              opraType = false
            }
            this.chooseDescription(opraType)
            this.chooseConclusion(opraType)
          }
        });      
    },

    //树过滤
    filterNode(value, data) {
      //console.log(value,data)
      if (!value) return true; 
      return data['displayName'].indexOf(value) > -1 || data['simpleCode'].indexOf(value.toUpperCase()) > -1;
    },

    // 选择true或取消false 描述
    chooseDescription(opraType){
      let bfind = false
      this.description.forEach(e => {
        bfind = this.result.includes(e.description)
        if(opraType){
          if(!bfind){
            if(this.result){
              this.result += "；" + e.description
            }else{
              this.result = e.description
            }
          }
        }else{
          if(bfind) this.result = this.result.replaceAll(e.description + '；','').replaceAll(e.description,'')
        }
      });
    },

    // 选择true或取消false 描述
    chooseConclusion(opraType){
      let lfind = 0
      let summarys = this.summary.split('；')
      this.conclusion.forEach(e => {
        lfind = summarys.indexOf(e.conclusion)
        if(opraType){
          if(lfind == -1) summarys.push(e.conclusion)
        }else{
          if(lfind > -1) summarys.splice(lfind,1)
        }
      });
      let summary = ''
      summarys.forEach(e => {
        if(summary){
          summary += '；' + e
        }else{
          summary = e
        }
      });
      this.summary = summary
    },

    //获取pacs结果模板
    getPacsTemplateTree() {
      let resultType = [], resultTemplate = [], treeData = []
      postapi('/api/app/BigtextResultType/GetList',{
        itemTypeId:this.refParams.row.itemTypeId
      })
        .then(res => {
          if (res.code > -1) {
            resultType = res.data
            resultType.forEach(e => {
              e.disabled = true
            });          
            return postapi('/api/app/BigtextResultTemplate/GetList',{})
          }
        })
        .then(res => {
          if (res && res.code > -1) {
            res.data.forEach(e => {
              resultTemplate.push(Object.assign({}, e, { parentId: e.bigtextResultTypeId }))
            });
            treeData = resultType.concat(resultTemplate)
            // console.log('treeData',treeData,resultType,)
            this.pacsTemplateTree = madeTree(treeData, "children", "parentId", "id", null)
          }
        })
    },
 
    btnTest() {
      console.log('this.descriptionChoosed', this.descriptionChoosed)
      console.log('this.conclusionChoosed', this.conclusionChoosed)
    },

    // 清除所选描述与结论
    btnClear() {
      console.log('btnClear')
      this.result = ''
      this.summary = ''      
    },

    // 默认结果
    btnDefault() {
      this.btnClear()
      this.result = this.refParams.row.defaultResult
      this.summary = '未见异常'
    },

    // 确定
    btnOk() {
      this.refFuncOther(this.refParams.row, this.refParams.index, { result: this.result, summary: this.summary })
      this.dialogWin.PacsTemplate = false
    },
  },

  watch: {
    "filterText"(newVal, oldVal) {
      if (newVal != oldVal) this.$refs['ref_tree'].filter(newVal);
    },

    "refParams.refresh"(newVal, oldVal) {
      if (newVal && newVal != oldVal) this.init();
    },

  },
};
</script>
<style lang="scss" scoped>
@import "../../assets/css/global_dialog.css";
@import "../../assets/css/global_table.css";
@import "../../assets/css/global_input.css";
@import "../../assets/css/global.css";
@import "../../assets/css/global_tree.css";

:deep .el-tree-node>.el-tree-node__children {
  overflow: visible;
}
</style>