Skip to content

konodioda727/Domi-Frontend

Repository files navigation

domi-frontend-v1

采用 react+ts+less+taro 开发的华师换宿小程序

Todo

5.27

  • 修改审核页面,符合设计界面
  • 增加图床接口
  • 增加审核界面搜索接口
  • 虚拟滚动
  • 增加归档

迭代须知

除组件特有逻辑之外,常规配置(如页面跳转和页面标题等)都提出到 config 文件夹中, 简单修改页面内容、跳转直接修改对应 config文件即可, 后续开发仍建议把此类逻辑提出到 config 中, 让组件中只包含主干逻辑,方便修改、重构

components 概述

  1. PageWrap

    PageWrap 为页面组件,配置背景色和上下导航栏 接受参数如下:

    export interface TopBarProps {
      children?: React.ReactElement | string,
      pos: 'left' | 'center' | 'leftWithButton',
    }
    export interface PageWrapProps {
      children?:  React.ReactElement,
      topBarProps: TopBarProps,
      hasNavbar?: boolean
    }
    
  • topbarpropspos为文字摆放位置,leftWithButton 为带返回按钮,
  • hasNavbar为是否带下方navbar,会根据文件在teachers还是tudents自动区分导航栏功能,具体配置见configs中的navbarConfig
  1. ContentField

    大白布,带圆角和阴影和 padding,当 view 用

  2. Input Button

    加了样式的 InputButton,支持自定义,Button自带 100ms 的防抖, Input 没加,可以根据需求加上 throttle(使用 useThrottle 这个 hook

    Button 新增 disable , 和 disabledPrompt 属性, 负责按钮禁用以及禁用弹窗

  3. Login

    老师、辅导员、学生登录的公用组件,接受参数如下:

     export interface LoginProps {
       loginConfigs: LoginConfigType[],
       logoConfigs: LogoProps,
       onRegister?: (...args: any[]) => void,
       onLogin: (...args: any[]) => void
     }
    
     export type LoginConfigType = {
       type: keyof InputProps.Type,
       title: string,
       displayText: string
     }
    
     export interface LogoProps extends Omit<ImageProps, 'src'>{
       size?: 'big' | 'small' | 'medium',
     }
    
    
  • loginConfigs: 登陆页面中输入框的配置
  • logoConfigs: 图标配置,可以调节 small | big | medium 三种大小
  • onRegister: 注册的处理函数,不填即没有注册按钮
  • onLogin: 必填,登录的处理函数

其中,onRegisteronLogin 接受 两个参数, 一个为paramSet, 即各个输入框内容集合,以loginConfigType中的title为属性名, 另一个为clear,是回调函数,负责清除输入框内容

  1. PersonalInfo

    教师学生通用的个人信息页组件,接受参数如下:

    export interface PersonalInfoProps {
       type: 'teacher' | 'student',
       data: {
         name: string,
         ID: string,
         campus: string,
         grade: string
       }
     }
    

    其中,type决定采用哪个config渲染选项条,configpersonalInfo中,如下:

       export const stuPersonalInfoTag:switchCarType[] = ['introduction', 'download', 'feedback', 'exit']
       export const teaPersonalInfoTag:switchCarType[] = ['introduction', 'download', 'feedback', 'exit']
    

更新日志

5 月 19 日

  • 开工,增加登陆接口
  • 合并 ns 分支
  • 重构审核

2 月 12 日

  • 帮 ns 写了signature组件和signature页面,生气 😡
  • 重构了navbar,塞到pageWrap中去了,readme中也把navbar删了,之后要修改直接看NavbarConfig

2 月 8 日

  • 前几天没管,今天赎罪
  • 新增了教师端review页面静态
  • 修改了personalInfo组件使其适应教师和学生两端
  • 合并了能帅的分支和我的,静态就算完工啦,超级开心喔 😀

2 月 3 日

  • 新增了 PersonalInfo 组件,对应教师和学生的个人页面, 但感觉教师端个人页面可能要改,待定,之后可能会删除
  • 增加了 studentPersonalInfo 页面
  • 重构 studentPersonalInfo 页面,把跳转逻辑提到 Config文件夹中
  • Taro.navigateTo 写起来太烦了,简单封装了一下,放在, utils中,目前有 NavRedirect 两个函数,分别对应 Taro.navigateToTaro.redirectTo, 要加其他的自己加

2 月 2 日

  • 增加了 useThrottleuseDebounce 两个 hook
  • 增加了 loginPage
  • 增加了 InputButtonLogin组件,详情见 componnents概述
  • 重构 PageWrapNavBar,将复杂提到配置文件夹 Config
  • 重构 申请界面,将 颜色配置、跳转链接配置等提到配置文件夹 Config