157 lines
3.2 KiB
Plaintext
157 lines
3.2 KiB
Plaintext
<template>
|
|
<cl-page>
|
|
<cl-topbar title="种子商店" />
|
|
|
|
<scroll-view scroll-y class="content" @scrolltolower="loadMore">
|
|
<view class="seed-grid">
|
|
<view
|
|
v-for="seed in seedList"
|
|
:key="seed.id"
|
|
class="seed-card"
|
|
@click="goDetail(seed.id)"
|
|
>
|
|
<image class="seed-image" :src="seed.imageUrl != null ? seed.imageUrl : '/static/images/seed.png'" mode="aspectFill" />
|
|
<view class="seed-info">
|
|
<text class="seed-name">{{ seed.name }}</text>
|
|
<text class="seed-variety">{{ seed.variety }}</text>
|
|
<view class="seed-meta">
|
|
<text class="seed-cycle">{{ seed.growthCycle }}天成熟</text>
|
|
</view>
|
|
<view class="seed-footer">
|
|
<text class="seed-price">¥{{ seed.price }}</text>
|
|
<cl-button type="primary" size="small" round @click.stop="onBuy(seed)">
|
|
购买
|
|
</cl-button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<cl-empty v-if="seedList.length === 0 && loading == false" text="暂无种子" />
|
|
</scroll-view>
|
|
</cl-page>
|
|
</template>
|
|
|
|
<script setup lang="uts">
|
|
import { ref, onMounted } from 'vue';
|
|
import { router, useCool } from '@/cool';
|
|
|
|
const { service } = useCool();
|
|
|
|
const seedList = ref<any[]>([]);
|
|
const loading = ref(false);
|
|
const page = ref(1);
|
|
|
|
async function loadSeeds() {
|
|
loading.value = true;
|
|
try {
|
|
const res = await service.nongchuang.seed.store({ page: page.value, size: 20 });
|
|
if (res != null) {
|
|
let list : any[] = [];
|
|
if (Array.isArray(res)) {
|
|
list = res as any[];
|
|
} else if (res != null) {
|
|
const data = res as UTSJSONObject;
|
|
const arr = data.getArray<any>("list");
|
|
list = arr != null ? arr : [];
|
|
}
|
|
seedList.value = list;
|
|
}
|
|
} catch (e) {
|
|
console.error('加载种子列表失败', e);
|
|
}
|
|
loading.value = false;
|
|
}
|
|
|
|
function loadMore() {
|
|
if (loading.value == false) {
|
|
page.value++;
|
|
loadSeeds();
|
|
}
|
|
}
|
|
|
|
function goDetail(id: number) {
|
|
router.push({ path: '/pages/seed/detail', query: { id } });
|
|
}
|
|
|
|
async function onBuy(seed: any) {
|
|
try {
|
|
await service.nongchuang.seed.purchase({ seedId: seed.id });
|
|
uni.showToast({ title: '购买成功', icon: 'success' });
|
|
} catch (e : any) {
|
|
const msg = e.message;
|
|
uni.showToast({ title: msg != null ? msg : '购买失败', icon: 'none' });
|
|
}
|
|
}
|
|
|
|
onMounted(() => {
|
|
loadSeeds();
|
|
});
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.content {
|
|
flex: 1;
|
|
padding: 20rpx;
|
|
}
|
|
|
|
.seed-grid {
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.seed-card {
|
|
width: 48%;
|
|
background: #fff;
|
|
border-radius: 16rpx;
|
|
overflow: hidden;
|
|
margin-bottom: 30rpx;
|
|
|
|
.seed-image {
|
|
width: 100%;
|
|
height: 240rpx;
|
|
}
|
|
|
|
.seed-info {
|
|
padding: 16rpx;
|
|
|
|
.seed-name {
|
|
font-size: 28rpx;
|
|
font-weight: bold;
|
|
color: #333;
|
|
}
|
|
|
|
.seed-variety {
|
|
font-size: 24rpx;
|
|
color: #999;
|
|
margin: 8rpx 0;
|
|
}
|
|
|
|
.seed-meta {
|
|
.seed-cycle {
|
|
font-size: 22rpx;
|
|
color: #52c41a;
|
|
background: #f6ffed;
|
|
padding: 4rpx 12rpx;
|
|
border-radius: 20rpx;
|
|
}
|
|
}
|
|
|
|
.seed-footer {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-top: 16rpx;
|
|
|
|
.seed-price {
|
|
font-size: 32rpx;
|
|
font-weight: bold;
|
|
color: #ff4d4f;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|