yifengyide-h5/pages/index/user_license.vue
2025-03-28 17:22:00 +08:00

141 lines
2.7 KiB
Vue
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="user-license">
<view class="info-item">
<image class="avatar" :src="userInfo.avatar || '/static/default-avatar.png'" mode="aspectFill"></image>
</view>
<view class="info-list">
<view class="info-item">
<text class="label">姓名</text>
<text class="content">{{userInfo.nickname}}</text>
</view>
<view class="info-item">
<text class="label">手机号</text>
<text class="content">{{userInfo.mobile}}</text>
</view>
<view class="info-item">
<text class="label">科室</text>
<text class="content">{{userInfo.user_group_name}}</text>
</view>
<view class="info-item">
<text class="label">岗位名称</text>
<text class="content">{{userInfo.position}}</text>
</view>
<view class="info-item">
<text class="label">资格证编码</text>
<text class="content">{{userInfo.certificate_code}}</text>
</view>
<view class="info-item">
<text class="label">执业证编码</text>
<text class="content">{{userInfo.license_code}}</text>
</view>
<view class="info-item license-image">
<text class="label">执业证图片</text>
<image class="license-img" :src="userInfo.license_image" mode="aspectFit" @click="previewImage"></image>
</view>
</view>
</view>
</template>
<script>
import {
getUserInfo,
} from '@/util/api.js';
export default {
data() {
return {
userInfo: {},
id: 0,
}
},
onLoad(op) {
console.log(op);
this.id = op.id;
this.info();
},
methods: {
info() {
getUserInfo({
user_id: this.id
})
.then(res => {
console.log(res);
if (res.code == 0) {
uni.showToast({
title: res.msg,
icon: 'none',
duration: 2000
});
} else {
this.userInfo=res.data;
}
})
.catch(error => {
uni.showToast({
title: error,
icon: 'none',
duration: 2000
});
})
},
previewImage() {
// 图片预览功能
uni.previewImage({
urls: [this.userInfo.license_image]
})
}
}
}
</script>
<style>
.user-license {
padding: 20rpx;
background-color: #f5f5f5;
}
.info-item {
background-color: #ffffff;
padding: 20rpx;
margin-bottom: 20rpx;
border-radius: 10rpx;
display: flex;
align-items: center;
}
.avatar {
width: 150rpx;
height: 150rpx;
border-radius: 75rpx;
margin: 20rpx auto;
display: block;
}
.label {
color: #666;
width: 200rpx;
font-size: 28rpx;
}
.content {
color: #333;
flex: 1;
font-size: 28rpx;
}
.license-image {
flex-direction: column;
align-items: flex-start;
}
.license-img {
width: 100%;
height: 400rpx;
margin-top: 20rpx;
}
</style>