diff --git a/src/api/archives/cosmetics.js b/src/api/archives/cosmetics.js
index 5a87be0..5386dab 100644
--- a/src/api/archives/cosmetics.js
+++ b/src/api/archives/cosmetics.js
@@ -46,4 +46,12 @@ export default {
             params: query,
         });
     },
+     //分页条件查询药品批件数据
+     vRdgYpwhGxwz(query) {
+        return request({
+            url: "/pharmaceuticals/vRdgYpwhGxwz",
+            method: "GET",
+            params: query,
+        });
+    },
 }
diff --git a/src/main.js b/src/main.js
index eaa211a..d91f7d9 100644
--- a/src/main.js
+++ b/src/main.js
@@ -127,8 +127,11 @@ L.Icon.Default.mergeOptions({
  *
  * Currently MockJs will be used in the production environment,
  * please remove it before going online! ! !
+ * 
+ 
  */
 
+
 Vue.use(Element, {
   size: Cookies.get("size") || "medium", // set element-ui default size
 });
diff --git a/src/views/productsMsg/index.vue b/src/views/productsMsg/index.vue
index 6fdf2e1..7e6cc36 100644
--- a/src/views/productsMsg/index.vue
+++ b/src/views/productsMsg/index.vue
@@ -1,506 +1,260 @@
 <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.taskName"
-                      placeholder="请输入内容"
-                    ></el-input>
-                  </div>
-                </div>
-                <div class="task-name">
-                  <span class="task-name-text">药品分类：</span>
-                  <div class="task-input">
-                    <el-select v-model="queryCondition.drugClassification" placeholder="请选择">
-                      <el-option
-                        v-for="item in options"
-                        :key="item.value"
-                        :label="item.label"
-                        :value="item.value">
-                      </el-option>
-                    </el-select>
-                  </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.firmName"
-                      placeholder="请输入内容"
-                    ></el-input>
-                  </div>
-                </div>
-                <div class="task-name">
-                  <span class="task-name-text">剂型：</span>
-                  <div class="task-input">
-                    <el-select v-model="queryCondition.dosageForm" placeholder="请选择">
-                      <el-option
-                        v-for="item in options"
-                        :key="item.value"
-                        :label="item.label"
-                        :value="item.value">
-                      </el-option>
-                    </el-select>
-                  </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="mytable">
-                <el-table
-                  ref="multipleTable"
-                  :data="tableData"
-                  tooltip-effect="dark"
-                  border
-                  style="width: 100%"
+  <div class="container">
+    <div class="tabs">
+      <div class="headerText">
+        <div class="searchP">查询条件</div>
+      </div>
+      <el-form ref="form1" :model="form1" label-width="80px">
+        <div style="margin-top: 10px">
+          <el-row>
+            <el-col :span="7">
+              <el-form-item label="产品名称">
+                <el-input v-model="form1.name"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="7">
+              <el-form-item label="药品分类">
+                <el-input v-model="form1.ypfl"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="7">
+              <el-form-item label="批准文号">
+                <el-input v-model="form1.name"></el-input>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </div>
+        <el-row>
+          <el-col :span="7">
+            <el-form-item label="生产企业">
+              <el-input v-model="form1.name"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="7">
+            <el-form-item label="剂型">
+              <el-select v-model="form1.types" placeholder="请选择剂型">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
                 >
-                  <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="approvalNumber"
-                    label="批准文号"
-                    show-overflow-tooltip>
-                  </el-table-column>
-                  <el-table-column
-                    prop="type"
-                    label="药品分类"
-                    show-overflow-tooltip>
-                  </el-table-column>
-                  <el-table-column
-                    prop="dosageForm"
-                    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
-                        >
-                      </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-option>
+              </el-select> </el-form-item
+          ></el-col>
+        </el-row>
+      </el-form>
+      <div class="footBox">
+        <el-button icon="el-icon-refresh-left" @click="reset">重置</el-button>
+        <el-button type="primary" icon="el-icon-search" @click="searchList"
+          >查询</el-button
+        >
+      </div>
+    </div>
+    <div class="tabsBottom">
+      <div class="foot-main">
+        <div class="headerText">
+          <div class="searchP">药品列表</div>
+        </div>
+        <section class="table-box">
+          <div class="table-item">
+            <el-table
+              v-loading="loading"
+              :data="tableData"
+              border
+              height="340"
+              :stripe="false"
+            >
+              <el-table-column
+                type="index"
+                label="序号"
+                width="50"
+                align="center"
+              />
+              <el-table-column label="产品名称" align="center">
+                <template slot-scope="scope">
+                  {{ scope.row.yptymc }}
+                </template>
+              </el-table-column>
+              <el-table-column label="批准文号" align="center">
+                <template slot-scope="scope">
+                  {{ scope.row.yppzwh }}
+                </template>
+              </el-table-column>
+              <el-table-column label="药品分类" align="center" width="70">
+                <template slot-scope="scope">
+                  {{ scope.row.ypfl }}
+                </template>
+              </el-table-column>
+              <el-table-column label="剂型" align="center" width="70">
+                <template slot-scope="scope">
+                  {{ scope.row.jx }}
+                </template>
+              </el-table-column>
+              <el-table-column label="生产企业" align="center">
+                <template slot-scope="scope">
+                  {{ scope.row.ypscqymc }}
+                </template>
+              </el-table-column>
+              <el-table-column
+                label="操作"
+                class-name="small-padding fixed-width"
+                width="140"
+                align="center"
+              >
+                <template slot-scope="scope">
+                  <el-button
+                    size="mini"
+                    plain
+                    type="primary"
+                    @click="toDetail(scope.row)"
+                    >查看</el-button
                   >
-                  </el-pagination>
-                </div>
-              </div>
-            </el-tab-pane>
-          </el-tabs>
+                </template>
+              </el-table-column>
+            </el-table>
           </div>
-        </div>
-        
+        </section>
+        <pagination
+          v-show="total > 0"
+          :total="total"
+          :page="form1.current"
+          :limit="form1.size"
+          @pagination="getPagination"
+          :current-page.sync="form1.current"
+        ></pagination>
       </div>
     </div>
-  </template>
-  
-  <script>
-  export default {
-    components: {
+  </div>
+</template>
+
+<script>
+export default {
+  components: {},
+  data() {
+    return {
+      //===========
+      loading: false,
+      tableData: [],
+      total: 0,
+      options: [],
+      form1: {
+        types: "",
+        ypfl: "",
+        name: "",
+        size: 10,
+        current: 1,
+      },
+    };
+  },
+  mounted() {},
+  created() {
+    this.chinaCosmetics(1);
+  },
+  methods: {
+    //去内嵌页面
+    toDetail(e) {
+      console.log(e);
+    },
+    //搜索
+    searchList() {
+      this.form1.current = 1
+      this.chinaCosmetics();
     },
-    data() {
-      return {
-        drugnum:"(20)",
-        activeName: "first",
-        queryCondition:{
-          firmName:"",                   // 企业名称
-          approvalNumber:"",             // 批准文号
-          taskName:"",                   // 产品名称
-          dosageForm:'',                 // 剂型
-          drugClassification:'',         // 药品分类
-        },
-        options: [{
-          value: '选项1',
-          label: '黄金糕'
-        }, {
-          value: '选项2',
-          label: '双皮奶'
-        }, {
-          value: '选项3',
-          label: '蚵仔煎'
-        }, {
-          value: '选项4',
-          label: '龙须面'
-        }, {
-          value: '选项5',
-          label: '北京烤鸭'
-        }],
-        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:''
-        },
-        total:100,
-        currentPage:1,
-        pageSize:10,
+    getPagination(e) {
+      console.log(e);
+      this.form1.current = e.page;
+      this.form1.size = e.limit;
+      this.chinaCosmetics();
+    },
+    //重置
+    reset() {
+      this.form1 = {
+        name: "",
+        ypfl: "",
+        size: 10,
+        current: 1,
       };
     },
-    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'
-      })
+    //国产化妆品
+    async chinaCosmetics() {
+      this.loading = true;
+      let msg1 = await this.$api.cosmetics.vRdgYpwhGxwz(this.form1);
+      console.log(msg1);
+      this.tableData = msg1.data.records;
+      this.total = msg1.data.total;
+      this.form1.size = msg1.data.size;
+      this.form1.current = msg1.data.current;
+      this.loading = false;
     },
-    methods: {
-      currentChange(val){
+  },
+};
+</script>
 
-      },
-      sizeChange(val){
-
-      },
-      // 详情
-      handleEdit(index,row){
-        console.log(index)
-        this.$router.push({name:'productInfo'})
-      },
-      // 编辑
-      handleView(index,row){
+<style lang="scss" scoped>
+::v-deep .el-select {
+  width: 100% !important;
+}
+.container {
+  height: 100%;
+  // overflow: auto;
+  background: #f2f2f2;
 
-      },
-    },
-  };
-  </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;
+  .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;
       }
     }
-    .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: 100px;
-          .task-name-text {
-            font-size: 16px;
-            font-family: Source Han Sans CN;
-            font-weight: 400;
-            color: #6a6c6f;
-            line-height: 50px;
-            display: inline-block;
-            width: 80px;
-            text-align: right;
-            // margin-right: vw(10);
-          }
-          .task-input {
-            width: 351px;
-            height: 32px;
-            ::v-deep .el-input {
-              width: 351px !important;
-              height: 32px;
-              margin-left: 0 !important;
-            }
-            ::v-deep .el-input__inner {
-              width: 100%;
-              height: 100%;
-              font-size: 16px;
-              font-family: Source Han Sans CN;
-              font-weight: 400;
-              line-height: 50px;
-              padding-left: 15px;
-            }
-          }
-        }
-        .checkbox-group-name {
-          width: 695px;
-        }
-        .btn{
-          width: 100%;
-          display: flex;
-          justify-content: center;
-        }
-        .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;
-          }
-        }
-      }
-      .tabsTwo {
-        margin: 10px 0;
-        overflow-y: scroll;
-        // padding: 10px 0;
-        padding-bottom: 20px;
-        background-color: #fff;
-        .mytable {
-          width: 99%;
-          margin: 10px auto;
-          ::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 10px;
-              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
+  .tabs {
+    width: 100%;
+    height: 30%;
+    background: #fff;
+  }
+}
+//===================
+::v-deep .el-button--medium {
+  padding: 8px;
+}
+.footBox {
+  width: 100%;
+  text-align: center;
+}
+.tabsBottom {
+  height: 70%;
+  padding-top: 10px;
+  .foot-main {
+    height: 100%;
+    // min-height: 600px;
+    width: 100%;
+    background: white;
+  }
+}
+.exportBtn {
+  padding: 10px 20px;
+}
+.table-box {
+  padding: 0 20px;
+  .table-item {
+  }
+}
+.pagination {
+  display: flex;
+  justify-content: space-between;
+  padding: 15px 20px;
+}
+</style>