You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
137 lines
2.8 KiB
Vue
137 lines
2.8 KiB
Vue
<template>
|
|
<view class="invoice_list">
|
|
<view class="bar_list">
|
|
<view v-for="(item,index) in bar_list" :key="index" @click="BarClick(item.value)" class="bar"
|
|
:class="item.value === active_bar ? 'active_bar' : '' ">{{item.name}}</view>
|
|
</view>
|
|
<view class="button_row"><button @click="AddClick()" class="mini-btn"
|
|
style="background-color:#99dcff; color: #006597;" size="mini">申请开票</button></view>
|
|
<view class="litem" v-for="(item,index) in list" :key="index" @click="goto(item.id)">
|
|
<view class="litem_row1">
|
|
<view>{{item.shenqing_time.substring(0,10)}} 申请发票</view>
|
|
<view>
|
|
<uni-tag v-if="item.status==2" text="已开票" type="success" />
|
|
<uni-tag v-if="item.status==1" text="待处理" type="warning" />
|
|
<uni-tag v-if="item.status==0" text="已拒绝" type="error" />
|
|
</view>
|
|
</view>
|
|
<view class="litem_row2">申请金额：￥{{item.price}}</view>
|
|
<view class="jujueyuanyin" v-if="item.status==0">拒绝原因：{{item.refuse_content}}</view>
|
|
</view>
|
|
<view v-if="list.length==0" class="zanwu"><uni-icons color="#ccc" type="close" size="30"></uni-icons><view>暂无内容</view></view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {
|
|
ref,onMounted
|
|
} from "vue"
|
|
import {InvoiceGetList} from "@/api"
|
|
let bar_list = [{
|
|
name: '全部',
|
|
value: 9
|
|
}, {
|
|
name: '待处理',
|
|
value: 1
|
|
}, {
|
|
name: '已开票',
|
|
value: 2
|
|
}, {
|
|
name: '被拒绝',
|
|
value: 0
|
|
}]
|
|
let active_bar = ref(9)
|
|
//点击顶部导航
|
|
const BarClick = (e) => {
|
|
active_bar.value = e
|
|
GetList()
|
|
}
|
|
const AddClick = () => {
|
|
uni.navigateTo({
|
|
url: '/pages/invoice/edit'
|
|
})
|
|
}
|
|
const goto=(id)=>{
|
|
uni.navigateTo({
|
|
url: '/pages/invoice/detail?id='+id
|
|
})
|
|
}
|
|
let list = ref([])
|
|
const GetList=()=>{
|
|
InvoiceGetList({status:active_bar.value}).then(res => {
|
|
if(res.status){
|
|
list.value=res.data
|
|
}
|
|
})
|
|
}
|
|
onMounted(()=>{
|
|
GetList()
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
.invoice_list {
|
|
padding: 20rpx;
|
|
}
|
|
|
|
.bar_list {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
border-bottom: 1px solid #f0f0f0;
|
|
background-color: #fff;
|
|
border-radius: 20rpx;
|
|
}
|
|
|
|
.bar {
|
|
padding: 15rpx 20rpx;
|
|
width: 100%;
|
|
text-align: center;
|
|
border-radius: 20rpx;
|
|
color: #999999;
|
|
font-weight: 700;
|
|
font-size: 25rpx;
|
|
|
|
}
|
|
|
|
.active_bar {
|
|
background-color: #c1e5ff;
|
|
color: #0083c5;
|
|
}
|
|
|
|
.button_row {
|
|
width: 100%;
|
|
text-align: right;
|
|
margin-top: 10rpx;
|
|
}
|
|
|
|
.litem {
|
|
font-size: 25rpx;
|
|
color: #676767;
|
|
padding: 20rpx;
|
|
background-color: #fff;
|
|
margin-bottom: 20rpx;
|
|
border-radius: 10rpx;
|
|
}
|
|
|
|
.litem_row1 {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-bottom: 10rpx;
|
|
}
|
|
|
|
.litem_row2 {
|
|
margin-bottom: 10rpx;
|
|
width: 100%;
|
|
/* text-align: right; */
|
|
}
|
|
|
|
.jujueyuanyin {
|
|
color: #2a8abd
|
|
}
|
|
.zanwu{
|
|
color: #ccc;
|
|
text-align: center;
|
|
margin-top: 80rpx;
|
|
font-size: 28rpx;
|
|
}
|
|
</style> |