<template>
	<view class="warningSet">


		<!-- <template slot="top">
			<div class="tips">长按卡片可上下拖动排序</div>
		</template> -->
		<div class="item-list">
			<div class="item" :style="goods_1.const?'':'background: #E8E8E8'">
				<view class="" @click="kaibtnone(goods_1)">
					<image class="one" v-if="goods_1.const"
						:src="$util.img('upload/weapp/pageSalesman/reportForm/eye.png')" mode="widthFix">
						<image class="two" v-else :src="$util.img('upload/weapp/pageSalesman/warning_hide.png')"
							mode="widthFix">
				</view>
				近<u-input v-model="goods_1.num" border="bottom" inputAlign="center" style="width: 80rpx;"></u-input>
				天搜索大于
				<u-input v-model="goods_1.limit_num" inputAlign="center" border="bottom" style="width: 80rpx;">
				</u-input>
				次但未在售商品
			</div>

			<div class="item" :style="goods_2.const?'':'background: #E8E8E8'">
				<view class="" @click="kaibtnone(goods_2)">
					<image class="one" v-if="goods_2.const"
						:src="$util.img('upload/weapp/pageSalesman/reportForm/eye.png')" mode="widthFix">
					<image class="two" v-else :src="$util.img('upload/weapp/pageSalesman/warning_hide.png')"
							mode="widthFix">
				</view>
				上架超<u-input v-model="goods_2.num" border="bottom" inputAlign="center" style="width: 100rpx;">
				</u-input>天无销量新商品
			</div>


			<div class="item" :style="goods_3.const?'':'background: #E8E8E8'">
				<view class="" @click="kaibtnone(goods_3)">
					<image class="one" v-if="goods_3.const"
						:src="$util.img('upload/weapp/pageSalesman/reportForm/eye.png')" mode="widthFix">
						<image class="two" v-else :src="$util.img('upload/weapp/pageSalesman/warning_hide.png')"
							mode="widthFix">
				</view>
				近<u-input v-model="goods_3.num" border="bottom" inputAlign="center" style="width: 80rpx;"></u-input>
				天无销量老商品
			</div>

			<div class="item" :style="goods_4.const?'':'background: #E8E8E8'">
				<view class="" @click="kaibtnone(goods_4)">
					<image class="one" v-if="goods_4.const"
						:src="$util.img('upload/weapp/pageSalesman/reportForm/eye.png')" mode="widthFix">
						<image class="two" v-else :src="$util.img('upload/weapp/pageSalesman/warning_hide.png')"
							mode="widthFix">
				</view>
				近<u-input v-model="goods_4.num" border="bottom" inputAlign="center" style="width: 80rpx;"></u-input>
				天销量环比下降超
				<u-input v-model="goods_4.limit_num" inputAlign="center" border="bottom" style="width: 80rpx;">
				</u-input>
				%
			</div>


			<div class="item" :style="goods_5.const?'':'background: #E8E8E8'">
				<view class="" @click="kaibtnone(goods_5)">
					<image class="one" v-if="goods_5.const"
						:src="$util.img('upload/weapp/pageSalesman/reportForm/eye.png')" mode="widthFix">
						<image class="two" v-else :src="$util.img('upload/weapp/pageSalesman/warning_hide.png')"
							mode="widthFix">
				</view>
				近<u-input v-model="goods_5.num" border="bottom" inputAlign="center" style="width: 100rpx;">
				</u-input>天销量低于
				<u-input v-model="goods_5.limit_num" border="bottom" inputAlign="center" style="width: 100rpx;">
				</u-input>
				的商品
			</div>

			<div class="item" :style="goods_6.const?'':'background: #E8E8E8'">
				<view class="" @click="kaibtnone(goods_6)">
					<image class="one" v-if="goods_6.const"
						:src="$util.img('upload/weapp/pageSalesman/reportForm/eye.png')" mode="widthFix">
						<image class="two" v-else :src="$util.img('upload/weapp/pageSalesman/warning_hide.png')"
							mode="widthFix">
				</view>
				近<u-input v-model="goods_6.num" border="bottom" inputAlign="center" style="width: 80rpx;"></u-input>
				天销量环比上升超
				<u-input v-model="goods_6.limit_num" inputAlign="center" border="bottom" style="width: 80rpx;">
				</u-input>
				%
			</div>


			<div class="item" :style="goods_7.const?'':'background: #E8E8E8'">
				<view class="" @click="kaibtnone(goods_7)">
					<image class="one" v-if="goods_7.const"
						:src="$util.img('upload/weapp/pageSalesman/reportForm/eye.png')" mode="widthFix">
						<image class="two" v-else :src="$util.img('upload/weapp/pageSalesman/warning_hide.png')"
							mode="widthFix">
				</view>
				近<u-input v-model="goods_7.num" border="bottom" inputAlign="center" style="width: 80rpx;"></u-input>
				天销量高于
				<u-input v-model="goods_7.limit_num" inputAlign="center" border="bottom" style="width: 80rpx;">
				</u-input>
				的商品
			</div>
		</div>


		<div class="set">
			<div class="btn" @click="warningSet">保存</div>
		</div>
		<view style="height: 40rpx;">
		</view>




	</view>
</template>

<script>
	export default {
		data() {
			return {
				goods_1: {},
				goods_2: {},
				goods_3: {},
				goods_4: {},
				goods_5: {},
				goods_6: {},
				goods_7: {},
				goods_8: {},
				goods_9: {}
			};
		},
		onShow() {
			this.getWarnGoodsConfig()
		},
		methods: {
			getWarnGoodsConfig() {
				this.$api.sendRequest({
					url: `/api/salasman/getWarnGoodsConfig`,
					data: {},
					success: res => {
						res.data.forEach((item, index) => {
							switch (item.key) {
								case "goods_1":
									this.goods_1 = item

									break;
								case "goods_2":
									this.goods_2 = item

									break;
								case "goods_3":
									this.goods_3 = item

									break;
								case "goods_4":
									this.goods_4 = item

									break;
								case "goods_5":
									this.goods_5 = item

									break;
								case "goods_6":
									this.goods_6 = item

									break;
								case "goods_7":
									this.goods_7 = item

									break;
								default:
									break;
							}
						})
					}
				})
			},

			kaibtnone(item) {
				item.const = !item.const
			},
			warningSet() {
				this.$api.sendRequest({
					url: `/api/salasman/warnConfig`,
					header: {
						'Content-Type': 'application/json' //自定义请求头信息
					},
					data: {
						goods_config: [
							this.goods_1,
							this.goods_2,
							this.goods_3,
							this.goods_4,
							this.goods_5,
							this.goods_6,
							this.goods_7
						]
					},
					success: res => {
						this.$util.showToast({
							title: '保存成功'
						});
						setTimeout(() => {
							uni.redirectTo({
								url: '/page_salesman_index/warning/warning'
							})
						}, 500)
					}
				})

			}
		}
	}
</script>

<style lang="scss">
	.one {
		width: 28rpx;
		height: 20rpx;
	}

	.two {
		width: 40rpx !important;
		height: 28rpx !important;
	}

	.warningSet {
		.set {
			position: fixed;
			bottom: 0;
			width: 100%;
			background-color: #fff;
			padding: 10rpx 32rpx 32rpx;
			box-sizing: border-box;
			left: 0;
			z-index: 10;

			.btn {
				text-align: center;
				line-height: 80rpx;
				font-size: 32rpx;
				font-family: PingFangSC-Medium, PingFang SC;
				font-weight: bold;
				color: #FFFFFF;
				height: 80rpx;
				background: #21BBF3;
				border-radius: 40rpx;
			}
		}

		.item-list {
			padding: 32rpx;

			.item {
				background: #FFFFFF;
				box-shadow: 0px 4rpx 8rpx 0px rgba(0, 0, 0, 0.04);
				border-radius: 16rpx;
				padding: 38rpx 24rpx;
				display: flex;
				align-items: center;
				font-size: 28rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #585858;
				margin-bottom: 32rpx;

				::v-deep {
					.u-input {
						flex: none;
					}

					.uni-input-input {
						font-weight: bold;
						font-size: 32rpx;
					}
				}
			}
		}

		.tips {
			padding: 0 32rpx;
			height: 76rpx;
			background: rgba(32, 195, 255, 0.08);
			line-height: 76rpx;
			font-size: 28rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #21BBF3;
		}
	}
</style>