| | |
| | | <view :border="!formData.waterfall" class="uni-list-item--waterfall" title="自定义商品列表" |
| | | v-for="item in data" :key="item.id" @click="addGoods(item.id)"> |
| | | <!-- 通过header插槽定义列表左侧图片 --> |
| | | <template v-slot:header> |
| | | <view class="uni-thumb shop-picture" :class="{ 'shop-picture-column': formData.waterfall }"> |
| | | <image :src="item.goods_thumb" mode="aspectFill"></image> |
| | | </view> |
| | | </template> |
| | | <template v-slot:body> |
| | | <view class="shop"> |
| | | <view> |
| | | <view class="uni-title"> |
| | | <text class="uni-ellipsis-2">{{ item.name }}</text> |
| | | </view> |
| | | <!-- <view> |
| | | |
| | | <view class="uni-thumb shop-picture" :class="{ 'shop-picture-column': formData.waterfall }"> |
| | | <image :src="item.thumbnail" mode="aspectFill"></image> |
| | | </view> |
| | | <view class="shop"> |
| | | <view> |
| | | <view class="uni-title"> |
| | | <text class="uni-ellipsis-2">{{ item.goodsName }}</text> |
| | | </view> |
| | | <!-- <view> |
| | | <text class="uni-tag hot-tag">{{ item.goods_tip }}</text> |
| | | <text v-for="tag in item.tag" :key="tag" class="uni-tag">{{ tag }}</text> |
| | | </view> --> |
| | | </view> |
| | | <view> |
| | | <view class="shop-price"> |
| | | <text>¥</text> |
| | | <text class="shop-price-text">{{ item.price }}</text> |
| | | <text>.00</text> |
| | | </view> |
| | | <view> |
| | | <view class="shop-price"> |
| | | <text>¥</text> |
| | | <text class="shop-price-text">{{ item.goods_price }}</text> |
| | | <text>.00</text> |
| | | <view class="uni-flex-row"> |
| | | <view class="uni-note">{{ item.commentNum || 0 }}条评论 月销量 {{ |
| | | item.buyCount || 0 }} |
| | | </view> |
| | | <view class="uni-flex-row"> |
| | | <view class="uni-note">{{ item.comment_count||0 }}条评论 月销量 {{ |
| | | item.month_sell_count||0 }} |
| | | </view> |
| | | <view class="uni-note ellipsis"> |
| | | <text class="uni-link">上架</text> |
| | | <view class="uni-note ellipsis"> |
| | | <text class="uni-link">上架</text> |
| | | |
| | | <text class="uni-link" style="color:red;">删除</text> |
| | | </view> |
| | | <text class="uni-link" style="color:red;">删除</text> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </template> |
| | | </view> |
| | | <!-- 通过body插槽定义商品布局 --> |
| | | |
| | | </view> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | |
| | | import UIcon from '@/uview-components/uview-ui/components/u-icon/u-icon.vue'; |
| | | |
| | | import * as API_GOODS from "@/api/goods.js"; |
| | | |
| | | export default { |
| | | components: {}, |
| | | components: { UIcon }, |
| | | data() { |
| | | return { |
| | | formData: { |
| | | waterfall: false, // 布局方向切换 |
| | | status: 'loading', // 加载状态 |
| | | }, |
| | | params: { |
| | | pageNumber: 1, |
| | | pageSize: 10, |
| | | }, |
| | | data: [ |
| | | { |
| | |
| | | tipShow: false // 是否显示顶部提示框 |
| | | }; |
| | | }, |
| | | onLoad() { }, |
| | | onLoad() { |
| | | }, |
| | | onShow() { |
| | | if (this.$options.filters.tipsToLogin()) { |
| | | this.getGoodsList(); |
| | | } |
| | | }, |
| | | methods: { |
| | | load(data, ended) { |
| | | if (ended) { |
| | | this.formData.status = 'noMore' |
| | | } |
| | | |
| | | getGoodsList() { |
| | | uni.showLoading(); |
| | | API_GOODS.getStoreGoods( |
| | | this.params.pageNumber, |
| | | this.params.pageSize |
| | | ).then((res) => { |
| | | this.data = res.data.result.records; |
| | | |
| | | if (this.$store.state.isShowToast) { uni.hideLoading() }; |
| | | }); |
| | | }, |
| | | addGoods(id) { |
| | | console.log("addGoods:" + id); |
| | | |
| | | uni.navigateTo({ |
| | | url: `/pages/goods-manager/addGoods/addGoods${id ? "?id=" + id : ""}`, |
| | | }); |
| | |
| | | // 小程序 编译后会多一层标签,而其他平台没有,所以需要特殊处理一下 |
| | | /deep/ .uni-list { |
| | | /* #endif */ |
| | | height: calc(100vh - 100px - 80px - 60px); |
| | | display: flex; |
| | | flex-direction: row; |
| | | flex-wrap: wrap; |
| | |
| | | /deep/ |
| | | /* #endif */ |
| | | .uni-list-item--waterfall { |
| | | // width: 50%; |
| | | width: 98%; |
| | | display: flex; |
| | | box-sizing: border-box; |
| | | margin-bottom: 10px; |