yangjun
/
sadjv3_user
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

接口联调

This commit is contained in:
Mr.jiang 2024-06-15 09:08:10 +08:00
parent 503151400f
commit fec021a9ea
54 changed files with 5795 additions and 356 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
App.vue
View File

@ -486,7 +486,9 @@
@import "uview-ui/index.scss";
@import 'components/colorui/main.css';
@import 'components/colorui/icon.css';
// /deep/uni-page-body{
// background-color: #f7f7f7 !important;
// }
page {
background-color: #FFFFFF;
color: #343546;

452
my/gird/shoucang - 副本.vue Normal file
View File

@ -0,0 +1,452 @@
<template>
<view class="content">
<view style="padding-top: 1rpx;" v-if="orderList.length">
<view class="flex align-center margin-bottom-sm bg padding-sm radius margin-sm"
v-for="(item,index) in orderList" :key='index' @click="goOrderDetail(item)"
style="box-shadow: 6rpx 10rpx 4px #F5F5F5;position: relative;">
<view style="position: absolute;z-index: 99;top: 0rpx;left: 0;" v-if="item.isGoods == 1">
<image
src="https://admin.sjajk.com/file/uploadPath/2023/02/16/c551f3f0721aec54208011e6948a57cd.png"
style="width: 42rpx;height: 36rpx;"></image>
</view>
<view style="width: 170upx;height: 170upx;border-radius: 10rpx;position: relative;">
<image :src="item.artificerImg?item.artificerImg: '../../static/logo.png'"
@click.stop="saveImgs(item.artificerImg)"
style="width: 170upx;height: 170upx;border-radius: 50%;" mode="aspectFill"></image>
<image v-if="item.isHot == 1"
src="https://admin.sjajk.com/file/uploadPath/2023/02/16/9ae1b7e9fa931b5fc24cd8edecc10d9f.png"
style="width: 30rpx;height: 36rpx;position: absolute;z-index: 99;top: 40rpx;left: 110rpx;">
</image>
<view class="zpmore_view" v-if="item.lifePhoto" @click.stop="saveImgss(item.lifePhoto,0)">更多照片</view>
</view>
<view class="margin-left flex flex-direction" style="width: 85%;">
<view class="flex align-center" style="justify-content: start;">
<view class="flex align-center" style="width: 120rpx;">
<view class="text-bold text-30 margin-right-xs" style="width: 100rpx;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">{{item.artificerName}}</view>
<!-- <image
src="https://admin.sjajk.com/file/uploadPath/2023/02/16/d45855dcf1e01210a4224a408225e8e0.png"
style="width: 40rpx;height:40rpx;">
</image> -->
</view>
<view class="" style="width: 150rpx;">
<view class="flex align-center" v-if="item.tripWay != 3" style="width: 150rpx;">
<image src="../../static/images/address.png" style="width: 24rpx;height: 24rpx;"></image>
<view style="color: #333333;margin-left: 8rpx;">{{item.distance}}</view>
</view>
</view>
<view class="kyy_view" v-if="item.state == 1">可服务</view>
<view class="kfw_view" v-else-if="item.state == 2">可预约</view>
<view class="byy_view" v-else>休息中</view>
</view>
<view class="flex" style="margin: 16rpx 0 6px 0;justify-content: start;">
<view class="flex align-center" style="width: 120rpx;">
<view v-if="item.ordersScore" class="margin-right-sm">
<image src="../../static/images/start.png" style="width: 24upx;height: 22upx;">
</image>
<text class="margin-left-xs" style="color: #FF1200;">{{item.ordersScore}}.0</text>
</view>
<!-- <view style="color: #999999;">已服务:{{item.ordersCount}}单</view> -->
</view>
<view class="flex align-center" style="width: 150rpx;">
<image src="../../static/images/pinglun.png" style="width: 24rpx;height: 24rpx;"></image>
<view style="margin-left: 10rpx;color: #999;font-size: 26rpx;">
{{item.commentCount ? item.commentCount : 0}}
</view>
</view>
<view class="flex align-center">
<image src="../../static/images/aixin2.png" style="width: 24rpx;height: 24rpx;margin-left: 40rpx;"></image>
<view style="margin-left: 10rpx;color: #999;font-size: 26rpx;">
{{item.collectCount ? item.collectCount : 0}}
</view>
</view>
</view>
<view style="width: 100%;display: flex;justify-content: start;align-items: center;">
<view class="flex flex-wrap align-center" style="width: 120rpx;">
<image src="../../static/images/shangjia.png" style="width: 24rpx;height: 24rpx;"></image>
<view style="margin-left: 10rpx;color: #999;font-size: 26rpx;">商家</view>
</view>
<view class="flex align-center" style="width: 260rpx;">
<image src="../../static/images/time.png" style="width: 26rpx;height: 26rpx;"></image>
<view class="zz_view" v-if="item.status == 1 && item.time">最早可约{{item.time}}</view>
</view>
<view class="flex" style="font-size: 24rpx;color: #f49650;font-weight: bold;" v-if="item.tripWay == 3">
免出行费
</view>
</view>
<view class="text-center text-sm" v-if="item.status == 1"
style="background: linear-gradient(to right, #223845, #00a85b);color: #ffffff;width: 100%;border-radius: 30upx;height: 60upx;line-height: 60upx;margin-top: 20rpx;"
@click.stop="goOrderDetail(item)">
立即预约
</view>
<view class="text-center text-sm" v-else
style="background: #d9d9d9;color: #ffffff;width: 100%;border-radius: 30upx;height: 60upx;line-height: 60upx;margin-top: 20rpx;">
立即预约
</view>
</view>
</view>
</view>
<empty v-if="orderList.length == 0"></empty>
<!-- <u-skeleton :loading="loading" :animation="true" elColor='#FFFFFF' bgColor='#FFFFFF'></u-skeleton> -->
</view>
</template>
<script>
import empty from '@/components/empty.vue'
export default {
components: {
empty,
},
data() {
return {
loading: true, // 是否显示骨架屏组件
game: [],
orderList: [],
isVip: false,
myId: uni.getStorageSync('userId') ? uni.getStorageSync('userId') : '',
showModal: true,
arr: [],
tab: '',
massageTypeId: '',
page: 1,
limit: 10,
latitude: '',
XCXIsSelect:'否',
longitude: ''
}
},
onLoad(e) {
let that = this
that.XCXIsSelect = this.$queue.getData("XCXIsSelect");
console.log("shouchang",that.XCXIsSelect)
uni.getLocation({
type: 'gcj02',
geocode: true, //设置该参数为true可直接获取经纬度及城市信息
success: function(res) {
console.log(res, '地理位置')
that.latitude = res.latitude
that.longitude = res.longitude
// uni.setStorageSync('latitude', res.latitude)
// uni.setStorageSync('longitude', res.longitude)
that.getData(that.latitude, that.longitude)
},
fail: function() {
console.log('获取地址失败')
}
})
that.getData(139.2222,46.3333)
},
onShow() {
if(this.latitude && this.longitude){
this.getData(this.latitude, this.longitude)
}
},
methods: {
saveImgss(imgs, index) {
console.log(imgs, index)
// let that = this
let imgArr = imgs
// this.imgArr.push(imgs);
// console.log(this.imgArr)
// //预览图片
uni.previewImage({
urls: imgArr,
current: imgArr[index]
});
},
saveImgs(imgs) {
let imgArr = [];
imgArr.push(imgs);
// //预览图片
uni.previewImage({
urls: imgArr,
current: 0
});
},
getData(latitude, longitude) {
let data = {
page: this.page,
limit: this.limit,
latitude: latitude,
longitude: longitude,
}
this.$Request.get("/app/artificer/selectCollectList", data).then(res => {
this.loading = false;
if (res.code == 0) {
for (var i = 0; i < res.data.list.length; i++) {
if (res.data.list[i].distance > 1000) {
res.data.list[i].distance = (res.data.list[i].distance / 1000).toFixed(1) +
'km'
} else {
res.data.list[i].distance = (res.data.list[i].distance).toFixed(1) + 'm'
}
if (res.data.list[i].lifePhoto) {
res.data.list[i].lifePhoto = res.data.list[i].lifePhoto.split(',')
}
}
if (this.page == 1) {
this.orderList = res.data.list
} else {
this.orderList = [...this.orderList, ...res.data.list]
}
}
}).catch(() => {
//联网失败, 结束加载
// this.mescroll.endErr();
});
},
// 跳转订单
goOrder(e) {
let token = this.$queue.getData('token');
if (token) {
uni.navigateTo({
url: "/pages/index/order/orderDet?artificerId=" + e.artificerId + '&massageTypeId=' + this
.massageTypeId
})
} else {
uni.navigateTo({
url: '/pages/public/login'
});
}
},
goOrderDetail(e) {
uni.navigateTo({
url: "/pages/therapist/orderDetail?artificerId=" + e.artificerId + '&massageTypeId=' + this
.massageTypeId
})
}
},
onReachBottom: function() {
this.page = this.page + 1;
this.getData(this.latitude, this.longitude)
},
onPullDownRefresh: function() {
this.page = 1;
this.getData(this.latitude, this.longitude)
setTimeout(d => {
uni.stopPullDownRefresh();
}, 3000);
},
}
</script>
<style lang="scss">
.content {
width: 100%;
height: 100vh;
background-color: #F7F7F7;
}
.zz_view {
color: #333333;
font-size: 24rpx;
padding: 6rpx 10rpx;
border-radius: 10rpx;
}
.zpmore_view {
position: absolute;
bottom: -20rpx;
left: 14rpx;
color: #f9f3d3;
background: linear-gradient(to right, #0a0c16, #4d4d53);
width: 130upx;
text-align: center;
border-radius: 30rpx;
height: 42rpx;
line-height: 42rpx;
font-size: 24rpx;
margin-left: 10rpx;
}
.byy_view {
background: #ebebeb;
width: 100upx;
text-align: center;
border-radius: 50rpx;
height: 40rpx;
line-height: 40rpx;
font-size: 24rpx;
color: #000000;
// border: 3upx solid #999999;
margin-top: 6rpx;
margin-left: 40rpx;
}
.kfw_view {
background: #ffaa00;
width: 100upx;
text-align: center;
border-radius: 50rpx;
height: 40rpx;
line-height: 40rpx;
font-size: 24rpx;
color: #FFFFFF;
margin-top: 6rpx;
margin-left: 40rpx;
}
.kyy_view {
background: #096f4b;
width: 100upx;
text-align: center;
border-radius: 50rpx;
height: 40rpx;
line-height: 40rpx;
font-size: 24rpx;
color: #FFFFFF;
margin-top: 6rpx;
margin-left: 40rpx;
}
.bg {
background: #FFFFFF;
}
.ytp_view {
background: #e3e3e3;
width: 400rpx;
border-radius: 10rpx;
font-size: 28rpx;
text-align: center;
height: 80rpx;
line-height: 80rpx;
color: #848484;
margin-top: 40rpx;
}
.tp_view {
background: #ee6c54;
width: 400rpx;
border-radius: 10rpx;
font-size: 28rpx;
text-align: center;
height: 80rpx;
line-height: 80rpx;
color: #FFFFFF;
margin-top: 40rpx;
}
.sticky-tabs {
z-index: 990;
position: sticky;
top: var(--window-top);
// background-color: #fff;
}
/* // 使用mescroll-uni,则top为0 */
.mescroll-uni,
/deep/.mescroll-uni {
.sticky-tabs {
top: 0;
}
}
.demo-tip {
padding: 18upx;
font-size: 24upx;
text-align: center;
}
.line_s {
display: inline-flex;
width: 10rpx;
height: 10rpx;
background: #1AD566;
border-radius: 50%;
margin-right: 10rpx;
}
.line_x {
display: inline-flex;
width: 10rpx;
height: 10rpx;
background: #000000;
border-radius: 50%;
margin-right: 10rpx;
}
.box {
// border: 3rpx solid #005dff;
background: #E8FAE1;
color: #096f4b;
padding: 5rpx 15rpx;
font-size: 26rpx;
letter-spacing: 2rpx;
border-radius: 8rpx;
// margin-top: 10rpx;
margin-right: 8upx;
}
.actve {
font-size: 30rpx;
font-family: PingFang SC;
font-weight: 800;
color: #20C675;
}
.tabview1 {
padding: 20rpx 20rpx;
// width: 686upx;
// height: 100upx;
background: #FFFFFF;
// margin-top: -50upx;
// z-index: 99;
// display: flex;
// line-height: 100upx;
.tabview {
// width: 686upx;
// // height: 100upx;
background: #F2FFF9;
border-radius: 24rpx 24rpx 0 0;
// margin-top: -50upx;
// z-index: 99;
display: flex;
line-height: 100upx;
.tabItem_sel {
font-size: 30upx;
font-family: PingFang SC;
font-weight: 800;
color: #20C675;
flex: 1;
text-align: center;
}
.tabItem {
font-size: 26upx;
font-family: PingFang SC;
font-weight: 500;
color: #333333;
flex: 1;
text-align: center;
}
}
.tabsx {
width: 686upx;
border-radius: 24rpx;
padding-bottom: 10rpx;
display: flex;
align-items: center;
justify-content: space-between;
padding: 20rpx 30rpx;
font-size: 26rpx;
.active {
color: #20C675;
font-size: 30rpx;
font-weight: bold;
}
}
}
</style>

265
my/gird/shoucang.vue
View File

@ -1,18 +1,17 @@
<template>
<view class="">
<view class="content">
<view style="padding-top: 1rpx;" v-if="orderList.length">
<view class="flex align-center margin-bottom-sm bg padding-sm radius margin-sm"
<view class="flex align-center margin-bottom-sm bg margin-sm content-list"
v-for="(item,index) in orderList" :key='index' @click="goOrderDetail(item)"
style="box-shadow: 6rpx 10rpx 4px #F5F5F5;position: relative;">
<view style="position: absolute;z-index: 99;top: 0rpx;left: 0;" v-if="item.isGoods == 1">
<image
src="https://admin.sjajk.com/file/uploadPath/2023/02/16/c551f3f0721aec54208011e6948a57cd.png"
<image src="https://admin.sjajk.com/file/uploadPath/2023/02/16/c551f3f0721aec54208011e6948a57cd.png"
style="width: 42rpx;height: 36rpx;"></image>
</view>
<view style="width: 170upx;height: 170upx;border-radius: 10rpx;position: relative;">
<view class="content-img">
<image :src="item.artificerImg?item.artificerImg: '../../static/logo.png'"
@click.stop="saveImgs(item.artificerImg)"
style="width: 170upx;height: 170upx;border-radius: 50%;" mode="aspectFill"></image>
mode="aspectFill"></image>
<image v-if="item.isHot == 1"
src="https://admin.sjajk.com/file/uploadPath/2023/02/16/9ae1b7e9fa931b5fc24cd8edecc10d9f.png"
style="width: 30rpx;height: 36rpx;position: absolute;z-index: 99;top: 40rpx;left: 110rpx;">
@ -20,63 +19,83 @@
<view class="zpmore_view" v-if="item.lifePhoto" @click.stop="saveImgss(item.lifePhoto,0)">更多照片</view>
</view>
<view class="margin-left flex flex-direction" style="width: 85%;">
<view class="flex align-center" style="justify-content: start;">
<view class="flex align-center" style="width: 120rpx;">
<view class="text-bold text-30 margin-right-xs" style="width: 100rpx;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">{{item.artificerName}}</view>
<!-- <image
src="https://admin.sjajk.com/file/uploadPath/2023/02/16/d45855dcf1e01210a4224a408225e8e0.png"
style="width: 40rpx;height:40rpx;">
</image> -->
<view class="flex align-center" style="justify-content: space-between;">
<view class="flex align-center">
<view class="text-bold text-30 margin-right-xs" style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">
{{item.artificerName}}
</view>
<image class="dituzhaoren" src="../../static/dituzhaoren2.png" mode=""></image>
</view>
<view class="" style="width: 150rpx;">
<view class="flex align-center" v-if="item.tripWay != 3" style="width: 150rpx;">
<image src="../../static/images/address.png" style="width: 24rpx;height: 24rpx;"></image>
<view style="color: #333333;margin-left: 8rpx;">{{item.distance}}</view>
<view class="shou-top">
<view class="shou-top-btn" :class="[item.state == 1 || item.state == 2?'kfw_view':'byy_view']">
{{item.state == 1?'可服务':item.state == 2?'可预约':'休息中'}}
</view>
<view class="zz_view" v-if="item.status == 1 && item.time">
{{item.time}}
</view>
</view>
<view class="kyy_view" v-if="item.state == 1">可服务</view>
<view class="kfw_view" v-else-if="item.state == 2">可预约</view>
<view class="byy_view" v-else>休息中</view>
</view>
<view class="list-right-top-bottom">
正规绿色服务!擅长精油SPA、中式推拿，有按摩师证，手法专业，期待正规绿色服务!擅长精油SPA、中式推拿正规绿色服务!擅长精油SPA、中式推拿
</view>
<view class="flex" style="margin: 16rpx 0 6px 0;justify-content: start;">
<view class="flex align-center" style="width: 120rpx;">
<view v-if="item.ordersScore" class="margin-right-sm">
<image src="../../static/images/start.png" style="width: 24upx;height: 22upx;">
</image>
<text class="margin-left-xs" style="color: #FF1200;">{{item.ordersScore}}.0</text>
<view class="flex align-center">
<view class="flex align-center margin-right-sm">
<view>
<image class="pinglun" src="../../static/dituzhaoren3.png" mode="">
</image>
<span class="icon-text">评论</span>
</view>
<!-- <image src="../../static/images/pinglun.png" style="width: 24rpx;height: 24rpx;"></image> -->
<view style="margin-left: 10rpx;color: #222;font-size: 26rpx;">
22222{{item.commentCount ? item.commentCount : 0}}
</view>
</view>
<view v-if="item.ordersScore" class="flex align-center">
<view>
<image class="shouc-img" src="../../static/dituzhaoren4.png" mode="">
</image>
<span class="icon-text">收藏</span>
</view>
<text class="margin-left-xs" style="color: #222;">11111{{item.ordersScore}}.0</text>
</view>
<!-- <view style="color: #999999;">已服务:{{item.ordersCount}}单</view> -->
</view>
<view class="flex align-center" style="width: 150rpx;">
<image src="../../static/images/pinglun.png" style="width: 24rpx;height: 24rpx;"></image>
<view style="margin-left: 10rpx;color: #999;font-size: 26rpx;">
{{item.commentCount ? item.commentCount : 0}}
</view>
</view>
<view class="flex align-center">
<!-- <view class="flex align-center">
<image src="../../static/images/aixin2.png" style="width: 24rpx;height: 24rpx;margin-left: 40rpx;"></image>
<view style="margin-left: 10rpx;color: #999;font-size: 26rpx;">
{{item.collectCount ? item.collectCount : 0}}
</view>
</view>
</view> -->
</view>
<view style="width: 100%;display: flex;justify-content: start;align-items: center;">
<!-- <view style="width: 100%;display: flex;justify-content: start;align-items: center;">
<view class="flex flex-wrap align-center" style="width: 120rpx;">
<image src="../../static/images/shangjia.png" style="width: 24rpx;height: 24rpx;"></image>
<view style="margin-left: 10rpx;color: #999;font-size: 26rpx;">商家</view>
</view>
<view class="flex align-center" style="width: 260rpx;">
<image src="../../static/images/time.png" style="width: 26rpx;height: 26rpx;"></image>
<view class="zz_view" v-if="item.status == 1 && item.time">最早可约{{item.time}}</view>
</view>
<view class="flex" style="font-size: 24rpx;color: #f49650;font-weight: bold;" v-if="item.tripWay == 3">
免出行费
</view>
</view> -->
<view class="therapist-mian-bottom">
<view class="flex flex-wrap align-center">
<image class="therapist-bottom-img" src="../../static/dituzhaoren5.png">
</image>
<view class="therapist-mian-bottom-text">春城有约</view>
</view>
<view class="flex align-center" v-if="item.tripWay != 3" >
<image class="therapist-bottom-dingwei" src="../../static/dituzhaoren6.png"></image>
<view class="therapist-bottom-dingwei-text">
{{ item.distance }}
</view>
</view>
</view>
<view class="text-center text-sm" v-if="item.status == 1"
style="background: linear-gradient(to right, #223845, #00a85b);color: #ffffff;width: 100%;border-radius: 30upx;height: 60upx;line-height: 60upx;margin-top: 20rpx;"
style="background: linear-gradient(90deg, #019C88, #0FA78B, #35C495);color: #ffffff;width: 100%;border-radius: 30upx;height: 60upx;line-height: 60upx;margin-top: 10rpx;"
@click.stop="goOrderDetail(item)">
立即预约
</view>
@ -120,6 +139,7 @@
onLoad(e) {
let that = this
that.XCXIsSelect = this.$queue.getData("XCXIsSelect");
console.log("shouchang",that.XCXIsSelect)
uni.getLocation({
type: 'gcj02',
geocode: true, //设置该参数为true可直接获取经纬度及城市信息
@ -137,7 +157,7 @@
}
})
that.getData(139.2222,46.3333)
},
onShow() {
if(this.latitude && this.longitude){
@ -238,20 +258,127 @@
</script>
<style lang="scss">
page {
.icon-text{
margin-left: 2px;
font-weight: 400;
font-size: 23rpx;
color: #7C8187;
}
.pinglun{
width: 25.69rpx;
height: 22.92rpx;
}
.shouc-img{
width: 25.69rpx;
height: 22.92rpx;
}
.list-right-top-bottom{
width: 100%;
text-align: left;
font-weight: 400;
font-size: 25rpx;
color: #333333;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2; /* 显示的行数，可以根据需要修改 */
overflow: hidden;
text-overflow: ellipsis;
}
.therapist-bottom-dingwei-text{
font-weight: bold;
font-size: 23rpx;
color: #848485;
}
.therapist-bottom-dingwei{
width: 17.36rpx;
height: 20.14rpx;
margin-right:3px;
}
.therapist-bottom-img{
width: 22.22rpx;
height: 22.22rpx;
margin-right:3px;
}
.therapist-mian-bottom-text{
font-weight: bold;
font-size: 23rpx;
color: #222222;
}
.therapist-mian-bottom{
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin: 5px 0px 3px 0px;
}
.zz_view {
color: #039E89;
font-size: 24rpx;
padding: 0px 3px;
background: #EBEBEB;
height: 38rpx;
line-height: 38rpx;
text-align: center;
border-top-right-radius: 7rpx;
border-bottom-right-radius: 7rpx;
}
.shou-top-btn{
height: 38rpx;
line-height: 38rpx;
text-align: center;
font-size: 24rpx;
padding: 0px 3px;
border-top-left-radius: 7rpx;
border-bottom-left-radius: 7rpx;
}
.byy_view {
color: #000000;
background-color: #ebebeb;
}
.kfw_view {
background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
color: #FFFFFF;
}
.shou-top{
display: flex;
flex-direction: row;
align-items: center;
margin-right: 5px;
}
.dituzhaoren{
width: 168.75rpx;
height: 40.97rpx;
}
.content-list{
height: 307rpx;
border-radius: 14rpx;
}
.content-img image{
width: 100%;
height: 100%;
}
.content-img{
width: 202.08rpx;
height: 100%;
position: relative;
}
.content {
width: 100%;
height: 100vh;
background-color: #F7F7F7;
}
.zz_view {
color: #333333;
font-size: 24rpx;
padding: 6rpx 10rpx;
border-radius: 10rpx;
}
.zpmore_view {
position: absolute;
bottom: -20rpx;
bottom: 0px;
margin-bottom: 2px;
left: 14rpx;
color: #f9f3d3;
background: linear-gradient(to right, #0a0c16, #4d4d53);
@ -264,45 +391,7 @@
margin-left: 10rpx;
}
.byy_view {
background: #ebebeb;
width: 100upx;
text-align: center;
border-radius: 50rpx;
height: 40rpx;
line-height: 40rpx;
font-size: 24rpx;
color: #000000;
// border: 3upx solid #999999;
margin-top: 6rpx;
margin-left: 40rpx;
}
.kfw_view {
background: #ffaa00;
width: 100upx;
text-align: center;
border-radius: 50rpx;
height: 40rpx;
line-height: 40rpx;
font-size: 24rpx;
color: #FFFFFF;
margin-top: 6rpx;
margin-left: 40rpx;
}
.kyy_view {
background: #096f4b;
width: 100upx;
text-align: center;
border-radius: 50rpx;
height: 40rpx;
line-height: 40rpx;
font-size: 24rpx;
color: #FFFFFF;
margin-top: 6rpx;
margin-left: 40rpx;
}
.bg {
background: #FFFFFF;

56
my/order/complain.vue
View File

@ -13,11 +13,11 @@
<view class="" style="color: #999999;">
<u-input v-model="sendDate.content" type="textarea" placeholder="请详细描述你的问题... " style="height: 300rpx;padding: 10rpx;background-color: #f5f5f5;border-radius: 10rpx;margin: 10rpx 0 20rpx 0;color: #999999;"/>
</view>
<view class="feedback-title">投诉图</view>
<!-- <view class="feedback-title">投诉图</view> -->
<view class="margin-tb-sm">
<view class="flex" style="flex-direction: initial;flex-wrap: wrap;">
<view v-if="Imgo.length">
<view class=" flex margin-right-sm flex-wrap">
<view v-if="Imgo.length" style="width: 100%;">
<view class=" flex flex-wrap" style="justify-content: space-between;">
<view class="flex"
style="margin-right: 5rpx;position: relative;width: 200rpx;height: 200rpx;"
v-for="(image,index) in Imgo" :key="index">
@ -29,23 +29,24 @@
</view>
</view>
</view>
<view class="" @click="addImages(2)" v-if="Imgo.length<=5">
<view class="" @click="addImages(2)" v-if="Imgo.length<=2">
<view style="width: 200rpx;height: 200rpx;background: #f4f5f6;border-radius: 10rpx;"
class="flex justify-center align-center">
<view>
<view class="text-center">
<u-icon name="plus" color="#666666" size="28"></u-icon>
<image style="width: 43.06rpx;height: 38.19rpx;" src="../../static/orderDetail/img-shang.png" mode=""></image>
<!-- <u-icon name="plus" color="#666666" size="28"></u-icon> -->
</view>
<view class="text-center">选择图片</view>
</view>
</view>
</view>
</view>
<view class="" style="font-size: 26rpx;color: #999999;margin-top: 40rpx;">温馨提示：最多上传3张图片</view>
<view class="" style="font-size: 20.83rpx;color: #ED782E;margin-top: 40rpx;">温馨提示：最多上传3张图片</view>
</view>
</view>
<view style="position: fixed;bottom: 0rpx;left: 0;right: 0;background: #FFFFFF;height: 110rpx;line-height: 110rpx;z-index: 999;">
<view class="sbu-btn">
<button type="primary" style="" class="feedback-submit" @tap="send">提交</button>
</view>
@ -236,6 +237,25 @@
</script>
<style>
.feedback-submit {
width: 652rpx;
height: 92rpx;
background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
border-radius: 46rpx;
color: #FFFFFF;
margin: 16rpx 30upx;
position: fixed;
bottom: 0upx;
line-height: 92rpx;
font-size: 32rpx;
text-align: center;
}
.sbu-btn{
display: flex;
justify-content: center;
align-items: center;
background: #f7f7f7;
}
@font-face {
font-family: uniicons;
font-weight: normal;
@ -243,12 +263,18 @@
src: url('https://img-cdn-qiniu.dcloud.net.cn/fonts/uni.ttf') format('truetype');
}
page {
.page {
width: 100%;
height: 100vh;
background-color: #f7f7f7 !important;
padding-top: 20px;
}
.bg{
background-color: #ffffff;
padding: 30rpx;
width: 95%;
margin: 0px auto;
border-radius: 24rpx;
}
/*问题反馈*/
.feedback-title {
@ -291,17 +317,5 @@
}
.feedback-submit {
background: linear-gradient(to right, #223845, #00a85b);
color: #FFFFFF;
margin: 16rpx 30upx;
position: fixed;
bottom: 0upx;
width: 90%;
border-radius: 50rpx;
height: 78rpx;
line-height: 78rpx;
font-size: 32rpx;
text-align: center;
}
</style>

21
my/order/feedback.vue
View File

@ -1,5 +1,8 @@
<template>
<view class="content">
<view class="header-view">
-提交好评或建议，帮助盛安做得更好——
</view>
<view class="box">
<view class="feedback-title">
<text>您对服务还满意吗？</text>
@ -14,7 +17,7 @@
<view class="feedback-star-view">
<!-- <text class="feedback-star" v-for="(value, key) in stars" :key="key" :class="key < sendDate.score ? 'active' : ''" @tap="chooseStar(value)"></text> -->
</view>
<u-rate :count="count" v-model="value" active-color="#FFAA01"></u-rate>
<u-rate :count="count" v-model="value" active-color="#019C88"></u-rate>
</view>
</view>
<button type="primary" class="feedback-submit" @tap="send">提交</button>
@ -138,6 +141,17 @@
</script>
<style>
/deep/.u-icon__icon{
font-size: 35rpx;
}
.header-view{
width: 100%;
margin-top: 15px;
text-align: center;
font-weight: 400;
font-size: 25rpx;
color: #ED782E;
}
@font-face {
font-family: uniicons;
font-weight: normal;
@ -153,14 +167,17 @@
background-color: #f7f7f7;
position: relative;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.box{
width: 95%;
height: 600rpx;
border-radius: 24rpx;
margin: 0 auto;
background-color: #FFFFFF;
padding: 30rpx;
margin-top: 15px;
}
.input-view {

40
my/order/payModify.vue
View File

@ -125,9 +125,10 @@
<view class="flex tabber padding-top-sm padding-bottom-sm align-center">
<u-button @click="openpay()" shape="circle" :custom-style="customStyle2" :hair-line="false"
style="background: linear-gradient(to right, #223845, #00a85b);border: 0;">立即支付
<view class="tabber padding-top-sm padding-bottom-sm pay-zhifu">
<span class="daizhifu">待支付:￥268</span>
<u-button class="u-button-pay" @click="openpay()" shape="circle" :custom-style="customStyle2" :hair-line="false">
立即支付
</u-button>
</view>
</view>
@ -160,8 +161,7 @@
<view class="popup_pay">
<view style="background-color: #fff;">
<view style="padding: 0 20upx;margin-top: 60rpx;margin-bottom: 20rpx;">
<view
style="display: flex;height: 100upx;align-items: center;padding: 20upx 0;justify-content: center;"
<view style="display: flex;height: 100upx;align-items: center;padding: 20upx 0;justify-content: center;"
v-for="(item,index) in openLists" :key='index'>
<image :src="item.image" style="width: 55upx;height: 55upx;border-radius: 50upx;">
</image>
@ -176,7 +176,7 @@
</view>
</view>
</view>
<view class="pay_btn" @click="pay()">确认支付</view>
<view class="pay_btn" @click="pay()">确认支付</view>
</view>
</u-popup>
@ -1048,6 +1048,28 @@
</script>
<style lang="scss" scoped>
/deep/.u-button-pay{
width: 381rpx;
height: 68rpx;
line-height: 68px;
text-align: center;
color: #fff;
font-size: 31rpx;
background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
border-radius: 34rpx;
}
.daizhifu{
font-size: 38rpx;
color: #333333;
}
.pay-zhifu{
width: 100%;
background-color: #f7f7f7 !important;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between !important;
}
.liliao{
margin-top: 10px;
}
@ -1508,11 +1530,11 @@
width: 90%;
margin: 0 auto;
text-align: center;
background: linear-gradient(to right, #223845, #00a85b);
height: 80rpx;
background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
height:68rpx;
border-radius: 60rpx;
color: #ffffff;
line-height: 80rpx;
line-height: 68rpx;
}
.serverAddress {

1550
my/order/payYouHui.vue Normal file
View File

File diff suppressed because it is too large Load Diff

2
my/setting/index.vue
View File

@ -104,8 +104,6 @@
}
})
}
},
goNav(item) {
uni.navigateTo({

57
my/vip/index.vue
View File

@ -2,7 +2,7 @@
<view class="content">
<!-- <image class="bgimg" src="../static/workbg.png" mode="widthFix"></image> -->
<!-- <image class="bgimg" src="https://admin.sjajk.com/file/uploadPath/2023/01/16/0bd832e6cd894903f6ad2ece7f07824a.png" style="height: 100vh;"></image> -->
<view class="bgbox" style="" v-if="showpay==true">
<view class="bgbox" style="" v-if="vipShow==false">
<!-- <view class="" style="padding: 80rpx 0;text-align: center;">
<image src="../../static/ktvip.png" style="width: 513rpx;height: 79rpx;"></image>
</view>
@ -19,7 +19,7 @@
</view>
<view class="quanyi_view">
<view class="quanyi_titview">
<view class="quanyi_titview-list" v-if="!isVip">
<view class="quanyi_titview-list" v-if="vipData.isVip!=1">
<view v-for="(item,index) in vipList" :key='index' @click="select(item)" class="vip-list">
<view class="biaoqian">新用户特惠</view>
<view class="text-center flex flex-direction justify-between padding-tb radius"
@ -29,12 +29,16 @@
</view>
</view>
</view>
<view class="save_vipbtn" v-if="!isVip" @tap="showpay = true">立即开通</view>
<view class="save_vipbtn" v-if="vipData.isVip!=1" @tap="showpay = true">立即开通</view>
<view class="quanyi_titname">~VIP超值权益~</view>
<view class="quanyi_itemview" style="margin-bottom: 60rpx;">
<view class="quanyi_listitem" v-for="(item,index) in gridData" :key="index">
<image :src="item.image"></image>
<view class="listitem_name">{{item.title}}</view>
<view class="quanyi_listitem">
<image src="../../static/vip/zuanshi.png"></image>
<view class="listitem_name">专享{{vipData.rateStr}}折</view>
</view>
<view class="quanyi_listitem">
<image src="../../static/vip/wangguan.png"></image>
<view class="listitem_name">身份标识</view>
</view>
</view>
</view>
@ -43,16 +47,20 @@
<view class="bgbox" style="" v-else>
<view class="bgbox-top-show">
<image src="../../static/vip/membership.png" mode=""></image>
<view class="bgbox-top-show-youxiao">到期时间2024-01-31 10:00:00{{endTime}}</view>
<view class="bgbox-top-show-youxiao">到期时间{{vipData.endTime}}</view>
</view>
<view class="bgbox-mian">VIP超值权益</view>
<view class="quanyi_view">
<view class="quanyi_titview">
<view class="quanyi_titname">~VIP超值权益~</view>
<view class="quanyi_itemview" style="margin-bottom: 60rpx;">
<view class="quanyi_listitem" v-for="(item,index) in gridData" :key="index">
<image :src="item.image"></image>
<view class="listitem_name">{{item.title}}</view>
<view class="quanyi_listitem">
<image src="../../static/vip/zuanshi.png"></image>
<view class="listitem_name">专享{{vipData.rateStr}}折</view>
</view>
<view class="quanyi_listitem">
<image src="../../static/vip/wangguan.png"></image>
<view class="listitem_name">身份标识</view>
</view>
</view>
</view>
@ -99,15 +107,6 @@
border: 0,
fontWeight: '700'
},
gridData: [{
title: '专享九折',
image: '../../static/vip/zuanshi.png'
},
{
title: '身份标识',
image: '../../static/vip/wangguan.png'
}
],
avatar: '',
userName: '匿名',
vipList: [],
@ -120,6 +119,8 @@
openLists: [],
openWay: 2,
showpay: false,
vipData:[],
vipShow:false
}
},
onLoad() {
@ -157,7 +158,15 @@
this.getVipList()
this.getMemberList()
this.getMoney()
this.getIsVip()
// this.getIsVip()
this.vipData=this.$queue.getData('VipDetails')
console.log("vipDatavipDatavipDatavipData",this.vipData)
if(this.vipData.isVip=='1'){
this.vipShow=true;
}else{
this.vipData=[]
this.vipShow=false
}
},
methods: {
selectWay: function(id) {
@ -174,7 +183,8 @@
getVipList() {
this.$Request.get('/app/VipDetails/selectVipDetails').then(res => {
if (res.code == 0) {
this.vipList = res.data
this.vipList = res.data;
this.vipData.rateStr=this.vipList[0].rateStr;
this.selNum = this.vipList[0].id
this.price = this.vipList[0].money
}
@ -208,8 +218,9 @@
});
},
select(e) {
this.selNum = e.id
this.price = e.money
this.selNum = e.id;
this.price = e.money;
this.vipData.rateStr=e.rateStr
},
pay() {
this.getMoney()

33
pages.json
View File

@ -225,7 +225,7 @@
"app-plus": {
"bounce": "none",
"scrollIndicator": "none",
"titleNView": true
"titleNView": false
}
}
},
@ -253,7 +253,7 @@
"app-plus": {
"bounce": "none",
"scrollIndicator": "none",
"titleNView": true
"titleNView": false
}
}
},
@ -265,7 +265,7 @@
"app-plus": {
"bounce": "none",
"scrollIndicator": "none",
"titleNView": true
"titleNView": false
}
}
},
@ -478,13 +478,19 @@
"path": "gird/browse",
"style": {
"navigationBarTitleText": "浏览足迹",
"enablePullDownRefresh": true
"enablePullDownRefresh": true,
"app-plus": {
"titleNView": false
}
}
}, {
"path": "gird/shoucang",
"style": {
"navigationBarTitleText": "我的收藏",
"enablePullDownRefresh": true
"enablePullDownRefresh": true,
"app-plus": {
"titleNView": false
}
}
},
{
@ -601,10 +607,24 @@
}
}
},
{
"path": "order/payYouHui",
"style": {
"navigationBarTitleText": "修改优惠卷",
"navigationStyle": "custom",
"app-plus": {
"titleNView": false
}
}
},
{
"path": "order/complain",
"style": {
"navigationBarTitleText": "投诉"
"navigationBarTitleText": "投诉",
"navigationStyle": "custom",
"app-plus": {
"titleNView": false
}
}
},
{
@ -736,6 +756,7 @@
"navigationBarTitleText": "修改手机号"
}
},
{
"path": "order/feedback",
"style": {

319
pages/index/index.vue
View File

@ -22,33 +22,19 @@
<image src="../../static/index-nav-5.png" mode="widthFix"></image>
</view>
</view>
<view class="index-mian width">
<view class="index-mian-select">
<uni-data-select
v-model="value"
:localdata="range"
@change="change"
></uni-data-select>
<image src="../../static/xiala.png" mode="widthFix"></image>
</view>
<view>
<uni-search-bar @confirm="search" :cancelext="'取消'" v-model="searchValue" @blur="blur" @input="input"
@clear="clear">
</uni-search-bar>
<view class="padding-top-sm flex align-center index-mian">
<view v-if="XCXIsSelect != '否'" class="flex align-center justify-between margin-right-sm"
@tap="showCityList" style="line-height: 68rpx;">
<image src="../../static/liliao-1.png" class="dingwei-img"></image>
<view class="localName">{{ city }}</view>
</view>
<u-search class="" placeholder="请输入理疗师名字" :focus="false" shape="square" v-model="artificerName"
:show-action="true" :animation="true" bg-color="#fff" color="#1A1A1A" @search="onSearch()"
></u-search>
</view>
<view class="index-fenl width">
<view class="index-gun">
<view class="fenl">中医推拿</view>
<view class="fenl">小儿推拿</view>
<view class="fenl">产后康复</view>
<view class="fenl">SPA精油</view>
<view class="fenl">小儿推拿</view>
<view class="fenl">产后康复</view>
<view class="fenl">SPA精油</view>
<view class="fenl">小儿推拿</view>
<view class="fenl">产后康复</view>
<view class="fenl">SPA精油</view>
<view class="fenl" v-for="(item,index) in typeList" :key="index">{{item.value}}</view>
</view>
</view>
<view class="index-nav-bottom width">
@ -69,7 +55,7 @@
</view>
<view class="star-technician width">
<view class="star-technician-mian">
<liu-goods-swiper :goodsList="goodsList" :imgWidth="160" :imgHeight="225" @clickItem="chooseItem" @cancellable='false'></liu-goods-swiper>
<liu-goods-swiper :goodsList="starTechnician" :imgWidth="160" :imgHeight="225" @clickItem="chooseItem" @cancellable='false'></liu-goods-swiper>
</view>
</view>
<view class="index-project width">
@ -133,42 +119,24 @@
</view>
</view>
<view class="index-fujin-img width">
<view class="index-fujin-view">
<image class="index-fujin-view-img" src="../../static/pintuan.png" mode="widthFix"></image>
<view class="index-fujin-view-text">
<image src="../../static/fujin-dingwei.png" mode="widthFix"></image>
<span>1.2km</span>
</view>
</view>
<view class="index-fujin-view">
<image class="index-fujin-view-img" src="../../static/pintuan.png" mode="widthFix"></image>
<view class="index-fujin-view-text">
<image src="../../static/fujin-dingwei.png" mode="widthFix"></image>
<span>1.2km</span>
</view>
</view>
<view class="index-fujin-view">
<image class="index-fujin-view-img" src="../../static/pintuan.png" mode="widthFix"></image>
<view class="index-fujin-view-text">
<image src="../../static/fujin-dingwei.png" mode="widthFix"></image>
<span>1.2km</span>
<view class="fujin-view" v-for="(item,index) in nearbyTechnician" :key="index">
<view class="index-fujin-view">
<image class="index-fujin-view-img" :src="item.artificerImg" mode=""></image>
<view class="index-fujin-view-text">
<image src="../../static/orderDetail/dingwei.png" mode=""></image>
<span>1.2km</span>
</view>
</view>
<view class="index-fujin-jie">
<view class="index-fujin-jie-view">
<span class="index-fujin-jie-name">{{item.artificerName}}</span>
<span class="index-fujin-jie-id">{{item.classifyName}}</span>
</view>
</view>
</view>
</view>
<view class="index-fujin-jie">
<view class="index-fujin-jie-view">
<span class="index-fujin-jie-name">李安茹</span>
<span class="index-fujin-jie-id">中医推拿</span>
</view>
<view class="index-fujin-jie-view">
<span class="index-fujin-jie-name">李安茹</span>
<span class="index-fujin-jie-id">中医推拿</span>
</view>
<view class="index-fujin-jie-view">
<span class="index-fujin-jie-name">李安茹</span>
<span class="index-fujin-jie-id">中医推拿</span>
</view>
</view>
<view class="index-taocan width">
<view class="index-taocan-view">
<view class="index-taocan-view-nav" v-for="item in felNav" :key="item.id" @click="chengFel(item)">
@ -287,13 +255,34 @@
</swiper>
</view>
</view>
<!-- 经验筛选 -->
<u-select v-model="Cityshow" :list="cityList" @confirm="getCity"></u-select>
</view>
</template>
<script>
import commonConfig from 'common/config.js';
import * as webMap from 'utils/webMap.js';
// 调用手机系统权限
// #ifdef APP-PLUS
import permision from "@/components/permission.js";
// #endif
export default {
data() {
return {
cityList: [],
Cityshow: false,
artificerName: '',
//地图相关
token: '',
infoWindow: null,
amap: null,
latitude: '43.86487',
longitude: '',
city: '请选择城市',
XCXIsSelect: '否',
currentTabFl: 1,
felNav:[{
id:1,
@ -350,8 +339,11 @@
},
],
typeList:[],
searchValue: '123123',
starTechnician:[],//明星技师
nearbyTechnician:[],//附近技师
classifyId: '',
value: 0,
range: [
{ value: 0, text: "篮球" },
@ -390,9 +382,151 @@
}
},
onLoad() {
let that = this
uni.getLocation({
type: 'gcj02',
geocode: true, //设置该参数为true可直接获取经纬度及城市信息
highAccuracyExpireTime: 500,
success: function(res) {
console.log(res, '地理位置-----------------------》')
that.latitude = res.latitude
that.longitude = res.longitude
uni.setStorageSync('latitude', res.latitude)
uni.setStorageSync('longitude', res.longitude)
if (that.amap) {
that.amap.setCenter(new AMap.LngLat(res.latitude, res.longitude));
}
if (that.infoWindow) {
that.infoWindow.setPosition(new TMap.LatLng(res.latitude, res.longitude));
}
// that.getTypeList();
},
fail: function(e) {
console.log('获取地址失败1', e)
// #ifdef APP-PLUS
that.checkPermission();
// #endif
}
})
that.getBannerList()
that.getHomeArtificerList()
},
onShow() {
let that = this
that.XCXIsSelect = this.$queue.getData("XCXIsSelect");
that.city = uni.getStorageSync('city') ? uni.getStorageSync('city') : '请选择城市'
that.token = uni.getStorageSync('token')
// if (uni.getStorageSync('token')) {
if (that.latitude && that.longitude) {
// that.getlist()
} else {
uni.getLocation({
type: 'gcj02',
highAccuracyExpireTime: 500,
geocode: true, //设置该参数为true可直接获取经纬度及城市信息
success: function(res) {
console.log(res, '地理位置')
that.latitude = res.latitude
that.longitude = res.longitude
// that.getTypeList();
// that.getlist()
},
fail: function() {
console.log('获取地址失败2')
}
})
}
// }
// that.myId = uni.getStorageSync('userId')
},
methods: {
getCity(e) {
console.log("得到的城市-------------》",e[0].label);
this.city = e[0].label;
uni.setStorageSync('city', this.city)
// this.getKTCityList();
// this.page = 1
// this.getlist()
},
showCityList() {
// #ifdef APP-PLUS
if (this.latitude === '' || this.longitude === '') {
this.checkPermission();
return;
}
// #endif
this.Cityshow = true;
},
onSearch(e) {
// this.artificerName = e;
this.getlist()
},
async checkPermission() {
let status = permision.isIOS ? await permision.requestIOS('location') : await permision.requestAndroid(
'android.permission.ACCESS_FINE_LOCATION');
if (status === null || status === 1) {
status = 1;
} else if (status === 2) {
uni.showModal({
content: "系统定位已关闭",
confirmText: "确定",
showCancel: false,
success: function(res) {}
})
} else if (status.code) {
uni.showModal({
content: status.message
})
} else {
uni.showModal({
title: '定位服务已关闭',
content: "您需要打开定位权限，否则我们将无法获得到您附近的项目服务，导致我们无法为您提供服务，请到>设置>隐私>定位服务>中开启【盛安到家】定位权限",
confirmText: "设置",
success: function(res) {
if (res.confirm) {
permision.gotoAppSetting();
}
}
})
}
return status;
},
getHomeArtificerList(){
var data={
isStart: 1,
status: 1,
city: "长春市",
longitude:'125.281198',
latitude:'43.883036',
page: 1,
limit: 3
}
this.$Request.get("/app/artificer/getHomeArtificerList",data).then(res => {
if (res.code == 0) {
this.starTechnician = res.startData.list;
this.nearbyTechnician=res.nearData.list
console.log("starTechnician",res.startData.list)
// this.classifyId = res.data[0].id;
// this.getorderlist('')
}
});
},
//获取轮播图
getBannerList() {
this.$Request.get("/app/dict/list", {
type: '服务类型'
}).then(res => {
if (res.code == 0) {
if (res.data) {
this.typeList = res.data
// this.classifyId = res.data[0].id;
// this.getorderlist('')
}
}
});
},
chengFel(item){//大家常买。。。 导航切换
this.currentTabFl=item.id
},
@ -419,35 +553,42 @@
console.log("推荐明星",item)
// 点击拿到整个当前点击的item 执行业务逻辑
},
change(e) {
console.log("e:", e);
},
search(res) {
// uni.showToast({
// title: '搜索：' + res.value,
// icon: 'none'
// })
},
input(res) {
console.log('----input:', res)
},
clear(res) {
uni.showToast({
title: 'clear事件，清除值为：' + res.value,
icon: 'none'
})
},
blur(res) {
uni.showToast({
title: 'blur事件，输入值为：' + res.value,
icon: 'none'
})
},
}
}
</script>
<style scoped>
/deep/.u-select{
width: 100%;
height: 100%;
}
/deep/.u-select__header{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
height: 38px;
padding: 0 19px;
}
/deep/.u-content,/deep/.u-search{
flex: none;
width: 557.08rpx;
border-radius: 32rpx !important;
height: 64rpx !important;
}
/deep/.u-action{
display: none;
}
.dingwei-img{
width:33.33rpx;
height:37.5rpx;
}
.localName{
margin-left: 4rpx;
font-weight: bold;
font-size: 33rpx;
color: #333333;
}
.menu-topic-act .menu-topic-bottom-color {
background: linear-gradient(90deg,rgba(234, 248, 245,0.7),rgba(132, 211, 196,0.7));
}
@ -775,12 +916,18 @@
align-items: center;
justify-content: space-between;
}
.fujin-view{
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.index-fujin-view{
width: 222.22rpx;
height: 100%;
position: relative;
display: flex;
align-items: center;
height: 313rpx;
}
.index-fujin-view-img{
width: 100%;
@ -992,11 +1139,13 @@
align-items: center;
}
.index-mian{
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin: 10px auto;
margin: 10px 0px;
padding: 0px 10px;
}
/deep/.uni-select__input-box .uni-icons {

49
pages/my/cooperation.vue
View File

@ -1,9 +1,5 @@
<template>
<view>
<!-- <image class="bgimg"
src="https://admin.sjajk.com/file/uploadPath/2023/01/16/034493ff8f12eff0f6768facc8124716.png"
mode="widthFix"></image> -->
<view class="content">
<view class="info">
<view class="info-box">
<view class="info-box-item">
@ -181,8 +177,12 @@
</script>
<style lang="less">
page {
background-color: #ffffff;
.content {
background-color: #f7f7f7;
width: 100%;
height: 100vh;
padding-top: 20px;
position: relative;
}
.bgimg {
@ -191,13 +191,14 @@
}
.info {
width: 100%;
width: 95%;
height: auto;
display: flex;
justify-content: center;
margin: 0;
margin: 0px auto;
padding: 40rpx;
background-color: #fff;
border-radius: 10px;
.info-box {
width: 100%;
@ -231,8 +232,9 @@
height: 88rpx;
display: flex;
justify-content: center;
position: absolute;
position: fixed;
bottom: 0px;
margin-bottom: 20px;
.sub-box {
width: 613rpx;
height: 100%;
@ -241,9 +243,10 @@
.sub-box-l {
width: 290rpx;
height: 88rpx;
background: linear-gradient(to right, #223845, #00a85b);
border-radius: 44rpx;
height: 92rpx;
line-height: 92rpx;
background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
border-radius: 46rpx;
color: #ffffff;
font-size: 30rpx;
display: flex;
@ -252,10 +255,11 @@
}
.sub-box-rs {
width: 600rpx;
height: 88rpx;
background: linear-gradient(to right, #223845, #00a85b);
border-radius: 44rpx;
width: 290rpx;
height: 92rpx;
line-height: 92rpx;
background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
border-radius: 46rpx;
color: #ffffff;
font-size: 30rpx;
display: flex;
@ -265,9 +269,10 @@
.sub-box-r {
width: 290rpx;
height: 88rpx;
background: linear-gradient(to right, #223845, #00a85b);
border-radius: 44rpx;
height: 92rpx;
line-height: 92rpx;
background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
border-radius: 46rpx;
color: #ffffff;
font-size: 30rpx;
display: flex;

241
pages/my/css/myteam.vue Normal file
View File

@ -0,0 +1,241 @@
<template>
<view class="content">
<view class="flex text-center text-lg bg">
<view class="title_btn flex-sub bg" @click="cut(1)" :class="tabFromIndex==1?'bgCol2': ''">团队用户
</view>
<view class="title_btn flex-sub bg" @click="cut(2)" :class="tabFromIndex==2?'bgCol2': ''">团队理疗师
</view>
</view>
<view class="view1">
<view class="flex">
<view class="view1_item">
<view class="view1_itemmoney">{{ teamCount }} <text>人</text> </view>
<view class="view1_itemname">已邀请</view>
</view>
<view class="view1_item" @tap="goDetail">
<view class="view1_itemmoney"><text>￥</text>{{ teamMoney }}</view>
<view class="view1_itemname">我的收益</view>
</view>
</view>
<image src="../../static/teamYao.png" @tap="goYao"></image>
</view>
<view class="view2" style="border-radius: 20upx;">
<view style="display: flex;flex-direction: row;padding: 20upx;">
<view style="width: 20%;">排名</view>
<view style="width: 50%;">用户</view>
<view style="width: 30%;text-align: center;">收益</view>
</view>
<view style="display: flex;flex-direction: row;padding: 20upx;" v-for="(item, index) in rankingList"
:key="index">
<view style="width: 20%;">
<image v-if="index == 0"
src="https://admin.sjajk.com/file/uploadPath/2023/01/16/f5305e9ce03a6d0269f58ce55e6c3d0d.png"
style="width: 50upx; height: 50upx;"></image>
<image v-if="index == 1"
src="https://admin.sjajk.com/file/uploadPath/2023/01/16/20b80ec8d3f4db15754426697d0054b8.png"
style="width: 50upx; height: 50upx;"></image>
<image v-if="index == 2"
src="https://admin.sjajk.com/file/uploadPath/2023/01/16/6f61f5e7ec61a1d815bee3c9f0af3c58.png"
style="width: 50upx; height: 50upx;"></image>
<view v-if="item.rankNum > 2" style="font-size: 19px; color: #999999; margin-left: 15upx;">
{{ index + 1 }}
</view>
</view>
<view style="width: 50%;display: flex;flex-direction: row;align-items: center;">
<image :src="item.avatar ? item.avatar : '/static/logo.png'"
style="border-radius: 100upx;width: 50upx; height: 50upx;"></image>
<view style="font-size: 14px; color: #333333;margin-left: 20upx; width: 65%;">{{ item.userName }}
</view>
</view>
<view style="width: 30%;text-align: center;">
<view style="font-size: 16px;color: #096f4b;">¥{{ item.money }}</view>
</view>
</view>
<!-- 加载更多提示 -->
<view class="s-col is-col-24" v-if="rankingList.length > 0">
<load-more :loadingType="loadingType" :contentText="contentText"></load-more>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
tabFromIndex: 1,
teamCount: 0,
teamMoney: 0,
rankingList: [],
imageUrl: '/static/logo2.jpg',
money: 0,
nickName: '游客',
rankNum: 0,
page: 1,
size: 20,
loadingType: 0,
scrollTop: false,
contentText: {
contentdown: '上拉显示更多',
contentrefresh: '正在加载...',
contentnomore: '没有更多数据了'
}
};
},
onLoad() {
let userId = this.$queue.getData('userId');
if (userId) {
this.getRankingList(userId);
this.getUserInfo();
}
},
onPageScroll: function(e) {
this.scrollTop = e.scrollTop > 200;
},
methods: {
goDetail(){
if(this.tabFromIndex == 1){
uni.navigateTo({
url: '/my/wallet/usermoneydetail?classIndex=5'
});
}else{
uni.navigateTo({
url: '/my/wallet/usermoneydetail?classIndex=6'
});
}
},
cut(index) {
this.tabFromIndex = index;
this.page = 1;
let userId = this.$queue.getData('userId');
this.getRankingList(userId);
this.getUserInfo();
},
goYao() {
uni.navigateTo({
url: '/pages/my/invitationUser'
});
},
getUserInfo() {
let userId = this.$queue.getData('userId');
this.$Request.getT('/app/artificer/selectTeamStatistics?userId=' + userId + '&type=' + this.tabFromIndex)
.then(res => {
if (res.code == 0) {
this.teamCount = res.data.teamCount ? res.data.teamCount : 0;
this.teamMoney = res.data.teamMoney ? res.data.teamMoney : 0;
}
});
},
getRankingList() {
this.loadingType = 1;
uni.showLoading({
title: '加载中...'
});
let userId = this.$queue.getData('userId');
this.$Request.getT('/app/artificer/selectTeamUserList?type=' + this.tabFromIndex + '&page=' + this.page +
'&limit=' + this
.size +
'&userId=' + userId).then(res => {
if (res.code === 0) {
if (this.page === 1) {
this.rankingList = [];
}
res.data.list.forEach(d => {
this.rankingList.push(d);
});
if (res.data.list.length === this.size) {
this.loadingType = 0;
} else {
this.loadingType = 3;
}
} else {
this.loadingType = 2;
}
uni.hideLoading();
});
}
},
onReachBottom: function() {
this.page = this.page + 1;
this.getRankingList();
},
onPullDownRefresh: function() {
this.page = 1;
this.getRankingList();
}
};
</script>
<style lang="scss">
page {
background: #F5F5F5;
}
.bg {
background: #FFFFFF;
}
.view1 {
background-color: #ffffff;
width: 93%;
height: 360upx;
margin-left: 26upx;
border-radius: 20upx;
margin-top: 20upx;
border-radius: 20upx;
image {
width: 586rpx;
height: 88rpx;
margin: 80rpx 50rpx 0rpx;
}
.view1_item {
margin: 60upx 0 0 0;
height: 100upx;
flex: 1;
text-align: center;
.view1_itemmoney {
font-size: 56rpx;
font-family: PingFang SC;
font-weight: 800;
color: #333333;
text {
font-size: 28rpx;
}
}
.view1_itemname {
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
color: #999999;
margin-top: 30rpx;
}
}
}
.title_btn {
height: 78upx;
line-height: 78upx;
color: #333333;
/* background: #f7f7f7; */
}
.bgCol2 {
color: #333;
font-weight: bold;
}
.view2 {
background-color: #ffffff;
width: 93%;
height: 100%;
margin-left: 26upx;
border-radius: 20upx;
margin-bottom: 20upx;
margin-top: 20rpx;
}
</style>

85
pages/my/hehuo.vue
View File

@ -22,14 +22,14 @@
<view class="xian"></view>
</view>
<view class="item_view">
<view class="item_title">头像上传</view>
<view class="item_title" style="margin-bottom: 10px;">头像上传</view>
<view class="flex" style="overflow: hidden;flex-direction: initial;">
<view v-if="headImg.length">
<view class="margin-top flex margin-right-sm">
<view class="flex"
style="width: 150upx;height: 150upx;margin-right: 10rpx;position: relative;">
<image :src="headImg" style="width: 100%;height: 100%;"></image>
<view style="z-index: 9;position: absolute;top: -15rpx;right: -15rpx;"
<view style="z-index: 9;position: absolute;margin-top: -1px;right: 0px;"
@click="headImgremove(index)">
<u-icon name="close-circle-fill" color="#2979ff" size="50rpx"></u-icon>
</view>
@ -37,13 +37,10 @@
</view>
</view>
<view class="margin-top" @click="addImage()" v-if="headImg.length<=0">
<view style="width: 150upx;height: 150upx;background: #F5F5F5;"
class="flex justify-center align-center">
<view class="flex justify-center align-center margin-top-view">
<view>
<view class="text-center">
<image src="../../static/images/my/add.png"
style="width: 54upx;height: 47upx;position: relative;">
</image>
<image style="width: 43.06rpx;height: 38.19rpx;" src="../../static/orderDetail/img-shang.png" mode=""></image>
</view>
<view class="text-center text-xs margin-top-xs">上传图片</view>
</view>
@ -53,9 +50,9 @@
</view>
<!-- <view class="audit_message" v-if="auditContent != '' && bb == 3">拒绝原因：{{auditContent}}</view> -->
<view class="save_btn" @tap="save" v-if="bb !=0">提交申请</view>
<!-- <view class="save_btn" v-if="status == 0">审核中</view> -->
</view>
<view class="save_btn" @tap="save" v-if="bb !=0">提交申请</view>
</view>
</template>
@ -230,13 +227,51 @@
<style lang="less">
@import '../../static/less/index.less';
@import '../../static/css/index.css';
.save_btn {
width: 600upx;
height: 92rpx;
background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
border-radius: 46rpx;
line-height: 92upx;
margin: 0 auto;
color: #fff;
font-size: 30upx;
position: absolute;
bottom: 0px;
margin-bottom: 10px;
text-align: center;
/* #ifdef MP-WEIXIN */
margin-top: 150rpx;
/* #endif */
/* #ifdef H5 */
margin-top: 100rpx;
/* #endif */
/* #ifdef APP-PLUS */
margin-top: 180rpx;
/* #endif */
}
.margin-top-view{
width: 150upx;
height: 150upx;
background: #f7f7f7;
}
.hehuo_view {
width: 100%;
padding: 0 40rpx;
padding-top: 10px;
height: 100vh;
background-color: #f7f7f7;
position: relative;
display: flex;
flex-direction: column;
align-items: center;
.text_view {
width: 95%;
margin: 0 auto;
background-color: #fff;
border-radius: 10px;
padding: 20px;
.audit_message {
color: red;
width: 650rpx;
@ -244,28 +279,7 @@
margin-top: 50rpx;
}
.save_btn {
width: 600upx;
height: 80upx;
line-height: 80upx;
border-radius: 60upx;
margin: 0 auto;
background: linear-gradient(to right, #223845, #00a85b);
color: #fff;
font-size: 30upx;
text-align: center;
line-height: 88rpx;
/* #ifdef MP-WEIXIN */
margin-top: 150rpx;
/* #endif */
/* #ifdef H5 */
margin-top: 100rpx;
/* #endif */
/* #ifdef APP-PLUS */
margin-top: 180rpx;
/* #endif */
}
.save_btn1 {
width: 650rpx;
@ -281,9 +295,10 @@
margin-top: 30rpx;
.item_title {
font-weight: 500;
font-size: 28rpx;
font-family: PingFang SC Heavy, PingFang SC Heavy-Heavy;
font-weight: 800;
font-weight: bold;
color: #333333;
}

10
pages/my/index.vue
View File

@ -73,15 +73,15 @@
data(){
return {
useList:[
{urlImg:'../../static/my-gong-1.png',text:'我的收藏',link:''},
{urlImg:'../../static/my-gong-2.png',text:'成为理疗师',link:''},
{urlImg:'../../static/my-gong-1.png',text:'我的收藏',link:'/my/gird/shoucang'},
{urlImg:'../../static/my-gong-2.png',text:'成为理疗师',link:'/pages/my/hehuo'},
{urlImg:'../../static/my-gong-3.png',text:'分享好友',link:'/pages/my/invitationUser'},
{urlImg:'../../static/my-gong-4.png',text:'成为代理商',link:''},
{urlImg:'../../static/my-gong-4.png',text:'成为代理商',link:'/pages/my/cooperation'},
{urlImg:'../../static/my-gong-5.png',text:'地址管理',link:'/my/address/address'},
{urlImg:'../../static/my-gong-6.png',text:'帮助中心',link:'/my/help/feedbackIndex'},
{urlImg:'../../static/my-gong-7.png',text:'设置中心',link:'/my/setting/index'},
{urlImg:'../../static/my-gong-8.png',text:'浏览历史',link:''},
{urlImg:'../../static/my-gong-9.png',text:'我的团队',link:''},
{urlImg:'../../static/my-gong-8.png',text:'浏览历史',link:'/my/gird/browse'},
{urlImg:'../../static/my-gong-9.png',text:'我的团队',link:'/pages/my/myteam'},
]
}
},

103
pages/my/myteam.vue
View File

@ -1,9 +1,13 @@
<template>
<view class="content">
<view class="flex text-center text-lg bg">
<view class="title_btn flex-sub bg" @click="cut(1)" :class="tabFromIndex==1?'bgCol2': ''">团队用户
<view class="title_btn flex-sub bg" @click="cut(1)" :class="tabFromIndex==1?'bgCol2': 'bgCol2H'">
<span>团队用户</span>
<span class="border-bottom border-bottom-y" v-if="tabFromIndex==1"></span>
</view>
<view class="title_btn flex-sub bg" @click="cut(2)" :class="tabFromIndex==2?'bgCol2': ''">团队理疗师
<view class="title_btn flex-sub bg" @click="cut(2)" :class="tabFromIndex==2?'bgCol2': 'bgCol2H'">
<span>团队理疗师</span>
<span class="border-bottom border-bottom-l" v-if="tabFromIndex==2"></span>
</view>
</view>
<view class="view1">
@ -13,14 +17,16 @@
<view class="view1_itemname">已邀请</view>
</view>
<view class="view1_item" @tap="goDetail">
<view class="view1_itemmoney"><text>￥</text>{{ teamMoney }}</view>
<view class="view1_itemmoney" style="color: #FF6000;"><text>￥</text>{{ teamMoney }}</view>
<view class="view1_itemname">我的收益</view>
</view>
</view>
<image src="../../static/teamYao.png" @tap="goYao"></image>
<view @tap="goYao" class="yao-btn">
邀请好友
</view>
</view>
<view class="view2" style="border-radius: 20upx;">
<view style="display: flex;flex-direction: row;padding: 20upx;">
<view class="view2-top">
<view style="width: 20%;">排名</view>
<view style="width: 50%;">用户</view>
<view style="width: 30%;text-align: center;">收益</view>
@ -47,8 +53,8 @@
<view style="font-size: 14px; color: #333333;margin-left: 20upx; width: 65%;">{{ item.userName }}
</view>
</view>
<view style="width: 30%;text-align: center;">
<view style="font-size: 16px;color: #096f4b;">¥{{ item.money }}</view>
<view class="view2-right">
<view class="view2-right-text">¥{{ item.money }}</view>
</view>
</view>
<!-- 加载更多提示 -->
@ -167,8 +173,50 @@
</script>
<style lang="scss">
page {
background: #F5F5F5;
.view2-right-text{
font-size: 16px;
color: #FF6000;
font-weight: bold;
}
.view2-right{
width: 30%;
text-align: center;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
.view2-top{
display: flex;
width: 100%;
height: 80rpx;
background-image: linear-gradient(to bottom, rgba(8, 162, 138, 0.3), #f7f7f7);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
border-top-left-radius: 9px;
border-top-right-radius: 9px;
align-items: center;
justify-content: center;
padding: 0px 10px;
}
.yao-btn{
width: 586rpx;
margin: 80rpx 50rpx 0rpx;
height: 92rpx;
line-height: 92rpx;
text-align: center;
font-weight: 400;
font-size: 42rpx;
color: #FFFFFF;
background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
border-radius: 46rpx;
}
.content {
background: #f7f7f7;
width: 100%;
height: 100vh;
padding-bottom: 20px;
}
.bg {
@ -184,11 +232,7 @@
margin-top: 20upx;
border-radius: 20upx;
image {
width: 586rpx;
height: 88rpx;
margin: 80rpx 50rpx 0rpx;
}
.view1_item {
margin: 60upx 0 0 0;
@ -220,19 +264,40 @@
.title_btn {
height: 78upx;
line-height: 78upx;
color: #333333;
/* background: #f7f7f7; */
position: relative;
display: flex;
flex-direction: column;
align-items: center;
}
.bgCol2H{
color: #666;
font-weight: bold;
}
.border-bottom-y{
width: 58px;
}
.border-bottom-l{
width: 75px;
}
.border-bottom{
display: block;
height: 6px;
background: linear-gradient(-48deg, rgba(1, 156, 136, 0.35), rgba(45, 196, 142, 0.35));
border-radius: 3px;
position: absolute;
bottom: 0px;
margin-bottom: 9px;
}
.bgCol2 {
color: #333;
color: #019C88;
font-weight: bold;
}
.view2 {
background-color: #ffffff;
width: 93%;
height: 100%;
height: auto;
margin-left: 26upx;
border-radius: 20upx;
margin-bottom: 20upx;

319
pages/my/servicePackage.vue
View File

@ -49,6 +49,7 @@
<!-- <view class="item-line"></view> -->
<view class="item-img">
<image src="../../static/pintuan.png" mode=""></image>
<span class="img-span">次卡</span>
</view>
<view class="item-view">
<view class="item-view-title">
@ -71,13 +72,116 @@
<span>/元套</span>
<span>560</span>
</view>
<view class="item-view-bottom-btn">
立即购买
<view class="item-view-bottom-btn" @click.stop="toggle('center')">
服务升级
</view>
</view>
</view>
</view>
</z-paging>
<view>
<!-- 普通弹窗 -->
<uni-popup ref="popup" background-color="#fff" @change="change">
<view class="popup-content">
<view class="popup-head">
<span>改价单</span>
<span @click="closePopup(type)">x</span>
</view>
<view class="popup-mian">
<!-- <view class="popup-mian-textarea">
<view class="popup-mian-view">
<span>原服务项目价格:</span>
<span>￥198元</span>
</view>
<view class="popup-mian-view">
<span>现服务项目价格:</span>
<span>￥298元</span>
</view>
<view class="popup-mian-view">
<span>改价需支付差价:</span>
<span>￥100元</span>
</view>
</view> -->
<view class="chong">
<view class="chong-list">
<view class="chong-list-left">
<radio value="" class="chong-list-radio"/>
<image src="../../static/jinggao.png" mode=""></image>
</view>
<view class="chong-list-right">
<view class="chong-title">
<span>王丽楠</span>
<image src="../../static/xinren.png" mode=""></image>
</view>
<view class="chong-bottom">
<view class="chong-bottom-ding">
<image src="../../static/orderDetail/dingwei.png" mode=""></image>
<span>0.8km</span>
</view>
<view class="chong-bottom-cheng">
<image class="therapist-bottom-img" src="../../static/dituzhaoren5.png">
<span>春城有约</span>
</view>
</view>
</view>
</view>
<view class="chong-list">
<view class="chong-list-left">
<radio value="" class="chong-list-radio"/>
<image src="../../static/jinggao.png" mode=""></image>
</view>
<view class="chong-list-right">
<view class="chong-title">
<span>王丽楠</span>
<image src="../../static/xinren.png" mode=""></image>
</view>
<view class="chong-bottom">
<view class="chong-bottom-ding">
<image src="../../static/orderDetail/dingwei.png" mode=""></image>
<span>0.8km</span>
</view>
<view class="chong-bottom-cheng">
<image class="therapist-bottom-img" src="../../static/dituzhaoren5.png">
<span>春城有约</span>
</view>
</view>
</view>
</view>
<view class="chong-list">
<view class="chong-list-left">
<radio value="" class="chong-list-radio"/>
<image src="../../static/jinggao.png" mode=""></image>
</view>
<view class="chong-list-right">
<view class="chong-title">
<span>王丽楠</span>
<image src="../../static/xinren.png" mode=""></image>
</view>
<view class="chong-bottom">
<view class="chong-bottom-ding">
<image src="../../static/orderDetail/dingwei.png" mode=""></image>
<span>0.8km</span>
</view>
<view class="chong-bottom-cheng">
<image class="therapist-bottom-img" src="../../static/dituzhaoren5.png">
<span>春城有约</span>
</view>
</view>
</view>
</view>
</view>
<view class="popup-mian-btn">
<span @click="closePopup(type)">
取消
</span>
<span>
确定
</span>
</view>
</view>
</view>
</uni-popup>
</view>
</view>
</template>
@ -85,6 +189,7 @@
export default {
data() {
return {
type:'center',
// v-model绑定的这个变量不要在分页请求结束中自己赋值！！！
dataList: [],
tabList: ['中医推拿','中医推拿','中医推拿','中医推拿','中医推拿','中医推拿','中医推拿'],
@ -94,6 +199,18 @@
}
},
methods: {
change(e) {
console.log('当前模式：' + e.type + ',状态：' + e.show);
},
closePopup(type){//改价 关闭弹出框
this.type = type
this.$refs.popup.close(type);
},
toggle(type) {//改价 弹出框
this.type = type
// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
this.$refs.popup.open(type)
},
backImg(){//返回上一页
uni.reLaunch({
url:'/pages/my/index'
@ -155,7 +272,204 @@
</script>
<style scoped>
.chong-list:last-child{
border: 0px !important;
}
.chong-bottom-cheng image{
width: 22.22rpx;
height: 22.22rpx;
margin-right: 5px;
}
.chong-bottom-cheng span{
font-weight: 500;
font-size: 23rpx;
color: #222222;
}
.chong-bottom-ding image{
width: 18.75rpx;
height: 21.53rpx;
margin-right: 5px;
}
.chong-bottom-ding span{
font-weight: bold;
font-size: 25rpx;
color: #848485;
}
.chong-bottom-ding,.chong-bottom-cheng{
display: flex;
flex-direction: row;
align-items: center;
}
.chong-bottom{
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
margin-top: 10px;
}
.chong-title image{
width: 50rpx;
height: 22.22rpx;
}
.chong-title span{
font-weight: 400;
font-size: 29rpx;
color: #333333;
margin-right: 5px;
}
.chong-title{
display: flex;
flex-direction: row;
align-items: center;
}
.chong-list-right{
width: 75%;
display: flex;
flex-direction: column;
}
.chong-list-left image{
width: 76rpx;
height: 76rpx;
}
/deep/uni-radio .uni-radio-input{
width: 29.86rpx;
height: 29.86rpx;
margin: -3px 0px 0px -5px;
background-color: rgba(4, 159, 137, 1) !important;
border-color: rgba(4, 159, 137, 1) !important;
}
.chong-list-radio{
margin-right: 5px;
width: 29.86rpx;
height: 29.86rpx;
}
.chong-list-left{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.chong-list{
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
padding: 10px 0px;
border-bottom: 1px solid #DCDCDC;
}
.chong{
width: 100%;
display: flex;
flex-direction: column;
}
.img-span{
display: flex;
justify-content: center;
align-items: center;
width: 40px;
height: 16px;
line-height: 16px;
background: linear-gradient(-90deg, #FF6F48, #FF9E69);
border-top-left-radius: 15rpx;
border-bottom-right-radius: 15rpx;
font-weight: bold;
font-size: 18rpx;
color: #FFFFFF;
position: absolute;
bottom: 0;
right: 0;
margin: 0 6px 6px 0px;
}
.popup-mian-view span:nth-child(1){
color: #666666;
}
.popup-mian-view span:nth-child(2){
color: #333;
font-weight: bold;
}
.popup-mian-view span{
font-size: 29rpx;
}
.popup-mian-view{
width: 100%;
height: 35px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #DCDCDC;
}
.popup-mian-textarea{
width: 100%;
display: flex;
flex-direction: column;
}
.popup-mian-btn span:nth-child(1){
background: linear-gradient(90deg, #FE912E, #FF9970);
}
.popup-mian-btn span:nth-child(2){
background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
}
.popup-mian-btn span{
width: 247rpx;
height: 77rpx;
line-height: 77rpx;
text-align: center;
font-weight: 400;
font-size: 32rpx;
color: #FFFEFE;
border-radius: 39rpx;
}
.popup-mian-btn{
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin-top: 10px;
}
.popup-mian{
width: 88%;
display: flex;
flex-direction: column;
margin: 5px auto 0px auto;
}
.popup-head span:nth-child(2){
width: 50rpx;
height: 50rpx;
line-height: 19px;
text-align: center;
font-size: 24px;
color: #15AB8D;
border-radius: 50%;
border: 3px solid #15AB8D;
}
.popup-head span:nth-child(1){
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
.popup-head{
width: 100%;
height: 99.38rpx;
background-color: rgba(21, 171, 141, 0.09);
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 0 15px;
}
.popup-content{
width: 613rpx;
padding-bottom: 10px;
background: #FFFFFF;
border-radius: 56rpx;
display: flex;
flex-direction: column;
}
.item-view-bottom-btn{
text-align: center;
width: 131rpx;
@ -256,6 +570,7 @@
width: 285rpx;
height: 120px;
border-radius: 14rpx;
position: relative;
}
.item-img image{
width: 100%;

119
pages/order/index.vue
View File

@ -75,7 +75,10 @@
<u-button v-if="item.status == 5" :custom-style="customStyle" shape="circle" class="btns" :plain="true" @click="goNav('/my/order/complain?id='+item.ordersId)" >
去投诉
</u-button>
<u-button v-if="item.status == 3" :custom-style="customStyle1" class="btns" shape="circle" :plain="true"
@click="toggle('center')">
提前结束
</u-button>
<u-button v-if="item.status == 3" :custom-style="customStyle1" class="btns" shape="circle" :plain="true"
@click="goNav('/my/order/feedback?artificerId='+item.artificerId+ '&ordersId='+item.ordersId)">
去评价
@ -85,6 +88,28 @@
</view>
</view>
</view>
<view>
<!-- 普通弹窗 -->
<uni-popup ref="popup" background-color="#fff" @change="change">
<view class="popup-content">
<view class="popup-head">
<span>请输入提前结束的原因</span>
<span @click="closePopup(type)">x</span>
</view>
<view class="popup-mian">
<textarea placeholder="请输入提前结束服务原因" class="popup-mian-textarea" name="" id="" cols="30" rows="10"></textarea>
<view class="popup-mian-btn">
<span @click="closePopup(type)">
取消
</span>
<span>
确定
</span>
</view>
</view>
</view>
</uni-popup>
</view>
<empty v-if="goods.length == 0"></empty>
</view>
</template>
@ -104,6 +129,7 @@
},
data() {
return {
type:'center',
goods: [], // 数据列表
game: [],
tabs: [{
@ -218,6 +244,18 @@
}
},
methods: {
change(e) {
console.log('当前模式：' + e.type + ',状态：' + e.show);
},
closePopup(type){//提前结束 关闭弹出框
this.type = type
this.$refs.popup.close(type);
},
toggle(type) {//提前结束 弹出框
this.type = type
// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
this.$refs.popup.open(type)
},
//获取列表数据
getOrderList() {
let curTab = this.tabs[this.tabIndex].status
@ -396,15 +434,90 @@
</script>
<style lang="scss" scoped>
.popup-mian-btn span:nth-child(1){
background: linear-gradient(90deg, #FE912E, #FF9970);
}
.popup-mian-btn span:nth-child(2){
background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
}
.popup-mian-btn span{
width: 247rpx;
height: 77rpx;
line-height: 77rpx;
text-align: center;
font-weight: 400;
font-size: 32rpx;
color: #FFFEFE;
border-radius: 39rpx;
}
.popup-mian-btn{
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin-top: 10px;
}
.popup-mian-textarea{
width: 525.69rpx;
height: 211.81rpx;
}
.popup-mian{
width: 88%;
display: flex;
flex-direction: column;
margin: 5px auto 0px auto;
}
.popup-head span:nth-child(2){
width: 50rpx;
height: 50rpx;
line-height: 19px;
text-align: center;
font-size: 24px;
color: #15AB8D;
border-radius: 50%;
border: 3px solid #15AB8D;
}
.popup-head span:nth-child(1){
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
.popup-head{
width: 100%;
height: 99.38rpx;
background-color: rgba(21, 171, 141, 0.09);
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 0 15px;
}
.popup-content{
width: 613rpx;
height: 479rpx;
background: #FFFFFF;
border-radius: 56rpx;
display: flex;
flex-direction: column;
}
/deep/.btnsH{
background: #fff !important;
border: 1px solid #d7d7d7 !important;
// border: 1px solid #d7d7d7 !important;
color: #d7d7d7 !important;
width: 131rpx !important;
height: 47rpx !important;
line-height: 47px !important;
border-radius: 23rpx !important;
}
/deep/.btns{
background: #fff !important;
border: 1px solid #019C88 !important;
// border: 1px solid #019C88 !important;
color: #019C88 !important;
width: 131rpx !important;
height: 47rpx !important;
line-height: 47px !important;
border-radius: 23rpx !important;
}
.text-green span:nth-child(1){
font-weight: 400;

15
pages/public/loginmsg.vue
View File

@ -128,6 +128,7 @@
this.$queue.setData('phone', res.user.phone);
this.$queue.setData('avatar', res.user.avatar?res.user.avatar: '../../static/logo.png');
this.$queue.showToast('登录成功');
this.getIsVip('624')
setTimeout(function() {
uni.switchTab({
url:'/pages/index/index'
@ -144,6 +145,20 @@
});
}
},
getIsVip(id) {
var data={
userId:id
}
this.$Request.get("/app/VipDetails/getVipDetailByUser",data).then(res => {
if (res.code == 0) {
// this.isVip = res.data
// this.$queue.setData("isVip", res.data);
this.$queue.setData("vipName", res.data.vipName);
this.$queue.setData("rate", res.data.rate);
this.$queue.setData("rate", res.data.endTime);
}
});
}
},
}

18
pages/public/loginphone.vue
View File

@ -66,7 +66,6 @@
navBack() {
uni.navigateBack();
},
toLogin() {
this.$queue.loginClear();
let openid = this.$queue.getData("openid");
@ -96,7 +95,7 @@
this.$queue.setData("invitationCode", res.user.invitationCode);
this.$queue.setData("inviterCode", res.user.inviterCode);
this.getIsVip()
this.getIsVip('624')
uni.hideLoading();
uni.switchTab({
url: '/pages/my/index'
@ -108,12 +107,15 @@
});
}
},
getIsVip() {
this.$Request.get("/app/UserVip/isUserVip").then(res => {
getIsVip(id) {
var data={
userId:id
}
this.$Request.get("/app/VipDetails/getVipDetailByUser",data).then(res => {
if (res.code == 0) {
// this.isVip = res.data
console.log(res.data)
this.$queue.setData("isVip", res.data);
this.isVipData = res.data
this.$queue.setData("VipDetails", this.isVipData);
console.log("VipDetails",this.$queue.getData('VipDetails'))
}
});
}
@ -181,7 +183,7 @@
line-height: 80upx;
border-radius: 60upx;
margin-top: 32upx;
background: linear-gradient(to right, #223845, #00a85b);
background: linear-gradient(to right, #00a85b, #00a85b);
color: #fff;
font-size: 30upx;

275
pages/therapist/orderDetail.vue
View File

@ -1,5 +1,5 @@
<template>
<view>
<view class="content">
<view class="bg" style="padding-bottom: 10px;">
<view class="swiperBac">
<swiper style="height: 745.83rpx;" autoplay="1500" :indicator-dots="false" :circular='true'
@ -19,17 +19,12 @@
<image class="jian-view-left-img" src="../../static/orderDetail/jiankang.png" mode=""></image>
</view>
<view class="jian-view-right">
<view class="" v-if="myId != order.userId" style="margin-bottom: 3px;">
<view class="text-center shouchang" @click="follow">
<view class="shouchang-view">
<image class="shouchang-img" src="../../static/servicePackage/collection.png" v-if="!isFollow">
</image>
<image src="../../static/servicePackage/collection2.png"
style="width: 28rpx;height: 28rpx;position: relative;top: 4upx;" v-else></image>
</view>
<!-- <text style="color: #999999;margin-left: 10upx;" v-if="!isFollow">收藏</text>
<text style="margin-left: 10upx;color: #096f4b;" v-else>已收藏</text> -->
<view class="oder-mian-right">
<view class="oder-mian-view oder-mian-jin">
今日可约
</view>
<view class="oder-mian-view oder-mian-time">15:33</view>
</view>
<view class="jian-view-right-weizhi">
<image class="jian-view-right-img" src="../../static/orderDetail/dingwei.png"></image>
@ -46,11 +41,37 @@
<span>ID:178256</span>
<span>125人 关注</span>
</view>
<view class="oder-mian-right">
<view class="oder-mian-view oder-mian-jin">
今日可约
<!-- <view class="" v-if="myId != order.userId" style="margin-bottom: 3px;">
<view class="text-center shouchang" @click="follow">
<view class="shouchang-view">
<image class="shouchang-img" src="../../static/servicePackage/collection.png" v-if="!isFollow">
</image>
<image src="../../static/servicePackage/collection2.png"
style="width: 28rpx;height: 28rpx;position: relative;top: 4upx;" v-else></image>
</view>
</view>
<view class="oder-mian-view oder-mian-time">15:33</view>
</view> -->
<view class="oder-mian-tjia">
<view class="" v-if="myId != order.userId" style="margin-bottom: 3px;">
<view class="text-center shouchang" @click="follow">
<view class="shouchang-view">
<image class="shouchang-img" src="../../static/orderDetail/technician6.png" v-if="!isFollow">
</image>
<image src="../../static/orderDetail/technician6-1.png"
style="width: 45rpx;height: 45rpx;position: relative;top: 4upx;" v-else></image>
</view>
<!-- <text style="color: #999999;margin-left: 10upx;" v-if="!isFollow">收藏</text>
<text style="margin-left: 10upx;color: #096f4b;" v-else>已收藏</text> -->
</view>
</view>
<view class="oder-mian-qing" @click="toggle('center')">请TA上线</view>
<view class="oder-mian-guan">
+ 关注
</view>
</view>
<view class="oder-mian-btn">
<!-- <image src="../../static/orderDetail/technician6.png" mode=""></image> -->
</view>
</view>
<!-- <view class="padding-bottom flex justify-between">
@ -197,6 +218,45 @@
</view>
</view>
<u-skeleton :loading="loading" :animation="true" bgColor="#FFF"></u-skeleton>
<view>
<!-- 普通弹窗 -->
<uni-popup ref="popup" background-color="#fff" @change="change">
<view class="popup-content">
<view class="popup-head">
<span>打赏技师</span>
<span @click="closePopup(type)">x</span>
</view>
<view class="popup-mian">
<view class="popup-mian-textarea">
<view class="popup-mian-view popup-mian-list3">
<image src="../../static/orderDetail/reward3.png" mode=""></image>
<span>￥2</span>
</view>
<view class="popup-mian-view popup-mian-list2">
<image src="../../static/orderDetail/reward2.png" mode=""></image>
<span>￥3</span>
</view>
<view class="popup-mian-view popup-mian-list1">
<image src="../../static/orderDetail/reward1.png" mode=""></image>
<span>￥5</span>
</view>
</view>
<view class="ziding">
<span>自定义打赏金额</span>
<input placeholder="请输入打赏金额" class="ziding-inp" type="text" />
</view>
<view class="popup-mian-btn">
<span @click="closePopup(type)">
取消
</span>
<span>
确定
</span>
</view>
</view>
</view>
</uni-popup>
</view>
</view>
</template>
@ -204,6 +264,7 @@
export default {
data() {
return {
type:'center',
videoList:[
{url:'https://media.w3.org/2010/05/sintel/trailer.mp4'},
{url:'https://media.w3.org/2010/05/sintel/trailer.mp4'},
@ -300,6 +361,18 @@
});
},
methods: {
change(e) {
console.log('当前模式：' + e.type + ',状态：' + e.show);
},
closePopup(type){//打赏 关闭弹出框
this.type = type
this.$refs.popup.close(type);
},
toggle(type) {//打赏 弹出框
this.type = type
// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
this.$refs.popup.open(type)
},
// 切换菜单
tabChange(index) {
this.tabIndex = index
@ -485,6 +558,159 @@
</script>
<style scoped>
/deep/.uni-input-placeholder{
font-size: 23rpx;
color: #C8C8C8;
}
.ziding-inp{
height: 40px;
border-bottom: 1px solid #f7f7f7;
}
.ziding span{
font-weight: bold;
font-size: 25rpx;
color: #333333;
margin-top:10px;
}
.ziding{
width: 100%;
display: flex;
flex-direction: column;
}
.popup-mian-view image{
width: 85rpx;
height: 83rpx;
}
.popup-mian-view span{
font-size: 25rpx;
color: #FF5E6E;
font-weight: bold;
}
.popup-mian-list3{
background: #FFF9E5;
}
.popup-mian-list2{
background: #FFF3F8;
}
.popup-mian-list1{
background: #FAF6FF;
}
.popup-mian-view{
border-radius: 14rpx;
width: 30%;
height: 136rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.popup-mian-textarea{
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.popup-mian-btn span:nth-child(1){
background: linear-gradient(90deg, #FE912E, #FF9970);
}
.popup-mian-btn span:nth-child(2){
background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
}
.popup-mian-btn span{
width: 247rpx;
height: 77rpx;
line-height: 77rpx;
text-align: center;
font-weight: 400;
font-size: 32rpx;
color: #FFFEFE;
border-radius: 39rpx;
}
.popup-mian-btn{
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin-top: 10px;
}
.popup-mian{
width: 88%;
display: flex;
flex-direction: column;
margin: 5px auto 0px auto;
}
.popup-head span:nth-child(2){
width: 50rpx;
height: 50rpx;
line-height: 19px;
text-align: center;
font-size: 24px;
color: #15AB8D;
border-radius: 50%;
border: 3px solid #15AB8D;
}
.popup-head span:nth-child(1){
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
.popup-head{
width: 100%;
height: 99.38rpx;
background-color: rgba(21, 171, 141, 0.09);
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 0 15px;
}
.popup-content{
width: 613rpx;
height: 260px;
background: #FFFFFF;
border-radius: 56rpx;
display: flex;
flex-direction: column;
}
.content{
width: 100%;
background-color: #f7f7f7;
}
.oder-mian-tjia{
display: flex;
flex-direction: row;
align-items: center;
width: 55%;
justify-content: flex-end;
}
.oder-mian-guan{
width: 113rpx;
height: 45rpx;
line-height: 45rpx;
text-align: center;
color: #fff;
font-weight: 400;
font-size: 23rpx;
background: linear-gradient(90deg, #019C88, #0FA78B, #35C495);
border-radius: 23rpx;
}
.oder-mian-qing{
width: 65px;
height: 45rpx;
line-height: 18px;
text-align: center;
font-weight: 400;
font-size: 23rpx;
color: #029D88;
background: #fff;
border-radius: 23rpx;
margin: 0px 5px;
border: 2px solid #029D88;
}
.video-item{
width: 100%;
height: 200px;
@ -505,8 +731,8 @@
margin-top: 10px;
}
.video-list-geng image{
width: 8px;
height: 14px;
width: 6px;
height: 9px;
margin-left: 5px;
}
.video-list-geng{
@ -514,11 +740,16 @@
flex-direction: row;
align-items: center;
}
.video-list-title,.video-list-geng span{
font-size: 15px;
.video-list-title{
font-size: 28rpx;
color: #000000;
font-weight: bold;
}
.video-list-geng span{
font-size: 21rpx;
color: #878787;
}
.video-list-top{
width: 100%;
display: flex;
@ -528,7 +759,7 @@
.video-list{
width: 95%;
margin: 15px auto;
padding: 5px;
padding: 10px;
display: flex;
flex-direction: column;
background-color: #fff;
@ -550,8 +781,8 @@
justify-content: center;
}
.shouchang-img{
width: 34.03rpx;
height: 32.64rpx;
width: 45rpx;
height: 45rpx;
}
.xiangmu-cont-top-left{
font-weight: normal;

BIN
static/orderDetail/img-shang.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.4 KiB

BIN
static/orderDetail/reward1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 19 KiB

BIN
static/orderDetail/reward2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 15 KiB

BIN
static/orderDetail/reward3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

BIN
static/orderDetail/technician1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.4 KiB

BIN
static/orderDetail/technician2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.5 KiB

BIN
static/orderDetail/technician3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.6 KiB

BIN
static/orderDetail/technician4.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.3 KiB

BIN
static/orderDetail/technician5.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.2 KiB

BIN
static/orderDetail/technician6-1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.4 KiB

BIN
static/orderDetail/technician6.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.4 KiB

BIN
static/xinren.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.8 KiB

8
uni_modules/liu-goods-swiper/components/liu-goods-swiper/liu-goods-swiper.vue
View File

@ -3,9 +3,9 @@
<scroll-view scroll-x="true" class="scroll-box" style="height: 100%;">
<view :class="'item-box'+' bg'+((index+'').slice(-1))" v-for="(item,index) in goodsList" :key="index"
@click="chooseItem(item)">
<image :src="item.icon" :style="'width:'+imgWidth+'px;'+'height:'+225+'px;'" mode=""></image>
<view class="item-name">{{item.name}}</view>
<view class="item-descr">{{item.descr}}</view>
<image :src="item.artificerImg" :style="'width:'+imgWidth+'px;'+'height:'+225+'px;'" mode=""></image>
<view class="item-name">{{item.artificerName}}</view>
<view class="item-descr">{{item.classifyName}}</view>
</view>
</scroll-view>
</view>
@ -90,9 +90,11 @@
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-align: center;
}
.item-descr {
text-align: center;
display: table;
width: 100%;
font-size: 24rpx;

84
uni_modules/uni-popup/changelog.md Normal file
View File

@ -0,0 +1,84 @@
## 1.9.1（2024-04-02）
- 修复 uni-popup-dialog vue3下使用value无法进行绑定的bug(双向绑定兼容旧写法)
## 1.9.0（2024-03-28）
- 修复 uni-popup-dialog 双向绑定时初始化逻辑修正
## 1.8.9（2024-03-20）
- 修复 uni-popup-dialog 数据输入时修正为双向绑定
## 1.8.8（2024-02-20）
- 修复 uni-popup 在微信小程序下出现文字向上闪动的bug
## 1.8.7（2024-02-02）
- 新增 uni-popup-dialog 新增属性focus：input模式下，是否自动自动聚焦
## 1.8.6（2024-01-30）
- 新增 uni-popup-dialog 新增属性maxLength:限制输入框字数
## 1.8.5（2024-01-26）
- 新增 uni-popup-dialog 新增属性showClose:控制关闭按钮的显示
## 1.8.4（2023-11-15）
- 新增 uni-popup 支持uni-app-x 注意暂时仅支持 `maskClick` `@open` `@close`
## 1.8.3（2023-04-17）
- 修复 uni-popup 重复打开时的 bug
## 1.8.2（2023-02-02）
- uni-popup-dialog 组件新增 inputType 属性
## 1.8.1（2022-12-01）
- 修复 nvue 下 v-show 报错
## 1.8.0（2022-11-29）
- 优化 主题样式
## 1.7.9（2022-04-02）
- 修复 弹出层内部无法滚动的bug
## 1.7.8（2022-03-28）
- 修复 小程序中高度错误的bug
## 1.7.7（2022-03-17）
- 修复 快速调用open出现问题的Bug
## 1.7.6（2022-02-14）
- 修复 safeArea 属性不能设置为false的bug
## 1.7.5（2022-01-19）
- 修复 isMaskClick 失效的bug
## 1.7.4（2022-01-19）
- 新增 cancelText \ confirmText 属性 ，可自定义文本
- 新增 maskBackgroundColor 属性 ，可以修改蒙版颜色
- 优化 maskClick属性 更新为 isMaskClick ，解决微信小程序警告的问题
## 1.7.3（2022-01-13）
- 修复 设置 safeArea 属性不生效的bug
## 1.7.2（2021-11-26）
- 优化 组件示例
## 1.7.1（2021-11-26）
- 修复 vuedoc 文字错误
## 1.7.0（2021-11-19）
- 优化 组件UI，并提供设计资源，详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移，详见:[https://uniapp.dcloud.io/component/uniui/uni-popup](https://uniapp.dcloud.io/component/uniui/uni-popup)
## 1.6.2（2021-08-24）
- 新增 支持国际化
## 1.6.1（2021-07-30）
- 优化 vue3下事件警告的问题
## 1.6.0（2021-07-13）
- 组件兼容 vue3，如何创建vue3项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.5.0（2021-06-23）
- 新增 mask-click 遮罩层点击事件
## 1.4.5（2021-06-22）
- 修复 nvue 平台中间弹出后，点击内容，再点击遮罩无法关闭的Bug
## 1.4.4（2021-06-18）
- 修复 H5平台中间弹出后，点击内容，再点击遮罩无法关闭的Bug
## 1.4.3（2021-06-08）
- 修复 错误的 watch 字段
- 修复 safeArea 属性不生效的问题
- 修复 点击内容，再点击遮罩无法关闭的Bug
## 1.4.2（2021-05-12）
- 新增 组件示例地址
## 1.4.1（2021-04-29）
- 修复 组件内放置 input 、textarea 组件，无法聚焦的问题
## 1.4.0 （2021-04-29）
- 新增 type 属性的 left\right 值，支持左右弹出
- 新增 open(String:type) 方法参数 ，可以省略 type 属性 ，直接传入类型打开指定弹窗
- 新增 backgroundColor 属性，可定义主窗口背景色,默认不显示背景色
- 新增 safeArea 属性，是否适配底部安全区
- 修复 App\h5\微信小程序底部安全区占位不对的Bug
- 修复 App 端弹出等待的Bug
- 优化 提升低配设备性能，优化动画卡顿问题
- 优化 更简单的组件自定义方式
## 1.2.9（2021-02-05）
- 优化 组件引用关系，通过uni_modules引用组件
## 1.2.8（2021-02-05）
- 调整为uni_modules目录规范
## 1.2.7（2021-02-05）
- 调整为uni_modules目录规范
- 新增 支持 PC 端
- 新增 uni-popup-message 、uni-popup-dialog扩展组件支持 PC 端

45
uni_modules/uni-popup/components/uni-popup-dialog/keypress.js Normal file
View File

@ -0,0 +1,45 @@
// #ifdef H5
export default {
name: 'Keypress',
props: {
disable: {
type: Boolean,
default: false
}
},
mounted () {
const keyNames = {
esc: ['Esc', 'Escape'],
tab: 'Tab',
enter: 'Enter',
space: [' ', 'Spacebar'],
up: ['Up', 'ArrowUp'],
left: ['Left', 'ArrowLeft'],
right: ['Right', 'ArrowRight'],
down: ['Down', 'ArrowDown'],
delete: ['Backspace', 'Delete', 'Del']
}
const listener = ($event) => {
if (this.disable) {
return
}
const keyName = Object.keys(keyNames).find(key => {
const keyName = $event.key
const value = keyNames[key]
return value === keyName || (Array.isArray(value) && value.includes(keyName))
})
if (keyName) {
// 避免和其他按键事件冲突
setTimeout(() => {
this.$emit(keyName, {})
}, 0)
}
}
document.addEventListener('keyup', listener)
this.$once('hook:beforeDestroy', () => {
document.removeEventListener('keyup', listener)
})
},
render: () => {}
}
// #endif

316
uni_modules/uni-popup/components/uni-popup-dialog/uni-popup-dialog.vue Normal file
View File

@ -0,0 +1,316 @@
<template>
<view class="uni-popup-dialog">
<view class="uni-dialog-title">
<text class="uni-dialog-title-text" :class="['uni-popup__'+dialogType]">{{titleText}}</text>
</view>
<view v-if="mode === 'base'" class="uni-dialog-content">
<slot>
<text class="uni-dialog-content-text">{{content}}</text>
</slot>
</view>
<view v-else class="uni-dialog-content">
<slot>
<input class="uni-dialog-input" :maxlength="maxlength" v-model="val" :type="inputType"
:placeholder="placeholderText" :focus="focus">
</slot>
</view>
<view class="uni-dialog-button-group">
<view class="uni-dialog-button" v-if="showClose" @click="closeDialog">
<text class="uni-dialog-button-text">{{closeText}}</text>
</view>
<view class="uni-dialog-button" :class="showClose?'uni-border-left':''" @click="onOk">
<text class="uni-dialog-button-text uni-button-color">{{okText}}</text>
</view>
</view>
</view>
</template>
<script>
import popup from '../uni-popup/popup.js'
import {
initVueI18n
} from '@dcloudio/uni-i18n'
import messages from '../uni-popup/i18n/index.js'
const {
t
} = initVueI18n(messages)
/**
* PopUp 弹出层-对话框样式
* @description 弹出层-对话框样式
* @tutorial https://ext.dcloud.net.cn/plugin?id=329
* @property {String} value input 模式下的默认值
* @property {String} placeholder input 模式下输入提示
* @property {Boolean} focus input模式下是否自动聚焦，默认为true
* @property {String} type = [success|warning|info|error] 主题样式
* @value success 成功
* @value warning 提示
* @value info 消息
* @value error 错误
* @property {String} mode = [base|input] 模式、
* @value base 基础对话框
* @value input 可输入对话框
* @showClose {Boolean} 是否显示关闭按钮
* @property {String} content 对话框内容
* @property {Boolean} beforeClose 是否拦截取消事件
* @property {Number} maxlength 输入
* @event {Function} confirm 点击确认按钮触发
* @event {Function} close 点击取消按钮触发
*/
export default {
name: "uniPopupDialog",
mixins: [popup],
emits: ['confirm', 'close', 'update:modelValue', 'input'],
props: {
inputType: {
type: String,
default: 'text'
},
showClose: {
type: Boolean,
default: true
},
// #ifdef VUE2
value: {
type: [String, Number],
default: ''
},
// #endif
// #ifdef VUE3
modelValue: {
type: [Number, String],
default: ''
},
// #endif
placeholder: {
type: [String, Number],
default: ''
},
type: {
type: String,
default: 'error'
},
mode: {
type: String,
default: 'base'
},
title: {
type: String,
default: ''
},
content: {
type: String,
default: ''
},
beforeClose: {
type: Boolean,
default: false
},
cancelText: {
type: String,
default: ''
},
confirmText: {
type: String,
default: ''
},
maxlength: {
type: Number,
default: -1,
},
focus: {
type: Boolean,
default: true,
}
},
data() {
return {
dialogType: 'error',
val: ""
}
},
computed: {
okText() {
return this.confirmText || t("uni-popup.ok")
},
closeText() {
return this.cancelText || t("uni-popup.cancel")
},
placeholderText() {
return this.placeholder || t("uni-popup.placeholder")
},
titleText() {
return this.title || t("uni-popup.title")
}
},
watch: {
type(val) {
this.dialogType = val
},
mode(val) {
if (val === 'input') {
this.dialogType = 'info'
}
},
value(val) {
if (this.maxlength != -1 && this.mode === 'input') {
this.val = val.slice(0, this.maxlength);
} else {
this.val = val
}
},
val(val) {
// #ifdef VUE2
// TODO 兼容 vue2
this.$emit('input', val);
// #endif
// #ifdef VUE3
// TODO　兼容　vue3
this.$emit('update:modelValue', val);
// #endif
}
},
created() {
// 对话框遮罩不可点击
this.popup.disableMask()
// this.popup.closeMask()
if (this.mode === 'input') {
this.dialogType = 'info'
this.val = this.value;
// #ifdef VUE3
this.val = this.modelValue;
// #endif
} else {
this.dialogType = this.type
}
},
methods: {
/**
* 点击确认按钮
*/
onOk() {
if (this.mode === 'input') {
this.$emit('confirm', this.val)
} else {
this.$emit('confirm')
}
if (this.beforeClose) return
this.popup.close()
},
/**
* 点击取消按钮
*/
closeDialog() {
this.$emit('close')
if (this.beforeClose) return
this.popup.close()
},
close() {
this.popup.close()
}
}
}
</script>
<style lang="scss">
.uni-popup-dialog {
width: 300px;
border-radius: 11px;
background-color: #fff;
}
.uni-dialog-title {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
justify-content: center;
padding-top: 25px;
}
.uni-dialog-title-text {
font-size: 16px;
font-weight: 500;
}
.uni-dialog-content {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
justify-content: center;
align-items: center;
padding: 20px;
}
.uni-dialog-content-text {
font-size: 14px;
color: #6C6C6C;
}
.uni-dialog-button-group {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
border-top-color: #f5f5f5;
border-top-style: solid;
border-top-width: 1px;
}
.uni-dialog-button {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex: 1;
flex-direction: row;
justify-content: center;
align-items: center;
height: 45px;
}
.uni-border-left {
border-left-color: #f0f0f0;
border-left-style: solid;
border-left-width: 1px;
}
.uni-dialog-button-text {
font-size: 16px;
color: #333;
}
.uni-button-color {
color: #007aff;
}
.uni-dialog-input {
flex: 1;
font-size: 14px;
border: 1px #eee solid;
height: 40px;
padding: 0 10px;
border-radius: 5px;
color: #555;
}
.uni-popup__success {
color: #4cd964;
}
.uni-popup__warn {
color: #f0ad4e;
}
.uni-popup__error {
color: #dd524d;
}
.uni-popup__info {
color: #909399;
}
</style>

143
uni_modules/uni-popup/components/uni-popup-message/uni-popup-message.vue Normal file
View File

@ -0,0 +1,143 @@
<template>
<view class="uni-popup-message">
<view class="uni-popup-message__box fixforpc-width" :class="'uni-popup__'+type">
<slot>
<text class="uni-popup-message-text" :class="'uni-popup__'+type+'-text'">{{message}}</text>
</slot>
</view>
</view>
</template>
<script>
import popup from '../uni-popup/popup.js'
/**
* PopUp 弹出层-消息提示
* @description 弹出层-消息提示
* @tutorial https://ext.dcloud.net.cn/plugin?id=329
* @property {String} type = [success|warning|info|error] 主题样式
* @value success 成功
* @value warning 提示
* @value info 消息
* @value error 错误
* @property {String} message 消息提示文字
* @property {String} duration 显示时间，设置为 0 则不会自动关闭
*/
export default {
name: 'uniPopupMessage',
mixins:[popup],
props: {
/**
* 主题 success/warning/info/error 默认 success
*/
type: {
type: String,
default: 'success'
},
/**
* 消息文字
*/
message: {
type: String,
default: ''
},
/**
* 显示时间，设置为 0 则不会自动关闭
*/
duration: {
type: Number,
default: 3000
},
maskShow:{
type:Boolean,
default:false
}
},
data() {
return {}
},
created() {
this.popup.maskShow = this.maskShow
this.popup.messageChild = this
},
methods: {
timerClose(){
if(this.duration === 0) return
clearTimeout(this.timer)
this.timer = setTimeout(()=>{
this.popup.close()
},this.duration)
}
}
}
</script>
<style lang="scss" >
.uni-popup-message {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
justify-content: center;
}
.uni-popup-message__box {
background-color: #e1f3d8;
padding: 10px 15px;
border-color: #eee;
border-style: solid;
border-width: 1px;
flex: 1;
}
@media screen and (min-width: 500px) {
.fixforpc-width {
margin-top: 20px;
border-radius: 4px;
flex: none;
min-width: 380px;
/* #ifndef APP-NVUE */
max-width: 50%;
/* #endif */
/* #ifdef APP-NVUE */
max-width: 500px;
/* #endif */
}
}
.uni-popup-message-text {
font-size: 14px;
padding: 0;
}
.uni-popup__success {
background-color: #e1f3d8;
}
.uni-popup__success-text {
color: #67C23A;
}
.uni-popup__warn {
background-color: #faecd8;
}
.uni-popup__warn-text {
color: #E6A23C;
}
.uni-popup__error {
background-color: #fde2e2;
}
.uni-popup__error-text {
color: #F56C6C;
}
.uni-popup__info {
background-color: #F2F6FC;
}
.uni-popup__info-text {
color: #909399;
}
</style>

187
uni_modules/uni-popup/components/uni-popup-share/uni-popup-share.vue Normal file
View File

@ -0,0 +1,187 @@
<template>
<view class="uni-popup-share">
<view class="uni-share-title"><text class="uni-share-title-text">{{shareTitleText}}</text></view>
<view class="uni-share-content">
<view class="uni-share-content-box">
<view class="uni-share-content-item" v-for="(item,index) in bottomData" :key="index" @click.stop="select(item,index)">
<image class="uni-share-image" :src="item.icon" mode="aspectFill"></image>
<text class="uni-share-text">{{item.text}}</text>
</view>
</view>
</view>
<view class="uni-share-button-box">
<button class="uni-share-button" @click="close">{{cancelText}}</button>
</view>
</view>
</template>
<script>
import popup from '../uni-popup/popup.js'
import {
initVueI18n
} from '@dcloudio/uni-i18n'
import messages from '../uni-popup/i18n/index.js'
const { t } = initVueI18n(messages)
export default {
name: 'UniPopupShare',
mixins:[popup],
emits:['select'],
props: {
title: {
type: String,
default: ''
},
beforeClose: {
type: Boolean,
default: false
}
},
data() {
return {
bottomData: [{
text: '微信',
icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/c2b17470-50be-11eb-b680-7980c8a877b8.png',
name: 'wx'
},
{
text: '支付宝',
icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/d684ae40-50be-11eb-8ff1-d5dcf8779628.png',
name: 'ali'
},
{
text: 'QQ',
icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/e7a79520-50be-11eb-b997-9918a5dda011.png',
name: 'qq'
},
{
text: '新浪',
icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/0dacdbe0-50bf-11eb-8ff1-d5dcf8779628.png',
name: 'sina'
},
// {
// text: '百度',
// icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/1ec6e920-50bf-11eb-8a36-ebb87efcf8c0.png',
// name: 'copy'
// },
// {
// text: '其他',
// icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/2e0fdfe0-50bf-11eb-b997-9918a5dda011.png',
// name: 'more'
// }
]
}
},
created() {},
computed: {
cancelText() {
return t("uni-popup.cancel")
},
shareTitleText() {
return this.title || t("uni-popup.shareTitle")
}
},
methods: {
/**
* 选择内容
*/
select(item, index) {
this.$emit('select', {
item,
index
})
this.close()
},
/**
* 关闭窗口
*/
close() {
if(this.beforeClose) return
this.popup.close()
}
}
}
</script>
<style lang="scss" >
.uni-popup-share {
background-color: #fff;
border-top-left-radius: 11px;
border-top-right-radius: 11px;
}
.uni-share-title {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
align-items: center;
justify-content: center;
height: 40px;
}
.uni-share-title-text {
font-size: 14px;
color: #666;
}
.uni-share-content {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
justify-content: center;
padding-top: 10px;
}
.uni-share-content-box {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
flex-wrap: wrap;
width: 360px;
}
.uni-share-content-item {
width: 90px;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
justify-content: center;
padding: 10px 0;
align-items: center;
}
.uni-share-content-item:active {
background-color: #f5f5f5;
}
.uni-share-image {
width: 30px;
height: 30px;
}
.uni-share-text {
margin-top: 10px;
font-size: 14px;
color: #3B4144;
}
.uni-share-button-box {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
padding: 10px 15px;
}
.uni-share-button {
flex: 1;
border-radius: 50px;
color: #666;
font-size: 16px;
}
.uni-share-button::after {
border-radius: 50px;
}
</style>

7
uni_modules/uni-popup/components/uni-popup/i18n/en.json Normal file
View File

@ -0,0 +1,7 @@
{
"uni-popup.cancel": "cancel",
"uni-popup.ok": "ok",
"uni-popup.placeholder": "pleace enter",
"uni-popup.title": "Hint",
"uni-popup.shareTitle": "Share to"
}

8
uni_modules/uni-popup/components/uni-popup/i18n/index.js Normal file
View File

@ -0,0 +1,8 @@
import en from './en.json'
import zhHans from './zh-Hans.json'
import zhHant from './zh-Hant.json'
export default {
en,
'zh-Hans': zhHans,
'zh-Hant': zhHant
}

7
uni_modules/uni-popup/components/uni-popup/i18n/zh-Hans.json Normal file
View File

@ -0,0 +1,7 @@
{
"uni-popup.cancel": "取消",
"uni-popup.ok": "确定",
"uni-popup.placeholder": "请输入",
"uni-popup.title": "提示",
"uni-popup.shareTitle": "分享到"
}

7
uni_modules/uni-popup/components/uni-popup/i18n/zh-Hant.json Normal file
View File

@ -0,0 +1,7 @@
{
"uni-popup.cancel": "取消",
"uni-popup.ok": "確定",
"uni-popup.placeholder": "請輸入",
"uni-popup.title": "提示",
"uni-popup.shareTitle": "分享到"
}

45
uni_modules/uni-popup/components/uni-popup/keypress.js Normal file
View File

@ -0,0 +1,45 @@
// #ifdef H5
export default {
name: 'Keypress',
props: {
disable: {
type: Boolean,
default: false
}
},
mounted () {
const keyNames = {
esc: ['Esc', 'Escape'],
tab: 'Tab',
enter: 'Enter',
space: [' ', 'Spacebar'],
up: ['Up', 'ArrowUp'],
left: ['Left', 'ArrowLeft'],
right: ['Right', 'ArrowRight'],
down: ['Down', 'ArrowDown'],
delete: ['Backspace', 'Delete', 'Del']
}
const listener = ($event) => {
if (this.disable) {
return
}
const keyName = Object.keys(keyNames).find(key => {
const keyName = $event.key
const value = keyNames[key]
return value === keyName || (Array.isArray(value) && value.includes(keyName))
})
if (keyName) {
// 避免和其他按键事件冲突
setTimeout(() => {
this.$emit(keyName, {})
}, 0)
}
}
document.addEventListener('keyup', listener)
// this.$once('hook:beforeDestroy', () => {
// document.removeEventListener('keyup', listener)
// })
},
render: () => {}
}
// #endif

26
uni_modules/uni-popup/components/uni-popup/popup.js Normal file
View File

@ -0,0 +1,26 @@
export default {
data() {
return {
}
},
created(){
this.popup = this.getParent()
},
methods:{
/**
* 获取父元素实例
*/
getParent(name = 'uniPopup') {
let parent = this.$parent;
let parentName = parent.$options.name;
while (parentName !== name) {
parent = parent.$parent;
if (!parent) return false
parentName = parent.$options.name;
}
return parent;
},
}
}

90
uni_modules/uni-popup/components/uni-popup/uni-popup.uvue Normal file
View File

@ -0,0 +1,90 @@
<template>
<view class="popup-root" v-if="isOpen" v-show="isShow" @click="clickMask">
<view @click.stop>
<slot></slot>
</view>
</view>
</template>
<script>
type CloseCallBack = ()=> void;
let closeCallBack:CloseCallBack = () :void => {};
export default {
emits:["close","clickMask"],
data() {
return {
isShow:false,
isOpen:false
}
},
props: {
maskClick: {
type: Boolean,
default: true
},
},
watch: {
// 设置show = true 时，如果没有 open 需要设置为 open
isShow:{
handler(isShow) {
// console.log("isShow",isShow)
if(isShow && this.isOpen == false){
this.isOpen = true
}
},
immediate:true
},
// 设置isOpen = true 时，如果没有 isShow 需要设置为 isShow
isOpen:{
handler(isOpen) {
// console.log("isOpen",isOpen)
if(isOpen && this.isShow == false){
this.isShow = true
}
},
immediate:true
}
},
methods:{
open(){
// ...funs : CloseCallBack[]
// if(funs.length > 0){
// closeCallBack = funs[0]
// }
this.isOpen = true;
},
clickMask(){
if(this.maskClick == true){
this.$emit('clickMask')
this.close()
}
},
close(): void{
this.isOpen = false;
this.$emit('close')
closeCallBack()
},
hiden(){
this.isShow = false
},
show(){
this.isShow = true
}
}
}
</script>
<style>
.popup-root {
position: fixed;
top: 0;
left: 0;
width: 750rpx;
height: 100%;
flex: 1;
background-color: rgba(0, 0, 0, 0.3);
justify-content: center;
align-items: center;
z-index: 99;
}
</style>

503
uni_modules/uni-popup/components/uni-popup/uni-popup.vue Normal file
View File

@ -0,0 +1,503 @@
<template>
<view v-if="showPopup" class="uni-popup" :class="[popupstyle, isDesktop ? 'fixforpc-z-index' : '']">
<view @touchstart="touchstart">
<uni-transition key="1" v-if="maskShow" name="mask" mode-class="fade" :styles="maskClass"
:duration="duration" :show="showTrans" @click="onTap" />
<uni-transition key="2" :mode-class="ani" name="content" :styles="transClass" :duration="duration"
:show="showTrans" @click="onTap">
<view class="uni-popup__wrapper" :style="getStyles" :class="[popupstyle]" @click="clear">
<slot />
</view>
</uni-transition>
</view>
<!-- #ifdef H5 -->
<keypress v-if="maskShow" @esc="onTap" />
<!-- #endif -->
</view>
</template>
<script>
// #ifdef H5
import keypress from './keypress.js'
// #endif
/**
* PopUp 弹出层
* @description 弹出层组件，为了解决遮罩弹层的问题
* @tutorial https://ext.dcloud.net.cn/plugin?id=329
* @property {String} type = [top|center|bottom|left|right|message|dialog|share] 弹出方式
* @value top 顶部弹出
* @value center 中间弹出
* @value bottom 底部弹出
* @value left 左侧弹出
* @value right 右侧弹出
* @value message 消息提示
* @value dialog 对话框
* @value share 底部分享示例
* @property {Boolean} animation = [true|false] 是否开启动画
* @property {Boolean} maskClick = [true|false] 蒙版点击是否关闭弹窗(废弃)
* @property {Boolean} isMaskClick = [true|false] 蒙版点击是否关闭弹窗
* @property {String} backgroundColor 主窗口背景色
* @property {String} maskBackgroundColor 蒙版颜色
* @property {String} borderRadius 设置圆角(左上、右上、右下和左下) 示例:"10px 10px 10px 10px"
* @property {Boolean} safeArea 是否适配底部安全区
* @event {Function} change 打开关闭弹窗触发，e={show: false}
* @event {Function} maskClick 点击遮罩触发
*/
export default {
name: 'uniPopup',
components: {
// #ifdef H5
keypress
// #endif
},
emits: ['change', 'maskClick'],
props: {
// 开启动画
animation: {
type: Boolean,
default: true
},
// 弹出层类型，可选值，top: 顶部弹出层；bottom：底部弹出层；center：全屏弹出层
// message: 消息提示 ; dialog : 对话框
type: {
type: String,
default: 'center'
},
// maskClick
isMaskClick: {
type: Boolean,
default: null
},
// TODO 2 个版本后废弃属性 ，使用 isMaskClick
maskClick: {
type: Boolean,
default: null
},
backgroundColor: {
type: String,
default: 'none'
},
safeArea: {
type: Boolean,
default: true
},
maskBackgroundColor: {
type: String,
default: 'rgba(0, 0, 0, 0.4)'
},
borderRadius:{
type: String,
}
},
watch: {
/**
* 监听type类型
*/
type: {
handler: function(type) {
if (!this.config[type]) return
this[this.config[type]](true)
},
immediate: true
},
isDesktop: {
handler: function(newVal) {
if (!this.config[newVal]) return
this[this.config[this.type]](true)
},
immediate: true
},
/**
* 监听遮罩是否可点击
* @param {Object} val
*/
maskClick: {
handler: function(val) {
this.mkclick = val
},
immediate: true
},
isMaskClick: {
handler: function(val) {
this.mkclick = val
},
immediate: true
},
// H5 下禁止底部滚动
showPopup(show) {
// #ifdef H5
// fix by mehaotian 处理 h5 滚动穿透的问题
document.getElementsByTagName('body')[0].style.overflow = show ? 'hidden' : 'visible'
// #endif
}
},
data() {
return {
duration: 300,
ani: [],
showPopup: false,
showTrans: false,
popupWidth: 0,
popupHeight: 0,
config: {
top: 'top',
bottom: 'bottom',
center: 'center',
left: 'left',
right: 'right',
message: 'top',
dialog: 'center',
share: 'bottom'
},
maskClass: {
position: 'fixed',
bottom: 0,
top: 0,
left: 0,
right: 0,
backgroundColor: 'rgba(0, 0, 0, 0.4)'
},
transClass: {
backgroundColor: 'transparent',
borderRadius: this.borderRadius || "0",
position: 'fixed',
left: 0,
right: 0
},
maskShow: true,
mkclick: true,
popupstyle: 'top'
}
},
computed: {
getStyles() {
let res = { backgroundColor: this.bg };
if (this.borderRadius || "0") {
res = Object.assign(res, { borderRadius: this.borderRadius })
}
return res;
},
isDesktop() {
return this.popupWidth >= 500 && this.popupHeight >= 500
},
bg() {
if (this.backgroundColor === '' || this.backgroundColor === 'none') {
return 'transparent'
}
return this.backgroundColor
}
},
mounted() {
const fixSize = () => {
const {
windowWidth,
windowHeight,
windowTop,
safeArea,
screenHeight,
safeAreaInsets
} = uni.getSystemInfoSync()
this.popupWidth = windowWidth
this.popupHeight = windowHeight + (windowTop || 0)
// TODO fix by mehaotian 是否适配底部安全区 ,目前微信ios 、和 app ios 计算有差异，需要框架修复
if (safeArea && this.safeArea) {
// #ifdef MP-WEIXIN
this.safeAreaInsets = screenHeight - safeArea.bottom
// #endif
// #ifndef MP-WEIXIN
this.safeAreaInsets = safeAreaInsets.bottom
// #endif
} else {
this.safeAreaInsets = 0
}
}
fixSize()
// #ifdef H5
// window.addEventListener('resize', fixSize)
// this.$once('hook:beforeDestroy', () => {
// window.removeEventListener('resize', fixSize)
// })
// #endif
},
// #ifndef VUE3
// TODO vue2
destroyed() {
this.setH5Visible()
},
// #endif
// #ifdef VUE3
// TODO vue3
unmounted() {
this.setH5Visible()
},
// #endif
activated() {
this.setH5Visible(!this.showPopup);
},
deactivated() {
this.setH5Visible(true);
},
created() {
// this.mkclick = this.isMaskClick || this.maskClick
if (this.isMaskClick === null && this.maskClick === null) {
this.mkclick = true
} else {
this.mkclick = this.isMaskClick !== null ? this.isMaskClick : this.maskClick
}
if (this.animation) {
this.duration = 300
} else {
this.duration = 0
}
// TODO 处理 message 组件生命周期异常的问题
this.messageChild = null
// TODO 解决头条冒泡的问题
this.clearPropagation = false
this.maskClass.backgroundColor = this.maskBackgroundColor
},
methods: {
setH5Visible(visible = true) {
// #ifdef H5
// fix by mehaotian 处理 h5 滚动穿透的问题
document.getElementsByTagName('body')[0].style.overflow = visible ? "visible" : "hidden";
// #endif
},
/**
* 公用方法，不显示遮罩层
*/
closeMask() {
this.maskShow = false
},
/**
* 公用方法，遮罩层禁止点击
*/
disableMask() {
this.mkclick = false
},
// TODO nvue 取消冒泡
clear(e) {
// #ifndef APP-NVUE
e.stopPropagation()
// #endif
this.clearPropagation = true
},
open(direction) {
// fix by mehaotian 处理快速打开关闭的情况
if (this.showPopup) {
return
}
let innerType = ['top', 'center', 'bottom', 'left', 'right', 'message', 'dialog', 'share']
if (!(direction && innerType.indexOf(direction) !== -1)) {
direction = this.type
}
if (!this.config[direction]) {
console.error('缺少类型：', direction)
return
}
this[this.config[direction]]()
this.$emit('change', {
show: true,
type: direction
})
},
close(type) {
this.showTrans = false
this.$emit('change', {
show: false,
type: this.type
})
clearTimeout(this.timer)
// // 自定义关闭事件
// this.customOpen && this.customClose()
this.timer = setTimeout(() => {
this.showPopup = false
}, 300)
},
// TODO 处理冒泡事件，头条的冒泡事件有问题 ，先这样兼容
touchstart() {
this.clearPropagation = false
},
onTap() {
if (this.clearPropagation) {
// fix by mehaotian 兼容 nvue
this.clearPropagation = false
return
}
this.$emit('maskClick')
if (!this.mkclick) return
this.close()
},
/**
* 顶部弹出样式处理
*/
top(type) {
this.popupstyle = this.isDesktop ? 'fixforpc-top' : 'top'
this.ani = ['slide-top']
this.transClass = {
position: 'fixed',
left: 0,
right: 0,
backgroundColor: this.bg,
borderRadius:this.borderRadius || "0"
}
// TODO 兼容 type 属性 ，后续会废弃
if (type) return
this.showPopup = true
this.showTrans = true
this.$nextTick(() => {
if (this.messageChild && this.type === 'message') {
this.messageChild.timerClose()
}
})
},
/**
* 底部弹出样式处理
*/
bottom(type) {
this.popupstyle = 'bottom'
this.ani = ['slide-bottom']
this.transClass = {
position: 'fixed',
left: 0,
right: 0,
bottom: 0,
paddingBottom: this.safeAreaInsets + 'px',
backgroundColor: this.bg,
borderRadius:this.borderRadius || "0",
}
// TODO 兼容 type 属性 ，后续会废弃
if (type) return
this.showPopup = true
this.showTrans = true
},
/**
* 中间弹出样式处理
*/
center(type) {
this.popupstyle = 'center'
//微信小程序下，组合动画会出现文字向上闪动问题，再此做特殊处理
// #ifdef MP-WEIXIN
this.ani = ['fade']
// #endif
// #ifndef MP-WEIXIN
this.ani = ['zoom-out', 'fade']
// #endif
this.transClass = {
position: 'fixed',
/* #ifndef APP-NVUE */
display: 'flex',
flexDirection: 'column',
/* #endif */
bottom: 0,
left: 0,
right: 0,
top: 0,
justifyContent: 'center',
alignItems: 'center',
borderRadius:this.borderRadius || "0"
}
// TODO 兼容 type 属性 ，后续会废弃
if (type) return
this.showPopup = true
this.showTrans = true
},
left(type) {
this.popupstyle = 'left'
this.ani = ['slide-left']
this.transClass = {
position: 'fixed',
left: 0,
bottom: 0,
top: 0,
backgroundColor: this.bg,
borderRadius:this.borderRadius || "0",
/* #ifndef APP-NVUE */
display: 'flex',
flexDirection: 'column'
/* #endif */
}
// TODO 兼容 type 属性 ，后续会废弃
if (type) return
this.showPopup = true
this.showTrans = true
},
right(type) {
this.popupstyle = 'right'
this.ani = ['slide-right']
this.transClass = {
position: 'fixed',
bottom: 0,
right: 0,
top: 0,
backgroundColor: this.bg,
borderRadius:this.borderRadius || "0",
/* #ifndef APP-NVUE */
display: 'flex',
flexDirection: 'column'
/* #endif */
}
// TODO 兼容 type 属性 ，后续会废弃
if (type) return
this.showPopup = true
this.showTrans = true
}
}
}
</script>
<style lang="scss">
.uni-popup {
position: fixed;
/* #ifndef APP-NVUE */
z-index: 99;
/* #endif */
&.top,
&.left,
&.right {
/* #ifdef H5 */
top: var(--window-top);
/* #endif */
/* #ifndef H5 */
top: 0;
/* #endif */
}
.uni-popup__wrapper {
/* #ifndef APP-NVUE */
display: block;
/* #endif */
position: relative;
/* iphonex 等安全区设置，底部安全区适配 */
/* #ifndef APP-NVUE */
// padding-bottom: constant(safe-area-inset-bottom);
// padding-bottom: env(safe-area-inset-bottom);
/* #endif */
&.left,
&.right {
/* #ifdef H5 */
padding-top: var(--window-top);
/* #endif */
/* #ifndef H5 */
padding-top: 0;
/* #endif */
flex: 1;
}
}
}
.fixforpc-z-index {
/* #ifndef APP-NVUE */
z-index: 999;
/* #endif */
}
.fixforpc-top {
top: 0;
}
</style>

88
uni_modules/uni-popup/package.json Normal file
View File

@ -0,0 +1,88 @@
{
"id": "uni-popup",
"displayName": "uni-popup 弹出层",
"version": "1.9.1",
"description": " Popup 组件，提供常用的弹层",
"keywords": [
"uni-ui",
"弹出层",
"弹窗",
"popup",
"弹框"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
"type": "component-vue"
},
"uni_modules": {
"dependencies": [
"uni-scss",
"uni-transition"
],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y",
"alipay": "n"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

17
uni_modules/uni-popup/readme.md Normal file
View File

@ -0,0 +1,17 @@
## Popup 弹出层
> **组件名：uni-popup**
> 代码块： `uPopup`
> 关联组件：`uni-transition`
弹出层组件，在应用中弹出一个消息提示窗口、提示框等
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-popup)
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839

24
uni_modules/uni-transition/changelog.md Normal file
View File

@ -0,0 +1,24 @@
## 1.3.3（2024-04-23）
- 修复 当元素会受变量影响自动隐藏的bug
## 1.3.2（2023-05-04）
- 修复 NVUE 平台报错的问题
## 1.3.1（2021-11-23）
- 修复 init 方法初始化问题
## 1.3.0（2021-11-19）
- 优化 组件UI，并提供设计资源，详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移，详见:[https://uniapp.dcloud.io/component/uniui/uni-transition](https://uniapp.dcloud.io/component/uniui/uni-transition)
## 1.2.1（2021-09-27）
- 修复 init 方法不生效的 Bug
## 1.2.0（2021-07-30）
- 组件兼容 vue3，如何创建 vue3 项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.1.1（2021-05-12）
- 新增 示例地址
- 修复 示例项目缺少组件的 Bug
## 1.1.0（2021-04-22）
- 新增 通过方法自定义动画
- 新增 custom-class 非 NVUE 平台支持自定义 class 定制样式
- 优化 动画触发逻辑，使动画更流畅
- 优化 支持单独的动画类型
- 优化 文档示例
## 1.0.2（2021-02-05）
- 调整为 uni_modules 目录规范

131
uni_modules/uni-transition/components/uni-transition/createAnimation.js Normal file
View File

@ -0,0 +1,131 @@
// const defaultOption = {
// duration: 300,
// timingFunction: 'linear',
// delay: 0,
// transformOrigin: '50% 50% 0'
// }
// #ifdef APP-NVUE
const nvueAnimation = uni.requireNativePlugin('animation')
// #endif
class MPAnimation {
constructor(options, _this) {
this.options = options
// 在iOS10+QQ小程序平台下，传给原生的对象一定是个普通对象而不是Proxy对象，否则会报parameter should be Object instead of ProxyObject的错误
this.animation = uni.createAnimation({
...options
})
this.currentStepAnimates = {}
this.next = 0
this.$ = _this
}
_nvuePushAnimates(type, args) {
let aniObj = this.currentStepAnimates[this.next]
let styles = {}
if (!aniObj) {
styles = {
styles: {},
config: {}
}
} else {
styles = aniObj
}
if (animateTypes1.includes(type)) {
if (!styles.styles.transform) {
styles.styles.transform = ''
}
let unit = ''
if(type === 'rotate'){
unit = 'deg'
}
styles.styles.transform += `${type}(${args+unit}) `
} else {
styles.styles[type] = `${args}`
}
this.currentStepAnimates[this.next] = styles
}
_animateRun(styles = {}, config = {}) {
let ref = this.$.$refs['ani'].ref
if (!ref) return
return new Promise((resolve, reject) => {
nvueAnimation.transition(ref, {
styles,
...config
}, res => {
resolve()
})
})
}
_nvueNextAnimate(animates, step = 0, fn) {
let obj = animates[step]
if (obj) {
let {
styles,
config
} = obj
this._animateRun(styles, config).then(() => {
step += 1
this._nvueNextAnimate(animates, step, fn)
})
} else {
this.currentStepAnimates = {}
typeof fn === 'function' && fn()
this.isEnd = true
}
}
step(config = {}) {
// #ifndef APP-NVUE
this.animation.step(config)
// #endif
// #ifdef APP-NVUE
this.currentStepAnimates[this.next].config = Object.assign({}, this.options, config)
this.currentStepAnimates[this.next].styles.transformOrigin = this.currentStepAnimates[this.next].config.transformOrigin
this.next++
// #endif
return this
}
run(fn) {
// #ifndef APP-NVUE
this.$.animationData = this.animation.export()
this.$.timer = setTimeout(() => {
typeof fn === 'function' && fn()
}, this.$.durationTime)
// #endif
// #ifdef APP-NVUE
this.isEnd = false
let ref = this.$.$refs['ani'] && this.$.$refs['ani'].ref
if(!ref) return
this._nvueNextAnimate(this.currentStepAnimates, 0, fn)
this.next = 0
// #endif
}
}
const animateTypes1 = ['matrix', 'matrix3d', 'rotate', 'rotate3d', 'rotateX', 'rotateY', 'rotateZ', 'scale', 'scale3d',
'scaleX', 'scaleY', 'scaleZ', 'skew', 'skewX', 'skewY', 'translate', 'translate3d', 'translateX', 'translateY',
'translateZ'
]
const animateTypes2 = ['opacity', 'backgroundColor']
const animateTypes3 = ['width', 'height', 'left', 'right', 'top', 'bottom']
animateTypes1.concat(animateTypes2, animateTypes3).forEach(type => {
MPAnimation.prototype[type] = function(...args) {
// #ifndef APP-NVUE
this.animation[type](...args)
// #endif
// #ifdef APP-NVUE
this._nvuePushAnimates(type, args)
// #endif
return this
}
})
export function createAnimation(option, _this) {
if(!_this) return
clearTimeout(_this.timer)
return new MPAnimation(option, _this)
}

286
uni_modules/uni-transition/components/uni-transition/uni-transition.vue Normal file
View File

@ -0,0 +1,286 @@
<template>
<!-- #ifndef APP-NVUE -->
<view v-show="isShow" ref="ani" :animation="animationData" :class="customClass" :style="transformStyles" @click="onClick"><slot></slot></view>
<!-- #endif -->
<!-- #ifdef APP-NVUE -->
<view v-if="isShow" ref="ani" :animation="animationData" :class="customClass" :style="transformStyles" @click="onClick"><slot></slot></view>
<!-- #endif -->
</template>
<script>
import { createAnimation } from './createAnimation'
/**
* Transition 过渡动画
* @description 简单过渡动画组件
* @tutorial https://ext.dcloud.net.cn/plugin?id=985
* @property {Boolean} show = [false|true] 控制组件显示或隐藏
* @property {Array|String} modeClass = [fade|slide-top|slide-right|slide-bottom|slide-left|zoom-in|zoom-out] 过渡动画类型
* @value fade 渐隐渐出过渡
* @value slide-top 由上至下过渡
* @value slide-right 由右至左过渡
* @value slide-bottom 由下至上过渡
* @value slide-left 由左至右过渡
* @value zoom-in 由小到大过渡
* @value zoom-out 由大到小过渡
* @property {Number} duration 过渡动画持续时间
* @property {Object} styles 组件样式，同 css 样式，注意带’-‘连接符的属性需要使用小驼峰写法如：`backgroundColor:red`
*/
export default {
name: 'uniTransition',
emits:['click','change'],
props: {
show: {
type: Boolean,
default: false
},
modeClass: {
type: [Array, String],
default() {
return 'fade'
}
},
duration: {
type: Number,
default: 300
},
styles: {
type: Object,
default() {
return {}
}
},
customClass:{
type: String,
default: ''
},
onceRender:{
type:Boolean,
default:false
},
},
data() {
return {
isShow: false,
transform: '',
opacity: 1,
animationData: {},
durationTime: 300,
config: {}
}
},
watch: {
show: {
handler(newVal) {
if (newVal) {
this.open()
} else {
// 避免上来就执行 close,导致动画错乱
if (this.isShow) {
this.close()
}
}
},
immediate: true
}
},
computed: {
// 生成样式数据
stylesObject() {
let styles = {
...this.styles,
'transition-duration': this.duration / 1000 + 's'
}
let transform = ''
for (let i in styles) {
let line = this.toLine(i)
transform += line + ':' + styles[i] + ';'
}
return transform
},
// 初始化动画条件
transformStyles() {
return 'transform:' + this.transform + ';' + 'opacity:' + this.opacity + ';' + this.stylesObject
}
},
created() {
// 动画默认配置
this.config = {
duration: this.duration,
timingFunction: 'ease',
transformOrigin: '50% 50%',
delay: 0
}
this.durationTime = this.duration
},
methods: {
/**
* ref 触发 初始化动画
*/
init(obj = {}) {
if (obj.duration) {
this.durationTime = obj.duration
}
this.animation = createAnimation(Object.assign(this.config, obj),this)
},
/**
* 点击组件触发回调
*/
onClick() {
this.$emit('click', {
detail: this.isShow
})
},
/**
* ref 触发 动画分组
* @param {Object} obj
*/
step(obj, config = {}) {
if (!this.animation) return
for (let i in obj) {
try {
if(typeof obj[i] === 'object'){
this.animation[i](...obj[i])
}else{
this.animation[i](obj[i])
}
} catch (e) {
console.error(`方法 ${i} 不存在`)
}
}
this.animation.step(config)
return this
},
/**
* ref 触发 执行动画
*/
run(fn) {
if (!this.animation) return
this.animation.run(fn)
},
// 开始过度动画
open() {
clearTimeout(this.timer)
this.transform = ''
this.isShow = true
let { opacity, transform } = this.styleInit(false)
if (typeof opacity !== 'undefined') {
this.opacity = opacity
}
this.transform = transform
// 确保动态样式已经生效后，执行动画，如果不加 nextTick ，会导致 wx 动画执行异常
this.$nextTick(() => {
// TODO 定时器保证动画完全执行，目前有些问题，后面会取消定时器
this.timer = setTimeout(() => {
this.animation = createAnimation(this.config, this)
this.tranfromInit(false).step()
this.animation.run()
this.$emit('change', {
detail: this.isShow
})
}, 20)
})
},
// 关闭过度动画
close(type) {
if (!this.animation) return
this.tranfromInit(true)
.step()
.run(() => {
this.isShow = false
this.animationData = null
this.animation = null
let { opacity, transform } = this.styleInit(false)
this.opacity = opacity || 1
this.transform = transform
this.$emit('change', {
detail: this.isShow
})
})
},
// 处理动画开始前的默认样式
styleInit(type) {
let styles = {
transform: ''
}
let buildStyle = (type, mode) => {
if (mode === 'fade') {
styles.opacity = this.animationType(type)[mode]
} else {
styles.transform += this.animationType(type)[mode] + ' '
}
}
if (typeof this.modeClass === 'string') {
buildStyle(type, this.modeClass)
} else {
this.modeClass.forEach(mode => {
buildStyle(type, mode)
})
}
return styles
},
// 处理内置组合动画
tranfromInit(type) {
let buildTranfrom = (type, mode) => {
let aniNum = null
if (mode === 'fade') {
aniNum = type ? 0 : 1
} else {
aniNum = type ? '-100%' : '0'
if (mode === 'zoom-in') {
aniNum = type ? 0.8 : 1
}
if (mode === 'zoom-out') {
aniNum = type ? 1.2 : 1
}
if (mode === 'slide-right') {
aniNum = type ? '100%' : '0'
}
if (mode === 'slide-bottom') {
aniNum = type ? '100%' : '0'
}
}
this.animation[this.animationMode()[mode]](aniNum)
}
if (typeof this.modeClass === 'string') {
buildTranfrom(type, this.modeClass)
} else {
this.modeClass.forEach(mode => {
buildTranfrom(type, mode)
})
}
return this.animation
},
animationType(type) {
return {
fade: type ? 0 : 1,
'slide-top': `translateY(${type ? '0' : '-100%'})`,
'slide-right': `translateX(${type ? '0' : '100%'})`,
'slide-bottom': `translateY(${type ? '0' : '100%'})`,
'slide-left': `translateX(${type ? '0' : '-100%'})`,
'zoom-in': `scaleX(${type ? 1 : 0.8}) scaleY(${type ? 1 : 0.8})`,
'zoom-out': `scaleX(${type ? 1 : 1.2}) scaleY(${type ? 1 : 1.2})`
}
},
// 内置动画类型与实际动画对应字典
animationMode() {
return {
fade: 'opacity',
'slide-top': 'translateY',
'slide-right': 'translateX',
'slide-bottom': 'translateY',
'slide-left': 'translateX',
'zoom-in': 'scale',
'zoom-out': 'scale'
}
},
// 驼峰转中横线
toLine(name) {
return name.replace(/([A-Z])/g, '-$1').toLowerCase()
}
}
}
</script>
<style></style>

85
uni_modules/uni-transition/package.json Normal file
View File

@ -0,0 +1,85 @@
{
"id": "uni-transition",
"displayName": "uni-transition 过渡动画",
"version": "1.3.3",
"description": "元素的简单过渡动画",
"keywords": [
"uni-ui",
"uniui",
"动画",
"过渡",
"过渡动画"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
"type": "component-vue"
},
"uni_modules": {
"dependencies": ["uni-scss"],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y",
"alipay": "n"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

11
uni_modules/uni-transition/readme.md Normal file
View File

@ -0,0 +1,11 @@
## Transition 过渡动画
> **组件名：uni-transition**
> 代码块： `uTransition`
元素过渡动画
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-transition)
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839