parent
7cf3af639d
commit
a0b52f8a4c
8 changed files with 1710 additions and 1180 deletions
@ -0,0 +1,8 @@ |
||||
<template> |
||||
</template> |
||||
|
||||
<script> |
||||
</script> |
||||
|
||||
<style> |
||||
</style> |
||||
@ -0,0 +1,293 @@ |
||||
<template> |
||||
<view class="container"> |
||||
<cu-custom class="main-totextbar bg-main-oil" :isBack="true" bgColor="bg-main-oil"> |
||||
<block slot="backText">返回</block> |
||||
<block slot="content">商品列表</block> |
||||
</cu-custom> |
||||
|
||||
<view class="options-frame"> |
||||
<view v-for="item,index in optionsList" :key="index" :class="index == currentIndex ? 'active':''" |
||||
@click="selectOptions(index)">{{item.text}}<text>({{item.count}})</text></view> |
||||
</view> |
||||
|
||||
<scroll-view v-if="dataList.length" class="list" :scroll-y="true" @scrolltolower="lower"> |
||||
<view class="item" v-for="item,index in dataList" :key="index"> |
||||
|
||||
<view class="introduce"> |
||||
<image :src="item.url"></image> |
||||
<view>{{item.productName}}</view> |
||||
<view>规格：默认</view> |
||||
<view>库存：{{item.totalStock}}</view> |
||||
</view> |
||||
<view class="footer"> |
||||
<view class="button">删除</view> |
||||
<view class="button">编辑</view> |
||||
</view> |
||||
</view> |
||||
<view style="height: 30rpx; background: #fff;"></view> |
||||
</scroll-view> |
||||
<view v-else class="empty"> |
||||
<image src="https://publicxingyou.oss-cn-hangzhou.aliyuncs.com/mp-oil/yunsite-empty.png"></image> |
||||
<view>暂无对账单~</view> |
||||
</view> |
||||
|
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
import serve from '@/api/packageIntegral/productList.js' |
||||
|
||||
export default { |
||||
options: { |
||||
styleIsolation: 'shared' |
||||
}, |
||||
data() { |
||||
return { |
||||
currentIndex: 0, |
||||
paramter: { |
||||
currentPage: 1, |
||||
pagesize: 20, |
||||
params: {}, |
||||
}, |
||||
dataList: [{},{}], |
||||
optionsList: [{ |
||||
text: '全部', |
||||
count: 0, |
||||
value: '' |
||||
}, { |
||||
text: '待确认', |
||||
count: 0, |
||||
value: '' |
||||
}, { |
||||
text: '已确认', |
||||
count: 0, |
||||
value: '' |
||||
}, { |
||||
text: '金额异常', |
||||
count: 0, |
||||
value: '' |
||||
}], |
||||
|
||||
|
||||
} |
||||
}, |
||||
|
||||
onLoad() { |
||||
// this.productByPage() |
||||
// this.getTopInfo() |
||||
}, |
||||
|
||||
methods: { |
||||
selectOptions(index) { |
||||
this.currentIndex = index |
||||
console.log(index,'index') |
||||
if(index == 0){ |
||||
this.paramter.params ={} |
||||
}else if(index ==1){ |
||||
this.paramter.params ={} |
||||
this.paramter.params.productStatus = 1 |
||||
}else if(index ==2){ |
||||
this.paramter.params ={} |
||||
this.paramter.params.productStatus = 2 |
||||
}else if(index ==3){ |
||||
this.paramter.params ={} |
||||
this.paramter.params.auditStatus = 1 |
||||
} |
||||
// this.productByPage() |
||||
}, |
||||
|
||||
|
||||
|
||||
lower() { |
||||
this.paramter.currentPage += 1 |
||||
// this.productByPage() |
||||
}, |
||||
|
||||
|
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.container { |
||||
height: 100vh; |
||||
display: flex; |
||||
flex-direction: column; |
||||
background: #f1f2f7 !important; |
||||
>.options-frame { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
margin-top: 43rpx; |
||||
padding: 0 31rpx; |
||||
|
||||
|
||||
>view { |
||||
width: 144rpx; |
||||
height: 66rpx; |
||||
font-size: 25rpx; |
||||
line-height: 66rpx; |
||||
text-align: center; |
||||
color: #000000; |
||||
background: #F7F7F7; |
||||
|
||||
>text { |
||||
color: #F83D3D; |
||||
} |
||||
|
||||
&.active { |
||||
color: #FFF; |
||||
background: #F83D3D; |
||||
|
||||
>text { |
||||
color: #fff; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
|
||||
>.list { |
||||
margin-top: 35rpx; |
||||
flex: 1; |
||||
overflow-y: hidden; |
||||
|
||||
.item { |
||||
position: relative; |
||||
margin-top: 20rpx; |
||||
background: #fff; |
||||
// min-height: 106rpx; |
||||
// border-bottom: 12rpx solid #F1F2F7; |
||||
|
||||
&:nth-of-type(1) { |
||||
margin-top: 0 |
||||
} |
||||
|
||||
.header { |
||||
// padding: 26rpx 23rpx 0; |
||||
height: 60rpx; |
||||
// line-height: 83rpx; |
||||
width: 100%; |
||||
font-size: 30rpx; |
||||
color: #666; |
||||
border-top: 1rpx solid #D7D7D7; |
||||
|
||||
.identifying{ |
||||
width: 120rpx; |
||||
height: 60rpx; |
||||
line-height: 60rpx; |
||||
// background-color: #F83D3D; |
||||
color: #FFF; |
||||
text-align: center; |
||||
border-bottom-right-radius: 30rpx; |
||||
} |
||||
} |
||||
|
||||
.introduce { |
||||
position: relative; |
||||
padding: 24rpx 29rpx 31rpx 268rpx; |
||||
min-height: 220rpx; |
||||
|
||||
>image { |
||||
position: absolute; |
||||
top: 13rpx; |
||||
left: 34rpx; |
||||
width: 220rpx; |
||||
height: 220rpx; |
||||
// border: 1px solid #333; |
||||
} |
||||
|
||||
>view { |
||||
&:nth-of-type(1) { |
||||
font-size: 28rpx; |
||||
color: #000; |
||||
} |
||||
|
||||
&:nth-of-type(2), |
||||
&:nth-of-type(3) { |
||||
margin-top: 11rpx; |
||||
font-size: 24rpx; |
||||
color: #999; |
||||
} |
||||
|
||||
&:nth-of-type(3) { |
||||
margin-top: 18rpx; |
||||
|
||||
} |
||||
|
||||
&:nth-of-type(4) { |
||||
margin-top: 11rpx; |
||||
font-size: 28rpx; |
||||
color: #F83D3D; |
||||
} |
||||
} |
||||
} |
||||
.examine{ |
||||
width: 120rpx; |
||||
height: 45rpx; |
||||
color: #FFF; |
||||
text-align: center; |
||||
line-height: 45rpx; |
||||
position: absolute; |
||||
right: 50rpx; |
||||
top: 180rpx; |
||||
} |
||||
|
||||
>.footer { |
||||
position: relative; |
||||
height: 58rpx; |
||||
line-height: 58rpx; |
||||
padding: 0 34rpx 40rpx; |
||||
font-size: 32rpx; |
||||
color: #000; |
||||
font-weight: 550; |
||||
|
||||
.button { |
||||
position: absolute; |
||||
top: 0; |
||||
width: 128rpx; |
||||
height: 58rpx; |
||||
line-height: 58rpx; |
||||
text-align: center; |
||||
font-size: 28rpx; |
||||
color: #999; |
||||
background: #FFF; |
||||
border: 1px solid #999; |
||||
border-radius: 10rpx; |
||||
} |
||||
|
||||
>.button{ |
||||
&:nth-of-type(1){ |
||||
right: 360rpx; |
||||
} |
||||
&:nth-of-type(2){ |
||||
right: 200rpx; |
||||
} |
||||
&:nth-of-type(3){ |
||||
right: 40rpx; |
||||
} |
||||
|
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
|
||||
|
||||
>.empty { |
||||
margin: 218rpx auto 0; |
||||
|
||||
>image { |
||||
width: 473rpx; |
||||
height: 404rpx; |
||||
} |
||||
|
||||
>view { |
||||
margin-top: 45rpx; |
||||
text-align: center; |
||||
font-size: 28rpx; |
||||
color: #999; |
||||
} |
||||
} |
||||
|
||||
} |
||||
</style> |
||||
@ -0,0 +1,8 @@ |
||||
<template> |
||||
</template> |
||||
|
||||
<script> |
||||
</script> |
||||
|
||||
<style> |
||||
</style> |
||||
Loading…
Reference in new issue