zhongshen_project/addon/cashier---/source/os/components/ns-goods-sku/ns-goods-sku.vue

<template>
	<view class="ns-record">
		<view class="title">
			价格库存
			<text class="iconfont iconguanbi1" @click="close"></text>
		</view>
		<view class="table">
			<view class="table-th">
				<view class="table-td" style="min-width: 35%;max-width: 35%;">规格名称</view>
				<view class="table-td">统一售价</view>
				<view class="table-td" v-if="is_unify_price == 0">独立售价</view>
				<view class="table-td">库存</view>
			</view>
			<scroll-view scroll-y="true" class="table-tb">
				<view class="table-tr" v-for="(item, index) in sku_list" :key="index">
					<view class="table-td" style="min-width: 35%;max-width: 35%;">{{ item.spec_name ? item.spec_name : item.goods_name }}</view>
					<view class="table-td">{{ item.discount_price }}</view>
					<view class="table-td input-wrap" v-if="is_unify_price == 0">
						<input class="input" v-model="item.store_price" type="digit" />
						<view class="unit">元</view>
					</view>
					<view class="table-td input-wrap">
						<block v-if="storeInfo.stock_type == 'store'">
							<input class="input" v-model="item.stock" type="digit" />
							<view class="unit">{{ item.unit }}</view>
						</block>
						<view v-else>{{ item.stock }}</view>
					</view>
				</view>
			</scroll-view>
			<view class="pop-bottom"><button class="primary-btn" @click="save()">确定</button></view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			goods_sku_list: [],
			flag: true,
			store: null
		};
	},
	props: {
		goods_id: {
			type: Number,
			default: () => {
				return 0;
			}
		},
		sku_list: {
			type: Array,
			default: () => {
				return [];
			}
		},
		is_unify_price: {
			type: Number,
			default: () => {
				return 0;
			}
		}
	},

	mounted() {},
	created() {
		this.getGoodsSku();
	},
	methods: {
		getGoodsSku() {
			this.goods_sku_list = [];
			Object.keys(this.sku_list).forEach(key => {
				let data = this.sku_list[key];
				let obj = {
					sku_id: data.sku_id,
					price: data.store_price ? data.store_price : data.discount_price
				};
				if (this.storeInfo && this.storeInfo.stock_type == 'store') {
					obj.stock = data.stock;
				}
				this.goods_sku_list.push(obj);
			});
		},
		save() {
			this.getGoodsSku();
			if (!this.flag) return false;
			this.flag = false;
			uni.showLoading({
				title: '请求处理中'
			});
			this.$api.sendRequest({
				url: '/cashier/storeapi/goods/editgoods',
				data: {
					goods_sku_list: JSON.stringify(this.goods_sku_list)
				},
				success: res => {
					uni.hideLoading();
					this.$util.showToast({
						title: res.message
					});
					if (res.code >= 0) {
						this.$root.$refs.goodsListTable.load();
						this.close();
					} else {
						this.flag = true;
					}
				}
			});
		},

		// 弹窗关闭
		close() {
			this.$emit('close');
		}
	}
};
</script>

<style lang="scss" scoped>
.ns-record {
	width: 100%;
	height: 100%;
	background: #ffffff;
	border-radius: 0.04rem;
	min-height: 2rem;
	padding-bottom: 0.6rem;
	.title {
		width: 100%;
		height: 0.5rem;
		border-bottom: 0.01rem solid #e6e6e6;
		font-size: 0.16rem;
		line-height: 0.5rem;
		text-align: center;
		position: relative;
		font-weight: bold;
		.iconguanbi1 {
			font-size: 0.2rem;
			position: absolute;
			top: 50%;
			right: 0.15rem;
			transform: translateY(-50%);
			font-weight: 500;
		}
	}
	.selectbox {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		padding: 0.15rem;
		box-sizing: border-box;
		.item-select1 {
			display: flex;
			align-items: center;
			margin-bottom: 0.2rem;
			margin-right: 0.4rem;
			.slect1-left {
				min-width: 1rem;
				text-align: right;
			}
			.slect1-right {
				width: 2.1rem;
				height: 0.3rem;
				display: flex;
				align-items: center;
				padding-right: 0.15rem;
				box-sizing: border-box;
				margin-left: 0.1rem;
				border: 0.01rem solid #e6e6e6;
				padding-left: 0.15rem;
				.uni-input {
					width: 1.7rem;
					height: 100%;
					display: flex;
					align-items: center;
					justify-content: space-between;
					text-overflow: ellipsis;
					overflow: hidden;
					white-space: nowrap;
					.iconxiala {
						font-size: 0.18rem;
					}
				}
			}
			.slect1-right2 {
				width: 80%;
				display: flex;
				align-items: center;
				margin-left: 0.1rem;
				text {
					margin: 0 0.15rem;
				}
			}
		}
	}
	.table {
		width: 100%;
		height: 4rem;
		padding: 0.15rem;
		box-sizing: border-box;

		.table-th {
			width: 100%;
			height: 0.5rem;
			display: flex;
			align-items: center;
			justify-content: space-between;
			background: #f7f8fa;

			box-sizing: border-box;
		}
		.table-td {
			display: flex;
			flex: 1;
			padding: 0 0.15rem;
		}

		.table-tb {
			width: 100%;
			height: calc(100% - 0.5rem);
			.table-tr {
				display: flex;
				align-items: center;
				justify-content: space-between;
				width: 100%;
				height: 0.5rem;
				box-sizing: border-box;
				border-bottom: 0.01rem solid #e6e6e6;
			}
		}
	}
}

/deep/ .uni-date-single {
	height: 0.3rem;
}
.input-wrap {
	height: 100%;
	line-height: 0.5rem;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	font-size: 0.14rem;
	display: flex;
	align-items: center;

	.input {
		width: 0.7rem;
		height: 0.35rem;
		border: 0.01rem solid #e6e6e6;
		padding: 0 0.1rem;
		border-top-left-radius: 0.03rem;
		border-bottom-left-radius: 0.03rem;
	}
	.unit {
		background-color: #eee;
		height: 0.35rem;
		width: 0.35rem;
		text-align: center;
		line-height: 0.35rem;
		border: 0.01rem solid #e6e6e6;
		border-left: 0;
		border-top-right-radius: 0.03rem;
		border-bottom-right-radius: 0.03rem;
	}
}
.save {
	height: 0.3rem;
	line-height: 0.3rem;
}

.pagination {
	width: 100%;
	margin-top: 0.2rem;
}
.pop-bottom {
	padding: 0.1rem;
	height: 0.65rem;
	border-top: 0.01rem solid #eee;
	button {
		width: 1rem;
	}
}
</style>