video_app/me/detail/auditrecords.vue

575 lines
14 KiB
Vue

<template>
<view class="content">
<view class="contenttop">
<view class="flex-start">
<input type="text" placeholder="请输入抬头名称" v-model="form.user_name" @input="onInput" />
<text @click="popupshow = !popupshow">筛选</text>
</view>
<view class="contenttopbox flex-center">
<text @click="(form.type = '-1'), (form.page = '1'), (form.user_name = ''), invoicingrecordsthatneed()" :class="form.type == '-1' ? 'classtext' : ''">待审核</text>
<text @click="(form.type = '1'), (form.page = '1'), (form.user_name = ''), invoicingrecordsthatneed()" :class="form.type == '1' ? 'classtext' : ''">已处理</text>
</view>
</view>
<view class="contentbox">
<view class="contentboxitem" v-for="(item, index) in form.list" :key="index">
<view class="contentboxitemtop flex-between">
<text>{{ item.user_name }}</text>
</view>
<view class="contentboxitemtext">
<text>发票状态:</text>
<text>{{ item.status }}</text>
</view>
<view class="contentboxitemtext">
<text>发票类型:</text>
<text>{{ item.type }}</text>
</view>
<view class="contentboxitemtext">
<text>发票金额:</text>
<text>{{ item.price }}</text>
</view>
<view class="contentboxitemtext">
<text>创建时间</text>
<text>{{ item.createtime }}</text>
</view>
<view class="contentboxitemtext flex-start" @click="previewImage(item.img)">
<text>开票凭证</text>
<image :src="item.img" mode="aspectFill"></image>
</view>
<view v-if="item.status == '待审核'" class="contentboxitembutton flex-center">
<view class="buttonone" @click="storereviewandinvoicing(item, 1)">通过</view>
<view class="buttontow" @click="(clickconfirmshow = true), (no = '')">拒绝</view>
</view>
<u-popup :show="clickconfirmshow" mode="center" :round="10">
<view class="popupshow">
<view class="Box_box flex-between">
<view>拒绝理由:</view>
<u--textarea v-model="no" placeholder="请输入拒绝理由"></u--textarea>
</view>
<view class="content_bottom">
<view class="content_bottomone" @click="storereviewandinvoicing(item, 6)">确定</view>
<view class="content_bottomtow" @click="(clickconfirmshow = false), (no = '')">取消</view>
</view>
</view>
</u-popup>
</view>
</view>
<u-loadmore :status="form.status" />
<u-popup :show="popupshow" @close="popupshow = !popupshow" :round="10">
<view class="popupshow">
<view class="popupshowtop">筛选</view>
<view class="popupshowbox">
<view class="popupshowboxtitel">按时间筛选</view>
<view class="popupshowbox_box flex-between">
<view class="popupshowbox_item" v-for="(item, index) in daylist" :key="index" @click="clickday(item, index)" :class="selectshow === index ? 'select' : ''">
{{ item.name }}
</view>
<view class="popupshowbox_itemzdy flex-between" v-if="showpickerbox && selectshow == 2">
<view class="popupshowbox_item" @click="(showpicker = !showpicker), (clickshowpicker = 1)">
{{ starttime }}
</view>
-
<view class="popupshowbox_item" @click="(showpicker = !showpicker), (clickshowpicker = 2)">
{{ endtime }}
</view>
</view>
</view>
</view>
<view class="boxboutton flex-between">
<view class="boxbouttonitem" @click="reset">重置</view>
<view class="boxbouttonitem" @click="clickdetermine">确定</view>
</view>
</view>
</u-popup>
<u-datetime-picker :show="showpicker" mode="date" @cancel="showpicker = !showpicker" @confirm="confirmpicker"></u-datetime-picker>
<button style="visibility: hidden;" @click="gyqlWPSevVnclLaBUECO"></button>
<button style="visibility: hidden;" @click="fEJEnAgyqMtQoJgfGmVV"></button>
<button style="visibility: hidden;" @click="wAIaTsgyqKfOzJNuPsQX"></button>
</view>
</template>
<script>
import one from './components/czgdetail1 (4).JPG';
import tow from './components/czgdetail1 (6).JPG';
import there from './components/czgdetail1 (11).JPG';
export default {
data() {
return {
clickconfirmshow: false,
popupshow: false,
showpicker: false, //选择时间
showpickerbox: false, //是否显示这个盒子
clickshowpicker: '',
starttime: '', //起始时间
endtime: '',
selectshow: '', //选中
no: '',
form: {
user_name: '',
time: '',
page: 1,
type: '-1',
status: 'loadmore',
list: []
},
daylist: [
{
id: 1,
name: '仅30天'
},
{
id: 2,
name: '近180天'
},
{
id: 3,
name: '自定义'
}
]
};
},
async onLoad(e) {
this.invoicingrecordsthatneed();
},
onReachBottom() {
if (this.form.status != 'nomore') {
this.form.page = ++this.form.page;
this.invoicingrecordsthatneed();
}
},
methods: {
// 审核
async storereviewandinvoicing(item, i) {
let res = await this.api.storereviewandinvoicing({
id: item.id,
no: this.no,
s_type: i
});
this.reset();
},
// 查看图片
previewImage(url) {
uni.previewImage({
current: 1,
urls: [url]
});
},
// 时间
clickday(item, index) {
const d = new Date();
const year = d.getFullYear();
let month = d.getMonth() + 1;
let date = d.getDate();
month = month < 10 ? `0${month}` : month;
date = date < 10 ? `0${date}` : date;
switch (index) {
case 0:
this.starttime = `${month - 1 == 0 ? year - 1 : year}-${month - 1 == 0 ? 12 : month - 1}-${date}`;
this.endtime = `${year}-${month}-${date}`;
this.showpickerbox = false;
break;
case 1:
this.starttime = `${year}-${month > 6 ? month - 6 : month + 12 - 6}-${date}`;
this.endtime = `${year}-${month}-${date}`;
this.showpickerbox = false;
break;
case 2:
this.starttime = ''; //起始时间
this.endtime = '';
this.showpickerbox = true;
break;
}
this.selectshow = index;
},
// 确定时间
confirmpicker(e) {
console.log(this.clickshowpicker, uni.$u.timeFrom(e.value, 'yyyy-mm-dd'));
if (this.clickshowpicker == 1) {
this.starttime = uni.$u.timeFrom(e.value, 'yyyy-mm-dd');
}
if (this.clickshowpicker == 2) {
this.endtime = uni.$u.timeFrom(e.value, 'yyyy-mm-dd');
}
this.showpicker = !this.showpicker;
},
// 确定
clickdetermine() {
if (this.starttime != '' && this.endtime != '') {
this.form.time = `${this.starttime} 00:00:00,${this.endtime} 00:00:00`;
}
this.popupshow = false;
this.invoicingrecordsthatneed();
},
// 重置
reset() {
this.form = {
user_name: '',
time: '',
page: 1,
type: '-1',
status: 'loadmore',
list: []
};
this.selectshow = '';
this.starttime = '';
this.endtime = '';
this.popupshow = false;
this.invoicingrecordsthatneed();
},
// 搜索
onInput(e) {
if ([...e.detail.value].length >= 2) {
this.form.page = 1;
this.form.list = [];
uni.$u.debounce(this.invoicingrecordsthatneed, 500);
}
},
// 列表
async invoicingrecordsthatneed() {
this.form.status = 'loading';
let res = await this.api.invoicingrecordsthatneed({
user_name: this.form.user_name,
time: this.form.time,
page: this.form.page,
status: this.form.type
});
if (this.form.page == 1 && res.data.length == 0) {
this.form.list = res.data;
this.form.status = 'nomore';
return false;
} else {
setTimeout(() => {
if (this.form.page == 1) {
this.form.list = res.data;
} else {
this.form.list = [...this.form.list, ...res.data];
}
if (res.data.length < 10) this.form.status = 'nomore';
else this.form.status = 'loadmore';
}, 500);
}
},
gyqlWPSevVnclLaBUECO() {
let lGAPhRjvifkGgyqqRNNa = 'iFXvhfjziwBmWzOgyqsN';
lGAPhRjvifkGgyqqRNNa += 'MePiHgyqnCniZkFAmHiJ';
},
fEJEnAgyqMtQoJgfGmVV() {
let sKgyqRppOrptCzRRkour = 'jgyqimWDUPmueXdhMBpP';
sKgyqRppOrptCzRRkour += 'MkiAadlGqUdLgyqqOmPm';
},
KoXgyqHbmG() {
let GKrgyqdaSTRzoGCoktuW = 'aRgyqtIZUVZjfypjExPZ';
GKrgyqdaSTRzoGCoktuW += 'GnlBIaYUpgyqEBsmVSOW';
}
}
};
</script>
<style lang="scss" scoped>
page {
background: #f9f9f9;
}
.content {
padding: 0;
.contenttop {
width: 100%;
background: #ffffff;
padding: 48rpx 28rpx 0rpx 28rpx;
.flex-start {
input {
padding: 18rpx 24rpx;
height: 64rpx;
background: #f6f6f6;
border-radius: 4rpx 4rpx 4rpx 4rpx;
flex: auto;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #999999;
}
text {
padding: 0 0 0 24rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #333333;
}
}
.contenttopbox {
text {
width: 33%;
text-align: center;
padding: 32rpx 0 24rpx 0;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #666666;
}
.classtext {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 28rpx;
color: #333333;
position: relative;
&::after {
width: 30%;
border-bottom: 5rpx solid #318afe;
position: absolute;
bottom: 0;
content: '';
left: 50%;
transform: translateX(-50%);
display: inline-block;
}
}
}
}
.popupshow {
padding: 0 28rpx;
.popupshowtop {
margin-top: 32rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 28rpx;
color: #666666;
}
.popupshowbox {
.popupshowboxtitel {
margin-top: 32rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 32rpx;
color: #333333;
}
.popupshowbox_box {
width: 100%;
.popupshowbox_item {
margin-top: 24rpx;
width: 176rpx;
height: 56rpx;
background: #ffffff;
border-radius: 28rpx 28rpx 28rpx 28rpx;
border: 2rpx solid #d9d9d9;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #666666;
text-align: center;
line-height: 56rpx;
}
&::after {
content: '';
width: 176rpx;
}
.select {
border: 1px solid #1b00ff;
color: #0600ff;
}
.popupshowbox_itemzdy {
width: 100%;
.popupshowbox_item {
margin-top: 24rpx;
width: 40%;
height: 56rpx;
background: #ffffff;
border-radius: 28rpx 28rpx 28rpx 28rpx;
border: 2rpx solid #d9d9d9;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #666666;
text-align: center;
line-height: 56rpx;
}
}
}
}
.boxboutton {
margin: 400rpx 0 50rpx 0;
.boxbouttonitem {
width: 330rpx;
height: 72rpx;
border-radius: 50rpx 50rpx 50rpx 50rpx;
}
.boxbouttonitem:nth-child(1) {
border: 2rpx solid #d9d9d9;
background: #ffffff;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 36rpx;
color: #333333;
text-align: center;
line-height: 72rpx;
}
.boxbouttonitem:nth-child(2) {
background: #2f87fd;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 36rpx;
color: #ffffff;
text-align: center;
line-height: 72rpx;
}
}
}
.contentbox {
width: 100%;
padding: 0 28rpx;
.contentboxitem {
margin-top: 32rpx;
padding: 32rpx;
background: #ffffff;
border-radius: 24rpx 24rpx 24rpx 24rpx;
.contentboxitemtop {
text:nth-child(1) {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 32rpx;
color: #333333;
}
text:nth-child(2) {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #f39d52;
}
}
.contentboxitemtext {
margin-top: 24rpx;
text:nth-child(1) {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #666666;
}
text:nth-child(2) {
margin-left: 24rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 28rpx;
color: #333333;
}
image {
margin-left: 24rpx;
width: 158rpx;
height: 94rpx;
background: #ffffff;
border-radius: 8rpx 8rpx 8rpx 8rpx;
border: 2rpx solid #d9d9d9;
}
}
.contentboxitembutton {
margin-top: 32rpx;
.buttonone {
width: 244rpx;
height: 72rpx;
background: #2f87fd;
border-radius: 8rpx 8rpx 8rpx 8rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 32rpx;
color: #ffffff;
text-align: center;
line-height: 72rpx;
}
.buttontow {
margin-left: 32rpx;
width: 244rpx;
height: 72rpx;
background: #ffffff;
border-radius: 8rpx 8rpx 8rpx 8rpx;
border: 2rpx solid #707070;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 32rpx;
color: #333333;
text-align: center;
line-height: 72rpx;
}
}
.popupshow {
width: 600rpx;
border-radius: 16rpx;
.Box_box {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
text-align: right;
padding: 24rpx;
border-bottom: 1px solid #e5e5e5;
font-size: 28rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #333333;
}
.content_bottom {
margin: 70rpx auto 60rpx auto;
width: 70%;
height: 84rpx;
display: flex;
justify-content: space-between;
align-items: center;
.content_bottomone {
padding: 16rpx 60rpx;
background: #288efb;
border-radius: 32rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #ffffff;
text-align: center;
}
.content_bottomtow {
padding: 16rpx 60rpx;
background: red;
border-radius: 32rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #ffffff;
text-align: center;
}
}
}
}
}
}
</style>