feat：扫码详情优化

traceCodePackages/traceabilityCodeQuery/pages/detail/index.vue

@@ -1,7 +1,14 @@
 <template>
   <Water></Water>
-  <view class="detail-page" :style="{ height: pageHeight }" v-if="!!data && !loading">
-    <view class="detail-card detail-bg" :style="{ backgroundImage: 'url(' + bg + ')' }">
+  <view
+    class="detail-page"
+    :style="{ height: pageHeight }"
+    v-if="!!data && !loading"
+  >
+    <view
+      class="detail-card detail-bg"
+      :style="{ backgroundImage: 'url(' + bg + ')' }"
+    >
       <view class="detail-drug-title">{{ data.physicName }}</view>
       <view class="detail-row detail-traceability">
         <view class="detail-label">追溯码：</view>
@@ -9,18 +16,30 @@
           formatTraceCode(traceCode)
         }}</view>
         <view class="detail-copy-btn" @click="copy(traceCode)">
-          <image src="../../../static/images/copy.png" mode="scaleToFill"
-            :style="{ width: '30rpx', height: '30rpx' }" />
+          <image
+            src="../../../static/images/copy.png"
+            mode="scaleToFill"
+            :style="{ width: '30rpx', height: '30rpx' }"
+          />
         </view>
       </view>
 
       <view class="detail-row">
         <view class="detail-label">生产企业：</view>
-        <view class="detail-value detail-wrap detail-company-value" :class="{ 'detail-clamp': !isExpanded }"
-          :style="{ marginBottom: needToggle ? '40rpx' : undefined }" id="companyValue">
+        <view
+          class="detail-value detail-wrap detail-company-value"
+          :class="{ 'detail-clamp': !isExpanded }"
+          :style="{ marginBottom: needToggle ? '40rpx' : undefined }"
+          id="companyValue"
+        >
           <text>{{ data.produceEntName }}</text>
         </view>
-        <text v-if="needToggle" class="detail-expand-tag" @click="toggleExpand">{{ isExpanded ? "收起" : "展开" }}</text>
+        <text
+          v-if="needToggle"
+          class="detail-expand-tag"
+          @click="toggleExpand"
+          >{{ isExpanded ? "收起" : "展开" }}</text
+        >
       </view>
       <view class="detail-row">
         <view class="detail-label">批准文号：</view>
@@ -36,7 +55,8 @@
       </view>
       <view class="detail-row">
         <view class="detail-label">
-          剂<text :style="{ opacity: 0 }">剂型</text>型：</view>
+          剂<text :style="{ opacity: 0 }">剂型</text>型：</view
+        >
         <view class="detail-value">{{ data.prepnDesc }}</view>
       </view>
       <view class="detail-row">
@@ -49,31 +69,51 @@
       </view>
     </view>
 
-    <view class="detail-timeline detail-bg" :style="{ backgroundImage: 'url(' + bg + ')' }">
+    <view
+      class="detail-timeline detail-bg"
+      :style="{ backgroundImage: 'url(' + bg + ')' }"
+    >
       <view class="detail-section-title">扫码跟踪</view>
-      <view class="detail-timeline-item" :class="{ 'detail-timeline-item-first': i === 0 }"
-        v-for="(value, i) in data.enterpriseList">
+      <view
+        class="detail-timeline-item"
+        :class="{ 'detail-timeline-item-first': i === 0 }"
+        v-for="(value, i) in data.enterpriseList"
+      >
         <view class="detail-left">
-          <view class="detail-dot detail-fill"></view>
-          <view class="detail-line" v-if="i < data.enterpriseList.length - 1"></view>
+          <view class="detail-dot" :class="{ 'detail-fill': i == 0 }"></view>
+          <view
+            class="detail-line"
+            v-if="i < data.enterpriseList.length - 1"
+          ></view>
         </view>
         <view class="detail-right">
-          <view class="detail-title" :class="{'detail-bold': i == 0}">{{ value.entName }}</view>
-          <view class="detail-desc">[{{ value.entTypeName }}]&nbsp;{{ getRegion(value) }}</view>
-          <view class="detail-extra" v-if="!!value.inBoundBillsTime || !!value.outBoundBillsTime">
+          <view class="detail-title" :class="{ 'detail-bold': i == 0 }">{{
+            value.entName
+          }}</view>
+          <view class="detail-desc"
+            >[{{ value.entTypeName }}]&nbsp;{{ getRegion(value) }}</view
+          >
+          <view
+            class="detail-extra"
+            v-if="!!value.inBoundBillsTime || !!value.outBoundBillsTime"
+          >
             <view class="detail-extra-item" v-if="!!value.inBoundBillsTime">
               <!-- <image src="../../../static/images/warehousing.png" mode="scaleToFill"
                 :style="{ width: '34rpx', height: '34rpx', marginTop: '4rpx' }" /> -->
-              <text>{{ value.inBoundTypeName }}：{{
-                formatDate(value.inBoundBillsTime)
-                }}</text>
+              <text
+                >{{ value.inBoundTypeName }}：{{
+                  formatDate(value.inBoundBillsTime)
+                }}</text
+              >
             </view>
-            <view class="detail-extra-item" v-if="!value.inBoundBillsTime">无入库信息</view>
+            <view class="detail-extra-item" v-if="!value.inBoundBillsTime"
+              >无入库信息</view
+            >
             <view class="detail-extra-item">{{
               !!value.outBoundBillsTime
                 ? value.outBoundTypeName +
-                "：" +
-                formatDate(value.outBoundBillsTime)
+                  "：" +
+                  formatDate(value.outBoundBillsTime)
                 : "无出库信息"
             }}</view>
           </view>
@@ -81,25 +121,44 @@
       </view>
     </view>
   </view>
-  <view class="detail-page-empty" :style="{ height: pageHeight }" v-if="!data && !loading">
-    <image src="../../../static/images/empty.png" mode="scaleToFill" :style="{ width: '264rpx', height: '200rpx' }" />
-    <text :style="{
-      fontSize: '24rpx',
-      color: '#99a1ad',
-      marginTop: '60rpx',
-      textAlign: 'center',
-    }">所查询药品所在生产企业尚未纳入扫码范围，后续将进一步扩大，敬请期待</text>
+  <view
+    class="detail-page-empty"
+    :style="{ height: pageHeight }"
+    v-if="!data && !loading"
+  >
+    <image
+      src="../../../static/images/empty.png"
+      mode="scaleToFill"
+      :style="{ width: '264rpx', height: '200rpx' }"
+    />
+    <text
+      :style="{
+        fontSize: '24rpx',
+        color: '#99a1ad',
+        marginTop: '60rpx',
+        textAlign: 'center',
+      }"
+      >所查询药品所在生产企业尚未纳入扫码范围，后续将进一步扩大，敬请期待</text
+    >
   </view>
-  <view class="detail-page-empty" :style="{ height: pageHeight }" v-if="loading">
-    <image src="../../../static/images/loading.png" mode="scaleToFill" :style="{ width: '50rpx', height: '50rpx' }"
-      class="detail-loading" />
+  <view
+    class="detail-page-empty"
+    :style="{ height: pageHeight }"
+    v-if="loading"
+  >
+    <image
+      src="../../../static/images/loading.png"
+      mode="scaleToFill"
+      :style="{ width: '50rpx', height: '50rpx' }"
+      class="detail-loading"
+    />
   </view>
 </template>
 
 <script>
 import bg from "../../../static/images/bg.png";
 import { formatDate } from "../../../utils/utils.js";
-import request from '../../../request/index.js'
+import request from "../../../request/index.js";
 import Water from "@/components/water/water.vue";
 export default {
   components: {
@@ -155,10 +214,10 @@ export default {
       );
     },
     getData(traceCode) {
-      request('/bills/scanCode', {
+      request("/bills/scanCode", {
         tracCode: traceCode,
-        path: '/traceabilityCodeQuery/pages/detail/index.vue',
-      }).then(res => {
+        path: "/traceabilityCodeQuery/pages/detail/index.vue",
+      }).then((res) => {
         if (res.code == 200) {
           const _data = res.data;
           this.data = _data || null;
@@ -172,14 +231,18 @@ export default {
         } else {
           uni.showToast({ title: "查询失败", icon: "none" });
         }
-      })
+      });
     },
     copy(text) {
       const data = String(text || this.traceCode);
       uni.setClipboardData({
         data,
         success: () => {
-          console.log('packages/traceabilityCodeQuery/pages/detail/index.vue' + 'storage' + 'clipboardData');
+          console.log(
+            "packages/traceabilityCodeQuery/pages/detail/index.vue" +
+              "storage" +
+              "clipboardData",
+          );
           uni.showToast({
             title: "已复制追溯码",
             icon: "none",