jje_uniapp/orderPages/serviceObject/index.vue

<template>
    <view class="" >
        <view v-for="(item,index) in serviceObjectList" @click="chooseServiceObject(item)" class="h-item-row">
            <view class="h-img">
                <image v-if="item.imgUrl" :src="item.imgUrl" mode=""></image>
                <image v-else src="../../static/logo.png" mode=""></image>
            </view>
            <view class="h-item-content">
                <view class="h-title">
                    <view class="name">
                        <text v-if="item.nickName">{{item.nickName}}</text>
                        <text v-else>未填写</text>
                    </view>
                </view>
                <view class="h-desc">
                    <text>关系：{{item.blood}}</text>
                </view>
                <view class="h-content">
                    <view class="h-text">
                        备注：<text v-if="item.remark">{{item.remark}}</text>
                        <text v-else>无</text>
                    </view>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                serviceObjectList: [],
                reqParm: {
                    auth: true
                },
            }
        },
        onLoad(query){
            // 查询服务对象列表
            this.listServiceObject();
        },

        methods: {
            // 查询服务对接信息列表
            listServiceObject(){
                this.$api.listServiceObject(this.reqParm).then((res)=>{
                    console.log('++++++++++listServiceObject+++++++++++',res)
                    this.getImgUrlByOssId(res.data.data);
                }).catch(() =>{
                    uni.showToast({
                        title: "操作失败"
                    })
                });
            },
            // 获取图片
             getImgUrlByOssId(data){
                for (let i = 0; i < data.length; i++) {
                    const item = data[i];
                    if (item.facePhoto){
                        this.$api.getImgUrlByOssId({ossId:item.facePhoto}).then(res=>{
                            console.log('+++++++++++++getImgUrlByOssId+++++++++++++++',res)
                        })
                    }
                }
                this.serviceObjectList = data
            },

            // 选择服务老师
            chooseServiceObject(item){
                uni.navigateBack({
                    delta: 1,
                    success: function(res) {
                        uni.$emit('selectedServiceObject', 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;
            display: flex;
            align-items: center;
            image{
                height: 80px;
                width: 80px;
            }
        }
        .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{
                    padding-left: 4px;
                    color: #999999;
                }
                .h-text1{
                    color: #ED569F;
                }
            }
        }
    }
</style>