当前位置：网站首页 > IT技术 > 正文

CRM页面改造（crm系统怎么改密码）

wptr33 2025-05-02 21:37 25 浏览

如果使用若依框架项目做为脚手架，那么我们肯定需要在页面显示中，符合自己公司或者项目的标识才行，需要更换的地方很多，我们依次来解决它

浏览器标签页logo标识、标题
系统页面中的logo标识、标题
去除源码地址 & 文档地址
主题风格和菜单图标
登录名称及背景图

3.4.1 浏览器标签页icon

我们可以使用在线把一张图片转换为.icon类型的图片: 网站: https://convertio.co/zh/jpg-ico/ 或者https://ico.un80.cn/

找到下载icon图标，替换admin模块中的static文件夹，删除原有的favicon.ico，把新拷贝过来的logo更名为favicon.ico即可

3.4.2 系统页面中的logo、标题

下载你想要的logo图片，替换admin模块中的static文件夹的ruoyi.png，删除原有的ruoyi.png，把新拷贝过来的logo更名为ruoyi.png即可

3.4.3 去除源码 & 文档

找到admin模块下的templates目录下的index.html,把首页标题ruoyi修改为你的标签

3.4.4 登录页面中标题、背景图

登录名称和背景图，我们可以直接找到登录页面进行修改即可

下载对应的背景图片, 拷贝到img目录, 修改css目录下login.css以及login.min.css文件

3.4.5 左侧菜单修改

3.5 首页实现

我们需要在首页显示一些数据报表，效果图如下：

我们先把crm-admin模块的templates目录下的main.html页面拷贝一份，删除main.html页面的<body>标签的内容,main.html页面的内容如下:

<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!--360浏览器优先以webkit内核解析-->
    <title>首页</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link href="../static/css/bootstrap.min.css" th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/>
    <link href="../static/css/font-awesome.min.css" th:href="@{/css/font-awesome.min.css}" rel="stylesheet"/>
    <link href="../static/css/style.min.css" th:href="@{/css/style.min.css}" rel="stylesheet"/>
</head>

<body class="gray-bg">
<div class="wrapper wrapper-content">
   
</div>
<script th:src="@{/js/jquery.min.js}"></script>
<script th:src="@{/js/bootstrap.min.js}"></script>
<script th:src="@{/ajax/libs/layer/layer.min.js}"></script>

<script type="text/javascript">
   
</script>
</body>
</html>

然后我们查看若依提供的实例演示中报表中的图表组合页面中

选择我们需要的效果，把对应的html代码拷贝到main.html，并修改对应的文本

 <div class="row">
        <div class="col-sm-3">
            <div class="ibox">
                <div class="ibox-content">
                    <h5>新增线索量</h5>
                    <h1 class="no-margins" th:text="${clueCount}">886,200</h1>
                    <div class="stat-percent font-bold text-navy">98% <i class="fa fa-bolt"></i></div>
                    <small>较上日</small>
                </div>
            </div>
        </div>
        <div class="col-sm-3">
            <div class="ibox">
                <div class="ibox-content">
                    <h5>沟通量</h5>
                    <h1 class="no-margins">1738,200</h1>
                    <div class="stat-percent font-bold text-navy">98% <i class="fa fa-bolt"></i></div>
                    <small>较上日</small>
                </div>
            </div>
        </div>
        <div class="col-sm-3">
            <div class="ibox">
                <div class="ibox-content">
                    <h5>订单量</h5>
                    <h1 class="no-margins">200,100</h1>
                    <div class="stat-percent font-bold text-danger">12% <i class="fa fa-level-down"></i></div>
                    <small>较上日</small>
                </div>
            </div>
        </div>
        <div class="col-sm-3">
            <div class="ibox">
                <div class="ibox-content">
                    <h5>退单量</h5>
                    <h1 class="no-margins">54,200</h1>
                    <div class="stat-percent font-bold text-danger">24% <i class="fa fa-level-down"></i></div>
                    <small>较上日</small>
                </div>
            </div>
        </div>
    </div>

后端的实现，我们需要修改admin模块的SysIndexController类的main()方法

 // 系统介绍
@GetMapping("/system/main")
public String main(ModelMap mmap)
{
    mmap.put("version", RuoYiConfig.getVersion());
    return "main";
}

在admin模块的pom.xml文件添加hutool工具依赖

<dependency>
    <groupId>cn.hutool</groupId>
    <artifactId>hutool-all</artifactId>
    <version>5.8.27</version>
</dependency>

添加相关数据查询,并保存到ModelMap中

 @GetMapping("/system/main")
    public String main(ModelMap mmap)
    {
        mmap.put("version", RuoYiConfig.getVersion());
        long todayCount =clueService.selectClueCountByCreateTime(DateUtil.today());
        //统计线索数量
        long yesterdayCount =clueService.selectClueCountByCreateTime(DateUtil.yesterday().toDateStr());
        mmap.put("todayCount",todayCount);
        if(todayCount == 0 && yesterdayCount == 0){
            mmap.put("clueCountRate",0);
        } else if(todayCount != 0 &&  yesterdayCount == 0){
            mmap.put("clueCountRate",100);
        }else{
            mmap.put("clueCountRate",new DecimalFormat("#.00").format((todayCount-yesterdayCount)*100.0/yesterdayCount));
        }


        return "main";
    }

对应的业务层方法

  /**
     * 查询指定日期添加的线索数量
     * @param date
     * @return
     */
    long selectClueCountByCreateTime(String date);

实现类:

 @Override
public long selectClueCountByCreateTime(String date) {
    return clueMapper.selectCountByCreateTime(date);
}

Mapper接口

  /**
     * 查询指定日期添加的线索数量
     * @param date
     * @return
     */
    long selectCountByCreateTime(String date);

sql文件

  <select id="selectCountByCreateTime" resultType="long">
        select count(0) from clue where create_time = #{createTime}
    </select>

需要修改main.html,使用Thymeleaf模块的语法

<div class="ibox-content">
    <h5>新增线索量</h5>
    <h1 class="no-margins" th:text="${todayCount}">886,200</h1>
    <div class="" th:class="${clueCountRate}>0?'stat-percent font-bold  text-danger':'stat-percent font-bold  text-navy'" ><span th:text="${clueCountRate}+'%'">98%</span>
        <i th:class="${clueCountRate}>0?'fa fa-level-up':'fa fa-level-down'" ></i></div>
    <small>较上日</small>
</div>

沟通量,订单量,退单量这三个与新增线索量思路大致一样,这里就不详细讲解, 直接提供代码

thymeleaf是干什么的

上一篇：Spring Boot 自动配置魔法大揭秘（spring boot的自动配置原理）
下一篇：从零开始构建一个高性能的Java Web应用

CRM页面改造（crm系统怎么改密码）

3.4.1 浏览器标签页icon

3.4.2 系统页面中的logo、标题

3.4.3 去除源码 & 文档

3.4.4 登录页面中标题、背景图

3.4.5 左侧菜单修改

3.5 首页实现

相关推荐

程序员的开源月刊《HelloGitHub》第 71 期

如何将AI助手接入微信（打开ai手机助手）

SparkSQL——DataFrame的创建与使用

使用过 Redis 分布式锁么，它是什么回事?

VUE循环语句的使用(v-for)（vuefor循环的key）

HiveOs系统教程最细手把手教学（hiveos启动）

HIVE SQL基础语法（hive-sql）

《循环(for/while)》（循环while语句）

Spring Boot 概述（spring boot干嘛的）

西门子博途SCL高级语言之FOR循环（西门子博途for循环语句编程）