From 3b2d91db93034475788a43388706b2dfaf87e6e2 Mon Sep 17 00:00:00 2001
From: Anyon <zoujingli@qq.com>
Date: Thu, 6 Jan 2022 11:24:22 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=A8=A1=E6=9D=BF=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 static/template/layout.vue    | 24 +++++++++++++++++---
 static/template/pages/thr.vue | 42 +++++++++++++++++------------------
 static/template/pages/two.vue |  8 +++----
 3 files changed, 45 insertions(+), 29 deletions(-)

diff --git a/static/template/layout.vue b/static/template/layout.vue
index 492e47be5..b74261bb6 100644
--- a/static/template/layout.vue
+++ b/static/template/layout.vue
@@ -164,6 +164,7 @@ body > .el-container {
     height: 1px;
 
     > .el-aside {
+      z-index: 99;
       background: #53a8ff;
       --el-aside-width: 280px;
 
@@ -239,17 +240,32 @@ body > .el-container {
           height: 100%;
 
           > .el-header {
+            z-index: 99;
             background: white;
             line-height: 60px;
+            box-shadow: 0 0 6px 0 rgb(0 0 0 / 20%);
           }
 
           > .el-main {
             height: 1px;
-            padding: 0;
+            z-index: 88;
+            --el-main-padding: 0;
 
             > .el-scrollbar {
-              padding: 20px;
+              padding: 0;
               box-sizing: border-box;
+
+              > .el-scrollbar__wrap {
+                border-radius: 5px;
+
+                > .el-scrollbar__view {
+                  margin: 15px;
+                  padding: 20px;
+                  background: #FFF;
+                  border-radius: 5px;
+                  box-shadow: 0 0 6px 0 rgb(0 0 0 / 20%);
+                }
+              }
             }
           }
         }
@@ -257,7 +273,9 @@ body > .el-container {
 
       > .el-footer {
         color: #333;
-        background: #CCCCCC;
+        z-index: 99;
+        box-shadow: 0 0 6px 0 rgb(0 0 0 / 20%);
+        background: #FFF;
         line-height: 60px;
         text-align: center;
       }
diff --git a/static/template/pages/thr.vue b/static/template/pages/thr.vue
index f704c4e36..462e5eded 100644
--- a/static/template/pages/thr.vue
+++ b/static/template/pages/thr.vue
@@ -11,30 +11,28 @@
     </el-header>
     <el-main>
       <el-scrollbar>
-        <div style="padding:15px;background:white;border-radius:10px">
+        
+        <el-form :inline="true" class="demo-form-inline">
+          <el-form-item label="Approved by">
+            <el-input placeholder="Approved by"></el-input>
+          </el-form-item>
+          <el-form-item label="Activity zone">
+            <el-select placeholder="Activity zone">
+              <el-option label="Zone one" value="shanghai"></el-option>
+              <el-option label="Zone two" value="beijing"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary">Query</el-button>
+          </el-form-item>
+        </el-form>
 
-          <el-form :inline="true" class="demo-form-inline">
-            <el-form-item label="Approved by">
-              <el-input placeholder="Approved by"></el-input>
-            </el-form-item>
-            <el-form-item label="Activity zone">
-              <el-select placeholder="Activity zone">
-                <el-option label="Zone one" value="shanghai"></el-option>
-                <el-option label="Zone two" value="beijing"></el-option>
-              </el-select>
-            </el-form-item>
-            <el-form-item>
-              <el-button type="primary">Query</el-button>
-            </el-form-item>
-          </el-form>
+        <el-table :data="tableData" border style="width:100%">
+          <el-table-column prop="date" label="Date" width="180"/>
+          <el-table-column prop="name" label="Name" width="180"/>
+          <el-table-column prop="address" label="Address"/>
+        </el-table>
 
-          <el-table :data="tableData" border style="width:100%">
-            <el-table-column prop="date" label="Date" width="180"/>
-            <el-table-column prop="name" label="Name" width="180"/>
-            <el-table-column prop="address" label="Address"/>
-          </el-table>
-
-        </div>
       </el-scrollbar>
     </el-main>
   </el-container>
diff --git a/static/template/pages/two.vue b/static/template/pages/two.vue
index 9c605520c..20b3f6702 100644
--- a/static/template/pages/two.vue
+++ b/static/template/pages/two.vue
@@ -2,7 +2,7 @@
   <el-container>
     <el-header>
       <el-row justify="space-between">
-        <el-col :span="12">Item-Two-Page</el-col>
+        <el-col :span="12">Element Plus Icons for {{ userName }} Template</el-col>
         <el-col :span="12" style="text-align:right">
           <el-button>功能按钮1</el-button>
           <el-button>功能按钮2</el-button>
@@ -13,9 +13,9 @@
       <el-scrollbar>
 
         <div v-for="icon in icons">
-          <div>
-            <component :size="10" :is="icon.name"></component>
-            <b>{{ icon.name }}：</b>{{ icon }}
+          <div style="line-height:3em">
+            <component style="vertical-align:middle;color:#F56C6C" :width="20" :height="20" :is="icon.name"></component>
+            <b style="margin-left:1em">{{ icon.name }}：</b>{{ icon }}
           </div>
         </div>