改价格

hdApp/src/admin/changePrice/components/Item2.vue

@@ -0,0 +1,344 @@
+<template>
+<view class="product">
+	<view class="item-cmd_bx">
+		<button v-if="Number(info.discountPrice)>0" @click.stop="cancelDiscountFn(info)" class="admin-button-com mini-btn blue" 
+			style="position:absolute;bottom:0upx;font-size:24upx;left:10upx;z-index:20;">取消特价</button>
+
+		<button v-if="info.reachNum && info.reachNum>0 && info.reachNumDiscount && info.reachNumDiscount>0" @click.stop="cancelFullOff(info)" class="admin-button-com mini-btn blue" 
+			style="position:absolute;bottom:0upx;font-size:24upx;left:10upx;z-index:40;">取消满减</button>
+
+		<view class="img_bx" @click="pageTo({url: '/admin/item/detail?id='+info.id})">
+			<block v-if="info.frontHide == 1">
+				<view class="sold-out">
+					<view class="hide">隐</view>
+				</view>
+			</block>
+			<block v-else>
+				<view v-if="info.status == 2" class="sold-out">
+					<view class="sold-out-xj">已下架</view>
+				</view>
+			</block>
+			<image :src="info.cover" style="width:160upx;height:160upx;" lazy-load="true" :lazy-load-margin="0"></image>
+		</view>
+		<view class="cmd-info_bx" @click="pageTo({url: '/admin/item/detail?id='+info.id})">
+			<view class="tit">
+				<text style="font-size:22upx;border:1upx solid #3385ff;color:white;background-color:#3385ff;margin-right:5upx;padding-left:5upx;padding-right:5upx;" 
+				v-if="frontHide == 1">隐</text>
+				<text style="font-size:22upx;border:1upx solid #3385ff;color:white;background-color:#3385ff;margin-right:5upx;padding-left:5upx;padding-right:5upx;" 
+				v-if="info.presell == 1">预售</text>
+				{{ info.name || "" }}
+				<text v-if="info.variety && info.variety ==1" class="show-color"></text>
+			</view>
+			<text class="hj-price">￥{{ info.hjPrice?parseFloat(info.hjPrice):0 }}</text>
+			<text class="kc">￥{{ info.price?parseFloat(info.price):0 }}</text>
+			<text class="sk-price">￥{{ info.skPrice?parseFloat(info.skPrice):0 }}</text>
+			<view class="num-open_bx">
+				<view>
+					<view class="open-bx" >
+						<view class="hd-price-area">
+							<input class="change-input" @click.stop @blur="savePrice" placeholder-style="color:#CCCCCC" v-model="modifyPrice" type="digit" placeholder="批发价" />
+						</view>
+						<view class="sk-price-area">
+							<input class="change-input" @click.stop @blur="savePrice" placeholder-style="color:#CCCCCC" v-model="skModifyPrice" type="digit" placeholder="零售价" />
+						</view>
+						<view class="hj-price-area">
+							<input class="change-input" @click.stop @blur="savePrice" placeholder-style="color:#CCCCCC" v-model="hjModifyPrice" type="digit" placeholder="大客价" />
+						</view>
+						<text v-if="info.reachNum && info.reachNum>0 && info.reachNumDiscount && info.reachNumDiscount>0" style="position:absolute;top:140upx;right:210upx;color:#3385FF;">
+							{{info.reachNum}}↓{{info.reachNumDiscount?parseFloat(info.reachNumDiscount):0}}
+						</text>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+
+	<view class="level-price">
+		<text>剩余 {{info.stock?parseFloat(info.stock):0}}</text>
+		<text style="position:absolute;left:40upx;">毛利 ￥{{ info.ml ? parseFloat(info.ml) : 0 }}</text>
+		<text style="position:absolute;right:50upx;">成本 ￥{{ parseFloat(info.cost) }}</text>
+	</view>
+
+</view>
+</template>
+<script>
+export default {
+	name: "item",
+	components: {
+	},
+	props: {
+		isPrice: {
+			type: Boolean,
+			default: true
+		},
+		isEdit: {
+			type: Boolean,
+			default: true
+		},
+		info: {
+			required: true
+		}
+	},
+	data() {
+		return {
+			hjModifyPrice:'',
+			modifyPrice:'',
+			skModifyPrice:'',
+			frontHide:0
+		};
+	},
+	watch: {
+		info: {
+			deep: true,
+			handler: function(info){
+				this.frontHide = info.frontHide
+			}
+		},
+		modifyPrice: {
+			handler(newValue) {
+				if(Number(newValue)>0){
+					let skMore = this.info.skMore ? Number(this.info.skMore) : 0
+					let hjAddPrice = this.info.hjAddPrice ? Number(this.info.hjAddPrice) : 0
+					let addPrice = this.info.addPrice ? Number(this.info.addPrice) : 0
+
+					let skAddNum = Number(skMore) - Number(addPrice)
+					skAddNum = skAddNum.toFixed(2)
+					let skAmount = Number(skAddNum) + Number(newValue)
+					if(skAmount>0){
+						skAmount = skAmount.toFixed(2)
+						skAmount = parseFloat(skAmount)
+						this.skModifyPrice = skAmount
+					}else{
+						this.skModifyPrice = ''
+					}
+
+					let hjSubNum = Number(addPrice) - Number(hjAddPrice)
+					hjSubNum = hjSubNum.toFixed(2)
+					let hjAmount = Number(newValue) - Number(hjSubNum)
+					if(hjAmount > 0){
+						hjAmount = hjAmount.toFixed(2)
+						hjAmount = parseFloat(hjAmount)
+						this.hjModifyPrice = hjAmount
+					}else{
+						this.hjModifyPrice = ''
+					}
+				}else{
+					this.skModifyPrice = ''
+					this.hjModifyPrice = ''
+				}
+			}
+		}
+	},
+	mounted(){
+		if(this.info){
+			this.frontHide = this.info.frontHide
+		}
+	},
+	methods: {
+		hideChangeFn(item,status){
+			this.$emit("hideChangeFn",item,status)
+		},
+		cancelPreSellFn(item){
+			this.$emit("cancelPreSellFn",item)
+		},
+		cancelFullOff(item){
+			this.$emit("cancelFullOff",item)
+		},
+		cancelDiscountFn(item){
+			this.$emit("cancelDiscountFn",item)
+		},
+		savePrice() {
+			if(Number(this.modifyPrice)>0 && Number(this.skModifyPrice) > 0 && Number(this.hjModifyPrice) > 0){
+				this.$emit("savePrice",this.modifyPrice,this.skModifyPrice,this.hjModifyPrice,this.info.id,1)
+			}else{
+				this.$emit("savePrice",this.modifyPrice,this.skModifyPrice,this.hjModifyPrice,this.info.id,0)
+			}
+		}
+	}
+};
+</script>
+<style lang="scss" scoped>
+.product{
+	height:230upx;
+	.level-price{
+		display:flex;
+		color:#CCCCCC;
+		text-align: right;
+		font-size:24upx;
+		justify-content:space-around;
+	}
+}
+.item-cmd_bx {
+	height:160upx;
+	position: relative;
+	margin-bottom: 20upx;
+	.img_bx {
+		height: 160upx;
+		width: 160upx;
+		position: absolute;
+		left: 0upx;
+		top: 0upx;
+		.sold-out{
+			z-index:10;
+			width:160upx;
+			height:160upx;
+			background-color:black;
+			position:absolute;
+			top:0;
+			left:0;
+			opacity: 0.6;
+			color:white;
+			text-align:center;
+			.sold-out-xj{
+				line-height:160upx;
+				font-size:28upx;
+			}
+			.hide{
+				line-height:160upx;
+				font-size:30upx;
+			}
+		}
+	}
+	.cmd-info_bx {
+		position: relative;
+		padding-left: 177upx;
+		&.active{
+			&:before{
+				content: ' ';
+				height: 22upx;
+				width: 22upx;
+				border-width: 2upx 2upx 0 0;
+				border-color: #b2b2b2;
+				border-style: solid;
+				-webkit-transform: matrix(0.5, 0.5, -0.5, 0.5, 0, 0);
+				transform: matrix(0.5, 0.5, -0.5, 0.5, 0, 0);
+				position: absolute;
+				top: 50%;
+				margin-top: -12upx;
+				right: 30upx;
+			}
+		}
+		& .tit {
+			font-size: 30upx;
+			font-weight: bold;
+			color: #333333;
+			padding-top: 0upx;
+			overflow: hidden;
+			white-space: nowrap;
+			text-overflow: ellipsis;
+			width:360upx;
+			.show-color{
+				display:inline-block;
+				width:25upx;
+				height:25upx;
+				background-color:rgb(9, 199, 9);
+				border-radius:15upx;
+				border:none;
+				margin-left:15upx;
+			}
+		}
+		& .hj-price{
+			color:green;
+			position: absolute;
+			top:48upx;
+			left:171upx;
+		}
+		& .kc {
+			color:red;
+			font-size:28upx;
+			font-weight:bold;
+			position: absolute;
+			top:86upx;
+			left:171upx;
+		}
+		& .sk-price{
+			color:#333333;
+			position: absolute;
+			top:130upx;
+			left:171upx;
+		}
+		& .num-open_bx {
+			display: flex;
+			align-items: center;
+			& .price {
+				font-size: 30upx;
+				color: red;
+				flex: 1;
+			}
+			& .open-bx {
+				color:#999999;
+				width:300upx;
+				text{
+					font-size: 24upx;
+				}
+				*.warn {
+					color: $redColor;
+				}
+				.hd-price-area{
+					width:180upx;
+					position: absolute;
+					top:37upx;
+					right:-30upx;
+					.change-input {
+						width: 150upx;
+						height: 60upx;
+						line-height: 60upx;
+						text-align: center;
+						background: #ffffff;
+						border: 1upx solid #b4b4b4;
+						border-radius: 4upx;
+						font-size: 25upx;
+						color:#777777;
+						display:inline-block;
+					}
+					.change-text{
+						font-size:22upx;
+					}
+				}
+				.sk-price-area{
+					width:180upx;
+					position: absolute;
+					top:115upx;
+					right:-30upx;
+					.change-input {
+						width: 150upx;
+						height: 60upx;
+						line-height: 60upx;
+						text-align: center;
+						background: #ffffff;
+						border: 1upx solid #b4b4b4;
+						border-radius: 4upx;
+						font-size: 25upx;
+						color:#777777;
+						display:inline-block;
+					}
+					.change-text{
+						font-size:22upx;
+					}
+				}
+				.hj-price-area{
+					width:130upx;
+					position: absolute;
+					top:75upx;
+					right:150upx;
+					.change-input {
+						width: 120upx;
+						height: 60upx;
+						line-height: 60upx;
+						text-align: center;
+						background: #ffffff;
+						border: 1upx solid #b4b4b4;
+						border-radius: 4upx;
+						font-size: 25upx;
+						color:#777777;
+						display:inline-block;
+					}
+					.change-text{
+						font-size:22upx;
+					}
+				}
+			}
+		}
+	}
+}
+</style>