初始化
This commit is contained in:
魏啾
337
pages/index/components/clothing/index.vue
Normal file
337
pages/index/components/clothing/index.vue
Normal file
@@ -0,0 +1,337 @@
|
||||
<template>
|
||||
<view class="index">
|
||||
<!-- <view class="contentclothingimage" v-if="list.theme_re.img != null">
|
||||
<image :src="list.theme_re.img" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="contentclothingbox" v-if="list.theme_re.img != null">
|
||||
<view class="fourcontents">
|
||||
<u-scroll-list indicatorActiveColor="#6C6E8D" :indicator="false">
|
||||
<view class="scrollfourcontents" v-for="(item, index) in list.theme_re.data" :key="index"
|
||||
@click="eeInfoseries(item)">
|
||||
<view class="scrollfourcontenttitems flex-colum" :style="index == 0 ?'margin-left: 0;':''">
|
||||
<image class="scrolltowcontentitem_images" :src="item.host_img" mode="aspectFill">
|
||||
</image>
|
||||
<view class="scrolltowcontentitem_ones">
|
||||
{{item.series}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-scroll-list>
|
||||
</view>
|
||||
</view>
|
||||
<view class="contentclothingimage" v-if="list.new.img != null">
|
||||
<image :src="list.new.img" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="contentclothingboxoone" v-if="list.new.img != null">
|
||||
<view class="fourcontentsoneitem flex-between" v-for="(item,index) in list.new.data" :key="index"
|
||||
@click="mallInfoInfo(item)">
|
||||
<image class="fourcontentsoneitemimage" :src="item.host_img" mode="aspectFill"></image>
|
||||
<view class="fourcontentsoneitemtext flex-colum-start">
|
||||
<view class="fourcontentsoneitemtextone">
|
||||
{{item.title}}
|
||||
</view>
|
||||
<view class="fourcontentsoneitemtexttow">
|
||||
￥{{item.price}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="contentclothingimageclassimagebuya" v-if="list.discount">
|
||||
<image :src="list.discount" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="contentclothingimageclass flex-center">
|
||||
<image class="contentclothingclassimage" src="@/static/4.png" mode="aspectFill"></image>
|
||||
<view class="contentclothingimageclassbox flex-between">
|
||||
<view class="contentclothingimageclassboxitem flex-center" v-for="(item,index) in 3" :key="index">
|
||||
<view class="contentclothingimageclassboxitemone">
|
||||
50
|
||||
</view>
|
||||
<view class="contentclothingimageclassboxitemtow flex-colum-start">
|
||||
<text>RMB</text>
|
||||
<text>满300元使用</text>
|
||||
</view>
|
||||
<view class="contentclothingimageclassboxitemabsolute">
|
||||
领
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="contentclothingboxoone">
|
||||
<view class="fourcontentsoneitemtow flex-between">
|
||||
<view class="fourcontentsoneitemtowitem" v-for="(item,index) in list" :key="index"
|
||||
@click="mallInfoInfo(item)">
|
||||
<image class="fourcontentsoneitemtowitemimage" :src="item.host_img" mode="aspectFill"></image>
|
||||
<view class="fourcontentsoneitemtowitemone">
|
||||
{{item.title}}
|
||||
</view>
|
||||
<view class="fourcontentsoneitemtowitemtow">
|
||||
￥{{item.price}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
bgbutton: {
|
||||
type: String,
|
||||
default: '#fff'
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
mallInfoInfo(e) { //查看订单详情
|
||||
if (e.spec_type == 1) {
|
||||
uni.pro.navigateTo('mall/mallInfo', {
|
||||
id: e.id,
|
||||
})
|
||||
} else {
|
||||
uni.pro.navigateTo('mall/mallInfos', {
|
||||
id: e.id,
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.index {
|
||||
width: 100%;
|
||||
|
||||
.contentclothingimageclassimagebuya {
|
||||
width: auto;
|
||||
margin: 48rpx 0;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.contentclothingimageclass {
|
||||
margin-top: 50rpx;
|
||||
|
||||
.contentclothingclassimage {
|
||||
width: 224.35rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.contentclothingimageclassbox {
|
||||
position: relative;
|
||||
margin-top: 18rpx;
|
||||
width: 100%;
|
||||
background: #ABAD98;
|
||||
border-radius: 18rpx;
|
||||
border: 2rpx solid #404136;
|
||||
padding: 28rpx 18rpx;
|
||||
|
||||
.contentclothingimageclassboxitem:nth-child(1) {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.contentclothingimageclassboxitem {
|
||||
position: relative;
|
||||
border-left: 1rpx dashed #fff;
|
||||
padding: 0 18rpx;
|
||||
|
||||
.contentclothingimageclassboxitemone {
|
||||
font-size: 48rpx;
|
||||
font-family: Roboto, Roboto;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.contentclothingimageclassboxitemtow {
|
||||
margin-left: 10rpx;
|
||||
|
||||
text:nth-child(1) {
|
||||
font-size: 16rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
text:nth-child(2) {
|
||||
font-size: 20rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
}
|
||||
|
||||
.contentclothingimageclassboxitemabsolute {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 18rpx;
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
text-align: center;
|
||||
font-size: 16rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
background: #7e8a83;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.contentclothingimageclassbox::after {
|
||||
z-index: 10;
|
||||
position: absolute;
|
||||
content: '';
|
||||
display: inline-block;
|
||||
left: -11px;
|
||||
bottom: 50%;
|
||||
transform: translateY(50%);
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border-radius: 0 11px 11px 0;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.contentclothingimageclassbox::before {
|
||||
z-index: 10;
|
||||
position: absolute;
|
||||
content: '';
|
||||
display: inline-block;
|
||||
right: -11px;
|
||||
bottom: 50%;
|
||||
transform: translateY(50%);
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border-radius: 11px 0 0 11px;
|
||||
background: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.contentclothingimage {
|
||||
width: 130rpx;
|
||||
height: 52rpx;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.contentclothingbox {
|
||||
.fourcontents {
|
||||
.scrollfourcontents {
|
||||
padding: 22rpx 0;
|
||||
|
||||
.scrollfourcontenttitems {
|
||||
width: 246rpx;
|
||||
height: 296rpx;
|
||||
margin-left: 30rpx;
|
||||
position: relative;
|
||||
|
||||
.scrolltowcontentitem_images {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 18rpx;
|
||||
}
|
||||
|
||||
.scrolltowcontentitem_ones {
|
||||
position: absolute;
|
||||
padding: 8rpx 10rpx;
|
||||
bottom: 12rpx;
|
||||
left: 14rpx;
|
||||
background: rgba(0, 0, 0, 0.32);
|
||||
border-radius: 20rpx;
|
||||
font-size: 18rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.contentclothingboxoone {
|
||||
.fourcontentsoneitem {
|
||||
width: 100%;
|
||||
margin-top: 24rpx;
|
||||
|
||||
.fourcontentsoneitemimage {
|
||||
width: 278rpx;
|
||||
border-radius: 18rpx;
|
||||
height: 194rpx;
|
||||
}
|
||||
|
||||
.fourcontentsoneitemtext {
|
||||
flex: 1;
|
||||
height: 194rpx;
|
||||
margin-left: 10rpx;
|
||||
|
||||
.fourcontentsoneitemtextone {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.fourcontentsoneitemtexttow {
|
||||
margin-top: 20rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
}
|
||||
}
|
||||
.fourcontentsoneitemtow {
|
||||
width: 100%;
|
||||
.fourcontentsoneitemtowitem:nth-child(1) {
|
||||
margin-top: 24rpx;
|
||||
}
|
||||
.fourcontentsoneitemtowitem:nth-child(2) {
|
||||
margin-top: 24rpx;
|
||||
}
|
||||
.fourcontentsoneitemtowitem {
|
||||
margin-top: 32rpx;
|
||||
width: 330rpx;
|
||||
|
||||
.fourcontentsoneitemtowitemimage {
|
||||
border-radius: 18rpx;
|
||||
width: 330rpx;
|
||||
height: 356rpx;
|
||||
}
|
||||
|
||||
.fourcontentsoneitemtowitemone {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-top: 16rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.fourcontentsoneitemtowitemtow {
|
||||
margin-top: 10rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
69
pages/index/components/clothingmetals/index.vue
Normal file
69
pages/index/components/clothingmetals/index.vue
Normal file
@@ -0,0 +1,69 @@
|
||||
<template>
|
||||
<view class="">
|
||||
<view class="clothingmetals flex-between">
|
||||
<view class="clothingmetalsitem flex-colum" v-for="(item,index) in list" :key="index"
|
||||
@click="eeInfoseries(item)">
|
||||
<view class="clothingmetalsitemimage">
|
||||
<image :src="item.img" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="clothingmetalsitem_text">
|
||||
{{item.title}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
data: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
|
||||
},
|
||||
methods: {
|
||||
eeInfoseries(e) {
|
||||
uni.pro.navigateTo('mall/series', {
|
||||
id: e.id,
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.clothingmetals {
|
||||
padding: 32rpx 28rpx 0rpx 28rpx;
|
||||
.clothingmetalsitem {
|
||||
.clothingmetalsitemimage {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
background: #fafafa;
|
||||
border-radius: 50%;
|
||||
image {
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
.clothingmetalsitem_text {
|
||||
margin-top: 18rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
104
pages/index/components/employees/index.vue
Normal file
104
pages/index/components/employees/index.vue
Normal file
@@ -0,0 +1,104 @@
|
||||
<template>
|
||||
<view class="">
|
||||
<view class="towcontent">
|
||||
<u-scroll-list :indicatorActiveColor="bgbutton" indicatorWidth='40' :indicator='true'>
|
||||
<view class="scrolltowcontent" v-for="(item, index) in list" :key="index" @click="click1(item,index)">
|
||||
<view class="scrolltowcontentitem flex-colum">
|
||||
<image class="scrolltowcontentitem_image" :src="item.avatar" mode="aspectFill"></image>
|
||||
<view class="scrolltowcontentitem_one">
|
||||
{{item.nickname}}
|
||||
</view>
|
||||
<view class="scrolltowcontentitem_tow">
|
||||
{{item.position}}
|
||||
</view>
|
||||
<view class="scrolltowcontentitem_there">
|
||||
预约
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-scroll-list>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
bgbutton: {
|
||||
type: String,
|
||||
default: '#fff'
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
click1(e) {
|
||||
uni.pro.navigateTo('order/orderInfos', {
|
||||
id: e.id,
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.towcontent {
|
||||
margin-left: 8rpx;
|
||||
|
||||
.scrolltowcontent {
|
||||
padding: 24rpx 0;
|
||||
|
||||
.scrolltowcontentitem {
|
||||
margin-left: 24rpx;
|
||||
padding: 16rpx 42rpx;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 4rpx 6rpx 2rpx rgba(0, 0, 0, 0.11);
|
||||
border-radius: 18rpx;
|
||||
|
||||
.scrolltowcontentitem_image {
|
||||
width: 116rpx;
|
||||
height: 116rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.scrolltowcontentitem_one {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
text-align: center;
|
||||
margin-top: 6rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.scrolltowcontentitem_tow {
|
||||
margin-top: 2rpx;
|
||||
font-size: 22rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.scrolltowcontentitem_there {
|
||||
margin-top: 12rpx;
|
||||
padding: 4rpx 28rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
background: var(--bg-color-button);
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
229
pages/index/components/flashsale/index.vue
Normal file
229
pages/index/components/flashsale/index.vue
Normal file
@@ -0,0 +1,229 @@
|
||||
<template>
|
||||
<view class="index">
|
||||
<view class="onecontenttowone flex-start">
|
||||
<view class="onecontenttowone_one">
|
||||
{{title}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="indexbox">
|
||||
<view class="indexboxitem flex-start" v-for="(item,index) in list" :key="index" @click="mallInfoInfo(item)">
|
||||
<image class="indexboxitemimage" :src="item.host_img" mode="aspectFill"></image>
|
||||
<view class="indexboxitemleft flex-colum-start">
|
||||
<view class="indexboxitemleftone">
|
||||
{{item.title}}
|
||||
</view>
|
||||
<view class="indexboxitemlefttow">
|
||||
{{item.intro}}
|
||||
</view>
|
||||
<view class="indexboxitemleftthere flex-colum-start">
|
||||
<view class="indexboxitemlefttheretext flex-start">
|
||||
<view class="indexboxitemlefttheretextone">
|
||||
<text>¥</text>
|
||||
<text>{{item.price}}</text>
|
||||
</view>
|
||||
<view class="indexboxitemlefttheretexttow">
|
||||
¥{{item.y_price}}
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="indexboxitemleftthere_countdown flex-start">
|
||||
<text class="indexboxitemleftthere_countdowntext">倒计时:</text>
|
||||
<view v-if="item.end_times == 0" class="indexboxitemleftthere_countdowntexts">
|
||||
已失效
|
||||
</view>
|
||||
<view v-else class="indexboxitemleftthere_countdowntexts">
|
||||
<uni-countdown @timeup="updateCity" :day="item.end_times.d" :hour="item.end_times.h"
|
||||
:minute="item.end_times.m" :second="item.end_times.s"
|
||||
:indexs='index'></uni-countdown>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uniCountdown from '@/components/countdown.vue'
|
||||
export default {
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default () {
|
||||
return [
|
||||
|
||||
]
|
||||
}
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: '银收客'
|
||||
},
|
||||
|
||||
},
|
||||
components: {
|
||||
uniCountdown
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
updateCity(data) {
|
||||
this.list[data].end_times = 0;
|
||||
this.$forceUpdate();
|
||||
},
|
||||
mallInfoInfo(e) { //查看订单详情
|
||||
if (e.end_times != 0) {
|
||||
if (e.spec_type == 1) {
|
||||
uni.pro.navigateTo('mall/mallInfo', {
|
||||
id: e.id,
|
||||
})
|
||||
} else {
|
||||
uni.pro.navigateTo('mall/mallInfos', {
|
||||
id: e.id,
|
||||
})
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '请购时间以结束',
|
||||
icon: "none"
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.index {
|
||||
width: 100%;
|
||||
padding: 32rpx 32rpx 0 32rpx;
|
||||
|
||||
.onecontenttowone::before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
width: 4rpx;
|
||||
height: 20rpx;
|
||||
background: var(--bg-color-buttonone);
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
|
||||
.onecontenttowone {
|
||||
.onecontenttowone_one {
|
||||
margin-left: 8rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
}
|
||||
|
||||
.indexbox {
|
||||
margin-bottom: 24rpx;
|
||||
|
||||
.indexboxitem {
|
||||
margin-top: 24rpx;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
|
||||
border-radius: 18rpx;
|
||||
padding: 16rpx;
|
||||
|
||||
.indexboxitemimage {
|
||||
width: 220rpx;
|
||||
height: 220rpx;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
.indexboxitemleft {
|
||||
flex: auto;
|
||||
height: 220rpx;
|
||||
margin-left: 24rpx;
|
||||
justify-content: flex-start;
|
||||
|
||||
.indexboxitemleftone {
|
||||
width: 400rpx;
|
||||
font-size: 32rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-family: Roboto, Roboto;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.indexboxitemlefttow {
|
||||
width: 400rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-top: 16rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.indexboxitemleftthere {
|
||||
margin-top: 34rpx;
|
||||
padding-left: 26rpx;
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
background: url(@/static/imge/flashsale.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
.indexboxitemlefttheretext {
|
||||
.indexboxitemlefttheretextone {
|
||||
text {
|
||||
font-family: SourceHanSansCN-Bold, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #FF5053;
|
||||
}
|
||||
|
||||
text:nth-child(2) {
|
||||
font-weight: bold;
|
||||
font-size: 34rpx;
|
||||
}
|
||||
|
||||
text:nth-child(1) {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.indexboxitemlefttheretexttow {
|
||||
margin-left: 12rpx;
|
||||
font-size: 20rpx;
|
||||
font-family: SourceHanSansCN-Regular, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
color: #999999;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
}
|
||||
|
||||
.indexboxitemleftthere_countdown {
|
||||
.indexboxitemleftthere_countdowntext {
|
||||
font-family: Roboto, Roboto;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
font-size: 18rpx;
|
||||
}
|
||||
|
||||
.indexboxitemleftthere_countdowntexts {
|
||||
font-family: Roboto, Roboto;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
margin-left: 16rpx;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
100
pages/index/components/flower/index.vue
Normal file
100
pages/index/components/flower/index.vue
Normal file
@@ -0,0 +1,100 @@
|
||||
<template>
|
||||
<view class="">
|
||||
<view class="clothingmetals flex-between">
|
||||
<view class="clothingmetalsitem flex-colum" v-for="(item,index) in list" :key="index"
|
||||
@click="eeInfoseries(item)">
|
||||
<image class="clothingmetalsitemimage" :src="item.img" mode="aspectFill"></image>
|
||||
<view class="clothingmetalsitem_text flex-colum-start">
|
||||
<text>{{item.title}}</text>
|
||||
<text>{{item.english}}</text>
|
||||
</view>
|
||||
<view class="clothingmetalsitem_box flex-center">
|
||||
<text>立即前往</text>
|
||||
<u-icon name="arrow-right" color="##b1b1b1" size="8"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
data: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
|
||||
},
|
||||
methods: {
|
||||
eeInfoseries(e) {
|
||||
uni.pro.navigateTo('mall/series', {
|
||||
id: e.id,
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.clothingmetals {
|
||||
padding: 32rpx 28rpx 0rpx 28rpx;
|
||||
|
||||
.clothingmetalsitem {
|
||||
position: relative;
|
||||
width: 48%;
|
||||
height: 194rpx;
|
||||
|
||||
.clothingmetalsitemimage {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 194rpx;
|
||||
}
|
||||
|
||||
.clothingmetalsitem_text {
|
||||
position: absolute;
|
||||
left: 20rpx;
|
||||
top: 20rpx;
|
||||
text:nth-child(1) {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #679D96;
|
||||
}
|
||||
text:nth-child(2) {
|
||||
margin-top: 2rpx;
|
||||
font-size: 16rpx;
|
||||
font-family: Roboto, Roboto;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
.clothingmetalsitem_box{
|
||||
position: absolute;
|
||||
left: 20rpx;
|
||||
text-align: center;
|
||||
bottom: 20rpx;
|
||||
width: 128rpx;
|
||||
height: 40rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 20rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
281
pages/index/components/index.vue
Normal file
281
pages/index/components/index.vue
Normal file
@@ -0,0 +1,281 @@
|
||||
<template>
|
||||
<view class="index">
|
||||
<!-- <navbar :Background='Background' :navtitle='navtitle' :navboxshow="navboxshow" @fatherMethod='fatherMethod'>
|
||||
</navbar> -->
|
||||
<view class="content">
|
||||
<view class="content_item flex-between" v-for="(item,index) in list" :key="index" @click="eeInfo(item)">
|
||||
<view class="content_itemone flex-start">
|
||||
<image :src="item.avatar" mode="aspectFill"></image>
|
||||
<view class="content_itemonetext flex-colum-start">
|
||||
<view class="content_itemonetextone">
|
||||
{{item.title}}
|
||||
</view>
|
||||
<!-- <view class="content_itemonetexttow">
|
||||
<text>5.0分</text>
|
||||
<text>销量</text>
|
||||
</view> -->
|
||||
<view class="content_itemonetextthere">
|
||||
{{item.label}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content_itemtow">
|
||||
{{item.distance}}
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="list.length==0 && is_end == true" class="flex-colum">
|
||||
<image :src="bgnothave" mode="aspectFill">
|
||||
</image>
|
||||
</view>
|
||||
<u-loadmore :status="form.status" />
|
||||
|
||||
</view>
|
||||
<bottombbar :valuebbar='0'></bottombbar>
|
||||
</view>
|
||||
</template>
|
||||
<!-- https://cdn.uviewui.com/uview/resources/3c56cbc6216b47db61e37090fdb6619.jpg -->
|
||||
<script>
|
||||
import navbar from '@/components/navbar.vue'
|
||||
import bottombbar from '@/components/bottombbar.vue'
|
||||
export default {
|
||||
components: {
|
||||
navbar,
|
||||
bottombbar
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
navtitle: '美发店', //名称
|
||||
navboxshow: '0', //显示
|
||||
Background: '#fff',
|
||||
list: [],
|
||||
bgnothave:uni.getStorageSync('bgnothave'),
|
||||
is_end: false,
|
||||
lng: '108.95399',
|
||||
lat: '34.30997',
|
||||
form: {
|
||||
page: 1,
|
||||
status: 'loadmore',
|
||||
},
|
||||
}
|
||||
},
|
||||
async onLoad(e) {
|
||||
await this.$onLaunched
|
||||
// #ifdef MP-WEIXIN
|
||||
this.getAuthorizeInfo() //获取位置请求 金纬度
|
||||
// #endif
|
||||
uni.pro.navigateTo('index/indexInfo')
|
||||
if (!uni.getStorageSync('loginuser')) { //未登录状态
|
||||
this.userlogin()
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
|
||||
this.positionindex()
|
||||
},
|
||||
onReachBottom() {
|
||||
this.positionindex()
|
||||
},
|
||||
methods: {
|
||||
// 用户授权
|
||||
getAuthorizeInfo() {
|
||||
uni.authorize({
|
||||
scope: 'scope.userLocation',
|
||||
success: () => {
|
||||
// 允许授权
|
||||
this.getLocationInfo();
|
||||
},
|
||||
fail: () => {
|
||||
// 拒绝授权
|
||||
this.openConfirm();
|
||||
}
|
||||
})
|
||||
},
|
||||
eeInfo(e) { //跳转
|
||||
console.log(e)
|
||||
uni.cache.set('store_id', e.id) // 判断显示哪家的作品
|
||||
uni.cache.set('details_id', e)
|
||||
uni.pro.navigateTo('index/indexInfo')
|
||||
},
|
||||
// 获取地理位置
|
||||
getLocationInfo() {
|
||||
uni.getLocation({
|
||||
type: 'wgs84',
|
||||
success: (res) => {
|
||||
this.lng = res.longitude
|
||||
this.lat = res.latitude
|
||||
this.positionindex()
|
||||
},
|
||||
fail: (err) => {
|
||||
this.positionindex()
|
||||
console.log(err, '获取错误')
|
||||
}
|
||||
});
|
||||
},
|
||||
// 再次获取授权。当用户第一次拒绝后再次请求授权
|
||||
openConfirm() {
|
||||
uni.showModal({
|
||||
title: '请求授权当前位置',
|
||||
content: '需要获取您的地理位置，请确认授权',
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.openSetting(); // 打开地图权限设置
|
||||
} else if (res.cancel) {
|
||||
uni.showToast({
|
||||
title: '你拒绝了授权，无法获得周边位置信息',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
this.positionindex()
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
async userlogin() {
|
||||
let res = await this.api.userlogin({
|
||||
code: uni.cache.get('weixincode'),
|
||||
// #ifdef H5
|
||||
code: '0c3KOzFa1lkuMF0enAHa1Eu2xG1KOzFJ'
|
||||
// #endif
|
||||
})
|
||||
try {
|
||||
if (res) {
|
||||
uni.cache.set('loginuser', res);
|
||||
this.positionindex()
|
||||
} else {
|
||||
uni.cache.set('loginuser', 0);
|
||||
}
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
},
|
||||
async positionindex() {
|
||||
let res = await this.api.positionindex({
|
||||
lng: this.lng,
|
||||
lat: this.lat,
|
||||
page: this.form.page,
|
||||
})
|
||||
if (res.length == 0) {
|
||||
this.is_end = true
|
||||
this.form.status = 'nomore'
|
||||
return false;
|
||||
} else {
|
||||
this.form.status = 'loading';
|
||||
this.form.page = ++this.form.page;
|
||||
setTimeout(() => {
|
||||
this.list = [...this.list, ...res];
|
||||
if (res.length == 10) {
|
||||
this.form.status = 'loading';
|
||||
} else {
|
||||
this.is_end = true;
|
||||
this.form.status = 'nomore';
|
||||
}
|
||||
}, 500)
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #f9f9f9;
|
||||
}
|
||||
|
||||
.index {
|
||||
.content {
|
||||
padding: 0 28rpx;
|
||||
|
||||
.content_item {
|
||||
border-radius: 12rpx;
|
||||
background: #fff;
|
||||
margin-top: 20rpx;
|
||||
padding: 28rpx 24rpx;
|
||||
|
||||
.content_itemone {
|
||||
image {
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.content_itemonetext {
|
||||
width: 300rpx;
|
||||
margin-left: 16rpx;
|
||||
height: 140rpx;
|
||||
justify-content: space-evenly;
|
||||
|
||||
.content_itemonetextone {
|
||||
max-width: 300rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.content_itemonetexttow {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
|
||||
text:nth-child(1) {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #f37f2f;
|
||||
}
|
||||
|
||||
text:nth-child(2) {
|
||||
margin-left: 20rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #585858;
|
||||
}
|
||||
}
|
||||
|
||||
.content_itemonetextthere {
|
||||
max-width: 300rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 24rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: 500;
|
||||
padding: 5rpx 8rpx;
|
||||
border-radius: 10rpx;
|
||||
border: 1rpx solid #b1b1b1;
|
||||
color: #b1b1b1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content_itemtow {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.flex-colum_image {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
|
||||
text {
|
||||
margin-top: 30rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
97
pages/index/components/popula/index.vue
Normal file
97
pages/index/components/popula/index.vue
Normal file
@@ -0,0 +1,97 @@
|
||||
<template>
|
||||
<view class="">
|
||||
<view class="fourcontent">
|
||||
<u-scroll-list indicatorActiveColor="#6C6E8D" indicatorWidth='40' :indicator="false">
|
||||
<view class="scrollfourcontent" v-for="(item, index) in list" :key="index"
|
||||
@click="eeInfo(item)">
|
||||
<view class="scrollfourcontenttitem flex-colum">
|
||||
<image class="scrolltowcontentitem_image" :src="item.img" mode="aspectFill"></image>
|
||||
<view class="scrolltowcontentitem_one">
|
||||
{{item.title}}
|
||||
</view>
|
||||
<view class="scrolltowcontentitem_tow">
|
||||
{{item.price}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-scroll-list>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
data: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
|
||||
},
|
||||
methods: {
|
||||
eeInfo(e) { //热门项目
|
||||
uni.pro.navigateTo('order/orderInfo', {
|
||||
id: e.id,
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.fourcontent {
|
||||
margin-left: 8rpx;
|
||||
|
||||
.scrollfourcontent {
|
||||
padding: 22rpx 0;
|
||||
|
||||
.scrollfourcontenttitem {
|
||||
width: 280rpx;
|
||||
margin-left: 30rpx;
|
||||
align-items: flex-start;
|
||||
padding-bottom: 16rpx;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 4rpx 6rpx 2px rgba(0, 0, 0, 0.16);
|
||||
border-radius: 18rpx;
|
||||
|
||||
.scrolltowcontentitem_image {
|
||||
border-top-left-radius: 18rpx;
|
||||
border-top-right-radius: 18rpx;
|
||||
width: 280rpx;
|
||||
height: 292rpx;
|
||||
}
|
||||
|
||||
.scrolltowcontentitem_one {
|
||||
padding-left: 16rpx;
|
||||
padding-top: 16rpx;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #28292D;
|
||||
}
|
||||
|
||||
.scrolltowcontentitem_tow {
|
||||
margin-left: 16rpx;
|
||||
margin-top: 8rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Roboto-Bold, Roboto;
|
||||
font-weight: bold;
|
||||
color: #F45C4C;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
95
pages/index/components/recommend/index.vue
Normal file
95
pages/index/components/recommend/index.vue
Normal file
@@ -0,0 +1,95 @@
|
||||
<template>
|
||||
<view class="index">
|
||||
<view class="onecontenttowone flex-start">
|
||||
<view class="onecontenttowone_one">
|
||||
{{title}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="indexbox flex-between">
|
||||
<image class="indexboxone" @click="eeInfoseries(list[0].mother_id)" :src="list[0].mother_img" mode="widthFix"></image>
|
||||
<view class="flex-colum-start">
|
||||
<image class="indexboxtow" @click="eeInfoseries(list[1].mother_id)" :src="list[1].mother_img" mode="widthFix"></image>
|
||||
<image class="indexboxthere" @click="eeInfoseries(list[2].mother_id)" :src="list[2].mother_img" mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: '银收客'
|
||||
},
|
||||
|
||||
},
|
||||
methods: {
|
||||
eeInfoseries(e) {
|
||||
uni.pro.navigateTo('mall/series', {
|
||||
id: e.id,
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.index {
|
||||
width: 100%;
|
||||
padding: 32rpx 32rpx 0 32rpx;
|
||||
|
||||
.onecontenttowone::before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
width: 4rpx;
|
||||
height: 20rpx;
|
||||
background: var(--bg-color-buttonone);
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
|
||||
.onecontenttowone {
|
||||
.onecontenttowone_one {
|
||||
margin-left: 8rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
}
|
||||
|
||||
.indexbox {
|
||||
margin-top: 24rpx;
|
||||
|
||||
.indexboxone {
|
||||
width: 336rpx;
|
||||
height: 400rpx;
|
||||
}
|
||||
|
||||
.flex-colum-start {
|
||||
justify-content: space-between;
|
||||
height: 400rpx;
|
||||
|
||||
.indexboxtow {
|
||||
width: 334rpx;
|
||||
height: 188rpx;
|
||||
}
|
||||
|
||||
.indexboxthere {
|
||||
margin-top: 28rpx;
|
||||
width: 334rpx;
|
||||
height: 188rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
181
pages/index/components/salezone/index.vue
Normal file
181
pages/index/components/salezone/index.vue
Normal file
@@ -0,0 +1,181 @@
|
||||
<template>
|
||||
<view class="index">
|
||||
<view class="onecontenttowone flex-start">
|
||||
<view class="onecontenttowone_one">
|
||||
{{title}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="indexbox">
|
||||
<view class="indexboxitem flex-start" v-for="(item,index) in list" :key="index">
|
||||
<image class="indexboxitemimage" :src="item.host_img" mode="aspectFill"></image>
|
||||
<view class="indexboxitemleft flex-colum-start">
|
||||
<view class="indexboxitemleftone">
|
||||
{{item.title}}
|
||||
</view>
|
||||
<view class="indexboxitemlefttow">
|
||||
{{item.intro}}
|
||||
</view>
|
||||
<view class="indexboxitemleftthere flex-start">
|
||||
<view class="indexboxitemleftthere_one">
|
||||
<text>¥</text>
|
||||
<text>{{item.price}}</text>
|
||||
</view>
|
||||
<view class="indexboxitemleftthere_tow">
|
||||
¥{{item.y_price}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="indexboxitembox" @click="mallInfoInfo(item)">
|
||||
立即抢购
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: '银收客'
|
||||
},
|
||||
|
||||
},
|
||||
methods: {
|
||||
mallInfoInfo(e) { //查看订单详情
|
||||
uni.pro.navigateTo('mall/mallInfo', {
|
||||
id: e.id,
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.index {
|
||||
width: 100%;
|
||||
padding: 32rpx;
|
||||
|
||||
.onecontenttowone::before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
width: 4rpx;
|
||||
height: 20rpx;
|
||||
background: var(--bg-color-buttonone);
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
|
||||
.onecontenttowone {
|
||||
.onecontenttowone_one {
|
||||
margin-left: 8rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
}
|
||||
|
||||
.indexbox {
|
||||
.indexboxitem {
|
||||
margin-top: 24rpx;
|
||||
position: relative;
|
||||
padding: 24rpx;
|
||||
width: 100%;
|
||||
height: 212rpx;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
|
||||
border-radius: 18rpx;
|
||||
|
||||
.indexboxitemimage {
|
||||
width: 164rpx;
|
||||
height: 164rpx;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
|
||||
.indexboxitemleft {
|
||||
height: 164rpx;
|
||||
margin-left: 12rpx;
|
||||
width: 60%;
|
||||
|
||||
.indexboxitemleftone {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.indexboxitemlefttow {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
margin-top: 12rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.indexboxitemleftthere {
|
||||
margin-top: 20rpx;
|
||||
align-items: flex-end;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
.indexboxitemleftthere_one {
|
||||
font-size: 34rpx;
|
||||
font-family: SourceHanSansCN-Bold, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #FC5F69;
|
||||
|
||||
text:nth-child(1) {
|
||||
font-size: 24rpx;
|
||||
font-family: SourceHanSansCN-Bold, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #FC5F69;
|
||||
}
|
||||
}
|
||||
|
||||
.indexboxitemleftthere_tow {
|
||||
text-decoration: line-through;
|
||||
margin-left: 12rpx;
|
||||
font-size: 20rpx;
|
||||
font-family: SourceHanSansCN-Regular, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.indexboxitembox {
|
||||
position: absolute;
|
||||
right: 24rpx;
|
||||
bottom: 24rpx;
|
||||
background: var(--bgbuttonqq);
|
||||
border-radius: 24rpx;
|
||||
padding: 8rpx 22rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: SourceHanSansCN-Bold, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
182
pages/index/components/specials/index.vue
Normal file
182
pages/index/components/specials/index.vue
Normal file
@@ -0,0 +1,182 @@
|
||||
<template>
|
||||
<view class="index">
|
||||
<view class="indexbox">
|
||||
<image class="indexboximage" :src="img" mode=""></image>
|
||||
<view class="indexbox_box">
|
||||
<view class="indexbox_boxtop flex-between" @click="specials">
|
||||
<view class="indexbox_boxtopone">
|
||||
{{title}}
|
||||
</view>
|
||||
<view class="indexbox_boxtoptow">
|
||||
更多<text>></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="indexbox_boxitem flex-between">
|
||||
<view class="indexbox_boxitem_item flex-colum-start" v-for="(item,index) in list" :key="index"
|
||||
@click="mallInfoInfo(item)">
|
||||
<view class="indexbox_boxitem_itemimage">
|
||||
<image :src="item.host_img" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="indexbox_boxitem_itemone">
|
||||
{{item.title}}
|
||||
</view>
|
||||
<view class="indexbox_boxitem_itemtow flex-start">
|
||||
<text>￥</text>
|
||||
<text>{{item.price}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: '每日特价'
|
||||
},
|
||||
img: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
|
||||
},
|
||||
methods: {
|
||||
specials(e) { //查看订单详情
|
||||
uni.pro.navigateTo('index/specials', {
|
||||
id: e.id,
|
||||
})
|
||||
},
|
||||
mallInfoInfo(e) { //查看订单详情
|
||||
uni.pro.navigateTo('mall/mallInfo', {
|
||||
id: e.id,
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.index {
|
||||
.indexbox {
|
||||
margin: 32rpx 28rpx 0 28rpx;
|
||||
position: relative;
|
||||
height: 378rpx;
|
||||
|
||||
.indexboximage {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 378rpx;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.indexbox_box {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
z-index: 2;
|
||||
padding: 16rpx;
|
||||
|
||||
.indexbox_boxtop {
|
||||
margin-top: 8rpx;
|
||||
width: 100%;
|
||||
|
||||
.indexbox_boxtopone {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.indexbox_boxtoptow {
|
||||
font-size: 18rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #FD6C60;
|
||||
background: #FFFFFF;
|
||||
border-radius: 18rpx;
|
||||
padding: 6rpx 16rpx;
|
||||
|
||||
text {
|
||||
font-size: 16rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.indexbox_boxitem {
|
||||
margin-top: 16rpx;
|
||||
padding: 16rpx 12rpx;
|
||||
background: #ffffff;
|
||||
|
||||
.indexbox_boxitem_item {
|
||||
.indexbox_boxitem_itemimage {
|
||||
width: 148rpx;
|
||||
height: 148rpx;
|
||||
background: #F8F8F8;
|
||||
border-radius: 8rpx;
|
||||
|
||||
image {
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.indexbox_boxitem_itemone {
|
||||
width: 148rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-top: 8rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.indexbox_boxitem_itemtow {
|
||||
margin-top: 12rpx;
|
||||
padding-right: 10rpx;
|
||||
justify-content: flex-end;
|
||||
background: url(@/static/imge/specials.png) no-repeat;
|
||||
background-size: cover;
|
||||
width: 148rpx;
|
||||
height: 48rpx;
|
||||
font-family: Roboto, Roboto;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
|
||||
text {
|
||||
height: 48rpx;
|
||||
}
|
||||
|
||||
text:nth-child(1) {
|
||||
line-height: 50rpx;
|
||||
font-size: 16rpx;
|
||||
}
|
||||
|
||||
text:nth-child(2) {
|
||||
line-height: 48rpx;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
194
pages/index/components/vipclass/index.vue
Normal file
194
pages/index/components/vipclass/index.vue
Normal file
@@ -0,0 +1,194 @@
|
||||
<template>
|
||||
<view class="">
|
||||
<view class="theretowcontent flex-between">
|
||||
<view class="theretowcontent_item flex-colum" v-for="(item,index) in list" :key="index"
|
||||
@click="clickmemberinfos(item)">
|
||||
<view :class="index == 0?'theretowcontent_item_one':'theretowcontent_item_ones'">
|
||||
{{item.title}}
|
||||
</view>
|
||||
<view :class="index == 0?'theretowcontent_item_tow':'theretowcontent_item_tows'">
|
||||
￥{{item.price}}/<text>{{item.frequ}}次</text>
|
||||
</view>
|
||||
<view :class="index == 0?'theretowcontent_item_there':'theretowcontent_item_theres'">
|
||||
({{item.show}})
|
||||
</view>
|
||||
<view :class="index == 0?'theretowcontent_item_box':'theretowcontent_item_boxs'">
|
||||
{{item.is_user_sec == '0'?'购买':'加购'}}
|
||||
</view>
|
||||
<image class="theretowcontent_item_image" :src="item.img" mode="aspectFill"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
data: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
|
||||
},
|
||||
methods: {
|
||||
clickmemberinfos(e) { //购买会员卡
|
||||
if (e.is_user_sec == 0) {
|
||||
uni.pro.navigateTo('my/member/memberinfos', {
|
||||
id: e.id,
|
||||
})
|
||||
// async toworder() { //会员卡
|
||||
// let res = await this.api.userreceivebalancecar({
|
||||
// store_id: uni.cache.get('store_id') // 判断显示哪家的作品
|
||||
// })
|
||||
// uni.showToast({
|
||||
// title: '领取成功',
|
||||
// icon: 'none'
|
||||
// });
|
||||
// setTimeout(() => {
|
||||
// uni.pro.navigateTo('my/member/index')
|
||||
// }, 1500);
|
||||
// },
|
||||
} else {
|
||||
uni.pro.navigateTo('my/member/memberinfo', {
|
||||
id: e.id,
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.theretowcontent {
|
||||
width: 100%;
|
||||
padding: 24rpx 32rpx;
|
||||
|
||||
.theretowcontent_item {
|
||||
padding: 16rpx;
|
||||
width: 48%;
|
||||
border-radius: 10rpx;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
|
||||
.theretowcontent_item_one {
|
||||
width: 55%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.theretowcontent_item_ones {
|
||||
width: 55%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #422A07;
|
||||
}
|
||||
|
||||
.theretowcontent_item_tow {
|
||||
margin-top: 20rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Roboto-Regular, Roboto;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
|
||||
text {
|
||||
font-size: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.theretowcontent_item_tows {
|
||||
margin-top: 20rpx;
|
||||
font-family: Roboto-Regular, Roboto;
|
||||
font-weight: 400;
|
||||
color: #422A07;
|
||||
font-size: 28rpx;
|
||||
|
||||
text {
|
||||
font-size: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.theretowcontent_item_there {
|
||||
margin-top: 6rpx;
|
||||
font-size: 20rpx;
|
||||
width: 100%;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #D1CECE;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.theretowcontent_item_theres {
|
||||
margin-top: 6rpx;
|
||||
font-size: 20rpx;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #422A07;
|
||||
}
|
||||
|
||||
.theretowcontent_item_box {
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
right: 16rpx;
|
||||
padding: 6rpx 26rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Roboto-Bold, Roboto;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
background: linear-gradient(180deg, rgba(255, 255, 255, 0.73) 0%, rgba(128, 128, 128, 0.73) 100%);
|
||||
box-shadow: 0px 6px 12rpx 2rpx rgba(49, 47, 47, 0.85);
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.theretowcontent_item_boxs {
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
right: 16rpx;
|
||||
padding: 6rpx 26rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Roboto-Bold, Roboto;
|
||||
font-weight: bold;
|
||||
color: #F6AE5B;
|
||||
background: linear-gradient(180deg, #F9F9F9 0%, #FADAB5 100%);
|
||||
box-shadow: 0px 6rpx 12rpx 2px rgba(226, 172, 110, 0.55);
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.theretowcontent_item_image {
|
||||
border-radius: 16rpx;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user