chenbin/ufutx.dma.case.h5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

增加新内容

Browse Source
This commit is contained in:
chenbin 2026-10-23 07:57:42 +08:00
parent dd97b96b27
commit 825f69d886
7 changed files with 2724 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/api/example.js
View File

@ -32,33 +32,9 @@ export const userList = [
{label: '中风', id:1},
],
weightList:[
{ day: '2026-09-08', weight: 192.3 },
{ day: '2026-09-09', weight: 190.1 },
{ day: '2026-09-10', weight: 190.0 },
{ day: '2026-09-11', weight: 190.0 },
{ day: '2026-09-12', weight: 189.6 },
{ day: '2026-09-13', weight: 188.5 },
{ day: '2026-09-14', weight: 185.5 },
{ day: '2026-09-15', weight: 184.3 },
{ day: '2026-09-17', weight: 186.3 },
{ day: '2026-09-18', weight: 185.1 },
{ day: '2026-09-19', weight: 185.0 },
{ day: '2026-09-20', weight: 182.8 },
{ day: '2026-09-21', weight: 184.5 },
{ day: '2026-09-22', weight: 181.2 },
{ day: '2026-09-23', weight: 183.1 },
{ day: '2026-09-24', weight: 185.3 },
{ day: '2026-09-25', weight: 183.0 },
{ day: '2026-09-26', weight: 182.8 },
{ day: '2026-09-27', weight: 181.6 },
{ day: '2026-09-28', weight: 180.2 },
{ day: '2026-09-29', weight: 182.3 },
{ day: '2026-09-30', weight: 180.3 },
{ day: '2026-10-01', weight: 179.8 },
{ day: '2026-10-03', weight: 181.5 },
{ day: '2026-10-14', weight: 177.1 }
]
},
],
comment: ''
},
{
username: '周三江',
id: 2357,
@ -121,6 +97,8 @@ export const userList = [
{ day: '2026-10-01', weight: 179.8 },
{ day: '2026-10-03', weight: 181.5 },
{ day: '2026-10-14', weight: 177.1 }
]
],
comment: '在这份为期23天的体重管理方案中，周先生从初始的192斤稳步调整至179斤，累计体重变化幅度近十斤，取得了扎实的减重成果。饮食环节他执行得格外到位，全程严格遵循方案的各项要求，没有出现明显的松懈和偏差。中途他不慎脚部受伤，原本计划的日常行走步数没能按目标完成，但他有坚持每周完成5公里游泳训练，保证了一定身体新陈代谢率。同时他需要兼顾上夜班的节奏，他也全程配合跟上了方案的推进节奏。整个过程中他没有出现强烈的饥饿感，自始至终都保持着相对轻松舒适的状态，顺利走完了全部23天的管理周期，这套兼顾灵活调整与落地性的方案为减重人群提供了可参考的实践样本。'
}
]

2029
src/api/user.js Normal file
View File

File diff suppressed because it is too large Load Diff

445
src/views/UserDetailView copy.vue Normal file
View File

@ -0,0 +1,445 @@
<template>
<div class="user-base-line">
<div class="user-block">
<t-cell-group title="用户基本信息" >
<t-cell title="用户名" :note="`${user.username}`" class="line-start line-end" ></t-cell>
<t-cell title="性别" :note="`${user.sex == 1? '男':'女'}`" class="line-end" ></t-cell>
<t-cell title="出生年月日" :note="`${user.birthday}(${new Date().getFullYear() - +user.birthday?.slice(0, 4)}岁)`" class="line-end" ></t-cell>
<t-cell title="方案开始时间" :note="user.before?.day" class="line-end"></t-cell>
<t-cell title="方案结束时间" :note="user.after?.day" class="line-end"></t-cell>
</t-cell-group>
</div>
<t-cell-group title="用户标签" >
<div class="user-label-line ">
<span class="user-label user-label-active" v-for="label in user.labelList">{{ label.label }}</span>
</div>
</t-cell-group>
<div class="user-block" v-if="user.before?.picList.length > 0">
<t-cell-group title="方案前照片">
<t-row style="margin:16px;">
<t-col span="8" class="dark" v-for="pic in user.before?.picList">
<t-image
class="user-pic-item"
fit="fill"
:src="pic"
@click="beforeVisible = true"
></t-image>
</t-col>
</t-row>
</t-cell-group>
<t-image-viewer v-model:images="beforePicList" :visible="beforeVisible" @close="beforeVisible = false">
<template #image="{ src, className, onLoad, onTransitionstart, onTransitionend, style }">
<div>
<img
:src="src"
:style="style"
:class="className"
@load="onLoad"
@transitionstart="onTransitionstart"
@transitionend="onTransitionend"
/>
</div>
</template>
</t-image-viewer>
</div>
<div class="user-block" v-if="user?.before?.videoList.length > 0">
<t-cell-group title="方案前视频">
<t-row style="margin:16px;">
<t-col span="8" class="dark" v-for="(video,index) in user.before?.videoList">
<div class="video-cover-wrapper">
<!-- 视频封面：使用 TDesign Image 组件 -->
<t-image
:src="video.cover"
fit="fill"
class="user-pic-item"
@click="openVideoPreview('before', index)"
>
</t-image>
<div class="play-mask">
<t-icon name="play-circle-filled" size="48px" />
</div>
</div>
</t-col>
</t-row>
</t-cell-group>
<!-- 预览弹窗 -->
<t-dialog
v-model:visible="visibleVideo"
header="视频预览"
:footer="false"
width="100vw"
close-btn
destroy-on-close
@close="handleVideoClose"
>
<video
v-if="visibleVideo"
ref="videoRef"
:src="videoUrl"
:poster="videoCover"
controls
autoplay
playsinline
style="width: 100%; height: auto; border-radius: 4px"
/>
</t-dialog>
</div>
<div class="user-block" v-if="user.after?.picList.length > 0">
<t-cell-group title="方案后照片">
<t-row style="margin:16px;">
<t-col span="8" class="dark" v-for="pic in user.after?.picList">
<t-image
class="user-pic-item"
fit="fill"
:src="pic"
@click="afterVisible = true"
></t-image>
</t-col>
</t-row>
</t-cell-group>
<t-image-viewer v-model:images="afterPicList" :visible="afterVisible" @close="afterVisible = false">
<template #image="{ src, className, onLoad, onTransitionstart, onTransitionend, style }">
<div>
<img
:src="src"
:style="style"
:class="className"
@load="onLoad"
@transitionstart="onTransitionstart"
@transitionend="onTransitionend"
/>
</div>
</template>
</t-image-viewer>
</div>
<div class="user-block" v-if="user.after?.videoList.length > 0">
<t-cell-group title="方案后视频">
<t-row style="margin:16px;">
<t-col span="8" class="dark" v-for="(video,index) in user.after?.videoList">
<div class="video-cover-wrapper">
<!-- 视频封面：使用 TDesign Image 组件 -->
<t-image
:src="video.cover"
fit="fill"
class="user-pic-item"
@click="openVideoPreview('after', index)"
>
</t-image>
<div class="play-mask">
<t-icon name="play-circle-filled" size="48px" />
</div>
</div>
</t-col>
</t-row>
</t-cell-group>
<!-- 预览弹窗 -->
</div>
<div>
<t-cell-group title="体重变化" v-if="weightData">
<t-cell title="方案开始体重" :note="weightData.weightStart + '斤（'+weightData.dayStart+'）'"></t-cell>
<t-cell title="方案开始体重" :note="weightData.weightEnd + '斤（'+weightData.dayEnd+'）'"></t-cell>
<t-cell title="体重变化" :note="weightData.weightTotal + '斤（共'+weightData.dayTotal+'天）'"></t-cell>
<Canvas :style="{ width: '100%', height: '300px' }" v-if="weightChartData.length > 1">
<Chart :data="weightChartData" :scale="scaleConfig">
<Axis field="day" />
<Axis field="weight" />
<Line x="day" y="weight" />
</Chart>
</Canvas>
</t-cell-group>
<t-cell-group title="教练小结" v-if="user.comment">
<div class="comment">{{ user.comment }}</div>
</t-cell-group>
</div>
<div>
</div>
<div class="empty-bar"></div>
<div class="empty-bar"></div>
</div>
</template>
<script lang="ts" setup>
import { Icon as TIcon } from 'tdesign-icons-vue-next';
import { onMounted, ref } from 'vue';
import {useRoute, useRouter} from 'vue-router'
import Canvas from '@antv/f-vue';
import { Chart, Interval, Axis, Line } from '@antv/f2';
import {labelList, userList} from '../api/example.js'
const router = useRouter()
const route = useRoute()
const userID = ref("")
const beforeVisible = ref(false)
const afterVisible = ref(false)
const beforePicList = ref([])
const afterPicList = ref([])
const visibleVideo = ref(false)
const videoUrl = ref('')
const videoCover = ref('')
const weightData = ref({})
const weightChartData = ref([
{weight: 0, day: '2026-09-01'}
])
const openVideoPreview = (source, index) => {
visibleVideo.value = true
if (source == 'before'){
videoCover.value = user.value.before.videoList[index].cover
videoUrl.value = user.value.before.videoList[index].url
}else{
videoCover.value = user.value.after.videoList[index].cover
videoUrl.value = user.value.after.videoList[index].url
}
}
const handleVideoClose = () => {
visibleVideo.value = false
}
const user1 = ref({
username: '用户名 1',
id: 1,
sex: 1,
birthday: '1985-09-01',
before: {
day: '2026-09-01',
picList: [
'https://tdesign.gtimg.com/mobile/demos/example4.png',
'https://tdesign.gtimg.com/mobile/demos/example6.png',
'https://tdesign.gtimg.com/mobile/demos/example4.png',
'https://tdesign.gtimg.com/mobile/demos/example6.png',
'https://tdesign.gtimg.com/mobile/demos/example4.png',
'https://tdesign.gtimg.com/mobile/demos/example6.png',
'https://tdesign.gtimg.com/mobile/demos/example4.png',
],
videoList: [
{cover: 'https://tdesign.gtimg.com/mobile/demos/example4.png', url: 'https://lorem.video/bunny_720p_h264_30fps_20s_23crf_aac_192kbps.mp4'},
{cover: 'https://tdesign.gtimg.com/mobile/demos/example6.png', url: 'https://lorem.video/bunny_720p_h264_30fps_20s_23crf_aac_192kbps.mp4'},
{cover: 'https://tdesign.gtimg.com/mobile/demos/example4.png', url: 'https://lorem.video/bunny_720p_h264_30fps_20s_23crf_aac_192kbps.mp4'},
{cover: 'https://tdesign.gtimg.com/mobile/demos/example6.png', url: 'https://lorem.video/bunny_720p_h264_30fps_20s_23crf_aac_192kbps.mp4'},
{cover: 'https://tdesign.gtimg.com/mobile/demos/example4.png', url: 'https://lorem.video/bunny_720p_h264_30fps_20s_23crf_aac_192kbps.mp4'},
]
},
after: {
day: '2026-09-01',
picList: [
'https://tdesign.gtimg.com/mobile/demos/example4.png',
'https://tdesign.gtimg.com/mobile/demos/example6.png',
'https://tdesign.gtimg.com/mobile/demos/example4.png',
'https://tdesign.gtimg.com/mobile/demos/example6.png',
'https://tdesign.gtimg.com/mobile/demos/example4.png',
'https://tdesign.gtimg.com/mobile/demos/example6.png',
'https://tdesign.gtimg.com/mobile/demos/example4.png',
],
videoList: [
{cover: 'https://tdesign.gtimg.com/mobile/demos/example4.png', url: 'https://lorem.video/bunny_720p_h264_30fps_20s_23crf_aac_192kbps.mp4'},
{cover: 'https://tdesign.gtimg.com/mobile/demos/example6.png', url: 'https://lorem.video/bunny_720p_h264_30fps_20s_23crf_aac_192kbps.mp4'},
{cover: 'https://tdesign.gtimg.com/mobile/demos/example4.png', url: 'https://lorem.video/bunny_720p_h264_30fps_20s_23crf_aac_192kbps.mp4'},
{cover: 'https://tdesign.gtimg.com/mobile/demos/example6.png', url: 'https://lorem.video/bunny_720p_h264_30fps_20s_23crf_aac_192kbps.mp4'},
{cover: 'https://tdesign.gtimg.com/mobile/demos/example4.png', url: 'https://lorem.video/bunny_720p_h264_30fps_20s_23crf_aac_192kbps.mp4'},
]
},
labelList:[
'病症 1','病症病症 2','病症病症病症 3','病症病 4','病病症 5','病症 6','病症病症病症病症 7','病症 8','病症 9'
],
weightList:[
{day: '2026-09-01', weight: 180.4},
{day: '2026-09-02', weight: 175.5},
{day: '2026-09-03', weight: 169.6},
{day: '2026-09-04', weight: 158.7},
{day: '2026-09-05', weight: 154.8},
{day: '2026-09-06', weight: 152.9},
{day: '2026-09-07', weight: 145.1},
{day: '2026-09-08', weight: 143.2},
{day: '2026-09-09', weight: 140.3},
{day: '2026-09-10', weight: 138.4},
{day: '2026-09-11', weight: 135.5},
]
})
const user = ref({})
const setWeightData = (weightList) => {
const total = weightList.length
const weightStart = weightList[0].weight
const weightEnd = weightList[total - 1].weight
const dayStart = weightList[0].day
const dayEnd = weightList[total - 1].day
const weightTotal = (weightEnd - weightStart).toFixed(2)
weightData.value = {
weightStart : weightStart.toFixed(2),
weightEnd : weightEnd.toFixed(2),
dayStart : dayStart,
dayEnd: dayEnd,
dayTotal: total,
weightTotal: weightTotal,
}
}
onMounted(() => {
console.log('route', route)
console.log('router', router)
const id = route.params.id
userID.value = id
userList.forEach(u => {
console.log('u', u)
if (u.id == id){
user.value = u
console.log('user', user)
weightChartData.value = u.weightList
beforePicList.value = u.before.picList
afterPicList.value = u.after.picList
setWeightData(u.weightList)
}
})
})
const scaleConfig = {
day: { range: [0, 1], tickCount: 5 },
};
</script>
<style lang="less">
.card {
position: relative;
margin: 16px;
border-radius: 6px;
// overflow: hidden;
box-sizing: border-box;
border: 1.5px solid var(--bg-color-demo, #fff);
border-color: var(--td-success-color-4);
}
.card--active {
border-color: var(--td-brand-color);
}
.card--active::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
width: 0;
border: 14px solid var(--td-success-color-4);
border-bottom-color: transparent;
border-right-color: transparent;
}
.card__icon {
color: var(--td-text-color-anti);
position: absolute;
left: 1.5px;
top: 1.5px;
z-index: 1;
}
/* 横向布局 */
.horizontal-box {
width: calc(100% - 32px);
display: flex;
align-items: start;
margin: 16px;
white-space: nowrap
}
.horizontal-box .card {
flex: 1;
margin: 0;
}
.horizontal-box .card + .card {
margin-left: 12px;
}
.horizontal-box .card::after {
border-width: 12px;
}
.horizontal-box .card__icon {
font-size: 12px;
}
.user-line{
width: calc(100vw - 8px);
margin: 4px;
}
.user-pic-item{
padding: 4px;
}
.line-start{
border-top: 1px solid var(--td-success-color-4);
}
.line-end{
border-bottom: 1px solid var(--td-success-color-4);
}
.user-line-block{
width: 50%;
}
.user-pic-block{
width: 100%;
}
.user-pic{
padding: 16px;
}
.user-day{
padding-top: 8px;
display: flex;
justify-content: center;
}
.user-label-line{
margin:16px;
}
.user-label{
margin: 4px;
padding: 4px 12px 4px 12px;
line-height: 36px;
border-radius: 16px;
color: #000;
white-space: nowrap;
border: 1px solid var(--td-success-color-4);
}
.user-label-active{
color: #fff;
background-color: var(--td-success-color-4);
}
.user-name-line{
border-bottom: 1px solid var(--td-success-color-4);
// border-radius: 8px;
}
.user-name{
border-radius: 8px;
}
.t-checkbox--block {
padding: 4px;
padding-left: 16px;
}
.video-cover-wrapper {
position: relative;
display: inline-block;
width: 100%;
}
.play-mask {
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
// background: rgba(0, 0, 0, 0.35);
pointer-events: none; /* 让点击穿透到外层 */
// padding: 4px;
// margin: 4px;
}
.comment{
text-indent: 2em;
padding: 16px;
}
</style>

55
src/views/UserDetailView.vue
View File

@ -4,15 +4,15 @@
<div class="user-base-line">
<div class="user-block">
<t-cell-group title="用户基本信息" >
<t-cell title="用户名" :note="`${user.username}`" class="line-start line-end" ></t-cell>
<t-cell title="用户名" :note="`${user.name}`" class="line-start line-end" ></t-cell>
<t-cell title="性别" :note="`${user.sex == 1? '男':'女'}`" class="line-end" ></t-cell>
<t-cell title="出生年月日" :note="`${user.birthday}(${new Date().getFullYear() - +user.birthday?.slice(0, 4)}岁)`" class="line-end" ></t-cell>
<t-cell title="方案开始时间" :note="user.before?.day" class="line-end"></t-cell>
<t-cell title="方案结束时间" :note="user.after?.day" class="line-end"></t-cell>
<!-- <t-cell title="方案开始时间" :note="user.before?.day" class="line-end"></t-cell>
<t-cell title="方案结束时间" :note="user.after?.day" class="line-end"></t-cell> -->
</t-cell-group>
</div>
<t-cell-group title="用户标签" >
<t-cell-group title="用户标签" v-if="user.labelList">
<div class="user-label-line ">
<span class="user-label user-label-active" v-for="label in user.labelList">{{ label.label }}</span>
</div>
@ -144,8 +144,8 @@
<!-- 预览弹窗 -->
</div>
<div>
<t-cell-group title="体重变化">
<div v-if="user.weightList">
<t-cell-group title="体重变化" v-if="weightData">
<t-cell title="方案开始体重" :note="weightData.weightStart + '斤（'+weightData.dayStart+'）'"></t-cell>
<t-cell title="方案开始体重" :note="weightData.weightEnd + '斤（'+weightData.dayEnd+'）'"></t-cell>
<t-cell title="体重变化" :note="weightData.weightTotal + '斤（共'+weightData.dayTotal+'天）'"></t-cell>
@ -157,6 +157,11 @@
</Chart>
</Canvas>
</t-cell-group>
</div>
<div v-if="user.comment">
<t-cell-group title="教练小结" v-if="user.comment">
<div class="comment">{{ user.comment }}</div>
</t-cell-group>
</div>
<div>
</div>
@ -171,7 +176,7 @@ import {useRoute, useRouter} from 'vue-router'
import Canvas from '@antv/f-vue';
import { Chart, Interval, Axis, Line } from '@antv/f2';
import {labelList, userList} from '../api/example.js'
import {labelList, userList} from '../api/user'
const router = useRouter()
const route = useRoute()
@ -290,10 +295,34 @@ onMounted(() => {
if (u.id == id){
user.value = u
console.log('user', user)
weightChartData.value = u.weightList
beforePicList.value = u.before.picList
afterPicList.value = u.after.picList
setWeightData(u.weightList)
// 1. body_images 下所有值变成数组
u.body_images = Object.fromEntries(
Object.entries(u.body_images).map(([k, v]) => [k, [v]])
);
// 2. after_body_images 下所有值变成数组
u.after_body_images = Object.fromEntries(
Object.entries(u.after_body_images).map(([k, v]) => [k, [v]])
);
// 3. 新增 user.before.picList —— 取 body_images 的数组值
u.before = {
picList: Object.values(u.body_images)
};
// 4. 新增 user.after.picList —— 取 after_body_images 的数组值
u.after = {
picList: Object.values(u.after_body_images)
};
if (u.weightList){
weightChartData.value = u.weightList
beforePicList.value = u.before.picList
afterPicList.value = u.after.picList
setWeightData(u.weightList)
}
u.before.videoList = []
u.after.videoList = []
user.value = u
}
})
})
@ -435,4 +464,8 @@ const scaleConfig = {
// padding: 4px;
// margin: 4px;
}
.comment{
text-indent: 2em;
padding: 16px;
}
</style>

189
src/views/UserListView copy.vue Normal file
View File

@ -0,0 +1,189 @@
<template>
<div class="tdesign-mobile-demo-block__summary" style="margin-left: 16px; margin-top: 24px">请选择用户标签</div>
<div class="user-label-line">
<span :class="`user-label ${search.indexOf(symptom.id) > -1 ? 'user-label-active' : ''}`" v-for="symptom in labelList" @click="selectOption(symptom.id)">{{ symptom.label }}</span>
</div>
<div v-for="user in userList" class="user-line">
<div class="user-name-line">
<t-cell :title="`用户名：${user.username}`" class="user-name" note="查看详情" arrow @click="toUserDetail(user.id)"></t-cell>
</div>
<div class="user-label-line">
<span class="user-label user-label-active" v-for="label in user.labelList">{{ label.label }}</span>
</div>
<div class="user-pic-line">
<div class="user-line-block user-before">
<div class="user-day">
开始日期：{{ user.before.day }}
</div>
<div class="user-pic-block">
<t-image
class="user-pic"
fit="fill"
:src="user.before.picCover"
></t-image>
</div>
</div>
<div class="user-line-block user-after">
<div class="user-day">
结束日期：{{ user.after.day }}
</div>
<div class="user-pic-block">
<t-image
class="user-pic"
fit="fill"
:src="user.after.picCover"
></t-image>
</div>
</div>
</div>
</div>
<div class="empty-bar"></div>
<div class="empty-bar"></div>
</template>
<script lang="ts" setup>
import { Icon as TIcon } from 'tdesign-icons-vue-next';
import { ref, onMounted } from 'vue';
import {useRouter} from 'vue-router'
import {labelList, userList} from '../api/user'
const router = useRouter()
const search = ref([])
const selectOption = (id) => {
let idList = search.value
if (idList.indexOf(id) > -1 ){
idList.splice(idList.indexOf(id), 1)
}else{
idList.push(id)
}
console.log()
search.value = idList
}
const toUserDetail = (id) => {
router.push({name: 'user_detail', params:{id}})
}
onMounted(() =>{
let idList = []
labelList.forEach(label => {
idList.push(label.id)
})
search.value = idList
})
</script>
<style lang="less">
.card {
position: relative;
margin: 16px;
border-radius: 6px;
// overflow: hidden;
box-sizing: border-box;
border: 1.5px solid var(--bg-color-demo, #fff);
border-color: var(--td-success-color-4);
}
.card--active {
border-color: var(--td-brand-color);
}
.card--active::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
width: 0;
border: 14px solid var(--td-success-color-4);
border-bottom-color: transparent;
border-right-color: transparent;
}
.card__icon {
color: var(--td-text-color-anti);
position: absolute;
left: 1.5px;
top: 1.5px;
z-index: 1;
}
/* 横向布局 */
.horizontal-box {
width: calc(100% - 32px);
display: flex;
align-items: start;
margin: 16px;
white-space: nowrap
}
.horizontal-box .card {
flex: 1;
margin: 0;
}
.horizontal-box .card + .card {
margin-left: 12px;
}
.horizontal-box .card::after {
border-width: 12px;
}
.horizontal-box .card__icon {
font-size: 12px;
}
.user-line{
width: calc(100vw - 8px);
border: 1px solid var(--td-success-color-4);
margin: 4px;
border-radius: 8px;
}
.user-pic-line{
display:flex;
border-top: 1px solid var(--td-success-color-4);
}
.user-line-block{
width: 50%;
}
.user-pic-block{
width: 100%;
}
.user-pic{
padding: 16px;
}
.user-day{
padding-top: 8px;
display: flex;
justify-content: center;
}
.user-label-line{
margin:16px;
}
.user-label{
margin: 4px;
padding: 4px 12px 4px 12px;
line-height: 36px;
border-radius: 16px;
color: #000;
white-space: nowrap;
border: 1px solid var(--td-success-color-4);
}
.user-label-active{
color: #fff;
background-color: var(--td-success-color-4);
}
.user-name-line{
border-bottom: 1px solid var(--td-success-color-4);
// border-radius: 8px;
}
.user-name{
border-radius: 8px;
}
.t-checkbox--block {
padding: 4px;
padding-left: 16px;
}
</style>

18
src/views/UserListView.vue
View File

@ -6,15 +6,17 @@
</div>
<div v-for="user in userList" class="user-line">
<div class="user-name-line">
<t-cell :title="`用户名：${user.username}`" class="user-name" note="查看详情" arrow @click="toUserDetail(user.id)"></t-cell>
<t-cell :title="`用户名：${user.name}`" class="user-name" note="查看详情" arrow @click="toUserDetail(user.id)"></t-cell>
<!-- <t-cell :title="`用户名：${user.name[0] + '*'.repeat(user.name.length - 1)}`" class="user-name" note="查看详情" arrow @click="toUserDetail(user.id)"></t-cell> -->
</div>
<div class="user-label-line">
<div class="user-label-line" v-if="user.labelList">
<span class="user-label user-label-active" v-for="label in user.labelList">{{ label.label }}</span>
</div>
<div class="user-pic-line">
<div class="user-pic-line" >
<div class="user-line-block user-before">
<div class="user-day">
<div class="user-day" v-if="user.before">
开始日期：{{ user.before.day }}
</div>
<div class="user-pic-block">
@ -22,19 +24,19 @@
class="user-pic"
fit="fill"
:src="user.before.picCover"
:src="user.body_images.bodyFront || user.body_images.bigHead"
></t-image>
</div>
</div>
<div class="user-line-block user-after">
<div class="user-day">
<div class="user-day" v-if="user.after">
结束日期：{{ user.after.day }}
</div>
<div class="user-pic-block">
<t-image
class="user-pic"
fit="fill"
:src="user.after.picCover"
:src="user.after_body_images.bodyFront || user.after_body_images.bigHead || user.after_body_images.leftPalm"
></t-image>
</div>
</div>
@ -47,7 +49,7 @@
import { Icon as TIcon } from 'tdesign-icons-vue-next';
import { ref, onMounted } from 'vue';
import {useRouter} from 'vue-router'
import {labelList, userList} from '../api/example'
import {labelList, userList} from '../api/user'
const router = useRouter()
const search = ref([])

2
vite.config.ts
View File

@ -11,7 +11,7 @@ import { babel } from '@rollup/plugin-babel'
export default defineConfig(({ command }) => {
// 生产构建时指向 CDN 地址，开发时保持 '/'
const base = command === 'build'
? 'https://images.health.ufutx.com/uftx_case'
? 'https://images.health.ufutx.com/dp_uftx_case'
: '/'
console.log('base', base)
return {