diff --git a/src/permission.js b/src/permission.js
index e5267d9..957cdb2 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -27,7 +27,7 @@ const whiteList = [
   '/productsMsg/drugArchives',
   '/productsMsg/cosmeticsArchives',
   '/productsMsg/health',
-  '/productsMsg/cosmeticsDetail',
+  '/productsMsg/productInfo',
   '/B/logout'
 ];
 router.beforeEach((to, from, next) => {
diff --git a/src/router/index.js b/src/router/index.js
index e1b4279..35c7da0 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -116,7 +116,7 @@ export const constantRoutes = [
         path: "drugArchives",
         name: "药品档案",
         icon: require("@/assets/images/tree4.svg"),
-        component: () => import("@/views/productsMsg/components/drugArchives.vue"),
+        component: () => import("@/views/productsMsg/index.vue"),
         meta: { title: "药品档案", icon: "netWork" },
       },
       {
@@ -140,6 +140,12 @@ export const constantRoutes = [
         component: () => import("@/views/productsMsg/components/health.vue"),
         meta: { title: "医疗器械档案", icon: "netWork" },
       },
+      {
+        path: "productInfo",
+        name: "productInfo",
+        component:() => import("@/views/productsMsg/components/productInfo.vue"),
+        meta: { title: "产品档案", icon: "netWork" },
+      },
     ]
   },
   //可以按着若依的思路来写,把菜单全部都设置成一级路由，然后有下拉选择框的去进行区别判断设置成二级子路由
diff --git a/src/views/productsMsg/components/productInfo.vue b/src/views/productsMsg/components/productInfo.vue
new file mode 100644
index 0000000..895f0c7
--- /dev/null
+++ b/src/views/productsMsg/components/productInfo.vue
@@ -0,0 +1,35 @@
+<template>
+  <div class="ifram-view" :style="iframViewStyle">
+    <!-- <span>!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!</span> -->
+    <iframe src="https://dev-mssm-liaoning.imian.org.cn/ggfw/#/firmContent/drugInfo" allow="payment" frameborder="0" style="width: 100%;height: 100%;"></iframe>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      iframViewStyle:{
+        height:"",
+      }
+    }
+  },
+  methods:{
+  },
+  mounted() {
+    this.$nextTick(()=>{
+      let dom = document.getElementsByClassName('ifram-view');
+      let height = dom[0].getBoundingClientRect();
+      // let windowWidth = window.innerWidth;
+      let windowHeight = window.innerHeight;
+      let relativeHeight = windowHeight - height.top
+      this.iframViewStyle.height = relativeHeight + 'px'
+    })
+  },
+}
+</script>
+<style lang="scss" scoped>
+.ifram-view {
+  background-color: #fff;
+  overflow-y: scroll;
+}
+</style>
diff --git a/src/views/productsMsg/index.vue b/src/views/productsMsg/index.vue
index 209aaf8..e606534 100644
--- a/src/views/productsMsg/index.vue
+++ b/src/views/productsMsg/index.vue
@@ -119,9 +119,119 @@
                     </el-checkbox-group>
                   </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="type"
+                    label="产品类型"
+                    show-overflow-tooltip>
+                  </el-table-column>
+                  <el-table-column
+                    prop="approvalNumber"
+                    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="100"
+                  >
+                    <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>
@@ -148,10 +258,109 @@
           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() {},
-    methods: {},
+    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>
   
@@ -162,7 +371,7 @@
     display: flex;
     align-items: center;
     background: #f2f2f2;
-    padding: 10px;
+    // padding: 10px;
     & > div {
       flex: 1;
       height: 100%;
@@ -189,13 +398,6 @@
         background: #ffffff;
       }
     }
-    .middle-box {
-      margin: 10px;
-    }
-  
-    .main {
-      height: calc(100% - 40px);
-    }
     .right-content {
       background-color: #fff;
       ::v-deep .el-tabs__header{
@@ -217,12 +419,15 @@
         }
       }
       .tabs {
-        background: rgba(255, 255, 255, 0.9);
+        background: #F2F2F2 ;
         box-shadow: 0px 0px 12px 0px rgba(194, 212, 226, 0.64);
         border-radius: vw(10);
-        min-height: 90vh;
+        min-height: 88vh;
         // padding-top: 3px;
         // padding-left: 15px;
+        ::v-deep .el-tabs {
+          background-color: #fff;
+        }
       }
       .screen {
         padding: 15px 0 26px 28px;
@@ -263,6 +468,10 @@
         .checkbox-group-name {
           width: 695px;
         }
+        .btn{
+          width: 100%;
+          padding-left: 600px;
+        }
         .time-interval {
           display: flex;
           align-items: center;
@@ -329,6 +538,102 @@
           }
         }
       }
+      .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>