diff --git a/src/views/asset-management/asset-information/components/BasicInfoCard.vue b/src/views/asset-management/asset-information/components/BasicInfoCard.vue index dd28956..287c851 100644 --- a/src/views/asset-management/asset-information/components/BasicInfoCard.vue +++ b/src/views/asset-management/asset-information/components/BasicInfoCard.vue @@ -254,8 +254,18 @@ 绑定卡列表 -
- +
+
@@ -265,40 +275,63 @@
- 当前 + + 当前 +
- - - {{ bindingCard.msisdn || '-' }} - - - {{ bindingCard.carrier_name || '-' }} - - +
+ MSISDN + {{ bindingCard.msisdn || '-' }} +
+
+ 运营商 + {{ bindingCard.carrier_name || '-' }} +
+
+ 卡槽位置 + SIM-{{ bindingCard.slot_position ?? '-' }} - - + +
+
+ 网络状态 + {{ bindingCard.network_status === 1 ? '正常' : '停机' }} - - + +
+
+ 实名状态 + {{ getRealNameStatusName(bindingCard.real_name_status) }} - - + +
+
+ 实名认证策略 + {{ getRealnamePolicyName(bindingCard.realname_policy) }} - - + +
+
+ 实名时间 + {{ bindingCard.real_name_at ? formatDateTime(bindingCard.real_name_at) : '-' }} - - - {{ bindingCard.gateway_extend || '-' }} - - + +
+
+ 运营商停机原因 + {{ bindingCard.gateway_extend || '-' }} +
@@ -306,7 +339,6 @@ v-if="bindingCard.network_status === 0" type="success" size="small" - link :disabled="isBindingStartDisabled(bindingCard)" @click="handleEnableBindingCard(bindingCard)" v-permission="'iot_info:start'" @@ -317,7 +349,6 @@ v-if="bindingCard.network_status === 1" type="warning" size="small" - link :disabled="isBindingStopDisabled(bindingCard)" @click="handleDisableBindingCard(bindingCard)" v-permission="'iot_info:stop'" @@ -327,7 +358,6 @@ @@ -337,7 +367,6 @@ v-if="getBindingCardAuditTarget(bindingCard)" type="primary" size="small" - link @click="openBindingCardAudit(bindingCard)" > 卡审计 @@ -347,6 +376,8 @@
+ + 设备实时信息 @@ -369,6 +400,8 @@ + + (width.value <= 640 ? 1 : 2)) - // Emits interface Emits { (e: 'update:pollingEnabled', value: boolean): void @@ -759,7 +790,15 @@ } = useAssetFormatters() // 排序后的设备卡列表(按卡槽位置排序,当前卡排在最前面) - const realtimeDescriptionItems = computed(() => { + type RealtimeDescriptionItem = { + key: string + label: string + value: string + tagType?: 'primary' | 'success' | 'warning' | 'info' | 'danger' + span?: number + } + + const realtimeDescriptionItems = computed(() => { const realtime = props.deviceRealtime return [ @@ -1132,6 +1171,18 @@ gap: 16px; } + .binding-card-list--1 { + grid-template-columns: 1fr; + } + + .binding-card-list--2 { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } + + .binding-card { + min-width: 0; + } + .binding-card-header, .binding-card-identifier, .binding-card-actions { @@ -1142,11 +1193,52 @@ .binding-card-header { justify-content: space-between; padding-bottom: 12px; - border-bottom: 1px solid var(--el-border-color-lighter); } .binding-card-details { - padding-top: 12px; + margin-top: 12px; + overflow: hidden; + border: 1px solid var(--el-border-color); + border-radius: 6px; + } + + .binding-card-field { + display: flex; + align-items: center; + justify-content: space-between; + gap: 16px; + min-height: 42px; + min-width: 0; + padding: 10px 12px; + border-bottom: 1px solid var(--el-border-color-lighter); + + &:last-child { + border-bottom: 0; + } + } + + .binding-card-field-label { + flex: 0 0 auto; + font-size: 14px; + color: var(--el-text-color-secondary); + } + + .binding-card-field-value { + min-width: 0; + font-size: 15px; + font-weight: 500; + color: var(--el-text-color-primary); + text-align: right; + } + + .binding-card--current { + border-color: var(--el-color-primary); + box-shadow: 0 0 0 2px var(--el-color-primary-light-8); + } + + .binding-card-current-tag { + font-size: 14px; + font-weight: 600; } .binding-card-identifier { @@ -1168,23 +1260,20 @@ } .binding-card-actions { - flex-wrap: wrap; + display: flex; + flex-wrap: nowrap; gap: 8px; padding-top: 12px; margin-top: 12px; - border-top: 1px solid var(--el-border-color-lighter); .el-button { + flex: 1 1 0; + min-width: 0; + width: 100%; margin-left: 0; } } - @media (width <= 1200px) { - .binding-card-list { - grid-template-columns: repeat(2, minmax(0, 1fr)); - } - } - .card-operations, .device-operations { display: flex; diff --git a/src/views/asset-management/asset-information/components/CurrentPackageCard.vue b/src/views/asset-management/asset-information/components/CurrentPackageCard.vue index c884b4e..67a792c 100644 --- a/src/views/asset-management/asset-information/components/CurrentPackageCard.vue +++ b/src/views/asset-management/asset-information/components/CurrentPackageCard.vue @@ -1,13 +1,8 @@