wo123/shengqingqixie-wechat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
shengqingqixie-wechat/pages/packageA/user/my_invoice.vue

543 lines
18 KiB
Vue
Raw Normal View History

123
2024-07-09 18:11:31 +08:00
<template>
123
2024-07-30 18:16:46 +08:00
<view style="background: #F1F2F8;min-height: 100vh;" v-cloak>
123
2024-07-09 18:11:31 +08:00
<tn-nav-bar :isBack="false" backTitle="" :bottomShadow="true" backgroundColor="#FFFFFF">
<view class="custom-nav tn-flex tn-flex-col-center tn-flex-row-left">
<view style="padding-left: 15rpx;" @click="goBack()">
<text class="tn-icon-left" style="font-size: 40rpx;"></text>
</view>
123
2024-07-30 18:16:46 +08:00
<view style="width: 83%;font-weight: bold;">
<text>发票开取</text>
123
2024-07-09 18:11:31 +08:00
</view>
</view>
</tn-nav-bar>
<view class="tn-safe-area-inset-bottom" :style="{paddingTop: vuex_custom_bar_height + 'px'}">
123
2024-07-30 18:16:46 +08:00
<view v-if="allList.length==0" style="text-align: center;padding-top: 200rpx;">
<image class="no-img" src="/static/_6@2x.png" style="width: 250rpx;" mode="widthFix"></image>
<view style="font-size: 34rpx;font-weight: bold;margin-top: 40rpx;">暂无发票数据</view>
<view style="font-size: 28rpx;color: #BABDC7;margin-top: 20rpx;">未查找到您的发票信息，赶快去申请～</view>
<view style="margin-top: 80rpx;">
<tn-button width="450rpx" height="85rpx" backgroundColor="#3056D3" shape="round"
fontColor="#ffffff">去申请发票</tn-button>
</view>
</view>
<view style="padding: 30rpx;">
<view v-for="item in 5"
style="margin-bottom: 30rpx;background-color: #FFF;border-radius: 20rpx;padding: 30rpx;">
<view class="tn-flex tn-flex-center tn-flex-col-center tn-flex-row-between">
<view style="font-size: 32rpx;font-weight: bold;">好想你健康食品股份有限公司</view>
<view style="color: #FF9847;">
<text>待审核</text>
<text class="tn-icon-right"></text>
</view>
</view>
<view class="view_text" style="color: #666666;">
<view>
<text>上官绪波 / 2024.07.12</text>
</view>
<view>
<text>发票金额：</text>
<text>¥1385</text>
</view>
</view>
<view style="height: 1rpx;border-top: #BABDC7 1rpx dashed;margin: 30rpx 0rpx;"></view>
<view style="text-align: right;">
<tn-button @click="infoMod = true" height="70rpx" width="200rpx" fontColor="#999999"
shape="round" backgroundColor="#999999" :plain="true">查看</tn-button>
</view>
</view>
<view @click="addMod = true"
style="position: fixed;bottom: 10%;right: 0;box-shadow: 0rpx 4rpx 25rpx 0rpx rgba(48,86,211,0.25);text-align: center;color: #FFF;;background-color: #3056D3;border-radius: 80rpx 0 0rpx 80rpx;width: 180rpx;;height: 70rpx;line-height: 70rpx;">
申请发票
</view>
</view>
<!-- <view style="padding:40rpx;">
123
2024-07-09 18:11:31 +08:00
<view class="tn-flex tn-flex-center tn-flex-row-between ">
<view>
已有发票 {{count}} 张
</view>
<view>
<tn-button @click="addMod = true" backgroundColor="#3D7EFF" size="sm"
fontColor="#ffffff">发票申请</tn-button>
</view>
</view>
</view>
<view style="padding:0rpx 40rpx;" v-for="item in allList">
<view @click="openInfo(item)"
class="tn-flex tn-flex-center tn-flex-row-between tn-flex-col-center bg-flex-shadow tn-shadow-blur">
<view>
<view style="font-size: 34rpx;font-weight: 600;">
<text>发票金额：</text>
<text class="tn-icon-money-fill" style="color: #28B93D;"></text>
<text style="color: #28B93D;">{{item.money}}</text>
</view>
<view style="margin-top: 10rpx;font-size: 28rpx;color: #999999;">
<text>{{item.createtime}}</text>
</view>
</view>
<view>
<tn-tag v-if="item.if_ssue==1" backgroundColor="#31E749" fontColor="#ffffff"
shape="radius">已通过</tn-tag>
<tn-tag v-if="item.if_ssue==2" backgroundColor="#E83A30" fontColor="#ffffff"
shape="radius">被拒绝</tn-tag>
<tn-tag v-if="item.if_ssue==3" backgroundColor="#FF7043" fontColor="#ffffff"
shape="radius">审核中</tn-tag>
<text class="tn-icon-right-triangle" style="margin-left: 10rpx;"></text>
</view>
</view>
<view style="width: 100%;height: 1px;background-color: #F8F7F8;margin: 40rpx 0rpx;"></view>
123
2024-07-30 18:16:46 +08:00
</view> -->
123
2024-07-09 18:11:31 +08:00
</view>
<tn-popup v-model="addMod" mode="right" :safeAreaInsetBottom="true" width="100%">
123
2024-07-30 18:16:46 +08:00
<tn-nav-bar :isBack="false" backTitle="" :bottomShadow="true" backgroundColor="#FFFFFF">
123
2024-07-09 18:11:31 +08:00
<view class="custom-nav tn-flex tn-flex-col-center tn-flex-row-left">
<view style="padding-left: 15rpx;" @click="addMod = false">
<text class="tn-icon-left" style="font-size: 40rpx;"></text>
</view>
123
2024-07-30 18:16:46 +08:00
<view style="width: 83%;font-weight: bold;">
<text>申请发票</text>
123
2024-07-09 18:11:31 +08:00
</view>
</view>
</tn-nav-bar>
123
2024-07-30 18:16:46 +08:00
<view :style="{paddingTop: vuex_custom_bar_height+'px'}"
style="background-color: #F1F2F8;min-height: 100vh;">
<view class="text" style="padding:30rpx;">
<view style="background-color: #FFF;border-radius: 20rpx;padding:10rpx 30rpx;">
<tn-form ref="form" :labelWidth="150">
<tn-form-item label="申请人" prop="name">
<tn-input placeholder="申请人" inputAlign="right" :customStyle="{width: '470rpx'}"
v-model="addForm.name" />
</tn-form-item>
<tn-form-item label="公司名称" prop="unit">
<tn-input placeholder="公司名称" inputAlign="right" :customStyle="{width: '470rpx'}"
v-model="addForm.unit" />
</tn-form-item>
<tn-form-item label="纳税人识别号" :labelWidth="200" prop="taxpayer_identification_number">
<tn-input placeholder="纳税人识别号" inputAlign="right" :customStyle="{width: '420rpx'}"
v-model="addForm.taxpayer_identification_number" />
</tn-form-item>
<tn-form-item label="单位地址" prop="unit_address">
<tn-input placeholder="单位地址" inputAlign="right" :customStyle="{width: '470rpx'}"
v-model="addForm.unit_address" />
</tn-form-item>
<tn-form-item label="单位电话" prop="telephone">
<tn-input placeholder="单位电话" inputAlign="right" :customStyle="{width: '470rpx'}"
v-model="addForm.telephone" />
</tn-form-item>
<tn-form-item label="银行基本户账号" :labelWidth="220" prop="bank_basic_account_number">
<tn-input placeholder="银行基本户账号" inputAlign="right" :customStyle="{width: '410rpx'}"
v-model="addForm.bank_basic_account_number" />
</tn-form-item>
<tn-form-item label="开户行" prop="bank">
<tn-input placeholder="开户行" inputAlign="right" :customStyle="{width: '470rpx'}"
v-model="addForm.bank" />
</tn-form-item>
<tn-form-item label="发票金额" prop="bank" :borderBottom="false">
<tn-input placeholder="发票金额" inputAlign="right" :customStyle="{width: '470rpx'}"
v-model="addForm.money" />
</tn-form-item>
</tn-form>
123
2024-07-09 18:11:31 +08:00
</view>
</view>
123
2024-07-30 18:16:46 +08:00
<view
style="position: fixed;bottom:0px;width: 100%;background-color: #FFFFFF;box-shadow: 0rpx -2rpx 4rpx 0rpx rgba(186,189,199,0.2);padding:30rpx 30rpx 40rpx 30rpx;">
<view
style="margin: 0 auto;line-height: 80rpx;height: 80rpx;font-size: 32rpx;font-weight: bold;text-align: center;width: 80%;color: #ffffff;;background: #3056D3;border: 1rpx solid #3056D3;border-radius:90rpx;">
<text>申请发票</text>
123
2024-07-09 18:11:31 +08:00
</view>
</view>
</view>
</tn-popup>
<tn-popup v-model="infoMod" mode="right" :safeAreaInsetBottom="true" width="100%">
123
2024-07-30 18:16:46 +08:00
<tn-nav-bar :isBack="false" backTitle="" :bottomShadow="true" backgroundColor="#FFFFFF">
123
2024-07-09 18:11:31 +08:00
<view class="custom-nav tn-flex tn-flex-col-center tn-flex-row-left">
123
2024-07-30 18:16:46 +08:00
<view style="padding-left: 15rpx;" @click="addMod = false">
123
2024-07-09 18:11:31 +08:00
<text class="tn-icon-left" style="font-size: 40rpx;"></text>
</view>
123
2024-07-30 18:16:46 +08:00
<view style="width: 83%;font-weight: bold;">
<text>发票开取</text>
123
2024-07-09 18:11:31 +08:00
</view>
</view>
</tn-nav-bar>
123
2024-07-30 18:16:46 +08:00
<view :style="{paddingTop: vuex_custom_bar_height+'px'}"
style="background-color: #F1F2F8;min-height: 100vh;">
<view style="padding: 30rpx;">
<view style="background-color: #FFF;border-radius: 20rpx;padding: 30rpx;">
<view class="tn-flex tn-flex-center tn-flex-col-center tn-flex-row-between">
<view style="font-size: 32rpx;font-weight: bold;">好想你健康食品股份有限公司</view>
<view style="color: #FF9847;">待审核</view>
</view>
<view class="view_text" style="font-size: 28rpx;color: #666666;margin-top: 30rpx;">
<view>
<text>申请人：</text>
<text>上官绪波</text>
</view>
<view>
<text>申请时间：</text>
<text>2024.07.16</text>
</view>
<view>
<text>单位电话：</text>
<text>0371-65560130</text>
</view>
<view>
<text>单位地址：</text>
<text>河南省新郑市中华北路199号</text>
</view>
<view>
<text>银行基本户账号：</text>
<text>130701012000564</text>
</view>
<view>
<text>纳税人识别号：</text>
<text>310227687656440</text>
</view>
<view>
<text>开户行：</text>
<text>郑州市金水区建设银行黄河路支行</text>
</view>
<view>
<text>发票金额：</text>
<text>¥680</text>
</view>
</view>
123
2024-07-09 18:11:31 +08:00
</view>
</view>
</view>
123
2024-07-30 18:16:46 +08:00
<view
style="position: fixed;bottom:0px;width: 100%;background-color: #FFFFFF;box-shadow: 0rpx -2rpx 4rpx 0rpx rgba(186,189,199,0.2);padding:30rpx 30rpx 40rpx 30rpx;">
<view
style="margin: 0 auto;line-height: 80rpx;height: 80rpx;font-size: 32rpx;font-weight: bold;text-align: center;width: 80%;color: #ffffff;;background: #3056D3;border: 1rpx solid #3056D3;border-radius:90rpx;">
<text>下载发票</text>
</view>
</view>
123
2024-07-09 18:11:31 +08:00
</tn-popup>
123
2024-07-30 18:16:46 +08:00
<!-- <tn-popup v-model="tt_add_show" mode="right" :safeAreaInsetBottom="true" width="100%">
123
2024-07-10 18:13:57 +08:00
<tn-nav-bar :isBack="false" backTitle="" :alpha="true" :bottomShadow="false">
<view class="custom-nav tn-flex tn-flex-col-center tn-flex-row-left">
<view style="padding-left: 15rpx;" @click="tt_add_show = false">
<text class="tn-icon-left" style="font-size: 40rpx;"></text>
</view>
<view class="tn-margin-top"
style="text-shadow: 1rpx 0 0 #FFF, 0 1rpx 0 #FFF, -1rpx 0 0 #FFF , 0 -1rpx 0 #FFF;">
<tn-tabs :list="[{name:'选择开票信息'}]" activeColor="#000" :bold="false" :fontSize="34"></tn-tabs>
</view>
</view>
</tn-nav-bar>
<view :style="{paddingTop: vuex_custom_bar_height+'px'}" class="custom-modal-content">
<view v-if="!tt_add_show_add" style="padding:0rpx 30rpx 150rpx 30rpx;">
<view style="text-align:right;">
<tn-button @click="tt_add_show_add = true" backgroundColor="#3D7EFF" size="sm"
fontColor="#ffffff">添加开票信息</tn-button>
</view>
<tn-radio-group v-model="header_id" width="100%" wrap @change="radioGroupChange">
<block v-for="(item,index) in tt_list">
<tn-radio :name="item.id+''" :size="40" borderColor="#3D7EFF" activeColor="#3D7EFF">
<view style="padding: 30rpx 0rpx;margin-left: 30px;">
<view>申请人：{{item.name}}</view>
<view>公司名称：{{item.unit}}</view>
<view>纳税人识别号：{{item.taxpayer_identification_number}}</view>
<view>单位地址：{{item.unit_address}}</view>
<view>单位电话：{{item.telephone}}</view>
<view>银行基本户账号：{{item.bank_basic_account_number}}</view>
<view>开户行：{{item.bank}}</view>
</view>
</tn-radio>
</block>
</tn-radio-group>
</view>
<view style="position: fixed;bottom: 80rpx;width: 92%;margin: 0 auto;text-align: center;">
<tn-button @click="tt_add_show = false" backgroundColor="#3D7EFF" width="300rpx" height="80rpx"
fontColor="#ffffff">确定</tn-button>
</view>
<view v-if="tt_add_show_add" class="text" style="padding:20rpx 40rpx;">
<view style="text-align: center;font-size: 32rpx;font-weight: 600;">添加开票信息</view>
<tn-form ref="form" :labelWidth="120">
<tn-form-item prop="name">
<tn-input placeholder="申请人" :customStyle="{width: '600rpx'}" v-model="addForm.name" />
</tn-form-item>
<tn-form-item prop="unit">
<tn-input placeholder="公司名称" :customStyle="{width: '600rpx'}" v-model="addForm.unit" />
</tn-form-item>
<tn-form-item prop="taxpayer_identification_number">
<tn-input placeholder="纳税人识别号" :customStyle="{width: '600rpx'}"
v-model="addForm.taxpayer_identification_number" />
</tn-form-item>
<tn-form-item prop="unit_address">
<tn-input placeholder="单位地址" :customStyle="{width: '600rpx'}"
v-model="addForm.unit_address" />
</tn-form-item>
<tn-form-item prop="telephone">
<tn-input placeholder="单位电话" :customStyle="{width: '600rpx'}" v-model="addForm.telephone" />
</tn-form-item>
<tn-form-item prop="bank_basic_account_number">
<tn-input placeholder="银行基本户账号" :customStyle="{width: '600rpx'}"
v-model="addForm.bank_basic_account_number" />
</tn-form-item>
<tn-form-item prop="bank">
<tn-input placeholder="开户行" :customStyle="{width: '600rpx'}" v-model="addForm.bank" />
</tn-form-item>
</tn-form>
<view style="text-align: center;margin-top: 50rpx;">
<tn-button backgroundColor="#E6E6E6" height="70rpx" fontColor="#ffffff"
@click="tt_add_show_add = false" width="40%">取消</tn-button>
<tn-button backgroundColor="#3D7EFF" height="70rpx" width="40%" fontColor="#ffffff"
style="margin-left: 30rpx;" @click="tt_add_do">提交</tn-button>
</view>
</view>
</view>
123
2024-07-30 18:16:46 +08:00
</tn-popup> -->
123
2024-07-09 18:11:31 +08:00
</view>
</template>
<script>
import {
findMemberID,
addInvoiceHeader,
addInvoiceLog,
someMethod,
getInvoiceLogWithHeader
} from "@/util/api";
import store from "@/store";
export default {
data() {
return {
apiImgUrl: this.$store.state.imgUrl,
addMod: false,
infoMod: false,
123
2024-07-10 18:13:57 +08:00
tt_add_show_add: false,
123
2024-07-09 18:11:31 +08:00
addForm: {
name: '',
taxpayer_identification_number: '',
unit: '',
unit_address: '',
telephone: '',
bank_basic_account_number: '',
bank: '',
association_id: 0,
123
2024-07-30 18:16:46 +08:00
money: '',
123
2024-07-09 18:11:31 +08:00
},
invoice_type_show: false,
actionSheetList: [{
text: '普票',
id: 1,
},
{
text: '专票',
id: 2
}
],
123
2024-07-10 18:13:57 +08:00
header_id: -1,
header_id_name: '',
123
2024-07-09 18:11:31 +08:00
invoice_type_name: '普票',
invoice_type: 1,
tt_add_show: false,
tt_show: false,
tt_list: [],
page: 1,
allList: [],
info: {},
count: 0
}
},
onLoad() {
var gid = uni.getStorageSync('Gid');
this.addForm.association_id = gid;
this.findMemberList();
this.getList();
},
onReachBottom() {
this.page += 1;
this.getList();
},
methods: {
123
2024-07-10 18:13:57 +08:00
radioGroupChange(d) {
const item = this.tt_list.find(item => item.id == d);
console.log(item);
this.header_id_name = item;
},
123
2024-07-09 18:11:31 +08:00
openImg() {
uni.previewImage({
current: 0,
urls: [this.apiImgUrl + this.info.invoice_image],
});
},
openInfo(d) {
getInvoiceLogWithHeader({
id: d.id
})
.then(res => {
console.log(res);
this.info = res.data;
this.infoMod = true;
})
.catch(error => {
uni.showToast({
title: error,
icon: 'none',
duration: 2000
});
})
},
actionSheetCallback(index) {
this.invoice_type_name = this.actionSheetList[index].text;
this.invoice_type = this.actionSheetList[index].id;
},
tt_show_do() {
123
2024-07-10 18:13:57 +08:00
this.tt_add_show = true;
// if (this.tt_list.length == 0) {
// uni.showToast({
// title: '请先添加开票信息',
// icon: 'none',
// duration: 2000
// });
// this.tt_add_show = true;
// } else {
// this.tt_show = true;
// }
123
2024-07-09 18:11:31 +08:00
},
kp_add_do() {
if (this.header_id == 0) {
uni.showToast({
title: '请选择开票信息',
icon: 'none',
duration: 2000
});
return;
}
if (this.money == '' || this.money <= 0) {
uni.showToast({
title: '请填写金额',
icon: 'none',
duration: 2000
});
return;
}
addInvoiceLog({
association_id: this.addForm.association_id,
header_id: this.header_id,
money: this.money,
invoice_type: this.invoice_type
})
.then(res => {
console.log(res);
if (res.code == 1) {
uni.showToast({
title: res.msg,
icon: 'none',
duration: 2000
});
this.addMod = false;
this.header_id = 0;
this.header_id_name = '请选择开票信息';
this.invoice_type_name = '普票';
this.invoice_type = 1;
this.money = '';
123
2024-07-10 18:13:57 +08:00
this.allList = [];
this.page = 1;
this.getList();
123
2024-07-09 18:11:31 +08:00
} else {
uni.showModal({
title: '提示',
content: res.msg,
})
}
})
.catch(error => {
uni.showToast({
title: error,
icon: 'none',
duration: 2000
});
})
},
tt_confirm(d) {
console.log(d);
this.header_id_name = d[0].label;
this.header_id = d[0].value;
},
tt_add_do() {
addInvoiceHeader(this.addForm)
.then(res => {
console.log(res);
uni.showToast({
title: res.msg,
icon: 'none',
duration: 2000
});
this.tt_add_show = false;
this.findMemberList();
})
.catch(error => {
uni.showToast({
title: error,
icon: 'none',
duration: 2000
});
})
},
findMemberList() {
findMemberID()
.then(res => {
console.log(res);
if (res.data == null) {
this.tt_list = [];
} else {
123
2024-07-10 18:13:57 +08:00
// var key = res.data;
// const transformedSelectList = key.map(item => ({
// value: item.id,
// label: item.unit
// }));
this.tt_list = res.data;
123
2024-07-09 18:11:31 +08:00
}
})
.catch(error => {
uni.showToast({
title: error,
icon: 'none',
duration: 2000
});
})
},
getList() {
someMethod({
page: this.page,
size: 10
})
.then(res => {
console.log(res);
this.allList.push(...res.data.data);
123
2024-07-10 18:13:57 +08:00
this.count = res.data.count;
123
2024-07-09 18:11:31 +08:00
})
.catch(error => {
uni.showToast({
title: error,
icon: 'none',
duration: 2000
});
})
},
goBack() {
if (getCurrentPages().length > 1) {
uni.navigateBack()
} else {
uni.redirectTo({
url: '/pages/index/index'
})
}
},
}
}
</script>
<style scoped>
.info_text view {
margin-bottom: 40rpx;
}
123
2024-07-30 18:16:46 +08:00
.view_text view {
margin-top: 20rpx;
}
123
2024-07-09 18:11:31 +08:00
</style>
Reference in New Issue Copy Permalink