This commit is contained in:
@@ -21,17 +21,18 @@ page {
|
||||
|
||||
.box {
|
||||
margin: auto;
|
||||
background-image: url("../../static/ewm.png");
|
||||
background-image: url('../../static/ewm.png');
|
||||
background-size: 100% 100%;
|
||||
width: 608px;
|
||||
height: 457px;
|
||||
position: relative;
|
||||
.qrcode {
|
||||
|
||||
.img {
|
||||
position: absolute;
|
||||
width: 280px;
|
||||
height: 280px;
|
||||
top: 14%;
|
||||
right: 9%;
|
||||
top: 66px;
|
||||
right: 55px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -5,9 +5,7 @@
|
||||
<view class="desc">请在这里扫码</view>
|
||||
</view>
|
||||
<view class="box">
|
||||
<!-- <image :src="`https://api.pwmqr.com/qrcode/create?url=${code}`"></image> -->
|
||||
<!-- <view ref="qrcode" id="qrcode"></view> -->
|
||||
<canvas class="qrcode" canvas-id="qrcode" id="qrcode"></canvas>
|
||||
<image class="img" :src="dataUrl" />
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
@@ -16,22 +14,22 @@
|
||||
import { onUnmounted, ref } from "vue";
|
||||
import Taro from "@tarojs/taro";
|
||||
import { getAfterOrder } from "@/api/admin";
|
||||
import UQRCode from "uqrcodejs";
|
||||
|
||||
const time_id = ref();
|
||||
|
||||
const dataUrl = ref("");
|
||||
|
||||
const info = ref<any>({});
|
||||
|
||||
Taro.useLoad((e) => {
|
||||
info.value = e;
|
||||
getCode();
|
||||
dataUrl.value = Taro.getStorageSync("pay_code");
|
||||
time_id.value = setInterval(async () => {
|
||||
const { data } = await getAfterOrder({
|
||||
bid: info.value.bid,
|
||||
oid: info.value.oid,
|
||||
});
|
||||
if (data.data.status !== 0 && data.data.status !== 2) {
|
||||
clearInterval(time_id.value);
|
||||
Taro.showToast({
|
||||
title: "支付成功",
|
||||
icon: "success",
|
||||
@@ -46,23 +44,14 @@ Taro.useLoad((e) => {
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
const getCode = () => {
|
||||
var qr = new UQRCode();
|
||||
qr.data = Taro.getStorageSync("pay_code");
|
||||
qr.size = 160;
|
||||
qr.margin = 5;
|
||||
qr.make();
|
||||
const canvasContext = Taro.createCanvasContext("qrcode");
|
||||
qr.canvasContext = canvasContext;
|
||||
qr.drawCanvas();
|
||||
};
|
||||
|
||||
Taro.useDidHide(() => {
|
||||
clearInterval(time_id.value);
|
||||
Taro.removeStorageSync("pay_code");
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
clearInterval(time_id.value);
|
||||
Taro.removeStorageSync("pay_code");
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
@@ -1,71 +1,77 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="header">
|
||||
<view>订单号:{{ info.oid }}</view>
|
||||
<view>{{ info.add_time }}</view>
|
||||
</view>
|
||||
<view class="card">
|
||||
<view class="center" v-for="(itm, idx) in info.OrderGoods" :key="idx">
|
||||
<view class="top">
|
||||
<image :src="itm.Goods.cover" />
|
||||
<view class="title">{{ itm.Goods.name }} </view>
|
||||
<view class="right">
|
||||
<view v-if="info.pay_type === 1">{{ itm.pay_price }}元</view>
|
||||
<view v-else>{{ itm.pay_integral }}积分</view>
|
||||
<view>x{{ itm.number }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<view class="bom" style="text-align: right">
|
||||
共{{ info.count }}件商品,支付方式:{{
|
||||
info.pay_type === 1 ? "微信" : "积分"
|
||||
}},实付:
|
||||
<text style="color: red">{{
|
||||
info.pay_type === 1 ? `${info.price}元` : `${info.exchange}积分`
|
||||
}}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 订单信息 -->
|
||||
<nut-cell-group>
|
||||
<nut-cell title="订单状态:" :desc="orderStatus"></nut-cell>
|
||||
<nut-cell>
|
||||
<template #default>
|
||||
<view class="center-box">
|
||||
<view
|
||||
class="top"
|
||||
v-for="(item, index) in info.OrderGoods"
|
||||
:key="index">
|
||||
<image class="mr-10" :src="item.Goods?.cover" />
|
||||
<view class="flex-1">
|
||||
<view class="title">{{ item.Goods?.name }}</view>
|
||||
<view class="text-[#F83D3D] mt-5">
|
||||
<view>{{ item.pay_price }}元</view>
|
||||
<view>{{ item.pay_integral }}积分</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view>x{{ item.number }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
class="flex justify-between items-center mt-2 mb-2 text-[25px]">
|
||||
<view class="text-[#9C9C9C]">{{ `共${info.count}件商品` }}</view>
|
||||
<view
|
||||
>{{ info.status !== 0 ? '实' : '应' }}付款{{
|
||||
info.pay_type === 1 ? '(元): ' : '(积分): '
|
||||
}}{{ info.pay_type === 1 ? info.price : info.exchange }}</view
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</nut-cell>
|
||||
</nut-cell-group>
|
||||
<nut-cell-group>
|
||||
<nut-cell title="订单号:" :desc="info.oid"></nut-cell>
|
||||
<nut-cell
|
||||
title="订单状态:"
|
||||
:desc="
|
||||
info.status === 0
|
||||
? '待付款'
|
||||
: info.status === 1
|
||||
? '待使用'
|
||||
: info.status === 2
|
||||
? '已使用'
|
||||
: '已失效'
|
||||
">
|
||||
</nut-cell>
|
||||
<nut-cell title="下单用户:" :desc="info.User?.nickName"></nut-cell>
|
||||
<nut-cell title="用户手机号:" :desc="info.User?.phone"></nut-cell>
|
||||
<nut-cell title="下单时间:" :desc="info.add_time"></nut-cell>
|
||||
<nut-cell title="核销时间:" :desc="info.User?.phone"></nut-cell>
|
||||
<nut-cell
|
||||
v-if="info.status === 2"
|
||||
title="核销人员:"
|
||||
:desc="info.CancelUser?.nickName"
|
||||
></nut-cell>
|
||||
:desc="info.CancelUser?.nickName"></nut-cell>
|
||||
<nut-cell
|
||||
v-if="info.status === 2"
|
||||
title="核销人手机号:"
|
||||
:desc="info.CancelUser?.phone"
|
||||
></nut-cell>
|
||||
:desc="info.CancelUser?.phone"></nut-cell>
|
||||
</nut-cell-group>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Taro from "@tarojs/taro";
|
||||
import { computed, ref } from "vue";
|
||||
import Taro from '@tarojs/taro';
|
||||
import {ref} from 'vue';
|
||||
|
||||
const info = ref<any>({});
|
||||
|
||||
Taro.useLoad(() => {
|
||||
info.value = Taro.getStorageSync("ver_order_info");
|
||||
console.log(info.value);
|
||||
});
|
||||
|
||||
const orderStatus = computed(() => {
|
||||
switch (info.value.status) {
|
||||
case 1:
|
||||
return "待核销";
|
||||
case 2:
|
||||
return "已核销";
|
||||
case 3:
|
||||
return "已失效";
|
||||
}
|
||||
info.value = Taro.getStorageSync('ver_order_info');
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -148,6 +154,7 @@ page {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
// align-items: flex-start;
|
||||
margin-bottom: 10px;
|
||||
|
||||
image {
|
||||
width: 150px;
|
||||
@@ -172,4 +179,41 @@ page {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.center-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
|
||||
.top {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 10rpx;
|
||||
|
||||
image {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
border-radius: 10rpx;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-left: 10px;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
text-overflow: ellipsis;
|
||||
width: 350px;
|
||||
}
|
||||
|
||||
.right {
|
||||
margin-left: 10px;
|
||||
font-size: 28px;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,29 +1,94 @@
|
||||
.tabs-1 {
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
justify-content: space-between;
|
||||
justify-content: space-evenly;
|
||||
align-items: center;
|
||||
background-color: #fff;
|
||||
padding: 10px;
|
||||
overflow-x: scroll;
|
||||
// padding: 10px;
|
||||
.item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.line {
|
||||
margin-top: 10px auto;
|
||||
margin: 10px auto;
|
||||
width: 50px;
|
||||
height: 5px;
|
||||
height: 8px;
|
||||
border-radius: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// .order-card {
|
||||
// width: 95%;
|
||||
// box-sizing: border-box;
|
||||
// margin: 15px auto;
|
||||
// background-color: #fff;
|
||||
// border-radius: 10px;
|
||||
// padding: 20px;
|
||||
|
||||
// .line {
|
||||
// width: 100%;
|
||||
// height: 1px;
|
||||
// background-color: #f5f5f5;
|
||||
// margin: 10px;
|
||||
// }
|
||||
|
||||
// .top {
|
||||
// // display: flex;
|
||||
// // justify-content: space-between;
|
||||
// // align-items: center;
|
||||
|
||||
// .name {
|
||||
// font-weight: bold;
|
||||
// }
|
||||
|
||||
// .sub {
|
||||
// color: #999;
|
||||
// font-size: 30px;
|
||||
// }
|
||||
// }
|
||||
|
||||
// .btn {
|
||||
// display: flex;
|
||||
// justify-content: flex-end;
|
||||
// align-items: center;
|
||||
// }
|
||||
|
||||
// .center {
|
||||
// .top {
|
||||
// display: flex;
|
||||
// justify-content: space-between;
|
||||
// // align-items: flex-start;
|
||||
|
||||
// image {
|
||||
// width: 150px;
|
||||
// height: 150px;
|
||||
// border-radius: 10px;
|
||||
// }
|
||||
|
||||
// .title {
|
||||
// margin-left: 10px;
|
||||
// display: -webkit-box;
|
||||
// overflow: hidden;
|
||||
// -webkit-line-clamp: 2;
|
||||
// -webkit-box-orient: vertical;
|
||||
// text-overflow: ellipsis;
|
||||
// width: 350px;
|
||||
// }
|
||||
|
||||
// .right {
|
||||
// margin-left: 10px;
|
||||
// font-size: 28px;
|
||||
// text-align: right;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
.order-card {
|
||||
width: 95%;
|
||||
box-sizing: border-box;
|
||||
margin: 15px auto;
|
||||
background-color: #fff;
|
||||
border-radius: 10px;
|
||||
padding: 20px;
|
||||
|
||||
.line {
|
||||
@@ -34,18 +99,9 @@
|
||||
}
|
||||
|
||||
.top {
|
||||
// display: flex;
|
||||
// justify-content: space-between;
|
||||
// align-items: center;
|
||||
|
||||
.name {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.sub {
|
||||
color: #999;
|
||||
font-size: 30px;
|
||||
}
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.btn {
|
||||
@@ -55,19 +111,20 @@
|
||||
}
|
||||
|
||||
.center {
|
||||
// margin-bottom: 10px;
|
||||
.top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
// align-items: flex-start;
|
||||
// justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
|
||||
image {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
border-radius: 10px;
|
||||
border-radius: 15px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-left: 10px;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 2;
|
||||
@@ -80,6 +137,7 @@
|
||||
margin-left: 10px;
|
||||
font-size: 28px;
|
||||
text-align: right;
|
||||
color: #9c9c9c;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,15 +5,18 @@
|
||||
class="item"
|
||||
v-for="(item, index) in opt"
|
||||
:key="index"
|
||||
@click="tabChange(item.value)"
|
||||
>
|
||||
<view>{{ item.text }}</view>
|
||||
@click="tabChange(item.value)">
|
||||
<view
|
||||
:style="{
|
||||
color: item.value === tabVal ? '#333333' : '#9C9C9C',
|
||||
}"
|
||||
>{{ item.text }}</view
|
||||
>
|
||||
<view
|
||||
class="line"
|
||||
:style="{
|
||||
backgroundColor: item.value === tabVal ? 'red' : '',
|
||||
}"
|
||||
></view>
|
||||
backgroundColor: item.value === tabVal ? '#FFD940' : '',
|
||||
}"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="dataList.length > 0">
|
||||
@@ -21,73 +24,87 @@
|
||||
class="order-card"
|
||||
v-for="(item, index) in dataList"
|
||||
:key="index"
|
||||
@click="toDetailPage(item)"
|
||||
>
|
||||
@click="toDetailPage(item)">
|
||||
<view class="top">
|
||||
<view class="name">订单号:{{ item.oid }}</view>
|
||||
<!-- <view class="sub">下单时间:{{ item.add_time }}</view> -->
|
||||
<view class="sub" v-if="item.status !== 3">核销时间:{{ item.cancel_time || "待核销" }}</view>
|
||||
<!-- <view style="color: red">{{
|
||||
item.status === 0
|
||||
? "待付款"
|
||||
: item.status === 1
|
||||
? "待使用"
|
||||
: item.status === 2
|
||||
? "已使用"
|
||||
: "已失效"
|
||||
}}</view> -->
|
||||
<view class="text-[#9C9C9C] text-[25px]">订单号:{{ item.oid }}</view>
|
||||
<view
|
||||
:style="{
|
||||
color:
|
||||
item.status === 0
|
||||
? '#FF850A'
|
||||
: item.status === 1
|
||||
? '#F83D3D'
|
||||
: item.status === 2
|
||||
? '#333333'
|
||||
: '#9C9C9C',
|
||||
}"
|
||||
>{{
|
||||
item.status === 0
|
||||
? '待付款'
|
||||
: item.status === 1
|
||||
? '待使用'
|
||||
: item.status === 2
|
||||
? '已使用'
|
||||
: '已失效'
|
||||
}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<view class="center" v-for="(itm, idx) in item.OrderGoods" :key="idx">
|
||||
<view class="top">
|
||||
<image :src="itm.Goods.cover" />
|
||||
<view class="title">{{ itm.Goods.name }} </view>
|
||||
<image class="mr-10" :src="itm.Goods.cover" />
|
||||
<view class="flex-1">
|
||||
<view class="title">{{ itm.Goods?.name }}</view>
|
||||
<view class="text-[#F83D3D] mt-5">
|
||||
<view>{{ itm.pay_price }}元</view>
|
||||
<view>{{ itm.pay_integral }}积分</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view v-if="item.pay_type === 1">{{ itm.pay_price }}元</view>
|
||||
<view v-else>{{ itm.pay_integral }}积分</view>
|
||||
<view>x{{ itm.number }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<view class="bom" style="text-align: right">
|
||||
共{{ item.count }}件商品,支付方式:{{
|
||||
item.pay_type === 1 ? "微信" : "积分"
|
||||
}},实付:
|
||||
<text style="color: red">{{
|
||||
item.pay_type === 1 ? `${item.price}元` : `${item.exchange}积分`
|
||||
}}</text>
|
||||
<view
|
||||
class="flex justify-between items-center mt-2 mb-2 text-[25px]"
|
||||
v-if="item.status !== 0">
|
||||
<text class="text-[#9C9C9C]">共{{ item.count }}件商品</text>
|
||||
<view
|
||||
>{{ item.status !== 0 ? '实' : '应' }}付款{{
|
||||
item.pay_type === 1 ? '(元): ' : '(积分): '
|
||||
}}{{ item.pay_type === 1 ? item.price : item.exchange }}</view
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<nut-empty v-else description="暂无订单数据"></nut-empty>
|
||||
<nut-empty v-else description="暂无订单"></nut-empty>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
import Taro from "@tarojs/taro";
|
||||
import { getActiveOrderList } from "../../../../api/admin";
|
||||
import {ref} from 'vue';
|
||||
import Taro from '@tarojs/taro';
|
||||
import {getActiveOrderList} from '../../../../api/admin';
|
||||
|
||||
const opt = ref([
|
||||
{
|
||||
text: "全部",
|
||||
text: '全部',
|
||||
value: 0,
|
||||
},
|
||||
{
|
||||
text: "待付款",
|
||||
text: '待付款',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
text: "待核销",
|
||||
text: '待核销',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
text: "已核销",
|
||||
text: '已核销',
|
||||
value: 3,
|
||||
},
|
||||
{
|
||||
text: "已失效",
|
||||
text: '已失效',
|
||||
value: 4,
|
||||
},
|
||||
]);
|
||||
@@ -96,42 +113,63 @@ const tabVal = ref(0);
|
||||
|
||||
const dataList = ref<any>([]);
|
||||
|
||||
Taro.useLoad((options) => {
|
||||
const pageOpt = ref({
|
||||
page: 1,
|
||||
total: 0,
|
||||
});
|
||||
|
||||
Taro.useLoad(options => {
|
||||
tabVal.value = Number(options.type);
|
||||
getData();
|
||||
});
|
||||
|
||||
const getData = async () => {
|
||||
Taro.showLoading({
|
||||
title: '加载中',
|
||||
});
|
||||
try {
|
||||
const user_info = Taro.getStorageSync("userInfo");
|
||||
const user_info = Taro.getStorageSync('userInfo');
|
||||
const data = {
|
||||
bid: user_info.data.bid,
|
||||
status: tabVal.value,
|
||||
PageNum: pageOpt.value.page,
|
||||
PageSize: 10,
|
||||
};
|
||||
const res = await getActiveOrderList(data);
|
||||
dataList.value = res.data.data;
|
||||
dataList.value.push(...res.data.data);
|
||||
pageOpt.value.total = res.data.total || 0;
|
||||
} catch (error) {
|
||||
Taro.showToast({
|
||||
title: error.msg,
|
||||
icon: "none",
|
||||
icon: 'none',
|
||||
});
|
||||
}
|
||||
Taro.hideLoading();
|
||||
};
|
||||
|
||||
const tabChange = (e: number) => {
|
||||
console.log(e);
|
||||
tabVal.value = e;
|
||||
getData();
|
||||
};
|
||||
|
||||
const toDetailPage = (item: any) => {
|
||||
Taro.setStorageSync("ver_order_info", item);
|
||||
Taro.setStorageSync('ver_order_info', item);
|
||||
Taro.navigateTo({
|
||||
url: "/pages/admin/order_manage/detail/index",
|
||||
url: '/pages/admin/order_manage/detail/index',
|
||||
});
|
||||
};
|
||||
|
||||
Taro.useReachBottom(() => {
|
||||
if (pageOpt.value.total === dataList.value.length)
|
||||
return Taro.showToast({
|
||||
title: '没有更多数据了',
|
||||
icon: 'none',
|
||||
});
|
||||
pageOpt.value.page++;
|
||||
getData();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "./index.scss";
|
||||
@import './index.scss';
|
||||
</style>
|
||||
|
||||
@@ -106,6 +106,7 @@
|
||||
<nut-calendar
|
||||
v-model:visible="isVisible"
|
||||
type="range"
|
||||
:default-value="pickerVal"
|
||||
:start-date="date_start"
|
||||
@close="isVisible = false"
|
||||
@choose="setChooseValue"
|
||||
@@ -193,11 +194,17 @@ const opts = ref<any>({
|
||||
],
|
||||
});
|
||||
|
||||
const pickerVal = ref<any>([])
|
||||
|
||||
Taro.useLoad((options) => {
|
||||
where.value.type = options.type === "price" ? 1 : 2;
|
||||
time.value = options.time;
|
||||
setTime(options.time);
|
||||
// getData();
|
||||
pickerVal.value = [
|
||||
dayjs().format('YYYY-MM-DD'),
|
||||
dayjs().format('YYYY-MM-DD'),
|
||||
];
|
||||
});
|
||||
|
||||
const setTime = (type: string) => {
|
||||
|
||||
@@ -1,13 +1,17 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="card">
|
||||
<nut-button block type="primary" @click="scanCode">扫码核销</nut-button>
|
||||
<image
|
||||
class="image"
|
||||
@tap="scanCode"
|
||||
src="http://p1.meituan.net/csc/696924dda634f05689dabdfbb18e88cc13551.png" />
|
||||
<view class="mt-2 text-[#7A7A7A]">扫描二维码核销</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Taro from "@tarojs/taro";
|
||||
import Taro from '@tarojs/taro';
|
||||
|
||||
// url参数转对象
|
||||
// const urlParse = (url: string) => {
|
||||
@@ -28,8 +32,8 @@ import Taro from "@tarojs/taro";
|
||||
const scanCode = () => {
|
||||
Taro.scanCode({
|
||||
onlyFromCamera: true,
|
||||
scanType: ["qrCode"],
|
||||
success: async (res) => {
|
||||
scanType: ['qrCode'],
|
||||
success: async res => {
|
||||
try {
|
||||
Taro.navigateTo({
|
||||
url: `/pages/admin/verify/verify_list/index?oid=${res.result}`,
|
||||
@@ -37,7 +41,7 @@ const scanCode = () => {
|
||||
} catch (error) {
|
||||
Taro.showToast({
|
||||
title: error.msg,
|
||||
icon: "none",
|
||||
icon: 'none',
|
||||
});
|
||||
}
|
||||
},
|
||||
@@ -48,9 +52,9 @@ const scanCode = () => {
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #f5f5f5;
|
||||
background-image: url("~@/static/admin/cancellation-header.png");
|
||||
background-image: url('http://p0.meituan.net/csc/e6ff5582788af2023f49241afe22fc89391851.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 30%;
|
||||
background-size: 100% 25%;
|
||||
}
|
||||
|
||||
.card {
|
||||
@@ -59,10 +63,16 @@ page {
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
margin: 300px auto;
|
||||
border-radius: 10px;
|
||||
border-radius: 33px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0 100px;
|
||||
|
||||
.image {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
38
src/pages/admin/verify/verify_list/index.scss
Normal file
38
src/pages/admin/verify/verify_list/index.scss
Normal file
@@ -0,0 +1,38 @@
|
||||
.card {
|
||||
padding: 20rpx;
|
||||
background-color: #fff;
|
||||
margin: 20px auto;
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.image {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
border-radius: 15px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.info {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.line {
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background-color: #f5f5f5;
|
||||
margin: 10px 0;
|
||||
}
|
||||
}
|
||||
.nut-button {
|
||||
border-radius: 20px;
|
||||
}
|
||||
@@ -1,49 +1,71 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="card">
|
||||
<view>订单号:{{ goodInfo.oid }}</view>
|
||||
<view class="text-[#7A7A7A]">订单号:{{ goodInfo.oid }}</view>
|
||||
<view class="line"></view>
|
||||
<view
|
||||
class="container"
|
||||
v-for="(item, index) in goodInfo.OrderGoods"
|
||||
:key="index"
|
||||
>
|
||||
<image class="image" :src="item.Goods.cover" mode="widthFix"></image>
|
||||
:key="index">
|
||||
<image class="image" :src="item.Goods.cover"></image>
|
||||
<view class="info">
|
||||
<view class="title">商品名称:{{ item.Goods.name }}</view>
|
||||
<view class="title">描述:{{ item.Goods.profile }}</view>
|
||||
<view class="num"
|
||||
>数量: <text style="color: red">{{ item.number }}</text></view
|
||||
>
|
||||
<view class="title">{{ item.Goods.name }}</view>
|
||||
<view class="text-[#7A7A7A] text-[22px]">{{
|
||||
item.Goods.profile || '此商品暂无描述'
|
||||
}}</view>
|
||||
</view>
|
||||
<view></view>
|
||||
<view class="text-[#9C9C9C]">x{{ item.number }}</view>
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<text>支付方式:{{ goodInfo.pay_type === 1 ? "微信" : "积分" }}</text
|
||||
>,
|
||||
<text
|
||||
>总计:{{
|
||||
goodInfo.pay_type === 1 ? goodInfo.price : goodInfo.exchange
|
||||
}}</text
|
||||
>
|
||||
<view class="line"></view>
|
||||
<view class="cz">
|
||||
<view
|
||||
class="flex justify-between items-center mt-3 mb-2 text-[25px]"
|
||||
style="text-align: right">
|
||||
<text class="text-[#9C9C9C] text-left"
|
||||
>共{{ goodInfo.count }}件商品</text
|
||||
>
|
||||
<text class="flex-1"
|
||||
>{{ goodInfo.status !== 0 ? '实' : '应' }}付款{{
|
||||
goodInfo.pay_type === 1 ? '(元): ' : '(积分): '
|
||||
}}{{
|
||||
goodInfo.pay_type === 1 ? goodInfo.price : goodInfo.exchange
|
||||
}}</text
|
||||
>
|
||||
</view>
|
||||
<!-- <view class="line"></view> -->
|
||||
<!-- <view class="cz">
|
||||
<nut-button size="small" type="primary" @click="subVerify"
|
||||
>确定核销</nut-button
|
||||
>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
<nut-cell-group>
|
||||
<nut-cell title="订单信息"></nut-cell>
|
||||
<nut-cell
|
||||
title="下单时间:"
|
||||
:desc="goodInfo.add_time?.slice(0, 19)"></nut-cell>
|
||||
<nut-cell title="下单号码:" :desc="goodInfo.User?.phone"></nut-cell>
|
||||
<nut-cell title="下单用户:" :desc="goodInfo.User?.nickName"></nut-cell>
|
||||
<nut-cell
|
||||
title="付款方式:"
|
||||
:desc="getPayType(goodInfo.pay_type)"></nut-cell>
|
||||
</nut-cell-group>
|
||||
|
||||
<view class="w-[90%] mt-[40px] m-auto">
|
||||
<nut-button type="primary" shape="square" block @click="subVerify"
|
||||
>确定核销</nut-button
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Taro from "@tarojs/taro";
|
||||
import { getActiveVerifyList, activeOrderVerify } from "@/api/admin";
|
||||
import { ref } from "vue";
|
||||
import Taro from '@tarojs/taro';
|
||||
import {getActiveVerifyList, activeOrderVerify} from '@/api/admin';
|
||||
import {ref} from 'vue';
|
||||
|
||||
const opt = ref<any>({});
|
||||
|
||||
Taro.useLoad((options) => {
|
||||
Taro.useLoad(options => {
|
||||
opt.value = options;
|
||||
getData(options);
|
||||
});
|
||||
@@ -51,15 +73,15 @@ Taro.useLoad((options) => {
|
||||
const goodInfo = ref<any>({});
|
||||
|
||||
const getData = async (options: any) => {
|
||||
const merInfo = Taro.getStorageSync("mer_info");
|
||||
const merInfo = Taro.getStorageSync('mer_info');
|
||||
const res = await getActiveVerifyList({
|
||||
oid: options.oid,
|
||||
bid: merInfo.bid,
|
||||
});
|
||||
if (!res.data.data.oid) {
|
||||
Taro.showToast({
|
||||
title: "没有此订单",
|
||||
icon: "none",
|
||||
title: '没有此订单',
|
||||
icon: 'none',
|
||||
});
|
||||
setTimeout(() => {
|
||||
Taro.navigateBack({
|
||||
@@ -78,7 +100,7 @@ const subVerify = async () => {
|
||||
});
|
||||
Taro.showToast({
|
||||
title: res.msg,
|
||||
icon: "none",
|
||||
icon: 'none',
|
||||
});
|
||||
setTimeout(() => {
|
||||
Taro.navigateBack({
|
||||
@@ -88,49 +110,26 @@ const subVerify = async () => {
|
||||
} catch (error) {
|
||||
Taro.showToast({
|
||||
title: error.msg,
|
||||
icon: "none",
|
||||
icon: 'none',
|
||||
});
|
||||
throw error;
|
||||
}
|
||||
};
|
||||
|
||||
const getPayType = (type: number) => {
|
||||
switch (type) {
|
||||
case 1:
|
||||
return '微信线上支付';
|
||||
case 2:
|
||||
return '平台积分支付';
|
||||
case 3:
|
||||
return '天才小猪支付';
|
||||
default:
|
||||
return '未知';
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.card {
|
||||
padding: 20rpx;
|
||||
background-color: #fff;
|
||||
margin: 10px auto;
|
||||
width: 90%;
|
||||
border-radius: 7px;
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
|
||||
image {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
border-radius: 7px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.info {
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.line {
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background-color: #f5f5f5;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.cz {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
@import './index.scss';
|
||||
</style>
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
export default definePageConfig({
|
||||
navigationBarTitleText: "收益提现",
|
||||
navigationBarTitleText: '收益提现',
|
||||
enablePullDownRefresh: true,
|
||||
});
|
||||
|
||||
125
src/pages/admin/withdrawal/index.scss
Normal file
125
src/pages/admin/withdrawal/index.scss
Normal file
@@ -0,0 +1,125 @@
|
||||
.text-red {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.data {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background-color: #fff;
|
||||
padding: 10px;
|
||||
|
||||
.pagination {
|
||||
margin: 10px auto;
|
||||
}
|
||||
}
|
||||
|
||||
.tag {
|
||||
width: 100%;
|
||||
padding: 5px 8px;
|
||||
color: white;
|
||||
border-radius: 8px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.success {
|
||||
color: #4fc08d;
|
||||
}
|
||||
|
||||
.danger {
|
||||
color: #df3526;
|
||||
}
|
||||
|
||||
.warning {
|
||||
color: #f3812e;
|
||||
}
|
||||
|
||||
.image {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.card {
|
||||
margin: 20px auto;
|
||||
background-image: url('http://p0.meituan.net/csc/902ecf4ba9765a8200817d58a3a5a655172781.png');
|
||||
background-size: 100% 100%;
|
||||
width: 95%;
|
||||
height: 250px;
|
||||
border-radius: 15px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
|
||||
.container {
|
||||
color: #fff;
|
||||
padding: 45px 100px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
|
||||
.line {
|
||||
width: 1px;
|
||||
height: 50px;
|
||||
background-color: #ff9c9c;
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
color: #8a1717;
|
||||
border-bottom-left-radius: 15px;
|
||||
border-bottom-right-radius: 15px;
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
padding: 10px 30px;
|
||||
height: 150px;
|
||||
}
|
||||
}
|
||||
|
||||
.formCard {
|
||||
width: 95%;
|
||||
margin: auto;
|
||||
border-radius: 20px;
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
|
||||
--nut-cell-box-shadow: none;
|
||||
--nut-cell-padding: 10px 5px;
|
||||
}
|
||||
|
||||
.nut-button {
|
||||
border-radius: 20px;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.title-line {
|
||||
width: 8px;
|
||||
height: 35px;
|
||||
background-color: #df3526;
|
||||
border-radius: 20px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #333333;
|
||||
|
||||
.item {
|
||||
width: 95%;
|
||||
background-color: #fff;
|
||||
margin-bottom: 10px;
|
||||
border-radius: 15px;
|
||||
padding: 25px;
|
||||
}
|
||||
}
|
||||
@@ -1,100 +1,40 @@
|
||||
<script lang="ts" setup>
|
||||
import { ref, h } from "vue";
|
||||
import Taro from "@tarojs/taro";
|
||||
import { getWithdrawList, addWithdraw } from "@/api/admin";
|
||||
import {ref, h} from 'vue';
|
||||
import Taro from '@tarojs/taro';
|
||||
import {getWithdrawList, addWithdraw} from '@/api/admin';
|
||||
|
||||
const user_info = Taro.getStorageSync("userInfo");
|
||||
const user_info = ref<any>({});
|
||||
|
||||
const mer_info = ref<any>({});
|
||||
|
||||
const row = ref(0);
|
||||
|
||||
const formRef = ref();
|
||||
|
||||
const basicData = ref({
|
||||
num: "",
|
||||
num: '',
|
||||
});
|
||||
|
||||
const showPreview = ref(false);
|
||||
|
||||
const visible1 = ref(false);
|
||||
|
||||
const imgData = ref([
|
||||
{
|
||||
src: "",
|
||||
src: '',
|
||||
},
|
||||
]);
|
||||
|
||||
const columns = ref([
|
||||
{
|
||||
title: "时间",
|
||||
key: "add_time",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "提现金额",
|
||||
key: "integral",
|
||||
align: "center",
|
||||
render: (row: { integral: number }) => {
|
||||
return h("view", {}, row.integral);
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "审核状态",
|
||||
key: "status",
|
||||
align: "center",
|
||||
render: (row: { status: number }) => {
|
||||
return h(
|
||||
"view",
|
||||
{
|
||||
class: `tag ${
|
||||
row.status === 1
|
||||
? "success"
|
||||
: row.status === 2
|
||||
? "danger"
|
||||
: "warning"
|
||||
}`,
|
||||
},
|
||||
{
|
||||
default: () =>
|
||||
row.status === 1
|
||||
? "已打款"
|
||||
: row.status === 2
|
||||
? "已拒绝"
|
||||
: "待审核",
|
||||
}
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "备注",
|
||||
key: "img",
|
||||
align: "center",
|
||||
render: (row: { status_img: string }) => {
|
||||
return h("img", {
|
||||
class: "image",
|
||||
onClick: () => {
|
||||
imgData.value[0].src = row.status_img;
|
||||
showPreview.value = true;
|
||||
},
|
||||
src: row.status_img,
|
||||
});
|
||||
},
|
||||
},
|
||||
]);
|
||||
|
||||
const data = ref([]);
|
||||
const data = ref<any>([]);
|
||||
|
||||
const pagination = ref({
|
||||
page: 1,
|
||||
itemsPerPage: 5,
|
||||
showPageSize: 5,
|
||||
totalItems: 0,
|
||||
change: (page: number) => {
|
||||
pagination.value.page = page;
|
||||
getData();
|
||||
},
|
||||
total: 0,
|
||||
});
|
||||
|
||||
const hideFn = () => {
|
||||
showPreview.value = false;
|
||||
};
|
||||
|
||||
Taro.useLoad(() => {
|
||||
user_info.value = Taro.getStorageSync('userInfo');
|
||||
mer_info.value = Taro.getStorageSync('mer_info');
|
||||
getData();
|
||||
});
|
||||
|
||||
@@ -102,11 +42,11 @@ const getData = async () => {
|
||||
try {
|
||||
const res = await getWithdrawList({
|
||||
PageNum: pagination.value.page,
|
||||
PageSize: pagination.value.showPageSize,
|
||||
Bid: user_info.data.bid,
|
||||
PageSize: 10,
|
||||
Bid: user_info.value.data.bid,
|
||||
});
|
||||
data.value = res.data.data || [];
|
||||
pagination.value.totalItems = res.data.total;
|
||||
data.value.push(...res.data.data);
|
||||
pagination.value.total = res.data.total;
|
||||
row.value = res.data.integral || 0;
|
||||
} catch (e) {
|
||||
throw e;
|
||||
@@ -115,111 +55,220 @@ const getData = async () => {
|
||||
|
||||
const add = async () => {
|
||||
try {
|
||||
if (Number(basicData.value.num) === 0)
|
||||
return Taro.showToast({
|
||||
title: "提现积分需大于0",
|
||||
icon: "none",
|
||||
});
|
||||
const res = await addWithdraw({
|
||||
Bid: user_info.data.bid,
|
||||
Number: Number(basicData.value.num),
|
||||
formRef.value?.validate().then(async ({valid}) => {
|
||||
if (valid) {
|
||||
const res = await addWithdraw({
|
||||
Bid: user_info.value.data.bid,
|
||||
Number: Number(basicData.value.num),
|
||||
});
|
||||
Taro.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none',
|
||||
});
|
||||
basicData.value.num = '';
|
||||
await getData();
|
||||
}
|
||||
});
|
||||
Taro.showToast({
|
||||
title: res.msg,
|
||||
icon: "none",
|
||||
});
|
||||
await getData();
|
||||
} catch (e) {
|
||||
throw e;
|
||||
}
|
||||
};
|
||||
|
||||
const rules = ref({
|
||||
num: [
|
||||
{
|
||||
message: '请填写提现积分',
|
||||
validator: (value, _) => {
|
||||
console.log(value);
|
||||
if (!value) {
|
||||
return false;
|
||||
} else {
|
||||
return true;
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
message: '提现积分最低为100',
|
||||
validator: (value, _) => {
|
||||
if (Number(value) < 100) {
|
||||
return false;
|
||||
} else {
|
||||
return true;
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
message: '提现积分不能大于可提现积分',
|
||||
validator: (value, _) => {
|
||||
if (Number(value) > row.value) {
|
||||
return false;
|
||||
} else {
|
||||
return true;
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
const openPreview = item => {
|
||||
imgData.value[0].src = item.status_img;
|
||||
showPreview.value = true;
|
||||
};
|
||||
|
||||
const closePreview = () => {
|
||||
showPreview.value = false;
|
||||
imgData.value[0].src = '';
|
||||
};
|
||||
|
||||
Taro.usePullDownRefresh(() => {
|
||||
pagination.value.page = 1;
|
||||
getData();
|
||||
Taro.stopPullDownRefresh();
|
||||
});
|
||||
|
||||
Taro.useReachBottom(() => {
|
||||
if (pagination.value.total === data.value.length)
|
||||
return Taro.showToast({
|
||||
title: '没有更多数据了',
|
||||
icon: 'none',
|
||||
});
|
||||
pagination.value.page++;
|
||||
getData();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<view>
|
||||
<nut-form>
|
||||
<nut-form-item label="提现积分:">
|
||||
<nut-input
|
||||
v-model="basicData.num"
|
||||
class="nut-input-text"
|
||||
placeholder="请输入提现积分"
|
||||
type="text"
|
||||
/>
|
||||
</nut-form-item>
|
||||
<nut-form-item>
|
||||
<view class="card">
|
||||
<view class="container">
|
||||
<view class="">
|
||||
<view class="font-bold text-[35px]">{{ row }}</view>
|
||||
<view class="text-[25px] mt-2">可提现积分</view>
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<view class="">
|
||||
<view class="font-bold text-[35px]">{{
|
||||
(row / 100 - (row / 100) * 0.138).toFixed(2)
|
||||
}}</view>
|
||||
<view class="text-[25px] mt-2">实际到账</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="footer">
|
||||
<text>到账方式</text>
|
||||
<!-- <text>{{
|
||||
`${mer_info.bank}(${mer_info.bank_card?.substring(
|
||||
mer_info.bank_card.length - 4,
|
||||
)})`
|
||||
}}</text> -->
|
||||
<text>银行卡汇款</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="formCard">
|
||||
<view class="flex justify-between">
|
||||
<text>积分提现</text>
|
||||
<view class="flex items-center" @click="visible1 = true">
|
||||
<image
|
||||
class="w-[25px] h-[25px]"
|
||||
src="http://p1.meituan.net/csc/5437a800f4ed4a49f14984494c1c3077994.png"></image>
|
||||
<view class="text-[#EC4443] text-[20px] ml-1">提现疑问</view>
|
||||
</view>
|
||||
</view>
|
||||
<nut-form ref="formRef" :model-value="basicData" :rules="rules">
|
||||
<nut-form-item prop="num">
|
||||
<nut-input
|
||||
v-model="basicData.num"
|
||||
class="nut-input-text"
|
||||
placeholder="请输入提现积分"
|
||||
type="text">
|
||||
<template #right>
|
||||
<text
|
||||
class="text-[#EC4443] text-[25px]"
|
||||
@tap="basicData.num = row.toString()"
|
||||
>全部</text
|
||||
>
|
||||
</template>
|
||||
</nut-input>
|
||||
</nut-form-item>
|
||||
</nut-form>
|
||||
<nut-button block type="primary" @click="add">立即提现</nut-button>
|
||||
</view>
|
||||
|
||||
<view class="title">
|
||||
<view class="title-line"></view>
|
||||
<view class="title-text">提现记录</view>
|
||||
</view>
|
||||
|
||||
<view class="list" v-if="data.length > 0">
|
||||
<view class="item" v-for="(item, index) in data" :key="index">
|
||||
<view class="flex justify-between items-center">
|
||||
<view class="text-[25px] text-[#9C9C9C]">到账金额</view>
|
||||
<view
|
||||
class="text-[27px]"
|
||||
:class="
|
||||
item.status === 1
|
||||
? 'success'
|
||||
: item.status === 1
|
||||
? 'danger'
|
||||
: 'warning'
|
||||
"
|
||||
>{{
|
||||
item.status === 1
|
||||
? '已打款'
|
||||
: item.status === 2
|
||||
? '已拒绝'
|
||||
: '待审核'
|
||||
}}</view
|
||||
>
|
||||
</view>
|
||||
<view>
|
||||
当前可提现积分:
|
||||
<text class="text-red">{{ row }}</text>
|
||||
<view class="mt-3 mb-3 text-[35px]">¥{{ item.number }}</view>
|
||||
<view class="text-[25px] mb-1">提现积分:{{ item.integral }}</view>
|
||||
<view class="text-[25px] mb-1"
|
||||
>信息服务费:{{ item.commission }}</view
|
||||
>
|
||||
<view class="text-[25px] mb-1"
|
||||
>手续费:{{ item.commission_number }}%</view
|
||||
>
|
||||
<view class="text-[25px] mb-1">时间:{{ item.add_time }}</view>
|
||||
<view v-if="item.status === 2" class="text-[25px] text-[#9C9C9C]"
|
||||
>备注:</view
|
||||
>
|
||||
<view
|
||||
v-if="item.status === 1"
|
||||
class="text-[23px] mt-2 text-[#df3526]"
|
||||
@click="openPreview(item)"
|
||||
>点我查看回执单</view
|
||||
>
|
||||
</view>
|
||||
<view style="margin-top: 10px">
|
||||
实际到账:
|
||||
<text class="text-red">{{ (row / 100).toFixed(2) }}</text>
|
||||
元
|
||||
</view>
|
||||
</nut-form-item>
|
||||
<nut-form-item>
|
||||
<nut-button block type="primary" @click="add">立即提现</nut-button>
|
||||
</nut-form-item>
|
||||
</nut-form>
|
||||
<view v-if="data.length > 0">
|
||||
<view class="data">
|
||||
<nut-table :columns="columns" :data="data"></nut-table>
|
||||
<nut-pagination
|
||||
class="pagination"
|
||||
v-model="pagination.page"
|
||||
:total-items="pagination.totalItems"
|
||||
:items-per-page="pagination.itemsPerPage"
|
||||
:show-page-size="pagination.showPageSize"
|
||||
@change="pagination.change"
|
||||
:bordered="false"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
<nut-empty v-else description="暂无提现记录"></nut-empty>
|
||||
<!-- 图片预览 -->
|
||||
<nut-image-preview :show="showPreview" :images="imgData" @close="hideFn" />
|
||||
<nut-image-preview
|
||||
:show="showPreview"
|
||||
:images="imgData"
|
||||
@close="closePreview" />
|
||||
|
||||
<nut-dialog
|
||||
title="提现疑问?"
|
||||
content="这是基础弹框。"
|
||||
ok-text="我已知晓"
|
||||
:no-cancel-btn="true"
|
||||
v-model:visible="visible1">
|
||||
<template #default>
|
||||
<text>
|
||||
积分和人民币兑换比例为
|
||||
<text class="text-[#F83D3D]">100:1</text>
|
||||
平台收取<text class="text-[#F83D3D]">10%服务费</text>和<text
|
||||
class="text-[#F83D3D]"
|
||||
>0.038%手续费</text
|
||||
>
|
||||
</text>
|
||||
</template>
|
||||
</nut-dialog>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
.text-red {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.data {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background-color: #fff;
|
||||
padding: 10px;
|
||||
|
||||
.pagination {
|
||||
margin: 10px auto;
|
||||
}
|
||||
}
|
||||
|
||||
.tag {
|
||||
width: 100%;
|
||||
padding: 5px 8px;
|
||||
color: white;
|
||||
border-radius: 8px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.success {
|
||||
background-color: #4fc08d;
|
||||
}
|
||||
|
||||
.danger {
|
||||
background-color: #df3526;
|
||||
}
|
||||
|
||||
.warning {
|
||||
background-color: #f3812e;
|
||||
}
|
||||
|
||||
.image {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
@import './index.scss';
|
||||
</style>
|
||||
|
||||
@@ -1,3 +1,3 @@
|
||||
export default definePageConfig({
|
||||
navigationBarTitleText: "活动游戏",
|
||||
navigationBarTitleText: '',
|
||||
});
|
||||
|
||||
@@ -5,14 +5,26 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
import { useLoad, getStorageSync } from "@tarojs/taro";
|
||||
import {ref} from 'vue';
|
||||
import Taro from '@tarojs/taro';
|
||||
|
||||
const url = ref("");
|
||||
const url = ref('');
|
||||
|
||||
useLoad(() => {
|
||||
// const user = getStorageSync("userInfo");
|
||||
url.value = `${process.env.TARO_APP_GAME}${getStorageSync("token")}`;
|
||||
Taro.useDidShow(() => {
|
||||
const token = Taro.getStorageSync('token');
|
||||
if (token) {
|
||||
url.value = `${process.env.TARO_APP_GAME}${Taro.getStorageSync('token')}`;
|
||||
} else {
|
||||
Taro.showToast({
|
||||
title: '请先登录,再尝试进入游戏大厅。',
|
||||
icon: 'none',
|
||||
});
|
||||
setTimeout(() => {
|
||||
Taro.switchTab({
|
||||
url: '/pages/index/index',
|
||||
});
|
||||
}, 1000);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<view class="app">
|
||||
<view class="head-wrapper" :style="{ top: BarHeight + 'px' }">
|
||||
<view class="head-wrapper" :style="{top: BarHeight + 'px'}">
|
||||
<view class="head-menu">
|
||||
<Left class="iconfont" @click="returns" />
|
||||
<Home class="iconfont" @click="goHome" />
|
||||
@@ -11,71 +11,63 @@
|
||||
:init-page="0"
|
||||
:pagination-visible="true"
|
||||
pagination-color="#426543"
|
||||
auto-play="3000"
|
||||
>
|
||||
auto-play="3000">
|
||||
<nut-swiper-item v-for="(itm, idx) in swiperList" :key="idx">
|
||||
<img :alt="idx.toString()" :src="itm" />
|
||||
</nut-swiper-item>
|
||||
</nut-swiper>
|
||||
<!-- 标题价格 -->
|
||||
<view class="card">
|
||||
<view class="header">
|
||||
<view class="price">
|
||||
<view class="flex items-center justify-between">
|
||||
<view class="flex items-center">
|
||||
<nut-price size="large" :price="goodInfo.number"></nut-price>
|
||||
<view class="ml-5 line"></view>
|
||||
<nut-price
|
||||
size="normal"
|
||||
:price="goodInfo.number as number"
|
||||
position="after"
|
||||
symbol="元"
|
||||
/>
|
||||
<nut-price
|
||||
size="normal"
|
||||
:price="goodInfo.exchange as number"
|
||||
position="after"
|
||||
symbol="积分"
|
||||
/>
|
||||
class="ml-5"
|
||||
size="large"
|
||||
:price="goodInfo.exchange"
|
||||
symbol="积分"></nut-price>
|
||||
</view>
|
||||
|
||||
<view class="stock"> 库存剩余:{{ goodInfo.stock }}</view>
|
||||
</view>
|
||||
<view class="title">{{ goodInfo.name }}</view>
|
||||
<view class="sub">{{ goodInfo.profile }}</view>
|
||||
<view class="cartBox">
|
||||
<nut-button
|
||||
size="small"
|
||||
type="primary"
|
||||
@click.stop="add_cart(goodInfo)"
|
||||
>
|
||||
@click.stop="add_cart(goodInfo)">
|
||||
<template #icon>
|
||||
<Cart2 />
|
||||
</template>
|
||||
</nut-button>
|
||||
</view>
|
||||
<view class="flex items-center justify-between mt-3">
|
||||
<view class="title text-lg">{{ goodInfo.name }}</view>
|
||||
<view class="stock text-[#9E9E9E]"> 库存:{{ goodInfo.stock }}</view>
|
||||
</view>
|
||||
<view class="line1"></view>
|
||||
<view class="sub">{{ goodInfo.profile }}</view>
|
||||
</view>
|
||||
<!-- 产品介绍 -->
|
||||
<!-- 商品详情 -->
|
||||
<view class="rich-box">
|
||||
<view class="title">产品介绍</view>
|
||||
<view class="title">-----商品详情-----</view>
|
||||
<rich-text
|
||||
v-if="goodInfo.details"
|
||||
class="rich"
|
||||
:nodes="goodInfo.details"
|
||||
></rich-text>
|
||||
<nut-empty v-else description="暂无产品介绍"></nut-empty>
|
||||
:nodes="goodInfo.details"></rich-text>
|
||||
<nut-empty v-else description="暂无商品详情"></nut-empty>
|
||||
</view>
|
||||
<view style="height: 9vh"></view>
|
||||
<!-- 底部 -->
|
||||
<!-- 购物车 -->
|
||||
<cart ref="cartRef" :mer-info="mer_info" @update-cart="updateCartNum" />
|
||||
<Cart ref="cartRef" :mer-info="mer_info" @update-cart="updateCartNum" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { Ref, ref } from "vue";
|
||||
import Taro from "@tarojs/taro";
|
||||
import { Home, Left } from "@nutui/icons-vue-taro";
|
||||
import { getActiveGoodsDetail } from "@/api/goods";
|
||||
import Cart from "@/components/Cart.vue";
|
||||
import { Cart2 } from "@nutui/icons-vue-taro";
|
||||
import { nextTick } from "vue";
|
||||
import {Ref, ref} from 'vue';
|
||||
import Taro from '@tarojs/taro';
|
||||
import {Home, Left} from '@nutui/icons-vue-taro';
|
||||
import {getActiveGoodsDetail} from '@/api/goods';
|
||||
import Cart from '@/components/Cart.vue';
|
||||
import {Cart2} from '@nutui/icons-vue-taro';
|
||||
import {nextTick} from 'vue';
|
||||
|
||||
const statusBarHeight = Taro.getSystemInfoSync()?.statusBarHeight;
|
||||
const BarHeight = ref((statusBarHeight as number) + 7);
|
||||
@@ -98,9 +90,9 @@ interface GoodInfo {
|
||||
|
||||
const goodInfo = ref<GoodInfo>({});
|
||||
|
||||
Taro.useLoad(async (options) => {
|
||||
Taro.useLoad(async options => {
|
||||
await get_good_detail(options.gid);
|
||||
mer_info.value = Taro.getStorageSync("mer_info");
|
||||
mer_info.value = Taro.getStorageSync('mer_info');
|
||||
await nextTick(async () => {
|
||||
await cartRef.value.get_cart_list();
|
||||
});
|
||||
@@ -114,16 +106,16 @@ Taro.useShareAppMessage(() => ({
|
||||
|
||||
const get_good_detail = async (gid: string) => {
|
||||
try {
|
||||
const res = await getActiveGoodsDetail({ gid: gid });
|
||||
const res = await getActiveGoodsDetail({gid: gid});
|
||||
goodInfo.value = {
|
||||
...res.data.data,
|
||||
// details: res.data.data.details.,
|
||||
};
|
||||
swiperList.value = res.data.data.rotation.split(",");
|
||||
swiperList.value = res.data.data.rotation.split(',');
|
||||
} catch (e) {
|
||||
Taro.showToast({
|
||||
title: e.msg,
|
||||
icon: "none",
|
||||
icon: 'none',
|
||||
});
|
||||
}
|
||||
};
|
||||
@@ -136,7 +128,7 @@ const returns = () => {
|
||||
|
||||
const goHome = () => {
|
||||
Taro.switchTab({
|
||||
url: "/pages/index/index",
|
||||
url: '/pages/index/index',
|
||||
});
|
||||
};
|
||||
|
||||
@@ -169,7 +161,7 @@ const updateCartNum = (cartItems: CartItems[]) => {
|
||||
}
|
||||
});
|
||||
} else {
|
||||
Reflect.deleteProperty(goodInfo.value, "cartNum");
|
||||
Reflect.deleteProperty(goodInfo.value, 'cartNum');
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -221,38 +213,15 @@ page {
|
||||
padding: 30px;
|
||||
background-color: #fff;
|
||||
position: relative;
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.price {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.stock {
|
||||
color: #8f8f8f;
|
||||
}
|
||||
}
|
||||
border-radius: 30px;
|
||||
top: -60px;
|
||||
width: 95%;
|
||||
margin: auto;
|
||||
|
||||
.sub {
|
||||
font-size: 24px;
|
||||
font-size: 30px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.cartBox {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.rich-box {
|
||||
@@ -262,6 +231,8 @@ page {
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
padding: 15px 0;
|
||||
border-top-left-radius: 20px;
|
||||
border-top-right-radius: 20px;
|
||||
|
||||
.title {
|
||||
font-size: 30px;
|
||||
@@ -328,4 +299,16 @@ page {
|
||||
font-size: 25px;
|
||||
}
|
||||
}
|
||||
|
||||
.line {
|
||||
width: 1px;
|
||||
height: 30px;
|
||||
background-color: #8f8f8f;
|
||||
}
|
||||
.line1 {
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background-color: #F0F0F0;
|
||||
margin: 20px auto;
|
||||
}
|
||||
</style>
|
||||
|
||||
3
src/pages/goods/pay/index.config.ts
Normal file
3
src/pages/goods/pay/index.config.ts
Normal file
@@ -0,0 +1,3 @@
|
||||
export default definePageConfig({
|
||||
navigationBarTitleText: '支付订单',
|
||||
});
|
||||
39
src/pages/goods/pay/index.scss
Normal file
39
src/pages/goods/pay/index.scss
Normal file
@@ -0,0 +1,39 @@
|
||||
.nut-price {
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.nut-price--symbol-large {
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.line {
|
||||
width: 1;
|
||||
height: 30px;
|
||||
border-left: 1px solid #a3a3a3;
|
||||
margin: 0 50px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.nut-radio {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.nut-radio__label {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.nut-button {
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
.nut-short-password {
|
||||
.nut-icon-tips {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@for $i from 1 through 5 {
|
||||
.nut-short-password__item:nth-child(#{$i}) {
|
||||
border-right: 1px solid var(--nut-shortpassword-border-color, #ddd);
|
||||
}
|
||||
}
|
||||
}
|
||||
287
src/pages/goods/pay/index.vue
Normal file
287
src/pages/goods/pay/index.vue
Normal file
@@ -0,0 +1,287 @@
|
||||
<template>
|
||||
<view class="flex flex-col items-center justify-center">
|
||||
<view class="mt-6 text-[#8C8C8C] text-[25px]"
|
||||
>交易剩余时间:{{ tStr }}</view
|
||||
>
|
||||
<view class="flex items-center mt-5 mb-5">
|
||||
<nut-price :price="orderData.price" size="large" />
|
||||
<view class="line"></view>
|
||||
<nut-price
|
||||
:decimal-digits="0"
|
||||
position="after"
|
||||
symbol="积分"
|
||||
:price="orderData.exchange"
|
||||
size="large" />
|
||||
</view>
|
||||
<nut-radio-group class="w-[95%]" v-model="payVal">
|
||||
<nut-cell-group class="w-full">
|
||||
<nut-cell class="text-[#333333]" title="支付方式"></nut-cell>
|
||||
<nut-cell
|
||||
class="flex items-center"
|
||||
title="微信支付"
|
||||
@click="cellClick(1, false)">
|
||||
<template #icon>
|
||||
<IconFont size="30" :name="require('../../../static/wx.png')" />
|
||||
</template>
|
||||
<template #link>
|
||||
<nut-radio :label="1"></nut-radio>
|
||||
</template>
|
||||
</nut-cell>
|
||||
<nut-cell
|
||||
class="flex items-center"
|
||||
title="平台积分支付"
|
||||
:desc="`剩余积分:${orderData.User?.integral || 0}`"
|
||||
@click="cellClick(2, orderData.User?.integral === 0 ? true : false)">
|
||||
<template #icon>
|
||||
<IconFont size="30" :name="require('../../../static/pt.png')" />
|
||||
</template>
|
||||
<template #link>
|
||||
<nut-radio
|
||||
:disabled="orderData.User?.integral === 0"
|
||||
:label="2"></nut-radio>
|
||||
</template>
|
||||
</nut-cell>
|
||||
<nut-cell
|
||||
class="flex items-center"
|
||||
title="天才小猪积分支付"
|
||||
:desc="`剩余积分:${orderData.integral || 0}`"
|
||||
@click="cellClick(3, orderData.integral === 0 ? true : false)">
|
||||
<template #icon>
|
||||
<IconFont size="30" :name="require('../../../static/jh.png')" />
|
||||
</template>
|
||||
<template #link>
|
||||
<nut-radio
|
||||
:disabled="orderData.integral === 0"
|
||||
:label="3"></nut-radio>
|
||||
</template>
|
||||
</nut-cell>
|
||||
</nut-cell-group>
|
||||
</nut-radio-group>
|
||||
<view class="w-[90%] mt-[100px]">
|
||||
<nut-button
|
||||
shape="square"
|
||||
:loading="isLoading"
|
||||
type="primary"
|
||||
block
|
||||
@click="pay"
|
||||
>确认支付</nut-button
|
||||
>
|
||||
</view>
|
||||
|
||||
<nut-short-password
|
||||
title="请输入交易密码"
|
||||
tips=" "
|
||||
desc=" "
|
||||
:error-msg="error_msg"
|
||||
v-model="shortVal"
|
||||
v-model:visible="visible"
|
||||
:length="6"
|
||||
:close-on-click-overlay="false"
|
||||
@focus="showKeyboard = true"
|
||||
@complete="shortComplete"
|
||||
@close="shortClose">
|
||||
</nut-short-password>
|
||||
<nut-number-keyboard
|
||||
v-model="shortVal"
|
||||
v-model:visible="showKeyboard"
|
||||
@blur="showKeyboard = false">
|
||||
</nut-number-keyboard>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Taro from '@tarojs/taro';
|
||||
import {IconFont} from '@nutui/icons-vue-taro';
|
||||
import {onUnmounted, ref} from 'vue';
|
||||
import {getActiveOrderDetail, checkTradePwd} from '@/api/goods';
|
||||
import {getUserPoint} from '@/api/admin';
|
||||
import {payOrder} from '@/api/order';
|
||||
import * as dayjs from 'dayjs';
|
||||
|
||||
const payVal = ref();
|
||||
|
||||
const t_id = ref();
|
||||
|
||||
const tStr = ref('00:00');
|
||||
|
||||
const error_msg = ref('');
|
||||
|
||||
const shortVal = ref('');
|
||||
|
||||
const orderData = ref<any>({});
|
||||
|
||||
const visible = ref(false);
|
||||
|
||||
const showKeyboard = ref(false);
|
||||
|
||||
const isLoading = ref(false);
|
||||
|
||||
const opt = ref<any>({});
|
||||
|
||||
Taro.useLoad(e => {
|
||||
const {oid, bid} = e;
|
||||
opt.value = e;
|
||||
getData(oid, bid);
|
||||
});
|
||||
|
||||
const getData = async (oid: string, bid: string) => {
|
||||
const user_info = Taro.getStorageSync('userInfo');
|
||||
const data = await getUserPoint({
|
||||
phone: user_info.data.phone,
|
||||
bid,
|
||||
});
|
||||
const res = await getActiveOrderDetail({
|
||||
oid,
|
||||
});
|
||||
|
||||
orderData.value = {
|
||||
...res.data.data,
|
||||
...data.data,
|
||||
};
|
||||
if (!orderData.value.oid)
|
||||
return Taro.showToast({
|
||||
title: '未获取到订单信息~',
|
||||
icon: 'none',
|
||||
});
|
||||
countdownTime();
|
||||
};
|
||||
|
||||
const pay = async () => {
|
||||
try {
|
||||
isLoading.value = true;
|
||||
if (!payVal.value)
|
||||
return Taro.showToast({title: '请选择支付方式', icon: 'none'});
|
||||
if (payVal.value !== 1) {
|
||||
visible.value = true;
|
||||
showKeyboard.value = true;
|
||||
} else {
|
||||
confirmPay();
|
||||
}
|
||||
} catch (error) {
|
||||
isLoading.value = false;
|
||||
Taro.showToast({
|
||||
title: error.msg,
|
||||
icon: 'none',
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const shortComplete = async value => {
|
||||
try {
|
||||
await checkTradePwd({
|
||||
pay_password: value,
|
||||
});
|
||||
shortClose(false);
|
||||
confirmPay();
|
||||
} catch (error) {
|
||||
error_msg.value = error.msg;
|
||||
shortVal.value = '';
|
||||
}
|
||||
};
|
||||
|
||||
const confirmPay = async () => {
|
||||
try {
|
||||
const res = await payOrder({
|
||||
oid: opt.value.oid,
|
||||
OrderType: orderData.value.pay_type,
|
||||
PayType: payVal.value,
|
||||
});
|
||||
switch (payVal.value) {
|
||||
case 1:
|
||||
if (typeof res.data.data === 'object') {
|
||||
Taro.requestPayment({
|
||||
timeStamp: res.data.data.timeStamp,
|
||||
nonceStr: res.data.data.nonceStr,
|
||||
package: res.data.data.package,
|
||||
signType: res.data.data.signType,
|
||||
paySign: res.data.data.paySign,
|
||||
success: function () {
|
||||
Taro.showToast({
|
||||
title: '支付成功',
|
||||
icon: 'success',
|
||||
});
|
||||
},
|
||||
fail: function () {
|
||||
Taro.showToast({
|
||||
title: '支付失败',
|
||||
icon: 'none',
|
||||
});
|
||||
},
|
||||
complete: function () {
|
||||
Taro.navigateTo({
|
||||
url: `/pages/users/order_list_detail/index?orderId=${opt.value.oid}`,
|
||||
});
|
||||
},
|
||||
});
|
||||
} else {
|
||||
Taro.showToast({
|
||||
title: '参数获取失败,请重试~',
|
||||
icon: 'none',
|
||||
});
|
||||
}
|
||||
break;
|
||||
default:
|
||||
Taro.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none',
|
||||
});
|
||||
setTimeout(() => {
|
||||
Taro.navigateTo({
|
||||
url: `/pages/users/order_list_detail/index?orderId=${opt.value.oid}`,
|
||||
});
|
||||
}, 2000);
|
||||
break;
|
||||
}
|
||||
isLoading.value = false;
|
||||
} catch (err) {
|
||||
isLoading.value = false;
|
||||
Taro.showToast({
|
||||
title: err.msg,
|
||||
icon: 'none',
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const shortClose = (isMsg: boolean = true) => {
|
||||
showKeyboard.value = false;
|
||||
visible.value = false;
|
||||
isLoading.value = false;
|
||||
shortVal.value = '';
|
||||
error_msg.value = '';
|
||||
if (isMsg) Taro.showToast({title: '支付取消', icon: 'none'});
|
||||
};
|
||||
|
||||
const cellClick = (val: number, isTrue: boolean) => {
|
||||
if (isTrue) {
|
||||
Taro.showToast({
|
||||
title: '该支付暂不可用!',
|
||||
icon: 'none',
|
||||
});
|
||||
payVal.value = undefined;
|
||||
} else {
|
||||
payVal.value = val;
|
||||
}
|
||||
};
|
||||
|
||||
const countdownTime = () => {
|
||||
if (!orderData.value.expires) return;
|
||||
t_id.value = setInterval(() => {
|
||||
const nowTime = dayjs().valueOf();
|
||||
const endTime = orderData.value.expires * 1000;
|
||||
const time = endTime - nowTime;
|
||||
tStr.value = dayjs(time).format('mm:ss');
|
||||
}, 1000);
|
||||
};
|
||||
|
||||
Taro.useDidHide(() => {
|
||||
clearInterval(t_id.value);
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
clearInterval(t_id.value);
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import './index.scss';
|
||||
</style>
|
||||
@@ -1,4 +1,5 @@
|
||||
export default definePageConfig({
|
||||
navigationBarTitleText: "首页",
|
||||
enableShareAppMessage: true,
|
||||
navigationStyle: "custom",
|
||||
});
|
||||
|
||||
126
src/pages/index/index.scss
Normal file
126
src/pages/index/index.scss
Normal file
@@ -0,0 +1,126 @@
|
||||
page {
|
||||
background-image: url("//p0.meituan.net/csc/aaaccd28594119e4b838d07d30739471440261.png");
|
||||
background-size: 100% 57%;
|
||||
background-repeat: no-repeat;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.local {
|
||||
margin-left: 15px;
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
color: #fff;
|
||||
|
||||
text {
|
||||
font-size: 25px;
|
||||
}
|
||||
}
|
||||
|
||||
.search {
|
||||
margin: 30px auto;
|
||||
display: flex;
|
||||
border-radius: 18px;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 10px 15px;
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
width: 730px;
|
||||
|
||||
input {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.search-btn {
|
||||
background-color: #f83d3d;
|
||||
color: #fff;
|
||||
border-radius: 10px;
|
||||
width: 100px;
|
||||
height: 60px;
|
||||
text-align: center;
|
||||
line-height: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
.banner {
|
||||
.title {
|
||||
background-image: url("//p0.meituan.net/csc/542112fc072d4687b437848bc29b0a1730495.png");
|
||||
background-size: 100% 100%;
|
||||
width: 600px;
|
||||
height: 90px;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.jf-btn {
|
||||
margin: 15px auto;
|
||||
background-image: url("//p1.meituan.net/csc/e125184432dc591137c24a26abe5796a25262.png");
|
||||
background-size: 100% 100%;
|
||||
width: 350px;
|
||||
height: 70px;
|
||||
}
|
||||
|
||||
.footer {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
justify-content: space-between;
|
||||
margin: 0 auto;
|
||||
padding: 0 15px;
|
||||
|
||||
.btn-1 {
|
||||
background-image: url("//p0.meituan.net/csc/7708348ee250eae910328bb7c12197f029562.png");
|
||||
background-size: 100% 100%;
|
||||
width: 200px;
|
||||
height: 220px;
|
||||
}
|
||||
|
||||
.btn-2 {
|
||||
background-image: url("//p1.meituan.net/csc/8cc2b518031eb7424b184d90a583d805146287.png");
|
||||
background-size: 100% 100%;
|
||||
width: 300px;
|
||||
height: 220px;
|
||||
}
|
||||
|
||||
.btn-3 {
|
||||
background-image: url("//p0.meituan.net/csc/31bd1f5c791c95557758dfa5c96e001529545.png");
|
||||
background-size: 100% 100%;
|
||||
width: 200px;
|
||||
height: 220px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.navigation {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
grid-gap: 10px;
|
||||
margin: 10px auto;
|
||||
width: 730px;
|
||||
height: auto;
|
||||
background-color: #fff;
|
||||
border-radius: 20px;
|
||||
padding: 20px;
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
.icon {
|
||||
background-size: 100% 100%;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #333333;
|
||||
font-size: 23px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ad {
|
||||
background-image: url("https://jdt168.oss-cn-guangzhou.aliyuncs.com/ad.png");
|
||||
background-size: 100% 100%;
|
||||
width: 100%;
|
||||
height: 180px;
|
||||
}
|
||||
@@ -1,172 +1,149 @@
|
||||
<template>
|
||||
<view class="app">
|
||||
<!-- 搜索 -->
|
||||
<nut-searchbar
|
||||
v-model="searchValue"
|
||||
placeholder="要搜索点什么?"
|
||||
></nut-searchbar>
|
||||
<view>
|
||||
<view :style="{marginTop: BarHeight + 'px'}"></view>
|
||||
<view class="local">
|
||||
<view class="iconfont icon-dizhi" style="font-size: 20px"></view>
|
||||
<text>{{ address }}</text>
|
||||
</view>
|
||||
<view class="search">
|
||||
<view
|
||||
class="iconfont icon-sousuo"
|
||||
style="color: #8f8f8f; margin-right: 8px"></view>
|
||||
<input placeholder="请输入商家名称搜索" v-model="searchVal" />
|
||||
<view class="search-btn" @click="clickSearch">搜索</view>
|
||||
</view>
|
||||
<view class="banner">
|
||||
<nut-swiper
|
||||
:init-page="0"
|
||||
:pagination-visible="true"
|
||||
pagination-color="#ff0000"
|
||||
auto-play="3000"
|
||||
>
|
||||
<nut-swiper-item v-for="(itm, idx) in bannerList" :key="idx">
|
||||
<img
|
||||
:src="itm.url"
|
||||
:alt="itm.ID.toString()"
|
||||
@click="toPage(itm.jump)"
|
||||
/>
|
||||
</nut-swiper-item>
|
||||
</nut-swiper>
|
||||
<view class="title"></view>
|
||||
<navigator class="jf-btn" hover-class="none"></navigator>
|
||||
<view class="footer">
|
||||
<navigator hover-class="none" class="btn-1"></navigator>
|
||||
<navigator
|
||||
hover-class="none"
|
||||
openType="switchTab"
|
||||
url="/pages/game/gamehome/index"
|
||||
class="btn-2"></navigator>
|
||||
<navigator hover-class="none" class="btn-3"></navigator>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 金刚区 -->
|
||||
<view class="navbar">
|
||||
<nut-grid :border="false" column-num="5">
|
||||
<nut-grid-item
|
||||
v-for="item in swiperList"
|
||||
:key="item.ID"
|
||||
:text="item.name"
|
||||
@click="toDetails(item)"
|
||||
>
|
||||
<image :src="item.icon" />
|
||||
</nut-grid-item>
|
||||
</nut-grid>
|
||||
<view class="navigation">
|
||||
<view
|
||||
class="item"
|
||||
v-for="(item, index) in navigationList"
|
||||
:key="index"
|
||||
@click="toPage(item)">
|
||||
<view
|
||||
class="icon"
|
||||
:style="{
|
||||
backgroundImage: `url(${item.icon})`,
|
||||
}">
|
||||
</view>
|
||||
<view class="text">{{ item.name }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<MerList />
|
||||
<!-- 签到弹窗 -->
|
||||
<Popup
|
||||
v-for="(item, index) in popupList"
|
||||
:ref="(el) => getRef(el, item.type)"
|
||||
:type="item.type"
|
||||
:src="item.src"
|
||||
:cb="item.cb"
|
||||
:key="index"
|
||||
/>
|
||||
<view class="ad" @click="showTips('该功能暂未开放')"></view>
|
||||
<MerList :get-user-location="getUserLocal" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from "vue";
|
||||
import Taro from "@tarojs/taro";
|
||||
import Popup from "@/components/Popup.vue";
|
||||
import MerList from "@/components/MerList.vue";
|
||||
import { getHomeList } from "@/api/home";
|
||||
import { getBanner, userSign } from "@/api/user";
|
||||
import { parseQueryString } from "@/utils";
|
||||
import { getMerList } from "@/api/goods";
|
||||
import game_1 from "../../static/index/game_1.png";
|
||||
<script setup lang="ts">
|
||||
import Taro from '@tarojs/taro';
|
||||
import {ref} from 'vue';
|
||||
import {getHomeList} from '@/api/home';
|
||||
import MerList from '@/components/MerList.vue';
|
||||
import {showTips} from '@/utils';
|
||||
|
||||
const searchValue = ref("");
|
||||
const statusBarHeight = Taro.getSystemInfoSync().statusBarHeight;
|
||||
const BarHeight = ref((statusBarHeight as number) + 7);
|
||||
|
||||
interface SwiperList {
|
||||
interface navigationType {
|
||||
ID?: number;
|
||||
icon?: string;
|
||||
name?: string;
|
||||
url?: string;
|
||||
type?: number;
|
||||
type: number;
|
||||
icon: string;
|
||||
name: string;
|
||||
url: string;
|
||||
}
|
||||
|
||||
const swiperList = ref<Array<SwiperList>>([]);
|
||||
|
||||
const bannerList = ref<any[]>([]);
|
||||
|
||||
const popupRefs = ref<Map<number, any>>(new Map());
|
||||
|
||||
const getRef = (el, type) => {
|
||||
popupRefs.value.set(type, el);
|
||||
};
|
||||
|
||||
const popupList = ref([
|
||||
// {
|
||||
// type: 1,
|
||||
// src: require("../../static/index/poppBg.png"),
|
||||
// cb: async (type) => {
|
||||
// await userSign();
|
||||
// Taro.showToast({
|
||||
// title: "签到成功",
|
||||
// icon: "none",
|
||||
// });
|
||||
// popupRefs.value.get(type).show = false;
|
||||
// },
|
||||
// },
|
||||
{
|
||||
type: 2,
|
||||
src: "//upload.jdt168.com/1714381111493034239_game_1.png",
|
||||
cb: (type) => {
|
||||
Taro.setStorageSync(
|
||||
"game_url",
|
||||
`${process.env.TARO_APP_FISH_GAME}${Taro.getStorageSync("token")}`
|
||||
);
|
||||
Taro.navigateTo({
|
||||
url: `/pages/game/view/index`,
|
||||
});
|
||||
popupRefs.value.get(type).show = false;
|
||||
},
|
||||
},
|
||||
]);
|
||||
|
||||
Taro.useDidShow(async () => {
|
||||
await getBannerList();
|
||||
await get_banner_list();
|
||||
});
|
||||
const navigationList = ref<Array<navigationType>>([]);
|
||||
|
||||
Taro.useShareAppMessage(() => ({
|
||||
title: "捷兑通",
|
||||
path: `/pages/index/index?scene=${Taro.getStorageSync("token")}`,
|
||||
imageUrl: "https://upload.jdt168.com/1714375021923881119_Share.jpg",
|
||||
title: '捷兑通',
|
||||
path: `/pages/index/index?scene=${Taro.getStorageSync('token')}`,
|
||||
imageUrl: 'https://upload.jdt168.com/1714375021923881119_Share.jpg',
|
||||
}));
|
||||
|
||||
const getBannerList = async () => {
|
||||
swiperList.value = [
|
||||
{
|
||||
ID: 11224,
|
||||
type: 1,
|
||||
name: "全部服务",
|
||||
url: "/pages/allClassList/index",
|
||||
icon: "//upload.jdt168.com/1702296870765673412_%E5%85%A8%E9%83%A8%E6%9C%8D%E5%8A%A1.png",
|
||||
},
|
||||
{
|
||||
ID: 11225,
|
||||
type: 1,
|
||||
name: "活动游戏",
|
||||
url: `/pages/game/gamehome/index?uid=${Taro.getStorageSync("token")}`,
|
||||
icon: "//jdt168.com/uploads/merchant/20220829/caad6be8983e88c41d28da7d124bc37b.png",
|
||||
},
|
||||
{
|
||||
ID: 11226,
|
||||
type: 1,
|
||||
name: "商户入驻",
|
||||
url: "/pages/users/settled_mer/index",
|
||||
icon: "//jdt168.com/uploads/merchant/20220829/6fe67b93721a42aedc842c4f19d6f2d3.png",
|
||||
},
|
||||
// {
|
||||
// ID: 11227,
|
||||
// type: 1,
|
||||
// name: "最新资讯",
|
||||
// url: "",
|
||||
// icon: "//jdt168.com/uploads/merchant/20220829/b975136a9b64aab69bf11d75a194f1ea.png",
|
||||
// },
|
||||
];
|
||||
const { data } = await getHomeList();
|
||||
if (data.data.length > 0) {
|
||||
for (let i = 0; i < data.data.length; i++) {
|
||||
swiperList.value.push({
|
||||
type: 2,
|
||||
...data.data[i],
|
||||
const searchVal = ref('');
|
||||
const clickSearch = () => {
|
||||
if (!searchVal.value)
|
||||
return Taro.showToast({
|
||||
title: '请输入商家名称再搜索',
|
||||
icon: 'none',
|
||||
});
|
||||
searchVal.value = '';
|
||||
};
|
||||
|
||||
Taro.useLoad(() => {
|
||||
getNavLists();
|
||||
getUserLocal();
|
||||
});
|
||||
|
||||
const address = ref('获取位置中......');
|
||||
|
||||
const getUserLocal = async () => {
|
||||
Taro.getLocation({
|
||||
type: 'wgs84',
|
||||
success: res => {
|
||||
Taro.request({
|
||||
url: `https://apis.map.qq.com/ws/geocoder/v1/?location=${res.latitude},${res.longitude}&key=S3GBZ-WR26O-IXNW2-SXBOD-LZXV6-WAFNO&get_poi=1`,
|
||||
method: 'GET',
|
||||
success: res => {
|
||||
const data = res.data.result.address_component;
|
||||
address.value = `${data.city}${data.district}${data.street_number}`;
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const get_banner_list = async () => {
|
||||
const { data }: any = await getBanner();
|
||||
bannerList.value = data.data;
|
||||
const getNavLists = async () => {
|
||||
navigationList.value = [
|
||||
{
|
||||
type: 1,
|
||||
icon: '//p0.meituan.net/csc/5c770748f0028c63741c5ec14df3cc386715.png',
|
||||
url: '',
|
||||
name: '活动商家',
|
||||
},
|
||||
{
|
||||
type: 1,
|
||||
icon: '//p0.meituan.net/csc/4868c06b99008ff7d5f81e6514858c8a7950.png',
|
||||
url: '',
|
||||
name: '兑换商家',
|
||||
},
|
||||
{
|
||||
type: 1,
|
||||
icon: '//p0.meituan.net/csc/f33ad2443a67e9f3474a1d5fd9d529db7504.png',
|
||||
url: '/pages/users/settled_mer/index',
|
||||
name: '商户入驻',
|
||||
},
|
||||
{
|
||||
type: 1,
|
||||
icon: '//p0.meituan.net/csc/0403cf37dd14a6b44b22ffccaa2878f95703.png',
|
||||
url: '/pages/allClassList/index',
|
||||
name: '全部服务',
|
||||
},
|
||||
];
|
||||
const res = await getHomeList();
|
||||
res.data.data.forEach(item => {
|
||||
navigationList.value.unshift({
|
||||
ID: item.ID,
|
||||
type: 2,
|
||||
icon: item.icon,
|
||||
url: item.url,
|
||||
name: item.name,
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
const toDetails = (item: SwiperList) => {
|
||||
const toPage = item => {
|
||||
item.type !== 1
|
||||
? Taro.navigateTo({
|
||||
url: `/pages/search/index?id=${item.ID}&name=${item.name}`,
|
||||
@@ -175,79 +152,8 @@ const toDetails = (item: SwiperList) => {
|
||||
url: item.url as string,
|
||||
});
|
||||
};
|
||||
|
||||
const toPage = async (url: string) => {
|
||||
// url转对象
|
||||
const obj = parseQueryString(url);
|
||||
if (obj.type === "1") {
|
||||
const { data: res } = await getMerList({});
|
||||
const mer = res.data.filter((item) => item.bid === obj.bid)[0];
|
||||
Taro.setStorageSync("mer_info", mer);
|
||||
}
|
||||
Taro.navigateTo({
|
||||
url,
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.swiper {
|
||||
.nut-swiper {
|
||||
background: #ffffff;
|
||||
|
||||
.nut-swiper-item {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(5, 1fr);
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.banner {
|
||||
padding: 10px;
|
||||
.nut-swiper-item img {
|
||||
border-radius: 26rpx;
|
||||
width: 100%;
|
||||
height: 350px;
|
||||
}
|
||||
}
|
||||
|
||||
.titleImg {
|
||||
margin-top: 10px;
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
box-sizing: border-box;
|
||||
background-image: url("~@/static/index/index-title.png");
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: 50%;
|
||||
text-align: center;
|
||||
line-height: 50px;
|
||||
color: #ff0000;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
background-color: #ffffff;
|
||||
|
||||
.nut-grid-item__content {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
}
|
||||
@import './index.scss';
|
||||
</style>
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
export default definePageConfig({
|
||||
navigationBarTitleText: "",
|
||||
navigationBarTitleText: '',
|
||||
navigationStyle: 'custom',
|
||||
});
|
||||
|
||||
161
src/pages/mer/mer_detail/index.scss
Normal file
161
src/pages/mer/mer_detail/index.scss
Normal file
@@ -0,0 +1,161 @@
|
||||
page {
|
||||
// IOS安全区域
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
-nut-tabs-titles-item-color: #8c8c8c;
|
||||
-nut-tabs-titles-item-active-color: #333333;
|
||||
}
|
||||
|
||||
.head-wrapper {
|
||||
z-index: 999;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: fixed;
|
||||
left: 30px;
|
||||
top: 0;
|
||||
//height: 114px;
|
||||
}
|
||||
|
||||
.head-menu {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 54px;
|
||||
width: 140px;
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
border-radius: 27px;
|
||||
|
||||
.iconfont {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
|
||||
.nut-swiper {
|
||||
height: 550px;
|
||||
}
|
||||
|
||||
.infoBox {
|
||||
background-color: #fff;
|
||||
padding: 30px;
|
||||
border-radius: 25px;
|
||||
position: relative;
|
||||
top: -50px;
|
||||
|
||||
.title {
|
||||
font-size: large;
|
||||
font-weight: bold;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.line {
|
||||
margin: 30px auto;
|
||||
width: 670px;
|
||||
height: 1px;
|
||||
background-color: rgba(240, 240, 240, 1);
|
||||
}
|
||||
|
||||
.bom {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
margin-top: 10px;
|
||||
|
||||
.left {
|
||||
width: 75%;
|
||||
|
||||
.sub {
|
||||
color: #999;
|
||||
font-size: 27px;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
color: #999;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
background-color: #ff0000;
|
||||
color: #fff;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
line-height: 65px;
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
}
|
||||
|
||||
.good-class {
|
||||
.nut-tabs {
|
||||
height: 100vh;
|
||||
// border-top: #fff 10px solid;
|
||||
.nut-tabs__titles {
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
.nut-tab-pane {
|
||||
border-radius: 20px;
|
||||
padding: 25px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.list {
|
||||
.item {
|
||||
display: flex;
|
||||
margin-bottom: 20px;
|
||||
|
||||
image {
|
||||
width: 180px;
|
||||
height: 180px;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
.right {
|
||||
flex: 1;
|
||||
margin-left: 15px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
// text-align: right;
|
||||
|
||||
.stock {
|
||||
margin-top: 10px;
|
||||
color: #8f8f8f;
|
||||
}
|
||||
|
||||
.name {
|
||||
// height: 20px;
|
||||
font-size: 28px;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
overflow: hidden;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.bom {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-end;
|
||||
//margin-top: 10px;
|
||||
|
||||
.price {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #ff0000;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,45 +1,65 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="head-wrapper" :style="{top: BarHeight + 'px'}">
|
||||
<view class="head-menu">
|
||||
<Left class="iconfont" @click="returns" />
|
||||
<Home class="iconfont" @click="goHome" />
|
||||
</view>
|
||||
</view>
|
||||
<!-- 幻灯片 -->
|
||||
<nut-swiper
|
||||
:init-page="0"
|
||||
:pagination-visible="true"
|
||||
:pagination-visible="false"
|
||||
pagination-color="red"
|
||||
auto-play="3000"
|
||||
>
|
||||
auto-play="3000">
|
||||
<nut-swiper-item v-for="(itm, idx) in swiperList" :key="idx">
|
||||
<img
|
||||
style="width: 100%; height: 100%"
|
||||
:src="itm"
|
||||
:alt="idx.toString()"
|
||||
/>
|
||||
:alt="idx.toString()" />
|
||||
</nut-swiper-item>
|
||||
</nut-swiper>
|
||||
<!-- 商家信息 -->
|
||||
<view class="infoBox">
|
||||
<view class="title">{{ mer_info.name }}</view>
|
||||
<view class="title text-[#333333]">{{ mer_info.name }}</view>
|
||||
<view class="flex items-center justify-between mt-3">
|
||||
<nut-rate
|
||||
spacing="1"
|
||||
active-color="rgba(252, 207, 10, 1)"
|
||||
v-model="mer_info.rate" />
|
||||
<view class="text-[#9E9E9E] text-[25px]">销量:10000</view>
|
||||
<view class="text-[#9E9E9E] text-[25px]"
|
||||
>营业时间:{{ mer_info.week_start }}-{{ mer_info.week_end }}</view
|
||||
>
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<view class="bom">
|
||||
<view
|
||||
class="iconfont icon-dizhi text-[#C4C4C4]"
|
||||
style="width: 15px; height: 15px; margin-right: 15px"></view>
|
||||
<view class="left">
|
||||
<view>{{ mer_info.address || "暂无商家地址" }}</view>
|
||||
<view class="sub"
|
||||
>距你{{
|
||||
<view>{{ mer_info.address || '暂无商家地址' }}</view>
|
||||
<view class="sub mt-1"
|
||||
>距离您{{
|
||||
calculateDistance(
|
||||
userLocalNum.t,
|
||||
userLocalNum.l,
|
||||
Number(mer_info.lat),
|
||||
Number(mer_info.lon)
|
||||
Number(mer_info.lon),
|
||||
)
|
||||
}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view @click="clickMap">
|
||||
<Locationg3 color="red" size="25" />
|
||||
<view>导航</view>
|
||||
<image
|
||||
class="w-[50px] h-[50px]"
|
||||
src="http://p1.meituan.net/csc/92ee8512c90527169b44e07fd11d250d924.png" />
|
||||
</view>
|
||||
<view @click="clickPhone">
|
||||
<Find color="red" size="25" />
|
||||
<view>电话</view>
|
||||
<image
|
||||
class="w-[50px] h-[50px]"
|
||||
src="http://p0.meituan.net/csc/ab0493b124a6bb858bf82a2340767c0d919.png" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -53,21 +73,20 @@
|
||||
direction="vertical"
|
||||
title-gutter="5"
|
||||
animated-time="0"
|
||||
name="tabName"
|
||||
>
|
||||
type=""
|
||||
name="tabName">
|
||||
<nut-tab-pane
|
||||
v-for="(itm, index) in good_list"
|
||||
:key="index"
|
||||
:title="itm.name"
|
||||
:pane-key="index"
|
||||
>
|
||||
:pane-key="index">
|
||||
<view v-if="itm.Goods.length > 0">
|
||||
<view class="list" v-for="(item, index) in itm.Goods" :key="index">
|
||||
<view class="item" @click.stop="toGoodDetails(item.gid, 1)">
|
||||
<image :src="item.cover" lazy-load />
|
||||
<view class="right">
|
||||
<view class="name">{{ item.name }}</view>
|
||||
<view class="stock">剩余:{{ item.stock }}</view>
|
||||
<view class="stock text-[25px]">剩余:{{ item.stock }}</view>
|
||||
<view class="bom">
|
||||
<view>
|
||||
<view class="price">
|
||||
@@ -79,15 +98,20 @@
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
<nut-button
|
||||
size="mini"
|
||||
type="primary"
|
||||
@click.stop="add_cart(item)"
|
||||
>
|
||||
<template #icon>
|
||||
<Cart2 />
|
||||
</template>
|
||||
</nut-button>
|
||||
<view class="flex items-center justify-between">
|
||||
<view
|
||||
v-if="item.cartNum > 0"
|
||||
class="btn"
|
||||
@click.stop="add_cart(item, 1)">
|
||||
<Minus />
|
||||
</view>
|
||||
<view v-if="item.cartNum > 0" style="margin: 0 10px">
|
||||
{{ item.cartNum }}
|
||||
</view>
|
||||
<view class="btn" @click.stop="add_cart(item, 2)">
|
||||
<Plus />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -105,18 +129,21 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Taro from "@tarojs/taro";
|
||||
import { Find, Locationg3, Cart2 } from "@nutui/icons-vue-taro";
|
||||
import { Ref, ref } from "vue";
|
||||
import { calculateDistance } from "@/utils";
|
||||
import { getGoodList, getMerCategory } from "@/api/goods";
|
||||
import Cart from "@/components/Cart.vue";
|
||||
import Taro from '@tarojs/taro';
|
||||
import {Cart2, Left, Home, Uploader, Plus, Minus} from '@nutui/icons-vue-taro';
|
||||
import {Ref, ref} from 'vue';
|
||||
import {calculateDistance} from '@/utils';
|
||||
import {getGoodList, getMerCategory} from '@/api/goods';
|
||||
import Cart from '@/components/Cart.vue';
|
||||
|
||||
const statusBarHeight = Taro.getSystemInfoSync()?.statusBarHeight;
|
||||
const BarHeight = ref((statusBarHeight as number) + 6);
|
||||
|
||||
const swiperList = ref([]);
|
||||
|
||||
const mer_info = ref<any>({});
|
||||
|
||||
const value = ref("0");
|
||||
const value = ref('0');
|
||||
|
||||
const userLocalNum = ref({
|
||||
l: 0,
|
||||
@@ -125,17 +152,17 @@ const userLocalNum = ref({
|
||||
|
||||
Taro.useLoad(async () => {
|
||||
Taro.getLocation({
|
||||
type: "wgs84",
|
||||
success: (res) => {
|
||||
type: 'wgs84',
|
||||
success: res => {
|
||||
userLocalNum.value.l = res.longitude;
|
||||
userLocalNum.value.t = res.latitude;
|
||||
},
|
||||
});
|
||||
mer_info.value = Taro.getStorageSync("mer_info");
|
||||
mer_info.value = Taro.getStorageSync('mer_info');
|
||||
Taro.setNavigationBarTitle({
|
||||
title: mer_info.value.name,
|
||||
});
|
||||
swiperList.value = mer_info.value.img.split(",");
|
||||
swiperList.value = mer_info.value.img.split(',');
|
||||
await get_class_list();
|
||||
await cartRef.value.get_cart_list();
|
||||
});
|
||||
@@ -204,7 +231,7 @@ interface CartItems {
|
||||
const good_list = ref<goodList[]>([]);
|
||||
const get_good_list = async (id: number) => {
|
||||
Taro.showLoading({
|
||||
title: "加载中",
|
||||
title: '加载中',
|
||||
mask: true,
|
||||
});
|
||||
const res = await getGoodList({
|
||||
@@ -225,8 +252,14 @@ const toGoodDetails = (id: string, type: number) => {
|
||||
|
||||
const cartRef = ref(null) as Ref;
|
||||
|
||||
const add_cart = (item: GoodsType) => {
|
||||
const num = item.cartNum ? Number(item.cartNum) + 1 : 1;
|
||||
const add_cart = (item: GoodsType, type: number) => {
|
||||
let num = 0;
|
||||
if (type === 1) {
|
||||
num = Number(item.cartNum) - 1;
|
||||
} else {
|
||||
num = item.cartNum ? Number(item.cartNum) + 1 : 1;
|
||||
}
|
||||
|
||||
cartRef.value.add_cart(item, num);
|
||||
};
|
||||
|
||||
@@ -244,115 +277,25 @@ const updateCartNum = (cartItems: CartItems[]) => {
|
||||
} else {
|
||||
good_list.value.forEach((category: goodList) => {
|
||||
category.Goods.forEach((good: GoodsType) => {
|
||||
Reflect.deleteProperty(good, "cartNum");
|
||||
Reflect.deleteProperty(good, 'cartNum');
|
||||
});
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const returns = () => {
|
||||
Taro.navigateBack({
|
||||
delta: 1,
|
||||
});
|
||||
};
|
||||
|
||||
const goHome = () => {
|
||||
Taro.switchTab({
|
||||
url: '/pages/index/index',
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
// IOS安全区域
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
|
||||
.nut-swiper {
|
||||
height: 350px;
|
||||
}
|
||||
|
||||
.infoBox {
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
|
||||
.title {
|
||||
font-size: large;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.bom {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
margin-top: 10px;
|
||||
|
||||
.left {
|
||||
width: 80%;
|
||||
|
||||
.sub {
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
color: #999;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.good-class {
|
||||
margin-top: 10px;
|
||||
|
||||
.nut-tabs {
|
||||
height: 100vh;
|
||||
border-top: #fff 10px solid;
|
||||
}
|
||||
}
|
||||
|
||||
.list {
|
||||
.item {
|
||||
display: flex;
|
||||
margin-bottom: 10px;
|
||||
|
||||
image {
|
||||
width: 180px;
|
||||
height: 180px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.right {
|
||||
flex: 1;
|
||||
margin-left: 5px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
// text-align: right;
|
||||
|
||||
.stock {
|
||||
margin-top: 10px;
|
||||
color: #8f8f8f;
|
||||
}
|
||||
|
||||
.name {
|
||||
// height: 20px;
|
||||
font-size: 28px;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
overflow: hidden;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.bom {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-end;
|
||||
//margin-top: 10px;
|
||||
|
||||
.price {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #ff0000;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@import './index.scss';
|
||||
</style>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
export default definePageConfig({
|
||||
navigationBarTitleText: "个人中心",
|
||||
navigationStyle: "custom",
|
||||
navigationBarTitleText: '个人中心',
|
||||
navigationStyle: 'custom',
|
||||
});
|
||||
|
||||
@@ -1,20 +1,21 @@
|
||||
<template>
|
||||
<view class="app">
|
||||
<view class="appUser">
|
||||
<view
|
||||
class="user-center-card__header__transparent"
|
||||
v-if="isLogin"
|
||||
:style="{ width: isLogin ? '100%' : '70%' }"
|
||||
>
|
||||
<view class="user-center-card__header__avatar">
|
||||
:style="{width: isLogin ? '100%' : '70%'}">
|
||||
<view
|
||||
class="user-center-card__header__avatar"
|
||||
@click="toPage('/pages/users/user_setting/index')">
|
||||
<nut-avatar size="large">
|
||||
<img :src="userInfo.data?.avatarUrl" />
|
||||
</nut-avatar>
|
||||
</view>
|
||||
<view class="user-center-card__header__info">
|
||||
<view
|
||||
class="user-center-card__header__info__name"
|
||||
@click="toPage('/pages/users/user_setting/index')"
|
||||
>{{ userInfo.data?.nickName }}
|
||||
<view
|
||||
class="user-center-card__header__info"
|
||||
@click="toPage('/pages/users/user_setting/index')">
|
||||
<view class="user-center-card__header__info__name"
|
||||
>{{ userInfo.data?.nickName || '点击设置昵称' }}
|
||||
</view>
|
||||
<view v-if="!userInfo.data?.phone">
|
||||
<nut-button
|
||||
@@ -24,27 +25,16 @@
|
||||
>点击绑定手机号
|
||||
</nut-button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="rightIcon">
|
||||
<Scan style="margin-right: 20px" @click="scanCode" size="22" />
|
||||
<button v-if="isLogin" open-type="contact">
|
||||
<Message
|
||||
color="#666666"
|
||||
style="margin-right: 20px"
|
||||
@click="toSetting"
|
||||
size="22"
|
||||
/>
|
||||
</button>
|
||||
|
||||
<Setting style="margin-right: 20px" @click="toSetting" size="22" />
|
||||
<view v-else class="user-center-card__header__info__phone"
|
||||
>{{ maskString(userInfo.data?.phone, 3, 7) }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="user-center-card__header__transparent">
|
||||
<view class="user-center-card__header__avatar">
|
||||
<nut-avatar size="large">
|
||||
<img
|
||||
src="https://img12.360buyimg.com/imagetools/jfs/t1/196430/38/8105/14329/60c806a4Ed506298a/e6de9fb7b8490f38.png"
|
||||
/>
|
||||
src="https://img12.360buyimg.com/imagetools/jfs/t1/196430/38/8105/14329/60c806a4Ed506298a/e6de9fb7b8490f38.png" />
|
||||
</nut-avatar>
|
||||
</view>
|
||||
<view class="user-center-card__header__info">
|
||||
@@ -53,146 +43,155 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="user-acc flex justify-center items-center text-center">
|
||||
<view>
|
||||
<view class="text-[#CFAA32]">豆子</view>
|
||||
<view class="text-[#ffc300] text-[35px] font-bold">{{
|
||||
userInfo.data?.pulse || 0
|
||||
}}</view>
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<view>
|
||||
<view class="text-[#CFAA32]">积分</view>
|
||||
<view class="text-[#ffc300] text-[35px] font-bold">{{
|
||||
userInfo.data?.integral || 0
|
||||
}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="container">
|
||||
<!--我的订单-->
|
||||
<view class="cell-card">
|
||||
<view class="top">
|
||||
<view>我的订单</view>
|
||||
<view class="sub" @click="toOrderList(0)">
|
||||
<view>全部订单</view>
|
||||
<ArrowRight />
|
||||
<view class="border-box bg-[#fff] p-[30px]">
|
||||
<view class="flex justify-between items-center">
|
||||
<view class="text-[#333333]">我的订单</view>
|
||||
<view
|
||||
class="flex text-[#c9c9c9] items-center"
|
||||
@click="toOrderList(0)">
|
||||
<view class="text-[25px]">查看全部</view>
|
||||
<ArrowRight size="10" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="center">
|
||||
<view class="center-t" @click="toOrderList(1)">
|
||||
<!-- <Order size="25px"/> -->
|
||||
<view class="flex justify-between text-[#666] pl-[30px] pr-[30px]">
|
||||
<view
|
||||
class="mt-[30px] flex flex-col items-center"
|
||||
@click="toOrderList(1)">
|
||||
<IconFont
|
||||
name="http://article.biliimg.com/bfs/article/131eda0add8662808d97ffb1191d19bf3e420647.png"
|
||||
size="40"
|
||||
/>
|
||||
<view class="center-text">待付款</view>
|
||||
name="http://p0.meituan.net/csc/9943f6c938fc0e310141a2b99d5bde6617483.png"
|
||||
size="40" />
|
||||
<view class="mt-[15px] text-[25px] text-[#333333]">待付款</view>
|
||||
</view>
|
||||
<view class="center-t" @click="toOrderList(2)">
|
||||
<!-- <Clock size="25px"/> -->
|
||||
<view
|
||||
class="mt-[30px] flex flex-col items-center"
|
||||
@click="toOrderList(2)">
|
||||
<IconFont
|
||||
name="http://article.biliimg.com/bfs/article/002434c9ed4774cb732517eb27e0ff547a41c606.png"
|
||||
size="40"
|
||||
/>
|
||||
<view class="center-text">待使用</view>
|
||||
name="http://p0.meituan.net/csc/5306d094d7b4b61848dd21c86b693a9515523.png"
|
||||
size="40" />
|
||||
<view class="mt-[15px] text-[25px] text-[#333333]">待使用</view>
|
||||
</view>
|
||||
<view class="center-t" @click="toOrderList(3)">
|
||||
<!-- <Shop size="25px"/> -->
|
||||
<view
|
||||
class="mt-[30px] flex flex-col items-center"
|
||||
@click="toOrderList(3)">
|
||||
<IconFont
|
||||
name="http://article.biliimg.com/bfs/article/7c2ca0228180fe5f3b1d74b0043d80e76c42eb7d.png"
|
||||
size="40"
|
||||
/>
|
||||
<view class="center-text">已使用</view>
|
||||
name="http://p0.meituan.net/csc/32ea9bbf51e3bbb0cbd75bc0fea97ca815779.png"
|
||||
size="40" />
|
||||
<view class="mt-[15px] text-[25px] text-[#333333]">已使用</view>
|
||||
</view>
|
||||
<view class="center-t" @click="toOrderList(4)">
|
||||
<!-- <Del size="25px"/> -->
|
||||
<view
|
||||
class="mt-[30px] flex flex-col items-center"
|
||||
@click="toOrderList(4)">
|
||||
<IconFont
|
||||
name="http://article.biliimg.com/bfs/article/c4f4e069dddfa7104f794a46a759a7ed478b81ea.png"
|
||||
size="40"
|
||||
/>
|
||||
<view class="center-text">已失效</view>
|
||||
name="http://p0.meituan.net/csc/2e0dee89e9a3e3f2e7bf65db355fa11c11630.png"
|
||||
size="40" />
|
||||
<view class="mt-[15px] text-[25px] text-[#333333]">已失效</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 我的服务 -->
|
||||
<view class="user-center" v-if="isLogin">
|
||||
<view>我的服务</view>
|
||||
<view class="text-[#333333]">我的服务</view>
|
||||
<view class="box">
|
||||
<view
|
||||
class="box-mini"
|
||||
v-for="(item, idx) in userMenuList"
|
||||
:key="idx"
|
||||
@click="toPage(item.url)"
|
||||
>
|
||||
<!-- <image :src="item.icon" /> -->
|
||||
<IconFont size="40" :name="item.icon"></IconFont>
|
||||
<view class="label">{{ item.label }}</view>
|
||||
<view v-for="(item, idx) in userMenuList" :key="idx">
|
||||
<view
|
||||
v-if="item.type !== 333"
|
||||
class="box-mini"
|
||||
@click="toPage(item.url)">
|
||||
<IconFont size="40" :name="item.icon"></IconFont>
|
||||
<view class="label">{{ item.label }}</view>
|
||||
</view>
|
||||
<button v-else class="kf-btn" open-type="contact">
|
||||
<IconFont class="IconFont" size="40" :name="item.icon"></IconFont>
|
||||
<view class="label">{{ item.label }}</view>
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 商家管理 -->
|
||||
<view
|
||||
class="mer-box"
|
||||
v-if="userInfo.data?.bid && userInfo.store_status === 1"
|
||||
>
|
||||
<nut-grid :gutter="10" :border="false">
|
||||
class="user-center"
|
||||
v-if="userInfo.data?.bid && userInfo.store_status === 1">
|
||||
<view class="text-[#333333]">商家服务</view>
|
||||
<nut-grid :gutter="0" :border="false">
|
||||
<nut-grid-item
|
||||
:border="false"
|
||||
v-if="userInfo.data.permission.dd"
|
||||
text="点单"
|
||||
@click="toPage('/pages/admin/add_order/index')"
|
||||
>
|
||||
@click="toPage('/pages/admin/add_order/index')">
|
||||
<IconFont
|
||||
size="40"
|
||||
:name="require('../../static/user/1-1.png')"
|
||||
></IconFont>
|
||||
name="http://p0.meituan.net/csc/72a389ac6a441061fd534b96644c431b7839.png"></IconFont>
|
||||
</nut-grid-item>
|
||||
<nut-grid-item
|
||||
:border="false"
|
||||
v-if="userInfo.data.permission.hx"
|
||||
text="订单核销"
|
||||
@click="toPage('/pages/admin/verify/index')"
|
||||
>
|
||||
@click="toPage('/pages/admin/verify/index')">
|
||||
<IconFont
|
||||
size="40"
|
||||
:name="require('../../static/user/1-2.png')"
|
||||
></IconFont>
|
||||
name="http://p1.meituan.net/csc/c236a8b7a73178da25218e1fb59a96f06610.png"></IconFont>
|
||||
</nut-grid-item>
|
||||
<nut-grid-item
|
||||
:border="false"
|
||||
v-if="userInfo.data.permission.tj"
|
||||
text="订单统计"
|
||||
@click="toPage('/pages/admin/order_manage/index')"
|
||||
>
|
||||
@click="toPage('/pages/admin/order_manage/index')">
|
||||
<IconFont
|
||||
size="40"
|
||||
:name="require('../../static/user/1-3.png')"
|
||||
></IconFont>
|
||||
name="http://p0.meituan.net/csc/bd9aca457a109b4d69a692a9109a73ed9045.png"></IconFont>
|
||||
</nut-grid-item>
|
||||
<nut-grid-item
|
||||
:border="false"
|
||||
v-if="userInfo.data.permission.tx"
|
||||
text="收益提现"
|
||||
@click="toPage('/pages/admin/withdrawal/index')"
|
||||
>
|
||||
@click="toPage('/pages/admin/withdrawal/index')">
|
||||
<IconFont
|
||||
size="40"
|
||||
:name="require('../../static/user/1-4.png')"
|
||||
></IconFont>
|
||||
name="http://p0.meituan.net/csc/f85d7dc1bf9eda8977e9089b260a586b7440.png"></IconFont>
|
||||
</nut-grid-item>
|
||||
</nut-grid>
|
||||
</view>
|
||||
|
||||
<!-- 版权 -->
|
||||
<!-- <view class="copy">© 2023 </view>-->
|
||||
<view class="text-[#999999] mt-5 text-[20px] text-center">
|
||||
<view>鑫瓴科技版权所有</view>
|
||||
<view>v4.0.0</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 登录 -->
|
||||
<Auth
|
||||
:visible="isShowLogin"
|
||||
@update:visible="cancelLogin"
|
||||
@ok="getUserInfo"
|
||||
/>
|
||||
@ok="getUserInfo" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from "vue";
|
||||
import {
|
||||
ArrowRight,
|
||||
Setting,
|
||||
IconFont,
|
||||
Scan,
|
||||
Message,
|
||||
} from "@nutui/icons-vue-taro";
|
||||
import Taro from "@tarojs/taro";
|
||||
import Auth from "@/components/Auth.vue";
|
||||
import { getPersonalInfo, getPhone, bindParent } from "@/api/user";
|
||||
import {ref} from 'vue';
|
||||
import {ArrowRight, IconFont} from '@nutui/icons-vue-taro';
|
||||
import Taro from '@tarojs/taro';
|
||||
import Auth from '@/components/Auth.vue';
|
||||
import {getPersonalInfo, getPhone, bindParent} from '@/api/user';
|
||||
import {maskString} from '@/utils';
|
||||
|
||||
const isShowLogin = ref(false);
|
||||
|
||||
@@ -207,6 +206,8 @@ interface UserInfo {
|
||||
phone?: string;
|
||||
uid?: string;
|
||||
permission?: any;
|
||||
integral?: string;
|
||||
pulse?: string;
|
||||
};
|
||||
store_status?: number;
|
||||
store_name?: string;
|
||||
@@ -215,20 +216,40 @@ interface UserInfo {
|
||||
const userInfo = ref<UserInfo>({});
|
||||
|
||||
Taro.useDidShow(() => {
|
||||
const token = Taro.getStorageSync("token");
|
||||
init_data();
|
||||
});
|
||||
|
||||
// Taro.startPullDownRefresh({
|
||||
// success: () => {
|
||||
// init_data();
|
||||
// },
|
||||
// complete: () => {
|
||||
// Taro.stopPullDownRefresh();
|
||||
// },
|
||||
// });
|
||||
|
||||
const init_data = () => {
|
||||
const token = Taro.getStorageSync('token');
|
||||
if (token) {
|
||||
getUserInfo();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const test = () => {
|
||||
console.log(process.env.TARO_APP_ID);
|
||||
Taro.openCustomerServiceChat({
|
||||
corpId: 'wwb5dd953ca36043ef',
|
||||
extInfo: {
|
||||
url: 'https://work.weixin.qq.com/kfid/kfcb2b0420e94102346',
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const cancelLogin = () => {
|
||||
isShowLogin.value = false;
|
||||
};
|
||||
|
||||
const getUserInfo = async () => {
|
||||
Taro.showLoading({
|
||||
title: "加载中",
|
||||
});
|
||||
const res = await getPersonalInfo();
|
||||
userInfo.value = {
|
||||
...res.data,
|
||||
@@ -239,10 +260,9 @@ const getUserInfo = async () => {
|
||||
: {},
|
||||
},
|
||||
};
|
||||
Taro.setStorageSync("userInfo", userInfo.value);
|
||||
Taro.setStorageSync('userInfo', userInfo.value);
|
||||
isLogin.value = true;
|
||||
cancelLogin();
|
||||
Taro.hideLoading();
|
||||
};
|
||||
|
||||
const getphonenumber = async (e: any) => {
|
||||
@@ -256,8 +276,8 @@ const getphonenumber = async (e: any) => {
|
||||
const toOrderList = (e: number) => {
|
||||
if (!isLogin.value)
|
||||
return Taro.showToast({
|
||||
title: "请先登录",
|
||||
icon: "none",
|
||||
title: '请先登录',
|
||||
icon: 'none',
|
||||
});
|
||||
Taro.navigateTo({
|
||||
url: `/pages/users/order_list/index?type=${e}`,
|
||||
@@ -266,43 +286,37 @@ const toOrderList = (e: number) => {
|
||||
|
||||
const userMenuList = ref([
|
||||
{
|
||||
label: "后结订单",
|
||||
url: "/pages/users/pending_order/index",
|
||||
icon: require("../../static/user/dd.png"),
|
||||
label: '账户明细',
|
||||
url: '/pages/users/account/index',
|
||||
icon: 'http://p0.meituan.net/csc/104f787b7cc5582868be46ff52475ecf7084.png',
|
||||
},
|
||||
{
|
||||
label: "我的账户",
|
||||
url: "/pages/users/account/index",
|
||||
icon: "http://jdt168.com/uploads/default/20220829/e819815623276fdbb9a54d685292e5c7.png",
|
||||
label: '后结订单',
|
||||
url: '/pages/users/pending_order/index',
|
||||
icon: 'http://p0.meituan.net/csc/68d3f1f1ea375897a2b918851199b6546322.png',
|
||||
},
|
||||
// {
|
||||
// id: 2,
|
||||
// label: "商家入驻",
|
||||
// url: "/pages/users/account/index",
|
||||
// icon: "http://jdt168.com/uploads/default/20220829/583fd6cbd729b24eab9c3cae20ae694d.png",
|
||||
// },
|
||||
{
|
||||
label: "我的推广",
|
||||
url: "/pages/users/distribution/index",
|
||||
icon: "http://jdt168.com/uploads/default/20220829/73656833c1d849c050638f9ee9903b9d.png",
|
||||
label: '我的推广',
|
||||
url: '/pages/users/distribution/index',
|
||||
icon: 'http://p0.meituan.net/csc/950814cc0ed1289f170e8612fab597cd5310.png',
|
||||
},
|
||||
{
|
||||
label: '联系客服',
|
||||
type: 333,
|
||||
url: '/pages/users/account/index',
|
||||
icon: 'http://p0.meituan.net/csc/ddd4b6ff4271ec05ced60db0aee1e9548383.png',
|
||||
},
|
||||
{
|
||||
label: '设置',
|
||||
url: '/pages/users/setting/index',
|
||||
icon: 'http://p0.meituan.net/csc/333f2ec6a76c1fb2e442d277f8b99d5e2853.png',
|
||||
},
|
||||
// {
|
||||
// label: "聚合积分",
|
||||
// url: "/pages/users/integral/index",
|
||||
// icon: require("../../static/jhjf.png"),
|
||||
// },
|
||||
]);
|
||||
|
||||
const toSetting = () => {
|
||||
Taro.navigateTo({
|
||||
url: "/pages/users/setting/index",
|
||||
});
|
||||
};
|
||||
|
||||
const clickLogin = () => {
|
||||
// isShowLogin.value = true
|
||||
Taro.redirectTo({
|
||||
url: "/pages/users/login/index",
|
||||
url: '/pages/users/login/index',
|
||||
});
|
||||
};
|
||||
|
||||
@@ -315,20 +329,20 @@ const toPage = (url: string) => {
|
||||
const scanCode = () => {
|
||||
Taro.scanCode({
|
||||
onlyFromCamera: true,
|
||||
scanType: ["qrCode"],
|
||||
success: async (data) => {
|
||||
scanType: ['qrCode'],
|
||||
success: async data => {
|
||||
try {
|
||||
await bindParent({
|
||||
uid: data.result,
|
||||
});
|
||||
Taro.showToast({
|
||||
title: "绑定成功",
|
||||
icon: "none",
|
||||
title: '绑定成功',
|
||||
icon: 'none',
|
||||
});
|
||||
} catch (error) {
|
||||
Taro.showToast({
|
||||
title: error.msg,
|
||||
icon: "none",
|
||||
icon: 'none',
|
||||
});
|
||||
}
|
||||
},
|
||||
@@ -337,14 +351,15 @@ const scanCode = () => {
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.app {
|
||||
.appUser {
|
||||
box-sizing: border-box;
|
||||
background-color: #f5f5f5;
|
||||
height: 100vh;
|
||||
background-image: url("https://cdn-we-retail.ym.tencent.com/miniapp/template/user-center-bg-v1.png");
|
||||
background-size: auto 40%;
|
||||
background-color: #f8f8f8;
|
||||
height: 100%;
|
||||
background-image: url('http://p0.meituan.net/csc/f44bb11463e3c538c307d7ce4b303bec33520.png');
|
||||
background-size: 100% 500px;
|
||||
background-repeat: no-repeat;
|
||||
position: relative;
|
||||
padding-top: 180px;
|
||||
color: var(--nut-grid-item-text-color, var(--nut-title-color2, #666666));
|
||||
}
|
||||
|
||||
@@ -354,14 +369,16 @@ const scanCode = () => {
|
||||
}
|
||||
}
|
||||
|
||||
.user-center-card__header__info__phone {
|
||||
color: #737373;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.user-center-card__header__transparent {
|
||||
position: absolute;
|
||||
left: 30px;
|
||||
top: 200px;
|
||||
padding-left: 30px;
|
||||
background-color: transparent;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
box-sizing: border-box;
|
||||
text-align: left;
|
||||
padding-right: 20px;
|
||||
@@ -372,55 +389,17 @@ const scanCode = () => {
|
||||
color: #333;
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
.rightIcon {
|
||||
height: 100px;
|
||||
margin: auto;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
// align-items: center;
|
||||
button {
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
background: transparent;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
top: -13px;
|
||||
}
|
||||
|
||||
button::after {
|
||||
border: none;
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.container {
|
||||
position: absolute;
|
||||
top: 350px;
|
||||
width: 710px;
|
||||
top: 500px;
|
||||
}
|
||||
|
||||
.cell-card {
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
border-radius: 20px;
|
||||
margin: 20px;
|
||||
padding: 30px;
|
||||
width: 710px;
|
||||
|
||||
.top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.sub {
|
||||
display: flex;
|
||||
color: #c9c9c9;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.center {
|
||||
display: flex;
|
||||
@@ -443,11 +422,10 @@ const scanCode = () => {
|
||||
|
||||
.user-center {
|
||||
background-color: #fff;
|
||||
border-radius: 20px;
|
||||
margin: 20px;
|
||||
margin: 20px 0px;
|
||||
padding: 20px;
|
||||
width: 710px;
|
||||
box-sizing: border-box;
|
||||
|
||||
-nut-grid-item-text-color: #333;
|
||||
|
||||
.box {
|
||||
margin-top: 20px;
|
||||
@@ -455,18 +433,18 @@ const scanCode = () => {
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
grid-gap: 20px;
|
||||
box-sizing: border-box;
|
||||
line-height: 1.5;
|
||||
|
||||
.box-mini {
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
width: 150px;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
.label {
|
||||
font-size: 25px;
|
||||
margin-top: 10px;
|
||||
color: #333;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
image {
|
||||
@@ -478,10 +456,45 @@ const scanCode = () => {
|
||||
}
|
||||
|
||||
.mer-box {
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
border-radius: 20px;
|
||||
margin: 20px;
|
||||
width: 710px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.user-acc {
|
||||
background-image: url('http://p0.meituan.net/csc/a74c44a7af541f01efbcc6fb023e6e09132712.png');
|
||||
background-size: 100% 100%;
|
||||
background-repeat: no-repeat;
|
||||
width: 95%;
|
||||
height: 150px;
|
||||
margin: 60px auto;
|
||||
|
||||
.line {
|
||||
width: 1px;
|
||||
height: 50px;
|
||||
background-color: #ffc300;
|
||||
margin: 0 100px;
|
||||
}
|
||||
}
|
||||
|
||||
.kf-btn {
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
background: transparent;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
overflow: hidden;
|
||||
font-size: 25px;
|
||||
color: #333333;
|
||||
line-height: 1;
|
||||
|
||||
.IconFont {
|
||||
margin-bottom: 13px;
|
||||
}
|
||||
|
||||
&::after {
|
||||
border: none;
|
||||
background: transparent;
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,3 +1,3 @@
|
||||
export default definePageConfig({
|
||||
navigationBarTitleText: "我的账户",
|
||||
navigationBarTitleText: '账户明细',
|
||||
});
|
||||
|
||||
@@ -1,30 +1,31 @@
|
||||
<script lang="ts" setup>
|
||||
import { computed, ref } from "vue";
|
||||
import Taro from "@tarojs/taro";
|
||||
import * as dayjs from "dayjs";
|
||||
import { getIntegralDetail, getBeanDetail, getGiftRecord } from "@/api/user";
|
||||
import {computed, ref} from 'vue';
|
||||
import Taro from '@tarojs/taro';
|
||||
import * as dayjs from 'dayjs';
|
||||
import {getIntegralDetail, getBeanDetail, getGiftRecord} from '@/api/user';
|
||||
import {TriangleDown} from '@nutui/icons-vue-taro';
|
||||
|
||||
const tabValue = ref(1);
|
||||
|
||||
const tabsList = ref([
|
||||
{
|
||||
title: "兑换明细",
|
||||
title: '兑换明细',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
title: "赠送明细",
|
||||
title: '赠送明细',
|
||||
value: 3,
|
||||
},
|
||||
{
|
||||
title: "豆子明细",
|
||||
title: '豆子明细',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
title: "活动赠送",
|
||||
title: '活动赠送',
|
||||
value: 4,
|
||||
},
|
||||
{
|
||||
title: "聚合积分",
|
||||
title: '聚合积分',
|
||||
value: 5,
|
||||
},
|
||||
]);
|
||||
@@ -33,11 +34,11 @@ const computerType = computed(() => {
|
||||
return (val: number) => {
|
||||
switch (val) {
|
||||
case 5:
|
||||
return "注册赠送";
|
||||
return '注册赠送';
|
||||
case 6:
|
||||
return "签到赠送";
|
||||
return '签到赠送';
|
||||
case 7:
|
||||
return "系统赠送";
|
||||
return '系统赠送';
|
||||
}
|
||||
};
|
||||
});
|
||||
@@ -64,8 +65,12 @@ const data = ref<DataType[]>([]);
|
||||
const userInfo = ref<any>({});
|
||||
|
||||
Taro.useLoad(() => {
|
||||
pickerVal.value = [
|
||||
dayjs().format('YYYY-MM-DD'),
|
||||
dayjs().format('YYYY-MM-DD'),
|
||||
];
|
||||
getList();
|
||||
userInfo.value = Taro.getStorageSync("userInfo");
|
||||
userInfo.value = Taro.getStorageSync('userInfo');
|
||||
});
|
||||
|
||||
const page = ref({
|
||||
@@ -86,12 +91,14 @@ const getList = async () => {
|
||||
PageNum: page.value.PageNum,
|
||||
PageSize: page.value.PageSize,
|
||||
Type: tabValue.value,
|
||||
TimeStart: pickerVal.value[0],
|
||||
TimeEnd: pickerVal.value[1],
|
||||
};
|
||||
if (tabValue.value === 1 || tabValue.value === 3 || tabValue.value === 5) {
|
||||
res = await getBeanDetail(newData);
|
||||
} else if (tabValue.value === 2) {
|
||||
// delete data.value.Type;
|
||||
Reflect.deleteProperty(data.value, "Type");
|
||||
Reflect.deleteProperty(data.value, 'Type');
|
||||
res = await getIntegralDetail(newData);
|
||||
} else if (tabValue.value === 4) {
|
||||
res = await getGiftRecord(newData);
|
||||
@@ -101,41 +108,64 @@ const getList = async () => {
|
||||
} catch (error) {
|
||||
Taro.showToast({
|
||||
title: error.msg,
|
||||
icon: "none",
|
||||
icon: 'none',
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const pickerRef = ref();
|
||||
const showPicker = ref(false);
|
||||
|
||||
const pickerVal = ref<Array<string>>([]);
|
||||
|
||||
const openPicker = () => {
|
||||
showPicker.value = true;
|
||||
pickerRef.value.scrollToDate(dayjs().format('YYYY-MM-DD'));
|
||||
};
|
||||
const choose = e => {
|
||||
pickerVal.value = [e[0][3], e[1][3]];
|
||||
getList();
|
||||
};
|
||||
|
||||
const closePicker = () => {
|
||||
showPicker.value = false;
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<view>
|
||||
<view class="card">
|
||||
<view class="info">
|
||||
<view class="left">
|
||||
<view>
|
||||
<view class="num">豆子: {{ userInfo.data?.pulse }}</view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="num">积分: {{ userInfo.data?.integral }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="tabs-box">
|
||||
<view
|
||||
class="item"
|
||||
v-for="(item, idx) in tabsList"
|
||||
:key="idx"
|
||||
@click="tabChange(item.value)"
|
||||
:style="{
|
||||
backgroundColor: item.value === tabValue ? '#ff0000' : '#F0F0F0',
|
||||
color: item.value === tabValue ? '#fff' : '#333',
|
||||
}">
|
||||
<view>{{ item.title }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<scroll-view scroll-x>
|
||||
<view class="tabs-box">
|
||||
<view
|
||||
v-for="item in tabsList"
|
||||
:key="item.value"
|
||||
@click="tabChange(item.value)"
|
||||
>
|
||||
<view class="text">{{ item.title }}</view>
|
||||
<view
|
||||
class="line"
|
||||
:class="{ lineColor: item.value === tabValue }"
|
||||
></view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<view
|
||||
@click="openPicker"
|
||||
class="pt-[20px] pb-[20px] pl-[25px] text-[30px] text-[#333] flex items-center">
|
||||
<text>时间筛选</text>
|
||||
<TriangleDown size="20px" color="#333" />
|
||||
</view>
|
||||
|
||||
<nut-calendar
|
||||
ref="pickerRef"
|
||||
type="range"
|
||||
title="时间筛选"
|
||||
v-model:visible="showPicker"
|
||||
:default-value="pickerVal"
|
||||
start-date="2023-01-01"
|
||||
end-date="2070-01-01"
|
||||
@close="closePicker"
|
||||
@choose="choose">
|
||||
</nut-calendar>
|
||||
|
||||
<view v-if="data.length > 0">
|
||||
<view v-if="tabValue === 1">
|
||||
@@ -143,7 +173,7 @@ const getList = async () => {
|
||||
<view class="left">
|
||||
<view>订单号: {{ item.oid }}</view>
|
||||
<text class="jf">{{
|
||||
dayjs(item.add_time).format("YYYY/MM/DD mm:ss")
|
||||
dayjs(item.add_time).format('YYYY/MM/DD mm:ss')
|
||||
}}</text>
|
||||
</view>
|
||||
<view class="right">
|
||||
@@ -205,11 +235,11 @@ const getList = async () => {
|
||||
</view>
|
||||
</view>
|
||||
<nut-pagination
|
||||
class="mt-3"
|
||||
v-model="page.PageNum"
|
||||
:total-items="page.ItemCount"
|
||||
:items-per-page="page.PageSize"
|
||||
@change="pageChange"
|
||||
/>
|
||||
@change="pageChange" />
|
||||
</view>
|
||||
<nut-empty v-else description="暂无明细"></nut-empty>
|
||||
</view>
|
||||
@@ -222,95 +252,46 @@ const getList = async () => {
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.card {
|
||||
width: 90%;
|
||||
border-radius: 20px;
|
||||
background-color: #282828;
|
||||
margin: 10px auto;
|
||||
color: #d0a568;
|
||||
padding: 20px;
|
||||
|
||||
.info {
|
||||
.left {
|
||||
height: 200px;
|
||||
text-align: left;
|
||||
margin-left: 50px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
.num {
|
||||
font-weight: bold;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-box {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
// justify-content: space-evenly;
|
||||
align-items: center;
|
||||
height: auto;
|
||||
background-color: #fff;
|
||||
padding: 0 10px;
|
||||
text-align: center;
|
||||
overflow-x: auto;
|
||||
flex-wrap: wrap;
|
||||
padding: 15px;
|
||||
justify-content: space-evenly;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
view {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.text {
|
||||
margin: 10px 0;
|
||||
align-items: center;
|
||||
font-size: large;
|
||||
}
|
||||
|
||||
.line {
|
||||
margin: 0 auto;
|
||||
width: 100px;
|
||||
height: 5px;
|
||||
border-radius: 30px;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
.lineColor {
|
||||
background-color: #ff0000;
|
||||
.item {
|
||||
padding: 10px 20px;
|
||||
font-size: 23px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.card-list {
|
||||
margin: 10px 20px;
|
||||
// margin: 10px 20px;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
border-radius: 10px;
|
||||
padding: 20px;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-size: 25px;
|
||||
|
||||
.jf {
|
||||
color: #8a8a8a;
|
||||
color: #484848;
|
||||
}
|
||||
|
||||
.left {
|
||||
.text {
|
||||
text-align: left;
|
||||
font-weight: bolder;
|
||||
// 超出一行隐藏
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 1;
|
||||
overflow: hidden;
|
||||
word-break: break-word;
|
||||
color: #484848;
|
||||
font-size: large;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
export default definePageConfig({
|
||||
navigationBarTitleText: "我的订单",
|
||||
enablePullDownRefresh: true,
|
||||
});
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
<script lang="ts" setup>
|
||||
import { ref } from "vue";
|
||||
import Taro from "@tarojs/taro";
|
||||
import Pay from "@/components/Pay.vue";
|
||||
import { getActiveOrderList, deleteActiveOrder } from "@/api/goods";
|
||||
import { getOrderStatistics } from "@/api/order";
|
||||
import { getUserPoint } from "@/api/admin";
|
||||
import {ref} from 'vue';
|
||||
import Taro from '@tarojs/taro';
|
||||
import Pay from '@/components/Pay.vue';
|
||||
import {getActiveOrderList, deleteActiveOrder} from '@/api/goods';
|
||||
import {getOrderStatistics} from '@/api/order';
|
||||
import {getUserPoint} from '@/api/admin';
|
||||
|
||||
const tabValue = ref(0);
|
||||
|
||||
@@ -12,27 +12,27 @@ const isShowPay = ref(false);
|
||||
|
||||
const tabsList = ref([
|
||||
{
|
||||
title: "全部",
|
||||
title: '全部',
|
||||
value: 0,
|
||||
num: 0,
|
||||
},
|
||||
{
|
||||
title: "待付款",
|
||||
title: '待付款',
|
||||
value: 1,
|
||||
num: 0,
|
||||
},
|
||||
{
|
||||
title: "待使用",
|
||||
title: '待使用',
|
||||
value: 2,
|
||||
num: 0,
|
||||
},
|
||||
{
|
||||
title: "已使用",
|
||||
title: '已使用',
|
||||
value: 3,
|
||||
num: 0,
|
||||
},
|
||||
{
|
||||
title: "已失效",
|
||||
title: '已失效',
|
||||
value: 4,
|
||||
num: 0,
|
||||
},
|
||||
@@ -70,7 +70,7 @@ interface GoodsItem {
|
||||
|
||||
const orderList = ref<OrderList[]>([]);
|
||||
|
||||
Taro.useLoad((options) => {
|
||||
Taro.useLoad(options => {
|
||||
tabValue.value = Number(options.type);
|
||||
});
|
||||
|
||||
@@ -78,6 +78,12 @@ Taro.useDidShow(() => {
|
||||
getList();
|
||||
});
|
||||
|
||||
// Taro.startPullDownRefresh({
|
||||
// success: () => {
|
||||
// getList();
|
||||
// },
|
||||
// });
|
||||
|
||||
const getList = async () => {
|
||||
try {
|
||||
const res = await getActiveOrderList({
|
||||
@@ -87,10 +93,11 @@ const getList = async () => {
|
||||
} catch (error) {
|
||||
Taro.showToast({
|
||||
title: error.msg,
|
||||
icon: "none",
|
||||
icon: 'none',
|
||||
});
|
||||
}
|
||||
await getTj();
|
||||
// await getTj();
|
||||
// Taro.stopPullDownRefresh();
|
||||
};
|
||||
|
||||
const tabChange = (index: number) => {
|
||||
@@ -100,7 +107,7 @@ const tabChange = (index: number) => {
|
||||
|
||||
const openPay = async (item: OrderList) => {
|
||||
isShowPay.value = true;
|
||||
const user_info = Taro.getStorageSync("userInfo");
|
||||
const user_info = Taro.getStorageSync('userInfo');
|
||||
const data = await getUserPoint({
|
||||
phone: user_info.data.phone,
|
||||
bid: item.Store.bid,
|
||||
@@ -114,8 +121,8 @@ const openPay = async (item: OrderList) => {
|
||||
const errPay = () => {
|
||||
isShowPay.value = false;
|
||||
Taro.showToast({
|
||||
title: "支付失败",
|
||||
icon: "none",
|
||||
title: '支付失败',
|
||||
icon: 'none',
|
||||
});
|
||||
jfInfo.value = {};
|
||||
getList();
|
||||
@@ -123,8 +130,8 @@ const errPay = () => {
|
||||
const closePay = () => {
|
||||
isShowPay.value = false;
|
||||
Taro.showToast({
|
||||
title: "支付取消",
|
||||
icon: "none",
|
||||
title: '支付取消',
|
||||
icon: 'none',
|
||||
});
|
||||
jfInfo.value = {};
|
||||
getList();
|
||||
@@ -137,19 +144,18 @@ const successPay = () => {
|
||||
};
|
||||
|
||||
const toDetail = (item: any) => {
|
||||
Taro.setStorageSync("item", item);
|
||||
Taro.navigateTo({
|
||||
url: `/pages/users/order_list_detail/index?orderId=${item.oid}`,
|
||||
url: `/pages/users/order_list_detail/index?orderId=${item.joint_oid}`,
|
||||
});
|
||||
};
|
||||
|
||||
const delOrder = async (oid: string) => {
|
||||
try {
|
||||
await deleteActiveOrder({ oid });
|
||||
await deleteActiveOrder({oid});
|
||||
} catch (error) {
|
||||
Taro.showToast({
|
||||
title: error.msg,
|
||||
icon: "none",
|
||||
icon: 'none',
|
||||
});
|
||||
}
|
||||
await getList();
|
||||
@@ -179,7 +185,7 @@ const getTj = async () => {
|
||||
} catch (error) {
|
||||
Taro.showToast({
|
||||
title: error.msg,
|
||||
icon: "none",
|
||||
icon: 'none',
|
||||
});
|
||||
}
|
||||
};
|
||||
@@ -187,7 +193,7 @@ const getTj = async () => {
|
||||
|
||||
<template>
|
||||
<view>
|
||||
<view class="topTips">
|
||||
<!-- <view class="topTips">
|
||||
<view>
|
||||
<view style="font-weight: bold">订单信息</view>
|
||||
<view style="font-size: 15px"
|
||||
@@ -198,34 +204,50 @@ const getTj = async () => {
|
||||
</view>
|
||||
</view>
|
||||
<image src="../static/user/order_list_top.png" />
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="tabs-box">
|
||||
<view
|
||||
v-for="item in tabsList"
|
||||
:key="item.value"
|
||||
@click="tabChange(item.value)"
|
||||
>
|
||||
<view class="text">{{ item.title }}</view>
|
||||
<view>{{ item.num }}</view>
|
||||
@click="tabChange(item.value)">
|
||||
<view
|
||||
class="line"
|
||||
:class="{ lineColor: item.value === tabValue }"
|
||||
></view>
|
||||
class="text"
|
||||
:style="{
|
||||
color: tabValue === item.value ? '#000' : '#9C9C9C',
|
||||
}"
|
||||
>{{ item.title }}</view
|
||||
>
|
||||
<!-- <view>{{ item.num }}</view> -->
|
||||
<view class="line" :class="{lineColor: item.value === tabValue}"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="orderList.length > 0">
|
||||
<view class="order-card" v-for="(item, index) in orderList" :key="index">
|
||||
<view
|
||||
class="order-card"
|
||||
v-for="(item, index) in orderList"
|
||||
:key="index"
|
||||
@click="toDetail(item)">
|
||||
<view class="top">
|
||||
<view>{{ item.add_time.slice(0, 19) }}</view>
|
||||
<view style="color: red"
|
||||
<view class="text-[#9C9C9C] text-[25px]">订单号:{{ item.oid }}</view>
|
||||
<view
|
||||
:style="{
|
||||
color:
|
||||
item.status === 0
|
||||
? '#FF850A'
|
||||
: item.status === 1
|
||||
? '#F83D3D'
|
||||
: item.status === 2
|
||||
? '#333333'
|
||||
: '#9C9C9C',
|
||||
}"
|
||||
>{{
|
||||
item.status === 0
|
||||
? "待付款"
|
||||
? '待付款'
|
||||
: item.status === 1
|
||||
? "待使用"
|
||||
? '待使用'
|
||||
: item.status === 2
|
||||
? "已使用"
|
||||
: "已失效"
|
||||
? '已使用'
|
||||
: '已失效'
|
||||
}}
|
||||
</view>
|
||||
</view>
|
||||
@@ -233,43 +255,50 @@ const getTj = async () => {
|
||||
<view class="center" v-for="(itm, idx) in item.OrderGoods" :key="idx">
|
||||
<view class="top">
|
||||
<image :src="itm.Goods.cover" />
|
||||
<view class="title">{{ itm.Goods?.name }}</view>
|
||||
<view class="flex flex-col justify-between flex-1">
|
||||
<view class="title">{{ itm.Goods?.name }}</view>
|
||||
<view class="text-[#F83D3D] mt-5">
|
||||
<view>{{ itm.pay_price }}元</view>
|
||||
<view>{{ itm.pay_integral }}积分</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view>{{ itm.pay_price }}元</view>
|
||||
<view>{{ itm.pay_integral }}积分</view>
|
||||
<view>x{{ itm.number }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<view v-if="item.status !== 0" style="text-align: right">
|
||||
<text>共{{ item.count }}件商品</text>,
|
||||
<!-- <view class="line"></view> -->
|
||||
<view
|
||||
class="flex justify-between items-center mt-2 mb-2 text-[25px]"
|
||||
v-if="item.status !== 0"
|
||||
style="text-align: right">
|
||||
<text class="text-[#9C9C9C]">共{{ item.count }}件商品</text>
|
||||
<text
|
||||
>实付款:{{ item.pay_type === 1 ? item.price : item.exchange }},{{
|
||||
item.pay_type === 1 ? "微信支付" : "积分支付"
|
||||
}}</text
|
||||
>{{ item.status !== 0 ? '实' : '应' }}付款{{
|
||||
item.pay_type === 1 ? '(元): ' : '(积分): '
|
||||
}}{{ item.pay_type === 1 ? item.price : item.exchange }}</text
|
||||
>
|
||||
<view class="line"></view>
|
||||
<!-- <view class="line"></view> -->
|
||||
</view>
|
||||
<view class="btn">
|
||||
<nut-button
|
||||
v-if="item.status === 0"
|
||||
plain
|
||||
size="small"
|
||||
size="mini"
|
||||
type="primary"
|
||||
@click="delOrder(item.oid)"
|
||||
>取消订单
|
||||
</nut-button>
|
||||
<nut-button
|
||||
<!-- <nut-button
|
||||
style="margin-left: 5px"
|
||||
size="small"
|
||||
size="mini"
|
||||
type="primary"
|
||||
@click="toDetail(item)"
|
||||
>查看详情
|
||||
</nut-button>
|
||||
</nut-button> -->
|
||||
<nut-button
|
||||
style="margin-left: 5px"
|
||||
size="small"
|
||||
size="mini"
|
||||
type="primary"
|
||||
v-if="item.status === 0"
|
||||
@click="openPay(item)"
|
||||
@@ -286,8 +315,7 @@ const getTj = async () => {
|
||||
:OrderType="2"
|
||||
@errPay="errPay"
|
||||
@successPay="successPay"
|
||||
@closePay="closePay"
|
||||
/>
|
||||
@closePay="closePay" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@@ -309,8 +337,8 @@ page {
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -319,20 +347,20 @@ page {
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: auto;
|
||||
background-color: #fff;
|
||||
padding: 0 20px;
|
||||
padding: 20px 20px 0 20px;
|
||||
text-align: center;
|
||||
|
||||
.text {
|
||||
margin: 10px 20px;
|
||||
// margin: 10px 20px;
|
||||
align-items: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.line {
|
||||
margin: 0 auto;
|
||||
margin: 10px auto;
|
||||
width: 50px;
|
||||
height: 5px;
|
||||
height: 10px;
|
||||
border-radius: 30px;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
@@ -370,20 +398,20 @@ page {
|
||||
}
|
||||
|
||||
.center {
|
||||
margin-bottom: 10px;
|
||||
// margin-bottom: 10px;
|
||||
.top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
// align-items: flex-start;
|
||||
// justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
|
||||
image {
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
border-radius: 10rpx;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
border-radius: 15px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-left: 10px;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 2;
|
||||
@@ -396,6 +424,7 @@ page {
|
||||
margin-left: 10px;
|
||||
font-size: 28px;
|
||||
text-align: right;
|
||||
color: #9c9c9c;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,79 +1,142 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="p-4">
|
||||
<!-- 步骤条 -->
|
||||
<view class="step-bar">
|
||||
<!-- <view class="step-bar">
|
||||
<view
|
||||
class="item"
|
||||
v-for="item in statusList"
|
||||
:key="item.id"
|
||||
:class="{ activation: item.id === goodInfo.status }"
|
||||
>
|
||||
:class="{activation: item.id === goodInfo.status}">
|
||||
<view class="text">{{ item.text }}</view>
|
||||
<view class="dot"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="goodInfo.status === 1" class="timeBox">
|
||||
</view> -->
|
||||
<!-- <view v-if="goodInfo.status === 1" class="timeBox">
|
||||
订单剩余{{ timeStr }}过期,请尽快核销!
|
||||
</view> -->
|
||||
<view class="mb-3">
|
||||
<view v-if="goodInfo.status === 0">
|
||||
<view class="flex text-[#333333] items-center mb-1">
|
||||
<view class="font-bold">订单待付款</view>
|
||||
<IconFont name="rect-right" size="15" color="#333333"></IconFont>
|
||||
</view>
|
||||
<view class="text-[#9C9C9C] text-[20px]">订单未支付,请付款</view>
|
||||
</view>
|
||||
<view v-if="goodInfo.status === 1">
|
||||
<view class="flex text-[#333333] items-center mb-1">
|
||||
<view class="font-bold">订单待使用</view>
|
||||
<IconFont name="rect-right" size="15" color="#333333"></IconFont>
|
||||
</view>
|
||||
<view class="text-[#9C9C9C] text-[20px]"
|
||||
>订单剩余<text class="text-[#FF0000]">{{ timeStr }}</text
|
||||
>过期,请尽快核销!</view
|
||||
>
|
||||
</view>
|
||||
<view v-if="goodInfo.status === 2">
|
||||
<view class="flex text-[#333333] items-center mb-1">
|
||||
<view class="font-bold">订单已使用</view>
|
||||
<IconFont name="rect-right" size="15" color="#333333"></IconFont>
|
||||
</view>
|
||||
<view class="text-[#9C9C9C] text-[20px]">订单已核销,欢迎下次光临</view>
|
||||
</view>
|
||||
<view v-if="goodInfo.status === 3">
|
||||
<view class="flex text-[#333333] items-center mb-1">
|
||||
<view class="font-bold">订单失效</view>
|
||||
<IconFont name="rect-right" size="15" color="#333333"></IconFont>
|
||||
</view>
|
||||
<view class="text-[#9C9C9C] text-[20px]">未核销,已失效</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 商家信息 -->
|
||||
<view class="mer-info">
|
||||
<view class="left">
|
||||
<view>
|
||||
<text>{{ goodInfo.Store?.name }}</text>
|
||||
<text>{{ goodInfo.Store?.phone }}</text>
|
||||
</view>
|
||||
<nut-ellipsis
|
||||
:rows="2"
|
||||
:content="goodInfo.Store?.address"
|
||||
direction="end"
|
||||
></nut-ellipsis>
|
||||
</view>
|
||||
<image
|
||||
class="w-[150px] h-[150px] rounded-lg mr-2"
|
||||
:src="goodInfo.Store?.head_photo" />
|
||||
<view class="right">
|
||||
<view class="icon" @click="toPhone">
|
||||
<Service />
|
||||
<text>电话</text>
|
||||
<view class="text-[#333333]">{{ goodInfo.Store?.name }}</view>
|
||||
<view
|
||||
class="flex mt-2 items-center text-[#999999] text-[23px] text-ellipsis line-clamp-3">
|
||||
<view
|
||||
style="font-size: 15px"
|
||||
class="iconfont icon-dizhi text-[#C4C4C4]"></view>
|
||||
<view>{{ goodInfo.Store?.address }}</view>
|
||||
</view>
|
||||
<view class="icon" @click="toAdder">
|
||||
<Find />
|
||||
<text>导航</text>
|
||||
<view class="w-full flex items-center justify-between mt-1">
|
||||
<view class="ml-3 text-[23px] text-[#999999]"
|
||||
>距离您{{
|
||||
calculateDistance(
|
||||
userLocalNum.t,
|
||||
userLocalNum.l,
|
||||
Number(goodInfo.Store?.lat),
|
||||
Number(goodInfo.Store?.lon),
|
||||
)
|
||||
}}
|
||||
</view>
|
||||
<view class="flex items-center">
|
||||
<image
|
||||
@tap="toPhone()"
|
||||
class="w-[50px] h-[50px]"
|
||||
src="http://p0.meituan.net/csc/ab0493b124a6bb858bf82a2340767c0d919.png" />
|
||||
<image
|
||||
@tap="toAdder()"
|
||||
class="w-[50px] h-[50px] ml-2"
|
||||
src="http://p1.meituan.net/csc/92ee8512c90527169b44e07fd11d250d924.png" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 订单信息 -->
|
||||
<nut-cell-group>
|
||||
<nut-cell :title="`共${goodInfo.count}件商品`"></nut-cell>
|
||||
<nut-cell>
|
||||
<template #default>
|
||||
<view class="center-box">
|
||||
<view
|
||||
class="top"
|
||||
v-for="(item, index) in goodInfo.OrderGoods"
|
||||
:key="index"
|
||||
>
|
||||
:key="index">
|
||||
<image :src="item.Goods?.cover" />
|
||||
<view class="title">{{ item.Goods?.name }} </view>
|
||||
<view class="flex flex-col justify-between flex-1">
|
||||
<view class="title">{{ item.Goods?.name }}</view>
|
||||
<view class="text-[#F83D3D] mt-5">
|
||||
<view>{{ item.pay_price }}元</view>
|
||||
<view>{{ item.pay_integral }}积分</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view>{{ item.pay_price }}元</view>
|
||||
<view>{{ item.pay_integral }}积分</view>
|
||||
<view>x{{ item.number }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
class="flex justify-between items-center mt-2 mb-2 text-[25px]">
|
||||
<view class="text-[#9C9C9C]">{{
|
||||
`共${goodInfo.count}件商品`
|
||||
}}</view>
|
||||
<text
|
||||
>{{ goodInfo.status !== 0 ? '实' : '应' }}付款{{
|
||||
goodInfo.pay_type === 1 ? '(元): ' : '(积分): '
|
||||
}}{{
|
||||
goodInfo.pay_type === 1 ? goodInfo.price : goodInfo.exchange
|
||||
}}</text
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</nut-cell>
|
||||
</nut-cell-group>
|
||||
<nut-cell-group>
|
||||
<nut-cell title="订单号:" :desc="goodInfo.oid"></nut-cell>
|
||||
<nut-cell
|
||||
title="下单时间:"
|
||||
:desc="goodInfo.add_time?.slice(0, 19)"
|
||||
></nut-cell>
|
||||
<nut-cell
|
||||
:desc="goodInfo.add_time?.slice(0, 19)"></nut-cell>
|
||||
<!-- <nut-cell
|
||||
v-if="goodInfo.expires !== 0"
|
||||
title="订单过期时间:"
|
||||
:desc="dayjs.unix(goodInfo.expires).format('YYYY-MM-DD HH:mm:ss')"
|
||||
></nut-cell>
|
||||
:desc="
|
||||
dayjs.unix(goodInfo.expires).format('YYYY-MM-DD HH:mm:ss')
|
||||
"></nut-cell> -->
|
||||
<nut-cell
|
||||
title="支付状态:"
|
||||
title="订单状态:"
|
||||
:desc="
|
||||
goodInfo.status === 0
|
||||
? '待付款'
|
||||
@@ -82,38 +145,36 @@
|
||||
: goodInfo.status === 2
|
||||
? '已使用'
|
||||
: '已失效'
|
||||
"
|
||||
></nut-cell>
|
||||
<!-- <nut-cell
|
||||
:title="`商品总价(${type === '1' ? '元' : '积分'}):`"
|
||||
:desc="goodInfo.number"
|
||||
>
|
||||
</nut-cell> -->
|
||||
<nut-cell v-if="goodInfo.status !== 0">
|
||||
<template #default>
|
||||
<view style="text-align: right; width: 100%">
|
||||
<view
|
||||
>实付款({{ goodInfo.pay_type === 1 ? "微信" : "积分" }})
|
||||
<nut-price
|
||||
:price="
|
||||
goodInfo.pay_type === 1 ? goodInfo.price : goodInfo.exchange
|
||||
"
|
||||
size="normal"
|
||||
:need-symbol="false"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</nut-cell>
|
||||
"></nut-cell>
|
||||
</nut-cell-group>
|
||||
<view class="btn">
|
||||
<!-- <nut-button
|
||||
|
||||
<view class="mt-[30px] m-auto">
|
||||
<nut-button
|
||||
v-if="goodInfo.status === 0"
|
||||
shape="square"
|
||||
type="primary"
|
||||
block
|
||||
@click="openPay()"
|
||||
>继续付款</nut-button
|
||||
>
|
||||
<nut-button
|
||||
v-if="goodInfo.status === 1"
|
||||
shape="square"
|
||||
type="primary"
|
||||
block
|
||||
@click="openCode()"
|
||||
>出示核销码</nut-button
|
||||
>
|
||||
</view>
|
||||
|
||||
<!-- <view class="btn">
|
||||
<nut-button
|
||||
plain
|
||||
v-if="goodInfo.status === 0"
|
||||
size="small"
|
||||
type="primary"
|
||||
>取消订单
|
||||
</nut-button> -->
|
||||
</nut-button>
|
||||
<nut-button
|
||||
v-if="goodInfo.status === 0"
|
||||
style="margin-left: 5px"
|
||||
@@ -130,19 +191,19 @@
|
||||
@click="openCode()"
|
||||
>出示核销码
|
||||
</nut-button>
|
||||
</view>
|
||||
</view> -->
|
||||
|
||||
<!-- 核销码弹窗 -->
|
||||
<nut-popup
|
||||
v-model:visible="isShowCode"
|
||||
position="bottom"
|
||||
:style="{ height: 'auto' }"
|
||||
position="center"
|
||||
style="padding: 20px; border-radius: 15px"
|
||||
:maskClosable="true"
|
||||
safe-area-inset-bottom
|
||||
@closed="closed"
|
||||
>
|
||||
@click-overlay="closed"
|
||||
@closed="closed">
|
||||
<view class="code-box">
|
||||
<view>请出示核销码核销</view>
|
||||
<view>核销码</view>
|
||||
<image class="qrcode" :src="url"></image>
|
||||
</view>
|
||||
</nut-popup>
|
||||
@@ -153,58 +214,70 @@
|
||||
:OrderType="2"
|
||||
@errPay="errPay"
|
||||
@successPay="successPay"
|
||||
@closePay="closePay"
|
||||
/>
|
||||
@closePay="closePay" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Taro from "@tarojs/taro";
|
||||
import { Find, Service } from "@nutui/icons-vue-taro";
|
||||
import { ref } from "vue";
|
||||
import dayjs from "dayjs";
|
||||
import duration from "dayjs/plugin/duration";
|
||||
import Pay from "@/components/Pay.vue";
|
||||
import { getUserPoint } from "@/api/admin";
|
||||
import Taro from '@tarojs/taro';
|
||||
import {onUnmounted, ref} from 'vue';
|
||||
import dayjs from 'dayjs';
|
||||
import duration from 'dayjs/plugin/duration';
|
||||
import Pay from '@/components/Pay.vue';
|
||||
import {getUserPoint} from '@/api/admin';
|
||||
import {calculateDistance} from '@/utils';
|
||||
import {IconFont} from '@nutui/icons-vue-taro';
|
||||
import {getActiveOrderDetail} from '@/api/goods';
|
||||
|
||||
dayjs.extend(duration);
|
||||
|
||||
const goodInfo = ref<any>({});
|
||||
|
||||
const statusList = ref([
|
||||
{
|
||||
id: 0,
|
||||
text: "待付款",
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
text: "待使用",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
text: "已使用",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
text: "已失效",
|
||||
},
|
||||
]);
|
||||
const userLocalNum = ref({
|
||||
l: 0,
|
||||
t: 0,
|
||||
});
|
||||
|
||||
const isShowCode = ref(false);
|
||||
const isShowPay = ref(false);
|
||||
const jfInfo = ref<any>({});
|
||||
|
||||
const type = ref("");
|
||||
const type = ref('');
|
||||
|
||||
const url = ref("");
|
||||
const url = ref('');
|
||||
|
||||
Taro.useLoad((options) => {
|
||||
const oid = ref('');
|
||||
|
||||
Taro.useLoad(options => {
|
||||
type.value = options.type;
|
||||
goodInfo.value = Taro.getStorageSync("item");
|
||||
oid.value = options.orderId;
|
||||
Taro.getLocation({
|
||||
type: 'wgs84',
|
||||
success: res => {
|
||||
userLocalNum.value.l = res.longitude;
|
||||
userLocalNum.value.t = res.latitude;
|
||||
},
|
||||
});
|
||||
// goodInfo.value = Taro.getStorageSync('item');
|
||||
getOrderDetail();
|
||||
});
|
||||
|
||||
const getOrderDetail = async () => {
|
||||
const res = await getActiveOrderDetail({
|
||||
oid: oid.value,
|
||||
});
|
||||
goodInfo.value = res.data.data;
|
||||
if (goodInfo.value.status === 1) {
|
||||
startTime();
|
||||
}
|
||||
});
|
||||
|
||||
if (goodInfo.value.status === 2 && isShowCode.value) {
|
||||
Taro.showToast({
|
||||
title: '订单核销完成',
|
||||
icon: 'none',
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const toPhone = () => {
|
||||
Taro.makePhoneCall({
|
||||
@@ -222,23 +295,23 @@ const toAdder = () => {
|
||||
|
||||
const openPay = async () => {
|
||||
isShowPay.value = true;
|
||||
const mer_info = Taro.getStorageSync("mer_info");
|
||||
const user_info = Taro.getStorageSync("userInfo");
|
||||
const mer_info = Taro.getStorageSync('mer_info');
|
||||
const user_info = Taro.getStorageSync('userInfo');
|
||||
const data = await getUserPoint({
|
||||
phone: user_info.data.phone,
|
||||
bid: mer_info.bid,
|
||||
});
|
||||
jfInfo.value = {
|
||||
jh_info: data.data,
|
||||
oid: Taro.getStorageSync("item").oid,
|
||||
oid: Taro.getStorageSync('item').oid,
|
||||
};
|
||||
};
|
||||
|
||||
const successPay = (val: boolean) => {
|
||||
isShowPay.value = val;
|
||||
Taro.showToast({
|
||||
title: "支付成功",
|
||||
icon: "none",
|
||||
title: '支付成功',
|
||||
icon: 'none',
|
||||
});
|
||||
Taro.navigateBack({
|
||||
delta: 1,
|
||||
@@ -248,33 +321,40 @@ const successPay = (val: boolean) => {
|
||||
const errPay = () => {
|
||||
isShowPay.value = false;
|
||||
Taro.showToast({
|
||||
title: "支付失败",
|
||||
icon: "none",
|
||||
title: '支付失败',
|
||||
icon: 'none',
|
||||
});
|
||||
jfInfo.value = {};
|
||||
};
|
||||
const closePay = () => {
|
||||
isShowPay.value = false;
|
||||
Taro.showToast({
|
||||
title: "支付取消",
|
||||
icon: "none",
|
||||
title: '支付取消',
|
||||
icon: 'none',
|
||||
});
|
||||
jfInfo.value = {};
|
||||
};
|
||||
|
||||
const t_id = ref();
|
||||
|
||||
const openCode = () => {
|
||||
url.value = `https://api.pwmqr.com/qrcode/create?url=${goodInfo.value.oid}`;
|
||||
isShowCode.value = true;
|
||||
if (goodInfo.value.status === 2) return;
|
||||
t_id.value = setInterval(() => {
|
||||
getOrderDetail();
|
||||
}, 1000);
|
||||
};
|
||||
|
||||
const closed = () => {
|
||||
isShowCode.value = false;
|
||||
url.value = "";
|
||||
url.value = '';
|
||||
clearInterval(t_id.value);
|
||||
};
|
||||
|
||||
let timeId: any;
|
||||
|
||||
const timeStr = ref("????");
|
||||
const timeStr = ref('????');
|
||||
|
||||
const startTime = () => {
|
||||
const nowTime = dayjs();
|
||||
@@ -284,10 +364,10 @@ const startTime = () => {
|
||||
const duration = dayjs.duration(endTime.diff(nowTime));
|
||||
|
||||
// 格式化剩余时间
|
||||
timeStr.value = duration.format("D天H小时m分钟s秒");
|
||||
timeStr.value = duration.format('D天H小时m分钟s秒');
|
||||
|
||||
if (goodInfo.value.expires - dayjs().unix() > 0) {
|
||||
clearInterval(timeId);
|
||||
clearTimeout(timeId);
|
||||
timeId = setTimeout(() => {
|
||||
startTime();
|
||||
}, 1000);
|
||||
@@ -296,6 +376,17 @@ const startTime = () => {
|
||||
|
||||
Taro.useUnload(() => {
|
||||
clearTimeout(timeId);
|
||||
clearInterval(t_id.value);
|
||||
});
|
||||
|
||||
Taro.useDidHide(() => {
|
||||
clearTimeout(timeId);
|
||||
clearInterval(t_id.value);
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
clearTimeout(timeId);
|
||||
clearInterval(t_id.value);
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -349,7 +440,7 @@ page {
|
||||
position: relative;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
content: '';
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
border-radius: 50%;
|
||||
@@ -365,43 +456,20 @@ page {
|
||||
|
||||
.mer-info {
|
||||
background-color: white;
|
||||
padding: 20px 30px;
|
||||
padding: 15px;
|
||||
margin-top: 10px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
justify-content: space-betweenhh;
|
||||
align-items: center;
|
||||
|
||||
.left {
|
||||
width: 50%;
|
||||
|
||||
text {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.address {
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
}
|
||||
}
|
||||
border-radius: 15px;
|
||||
|
||||
.right {
|
||||
color: #858585;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 120px;
|
||||
justify-content: space-between;
|
||||
|
||||
.icon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
//margin-bottom: 20px;
|
||||
}
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -435,6 +503,7 @@ page {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
border-radius: 10rpx;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.title {
|
||||
@@ -466,4 +535,8 @@ page {
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.nut-button {
|
||||
border-radius: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -21,7 +21,8 @@ page {
|
||||
.tabs {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 20px 30px;
|
||||
padding: 20px;
|
||||
background-color: #ffffff;
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
@@ -71,8 +72,8 @@ page {
|
||||
margin: 20px;
|
||||
|
||||
image {
|
||||
width: 195px;
|
||||
height: 195px;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
|
||||
@@ -17,21 +17,18 @@
|
||||
class="item"
|
||||
v-for="item in tabs"
|
||||
:key="item.value"
|
||||
@click="changeTabs(item.value)"
|
||||
>
|
||||
@click="changeTabs(item.value)">
|
||||
<text>{{ item.text }}</text>
|
||||
<view
|
||||
class="line"
|
||||
:class="tabsIndex == item.value ? 'active' : ''"
|
||||
></view>
|
||||
:class="tabsIndex == item.value ? 'active' : ''"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="listData.length > 0">
|
||||
<view
|
||||
class="card"
|
||||
v-for="(item, index) in (listData as any[])"
|
||||
:key="index"
|
||||
>
|
||||
:key="index">
|
||||
<view class="header">
|
||||
<view>
|
||||
<text>台号: {{ item.seat }}</text>
|
||||
@@ -50,11 +47,12 @@
|
||||
<view
|
||||
class="goods-list"
|
||||
v-for="(itm, idx) in item.OrderGoods"
|
||||
:key="idx"
|
||||
>
|
||||
:key="idx">
|
||||
<image :src="itm.Goods.cover"></image>
|
||||
<view class="center">
|
||||
<nut-ellipsis direction="end" :content="itm.Goods.name"></nut-ellipsis>
|
||||
<nut-ellipsis
|
||||
direction="end"
|
||||
:content="itm.Goods.name"></nut-ellipsis>
|
||||
<!-- <view class="title">{{ itm.Goods.name }}</view> -->
|
||||
</view>
|
||||
<view class="num">
|
||||
@@ -76,29 +74,29 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
import Taro from "@tarojs/taro";
|
||||
import { getUserAfterOrderList } from "../../../api/user";
|
||||
import {ref} from 'vue';
|
||||
import Taro from '@tarojs/taro';
|
||||
import {getUserAfterOrderList} from '../../../api/user';
|
||||
|
||||
const tabsIndex = ref(0);
|
||||
|
||||
const listData = ref([]);
|
||||
const listData = ref<any[]>([]);
|
||||
|
||||
const tabs = ref([
|
||||
{
|
||||
text: "全部",
|
||||
text: '全部',
|
||||
value: 0,
|
||||
},
|
||||
{
|
||||
text: "未付款",
|
||||
text: '未付款',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
text: "挂帐中",
|
||||
text: '挂帐中',
|
||||
value: 3,
|
||||
},
|
||||
{
|
||||
text: "已收款",
|
||||
text: '已收款',
|
||||
value: 2,
|
||||
},
|
||||
]);
|
||||
@@ -112,48 +110,66 @@ const changeTabs = (index: number) => {
|
||||
get_list();
|
||||
};
|
||||
|
||||
const pageOpt = ref({
|
||||
page: 1,
|
||||
total: 0,
|
||||
});
|
||||
|
||||
const get_list = async () => {
|
||||
Taro.showLoading({
|
||||
title: "加载中",
|
||||
title: '加载中',
|
||||
});
|
||||
const user_info = await Taro.getStorageSync("userInfo");
|
||||
const { data: res } = await getUserAfterOrderList({
|
||||
const user_info = await Taro.getStorageSync('userInfo');
|
||||
const {data: res} = await getUserAfterOrderList({
|
||||
phone: user_info.data.phone,
|
||||
status: tabsIndex.value,
|
||||
PageNum: pageOpt.value.page,
|
||||
PageSize: 10,
|
||||
});
|
||||
listData.value = res.data || [];
|
||||
listData.value.push(...res.data);
|
||||
pageOpt.value.total = res.total || 0;
|
||||
Taro.hideLoading();
|
||||
};
|
||||
|
||||
const get_color = (status: number) => {
|
||||
switch (status) {
|
||||
case 0:
|
||||
return "#FD0100";
|
||||
return '#FD0100';
|
||||
case 1:
|
||||
return "#03A113";
|
||||
return '#03A113';
|
||||
case 2:
|
||||
return "#FFA938";
|
||||
return '#FFA938';
|
||||
}
|
||||
};
|
||||
|
||||
const get_status_text = (status: number) => {
|
||||
switch (status) {
|
||||
case 0:
|
||||
return "未付款";
|
||||
return '未付款';
|
||||
case 1:
|
||||
return "已付款";
|
||||
return '已付款';
|
||||
case 2:
|
||||
return "挂帐中";
|
||||
return '挂帐中';
|
||||
}
|
||||
};
|
||||
|
||||
const to_page = (item) => {
|
||||
const to_page = item => {
|
||||
Taro.navigateTo({
|
||||
url: `/pages/users/pending_order/pending_order_detail/index?bid=${item.bid}&oid=${item.oid}`,
|
||||
});
|
||||
};
|
||||
|
||||
Taro.useReachBottom(() => {
|
||||
if (pageOpt.value.total === listData.value.length)
|
||||
return Taro.showToast({
|
||||
title: '没有更多数据了',
|
||||
icon: 'none',
|
||||
});
|
||||
pageOpt.value.page++;
|
||||
get_list();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "./index.scss";
|
||||
@import './index.scss';
|
||||
</style>
|
||||
|
||||
@@ -1,12 +1,37 @@
|
||||
<script lang="ts" setup>
|
||||
import Taro from "@tarojs/taro";
|
||||
import Taro from '@tarojs/taro';
|
||||
|
||||
const toPage = (url: string) => {
|
||||
if (url === "1") return Taro.showToast({ title: "暂未开放", icon: "none" });
|
||||
if (url === '1') return Taro.showToast({title: '暂未开放', icon: 'none'});
|
||||
Taro.navigateTo({
|
||||
url: url,
|
||||
});
|
||||
};
|
||||
|
||||
const logOut = () => {
|
||||
Taro.showModal({
|
||||
title: '提示',
|
||||
content: '确定退出登录吗?',
|
||||
success: function (res) {
|
||||
if (res.confirm) {
|
||||
Taro.removeStorageSync('token');
|
||||
Taro.removeStorageSync('userInfo');
|
||||
Taro.removeStorageSync('mer_type');
|
||||
Taro.reLaunch({
|
||||
url: '/pages/index/index',
|
||||
});
|
||||
} else if (res.cancel) {
|
||||
console.log('用户点击取消');
|
||||
}
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const clickText = (type: number, text: string) => {
|
||||
Taro.navigateTo({
|
||||
url: `/pages/users/user_agreement/index?type=${type}&name=${text}`,
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -15,13 +40,24 @@ const toPage = (url: string) => {
|
||||
<nut-cell
|
||||
title="个人信息"
|
||||
is-link
|
||||
@click="toPage('/pages/users/user_setting/index')"
|
||||
></nut-cell>
|
||||
<!-- <nut-cell title="关于我们" is-link @click="toPage('1')"></nut-cell>
|
||||
<nut-cell title="资质证明" is-link @click="toPage('1')"></nut-cell>
|
||||
<nut-cell title="协议规则" is-link @click="toPage('1')"></nut-cell>
|
||||
<nut-cell title="隐私设置" is-link @click="toPage('1')"></nut-cell> -->
|
||||
@click="toPage('/pages/users/user_setting/index')"></nut-cell>
|
||||
<nut-cell title="服务协议" is-link @click="clickText(1, '用户协议')"></nut-cell>
|
||||
<nut-cell title="隐私政策协议" is-link @click="clickText(2, '隐私政策')"></nut-cell>
|
||||
<nut-cell
|
||||
title="平台积分使用规则"
|
||||
is-link
|
||||
@click="clickText(3, '积分使用规则')"></nut-cell>
|
||||
</nut-cell-group>
|
||||
<view class="w-[90%] m-auto">
|
||||
<nut-button
|
||||
block
|
||||
type="primary"
|
||||
shape="square"
|
||||
style="border-radius: 10px"
|
||||
@click="logOut"
|
||||
>退出登录</nut-button
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -1,45 +1,25 @@
|
||||
<script lang="ts" setup>
|
||||
import Taro from "@tarojs/taro";
|
||||
import { ref } from "vue";
|
||||
import { editPersonalInfo } from "@/api/user";
|
||||
import { View } from "@tarojs/components";
|
||||
import { BASE_URL } from "@/utils/request";
|
||||
import Taro from '@tarojs/taro';
|
||||
import {ref} from 'vue';
|
||||
import {editPersonalInfo} from '@/api/user';
|
||||
import {BASE_URL} from '@/utils/request';
|
||||
|
||||
// const toPage = (e: string) => {};
|
||||
|
||||
const userInfo = ref<any>({});
|
||||
|
||||
Taro.useLoad(() => {
|
||||
const { data: data } = Taro.getStorageSync("userInfo");
|
||||
const {data: data} = Taro.getStorageSync('userInfo');
|
||||
userInfo.value = data;
|
||||
});
|
||||
|
||||
const logOut = () => {
|
||||
Taro.showModal({
|
||||
title: "提示",
|
||||
content: "确定退出登录吗?",
|
||||
success: function (res) {
|
||||
if (res.confirm) {
|
||||
Taro.removeStorageSync("token");
|
||||
Taro.removeStorageSync("userInfo");
|
||||
Taro.removeStorageSync("mer_type");
|
||||
Taro.reLaunch({
|
||||
url: "/pages/index/index",
|
||||
});
|
||||
} else if (res.cancel) {
|
||||
console.log("用户点击取消");
|
||||
}
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const chooseavatar = (e: any) => {
|
||||
Taro.uploadFile({
|
||||
url: `${BASE_URL}/upload`,
|
||||
filePath: e.detail.avatarUrl,
|
||||
name: "file",
|
||||
name: 'file',
|
||||
header: {
|
||||
token: Taro.getStorageSync("token"),
|
||||
token: Taro.getStorageSync('token'),
|
||||
},
|
||||
success: function (res) {
|
||||
const data = JSON.parse(res.data);
|
||||
@@ -53,65 +33,48 @@ const subUser = async () => {
|
||||
const reg = /^1(3\d|4[5-9]|5[0-35-9]|6[567]|7[0-8]|8\d|9[0-35-9])\d{8}$/;
|
||||
if (!reg.test(userInfo.value.phone))
|
||||
return Taro.showToast({
|
||||
title: "请输入正确的手机号码",
|
||||
icon: "none",
|
||||
title: '请输入正确的手机号码',
|
||||
icon: 'none',
|
||||
});
|
||||
const res = await editPersonalInfo(userInfo.value);
|
||||
Taro.showToast({
|
||||
title: res.msg,
|
||||
icon: "none",
|
||||
icon: 'none',
|
||||
});
|
||||
Taro.switchTab({
|
||||
url: "/pages/user/index",
|
||||
url: '/pages/user/index',
|
||||
});
|
||||
} catch (error) {
|
||||
Taro.showToast({
|
||||
title: error.msg,
|
||||
icon: "none",
|
||||
icon: 'none',
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
// const getUserInfo = async () => {
|
||||
// try {
|
||||
// const res = await getPersonalInfo();
|
||||
// userInfo.value = res.data.data;
|
||||
// } catch (error) {
|
||||
// Taro.showToast({
|
||||
// title: error.msg,
|
||||
// icon: "none",
|
||||
// });
|
||||
// }
|
||||
// };
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<view class="app">
|
||||
<view class="user-card">
|
||||
<view>管理我的账号</view>
|
||||
<!-- {{ userInfo }} -->
|
||||
<view class="avatar-card">
|
||||
<view class="left">
|
||||
<nut-button open-type="chooseAvatar" @chooseavatar="chooseavatar">
|
||||
<nut-cell-group>
|
||||
<nut-cell title="头像">
|
||||
<template v-slot:link>
|
||||
<nut-button
|
||||
style="border: none; height: auto; padding: 0"
|
||||
open-type="chooseAvatar"
|
||||
@chooseavatar="chooseavatar">
|
||||
<nut-avatar size="large">
|
||||
<img style="border-radius: 50%" :src="userInfo.avatarUrl" />
|
||||
</nut-avatar>
|
||||
</nut-button>
|
||||
|
||||
<view class="name">{{ userInfo.nickName }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<nut-cell-group>
|
||||
<!-- :desc="userInfo.nickName" -->
|
||||
</nut-button> </template
|
||||
></nut-cell>
|
||||
<nut-cell title="昵称">
|
||||
<template v-slot:link>
|
||||
<nut-input
|
||||
type="nickname"
|
||||
v-model="userInfo.nickName"
|
||||
:border="false"
|
||||
input-align="right"
|
||||
placeholder="请输入昵称"
|
||||
/> </template
|
||||
placeholder="请输入昵称" /> </template
|
||||
></nut-cell>
|
||||
<nut-cell title="手机号码">
|
||||
<template v-slot:link>
|
||||
@@ -119,27 +82,30 @@ const subUser = async () => {
|
||||
v-model="userInfo.phone"
|
||||
:border="false"
|
||||
input-align="right"
|
||||
disabled
|
||||
/>
|
||||
disabled />
|
||||
</template>
|
||||
</nut-cell>
|
||||
<nut-cell title="登录密码">
|
||||
<!-- <nut-cell title="登录密码">
|
||||
<template v-slot:link>
|
||||
<nut-input
|
||||
v-model="userInfo.password"
|
||||
:border="false"
|
||||
input-align="right"
|
||||
placeholder="修改登录密码"
|
||||
/>
|
||||
placeholder="修改登录密码" />
|
||||
</template>
|
||||
</nut-cell>
|
||||
<nut-cell title="注销账号" desc="账号注销后不能恢复" is-link> </nut-cell>
|
||||
</nut-cell> -->
|
||||
<nut-cell title="交易密码" desc="创建/修改交易密码" is-link> </nut-cell>
|
||||
<!-- <nut-cell title="注销账号" desc="账号注销后不能恢复" is-link> </nut-cell> -->
|
||||
</nut-cell-group>
|
||||
<view class="btn">
|
||||
<nut-button block @click="subUser">保存信息</nut-button>
|
||||
</view>
|
||||
<view class="btn">
|
||||
<nut-button block type="primary" @click="logOut">退出登录</nut-button>
|
||||
<nut-button
|
||||
shape="square"
|
||||
style="border-radius: 10px"
|
||||
type="primary"
|
||||
block
|
||||
@click="subUser"
|
||||
>保存信息</nut-button
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user