title

src/view/dialog/dialog.vue

@@ -15,10 +15,25 @@
           </el-icon>
         </div>
       </template>
+
       <div class="tabelPart">
+        <div class="bo">
+          <div class="title">
+            <div class="title_top">
+              <img src="@/assets/images/table_l.png" alt="" />
+              <div class="name">{{ title }}详情</div>
+              <img src="@/assets/images/table_r.png" alt="" />
+            </div>
+            <img
+              class="title_botton"
+              src="@/assets/images/table_c.png"
+              alt=""
+            />
+          </div>
+        </div>
         <el-table
           :data="data.tableData"
-          height="calc(100% - 40px)"
+          height="calc(100% - 110px)"
           :header-cell-style="{ background: '#008FCD' }"
         >
           <!-- <el-table-column
@@ -163,7 +178,7 @@ const handle = (current) => {
 }
 
 .tabelPart {
-  height: 60vh;
+  height: 80vh;
   padding: 16px;
   background: linear-gradient(
       270deg,
@@ -212,4 +227,45 @@ const handle = (current) => {
     background-color: rgba(0, 116, 255, 0) !important;
   }
 }
+.bo {
+  width: 100%;
+  display: flex;
+  // align-items: center;
+}
+.title {
+  margin: 10px auto;
+  display: flex;
+  flex-direction: column;
+  &_top {
+    display: flex;
+    align-items: end;
+    img {
+      height: 33px;
+      width: 33px;
+    }
+    img:nth-child(1) {
+      margin-right: 10px;
+    }
+    img:nth-child(2) {
+      margin-left: 10px;
+    }
+    .name {
+      font-family: PangMenZhengDao, PangMenZhengDao;
+      font-weight: 600;
+      font-size: 33px;
+      color: #ffffff;
+      line-height: 38px;
+      text-align: center;
+      font-style: normal;
+      letter-spacing: 2px;
+      background: linear-gradient(180deg, #ffffff 0%, #51ffef 100%);
+      -webkit-background-clip: text; /*将设置的背景颜色限制在文字中*/
+      -webkit-text-fill-color: transparent; /*给文字设置成透明*/
+    }
+  }
+  &_botton {
+    margin-top: 5px;
+    height: 19px;
+  }
+}
 </style>