串口下拉框去掉电脑自带的 COM1，只留实训台上的 COM2–COM5；展开时每个串口后面用灰字标出接的设备（ADAM-4017+、ADAM-4150、ZigBee 协调器、LED 屏），选中后的值还是 COM2 这样的串口名，和真机一致。项目 5 任务 3 跳过 COM1 的写法照书保留，任务说明补一句；使用说明、设计方案同步；按位置选串口的测试下标跟着改

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

web/src/winforms/ControlView.vue

@@ -58,6 +58,8 @@ const items = computed(() => (p.value.Items as string[] | undefined) ?? [])
 const editable = computed(() => p.value.DropDownStyle !== 'DropDownList')
 const combo = ref<HTMLElement>()
 const listStyle = ref<CSSProperties>({})
+/** 串口列表里每个口后面用灰字标出实训台上接的设备，只是提示，下拉框的值还是 COM2 这样的串口名 */
+const portDevices: Record<string, string> = { COM2: 'ADAM-4017+', COM3: 'ADAM-4150', COM4: 'ZigBee 协调器', COM5: 'LED 屏' }
 
 function openDropDown() {
   if (!enabled.value) return
@@ -73,7 +75,7 @@ function openDropDown() {
   listStyle.value = {
     left: `${rect.left}px`,
     top: `${rect.bottom}px`,
-    width: `${el.offsetWidth}px`,
+    minWidth: `${el.offsetWidth}px`,
     transform: `scale(${rect.width / el.offsetWidth || 1})`,
     font: css.font,
     color: css.color,
@@ -177,7 +179,9 @@ const itemHeight = computed(() => `${(p.value.ItemHeight as number | undefined)
     <span class="wf-combobox-arrow" @mousedown.prevent="openDropDown">▾</span>
     <Teleport to="body">
       <ul v-if="dropDownOpen" class="wf-combobox-list" :style="listStyle">
-        <li v-for="(item, index) in items" :key="index" @mousedown.prevent="selectItem(index)">{{ item }}</li>
+        <li v-for="(item, index) in items" :key="index" @mousedown.prevent="selectItem(index)">
+          {{ item }}<span v-if="portDevices[item]" class="wf-combobox-hint">{{ portDevices[item] }}</span>
+        </li>
         <li v-if="items.length === 0" class="wf-combobox-empty">&nbsp;</li>
       </ul>
     </Teleport>