Skip to content

Commit 8567d28

Browse files
gitboyzcfgitboyzcf
committed
master: Fixed 代码结构更改
1 parent 0dc38c4 commit 8567d28

File tree

10 files changed

+135
-55
lines changed

10 files changed

+135
-55
lines changed

‎README.md

+2-1
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,8 @@ pnpm build
5959
- 🌍 [API 采用模块化自动导入方式](https://blog.csdn.net/qq_43775179/article/details/134811292) 根据demo.js文件设置接口，以API_xxx_method的方式命名，在请求时无需导入 直接使用useRequest()函数返回参数以解构的方式获取，拿到即为写入的接口
6060

6161
- 💥 [Oxlint](https://oxc.rs/docs/guide/usage/linter.html)（英）+ [ESLint](https://eslint.org/)（英） - 双管齐下，享受高速度、强检查的代码格式化效果
62-
- 🐶 [husky](https://typicode.github.io/husky/zh/) + [lint-staged](https://github.com/lint-staged/lint-staged?tab=readme-ov-file#-lint-staged) - Git提交自动检测格式化代码，解放双手
62+
<!-- - 🐶 [husky](https://typicode.github.io/husky/zh/) + [lint-staged](https://github.com/lint-staged/lint-staged?tab=readme-ov-file#-lint-staged) - Git提交自动检测格式化代码，解放双手 -->
63+
- [autofit.js](https://auto-plugin.github.io/index/autofit.js/) - 大屏自适应工具，适配仅需一行代码
6364

6465
## 🍺 vscode 插件
6566

‎src/layout/LayoutMain.vue

+6
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,12 @@
66
<div class="layout-main-right absolute right-15px top-70px">
77
<slot name="right"></slot>
88
</div>
9+
<div class="layout-main-bottom w-50% absolute left-50% translate-x-[-50%] top-70px">
10+
<slot name="top"></slot>
11+
</div>
12+
<div class="layout-main-bottom w-50% absolute left-50% translate-x-[-50%] bottom--1066px">
13+
<slot name="bottom"></slot>
14+
</div>
915
</div>
1016
</template>
1117

‎src/layout/index.vue

+6
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,12 @@
1111
<template #right>
1212
<slot name="right"></slot>
1313
</template>
14+
<template #top>
15+
<slot name="top"></slot>
16+
</template>
17+
<template #bottom>
18+
<slot name="bottom"></slot>
19+
</template>
1420
</LayoutMain>
1521
</div>
1622
</template>

‎src/views/home/home.vue

+13-50
Original file line numberDiff line numberDiff line change
@@ -1,62 +1,25 @@
11
<template>
22
<Layout class="home">
33
<template #left>
4-
<div class="w-453px flex flex-col gap-15px relative">
5-
<Box title="概况" wHeader="60px">
6-
<TopBox />
7-
<!-- 地图返回键 -->
8-
<div
9-
class="absolute top-0 right--55px cursor-pointer w-40px h-25px"
10-
v-if="useHomeStore.isNull"
11-
@click="$mitt.emit('onPreLevel')"
12-
>
13-
<svg
14-
t="1731580007592"
15-
class="icon"
16-
viewBox="0 0 1024 1024"
17-
version="1.1"
18-
xmlns="http://www.w3.org/2000/svg"
19-
p-id="4534"
20-
width="100%"
21-
height="100%"
22-
>
23-
<path
24-
d="M658.261333 170.624H292.565333v-170.666667L0 255.957333l292.565333 256v-170.666666h365.696c124.330667 0 219.434667 110.933333 219.434667 256s-95.061333 256-219.434667 256H292.565333v170.666666h365.696c197.504 0 365.738667-187.733333 365.738667-426.666666s-160.938667-426.666667-365.738667-426.666667z"
25-
fill="#2A79D0"
26-
p-id="4535"
27-
></path>
28-
</svg>
29-
</div>
30-
</Box>
31-
<Box title="设备信息">
32-
<MiddleBox />
33-
</Box>
34-
<Box title="用户情况">
35-
<BottomBox />
36-
</Box>
37-
</div>
4+
<LeftBox />
385
</template>
396
<template #right>
40-
<div class="w-453px flex flex-col gap-15px">
41-
<Box title="报警中心">
42-
<RightTopBox />
43-
</Box>
44-
<Box title="报警类型TOP5" wHeader="124px">
45-
<RightBottomBox />
46-
</Box>
47-
</div>
7+
<RightBox />
8+
</template>
9+
<template #top>
10+
<MiddleTopBox />
11+
</template>
12+
<template #bottom>
13+
<MiddleBottomBox />
4814
</template>
4915
</Layout>
5016
</template>
5117

5218
<script setup>
5319
import Layout from '@/layout/index.vue'
54-
import TopBox from './leftbox/topBox.vue'
55-
import MiddleBox from './leftbox/middleBox.vue'
56-
import BottomBox from './leftbox/bottomBox.vue'
57-
import RightTopBox from './rightbox/topBox.vue'
58-
import RightBottomBox from './rightbox/bottomBox.vue'
59-
import { $mitt } from '@/utils'
60-
import { useOutsideHomeStore } from '@/stores/modules/home'
61-
const useHomeStore = useOutsideHomeStore()
20+
import LeftBox from './leftbox/index.vue'
21+
import RightBox from './rightbox/index.vue'
22+
23+
import MiddleTopBox from './middleTopBox/index.vue'
24+
import MiddleBottomBox from './middleBottomBox/index.vue'
6225
</script>

‎src/views/home/leftbox/index.vue

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<template>
2+
<div class="w-453px flex flex-col gap-15px relative overflow-hidden">
3+
<Box title="概况" wHeader="60px">
4+
<TopBox />
5+
</Box>
6+
<Box title="设备信息">
7+
<MiddleBox />
8+
</Box>
9+
<Box title="用户情况">
10+
<BottomBox />
11+
</Box>
12+
</div>
13+
</template>
14+
15+
<script setup>
16+
import TopBox from './topBox.vue'
17+
import MiddleBox from './middleBox.vue'
18+
import BottomBox from './bottomBox.vue'
19+
</script>

‎src/views/home/middleBottomBox/index.vue

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
<template>
2+
<div class="bottom-box bg-red text-center text-8"> 底部占位 </div>
3+
</template>
4+
5+
<script setup></script>

‎src/views/home/middleTopBox/index.vue

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
<template>
2+
<div class="middle-top-box relative w-full display flex justify-between">
3+
<!-- 地图返回键 -->
4+
<div
5+
class="absolute top-0 left-0 cursor-pointer w-40px h-25px"
6+
v-if="useHomeStore.isNull"
7+
@click="$mitt.emit('onPreLevel')"
8+
>
9+
<svg
10+
t="1731580007592"
11+
class="icon"
12+
viewBox="0 0 1024 1024"
13+
version="1.1"
14+
xmlns="http://www.w3.org/2000/svg"
15+
p-id="4534"
16+
width="100%"
17+
height="100%"
18+
>
19+
<path
20+
d="M658.261333 170.624H292.565333v-170.666667L0 255.957333l292.565333 256v-170.666666h365.696c124.330667 0 219.434667 110.933333 219.434667 256s-95.061333 256-219.434667 256H292.565333v170.666666h365.696c197.504 0 365.738667-187.733333 365.738667-426.666666s-160.938667-426.666667-365.738667-426.666667z"
21+
fill="#2A79D0"
22+
p-id="4535"
23+
></path>
24+
</svg>
25+
</div>
26+
</div>
27+
</template>
28+
29+
<script setup>
30+
import { $mitt } from '@/utils'
31+
import { useOutsideHomeStore } from '@/stores/modules/home'
32+
33+
const useHomeStore = useOutsideHomeStore()
34+
</script>

‎src/views/home/rightbox/index.vue

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<template>
2+
<div class="w-453px flex flex-col gap-15px relative overflow-hidden">
3+
<Box title="报警中心">
4+
<RightTopBox />
5+
</Box>
6+
<Box title="报警类型TOP5" wHeader="124px">
7+
<RightBottomBox />
8+
</Box>
9+
</div>
10+
</template>
11+
12+
<script setup>
13+
import RightTopBox from './topBox.vue'
14+
import RightBottomBox from './bottomBox.vue'
15+
</script>

‎unocss.config.js

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
import {
2+
defineConfig,
3+
presetAttributify,
4+
presetIcons,
5+
presetTypography,
6+
presetUno,
7+
presetWebFonts,
8+
transformerDirectives,
9+
transformerVariantGroup
10+
} from 'unocss'
11+
12+
// https://unocss.dev/guide/config-file
13+
export default defineConfig({
14+
shortcuts: [
15+
// ...
16+
],
17+
theme: {
18+
colors: {
19+
// ...
20+
}
21+
},
22+
presets: [
23+
presetUno(),
24+
presetAttributify(),
25+
presetIcons(),
26+
presetTypography(),
27+
presetWebFonts({
28+
fonts: {
29+
// ...
30+
}
31+
})
32+
],
33+
transformers: [transformerDirectives(), transformerVariantGroup()]
34+
})

‎vite.config.js

+1-4
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ import Icons from 'unplugin-icons/vite'
88
// import basicSsl from '@vitejs/plugin-basic-ssl'
99
import deletePlugin from 'rollup-plugin-delete'
1010
import Unocss from 'unocss/vite'
11-
import { presetUno, presetAttributify, presetIcons } from 'unocss'
1211
import { PrimeVueResolver } from '@primevue/auto-import-resolver'
1312

1413
// https://vitejs.dev/config/
@@ -39,9 +38,7 @@ export default ({ mode }) => {
3938
vue(),
4039
vueJsx(),
4140
// basicSsl(),
42-
Unocss({
43-
presets: [presetUno(), presetAttributify(), presetIcons()]
44-
}),
41+
Unocss({}),
4542
AutoImport({
4643
imports: [
4744
'vue',

0 commit comments

Comments
 (0)