From 96786804c393a2733ac497381cd1aeeb8b227eac Mon Sep 17 00:00:00 2001
From: dhy1725534722 <1725534722@qq.com>
Date: Wed, 2 Aug 2023 15:03:13 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E4=BB=A3=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env.development                |   8 +-
 src/App.vue                     |  30 ++-
 src/api/archives/cosmetics.js   |  11 ++
 src/api/archives/toLogin.js     |  21 ++
 src/api/index.js                |  16 +-
 src/permission.js               |  81 ++++----
 src/utils/request.js            |   2 +-
 src/utils/request2.js           |   2 +-
 src/views/censor/index.vue      |  16 +-
 src/views/netWorkStat/index.vue | 331 ++++++++++++++++++++++++++++++++
 vue.config.js                   |  19 +-
 11 files changed, 445 insertions(+), 92 deletions(-)
 create mode 100644 src/api/archives/cosmetics.js
 create mode 100644 src/api/archives/toLogin.js
 create mode 100644 src/views/netWorkStat/index.vue

diff --git a/.env.development b/.env.development
index fc5c371..c737ca5 100644
--- a/.env.development
+++ b/.env.development
@@ -3,12 +3,8 @@ VUE_APP_TITLE = 产品档案管理系统
 
 # 开发环境配置
 ENV = 'development'
-
-# 检查员管理系统/开发环境
-VUE_APP_BASE_API = 'https://vue.ruoyi.vip/prod-api'
-# 自己公司
-VUE_APP_BASE_API2 = ''
-VUE_APP_BASE_API3 = '/configApi/'
+# 开发环境
+VUE_APP_BASE_API = '/configApi'
 VUE_APP_PREFIX =''
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true
diff --git a/src/App.vue b/src/App.vue
index 29de49f..615b10c 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -11,14 +11,28 @@ import ThemePicker from "@/components/ThemePicker";
 export default {
   name: "App",
   components: { ThemePicker },
-    metaInfo() {
-        return {
-            title: this.$store.state.settings.dynamicTitle && this.$store.state.settings.title,
-            titleTemplate: title => {
-                return title ? `${title} - ${process.env.VUE_APP_TITLE}` : process.env.VUE_APP_TITLE
-            }
-        }
-    }
+  metaInfo() {
+    return {
+      title:
+        this.$store.state.settings.dynamicTitle &&
+        this.$store.state.settings.title,
+      titleTemplate: (title) => {
+        return title
+          ? `${title} - ${process.env.VUE_APP_TITLE}`
+          : process.env.VUE_APP_TITLE;
+      },
+    };
+  },
+  mounted(){
+    setTimeout(async () => {
+      let Authentication = await this.$api.toLogin.frimLogin();
+      console.log(Authentication);
+      localStorage.setItem(
+        "Authentication",
+        Authentication.data.result.userToken
+      );
+    }, 1000);
+  }
 };
 </script>
 <style scoped>
diff --git a/src/api/archives/cosmetics.js b/src/api/archives/cosmetics.js
new file mode 100644
index 0000000..b43cad3
--- /dev/null
+++ b/src/api/archives/cosmetics.js
@@ -0,0 +1,11 @@
+import request from "@/utils/request2";
+export default {
+    //获取
+    getList(query) {
+        return request({
+            url: "/inspectorAssign",
+            method: "GET",
+            params: query,
+        });
+    }
+}
diff --git a/src/api/archives/toLogin.js b/src/api/archives/toLogin.js
new file mode 100644
index 0000000..5449c5d
--- /dev/null
+++ b/src/api/archives/toLogin.js
@@ -0,0 +1,21 @@
+import request from "@/utils/request2";
+export default {
+    // 登录
+    frimLogin() {
+        return request({
+            // baseURL: process.env.VUE_APP_USER_LOGIN,
+            url: "/pharmaceuticals/login",
+            headers: {
+                "Content-Type": "application/json",
+                isToken: true,
+                repeatSubmit: false,
+            },
+            method: "POST",
+            timeout: 60000,
+            data: {
+                pdma: "MTExMTEx",
+                urne: "2112042170015",
+            },
+        });
+    },
+}
\ No newline at end of file
diff --git a/src/api/index.js b/src/api/index.js
index 6a9729e..34b2288 100644
--- a/src/api/index.js
+++ b/src/api/index.js
@@ -1,16 +1,4 @@
-import training from './myapi/training/index.js'
-import work from './myapi/work/index.js'
-import traits from './myapi/traits/index.js'
-import screenLeft from './myapi/screenLeft/index.js'
-import infoMsg from './myapi/infoMsg/index.js'
-import jiangcheng from './myapi/jiangcheng/index.js'
-import pinren from './myapi/pinren/index.js'
+import toLogin from "./archives/toLogin";
 export default {
-    training,
-    work,
-    traits,
-    screenLeft,
-    infoMsg,
-    jiangcheng,
-    pinren
+    toLogin
 };
\ No newline at end of file
diff --git a/src/permission.js b/src/permission.js
index fe7f4b5..fa52238 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -13,8 +13,8 @@ function kickOut() {
 }
 NProgress.configure({ showSpinner: false });
 const whiteList = [
-  "/login",
-  "/register",
+  // "/login",
+  // "/register",
   "/index",
   '/drugArchives',
   '/cosmeticsArchives',
@@ -35,45 +35,46 @@ router.beforeEach((to, from, next) => {
       next();
     }
   } else {
+    next()
     // 没有token
-    if (whiteList.indexOf(to.path) !== -1) {
-      next()
-      // let token = localStorage.getItem("MSSM-LIAONING__TOKEN");
-      // if (token) {
-      //   if (store.state.myselfPermission.routerList.length > 0) {
-      //     let current = store.state.myselfPermission.routerList.filter(
-      //       (item) => item.path == to.path || from.path == "/"
-      //     );
-      //     if (current.length > 0) {
-      //       next();
-      //     } else {
-      //       next();
-      //       // Message.error("无权限访问！");
-      //     }
-      //   } else {
-      //     store
-      //       .dispatch("GetPermission")
-      //       .then((res) => {
-      //         console.log(res);
-      //         if (res.length > 0) {
-      //           next({ path: res });
-      //         } else {
-      //           kickOut();
-      //         }
-      //       })
-      //       .catch((error) => {
-      //         kickOut();
-      //       });
-      //   }
-      // } else {
-      //   //没有token踢出去
-      //   Message.error("获取令牌失败！");
-      //   kickOut();
-      // }
-    } else {
-      // kickOut();
-      NProgress.done();
-    }
+    // if (whiteList.indexOf(to.path) !== -1) {
+    //   next()
+    //   let token = localStorage.getItem("MSSM-LIAONING__TOKEN");
+    //   if (token) {
+    //     if (store.state.myselfPermission.routerList.length > 0) {
+    //       let current = store.state.myselfPermission.routerList.filter(
+    //         (item) => item.path == to.path || from.path == "/"
+    //       );
+    //       if (current.length > 0) {
+    //         next();
+    //       } else {
+    //         next();
+    //         // Message.error("无权限访问！");
+    //       }
+    //     } else {
+    //       store
+    //         .dispatch("GetPermission")
+    //         .then((res) => {
+    //           console.log(res);
+    //           if (res.length > 0) {
+    //             next({ path: res });
+    //           } else {
+    //             kickOut();
+    //           }
+    //         })
+    //         .catch((error) => {
+    //           kickOut();
+    //         });
+    //     }
+    //   } else {
+    //     //没有token踢出去
+    //     Message.error("获取令牌失败！");
+    //     kickOut();
+    //   }
+    // } else {
+    //   // kickOut();
+    //   NProgress.done();
+    // }
   }
 });
 
diff --git a/src/utils/request.js b/src/utils/request.js
index 7ad655e..43e773b 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -15,7 +15,7 @@ axios.defaults.headers["Content-Type"] = "application/json;charset=utf-8";
 // 创建axios实例
 const service = axios.create({
   // axios中请求配置有baseURL选项，表示请求URL公共部分
-  baseURL: location.origin + process.env.VUE_APP_BASE_API3,
+  baseURL: location.origin + process.env.VUE_APP_BASE_API,
   // 超时
   timeout: 15000,
 });
diff --git a/src/utils/request2.js b/src/utils/request2.js
index 4f534b5..c905591 100644
--- a/src/utils/request2.js
+++ b/src/utils/request2.js
@@ -15,7 +15,7 @@ axios.defaults.headers["Content-Type"] = "application/json;charset=utf-8";
 // 创建axios实例
 const service = axios.create({
   // axios中请求配置有baseURL选项，表示请求URL公共部分
-  baseURL: location.origin + process.env.VUE_APP_BASE_API2,
+  baseURL: location.origin + process.env.VUE_APP_BASE_API,
   // 超时
   timeout: 15000,
 });
diff --git a/src/views/censor/index.vue b/src/views/censor/index.vue
index 423a205..4012bb0 100644
--- a/src/views/censor/index.vue
+++ b/src/views/censor/index.vue
@@ -398,14 +398,14 @@
 import { Loading } from "element-ui";
 var downloadLoadingInstance;
 import userMsgPage from "../userMsgPage/index2.vue";
-import {
-  getList,
-  uploadFile,
-  dictList,
-  updataRow,
-  exportFile,
-  exportExcel,
-} from "@/api/jcy";
+// import {
+//   getList,
+//   uploadFile,
+//   dictList,
+//   updataRow,
+//   exportFile,
+//   exportExcel,
+// } from "@/api/jcy";
 import gridsTitle from "../components/gridsTitle";
 
 export default {
diff --git a/src/views/netWorkStat/index.vue b/src/views/netWorkStat/index.vue
new file mode 100644
index 0000000..7aa204f
--- /dev/null
+++ b/src/views/netWorkStat/index.vue
@@ -0,0 +1,331 @@
+<template>
+  <div class="container">
+    <div class="right-content">
+      <div class="tabs">
+        <el-tabs
+          v-model="activeName"
+          style="color: #edeef0"
+        >
+          <el-tab-pane label="查询条件" name="first">
+            <div class="screen">
+              <div class="task-name">
+                <span class="task-name-text">全文检索：</span>
+                <div class="task-input">
+                  <el-input
+                    v-model="queryCondition.fullTextSearch"
+                    placeholder="请输入内容"
+                  ></el-input>
+                </div>
+              </div>
+              <div class="task-name">
+                <span class="task-name-text">企业名称：</span>
+                <div class="task-input">
+                  <el-input
+                    v-model="queryCondition.firmName"
+                    placeholder="请输入内容"
+                  ></el-input>
+                </div>
+              </div>
+              <div class="task-name">
+                <span class="task-name-text">批准文号：</span>
+                <div class="task-input">
+                  <el-input
+                    v-model="queryCondition.approvalNumber"
+                    placeholder="请输入内容"
+                  ></el-input>
+                </div>
+              </div>
+              <div class="task-name">
+                <span class="task-name-text">处方内容：</span>
+                <div class="task-input">
+                  <el-input
+                    v-model="queryCondition.PrescriptionContent"
+                    placeholder="请输入内容"
+                  ></el-input>
+                </div>
+              </div>
+              <div class="task-name">
+                <span class="task-name-text">功能主治：</span>
+                <div class="task-input">
+                  <el-input
+                    v-model="queryCondition.majorFunction"
+                    placeholder="请输入内容"
+                  ></el-input>
+                </div>
+              </div>
+              <div class="task-name">
+                <span class="task-name-text">产品名称：</span>
+                <div class="task-input">
+                  <el-input
+                    v-model="queryCondition.taskName"
+                    placeholder="请输入内容"
+                  ></el-input>
+                </div>
+              </div>
+              <div class="time-interval">
+                <div class="interval-text">
+                  批号有效期：
+                </div>
+                <div class="interval-select">
+                  <div class="star-time">
+                    <el-date-picker
+                      v-model="queryCondition.startTime"
+                      type="datetime"
+                      align="right"
+                      :clearable="false"
+                      format="yyyy-MM-dd HH:mm:ss"
+                      value-format="yyyy-MM-dd HH:mm:ss"
+                      placeholder="请选择开始时间"
+                    >
+                    </el-date-picker>
+                    <!-- <i class="el-icon-date data_icon"></i> -->
+                  </div> 
+                  <!-- <i class="el-icon-sort-up"></i> -->
+                  <div class="symbol">~</div>
+                  <div class="end-time">
+                    <el-date-picker
+                      v-model="queryCondition.endTime"
+                      type="datetime"
+                      align="right"
+                      :clearable="false"
+                      format="yyyy-MM-dd HH:mm:ss"
+                      value-format="yyyy-MM-dd HH:mm:ss"
+                      placeholder="请选择结束时间"
+                    >
+                    </el-date-picker>
+                    <i class="el-icon-date data_icon"></i>
+                  </div>
+                </div>
+              </div>
+              <div class="task-name">
+                <span class="task-name-text">产品标签：</span>
+                <div class="task-checkbox">
+                  <el-checkbox-group v-model="queryCondition.checkList">
+                    <el-checkbox label="全部"></el-checkbox>
+                    <el-checkbox label="百年产品"></el-checkbox>
+                    <el-checkbox label="疗效显著"></el-checkbox>
+                    <el-checkbox label="无刺激"></el-checkbox>
+                  </el-checkbox-group>
+                </div>
+              </div>
+              <div class="task-name">
+                <span class="task-name-text">产品筛选：</span>
+                <div class="task-checkbox">
+                  <el-checkbox-group v-model="queryCondition.checkListTwo">
+                    <el-checkbox label="全部"></el-checkbox>
+                    <el-checkbox :label="'药品' + drugnum"></el-checkbox>
+                    <el-checkbox label="医疗器械"></el-checkbox>
+                    <el-checkbox label="化妆品"></el-checkbox>
+                  </el-checkbox-group>
+                </div>
+              </div>
+            </div>
+          </el-tab-pane>
+        </el-tabs>
+      </div>
+      
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  components: {
+  },
+  data() {
+    return {
+      drugnum:"(20)",
+      activeName: "first",
+      queryCondition:{
+        fullTextSearch:"",             // 全文检索
+        firmName:"",                   // 企业名称
+        approvalNumber:"",             // 批准文号
+        taskName:"",                   // 产品名称
+        PrescriptionContent:"",        // 处方内容
+        majorFunction:"",              // 功能主治
+        startTime:"",                  // 开始日期
+        endTime:"",                    // 结束日期
+        checkList:[],
+        checkListTwo:[],
+      },
+    };
+  },
+  mounted() {},
+  methods: {},
+};
+</script>
+
+<style lang="scss" scoped>
+.container {
+  height: 100%;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  background: #f2f2f2;
+  padding: 10px;
+  & > div {
+    flex: 1;
+    height: 100%;
+  }
+  & > div:nth-child(2) {
+    flex: 2;
+    margin: 0 10px;
+  }
+  .middle {
+    height: 100%;
+    background: #ffff;
+    border-radius: 8px;
+    overflow: hidden;
+  }
+  .left,
+  .right {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    & > div {
+      width: 100%;
+      border-radius: 8px;
+      flex: 1;
+      background: #ffffff;
+    }
+  }
+  .middle-box {
+    margin: 10px;
+  }
+
+  .main {
+    height: calc(100% - 40px);
+  }
+  .right-content {
+    background-color: #fff;
+    ::v-deep .el-tabs__header{
+      margin: 0;
+      .el-tabs__nav-scroll {
+        padding-left: 15px;
+        padding-top: 3px;
+      }
+      .el-tabs__item {
+        font-size: 18px;
+        font-family: Source Han Sans SC-Bold, Source Han Sans SC;
+        font-weight: bold;
+        color: #323233;
+      }
+      .el-tabs__active-bar {
+        background-color: #1349C5;
+        height: 2px;
+        border-radius: 0px 0px 0px 0px;
+      }
+    }
+    .tabs {
+      background: rgba(255, 255, 255, 0.9);
+      box-shadow: 0px 0px 12px 0px rgba(194, 212, 226, 0.64);
+      border-radius: vw(10);
+      min-height: 90vh;
+      // padding-top: 3px;
+      // padding-left: 15px;
+    }
+    .screen {
+      padding: 15px 0 26px 28px;
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      .task-name {
+        display: flex;
+        align-items: center;
+        margin-right: 30px;
+        .task-name-text {
+          font-size: 16px;
+          font-family: Source Han Sans CN;
+          font-weight: 400;
+          color: #6a6c6f;
+          line-height: 50px;
+          // margin-right: vw(10);
+        }
+        .task-input {
+          width: 251px;
+          height: 32px;
+          ::v-deep .el-input {
+            width: 251px;
+            height: 32px;
+          }
+          ::v-deep .el-input__inner {
+            width: 100%;
+            height: 100%;
+            font-size: 16px;
+            font-family: Source Han Sans CN;
+            font-weight: 400;
+            // color: #B1B6BF;
+            line-height: 50px;
+            padding-left: 15px;
+          }
+        }
+      }
+      .time-interval {
+        display: flex;
+        align-items: center;
+        margin-right: 20px;
+        .interval-text {
+          font-size: 16px;
+          font-family: Source Han Sans CN;
+          font-weight: 400;
+          color: #6a6c6f;
+          // line-height: 50px;
+          // margin-right: vw(10);
+        }
+        .interval-select {
+          display: flex;
+          align-items: center;
+          border: 1px solid #dbe0e8;
+          border-radius: 4px;
+          height: 32px;
+          .star-time,
+          .end-time {
+            position: relative;
+            .data_icon {
+              position: absolute;
+              top: 50%;
+              right: 17px;
+              z-index: 9;
+              color: #c0c4cc;
+              font-size: 14px;
+              transform: translateY(-50%);
+            }
+            ::v-deep .el-input__prefix {
+              display: none;
+            }
+            ::v-deep .el-input {
+              width: 243px;
+              height: 30px;
+            }
+            ::v-deep .el-input__inner {
+              width: 100%;
+              height: 100%;
+              font-size: 16px;
+              font-family: Source Han Sans CN;
+              font-weight: 400;
+              // color: #B1B6BF;
+              line-height: 30px;
+              padding-left: 15px;
+              border: none;
+              cursor: pointer;
+            }
+          }
+          .symbol {
+            background: rgba(219, 224, 232, 0.5);
+            width: 40px;
+            height: 30px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 16px;
+            font-family: Source Han Sans CN;
+            font-weight: 400;
+            color: #292f38;
+            line-height: 28px;
+          }
+        }
+      }
+    }
+  }
+}
+</style>
diff --git a/vue.config.js b/vue.config.js
index 821e41d..e9f6f06 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -42,21 +42,12 @@ module.exports = {
     open: true,
     proxy: {
       "/configApi": {
-        target: "https://dev-mssm-liaoning.imian.org.cn/api/admin",
+        target: "https://dev-mssm-liaoning.imian.org.cn/ggfw-api",
         changeOrigin: true,
         pathRewrite: {
           "^/configApi": "",
         },
       },
-      // detail: https://cli.vuejs.org/config/#devserver-proxy
-      [process.env.VUE_APP_BASE_API2]: {
-        target: `http://192.168.0.105:9026/inspector`,
-        // target: `https://dev-mssm-liaoning.imian.org.cn/api/inspector/inspector`,
-        changeOrigin: true,
-        pathRewrite: {
-          ["^" + process.env.VUE_APP_BASE_API2]: "",
-        },
-      },
     },
     disableHostCheck: true,
   },
@@ -142,10 +133,10 @@ module.exports = {
         },
       });
       config.optimization.runtimeChunk("single"),
-        {
-          from: path.resolve(__dirname, "./public/robots.txt"), //防爬虫文件
-          to: "./", //到根目录下
-        };
+      {
+        from: path.resolve(__dirname, "./public/robots.txt"), //防爬虫文件
+        to: "./", //到根目录下
+      };
     });
   },
 };

From 3b68db049910e038aad37885d820b3c319d0d9fd Mon Sep 17 00:00:00 2001
From: dhy1725534722 <1725534722@qq.com>
Date: Wed, 2 Aug 2023 15:25:18 +0800
Subject: [PATCH 2/2] =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E6=9B=B4=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/cosmeticsFile/medical.vue           |   9 +-
 .../components/cosmeticsArchives.vue          | 832 +++++++++++-------
 src/views/productsMsg/components/health.vue   | 550 +++++++++++-
 3 files changed, 1044 insertions(+), 347 deletions(-)

diff --git a/src/views/cosmeticsFile/medical.vue b/src/views/cosmeticsFile/medical.vue
index 3d860b6..45d348c 100644
--- a/src/views/cosmeticsFile/medical.vue
+++ b/src/views/cosmeticsFile/medical.vue
@@ -432,6 +432,10 @@ export default {
   width: 82%;
   padding: 0;
 }
+::v-deep .el-input {
+  width: 50% !important;
+  margin-left: 25px;
+}
 ::v-deep .el-dialog:not(.is-fullscreen) {
   margin-bottom: 1vh !important;
 }
@@ -489,8 +493,5 @@ export default {
 .el-radio {
   margin-top: 10px;
 }
-.el-input {
-  width: 50% !important;
-  margin-left: 25px;
-}
+
 </style>
\ No newline at end of file
diff --git a/src/views/productsMsg/components/cosmeticsArchives.vue b/src/views/productsMsg/components/cosmeticsArchives.vue
index b79abf1..3d22b30 100644
--- a/src/views/productsMsg/components/cosmeticsArchives.vue
+++ b/src/views/productsMsg/components/cosmeticsArchives.vue
@@ -1,341 +1,370 @@
 <template>
   <div class="container">
-    <div class="tabs">
-      <div class="headerText">
-        <div class="searchP">查询条件</div>
-      </div>
-      <div class="screen">
-        <div class="task-name">
-          <span class="task-name-text">产品名称：</span>
-          <div class="task-input">
-            <el-input
-              v-model="queryCondition.firmName"
-              placeholder="请输入内容"
-            ></el-input>
-          </div>
-        </div>
-        <div class="task-name">
-          <span class="task-name-text">备案编码：</span>
-          <div class="task-input">
-            <el-input
-              v-model="queryCondition.PrescriptionContent"
-              placeholder="请输入内容"
-            ></el-input>
-          </div>
-        </div>
-        <div class="task-name">
-          <span class="task-name-text">生产企业：</span>
-          <div class="task-input">
-            <el-input
-              v-model="queryCondition.majorFunction"
-              placeholder="请输入内容"
-            ></el-input>
-          </div>
-        </div>
-      </div>
-      <div class="footBox">
-        <el-button icon="el-icon-refresh-left">重置</el-button>
-        <el-button type="primary" icon="el-icon-search">查询</el-button>
-      </div>
-    </div>
-    <div class="tabsBottom">
-      <div class="foot-main">
-        <div class="headerText">
-          <div class="searchP">产品列表</div>
-        </div>
-        <div class="exportBtn">
-          <el-button type="primary" icon="el-icon-edit-outline">导出</el-button>
-        </div>
-        <section class="table-box">
-          <div class="table-item">
-            <el-table
-              v-loading="loading"
-              :data="tableList"
-              border
-              :stripe="false"
-            >
-              <el-table-column type="selection" width="55" align="center" />
-              <el-table-column type="index" label="序号" width="55" />
-
-              <el-table-column label="产品名称" prop="name" />
-              <el-table-column label="产品类型" prop="type"> </el-table-column>
+    <div class="right-content">
+      <div class="tabs">
+        <el-tabs
+          v-model="activeName"
+          style="color: #edeef0"
+        >
+          <el-tab-pane label="查询条件" name="first">
+            <div class="screen">
+              <div class="task-name">
+                <span class="task-name-text">产品名称：</span>
+                <div class="task-input">
+                  <el-input
+                    v-model="queryCondition.fullTextSearch"
+                    placeholder="请输入内容"
+                  ></el-input>
+                </div>
+              </div>
+              <div class="task-name">
+                <span class="task-name-text">备案编码：</span>
+                <div class="task-input">
+                  <el-input
+                    v-model="queryCondition.firmName"
+                    placeholder="请输入内容"
+                  ></el-input>
+                </div>
+              </div>
+              <div class="task-name">
+                <span class="task-name-text">生产企业：</span>
+                <div class="task-input">
+                  <el-input
+                    v-model="queryCondition.approvalNumber"
+                    placeholder="请输入内容"
+                  ></el-input>
+                </div>
+              </div>
 
-              <el-table-column label="批准文号" prop="num" />
-              <el-table-column label="企业名称" prop="enterpriseName">
-              </el-table-column>
-              <el-table-column
-                label="操作"
-                class-name="small-padding fixed-width"
-                width="150"
-              >
-                <template>
-                  <el-button
-                    size="mini"
-                    plain
-                    type="primary"
-                    @click="toDetail()"
-                    >详情</el-button
+              <div class="btn">
+                <el-button size="mini" icon="el-icon-refresh-left">重置</el-button>
+                <el-button size="mini" type="primary" icon="el-icon-search">查询</el-button>
+              </div>
+            </div>
+          </el-tab-pane>
+        </el-tabs>
+        <div class="tabsTwo" :style="tabsTwoStyle">
+          <el-tabs
+          v-model="activeName"
+          style="color: #edeef0"
+        >
+          <el-tab-pane label="化妆品列表" name="first">
+            <div class="daochu">
+              <div class="btn">
+                导出
+              </div>
+            </div>
+            <div class="mytable">
+              <el-table
+                ref="multipleTable"
+                :data="tableData"
+                tooltip-effect="dark"
+                border
+                style="width: 100%"
+                @selection-change="handleSelectionChange">
+                <el-table-column
+                  type="selection"
+                  header-align="center"
+                  class-name="column-text-one"
+                  width="44">
+                </el-table-column>
+                <el-table-column
+                  label="序号"
+                  width="50">
+                  <template slot-scope="scope">{{ scope.row.date }}</template>
+                </el-table-column>
+                <el-table-column
+                  prop="name"
+                  label="产品名称"
                   >
-                  <el-button size="mini" plain type="warning">编辑</el-button>
-                </template>
-              </el-table-column>
-            </el-table>
-          </div>
-        </section>
-        <div class="pagination">
-          <span class="custom">共100条，显示1条</span>
-          <el-pagination
-            background
-            @current-change="currentChange"
-            @size-change="sizeChange"
-            :page-sizes="[10, 5]"
-            layout=" prev, pager, next, sizes, jumper"
-            :total="querydata.total"
-          >
-          </el-pagination>
+                </el-table-column>
+                <el-table-column
+                  prop="firmName"
+                  label="备案编码"
+                  show-overflow-tooltip>
+                </el-table-column>
+                <el-table-column
+                  prop="firmName"
+                  label="生产企业"
+                  show-overflow-tooltip>
+                </el-table-column>
+                
+                <el-table-column
+                  prop="address"
+                  label="操作"
+                  width="180"
+                >
+                  <template slot-scope="scope">
+                    <div class="button">
+                      <el-button
+                        size="mini"
+                        type="primary"
+                        class="xiangqing"
+                        plain
+                        @click="handleEdit(scope.$index, scope.row)"
+                        >详情</el-button
+                      >
+                      <el-button
+                        size="mini"
+                        type="primary"
+                        class="bianji"
+                        plain
+                        @click="handleView(scope.$index, scope.row)"
+                        >编辑</el-button
+                      >
+                    </div>
+                  </template>
+                </el-table-column>
+              </el-table>
+              <div class="pagination">
+                <!-- <span class="custom"
+                  >共{{ total }}条，显示{{
+                    total == 0
+                      ? "0"
+                      : queryCondition.current == 1
+                      ? "1"
+                      : queryCondition.size * (queryCondition.current - 1) + 1
+                  }}-{{ numberMap() }}条</span
+                > -->
+                <span class="custom">
+                  共100条，显示1-10条
+                </span>
+                <el-pagination
+                  background
+                  :page-sizes="[10, 15]"
+                  :total="total"
+                  layout=" prev, pager, next, sizes, jumper"
+                  @current-change="currentChange"
+                  @size-change="sizeChange"
+                  :current-page.sync="currentPage"
+                  :page-size.sync="pageSize"
+                >
+                </el-pagination>
+              </div>
+            </div>
+          </el-tab-pane>
+        </el-tabs>
         </div>
       </div>
+      
     </div>
-    <!-- 药品 国抽详情 -->
-    <drugDetail ref="drugDetail"></drugDetail>
-    <!-- 化妆品-->
-    <samplingDetail ref="sampling"></samplingDetail>
-    <!-- 药品 省抽详情 -->
-    <drugProvince ref="drugProvince"></drugProvince>
-    <!-- 医疗器械详情 -->
-    <medical ref="medical"></medical>
   </div>
 </template>
-  
-  <script>
-import drugDetail from "../../cosmeticsFile/drugDetail";
-import samplingDetail from "../../cosmeticsFile/samplingDetail";
-import drugProvince from '../../cosmeticsFile/drugProvince';
-import medical from '../../cosmeticsFile/medical'
+
+<script>
 export default {
-  components: {},
+  components: {
+  },
   data() {
     return {
-      drugnum: "(20)",
+      drugnum:"(20)",
       activeName: "first",
-      queryCondition: {
-        fullTextSearch: "", // 全文检索
-        firmName: "", // 企业名称
-        approvalNumber: "", // 批准文号
-        taskName: "", // 产品名称
-        PrescriptionContent: "", // 处方内容
-        majorFunction: "", // 功能主治
-        startTime: "", // 开始日期
-        endTime: "", // 结束日期
-        checkList: [],
-        checkListTwo: [],
+      queryCondition:{
+        fullTextSearch:"",             // 全文检索
+        firmName:"",                   // 企业名称
+        approvalNumber:"",             // 批准文号
+        taskName:"",                   // 产品名称
+        PrescriptionContent:"",        // 处方内容
+        majorFunction:"",              // 功能主治
+        startTime:"",                  // 开始日期
+        endTime:"",                    // 结束日期
+        checkList:[],
+        checkListTwo:[],
       },
-      loading: false,
-      tableList: [
-        {
-          name: "辽宁护肤霜",
-          type: "化妆品",
-          num: "1231231231231",
-          enterpriseName: "xxxx有限公司",
-        },
-        {
-          name: "辽宁护肤霜",
-          type: "药品",
-          num: "1231231231231",
-          enterpriseName: "xxxx有限公司",
-        },
-        {
-          name: "辽宁护肤霜",
-          type: "医疗器械",
-          num: "1231231231231",
-          enterpriseName: "xxxx有限公司",
-        },
-        {
-          name: "辽宁护肤霜",
-          type: "化妆品",
-          num: "1231231231231",
-          enterpriseName: "xxxx有限公司",
-        },
-        {
-          name: "辽宁护肤霜",
-          type: "医疗器械",
-          num: "1231231231231",
-          enterpriseName: "xxxx有限公司",
-        },
-        {
-          name: "辽宁护肤霜",
-          type: "化妆品",
-          num: "1231231231231",
-          enterpriseName: "xxxx有限公司",
-        },
-        {
-          name: "辽宁护肤霜",
-          type: "医疗器械",
-          num: "1231231231231",
-          enterpriseName: "xxxx有限公司",
-        },
-        {
-          name: "辽宁护肤霜",
-          type: "化妆品",
-          num: "1231231231231",
-          enterpriseName: "xxxx有限公司",
-        },
-        {
-          name: "辽宁护肤霜",
-          type: "医疗器械",
-          num: "1231231231231",
-          enterpriseName: "xxxx有限公司",
-        },
-        {
-          name: "辽宁护肤霜",
-          type: "化妆品",
-          num: "1231231231231",
-          enterpriseName: "xxxx有限公司",
-        },
-      ],
-      querydata: {
-        total: 11,
+      tableData: [{
+        date: '1',
+        name: '辽-xxxx',
+        type:"药品",
+        approvalNumber:"12421432143214321",
+        firmName:"XXX有限公司",
+      }, {
+        date: '2',
+        name: '辽-aaaa',
+        type:"医疗器械",
+        approvalNumber:"12421432143214321",
+        firmName:"XXX有限公司",
+      }, {
+        date: '3',
+        name: '辽-zzzz',
+        type:"化妆品",
+        approvalNumber:"12421432143214321",
+        firmName:"XXX有限公司",
+      }, {
+        date: '4',
+        name: '辽-qqqq',
+        type:"药品",
+        approvalNumber:"12421432143214321",
+        firmName:"XXX有限公司",
+      }, {
+        date: '5',
+        name: '辽-xxxx',
+        type:"医疗器械",
+        approvalNumber:"12421432143214321",
+        firmName:"XXX有限公司",
+      }, {
+        date: '6',
+        name: '辽-aaaa',
+        type:"化妆品",
+        approvalNumber:"12421432143214321",
+        firmName:"XXX有限公司",
+      }, {
+        date: '7',
+        name: '辽-zzzz',
+        type:"药品",
+        approvalNumber:"12421432143214321",
+        firmName:"XXX有限公司",
+      }, {
+        date: '8',
+        name: '辽-qqqq',
+        type:"医疗器械",
+        approvalNumber:"12421432143214321",
+        firmName:"XXX有限公司",
+      }, {
+        date: '9',
+        name: '辽-xxxx',
+        type:"化妆品",
+        approvalNumber:"12421432143214321",
+        firmName:"XXX有限公司",
+      }, {
+        date: '10',
+        name: '辽-aaaa',
+        type:"药品",
+        approvalNumber:"12421432143214321",
+        firmName:"XXX有限公司",
+      }],
+      tabsTwoStyle:{
+        height:''
       },
+      multipleSelection:[],
+      total:100,
+      currentPage:1,
+      pageSize:10,
     };
   },
-  components: {
-    samplingDetail,
-    drugDetail,
-    drugProvince,
-    medical
+  mounted() {
+    document.getElementsByClassName(
+    "el-pagination__jump"
+  )[0].childNodes[0].nodeValue = "跳至";
+    this.$nextTick(()=>{
+      let dom = document.getElementsByClassName('tabsTwo');
+      let height = dom[0].getBoundingClientRect();
+      // let windowWidth = window.innerWidth;
+      let windowHeight = window.innerHeight;
+      let relativeHeight = windowHeight - height.top
+      this.tabsTwoStyle.height = relativeHeight + 'px'
+    })
   },
-  mounted() {},
   methods: {
-    currentChange() {},
-    sizeChange() {},
-    toDetail() {
-      this.$router.push({
-        name: "化妆品详情",
-        path: "/productsMsg/cosmeticsDetail",
-      });
-      // this.$refs.sampling.open()
-      // this.$refs.drugDetail.open();
-      // this.$refs.drugProvince.open();
-      // this.$refs.medical.open();
+    handleSelectionChange(val){
+      this.multipleSelection = val;
+    },
+    currentChange(val){
+
+    },
+    sizeChange(val){
+
+    },
+    // 详情
+    handleEdit(index,row){
+      console.log(index)
+      this.$router.push({name:'productInfo'})
+    },
+    // 编辑
+    handleView(index,row){
+
     },
   },
 };
 </script>
-  
-  <style lang="scss" scoped>
-::v-deep .el-table--medium .el-table__cell {
-  padding: 4px 0;
-}
+
+<style lang="scss" scoped>
 .container {
   height: 100%;
   box-sizing: border-box;
+  display: flex;
+  align-items: center;
   background: #f2f2f2;
-
-  .headerText {
-    width: 100%;
-    padding: 10px 20px;
-    border-bottom: 1px solid #f2f3f5;
-    color: #323233;
-    font-size: 20px;
-    font-weight: bold;
-    .searchP {
-      position: relative;
-      cursor: pointer;
-      &::before {
-        content: "";
-        width: 78px;
-        height: 3px;
-        background: #1349c5;
-        position: absolute;
-        bottom: -10px;
-      }
-    }
+  // padding: 10px;
+  & > div {
+    flex: 1;
+    height: 100%;
   }
-  .tabs {
-    height: 25%;
-    background: rgba(255, 255, 255, 0.9);
-    box-shadow: 0px 0px 12px 0px rgba(194, 212, 226, 0.64);
-    border-radius: vw(10);
-    padding-bottom: 20px;
-    //   min-height: 90vh;
-    // padding-top: 3px;
-    // padding-left: 15px;
+  & > div:nth-child(2) {
+    flex: 2;
+    margin: 0 10px;
+  }
+  .middle {
+    height: 100%;
+    background: #ffff;
+    border-radius: 8px;
+    overflow: hidden;
   }
-  .screen {
-    padding: 15px 0 26px 28px;
+  .left,
+  .right {
     display: flex;
-    flex-wrap: wrap;
+    flex-direction: column;
     align-items: center;
-    .task-name {
-      display: flex;
-      align-items: center;
-      margin-right: 30px;
-      .task-name-text {
-        font-size: 16px;
-        font-family: Source Han Sans CN;
-        font-weight: 400;
-        color: #6a6c6f;
-        line-height: 50px;
-        // margin-right: vw(10);
+    & > div {
+      width: 100%;
+      border-radius: 8px;
+      flex: 1;
+      background: #ffffff;
+    }
+  }
+  .right-content {
+    background-color: #fff;
+    ::v-deep .el-tabs__header{
+      margin: 0;
+      .el-tabs__nav-scroll {
+        padding-left: 15px;
+        padding-top: 3px;
       }
-      .task-input {
-        width: 251px;
-        height: 32px;
-        ::v-deep .el-input {
-          width: 251px;
-          height: 32px;
-        }
-        ::v-deep .el-input__inner {
-          width: 100%;
-          height: 100%;
-          font-size: 16px;
-          font-family: Source Han Sans CN;
-          font-weight: 400;
-          // color: #B1B6BF;
-          line-height: 50px;
-          padding-left: 15px;
-        }
+      .el-tabs__item {
+        font-size: 18px;
+        font-family: Source Han Sans SC-Bold, Source Han Sans SC;
+        font-weight: bold;
+        color: #323233;
+      }
+      .el-tabs__active-bar {
+        background-color: #1349C5;
+        height: 2px;
+        border-radius: 0px 0px 0px 0px;
       }
     }
-    .checkbox-group-name {
-      width: 695px;
+    .tabs {
+      background: #F2F2F2 ;
+      box-shadow: 0px 0px 12px 0px rgba(194, 212, 226, 0.64);
+      border-radius: vw(10);
+      min-height: 88vh;
+      // padding-top: 3px;
+      // padding-left: 15px;
+      ::v-deep .el-tabs {
+        background-color: #fff;
+      }
     }
-    .time-interval {
+    .screen {
+      padding: 15px 0 26px 28px;
       display: flex;
+      flex-wrap: wrap;
       align-items: center;
-      margin-right: 20px;
-      .interval-text {
-        font-size: 16px;
-        font-family: Source Han Sans CN;
-        font-weight: 400;
-        color: #6a6c6f;
-        // line-height: 50px;
-        // margin-right: vw(10);
-      }
-      .interval-select {
+      .task-name {
         display: flex;
         align-items: center;
-        border: 1px solid #dbe0e8;
-        border-radius: 4px;
-        height: 32px;
-        .star-time,
-        .end-time {
-          position: relative;
-          .data_icon {
-            position: absolute;
-            top: 50%;
-            right: 17px;
-            z-index: 9;
-            color: #c0c4cc;
-            font-size: 14px;
-            transform: translateY(-50%);
-          }
-          ::v-deep .el-input__prefix {
-            display: none;
-          }
+        margin-right: 30px;
+        .task-name-text {
+          font-size: 16px;
+          font-family: Source Han Sans CN;
+          font-weight: 400;
+          color: #6a6c6f;
+          line-height: 50px;
+          // margin-right: vw(10);
+        }
+        .task-input {
+          width: 251px;
+          height: 32px;
           ::v-deep .el-input {
-            width: 243px;
-            height: 30px;
+            width: 251px;
+            height: 32px;
           }
           ::v-deep .el-input__inner {
             width: 100%;
@@ -344,59 +373,182 @@ export default {
             font-family: Source Han Sans CN;
             font-weight: 400;
             // color: #B1B6BF;
-            line-height: 30px;
+            line-height: 50px;
             padding-left: 15px;
-            border: none;
-            cursor: pointer;
           }
         }
-        .symbol {
-          background: rgba(219, 224, 232, 0.5);
-          width: 40px;
-          height: 30px;
+      }
+      .checkbox-group-name {
+        width: 695px;
+      }
+      .btn{
+        width: 100%;
+        // padding-left: 600px;
+        text-align: center;
+        margin-top:15px;
+      }
+      .time-interval {
+        display: flex;
+        align-items: center;
+        margin-right: 20px;
+        .interval-text {
+          font-size: 16px;
+          font-family: Source Han Sans CN;
+          font-weight: 400;
+          color: #6a6c6f;
+          // line-height: 50px;
+          // margin-right: vw(10);
+        }
+        .interval-select {
           display: flex;
           align-items: center;
+          border: 1px solid #dbe0e8;
+          border-radius: 4px;
+          height: 32px;
+          .star-time,
+          .end-time {
+            position: relative;
+            .data_icon {
+              position: absolute;
+              top: 50%;
+              right: 17px;
+              z-index: 9;
+              color: #c0c4cc;
+              font-size: 14px;
+              transform: translateY(-50%);
+            }
+            ::v-deep .el-input__prefix {
+              display: none;
+            }
+            ::v-deep .el-input {
+              width: 243px;
+              height: 30px;
+            }
+            ::v-deep .el-input__inner {
+              width: 100%;
+              height: 100%;
+              font-size: 16px;
+              font-family: Source Han Sans CN;
+              font-weight: 400;
+              // color: #B1B6BF;
+              line-height: 30px;
+              padding-left: 15px;
+              border: none;
+              cursor: pointer;
+            }
+          }
+          .symbol {
+            background: rgba(219, 224, 232, 0.5);
+            width: 40px;
+            height: 30px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 16px;
+            font-family: Source Han Sans CN;
+            font-weight: 400;
+            color: #292f38;
+            line-height: 28px;
+          }
+        }
+      }
+    }
+    .tabsTwo {
+      margin: 10px 0;
+      overflow-y: scroll;
+      // padding: 10px 0;
+      padding-bottom: 20px;
+      background-color: #fff;
+      .daochu {
+        padding: 10px;
+        .btn {
+          display: flex;
           justify-content: center;
-          font-size: 16px;
-          font-family: Source Han Sans CN;
+          width: 64px;
+          height: 32px;
+          background: #1E80EB;
+          border-radius: 4px 4px 4px 4px;
+          font-size: 14px;
+          font-family: MicrosoftYaHei-, MicrosoftYaHei;
+          font-weight: normal;
+          color: #FFFFFF;
+          line-height: 31px;
+        }
+      }
+      .mytable {
+        width: 99%;
+        margin: 0 auto;
+        ::v-deep .column-text-one {
+          text-align: center;
+        }
+        ::v-deep .el-table td {
+          height: 40px;
+          padding: 0;
+        }
+        ::v-deep .el-table th {
+          height: 40px;
+          padding: 0;
+          font-size: 14px;
+          font-family: Source Han Sans SC-Medium, Source Han Sans SC;
+          font-weight: bold;
+          color: #292f38;
+          line-height: 36px;
+        }
+        .button {
+          display: flex;
+          align-items: center;
+          .xiangqing {
+            height: 23px;
+            padding: 3px;
+            border-radius: 4px;
+            line-height: 20px;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            margin-right: 5px;
+            background: #EBF5FF;
+            border: 1px solid #A1CBF8;
+            ::v-deep span {
+              display: inline-block;
+              color: #0E7CF4;
+            }
+          }
+          .bianji {
+            height: 23px;
+            padding: 3px;
+            border-radius: 4px;
+            line-height: 20px;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            background: #FFEFE3;
+            border: 1px solid #FFC89F;
+            ::v-deep span {
+              display: inline-block;
+              color: #F88129;
+            }
+          }
+        }
+      }
+      .pagination {
+        margin-top: 17px;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        // padding-bottom: vh(20);
+        ::v-deep .el-pagination__jump {
+          margin: 0;
+        }
+        .custom {
+          font-size: 14px;
+          font-family: Source Han Sans CN-Regular, Source Han Sans CN;
           font-weight: 400;
           color: #292f38;
-          line-height: 28px;
+          line-height: 18px;
         }
       }
     }
+    .tabsTwo::-webkit-scrollbar {display:none}
   }
 }
-//===================
-::v-deep .el-button--medium {
-  padding: 8px;
-}
-.footBox {
-  width: 100%;
-  text-align: center;
-}
-.tabsBottom {
-  height: 75%;
-  padding-top: 10px;
-  .foot-main {
-    height: 100%;
-    width: 100%;
-    background: white;
-  }
-}
-.exportBtn {
-  padding: 10px 20px;
-}
-.table-box {
-  padding: 0 20px;
-  .table-item {
-  }
-}
-.pagination {
-  display: flex;
-  justify-content: space-between;
-  padding: 0 20px;
-  padding-top: 20px;
-}
 </style>
-  
\ No newline at end of file
diff --git a/src/views/productsMsg/components/health.vue b/src/views/productsMsg/components/health.vue
index 85acc76..aaf4e95 100644
--- a/src/views/productsMsg/components/health.vue
+++ b/src/views/productsMsg/components/health.vue
@@ -1,5 +1,549 @@
 <template>
-    <div>   
-        adsfadsfasdfasdfasdf
+  <div class="container">
+    <div class="right-content">
+      <div class="tabs">
+        <el-tabs v-model="activeName" style="color: #edeef0">
+          <el-tab-pane label="查询条件" name="first">
+            <div class="screen">
+              <div class="task-name">
+                <span class="task-name-text">产品名称：</span>
+                <div class="task-input">
+                  <el-input
+                    v-model="queryCondition.fullTextSearch"
+                    placeholder="请输入内容"
+                  ></el-input>
+                </div>
+              </div>
+              <div class="task-name">
+                <span class="task-name-text">注册证号/备案号：</span>
+                <div class="task-input">
+                  <el-input
+                    v-model="queryCondition.firmName"
+                    placeholder="请输入内容"
+                  ></el-input>
+                </div>
+              </div>
+              <div class="task-name">
+                <span class="task-name-text">生产企业：</span>
+                <div class="task-input">
+                  <el-input
+                    v-model="queryCondition.approvalNumber"
+                    placeholder="请输入内容"
+                  ></el-input>
+                </div>
+              </div>
+
+              <div class="btn">
+                <el-button size="mini" icon="el-icon-refresh-left"
+                  >重置</el-button
+                >
+                <el-button size="mini" type="primary" icon="el-icon-search"
+                  >查询</el-button
+                >
+              </div>
+            </div>
+          </el-tab-pane>
+        </el-tabs>
+        <div class="tabsTwo" :style="tabsTwoStyle">
+          <el-tabs v-model="activeName" style="color: #edeef0">
+            <el-tab-pane label="医疗器械列表" name="first">
+              <div class="daochu">
+                <div class="btn">导出</div>
+              </div>
+              <div class="mytable">
+                <el-table
+                  ref="multipleTable"
+                  :data="tableData"
+                  tooltip-effect="dark"
+                  border
+                  style="width: 100%"
+                  @selection-change="handleSelectionChange"
+                >
+                  <el-table-column
+                    type="selection"
+                    header-align="center"
+                    class-name="column-text-one"
+                    width="44"
+                  >
+                  </el-table-column>
+                  <el-table-column label="序号" width="50">
+                    <template slot-scope="scope">{{ scope.row.date }}</template>
+                  </el-table-column>
+                  <el-table-column prop="name" label="产品名称">
+                  </el-table-column>
+                  <el-table-column
+                    prop="firmName"
+                    label="注册证号/备案号"
+                    show-overflow-tooltip
+                  >
+                  </el-table-column>
+                  <el-table-column
+                    prop="firmName"
+                    label="生产企业"
+                    show-overflow-tooltip
+                  >
+                  </el-table-column>
+
+                  <el-table-column prop="address" label="操作" width="180">
+                    <template slot-scope="scope">
+                      <div class="button">
+                        <el-button
+                          size="mini"
+                          type="primary"
+                          class="xiangqing"
+                          plain
+                          @click="handleEdit(scope.$index, scope.row)"
+                          >详情</el-button
+                        >
+                        <el-button
+                          size="mini"
+                          type="primary"
+                          class="bianji"
+                          plain
+                          @click="handleView(scope.$index, scope.row)"
+                          >编辑</el-button
+                        >
+                      </div>
+                    </template>
+                  </el-table-column>
+                </el-table>
+                <div class="pagination">
+                  <!-- <span class="custom"
+                    >共{{ total }}条，显示{{
+                      total == 0
+                        ? "0"
+                        : queryCondition.current == 1
+                        ? "1"
+                        : queryCondition.size * (queryCondition.current - 1) + 1
+                    }}-{{ numberMap() }}条</span
+                  > -->
+                  <span class="custom"> 共100条，显示1-10条 </span>
+                  <el-pagination
+                    background
+                    :page-sizes="[10, 15]"
+                    :total="total"
+                    layout=" prev, pager, next, sizes, jumper"
+                    @current-change="currentChange"
+                    @size-change="sizeChange"
+                    :current-page.sync="currentPage"
+                    :page-size.sync="pageSize"
+                  >
+                  </el-pagination>
+                </div>
+              </div>
+            </el-tab-pane>
+          </el-tabs>
+        </div>
+      </div>
     </div>
-</template>
\ No newline at end of file
+  </div>
+</template>
+  
+  <script>
+export default {
+  components: {},
+  data() {
+    return {
+      drugnum: "(20)",
+      activeName: "first",
+      queryCondition: {
+        fullTextSearch: "", // 全文检索
+        firmName: "", // 企业名称
+        approvalNumber: "", // 批准文号
+        taskName: "", // 产品名称
+        PrescriptionContent: "", // 处方内容
+        majorFunction: "", // 功能主治
+        startTime: "", // 开始日期
+        endTime: "", // 结束日期
+        checkList: [],
+        checkListTwo: [],
+      },
+      tableData: [
+        {
+          date: "1",
+          name: "辽-xxxx",
+          type: "药品",
+          approvalNumber: "12421432143214321",
+          firmName: "XXX有限公司",
+        },
+        {
+          date: "2",
+          name: "辽-aaaa",
+          type: "医疗器械",
+          approvalNumber: "12421432143214321",
+          firmName: "XXX有限公司",
+        },
+        {
+          date: "3",
+          name: "辽-zzzz",
+          type: "化妆品",
+          approvalNumber: "12421432143214321",
+          firmName: "XXX有限公司",
+        },
+        {
+          date: "4",
+          name: "辽-qqqq",
+          type: "药品",
+          approvalNumber: "12421432143214321",
+          firmName: "XXX有限公司",
+        },
+        {
+          date: "5",
+          name: "辽-xxxx",
+          type: "医疗器械",
+          approvalNumber: "12421432143214321",
+          firmName: "XXX有限公司",
+        },
+        {
+          date: "6",
+          name: "辽-aaaa",
+          type: "化妆品",
+          approvalNumber: "12421432143214321",
+          firmName: "XXX有限公司",
+        },
+        {
+          date: "7",
+          name: "辽-zzzz",
+          type: "药品",
+          approvalNumber: "12421432143214321",
+          firmName: "XXX有限公司",
+        },
+        {
+          date: "8",
+          name: "辽-qqqq",
+          type: "医疗器械",
+          approvalNumber: "12421432143214321",
+          firmName: "XXX有限公司",
+        },
+        {
+          date: "9",
+          name: "辽-xxxx",
+          type: "化妆品",
+          approvalNumber: "12421432143214321",
+          firmName: "XXX有限公司",
+        },
+        {
+          date: "10",
+          name: "辽-aaaa",
+          type: "药品",
+          approvalNumber: "12421432143214321",
+          firmName: "XXX有限公司",
+        },
+      ],
+      tabsTwoStyle: {
+        height: "",
+      },
+      multipleSelection: [],
+      total: 100,
+      currentPage: 1,
+      pageSize: 10,
+    };
+  },
+  mounted() {
+    document.getElementsByClassName(
+      "el-pagination__jump"
+    )[0].childNodes[0].nodeValue = "跳至";
+    this.$nextTick(() => {
+      let dom = document.getElementsByClassName("tabsTwo");
+      let height = dom[0].getBoundingClientRect();
+      // let windowWidth = window.innerWidth;
+      let windowHeight = window.innerHeight;
+      let relativeHeight = windowHeight - height.top;
+      this.tabsTwoStyle.height = relativeHeight + "px";
+    });
+  },
+  methods: {
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    currentChange(val) {},
+    sizeChange(val) {},
+    // 详情
+    handleEdit(index, row) {
+      console.log(index);
+      this.$router.push({ name: "productInfo" });
+    },
+    // 编辑
+    handleView(index, row) {},
+  },
+};
+</script>
+  
+  <style lang="scss" scoped>
+.container {
+  height: 100%;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  background: #f2f2f2;
+  // padding: 10px;
+  & > div {
+    flex: 1;
+    height: 100%;
+  }
+  & > div:nth-child(2) {
+    flex: 2;
+    margin: 0 10px;
+  }
+  .middle {
+    height: 100%;
+    background: #ffff;
+    border-radius: 8px;
+    overflow: hidden;
+  }
+  .left,
+  .right {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    & > div {
+      width: 100%;
+      border-radius: 8px;
+      flex: 1;
+      background: #ffffff;
+    }
+  }
+  .right-content {
+    background-color: #fff;
+    ::v-deep .el-tabs__header {
+      margin: 0;
+      .el-tabs__nav-scroll {
+        padding-left: 15px;
+        padding-top: 3px;
+      }
+      .el-tabs__item {
+        font-size: 18px;
+        font-family: Source Han Sans SC-Bold, Source Han Sans SC;
+        font-weight: bold;
+        color: #323233;
+      }
+      .el-tabs__active-bar {
+        background-color: #1349c5;
+        height: 2px;
+        border-radius: 0px 0px 0px 0px;
+      }
+    }
+    .tabs {
+      background: #f2f2f2;
+      box-shadow: 0px 0px 12px 0px rgba(194, 212, 226, 0.64);
+      border-radius: vw(10);
+      min-height: 88vh;
+      // padding-top: 3px;
+      // padding-left: 15px;
+      ::v-deep .el-tabs {
+        background-color: #fff;
+      }
+    }
+    .screen {
+      padding: 15px 0 26px 28px;
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      .task-name {
+        display: flex;
+        align-items: center;
+        margin-right: 30px;
+        .task-name-text {
+          font-size: 16px;
+          font-family: Source Han Sans CN;
+          font-weight: 400;
+          color: #6a6c6f;
+          line-height: 50px;
+          // margin-right: vw(10);
+        }
+        .task-input {
+          width: 251px;
+          height: 32px;
+          ::v-deep .el-input {
+            width: 251px;
+            height: 32px;
+          }
+          ::v-deep .el-input__inner {
+            width: 100%;
+            height: 100%;
+            font-size: 16px;
+            font-family: Source Han Sans CN;
+            font-weight: 400;
+            // color: #B1B6BF;
+            line-height: 50px;
+            padding-left: 15px;
+          }
+        }
+      }
+      .checkbox-group-name {
+        width: 695px;
+      }
+      .btn {
+        width: 100%;
+        //   padding-left: 600px;
+        text-align: center;
+        margin-top: 15px;
+      }
+      .time-interval {
+        display: flex;
+        align-items: center;
+        margin-right: 20px;
+        .interval-text {
+          font-size: 16px;
+          font-family: Source Han Sans CN;
+          font-weight: 400;
+          color: #6a6c6f;
+          // line-height: 50px;
+          // margin-right: vw(10);
+        }
+        .interval-select {
+          display: flex;
+          align-items: center;
+          border: 1px solid #dbe0e8;
+          border-radius: 4px;
+          height: 32px;
+          .star-time,
+          .end-time {
+            position: relative;
+            .data_icon {
+              position: absolute;
+              top: 50%;
+              right: 17px;
+              z-index: 9;
+              color: #c0c4cc;
+              font-size: 14px;
+              transform: translateY(-50%);
+            }
+            ::v-deep .el-input__prefix {
+              display: none;
+            }
+            ::v-deep .el-input {
+              width: 243px;
+              height: 30px;
+            }
+            ::v-deep .el-input__inner {
+              width: 100%;
+              height: 100%;
+              font-size: 16px;
+              font-family: Source Han Sans CN;
+              font-weight: 400;
+              // color: #B1B6BF;
+              line-height: 30px;
+              padding-left: 15px;
+              border: none;
+              cursor: pointer;
+            }
+          }
+          .symbol {
+            background: rgba(219, 224, 232, 0.5);
+            width: 40px;
+            height: 30px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 16px;
+            font-family: Source Han Sans CN;
+            font-weight: 400;
+            color: #292f38;
+            line-height: 28px;
+          }
+        }
+      }
+    }
+    .tabsTwo {
+      margin: 10px 0;
+      overflow-y: scroll;
+      // padding: 10px 0;
+      padding-bottom: 20px;
+      background-color: #fff;
+      .daochu {
+        padding: 10px;
+        .btn {
+          display: flex;
+          justify-content: center;
+          width: 64px;
+          height: 32px;
+          background: #1e80eb;
+          border-radius: 4px 4px 4px 4px;
+          font-size: 14px;
+          font-family: MicrosoftYaHei-, MicrosoftYaHei;
+          font-weight: normal;
+          color: #ffffff;
+          line-height: 31px;
+        }
+      }
+      .mytable {
+        width: 99%;
+        margin: 0 auto;
+        ::v-deep .column-text-one {
+          text-align: center;
+        }
+        ::v-deep .el-table td {
+          height: 40px;
+          padding: 0;
+        }
+        ::v-deep .el-table th {
+          height: 40px;
+          padding: 0;
+          font-size: 14px;
+          font-family: Source Han Sans SC-Medium, Source Han Sans SC;
+          font-weight: bold;
+          color: #292f38;
+          line-height: 36px;
+        }
+        .button {
+          display: flex;
+          align-items: center;
+          .xiangqing {
+            height: 23px;
+            padding: 3px;
+            border-radius: 4px;
+            line-height: 20px;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            margin-right: 5px;
+            background: #ebf5ff;
+            border: 1px solid #a1cbf8;
+            ::v-deep span {
+              display: inline-block;
+              color: #0e7cf4;
+            }
+          }
+          .bianji {
+            height: 23px;
+            padding: 3px;
+            border-radius: 4px;
+            line-height: 20px;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            background: #ffefe3;
+            border: 1px solid #ffc89f;
+            ::v-deep span {
+              display: inline-block;
+              color: #f88129;
+            }
+          }
+        }
+      }
+      .pagination {
+        margin-top: 17px;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        // padding-bottom: vh(20);
+        ::v-deep .el-pagination__jump {
+          margin: 0;
+        }
+        .custom {
+          font-size: 14px;
+          font-family: Source Han Sans CN-Regular, Source Han Sans CN;
+          font-weight: 400;
+          color: #292f38;
+          line-height: 18px;
+        }
+      }
+    }
+    .tabsTwo::-webkit-scrollbar {
+      display: none;
+    }
+  }
+}
+</style>
+  
\ No newline at end of file