|
|
@@ -0,0 +1,97 @@
|
|
|
+<template>
|
|
|
+ <view>
|
|
|
+ <navigation-bar title="商品管理" background-color="#fff" front-color="#000000" />
|
|
|
+ <u-list class="list" width="100%" @scrolltolower="scrolltolower">
|
|
|
+ <u-list-item v-for="(item, index) in goods" :key="index">
|
|
|
+ <view class="card" @click="toDetails(item.id)">
|
|
|
+ <view class="card-body">
|
|
|
+ <image
|
|
|
+ src="https://img11.360buyimg.com/n7/jfs/t1/94448/29/2734/524808/5dd4cc16E990dfb6b/59c256f85a8c3757.jpg"
|
|
|
+ mode="aspectFill" class="img"></image>
|
|
|
+ <view class="txt">
|
|
|
+ <view style="font-size: 30rpx;height: 140rpx;">{{item.goodsName}}</view>
|
|
|
+ <view class="piece">{{item.price}} 元</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-list-item>
|
|
|
+ <u-loadmore v-if="goods" :status="loadmoreStatus" margin-top="20" @loadmore="clickLoadMore" margin-bottom="50" />
|
|
|
+ </u-list>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ loadmoreStatus: 'loadmore',
|
|
|
+ goods: []
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad() {
|
|
|
+ this.getTransitList()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getTransitList() {
|
|
|
+
|
|
|
+ this.$api.getTransitList().then(res => {
|
|
|
+ this.goods = res.data
|
|
|
+ this.goods.forEach((item, index) => {
|
|
|
+ if (index === this.goods.length - 1) {
|
|
|
+ this.loadmoreStatus = 'nomore'
|
|
|
+ } else {
|
|
|
+ this.loadmoreStatus = 'loadmore'
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ scrolltolower() {
|
|
|
+ this.getTransitList()
|
|
|
+ },
|
|
|
+
|
|
|
+ toDetails(id) {
|
|
|
+ this.$common.to('/pages/goodsDetails/goodsDetails?id='+id)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+ .list {
|
|
|
+ height: 100%;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ background-color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .card {
|
|
|
+ padding: 10rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .card-body {
|
|
|
+ display: flex;
|
|
|
+ height: 300rpx;
|
|
|
+ width: 100%;
|
|
|
+ /* border: #888 1rpx solid; */
|
|
|
+ box-shadow: 1rpx 1rpx #888;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .img {
|
|
|
+ height: 300rpx;
|
|
|
+ width: 300rpx;
|
|
|
+ margin-right: 10rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .txt {
|
|
|
+ padding: 10rpx;
|
|
|
+ width: 300rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .piece {
|
|
|
+ margin: 50rpx 10rpx;
|
|
|
+ color: red;
|
|
|
+ position: relative;
|
|
|
+ top: 50rpx;
|
|
|
+ /* left: 5rpx; */
|
|
|
+ }
|
|
|
+</style>
|
