You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
128 lines
3.1 KiB
128 lines
3.1 KiB
1 year ago
|
<template>
|
||
|
|
<view class="page-total">
|
||
|
|
<view class="cu-modal bottom-modal" :class="{ show: isShow }" @click="hide">
|
||
|
|
<view class="cu-dialog">
|
||
|
|
<view class="invoice-title">
|
||
|
|
<view class="title">发票</view>
|
||
|
|
<view class="notice">发票须知</view>
|
||
|
|
</view>
|
||
|
|
<!-- 发票数据 -->
|
||
|
|
<view class="invoice-data" @click.stop="onStop">
|
||
|
|
<view class="invoice-type">
|
||
|
|
<view class="title">发票类型</view>
|
||
|
|
<view class="type-list">
|
||
|
|
<view class="list" :class="{'action':InvoiceType===0}" @click.stop="onInvoiceType(0)">
|
||
|
|
<text>普通发票</text>
|
||
|
|
</view>
|
||
|
|
<view class="list" :class="{'action':InvoiceType===1}" @click.stop="onInvoiceType(1)">
|
||
|
|
<text>增值营业专业税</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="invoice-rise">
|
||
|
|
<view class="title">发票抬头</view>
|
||
|
|
<view class="type-list">
|
||
|
|
<view class="list" :class="{'action':InvoiceRise===0}" @click.stop="onInvoiceRise(0)">
|
||
|
|
<text>个人</text>
|
||
|
|
</view>
|
||
|
|
<view class="list" :class="{'action':InvoiceRise===1}" @click.stop="onInvoiceRise(1)">
|
||
|
|
<text>单位</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="invoice-input">
|
||
|
|
<view class="list">
|
||
|
|
<text>单位名称</text>
|
||
|
|
<input type="text" placeholder="请填写单位名称" />
|
||
|
|
</view>
|
||
|
|
<view class="list">
|
||
|
|
<text>纳税人识别号</text>
|
||
|
|
<input type="text" placeholder="请填写纳税人识别号" />
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="invoice-rise">
|
||
|
|
<view class="title">收票人信息</view>
|
||
|
|
<view class="invoice-input">
|
||
|
|
<view class="list">
|
||
|
|
<text>收票人手机*</text>
|
||
|
|
<input type="text" placeholder="可通过手机号在发票服务平台查询" />
|
||
|
|
</view>
|
||
|
|
<view class="list">
|
||
|
|
<text>收票人邮箱</text>
|
||
|
|
<input type="text" placeholder="用来接收电子发票邮箱,可选填" />
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="invoice-rise">
|
||
|
|
<view class="title">发票内容</view>
|
||
|
|
<view class="type-list">
|
||
|
|
<view class="list action">
|
||
|
|
<text>商品明细</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<!-- 确认 -->
|
||
|
|
<view class="footer-Affirm">
|
||
|
|
<view class="no-invoice" @click.stop="onNoInvoice">不开发票</view>
|
||
|
|
<view class="Affirm-invoice" @click.stop="onAffirmInvoice">确定</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
isShow: false,
|
||
|
|
InvoiceType: 0,
|
||
|
|
InvoiceRise: 0,
|
||
|
|
};
|
||
|
|
},
|
||
|
|
methods:{
|
||
|
|
show(){
|
||
|
|
this.isShow = true;
|
||
|
|
},
|
||
|
|
hide(){
|
||
|
|
this.isShow = false;
|
||
|
|
},
|
||
|
|
/**
|
||
|
|
* 阻止冒泡
|
||
|
|
*/
|
||
|
|
onStop(){
|
||
|
|
|
||
|
|
},
|
||
|
|
/**
|
||
|
|
* 发票类型点击
|
||
|
|
*/
|
||
|
|
onInvoiceType(type){
|
||
|
|
this.InvoiceType = type;
|
||
|
|
},
|
||
|
|
/**
|
||
|
|
* 发票抬头点击
|
||
|
|
*/
|
||
|
|
onInvoiceRise(type){
|
||
|
|
this.InvoiceRise = type;
|
||
|
|
},
|
||
|
|
/**
|
||
|
|
* 不开发票点击
|
||
|
|
*/
|
||
|
|
onNoInvoice(){
|
||
|
|
this.hide();
|
||
|
|
},
|
||
|
|
/**
|
||
|
|
* 开发票点击
|
||
|
|
*/
|
||
|
|
onAffirmInvoice(){
|
||
|
|
this.hide();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped lang="scss">
|
||
|
|
@import 'InvoiceInfo.scss';
|
||
|
|
</style>
|