将coilId的存储模式改成string
This commit is contained in:
@@ -1,5 +1,6 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<view class="industrial-content">
|
||||
|
||||
<!-- 标签栏 -->
|
||||
<view class="tab-container">
|
||||
<view
|
||||
@@ -9,11 +10,12 @@
|
||||
class="tab-item"
|
||||
: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 class="component-container">
|
||||
<component
|
||||
:is="currentComponent"
|
||||
@@ -23,151 +25,160 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ApartVue from '@/components/panels/code/apart.vue'
|
||||
import MergeVue from '@/components/panels/code/merge.vue'
|
||||
import TraceVue from '@/components/panels/code/trace.vue'
|
||||
import TypingVue from '@/components/panels/code/typing.vue'
|
||||
import ApartVue from '@/components/panels/code/apart.vue'
|
||||
import MergeVue from '@/components/panels/code/merge.vue'
|
||||
import TraceVue from '@/components/panels/code/trace.vue'
|
||||
import TypingVue from '@/components/panels/code/typing.vue'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
scanResult: null, // 扫码结果（传递给组件）
|
||||
currentTime: '', // 扫码时间（传递给组件）
|
||||
recordId: undefined,
|
||||
codeStatus: undefined,
|
||||
remark: '',
|
||||
currentTab: 'typing', // 当前激活的标签
|
||||
tabs: [
|
||||
{ label: '录入', value: 'typing' },
|
||||
{ label: '分卷', value: 'apart' },
|
||||
// { label: '合卷', value: 'merge' },
|
||||
{ label: '追溯', value: 'trace' }
|
||||
]
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
scanResult: null,
|
||||
currentTime: '',
|
||||
recordId: undefined,
|
||||
codeStatus: undefined,
|
||||
remark: '',
|
||||
currentTab: 'typing',
|
||||
tabs: [
|
||||
{ label: '录入', value: 'typing' },
|
||||
{ label: '分卷', value: 'apart' },
|
||||
{ label: '合卷', value: 'merge' },
|
||||
{ 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'
|
||||
};
|
||||
},
|
||||
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() {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '扫码（' + this.username + '）',
|
||||
});
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 切换标签
|
||||
switchTab(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'
|
||||
})
|
||||
}
|
||||
return componentMap[this.currentTab] || 'TypingVue';
|
||||
}
|
||||
},
|
||||
|
||||
onLoad() {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '扫码（' + this.username + '）',
|
||||
});
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 切换标签
|
||||
switchTab(tabValue) {
|
||||
this.currentTab = tabValue
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 父页面样式：保留原有样式，新增标签栏样式 */
|
||||
.content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
padding: 20rpx;
|
||||
min-height: 100vh;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
<style scoped lang="scss">
|
||||
.industrial-content {
|
||||
min-height: 100vh;
|
||||
background: #f6f6f6;
|
||||
padding-bottom: 30rpx;
|
||||
}
|
||||
|
||||
/* 标签栏容器 */
|
||||
.tab-container {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
border-radius: 10rpx;
|
||||
overflow: hidden;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
/* 标签项样式 */
|
||||
.tab-item {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
padding: 25rpx 0;
|
||||
font-size: 32rpx;
|
||||
color: #666;
|
||||
position: relative;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
|
||||
/* 激活标签样式 */
|
||||
.tab-active {
|
||||
color: #007aff;
|
||||
/* 顶部装饰 */
|
||||
.header-decoration {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 40rpx 30rpx 30rpx;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.decorative-text {
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
letter-spacing: 2rpx;
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
|
||||
.decorative-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);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 激活标签下划线 */
|
||||
.tab-active::after {
|
||||
content: '';
|
||||
/* 简约标签栏 */
|
||||
.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;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 6rpx;
|
||||
background-color: #007aff;
|
||||
border-radius: 3rpx 3rpx 0 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 50rpx;
|
||||
height: 4rpx;
|
||||
background: #007aff;
|
||||
border-radius: 2rpx;
|
||||
}
|
||||
}
|
||||
|
||||
/* 组件容器样式 */
|
||||
.component-container {
|
||||
width: 100%;
|
||||
min-height: 400rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 10rpx;
|
||||
padding: 30rpx;
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
</style>
|
||||
/* 组件容器 */
|
||||
.component-container {
|
||||
width: 100%;
|
||||
min-height: 400rpx;
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user