jje_uniapp/orderPages/serviceTeacher/index.vue

<template>
	<view class="">
		<view v-for="(item,index) in workPersonList" @click="chooseServiceTeacher(item)" class="h-item-row">
			<view class="h-img">
				<image :src="item.imgUrl || '/static/logo.png'" mode=""></image>
			</view>
			<view class="h-item-content">
				<view class="h-title">
					<view class="name">
						<text>{{item.personName}}</text>
					</view>
					<!-- <view class="btn">
                        <text>包房</text>
                    </view> -->
				</view>
				<view class="h-desc">
					<text>优质服务，从我做起</text>
				</view>
				<view class="h-content">
					<u-icon name="thumb-up" color="#333" size="16"></u-icon>
					<view class="h-text">
						<text>好评率：</text>
					</view>
					<view class="h-text1">
						<text>{{item.goodRate}}%</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				reqParm: {
				    date: '',
				    time: '',
				    storeId: '',
					serviceTypeId:''
				},
				workPersonList: []
			}
		},
		onLoad(option) {

			this.reqParm.date = option.schedulingDate;
			this.reqParm.time = option.time;
			this.reqParm.storeId = option.organization;
			this.reqParm.serviceTypeId = option.serviceTypeId;

			// 查询服务工作人员列表
			// this.serviceWorkPersonList();
			this.getServicePerson();
		},
		methods: {
			// 查询服务工作人员列表
			serviceWorkPersonList() {
				this.$api.serviceWorkPersonList(this.reqParm).then((res) => {
					console.log(res)
					this.workPersonList = res.data.rows;
					this.getImgUrlByOssId(res.data.rows)
				})
			},
      // 查询服务工作人员列表
      getServicePerson() {
        this.$api.getServicePerson(this.reqParm).then((res) => {
          console.log(res)
          this.workPersonList = res.data.data;
          this.getImgUrlByOssId(res.data.data)
        })
      },
			// 获取图片
			getImgUrlByOssId(data){
				for (let i = 0; i < data.length; i++) {
					if (data[i].facePhoto){
						this.$api.getImage(data[i].facePhoto).then(res=>{
							data[i].imgUrl = res.data.data[0].url.replace(/^http:/, "https:")
							this.$set(this.workPersonList,i,data[i])
						});
					}
				}

			},

			// 选择服务老师
			chooseServiceTeacher(item) {
				console.log('+++++++++++++chooseServiceTeacher++++++++++++++',item)
				// 选择完成后返回上一页
				uni.navigateBack({
					delta: 1,
				});
				uni.$emit('selectedServiceTeacher', item);
			}
		},
	};
</script>

<style scoped lang="scss">
	.h-item-row {
		display: flex;
		font-family: PingFangSC-Medium, PingFang SC;
		margin: 12px;
		background: #fff;
		padding: 12px;

		.h-img {
			margin-right: 8px;
			border-radius: 10rpx;
			image {
				height: 80px;
				width: 80px;
				border-radius: 10rpx;
			}
		}

		.h-item-content {
			.h-title {
				font-size: 16px;
				font-weight: 500;
				line-height: 30px;
				display: flex;

				.name {
					padding-right: 6px;
					color: #111111;
				}

				.btn text {
					background: #fff5d0;
					color: #333333;
					font-size: 12px;
					border: 1px solid #FFE05C;
					padding-left: 10px;
					padding-right: 10px;
				}
			}

			.h-desc {
				font-size: 12px;
				font-weight: 400;
				color: #999999;
				line-height: 25px;
			}

			.h-content {
				display: flex;
				align-items: center;
				font-size: 12px;
				font-weight: 400;
				line-height: 25px;

				.h-text {
					color: #999999;
				}

				.h-text1 {
					color: #ED569F;
				}
			}
		}
	}
</style>