root/zyejMAll-mobile
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

提交优化

Browse Source
This commit is contained in:
77 2024-10-21 17:47:58 +08:00
parent e00cb9b522
commit 7c755a2171
30 changed files with 2860 additions and 1364 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
pages.json
View File

@ -378,6 +378,18 @@
"group": "用户中心" "group": "用户中心"
} }
}, },
{
"path": "user_vip/list",
"style": {
"navigationBarTitleText": "会员页面"
},
"meta": {
"auth": true,
"sync": true,
"title": "会员页面",
"group": "用户中心"
}
},
{ {
"path": "goods-collect", "path": "goods-collect",
"style": { "style": {
@ -767,6 +779,28 @@
"title": "兑换记录", "title": "兑换记录",
"group": "营销活动" "group": "营销活动"
} }
},
{
"path": "point/exchange_success",
"style": {
"navigationBarTitleText": "兑换成功"
},
"meta": {
"sync": true,
"title": "兑换成功",
"group": "营销活动"
}
},
{
"path": "point/exchange_detail",
"style": {
"navigationBarTitleText": "兑换详情"
},
"meta": {
"sync": true,
"title": "兑换详情",
"group": "营销活动"
}
} }
] ]
} }

250
pages/activity/point/exchange_detail.vue Normal file
View File

@ -0,0 +1,250 @@
<!-- 积分商城：商品列表 -->
<template>
<s-layout title="兑换详情" navbar="normal" :leftWidth="0" :rightWidth="0">
<view class="main">
<view class="t-address">
<view class="t">
<text class="l">TEST TQQQ</text>
<text class="r">13615935246</text>
</view>
<view class="b">
北京市 北京市 北京市 北京市
</view>
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/0f01dda22fb349c40c4659d73cb346a1423fee44c9d53eb07bdae1a1e11b5299.png"
class="img"></image>
</view>
<view class="c-goods">
<view class="t">
共1件商品
</view>
<view class="b-detail">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/21cf998c40ecd9d506f884bbd7540afc2e7928ab0e4ab54afede1fcc48a10972.png"
class="img" mode=""></image>
<view class="right">
<view class="t">
Xiaomi Citi 2 冰冰蓝 8GB + 128GB <text class="r">x1</text>
</view>
<view class="c">
冰冰蓝，8+128
</view>
<view class="b">
10积分
</view>
</view>
</view>
</view>
<view class="b-goodsDetail">
<view class="ddxx">
<view class="l">
订单编号:
</view>
<view class="r">
wx23556151561321321351213
<view class="copy-btn">
复制
</view>
</view>
</view>
<view class="ddxx">
<view class="l">
订单状态:
</view>
<view class="r">
未发货
</view>
</view>
<view class="ddxx">
<view class="l">
下单时间:
</view>
<view class="r">
2024-10-18 15:46:03
</view>
</view>
<view class="ddxx">
<view class="l">
支付积分
</view>
<view class="r">
10
</view>
</view>
</view>
</view>
</s-layout>
</template>
<script setup>
import sheep from '@/sheep';
import {
onLoad,
onReachBottom
} from '@dcloudio/uni-app';
import {
reactive,
ref
} from 'vue';
import PointApi from '@/sheep/api/promotion/point';
import SLayout from '@/sheep/components/s-layout/s-layout.vue';
// 计算页面高度
const {
safeAreaInsets,
safeArea
} = sheep.$platform.device;
const statusBarHeight = sheep.$platform.device.statusBarHeight * 2;
const pageHeight =
(safeArea.height + safeAreaInsets.bottom) * 2 + statusBarHeight - sheep.$platform.navbar - 350;
const sPointCardRef = ref();
// 查询活动列表
const activityPageParams = reactive({
pageNo: 1, // 页码
pageSize: 5, // 每页数量
});
const activityTotal = ref(0); // 活动总数
const activityCount = ref(0); // 已加载活动数量
const loadStatus = ref(''); // 页面加载状态
async function getActivityList() {
loadStatus.value = 'loading';
const {
data
} = await PointApi.getPointActivityPage(activityPageParams);
await sPointCardRef.value.concatActivity(data.list);
activityCount.value = sPointCardRef.value.getActivityCount();
activityTotal.value = data.total;
loadStatus.value = activityCount.value < activityTotal.value ? 'more' : 'noMore';
}
// 加载更多
function loadMore() {
if (state.loadStatus !== 'noMore') {
activityPageParams.pageNo += 1;
getActivityList();
}
}
// 上拉加载更多
onReachBottom(() => {
loadMore();
});
onLoad(() => {
getActivityList();
});
</script>
<style lang="scss" scope>
.main {
.t-address {
margin: 9px 0;
padding: 15px 10px;
background: white;
padding-bottom: 0;
.t {
font-size: 19px;
color: black;
display: flex;
font-weight: 700;
margin-bottom: 5px;
.l {
margin-right: 10px;
}
}
.b {
font-size: 17px;
color: rgba(156, 143, 114);
}
.img {
width: 100%;
height: 2px;
}
}
.c-goods {
margin: 9px 0;
padding: 15px 10px;
background: white;
&>.t {
font-size: 19px;
border-bottom: 1px solid rgba(240, 240, 240);
padding-bottom: 15px;
}
.b-detail {
display: flex;
margin-top: 15px;
.img {
width: 78px;
height: 78px;
margin-right: 14px;
}
.right {
flex: 1;
.t {
font-size: 14px;
font-weight: 500;
display: flex;
justify-content: space-between;
.r{
color:rgba(134,139,151);
}
}
.c {
margin: 10px 0;
color:rgba(134,139,151);
}
.b {
color:rgba(254,94,51);
}
}
}
}
.b-goodsDetail {
margin: 9px 0;
padding: 15px 10px;
background: white;
}
.ddxx {
display: flex;
justify-content: space-between;
margin: 10px 0;
.l {
font-size: 17px;
.r{
}
}
.r {
font-size: 16px;
color: rgba(102, 102, 102);
display:flex;
align-items: center;
.copy-btn{
margin-left:10px;
padding:3px 5px;
border:1px solid black;
}
}
}
}
</style>

218
pages/activity/point/exchange_list.vue Normal file
View File

@ -0,0 +1,218 @@
<template>
<s-layout title="兑换记录" color="white" :bgStyle="{ color: '#fff' }" opacityBgUi=""
navbarbackgroundColor="rgba(193,145,81)">
<view class="container">
<view class="card" v-for="(item, index) in reservationList" :key="index">
<view class="top">
订单时间:
{{
sheep.$helper.timeFormat(item.createTime, 'yyyy-mm-dd')
}}
</view>
<view class="left">
<image :src="item.picUrl" class="img"></image>
</view>
<view class="right">
<view class='t ss-line-2'>{{item.name}}</view>
<!-- <view class='c'>共<text class="c-t">{{item.count}}</text>件商品</view>
<view class='b'>来自:</view> -->
<view class="card-bottom">
<view class="card-left">
<!-- <image
src="https://zysc.fjptzykj.com:3000/shangcheng/d1dd98b6a37ea9ea90c49898024d3669a54ee2a48f028b671609937b6b1250af.png"
class="img" mode=""></image> -->
<!-- <text class="card-c">×</text> -->
<view class="card-r">-{{item.usePoint}} 积分</view>
</view>
<view class="r-cart" @click="sheep.$router.go('/pages/activity/point/exchange_detail', { id: '1' })">查看详情</view>
</view>
</view>
<view class="r-cart r-top" :class="item.status == 40 ? 'hui' : ''">{{item.label}}</view>
</view>
</view>
</s-layout>
</template>
<script>
import {
computed
} from 'vue';
import sheep from '@/sheep';
import request from '@/sheep/request';
import {
baseUrl,
apiPath
} from '@/sheep/config';
export default {
data() {
return {
memberId: null,
reservationList: [],
page: 1,
limit: 10,
totalPages: 1,
sheep
};
},
created() {
this.memberId = computed(() => sheep.$store('user').userInfo).value.id
this.getList();
},
methods: {
getList() {
request({
// url: `${baseUrl}${apiPath}/h5/reservation/list`,
url: `${baseUrl}${apiPath}/trade/order/getPointOrder`,
method: 'GET',
// params: {
// userId: this.memberId,
// },
custom: {
showLoading: false,
},
}).then((res) => {
this.reservationList = res.data
console.log('this.reservationList', this.reservationList)
});
// uni.request({
// url: `${baseUrl}${apiPath}/h5/reservation/list`, // 接口地址
// data: {
// userId:this.memberId,
// },
// success: (res) => {
// console.log(res.data);
// this.reservationList = res.data.rows
// },
// fail: (error) => {
// console.log(error)
// }
// })
},
}
};
</script>
<style scoped lang="scss">
.container {
width: 100%;
.card {
width: 86%;
padding: 7px 15px;
background: white;
margin: 10px auto;
border-radius: 13px;
display: flex;
flex-wrap: wrap;
position: relative;
box-shadow: 3px -2px 12px 7px rgba(0, 0, 0, 0.05);
.top {
width: 100%;
padding-bottom: 6px;
color: rgba(127, 128, 128);
font-size: 11px;
}
.r-cart {
// position:absolute;
// top:0;
// right:0;
padding: 2px 11px;
border-radius: 12px;
height: 20px;
line-height:20px;
background: rgba(193, 145, 81);
color: white;
font-size: 11px;
text-align: center;
&.hui {
background: rgba(223, 241, 244);
color: rgba(75, 79, 82);
}
}
.r-top{
position:absolute;
top:0;
right:0;
background:rgba(242, 232, 218);
border-radius: 0px 12px 0px 12px;
color:rgba(163,109,45);
}
.left {
width: 70px;
height: 70px;
margin-right: 10px;
border-radius: 12px;
.img {
width: 100%;
height: 100%;
border-radius: 12px;
}
}
.right {
flex: 1;
position: relative;
.t {
font-size: 15px;
font-weight: 700;
}
.card-bottom {
position: absolute;
bottom: 0;
}
.c {
font-size: 14px;
margin: 5px 0;
.c-t {
color: #cccc08;
}
}
.b {
font-size: 14px;
color: #dbcccc;
}
}
}
.card-bottom {
width: 100%;
display: flex;
justify-content: space-between;
.card-left {
width: 48%;
display: flex;
align-items: center;
.img {
width: 20px;
height: 20px;
}
.card-r {
color: rgba(162, 75, 72);
font-size: 16px;
font-weight: 700;
}
}
.card-right {
flex: 1;
text-align: right;
}
}
}
</style>

164
pages/activity/point/exchange_success.vue Normal file
View File

@ -0,0 +1,164 @@
<!-- 积分商城：商品列表 -->
<template>
<s-layout title="兑换成功" navbar="normal" :leftWidth="0" :rightWidth="0">
<view class="main">
<image src="https://zysc.fjptzykj.com:3000/shangcheng/4fd1540f5e7c4545140fe1278fd6db65f18a3cd86bc866b24470b888bf6664fe.png" class="img" mode=""></image>
<view class="title">商品兑换成功</view>
<view class="fgx"></view>
<view class="ddxx">
<view class="l">
订单编号
</view>
<view class="r">
wx23556151561321321351213
</view>
</view>
<view class="ddxx">
<view class="l">
兑换时间
</view>
<view class="r">
2024-10-18 15:46:03
</view>
</view>
<view class="ddxx">
<view class="l">
兑换方式
</view>
<view class="r">
积分兑换
</view>
</view>
<view class="ddxx">
<view class="l">
支付方式
</view>
<view class="r">
10
</view>
</view>
<view class="fgx"></view>
<view class="ck-detail">
查看详情
</view>
<view class="bk-home">
返回首页
</view>
</view>
</s-layout>
</template>
<script setup>
import sheep from '@/sheep';
import { onLoad, onReachBottom } from '@dcloudio/uni-app';
import { reactive, ref } from 'vue';
import PointApi from '@/sheep/api/promotion/point';
import SLayout from '@/sheep/components/s-layout/s-layout.vue';
// 计算页面高度
const { safeAreaInsets, safeArea } = sheep.$platform.device;
const statusBarHeight = sheep.$platform.device.statusBarHeight * 2;
const pageHeight =
(safeArea.height + safeAreaInsets.bottom) * 2 + statusBarHeight - sheep.$platform.navbar - 350;
const sPointCardRef = ref();
// 查询活动列表
const activityPageParams = reactive({
pageNo: 1, // 页码
pageSize: 5, // 每页数量
});
const activityTotal = ref(0); // 活动总数
const activityCount = ref(0); // 已加载活动数量
const loadStatus = ref(''); // 页面加载状态
async function getActivityList() {
loadStatus.value = 'loading';
const { data } = await PointApi.getPointActivityPage(activityPageParams);
await sPointCardRef.value.concatActivity(data.list);
activityCount.value = sPointCardRef.value.getActivityCount();
activityTotal.value = data.total;
loadStatus.value = activityCount.value < activityTotal.value ? 'more' : 'noMore';
}
// 加载更多
function loadMore() {
if (state.loadStatus !== 'noMore') {
activityPageParams.pageNo += 1;
getActivityList();
}
}
// 上拉加载更多
onReachBottom(() => {
loadMore();
});
onLoad(() => {
getActivityList();
});
</script>
<style lang="scss" scope>
.main{
background:white;
width:85%;
padding:15px;
position:fixed;
top:50%;
left:50%;
transform:translate(-50%, -50%);
border-radius:12px;
.img{
width:80px;
height:80px;
display:block;
margin:0 auto;
margin-top: -52px;
}
.title{
text-align: center;
font-size:18px;
margin:15px 0;
font-weight: 700;
}
.ddxx{
display: flex;
justify-content: space-between;
margin:10px 0;
.l{
font-size: 17px;
}
.r{
font-size: 16px;
color:rbga(102,102,102);
}
}
.fgx{
margin: 20px 0;
height: 1px;
width: 100%;
background:rgba(239,239,239);
}
.ck-detail{
// background: rgba(254,92,45);
background: rgba(207,162,92);
padding: 10px 0;
color: white;
font-size: 19px;
text-align: center;
width: 100%;
margin-bottom: 15px;
border-radius:31px;
}
.bk-home{
border:1px solid rgba(207,162,92);
padding: 10px 0;
color: rgba(207,162,92);
font-size: 19px;
text-align: center;
width: 100%;
border-radius:31px;
}
}
</style>

3
pages/app/sign.vue
View File

@ -456,7 +456,8 @@
.confirm-btn { .confirm-btn {
width: 220rpx; width: 220rpx;
height: 70rpx; height: 70rpx;
background: linear-gradient(90deg, #ff6000, #fe832a); // background: linear-gradient(90deg, #ff6000, #fe832a);
background: linear-gradient(90deg, #ff6000, #ff6000);
box-shadow: 0 0.2em 0.5em rgba(#ff6000, 0.4); box-shadow: 0 0.2em 0.5em rgba(#ff6000, 0.4);
border-radius: 35rpx; border-radius: 35rpx;
font-size: 28rpx; font-size: 28rpx;

185
pages/app/signList.vue Normal file
View File

@ -0,0 +1,185 @@
<template>
<s-layout title="预约记录" :bgStyle="{ color: '#fff' }">
<view class="container">
<view class="cards">
<view class="card" v-for="(item, index) in reservationList" :key="index">
sss
</view>
</view>
</view>
</s-layout>
</template>
<script>
import request from '@/sheep/request';
import { computed } from 'vue';
import sheep from '@/sheep';
import {
baseUrl,
apiPath
} from '@/sheep/config';
export default {
data() {
return {
memberId:null,
reservationList: [],
page: 1,
limit: 10,
totalPages: 1,
};
},
created() {
this.memberId=computed(() => sheep.$store('user').userInfo).value.id
this.getList();
},
methods: {
getList() {
request({
url: `${baseUrl}${apiPath}/h5/reservation/list`,
method: 'GET',
params:{
userId:this.memberId,
},
custom: {
showLoading: false,
},
}).then((res) => {
this.reservationList = res.data.list
});
// uni.request({
// url: `${baseUrl}${apiPath}/h5/reservation/list`, // 接口地址
// data: {
// userId:this.memberId,
// },
// success: (res) => {
// console.log(res.data);
// this.reservationList = res.data.rows
// },
// fail: (error) => {
// console.log(error)
// }
// })
},
}
};
</script>
<style scoped>
.address-container {
display: flex;
align-items: center;
}
.container {
display: flex;
flex-direction: column;
/* align-items: center; */
background-color: #f5f5f5;
padding: 10px;
}
.header {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
}
.title {
font-size: 24px;
font-weight: bold;
color: #333;
}
.cards {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-around;
margin-top: 0px;
}
.card {
/* width: calc(50% - 10px); */
width: 100%;
background-color: #fff;
border-radius: 10px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
margin-bottom: 20px;
padding: 10px;
}
.card-content {
display: flex;
justify-content: space-between;
}
.card-contentinfo {
margin-top: 20px;
text-align: center;
/* display: flex;
justify-content: space-between; */
}
.card-image {
width: 50px;
height: 50px;
border-radius: 25px;
}
.technician {
margin-left: 20%;
}
.hospital,
.technician,
.type{
margin-left: 20px;
font-size: 15px;
color: #161616;
font-weight: bold;
}
.status {
font-size: 15px;
color: #666;
}
.address{
margin: 20px 0px 0px 20px ;
font-size: 15px;
color: #666;
}
.health-list {
background-color: #FFFFFF;
height: 100%;
width: 98%;
margin: 5PX;
padding-left: 15px;
padding-top: 10px;
/* padding: 10px; */
border-radius: 12px;
}
.health_title {
padding: 5px;
}
.health_title_img {
float: left;
width: 40px;
height: 40px;
}
.health-title-title {
float: none;
font-size: 18px;
font-weight: bold;
margin-top: 10px;
margin-left: 10px;
}
.time {
/* margin-top: 20px; */
font-size: 15px;
color: #5e5e5e;
}
</style>

4
pages/commission/components/account-info.vue
View File

@ -117,7 +117,7 @@
border-radius: 12rpx 12rpx 0 0; border-radius: 12rpx 12rpx 0 0;
z-index: 3; z-index: 3;
position: relative; position: relative;
background: url('https://zysc.fjptzykj.com:3000/shangcheng/02ee19a89858e3b1cf0de82867fb06f3ae7f57511130d0167205a97b99b796c7.png') no-repeat; background: url('https://zysc.fjptzykj.com:3000/shangcheng/423af1ff70d4e80ca7bd4ede17b9fe63800aaffd2e4e8b5b7584ab5bf5884996.png') no-repeat;
background-size: cover; background-size: cover;
@ -129,7 +129,7 @@
padding: 0 45rpx; padding: 0 45rpx;
.new-btn { .new-btn {
background: rgba(254, 104, 73); background: rgba(178, 102, 67);
border-radius: 22px; border-radius: 22px;
padding: 8px 0; padding: 8px 0;
font-size: 16px; font-size: 16px;

11
pages/commission/components/commission-info.vue
View File

@ -18,7 +18,7 @@
<view class="new-ljsy"> <view class="new-ljsy">
<view class="l dd"> <view class="l dd">
<view class="l-img"> <view class="l-img">
<image src="https://zysc.fjptzykj.com:3000/shangcheng/a2aba0242cd2b7ec54518e2ec11651fba3154b5dff9bcd6323cbfa22d771a970.png" class="img"></image> <image src="https://zysc.fjptzykj.com:3000/shangcheng/7624fd0e447748a5f8f4532d89a416cf7f962644e588c99d7e8c8baeab7ee91f.png" class="img"></image>
</view> </view>
<view class="l-text"> <view class="l-text">
<view class="l-text-t"> <view class="l-text-t">
@ -33,7 +33,7 @@
</view> </view>
<view class="l r" @click="sheep.$router.go('/pages/commission/team')"> <view class="l r" @click="sheep.$router.go('/pages/commission/team')">
<view class="l-img"> <view class="l-img">
<image src="https://zysc.fjptzykj.com:3000/shangcheng/e940fb45cc53df01980b7069432d5101e104014fbb3cd24862d08c1ffba9df68.png" class="img"></image> <image src="https://zysc.fjptzykj.com:3000/shangcheng/6575e409f7656efb2821b2159ca0a26916f83f037fc533f9f19aa141c412ee2c.png" class="img"></image>
</view> </view>
<view class="l-text"> <view class="l-text">
<view class="l-text-t"> <view class="l-text-t">
@ -95,7 +95,7 @@
display: flex; display: flex;
justify-content: center; justify-content: center;
.l { .l {
background: rgba(254,244,237,1); background: rgba(254,244,237);
// background:url('https://zysc.fjptzykj.com/admin-api/infra/file/25/get/8e878e15d22f68e0187a953aeba31b80423b7e3fafa8e4aa9f237477ac0fd519.png') rgba(254,244,237,1); // background:url('https://zysc.fjptzykj.com/admin-api/infra/file/25/get/8e878e15d22f68e0187a953aeba31b80423b7e3fafa8e4aa9f237477ac0fd519.png') rgba(254,244,237,1);
width:43%; width:43%;
height:85px; height:85px;
@ -145,8 +145,9 @@
width: 100%; width: 100%;
height: 580rpx; height: 580rpx;
// margin: -88rpx 20rpx 0 20rpx; // margin: -88rpx 20rpx 0 20rpx;
// background: url('https://zysc.fjptzykj.com:3000/shangcheng/10c7d7a9afb36266f658e5f398922b835530cb350ef98cf90d4ef6f60ccc1bc1.png') no-repeat; background: url('https://zysc.fjptzykj.com:3000/shangcheng/c4f941683d41701ac7f182824791ff43b5f7e70fb527b4d4d153416d6065c44f.png') no-repeat;
background: url('https://zysc.fjptzykj.com:3000/shangcheng/4bcaa2803c9cc953353d22db804b952b333e97d2a0d57266a00baf0c07379efa.png') no-repeat; // background: url('https://zysc.fjptzykj.com:3000/shangcheng/4bcaa2803c9cc953353d22db804b952b333e97d2a0d57266a00baf0c07379efa.png') no-repeat;
// background:#ff3000;
background-size: 100% 100%; background-size: 100% 100%;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;

3
pages/commission/promoter.vue
View File

@ -168,7 +168,6 @@
<style lang="scss" scoped> <style lang="scss" scoped>
.PromoterRank .redBg { .PromoterRank .redBg {
padding: 45rpx 0 30rpx 0;
} }
.PromoterRank .header { .PromoterRank .header {
@ -177,6 +176,7 @@
width: 100%; width: 100%;
height: 460rpx; height: 460rpx;
background-size: 100% 100%; background-size: 100% 100%;
padding-top:27px;
} }
.PromoterRank .header .nav { .PromoterRank .header .nav {
@ -187,6 +187,7 @@
font-size: 30rpx; font-size: 30rpx;
color: #fff; color: #fff;
margin: 0 auto; margin: 0 auto;
} }
.PromoterRank .header .nav .item { .PromoterRank .header .nav .item {

890
pages/commission/team.vue
View File

@ -1,165 +1,127 @@
<!-- 页面 TODO 芋艿：该页面的实现代码需要优化，包括 js 和 css，以及相关的样式设计 --> <!-- 页面 TODO 芋艿：该页面的实现代码需要优化，包括 js 和 css，以及相关的样式设计 -->
<template> <template>
<s-layout title="我的团队" :class="state.scrollTop ? 'team-wrap' : ''" navbar="inner"> <s-layout title="我的团队" :class="state.scrollTop ? 'team-wrap' : ''" navbar="inner" navbarbackgroundColor="rgba(255,48,0)">
<view class="promoter-list"> <view class="promoter-list">
<view <view class="promoterHeader bg-color"
class="promoterHeader bg-color" style="backgroundcolor: #e93323 !important; height: 218rpx; color: #fff">
style="backgroundcolor: #e93323 !important; height: 218rpx; color: #fff" <view class="headerCon acea-row row-between" style="padding: 28px 29px 0 29px">
> <view>
<view class="headerCon acea-row row-between" style="padding: 28px 29px 0 29px"> <view class="name" style="color: #fff">推广人数</view>
<view> <view>
<view class="name" style="color: #fff">推广人数</view> <text class="num" style="color: #fff">
<view> {{
<text class="num" style="color: #fff">
{{
state.summary.firstBrokerageUserCount + state.summary.secondBrokerageUserCount || state.summary.firstBrokerageUserCount + state.summary.secondBrokerageUserCount ||
0 0
}} }}
</text> </text>
人 人
</view> </view>
</view> </view>
<view class="iconfont icon-tuandui" /> <view class="iconfont icon-tuandui" />
</view> </view>
</view> </view>
<view style="padding: 0 30rpx"> <view style="background:#f6f6f6;">
<view class="nav acea-row row-around l1"> <view class="nav acea-row row-around l1">
<view :class="state.level == 1 ? 'item on' : 'item'" @click="setType(1)"> <view :class="state.level == 1 ? 'item on' : 'item'" @click="setType(1)">
一级({{ state.summary.firstBrokerageUserCount || 0 }}) 一级({{ state.summary.firstBrokerageUserCount || 0 }})
</view> </view>
<view :class="state.level == 2 ? 'item on' : 'item'" @click="setType(2)"> <view :class="state.level == 2 ? 'item on' : 'item'" @click="setType(2)">
二级({{ state.summary.secondBrokerageUserCount || 0 }}) 二级({{ state.summary.secondBrokerageUserCount || 0 }})
</view> </view>
</view> </view>
<view <view class="search acea-row row-between-wrapper"
class="search acea-row row-between-wrapper" style="display: flex; height: 100rpx; align-items: center">
style="display: flex; height: 100rpx; align-items: center" <view class="input">
> <input placeholder="点击搜索会员名称" v-model="state.nickname" confirm-type="search" name="search"
<view class="input"> @confirm="submitForm" />
<input </view>
placeholder="点击搜索会员名称" <image src="/static/images/search.png" mode="" style="width: 60rpx; height: 64rpx"
v-model="state.nickname" @click="submitForm" />
confirm-type="search" </view>
name="search" <view class="list">
@confirm="submitForm" <view class="sortNav acea-row row-middle" style="display: flex; align-items: center">
/> <view class="sortItem" @click="setSort('userCount', 'asc')" v-if="sort === 'userCountDESC'">
</view> 团队排序
<image <!-- TODO 芋艿：看看怎么从项目里拿出去 -->
src="/static/images/search.png" <image src="/static/images/sort1.png" />
mode="" </view>
style="width: 60rpx; height: 64rpx" <view class="sortItem" @click="setSort('userCount', 'desc')"
@click="submitForm" v-else-if="sort === 'userCountASC'">
/> 团队排序
</view> <image src="/static/images/sort3.png" />
<view class="list"> </view>
<view class="sortNav acea-row row-middle" style="display: flex; align-items: center"> <view class="sortItem" @click="setSort('userCount', 'desc')" v-else>
<view 团队排序
class="sortItem" <image src="/static/images/sort2.png" />
@click="setSort('userCount', 'asc')" </view>
v-if="sort === 'userCountDESC'" <view class="sortItem" @click="setSort('price', 'asc')" v-if="sort === 'priceDESC'">
> 金额排序
团队排序 <image src="/static/images/sort1.png" />
<!-- TODO 芋艿：看看怎么从项目里拿出去 --> </view>
<image src="/static/images/sort1.png" /> <view class="sortItem" @click="setSort('price', 'desc')" v-else-if="sort === 'priceASC'">
</view> 金额排序
<view <image src="/static/images/sort3.png" />
class="sortItem" </view>
@click="setSort('userCount', 'desc')" <view class="sortItem" @click="setSort('price', 'desc')" v-else>
v-else-if="sort === 'userCountASC'" 金额排序
> <image src="/static/images/sort2.png" />
团队排序 </view>
<image src="/static/images/sort3.png" /> <view class="sortItem" @click="setSort('orderCount', 'asc')" v-if="sort === 'orderCountDESC'">
</view> 订单排序
<view class="sortItem" @click="setSort('userCount', 'desc')" v-else> <image src="/static/images/sort1.png" />
团队排序 </view>
<image src="/static/images/sort2.png" /> <view class="sortItem" @click="setSort('orderCount', 'desc')"
</view> v-else-if="sort === 'orderCountASC'">
<view class="sortItem" @click="setSort('price', 'asc')" v-if="sort === 'priceDESC'"> 订单排序
金额排序 <image src="/static/images/sort3.png" />
<image src="/static/images/sort1.png" /> </view>
</view> <view class="sortItem" @click="setSort('orderCount', 'desc')" v-else>
<view 订单排序
class="sortItem" <image src="/static/images/sort2.png" />
@click="setSort('price', 'desc')" </view>
v-else-if="sort === 'priceASC'" </view>
> <block v-for="(item, index) in state.pagination.list" :key="index">
金额排序 <view class="item acea-row row-between-wrapper" style="display: flex">
<image src="/static/images/sort3.png" /> <view class="picTxt acea-row row-between-wrapper"
</view> style="display: flex; align-items: center">
<view class="sortItem" @click="setSort('price', 'desc')" v-else> <view class="pictrue">
金额排序 <image :src="item.avatar" />
<image src="/static/images/sort2.png" /> </view>
</view> <view class="text">
<view <view class="name line1">{{ item.nickname }}</view>
class="sortItem" <view>
@click="setSort('orderCount', 'asc')" 加入时间:
v-if="sort === 'orderCountDESC'" {{ sheep.$helper.timeFormat(item.brokerageTime, 'yyyy-mm-dd hh:MM:ss') }}
> </view>
订单排序 </view>
<image src="/static/images/sort1.png" /> </view>
</view> <view class="right" style="
<view
class="sortItem"
@click="setSort('orderCount', 'desc')"
v-else-if="sort === 'orderCountASC'"
>
订单排序
<image src="/static/images/sort3.png" />
</view>
<view class="sortItem" @click="setSort('orderCount', 'desc')" v-else>
订单排序
<image src="/static/images/sort2.png" />
</view>
</view>
<block v-for="(item, index) in state.pagination.list" :key="index">
<view class="item acea-row row-between-wrapper" style="display: flex">
<view
class="picTxt acea-row row-between-wrapper"
style="display: flex; align-items: center"
>
<view class="pictrue">
<image :src="item.avatar" />
</view>
<view class="text">
<view class="name line1">{{ item.nickname }}</view>
<view>
加入时间:
{{ sheep.$helper.timeFormat(item.brokerageTime, 'yyyy-mm-dd hh:MM:ss') }}
</view>
</view>
</view>
<view
class="right"
style="
justify-content: center; justify-content: center;
flex-direction: column; flex-direction: column;
display: flex; display: flex;
margin-left: auto; margin-left: auto;
" ">
> <view>
<view> <text class="num font-color">{{ item.brokerageUserCount || 0 }} </text>人
<text class="num font-color">{{ item.brokerageUserCount || 0 }} </text>人 </view>
</view> <view>
<view> <text class="num">{{ item.orderCount || 0 }}</text>单
<text class="num">{{ item.orderCount || 0 }}</text </view>
>单</view <view>
> <text class="num">{{ item.brokeragePrice || 0 }}</text>元
<view> </view>
<text class="num">{{ item.brokeragePrice || 0 }}</text </view>
>元 </view>
</view> </block>
</view> <block v-if="state.pagination.list.length === 0">
</view> <view style="text-align: center;margin-top:20px;">暂无推广人数</view>
</block> </block>
<block v-if="state.pagination.list.length === 0"> </view>
<view style="text-align: center">暂无推广人数</view> </view>
</block> </view>
</view> <!-- <home></home> -->
</view>
</view>
<!-- <home></home> -->
<!-- <view class="header-box" :style="[ <!-- <view class="header-box" :style="[
{ {
marginTop: '-' + Number(statusBarHeight + 88) + 'rpx', marginTop: '-' + Number(statusBarHeight + 88) + 'rpx',
paddingTop: Number(statusBarHeight + 108) + 'rpx', paddingTop: Number(statusBarHeight + 108) + 'rpx',
@ -228,354 +190,372 @@
</view> </view>
<s-empty v-if="state.pagination.total === 0" icon="/static/data-empty.png" text="暂无团队信息"> <s-empty v-if="state.pagination.total === 0" icon="/static/data-empty.png" text="暂无团队信息">
</s-empty> --> </s-empty> -->
</s-layout> </s-layout>
</template> </template>
<script setup> <script setup>
import sheep from '@/sheep'; import sheep from '@/sheep';
import { onLoad, onReachBottom } from '@dcloudio/uni-app'; import {
import { computed, reactive, ref } from 'vue'; onLoad,
import _ from 'lodash'; onReachBottom
import { onPageScroll } from '@dcloudio/uni-app'; } from '@dcloudio/uni-app';
import BrokerageApi from '@/sheep/api/trade/brokerage'; import {
computed,
reactive,
ref
} from 'vue';
import _ from 'lodash';
import {
onPageScroll
} from '@dcloudio/uni-app';
import BrokerageApi from '@/sheep/api/trade/brokerage';
const statusBarHeight = sheep.$platform.device.statusBarHeight * 2; const statusBarHeight = sheep.$platform.device.statusBarHeight * 2;
// const agentInfo = computed(() => sheep.$store('user').agentInfo); // const agentInfo = computed(() => sheep.$store('user').agentInfo);
const userInfo = computed(() => sheep.$store('user').userInfo); const userInfo = computed(() => sheep.$store('user').userInfo);
const headerBg = sheep.$url.css('/static/img/shop/user/withdraw_bg.png'); const headerBg = sheep.$url.css('/static/img/shop/user/withdraw_bg.png');
onPageScroll((e) => { onPageScroll((e) => {
state.scrollTop = e.scrollTop <= 100; state.scrollTop = e.scrollTop <= 100;
}); });
let sort = ref(); let sort = ref();
const state = reactive({ const state = reactive({
summary: {}, summary: {},
pagination: { pagination: {
pageNo: 1, pageNo: 1,
pageSize: 8, pageSize: 8,
list: [], list: [],
total: 0, total: 0,
}, },
loadStatus: '', loadStatus: '',
// ↓ 新 ui 逻辑 // ↓ 新 ui 逻辑
level: 1, level: 1,
nickname: ref(''), nickname: ref(''),
sortKey: '', sortKey: '',
isAsc: '', isAsc: '',
}); });
function filterUserNum(num) { function filterUserNum(num) {
if (_.isNil(num)) { if (_.isNil(num)) {
return ''; return '';
} }
return `下级团队${num}人`; return `下级团队${num}人`;
} }
function submitForm() { function submitForm() {
state.pagination.list = []; state.pagination.list = [];
getTeamList(); getTeamList();
} }
async function getTeamList() { async function getTeamList() {
state.loadStatus = 'loading'; state.loadStatus = 'loading';
let { code, data } = await BrokerageApi.getBrokerageUserChildSummaryPage({ let {
pageNo: state.pagination.pageNo, code,
pageSize: state.pagination.pageSize, data
level: state.level, } = await BrokerageApi.getBrokerageUserChildSummaryPage({
'sortingField.order': state.isAsc, pageNo: state.pagination.pageNo,
'sortingField.field': state.sortKey, pageSize: state.pagination.pageSize,
nickname: state.nickname, level: state.level,
}); 'sortingField.order': state.isAsc,
if (code !== 0) { 'sortingField.field': state.sortKey,
return; nickname: state.nickname,
} });
state.pagination.list = _.concat(state.pagination.list, data.list); if (code !== 0) {
state.pagination.total = data.total; return;
state.loadStatus = state.pagination.list.length < state.pagination.total ? 'more' : 'noMore'; }
} state.pagination.list = _.concat(state.pagination.list, data.list);
state.pagination.total = data.total;
state.loadStatus = state.pagination.list.length < state.pagination.total ? 'more' : 'noMore';
}
function setType(e) { function setType(e) {
state.pagination.list = []; state.pagination.list = [];
state.level = e + ''; state.level = e + '';
getTeamList(); getTeamList();
} }
function setSort(sortKey, isAsc) { function setSort(sortKey, isAsc) {
state.pagination.list = []; state.pagination.list = [];
sort = sortKey + isAsc.toUpperCase(); sort = sortKey + isAsc.toUpperCase();
state.isAsc = isAsc; state.isAsc = isAsc;
state.sortKey = sortKey; state.sortKey = sortKey;
getTeamList(); getTeamList();
} }
onLoad(async () => { onLoad(async () => {
await getTeamList(); await getTeamList();
// 概要数据 // 概要数据
let { data } = await BrokerageApi.getBrokerageUserSummary(); let {
state.summary = data; data
}); } = await BrokerageApi.getBrokerageUserSummary();
state.summary = data;
});
// 加载更多 // 加载更多
function loadMore() { function loadMore() {
if (state.loadStatus === 'noMore') { if (state.loadStatus === 'noMore') {
return; return;
} }
state.pagination.pageNo++; state.pagination.pageNo++;
getTeamList(); getTeamList();
} }
// 上拉加载更多 // 上拉加载更多
onReachBottom(() => { onReachBottom(() => {
loadMore(); loadMore();
}); });
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.l1 { .l1 {
background-color: #fff; background-color: #fff;
height: 86rpx; height: 86rpx;
line-height: 86rpx; line-height: 86rpx;
font-size: 28rpx; font-size: 28rpx;
color: #282828; color: #282828;
border-bottom: 1rpx solid #eee; border-bottom: 1rpx solid #eee;
border-top-left-radius: 14rpx; border-top-left-radius: 14rpx;
border-top-right-radius: 14rpx; border-top-right-radius: 14rpx;
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
} }
.header-box { .header-box {
box-sizing: border-box; box-sizing: border-box;
padding: 0 20rpx 20rpx 20rpx; padding: 0 20rpx 20rpx 20rpx;
width: 750rpx; width: 750rpx;
z-index: 3; z-index: 3;
position: relative; position: relative;
background: url('https://zysc.fjptzykj.com:3000/shangcheng/c9aeef7e970b76991668740263d518f25ce737b1552db9ee7b22d8572a4a5110.png') no-repeat, background: url('https://zysc.fjptzykj.com:3000/shangcheng/c9aeef7e970b76991668740263d518f25ce737b1552db9ee7b22d8572a4a5110.png') no-repeat,
linear-gradient(90deg, var(--ui-BG-Main), var(--ui-BG-Main-gradient)); linear-gradient(90deg, var(--ui-BG-Main), var(--ui-BG-Main-gradient));
background-size: 750rpx 100%; background-size: 750rpx 100%;
// 团队信息总览 // 团队信息总览
.team-data-box { .team-data-box {
.data-card { .data-card {
width: 305rpx; width: 305rpx;
background: #ffffff; background: #ffffff;
border-radius: 20rpx; border-radius: 20rpx;
padding: 20rpx; padding: 20rpx;
.item-title { .item-title {
font-size: 22rpx; font-size: 22rpx;
font-weight: 500; font-weight: 500;
color: #999999; color: #999999;
line-height: 30rpx; line-height: 30rpx;
margin-bottom: 10rpx; margin-bottom: 10rpx;
} }
.total-item { .total-item {
margin-bottom: 30rpx; margin-bottom: 30rpx;
} }
.total-num { .total-num {
font-size: 38rpx; font-size: 38rpx;
font-weight: 500; font-weight: 500;
color: #333333; color: #333333;
font-family: OPPOSANS; font-family: OPPOSANS;
} }
.category-num { .category-num {
font-size: 26rpx; font-size: 26rpx;
font-weight: 500; font-weight: 500;
color: #333333; color: #333333;
font-family: OPPOSANS; font-family: OPPOSANS;
} }
} }
} }
} }
.list-box { .list-box {
z-index: 3; z-index: 3;
position: relative; position: relative;
} }
.chat-custom-right { .chat-custom-right {
.time-text { .time-text {
font-size: 22rpx; font-size: 22rpx;
font-weight: 400; font-weight: 400;
color: #999999; color: #999999;
} }
.tag-box { .tag-box {
background: rgba(0, 0, 0, 0.2); background: rgba(0, 0, 0, 0.2);
border-radius: 21rpx; border-radius: 21rpx;
line-height: 30rpx; line-height: 30rpx;
padding: 5rpx 10rpx; padding: 5rpx 10rpx;
width: 140rpx; width: 140rpx;
.tag-img { .tag-img {
width: 34rpx; width: 34rpx;
height: 34rpx; height: 34rpx;
margin-right: 6rpx; margin-right: 6rpx;
border-radius: 50%; border-radius: 50%;
} }
.tag-title { .tag-title {
font-size: 18rpx; font-size: 18rpx;
font-weight: 500; font-weight: 500;
color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, 1);
line-height: 20rpx; line-height: 20rpx;
} }
} }
} }
// 推荐人 // 推荐人
.referrer-box { .referrer-box {
font-size: 28rpx; font-size: 28rpx;
font-weight: 500; font-weight: 500;
color: #ffffff; color: #ffffff;
padding: 20rpx; padding: 20rpx;
.referrer-avatar { .referrer-avatar {
width: 34rpx; width: 34rpx;
height: 34rpx; height: 34rpx;
border-radius: 50%; border-radius: 50%;
} }
} }
.promoter-list{
background:rgba(255,48,0);
margin-top:-3rem;
padding-top:30px;
}
.promoter-list .nav {
background-color: #fff;
height: 86rpx;
line-height: 86rpx;
font-size: 28rpx;
color: #282828;
border-bottom: 1rpx solid #eee;
border-top-left-radius: 14rpx;
border-top-right-radius: 14rpx;
margin-top: -30rpx;
}
.promoter-list .nav { .promoter-list .nav .item.on {
background-color: #fff; border-bottom: 5rpx solid;
height: 86rpx; // $theme-color
line-height: 86rpx; color: red;
font-size: 28rpx; // $theme-color
color: #282828; }
border-bottom: 1rpx solid #eee;
border-top-left-radius: 14rpx;
border-top-right-radius: 14rpx;
margin-top: -30rpx;
}
.promoter-list .nav .item.on { .promoter-list .search {
border-bottom: 5rpx solid; width: 100%;
// $theme-color background-color: #fff;
color: red; height: 100rpx;
// $theme-color padding: 0 24rpx;
} box-sizing: border-box;
border-bottom-left-radius: 14rpx;
border-bottom-right-radius: 14rpx;
}
.promoter-list .search { .promoter-list .search .input {
width: 100%; width: 592rpx;
background-color: #fff; height: 60rpx;
height: 100rpx; border-radius: 50rpx;
padding: 0 24rpx; background-color: #f5f5f5;
box-sizing: border-box; text-align: center;
border-bottom-left-radius: 14rpx; position: relative;
border-bottom-right-radius: 14rpx; }
}
.promoter-list .search .input { .promoter-list .search .input input {
width: 592rpx; height: 100%;
height: 60rpx; font-size: 26rpx;
border-radius: 50rpx; width: 610rpx;
background-color: #f5f5f5; text-align: center;
text-align: center; }
position: relative;
}
.promoter-list .search .input input { .promoter-list .search .input .placeholder {
height: 100%; color: #bbb;
font-size: 26rpx; }
width: 610rpx;
text-align: center;
}
.promoter-list .search .input .placeholder { .promoter-list .search .input .iconfont {
color: #bbb; position: absolute;
} right: 28rpx;
color: #999;
font-size: 28rpx;
top: 50%;
transform: translateY(-50%);
}
.promoter-list .search .input .iconfont { .promoter-list .search .iconfont {
position: absolute; font-size: 32rpx;
right: 28rpx; color: #515151;
color: #999; height: 60rpx;
font-size: 28rpx; line-height: 60rpx;
top: 50%; }
transform: translateY(-50%);
}
.promoter-list .search .iconfont { .promoter-list .list {
font-size: 32rpx; margin-top: 20rpx;
color: #515151; }
height: 60rpx;
line-height: 60rpx;
}
.promoter-list .list { .promoter-list .list .sortNav {
margin-top: 20rpx; background-color: #fff;
} height: 76rpx;
border-bottom: 1rpx solid #eee;
color: #333;
font-size: 28rpx;
border-top-left-radius: 14rpx;
border-top-right-radius: 14rpx;
}
.promoter-list .list .sortNav { .promoter-list .list .sortNav .sortItem {
background-color: #fff; text-align: center;
height: 76rpx; flex: 1;
border-bottom: 1rpx solid #eee; }
color: #333;
font-size: 28rpx;
border-top-left-radius: 14rpx;
border-top-right-radius: 14rpx;
}
.promoter-list .list .sortNav .sortItem { .promoter-list .list .sortNav .sortItem image {
text-align: center; width: 24rpx;
flex: 1; height: 24rpx;
} margin-left: 6rpx;
vertical-align: -3rpx;
}
.promoter-list .list .sortNav .sortItem image { .promoter-list .list .item {
width: 24rpx; background-color: #fff;
height: 24rpx; border-bottom: 1rpx solid #eee;
margin-left: 6rpx; height: 152rpx;
vertical-align: -3rpx; padding: 0 24rpx;
} font-size: 24rpx;
color: #666;
}
.promoter-list .list .item { .promoter-list .list .item .picTxt .pictrue {
background-color: #fff; width: 106rpx;
border-bottom: 1rpx solid #eee; height: 106rpx;
height: 152rpx; border-radius: 50%;
padding: 0 24rpx; }
font-size: 24rpx;
color: #666;
}
.promoter-list .list .item .picTxt .pictrue { .promoter-list .list .item .picTxt .pictrue image {
width: 106rpx; width: 100%;
height: 106rpx; height: 100%;
border-radius: 50%; border-radius: 50%;
} border: 3rpx solid #fff;
box-shadow: 0 0 10rpx #aaa;
box-sizing: border-box;
}
.promoter-list .list .item .picTxt .pictrue image { .promoter-list .list .item .picTxt .text {
width: 100%; // width: 304rpx;
height: 100%; font-size: 24rpx;
border-radius: 50%; color: #666;
border: 3rpx solid #fff; margin-left: 14rpx;
box-shadow: 0 0 10rpx #aaa; }
box-sizing: border-box;
}
.promoter-list .list .item .picTxt .text { .promoter-list .list .item .picTxt .text .name {
// width: 304rpx; font-size: 28rpx;
font-size: 24rpx; color: #333;
color: #666; margin-bottom: 13rpx;
margin-left: 14rpx; }
}
.promoter-list .list .item .picTxt .text .name { .promoter-list .list .item .right {
font-size: 28rpx; text-align: right;
color: #333; font-size: 22rpx;
margin-bottom: 13rpx; color: #333;
} }
.promoter-list .list .item .right { .promoter-list .list .item .right .num {
text-align: right; margin-right: 7rpx;
font-size: 22rpx; }
color: #333; </style>
}
.promoter-list .list .item .right .num {
margin-right: 7rpx;
}
</style>

7
pages/coupon/list.vue
View File

@ -17,9 +17,10 @@
<!-- 情况一：领劵中心 --> <!-- 情况一：领劵中心 -->
<template v-if="state.currentTab === 0"> <template v-if="state.currentTab === 0">
<view v-for="item in state.pagination.list" :key="item.id"> <view v-for="item in state.pagination.list" :key="item.id">
<!-- @tap="sheep.$router.go('/pages/coupon/detail', { id: item.id })" -->
<s-coupon-list <s-coupon-list
:data="item" :data="item"
@tap="sheep.$router.go('/pages/coupon/detail', { id: item.id })"
> >
<template #default> <template #default>
<button <button
@ -37,17 +38,17 @@
<!-- 情况二：我的优惠劵 --> <!-- 情况二：我的优惠劵 -->
<template v-else> <template v-else>
<view v-for="item in state.pagination.list" :key="item.id"> <view v-for="item in state.pagination.list" :key="item.id">
<!-- @tap="sheep.$router.go('/pages/coupon/detail', { couponId: item.id })" -->
<s-coupon-list <s-coupon-list
:data="item" :data="item"
type="user" type="user"
@tap="sheep.$router.go('/pages/coupon/detail', { couponId: item.id })"
> >
<template #default> <template #default>
<button <button
class="ss-reset-button card-btn ss-flex ss-row-center ss-col-center" class="ss-reset-button card-btn ss-flex ss-row-center ss-col-center"
:class="item.status !== 1 ? 'disabled-btn' : ''" :class="item.status !== 1 ? 'disabled-btn' : ''"
:disabled="item.status !== 1" :disabled="item.status !== 1"
@click.stop="sheep.$router.go('/pages/coupon/detail', { couponId: item.id })" @click.stop="sheep.$router.go('/pages/index/category', { couponId: item.id })"
> >
{{ item.status === 1 ? '立即使用' : item.status === 2 ? '已使用' : '已过期' }} {{ item.status === 1 ? '立即使用' : item.status === 2 ? '已使用' : '已过期' }}
</button> </button>

3
pages/goods/point.vue
View File

@ -32,7 +32,7 @@
<view class="ss-flex ss-row-between ss-col-center ss-m-b-18"> <view class="ss-flex ss-row-between ss-col-center ss-m-b-18">
<view class="price-box ss-flex ss-col-bottom"> <view class="price-box ss-flex ss-col-bottom">
<image <image
:src="sheep.$url.static('/static/img/shop/goods/score1.svg')" :src="sheep.$url.static('https://zysc.fjptzykj.com:3000/shangcheng/b0c400b1b30a9ca45031093595e42533de267823285c702fed250061920debf0.png')"
class="point-img" class="point-img"
></image> ></image>
<text class="point-text ss-m-r-16"> <text class="point-text ss-m-r-16">
@ -291,6 +291,7 @@
width: 36rpx; width: 36rpx;
height: 36rpx; height: 36rpx;
margin: 0 4rpx; margin: 0 4rpx;
margin-right: 10px;
} }
.point-text { .point-text {

3
pages/goods/seckill.vue
View File

@ -605,9 +605,10 @@
// height: 41px; // height: 41px;
padding-bottom: 4px; padding-bottom: 4px;
padding-top: 10px;
.title-text { .title-text {
padding: 14px 13px; padding: 0 13px;
} }
} }

2
pages/index/index.vue
View File

@ -12,7 +12,7 @@
onShareAppMessage onShareAppMessage
@search="(e) => { console.log(e,'eeeeeeeeeeee') }" @search="(e) => { console.log(e,'eeeeeeeeeeee') }"
headerBtns='headerBtns' headerBtns='headerBtns'
navbarbackgroundColor="rgba(248,83,42)" backgroundColor="rgba(248,83,42)"
opacityBgUi='ll' opacityBgUi='ll'
:navBg="true" :navBg="true"
> >

3
pages/order/confirm.vue
View File

@ -335,7 +335,8 @@
async function getOrderInfo() { async function getOrderInfo() {
// 计算价格 // 计算价格
let parm = {}; let parm = {};
if(addressState.value.deliveryType == 4){ console.log(state.orderPayload.pointActivityId,'state.orderPayload.pointActivityId')
if(state.orderPayload.pointActivityId){
parm = { parm = {
items: state.orderPayload.items, items: state.orderPayload.items,
couponId: state.orderPayload.couponId, couponId: state.orderPayload.couponId,

43
pages/reservation_record/reservation_record.vue
View File

@ -5,28 +5,29 @@
<view class="card" v-for="(item, index) in reservationList" :key="index"> <view class="card" v-for="(item, index) in reservationList" :key="index">
<view class="card-content"> <view class="card-content">
<text class="type">预约信息</text> <text class="type">预约信息</text>
<text class="time">订单日期：{{ sheep.$helper.timeFormat(item.reAddTime, 'yyyy-mm-dd hh:MM:ss') }}</text> <text class="time">订单日期：{{ sheep.$helper.timeFormat(item.createTime, 'yyyy-mm-dd') }}</text>
</view> </view>
<view style="height: 1px; background-color: #e8e8e8;margin:7px 0px 7px 0px"></view>
<view> <view>
<text class="address">医生：{{ item.technicianName }}</text><br><br> <text class="address">预约姓名：<text class="title">{{ item.technicianName }}</text></text>
<text class="address">医馆：{{ item.brandName }}</text><br><br> <text class="address">预约电话：<text class="title">{{ item.memberphone }}</text></text>
<text class="address">医馆电话：{{ item.brandphone }}</text><br><br> <text class="address">预约时间：<text
class="title">{{ sheep.$helper.timeFormat(item.reAddTime, 'yyyy-mm-dd') }}</text></text>
<text class="address">门店名称：<text class="title">{{ item.brandName }}</text> </text>
<div class="address-container"> <div class="address-container">
<text class="address">医馆地址：{{ item.brandaddress }}</text><br><br> <text class="address">门店地址：<text class="title">{{ item.brandaddress }}</text></text>
</div> </div>
<text class="address">备注：{{ item.remark }}</text><br><br> <text class="address">备注留言：<text class="title">{{ item.remark }}</text></text>
</view> </view>
<view> <view>
<text class="status" <text class="status"
style="float: right; border-radius: 10px; background-color: orangered; padding: 5px 10px; color: white;" style="float: right; border-radius: 10px; background-color: rgba(0,149,243); padding: 5px 10px; color: white;"
v-if=" item.reStatus===0">待审核</text> v-if=" item.reStatus===0">待审核</text>
<text class="status" <text class="status"
style="float: right; border-radius: 10px; background-color: orangered; padding: 5px 10px; color: white;" style="float: right; border-radius: 10px; background-color: orangered; padding: 5px 10px; color: white;"
v-if=" item.reStatus===1">预约成功</text> v-if=" item.reStatus===1">预约成功</text>
<text class="status" <text class="status"
style="float: right; border-radius: 10px; background-color: orangered; padding: 5px 10px; color: white;" style="float: right; border-radius: 10px; background-color: orangered; padding: 5px 10px; color: white;"
v-if=" item.reStatus===2">已完结</text><br><br> v-if=" item.reStatus===2">已完结</text>
</view> </view>
</view> </view>
</view> </view>
@ -88,6 +89,7 @@
limit, limit,
totalPages, totalPages,
getList, getList,
sheep
}; };
}, },
}; };
@ -142,10 +144,12 @@
.card-content { .card-content {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin-bottom: 20px;
.type { .type {
position: relative; position: relative;
padding-left: 20px; padding-left: 20px;
font-size: 16px;
&::before { &::before {
content: ''; content: '';
@ -154,17 +158,18 @@
left: 0; left: 0;
width: 10px; width: 10px;
height: 100%; height: 100%;
background: url('https://zysc.fjptzykj.com:3000/shangcheng/7b5c7b96c46b782e8928ed9e53d19563823408b481b03ec75954d8266ec55f6b.png') no-repeat; background: url('https://zysc.fjptzykj.com:3000/shangcheng/617bb18286a76a4c8bfc377bf69f7436c478252e419f04cdd9a6070dd352d00f.png') no-repeat;
background-size: 60%; background-size: 60%;
} }
} }
.time{
font-size: 15px;
}
} }
.card-contentinfo { .card-contentinfo {
margin-top: 20px; margin-top: 20px;
text-align: center; text-align: center;
/* display: flex;
justify-content: space-between; */
} }
.card-image { .card-image {
@ -192,9 +197,15 @@
} }
.address { .address {
margin: 20px 0px 0px 20px; display: block;
margin-bottom: 10px;
font-size: 15px; font-size: 15px;
color: #666; color: rgba(174, 174, 174);
.title {
font-size: 15px;
font-weight: 300;
}
} }
.health-list { .health-list {
@ -228,7 +239,7 @@
.time { .time {
/* margin-top: 20px; */ /* margin-top: 20px; */
font-size: 15px; font-size: 12px;
color: #5e5e5e; color: #aeaeae;
} }
</style> </style>

814
pages/subscribe/subscribe.vue
View File

@ -1,24 +1,219 @@
<template> <template>
<s-layout title="预约" :bgStyle="{ color: '#fff' }"> <s-layout color="white" :bgStyle="{ color: '#fff'}" opacityBgUi="" navbarbackgroundColor="transparent">
<view class="container">
<view class="new-main">
<view class="top-img">
<image class="img"
src="https://zysc.fjptzykj.com:3000/shangcheng/3148160e2dcb79f1a494ad59229976e31bc9f8e1f13b8da073ad3bcd95a36801.png">
</image>
</view>
<!-- <view class="new-all new-top">
<image class="new-img" :src="brandList.list[selectedClinicIndex].picUrl" mode="aspectFill">
</image>
<view class='new-title'>
<view class='t' v-html="brandList.list[selectedClinicIndex].depict"></view>
<view class='b'>{{ brandList.list[selectedClinicIndex].address }}</view>
</view>
<view class="new-bottom">
<view class="l">
<view class="t">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/0f3417cd9adec5b7fce6ac74a4525a3b44803137decbf83bb1608f8723f423e8.png"
class="img"></image>
莆田市城厢区万达广场对面
</view>
<view class="t">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/3160a894c5c816f62574dd66eed01930eaa5c28126c3170eab0f622c3ab88115.png"
class="img"></image>
每周二至周日
</view>
</view>
<view class="r">
<image class="img"
src="https://zysc.fjptzykj.com:3000/shangcheng/a0661763abe4539e376cc22eaf79a6de1e99a253c37281d3d3944abcd81a7227.png">
</image>
</view>
</view>
</view> -->
<view class="new-all">
<view class="title">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/617bb18286a76a4c8bfc377bf69f7436c478252e419f04cdd9a6070dd352d00f.png"
class="img"></image>
<text class='text'>门店选择</text>
</view>
<picker mode="selector" :range="brandNameList" @change="onClinicChange">
<view class="clinic-select-value">
<text>{{ ll}}</text>
<image src="@/static/images/dayu.png" class="img"></image>
</view>
</picker>
<view class="title">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/617bb18286a76a4c8bfc377bf69f7436c478252e419f04cdd9a6070dd352d00f.png"
class="img"></image>
<text class='text'>项目选择</text>
</view>
<view class="doctor-list"> <picker mode="selector" :range="brandNameList" @change="onClinicChange">
<view class="doctor-cards"> <view class="clinic-select-value">
<image class="doctor-avatars" :src="brandList.list[selectedClinicIndex].picUrl" <text>{{ ll}}</text>
mode="aspectFill"></image><br /><br /> <image src="@/static/images/dayu.png" class="img"></image>
<view class="brandr-info"> </view>
<text class="doctor-names"> </picker>
<text class="ygcontent">医馆地址：</text> <!-- 项目选择列表 -->
{{ brandList.list[selectedClinicIndex].address }}</text><br /><br /> <view class="new-project">
<!-- <div v-html='brandList.list[selectedClinicIndex].depict'></div> --> <view class="list" @click="onradio(item)" :class="this.techid == item.id ? 'on': ''"
<rich-text class="doctor-specialtys" :nodes="brandList.list[selectedClinicIndex].depict"></rich-text> v-for="(item, index) in techList" :key="index">
<view class="l">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/e940fb45cc53df01980b7069432d5101e104014fbb3cd24862d08c1ffba9df68.png"
class='img'></image>
</view>
<view class="r">
<view class="tt">
<image class='img img1'
src="https://zysc.fjptzykj.com:3000/shangcheng/d0a91de26065e4753357ed32f301d2ed9c8a9b10e789c9cddf5f5a93903af9da.png">
</image>
<image class='img img2'
src="https://zysc.fjptzykj.com:3000/shangcheng/f9e69fd9b1e60481f3ba926d1942d65e34c90916329823a16ce703f6fe36b2e9.png">
</image>
关于UI视觉设计方案需求评审
</view>
<view class="tt ttr">
<image class='img img1'
src="https://zysc.fjptzykj.com:3000/shangcheng/10b4a5f0abb36bb1a4ef71f36ffc867330d34844abd897a59889dc9a61b9c2af.png">
</image>
<image class='img img2'
src="https://zysc.fjptzykj.com:3000/shangcheng/a4a5541795df5e89912762bfb29900d8ab420abbda2753b2d22741e29e0ea150.png">
</image>
关于UI视觉设计方案需求评审
</view>
<view class="tt ttr">
<image class='img img1'
src="https://zysc.fjptzykj.com:3000/shangcheng/f197edf433c7c80703de38cf49f9bbef64192de14ec284950a023d68bcad792a.png">
</image>
<image class='img img2'
src="https://zysc.fjptzykj.com:3000/shangcheng/ca834c977ae99a35db90b5cef48c729c9ce953840a86847cb926d9752f58c0d7.png">
</image>
关于UI视觉设计方案需求评审
</view>
</view>
</view>
</view>
<view class="title">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/617bb18286a76a4c8bfc377bf69f7436c478252e419f04cdd9a6070dd352d00f.png"
class="img"></image>
<text class='text'>套餐选择</text>
</view>
<picker mode="selector" :range="brandNameList" @change="onClinicChange">
<view class="clinic-select-value">
<text>{{ ll}}</text>
<image src="@/static/images/dayu.png" class="img"></image>
</view>
</picker>
<view class="title">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/617bb18286a76a4c8bfc377bf69f7436c478252e419f04cdd9a6070dd352d00f.png"
class="img"></image>
<text class='text'>预约日期</text>
</view>
<view class="date-list">
<scroll-view class="scroll-view_H" scroll-x="true" @scroll="scroll" scroll-left="120">
<view class="scroll-view-item_H" v-for="(item, index) in dateList" :key="index"
@click="selectDate(index)">
<view class="date-item" v-if="addDate==item.addDate"
style="background-color: rgba(228,241,255);border: 1px solid rgba(3,150,248);">
<text class="date" style="color: black;">{{ item.formattedDate }}</text>
<text class="weekday" style="color: rgba(82,82,2,83);">{{ item.weekday }}</text>
</view>
<view class="date-item" v-if="addDate!=item.addDate">
<text class="date">{{ item.formattedDate }}</text>
<text class="weekday">{{ item.weekday }}</text>
</view>
</view>
</scroll-view>
</view>
<view class="title" style="margin-top:10px;">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/617bb18286a76a4c8bfc377bf69f7436c478252e419f04cdd9a6070dd352d00f.png"
class="img"></image>
<text class='text'>预约时段</text>
</view>
<view class="date-list">
<view class="new-nei" v-for="(item, index) in serviceTime" :key="index">
<view class="date-list-new" @click="selecthsstr(index)" :class="hsstr==item.str ? 'on':''">
<view class="date-itemstr" v-if="hsstr==item.str">
<text class="weekday">{{ item.str }}</text>
</view>
<view v-if="item.ym==='true'" class="new-jk">
<view class="date-itemym" v-if="hsstr!=item.str">
<text class="weekdayym">约满</text><br />
<text class="weekday">{{ item.str }}</text>
</view>
</view>
<view v-if="item.ym==='false'" class="new-jk">
<view class="date-itemstr" v-if="hsstr!=item.str">
<text class="weekday">{{ item.str }}</text>
</view>
</view>
</view>
</view>
</view>
<view class="title" style="margin-top:10px;">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/617bb18286a76a4c8bfc377bf69f7436c478252e419f04cdd9a6070dd352d00f.png"
class="img"></image>
<text class='text'>预约信息</text>
</view>
<view class="yyxx-input">
<view class="name">
姓名:<input class="int" placeholder="请输入您的名字" placeholder-style="color:rgba(204,204,204)" />
</view>
<view class="phone">
电话:<input class="int" placeholder="请输入您的电话" placeholder-style="color:rgba(204,204,204)" />
</view> </view>
</view> </view>
</view> </view>
<view class="clinic-select">
<view class="footer" @click="handleSubmit">
立即预约
</view>
</view>
<view class="container">
<!-- <view class="doctor-list">
<view class="doctor-cards">
<image class="doctor-avatars" :src="brandList.list[selectedClinicIndex].picUrl" mode="aspectFill">
</image><br /><br />
<view class="brandr-info">
<text class="doctor-names">
<text class="ygcontent">医馆地址：</text>
{{ brandList.list[selectedClinicIndex].address }}</text><br /><br />
<rich-text class="doctor-specialtys"
:nodes="brandList.list[selectedClinicIndex].depict"></rich-text>
</view>
</view>
</view> -->
<!-- <view class="clinic-select">
<text class="clinic-select-label">医馆选择</text> <text class="clinic-select-label">医馆选择</text>
<picker mode="selector" :range="brandNameList" @change="onClinicChange"> <picker mode="selector" :range="brandNameList" @change="onClinicChange">
<view class="clinic-select-value"> <view class="clinic-select-value">
@ -33,7 +228,7 @@
<text>{{ gg }}</text> <text>{{ gg }}</text>
</view> </view>
</picker> </picker>
</view> </view> -->
<!-- <text class="clinic-select-label">套餐选择</text><br> <!-- <text class="clinic-select-label">套餐选择</text><br>
<image class="doctor-avatar" src="/static/avatar-doctor.png" mode="aspectFill"></image> --> <image class="doctor-avatar" src="/static/avatar-doctor.png" mode="aspectFill"></image> -->
<!-- <view class="date-card"> <!-- <view class="date-card">
@ -49,7 +244,7 @@
</swiper-item> </swiper-item>
</swiper> </swiper>
</view> --> </view> -->
<radio-group> <!-- <radio-group>
<view class="date-list"> <view class="date-list">
<view v-for="(item, index) in dateList" :key="index" @click="selectDate(index)"> <view v-for="(item, index) in dateList" :key="index" @click="selectDate(index)">
<view class="date-item" v-if="addDate==item.addDate" style="background-color: #ff5541;"> <view class="date-item" v-if="addDate==item.addDate" style="background-color: #ff5541;">
@ -64,7 +259,7 @@
</view> </view>
</view> </view>
</view> </view>
</radio-group> </radio-group> -->
<!-- <view @click="showTime = true"><text v-if="goTime" style="color: #000;">{{goTime }}</text><text v-else>请选择返程时间</text></view> --> <!-- <view @click="showTime = true"><text v-if="goTime" style="color: #000;">{{goTime }}</text><text v-else>请选择返程时间</text></view> -->
@ -96,7 +291,7 @@
</view> </view>
</radio-group> </radio-group>
<radio-group> <!-- <radio-group>
<view class="date-list"> <view class="date-list">
<view v-for="(item, index) in serviceTime" :key="index" @click="selecthsstr(index)"> <view v-for="(item, index) in serviceTime" :key="index" @click="selecthsstr(index)">
<view class="date-itemstr" v-if="hsstr==item.str" style="background-color: #ff5541;"> <view class="date-itemstr" v-if="hsstr==item.str" style="background-color: #ff5541;">
@ -118,13 +313,13 @@
</view> </view>
</view> </view>
</radio-group> </radio-group> -->
<view class="footer"> <!-- <view class="footer">
<button class="appointment-btn" @click="handleSubmit">立即预约</button> <button class="appointment-btn" @click="handleSubmit">立即预约</button>
</view> </view> -->
</view> </view>
</s-layout> </s-layout>
</template> </template>
@ -190,8 +385,8 @@
selecttypeIndex: 0, selecttypeIndex: 0,
techid: 0, techid: 0,
type: 0, type: 0,
ll:'请选择', ll: '请选择',
gg:'请选择' gg: '请选择'
}; };
}, },
created() { created() {
@ -220,7 +415,7 @@
this.selecttypeIndex = selecttypeIndex; this.selecttypeIndex = selecttypeIndex;
this.typename = this.typeList[selecttypeIndex].dictValue this.typename = this.typeList[selecttypeIndex].dictValue
this.type = this.typeList[selecttypeIndex].value this.type = this.typeList[selecttypeIndex].value
console.log(this.type,"this.type") console.log(this.type, "this.type")
this.gg = this.typeList[selecttypeIndex].label this.gg = this.typeList[selecttypeIndex].label
this.technicianList(); this.technicianList();
}, },
@ -234,12 +429,12 @@
}, },
}).then((res) => { }).then((res) => {
this.brandList = res.data this.brandList = res.data
console.log(this.brandList,"this.brandList") console.log(this.brandList, "this.brandList")
for (var i = 0; i < this.brandList.list.length; i++) { for (var i = 0; i < this.brandList.list.length; i++) {
// this.brandList[i].depict=(this.brandList[i].depict).replace(/\<img/gi, '<img style="max-width:100%;height:auto" ') // this.brandList[i].depict=(this.brandList[i].depict).replace(/\<img/gi, '<img style="max-width:100%;height:auto" ')
this.brandNameList.push(this.brandList.list[i].name) this.brandNameList.push(this.brandList.list[i].name)
} }
this.brandId = this.brandList[0].id this.brandId = this.brandList[0].id
this.technicianList(); this.technicianList();
}); });
@ -269,7 +464,7 @@
showLoading: false, showLoading: false,
}, },
}).then((res) => { }).then((res) => {
console.log(res,"typeListtypeList") console.log(res, "typeListtypeList")
this.typeList = res.data this.typeList = res.data
// this.typeList.depict=this.typeList.depict.replace(/\<img/gi, '<img style="max-width:100%;float:left; height:auto" ') // this.typeList.depict=this.typeList.depict.replace(/\<img/gi, '<img style="max-width:100%;float:left; height:auto" ')
for (var i = 0; i < this.typeList.length; i++) { for (var i = 0; i < this.typeList.length; i++) {
@ -298,12 +493,12 @@
technicianList() { technicianList() {
console.log("有没有进来technicianList"); console.log("有没有进来technicianList");
this.techid = null, this.techid = null,
this.serviceTime = [] this.serviceTime = []
this.hsstr = "" this.hsstr = ""
request({ request({
url: `${baseUrl}${apiPath}/h5/technician/list`, url: `${baseUrl}${apiPath}/h5/technician/list`,
method: 'GET', method: 'GET',
params:{ params: {
type: this.type, type: this.type,
// addDate:this.addDate, // addDate:this.addDate,
brandId: this.brandId brandId: this.brandId
@ -322,7 +517,7 @@
} }
this.onradio(item); this.onradio(item);
} }
console.log(this.techList) console.log(this.techList)
}); });
// uni.request({ // uni.request({
@ -361,7 +556,7 @@
request({ request({
url: `${baseUrl}${apiPath}/h5/technician/h5xq`, url: `${baseUrl}${apiPath}/h5/technician/h5xq`,
method: 'GET', method: 'GET',
params:{ params: {
addDate: this.addDate, addDate: this.addDate,
id: this.techid id: this.techid
}, },
@ -371,7 +566,7 @@
}).then((res) => { }).then((res) => {
console.log(res); console.log(res);
var serviceTime = JSON.parse(res.data.serviceTime) var serviceTime = JSON.parse(res.data.serviceTime)
console.log(serviceTime,"serviceTimeserviceTimeserviceTime") console.log(serviceTime, "serviceTimeserviceTimeserviceTime")
if (serviceTime) { if (serviceTime) {
for (let i = 0; i < serviceTime.length; i++) { for (let i = 0; i < serviceTime.length; i++) {
console.log(serviceTime[i].end) console.log(serviceTime[i].end)
@ -386,40 +581,9 @@
} }
} }
} }
console.log(this.serviceTime,"this.serviceTime") console.log(this.serviceTime, "this.serviceTime")
}); });
// uni.request({
// // url: 'https://sfyjk.com/api/h5/technician/' + this.techid, // 接口地址
// url: `${baseUrl}/app-api/h5/technician/h5xq`, // 接口地址
// data: {
// addDate: this.addDate,
// id: this.techid
// },
// success: (res) => {
// console.log(res);
// var serviceTime = JSON.parse(res.data.data.serviceTime)
// console.log(serviceTime)
// if (serviceTime) {
// for (let i = 0; i < serviceTime.length; i++) {
// console.log(serviceTime[i].endTime)
// console.log(serviceTime[i].startTime)
// console.log(serviceTime[i].ym)
// if (serviceTime[i].endTime && serviceTime[i].startTime) {
// this.sjd = {},
// this.sjd.str = serviceTime[i].startTime.toString() + "-" + serviceTime[
// i].endTime.toString()
// this.sjd.ym = serviceTime[i].ym
// this.serviceTime.push(this.sjd)
// }
// }
// }
// console.log(this.serviceTime)
// },
// fail: (error) => {
// console.log(error)
// }
// })
}, },
selectDay(index) { selectDay(index) {
@ -485,7 +649,7 @@
} }
}); });
}); });
} }
} }
@ -532,7 +696,7 @@
console.log(this.serviceTime[index].str) console.log(this.serviceTime[index].str)
console.log(this.serviceTime[index].ym) console.log(this.serviceTime[index].ym)
if (this.serviceTime[index].ym === "true") { if (this.serviceTime[index].ym === "true") {
} else if (this.serviceTime[index].ym === "false") { } else if (this.serviceTime[index].ym === "false") {
this.hsstr = this.serviceTime[index].str this.hsstr = this.serviceTime[index].str
} }
@ -544,256 +708,346 @@
}; };
</script> </script>
<style scoped> <style scope lang="scss">
.container { .new-main {
padding: 20px; width: 100%;
} margin-top: -3rem;
background-color: rgba(237, 249, 254);
.clinic-select { .top-img {
display: flex; .img {
align-items: center; width: 100%;
margin-bottom: 20px; height: 153px;
} }
}
.clinic-select-label { .new-all {
margin-right: 10px; width: 93%;
color: #333; margin: 15px auto;
} background: white;
padding: 10px 0;
border-radius: 9px;
.clinic-select-value { .yyxx-input {
display: flex; padding: 10px;
align-items: center;
padding: 5px 10px;
border: 1px solid #ff5541;
border-radius: 5px;
background-color: #ffd3c1;
color: #ff5541;
}
.info-title { &>view {
margin-top: 20px; padding: 15px 0;
font-size: 15px; display: flex;
font-weight: bold; align-items: center;
margin-bottom: 10px; font-size: 16px;
} font-weight: 700;
}
.dropdown-icon { .name {
width: 12px; border-bottom: 1px solid rgba(229, 229, 229);
height: 12px; }
margin-left: 5px;
}
.date-card { .int {
display: flex; padding-left: 15px;
flex-direction: column; }
} }
.weekdays { .new-project {
display: flex; .list {
justify-content: space-between; padding: 10px 20px;
margin-bottom: 10px; background: rgba(246, 247, 251);
} display: flex;
margin: 10px 10px;
border-radius: 5px;
align-items: center;
.weekday { &.on {
/* margin-left: 0%; */ background: rgb(0, 149, 248);
font-size: 5px;
color: #666;
cursor: pointer;
}
.weekdayym { .r {
margin-left: 30%; .tt {
font-size: 14px; color: white;
color: #666;
cursor: pointer;
}
.weekday.active { .img2 {
color: #333; display: block;
font-weight: bold; }
}
.date-swiper { .img1 {
height: 150px; display: none;
} }
}
}
}
.date-itemstr { .l {
display: flex; width: 50px;
align-items: center; height: 50px;
justify-content: center; margin-right: 10px;
width: 80px;
height: 50px;
border-radius: 10px;
background-color: #f0f0f0;
margin-right: 15px;
cursor: pointer;
}
.date-itemym { .img {
/* display: flex; */ width: 100%;
align-items: center; height: 100%;
justify-content: center; }
width: 80px; }
height: 50px;
border-radius: 10px;
background-color: #f0898b;
margin-right: 15px;
cursor: pointer;
}
.date-item.active { .r {
background-color: #ff5541; padding-left: 15px;
color: #fff; position: relative;
}
.date { &::after {
font-size: 16px; position: absolute;
color: #333; content: '';
} height: 100%;
width: 1px;
background: #c4c4c4;
top: 50%;
left: 0;
transform: translateY(-50%);
}
.doctor-list { .tt {
display: flex; display: flex;
flex-wrap: wrap; align-items: center;
justify-content: space-between; margin-bottom: 8px;
}
.doctor-card {
/* display: flex; */
align-items: center;
padding: 10px;
width: 400px;
background-color: #ffd3c1;
border: 1px solid #ff5541;
border-radius: 10px;
margin-bottom: 10px;
}
.doctor-cards { .img {
/* display: flex; */ width: 20px;
align-items: center; height: 20px;
padding: 10px; margin-right: 10px;
width: 400px; }
background-color: #f0f0f0;
/* border: 1px solid #fff; */
border-radius: 10px;
margin-bottom: 10px;
}
.doctor-avatar { .img2 {
width: 100px; display: none;
height: 70px; }
border-radius: 50%; }
margin-right: 10px;
}
.doctor-avatars { .ttr {
display: flex; font-size: 13px;
/* height: 70px; */ }
/* border-radius: 50%; */ }
/* margin-right: 10px; */ }
} }
.doctor-info { .clinic-select-value {
display: flex; margin: 10px 10px;
flex-grow: 1; border: 1px solid #efefef;
padding: 10px 20px;
border-radius: 26px;
display: flex;
align-items: center;
justify-content: space-between;
} .img {
width: 25px;
height: 25px;
}
}
.brandr-info { .title {
/* display: flex; */ display: flex;
flex-grow: 1; align-items: center;
margin: 0 10px;
} .img {
width: 8px;
height: 20px;
margin-right: 10px;
}
.doctor-name { .text {
font-size: 20px; font-size: 17px;
color: #ff5541; font-weight: 700;
margin-top: 15px; }
margin-left: 20px; }
/* margin-bottom: 5px; */
}
.doctor-specialty { .date-list {
font-size: 14px; // display: flex;
color: #ff5541; // flex-wrap: wrap;
// justify-content: center;
margin-top: 10px;
padding: 0 5px;
min-height: 53px;
} .scroll-view_H {
white-space: nowrap;
width: 100%;
.doctor-names { .scroll-view-item_H {
font-size: 14px; display: inline-block;
/* color: #ff5541; */ // width: 100%;
// height: 300rpx;
// line-height: 300rpx;
// text-align: center;
// font-size: 36rpx;
}
}
margin-bottom: 5px; .new-nei {
} padding: 5px;
width: 30%;
float: left;
.ygcontent { .date-list-new {
font-size: 16px; border: 1px solid #efefef;
font-weight: 700; text-align: center;
} padding: 10px 0;
border-radius: 6px;
.doctor-specialtys { &.on {
/* text-indent: 20px; */ background: rgb(0, 149, 248);
white-space: pre-wrap;
font-size: 14px;
/* color: #ff5541; */
} .date-itemstr {
.doctor-checkbox { // background-color: #ff5541;
margin-left: auto; .weekday {
color: white;
}
}
}
.date-itemstr {
// background-color: #ff5541;
.weekday {}
}
.new-jk {
.date-itemym {
.weekdayym {}
.weekday {}
}
.date-itemstr {
.weekday {}
}
}
}
}
.date-item {
border-radius: 8px;
float: left;
margin: 5px;
padding: 5px;
width: 26px;
height: 30px;
border: 1px solid rgba(229, 229, 229);
cursor: pointer;
display: flex;
background-color: white;
flex-direction: column;
align-items: center;
&:hover {
background-color: #ff5541;
}
.date {
font-size: 8px;
}
.weekday {
margin-top: 5px;
font-size: 10px;
color: #666;
}
}
}
}
.new-top {
padding: 0 0;
.new-img {
width: 100%;
height: 150px;
border-radius: 9px 9px 0 0;
}
.new-title {
padding: 10px;
.t {
width: 100%;
font-size: 20px;
color: black;
}
.b {
width: 100%;
font-size: 15px;
color: rgba(154, 154, 154);
position: relative;
padding-bottom: 15px;
&::after {
position: absolute;
content: '';
bottom: 0;
height: 1px;
width: 100%;
background: #e8e3e3;
left: 50%;
transform: translateX(-50%);
}
}
}
.new-bottom {
padding: 10px;
padding-top: 0;
display: flex;
justify-content: space-between;
align-items: center;
.l {
.t {
display: flex;
align-items: center;
margin-bottom: 10px;
.img {
width: 20px;
height: 20px;
margin-right: 10px;
}
}
}
.r {
position: relative;
width: 40px;
padding-left: 14px;
&::after {
position: absolute;
content: '';
left: 0;
height: 35px;
width: 1px;
background: #e8e3e3;
top: 50%;
transform: translateY(-50%);
}
.img {
width: 20px;
height: 20px;
display: block;
margin: 0 auto;
}
}
}
}
} }
.footer { .footer {
display: flex; padding: 10px 0;
justify-content: center; border-radius: 15px;
margin-top: 20px; background: rgb(0, 149, 248);
} margin: 0 10px;
text-align: center;
.appointment-btn { color: white;
width: 200px;
height: 40px;
border-radius: 20px;
background-color: #ff5541;
color: #fff;
font-size: 16px;
}
.date-list {
/* width: 100px; */
display: flex;
flex-wrap: wrap;
}
.date-item {
float: left;
margin: 5px;
padding: 5px;
width: 26px;
height: 30px;
border: 1px solid #fff;
cursor: pointer;
display: flex;
background-color: #efefef;
flex-direction: column;
align-items: center;
}
.date-item:hover {
/* background-color: #ff5541; */
}
.date {
font-size: 8px;
}
.weekday {
margin-top: 5px;
font-size: 10px;
color: #666;
}
.radiodate {
display: none;
} }
</style> </style>

367
pages/user/user_vip/list.vue Normal file
View File

@ -0,0 +1,367 @@
<!-- 会员信息 -->
<template>
<s-layout navbar="inner" title="SVIP会员专享" :statusBar="true" :bgStyle="{ color: '#FE832A', backgroundColor:'white' }" navbarbackgroundColor="rgba(57,55,54)">
<view class='vip-main'>
<view class="vip-top">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/07cee74ec47ed41b33e277dffe9291a6cab8423d8f8539c34662a793842e6d27.png"
class="img"></image>
<view class="userInfo">
<view class="l">
<image :src="sheep.$url.cdn(userInfo.avatar)" mode="aspectFill" class="img"></image>
<view class="text">
<view class="t">{{ userInfo.nickname }}
<image src="" class="img"></image>
</view>
<view class="c">您与众悦e家商场的第101天</view>
<view class="b">开通即享会员权益</view>
</view>
</view>
<view class="r">
开通会员
</view>
</view>
</view>
<view class="vip-zxq">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/d865a7766bf5ccbfb76e97f3fd65bcfdc37a612fe94878b7a899adab869360f8.png"
class="img"></image>
<view class="list">
<view class="item" v-for="(item, index) in vipList2" :key="index">
<view class="new-nei">
<view class="l">
<image
:src="item.iconUrl"
class="l-img"></image>
</view>
<view class="r">
<view class="t">
{{item.benName}}
</view>
<view class="b">
{{item.intro}}
</view>
</view>
</view>
</view>
</view>
<view class="" style="clear: both;">
</view>
</view>
<view class="vip-kt">
<view class="top">
<text class="t1">开通会员</text>
<text class="t2">有效期至</text>
<text class="t3">2024-10-24</text>
</view>
<scroll-view class="scroll-view_H" scroll-x="true" @scroll="scroll" scroll-left="120">
<view id="demo1" @click="vipFun(index)" class="scroll-view-item_H uni-bg-red" :class="valVip == index ? 'on' : ''" v-for="(item,index) in vipList" :key="index">
<view class="t">{{item.name}}</view>
<view class="c">￥<text class="tx">{{item.specialPrice}}</text></view>
<view class="b" v-if="index==0">试用1天</view>
<view class="b sc" v-else>￥{{item.originalPrice}}</view>
</view>
</scroll-view>
</view>
<view class="vip-text">
购买即视为同意《<text class="ts">会员用户协议</text>》
</view>
<view class="vip-btn" @click="beclick()">
立即试用
</view>
</view>
</s-layout>
</template>
<script setup>
import {
computed,
reactive,
onBeforeMount,
onMounted,
ref
} from 'vue';
import request from '@/sheep/request';
import {
baseUrl,
apiPath
} from '@/sheep/config';
import sheep from '@/sheep';
const statusBarHeight = sheep.$platform.device.statusBarHeight * 2;
const userInfo = computed(() => sheep.$store('user').userInfo);
const vipList = ref([]);
const vipList2 = ref([]);
const valVip = ref([]);
// 定义方法
function getList() {
request({
url: `${baseUrl}${apiPath}/member/card/type/list`,
method: 'GET',
params: {
},
custom: {
showLoading: false,
},
}).then((res) => {
console.log(res,"sss")
vipList.value = res.data;
});
}
// vipFun
function vipFun(index) {
valVip.value = index
}
let kk = {
cardName:'试用'
};
// beclick
function beclick() {
request({
url: `${baseUrl}${apiPath}/pay/member/create`,
method: 'post',
params: {
cardName:kk
},
custom: {
showLoading: false,
},
}).then((res) => {
console.log(JSON.stringify(kk),"-----------试用---------------")
});
}
// 定义方法2
function getList2() {
request({
url: `${baseUrl}${apiPath}/member/benefit/list`,
method: 'GET',
params: {
},
custom: {
showLoading: false,
},
}).then((res) => {
console.log(res,"sss")
vipList2.value = res.data;
});
}
// 使用 onMounted 生命周期钩子
onMounted(() => {
getList();
getList2();
});
</script>
<style lang="scss" scoped>
.vip-main {
margin-top: -3.75rem;
.vip-top {
width: 100%;
height: 200px;
// background: rgba(57, 55, 54);
position: relative;
.img {
width: 100%;
height: 100%;
}
.userInfo {
position: absolute;
bottom: 38px;
padding: 0 20px;
display: flex;
justify-content: space-between;
left: 50%;
transform: translateX(-50%);
width: 85%;
align-items: center;
.l {
display: flex;
justify-content: space-between;
align-items: center;
.img {
width: 50px;
height: 50px;
border-radius: 23px;
margin-right: 10px;
}
.text {
.t {
font-size: 18px;
font-weight: 700;
.img {
width: 20px;
height: 20px;
}
}
.c {
color: rgba(208, 185, 156);
font-size: 13px;
}
.b {
color: rgba(201, 141, 99);
font-size: 13px;
margin-top: 7px;
}
}
}
.r {
color: #8a745c;
font-size: 15px;
padding: 5px 15px;
background: white;
border-radius: 15px;
}
}
}
.vip-zxq {
.img {
width: 77%;
height: 89px;
margin: 0 auto;
display: block;
margin-top: 20px;
}
.list {
padding: 0 10px;
.item {
width: 47%;
float: left;
padding: 5px;
.new-nei {
background: rgba(247, 247, 247);
padding: 15px 10px;
display: flex;
align-items: center;
.l {
display: flex;
align-items: center;
.l-img {
width: 50px;
height: 50px;
margin-right: 10px;
}
}
.r {
.t {}
.b {
font-size: 13px;
color: rgba(191, 147, 109);
}
}
}
}
}
}
.vip-kt {
padding: 10px 10px;
.top {
.t1 {
font-size: 17px;
font-weight: 700;
margin-right: 10px;
}
.t2 {
font-size: 15px;
margin-right: 10px;
color: rgba(121, 121, 121);
}
.t3 {
font-size: 13px;
color: rgba(174, 90, 42);
}
}
.scroll-view_H {
white-space: nowrap;
width: 100%;
.scroll-view-item_H {
width: 113px;
display: inline-block;
background-color: white;
border: 1px solid rgba(214,214,214);
margin-right:15px;
border-radius: 10px;
margin-top:15px;
padding:15px 0;
&.on{
background-color: rgba(254,247,236);
border: 1px solid rgba(252,194,130);
}
.t{
color:rgba(117,78,25);
font-weight: 700;
font-size:20px;
text-align: center;
}
.c{
color:rgba(117,78,25);
font-weight: 700;
font-size:15px;
text-align: center;
padding:10px 0;
.tx{
font-size:27px;
}
}
.b{
color:rgba(173,173,173);
font-size:16px;
text-align: center;
&.sc{
text-decoration: line-through;
}
}
}
}
}
.vip-text {
text-align: center;
color: rgba(157, 157, 157);
margin: 15px 0;
.ts {
color: rgba(174, 90, 42);
}
}
.vip-btn {
padding: 10px 0;
background: rgba(254, 220, 137);
text-align: center;
margin: 0 15px;
border-radius: 20px;
color: rgba(95, 53, 38);
}
}
</style>

2
pages/user/wallet/money.vue
View File

@ -69,7 +69,7 @@
</view> </view>
</view> </view>
<text class="time"> <text class="time">
{{ sheep.$helper.timeFormat(state.createTime, 'yyyy-mm-dd hh:MM:ss') }} {{ sheep.$helper.timeFormat(item.createTime, 'yyyy-mm-dd hh:MM:ss') }}
</text> </text>
</view> </view>
</view> </view>

2
sheep/components/s-block-item/s-block-item.vue
View File

@ -66,7 +66,7 @@
<!-- 用户组件：用户卡片 --> <!-- 用户组件：用户卡片 -->
<s-user-card v-if="type === 'UserCard'" /> <s-user-card v-if="type === 'UserCard'" />
<view v-if="type === 'UserOrder'" class="new-huiy" @click=" <view v-if="type === 'UserOrder'" class="new-huiy" @click="
sheep.$router.go('/pages/user/user_vip/index') sheep.$router.go('/pages/user/user_vip/list')
"> ">
<view class="new-button">立即开通</view> <view class="new-button">立即开通</view>
<image class="seckill1" mode="aspectFit" <image class="seckill1" mode="aspectFit"

1
sheep/components/s-groupon-block/s-groupon-block.vue
View File

@ -225,7 +225,6 @@
.new-class { .new-class {
background: white; background: white;
border-radius: 13px;
} }
:deep(.sm-goods-card) { :deep(.sm-goods-card) {

462
sheep/components/s-layout/s-layout.vue
View File

@ -1,261 +1,253 @@
<template> <template>
<view <view class="page-app" :class="['theme-' + sys.mode, 'main-' + sys.theme, 'font-' + sys.fontSize]">
class="page-app" <view class="page-main" :style="[bgMain]">
:class="['theme-' + sys.mode, 'main-' + sys.theme, 'font-' + sys.fontSize]" <!-- 顶部导航栏-情况1：默认通用顶部导航栏 -->
> <su-navbar v-if="navbar === 'normal'" :title="title" statusBar :navbarbackgroundColor="navbarbackgroundColor" :color="color" :tools="tools"
<view class="page-main" :style="[bgMain]"> :opacityBgUi="opacityBgUi" @search="(e) => emits('search', e)" :defaultSearch="defaultSearch"
<!-- 顶部导航栏-情况1：默认通用顶部导航栏 --> :headerBtns="headerBtns" :backgroundColor="backgroundColor" :navBg="navBg" />
<su-navbar
v-if="navbar === 'normal'"
:title="title"
statusBar
:color="color"
:tools="tools"
:opacityBgUi="opacityBgUi"
@search="(e) => emits('search', e)"
:defaultSearch="defaultSearch"
:headerBtns = "headerBtns"
:backgroundColor="navbarbackgroundColor"
:navBg="navBg"
/>
<!-- 顶部导航栏-情况2：装修组件导航栏-标准 --> <!-- 顶部导航栏-情况2：装修组件导航栏-标准 -->
<s-custom-navbar <s-custom-navbar v-else-if="navbar === 'custom' && navbarMode === 'normal'" :data="navbarStyle"
v-else-if="navbar === 'custom' && navbarMode === 'normal'" :showLeftButton="showLeftButton" />
:data="navbarStyle" <view class="page-body" :style="[bgBody]">
:showLeftButton="showLeftButton" <!-- 顶部导航栏-情况3：沉浸式头部 -->
/> <su-inner-navbar v-if="navbar === 'inner'" :title="title" :navbarbackgroundColor="navbarbackgroundColor" />
<view class="page-body" :style="[bgBody]"> <view v-if="navbar === 'inner'" :style="[{ paddingTop: sheep.$platform.navbar + 'px' }]"></view>
<!-- 顶部导航栏-情况3：沉浸式头部 -->
<su-inner-navbar v-if="navbar === 'inner'" :title="title" />
<view
v-if="navbar === 'inner'"
:style="[{ paddingTop: sheep.$platform.navbar + 'px' }]"
></view>
<!-- 顶部导航栏-情况4：装修组件导航栏-沉浸式 --> <!-- 顶部导航栏-情况4：装修组件导航栏-沉浸式 -->
<s-custom-navbar <s-custom-navbar v-if="navbar === 'custom' && navbarMode === 'inner'" :data="navbarStyle"
v-if="navbar === 'custom' && navbarMode === 'inner'" :showLeftButton="showLeftButton" />
:data="navbarStyle"
:showLeftButton="showLeftButton"
/>
<!-- 页面内容插槽 --> <!-- 页面内容插槽 -->
<slot /> <slot />
<!-- 底部导航 --> <!-- 底部导航 -->
<s-tabbar v-if="tabbar !== ''" :path="tabbar" /> <s-tabbar v-if="tabbar !== ''" :path="tabbar" />
</view> </view>
</view> </view>
<view class="page-modal"> <view class="page-modal">
<!-- 全局授权弹窗 --> <!-- 全局授权弹窗 -->
<s-auth-modal /> <s-auth-modal />
<!-- 全局分享弹窗 --> <!-- 全局分享弹窗 -->
<s-share-modal :shareInfo="shareInfo" /> <s-share-modal :shareInfo="shareInfo" />
<!-- 全局快捷入口 --> <!-- 全局快捷入口 -->
<s-menu-tools /> <s-menu-tools />
</view> </view>
</view> </view>
</template> </template>
<script setup> <script setup>
/** /**
* 模板组件 - 提供页面公共组件，属性，方法 * 模板组件 - 提供页面公共组件，属性，方法
*/ */
import { computed, reactive, ref } from 'vue'; import {
import sheep from '@/sheep'; computed,
import { isEmpty } from 'lodash'; reactive,
import { onShow } from '@dcloudio/uni-app'; ref
// #ifdef MP-WEIXIN } from 'vue';
import { onShareAppMessage } from '@dcloudio/uni-app'; import sheep from '@/sheep';
// #endif import {
isEmpty
} from 'lodash';
import {
onShow
} from '@dcloudio/uni-app';
// #ifdef MP-WEIXIN
import {
onShareAppMessage
} from '@dcloudio/uni-app';
// #endif
const props = defineProps({ const props = defineProps({
title: {
type: String, title: {
default: '', type: String,
}, default: '',
headerBtns: { },
type: String, headerBtns: {
default: '', type: String,
}, default: '',
navbarbackgroundColor:{ },
type: String, navbarbackgroundColor: {
default: '', type: String,
}, default: '',
navbar: { },
type: String, backgroundColor: {
default: 'normal', type: String,
}, default: '',
opacityBgUi: { },
type: String, navbar: {
default: 'bg-white', type: String,
}, default: 'normal',
color: { },
type: String, opacityBgUi: {
default: '', type: String,
}, default: 'bg-white',
tools: { },
type: String, color: {
default: 'title', type: String,
}, default: '',
keyword: { },
type: String, tools: {
default: '', type: String,
}, default: 'title',
navbarStyle: { },
type: Object, keyword: {
default: () => ({ type: String,
styleType: '', default: '',
type: '', },
color: '', navbarStyle: {
src: '', type: Object,
list: [], default: () => ({
alwaysShow: 0, styleType: '',
}), type: '',
}, color: '',
bgStyle: { src: '',
type: Object, list: [],
default: () => ({ alwaysShow: 0,
src: '', }),
color: 'var(--ui-BG-1)', },
}), bgStyle: {
}, type: Object,
tabbar: { default: () => ({
type: [String, Boolean], src: '',
default: '', color: 'var(--ui-BG-1)',
}, }),
onShareAppMessage: { },
type: [Boolean, Object], tabbar: {
default: true, type: [String, Boolean],
}, default: '',
leftWidth: { },
type: [Number, String], onShareAppMessage: {
default: 100, type: [Boolean, Object],
}, default: true,
rightWidth: { },
type: [Number, String], leftWidth: {
default: 100, type: [Number, String],
}, default: 100,
defaultSearch: { },
type: String, rightWidth: {
default: '', type: [Number, String],
}, default: 100,
//展示返回按钮 },
showLeftButton: { defaultSearch: {
type: Boolean, type: String,
default: false, default: '',
}, },
navBg: { //展示返回按钮
type: Boolean, showLeftButton: {
default: false, type: Boolean,
}, default: false,
}); },
const emits = defineEmits(['search']); navBg: {
type: Boolean,
default: false,
},
});
const emits = defineEmits(['search']);
const sysStore = sheep.$store('sys'); const sysStore = sheep.$store('sys');
const userStore = sheep.$store('user'); const userStore = sheep.$store('user');
const appStore = sheep.$store('app'); const appStore = sheep.$store('app');
const modalStore = sheep.$store('modal'); const modalStore = sheep.$store('modal');
const sys = computed(() => sysStore); const sys = computed(() => sysStore);
// 导航栏模式(因为有自定义导航栏 需要计算)
const navbarMode = computed(() => {
if (props.navbar === 'normal' || props.navbarStyle.styleType === 'normal') {
return 'normal';
}
return 'inner';
});
// 导航栏模式(因为有自定义导航栏 需要计算) // 背景1
const navbarMode = computed(() => { const bgMain = computed(() => {
if (props.navbar === 'normal' || props.navbarStyle.styleType === 'normal') { if (navbarMode.value === 'inner') {
return 'normal'; return {
} background: `${props.bgStyle.backgroundColor} url(${sheep.$url.cdn(
return 'inner';
});
// 背景1
const bgMain = computed(() => {
if (navbarMode.value === 'inner') {
return {
background: `${props.bgStyle.backgroundColor} url(${sheep.$url.cdn(
props.bgStyle.backgroundImage, props.bgStyle.backgroundImage,
)}) no-repeat top center / 100% auto`, )}) no-repeat top center / 100% auto`,
}; };
} }
return {}; return {};
}); });
// 背景2 // 背景2
const bgBody = computed(() => { const bgBody = computed(() => {
if (navbarMode.value === 'normal') { if (navbarMode.value === 'normal') {
return { return {
background: `${props.bgStyle.backgroundColor} url(${sheep.$url.cdn( background: `${props.bgStyle.backgroundColor} url(${sheep.$url.cdn(
props.bgStyle.backgroundImage, props.bgStyle.backgroundImage,
)}) no-repeat top center / 100% auto`, )}) no-repeat top center / 100% auto`,
}; };
} }
return {}; return {};
}); });
// 分享信息 // 分享信息
const shareInfo = computed(() => { const shareInfo = computed(() => {
if (props.onShareAppMessage === true) { if (props.onShareAppMessage === true) {
return sheep.$platform.share.getShareInfo(); return sheep.$platform.share.getShareInfo();
} else { } else {
if (!isEmpty(props.onShareAppMessage)) { if (!isEmpty(props.onShareAppMessage)) {
sheep.$platform.share.updateShareInfo(props.onShareAppMessage); sheep.$platform.share.updateShareInfo(props.onShareAppMessage);
return props.onShareAppMessage; return props.onShareAppMessage;
} }
} }
return {}; return {};
}); });
// #ifdef MP-WEIXIN // #ifdef MP-WEIXIN
// 微信小程序分享 // 微信小程序分享
onShareAppMessage(() => { onShareAppMessage(() => {
return { return {
title: shareInfo.value.title, title: shareInfo.value.title,
path: shareInfo.value.path, path: shareInfo.value.path,
imageUrl: shareInfo.value.image, imageUrl: shareInfo.value.image,
}; };
}); });
// #endif // #endif
onShow(() => { onShow(() => {
if (!isEmpty(shareInfo.value)) { if (!isEmpty(shareInfo.value)) {
sheep.$platform.share.updateShareInfo(shareInfo.value); sheep.$platform.share.updateShareInfo(shareInfo.value);
} }
}); });
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.page-app { .page-app {
position: relative; position: relative;
color: var(--ui-TC); color: var(--ui-TC);
background-color: var(--ui-BG-1) !important; background-color: var(--ui-BG-1) !important;
z-index: 2; z-index: 2;
display: flex; display: flex;
width: 100%; width: 100%;
height: 100vh; height: 100vh;
.page-main { .page-main {
position: absolute; position: absolute;
z-index: 1; z-index: 1;
width: 100%; width: 100%;
min-height: 100%; min-height: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.page-body { .page-body {
width: 100%; width: 100%;
position: relative; position: relative;
z-index: 1; z-index: 1;
flex: 1; flex: 1;
} }
.page-img { .page-img {
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
z-index: 0; z-index: 0;
} }
} }
} }
</style> </style>

58
sheep/components/s-share-modal/canvas-poster/poster/user.js
View File

@ -25,35 +25,49 @@ const user = async (poster) => {
text: userInfo.nickname, text: userInfo.nickname,
css: { css: {
color: '#333', color: '#333',
fontSize: 14, fontSize: 17,
fontWeight: 700,
textAlign: 'center', textAlign: 'center',
fontFamily: 'sans-serif', fontFamily: 'sans-serif',
position: 'fixed', position: 'fixed',
top: width * 0.4, top: width * 1.33,
left: width / 2, left: width / 2.2,
},
},
{
type: 'image',
src: formatImageUrlProtocol(sheep.$url.cdn(userInfo.avatar)),
css: {
position: 'fixed',
left: width * 0.4,
top: width * 0.16,
width: width * 0.2,
height: width * 0.2,
}, },
}, },
{
type: 'text',
text: '邀请您加入众悦e家',
css: {
color: '#333',
fontSize: 14,
textAlign: 'center',
fontFamily: 'sans-serif',
position: 'fixed',
top: width * 1.41,
left: width / 2.2,
},
},
// {
// type: 'image',
// src: formatImageUrlProtocol(sheep.$url.cdn(userInfo.avatar)),
// css: {
// position: 'fixed',
// left: width * 0.4,
// top: width * 0.16,
// width: width * 0.2,
// height: width * 0.2,
// },
// },
// #ifndef MP-WEIXIN // #ifndef MP-WEIXIN
{ {
type: 'qrcode', type: 'qrcode',
text: poster.shareInfo.link, text: poster.shareInfo.link,
css: { css: {
position: 'fixed', position: 'fixed',
left: width * 0.35, left: width * 0.25,
top: width * 0.84, top: width * 1.3,
width: width * 0.3, width: width * 0.2,
height: width * 0.3, height: width * 0.2,
}, },
}, },
// #endif // #endif
@ -63,10 +77,10 @@ const user = async (poster) => {
src: wxa_qrcode, src: wxa_qrcode,
css: { css: {
position: 'fixed', position: 'fixed',
left: width * 0.35, left: width * 0.22,
top: width * 0.84, top: width * 1.3,
width: width * 0.3, width: width * 0.2,
height: width * 0.3, height: width * 0.2,
}, },
}, },
// #endif // #endif

4
sheep/components/s-share-modal/s-share-modal.vue
View File

@ -43,7 +43,7 @@
</button> </button>
<!-- 操作 ③：生成链接 --> <!-- 操作 ③：生成链接 -->
<button <!-- <button
v-if="shareConfig.methods.includes('link')" v-if="shareConfig.methods.includes('link')"
class="share-item share-btn ss-flex-col ss-col-center" class="share-item share-btn ss-flex-col ss-col-center"
@tap="onShareByCopyLink" @tap="onShareByCopyLink"
@ -54,7 +54,7 @@
mode="" mode=""
/> />
<text class="share-title">复制链接</text> <text class="share-title">复制链接</text>
</button> </button> -->
</view> </view>
<view class="share-foot ss-flex ss-row-center ss-col-center" @tap="closeShareModal"> <view class="share-foot ss-flex ss-row-center ss-col-center" @tap="closeShareModal">
取消 取消

4
sheep/components/s-user-card/s-user-card.vue
View File

@ -21,9 +21,9 @@
</view> </view>
</view> </view>
<view class="right-box ss-m-r-52"> <view class="right-box ss-m-r-52">
<button class="ss-reset-button" @tap="showShareModal"> <!-- <button class="ss-reset-button" @tap="showShareModal">
<text class="sicon-qrcode"></text> <text class="sicon-qrcode"></text>
</button> </button> -->
<!-- <view class="qiandao" @click="sheep.$router.go('/pages/app/sign');"> <!-- <view class="qiandao" @click="sheep.$router.go('/pages/app/sign');">
签到 签到
</view> --> </view> -->

1
sheep/router/index.js
View File

@ -2,7 +2,6 @@ import $store from '@/sheep/store';
import { showAuthModal, showShareModal } from '@/sheep/hooks/useModal'; import { showAuthModal, showShareModal } from '@/sheep/hooks/useModal';
import { isNumber, isString, isEmpty, startsWith, isObject, isNil, clone } from 'lodash'; import { isNumber, isString, isEmpty, startsWith, isObject, isNil, clone } from 'lodash';
import throttle from '@/sheep/helper/throttle'; import throttle from '@/sheep/helper/throttle';
const _go = ( const _go = (
path, path,
params = {}, params = {},

8
sheep/store/app.js
View File

@ -66,7 +66,7 @@ const app = defineStore({
copyright: '全部开源，个人与企业可 100% 免费使用', copyright: '全部开源，个人与企业可 100% 免费使用',
copytime: 'Copyright© 2018-2024', copytime: 'Copyright© 2018-2024',
cdnurl: 'https://file.sheepjs.com', // 云存储域名 cdnurl: 'https://zysc.fjptzykj.com:3000', // 云存储域名
filesystem: 'qcloud', // 云存储平台 filesystem: 'qcloud', // 云存储平台
}; };
this.platform = { this.platform = {
@ -74,9 +74,9 @@ const app = defineStore({
methods: ['poster', 'link'], methods: ['poster', 'link'],
linkAddress: 'http://127.0.0.1:3000', // TODO 芋艿：可以考虑改到 .env 那 linkAddress: 'http://127.0.0.1:3000', // TODO 芋艿：可以考虑改到 .env 那
posterInfo: { posterInfo: {
user_bg: '/static/img/shop/config/user-poster-bg.png', user_bg: '/shangcheng/user-poster-bg.png',
goods_bg: '/static/img/shop/config/goods-poster-bg.png', goods_bg: '/shangcheng/goods-poster-bg.png',
groupon_bg: '/static/img/shop/config/groupon-poster-bg.png', groupon_bg: '/shangcheng/groupon-poster-bg.png',
}, },
}, },
bind_mobile: 0, bind_mobile: 0,

662
sheep/ui/su-inner-navbar/su-inner-navbar.vue
View File

@ -1,365 +1,379 @@
<template> <template>
<su-fixed <su-fixed :noFixed="props.noFixed" :alway="props.alway" :bgStyles="props.bgStyles" :val="0" :index="props.zIndex"
:noFixed="props.noFixed" noNav :bg="props.bg" :ui="props.ui" :opacity="props.opacity" :placeholder="props.placeholder">
:alway="props.alway" <su-status-bar :navbarbackgroundColor="navbarbackgroundColor" />
:bgStyles="props.bgStyles" <!--
:val="0"
:index="props.zIndex"
noNav
:bg="props.bg"
:ui="props.ui"
:opacity="props.opacity"
:placeholder="props.placeholder"
>
<su-status-bar />
<!--
:class="[{ 'border-bottom': !props.opacity && props.bg != 'bg-none' }]" :class="[{ 'border-bottom': !props.opacity && props.bg != 'bg-none' }]"
--> -->
<view class="ui-navbar-box"> <view class="ui-navbar-box">
<view <view class="ui-bar ss-p-x-20" :class="state.isDark ? 'text-white' : 'text-black'"
class="ui-bar ss-p-x-20" :style="[{ height: sys_navBar - sys_statusBar + 'px' }]">
:class="state.isDark ? 'text-white' : 'text-black'" <view class="icon-box ss-flex">
:style="[{ height: sys_navBar - sys_statusBar + 'px' }]" <view class="icon-button icon-button-left ss-flex ss-row-center" @tap="onClickLeft">
> <text class="sicon-back" v-if="hasHistory" />
<view class="icon-box ss-flex"> <text class="sicon-home" v-else />
<view class="icon-button icon-button-left ss-flex ss-row-center" @tap="onClickLeft"> </view>
<text class="sicon-back" v-if="hasHistory" /> <view class="line"></view>
<text class="sicon-home" v-else /> <view class="icon-button icon-button-right ss-flex ss-row-center" @tap="onClickRight">
</view> <text class="sicon-more" />
<view class="line"></view> </view>
<view class="icon-button icon-button-right ss-flex ss-row-center" @tap="onClickRight"> </view>
<text class="sicon-more" /> <slot name="center">
</view> <view class="center navbar-title">{{ title }}</view>
</view> </slot>
<slot name="center"> <!-- #ifdef MP -->
<view class="center navbar-title">{{ title }}</view> <view :style="[state.capsuleStyle]"></view>
</slot> <!-- #endif -->
<!-- #ifdef MP --> </view>
<view :style="[state.capsuleStyle]"></view> </view>
<!-- #endif --> </su-fixed>
</view>
</view>
</su-fixed>
</template> </template>
<script setup> <script setup>
/** /**
* 标题栏 - 基础组件navbar * 标题栏 - 基础组件navbar
* *
* @param {Number} zIndex = 100 - 层级 * @param {Number} zIndex = 100 - 层级
* @param {Boolean} back = true - 是否返回上一页 * @param {Boolean} back = true - 是否返回上一页
* @param {String} backtext = '' - 返回文本 * @param {String} backtext = '' - 返回文本
* @param {String} bg = 'bg-white' - 公共Class * @param {String} bg = 'bg-white' - 公共Class
* @param {String} status = '' - 状态栏颜色 * @param {String} status = '' - 状态栏颜色
* @param {Boolean} alway = true - 是否常驻 * @param {Boolean} alway = true - 是否常驻
* @param {Boolean} opacity = false - 是否开启透明渐变 * @param {Boolean} opacity = false - 是否开启透明渐变
* @param {Boolean} noFixed = false - 是否浮动 * @param {Boolean} noFixed = false - 是否浮动
* @param {String} ui = '' - 公共Class * @param {String} ui = '' - 公共Class
* @param {Boolean} capsule = false - 是否开启胶囊返回 * @param {Boolean} capsule = false - 是否开启胶囊返回
* @param {Boolean} stopBack = false - 是否禁用返回 * @param {Boolean} stopBack = false - 是否禁用返回
* @param {Boolean} placeholder = true - 是否开启占位 * @param {Boolean} placeholder = true - 是否开启占位
* @param {Object} bgStyles = {} - 背景样式 * @param {Object} bgStyles = {} - 背景样式
* *
*/ */
import { computed, reactive, onBeforeMount, ref } from 'vue'; import {
import sheep from '@/sheep'; computed,
import { onPageScroll } from '@dcloudio/uni-app'; reactive,
import { showMenuTools, closeMenuTools } from '@/sheep/hooks/useModal'; onBeforeMount,
ref
} from 'vue';
import sheep from '@/sheep';
import {
onPageScroll
} from '@dcloudio/uni-app';
import {
showMenuTools,
closeMenuTools
} from '@/sheep/hooks/useModal';
// 本地数据 // 本地数据
const state = reactive({ const state = reactive({
statusCur: '', statusCur: '',
capsuleStyle: {}, capsuleStyle: {},
capsuleBack: {}, capsuleBack: {},
isDark: true, isDark: true,
}); });
const sys_statusBar = sheep.$platform.device.statusBarHeight; const sys_statusBar = sheep.$platform.device.statusBarHeight;
const sys_navBar = sheep.$platform.navbar; const sys_navBar = sheep.$platform.navbar;
const props = defineProps({ const props = defineProps({
zIndex: {
type: Number,
default: 100,
},
title: { navbarbackgroundColor: {
//返回文本 type: String,
type: String, default: '',
default: '', },
}, zIndex: {
bg: { type: Number,
type: String, default: 100,
default: 'bg-white', },
},
// 常驻
alway: {
type: Boolean,
default: true,
},
opacity: {
//是否开启滑动渐变
type: Boolean,
default: true,
},
noFixed: {
//是否浮动
type: Boolean,
default: true,
},
ui: {
type: String,
default: '',
},
capsule: {
//是否开启胶囊返回
type: Boolean,
default: false,
},
stopBack: {
type: Boolean,
default: false,
},
placeholder: {
type: [Boolean],
default: false,
},
bgStyles: {
type: Object,
default() {},
},
});
const emits = defineEmits(['navback', 'clickLeft']); title: {
const hasHistory = sheep.$router.hasHistory(); //返回文本
type: String,
default: '',
},
bg: {
type: String,
default: 'bg-white',
},
// 常驻
alway: {
type: Boolean,
default: true,
},
opacity: {
//是否开启滑动渐变
type: Boolean,
default: true,
},
noFixed: {
//是否浮动
type: Boolean,
default: true,
},
ui: {
type: String,
default: '',
},
capsule: {
//是否开启胶囊返回
type: Boolean,
default: false,
},
stopBack: {
type: Boolean,
default: false,
},
placeholder: {
type: [Boolean],
default: false,
},
bgStyles: {
type: Object,
default () {},
},
});
onBeforeMount(() => { const emits = defineEmits(['navback', 'clickLeft']);
init(); const hasHistory = sheep.$router.hasHistory();
});
onPageScroll((e) => { onBeforeMount(() => {
let top = e.scrollTop; init();
state.isDark = top < sheep.$platform.navbar; });
});
function onClickLeft() { onPageScroll((e) => {
if (hasHistory) { let top = e.scrollTop;
sheep.$router.back(); state.isDark = top < sheep.$platform.navbar;
} else { });
sheep.$router.go('/pages/index/index');
}
emits('clickLeft');
}
function onClickRight() {
showMenuTools();
}
// 初始化 function onClickLeft() {
const init = () => { if (hasHistory) {
// #ifdef MP-ALIPAY sheep.$router.back();
my.hideAllFavoriteMenu(); } else {
// #endif sheep.$router.go('/pages/index/index');
state.capsuleStyle = { }
width: sheep.$platform.capsule.width + 'px', emits('clickLeft');
height: sheep.$platform.capsule.height + 'px', }
};
state.capsuleBack = state.capsuleStyle; function onClickRight() {
}; showMenuTools();
}
// 初始化
const init = () => {
// #ifdef MP-ALIPAY
my.hideAllFavoriteMenu();
// #endif
state.capsuleStyle = {
width: sheep.$platform.capsule.width + 'px',
height: sheep.$platform.capsule.height + 'px',
};
state.capsuleBack = state.capsuleStyle;
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.icon-box { .icon-box {
box-shadow: 0px 0px 4rpx rgba(51, 51, 51, 0.08), 0px 4rpx 6rpx 2rpx rgba(102, 102, 102, 0.12); box-shadow: 0px 0px 4rpx rgba(51, 51, 51, 0.08), 0px 4rpx 6rpx 2rpx rgba(102, 102, 102, 0.12);
border-radius: 30rpx; border-radius: 30rpx;
width: 134rpx; width: 134rpx;
height: 56rpx; height: 56rpx;
margin-left: 8rpx; margin-left: 8rpx;
border: 1px solid rgba(#fff, 0.4); border: 1px solid rgba(#fff, 0.4);
.line {
width: 2rpx;
height: 24rpx;
background: #e5e5e7;
}
.sicon-back {
font-size: 32rpx;
}
.sicon-home {
font-size: 32rpx;
}
.sicon-more {
font-size: 32rpx;
}
.icon-button {
width: 67rpx;
height: 56rpx;
&-left:hover {
background: rgba(0, 0, 0, 0.16);
border-radius: 30rpx 0px 0px 30rpx;
}
&-right:hover {
background: rgba(0, 0, 0, 0.16);
border-radius: 0px 30rpx 30rpx 0px;
}
}
}
.navbar-title {
font-size: 36rpx;
}
.tools-icon {
font-size: 40rpx;
}
.ui-navbar-box {
background-color: transparent;
width: 100%;
.ui-bar { .line {
position: relative; width: 2rpx;
z-index: 2; height: 24rpx;
white-space: nowrap; background: #e5e5e7;
display: flex; }
position: relative;
align-items: center;
justify-content: space-between;
.left { .sicon-back {
@include flex-bar; font-size: 32rpx;
}
.back { .sicon-home {
@include flex-bar; font-size: 32rpx;
}
.back-icon { .sicon-more {
@include flex-center; font-size: 32rpx;
width: 56rpx; }
height: 56rpx;
margin: 0 10rpx;
font-size: 46rpx !important;
&.opacityIcon { .icon-button {
position: relative; width: 67rpx;
border-radius: 50%; height: 56rpx;
background-color: rgba(127, 127, 127, 0.5);
&::after { &-left:hover {
content: ''; background: rgba(0, 0, 0, 0.16);
display: block; border-radius: 30rpx 0px 0px 30rpx;
position: absolute; }
height: 200%;
width: 200%;
left: 0;
top: 0;
border-radius: inherit;
transform: scale(0.5);
transform-origin: 0 0;
opacity: 0.1;
border: 1px solid currentColor;
pointer-events: none;
}
&::before { &-right:hover {
transform: scale(0.9); background: rgba(0, 0, 0, 0.16);
} border-radius: 0px 30rpx 30rpx 0px;
} }
} }
}
/* #ifdef MP-ALIPAY */ .navbar-title {
._icon-back { font-size: 36rpx;
opacity: 0; }
}
/* #endif */ .tools-icon {
} font-size: 40rpx;
}
.capsule { .ui-navbar-box {
@include flex-bar; background-color: transparent;
border-radius: 100px; width: 100%;
position: relative;
&.dark { .ui-bar {
background-color: rgba(255, 255, 255, 0.5); position: relative;
} z-index: 2;
white-space: nowrap;
display: flex;
position: relative;
align-items: center;
justify-content: space-between;
&.light { .left {
background-color: rgba(0, 0, 0, 0.15); @include flex-bar;
}
&::after { .back {
content: ''; @include flex-bar;
display: block;
position: absolute;
height: 60%;
width: 1px;
left: 50%;
top: 20%;
background-color: currentColor;
opacity: 0.1;
pointer-events: none;
}
&::before { .back-icon {
content: ''; @include flex-center;
display: block; width: 56rpx;
position: absolute; height: 56rpx;
height: 200%; margin: 0 10rpx;
width: 200%; font-size: 46rpx !important;
left: 0;
top: 0;
border-radius: inherit;
transform: scale(0.5);
transform-origin: 0 0;
opacity: 0.1;
border: 1px solid currentColor;
pointer-events: none;
}
.capsule-back, &.opacityIcon {
.capsule-home { position: relative;
@include flex-center; border-radius: 50%;
flex: 1; background-color: rgba(127, 127, 127, 0.5);
}
&.isFristPage { &::after {
.capsule-back, content: '';
&::after { display: block;
display: none; position: absolute;
} height: 200%;
} width: 200%;
} left: 0;
} top: 0;
border-radius: inherit;
transform: scale(0.5);
transform-origin: 0 0;
opacity: 0.1;
border: 1px solid currentColor;
pointer-events: none;
}
.right { &::before {
@include flex-bar; transform: scale(0.9);
}
}
}
.right-content { /* #ifdef MP-ALIPAY */
@include flex; ._icon-back {
flex-direction: row-reverse; opacity: 0;
} }
}
.center { /* #endif */
@include flex-center; }
text-overflow: ellipsis;
// text-align: center;
position: absolute;
left: 50%;
transform: translateX(-50%);
.image { .capsule {
display: block; @include flex-bar;
height: 36px; border-radius: 100px;
max-width: calc(100vw - 200px); position: relative;
}
}
}
.ui-bar-bg { &.dark {
position: absolute; background-color: rgba(255, 255, 255, 0.5);
width: 100%; }
height: 100%;
top: 0; &.light {
z-index: 1; background-color: rgba(0, 0, 0, 0.15);
pointer-events: none; }
}
} &::after {
</style> content: '';
display: block;
position: absolute;
height: 60%;
width: 1px;
left: 50%;
top: 20%;
background-color: currentColor;
opacity: 0.1;
pointer-events: none;
}
&::before {
content: '';
display: block;
position: absolute;
height: 200%;
width: 200%;
left: 0;
top: 0;
border-radius: inherit;
transform: scale(0.5);
transform-origin: 0 0;
opacity: 0.1;
border: 1px solid currentColor;
pointer-events: none;
}
.capsule-back,
.capsule-home {
@include flex-center;
flex: 1;
}
&.isFristPage {
.capsule-back,
&::after {
display: none;
}
}
}
}
.right {
@include flex-bar;
.right-content {
@include flex;
flex-direction: row-reverse;
}
}
.center {
@include flex-center;
text-overflow: ellipsis;
// text-align: center;
position: absolute;
left: 50%;
transform: translateX(-50%);
.image {
display: block;
height: 36px;
max-width: calc(100vw - 200px);
}
}
}
.ui-bar-bg {
position: absolute;
width: 100%;
height: 100%;
top: 0;
z-index: 1;
pointer-events: none;
}
}
</style>

10
sheep/ui/su-navbar/su-navbar.vue
View File

@ -2,7 +2,7 @@
<template> <template>
<view class="uni-navbar" :class="{ 'uni-dark': dark }"> <view class="uni-navbar" :class="{ 'uni-dark': dark }">
<view :style="{ <view :style="{
background: backgroundColor, background: backgroundColor || navbarbackgroundColor,
}" }"
:class="{ :class="{
'uni-navbar--fixed': fixed, 'uni-navbar--fixed': fixed,
@ -10,7 +10,7 @@
'uni-navbar--border': border, 'uni-navbar--border': border,
}" class="uni-navbar__content"> }" class="uni-navbar__content">
<view class="fixed-bg" :class="[opacity ? '' : opacityBgUi]"></view> <view class="fixed-bg" :class="[opacity ? '' : opacityBgUi]"></view>
<su-status-bar v-if="statusBar" :navBg = "navBg" /> <su-status-bar v-if="statusBar" :navBg = "navBg"/>
<view :style="{ <view :style="{
color: themeColor, color: themeColor,
height: navbarHeight, height: navbarHeight,
@ -111,6 +111,10 @@
const emits = defineEmits(['clickLeft', 'clickRight', 'clickTitle', 'search']); const emits = defineEmits(['clickLeft', 'clickRight', 'clickTitle', 'search']);
const props = defineProps({ const props = defineProps({
navbarbackgroundColor:{
type: String,
default: '',
},
navBg: { navBg: {
type: Boolean, type: Boolean,
default: false, default: false,
@ -202,7 +206,7 @@
defaultSearch: { defaultSearch: {
type: String, type: String,
default: '', default: '',
}, }
}); });
const capsuleStyle = computed(() => { const capsuleStyle = computed(() => {

6
sheep/ui/su-status-bar/su-status-bar.vue
View File

@ -1,6 +1,6 @@
<!-- 自定义状态栏 --> <!-- 自定义状态栏 -->
<template> <template>
<view :style="{ height: statusBarHeight }" class="uni-status-bar" :class="navBg? 'ss' : ''"> <view :style="{ height: statusBarHeight,background: navbarbackgroundColor }" class="uni-status-bar" :class="navBg? 'ss' : ''" >
<slot /> <slot />
</view> </view>
</template> </template>
@ -11,6 +11,10 @@
navBg: { navBg: {
type: Boolean, type: Boolean,
default: false, default: false,
},
navbarbackgroundColor:{
type: String,
default: '',
} }
}) })
const statusBarHeight = sheep.$platform.device.statusBarHeight - 2 + 'px'; const statusBarHeight = sheep.$platform.device.statusBarHeight - 2 + 'px';