dev

src/assets/scss/main.scss

@@ -108,11 +108,7 @@ body {
 .clear-margin {
   margin: 0;
 }
-.el-popper.is-light.type-popper, .el-popper.is-light>.el-popper__arrow:before{
-  background:#F5FAFF;
-}
 .el-popper.is-light.type-popper{
-  background:#F5FAFF;
   padding: 0;
 }
 .el-popper.is-light.id-code-popper{

src/components/SearchInput.vue

@@ -1,5 +1,4 @@
 <template>
-
   <el-popover placement="bottom-start" :visible="isVisible" :width="props.width" ref="popoverRef"
               :trigger-keys="[]" style="height: 500px" popper-class="type-popper">
     <template #reference>
@@ -19,7 +18,7 @@
       />
     </template>
     <div class="container">
-      <el-scrollbar>
+      <el-scrollbar style="max-height: 260px;width: 100%">
         <table class="table" style="width: 100%; border-collapse: collapse;max-height: 50px">
           <!-- 表头 -->
           <thead>
@@ -33,7 +32,6 @@
             </th>
           </tr>
           </thead>
-
           <!-- 表体 -->
           <tbody>
           <tr class="table-body"
@@ -167,6 +165,7 @@ const handlerBlur = () => {
 
     th {
       text-align: left;
+
       &:nth-child(1) {
         width: 200px;
         text-align: left;
@@ -182,6 +181,7 @@ const handlerBlur = () => {
     font-size: 14px;
     color: #666666;
     font-style: normal;
+
     td {
       &:nth-child(1) {
         width: 200px;
@@ -194,7 +194,6 @@ const handlerBlur = () => {
     }
 
 
-
     &:last-child {
       border-radius: 0 0 8px 8px;
     }
@@ -205,4 +204,8 @@ const handlerBlur = () => {
     }
   }
 }
+
+table thead tr {
+  background: #F5FAFF;;
+}
 </style>

src/components/common/goods/GoodsDetail.vue

@@ -1,5 +1,6 @@
 <template>
   <panel title="药品耗材">
+    <div class="panel-content" style="padding: 0 24px 24px">
       <el-table v-if="goodsDetail.length>0" :data="goodsDetail" max-height="300" style="width: 100%"
                 :header-cell-style="{ backgroundColor: '#F5FAFF' }">
         <el-table-column prop="name" label="名称" width="400">
@@ -98,6 +99,7 @@
         </div>
         <span v-if="status" style="padding: 10px">合计：￥{{ getTotalPrice() }}</span>
       </div>
+    </div>
   </panel>
 </template>
 <script setup lang="ts">

src/components/common/service/ServiceDetail.vue

@@ -1,6 +1,8 @@
 <template>
   <Panel title="服务项目">
-    <el-table v-if="itemDetail.length>0" :data="itemDetail" max-height="300" :header-cell-style="{ backgroundColor: '#F5FAFF' }">
+    <div class="panel-content" style="padding: 0 24px 24px">
+      <el-table v-if="itemDetail.length>0" :data="itemDetail" max-height="300"
+                :header-cell-style="{ backgroundColor: '#F5FAFF' }">
         <el-table-column prop="itemName" label="项目名称" show-overflow-tooltip width="400">
           <template #default="scope">
             <el-popover
@@ -48,7 +50,9 @@
         <el-table-column label="操作" v-if="props.status">
           <template #default="scope">
             <el-button type="danger" link @click="delService(scope.row)">
-            <el-icon style="margin-right: 3px"><Delete /></el-icon>
+              <el-icon style="margin-right: 3px">
+                <Delete/>
+              </el-icon>
               删除
             </el-button>
           </template>
@@ -66,6 +70,7 @@
         </div>
         <span v-if="status" style="padding: 10px">合计：￥{{ getTotalPrice() || 0 }}</span>
       </div>
+    </div>
   </Panel>
 </template>
 <script setup lang="ts">

src/components/inventory/purchase/AddOrder.vue

@@ -62,7 +62,9 @@
                       :value="item.id"
                   />
                 </el-select>
-                <el-button type="primary" @click="addSupplier">添加供应商</el-button>
+                <div class="default-btn" style="height: 100%" @click="addSupplier">
+                  <el-icon><Plus /></el-icon>
+                </div>
               </el-form-item>
             </el-col>
             <el-col :span="12">
@@ -192,7 +194,7 @@ import {ElMessage} from "element-plus";
 import AddSupplier from "@/components/inventory/supplier/AddSupplier.vue";
 import GoodsSearch from "@/components/inventory/GoodsSearch.vue";
 import CheckoutDetail from "@/components/inventory/CheckoutDetail.vue";
-import {Search} from "@element-plus/icons-vue";
+import {Plus} from "@element-plus/icons-vue";
 
 const orderForm = ref()
 const checkoutDetailRef = ref<any>(false);

src/views/LayoutSocial.vue

@@ -1,7 +1,8 @@
 <template>
   <div class="layout-container">
     <Header class="header"/>
-    <header>
+    <div class="body">
+      <header style="height: 50px">
         <div class="center-wrapper">
           <div class="childMenu">
             <router-link :to="item.path" class="child-item" v-for="(item,index) in childMenuList" :key="index">
@@ -10,46 +11,73 @@
           </div>
         </div>
       </header>
-    <div class="space"></div>
+      <main class="layout-main" style="margin-top: 24px">
-    <main class="layout-main">
         <router-view/>
       </main>
-    <div class="space"></div>
+    </div>
     <Footer class="footer"/>
   </div>
-
 </template>
 
 <style scoped lang="scss">
+.body{
+  height: 100%;
+  padding: 24px;
+  display: flex;
+  flex-direction: column;
+}
 .childMenu {
   width: 100%;
-  height: 60px;
+  height: 50px;
   background: #fff;
   display: flex;
   align-items: center;
+  border-radius: 8px;
+
   .child-item {
+    width: 136px;
     display: inline-block;
     color: #151515;
     outline: none;
     text-decoration: none;
     font-size: 18px;
-    margin-left: 10px;
+    height: 50px;
-    margin-right: 10px;
-    height: 35px;
     position: relative;
+    line-height: 50px;
+    text-align: center;
+    &::before{
+      content: '';
+      position: absolute;
+      right: 0;
+      top:50%;
+      display: block;
+      width: 2px;
+      height: 16px;
+      background: #D8D8D8;
+      border-radius: 1px;
+      transform: translate(0 ,-50%);
+    }
+    &:last-child::before{
+      display: none;
+    }
   }
 
   .router-link-active:after {
     content: '';
     display: block;
-    width: 100%;
+    width: 80px;
-    height: 2px;
+    height: 4px;
-    background-color:  #151515; // 下划线颜色
+    background-color: #4D6DE4; // 下划线颜色
     position: absolute;
-    bottom: -5px; // 调整下划线与文字的距离
+    bottom: 0; // 调整下划线与文字的距离
-    left: 0;
+    left: 50%;
+    transform: translateX(-50%);
+    border-radius: 2px;
   }
 }
+a.router-link-active.router-link-exact-active.child-item{
+  color: #4D6DE4;
+}
 </style>