优化 Antibody Database详情

src/view/antibody/index.vue

@@ -10,9 +10,9 @@
                     empty-text="Not Date"
                     style="width: 100%"
                     @row-click="gotoArticle">
-                    <el-table-column prop="catalog" :label="$t('AntibodyDatabase.CatNo')" width="100"/>
-                    <el-table-column prop="name" :label="$t('AntibodyDatabase.AntibodyName')" width="400"/>
-                    <el-table-column prop="target" :label="$t('AntibodyDatabase.Target')" >
+                    <el-table-column prop="catalog" :label="$t('AntibodyDatabase.CatNo')" width="140"/>
+                    <el-table-column prop="name" :label="$t('AntibodyDatabase.AntibodyName')" />
+                    <el-table-column prop="target" :label="$t('AntibodyDatabase.Target')" width="400">
                       <template slot-scope="scope">
                         <!-- <span v-for="(one, i) in scope.row.targetList" :key="i">
                           {{ one }}
@@ -21,7 +21,7 @@
                       </template>
                     </el-table-column>
                     <el-table-column prop="moa" :label="$t('AntibodyDatabase.MOA')" />
-                    <el-table-column prop="company" :label="$t('AntibodyDatabase.Inventor')" />
+                    <el-table-column prop="company" :label="$t('AntibodyDatabase.Inventor')"/>
                 </el-table>
             </template>
         </div>
@@ -37,9 +37,6 @@
                     <el-table-column prop="name" :label="$t('AntibodyDatabase.AntibodyName')" />
                     <el-table-column prop="target" :label="$t('AntibodyDatabase.Target')" >
                       <template slot-scope="scope">
-                        <!-- <span v-for="(one, i) in scope.row.targetList" :key="i">
-                          {{ one }}
-                        </span> -->
                         <span>{{ $util.targetDictionaries(scope.row.target) }}</span>
                       </template>
                     </el-table-column>

src/view/antibodyDetail/index.vue

@@ -3,20 +3,21 @@
         <banner></banner>
         <div class="article">
             <p class="antibodyDetail_title">Adalimumab</p>
-            <div class="antibodyDetail_box">
+            <div class="antibodyDetail_box" v-if="overView.summary && overView.summary != 'NA'">
                 <p class="Detail_boxTitle">Summary</p>
                 <div class="Detail_boxContent"> <p v-for="(one, i) in splitText(overView.summary)" :key="i">{{ one }}</p></div>
             </div>
             <div class="antibodyDetail_box">
                 <p class="Detail_boxTitle">Background</p>
                 <div class="Background_box">
-                    <div class="Background_content Detail_line">
+                    <div class="Background_content Detail_line" v-if="overView.relationshipToDisease && overView.relationshipToDisease != 'NA'">
                         <p class="Background_title">Relationship to Disease</p>
                         <div class="Background_text"><p v-for="(one, i) in splitText(overView.relationshipToDisease)" :key="i">{{ one }}</p></div>
                     </div>
-                    <div class="Background_content">
-                        <p class="Background_title">Mechanism of action</p>
-                        <div class="Background_text"><p v-for="(one, i) in splitText(overView.mechanismOfActionOne)" :key="i">{{ one }}</p></div>
+                    <div class="Background_content" v-if="overView.rareSideEffects && overView.rareSideEffects != 'NA'">
+                        <!-- <p class="Background_title">Mechanism of action</p> -->
+                        <p class="Background_title">Rare Side Effect</p>
+                        <div class="Background_text"><p v-for="(one, i) in splitText(overView.rareSideEffects)" :key="i">{{ one }}</p></div>
                     </div>
                 </div>
             </div>
@@ -31,17 +32,17 @@
                         </div>
                         <div class="Background_content Detail_line">
                             <p class="Background_title">Actions</p>
-                            <p class="Background_text">{{ overView.actions }}</p>
+                            <p class="Background_text">{{ overView.moa }}</p>
                         </div>
                         <div class="Background_content Detail_line">
                             <!-- <p class="Background_title">Heavy chain type</p> -->
                             <p class="Background_title">Isotype</p>
                             <p class="Background_text">{{ overView.isotype }}</p>
                         </div>
-                        <div class="Background_content Detail_line">
+                        <!-- <div class="Background_content Detail_line">
                             <p class="Background_title">Bioavailability</p>
                             <p class="Background_text">{{ overView.bioavailability }}</p>
-                        </div>
+                        </div> -->
                         <div class="Background_content Detail_line">
                             <!-- <p class="Background_title">Generic Name</p> -->
                             <p class="Background_title">Internal Name</p>
@@ -71,10 +72,10 @@
                             <p class="Background_title">Target</p>
                             <p class="Background_text">{{ overView.target }}</p>
                         </div>
-                        <div class="Background_content Detail_line">
+                        <!-- <div class="Background_content Detail_line">
                             <p class="Background_title">Other Name</p>
                             <p class="Background_text">{{ overView.otherName }}</p>
-                        </div>
+                        </div> -->
                         <!-- <div class="Background_content Detail_line">
                             <p class="Background_title">Light chain type</p>
                             <p class="Background_text">{{ overView.lightChainType }}</p>
@@ -97,28 +98,30 @@
                 </div>
             </div>
 
-            <div class="antibodyDetail_box">
-                <p class="Detail_boxTitle">Toxicity and side effects</p>
+            <div class="antibodyDetail_box" v-if="(overView.toxicity && overView.toxicity != 'NA') || (overView.rareSideEffects && overView.rareSideEffects != 'NA')">
+                <!-- <p class="Detail_boxTitle">Toxicity and side effects</p> -->
+                <p class="Detail_boxTitle">Toxicity and side effect</p>
                 <div class="Background_box">
-                    <div class="Background_content Detail_line">
+                    <div class="Background_content Detail_line" v-if="overView.toxicity && overView.toxicity != 'NA'">
                         <p class="Background_title">Toxicity</p>
                         <div class="Background_text"><p v-for="(one, i) in splitText(overView.toxicity)" :key="i">{{ one }}</p></div>
                     </div>
-                    <div class="Background_content">
-                        <p class="Background_title">Mechanism ofaction</p>
-                        <div class="Background_text"><p v-for="(one, i) in splitText(overView.mechanismOfActionTwo)" :key="i">{{ one }}</p></div>
+                    <div class="Background_content" v-if="overView.rareSideEffects && overView.rareSideEffects != 'NA'">
+                        <!-- <p class="Background_title">Mechanism ofaction</p> -->
+                        <p class="Background_title">Rare Side Effect</p>
+                        <div class="Background_text"><p v-for="(one, i) in splitText(overView.rareSideEffects)" :key="i">{{ one }}</p></div>
                     </div>
                 </div>
             </div>
 
-            <div class="antibodyDetail_box">
+            <div class="antibodyDetail_box" v-if="overView.marketingUrl">
                 <p class="Detail_boxTitle">Marketing</p>
                 <div class="Background_box" style="padding: 20px;">
                     <img class="marketingUrl" style="width: 60%;display: block;margin: auto;" :src="overView.marketingUrl" alt="">
                 </div>
             </div>
 
-            <div class="antibodyDetail_box">
+            <div class="antibodyDetail_box" v-if="overView.history && overView.history != 'NA'">
                 <p class="Detail_boxTitle">History</p>
                 <div class="history_box">
                     <div class="history_content" v-for="(one, i) in splitText(overView.history)" :key="i">

src/view/overView/index.vue

@@ -320,7 +320,7 @@ export default {
 
           .images_text {
             font-size: 12px;
-            height: 20rpx;
+            height: 20px;
             white-space: nowrap; /* 防止文本换行 */
             overflow: hidden; /* 隐藏溢出的内容 */
             text-overflow: ellipsis;
@@ -329,7 +329,7 @@ export default {
           .images_footer {
             font-size: 12px;
             margin-top: 10px;
-            height: 20rpx;
+            height: 20px;
           }
 
           .icons-item-imgbox {