Skip to content

Commit

Permalink
conf: add git hooks for formatting (#113)
Browse files Browse the repository at this point in the history
  • Loading branch information
swpfY authored Dec 31, 2023
1 parent 300178b commit 8ab9f51
Show file tree
Hide file tree
Showing 7 changed files with 189 additions and 166 deletions.
3 changes: 3 additions & 0 deletions .husky/pre-commit
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

4 changes: 4 additions & 0 deletions .husky/pre-push
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

npm run fmt
207 changes: 102 additions & 105 deletions .vscode/swanlab.code-snippets
Original file line number Diff line number Diff line change
Expand Up @@ -19,10 +19,7 @@
"prefix": "comm",
"scope": "python",
"description": "python文件块注释",
"body": [
"# ---------------------------------- $1 ----------------------------------",
"$2"
]
"body": ["# ---------------------------------- $1 ----------------------------------", "$2"]
},
"frontend-comment": {
"prefix": ["comment", "comm"],
Expand All @@ -35,105 +32,105 @@
"prefix": "vue",
"description": "vue文件模板",
"body": [
"<template> </template>",
"",
"<script setup>"
"/**",
" * @description: $1",
" * @file: ${TM_FILENAME} ",
" * @since: ${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE} ${CURRENT_HOUR}:${CURRENT_MINUTE}:${CURRENT_SECOND} ",
"**/"
"$2"
"</script>",
"",
"<style lang=\"scss\" scoped></style>",
""
],
},
"vue-chart": {
"prefix": "vue-chart",
"body": [
"<template>",
" <!-- 图表标题 -->",
" <p class=\"text-center font-semibold\">{{ title }}</p>",
" <!-- 如果图表数据错误 -->",
" <div class=\"flex flex-col justify-center grow text-dimmer gap-2\" v-if=\"error\">",
" <SLIcon class=\"mx-auto h-5 w-5\" icon=\"error\" />",
" <p class=\"text-center text-xs\">",
" <!-- 在此处显示错误信息 -->",
" </p>",
" </div>",
" <!-- 如果图表数据正确 -->",
" <template v-else>",
" <!-- 在此处完成图表主体定义 -->",
" <!-- 放大效果弹窗 -->",
" <SLModal class=\"p-10 pt-0 overflow-hidden\" max-w=\"-1\" v-model=\"isZoom\"> </SLModal>",
" </template>",
"</template>",
"",
"<script setup>",
"/**",
" * @description: $1",
" * @file: ${TM_FILENAME} ",
" * @since: ${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE} ${CURRENT_HOUR}:${CURRENT_MINUTE}:${CURRENT_SECOND} ",
"**/",
"import SLModal from '@swanlab-vue/components/SLModal.vue'",
"import SLIcon from '@swanlab-vue/components/SLIcon.vue'",
"import { ref } from 'vue'",
"import { useExperimentStroe } from '@swanlab-vue/store'",
"import { addTaskToBrowserMainThread } from '@swanlab-vue/utils/browser'",
"import * as UTILS from './utils'",
"",
"// ---------------------------------- 配置 ----------------------------------",
"const experimentStore = useExperimentStroe()",
"const props = defineProps({",
" title: {",
" type: String,",
" required: true",
" },",
" chart: {",
" type: Object,",
" required: true",
" }",
"})",
"",
"// ---------------------------------- 错误处理,如果chart.error存在,则下面的api都将不应该被执行 ----------------------------------",
"",
"const error = ref(props.chart.error)",
"",
"// ---------------------------------- 组件渲染逻辑 ----------------------------------",
"",
"// ---------------------------------- 数据格式化 ----------------------------------",
"",
"// ---------------------------------- 渲染、重渲染功能 ----------------------------------",
"",
"// 渲染",
"const render = (data) => {}",
"// 重渲染",
"const change = (data) => {}",
"",
"// ---------------------------------- 放大功能 ----------------------------------",
"// 是否放大",
"const isZoom = ref(false)",
"// 放大数据",
"const zoom = (data) => {",
" isZoom.value = true",
" // 放大后图表的高度",
" const height = window.innerHeight * 0.6",
" addTaskToBrowserMainThread(() => {})",
"}",
"",
"// ---------------------------------- 暴露api ----------------------------------",
"defineExpose({",
" render,",
" change,",
" zoom",
"})",
"</script>",
"",
"<style lang=\"scss\" scoped></style>",
""
],
"description": "vue-chart"
}
"<template> </template>",
"",
"<script setup>",
"/**",
" * @description: $1",
" * @file: ${TM_FILENAME} ",
" * @since: ${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE} ${CURRENT_HOUR}:${CURRENT_MINUTE}:${CURRENT_SECOND} ",
"**/",
"$2",
"</script>",
"",
"<style lang=\"scss\" scoped></style>",
""
]
},
"vue-chart": {
"prefix": "vue-chart",
"body": [
"<template>",
" <!-- 图表标题 -->",
" <p class=\"text-center font-semibold\">{{ title }}</p>",
" <!-- 如果图表数据错误 -->",
" <div class=\"flex flex-col justify-center grow text-dimmer gap-2\" v-if=\"error\">",
" <SLIcon class=\"mx-auto h-5 w-5\" icon=\"error\" />",
" <p class=\"text-center text-xs\">",
" <!-- 在此处显示错误信息 -->",
" </p>",
" </div>",
" <!-- 如果图表数据正确 -->",
" <template v-else>",
" <!-- 在此处完成图表主体定义 -->",
" <!-- 放大效果弹窗 -->",
" <SLModal class=\"p-10 pt-0 overflow-hidden\" max-w=\"-1\" v-model=\"isZoom\"> </SLModal>",
" </template>",
"</template>",
"",
"<script setup>",
"/**",
" * @description: $1",
" * @file: ${TM_FILENAME} ",
" * @since: ${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE} ${CURRENT_HOUR}:${CURRENT_MINUTE}:${CURRENT_SECOND} ",
"**/",
"import SLModal from '@swanlab-vue/components/SLModal.vue'",
"import SLIcon from '@swanlab-vue/components/SLIcon.vue'",
"import { ref } from 'vue'",
"import { useExperimentStroe } from '@swanlab-vue/store'",
"import { addTaskToBrowserMainThread } from '@swanlab-vue/utils/browser'",
"import * as UTILS from './utils'",
"",
"// ---------------------------------- 配置 ----------------------------------",
"const experimentStore = useExperimentStroe()",
"const props = defineProps({",
" title: {",
" type: String,",
" required: true",
" },",
" chart: {",
" type: Object,",
" required: true",
" }",
"})",
"",
"// ---------------------------------- 错误处理,如果chart.error存在,则下面的api都将不应该被执行 ----------------------------------",
"",
"const error = ref(props.chart.error)",
"",
"// ---------------------------------- 组件渲染逻辑 ----------------------------------",
"",
"// ---------------------------------- 数据格式化 ----------------------------------",
"",
"// ---------------------------------- 渲染、重渲染功能 ----------------------------------",
"",
"// 渲染",
"const render = (data) => {}",
"// 重渲染",
"const change = (data) => {}",
"",
"// ---------------------------------- 放大功能 ----------------------------------",
"// 是否放大",
"const isZoom = ref(false)",
"// 放大数据",
"const zoom = (data) => {",
" isZoom.value = true",
" // 放大后图表的高度",
" const height = window.innerHeight * 0.6",
" addTaskToBrowserMainThread(() => {})",
"}",
"",
"// ---------------------------------- 暴露api ----------------------------------",
"defineExpose({",
" render,",
" change,",
" zoom",
"})",
"</script>",
"",
"<style lang=\"scss\" scoped></style>",
""
],
"description": "vue-chart"
}
}
108 changes: 54 additions & 54 deletions .vscode/tailwind.json
Original file line number Diff line number Diff line change
@@ -1,55 +1,55 @@
{
"version": 1.1,
"atDirectives": [
{
"name": "@tailwind",
"description": "Use the `@tailwind` directive to insert Tailwind's `base`, `components`, `utilities` and `screens` styles into your CSS.",
"references": [
{
"name": "Tailwind Documentation",
"url": "https://tailwindcss.com/docs/functions-and-directives#tailwind"
}
]
},
{
"name": "@apply",
"description": "Use the `@apply` directive to inline any existing utility classes into your own custom CSS. This is useful when you find a common utility pattern in your HTML that you’d like to extract to a new component.",
"references": [
{
"name": "Tailwind Documentation",
"url": "https://tailwindcss.com/docs/functions-and-directives#apply"
}
]
},
{
"name": "@responsive",
"description": "You can generate responsive variants of your own classes by wrapping their definitions in the `@responsive` directive:\n```css\n@responsive {\n .alert {\n background-color: #E53E3E;\n }\n}\n```\n",
"references": [
{
"name": "Tailwind Documentation",
"url": "https://tailwindcss.com/docs/functions-and-directives#responsive"
}
]
},
{
"name": "@screen",
"description": "The `@screen` directive allows you to create media queries that reference your breakpoints by **name** instead of duplicating their values in your own CSS:\n```css\n@screen sm {\n /* ... */\n}\n```\n…gets transformed into this:\n```css\n@media (min-width: 640px) {\n /* ... */\n}\n```\n",
"references": [
{
"name": "Tailwind Documentation",
"url": "https://tailwindcss.com/docs/functions-and-directives#screen"
}
]
},
{
"name": "@variants",
"description": "Generate `hover`, `focus`, `active` and other **variants** of your own utilities by wrapping their definitions in the `@variants` directive:\n```css\n@variants hover, focus {\n .btn-brand {\n background-color: #3182CE;\n }\n}\n```\n",
"references": [
{
"name": "Tailwind Documentation",
"url": "https://tailwindcss.com/docs/functions-and-directives#variants"
}
]
}
]
}
"version": 1.1,
"atDirectives": [
{
"name": "@tailwind",
"description": "Use the `@tailwind` directive to insert Tailwind's `base`, `components`, `utilities` and `screens` styles into your CSS.",
"references": [
{
"name": "Tailwind Documentation",
"url": "https://tailwindcss.com/docs/functions-and-directives#tailwind"
}
]
},
{
"name": "@apply",
"description": "Use the `@apply` directive to inline any existing utility classes into your own custom CSS. This is useful when you find a common utility pattern in your HTML that you’d like to extract to a new component.",
"references": [
{
"name": "Tailwind Documentation",
"url": "https://tailwindcss.com/docs/functions-and-directives#apply"
}
]
},
{
"name": "@responsive",
"description": "You can generate responsive variants of your own classes by wrapping their definitions in the `@responsive` directive:\n```css\n@responsive {\n .alert {\n background-color: #E53E3E;\n }\n}\n```\n",
"references": [
{
"name": "Tailwind Documentation",
"url": "https://tailwindcss.com/docs/functions-and-directives#responsive"
}
]
},
{
"name": "@screen",
"description": "The `@screen` directive allows you to create media queries that reference your breakpoints by **name** instead of duplicating their values in your own CSS:\n```css\n@screen sm {\n /* ... */\n}\n```\n…gets transformed into this:\n```css\n@media (min-width: 640px) {\n /* ... */\n}\n```\n",
"references": [
{
"name": "Tailwind Documentation",
"url": "https://tailwindcss.com/docs/functions-and-directives#screen"
}
]
},
{
"name": "@variants",
"description": "Generate `hover`, `focus`, `active` and other **variants** of your own utilities by wrapping their definitions in the `@variants` directive:\n```css\n@variants hover, focus {\n .btn-brand {\n background-color: #3182CE;\n }\n}\n```\n",
"references": [
{
"name": "Tailwind Documentation",
"url": "https://tailwindcss.com/docs/functions-and-directives#variants"
}
]
}
]
}
7 changes: 5 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,9 @@
"dev:mock": "vite --mode mock",
"build": "vite build",
"build.release": "vite build --mode release",
"preview": "vite preview"
"preview": "vite preview",
"fmt": "npx prettier --write .",
"prepare": "husky install"
},
"dependencies": {
"@antv/g2plot": "^2.4.31",
Expand Down Expand Up @@ -36,6 +38,7 @@
"tailwindcss": "^3.3.5",
"unplugin-auto-import": "^0.15.2",
"unplugin-vue-components": "^0.24.1",
"vite": "^5.0.0"
"vite": "^5.0.0",
"husky": "^8.0.0"
}
}
8 changes: 4 additions & 4 deletions vue/src/i18n/en-US/sider.json
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
{
"version": {
"version": {
"version": "Current Version: v{version}, View",
"updates": "Release Notes"
},
"nav": {
},
"nav": {
"home": "Overview",
"search": "Search Experiments...",
"experiment": "Experiment",
"help": "Help"
}
}
}
18 changes: 17 additions & 1 deletion vue/src/theme/color.min.css
Original file line number Diff line number Diff line change
@@ -1 +1,17 @@
:root{--background-overlay:rgba(15,21,36,0.8);--background-default:#ffffff;--background-dimmer:#f6f8fa;--outline-default:#d1d7dd;--foreground-default:#000000;--foreground-dimmer:#555555;--foreground-dimmest:#858585;--positive-highest:#d5e4d9;--positive-higher:#cff1d8;--positive-default:#4e9553;--positive-dimmer:#37733c;--primary-default:#1c74dd;--primary-dimmest:#d6e8ff;--negative-default:#bb4c51;--nagative-dimmest:#eddcdc}
:root {
--background-overlay: rgba(15, 21, 36, 0.8);
--background-default: #ffffff;
--background-dimmer: #f6f8fa;
--outline-default: #d1d7dd;
--foreground-default: #000000;
--foreground-dimmer: #555555;
--foreground-dimmest: #858585;
--positive-highest: #d5e4d9;
--positive-higher: #cff1d8;
--positive-default: #4e9553;
--positive-dimmer: #37733c;
--primary-default: #1c74dd;
--primary-dimmest: #d6e8ff;
--negative-default: #bb4c51;
--nagative-dimmest: #eddcdc;
}

0 comments on commit 8ab9f51

Please sign in to comment.