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

提交优化 #9

Merged
root merged 6 commits from Branch_ccc into master 2024-10-22 18:25:38 +08:00
Conversation 0 Commits 6 Files Changed 32 +2860 -1364
30 changed files with 2860 additions and 1364 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 7c755a2171 - Show all commits

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';