<template>
    <div v-loading="loading">
        <div class="white-box">
            <div class="table">
                <el-table
                    :data="goods"
                    style="width: 100%"
                    show-summary
                    :summary-method="getSummaries">
                     <el-table-column label="商品名称" prop="GOODS_NAME">
                    </el-table-column>

                    <el-table-column label="图片" >
                        <template slot-scope="scope">
                            <img :src="scope.row.COVER" alt="" style="width:100%">
                        </template>
                    </el-table-column>

                    <el-table-column label="会员价格" prop="member_price">
                    </el-table-column>
                    <el-table-column label="会员PV" prop="member_pv">
                    </el-table-column>
<!--                    <el-table-column label="库存" prop="STORE_NUMS">-->
<!--                    </el-table-column>-->

                    <el-table-column label="数量" prop="chose_num">

                    </el-table-column>
                    <el-table-column label="合计金额" prop="member_price_plus">

                    </el-table-column>
                    <el-table-column label="合计PV" prop="member_pv_plus"></el-table-column>
                </el-table>
            </div>
            <!--<div class="sum">-->
                <!--<div class="sum_box">-->
                    <!--<div>会员姓名：</div>-->
                    <!--<div>{{realName}}</div>-->
                <!--</div>-->
                <!--<div class="sum_box">-->
                    <!--<div>会员级别：</div>-->
                    <!--<div>{{decLv}}</div>-->
                <!--</div>-->
                <!--<div class="sum_box">-->
                    <!--<div>荣衔级别：</div>-->
                    <!--<div>{{empLv}}</div>-->
                <!--</div>-->
                <!--<div class="sum_box">-->
                    <!--<div>开拓者：</div>-->
                    <!--<div>{{recUser}}</div>-->
                <!--</div>-->
                <!--<div class="sum_box">-->
                    <!--<div>安置人：</div>-->
                    <!--<div>{{conUser}}</div>-->
                <!--</div>-->
            <!--</div>-->
            <div class="box address_box">
                <el-form ref="addrform" :model="addrform" label-width="150px" style="width:500px;">
                    <el-form-item>
                        <template slot="label"><span class="text-danger">*</span>复消会员编号</template>
                        <el-input v-model="userName" @change="handleChkUser">
                            <template slot="append">【{{realName}}】</template>
                        </el-input>
                    </el-form-item>
                    <el-form-item>
                        <template slot="label">
                            <span class="text-danger">*</span>
                            收货人
                        </template>
                        <el-input v-model="addrform.consignee"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <template slot="label">
                            <span class="text-danger">*</span>
                            手机号
                        </template>
                        <el-input v-model="addrform.acceptMobile"></el-input>
                    </el-form-item>
                    <el-form-item prop="areaSelected">
                        <template slot="label">
                            <span class="text-danger">*</span>
                            地区
                        </template>
                        <el-cascader
                                size="large"
                                :options="regionData"
                                v-model="addrform.areaSelected">
                        </el-cascader>
                    </el-form-item>
                    <el-form-item>
                        <template slot="label">
                            <span class="text-danger">*</span>
                            详细地址
                        </template>
                        <el-input v-model="addrform.detailaddress"></el-input>
                    </el-form-item>
                </el-form>
                <!--<el-radio-group v-model="addressId" @change='choseAddress'>-->
                    <!--<div v-for="(item , index) in all_address" :key='index' class="address">-->
                        <!--<el-radio :label="item.ID" >-->
                            <!--{{item.PROVINCE_NAME}}省{{item.CITY_NAME}}市{{item.COUNTY_NAME}}县&nbsp;&nbsp;&nbsp;&nbsp;-->
                            <!--详细地址{{item.ADDRESS}}-->
                            <!--收件人姓名：{{item.CONSIGNEE}}&nbsp;&nbsp;&nbsp;&nbsp;-->
                            <!--手机号码：{{item.MOBILE}}-->
                        <!--</el-radio>-->
                    <!--</div>-->
                <!--</el-radio-group>-->
            </div>
            <div class="address_box">
                请选择支付方式：
                <el-radio-group v-model="payType" @change='chosePayType'>
                    <div v-for="(item , index) in payList" :key='index' class="address">
                        <el-radio :label="item.type" >
                            {{item.name}}
                        </el-radio>
                    </div>
                </el-radio-group>
            </div>
            <div class="box address_box">
                合计：
                <div class="sum">
                    <div class="sum_box">
                        <div>运费</div>
                        <div>￥{{payType=="cash"?freight:pointFreight}}元</div>
                    </div>
                    <div class="sum_box">
                        <div>实付金额</div>
                        <div>￥{{payType=="cash"?cashSum:pointsSum}}元</div>
                    </div>
                    <!--<div class="sum_box">-->
                        <!--<div>账户积分</div>-->
                        <!--<div>{{balance.points}}</div>-->
                    <!--</div>-->
                    <div class="sum_box">
                        <div>账户消费点数</div>
                        <div>￥{{balance.cash}}元</div>
                    </div>
                </div>
            </div>
            <div>
                <el-button @click="goToAccounts()" :loading="submitButtonStat">去结算</el-button>
            </div>
        </div>
    </div>
</template>

<script>
 import store from '@/utils/vuexStore'
 import network from '@/utils/network'
 import tool from '@/utils/tool'
    export default{
        name:'reconsume-order',
        data(){
            return{
                loading: true,
                regionData: store.state.regionInfo.regionData,
                goods:[],
                userName:'',
                payList:[],
                all_address:[],
                balance:{},
                addrform: {
                    consignee:'',
                    acceptMobile:'',
                    areaSelected: [],
                    detailaddress: '',
                },
                addressId:'',
                payType:'',
                pointsSum:'',
                cashSum:'',
                freight:'',
                pointFreight:'',
                goodsId:'',
                goodsNum:'',
                payPassword:'',
                submitButtonStat:false,
                realName:'',
                // decLv:'',
                // empLv:'',
                // recUser:'',
                // conUser:'',
            }
        },
        created(){
            this.getShowCart();
            let option= sessionStorage.getItem('reconsume_order_goods');
            if(option){
                let pageGoodsList=JSON.parse(option);
                console.log(pageGoodsList);
                let pageList;
                for( let i in pageGoodsList ) {
                    pageList =  pageGoodsList[i];
                    if (!pageList) continue;

                    pageList.map((pageData, index)=>{
                        if( Number(pageData.chose_num) > 0 ) {
                            let discount = pageData.DISCOUNT / 100;
                          pageData.member_price = Math.round(pageData.SELL_PRICE * discount * 100) / 100;
                          pageData.member_price_plus = Math.round(pageData.SELL_PRICE * Number(pageData.chose_num) * discount * 100) / 100;

                          pageData.member_pv = Math.round(pageData.PRICE_PV * discount * 100) / 100;
                          pageData.member_pv_plus = Math.round(pageData.PRICE_PV * Number(pageData.chose_num) * discount * 100) / 100;

                            this.goods.push(pageData)
                        }
                    })
                }

                this.getSumMoney();
            }
        },
        methods:{
            goToAccounts(){
                let postData = {
                    userName: this.userName,
                    consignee: this.addrform.consignee,
                    acceptMobile: this.addrform.acceptMobile,
                    province: this.addrform.areaSelected[0] ? this.addrform.areaSelected[0] : '',
                    city: this.addrform.areaSelected[1] ? this.addrform.areaSelected[1] : '',
                    county: this.addrform.areaSelected[2] ? this.addrform.areaSelected[2] : '',
                    detailaddress: this.addrform.detailaddress,
                    //addressId:this.addressId,
                    payType: this.payType,
                    goodsId: this.goodsId,
                    goodsNum: this.goodsNum,
                }
                //console.log(postData);
                this.submitButtonStat = true
                this.$prompt('请输入支付密码', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    inputType: 'password',
                    inputPattern: /\S+/,
                    inputErrorMessage: '请输入支付密码'
                }).then(({value}) => {
                    postData.payPassword = value
                    return network.postData('shop/reconsume-sure-order',postData).then(response => {
                        this.$message({
                            message: response,
                            type: 'success'
                        })

                        this.submitButtonStat = false
                        this.$router.go(-1)
                        this.$router.push({path: `/shop/order-list`})
                    }).catch(() => {
                        this.submitButtonStat = false
                    }).catch((response) => {
                        this.submitButtonStat = false
                    })

                })

            },
            getSummaries(param) {
              const { columns, data } = param;
              const sums = [];
              columns.forEach((column, index) => {
                if (index === 0) {
                  sums[index] = '合计';
                  return;
                }
                const values = data.map(item => Number(item[column.property]));
                if ((!values.every(value => isNaN(value))) && [4, 5, 6].includes(index)) {
                  sums[index] = values.reduce((prev, curr) => {
                    const value = Number(curr);
                    if (!isNaN(value)) {
                      return prev + curr;
                    } else {
                      return prev;
                    }
                  }, 0);
                }
              });

              return sums;
            },
            getSumMoney(){
                // let points_plus_sum=[];
                let cash_plus_sum=[];
                let goodsId=[];
                let goodsNum=[];
                let choseNum = 0;
                this.goods.map((item,index)=>{
                    choseNum = Number(item.chose_num);
                    if( choseNum > 0 ) {
                        // points_plus_sum.push(item.SELL_PRICE * choseNum);
                        cash_plus_sum.push(item.SELL_PRICE * choseNum*(item.DISCOUNT/100));
                        goodsId.push(item.ID);
                        goodsNum.push(choseNum);
                    }
                })
                this.goodsNum=goodsNum;
                this.goodsId=goodsId;
                //增加运费03-12yuan
                let payAmount = tool.sum(cash_plus_sum);
                // let payPointAmount = tool.sum(points_plus_sum);

                if(payAmount>=300){
                  this.pointFreight = this.freight = 0;
                }else{
                  this.pointFreight = this.freight = 15;
                }
                // if(payPointAmount>=300){
                //     this.pointFreight = 0;
                // }else{
                //     this.pointFreight = 15;
                // }
                //console.log('points_plus_sum',points_plus_sum);
                //console.log('cash_plus_sum',cash_plus_sum);
                // this.pointsSum=tool.formatPrice(tool.sum(points_plus_sum) + this.pointFreight);
              this.pointsSum = this.cashSum = tool.formatPrice(tool.sum(cash_plus_sum) + this.freight) ;
            },
            getShowCart(){
                network.getData('shop/reconsume-cart')
                .then(response=>{
                    this.loading=false;
                    for(let key in response.payList){
                        this.payList.push({type:key,name:response.payList[key].name})
                    }
                    this.payType=this.payList[0].type;//默认设置为第一项付款方式
                    // console.log(this.payList)
                    // for(let key in response.userBalance){
                    //     this.balance.push({type:key,own_price:response.userBalance[key]})
                    // }
                    this.balance=response.userBalance;
                })
            },
            chosePayType(type){
                console.log(type);
                console.log(this.payType);
            },
            choseAddress(addressId){
                console.log(addressId);
            },
            handleChkUser() {
                if (this.userName) {
                    network.getData('user/user-base-info', {userName: this.userName}).then(response => {
                        this.realName = response.REAL_NAME
                        // this.decLv = response.DEC_LEVEL_NAME
                        // this.empLv = response.EMP_LEVEL_NAME
                        // this.recUser = response.REC_UID
                        // this.conUser = response.CON_UID

                        this.all_address=response.allAddress;
                        this.all_address.map((item,index)=>{
                            if(item.IS_DEFAULT==1){
                                this.addressId=item.ID
                            }
                        });
                    }).catch(response => {
                        this.realName = ''
                        // this.decLv = ''
                        // this.empLv = ''
                        // this.recUser = ''
                        // this.conUser = ''
                        this.all_address = []
                    })
                }
            },
        }
    }
</script>

<style scoped>
.address{
    /* height: 3rem; */
    line-height: 3.5rem;

}
.address_box{
     border-bottom: 1px solid #e3e3e3;
}
.sum{
    display: inline-block;
}
.box{
    margin: 1rem 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding-bottom: 1rem;
}
.sum_box{
    display: flex;
    margin-left: 1rem;
}
.sum_box > div{
    line-height: 2rem;
}
.sum_box > div:nth-child(1){
    margin-right: 1rem;
}
</style>
