新增：移动端适配

[peryiqiao]

• 新增：菜单移动端适配，新增菜单 mini 版本
• 新增：.env 配置，vite 和 docker 可以读取配置
• 新增： R-NACOS logo
• 优化：About、监控、Cluster、命名空间、无权限、404页面、服务列表、订阅列表、用户列表等页面
• 优化：局部 CSS 全部调整 TailwindCSS
• 优化：引入全局变量，优化手机端判断
• 优化：配置变更页面
• 调整：SubContentFullPage 改为 Vue 版本
• 调整：NamespacePage 改为 Vue 版本
• 更新： Vite 版本
• 移除：未用到的 SubContentPage 页面

[heqingpan]

赞，我后面抽空体验一下，如果没有大的问题就合并，并发布一个版本出来。

[peryiqiao]

赞，我后面抽空体验一下，如果没有大的问题就合并，并发布一个版本出来。

好的，等你合并后我在看看编辑器的验证。大佬 126 邮件还有在用吗？发了一封邮件

[heqingpan]

邮箱还在用的，我去看看。

[heqingpan]

先关注电脑浏览台控制台使用问题

• header 背景颜色换成了白色，与内容页面的title栏是同一个颜色没有区分度，这里应该要有区分度；
• 加了docs中的logo icon,颜色有点不搭；r-nacos没有正式设计过logo，那个是docs中尝试加的，这里如果颜色不搭建议先移除；
• 页面默认有滚动条
• 暂时没能进入移动端模式验证。电脑中打开调式模式，切换到小屏没有触发到移动端模式。

[peryiqiao]

先关注电脑浏览台控制台使用问题

• header 背景颜色换成了白色，与内容页面的title栏是同一个颜色没有区分度，这里应该要有区分度；
• 加了docs中的logo icon,颜色有点不搭；r-nacos没有正式设计过logo，那个是docs中尝试加的，这里如果颜色不搭建议先移除；
• 页面默认有滚动条
• 暂时没能进入移动端模式验证。电脑中打开调式模式，切换到小屏没有触发到移动端模式。

1. 那我把蓝色加回去。
2. ok，那我把logo 去掉。
3. 好的，我调整一下。
4. 小屏尺寸多少？我模拟 14 Pro Max 都可以的。默认会把菜单收起来。

[heqingpan]

第4点，我后面重新验证时菜单确实可以默认收起来，这个点算是没问题。

[peryiqiao]

改了一版再看看

[heqingpan]

这次体验上比上次好了些。

---

1. title区与查询区，占用空间有点多，挤压内容空间，整体看也不规整；
2. title区的命名空间，选择不同的命名空间，位置变化有点奇怪；
3. 对于移动端的样式比之前好很多（之前基本不可用）；不过就PC的样式和体验来看，个人体验后感觉目前比现有的版本差距还是比较明显；
4. 另外我看本次样式从css调整为tailwindcss；因为我之前没有用过tailwindcss，想咨询下这个支持和css共存吗？

[peryiqiao]

这次体验上比上次好了些。

1. title区与查询区，占用空间有点多，挤压内容空间，整体看也不规整；
2. title区的命名空间，选择不同的命名空间，位置变化有点奇怪；
3. 对于移动端的样式比之前好很多（之前基本不可用）；不过就PC的样式和体验来看，个人体验后感觉目前比现有的版本差距还是比较明显；
4. 另外我看本次样式从css调整为tailwindcss；因为我之前没有用过tailwindcss，想咨询下这个支持和css共存吗？

第 1 点是为了在移动端适配的时候把搜索区和查询下加了个 card 卡片样式。查询区的我再调整下，搜索区也会吗？这快就是把搜索栏长度拉长了，比例在移动端是不同的
第 2 点我在优化一下
第 4 是可以的，不过一般样式在 tailwindcss 里边都有。

[peryiqiao]

看看这版行不行

[heqingpan]

体验了下这个版本，大体上没问题：支持移动端，同时pc端的体验变化不大。

目前还有发现一个小点：PC模式下，内容高度独立与布局，其高度会影响页面菜单的效果。

不过问题也不大，也可以考虑先合并后面再调整。

[peryiqiao]

体验了下这个版本，大体上没问题：支持移动端，同时pc端的体验变化不大。

目前还有发现一个小点：PC模式下，内容高度独立与布局，其高度会影响页面菜单的效果。

不过问题也不大，也可以考虑先合并后面再调整。

我数据没有那么多，可以把数据打包一份到我邮箱吗？我在调整一下

[heqingpan]

我可以晚上给你一份数据。

配置数据的话，你也可以到线上演示系统 https://www.bestreven.top/rnacos/ 导出配置数据再导入你本地的系统。

[peryiqiao]

我可以晚上给你一份数据。

配置数据的话，你也可以到线上演示系统 https://www.bestreven.top/rnacos/ 导出配置数据再导入你本地的系统。

密码好像改了，无法登录

[heqingpan]

演示服务dev密码被其它人改了，目前已重新设置回去。

[peryiqiao]

节后愉快呀，全局配置管理有点乱，改的两眼一黑。再看看这版。

[heqingpan]

看了一遍，PC端的功能、交互都没有问题，达到基本的发版条件。

移动端有个小点：进入配置详情后页面不方便退回列表页中。

[peryiqiao]

看了一遍，PC端的功能、交互都没有问题，达到基本的发版条件。

移动端有个小点：进入配置详情后页面不方便退回列表页中。

嗯？我记得下边是有个返回按钮的哩，右上角也有「x」，风格和 PC 一样，只是改了内容的排版

[heqingpan]

不是编辑页是详情页。

我晚上回去再确认一下，到时截个图。

[heqingpan]

具体情况已确认：直接刷新页面是没有问题的，只是打开页面再调整窗口后就有问题。
之前页面没有问题应该是有一个监听窗口后重新计算展示区域大小的逻辑。

[peryiqiao]

明白了，算 bug 吧哈哈哈，修改了下，我把这个功能挪到只有配置页的地方才加载这个计算宽度的功能。尽量减少动态计算的频率。

[heqingpan]

测试调整窗口大小后页面表现，当调整浏览器窗宽度为750x左右，再调大一些（775px)，点击左上角的切换菜单只有遮罩没有显示菜单内容。这时就算刷新页面也无法打开菜单，无法从菜单切换到其它页面。

---

另外补充一下过程中发现的其它问题事项

1. 登陆页的登陆框变大同时完全居中，人个感觉比之前难看一些；（这个影响不大，不影响使用，优化级可放低）

2. 配置对比页，调整后整体样式比之前好看一些，不过有几个要素有些问题；（这个是主要功能之一，会影响用户使用效果）

• 有变更的行数不对齐；
• 有变更的内容没有高亮显示，内容多时不太好区分变更的内容；

调整后的对比：

原来的对比：

---

本周末r-nacos计划发布一个正式版本，如果整体验证没有问题（至少pc版本没有问题），尽量切换到本pr前端版本。

过程如果还有发现问题，我后面会再补充。

[peryiqiao]

测试调整窗口大小后页面表现，当调整浏览器窗宽度为750x左右，再调大一些（775px)，点击左上角的切换菜单只有遮罩没有显示菜单内容。这时就算刷新页面也无法打开菜单，无法从菜单切换到其它页面。

另外补充一下过程中发现的其它问题事项

1. 登陆页的登陆框变大同时完全居中，人个感觉比之前难看一些；（这个影响不大，不影响使用，优化级可放低）

2. 配置对比页，调整后整体样式比之前好看一些，不过有几个要素有些问题；（这个是主要功能之一，会影响用户使用效果）

• 有变更的行数不对齐；
• 有变更的内容没有高亮显示，内容多时不太好区分变更的内容；

调整后的对比：

原来的对比：

本周末r-nacos计划发布一个正式版本，如果整体验证没有问题（至少pc版本没有问题），尽量切换到本pr前端版本。

过程如果还有发现问题，我后面会再补充。
第一点 ok 了，
第二点，我调整了一下。「审美和我不一样哈哈哈」
第三点，老版本的大屏效果比较差，所以我改了一下，并且只是在行号那标出而已。
行数不对齐这问题指的是哪里？我应该逻辑和老版本一样的：
旧：

修改后的这版行不行，可以的话我就提交
新：

[heqingpan]

有变更的行号没有对齐，号外还在看看行号超过100时不同位数的数字会不会错位不对齐。

[heqingpan]

我配置一段代码到配置后变更，发现内容对比展示不正确：

原来的版本是正确的：

你不是只调整样式，还调整了对比逻辑？

[peryiqiao]

我配置一段代码到配置后变更，发现内容对比展示不正确：

原来的版本是正确的：

你不是只调整样式，还调整了对比逻辑？

奇怪我屏幕是 27 寸的，原来的版本上体现的效果和我屏幕上不一样

[peryiqiao]

这是调整后的，你再看看行不行

[heqingpan]

这是调整后的，你再看看行不行

看截图中变更的行数还是没有对齐。

[heqingpan]

目标是本周末可以发版。

如果调整麻烦的话，配置对比页先恢复的原来的版本？

[peryiqiao]

目标是本周末可以发版。

如果调整麻烦的话，配置对比页先恢复的原来的版本？
嗯，我对比原来版本后重新调整了一遍，再看看这个版本。

[heqingpan]

配置对比页调整后上面的问题都解决，不过新发现一个小点：对比配置左右空出了一部分较宽的padding,这里是不是小点让给内容展示会好一些，还有代码右侧没有边线感觉也有点奇怪。

[peryiqiao]

配置对比页调整后上面的问题都解决，不过新发现一个小点：对比配置左右空出了一部分较宽的padding,这里是不是小点让给内容展示会好一些，还有代码右侧没有边线感觉也有点奇怪。

缩小了，这里有个情况，在第 25 行的 border-l-2 如果改成 border-l-1 的话默认是不显示的，是因为加上有移动 sticky 定位导致，为了默认显示我 多加了 1px

[heqingpan]

好的，我晚上回去再看看😃

[heqingpan]

昨天测试没发现什么问题，然后准备打包，这时才发现npm run build报错：

.....
Found 10 errors in 5 files.

Errors  Files
     3  src/layout/index.vue:7
     1  src/layout/components/Menu/index.vue:42
     4  src/components/MoreSetting.vue:89
     1  src/store/modules/projectSetting.ts:8
     1  src/utils/index.ts:7

本次的版本就不带上前端，下次调整好后可以为前端版本单独发新的版本。

[peryiqiao]

昨天测试没发现什么问题，然后准备打包，这时才发现npm run build报错：

.....
Found 10 errors in 5 files.

Errors  Files
     3  src/layout/index.vue:7
     1  src/layout/components/Menu/index.vue:42
     4  src/components/MoreSetting.vue:89
     1  src/store/modules/projectSetting.ts:8
     1  src/utils/index.ts:7

本次的版本就不带上前端，下次调整好后可以为前端版本单独发新的版本。

已经改过，本地验证打包成功。

[heqingpan]

已合并到主干发布新的r-nacos版本:v0.6.16