MTP2.0_WEB/src/views/business/sell/components/storage/index.vue

<template>
  <!-- 出库登记-->
  <a-modal class="commonModal"
           title="出库登记"
           v-model:visible="visible"
           @cancel="cancel"
           centered
           width="890px">
    <template #footer>
      <a-button key="submit"
                class="cancelBtn"
                @click="cancel">取消
      </a-button>
      <a-button key="submit"
                type="primary"
                :loading="loading"
                @click="submit">出库登记
      </a-button>
    </template>
    <a-form class="inlineForm"
            ref="formRef"
            :model="formState"
            :rules="rules">
      <fieldset class="formFieldSet">
        <legend>合同基本信息</legend>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-item label="合同编号">
              <span class="white">{{ formatValue(selectedRow.contractno) }}</span>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item :label="selectedRow.contracttype===1? '采购方': '销售方'">
              <span class="white">{{ formatValue(selectedRow.accountname) }}</span>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="现货品种">
              <span class="white">{{formatValue(selectedRow.deliverygoodsname)}}</span>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="合同签署量">
              <span class="white">{{formatValue(selectedRow.qty)}}</span>
            </a-form-item>
          </a-col>
        </a-row>
      </fieldset>
      <fieldset class="formFieldSet">
        <legend>已登记信息</legend>
        <a-row :gutter="24">
          <a-col :span="12"
                 v-for="(item, i) in DGList"
                 :key="i">
            <a-form-item label="已入库量">
              <span class="white">{{item.wrstandardname}} + {{item.brandname}}</span>
            </a-form-item>
          </a-col>
          <!-- <a-col :span="12">
                      <a-form-item label="已入库量2">
                        <span class="white">品类2+品牌2（66吨）</span>
                      </a-form-item>
                    </a-col>
                    <a-col :span="12">
                      <a-form-item label="已入库量3">
                        <span class="white">品类3+品牌3（1000吨）</span>
                      </a-form-item>
                    </a-col>
                    <a-col :span="12">
                      <a-form-item label="已入库量4">
                        <span class="white">品类4+品牌4（5吨）</span>
                      </a-form-item>
                    </a-col> -->
        </a-row>
      </fieldset>
      <fieldset class="formFieldSet">
        <legend>本次入库信息</legend>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-item label="品类">
              <a-select class="inlineFormSelect"
                        style="width: 200px"
                        placeholder="请选择品类"
                        v-model:value="selectedRow.wrstandardid"
                        readonly>
                <a-select-option v-for="option in gmlist"
                                 :key="option.wrstandardid"
                                 :value="option.wrstandardid">{{option.wrstandardname}}
                </a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="品牌"
                         name="SpotGoodsBrandID">
              <a-select class="inlineFormSelect"
                        style="width: 200px"
                        placeholder="请选择品牌"
                        v-model:value="formState.SpotGoodsBrandID">
                <a-select-option v-for="option in gblist"
                                 :key="option.brandid"
                                 :value="option.brandid">{{option.brandname}}
                </a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="出库仓库"
                         name="WarehouseInfo">
              <a-select class="inlineFormSelect"
                        style="width: 200px"
                        placeholder="请选择入库仓库"
                        v-model:value="formState.WarehouseInfo">
                <a-select-option v-for="option in wareHouseList"
                                 :key="option.autoid"
                                 :value="option.autoid">{{option.warehousename}}
                </a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="出库数量"
                         name="Qty">
              <a-input-number class="dialogInput"
                              style="width: 200px"
                              suffix="单位"
                              placeholder="请输入出库数量"
                              v-model:value="formState.Qty">
              </a-input-number>
            </a-form-item>
          </a-col>
        </a-row>
      </fieldset>
    </a-form>
  </a-modal>
</template>

<script lang="ts">
import { defineComponent, PropType, ref, unref, watchEffect } from 'vue';
import { closeModal } from '@/common/setup/modal/index';
import { Ermcp3SellBuyContract } from '@/services/go/ermcp/purchase/interface';
import { ERMCPAreaInOutStockApplyReq } from '@/services/proto/warehouse/interface';
import { QueryAreaStockApply, QueryWareHouse } from '@/services/go/ermcp/warehouse-info/index';
import * as Long from 'long';
import { formatValue } from '@/common/methods';
import { handleForm } from './setup';
import APP from '@/services';
import { initData } from '@/common/methods';
import { ErmcpWareHouseInfo } from '@/views/information/warehouse-info/list';
import { requestResultLoadingAndInfo } from '@/common/methods/request/resultInfo';
import { message } from 'ant-design-vue';
import { Ermcp3AreaStockApplySum } from '@/services/go/ermcp/warehouse-info/interface';
import { ermcpInOutStockApplyReq } from '@/services/proto/warehouse';

export default defineComponent({
    name: 'sell_pending_storage',
    components: {},
    props: {
        selectedRow: {
            type: Object as PropType<Ermcp3SellBuyContract>,
            default: {},
        },
    },
    setup(props, context) {
        const { visible, cancel } = closeModal('sell_pending_storage');
        const { rules, formState, formRef } = handleForm();
        const loading = ref<boolean>(false);
        const wareHouseList = ref<ErmcpWareHouseInfo[]>([]);
        const gblist = ref<[]>([]);
        const gmlist = ref<[]>([]);
        const DGList = ref<Ermcp3AreaStockApplySum[]>([]);
        watchEffect(() => {
            if (visible.value) {
                QueryAreaStockApply(props.selectedRow.spotcontractid)
                    .then((res) => {
                        DGList.value = res.filter((e) => e.inouttype === 1);
                    })
                    .catch((err) => message.error(err));
            }
        });
        initData(() => {
            const deliverygoods = APP.get('DeliveryGoodsList').find((x: any) => x.deliverygoodsid === props.selectedRow.deliverygoodsid);
            gblist.value = deliverygoods && deliverygoods.gblist;
            gmlist.value = deliverygoods && deliverygoods.gmlist;
            // 查询仓库信息
            QueryWareHouse('1').then((res) => {
                wareHouseList.value = res;
            });
        });

        function submit() {
            console.log(props.selectedRow);
            console.log(wareHouseList);
            const wrapEl = unref(formRef);
            wrapEl.validate().then(() => {
                const params: ERMCPAreaInOutStockApplyReq = {
                    InOutType: 6, //  5:采购入库 6:销售出库 7:生产入库 8:生产出库
                    WRStandardID: props.selectedRow.wrstandardid, //品类ID
                    SpotGoodsBrandID: formState.SpotGoodsBrandID || 0, //现货品牌ID(DGFactoryItem表的ID)
                    DeliveryGoodsID: props.selectedRow.deliverygoodsid, //现货商品ID
                    SpotContractID: Long.fromString(props.selectedRow.spotcontractid), //合同ID
                    WarehouseInfo: formState.WarehouseInfo || 0, // uint64 现货仓库ID
                    Qty: formState.Qty || 0, // double 数量t
                    ApplyRemark: '', // string 申请备注
                };
                requestResultLoadingAndInfo(ermcpInOutStockApplyReq, params, loading, ['出库登记成功', '出库登记失败:']).then(() => {
                    context.emit('refresh');
                    cancel();
                });
            });
        }
        return {
            visible,
            cancel,
            submit,
            loading,
            formatValue,
            rules,
            formState,
            formRef,
            wareHouseList,
            gblist,
            gmlist,
            DGList,
        };
    },
});
</script>

<style lang="less">
</style>;