1、添加自定义icon组件、空数据组件;2、添加数据持久化,方便web调试
parent
7db8a995b2
commit
601e687c48
@ -0,0 +1,85 @@
|
|||||||
|
@font-face {
|
||||||
|
font-family: "iconfont"; /* Project id */
|
||||||
|
src: url('./iconfont.ttf?t=1711616861841') format('truetype');
|
||||||
|
}
|
||||||
|
|
||||||
|
.iconfont {
|
||||||
|
font-family: "iconfont" !important;
|
||||||
|
font-size: 16px;
|
||||||
|
font-style: normal;
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
-moz-osx-font-smoothing: grayscale;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-tigan:before {
|
||||||
|
content: "\e62f";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-zuoye:before {
|
||||||
|
content: "\e625";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-erweima:before {
|
||||||
|
content: "\e624";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-daan:before {
|
||||||
|
content: "\e632";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-xiezuoye:before {
|
||||||
|
content: "\e626";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-empty:before {
|
||||||
|
content: "\e65f";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-shiti:before {
|
||||||
|
content: "\e665";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-shengban-shengji:before {
|
||||||
|
content: "\e643";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-zhishidian:before {
|
||||||
|
content: "\e723";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-xuesheng:before {
|
||||||
|
content: "\e67c";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-banji:before {
|
||||||
|
content: "\e61a";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-jiexi:before {
|
||||||
|
content: "\e769";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-xuehao:before {
|
||||||
|
content: "\e666";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-denglu:before {
|
||||||
|
content: "\e6bd";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-lianxi2hebing_dayin:before {
|
||||||
|
content: "\e630";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-dayinyulan:before {
|
||||||
|
content: "\e601";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-a-kaoshi4:before {
|
||||||
|
content: "\eb09";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-yulan:before {
|
||||||
|
content: "\e678";
|
||||||
|
}
|
||||||
|
|
Binary file not shown.
@ -1,2 +1,3 @@
|
|||||||
@import './common.scss';
|
@import './common.scss';
|
||||||
@import './content.scss';
|
@import './content.scss';
|
||||||
|
@import './fonts/iconfont.css';
|
@ -0,0 +1,3 @@
|
|||||||
|
.ch-empty {
|
||||||
|
padding: 60rpx 60rpx;
|
||||||
|
}
|
@ -0,0 +1,12 @@
|
|||||||
|
<template>
|
||||||
|
<ch-flex class="ch-empty" justify="center" items="center">
|
||||||
|
<ch-icon name="empty" :size="100" color="#bbb"></ch-icon>
|
||||||
|
</ch-flex>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup name="ch-empty">
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import './ch-empty.scss';
|
||||||
|
</style>
|
@ -0,0 +1,35 @@
|
|||||||
|
<template>
|
||||||
|
<text class="ch-icon iconfont" :class="iconCls" :style="style">
|
||||||
|
</text>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup name="ch-icon">
|
||||||
|
import { computed, defineProps } from 'vue';
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
size: {
|
||||||
|
type: Number,
|
||||||
|
default: 28
|
||||||
|
},
|
||||||
|
name: {
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
},
|
||||||
|
color: {
|
||||||
|
type: String,
|
||||||
|
default: '#666'
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
const iconCls = computed(() => {
|
||||||
|
return props.name ? `icon-${props.name}` : ''
|
||||||
|
})
|
||||||
|
|
||||||
|
const style = computed(() => {
|
||||||
|
return `font-size: ${props.size}px; color: ${props.color}`
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
|
||||||
|
</style>
|
@ -1,7 +1,10 @@
|
|||||||
import ChNavBar from '@/components/ch-nav-bar/ch-nav-bar.vue'
|
import ChNavBar from '@/components/ch-nav-bar/ch-nav-bar.vue'
|
||||||
import ChNavBtn from '@/components/ch-nav-btn/ch-nav-btn.vue'
|
import ChNavBtn from '@/components/ch-nav-btn/ch-nav-btn.vue'
|
||||||
|
import ChIcon from '@/components/ch-icon/ch-icon.vue';
|
||||||
|
import ChEmpty from '@/components/ch-empty/ch-empty.vue';
|
||||||
|
|
||||||
export default function registerComponents (app) {
|
export default function registerComponents (app) {
|
||||||
app.component(ChNavBar.name, ChNavBar);
|
app.component(ChNavBar.name, ChNavBar);
|
||||||
app.component(ChNavBtn.name, ChNavBtn);
|
app.component(ChNavBtn.name, ChNavBtn);
|
||||||
|
app.component(ChIcon.name, ChIcon)
|
||||||
}
|
}
|
Loading…
Reference in New Issue