<template>
|
|
<view>
|
|
<view class="user-header">
|
|
<view class="flex flex-between login">
|
|
<view style="width: 120rpx;">
|
|
<up-image class="mr20" width="120rpx" height="120rpx" :src="userInfo.userImage"
|
|
shape="circle"></up-image>
|
|
</view>
|
|
|
|
<view style="width: calc(100% - 120rpx); padding-left: 20rpx;box-sizing: border-box;">
|
|
<view class="base-leavel">
|
|
<text>{{getIsLogin()?userInfo.userName:"欢迎来到版宠师"}}</text>
|
|
</view>
|
|
<view>
|
|
<image v-if="petMaster" class="role-tag" :src="petMaster" mode="aspectFill"></image>
|
|
<image v-if="partnerMaster" class="role-tag" :src="partnerMaster" mode="aspectFill"></image>
|
|
</view>
|
|
<view>
|
|
手机号:{{ userInfo?.userTelephone }}
|
|
</view>
|
|
</view>
|
|
|
|
<!-- <view style="width: 140rpx">
|
|
<up-button v-else @click="logout" :customStyle="{borderColor:'#fff'}" type="primary" text="退出登录"
|
|
shape="circle" color="#FFBF60"></up-button>
|
|
</view> -->
|
|
</view>
|
|
|
|
<view class="header-money">
|
|
<view class="header-money-list">
|
|
<view class="header-money-item flex flex-evenly">
|
|
<view style="text-align: center">
|
|
<view class="mb20 flex">
|
|
<!-- <up-image :show-loading="true" src="https://cdn.catmdogd.com/Work/image/work/icon4.png"
|
|
width="68rpx" height="68rpx"></up-image> -->
|
|
<up-image :show-loading="true" src="/static/images/user/q1.png"
|
|
style="margin-right: 14rpx;"
|
|
width="50rpx" height="50rpx"></up-image>
|
|
服务酬劳
|
|
</view>
|
|
<view class="mb20">{{ userInfo.price }}元</view>
|
|
<view class="flex flex-between but">
|
|
<view @click="toWithdrawDeposit">提现</view>
|
|
<view>|</view>
|
|
<view @click="toRunningWater">明细</view>
|
|
</view>
|
|
</view>
|
|
<view style="text-align: center">
|
|
<view class="mb20 flex">
|
|
<!-- <up-image :show-loading="true" src="https://cdn.catmdogd.com/Work/image/work/icon4.png"
|
|
width="68rpx" height="68rpx"></up-image> -->
|
|
|
|
<up-image :show-loading="true" src="/static/images/user/q2.png"
|
|
style="margin-right: 14rpx;"
|
|
width="50rpx" height="50rpx"></up-image>
|
|
|
|
保证金
|
|
</view>
|
|
<view class="mb20">{{ userInfo.baoPrice }}元</view>
|
|
<view @click="toBail" class="but">保证金中心</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="user-container">
|
|
<view class="bgf pd4 radius20 mb28">
|
|
<view class="mb28 flex flex-between">
|
|
<view class="font36">我的爱宠</view>
|
|
<view @click="toMyPet" style="color: #707070">更多 ></view>
|
|
</view>
|
|
<view>
|
|
|
|
|
|
<!-- <up-button v-if="getIsLogin()" class="mb20" size="large" style="width: 500rpx" type="primary"
|
|
text="请添加您的爱宠" shape="circle"
|
|
color="linear-gradient(to right, rgb(255 ,191 ,96 ,1), rgb(255, 51, 186))"></up-button> -->
|
|
|
|
|
|
<view v-if="isLogin && petList.length">
|
|
<scroll-view scroll-x class="pet-scroll-container" show-scrollbar="false">
|
|
<view class="pet-scroll-content">
|
|
<view class="cw-box radius20 pd20 flex pet-item"
|
|
v-for="(pet, inde) in petList"
|
|
@click="editPet(pet)"
|
|
:key="pet.id">
|
|
<up-image class="mr20" width="120rpx" style="flex-shrink: 0" height="120rpx"
|
|
:src="pet?.headImage" shape="circle"></up-image>
|
|
<view style="width: 280rpx">
|
|
<view class="font32 mb20 pet-name-container">
|
|
{{ pet.nickName }}
|
|
<text class="pet-gender" :class="{'pet-gender-male': pet.sex === 0, 'pet-gender-female': pet.sex === 1}">
|
|
{{ pet.sex === 0 ? '♂' : '♀' }}
|
|
</text>
|
|
</view>
|
|
<view class="font24 ellipsis">{{ pet.type }} | {{ pet.age }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
|
|
<view class="no-pet-tip radius20 pd20 flex" v-else>
|
|
<up-image class="mr20" width="80rpx" height="80rpx" src="https://image.hhlm1688.com/img/work/log/headImage.png" shape="circle"></up-image>
|
|
<view class="no-pet-text">您还没有添加您的爱宠信息呢</view>
|
|
<view class="add-pet-btn" @click="toMyPet">去添加</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="bgf pd40 radius20">
|
|
<view class="font36 mb28">服务中心</view>
|
|
<view class="flex flex-between font28 flex-wrap">
|
|
<view class="icon-list" @click="toNext">
|
|
<!-- <up-image class="mb20" src="https://cdn.catmdogd.com/Work/image/work/icon1.png" width="68rpx"
|
|
height="68rpx"></up-image> -->
|
|
|
|
<up-image class="mb20" src="/static/images/user/1.png" width="58rpx"
|
|
height="58rpx"></up-image>
|
|
<view>我的评价</view>
|
|
</view>
|
|
<view @click="platformProtocol" class="icon-list">
|
|
<!-- <up-image class="mb20" :show-loading="true"
|
|
src="https://cdn.catmdogd.com/Work/image/work/icon2.png" width="68rpx"
|
|
height="68rpx"></up-image> -->
|
|
|
|
<up-image class="mb20" src="/static/images/user/2.png" width="58rpx"
|
|
height="58rpx"></up-image>
|
|
<view>平台协议</view>
|
|
</view>
|
|
<button plain class="btn-share" open-type="contact">
|
|
<view class="icon-list">
|
|
<!-- <up-image class="mb20" :show-loading="true"
|
|
src="https://cdn.catmdogd.com/Work/image/work/icon3.png" width="68rpx"
|
|
height="68rpx"></up-image> -->
|
|
|
|
<up-image class="mb20" src="/static/images/user/4.png" width="58rpx"
|
|
height="58rpx"></up-image>
|
|
<view>联系客服</view>
|
|
</view>
|
|
</button>
|
|
<button plain class="btn-share" open-type="share">
|
|
<view class="icon-list">
|
|
<!-- <up-image class="mb20" :show-loading="true"
|
|
src="https://t9.baidu.com/it/u=2834693008,3232051400&fm=193" width="68rpx"
|
|
height="68rpx"></up-image> -->
|
|
|
|
<up-image class="mb20" src="/static/images/user/5.png" width="58rpx"
|
|
height="58rpx"></up-image>
|
|
<view>分享好友</view>
|
|
</view>
|
|
</button>
|
|
</view>
|
|
<!-- <view class="flex flex-between font28 flex-wrap mt20">
|
|
<view class="icon-list" @click="logout">
|
|
<up-image class="mb20"
|
|
src="https://cdn.catmdogd.com/2025/04/01ab556ca51d2a4f82896c1e6fd0034a8b7shDr3f7qeDQ527d93075294e7237cee8b6c7d613be8.png"
|
|
width="68rpx" height="68rpx" bgColor="#ffffff"></up-image>
|
|
<view>退出登录</view>
|
|
</view>
|
|
</view> -->
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<up-popup :show="show" @close="close" :round="10">
|
|
<view style="padding: 10rpx 20rpx;height: 50vh;overflow-y: scroll;" v-html="content"></view>
|
|
</up-popup>
|
|
|
|
<Modal @confirm="confirmLogout" @cancel="cancelLogout" ref="modal">
|
|
<template>
|
|
<view class="tip">
|
|
确认退出登录?
|
|
</view>
|
|
</template>
|
|
</Modal>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {
|
|
computed,
|
|
onMounted,
|
|
ref
|
|
} from "vue"
|
|
import {
|
|
getIsLogin,
|
|
getStorage,
|
|
getToken,
|
|
removeIsLogin
|
|
} from "../../utils/auth";
|
|
import { getLoginStatus } from "@/utils/useMixin.js"
|
|
import tab from "../../plugins/tab";
|
|
import Modal from "@/components/Modal/index.vue"
|
|
import {
|
|
useStore
|
|
} from "vuex"
|
|
import {
|
|
onShow,
|
|
onShareAppMessage,
|
|
} from "@dcloudio/uni-app"
|
|
import {
|
|
getpetList
|
|
} from "@/api/pet/index.js"
|
|
|
|
onShow(() => {
|
|
if (!getLoginStatus()) return;
|
|
getPet();
|
|
})
|
|
|
|
onMounted(() => {
|
|
content.value = configList.value?.['home_agreement']?.paramValueArea || ""
|
|
|
|
// 分享好友
|
|
onShareAppMessage(() => {
|
|
return {
|
|
title: configList.value.applet_info.paramValueText, // 分享标题
|
|
imageUrl: configList.value.applet_info.paramValueImage, // 分享图片地址,非必须
|
|
path: '/pages/workbenchManage/index', // 分享路径
|
|
};
|
|
})
|
|
})
|
|
|
|
const store = useStore();
|
|
const isLogin = ref(false)
|
|
const userInfo = computed(() => {
|
|
return store.getters.userInfo
|
|
})
|
|
const configList = computed(() => {
|
|
return store.getters.configList;;
|
|
})
|
|
const petList = ref([])
|
|
const show = ref(false)
|
|
const content = ref("")
|
|
const modal = ref(null)
|
|
|
|
const LEVEL_AND_KEY_FIELDS_MAPPING = {
|
|
'1': 'primary',
|
|
'2': 'intermediate',
|
|
'3': 'senior',
|
|
}
|
|
|
|
// 按伴宠师等级选中图标
|
|
const petMaster = computed(() => {
|
|
const { userBcs, userBcsRole } = userInfo.value
|
|
|
|
if (!userBcs) {
|
|
return ''
|
|
}
|
|
|
|
const key = `pet_${LEVEL_AND_KEY_FIELDS_MAPPING[userBcsRole]}`
|
|
|
|
return configList.value?.[key]?.paramValueImage
|
|
})
|
|
// 按合伙人等级选中图标
|
|
const partnerMaster = computed(() => {
|
|
const { userHh } = userInfo.value
|
|
|
|
if (!userHh) {
|
|
return ''
|
|
}
|
|
|
|
const key = `partner_${LEVEL_AND_KEY_FIELDS_MAPPING[userHh]}`
|
|
|
|
return configList.value?.[key]?.paramValueImage
|
|
})
|
|
|
|
if (getIsLogin() && getToken()) {
|
|
userInfo.value = getStorage("userInfo")
|
|
isLogin.value = true
|
|
}
|
|
|
|
const toNext = () => {
|
|
uni.navigateTo({
|
|
url: "/otherPages/orderTakingManage/evaluate/index"
|
|
})
|
|
}
|
|
|
|
const toRunningWater = () => {
|
|
uni.navigateTo({
|
|
url: "/otherPages/myOrdersManage/transaction/index"
|
|
})
|
|
}
|
|
|
|
const editPet = (item) => {
|
|
if (item.petType === '猫咪' || item.petType === 0) {
|
|
uni.navigateTo({
|
|
url: `/otherPages/userManage/pet/petInfo?petType=0&optionType=edit&petId=${item.id}`
|
|
})
|
|
}
|
|
if (item.petType === '狗狗' || item.petType === 1) {
|
|
uni.navigateTo({
|
|
url: `/otherPages/userManage/pet/petInfo?petType=1&optionType=edit&petId=${item.id}`
|
|
})
|
|
}
|
|
};
|
|
|
|
const getPet = async () => {
|
|
let response = await getpetList();
|
|
petList.value = response?.data || [];
|
|
}
|
|
|
|
const logout = () => {
|
|
modal.value.open();
|
|
}
|
|
|
|
// 跳转提现
|
|
const toWithdrawDeposit = () => {
|
|
uni.navigateTo({
|
|
url: "/otherPages/myOrdersManage/withdrawal/index"
|
|
})
|
|
}
|
|
|
|
//跳转保证金
|
|
const toBail = () => {
|
|
uni.navigateTo({
|
|
url: "/otherPages/myOrdersManage/bond/index"
|
|
})
|
|
}
|
|
|
|
// 跳转我的宠物
|
|
const toMyPet = () => {
|
|
uni.navigateTo({
|
|
url: '/otherPages/userManage/pet/index'
|
|
});
|
|
}
|
|
|
|
const close = () => {
|
|
show.value = false;
|
|
}
|
|
|
|
const confirmLogout = () => {
|
|
store.commit("setUserInfo", {});
|
|
uni.removeStorageSync("token")
|
|
uni.removeStorageSync("baseInfo")
|
|
removeIsLogin();
|
|
uni.navigateTo({
|
|
url: "/pages/login/index"
|
|
})
|
|
}
|
|
|
|
const platformProtocol = () => {
|
|
show.value = true;
|
|
}
|
|
|
|
const cancelLogout = () => {
|
|
// 取消退出登录回调
|
|
}
|
|
|
|
</script>
|
|
<style scoped lang="scss">
|
|
@import "index";
|
|
|
|
.tip {
|
|
text-align: center;
|
|
padding-bottom: 20rpx;
|
|
}
|
|
</style>
|