mirror of
https://gitcode.com/gitea/gitea.git
synced 2025-06-04 03:09:34 +08:00
.devcontainer
.gitea
.github
assets
build
cmd
contrib
custom
docker
docs
models
modules
options
public
routers
services
snap
templates
tests
web_src
css
fomantic
js
components
.eslintrc.yaml
ActionRunStatus.vue
ActivityHeatmap.vue
ContextPopup.vue
DashboardRepoList.vue
DiffCommitSelector.vue
DiffFileList.vue
DiffFileTree.vue
DiffFileTreeItem.vue
PullRequestMergeForm.vue
RepoActionView.vue
RepoActivityTopAuthors.vue
RepoBranchTagSelector.vue
RepoContributors.vue
ScopedAccessTokenSelector.vue
features
markup
modules
render
standalone
utils
vendor
webcomponents
bootstrap.js
bootstrap.test.js
htmx.js
index.js
jquery.js
svg.js
svg.test.js
utils.js
utils.test.js
vitest.setup.js
svg
.air.toml
.changelog.yml
.dockerignore
.editorconfig
.eslintrc.yaml
.gitattributes
.gitignore
.gitpod.yml
.golangci.yml
.ignore
.markdownlint.yaml
.npmrc
.spectral.yaml
.stylelintrc.yaml
.yamllint.yaml
BSDmakefile
CHANGELOG.md
CODE_OF_CONDUCT.md
CONTRIBUTING.md
DCO
Dockerfile
Dockerfile.rootless
LICENSE
MAINTAINERS
Makefile
README.md
README_ZH.md
SECURITY.md
build.go
go.mod
go.sum
main.go
package-lock.json
package.json
playwright.config.js
poetry.lock
poetry.toml
pyproject.toml
vitest.config.js
webpack.config.js

The [recommended order](https://vuejs.org/guide/scaling-up/sfc.html) for SFC blocks is script -> template -> style, which we were violating because template and script were swapped. I do find script first also easier to read because the imports are on top, letting me immideatly see a component's dependencies. This is a pure cut-paste refactor with some removal of some empty lines. --------- Co-authored-by: Lauris BH <lauris@nix.lv>
70 lines
1.9 KiB
Vue
70 lines
1.9 KiB
Vue
<script>
|
|
import {CalendarHeatmap} from 'vue3-calendar-heatmap';
|
|
|
|
export default {
|
|
components: {CalendarHeatmap},
|
|
props: {
|
|
values: {
|
|
type: Array,
|
|
default: () => [],
|
|
},
|
|
locale: {
|
|
type: Object,
|
|
default: () => {},
|
|
}
|
|
},
|
|
data: () => ({
|
|
colorRange: [
|
|
'var(--color-secondary-alpha-60)',
|
|
'var(--color-secondary-alpha-60)',
|
|
'var(--color-primary-light-4)',
|
|
'var(--color-primary-light-2)',
|
|
'var(--color-primary)',
|
|
'var(--color-primary-dark-2)',
|
|
'var(--color-primary-dark-4)',
|
|
],
|
|
endDate: new Date(),
|
|
}),
|
|
mounted() {
|
|
// work around issue with first legend color being rendered twice and legend cut off
|
|
const legend = document.querySelector('.vch__external-legend-wrapper');
|
|
legend.setAttribute('viewBox', '12 0 80 10');
|
|
legend.style.marginRight = '-12px';
|
|
},
|
|
methods: {
|
|
handleDayClick(e) {
|
|
// Reset filter if same date is clicked
|
|
const params = new URLSearchParams(document.location.search);
|
|
const queryDate = params.get('date');
|
|
// Timezone has to be stripped because toISOString() converts to UTC
|
|
const clickedDate = new Date(e.date - (e.date.getTimezoneOffset() * 60000)).toISOString().substring(0, 10);
|
|
|
|
if (queryDate && queryDate === clickedDate) {
|
|
params.delete('date');
|
|
} else {
|
|
params.set('date', clickedDate);
|
|
}
|
|
|
|
params.delete('page');
|
|
|
|
const newSearch = params.toString();
|
|
window.location.search = newSearch.length ? `?${newSearch}` : '';
|
|
}
|
|
},
|
|
};
|
|
</script>
|
|
<template>
|
|
<div class="total-contributions">
|
|
{{ locale.contributions_in_the_last_12_months }}
|
|
</div>
|
|
<calendar-heatmap
|
|
:locale="locale"
|
|
:no-data-text="locale.no_contributions"
|
|
:tooltip-unit="locale.contributions"
|
|
:end-date="endDate"
|
|
:values="values"
|
|
:range-color="colorRange"
|
|
@day-click="handleDayClick($event)"
|
|
/>
|
|
</template>
|