修复inset兼容问题

components/confirm-popup/confirm-popup.vue

@@ -0,0 +1,270 @@
+<template>
+  <view v-if="visible" class="popup-mask" @touchmove.stop.prevent="noop">
+    <view class="popup-mask__backdrop" @click="handleMaskClick"></view>
+    <view class="popup-panel" :class="['popup-panel--' + status, panelClass]">
+      <view class="popup-panel__head">
+        <text class="popup-panel__title">{{ title }}</text>
+        <view v-if="showClose" class="popup-panel__close" @click="$emit('cancel')">
+          <image class="popup-panel__close-image" src="https://imgs.agrimedia.cn/bm-bmt/bmt-close.png" mode="aspectFit">
+          </image>
+        </view>
+      </view>
+
+      <view v-if="showStatusBlock" class="popup-panel__status">
+        <image class="popup-panel__status-image" :src="statusIcon" mode="aspectFit"></image>
+        <text v-if="message" class="popup-panel__status-text asset-number-font">{{
+          message
+        }}</text>
+      </view>
+      <text v-else-if="message" class="popup-panel__message asset-number-font">{{
+        message
+      }}</text>
+
+      <text v-if="description" class="popup-panel__description asset-number-font">{{
+        description
+      }}</text>
+
+      <view v-if="$slots.default" class="popup-panel__body">
+        <slot />
+      </view>
+
+      <view class="popup-panel__footer" :class="{ 'popup-panel__footer--single': !showCancel }">
+        <view v-if="showCancel" class="popup-panel__btn popup-panel__btn--ghost" style="height: 64rpx"
+          @click="$emit('cancel')">
+          {{ cancelText }}
+        </view>
+        <view class="popup-panel__btn popup-panel__btn--primary" style="height: 64rpx" @click="$emit('confirm')">
+          {{ confirmText }}
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  props: {
+    visible: {
+      type: Boolean,
+      default: false,
+    },
+    title: {
+      type: String,
+      default: "提示",
+    },
+    message: {
+      type: String,
+      default: "",
+    },
+    description: {
+      type: String,
+      default: "",
+    },
+    confirmText: {
+      type: String,
+      default: "确认",
+    },
+    cancelText: {
+      type: String,
+      default: "取消",
+    },
+    showCancel: {
+      type: Boolean,
+      default: true,
+    },
+    showClose: {
+      type: Boolean,
+      default: true,
+    },
+    closeOnMask: {
+      type: Boolean,
+      default: true,
+    },
+    status: {
+      type: String,
+      default: "default",
+    },
+    panelClass: {
+      type: String,
+      default: "",
+    },
+  },
+  computed: {
+    showStatusBlock() {
+      return this.status === "success" || this.status === "error";
+    },
+    statusIcon() {
+      if (this.status === "success") {
+        return "https://imgs.agrimedia.cn/bm-bmt/success.png";
+      }
+
+      if (this.status === "error") {
+        return "https://imgs.agrimedia.cn/bm-bmt/fail.png";
+      }
+
+      return "";
+    },
+  },
+  methods: {
+    noop() { },
+    handleMaskClick() {
+      if (this.closeOnMask) {
+        this.$emit("cancel");
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+@import "../../styles/tokens.scss";
+
+.popup-mask {
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  inset: 0;
+  z-index: 80;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 24rpx;
+}
+
+.popup-mask__backdrop {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  inset: 0;
+  background: rgba(5, 10, 22, 0.72);
+}
+
+.popup-panel {
+  position: relative;
+  width: 100%;
+  max-width: 600rpx;
+  padding: 30rpx 28rpx 32rpx;
+  border-radius: 28rpx;
+  border: 1px solid rgba(142, 157, 206, 0.14);
+  background: #2a2f4d;
+  box-shadow: 0 30rpx 70rpx rgba(0, 0, 0, 0.28);
+}
+
+.popup-panel__head {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-height: 44rpx;
+}
+
+.popup-panel__title {
+  display: block;
+  width: 100%;
+  padding: 0 56rpx;
+  font-size: 32rpx;
+  font-weight: 500;
+  text-align: center;
+  color: #ffffff;
+}
+
+.popup-panel__close {
+  position: absolute;
+  right: 0;
+  top: 50%;
+  transform: translateY(-50%);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 44rpx;
+  height: 44rpx;
+}
+
+.popup-panel__close-image {
+  width: 28rpx;
+  height: 28rpx;
+}
+
+.popup-panel__message {
+  display: block;
+  margin-top: 34rpx;
+  font-size: 30rpx;
+  line-height: 1.8;
+  color: #edf2ff;
+}
+
+.popup-panel__status {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-top: 46rpx;
+}
+
+.popup-panel__status-image {
+  width: 54rpx;
+  height: 54rpx;
+  flex-shrink: 0;
+}
+
+.popup-panel__status-text {
+  margin-left: 18rpx;
+  font-size: 24rpx;
+  font-weight: 600;
+  color: #edf2ff;
+}
+
+.popup-panel__description {
+  display: block;
+  margin-top: 34rpx;
+  font-size: 26rpx;
+  line-height: 1.7;
+  text-align: center;
+  color: rgba(201, 209, 233, 0.86);
+}
+
+.popup-panel__body {
+  margin-top: 22rpx;
+  font-size: 28rpx;
+}
+
+.popup-panel__footer {
+  display: flex;
+  align-items: center;
+  gap: 18rpx;
+  margin-top: 40rpx;
+}
+
+.popup-panel__footer--single {
+  justify-content: center;
+}
+
+.popup-panel__btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex: 1;
+  height: 64rpx;
+  border-radius: 12rpx;
+  font-size: 28rpx;
+  font-weight: 700;
+}
+
+.popup-panel__footer--single .popup-panel__btn {
+  flex: 0 0 232rpx;
+}
+
+.popup-panel__btn--ghost {
+  border: 1px solid rgba(157, 173, 221, 0.44);
+  background: rgba(77, 89, 129, 0.28);
+  color: #ffffff;
+}
+
+.popup-panel__btn--primary {
+  background: #02ABF1;
+  color: #ffffff;
+}
+</style>

manifest.json

@@ -1,6 +1,6 @@
 {
     "name" : "白马交易所",
-    "appid" : "__UNI__3EC3CC8",
+    "appid" : "__UNI__B250220",
     "description" : "",
     "versionName" : "1.0.0",
     "versionCode" : "100",