纯前端微型出入库管理系统(我的使用型)

不依赖后端和数据库的库存管理系统简单实现,有点像闹着玩的意思,本身用用还行vue

仓库地址 github.com/FairyEver/i…git

注意

inventory-management/src/key.js 没有上传到仓库github

其文件内容为:(关键内容已经用xxx代替)vuex

export default {
  wilddog: {
    syncURL: 'https://xxxxxxxxxxxxxx.wilddogio.com/'
  }
}
复制代码

syncURL为野狗实时通信服务提供的地址数据库

若是不须要将数据上传至野狗,请删除 inventory-management/src/store/index.js 中野狗同步相关的设置npm

或者你也能够本身申请一个野狗帐号,将你的 syncURL 写在key.js后端

上面这步不处理的话运行会报错找不到文件浏览器

使用场景

重要的事情说三遍bash

不要在重要的项目中使用这种方案ui

不要在重要的项目中使用这种方案

不要在重要的项目中使用这种方案

这是一个没有后台数据库的简单系统,数据所有保存在了浏览器端,能够备份至野狗,也能够导入数据,可是,这种方式只适合我的使用,本身记录一些东西能够,不适合正式的项目

数据存储

数据存储方式

简单来说就是本地数据库和vuex保持同步,同时数据能够上传到云端防止丢失

界面

登录

Snip20180208_2

入库

Snip20180208_3

出库

Snip20180208_4

物品管理

Snip20180208_5

物品修改

Snip20180208_6

部门管理

Snip20180208_7

部门修改

Snip20180208_8

入库统计

Snip20180208_9

入库统计 按物品分组

Snip20180208_11

出库统计

Snip20180208_12

出库统计 物品筛选

Snip20180208_14

出库统计 按部门分组

Snip20180208_15

入库历史

Snip20180208_16

出库历史

Snip20180208_17

数据备份还原

Snip20180208_19

数据导入

Snip20180208_20

以上截图为开发过程截图,不表明如今的效果,最终效果请克隆代码运行

运行方法

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report
复制代码
相关文章
相关标签/搜索