Skip to content

Commit 4bccda4

Browse files
hoorayhooray
committed
feat: 增加图片支持，整站图标改用 unocss icon 方式使用，方便在内网环境使用
1 parent 66d9e31 commit 4bccda4

File tree

26 files changed

+80
-131
lines changed

26 files changed

+80
-131
lines changed

‎scripts/generate.icons.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import path from 'node:path'
22
import process from 'node:process'
3+
import { exec } from 'node:child_process'
34
import fs from 'fs-extra'
45
import inquirer from 'inquirer'
56
import { lookupCollection, lookupCollections } from '@iconify/json'
@@ -74,6 +75,8 @@ async function generateIcons() {
7475
path.resolve(process.cwd(), 'src/iconify/data.json'),
7576
collectionsMeta,
7677
)
78+
79+
exec('eslint src/iconify/data.json src/iconify/index.json --cache --fix')
7780
})
7881
}
7982

‎src/components/FileUpload/index.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -73,7 +73,7 @@ const onSuccess: UploadProps['onSuccess'] = (res, file, fileList) => {
7373
drag
7474
>
7575
<div class="slot">
76-
<SvgIcon name="ep:upload-filled" class="el-icon--upload" />
76+
<SvgIcon name="i-ep:upload-filled" class="el-icon--upload" />
7777
<div class="el-upload__text">
7878
将文件拖到此处，或<em>点击上传</em>
7979
</div>

‎src/components/ImageUpload/index.vue

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -103,7 +103,7 @@ const onSuccess: UploadProps['onSuccess'] = (res) => {
103103
<ElImage v-if="url === ''" :src="url === '' ? placeholder : url" :style="`width:${width}px;height:${height}px;`" fit="fill">
104104
<template #error>
105105
<div class="image-slot" :style="`width:${width}px;height:${height}px;`">
106-
<SvgIcon name="ep:plus" class="icon" />
106+
<SvgIcon name="i-ep:plus" class="icon" />
107107
</div>
108108
</template>
109109
</ElImage>
@@ -112,10 +112,10 @@ const onSuccess: UploadProps['onSuccess'] = (res) => {
112112
<div class="mask">
113113
<div class="actions">
114114
<span title="预览" @click.stop="preview">
115-
<SvgIcon name="ep:zoom-in" class="icon" />
115+
<SvgIcon name="i-ep:zoom-in" class="icon" />
116116
</span>
117117
<span title="移除" @click.stop="remove">
118-
<SvgIcon name="ep:delete" class="icon" />
118+
<SvgIcon name="i-ep:delete" class="icon" />
119119
</span>
120120
</div>
121121
</div>

‎src/components/ImagesUpload/index.vue

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -107,16 +107,16 @@ const onSuccess: UploadProps['onSuccess'] = (res) => {
107107
<div class="mask">
108108
<div class="actions">
109109
<span title="预览" @click="preview(index)">
110-
<SvgIcon name="ep:zoom-in" class="icon" />
110+
<SvgIcon name="i-ep:zoom-in" class="icon" />
111111
</span>
112112
<span title="移除" @click="remove(index)">
113-
<SvgIcon name="ep:delete" class="icon" />
113+
<SvgIcon name="i-ep:delete" class="icon" />
114114
</span>
115115
<span v-show="url.length > 1" title="左移" :class="{ disabled: index === 0 }" @click="move(index, 'left')">
116-
<SvgIcon name="ep:back" class="icon" />
116+
<SvgIcon name="i-ep:back" class="icon" />
117117
</span>
118118
<span v-show="url.length > 1" title="右移" :class="{ disabled: index === url.length - 1 }" @click="move(index, 'right')">
119-
<SvgIcon name="ep:right" class="icon" />
119+
<SvgIcon name="i-ep:right" class="icon" />
120120
</span>
121121
</div>
122122
</div>
@@ -135,7 +135,7 @@ const onSuccess: UploadProps['onSuccess'] = (res) => {
135135
class="images-upload"
136136
>
137137
<div class="image-slot" :style="`width:${width}px;height:${height}px;`">
138-
<SvgIcon name="ep:plus" class="icon" />
138+
<SvgIcon name="i-ep:plus" class="icon" />
139139
</div>
140140
<div v-show="uploadData.progress.percent" class="progress" :style="`width:${width}px;height:${height}px;`">
141141
<ElImage :src="uploadData.progress.preview" :style="`width:${width}px;height:${height}px;`" fit="fill" />

‎src/components/PageMain/index.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ function unCollaspe() {
4141
<slot />
4242
</div>
4343
<div v-if="isCollaspe" class="collaspe absolute bottom-0 w-full cursor-pointer from-transparent to-[var(--g-app-bg)] bg-gradient-to-b pb-2 pt-10 text-center" @click="unCollaspe">
44-
<SvgIcon name="ep:arrow-down" class="text-xl op-30 transition-opacity hover:op-100" />
44+
<SvgIcon name="i-ep:arrow-down" class="text-xl op-30 transition-opacity hover:op-100" />
4545
</div>
4646
</div>
4747
</template>

‎src/components/SearchBar/index.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ function toggle() {
4040
<slot :fold="fold" :toggle="toggle" />
4141
<div v-if="showToggle" class="absolute bottom-0 left-0 w-full translate-y-1/2 text-center">
4242
<button class="h-5 inline-flex cursor-pointer select-none items-center border-size-0 rounded bg-[var(--g-main-bg)] px-2 text-xs font-medium outline-none" @click="toggle">
43-
<SvgIcon :name="fold ? 'ep:caret-bottom' : 'ep:caret-top' " />
43+
<SvgIcon :name="fold ? 'i-ep:caret-bottom' : 'i-ep:caret-top' " />
4444
</button>
4545
</div>
4646
</div>

‎src/components/SvgIcon/index.vue

Lines changed: 12 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,42 +1,30 @@
11
<script setup lang="ts">
22
import { Icon } from '@iconify/vue'
3-
import { isOfflineUse } from '@/iconify/index.json'
43
54
defineOptions({
65
name: 'SvgIcon',
76
})
87
98
const props = defineProps<{
109
name: string
11-
async?: boolean
1210
flip?: 'horizontal' | 'vertical' | 'both'
1311
rotate?: number
1412
color?: string
1513
size?: string | number
1614
}>()
1715
1816
const outputType = computed(() => {
19-
if (props.name.indexOf('i-') === 0) {
20-
return (props.async || isOfflineUse) ? 'svg' : 'css'
17+
if (/^https?:\/\//.test(props.name)) {
18+
return 'img'
2119
}
22-
else if (props.name.includes(':')) {
23-
return 'svg'
20+
else if (/i-[^:]+:[^:]+/.test(props.name)) {
21+
return 'unocss'
2422
}
25-
else {
26-
return 'custom'
27-
}
28-
})
29-
30-
const outputName = computed(() => {
31-
if (props.name.indexOf('i-') === 0) {
32-
let conversionName = props.name
33-
if (props.async || isOfflineUse) {
34-
conversionName = conversionName.replace('i-', '')
35-
}
36-
return conversionName
23+
else if (props.name.includes(':')) {
24+
return 'iconify'
3725
}
3826
else {
39-
return props.name
27+
return 'svg'
4028
}
4129
})
4230
@@ -68,11 +56,11 @@ const style = computed(() => {
6856
</script>
6957

7058
<template>
71-
<i class="relative h-[1em] w-[1em] flex-inline items-center justify-center fill-current leading-[1em]" :style="style">
72-
<i v-if="outputType === 'css'" :class="outputName" />
73-
<Icon v-else-if="outputType === 'svg'" :icon="outputName" />
74-
<svg v-else h-1em w-1em aria-hidden="true">
75-
<use :xlink:href="`#icon-${outputName}`" />
59+
<i class="relative h-[1em] w-[1em] flex-inline items-center justify-center fill-current leading-[1em]" :class="{ [name]: outputType === 'unocss' }" :style="style">
60+
<Icon v-if="outputType === 'iconify'" :icon="name" />
61+
<svg v-else-if="outputType === 'svg'" class="h-[1em] w-[1em]" aria-hidden="true">
62+
<use :xlink:href="`#icon-${name}`" />
7663
</svg>
64+
<img v-else-if="outputType === 'img'" :src="name" class="h-[1em] w-[1em]">
7765
</i>
7866
</template>

‎src/components/Trend/index.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,6 @@ const isUp = computed(() => {
3333
<span v-if="prefix" class="prefix">{{ prefix }}</span>
3434
<span class="text">{{ value }}</span>
3535
<span v-if="suffix" class="suffix">{{ suffix }}</span>
36-
<SvgIcon name="ep:caret-top" :rotate="isUp ? 0 : 180" class="ml-1 transition" />
36+
<SvgIcon name="i-ep:caret-top" :rotate="isUp ? 0 : 180" class="ml-1 transition" />
3737
</div>
3838
</template>

‎src/iconify/data.json

Lines changed: 1 addition & 1 deletion
Large diffs are not rendered by default.

‎src/iconify/index.json

100644100755
File mode changed.

0 commit comments

Comments
 (0)