问题视频：https://dstatic.distinctclinic.com/normal%20video.mp4

微信号：lin_xiao11（微信日志已上传）

布局如下代码，再不分安卓设备上底部class：bottomButton的按钮不渲染，重新进入就渲染了。不知道是那里渲染有问题，是什么style冲突了吗？

<template>
  <block>
    <view>
      <!--医生基本信息-->
      <view class="doctorInfoBlock">
        <image :src="imagesCfg.doctor_detail_top" class="topBackground" />
        <view class="doctorCard weui-flex-col" style="margin-top: 70px">
          <view class="baseInfo weui-flex">
            <image
              :src="
                baseInfo.doctor.imageUrl
                  ? baseInfo.doctor.imageUrl
                  : imagesCfg.distinct_doctor_common
              "
              class="doctorImg"
            />
            <view class="weui-flex-col rightView">
              <text class="doctorName">{{ baseInfo.doctor.name }}</text>
            </view>
          </view>
          <view class="weui-flex briefIntroduction subScription">
            <text style="margin-left: 20rpx">
              我为您的本次就诊提供了免费随访服务，如您希望与我沟通您的健康情况，可向我发起随访咨询
            </text>
          </view>
        </view>
      </view>
      <!--医生提醒信息-->
      <view
        v-if="
          baseInfo.doctorReminder && baseInfo.doctorReminder.content.length > 0
        "
        class="doctorReminderBlock"
      >
        <view class="weui-flex reminderTopContainer">
          <view class="weui-flex weui-flex-center">
            <image :src="imagesCfg.icon_tips" class="icon-tips" />
            <text class="zz-text__first_title">医生提醒</text>
          </view>
          <text class="time">{{ baseInfo.doctorReminder.datetime }}</text>
        </view>
        <text class="reminderTips">{{ baseInfo.doctorReminder.content }}</text>
      </view>
      <!--就诊信息-->
      <view class="blockInfoBox">
        <view class="itemTitle zz-text__first_title">
          <view class="vline" />
          就诊信息
        </view>
        <view class="itemInfo">
          <text class="zz-secondary__description">就诊时间</text>
          <text class="zz-main__text paddingItem orangeText">
            {{ baseInfo.appointment.appointmentDate }}
          </text>
        </view>
        <view class="itemInfo" style="padding-bottom: 30rpx">
          <text class="zz-secondary__description">门诊诊所</text>
          <text class="zz-main__text paddingItem">
            {{ baseInfo.appointment.storeName }}
          </text>
        </view>
        <view class="seperateLine" />
      </view>
      <!--随访信息-->
      <view class="blockInfoBox">
        <view class="itemTitle zz-text__first_title">
          <view class="vline" />
          随访信息
        </view>
        <view class="itemInfo">
          <text
            class="zz-secondary__description"
            style="min-width: 104rpx; text-align: right"
          >
            随访人
          </text>
          <text class="zz-main__text paddingItem">
            {{ baseInfo.patient.name }}
          </text>
        </view>
        <view class="itemInfo">
          <text
            class="zz-secondary__description"
            style="min-width: 104rpx; text-align: right"
          >
            档案号
          </text>
          <text class="zz-main__text paddingItem">
            {{ baseInfo.patient.patientNo }}
          </text>
        </view>
        <view class="itemInfo" style="padding-bottom: 30rpx">
          <text class="zz-secondary__description">随访时间</text>
          <text class="zz-main__text paddingItem">
            剩余{{
              consultTools.timeDifference(
                baseInfo.followUp.remainingTimestamp || 0,
              )
            }}
          </text>
        </view>
        <view
          class="seperateLine"
          :style="{
            height: followUpStatus === 'pending_get' ? '10px' : '0rpx',
          }"
        />
      </view>
      <!--转发-->
      <view v-if="followUpStatus === 'pending_get'" class="blockInfoBox">
        <view class="weui-flex transferBlock weui-flex-between">
          <view class="weui-flex" style="align-items: center">
            <image class="transferImg" :src="imagesCfg.icon_transfer" />
            <text>可转发页面链接给家人,由家人领取并发起随访咨询</text>
          </view>
          <button class="transferButton" open-type="share">转发</button>
        </view>
      </view>
      <!-- 介绍文章 -->
      <image
        :src="imagesCfg.follow_up_mini_banner"
        class="bottomBannerImg"
        @tap="lookDetailAction"
      />
      <!--底部按钮-->
      <view class="bottomStatusView">
        <view
          class="statusTips"
          :style="{
            backgroundColor: tipColor.background,
            color: tipColor.color,
          }"
          v-if="showTip"
        >
          {{ statusTipsText }}
        </view>
        <view
          class="bottomButton"
          :style="{ 'padding-bottom': isIpx ? '45rpx' : '15rpx' }"
          @tap.stop="followUpHandler"
        >
          <view
            class="zz-fixed-bottom-button_full"
            style="width: auto"
            :class="{
              disabledButton: btnDisabled,
            }"
          >
            {{ buttonText }}
          </view>
        </view>
      </view>
    </view>
    <birthday-verify-popup
      :isShowPop.sync="isShowPop"
      :showDate.sync="showDate"
      :selectDate.sync="selectDate"
      :patient.sync="baseInfo.patient"
      @cancel="cancelVerifyPop"
      @confirmClick="confirmClick"
    />
  </block>
</template>


<script module="consultTools" lang="wxs" src="@/wxs/consultTools.wxs"></script>
<script
  module="followupTools"
  lang="wxs"
  src="@/wxs/followupTools.wxs"
></script>
<script>
import config from '@/config';
import imagesConfig from '@/config/ImagesConfig.js';


import common from '@/vendor/common';
import moment from 'moment';


export default {
  data() {
    return {
      opt: {},
      imagesCfg: {
        doctor_detail_top: imagesConfig.doctor_detail_top,
        icon_tips: imagesConfig.icon_tips,
        icon_transfer: imagesConfig.icon_transfer,
        follow_up_mini_banner: imagesConfig.follow_up_mini_banner,
        distinct_doctor_common: imagesConfig.distinct_doctor_common,
      },
      isIpx: false,
      followUpStatus: 'pending_get',
      baseInfo: {}, // 随访相关信息
      // 生日校验弹框
      isShowPop: false,
      showDate: '',
      selectDate: '',
      validateBirthday: null,
      aboutUrl: '',
      doctorInitiativeFlag: false,
      receivedDatetime: null,
      relationshipPopup: {
        visible: false,
        value: '',
      },
    };
  },
  computed: {
    locale() {
      return this.$i18n.locale;
    },
    relationshipList() {
      const list = [];
      return list;
    },
    showTip() {
      return this.doctorInitiativeFlag;
    },
    tipColor() {
      let background = '#FFDDDA';
      let color = '#BC4B4A';


      return {
        background,
        color,
      };
    },
    btnDisabled() {
      return true;
    },
    buttonText() {
      return '立即领取';
    },
    statusTipsText() {
      return '请领取随访后，查看医生回复';
    },
  },


  async onLoad(options) {
    this.opt = options;
    if (this.locale != 'zh-CN') {
      uni.showModal({
        title: 'tips',
        content: 'This feature is only available in the Chinese version',
        showCancel: false,
        confirmText: 'Switch',
        confirmColor: '#006d82',
        success: (res) => {
          if (res.confirm) {
            // uni.navigateTo({ url: '/otherBusiness/settingLanguage' });
            common.switchLanguage({ lang: 'zh-CN' });
          }
        },
      });
    }
    this.isIpx = config.isIpx;
    // 初始化弹窗日期
    this.showDate = moment().format(
      this.$t('consultation.get_follow_up_code.date_format'),
    );
    this.selectDate = moment().format('YYYY-MM-DD');
  },


  onShow() {
    this.getFollowUpInfoByIdOrQrcode();
  },


  onShareAppMessage() {
    return {
      title: this.baseInfo.doctor.name + ' 诊后随访',
      success: (res) => {
        console.log('转发成功', res);
      },
      fail: (res) => {
        console.log('转发失败', res);
      },
    };
  },


  methods: {
    getFollowUpLandingPageStatus(status, validation) {
      return 'pending_get';
    },


    // 根据followUpId来获取随访信息
    async getFollowUpInfoByIdOrQrcode() {
      // 通过随访id获取信息


      this.baseInfo = {
        doctor: { name: 11 },
        followUp: {},
        patient: {},
        appointment: {},
        doctorReminder: {},
      };
      this.baseInfo.appointment.appointmentDate = moment(
        this.baseInfo.appointment?.appointmentTimestamp,
      )
        .utc()
        .add(8, 'h')
        .format('MM月DD日 HH:mm');
      this.followUpStatus = this.getFollowUpLandingPageStatus(
        this.baseInfo?.followUp?.status,
        this.baseInfo?.validation,
      );


      this.doctorInitiativeFlag = true;
      this.receivedDatetime = '';
    },


    onCancelRelationship() {
      this.relationshipPopup.visible = false;
    },
    // 领取随访
    async receiveFollowUpService() {},
    handleErrStatus(msg) {
      uni.showToast({
        title: msg,
        icon: 'none',
      });
    },


    // 根据随访状态处理业务类型
    followUpHandler() {},


    cancelVerifyPop() {
      this.isShowPop = false;
    },


    confirmClick(birthday) {},


    lookDetailAction() {
      uni.navigateTo({
        url:
          '/pages/webView?type=article&link=' +
          encodeURIComponent(this.aboutUrl),
      });
    },
  },
};
</script>


<style lang="less">
page {
  background-color: #fff;
}
.subScription {
  font-size: 24rpx;
  color: #849ca0;
}
.seperateLine {
  height: 10px;
  background-color: #f5f7f7;
}
.blockInfoBox {
  display: flex;
  flex-direction: column;
  background-color: #fff;
  .itemTitle {
    display: flex;
    align-items: center;
    font-size: 36rpx;
    color: #0a434d;
    padding: 30rpx;
    .vline {
      width: 6rpx;
      height: 30rpx;
      border-radius: 4rpx;
      background-color: #006f83;
      margin-right: 20rpx;
    }
  }
  .itemInfo {
    padding: 0rpx 0rpx 20rpx 60rpx;
    display: flex;
    align-items: center;
    .paddingItem {
      margin-left: 40rpx;
    }
    .orangeText {
      font-size: 30rpx;
      color: #ffaf27;
    }
  }
  .itemAlignRight {
    justify-content: space-between;
    padding-right: 30rpx;
  }
}
.transferBlock {
  display: flex;
  flex-direction: row;
  background-color: #fff;
  padding: 30rpx;
  font-size: 22rpx;
  color: #0a434d;
  .transferImg {
    width: 40rpx;
    height: 40rpx;
    margin-right: 10rpx;
  }
  .transferButton {
    background-color: #006f83;
    border-radius: 8rpx;
    color: #fff;
    font-size: 24rpx;
    margin-right: 0rpx;
  }
}
.doctorInfoBlock {
  // background: #fff;
  .topBackground {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    height: 340rpx;
    z-index: -1;
  }
  .doctorCard {
    background: #fff;
    margin: 174rpx 30rpx 30rpx 30rpx;
    border-radius: 30rpx 30rpx 8rpx 8rpx;
    border: 1px solid rgba(0, 111, 131, 0.1);
    box-shadow: 0 6rpx 26rpx rgba(53, 109, 119, 0.1);
    .baseInfo {
      .doctorImg {
        border-radius: 100%;
        width: 160rpx;
        height: 160rpx;
        margin-top: -86rpx;
        margin-left: 64rpx;
      }
      .rightView {
        padding: 24rpx 38rpx 20rpx 22rpx;
        flex: 1;
        .doctorName {
          font-size: 36rpx;
          color: #0a434d;
        }
      }
    }
    .briefIntroduction {
      padding: 20rpx 30rpx 30rpx 30rpx;
    }
  }
}
.doctorReminderBlock {
  background: #fff;
  margin: 30rpx;
  padding: 30rpx;
  border-radius: 8rpx;
  border: 1px solid rgba(0, 111, 131, 0.1);
  box-shadow: 0 6rpx 26rpx rgba(53, 109, 119, 0.1);
  .reminderTopContainer {
    justify-content: space-between;
    align-items: center;
    padding-bottom: 20rpx;
  }
  .icon-tips {
    width: 26rpx;
    height: 26rpx;
    margin-right: 20rpx;
  }
  .time {
    font-size: 22rpx;
    color: #aab5b6;
  }
  .reminderTips {
    font-size: 30rpx;
    color: #849ca0;
  }
}
.bottomStatusView {
  background: #fff;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
}
.bottomButton {
  padding: 15rpx 0rpx;
  align-items: center;
}
.disabledButton {
  background-color: #d5d5d5;
  border-color: transparent;
}
.statusTips {
  display: flex;
  align-items: flex-start;
  padding: 15rpx 30rpx;
  background-color: #ffddda; // #fff7e9;
  font-size: 22rpx;
  color: #bc4b4a; // #ffaf27;
}
.bottomBannerImg {
  width: 100%;
  height: 172rpx;
  margin-bottom: 300rpx;
}
.popup-block {
  .select-item {
    position: relative;
    padding: 30rpx 30rpx 30rpx 60rpx;
  }
  .cancel-btn {
    flex: 1;
    align-items: center;
    justify-content: center;
    border: 1px solid #006f83;
    border-radius: 8rpx;
    height: 80rpx;
    color: #006f83;
    font-size: 30rpx;
    text-align: center;
    line-height: 80rpx;
  }
}
.zz-fixed-bottom-button_full {
  width: 100%;
  margin-left: 30rpx;
  margin-right: 30rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #006f83;
  border-radius: 8rpx;
  height: 80rpx;
  color: #fff;
  background-color: #006f83;
  font-size: 30rpx;
}
</style>

设备信息