wenyongda/ZRAdmin-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改svg图标属性名

Browse Source
This commit is contained in:
不做码农 2022-04-28 09:02:17 +08:00
parent 932d963b61
commit 294f13903e
17 changed files with 43 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/assets/styles/variables.module.scss
View File

@ -8,6 +8,13 @@ $tiffany: #4AB7BD;
$yellow: #FEC171;
$panGreen: #30B08F;
:root {
--base-menu-color: #bfcbd9;
--base-menu-color-active: #f4f4f5;
--base-menu-background: #304156;
--base-logo-title-color: #ffffff;
--base-topBar-background: #ffffff;
}
// 默认菜单主题风格
$base-menu-color: #bfcbd9;
$base-menu-color-active: #f4f4f5;

4
src/components/FileUpload/index.vue
View File

@ -43,7 +43,7 @@
<transition-group class="upload-file-list el-upload-list el-upload-list--text" name="el-fade-in-linear" tag="ul">
<li :key="file.uid" class="el-upload-list__item ele-upload-list__item-content" v-for="(file, index) in fileList">
<el-link :href="`${file.url}`" :underline="false" target="_blank">
<svg-icon class-name="doc-icon" icon-class="documentation" />
<svg-icon class-name="doc-icon" name="documentation" />
{{ file.name }}
</el-link>
<div class="ele-upload-list__item-content-action">
@ -89,8 +89,6 @@ const props = defineProps({
type: Boolean,
default: true,
},
// form 列名
column: [String],
// 上传携带的参数
data: {
type: Object,

2
src/components/HeaderSearch/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div :class="{ 'show': show }" class="header-search">
<svg-icon class-name="search-icon" icon-class="search" @click.stop="click" />
<svg-icon class-name="search-icon" name="search" @click.stop="click" />
<el-select
ref="headerSearchSelectRef"
v-model="search"

4
src/components/IconSelect/index.vue
View File

@ -16,7 +16,7 @@
<el-tab-pane label="svg-icon" name="1">
<div class="icon-list">
<div class="icon-item mb10" v-for="(item, index) in iconList" :key="index" @click="selectedIcon(item)">
<svg-icon :icon-class="item" style="height: 30px; width: 16px" />
<svg-icon :name="item" style="height: 30px; width: 16px" />
<div class="name">{{ item }}</div>
</div>
</div>
@ -24,7 +24,7 @@
<el-tab-pane label="Element-UI Icons" name="2">
<div class="icon-list">
<div class="icon-item mb10" v-for="item of elementIcons" :key="item" @click="selectedIcon(item, 'ele-')">
<svg-icon :icon-class="'ele-' + item" style="height: 30px; width: 16px" />
<svg-icon :name="'ele-' + item" style="height: 30px; width: 16px" />
<div class="name">{{ item }}</div>
</div>
</div>

2
src/components/Screenfull/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div>
<svg-icon :icon-class="isFullscreen ? 'exit-fullscreen' : 'fullscreen'" @click="toggle" />
<svg-icon :name="isFullscreen ? 'exit-fullscreen' : 'fullscreen'" @click="toggle" />
</div>
</template>

2
src/components/SizeSelect/index.vue
View File

@ -1,7 +1,7 @@
<template>
<div>
<el-dropdown trigger="hover" @command="handleSetSize" style="vertical-align: middle">
<svg-icon class-name="size-icon" icon-class="size" />
<svg-icon class-name="size-icon" name="size" />
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item v-for="item of sizeOptions" :key="item.value" :disabled="size === item.value" :command="item.value">

11
src/components/SvgIcon/index.vue
View File

@ -8,9 +8,10 @@
<script>
export default defineComponent({
props: {
iconClass: {
name: {
type: String,
required: true,
default: '',
},
className: {
type: String,
@ -24,17 +25,17 @@ export default defineComponent({
setup(props) {
return {
iconType: computed(() => {
if (props.iconClass.startsWith('ele')) {
if (props.name.startsWith('ele')) {
return 1
} else {
return 0
}
}),
iconName: computed(() => {
if (props.iconClass?.startsWith('ele-')) {
return props.iconClass.replace('ele-', '')
if (props.name?.startsWith('ele-')) {
return props.name.replace('ele-', '')
} else {
return `#icon-${props.iconClass}`
return `#icon-${props.name}`
}
}),
svgClass: computed(() => {

4
src/components/TopNav/index.vue
View File

@ -2,7 +2,7 @@
<el-menu :default-active="activeMenu" mode="horizontal" @select="handleSelect" :ellipsis="false">
<template v-for="(item, index) in topMenus">
<el-menu-item :style="{'--theme': theme}" :index="item.path" :key="index" v-if="index < visibleNumber">
<svg-icon :icon-class="item.meta.icon" />
<svg-icon :name="item.meta.icon" />
&nbsp;{{ item.meta.title }}
</el-menu-item>
</template>
@ -12,7 +12,7 @@
<template #title>更多菜单</template>
<template v-for="(item, index) in topMenus">
<el-menu-item :index="item.path" :key="index" v-if="index >= visibleNumber">
<svg-icon :icon-class="item.meta.icon" />
<svg-icon :name="item.meta.icon" />
{{ item.meta.title }}
</el-menu-item>
</template>

2
src/components/Zr/Doc/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div>
<svg-icon icon-class="question" @click="goto"/>
<svg-icon name="question" @click="goto"/>
</div>
</template>
<script setup>

2
src/components/Zr/Git/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div>
<svg-icon icon-class="github" @click="goto" />
<svg-icon name="github" @click="goto" />
</div>
</template>
<script>

4
src/layout/components/Sidebar/SidebarItem.vue
View File

@ -3,7 +3,7 @@
<template v-if="hasOneShowingChild(item.children, item) && (!onlyOneChild.children || onlyOneChild.noShowingChildren) && !item.alwaysShow">
<app-link v-if="onlyOneChild.meta" :to="resolvePath(onlyOneChild.path, onlyOneChild.query)">
<el-menu-item :index="resolvePath(onlyOneChild.path)" :class="{ 'submenu-title-noDropdown': !isNest }">
<svg-icon :icon-class="onlyOneChild.meta.icon || (item.meta && item.meta.icon)" />
<svg-icon :name="onlyOneChild.meta.icon || (item.meta && item.meta.icon)" />
<template v-if="onlyOneChild.meta.title" #title>
<span>{{ onlyOneChild.meta.title }}</span>
</template>
@ -13,7 +13,7 @@
<el-sub-menu v-else ref="subMenu" :index="resolvePath(item.path)" popper-append-to-body>
<template v-slot:title>
<svg-icon :icon-class="item.meta && item.meta.icon" />
<svg-icon :name="item.meta && item.meta.icon" />
<span v-if="item.meta && item.meta.title">{{ item.meta.title }}</span>
</template>

4
src/views/components/icons/index.vue
View File

@ -6,7 +6,7 @@
<el-tooltip placement="top">
<template #content> {{ generateIconCode(item) }} </template>
<div class="icon-item">
<svg-icon :icon-class="item" style="height: 40px; width: 40px" />
<svg-icon :name="item" style="height: 40px; width: 40px" />
</div>
</el-tooltip>
</div>
@ -37,7 +37,7 @@ for (const key in elIcons) {
}
function generateIconCode(symbol) {
return `<svg-icon icon-class="${symbol}" />`
return `<svg-icon name="${symbol}" />`
}
function generateElementIconCode(symbol) {
return `<el-icon><${symbol} /></el-icon>`

8
src/views/dashboard/PanelGroup.vue
View File

@ -3,7 +3,7 @@
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
<div class="card-panel" @click="handleSetLineChartData('newVisitis')">
<div class="card-panel-icon-wrapper icon-people">
<svg-icon icon-class="peoples" class-name="card-panel-icon" />
<svg-icon name="peoples" class-name="card-panel-icon" />
</div>
<div class="card-panel-description">
<div class="card-panel-text" v-waves>在线用户</div>
@ -14,7 +14,7 @@
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
<div class="card-panel" @click="handleSetLineChartData('messages')">
<div class="card-panel-icon-wrapper icon-message">
<svg-icon icon-class="message" class-name="card-panel-icon" />
<svg-icon name="message" class-name="card-panel-icon" />
</div>
<div class="card-panel-description">
<div class="card-panel-text" v-waves>消息</div>
@ -25,7 +25,7 @@
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
<div class="card-panel" @click="handleSetLineChartData('purchases')">
<div class="card-panel-icon-wrapper icon-money">
<svg-icon icon-class="money" class-name="card-panel-icon" />
<svg-icon name="money" class-name="card-panel-icon" />
</div>
<div class="card-panel-description">
<div class="card-panel-text" v-waves>金额</div>
@ -36,7 +36,7 @@
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
<div class="card-panel" @click="handleSetLineChartData('shoppings')">
<div class="card-panel-icon-wrapper icon-shopping">
<svg-icon icon-class="shopping" class-name="card-panel-icon" />
<svg-icon name="shopping" class-name="card-panel-icon" />
</div>
<div class="card-panel-description">
<div class="card-panel-text" v-waves>订单</div>

6
src/views/login.vue
View File

@ -6,21 +6,21 @@
<el-form-item prop="username">
<el-input v-model="loginForm.username" type="text" size="large" auto-complete="off" placeholder="账号">
<template #prefix>
<svg-icon icon-class="user" class="el-input__icon input-icon" />
<svg-icon name="user" class="el-input__icon input-icon" />
</template>
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input v-model="loginForm.password" type="password" size="large" auto-complete="off" placeholder="密码" @keyup.enter="handleLogin">
<template #prefix>
<svg-icon icon-class="password" class="el-input__icon input-icon" />
<svg-icon name="password" class="el-input__icon input-icon" />
</template>
</el-input>
</el-form-item>
<el-form-item prop="code" v-if="captchaOnOff != 'off'">
<el-input v-model="loginForm.code" size="large" auto-complete="off" placeholder="验证码" style="width: 63%" @keyup.enter="handleLogin">
<template #prefix>
<svg-icon icon-class="validCode" class="el-input__icon input-icon" />
<svg-icon name="validCode" class="el-input__icon input-icon" />
</template>
</el-input>
<div class="login-code">

4
src/views/system/menu/index.vue
View File

@ -37,7 +37,7 @@
<el-table-column prop="menuName" label="菜单名称" :show-overflow-tooltip="true" width="160"></el-table-column>
<el-table-column prop="icon" label="图标" align="center" width="100">
<template #default="scope">
<svg-icon :icon-class="scope.row.icon" />
<svg-icon :name="scope.row.icon" />
</template>
</el-table-column>
<el-table-column prop="menuType" label="类型" align="center" width="80">
@ -127,7 +127,7 @@
<template #reference>
<el-input v-model="form.icon" placeholder="点击选择图标" @click="showSelectIcon" readonly>
<template #prefix>
<svg-icon v-if="form.icon" :icon-class="form.icon" class="el-input__icon" />
<svg-icon v-if="form.icon" :name="form.icon" class="el-input__icon" />
<el-icon class="el-input__icon" v-else>
<search />
</el-icon>

12
src/views/system/user/profile/index.vue
View File

@ -14,29 +14,29 @@
</div>
<ul class="list-group list-group-striped">
<li class="list-group-item">
<svg-icon icon-class="user" />用户名称
<svg-icon name="user" />用户名称
<div class="pull-right">{{ state.user.userName }}</div>
</li>
<li class="list-group-item">
<svg-icon icon-class="phone" />手机号码
<svg-icon name="phone" />手机号码
<div class="pull-right">{{ state.user.phonenumber }}</div>
</li>
<li class="list-group-item">
<svg-icon icon-class="email" />用户邮箱
<svg-icon name="email" />用户邮箱
<div class="pull-right">{{ state.user.email }}</div>
</li>
<li class="list-group-item">
<svg-icon icon-class="tree" />所属部门
<svg-icon name="tree" />所属部门
<div class="pull-right">{{ state.user.deptName }} / {{ state.postGroup }}</div>
</li>
<li class="list-group-item">
<svg-icon icon-class="peoples" />所属角色
<svg-icon name="peoples" />所属角色
<div class="pull-right">
<span v-for="item in state.roles" :key="item">{{ item }}</span>
</div>
</li>
<li class="list-group-item">
<svg-icon icon-class="date" />创建日期
<svg-icon name="date" />创建日期
<div class="pull-right">{{ state.user.createTime }}</div>
</li>
</ul>

2
src/views/tool/build/index.vue
View File

@ -1,3 +1,3 @@
<template>
<div> 表单构建，敬请期待... <svg-icon icon-class="build" /> </div>
<div> 表单构建，敬请期待... <svg-icon name="build" /> </div>
</template>