<template>
<div style="padding: 0 20px">
<h1>{{type == 1 ? $t('调拨出仓') :$t('调拨到仓')}}</h1>
<el-divider content-position="left">
{{$t('订单信息')}}
</el-divider>
<ordeDetailsForm :details="orderDetails"></ordeDetailsForm>
<el-divider content-position="left">
{{$t('货物信息')}}
</el-divider>
<el-table :show-summary="true" :summary-method="totalFn" :data="orderItemVOList">
<el-table-column width="80" type="index" :label="$t('序号')"></el-table-column>
<el-table-column :label="$t('品名')">
<template v-slot="{row}">
<div>{{ row.prodTitleZh }}</div>
<div>{{ row.prodTitleEn }}</div>
</template>
</el-table-column>
<el-table-column :label="$t('填单货物属性')">
<template v-slot="{row}">
<div>{{$t('品牌')}}：
<span v-if="row.brandType === 0">{{$t('无')}}</span>
<span v-if="row.brandType === 1">{{$t('有')}}</span>
<span v-if="row.brandType === 2">{{$t('中性')}}</span>
</div>
<div>{{$t('箱数')}}：{{row.num}}</div>
<div>{{$t('体积')}}：{{ row.volume }}m³</div>
<div>{{$t('重量')}}：{{row.weight}}Kg</div>
</template>
</el-table-column>
<el-table-column :label="$t('入库货物属性')">
<template v-slot="{row}">
<div v-for="(item,index) in row.orderWarehouseInBackItemDoList" :key="index">
<div>{{$t('规格')}}：{{item.boxGauge.split('*').map(item =>`${item}cm`).join('*')}}</div>
<div>
<div>{{$t('品牌')}}：{{(brandList.find(item => item.id == row.brand) || {}).titleZh}}
<span v-if="!row.brand">
{{$t('无')}}
</span></div>
<div>{{$t('箱数')}}：{{item.cartonsNum}}</div>
<div>{{$t('体积')}}：{{item.volume}} CMB</div>
<div>{{$t('重量')}}：{{item.weight}}KG</div>
</div>
</div>
<p v-if="row.orderWarehouseInBackItemDoList.length === 0">
{{$t('暂无货物入库信息')}}
</p>
</template>
</el-table-column>
<el-table-column :label="$t('最后操作时间')">
<template v-slot="{row}">
{{parseTime(row.updateTime)}}
</template>
</el-table-column>
<el-table-column :label="$t('状态')">
<template v-slot="{row}">
{{calculationStatus(row)}}
</template>
</el-table-column>
</el-table>
<el-divider content-position="left" v-if="type == 2">
{{$t('调仓明细')}}
</el-divider>
<el-table :data="warehouseList" v-if="type == 2">
<el-table-column :label="$t('调仓编号')" type="index" ></el-table-column>
<el-table-column :label="$t('调出仓库')" prop="warehouseOutName" ></el-table-column>
<el-table-column :label="$t('调入仓库')" prop="warehouseInName"></el-table-column>
<el-table-column :label="$t('申请人')" prop="creatorName"></el-table-column>
<el-table-column :label="$t('申请时间')">
<template v-slot="{row}">
{{parseTime(row.createTime)}}
</template>
</el-table-column>
<el-table-column :label="$t('状态')">
<template v-slot="{row}">
{{STATUS[row.status]}}
</template>
</el-table-column>
<el-table-column :label="$t('出仓影像')">
<template v-slot="{row}">
<warehouse-video-list :status="2" :item ="row"></warehouse-video-list>
</template>
</el-table-column>
<el-table-column :label="$t('到仓影像')">
<template v-slot="{row}">
<warehouse-video-list :status="3" :item ="row"></warehouse-video-list>
</template>
</el-table-column>
<el-table-column :label="$t('调拨出仓备注')" prop="deliveryRemark">
</el-table-column>
<el-table-column :label="$t('调拨到仓备注')" prop="arrivalRemark">
</el-table-column>
</el-table>
<el-descriptions style="margin-top: 20px" :column="4" border>
<el-descriptions-item :label="$t('集运仓库')">{{ warehouseDetails && warehouseDetails.warehouseOutName ? warehouseDetails.warehouseOutName : '' }}</el-descriptions-item>
<el-descriptions-item :label="$t('储位')">
{{ ($refs.area ? $refs.area.selected : []).join(',') }}
</el-descriptions-item>
<el-descriptions-item v-if="type == 2" :label="$t('选择储位')">
<div @click="areaVisible = true" style="color: #0a84ff;cursor: pointer;">{{$t('选择储位')}}</div>
</el-descriptions-item>
<el-descriptions-item :label="$t('调拨目标仓')">{{ warehouseDetails && warehouseDetails.warehouseInName ? warehouseDetails.warehouseInName : '' }}</el-descriptions-item>
<el-descriptions-item :label="$t('物流公司')">
<el-select :disabled="type == 2" v-model="params.logisticsCompany" >
<el-option v-for="(item,index) in expressList " :key="index" :value="item.id" :label="item.companyZh"></el-option>
</el-select>
</el-descriptions-item>
<el-descriptions-item :label="$t('物流单号')">
<el-input :disabled="type == 2" v-model="params.logisticsNo"></el-input>
</el-descriptions-item>
<el-descriptions-item :label="$t('联系电话')">
<el-input :disabled="type == 2" v-model="params.phone"></el-input>
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
<span style="color: red;font-size: 20px;margin-right: 5px;">*</span>{{$t('出仓日期')}}
</template>
<el-date-picker
:disabled="type == 2"
value-format="yyyy-MM-dd HH:mm:ss"
v-model="params.deliveryDate"
type="datetime"
:placeholder="$t('选择日期')">
</el-date-picker>
</el-descriptions-item>
<el-descriptions-item v-if="type == 2">
<template slot="label">
<span style="color: red;font-size: 20px;margin-right: 5px;">*</span>{{$t('到仓日期')}}
</template>
<el-date-picker
value-format="yyyy-MM-dd HH:mm:ss"
v-model="params.arrivalDate"
type="datetime"
:placeholder="$t('选择日期')">
</el-date-picker>
</el-descriptions-item>
</el-descriptions>
<el-divider content-position="left">
{{$t('出仓影像')}}
</el-divider>
<image-and-video-upload :fileSize="50" :isShowTip="true" v-model="params.urls" ></image-and-video-upload>
<el-form>
<el-form-item :label="$t('备注')">
<el-input v-model="params.deliveryRemark" type="textarea"></el-input>
</el-form-item>
</el-form>
<div style="margin-bottom: 30px; text-align: center;">
<el-button v-if="type == 1" @click="submit" size="medium">{{$t('确认出仓')}}</el-button>
<el-button v-else @click="submit2(true)" size="medium" >{{$t('确认到仓')}}</el-button>
<el-button v-if="type == 2" @click="escapeBol = true;">{{$t('转异')}}</el-button>
<el-button v-if="type == 1" size="medium" @click="cancellationOfOrder">{{$t('取消调仓')}}</el-button>
<el-button size="medium" @click="$tab.closeOpenPage({path:'/order/order'})">{{$t('返回')}}</el-button>
</div>
<warehouse-location ref="area" :visible.sync="areaVisible" v-model="params.orderLocationCreateReqVOList" :warehouse-id="Number(this.type) === 1 ? warehouseDetails.warehouseOutId : warehouseDetails.warehouseInId" :order-id="Number(orderId)"></warehouse-location>
<el-dialog :title="$t('订单转异')" center :visible.sync="escapeBol">
<el-form ref="form2" :model="params" label-position="top" label-width="200">
<el-form-item prop="manualExceptionType" :rules="{ required:true,message:'至少选择一个转异原因'}" :label="$t('原因类型')">
<dict-selector v-model="params.manualExceptionType" form-type="checkbox" :type="DICT_TYPE.MANUAL_EXCEPTION_TYPE" multiple ></dict-selector>
</el-form-item>
<el-form-item :label="$t('附件')">
<image-upload v-model="params.exceptionUrls"></image-upload>
</el-form-item>
<el-form-item :label="$t('详细信息')">
<el-input v-model="params.descZh" type="textarea"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="submit2(false)">{{$t('确认并完成入仓')}}</el-button>
<el-button @click="escapeBol = false">{{$t('取消')}}</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import ordeDetailsForm from "@/views/ecw/order/components/ordeDetailsForm";
import {
cancelAdjust,
getAdjustInfo,
getOrder, getOrderWarehouseIn, listByOrderId,
orderWarehouseInGetAdjustInfo,
orderWarehousePicturePage, warehouseAdjustArrived,
warehouseAdjustSendOut
} from "@/api/ecw/order";
import Template from "@/views/cms/template";
import {DICT_TYPE} from '@/utils/dict';
import ImageAndVideoUpload from "@/components/ImageAndVideoUpload/index";
import {getSupplierPage} from "@/api/ecw/supplier";
import {getByWarehouseId} from "@/api/ecw/warehouseArea";
import {adjustLastWithStatus, warehouseApprovalCancel} from "@/api/ecw/batchSingleApplication";
import warehouseLocation from "@/components/WarehouseAreaDialog";
import imageUpload from "@/components/ImageUpload";
import {getProductBrankPage} from "@/api/ecw/productBrank";
import {parseTime} from "@/utils/ruoyi";
import WarehouseVideoList from "@/views/ecw/order/components/warehouse-video-list.vue";
export default {
name: "transferWarehousing",
components: {
WarehouseVideoList,
ImageAndVideoUpload,
Template,
ordeDetailsForm,
warehouseLocation,
imageUpload
},
props: {
orderId: [String, Number],
type: [String],
},
data() {
return {
areaVisible:false,
escapeBol:false,
STATUS :{1:this.$t('申请中'), 2:this.$t('通过'), 3:this.$t('不通过'), 4:this.$t('已取消'), 5:this.$t('已出仓'),6:this.$t('已到仓')},
orderDetails: {},
DICT_TYPE,
warehouseDetails: {},
warehouseList:[],
params: {
deliveryDate: "",
deliveryRemark: "",
id: undefined,
logisticsCompany:undefined,
logisticsNo: "",
phone: "",
urls: [],
arrivalDate:'',
orderLocationCreateReqVOList:[],
manualExceptionType:0,
descZh:'',
exceptionUrls:[]
},
warehouseInShi:0,
expressList:[],
storageSpaceList:[],
applyStatus:{},
orderItemVOList:[],
brandList:[]
}
},
computed:{
exWarehouse(){
return {
deliveryDate: this.params.deliveryDate,
deliveryRemark: this.params.deliveryRemark,
id: this.params.id,
logisticsCompany: this.params.logisticsCompany,
logisticsNo:this.params.logisticsNo,
phone: this.params.phone,
urls: this.params.urls,
}
},
toWarehouseAbnormal(){
let exceptionUrls = this.params.exceptionUrls
return {
arrivalDate: this.params.arrivalDate,
arrivalRemark: this.params.deliveryRemark,
descZh: this.params.descZh,
id: this.params.id,
manualExceptionType:this.params.manualExceptionType.join(','),
orderLocationCreateReqVOList: this.params.orderLocationCreateReqVOList,
urls: this.params.urls,
exceptionUrls:exceptionUrls.length ? exceptionUrls.split(',') :[],
}
},
toWarehouse(){
return {
arrivalDate: this.params.arrivalDate,
arrivalRemark: this.params.deliveryRemark,
id: this.params.id,
urls: this.params.urls,
orderLocationCreateReqVOList: this.params.orderLocationCreateReqVOList,
}
},
calculationStatus(){
return (val)=>{
let des = ''
switch (val.diffType) {
case 2 :
des = `${this.$t('多了')}${val.cartonsNumDiff}${this.$t('箱')}`
break
case 3 :
des = `${this.$t('少了')}${val.cartonsNumDiff}${this.$t('箱')}`
break
case 4 :
des = this.$t('准确到齐')
break
}
return des
}
}
},
created() {
//获得品牌
getProductBrankPage({pageNo:1,pageSize:10000,}).then(r => {
this.brandList = r.data.list
})
if(this.type == 1){
// 查参调仓记录
adjustLastWithStatus({orderId:this.orderId,lang:0}).then(r =>{
this.applyStatus = r.data})
}
// 获取供应商
getSupplierPage({ pageNo: 1, pageSize: 10000}).then(r => {
this.expressList = r.data.list;
})
// 获得订单
getOrder(this.orderId).then(r => {
if (r.code === 0) {
this.orderDetails = r.data;
}
})
if(this.type == 2){
// 调仓-明细-后台使用
getAdjustInfo({orderId:this.orderId,lang:0}).then(r => {
this.warehouseList = r.data
})
}
// 获取调仓明细
orderWarehouseInGetAdjustInfo({orderId: this.orderId, lang: 0}).then(r => {
this.warehouseDetails = r.data[r.data.length - 1]
listByOrderId({orderId:this.orderId}).then(res => {
if(res.code === 0 && Number(this.type) === 1){
this.params.orderLocationCreateReqVOList = res.data
}
// 等待仓库id和已选的储位后初始化储位信息
this.$nextTick(() => {
this.$refs.area.updateArea()
})
})
this.warehouseInShi = this.warehouseDetails.warehouseInShi || ''
this.params.phone = this.warehouseDetails.phone || '';
this.params.logisticsNo = this.warehouseDetails.logisticsNo;
this.params.id = this.warehouseDetails.id;
this.params.logisticsCompany = this.warehouseDetails.logisticsCompany ? parseInt(this.warehouseDetails.logisticsCompany) :undefined;
if(this.type == 2){
this.params.deliveryDate = parseTime(this.warehouseDetails.deliveryDate)
}
// orderWarehousePicturePage({rows:100,bizId:this.params.id,type:this.type == 1 ? 2 : 3 }).then(r => {
// if(r.code === 0){
// this.params.urls = r.data.list.map(e => e.url);
// }
// })
})
getOrderWarehouseIn(this.orderId).then(r => {
if(r.code === 0){
this.orderItemVOList = r.data;
}
})
},
methods:{
submit(){
warehouseAdjustSendOut(this.exWarehouse).then(
r => {
if(r.code === 0){
this.$message.success(this.$t('调拨出仓成功！'));
this.$tab.closeOpenPage({path:'/order/order'})
}
}
)
},
submit2(val){
if(val){
warehouseAdjustArrived(val ? this.toWarehouse : this.toWarehouseAbnormal).then(r => {
if(r.code === 0){
this.$message.success(this.$t('调拨到仓成功！'));
this.$tab.closeOpenPage({path:'/order/order'})
}
})
}else {
this.$refs.form2.validate( validate => {
if(validate){
warehouseAdjustArrived(val ? this.toWarehouse : this.toWarehouseAbnormal).then(r => {
if(r.code === 0){
this.$message.success(this.$t('调拨到仓成功！'));
this.$tab.closeOpenPage({path:'/order/order'})
}
})
}
})
}
},
totalFn({ columns, data }){
// 体积，数量，重量 W:入仓
let volume = 0,num = 0,weight = 0;
let Wvolume = 0 ,Wnum = 0,Wweight = 0;
data.forEach(i => {
volume += Number(i.volume)
num += Number(i.num)
weight += Number(i.weight)
if(i.orderWarehouseInBackItemDoList){
i.orderWarehouseInBackItemDoList.forEach(m => {
Wvolume += Number(m.volume || 0)
Wnum += Number(m.cartonsNum || 0)
Wweight += Number(m.weight || 0)
})
}
})
let text = `${this.$t('下单统计')}：${num}${this.$t('箱')} ${volume.toFixed(2)}m³ ${weight.toFixed(2)}Kg`
let text2 =` ${this.$t('入仓统计')}：${Wnum}${this.$t('箱')} ${Wvolume.toFixed(2)}m³ ${Wweight.toFixed(2)}Kg`
return [this.$t('合计：'),text,text2]
},
cancellationOfOrder(){
this.$prompt(this.$t('请输入取消调仓原因'), this.$t('提示'), {
confirmButtonText: this.$t('确定'),
cancelButtonText: this.$t('取消'),
}).then(({ value }) => {
cancelAdjust({
orderId: this.orderId,
reason: value,
}).then(r => {
console.log(r,'r');
if(r.code === 0){
this.$message({
type: 'info',
message: this.$t('取消调仓成功')
});
this.$tab.closeOpenPage({path:'/order/order'})
}
})
}).catch(() => {
});
},
},
watch:{
'params.orderLocationCreateReqVOList'(vo, vn){
console.log(vo, vn)
}
}
}
</script>
<style scoped>
</style>