GithubHelp home page GithubHelp logo

oxoyo / x-webdesktop-vue Goto Github PK

View Code? Open in Web Editor NEW
414.0 30.0 125.0 169.52 MB

基于 Vue & Koa 的 WebDesktop 视窗系统 The WebDesktop system based on Vue

Home Page: http://oxoyo.co/X-WebDesktop-Vue/

License: MIT License

JavaScript 24.04% HTML 0.60% Vue 75.28% Less 0.08%
web-desktop web-desktop-vue desktop-vue vue-desktop webos vue vue-webdesktop webdesktop desktop

x-webdesktop-vue's Introduction

X-WebDesktop-Vue

基于 Vue 的 WebDesktop 系统

Version

FrontEnd API Electron
3.x 3.x 3.x
2.0.0 2.0.0 2.0.0
1.0.1 1.0.1 -
1.0.0 - -

Documentation

中文文档 (2.0.0)

Preview

Urlhttp://oxoyo.co/X-WebDesktop-Vue/

Accountadmin

Password123456

Start

  git clone
  npm i
  npm run dev

Build

  npm run build

Screenshot

目录结构

  \_ build                      // webpack配置
  \_ config                     // webpack配置
  \_ dist                       // 打包输出目录
  \_ docs                       // gh_pages文件目录
  \_ document                   // 文档
  \_ src                        // 源码
    \_ apps                     // 【自开发应用】
      \_ DemoApp                // 【DemoApp】应用
        \_ components           // 组件
        \_ containers           // 容器
        \_ pages                // 页面
        \_ install              // 自定义应用安装界面
          \_ Index.vue          // 自定义应用安装界面入口
        \_ uninstall            // 自定义应用卸载界面
          \_ Index.vue          // 自定义应用卸载界面入口
        \_ store                // Store
          \_ index.js           // Store入口
          \_ actions.js         // action定义
          \_ mutations.js       // mutation定义
          \_ state.js           // state定义
        \_ api.js               // 接口
        \_ config.js            // 配置文件
        \_ Index.vue            // 应用入口文件
        \_ openApi.js           // 对外接口【暂无意义】
        \_ contextMenu.js       // 右键菜单配置【暂无意义】
    \_ global                   // 【全局公用】目录
      \_ components             // 公用组件
      \_ directives             // 公用指令
      \_ plugin                 // 公用插件
      \_ utils                  // 公用工具
    \_ platform                 // 【平台】
      \_ apps                   // 平台默认应用
        \_ Admin                // 后台容器
          \_ components         // 组件
          \_ containers         // 容器
          \_ pages              // 页面
          \_ store              // Store
          \_ api.js             // 接口
          \_ config.js          // 配置文件
          \_ Index.vue          // 入口组件
          \_ openApi.js         // 对外接口
          \_ contextMenu.js     // 右键菜单配置
        \_ ContextMenu          // 右键菜单
        \_ Desktop              // 桌面
        \_ DesktopIcon          // 桌面图标
        \_ DekstopWidget        // 桌面控件
        \_ Home                 // 前台容器
        \_ Login                // 前台登录
        \_ StartMenu            // 开始菜单
        \_ TaskBar              // 任务栏
        \_ TaskBarIcon          // 任务栏图标
        \_ TaskBarWidget        // 任务栏控件
        \_ Window               // 应用窗口
      \_ store                  // 平台Store
      \_ config.js              // 平台配置
      \_ Index.vue              // 平台入口文件
    \_ App.vue                  // 根入口组件
    \_ config.js                // 根配置信息
    \_ main.js                  // 根入口js
    \_ routers.js               // 根路由js
  \_ static                     // 静态文件目录
  \_ index.html                 // 根入口html

TODO

v3.x

  • 1.架构优化,前后端功能划分优化,项目结构优化。
  • 2.支持多种应用类型,如应用、文件、快捷方式。
  • 3.引入虚拟文件系统。
  • 4.右键菜单支持上下文,右键菜单图标美化。
  • 5.数据表结构优化,优化应用配置信息。
  • 6.用户系统完善,支持多用户,引入RBAC。
  • 7.登陆方式完善,支持多种OAuth登陆。
  • 8.个人中心完善。
  • 9.系统配置完善,如支持个性化设置。
  • 10.支持快捷键。
  • 11.应用丰富,如文本编辑器、图片查看器、计算器等。
  • 12.编写文档。

v2.x

  • 1.架构调整,需重构,应用设计更合理。

  • 2.优化系统性能。

  • 3.编写开发指南。

Contact

点击链接加入群【Web全栈QQ群】:https://jq.qq.com/?_wv=1027&k=53iWbrr

x-webdesktop-vue's People

Contributors

oxoyo avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

x-webdesktop-vue's Issues

窗口打开的bug

窗口先打开一个 任何一个,不关闭,再打开另外一个现实的页面还是上一个,不会变,但是关闭重新打开就正常了

Change to Typescript

This is what I was looking for, But I am typescript guy, I haven't started vue.js like old fashion way, I have started with typescript, and I don't know how to converted existing to typescript, It will be very helpful if this application is converted to typescript or have tips to do so.

cpu 消耗高

整体应用效果非常不错,但是发现,CPU消耗比较大,笔记本风扇狂转。
看看耗费CPU出现在哪个环节,可否优化。
感谢!

建议

  1. 该有的样式都有了 不过毛玻璃效果个人觉得很鸡肋,太消耗性能了,速度快就好了.
  2. 提供和window一样的细节效果和点击反馈好一些,特别右键菜单部分,其他自定义的功能部分增加顶部菜单栏可选显示就好了
  3. 建议和window一样 拖动到左右两边,分别最大化到左侧和右侧还有上侧
  4. 增加键盘快捷键支持
  5. 增加explorer文件管理器
  6. 配置化,可以在使用中中修改界面配置,修改配置可以用第三方现成的组件,修改后直接热重启,这时候可以用上 4的explorer
  7. 已经添加的软件模块可以改为一个软件管理平台的热添加的模式.
    上面只是我的个人需求作为建议~我自己也在实现中.

Interesting, but有个问题

打开的应用能移动到界面外面去,然后就看不到了, 只能关闭掉重新打开。
我觉得应该加一个边缘检测,让打开的界面被移到主界面外面的时候,触发阈值回弹。
之前写过一个小型的x-window也是这么做的回弹。^_^

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.