From 469c1e29f7a91cbc8323cdc42eb97b9f6748a33c Mon Sep 17 00:00:00 2001
From: YeMingfei666 <1619116647@qq.com>
Date: Sun, 29 Sep 2024 16:14:06 +0800
Subject: [PATCH] =?UTF-8?q?=E5=B0=86=E6=89=93=E6=8A=98=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E6=8F=90=E5=8F=96=E5=88=B0=E5=85=A8=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/my-components/edit-discount.vue | 203 +++++++++++++++++++++
 1 file changed, 203 insertions(+)
 create mode 100644 components/my-components/edit-discount.vue

diff --git a/components/my-components/edit-discount.vue b/components/my-components/edit-discount.vue
new file mode 100644
index 0000000..5ca910e
--- /dev/null
+++ b/components/my-components/edit-discount.vue
@@ -0,0 +1,203 @@
+<template>
+	<my-model ref="model" :title="title" iconColor="#000" @close="resetForm">
+		<template #desc>
+			<view class="u-text-left u-p-30 color-666">
+				<view class="u-m-t-32 u-flex ">
+					<view>应付金额</view>
+					<view class="u-m-l-32">
+						{{form.price}}
+					</view>
+				</view>
+				<view class="u-m-t-40 u-flex ">
+					<view>实收金额</view>
+					<view class="u-m-l-32 border-bottom u-flex-1">
+						<uni-easyinput style="digit" @input="currentPriceInput" @change="currentPriceChange" paddingNone :inputBorder="false" 
+						v-model="form.currentPrice"
+							placeholder="输入实际金额"></uni-easyinput>
+					</view>
+				</view>
+				<view class="u-m-t-54 u-flex ">
+					<view>优惠折扣</view>
+					<view class="u-m-l-32 u-flex-1 u-flex border-bottom">
+						<view class="u-flex-1">
+							<uni-easyinput @input="discountInput"  @change="discountChange" style="digit" paddingNone :inputBorder="false" 
+							v-model="form.discount"
+								placeholder="输入折扣"></uni-easyinput>
+						</view>
+						<view class="u-font-32 color-333">%</view>
+					</view>
+					
+				</view>
+			</view>
+		</template>
+		<template #btn>
+			<view class="u-p-30">
+				<view class="u-m-t-10">
+					<my-button @tap="confirm" shape="circle" >修改</my-button>
+					<view class="">
+						<my-button @tap="close" type="cancel" bgColor="#fff" >取消</my-button>
+					</view>
+				</view>
+			</view>
+		</template>
+	</my-model>
+</template>
+
+<script setup>
+	import {
+		reactive,
+		nextTick,
+		ref,watch
+	} from 'vue';
+	import myModel from '@/components/my-components/my-model.vue'
+	import myButton from '@/components/my-components/my-button.vue'
+	import myTabs from '@/components/my-components/my-tabs.vue'
+	import infoBox from '@/commons/utils/infoBox.js'
+	const props = defineProps({
+		title: {
+			type: String,
+			default: ''
+		},
+		data: {
+			type: Array,
+			default: []
+		},
+		discount:{
+			type: [Number,String],
+			default:100
+		},
+		price: {
+			type: [Number,String],
+			default: 0
+		}
+	})
+	function currentPriceInput(newval){
+		form.discount=(newval*100/form.price).toFixed()
+	}
+	function discountInput(newval){
+		form.currentPrice=(form.price*newval/100).toFixed(2)
+	}
+	function currentPriceChange(newval){
+		if(newval<0){
+			form.currentPrice=0
+			form.discount=100
+			return infoBox.showToast('实收金额不能小于0')
+		}
+		if(newval>props.price){
+			form.currentPrice=props.price
+			form.discount=0
+			return infoBox.showToast('实收金额不能大于应付金额')
+		}
+	}
+	function discountChange(newval){
+		if(newval<0){
+			form.currentPrice=props.price
+			form.discount=0
+			return infoBox.showToast('优惠折扣不能小于0')
+		}
+		if(newval>100){
+			form.discount=100
+			form.currentPrice=0
+			return infoBox.showToast('优惠折扣不能大于100')
+		}
+	}
+	
+	const $form = {
+		price:props.price,
+		currentPrice: props.price,
+		discount: 100
+	}
+	const form = reactive({
+		...$form
+	})
+	watch(()=>props.price,(newval)=>{
+		console.log(newval);
+		form.price=newval
+		form.currentPrice=newval
+	})
+	function resetForm() {
+		Object.assign(form, {
+			...$form
+		})
+	}
+
+	const model = ref(null)
+
+	function open() {
+		model.value.open()
+		form.price=props.price
+		form.currentPrice=props.price
+		form.discount=props.discount
+	}
+
+	function close() {
+		model.value.close()
+	}
+	const emits = defineEmits(['confirm'])
+
+	function confirm() {
+		console.log(form);
+		emits('confirm',{...form,currentPrice:Number(form.currentPrice).toFixed(2)})
+		close()
+	}
+	defineExpose({
+		open,
+		close
+	})
+</script>
+
+<style lang="scss">
+	.lh34 {
+		line-height: 34rpx;
+	}
+
+	.tag {
+		background-color: #fff;
+		border: 1px solid #E5E5E5;
+		line-height: inherit;
+		font-size: 24rpx;
+		color: #666666;
+		padding: 6rpx 20rpx;
+		border-radius: 8rpx;
+
+		&.active {
+			border-color: #E6F0FF;
+			color: $my-main-color;
+		}
+	}
+
+	.hover-class {
+		background-color: #E5E5E5;
+	}
+
+	.discount {
+		.u-absolute {
+			top: 0;
+			bottom: 0;
+			right: 0;
+		}
+	}
+
+	.bg1 {
+		background: #F7F7FA;
+	}
+
+	.tab {
+		padding: 0 80rpx;
+	}
+
+	.border {
+		border: 1px solid #E5E5E5;
+		border-radius: 4rpx;
+	}
+
+	.input-box {
+		padding: 22rpx 32rpx;
+		font-size: 28rpx;
+		color: #666;
+	}
+
+	.placeholder-class {
+		font-size: 28rpx;
+	}
+</style>
\ No newline at end of file