Merge branch 'main' of http://39.101.188.84:8000/suzhou-jichuang-lanhai/LiaoningChanpinHuaxiang

src/api/largeScreen/index.js

@@ -48,3 +48,11 @@ export function getCPCJ(query) {
         params: query
     })
 }
+//根据批准文号或备案编号以及类型查询产品详细信息
+export function getXXMSG(query) {
+    return request({
+        url: '/ggfw-api/pharmaceuticals/largeScreen/findInfoByReq',
+        method: 'get',
+        params: query
+    })
+}

src/api/myAPI/login.js

@@ -2,11 +2,8 @@ import request from "@/utils/request";
 // 本地
 // let api = "API"
 // 线上
-
 let api = location.origin
 export default {
-
-
   frimLogin() {
     return request({
       baseURL: process.env.VUE_APP_USER_LOGIN,

src/main.js

@@ -77,15 +77,13 @@ import { setToken } from '@/utils/auth'
 //     "MSSM-LIAONING__TOKEN",
 //     Authentication.data.result.userToken
 //   );
-
 // }
 // token()
- let infor = async()=>{
+// let infor = async () => {
- let response = await API.login.getuserinfo();
+//   let response = await API.login.getuserinfo();
- localStorage.setItem("userDto", JSON.stringify(response?.result.userDto));
+//   localStorage.setItem("userDto", JSON.stringify(response?.result.userDto));
-
+// }
- }
+// infor()
- infor()
 
 
 /**

src/permission.js

@@ -11,9 +11,7 @@ NProgress.configure({ showSpinner: false })
 const whiteList = ['/login', '/register']
 
 router.beforeEach((to, from, next) => {
-
   setToken()
-  
   NProgress.start()
   next()
 })

src/views/bigpage/bigcomponents/AdverseBox.vue

@@ -1,6 +1,6 @@
 
 <template>
-  <div class="box">
+  <div class="box" style="height: calc(100% - 41px)">
     <div class="top-box">
       <div class="topbox-item">
         <div class="topbox-item-left">
@@ -8,12 +8,13 @@
           <span>不良反应</span>
         </div>
         <div class="topbox-item-content">
-          <div class="topbox-itemleft-color">12121111111111111111</div>
+          <div class="topbox-itemleft-color">{{ pieData[0].value || 0 }}</div>
           <span>例</span>
         </div>
         <div class="topbox-item-right">
           <div>较去年</div>
-          <span class="spanshang">↑</span> <span class="spanxia">↓</span>
+          <!-- <span class="spanxia">↑</span> -->
+          <span class="spanshang">↓</span>
         </div>
       </div>
       <div class="topbox-item">
@@ -22,12 +23,13 @@
           <span>严重不良反应</span>
         </div>
         <div class="topbox-item-content">
-          <div class="topbox-itemleft-color">1212</div>
+          <div class="topbox-itemleft-color">{{ pieData[1].value || 0 }}</div>
           <span>例</span>
         </div>
         <div class="topbox-item-right">
           <div class="redStyle">较去年</div>
-          <span class="spanshang">↑</span> <span class="spanxia">↓</span>
+          <span class="spanxia">↑</span>
+          <!-- <span class="spanshang">↓</span> -->
         </div>
       </div>
       <div class="topbox-item">
@@ -36,17 +38,63 @@
           <span>发生死亡不良反应</span>
         </div>
         <div class="topbox-item-content">
-          <div class="topbox-itemleft-color">1212</div>
+          <div class="topbox-itemleft-color">{{ pieData[2].value || 0 }}</div>
           <span>例</span>
         </div>
         <div class="topbox-item-right">
           <div class="redStyle">较去年</div>
-          <span class="spanshang">↑</span> <span class="spanxia">↓</span>
+          <span class="spanxia">↑</span>
+          <!-- <span class="spanshang">↓</span> -->
         </div>
       </div>
     </div>
+    <div class="footers">
+      <div class="lefts">
         <div class="bottom-box" ref="bottom-box"></div>
       </div>
+      <div class="rights">
+        <div>
+          <div class="pt-top">
+            <div class="ptleftbox">
+              <div class="rectangular1"></div>
+            </div>
+            <div class="texts">一般不良反应</div>
+          </div>
+          <div class="pt-top">
+            <div class="ptleftbox"></div>
+            <div class="boxLine"></div>
+            <div class="ptStyle react1">0%</div>
+          </div>
+        </div>
+        <div>
+          <div class="pt-top">
+            <div class="ptleftbox">
+              <div class="rectangular2"></div>
+            </div>
+            <div class="texts">严重不良反应</div>
+          </div>
+          <div class="pt-top">
+            <div class="ptleftbox"></div>
+            <div class="boxLine"></div>
+            <div class="ptStyle react2">0%</div>
+          </div>
+        </div>
+        <div>
+          <div class="pt-top">
+            <div class="ptleftbox">
+              <div class="rectangular3"></div>
+            </div>
+            <div class="texts">发生死亡不良反应</div>
+          </div>
+          <div class="pt-top">
+            <div class="ptleftbox"></div>
+            <div class="boxLine"></div>
+            <div class="ptStyle react3">0%</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
 </template>
 
 <script>
@@ -65,7 +113,25 @@ export default {
       option1: {},
       // echarts
       myChart1: {},
-      center: ["30%", "50%"],
+      a1: 0,
+      a2: 0,
+      a3: 0,
+      center: ["50%", "50%"],
+      pieData: [
+        {
+          value: 0,
+          name: "一般不良反应",
+        },
+        {
+          value: 0,
+          name: "严重不良反应",
+        },
+        {
+          value: 0,
+          name: "发生死亡不良反应",
+        },
+      ],
+      total: 0,
     };
   },
   created() {},
@@ -75,11 +141,26 @@ export default {
   methods: {
     getData() {
       let newRouter = this.$route.query;
-      console.log(newRouter.type);
       if (newRouter.type == 1) {
         //药品
         getDrugBL({ name: newRouter.code }).then((res) => {
-          console.log(res);
+          res.data.result.forEach((value, index) => {
+            this.pieData.forEach((value1, index1) => {
+              if (value.reportType == "一般" && value1.name == "一般不良反应") {
+                this.pieData[index1].value = value.reportCount;
+              }
+              if (value.reportType == "严重" && value1.name == "严重不良反应") {
+                this.pieData[index1].value = value.reportCount;
+              }
+              if (
+                value.reportType != "一般" &&
+                value.reportType != "严重" &&
+                value1.name == "发生死亡不良反应"
+              ) {
+                this.pieData[index1].value = value.reportCount;
+              }
+            });
+          });
           this.$nextTick(() => {
             let chartDom = this.$refs["bottom-box"];
             this.myChart1 = echarts.init(chartDom);
@@ -90,7 +171,23 @@ export default {
       if (newRouter.type != 1 && newRouter.type != 2) {
         //化妆品
         getCosmeticsBL({ name: newRouter.code }).then((res) => {
-          console.log(res);
+          res.data.result.forEach((value, index) => {
+            this.pieData.forEach((value1, index1) => {
+              if (value.reportType == "一般" && value1.name == "一般不良反应") {
+                this.pieData[index1].value = value.reportCount;
+              }
+              if (value.reportType == "严重" && value1.name == "严重不良反应") {
+                this.pieData[index1].value = value.reportCount;
+              }
+              if (
+                value.reportType != "一般" &&
+                value.reportType != "严重" &&
+                value1.name == "发生死亡不良反应"
+              ) {
+                this.pieData[index1].value = value.reportCount;
+              }
+            });
+          });
           this.$nextTick(() => {
             let chartDom = this.$refs["bottom-box"];
             this.myChart1 = echarts.init(chartDom);
@@ -101,7 +198,26 @@ export default {
       if (newRouter.type == 2) {
         //医疗器械
         getMedicalDevicesBL({ name: newRouter.code }).then((res) => {
-          console.log(res);
+          res.data.result.forEach((value, index) => {
+            this.pieData.forEach((value1, index1) => {
+              if (
+                value.reportType == "严重伤害" &&
+                value1.name == "严重不良反应"
+              ) {
+                this.pieData[index1].value = value.reportCount;
+              }
+              if (value.reportType == "其他" && value1.name == "一般不良反应") {
+                this.pieData[index1].value = value.reportCount;
+              }
+              if (
+                value.reportType != "严重伤害" &&
+                value.reportType != "其他" &&
+                value1.name == "发生死亡不良反应"
+              ) {
+                this.pieData[index1].value = value.reportCount;
+              }
+            });
+          });
           this.$nextTick(() => {
             let chartDom = this.$refs["bottom-box"];
             this.myChart1 = echarts.init(chartDom);
@@ -112,116 +228,19 @@ export default {
     },
     initEcharts() {
       this.option1 = {
-        grid: {
-          left: "10%",
-          top: 0,
-          bottom: 0,
-          right: "60%",
-          containLabel: true,
-        },
         tooltip: {
           trigger: "item",
           formatter: "{b} : {c} ({d}%)",
           position: "right",
         },
-        legend: {
-          type: "scroll",
-          orient: "vartical",
-          top: "center",
-          right: "20",
-          itemWidth: 10,
-          itemHeight: 8,
-          itemGap: 16,
-          icon: "circle",
-          textStyle: {
-            color: "#A3E2F4",
-            fontSize: 12,
-            fontWeight: 0,
-            rich: {
-              name: {
-                fontSize: 12,
-                padding: [25, 0, 5, 0], //图例位置
-              },
-              percent: {
-                fontSize: 12,
-                color: "#ccc",
-                width: 80, // 设置宽度
-                height: 20, // 设置高度
-                backgroundColor: {
-                  type: "linear",
-                  x: 0,
-                  y: 0,
-                  x2: 1,
-                  y2: 0,
-                  colorStops: [
-                    { offset: 0, color: "rgba(36, 64, 97, 1)" }, // 渐变起始色，淡白色
-                    { offset: 1, color: "rgba(36, 64, 97, 0)" }, // 渐变结束色，逐渐透明
-                  ],
-                },
-              },
-            },
-          },
-
-          data: [
-            {
-              value: 10,
-              name: "一般不良反应",
-            },
-            {
-              value: 5,
-              name: "严重不良反应",
-            },
-            {
-              value: 15,
-              name: "发生死亡不良反应",
-            },
-          ],
-          formatter: function (name) {
-            let data = [
-              {
-                value: 10,
-                name: "一般不良反应",
-              },
-              {
-                value: 5,
-                name: "严重不良反应",
-              },
-              {
-                value: 15,
-                name: "发生死亡不良反应",
-              },
-            ];
-
-            // 获取该选项在数据数组中的索引
-            var index = data.findIndex(function (item) {
-              return item.name == name;
-            });
-
-            // 获取该选项的值
-            var value = data[index].value;
-
-            // 计算该选项的百分比
-            var percent =
-              (
-                (value /
-                  data.reduce(function (sum, item) {
-                    return sum + item.value;
-                  }, 0)) *
-                100
-              ).toFixed(2) + "%";
-
-            // 返回自定义的显示内容
-            return "{name|" + name + "}\n{percent|" + percent + "}";
-          },
-        },
         polar: { center: this.center, color: "#0B3A72" },
         angleAxis: { center: this.center, color: "#0B3A72" },
         radiusAxis: {
           color: "#0B3A72",
           center: this.center,
-          min: 40,
+          min: 10,
-          max: 120,
+          max: 70,
-          interval: 20,
+          interval: 10,
           axisLine: {
             show: false,
             lineStyle: {
@@ -251,8 +270,9 @@ export default {
             color: "#0B3A72",
             center: this.center,
             type: "pie",
-            radius: ["5%", "10%"],
+            radius: ["9%", "16%"],
             hoverAnimation: false,
+            tooltip: { show: false },
             labelLine: {
               normal: {
                 show: false,
@@ -269,7 +289,7 @@ export default {
                 value: 0,
                 itemStyle: {
                   normal: {
-                    color: "#0B3E5E",
+                    color: "#fff",
                   },
                 },
               },
@@ -278,7 +298,7 @@ export default {
           {
             center: this.center,
             type: "pie",
-            radius: ["100%", "99%"],
+            radius: ["96%", "95%"],
             color: "#0B3A72",
             hoverAnimation: false,
             labelLine: {
@@ -308,7 +328,7 @@ export default {
             center: this.center,
             stack: "a",
             type: "pie",
-            radius: ["20%", "90%"],
+            radius: ["26%", "68%"],
             roseType: "area",
             zlevel: 10,
             label: {
@@ -333,20 +353,7 @@ export default {
                 show: false,
               },
             },
-            data: [
+            data: this.pieData,
-              {
-                value: 10,
-                name: "一般不良反应",
-              },
-              {
-                value: 5,
-                name: "严重不良反应",
-              },
-              {
-                value: 15,
-                name: "发生死亡不良反应",
-              },
-            ],
           },
         ],
       };
@@ -358,9 +365,6 @@ export default {
 };
 </script>
 <style scoped lang='scss'>
-.box {
-}
-
 .top-box {
   .topbox-item {
     &:nth-child(1) {
@@ -424,7 +428,7 @@ export default {
         font-family: Alibaba PuHuiTi;
         font-weight: 400;
         color: #b7d4f5;
-        line-height: 50px;
+        // line-height: 50px;
       }
     }
 
@@ -453,7 +457,7 @@ export default {
         font-family: Alibaba PuHuiTi;
         font-weight: 400;
         color: #b7d4f5;
-        line-height: 50px;
+        // line-height: 50px;
         opacity: 0.5;
       }
     }
@@ -497,9 +501,99 @@ export default {
     }
   }
 }
+.footers {
+  height: calc(100% - 120px);
+  display: flex;
 
+  .lefts {
+    height: 100%;
+    width: 50%;
+    padding: 10px;
     .bottom-box {
-  height: 170px;
+      height: 100%;
       width: 100%;
     }
+  }
+  .rights {
+    height: 100%;
+    padding-left: 15px;
+    width: 50%;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-evenly;
+  }
+}
+
+.pt-top {
+  display: flex;
+  align-items: center;
+  position: relative;
+  .ptleftbox {
+    width: 12%;
+    height: 100%;
+    .rectangular1 {
+      height: 8px;
+      width: 8px;
+      background: #2e87e8;
+    }
+    .rectangular2 {
+      height: 8px;
+      width: 8px;
+      background: #f0a436;
+    }
+    .rectangular3 {
+      height: 8px;
+      width: 8px;
+      background: #f35656;
+    }
+  }
+  .texts {
+    width: 60%;
+    font-size: 16px;
+    font-family: Alibaba PuHuiTi;
+    font-weight: 400;
+    color: #b7d4f5;
+  }
+  .react1 {
+    // font-size: 20px;
+    font-family: Alibaba PuHuiTi;
+    font-weight: 400;
+    color: #2e87e8;
+    padding-left: 10px;
+  }
+  .react2 {
+    // font-size: 20px;
+    font-family: Alibaba PuHuiTi;
+    font-weight: 400;
+    color: #f0a436;
+    padding-left: 10px;
+  }
+  .react3 {
+    // font-size: 20px;
+    font-family: Alibaba PuHuiTi;
+    font-weight: 400;
+    padding-left: 10px;
+
+    color: #f35656;
+  }
+  .ptStyle {
+    width: 60%;
+    margin-top: 5px;
+    background: linear-gradient(
+      to right,
+      rgba(36, 64, 97, 1),
+      rgba(36, 64, 97, 0)
+    );
+  }
+  .boxLine {
+    position: absolute;
+    width: 18px;
+    height: 20px;
+    border: 1px solid #0e2339;
+    border-right: none;
+    border-top: none;
+    left: 3px;
+    top: -5px;
+  }
+}
 </style>

src/views/bigpage/bigcomponents/Basicbox.vue

@@ -78,8 +78,8 @@ export default {
 <style scoped lang='scss'>
 .Basic-box {
     width: 100%;
-    height: 300px;
+    height: 320px;
-    padding: 0 11px 11px 11px;
+    padding: 0 11px 0px 11px;
     overflow-y: auto;
 
     .Basic-box-item {

src/views/bigpage/bigcomponents/ChangeinformationList.vue

@@ -1,13 +1,13 @@
 
 <template>
-  <div class="Basic-box">
+  <div class="Basic-box" ref="basic">
     <el-table
       :data="tableData"
       v-loading="load1"
       element-loading-text="加载中..."
       element-loading-spinner="el-icon-loading"
       element-loading-background="rgba(0, 0, 0, 0.8)"
-      height="208"
+      :height="height"
       stripe
       style="width: 100%; background-color: transparent"
     >
@@ -22,6 +22,7 @@
       >
       </el-table-column>
     </el-table>
+    <div ref="pagination">
       <Pagination
         :total="total"
         :page="query.current"
@@ -29,6 +30,7 @@
         @pagination="changeList"
       ></Pagination>
     </div>
+  </div>
 </template>
 
 <script>
@@ -73,10 +75,15 @@ export default {
       },
       total: 0,
       load1: false,
+      height: 0,
     };
   },
   created() {},
   mounted() {
+    this.$nextTick(() => {
+      this.height =
+        this.$refs.basic.offsetHeight - this.$refs.pagination.offsetHeight;
+    });
     this.getList();
   },
   methods: {
@@ -103,7 +110,7 @@ export default {
 .Basic-box {
   margin-top: 10px;
   width: 100%;
-  height: 300px;
+  height: calc(100% - 41px - 10px);
   // padding: 0 11px 11px 11px;
   overflow-y: auto;
   background-color: transparent;

src/views/bigpage/bigcomponents/informationBox.vue

@@ -4,7 +4,17 @@
     <div class="top-box">
       <div class="topbox-item">
         <div class="topBOxitem">
-          <div class="topBOxitem-top"><span>12</span> <span>次</span></div>
+          <el-tooltip
+            class="item"
+            effect="dark"
+            :content="countryC"
+            placement="top-start"
+          >
+            <div class="topBOxitem-top">
+              <span>{{ countryC || 0 }}</span> <span>次</span>
+            </div>
+          </el-tooltip>
+
           <div class="topBOxitem-bottom">国家检测次数</div>
         </div>
       </div>
@@ -13,11 +23,11 @@
           <el-tooltip
             class="item"
             effect="dark"
-            content="1221111121212121"
+            :content="provinceC"
             placement="top-start"
           >
             <div class="topBOxitem-top">
-              <span>1221111121212121</span> <span>次</span>
+              <span>{{ provinceC || 0 }}</span> <span>次</span>
             </div>
           </el-tooltip>
 
@@ -26,8 +36,9 @@
       </div>
       <div class="topbox-item">
         <div class="topBOxitem">
-          <div class="topBOxitem-top"><span>12%</span></div>
+          <div class="topBOxitem-top">
-
+            <span>{{ pt }}%</span>
+          </div>
           <div class="topBOxitem-bottom">抽检合格率</div>
         </div>
       </div>
@@ -69,6 +80,13 @@ export default {
       // echarts
       myChart2: {},
       //==============
+      provinceC: 0,
+      countryC: 0,
+      //合格率
+      pt: 0,
+      //抽样类型
+      sccy: 0,
+      ltcy: 0,
     };
   },
   created() {},
@@ -79,7 +97,18 @@ export default {
     getData() {
       let newRouter = this.$route.query;
       getCPCJ({ name: newRouter.code }).then((res) => {
-        console.log(res);
+        // res.data.result.forEach((value, index) => {
+        //   if (value.sampleType == 1) {
+        //     this.provinceC += 1;
+        //   } else if (value.sampleType == 2) {
+        //     this.countryC += 1;
+        //   }
+        // });
+        this.countryC = 12;
+        this.provinceC = 12;
+        this.pt = 67;
+        this.sccy = 60;
+        this.ltcy = 40;
         this.$nextTick(() => {
           let chartDom = this.$refs["left-echart"];
           this.myChart1 = echarts.init(chartDom);
@@ -92,6 +121,7 @@ export default {
     },
     initEcharts() {
       this.option1 = {
+        color: ["#007EFF", "#2CD8EC"],
         tooltip: {
           trigger: "item",
           // formatter: "{a} <br/>{b}: {c} ({d}%)", // 鼠标悬浮在各分区时的提示内容
@@ -111,20 +141,27 @@ export default {
             "padding: 10px; background-color: rgba(0, 0, 0, 0.7); color: #fff;", // 设置提示框的样式
         },
         legend: {
+          orient: "horizontal",
           bottom: 0,
-          left: "center",
+          itemWidth: 10,
+          itemHeight: 10,
+          itemGap: 25,
           data: ["生产抽样环节", "流通环节抽样"],
           textStyle: {
             color: "auto",
-            fontSize: 14,
+            fontSize: 12,
           },
         },
         series: [
           {
             name: "",
             type: "pie",
-            radius: ["50%", "70%"],
+            radius: ["45%", "70%"],
             center: ["50%", "40%"], // 调整 y 值为 '40%'，使饼图向上位移
+            // itemStyle:{
+            //     borderWidth:1, //设置border的宽度有多大
+            //     borderColor:'#fff',
+            // },
             labelLine: {
               normal: {
                 length: 15, // 指示线宽度
@@ -157,14 +194,14 @@ export default {
               {
                 value: 39,
                 name: "生产抽样环节",
-                percent: "39",
+                // percent: "39",
-                itemStyle: { color: "#007EFF" },
+                // itemStyle: { color: "#007EFF" },
               },
               {
                 value: 21,
                 name: "流通环节抽样",
-                percent: "21",
+                // percent: "21",
-                itemStyle: { color: "#2CD8EC" },
+                // itemStyle: { color: "#2CD8EC" },
               },
             ],
           },
@@ -205,7 +242,7 @@ export default {
             axisTick: {
               show: false,
             },
-            data: ["辽宁", "黑龙江", "北京", "上海", "深圳", "苏州"],
+            data: ["辽宁", "江苏", "湖南", "山西", "湖北", "山东"],
           },
         ],
         yAxis: [
@@ -237,7 +274,7 @@ export default {
         series: [
           {
             type: "bar",
-            barWidth: "10",
+            barWidth: "16",
             itemStyle: {
               normal: {
                 color: {
@@ -247,13 +284,14 @@ export default {
                   x2: 0,
                   y2: 1,
                   colorStops: [
+                    // background: linear-gradient(0deg, #21B5E1 100%);
                     {
                       offset: 0,
                       color: "rgba(33,181,225,1)", // 起始颜色
                     },
                     {
                       offset: 1,
-                      color: "rgba(0,0,0,0.1)", // 结束颜色
+                      color: "rgba(6,31,55,0.1)", // 结束颜色
                     },
                   ],
                 },
@@ -263,6 +301,7 @@ export default {
                 // }
               },
             },
+
             data: [12, 15, 17, 20, 25, 26],
           },
         ],
@@ -280,7 +319,7 @@ export default {
 .top-box {
   margin: 10px 0;
   height: 85px;
-  width: 100%F;
+  width: 100%;
   display: flex;
   justify-content: space-around;
 

src/views/bigpage/bigcomponents/riskinformationList.vue

@@ -1,10 +1,25 @@
 
 <template>
-    <div class="Basic-box">
+  <div class="Basic-box" ref="basic">
-        <el-table :data="tableData" stripe style="width: 100%;background-color: transparent;">
+    <el-table
-            <el-table-column prop="data" label="预警日期" width="100" show-overflow-tooltip>
+      :data="tableData"
+      stripe
+      :height="height"
+      style="width: 100%; background-color: transparent"
+    >
+      <el-table-column
+        prop="data"
+        label="预警日期"
+        width="100"
+        show-overflow-tooltip
+      >
       </el-table-column>
-            <el-table-column prop="name" label="预警内容" width="180" show-overflow-tooltip>
+      <el-table-column
+        prop="name"
+        label="预警内容"
+        width="180"
+        show-overflow-tooltip
+      >
       </el-table-column>
       <el-table-column prop="address" label="分办处室" show-overflow-tooltip>
       </el-table-column>
@@ -13,76 +28,59 @@
       <el-table-column prop="address" label="完成日期" show-overflow-tooltip>
       </el-table-column>
     </el-table>
+    <div ref="pagination">
       <Pagination></Pagination>
     </div>
+  </div>
 </template>
   
 <script>
-import Pagination from "@/views/components/Pagination"
+import Pagination from "@/views/components/Pagination";
 export default {
-    name: 'Basicbox',
+  name: "Basicbox",
   components: { Pagination },
   data() {
     return {
-            tableData: [{
+      tableData: [],
-                data: "审批类变更概述",
+      height: 0,
-                name: "原料对乙酰胺基供应",
+    };
-                address: "2022-06-08",
-                address: "2022-06-08",
-                address: "2022-06-08"
-            }, {
-                data: "审批类变更概述",
-                name: "-",
-                address: "2022-06-08"
-            }, {
-                data: "审批类变更概述",
-                name: "-",
-                address: "2022-06-08"
-            },
-            {
-                data: "审批类变更概述",
-                name: "-",
-                address: "2022-06-08"
-            },
-            
-            ]
-        }
   },
   created() {},
-    mounted() { },
+  mounted() {
+    this.$nextTick(() => {
+      this.height =
+        this.$refs.basic.offsetHeight - this.$refs.pagination.offsetHeight;
+    });
+  },
   methods: {},
-    computed: {}
+  computed: {},
-}
+};
 </script>
 <style scoped lang='scss'>
 .Basic-box {
   margin-top: 10px;
   width: 100%;
-    height: 200px;
+  height: calc(100% - 90px - 41px - 10px);
-    padding: 0 11px 11px 11px;
+  //   padding: 0 11px 11px 11px;
   // overflow-y: auto;
   background-color: transparent;
 }
 
-
 ::v-deep .el-table,
 .el-table__expanded-cell {
   background-color: transparent;
-
 }
 
 ::v-deep .el-table th {
   background-color: rgba(0, 100, 255, 0.2) !important;
-    color: #2492FF;
+  color: #2492ff;
   border: none;
-
 }
 
 ::v-deep .el-table td {
   padding: 7px 0;
 
   border: none;
-
 }
 
 ::v-deep .el-table::before {
@@ -92,13 +90,11 @@ export default {
 ::v-deep .el-table tr {
   padding: 0;
   background-color: transparent !important;
-    color: #B7D4F5;
+  color: #b7d4f5;
-
 }
 
 ::v-deep .el-table tbody tr:hover td {
-
+  background-color: transparent !important;
-    background-color: transparent !important
 }
 
 ::v-deep .el-table th.el-table__cell.is-leaf,
@@ -109,5 +105,6 @@ export default {
 // 显示的颜色
 ::v-deep .el-table .el-table__body tr.el-table__row--striped td {
   background-color: rgba(0, 50, 150, 0.1) !important;
-}</style>
+}
+</style>
   

src/views/bigpage/index.vue

@@ -43,9 +43,7 @@
               <div class="fengxian-top-left">复方枸杞子胶囊</div>
               <div class="fengxian-top-right">
                 <span>保健药</span>
-                <span>保健药</span>
+                <span>OTC</span>
-                <span>保健药</span>
-                <span>保健药</span>
               </div>
             </div>
             <headtitle mytitle="风险提示信息"></headtitle>
@@ -58,7 +56,10 @@
         </div>
         <!-- 右边 -->
         <div class="system-box-right">
-          <div class="top">
+          <div
+            class="top"
+            v-if="this.$route.query.type == 1 || this.$route.query.type == 2"
+          >
             <headtitle mytitle="召回信息"></headtitle>
             <recallbox></recallbox>
           </div>
@@ -73,6 +74,7 @@
 </template>
   
 <script>
+import {getXXMSG} from '@/api/largeScreen'
 // 头部
 import headtitle from "./bigcomponents/headtitle";
 // 基本信息
@@ -107,6 +109,8 @@ export default {
     toBack() {
       this.$router.go(-1);
     },
+    getData(){
+    }
   },
   computed: {},
 };
@@ -344,6 +348,7 @@ div {
     .fengxian-top {
       padding: 0 30px;
       height: 80px;
+      box-sizing: border-box;
       background: rgba(0, 168, 255, 0.04);
       border-radius: 10px;
       margin-bottom: 10px;

src/views/index.vue

@@ -43,7 +43,7 @@
       <div class="content-bottom-box">
         <div class="content-bottom">
           <div class="input">
-            <el-input v-model="input" placeholder="请输入内容"></el-input>
+            <el-input v-model="input" placeholder="请输入产品名称、批准文号/备案编号"></el-input>
           </div>
           <div class="sousuo" @click="gotoBgpage">
             <img src="@/assets/images/daping/searchicon.png" alt="" />