feat(storefabric): 新增坯布出库相关页面及功能

- 在 manifest.json 中添加 Android 包名配置
- 在 package.json 中添加 pnpm 依赖覆盖配置
- 在 pages.json 中注册坯布出库相关页面路由
- 重命名 storefabricBusinessOutAdd.vue 为 storeFabricBusinessOutAdd.vue
- 重构坯布出库新增页面,优化界面布局和交互逻辑
- 添加坯布出库列表、编辑、查看等功能页面
- 集成订单状态栏、面料信息弹窗、细码弹窗等组件
- 实现坯布出库详情列表和扫码功能模块
- 优化表单验证和数据提交流程
This commit is contained in:
2026-06-17 16:59:31 +08:00
parent d5b2e19658
commit 567da03aea
20 changed files with 3065 additions and 1057 deletions
@@ -0,0 +1,66 @@
<template>
<view class="myCard">
<view class="cardTopName">
<text>{{ item.order_no }}</text>
<text class="statusTag" :class="'status-' + item.audit_status">{{ item.audit_status_name }}</text>
</view>
<view class="cardRow">
<view>出仓日期:</view>
<view>{{ formatTime(item.out_date) }}</view>
</view>
<view class="cardRow">
<view>出仓类型:</view>
<view>{{ item.bill_type_name }}</view>
</view>
<view class="cardRow">
<view>接收单位:</view>
<view>{{ item.business_unit_name || '-' }}</view>
</view>
<view class="cardRow">
<view>创 建 人:</view>
<view>{{ item.create_user_name }} {{ formatTime(item.create_time, 'YYYY-MM-DD') }}</view>
</view>
<view v-if="item.auditor_name" class="cardRow">
<view>审 核 人:</view>
<view>{{ item.auditor_name }} {{ formatTime(item.audit_date, 'YYYY-MM-DD') }}</view>
</view>
<view v-if="!isDetail && !isSelect" class="lookDetail">
<text>查看详情</text>
<u-icon name="arrow-right" size="36" />
</view>
</view>
</template>
<script>
import { formatDisplayTime } from '@/common/storeFabricBusinessOut';
export default {
props: {
item: { type: Object, default: () => ({}) },
index: { type: Number, default: 0 },
isSelect: { type: Boolean, default: false },
isDetail: { type: Boolean, default: false },
},
methods: {
formatTime: formatDisplayTime,
},
};
</script>
<style scoped>
.cardTopName {
display: flex;
align-items: center;
justify-content: space-between;
}
.statusTag {
font-size: 24rpx;
padding: 4rpx 12rpx;
border-radius: 6rpx;
font-weight: normal;
}
.status-0 { background: #f0f0f0; color: #666; }
.status-1 { background: #fff7e6; color: #fa8c16; }
.status-2 { background: #f6ffed; color: #52c41a; }
.status-3 { background: #fff1f0; color: #f5222d; }
.status-4 { background: #f5f5f5; color: #999; }
</style>
@@ -0,0 +1,73 @@
<template>
<u-popup v-model="visible" mode="center" width="680rpx" border-radius="14" :closeable="true">
<view class="popupWrap">
<view class="popupTitle">坯布资料</view>
<scroll-view scroll-y class="scrollBody">
<view class="infoRow" v-for="field in fields" :key="field.key">
<text class="label">{{ field.label }}</text>
<text class="value">{{ data[field.key] || '-' }}</text>
</view>
</scroll-view>
</view>
</u-popup>
</template>
<script>
import { FABRIC_INFO_FIELDS } from '@/common/storeFabricBusinessOut';
export default {
props: {
show: { type: Boolean, default: false },
data: { type: Object, default: () => ({}) },
},
computed: {
visible: {
get() { return this.show; },
set(val) { this.$emit('update:show', val); },
},
fields() {
return FABRIC_INFO_FIELDS;
},
},
};
</script>
<style scoped>
.popupWrap {
padding: 30rpx 30rpx 24rpx;
max-height: 80vh;
box-sizing: border-box;
display: flex;
flex-direction: column;
overflow: hidden;
}
.popupTitle {
font-size: 32rpx;
font-weight: bold;
text-align: center;
margin-bottom: 20rpx;
color: #333;
flex-shrink: 0;
}
.scrollBody {
flex: 1;
height: 62vh;
max-height: 62vh;
}
.infoRow {
display: flex;
padding: 16rpx 0;
border-bottom: 1rpx solid #f0f0f0;
font-size: 28rpx;
}
.label {
width: 180rpx;
color: #888;
flex-shrink: 0;
}
.value {
flex: 1;
color: #333;
word-break: break-all;
}
</style>
@@ -0,0 +1,36 @@
<template>
<view>
<view class="fabric-out-sectionTitle">{{ title }}</view>
<slot name="before-list" />
<view class="fabric-out-detailList">
<view
v-for="row in list"
:key="row.group_key || row.id"
class="fabric-out-detailCard"
>
<view class="fabric-out-detailRow" @click="$emit('fabric-info', row)">
<text>{{ row.grey_fabric_code }}#{{ row.grey_fabric_name }}</text>
<u-icon name="arrow-right" size="32" color="#888" />
</view>
<view class="fabric-out-detailMeta">
<text>匹数:{{ row.roll }}</text>
<text>重量:{{ row.weight }}KG</text>
<u-button type="primary" size="mini" @click="$emit('fine-code', row)">细码</u-button>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
props: {
list: { type: Array, default: () => [] },
title: { type: String, default: '出仓细码' },
},
};
</script>
<style scoped lang="scss">
@import '@/pages/storefabric/storeFabricBusinessOutPage.scss';
</style>
@@ -0,0 +1,27 @@
<template>
<view v-if="buttons.length" class="fabric-out-submitView">
<view v-for="btn in buttons" :key="btn.action" class="fabric-out-actionBtnWrap">
<u-button type="primary" :class="singleBtnClass" @click="$emit('action', btn.action)">
{{ btn.label }}
</u-button>
</view>
</view>
</template>
<script>
export default {
props: {
buttons: { type: Array, default: () => [] },
single: { type: Boolean, default: false },
},
computed: {
singleBtnClass() {
return this.single ? 'fabric-out-actionBtn' : '';
},
},
};
</script>
<style scoped lang="scss">
@import '@/pages/storefabric/storeFabricBusinessOutPage.scss';
</style>
@@ -0,0 +1,38 @@
<template>
<view>
<view v-if="canScan" class="flex-white-plr26 ptb20 bdb_f5 fabric-out-scanRow">
<text class="mr26">条码资料</text>
<input
type="text"
:value="value"
class="fabric-out-scanInput"
placeholder="扫描条码"
@input="$emit('input', $event.detail.value)"
@confirm="$emit('scan')"
/>
<checkbox-group @change="$emit('delete-mode-change', $event)">
<label class="fabric-out-delCheck">
<checkbox :checked="deleteMode" />删除
</label>
</checkbox-group>
</view>
<view v-else class="fabric-out-scanTip">{{ disabledTip }}</view>
<view v-if="message" class="fabric-out-msgTip">{{ message }}</view>
</view>
</template>
<script>
export default {
props: {
canScan: { type: Boolean, default: false },
value: { type: String, default: '' },
deleteMode: { type: Boolean, default: false },
message: { type: String, default: '' },
disabledTip: { type: String, default: '当前状态不可扫码' },
},
};
</script>
<style scoped lang="scss">
@import '@/pages/storefabric/storeFabricBusinessOutPage.scss';
</style>
@@ -0,0 +1,154 @@
<template>
<view class="fabric-out-scanDetail">
<view class="fabric-out-scanDetailRow fabric-out-scanDetailRow--2col">
<text class="fabric-out-scanDetailCell">已扫条数:{{ formatCount(detail.scanned_roll) }}条</text>
<text class="fabric-out-scanDetailCell">机台库存:{{ formatRoll(detail.machine_stock) }}条</text>
</view>
<view class="fabric-out-scanDetailRow fabric-out-scanDetailRow--2col">
<text class="fabric-out-scanDetailCell">合计条数:{{ formatRoll(detail.total_roll) }}条</text>
<text class="fabric-out-scanDetailCell">合计重量:{{ formatWeight(detail.total_weight) }}KG</text>
</view>
<view class="fabric-out-scanDetailRow">
<text class="fabric-out-scanDetailLabel">客户:</text>
<text class="fabric-out-scanDetailValue">{{ detail.customer_name || '' }}</text>
</view>
<view class="fabric-out-scanDetailRow fabric-out-scanDetailRow--2col">
<view class="fabric-out-scanDetailCheck" @click="toggleGroup('produce_order_no')">
<checkbox :checked="isGroupChecked('produce_order_no')" />
<text class="fabric-out-scanDetailLabel">生产通知单:</text>
<text class="fabric-out-scanDetailValue">{{ detail.produce_order_no || '' }}</text>
</view>
<view class="fabric-out-scanDetailCheck" @click="toggleGroup('grey_fabric_code')">
<checkbox :checked="isGroupChecked('grey_fabric_code')" />
<text class="fabric-out-scanDetailLabel">布编:</text>
<text class="fabric-out-scanDetailValue">{{ detail.grey_fabric_code || '' }}</text>
</view>
</view>
<view class="fabric-out-scanDetailRow">
<text class="fabric-out-scanDetailLabel">布名:</text>
<text class="fabric-out-scanDetailValue">{{ detail.grey_fabric_name || '' }}</text>
</view>
<view class="fabric-out-scanDetailRow">
<view class="fabric-out-scanDetailCheck" @click="toggleGroup('yarn_batch')">
<checkbox :checked="isGroupChecked('yarn_batch')" />
<text class="fabric-out-scanDetailLabel">纱批:</text>
<text class="fabric-out-scanDetailValue">{{ detail.yarn_batch || '' }}</text>
</view>
</view>
<view class="fabric-out-scanDetailRow fabric-out-scanDetailRow--2col">
<view class="fabric-out-scanDetailCheck" @click="toggleGroup('machine_number')">
<checkbox :checked="isGroupChecked('machine_number')" />
<text class="fabric-out-scanDetailLabel">机号:</text>
<text class="fabric-out-scanDetailValue">{{ detail.machine_number || '' }}</text>
</view>
<view class="fabric-out-scanDetailCheck" @click="toggleGroup('volume_number')">
<checkbox :checked="isGroupChecked('volume_number')" />
<text class="fabric-out-scanDetailLabel">布号:</text>
<text class="fabric-out-scanDetailValue">{{ detail.volume_number || '' }}</text>
</view>
</view>
<view class="fabric-out-scanDetailRow fabric-out-scanDetailRow--2col">
<view class="fabric-out-scanDetailCheck" @click="toggleGroup('grey_fabric_level_name')">
<checkbox :checked="isGroupChecked('grey_fabric_level_name')" />
<text class="fabric-out-scanDetailLabel">等级:</text>
<text class="fabric-out-scanDetailValue">{{ detail.grey_fabric_level_name || '' }}</text>
</view>
<view class="fabric-out-scanDetailCell">
<text class="fabric-out-scanDetailLabel">重量:</text>
<text class="fabric-out-scanDetailValue">{{ formatWeight(detail.weight) }}Kg</text>
</view>
</view>
<scroll-view scroll-x class="fabric-out-scanDetailTableScroll">
<view class="fabric-out-scanDetailTable" :style="{ width: tableWidth }">
<view class="fabric-out-scanDetailTableRow fabric-out-scanDetailTableHead">
<view
v-for="col in columns"
:key="col.key"
class="fabric-out-scanDetailTableCell"
:style="cellStyle(col)"
>{{ col.label }}</view>
</view>
<view v-if="!tableRows.length" class="fabric-out-scanDetailEmpty">暂无数据~~</view>
<view
v-for="(row, rowIndex) in tableRows"
:key="rowIndex"
class="fabric-out-scanDetailTableRow"
>
<view
v-for="col in columns"
:key="col.key"
class="fabric-out-scanDetailTableCell"
:style="cellStyle(col)"
>{{ formatCell(row, col.key) }}</view>
</view>
</view>
</scroll-view>
</view>
</template>
<script>
import {
SCAN_DETAIL_TABLE_COLUMNS,
getScanDetailTableWidth,
buildScanDetailTableRows,
} from '@/common/storeFabricBusinessOut';
export default {
props: {
detail: { type: Object, default: () => ({}) },
itemData: { type: Array, default: () => [] },
groupKeys: { type: Array, default: () => [] },
},
computed: {
columns() {
return SCAN_DETAIL_TABLE_COLUMNS;
},
tableWidth() {
return getScanDetailTableWidth(this.columns);
},
tableRows() {
return buildScanDetailTableRows(this.itemData, this.groupKeys);
},
},
methods: {
cellStyle(col) {
return {
width: `${col.width}rpx`,
minWidth: `${col.width}rpx`,
maxWidth: `${col.width}rpx`,
};
},
isGroupChecked(key) {
return (this.groupKeys || []).includes(key);
},
toggleGroup(key) {
const next = [...(this.groupKeys || [])];
const index = next.indexOf(key);
if (index >= 0) next.splice(index, 1);
else next.push(key);
this.$emit('group-change', next);
},
formatRoll(value) {
const n = Number(value || 0);
return Number.isInteger(n) ? n : Number(n.toFixed(2));
},
formatCount(value) {
return Number(value || 0);
},
formatWeight(value) {
const n = Number(value || 0);
return Number(n.toFixed(2));
},
formatCell(row, key) {
if (key === 'roll') return this.formatRoll(row.roll);
if (key === 'weight') return this.formatWeight(row.weight);
return row[key] || '';
},
},
};
</script>
<style scoped lang="scss">
@import '@/pages/storefabric/storeFabricBusinessOutPage.scss';
</style>
@@ -0,0 +1,160 @@
<template>
<u-popup v-model="visible" mode="center" width="94%" border-radius="14" :closeable="true">
<view class="popupWrap">
<view class="popupTitle">细码</view>
<view v-if="!list.length" class="emptyTip">暂无细码数据</view>
<scroll-view v-else scroll-x class="tableScroll">
<view class="fineTable" :style="{ width: tableWidth }">
<view class="tableRow tableHead">
<view
v-for="col in columns"
:key="col.key"
class="tableCell headCell"
:style="cellStyle(col)"
>{{ col.label }}</view>
</view>
<view v-for="(row, rowIndex) in tableRows" :key="rowIndex" class="tableRow">
<view
v-for="col in columns"
:key="col.key"
class="tableCell"
:class="{ actionCell: col.key === 'action' && !readonly }"
:style="cellStyle(col)"
@click="onCellTap(col.key, rowIndex)"
>{{ row[col.key] }}</view>
</view>
</view>
</scroll-view>
<view v-if="!readonly && list.length" class="tableTip">点击「操作」列删除,将调用扫码删除接口</view>
</view>
</u-popup>
</template>
<script>
import {
getFineCodeTableColumns,
getFineCodeTableWidth,
mapFineCodeTableRows,
} from '@/common/storeFabricBusinessOut';
export default {
props: {
show: { type: Boolean, default: false },
list: { type: Array, default: () => [] },
readonly: { type: Boolean, default: false },
},
computed: {
visible: {
get() { return this.show; },
set(val) { this.$emit('update:show', val); },
},
columns() {
return getFineCodeTableColumns(this.readonly);
},
tableRows() {
return mapFineCodeTableRows(this.list, this.readonly);
},
tableWidth() {
return getFineCodeTableWidth(this.columns);
},
tableScrollHeight() {
const rowHeight = 56;
const headerHeight = 56;
const total = headerHeight + this.list.length * rowHeight;
return `${Math.min(Math.max(total, 112), 480)}rpx`;
},
},
methods: {
cellStyle(col) {
return {
width: `${col.width}rpx`,
minWidth: `${col.width}rpx`,
maxWidth: `${col.width}rpx`,
};
},
onCellTap(key, rowIndex) {
if (this.readonly || key !== 'action') return;
const item = this.list[rowIndex];
if (item) this.$emit('delete', item);
},
},
};
</script>
<style scoped>
.popupWrap {
padding: 24rpx 16rpx 30rpx;
max-height: 80vh;
box-sizing: border-box;
display: flex;
flex-direction: column;
overflow: hidden;
}
.popupTitle {
font-size: 32rpx;
font-weight: bold;
text-align: center;
margin-bottom: 20rpx;
color: #333;
flex-shrink: 0;
}
.emptyTip {
text-align: center;
color: #999;
padding: 40rpx 0;
font-size: 28rpx;
}
.tableScroll {
width: 100%;
flex-shrink: 0;
}
.fineTable {
display: inline-block;
vertical-align: top;
border: 1rpx solid #e1e1e1;
box-sizing: border-box;
}
.tableRow {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
border-bottom: 1rpx solid #e1e1e1;
}
.tableRow:last-child {
border-bottom: none;
}
.tableHead {
background: #f1f1f1;
position: sticky;
top: 0;
z-index: 2;
}
.tableCell {
flex-shrink: 0;
padding: 12rpx 8rpx;
font-size: 22rpx;
color: #333;
text-align: center;
border-right: 1rpx solid #e1e1e1;
box-sizing: border-box;
word-break: break-all;
white-space: normal;
}
.tableCell:last-child {
border-right: none;
}
.headCell {
font-weight: bold;
color: #3e3e3e;
}
.actionCell {
color: #f5222d;
}
.tableTip {
margin-top: 16rpx;
font-size: 22rpx;
color: #999;
text-align: center;
flex-shrink: 0;
}
</style>
@@ -0,0 +1,49 @@
<template>
<view class="statusRow">
<text class="statusLabel">订单状态</text>
<text class="statusTag" :class="'status-' + status">{{ displayName }}</text>
</view>
</template>
<script>
import { AUDIT_STATUS_MAP, DRAFT_AUDIT_STATUS, DRAFT_AUDIT_STATUS_NAME } from '@/common/storeFabricBusinessOut';
export default {
props: {
status: { type: [Number, String], default: 0 },
name: { type: String, default: '' },
},
computed: {
displayName() {
if (Number(this.status) === DRAFT_AUDIT_STATUS) return DRAFT_AUDIT_STATUS_NAME;
return this.name || AUDIT_STATUS_MAP[Number(this.status)] || '-';
},
},
};
</script>
<style scoped>
.statusRow {
display: flex;
align-items: center;
justify-content: space-between;
padding: 20rpx 26rpx;
background: #fff;
border-bottom: 1rpx solid #f5f5f5;
}
.statusLabel {
font-size: 28rpx;
color: #333;
}
.statusTag {
font-size: 24rpx;
padding: 4rpx 12rpx;
border-radius: 6rpx;
font-weight: normal;
}
.status-0 { background: #f0f0f0; color: #666; }
.status-1 { background: #fff7e6; color: #fa8c16; }
.status-2 { background: #f6ffed; color: #52c41a; }
.status-3 { background: #fff1f0; color: #f5222d; }
.status-4 { background: #f5f5f5; color: #999; }
</style>