xiaji b6704519ec feat(ui): 优化多个页面的UI设计和交互体验
重构公共电子屏、分支机构信息、设备间图片和活动统计页面的UI设计
- 添加渐变背景、阴影和悬停效果提升视觉体验
- 使用图标增强信息展示和交互提示
- 改进表格和卡片布局提高可读性
- 统一各页面的设计风格和交互模式
- 添加CSS组件类支持新的UI效果
2026-01-28 12:30:14 +08:00

分支机构活动管理系统

这是一个基于Django开发的分支机构活动管理系统用于管理公司各分支机构的活动、人员、设备和预算等信息。

功能特点

  • 分支机构管理:维护分支机构的基本信息、联系方式、分类和状态
  • 活动管理:记录分支机构的新建、搬迁、装修、撤销等活动信息
  • 联系人管理:管理各分支机构的联系人信息及分类
  • 设备间图片管理:上传和管理分支机构设备间的图片
  • 图纸管理:上传和管理分支机构相关图纸
  • 预算管理:管理活动预算、设备预算和基础设施预算
  • 终端设备管理:管理视频终端等设备信息
  • 公共屏幕管理:管理分支机构的公共屏幕信息

技术栈

  • 后端框架Django
  • 数据库SQLite
  • 前端技术HTML、CSS、Tailwind CSS
  • 表单处理Django Forms
  • 模板引擎Django Templates

项目结构

fzjgact/
├── fzjgact/           # 项目配置目录
│   ├── __init__.py
│   ├── asgi.py
│   ├── settings.py
│   ├── urls.py
│   └── wsgi.py
├── huodong/           # 主应用目录
│   ├── migrations/    # 数据库迁移文件
│   ├── static/        # 静态资源
│   ├── templates/     # 模板文件
│   ├── templatetags/  # 自定义模板标签
│   ├── __init__.py
│   ├── admin.py       # 后台管理配置
│   ├── apps.py        # 应用配置
│   ├── models.py      # 数据模型
│   ├── serializers.py # 序列化器
│   ├── tests.py       # 测试文件
│   ├── urls.py        # 应用路由
│   └── views.py       # 视图函数
├── db.sqlite3         # 数据库文件
├── manage.py          # Django管理脚本
├── tailwind.config.js # Tailwind CSS配置
└── requirements.txt   # 依赖文件(需创建)

安装和运行

1. 环境要求

  • Python 3.7+
  • Django 3.2+
  • 其他依赖见requirements.txt

2. 安装步骤

  1. 克隆项目

    git clone <项目地址>
    cd 分支机构活动
    
  2. 创建虚拟环境

    python -m venv venv
    
  3. 激活虚拟环境

    • Windows:
      venv\Scripts\activate
      
    • Linux/Mac:
      source venv/bin/activate
      
  4. 安装依赖

    pip install -r requirements.txt
    
  5. 初始化数据库

    cd fzjgact
    python manage.py migrate
    
  6. 创建超级用户

    python manage.py createsuperuser
    
  7. 启动开发服务器

    python manage.py runserver
    

3. 访问系统

使用说明

后台管理

  1. 使用超级用户登录后台管理界面
  2. 可以管理以下模块:
    • 分支机构信息
    • 联系人管理
    • 活动记录
    • 设备间图片
    • 图纸管理
    • 预算信息
    • 公共屏幕
    • 视频终端

前端功能

  1. 分支机构列表:查看所有分支机构信息
  2. 分支机构详情:查看分支机构的详细信息、联系人、活动等
  3. 设备间图片:查看分支机构设备间的图片
  4. 公共屏幕:查看公共屏幕信息
  5. 视频终端:查看视频终端信息
  6. 统计信息:查看系统统计数据

自定义命令

  • randomize_background_color:为分支机构随机生成背景颜色

开发说明

Tailwind CSS

项目使用Tailwind CSS进行样式开发

  1. 配置文件:tailwind.config.js
  2. 启动Tailwind开发服务器
    ./tailwindcss-windows-x64.exe -i ./huodong/static/huodong/input.css -o ./huodong/static/huodong/output.css --watch
    

数据模型

主要数据模型包括:

  • Branch分支机构
  • Contact联系人
  • Activity活动
  • EquipmentImage设备间图片
  • Drawing图纸
  • Budget预算
  • PublicScreen公共屏幕
  • VideoTerminal视频终端

许可证

MIT License

更新日志

v1.0

  • 初始版本
  • 实现基本的分支机构和活动管理功能

v1.1

  • 增加联系人管理功能
  • 增加设备间图片管理

v1.2

  • 增加图纸管理功能
  • 增加预算管理功能

v1.3

  • 增加公共屏幕和视频终端管理
  • 优化界面样式
Description
分支机构的管理版本,自用
Readme 333 MiB
Languages
HTML 48.8%
Python 30.3%
CSS 20.8%