zy-wechat/pages/medicalWaste/medicalWasteBindCheck/medicalWasteBindCheck.vue

<template>
  <view class="Scanning_Result">
    <view class="Scanning_top">
      <view class="Scanning_top_icon">
        <text class="cubeic-ok icon_transport transport-duigou"></text>
      </view>
      <view class="Scanning_top_text">
        <text>回收医废科室为“{{queryObj.deptName}}”，总重量为{{weightTotal}}kg，{{countTotal}}袋医废。</text>
        <text>请扫描人员工牌或科室码交接。</text>
      </view>
    </view>

    <view class="Scanning_cont">
      <view class="Scanning_cont_head">
        <view>医废类型</view>
        <view>医废袋数</view>
        <view>医废重量</view>
      </view>
      <scroll-view scroll-y style="flex: 1;min-height: 0;">
        <view class="Scanning_cont_list" v-for="item in infoList" :key="item.id">
          <view>{{item.name}}</view>
          <view>{{item.wasteCount}}袋</view>
          <view>{{item.wasteWeight}}kg</view>
        </view>
      </scroll-view>
    </view>

    <view class="foot_btn">
      <view class="btn" @click="scanDeptOrUser()"> 扫一扫 </view>
    </view>
    <!-- 弹窗 -->
    <showModel :title="models1.title" :icon="models1.icon" :disjunctor="models1.disjunctor" :content="models1.content" @ok="ok1" @cancel="cancel1"  @know="know1" :operate="models1.operate"></showModel>
  </view>
</template>
<script>
  import {
    get,
    post,
    SM,
    webHandle
  } from "../../../http/http.js";
  import Big from 'big.js';
  export default {
    data() {
      return {
        countTotal: 0,
        weightTotal: 0,
        SMFlag: true,
        infoList: [],
        hosId: uni.getStorageSync('userData').user.currentHospital.id,
        queryObj: {}, //路由传递过来的数据
        // 弹窗model
        models1: {
          disjunctor: false,
        },
      };
    },
    onShow() {
      this.SMFlag = true;
    },
    methods: {
      ok1(){
        this.models1.disjunctor = false;
        uni.showLoading({
          title: '加载中',
          mask: true,
        })
        post("/medicalWaste/checkComplete", {
          handoverId: this.handoverId || undefined,
          deptId: +this.queryObj.deptId,
          hosId: this.hosId,
          clinicalWasteTypeIds: this.infoList.map(v => v.id).toString(),
        })
          .then((res) => {
            uni.hideLoading();
            if (res.status == 200) {
              uni.navigateTo({
                url: `/pages/receiptpage/receiptpage`,
              });
            } else {
              uni.showToast({
                icon: "none",
                title: res.msg || "接口获取数据失败！",
              });
            }
          });
      },
      cancel1(){
        this.models1.disjunctor = false;
      },
      // 扫科室或人
      scanDeptOrUser() {
        if (!this.SMFlag) {
          return;
        }
        this.SMFlag = false;
        SM().then((content) => {
          uni.showLoading({
            title: "加载中",
            mask: true,
          });
          //检验二维码的有效性(扫码前必须验证)
          post("/dept/scanning", {
              content,
            })
            .then((result) => {
              this.SMFlag = true;
              // 200检测通过，201没有有效期也通过。
              if (result.state == 200 || result.state == 201) {
                
                let data = {
                  code: result.code, //二维码
                };
                
                post("/medicalWaste/scanByCode", {
                  deptId: +this.queryObj.deptId,
                  code: result.code,
                  hosId: this.hosId,
                })
                  .then((res) => {
                    uni.hideLoading();
                    if (res.status == 200 && res.data) {
                      this.showModel1(res.data, res.type);
                    } else {
                      uni.showToast({
                        icon: "none",
                        title: res.msg || "接口获取数据失败！",
                      });
                    }
                  });
              } else {
                uni.hideLoading();
                uni.showToast({
                  icon: "none",
                  title: result.info || "接口获取数据失败！",
                });
              }
            })
        }).catch(err => {
          this.SMFlag = true;
        });
      },
      getInfo(){
        uni.showLoading({
          title: "加载中",
          mask: true,
        });
        post("/medicalWaste/checkComplete", {
            deptId: +this.queryObj.deptId,
            hosId: this.hosId
          }).then((result) => {
          uni.hideLoading();
          if (result.status == 200) {
            this.infoList = result.data || [];
            this.countTotal = this.infoList.reduce((pre, cur) => pre + cur.wasteCount, 0);
            this.weightTotal = this.infoList.reduce((pre, cur) => Big(pre).plus(cur.wasteWeight), 0);
          } else {
            uni.showToast({
              icon: "none",
              title: result.msg || "接口获取数据失败！",
            });
          }
        });
      },
      //知道了
      know1() {
        this.models1.disjunctor = false;
      },
      // 被服送回弹窗
      showModel1(data, type) {
        let content = '';
        if(type === 'dept'){
          this.handoverId = undefined;
          content = `您与<strong class="red">${data.dept}</strong>成功交接，总重量为<strong class="red">${this.weightTotal}kg</strong>，<strong class="red">${this.countTotal}袋</strong>医废`;
        }else if(type === 'user'){
          this.handoverId = data.id;
          content = `您与<strong class="red">${data.name}</strong>，<strong class="red">${data.dept?data.dept.dept:''}</strong>成功交接，总重量为<strong class="red">${this.weightTotal}kg</strong>，<strong class="red">${this.countTotal}袋</strong>医废`;
        }
        
        this.models1 = {
          disjunctor: true,
          title: "提示",
          content,
          icon: "warn",
          operate: {
            ok: "确定",
            cancel: "取消",
          },
        };
      },
    },
    onLoad(options) {
      console.log(options, "result");
      this.queryObj = options;
      this.getInfo();
      // #ifdef APP-PLUS
      webHandle("no", "app");
      // #endif
      // #ifdef H5
      webHandle("no", "wx");
      // #endif
    },
  };
</script>
<style lang="less" scoped>
  .Scanning_Result {
    height: 100vh;
    display: flex;
    flex-direction: column;
    background-color: #fff;
    .yf /deep/ .uni-input-input[disabled]{
      text-overflow: ellipsis;
    }
    .Scanning_top {
      flex-shrink: 0;
      .Scanning_top_icon {
        padding-top: 26rpx;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;

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

        .text1 {
          font-size: 40rpx;
          font-weight: bold;
        }
      }
      .Scanning_top_text{
        font-size: 34rpx;
        font-weight: bold;
        padding: 26rpx 32rpx 38rpx 32rpx;
        display: flex;
        flex-direction: column;
        line-height: 1.5;
        text{
          word-break: break-all;
        }
      }
    }

    .Scanning_cont {
      flex: 1;
      min-height: 0;
      display: flex;
      flex-direction: column;
      width: 710rpx;
      margin: 0 20rpx;
      padding: 6rpx;
      font-size: 28rpx;
      line-height: 1;
      .Scanning_cont_head{
        font-weight: bold;
        height: 92rpx;
        background: #FBFCFE;
        box-shadow: 0rpx 3rpx 6rpx 1rpx rgba(0,0,0,0.16);
        display: flex;
        align-items: center;
        font-size: 32rpx;
        view{
          flex: 1;
          flex-shrink: 0;
          text-align: center;
          text-overflow: ellipsis;
          overflow: hidden;
          white-space: nowrap;
        }
      }
      .Scanning_cont_list{
        font-weight: bold;
        padding: 27rpx 0;
        border-bottom: 1rpx solid #D9D9D9;
        display: flex;
        align-items: center;
        font-size: 32rpx;
        view{
          flex: 1;
          flex-shrink: 0;
          text-align: center;
          text-overflow: ellipsis;
          overflow: hidden;
          white-space: nowrap;
          line-height: normal;
        }
      }
    }

    .foot_btn {
      margin: 57rpx 30rpx 10rpx;
      flex-shrink: 0;
      display: flex;
      justify-content: center;

      .btn {
        height: 88rpx;
        line-height: 1;
        display: flex;
        justify-content: center;
        align-items: center;
        flex: 1;
        margin-right: 32rpx;
        background-image: linear-gradient(to right, #72c172, #3bb197);
        color: #fff;
        border-radius: 8rpx;
        font-size: 34rpx;
        font-weight: bold;
        &:last-of-type{
          margin-right: 0;
        }
      }
    }
  }
</style>