feat: ICCID新增复制, 宽度自适应
All checks were successful
构建并部署前端到测试环境 / build-and-deploy (push) Successful in 2m44s

This commit is contained in:
sexygoat
2026-04-15 09:59:05 +08:00
parent b5eb4fdbce
commit d373c2e70e

View File

@@ -150,13 +150,22 @@
v-if="cardInfo.cards && cardInfo.cards.length > 0"
:data="sortedDeviceCards"
border
style="margin-top: 16px"
style="width: 100%; margin-top: 16px"
>
<ElTableColumn label="ICCID">
<ElTableColumn label="ICCID" min-width="180" show-overflow-tooltip>
<template #default="scope">
<ElButton type="primary" link @click="handleNavigateToCardInfo(scope.row.iccid)">
{{ scope.row.iccid }}
</ElButton>
<div style="display: flex; align-items: center; gap: 8px">
<ElButton type="primary" link @click="handleNavigateToCardInfo(scope.row.iccid)">
{{ scope.row.iccid }}
</ElButton>
<el-icon
class="copy-icon"
@click="handleCopyICCID(scope.row.iccid)"
style="cursor: pointer; color: #409eff"
>
<CopyDocument />
</el-icon>
</div>
</template>
</ElTableColumn>
<ElTableColumn prop="msisdn" label="MSISDN" />
@@ -188,7 +197,7 @@
{{ scope.row.real_name_at ? formatDateTime(scope.row.real_name_at) : '-' }}
</template>
</ElTableColumn>
<ElTableColumn label="操作" width="200" align="center">
<ElTableColumn label="操作" width="120" align="center">
<template #default="scope">
<!-- 根据网络状态显示启用或停用按钮 -->
<ElButton
@@ -382,8 +391,10 @@
ElTableColumn,
ElButton,
ElEmpty,
ElMessageBox
ElMessageBox,
ElMessage
} from 'element-plus'
import { CopyDocument } from '@element-plus/icons-vue'
import { useAssetFormatters } from '../composables/useAssetFormatters'
import { formatDateTime } from '@/utils/business/format'
@@ -542,6 +553,16 @@
emit('navigateToCard', iccid)
}
// 复制ICCID
const handleCopyICCID = async (iccid: string) => {
try {
await navigator.clipboard.writeText(iccid)
ElMessage.success('ICCID已复制')
} catch {
ElMessage.error('复制失败')
}
}
// 卡操作
const handleEnableCard = () => {
emit('enableCard')