1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374 |
- <template>
- <view>
- <view class="userCard flex align_center justify_between" @click="toUser">
- <view class="userCard-info flex align_center justify_between">
- <view>
- <u-image v-if="!isLogin" src="/static/def_personal_avatar.png" width="80" height="80"></u-image>
- <u-image v-if="userInfo.sex==1" src="/static/def_patient_boy@2x.png" width="80" height="80"></u-image>
- <u-image v-if="userInfo.sex==0" src="/static/def_patient_girl@2x.png" width="80" height="80"></u-image>
- </view>
- <view>
- <view v-if="!isLogin" style="font-size: 40rpx;">
- 请点击登录
- </view>
- <view v-else style="color: #FFEB3B;">
- <view>{{userInfo.name}}</view>
- <view>{{userInfo.mobile}}</view>
- </view>
- </view>
- </view>
- <view :style="{color: isLogin?'#fff':''}">
- <text v-if="isLogin">退出</text>
- <u-icon name="arrow-right"></u-icon>
- </view>
- </view>
- </view>
- </template>
- <script>
- export default {
- props:{
- isLogin:{
- type: Boolean,
- default: false
- },
- userInfo: {
- type: Object
- }
- },
- data() {
- return {
-
- }
- },
- methods: {
- toUser(){
- this.$emit('toUser')
- },
- }
- }
- </script>
- <style lang="less">
- .userCard{
- padding:1.2em 1em;
- background-image: linear-gradient(#58c4c4 30%,#65e2e2);
- .userCard-info{
- > view{
- &:last-child{
- margin-left: 0.5em;
- >view{
- padding: 0.2em;
- }
- }
- }
- }
- .user-photo{
- display: block;
- width: 120rpx;
- height: 120rpx;
- border-radius: 50%;
- overflow: hidden;
- }
- }
- </style>
|