zy-wechat/pages/scanning_blood_process/scanning_blood_process.vue

<template>
  <view class="Scanning_Result">
    <view class="Scanning_top" v-if="status == 200">
      <view class="Scanning_top_icon">
        <view>
          <view class="red fweight speNum"> {{ speNum }} </view>
        </view>
      </view>
      <view class="Scanning_top_text">
        <view class="text1"> 操作成功 </view>
      </view>
    </view>

    <view class="Scanning_top" v-if="status != 200">
      <view class="Scanning_top_icon">
        <text class="cubeic-close icon_transport transport-shibai"></text>
      </view>
      <view class="Scanning_top_text">
        <view class="text1"> 操作失败 </view>
        <view class="text1 f30" v-if="queryObj.qrcode"> 扫描内容：{{queryObj.qrcode}} </view>
      </view>
    </view>

    <view class="Scanning_cont" v-if="status == 200">
      <view>{{bloodDTO.type ? bloodDTO.type.name : "无"}}<text v-if="bloodDTO.type">({{bloodDTO.bloodCode||'无'}}) {{ bloodDTO.volume?bloodDTO.volume+'ML':'无' }}</text></view>
      <view>采血日期：<text v-if="bloodDTO.printDate">{{bloodDTO.printDate | formatDate('yyyy-MM-dd hh:mm')}}</text><text v-else>无</text></view>
      <view>有效期至：<text v-if="bloodDTO.overDate">{{bloodDTO.overDate | formatDate('yyyy-MM-dd hh:mm')}}</text><text v-else>无</text></view>
      <view>
        血型：{{ bloodDTO.aboType||'无' }}
        &emsp;&emsp;
        RH(D)：<text>{{bloodDTO.rhType || '无'}}</text>
      </view>
      <view>患者：<text>{{ bloodDTO.patientName }}<text v-if="bloodDTO.hosNum">({{ bloodDTO.hosNum }})</text></text></view>
      <view>申请科室：{{ bloodDTO.applyDeptDTO?bloodDTO.applyDeptDTO.dept:'无' }}</view>
    </view>

    <view class="foot_btn_spe">
      <view class="btn1" @click="Scanning_again()"> 继续扫描 </view>
      <view class="btn3" @click="hand_again()">手动录入</view>
      <view class="btn2" style="width: 98%;" @click="countAndCheck()"> 清点核对 </view>
    </view>

    <!-- 手动查询弹窗 -->
    <handViewBlood v-if="speModels.disjunctor" :title="speModels.title" :disjunctor="speModels.disjunctor"
      @ok="speOk" @cancel="speCancel">
    </handViewBlood>
  </view>
</template>
<script>
  import {
    get,
    post,
    SM,
    webHandle
  } from "../../http/http.js";
  export default {
    data() {
      return {
        bloodDTO:{},
        status: 200,
        speNum: 0,
        // 手动查询弹窗model
        speModels: {
          disjunctor: false,
        },
        SMFlag: true,
        queryObj: {}, //路由传递过来的数据
      };
    },
    methods: {
      // 手动查询-确认
      speOk(data) {
        console.log(data);
        if (!data.id) {
          //没有查询到
          uni.showModal({
            title: '提示',
            content: "没有查询到标本！",
            showCancel: false,
            success: function(res) {
              if (res.confirm) {
                console.log('用户点击确定');
              } else if (res.cancel) {
                console.log('用户点击取消');
              }
            }
          });
          return;
        }
        this.speModels.disjunctor = false;
        this.hand_scanning_common(data.bloodCode, 'hand');
      },
      // 手动查询-取消
      speCancel() {
        this.speModels.disjunctor = false;
      },
      // 手动查询弹窗
      showHandViewSpecimen() {
        this.speModels = {
          title: '填写血袋号',
          disjunctor: true,
        }
      },
      // 手动录入
      hand_again() {
        this.showHandViewSpecimen();
      },
      // 手动输入和扫码公共方法
      hand_scanning_common(ress1, type) {
        // ----------------
        uni.showLoading({
          title: "加载中",
          mask: true,
        });
        //检验二维码的有效性
        post("/dept/scanning", {
          content: ress1,
        }).then((result) => {
          this.SMFlag = true;
          if (result.state == 200 || result.state == 201) {
            let codes = result.code;
            if (codes) {
              post("/transflow/scanBind", {type: 'blood',orderId: this.queryObj.orderId, code: ress1}).then((ress) => {
                uni.hideLoading();
                if (ress.state == 200 && ress.data.state != 400) {
                  //扫描标本后会自动调用摄像头，继续扫描，直到status不是200
                  setTimeout(()=>{
                    if (type === 'scan') {
                      this.Scanning_again();
                    }
                  },500)
                  //todo
                  uni.redirectTo({
                    url: `../scanning_blood_process/scanning_blood_process?orderId=${this.queryObj.orderId}&bloodDTO=${encodeURIComponent(JSON.stringify(ress.data.dto))}&scanCount=${ress.data.scanCount}&status=200&scanOrHand=${type}`,
                  });
                } else {
                  uni.redirectTo({
                    url: `../scanning_blood_process/scanning_blood_process?orderId=${this.queryObj.orderId}&status=500&scanOrHand=${type}&qrcode=${ress1}`,
                  });
                }
              });
            } else {
              uni.hideLoading();
            }
          } else {
            uni.hideLoading();
            uni.showToast({
              icon: "none",
              title: "请求失败！",
            });
          }
        });
        // ------------------------------
      },
      // 继续扫描
      Scanning_again() {
        if (!this.SMFlag) {
          return;
        }
        this.SMFlag = false;
        SM().then((ress1) => {
          this.hand_scanning_common(ress1, 'scan');
        }).catch(err => {
          this.SMFlag = true;
        });
      },
      // 清点核对
      countAndCheck() {
        uni.navigateTo({
          url: `../check_blood/check_blood?orderId=${this.queryObj.orderId}`,
        });
      },
    },
    onShow() {
      this.SMFlag = true;
    },
    onLoad(options) {
      console.log(options, "result");
      if (options.status == 200&&options.scanOrHand === 'hand') {
        this.hand_again();
      }
      this.queryObj = options;
      if (options.bloodDTO) {
        this.bloodDTO = JSON.parse(options.bloodDTO);
      }
      this.status = options.status;
      this.speNum = options.scanCount;
      // #ifdef APP-PLUS
      webHandle("no", "app");
      // #endif
      // #ifdef H5
      webHandle("no", "wx");
      // #endif
    },
  };
</script>
<style lang="less">
  .Scanning_Result {
    padding: 0 20rpx;

    .Scanning_top {
      .Scanning_top_icon {
        width: 140rpx;
        height: 140rpx;
        margin: 0 auto;
        border-radius: 50%;
        line-height: 140rpx;
        
        .speNum{
          text-align: center;
          font-size: 140rpx;
        }

        .cubeic-ok {
          font-size: 140rpx;
          color: #35b34a;
        }

        .cubeic-close {
          font-size: 140rpx;
          color: #ff3b53;
        }
      }

      .Scanning_top_text {
        .text1 {
          font-size: 48rpx;
          text-align: center;
        }

        .success_tips {
          color: red;
          font-size: 30rpx;
        }
      }
    }

    .Scanning_cont {
      font-size: 32rpx;
      text-align: center;

      view {
        margin-bottom: 16rpx;
      }

      .Scanning_cont_center {
        text-align: center;
      }

      .text {
        margin-top: 24rpx;
        color: #35b34a;
      }

      .text1 {
        margin-top: 24rpx;
        color: #ff3b53;
      }
    }

    .foot_btn {
      line-height: 88rpx;
      height: 100rpx;
      margin-top: 40rpx;
      display: flex;
      justify-content: center;

      .btn1,
      .btn2,
      .btn3 {
        height: 88rpx;
        flex: 1;
        margin: 0 1%;
        background-image: linear-gradient(to right, #72c172, #3bb197);
        color: #fff;
        border-radius: 8rpx;
        font-size: 32rpx;
        margin-top: 16rpx;
        text-align: center;
      }
    }
    .foot_btn_spe {
      line-height: 88rpx;
      height: 100rpx;
      margin-top: 40rpx;
      text-align: center;
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
    
      &::after {
        content: '';
        flex: 1;
      }
    
      view {
        height: 88rpx;
        width: 48%;
        margin: 0 1%;
        background-image: linear-gradient(to right, #72c172, #3bb197);
        color: #fff;
        border-radius: 8rpx;
        font-size: 32rpx;
        margin-top: 16rpx;
      }
    }
  }
</style>