yzxy-mobile/pages/index/index.vue

303 lines
9.2 KiB
Vue
Raw Normal View History

2024-08-26 17:24:26 +08:00
<template>
2024-10-09 13:39:25 +08:00
<view v-if="istrue" class="home plr30 pt30" style="overflow-y: auto;">
<view class="flex_between flex_items" style="background-color: #fff">
<text class="f26 ml15 bold" style="color: #333333;">手机号码</text>
<van-field class="mr20" input-align="right" style="width: 400rpx;padding-right: 0;"
v-model="form.mobile" label="" placeholder="手机号码" />
</view>
<view class="flex_between flex_items" style="background-color: #fff">
<text class="f26 ml15 bold" style="color: #333333;">分发开始时间</text>
<van-field
readonly
clickable
name="datetimePicker"
v-model="form.start_time"
placeholder="点击选择分发开始时间"
@click="showEvent('start')"
class="mr20"
input-align="right"
style="width: 400rpx;padding-right: 0;"
/>
</view>
<view class="flex_between flex_items" style="background-color: #fff">
<text class="f26 ml15 bold" style="color: #333333;">分发结束时间</text>
<van-field
readonly
clickable
name="datetimePicker"
v-model="form.end_time"
placeholder="点击选择分发结束时间"
@click="showEvent('end')"
class="mr20"
input-align="right"
style="width: 400rpx;padding-right: 0;"
/>
</view>
<view class="mt60 flex_items flex_center">
<view @click="getData" class="flex_items flex_center"
style="width: 654rpx;height: 86rpx;background:linear-gradient(90deg, #A21E2E 0%, #190F58 100%);box-shadow: 0rpx 8rpx 14rpx 0rpx rgba(83,139,135,0.2);border-radius: 12rpx;">
<text class="f28" style="color: #fff;">查询</text>
</view>
</view>
2024-08-26 17:24:26 +08:00
<view v-if="list.length!=0" class="pb40 flex_column flex_items">
<view v-for="(item,index) in list" :key="index" class="plr20 ptb30 pos bgwhite mt30"
style="box-shadow: 0rpx 10rpx 16rpx 0rpx rgba(220,224,236,0.28);border-radius: 16rpx;width: 100%;">
<view class="flex_between flex_items">
<text class="f26 bold" style="color: #333;">ID:</text>
<text class="f24" style="color: #1F1057;">{{item.id}}</text>
</view>
<view v-if="item.product_type==1" class="flex_between flex_items mt30">
<text class="f26 bold" style="color: #333;">手机号:</text>
<text class="f24" style="color: #1F1057;">{{item.mobile}}</text>
</view>
<view v-if="item.product_type==2" class="flex_between flex_items mt30">
<text class="f26 bold" style="color: #333;">名称:</text>
<view class="f24 one" style="color: #1F1057;">{{item.main.name}}</view>
</view>
<view class="flex_between flex_items mt30">
<text class="f26 bold" style="color: #333;">面额:</text>
<text class="f24" style="color: #1F1057;">{{item.main.face_amount}}</text>
</view>
<view class="flex_between flex_items mt30">
<text class="f26 bold" style="color: #333;">分发人:</text>
<text class="f24" style="color: #1F1057;">{{item.manager_name}}</text>
</view>
<view class="flex_between flex_items mt30">
<text class="f26 bold" style="color: #333;">状态:</text>
<text class="f24" style="color: #1F1057;" v-if="item.status == 1">待分发</text>
<text class="f24" style="color: #1F1057;" v-else-if="item.status == 2">已领取</text>
<text class="f24" style="color: #1F1057;" v-else-if="item.status == 3">已过期</text>
<text class="f24" style="color: #1F1057;" v-else-if="item.status == 4">已作废</text>
<text class="f24" style="color: #1F1057;" v-else>已分发</text>
</view>
<view class="flex_between flex_items mt30">
<text class="f26 bold" style="color: #333;">创建时间:</text>
<text class="f24" style="color: #1F1057;">{{item.create_time}}</text>
</view>
2024-10-09 13:39:25 +08:00
<view class="flex_between flex_items mt30">
<text class="f26 bold" style="color: #333;">分发时间:</text>
<text class="f24" style="color: #1F1057;">{{item.distribute_time}}</text>
</view>
2024-08-26 17:24:26 +08:00
<view class="flex_between mt30">
<text class="f26 bold" style="color: #333;">二维码:</text>
<view @click="geterwei(item.qr_args)" style="width: 160rpx;height: 160rpx;overflow: hidden;">
<qqe :ids="'aq' + item.id" :uri="item.qr_args"></qqe>
</view>
</view>
<!-- <view class="mt60 flex_items flex_center">
<view @click="godis(item,'again')" class="flex_items flex_center"
style="width: 654rpx;height: 86rpx;background:linear-gradient(90deg, #A21E2E 0%, #190F58 100%);box-shadow: 0rpx 8rpx 14rpx 0rpx rgba(83,139,135,0.2);border-radius: 12rpx;">
<text class="f28" style="color: #fff;">重新分发</text>
</view>
</view> -->
</view>
</view>
<view v-else class="ptb50 plr30 f26 f-center" style="color: #9a9a9a;margin-top: 80rpx;">--暂无数据--</view>
2024-10-09 13:39:25 +08:00
<van-popup v-model="showPicker" position="bottom" :style="{ height: '30%' }">
<van-datetime-picker
type="date"
@confirm="onConfirm"
@cancel="showPicker = false"
/>
</van-popup>
2024-08-26 17:24:26 +08:00
<van-overlay :show="show">
<view class="wrapper" @click="closeqr">
<view id="qrcode" @click.stop ref="qrcode" class="flex_items flex_center block"></view>
</view>
</van-overlay>
</view>
</template>
<script>
import qqe from "./qrcode.vue";
import QRCode from "qrcodejs2";
export default {
data() {
return {
list: [],
form: {
page: 1,
pageSize: 5,
mobile: "",
2024-10-09 13:39:25 +08:00
distribute_time:[],
start_time:"",
end_time:""
2024-08-26 17:24:26 +08:00
},
istrue: false,
2024-10-09 13:39:25 +08:00
show: false,
showPicker:false,
type:''
2024-08-26 17:24:26 +08:00
}
},
components: {
qqe
},
onLoad() {
this.getData()
},
methods: {
2024-10-09 13:39:25 +08:00
getFormattedDate(date) {
var year = date.getFullYear();
var month = date.getMonth() + 1; // 月份是从0开始的
var day = date.getDate();
var hours = date.getHours();
var minutes = date.getMinutes();
var seconds = date.getSeconds();
// 补零操作
month = month < 10 ? '0' + month : month;
day = day < 10 ? '0' + day : day;
hours = hours < 10 ? '0' + hours : hours;
minutes = minutes < 10 ? '0' + minutes : minutes;
seconds = seconds < 10 ? '0' + seconds : seconds;
// return year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ':' + seconds;
return year + '-' + month + '-' + day;
},
showEvent(type){
this.type = type
this.showPicker = true
},
onConfirm(time){
this.form[`${this.type}_time`] = this.type === 'start' ? `${this.getFormattedDate(time)} 00:00:00` : `${this.getFormattedDate(time)} 23:59:59`
this.showPicker = false
},
2024-08-26 17:24:26 +08:00
getData() {
uni.showLoading({
title: "加载中..."
})
2024-10-09 13:39:25 +08:00
if(this.form.start_time){
if(!Array.isArray(this.form.distribute_time)){
this.form.distribute_time = []
}
this.form.distribute_time.push(this.form.start_time)
}
if(this.form.end_time){
if(!Array.isArray(this.form.distribute_time)){
this.form.distribute_time = []
}
this.form.distribute_time.push(this.form.end_time)
}
2024-08-26 17:24:26 +08:00
this.api.getfenouts(this.form).then((res) => {
console.log(res)
if (res.data.code == 200) {
uni.stopPullDownRefresh();
if (res.data.data.data.length != 0) {
res.data.data.data.forEach((item, index) => {
this.list.push(item)
})
this.istrue = true
} else {
this.istrue = true
2024-10-09 13:39:25 +08:00
this.list = []
2024-08-26 17:24:26 +08:00
uni.showToast({
title: '暂无数据',
icon: 'none'
})
return false
}
} else {
this.istrue = true
uni.hideLoading()
uni.showToast({
title: res.data.message,
icon: 'none'
})
}
})
},
getactivity() {
this.api.getactivit(this.form).then((res) => {
console.log(res)
if (res.data.code == 200) {
uni.stopPullDownRefresh()
if (res.data.data.data.length != 0) {
res.data.data.data.forEach((item, index) => {
this.hotActivity.push(item)
});
} else {
uni.showToast({
title: "暂无更多活动",
icon: "none"
})
}
this.istrue = true
uni.hideLoading()
} else {
uni.showToast({
icon: "error",
title: res.data.message
})
}
})
},
golink(types) {
let url = ""
if (types == 'gua') {
url = "http://139.9.58.213:8088/#/pages/scap/index?id=15"
} else if (types == 'turn') {
url = "http://139.9.58.213:8088/#/pages/turntable/index?id=15"
} else if (types == 'around') {
url = "http://139.9.58.213:8088/#/pages/around/index?id=15"
} else {}
var href = url
window.open(href, '_self')
},
geterwei(uri) {
this.show = true;
this.$nextTick(() => {
this.qrcode(uri);
});
},
qrcode(uri) {
let qrcode = new QRCode("qrcode", {
width: 250,
height: 250,
text: uri,
});
},
closeqr() {
this.show = false;
setTimeout(function() {
document.getElementById("qrcode").innerHTML = "";
}, 200);
},
},
onReachBottom() {
uni.showLoading({
title: "加载中..."
})
setTimeout(() => {
this.form.page += 1
this.getData()
}, 1000)
},
onPullDownRefresh() {
this.form.page = 1
this.list = []
this.getData()
}
}
</script>
<style>
page {
background: #FAFBFD !important;
}
.wrapper {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
width: 100%;
}
.block {
width: 500rpx;
height: 500rpx;
background-color: #fff;
}
</style>