<template> <!-- --> <view> <!-- 添加设备 --> <view @click="addSebei" class="add-binding"> <image src="../../../static/imgs/add.png" mode=""></image> <text>添加设备</text> </view> <view class="binding-wrp"> <!-- 设备 --> <view v-for="(item,index) in list" class="binding"> <image :src="item.equipment.equipment_image" mode=""></image> <view> <text>{{item.equipment.equipment_name}}</text> <text>到期时间: {{item.expire_time}}</text> </view> </view> </view> </view> </template> <script> import request from "../../../App.vue" export default { data() { return { list:'', equipment_id:'' }; }, methods:{ addSebei(){ this.$wxsdk.scanQRCode(res => { this.equipment_id = res.resultStr const data = { equipment_id : this.equipment_id } request.post('api/user/bindEquipment',data).then(r=>{ uni.reLaunch({ url:'/pages/user/binding/binding' }) }) }); } }, onLoad:function(){ request.post('api/user/equipmentList').then(r=>{ if(r.code == 1){ this.list = r.data.data } }) } } </script> <style lang="scss" scoped> *{ box-sizing: border-box; margin: 0; padding: 0; } .binding-wrp{ >view:first-child{ margin-top: 48rpx; } } .binding{ width: 686rpx; margin: 0 auto; background: #ffffff; border-radius: 16rpx; display: flex; align-items: center; padding-top: 32rpx; padding-bottom: 32rpx; padding-left: 32rpx; >image{ width: 160rpx; height: 160rpx; } >view{ display: flex; margin-left: 24rpx; flex-direction: column; >text:first-child{ margin-bottom: 46rpx; color: #323233; font-size: 28rpx; } >text:last-child{ color: #999999; font-size: 26rpx; } } } .add-binding{ width: 686rpx; margin: 0 auto; padding-top: 24rpx; padding-bottom: 24rpx; background-color: white; display: flex; justify-content: center; align-items: center; margin-top: 48rpx; >image{ width: 32rpx; height: 32rpx; margin-right: 16rpx; } } </style>