更改化妆品

src/views/firmContent/drugInfo/index.vue

@@ -18,65 +18,32 @@
     <div class="drugInfo-bottom">
       <div class="content-tabs">
         <div class="tabs">
-          <div
+          <div class="tab" @click="actionTab(1)" :class="action == 1 ? 'actionTab' : ''">
-            class="tab"
+            <img :class="action !== 1 ? 'actionImage' : ''" :src="action == 1
-            @click="actionTab(1)"
+              ? `${require('@/assets/images/home/icon1-1@2x.png')}`
-            :class="action == 1 ? 'actionTab' : ''"
+              : `${require('@/assets/images/home/icon1-2@2x.png')}`
-          >
+              " alt="" />
-            <img
-              :class="action !== 1 ? 'actionImage' : ''"
-              :src="
-                action == 1
-                  ? `${require('@/assets/images/home/icon1-1@2x.png')}`
-                  : `${require('@/assets/images/home/icon1-2@2x.png')}`
-              "
-              alt=""
-            />
             <span>基本信息</span>
           </div>
-          <div
+          <div class="tab" @click="actionTab(2)" :class="action == 2 ? 'actionTab' : ''">
-            class="tab"
+            <img :src="action == 2
-            @click="actionTab(2)"
+              ? `${require('@/assets/images/home/icon2-1@2x.png')}`
-            :class="action == 2 ? 'actionTab' : ''"
+              : `${require('@/assets/images/home/icon2-2@2x.png')}`
-          >
+              " alt="" />
-            <img
-              :src="
-                action == 2
-                  ? `${require('@/assets/images/home/icon2-1@2x.png')}`
-                  : `${require('@/assets/images/home/icon2-2@2x.png')}`
-              "
-              alt=""
-            />
             <span>品种抽样</span>
           </div>
-          <div
+          <div class="tab" @click="actionTab(3)" :class="action == 3 ? 'actionTab' : ''">
-            class="tab"
+            <img :src="action == 3
-            @click="actionTab(3)"
+              ? `${require('@/assets/images/home/icon5-1@2x.png')}`
-            :class="action == 3 ? 'actionTab' : ''"
+              : `${require('@/assets/images/home/icon5-2@2x.png')}`
-          >
+              " alt="" />
-            <img
-              :src="
-                action == 3
-                  ? `${require('@/assets/images/home/icon5-1@2x.png')}`
-                  : `${require('@/assets/images/home/icon5-2@2x.png')}`
-              "
-              alt=""
-            />
             <span>不良反应</span>
           </div>
-          <div
+          <div class="tab" @click="actionTab(4)" :class="action == 4 ? 'actionTab' : ''" v-show="urlA.type != 1">
-            class="tab"
+            <img :src="action == 4
-            @click="actionTab(4)"
+              ? `${require('@/assets/images/home/icon1-1@2x.png')}`
-            :class="action == 4 ? 'actionTab' : ''"
+              : `${require('@/assets/images/home/icon1-2@2x.png')}`
-          >
+              " alt="" />
-            <img
-              :src="
-                action == 4
-                  ? `${require('@/assets/images/home/icon1-1@2x.png')}`
-                  : `${require('@/assets/images/home/icon1-2@2x.png')}`
-              "
-              alt=""
-            />
             <span>召回信息</span>
           </div>
         </div>
@@ -114,20 +81,19 @@
       </div> -->
       <div class="drug-exit" :style="drugExitStyle">
         <!-- <router-view></router-view> -->
-        <component
+        <component :is="currentComponent" :transinformation="transinformation" @getCPName="getCPName"></component>
-          :is="currentComponent"
-          :transinformation="transinformation"
-          @getCPName="getCPName"
-        ></component>
       </div>
     </div>
   </div>
 </template>
 <script>
+import { mapState } from "vuex";
 import basicInfo from "./drugBasicInfo/drugBasicInfo";
 import PZchouyang from "./PZchouyang/PZchouyang";
 import adverseReaction from "./adverseReaction/adverseReaction";
 import zhaohui from "./zhaohui/PZchouyang.vue";
+
+
 export default {
   data() {
     return {
@@ -257,6 +223,12 @@ export default {
           };
       }
     },
+
+    // // ...
+    ...mapState({
+      urlA: (state) => state.app.urlA,
+    }),
+
   },
   mounted() {
     // params刷新数据会丢失
@@ -288,20 +260,24 @@ export default {
 </script>
 <style lang="scss" scoped>
 @import "@/assets/styles/utils.scss";
+
 .productinformation {
   width: 100%;
   height: 100%;
   background: rgba(255, 255, 255, 0.9);
   box-shadow: 0px 0px vw(12) 0px rgba(194, 212, 226, 0.64);
   border-radius: vw(10) vw(10) 0 0;
+
   .drugInfo-top {
     display: flex;
     justify-content: space-between;
     padding: vh(15) vw(25);
     border-bottom: vw(1) solid #edeef0;
+
     .close {
       cursor: pointer;
     }
+
     .top-left {
       display: flex;
       align-items: center;
@@ -322,6 +298,7 @@ export default {
           color: #292f38;
         }
       }
+
       .drug-tag {
         width: vw(200);
         display: flex;
@@ -341,6 +318,7 @@ export default {
           &:nth-of-type(2) {
             background-color: #eabb48;
           }
+
           &:last-child {
             margin-right: 0;
           }
@@ -348,14 +326,18 @@ export default {
       }
     }
   }
+
   .drugInfo-bottom {
     padding: 0 vw(25);
+
     .content-tabs {
       margin-top: vh(25);
+
       .tabs {
         width: 100%;
         display: flex;
         border-bottom: vw(1) solid #dbe0e8;
+
         .tab {
           border: vw(1) solid #dbe0e8;
           padding: vh(7) vw(22);
@@ -389,6 +371,7 @@ export default {
             color: #2f3742;
           }
         }
+
         .actionTab {
           background-color: #1e80eb;
 
@@ -406,6 +389,6 @@ export default {
     }
   }
 }
-::v-deep.pzChouyang .tables .el-table td {
+
-}
+::v-deep.pzChouyang .tables .el-table td {}
 </style>