xuyunhui/E-commerce @ dev

Nessuna descrizione

169 Commit

Cooklalala 60898da6ca fix: page3接口对接		5 mesi fa
mm	c0597b40df fix:接口联调	11 mesi fa
public	b96f730040 fix: page1接口对接	6 mesi fa
src	60898da6ca fix: page3接口对接	5 mesi fa
.eslintrc.js	843858e92b feat: 嵌入地图	11 mesi fa
.gitignore	1c132a5df1 修复词云图不显示问题	1 anno fa
LICENSE	1c132a5df1 修复词云图不显示问题	1 anno fa
README.md	012ba73590 feat: 新建电商可视化	6 mesi fa
_config.yml	1c132a5df1 修复词云图不显示问题	1 anno fa
babel.config.js	7772efefae fix: 补充依赖	11 mesi fa
doc.md	870a07b49e chore: 框架完善	11 mesi fa
package.json	012ba73590 feat: 新建电商可视化	6 mesi fa
vue.config.js	b96f730040 fix: page1接口对接	6 mesi fa
yarn.lock	012ba73590 feat: 新建电商可视化	6 mesi fa

前言

一个基于Vue前端框架和第三方图表库echarts构建的可视化大数据平台，通过vue项目构建、指令的灵活运用、组件封装、组件之间通信，使内部图表组件库可实现自由替换和组合。
项目中部分前端库采用外部CDN引入，可以减少打包文件体积，加快页面渲染。
可视化数据大屏展示对前端性能要求高，建议使用谷歌浏览器查看或开发，屏幕尺寸为1920px宽和1080px高是最佳效果。
目前制作数据可视化大屏，前端比较流行的第三方库有：Echarts（百度），AntV（阿里），Highcharts（国外公司），D3.js（国外公司）。

开发

位于 dev 分支
请使用 less 编写样式
技术栈
- vue2.6
- echarts4.7
- axios
- webpack
- ES6
- scss
- css3
- jquery
- iconfont
```
# 建议 node v14

yarn
yarn mm
yarn serve
```
运行之后，访问地址：http://localhost:8081
接口文档 http://127.0.0.1:8100/doc

发布

yarn build

页面

任务

目标 -- 11月25号之前完成页面和模拟接口/数据
分工
- 模拟接口和数据 -- 肖文华
- 综合问览 -- 徐云辉
- 地图 -- 徐云辉
- 不包含的内容
  - 顶部条
  - 实时统计中的目标完成率表
- 种植分析 -- 肖文华
- 不包含的内容
  - 本月移栽数量趋势
  - 本年移栽数据趋势
- 种植分析详情 -- 肖文华
- 不包含的内容
  - 本月移栽数量趋势
  - 本年移栽数据趋势

仅供参考

项目架构

登录界面抖动
粒子动效
背景图轮播
自定义全局模态框
自定义消息提示框
酷屏首页组件库
各种酷炫小部件

炫酷展示公司品牌

│  vue.config.js                     // webpack配置
├─public
│      favicon.ico                   // ico图标
│      index.html                    // 入口html文件
└─src
│  App.vue                       // 根组件
│  main.js                       // 程序入口文件
├─assets
│  ├─iconfont                     // 引用阿里巴巴矢量图标库
│  ├─img                          // 存放公共图片文件夹
│  ├─js
│  │      utils.js                // 封装工具类方法
│  └─styles
│      │  base.scss               // 基础样式文件
│      │  common.scss             // 公用样式文件
│      └─fonts                    // 字体库文件
├─components
│  │  index.js                    // 封装组件库
│  ├─bar3d                        // 3D立体柱状图
│  ├─bgAnimation                  // 登录界面背景图动画
│  ├─cakeLinkage                  // 柱饼组合联动
│  ├─circleNesting                // 圆环套圆环
│  ├─circleRunway                 // 环形跑道图
│  ├─colorfulArea                 // 多彩轮播面积
│  ├─colorfulRadar                // 多彩雷达
│  ├─companySummary
│  │      business.vue            // 业务范围
│  │      distrbution.vue         // 客户分布
│  │      history.vue             // 发展历程
│  │      income.vue              // 营业收入
│  │      talent.vue              // 人才队伍
│  │      wordCloud.vue           // 产品热词
│  ├─dynamicLine                  // 动态轮播折线图
│  ├─dynamicList                  // 动态列表动画
│  ├─flashCloud                   // 闪动云
│  ├─gauge                        // 仪表盘
│  ├─modal                        // 自定义全局模态框
│  ├─pyramid                      // 金字塔动画
│  ├─pyramidTrend                 // 金字塔趋势
│  ├─rainbow                      // 彩虹轨道图
│  ├─ringPie                      // 环形饼图
│  ├─ringPin                      // 环形气泡图
│  ├─rotateColorful               // 旋转多彩图
│  ├─scanRadius                   // 扫描半径图
│  ├─scrollArc                    // 滚动弧形线
│  ├─seamless                     // 新闻无缝滚动
│  ├─sinan                        // 司南排名图
│  ├─staffMix                     // 人员占比
│  ├─szBar                        // 双轴柱状图
│  ├─toast
│  │      index.js                // 注册全局消息提示框组件
│  │      index.vue               // 自定义消息提示框模板
│  └─waterPolo
│          index.vue              // 水球图、水波图
├─router
│      index.js                   // 单页面路由注册组件
├─store
│      index.js                   // 状态管理仓库未使用到
└─views
        Brand.vue                 // 公司品牌介绍
        Home.vue                  // 酷屏首页统计图
        Login.vue                 // 登录界面

README.md

前言

开发

发布

页面

任务

仅供参考

项目架构