huang
9 天以前 9a9479a5e34324822b223747b7c88ff060466db0
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
<template>
  <div class="workstation-transfer-config">
    <el-row :gutter="20">
      <el-col :span="12">
        <el-form-item label="缓冲判定时间(秒)">
          <el-input-number
            v-model="transferDelaySeconds"
            :min="5"
            :max="120"
            :step="1"
            style="width: 100%;"
          />
          <span class="form-tip">30秒内无新玻璃扫码则判定为最后一片,默认30秒</span>
        </el-form-item>
      </el-col>
    </el-row>
 
    <el-row :gutter="20">
      <el-col :span="12">
        <el-form-item label="车辆容量(mm)">
          <el-input-number
            v-model="config.vehicleCapacity"
            :min="1000"
            :max="20000"
            :step="100"
            style="width: 100%;"
          />
          <span class="form-tip">可装载的最大宽度(毫米),默认6000mm</span>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="玻璃间隙(mm)">
          <el-input-number
            v-model="config.glassGap"
            :min="0"
            :max="1000"
            :step="10"
            style="width: 100%;"
          />
          <span class="form-tip">多块玻璃之间的物理间隔空隙,默认200mm</span>
        </el-form-item>
      </el-col>
    </el-row>
 
    <el-row :gutter="20">
      <el-col :span="12">
        <el-form-item label="监控间隔(秒)">
          <el-input-number
            v-model="monitorIntervalSeconds"
            :min="1"
            :max="60"
            :step="1"
            style="width: 100%;"
          />
          <span class="form-tip">批次处理监控间隔,默认使用扫码间隔</span>
        </el-form-item>
      </el-col>
    </el-row>
 
    <el-row :gutter="20">
      <el-col :span="12">
        <el-form-item label="产线编号">
          <el-input-number
            v-model="config.workLine"
            :min="1"
            :max="100"
            :step="1"
            style="width: 100%;"
          />
          <span class="form-tip">产线编号,用于过滤玻璃信息</span>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="卧转立编号">
          <el-input-number
            v-model="config.inPosition"
            :min="0"
            :max="1000"
            :step="1"
            style="width: 100%;"
          />
          <span class="form-tip">写入PLC的inPosition字段,表示卧转立编号</span>
        </el-form-item>
      </el-col>
    </el-row>
  </div>
</template>
 
<script setup>
import { ref, watch } from 'vue'
 
const props = defineProps({
  modelValue: {
    type: Object,
    default: () => ({})
  }
})
 
const emit = defineEmits(['update:modelValue'])
 
// 配置数据
const config = ref({
  transferDelayMs: 30000,
  vehicleCapacity: 6000,
  glassGap: 200,
  monitorIntervalMs: 10000,
  workLine: null,
  inPosition: null
})
 
// 时间字段(秒)- 用于前端显示和输入
const transferDelaySeconds = ref(30)
const monitorIntervalSeconds = ref(10)
 
// 监听props变化
watch(() => props.modelValue, (newVal) => {
  if (newVal && Object.keys(newVal).length > 0) {
    config.value = {
      transferDelayMs: newVal.transferDelayMs ?? 30000,
      vehicleCapacity: newVal.vehicleCapacity ?? 6000,
      glassGap: newVal.glassGap ?? 200,
      monitorIntervalMs: newVal.monitorIntervalMs ?? 10000,
      workLine: newVal.workLine ?? null,
      inPosition: newVal.inPosition ?? null
    }
    // 将毫秒转换为秒用于显示
    transferDelaySeconds.value = (config.value.transferDelayMs ?? 30000) / 1000
    monitorIntervalSeconds.value = (config.value.monitorIntervalMs ?? 10000) / 1000
  }
}, { immediate: true, deep: true })
 
// 监听秒字段变化,转换为毫秒并更新config
watch(transferDelaySeconds, (val) => {
  config.value.transferDelayMs = Math.round(val * 1000)
  emit('update:modelValue', { ...config.value })
})
 
watch(monitorIntervalSeconds, (val) => {
  config.value.monitorIntervalMs = Math.round(val * 1000)
  emit('update:modelValue', { ...config.value })
})
 
// 监听config其他字段变化,同步到父组件
watch(() => [
  config.value.vehicleCapacity,
  config.value.glassGap,
  config.value.workLine,
  config.value.inPosition
], () => {
  emit('update:modelValue', { ...config.value })
}, { deep: true })
</script>
 
<style scoped>
.form-tip {
  margin-left: 10px;
  font-size: 12px;
  color: #909399;
}
</style>