浏览代码

Merge branch '4.7.0' of https://gitee.com/mingSoft/MCMS.git into 4.7.0

# Conflicts:
#	src/main/webapp/WEB-INF/manager/login.ftl
#	src/main/webapp/WEB-INF/manager/mweixin/keyword/form.ftl
#	src/main/webapp/WEB-INF/manager/mweixin/keyword/index.ftl
#	src/main/webapp/WEB-INF/manager/mweixin/menu.ftl
#	src/main/webapp/WEB-INF/manager/mweixin/menu/index.ftl
#	src/main/webapp/WEB-INF/manager/mweixin/message/index.ftl
#	src/main/webapp/WEB-INF/manager/mweixin/metarial/index.ftl
#	src/main/webapp/WEB-INF/manager/mweixin/picture/index.ftl
#	src/main/webapp/WEB-INF/manager/mweixin/weixin.ftl
#	src/main/webapp/static/ms-admin/4.7.0/css/login.css
#	src/main/webapp/static/ms-admin/4.7.0/less/app.less
#	src/main/webapp/static/ms-admin/4.7.0/less/login.less
#	src/main/webapp/static/mweixin/article.less
#	src/main/webapp/static/mweixin/css/article.css
#	src/main/webapp/static/mweixin/css/custom-menu.css
#	src/main/webapp/static/mweixin/css/keyword-list.css
#	src/main/webapp/static/mweixin/css/keyword-reply.css
#	src/main/webapp/static/mweixin/css/material-bank-form.css
#	src/main/webapp/static/mweixin/css/material-list.css
#	src/main/webapp/static/mweixin/css/menu.css
#	src/main/webapp/static/mweixin/css/message-reply.css
#	src/main/webapp/static/mweixin/css/new-pic-form.css
#	src/main/webapp/static/mweixin/css/picture-list.css
#	src/main/webapp/static/mweixin/custom-menu.less
#	src/main/webapp/static/mweixin/keyword-list.less
#	src/main/webapp/static/mweixin/keyword-reply.less
#	src/main/webapp/static/mweixin/material-bank-form.less
#	src/main/webapp/static/mweixin/material-list.less
#	src/main/webapp/static/mweixin/menu.less
#	src/main/webapp/static/mweixin/message-reply.less
#	src/main/webapp/static/mweixin/new-pic-form.less
#	src/main/webapp/static/mweixin/picture-list.less

Signed-off-by: yinxr <2273460044@qq.com>
yinxr 6 年之前
父节点
当前提交
c6abaf88a0
共有 34 个文件被更改,包括 4247 次插入0 次删除
  1. 132 0
      src/main/webapp/WEB-INF/manager/login.ftl
  2. 89 0
      src/main/webapp/WEB-INF/manager/mweixin/keyword/form.ftl
  3. 67 0
      src/main/webapp/WEB-INF/manager/mweixin/keyword/index.ftl
  4. 59 0
      src/main/webapp/WEB-INF/manager/mweixin/menu.ftl
  5. 94 0
      src/main/webapp/WEB-INF/manager/mweixin/menu/index.ftl
  6. 70 0
      src/main/webapp/WEB-INF/manager/mweixin/message/index.ftl
  7. 155 0
      src/main/webapp/WEB-INF/manager/mweixin/metarial/form.ftl
  8. 80 0
      src/main/webapp/WEB-INF/manager/mweixin/metarial/index.ftl
  9. 100 0
      src/main/webapp/WEB-INF/manager/mweixin/picture/index.ftl
  10. 21 0
      src/main/webapp/WEB-INF/manager/mweixin/weixin.ftl
  11. 210 0
      src/main/webapp/static/ms-admin/4.7.0/css/login.css
  12. 129 0
      src/main/webapp/static/ms-admin/4.7.0/less/app.less
  13. 221 0
      src/main/webapp/static/ms-admin/4.7.0/less/css/login.css
  14. 88 0
      src/main/webapp/static/ms-admin/4.7.0/less/login.less
  15. 148 0
      src/main/webapp/static/mweixin/article.less
  16. 291 0
      src/main/webapp/static/mweixin/css/article.css
  17. 278 0
      src/main/webapp/static/mweixin/css/custom-menu.css
  18. 125 0
      src/main/webapp/static/mweixin/css/keyword-list.css
  19. 203 0
      src/main/webapp/static/mweixin/css/keyword-reply.css
  20. 168 0
      src/main/webapp/static/mweixin/css/material-bank-form.css
  21. 199 0
      src/main/webapp/static/mweixin/css/material-list.css
  22. 165 0
      src/main/webapp/static/mweixin/css/menu.css
  23. 215 0
      src/main/webapp/static/mweixin/css/message-reply.css
  24. 139 0
      src/main/webapp/static/mweixin/css/new-pic-form.css
  25. 240 0
      src/main/webapp/static/mweixin/css/picture-list.css
  26. 151 0
      src/main/webapp/static/mweixin/custom-menu.less
  27. 1 0
      src/main/webapp/static/mweixin/keyword-list.less
  28. 80 0
      src/main/webapp/static/mweixin/keyword-reply.less
  29. 48 0
      src/main/webapp/static/mweixin/material-bank-form.less
  30. 55 0
      src/main/webapp/static/mweixin/material-list.less
  31. 39 0
      src/main/webapp/static/mweixin/menu.less
  32. 82 0
      src/main/webapp/static/mweixin/message-reply.less
  33. 15 0
      src/main/webapp/static/mweixin/new-pic-form.less
  34. 90 0
      src/main/webapp/static/mweixin/picture-list.less

+ 132 - 0
src/main/webapp/WEB-INF/manager/login.ftl

@@ -0,0 +1,132 @@
+<!DOCTYPE html>
+<html lang="">
+
+   <head>
+      <title></title>
+      <!-- <#include "/include/head-file.ftl"/> -->
+      <!-- <link rel="stylesheet" href="${base}/static/ms-admin/4.7.0/css/login.css"> -->
+
+      <!--#include virtual="include/head-file.ftl" -->
+      <link rel="stylesheet" href="../../../static/ms-admin/4.7.0/css/login.css">
+   </head>
+
+   <body>
+      <div id="login" class="login">
+         <el-container class="ms-admin-login-container">
+            <el-main class="ms-admin-login-main">
+               <div class="ms-admin-login-warp">
+                  <img :src="ms.base+'/static/ms-admin/4.7.0/images/login-slogn.png'">
+                  <el-form :model="loginForm" status-icon :rules="loginFormRule" ref="loginForm" label-width="100px" class="ms-admin-login-form">
+                     <h1>
+                        <span>账户登录 / </span>User login</h1>
+                     <el-form-item prop="name" class="ms-admin-form-item">
+                        <el-input type="text" placeholder='用户名' v-model="loginForm.managerName" autocomplete="off"></el-input>
+                     </el-form-item>
+                     <el-form-item prop="pass" class="ms-admin-form-item">
+                        <el-input type="password" placeholder='密码' v-model="loginForm.managerPassword" autocomplete="off"></el-input>
+                     </el-form-item>
+                     <el-form-item prop="code" class="ms-admin-form-item ms-admin-form-item-code">
+                        <el-input type="text" placeholder='验证码' v-model="loginForm.rand_code" autocomplete="off"></el-input>
+                        <img :src="verifCode" class="code-img" @click="code" />
+                        <p>
+                           <span>看不清?</span>
+                           <span @click="code">换一张</span>
+                        </p>
+                     </el-form-item>
+                     <el-form-item class="ms-admin-form-item ms-admin-form-item-checkout">
+                        <el-checkbox v-model="rememberPass">记住密码</el-checkbox>
+                     </el-form-item>
+                     <el-form-item class="ms-admin-form-item">
+                        <el-button type="primary" @click="checkLogin" class="ms-admin-login-btn">登录</el-button>
+                     </el-form-item>
+                  </el-form>
+               </div>
+            </el-main>
+         </el-container>
+      </div>
+   </body>
+
+</html>
+<script>
+   var loginVue = new Vue({
+      el: '#login',
+      data: {
+         loginForm: {
+            managerName: '',
+            managerPassword: "",
+            rand_code: '',
+         },
+         verifCode: ms.manager + "/code?t=" + new Date().getTime(),
+         rememberPass: '',
+         loginFormRule: {
+            managerName: [{
+                  required: true,
+                  message: '请输入用户名',
+                  trigger: 'blur'
+               },
+               {
+                  min: 3,
+                  max: 6,
+                  message: '长度在 3 到 5 个字符',
+                  trigger: 'blur'
+               }
+            ],
+            managerPassword: [{
+                  required: true,
+                  message: '请输入密码',
+                  trigger: 'blur'
+               },
+               {
+                  min: 6,
+                  max: 20,
+                  message: '长度在 6 到 20 个字符',
+                  trigger: 'blur'
+               }
+            ],
+            rand_code: [{
+                  required: true,
+                  message: '请填写验证码',
+                  trigger: 'blur'
+               },
+               {
+                  min: 1,
+                  max: 4,
+                  message: '长度在1 到 4 个字符',
+                  trigger: 'blur'
+               }
+            ],
+         }
+      },
+      methods: {
+         // 登录
+         checkLogin: function() {
+            var that = this;
+            ms.http.post(ms.manager + "/checkLogin.do", that.loginForm).then(function(data) {
+               if(data.result) {
+                  that.$notify({
+                     title: '成功',
+                     message: '登录成功',
+                     type: 'success'
+                  });
+                  location.href = ms.manager + "/index.do";
+               } else {
+                  that.$notify({
+                     title: '失败',
+                     message: data.resultMsg,
+                     type: 'warning'
+                  });
+               }
+            }, (err) => {
+               that.$message.error(data.resultMsg);
+            })
+         },
+         code: function() {
+            this.verifCode = ms.manager + "/code?t=" + new Date().getTime();
+         },
+
+      },
+      mounted: function() {
+         this.verifCode = ms.manager + "/code?t=" + new Date().getTime()
+      }
+   })
+</script>

+ 89 - 0
src/main/webapp/WEB-INF/manager/mweixin/keyword/form.ftl

@@ -0,0 +1,89 @@
+<!-- 关键词回复 -->
+<link rel="stylesheet" href="../../../../static/mweixin/css/keyword-reply.css">
+
+<div id="keyword-reply" class="keyword-reply ms-weixin-content" v-if="menuVue.menuActive == '关键词表单'">
+   <el-container>
+      <el-header class="ms-header" height="50px">
+         <el-row>
+            <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="menuVue.menuActive = '关键词回复'">保存</el-button>
+         </el-row>
+      </el-header>
+      <el-main class="ms-container" width="100%">
+         <el-form :model="keywordReplyForm" status-icon :rules="keywordReplyFormRules" ref="keywordReplyForm" label-width="100px">
+            <el-form-item label="关键词" prop="keyword" class="ms-keyword-input">
+               <el-row type='flex' justify='space-between' align='center'>
+                  <el-col :span='12'>
+                     <el-input placeholder="请输入内容" v-model="keywordReplyForm.keyword" class="input-with-select" size='mini' maxlength='30' @input='resetWord'>
+                        <el-select v-model="keywordReplyForm.select" slot="prepend" placeholder="请选择">
+                           <el-option label="模糊匹配" value="1"></el-option>
+                           <el-option label="全匹配" value="2"></el-option>
+                        </el-select>
+                        <span slot='suffix' v-text="wordNumber+'/30'"></span>
+                     </el-input>
+                  </el-col>
+                  <el-col>
+                     <i class="el-icon-plus" @click='addKeyWord'></i>
+                  </el-col>
+               </el-row>
+            </el-form-item>
+            <el-form-item class="ms-keyword-reply-content" label="回复内容">
+               <el-tabs v-model="activeName" @tab-click="" class="keyword-reply-tabs">
+                  <el-tab-pane label="文字" name="text">
+                     <el-input type="textarea" v-model="keywordReplyForm.reply" :autosize="{ minRows: 4, maxRows: 4}" resize='none'>
+                     </el-input>
+                     <i class="el-icon-delete" @click="keywordReplyForm.reply = ''"></i>
+                     <div class="footer">
+                        <i class="el-icon-star-off"></i>
+                        <a>插入超链接</a>
+                     </div>
+                  </el-tab-pane>
+                  <el-tab-pane label="图片" name="picture">
+                  </el-tab-pane>
+                  <el-tab-pane label="图文" name="article">
+                  </el-tab-pane>
+               </el-tabs>
+            </el-form-item>
+         </el-form>
+      </el-main>
+   </el-container>
+</div>
+
+<script>
+   var keywordReplyVue = new Vue({
+      el: '#keyword-reply',
+      data: {
+         keywordReplyForm: {
+            keyword: "", //关键词
+            select: '',
+            reply: "",
+         },
+         keywordReplyFormRules: {
+
+         },
+         activeName: 'text',
+         wordNumber: 30, //剩余字数
+      },
+      methods: {
+         // 添加关键词
+         addKeyWord: function() {
+
+         },
+         // 计算剩余字数
+         resetWord: function(value) {
+            if(!value) return 30;
+            if(value.length >= 30) {
+               this.$message.error('任务名称不得超过30个字');
+               // 这里涉及到获取数据更新之后的DOM,需要用$nextTick
+               this.$nextTick(function() {
+                  this.keywordReplyForm.keyword = event.target.value = value.slice(0, 30);
+               })
+               this.wordNumber = 0
+            } else {
+               this.wordNumber = 30 - value.length
+            }
+         }
+      }
+   })
+</script>

+ 67 - 0
src/main/webapp/WEB-INF/manager/mweixin/keyword/index.ftl

@@ -0,0 +1,67 @@
+<!-- 关键字列表 -->
+<link rel="stylesheet" href="../../../../static/mweixin/css/keyword-list.css">
+
+<div id="keyword-list" class="keyword-list ms-weixin-content" v-if="menuVue.menuActive == '关键词回复'">
+   <el-container>
+      <!--右侧头部-->
+      <el-header class="ms-header" height="50px">
+         <el-row>
+            <el-button type="primary" size="small" icon="el-icon-plus" @click="menuVue.menuActive = '关键词表单'">添加</el-button>
+            <el-button class="ms-fr" size="small" icon="el-icon-refresh">重置</el-button>
+         </el-row>
+      </el-header>
+      <el-container>
+         <!--内容头部-->
+         <el-header class="ms-tr ms-header">
+            <el-input size="medium" placeholder="请输入内容" suffix-icon="el-icon-search">
+            </el-input>
+         </el-header>
+         <!--素材列表-->
+         <el-main class="ms-admin-picture-list ms-container">
+            <el-table :data="tableData" border style="width: 100%">
+               <el-table-column prop="date" label="规则名" width="180" align='center'>
+               </el-table-column>
+               <el-table-column prop="name" label="关键词" width="180" align='center'>
+               </el-table-column>
+               <el-table-column prop="address" label="消息回复类型" align='center'>
+               </el-table-column>
+               <el-table-column prop="address" label="发送对象" align='center'>
+               </el-table-column>
+               <el-table-column prop="address" label="回复方式" align='center'>
+               </el-table-column>
+            </el-table>
+         </el-main>
+      </el-container>
+   </el-container>
+</div>
+
+<script>
+   var keywordListVue = new Vue({
+      el: '#keyword-list',
+      data: {
+         tableData: [{
+            date: '2016-05-02',
+            name: '王小虎',
+            address: '上海市普陀区金沙江路 1518 弄'
+         }, {
+            date: '2016-05-04',
+            name: '王小虎',
+            address: '上海市普陀区金沙江路 1517 弄'
+         }, {
+            date: '2016-05-01',
+            name: '王小虎',
+            address: '上海市普陀区金沙江路 1519 弄'
+         }, {
+            date: '2016-05-03',
+            name: '王小虎',
+            address: '上海市普陀区金沙江路 1516 弄'
+         }]
+      },
+      methods: {
+         // 获取关键词列表
+         list: function() {
+
+         }
+      }
+   })
+</script>

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

@@ -0,0 +1,59 @@
+<link rel="stylesheet" href="../../../static/mweixin/css/menu.css">
+
+<div id="menu-vue">
+   <!--左侧-->
+   <el-container class="ms-admin-menu">
+      <!--右侧头部-->
+      <el-header class="ms-header" height="50px">
+         <div>
+            <i class="el-icon-arrow-left"></i>
+            <span>
+               吕小布微信号
+            </span>
+         </div>
+      </el-header>
+      <el-main>
+         <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-submenu :index="i+''" v-if="menu.sub">
+                  <template slot="title">
+                     <span v-text="menu.title"></span>
+                  </template>
+                  <el-menu-item class="ms-admin-menu-menu-item" @click="menuActive = sub.title" :index="i+'-'+index" v-for="(sub,index) in menu.sub" v-text="sub.title"></el-menu-item>
+               </el-submenu>
+            </template>
+         </el-menu>
+      </el-main>
+   </el-container>
+</div>
+
+<script>
+   var menuVue = new Vue({
+      el: "#menu-vue",
+      data: {
+         menuList: [{
+            title: '图文素材',
+            sub: [{
+               title: '图文'
+            }, {
+               title: '图片'
+            }],
+         }, {
+            title: '自定义菜单',
+         }, {
+            title: '自动回复',
+            sub: [{
+               title: '关注时回复'
+            }, {
+               title: '消息回复'
+            }, {
+               title: '关键词回复'
+            }]
+         }], //左侧导航列表
+         menuActive: '图文', //选中
+      }
+   })
+</script>

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

@@ -0,0 +1,94 @@
+<!-- 自定义菜单 -->
+<link rel="stylesheet" href="../../../../static/mweixin/css/custom-menu.css">
+<div id="custom-menu" class="ms-custom-menu ms-weixin-content" v-if="menuVue.menuActive == '自定义菜单'">
+   <el-container class="ms-custom-container">
+      <el-header class="ms-header" height="50px">
+         <el-row>
+            <el-button type="danger" size="small" icon="el-icon-delet">删除</el-button>
+            <el-button class="ms-fr" size="small" icon="el-icon-refresh">重置</el-button>
+            <el-button type="success" class="ms-fr" size="small" icon="el-icon-tickets">保存</el-button>
+         </el-row>
+      </el-header>
+      <el-container class="ms-container">
+         <el-aside>
+            <el-container>
+               <el-header>公众号</el-header>
+               <el-main></el-main>
+               <el-footer>
+                  <el-button icon="el-icon-date"></el-button>
+                  <div class="ms-create-menu">
+                     <div class="ms-create-sub-menu">
+                        <el-button type="primary" @click='addSubMenuShow = !addSubMenuShow'>新建菜单</el-button>
+                        <el-button icon="el-icon-plus" v-show='addSubMenuShow'></el-button>
+                     </div>
+                     <el-button icon="el-icon-plus"></el-button>
+                  </div>
+               </el-footer>
+            </el-container>
+         </el-aside>
+         <el-main>
+            <el-card class="custom-menu-card" shadow="never">
+               <div slot="header" class="clearfix">
+                  <span>新建菜单</span>
+               </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>
+                     <span>菜单名称字数不多于5个汉字或10个字母</span>
+                  </el-form-item>
+                  <el-form-item label="菜单内容" class="ms-custom-menu-content">
+                     <el-tabs v-model="activeName" @tab-click="">
+                        <el-tab-pane label="图片" name="picture">
+                           <span slot="label">
+                              <i class="el-icon-picture"></i>图片</span>
+                           <div onclick="materialBankFormVue.open()">
+                              <i class="el-icon-picture-outline"></i>
+                              <span>从素材库选择</span>
+                           </div>
+                           <div onclick="newPicFormVue.open()">
+                              <i class="el-icon-plus"></i>
+                              <span>新建图片</span>
+                           </div>
+                        </el-tab-pane>
+                        <el-tab-pane label="图文管理" name="article">
+                           <span slot="label">
+                              <i class="el-icon-picture"></i>图文管理</span>
+                        </el-tab-pane>
+                     </el-tabs>
+                  </el-form-item>
+               </el-form>
+            </el-card>
+         </el-main>
+      </el-container>
+   </el-container>
+</div>
+<script>
+   var customMenuVue = new Vue({
+      el: "#custom-menu",
+      data: {
+         customMenuForm: {
+            name: '',
+         },
+         customMenuFormRules: {
+            name: [{
+                  required: true,
+                  message: '请输入菜单名称',
+                  trigger: ['blur', 'change']
+               },
+               {
+                  min: 1,
+                  max: 5,
+                  message: '长度在 1 到 5 个字符',
+                  trigger: ['blur', 'change']
+               }
+            ],
+         },
+         addSubMenuShow: false, //子菜单添加弹窗
+         activeName: 'picture'
+      },
+      methods: {
+
+      }
+
+   })
+</script>

+ 70 - 0
src/main/webapp/WEB-INF/manager/mweixin/message/index.ftl

@@ -0,0 +1,70 @@
+<!-- 消息回复 && 关注回复 -->
+<link rel="stylesheet" href="../../../../static/mweixin/css/message-reply.css">
+<div id="message-reply" class="ms-message-reply ms-weixin-content" v-if="menuVue.menuActive == '消息回复'||menuVue.menuActive == '关注时回复'">
+   <el-container class="ms-admin-message-reply">
+      <el-header class="ms-header" height="50px">
+         <el-row>
+            <el-button class="ms-fr" size="small" icon="el-icon-refresh">重置</el-button>
+            <el-button type="success" class="ms-fr" size="small" icon="el-icon-tickets">保存</el-button>
+         </el-row>
+      </el-header>
+      <el-container>
+         <el-header class="ms-tr ms-header">
+            <el-input size="medium" placeholder="请输入内容" suffix-icon="el-icon-search">
+            </el-input>
+         </el-header>
+         <em-main class="ms-container">
+            <div>回复内容</div>
+            <el-tabs v-model="activeName" @tab-click="" class="message-reply-tabs">
+               <el-tab-pane label="文字" name="text">
+                  <el-form ref="messageReplyForm" :rules='messageReplyFormRules' :model="messageReplyForm">
+                     <el-form-item class="ms-message-reply-content">
+                        <el-input type="textarea" v-model="messageReplyForm.reply" :autosize="{ minRows: 4, maxRows: 4}" resize='none'>
+                        </el-input>
+                        <i class="el-icon-delete" @click="messageReplyForm.reply = ''"></i>
+                        <div class="footer">
+                           <i class="el-icon-star-off"></i>
+                           <a>插入超链接</a>
+                        </div>
+                     </el-form-item>
+                  </el-form>
+                  </el-form>
+               </el-tab-pane>
+               <el-tab-pane label="图片" name="picture">
+               </el-tab-pane>
+               <el-tab-pane label="图文" name="article">
+               </el-tab-pane>
+            </el-tabs>
+         </em-main>
+      </el-container>
+   </el-container>
+</div>
+<script>
+   var messageReplyVue = new Vue({
+      el: "#message-reply",
+      data: {
+         messageReplyForm: {
+            reply: '',
+         },
+         messageReplyFormRules: {
+            name: [{
+                  required: true,
+                  message: '请输入菜单名称',
+                  trigger: ['blur', 'change']
+               },
+               {
+                  min: 1,
+                  max: 5,
+                  message: '长度在 1 到 5 个字符',
+                  trigger: ['blur', 'change']
+               }
+            ],
+         },
+         activeName: 'text',
+      },
+      methods: {
+
+      }
+
+   })
+</script>

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

@@ -0,0 +1,155 @@
+<!-- 新建图文 -->
+<link rel="stylesheet" href="../../../../static/mweixin/css/article.css">
+<div id='article' class="ms-article" v-show="menuVue.menuActive == '新建图文'">
+   <el-container class="ms-admin-picture">
+      <!--右侧头部-->
+      <el-header class="ms-header" height="50px">
+         <el-row>
+            <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="menuVue.menuActive = '关键词回复'">保存</el-button>
+         </el-row>
+      </el-header>
+      <el-container class=" ms-container">
+         <el-aside width="280px">
+            <div class="ms-main-article">
+               <img :src='mainArticle.basicPic'>
+               <div class="ms-main-article-mask"></div>
+               <span v-text='mainArticle.basicTitle'></span>
+            </div>
+            <draggable v-model="subArticleList" :options="{draggable:'.ms-article-item'}">
+               <div v-for="(element,index) in subArticleList" :key="index" class="ms-article-item">
+                  <p>
+                     <span v-text='element.basicTitle'></span>
+                  </p>
+                  <img :src='element.basicThumbnailsl'>
+               </div>
+            </draggable>
+            <div class="ms-article-footer">
+               <el-button size='medium' icon='el-icon-plus' @click='addArticle'>添加图文</el-button>
+            </div>
+         </el-aside>
+         <el-main>
+            <div class="ms-main-header">
+               <el-upload class="ms-pic-upload" :show-file-list="false">
+                  <img v-if="false" :src="false" class="avatar">
+                  <i v-else class="el-icon-picture"></i>
+                  <span>添加封面</span>
+               </el-upload>
+               <el-form label-width='40px'>
+                  <el-form-item label="标题" prop="">
+                     <el-input size='small' placeholder="请输入图文标题" v-model='articleForm.basicTitle' @input="resetWordNum('title')">
+                        <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('author')">
+                        <span slot='suffix' v-text="authorWordNumber+'/8'"></span>
+                     </el-input>
+                  </el-form-item>
+                  <el-form-item label="摘要" prop="">
+                     <el-input size='small' type='textarea' placeholder="选填,如果不写会默认抓取正文前54个字" :autosize="{ minRows: 2, maxRows: 2}" resize='none' v-model='articleForm.basicDescription' @input="resetWordNum('desc')">
+                        <span slot='suffix' v-text="descWordNumber+'/54'"></span>
+                     </el-input>
+                  </el-form-item>
+               </el-form>
+            </div>
+            <div class="ms-main-body">
+               <!-- 百度编辑器 -->
+               <script id="ueditorArticle" type="text/plain" name="articleContent"></script>
+            </div>
+         </el-main>
+      </el-container>
+   </el-container>
+</div>
+<script>
+   var articleVue = new Vue({
+      el: '#article',
+      data: {
+         mainArticle: {
+            basicPic: 'https://img03.sogoucdn.com/app/a/100520091/20190125112329', //主图
+            basicTitle: '国足0-3不敌伊朗被淘汰,赛后还有一个消息', //标题
+         },
+         // 文章列表
+         subArticleList: [{
+            basicTitle: '硬核!年会当着老板面唱,“干活的干不过写PPT的……',
+            basicThumbnailsl: 'https://img01.sogoucdn.com/app/a/100520091/20190125112509'
+         }, {
+            basicTitle: '知否知否,党组织犯错,处理有多严?',
+            basicThumbnailsl: 'https://img01.sogoucdn.com/app/a/100520091/20190125112509'
+         }, {
+            basicTitle: '没有奇迹,国足0-3不敌伊朗止步八强!',
+            basicThumbnailsl: 'https://img03.sogoucdn.com/app/a/100520091/20190125113148'
+         }],
+         titleWordNumber: 64, //图文标题剩余字数
+         authorWordNumber: 8, //图文作者剩余字数
+         descWordNumber: 54, //摘要
+         editor: null, //富文本实例
+         articleForm: {
+            basicTitle: '', //标题
+            articleAuthor: '', //作者
+            basicDescription: '', //摘要
+            articleContent: '', //正文
+         }
+      },
+      methods: {
+         // 添加文章
+         addArticle: function() {
+            if(this.subArticleList.length > 6) {
+               this.$notify({
+                  title: '添加失败',
+                  message: '最大图文数量为7',
+                  type: 'warning'
+               });
+               return;
+            }
+            this.subArticleList.push({
+               basicTitle: '新增文章标题',
+               basicThumbnailsl: 'https://img03.sogoucdn.com/app/a/100520091/20190125113148'
+            })
+         },
+         // 计算剩余字数
+         resetWordNum: function(type) {
+
+         }
+      },
+      mounted: function() {
+         let that = this;
+         //富文本加载
+         var URL = window.UEDITOR_HOME_URL || "http://mpm.mingsoft.net/static/plugins/ueditor/1.4.3.1/";
+         if(this.editor == null) {
+            this.editor = UE.getEditor('ueditorArticle', {
+               toolbars: [
+                  ['fullscreen', 'undo', 'redo', '|', 'bold', 'italic', 'underline',
+                     'strikethrough',
+                     'removeformat', 'blockquote',
+                     '|', 'forecolor', 'backcolor', 'insertorderedlist',
+                     'insertunorderedlist', '|', 'attachment', 'simpleupload', 'link'
+                  ]
+               ],
+               imageScaleEnabled: true,
+               // 服务器统一请求接口路径
+               serverUrl: URL +
+                  "jsp/msController.jsp?jsonConfig=%7BvideoUrlPrefix:'http://mpm.mingsoft.net/',fileUrlPrefix:'http://mpm.mingsoft.net/',imageUrlPrefix:'http://mpm.mingsoft.net/',imagePathFormat:'/upload/pm/editor/%7Btime%7D',filePathFormat:'/upload/pm/editor/%7Btime%7D',videoPathFormat:'/upload/pm/editor/%7Btime%7D'%7D",
+               autoHeightEnabled: true,
+               autoFloatEnabled: true,
+               scaleEnabled: false,
+               compressSide: 0,
+               maxImageSideLength: 2000,
+               maximumWords: 80000,
+               zIndex: 10000,
+               elementPathEnabled: false,
+               wordCount: false,
+               initialFrameWidth: '100%',
+               initialFrameHeight: 500,
+            });
+            this.editor.ready(function() {
+               var a = $("#ueditor_0").contents()[0].activeElement;
+               $(a).addClass("ms-webkit-scrollbar").before(
+                  "<style>.ms-webkit-scrollbar::-webkit-scrollbar,::-webkit-scrollbar{width:10px;/*滚动条宽度*/height:1.5%;/*滚动条高度*/}/*定义滚动条轨道内阴影+圆角*/.ms-webkit-scrollbar::-webkit-scrollbar-track,::-webkit-scrollbar-track{border-radius:10px;/*滚动条的背景区域的圆角*/background-color:#eeeeee;/*滚动条的背景颜色*/}.ms-task-content::-webkit-scrollbar-track{border-radius:10px;background-color:#FFFFFF;}/*定义滑块内阴影+圆角*/.ms-webkit-scrollbar::-webkit-scrollbar-thumb,::-webkit-scrollbar-thumb{border-radius:10px;/*滚动条的圆角*/background-color:#dddddd;/*滚动条的背景颜色*/}</style>"
+               );
+            });
+         }
+      }
+   })
+</script>

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

@@ -0,0 +1,80 @@
+<!--图文素材页-->
+<link rel="stylesheet" href="../../../static/mweixin/css/material-list.css">
+<div id="material-list-vue" v-if="menuVue.menuActive == '图文'" class="ms-weixin-content">
+   <el-container>
+      <!--右侧头部-->
+      <el-header class="ms-header" height="50px">
+         <el-row>
+            <el-button type="primary" size="small" icon="el-icon-plus" @click="menuVue.menuActive = '新建图文'">添加</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-material-list">
+            <div class="ms-admin-material-item" v-for="material in materialList">
+               <div class="head">
+                  <span v-text="'更新于'+material.date"></span>
+                  <i class="iconfont icon-weixin"></i>
+               </div>
+               <div class="body">
+                  <span v-text="material.title"></span>
+                  <img :src="material.img" />
+                  <p v-text="material.det"></p>
+               </div>
+               <div class="footer">
+                  <i class="el-icon-edit" @click="menuVue.menuActive = '新建图文'"></i>
+                  <em></em>
+                  <i class="el-icon-delete"></i>
+               </div>
+            </div>
+         </el-main>
+      </el-container>
+   </el-container>
+</div>
+
+<script>
+   new Vue({
+      el: "#material-list-vue",
+      data: {
+         options1: [{
+            value: '全部图片',
+            label: '全部图片'
+         }],
+         options2: [{
+            value: '全部图片',
+            label: '全部图片'
+         }],
+         value1: '全部图片',
+         value2: '',
+         materialList: [{
+               date: '12月27日',
+               title: 'HUAWEI Mate 20 6GB+64GB 全网最低价...',
+               img: '../images/data/img.png',
+               det: '传播名HUAWEI Mate 20 6GB+64GB 全网最低价,后置摄像头后置莱卡散射,12000万亿像素(光脚,1/1.6光圈)+1200万像素(超广角),......'
+            },
+            {
+               date: '12月27日',
+               title: 'HUAWEI Mate 20 6GB+64GB 全网最低价...',
+               img: '../images/data/img.png',
+               det: '传播名HUAWEI Mate 20 6GB+64GB 全网最低价,后置摄像头后置莱卡散射,12000万亿像素(光脚,1/1.6光圈)+1200万像素(超广角),......'
+            }
+         ],
+      },
+      methods: {},
+      mounted: function() {}
+   })
+</script>

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

@@ -0,0 +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-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() {}
+   })
+</script>

+ 21 - 0
src/main/webapp/WEB-INF/manager/mweixin/weixin.ftl

@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+   <head>
+      <meta charset="UTF-8">
+      <title></title>
+      <!-- <#include "/include/head-file.ftl"/> -->
+      <!--#include virtual="../include/head-file.ftl" -->
+   </head>
+   <body>
+      <!--#include virtual="menu.ftl" -->
+      <!--#include virtual="metarial/index.ftl" -->
+      <!--#include virtual="metarial/form.ftl" -->
+      <!--#include virtual="picture/index.ftl" -->
+      <!--#include virtual="keyword/index.ftl" -->
+      <!--#include virtual="keyword/form.ftl" -->
+      <!--#include virtual="menu/index.ftl" -->
+      <!--#include virtual="menu/new-pic-form.ftl" -->
+      <!--#include virtual="menu/material-bank-form.ftl" -->
+      <!--#include virtual="message/index.ftl" -->
+   </body>
+</html>

+ 210 - 0
src/main/webapp/static/ms-admin/4.7.0/css/login.css

@@ -0,0 +1,210 @@
+/*
+*这里的值严格按照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: #aaa;
+  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: #ddd;
+  /*滚动条的背景颜色*/
+}
+.ms-container {
+  margin: 12px;
+  height: calc(100% - 24px);
+  padding: 14px 14px 0 14px;
+  background: #fff;
+}
+.ms-header {
+  padding: 10px;
+  margin: 0;
+  border-bottom: 1px solid #ddd;
+  background: #fff;
+  height: 50px;
+}
+.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 #ddd;
+}
+.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 #ddd;
+  padding: 15px !important;
+}
+.login {
+  width: 100vw;
+  height: 100vh;
+}
+.login .ms-admin-login-container {
+  height: 100%;
+  background: url('../images/login-bg.jpg') center no-repeat;
+  background-size: cover;
+}
+.login .ms-admin-login-container .ms-admin-login-main {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 680px;
+  height: 320px;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp > img {
+  flex: 1;
+  display: inline-block;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form {
+  flex: 1;
+  height: 320px;
+  background: #fff;
+  padding: 39px  54px;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form h1 {
+  line-height: 1;
+  font-weight: initial;
+  font-size: 12px;
+  color: #999999;
+  margin: 0 0 30px 0;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form h1 span {
+  font-weight: initial;
+  font-size: 16px;
+  color: #0099ff;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item {
+  margin-bottom: 12px;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item > div {
+  margin-left: 0 !important;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item .el-form-item__content,
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item .el-input,
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item input {
+  height: 34px !important;
+  line-height: 34px !important;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content {
+  display: flex;
+  justify-content: space-between;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content .el-input__inner,
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content .el-input {
+  width: 110px;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content > img {
+  width: 66px;
+  height: 34px;
+  margin: 0 6px;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content p {
+  display: flex;
+  justify-content: space-between;
+  line-height: 1;
+  flex-direction: column;
+  margin: 0;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content p span:nth-of-type(1) {
+  font-weight: initial;
+  font-size: 10px;
+  color: #999999;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content p span:nth-of-type(2) {
+  font-weight: initial;
+  font-size: 10px;
+  color: #0099ff;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-checkout .el-form-item__content,
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-checkout .el-input,
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-checkout input {
+  height: auto !important;
+  line-height: 1px !important;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-login-btn {
+  width: 100%;
+  height: 34px;
+  line-height: 5px;
+}

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

@@ -0,0 +1,129 @@
+@import "base/style.less";
+@import "base/mixin.less";
+html,
+body {
+    min-height: 100vh;
+    width: 100vw;
+    background-color: @backgroundColor;
+    margin: 0;
+    display: flex;
+    .ms-font(@defalutSize, @defalutColor) !important; //默认字体样式
+    * {
+        text-decoration: none !important;
+        font-family: Verdana, Arial, Helvetica, sans-serif;
+        box-sizing: border-box;
+    }
+}
+
+@headHeight: 50px;
+//超文本隐藏 
+.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 {
+    .ms-font(@auxiliarySize, @auxiliaryColor);
+    resize: none;
+}
+
+//设置滚动条样式
+*::-webkit-scrollbar {
+    .ms-width-height(8px);
+}
+
+
+/*定义滚动条轨道 内阴影+圆角*/
+
+*::-webkit-scrollbar-track {
+    border-radius: 10px;
+    /*滚动条的背景区域的圆角*/
+    background-color: @backgroundColor;
+    /*滚动条的背景颜色*/
+}
+
+
+/*定义滑块 内阴影+圆角*/
+
+*::-webkit-scrollbar-thumb {
+    border-radius: 10px;
+    /*滚动条的圆角*/
+    background-color: @borderColor;
+    /*滚动条的背景颜色*/
+}
+
+.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;
+    button{
+        height: 30px;
+    }
+}
+
+.ms-pagination {
+    padding: 20px 0;
+    text-align: right;
+}
+
+.ms-fr {
+    float: right;
+}
+
+.ms-tr {
+    text-align: right;
+}
+
+.el-button+.el-button {
+//  margin-left: 0
+}
+
+.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 @borderColor;
+        .el-dialog__title{
+            .ms-font(@defalutSize,@defalutColor,bold);
+        }
+    }
+    .el-dialog__footer{
+        border-top: 1px solid @borderColor;
+        padding: 15px !important;
+    }
+}
+
+//选中样式
+.ms-hover{
+    cursor: pointer;
+    &:hover{
+        color: @themeColor;
+        background: #fff;
+        border-color: @themeColor;
+    }
+}

+ 221 - 0
src/main/webapp/static/ms-admin/4.7.0/less/css/login.css

@@ -0,0 +1,221 @@
+/*
+*这里的值严格按照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: #aaa;
+  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: #ddd;
+  /*滚动条的背景颜色*/
+}
+.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 #ddd;
+}
+.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 #ddd;
+  padding: 15px !important;
+}
+.ms-hover {
+  cursor: pointer;
+}
+.ms-hover:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.login {
+  width: 100vw;
+  height: 100vh;
+}
+.login .ms-admin-login-container {
+  height: 100%;
+  background: url('../images/login-bg.jpg') center no-repeat;
+  background-size: cover;
+}
+.login .ms-admin-login-container .ms-admin-login-main {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 680px;
+  height: 320px;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp > img {
+  flex: 1;
+  display: inline-block;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form {
+  flex: 1;
+  height: 320px;
+  background: #fff;
+  padding: 39px  54px;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form h1 {
+  line-height: 1;
+  font-weight: initial;
+  font-size: 12px;
+  color: #999999;
+  margin: 0 0 30px 0;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form h1 span {
+  font-weight: initial;
+  font-size: 16px;
+  color: #0099ff;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item {
+  margin-bottom: 12px;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item > div {
+  margin-left: 0 !important;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item .el-form-item__content,
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item .el-input,
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item input {
+  height: 34px !important;
+  line-height: 34px !important;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content {
+  display: flex;
+  justify-content: space-between;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content .el-input__inner,
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content .el-input {
+  width: 110px;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content > img {
+  width: 66px;
+  height: 34px;
+  margin: 0 6px;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content p {
+  display: flex;
+  justify-content: space-between;
+  line-height: 1;
+  flex-direction: column;
+  margin: 0;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content p span:nth-of-type(1) {
+  font-weight: initial;
+  font-size: 10px;
+  color: #999999;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content p span:nth-of-type(2) {
+  font-weight: initial;
+  font-size: 10px;
+  color: #0099ff;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-checkout .el-form-item__content,
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-checkout .el-input,
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-checkout input {
+  height: auto !important;
+  line-height: 1px !important;
+}
+.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-login-btn {
+  width: 100%;
+  height: 34px;
+  line-height: 5px;
+}

+ 88 - 0
src/main/webapp/static/ms-admin/4.7.0/less/login.less

@@ -0,0 +1,88 @@
+@import "app.less";
+// 登录
+.login{
+    .ms-width-height(100vw,100vh);
+    .ms-admin-login-container{ 
+        height: 100%;
+        background: url('../images/login-bg.jpg') center no-repeat;
+        background-size:cover; 
+        .ms-admin-login-main{
+            .ms-flex(center);
+            align-items: center;
+            .ms-admin-login-warp{
+                .ms-flex(center);
+                align-items: center;
+                .ms-width-height(680px,320px);
+                // 口号
+                >img{
+                    flex: 1;
+                    display: inline-block;
+                }
+                // 表单
+                .ms-admin-login-form{
+                    flex: 1;
+                    height: 320px;
+                    background: #fff;
+                    padding:39px  54px;
+                    // 标题
+                    h1{
+                        line-height: 1;
+                        .ms-font(12px,#999999); 
+                        margin: 0 0 30px 0;
+                        span{
+                            .ms-font(16px,#0099ff);
+                        }
+                    }
+                    .ms-admin-form-item{
+                        margin-bottom: 12px;
+                        >div{
+                            margin-left: 0 !important;
+                        }
+                        .el-form-item__content,.el-input,input{
+                            height: 34px !important;
+                            line-height: 34px !important;
+                        }
+                    }
+                    // 验证码
+                    .ms-admin-form-item-code{
+                        .el-form-item__content{
+                            .ms-flex();
+                            .el-input__inner,.el-input{
+                                width:110px;
+                            }
+                            >img{
+                                .ms-width-height(66px,34px);
+                                margin:0 6px;
+                            }
+                            p{
+                                .ms-flex();
+                                line-height: 1;
+                                flex-direction: column;
+                                margin: 0;
+                                span:nth-of-type(1){
+                                    .ms-font(10px,#999999);
+                                }
+                                span:nth-of-type(2){
+                                    .ms-font(10px,#0099ff);
+                                }
+                            }
+                            
+                        }
+                    }
+                    .ms-admin-form-item-checkout{
+                        .el-form-item__content,.el-input,input{
+                            height: auto !important;
+                            line-height: 1px !important;
+                        }
+                    }
+                    // 提交按钮
+                    .ms-admin-login-btn{
+                        .ms-width-height(100%,34px);
+                        line-height: 5px;
+                    }
+                }
+            }
+        }
+    }
+}
+

+ 148 - 0
src/main/webapp/static/mweixin/article.less

@@ -0,0 +1,148 @@
+// 新建图文
+@import "../ms-admin/4.7.0/less/app.less";
+.ms-article {
+    .ms-flex();
+    width: 100%;
+    background: transparent !important;
+    padding: 0 !important;
+    .el-container {
+        .ms-container {
+            padding: 0;
+            background: transparent;
+            align-items: flex-start;
+        }
+        // 侧边
+        .el-aside {
+            padding: 14px;
+            background: #fff;
+            // 主文章
+            .ms-main-article {
+                position: relative;
+                img {
+                    .ms-width-height(100%, 146px);
+                }
+                .ms-main-article-mask {
+                    background: #000;
+                    opacity: .2;
+                    .ms-width-height(100%, 146px);
+                    position: absolute;
+                    top: 0;
+                    left: 0;
+                }
+                span {
+                    position: absolute;
+                    bottom: 0;
+                    padding: 15px;
+                    color: #fff;
+                    .ms-ellipsis-clamp(2);
+                }
+            } // 子文章
+            .ms-article-item {
+                .ms-width-height(100%, 70px);
+                .ms-flex();
+                padding: 10px 0;
+                border-bottom: 1px solid @borderColor;
+                p {
+                    margin: 0 10px 0 0;
+                    .ms-flex();
+                    align-items: center;
+                    span {
+                        width: 100%;
+                        display: inline-block;
+                        .ms-ellipsis-clamp(2);
+                    }
+                }
+                img {
+                    .ms-width-height(50px);
+                }
+                &:hover {
+                    cursor: pointer;
+                }
+            } // 尾部
+            .ms-article-footer {
+                background: #fff;
+                padding-top: 20px;
+                .el-button {
+                    width: 100%;
+                    background: rgb(242, 242, 246);
+                    i,
+                    span {
+                        .ms-font(@auxiliarySize, @auxiliaryColor);
+                    }
+                }
+            }
+        } // 内容区域
+        .el-main {
+            flex: 1;
+            margin-left: 14px;
+            padding: 0 !important;
+            .ms-main-header {
+                background: #fff;
+                .ms-flex();
+                height: 180px;
+                padding: 20px;
+                padding-bottom: 24px;
+                box-sizing: border-box;
+                border-bottom: 1px solid @borderColor; // 图片上传
+                .ms-pic-upload {
+                    .ms-width-height(140px);
+                    border-radius: 4px;
+                    border: 1px dashed @borderColor;
+                    .ms-flex(center);
+                    flex-direction: column;
+                    margin-right: 20px;
+                    .el-upload {
+                        .ms-flex();
+                        flex-direction: column;
+                        align-items: center;
+                        span {
+                            .ms-font(@auxiliarySize, @auxiliaryColor);
+                            margin-top: 4px;
+                        }
+                        i {
+                            .ms-font(18px, @auxiliaryColor);
+                        }
+                    }
+                } // 表单
+                .el-form {
+                    flex: 1;
+                    margin: 0 !important;
+                    .ms-flex();
+                    flex-direction: column;
+                    .el-form-item {
+                        margin-bottom: 0 !important;
+                    }
+                    .el-input__suffix {
+                        top: -3px !important;
+                    }
+                }
+            }
+            .ms-main-body {
+                height: calc(~'100% - 180px');
+                background: #fff;
+                .edui-default {
+                    border: none;
+                    .edui-editor {
+                        .edui-editor-toolbarboxouter {
+                            background-color: none !important;
+                            background-image: none !important;
+                        } // 编辑器样式
+                        .edui-editor {
+                            border: none !important;
+                            .edui-editor-toolbarbox {
+                                box-shadow: none !important;
+                                .edui-editor-toolbarboxouter {
+                                    background-color: transparent !important;
+                                    background-image: none !important;
+                                    border: none !important;
+                                    border-radius: 0 !important;
+                                    box-shadow: none !important;
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}

+ 291 - 0
src/main/webapp/static/mweixin/css/article.css

@@ -0,0 +1,291 @@
+/*
+*这里的值严格按照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: #aaa;
+  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: #ddd;
+  /*滚动条的背景颜色*/
+}
+.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 #ddd;
+}
+.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 #ddd;
+  padding: 15px !important;
+}
+.ms-hover {
+  cursor: pointer;
+}
+.ms-hover:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.ms-article {
+  display: flex;
+  justify-content: space-between;
+  width: 100%;
+  background: transparent !important;
+  padding: 0 !important;
+}
+.ms-article .el-container .ms-container {
+  padding: 0;
+  background: transparent;
+  align-items: flex-start;
+}
+.ms-article .el-container .el-aside {
+  padding: 14px;
+  background: #fff;
+}
+.ms-article .el-container .el-aside .ms-main-article {
+  position: relative;
+}
+.ms-article .el-container .el-aside .ms-main-article img {
+  width: 100%;
+  height: 146px;
+}
+.ms-article .el-container .el-aside .ms-main-article .ms-main-article-mask {
+  background: #000;
+  opacity: 0.2;
+  width: 100%;
+  height: 146px;
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+.ms-article .el-container .el-aside .ms-main-article span {
+  position: absolute;
+  bottom: 0;
+  padding: 15px;
+  color: #fff;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+}
+.ms-article .el-container .el-aside .ms-article-item {
+  width: 100%;
+  height: 70px;
+  display: flex;
+  justify-content: space-between;
+  padding: 10px 0;
+  border-bottom: 1px solid #ddd;
+}
+.ms-article .el-container .el-aside .ms-article-item p {
+  margin: 0 10px 0 0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+.ms-article .el-container .el-aside .ms-article-item p span {
+  width: 100%;
+  display: inline-block;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+}
+.ms-article .el-container .el-aside .ms-article-item img {
+  width: 50px;
+  height: 50px;
+}
+.ms-article .el-container .el-aside .ms-article-item:hover {
+  cursor: pointer;
+}
+.ms-article .el-container .el-aside .ms-article-footer {
+  background: #fff;
+  padding-top: 20px;
+}
+.ms-article .el-container .el-aside .ms-article-footer .el-button {
+  width: 100%;
+  background: #f2f2f6;
+}
+.ms-article .el-container .el-aside .ms-article-footer .el-button i,
+.ms-article .el-container .el-aside .ms-article-footer .el-button span {
+  font-weight: initial;
+  font-size: 12px;
+  color: #aaa;
+}
+.ms-article .el-container .el-main {
+  flex: 1;
+  margin-left: 14px;
+  padding: 0 !important;
+}
+.ms-article .el-container .el-main .ms-main-header {
+  background: #fff;
+  display: flex;
+  justify-content: space-between;
+  height: 180px;
+  padding: 20px;
+  padding-bottom: 24px;
+  box-sizing: border-box;
+  border-bottom: 1px solid #ddd;
+}
+.ms-article .el-container .el-main .ms-main-header .ms-pic-upload {
+  width: 140px;
+  height: 140px;
+  border-radius: 4px;
+  border: 1px dashed #ddd;
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  margin-right: 20px;
+}
+.ms-article .el-container .el-main .ms-main-header .ms-pic-upload .el-upload {
+  display: flex;
+  justify-content: space-between;
+  flex-direction: column;
+  align-items: center;
+}
+.ms-article .el-container .el-main .ms-main-header .ms-pic-upload .el-upload span {
+  font-weight: initial;
+  font-size: 12px;
+  color: #aaa;
+  margin-top: 4px;
+}
+.ms-article .el-container .el-main .ms-main-header .ms-pic-upload .el-upload i {
+  font-weight: initial;
+  font-size: 18px;
+  color: #aaa;
+}
+.ms-article .el-container .el-main .ms-main-header .el-form {
+  flex: 1;
+  margin: 0 !important;
+  display: flex;
+  justify-content: space-between;
+  flex-direction: column;
+}
+.ms-article .el-container .el-main .ms-main-header .el-form .el-form-item {
+  margin-bottom: 0 !important;
+}
+.ms-article .el-container .el-main .ms-main-header .el-form .el-input__suffix {
+  top: -3px !important;
+}
+.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-default .edui-editor .edui-editor-toolbarboxouter {
+  background-color: none !important;
+  background-image: none !important;
+}
+.ms-article .el-container .el-main .ms-main-body .edui-default .edui-editor .edui-editor {
+  border: none !important;
+}
+.ms-article .el-container .el-main .ms-main-body .edui-default .edui-editor .edui-editor .edui-editor-toolbarbox {
+  box-shadow: none !important;
+}
+.ms-article .el-container .el-main .ms-main-body .edui-default .edui-editor .edui-editor .edui-editor-toolbarbox .edui-editor-toolbarboxouter {
+  background-color: transparent !important;
+  background-image: none !important;
+  border: none !important;
+  border-radius: 0 !important;
+  box-shadow: none !important;
+}

+ 278 - 0
src/main/webapp/static/mweixin/css/custom-menu.css

@@ -0,0 +1,278 @@
+/*
+*这里的值严格按照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: #aaa;
+  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: #ddd;
+  /*滚动条的背景颜色*/
+}
+.ms-container {
+  margin: 12px;
+  height: calc(100% - 24px);
+  padding: 14px 14px 0 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 #ddd;
+}
+.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 #ddd;
+  padding: 15px !important;
+}
+.ms-hover {
+  cursor: pointer;
+}
+.ms-hover:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.ms-custom-menu {
+  color: #f2f2f6;
+}
+.ms-custom-menu .ms-custom-container {
+  display: flex;
+  justify-content: space-between;
+}
+.ms-custom-menu .ms-custom-container > .ms-container {
+  padding: 0;
+  background: transparent;
+}
+.ms-custom-menu .ms-custom-container .el-aside {
+  background: #fff;
+  width: 280px !important;
+  height: 470px !important;
+}
+.ms-custom-menu .ms-custom-container .el-aside .el-container .el-header {
+  height: 40px !important;
+  line-height: 40px !important;
+  font-weight: initial;
+  font-size: 16px;
+  color: #fff;
+  text-align: center;
+  background: #323232;
+}
+.ms-custom-menu .ms-custom-container .el-aside .el-container .el-main {
+  padding: 0;
+  width: 280px !important;
+  height: 379px !important;
+}
+.ms-custom-menu .ms-custom-container .el-aside .el-container .el-footer {
+  white-space: nowrap;
+  padding: 0;
+  font-size: 0;
+  background-color: #FAFAFA;
+  width: 280px !important;
+  height: 50px !important;
+  display: flex;
+  justify-content: flex-start;
+  border-top: 1px solid #ddd !important;
+}
+.ms-custom-menu .ms-custom-container .el-aside .el-container .el-footer > .el-button {
+  width: 40px !important;
+  height: 50px !important;
+  padding: 0 !important;
+  border: none !important;
+  border-right: 1px solid #ddd !important;
+}
+.ms-custom-menu .ms-custom-container .el-aside .el-container .el-footer .el-button {
+  border-radius: 0 !important;
+  height: 50px !important;
+  background: transparent !important;
+}
+.ms-custom-menu .ms-custom-container .el-aside .el-container .el-footer .ms-create-menu {
+  flex: 1;
+  font-size: 0;
+  display: flex;
+  justify-content: space-between;
+}
+.ms-custom-menu .ms-custom-container .el-aside .el-container .el-footer .ms-create-menu .el-button {
+  flex: 1;
+  border: none !important;
+  background: transparent !important;
+}
+.ms-custom-menu .ms-custom-container .el-aside .el-container .el-footer .ms-create-menu .el-button span {
+  color: #333;
+}
+.ms-custom-menu .ms-custom-container .el-aside .el-container .el-footer .ms-create-menu .ms-create-sub-menu {
+  flex: 1;
+  position: relative;
+}
+.ms-custom-menu .ms-custom-container .el-aside .el-container .el-footer .ms-create-menu .ms-create-sub-menu > .el-button:first-child {
+  width: 100%;
+}
+.ms-custom-menu .ms-custom-container .el-aside .el-container .el-footer .ms-create-menu .ms-create-sub-menu > .el-button:last-child {
+  position: absolute;
+  top: -60px;
+  left: 0;
+  border: 1px solid #ddd !important;
+  width: 100%;
+}
+.ms-custom-menu .ms-custom-container .el-aside .el-container .el-footer .ms-create-menu .el-button--default {
+  border-left: 1px solid #ddd !important;
+  padding: 0 !important;
+  flex: 1;
+}
+.ms-custom-menu .ms-custom-container .el-main {
+  padding: 0;
+  padding-left: 20px;
+  flex: 1;
+  height: 470px;
+}
+.ms-custom-menu .ms-custom-container .el-main .custom-menu-card {
+  height: 100%;
+}
+.ms-custom-menu .ms-custom-container .el-main .custom-menu-card .ms-custom-menu-name .el-form-item__content {
+  display: flex;
+  justify-content: flex-start;
+}
+.ms-custom-menu .ms-custom-container .el-main .custom-menu-card .ms-custom-menu-name .el-form-item__content .el-input {
+  width: 153px !important;
+  height: 30px !important;
+}
+.ms-custom-menu .ms-custom-container .el-main .custom-menu-card .ms-custom-menu-name .el-form-item__content span {
+  margin-left: 10px;
+  font-weight: initial;
+  font-size: 12px;
+  color: #aaa;
+}
+.ms-custom-menu .ms-custom-container .el-main .custom-menu-card .ms-custom-menu-content .el-tabs {
+  border: 1px solid #ddd;
+}
+.ms-custom-menu .ms-custom-container .el-main .custom-menu-card .ms-custom-menu-content .el-tabs .el-tabs__header {
+  background: #f2f2f6;
+  border-radius: 4px 4px 0 0 !important;
+  margin: 0 !important;
+}
+.ms-custom-menu .ms-custom-container .el-main .custom-menu-card .ms-custom-menu-content .el-tabs .el-tabs__header .el-tabs__nav-scroll {
+  padding: 0 20px;
+}
+.ms-custom-menu .ms-custom-container .el-main .custom-menu-card .ms-custom-menu-content .el-tabs .el-tabs__header .el-tabs__nav-scroll i {
+  margin-right: 8px;
+}
+.ms-custom-menu .ms-custom-container .el-main .custom-menu-card .ms-custom-menu-content .el-tabs .el-tab-pane {
+  padding: 20px;
+  width: 100%;
+  height: 220px;
+  display: flex;
+  justify-content: space-between;
+}
+.ms-custom-menu .ms-custom-container .el-main .custom-menu-card .ms-custom-menu-content .el-tabs .el-tab-pane > div {
+  flex: 1;
+  border: 1px dashed #ddd;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+}
+.ms-custom-menu .ms-custom-container .el-main .custom-menu-card .ms-custom-menu-content .el-tabs .el-tab-pane > div i {
+  font-weight: bolder;
+  font-size: 20px;
+  color: #0099ff;
+}
+.ms-custom-menu .ms-custom-container .el-main .custom-menu-card .ms-custom-menu-content .el-tabs .el-tab-pane > div span {
+  margin-top: 8px;
+  line-height: 1;
+}
+.ms-custom-menu .ms-custom-container .el-main .custom-menu-card .ms-custom-menu-content .el-tabs .el-tab-pane > div:hover {
+  cursor: pointer;
+}
+.ms-custom-menu .ms-custom-container .el-main .custom-menu-card .ms-custom-menu-content .el-tabs .el-tab-pane > div:last-child {
+  margin-left: 20px;
+}

+ 125 - 0
src/main/webapp/static/mweixin/css/keyword-list.css

@@ -0,0 +1,125 @@
+/*
+*这里的值严格按照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: #aaa;
+  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: #ddd;
+  /*滚动条的背景颜色*/
+}
+.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 #ddd;
+}
+.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 #ddd;
+  padding: 15px !important;
+}
+.ms-hover {
+  cursor: pointer;
+}
+.ms-hover:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}

+ 203 - 0
src/main/webapp/static/mweixin/css/keyword-reply.css

@@ -0,0 +1,203 @@
+/*
+*这里的值严格按照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: #aaa;
+  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: #ddd;
+  /*滚动条的背景颜色*/
+}
+.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 #ddd;
+}
+.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 #ddd;
+  padding: 15px !important;
+}
+.ms-hover {
+  cursor: pointer;
+}
+.ms-hover:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.keyword-reply {
+  padding-bottom: 20px;
+}
+.keyword-reply .el-select .el-input {
+  width: 90px;
+}
+.keyword-reply .el-select .el-input > input {
+  padding: 0 10px !important;
+}
+.keyword-reply .ms-keyword-input {
+  margin-bottom: 15px !important;
+}
+.keyword-reply .ms-keyword-input .el-input__suffix {
+  line-height: 28px;
+}
+.keyword-reply .ms-keyword-input .el-icon-plus {
+  margin-left: 20px;
+  font-weight: bold;
+  font-size: 14px;
+  color: #0099ff;
+}
+.keyword-reply .ms-keyword-input .el-icon-plus:hover {
+  cursor: pointer;
+}
+.keyword-reply .ms-keyword-reply-content {
+  margin: 0;
+}
+.keyword-reply .ms-keyword-reply-content .keyword-reply-tabs {
+  flex: 1;
+  border: 1px solid #ddd;
+  border-radius: 4px 4px 0 0 !important;
+  min-height: 226px;
+}
+.keyword-reply .ms-keyword-reply-content .keyword-reply-tabs .el-tabs__header {
+  margin: 0 !important;
+}
+.keyword-reply .ms-keyword-reply-content .keyword-reply-tabs .el-tabs__header .el-tabs__nav-scroll {
+  padding: 0 20px;
+}
+.keyword-reply .ms-keyword-reply-content .el-form-item__content {
+  position: relative;
+}
+.keyword-reply .ms-keyword-reply-content .el-form-item__content .el-icon-delete {
+  position: absolute;
+  right: 5px;
+  bottom: 66px;
+  font-weight: initial;
+  font-size: 12px;
+  color: #aaa;
+}
+.keyword-reply .ms-keyword-reply-content .el-form-item__content .el-icon-delete:hover {
+  cursor: pointer;
+}
+.keyword-reply .ms-keyword-reply-content .el-form-item__content textarea {
+  height: 127px !important;
+  border: none !important;
+  border-bottom: 1px solid #ddd !important;
+}
+.keyword-reply .ms-keyword-reply-content .el-form-item__content .footer {
+  height: 58px;
+  padding: 0 14px;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+}
+.keyword-reply .ms-keyword-reply-content .el-form-item__content .footer i {
+  margin-right: 12px;
+  font-size: 16px;
+}
+.keyword-reply .ms-keyword-reply-content .el-form-item__content .footer a {
+  font-weight: initial;
+  font-size: 14px;
+  color: #0099ff;
+}
+.keyword-reply .ms-keyword-reply-content .el-form-item__content .footer i:hover,
+.keyword-reply .ms-keyword-reply-content .el-form-item__content .footer a:hover {
+  cursor: pointer;
+}

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

@@ -0,0 +1,168 @@
+/*
+*这里的值严格按照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: #aaa;
+  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: #ddd;
+  /*滚动条的背景颜色*/
+}
+.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 #ddd;
+}
+.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 #ddd;
+  padding: 15px !important;
+}
+.ms-hover {
+  cursor: pointer;
+}
+.ms-hover:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.material-bank-form > .el-dialog__wrapper > .el-dialog {
+  width: 895px !important;
+  height: 587px !important;
+}
+.material-bank-form > .el-dialog__wrapper > .el-dialog > .el-dialog__body {
+  width: 100% !important;
+  height: 469px !important;
+  padding: 0 !important;
+}
+.material-bank-form > .el-dialog__wrapper > .el-dialog > .el-dialog__body > .el-tabs {
+  height: 100%;
+}
+.material-bank-form > .el-dialog__wrapper > .el-dialog > .el-dialog__body > .el-tabs .el-tabs__header {
+  width: 150px !important;
+  box-sizing: border-box;
+  margin: 0 !important;
+}
+.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-wrap::after {
+  width: 1px !important;
+}
+.material-bank-form > .el-dialog__wrapper > .el-dialog > .el-dialog__body > .el-tabs .el-tabs__content {
+  height: 100%;
+  box-sizing: border-box;
+  padding: 20px 20px 10px 20px;
+}
+.material-bank-form > .el-dialog__wrapper > .el-dialog > .el-dialog__body > .el-tabs .el-tabs__content .el-tab-pane {
+  height: 100%;
+  display: flex;
+  justify-content: space-between;
+  flex-direction: column;
+}
+.material-bank-form > .el-dialog__wrapper > .el-dialog > .el-dialog__body > .el-tabs .el-tabs__content .el-tab-pane > div:first-child {
+  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;
+}

+ 199 - 0
src/main/webapp/static/mweixin/css/material-list.css

@@ -0,0 +1,199 @@
+/*
+*这里的值严格按照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: #aaa;
+  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: #ddd;
+  /*滚动条的背景颜色*/
+}
+.ms-container {
+  margin: 12px;
+  height: calc(100% - 24px);
+  padding: 14px 14px 0 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 #ddd;
+}
+.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 #ddd;
+  padding: 15px !important;
+}
+.ms-hover {
+  cursor: pointer;
+}
+.ms-hover:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.ms-admin-material-list {
+  background: #fff;
+  margin: 12px;
+  padding: 14px;
+  display: flex;
+  flex-wrap: wrap;
+}
+.ms-admin-material-list .ms-admin-material-item {
+  margin: 0 24px 0 0;
+  padding: 0 10px;
+  width: 230px;
+  display: flex;
+  flex-direction: column;
+  border: 1px solid #e6e6e6;
+  border-radius: 4px;
+}
+.ms-admin-material-list .ms-admin-material-item .head {
+  border-bottom: 1px solid #e6e6e6;
+  padding: 10px 0;
+}
+.ms-admin-material-list .ms-admin-material-item .head span {
+  color: #999;
+}
+.ms-admin-material-list .ms-admin-material-item .body {
+  display: flex;
+  flex-direction: column;
+  line-height: 2em;
+}
+.ms-admin-material-list .ms-admin-material-item .body span {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  display: block;
+  cursor: pointer;
+}
+.ms-admin-material-list .ms-admin-material-item .body span:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.ms-admin-material-list .ms-admin-material-item .body img {
+  width: 170px;
+  height: 110px;
+  margin: 0 auto;
+  object-fit: cover;
+}
+.ms-admin-material-list .ms-admin-material-item .body p {
+  margin: 0;
+  color: #999;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+}
+.ms-admin-material-list .ms-admin-material-item .footer {
+  display: flex;
+  padding: 14px 0;
+}
+.ms-admin-material-list .ms-admin-material-item .footer i {
+  color: #999;
+  margin: auto;
+  cursor: pointer;
+}
+.ms-admin-material-list .ms-admin-material-item .footer i:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.ms-admin-material-list .ms-admin-material-item .footer em {
+  width: 1px;
+  height: 1em;
+  background: #e6e6e6;
+}

+ 165 - 0
src/main/webapp/static/mweixin/css/menu.css

@@ -0,0 +1,165 @@
+/*
+*这里的值严格按照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: #aaa;
+  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: #ddd;
+  /*滚动条的背景颜色*/
+}
+.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 #ddd;
+}
+.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 #ddd;
+  padding: 15px !important;
+}
+.ms-hover {
+  cursor: pointer;
+}
+.ms-hover:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.ms-admin-menu {
+  min-height: 100vh;
+  min-width: 140px;
+}
+.ms-admin-menu .ms-header {
+  border-right: solid 1px #e6e6e6;
+}
+.ms-admin-menu .ms-header div {
+  height: 100%;
+  display: flex;
+  align-items: center;
+}
+.ms-admin-menu .ms-header div i {
+  display: inline-block;
+  text-align: center;
+  line-height: 1.4em;
+  width: 1.4em;
+  height: 1.4em;
+  border-radius: 4px;
+  color: #fff;
+  font-size: 1.4em;
+  background: #02CF5D;
+}
+.ms-admin-menu .ms-header div span {
+  margin: auto;
+}
+.ms-admin-menu .el-main {
+  padding: 0;
+}
+.ms-admin-menu .el-main .ms-admin-menu-menu {
+  min-height: calc(100vh - 50px);
+  background: #fff;
+}
+.ms-admin-menu .el-main .ms-admin-menu-menu .el-menu-item {
+  min-width: 140px;
+  width: 140px;
+}
+.ms-admin-menu .el-main .ms-admin-material-item {
+  min-width: 100% !important;
+}

+ 215 - 0
src/main/webapp/static/mweixin/css/message-reply.css

@@ -0,0 +1,215 @@
+/*
+*这里的值严格按照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: #aaa;
+  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: #ddd;
+  /*滚动条的背景颜色*/
+}
+.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 #ddd;
+}
+.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 #ddd;
+  padding: 15px !important;
+}
+.ms-hover {
+  cursor: pointer;
+}
+.ms-hover:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.ms-admin-message-reply .ms-container {
+  display: flex;
+}
+.ms-admin-message-reply .ms-container .message-reply-tabs {
+  padding-left: 12px;
+}
+.ms-message-reply {
+  display: flex;
+  justify-content: flex-start;
+  height: auto;
+}
+.ms-message-reply > div:first-child {
+  margin-right: 10px;
+  line-height: 40px;
+}
+.ms-message-reply .message-reply-tabs {
+  flex: 1;
+  border-radius: 4px 4px 0 0 !important;
+  border: none !important;
+}
+.ms-message-reply .message-reply-tabs .el-tabs__header {
+  margin: 0 !important;
+}
+.ms-message-reply .message-reply-tabs .el-tabs__header .el-tabs__nav-scroll {
+  padding: 0 20px;
+  border: 1px solid #ddd;
+}
+.ms-message-reply .message-reply-tabs .el-tabs__content {
+  border: 1px solid #ddd;
+}
+.ms-message-reply .message-reply-tabs .el-tabs__content .el-tab-pane {
+  padding: 0 !important;
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+}
+.ms-message-reply .message-reply-tabs .el-tabs__content .el-tab-pane > .el-form {
+  width: 100%;
+}
+.ms-message-reply .message-reply-tabs .el-tabs__content .el-tab-pane > .el-form .ms-message-reply-content {
+  margin: 0;
+}
+.ms-message-reply .message-reply-tabs .el-tabs__content .el-tab-pane > .el-form .ms-message-reply-content .el-form-item__content {
+  position: relative;
+}
+.ms-message-reply .message-reply-tabs .el-tabs__content .el-tab-pane > .el-form .ms-message-reply-content .el-form-item__content .el-icon-delete {
+  position: absolute;
+  right: 7px;
+  bottom: 66px;
+  font-weight: initial;
+  font-size: 12px;
+  color: #aaa;
+  cursor: pointer;
+}
+.ms-message-reply .message-reply-tabs .el-tabs__content .el-tab-pane > .el-form .ms-message-reply-content .el-form-item__content .el-icon-delete:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.ms-message-reply .message-reply-tabs .el-tabs__content .el-tab-pane > .el-form .ms-message-reply-content .el-form-item__content textarea {
+  height: 127px !important;
+  border: none !important;
+  border-bottom: 1px solid #ddd !important;
+}
+.ms-message-reply .message-reply-tabs .el-tabs__content .el-tab-pane > .el-form .ms-message-reply-content .el-form-item__content .footer {
+  height: 58px;
+  padding: 0 14px;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+}
+.ms-message-reply .message-reply-tabs .el-tabs__content .el-tab-pane > .el-form .ms-message-reply-content .el-form-item__content .footer i {
+  margin-right: 12px;
+  font-size: 16px;
+  cursor: pointer;
+}
+.ms-message-reply .message-reply-tabs .el-tabs__content .el-tab-pane > .el-form .ms-message-reply-content .el-form-item__content .footer i:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.ms-message-reply .message-reply-tabs .el-tabs__content .el-tab-pane > .el-form .ms-message-reply-content .el-form-item__content .footer a {
+  font-weight: initial;
+  font-size: 14px;
+  color: #0099ff;
+}
+.ms-message-reply .message-reply-tabs .el-tabs__content .el-tab-pane > .el-form .ms-message-reply-content .el-form-item__content .footer i:hover,
+.ms-message-reply .message-reply-tabs .el-tabs__content .el-tab-pane > .el-form .ms-message-reply-content .el-form-item__content .footer a:hover {
+  cursor: pointer;
+}

+ 139 - 0
src/main/webapp/static/mweixin/css/new-pic-form.css

@@ -0,0 +1,139 @@
+/*
+*这里的值严格按照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: #aaa;
+  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: #ddd;
+  /*滚动条的背景颜色*/
+}
+.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 #ddd;
+}
+.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 #ddd;
+  padding: 15px !important;
+}
+.ms-hover {
+  cursor: pointer;
+}
+.ms-hover:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.new-pic-form dl {
+  margin: 0;
+}
+.new-pic-form dd,
+.new-pic-form dt {
+  line-height: 1;
+  font-weight: initial;
+  font-size: 12px;
+  color: #aaa;
+}
+.new-pic-form dt {
+  display: inline-block;
+  margin-bottom: 8px;
+}

+ 240 - 0
src/main/webapp/static/mweixin/css/picture-list.css

@@ -0,0 +1,240 @@
+/*
+*这里的值严格按照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: #aaa;
+  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: #ddd;
+  /*滚动条的背景颜色*/
+}
+.ms-container {
+  margin: 12px;
+  height: calc(100% - 24px);
+  padding: 14px 14px 0 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 #ddd;
+}
+.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 #ddd;
+  padding: 15px !important;
+}
+.ms-hover {
+  cursor: pointer;
+}
+.ms-hover:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.ms-admin-picture {
+  height: 100%;
+}
+.ms-admin-picture-list {
+  background: #fff;
+  margin: 12px;
+  padding: 14px;
+  display: flex;
+}
+.ms-admin-picture-list .ms-admin-picture-item {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: flex-start;
+  width: calc(100% - 220px) !important;
+}
+.ms-admin-picture-list .ms-admin-picture-item > div {
+  margin: 0 24px 0 0;
+  padding: 10px 10px 0 10px;
+  width: 230px;
+  display: flex;
+  flex-direction: column;
+  border: 1px solid #e6e6e6;
+  border-radius: 4px;
+}
+.ms-admin-picture-list .ms-admin-picture-item > div .body {
+  display: flex;
+  flex-direction: column;
+  line-height: 2em;
+}
+.ms-admin-picture-list .ms-admin-picture-item > div .body div {
+  margin-top: 0.5em;
+  display: flex;
+  align-items: center;
+}
+.ms-admin-picture-list .ms-admin-picture-item > div .body div span {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  display: block;
+  cursor: pointer;
+}
+.ms-admin-picture-list .ms-admin-picture-item > div .body div span:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.ms-admin-picture-list .ms-admin-picture-item > div .body img {
+  width: 100%;
+  height: 130px;
+  object-fit: cover;
+}
+.ms-admin-picture-list .ms-admin-picture-item > div .footer {
+  display: flex;
+  padding: 14px 0;
+}
+.ms-admin-picture-list .ms-admin-picture-item > div .footer i {
+  color: #999;
+  margin: auto;
+  cursor: pointer;
+}
+.ms-admin-picture-list .ms-admin-picture-item > div .footer i:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.ms-admin-picture-list .ms-admin-picture-item > div .footer em {
+  width: 1px;
+  height: 1em;
+  background: #e6e6e6;
+}
+.ms-admin-picture-list .ms-admin-picture-show {
+  min-width: 220px;
+  height: 100%;
+  margin: -14px 0;
+  padding: 14px;
+  border-left: 1px solid #e6e6e6;
+}
+.ms-admin-picture-list .ms-admin-picture-show > span {
+  padding: 10px;
+  display: flex;
+  background: #f2f2f6;
+  font-weight: bold;
+}
+.ms-admin-picture-list .ms-admin-picture-show > div {
+  display: flex;
+  align-items: center;
+  padding: 10px;
+  font-size: 14px;
+}
+.ms-admin-picture-list .ms-admin-picture-show > div span {
+  margin-right: auto;
+}
+.ms-admin-picture-list .ms-admin-picture-show > div i {
+  margin-left: 10px;
+  cursor: pointer;
+}
+.ms-admin-picture-list .ms-admin-picture-show > div i:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}
+.ms-admin-picture-list .ms-admin-picture-show > p {
+  margin: 0;
+  padding: 10px;
+  border: 1px solid #e6e6e6;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  cursor: pointer;
+}
+.ms-admin-picture-list .ms-admin-picture-show > p:hover {
+  color: #0099ff;
+  background: #fff;
+  border-color: #0099ff;
+}

+ 151 - 0
src/main/webapp/static/mweixin/custom-menu.less

@@ -0,0 +1,151 @@
+@import "../ms-admin/4.7.0/less/app.less";
+// 自定义菜单
+.ms-custom-menu {
+    color: rgb(242, 242, 246);
+    .ms-custom-container {
+        .ms-flex();
+        &>.ms-container{
+            padding: 0;
+            background: transparent;
+        }
+        // 侧边
+        .el-aside {
+            background: #fff;
+            .ms-width-height(280px, 470px) !important;
+            // 微信界面
+            .el-container {
+                // 头部
+                .el-header {
+                    .ms-line-height(40px) !important;
+                    .ms-font(16px, #fff);
+                    text-align: center;
+                    background: #323232;
+                }
+                .el-main {
+                    padding: 0;
+                    .ms-width-height(280px, 379px) !important;
+                }
+                .el-footer {
+                    white-space: nowrap;
+                    padding: 0;
+                    font-size: 0;
+                    background-color: #FAFAFA;
+                    .ms-width-height(280px, 50px) !important;
+                    .ms-flex(flex-start);
+                    border-top: 1px solid @borderColor !important;
+                    >.el-button {
+                        .ms-width-height(40px, 50px) !important;
+                        padding: 0 !important;
+                        border: none !important;
+                        border-right: 1px solid @borderColor !important;
+                    }
+                    .el-button {
+                        border-radius: 0 !important;
+                        height: 50px !important;
+                        background: transparent !important;
+                    }
+                    .ms-create-menu {
+                        flex: 1;
+                        font-size: 0;
+                        .ms-flex(space-between);
+                        .el-button {
+                            flex: 1;
+                            border: none !important;
+                            background: transparent !important;
+                            span {
+                                color: #333;
+                            }
+                        }
+                        .ms-create-sub-menu {
+                            flex: 1;
+                            position: relative;
+                            >.el-button:first-child {
+                                width: 100%;
+                            }
+                            >.el-button:last-child {
+                                position: absolute;
+                                top: -60px;
+                                left: 0;
+                                border: 1px solid @borderColor !important;
+                                width: 100%;
+                            }
+                        }
+                        // 添加菜单
+                        .el-button--default {
+                            border-left: 1px solid @borderColor !important;
+                            padding: 0 !important;
+                            flex: 1;
+                        }
+                    }
+                }
+            }
+        }
+        // 内容
+        .el-main {
+            padding: 0;
+            padding-left: 20px;
+            flex: 1;
+            height: 470px;
+            // 内容区域卡片
+            .custom-menu-card {
+                height: 100%;
+                // 内容菜单表单
+                .ms-custom-menu-name {
+                    .el-form-item__content {
+                        .el-input {
+                            .ms-width-height(153px, 30px) !important;
+                        }
+                        .ms-flex(flex-start);
+                        span {
+                            margin-left: 10px;
+                            .ms-font(@auxiliarySize, @auxiliaryColor);
+                        }
+                    }
+                }
+                // 菜单内容
+                .ms-custom-menu-content {
+                    .el-tabs {
+                        border: 1px solid @borderColor;
+                        .el-tabs__header {
+                            background: #f2f2f6;
+                            border-radius: 4px 4px 0 0 !important;
+                            margin: 0 !important;
+                            .el-tabs__nav-scroll {
+                                padding: 0 20px;
+                                i {
+                                    margin-right: 8px;
+                                }
+                            }
+                        }
+                        .el-tab-pane {
+                            padding: 20px;
+                            .ms-width-height(100%, 220px);
+                            .ms-flex();
+                            // 素材库
+                            >div {
+                                flex: 1;
+                                border: 1px dashed @borderColor;
+                                .ms-flex(center);
+                                align-items: center;
+                                flex-direction: column;
+                                i {
+                                    .ms-font(20px, @themeColor, bolder);
+                                }
+                                span {
+                                    margin-top: 8px;
+                                    line-height: 1;
+                                }
+                                &:hover {
+                                    cursor: pointer;
+                                }
+                            }
+                            >div:last-child {
+                                margin-left: 20px;
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}

+ 1 - 0
src/main/webapp/static/mweixin/keyword-list.less

@@ -0,0 +1 @@
+@import "../ms-admin/4.7.0/less/app.less";

+ 80 - 0
src/main/webapp/static/mweixin/keyword-reply.less

@@ -0,0 +1,80 @@
+@import "../ms-admin/4.7.0/less/app.less";
+// 关键字回复
+.keyword-reply {
+    padding-bottom: 20px;
+    .el-select .el-input {
+        width: 90px;
+        >input {
+            padding: 0 10px !important;
+        }
+    }
+    // 关键词 
+    .ms-keyword-input {
+        margin-bottom: 15px !important;
+        // 尾词 
+        .el-input__suffix {
+            line-height: 28px;
+        }
+        // 添加
+        .el-icon-plus {
+            margin-left: 20px;
+            .ms-font(@defalutSize, @themeColor, bold);
+            &:hover {
+                cursor: pointer;
+            }
+        }
+    }
+    // 回复内容
+    .ms-keyword-reply-content {
+        margin: 0;
+        .keyword-reply-tabs {
+            flex: 1;
+            border: 1px solid @borderColor;
+            border-radius: 4px 4px 0 0 !important;
+            min-height: 226px;
+            .el-tabs__header {
+                // background: #f2f2f6;
+                margin: 0 !important;
+                .el-tabs__nav-scroll {
+                    padding: 0 20px;
+                }
+            }
+        }
+        .el-form-item__content {
+            position: relative;
+            .el-icon-delete {
+                position: absolute;
+                right: 5px;
+                bottom: 66px;
+                .ms-font(@auxiliarySize, @auxiliaryColor);
+                &:hover {
+                    cursor: pointer;
+                }
+            }
+            textarea {
+                height: 127px !important;
+                border: none !important;
+                border-bottom: 1px solid @borderColor !important;
+            }
+            .footer {
+                height: 58px;
+                padding: 0 14px;
+                .ms-flex(flex-start);
+                align-items: center;
+                i {
+                    margin-right: 12px;
+                    font-size: 16px;
+                }
+                a {
+                    .ms-font(@defalutSize, @themeColor);
+                }
+                i,
+                a {
+                    &:hover {
+                        cursor: pointer;
+                    }
+                }
+            }
+        }
+    }
+}

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

@@ -0,0 +1,48 @@
+@import "../ms-admin/4.7.0/less/app.less";
+// 素材库表单
+.material-bank-form{
+    >.el-dialog__wrapper{
+        >.el-dialog{
+            .ms-width-height(895px,587px) !important;
+            >.el-dialog__body{
+                .ms-width-height(100%,469px) !important;
+                padding:0 !important; 
+                >.el-tabs{ 
+                    height: 100%;
+                    // 侧边导航
+                    .el-tabs__header{
+                        width: 150px !important;
+                        box-sizing: border-box;
+                        margin: 0 !important;
+                        .el-tabs__nav-scroll{
+                            padding:20px 10px;
+                        }
+                        .el-tabs__nav-wrap::after{
+                            width: 1px !important;
+                        }
+                        
+                    }
+                    // 导航内容
+                    .el-tabs__content{
+                        height: 100%;
+                        box-sizing: border-box;
+                        padding:20px 20px 10px 20px; 
+                        .el-tab-pane{
+                            height: 100%;
+                            .ms-flex();
+                            flex-direction: column;
+                            >div:first-child{
+                                flex: 1;
+                            }
+                        }
+                    }
+                    // tab选中的样式
+                    .is-active{
+                       background-color:rgb(233, 234, 240);
+                       .ms-font(@defalutSize,@defalutColor);
+                    }
+                }
+            }
+        }
+    }
+}

+ 55 - 0
src/main/webapp/static/mweixin/material-list.less

@@ -0,0 +1,55 @@
+@import "../ms-admin/4.7.0/less/app.less";
+.ms-admin-material-list {
+    background: #fff;
+    .ms-margin-padding(12px, 14px);
+    display: flex;
+    flex-wrap: wrap;
+    //单个素材
+    .ms-admin-material-item {
+        .ms-margin-padding(0 24px 0 0, 0 10px);
+        width: 230px;
+        display: flex;
+        flex-direction: column;
+        border: 1px solid #e6e6e6;
+        border-radius: 4px;
+        .head {
+            border-bottom: 1px solid #e6e6e6;
+            padding: 10px 0;
+            span {
+                color: @contentColor;
+            }
+        }
+        .body {
+            display: flex;
+            flex-direction: column;
+            line-height: 2em;
+            span {
+                .ms-ellipsis;
+                .ms-hover;
+            }
+            img {
+                .ms-width-height(170px, 110px);
+                margin: 0 auto;
+                object-fit: cover;
+            }
+            p {
+                margin: 0;
+                color: @contentColor;
+                .ms-ellipsis-clamp(3);
+            }
+        }
+        .footer {
+            display: flex;
+            padding: 14px 0;
+            i {
+                color: @contentColor;
+                margin: auto;
+                .ms-hover;
+            }
+            em {
+                .ms-width-height(1px, 1em);
+                background: #e6e6e6;
+            }
+        }
+    }
+}

+ 39 - 0
src/main/webapp/static/mweixin/menu.less

@@ -0,0 +1,39 @@
+@import "../ms-admin/4.7.0/less/app.less";
+.ms-admin-menu {
+    min-height: 100vh;
+    min-width: 140px;
+    .ms-header {
+        border-right: solid 1px #e6e6e6;
+        div {
+            height: 100%;
+            .ms-align-center;
+            i {
+                display: inline-block;
+                text-align: center;
+                line-height: 1.4em;
+                .ms-width-height(1.4em);
+                border-radius: 4px;
+                color: #fff;
+                font-size: 1.4em;
+                background: #02CF5D;
+            }
+            span {
+                margin: auto;
+            }
+        }
+    }
+    .el-main {
+        padding: 0;
+        .ms-admin-menu-menu {
+            min-height: ~'calc(100vh - 50px)';
+            background: #fff;
+            .el-menu-item{
+                min-width: 140px;
+                width: 140px;
+            }
+        }
+        .ms-admin-material-item {
+            min-width: 100% !important;
+        }
+    }
+}

+ 82 - 0
src/main/webapp/static/mweixin/message-reply.less

@@ -0,0 +1,82 @@
+@import "../ms-admin/4.7.0/less/app.less";
+.ms-admin-message-reply {
+    .ms-container {
+        display: flex;
+        .message-reply-tabs {
+            padding-left: 12px;
+        }
+    }
+}
+
+// 消息回复 && 关注回复
+.ms-message-reply {
+    .ms-flex(flex-start);
+    height: auto;
+    >div:first-child {
+        margin-right: 10px;
+        line-height: 40px;
+    }
+    // 导航切换 
+    .message-reply-tabs {
+        flex: 1;
+        border-radius: 4px 4px 0 0 !important;
+        border: none !important;
+        .el-tabs__header {
+            // background: #f2f2f6;
+            margin: 0 !important;
+            .el-tabs__nav-scroll {
+                padding: 0 20px;
+                border: 1px solid @borderColor;
+            }
+        }
+        .el-tabs__content {
+            border: 1px solid @borderColor;
+            .el-tab-pane {
+                padding: 0 !important;
+                width: 100%;
+                .ms-flex();
+                >.el-form {
+                    width: 100%;
+                    .ms-message-reply-content {
+                        margin: 0;
+                        .el-form-item__content {
+                            position: relative;
+                            .el-icon-delete {
+                                position: absolute;
+                                right: 7px;
+                                bottom: 66px;
+                                .ms-font(@auxiliarySize, @auxiliaryColor);
+                                .ms-hover;
+                            }
+                            textarea {
+                                height: 127px !important;
+                                border: none !important;
+                                border-bottom: 1px solid @borderColor !important;
+                            }
+                            .footer {
+                                height: 58px;
+                                padding: 0 14px;
+                                .ms-flex(flex-start);
+                                align-items: center;
+                                i {
+                                    margin-right: 12px;
+                                    font-size: 16px;
+                                    .ms-hover;
+                                }
+                                a {
+                                    .ms-font(@defalutSize, @themeColor);
+                                }
+                                i,
+                                a {
+                                    &:hover {
+                                        cursor: pointer;
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}

+ 15 - 0
src/main/webapp/static/mweixin/new-pic-form.less

@@ -0,0 +1,15 @@
+@import "../ms-admin/4.7.0/less/app.less";
+// 新建图片
+.new-pic-form{
+    dl{
+        margin: 0;
+    }
+    dd,dt{
+        line-height: 1;
+        .ms-font(@auxiliarySize,@auxiliaryColor);
+    }
+    dt{
+        display: inline-block;
+        margin-bottom: 8px;
+    } 
+}

+ 90 - 0
src/main/webapp/static/mweixin/picture-list.less

@@ -0,0 +1,90 @@
+@import "../ms-admin/4.7.0/less/app.less";
+.ms-admin-picture {
+    height: 100%;
+}
+
+//图片列表
+.ms-admin-picture-list {
+    background: #fff;
+    .ms-margin-padding(12px, 14px);
+    display: flex;
+    //单个素材
+    .ms-admin-picture-item {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: flex-start;
+        width: ~'calc(100% - 220px)' !important;
+        &>div {
+            .ms-margin-padding(0 24px 0 0, 10px 10px 0 10px);
+            width: 230px;
+            display: flex;
+            flex-direction: column;
+            border: 1px solid #e6e6e6;
+            border-radius: 4px;
+            .body {
+                display: flex;
+                flex-direction: column;
+                line-height: 2em;
+                div {
+                    margin-top: 0.5em;
+                    display: flex;
+                    align-items: center;
+                    span {
+                        .ms-ellipsis;
+                        .ms-hover;
+                    }
+                }
+                img {
+                    .ms-width-height(100%, 130px);
+                    object-fit: cover;
+                }
+            }
+            .footer {
+                display: flex;
+                padding: 14px 0;
+                i {
+                    color: @contentColor;
+                    margin: auto;
+                    .ms-hover;
+                }
+                em {
+                    .ms-width-height(1px, 1em);
+                    background: #e6e6e6;
+                }
+            }
+        }
+    }
+    .ms-admin-picture-show {
+        min-width: 220px;
+        height: 100%;
+        .ms-margin-padding(-14px 0, 14px);
+        border-left: 1px solid #e6e6e6;
+        &>span {
+            padding: 10px;
+            display: flex;
+            background: #f2f2f6;
+            font-weight: bold;
+        }
+        &>div {
+            .ms-align-center;
+            padding: 10px;
+            font-size: 14px;
+            span {
+                margin-right: auto;
+            }
+            i {
+                .ms-hover;
+                margin-left: 10px;
+                cursor: pointer;
+            }
+        }
+        &>p {
+            margin: 0;
+            padding: 10px;
+            border: 1px solid #e6e6e6;
+            .ms-flex(center);
+            align-items: center;
+            .ms-hover;
+        }
+    }
+}