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.
314 lines
7.8 KiB
314 lines
7.8 KiB
3 months ago
|
<template>
|
||
|
|
<view>
|
||
|
|
<view class="from-box amount">
|
||
|
|
<view class="">开票状态</view>
|
||
|
|
<view class="price">
|
||
|
|
<!-- <view class="invoice-state">开票成功</view> -->
|
||
|
|
<view :class="{'invoice-state':true, 'content-state-orange':progressVal==0,'content-state-blue':progressVal==2,'content-state-red':progressVal==1,'content-state-green':progressVal==3}">
|
||
|
|
{{['未审核','审核失败','审核成功','重开待审核'][progressVal==null?'':progressVal]}}
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="from-box">
|
||
|
|
<u--form labelPosition="left">
|
||
|
|
<view class="line line-icon ">
|
||
|
|
<u-form-item label="发票抬头" prop="userInfo.invoiceHeader" borderBottom ref="item1"
|
||
|
|
@click="goinvoiceTitle">
|
||
|
|
<u--input disabled v-model="model1.userInfo.invoiceHeader" border="none" inputAlign='right'
|
||
|
|
placeholder=""></u--input>
|
||
|
|
</u-form-item>
|
||
|
|
</view>
|
||
|
|
<view v-if="checked==1">
|
||
|
|
<view class="line">
|
||
|
|
<u-form-item label="税号" prop="userInfo.taxId" borderBottom ref="item1">
|
||
|
|
<u--input disabled v-model="model1.userInfo.taxId" border="none" inputAlign='right'
|
||
|
|
placeholder=""></u--input>
|
||
|
|
</u-form-item>
|
||
|
|
</view>
|
||
|
|
<view class="line">
|
||
|
|
<u-form-item label="注册地址" prop="userInfo.address" borderBottom ref="item1">
|
||
|
|
<u--input disabled v-model="model1.userInfo.address" border="none" inputAlign='right'
|
||
|
|
placeholder=""></u--input>
|
||
|
|
</u-form-item>
|
||
|
|
</view>
|
||
|
|
<view class="line">
|
||
|
|
<u-form-item label="公司开户行" prop="userInfo.bank" borderBottom ref="item1">
|
||
|
|
<u--input disabled v-model="model1.userInfo.bank" border="none" inputAlign='right' placeholder="">
|
||
|
|
</u--input>
|
||
|
|
</u-form-item>
|
||
|
|
</view>
|
||
|
|
<view class="line">
|
||
|
|
<u-form-item label="开户行账户" prop="userInfo.cardNo" borderBottom ref="item1">
|
||
|
|
<u--input disabled v-model="model1.userInfo.cardNo" border="none" inputAlign='right'
|
||
|
|
placeholder=""></u--input>
|
||
|
|
</u-form-item>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="line ">
|
||
|
|
<u-form-item label="发票金额" prop="userInfo.money" borderBottom ref="item1">
|
||
|
|
<u--input disabled v-model="model1.userInfo.money" border="none" inputAlign='right' placeholder=""
|
||
|
|
color="#4C91FF"></u--input>
|
||
|
|
</u-form-item>
|
||
|
|
</view>
|
||
|
|
<view class="">
|
||
|
|
<u-form-item label="申请时间" prop="userInfo.time" borderBottom ref="item1">
|
||
|
|
<u--input disabled v-model="model1.userInfo.time" border="none" inputAlign='right'
|
||
|
|
placeholder=""></u--input>
|
||
|
|
</u-form-item>
|
||
|
|
</view>
|
||
|
|
</u--form>
|
||
|
|
</view>
|
||
|
|
<!-- 邮寄信息 -->
|
||
|
|
<view class="content-title">
|
||
|
|
<view class="content-name">
|
||
|
|
<view class="orders-line"></view>
|
||
|
|
<view>邮寄信息</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="from-box">
|
||
|
|
<u--form labelPosition="left">
|
||
|
|
<view class="line-last">
|
||
|
|
<u-form-item label="邮寄地址" prop="userInfo.address" borderBottom ref="item1">
|
||
|
|
<u--input disabled v-model="model2.userInfo2.address" border="none" inputAlign='right'
|
||
|
|
placeholder=""></u--input>
|
||
|
|
</u-form-item>
|
||
|
|
</view>
|
||
|
|
<view class="line-last">
|
||
|
|
<u-form-item label="邮寄联系人" prop="userInfo.contacts" borderBottom ref="item1">
|
||
|
|
<u--input disabled v-model="model2.userInfo2.contacts" border="none" inputAlign='right'
|
||
|
|
placeholder=""></u--input>
|
||
|
|
</u-form-item>
|
||
|
|
</view>
|
||
|
|
<view class="line-last">
|
||
|
|
<u-form-item label="联系人电话" prop="userInfo.phone" borderBottom ref="item1">
|
||
|
|
<u--input disabled v-model="model2.userInfo2.phone" border="none" inputAlign='right'
|
||
|
|
placeholder=""></u--input>
|
||
|
|
</u-form-item>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
</u--form>
|
||
|
|
</view>
|
||
|
|
<view class="from-box amount">
|
||
|
|
<view class="">电子邮箱</view>
|
||
|
|
<view class="">
|
||
|
|
<u--input disabled v-model="model2.userInfo2.email" border="none" inputAlign='right'></u--input>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<!-- position bottom -->
|
||
|
|
<view class="footer-box">
|
||
|
|
<view class="check">
|
||
|
|
<u-button color="#4C91FF" :plain="true" shape='circle' @click="goBillingOrder">查看开票订单</u-button>
|
||
|
|
</view>
|
||
|
|
<!-- <view>
|
||
|
|
<u-button color="#4C91FF" shape='circle' @click="www">重开发票</u-button>
|
||
|
|
</view> -->
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup>
|
||
|
|
import config from '@/common/config/config.js';
|
||
|
|
import {
|
||
|
|
reactive,
|
||
|
|
ref,
|
||
|
|
} from "vue";
|
||
|
|
import {
|
||
|
|
onLoad,
|
||
|
|
onShow,
|
||
|
|
onReachBottom
|
||
|
|
} from "@dcloudio/uni-app";
|
||
|
|
//
|
||
|
|
const model1 = reactive({
|
||
|
|
userInfo: {
|
||
|
|
invoiceHeader: '',
|
||
|
|
taxId: '',
|
||
|
|
address: '',
|
||
|
|
bank: '',
|
||
|
|
cardNo: '',
|
||
|
|
}
|
||
|
|
})
|
||
|
|
const model2 = reactive({
|
||
|
|
userInfo2: {
|
||
|
|
address: '',
|
||
|
|
phone: '',
|
||
|
|
contacts: '',
|
||
|
|
email: '',
|
||
|
|
}
|
||
|
|
})
|
||
|
|
const progressVal=ref()
|
||
|
|
const inId=ref()
|
||
|
|
const checked=ref()
|
||
|
|
//
|
||
|
|
onLoad((option) => {
|
||
|
|
let detail = JSON.parse(option.detail)
|
||
|
|
inId.value=detail.id
|
||
|
|
progressVal.value=detail.progress
|
||
|
|
model1.userInfo.invoiceHeader = detail.invoiceHeader
|
||
|
|
model1.userInfo.taxId = detail.taxId
|
||
|
|
model1.userInfo.address = detail.address
|
||
|
|
model1.userInfo.bank = detail.bank
|
||
|
|
model1.userInfo.cardNo = detail.cardNo
|
||
|
|
model1.userInfo.money = detail.invoiceAmount + '元'
|
||
|
|
model1.userInfo.time = detail.createTime
|
||
|
|
model2.userInfo2.address = detail.shippingAddress
|
||
|
|
model2.userInfo2.phone = detail.contactPhone
|
||
|
|
model2.userInfo2.contacts = detail.recipient
|
||
|
|
model2.userInfo2.email = detail.email
|
||
|
|
checked.value=detail.type
|
||
|
|
console.log(option, 'option', detail);
|
||
|
|
})
|
||
|
|
//
|
||
|
|
const goBillingOrder = () => {
|
||
|
|
uni.navigateTo({
|
||
|
|
url: '../billingOrder/billingOrder?id='+inId.value
|
||
|
|
})
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="less" scoped>
|
||
|
|
.from-box {
|
||
|
|
background: #fff;
|
||
|
|
margin-top: 16rpx;
|
||
|
|
padding: 0 32rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.price {
|
||
|
|
color: #4C91FF;
|
||
|
|
font-size: 28rpx;
|
||
|
|
font-weight: 400;
|
||
|
|
text-align: right;
|
||
|
|
}
|
||
|
|
|
||
|
|
.line {
|
||
|
|
border-bottom: 1px solid #eee;
|
||
|
|
}
|
||
|
|
|
||
|
|
/deep/.u-form-item__body {
|
||
|
|
padding: 24rpx 0 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/deep/.u-form-item__body__left {
|
||
|
|
width: 250rpx !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/deep/.u-form-item__body__left__content__label {
|
||
|
|
color: #585858 !important;
|
||
|
|
font-size: 28rpx !important;
|
||
|
|
font-weight: 400 !important;
|
||
|
|
text-align: left !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/deep/.u-form-item__body__right {
|
||
|
|
// width: 50% !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/deep/.u-line:last-child {
|
||
|
|
border: 0 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.amount {
|
||
|
|
display: flex;
|
||
|
|
padding: 24rpx 32rpx;
|
||
|
|
justify-content: space-between;
|
||
|
|
align-items: center;
|
||
|
|
color: #585858;
|
||
|
|
font-size: 28rpx;
|
||
|
|
font-weight: 400;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
|
||
|
|
/deep/.u-input__content__field-wrapper__field {
|
||
|
|
height: 40rpx !important;
|
||
|
|
line-height: 40rpx !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.content-title {
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
margin: 16rpx 32rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.content-name {
|
||
|
|
font-size: 32rpx;
|
||
|
|
font-weight: 400;
|
||
|
|
text-align: left;
|
||
|
|
color: #171717;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.orders-line {
|
||
|
|
width: 4rpx;
|
||
|
|
height: 28rpx;
|
||
|
|
margin-right: 8rpx;
|
||
|
|
border-left: 4rpx solid #4C91FF;
|
||
|
|
border-radius: 4rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.footer-box {
|
||
|
|
width: 100%;
|
||
|
|
position: fixed;
|
||
|
|
bottom: 0;
|
||
|
|
padding: 16rpx 32rpx;
|
||
|
|
background-color: #fff;
|
||
|
|
border-top: 1px solid #eee;
|
||
|
|
// display: flex;
|
||
|
|
|
||
|
|
/deep/.u-button {
|
||
|
|
// width: 331rpx !important;
|
||
|
|
height: 72rpx !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/deep/.u-input--square {
|
||
|
|
background-color: #fff !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.line-icon {
|
||
|
|
/deep/.u-icon__icon {
|
||
|
|
color: #808080 !important;
|
||
|
|
margin-left: 8rpx;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.line-last {
|
||
|
|
border-bottom: 1px solid #eee;
|
||
|
|
}
|
||
|
|
.line-last:last-child {
|
||
|
|
border: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.invoice-state {
|
||
|
|
border: 1px solid #4C91FF;
|
||
|
|
font-size: 20rpx;
|
||
|
|
font-weight: 400;
|
||
|
|
color: #4C91FF;
|
||
|
|
padding: 8rpx 16rpx;
|
||
|
|
border-radius: 8rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.check {
|
||
|
|
margin-right: 24rpx;
|
||
|
|
}
|
||
|
|
.content-state-orange {
|
||
|
|
border: 1px solid #FF7B0E;
|
||
|
|
color: #FF7B0E;
|
||
|
|
}
|
||
|
|
.content-state-blue {
|
||
|
|
border: 1px solid #4C91FF;
|
||
|
|
color: #4C91FF;
|
||
|
|
}
|
||
|
|
.content-state-red {
|
||
|
|
border: 1px solid #F2634F;
|
||
|
|
color: #F2634F;
|
||
|
|
}
|
||
|
|
.content-state-green {
|
||
|
|
border: 1px solid #26C3C0;
|
||
|
|
color: #26C3C0;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<style lang="less">
|
||
|
|
page {
|
||
|
|
background-color: #F2F6F7;
|
||
|
|
padding-bottom: 120rpx;
|
||
|
|
}
|
||
|
|
</style>
|