diagnosis.admin/src/views/diagnosis/components/submitRecipe copy.vue

<template>
  <div class="recipe">
    <Popup
      @cancle="closePopup"
      width="60%"
      title="处置方案"
      :showDialog.sync="show"
      distanceTop="3vh"
      :showBtns="false"
      :showBody="false"
    >
      <div slot="body">
        <div class="recipe-priview flex flex-col-top">
          <div class="left-table">
            <div class="table-body">
              <div class="table-title">治疗意见</div>
              <div
                :class="['table-tr flex flex-row-left flex-row-top',recipeItem.pid==item.pid?'table-tr-active':'']"
                v-for="(item,index) in recipes"
                :key="index"
                @click="leftChange(item)"
              >
                <div class="flex-center" v-if="item.recipeType==1">中药处方{{index+1}}</div>
                <div class="flex-center" v-if="item.recipeType==2">中药制剂处方</div>
                <div class="flex-center" v-if="item.recipeType==3">适宜技术处方</div>
                <div class="flex-center">{{item.lumpSum}}元</div>

                <div>
                  <img src="~@/assets/new-icon/close.png" alt @click.self="deleteItem(index)" />
                </div>
              </div>
              <div :class="['table-tr flex flex-row-left flex-row-top']">
                <div class="flex-center">合计金额</div>
                <div class="flex-center">{{totalCount}}元</div>
                <div></div>
              </div>
            </div>
            <!-- 安全合理用药审查报告 -->
            <div class="report" v-if="false">
              <h3>安全合理用药审查报告</h3>
              <div class="patiens-msg mr-t10" v-if="rationalMed.length>0">
                <div class="p">
                  <!-- {{item.matname}}({{item.matbzjj}}) -->
                  <!-- <div class="patiens-name">{{item.matname}}</div> -->
                  <div class="patiens-cate">超剂量药品：</div>
                  <div class="patiens-desc" v-for="(item,index) in rationalMed10" :key="index">
                    <span v-if="item.showDose">
                      <span class="matname">{{item.matname}}</span>
                      <span style="color:red;">({{item.matmindosage}}-{{item.matmaxdosage}})</span>
                    </span>
                  </div>
                </div>

                <div class="p" v-if="rationalMed2.length>0">
                  <div class="patiens-cate">慎忌禁用药：</div>
                  <div class="patiens-desc" v-for="(item,index) in rationalMed2" :key="index">
                    <span v-if="item.matsjj">
                      <span class="matname">{{item.matname}}</span>
                      ({{item.matsjj}})
                    </span>
                  </div>
                </div>

                <div class="p" v-if="rationalMed3.length>0">
                  <div class="patiens-cate">孕妇慎忌禁：</div>
                  <div class="patiens-desc" v-for="(item,index) in rationalMed3" :key="index">
                    <span v-if="item.matyfsjj">
                      <span class="matname">{{item.matname}}</span>
                      <span :style="{color:item.matyfsj==3?'red':''}">({{item.matyfsjj |fyfsjj}})</span>
                    </span>
                  </div>
                </div>

                <div class="p" v-if="rationalMed4.length>0">
                  <div class="patiens-cate">服药饮食禁忌：</div>
                  <div class="patiens-desc" v-for="(item,index) in rationalMed4" :key="index">
                    <span v-if="item.matysjj">
                      <span class="matname">{{item.matname}}</span>
                      ({{item.matysjj?item.matysjj:'无'}})
                    </span>
                  </div>
                </div>

                <div class="p" v-if="rationalMed5.length>0">
                  <div class="patiens-cate">药物毒性说明：</div>
                  <div class="patiens-desc" v-for="(item,index) in rationalMed5" :key="index">
                    <span v-if="item.matdxsm">
                      <span class="matname" style="color:red;">{{item.matname}}</span>
                      ({{item.matdxsm?item.matdxsm:'无'}})
                    </span>
                  </div>
                </div>

                <div class="p" v-if="rationalMed6.length>0">
                  <div class="patiens-cate">病证用药禁忌：</div>
                  <div class="patiens-desc" v-for="(item,index) in rationalMed6" :key="index">
                    <span v-if="item.matbzjj">
                      <span class="matname">{{item.matname}}</span>
                      ({{item.matbzjj?item.matbzjj:'无'}})
                    </span>
                  </div>
                </div>

                <div class="p" v-if="rationalMed7.length>0">
                  <div class="patiens-cate">十八反：</div>
                  <div class="patiens-desc" v-for="(item,index) in rationalMed7" :key="index">
                    <!-- <span v-if='item.matsbf'>{{fsbf(item.matsbf,item.matname)}}</span> -->
                    <span v-if="item.matsbf">
                      <span style="color:red;">{{item.matname}}</span>
                      反{{item.matsbf}}
                    </span>
                  </div>
                </div>

                <div class="p" v-if="rationalMed8.length>0">
                  <div class="patiens-cate">十九畏：</div>
                  <div class="patiens-desc" v-for="(item,index) in rationalMed8" :key="index">
                    <!-- <span v-if="item.matsjw">{{fsjw(item.matsjw,item.matname)}}</span> -->
                    <span v-if="item.matsjw">
                      <span style="color:red;">{{item.matname}}</span>
                      畏{{item.matsjw}}
                    </span>
                  </div>
                </div>

                <div class="p" v-if="rationalMed9.length>0">
                  <div class="patiens-cate">用药不宜：</div>
                  <div class="patiens-desc" v-for="(item,index) in rationalMed9" :key="index">
                    <span v-if="item.matby">{{fmatby(item.matby,item.matname) }}</span>
                  </div>
                </div>
              </div>
            </div>
            <!-- <div style="text-align:center;margin-top:10px;" v-if="recipeItem.showSign">
                            <el-button size="small" type="primary" @click="signToRecipt">双签名</el-button>
            </div>-->
          </div>
          <!-- 右侧处方笺 -->
          <div class="right-pad">
            <!-- 中药处方 -->
            <div v-if="recipeItem.recipeType==1">
              <chineseMedicinePad ref="chineseM" :recipeData="recipeItem"></chineseMedicinePad>
            </div>
            <!-- 中药制剂 -->
            <div v-if="recipeItem.recipeType==2">
              <chineseMadePad :recipeData="recipeItem"></chineseMadePad>
            </div>
            <!-- 适宜技术处方 -->
            <div v-if="recipeItem.recipeType==3">
              <suitMadePad :recipeData="recipeItem"></suitMadePad>
            </div>
          </div>
        </div>
        <div class="flex-center btns">
          <el-button size="small" @click="closePopup">取消</el-button>
          <el-button size="small" type="primary" @click="sureToSubmit">确认并提交</el-button>
        </div>
      </div>
    </Popup>
  </div>
</template>

<script>
import { addRecipe, updateRecipe } from "@/api/diagnosis.js";
import { mapGetters } from "vuex";
import Popup from "@/components/Propup.vue";
import chineseMedicinePad from "@/components/ui/chineseMedicinePad.vue";
import chineseMadePad from "@/components/ui/chineseMadePad.vue";
import suitMadePad from "@/components/ui/suitMadePad.vue";
export default {
  components: {
    Popup,
    chineseMedicinePad,
    chineseMadePad,
    suitMadePad
  },
  props: {
    show: {
      type: Boolean,
      default: false
    },
    priviewData: {
      type: Object,
      default: () => {
        return {};
      }
    }
  },
  data() {
    return {
      showDialog: false,
      recipes: [], // 处方数据
      recipeItem: {}, // 右侧显示处方
      rationalMed: [],
      rationalMed1: [],
      rationalMed2: [],
      rationalMed3: [],
      rationalMed4: [],
      rationalMed5: [],
      rationalMed6: [],
      rationalMed7: [],
      rationalMed8: [],
      rationalMed9: [],
      rationalMed10: []
    };
  },
  watch: {
    show() {
      this.showDialog = this.show;
    },
    priviewData: {
      deep: true,
      handler: function() {
        if (!this.show) return;
        if (Object.keys(this.priviewData).length == 0) return;
        this.dealPriviewData();
      }
    }
  },
  computed: {
    totalCount() {
      let total = 0;
      this.recipes.forEach(item => {
        total += item.lumpSum;
      });
      return total.toFixed(2);
    },
    ...mapGetters(["getPatiensInfo", "getuserinfo", "getDrugInfo", "getIsSee"])
  },
  created() {
    this.showDialog = this.show;
    this.dealPriviewData();
  },
  methods: {
    signToRecipt() {
      this.recipes.forEach(item => {
        if (item.pid == this.recipeItem.pid) {
          item.showSign = false;
          // this.recipeItem = item
          this.$set(this.recipeItem, "showSign", false);
        }
      });
      this.$forceUpdate();
      this.$refs.chineseM.showSign = true;
    },
    closePopup() {
      this.showDialog = !this.showDialog;
      // this.priviewData = {}
      this.recipes = []; // 处方数据
      this.recipeItem = {}; // 右侧显示处方
      this.$emit("update:show", this.showDialog);
      this.$emit("cancle", 1);
    },
    // 处理数据
    dealPriviewData() {
      // 中药处方
      if (this.priviewData.tcmPrescriptionFormVos.length > 0) {
        this.priviewData.tcmPrescriptionFormVos.forEach((item, index) => {
          item.showSign = true;
          item.recipeType = 1;
          this.recipes.push(item);

          if (index == 0) {
            this.getSvaeMed(item);
          }
        });
      }
      // 中药制剂
      if (this.priviewData.zhongyaozhijiFormVo) {
        if (this.priviewData.zhongyaozhijiFormVo.pid) {
          this.priviewData.zhongyaozhijiFormVo.recipeType = 2;
          this.recipes.push(this.priviewData.zhongyaozhijiFormVo);
        }
      }

      // 适宜技术处方
      if (this.priviewData.shiyijishuFormVo) {
        if (this.priviewData.shiyijishuFormVo.pid) {
          this.priviewData.shiyijishuFormVo.recipeType = 3;
          this.recipes.push(this.priviewData.shiyijishuFormVo);
        }
      }

      this.recipeItem = this.recipes[0];
    },
    // 删除处方
    deleteItem(index) {
      this.$confirm("此操作将删除当前处方, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          if (index == 0 && this.recipes.length == 1) {
            this.deleteRawData(this.recipes[index].recipeType, index);
            this.recipes.splice(index, 1);
            this.closePopup();
            return;
          }
          if (this.recipes[index].pid == this.recipeItem.pid) {
            this.deleteRawData(this.recipes[index].recipeType, index);
            this.recipes.splice(index, 1);
            this.recipeItem = this.recipes[0];
          } else {
            this.deleteRawData(this.recipes[index].recipeType, index);
            this.recipes.splice(index, 1);
          }
        })
        .catch(() => {});
    },
    // 左侧切换处方
    leftChange(item) {
      this.recipeItem = item;

      this.$refs.chineseM.showSign = !item.showSign;

      this.getSvaeMed(item);
    },

    // 获取安全合理用药信息
    getSvaeMed(data) {
      let father = this.$parent;
      data.prescriptiondetails.forEach(item1 => {
        if (item1.drugid.indexOf("-") != -1) {
          father.getRationalMed(item1.drugid);
        } else {
          father.getRationalMedForPlat(item1.drugid);
        }
      });

      setTimeout(() => {
        this.rationalMed = this.$parent.rationalMed;
        this.rationalMed1 = this.$parent.rationalMed1;
        this.rationalMed2 = this.$parent.rationalMed2;
        this.rationalMed3 = this.$parent.rationalMed3;
        this.rationalMed4 = this.$parent.rationalMed4;
        this.rationalMed5 = this.$parent.rationalMed5;
        this.rationalMed6 = this.$parent.rationalMed6;
        this.rationalMed7 = this.$parent.rationalMed7;
        this.rationalMed8 = this.$parent.rationalMed8;
        this.rationalMed9 = this.$parent.rationalMed9;
        this.rationalMed10 = this.$parent.rationalMed10;
      }, 200);
    },

    // 同时删除 缓存内保存的 提交数据
    deleteRawData(type, index) {
      let data = JSON.parse(sessionStorage.getItem("priviewRawData"));
      let zhongyao = data.zhongyao;
      let zhongchengyao = data.zhongchengyao;
      let technology = data.technology;
      if (type == 1) {
        zhongyao.splice(index, 1);
      }

      if (type == 2) {
        zhongchengyao = {};
      }

      if (type == 3) {
        technology = {};
      }

      sessionStorage.setItem(
        "priviewRawData",
        JSON.stringify({
          zhongchengyao,
          technology,
          zhongyao
        })
      );
    },
    sureToSubmit() {
      let data = JSON.parse(sessionStorage.getItem("priviewRawData"));
      let zhongyao = data.zhongyao;
      let zhongchengyao = data.zhongchengyao;
      let technology = data.technology;
      if (
        this.$route.query.recipeType &&
        this.$route.query.recipeType == "edit"
      ) {
        this.updateRecipe(zhongyao, zhongchengyao, technology);
      } else {
        this.addRecipe(zhongyao, zhongchengyao, technology);
      }
    },
    // 提交处方
    async addRecipe(zhongyao, zhongchengyao, technology) {
      const loading = this.$loading({
        lock: true,
        text: "正在提交",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)"
      });
      let params = {
        recordid: this.getPatiensInfo.pid,
        technology: technology,
        zhongchengyao: zhongchengyao,
        zhongyao: zhongyao
      };

      let res = await addRecipe(params).catch(err => {
        loading.close();
      });
      if (res.ResultCode == 0) {
        this.$message.success("提交成功");
        if (this.$route.query.from && this.$route.query.from == "validation") {
          setTimeout(() => {
            loading.close();
            this.$router.back();
          }, 3000);
        } else {
          setTimeout(() => {
            loading.close();
            this.$router.push({
              path: "/index/recipe"
            });
          }, 3000);
        }
        sessionStorage.setItem("priviewRawData", "");
        sessionStorage.removeItem("prescr" + this.getPatiensInfo.pid);
      } else {
      }
    },
    // 审核不通过 修改处方
    async updateRecipe(zhongyao, zhongchengyao, technology) {
      const loading = this.$loading({
        lock: true,
        text: "正在修改",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)"
      });
      let params = {
        recordid: this.$route.query.recordsId,
        technology: technology,
        zhongchengyao: zhongchengyao,
        zhongyao: zhongyao
      };
      let res = await updateRecipe(params).catch(err => {
        loading.close();
      });
      if (res.ResultCode == 0) {
        this.$message.success("修改成功");
        setTimeout(() => {
          loading.close();
          this.$router.push({
            path: "/index/recipe"
          });
        }, 3000);

        sessionStorage.setItem("priviewRawData", "");
      } else {
      }
    }
  }
};
</script>

<style scoped lang="scss">
@import "~@/style/common.scss";

.recipe-priview {
  // height: 400px;
  height: 70vh;

  .right-pad {
    width: 420px;
    // background: red;
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
  }

  .report {
    margin-top: 40px;
    height: 400px;
    overflow: auto;
    background: rgba($color: #d7d7d7, $alpha: 0.3);
    padding: 10px;
    box-sizing: border-box;

    h3 {
      text-align: center;
    }
  }

  .left-table {
    flex: 1;
    // height: 100%;
    overflow: auto;

    margin-right: 10px;

    .table-body {
      border: 1px solid #d7d7d7;
      border-bottom: 0;
    }

    .table-title {
      font-size: 15px;
      font-weight: 600;
      text-align: center;
      padding: 8px;
      color: #fff;
      background: #5386f6;
    }

    .table-tr {
      border-bottom: 1px solid #d7d7d7;
      cursor: default;
      // line-height: 30px;;
      font-size: 14px;
      height: 33px;

      div:nth-child(1) {
        flex: 1;
        border-right: 1px solid #d7d7d7;
      }

      div:nth-child(2) {
        flex: 1;
        border-right: 1px solid #d7d7d7;
        color: red;
      }

      div:nth-child(3) {
        width: 30px;
        display: flex;
        align-items: center;
        justify-content: center;

        img {
          width: 60%;
        }
      }
    }

    .table-tr:last-child {
      div:nth-child(1) {
        font-weight: 600;
      }
    }

    .table-tr-active {
      background: #d7d7d7;
    }
  }
}

.btns {
  margin-top: 10px;
}

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

  .p {
    margin-bottom: 5px;
    cursor: default;

    .patiens-name {
      color: #5386f6;
      font-weight: bold;
      font-size: 16px;
    }

    .patiens-desc {
      display: inline-block;

      .matname {
        color: #5386f6;
      }
    }

    .patiens-cate {
      font-weight: bold;
    }
  }
}
</style>