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 * as commonFun from '../../tools/commonFun.js';
  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: {
      // 其他临床服务-运输过程-终点科室是否开通备注填写
      isOpenTransportationProcessRemarks(data, accountObj, funName){
        const tasktype = data.taskType;
        console.log(tasktype, data);
        if(tasktype.associationType.value === 'other' && tasktype.carryingCourses[1].logSwitch && data.gdState.value == 5){
          uni.navigateTo({
            url: `../../pages/transportationProcessRemarks/transportationProcessRemarks?data=${data ? encodeURIComponent(JSON.stringify(data)) : ''}&accountObj=${accountObj ? encodeURIComponent(JSON.stringify(accountObj)) : ''}&currentCode=${this.currentCode}&funName=${funName}&actions=${this.actions ? encodeURIComponent(JSON.stringify(this.actions)) : ''}&imageValue=${this.imageValue ? encodeURIComponent(JSON.stringify(this.imageValue)) : ''}`
          })
        }else{
          commonFun[funName](this, data, accountObj);
        }
      },
      // 填写交接人账号-确认
      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.isOpenTransportationProcessRemarks(this.currentData, data, 'uploadToOther');
        }else if(this.actionConfirmSwitch){
          // 动作
          this.isOpenTransportationProcessRemarks(this.currentData, data, 'nextDeptOrder_ss');
        }else if(this.actionPhotoSwitch){
          // 拍照
          this.isOpenTransportationProcessRemarks(this.currentData, data, 'uploadToOther');
        }
      },
      // 填写交接人账号-取消
      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.isOpenTransportationProcessRemarks(data, accountObj, 'uploadToOther');
            }else if(this.actionConfirmSwitch){
              // 动作
              this.isOpenTransportationProcessRemarks(data, accountObj, 'nextDeptOrder_ss');
            }else if(this.actionPhotoSwitch){
              // 拍照
              this.isOpenTransportationProcessRemarks(data, accountObj, 'uploadToOther');
            }
          } else if (result.state == '0000') {
            uni.hideLoading();
            this.showSelectAccount();
          } else {
            uni.hideLoading();
            uni.showToast({
              icon: "none",
              title: "请求失败！",
            });
          }
        });
      },
      // 返回
      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>