源文件

jeepay-ui-uapp-cashier/pageMember/payMember/components/ConfirmPay.vue

@@ -0,0 +1,93 @@
+<template>
+  <uni-popup ref="popup" type="center">
+    <view class="c-wrapper" :style="{ '--v-primary': calcThemeColor() }">
+      <view class="c-title">会员余额支付</view>
+      <view class="c-amount">
+        <text>金额</text>
+        ￥{{ vdata.amount }}
+      </view>
+      <view class="but-wrapper">
+        <view class="cancel" @tap="close">取消</view>
+        <view class="confirm" @tap="confirm">确认支付</view>
+      </view>
+    </view>
+  </uni-popup>
+</template>
+
+<script setup>
+import { ref, reactive } from "vue"
+import { calcThemeColor } from "@/util/member.js"
+const vdata = reactive({})
+const popup = ref(null)
+const emits = defineEmits(['pay'])
+const open = (amount) => {
+  vdata.amount = amount
+  popup.value.open()
+}
+const close = () => popup.value.close()
+const confirm = () => {
+  emits('pay')
+}
+defineExpose({ open, close })
+</script>  
+
+<style lang="scss" scoped>
+.c-wrapper {
+  width: 650rpx;
+  height: 508rpx;
+  padding: 30rpx;
+  box-sizing: border-box;
+  background-color: #fff;
+  border-radius: 20rpx;
+
+  .c-title {
+    margin: 50rpx 0 70rpx 0;
+    font-weight: bold;
+    text-align: center;
+  }
+
+  .remarks-content {
+    margin: 30rpx 0;
+  }
+
+  .c-amount {
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+    color: #000000ff;
+    font-size: 50rpx;
+    font-weight: 500;
+
+    text {
+      margin-bottom: 20rpx;
+      color: #808080ff;
+      font-size: 30rpx;
+    }
+  }
+
+  .but-wrapper {
+    display: flex;
+    margin-top: 50rpx;
+    justify-content: space-between;
+    view {
+      flex: 0 0 45%;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      height: 90rpx;
+      color: #fff;
+      border-radius: 15rpx;
+    }
+
+    .cancel {
+      color: #808080ff;
+    }
+    .confirm {
+      width: 350rpx;
+      height: 110rpx;
+      border-radius: 20rpx;
+      background-color: var(--v-primary);
+    }
+  }
+}
+</style>