/SeetaFaceAppsWeb

中科视拓智慧园区社区版Web前端

Primary LanguageVue

前端项目

一、项目简介

设备管理平台社区版，通过简洁、精致的页面呈现，帮助用户精准、便捷的使用设备管理平台的功能，还提供实时设备状态变更提醒功能，给予用户友好的使用体验。

二、核心目录简介

  • dist 【打包构建后资源目录】
  • node_modules 【项目依赖库相关】
  • public 【静态资源】
  • src 【资源目录】
    • api 【接口目录】
      • axios.js 【拦截器】
      • baseUrl.js 【基础路径】
      • getData.js 【接口定义】
    • assets 【静态资源】
      • css 【项目初始化样式】
      • Exception 【异常处理资源】
      • font-awesome 【图标资源】
      • images 【图片资源】
      • stylus 【自定义样式】
    • components 【组件目录】
      • Bar 【查询栏】
      • Breadcrumb 【面包屑】
      • Card 【卡片】
      • Contain 【包裹容器】
      • Exception 【异常处理】
      • Header 【头部导航】
      • Menu 【菜单导航】
    • utils 【工具类】
    • views 【视图目录】
      • DeviceInfo 【设备相关视图】
      • Login 【登录相关视图】
      • PassDisplay 【识别展示视图】
      • PersonInfo 【人员相关视图】
      • RecordInfo 【记录相关视图】
      • SystemInfo 【系统相关视图】
      • Welcome 【欢迎页视图】
      • Home.vue 【页面布局视图】
    • App.vue 【视图入口】
    • main.js 【项目主入口】
    • router 【路由管理】
    • store 【全局状态管理】
  • package.json 【项目说明及依赖】
  • vue.config.js 【webpack相关配置】

三、项目实现

Vue 2.x

基于Vue cli 3.0初始化项目 基于Vue 2.6.10实现

Element-UI

基于Element-UI 2.13.0实现页面展示

四、项目运行

使用项目前，请确保已成功安装node、npm工具。

拉取代码后，安装依赖

npm install

开发环境 热加载

npm run serve

生产环境 打包构建

npm run build

配置文件

调整后台地址可修改 public/config.js 文件

window.g = {
  baseURL: 'http://192.168.0.110:xxxx/' // 后台地址
}