<template>
	<view class="">
		
		<view class="container">
				<view class="title">支付金额</view>
				<view class="item">
						<view class="left">￥</view>
						<input class="input" type="number" :value="desc" data-name='desc' @input="headerInputClick" placeholder='请输入支付金额' />
				</view>
				<view class="btn" @click="headerSubmitClick">确定支付</view>
		</view>
		
		<u-popup :show="show" :round="10" mode="center" @close="onClose">
				<view class="payIpt">
						<view class="tit">请输入支付密码</view>
						<view class="iptbox">
								<input type="safe-password" password="true" placeholder="请输入支付密码" :value="password" data-name='password' @input="headerInputClick" />
						</view>
						<view class="btn2" @click="pay">确定</view>
				</view>
		</u-popup>
	</view>
</template>

<script>
	import { apiArr } from '../../api/kitchen';
	import { request } from '../../utils/index';

	export default {
		data() {
			return {
				id: '',
				desc: '', // 支付金额
				show:false,
				password:"",
			}
		},

		onLoad (options) {
			console.log('11111', options);
			console.log('1231313113', this);
			this.id = options?.id;
		},
		
		methods: {
			
			headerInputClick(e) {
				const { name } = e.currentTarget.dataset;
				const { value } = e.detail;
				this[name] = value
			},
			
			headerSubmitClick(){
				if(!this.desc){
					uni.showToast({
						title: '请输入支付金额',
						icon:"none"
					})
					return
				}
				this.show = true
			},
			
			onClose(){
				this.show = false
			},
			
			pay(){
				if(!this.password){
					uni.showToast({
						title: "请输入支付密码",
						icon:"none"
					})
					return
				}
				uni.showLoading({
					title: '支付中...',
					mask:true
				})
				request(apiArr.pay, 'POST', {
					money: Number(this.desc),
					pay_password: this.password,
					// shop_id:Number(uni.getStorageSync('shopId')) // 原来为什么是从storage 里边读shopId？
					shop_id: this.id,
				}, { silent: false, nested: true}).then((res) => {
					console.log('esa', res);
					uni.hideLoading();
					this.password = '';
					// 根据code 判断当前是否支付成功，1 成功 0 失败
					if (res.code === 1) {
						uni.showToast({
							title: res.msg,
							icon:"none"
						})
						setTimeout(()=>{
							uni.navigateBack({delta:1})
						},1500)
					} else {
						// 否则判定支付失败
						uni.showToast({
							title: res.msg,
							icon:"none"
						})
					}
				})
			},
		}
	}
</script>

<style>
@import url("./index.css");
</style>
