Browse Source

按钮增加点击动画效果

tanxue 1 month ago
parent
commit
445508fdd0

+ 3 - 2
components/dialog/nichengDialog.vue

@@ -7,8 +7,8 @@
 			<view class="tip-title">{{title}}</view>
 			<view class="tip-title">{{title}}</view>
 				<input class="duihuan-input" type="text" focus v-model="nichengValue" placeholder="请输入昵称" />
 				<input class="duihuan-input" type="text" focus v-model="nichengValue" placeholder="请输入昵称" />
 				<view class="tip-btn-box">
 				<view class="tip-btn-box">
-					<view class="not-confirm-btn" @click="handleClose">取消</view>
-					<view class="confirm-btn" @click="confirmBtn">确认</view>
+					<ezyActiveVue class="ezy-btn-active not-confirm-btn" @aclick="handleClose">取消</ezyActiveVue>
+					<ezyActiveVue class="ezy-btn-active confirm-btn" @aclick="confirmBtn">确认</ezyActiveVue>
 				</view>
 				</view>
 		</view>
 		</view>
 	 </view>
 	 </view>
@@ -17,6 +17,7 @@
 
 
 <script setup>
 <script setup>
 	import { ref } from 'vue';
 	import { ref } from 'vue';
+	import ezyActiveVue from "@/components/ezyActive/ezyActive.vue";
 	import {
 	import {
 		toast,
 		toast,
 	} from "@/utils/common";
 	} from "@/utils/common";

+ 3 - 2
components/dialog/tipBigDialog.vue

@@ -8,8 +8,8 @@
    <view class="tip-content" v-if="content">{{content}}</view>
    <view class="tip-content" v-if="content">{{content}}</view>
    <view class="tip-img" v-if="imgShow"></view>
    <view class="tip-img" v-if="imgShow"></view>
    <view class="tip-btn-box">
    <view class="tip-btn-box">
-    <view class="not-confirm-btn" @click="handleClose"></view>
-    <view class="confirm-btn" @click="confirmBtn"></view>
+    <ezyActiveVue class="ezy-btn-active not-confirm-btn" @aclick="handleClose"></ezyActiveVue>
+    <ezyActiveVue class="ezy-btn-active confirm-btn" @aclick="confirmBtn"></ezyActiveVue>
    </view>
    </view>
   </view>
   </view>
   </view>
   </view>
@@ -18,6 +18,7 @@
 
 
 <script setup>
 <script setup>
  import { ref } from 'vue';
  import { ref } from 'vue';
+ import ezyActiveVue from "@/components/ezyActive/ezyActive.vue";
  const props = defineProps({
  const props = defineProps({
    title: {
    title: {
      type: String,
      type: String,

+ 3 - 2
components/dialog/tipMiddleDialog.vue

@@ -7,8 +7,8 @@
 			<view class="tip-title">{{title}}</view>
 			<view class="tip-title">{{title}}</view>
 			<view class="tip-content">{{content}}</view>
 			<view class="tip-content">{{content}}</view>
 			<view class="tip-btn-box">
 			<view class="tip-btn-box">
-				<view class="not-confirm-btn" @click="handleClose">取消</view>
-				<view class="confirm-btn" @click="confirmBtn">确认</view>
+				<ezyActiveVue class="ezy-btn-active not-confirm-btn" @aclick="handleClose">取消</ezyActiveVue>
+				<ezyActiveVue class="ezy-btn-active confirm-btn" @aclick="confirmBtn">确认</ezyActiveVue>
 			</view>
 			</view>
 		</view>
 		</view>
 	 </view>
 	 </view>
@@ -17,6 +17,7 @@
 
 
 <script setup>
 <script setup>
 	import { ref } from 'vue';
 	import { ref } from 'vue';
+	import ezyActiveVue from "@/components/ezyActive/ezyActive.vue";
 	const props = defineProps({
 	const props = defineProps({
 	  title: {
 	  title: {
 	    type: String,
 	    type: String,

+ 3 - 2
components/dialog/tipSmallDialog.vue

@@ -7,8 +7,8 @@
 			<view class="tip-title">{{title}}</view>
 			<view class="tip-title">{{title}}</view>
 			<view class="tip-content">{{content}}</view>
 			<view class="tip-content">{{content}}</view>
 			<view class="tip-btn-box">
 			<view class="tip-btn-box">
-				<view class="not-confirm-btn" @click="handleClose">取消</view>
-				<view class="confirm-btn" @click="confirmBtn">确认</view>
+				<ezyActiveVue class="ezy-btn-active not-confirm-btn" @aclick="handleClose">取消</ezyActiveVue>
+				<ezyActiveVue class="ezy-btn-active confirm-btn" @aclick="confirmBtn">确认</ezyActiveVue>
 			</view>
 			</view>
 		</view>
 		</view>
 	 </view>
 	 </view>
@@ -17,6 +17,7 @@
 
 
 <script setup>
 <script setup>
 	import { ref } from 'vue';
 	import { ref } from 'vue';
+	import ezyActiveVue from "@/components/ezyActive/ezyActive.vue";
 	const props = defineProps({
 	const props = defineProps({
 	  title: {
 	  title: {
 	    type: String,
 	    type: String,

+ 1 - 1
components/ezyActive/ezyActive.vue

@@ -5,7 +5,7 @@
 </template>
 </template>
 <!--  父组件传值使用 :delay="500" -->
 <!--  父组件传值使用 :delay="500" -->
 <script setup>
 <script setup>
-import { defineProps, defineEmits } from 'vue'
+
 
 
 // 定义延迟时间的prop,默认值300ms
 // 定义延迟时间的prop,默认值300ms
 const props = defineProps({
 const props = defineProps({

+ 3 - 2
pages/chanpinMy/components/telDialog.vue

@@ -26,7 +26,7 @@
 						@input="changeYzmInput" />
 						@input="changeYzmInput" />
 					<view class="close-btn" v-if="bindObj.clearYzmIcon" @click="clearYzm"></view>
 					<view class="close-btn" v-if="bindObj.clearYzmIcon" @click="clearYzm"></view>
 				</view>
 				</view>
-				<view @click="bindBtn" class="my-bind-btn">绑定</view>
+				<ezyActiveVue @aclick="bindBtn" class="ezy-btn-active my-bind-btn">绑定</ezyActiveVue>
 			</view>
 			</view>
 
 
 		</view>
 		</view>
@@ -35,6 +35,7 @@
 <script>
 <script>
 	import cacheManager from '@/utils/cacheManager.js';
 	import cacheManager from '@/utils/cacheManager.js';
 	import captcha from "@/components/captcha4/index.vue";
 	import captcha from "@/components/captcha4/index.vue";
+	import ezyActiveVue from "@/components/ezyActive/ezyActive.vue";
 	import {
 	import {
 		telBind,
 		telBind,
 		sendCode
 		sendCode
@@ -70,7 +71,7 @@
 			}
 			}
 		},
 		},
 		components: {
 		components: {
-			captcha
+			captcha,ezyActiveVue
 		},
 		},
 		methods: {
 		methods: {
 			telClose() {
 			telClose() {