第一次上传
This commit is contained in:
@@ -0,0 +1,173 @@
|
||||
<template>
|
||||
<view class="">
|
||||
<view class="" style="padding: 0rpx 30rpx; ">
|
||||
<up-form labelPosition="top" :model="userData" labelWidth='200rpx' ref="form1">
|
||||
<up-form-item label="姓名" prop="userInfo.name" ref="item1">
|
||||
<up-input v-model="userData.name" prefixIcon="account" placeholder="请输入姓名"
|
||||
:customStyle="{padding: '20rpx','background-color':'#F8F9FA','margin-top':'15rpx','border-radius':'16rpx'}"
|
||||
:prefixIconStyle="{fontSize:'50rpx' }" border="none"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="手机号" prop="userInfo.name" ref="item1">
|
||||
<up-input v-model="userData.phone"
|
||||
:customStyle="{padding: '20rpx','background-color':'#F8F9FA','margin-top':'15rpx','border-radius':'16rpx'}"
|
||||
prefix-icon="phone" type='number' placeholder="请输入手机号" :prefixIconStyle="{fontSize:'45rpx'}"
|
||||
border="none"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="所在地区" prop="userInfo.name" ref="item1">
|
||||
<view class="" @click="location()"
|
||||
style=" width: 100%; display: flex; align-items: center; justify-content: space-between; border-radius: 16rpx; margin-top: 15rpx; background-color: #F8F9FA;padding: 20rpx;">
|
||||
<view class="" style="display: flex;align-items: center;">
|
||||
<up-icon name="map" color="#606266" size="22"></up-icon>
|
||||
<view v-if="!userData.province" class="" style="color: #c0c4cc; margin-left: 10rpx; ">
|
||||
请选择地址
|
||||
</view>
|
||||
<view v-else class="" style=" margin-left: 10rpx; ">
|
||||
{{ userData.primaryAddress }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="">
|
||||
<up-icon name="arrow-right" color="#606266" size="20"></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
</up-form-item>
|
||||
<up-form-item label="详细地址" prop="userInfo.name" ref="item1">
|
||||
<up-textarea v-model="userData.address" style=" margin-top: 15rpx; background-color: #F8F9FA;"
|
||||
placeholder="请输入内容"></up-textarea>
|
||||
</up-form-item>
|
||||
</up-form>
|
||||
<view class=""
|
||||
style=" margin-top: 15rpx; display: flex; align-items: center; justify-content: space-between;">
|
||||
<view class="">
|
||||
设为默认地址
|
||||
</view>
|
||||
<view class="">
|
||||
<up-switch v-model="userData.isDefault" size='18' activeColor='var(--nav-mian)'
|
||||
@change="switchChange"></up-switch>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<!-- 新增地址按钮 -->
|
||||
<view class=""
|
||||
style="position: fixed; bottom: 0; width: 100%; padding: 20rpx; border-top: 1rpx solid #e2e2e2; background-color: #fff; ">
|
||||
<up-button @click="save()" color='var(--nav-mian)' shape='circle' style="width: 90%; margin: 15rpx auto 0; "
|
||||
:text="userData.addressId?' 修改地址':'保存地址'"></up-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { vpAddressService, Service } from '@/Service/vp/vpAddressService'
|
||||
import { onLoad } from '@dcloudio/uni-app';
|
||||
let userData = ref({
|
||||
addressId: '',
|
||||
phone: '',
|
||||
name: '',
|
||||
address: '',
|
||||
isDefault: false,
|
||||
province: '',
|
||||
city: '',
|
||||
region: '',
|
||||
primaryAddress: ''
|
||||
})
|
||||
|
||||
|
||||
onLoad((data : any) => {
|
||||
if (data.addressId) {
|
||||
userData.value.addressId = data.addressId
|
||||
uni.setNavigationBarTitle({
|
||||
title: '修改地址'
|
||||
})
|
||||
getData()
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
const getData = () => {
|
||||
vpAddressService.GetUserAddressInfo(userData.value.addressId).then(res => {
|
||||
if (res.code == 0) {
|
||||
userData.value = res.data.addressInfo
|
||||
userData.value.isDefault = res.data.addressInfo.isDefault == 1 ? true : false
|
||||
userData.value.primaryAddress = res.data.addressInfo.province + res.data.addressInfo.city + res.data.addressInfo.region
|
||||
} else {
|
||||
Service.Msg(res.msg)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const location = () => {
|
||||
uni.getLocation({
|
||||
type: 'wgs84',
|
||||
success: function (res) {
|
||||
uni.chooseLocation({
|
||||
latitude: res.latitude,
|
||||
longitude: res.longitude,
|
||||
success: function (res) {
|
||||
console.log(res);
|
||||
userData.value.province = res.address.split('省')[0] + '省'
|
||||
userData.value.city = res.address.split('省')[1].split('市')[0] + '市'
|
||||
userData.value.region = res.address.split('省')[1].split('市')[1].split('区')[0] + '区'
|
||||
userData.value.primaryAddress = userData.value.province + userData.value.city + userData.value.region
|
||||
userData.value.address = res.name
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
const switchChange = () => {
|
||||
|
||||
}
|
||||
|
||||
|
||||
const save = () => {
|
||||
if (userData.value.name == '') {
|
||||
Service.Msg('请输入姓名')
|
||||
return
|
||||
}
|
||||
if (userData.value.phone == '') {
|
||||
Service.Msg('请输入电话号')
|
||||
return
|
||||
}
|
||||
if (userData.value.province == '') {
|
||||
Service.Msg('请选择地址')
|
||||
return
|
||||
}
|
||||
if (userData.value.address == '') {
|
||||
Service.Msg('请输入详细地址')
|
||||
return
|
||||
}
|
||||
|
||||
let obj = {
|
||||
addressId: userData.value.addressId,
|
||||
name: userData.value.name,
|
||||
phone: userData.value.phone,
|
||||
province: userData.value.province,
|
||||
city: userData.value.city,
|
||||
region: userData.value.region,
|
||||
address: userData.value.address,
|
||||
isDefault: userData.value.isDefault ? 1 : 0
|
||||
}
|
||||
vpAddressService.UpdateAddress(obj).then(res => {
|
||||
if (res.code == 0) {
|
||||
Service.Msg( userData.value.addressId?'修改成功!': '添加成功!')
|
||||
setTimeout(() => {
|
||||
Service.GoPageBack()
|
||||
}, 1000)
|
||||
} else {
|
||||
Service.Msg(res.msg)
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #fff;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,133 @@
|
||||
<template>
|
||||
<view 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; ">
|
||||
<img :src="Service.GetIconImg('/static/userFunc/photo.png')" style="width: 50rpx; height: 50rpx; "
|
||||
alt="" />
|
||||
</view>
|
||||
<view class="" style="margin-top: 15rpx; font-size: 26rpx; color: #999999; ">
|
||||
点击更换头像
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="" style=" margin-top: 30rpx; ">
|
||||
<up-form labelWidth='90' labelPosition="left" :model="userInfo" ref="form1">
|
||||
<up-form-item label="昵称" prop="userInfo.name" :borderBottom="true" ref="item1">
|
||||
<up-input inputAlign='right' v-model="userInfo.nick" border="none"></up-input>
|
||||
</up-form-item>
|
||||
|
||||
<up-form-item label="性别" prop="userInfo.sex" :borderBottom="true">
|
||||
<view class="" style="position: relative;" >
|
||||
<view class="" style=" position: absolute; top: -8rpx; 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>
|
||||
</view>
|
||||
</up-form-item>
|
||||
<up-form-item label="生日" prop="userInfo.sex" :borderBottom="true" style="position: relative;" >
|
||||
<view @click="showDate=true" class="" style=" position: absolute; top: 25rpx; right: 0; display: flex; align-items: center; ">
|
||||
{{Service.formatDate(userInfo.date,2)}}
|
||||
<u-icon name="arrow-right" size="24rpx" color="#000"></u-icon>
|
||||
</view>
|
||||
</up-form-item>
|
||||
<up-form-item label="手机号" prop="userInfo.sex" :borderBottom="true">
|
||||
<up-input inputAlign='right' v-model="userInfo.phone" border="none"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="邮箱" prop="userInfo.sex" :borderBottom="true">
|
||||
<up-input inputAlign='right' v-model="userInfo.age" border="none"></up-input>
|
||||
</up-form-item>
|
||||
</up-form>
|
||||
</view>
|
||||
|
||||
<up-datetime-picker :show="showDate" @cancel="showDate=!showDate" @confirm="dateConfirm" v-model="userInfo.date" mode="date"></up-datetime-picker>
|
||||
<view class="" style="width: 100%; height: 200rpx;">
|
||||
|
||||
</view>
|
||||
<view class="" style=" width: 100% ; background-color: #fff; position: fixed; bottom: 15rpx; left: 0; ">
|
||||
<view class=""
|
||||
style=" margin: 0 20rpx; padding: 20rpx 0; color: #fff; display: flex; align-items: center; justify-content: center; border-radius: 10rpx; background-color: #FF6A00;">
|
||||
保存信息
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onShow, onLoad } from "@dcloudio/uni-app";
|
||||
import { Service } from '@/Service/Service';
|
||||
import { ref } from "vue";
|
||||
|
||||
|
||||
let showDate=ref(false)
|
||||
const userInfo = ref({
|
||||
headImg: '',
|
||||
age: '1',
|
||||
sex: '',
|
||||
phone: '1',
|
||||
date:Date.now(),
|
||||
nick: '大大怪将军'
|
||||
})
|
||||
|
||||
|
||||
const radiolist1 = ref([
|
||||
{
|
||||
name: '男',
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
name: '女',
|
||||
disabled: false,
|
||||
}
|
||||
]);
|
||||
|
||||
|
||||
onLoad(() => {
|
||||
|
||||
});
|
||||
|
||||
onShow(() => {
|
||||
|
||||
});
|
||||
|
||||
const dateConfirm=(e)=>{
|
||||
showDate.value=!showDate.value
|
||||
userInfo.value.date=e.value
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
const uploadFImg = () => {
|
||||
uni.chooseImage({
|
||||
count: 1, // 最多选择3张图片
|
||||
sizeType: ['original', 'compressed'], // 支持原图和压缩图
|
||||
sourceType: ['album', 'camera'], // 可从相册选择或使用相机拍照
|
||||
success: function (res) {
|
||||
let path = res.tempFiles[0].path
|
||||
userInfo.value.headImg=path
|
||||
// Service.uploadH5(path, 'Avatar', data => {
|
||||
// userInfo.value.headImg = data.split(',')[2].split(':')[1].split('"')[1]
|
||||
// })
|
||||
|
||||
},
|
||||
fail: function (err) {
|
||||
console.error('选择失败:', err.errMsg);
|
||||
}
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #fff;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,24 @@
|
||||
@mixin get-styles($k,$c) {
|
||||
@if $k == size or $k == weight{
|
||||
font-#{$k}:#{$c}
|
||||
}@else{
|
||||
#{$k}:#{$c}
|
||||
}
|
||||
}
|
||||
|
||||
@each $key, $child in $uni-headings {
|
||||
/* #ifndef APP-NVUE */
|
||||
.uni-#{$key} {
|
||||
@each $k, $c in $child {
|
||||
@include get-styles($k,$c)
|
||||
}
|
||||
}
|
||||
/* #endif */
|
||||
/* #ifdef APP-NVUE */
|
||||
.container .uni-#{$key} {
|
||||
@each $k, $c in $child {
|
||||
@include get-styles($k,$c)
|
||||
}
|
||||
}
|
||||
/* #endif */
|
||||
}
|
||||
@@ -0,0 +1,311 @@
|
||||
<template>
|
||||
<view class="favorites-page">
|
||||
<!-- 沉浸式状态栏 -->
|
||||
<view class="status-bar"></view>
|
||||
|
||||
<!-- 顶部导航栏 -->
|
||||
<view class="nav-bar">
|
||||
<image class="back-icon" src="/static/icons/back.svg" @click="goBack" mode="aspectFit" />
|
||||
<text class="nav-title">我的收藏</text>
|
||||
<view class="nav-placeholder"></view>
|
||||
</view>
|
||||
|
||||
<!-- 收藏列表 -->
|
||||
<view class="content">
|
||||
<view v-if="collectList.length > 0" class="favorites-list">
|
||||
<view v-for="item in collectList" :key="item.merchId" class="shop-card" @click="Service.GoPage('/pages/community/merchantDetail?merchId='+item.merchId)">
|
||||
<!-- 店铺图片 -->
|
||||
<image class="shop-image" :src="Service.GetMateUrlByImg(item.logo)" mode="aspectFill" />
|
||||
|
||||
<!-- 店铺信息 -->
|
||||
<view class="shop-info">
|
||||
<text class="shop-name">{{ item.name }}</text>
|
||||
<view class="shop-meta">
|
||||
<text class="ri-star-fill rating-icon"></text>
|
||||
<text class="rating-text">{{ Number(item.score ).toFixed(1)}}分</text>
|
||||
<text class="sales-text">月售{{ item.sale }}</text>
|
||||
</view>
|
||||
<view class="shop-tags">
|
||||
<view v-for="(coupon, idx) in item.tips" :key="idx" :class="getTagClass(coupon)" style="font-size: 24rpx;"
|
||||
class="shop-tag">
|
||||
{{ coupon }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 取消收藏按钮 -->
|
||||
<view class="cancel-btn" @click.stop="cancelFavorite(item)">
|
||||
<up-icon name="heart-fill" color="#fc5151" :bold="true" size="18"></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
<up-loadmore :status="status" />
|
||||
</view>
|
||||
|
||||
<!-- 空状态 -->
|
||||
<view v-else class="empty-state">
|
||||
<text class="ri-heart-line empty-icon"></text>
|
||||
<text class="empty-text">暂无收藏店铺</text>
|
||||
<text class="empty-desc">去首页逛逛，收藏喜欢的店铺吧</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {onShow,onLoad,onReachBottom} from "@dcloudio/uni-app";
|
||||
import {Service} from "@/Service/Service"
|
||||
import { ref, computed } from "vue";
|
||||
import { vpDiscountService } from "@/Service/vp/vpDiscountService"
|
||||
import { vpUserService } from "@/Service/vp/vpUserService"
|
||||
|
||||
|
||||
let collectList = ref<Array<any>>([])
|
||||
let status = ref<string>('loadmore')
|
||||
let pageNo = ref<number>(1)
|
||||
let longitude=ref(0)
|
||||
let latitude=ref(0)
|
||||
|
||||
|
||||
onLoad(()=>{
|
||||
getLocation()
|
||||
})
|
||||
onReachBottom(()=>{
|
||||
getList()
|
||||
})
|
||||
|
||||
// 返回
|
||||
const goBack = () => {
|
||||
Service.GoPageBack()
|
||||
}
|
||||
|
||||
|
||||
const getLocation = () => {
|
||||
uni.getLocation({
|
||||
type: 'wgs84',
|
||||
success: function (res) {
|
||||
longitude.value = res.longitude
|
||||
latitude.value = res.latitude
|
||||
getData()
|
||||
},
|
||||
fail: function (e) {
|
||||
console.log(e);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const getData=()=>{
|
||||
pageNo.value=1
|
||||
status.value='loadmore'
|
||||
collectList.value=[]
|
||||
getList()
|
||||
}
|
||||
|
||||
const getList=()=>{
|
||||
if (status.value !== 'loadmore') {
|
||||
return
|
||||
}
|
||||
status.value = 'loading'
|
||||
vpUserService.GetUserCollectList(longitude.value,latitude.value,pageNo.value).then(res=>{
|
||||
if(res.code==0){
|
||||
collectList.value=[...collectList.value,...res.data.collectList]
|
||||
status.value=res.data.collectList.length==10?'loadmore':'nomore'
|
||||
pageNo.value++
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 根据标签文本获取样式类
|
||||
const getTagClass = (tagText : string) => {
|
||||
const tagMap = {
|
||||
'可用积分': 'tag-points-available',
|
||||
'可用券': 'tag-coupon'
|
||||
}
|
||||
return tagMap[tagText] || 'tag-points'
|
||||
}
|
||||
|
||||
|
||||
// 取消收藏
|
||||
const cancelFavorite = (item:any) => {
|
||||
uni.showModal({
|
||||
title: '取消收藏',
|
||||
content: `确定取消收藏吗？`,
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
vpUserService.CollectMerch(item.merchId).then(res=>{
|
||||
if(res.code==0){
|
||||
getData()
|
||||
}else{
|
||||
Service.Msg(res.msg)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.favorites-page {
|
||||
min-height: 100vh;
|
||||
background: #F5F5F5;
|
||||
}
|
||||
|
||||
.action-pill-icon {
|
||||
font-size: 28rpx;
|
||||
color: #FF6B00;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
/* 状态栏 */
|
||||
.status-bar {
|
||||
background: linear-gradient(135deg, #FF6B00, #FF9500);
|
||||
height: var(--status-bar-height);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* 导航栏 */
|
||||
.nav-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 60rpx 24rpx 20rpx 24rpx;
|
||||
background: linear-gradient(135deg, #FF6B00, #FF9500);
|
||||
}
|
||||
|
||||
.back-icon {
|
||||
width: 48rpx;
|
||||
height: 48rpx;
|
||||
padding: 8rpx;
|
||||
}
|
||||
|
||||
.nav-title {
|
||||
font-size: 36rpx;
|
||||
font-weight: 600;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.nav-placeholder {
|
||||
width: 48rpx;
|
||||
}
|
||||
|
||||
/* 内容区域 */
|
||||
.content {
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
/* 收藏列表 */
|
||||
.favorites-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
.shop-card {
|
||||
background: #FFFFFF;
|
||||
border-radius: 16rpx;
|
||||
padding: 20rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.04);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.shop-image {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
border-radius: 12rpx;
|
||||
margin-right: 20rpx;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.shop-info {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12rpx;
|
||||
}
|
||||
|
||||
.shop-name {
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #222222;
|
||||
}
|
||||
|
||||
.shop-meta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8rpx;
|
||||
}
|
||||
|
||||
.rating-icon {
|
||||
font-size: 24rpx;
|
||||
color: #FFB800;
|
||||
}
|
||||
|
||||
.rating-text {
|
||||
font-size: 24rpx;
|
||||
color: #FF6B00;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.sales-text {
|
||||
font-size: 22rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.shop-tags {
|
||||
display: flex;
|
||||
gap: 12rpx;
|
||||
}
|
||||
|
||||
.tag {
|
||||
font-size: 20rpx;
|
||||
color: #666666;
|
||||
background: #F5F5F5;
|
||||
padding: 4rpx 12rpx;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
|
||||
.cancel-btn {
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
background: #FFEBEE;
|
||||
border-radius: 32rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-left: 16rpx;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.cancel-icon {
|
||||
font-size: 32rpx;
|
||||
color: #F44336;
|
||||
}
|
||||
|
||||
/* 空状态 */
|
||||
.empty-state {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 200rpx 0;
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
.empty-icon {
|
||||
font-size: 120rpx;
|
||||
color: #CCCCCC;
|
||||
}
|
||||
|
||||
.empty-text {
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.empty-desc {
|
||||
font-size: 24rpx;
|
||||
color: #CCCCCC;
|
||||
}
|
||||
</style>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 678 B |
Reference in New Issue
Block a user