JSY/jsy-app
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'master' of https://codeup.aliyun.com/66da74bcd660318010cc8b9c/jsy-app

Browse Source
This commit is contained in:
王丹 2024-09-19 18:14:08 +08:00
commit 73dc5e8336
1 changed files with 56 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

78
pages/index.vue
View File

@ -29,28 +29,52 @@
</view>
<view class="content-section">
<view class="grey-box">
<u-grid :border="false" col="4">
<u-grid-item class="click">
<view class="iconfont icon-threshold"></view>
<u-badge numberType="overflow" type="success" max="999" value="155"></u-badge>
<text class="text">总设备</text>
</u-grid-item>
<u-grid-item>
<view class="iconfont icon-jizhan"></view>
<u-badge numberType="overflow" type="success" max="999" value="15"></u-badge>
<text class="text">在线设备</text>
</u-grid-item>
<u-grid-item>
<view class="iconfont icon-lixian"></view>
<u-badge numberType="overflow" type="success" max="999" value="15"></u-badge>
<text class="text">离线设备</text>
</u-grid-item>
<u-grid-item>
<view class="iconfont icon-shangqing"></view>
<u-badge numberType="overflow" type="success" max="999" value="15"></u-badge>
<text class="text">土壤墒情</text>
</u-grid-item>
</u-grid>
<view style="z-index: 10; top: 0" :style="[isSticky ? 'position: sticky;':'']">
<u-grid :border="false" col="4" v-if="!isSticky">
<u-grid-item class="click">
<view class="iconfont icon-threshold"></view>
<u-badge numberType="overflow" type="success" max="999" value="155"></u-badge>
<text class="text">总设备</text>
</u-grid-item>
<u-grid-item>
<view class="iconfont icon-jizhan"></view>
<u-badge numberType="overflow" type="success" max="999" value="15"></u-badge>
<text class="text">在线设备</text>
</u-grid-item>
<u-grid-item>
<view class="iconfont icon-lixian"></view>
<u-badge numberType="overflow" type="success" max="999" value="15"></u-badge>
<text class="text">离线设备</text>
</u-grid-item>
<u-grid-item>
<view class="iconfont icon-shangqing"></view>
<u-badge numberType="overflow" type="success" max="999" value="15"></u-badge>
<text class="text">土壤墒情</text>
</u-grid-item>
</u-grid>
<u-grid :border="false" col="4" v-if="isSticky" style="background: #fff;">
<u-grid-item class="click">
<text class="text">总设备</text>
<view class="iconfont icon-threshold"></view>
<u-badge numberType="overflow" type="success" max="999" value="155"></u-badge>
</u-grid-item>
<u-grid-item>
<text class="text">总设备</text>
<view class="iconfont icon-jizhan"></view>
<u-badge numberType="overflow" type="success" max="999" value="15"></u-badge>
</u-grid-item>
<u-grid-item>
<text class="text">总设备</text>
<view class="iconfont icon-lixian"></view>
<u-badge numberType="overflow" type="success" max="999" value="15"></u-badge>
</u-grid-item>
<u-grid-item>
<text class="text">总设备</text>
<view class="iconfont icon-shangqing"></view>
<u-badge numberType="overflow" type="success" max="999" value="15"></u-badge>
</u-grid-item>
</u-grid>
</view>
<view class="card">
<u-collapse accordion>
<u-collapse-item>
@ -343,6 +367,7 @@
export default {
data() {
return {
isSticky: false,
show: false,
landList: [1, 2, 3],
value: false,
@ -357,6 +382,15 @@
plus.navigator.setFullscreen(false);
// #endif
},
onPageScroll(e) {
// 页面滚动触发事件的处理函数
// console.log(e.scrollTop); // 输出滚动位置的垂直距离
if (e.scrollTop >= 100) {
this.isSticky = true;
} else {
this.isSticky = false;
}
},
methods: {
ceshi(e) {
console.error("ceshi:", e);