<template>
	<view class="setting">
		<view class="setting-header">
			<view class="setting-header-text">
				<view class="setting-header-text-neishi" @click="topgi">
					<view class="setting-header-text-icon">
						<image src="https://cdn.bjtdba.com/vod/image/2022-08-11/20220811133828415.png" mode="widthFix">
						</image>
					</view>
				</view>

				<view class="setting-header-text-title">
					分润设置
				</view>
			</view>
		</view>
		<view class="setting-shehi">
			<view class="">
				商户分润比例
			</view>
			<view class="setting-shehi-bili">
				
				<view class="process-zhuti-yi-input">
					<picker class="process-zhuti-yi-picker" @change="changeFenRunBiLi" :value="FenRunBiLiListindex" :range="fenRunList" :range-key="'num'">
						<!-- <view v-if="FenRunBiLiListindex === 1" class="uni-input int-col">30%</view> -->
						<view class="uni-input">{{fenRunList[FenRunBiLiListindex].num}}</view>
					</picker>
				</view>
				<!-- <input style=" text-align: center;" maxlength="3" v-model="systemConfig.value" value=""
					@input="inputphone" /> -->
				<!-- <view class="" style="margin-right: 150rpx;">
					30%
				</view> -->
			</view>
		</view>
		<view class="setting-wenan">
		<!-- 	说明：开通消费分后，商户返利比例设置最低2%，不可低于2%，请谨慎设置开通消费分，此过程不可逆。 -->
		</view>
		<view class="listadd-annkiu" @click="addto">
			确定
		</view>
	</view>
</template>

<script>
	import {
		queyrConfig,
		updateShopBonusSetting,
		getShopBonusSetting
	} from '@/commit/config.js'
	export default {
		data() {
			return {
				// value: "20",
				systemConfig: [],
				merid: '',
				key: "base_commission",
				
				fenRunList: [{num:'30%'},{num:'35%'},{num:'40%'},{num:'45%'},{num:'50%'},{num:'55%'},{num:'60%'},{num:'65%'},{num:'70%'},{num:'75%'},{num:'80%'},{num:'85%'},{num:'90%'},{num:'95%'},{num:'100%'}],
				paramsList:[
					{shop_bonus_rate:30,yanglao_rate:5},
					{shop_bonus_rate:35,yanglao_rate:6},
					{shop_bonus_rate:40,yanglao_rate:7},
					{shop_bonus_rate:45,yanglao_rate:8},
					{shop_bonus_rate:50,yanglao_rate:9},
					{shop_bonus_rate:55,yanglao_rate:10},
					{shop_bonus_rate:60,yanglao_rate:11},
					{shop_bonus_rate:65,yanglao_rate:12},
					{shop_bonus_rate:70,yanglao_rate:13},
					{shop_bonus_rate:75,yanglao_rate:14},
					{shop_bonus_rate:80,yanglao_rate:15},
					{shop_bonus_rate:85,yanglao_rate:16},
					{shop_bonus_rate:90,yanglao_rate:17},
					{shop_bonus_rate:95,yanglao_rate:18},
					{shop_bonus_rate:100,yanglao_rate:19}
				],
				FenRunBiLiListindex: 0
				
			}
		},
		onLoad() {
		},
		onShow() {
			let selectmerchant = uni.getStorageSync('selectmerchant')
			this.merid = selectmerchant.merId
			this.queyrConfig()
			this.getFenRun()
		},
		methods: {
			// 查询门店分润设置
			queyrConfig() {
				queyrConfig({
					merId: this.merid,
					key: this.key
				}).then(res => {
					if (res.data.status == 200) {
						this.systemConfig = res.data.data.systemConfig
					}
				}, fail => {
					console.log(fail)
				})
			},
			inputphone(e) {
				const o = e.target;
				const inputRule = /[^\d.]/g
				this.$nextTick(function() {
					this.systemConfig.value = o.value.replace(inputRule, '');
				})
			},
			
			
			// 切换门店分润比例
			changeFenRunBiLi(select) {
				
				this.FenRunBiLiListindex = select.detail.value;
				
			},
			
			// 获取门店分润比例
			getFenRun() {
				getShopBonusSetting({mer_id: this.merId}).then(res => {
					console.log('-------->', res)
				}).catch(error => {
					
				})
			},
			
			addto() {
				
				let params = {
					value: JSON.stringify(this.paramsList[this.FenRunBiLiListindex]),
					mer_id: this.merid
				}
				
				// 修改门店分润值
				updateShopBonusSetting(params).then(res => {
					
					
					console.log('params = ',params, 'res = ',res)
					
					if (res.data.status == 200) {
						
						
						
						uni.showToast({
							title: res.data.message,
							icon: 'success',
						})
					}
				}, fail => {
					console.log(fail)
				})
				
			},
			topgi() {
				uni.switchTab({
					url: '/pages/my/index'
				});
			}
		}
	}
</script>

<style>
	page {
		background-color: #F7F8FC;
	}
</style>
<style lang="scss" scoped>
	.setting {
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;

		.setting-header {
			position: fixed;
			top: 0;
			left: 0;
			z-index: 111;
			width: 100%;
			height: 176rpx;
			background: #FFFFFF;
			display: flex;
			justify-content: center;

			.setting-header-text {
				width: 686rpx;
				font-size: 36rpx;
				font-weight: 500;
				color: #333333;
				display: flex;
				margin-top: 107rpx;
				align-items: center;

				.setting-header-text-neishi {
					width: 45rpx;
					height: 45rpx;
					margin-right: 17rpx;

					.setting-header-text-icon {
						width: 36rpx;
						height: 36rpx;
						margin-top: 2rpx;

						image {
							width: 100%;
							height: 100%;
						}
					}
				}

			}
		}

		.setting-shehi {
			width: 686rpx;
			height: 72rpx;
			font-size: 26rpx;
			font-weight: 400;
			margin: 202rpx 0 40rpx 0;
			display: flex;
			align-items: center;
			font-size: 32rpx;
			font-weight: 400;
			color: #333333;

			.setting-shehi-bili {
				width: 252rpx;
				height: 72rpx;
				background: #FFFFFF;
				border-radius: 8rpx;
				border: 1rpx solid #999999;
				margin-left: 26rpx;
				display: flex;
				align-items: center;
			}
		}

		.setting-wenan {
			width: 686rpx;
			font-size: 26rpx;
			font-weight: 400;
			color: #999999;
		}

		.listadd-annkiu {
			width: 686rpx;
			height: 98rpx;
			background: #1F7CFF;
			border-radius: 8rpx;
			position: fixed;
			bottom: 94rpx;
			font-size: 36rpx;
			font-weight: 400;
			color: #FFFFFF;
			text-align: center;
			line-height: 98rpx;
		}
	}
</style>
