中药组成显示质量和单位

src/service/ServiceDetail.vue

@@ -12,7 +12,7 @@ onMounted(async () => {
   } catch (error) {
     console.log(error, 'getCpDetailMethod-error');
   }
-})
+});
 </script>
 
 <template>
@@ -27,10 +27,10 @@ onMounted(async () => {
     </div>
     <div class="detail-item">
       <div class="label">计价规则：</div>
-      <div class="content">{{ data.pricingType==='0'?'一口价':'按穴位/脉络/部位计价' }}</div>
+      <div class="content">{{ data.pricingType === '0' ? '一口价' : '按穴位/脉络/部位计价' }}</div>
     </div>
 
-    <div class="flex" v-if="data?.pricingType==='0'">
+    <div class="flex" v-if="data?.pricingType === '0'">
       <div class="detail-item mr-10">
         <div class="label">单价：</div>
         <div class="content">{{ data?.cpFixedPricingRule?.unitPrice }}元</div>
@@ -39,22 +39,30 @@ onMounted(async () => {
         <div class="label">计价单位：</div>
         <div class="flex">
           <div class="content mr-10">{{ data?.cpFixedPricingRule?.pricingUnit }}</div>
-          <div class="content">相当于 {{ data?.cpFixedPricingRule?.convertDose }} {{ data?.cpFixedPricingRule?.convertUnit ? data?.cpFixedPricingRule?.convertUnit : '次' }}（使用单位）</div>
+          <div class="content">
+            相当于 {{ data?.cpFixedPricingRule?.convertDose }} {{ data?.cpFixedPricingRule?.convertUnit ? data?.cpFixedPricingRule?.convertUnit : '次' }}（使用单位）
+          </div>
         </div>
       </div>
     </div>
-    <div class="flex" v-if="data?.pricingType==='1'">
-        <div class="detail-item">
-          <div class="label">计价说明：</div>
-          <div class="content font-extrabold">{{ data?.pricingType==='1'?`当"穴位/经络/部位 ≤${data?.cpDynamicPricingRule? data?.cpDynamicPricingRule[1]?.max || 0:0}个时，
-          单价为${data?.cpDynamicPricingRule? data?.cpDynamicPricingRule[0]?.price || 0:0}元，
-          当"穴位/经络/部位 ＞${data?.cpDynamicPricingRule? data?.cpDynamicPricingRule[1]?.max || 0:0}个时，
-          单价为${data?.cpDynamicPricingRule? data?.cpDynamicPricingRule[1]?.price || 0:0}元`:'' }}</div>
+    <div class="flex" v-if="data?.pricingType === '1'">
+      <div class="detail-item">
+        <div class="label">计价说明：</div>
+        <div class="content font-extrabold">
+          {{
+            data?.pricingType === '1'
+              ? `当"穴位/经络/部位 ≤${data?.cpDynamicPricingRule ? data?.cpDynamicPricingRule[1]?.max || 0 : 0}个时，
+          单价为${data?.cpDynamicPricingRule ? data?.cpDynamicPricingRule[0]?.price || 0 : 0}元，
+          当"穴位/经络/部位 ＞${data?.cpDynamicPricingRule ? data?.cpDynamicPricingRule[1]?.max || 0 : 0}个时，
+          单价为${data?.cpDynamicPricingRule ? data?.cpDynamicPricingRule[1]?.price || 0 : 0}元`
+              : ''
+          }}
         </div>
+      </div>
     </div>
-      <div class="detail-item" v-if="data?.cpMedicines?.length>0 && data?.cpMedicines[0]?.name">
-        <div class="label">中药组成：</div>
-      <div class="content" v-for="item in data?.cpMedicines" :key="item.id">{{ item.name }} ; </div>
+    <div class="detail-item" v-if="data?.cpMedicines?.length > 0 && data?.cpMedicines[0]?.name">
+      <div class="label">中药组成：</div>
+      <div class="content" v-for="item in data?.cpMedicines" :key="item.id">{{ item.name }} {{ item.dosage || '' }}{{ item.dosage ? 'g' : '' }} ;</div>
     </div>
     <div class="detail-item" v-if="data?.effect">
       <div class="label">功效：</div>