diff --git a/src/actions/index.js b/src/actions/index.js index 2e24e3e..b58cc29 100644 --- a/src/actions/index.js +++ b/src/actions/index.js @@ -24,3 +24,8 @@ export const changeParam = (rendererIndex, paramIndex, value) => ({ type: actionTypes.CHANGE_PARAM, rendererIndex, paramIndex, value }) + +export const loadDownloadData = (data) => ({ + type: actionTypes.LOAD_DOWNLOAD_DATA, + data +}) diff --git a/src/api/db.js b/src/api/db.js index dfab144..a579d6a 100644 --- a/src/api/db.js +++ b/src/api/db.js @@ -3,21 +3,26 @@ import * as tcb from 'tcb-js-sdk'; const app = tcb.init({ env: 'qrbtf-1d845d' }); -const auth = app.auth(); -async function login() { +let isLogin; +const auth = app.auth(); +const db = app.database(); +const _ = db.command + +export async function login() { await auth.signInAnonymously(); const loginState = await auth.getLoginState(); isLogin = loginState } -login(); +export function getDownloadCount(callback) { + if (!isLogin) return; + db.collection('QRCounter').get().then(res => { + if (callback) callback(res); + }); +} -let isLogin; -const db = app.database(); -const _ = db.command - -export function increaseDownloadData(value) { +export function increaseDownloadData(value, callback) { if (!isLogin) return; db.collection('QRCounter').where({ value: _.eq(value) @@ -28,6 +33,8 @@ export function increaseDownloadData(value) { }).update({ count: _.inc(1), date: new Date().toString() + }).then(() => { + if (callback) callback(); }).catch(console.error) } else { @@ -35,6 +42,8 @@ export function increaseDownloadData(value) { value: value, count: 1, date: new Date().toString() + }).then(() => { + if (callback) callback() }).catch(console.error) } }) diff --git a/src/components/app/App.js b/src/components/app/App.js index be8419b..2d32b07 100644 --- a/src/components/app/App.js +++ b/src/components/app/App.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {useCallback, useEffect} from 'react'; import './App.css'; import '../Qrcode.css'; import PartFooter from "./PartFooter"; @@ -7,8 +7,25 @@ import PartMore from "./PartMore"; import PartParams from "./PartParams"; import PartDownloadViewer from "../../containers/app/PartDownloadViewer"; import PartStylesViewer from "../../containers/app/PartStylesViewer"; +import {getDownloadCount, login} from "../../api/db"; +import {connect} from 'react-redux'; +import {loadDownloadData} from "../../actions"; + +function App({ dispatch }) { + const updateDownloadData = useCallback((downloadData) => dispatch(loadDownloadData(downloadData)), []); + + useEffect(() => { + login().then(() => { + getDownloadCount((res) => { + let downloadData = []; + res.data.forEach((item) => { + downloadData[item.value] = item.count; + }); + dispatch(loadDownloadData(downloadData)); + }); + }) + }) -function App() { return (
下载二维码 — {value}
++ 下载二维码 — {value} + {downloadCount} +