zy-wechat/pages/otherCompleteOrder/otherCompleteOrder.vue

<template>
  <view class="HomeItem">
    <view class="goWorkAll">
      <view class="goWorkSelect combination" v-if="actionConfirmSwitch">
        <view class="goWorkSelect-head">您需要完成以下动作，才可完成工单。如完成请勾选对应项！</view>
        <view class="goWorkSelect-list scroll">
          <checkbox-group @change="checkboxChange">
            <label class="goWorkSelect-item relative" v-for="action in actions" :key="action.value">
              <view>
                <checkbox :value="action.value" :checked="action.checked" />
              </view>
              <view>{{action.name}}</view>
            </label>
          </checkbox-group>
        </view>
      </view>
      <view class="goWorkSelect history" v-if="actionPhotoSwitch">
        <view class="goWorkSelect-head">您需要拍摄现场照片才可完成工单！</view>
        <view class="goWorkSelect-list">
          <uni-file-picker :auto-upload="false" :limit="3" title="最多选择3张图片" v-model="imageValue" fileMediatype="image"
            mode="grid" @select="selectFile" @delete="deleteFile"></uni-file-picker>
        </view>
      </view>
    </view>
    <view class="foot_btn_spe">
      <view class="btn1" @click="photographToOther(order, 'end')">完成工单</view>
      <view class="btn3" @click="goBack">返回</view>
    </view>
    <!-- 填写交接人账号弹窗 -->
    <selectAccount v-if="hosModels.disjunctor" :title="hosModels.title" :disjunctor="hosModels.disjunctor" @ok="hosOk"
      @cancel="hosCancel">
    </selectAccount>
  </view>
</template>

<script>
  import {
    pathUrl
  } from "../../tools/photograph.js";
  import selectAccount from "../../components/selectAccount/selectAccount.vue";
  import {
    get,
    post,
    webHandle
  } from "../../http/http.js";
  export default {
    components: {
      selectAccount,
    },
    data() {
      return {
        // 填写交接人账号弹窗model
        hosModels: {
          disjunctor: false,
        },
        currentCode: '', //当前拍照使用的科室二维码
        currentData: {}, //当前小扫描的工单对象
        orderId: undefined,
        order: {},
        // 拍照动作开关
        actionPhotoSwitch: false,
        // 确认动作开关
        actionConfirmSwitch: false,
        // 参数
        options: {},
        //动作列表
        actions: [],
        //图片列表
        imageValue: [],
      };
    },
    methods: {
      // 完成工单
      postWorkerOrder(data, accountObj){
        let isKs = 0;
        let ids = [];
        let id = data.id;
        ids.push(id);
        let list = {
          code: "",
          ids: ids,
        };
        let code = "";
        let type = "";
        let gdStateValue = data.gdState.value; //工单状态value
        let associationTypeValue = data.taskType.associationType.value; //关联类型value
        
        // 其他临床服务，并且工单状态是待到达||工单状态待送达
        if (
          (associationTypeValue == "other" &&
            gdStateValue == "4") ||
          gdStateValue == "5"
        ) {
          code = this.currentCode;
          type = "orderSign/" + code;
          list = {
            ids
          };
          if (accountObj) {
            list.handover = [accountObj.accountId];
          }
          isKs = 1;
        }
        post("/workerOrder/" + type, list).then((res) => {
          console.log(res);
          uni.hideLoading();
          if (res) {
            if (res.status == 200) {
              if (
                gdStateValue == "4" &&
                associationTypeValue == "other"
              ) {
                uni.navigateTo({
                  url: `../../pages/scanning_code/scanning_code?type=${associationTypeValue}&type1=${res.type}&id=${data.id}&deptCode=${code}&dept=${res.dept}&accountObj=${encodeURIComponent(JSON.stringify(accountObj))}`,
                });
              }
              if (gdStateValue == "5") {
                uni.navigateTo({
                  url: `../../pages/scanning_code/scanning_code?type=${associationTypeValue}&type1=${res.type}&id=${data.id}&deptCode=${code}&dept=${res.dept}&accountObj=${encodeURIComponent(JSON.stringify(accountObj))}`,
                });
              }
            } else {
              uni.navigateTo({
                url: `../../pages/scanning_Result/scanning_Result?type=${
                associationTypeValue
              }&type1=${res.type}&id=${data.id}&status=600&msg=${
                res.msg
              }&isKs=${isKs}&model=${encodeURIComponent(
                JSON.stringify(res)
              )}&qrcode=${this.currentCode}`,
              });
            }
          } else {
            uni.navigateTo({
              url: `../../pages/scanning_Result/scanning_Result?id=${data.id}&status=600&msg=扫码失败！请扫描正确的二维码！&isKs=${isKs}&qrcode=${this.currentCode}`,
            });
          }
        });
      },
      // 如果不是静配，药配，标本配送,标本轮巡
      // 科室签到（小扫描）-拍照
      nextDeptOrder_ss(data, accountObj) {
        console.log(this.currentCode);
        if (this.currentCode) {
          // 动作
          let actions = this.actions.filter(v => v.checked);
          let actionRemarks = actions.map(v => v.name).toString();
          uni.showLoading({
            title: "加载中",
            mask: true,
          });
          if(actionRemarks){
            post("/workerOrder/addOtherRemarks", {
              orderId: data.id,
              actionRemarks: actionRemarks,
            }).then((result1) => {
              if(result1.state == 200){
                this.postWorkerOrder(data, accountObj);
              }else{
                uni.hideLoading();
                uni.showToast({
                  icon: "none",
                  title: "请求失败！",
                });
              }
            });
          }else{
            this.postWorkerOrder(data, accountObj);
          }
        }else{
          uni.hideLoading();
        }
      },
      
      // 填写交接人账号-确认
      hosOk(data) {
        console.log(data);
        const {
          accountName,
          account,
          accountId
        } = data;
        if (!accountName && !account) {
          //没有填写交接人
          uni.showModal({
            title: '提示',
            content: "请填写交接人账号！",
            showCancel: false,
            success: function(res) {
              if (res.confirm) {
                console.log('用户点击确定');
              } else if (res.cancel) {
                console.log('用户点击取消');
              }
            }
          });
          return;
        } else if (!accountName && account || accountName && !account) {
          //没有填写交接人
          uni.showModal({
            title: '提示',
            content: "请填写正确的交接人账号！",
            showCancel: false,
            success: function(res) {
              if (res.confirm) {
                console.log('用户点击确定');
              } else if (res.cancel) {
                console.log('用户点击取消');
              }
            }
          });
          return;
        }
        this.hosModels.disjunctor = false;
        let associationTypeValue = this.currentData.taskType.associationType.value;
        console.log(associationTypeValue)
        if(this.actionPhotoSwitch && this.actionConfirmSwitch){
          this.uploadToOther(this.currentData, data, 'end');
        }else if(this.actionConfirmSwitch){
          // 动作
          this.nextDeptOrder_ss(this.currentData, data, 'end');
        }else if(this.actionPhotoSwitch){
          // 拍照
          this.uploadToOther(this.currentData, data, 'end');
        }
      },
      // 填写交接人账号-取消
      hosCancel() {
        this.hosModels.disjunctor = false;
      },
      // 填写交接人账号弹窗
      showSelectAccount() {
        this.hosModels = {
          title: '填写交接人账号',
          disjunctor: true,
        }
      },
      // 拍照-其他
      photographToOther(data, type) {
        this.currentData = data;
        let actions = this.actions.filter(v => v.checked);
        let imageValue = this.imageValue;
        console.log(actions);
        console.log(imageValue);
        if(this.actionConfirmSwitch && this.actions.length !== actions.length){
          uni.showToast({
            icon: "none",
          	title: '您需要完成以下动作，才可完成功工单！',
          	duration: 2000
          });
          return;
        }
        if(this.actionPhotoSwitch && !imageValue.length){
          uni.showToast({
            icon: "none",
          	title: '您需要完成拍照，才可完成功工单！',
          	duration: 2000
          });
          return;
        }
        uni.showLoading({
          title: "加载中",
          mask: true,
        });
        // 其他临床服务
        //检验二维码的有效性
        post("/dept/scanning", {
          content: type === 'start' ? data.startDept.qrcode : data.endDepts[0].qrcode,
          taskTypeId: data.taskType.id,
          gdState: data.gdState.id,
        }).then((result) => {
          this.currentCode = result.code;
          if (result.state == 200 || result.state == 201) {
            let accountObj = undefined;
            if (result.account) {
              accountObj = {
                account: result.account,
                accountName: result.name,
                accountId: result.id,
              };
            } else {
              accountObj = undefined;
            }
            
            if(this.actionPhotoSwitch && this.actionConfirmSwitch){
              this.uploadToOther(data, accountObj, type);
            }else if(this.actionConfirmSwitch){
              // 动作
              this.nextDeptOrder_ss(data, accountObj, type);
            }else if(this.actionPhotoSwitch){
              // 拍照
              this.uploadToOther(data, accountObj, type);
            }
          } else if (result.state == '0000') {
            uni.hideLoading();
            this.showSelectAccount();
          } else {
            uni.hideLoading();
            uni.showToast({
              icon: "none",
              title: "请求失败！",
            });
          }
        });
      },
      // 完成工单
      uploadToOther(data, accountObj, type){
        let imageValue = this.imageValue;
        // 完成工单
        post('/workerOrder/findRecordInfoByOrderId', {
          orderId: this.orderId,
          gdOperate: 22,
        }).then(result => {
          if (result.state == 200) {
            uni.showLoading({
              mask: true,
              title: '加载中'
            });
            let n = 0;
            //#ifdef H5
            imageValue.forEach((v) => {
              // 图片上传 start
              console.log("压缩前");
              let canvasWidth = v.image.width; //图片原始长宽
              let canvasHeight = v.image.height;
              let img = new Image();
              img.src = v.path;
              let canvas = document.createElement("canvas");
              let ctx = canvas.getContext("2d");
              canvas.width = canvasWidth;
              canvas.height = canvasHeight;
              ctx.drawImage(img, 0, 0, canvasWidth, canvasHeight);
              canvas.toBlob(
                (fileSrc) => {
                  let tp = window.URL.createObjectURL(fileSrc);
                  console.log("压缩后");
                  n++;
                  uni.uploadFile({
                    url: pathUrl +
                      "/common/common/uploadAttachment/orderEndPhoto/" +
                      this.orderId +
                      "/" + result.recordId,
                    filePath: tp,
                    name: "file",
                    formData: {
                      filename: v.name,
                    },
                    success: (uploadFileRes) => {
                      console.log(uploadFileRes);
                      if (--n === 0) {
                        this.nextDeptOrder_ss(data, accountObj, type);
                      }
                    },
                    fail: (err) => {
                      n--;
                      console.error(err);
                      uni.showToast({
                        icon: "none",
                        title: "上传失败",
                        duration: 2000,
                      });
                    },
                  });
                },
                "image/jpeg",
                0.1
              );
              // 图片上传 end
            });
            //#endif
            //#ifdef APP-PLUS
            imageValue.forEach((v) => {
              // 图片上传 start
              uni.compressImage({
                src: v.path,
                quality: 30,
                success: (res) => {
                  console.log('压缩前', res)
                  let tp = res.tempFilePath;
                  console.log("压缩后");
                  n++;
                  uni.uploadFile({
                    url: pathUrl +
                      "/common/common/uploadAttachment/orderEndPhoto/" +
                      this.orderId +
                      "/" + result.recordId,
                    filePath: tp,
                    name: "file",
                    formData: {
                      filename: v.name,
                    },
                    success: (uploadFileRes) => {
                      console.log(uploadFileRes);
                      if (--n === 0) {
                        this.nextDeptOrder_ss(data, accountObj, type);
                      }
                    },
                    fail: (err) => {
                      n--;
                      console.error(err);
                      uni.showToast({
                        icon: "none",
                        title: "上传失败",
                        duration: 2000,
                      });
                    },
                  });
                },
                fail: function () {
                  uni.hideLoading();
                  uni.showToast({
                    icon: 'none',
                    title: '上传失败',
                    duration: 2000
                  });
                }
              })
              // 图片上传 end
            });
            //#endif
          }else{
            uni.hideLoading();
          }
        })
      },
      // 返回
      goBack() {
        uni.navigateBack();
      },
      // 选择动作
      checkboxChange: function (e) {
        var items = this.actions,
          values = e.detail.value;
        for (var i = 0, lenI = items.length; i < lenI; ++i) {
          const item = items[i]
          if(values.includes(item.value)){
            this.$set(item,'checked',true)
          }else{
            this.$set(item,'checked',false)
          }
        }
      },
      // 获取上传状态
      selectFile(e) {
        console.log('选择文件：', e)
        this.imageValue = this.imageValue.concat(e.tempFiles);
      },
      
      // 移除
      deleteFile(e) {
        console.log('移除：', e);
      },
    },
    onLoad(options) {
      console.log(options);
      this.options = options;
      if(options.order){
        options.order = JSON.parse(options.order);
        this.order = options.order;
      }
      if(options.orderId){
        this.orderId = options.orderId;
      }
      if(options.taskType){
        options.taskType = JSON.parse(options.taskType);
        this.actionConfirmSwitch = options.taskType.carryingCourses[1].actionConfirmSwitch;
        let actions = options.taskType.carryingCourses[1].actionRemarks || "";
        this.actions = actions.split('$').map((v, i) => ({
          value: i,
          name: v,
        }));
        
        this.actionPhotoSwitch = options.taskType.carryingCourses[1].actionPhotoSwitch;
      }
    },
  };
</script>

<style lang="less" scoped>
  .HomeItem {
    .foot_btn_spe {
      width: 100%;
      position: fixed;
      bottom: 30rpx;
      left: 0;
      line-height: 88rpx;
      height: 88rpx;
      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;
      }
    }

    .login {
      height: 420rpx;
      padding: 0 32rpx;
      padding-top: 164rpx;
      position: relative;
      z-index: 999;

      .savePassword {
        margin-top: 32rpx;
      }

      /deep/ uni-checkbox:not([disabled]) .uni-checkbox-input:hover {
        border-color: #42b983 !important;
      }

      .login_input {
        margin-top: 32rpx;
        background-color: #ffffff;
        height: 72rpx;
        box-sizing: border-box;
        padding: 16rpx;
      }

      .title {
        font-size: 36rpx;
        color: #42b983;
        text-align: center;
      }

      .tips {
        font-size: 28rpx;
        color: red;
        margin-top: 16rpx;
      }

      .page_item_btn {
        height: 88rpx;
        background-image: linear-gradient(to right, #72c172, #3bb197);
        border-radius: 8rpx;
        line-height: 88rpx;
        color: #fff;
        font-size: 36rpx;
        font-weight: 700;
        margin-top: 64rpx;
        text-align: center;
      }
    }

    //上班页面
    .goWorkAll {
      height: calc(100vh - 118rpx);
      overflow-y: auto;
      display: flex;
      flex-direction: column;
      justify-content: space-between;

      /deep/ .uni-radio-input-checked {
        background-color: #42b983 !important;
        border-color: #42b983 !important;
      }
      /deep/ .uni-checkbox-input-checked {
        color: #42b983 !important;
      }

      .goWorkSelect {
        &.history {
          height: 356rpx;
          padding-bottom: 16rpx;
        }

        &.combination {
          .goWorkSelect-head {}

          .goWorkSelect-list {}
        }

        .goWorkSelect-head {
          font-size: 28rpx;
          padding: 16rpx 0;
          color: #42b983;
          border-bottom: 2rpx solid #42b983;
          text-align: center;
        }

        .goWorkSelect-list {
          padding: 16rpx;

          .goWorkSelect-item {
            height: 52rpx;
            display: flex;
            align-items: center;
            border-bottom: 2rpx solid #e5e9ed;
            padding: 16rpx;

            &.relative {
              position: relative;

              .picker {
                position: absolute;
                width: 100%;
                padding-left: 64rpx;
              }
            }

            button {
              font-size: 32rpx;
              height: 52rpx;
              line-height: 52rpx;
              margin: 0;
              margin-left: 16rpx;
              color: rgb(7, 134, 60);
              font-weight: 700;
            }
          }
        }
      }
    }

    .goWork {
      margin: 0 auto 48rpx;
      width: 240rpx;
      height: 240rpx;

      .goWork_btn_E {
        width: 100%;
        height: 100%;
        background: #bee1a7;
        border-radius: 30%;

        .goWork_btn_W {
          width: 75%;
          height: 75%;
          background-image: linear-gradient(to right, #72c172, #3bb197);
          border-radius: 30%;
          margin: 0 auto;
          position: relative;
          top: 12.5%;
          line-height: 180rpx;
          color: #fff;
          font-size: 36rpx;
          text-align: center;
        }
      }
    }

    .goWork_text {
      width: 100%;

      view {
        text-align: center;
      }

      .goWork_text-p {
        font-size: 36rpx;
        margin-bottom: 48rpx;
      }
    }

    .botImg {
      height: 600rpx;
      width: 100%;
      position: fixed;
      bottom: 0;

      .img {
        height: 100%;
        background: url("../../static/img/BG.png") no-repeat center center;
        background-size: 100% 100%;
      }
    }
  }
</style>