Support to limit the time of each visit and daily banned time period (sheepzh#215, sheepzh#228)

Author: sheepzh

src/api/chrome/tab.ts

@@ -61,11 +61,10 @@ export function sendMsg2Tab<T = any, R = any>(tabId: number, code: timer.mq.ReqC
     const request: timer.mq.Request<T> = { code, data }
     return new Promise((resolve, reject) => {
         chrome.tabs.sendMessage<timer.mq.Request<T>, timer.mq.Response>(tabId, request, response => {
-            handleError('sendMsgTab')
+            handleError('sendMsg2Tab')
             const resCode = response?.code
-            resCode === 'success'
-                ? resolve(response.data)
-                : reject(new Error(response?.msg))
+            resCode === 'success' && resolve(response.data)
+            resCode === "fail" && reject(new Error(response?.msg))
         })
     })
 }

src/app/components/analysis/components/filter.ts

@@ -87,7 +87,6 @@ function renderHostLabel({ host, merged, virtual, alias }: timer.site.SiteInfo):
 }
 
 const _default = defineComponent({
-    name: "TrendFilter",
     props: {
         site: Object as PropType<timer.site.SiteKey>,
         timeFormat: String as PropType<timer.app.TimeFormat>

src/app/components/analysis/components/trend/index.ts

@@ -195,7 +195,7 @@ const _default = defineComponent({
         const indicators: Ref<IndicatorSet> = ref()
         const lastIndicators: Ref<IndicatorSet> = ref()
         const timeFormat: Ref<timer.app.TimeFormat> = ref(props.timeFormat)
-        const rangeLength: ComputedRef = computed(() => getDayLenth(dateRange.value?.[0], dateRange.value?.[1]))
+        const rangeLength: ComputedRef<number> = computed(() => getDayLenth(dateRange.value?.[0], dateRange.value?.[1]))
 
         const compute = () => handleDataChange(
             { dateRange: dateRange.value, rows: props.rows },

src/app/components/analysis/index.ts

@@ -53,7 +53,6 @@ const _default = defineComponent(() => {
     const site: Ref<timer.site.SiteKey> = ref(siteFromQuery)
     const timeFormat: Ref<timer.app.TimeFormat> = ref('default')
     const rows: Ref<timer.stat.Row[]> = ref()
-    const filter: Ref = ref()
 
     const queryInner = async () => {
         const siteKey = site.value
@@ -67,7 +66,6 @@ const _default = defineComponent(() => {
         filter: () => h(Filter, {
             site: site.value,
             timeFormat: timeFormat.value,
-            ref: filter,
             onSiteChange: (newSite: timer.site.SiteKey) => site.value = newSite,
             onTimeFormatChange: (newFormat: timer.app.TimeFormat) => timeFormat.value = newFormat
         }),

src/app/components/common/content-container.ts

@@ -9,17 +9,19 @@ import { ElCard, ElScrollbar } from "element-plus"
 import ContentCard from "./content-card"
 import { defineComponent, h, useSlots } from "vue"
 
-const _default = defineComponent(() => {
-    const slots = useSlots()
-    const children = []
-    const { default: default_, filter, content } = slots
-    filter && children.push(h(ElCard, { class: "filter-container" }, () => h(filter)))
-    if (default_) {
-        children.push(h(slots.default))
-    } else {
-        content && children.push(h(ContentCard, () => h(content)))
+const _default = defineComponent({
+    setup() {
+        const slots = useSlots()
+        const children = []
+        const { default: default_, filter, content } = slots
+        filter && children.push(h(ElCard, { class: "filter-container" }, () => h(filter)))
+        if (default_) {
+            children.push(h(slots.default))
+        } else {
+            content && children.push(h(ContentCard, () => h(content)))
+        }
+        return () => h(ElScrollbar, () => h("div", { class: "content-container" }, children))
     }
-    return () => h(ElScrollbar, () => h("div", { class: "content-container" }, children))
 })
 
 export default _default

src/app/components/dashboard/components/calendar-heat-map.ts

@@ -258,7 +258,7 @@ const _default = defineComponent({
         const now = new Date()
         const startTime: Date = getWeeksAgo(now, isChinese, WEEK_NUM)
 
-        const chart: Ref = ref()
+        const chart: Ref<HTMLDivElement> = ref()
         const chartWrapper: ChartWrapper = new ChartWrapper(startTime, now)
 
         onMounted(async () => {

src/app/components/dashboard/components/top-k-visit.ts

@@ -97,12 +97,11 @@ class ChartWrapper {
 }
 
 const _default = defineComponent({
-    name: "TopKVisit",
     setup() {
         const now = new Date()
         const startTime: Date = new Date(now.getTime() - MILL_PER_DAY * DAY_NUM)
 
-        const chart: Ref = ref()
+        const chart: Ref<HTMLDivElement> = ref()
         const chartWrapper: ChartWrapper = new ChartWrapper()
 
         onMounted(async () => {

src/app/components/data-manage/clear/filter/index.ts

@@ -13,6 +13,10 @@ import DateFilter from "./date-filter"
 import NumberFilter from "./number-filter"
 import DeleteButton from "./delete-button"
 
+export type FilterInstance = {
+    getFilterOption(): DataManageClearFilterOption
+}
+
 const _default = defineComponent({
     emits: {
         delete: () => true
@@ -23,17 +27,18 @@ const _default = defineComponent({
         const focusEndRef: Ref<string> = ref('2')
         const timeStartRef: Ref<string> = ref('0')
         const timeEndRef: Ref<string> = ref('')
-        const computeFilterOption = () => ({
-            dateRange: dateRangeRef.value,
-            focusStart: focusStartRef.value,
-            focusEnd: focusEndRef.value,
-            timeStart: timeStartRef.value,
-            timeEnd: timeEndRef.value,
-        } as DataManageClearFilterOption)
 
-        ctx.expose({
-            getFilterOption: computeFilterOption
-        })
+        const instance: FilterInstance = {
+            getFilterOption: () => ({
+                dateRange: dateRangeRef.value,
+                focusStart: focusStartRef.value,
+                focusEnd: focusEndRef.value,
+                timeStart: timeStartRef.value,
+                timeEnd: timeEndRef.value,
+            } as DataManageClearFilterOption)
+        }
+
+        ctx.expose(instance)
 
         return () => h('div', { class: 'clear-panel' }, [
             h('h3', t(msg => msg.dataManage.filterItems)),

src/app/components/data-manage/clear/index.ts

@@ -9,7 +9,7 @@ import { ElAlert, ElCard, ElMessage, ElMessageBox } from "element-plus"
 import { defineComponent, h, Ref, ref, SetupContext } from "vue"
 import { t } from "@app/locale"
 import { alertProps } from "../common"
-import Filter from "./filter"
+import Filter, { FilterInstance } from "./filter"
 import StatDatabase, { StatCondition } from "@db/stat-database"
 import { MILL_PER_DAY } from "@util/time"
 
@@ -109,7 +109,7 @@ const _default = defineComponent({
         dataDelete: () => true
     },
     setup(_, ctx) {
-        const filterRef: Ref = ref()
+        const filter: Ref<FilterInstance> = ref()
         return () => h(ElCard, {
             class: 'clear-container'
         }, () => [
@@ -118,8 +118,8 @@ const _default = defineComponent({
                 title: t(msg => msg.dataManage.operationAlert)
             }),
             h(Filter, {
-                ref: filterRef,
-                onDelete: () => handleClick(filterRef, ctx),
+                ref: filter,
+                onDelete: () => handleClick(filter, ctx),
             }),
         ])
     }

src/app/components/data-manage/index.ts

@@ -9,13 +9,15 @@ import { ElRow, ElCol } from "element-plus"
 import { defineComponent, h, Ref, ref } from "vue"
 import ContentContainer from "../common/content-container"
 import Migration from "./migration"
-import MemeryInfo from "./memory-info"
+import MemeryInfo, { MemeryInfoInstance } from "./memory-info"
 import ClearPanel from "./clear"
 import './style'
 
 export default defineComponent(() => {
-    const memeryInfoRef: Ref = ref()
-    const queryData = () => memeryInfoRef?.value?.queryData()
+    const memeryInfoRef: Ref<MemeryInfoInstance> = ref()
+
+    const queryData = () => memeryInfoRef.value?.queryData()
+
     return () => h(ContentContainer, {
         class: 'data-manage-container'
     }, () => h(ElRow, { gutter: 20 },