124 lines
3.0 KiB
Vue
124 lines
3.0 KiB
Vue
<template>
|
|
<pb-layout navbar="inner" iconColor="#fff" class="share-point-wrap" leftIcon="leftIcon" color="#fff" title="分发积分"
|
|
: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>
|
|
</view>
|
|
|
|
<view class="user-search">
|
|
<view class="search">
|
|
<uni-easyinput :styles="{ backgroundColor: 'transparent', color: '#E7B493' }" placeholderStyle="color: #E7B493;"
|
|
:clearable="false" :inputBorder="false" type="number" trim="all" suffixIcon="search" placeholder="请输入用户名" />
|
|
</view>
|
|
<view class="result" :style="{ height: resultHeight, overflow: 'auto' }">
|
|
<view v-for="item in 10" 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;" src="/static/default_avatar.png" />
|
|
<view class="nickname">哈哈哈</view>
|
|
</view>
|
|
<view class="input-point">
|
|
<uni-easyinput :styles="{ backgroundColor: 'transparent', color: '#E7B493' }"
|
|
:placeholderStyle="placeholderStyle" :clearable="false" :inputBorder="false" type="number" trim="all"
|
|
placeholder="请输入积分额度" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</pb-layout>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, computed } from 'vue'
|
|
import peach from '@/peach'
|
|
|
|
const placeholderStyle = ref('color: #E7B493')
|
|
|
|
const resultHeight = computed(() => {
|
|
return `calc(100vh - 728rpx)`
|
|
})
|
|
|
|
|
|
const state = ref({
|
|
isShaking: false,
|
|
agreeStatus: false,
|
|
})
|
|
|
|
const bgStyle = {
|
|
backgroundImage: '/static/point.png',
|
|
imageType: 'local',
|
|
backgroundColor: '#fff',
|
|
description: '',
|
|
}
|
|
|
|
function onProtocol(title) {
|
|
|
|
}
|
|
</script>
|
|
|
|
<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;
|
|
}
|
|
|
|
.sub {
|
|
font-size: 32rpx;
|
|
color: #f3d3bf;
|
|
letter-spacing: 4px;
|
|
}
|
|
}
|
|
|
|
.user-search {
|
|
margin: 50rpx 40rpx 0;
|
|
|
|
.search {
|
|
border: 1px solid #E7B493;
|
|
border-radius: 30px;
|
|
}
|
|
|
|
:deep(.uniui-search) {
|
|
color: #E7B493 !important;
|
|
padding-right: 10px;
|
|
}
|
|
|
|
:deep(.uni-easyinput__content-input) {
|
|
padding-left: 15px !important;
|
|
}
|
|
|
|
.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;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
</style> |