将coilId的存储模式改成string
This commit is contained in:
@@ -17,9 +17,9 @@ export function exportMaterialCoil(query) {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
export function getMaterialCoil(CoilMaterialId) {
|
export function getMaterialCoil(coilId) {
|
||||||
return request({
|
return request({
|
||||||
url: '/wms/materialCoil/' + CoilMaterialId,
|
url: '/wms/materialCoil/' + coilId,
|
||||||
method: 'get'
|
method: 'get'
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
@@ -50,17 +50,21 @@ export function updateMaterialCoilSimple(data) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 删除钢卷物料表
|
// 删除钢卷物料表
|
||||||
export function delMaterialCoil(CoilMaterialId) {
|
export function delMaterialCoil(coilId) {
|
||||||
return request({
|
return request({
|
||||||
url: '/wms/materialCoil/' + CoilMaterialId,
|
url: '/wms/materialCoil/' + coilId,
|
||||||
method: 'delete'
|
method: 'delete'
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
// 钢卷溯源查询
|
// 钢卷溯源查询
|
||||||
export function getMaterialCoilTrace(CoilMaterialId) {
|
export function getMaterialCoilTrace(enterCoilNo, currentCoilNo) {
|
||||||
return request({
|
return request({
|
||||||
url: '/wms/materialCoil/trace/' + CoilMaterialId,
|
url: '/wms/materialCoil/trace',
|
||||||
method: 'get'
|
method: 'get',
|
||||||
|
params: {
|
||||||
|
enterCoilNo: enterCoilNo,
|
||||||
|
currentCoilNo: currentCoilNo
|
||||||
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
@@ -1,12 +1,887 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="">
|
<view class="merge-container">
|
||||||
合并
|
<!-- 扫码提示 -->
|
||||||
|
<view class="scan-section">
|
||||||
|
<view class="scan-btn-wrapper" @click="handleScan">
|
||||||
|
<view class="scan-icon">
|
||||||
|
<text class="icon-camera">📷</text>
|
||||||
|
</view>
|
||||||
|
<text class="scan-tip">扫描要合卷的钢卷</text>
|
||||||
|
<text class="scan-hint">已扫描 {{ scannedCoils.length }} 个钢卷</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 已扫描的钢卷列表 -->
|
||||||
|
<view class="coil-list" v-if="scannedCoils.length > 0">
|
||||||
|
<view class="card-title">
|
||||||
|
<text class="title-dot"></text>
|
||||||
|
<text class="title-text">待合卷列表</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="coil-item" v-for="(coil, index) in scannedCoils" :key="index">
|
||||||
|
<view class="coil-content">
|
||||||
|
<view class="coil-index">{{ index + 1 }}</view>
|
||||||
|
<view class="coil-info">
|
||||||
|
<view class="coil-row">
|
||||||
|
<text class="coil-label">入场钢卷号：</text>
|
||||||
|
<text class="coil-value">{{ coil.enterCoilNo }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="coil-row">
|
||||||
|
<text class="coil-label">当前钢卷号：</text>
|
||||||
|
<text class="coil-value">{{ coil.currentCoilNo }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="coil-row" v-if="coil.warehouse">
|
||||||
|
<text class="coil-label">库区：</text>
|
||||||
|
<text class="coil-value">{{ coil.warehouse.warehouseName }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="coil-remove" @click="removeCoil(index)">
|
||||||
|
<text>✕</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 合卷配置 -->
|
||||||
|
<view class="form-card" v-if="scannedCoils.length >= 2" @click="closeWarehouseList">
|
||||||
|
<view class="card-title">
|
||||||
|
<text class="title-dot"></text>
|
||||||
|
<text class="title-text">合卷配置</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 新钢卷号 -->
|
||||||
|
<view class="form-item">
|
||||||
|
<text class="form-label">新钢卷号</text>
|
||||||
|
<input
|
||||||
|
v-model="mergedCoilNo"
|
||||||
|
placeholder="请输入合卷后的新钢卷号"
|
||||||
|
class="form-input"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 班组 -->
|
||||||
|
<view class="form-item">
|
||||||
|
<text class="form-label">班组</text>
|
||||||
|
<input
|
||||||
|
v-model="team"
|
||||||
|
placeholder="请输入班组名称"
|
||||||
|
class="form-input"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 目标库区 -->
|
||||||
|
<view class="form-item form-item-optional">
|
||||||
|
<text class="form-label-optional">目标库区</text>
|
||||||
|
<view
|
||||||
|
class="picker-input"
|
||||||
|
@click="showWarehousePicker()"
|
||||||
|
>
|
||||||
|
<text class="picker-text" :class="{ 'picker-placeholder': !warehouseName }">
|
||||||
|
{{ warehouseName || '请选择目标库区' }}
|
||||||
|
</text>
|
||||||
|
<text class="picker-arrow">▼</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 毛重 -->
|
||||||
|
<view class="form-item form-item-optional">
|
||||||
|
<text class="form-label-optional">毛重 (kg)</text>
|
||||||
|
<input
|
||||||
|
v-model="grossWeight"
|
||||||
|
type="digit"
|
||||||
|
placeholder="请输入毛重（选填）"
|
||||||
|
class="form-input"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 净重 -->
|
||||||
|
<view class="form-item form-item-optional">
|
||||||
|
<text class="form-label-optional">净重 (kg)</text>
|
||||||
|
<input
|
||||||
|
v-model="netWeight"
|
||||||
|
type="digit"
|
||||||
|
placeholder="请输入净重（选填）"
|
||||||
|
class="form-input"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 操作者信息 -->
|
||||||
|
<view class="operator-info">
|
||||||
|
<text class="operator-label">操作人：</text>
|
||||||
|
<text class="operator-name">{{ operatorName }}</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 操作按钮 -->
|
||||||
|
<view class="action-buttons">
|
||||||
|
<button class="btn btn-secondary" @click="handleReset">清空重新扫</button>
|
||||||
|
<button class="btn btn-primary" @click="handleConfirm" :disabled="loading">
|
||||||
|
{{ loading ? '提交中...' : '确认合卷' }}
|
||||||
|
</button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 提示信息 -->
|
||||||
|
<view class="tip-card" v-if="scannedCoils.length === 1">
|
||||||
|
<text class="tip-text">至少需要扫描 2 个钢卷才能进行合卷操作</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 库区选择弹窗 -->
|
||||||
|
<uni-popup ref="warehousePopup" type="bottom">
|
||||||
|
<view class="warehouse-popup">
|
||||||
|
<view class="popup-header">
|
||||||
|
<text class="popup-title">选择库区</text>
|
||||||
|
<text class="popup-close" @click="closeWarehousePicker">✕</text>
|
||||||
|
</view>
|
||||||
|
<view class="popup-search">
|
||||||
|
<input
|
||||||
|
v-model="warehouseSearchKeyword"
|
||||||
|
@input="filterWarehousesInPicker"
|
||||||
|
placeholder="搜索库区名称"
|
||||||
|
class="search-input"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
<scroll-view class="popup-body" scroll-y>
|
||||||
|
<view
|
||||||
|
class="warehouse-item"
|
||||||
|
v-for="warehouse in filteredWarehousesInPicker"
|
||||||
|
:key="warehouse.warehouseId"
|
||||||
|
@click="selectWarehouseFromPicker(warehouse)"
|
||||||
|
>
|
||||||
|
<text class="warehouse-name">{{ warehouse.warehouseName }}</text>
|
||||||
|
<text class="warehouse-check" v-if="warehouseId === warehouse.warehouseId">✓</text>
|
||||||
|
</view>
|
||||||
|
<view class="empty-tip" v-if="!filteredWarehousesInPicker || filteredWarehousesInPicker.length === 0">
|
||||||
|
<text>未找到匹配的库区</text>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
</uni-popup>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import { getGenerateRecord } from '@/api/wms/code.js'
|
||||||
|
import { updateMaterialCoil, getMaterialCoil, getMaterialCoilTrace } from '@/api/wms/coil.js'
|
||||||
|
import { listWarehouse } from '@/api/wms/warehouse.js'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
scannedCoils: [],
|
||||||
|
mergedCoilNo: '',
|
||||||
|
team: '',
|
||||||
|
warehouseId: undefined,
|
||||||
|
warehouseName: '',
|
||||||
|
warehouseKeyword: '',
|
||||||
|
warehouses: [],
|
||||||
|
filteredWarehouses: [],
|
||||||
|
showWarehouseList: false,
|
||||||
|
warehouseSearchKeyword: '',
|
||||||
|
filteredWarehousesInPicker: [],
|
||||||
|
grossWeight: '',
|
||||||
|
netWeight: '',
|
||||||
|
loading: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
onLoad() {
|
||||||
|
this.loadWarehouses();
|
||||||
|
},
|
||||||
|
|
||||||
|
mounted() {
|
||||||
|
this.loadWarehouses();
|
||||||
|
},
|
||||||
|
|
||||||
|
computed: {
|
||||||
|
operatorName() {
|
||||||
|
return this.$store.state.user.nickName || this.$store.state.user.name || '未知'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
// 加载库区列表
|
||||||
|
async loadWarehouses() {
|
||||||
|
console.log('合卷页面开始加载库区...');
|
||||||
|
try {
|
||||||
|
const res = await listWarehouse({ pageNum: 1, pageSize: 1000 });
|
||||||
|
console.log("合卷页面库区返回值", res);
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.warehouses = res.data || [];
|
||||||
|
this.filteredWarehouses = [...this.warehouses];
|
||||||
|
console.log('合卷页面库区加载成功，数量:', this.warehouses.length);
|
||||||
|
} else {
|
||||||
|
console.error('合卷页面库区加载失败:', res.msg);
|
||||||
|
}
|
||||||
|
} catch (err) {
|
||||||
|
console.error('合卷页面加载库区异常:', err);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// 过滤库区
|
||||||
|
filterWarehouses() {
|
||||||
|
console.log('合卷页面过滤库区，关键词:', this.warehouseKeyword);
|
||||||
|
console.log('合卷页面当前库区列表:', this.warehouses);
|
||||||
|
const keyword = this.warehouseKeyword.trim().toLowerCase();
|
||||||
|
if (!keyword) {
|
||||||
|
this.filteredWarehouses = this.warehouses;
|
||||||
|
} else {
|
||||||
|
this.filteredWarehouses = this.warehouses.filter(warehouse => {
|
||||||
|
const name = (warehouse.warehouseName || '').toLowerCase();
|
||||||
|
return name.includes(keyword);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
console.log('合卷页面过滤后库区数量:', this.filteredWarehouses.length);
|
||||||
|
this.showWarehouseList = true;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 选择库区
|
||||||
|
selectWarehouse(warehouse) {
|
||||||
|
this.warehouseId = warehouse.warehouseId;
|
||||||
|
this.warehouseName = warehouse.warehouseName;
|
||||||
|
this.warehouseKeyword = warehouse.warehouseName;
|
||||||
|
this.showWarehouseList = false;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 关闭库区搜索列表
|
||||||
|
closeWarehouseList() {
|
||||||
|
this.showWarehouseList = false;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 显示库区选择器
|
||||||
|
showWarehousePicker() {
|
||||||
|
this.warehouseSearchKeyword = '';
|
||||||
|
this.filteredWarehousesInPicker = [...this.warehouses];
|
||||||
|
this.$refs.warehousePopup.open();
|
||||||
|
},
|
||||||
|
|
||||||
|
// 关闭库区选择器
|
||||||
|
closeWarehousePicker() {
|
||||||
|
this.$refs.warehousePopup.close();
|
||||||
|
},
|
||||||
|
|
||||||
|
// 在选择器中过滤库区
|
||||||
|
filterWarehousesInPicker() {
|
||||||
|
const keyword = this.warehouseSearchKeyword.trim().toLowerCase();
|
||||||
|
if (!keyword) {
|
||||||
|
this.filteredWarehousesInPicker = [...this.warehouses];
|
||||||
|
} else {
|
||||||
|
this.filteredWarehousesInPicker = this.warehouses.filter(warehouse => {
|
||||||
|
const name = (warehouse.warehouseName || '').toLowerCase();
|
||||||
|
return name.includes(keyword);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// 从选择器中选择库区
|
||||||
|
selectWarehouseFromPicker(warehouse) {
|
||||||
|
this.warehouseId = warehouse.warehouseId;
|
||||||
|
this.warehouseName = warehouse.warehouseName;
|
||||||
|
this.warehouseKeyword = warehouse.warehouseName;
|
||||||
|
this.closeWarehousePicker();
|
||||||
|
},
|
||||||
|
|
||||||
|
// 扫码
|
||||||
|
handleScan() {
|
||||||
|
uni.scanCode({
|
||||||
|
success: async (res) => {
|
||||||
|
console.log('扫码结果：', res.result);
|
||||||
|
try {
|
||||||
|
const qrcodeId = res.result;
|
||||||
|
|
||||||
|
// 1. 获取二维码详情
|
||||||
|
const qrcodeRes = await getGenerateRecord(qrcodeId);
|
||||||
|
if (qrcodeRes.code !== 200) {
|
||||||
|
throw new Error('未找到二维码记录');
|
||||||
|
}
|
||||||
|
|
||||||
|
// 2. 解析content获取enter_coil_no和current_coil_no
|
||||||
|
const qrcodeRecord = qrcodeRes.data;
|
||||||
|
const content = JSON.parse(qrcodeRecord.content);
|
||||||
|
const enterCoilNo = content.enter_coil_no;
|
||||||
|
const currentCoilNo = content.current_coil_no;
|
||||||
|
|
||||||
|
if (!enterCoilNo) {
|
||||||
|
throw new Error('二维码中未包含有效的入场钢卷号');
|
||||||
|
}
|
||||||
|
|
||||||
|
// 3. 通过追溯接口获取准确的钢卷信息
|
||||||
|
const traceRes = await getMaterialCoilTrace(enterCoilNo, currentCoilNo);
|
||||||
|
if (traceRes.code !== 200 || !traceRes.data || !traceRes.data.records || traceRes.data.records.length === 0) {
|
||||||
|
throw new Error('未找到钢卷信息');
|
||||||
|
}
|
||||||
|
|
||||||
|
// 4. 找到当前数据
|
||||||
|
let coilData = null;
|
||||||
|
for (const record of traceRes.data.records) {
|
||||||
|
if (record.dataType === 1 && record.currentCoilNo === currentCoilNo) {
|
||||||
|
coilData = record;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!coilData) {
|
||||||
|
for (const record of traceRes.data.records) {
|
||||||
|
if (record.dataType === 1) {
|
||||||
|
coilData = record;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!coilData) {
|
||||||
|
coilData = traceRes.data.records[0];
|
||||||
|
}
|
||||||
|
|
||||||
|
// 5. 检查是否已扫描过
|
||||||
|
const exists = this.scannedCoils.some(coil => coil.coilId === coilData.coilId);
|
||||||
|
if (exists) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '该钢卷已扫描',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.scannedCoils.push(coilData);
|
||||||
|
|
||||||
|
console.log('钢卷详情：', coilData);
|
||||||
|
uni.showToast({
|
||||||
|
title: `第 ${this.scannedCoils.length} 个钢卷扫描成功`,
|
||||||
|
icon: 'success'
|
||||||
|
});
|
||||||
|
} catch (err) {
|
||||||
|
console.error('扫码处理失败：', err);
|
||||||
|
uni.showToast({
|
||||||
|
title: err.message || '扫码信息解析失败',
|
||||||
|
icon: 'none',
|
||||||
|
duration: 2000
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
fail: (err) => {
|
||||||
|
console.error('扫码失败：', err);
|
||||||
|
uni.showToast({
|
||||||
|
title: '扫码失败，请重试',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// 移除钢卷
|
||||||
|
removeCoil(index) {
|
||||||
|
uni.showModal({
|
||||||
|
title: '确认移除',
|
||||||
|
content: '是否要移除此钢卷？',
|
||||||
|
success: (res) => {
|
||||||
|
if (res.confirm) {
|
||||||
|
this.scannedCoils.splice(index, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// 重置
|
||||||
|
handleReset() {
|
||||||
|
uni.showModal({
|
||||||
|
title: '确认重置',
|
||||||
|
content: '是否要清空所有已扫描的钢卷？',
|
||||||
|
success: (res) => {
|
||||||
|
if (res.confirm) {
|
||||||
|
this.scannedCoils = [];
|
||||||
|
this.mergedCoilNo = '';
|
||||||
|
this.team = '';
|
||||||
|
this.warehouseId = undefined;
|
||||||
|
this.warehouseName = '';
|
||||||
|
this.warehouseKeyword = '';
|
||||||
|
this.grossWeight = '';
|
||||||
|
this.netWeight = '';
|
||||||
|
this.showWarehouseList = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// 提交合卷
|
||||||
|
handleConfirm() {
|
||||||
|
// 验证
|
||||||
|
if (this.scannedCoils.length < 2) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '至少需要2个钢卷',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!this.mergedCoilNo) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '请输入新钢卷号',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!this.team) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '请输入班组名称',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.loading = true;
|
||||||
|
|
||||||
|
// 构建提交数据
|
||||||
|
// 根据后端逻辑：bo是合卷后的新钢卷，bo.newCoils是参与合卷的原始钢卷
|
||||||
|
const submitData = {
|
||||||
|
coilId: null, // 合卷时coilId为null
|
||||||
|
enterCoilNo: this.scannedCoils[0].enterCoilNo, // 使用第一个钢卷的入场号
|
||||||
|
supplierCoilNo: this.scannedCoils[0].supplierCoilNo, // 保留厂家原料卷号
|
||||||
|
currentCoilNo: this.mergedCoilNo,
|
||||||
|
team: this.team,
|
||||||
|
hasMergeSplit: 2, // 2表示合卷
|
||||||
|
itemType: this.scannedCoils[0].itemType,
|
||||||
|
itemId: this.scannedCoils[0].itemId,
|
||||||
|
warehouseId: this.warehouseId || this.scannedCoils[0].warehouseId, // 使用选择的库区或第一个钢卷的库区
|
||||||
|
grossWeight: this.grossWeight ? Number(this.grossWeight) : null,
|
||||||
|
netWeight: this.netWeight ? Number(this.netWeight) : null,
|
||||||
|
newCoils: this.scannedCoils.map(coil => ({
|
||||||
|
coilId: coil.coilId,
|
||||||
|
currentCoilNo: coil.currentCoilNo
|
||||||
|
}))
|
||||||
|
};
|
||||||
|
|
||||||
|
updateMaterialCoil(submitData).then(res => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '合卷成功',
|
||||||
|
icon: 'success'
|
||||||
|
});
|
||||||
|
setTimeout(() => {
|
||||||
|
this.handleReset();
|
||||||
|
}, 1500);
|
||||||
|
} else {
|
||||||
|
uni.showToast({
|
||||||
|
title: res.msg || '合卷失败',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}).catch(err => {
|
||||||
|
console.error('提交失败：', err);
|
||||||
|
uni.showToast({
|
||||||
|
title: '合卷失败，请重试',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
}).finally(() => {
|
||||||
|
this.loading = false;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style scoped lang="scss">
|
||||||
|
.merge-container {
|
||||||
|
padding-bottom: 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 扫码区域 */
|
||||||
|
.scan-section {
|
||||||
|
padding: 60rpx 40rpx;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||||
|
|
||||||
|
.scan-btn-wrapper {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 20rpx;
|
||||||
|
|
||||||
|
.scan-icon {
|
||||||
|
width: 160rpx;
|
||||||
|
height: 160rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: linear-gradient(135deg, #34c759 0%, #30b350 100%);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
box-shadow: 0 8rpx 24rpx rgba(52, 199, 89, 0.3);
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: scale(0.95);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-camera {
|
||||||
|
font-size: 70rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.scan-tip {
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
|
||||||
|
.scan-hint {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #34c759;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 钢卷列表 */
|
||||||
|
.coil-list {
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
padding: 30rpx;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-title {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 25rpx;
|
||||||
|
padding-bottom: 20rpx;
|
||||||
|
border-bottom: 1rpx solid #f0f0f0;
|
||||||
|
|
||||||
|
.title-dot {
|
||||||
|
width: 8rpx;
|
||||||
|
height: 28rpx;
|
||||||
|
background: #34c759;
|
||||||
|
border-radius: 4rpx;
|
||||||
|
margin-right: 12rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title-text {
|
||||||
|
flex: 1;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.coil-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
background: #f8f9fa;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
padding: 24rpx;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.coil-content {
|
||||||
|
display: flex;
|
||||||
|
flex: 1;
|
||||||
|
gap: 20rpx;
|
||||||
|
|
||||||
|
.coil-index {
|
||||||
|
width: 60rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
background: #34c759;
|
||||||
|
color: #fff;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.coil-info {
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
.coil-row {
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 8rpx;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.coil-label {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #666;
|
||||||
|
min-width: 150rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.coil-value {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #333;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.coil-remove {
|
||||||
|
width: 60rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
color: #ff4d4f;
|
||||||
|
font-size: 32rpx;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
opacity: 0.6;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 表单卡片 */
|
||||||
|
.form-card {
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
padding: 30rpx;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-item {
|
||||||
|
margin-bottom: 30rpx;
|
||||||
|
|
||||||
|
.form-label {
|
||||||
|
display: block;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333;
|
||||||
|
margin-bottom: 15rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: '*';
|
||||||
|
color: #ff4d4f;
|
||||||
|
margin-right: 6rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-label-optional {
|
||||||
|
display: block;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333;
|
||||||
|
margin-bottom: 15rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-input {
|
||||||
|
width: 100%;
|
||||||
|
height: 88rpx;
|
||||||
|
padding: 0 24rpx;
|
||||||
|
background: #f8f9fa;
|
||||||
|
border: 2rpx solid #e8e8e8;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333;
|
||||||
|
box-sizing: border-box;
|
||||||
|
transition: all 0.3s;
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
background: #fff;
|
||||||
|
border-color: #34c759;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.picker-input {
|
||||||
|
width: 100%;
|
||||||
|
height: 88rpx;
|
||||||
|
padding: 0 24rpx;
|
||||||
|
background: #f8f9fa;
|
||||||
|
border: 2rpx solid #e8e8e8;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
transition: all 0.3s;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
background: #fff;
|
||||||
|
border-color: #34c759;
|
||||||
|
}
|
||||||
|
|
||||||
|
.picker-text {
|
||||||
|
flex: 1;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333;
|
||||||
|
|
||||||
|
&.picker-placeholder {
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.picker-arrow {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #999;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 操作者信息 */
|
||||||
|
.operator-info {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 20rpx 0;
|
||||||
|
margin-top: 20rpx;
|
||||||
|
|
||||||
|
.operator-label {
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
|
||||||
|
.operator-name {
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #34c759;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 操作按钮 */
|
||||||
|
.action-buttons {
|
||||||
|
display: flex;
|
||||||
|
gap: 20rpx;
|
||||||
|
margin-top: 30rpx;
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
flex: 1;
|
||||||
|
height: 88rpx;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
font-size: 30rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
border: none;
|
||||||
|
transition: all 0.2s;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: scale(0.98);
|
||||||
|
}
|
||||||
|
|
||||||
|
&[disabled] {
|
||||||
|
opacity: 0.6;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-secondary {
|
||||||
|
background: #f5f5f5;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-primary {
|
||||||
|
background: linear-gradient(135deg, #34c759 0%, #30b350 100%);
|
||||||
|
color: #fff;
|
||||||
|
box-shadow: 0 4rpx 16rpx rgba(52, 199, 89, 0.3);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 提示卡片 */
|
||||||
|
.tip-card {
|
||||||
|
background: #fff3cd;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
padding: 30rpx;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
.tip-text {
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #856404;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 库区选择弹窗 */
|
||||||
|
.warehouse-popup {
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 24rpx 24rpx 0 0;
|
||||||
|
max-height: 70vh;
|
||||||
|
|
||||||
|
.popup-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 30rpx;
|
||||||
|
border-bottom: 1rpx solid #f0f0f0;
|
||||||
|
|
||||||
|
.popup-title {
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #333;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-close {
|
||||||
|
font-size: 40rpx;
|
||||||
|
color: #999;
|
||||||
|
width: 60rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-search {
|
||||||
|
padding: 20rpx 30rpx;
|
||||||
|
border-bottom: 1rpx solid #f0f0f0;
|
||||||
|
|
||||||
|
.search-input {
|
||||||
|
width: 100%;
|
||||||
|
height: 80rpx;
|
||||||
|
padding: 0 20rpx;
|
||||||
|
background: #f8f9fa;
|
||||||
|
border: 2rpx solid #e8e8e8;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
background: #fff;
|
||||||
|
border-color: #34c759;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-body {
|
||||||
|
max-height: 400rpx;
|
||||||
|
|
||||||
|
.warehouse-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 30rpx;
|
||||||
|
border-bottom: 1rpx solid #f5f5f5;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
background: #e8f5e8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.warehouse-name {
|
||||||
|
flex: 1;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.warehouse-check {
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #34c759;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.empty-tip {
|
||||||
|
text-align: center;
|
||||||
|
padding: 60rpx 0;
|
||||||
|
color: #999;
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
@@ -1,21 +1,852 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="">
|
<view class="trace-container">
|
||||||
|
<!-- 扫码或输入 -->
|
||||||
|
<view class="search-section">
|
||||||
|
<view class="search-card">
|
||||||
|
<view class="card-title">
|
||||||
|
<text class="title-dot"></text>
|
||||||
|
<text class="title-text">钢卷溯源</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 扫码按钮 -->
|
||||||
|
<view class="scan-btn" @click="handleScan">
|
||||||
|
<text class="scan-icon">📷</text>
|
||||||
|
<text class="scan-text">扫描二维码</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="divider">
|
||||||
|
<view class="divider-line"></view>
|
||||||
|
<text class="divider-text">或</text>
|
||||||
|
<view class="divider-line"></view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 输入框 -->
|
||||||
|
<view class="input-group">
|
||||||
|
<view class="input-item">
|
||||||
|
<text class="input-label">入场钢卷号</text>
|
||||||
|
<input
|
||||||
|
v-model="searchForm.enterCoilNo"
|
||||||
|
placeholder="请输入入场钢卷号"
|
||||||
|
class="input-field"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
<view class="input-item">
|
||||||
|
<text class="input-label-optional">当前钢卷号（可选）</text>
|
||||||
|
<input
|
||||||
|
v-model="searchForm.currentCoilNo"
|
||||||
|
placeholder="可输入当前钢卷号筛选"
|
||||||
|
class="input-field"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 查询按钮 -->
|
||||||
|
<button class="query-btn" @click="handleQuery" :disabled="loading">
|
||||||
|
{{ loading ? '查询中...' : '查询溯源' }}
|
||||||
|
</button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 溯源结果 -->
|
||||||
|
<view class="result-section" v-if="traceResult">
|
||||||
|
<!-- 二维码信息 -->
|
||||||
|
<view class="result-card">
|
||||||
|
<view class="card-title">
|
||||||
|
<text class="title-dot"></text>
|
||||||
|
<text class="title-text">二维码信息</text>
|
||||||
|
</view>
|
||||||
|
<view class="qrcode-info">
|
||||||
|
<view class="info-row">
|
||||||
|
<text class="info-label">主序列号：</text>
|
||||||
|
<text class="info-value">{{ (traceResult.qrcode && traceResult.qrcode.serialNumber) || '-' }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="info-row">
|
||||||
|
<text class="info-label">创建时间：</text>
|
||||||
|
<text class="info-value">{{ (traceResult.qrcode && traceResult.qrcode.createTime) || '-' }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="info-row" v-if="traceResult.all_qrcodes && traceResult.all_qrcodes.length > 1">
|
||||||
|
<text class="info-label">相关二维码：</text>
|
||||||
|
<text class="info-value">{{ traceResult.all_qrcodes.length }} 个</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 操作步骤 -->
|
||||||
|
<view class="result-card" v-if="traceResult.steps && traceResult.steps.length > 0">
|
||||||
|
<view class="card-title">
|
||||||
|
<text class="title-dot"></text>
|
||||||
|
<text class="title-text">操作步骤</text>
|
||||||
|
</view>
|
||||||
|
<view class="steps-timeline">
|
||||||
|
<view
|
||||||
|
class="step-item"
|
||||||
|
v-for="(step, index) in traceResult.steps"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
|
<view class="step-marker">
|
||||||
|
<view class="step-number">{{ step.display_step || step.step }}</view>
|
||||||
|
<view class="step-line" v-if="index < traceResult.steps.length - 1"></view>
|
||||||
|
</view>
|
||||||
|
<view class="step-content">
|
||||||
|
<view class="step-header">
|
||||||
|
<text class="step-action">{{ step.action }}</text>
|
||||||
|
<text class="step-operation" v-if="step.operation">{{ step.operation }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="step-details">
|
||||||
|
<view class="detail-row" v-if="step.current_coil_no">
|
||||||
|
<text class="detail-label">当前钢卷号：</text>
|
||||||
|
<text class="detail-value">{{ step.current_coil_no }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="detail-row" v-if="step.old_current_coil_no">
|
||||||
|
<text class="detail-label">原钢卷号：</text>
|
||||||
|
<text class="detail-value">{{ step.old_current_coil_no }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="detail-row" v-if="step.new_current_coil_no">
|
||||||
|
<text class="detail-label">新钢卷号：</text>
|
||||||
|
<text class="detail-value">{{ step.new_current_coil_no }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="detail-row" v-if="step.new_current_coil_nos">
|
||||||
|
<text class="detail-label">分卷列表：</text>
|
||||||
|
<view class="detail-value">
|
||||||
|
<view class="coil-tags">
|
||||||
|
<text
|
||||||
|
class="coil-tag coil-tag-split"
|
||||||
|
v-for="coilNo in step.new_current_coil_nos.split(',')"
|
||||||
|
:key="coilNo"
|
||||||
|
>
|
||||||
|
{{ coilNo.trim() }}
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="detail-row" v-if="step.parent_coil_nos">
|
||||||
|
<text class="detail-label">合卷来源：</text>
|
||||||
|
<view class="detail-value">
|
||||||
|
<view class="coil-tags">
|
||||||
|
<text
|
||||||
|
class="coil-tag coil-tag-merge"
|
||||||
|
v-for="coilNo in step.parent_coil_nos.split(',')"
|
||||||
|
:key="coilNo"
|
||||||
|
>
|
||||||
|
{{ coilNo.trim() }}
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="detail-row" v-if="step.child_coils && step.child_coils.length > 0">
|
||||||
|
<text class="detail-label">子钢卷：</text>
|
||||||
|
<view class="detail-value">
|
||||||
|
<view class="coil-tags">
|
||||||
|
<text
|
||||||
|
class="coil-tag coil-tag-child"
|
||||||
|
v-for="coilNo in step.child_coils"
|
||||||
|
:key="coilNo"
|
||||||
|
>
|
||||||
|
{{ coilNo }}
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="detail-row" v-if="step.qrcode_serial">
|
||||||
|
<text class="detail-label">二维码序列：</text>
|
||||||
|
<text class="detail-value">{{ step.qrcode_serial }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="detail-row" v-if="step.operator">
|
||||||
|
<text class="detail-label">操作者：</text>
|
||||||
|
<text class="detail-value">{{ step.operator }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 钢卷分支图 -->
|
||||||
|
<view class="result-card" v-if="traceResult.records && traceResult.records.length > 0">
|
||||||
|
<view class="card-title">
|
||||||
|
<text class="title-dot"></text>
|
||||||
|
<text class="title-text">钢卷分支图</text>
|
||||||
|
</view>
|
||||||
|
<view class="branch-view">
|
||||||
|
<view
|
||||||
|
class="branch-item"
|
||||||
|
v-for="(record, index) in groupedRecords"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
|
<view class="branch-header">
|
||||||
|
<view class="branch-type" :class="['branch-' + record.type, 'operation-' + record.groupColor]">
|
||||||
|
{{ record.title }}
|
||||||
|
</view>
|
||||||
|
<text class="branch-count">{{ record.coils.length }} 个钢卷</text>
|
||||||
|
</view>
|
||||||
|
<view class="branch-coils">
|
||||||
|
<view
|
||||||
|
class="coil-card"
|
||||||
|
v-for="coil in record.coils"
|
||||||
|
:key="coil.coilId"
|
||||||
|
>
|
||||||
|
<view class="coil-header">
|
||||||
|
<text class="coil-no">{{ coil.currentCoilNo }}</text>
|
||||||
|
<view class="coil-status" :class="'status-' + coil.dataType">
|
||||||
|
{{ coil.dataType === 1 ? '当前' : '历史' }}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="coil-info">
|
||||||
|
<text class="coil-detail">入场号：{{ coil.enterCoilNo }}</text>
|
||||||
|
<text class="coil-detail" v-if="coil.team">班组：{{ coil.team }}</text>
|
||||||
|
<text class="coil-detail" v-if="coil.warehouse">
|
||||||
|
库区：{{ coil.warehouse.warehouseName }}
|
||||||
|
</text>
|
||||||
|
<text class="coil-detail">{{ coil.createTime }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
<!-- 无记录提示 -->
|
||||||
|
<view class="empty-tip" v-if="!traceResult.records || traceResult.records.length === 0">
|
||||||
|
<text>未找到相关钢卷记录</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import { getGenerateRecord } from '@/api/wms/code.js'
|
||||||
|
import { getMaterialCoilTrace, getMaterialCoil } from '@/api/wms/coil.js'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
columns: [
|
searchForm: {
|
||||||
|
enterCoilNo: '',
|
||||||
|
currentCoilNo: ''
|
||||||
|
},
|
||||||
|
traceResult: null,
|
||||||
|
loading: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
]
|
computed: {
|
||||||
|
// 按时间线和分支关系分组钢卷记录
|
||||||
|
groupedRecords() {
|
||||||
|
if (!this.traceResult || !this.traceResult.records) {
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
|
||||||
|
const groups = [];
|
||||||
|
|
||||||
|
// 按创建时间排序所有记录
|
||||||
|
const sortedRecords = [...this.traceResult.records].sort((a, b) =>
|
||||||
|
new Date(a.createTime) - new Date(b.createTime)
|
||||||
|
);
|
||||||
|
|
||||||
|
// 按数据类型分组，但保持时间顺序
|
||||||
|
const currentCoils = sortedRecords.filter(record => record.dataType === 1);
|
||||||
|
const historyCoils = sortedRecords.filter(record => record.dataType === 0);
|
||||||
|
|
||||||
|
// 当前数据分组
|
||||||
|
if (currentCoils.length > 0) {
|
||||||
|
// 进一步按操作类型细分当前数据
|
||||||
|
const currentByOperation = this.groupByOperation(currentCoils);
|
||||||
|
groups.push(...currentByOperation);
|
||||||
|
}
|
||||||
|
|
||||||
|
// 历史数据分组
|
||||||
|
if (historyCoils.length > 0) {
|
||||||
|
// 进一步按操作类型细分历史数据
|
||||||
|
const historyByOperation = this.groupByOperation(historyCoils, true);
|
||||||
|
groups.push(...historyByOperation);
|
||||||
|
}
|
||||||
|
|
||||||
|
return groups;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
// 按操作类型分组
|
||||||
|
groupByOperation(records, isHistory = false) {
|
||||||
|
const operationGroups = {};
|
||||||
|
|
||||||
|
for (const record of records) {
|
||||||
|
let operationType = '原始数据';
|
||||||
|
let groupColor = 'default';
|
||||||
|
|
||||||
|
if (record.hasMergeSplit === 1) {
|
||||||
|
operationType = '分卷结果';
|
||||||
|
groupColor = 'split';
|
||||||
|
} else if (record.hasMergeSplit === 2) {
|
||||||
|
operationType = '合卷结果';
|
||||||
|
groupColor = 'merge';
|
||||||
|
}
|
||||||
|
|
||||||
|
const groupKey = operationType;
|
||||||
|
if (!operationGroups[groupKey]) {
|
||||||
|
operationGroups[groupKey] = {
|
||||||
|
operationType: operationType,
|
||||||
|
groupColor: groupColor,
|
||||||
|
coils: []
|
||||||
|
};
|
||||||
|
}
|
||||||
|
operationGroups[groupKey].coils.push(record);
|
||||||
|
}
|
||||||
|
|
||||||
|
// 转换为数组
|
||||||
|
const groups = [];
|
||||||
|
for (const key in operationGroups) {
|
||||||
|
const group = operationGroups[key];
|
||||||
|
groups.push({
|
||||||
|
type: isHistory ? 'history' : 'current',
|
||||||
|
operationType: group.operationType,
|
||||||
|
groupColor: group.groupColor,
|
||||||
|
title: `${group.operationType}${isHistory ? '（历史）' : '（当前）'}`,
|
||||||
|
coils: group.coils
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
return groups;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 扫码
|
||||||
|
handleScan() {
|
||||||
|
uni.scanCode({
|
||||||
|
success: async (res) => {
|
||||||
|
console.log('扫码结果：', res.result);
|
||||||
|
try {
|
||||||
|
const qrcodeId = res.result;
|
||||||
|
|
||||||
|
// 1. 获取二维码详情
|
||||||
|
const qrcodeRes = await getGenerateRecord(qrcodeId);
|
||||||
|
if (qrcodeRes.code !== 200) {
|
||||||
|
throw new Error('未找到二维码记录');
|
||||||
|
}
|
||||||
|
|
||||||
|
// 2. 解析content获取coil_id
|
||||||
|
const qrcodeRecord = qrcodeRes.data;
|
||||||
|
const content = JSON.parse(qrcodeRecord.content);
|
||||||
|
const coilId = content.coil_id;
|
||||||
|
|
||||||
|
if (!coilId || coilId === 'null' || coilId === 'undefined') {
|
||||||
|
throw new Error('二维码中未包含有效的钢卷ID');
|
||||||
|
}
|
||||||
|
|
||||||
|
// 3. 查询钢卷详情获取enterCoilNo
|
||||||
|
const coilRes = await getMaterialCoil(coilId);
|
||||||
|
if (coilRes.code !== 200 || !coilRes.data) {
|
||||||
|
throw new Error('未找到钢卷信息');
|
||||||
|
}
|
||||||
|
|
||||||
|
const coilData = coilRes.data;
|
||||||
|
this.searchForm.enterCoilNo = coilData.enterCoilNo;
|
||||||
|
this.searchForm.currentCoilNo = '';
|
||||||
|
|
||||||
|
// 4. 自动查询溯源
|
||||||
|
this.handleQuery();
|
||||||
|
} catch (err) {
|
||||||
|
console.error('扫码处理失败：', err);
|
||||||
|
uni.showToast({
|
||||||
|
title: err.message || '扫码信息解析失败',
|
||||||
|
icon: 'none',
|
||||||
|
duration: 2000
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
fail: (err) => {
|
||||||
|
console.error('扫码失败：', err);
|
||||||
|
uni.showToast({
|
||||||
|
title: '扫码失败，请重试',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// 查询溯源
|
||||||
|
handleQuery() {
|
||||||
|
// 验证
|
||||||
|
if (!this.searchForm.enterCoilNo) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '请输入或扫描入场钢卷号',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.loading = true;
|
||||||
|
|
||||||
|
getMaterialCoilTrace(
|
||||||
|
this.searchForm.enterCoilNo,
|
||||||
|
this.searchForm.currentCoilNo || undefined
|
||||||
|
).then(res => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.traceResult = res.data;
|
||||||
|
console.log('溯源结果：', this.traceResult);
|
||||||
|
|
||||||
|
if (!this.traceResult.records || this.traceResult.records.length === 0) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '未找到相关记录',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
uni.showToast({
|
||||||
|
title: '查询成功',
|
||||||
|
icon: 'success'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
uni.showToast({
|
||||||
|
title: res.msg || '查询失败',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}).catch(err => {
|
||||||
|
console.error('查询失败：', err);
|
||||||
|
uni.showToast({
|
||||||
|
title: '查询失败，请重试',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
}).finally(() => {
|
||||||
|
this.loading = false;
|
||||||
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style scoped lang="scss">
|
||||||
|
.trace-container {
|
||||||
|
padding-bottom: 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 搜索区域 */
|
||||||
|
.search-section {
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search-card {
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
padding: 30rpx;
|
||||||
|
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-title {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 25rpx;
|
||||||
|
padding-bottom: 20rpx;
|
||||||
|
border-bottom: 1rpx solid #f0f0f0;
|
||||||
|
|
||||||
|
.title-dot {
|
||||||
|
width: 8rpx;
|
||||||
|
height: 28rpx;
|
||||||
|
background: #5856d6;
|
||||||
|
border-radius: 4rpx;
|
||||||
|
margin-right: 12rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title-text {
|
||||||
|
flex: 1;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 扫码按钮 */
|
||||||
|
.scan-btn {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 20rpx;
|
||||||
|
height: 100rpx;
|
||||||
|
background: linear-gradient(135deg, #5856d6 0%, #4840c4 100%);
|
||||||
|
border-radius: 12rpx;
|
||||||
|
color: #fff;
|
||||||
|
box-shadow: 0 4rpx 12rpx rgba(88, 86, 214, 0.3);
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: scale(0.98);
|
||||||
|
}
|
||||||
|
|
||||||
|
.scan-icon {
|
||||||
|
font-size: 40rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.scan-text {
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 分割线 */
|
||||||
|
.divider {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin: 30rpx 0;
|
||||||
|
|
||||||
|
.divider-line {
|
||||||
|
flex: 1;
|
||||||
|
height: 1rpx;
|
||||||
|
background: #e8e8e8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.divider-text {
|
||||||
|
padding: 0 20rpx;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 输入组 */
|
||||||
|
.input-group {
|
||||||
|
.input-item {
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-label,
|
||||||
|
.input-label-optional {
|
||||||
|
display: block;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #333;
|
||||||
|
margin-bottom: 12rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-label::before {
|
||||||
|
content: '*';
|
||||||
|
color: #ff4d4f;
|
||||||
|
margin-right: 6rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-field {
|
||||||
|
width: 100%;
|
||||||
|
height: 80rpx;
|
||||||
|
padding: 0 20rpx;
|
||||||
|
background: #f8f9fa;
|
||||||
|
border: 2rpx solid #e8e8e8;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
background: #fff;
|
||||||
|
border-color: #5856d6;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 查询按钮 */
|
||||||
|
.query-btn {
|
||||||
|
width: 100%;
|
||||||
|
height: 88rpx;
|
||||||
|
margin-top: 30rpx;
|
||||||
|
background: linear-gradient(135deg, #5856d6 0%, #4840c4 100%);
|
||||||
|
color: #fff;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
font-size: 30rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
border: none;
|
||||||
|
box-shadow: 0 4rpx 16rpx rgba(88, 86, 214, 0.3);
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: scale(0.98);
|
||||||
|
}
|
||||||
|
|
||||||
|
&[disabled] {
|
||||||
|
opacity: 0.6;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 结果区域 */
|
||||||
|
.result-section {
|
||||||
|
.result-card {
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
padding: 30rpx;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 二维码信息 */
|
||||||
|
.qrcode-info {
|
||||||
|
.info-row {
|
||||||
|
display: flex;
|
||||||
|
padding: 20rpx 0;
|
||||||
|
border-bottom: 1rpx solid #f5f5f5;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-label {
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #666;
|
||||||
|
min-width: 150rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-value {
|
||||||
|
flex: 1;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #333;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 步骤时间线 */
|
||||||
|
.steps-timeline {
|
||||||
|
.step-item {
|
||||||
|
display: flex;
|
||||||
|
gap: 20rpx;
|
||||||
|
|
||||||
|
.step-marker {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.step-number {
|
||||||
|
width: 60rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
background: #5856d6;
|
||||||
|
color: #fff;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.step-line {
|
||||||
|
width: 2rpx;
|
||||||
|
flex: 1;
|
||||||
|
background: #e8e8e8;
|
||||||
|
margin: 10rpx 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.step-content {
|
||||||
|
flex: 1;
|
||||||
|
padding-bottom: 30rpx;
|
||||||
|
|
||||||
|
.step-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 15rpx;
|
||||||
|
margin-bottom: 15rpx;
|
||||||
|
|
||||||
|
.step-action {
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.step-operation {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #fff;
|
||||||
|
background: #5856d6;
|
||||||
|
padding: 4rpx 16rpx;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.step-details {
|
||||||
|
background: #f8f9fa;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
padding: 20rpx;
|
||||||
|
|
||||||
|
.detail-row {
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 10rpx;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail-label {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #666;
|
||||||
|
min-width: 140rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail-value {
|
||||||
|
flex: 1;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #333;
|
||||||
|
word-break: break-all;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.coil-tags {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 10rpx;
|
||||||
|
|
||||||
|
.coil-tag {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 6rpx 16rpx;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
font-size: 22rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
|
||||||
|
&.coil-tag-split {
|
||||||
|
background: #fff3e0;
|
||||||
|
color: #ff9500;
|
||||||
|
border: 1rpx solid #ffd591;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.coil-tag-merge {
|
||||||
|
background: #e8f5e8;
|
||||||
|
color: #34c759;
|
||||||
|
border: 1rpx solid #95de64;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.coil-tag-child {
|
||||||
|
background: #f0f7ff;
|
||||||
|
color: #007aff;
|
||||||
|
border: 1rpx solid #91d5ff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 分支视图 */
|
||||||
|
.branch-view {
|
||||||
|
.branch-item {
|
||||||
|
margin-bottom: 30rpx;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.branch-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
padding: 15rpx 20rpx;
|
||||||
|
background: #f8f9fa;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
|
||||||
|
.branch-type {
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
padding: 4rpx 16rpx;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
|
||||||
|
&.branch-current {
|
||||||
|
background: #d1f2eb;
|
||||||
|
color: #0c6957;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.branch-history {
|
||||||
|
background: #f8d7da;
|
||||||
|
color: #721c24;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.operation-split {
|
||||||
|
background: #fff3e0;
|
||||||
|
color: #ff9500;
|
||||||
|
border: 1rpx solid #ffd591;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.operation-merge {
|
||||||
|
background: #e8f5e8;
|
||||||
|
color: #34c759;
|
||||||
|
border: 1rpx solid #95de64;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.operation-default {
|
||||||
|
background: #f0f7ff;
|
||||||
|
color: #007aff;
|
||||||
|
border: 1rpx solid #91d5ff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.branch-count {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.branch-coils {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 15rpx;
|
||||||
|
|
||||||
|
.coil-card {
|
||||||
|
flex: 1;
|
||||||
|
min-width: 300rpx;
|
||||||
|
background: #fff;
|
||||||
|
border: 2rpx solid #e8e8e8;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
padding: 20rpx;
|
||||||
|
|
||||||
|
.coil-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-bottom: 15rpx;
|
||||||
|
|
||||||
|
.coil-no {
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.coil-status {
|
||||||
|
font-size: 20rpx;
|
||||||
|
padding: 4rpx 12rpx;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
|
||||||
|
&.status-1 {
|
||||||
|
background: #d1f2eb;
|
||||||
|
color: #0c6957;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.status-0 {
|
||||||
|
background: #f8d7da;
|
||||||
|
color: #721c24;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.coil-info {
|
||||||
|
.coil-detail {
|
||||||
|
display: block;
|
||||||
|
font-size: 22rpx;
|
||||||
|
color: #666;
|
||||||
|
margin-bottom: 8rpx;
|
||||||
|
line-height: 1.4;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 空提示 */
|
||||||
|
.empty-tip {
|
||||||
|
text-align: center;
|
||||||
|
padding: 80rpx 0;
|
||||||
|
color: #999;
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
File diff suppressed because it is too large
Load Diff
@@ -1,6 +1,6 @@
|
|||||||
// 应用全局配置
|
// 应用全局配置
|
||||||
module.exports = {
|
module.exports = {
|
||||||
baseUrl: 'http://140.143.206.120/prod-api',
|
baseUrl: 'http://192.168.31.116:8080',
|
||||||
// baseUrl: 'http://localhost:8080',
|
// baseUrl: 'http://localhost:8080',
|
||||||
// 应用信息
|
// 应用信息
|
||||||
appInfo: {
|
appInfo: {
|
||||||
|
|||||||
@@ -1,5 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="content">
|
<view class="industrial-content">
|
||||||
|
|
||||||
<!-- 标签栏 -->
|
<!-- 标签栏 -->
|
||||||
<view class="tab-container">
|
<view class="tab-container">
|
||||||
<view
|
<view
|
||||||
@@ -9,11 +10,12 @@
|
|||||||
class="tab-item"
|
class="tab-item"
|
||||||
:class="{ 'tab-active': currentTab === item.value }"
|
:class="{ 'tab-active': currentTab === item.value }"
|
||||||
>
|
>
|
||||||
{{ item.label }}
|
<text class="tab-label">{{ item.label }}</text>
|
||||||
|
<view class="tab-indicator" v-if="currentTab === item.value"></view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- 动态组件区域 - 根据当前标签显示对应组件 -->
|
<!-- 动态组件区域 -->
|
||||||
<view class="component-container">
|
<view class="component-container">
|
||||||
<component
|
<component
|
||||||
:is="currentComponent"
|
:is="currentComponent"
|
||||||
@@ -23,151 +25,160 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import ApartVue from '@/components/panels/code/apart.vue'
|
import ApartVue from '@/components/panels/code/apart.vue'
|
||||||
import MergeVue from '@/components/panels/code/merge.vue'
|
import MergeVue from '@/components/panels/code/merge.vue'
|
||||||
import TraceVue from '@/components/panels/code/trace.vue'
|
import TraceVue from '@/components/panels/code/trace.vue'
|
||||||
import TypingVue from '@/components/panels/code/typing.vue'
|
import TypingVue from '@/components/panels/code/typing.vue'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
scanResult: null, // 扫码结果（传递给组件）
|
scanResult: null,
|
||||||
currentTime: '', // 扫码时间（传递给组件）
|
currentTime: '',
|
||||||
recordId: undefined,
|
recordId: undefined,
|
||||||
codeStatus: undefined,
|
codeStatus: undefined,
|
||||||
remark: '',
|
remark: '',
|
||||||
currentTab: 'typing', // 当前激活的标签
|
currentTab: 'typing',
|
||||||
tabs: [
|
tabs: [
|
||||||
{ label: '录入', value: 'typing' },
|
{ label: '录入', value: 'typing' },
|
||||||
{ label: '分卷', value: 'apart' },
|
{ label: '分卷', value: 'apart' },
|
||||||
// { label: '合卷', value: 'merge' },
|
{ label: '合卷', value: 'merge' },
|
||||||
{ label: '追溯', value: 'trace' }
|
{ label: '追溯', value: 'trace' }
|
||||||
]
|
]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
TypingVue,
|
||||||
|
ApartVue,
|
||||||
|
MergeVue,
|
||||||
|
TraceVue
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
username() {
|
||||||
|
return this.$store.state.user.name
|
||||||
|
},
|
||||||
|
avatar() {
|
||||||
|
return this.$store.state.user.avatar
|
||||||
|
},
|
||||||
|
windowHeight() {
|
||||||
|
return uni.getSystemInfoSync().windowHeight - 50
|
||||||
|
},
|
||||||
|
currentComponent() {
|
||||||
|
const componentMap = {
|
||||||
|
'typing': 'TypingVue',
|
||||||
|
'apart': 'ApartVue',
|
||||||
|
'merge': 'MergeVue',
|
||||||
|
'trace': 'TraceVue'
|
||||||
};
|
};
|
||||||
},
|
return componentMap[this.currentTab] || 'TypingVue';
|
||||||
components: {
|
}
|
||||||
ApartVue,
|
},
|
||||||
MergeVue,
|
|
||||||
TraceVue,
|
|
||||||
TypingVue
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
username() {
|
|
||||||
return this.$store.state.user.name
|
|
||||||
},
|
|
||||||
avatar() {
|
|
||||||
return this.$store.state.user.avatar
|
|
||||||
},
|
|
||||||
windowHeight() {
|
|
||||||
return uni.getSystemInfoSync().windowHeight - 50
|
|
||||||
},
|
|
||||||
// 根据当前标签计算要显示的组件
|
|
||||||
currentComponent() {
|
|
||||||
// 转换为组件名（如 'typing' -> 'TypingVue'）
|
|
||||||
return this.currentTab.charAt(0).toUpperCase() + this.currentTab.slice(1) + 'Vue'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
onLoad() {
|
onLoad() {
|
||||||
uni.setNavigationBarTitle({
|
uni.setNavigationBarTitle({
|
||||||
title: '扫码（' + this.username + '）',
|
title: '扫码（' + this.username + '）',
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
// 切换标签
|
// 切换标签
|
||||||
switchTab(tabValue) {
|
switchTab(tabValue) {
|
||||||
this.currentTab = tabValue
|
this.currentTab = tabValue
|
||||||
},
|
|
||||||
|
|
||||||
// 处理确认录入
|
|
||||||
handleConfirm() {
|
|
||||||
if (!this.scanResult && this.currentTab !== 'trace') {
|
|
||||||
uni.showToast({
|
|
||||||
title: '请先扫码获取信息',
|
|
||||||
icon: 'none'
|
|
||||||
})
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
// 这里添加确认录入的逻辑
|
|
||||||
console.log('确认录入信息：', {
|
|
||||||
tab: this.currentTab,
|
|
||||||
scanResult: this.scanResult,
|
|
||||||
currentTime: this.currentTime,
|
|
||||||
recordId: this.recordId,
|
|
||||||
codeStatus: this.codeStatus,
|
|
||||||
remark: this.remark,
|
|
||||||
operator: this.username
|
|
||||||
})
|
|
||||||
|
|
||||||
uni.showToast({
|
|
||||||
title: '录入成功',
|
|
||||||
icon: 'success'
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style scoped lang="scss">
|
||||||
/* 父页面样式：保留原有样式，新增标签栏样式 */
|
.industrial-content {
|
||||||
.content {
|
min-height: 100vh;
|
||||||
display: flex;
|
background: #f6f6f6;
|
||||||
flex-direction: column;
|
padding-bottom: 30rpx;
|
||||||
align-items: center;
|
}
|
||||||
justify-content: flex-start;
|
|
||||||
padding: 20rpx;
|
|
||||||
min-height: 100vh;
|
|
||||||
background-color: #f5f5f5;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 标签栏容器 */
|
/* 顶部装饰 */
|
||||||
.tab-container {
|
.header-decoration {
|
||||||
display: flex;
|
display: flex;
|
||||||
width: 100%;
|
align-items: center;
|
||||||
background-color: #fff;
|
justify-content: center;
|
||||||
border-radius: 10rpx;
|
padding: 40rpx 30rpx 30rpx;
|
||||||
overflow: hidden;
|
margin-bottom: 20rpx;
|
||||||
margin-bottom: 30rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 标签项样式 */
|
.decorative-text {
|
||||||
.tab-item {
|
font-size: 28rpx;
|
||||||
flex: 1;
|
|
||||||
text-align: center;
|
|
||||||
padding: 25rpx 0;
|
|
||||||
font-size: 32rpx;
|
|
||||||
color: #666;
|
|
||||||
position: relative;
|
|
||||||
transition: all 0.3s;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 激活标签样式 */
|
|
||||||
.tab-active {
|
|
||||||
color: #007aff;
|
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
|
color: #333;
|
||||||
|
letter-spacing: 2rpx;
|
||||||
|
padding: 0 30rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 激活标签下划线 */
|
.decorative-line {
|
||||||
.tab-active::after {
|
height: 2rpx;
|
||||||
content: '';
|
background: linear-gradient(90deg, transparent, #ddd, transparent);
|
||||||
|
flex: 1;
|
||||||
|
max-width: 100rpx;
|
||||||
|
|
||||||
|
&.line-left {
|
||||||
|
background: linear-gradient(90deg, transparent, #ddd);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.line-right {
|
||||||
|
background: linear-gradient(90deg, #ddd, transparent);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 简约标签栏 */
|
||||||
|
.tab-container {
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
background: #fff;
|
||||||
|
padding: 0 20rpx;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
position: relative;
|
||||||
|
border-bottom: 1rpx solid #e8e8e8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-item {
|
||||||
|
flex: 1;
|
||||||
|
text-align: center;
|
||||||
|
padding: 30rpx 0;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
|
||||||
|
.tab-label {
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #666;
|
||||||
|
font-weight: 400;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.tab-active {
|
||||||
|
.tab-label {
|
||||||
|
color: #007aff;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-indicator {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
left: 0;
|
left: 50%;
|
||||||
width: 100%;
|
transform: translateX(-50%);
|
||||||
height: 6rpx;
|
width: 50rpx;
|
||||||
background-color: #007aff;
|
height: 4rpx;
|
||||||
border-radius: 3rpx 3rpx 0 0;
|
background: #007aff;
|
||||||
|
border-radius: 2rpx;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/* 组件容器样式 */
|
/* 组件容器 */
|
||||||
.component-container {
|
.component-container {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
min-height: 400rpx;
|
min-height: 400rpx;
|
||||||
background-color: #fff;
|
padding: 0 30rpx;
|
||||||
border-radius: 10rpx;
|
}
|
||||||
padding: 30rpx;
|
|
||||||
margin-bottom: 40rpx;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
@@ -1,8 +1,9 @@
|
|||||||
<template>
|
<template>
|
||||||
<view>
|
<view class="production-page">
|
||||||
<klp-header @lineChange="setActive"></klp-header>
|
|
||||||
|
|
||||||
<view class="">
|
<klp-header @lineChange="setActive" class="line-header"></klp-header>
|
||||||
|
|
||||||
|
<view class="content-wrapper">
|
||||||
<Acidity v-if="active == 0"/>
|
<Acidity v-if="active == 0"/>
|
||||||
<Paint v-else-if="active == 1"/>
|
<Paint v-else-if="active == 1"/>
|
||||||
<Zinc1 v-else-if="active == 2"></Zinc1>
|
<Zinc1 v-else-if="active == 2"></Zinc1>
|
||||||
@@ -13,36 +14,84 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import Acidity from '@/components/lines/acidity.vue'
|
import Acidity from '@/components/lines/acidity.vue'
|
||||||
import Paint from '@/components/lines/paint.vue'
|
import Paint from '@/components/lines/paint.vue'
|
||||||
import Zinc1 from '@/components/lines/zinc1.vue'
|
import Zinc1 from '@/components/lines/zinc1.vue'
|
||||||
import Zinc2 from '@/components/lines/zinc2.vue'
|
import Zinc2 from '@/components/lines/zinc2.vue'
|
||||||
import Zinc3 from '@/components/lines/zinc3.vue'
|
import Zinc3 from '@/components/lines/zinc3.vue'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
Acidity,
|
Acidity,
|
||||||
Paint,
|
Paint,
|
||||||
Zinc1,
|
Zinc1,
|
||||||
Zinc2,
|
Zinc2,
|
||||||
Zinc3
|
Zinc3
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
active: 0
|
active: 0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
next() {
|
||||||
|
if (this.active >= 5) {
|
||||||
|
this.active = 0
|
||||||
|
} else {
|
||||||
|
this.active += 1
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
setActive({ index, line }) {
|
||||||
next() {
|
this.active = index;
|
||||||
if (this.active >= 5) {
|
|
||||||
this.active = 0
|
|
||||||
} else {
|
|
||||||
this.active += 1
|
|
||||||
}
|
|
||||||
},
|
|
||||||
setActive({ index, line }) {
|
|
||||||
this.active = index;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.production-page {
|
||||||
|
min-height: 100vh;
|
||||||
|
background: #f6f6f6;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 顶部装饰 */
|
||||||
|
.page-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 40rpx 30rpx 20rpx;
|
||||||
|
background: #fff;
|
||||||
|
border-bottom: 1rpx solid #e8e8e8;
|
||||||
|
|
||||||
|
.header-title {
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333;
|
||||||
|
letter-spacing: 2rpx;
|
||||||
|
padding: 0 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-line {
|
||||||
|
height: 2rpx;
|
||||||
|
background: linear-gradient(90deg, transparent, #ddd, transparent);
|
||||||
|
flex: 1;
|
||||||
|
max-width: 100rpx;
|
||||||
|
|
||||||
|
&.line-left {
|
||||||
|
background: linear-gradient(90deg, transparent, #ddd);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.line-right {
|
||||||
|
background: linear-gradient(90deg, #ddd, transparent);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-header {
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper {
|
||||||
|
padding: 20rpx;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
@@ -79,7 +79,7 @@
|
|||||||
</view>
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|||||||
@@ -30,7 +30,6 @@ function getIgnoredVersion() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function setIgnoredVersion(version) {
|
function setIgnoredVersion(version) {
|
||||||
uni.setStorageSync('ignoredVersion', version);
|
|
||||||
console.log('已设置忽略版本:', version);
|
console.log('已设置忽略版本:', version);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user