源文件

jeepay-ui-uapp-agent/components/newComponents/JButton/JButton.vue

@@ -0,0 +1,91 @@
+<template>
+  <view class="b-wrapper" :class="[buttonSize()]" :style="{ paddingBottom: bottom, marginTop: pdTop, padding: pd }">
+    <view
+      @tap.stop="handleTap"
+      class="b-main"
+      :style="{
+        color: color,
+        backgroundColor: bgColor,
+      }"
+      hover-class="u-cell-hover"
+      hover-stay-time="150"
+    >
+      <slot>登录</slot>
+    </view>
+  </view>
+  <view :style="{ height }" v-if="height"></view>
+</template>
+
+<script setup>
+import { reactive } from "vue"
+
+const props = defineProps({
+  color: {
+    type: String,
+    default: "#fff",
+  },
+  bgColor: {
+    type: String,
+    default: "$primaryColor",
+  },
+  size: {
+    type: String,
+    default: "",
+  },
+  bottom: {
+    type: String,
+    default: "75rpx",
+  },
+  pdTop: {
+    type: String,
+    default: "30rpx",
+  },
+  height: {
+    type: String,
+    default: "",
+  },
+  pd: {
+    type: String,
+  },
+})
+const size = reactive({
+  medium: "medium",
+  max: "max",
+})
+const buttonSize = () => {
+  return size[props.size]
+}
+const emits = defineEmits(["HandleTouch"])
+const handleTap = () => {
+  emits("HandleTouch")
+}
+</script>
+
+<style lang="scss" scoped>
+.b-wrapper {
+  padding: 50rpx;
+  .b-main {
+    position: relative;
+    font-size: 33rpx;
+    height: 110rpx;
+    background-color: $primaryColor;
+    border-radius: 20rpx;
+    outline: 0;
+    border: none;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-size: 33rpx;
+  }
+
+  .u-cell-hover {
+    opacity: 0.5;
+  }
+}
+.max {
+  padding: 50rpx;
+}
+.medium {
+  padding: 0 50rpx 50rpx 50rpx;
+}
+</style>