com.kasite.client.uniapp.patient/pages/st1/components/overduePerson/overduePerson.vue

<template>
  <view>
    <view class="public_dialog" v-if="(otherList.length != 0 || list.length != 0) && Next == 0">
      <view class="dialog_item">
        <view :class="pageType == 'slb' ? 'header_slb' : 'header'">温馨提醒</view>
        <view>
          <view :class="[pageType == 'slb' ? 'dialog_txt_slb' : 'dialog_txt', 'displayFlexLeft']">
            <view v-if="list.length != 0">
              您在{{ hosName }}（我院）尚有【
              <text v-for="(item, index) in list" :key="index">
                <text>{{ index + 1 }}、{{ item.ActualTime }}{{ item.ItemName }}就诊费用{{ item.Amount }}元，</text>
              </text>
              】未结算，您是否进行充值？
            </view>
            <view v-if="otherList.length != 0">
              您在【
              <text v-for="(item, index) in otherList" :key="index">
                {{ index + 1 }}、{{ item.OrgName }}（他院）尚有
                <text>{{ item.ActualTime }}{{ item.ItemName }}就诊费用{{ item.Amount }}元 <text>,</text></text>
              </text>
              】未结算，请您本次先预存门诊预交金后进行就诊。您可以咨询对应医院相关未结算费用如何结算事宜，避免造成下次就诊不便。谢谢！
            </view>
          </view>
          <view class="p_flexCenter" v-if="otherList.length != 0">
            <view :class="[pageType == 'slb' ? 'dialog_btn_slb' : 'dialog_btn', 'p_border_top', 'backgroundCustom_F08', 'confirmNext']" @click="confirmClick('receive')">知道了</view>
          </view>
          <view class="p_flexBetween" v-if="list.length != 0">
            <view :class="[pageType == 'slb' ? 'dialog_btn_slb' : 'dialog_btn', 'p_color', 'p_border_top', 'colorCustom_999']" @click="confirmClick('cancel')">否</view>
            <view :class="[pageType == 'slb' ? 'dialog_btn_slb' : 'dialog_btn', 'p_border_top', 'backgroundCustom_F08']" @click="confirmClick('confirm')">是</view>
          </view>
        </view>
      </view>
    </view>
    <view class="public_dialog" v-if="Next == 1">
      <view class="dialog_item">
        <view :class="pageType == 'slb' ? 'header_slb' : 'header'">温馨提醒</view>
        <view>
          <view :class="[pageType == 'slb' ? 'dialog_txt_slb' : 'dialog_txt', 'displayFlexLeft']">
            <view>
              尊敬的患者：
            </view>
            <view class="textIndent">
              您的诊疗信用记录良好，可直接预约取号并前往相关科室就诊。完成就诊后，您可通过微信公众号、结算码、自助机等渠道及时办理结算业务。
            </view>
          </view>
          <view class="p_flexCenter">
            <view :class="[pageType == 'slb' ? 'dialog_btn_slb' : 'dialog_btn', 'p_border_top', 'backgroundCustom_F08', 'confirmNext']" @click="confirmClick('receive')">知道了</view>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script lang="ts" setup>
import { ref, onMounted } from 'vue';
import { useGetMember } from '@/hook';
import { common } from '@/utils';
import icon from '@/utils/icon';
import { queryOverdueData as queryOverdueDataApi } from '@/pagesPersonal/service/patientManagement';

const props = withDefaults(defineProps<{
  currentUser?: any;
  BusinessType?: string;
  pageType?: string;
}>(), {
  currentUser: () => ({}),
  BusinessType: '',
  pageType: 'normal'
});

const app = getApp();
const iconUrl = ref(icon);
const list = ref<any[]>([]);
const otherList = ref<any[]>([]);
const Next = ref<any>(null);
const Balance = ref(0);
const changCardInfo = ref<any>({});
const hosName = ref('');

// 暴露 main 方法供外部调用（如果使用了 ref 获取组件实例）
// 但在 Vue 3 中，更推荐通过 props 变化或事件驱动。
// 考虑到原小程序是在 show 生命周期调用 main，这里我们可以在 onMounted 时尝试调用
// 或者如果父组件需要显式调用，需要通过 defineExpose 暴露。
// 鉴于小程序逻辑是 pageLifetimes.show 调用 main，
// 且 main 接收 changCardInfo 参数，我们这里暴露 main 方法。

const main = async (info?: any) => {
  iconUrl.value = icon;
  list.value = [];
  otherList.value = [];
  changCardInfo.value = info || {};
  hosName.value = app.globalData.hospitalInfo?.HospitalAlias || '';
  
  await queryOverdueData();
};

const queryOverdueData = async () => {
  // 获取绑定就诊人列表
  let memberList: any = await useGetMember('memberList');
  // 过滤本人信息 主要用于判断是否开启了信用付
  let myInfo = memberList.filter((item: any) => item.memberType == 1);
  // 判断的到了本人的数据,且本人设置了不开启信用付方式
  if (common.isNotEmpty(myInfo) && myInfo[0].acceptCredit == 0) return;

  if (myInfo[0].acceptCredit == 1 || props.currentUser.acceptCredit == 1) {
    let queryData = {
      MemberId: props.currentUser.memberId,
      // 01101=挂号
      BusinessType: props.BusinessType,
      CardType: props.currentUser.cardType || changCardInfo.value.cardType,
      CardNo: props.currentUser.cardNo || changCardInfo.value.cardNo,
      // ExtData	false	String	扩展参数	;
    };
    
    // 使用新封装的接口
    let { resp } = await queryOverdueDataApi(queryData);
    
    let nextVal = null;
    let listVal = [];
    let otherListVal = [];
    let balanceVal = 0;

    if (!common.isEmpty(resp)) {
      let result = resp[0];
      // 未获取id   则跳去授权
      if (!common.isEmpty(result.WxMiniPath)) {
        let MiniProgram = result;
        let pages = getCurrentPages();
        let goPage = pages[pages.length - 1];
        let options = (goPage as any).options || {}; // uni-app 获取 options 可能不同，这里兼容处理
        if (goPage.route?.indexOf('yyghClinicMsg') != -1) {
             // @ts-ignore
             options.queryBean = (goPage as any).queryBean;
        }
        let overdueOptions = JSON.stringify({
          options: options,
          route: goPage.route,
        });
        uni.setStorageSync('overdueOptions', '');
        uni.setStorageSync('overdueOptions', overdueOptions);
        
        common.showModal(`前往授权`, () => {
          uni.navigateToMiniProgram({
            appId: MiniProgram.WxMiniAppId,
            path: `${MiniProgram.WxMiniPath}&authSource=WX_MINI&authAppId=wx3cf937079d74124f&authBackUrl=${encodeURIComponent(`/pages/st1/business/tabbar/transferPage/transferPage?type=overduePerson`)}`,
            extraData: {},
            envVersion: 'release',
            success(res) {
              uni.setStorageSync('overdueOptions', overdueOptions);
              // 打开成功
            }
          });
        });
      } else {
        // 是否享受先诊后付:0否、1是
        nextVal = result.Next;
        // 如果是1  不做判断
        if (nextVal == 0) {
          // 余额 后端返回元
          balanceVal = result.Balance;
          listVal = result.OneselfItemList;
          otherListVal = result.ExternalItemList;
        }
      }
      
      list.value = listVal;
      otherList.value = otherListVal;
      Next.value = nextVal;
      Balance.value = balanceVal;
    }
  }
};

const confirmClick = (type: string) => {
  let sumOfMoney = list.value.reduce((acc, item) => acc + parseFloat(item.Amount), 0);
  if (type == "confirm") {
    let userInfo = Object.assign({}, props.currentUser, changCardInfo.value);
    app.globalData.currentUser = userInfo;
    let payMoney = common.yuanToCent(Math.ceil(common.sub(sumOfMoney, Balance.value)));
    console.log(payMoney, 'payMoney');
    let url = `/${uni.getStorageSync('wx_Slb') ? 'pagesSlb' : 'pagesPatient'}/st1/business/recharge/rechargeMoney/rechargeMoney?pageType=mzjf&payMoney=${payMoney}`;
    common.goToUrl(url);
    return;
  } else if (type == "cancel") {
    setvalue();
    return;
  } else if (type == "receive") {
    setvalue();
    return;
  }
};

const setvalue = () => {
  Next.value = null;
  // 如果为签到页  需要往签到也存一个值 控制签到的点击时间是否走失信逻辑，needOverduePerson true false
  let pages = getCurrentPages();
  console.log(pages, 'pages');
  let goPage = pages[pages.length - 1];
  // 兼容 uni-app 获取 route
  if (goPage.route && goPage.route.indexOf("signIn/signInDetails/signInDetails") !== -1) {
      // Vue 3 中无法直接 setData 修改页面数据，这里假设父组件提供了方法或者通过其他方式
      // 但为了保持原有逻辑，如果是 uni-app 页面，可能需要通过事件通信
      // 此处保留 setData 尝试，如果是在 uni-app nvue 或 vue2 混合模式下可能有效
      // 但标准 Vue3 做法是 emit 事件
      // (goPage as any).setData({ needOverduePerson: false }); 
      
      // 更好的方式是 emit 一个事件，让父组件处理
      // emit('update:needOverduePerson', false); 
      
      // 由于这是迁移代码，且涉及跨页面/组件通信，如果原逻辑是直接操作页面实例
      // 在 Vue3 中这是不推荐的。
      // 尝试获取组件实例并修改属性（如果不推荐但为了兼容）：
       if ((goPage as any).$vm) {
           (goPage as any).$vm.needOverduePerson = false;
       }
  }
};

defineExpose({
  main
});

onMounted(() => {
    // 组件挂载时逻辑，原小程序 pageLifetimes.show 调用 main
    // 这里如果组件是随页面一起显示的，可以在这里调用
    // 但 main 依赖外部传入 changCardInfo，如果不传则为空
    main(); 
});

</script>

<style lang="scss" scoped>
/* 暂无数据 */
/* @import "/pages/st1/blue/static/style/common"; */
/* @import "/app"; */

/* #region */
/* 普通版本 */
.public_dialog {
  background-color: rgba(1, 1, 1, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 15;
  display: flex;
  align-items: center;
  justify-content: center;
}

.dialog_item {
  width: 600upx;
  background-color: #fff;
  border-radius: 24upx;
  padding-top: 35upx;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.dialog_img {
  width: 167upx;
  height: 167upx;
}

.dialog_txt {
  font-size: 34upx;
  font-weight: 500;
  line-height: 50upx !important;
  margin-bottom: 42upx;
  padding: 0 55upx;
  text-align: left;
  word-break: break-all;
}

.dialog_txt text {
  color: red;
  line-height: 50upx !important;
}

.dialog_txt view {
  line-height: 50upx !important;
}

.dialog_btn {
  width: 100%;
  height: 97upx;
  text-align: center;
  line-height: 97upx;
  font-size: 32upx;
  font-family: Source Han Sans CN;
  font-weight: 500;
  border-radius: 0 0 24upx 0;
}

.dialog_btn:first-child {
  border-top: 1px solid #efefef;
  border-right: 1px solid #efefef;
}

.dialog_btn:nth-child(2) {
  border-top: 1px solid #efefef;
}

.header {
  font-size: 34upx;
  font-weight: 600;
  padding-bottom: 50upx;
}

.confirmNext {
  width: 60%;
  border-radius: 36upx;
  margin-bottom: 57upx;
}

.textIndent {
  text-indent: 2em;
}

/* #endregion */
/* #region */
/* 适老版 */
// 注意：原 CSS 中有两段 .public_dialog 等定义，后一段会覆盖前一段，但这里根据 pageType 区分样式类
// 原小程序代码并没有区分 public_dialog 的类名，只是内部元素区分了 _slb
// 但这里为了完整迁移，我们将 _slb 的样式也保留并转换单位

.dialog_txt_slb {
  font-size: 36upx;
  font-weight: 500;
  line-height: 50upx !important;
  margin-bottom: 42upx;
  padding: 0 55upx;
  text-align: left;
  word-break: break-all;
}

.dialog_txt_slb text {
  color: red;
  line-height: 65upx !important;
}

.dialog_txt_slb view {
  line-height: 65upx !important;
}

.dialog_btn_slb {
  width: 100%;
  height: 97upx;
  text-align: center;
  line-height: 97upx;
  font-size: 36upx;
  font-family: Source Han Sans CN;
  font-weight: 500;
  border-radius: 0 0 24upx 0;
}

.header_slb {
  font-size: 40upx;
  font-weight: 700;
  padding-bottom: 50upx;
}

/* #endregion */
</style>