dengjie commit : dire_data.vue修改部分样式

src/views/content/components/dire_data.vue

@@ -1,17 +1,24 @@
 <template>
-<div class="dire_data"  style="background-color:#fff;  margin-top: 3rem;">
+  <div class="dire_data" style="background-color:#fff;  margin-top: 3rem;">
 
     <el-row v-for="(dire,index) in value" :key="index">
       <!--正文内容-->
+
+
       <el-col class="context" :span="23">
+        <!--      <el-row class="context_el-row">-->
+        <!--        <el-col :span="1" :offset="1">-->
+        <!--          <img class="context_img" src="@/assets/teaching_staff/eji_icon_ys.png" alt=""/>-->
+        <!--        </el-col>-->
+        <!--        <el-col :span="4" class="context_name">{{ dire.name }}</el-col>-->
+        <!--        <el-col :span="16">-->
+        <!--          <hr class="context_hr">-->
+        <!--        </el-col>-->
+        <!--      </el-row>-->
         <el-row class="context_el-row">
-        <el-col :span="1" :offset="1">
           <img class="context_img" src="@/assets/teaching_staff/eji_icon_ys.png" alt="">
-        </el-col>
-        <el-col :span="4" class="context_name">{{ dire.name }}</el-col>
-        <el-col :span="16">
-          <hr class="context_hr">
-        </el-col>
+          <div class="context_name">{{ dire.name }}</div>
+          <div class="context_hr"></div>
         </el-row>
         <el-row v-for="(chile,index) in dire.children" :key="index">
           <el-col class="name" :offset="1" :span="23">
@@ -25,7 +32,7 @@
         </el-row>
       </el-col>
     </el-row>
-</div>
+  </div>
 </template>
 
 <script>
@@ -34,9 +41,9 @@ export default {
   data() {
     return {
       width: document.documentElement.clientWidth
-    }
+    };
   },
-  props:{
+  props: {
     value: {
       type: Array,
       default: [{
@@ -48,51 +55,52 @@ export default {
               {
                 children: [],
                 name: "人员1"
+              }
+            ]
+          }
+        ]
+      }]
+    }
   },
-            ],
-          }
-        ],
-      }],
-    },
-  },
-  methods:{
-    linkClick(chile){
-      if (chile.link!=null && chile.link != ""){
-        window.open(chile.link)
+  methods: {
+    linkClick(chile) {
+      if (chile.link != null && chile.link != "") {
+        window.open(chile.link);
       }
     }
   }
-}
+};
 </script>
 
 <style scoped lang="scss">
-
 .context {
   margin: 3rem 2rem;
   padding-bottom: 3rem;
-  //width: 84.3rem;
-  //background: #FFFFFF;
+  width: 92%;
+  background: #FFFFFF;
 
   .context_el-row {
+    display: flex;
     margin-top: 2rem;
 
     .context_img {
       width: 2.2rem;
+      margin-left: 3%;
     }
 
     .context_name {
       font-size: 1.8rem;
-      font-family: PingFangSC-Medium, PingFang SC;
       font-weight: 500;
       color: #1956BC;
-      line-height: 2.2rem;
+      padding: 0 20px;
+      white-space:nowrap;
     }
 
     .context_hr {
-      line-height: 2.2rem;
       margin-top: 1.1rem;
-      border: #1956BC solid 0.1rem;
       background-color: #1956BC;
+      width: 100%;
+      height: 2px;
     }
   }
 
@@ -102,10 +110,12 @@ export default {
     font-weight: 600;
     //color: #1956BC;
   }
+
   .text {
     font-size: 1.4rem;
     //color: #3C3C3C;
     clear: left;
+
     div {
       float: left;
       margin-top: .4rem;
@@ -114,10 +124,44 @@ export default {
       margin-right: 1.5rem;
       color: #000000;
     }
-    div:hover{
+
+    div:hover {
       color: #1956BC;
     }
   }
 }
 
+
+//.context {
+//  margin: 3rem 2rem;
+//  padding-bottom: 3rem;
+//width: 84.3rem;
+//background: #FFFFFF;
+
+//.context_el-row {
+//  margin-top: 2rem;
+//
+//  .context_img {
+//    width: 2.2rem;
+//  }
+//
+//  .context_name {
+//    font-size: 1.8rem;
+//    font-family: PingFangSC-Medium, PingFang SC;
+//    font-weight: 500;
+//    color: #1956BC;
+//    line-height: 2.2rem;
+//  }
+//
+//  .context_hr {
+//    line-height: 2.2rem;
+//    margin-top: 1.1rem;
+//    border: #1956BC solid 0.1rem;
+//    background-color: #1956BC;
+//  }
+//}
+
+
+//}
+
 </style>