diagnosis.admin/src/views/business/RecipeAuditD.vue

<template>
  <div class="recipeAuditD">
    <div class="btn flex flex-row-between">
      <el-button size="small" type="primary" @click="$router.back()">返回</el-button>
      <el-button size="small" type="primary" @click="submit">提交</el-button>
    </div>
    <div class="container-detail flex flex-row-left flex-col-top">
      <div class="recipe-left" v-if="msg.patient">
        <div class="title flex flex-row-left flex-col-center">
          <img src="../../assets/new-icon/people.png" alt />
          <span>患者信息</span>
        </div>
        <div class="msg">
          <div class="msg-row flex flex-row-left flex-col-cneter">
            <div class="msg-item flex-plane-center-l">
              <span>姓名：</span>
              <div>{{msg.patient.name}}</div>
            </div>
            <div class="msg-item flex-plane-center-l">
              <span>性别：</span>
              <div>{{msg.patient.sex}}</div>
            </div>
            <div class="msg-item flex-plane-center-l">
              <span>年龄：</span>
              <div>{{msg.patient.age}}岁</div>
            </div>
          </div>
          <div class="msg-row flex flex-row-left flex-col-cneter">
            <div class="msg-item flex-plane-center-l">
              <span>备注：</span>
              <div>{{msg.patient.pregnancy==2?'妊娠期':msg.patient.breastfeeding==1?'哺乳期':'无'}}</div>
            </div>
            <div class="msg-item flex-plane-center-l">
              <span>电话：</span>
              <div>{{msg.patient.phone}}</div>
            </div>
          </div>
          <div class="msg-item flex-plane-center-l">
            <span>身份证：</span>
            <div>{{msg.patient.idcard}}</div>
          </div>
          <div class="msg-item flex-plane-center-l">
            <span>地址：</span>
            <div>{{msg.patient.province}}{{msg.patient.city}}{{msg.patient.district}}{{msg.patient.detailadress}}</div>
          </div>
        </div>
        <div class="title flex flex-row-left flex-col-center">
          <img src="../../assets/new-icon/book.png" alt />
          <span>就诊信息</span>
        </div>
        <div class="msg">
          <div class="msg-row flex flex-row-left flex-col-center">
            <div class="msg-item flex-plane-center-l">
              <span>就诊日期：</span>
              <div>{{caseItem.treatmentTime}}</div>
            </div>

            <div class="msg-item flex-plane-center-l">
              <span>就诊科室：</span>
              <div>{{caseItem.clinic}}</div>
            </div>
          </div>

          <div class="msg-row flex flex-row-left flex-col-center">
            <div class="msg-item flex-plane-center-l">
              <span>就诊医生：</span>
              <div>{{msg.outpatientRecords.doctor}}</div>
            </div>

            <div class="msg-item flex-plane-center-l" v-if="false">
              <span>开方时间：</span>
              <div>{{msg.outpatientRecords.createTime}}</div>
            </div>
          </div>

          <div class="msg-row flex flex-row-left flex-col-center">
            <div class="msg-item flex-plane-center-l">
              <span>中医诊断：</span>
              <div>{{caseItem.tcmDiagnosis}}</div>
            </div>

            <div class="msg-item flex-plane-center-l">
              <span>治法：</span>
              <div>{{caseItem.treatment}}</div>
            </div>
          </div>
          <div class="msg-item flex flex-col-top">
            <span>其他诊断：</span>
            <div>
              <div
                v-for="(item,index) in msg.secondDiagnosis"
                :key="index"
              >{{item.namemedicine?item.namemedicine-item.syndrometypes:item.diagnosis}}</div>
            </div>
          </div>
          <div class="msg-item flex-plane-center-l">
            <span>主诉：</span>
            <div>{{msg.electronicmedicalrecord?msg.electronicmedicalrecord.chiefcomplaint:''}}</div>
          </div>
          <div class="msg-item flex-plane-center-l">
            <span>现病史：</span>
            <div>{{msg.electronicmedicalrecord?msg.electronicmedicalrecord.historypresent:''}}</div>
          </div>
          <div class="msg-item flex-plane-center-l">
            <span>既往史：</span>
            <div>{{msg.electronicmedicalrecord?msg.electronicmedicalrecord.pasthistory:''}}</div>
          </div>
          <div class="msg-item flex-plane-center-l">
            <span>体格检查：</span>
            <div>{{msg.electronicmedicalrecord?msg.electronicmedicalrecord.physicalexamination:''}}</div>
          </div>
          <div class="msg-item flex-plane-center-l">
            <span>辅助检查：</span>
            <div>{{msg.electronicmedicalrecord?msg.electronicmedicalrecord.supplementaryexamination:''}}</div>
          </div>
          <!-- <div class="msg-item flex-plane-center-l">
                        <span>诊断：</span>
                        <div>{{msg.mainDiagnosis.diagnosis?msg.mainDiagnosis.diagnosis:msg.mainDiagnosis.namemedicine}}
                        </div>
                    </div>
                    <div class="msg-item flex-plane-center-l" v-if="!msg.mainDiagnosis.diagnosis">
                        <span>治法：</span>
                        <div>{{msg.mainDiagnosis.namemedicine}}</div>
          </div>-->
          <!-- <div class="msg-item flex-plane-center-l">
                        <span>处方类型：</span>
                        <div>中药处方</div>
          </div>-->
          <div class="msg-item flex flex-col-top">
            <span>报告图片：</span>
            <div>
              <el-image
                :preview-src-list="msg.electronicmedicalrecord.image1"
                style="width:100px;height:100px;margin-right:20px;"
                :src="item1"
                alt
                v-for="(item1,index1) in msg.electronicmedicalrecord.image1"
                :key="index1"
              />
            </div>
          </div>
        </div>
      </div>

      <div class="recipe-right" v-if="msg.patientprescription">
        <div class="title flex flex-row-left flex-col-center">
          <img src="../../assets/new-icon/people.png" alt />
          <span>处置方案</span>
        </div>
        <div class="recipe-tabs">
          <div
            class="recipe-tabs-item"
            v-for="(item,index) in msg.patientprescription"
            :key="index"
            @click="changeTab(item,index)"
          >
            <div
              class="name"
              :style="current==index?'color:#5386F6':''"
            >{{item.type==0?'中药处方'+(item.seqn):item.type==1?'中药制剂处方':'适宜技术处方'}}</div>
            <img src="../../assets/new-icon/pass.png" alt v-if="item.shState==0" />
            <img src="../../assets/new-icon/no-pass.png" alt v-if="item.shState==1" />
          </div>
        </div>

        <div class v-if="msg.patientprescription[current].type==0">
          <chinesepad :recipeData="chineseData"></chinesepad>
        </div>

        <div class v-if="msg.patientprescription[current].type==1">
          <chineseMadepad :recipeData="chineseMadeData"></chineseMadepad>
        </div>

        <div class v-if="msg.patientprescription[current].type==2">
          <suitPad :recipeData="suitData"></suitPad>
        </div>

        <!-- 审核不通过原因 -->
        <div
          v-if="msg.patientprescription[current].revierwstate<2?true:false"
          style="color:red;margin:15px 0;font-size: 14px;padding-left: 10px;"
        >不通过原因：{{msg.patientprescription[current].cause}}</div>
        <!-- 审核 -->
        <!--  -->

        <div class="review" v-if="msg.patientprescription[current].revierwstate>=2?true:false">
          <div class="flex flex-row-right">
            <el-button type="primary" size="mini" style="width:80px;" @click="pass">通过</el-button>
          </div>
          <div class="flex flex-row-right" style="margin-top:10px;">
            <input v-model="reason" class="reason-input" type="text" placeholder="请输入不通过原因" />
            <el-button type="danger" size="mini" style="width:80px;" @click="noPass">不通过</el-button>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import {
  getRecipeAuditD,
  auditRecipe,
  getMedForRecipeA
} from "@/api/business.js";
import {
  getChinesePadDetail,
  getChineseMadePad,
  getSuitMadePad
} from "@/api/standard";
import chinesepad from "@/components/ui/chineseMedicinePad.vue";
import chineseMadepad from "@/components/ui/chineseMadePad.vue";
import suitPad from "@/components/ui/suitMadePad.vue";
import { getRecordDetail } from "@/api/diagnosis";
import { mapState, mapGetters, mapActions, mapMutations } from "vuex";

import {formatPicture} from "@/utils/picture";

export default {
  components: {
    chinesepad,
    chineseMadepad,
    suitPad
  },
  data() {
    return {
      type: "edit",
      caseItem: null,
      radio: 0,
      current: 0,
      suitData: {},
      chineseData: {},
      chineseMadeData: {},
      ops: {
        vuescroll: {},
        scrollPanel: {},
        rail: {
          keepShow: true
        },
        bar: {
          hoverStyle: true,
          onlyShowBarOnScroll: false, //是否只有滚动的时候才显示滚动条
          background: "#C1C1C1", //滚动条颜色
          opacity: 0.5, //滚动条透明度
          "overflow-x": "hidden"
        }
      },
      msg: {},
      reason: ""
    };
  },
  created() {
    if (this.$route.query.type) {
      this.type = this.$route.query.type;
    }
    this.getRecipeAuditD();
  },
  methods: {
    // 切换药方
    changeTab(item, index) {
      if (item.type == 0) {
        this._getChinesePadDetail(item.pid);
      }
      if (item.type == 1) {
        this._getChineseMadePad(item.pid);
      }

      if (item.type == 2) {
        this._getSuitMadePad(item.pid);
      }
      this.current = index;
      this.reason = item.reason;
    },
    // 审核通过
    pass() {
      this.msg.patientprescription[this.current].shState = 0;
    },
    noPass() {
      if (!this.reason) {
        this.$message.error("请输入不通过原因");
        return;
      }
      this.msg.patientprescription[this.current].reason = this.reason;
      this.msg.patientprescription[this.current].shState = 1;

      if (this.current != this.msg.patientprescription.length - 1) {
        let item = this.msg.patientprescription[this.current + 1];
        if (item.type == 0) {
          this._getChinesePadDetail(item.pid);
        }
        if (item.type == 1) {
          this._getChineseMadePad(item.pid);
        }

        if (item.type == 2) {
          this._getSuitMadePad(item.pid);
        }

        this.current += 1;
        this.reason = "";
      }
    },
    submit() {
      let reviewNum = 0;
      this.msg.patientprescription.forEach(item => {
        if (item.shState === 0 || item.shState === 1) {
          reviewNum += 1;
        }
      });

      if (reviewNum != this.msg.patientprescription.length) {
        this.$message.warning("当前有处方尚未审核");
        return;
      }

      this.auditRecipe();
    },
    stateC(e, index) {
      this.msg.patientprescription[index].revierwstate = e;
    },
    async auditRecipe() {
      let reviewParam = [];
      this.msg.patientprescription.forEach(item => {
        let obj = {
          reviewState: item.shState,
          pid: item.pid,
          cause: item.reason
        };
        if (item.revierwstate >= 2) {
          reviewParam.push(obj);
        }
      });
      let params = {
        reviewParam
      };
      const loading = this.$loading({
        lock: true,
        text: "正在保存",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)"
      });
      let res = await auditRecipe(params).catch(err => {
        loading.close();
      });
      if (res.ResultCode == 0) {
        loading.close();
        this.$message.success("保存成功");
        setTimeout(() => {
          this.$router.back();
        }, 3000);
      } else {
      }
    },
    async getRecipeAuditD() {
      let res = await getRecipeAuditD(this.$route.query.pid);
      if (res.ResultCode == 0) {
        res.Data.electronicmedicalrecord.image1 = formatPicture(res.Data.electronicmedicalrecord.image1);

        res.Data.patientprescription.forEach(item => {
          item.reason = "";
          if (item.revierwstate == 2) {
            item.shState = 2;
          } else {
            item.shState = item.revierwstate;
          }
        });
        this.msg = res.Data;
        this._getRecordDetail(res.Data.patientprescription[0].recordid);

        // 加载处方笺数据
        if (res.Data.patientprescription[0].type == 0) {
          this._getChinesePadDetail(res.Data.patientprescription[0].pid);
        }

        if (res.Data.patientprescription[0].type == 1) {
          this._getChineseMadePad(res.Data.patientprescription[0].pid);
        }

        if (res.Data.patientprescription[0].type == 2) {
          this._getSuitMadePad(res.Data.patientprescription[0].pid);
        }

        res.Data.patientprescription.forEach((item, index) => {
          let arr = [];
          item.detail.forEach(item1 => {
            arr.push(item1.platformdrugid);
          });
          this.getMedForRecipeA(arr.join(","), item.pid);
        });

        // this.msg.patientprescription.filter(item => {
        //     return item.revierwstate = '0'
        // })
      }
    },
    // 获取就诊详情
    async _getRecordDetail(id) {
      let res = await getRecordDetail({
        id: id
        // id: 'e68d293d-f1b7-4f6d-bed4-42b1aba6973e'
      });
      if (res.ResultCode == 0) {
        this.caseItem = res.Data;
      } else {
        this.$message.error(res.ResultInfo);
      }
    },
    // 获取合理用药信息
    async getMedForRecipeA(matids, recipeid) {
      let res = await getMedForRecipeA({
        matId: matids,
        // orgId: this.getuserinfo.organizationid
        preId: recipeid
      });
      if (res.ResultCode == 0) {
        this.msg.patientprescription.forEach((item, index) => {
          item.byty = "";
          item.bzjj = "";

          item.chao = [];
          if (item.pid == recipeid) {
            res.Data.forEach(item1 => {
              item1.matby = item1.matby.split(",");
              item.byty +=
                item1.matname + "不宜与" + item1.matby.join(",") + "同用。";
              item.bzjj += item1.matbzjj ? item1.matbzjj : "无" + "。";

              if (item1.matid == item.detail[index].platformdrugid) {
                if (item1.matmaxdosage < item.detail[index].dose) {
                  itme.chao.push(
                    `${item.detail[index].matname}${item.detail[index].dose}${
                      item.detail[index].unit
                    }(${item1.matmindosage - item1.matmaxdosage})`
                  );
                }
              }
            });
          }

          this.$set(this.msg.patientprescription, index, item);
        });
      }
    },

    // 中药处方笺数据
    async _getChinesePadDetail(id) {
      const loading = this.$loading({
        lock: true,
        text: "正在加载处方笺数据,请稍后",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)"
      });
      let res = await getChinesePadDetail({
        pid: id
      }).catch(err => {
        loading.close();
      });

      if (res.ResultCode == 0) {
        loading.close();
        this.chineseData = res.Data;
      }
    },
    // 中药制剂处方笺
    async _getChineseMadePad(id) {
      const loading = this.$loading({
        lock: true,
        text: "正在加载处方笺数据,请稍后",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)"
      });
      let res = await getChineseMadePad({
        pid: id
      }).catch(err => {
        loading.close();
      });

      if (res.ResultCode == 0) {
        loading.close();
        this.chineseMadeData = res.Data;
      }
    },
    // 适宜技术处方笺
    async _getSuitMadePad(id) {
      const loading = this.$loading({
        lock: true,
        text: "正在加载处方笺数据,请稍后",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)"
      });
      let res = await getSuitMadePad({
        pid: id
      }).catch(err => {
        loading.close();
      });

      if (res.ResultCode == 0) {
        loading.close();
        this.suitData = res.Data;
      }
    }
  },
  computed: {
    ...mapGetters(["getuserinfo"])
  }
};
</script>
<style lang="scss" scoped>
@import "../../style/common.scss";

.recipeAuditD {
  // height: 100%;
  // height: 70vh;

  .container-detail {
    margin-top: 5px;
    height: 76vh;
    overflow: hidden;
  }

  .recipe-left {
    height: 100%;
    overflow: auto;
    padding: 5px 5px;
    background: #ffffff;
    border-radius: 5px;
    // width: 575px;
    flex: 1;
    margin-right: 8px;
    // box-sizing: border-box;
    height: 100%;

    .title {
      margin-bottom: 10px;

      img {
        width: 24px;
        margin-right: 5px;
      }

      span {
        font-size: 16px;
        font-weight: 600;
      }
    }

    .back-btn {
      width: 74px;
      height: 36px;
      background: #5386f6;
      border-radius: 4px;
      font-size: 14px;
      font-family: PingFang SC;
      font-weight: 400;
      color: #ffffff;
      margin-bottom: 34px;
      cursor: pointer;
    }

    .msg {
      font-size: 14px;
      font-family: PingFang SC;
      font-weight: 400;
      color: #333333;

      .msg-item {
        margin-bottom: 15px;
        flex: 1;
      }

      .msg-row {
        .msg-item {
          max-width: 300px;
        }
      }

      span {
        text-align-last: justify;
        width: 80px;
        text-align: justify;
      }

      div {
        flex: 1;
        overflow: hidden;
      }
    }
  }

  .recipe-right {
    width: 450px;
    height: 100%;
    box-sizing: border-box;
    padding: 5px 5px 20px;
    background: #ffffff;
    border-radius: 5px;

    // flex: 1;
    overflow: auto;

    .title {
      margin-bottom: 10px;

      img {
        width: 24px;
        margin-right: 5px;
      }

      span {
        font-size: 16px;
        font-weight: 600;
      }
    }

    .recipe-tabs {
      // border: 1px solid #000;
      overflow: auto;
      width: 100%;
      white-space: nowrap;
      border-bottom: 0;
      border-left: 0;
      border-right: 0;

      &-item {
        // flex: 1;
        display: inline-block;
        width: 89px;
        font-size: 14px;
        // color: #5386F6;
        padding: 5px 0px;
        box-sizing: border-box;
        border-top: 1px solid #000;
        border-right: 0px solid #000;
        border-bottom: 1px solid #000;
        border-left: 1px solid #000;
        text-align: center;
        cursor: pointer;
        position: relative;
        overflow: hidden;

        img {
          width: 35px;
          z-index: 1;
          position: absolute;
          bottom: 0px;
          right: 5px;
        }

        .name {
          z-index: 9;
        }
      }

      &-item:last-child {
        border-right: 1px solid #000;
      }
    }
  }

  .reason-input {
    flex: 1;
    margin-right: 10px;
    padding-left: 10px;
    outline: none;
  }
}

// 滚动条位置
.recipeAuditD ::v-deep .__bar-is-vertical {
  right: -1px !important;
}

// 隐藏横向滚动条
.recipeAuditD ::v-deep .__bar-is-horizontal {
  display: none !important;
}
</style>
<style lang="scss" scoped>
@media screen and (min-width: 1681px) and (max-width: 1920px) {
  .recipeAuditD {
    .container-detail {
      height: 84vh;
    }
  }
}

@media screen and (min-width: 1601px) and (max-width: 1680px) {
  .recipeAuditD {
    .container-detail {
      height: 84vh;
    }
  }
}

@media screen and (min-width: 1361px) and (max-width: 1600px) {
  .recipeAuditD {
    .container-detail {
      height: 77vh;
    }
  }
}

@media screen and(min-width:1281px) and (max-width: 1360px) {
  .recipeAuditD {
    .container-detail {
      height: 78vh;
    }
  }
}
</style>