lanju-app/src/pages/raw/handover/RUS-aggregating/summary.vue

<template>
  <view class="page-aggregating-order">
    <view class="header">
      <view class="left">
        <u-icon class="icon" name="arrow-left" @click="uni.navigateBack({})" />
      </view>
      <view class="title">{{ $t('message.Summary_SummaryAndHandover') }}</view>
      <view class="right"></view>
    </view>
    <view class="table-wrapper">
      <wyb-table class="table" ref="table" width="100%" show-left-and-right-border enable-check="multiple" :headers="headers" @onCheck="clickIndex" :contents="model.aggregateList" :show-vert-border="false"></wyb-table>
    </view>
    <view class="bottom-bar">
      <view class="extra">
        <!-- <u-form ref="amountForm" :model="amountForm" :error-type="['toast']">
          <u-row class="bottom-info">
            <u-col :span="12">
              <u-form-item prop="amount" :label="$t('message.Summary_Number')" label-width="120rpx">
                <u-input type="number" v-model="amountForm.amount" :placeholder="$t('message.po_PleaseInput')" />
              </u-form-item>
            </u-col>
          </u-row>
        </u-form> -->
        <u-form ref="submitForm" :model="submitForm" :error-type="['toast']">
          <u-row class="bottom-info">
            <u-col :span="12">
              <u-form-item prop="receiverName" :label="$t('message.Summary_Receiver')" label-width="120rpx">
                <u-input v-model="submitForm.receiverName" :border="border" @confirm="onReceiverConfirm" :placeholder="$t('message.po_PleaseInput')" />
              </u-form-item>
            </u-col>
            <!-- <u-col :span="6">
              <u-form-item prop="password" :label="$t('message.Summary_Password')">
                <u-input type="password" v-model="submitForm.password" :border="border" :placeholder="$t('message.po_PleaseInput')" />
              </u-form-item>
            </u-col> -->
          </u-row>
        </u-form>
      </view>
      <view class="container">
        <u-row>
          <u-col :span="6">
            <u-button type="warning" @click="onSelectAll">
              {{ $t('message.po_SelectAll') }}
            </u-button>
          </u-col>
          <!-- <u-col :span="4">
            <u-button type="primary" @click="onOk">
              {{ $t('message.dn_Confirm') }}
            </u-button>
          </u-col> -->
          <u-col :span="6">
            <u-button type="success" @click="onSubmit">
              {{ $t('message.po_Submit') }}
            </u-button>
          </u-col>
        </u-row>
      </view>
    </view>
  </view>
</template>

<script lang="ts">
import { Component, Ref } from 'vue-property-decorator';
import { BasePage } from '@/components/base/page';
import model from './model';
import { summaryHeaders } from './config';
import { VForm, VFormRules } from 'vue/types/form';
import { auth } from '@/store/modules/auth';
import { pick } from 'lodash/fp';
import http from '@/utils/request';
import { url } from '@/utils/url';
import { session } from '@/store/modules/session';

@Component
export default class AggregatingSummary extends BasePage {
  /**
   * 表单引用
   */
  @Ref('amountForm') readonly $amountForm!: VForm;
  @Ref('submitForm') readonly $submitForm!: VForm;

  /**
   * 页面Module
   */
  model = model;
  border = true;
  /**
   * 表头
   */
  headers = summaryHeaders;
  spliceItem: any;

  /**
   * 交接完成
   */
  isBusinessFinished = true;

  /**
   * 更改数量表单
   */
  amountForm = {
    amount: '',
  };

  /**
   * 上传表单
   */
  submitForm = {
    receiver: '',
    receiverName: '',
    password: '',
  };

  amountFormRules: VFormRules<any> = {
    amount: [
      {
        required: true,
        message: this.$t('message.Summary_PleaseInputNumber') as string,
      },
    ],
  };

  submitFormRules: VFormRules<any> = {
    receiver: [
      {
        required: true,
        message: this.$t('message.Summary_PleaseInputReceiver') as string,
      },
    ],
    password: [
      {
        required: true,
        message: this.$t('message.Summary_PleaseInputPassword') as string,
      },
    ],
  };

  // 必须要在onReady生命周期，因为onLoad生命周期组件可能尚未创建完毕
  onShow() {
    this.model = model;
    /**this.$amountForm.setRules(this.amountFormRules);**/
    this.$submitForm.setRules(this.submitFormRules);
    this.isBusinessFinished = false;
  }
  clickIndex(e: any) {
    console.log('ccccc', e);
    //this.spliceItem = e.data[0].lineData.materialCode;
    //修改本次交接数量
    // model.setAggregateListItemHvAmount({
    //   index: this.model.aggregateList.findIndex((_) => _.checked),
    //   hvAmount: 0,
    // });
    e.data.forEach((item, index) => {
      //debugger;
      console.log('xuanzedeindex', e.data);
      console.log('hvmount', item.lineData.totalMoAmount - item.lineData.totalHvAmount);
      this.model.setAggregateListItemHvAmount({
        index: e.data[index].index,
        hvAmount: item.lineData.totalMoAmount - item.lineData.totalHvAmount,
      });
    });
    this.model.aggregateList.forEach((item) => {
      if (item.checked == false) {
        item.hvAmount = 0;
      }
    });
    console.log('/////////', this.model.aggregateList);
  }
  beforeDestroy() {
    if (model.aggregateList.length > 0 && !this.isBusinessFinished) {
      this.unlock();
    }
  }
  onHide() {
    if (model.aggregateList.length > 0 && !this.isBusinessFinished) {
      this.unlock();
    }
  }
  /**
   * 全选
   */
  onSelectAll() {
    console.log('this.nodel.aggregateList111', this.model.aggregateList);
    this.model.checkAllAggregateList(!this.model.isAggregateCheckedAll);
  }

  /**
   * 接收人确认
   */
  async onReceiverConfirm() {
    const userInfo = await auth.getUserInfo({
      loginName: this.submitForm.receiverName,
    });
    this.submitForm.receiver = this.submitForm.receiverName;
    this.submitForm.receiverName = userInfo.userName;
  }

  /**
   * 确认
   */
  // onOk() {
  //   this.$amountForm.validate((valid) => {
  //     if (!valid) return;
  //     const firstSelection = this.model.aggregateList.find((_) => _.checked);
  //     if (firstSelection === undefined) {
  //       this.customToast(this.$t('message.Pi_tip7') as string);
  //     } else {
  //       // 本次交接数量
  //       const currentPickNum = parseFloat(this.amountForm.amount);
  //       // 已交接数量
  //       const totalHvAmount = parseFloat(firstSelection.totalHvAmount);
  //       // 拣配数量
  //       const totalMoAmount = parseFloat(firstSelection.totalMoAmount);
  //       //点击确定时有校验输入的交接数量必须=累计拣配数量？？？
  //       // if (currentPickNum != totalMoAmount) {
  //       //   this.customToast(this.$t('message.Pi_tip12') as string);
  //       //   return;
  //       // }
  //       //修改表格信息的
  //       model.setAggregateListItemHvAmount({
  //         index: this.model.aggregateList.findIndex((_) => _.checked),
  //         //hvAmount: currentPickNum,
  //         hvAmount: totalMoAmount - totalHvAmount,
  //       });
  //     }
  //   });
  // }

  /**
   * 上传
   */
  onSubmit() {
    this.$submitForm.validate(async (valid) => {
      if (valid) {
        if (this.model.aggregateList.length === 0) {
          this.customToast(this.$t('message.Pi_tip4') as string);
        } else {
          if ((this.submitForm.receiver ? this.submitForm.receiver : this.submitForm.receiverName) == session.loginName) {
            this.customToast(this.$t('message.different') as string);
            return;
          }
          // await auth.checkPassword({
          //   rfPwd: this.submitForm.password,
          //   factoryCode: session.factoryCode as string,
          //   loginName: this.submitForm.receiverName,
          // });
          let submit = false;
          let selectsta = true;
          this.model.aggregateList.forEach((item) => {
            if (!item.checked) {
              return;
            } else if (item.hvAmount == null || item.hvAmount == 0) {
              submit = true;
            }
            if (item.checked) {
              selectsta = false;
            }
          });
          if (selectsta) {
            this.customToast(this.$t('message.Pi_tip4') as string);
            return;
          }
          if (submit) {
            this.customToast(this.$t('message.Summary_PleaseInputNumber') as string);
            return;
          }
          let List: any = [];
          let isTrue = true;
          this.model.aggregateList.forEach((item: any) => {
            if (item.checked) {
              List.push(item);
            }
          });
          if (List.length == 0) {
            this.customToast(this.$t('message.Pi_tip13') as string);
            return;
          }
          //此处校验了请确保交接数量等于需求数量
          //totalMoAmount：累计拣配数量  totalHvAmount：交接数量  hvAmount：本次交接数量
          List.forEach((item: any) => {
            if (parseFloat(item.totalMoAmount) - parseFloat(item.totalHvAmount) != parseFloat(item.hvAmount)) {
              isTrue = false;
              return;
            }
          });
          if (isTrue != true) {
            this.customToast(this.$t('message.Pi_tip15') as string);
            return;
          }
          await this.model.uploadAggregateList({
            operatorPass: this.submitForm.receiver ? this.submitForm.receiver : this.submitForm.receiverName,
            factoryCode: session.factoryCode as string,
            loginName: session.loginName as string,
            dataList: List.map((item: any) => ({
              ...pick(['materialCode', 'sapFactoryCode', 'materialDesc', 'unit', 'prdMaterialDesc', 'wkposCode', 'mrpCode', 'sendSpot'], item),
              amount: String(item.amount),
              hvAmount: item.hvAmount == null ? '0' : String(item.hvAmount),
              serialNo: item.serialNo == null ? '' : item.serialNo,
              totalMoAmount: String(item.totalMoAmount),
              totalHvAmount: String(item.totalHvAmount),
              prdMaterialDesc: String(item.prdMaterialCode),
            })),
            includeOrderOutIdList: this.model.proOrderResultList.map((item: any) => item.orderOutId),
          });
          setTimeout(() => {
            this.onAggregate();
          }, 2000);
        }
      }
    });
  }
  async onAggregate() {
    /**this.amountForm.amount = '';**/
    this.submitForm.receiver = '';
    this.submitForm.receiverName = '';
    // this.submitForm.password = '';
    this.isBusinessFinished = true;
    // await this.model.queryProOrder(this.model.isFormChange);
    console.log('123456789yayayyayayayya', this.model.SubmitCode);
    if (this.model.SubmitCode == '1') {
      const ServeUrl = JSON.parse(uni.getStorageSync('__GWMS_APP_STATE_DATA__'));
      this.uni.request({
        url: ServeUrl.server.address + url.sumscan.query.ordoutlist,
        method: 'POST',
        data: this.model.param,
        success: (res: any) => {
          if (res.data.code != '0' && res.data.list != null) {
            // this.empty();
            //this.resetForm();
            this.chaxun();
          } else if (res.data.code == '0' && res.data.list == null) {
            // this.customToast(this.$t('message.Pi_NoData') as string);
            // this.toPage(this.page.raw.handover.aggregating.index);
            uni.showToast({
              //icon: 'success',
              //duration: 2000,
              title: this.$t('message.Pi_NoData') as string,
              icon: 'none',
            });
            setTimeout(() => {
              this.toPage(this.page.raw.handover.RUSaggregating.index);
            }, 2000);
            //this.empty();
            //this.form.documentNo = '';
          }
        },
      });
    }
    // model.aggregateList.forEach((item: any, index: any) => {
    //   if (item.materialCode == this.spliceItem) {
    //     model.aggregateList.splice(index, 1);
    //   }
    // });
    // model.proOrderResultList.forEach((item: any, index: any) => {
    //   if (item.materialCode == this.spliceItem) {
    //     model.proOrderResultList.splice(index, 1);
    //   }
    // });
    /**this.$amountForm.setRules(this.amountFormRules);**/
    this.$submitForm.setRules(this.submitFormRules);
  }
  //查询
  async chaxun() {
    await this.model.queryProOrderResult(this.model.param);
    await this.model.queryAggregateList(this.model.orderOutIdListParams);
  }
  /**
   * 解锁
   */
  async unlock() {
    const orderOutIdList = model.proOrderResultList.map((_: any) => _.orderOutId);
    try {
      await http.post(url.sumscan.unlock.list, {
        factoryCode: session.factoryCode,
        loginName: session.loginName,
        orderOutIdList,
      });
    } catch (e) {
      this.customToast((this.$t('message.Summary_Tip') as string) + e.message);
    }
  }
}
</script>

<style lang="scss" scoped>
.page-aggregating-order {
  background: #f2f2f2 linear-gradient(0deg, #f2f2f2 0%, #4a78ea 51%, #1753ea 100%) no-repeat;
  background-size: 100% 600rpx;
  padding: 30rpx;
  min-height: 100%;
  padding-top: 118rpx;
  padding-bottom: 280rpx;

  .header {
    position: fixed;
    top: 36rpx;
    left: 0;
    right: 0;
    display: flex;
    height: 88rpx;
    line-height: 88rpx;
    color: #fff;
    font-size: 34rpx;
    font-weight: 500;
    text-align: center;

    .title {
      flex: 3;
    }

    .left,
    .right {
      flex: 1;
    }

    .icon {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 88rpx;
      height: 88rpx;
    }
  }

  .table-wrapper {
    background-color: #fff;
  }

  .form {
    background-color: #fff;
    padding: 40rpx;
    border-radius: 10rpx;
  }

  .bottom-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 30;

    .container {
      background: #ffffff;
      box-shadow: 0 1rpx 20rpx 0 rgba(128, 128, 128, 0.2);
      padding: 20rpx;
    }

    .extra {
      background-color: #fff;
      margin: 5px;
      border-radius: 5px;
      padding: 0 10px;
    }

    .bottom-info {
      .u-form-item {
        padding: 0;
      }
    }
  }
}
</style>