From 247f3fd0ea5ae30a96732f2409f51fcfc33a3c47 Mon Sep 17 00:00:00 2001
From: ynmlzdwsp <2727940448@qq.com>
Date: Thu, 4 Jan 2024 21:03:51 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E6=88=90=E6=9F=A5=E8=AF=A2=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD=E7=9A=84=E5=89=8D=E7=AB=AF=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/index.vue   |  86 ++++++++++++++++++++-----
 src/components/myAside.vue | 126 ++++++++++++++++++-------------------
 2 files changed, 134 insertions(+), 78 deletions(-)

diff --git a/src/components/index.vue b/src/components/index.vue
index 32567a4..b1d98dc 100644
--- a/src/components/index.vue
+++ b/src/components/index.vue
@@ -19,21 +19,38 @@
           <div slot="error" class="image-slot background-image-error"></div>
         </el-image>
 
-        <div>
-          <!-- 输入框 -->
-          <el-input v-model="inputValue1" placeholder="请输入内容"></el-input>
-          <el-input v-model="inputValue2" placeholder="请输入内容"></el-input>
-          <!-- 点击按钮 -->
-          <el-button @click="handleClick">点击</el-button>
-        </div>
-
         <!-- 首页文字 -->
         <div class="signature-wall myCenter my-animation-hideToShow">
           <h1 class="playful">
             <span v-for="(a, index) in $store.state.webInfo.webTitle" :key="index">{{a}}</span>
           </h1>
 
-
+          <!-- 搜索 -->
+          <div style="padding: 15px;border-radius: 10px;margin-top: 30px;animation: hideToShow 1s ease-in-out"
+               class="shadow-box background-opacity wow">
+            <div style="color: var(--lightGreen);font-size: 20px;font-weight: bold;margin-bottom: 10px">
+              查询DDI
+            </div>
+            <div style="display: flex">
+              <input class="ais-SearchBox-input" type="text"
+                     v-model="articleSearch"
+                     placeholder="请输入药品A名称" maxlength="32">
+              <div style="width: 10px"></div>
+              <input class="ais-SearchBox-input" type="text"
+                     v-model="articleSearch"
+                     placeholder="请输入药品B名称" maxlength="32">
+              <div class="ais-SearchBox-submit" @click="selectArticle()">
+                <svg style="margin-top: 3.5px;margin-left: 18px" viewBox="0 0 1024 1024" width="20" height="20">
+                  <path
+                    d="M51.2 508.8c0 256.8 208 464.8 464.8 464.8s464.8-208 464.8-464.8-208-464.8-464.8-464.8-464.8 208-464.8 464.8z"
+                    fill="#51C492"></path>
+                  <path
+                    d="M772.8 718.4c48-58.4 76.8-132.8 76.8-213.6 0-186.4-151.2-337.6-337.6-337.6-186.4 0-337.6 151.2-337.6 337.6 0 186.4 151.2 337.6 337.6 337.6 81.6 0 156-28.8 213.6-76.8L856 896l47.2-47.2-130.4-130.4zM512 776c-149.6 0-270.4-121.6-270.4-271.2S363.2 233.6 512 233.6c149.6 0 271.2 121.6 271.2 271.2C782.4 654.4 660.8 776 512 776z"
+                    fill="#FFFFFF"></path>
+                </svg>
+              </div>
+            </div>
+          </div>
 
           <div class="printer" @click="getGuShi()">
             <printer :printerInfo="printerInfo">
@@ -64,14 +81,34 @@
                 </div>
               </div>
               <articleList :articleList="articles"></articleList>
-              <div class="pagination-wrap">
-                <div @click="pageArticles()" class="pagination" v-if="pagination.total !== articles.length">
-                  下一页
+<!--              <div class="pagination-wrap">-->
+<!--                <div @click="pageArticles()" class="pagination" v-if="pagination.total !== articles.length">-->
+<!--                  下一页-->
+<!--                </div>-->
+<!--                <div v-else style="user-select: none">-->
+<!--                  ~~到底啦~~-->
+<!--                </div>-->
+<!--              </div>-->
+              <template>
+                <div class="pagination-wrap">
+                  <el-table :data="tableData">
+                    <el-table-column prop="drugA" label="药品A"></el-table-column>
+                    <el-table-column prop="drugB" label="药品B"></el-table-column>
+                    <el-table-column prop="interaction" label="相互作用效果"></el-table-column>
+                  </el-table>
+<!--                  <div @click="pageArticles()" class="pagination" v-if="pagination.total !== articles.length">-->
+<!--                    下一页-->
+<!--                  </div>-->
+
                 </div>
-                <div v-else style="user-select: none">
+                <div  style="user-select: none;text-align: center">
                   ~~到底啦~~
                 </div>
-              </div>
+
+              </template>
+
+
+
             </div>
           </div>
         </div>
@@ -120,7 +157,13 @@
           "author": "",
           "category": ""
         },
-        articles: []
+        articles: [],
+        tableData: [
+          { drugA: "丁螺环酮", drugB: "CYP3A4抑制药", interaction: '服用红霉素、咪唑类抗真菌药等CYP3A4抑制药后，再用本品可使其峰浓度升高，AUC增大' },
+          { drugA: "丁螺环酮", drugB: "乙醇和其他中枢抑制药", interaction: '丁螺环酮的代谢加快，使其抗焦虑作用降低' },
+          { drugA: "丁螺环酮", drugB: "伊曲康唑", interaction: '可使中枢抑制作用增强' },
+          { drugA: "丁螺环酮", drugB: "利福平", interaction: '伊曲康唑通过抑制CYP3A4而减少丁螺环酮的首过效应, 增加其生物利用度' }
+        ]
       };
     },
 
@@ -180,6 +223,7 @@
 
       async getArticles() {
         await this.$http.post(this.$constant.baseURL + "/article/listArticle", this.pagination)
+        // await this.$http.post("http://localhost:81" + "/system/table1/list", this.pagination)
           .then((res) => {
             if (!this.$common.isEmpty(res.data)) {
               this.articles = this.articles.concat(res.data.records);
@@ -414,6 +458,18 @@
     box-shadow: 0 0 5px var(--themeBackground);
   }
 
+  .ais-SearchBox-input {
+    padding: 0 14px;
+    height: 30px;
+    width: calc(100% - 50px);
+    outline: 0;
+    border: 2px solid var(--lightGreen);
+    border-right: 0;
+    border-radius: 40px;
+    color: var(--maxGreyFont);
+    background: var(--white);
+  }
+
   @media screen and (max-width: 1100px) {
     .recent-posts {
       width: 100%;
diff --git a/src/components/myAside.vue b/src/components/myAside.vue
index 81c36e2..81809e3 100644
--- a/src/components/myAside.vue
+++ b/src/components/myAside.vue
@@ -1,27 +1,27 @@
 <template>
   <div>
     <!-- 网站信息 -->
-    <div class="card-content1 shadow-box background-opacity">
-      <el-avatar style="margin-top: 20px" class="user-avatar" :size="120" :src="webInfo.avatar"></el-avatar>
-      <div class="web-name">{{webInfo.webName}}</div>
-      <div class="web-info">
-        <div class="blog-info-box">
-          <span>文章</span>
-          <span class="blog-info-num">{{ $store.getters.articleTotal }}</span>
-        </div>
-        <div class="blog-info-box">
-          <span>分类</span>
-          <span class="blog-info-num">{{ sortInfo.length }}</span>
-        </div>
-        <div class="blog-info-box">
-          <span>访问量</span>
-          <span class="blog-info-num">{{ webInfo.historyAllCount }}</span>
-        </div>
-      </div>
-      <a class="collection-btn" @click="showTip()">
-        <i class="el-icon-star-off" style="margin-right: 2px"></i>朋友圈
-      </a>
-    </div>
+<!--    <div class="card-content1 shadow-box background-opacity">-->
+<!--      <el-avatar style="margin-top: 20px" class="user-avatar" :size="120" :src="webInfo.avatar"></el-avatar>-->
+<!--      <div class="web-name">{{webInfo.webName}}</div>-->
+<!--      <div class="web-info">-->
+<!--        <div class="blog-info-box">-->
+<!--          <span>文章</span>-->
+<!--          <span class="blog-info-num">{{ $store.getters.articleTotal }}</span>-->
+<!--        </div>-->
+<!--        <div class="blog-info-box">-->
+<!--          <span>分类</span>-->
+<!--          <span class="blog-info-num">{{ sortInfo.length }}</span>-->
+<!--        </div>-->
+<!--        <div class="blog-info-box">-->
+<!--          <span>访问量</span>-->
+<!--          <span class="blog-info-num">{{ webInfo.historyAllCount }}</span>-->
+<!--        </div>-->
+<!--      </div>-->
+<!--      <a class="collection-btn" @click="showTip()">-->
+<!--        <i class="el-icon-star-off" style="margin-right: 2px"></i>朋友圈-->
+<!--      </a>-->
+<!--    </div>-->
 
     <!-- 搜索 -->
     <div style="padding: 15px;border-radius: 10px;margin-top: 30px;animation: hideToShow 1s ease-in-out"
@@ -32,7 +32,7 @@
       <div style="display: flex">
         <input class="ais-SearchBox-input" type="text"
                v-model="articleSearch"
-               placeholder="搜索文章" maxlength="32">
+               placeholder="搜索药品" maxlength="32">
         <div class="ais-SearchBox-submit" @click="selectArticle()">
           <svg style="margin-top: 3.5px;margin-left: 18px" viewBox="0 0 1024 1024" width="20" height="20">
             <path
@@ -111,46 +111,46 @@
     </div>
 
     <!-- 赞赏 -->
-    <div class="shadow-box-mini background-opacity wow admire-box"
-         v-if="!$common.isEmpty(admires)">
-      <div style="font-weight: bold;margin-bottom: 20px">🧨赞赏名单</div>
-      <div>
-        <vue-seamless-scroll :data="admires" style="height: 200px;overflow: hidden">
-          <div v-for="(item, i) in admires"
-               style="display: flex;justify-content: space-between"
-               :key="i">
-            <div style="display: flex">
-              <el-avatar style="margin-bottom: 10px" :size="36" :src="item.avatar"></el-avatar>
-              <div style="margin-left: 10px;height: 36px;line-height: 36px;overflow: hidden;max-width: 80px">
-                {{ item.username }}
-              </div>
-            </div>
-            <div style="height: 36px;line-height: 36px">
-              {{ item.admire }}元
-            </div>
-          </div>
-        </vue-seamless-scroll>
-      </div>
-      <div class="admire-btn" @click="showAdmire()">
-        赞赏
-      </div>
-    </div>
-
-    <!-- 微信 -->
-    <el-dialog title="赞赏"
-               :visible.sync="showAdmireDialog"
-               width="25%"
-               :append-to-body="true"
-               destroy-on-close
-               center>
-      <div>
-        <div class="admire-image"></div>
-        <div>
-          <div class="admire-content">1. 感谢老铁送来的666</div>
-          <div class="admire-content">2. 申请通过后会加博客交流群，不需要加群或者退群后会定期清理好友（强迫症福利）</div>
-        </div>
-      </div>
-    </el-dialog>
+<!--    <div class="shadow-box-mini background-opacity wow admire-box"-->
+<!--         v-if="!$common.isEmpty(admires)">-->
+<!--      <div style="font-weight: bold;margin-bottom: 20px">🧨赞赏名单</div>-->
+<!--      <div>-->
+<!--        <vue-seamless-scroll :data="admires" style="height: 200px;overflow: hidden">-->
+<!--          <div v-for="(item, i) in admires"-->
+<!--               style="display: flex;justify-content: space-between"-->
+<!--               :key="i">-->
+<!--            <div style="display: flex">-->
+<!--              <el-avatar style="margin-bottom: 10px" :size="36" :src="item.avatar"></el-avatar>-->
+<!--              <div style="margin-left: 10px;height: 36px;line-height: 36px;overflow: hidden;max-width: 80px">-->
+<!--                {{ item.username }}-->
+<!--              </div>-->
+<!--            </div>-->
+<!--            <div style="height: 36px;line-height: 36px">-->
+<!--              {{ item.admire }}元-->
+<!--            </div>-->
+<!--          </div>-->
+<!--        </vue-seamless-scroll>-->
+<!--      </div>-->
+<!--      <div class="admire-btn" @click="showAdmire()">-->
+<!--        赞赏-->
+<!--      </div>-->
+<!--    </div>-->
+
+<!--     微信 -->
+<!--    <el-dialog title="赞赏"-->
+<!--               :visible.sync="showAdmireDialog"-->
+<!--               width="25%"-->
+<!--               :append-to-body="true"-->
+<!--               destroy-on-close-->
+<!--               center>-->
+<!--      <div>-->
+<!--        <div class="admire-image"></div>-->
+<!--        <div>-->
+<!--          <div class="admire-content">1. 感谢老铁送来的666</div>-->
+<!--          <div class="admire-content">2. 申请通过后会加博客交流群，不需要加群或者退群后会定期清理好友（强迫症福利）</div>-->
+<!--        </div>-->
+<!--      </div>-->
+<!--    </el-dialog>-->
   </div>
 </template>
 
@@ -159,7 +159,7 @@
 
   export default {
     components: {
-      vueSeamlessScroll
+      // vueSeamlessScroll
     },
     data() {
       return {