<template>
	<view class="productBigBox">
		
		<!--开票按钮-->
		<view class="billing-invoice">
			<image class="invoice-img" src="/pages/my/static/electronicInvoice/invoiceBtn.png"></image>
			<view class="invoice-text">开票记录</view>
		</view>
		<!--脚部-->
		<view class="billing-bottom">
			<view class="bottom-check" :class="allChecked==true?'bottom-checkAct':''">
				<checkbox class="round" :checked="allChecked" shape="circle"></checkbox>
				<view class="bottom-allName">全部</view>
			</view>
			<view class="bottom-orderBox">
				<view class="orderBox-money"><text>¥</text>30.00</view>
				<view class="orderBox-num">共2个订单</view>
			</view>
			<view class="bottom-btn">去开票</view>
		</view>
	</view>
</template>

<script>
export default {
  data() {
    return {
      tableDate:[],//列表内容
      pageIndex:1,//当前页
      pageTotal:0,//总条数
      allChecked:true,//全选
    }
  },
  onLoad(option) {
			
  },
  methods: {
    getData(){//列表加载
      console.log('加载了')
    },
		
  },
  onReachBottom(){//上拉加载
    this.pageIndex++
    this.getData()
  },
}
</script>

<style scoped="scoped" lang="scss">
.productBigBox{
	background: #F7F8FA;
	min-height: 100vh;
	position: relative;
	padding-bottom: 128rpx;
}
.billing-invoice{
	width: 132rpx;
	height: 132rpx;
	background: #FFFFFF;
	box-shadow: 0rpx 8rpx 20rpx 0rpx rgba(207,207,207,0.5);
	border-radius: 16rpx;
	position: fixed;
	right: 40rpx;
	bottom: 200rpx;
	z-index: 20;
	.invoice-img{
		display: block;
		width: 48rpx;
		height: 48rpx;
		margin: 24rpx auto 12rpx auto;
	}
	.invoice-text{
		width: 100%;
		font-weight: 500;
		font-size: 24rpx;
		color: #333333;
		line-height: 24rpx;
		text-align: center;
	}
}
.billing-bottom{
	width: 750rpx;
	height: 128rpx;
	display: flex;
	justify-content: space-between;
	background: #FFFFFF;
	border-top: solid 2px #DCDFE6;
	padding: 18rpx 24rpx 0 24rpx;
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 20;
	.bottom-check{
		display: flex;
		::v-deep .wx-checkbox-input,
		::v-deep .uni-checkbox-input{
			box-sizing: border-box;
			width: 36rpx !important;
			height: 36rpx !important;
			margin: 26rpx 0 0 0;
		}
		.bottom-allName{
			font-weight: 400;
			font-size: 28rpx;
			color: #333333;
			line-height: 88rpx;
			margin: 0 0 0 20rpx;
		}
	}
	.bottom-checkAct{
		::v-deep .wx-checkbox-input,
		::v-deep .uni-checkbox-input{
			background-color: #FE6600 !important;
			border-color: #FE6600 !important;
			color: #ffffff !important;
		}
	}
	.bottom-orderBox{
		.orderBox-money{
			font-weight: 600;
			font-size: 44rpx;
			color: #333333;
			line-height: 34rpx;
			text{
				font-weight: 400;
				font-size: 24rpx;
			}
		}
		.orderBox-num{
			font-weight: 400;
			font-size: 24rpx;
			color: #666666;
			line-height: 34rpx;
		}
	}
	.bottom-btn{
		width: 240rpx;
		height: 88rpx;
		background: #FE6600;
		border-radius: 44rpx;
		margin-top: 2rpx;
		font-weight: 600;
		font-size: 32rpx;
		color: #FFFFFF;
		line-height: 88rpx;
		text-align: center;
	}
}
</style>
