com.kasite.client.uniapp.patient/pagesPatient/st1/business/priceInquiry/inquiryDetails/inquiryDetails.vue

<template>
  <view class="container">
    <view class="content">
      <!-- 药品价格标题 -->
      <view class="public_info_list" v-if="type == 'drug'">
        <view class="public_info_item border_bottom">
          <view class="public_info_tit">药品名称</view>
          <view class="public_info_val">{{queryBean.DrugName}}</view>
        </view>
        <view class="public_info_item border_bottom">
          <view class="public_info_tit">药品规格</view>
          <view class="public_info_val">{{queryBean.Specs}}</view>
        </view>
        <view class="public_info_item border_bottom">
          <view class="public_info_tit">单位</view>
          <view class="public_info_val">{{queryBean.Unit}}</view>
        </view>
        <view class="public_info_item border_bottom">
          <view class="public_info_tit">分类</view>
          <view class="public_info_val">{{queryBean.DrugType}}</view>
        </view>
        <view class="public_info_item border_bottom">
          <view class="public_info_tit">药品类别</view>
          <view class="public_info_val">{{queryBean.DrugClassification}}</view>
        </view>
        <view class="public_info_item border_bottom">
          <view class="public_info_tit">生厂商</view>
          <view class="public_info_val">{{queryBean.Manufacturer}}</view>
        </view>
        <view class="public_info_item">
          <view class="public_info_tit">零售价</view>
          <view class="public_info_val">{{queryBean.UnitPrice}}元</view>
        </view>
      </view>
      <!-- 项目价格标题 -->
      <view class="public_info_list" v-else>
        <view class="public_info_item border_bottom">
          <view class="public_info_tit">项目名称</view>
          <view class="public_info_val">{{queryBean.ItemName}}</view>
        </view>
        <view class="public_info_item border_bottom">
          <view class="public_info_tit">单位</view>
          <view class="public_info_val">{{queryBean.Unit}}</view>
        </view>
        <view class="public_info_item">
          <view class="public_info_tit">零售价</view>
          <view class="public_info_val">{{queryBean.UnitPrice}}元</view>
        </view>
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import { useOnLoad } from '@dcloudio/uni-app';

const type = ref('drug'); // drug:药品详情 pro:项目详情
const queryBean = ref<any>({});

useOnLoad((options: any) => {
  try {
    queryBean.value = options.queryBean ? JSON.parse(options.queryBean) : {};
  } catch (e) {
    console.error('JSON parse error:', e);
    queryBean.value = {};
  }
  type.value = options.type || '';
});
</script>

<style lang="scss">
.public_info_list {
  padding: 0 30upx;
  display: inline-block;
  width: 100%;
  position: relative;
  background-color: #fff;
}

.public_info_item {
  display: flex;
  margin: 0;
  padding: 40upx 0;
}

.public_info_tit {
  font-family: Source Han Sans CN;
  line-height: 40upx;
  flex-shrink: 0;
  font-size: 32upx;
  font-weight: 400;
  color: rgba(0, 0, 0, 1);
  width: 184upx;
}

.public_info_val {
  font-family: Source Han Sans CN;
  align-items: flex-start;
  line-height: 40upx;
  word-break: break-all;
  font-size: 32upx;
  font-weight: 400;
  color: rgba(85, 85, 85, 1);
  max-width: 100%;
}

.public_info_foot {
  height: 110upx;
  display: flex;
  align-items: center;
  justify-content: space-around;
}

.public_icon {
  width: 50upx;
  height: 50upx;
  position: absolute;
  top: 0upx;
  bottom: 0;
  left: 24upx;
  margin: auto 0;
}
</style>