first

pagesCreateOrder/choose-user/choose-user.vue

@@ -0,0 +1,144 @@
+<template>
+	<view class="page-gray u-font-28">
+		<view class="search bg-fff u-flex u-col-center ">
+			<view class="u-flex-1">
+				<uni-search-bar bgColor="#F9F9F9" cancelButton="none" placeholder="搜索" @confirm="search" :focus="true"
+					v-model="query.name">
+				</uni-search-bar>
+			</view>
+			<view class="u-flex">
+				<image src="/pagesCreateOrder/static/images/icon-saoma.svg" class="icon-saoma" mode=""></image>
+			</view>
+		</view>
+		<view class="list ">
+			<view class="bg-fff u-row-between u-flex no-choose border-r-12" @tap="chooseUser">
+				<view>不选择用户</view>
+				<my-radio v-model="nouser" :size="18" border-color="#d1d1d1" @change="chooseUser"></my-radio>
+			</view>
+			<view class="u-m-t-32 bg-fff box bg-fff">
+				<view class="u-flex item u-row-between" v-for="(item,index) in list" :key="index" @tap="chooseUser(index,item)">
+					<view class="u-flex">
+						<view class="headimg u-flex u-row-center u-col-center">
+							<image v-if="item.headImg" :src="item.headImg" class="img" mode=""></image>
+						</view>
+						<view class="u-m-l-32">
+							<view>{{item.nickName}}</view>
+							<view class=" u-font-24 u-m-t-12 u-flex">
+								<text class="color-999" v-if="!item.isVip">非会员</text>
+								<text class="color-main" v-else>会员</text>
+								<view class="u-m-l-30 u-flex">
+									<text class="">余额：</text>
+									<text class="color-main">{{item.amount}}</text>
+								</view>
+								<view class="u-m-l-30 u-flex">
+									<text class="">积分：</text>
+									<text class="color-main">{{item.totalScore}}</text>
+								</view>
+							</view>
+						</view>
+					</view>
+					<my-radio @change="chooseUser(index,item)" v-model="item.checked" :size="18" border-color="#d1d1d1"></my-radio>
+				</view>
+			</view>
+			
+
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import * as Api from '@/http/yskApi/shop-user.js'  
+	import {onLoad} from '@dcloudio/uni-app'
+	import {
+		reactive,
+		ref
+	} from 'vue';
+	let nouser = ref(false)
+	
+	function emitChooser(data){
+		uni.$emit('choose-user',data)
+		setTimeout(()=>{
+			uni.navigateBack()
+		},100)
+	}
+	
+	function chooseUser(index,item){
+		if(index===undefined||item===undefined){
+			nouser.value=true
+			return emitChooser()
+		}
+		else{
+			list[index].checked=true
+			emitChooser(item)
+		}
+	}
+	
+	const query=reactive({
+		page:0,
+		name:'',
+		size:10
+	})
+	const list=reactive([])
+	async function getUser(){
+		const {content}=await Api.queryAllShopUser(query)
+		for(let i in content){
+			list.push({...content[i],checked:false})
+		}
+		console.log(list);
+	}
+	function search(){
+		query.page=0
+		list.length=0
+		getUser()
+	}
+	onLoad(()=>{
+		getUser()
+	})
+</script>
+
+<style lang="scss" scoped>
+	
+	.scale7{
+		transform: scale(0.7);
+	}
+	.search {
+		padding-right: 28rpx;
+
+		.icon-saoma {
+			margin-left: 20rpx;
+			width: 34rpx;
+			height: 32rpx;
+		}
+	}
+
+	.list {
+		padding: 32rpx 24rpx;
+		
+		.no-choose {
+			padding: 36rpx 30rpx 36rpx 24rpx;
+		}
+		.box{
+			padding: 32rpx 30rpx 78rpx 24rpx;
+			.item{
+				padding: 24rpx 0;
+				.headimg{
+					border-radius: 12rpx 12rpx 12rpx 12rpx;
+					font-size: 0;
+					width: 84rpx;
+					height: 84rpx;
+					background-color: #eee;
+					overflow: hidden;
+					.img{
+						width: 84rpx;
+						height: 84rpx;
+					}
+				}
+			}
+			.item:not(:first-child){
+				border-top: 1px solid #E5E5E5;
+			}
+		}
+		
+		
+	}
+</style>