Skip to content

U
uni-pdtravel
Commit 36515cec authored by qipeng's avatar qipeng
Browse files
Options

开票列表

parent 91fd55b1
Hide whitespace changes
Inline Side-by-side
Showing with 323 additions and 9 deletions
pages.json
View file @ 36515cec
......@@ -354,6 +354,15 @@
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
},
{
"path" : "electronicInvoice/billingApplication/billingApplication",
"style" :
{
"navigationBarTitleText" : "开票申请",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
}
]
},
......
pages/my/electronicInvoice/billingApplication/billingApplication.vue 0 → 100644
View file @ 36515cec
<template>
<view class="page-box">
<!--抬头内容-->
<view class="application-box">
<view class="application-listIn">
<view class="listIn-name">抬头类型<text>*</text></view>
<view class="listIn-inputBox">
<radio-group class="inputBox-radio" @change="radioChange">
<label class="radio-txt" v-for="(item,index) in riseList" :key="index">
<radio style="transform: scale(0.7)" :value="item.value" :checked="index === riseNum" />
{{item.name}}
</label>
</radio-group>
</view>
</view>
<view class="application-listIn">
<view class="listIn-name">票种</view>
<view class="listIn-inputBox">
<view class="inputBox-text">数电票(普通发票)</view>
</view>
</view>
<view class="application-listIn">
<view class="listIn-name">发票抬头<text>*</text></view>
<view class="listIn-inputBox">
<input class="uni-input inputBox-inputStyle" placeholder="填写发票抬头" />
</view>
</view>
<view class="application-listIn">
<view class="listIn-name">公司税号<text>*</text></view>
<view class="listIn-inputBox">
<input class="uni-input inputBox-inputStyle" placeholder="填写纳税人识别码(必填)" />
</view>
</view>
<view class="application-listIn">
<view class="listIn-name">地址电话</view>
<view class="listIn-inputBox">
<input class="uni-input inputBox-inputStyle" placeholder="填写企业注册地址、电话" />
</view>
</view>
<view class="application-listIn">
<view class="listIn-name">开户行及账号</view>
<view class="listIn-inputBox">
<input class="uni-input inputBox-inputStyle" placeholder="填写开户行及账号" />
</view>
</view>
</view>
<!--接收方式-->
<!--备注说明-->
<!--发票金额-->
<!--底部提交按钮-->
<view class="application-btnCase">
<view class="btnCase-btn">提交电子发票</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
riseList: [
{
value: '0',
name: '个人',
},
{
value: '1',
name: '企业'
},
],
riseNum: 0,
}
},
onLoad(option) {
},
methods: {
radioChange(){//点击radio
for (let i = 0; i < this.riseList.length; i++) {
if (this.riseList[i].value === evt.detail.value) {
this.riseNum = i
break
}
}
},
}
}
</script>
<style scoped="scoped" lang="scss">
.page-box{
background: #F7F8FA;
min-height: 100vh;
padding: 20rpx 0 148rpx 0;
}
.application-box{
width: 750rpx;
background-color: #fff;
margin-bottom: 20rpx;
}
.application-listIn{//填写内容
display: flex;
width: 100%;
padding: 0 0 0 36rpx;
border-bottom: solid 2rpx #F5F5F5;
.listIn-name{
width: 208rpx;
height: 100rpx;
font-weight: 400;
font-size: 28rpx;
color: #333333;
line-height: 100rpx;
text{
color: #F53F3F;
}
}
.listIn-inputBox{
flex: 1;
display: flex;
.inputBox-text{
font-weight: 400;
font-size: 28rpx;
color: #333333;
line-height: 100rpx;
}
.inputBox-radio{
display: flex;
width: 100%;
::v-deep .wx-radio-input.wx-radio-input-checked {
background-color: #FE6600 !important;
border-color: #FE6600 !important;
color: #ffffff !important;
}
.radio-txt{
font-weight: 400;
font-size: 28rpx;
color: #333333;
line-height: 100rpx;
margin-right: 80rpx;
}
}
.inputBox-inputStyle{
flex: 1;
height: 100rpx;
font-weight: 400;
font-size: 28rpx;
color: #333333;
line-height: 100rpx;
}
}
}
.application-listIn:nth-last-child(1){
border-bottom: none;
}
.application-label{//title样式
}
.application-textarea{//多行输入框
}
.application-listOrder{//订单列表
}
.application-btnCase{//按钮
width: 750rpx;
height: 128rpx;
background: #FFFFFF;
border-top: solid 1px #DCDFE6;
padding: 20rpx 0 0 0;
position: fixed;
bottom: 0;
left: 0;
.btnCase-btn{
width: 686rpx;
height: 88rpx;
background: #FE6600;
border-radius: 44rpx;
font-weight: 600;
font-size: 32rpx;
color: #FFFFFF;
line-height: 88rpx;
text-align: center;
margin: 0 auto;
}
}
</style>
pages/my/electronicInvoice/billingList/billingList.vue
View file @ 36515cec
<template>
<view class="productBigBox">
<!--开票列表-->
<view class="billing-argument" v-for="(item,index) in tableDate" :key="index" @click="tableDateCheckFun(index)">
<view class="argument-name">{{item.name}}</view>
<view class="argument-list">游玩时间：{{item.timer}}</view>
<view class="argument-list">购买数量：{{item.buyNum}}</view>
<view class="argument-list">订单金额：{{item.money}}</view>
<view class="argument-check" :class="item.checkType==true?'argument-checkAct':''">
<checkbox class="round" style="transform: scale(0.7)" :checked="item.checkType" shape="circle"></checkbox>
</view>
</view>
<!--开票列表--无参数-->
<view class="billing-noArgument" v-if="tableDate.length==0">
<image class="noArgument-img" src="/pages/my/static/electronicInvoice/noneMessage.png"></image>
<view class="noArgument-message">未查询到开票信息</view>
<view class="noArgument-text">您输入的订单号 / 手机号无对应待开票订单。请重新核对</view>
</view>
<!--开票按钮-->
<view class="billing-invoice">
<image class="invoice-img" src="/pages/my/static/electronicInvoice/invoiceBtn.png"></image>
......@@ -8,8 +23,8 @@
</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-check" :class="allChecked==true?'bottom-checkAct':''" @click="checkboxAllFun()">
<checkbox class="round" style="transform: scale(0.72)" :checked="allChecked" shape="circle"></checkbox>
<view class="bottom-allName">全部</view>
</view>
<view class="bottom-orderBox">
......@@ -25,7 +40,29 @@
export default {
data() {
return {
tableDate:[],//列表内容
tableDate:[
{
name:'长江索道 (索道南站单程)',
timer:'2025-02-20',
buyNum:'1',
money:'20.00',
checkType:false,
},
{
name:'长江索道 (索道南站单程)',
timer:'2025-02-21',
buyNum:'2',
money:'21.00',
checkType:true,
},
{
name:'长江索道 (索道南站单程)',
timer:'2025-02-22',
buyNum:'3',
money:'22.00',
checkType:false,
}
],//列表内容
pageIndex:1,//当前页
pageTotal:0,//总条数
allChecked:true,//全选
......@@ -38,7 +75,20 @@ export default {
getData(){//列表加载
console.log('加载了')
},
checkboxAllFun(){//脚部全部点击事件
if(this.allChecked == true){
this.allChecked = false
}else{
this.allChecked = true
}
},
tableDateCheckFun(index){//表格列表 点击事件
if(this.tableDate[index].checkType==true){
this.tableDate[index].checkType = false
}else{
this.tableDate[index].checkType = true
}
},
},
onReachBottom(){//上拉加载
this.pageIndex++
......@@ -52,7 +102,78 @@ export default {
background: #F7F8FA;
min-height: 100vh;
position: relative;
padding-bottom: 128rpx;
padding:20rpx 0 128rpx 0;
}
.billing-argument{
width: 710rpx;
height: 270rpx;
background: #FFFFFF;
border-radius: 8rpx;
margin: 0 auto 20rpx auto;
padding: 28rpx 36rpx 20rpx 36rpx;
position: relative;
.argument-name{
font-weight: 600;
font-size: 32rpx;
color: #333333;
line-height: 44rpx;
margin-bottom: 10rpx;
}
.argument-list{
font-weight: 400;
font-size: 28rpx;
color: #999999;
line-height: 56rpx;
}
.argument-check{
width: 32rpx;
height: 32rpx;
position: absolute;
top: 120rpx;
right: 36rpx;
::v-deep .wx-checkbox-input,
::v-deep .uni-checkbox-input{
box-sizing: border-box;
margin: 0;
}
}
.argument-checkAct{
::v-deep .wx-checkbox-input,
::v-deep .uni-checkbox-input{
background-color: #FE6600 !important;
border-color: #FE6600 !important;
color: #ffffff !important;
}
}
}
.billing-noArgument{
width: 600rpx;
margin: auto;
position: fixed;
top: 240rpx;
left: 0;
right: 0;
.noArgument-img{
display: block;
width: 342rpx;
height: 242rpx;
margin: 0 auto;
}
.noArgument-message{
font-weight: 600;
font-size: 32rpx;
color: #333333;
line-height: 44rpx;
text-align: center;
margin-bottom: 16rpx;
}
.noArgument-text{
font-weight: 400;
font-size: 28rpx;
color: #999999;
line-height: 40rpx;
text-align: center;
}
}
.billing-invoice{
width: 132rpx;
......@@ -96,9 +217,7 @@ export default {
::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;
margin: 22rpx 0 0 0;
}
.bottom-allName{
font-weight: 400;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment