jugao
4 years ago
11 changed files with 477 additions and 30 deletions
-
7common/css/common.css
-
29pages.json
-
BINpages/.DS_Store
-
286pages/qHome/achievement.vue
-
23pages/tabbar/home.vue
-
18pages/tabbar/shop.vue
-
18pages/yunProduct/detail.vue
-
119pages/yunProduct/newDetail.vue
-
5pages/yunProduct/storeProduct.vue
-
BINstatic/base/.DS_Store
-
BINstatic/base/select.png
Binary file not shown.
@ -0,0 +1,286 @@ |
|||||
|
<template> |
||||
|
<view class="app"> |
||||
|
<view class="menu"> |
||||
|
<view class="menu-item" @click="currentTitle='打款业绩'"> |
||||
|
<text class="menu-item-txt">打款业绩</text> |
||||
|
<view :style="{backgroundColor:currentTitle=='打款业绩'?'#EDAF8B':'white'}" class="menu-item-line"></view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="menu-item" @click="currentTitle='出货业绩'"> |
||||
|
<text class="menu-item-txt">出货业绩</text> |
||||
|
<view :style="{backgroundColor:currentTitle=='出货业绩'?'#EDAF8B':'white'}" class="menu-item-line"></view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="separator-line"></view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="separator-section"></view> |
||||
|
|
||||
|
|
||||
|
<view class="achievement-head"> |
||||
|
<view class="achievement-head-left"> |
||||
|
<text class="achievement-head-time">2021年4月</text> |
||||
|
<text class="achievement-head-number">打款业绩：￥99999.00</text> |
||||
|
</view> |
||||
|
|
||||
|
<view class="achievement-head-right"> |
||||
|
<text class="achievement-head-right-txt">全部</text> |
||||
|
<image class="achievement-head-right-img" src="/static/base/select.png"></image> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<!-- <view class="product-section"> |
||||
|
<text class="prduct-title">轻未来超纤维阻燃粉轻未来超纤维阻燃粉轻未来超纤维阻燃粉</text> |
||||
|
<view class="product-des"> |
||||
|
<view class="product-price"> |
||||
|
<text class="product-price-sale">￥5999</text> |
||||
|
<text class="product-price-show">￥6999</text> |
||||
|
</view> |
||||
|
<text class="product-number">库存：2000个</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
|
||||
|
<view class="separator-section"></view> |
||||
|
|
||||
|
|
||||
|
<view class="product-detail"> |
||||
|
<text class="product-detail-title">产品描述</text> |
||||
|
<view class="product-detail-wrap"> |
||||
|
<text class="product-detail-txt">理想，是未来事物的美好想象和希望，也比喻对某事物榛于最完善境界的观念。是人们在实践过程中形成的，有实现可能性的、对未来社会和自身发展的向往和追求；价值观是基于人的一定的思维感官之上而作出的认知、理解、判断或抉择、也就是认定事物、判定是非的一种思维或取向、本产本具有良好疗效；</text> |
||||
|
</view> |
||||
|
<image class="product-detail-img" src="/static/shop/677088217d8a00aa.jpg"></image> |
||||
|
</view> |
||||
|
|
||||
|
--> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<!-- <view class="shop-list"> |
||||
|
<view class="shop-item"> |
||||
|
<view class="shop-item-left"> |
||||
|
<text class="shop-item-left-title">通知 | 关于“轻未来超轻维阻燃粉”外包装升级通知</text> |
||||
|
<text class="shop-item-left-time">2021年4月23日</text> |
||||
|
</view> |
||||
|
<image src="/static/shop/677088217d8a00aa.jpg" class="shop-item-img"> |
||||
|
</image> |
||||
|
</view> |
||||
|
|
||||
|
<view class="shop-item"> |
||||
|
<view class="shop-item-left"> |
||||
|
<text class="shop-item-left-title">通知 | 关于“轻未来超轻维阻燃粉”外包装升级通知</text> |
||||
|
<text class="shop-item-left-time">2021年4月23日</text> |
||||
|
</view> |
||||
|
<image src="/static/shop/677088217d8a00aa.jpg" class="shop-item-img"> |
||||
|
</image> |
||||
|
</view> |
||||
|
|
||||
|
<view class="shop-item"> |
||||
|
<view class="shop-item-left"> |
||||
|
<text class="shop-item-left-title">通知 | 关于“轻未来超轻维阻燃粉”外包装升级通知</text> |
||||
|
<text class="shop-item-left-time">2021年4月23日</text> |
||||
|
</view> |
||||
|
<image src="/static/shop/677088217d8a00aa.jpg" class="shop-item-img"> |
||||
|
</image> |
||||
|
</view> |
||||
|
</view> --> |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
|
||||
|
export default { |
||||
|
components: { |
||||
|
|
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
currentTitle:'打款业绩', |
||||
|
navList: [],//导航列表 |
||||
|
advertList: [],//广告列表 |
||||
|
hotList: [],//热门推荐 |
||||
|
indicatorDots: true, |
||||
|
autoplay: true, |
||||
|
interval: 2000, |
||||
|
duration: 500, |
||||
|
swipeImgs:['/static/shop/677088217d8a00aa.jpg','/static/shop/rem.jpg','/static/shop/b7f2be6053cc88b4.jpg'] |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
changeIndicatorDots(e) { |
||||
|
this.indicatorDots = !this.indicatorDots |
||||
|
}, |
||||
|
changeAutoplay(e) { |
||||
|
this.autoplay = !this.autoplay |
||||
|
}, |
||||
|
intervalChange(e) { |
||||
|
this.interval = e.target.value |
||||
|
}, |
||||
|
durationChange(e) { |
||||
|
this.duration = e.target.value |
||||
|
}, |
||||
|
midAdvert(){ |
||||
|
if(this.advertList.length === 0) return {}; |
||||
|
const res = this.advertList.filter(item=> item.advert_type === 'middle'); |
||||
|
return res.length > 0 ? res[0]: {}; |
||||
|
}, |
||||
|
carousel(){ |
||||
|
return this.advertList.filter(item=> item.advert_type === 'carousel'); |
||||
|
} |
||||
|
}, |
||||
|
onLoad() { |
||||
|
this.loadAdvert(); |
||||
|
this.loadNavList(); |
||||
|
|
||||
|
setTimeout(()=>{ |
||||
|
//this.navTo('/pages/address/list') |
||||
|
}, 1000) |
||||
|
}, |
||||
|
methods: { |
||||
|
toStoreProduct(){ |
||||
|
this.navTo(`/pages/yunProduct/storeProduct`) |
||||
|
}, |
||||
|
//加载广告 缓存10分钟 |
||||
|
async loadAdvert(){ |
||||
|
const res = await this.$request('advert', 'getAdvertList', {}, { |
||||
|
cache: 10*60 |
||||
|
}); |
||||
|
this.advertList = res.data; |
||||
|
this.log(res); |
||||
|
}, |
||||
|
//加载导航 缓存1小时 |
||||
|
async loadNavList(){ |
||||
|
const res = await this.$request('advert', 'getNavList', {}, { |
||||
|
cache: 60*60*0, |
||||
|
}); |
||||
|
this.navList = res.data; |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
page{ |
||||
|
background-color: white; |
||||
|
} |
||||
|
</style> |
||||
|
<style scoped lang="scss"> |
||||
|
/* 分类 */ |
||||
|
|
||||
|
|
||||
|
|
||||
|
.menu{ |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
align-items: center; |
||||
|
background-color: white; |
||||
|
// background-color: yellow; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.menu-item{ |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
flex:1; |
||||
|
} |
||||
|
|
||||
|
.menu-item-txt{ |
||||
|
width: 200rpx; |
||||
|
text-align: center; |
||||
|
display: block; |
||||
|
font-size: 15px; |
||||
|
font-weight: bold; |
||||
|
color: #333333; |
||||
|
height: 104rpx; |
||||
|
line-height: 104rpx; |
||||
|
} |
||||
|
.menu-item-line{ |
||||
|
position: relative; |
||||
|
top: -20rpx; |
||||
|
background-color: #EDAF8B; |
||||
|
height:6rpx ; |
||||
|
width: 50rpx; |
||||
|
} |
||||
|
|
||||
|
.separator-line{ |
||||
|
position: absolute; |
||||
|
left: 49.98%; |
||||
|
width: 2rpx; |
||||
|
background-color:#333333 ; |
||||
|
height: 33rpx; |
||||
|
} |
||||
|
|
||||
|
.separator-section{ |
||||
|
background-color: $separatorColor; |
||||
|
height: 20rpx; |
||||
|
} |
||||
|
|
||||
|
.achievement-head{ |
||||
|
|
||||
|
margin: 36rpx; |
||||
|
// width: 750rpx; |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
} |
||||
|
|
||||
|
.achievement-head-time{ |
||||
|
font-size: 18px; |
||||
|
// font-weight: 500; |
||||
|
color: #333333; |
||||
|
padding: 0rpx 0rpx 20rpx; |
||||
|
} |
||||
|
.achievement-head-number{ |
||||
|
padding: 10rpx 0rpx 0rpx; |
||||
|
display: block; |
||||
|
font-size: 15px; |
||||
|
font-weight: 500; |
||||
|
color: #999999; |
||||
|
} |
||||
|
|
||||
|
.achievement-head-right{ |
||||
|
padding: 10rpx 10rpx 10rpx 25rpx; |
||||
|
background-color:#F5F5F5 ; |
||||
|
margin: 0rpx 10rpx 0rpx 0rpx; |
||||
|
border-radius: 6rpx; |
||||
|
} |
||||
|
|
||||
|
.achievement-head-right-txt{ |
||||
|
font-size: 13px; |
||||
|
font-weight: 500; |
||||
|
color: #333333; |
||||
|
} |
||||
|
.achievement-head-right-img{ |
||||
|
position: relative; |
||||
|
top: 2rpx; |
||||
|
display: inline-block; |
||||
|
width: 20rpx; |
||||
|
height: 20rpx; |
||||
|
margin: 0rpx 10rpx; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
</style> |
||||
|
|
||||
@ -0,0 +1,119 @@ |
|||||
|
<template> |
||||
|
<view class="app" style="margin: 10rpx 30rpx;"> |
||||
|
<text class="new-title">一见倾心 | 轻未来2021大健康引领5G新店品牌战略盛典圆满成功！</text> |
||||
|
<text class="new-time">2021年4月24日</text> |
||||
|
<image src="/static/shop/677088217d8a00aa.jpg" class="new-img"></image> |
||||
|
<text class="new-des">理想，是未来事物的美好想象和希望，也比喻对某事物榛于最完善境界的观念。是人们在实践过程中形成的，有实现可能性的、对未来社会和自身发展的向往和追求；价值观是基于人的一定的思维感官之上而作出的认知、理解、判断或抉择、也就是认定事物、判定是非的一种思维或取向、本产本具有良好疗效；理想，是未来事物的美好想象和希望，也比喻对某事物榛于最完善境界的观念。是人们在实践过程中形成的，有实现可能性的、对未来社会和自身发展的向往和追求；价值观是基于人的一定的思维感官之上而作出的认知、理解、判断或抉择、也就是认定事物、判定是非的一种思维或取向、本产本具有良好疗效；</text> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
|
||||
|
export default { |
||||
|
components: { |
||||
|
|
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
navList: [],//导航列表 |
||||
|
advertList: [],//广告列表 |
||||
|
hotList: [],//热门推荐 |
||||
|
indicatorDots: true, |
||||
|
autoplay: true, |
||||
|
interval: 2000, |
||||
|
duration: 500 |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
changeIndicatorDots(e) { |
||||
|
this.indicatorDots = !this.indicatorDots |
||||
|
}, |
||||
|
changeAutoplay(e) { |
||||
|
this.autoplay = !this.autoplay |
||||
|
}, |
||||
|
intervalChange(e) { |
||||
|
this.interval = e.target.value |
||||
|
}, |
||||
|
durationChange(e) { |
||||
|
this.duration = e.target.value |
||||
|
}, |
||||
|
midAdvert(){ |
||||
|
if(this.advertList.length === 0) return {}; |
||||
|
const res = this.advertList.filter(item=> item.advert_type === 'middle'); |
||||
|
return res.length > 0 ? res[0]: {}; |
||||
|
}, |
||||
|
carousel(){ |
||||
|
return this.advertList.filter(item=> item.advert_type === 'carousel'); |
||||
|
} |
||||
|
}, |
||||
|
onLoad() { |
||||
|
this.loadAdvert(); |
||||
|
this.loadNavList(); |
||||
|
|
||||
|
setTimeout(()=>{ |
||||
|
//this.navTo('/pages/address/list') |
||||
|
}, 1000) |
||||
|
}, |
||||
|
methods: { |
||||
|
toStoreProduct(){ |
||||
|
this.navTo(`/pages/yunProduct/storeProduct`) |
||||
|
}, |
||||
|
//加载广告 缓存10分钟 |
||||
|
async loadAdvert(){ |
||||
|
const res = await this.$request('advert', 'getAdvertList', {}, { |
||||
|
cache: 10*60 |
||||
|
}); |
||||
|
this.advertList = res.data; |
||||
|
this.log(res); |
||||
|
}, |
||||
|
//加载导航 缓存1小时 |
||||
|
async loadNavList(){ |
||||
|
const res = await this.$request('advert', 'getNavList', {}, { |
||||
|
cache: 60*60*0, |
||||
|
}); |
||||
|
this.navList = res.data; |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
page{ |
||||
|
background-color: white; |
||||
|
} |
||||
|
</style> |
||||
|
<style scoped lang="scss"> |
||||
|
/* 分类 */ |
||||
|
|
||||
|
|
||||
|
.new-title{ |
||||
|
display: block; |
||||
|
line-height: 45rpx; |
||||
|
font-size: 15px; |
||||
|
font-weight: bold; |
||||
|
color: #333333; |
||||
|
margin: 50rpx 0rpx 0rpx; |
||||
|
} |
||||
|
.new-time{ |
||||
|
display: block; |
||||
|
font-size: 13px; |
||||
|
font-weight: 500; |
||||
|
color: #999999; |
||||
|
text-align: right; |
||||
|
} |
||||
|
.new-img{ |
||||
|
width: 100%; |
||||
|
height: 375rpx; |
||||
|
margin: 48rpx 0rpx 50rpx; |
||||
|
|
||||
|
} |
||||
|
.new-des{ |
||||
|
font-size: 13px; |
||||
|
font-weight: 500; |
||||
|
color: #999999; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
</style> |
||||
|
|
||||
Binary file not shown.
Binary file not shown.
|
After Width: 128 | Height: 128 | Size: 2.1 KiB |
Write
Preview
Loading…
Cancel
Save
Reference in new issue