From be83b8b9bf514f4cd348a988780c7fab36273050 Mon Sep 17 00:00:00 2001 From: Chunxian Zhang <1836891291@qq.com> Date: Sun, 21 Aug 2022 19:09:10 +0800 Subject: [PATCH] =?UTF-8?q?be=20=E5=89=8D=E5=90=8E=E7=AB=AF=E4=BA=A4?= =?UTF-8?q?=E4=BA=92=E8=8C=83=E4=BE=8B=E5=AE=8C=E6=88=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- appTime/AppTime-Realease/data.db-journal | 0 lazy-timer-be/app.py | 64 +++++++--------------- lazy-timer-fe/src/data/dummy.js | 20 +++---- lazy-timer-fe/src/pages/Ecommerce.jsx | 62 +++++++++++++++++++-- .../src/service/getDayScreenUseTime/index.js | 7 +++ lazy-timer-fe/src/service/index.js | 17 ++++++ 6 files changed, 112 insertions(+), 58 deletions(-) delete mode 100644 appTime/AppTime-Realease/data.db-journal create mode 100644 lazy-timer-fe/src/service/getDayScreenUseTime/index.js create mode 100644 lazy-timer-fe/src/service/index.js diff --git a/appTime/AppTime-Realease/data.db-journal b/appTime/AppTime-Realease/data.db-journal deleted file mode 100644 index e69de29..0000000 diff --git a/lazy-timer-be/app.py b/lazy-timer-be/app.py index 49760ad..2eaa612 100644 --- a/lazy-timer-be/app.py +++ b/lazy-timer-be/app.py @@ -1,8 +1,9 @@ # python对多文件编程及其不友好, 白写了这么多文件到处报错, 最后还是要写在一个文件里解决了 import os import sys +import json from datetime import datetime # 处理时间 -from flask import Flask +from flask import Flask, request from flask_cors import CORS, cross_origin from flask_sqlalchemy import SQLAlchemy @@ -46,57 +47,32 @@ class Win(db.Model): # 后端API # 获取每日屏幕使用总时间 -@app.route('/getDayScreenUseTime', methods=['GET']) +@app.route('/getDayScreenUseTime', methods=['POST']) @cross_origin() def getDayScreenUseTime(): - datetimeStr = '2022-09-05' + # datetimeStr = data.datetimeStr + datetimeStr1 = json.loads(request.data) + datetimeStr = datetimeStr1['datetimeStr'] struct_time = datetime.strptime(datetimeStr, "%Y-%m-%d").date() # 获取请求日期, struct_time数据类型为dateTime activityTimeList = Period.query.all() - selectedTimeList = [] # 选中的对应今天日期的时间李彪 + selectedTimeList = [] # 选中的对应今天日期的时间 for time in activityTimeList: - if time.timeStart.date() == struct_time: + if time.timeStart.date() == struct_time and time.timeEnd.date() == struct_time: selectedTimeList.append(time) timeAmount = 0 for time in selectedTimeList: - time_diff = time.timeEnd - time.timeStart - timeAmount = timeAmount + time_diff.total_seconds() + if time.timeEnd.date() == time.timeStart.date(): + time_diff = time.timeEnd - time.timeStart + timeAmount = timeAmount + time_diff.total_seconds() timeAmount = int(timeAmount) - m, s = divmod(timeAmount, 60) - h, m = divmod(m, 60) - - return '{:d}小时{:02d}分{:02d}秒'.format(h, m, s) - -# 获取每日第一次屏幕使用时刻 -@app.route('/getFirstScreenTime', methods=['GET']) -@cross_origin() -def getFirstScreenTime(): - datetimeStr = '2022-09-05' - struct_time = datetime.strptime(datetimeStr, "%Y-%m-%d").date() # 获取请求日期, struct_time数据类型为dateTime - activityTimeList = Period.query.all() - selectedTimeList = [] # 选中的对应今天日期的时间李彪 - for time in activityTimeList: - if time.timeStart.date() == struct_time: - selectedTimeList.append(time) - break; - - firstScreenTime = selectedTimeList[0].timeStart.strftime('%H点%M分%S秒') - return firstScreenTime - -# 获取每日最后一次屏幕使用时刻 -@app.route('/getLastScreenTime', methods=['GET']) -@cross_origin() -def getLastScreenTime(): - datetimeStr = '2022-09-05' - struct_time = datetime.strptime(datetimeStr, "%Y-%m-%d").date() # 获取请求日期, struct_time数据类型为dateTime - activityTimeList = Period.query.all() - selectedTimeList = [] # 选中的对应今天日期的时间李彪 - for time in activityTimeList: - if time.timeStart.date() == struct_time: - selectedTimeList.append(time) - - lastScreenTime = selectedTimeList[-1].timeEnd.strftime('%H点%M分%S秒') - return lastScreenTime - -# 持续时间 \ No newline at end of file + getDayScreenUseTimeM, getDayScreenUseTimeS = divmod(timeAmount, 60) # 每日屏幕使用时长, 分时秒 + getDayScreenUseTimeH, getDayScreenUseTimeM = divmod(getDayScreenUseTimeM, 60) + firstScreenTime = selectedTimeList[0].timeStart.strftime('%H时%M分%S秒') # 第一次屏幕使用时刻, + lastScreenTime = selectedTimeList[-1].timeEnd.strftime('%H时%M分%S秒') # 最后一次屏幕使用时刻 + screenTimeSpan = int((selectedTimeList[-1].timeEnd - selectedTimeList[0].timeStart).total_seconds()) # 持续时间 + getScreenTimeSpanM, getScreenTimeSpanS = divmod(screenTimeSpan, 60) # 每日屏幕使用时长, 分时秒 + getScreenTimeSpanH, getScreenTimeSpanM = divmod(getScreenTimeSpanM, 60) + sendJson = {'getDayScreenUseTimeH': getDayScreenUseTimeH, 'getDayScreenUseTimeM': getDayScreenUseTimeM, 'getDayScreenUseTimeS': getDayScreenUseTimeS, 'firstScreenTime': firstScreenTime, 'lastScreenTime': lastScreenTime, 'getScreenTimeSpanH': getScreenTimeSpanH, 'getScreenTimeSpanM': getScreenTimeSpanM, 'getScreenTimeSpanS': getScreenTimeSpanS } + return json.dumps(sendJson, indent=4) \ No newline at end of file diff --git a/lazy-timer-fe/src/data/dummy.js b/lazy-timer-fe/src/data/dummy.js index 2d18150..ab89b28 100644 --- a/lazy-timer-fe/src/data/dummy.js +++ b/lazy-timer-fe/src/data/dummy.js @@ -631,6 +631,16 @@ export const chatData = [ export const earningData = [ { + icon: , + amount: '这里填写时间', + percentage: '+38%', + title: '今日屏幕使用时间', + iconColor: 'rgb(228, 106, 118)', + iconBg: 'rgb(255, 244, 229)', + + pcColor: 'green-600', + }, + { icon: , amount: '这里填写时间', percentage: '-4%', @@ -649,16 +659,6 @@ export const earningData = [ pcColor: 'black-600', }, { - icon: , - amount: '这里填写时间', - percentage: '+38%', - title: '今日屏幕使用时间', - iconColor: 'rgb(228, 106, 118)', - iconBg: 'rgb(255, 244, 229)', - - pcColor: 'green-600', - }, - { icon: , amount: '这里填写时间', percentage: '-12%', diff --git a/lazy-timer-fe/src/pages/Ecommerce.jsx b/lazy-timer-fe/src/pages/Ecommerce.jsx index 909fa98..8af1660 100644 --- a/lazy-timer-fe/src/pages/Ecommerce.jsx +++ b/lazy-timer-fe/src/pages/Ecommerce.jsx @@ -1,14 +1,17 @@ -import React from 'react'; +import React, { useRef, useState, useEffect } from 'react'; import { BsFillLaptopFill } from 'react-icons/bs'; import { AiFillCalendar } from 'react-icons/ai'; import { GoPrimitiveDot } from 'react-icons/go'; +import { MdWbSunny, MdBedtime } from 'react-icons/md'; import { IoIosMore } from 'react-icons/io'; +import { FaSortAmountDown } from 'react-icons/fa'; import { DropDownListComponent } from '@syncfusion/ej2-react-dropdowns'; import { Stacked, Pie, Button, LineChart, SparkLine } from '../components'; import { earningData, medicalproBranding, recentTransactions, weeklyStats, dropdownData, SparklineAreaData, ecomPieChartData } from '../data/dummy'; import { useStateContext } from '../contexts/ContextProvider'; import product9 from '../data/product9.jpg'; +import { getDayScreenUseTime } from '../service/getDayScreenUseTime/index' const DropDown = ({ currentMode }) => (
@@ -17,13 +20,64 @@ const DropDown = ({ currentMode }) => ( ); const Ecommerce = () => { - const { currentColor, currentMode } = useStateContext(); + const { currentColor, currentMode } = useStateContext() + let [earningData2, setEarningData2] = useState(earningData) + + useEffect(async () => { + var today = new Date(); + var dd = String(today.getDate()).padStart(2, '0'); + var mm = String(today.getMonth() + 1).padStart(2, '0'); + var yyyy = today.getFullYear(); + const receivedJson = await getDayScreenUseTime(yyyy + '-' + mm + '-' + dd); + console.log(receivedJson); + setEarningData2([ + { + icon: , + amount: receivedJson.data.getDayScreenUseTimeH + '小时' + receivedJson.data.getDayScreenUseTimeM + '分' + receivedJson.data.getDayScreenUseTimeS + '秒', + percentage: '+38%', + title: '今日屏幕使用时间', + iconColor: 'rgb(228, 106, 118)', + iconBg: 'rgb(255, 244, 229)', + + pcColor: 'green-600', + }, + { + icon: , + amount: receivedJson.data.firstScreenTime, + percentage: '-4%', + title: '第一次屏幕使用', + iconColor: '#03C9D7', + iconBg: '#E5FAFB', + pcColor: 'red-600', + }, + { + icon: , + amount: receivedJson.data.lastScreenTime, + percentage: '+23%', + title: '最后一次屏幕使用', + iconColor: 'rgb(255, 244, 229)', + iconBg: 'rgb(0,0,0)', + pcColor: 'black-600', + }, + { + icon: , + amount: receivedJson.data.getScreenTimeSpanH + '小时' + receivedJson.data.getScreenTimeSpanM + '分' + receivedJson.data.getScreenTimeSpanS + '秒', + percentage: '-12%', + title: '时间跨度', + iconColor: 'rgb(0, 194, 146)', + iconBg: 'rgb(235, 250, 242)', + pcColor: 'red-600', + }, + ]) + }, []) + + console.log(earningData2); return (
{/* 第一行四个盒子 */}
-
+

日期

@@ -52,7 +106,7 @@ const Ecommerce = () => {
- {earningData.map((item) => ( + {earningData2.map((item) => (