first commit

This commit is contained in:
Ls
2026-02-12 12:19:20 +08:00
commit 219fd9be5c
529 changed files with 169918 additions and 0 deletions

View File

@@ -0,0 +1,291 @@
<template>
<view v-if="loading" class="pure-css-skeleton">
<view style=" margin: 20rpx 0; padding: 20rpx; background-color: #fff; border-radius: 10rpx;">
<!-- 头像区域骨架 -->
<view class="avatar-skeleton-wrapper"
style="display: flex; flex-direction: column; justify-content: center; align-items: center;">
<view class="skeleton-circle animate-pulse"></view>
<view class="skeleton-text animate-pulse" style="margin-top: 15rpx;"></view>
</view>
<!-- 表单区域骨架 -->
<view class="form-skeleton-wrapper" style="margin-top: 30rpx;">
<!-- 昵称 -->
<view class="form-item-skeleton">
<view class="form-label-skeleton animate-pulse"></view>
<view class="form-input-skeleton animate-pulse"></view>
</view>
<!-- 性别 -->
<view class="form-item-skeleton">
<view class="form-label-skeleton animate-pulse"></view>
<view class="form-radio-skeleton">
<view class="radio-item-skeleton animate-pulse"></view>
<view class="radio-item-skeleton animate-pulse"></view>
</view>
</view>
<!-- 生日 -->
<view class="form-item-skeleton">
<view class="form-label-skeleton animate-pulse"></view>
<view class="form-input-skeleton animate-pulse"></view>
</view>
<!-- 手机号 -->
<view class="form-item-skeleton">
<view class="form-label-skeleton animate-pulse"></view>
<view class="form-input-skeleton animate-pulse"></view>
</view>
<!-- 邮箱 -->
<view class="form-item-skeleton">
<view class="form-label-skeleton animate-pulse"></view>
<view class="form-input-skeleton animate-pulse"></view>
</view>
</view>
<!-- 底部空间占位 -->
<view style="width: 100%; height: 200rpx;"></view>
</view>
<!-- 底部保存按钮骨架 -->
<view class="bottom-button-skeleton animate-pulse"></view>
</view>
<view v-else style=" margin: 20rpx; padding: 20rpx;">
<view @click="uploadFImg()" class=""
style=" display: flex; flex-direction: column; justify-content: center; align-items: center; ">
<img v-if="userInfo.headImg!=''" :src="Service.GetMateUrlByImg(userInfo.headImg)"
style="width: 140rpx; height: 140rpx; border-radius: 50%; " alt="" />
<view v-else class=""
style="background-color: #EBEBEB; width: 140rpx; height: 140rpx; border-radius: 50%; display: flex; align-items: center; justify-content: center; ">
<image :src="Service.GetIconImg('/static/index/my/edit/photo.png')"
style="width: 50rpx; height: 50rpx; " alt=""> </image>
</view>
<view class="" style="margin-top: 15rpx; font-size: 26rpx; color: #999999; ">
点击更换头像
</view>
</view>
<view class="" style=" margin-top: 30rpx; ">
<up-form labelWidth='140' labelPosition="left" :borderBottom="true" :model="userInfo" ref="form1">
<up-form-item label="姓名" prop="userInfo.name" ref="item1" :borderBottom="true">
<up-input readonly='true' inputAlign='right' v-model="userInfo.nick" border="none"></up-input>
</up-form-item>
<up-form-item label="性别" :borderBottom="true" style="position: relative;" prop="userInfo.sex">
<view class="" style=" position: absolute; top: 10rpx; right: 0; ">
<up-radio-group v-model="userInfo.sex" placement="row">
<up-radio v-for="(item, index) in radiolist1" activeColor='#FF6A00' :key="index"
iconPlacement="right" :label="item.name" :name="item.name">
</up-radio>
</up-radio-group>
</view>
</up-form-item>
<up-form-item label="年龄" :borderBottom="true" style="position: relative;" prop="userInfo.sex">
<up-input inputAlign='right' v-model="userInfo.age" border="none"></up-input>
</up-form-item>
<!-- <up-form-item label="手机号" :borderBottom="true" prop="userInfo.sex">
<up-input readonly='true' inputAlign='right' v-model="userInfo.phone" border="none"></up-input>
</up-form-item>
<up-form-item label="紧急联系人" :borderBottom="true" prop="userInfo.sex">
<up-input readonly='true' inputAlign='right' v-model="userInfo.phone" border="none"></up-input>
</up-form-item>
<up-form-item label="紧急联系人电话" :borderBottom="true" prop="userInfo.sex">
<up-input readonly='true' inputAlign='right' v-model="userInfo.phone" border="none"></up-input>
</up-form-item> -->
</up-form>
</view>
<view class="" style="width: 100%; height: 200rpx;">
</view>
<view class="" style=" width: 100% ; background-color: #fff; position: fixed; bottom: 15rpx; left: 0; ">
<view class="" @click="save()"
style=" margin: 0 20rpx; padding: 26rpx 0; color: #fff; display: flex; align-items: center; justify-content: center; border-radius: 60rpx; background-color: var(--nav-mian);">
保存信息
</view>
</view>
</view>
</template>
<script setup lang="ts">
import { onShow, onLoad } from "@dcloudio/uni-app";
import { Service } from '@/Service/Service';
import { ref } from "vue";
import { CNRiderDataService } from "@/Service/CN/CNRiderDataService"
let loading = ref(true)
let showDate = ref(false)
const userInfo = ref({
headImg: '',
age: '1',
sex: '',
phone: '1',
date: Date.now(),
nick: '大大怪将军'
})
let nowDate = ref()
const radiolist1 = ref([
{
name: '男',
disabled: false,
},
{
name: '女',
disabled: false,
}
]);
onLoad(() => {
getData()
});
onShow(() => {
nowDate.value = new Date()
});
const getData = () => {
CNRiderDataService.GetRiderInfo().then(res => {
loading.value = false
if (res.data) {
userInfo.value = res.data.riderInfo
}
})
}
const uploadFImg = () => {
uni.chooseImage({
count: 1, // 最多选择3张图片
sizeType: ['original', 'compressed'], // 支持原图和压缩图
sourceType: ['album', 'camera'], // 可从相册选择或使用相机拍照
success: function (res) {
let path = res.tempFiles[0].path
Service.uploadH5(path, 'Avatar', data => {
userInfo.value.headImg = data
})
},
fail: function (err) {
console.error('选择失败:', err.errMsg);
}
})
}
const save = () => {
if(!userInfo.value.age){
Service.Msg('请输入年龄!')
return
}
CNRiderDataService.UpdateRiderUnit(userInfo.value.headImg,userInfo.value.sex,Number(userInfo.value.age)).then(res=>{
if(res.data){
Service.Msg('修改成功!')
setTimeout(()=>{
Service.GoPageBack()
},1000)
}
})
}
</script>
<style lang="scss">
page {
background-color: #fff;
}
.pure-css-skeleton {
background-color: #f8f8f8;
}
/* 骨架屏基础样式 */
.skeleton-circle {
width: 140rpx;
height: 140rpx;
border-radius: 50%;
background-color: #e0e0e0;
}
.skeleton-text {
width: 120rpx;
height: 26rpx;
background-color: #e0e0e0;
border-radius: 4rpx;
}
.form-item-skeleton {
display: flex;
align-items: center;
padding: 20rpx 0;
border-bottom: 1px solid #f5f5f5;
position: relative;
}
.form-item-skeleton:last-child {
border-bottom: none;
}
.form-label-skeleton {
width: 90rpx;
height: 30rpx;
background-color: #e0e0e0;
border-radius: 4rpx;
}
.form-input-skeleton {
position: absolute;
right: 0;
width: 50%;
height: 30rpx;
background-color: #e0e0e0;
border-radius: 4rpx;
}
.form-radio-skeleton {
position: absolute;
right: 0;
display: flex;
gap: 20rpx;
}
.radio-item-skeleton {
width: 100rpx;
height: 30rpx;
background-color: #e0e0e0;
border-radius: 4rpx;
}
.bottom-button-skeleton {
position: fixed;
bottom: 15rpx;
left: 20rpx;
right: 20rpx;
height: 90rpx;
background-color: #e0e0e0;
border-radius: 60rpx;
}
/* 动画效果 - 不使用组件纯CSS实现 */
@keyframes pulse {
0% {
opacity: 1;
}
50% {
opacity: 0.6;
}
100% {
opacity: 1;
}
}
.animate-pulse {
animation: pulse 1.5s ease-in-out infinite;
}
</style>