# hs-ui-component

**Repository Path**: ABCSDSD_123456/hs-ui-component

## Basic Information

- **Project Name**: hs-ui-component
- **Description**: React ui 组件库

- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-07-25
- **Last Updated**: 2024-08-16

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

npm i react-markdown

镜像过期：
npm cache clean --force
npm config set registry https://registry.npmmirror.com 
npm config get registry 查看镜像

权限表(access_list): 
    a_id: 权限 id
    access_name: 权限名称
    status: 状态 1：正常，0：删除

用户表(user_list)：
    id: 用户 id
    username: 用户名
    password: 密码
    a_id：权限等级
    status: 状态 1：正常，0：删除

目录权限配置表(dir_list)：

图标类型表(type_list)（1：icon, 2: note）：
    i_type_id: 类型 id  
    i_type_name: 类型名称
    status: 状态 1：正常，0：删除

图片表(img_list)： 
    img_id: img 的唯一标识符
    type_id: 类型 id
    img_name: img 的名称
    img_url: 图片地址
    status: 状态 1：正常，0：删除

    上传图片 接口：
        前端传递： 
            type: 用于区别上传的是 icon 还是笔记的图片
            上传图片
            img_name: icon 的名称(必填，可重复)
        后端生成：
            img_url: 图标地址
            img_id: icon 的唯一标识符
        数据库语句
            insert into img_list(img_id, type_id, img_name, img_url) values('', '', '', '')

    修改图片 接口：
        和上传图片公用接口，但是需要 传递 img_id

    删除图片 接口：
        前端传递： 点击删除按钮调接口
        后端：
            根据 img_id 修改 status
        数据库语句：
            update img_list set status = 0 where img_id = ''
    
    获取图片 接口：
        获取全部图片列表 接口：
            前端直接调接口
            后台返回全部的 data, 前端 进行处理

        获取指定类型图片列表 接口：
            前端传递： type 类型
            后台返回指定类型的 data, 前端 进行处理

        获取指定图片 接口：
            前端传递： img_id
            后台返回指定 img_id 的 data, 前端 进行处理

        数据库语句：
            select i.img_id as imgId, t.type_name as type, i.img_name as label, i.img_url as url from img_list i join type_list t on t.type_id = i.type_id where i.status = 1 and t.status = 1 and i.type_id = '前端传来的， 没有就为空' and i.img_id = '前端传来的， 没有就为空'


        nid: 'nid_12345798',
        menu: 'vue3',
        title: '如何使用vue3',
        summary: '如何使用vue3详细步骤'，
        content: '1. 安装'，
        creatDateTime： '2024-01-24 15:00:00',
        update_date_time: '2024-01-24 15:00:00',
        public_date_time: '2024-01-24 15:00:00',
        public_status: true

侧边栏目录表(side_menu)：
    key ====> menuid (string  mid_ + 时间戳)
    icon ====> menu icon (图片)
    label ====> menu label (string)
    type ====> menu type (string 笔记还是其他)
    iconType ====> icon type (string svg or 后台文件 or 组件)
    parentId ====> parent menu id (string)

    获取目录 接口
        后端返回一个树结构，前端考虑使用级联选择

    增加目录 接口：
        前端传递： 
            icon: 上传图片 可为空 或 下拉框，返回目前有的 图标
            label: 目录名称
            parentId: 下拉框，值由后端返回（可为空）
        后端生成：
            key 自动生成 格式：mid_ + 时间戳
            status true/false 新增默认为 true

    删除目录 接口:
        前端点击删除按钮，调用此接口
        后端将 status 设为 false

    修改目录 接口：
        和 新增使用一个接口

笔记(note)：
    note_id 文章唯一标识
    title 标题 
    summary 摘要 (技术文章没必要，可为空) 
    content 内容 
    menu_id 放在哪个目录下（用于区别放在哪个目录 目前一对一）
    <!-- note_label_id 文章类型(外键 js/java/node/vue...) -->
    creat_date_time 创建时间（获取当前时间， 不为空）
    update_date_time 更新时间（修改时 获取当前修改时间，不为空，初始值为 创建时间）
    public_date_time 发布时间（更新公开状态时的时间，可为空）
    public_status 公开状态（0：私密  1：公开）
    status 状态（0： 删除  1：有效）
 
    把文章的标题作为目录的 label
    可以根据文章的标题、摘要、内容查找文章
    目前先把内容直接存数据库, 后续再考虑ssr

    获取文章 接口(/user/note/getNoteContent)：
        前端：
            note_id
        返回 noteContent

    获取文章列表 接口（/user/note/getNoteList）
        
    添加文章 接口：
        前端：
            title
            summary
            content
            menu_id 下拉框 获取 目录列表 前端考虑使用级联选择
            public_status

        后端： 
            note_id 格式 art_id_ + 时间戳 
            creat_date_time
            update_date_time
            public_date_time = ''
            state
    
    发布文章 接口： 
        前端：点击 status 按钮调接口
        后端：
            修改 public_status
        数据库语句：
            update note set public_state = ? where note_id = ?

    删除文章 接口：
        前端：点击 删除 按钮调接口
        后端：
            修改 status
        数据库语句：
            update note set status = 0 where note_id = ?

    修改：
        update note set title = ?, summary = ?, content = ?, menu_id = ?, update_date_time = ?, public_status = ?, public_date_time = ? where note_id = ?

主页
  歌曲（手机块）
	 单词（手机块）
	 日常开销（大块、echart）
前端
 html+css+js/ts
	vue2
	vue3
	react18
 微信小程序
 uniapp
后端
	nodejs
	  express
	  koa
	java
	java springboot
	mybatis
英语
	口语
 单词
管理端
	管理文章（有一个分页列表，有下拉框选择 文章类型）
		新增
		修改