对接口之前

This commit is contained in:
asd
2019-12-24 09:48:33 +08:00
parent 36b9780ab1
commit a2749f18a2
269 changed files with 15467 additions and 61 deletions

View File

@@ -0,0 +1,28 @@
<template>
<view class="ad">
<img :src="ad" alt="" class="adpic">
</view>
</template>
<script>
export default {
name:"indexAd",
props:{
ad:{
type:String
}
},
mounted(){
console.log(this.ad,44455)
}
}
</script>
<style lang="scss" scoped>
.ad{
height: 236upx;
width: 100%;
.adpic{
width: 744upx;
height: 234upx;
}
}
</style>

View File

@@ -0,0 +1,44 @@
<template>
<view class="addcar">
<view class="adds">
<view class="a">
<img src="../../static/img/add.png" alt class="add" />
<text class="cliadd">点击添加车辆</text>
</view>
</view>
</view>
</template>
<script>
export default {
name: "indexAddcar",
};
</script>
<style lang="scss">
.addcar {
width: 720upx;
height: 92upx;
background: rgba(222, 53, 72, 1);
box-shadow: 0px 0px 13upx 1upx rgba(49, 49, 49, 0.13);
border-radius: 10px;
.adds {
width: 229upx;
height: 92upx;
margin: 0 auto;
display: flex;
flex-direction: column;
justify-content: center;
.add {
width: 30upx;
height: 30upx;
margin: auto 0;
margin-right: 14upx;
}
.cliadd {
font-size: 30upx;
color: white;
position: relative;
bottom: 5upx;
}
}
}
</style>

View File

@@ -0,0 +1,222 @@
<template>
<view>
<view class="indexicon" v-if="choosecolor==1">
<view>
<view class="icon">
<img :src="imgurl" alt class="iconpic" />
</view>
<view class="desc">{{desc}}</view>
</view>
</view>
<view class="indexicon" v-if="choosecolor==2">
<view>
<view class="icon1">
<img :src="imgurl" alt class="iconpic" />
</view>
<view class="desc">{{desc}}</view>
</view>
</view>
<view class="indexicon" v-if="choosecolor==3">
<view>
<view class="icon2">
<img :src="imgurl" alt class="iconpic" />
</view>
<view class="desc">{{desc}}</view>
</view>
</view>
<view class="indexicon" v-if="choosecolor==4">
<view>
<view class="icon3">
<img :src="imgurl" alt class="iconpic" />
</view>
<view class="desc">{{desc}}</view>
</view>
</view>
<view class="indexicon" v-if="choosecolor==5">
<view>
<view class="icon4">
<img :src="imgurl" alt class="iconpic" />
</view>
<view class="desc">{{desc}}</view>
</view>
</view>
<view class="indexicon" v-if="choosecolor==6">
<view>
<view class="icon5">
<img :src="imgurl" alt class="iconpic" />
</view>
<view class="desc">{{desc}}</view>
</view>
</view>
<view class="indexicon" v-if="choosecolor==7">
<view>
<view class="icon6">
<img :src="imgurl" alt class="iconpic" />
</view>
<view class="desc">{{desc}}</view>
</view>
</view>
</view>
<!-- choosecolor:1 蓝色, choosecolor:2黄色, choosecolor:3 绿色, choosecolor:4 蓝色1 choosecolor:5 粉色 choosecolor:6 红色 choosecolor:7 灰色-->
</template>
<script>
export default {
name: "indexIcon",
data() {
return {
blue1: "icon",
gold: "icon1",
green: "icon2",
blue2: "icon3",
pink: "icon4",
red: "icon5",
gray: "icon6"
};
},
props: {
imgurl: {
type: String
},
desc: {
type: String
},
choosecolor: {
// type: Number
}
}
};
// imgurl 图片地址 desc 图标功能如:发动机维护 choosecolor 图标的背景色
</script>
<style lang="scss">
.indexicon {
width: 123upx;
height: 124upx;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
.icon {
width: 80upx;
height: 80upx;
background: linear-gradient(
0deg,
rgba(88, 152, 255, 1),
rgba(124, 213, 248, 1)
);
border-radius: 50%;
display: flex;
flex-direction: column;
justify-content: center;
margin: 0 auto;
margin-bottom: 21upx;
}
.icon1 {
width: 80upx;
height: 80upx;
background: linear-gradient(
180deg,
rgba(254, 217, 132, 1),
rgba(255, 152, 87, 1)
);
border-radius: 50%;
display: flex;
flex-direction: column;
justify-content: center;
margin: 0 auto;
margin-bottom: 21upx;
}
.icon2 {
width: 80upx;
height: 80upx;
background: linear-gradient(
0deg,
rgba(71, 196, 120, 1),
rgba(154, 239, 227, 1)
);
border-radius: 50%;
display: flex;
flex-direction: column;
justify-content: center;
margin: 0 auto;
margin-bottom: 21upx;
}
.icon3 {
width: 80upx;
height: 80upx;
background: linear-gradient(
180deg,
rgba(112, 212, 255, 1),
rgba(41, 155, 251, 1)
);
border-radius: 50%;
display: flex;
flex-direction: column;
justify-content: center;
margin: 0 auto;
margin-bottom: 21upx;
}
.icon4 {
width: 80upx;
height: 80upx;
background: linear-gradient(
180deg,
rgba(255, 132, 164, 1),
rgba(253, 38, 108, 1)
);
border-radius: 50%;
display: flex;
flex-direction: column;
justify-content: center;
margin: 0 auto;
margin-bottom: 21upx;
}
.icon5 {
width: 80upx;
height: 80upx;
background: linear-gradient(
0deg,
rgba(234, 64, 61, 1),
rgba(251, 138, 115, 1)
);
border-radius: 50%;
display: flex;
flex-direction: column;
justify-content: center;
margin: 0 auto;
margin-bottom: 21upx;
}
.icon6 {
width: 80upx;
height: 80upx;
background: linear-gradient(
60deg,
rgba(201, 199, 202, 1),
rgba(139, 137, 140, 1)
);
border-radius: 50%;
display: flex;
flex-direction: column;
justify-content: center;
margin: 0 auto;
margin-bottom: 21upx;
}
.iconpic {
width: 49upx;
height: 39upx;
margin: auto;
}
.desc {
// width:150upx;
color: #818181;
font-size: 24upx;
text-indent: 3upx;
white-space: nowrap;
}
}
</style>

View File

@@ -0,0 +1,111 @@
<template>
<view>
<view v-bind:class="[choose==2 ? active : '', errclass]" v-if="choose!=3">
<view class="msphoto">
<img src="../../static/img/miaosha.png" alt class="mspic" />
</view>
<view class="pri">
<text class="price">0.01</text>
<view class="btn">
<text>立即抢</text>
</view>
</view>
</view>
<view v-bind:class="ms3" v-if="choose==3">
<view class="msphoto">
<img src="../../static/img/miaosha.png" alt class="mspic" />
</view>
<view class="pri">
<text class="price">{{price}}</text>
<view class="btn">
<text>立即抢</text>
</view>
</view>
</view>
<!-- choose:1 蓝色 choose:2 红色 choose3 黑色 -->
</view>
</template>
<script>
export default {
name: "indexMiaosha",
data() {
return {
active: "miaosha1",
errclass: "miaosha",
ms3: "miaosha2"
};
},
props: {
choose: {
type: Number
},
price: {
type: Number
}
}
};
// price 秒杀的价格 choose 秒杀部分的背景色
</script>
<style lang="scss" scoped>
.miaosha {
width: 176upx;
height: 195upx;
background: linear-gradient(
-45deg,
rgba(0, 74, 157, 1),
rgba(116, 180, 251, 1)
);
box-shadow: 0px 8upx 13upx 0px rgba(68, 136, 212, 0.3);
border-radius: 10upx;
}
.msphoto {
width: 148upx;
display: flex;
justify-content: center;
.mspic {
width: 125upx;
height: 119upx;
}
}
.pri {
display: flex;
margin-top: 24upx;
.price {
color: white;
font-size: 19upx;
margin-left: 9upx;
margin-top: 11upx;
}
.btn {
width: 95upx;
height: 38upx;
background: rgba(255, 255, 255, 0.2);
border-radius: 10upx;
color: white;
font-size: 20upx;
text-align: center;
margin-left: 11upx;
margin-top: 5upx;
}
}
.miaosha1 {
width: 176upx;
height: 195upx;
background: linear-gradient(
135deg,
rgba(255, 95, 24, 1),
rgba(255, 28, 28, 1)
);
box-shadow: 0px 8px 13px 0px rgba(255, 71, 31, 0.3);
border-radius: 10upx;
}
.miaosha2 {
width: 176upx;
height: 195upx;
background: linear-gradient(135deg, rgba(87, 87, 87, 1), rgba(55, 55, 55, 1));
box-shadow: 0px 8px 13px 0px rgba(74, 74, 74, 0.3);
border-radius: 10upx;
}
</style>

View File

@@ -0,0 +1,79 @@
<template>
<view class="indexMiaosha1" @click="goto">
<view class="shop">
<img :src="imgpic" alt="" class="shoppic">
</view>
<view class="pri">
<text>{{price}}</text>
<text class="huaxian">{{huaxian}}</text>
</view>
<view class="xiangou">仅限{{xiangou}}</view>
</view>
</template>
<script>
export default {
name: "indexMiaosha1",
props:{
imgpic:{
type:String
},
price:{
},
huaxian:{
},
xiangou:{
},
msid:{
}
},
mounted(){
console.log(this.imgpic)
},
methods:{
goto(e){
console.log(this.msid)
uni.navigateTo({
url:"/pages/seckilldetail/seckilldetail?msid="+this.msid
})
}
}
};
</script>
<style lang="scss">
.indexMiaosha1 {
.shop {
width: 176upx;
height: 165upx;
background-color: #cf0f0f;
}
.pri{
color: #E32E10;
font-size: 20upx;
text-align: center;
margin-top: 21upx;
.huaxian{
color: #CCCCCC;
font-size: 14upx;
text-decoration: line-through;
}
}
.xiangou{
color: #CCCCCC;
font-size: 14upx;
text-align: center;
margin-top: 8upx;
margin-left: 5upx;
}
.shoppic{
width:100%;
height: 100%;
}
}
</style>

View File

@@ -0,0 +1,55 @@
<template>
<view class="index-search">
<view class="box" @click="nav">
<image class="img" src="../../static/img/search.png"></image>
<view class="text">{{text}}</view>
</view>
</view>
</template>
<style lang="scss" scoped>
.index-search{
.box{
width: 694upx;
height: 58upx;
background-color: #F1B967;
position: fixed;
left: 28upx;
top: 16upx;
border-radius: 29upx;
display: flex;
align-items: center;
justify-content: center;
z-index: 999;
.text{
font-size: 27upx;
color: #fff;
margin-left: 10upx;
}
.img{
width: 27upx;
height: 27upx;
}
}
}
</style>
<script>
name:"search";
export default {
data(){
return {
}
},
props:["text"],
methods:{
nav(){
console.log("跳转")
uni.navigateTo({
url:"/pages/search/search"
})
}
}
}
// text 搜索框中的字
</script>

View File

@@ -0,0 +1,38 @@
<template>
<view class="index-select">
<view class="bag">大保养</view>
<view class="sm">小保养</view>
</view>
</template>
<style lang="scss" scoped>
.index-select {
width: 100%;
height: 103upx;
display: flex;
align-items: center;
border-bottom: 1upx solid #dcdcdc;
box-shadow:0px 1upx 1upx 0px rgba(49,49,49,0.19);
.bag {
width: 50%;
height: 64upx;
text-align: center;
line-height: 64upx;
border-right: 1upx solid #f1f1f1;
}
.sm {
width: 50%;
height: 64upx;
text-align: center;
line-height: 64upx;
}
}
</style>
<script>
name: "select";
export default {
data() {
return {};
},
props: []
};
</script>

View File

@@ -0,0 +1,100 @@
<template>
<view class="index-shopdetail" @click="goto">
<img :src="picurl" alt class="shoppic" />
<view class="desc">
<view class="shopname">
<text class="tag" v-if="ifbk">爆款</text>
<text>{{shopname}}</text>
</view>
<view class="pri">
<view class="pri-icon"></view>
<view>{{pri}}</view>
<view class="sale">已拼{{sale}}</view>
</view>
</view>
</view>
</template>
<script>
export default {
name: "index-shopdetail",
props:{
picurl:{
},
ifbk:{
},
shopname:{
},
pri:{
},
sale:{
},
ptid:{
}
},
methods:{
goto(){
console.log(this.ptid)
}
}
};
// 首页底部的商品详情
// shoppic 商品图片 ifbk 是否为爆款 shopname 商品名 pri 商品价格 sale 商品售量
</script>
<style lang="scss" scoped>
.index-shopdetail {
width: 646upx;
height: 173upx;
// border-bottom: 1upx solid #dcdcdc;
display: flex;
// justify-content: space-between;
.shoppic {
width: 137upx;
height: 132upx;
margin-left: 6upx;
margin-top: 12upx;
margin-right: 36upx;
}
.desc {
display: flex;
flex-direction: column;
justify-content: space-between;
margin-left: 37upx;
margin-bottom: 34upx;
.shopname {
color: #333333;
font-size: 28upx;
.tag {
width: 61upx;
height: 29upx;
background-color: #e32e10;
color: white;
font-size: 24upx;
text-align: center;
line-height: 29upx;
border-radius: 3upx;
padding-left: 10upx;
padding-right: 10upx;
margin-right: 7upx;
}
}
.pri {
font-size: 24upx;
color: #e32e10;
display: flex;
.pri-icon {
font-size: 18upx;
line-height: 36upx;
}
.sale {
color: #cfcfcf;
font-size: 22upx;
margin-left: 18upx;
}
}
}
}
</style>

View File

@@ -0,0 +1,45 @@
<template>
<view class="index-spike">
<view class="left">{{title}}</view>
<view class="right" @click="more">更多</view>
</view>
</template>
<style lang="scss" scoped>
.index-spike {
display: flex;
justify-content: space-between;
width: 673upx;
align-items: center;
.left {
color: #252525;
font-size: 36upx;
}
.right {
font-size: 26upx;
color: #b4b4b4;
}
}
</style>
<script>
export default {
name: "spike",
data() {
return {};
},
props: ["title"],
methods: {
more() {
if (this.title == "天天秒杀") {
uni.navigateTo({
url: "/pages/seckill/seckill"
});
} else if (this.title == "拼团购") {
uni.navigateTo({
url: "/pages/pintuanshop/pintuanshop"
});
}
}
}
};
// title 页面上每个模块的标题 如 天天秒杀
</script>

View File

@@ -0,0 +1,57 @@
<template>
<view class="index-swiper">
<swiper class="swiper" :autoplay="true" interval="2500" :circular="true">
<swiper-item class="box" v-for="(item,index) in list" @click="nav" :key="index" :data-id="item.goods_id">
<image :src="item.imgpath"></image>
</swiper-item>
<swiper-item class="box">
<image src="../../static/img/swiper.png"></image>
</swiper-item>
<swiper-item class="box">
<image src="../../static/img/swiper.png"></image>
</swiper-item>
</swiper>
</view>
</template>
<style lang="scss" scoped>
.index-swiper{
width: 100%;
height: 390upx;
.swiper{
width: 100%;
height: 100%;
.box{
width: 100%;
height: 100%;
>image{
width: 100%;
height: 100%;
}
}
}
}
</style>
<script>
name: "swiper";
export default {
props:{
list:{
type:Array
}
},
mounted(){
console.log(this.list[0],1313)
},
methods:{
nav(e){
console.log(e)
uni.navigateTo({
url:"/pages/shopdetail/shopdetail?shopid="+e.currentTarget.dataset.id
})
},
index(){
}
}
};
</script>