- 在 manifest.json 中添加 Android 包名配置 - 在 package.json 中添加 pnpm 依赖覆盖配置 - 在 pages.json 中注册坯布出库相关页面路由 - 重命名 storefabricBusinessOutAdd.vue 为 storeFabricBusinessOutAdd.vue - 重构坯布出库新增页面,优化界面布局和交互逻辑 - 添加坯布出库列表、编辑、查看等功能页面 - 集成订单状态栏、面料信息弹窗、细码弹窗等组件 - 实现坯布出库详情列表和扫码功能模块 - 优化表单验证和数据提交流程
146 lines
4.4 KiB
Vue
146 lines
4.4 KiB
Vue
<template>
|
||
<view class="fabric-out-page">
|
||
<OrderStatusBar class="fabric-out-mt32" :status="order.audit_status" :name="order.audit_status_name" />
|
||
|
||
<view class="flex-white-plr26 ptb10 bdb_f5">
|
||
<text class="mr26">出仓单号</text>
|
||
<text>{{ order.order_no }}</text>
|
||
</view>
|
||
<view class="flex-white-plr26 ptb20 bdb_f5">
|
||
<text class="mr26">出仓类型</text>
|
||
<text>{{ billTypeName }}</text>
|
||
</view>
|
||
<view class="flex-white-plr26 ptb20 bdb_f5">
|
||
<text class="mr26">接收单位</text><text>{{ order.business_unit_name }}</text>
|
||
</view>
|
||
<view class="flex-white-plr26 ptb20 bdb_f5">
|
||
<text class="mr26">出货日期</text><text>{{ formatTime(order.delivery_time) }}</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.auditer_name" class="flex-white-plr26 ptb20 bdb_f5">
|
||
<text class="mr26">审核人</text><text>{{ order.auditer_name }} {{ formatTime(order.audit_time, 'YYYY-MM-DD') }}</text>
|
||
</view>
|
||
|
||
<FabricOutDetailList
|
||
:title="detailTitle"
|
||
:list="order.item_data"
|
||
@fabric-info="openFabricInfo"
|
||
@fine-code="openFineCode"
|
||
/>
|
||
|
||
<FabricOutFooter :buttons="actionButtons" @action="handleAction" />
|
||
|
||
<FabricInfoPopup :show.sync="fabricInfoShow" :data="currentFabricInfo" />
|
||
<FineCodePopup :show.sync="fineCodeShow" :list="currentFineCodes" :readonly="true" />
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import util from '@/common/util';
|
||
import FabricInfoPopup from '@/components/storefabric/FabricInfoPopup.vue';
|
||
import FineCodePopup from '@/components/storefabric/FineCodePopup.vue';
|
||
import OrderStatusBar from '@/components/storefabric/OrderStatusBar.vue';
|
||
import FabricOutDetailList from '@/components/storefabric/FabricOutDetailList.vue';
|
||
import FabricOutFooter from '@/components/storefabric/FabricOutFooter.vue';
|
||
import {
|
||
BILL_TYPES,
|
||
normalizeOrder,
|
||
getViewStatusActionButtons,
|
||
confirmOrderStatusAction,
|
||
formatDisplayTime,
|
||
} from '@/common/storeFabricBusinessOut';
|
||
|
||
export default {
|
||
components: { FabricInfoPopup, FineCodePopup, OrderStatusBar, FabricOutDetailList, FabricOutFooter },
|
||
data() {
|
||
return {
|
||
orderId: 0,
|
||
order: {},
|
||
billTypeName: (BILL_TYPES[0] || {}).label || '坯布其他出货单',
|
||
fabricInfoShow: false,
|
||
fineCodeShow: false,
|
||
currentFabricInfo: {},
|
||
currentFineCodes: [],
|
||
};
|
||
},
|
||
computed: {
|
||
actionButtons() {
|
||
return getViewStatusActionButtons(this.order.audit_status);
|
||
},
|
||
detailTitle() {
|
||
return `出仓细码(共 ${this.order.total_roll || 0} 匹 / ${this.order.total_weight || 0} KG)`;
|
||
},
|
||
},
|
||
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.gfmOtherDeliveryOrder.detail({ id: this.orderId })
|
||
.then((res) => {
|
||
const order = normalizeOrder(res);
|
||
if (!order) {
|
||
this.showError('单据不存在');
|
||
return;
|
||
}
|
||
this.order = order;
|
||
})
|
||
.catch((err) => {
|
||
this.showError(err.message || '加载单据失败');
|
||
});
|
||
},
|
||
openFabricInfo(row) {
|
||
this.currentFabricInfo = { ...row };
|
||
this.fabricInfoShow = true;
|
||
},
|
||
openFineCode(row) {
|
||
this.currentFineCodes = [...(row.fine_codes || [])];
|
||
this.fineCodeShow = true;
|
||
},
|
||
handleAction(action) {
|
||
if (action === 'edit') {
|
||
uni.navigateTo({ url: `./storeFabricBusinessOutEdit?id=${this.orderId}` });
|
||
return;
|
||
}
|
||
confirmOrderStatusAction(this, {
|
||
orderId: this.orderId,
|
||
action,
|
||
onSuccess: () => this.$u.api.gfmOtherDeliveryOrder.detail({ id: this.orderId })
|
||
.then((res) => {
|
||
uni.hideLoading();
|
||
const order = normalizeOrder(res);
|
||
if (order) this.order = order;
|
||
util.playSuccessAudio();
|
||
uni.showToast({ title: '操作成功', icon: 'success' });
|
||
}),
|
||
});
|
||
},
|
||
showError(message) {
|
||
util.playErrorAudio();
|
||
uni.showModal({ title: '提示', content: message, showCancel: false });
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
@import '@/pages/storefabric/storeFabricBusinessOutPage.scss';
|
||
page {
|
||
background-color: #F8F8F8;
|
||
padding-bottom: 260rpx;
|
||
}
|
||
</style>
|