网址导航工具

Navigation

npm vue2

导航网址

最近各业务线频繁更换测试环境地址，造成各自业务线不知道最新测试环境、预生产环境地址，新加入开发、产品小伙伴不知道有哪些产品线，项目进展不顺畅。

萌生做一个网址管理工具，让各个业务线负责人，负责管理更新自己测试环境地址、账号、密码，这就诞生了Navigation.

Navigation 下载地址

功能

  • 新增分类
  • 删除分类
  • 编辑分类
  • 查询分类
  • 新增网址
  • 删除网址
  • 编辑网址
  • 查询网址
  • 新建管理员账号、菜单权限
  • 编辑管理员账号、菜单权限
  • 导出xls

【管理员】

img

【访客】

img

开发环境

名称 版本
nodejs 8.11.4
vue 2.X

安装

1.下载Nodejs

http://nodejs.cn/download/

2.安装Nodejs

（1）检查版本

1
node -v

（2）设置淘宝镜像（提升安装速度）

1
npm config set registry http://registry.npm.taobao.org/

如果你已安装Nodejs环境，可跳过1和2步骤

3.安装与使用

（1）服务端

① 打开终端窗口，进入目录/Navigation/server下

1
cd /Navigation/server

② 执行安装

1
npm install

③启动后端

1
node server

img

（2）前端

第一种：你可以直接打开目录下/dist/index.html直接使用，或者将dist放入tomcat的webapp中实现web服务器让其他小伙伴也能通过ip地址访问

第二种：你可以启动开发模式，步骤如下所示。

①再次打开新的终端窗口，进入目录/Navigation下，执行命令行如下命令：

1
cd /Navigation

②安装

  • 安装cnpm

    1
    npm install -g cnpm --registry=https://registry.npm.taobao.org

  • 安装node-sass

    1
    cnpm install node-sass --save

  • 安装

    1
    npm install

③启动前端

1
npm run dev

img

（3）浏览器地址访问

http://localhost:8088

（4）建议，使用另外一种办法是将根目录下/dist整个文件夹放入tomcat中供外网其他人员使用

操作手册

登录管理员

账号：admin
密码：123456

img

访客无需登录，仅有查看权限

新增网页

img

新增分类

img

筛选分类

img

新增账号

img

导出数据

img

修复记录

  • 2020-07-12 修复node-sass版本4.11.0因版本过低导致的报错