zhangwencui
6 天以前 bbb54adc8d9fd6ae6b87ac036c8b21f3ad7daef4
src/views/mes/workbench/components/tabs/RecordParamTab.vue
@@ -26,6 +26,8 @@
const props = defineProps<{
  /** 当前工单编号 */
  workOrderId?: number;
  /** 当前工作站编号 */
  workstationId?: number;
}>();
// --- 模式 ---
@@ -283,6 +285,7 @@
  try {
    const result = await getWorkOrderParamRecordPage({
      workOrderId: props.workOrderId,
      workstationId: props.workstationId,
      pageNo: 1,
      pageSize: 100,
    });
@@ -292,20 +295,15 @@
  }
}
// 工单变更时加载记录
// 工单或工作站变更时加载记录
watch(
  () => props.workOrderId,
  () => [props.workOrderId, props.workstationId],
  () => {
    handleCancelForm();
    refreshRecordList();
  },
  { immediate: true },
);
/** 格式化参数值展示 */
function formatParamDisplay(detail: MesProWorkOrderParamRecordApi.ParamRecordDetail) {
  const unit = detail.unitMeasureName ? ` ${detail.unitMeasureName}` : '';
  return `${detail.paramName}: ${detail.paramValue ?? '-'}${unit}`;
}
</script>
<template>
@@ -410,7 +408,7 @@
      <!-- 无工单提示 -->
      <div v-if="!workOrderId" class="record-param-tab__empty">
        <IconifyIcon icon="lucide:alert-circle" class="record-param-tab__empty-icon" />
        <p>请先从左侧选择一条工单任务</p>
        <p>请先选择工作站和工单任务</p>
      </div>
      <!-- 空列表 -->
@@ -450,13 +448,16 @@
            备注:{{ record.remark }}
          </div>
          <div class="record-param-tab__card-params">
            <span
            <div
              v-for="d in record.details"
              :key="d.id"
              class="record-param-tab__param-tag"
              class="record-param-tab__param-row"
            >
              {{ formatParamDisplay(d) }}
            </span>
              <span class="record-param-tab__param-name">{{ d.paramName }}</span>
              <span class="record-param-tab__param-value">
                {{ d.paramValue ?? '-' }}<span v-if="d.unitMeasureName" class="record-param-tab__param-unit"> {{ d.unitMeasureName }}</span>
              </span>
            </div>
          </div>
        </div>
      </div>
@@ -680,20 +681,38 @@
}
.record-param-tab__card-params {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px 16px;
  margin-top: 8px;
}
.record-param-tab__param-tag {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 4px;
.record-param-tab__param-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-size: 13px;
  line-height: 1.6;
  padding: 2px 0;
}
.record-param-tab__param-name {
  flex-shrink: 0;
  color: #8c8c8c;
  min-width: 100px;
  &::after {
    content: ':';
  }
}
.record-param-tab__param-value {
  color: #1a1a1a;
  font-weight: 500;
}
.record-param-tab__param-unit {
  color: #8c8c8c;
  font-size: 12px;
  background: #f6ffed;
  color: #389e0d;
  border: 1px solid #d9f7be;
}
</style>