luo/device-voice-h5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: ui
All checks were successful
构建并部署前端到生产环境 / build-and-deploy (push) Successful in 1m10s
Details

Browse Source
This commit is contained in:
luo
2026-07-30 14:49:39 +08:00
parent 7ecb4709c8
commit c45227ba7e
3 changed files with 101 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
pages/auth/auth.vue
View File

@@ -8,16 +8,17 @@
<view class="card carrier-card" v-for="item in list" :key="item.iccid">
<view class="carrier-main">
<view class="carrier-logo">
<image :src="getCarrier(item.carrier_type).logo" mode="aspectFit"></image>
<view v-if="item.isDevice" class="slot-logo">
<image class="slot-visual" :src="getSlotIcon(item.slot_position)" mode="aspectFit"></image>
</view>
<view class="carrier-details">
<view class="carrier-name">{{ getCarrier(item.carrier_type).name }}</view>
<view class="carrier-iccid">
<text class="field-label">ICCID</text>
<text class="iccid-value-text">{{ item.iccid }}</text>
<image v-if="item.isDevice" class="slot-icon" :src="getSlotIcon(item.slot_position)" mode="aspectFit"></image>
<text v-if="item.isDevice" class="slot-label">卡槽 {{ item.slot_position || '-' }}</text>
<view class="copy-icon" @tap.stop="copyIccid(item.iccid)" aria-label="复制ICCID">
<view class="copy-back"></view>
<view class="copy-front"></view>
</view>
</view>
<view class="card-actions">
<button v-if="item.isRealName" class="btn-apple btn-primary action-button" disabled>已实名</button>
@@ -44,10 +45,6 @@
import { ref, reactive, onMounted } from 'vue';
import { assetApi, realnameApi } from '@/api/index.js';
import { useUserStore } from '@/store/index.js';
import cmccLogo from '@/static/中国移动.png';
import cuccLogo from '@/static/中国联通.png';
import ctccLogo from '@/static/中国电信.png';
import cbnLogo from '@/static/中国广电.png';
import slot1Icon from '@/static/卡槽1.png';
import slot2Icon from '@/static/卡槽2.png';
import slot3Icon from '@/static/卡槽3.png';
@@ -67,13 +64,6 @@
CBN: '中国广电'
};
const carrierLogoMap = {
CMCC: cmccLogo,
CUCC: cuccLogo,
CTCC: ctccLogo,
CBN: cbnLogo
};
const slotIconMap = {
1: slot1Icon,
2: slot2Icon,
@@ -81,14 +71,19 @@
};
const getCarrier = (carrierType) => {
return {
name: carrierMap[carrierType] || '-',
logo: carrierLogoMap[carrierType] || carrierLogoMap.CMCC
};
return { name: carrierMap[carrierType] || '-' };
};
const getSlotIcon = (slotPosition) => slotIconMap[Number(slotPosition)] || slotIconMap[1];
const copyIccid = (value) => {
if (!value) return;
uni.setClipboardData({
data: String(value),
success: () => uni.showToast({ title: 'ICCID已复制', icon: 'success' })
});
};
const loadCards = async () => {
loading.value = true;
try {
@@ -169,7 +164,7 @@
gap: 24rpx;
}
.carrier-logo {
.slot-logo {
width: 112rpx;
height: 112rpx;
flex-shrink: 0;
@@ -177,7 +172,11 @@
box-sizing: border-box;
border-radius: 24rpx;
background: var(--up-primary-light);
image { width: 100%; height: 100%; }
}
.slot-visual {
width: 100%;
height: 100%;
}
.carrier-details {
@@ -197,18 +196,11 @@
.carrier-iccid {
display: flex;
align-items: center;
gap: 12rpx;
gap: 10rpx;
margin-top: 14rpx;
min-width: 0;
}
.field-label,
.slot-label {
color: var(--text-tertiary);
font-size: 24rpx;
white-space: nowrap;
}
.iccid-value-text {
flex: 1;
min-width: 0;
@@ -218,12 +210,27 @@
word-break: break-all;
}
.slot-icon {
width: 56rpx;
height: 56rpx;
.copy-icon {
position: relative;
width: 30rpx;
height: 30rpx;
flex-shrink: 0;
cursor: pointer;
}
.copy-back,
.copy-front {
position: absolute;
width: 15rpx;
height: 15rpx;
border: 3rpx solid var(--text-tertiary);
border-radius: 4rpx;
box-sizing: border-box;
}
.copy-back { top: 3rpx; left: 3rpx; }
.copy-front { right: 2rpx; bottom: 2rpx; background: var(--bg-primary); }
.card-actions {
width: 240rpx;
margin-top: 20rpx;

3
pages/order-list/order-list.vue
View File

@@ -24,7 +24,6 @@
<view class="order-card" v-for="item in orderList" :key="item.order_id">
<view class="card-header">
<view class="order-number" @tap.stop="copyOrderNo(item.order_no)">
<text class="order-label">订单号：</text>
<text class="order-no">{{ item.order_no || '-' }}</text>
<view class="copy-icon">
<view class="copy-back"></view>
@@ -570,8 +569,6 @@
font-size: 26rpx;
}
.order-label { flex-shrink: 0; }
.order-no {
max-width: 410rpx;
overflow: hidden;

106
pages/switch/switch.vue
View File

@@ -8,22 +8,25 @@
<view class="card carrier-card" v-for="item in mchList" :key="item.iccid">
<view class="carrier-main">
<view class="carrier-logo">
<image :src="getCarrier(item.carrier_type).logo" mode="aspectFit"></image>
<view class="slot-logo">
<image class="slot-visual" :src="getSlotIcon(item.slot_position)" mode="aspectFit"></image>
</view>
<view class="carrier-details">
<view class="carrier-name">{{ getCarrier(item.carrier_type).name }}</view>
<view class="carrier-iccid">
<text class="field-label">ICCID</text>
<text class="iccid-value-text">{{ item.iccid }}</text>
<image class="slot-icon" :src="getSlotIcon(item.slot_position)" mode="aspectFit"></image>
<text class="slot-label">卡槽 {{ item.slot_position || '-' }}</text>
<view class="carrier-heading">
<view class="carrier-name">{{ getCarrier(item.carrier_type).name }}</view>
<view class="carrier-statuses">
<up-tag :type="item.real_name_status === 1 ? 'primary' : 'success'" size="mini">
{{ item.real_name_status === 1 ? '已实名' : '未实名' }}
</up-tag>
<up-tag v-if="item.network_status" type="info" size="mini">{{ item.network_status }}</up-tag>
</view>
</view>
<view class="carrier-statuses">
<up-tag :type="item.real_name_status === 1 ? 'primary' : 'success'" size="mini">
{{ item.real_name_status === 1 ? '已实名' : '未实名' }}
</up-tag>
<up-tag v-if="item.network_status" type="info" size="mini">{{ item.network_status }}</up-tag>
<view class="carrier-iccid">
<text class="iccid-value-text">{{ item.iccid }}</text>
<view class="copy-icon" @tap.stop="copyIccid(item.iccid)" aria-label="复制ICCID">
<view class="copy-back"></view>
<view class="copy-front"></view>
</view>
</view>
<view class="card-actions">
<button v-if="item.is_current" class="btn-apple btn-primary action-button" disabled>当前使用</button>
@@ -55,10 +58,6 @@
import { reactive, ref, onMounted } from 'vue';
import { assetApi, deviceApi, realnameApi } from '@/api/index.js';
import { useUserStore } from '@/store/index.js';
import cmccLogo from '@/static/中国移动.png';
import cuccLogo from '@/static/中国联通.png';
import ctccLogo from '@/static/中国电信.png';
import cbnLogo from '@/static/中国广电.png';
import slot1Icon from '@/static/卡槽1.png';
import slot2Icon from '@/static/卡槽2.png';
import slot3Icon from '@/static/卡槽3.png';
@@ -78,13 +77,6 @@
CBN: '中国广电'
};
const carrierLogoMap = {
CMCC: cmccLogo,
CUCC: cuccLogo,
CTCC: ctccLogo,
CBN: cbnLogo
};
const slotIconMap = {
1: slot1Icon,
2: slot2Icon,
@@ -92,14 +84,19 @@
};
const getCarrier = (carrierType) => {
return {
name: carrierMap[carrierType] || '-',
logo: carrierLogoMap[carrierType] || carrierLogoMap.CMCC
};
return { name: carrierMap[carrierType] || '-' };
};
const getSlotIcon = (slotPosition) => slotIconMap[Number(slotPosition)] || slotIconMap[1];
const copyIccid = (value) => {
if (!value) return;
uni.setClipboardData({
data: String(value),
success: () => uni.showToast({ title: 'ICCID已复制', icon: 'success' })
});
};
const loadCards = async () => {
loading.value = true;
try {
@@ -202,7 +199,7 @@
gap: 24rpx;
}
.carrier-logo {
.slot-logo {
width: 112rpx;
height: 112rpx;
flex-shrink: 0;
@@ -210,7 +207,11 @@
box-sizing: border-box;
border-radius: 24rpx;
background: var(--up-primary-light);
image { width: 100%; height: 100%; }
}
.slot-visual {
width: 100%;
height: 100%;
}
.carrier-details {
@@ -227,21 +228,21 @@
line-height: 1.3;
}
.carrier-heading {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 12rpx;
}
.carrier-iccid {
display: flex;
align-items: center;
gap: 12rpx;
gap: 10rpx;
margin-top: 14rpx;
min-width: 0;
}
.field-label,
.slot-label {
color: var(--text-tertiary);
font-size: 24rpx;
white-space: nowrap;
}
.iccid-value-text {
flex: 1;
min-width: 0;
@@ -251,18 +252,33 @@
word-break: break-all;
}
.copy-icon {
position: relative;
width: 30rpx;
height: 30rpx;
flex-shrink: 0;
cursor: pointer;
}
.copy-back,
.copy-front {
position: absolute;
width: 15rpx;
height: 15rpx;
border: 3rpx solid var(--text-tertiary);
border-radius: 4rpx;
box-sizing: border-box;
}
.copy-back { top: 3rpx; left: 3rpx; }
.copy-front { right: 2rpx; bottom: 2rpx; background: var(--bg-primary); }
.carrier-statuses {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 10rpx;
margin-top: 14rpx;
}
.slot-icon {
width: 56rpx;
height: 56rpx;
flex-shrink: 0;
margin-top: 0;
}
.card-actions {