Signed-off-by: yinxr 完成样式修改

src/main/webapp/WEB-INF/manager/mweixin/menu.ftl

@@ -16,9 +16,9 @@
          <el-menu class="ms-admin-menu-menu" default-active="0-0">
             <template v-for="(menu,i) in menuList">
                <!--单个选项-->
-               <el-menu-item :index="i" @click="menuActive = menu.title" v-if="!menu.sub" v-text="menu.title"></el-menu-item>
+               <el-menu-item :index="i" @click="menuActive = menu.title" v-if="!menu.sub" v-text="menu.title" class="ms-admin-menu-menu-item"></el-menu-item>
                <!--多个选项-->
-               <el-submenu :index="i+''" v-if="menu.sub">
+               <el-submenu :index="i+''" v-if="menu.sub" class="ms-admin-submenu">
                   <template slot="title">
                      <span v-text="menu.title"></span>
                   </template>

src/main/webapp/WEB-INF/manager/mweixin/menu/index.ftl

@@ -41,11 +41,11 @@
 					</div>
 					<el-form ref="customMenuForm" :rule="customMenuFormRules" :model="customMenuForm" label-width="80px">
 						<el-form-item label="菜单名称" prop="name" class="ms-custom-menu-name">
-							<el-input v-model="customMenuForm.name" size="mini"></el-input>
+							<el-input v-model="customMenuForm.name" size="medium"></el-input>
 							<span>菜单名称字数不多于5个汉字或10个字母</span>
 						</el-form-item>
 						<el-form-item label="菜单内容" class="ms-custom-menu-content">
-							<el-input v-model="customMenuForm.link" size="mini"></el-input>
+							<el-input v-model="customMenuForm.link" size="medium"></el-input>
 							<span>请输入菜单地址</span>
 							<!-- <el-tabs v-model="activeName" @tab-click="">
 								<el-tab-pane label="图片" name="picture">

src/main/webapp/WEB-INF/manager/mweixin/metarial/form.ftl

@@ -5,6 +5,8 @@
       <!--右侧头部-->
       <el-header class="ms-header" height="50px">
          <el-row>
+            <!-- 添加隐藏按钮，主要是为了产生间距 -->
+            <el-button size="small" type="text"></el-button>
             <el-button class="ms-fr" size="small" icon="el-icon-arrow-left" @click="menuVue.menuActive = '关键词回复'">返回</el-button>
             <el-button class="ms-fr" size="small" icon="el-icon-refresh">更新</el-button>
             <el-button class="ms-fr" type="success" size="small" icon="el-icon-tickets" @click="newsSave">保存</el-button>
@@ -14,7 +16,7 @@
          <el-aside width="280px">
              <!-- 主图文章 -->
             <div class="ms-main-article">
-               <img :src="mainArticle.basicPic ||　ms.base+'/WEB-INF/manager/images/data/article-default.png'">
+               <img :src="mainArticle.basicPic ||　ms.base+'/WEB-INF/manager/images/article-default.png'">
                <div class="ms-article-mask"></div>
                <span v-text='mainArticle.basicTitle'></span>
             </div>
@@ -23,7 +25,7 @@
                   <p>
                      <span v-text='element.basicTitle'></span>
                   </p>
-                  <img :src='element.basicThumbnails'>
+                  <img :src="element.basicThumbnails ||　ms.base+'/WEB-INF/manager/images/article-default-thumb.jpg'">
                   <div class="ms-article-item-mask"><i class="el-icon-delete" @click='subArticleList.splice(index,1)'></i></div>
                </div>
             </draggable>
@@ -55,12 +57,12 @@
                </el-upload>
                <el-form label-width='40px'>
                   <el-form-item label="标题" prop="">
-                     <el-input size='small' placeholder="请输入图文标题" v-model='articleForm.basicTitle' @input="resetWordNum('basicTitle',64)">
+                     <el-input size='small' placeholder="请输入图文标题" v-model='articleForm.basicTitle' class='basic-title-input' @input.stop.self="resetWordNum('basicTitle',64)">
                         <span slot='suffix' v-text="titleWordNumber+'/64'"></span>
                      </el-input>
                   </el-form-item>
                   <el-form-item label="作者" prop="">
-                     <el-input size='small' placeholder="请输入图文作者" v-model='articleForm.articleAuthor' @input="resetWordNum('articleAuthor',8)">
+                     <el-input size='small' placeholder="请输入图文作者" v-model='articleForm.articleAuthor' @input.stop.self="resetWordNum('articleAuthor',8)">
                         <span slot='suffix' v-text="authorWordNumber+'/8'"></span>
                      </el-input>
                   </el-form-item>
@@ -162,11 +164,14 @@
          },
          // 计算剩余字数
          resetWordNum: function(type,limit) {
+             var target = event.target
              type.indexOf('Title') > -1 ? this.titleWordNumber = limit - event.target.value.length : this.authorWordNumber = limit - event.target.value.length
              if(event.target.value.length >= limit){
                  this.$message.error('超出字数限制，请输入不超过'+limit+'字符');
                  this.$nextTick(function(){
-                     this.articleForm[type] = event.target.value.slice(0,limit);
+                    //  这里的event的type是message
+                     this.articleForm[type] = target.value.slice(0,limit-1);
+                     console.log('this.articleForm[type]',this.articleForm[type]);
                  })
              }
          },

src/main/webapp/WEB-INF/manager/mweixin/metarial/index.ftl

@@ -12,7 +12,7 @@
 		</el-header>
 		<el-container>
 			<!--内容头部-->
-			<el-header class="ms-tr ms-header">
+			<el-header class="ms-tr ms-header ms-header-select">
 				<el-select v-model="value1" placeholder="请选择" size="small">
 					<el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value">
 					</el-option>

src/main/webapp/WEB-INF/manager/mweixin/picture/index.ftl

@@ -1,100 +1,100 @@
-<!--图文素材页-->
+<!--图片素材页-->
 <link rel="stylesheet" href="../../../static/mweixin/css/picture-list.css">
 <div id="picture-list-vue" v-if="menuVue.menuActive == '图片'" class="ms-weixin-content">
-   <el-container class="ms-admin-picture">
-      <!--右侧头部-->
-      <el-header class="ms-header" height="50px">
-         <el-row>
-            <el-button type="primary" size="small" icon="el-icon-plus">添加</el-button>
-            <el-button class="ms-fr" size="small" icon="el-icon-refresh">刷新</el-button>
-            <el-button class="ms-fr" size="small">同步微信素材</el-button>
-         </el-row>
-      </el-header>
-      <el-container>
-         <!--内容头部-->
-         <el-header class="ms-tr ms-header">
-            <el-select v-model="value1" placeholder="请选择" size="small">
-               <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value">
-               </el-option>
-            </el-select>
-            <el-select v-model="value2" placeholder="请选择" size="small">
-               <el-option v-for="item in options2" :key="item.value" :label="item.label" :value="item.value">
-               </el-option>
-            </el-select>
-            <el-button type="primary" icon="el-icon-search" size="small">查询</el-button>
-         </el-header>
-         <!--素材列表-->
-         <el-main class="ms-admin-picture-list">
-            <el-container>
-               <el-aside class="ms-admin-picture-item">
-                  <div v-for="picture in pictureList">
-                     <div class="body">
-                        <img :src="picture.img" />
-                        <div>
-                           <input type="checkbox" />
-                           <span v-text="picture.title"></span>
-                        </div>
-                     </div>
-                     <div class="footer">
-                        <i class="el-icon-edit"></i>
-                        <em></em>
-                        <i class="el-icon-download"></i>
-                        <em></em>
-                        <i class="el-icon-delete"></i>
-                     </div>
-                  </div>
-               </el-aside>
-               <el-main class="ms-admin-picture-show">
-                  <span>全部图片（6）</span>
-                  <div>
-                     <span>小米（1）</span>
-                     <i class="el-icon-edit"></i>
-                     <i class="el-icon-delete"></i>
-                  </div>
-                  <div>
-                     <span>小米（1）</span>
-                     <i class="el-icon-edit"></i>
-                     <i class="el-icon-delete"></i>
-                  </div>
-                  <p>
-                     <i class="el-icon-plus"></i>新建分组</p>
-               </el-main>
-            </el-container>
+	<el-container class="ms-admin-picture">
+		<!--右侧头部-->
+		<el-header class="ms-header" height="50px">
+			<el-row>
+				<el-button type="primary" size="small" icon="el-icon-plus">添加</el-button>
+				<el-button size="small" icon="el-icon-refresh" class="ms-fr">刷新</el-button>
+				<el-button size="small" class="ms-fr">同步微信素材</el-button>
+			</el-row>
+		</el-header>
+		<el-container>
+			<!--内容头部-->
+			<el-header class="ms-tr ms-header ms-header-select">
+				<el-select v-model="value1" placeholder="请选择" size="small">
+					<el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value">
+					</el-option>
+				</el-select>
+				<el-select v-model="value2" placeholder="请选择" size="small">
+					<el-option v-for="item in options2" :key="item.value" :label="item.label" :value="item.value">
+					</el-option>
+				</el-select>
+				<el-button type="primary" icon="el-icon-search" size="small">查询</el-button>
+			</el-header>
+			<!--素材列表-->
+			<el-main class="ms-admin-picture-list">
+				<el-container>
+					<el-aside class="ms-admin-picture-item">
+						<div v-for="picture in pictureList">
+							<div class="body">
+								<img :src="picture.img" />
+								<div>
+									<input type="checkbox" />
+									<span v-text="picture.title"></span>
+								</div>
+							</div>
+							<div class="footer">
+								<i class="el-icon-edit"></i>
+								<em></em>
+								<i class="el-icon-download"></i>
+								<em></em>
+								<i class="el-icon-delete"></i>
+							</div>
+						</div>
+					</el-aside>
+					<el-main class="ms-admin-picture-show">
+						<span>全部图片（6）</span>
+						<div>
+							<span>小米（1）</span>
+							<i class="el-icon-edit"></i>
+							<i class="el-icon-delete"></i>
+						</div>
+						<div>
+							<span>小米（1）</span>
+							<i class="el-icon-edit"></i>
+							<i class="el-icon-delete"></i>
+						</div>
+						<p>
+							<i class="el-icon-plus"></i>新建分组</p>
+					</el-main>
+				</el-container>
 
-         </el-main>
-      </el-container>
-   </el-container>
+			</el-main>
+		</el-container>
+	</el-container>
 </div>
 
 <script>
-   new Vue({
-      el: "#picture-list-vue",
-      data: {
-         options1: [{
-            value: '全部图片',
-            label: '全部图片'
-         }],
-         options2: [{
-            value: '全部图片',
-            label: '全部图片'
-         }],
-         value1: '全部图片',
-         value2: '',
-         pictureList: [{
-               date: '12月27日',
-               title: 'HUAWEI Mate 20 6GB+64GB 全网最低价...',
-               img: '../images/data/ms-bg_1.jpg',
-               det: '传播名HUAWEI Mate 20 6GB+64GB 全网最低价，后置摄像头后置莱卡散射，12000万亿像素（光脚，1/1.6光圈）+1200万像素（超广角），......'
-            },
-            {
-               date: '12月27日',
-               title: 'HUAWEI Mate 20 6GB+64GB 全网最低价...',
-               img: '../images/data/ms-bg_1.jpg',
-               det: '传播名HUAWEI Mate 20 6GB+64GB 全网最低价，后置摄像头后置莱卡散射，12000万亿像素（光脚，1/1.6光圈）+1200万像素（超广角），......'
-            }
-         ],
-      },
-      methods: {},
-      mounted: function() {}
-   })
+	new Vue({
+		el: "#picture-list-vue",
+		data: {
+			options1: [{
+				value: '全部图片',
+				label: '全部图片'
+			}],
+			options2: [{
+				value: '全部图片',
+				label: '全部图片'
+			}],
+			value1: '全部图片',
+			value2: '',
+			pictureList: [{
+					date: '12月27日',
+					title: 'HUAWEI Mate 20 6GB+64GB 全网最低价...',
+					img: '../images/data/ms-bg_1.jpg',
+					det: '传播名HUAWEI Mate 20 6GB+64GB 全网最低价，后置摄像头后置莱卡散射，12000万亿像素（光脚，1/1.6光圈）+1200万像素（超广角），......'
+				},
+				{
+					date: '12月27日',
+					title: 'HUAWEI Mate 20 6GB+64GB 全网最低价...',
+					img: '../images/data/ms-bg_1.jpg',
+					det: '传播名HUAWEI Mate 20 6GB+64GB 全网最低价，后置摄像头后置莱卡散射，12000万亿像素（光脚，1/1.6光圈）+1200万像素（超广角），......'
+				}
+			],
+		},
+		methods: {},
+		mounted: function () {}
+	})
 </script>

src/main/webapp/static/ms-admin/4.7.0/less/app.less

@@ -93,8 +93,9 @@ textarea::-webkit-input-placeholder {
     text-align: right;
 }
 
+// 按钮组之间的间距
 .el-button+.el-button {
-//  margin-left: 0
+    // margin-left: 5px;
 }
 
 .ms-weixin-content{
@@ -127,3 +128,23 @@ textarea::-webkit-input-placeholder {
         border-color: @themeColor;
     }
 }
+
+// 头部下拉选择区域间距
+.ms-header-select{
+    font-size: 0;
+    >.el-select:nth-of-type(2){
+        margin: 0 10px;
+    }
+}
+
+.el-submenu{
+    // margin: 0 12px;
+    // 菜单选中样式
+    .el-menu-item.is-active{
+        border-radius: 4px;
+    }
+}
+// 卡片样式
+.el-card, .el-message{
+    border-radius:0 !important; 
+}

src/main/webapp/static/mweixin/article.less

@@ -32,9 +32,10 @@
                 span {
                     position: absolute;
                     bottom: 0;
-                    padding: 15px;
+                    margin: 15px;
                     color: #fff;
                     .ms-ellipsis-clamp(2);
+                    word-break: break-all;//数字单词的情况
                 }
             } // 子文章
             .ms-article-item {
@@ -112,7 +113,7 @@
                 box-sizing: border-box;
                 border-bottom: 1px solid @borderColor; // 图片上传
                 .ms-pic-upload {
-                    .ms-width-height(140px);
+                    .ms-width-height(140px,100%);
                     border-radius: 4px;
                     border: 1px dashed @borderColor;
                     .ms-flex(center);
@@ -161,18 +162,34 @@
                                 padding-right: 50px !important;
                             }
                         }
+                        // 标题输入框预留边距
+                        .basic-title-input{
+                            >.el-input__inner{
+                                padding-right:54px !important;
+                            }
+                        }
+                    }
+                    .el-form-item:last-child{
+                        padding-top: 4px;
                     }
                 }
             }
             .ms-main-body {
                 height: calc(~'100% - 180px');
                 background: #fff;
+                .edui-editor-toolbarbox{
+                    border: none !important;
+                    box-shadow: none !important;
+                }
                 .edui-default {
-                    border: none;
+                    // 设置edui-default的class样式会导致选择工具栏会出现抖动，是因为这个class类是通用样式
                     .edui-editor {
+                        border: none !important;
                         .edui-editor-toolbarboxouter {
                             background-color: none !important;
                             background-image: none !important;
+                            box-shadow: none !important;
+                            border-bottom: none !important;
                         } // 编辑器样式
                         .edui-editor {
                             border: none !important;
@@ -189,6 +206,9 @@
                         }
                     }
                 }
+                .edui-editor-toolbarboxinner{
+                    background: #fff;
+                }
             }
         }
     }

src/main/webapp/static/mweixin/css/app.css

@@ -0,0 +1,138 @@
+/*
+*这里的值严格按照UI设计图标注值来进行设置
+*/
+/*
+*颜色
+*/
+/*
+*页面的边距
+*/
+/*
+*字体
+*/
+/*
+*头像
+*/
+/*
+ * 按钮
+ */
+/*
+*对常见的多行样式进行了方法封装，方便调用，加快开发效率
+*/
+html,
+body {
+  min-height: 100vh;
+  width: 100vw;
+  background-color: #eee;
+  margin: 0;
+  display: flex;
+  font-weight: initial !important;
+  font-size: 14px !important;
+  color: #333 !important;
+}
+html *,
+body * {
+  text-decoration: none !important;
+  font-family: Verdana, Arial, Helvetica, sans-serif;
+  box-sizing: border-box;
+}
+.ms-ellipsis {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  display: block;
+}
+.ms-align-center {
+  display: flex;
+  align-items: center;
+}
+input::-webkit-input-placeholder,
+textarea::-webkit-input-placeholder {
+  font-weight: initial;
+  font-size: 12px;
+  color: #999;
+  resize: none;
+}
+*::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+/*定义滚动条轨道 内阴影+圆角*/
+*::-webkit-scrollbar-track {
+  border-radius: 10px;
+  /*滚动条的背景区域的圆角*/
+  background-color: #eee;
+  /*滚动条的背景颜色*/
+}
+/*定义滑块 内阴影+圆角*/
+*::-webkit-scrollbar-thumb {
+  border-radius: 10px;
+  /*滚动条的圆角*/
+  background-color: #e6e6e6;
+  /*滚动条的背景颜色*/
+}
+.ms-container {
+  margin: 12px;
+  height: calc(100% - 24px);
+  padding: 14px;
+  background: #fff;
+}
+.ms-header {
+  padding: 10px;
+  margin: 0;
+  border-bottom: 1px solid #ddd;
+  background: #fff;
+  height: 50px;
+}
+.ms-header button {
+  height: 30px;
+}
+.ms-pagination {
+  padding: 20px 0;
+  text-align: right;
+}
+.ms-fr {
+  float: right;
+}
+.ms-tr {
+  text-align: right;
+}
+.ms-weixin-content {
+  width: calc(100% - 140px);
+}
+.ms-weixin-dialog .el-dialog__header {
+  height: 55px;
+  box-sizing: border-box;
+  padding: 10px 10px 25px 10px;
+  border-bottom: 1px solid #e6e6e6;
+}
+.ms-weixin-dialog .el-dialog__header .el-dialog__title {
+  font-weight: bold;
+  font-size: 14px;
+  color: #333;
+}
+.ms-weixin-dialog .el-dialog__footer {
+  border-top: 1px solid #e6e6e6;
+  padding: 15px !important;
+}
+.ms-hover {
+  cursor: pointer;
+}
+.ms-hover:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.ms-header-select {
+  font-size: 0;
+}
+.ms-header-select > .el-select:nth-of-type(2) {
+  margin: 0 10px;
+}
+.el-submenu .el-menu-item.is-active {
+  border-radius: 4px;
+}
+.el-card,
+.el-message {
+  border-radius: 0 !important;
+}

src/main/webapp/static/mweixin/css/article.css

@@ -123,6 +123,12 @@ textarea::-webkit-input-placeholder {
   background: #fff;
   border-color: #0099ff;
 }
+.ms-header-select {
+  font-size: 0;
+}
+.ms-header-select > .el-select:nth-of-type(2) {
+  margin: 0 10px;
+}
 .ms-article {
   display: flex;
   justify-content: space-between;
@@ -158,13 +164,14 @@ textarea::-webkit-input-placeholder {
 .ms-article .el-container .el-aside .ms-main-article span {
   position: absolute;
   bottom: 0;
-  padding: 15px;
+  margin: 15px;
   color: #fff;
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
+  word-break: break-all;
 }
 .ms-article .el-container .el-aside .ms-article-item {
   width: 100%;
@@ -254,7 +261,7 @@ textarea::-webkit-input-placeholder {
 }
 .ms-article .el-container .el-main .ms-main-header .ms-pic-upload {
   width: 140px;
-  height: 140px;
+  height: 100%;
   border-radius: 4px;
   border: 1px dashed #e6e6e6;
   display: flex;
@@ -315,16 +322,28 @@ textarea::-webkit-input-placeholder {
 .ms-article .el-container .el-main .ms-main-header .el-form .el-form-item .el-input__suffix > input {
   padding-right: 50px !important;
 }
+.ms-article .el-container .el-main .ms-main-header .el-form .el-form-item .basic-title-input > .el-input__inner {
+  padding-right: 54px !important;
+}
+.ms-article .el-container .el-main .ms-main-header .el-form .el-form-item:last-child {
+  padding-top: 4px;
+}
 .ms-article .el-container .el-main .ms-main-body {
   height: calc(100% - 180px);
   background: #fff;
 }
-.ms-article .el-container .el-main .ms-main-body .edui-default {
-  border: none;
+.ms-article .el-container .el-main .ms-main-body .edui-editor-toolbarbox {
+  border: none !important;
+  box-shadow: none !important;
+}
+.ms-article .el-container .el-main .ms-main-body .edui-default .edui-editor {
+  border: none !important;
 }
 .ms-article .el-container .el-main .ms-main-body .edui-default .edui-editor .edui-editor-toolbarboxouter {
   background-color: none !important;
   background-image: none !important;
+  box-shadow: none !important;
+  border-bottom: none !important;
 }
 .ms-article .el-container .el-main .ms-main-body .edui-default .edui-editor .edui-editor {
   border: none !important;
@@ -339,3 +358,6 @@ textarea::-webkit-input-placeholder {
   border-radius: 0 !important;
   box-shadow: none !important;
 }
+.ms-article .el-container .el-main .ms-main-body .edui-editor-toolbarboxinner {
+  background: #fff;
+}

src/main/webapp/static/mweixin/css/custom-menu.css

@@ -123,6 +123,18 @@ textarea::-webkit-input-placeholder {
   background: #fff;
   border-color: #0099ff;
 }
+.ms-header-select {
+  font-size: 0;
+}
+.ms-header-select > .el-select:nth-of-type(2) {
+  margin: 0 10px;
+}
+.el-submenu {
+  margin: 0 12px;
+}
+.el-submenu .el-menu-item.is-active {
+  border-radius: 4px;
+}
 .ms-custom-menu {
   color: #f2f2f6;
 }
@@ -139,6 +151,9 @@ textarea::-webkit-input-placeholder {
   width: 280px !important;
   height: 470px !important;
 }
+.ms-custom-menu .ms-custom-container .el-aside .el-container {
+  overflow: hidden;
+}
 .ms-custom-menu .ms-custom-container .el-aside .el-container .el-header {
   height: 40px !important;
   line-height: 40px !important;
@@ -151,7 +166,7 @@ textarea::-webkit-input-placeholder {
 .ms-custom-menu .ms-custom-container .el-aside .el-container .el-main {
   padding: 0;
   width: 280px !important;
-  height: 379px !important;
+  height: 380px !important;
 }
 .ms-custom-menu .ms-custom-container .el-aside .el-container .el-footer {
   white-space: nowrap;

src/main/webapp/static/mweixin/css/material-bank-form.css

@@ -50,7 +50,7 @@ input::-webkit-input-placeholder,
 textarea::-webkit-input-placeholder {
   font-weight: initial;
   font-size: 12px;
-  color: #aaa;
+  color: #999;
   resize: none;
 }
 *::-webkit-scrollbar {
@@ -68,7 +68,7 @@ textarea::-webkit-input-placeholder {
 *::-webkit-scrollbar-thumb {
   border-radius: 10px;
   /*滚动条的圆角*/
-  background-color: #ddd;
+  background-color: #e6e6e6;
   /*滚动条的背景颜色*/
 }
 .ms-container {
@@ -104,7 +104,7 @@ textarea::-webkit-input-placeholder {
   height: 55px;
   box-sizing: border-box;
   padding: 10px 10px 25px 10px;
-  border-bottom: 1px solid #ddd;
+  border-bottom: 1px solid #e6e6e6;
 }
 .ms-weixin-dialog .el-dialog__header .el-dialog__title {
   font-weight: bold;
@@ -112,7 +112,7 @@ textarea::-webkit-input-placeholder {
   color: #333;
 }
 .ms-weixin-dialog .el-dialog__footer {
-  border-top: 1px solid #ddd;
+  border-top: 1px solid #e6e6e6;
   padding: 15px !important;
 }
 .ms-hover {
@@ -123,6 +123,19 @@ textarea::-webkit-input-placeholder {
   background: #fff;
   border-color: #0099ff;
 }
+.ms-header-select {
+  font-size: 0;
+}
+.ms-header-select > .el-select:nth-of-type(2) {
+  margin: 0 10px;
+}
+.el-submenu .el-menu-item.is-active {
+  border-radius: 4px;
+}
+.el-card,
+.el-message {
+  border-radius: 0 !important;
+}
 .material-bank-form > .el-dialog__wrapper > .el-dialog {
   width: 895px !important;
   height: 587px !important;
@@ -143,6 +156,13 @@ textarea::-webkit-input-placeholder {
 .material-bank-form > .el-dialog__wrapper > .el-dialog > .el-dialog__body > .el-tabs .el-tabs__header .el-tabs__nav-scroll {
   padding: 20px 10px;
 }
+.material-bank-form > .el-dialog__wrapper > .el-dialog > .el-dialog__body > .el-tabs .el-tabs__header .el-tabs__nav-scroll .el-tabs__nav .el-tabs__active-bar {
+  background-color: transparent !important;
+}
+.material-bank-form > .el-dialog__wrapper > .el-dialog > .el-dialog__body > .el-tabs .el-tabs__header .el-tabs__nav-scroll .el-tabs__nav .is-active {
+  color: #409EFF !important;
+  background-color: #ecf5ff;
+}
 .material-bank-form > .el-dialog__wrapper > .el-dialog > .el-dialog__body > .el-tabs .el-tabs__header .el-tabs__nav-wrap::after {
   width: 1px !important;
 }
@@ -161,7 +181,6 @@ textarea::-webkit-input-placeholder {
   flex: 1;
 }
 .material-bank-form > .el-dialog__wrapper > .el-dialog > .el-dialog__body > .el-tabs .is-active {
-  background-color: #e9eaf0;
   font-weight: initial;
   font-size: 14px;
   color: #333;

src/main/webapp/static/mweixin/css/material-list.css

@@ -123,6 +123,12 @@ textarea::-webkit-input-placeholder {
   background: #fff;
   border-color: #0099ff;
 }
+.ms-header-select {
+  font-size: 0;
+}
+.ms-header-select > .el-select:nth-of-type(2) {
+  margin: 0 10px;
+}
 .ms-weixin-content .ms-header > .el-select--small:first-child {
   width: 100px !important;
 }

src/main/webapp/static/mweixin/css/menu.css

@@ -50,7 +50,7 @@ input::-webkit-input-placeholder,
 textarea::-webkit-input-placeholder {
   font-weight: initial;
   font-size: 12px;
-  color: #aaa;
+  color: #999;
   resize: none;
 }
 *::-webkit-scrollbar {
@@ -68,7 +68,7 @@ textarea::-webkit-input-placeholder {
 *::-webkit-scrollbar-thumb {
   border-radius: 10px;
   /*滚动条的圆角*/
-  background-color: #ddd;
+  background-color: #e6e6e6;
   /*滚动条的背景颜色*/
 }
 .ms-container {
@@ -104,7 +104,7 @@ textarea::-webkit-input-placeholder {
   height: 55px;
   box-sizing: border-box;
   padding: 10px 10px 25px 10px;
-  border-bottom: 1px solid #ddd;
+  border-bottom: 1px solid #e6e6e6;
 }
 .ms-weixin-dialog .el-dialog__header .el-dialog__title {
   font-weight: bold;
@@ -112,7 +112,7 @@ textarea::-webkit-input-placeholder {
   color: #333;
 }
 .ms-weixin-dialog .el-dialog__footer {
-  border-top: 1px solid #ddd;
+  border-top: 1px solid #e6e6e6;
   padding: 15px !important;
 }
 .ms-hover {
@@ -123,6 +123,19 @@ textarea::-webkit-input-placeholder {
   background: #fff;
   border-color: #0099ff;
 }
+.ms-header-select {
+  font-size: 0;
+}
+.ms-header-select > .el-select:nth-of-type(2) {
+  margin: 0 10px;
+}
+.el-submenu .el-menu-item.is-active {
+  border-radius: 4px;
+}
+.el-card,
+.el-message {
+  border-radius: 0 !important;
+}
 .ms-admin-menu {
   min-height: 100vh;
   min-width: 140px;

src/main/webapp/static/mweixin/css/picture-list.css

@@ -50,7 +50,7 @@ input::-webkit-input-placeholder,
 textarea::-webkit-input-placeholder {
   font-weight: initial;
   font-size: 12px;
-  color: #aaa;
+  color: #999;
   resize: none;
 }
 *::-webkit-scrollbar {
@@ -68,13 +68,13 @@ textarea::-webkit-input-placeholder {
 *::-webkit-scrollbar-thumb {
   border-radius: 10px;
   /*滚动条的圆角*/
-  background-color: #ddd;
+  background-color: #e6e6e6;
   /*滚动条的背景颜色*/
 }
 .ms-container {
   margin: 12px;
   height: calc(100% - 24px);
-  padding: 14px 14px 0 14px;
+  padding: 14px;
   background: #fff;
 }
 .ms-header {
@@ -104,7 +104,7 @@ textarea::-webkit-input-placeholder {
   height: 55px;
   box-sizing: border-box;
   padding: 10px 10px 25px 10px;
-  border-bottom: 1px solid #ddd;
+  border-bottom: 1px solid #e6e6e6;
 }
 .ms-weixin-dialog .el-dialog__header .el-dialog__title {
   font-weight: bold;
@@ -112,7 +112,7 @@ textarea::-webkit-input-placeholder {
   color: #333;
 }
 .ms-weixin-dialog .el-dialog__footer {
-  border-top: 1px solid #ddd;
+  border-top: 1px solid #e6e6e6;
   padding: 15px !important;
 }
 .ms-hover {
@@ -123,6 +123,12 @@ textarea::-webkit-input-placeholder {
   background: #fff;
   border-color: #0099ff;
 }
+.ms-header-select {
+  font-size: 0;
+}
+.ms-header-select > .el-select:nth-of-type(2) {
+  margin: 0 10px;
+}
 .ms-admin-picture {
   height: 100%;
 }
@@ -179,7 +185,7 @@ textarea::-webkit-input-placeholder {
   padding: 14px 0;
 }
 .ms-admin-picture-list .ms-admin-picture-item > div .footer i {
-  color: #999;
+  color: #333;
   margin: auto;
   cursor: pointer;
 }

src/main/webapp/static/mweixin/custom-menu.less

@@ -14,6 +14,7 @@
             .ms-width-height(280px, 470px) !important;
             // 微信界面
             .el-container {
+                overflow: hidden;
                 // 头部
                 .el-header {
                     .ms-line-height(40px) !important;
@@ -23,7 +24,7 @@
                 }
                 .el-main {
                     padding: 0;
-                    .ms-width-height(280px, 379px) !important;
+                    .ms-width-height(280px, 380px) !important;
                 }
                 .el-footer {
                     white-space: nowrap;

src/main/webapp/static/mweixin/material-bank-form.less

@@ -16,6 +16,16 @@
                         margin: 0 !important;
                         .el-tabs__nav-scroll{
                             padding:20px 10px;
+                            .el-tabs__nav{
+                                // 取消 激活状态边框
+                                .el-tabs__active-bar{
+                                    background-color:transparent !important;
+                                }
+                                .is-active{
+                                    color: #409EFF !important;
+                                    background-color: #ecf5ff;
+                                }
+                            }
                         }
                         .el-tabs__nav-wrap::after{
                             width: 1px !important;
@@ -38,7 +48,6 @@
                     }
                     // tab选中的样式
                     .is-active{
-                       background-color:rgb(233, 234, 240);
                        .ms-font(@defalutSize,@defalutColor);
                     }
                 }

src/main/webapp/static/mweixin/menu.less

@@ -31,6 +31,19 @@
                 min-width: 140px;
                 width: 140px;
             }
+            // .ms-admin-submenu{
+            //     .el-submenu__title{
+            //         height: 40px !important;
+            //         .ms-flex();
+            //         align-items: center;
+            //     }
+            // }
+            // // 菜单列表
+            // .ms-admin-menu-menu-item{
+            //     height: 40px;
+            //     .ms-flex();
+            //     align-items: center;
+            // }
         }
         .ms-admin-material-item {
             min-width: 100% !important;