From b96db9453b3b0aadfda650052836d658b9f02d2a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=B8=8D=E5=81=9A=E7=A0=81=E5=86=9C?= <599854767@qq.com>
Date: Sun, 20 Mar 2022 17:55:24 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96UI?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ZR.Vue/src/assets/styles/btn.scss             |  59 +----
 ZR.Vue/src/assets/styles/index.scss           | 213 ------------------
 ZR.Vue/src/components/Pagination/index.vue    |   2 +-
 ZR.Vue/src/components/RightToolbar/index.vue  |   6 +
 ZR.Vue/src/views/system/article/publish.vue   |   2 +-
 ZR.Vue/src/views/system/role/index.vue        |  11 +-
 .../src/views/system/user/profile/index.vue   |  66 ++++--
 .../views/system/user/profile/userAvatar.vue  |  18 ++
 8 files changed, 83 insertions(+), 294 deletions(-)

diff --git a/ZR.Vue/src/assets/styles/btn.scss b/ZR.Vue/src/assets/styles/btn.scss
index e6ba1a8..6730c40 100644
--- a/ZR.Vue/src/assets/styles/btn.scss
+++ b/ZR.Vue/src/assets/styles/btn.scss
@@ -39,61 +39,4 @@
 
 .yellow-btn {
   @include colorBtn($yellow)
-}
-
-.pan-btn {
-  font-size: 14px;
-  color: #fff;
-  padding: 14px 36px;
-  border-radius: 8px;
-  border: none;
-  outline: none;
-  transition: 600ms ease all;
-  position: relative;
-  display: inline-block;
-
-  &:hover {
-    background: #fff;
-
-    &:before,
-    &:after {
-      width: 100%;
-      transition: 600ms ease all;
-    }
-  }
-
-  &:before,
-  &:after {
-    content: '';
-    position: absolute;
-    top: 0;
-    right: 0;
-    height: 2px;
-    width: 0;
-    transition: 400ms ease all;
-  }
-
-  &::after {
-    right: inherit;
-    top: inherit;
-    left: 0;
-    bottom: 0;
-  }
-}
-
-.custom-button {
-  display: inline-block;
-  line-height: 1;
-  white-space: nowrap;
-  cursor: pointer;
-  background: #fff;
-  color: #fff;
-  -webkit-appearance: none;
-  text-align: center;
-  box-sizing: border-box;
-  outline: 0;
-  margin: 0;
-  padding: 10px 15px;
-  font-size: 14px;
-  border-radius: 4px;
-}
+}
\ No newline at end of file
diff --git a/ZR.Vue/src/assets/styles/index.scss b/ZR.Vue/src/assets/styles/index.scss
index 8d568f1..b9c6097 100644
--- a/ZR.Vue/src/assets/styles/index.scss
+++ b/ZR.Vue/src/assets/styles/index.scss
@@ -96,71 +96,15 @@ div:focus {
   }
 }
 
-aside {
-  background: #eef1f6;
-  padding: 8px 24px;
-  margin-bottom: 20px;
-  border-radius: 2px;
-  display: block;
-  line-height: 32px;
-  font-size: 16px;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
-  color: #2c3e50;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-
-  a {
-    color: #337ab7;
-    cursor: pointer;
-
-    &:hover {
-      color: rgb(32, 160, 255);
-    }
-  }
-}
-
 //main-container全局样式
 .app-container {
   padding: 20px;
 }
 
-.components-container {
-  margin: 30px 50px;
-  position: relative;
-}
-
-.pagination-container {
-  margin-top: 30px;
-}
-
 .text-center {
   text-align: center
 }
 
-.sub-navbar {
-  height: 50px;
-  line-height: 50px;
-  position: relative;
-  width: 100%;
-  text-align: right;
-  padding-right: 20px;
-  transition: 600ms ease position;
-  background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%);
-
-  .subtitle {
-    font-size: 20px;
-    color: #fff;
-  }
-
-  &.draft {
-    background: #d0d0d0;
-  }
-
-  &.deleted {
-    background: #d0d0d0;
-  }
-}
-
 .link-type,
 .link-type:focus {
   color: #337ab7;
@@ -171,15 +115,6 @@ aside {
   }
 }
 
-//refine vue-multiselect plugin
-.multiselect {
-  line-height: 16px;
-}
-
-.multiselect--active {
-  z-index: 1000 !important;
-}
-
 /** 基础通用 **/
 .pt5 {
   padding-top: 5px;
@@ -265,27 +200,6 @@ aside {
   margin-top: 6vh !important;
 }
 
-/** 表格布局 **/
-.pagination-container {
-  position: relative;
-  height: 25px;
-  margin-top: 5px;
-  padding: 10px 20px !important;
-}
-
-/* tree border */
-.tree-border {
-  margin-top: 5px;
-  border: 1px solid #e5e6e7;
-  background: #FFFFFF none;
-  border-radius: 4px;
-}
-
-.pagination-container .el-pagination {
-  right: 0;
-  position: absolute;
-}
-
 .pull-right {
   float: right !important;
 }
@@ -336,139 +250,12 @@ aside {
   border-radius: 50%;
 }
 
-.img-lg {
-  width: 120px;
-  height: 120px;
-}
-
-.vue-treeselect.mini {
-  font-size: 12px !important;
-}
-
-.vue-treeselect.small {
-  font-size: 13px !important;
-}
-
-.vue-treeselect.medium {
-  font-size: 14px !important;
-}
-
-.vue-treeselect.mini .vue-treeselect__control {
-  height: 28px;
-}
-
-.vue-treeselect.small .vue-treeselect__control {
-  height: 32px;
-}
-
-.vue-treeselect.medium .vue-treeselect__control {
-  height: 34px;
-}
-
-.vue-treeselect.mini .vue-treeselect__single-value {
-  line-height: 28px;
-}
-
-.vue-treeselect.small .vue-treeselect__single-value {
-  line-height: 32px;
-}
-
-.vue-treeselect.medium .vue-treeselect__single-value {
-  line-height: 34px;
-}
-
-
-.list-group-striped>.list-group-item {
-  border-left: 0;
-  border-right: 0;
-  border-radius: 0;
-  padding-left: 0;
-  padding-right: 0;
-}
-
-.list-group {
-  padding-left: 0px;
-  list-style: none;
-}
-
-.list-group-item {
-  border-bottom: 1px solid #e7eaec;
-  border-top: 1px solid #e7eaec;
-  margin-bottom: -1px;
-  padding: 11px 0px;
-  font-size: 13px;
-}
-
-.pull-right {
-  float: right !important;
-}
-
-.el-card__header {
-  padding: 14px 15px 7px;
-  min-height: 40px;
-}
-
-.el-card__body {
-  padding: 15px 20px 20px 20px;
-}
-
 .card-box {
   padding-right: 15px;
   padding-left: 15px;
   margin-bottom: 10px;
 }
 
-/* button color */
-.el-button--cyan.is-active,
-.el-button--cyan:active {
-  background: #20B2AA;
-  border-color: #20B2AA;
-  color: #FFFFFF;
-}
-
-.el-button--cyan:focus,
-.el-button--cyan:hover {
-  background: #48D1CC;
-  border-color: #48D1CC;
-  color: #FFFFFF;
-}
-
-.el-button--cyan {
-  background-color: #20B2AA;
-  border-color: #20B2AA;
-  color: #FFFFFF;
-}
-
-
-.img-lg {
-  width: 120px;
-  height: 120px;
-}
-
-// 导航栏头像
-.avatar-upload-preview {
-  position: absolute;
-  top: 50%;
-  transform: translate(50%, -50%);
-  width: 180px;
-  height: 180px;
-  border-radius: 50%;
-  box-shadow: 0 0 4px #ccc;
-  overflow: hidden;
-}
-
-/* 拖拽列样式 */
-.sortable-ghost {
-  opacity: .8;
-  color: #fff !important;
-  background: #42b983 !important;
-}
-
-.top-right-btn {
-  position: relative;
-  float: right;
-}
-
 .icon {
   width: 100px;
 }
diff --git a/ZR.Vue/src/components/Pagination/index.vue b/ZR.Vue/src/components/Pagination/index.vue
index 5f9dbad..e51c145 100644
--- a/ZR.Vue/src/components/Pagination/index.vue
+++ b/ZR.Vue/src/components/Pagination/index.vue
@@ -93,7 +93,7 @@ export default {
 <style scoped>
 .pagination-container {
   background: #fff;
-  padding: 32px 16px;
+  padding: 16px 16px;
 }
 .pagination-container.hidden {
   display: none;
diff --git a/ZR.Vue/src/components/RightToolbar/index.vue b/ZR.Vue/src/components/RightToolbar/index.vue
index 21376b1..49fb391 100644
--- a/ZR.Vue/src/components/RightToolbar/index.vue
+++ b/ZR.Vue/src/components/RightToolbar/index.vue
@@ -86,4 +86,10 @@ export default {
 .el-dropdown-item {
   padding: 5px;
 }
+
+.top-right-btn {
+  position: relative;
+  float: right;
+}
+
 </style>
diff --git a/ZR.Vue/src/views/system/article/publish.vue b/ZR.Vue/src/views/system/article/publish.vue
index 3c8af18..6f58bd6 100644
--- a/ZR.Vue/src/views/system/article/publish.vue
+++ b/ZR.Vue/src/views/system/article/publish.vue
@@ -31,7 +31,7 @@
         </el-col>
         <el-col :lg="24">
           <el-form-item label="" style="text-align:right;">
-            <el-button type="cyan" size="mini" @click="handlePublish('1')">发布文章</el-button>
+            <el-button size="mini" @click="handlePublish('1')">发布文章</el-button>
             <el-button type="success" size="mini" @click="handlePublish('2')">存为草稿</el-button>
           </el-form-item>
         </el-col>
diff --git a/ZR.Vue/src/views/system/role/index.vue b/ZR.Vue/src/views/system/role/index.vue
index aefbb47..c6c1f79 100644
--- a/ZR.Vue/src/views/system/role/index.vue
+++ b/ZR.Vue/src/views/system/role/index.vue
@@ -436,7 +436,7 @@ export default {
         this.form.deptCheckStrictly = !!value
       }
     },
-		//菜单筛选
+    // 菜单筛选
     menuFilterNode(value, data) {
       if (!value) return true
       return data.label.indexOf(value) !== -1
@@ -589,3 +589,12 @@ export default {
   }
 }
 </script>
+<style scoped>
+/* tree border */
+.tree-border {
+  margin-top: 5px;
+  border: 1px solid #e5e6e7;
+  background: #ffffff none;
+  border-radius: 4px;
+}
+</style>
\ No newline at end of file
diff --git a/ZR.Vue/src/views/system/user/profile/index.vue b/ZR.Vue/src/views/system/user/profile/index.vue
index 5e88fed..477fd87 100644
--- a/ZR.Vue/src/views/system/user/profile/index.vue
+++ b/ZR.Vue/src/views/system/user/profile/index.vue
@@ -64,39 +64,65 @@
 </template>
 
 <script>
-import userAvatar from "./userAvatar";
-import userInfo from "./userInfo";
-import resetPwd from "./resetPwd";
-import operLog from "./operLog.vue";
-import { getUserProfile } from "@/api/system/user";
+import userAvatar from './userAvatar'
+import userInfo from './userInfo'
+import resetPwd from './resetPwd'
+import operLog from './operLog.vue'
+import { getUserProfile } from '@/api/system/user'
 
 export default {
-  name: "Profile",
+  name: 'Profile',
   components: { userAvatar, userInfo, resetPwd, operLog },
   data() {
     return {
       user: {},
       roles: [],
-      postGroup: "",
-      activeTab: "userinfo",
-      activeName: "first",
-    };
+      postGroup: '',
+      activeTab: 'userinfo',
+      activeName: 'first'
+    }
   },
   created() {
-    this.getUser();
+    this.getUser()
   },
   methods: {
     getUser() {
       getUserProfile().then((response) => {
-        this.user = response.data.user;
-        this.roles = response.data.roles;
-        this.roleGroup = response.data.roleGroup;
-        this.postGroup = response.data.postGroup;
-      });
+        this.user = response.data.user
+        this.roles = response.data.roles
+        this.roleGroup = response.data.roleGroup
+        this.postGroup = response.data.postGroup
+      })
     },
     handleTabClick(tab, event) {
-      console.log(tab, event);
-    },
-  },
-};
+      console.log(tab, event)
+    }
+  }
+}
 </script>
+<style scoped>
+.list-group-striped > .list-group-item {
+  border-left: 0;
+  border-right: 0;
+  border-radius: 0;
+  padding-left: 0;
+  padding-right: 0;
+}
+
+.list-group {
+  padding-left: 0px;
+  list-style: none;
+}
+
+.list-group-item {
+  border-bottom: 1px solid #e7eaec;
+  border-top: 1px solid #e7eaec;
+  margin-bottom: -1px;
+  padding: 11px 0px;
+  font-size: 13px;
+}
+
+.pull-right {
+  float: right !important;
+}
+</style>
\ No newline at end of file
diff --git a/ZR.Vue/src/views/system/user/profile/userAvatar.vue b/ZR.Vue/src/views/system/user/profile/userAvatar.vue
index 9c30a63..1340685 100644
--- a/ZR.Vue/src/views/system/user/profile/userAvatar.vue
+++ b/ZR.Vue/src/views/system/user/profile/userAvatar.vue
@@ -154,4 +154,22 @@ export default {
   line-height: 110px;
   border-radius: 50%;
 }
+
+.img-lg {
+  width: 120px;
+  height: 120px;
+}
+
+// 导航栏头像
+.avatar-upload-preview {
+  position: absolute;
+  top: 50%;
+  transform: translate(50%, -50%);
+  width: 180px;
+  height: 180px;
+  border-radius: 50%;
+  box-shadow: 0 0 4px #ccc;
+  overflow: hidden;
+}
+
 </style>