init

Author: xiaotian

.editorconfig

@@ -0,0 +1,16 @@
+# http://editorconfig.org
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false
+
+[Makefile]
+indent_style = tab

.gitignore

@@ -0,0 +1,20 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/npm-debug.log*
+/yarn-error.log
+/yarn.lock
+/package-lock.json
+
+# production
+/dist
+
+# misc
+.DS_Store
+
+# umi
+/src/.umi
+/src/.umi-production
+/src/.umi-test
+/.env.local

.prettierignore

@@ -0,0 +1,8 @@
+**/*.md
+**/*.svg
+**/*.ejs
+**/*.html
+package.json
+.umi
+.umi-production
+.umi-test

.prettierrc

@@ -0,0 +1,11 @@
+{
+  "singleQuote": true,
+  "trailingComma": "all",
+  "printWidth": 80,
+  "overrides": [
+    {
+      "files": ".prettierrc",
+      "options": { "parser": "json" }
+    }
+  ]
+}

.umirc.ts

@@ -0,0 +1,16 @@
+import { defineConfig } from 'umi';
+import WindiCSSWebpackPlugin from 'windicss-webpack-plugin'
+
+export default defineConfig({
+  outputPath: 'app/build',
+  nodeModulesTransform: {
+    type: 'none',
+  },
+  routes: [
+    { path: '/', component: '@/pages/index' },
+  ],
+  fastRefresh: {},
+  chainWebpack(memo, { env, webpack, createCSSRule }) {
+    memo.plugin('windicss').use(WindiCSSWebpackPlugin)
+  }
+});

README.md

@@ -0,0 +1,12 @@
+# 库存管理系统（供学习electron）
+
+## 技术栈
+umijs + electron
+
+## 开发环境启动
+```
+yarn start:app
+```
+## 截图
+![](./imgs/[email protected])
+![](./imgs/[email protected])

app/main.ts

@@ -0,0 +1,56 @@
+const { app, BrowserWindow, ipcMain, dialog } = require('electron')
+const path = require('path')
+const fs = require('fs')
+
+const isPro = process.env.NODE_ENV !== "development";
+function renderWindow() {
+  const mainWindow = new BrowserWindow({
+    width: 750,
+    height: 550,
+    webPreferences: {
+      nodeIntegration: true,
+      contextIsolation: false
+      // preload: path.resolve(__dirname, 'preload.js')
+    }
+  })
+
+  if (isPro) {
+    mainWindow.loadFile(`${__dirname}/build/index.html`);
+  } else {
+    mainWindow.loadURL('http://localhost:8000/');
+    // 打开开发者工具，默认不打开
+    mainWindow.webContents.openDevTools()
+  }
+
+  ipcMain.on('read-laihuo-excel', async (evt) => {
+    const {filePaths} = await dialog.showOpenDialog({
+      filters: [{
+        name: 'Excel',
+        extensions: ['xlsx']
+      }]
+    })
+    evt.reply('read-laihuo-success', filePaths[0], fs.readFileSync(filePaths[0]))
+  })
+  ipcMain.on('read-fahuo-excel', async (evt) => {
+    const {filePaths} = await dialog.showOpenDialog({
+      filters: [{
+        name: 'Excel',
+        extensions: ['xlsx']
+      }]
+    })
+    evt.reply('read-fahuo-success', filePaths[0], fs.readFileSync(filePaths[0]))
+  })
+}
+
+app.whenReady().then(() => {
+  renderWindow()
+  app.on('activate', function () {
+    if (BrowserWindow.getAllWindows().length === 0) renderWindow()
+  })
+})
+
+app.on('window-all-closed', () => {
+  if (process.platform === 'darwin') return
+
+  app.quit()
+})

imgs/[email protected]

@@ -0,0 +1,45 @@
+{
+  "private": true,
+  "scripts": {
+    "start:app": "concurrently \"cross-env BROWSER=none yarn start\" \"wait-on http://localhost:8000 && cross-env NODE_ENV=development electron app/main.ts\"",
+    "start": "umi dev",
+    "build": "umi build",
+    "postinstall": "umi generate tmp",
+    "prettier": "prettier --write '**/*.{js,jsx,tsx,ts,less,md,json}'",
+    "test": "umi-test",
+    "test:coverage": "umi-test --coverage"
+  },
+  "gitHooks": {
+    "pre-commit": "lint-staged"
+  },
+  "lint-staged": {
+    "*.{js,jsx,less,md,json}": [
+      "prettier --write"
+    ],
+    "*.ts?(x)": [
+      "prettier --parser=typescript --write"
+    ]
+  },
+  "dependencies": {
+    "@ant-design/pro-layout": "^6.5.0",
+    "exceljs": "^4.3.0",
+    "react": "17.x",
+    "react-dom": "17.x",
+    "umi": "^3.5.20"
+  },
+  "devDependencies": {
+    "@types/react": "^17.0.0",
+    "@types/react-dom": "^17.0.0",
+    "@umijs/preset-react": "1.x",
+    "@umijs/test": "^3.5.20",
+    "concurrently": "^6.4.0",
+    "cross-env": "^7.0.3",
+    "electron": "^16.0.1",
+    "lint-staged": "^10.0.7",
+    "prettier": "^2.2.0",
+    "typescript": "^4.1.2",
+    "wait-on": "^6.0.0",
+    "windicss-webpack-plugin": "^1.5.8",
+    "yorkie": "^2.0.0"
+  }
+}

imgs/[email protected]

@@ -0,0 +1 @@
+import 'windi.css'

mock/.gitkeep

@@ -0,0 +1,159 @@
+import { Button, Table } from 'antd'
+import Excel from 'exceljs'
+import { useState, useEffect } from 'react'
+const { ipcRenderer } = window.require('electron')
+
+type DataPreviewProps = {
+  laihuoFile: ArrayBuffer
+  fahuoFile: ArrayBuffer
+  colorMap: Record<string, string>
+  reupload: () => void
+}
+export default (props: DataPreviewProps) => {
+  const [loading, setLoading] = useState(false)
+  const [kucunWb, setKucunWb] = useState<Excel.Workbook>()
+  // 要预览的数据
+  const [dataList, setDataList] = useState<any[]>([])
+  async function initData() {
+    const jinhuoWorkbook = await new Excel.Workbook().xlsx.load(props.laihuoFile)
+
+    const addressRE = /^([A-Z]+)(\d+)$/
+    const emptySymbolRE = /\s/g
+    const colorNumRE = /[A-Z\d\s#-]+/
+    const jinhuoMap = {}
+    const colorMap = props.colorMap
+    jinhuoWorkbook.eachSheet((sheet) => {
+      const row1 = sheet.getRow(1)
+      const sheetName = sheet.name.replace(emptySymbolRE, '')
+      sheet.eachRow((row, rowNum) => {
+        if (rowNum <= 1) return
+
+        row.eachCell((cell, cellNum) => {
+          if (cellNum <= 1) return
+
+          // @ts-ignore
+          const colorCN = row.getCell(1).value.replace(colorNumRE, '').replace(emptySymbolRE, '')
+          // @ts-ignore
+          const colKey = addressRE.exec(cell.address)[1]
+          const size = row1.getCell(colKey).value
+          // @ts-ignore
+          const key = `${sheetName}-${colorMap[colorCN]}-${size.replace(emptySymbolRE, '')}`
+          // @ts-ignore
+          const val = jinhuoMap[key]
+          if (val && val >= 0) {
+            // @ts-ignore
+            jinhuoMap[key] += cell.value
+          } else {
+            // @ts-ignore
+            jinhuoMap[key] = cell.value
+          }
+        })
+      })
+    })
+
+    const dataList: any[] = []
+    // @ts-ignore
+    function createKucunWb(jinhuoMap) {
+      const kucunWorkbook = new Excel.Workbook()
+      kucunWorkbook.properties.date1904 = true
+      const sheet = kucunWorkbook.addWorksheet('库存')
+      sheet.columns = [
+        { header: '卖家SKU', key: 'sku', width: 20 },
+        { header: 'ASIN', key: 'asin', width: 20 },
+        { header: '进货总数', key: 'jinhuoNum', width: 20 },
+        { header: '发货总数', key: 'fahuoNum', width: 20 },
+        { header: '仓库剩余', key: 'remain', width: 20 },
+      ]
+
+      const skuMap = {}
+      Object.keys(jinhuoMap).forEach((key, index) => {
+        // @ts-ignore
+        skuMap[key] = index + 2
+        const row = {
+          sku: key,
+          jinhuoNum: jinhuoMap[key],
+          fahuoNum: 0,
+          remain: jinhuoMap[key]
+        }
+        dataList.push(row)
+        sheet.addRow(row)
+      })
+
+      return [kucunWorkbook, skuMap]
+    }
+    // 读取出货表计算库存并输出到库存表
+    const [kucunWorkbook, skuMap] = createKucunWb(jinhuoMap)
+    // @ts-ignore
+    const kucunSheet = kucunWorkbook.getWorksheet('库存')
+    const fahuoWorkbook = await new Excel.Workbook().xlsx.load(props.fahuoFile)
+    fahuoWorkbook.eachSheet(sheet => {
+      sheet.eachRow((row, rowNum) => {
+        if (rowNum <= 1) return
+
+        let sku = row.getCell(1).value
+        // @ts-ignore
+        sku = sku.split('-').slice(0, 3).join('-')
+        // @ts-ignore
+        const index = skuMap[sku]
+        const data = dataList[index - 2]
+        const kucunRow = kucunSheet.getRow(index)
+        const asin = row.getCell('B').value
+        kucunRow.getCell('B').value = asin
+        data.asin = asin
+
+        // 累加发货数
+        let fahuoNum = kucunRow.getCell('D').value
+        kucunRow.getCell('D').value = fahuoNum = fahuoNum + row.getCell('C').value
+        data.fahuoNum = fahuoNum
+
+        // 计算库存数
+        const remain = kucunRow.getCell('remain').value - fahuoNum
+        kucunRow.getCell('E').value = remain
+        data.remain = remain
+      })
+    })
+    // @ts-ignore
+    setKucunWb(kucunWorkbook)
+    setDataList(dataList)
+  }
+
+  useEffect(() => {
+    setLoading(true)
+    initData().then(() => setLoading(false)).catch(() => setLoading(false))
+  }, [])
+
+  async function handleExport() {
+    const buffer = await kucunWb?.xlsx.writeBuffer()
+    const a = document.createElement('a')
+    a.download = '库存.xlsx'
+    a.href = URL.createObjectURL(new Blob([buffer!]))
+    document.body.appendChild(a)
+    a.click()
+    document.body.removeChild(a)
+    ipcRenderer.send('export-res', kucunWb)
+  }
+
+  return (
+    <div className="w-full px-20 py-4 text-right">
+      <Table rowKey="sku" loading={loading} scroll={{y: 300}} dataSource={dataList} pagination={false} columns={[{
+                        title: '卖家SKU',
+                        dataIndex: 'sku'
+                      }, {
+                        title: 'ASIN',
+                        dataIndex: 'asin'
+                      }, {
+                        title: '进货总数',
+                        dataIndex: 'jinhuoNum'
+                      }, {
+                        title: '发货总数',
+                        dataIndex: 'fahuoNum'
+                      }, {
+                        title: '仓库剩余',
+                        dataIndex: 'remain'
+                      }]}
+      ></Table>
+      <Button disabled={loading} className="mt-4" onClick={props.reupload}>重新上传</Button>
+      <Button disabled={loading} className="mt-4 ml-4" type="primary" onClick={handleExport}>导出excel</Button>
+    </div>
+  )
+}