/*
 * Creator:     ML
 * CreatDate:   2020-03-26
 * descripts：  患者中心 付款提示
 * */
import React from 'react';
import { Toast, Button, List, Modal, } from 'antd-mobile';
import { $http } from "containers/config/https";
// import { Util } from 'tools';
import '../style/index.less';
// import store from "store";
const ListItem = List.Item;
class payTips extends React.Component {
    constructor({ history }) {
        super();
        let userData = sessionStorage.getItem("userData") ? JSON.parse(sessionStorage.getItem("userData")) : {};
        this.state = {
            userData,
            smallClassModal: false

        };
        this.history = history;
    }

    componentDidMount = () => {
        this.props.onRef(this)
    }
    componentWillUnmount() {
        // 组件销毁前将静止让setState修改state的状态
        this.setState = (state, callback) => { return; }

    }
    handleCheckApply = (item, flag) => {
        this.props.handleCheckApply(item, flag)
    }
    showModal = (fee,payNote) => {
        this.setState({
            smallClassModal: true,
            fee,
            payNote
        }, () => {
            if (document.querySelector(".am-modal-body")) {
                document.querySelector(".am-modal-body").style.padding = "0"
                document.querySelector(".am-modal-content").style.padding = "0"
                document.querySelector(".am-list-line").style.padding = "0"
            }
        })
    }
    onClose = () => {
        this.setState({
            smallClassModal: false
        })
    }
    //调微信支付
    handlePay = () => {
        const { userData } = this.state
        let data = {
            params: [{
                openID: userData && userData.openID ? userData.openID : "",
                pubAccCode: userData && userData.pubAccCode ? userData.pubAccCode : "",
                totalFee: "0.01",
                // totalFee: this.state.fee,
                ipAddress: "",
                body: this.state.payNote,
            }],
        }
        $http.post("urlS", this, {
            code: "01020013",
            data: data,
            success: function (res) {
                if (+res.errorCode === 0) {
                    let result = res.result
                    this.onBridgeReady(result);
                }
            }
        });

    }
    onBridgeReady(result) {
        let that = this
        let { appId, timeStamp, nonceStr, signType, paySign } = result;
        let package_value = result.package || "";
        window.WeixinJSBridge.invoke(
            'getBrandWCPayRequest', {
            "appId": appId,     //公众号名称，由商户传入     
            "timeStamp": timeStamp,         //时间戳，自1970年以来的秒数     
            "nonceStr": nonceStr, //随机串     
            "package": package_value,
            "signType": signType,         //微信签名方式：     
            "paySign": paySign //微信签名 
        },
            function (res) {
                if (res.err_msg === "get_brand_wcpay_request:ok") {
                     that.onClose()
                     //付款成功之后
                     that.props.payToNext()
                } else if (res.err_msg === "get_brand_wcpay_request:cancel") {
                    Toast.info('用户取消支付')
                } else if (res.err_msg === "get_brand_wcpay_request:fail") {
                    Toast.info('支付失败')
                } else {
                    Toast.info('支付失败')
                }
            }
        );
    }
    render() {
        // console.log("store.getState().",store.getState())
        const {fee} = this.state
        return (
            <div className="treatmentOrder-dom pay-dom">
                {/* <WhiteSpace /> */}
                <Modal
                    visible={this.state.smallClassModal}
                    transparent
                    maskClosable={false}
                    onClose={this.onClose}
                    //   title="Title"
                    //   footer={[{ text: 'Ok', onPress: () => { console.log('ok'); this.onClose('modal1')(); } }]}
                    wrapProps={{ onTouchStart: this.onWrapTouchStart }}
                // afterClose={() => { alert('afterClose'); }}
                >
                    <div className="modal-dom">
                        <ListItem className="select-dom" style={{ padding: "0", background: "#22a9a9" }}>
                            <p style={{ textAlign: "center", color: "#fff", fontSize: "16px", }}>
                                <span>付款</span>
                                <span className="ok-btn" onClick={this.onClose} style={{ color: "#fff", fontSize: "16px", position: "absolute", right: "10px" }}>{"X"}</span>
                            </p>
                        </ListItem>
                        <ListItem className="appointTimeOp-dom">

                            <div style={{ textAlign: "center" }}>
                                <span style={{ fontSize: "16px", fontWeight: "600" }}>
                                    ￥ {fee}
                            </span>
                                <p style={{ margin: "10px 0", fontSize: "14px", color: "#888" }}>
                                    <span>职工医保</span><span style={{ margin: "0 6px" }}>原价</span><span>￥<span style={{textDecoration:"line-through"}}>120.12</span></span>
                                </p>
                            </div>
                        </ListItem>
                        <ListItem className="edit-dom" style={{ display: "flex", justifyContent: "center" }}>
                            <Button
                                style={{ background: "#22a9a9", color: "#fff", height: "42px", lineHeight: "42px", fontSize: "12px" }}
                                onClick={this.handlePay}
                            >去付款</Button>
                        </ListItem>
                    </div>
                </Modal>
            </div>
        )
    }
};
export default payTips;