<template>
	<view :style="'background-color: '+theme.bg+';color: '+theme.text" style="height: 100vh;">
		<myNav :title="i18n.setTransaction.title"></myNav>
		<!-- 身体 -->
		<view class="width-750">
			<!-- 首单 -->
			<view class="height-183 padding-w-30 padding-c-14 flex direction-column justify-between">
				<view class="flex align-center">
					<image class="width-42 height-42 margin-r-8" src="/static/imgs/quantify/shoudan.png" mode="">
					</image>
					<text class="font-28">{{i18n.setTransaction.text1}}</text>
				</view>
				<text class="font-24 color-C3C3C3">{{i18n.setTransaction.text2}}</text>
				<view class="flex align-center">
					<input class="font-28 flex-1 numbold-font padding-r-20" type="text" v-model="first_num"
						:placeholder="i18n.setTransaction.tos1" placeholder-class="color-333333" />
					<text class="font-28 numbold-font">USDT</text>
				</view>
			</view>
			<!-- 最低 -->
			<view class="height-186 padding-w-30 margin-t-26">
				<view class="height-93 flex align-center justify-between">
					<text class="font-28">{{i18n.setTransaction.text3}}</text>
					<view class="flex align-center flex-1">
						<input class="font-28 color-0165EE nummedium-font text-right padding-w-24" type="number"
							v-model="min_price" :placeholder="i18n.setTransaction.tos2"
							placeholder-class="color-0165EE" />
						<text class="font-28 weight-bold">USDT</text>
					</view>
				</view>
				<view class="height-93 flex direction-column justify-center font-24 color-FF4040">
					<text>{{i18n.setTransaction.text4}}</text>
					<text>{{i18n.setTransaction.text5}}</text>
				</view>
			</view>
			<!-- 其它 -->
			<view class="margin-t-26">
				<view class="height-96 flex align-center justify-between padding-w-30 margin-b-1">
					<text class="font-28">{{i18n.setTransaction.text6}}</text>
					<view class="flex align-center">
						<input class="font-28 color-0165EE nummedium-font text-right padding-w-24" type="number"
							v-model="order_num" :placeholder="i18n.setTransaction.tos3"
							placeholder-class="color-0165EE" />
						<text class="font-28 weight-bold">{{i18n.setTransaction.text7}}</text>
					</view>
				</view>
				<view class="height-96 flex align-center justify-between padding-w-30 margin-b-1">
					<text class="font-28">{{i18n.setTransaction.text8}}</text>
					<view class="flex align-center">
						<input class="font-28 color-0165EE nummedium-font text-right padding-w-24" type="number"
							v-model="zy_percent" :placeholder="i18n.setTransaction.tos4"
							placeholder-class="color-0165EE" />
						<text class="font-28 weight-bold">%</text>
					</view>
				</view>
				<view class="height-96 flex align-center justify-between padding-w-30 margin-b-1">
					<text class="font-28">{{i18n.setTransaction.text9}}</text>
					<view class="flex align-center">
						<input class="font-28 color-0165EE nummedium-font text-right padding-w-24" type="number"
							v-model="zy_ht" :placeholder="i18n.setTransaction.tos5" placeholder-class="color-0165EE" />
						<text class="font-28 weight-bold">%</text>
					</view>
				</view>
				<view class="height-96 flex align-center justify-between padding-w-30 margin-b-1">
					<text class="font-28">{{i18n.setTransaction.text10}}</text>
					<view @click="bcShow=true" class="flex align-center">
						<text
							class="font-28 color-0165EE nummedium-font">{{bcs_1 == ''?i18n.setTransaction.text14:i18n.setTransaction.text15}}</text>
						<u-icon name="arrow-right" color="#0165EE" size="28"></u-icon>
					</view>
				</view>
				<view class="height-96 flex align-center justify-between padding-w-30 margin-b-1">
					<text class="font-28">{{i18n.setTransaction.text11}}</text>
					<view class="flex align-center">
						<input class="font-28 color-0165EE nummedium-font text-right padding-w-24" type="number"
							v-model="bc_ht" :placeholder="i18n.setTransaction.tos6" placeholder-class="color-0165EE" />
						<text class="font-28 weight-bold">%</text>
					</view>
				</view>
				<view class="height-96 flex align-center justify-between padding-w-30 margin-b-1">
					<text class="font-28">{{i18n.setTransaction.text12}}</text>
					<u-switch @change="change" size="36" v-model="pc_status" active-color="#0165EE" inactive-color="#F1F4F8">
					</u-switch>
				</view>
				<view class="height-96 flex align-center justify-between padding-w-30 margin-b-1">
					<text class="font-28">{{i18n.setTransaction.text13}}</text>
					<u-switch @change="change1" size="36" v-model="rc_status" active-color="#0165EE" inactive-color="#F1F4F8">
					</u-switch>
				</view>
			</view>
			<view @click="get_cionSetting" class="btn">{{i18n.setTransaction.text16}}</view>
		</view>

		<!-- 补仓跌幅弹窗 -->
		<u-popup v-model="bcShow" mode="bottom" border-radius="20">
			<view class="padding-b-80" :style="'background-color: '+theme.bg+';color: '+theme.text">
				<view class="height-110 flex align-center justify-center">
					<text class="font-28">{{i18n.setTransaction.text17}}</text>
				</view>
				<view class="height-96 flex align-center justify-between padding-w-30">
					<text class="font-28">{{i18n.setTransaction.text18}}</text>
					<view class="flex align-center">
						<input class="font-28 color-0165EE nummedium-font text-right padding-w-24" type="number"
							v-model="bcs_1" :placeholder="i18n.setTransaction.tos7" placeholder-class="color-0165EE" />
						<text class="font-28 weight-bold">%</text>
					</view>
				</view>
				<view class="height-96 flex align-center justify-between padding-w-30">
					<text class="font-28">{{i18n.setTransaction.text19}}</text>
					<view class="flex align-center">
						<input class="font-28 color-0165EE nummedium-font text-right padding-w-24" type="number"
							v-model="bcs_2" :placeholder="i18n.setTransaction.tos7" placeholder-class="color-0165EE" />
						<text class="font-28 weight-bold">%</text>
					</view>
				</view>
				<view class="height-96 flex align-center justify-between padding-w-30">
					<text class="font-28">{{i18n.setTransaction.text20}}</text>
					<view class="flex align-center">
						<input class="font-28 color-0165EE nummedium-font text-right padding-w-24" type="number"
							v-model="bcs_3" :placeholder="i18n.setTransaction.tos7" placeholder-class="color-0165EE" />
						<text class="font-28 weight-bold">%</text>
					</view>
				</view>
				<view class="height-96 flex align-center justify-between padding-w-30">
					<text class="font-28">{{i18n.setTransaction.text21}}</text>
					<view class="flex align-center">
						<input class="font-28 color-0165EE nummedium-font text-right padding-w-24" type="number"
							v-model="bcs_4" :placeholder="i18n.setTransaction.tos7" placeholder-class="color-0165EE" />
						<text class="font-28 weight-bold">%</text>
					</view>
				</view>
				<view class="height-96 flex align-center justify-between padding-w-30">
					<text class="font-28">{{i18n.setTransaction.text22}}</text>
					<view class="flex align-center">
						<input class="font-28 color-0165EE nummedium-font text-right padding-w-24" type="number"
							v-model="bcs_5" :placeholder="i18n.setTransaction.tos7" placeholder-class="color-0165EE" />
						<text class="font-28 weight-bold">%</text>
					</view>
				</view>
				<view class="height-96 flex align-center justify-between padding-w-30">
					<text class="font-28">{{i18n.setTransaction.text23}}</text>
					<view class="flex align-center">
						<input class="font-28 color-0165EE nummedium-font text-right padding-w-24" type="number"
							v-model="bcs_6" :placeholder="i18n.setTransaction.tos7" placeholder-class="color-0165EE" />
						<text class="font-28 weight-bold">%</text>
					</view>
				</view>
				<view class="height-96 flex align-center justify-between padding-w-30">
					<text class="font-28">{{i18n.setTransaction.text24}}</text>
					<view class="flex align-center">
						<input class="font-28 color-0165EE nummedium-font text-right padding-w-24" type="number"
							v-model="bcs_7" :placeholder="i18n.setTransaction.tos7" placeholder-class="color-0165EE" />
						<text class="font-28 weight-bold">%</text>
					</view>
				</view>
				<view class="margin-t-60 flex align-center justify-around">
					<view @click="bcShow=false" class="width-300 height-96 radiu-20 line-height-96 text-center"
						style="background: rgba(195,195,195,0.5);">
						<text class="font-28 color-white">{{i18n.setTransaction.text25}}</text>
					</view>
					<view @click="confirmBC" class="width-300 height-96 radiu-20 line-height-96 text-center bj-0165EE">
						<text class="font-28 color-white">{{i18n.setTransaction.text16}}</text>
					</view>
				</view>

			</view>
		</u-popup>
		<!-- 去实名 -->
		<u-popup style="z-index: 5000;" border-radius="18" mode="center" v-model="TSShow">
			<view class="width-600 padding-b-20" :style="'background-color: '+theme.bg+';color: '+theme.text">
				<view class="width-100b height-220 padding-w-30 padding-c-40 flex direction-column align-center justify-between">
					<image class="width-64 height-64" src="/static/imgs/quantify/tongzhi@2x.png" mode=""></image>
					<view class="font-28 weight-bold text-center padding-w-20">
						{{i18n.setTransaction.text26}}
					</view>
				</view>
				<view class="width-100b height-90 flex align-center justify-center">
					<view @click="TSShow=false,router.push('/pages/my/safety/real')" class="qcbtn3">
						{{i18n.setTransaction.text27}}</view>
				</view>
			</view>
		</u-popup>


	</view>
</template>

<script>
	export default {
		data() {
			return {
				statusBar: uni.getSystemInfoSync().statusBarHeight,
				bcShow: false,
				coin_id: '', //币种id数组
				first_num: '', //首单额度
				min_price: 0, //最低入场价格
				pc_status: true, //0=正常补仓   1=停止补仓
				rc_status: true, //0=关闭   1=开启
				order_num: '', //交易单数
				zy_percent: '', //止盈比例
				zy_ht: '', //止盈回调
				bc_ht: '', //补仓回调
				bcjson: {}, //补仓设置，数组[‘1’=>0.02,’2’=>0.03….]
				bcs_1: '',
				bcs_2: '',
				bcs_3: '',
				bcs_4: '',
				bcs_5: '',
				bcs_6: '',
				bcs_7: '',

				flag: true,
				TSShow: false,
				theme: '',
			}
		},
		computed: {
			i18n() {
				return this.$t('message');
			}
		},
		filters: {
			// 价格过滤器（保留小数点后两位）
			percentFilter: function(item) {
				return (item * 100).toFixed(2)
			}
		},
		onLoad: function(option) {
			if (option.idArr) {
				this.coin_id = option.idArr
				console.log(this.coin_id)
				this.get_strategy()
			}
			if (option.item) {
				// decodeURIComponent 解密传过来的对象字符串
				const item = JSON.parse(option.item)
				console.log(item)
				this.coin_id = item.coin_id
				this.first_num = item.first_num
				this.order_num = item.order_num
				this.min_price = item.in_price
				this.pc_status = item.pc_status == 0 ? true : false
				this.rc_status = item.is_now == 0 ? false : true
				this.zy_percent = (item.zy_percent * 100).toFixed(2)
				this.zy_ht = (item.zy_ht * 100).toFixed(2)
				this.bc_ht = (item.bc_ht * 100).toFixed(2)
				this.bcs_1 = (item.bcs_1 * 100).toFixed(2)
				this.bcs_2 = (item.bcs_2 * 100).toFixed(2)
				this.bcs_3 = (item.bcs_3 * 100).toFixed(2)
				this.bcs_4 = (item.bcs_4 * 100).toFixed(2)
				this.bcs_5 = (item.bcs_5 * 100).toFixed(2)
				this.bcs_6 = (item.bcs_6 * 100).toFixed(2)
				this.bcs_7 = (item.bcs_7 * 100).toFixed(2)
			}
		},
		onShow() {
			if (uni.getStorageSync("theme") == "dark") {
				this.theme = this.$store.state.darkTheme
			} else {
				this.theme = this.$store.state.lightTheme
			}
		},
		methods: {
			change(status) {
				console.log(this.pc_status);
			},
			change1(status) {
				console.log(this.rc_status);
			},
			// 批量设置时获取默认值
			get_strategy() {
				this.post('/strategy/get_strategy_ori').then(res => {
					console.log(res)
					if (res.code == 1) {
						var item = res.data
						this.first_num = item.first_num
						this.order_num = item.order_num
						this.min_price = 0
						this.pc_status = true
						this.rc_status = false
						this.zy_percent = (item.zy_percent * 100).toFixed(2)
						this.zy_ht = (item.zy_ht * 100).toFixed(2)
						this.bc_ht = (item.bc_ht * 100).toFixed(2)
						this.bcs_1 = (item.bcs_1 * 100).toFixed(2)
						this.bcs_2 = (item.bcs_2 * 100).toFixed(2)
						this.bcs_3 = (item.bcs_3 * 100).toFixed(2)
						this.bcs_4 = (item.bcs_4 * 100).toFixed(2)
						this.bcs_5 = (item.bcs_5 * 100).toFixed(2)
						this.bcs_6 = (item.bcs_6 * 100).toFixed(2)
						this.bcs_7 = (item.bcs_7 * 100).toFixed(2)
					}
				})
			},
			confirmBC() {
				this.bcShow = false
			},
			get_cionSetting(id) {
				if (!this.flag) return
				if (this.first_num == '') {
					this.tos(this.i18n.setTransaction.tos8)
					return
				}
				if (this.min_price === '') {
					this.tos(this.i18n.setTransaction.tos9)
					return
				}
				if (this.order_num == '') {
					this.tos(this.i18n.setTransaction.tos10)
					return
				}
				if (this.zy_percent == '') {
					this.tos(this.i18n.setTransaction.tos4)
					return
				}
				if (this.zy_ht == '') {
					this.tos(this.i18n.setTransaction.tos5)
					return
				}
				if (this.bcs_1 == '') {
					this.tos(this.i18n.setTransaction.tos11)
					return
				}
				if (this.bcs_2 == '') {
					this.tos(this.i18n.setTransaction.tos12)
					return
				}
				if (this.bcs_3 == '') {
					this.tos(this.i18n.setTransaction.tos13)
					return
				}
				if (this.bcs_4 == '') {
					this.tos(this.i18n.setTransaction.tos14)
					return
				}
				if (this.bcs_5 == '') {
					this.tos(this.i18n.setTransaction.tos15)
					return
				}
				if (this.bcs_6 == '') {
					this.tos(this.i18n.setTransaction.tos16)
					return
				}
				if (this.bcs_7 == '') {
					this.tos(this.i18n.setTransaction.tos17)
					return
				}
				let that = this
				uni.showLoading({
					title: that.i18n.setTransaction.tos18
				})
				this.flag = false
				var obj = {
					coin_id: this.coin_id,
					first_num: this.first_num,
					order_num: this.order_num,
					in_price: this.min_price,
					pc_status: this.pc_status ? '0' : '1',
					is_now: this.rc_status ? '1' : '0',
					zy_percent: (this.zy_percent / 100).toFixed(4),
					zy_ht: (this.zy_ht / 100).toFixed(4),
					bc_ht: (this.bc_ht / 100).toFixed(4),
					bcs_1: (this.bcs_1 / 100).toFixed(4),
					bcs_2: (this.bcs_2 / 100).toFixed(4),
					bcs_3: (this.bcs_3 / 100).toFixed(4),
					bcs_4: (this.bcs_4 / 100).toFixed(4),
					bcs_5: (this.bcs_5 / 100).toFixed(4),
					bcs_6: (this.bcs_6 / 100).toFixed(4),
					bcs_7: (this.bcs_7 / 100).toFixed(4),
				}
				console.log(obj)
				this.post('/strategy/set_strategy', obj).then(res => {
					uni.hideLoading()
					this.flag = true
					console.log(res)
					if (res.code == 1) {
						this.tos(res.msg)
						setTimeout(() => {
							uni.navigateBack()
						}, 800)
					} else {
						uni.hideToast()
						if (res.data.jump == 1) {
							this.TSShow = true
						}
					}
				})
			},
		}
	}
</script>

<style lang="scss">
	.fixed1 {
		position: fixed;
		top: 0;
		z-index: 1000;
		background: #FFFFFF;
	}

	.btn {
		width: 690rpx;
		height: 96rpx;
		border-radius: 20rpx;
		background-color: #0165EE;
		line-height: 96rpx;
		text-align: center;
		font-size: 32rpx;
		color: #FFFFFF;
		margin: 100rpx auto 200rpx;
	}

	.qcbtn3 {
		width: 320rpx;
		height: 86rpx;
		background: #0165EE;
		border-radius: 20rpx;
		font-size: 28rpx;
		font-weight: bold;
		color: #FFFFFF;
		display: flex;
		align-items: center;
		justify-content: center;
	}
</style>
