Merge from master

Author: sheepzh

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2021 ZHY
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -22,7 +22,7 @@
 
 [![Chrome](https://img.shields.io/chrome-web-store/v/dkdhhcbjijekmneelocdllcldcpmekmm?label=Google%20Chrome)](https://chrome.google.com/webstore/detail/%E7%BD%91%E8%B4%B9%E5%BE%88%E8%B4%B5-%E4%B8%8A%E7%BD%91%E6%97%B6%E9%97%B4%E7%BB%9F%E8%AE%A1/dkdhhcbjijekmneelocdllcldcpmekmm?hl=zh-CN)
 [![Firefox](https://img.shields.io/amo/v/2690100?color=green&label=Mozilla%20Firefox)](https://addons.mozilla.org/zh-CN/firefox/addon/web%E6%99%82%E9%96%93%E7%B5%B1%E8%A8%88/)
-[![Edge](https://img.shields.io/badge/dynamic/json?label=Microsoft%20Edge&query=%24.version&url=https%3A%2F%2Fmicrosoftedge.microsoft.com%2Faddons%2Fgetproductdetailsbycrxid%2Ffepjgblalcnepokjblgbgmapmlkgfahc)](https://microsoftedge.microsoft.com/addons/detail/timer-running-browsin/fepjgblalcnepokjblgbgmapmlkgfahc)
+[![Edge](https://img.shields.io/badge/dynamic/json?label=Microsoft%20Edge&prefix=v&query=%24.version&url=https%3A%2F%2Fmicrosoftedge.microsoft.com%2Faddons%2Fgetproductdetailsbycrxid%2Ffepjgblalcnepokjblgbgmapmlkgfahc)](https://microsoftedge.microsoft.com/addons/detail/timer-running-browsin/fepjgblalcnepokjblgbgmapmlkgfahc)
 
 ## 开发
 
@@ -38,16 +38,7 @@
 
 - 欢迎大家 PR， PR 之前请先创建 ISSUE
 
-## DEBUG
+## TODO
 
-- 在控制台下可以开启数据存取日志
+请查看 [功能迭代 RoadMap](https://github.com/sheepzh/timer/projects/1) 项目
 
-```JavaScript
-window.timer.openLog()
-```
-
-- 关闭日志
-
-```JavaScript
-window.timer.closeLog()
-```

package.json

@@ -1,6 +1,6 @@
 {
   "name": "timer",
-  "version": "0.2.1",
+  "version": "0.2.2",
   "description": "Web timer",
   "homepage": "https://github.com/sheepzh/timer",
   "scripts": {
@@ -26,6 +26,7 @@
     "eslint": "^7.28.0",
     "filemanager-webpack-plugin": "^5.0.0",
     "generate-json-webpack-plugin": "^2.0.0",
+    "jest": "^27.0.6",
     "node-sass": "^6.0.0",
     "sass-loader": "^12.1.0",
     "style-loader": "^2.0.0",

src/app/components/clear/filter/date-filter.ts

@@ -33,6 +33,7 @@ const basePickerProps = {
     size: 'mini',
     style: 'width:250px;',
     startPlaceholder: '1994/12/15',
+    format: "YYYY/MM/DD",
     endPlaceholder: yesterdayMsg,
     type: 'daterange',
     disabledDate(date: Date) { return date.getTime() > yesterday },

src/app/components/report/index.ts

@@ -10,6 +10,7 @@ import filter, { FilterProps } from "./filter"
 import pagination, { PaginationProps } from "./pagination"
 import { renderContentContainer } from '../common/content-container'
 import { QueryData, PaginationInfo } from '../common/constants'
+import { useRouter } from 'vue-router'
 
 const hostRef: Ref<string> = ref('')
 const now = new Date()
@@ -80,7 +81,8 @@ const tableProps: TableProps = {
     whitelistRef,
     dateRangeRef,
     dataRef,
-    sortRef
+    sortRef,
+    router: undefined
 }
 
 const filterProps: FilterProps = {
@@ -101,4 +103,9 @@ const paginationProps: PaginationProps = {
 
 const childNodes = () => [filter(filterProps), table(tableProps), pagination(paginationProps)]
 
-export default defineComponent(() => renderContentContainer(childNodes))
+export default defineComponent(() => {
+    const router = useRouter()
+    tableProps.router = router
+    console.log(router)
+    return renderContentContainer(() => childNodes())
+})

src/app/components/report/table-column/date.ts

@@ -11,7 +11,7 @@ import { dateFormatter } from "../formatter"
 const dateColProp = {
     prop: 'date',
     label: t(msg => msg.item.date),
-    minWidth: 200,
+    minWidth: 135,
     align: 'center',
     sortable: 'custom'
 }

src/app/components/report/table-column/host.ts

@@ -14,21 +14,15 @@ const host2ElLink = (host: string, iconUrl: string) => {
     )
     const icon = h('span',
         { style: 'height:23px;line-height:23px;padding-left:2px;' },
-        h('img',
-            {
-                src: iconUrl,
-                width: 12,
-                height: 12
-            }
-        )
+        h('img', { src: iconUrl, width: 12, height: 12 })
     )
     return [link, icon]
 }
 
 const hostColProp = {
     prop: 'host',
     label: t(msg => msg.item.host),
-    minWidth: 300,
+    minWidth: 210,
     sortable: 'custom',
     align: 'center'
 }

src/app/components/report/table-column/index.ts

@@ -10,7 +10,7 @@ const columns = (props: ColumnProps) => {
     props.mergeDateRef.value || result.push(dateCol())
     result.push(hostCol(props))
     result.push(...itemColumns(props))
-    !props.mergeDomainRef.value && result.push(operationButtons(props))
+    result.push(operationButtons(props))
     return result
 }
 

src/app/components/report/table-column/item-columns.ts

@@ -14,7 +14,7 @@ const dataCol = (itemKey: keyof ItemMessage, propName: keyof SiteItemVal, fomatt
     h(ElTableColumn, {
         prop: propName,
         label: t(msg => msg.item[itemKey]),
-        minWidth: 220,
+        minWidth: 130,
         align: 'center',
         sortable: 'custom'
     }, { default: ({ row }: { row: SiteInfo }) => fomatter(row[propName]) })

src/app/components/report/table-column/operation.ts

@@ -1,5 +1,5 @@
 /**
- * Generate operation butons
+ * Generate operation buttons
  */
 import { h, ref, Ref } from 'vue'
 import { ElButton, ElMessage, ElPopconfirm, ElTableColumn } from "element-plus"
@@ -12,6 +12,8 @@ import { formatTime } from '../../../../util/time'
 import { dateFormatter } from '../formatter'
 import { ReportMessage } from '../../../locale/components/report'
 import { QueryData } from '../../common/constants'
+import { LocationQueryRaw, Router } from 'vue-router'
+import { TRENDER_ROUTE } from '../../../router/constants'
 
 const timerDatabase = new TimerDatabase(chrome.storage.local)
 
@@ -23,7 +25,9 @@ type Props = {
     queryData: QueryData
     whitelistRef: Ref<string[]>
     mergeDateRef: Ref<boolean>
+    mergeDomainRef: Ref<boolean>
     dateRangeRef: Ref<Array<Date>>
+    router: Router
 }
 
 export type OperationButtonColumnProps = Props
@@ -116,7 +120,6 @@ const add2WhitelistButton = (props: Props, { host }: SiteInfo) => operationButto
 })
 
 // Remove from whitelist
-
 const removeFromWhitelistButton = (props: Props, { host }: SiteInfo) => operationButton({
     confirmTitle: t(msg => msg.setting.whitelist.removeConfirmMsg, { url: host }),
     buttonType: 'primary',
@@ -125,24 +128,44 @@ const removeFromWhitelistButton = (props: Props, { host }: SiteInfo) => operatio
     onConfirm: () => operateTheWhitelist(whitelistService.remove(host), props, 'removeFromWhitelist')
 })
 
+function handleClickJump(props: Props, { host }: SiteInfo) {
+    const query: LocationQueryRaw = {
+        host,
+        merge: props.mergeDomainRef.value ? '1' : '0',
+    }
+    props.router.push({ path: TRENDER_ROUTE, query })
+}
+
+// Jump to the trender
+const jumpTowardTheTrender = (props: Props, row: SiteInfo) => h(ElButton, {
+    icon: 'el-icon-stopwatch',
+    size: 'mini',
+    type: 'primary',
+    onClick: () => handleClickJump(props, row)
+}, () => t(msg => msg.item.operation.jumpToTrender))
+
 const operationContainer = (props: Props, row: SiteInfo) => {
     const operationButtons = []
-    const { host, date } = row
-    // Delete button 
-    operationButtons.push(deleteButton(props, row))
-
-    const existsInWhitelist = props.whitelistRef.value.includes(host)
-    const whitelistButton = existsInWhitelist ? removeFromWhitelistButton(props, row) : add2WhitelistButton(props, row)
-    operationButtons.push(whitelistButton)
+    const { host } = row
+    operationButtons.push(jumpTowardTheTrender(props, row))
+    if (!props.mergeDomainRef.value) {
+        // Delete button 
+        operationButtons.push(deleteButton(props, row))
+
+        const existsInWhitelist = props.whitelistRef.value.includes(host)
+        const whitelistButton = existsInWhitelist ? removeFromWhitelistButton(props, row) : add2WhitelistButton(props, row)
+        operationButtons.push(whitelistButton)
+    }
     return operationButtons
 }
 
 const tableColumnProps = {
     label: t(msg => msg.item.operation.label),
-    minWidth: 240,
-    align: 'center'
+    align: 'center',
+    fixed: 'right'
 }
-const _default = (props: Props) => h(ElTableColumn, tableColumnProps,
+const _default = (props: Props) => h(ElTableColumn,
+    { minWidth: props.mergeDomainRef.value ? 100 : 280, ...tableColumnProps },
     {
         default: (data: { row: SiteInfo }) => operationContainer(props, data.row)
     }