Pārlūkot izejas kodu

feat(miniprogram): 更新注册弹窗并添加去体验功能

- 在注册弹窗右上角添加关闭按钮
- 新增去体验按钮,跳转到拍照页面
- 优化注册弹窗样式,使取消按钮居中显示
- 添加关闭按钮的样式
wzg 8 mēneši atpakaļ
vecāks
revīzija
6194ffdf6b

BIN
miniprogram/images/close.png


+ 5 - 0
miniprogram/pages/index/index.js

@@ -252,4 +252,9 @@ Page({
       });
     }
   },
+  goToExp() {
+    wx.switchTab({
+      url: "/pages/takePhoto/takePhoto",
+    });
+  },
 });

+ 23 - 22
miniprogram/pages/index/index.wxml

@@ -1,30 +1,31 @@
 <image class="main" mode="aspectFit" src="../../images/index.png"></image>
 <view bindtap="login" class="go">去拍照</view>
 <view wx:if="{{regModalVisible}}" class="reg-mask" catchtouchmove="preventTouchMove">
-    <view class="reg-mask-content">
-        <view class="reg-mask-text">您还未注册,是否注册?</view>
-        <view class="reg-mask-buttons">
-            <button class="reg-mask-button cancel" bindtap="hideRegModal">取消</button>
-            <button class="reg-mask-button register" open-type="getPhoneNumber" bindgetphonenumber="goToRegister">
-                去注册
-            </button>
-        </view>
+  <view class="reg-mask-content">
+    <image src="../../images/close.png" class="quit" bindtap="hideRegModal"></image>
+    <view class="reg-mask-text">您还未注册,是否注册?</view>
+    <view class="reg-mask-buttons">
+      <button class="reg-mask-button cancel" bindtap="goToExp">去体验</button>
+      <button class="reg-mask-button register" open-type="getPhoneNumber" bindgetphonenumber="goToRegister">
+        去注册
+      </button>
     </view>
+  </view>
 </view>
 <view wx:if="{{bindShipVisible}}" class="bind-ship">
-    <view class="bind-ship-content">
-        <view class="bind-ship-title">绑定船舶</view>
-        <view class="line">
-            <view class="label">船舶名称:</view>
-            <input class="input" model:value="{{shipName}}" type="text" placeholder="请输入船舶名称" />
-        </view>
-        <view class="line">
-            <view class="label">MMSI:</view>
-            <input class="input" model:value="{{shipMmsi}}" type="number" placeholder="请输入船舶MMSI" />
-        </view>
-        <view class="buttons">
-            <button class="button cancel" bindtap="hideBindShipModal">取消</button>
-            <button class="button confirm" bindtap="confirmBindShip">确认绑定</button>
-        </view>
+  <view class="bind-ship-content">
+    <view class="bind-ship-title">绑定船舶</view>
+    <view class="line">
+      <view class="label">船舶名称:</view>
+      <input class="input" model:value="{{shipName}}" type="text" placeholder="请输入船舶名称" />
     </view>
+    <view class="line">
+      <view class="label">MMSI:</view>
+      <input class="input" model:value="{{shipMmsi}}" type="number" placeholder="请输入船舶MMSI" />
+    </view>
+    <view class="buttons">
+      <button class="button cancel" bindtap="hideBindShipModal">取消</button>
+      <button class="button confirm" bindtap="confirmBindShip">确认绑定</button>
+    </view>
+  </view>
 </view>

+ 14 - 0
miniprogram/pages/index/index.wxss

@@ -58,6 +58,7 @@ image {
   border-radius: 10rpx;
   text-align: center;
   width: 80vw;
+  position: relative;
 }
 
 .reg-mask-text {
@@ -168,3 +169,16 @@ image {
   color: #fff;
   border: 1rpx solid #3e94f6;
 }
+/* reg-mask-content右上角叉叉 */
+.quit {
+  position: absolute;
+  height: 60rpx;
+  width: 60rpx;
+  z-index: 999;
+  top: -20rpx;
+  right: -20rpx;
+  font-size: 40rpx;
+  color: #333;
+  background: #fff;
+  border-radius: 50%;
+}