From 40711118c33369ccad7ceda0fdd729bd9f117f65 Mon Sep 17 00:00:00 2001 From: loulijun2021 <1694218219@qq.com> Date: 星期六, 22 十月 2022 14:03:11 +0800 Subject: [PATCH] 1.安灯响应静态实现 --- pages/xtsy/index.html | 209 +++++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 164 insertions(+), 45 deletions(-) diff --git a/pages/xtsy/index.html b/pages/xtsy/index.html index 001b767..619fb75 100644 --- a/pages/xtsy/index.html +++ b/pages/xtsy/index.html @@ -19,9 +19,20 @@ <script type="text/javascript" src="../../js/axios.min.js"></script> <script type="text/javascript" src="../../js/http.js"></script> - - <link rel="stylesheet" href="../css/global.css" type="text/css" charset="utf-8" /> <script type="text/javascript" src="../../js/global.js"></script> + + + + <!-- <script src="http://121.196.36.24:8001/Scripts/jquery-3.4.1.min.js"></script> + <script src="http://121.196.36.24:8001/Scripts/jquery.signalR-2.2.2.min.js"></script> + <script src="http://121.196.36.24:8001/SignalR/Hubs"></script> --> + + <script src="../../js/jquery-3.4.1.min.js"></script> + <script src="../../js/jquery.signalR-2.2.2.min.js"></script> + <script src="../../js/Hubs.js"></script> + <script type="text/javascript" src="../../js/msg.js"></script> + + </head> <body> @@ -29,44 +40,84 @@ <div class="body"> - <van-nav-bar title="宸ヤ綔鍙�" @click-right="onClickRight"> + <!-- <object data="../../components/my_van_nav_bar.html" title='鎴�' width="100%" height="44"></object> --> + + <!-- <van-nav-bar title="宸ヤ綔鍙�" @click-right="onClickRight"> <template #right> <van-popover placement="bottom-end" :offset="[13,8]" v-model="showPopover" trigger="click" :actions="actions" @select="onSelect"> <template #reference> - <van-icon name="bars" size='20' color='#fff' /> + <van-badge :content="10" max='99'> + <van-icon name="bars" size='20' color='#fff' /> + </van-badge> + </template> + </van-popover> + </template> + </van-nav-bar> --> + + + <van-nav-bar title="宸ヤ綔鍙�" @click-right="onClickRight"> + <template #right> + <van-popover placement="bottom-end" :offset="[13,8]" v-model="showPopover" trigger="click"> + + <div class="topRight"> + <div class="topRightItem" @click="myMessageClick"> + <div> + <van-icon name="comment-o" + :badge="messageNumber!==0?(messageNumber>9?'9+':messageNumber):false" + size="1.28rem" style="margin-right: 8px;margin-top: 18px;" /> + </div> + <div style="font-size: 14px;border-bottom: 1px solid #eee;">鎴戠殑娑堟伅</div> + </div> + <div class="topRightItem" @click="topPopoverClick('閫�鍑虹櫥褰�')"> + <div> + <van-icon name="revoke" style="margin-right: 8px;" /> + </div> + <div style="font-size: 14px;">閫�鍑虹櫥褰�</div> + </div> + </div> + + <template #reference> + <van-badge :content="messageNumber" max='9' v-if='messageNumber!==0'> + <van-icon name="bars" size='20' color='#fff' /> + </van-badge> + <van-icon v-else name="bars" size='20' color='#fff' /> </template> </van-popover> </template> </van-nav-bar> - <van-swipe :autoplay="3000"> - <van-swipe-item v-for="(image, index) in images" :key="index"> - <img v-lazy="image" :src='image' style="background-size: 100% 100%;width: 100%;" /> - </van-swipe-item> - </van-swipe> - <van-grid :gutter="20" :border='false' square :column-num="3" style="margin: 30px auto 0; width: 90%;"> - <van-grid-item v-for="item in firstMenu" @click='vanGridItem(item)' :key="item" :text="item.name"> - <img :src="item.imgurl" alt="" - style="width: 56px;height:56px;margin-top: 10px;border-radius: 10px;"> - <div style="margin-top: 5px;font-size: 14px;color: #929399;">{{item.name}}</div> - </van-grid-item> - </van-grid> + <van-pull-refresh v-model="isLoading" @refresh="onRefresh"> + <van-swipe :autoplay="3000"> + <van-swipe-item v-for="(image, index) in images" :key="index"> + <img v-lazy="image" :src='image' style="background-size: 100% 100%;width: 100%;" /> + </van-swipe-item> + </van-swipe> - <van-action-sheet lazy-render :closeable='false' close-on-click-action close-on-click-overlay - safe-area-inset-bottom v-model="sheetShow" :title="firstMenuName"> - <van-grid :border='false' :gutter="5" square :column-num="3" style="width: 80%; margin: auto;"> - <van-grid-item v-for="item in secondMenu" @click='vanGridSecondItem(item)' :key="item" - icon="photo-o"> + <van-grid :gutter="20" :border='false' square :column-num="3" + style="margin: 30px auto 0; width: 90%;"> + <van-grid-item v-for="item in firstMenu" @click='vanGridItem(item)' :key="item" + :text="item.name"> <img :src="item.imgurl" alt="" - style="width: 48px;height:48px;margin-top: 10px;border-radius: 10px;"> - <div style="margin-top: 5px;font-size: 12px;color: #929399;">{{item.name}}</div> + style="width: 56px;height:56px;margin-top: 10px;border-radius: 10px;"> + <div style="margin-top: 5px;font-size: 14px;color: #929399;">{{item.name}}</div> </van-grid-item> </van-grid> - </van-action-sheet> - </div> + <van-action-sheet lazy-render :closeable='false' close-on-click-action close-on-click-overlay + safe-area-inset-bottom v-model="sheetShow" :title="firstMenuName"> + <van-grid :border='false' :gutter="5" square :column-num="3" style="width: 80%; margin: auto;"> + <van-grid-item v-for="item in secondMenu" @click='vanGridSecondItem(item)' :key="item" + icon="photo-o"> + <img :src="item.imgurl" alt="" + style="width: 48px;height:48px;margin-top: 10px;border-radius: 10px;"> + <div style="margin-top: 5px;font-size: 12px;color: #929399;">{{item.name}}</div> + </van-grid-item> + </van-grid> + </van-action-sheet> + </div> + </van-pull-refresh> <van-overlay :show="overlayShow" @click="overlayShow=false" /> @@ -78,6 +129,7 @@ el: '#app', data: function() { return { + isLoading: false, //涓嬫媺鍒锋柊 images: [ '../../static/images/swiper01.png', '../../static/images/swiper02.png', @@ -86,19 +138,24 @@ overlayShow: false, showPopover: false, actions: [{ - icon: 'description', - text: '鎿嶄綔鎸囧' - }, { - icon: 'award-o', - text: '鎴愬搧杩芥函' - }, { - icon: 'revoke', - text: '閫�鍑虹櫥褰�' - }], + icon: 'comment-o', + text: '瀹夌伅鍝嶅簲' + }, + { + icon: 'description', + text: '鎿嶄綔鎸囧' + }, { + icon: 'award-o', + text: '鎴愬搧杩芥函' + }, { + icon: 'revoke', + text: '閫�鍑虹櫥褰�' + } + ], firstMenu: [], //涓�绾ц彍鍗� firstMenuName: '', secondMenu: [], //浜岀骇鑿滃崟 - + messageNumber: 0, //鎴戠殑娑堟伅鏁板�� } }, created() { @@ -106,8 +163,39 @@ }, mounted() { this.getfirstMenu() + + this.getLoginAppAnDonMessage() + setInterval(() => { + this.getLoginAppAnDonMessage() + }, 1000 * 10) + }, methods: { + onRefresh() { + setTimeout(() => { + vant.Toast('鍒锋柊鎴愬姛'); + this.getfirstMenu() + this.getLoginAppAnDonMessage() + // vant.Notify('鍒锋柊鎴愬姛'); + this.isLoading = false; + + }, 1000); + }, + + // 鑾峰彇娑堟伅鎺ュ彛 + async getLoginAppAnDonMessage() { + const data = { + userid: localStorage.getItem('userid'), + usercode: localStorage.getItem('usercode'), + username: localStorage.getItem('username'), + usertype: localStorage.getItem('usertype'), + } + + const res = await post('Login/LoginAppAnDonMessage' + formatParams(data)) + this.messageNumber = res.data.length + // this.messageNumber=9 + }, + // 鑾峰彇涓�绾ц彍鍗� async getfirstMenu() { const data = { @@ -145,6 +233,12 @@ case '2044': url = '../sbgl/wxyz.html' break; + case '2090': + url = '../adgl/adhj.html' + break; + case '2091': + url = '../adgl/adxy.html' + break; } window.location = url }, @@ -153,16 +247,19 @@ this.overlayShow = true }, // 椤堕儴鍙冲浘鏍囦笅鎷夐�夋嫨 - onSelect(action) { - if (action.text === '鎿嶄綔鎸囧') { - topPopoverClick('鎿嶄綔鎸囧') - } else if (action.text === '鎴愬搧杩芥函') { - topPopoverClick('鎴愬搧杩芥函') - } else if (action.text === '閫�鍑虹櫥褰�') { - topPopoverClick('閫�鍑虹櫥褰�') - } - this.overlayShow = false - }, + // onSelect(action) { + // if (action.text === '鎿嶄綔鎸囧') { + // topPopoverClick('鎿嶄綔鎸囧') + // } else if (action.text === '鎴愬搧杩芥函') { + // topPopoverClick('鎴愬搧杩芥函') + // } else if (action.text === '閫�鍑虹櫥褰�') { + // topPopoverClick('閫�鍑虹櫥褰�') + // } + // this.overlayShow = false + // }, + myMessageClick() { + window.location = '../other/wdxx.html' + } } }) </script> @@ -188,5 +285,27 @@ color: #fff; letter-spacing: 2px; } + + .van-nav-bar__right { + padding: 0; + margin-right: 16px; + } + + .topRight { + width: 128px; + min-height: 40px; + display: flex; + flex-direction: column; + /* padding: 10px; */ + } + + .topRightItem { + display: flex; + height: 44px; + align-items: center; + line-height: 44px; + /* border-bottom: 1px dotted #000; */ + padding: 0 16px; + } </style> </html> -- Gitblit v1.9.3