115 lines
2.8 KiB
Vue
115 lines
2.8 KiB
Vue
<script setup>
|
||
// 商品收藏
|
||
|
||
import {
|
||
ref
|
||
} from 'vue';
|
||
import apex from '@/components/header/apex'
|
||
import {
|
||
onReachBottom,
|
||
onPullDownRefresh,
|
||
onShow,
|
||
onLoad,
|
||
onReady,
|
||
} from '@dcloudio/uni-app';
|
||
//
|
||
import api from '@/api/index.js';
|
||
// util
|
||
import util from '@/common/js/util';
|
||
//
|
||
const setting = ref(false)
|
||
|
||
onLoad(() => {
|
||
// 获取列表
|
||
getList()
|
||
})
|
||
|
||
// 获取列表
|
||
function getList() {
|
||
api.shop.getCollectList({}).then(res => {
|
||
console.log(res)
|
||
})
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<view class="app">
|
||
<apex title="商品收藏">
|
||
<template #right>
|
||
<view class="f26" @click="setting = !setting">
|
||
<text v-if="setting">完成</text>
|
||
<text v-else>管理</text>
|
||
</view>
|
||
</template>
|
||
</apex>
|
||
|
||
<view class="list">
|
||
<view class="item oh mb20 plr30 bfff" v-for="(item,index) in 10" :key="index">
|
||
<!-- 店铺 -->
|
||
<view class="store line df aic ptb20 thd f1 f28">
|
||
<image class="wh50 br10"
|
||
src="https://img13.360buyimg.com/n1/jfs/t1/117234/35/34799/82687/6449f2b4Fd6e2eef9/a754c5e178c9e9be.jpg.avif"
|
||
mode="aspectFill" />
|
||
<view class="name ml10 c333">家纺专营店</view>
|
||
</view>
|
||
|
||
<!-- 商品信息 -->
|
||
<view class="product line df ptb20">
|
||
<view class="fmid mr10">
|
||
<template v-if="index == 0">
|
||
<uni-icons type="circle" size="40rpx" color="#aaa" />
|
||
</template>
|
||
<template v-else>
|
||
<uni-icons type="checkbox-filled" size="40rpx" color="#F8BA4D" />
|
||
</template>
|
||
</view>
|
||
|
||
<view class="poster wh160">
|
||
<image class="wh160 br10"
|
||
src="https://img13.360buyimg.com/n1/jfs/t1/117234/35/34799/82687/6449f2b4Fd6e2eef9/a754c5e178c9e9be.jpg.avif"
|
||
mode="aspectFill" />
|
||
</view>
|
||
|
||
<view class="info df fdc jcsb f1 ml20">
|
||
<view class="name c333 f28">靠枕 纯棉靠枕 车载居家 纯棉100% 卡通靠枕 人体工学</view>
|
||
|
||
<view class="other df aic">
|
||
<view class="price c333">
|
||
<text class="f20">￥</text>
|
||
<text class="f30">89</text>
|
||
</view>
|
||
<view class="count ml20 fs0 c999 f24">销量：0</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="spec line df ptb20 df aic c666 f24">
|
||
<text>已选规格： 升级款/小熊</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="fill" style="height: 180rpx;"></view>
|
||
|
||
<view class="footer rows plr30 bfff shadow">
|
||
<view class="c999 f26">已选择9款</view>
|
||
<view class="col df aic">
|
||
<view class="total mr20" v-if="!setting">
|
||
<text class="c333 f20">合计</text>
|
||
<text class="cFF9B27 f20">￥</text>
|
||
<text class="cFF9B27 f46">98</text>
|
||
</view>
|
||
<view class="btn primary w200">去结算</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<style lang="scss" scoped>
|
||
// 产品
|
||
.item {
|
||
.line+.line {
|
||
border-top: 2rpx solid #eee;
|
||
}
|
||
}
|
||
</style> |