Merge branch 'master' of http://101.43.33.174:8080/crs_20240527/crs-double-resistance

src/App.vue

@@ -10,13 +10,13 @@
         </div>
         <footerbox></footerbox>
       </div>
-      <div class="fixed-message" @click="dialogVisible = true">
+      <!-- <div class="fixed-message" @click="dialogVisible = true">
         <img src="@/assets/img/messageFixed.png" alt="">
         <div class="fixed-message-text">
           Contact with<br/>
           our experts
         </div>
-      </div>
+      </div> -->
     </div>
     <!-- loading -->
     <div class="loading" v-show="loading">

src/components/footerbox.vue

@@ -13,11 +13,11 @@
               </router-link></p>
               <!-- <p v-if="!$util.localeStorage()">沪ICP备15044189号-4</p> -->
             </div>
-            <div class="header_f header_none">
+            <!-- <div class="header_f header_none">
               <p class="header_text">{{$t('bottomBar.Products')}}</p>
               <p><router-link class="topage" to="/oneClickPlus">Design Antibody</router-link></p>
               <p><router-link class="topage" to="/AntigenPreparation">Design Antigen</router-link></p>
-            </div>
+            </div> -->
           </div>
           <div class="header_f header_none">
             <p class="header_text">{{$t('bottomBar.SocialMedia')}}</p>

src/view/antibody/index.vue

@@ -2,6 +2,77 @@
     <div class="box">
         <banner></banner>
         <p class="list_title">{{ $t("nav.AntibodyDatabase") }}</p>
+        <!-- 头部 -->
+        <div class="classificationMenu">
+        <div class="list list_pc">
+          <div class="SpeciesBox">
+            <!-- Name -->
+            <div class="list-s" v-if="nameObject.list.length">
+              <div class="list_tit">Name</div>
+              <div class="SpeciesBox_list2"  style="flex: 1;">
+                <el-checkbox-group
+                  style="flex: 1;"
+                  v-model="nameList"
+                  @change="nameChange"
+                >
+                  <el-checkbox class="list_checkbox" v-for="(item, index) in nameObject.show ? nameObject.list : nameObject.list.slice(0, 12)" :key="index" :label="item.name">
+                    <el-tooltip class="item" effect="dark" :content="item.name" placement="top-start" v-if="item.name.length > 20">
+                      <span> {{subString(item.sampleName, 20)}}</span>
+                    </el-tooltip>
+                    <span v-else>{{ item.sampleName }}</span>
+                    <!-- ({{ item.count }}) -->
+                  </el-checkbox>
+                </el-checkbox-group>
+              </div>
+              <img v-if="nameObject.show" class="SpeciesImg" src="@/assets/img/superscript.png" alt="" @click="nameObject.show = false">
+              <img v-else class="SpeciesImg" src="@/assets/img/subscript.png" alt="" @click="nameObject.show = true">
+            </div>
+            <!-- Target -->
+            <div class="list-s" v-if="targetObject.list.length">
+              <div class="list_tit">Target</div>
+              <div class="SpeciesBox_list2"  style="flex: 1;">
+                <el-checkbox-group
+                  style="flex: 1;"
+                  v-model="targetList"
+                  @change="targetChange"
+                >
+                  <el-checkbox class="list_checkbox" v-for="(item, index) in targetObject.show ? targetObject.list : targetObject.list.slice(0, 12)" :key="index" :label="item.name">
+                    <el-tooltip class="item" effect="dark" :content="item.name" placement="top-start" v-if="item.name.length > 20">
+                      <span> {{subString(item.sampleName, 20)}}</span>
+                    </el-tooltip>
+                    <span v-else>{{ item.sampleName }}</span>
+                    ({{ item.count }})
+                  </el-checkbox>
+                </el-checkbox-group>
+              </div>
+              <img v-if="targetObject.show" class="SpeciesImg" src="@/assets/img/superscript.png" alt="" @click="targetObject.show = false">
+              <img v-else class="SpeciesImg" src="@/assets/img/subscript.png" alt="" @click="targetObject.show = true">
+            </div>
+            <!-- Inventor -->
+            <div class="list-s" v-if="companyObject.list.length" style="border: none;">
+              <div class="list_tit">Inventor</div>
+              <div class="SpeciesBox_list2"  style="flex: 1;">
+                <el-checkbox-group
+                  style="flex: 1;"
+                  v-model="companyList"
+                  @change="companyChange"
+                >
+                  <el-checkbox class="list_checkbox" v-for="(item, index) in companyObject.show ? companyObject.list : companyObject.list.slice(0, 12)" :key="index" :label="item.name">
+                    <el-tooltip class="item" effect="dark" :content="item.name" placement="top-start" v-if="item.name.length > 20">
+                      <span> {{subString(item.sampleName, 20)}}</span>
+                    </el-tooltip>
+                    <span v-else>{{ item.sampleName }}</span>
+                    ({{ item.count }})
+                  </el-checkbox>
+                </el-checkbox-group>
+              </div>
+              <img v-if="companyObject.show" class="SpeciesImg" src="@/assets/img/superscript.png" alt="" @click="companyObject.show = false">
+              <img v-else class="SpeciesImg" src="@/assets/img/subscript.png" alt="" @click="companyObject.show = true">
+            </div>
+          </div>
+        </div>
+      </div>
+        <!-- 列表 -->
         <div class="article">
             <template>
                 <el-table
@@ -12,15 +83,12 @@
                     @row-click="gotoArticle">
                     <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 }}
-                        </span> -->
+                    <el-table-column prop="targetAbbreviation" :label="$t('AntibodyDatabase.Target')" width="400">
+                      <!-- <template slot-scope="scope">
                         <span>{{ $util.targetDictionaries(scope.row.productTarget) }}</span>
-                      </template>
+                      </template> -->
                     </el-table-column>
-                    <el-table-column prop="moa" :label="$t('AntibodyDatabase.MOA')" />
+                    <!-- <el-table-column prop="moa" :label="$t('AntibodyDatabase.MOA')" /> -->
                     <el-table-column prop="company" :label="$t('AntibodyDatabase.Inventor')"/>
                 </el-table>
             </template>
@@ -40,7 +108,7 @@
                         <span>{{ $util.targetDictionaries(scope.row.target) }}</span>
                       </template>
                     </el-table-column>
-                    <el-table-column prop="moa" :label="$t('AntibodyDatabase.MOA')" />
+                    <!-- <el-table-column prop="moa" :label="$t('AntibodyDatabase.MOA')" /> -->
                     <el-table-column prop="company" :label="$t('AntibodyDatabase.Inventor')" />
                 </el-table>
             </template>
@@ -56,13 +124,62 @@ export default {
   },
   data() {
     return {
-      overView: []
+      overView: [],
+      nameObject: {
+        name: "Inventor",
+        list: "",
+        show: false
+      },
+      targetObject: {
+        name: "Inventor",
+        list: "",
+        show: false
+      },
+      companyObject: {
+        name: "Inventor",
+        list: "",
+        show: false
+      },
+      checkList: [],
+      nameList: [],
+      targetList: [],
+      companyList: []
     };
   },
   methods: {
+    tapSuperscript(i) {
+      this.speciesList[i].show = !this.speciesList[i].show;
+    },
+    // 搜索
+    nameChange(e) {
+      console.log(e);
+      this.nameList = e
+      this.changeSearchAll()
+    },
+    targetChange(e) {
+      console.log(e);
+      this.targetList = e
+      this.changeSearchAll()
+    },
+    companyChange(e) {
+      console.log(e);
+      this.companyList = e
+      this.changeSearchAll()
+    },
+    // 字符串截取
+    subString (str, len) {
+      if (str.length > len) {
+        return str.substring(0, len) + '...'
+      } else {
+        return str
+      }
+    },
     changeSearchAll() {
       this.$api.post("/basb/searchAll", {
-        articleFlag: 0
+        articleFlag: 0,
+        nameList: this.nameList,
+        targetList: this.targetList,
+        companyList: this.companyList
       }).then(res => {
         console.log(res)
         this.overView = res.data
@@ -77,11 +194,24 @@ export default {
           id: row.id
         }
       });
+    },
+    // 获取双特异性抗体-针对database获取统计信息
+    getDoubleInfo() {
+      this.$api.post("/basb/searchStatisticForDatabase", {}).then(res => {
+        console.log(res)
+        if (res.code == 0) {
+          // this.species = res.data
+          this.nameObject.list = res.data.nameList
+          this.targetObject.list = res.data.targetList
+          this.companyObject.list = res.data.companyList
+        }
+      })
     }
   },
   mounted() {},
   created() {
     this.changeSearchAll()
+    this.getDoubleInfo()
   }
 };
 </script>
@@ -119,6 +249,105 @@ export default {
       .articleMove{
         display: none;
       }
+      // 筛选项
+      .classificationMenu {
+        width: 1200px;
+        margin: 20px auto;
+        .list {
+          display: flex;
+          align-content: center;
+          .list-name {
+            width: 190px;
+            min-height: 40px;
+            background: #dff3ff;
+            font-size: 16px;
+            font-family: Arial;
+            color: #000;
+            padding-left: 20px;
+            display: flex;
+            align-items: center;
+          }
+          .SpeciesBox{
+            flex: 1;
+            background: #F7FAFF;
+            position: relative;
+            .SpeciesImg{
+              position: absolute;
+              right: 10px;
+              bottom: 10px;
+              width: 15px;
+              height: 15px;
+              cursor: pointer;
+            }
+          }
+          .list-s /deep/ {
+            display: flex;
+            // align-items: flex-start;
+            align-items: center;
+            position: relative;
+            border-bottom: 1px solid #E3F1FF;
+            padding: 10px 0;
+            .list_tit{
+              width: 260px;
+              text-align: center;
+            }
+            .list_checkbox{
+              width: 23%;
+            }
+            .SpeciesBox_list{
+              max-height: 240px;
+              overflow-y: auto;
+            }
+            .el-checkbox {
+              padding: 6px 0;
+              margin-right: 10px !important;
+              .el-checkbox__label {
+                font-size: 14px;
+                font-family: Arial;
+                color: #6f6f6f;
+              }
+            }
+            .is-checked {
+              .el-checkbox__label {
+                color: #005bab;
+              }
+            }
+            .top_img {
+              position: absolute;
+              top: 50%;
+              right: 16px;
+              transform: translateY(-50%);
+              width: 24px;
+              cursor: pointer;
+            }
+            .purple_img {
+              display: flex;
+              align-items: center;
+              background: #ffffff;
+              border-radius: 2px;
+              border: 1px solid #005bab;
+              padding: 6px 10px;
+              cursor: pointer;
+              .icon {
+                width: 26px;
+              }
+              .name {
+                font-size: 14px;
+                font-family: Arial;
+                color: #005bab;
+              }
+            }
+            .active {
+              background: #005bab;
+              border-radius: 2px;
+              border: 1px solid #005bab;
+              .name {
+                color: #fff;
+              }
+            }
+          }
+        }
+      }
     }
   }
   @media screen and (min-width: 0px) and (max-width: 750px) {
@@ -150,6 +379,10 @@ export default {
             cursor: pointer;
         }
       }
+      // 筛选项
+      .classificationMenu {
+       display: none;
+      }
     }
   }
   </style>

src/view/antibodyDetail/index.vue

@@ -30,10 +30,10 @@
                             <p class="Background_title">Company</p>
                             <p class="Background_text">{{ overView.company }}</p>
                         </div>
-                        <div class="Background_content Detail_line">
+                        <!-- <div class="Background_content Detail_line">
                             <p class="Background_title">Actions</p>
                             <p class="Background_text">{{ overView.moa }}</p>
-                        </div>
+                        </div> -->
                         <div class="Background_content Detail_line">
                             <!-- <p class="Background_title">Heavy chain type</p> -->
                             <p class="Background_title">Isotype</p>
@@ -64,10 +64,10 @@
                             <p class="Background_title">Brand names</p>
                             <p class="Background_text">{{ overView.brandNames }}</p>
                         </div>
-                        <div class="Background_content Detail_line">
+                        <!-- <div class="Background_content Detail_line">
                             <p class="Background_title">Biologic Classification</p>
                             <p class="Background_text">{{ overView.biologicClassification }}</p>
-                        </div>
+                        </div> -->
                         <div class="Background_content Detail_line">
                             <p class="Background_title">Target</p>
                             <p class="Background_text">{{ overView.target }}</p>

src/view/home/index.vue

@@ -2,18 +2,28 @@
   <div class="box">
       <div class="banner_box">
         <div class="hoem_box">
-          <img class="backout_img" src="@/assets/img/home/home5.jpg" alt="" srcset="" />
+          <img class="backout_img" src="@/assets/img/home/banner2.jpg" alt="" srcset="" />
           <img class="backout_img_move" src="@/assets/img/home/home4.jpg" alt="" srcset="" />
           <div class="banner_content">
             <p class="banner_t">SY-CRS-BsAb</p>
-            <!-- <p class="banner_c">Sanyou Bispecific Reference Antibody Catalog is generated through our proprietary high-quality bispecific antibody preparation platform, which include majority bispecific antibody drugs that have been approved for market release, and representative drugs in different clinical stages.</p> -->
+            <div class="banner_c">
+              <div class="banner_list" v-for="(item, index) in bannerTabList" :key="index" :class="index > 0 ? 'banner_list2' : ''">
+                <div class="ba_l">
+                  <img class="ba_img" :src="item.img" alt="" />
+                </div>
+                <div class="ba_rig">
+                  <div class="ba_tit">{{ item.title }}</div>
+                  <p class="rig_c" v-html="item.content"></p>
+                </div>
+              </div>
+            </div>
           </div>
         </div>
       </div>
       <!-- 数据 -->
       <div class="list">
         <el-row :gutter="60" class="type_f">
-          <el-col :span="8" v-for="(item, index) in tabList" :key="index">
+          <el-col :span="6" v-for="(item, index) in tabList" :key="index">
             <div class="list_b" @click="$util.goRoute({ name: item.url })">
               <img
                 class="list_img"
@@ -51,6 +61,12 @@ export default {
   data() {
     return {
       tabList: [
+        {
+          id: 1,
+          url: "configuration",
+          img: require("@/assets/img/home/6-19.png"),
+          name: "Overview"
+        },
         {
           id: 1,
           url: "configuration",
@@ -66,9 +82,35 @@ export default {
         {
           id: 3,
           url: "",
-          img: require("@/assets/img/home/home3.png"),
+          img: require("@/assets/img/home/6-20.png"),
           name: "BsAb Reference Catalog "
         }
+      ],
+      bannerTabList: [
+        {
+          id: 1,
+          img: require("@/assets/img/home/m-03.png"),
+          title: "10+",
+          content: "Years experience of antibody discovery"
+        },
+        {
+          id: 2,
+          img: require("@/assets/img/home/m-04.png"),
+          title: "1500+",
+          content: "Customer <br/> services"
+        },
+        {
+          id: 3,
+          img: require("@/assets/img/home/m-05.png"),
+          title: "20000+",
+          content: "Dedicated <br/> R&D area"
+        },
+        {
+          id: 4,
+          img: require("@/assets/img/home/m-06.png"),
+          title: "100000+",
+          content: "Antibodies <br/> production"
+        }
       ]
     };
   },
@@ -108,13 +150,54 @@ export default {
           font-size: 48px;
         }
         .banner_c{
-          width: 600px;
+          width: 1200pX;
           font-size: 14px;
           line-height: 18px;
           font-weight: 400;
+          margin: auto;
           font-family: Source Han Sans CN;
           margin-top: 20px;
           word-wrap:break-word;
+          display: flex;
+          align-items: center;
+          .banner_list{
+            width: 200px;
+            padding: 10px;
+            border-radius: 7px;
+            border: 2px solid #007DDD;
+            display: flex;
+            align-items: center;
+            margin-right: 10px;
+            .ba_l{
+              width: 35px;
+              margin-right: 10px;
+              .ba_img{
+                width: 100%;
+              }
+            }
+            .ba_rig{
+              flex: 1;
+              .ba_tit{
+                text-align: center;
+                font-family: Source Han Sans CN;
+                font-weight: bold;
+                font-size: 16px;
+                color: #00F6FF;
+                line-height: 29px;
+              }
+              .rig_c{
+                font-family: Source Han Sans CN;
+                font-weight: 400;
+                font-size: 14px;
+                color: #FFFFFF;
+                line-height: 17px;
+                text-align: center;
+              }
+            }
+          }
+          .banner_list2{
+            width: 160px;
+          }
         }
       }
       .backout_img_move{
@@ -303,9 +386,10 @@ export default {
           font-size: 0.2rem;
         }
         .banner_c{
-          font-size: 0.1rem;
-          margin-top: 0.1rem;
-          word-wrap:break-word;
+          // font-size: 0.1rem;
+          // margin-top: 0.1rem;
+          // word-wrap:break-word;
+          display: none;
         }
       }
       .backout_img{

src/view/privacyPolicy/index.vue

@@ -264,6 +264,7 @@ export default {
 .box{
   overflow: hidden;
   margin-bottom: 0.36rem;
+  padding: 0 10px;
 }
 .topbox{
   // margin-bottom: 1.5rem;