简柏林 / thingskit-app · Commits

Commit 6ad47a244e5ed53eb53def7ea10d2d160426bcfb

Authored by sqy
1 parent 401d83fd

fix:修复蒙层状态下可以滚动页面

Inline Side-by-side
Showing 3 changed files with 66 additions and 56 deletions
... ... @@ -47,8 +47,10 @@ import historyData from './tabDetail/historyData.vue';
47 47 import commondRecord from './tabDetail/CommandRecord.vue';
48 48 import { getDeviceKeys, getHistoryData } from './api/index.js';
49 49 import { formatToDate } from '@/plugins/utils.js';
  50 +import MescrollCompMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mixins/mescroll-comp.js";
50 51 import moment from 'moment';
51 52 export default {
  53 + mixins: [MescrollCompMixin],
52 54 components: {
53 55 fTabbar,
54 56 basicInfo,
... ...
... ... @@ -49,18 +49,19 @@
49 49 </view>
50 50
51 51 <!-- 下发命令 -->
52   - <u-modal :show="showModel" closeOnClickOverlay :showConfirmButton="false" width="350px" @close="hiddenModal">
  52 + <u-modal :show="showModel" closeOnClickOverlay :showConfirmButton="false" width="720rpx" @close="hiddenModal" @touchmove.stop.prevent="disabledScroll">
53 53 <view style="width: 100%; padding: 0 30rpx;">
54 54 <view style="text-align: center; font-weight:700;margin-bottom: 40rpx;">命令下发</view>
55 55 <view class="u-flex">
56 56 <text style="color: #333; font-size: 28rpx;font-weight:700;margin-right: 30rpx;">下发类型:</text>
57   - <u-radio-group v-model="commandType" placement="row" size="14">
  57 +
  58 + <u-radio-group v-model="commandType" placement="row">
58 59 <u-radio activeColor="#3388FF" label="OneWay" name="OneWay"></u-radio>
59 60 <view style="margin: 0 20rpx;"></view>
60 61 <u-radio activeColor="#3388FF" label="TwoWay" name="TwoWay"></u-radio>
61 62 </u-radio-group>
62 63 </view>
63   - <view style="margin-top: 28rpx;"><u--textarea placeholder="请输入命令内容" v-model="commandValue" /></view>
  64 + <view style="margin-top: 28rpx;width: 100%;"><u--textarea placeholder="请输入命令内容" v-model="commandValue" /></view>
64 65
65 66 <view class="button-group">
66 67 <view><u-button :customStyle="{ color: '#333' }" color="#e3e3e5" shape="circle" text="取消" @click="cancelCommand"></u-button></view>
... ... @@ -122,6 +123,9 @@ export default {
122 123 showModal() {
123 124 this.showModel = true;
124 125 },
  126 + disabledScroll() {
  127 + return;
  128 + },
125 129 hiddenModal() {
126 130 this.showModel = false;
127 131 },
... ... @@ -132,7 +136,7 @@ export default {
132 136 commandValue.additionalInfo = {
133 137 cmdType: 'API'
134 138 };
135   - await issueCommand(this.commandType, this.deviceDetail.tbDeviceId,commandValue);
  139 + await issueCommand(this.commandType, this.deviceDetail.tbDeviceId, commandValue);
136 140 this.hiddenModal();
137 141 } catch (e) {
138 142 uni.$u.toast('下发失败~');
... ...
... ... @@ -25,66 +25,66 @@
25 25 </view>
26 26 </view>
27 27 </u-sticky>
28   - <mescroll-body ref="mescrollRef" @init="mescrollInit" :up="upOption" :down="downOption" @down="downCallback" @up="upCallback">
29   - <view class="device-list">
30   - <view @click="openDeviceDetail(item.id, item.alarmStatus, item.lastOnlineTime, item.tbDeviceId)" class="list-item" v-for="item in list" :key="item.id">
31   - <view
32   - class="u-flex item"
33   - style="
34   - justify-content: flex-start;
35   - flex-direction: column;
36   - align-items: center;
37   - "
38   - >
39   - <view style="width: 450rpx; text-align: left">
40   - <text style="color: #333; font-size: 30rpx;font-weight: bold;">{{ item.name }}</text>
41   - </view>
42   - <view style="width: 450rpx; text-align: left; margin-top: 10rpx">
43   - <view style="color: #666; font-size: 14px;display: flex;">
44   - 设备编号:
45   - <view style="margin-left:16rpx">{{ item.sn }}</view>
  28 + <mescroll-body ref="mescrollRef" @init="mescrollInit" :up="upOption" :down="downOption" @down="downCallback" @up="upCallback">
  29 + <view class="device-list">
  30 + <view @click="openDeviceDetail(item.id, item.alarmStatus, item.lastOnlineTime, item.tbDeviceId)" class="list-item" v-for="item in list" :key="item.id">
  31 + <view
  32 + class="u-flex item"
  33 + style="
  34 + justify-content: flex-start;
  35 + flex-direction: column;
  36 + align-items: center;
  37 + "
  38 + >
  39 + <view style="width: 450rpx; text-align: left">
  40 + <text style="color: #333; font-size: 30rpx;font-weight: bold;">{{ item.name }}</text>
46 41 </view>
47   - </view>
48   - <view style="width: 450rpx; text-align: left; margin-top: 10rpx">
49   - <view style="color: #666; font-size: 14px;display: flex;">
50   - 所属组织:
51   - <view style="margin-left:16rpx">{{ item.organizationDTO.name }}</view>
  42 + <view style="width: 450rpx; text-align: left; margin-top: 10rpx">
  43 + <view style="color: #666; font-size: 14px;display: flex;">
  44 + 设备编号:
  45 + <view style="margin-left:16rpx">{{ item.sn }}</view>
  46 + </view>
  47 + </view>
  48 + <view style="width: 450rpx; text-align: left; margin-top: 10rpx">
  49 + <view style="color: #666; font-size: 14px;display: flex;">
  50 + 所属组织:
  51 + <view style="margin-left:16rpx">{{ item.organizationDTO.name }}</view>
  52 + </view>
52 53 </view>
53 54 </view>
54   - </view>
55   - <view class="item">
56   - <view class="u-flex" style="margin-top: -6rpx">
57   - <image
58   - style="
59   - width: 30rpx;
60   - height: 30rpx;
61   - margin-top: 5rpx;
62   - margin-right: 5rpx;
63   - "
64   - :src="item.deviceState === 'ONLINE' ? '../../static/online.png' : item.deviceState === 'INACTIVE' ? '../../static/unonline.png' : '../../static/baojing.png'"
65   - />
66   -
67   - <view>
68   - <text
  55 + <view class="item">
  56 + <view class="u-flex" style="margin-top: -6rpx">
  57 + <image
69 58 style="
70   - color: #377dff;
71   - font-size: 13px;
72   - margin-left: 5rpx;
73   - margin-top: 20rpx;
74   - "
75   - :style="{ color: item.deviceState === 'ONLINE' ? '#377DFF' : item.deviceState === 'INACTIVE' ? '#666666' : '#DE4437' }"
76   - >
77   - {{ item.deviceState === 'ONLINE' ? '在线' : item.deviceState === 'INACTIVE' ? '待激活' : '离线' }}
78   - </text>
  59 + width: 30rpx;
  60 + height: 30rpx;
  61 + margin-top: 5rpx;
  62 + margin-right: 5rpx;
  63 + "
  64 + :src="item.deviceState === 'ONLINE' ? '../../static/online.png' : item.deviceState === 'INACTIVE' ? '../../static/unonline.png' : '../../static/baojing.png'"
  65 + />
  66 +
  67 + <view>
  68 + <text
  69 + style="
  70 + color: #377dff;
  71 + font-size: 13px;
  72 + margin-left: 5rpx;
  73 + margin-top: 20rpx;
  74 + "
  75 + :style="{ color: item.deviceState === 'ONLINE' ? '#377DFF' : item.deviceState === 'INACTIVE' ? '#666666' : '#DE4437' }"
  76 + >
  77 + {{ item.deviceState === 'ONLINE' ? '在线' : item.deviceState === 'INACTIVE' ? '待激活' : '离线' }}
  78 + </text>
  79 + </view>
79 80 </view>
80 81 </view>
81 82 </view>
82 83 </view>
83   - </view>
84   - </mescroll-body>
  84 + </mescroll-body>
85 85 <!-- 设备筛选 -->
86   - <u-popup @close="close" closeable bgColor="#fff" :show="show" mode="bottom" :round="20">
87   - <view class="filter">
  86 + <u-popup @close="close" closeable bgColor="#fff" :show="show" mode="bottom" :round="20" @touchmove.stop.prevent="disabledScroll">
  87 + <view class="filter" @touchmove.stop.prevent="disabledScroll">
88 88 <view class="filter-title"><text>筛选条件</text></view>
89 89 <FilterItem :filterList="deviceStatus" title="设备状态" @clickTag="currentIndex => handleClickTag(currentIndex, deviceStatus)"></FilterItem>
90 90 <FilterItem :filterList="alarmStatus" title="告警状态" @clickTag="currentIndex => handleClickTag(currentIndex, alarmStatus)"></FilterItem>
... ... @@ -116,6 +116,7 @@ export default {
116 116 auto: false //是否在初始化后,自动执行downCallback; 默认true
117 117 },
118 118 upOption: {
  119 + isBounce: false,
119 120 auto: false // 不自动加载
120 121 },
121 122 show: false,
... ... @@ -217,6 +218,9 @@ export default {
217 218 }
218 219 },
219 220 methods: {
  221 + disabledScroll() {
  222 + return;
  223 + },
220 224 /*下拉刷新的回调 */
221 225 downCallback() {
222 226 //联网加载数据
... ... @@ -379,4 +383,4 @@ export default {
379 383 }
380 384 }
381 385 }
382   -</style>
  386 +</style>
... ...