# drawer

**Repository Path**: lvjianzhao/drawer

## Basic Information

- **Project Name**: drawer
- **Description**: xxxxxxxxxxxx
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-07-16
- **Last Updated**: 2024-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

<h1 align="center" style="margin: 30px 0 30px; font-weight: bold;">Drawer</h1>
<h4 align="center">基于Gin+Vue3前后端分离的蜂巢客户管理系统</h4>

## 平台简介

* 前端技术栈 TypeScript、Vue3、Element-Plus、Vite、Pinia
* 后端技术栈 Golang、Gin、Gorm、MySQL、Redis、Casbin

## 平台使命
将数据蜂巢客户的一切信息，进行统一管理，实现数据共享。

## 内置功能
### 基础功能
- 权限管理：基于`jwt`和`casbin`实现的权限管理。
- 用户管理：系统管理员分配用户角色和角色权限。
- 角色管理：创建权限控制的主要对象，可以给角色分配不同api权限和菜单权限。
- 菜单管理：实现用户动态菜单配置，实现不同角色不同菜单。
- api管理：不同用户可调用的api接口的权限不同。

### 平台功能
- 客户维保、环境、反馈的漏洞、文件及历史事件信息管理
- license的创建、重新生成及详情管理
- 基于所有数据的数据分析


## 运行

默认账号密码

admin/123.com

克隆项目
`git clone ssh://git@bt.baishancloud.com:7999/data/drawer.git`

切换至dev分支


### 数据库
将`backend/initialize/init_drawer.sql`文件导入到mysql数据库中。


### 前端

```bash
# 配置
1. 一键安装 .vscode 目录中推荐的插件
2. node 版本 18+
3. pnpm 版本 8.x

# 进入项目目录
cd web

# 安装依赖
pnpm i

# 启动服务
pnpm dev

# 预览预发布环境
pnpm preview:stage

# 预览正式环境
pnpm preview:prod

# 构建预发布环境
pnpm build:stage

# 构建正式环境
pnpm build:prod

# 代码格式化
pnpm lint
```

### 后端

```bash
# 配置
1. Go >= 1.19

# 进入backend文件夹
cd backend

# 使用 go mod 并安装go依赖包
go generate

# 本地运行
go run main.go serve

# 编译 
go build -o server main.go (windows编译命令为go build -o server.exe main.go )
# 运行二进制
./server serve (windows运行命令为 server.exe serve)
```


## 上线流程

dev分支开发-------->Pick至master分支后打tag，Jenkins自动构建镜像。构建完成后，手动部署到开发（172.18.157.91）和正式环境（10.102.195.87）。

部署步骤：

1、登录到目标机器，按照如下命令进行执行

```shell
$ vim /etc/systemd/system/orchsym-drawer.service          # 修改tag
$ restartdrawer            # 通过命令别名，重启服务容器

# 查看日志
$ docker logs -f orchsym-drawer
```

## FAQ

### 如何新增一个菜单？

新增一级菜单：

![](./img/p1.png)

前端组件路径处必须填写 Layout
![](./img/p2.png)

### 如何新增一个二级菜单？
1、选择父节点
2、自定义路由名称和路由路径
3、指定前端组件路径，以views/作为根目录，比如 `views/customer/env/index.vue`，那么只填写`customer/env/index.vue`即可
![](./img/p3.png)

### license有新增的权限字段应该怎么做？

#### 管理平台

假如现在管理平台要新增一个审批管理权限，分别有 显示审批菜单管理、审批流程、审批待办。

1、找到`src/views/license/components/permissionSetting/dict.ts`中的`LICENSEENTRIES`，新增JSON字段如下（前端渲染时会按顺序渲染）：

``` json
  {
    label: "审批管理",
    value: "approve",
    menubar: [],
    submenu: [
      {
        label: "审批管理",
        value: "approve",
        permissions: [
          { label: "显示审批管理菜单", value: "read" },
          { label: "审批流程", value: "flow" },
          { label: "审批待办", value: "todo" }
        ]
      }
    ]
  },
```

2、同文件中的`licenseChildKeys`增加如下：

```json
# key是LICENSEENTRIES.submenu.value，value是LICENSEENTRIES.submenu.value.permissions列表中所有的value)
approve: ["read", "flow", "todo"],
```

3、同文件中的`allCheckedKeys.orchsym`增加如下(主要是为了点击全选按钮时，将allCheckedKeys.orchsym中的值赋值给所有复选框)：

```json
# key是LICENSEENTRIES.submenu.value，value是LICENSEENTRIES.submenu.value.permissions列表中所有的value)
approve: ["read", "flow", "todo"],
```

4、`src/views/license/components/permissionSetting/index.vue`中新增`defaultCheckList`中的内容：

```json
# 数组中可以填写默认选中的复选框，比如 approve: ["read"],表示默认选中  显示审批管理菜单  这个复选框，还可以填写flow、todo
approve: [],
```



5、最终效果如下：
![](./img/p4.png)







#### 编排平台

假设编排平台现在要新增一个权限字段：集成管理，分别有：显示集成管理菜单、显示管理平台入口、显示API开放平台入口

1、找到`src/views/license/components/permissionSetting/dict.ts`中的`RUNTIMELICENSEENTRIES`，新增JSON字段如下（前端渲染时会按顺序渲染）：

```json
  {
    submenu: [
      {
        label: "集成管理",
        value: "integrationManage",
        permissions: [
          { label: "显示集成管理菜单", value: "display" },
          { label: "显示管理平台入口", value: "orchsymWeb" },
          { label: "显示API开放平台入口", value: "orchsymApi" }
        ]
      }
    ]
  }
```



2、`src/views/license/components/permissionSetting/index.vue`中新增`runtimeDefaultCheckList`中的内容：

```json
# 数组中的值表示默认选中的选项
integrationManage: ["display", "orchsymWeb", "orchsymApi"]
```

3、同文件中的`allCheckedKeys.runtime`增加如下(主要是为了点击全选按钮时，将allCheckedKeys.orchsym中的值赋值给所有复选框)：

```json
# key是LICENSEENTRIES.submenu.value，value是LICENSEENTRIES.submenu.value.permissions列表中所有的value)
integrationManage: ["display", "orchsymWeb", "orchsymApi"],
```


4、最终效果如下：

![](./img/p5.png)


#### 配置中心

略，同编排平台。





## 参考项目

- [TD27-admin](https://github.com/pddzl/td27-admin)
- [v3-admin-vite](https://github.com/un-pany/v3-admin-vite)

## 参考文档
- [MarkDown编辑器](https://github.com/code-farmer-i/vue-markdown-editor)
- [vxe-table](https://vxetable.cn)