yunxinwei-uniapp/pages/equipment/equipment.vue

<template>
	<view>
		<view class="goods-info">
			<view class="goods">
				<image src="../../static/goods/battery.png" mode="aspectFit"></image>
				<view class="info">
					<text class="goods-name">{{ record.equipmentName }}</text>
					<!-- <text class="goods-desc">归属门店：{{ record.merchantName }}</text> -->
					<text class="goods-desc">电池型号：{{ record.batteryModel }}</text>
					<text class="goods-desc">电池编号：{{ record.equipmentCode }}</text>
					<text class="goods-desc">是否激活：{{ record.isCtive == 0 ? '已激活' : '未激活' }}</text>
					<text class="goods-desc">BMS：{{ record.bms }}</text>
					<text class="goods-desc">工作状态：{{ record.workingStatus }}</text>
					<text class="goods-desc">租赁状态：{{ record.leaseStatus }}</text>
					<text class="goods-desc">电池状态：{{ record.batteryStatus }}</text>
					<text class="goods-desc">电池电量：{{ record.batteryPower }}</text>
					<text class="goods-desc">是否在线：{{ record.isOnline }}</text>
					<text class="goods-desc">总电压：{{ record.totalVoltage }}</text>
					<text class="goods-desc">剩余容量：{{ record.surplusCapacity }}</text>
					
					
					
					<text class="selling-point" v-if="record.equipmentCategory === '锂电池租赁'">全新电池！连续组满15个月电池归客户</text>
				</view>
			</view>
		</view>
		<view class="submit">
			<u-button type="primary" @click="onBuy">立即购买</u-button>
		</view>
		<!-- <view class="submit">
			<u-button type="success" :disabled="agree" @click="copyCode(record.equipmentCode)">复制设备编号</u-button>
		</view> -->
		<view class="submit">
			<u-button type="success" :disabled="agree" @click="gohome">返回首页</u-button>
		</view>
		
	</view>
</template>

<script>
	import { userId } from '@/config.js';
	import {
		getEquipment
	} from '@/websoft/api/equipment.js'
	import { getUser } from '@/websoft/api/user.js'
	import { addOrder } from '@/websoft/api/order.js'
	import { createOrderNo } from '@/utils/util.js'
	import store from '../../store';
	export default {
		components: {
			// Search
		},
		data() {
			return {
				record: {},
				// 正在加载中
				isLoading: true,
				// 当前选择的设备ID
				equipmentId: null,
				merchantId: null,
				merchantCode: null,
				show: true,
				mode: 'range',
				month: 6,
				agree: false,
				price: {
					batteryRent: 300,
					batteryDeposit: 300,
					batteryInsurance: 0
				},
				
			}
		},
		onLoad(option) {
			const app = this
			// 记录当前选择的门店ID
			console.log("option: ",option);
			app.equipmentId = Number(option.equipmentId)
			app.merchantId = Number(option.merchantId)
			app.merchantCode = option.merchantCode
			// 获取设备列表
			app.getEquipment()
		},
		methods: {
			getEquipment() {
				const app = this
				const {
					equipmentId
				} = this
				getEquipment(equipmentId).then(res => {
					app.record = res.data
					console.log("res2222: ", app.record);
				})
			},
			gohome(){
				uni.reLaunch({
					url: '/pages/index/index'
				})
			},
			onChangeStepper({ value }) {
				this.month = value
			},
			change(e) {
				console.log(e);
			},
			onInput(month) {
				this.month = month
			},
			onAgree(){
				this.agree = !this.agree
			},
			showXieyi(){
				this.$navTo('pages/help/xieyi')
			},
			copyCode(text){
				// #ifndef H5
				console.log("text: ",text);
				uni.setClipboardData({
					text: text,
					success: (result) => {
						this.$success("复制成功")
					}
				})
				// #endif
				// #ifdef H5
				let textarea = document.createElement("textarea")
				textarea.value = text
				textarea.readOnly = "readOnly"
				document.body.appendChild(textarea)
				textarea.select() // 选中文本内容
				textarea.setSelectionRange(0, info.length)
				uni.showToast({ //提示
				    title: '复制成功'
				})
				result = document.execCommand("copy")
				textarea.remove()
				// #endif
				//     copy() {
				//                 let result
				//                 // #ifndef H5
				//                 //uni.setClipboardData方法就是讲内容复制到粘贴板
				//                 uni.setClipboardData({
				//                     data: this.downUrl.url, //要被复制的内容
				//                     success: () => { //复制成功的回调函数
				//                         uni.showToast({ //提示
				//                             title: '复制成功'
				//                         })
				//                     }
				//                 });
				//                 // #endif
				
				                
				//             }
			},
			onBuy(){
				const app = this
				const { equipmentId } = this
				this.$navTo('pages/merchant/merchant', { equipmentId })
			}

		}
	}
</script>

<style lang="scss" scoped>
	.goods-info {
		background-color: #ffffff;
		border-radius: 12rpx;
		width: 700rpx;
		margin: 20rpx auto;

		.goods {
			padding: 20rpx;
			display: flex;

			image {
				width: 170rpx;
				height: 170rpx;
				margin: 20rpx;
			}

			.info {
				display: flex;
				flex-direction: column;
				padding: 20rpx;

				.goods-name {
					font-size: 34rpx;
					margin-bottom: 10rpx;
				}
				.goods-desc {
					font-size: 28rpx;
					color: #999999;
				}
				.selling-point{
					padding: 5px 0;
					color: #e6760e;
				}
			}
		}

		.between-time {
			width: 500rpx;
			margin: auto;
			padding-bottom: 20rpx;
			text-align: center;

			.select-slider {
				line-height: 2em;
				color: #e6760e;
			}
		}
	}

	.order {
		background-color: #ffffff;
		border-radius: 12rpx;
		width: 700rpx;
		margin: 20rpx auto;
		padding: 10rpx 0;

		.title {
			font-weight: bold;
			font-size: 30rpx;
			padding: 20rpx;
			display: flex;
			justify-content: space-between;
		}

		.xieyi {
			padding: 20rpx;
			font-size: 26rpx;
		}
	}

	.submit {
		border-radius: 12rpx;
		width: 700rpx;
		margin: 20rpx auto;
		padding: 10rpx 0;
	}
	.xieyi-text{
		color: #0000ff;
	}
	.fenqi{
		padding: 30rpx;
		border-top: 1px solid #eee;
		border-bottom: 1px solid #eee;
		.item{
			display: flex;
			justify-content: space-between;
			padding: 20rpx 0;
		}
	}
</style>