fix: some

components/DeviceStatusCard.vue

@@ -18,7 +18,7 @@
 			<view class="info-row flex-row-sb">
 				<view class="info-label">
 					<view class="subtitle" v-if="isDevice">IMEI：{{ deviceInfo.imei || '-' }}</view>
-					<view class="subtitle" v-else>手机号：{{ deviceInfo.bound_phone || '-' }}</view>
+					<view class="subtitle" v-else>客户手机号：{{ deviceInfo.bound_phone || '-' }}</view>
 				</view>
 			</view>
 		</view>

components/ExpiryReminderBanner.vue

@@ -0,0 +1,31 @@
+<template>
+	<view class="card expiry-banner" :class="`expiry-${reminder.level}`" role="status">
+		<view class="banner-heading">
+			<view class="banner-title">{{ reminder.level_name || '套餐临期提醒' }}</view>
+			<button class="banner-close" aria-label="关闭临期提醒" @tap="$emit('close')">关闭</button>
+		</view>
+		<view class="banner-body">当前资产套餐剩余 {{ reminder.remaining_days }} 天，请及时续费。</view>
+		<view class="banner-expiry">预计到期：{{ formatShanghaiExpiry(reminder.expires_at) }}</view>
+	</view>
+</template>
+
+<script setup>
+	import { formatShanghaiExpiry } from '@/utils/expiry-reminder.js';
+	defineProps({ reminder: { type: Object, required: true } });
+	defineEmits(['close']);
+</script>
+
+<style scoped lang="scss">
+	.expiry-banner {
+		border-left: 8rpx solid var(--reminder-color);
+		.banner-heading { display: flex; align-items: center; justify-content: space-between; gap: 16rpx; }
+		.banner-title { color: var(--reminder-color); font-size: 30rpx; font-weight: 600; }
+		.banner-close { margin: 0; padding: 8rpx 16rpx; font-size: 24rpx; line-height: 1.5; color: var(--text-secondary); background: var(--gray-100); }
+		.banner-close::after { border: none; }
+		.banner-body { margin-top: 12rpx; font-size: 28rpx; line-height: 1.6; color: var(--text-primary); }
+		.banner-expiry { margin-top: 8rpx; font-size: 24rpx; color: var(--text-secondary); }
+	}
+	.expiry-red { --reminder-color: var(--danger); }
+	.expiry-purple { --reminder-color: var(--purple); }
+	.expiry-pink { --reminder-color: var(--pink); }
+</style>

components/FunctionCard.vue

@@ -63,8 +63,8 @@
 				<view class="function-icon">
 					<image class="function-image icon-bind-phone" src="/static/bind-phone.png" mode="aspectFit" alt="绑定手机号"></image>
 				</view>
-				<view :class="['function-name', alreadyBindPhone ? 'text-primary' : 'text-danger']">
-					{{ alreadyBindPhone ? '已绑定' : '未绑定' }}
+				<view :class="['function-name', assetPhoneBound === true && customerPhone ? 'text-primary' : '']">
+					{{ bindingLabel }}
 				</view>
 			</view>
 			<view class="function-item interactive card-interactive" @tap="$emit('enter', 'change-phone')" role="button"
@@ -123,9 +123,13 @@
 			type: String,
 			default: ''
 		},
-		alreadyBindPhone: {
+		assetPhoneBound: {
 			type: Boolean,
-			default: false
+			default: null
+		},
+		customerPhone: {
+			type: String,
+			default: null
 		},
 		isDevice: {
 			type: Boolean,
@@ -151,9 +155,15 @@
 	};
 
 	const walletText = computed(() => `钱包 (${formatWalletBalance(props.walletBalance)})`);
+	const bindingLabel = computed(() => {
+		if (props.customerPhone === '') return '绑定客户号';
+		if (props.assetPhoneBound === false) return '绑定资产号';
+		if (props.assetPhoneBound === true && props.customerPhone) return '资产已绑定';
+		return '绑定手机号';
+	});
 
 	const handleBindPhone = () => {
-		if (props.alreadyBindPhone) {
+		if (props.assetPhoneBound === true && props.customerPhone) {
 			return;
 		}
 		emit('enter', 'bind');