作者 RuoYi

调整默认首页

1 <template> 1 <template>
2 - <div class="dashboard-editor-container"> 2 + <div class="app-container home">
  3 + <el-row :gutter="20">
  4 + <el-col :sm="24" :lg="24">
  5 + <blockquote class="text-warning" style="font-size: 14px">
  6 + 领取阿里云通用云产品1888优惠券
  7 + <br />
  8 + <el-link
  9 + href="https://www.aliyun.com/minisite/goods?userCode=brki8iof"
  10 + type="primary"
  11 + target="_blank"
  12 + >https://www.aliyun.com/minisite/goods?userCode=brki8iof</el-link
  13 + >
  14 + <br />
  15 + 领取腾讯云通用云产品2860优惠券
  16 + <br />
  17 + <el-link
  18 + href="https://cloud.tencent.com/redirect.php?redirect=1025&cps_key=198c8df2ed259157187173bc7f4f32fd&from=console"
  19 + type="primary"
  20 + target="_blank"
  21 + >https://cloud.tencent.com/redirect.php?redirect=1025&cps_key=198c8df2ed259157187173bc7f4f32fd&from=console</el-link
  22 + >
  23 + <br />
  24 + 阿里云服务器折扣区
  25 + <el-link href="http://aly.ruoyi.vip" type="primary" target="_blank"
  26 + >>☛☛点我进入☚☚</el-link
  27 + >
  28 + &nbsp;&nbsp;&nbsp; 腾讯云服务器秒杀区
  29 + <el-link href="http://txy.ruoyi.vip" type="primary" target="_blank"
  30 + >>☛☛点我进入☚☚</el-link
  31 + ><br />
  32 + <h4 class="text-danger">
  33 + 云产品通用红包,可叠加官网常规优惠使用。(仅限新用户)
  34 + </h4>
  35 + </blockquote>
3 36
4 - <panel-group @handleSetLineChartData="handleSetLineChartData" />  
5 -  
6 - <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">  
7 - <line-chart :chart-data="lineChartData" /> 37 + <hr />
  38 + </el-col>
8 </el-row> 39 </el-row>
  40 + <el-row :gutter="20">
  41 + <el-col :sm="24" :lg="12" style="padding-left: 20px">
  42 + <h2>若依后台管理框架</h2>
  43 + <p>
  44 + 一直想做一款后台管理系统,看了很多优秀的开源项目但是发现没有合适自己的。于是利用空闲休息时间开始自己写一套后台系统。如此有了若依管理系统。,她可以用于所有的Web应用程序,如网站管理后台,网站会员中心,CMS,CRM,OA等等,当然,您也可以对她进行深度定制,以做出更强系统。所有前端后台代码封装过后十分精简易上手,出错概率低。同时支持移动客户端访问。系统会陆续更新一些实用功能。
  45 + </p>
  46 + <p>
  47 + <b>当前版本:</b> <span>v{{ version }}</span>
  48 + </p>
  49 + <p>
  50 + <el-tag type="danger">&yen;免费开源</el-tag>
  51 + </p>
  52 + <p>
  53 + <el-button
  54 + type="primary"
  55 + size="mini"
  56 + icon="el-icon-cloudy"
  57 + plain
  58 + @click="goTarget('https://gitee.com/y_project/RuoYi-Vue')"
  59 + >访问码云</el-button
  60 + >
  61 + <el-button
  62 + size="mini"
  63 + icon="el-icon-s-home"
  64 + plain
  65 + @click="goTarget('http://ruoyi.vip')"
  66 + >访问主页</el-button
  67 + >
  68 + </p>
  69 + </el-col>
9 70
10 - <el-row :gutter="32">  
11 - <el-col :xs="24" :sm="24" :lg="8">  
12 - <div class="chart-wrapper">  
13 - <raddar-chart />  
14 - </div> 71 + <el-col :sm="24" :lg="12" style="padding-left: 50px">
  72 + <el-row>
  73 + <el-col :span="12">
  74 + <h2>技术选型</h2>
  75 + </el-col>
  76 + </el-row>
  77 + <el-row>
  78 + <el-col :span="6">
  79 + <h4>后端技术</h4>
  80 + <ul>
  81 + <li>SpringBoot</li>
  82 + <li>Spring Security</li>
  83 + <li>JWT</li>
  84 + <li>MyBatis</li>
  85 + <li>Druid</li>
  86 + <li>Fastjson</li>
  87 + <li>...</li>
  88 + </ul>
  89 + </el-col>
  90 + <el-col :span="6">
  91 + <h4>前端技术</h4>
  92 + <ul>
  93 + <li>Vue</li>
  94 + <li>Vuex</li>
  95 + <li>Element-ui</li>
  96 + <li>Axios</li>
  97 + <li>Sass</li>
  98 + <li>Quill</li>
  99 + <li>...</li>
  100 + </ul>
  101 + </el-col>
  102 + </el-row>
15 </el-col> 103 </el-col>
16 - <el-col :xs="24" :sm="24" :lg="8">  
17 - <div class="chart-wrapper">  
18 - <pie-chart />  
19 - </div> 104 + </el-row>
  105 + <el-divider />
  106 + <el-row :gutter="20">
  107 + <el-col :xs="24" :sm="24" :md="12" :lg="8">
  108 + <el-card class="update-log">
  109 + <div slot="header" class="clearfix">
  110 + <span>联系信息</span>
  111 + </div>
  112 + <div class="body">
  113 + <p>
  114 + <i class="el-icon-s-promotion"></i> 官网:<el-link
  115 + href="http://www.ruoyi.vip"
  116 + target="_blank"
  117 + >http://www.ruoyi.vip</el-link
  118 + >
  119 + </p>
  120 + <p>
  121 + <i class="el-icon-user-solid"></i> QQ群:<s>满937441</s>
  122 + <s>满887144332</s> <s>满180251782</s>
  123 + <a href="https://jq.qq.com/?_wv=1027&k=4WWwqNxN" target="_blank"
  124 + > 104180207</a
  125 + >
  126 + </p>
  127 + <p>
  128 + <i class="el-icon-chat-dot-round"></i> 微信:<a
  129 + href="javascript:;"
  130 + >/ *若依</a
  131 + >
  132 + </p>
  133 + <p>
  134 + <i class="el-icon-money"></i> 支付宝:<a
  135 + href="javascript:;"
  136 + class="支付宝信息"
  137 + >/ *若依</a
  138 + >
  139 + </p>
  140 + </div>
  141 + </el-card>
  142 + </el-col>
  143 + <el-col :xs="24" :sm="24" :md="12" :lg="8">
  144 + <el-card class="update-log">
  145 + <div slot="header" class="clearfix">
  146 + <span>更新日志</span>
  147 + </div>
  148 + <el-collapse accordion>
  149 + <el-collapse-item title="v3.2.0 - 2020-10-10">
  150 + <ol>
  151 + <li>升级springboot版本到2.1.17 提升安全性</li>
  152 + <li>升级oshi到最新版本v5.2.5</li>
  153 + <li>升级druid到最新版本v1.2.1</li>
  154 + <li>升级jjwt到版本0.9.1</li>
  155 + <li>升级fastjson到最新版1.2.74</li>
  156 + <li>修改sass为node-sass,避免el-icon图标乱码</li>
  157 + <li>代码生成支持同步数据库</li>
  158 + <li>代码生成支持富文本控件</li>
  159 + <li>代码生成页面时不忽略remark属性</li>
  160 + <li>代码生成添加select必填选项</li>
  161 + <li>Excel导出类型NUMERIC支持精度浮点类型</li>
  162 + <li>Excel导出targetAttr优化获取值,防止get方法不规范</li>
  163 + <li>Excel注解支持自动统计数据总和</li>
  164 + <li>Excel注解支持设置BigDecimal精度&舍入规则</li>
  165 + <li>菜单&数据权限新增(展开/折叠 全选/全不选 父子联动)</li>
  166 + <li>允许用户分配到部门父节点</li>
  167 + <li>菜单新增是否缓存keep-alive</li>
  168 + <li>表格操作列间距调整</li>
  169 + <li>限制系统内置参数不允许删除</li>
  170 + <li>富文本组件优化,支持自定义高度&图片冲突问题</li>
  171 + <li>富文本工具栏样式对齐</li>
  172 + <li>导入excel整形值校验优化</li>
  173 + <li>修复页签关闭所有时固定标签路由不刷新问题</li>
  174 + <li>表单构建布局型组件新增按钮</li>
  175 + <li>左侧菜单文字过长显示省略号</li>
  176 + <li>修正根节点为子部门时,树状结构显示问题</li>
  177 + <li>修正调用目标字符串最大长度</li>
  178 + <li>修正菜单提示信息错误</li>
  179 + <li>修正定时任务执行一次权限标识</li>
  180 + <li>修正数据库字符串类型nvarchar</li>
  181 + <li>优化递归子节点</li>
  182 + <li>优化数据权限判断</li>
  183 + <li>其他细节优化</li>
  184 + </ol>
  185 + </el-collapse-item>
  186 +
  187 + <el-collapse-item title="v3.1.0 - 2020-08-13">
  188 + <ol>
  189 + <li>表格工具栏右侧添加刷新&显隐查询组件</li>
  190 + <li>后端支持CORS跨域请求</li>
  191 + <li>代码生成支持选择上级菜单</li>
  192 + <li>代码生成支持自定义路径</li>
  193 + <li>代码生成支持复选框</li>
  194 + <li>Excel导出导入支持dictType字典类型</li>
  195 + <li>Excel支持分割字符串组内容</li>
  196 + <li>验证码类型支持(数组计算、字符验证)</li>
  197 + <li>升级vue-cli版本到4.4.4</li>
  198 + <li>修改 node-sass 为 dart-sass</li>
  199 + <li>表单类型为Integer/Long设置整形默认值</li>
  200 + <li>代码生成器默认mapper路径与默认mapperScan路径不一致</li>
  201 + <li>优化防重复提交拦截器</li>
  202 + <li>优化上级菜单不能选择自己</li>
  203 + <li>修复角色的权限分配后,未实时生效问题</li>
  204 + <li>修复在线用户日志记录类型</li>
  205 + <li>修复富文本空格和缩进保存后不生效问题</li>
  206 + <li>修复在线用户判断逻辑</li>
  207 + <li>唯一限制条件只返回单条数据</li>
  208 + <li>添加获取当前的环境配置方法</li>
  209 + <li>超时登录后页面跳转到首页</li>
  210 + <li>全局异常状态汉化拦截处理</li>
  211 + <li>HTML过滤器改为将html转义</li>
  212 + <li>检查字符支持小数点&降级改成异常提醒</li>
  213 + <li>其他细节优化</li>
  214 + </ol>
  215 + </el-collapse-item>
  216 +
  217 + <el-collapse-item title="v3.0.0 - 2020-07-20">
  218 + <ol>
  219 + <li>单应用调整为多模块项目</li>
  220 + <li>升级element-ui版本到2.13.2</li>
  221 + <li>删除babel,提高编译速度。</li>
  222 + <li>新增菜单默认主类目</li>
  223 + <li>编码文件名修改为uuid方式</li>
  224 + <li>定时任务cron表达式验证</li>
  225 + <li>角色权限修改时已有权限未自动勾选异常修复</li>
  226 + <li>防止切换权限用户后登录出现404</li>
  227 + <li>Excel支持sort导出排序</li>
  228 + <li>创建用户不允许选择超级管理员角色</li>
  229 + <li>修复代码生成导入表结构出现异常页面不提醒问题</li>
  230 + <li>修复代码生成点击多次表修改数据不变化的问题</li>
  231 + <li>修复头像上传成功二次打开无法改变裁剪框大小和位置问题</li>
  232 + <li>修复布局为small者mini用户表单显示错位问题</li>
  233 + <li>修复热部署导致的强换异常问题</li>
  234 + <li>修改用户管理复选框宽度,防止部分浏览器出现省略号</li>
  235 + <li>IpUtils工具,清除Xss特殊字符,防止Xff注入攻击</li>
  236 + <li>生成domain 如果是浮点型 统一用BigDecimal</li>
  237 + <li>定时任务调整label-width,防止部署出现错位</li>
  238 + <li>调整表头固定列默认样式</li>
  239 + <li>代码生成模板调整,字段为String并且必填则加空串条件</li>
  240 + <li>代码生成字典Integer/Long使用parseInt</li>
  241 + <li>
  242 + 修复dict_sort不可update为0的问题&查询返回增加dict_sort升序排序
  243 + </li>
  244 + <li>修正岗位导出权限注解</li>
  245 + <li>禁止加密密文返回前端</li>
  246 + <li>修复代码生成页面中的查询条件创建时间未生效的问题</li>
  247 + <li>修复首页搜索菜单外链无法点击跳转问题</li>
  248 + <li>修复菜单管理选择图标,backspace删除时不过滤数据</li>
  249 + <li>用户管理部门分支节点不可检查&显示计数</li>
  250 + <li>数据范围过滤属性调整</li>
  251 + <li>其他细节优化</li>
  252 + </ol>
  253 + </el-collapse-item>
  254 +
  255 + <el-collapse-item title="v2.3.0 - 2020-06-01">
  256 + <ol>
  257 + <li>升级fastjson到最新版1.2.70 修复高危安全漏洞</li>
  258 + <li>dev启动默认打开浏览器</li>
  259 + <li>vue-cli使用默认source-map</li>
  260 + <li>slidebar eslint报错优化</li>
  261 + <li>当tags-view滚动关闭右键菜单</li>
  262 + <li>字典管理添加缓存读取</li>
  263 + <li>参数管理支持缓存操作</li>
  264 + <li>支持一级菜单(和主页同级)在main区域显示</li>
  265 + <li>限制外链地址必须以http(s)开头</li>
  266 + <li>tagview & sidebar 主题颜色与element ui(全局)同步</li>
  267 + <li>修改数据源类型优先级,先根据方法,再根据类</li>
  268 + <li>支持是否需要设置token属性,自定义返回码消息。</li>
  269 + <li>swagger请求前缀加入配置。</li>
  270 + <li>登录地点设置内容过长则隐藏显示</li>
  271 + <li>修复定时任务执行一次按钮后不提示消息问题</li>
  272 + <li>修改上级部门(选择项排除本身和下级)</li>
  273 + <li>通用http发送方法增加参数 contentType 编码类型</li>
  274 + <li>更换IP地址查询接口</li>
  275 + <li>修复页签变量undefined</li>
  276 + <li>添加校验部门包含未停用的子部门</li>
  277 + <li>修改定时任务详情下次执行时间日期显示错误</li>
  278 + <li>角色管理查询设置默认排序字段</li>
  279 + <li>swagger添加enable参数控制是否启用</li>
  280 + <li>只对json类型请求构建可重复读取inputStream的request</li>
  281 + <li>修改代码生成字典字段int类型没有自动选中问题</li>
  282 + <li>vuex用户名取值修正</li>
  283 + <li>表格树模板去掉多余的)</li>
  284 + <li>代码生成序号修正</li>
  285 + <li>全屏情况下不调整上外边距</li>
  286 + <li>代码生成Date字段添加默认格式</li>
  287 + <li>用户管理角色选择权限控制</li>
  288 + <li>修复路由懒加载报错问题</li>
  289 + <li>模板sql.vm添加菜单状态</li>
  290 + <li>设置用户名称不能修改</li>
  291 + <li>dialog添加append-to-body属性,防止ie遮罩</li>
  292 + <li>菜单区分状态和显示隐藏功能</li>
  293 + <li>升级fastjson到最新版1.2.68 修复安全加固</li>
  294 + <li>修复代码生成如果选择字典类型缺失逗号问题</li>
  295 + <li>登录请求params更换为data,防止暴露url</li>
  296 + <li>日志返回时间格式处理</li>
  297 + <li>添加handle控制允许拖动的元素</li>
  298 + <li>布局设置点击扩大范围</li>
  299 + <li>代码生成列属性排序查询</li>
  300 + <li>代码生成列支持拖动排序</li>
  301 + <li>修复时间格式不支持ios问题</li>
  302 + <li>表单构建添加父级class,防止冲突</li>
  303 + <li>定时任务并发属性修正</li>
  304 + <li>角色禁用&菜单隐藏不查询权限</li>
  305 + <li>其他细节优化</li>
  306 + </ol>
  307 + </el-collapse-item>
  308 +
  309 + <el-collapse-item title="v2.2.0 - 2020-03-18">
  310 + <ol>
  311 + <li>系统监控新增定时任务功能</li>
  312 + <li>添加一个打包Web工程bat</li>
  313 + <li>修复页签鼠标滚轮按下的时候,可以关闭不可关闭的tag</li>
  314 + <li>修复点击退出登录有时会无提示问题</li>
  315 + <li>修复防重复提交注解无效问题</li>
  316 + <li>修复通知公告批量删除异常问题</li>
  317 + <li>添加菜单时路由地址必填限制</li>
  318 + <li>代码生成字段描述可编辑</li>
  319 + <li>修复用户修改个人信息导致缓存不过期问题</li>
  320 + <li>个人信息创建时间获取正确属性值</li>
  321 + <li>操作日志详细显示正确类型</li>
  322 + <li>导入表单击行数据时选中对应的复选框</li>
  323 + <li>批量替换表前缀逻辑调整</li>
  324 + <li>固定重定向路径表达式</li>
  325 + <li>升级element-ui版本到2.13.0</li>
  326 + <li>操作日志排序调整</li>
  327 + <li>修复charts切换侧边栏或者缩放窗口显示bug</li>
  328 + <li>其他细节优化</li>
  329 + </ol>
  330 + </el-collapse-item>
  331 +
  332 + <el-collapse-item title="v2.1.0 - 2020-02-24">
  333 + <ol>
  334 + <li>新增表单构建</li>
  335 + <li>代码生成支持树表结构</li>
  336 + <li>新增用户导入</li>
  337 + <li>修复动态加载路由页面刷新问题</li>
  338 + <li>修复地址开关无效问题</li>
  339 + <li>汉化错误提示页面</li>
  340 + <li>代码生成已知问题修改</li>
  341 + <li>修复多数据源下配置关闭出现异常处理</li>
  342 + <li>添加HTML过滤器,用于去除XSS漏洞隐患</li>
  343 + <li>修复上传头像控制台出现异常</li>
  344 + <li>修改用户管理分页不正确的问题</li>
  345 + <li>修复验证码记录提示错误</li>
  346 + <li>修复request.js缺少Message引用</li>
  347 + <li>修复表格时间为空出现的异常</li>
  348 + <li>添加Jackson日期反序列化时区配置</li>
  349 + <li>调整根据用户权限加载菜单数据树形结构</li>
  350 + <li>调整成功登陆不恢复按钮,防止多次点击</li>
  351 + <li>修改用户个人资料同步缓存信息</li>
  352 + <li>修复页面同时出现el-upload和Editor不显示处理</li>
  353 + <li>修复在角色管理页修改菜单权限偶尔未选中问题</li>
  354 + <li>配置文件新增redis密码属性</li>
  355 + <li>设置mybatis全局的配置文件</li>
  356 + <li>其他细节优化</li>
  357 + </ol>
  358 + </el-collapse-item>
  359 +
  360 + <el-collapse-item title="v2.0.0 - 2019-12-02">
  361 + <ol>
  362 + <li>新增代码生成</li>
  363 + <li>新增@RepeatSubmit注解,防止重复提交</li>
  364 + <li>新增菜单主目录添加/删除操作</li>
  365 + <li>日志记录过滤特殊对象,防止转换异常</li>
  366 + <li>修改代码生成路由脚本错误</li>
  367 + <li>用户上传头像实时同步缓存,无需重新登录</li>
  368 + <li>调整切换页签后不重新加载数据</li>
  369 + <li>添加jsencrypt实现参数的前端加密</li>
  370 + <li>系统退出删除用户缓存记录</li>
  371 + <li>其他细节优化</li>
  372 + </ol>
  373 + </el-collapse-item>
  374 + <el-collapse-item title="v1.1.0 - 2019-11-11">
  375 + <ol>
  376 + <li>新增在线用户管理</li>
  377 + <li>新增按钮组功能实现(批量删除、导出、清空)</li>
  378 + <li>新增查询条件重置按钮</li>
  379 + <li>新增Swagger全局Token配置</li>
  380 + <li>新增后端参数校验</li>
  381 + <li>修复字典管理页面的日期查询异常</li>
  382 + <li>修改时间函数命名防止冲突</li>
  383 + <li>去除菜单上级校验,默认为顶级</li>
  384 + <li>修复用户密码无法修改问题</li>
  385 + <li>修复菜单类型为按钮时不显示权限标识</li>
  386 + <li>其他细节优化</li>
  387 + </ol>
  388 + </el-collapse-item>
  389 + <el-collapse-item title="v1.0.0 - 2019-10-08">
  390 + <ol>
  391 + <li>若依前后端分离系统正式发布</li>
  392 + </ol>
  393 + </el-collapse-item>
  394 + </el-collapse>
  395 + </el-card>
20 </el-col> 396 </el-col>
21 - <el-col :xs="24" :sm="24" :lg="8">  
22 - <div class="chart-wrapper">  
23 - <bar-chart />  
24 - </div> 397 + <el-col :xs="24" :sm="24" :md="12" :lg="8">
  398 + <el-card class="update-log">
  399 + <div slot="header" class="clearfix">
  400 + <span>捐赠支持</span>
  401 + </div>
  402 + <div class="body">
  403 + <img
  404 + src="https://oscimg.oschina.net/oscnet/up-d6695f82666e5018f715c41cb7ee60d3b73.png"
  405 + alt="donate"
  406 + width="100%"
  407 + />
  408 + <span style="display: inline-block; height: 30px; line-height: 30px"
  409 + >你可以请作者喝杯咖啡表示鼓励</span
  410 + >
  411 + </div>
  412 + </el-card>
25 </el-col> 413 </el-col>
26 </el-row> 414 </el-row>
27 -  
28 -  
29 </div> 415 </div>
30 </template> 416 </template>
31 417
32 <script> 418 <script>
33 -import PanelGroup from './dashboard/PanelGroup'  
34 -import LineChart from './dashboard/LineChart'  
35 -import RaddarChart from './dashboard/RaddarChart'  
36 -import PieChart from './dashboard/PieChart'  
37 -import BarChart from './dashboard/BarChart'  
38 -  
39 -const lineChartData = {  
40 - newVisitis: {  
41 - expectedData: [100, 120, 161, 134, 105, 160, 165],  
42 - actualData: [120, 82, 91, 154, 162, 140, 145]  
43 - },  
44 - messages: {  
45 - expectedData: [200, 192, 120, 144, 160, 130, 140],  
46 - actualData: [180, 160, 151, 106, 145, 150, 130]  
47 - },  
48 - purchases: {  
49 - expectedData: [80, 100, 121, 104, 105, 90, 100],  
50 - actualData: [120, 90, 100, 138, 142, 130, 130]  
51 - },  
52 - shoppings: {  
53 - expectedData: [130, 140, 141, 142, 145, 150, 160],  
54 - actualData: [120, 82, 91, 154, 162, 140, 130]  
55 - }  
56 -}  
57 -  
58 export default { 419 export default {
59 - name: 'Index',  
60 - components: {  
61 - PanelGroup,  
62 - LineChart,  
63 - RaddarChart,  
64 - PieChart,  
65 - BarChart  
66 - }, 420 + name: "index",
67 data() { 421 data() {
68 return { 422 return {
69 - lineChartData: lineChartData.newVisitis  
70 - } 423 + // 版本号
  424 + version: "3.2.0",
  425 + };
71 }, 426 },
72 methods: { 427 methods: {
73 - handleSetLineChartData(type) {  
74 - this.lineChartData = lineChartData[type]  
75 - }  
76 - }  
77 -} 428 + goTarget(href) {
  429 + window.open(href, "_blank");
  430 + },
  431 + },
  432 +};
78 </script> 433 </script>
79 434
80 -<style lang="scss" scoped>  
81 -.dashboard-editor-container {  
82 - padding: 32px;  
83 - background-color: rgb(240, 242, 245);  
84 - position: relative; 435 +<style scoped lang="scss">
  436 +.home {
  437 + blockquote {
  438 + padding: 10px 20px;
  439 + margin: 0 0 20px;
  440 + font-size: 17.5px;
  441 + border-left: 5px solid #eee;
  442 + }
  443 + hr {
  444 + margin-top: 20px;
  445 + margin-bottom: 20px;
  446 + border: 0;
  447 + border-top: 1px solid #eee;
  448 + }
  449 + .col-item {
  450 + margin-bottom: 20px;
  451 + }
  452 +
  453 + ul {
  454 + padding: 0;
  455 + margin: 0;
  456 + }
85 457
86 - .chart-wrapper {  
87 - background: #fff;  
88 - padding: 16px 16px 0;  
89 - margin-bottom: 32px; 458 + font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  459 + font-size: 13px;
  460 + color: #676a6c;
  461 + overflow-x: hidden;
  462 +
  463 + ul {
  464 + list-style-type: none;
90 } 465 }
91 -}  
92 466
93 -@media (max-width:1024px) {  
94 - .chart-wrapper {  
95 - padding: 8px; 467 + h4 {
  468 + margin-top: 0px;
  469 + }
  470 +
  471 + h2 {
  472 + margin-top: 10px;
  473 + font-size: 26px;
  474 + font-weight: 100;
  475 + }
  476 +
  477 + p {
  478 + margin-top: 10px;
  479 +
  480 + b {
  481 + font-weight: 700;
  482 + }
  483 + }
  484 +
  485 + .update-log {
  486 + ol {
  487 + display: block;
  488 + list-style-type: decimal;
  489 + margin-block-start: 1em;
  490 + margin-block-end: 1em;
  491 + margin-inline-start: 0;
  492 + margin-inline-end: 0;
  493 + padding-inline-start: 40px;
  494 + }
96 } 495 }
97 } 496 }
98 </style> 497 </style>
  498 +
  1 +<template>
  2 + <div class="dashboard-editor-container">
  3 +
  4 + <panel-group @handleSetLineChartData="handleSetLineChartData" />
  5 +
  6 + <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
  7 + <line-chart :chart-data="lineChartData" />
  8 + </el-row>
  9 +
  10 + <el-row :gutter="32">
  11 + <el-col :xs="24" :sm="24" :lg="8">
  12 + <div class="chart-wrapper">
  13 + <raddar-chart />
  14 + </div>
  15 + </el-col>
  16 + <el-col :xs="24" :sm="24" :lg="8">
  17 + <div class="chart-wrapper">
  18 + <pie-chart />
  19 + </div>
  20 + </el-col>
  21 + <el-col :xs="24" :sm="24" :lg="8">
  22 + <div class="chart-wrapper">
  23 + <bar-chart />
  24 + </div>
  25 + </el-col>
  26 + </el-row>
  27 +
  28 +
  29 + </div>
  30 +</template>
  31 +
  32 +<script>
  33 +import PanelGroup from './dashboard/PanelGroup'
  34 +import LineChart from './dashboard/LineChart'
  35 +import RaddarChart from './dashboard/RaddarChart'
  36 +import PieChart from './dashboard/PieChart'
  37 +import BarChart from './dashboard/BarChart'
  38 +
  39 +const lineChartData = {
  40 + newVisitis: {
  41 + expectedData: [100, 120, 161, 134, 105, 160, 165],
  42 + actualData: [120, 82, 91, 154, 162, 140, 145]
  43 + },
  44 + messages: {
  45 + expectedData: [200, 192, 120, 144, 160, 130, 140],
  46 + actualData: [180, 160, 151, 106, 145, 150, 130]
  47 + },
  48 + purchases: {
  49 + expectedData: [80, 100, 121, 104, 105, 90, 100],
  50 + actualData: [120, 90, 100, 138, 142, 130, 130]
  51 + },
  52 + shoppings: {
  53 + expectedData: [130, 140, 141, 142, 145, 150, 160],
  54 + actualData: [120, 82, 91, 154, 162, 140, 130]
  55 + }
  56 +}
  57 +
  58 +export default {
  59 + name: 'Index',
  60 + components: {
  61 + PanelGroup,
  62 + LineChart,
  63 + RaddarChart,
  64 + PieChart,
  65 + BarChart
  66 + },
  67 + data() {
  68 + return {
  69 + lineChartData: lineChartData.newVisitis
  70 + }
  71 + },
  72 + methods: {
  73 + handleSetLineChartData(type) {
  74 + this.lineChartData = lineChartData[type]
  75 + }
  76 + }
  77 +}
  78 +</script>
  79 +
  80 +<style lang="scss" scoped>
  81 +.dashboard-editor-container {
  82 + padding: 32px;
  83 + background-color: rgb(240, 242, 245);
  84 + position: relative;
  85 +
  86 + .chart-wrapper {
  87 + background: #fff;
  88 + padding: 16px 16px 0;
  89 + margin-bottom: 32px;
  90 + }
  91 +}
  92 +
  93 +@media (max-width:1024px) {
  94 + .chart-wrapper {
  95 + padding: 8px;
  96 + }
  97 +}
  98 +</style>