SmartBeehive/pages/Apiary/early_Set .vue
2024-06-21 18:04:01 +08:00

152 lines
3.9 KiB
Vue

<template>
<view class="page">
<u-navbar :title="title" :border-bottom="false" :background="bgc" title-color='#000' title-size='36'
:title-bold='true' height='45' id="navbar">
</u-navbar>
<view class="tit">
蜂箱温度预警
<u-switch v-model="checked"></u-switch>
</view>
<view class="iptbox" >
<input type="text" class="ips" v-model="form.address" placeholder="请选择蜂场具体位置" placeholder-class="my-placeholder"
disabled />
<image src="https://api.ccttiot.com/smartmeter/img/static/ugAdKZm5ZHZ4to1cDsNI" mode=""></image>
</view>
<view class="tit">
蜂箱湿度预警
<u-switch v-model="checked"></u-switch>
</view>
<view class="iptbox" >
<input type="text" class="ips" v-model="form.address" placeholder="请选择蜂场具体位置" placeholder-class="my-placeholder"
disabled />
<image src="https://api.ccttiot.com/smartmeter/img/static/ugAdKZm5ZHZ4to1cDsNI" mode=""></image>
</view>
<view class="tit">
蜂箱重量预警
<u-switch v-model="checked"></u-switch>
</view>
<view class="iptbox" >
<input type="text" class="ips" v-model="form.address" placeholder="请选择蜂场具体位置" placeholder-class="my-placeholder"
disabled />
<image src="https://api.ccttiot.com/smartmeter/img/static/ugAdKZm5ZHZ4to1cDsNI" mode=""></image>
</view>
<view class="tit">
蜂箱进出量预警
<u-switch v-model="checked"></u-switch>
</view>
<view class="iptbox" >
<input type="text" class="ips" v-model="form.address" placeholder="请选择蜂场具体位置" placeholder-class="my-placeholder"
disabled />
<image src="https://api.ccttiot.com/smartmeter/img/static/ugAdKZm5ZHZ4to1cDsNI" mode=""></image>
</view>
<view class="tit">
蜂箱电量预警
<u-switch v-model="checked"></u-switch>
</view>
<view class="iptbox" >
<input type="text" class="ips" v-model="form.address" placeholder="请选择蜂场具体位置" placeholder-class="my-placeholder"
disabled />
<image src="https://api.ccttiot.com/smartmeter/img/static/ugAdKZm5ZHZ4to1cDsNI" mode=""></image>
</view>
<view class="tit">
蜂箱频率预警
<u-switch v-model="checked"></u-switch>
</view>
<view class="iptbox" >
<input type="text" class="ips" v-model="form.address" placeholder="请选择蜂场具体位置" placeholder-class="my-placeholder"
disabled />
<image src="https://api.ccttiot.com/smartmeter/img/static/ugAdKZm5ZHZ4to1cDsNI" mode=""></image>
</view>
<view class="tit">
电子围栏范围预警
<u-switch v-model="checked"></u-switch>
</view>
<view class="iptbox" >
<input type="text" class="ips" v-model="form.address" placeholder="请选择蜂场具体位置" placeholder-class="my-placeholder"
disabled />
<image src="https://api.ccttiot.com/smartmeter/img/static/ugAdKZm5ZHZ4to1cDsNI" mode=""></image>
</view>
</view>
</template>
<script>
export default {
data() {
return {
bgc: {
backgroundColor: " #F4FAF8",
},
title: "添加视频监控",
checked:false
}
},
onLoad() {
},
onShow() {
},
methods: {
}
}
</script>
<style lang="scss">
page {
background-color: #F4FAF8;
}
.page {
// position: relative;
padding-bottom: 200rpx;
width: 750rpx;
.tit {
margin-right: 49rpx;
display: flex;
flex-wrap: nowrap;
align-items: center;
justify-content: space-between;
margin-top: 40rpx;
margin-left: 50rpx;
font-weight: 600;
font-size: 32rpx;
color: #3D3D3D;
}
.iptbox {
display: flex;
align-items: center;
flex-wrap: nowrap;
padding: 22rpx;
margin: 28rpx auto 0;
width: 658rpx;
height: 88rpx;
background: #FFFFFF;
box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(0, 0, 0, 0.15);
border-radius: 20rpx 20rpx 20rpx 20rpx;
.ips {
width: 630rpx;
}
image {
width: 18rpx;
height: 32rpx;
}
.my-placeholder {
font-weight: 400;
font-size: 32rpx;
color: #808080;
}
}
}
</style>