|
@@ -2,28 +2,19 @@
|
|
|
<view class="content">
|
|
<view class="content">
|
|
|
<view class="container">
|
|
<view class="container">
|
|
|
<view class="item_warp">
|
|
<view class="item_warp">
|
|
|
- <view class="title">
|
|
|
|
|
- 使用说明
|
|
|
|
|
- </view>
|
|
|
|
|
|
|
+ <view class="title">使用说明</view>
|
|
|
<view class="item">
|
|
<view class="item">
|
|
|
- <view class="text">
|
|
|
|
|
- 1.点【扫码连接】,扫描水表中的二维码;
|
|
|
|
|
- </view>
|
|
|
|
|
- <view class="text">
|
|
|
|
|
- 2.待进度显示“数据通讯”后,点【开启设备】启动水表;
|
|
|
|
|
- </view>
|
|
|
|
|
- <view class="text">
|
|
|
|
|
- 3.在水表上手动滑动,可启动、暂停、停止用水;手机APP也可直接停止用水。
|
|
|
|
|
- </view>
|
|
|
|
|
- <view class="text">
|
|
|
|
|
- 4.示意图如下:
|
|
|
|
|
- </view>
|
|
|
|
|
|
|
+ <view class="text">1.点【扫码连接】,扫描水表中的二维码;</view>
|
|
|
|
|
+ <view class="text">2.待进度显示“数据通讯”后,点【开启设备】启动水表;</view>
|
|
|
|
|
+ <view class="text">3.在水表上手动滑动,可启动、暂停、停止用水;手机APP也可直接停止用水。</view>
|
|
|
|
|
+ <view class="text">4.示意图如下:</view>
|
|
|
<view class="img">
|
|
<view class="img">
|
|
|
- <image class="img_scan" src="../static/images/qr-code.png" mode=""></image>
|
|
|
|
|
|
|
+ <image class="img_scan" src="https://wanzai-1306339220.cos.ap-shanghai.myqcloud.com/excelModel/qr-code.png" mode=""></image>
|
|
|
</view>
|
|
</view>
|
|
|
<view class="bot">
|
|
<view class="bot">
|
|
|
<label class="bot_text" @tap="child_noshow" hover-class="bot_text_hover_color">
|
|
<label class="bot_text" @tap="child_noshow" hover-class="bot_text_hover_color">
|
|
|
- <checkbox class="chk" /><text>以后不再出现</text>
|
|
|
|
|
|
|
+ <checkbox class="chk" />
|
|
|
|
|
+ <text>以后不再出现</text>
|
|
|
</label>
|
|
</label>
|
|
|
<text class="bot_text" @tap="child_cancel" hover-class="bot_text_hover_color">我知道了</text>
|
|
<text class="bot_text" @tap="child_cancel" hover-class="bot_text_hover_color">我知道了</text>
|
|
|
</view>
|
|
</view>
|
|
@@ -34,99 +25,99 @@
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
<script>
|
|
|
- export default {
|
|
|
|
|
- data() {
|
|
|
|
|
- return {
|
|
|
|
|
- chk: false
|
|
|
|
|
- }
|
|
|
|
|
|
|
+export default {
|
|
|
|
|
+ data() {
|
|
|
|
|
+ return {
|
|
|
|
|
+ chk: false
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ methods: {
|
|
|
|
|
+ child_noshow(e) {
|
|
|
|
|
+ this.chk = !this.chk
|
|
|
|
|
+ this.$emit('parent_noshow', this.chk)
|
|
|
},
|
|
},
|
|
|
- methods: {
|
|
|
|
|
- child_noshow(e) {
|
|
|
|
|
- this.chk = !this.chk
|
|
|
|
|
- this.$emit('parent_noshow', this.chk)
|
|
|
|
|
- },
|
|
|
|
|
- child_cancel() {
|
|
|
|
|
- this.$emit('parent_cancel', false)
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ child_cancel() {
|
|
|
|
|
+ this.$emit('parent_cancel', false)
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+}
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
<style scoped lang="scss">
|
|
<style scoped lang="scss">
|
|
|
- .content {
|
|
|
|
|
|
|
+.content {
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ height: 100%;
|
|
|
|
|
+
|
|
|
|
|
+ .container {
|
|
|
width: 100%;
|
|
width: 100%;
|
|
|
height: 100%;
|
|
height: 100%;
|
|
|
|
|
+ position: fixed;
|
|
|
|
|
+ top: 0;
|
|
|
|
|
+ left: 0;
|
|
|
|
|
+ background: rgba(0, 0, 0, 0.4);
|
|
|
|
|
|
|
|
- .container {
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- height: 100%;
|
|
|
|
|
- position: fixed;
|
|
|
|
|
- top: 0;
|
|
|
|
|
- left: 0;
|
|
|
|
|
- background: rgba(0, 0, 0, .4);
|
|
|
|
|
|
|
+ .item_warp {
|
|
|
|
|
+ width: 650rpx;
|
|
|
|
|
+ position: absolute;
|
|
|
|
|
+ top: 50%;
|
|
|
|
|
+ left: 50%;
|
|
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
|
|
+ padding: 40rpx 50rpx;
|
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
|
+ background: #fff;
|
|
|
|
|
+ border-radius: 10rpx;
|
|
|
|
|
|
|
|
- .item_warp {
|
|
|
|
|
- width: 650rpx;
|
|
|
|
|
- position: absolute;
|
|
|
|
|
- top: 50%;
|
|
|
|
|
- left: 50%;
|
|
|
|
|
- transform: translate(-50%, -50%);
|
|
|
|
|
- padding: 40rpx 50rpx;
|
|
|
|
|
- box-sizing: border-box;
|
|
|
|
|
- background: #fff;
|
|
|
|
|
- border-radius: 10rpx;
|
|
|
|
|
|
|
+ .title {
|
|
|
|
|
+ font-size: 32rpx;
|
|
|
|
|
+ color: #000;
|
|
|
|
|
+ font-weight: bold;
|
|
|
|
|
+ text-align: center;
|
|
|
|
|
+ margin-bottom: 30rpx;
|
|
|
|
|
+ }
|
|
|
|
|
|
|
|
- .title {
|
|
|
|
|
- font-size: 32rpx;
|
|
|
|
|
- color: #000;
|
|
|
|
|
- font-weight: bold;
|
|
|
|
|
- text-align: center;
|
|
|
|
|
- margin-bottom: 30rpx;
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ .text {
|
|
|
|
|
+ font-size: 32rpx;
|
|
|
|
|
+ color: #333;
|
|
|
|
|
+ line-height: 40rpx;
|
|
|
|
|
+ margin-bottom: 20rpx;
|
|
|
|
|
+ text-indent: 2em;
|
|
|
|
|
+ }
|
|
|
|
|
|
|
|
- .text {
|
|
|
|
|
- font-size: 32rpx;
|
|
|
|
|
- color: #333;
|
|
|
|
|
- line-height: 40rpx;
|
|
|
|
|
- margin-bottom: 20rpx;
|
|
|
|
|
- text-indent: 2em;
|
|
|
|
|
|
|
+ .img {
|
|
|
|
|
+ text-align: center;
|
|
|
|
|
+ margin: 30rpx 0;
|
|
|
|
|
+
|
|
|
|
|
+ .img_scan {
|
|
|
|
|
+ width: 300rpx;
|
|
|
|
|
+ height: 200rpx;
|
|
|
}
|
|
}
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .bot {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ flex-direction: row;
|
|
|
|
|
+ justify-content: space-around;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
|
|
|
- .img {
|
|
|
|
|
|
|
+ .bot_text {
|
|
|
|
|
+ width: 50%;
|
|
|
|
|
+ height: 70rpx;
|
|
|
|
|
+ line-height: 70rpx;
|
|
|
|
|
+ border-radius: 10rpx;
|
|
|
|
|
+ color: $my-color-primary;
|
|
|
|
|
+ font-size: 32rpx;
|
|
|
text-align: center;
|
|
text-align: center;
|
|
|
- margin: 30rpx 0;
|
|
|
|
|
|
|
|
|
|
- .img_scan {
|
|
|
|
|
- width: 300rpx;
|
|
|
|
|
- height: 200rpx;
|
|
|
|
|
|
|
+ .chk {
|
|
|
|
|
+ transform: scale(0.7);
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- .bot {
|
|
|
|
|
- display: flex;
|
|
|
|
|
- flex-direction: row;
|
|
|
|
|
- justify-content: space-around;
|
|
|
|
|
- align-items: center;
|
|
|
|
|
-
|
|
|
|
|
- .bot_text {
|
|
|
|
|
- width: 50%;
|
|
|
|
|
- height: 70rpx;
|
|
|
|
|
- line-height: 70rpx;
|
|
|
|
|
- border-radius: 10rpx;
|
|
|
|
|
- color: $my-color-primary;
|
|
|
|
|
- font-size: 32rpx;
|
|
|
|
|
- text-align: center;
|
|
|
|
|
-
|
|
|
|
|
- .chk {
|
|
|
|
|
- transform:scale(0.7);
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .bot_text_hover_color {
|
|
|
|
|
- background-color: $my-color-btn-background;
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ .bot_text_hover_color {
|
|
|
|
|
+ background-color: $my-color-btn-background;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+}
|
|
|
</style>
|
|
</style>
|