添加web的合卷分卷合并操作

This commit is contained in:
2025-11-03 17:03:02 +08:00
parent 42d858bc6b
commit 610ca8f2d8
4 changed files with 279 additions and 65 deletions

View File

@@ -2,8 +2,8 @@
<view class="page-container">
<!-- 简洁标签栏 -->
<view class="tab-container">
<view
v-for="item in tabData"
<view
v-for="item in tabData"
:key="item.value"
@click="currentTab = item.value"
class="tab-item"
@@ -13,24 +13,24 @@
<view class="tab-indicator" v-if="currentTab === item.value"></view>
</view>
</view>
<!-- 刷新按钮 -->
<view class="refresh-btn-fixed" @click="refreshData">
<text class="refresh-icon" :class="{ 'rotating': isRefreshing }"></text>
</view>
</view>
<scroll-view scroll-y class="scroll-container" v-if="currentTab === 1">
<!-- 顶部状态栏 -->
<view class="status-bar">
<view class="status-item">
<text class="status-label">网络状态</text>
<text class="status-value" :class="'status-' + webStatus[0].value">{{ webStatus[0].value }}</text>
</view>
</view>
<view class="status-divider"></view>
<view class="status-item">
<text class="status-label">当前班组</text>
<text class="status-value">{{ webStatus[1].value }}</text>
</view>
</view>
<view class="status-divider"></view>
<view class="status-item">
<text class="status-label">更新时间</text>
@@ -46,9 +46,9 @@
<text class="metric-name">{{ item.label }}</text>
<text class="metric-value">{{ item.value }}</text>
<text class="metric-unit">{{ item.unit }}</text>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 机架压下率 -->
<view class="section">
@@ -58,17 +58,17 @@
<text class="metric-name">{{ item.label }}</text>
<text class="metric-value">{{ item.value }}</text>
<text class="metric-unit">{{ item.unit }}</text>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 轧制力趋势 -->
<view class="section">
<view class="section-title">轧制力趋势</view>
<view class="chart-box">
<qiun-data-charts type="line" :chartData="forceChartData" :opts="lineChartOpts" />
</view>
</view>
</view>
</view>
<!-- 带钢张力 -->
<view class="section">
@@ -78,8 +78,8 @@
<text class="metric-name">{{ item.label }}</text>
<text class="metric-value">{{ item.value }}</text>
<text class="metric-unit">{{ item.unit }}</text>
</view>
</view>
</view>
</view>
</view>
<!-- 功率百分比 -->
@@ -90,8 +90,8 @@
<text class="metric-name">{{ item.label }}</text>
<text class="metric-value">{{ item.value }}</text>
<text class="metric-unit">{{ item.unit }}</text>
</view>
</view>
</view>
</view>
</view>
</scroll-view>
@@ -173,7 +173,7 @@ export default {
color: ["#0066cc", "#409eff", "#66b1ff", "#a0cfff", "#d9ecff", "#ecf5ff"],
padding: [15, 15, 0, 15],
enableScroll: false,
legend: {
legend: {
show: true,
position: "top",
fontSize: 10,
@@ -208,42 +208,42 @@ export default {
plantStateDefines: []
};
},
mounted() {
this.loadAllData()
this.startAutoRefresh()
},
beforeDestroy() {
this.stopAutoRefresh()
},
methods: {
startAutoRefresh() {
this.refreshTimer = setInterval(() => {
this.refreshData(true)
}, 30000)
},
stopAutoRefresh() {
if (this.refreshTimer) {
clearInterval(this.refreshTimer)
this.refreshTimer = null
}
},
loadAllData() {
this.checkNetworkStatus()
this.loadCurrentShift()
this.initPlantStateDefines()
this.updateLastTime()
},
refreshData(isSilent = false) {
if (this.isRefreshing) return
this.isRefreshing = true
if (!isSilent) uni.showLoading({ title: '刷新中' })
Promise.all([
this.checkNetworkStatus(),
this.loadCurrentShift(),
@@ -257,7 +257,7 @@ export default {
this.updateLastTime()
})
},
updateLastTime() {
const now = new Date()
const hour = String(now.getHours()).padStart(2, '0')
@@ -265,7 +265,7 @@ export default {
const second = String(now.getSeconds()).padStart(2, '0')
this.lastUpdateTime = `${hour}:${minute}:${second}`
},
checkNetworkStatus() {
return new Promise((resolve) => {
const startTime = Date.now()
@@ -291,7 +291,7 @@ export default {
})
})
},
loadCurrentShift() {
return getCurrentShift().then(response => {
if (response.code === 200 && response.data) {
@@ -304,20 +304,20 @@ export default {
console.error('加载班组信息失败:', error)
})
},
getShiftName(shift) {
const shiftMap = { 'A': '早班', 'B': '中班', 'C': '晚班' }
return shiftMap[shift] || shift || '—'
},
getCrewName(crew) {
const crewMap = { 1: '甲', 2: '乙', 3: '丙', 4: '丁' }
return crewMap[crew] || crew || '—'
},
initPlantStateDefines(isSilent = false) {
if (!isSilent) uni.showLoading({ title: '加载中' })
return getAllPlantStateDefines().then(response => {
if (response.code === 200 && response.data) {
this.plantStateDefines = response.data
@@ -332,7 +332,7 @@ export default {
console.error('加载状态定义失败:', error)
})
},
updateCurrentMetrics() {
// 1. 轧辊速度ID=36-41rollSpeed1-6
this.rollSpeedMetrics = [
@@ -343,7 +343,7 @@ export default {
{ label: '5#机架', value: this.formatValue(this.getDefineById(40)?.currentValue), unit: this.getDefineById(40)?.units || 'm/min' },
{ label: '6#机架', value: this.formatValue(this.getDefineById(41)?.currentValue), unit: this.getDefineById(41)?.units || 'm/min' }
]
// 2. 机架压下率ID=24-29reduc1-6
this.reducMetrics = [
{ label: '1#机架', value: this.formatValue(this.getDefineById(24)?.currentValue), unit: this.getDefineById(24)?.units || '%' },
@@ -353,7 +353,7 @@ export default {
{ label: '5#机架', value: this.formatValue(this.getDefineById(28)?.currentValue), unit: this.getDefineById(28)?.units || '%' },
{ label: '6#机架', value: this.formatValue(this.getDefineById(29)?.currentValue), unit: this.getDefineById(29)?.units || '%' }
]
// 3. 带钢张力ID=42-48tensionForce0-6
this.tensionMetrics = [
{ label: '0#张力', value: this.formatValue(this.getDefineById(42)?.currentValue), unit: this.getDefineById(42)?.units || 'kN' },
@@ -364,7 +364,7 @@ export default {
{ label: '5#张力', value: this.formatValue(this.getDefineById(47)?.currentValue), unit: this.getDefineById(47)?.units || 'kN' },
{ label: '6#张力', value: this.formatValue(this.getDefineById(48)?.currentValue), unit: this.getDefineById(48)?.units || 'kN' }
]
// 4. 功率百分比ID=49-54powerRatio1-6
this.powerMetrics = [
{ label: '1#机架', value: this.formatValue(this.getDefineById(49)?.currentValue), unit: this.getDefineById(49)?.units || '%' },
@@ -375,11 +375,11 @@ export default {
{ label: '6#机架', value: this.formatValue(this.getDefineById(54)?.currentValue), unit: this.getDefineById(54)?.units || '%' }
]
},
loadForceHistory(isSilent = false) {
return listPlantStateHistory({ pageNum: 1, pageSize: 30 }).then(response => {
if (!isSilent) uni.hideLoading()
if (response.code === 200 && response.rows && response.rows.length > 0) {
const categories = []
const force1Data = []
@@ -388,7 +388,7 @@ export default {
const force4Data = []
const force5Data = []
const force6Data = []
response.rows.forEach(item => {
const dateStr = this.formatDate(item.insdate)
categories.push(dateStr)
@@ -399,10 +399,10 @@ export default {
force5Data.push(Number(item.value34) || 0) // ID=34
force6Data.push(Number(item.value35) || 0) // ID=35
})
this.forceChartData = {
categories: categories.reverse(),
series: [
series: [
{ name: '1#轧制力', data: force1Data.reverse() },
{ name: '2#轧制力', data: force2Data.reverse() },
{ name: '3#轧制力', data: force3Data.reverse() },
@@ -417,11 +417,11 @@ export default {
console.error('加载轧制力历史失败:', error)
})
},
getDefineById(id) {
return this.plantStateDefines.find(item => item.id == id)
},
formatDate(dateStr) {
if (!dateStr) return ''
const date = new Date(dateStr)
@@ -429,7 +429,7 @@ export default {
const minute = String(date.getMinutes()).padStart(2, '0')
return `${hour}:${minute}`
},
formatValue(value) {
if (value === null || value === undefined || value === '') return '—'
const num = Number(value)
@@ -459,20 +459,20 @@ export default {
text-align: center;
padding: 28rpx 0;
position: relative;
.tab-label {
font-size: 28rpx;
color: #606266;
font-weight: 400;
}
&.tab-active {
.tab-label {
color: #0066cc;
font-weight: 500;
}
}
.tab-indicator {
position: absolute;
bottom: 0;
@@ -498,7 +498,7 @@ export default {
justify-content: center;
box-shadow: 0 8rpx 20rpx rgba(0, 102, 204, 0.4);
z-index: 999;
&:active {
opacity: 0.8;
transform: scale(0.95);
@@ -510,7 +510,7 @@ export default {
color: #fff;
display: block;
line-height: 1;
&.rotating {
animation: rotate 1s linear infinite;
}
@@ -555,7 +555,7 @@ export default {
font-size: 28rpx;
font-weight: 500;
color: #303133;
&.status-通畅 { color: #67c23a; }
&.status-卡顿 { color: #e6a23c; }
&.status-异常 { color: #f56c6c; }