2024-06-03 01:09:01 +08:00
|
|
|
<template>
|
2024-06-17 18:16:46 +08:00
|
|
|
<pb-layout
|
|
|
|
navbar="inner"
|
|
|
|
iconColor="#fff"
|
|
|
|
class="share-point-wrap"
|
|
|
|
leftIcon="leftIcon"
|
|
|
|
color="#fff"
|
|
|
|
title="分发积分"
|
|
|
|
right="历史积分"
|
|
|
|
:bgStyle="bgStyle"
|
|
|
|
>
|
|
|
|
<view class="title ss-m-t-80">
|
|
|
|
<view class="main">分发积分</view>
|
|
|
|
<view class="sub ss-flex ss-row-center ss-m-t-55"
|
|
|
|
><text style="color: #f3d3bf" class="cicon-safe"></text>订单多多·出单多多<text
|
|
|
|
style="color: #f3d3bf"
|
|
|
|
class="cicon-safe"
|
|
|
|
></text
|
|
|
|
></view>
|
2024-06-03 01:09:01 +08:00
|
|
|
</view>
|
|
|
|
|
2024-06-17 18:16:46 +08:00
|
|
|
<view class="user-search">
|
|
|
|
<view class="search">
|
|
|
|
<uni-easyinput
|
|
|
|
v-model="state.inputData"
|
|
|
|
:styles="{ backgroundColor: 'transparent', color: '#E7B493' }"
|
|
|
|
placeholderStyle="color: #E7B493;"
|
|
|
|
@input="inputUserFunc"
|
|
|
|
:clearable="false"
|
|
|
|
:inputBorder="false"
|
|
|
|
trim="all"
|
|
|
|
suffixIcon="search"
|
|
|
|
placeholder="请输入用户名/手机号"
|
|
|
|
/>
|
|
|
|
</view>
|
|
|
|
<view class="result" :style="{ height: resultHeight, overflow: 'auto' }">
|
|
|
|
<view v-for="item in state.userList" class="user ss-flex ss-row-between ss-col-center">
|
|
|
|
<view class="user-info ss-flex ss-col-center ss-gap-20">
|
|
|
|
<image
|
|
|
|
style="width: 48rpx; height: 48rpx; border-radius: 50%"
|
|
|
|
:src="item.avatar ? item.avatar : '/static/default_avatar.png'"
|
|
|
|
/>
|
|
|
|
<view class="nickname">{{ item.nickname }}</view>
|
|
|
|
</view>
|
|
|
|
<view class="input-point">
|
|
|
|
<uni-easyinput
|
|
|
|
:styles="{ backgroundColor: 'transparent', color: '#E7B493' }"
|
|
|
|
:placeholderStyle="placeholderStyle"
|
|
|
|
v-model="item.point"
|
|
|
|
:clearable="false"
|
|
|
|
:inputBorder="false"
|
|
|
|
@input="inputPointFunc(item)"
|
|
|
|
type="number"
|
|
|
|
trim="all"
|
|
|
|
placeholder="请输入积分额度"
|
|
|
|
/>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
|
|
|
|
<view class="ss-p-x-30 bottom">
|
|
|
|
<button class="ss-reset-button share-btn" @tap="confirmShare">确定</button>
|
|
|
|
</view>
|
|
|
|
</pb-layout>
|
2024-06-03 01:09:01 +08:00
|
|
|
</template>
|
|
|
|
|
|
|
|
<script setup>
|
|
|
|
import { ref, computed } from 'vue'
|
2024-06-17 18:16:46 +08:00
|
|
|
import PointApi from '@/peach/api/pay/point'
|
|
|
|
import UserUtil from '@/peach/api/member/user'
|
2024-06-03 01:09:01 +08:00
|
|
|
import peach from '@/peach'
|
|
|
|
|
|
|
|
const placeholderStyle = ref('color: #E7B493')
|
|
|
|
|
|
|
|
const resultHeight = computed(() => {
|
2024-06-17 18:16:46 +08:00
|
|
|
return `calc(100vh - 728rpx)`
|
2024-06-03 01:09:01 +08:00
|
|
|
})
|
|
|
|
|
|
|
|
const state = ref({
|
2024-06-17 18:16:46 +08:00
|
|
|
inputData: '',
|
|
|
|
userList: [],
|
|
|
|
isShaking: false,
|
|
|
|
agreeStatus: false,
|
|
|
|
userParams: {
|
|
|
|
mobile: '',
|
|
|
|
nickname: '',
|
|
|
|
pageNo: 1,
|
|
|
|
pageSize: 10,
|
|
|
|
},
|
|
|
|
pointParams: {
|
|
|
|
memberId: '',
|
|
|
|
point: '',
|
|
|
|
},
|
2024-06-03 01:09:01 +08:00
|
|
|
})
|
|
|
|
|
|
|
|
const bgStyle = {
|
2024-06-17 18:16:46 +08:00
|
|
|
backgroundImage: '/static/point.png',
|
|
|
|
imageType: 'local',
|
|
|
|
backgroundColor: '#fff',
|
|
|
|
description: '',
|
|
|
|
height: '100%',
|
2024-06-03 01:09:01 +08:00
|
|
|
}
|
|
|
|
|
2024-06-17 18:16:46 +08:00
|
|
|
let timer
|
|
|
|
function inputUserFunc() {
|
|
|
|
clearTimeout(timer)
|
|
|
|
timer = setTimeout(() => {
|
|
|
|
getUserList()
|
|
|
|
}, 1000)
|
|
|
|
}
|
2024-06-03 01:09:01 +08:00
|
|
|
|
2024-06-17 18:16:46 +08:00
|
|
|
async function confirmShare() {
|
2024-06-19 18:15:02 +08:00
|
|
|
let user = state.value.userList.find((item) => item.point)
|
|
|
|
|
|
|
|
if (!user) {
|
2024-06-17 18:16:46 +08:00
|
|
|
peach.$helper.toast('请输入要赠送的积分')
|
|
|
|
return
|
|
|
|
}
|
2024-06-19 18:15:02 +08:00
|
|
|
|
|
|
|
state.value.pointParams.memberId = user.id
|
|
|
|
state.value.pointParams.point = user.point
|
|
|
|
|
2024-06-17 18:16:46 +08:00
|
|
|
await PointApi.sendPoint(state.value.pointParams)
|
|
|
|
|
2024-06-19 18:15:02 +08:00
|
|
|
state.value.inputData = ''
|
|
|
|
state.value.userList = []
|
|
|
|
state.value.pointParams = {
|
|
|
|
memberId: '',
|
|
|
|
point: '',
|
|
|
|
}
|
2024-06-03 01:09:01 +08:00
|
|
|
}
|
|
|
|
|
2024-06-17 18:16:46 +08:00
|
|
|
function inputPointFunc(data) {
|
|
|
|
state.value.userList.forEach((item) => {
|
2024-06-19 18:15:02 +08:00
|
|
|
console.log(data.id !== item.id)
|
|
|
|
if (data.id !== item.id) {
|
|
|
|
item.point = ''
|
|
|
|
}
|
2024-06-17 18:16:46 +08:00
|
|
|
})
|
2024-06-03 01:09:01 +08:00
|
|
|
|
2024-06-19 18:15:02 +08:00
|
|
|
// state.value.pointParams.memberId = data.id
|
|
|
|
// state.value.pointParams.point = data.point
|
2024-06-17 18:16:46 +08:00
|
|
|
}
|
2024-06-03 01:09:01 +08:00
|
|
|
|
2024-06-17 18:16:46 +08:00
|
|
|
async function getUserList() {
|
|
|
|
// 清空 userParams 数据
|
|
|
|
state.value.userParams = {
|
|
|
|
mobile: '',
|
|
|
|
nickname: '',
|
|
|
|
pageNo: 1,
|
|
|
|
pageSize: 10,
|
|
|
|
}
|
|
|
|
// 判断 inputData 的输入类型
|
|
|
|
// 如果 string 是纯数字
|
|
|
|
if (/^\d+$/.test(state.value.inputData)) {
|
|
|
|
state.value.userParams.mobile = state.value.inputData
|
|
|
|
} else {
|
|
|
|
state.value.userParams.nickname = state.value.inputData
|
2024-06-03 01:09:01 +08:00
|
|
|
}
|
|
|
|
|
2024-06-17 18:16:46 +08:00
|
|
|
let { data } = await UserUtil.getUserList(state.value.userParams)
|
|
|
|
data.list.forEach((item) => {
|
|
|
|
item.point = ''
|
|
|
|
})
|
|
|
|
state.value.userList = data.list
|
|
|
|
}
|
|
|
|
</script>
|
2024-06-03 01:09:01 +08:00
|
|
|
|
2024-06-17 18:16:46 +08:00
|
|
|
<style lang="scss" scoped>
|
|
|
|
.share-point-wrap {
|
|
|
|
.title {
|
|
|
|
.main {
|
|
|
|
font-size: 80rpx;
|
|
|
|
color: rgba(232, 181, 150, 1);
|
|
|
|
letter-spacing: 20px;
|
|
|
|
position: relative;
|
|
|
|
left: 10px;
|
|
|
|
text-align: center;
|
|
|
|
}
|
2024-06-03 01:09:01 +08:00
|
|
|
|
2024-06-17 18:16:46 +08:00
|
|
|
.sub {
|
|
|
|
font-size: 32rpx;
|
|
|
|
color: #f3d3bf;
|
|
|
|
letter-spacing: 4px;
|
|
|
|
}
|
2024-06-03 01:09:01 +08:00
|
|
|
}
|
|
|
|
|
2024-06-17 18:16:46 +08:00
|
|
|
.user-search {
|
|
|
|
margin: 50rpx 40rpx 0;
|
2024-06-03 01:09:01 +08:00
|
|
|
|
2024-06-17 18:16:46 +08:00
|
|
|
.search {
|
|
|
|
border: 1px solid #e7b493;
|
|
|
|
border-radius: 30px;
|
|
|
|
}
|
2024-06-03 01:09:01 +08:00
|
|
|
|
2024-06-17 18:16:46 +08:00
|
|
|
:deep(.uniui-search) {
|
|
|
|
color: #e7b493 !important;
|
|
|
|
padding-right: 10px;
|
|
|
|
}
|
2024-06-03 01:09:01 +08:00
|
|
|
|
2024-06-17 18:16:46 +08:00
|
|
|
:deep(.uni-easyinput__content-input) {
|
|
|
|
padding-left: 15px !important;
|
2024-06-03 01:09:01 +08:00
|
|
|
}
|
|
|
|
|
2024-06-17 18:16:46 +08:00
|
|
|
.result {
|
|
|
|
.user {
|
|
|
|
margin-top: 20px;
|
|
|
|
border: 1px solid #e7b493;
|
|
|
|
border-radius: 30px;
|
|
|
|
padding: 0 40rpx;
|
|
|
|
|
|
|
|
.user-info {
|
|
|
|
.nickname {
|
|
|
|
font-size: 26rpx;
|
|
|
|
color: #e7b493;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.input-point {
|
|
|
|
:deep(.uni-easyinput__content-input) {
|
|
|
|
text-align: right;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2024-06-03 01:09:01 +08:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2024-06-17 18:16:46 +08:00
|
|
|
.bottom {
|
|
|
|
position: absolute;
|
|
|
|
bottom: 20px;
|
|
|
|
width: calc(100% - 60rpx);
|
2024-06-03 01:09:01 +08:00
|
|
|
|
2024-06-17 18:16:46 +08:00
|
|
|
.share-btn {
|
|
|
|
height: 82rpx;
|
|
|
|
line-height: normal;
|
|
|
|
background: linear-gradient(-90deg, rgba(230, 179, 147, 1), rgba(250, 232, 218, 1));
|
|
|
|
border-radius: 28rpx;
|
|
|
|
font-size: 26rpx;
|
|
|
|
font-weight: 500;
|
|
|
|
}
|
|
|
|
}
|
2024-06-03 01:09:01 +08:00
|
|
|
}
|
2024-06-17 18:16:46 +08:00
|
|
|
</style>
|