jugao
3 years ago
11 changed files with 477 additions and 30 deletions
-
7common/css/common.css
-
29pages.json
-
BINpages/.DS_Store
-
286pages/qHome/achievement.vue
-
25pages/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