320 lines
9.6 KiB
Vue
320 lines
9.6 KiB
Vue
<template>
|
|
<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="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="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="searchEvent" 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 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;">{{item.mobile}}</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>
|
|
<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>
|
|
<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>
|
|
<van-popup v-model="showPicker" position="bottom" :style="{ height: '30%' }">
|
|
<van-datetime-picker
|
|
type="date"
|
|
@confirm="onConfirm"
|
|
@cancel="showPicker = false"
|
|
:min-date="minDate"
|
|
:max-date="maxDate"
|
|
/>
|
|
</van-popup>
|
|
<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";
|
|
import {stringify} from 'qs'
|
|
export default {
|
|
data() {
|
|
return {
|
|
list: [],
|
|
form: {
|
|
page: 1,
|
|
pageSize: 5,
|
|
mobile: "",
|
|
},
|
|
start_time:"",
|
|
end_time:"",
|
|
istrue: false,
|
|
show: false,
|
|
showPicker:false,
|
|
type:'',
|
|
minDate: new Date(2020, 0, 1),
|
|
maxDate: new Date(),
|
|
total:0
|
|
}
|
|
},
|
|
components: {
|
|
qqe
|
|
},
|
|
onLoad() {
|
|
this.getData()
|
|
},
|
|
methods: {
|
|
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[`${this.type}_time`] = this.type === 'start' ? `${this.getFormattedDate(time)} 00:00:00` : `${this.getFormattedDate(time)} 23:59:59`
|
|
this.showPicker = false
|
|
},
|
|
searchEvent(){
|
|
this.form.page = 1
|
|
this.form.distribute_time_at = ''
|
|
this.list = []
|
|
this.getData()
|
|
},
|
|
getData() {
|
|
uni.showLoading({
|
|
title: "加载中..."
|
|
})
|
|
let temp = []
|
|
if(this.start_time){
|
|
temp.push(this.start_time)
|
|
}
|
|
if(this.end_time){
|
|
temp.push(this.end_time)
|
|
}
|
|
if(temp.length){
|
|
this.form.distribute_time_at = temp.join(',')
|
|
}
|
|
this.api.getfenouts(this.form).then((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.total = res.data.data.total
|
|
this.istrue = true
|
|
} else {
|
|
this.istrue = true
|
|
this.list = []
|
|
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() {
|
|
if(this.form.page * this.form.pageSize >= this.total) {
|
|
console.log('已到最后一页，不再分页加载');
|
|
return
|
|
}
|
|
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> |