扫码,二维码
This commit is contained in:
parent
eaa4621fe4
commit
708e3db0b0
12
api/admin.js
12
api/admin.js
|
@ -7,6 +7,18 @@ import request from "@/utils/request.js";
|
||||||
export function getStatisticsInfo() {
|
export function getStatisticsInfo() {
|
||||||
return request.get("admin/order/statistics", {}, { login: true });
|
return request.get("admin/order/statistics", {}, { login: true });
|
||||||
}
|
}
|
||||||
|
/**
|
||||||
|
* 设置金额获取二维码
|
||||||
|
*/
|
||||||
|
export function setOrderCreate(merId,data) {
|
||||||
|
return request.post(`admin/${merId}/order_create`, data, { login: true });
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 设置金额获取二维码
|
||||||
|
*/
|
||||||
|
export function getOrderOfflinePay(merId) {
|
||||||
|
return request.get(`order/offline_pay/${merId}`, {}, { login: true });
|
||||||
|
}
|
||||||
/**
|
/**
|
||||||
* 订单月统计
|
* 订单月统计
|
||||||
*/
|
*/
|
||||||
|
|
|
@ -637,6 +637,12 @@
|
||||||
"navigationBarTitleText": "订单列表"
|
"navigationBarTitleText": "订单列表"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"path": "qrcode/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "我要收款"
|
||||||
|
}
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"path": "orderRefund/index",
|
"path": "orderRefund/index",
|
||||||
"style": {
|
"style": {
|
||||||
|
|
|
@ -67,7 +67,7 @@
|
||||||
if(this.service.is_goods){
|
if(this.service.is_goods){
|
||||||
list.push({
|
list.push({
|
||||||
title: '我要收款',
|
title: '我要收款',
|
||||||
url: '/pages/product/list/index?mer_id=' + merId,
|
url: '/pages/admin/qrcode/index?mer_id=' + merId,
|
||||||
icon: 'haiyuefont haiyue-shoukuang'
|
icon: 'haiyuefont haiyue-shoukuang'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,295 @@
|
||||||
|
<template>
|
||||||
|
<view class="qrcode-container" :style="viewColor">
|
||||||
|
<view style="padding-top: var(--status-bar-height)"></view>
|
||||||
|
<!-- <BackBar title="收款二维码" url="/pages/home/home"></BackBar> -->
|
||||||
|
<view class="qrcode">
|
||||||
|
<uni-popup ref="amountRef" type="center" round="10">
|
||||||
|
<view class="qrcode-popup">
|
||||||
|
<view class="qrcode-popup-title">设置金额</view>
|
||||||
|
<view class="qrcode-popup-input-box">
|
||||||
|
<input
|
||||||
|
v-model="formData.amount"
|
||||||
|
type="number"
|
||||||
|
class="uni-input"
|
||||||
|
placeholder="输入收款金额"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
<view class="qrcode-btn" @click="setAmountMethod">确定</view>
|
||||||
|
</view>
|
||||||
|
</uni-popup>
|
||||||
|
<view class="qrcode-box">
|
||||||
|
<view class="qrcode-line"></view>
|
||||||
|
<view class="qrcode-title">扫一扫向我付款</view>
|
||||||
|
<view class="qrcode-value">
|
||||||
|
<view class="qrcode-value-bg">
|
||||||
|
<view class="qrcode-value-box">
|
||||||
|
<zb-code v-if="val" ref="qrcode" :show="codeShow" :cid="cid" :val="val" :size="size" :unit="unit" :background="background"
|
||||||
|
:foreground="foreground" :pdground="pdground" :icon="icon" :iconSize="iconsize" :onval="onval" :loadMake="loadMake"
|
||||||
|
@result="qrR" />
|
||||||
|
<view v-else class="qrcode-btn" @click="showAmountPopup">设置金额</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view
|
||||||
|
v-if="itShow"
|
||||||
|
class=""
|
||||||
|
style="
|
||||||
|
padding: 10rpx 5rpx 40rpx 0;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: normal;
|
||||||
|
text-align: center;
|
||||||
|
"
|
||||||
|
>
|
||||||
|
已设置金额:<span style="color: red; font-size: 32rpx">{{formData.amount}}</span>
|
||||||
|
<view style="margin-top: 20rpx;" class="qrcode-btn" @click="showAmountPopup">设置金额</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import zbCode from '@/components/zb-code/zb-code.vue'
|
||||||
|
import {setOrderCreate} from '@/api/admin.js'
|
||||||
|
import {mapGetters} from 'vuex'
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
zbCode
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
formData:{
|
||||||
|
amount:''
|
||||||
|
},
|
||||||
|
amountUrl:'',
|
||||||
|
amountInput:'',
|
||||||
|
mer_id:'',
|
||||||
|
itShow:false,
|
||||||
|
//二维码参数
|
||||||
|
codeShow: false,
|
||||||
|
cid: '1',
|
||||||
|
ifShow: true,
|
||||||
|
val: "", // 要生成的二维码值
|
||||||
|
size: 300, // 二维码大小
|
||||||
|
unit: 'upx', // 单位
|
||||||
|
background: '#FFF', // 背景色
|
||||||
|
foreground: '#000', // 前景色
|
||||||
|
pdground: '#32dbc6', // 角标色
|
||||||
|
icon: '', // 二维码图标
|
||||||
|
iconsize: 40, // 二维码图标大小
|
||||||
|
lv: 3, // 二维码容错级别 , 一般不用设置,默认就行
|
||||||
|
onval: true, // val值变化时自动重新生成二维码
|
||||||
|
loadMake: true, // 组件加载完成后自动生成二维码
|
||||||
|
src: '', // 二维码生成后的图片地址或base64
|
||||||
|
codeSrc: "",
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(val) {
|
||||||
|
this.mer_id = val.mer_id
|
||||||
|
},
|
||||||
|
computed:{
|
||||||
|
...mapGetters(['viewColor'])
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
qrR(res) {
|
||||||
|
this.codeSrc = res
|
||||||
|
},
|
||||||
|
async setAmountMethod(){
|
||||||
|
let {data,status} = await setOrderCreate(this.mer_id,this.formData)
|
||||||
|
if(status ==200){
|
||||||
|
this.$refs.amountRef.close()
|
||||||
|
this.itShow = true
|
||||||
|
this.codeShow = true
|
||||||
|
let params = {
|
||||||
|
sn:data.order_no
|
||||||
|
}
|
||||||
|
this.val = JSON.stringify(params)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
showAmountPopup(){
|
||||||
|
this.$refs.amountRef.open('center')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.qrcode-container {
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
.bottom {
|
||||||
|
width: 90%;
|
||||||
|
margin-top: 20rpx;
|
||||||
|
background: white;
|
||||||
|
backdrop-filter: blur(40rpx);
|
||||||
|
padding: 36rpx 36rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
top: -5%;
|
||||||
|
position: relative;
|
||||||
|
box-sizing: border-box;
|
||||||
|
&-remark {
|
||||||
|
background: #f2f2f7;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
margin-top: 20rpx;
|
||||||
|
padding: 20rpx 8rpx;
|
||||||
|
}
|
||||||
|
&-title{
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.qrcode {
|
||||||
|
background: linear-gradient(var(--view-bntColor11) 5%, var(--view-bntColor12) 80%, var(--view-bntColor21) 100%);
|
||||||
|
height: calc(100vh - var(--status-bar-height));
|
||||||
|
overflow-y: scroll;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0 36rpx;
|
||||||
|
position: relative;
|
||||||
|
flex-direction: column;
|
||||||
|
&-box {
|
||||||
|
width: 90%;
|
||||||
|
backdrop-filter: blur(40rpx);
|
||||||
|
padding: 60rpx 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
background: white;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
top: -5%;
|
||||||
|
&::before {
|
||||||
|
content: "";
|
||||||
|
background: var(--view-bntColor11);
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
position: absolute;
|
||||||
|
left: -20rpx;
|
||||||
|
top: 240rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
content: "";
|
||||||
|
background: var(--view-bntColor11);
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
position: absolute;
|
||||||
|
right: -20rpx;
|
||||||
|
top: 240rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&-avatar {
|
||||||
|
width: 136rpx;
|
||||||
|
height: 136rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: black;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
&-image {
|
||||||
|
width: 136rpx;
|
||||||
|
height: 136rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&-name {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #888888;
|
||||||
|
margin-bottom: 22rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
&-line {
|
||||||
|
width: 90%;
|
||||||
|
height: 1rpx;
|
||||||
|
border: 2rpx dashed rgba(242, 242, 247, 1);
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
&-title {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #4e4e4e;
|
||||||
|
margin-bottom: 16rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
&-value {
|
||||||
|
width: 400rpx;
|
||||||
|
height: 400rpx;
|
||||||
|
background: #fafafc;
|
||||||
|
border-radius: 24rpx;
|
||||||
|
padding: 14rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
margin: 20rpx 0;
|
||||||
|
&-bg {
|
||||||
|
height: 100%;
|
||||||
|
background: white;
|
||||||
|
padding: 18rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
&-box {
|
||||||
|
height: 100%;
|
||||||
|
background-color: rgb(242, 242, 247);
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&-amount {
|
||||||
|
font-size: 36rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #4e4e4e;
|
||||||
|
}
|
||||||
|
|
||||||
|
&-btn {
|
||||||
|
width: 284rpx;
|
||||||
|
height: 68rpx;
|
||||||
|
background: linear-gradient(180deg, var(--view-bntColor21) 0%, var(--view-bntColor22) 100%);
|
||||||
|
border-radius: 16rpx;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #ffffff;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
&-popup {
|
||||||
|
width: 660rpx;
|
||||||
|
height: 408rpx;
|
||||||
|
background: #ffffff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
padding: 36rpx 24rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
&-title {
|
||||||
|
font-size: 34rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #333333;
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 60rpx;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
&-input-box {
|
||||||
|
padding: 28rpx 40rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background: #f2f2f7;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
margin-bottom: 40rpx;
|
||||||
|
uni-input{
|
||||||
|
font-size: 36rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
|
@ -15,7 +15,7 @@
|
||||||
<text class="iconfont icon-shitixing"></text>
|
<text class="iconfont icon-shitixing"></text>
|
||||||
<text>评分4.5分</text>
|
<text>评分4.5分</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="desc">位置好找,菜味道不错,价格实惠</view>
|
<view class="desc">商家承诺:</view>
|
||||||
<view class="site" @tap="openMap">
|
<view class="site" @tap="openMap">
|
||||||
<view>
|
<view>
|
||||||
<text class="iconfont icon-dingwei"></text>
|
<text class="iconfont icon-dingwei"></text>
|
||||||
|
@ -31,7 +31,14 @@
|
||||||
<text>周一到周日</text>
|
<text>周一到周日</text>
|
||||||
<text>09:00 - 22:00</text>
|
<text>09:00 - 22:00</text>
|
||||||
</view>
|
</view>
|
||||||
<view>可提供:</view>
|
<!-- <view class="iconfont icon-dianhua"></view> -->
|
||||||
|
<view class="business_one">
|
||||||
|
<view>
|
||||||
|
商家电话:15834567081
|
||||||
|
</view>
|
||||||
|
<text class="copy" @tap="setCopy(15834567081)">复制</text>
|
||||||
|
</view>
|
||||||
|
<view class="business_list">可提供:</view>
|
||||||
<view class="business_list">
|
<view class="business_list">
|
||||||
<text>WiFi</text>
|
<text>WiFi</text>
|
||||||
<text>充电宝</text>
|
<text>充电宝</text>
|
||||||
|
@ -86,6 +93,39 @@
|
||||||
handleTab(i){
|
handleTab(i){
|
||||||
this.actIndex = i
|
this.actIndex = i
|
||||||
},
|
},
|
||||||
|
setCopy(content) {
|
||||||
|
// 该方法不支持h5
|
||||||
|
//#ifndef APP-PLUS
|
||||||
|
uni.setClipboardData({
|
||||||
|
data: String(content), // 必须字符串
|
||||||
|
success: function() {
|
||||||
|
console.log('success');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
//#endif
|
||||||
|
|
||||||
|
// h5端赋值方法,使用创建节点
|
||||||
|
// #ifdef H5
|
||||||
|
if (!document.queryCommandSupported('copy')) { // 兼容某些浏览器的判断
|
||||||
|
console.log('该浏览器不支持')
|
||||||
|
}
|
||||||
|
let textarea = document.createElement("textarea")
|
||||||
|
textarea.value = content
|
||||||
|
textarea.readOnly = "readOnly"
|
||||||
|
document.body.appendChild(textarea)
|
||||||
|
textarea.select() // 选择对象
|
||||||
|
textarea.setSelectionRange(0, content.length) // 核心
|
||||||
|
let result = document.execCommand("copy") // 执行浏览器复制命令
|
||||||
|
if (result) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '复制成功',
|
||||||
|
duration: 2000,
|
||||||
|
icon:'none'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
textarea.remove()
|
||||||
|
// #endif
|
||||||
|
},
|
||||||
handlePay(){
|
handlePay(){
|
||||||
// 从相机和相册扫码
|
// 从相机和相册扫码
|
||||||
// #ifdef APP-PLUS
|
// #ifdef APP-PLUS
|
||||||
|
@ -120,6 +160,11 @@
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
.over {
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
.shop_details{
|
.shop_details{
|
||||||
font-family: PingFang SC;
|
font-family: PingFang SC;
|
||||||
.head{
|
.head{
|
||||||
|
@ -195,7 +240,8 @@
|
||||||
}
|
}
|
||||||
.business{
|
.business{
|
||||||
margin-top: 40rpx;
|
margin-top: 40rpx;
|
||||||
background-color: rgba(236, 239, 244, 0.84);
|
background-color: color-mix(in oklch, var(--view-theme), transparent 90%);
|
||||||
|
// opacity: 0.8;
|
||||||
border-radius: 16rpx;
|
border-radius: 16rpx;
|
||||||
padding: 24rpx;
|
padding: 24rpx;
|
||||||
&_one{
|
&_one{
|
||||||
|
@ -207,6 +253,15 @@
|
||||||
margin-top: 12rpx;
|
margin-top: 12rpx;
|
||||||
color: #999;
|
color: #999;
|
||||||
}
|
}
|
||||||
|
&:nth-child(3){
|
||||||
|
margin-top: 12rpx;
|
||||||
|
color: #333;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
.copy{
|
||||||
|
color: var(--view-theme);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
&_list{
|
&_list{
|
||||||
margin-top: 12rpx;
|
margin-top: 12rpx;
|
||||||
|
|
|
@ -209,6 +209,7 @@
|
||||||
import { getMenuList, getUserInfo, setVisit } from '@/api/user.js';
|
import { getMenuList, getUserInfo, setVisit } from '@/api/user.js';
|
||||||
import { getVersion, getNavigation } from "@/api/public";
|
import { getVersion, getNavigation } from "@/api/public";
|
||||||
import { orderData } from '@/api/order.js'
|
import { orderData } from '@/api/order.js'
|
||||||
|
import {getOrderOfflinePay} from '@/api/admin.js'
|
||||||
import { mapGetters } from "vuex";
|
import { mapGetters } from "vuex";
|
||||||
import dayjs from '@/plugin/dayjs/dayjs.min.js';
|
import dayjs from '@/plugin/dayjs/dayjs.min.js';
|
||||||
import Cache from '@/utils/cache';
|
import Cache from '@/utils/cache';
|
||||||
|
@ -220,6 +221,7 @@
|
||||||
import Auth from '../../libs/wechat';
|
import Auth from '../../libs/wechat';
|
||||||
import { HTTP_REQUEST_URL } from '@/config/app';
|
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||||
import { toLogin } from '@/libs/login.js';
|
import { toLogin } from '@/libs/login.js';
|
||||||
|
import { setTimeout } from 'timers';
|
||||||
const app = getApp();
|
const app = getApp();
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
|
@ -353,8 +355,20 @@
|
||||||
// #ifdef APP-PLUS
|
// #ifdef APP-PLUS
|
||||||
uni.scanCode({
|
uni.scanCode({
|
||||||
scanType:['qrCode'],
|
scanType:['qrCode'],
|
||||||
success: function (res) {
|
success: async (res)=> {
|
||||||
console.log('二维码信息:' + res);
|
let result = JSON.parse(res.result)
|
||||||
|
let val = await getOrderOfflinePay(result.sn)
|
||||||
|
if(val.status == 200){
|
||||||
|
this.$util.Tips({
|
||||||
|
title: '支付成功',
|
||||||
|
icon: 'success'
|
||||||
|
});
|
||||||
|
setTimeout(()=>{
|
||||||
|
uni.navigateTo({
|
||||||
|
url:'/pages/users/order_list/index?status=-1'
|
||||||
|
})
|
||||||
|
},1000)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
// #endif
|
// #endif
|
||||||
|
|
Loading…
Reference in New Issue