ajy/code/ajyApp/pages/device/mycases/mycases.nvue

<template>
	<view class="container">
		<scroll-view class="list" scroll-y="true">
			<view class="caseItem" v-for="(item, index) in list" :key="index">
				<text class="caseName">{{item.name}}</text>
				<text class="useBtn" @click="useCase(item.id)">使用</text>
			</view>
		</scroll-view>
	</view>
</template>

<script>
import request from '@/utils/http/request.js'

export default {
	data() {
		return {
			list: []
		}
	},
	onLoad() {
		this.getList()
	},
	methods: {
		async getList() {
			try {
				const res = await request({
					url: '/userCare/careList',
					method: 'POST',
					data: { page: 0, size: 100 }
				})
				if (res && res.data && res.data.records) {
					this.list = res.data.records.map(item => ({
						id: item.id,
						name: item.title || item.name || ''
					}))
				}
			} catch (e) {
				console.error('获取方案列表失败', e)
			}
		},
		useCase(id) {
			const deviceId = uni.getStorageSync('deviceId')
			if (!deviceId) {
				uni.navigateTo({
					url: `/pages/device/search/search?case=${id}`
				})
			} else {
				uni.navigateTo({
					url: `/pages/device/deviceInfo/deviceInfo?case=${id}&deviceId=${deviceId}`
				})
			}
		}
	}
}
</script>

<style>
.container {
	flex: 1;
	background-color: #ffffff;
}
.list {
	flex: 1;
	padding-left: 46rpx;
	padding-right: 46rpx;
	padding-top: 30rpx;
}
.caseItem {
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	width: 658rpx;
	height: 118rpx;
	background-color: #F3F3F3;
	border-radius: 20rpx;
	padding-left: 28rpx;
	padding-right: 28rpx;
	margin-bottom: 24rpx;
}
.caseName {
	font-size: 32rpx;
	color: #545F71;
}
.useBtn {
	font-size: 26rpx;
	color: #389588;
}
</style>