136 lines
3.9 KiB
Vue
136 lines
3.9 KiB
Vue
<template>
|
|
<view class="fabric-out-page">
|
|
<OrderHeaderFold v-model="headerCollapsed" :summary="order.order_no">
|
|
<OrderStatusBar class="fabric-out-mt32" :status="order.audit_status" :name="order.audit_status_name" />
|
|
<view class="flex-white-plr26 ptb20 bdb_f5">
|
|
<text class="mr26">出仓类型</text>
|
|
<text>{{ order.out_order_type_name || '正常加工出仓' }}</text>
|
|
</view>
|
|
<view class="flex-white-plr26 ptb20 bdb_f5">
|
|
<text class="mr26">加工单位</text>
|
|
<text>{{ order.process_name || '-' }}</text>
|
|
</view>
|
|
<view class="flex-white-plr26 ptb20 bdb_f5">
|
|
<text class="mr26">仓库名称</text>
|
|
<text>{{ order.warehouse_name || '-' }}</text>
|
|
</view>
|
|
<view class="flex-white-plr26 ptb20 bdb_f5">
|
|
<text class="mr26">单据备注</text>
|
|
<text>{{ order.remark || '-' }}</text>
|
|
</view>
|
|
<view class="flex-white-plr26 ptb20 bdb_f5">
|
|
<text class="mr26">创建人</text>
|
|
<text>{{ order.creator_name }} {{ formatTime(order.create_time, 'YYYY-MM-DD') }}</text>
|
|
</view>
|
|
<view v-if="order.auditor_name" class="flex-white-plr26 ptb20 bdb_f5">
|
|
<text class="mr26">审核人</text>
|
|
<text>{{ order.auditor_name }} {{ formatTime(order.audit_time, 'YYYY-MM-DD') }}</text>
|
|
</view>
|
|
</OrderHeaderFold>
|
|
|
|
<ProcessOutDetailList
|
|
:title="detailTitle"
|
|
:list="order.item_data"
|
|
/>
|
|
|
|
<FabricOutFooter :buttons="actionButtons" @action="handleAction" />
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import util from '@/common/util';
|
|
import OrderStatusBar from '@/components/storefabric/OrderStatusBar.vue';
|
|
import OrderHeaderFold from '@/components/storefabric/OrderHeaderFold.vue';
|
|
import FabricOutFooter from '@/components/storefabric/FabricOutFooter.vue';
|
|
import ProcessOutDetailList from '@/components/storegoods/ProcessOutDetailList.vue';
|
|
import {
|
|
normalizeOrder,
|
|
getViewStatusActionButtons,
|
|
confirmOrderStatusAction,
|
|
formatDisplayTime,
|
|
} from '@/common/storeGoodsProcessOut';
|
|
|
|
export default {
|
|
components: { OrderStatusBar, OrderHeaderFold, FabricOutFooter, ProcessOutDetailList },
|
|
data() {
|
|
return {
|
|
orderId: 0,
|
|
headerCollapsed: true,
|
|
order: { item_data: [] },
|
|
};
|
|
},
|
|
computed: {
|
|
actionButtons() {
|
|
return getViewStatusActionButtons(this.order.audit_status);
|
|
},
|
|
detailTitle() {
|
|
return `出仓明细（共 ${this.order.total_roll || 0} 匹）`;
|
|
},
|
|
},
|
|
onLoad(e) {
|
|
uni.setNavigationBarTitle({ title: '查看加工出仓单' });
|
|
if (e.id) {
|
|
this.orderId = Number(e.id);
|
|
this.refreshOrder();
|
|
}
|
|
},
|
|
onShow() {
|
|
if (this.orderId) this.refreshOrder();
|
|
},
|
|
methods: {
|
|
formatTime: formatDisplayTime,
|
|
refreshOrder() {
|
|
this.$u.api.fpmProcessOutOrder.detail({ id: this.orderId })
|
|
.then((res) => {
|
|
const order = normalizeOrder(res);
|
|
if (!order) {
|
|
this.showError('单据不存在');
|
|
return;
|
|
}
|
|
this.order = order;
|
|
})
|
|
.catch((err) => {
|
|
this.showError(err.message || '加载单据失败');
|
|
});
|
|
},
|
|
handleAction(action) {
|
|
if (action === 'edit') {
|
|
uni.navigateTo({ url: `./storeGoodsProcessOutEdit?id=${this.orderId}` });
|
|
return;
|
|
}
|
|
confirmOrderStatusAction(this, {
|
|
orderId: this.orderId,
|
|
action,
|
|
onSuccess: () => {
|
|
uni.hideLoading();
|
|
const voice = util.statusSuccessVoice(action);
|
|
util.playSuccessAudio(voice);
|
|
uni.showToast({ title: voice, icon: 'success' });
|
|
if (action === 'unapprove') {
|
|
uni.redirectTo({ url: `./storeGoodsProcessOutEdit?id=${this.orderId}` });
|
|
return;
|
|
}
|
|
return this.$u.api.fpmProcessOutOrder.detail({ id: this.orderId })
|
|
.then((res) => {
|
|
const order = normalizeOrder(res);
|
|
if (order) this.order = order;
|
|
});
|
|
},
|
|
});
|
|
},
|
|
showError(message) {
|
|
util.playErrorAudio(message);
|
|
uni.showModal({ title: '提示', content: message, showCancel: false });
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
@import '@/pages/storefabric/storeFabricBusinessOutPage.scss';
|
|
page {
|
|
background-color: #F8F8F8;
|
|
padding-bottom: 260rpx;
|
|
}
|
|
</style>
|