Browse Source

perf: icon

i18n
xiaoxian521 3 years ago
parent
commit
a7119c1cbe
  1. 2
      package.json
  2. 22
      pnpm-lock.yaml
  3. 48
      src/components/ReIcon/src/iconifyIconOffline.ts
  4. 2
      src/layout/components/setting/index.vue
  5. 4
      src/views/login.vue

2
package.json

@ -59,8 +59,6 @@
"@commitlint/cli": "13.1.0", "@commitlint/cli": "13.1.0",
"@commitlint/config-conventional": "13.1.0", "@commitlint/config-conventional": "13.1.0",
"@iconify-icons/ep": "^1.2.4", "@iconify-icons/ep": "^1.2.4",
"@iconify-icons/fa": "^1.2.2",
"@iconify-icons/fa-solid": "^1.2.2",
"@iconify-icons/ri": "^1.2.1", "@iconify-icons/ri": "^1.2.1",
"@iconify/vue": "^3.2.0", "@iconify/vue": "^3.2.0",
"@intlify/vite-plugin-vue-i18n": "^3.4.0", "@intlify/vite-plugin-vue-i18n": "^3.4.0",

22
pnpm-lock.yaml

@ -5,8 +5,6 @@ specifiers:
"@commitlint/config-conventional": 13.1.0 "@commitlint/config-conventional": 13.1.0
"@ctrl/tinycolor": ^3.4.0 "@ctrl/tinycolor": ^3.4.0
"@iconify-icons/ep": ^1.2.4 "@iconify-icons/ep": ^1.2.4
"@iconify-icons/fa": ^1.2.2
"@iconify-icons/fa-solid": ^1.2.2
"@iconify-icons/ri": ^1.2.1 "@iconify-icons/ri": ^1.2.1
"@iconify/vue": ^3.2.0 "@iconify/vue": ^3.2.0
"@intlify/vite-plugin-vue-i18n": ^3.4.0 "@intlify/vite-plugin-vue-i18n": ^3.4.0
@ -120,8 +118,6 @@ devDependencies:
"@commitlint/cli": 13.1.0 "@commitlint/cli": 13.1.0
"@commitlint/config-conventional": 13.1.0 "@commitlint/config-conventional": 13.1.0
"@iconify-icons/ep": 1.2.4 "@iconify-icons/ep": 1.2.4
"@iconify-icons/fa": 1.2.2
"@iconify-icons/fa-solid": 1.2.2
"@iconify-icons/ri": 1.2.1 "@iconify-icons/ri": 1.2.1
"@iconify/vue": 3.2[email protected] "@iconify/vue": 3.2[email protected]
"@intlify/vite-plugin-vue-i18n": 3.4.0_3d08e1d9025840888da5ae870455a383 "@intlify/vite-plugin-vue-i18n": 3.4.0_3d08e1d9025840888da5ae870455a383
@ -924,24 +920,6 @@ packages:
"@iconify/types": 1.1.0 "@iconify/types": 1.1.0
dev: true dev: true
/@iconify-icons/fa-solid/1.2.2:
resolution:
{
integrity: sha512-XNU+pk89pMbozQk9YMpxA+K+rPsq07MXJa9TwZS1oyBlbaIdeH6r/KOOeNYzmDVk6yaaZyTh9wfSJhuc8zIVYw==
}
dependencies:
"@iconify/types": 1.1.0
dev: true
/@iconify-icons/fa/1.2.2:
resolution:
{
integrity: sha512-8lecoWNI7X/GRw7B9NPVyGlPrqUxi1w1aZyzAm1s+eiPixmmivxdHtg53tGeSJpYgm/grfSti8EbYoiFTIckrw==
}
dependencies:
"@iconify/types": 1.1.0
dev: true
/@iconify-icons/ri/1.2.1: /@iconify-icons/ri/1.2.1:
resolution: resolution:
{ {

48
src/components/ReIcon/src/iconifyIconOffline.ts

@ -5,89 +5,49 @@ import { Icon as IconifyIcon, addIcon } from "@iconify/vue/dist/offline";
import Check from "@iconify-icons/ep/check"; import Check from "@iconify-icons/ep/check";
import Menu from "@iconify-icons/ep/menu"; import Menu from "@iconify-icons/ep/menu";
import HomeFilled from "@iconify-icons/ep/home-filled"; import HomeFilled from "@iconify-icons/ep/home-filled";
import SetUp from "@iconify-icons/ep/set-up";
import Edit from "@iconify-icons/ep/edit";
import Setting from "@iconify-icons/ep/setting"; import Setting from "@iconify-icons/ep/setting";
import Lollipop from "@iconify-icons/ep/lollipop"; import Lollipop from "@iconify-icons/ep/lollipop";
import Link from "@iconify-icons/ep/link"; import Link from "@iconify-icons/ep/link";
import Position from "@iconify-icons/ep/position";
import Histogram from "@iconify-icons/ep/histogram";
import RefreshRight from "@iconify-icons/ep/refresh-right"; import RefreshRight from "@iconify-icons/ep/refresh-right";
import ArrowDown from "@iconify-icons/ep/arrow-down"; import ArrowDown from "@iconify-icons/ep/arrow-down";
import Close from "@iconify-icons/ep/close"; import Close from "@iconify-icons/ep/close";
import CloseBold from "@iconify-icons/ep/close-bold"; import CloseBold from "@iconify-icons/ep/close-bold";
import Bell from "@iconify-icons/ep/bell"; import Bell from "@iconify-icons/ep/bell";
import Guide from "@iconify-icons/ep/guide";
import User from "@iconify-icons/ep/user";
import Iphone from "@iconify-icons/ep/iphone"; import Iphone from "@iconify-icons/ep/iphone";
import Location from "@iconify-icons/ep/location";
import Tickets from "@iconify-icons/ep/tickets";
import OfficeBuilding from "@iconify-icons/ep/office-building";
import Notebook from "@iconify-icons/ep/notebook";
import Rank from "@iconify-icons/ep/rank";
import videoPlay from "@iconify-icons/ep/video-play";
import Monitor from "@iconify-icons/ep/monitor";
import Search from "@iconify-icons/ep/search"; import Search from "@iconify-icons/ep/search";
addIcon("check", Check); addIcon("check", Check);
addIcon("menu", Menu); addIcon("menu", Menu);
addIcon("home-filled", HomeFilled); addIcon("home-filled", HomeFilled);
addIcon("set-up", SetUp);
addIcon("edit", Edit);
addIcon("setting", Setting); addIcon("setting", Setting);
addIcon("lollipop", Lollipop); addIcon("lollipop", Lollipop);
addIcon("link", Link); addIcon("link", Link);
addIcon("position", Position);
addIcon("histogram", Histogram);
addIcon("refresh-right", RefreshRight); addIcon("refresh-right", RefreshRight);
addIcon("arrow-down", ArrowDown); addIcon("arrow-down", ArrowDown);
addIcon("close", Close); addIcon("close", Close);
addIcon("close-bold", CloseBold); addIcon("close-bold", CloseBold);
addIcon("bell", Bell); addIcon("bell", Bell);
addIcon("guide", Guide);
addIcon("user", User);
addIcon("iphone", Iphone); addIcon("iphone", Iphone);
addIcon("location", Location);
addIcon("tickets", Tickets);
addIcon("office-building", OfficeBuilding);
addIcon("notebook", Notebook);
addIcon("video-play", videoPlay);
addIcon("rank", Rank);
addIcon("monitor", Monitor);
addIcon("search", Search); addIcon("search", Search);
// remixicon // remixicon
import arrowRightSLine from "@iconify-icons/ri/arrow-right-s-line"; import arrowRightSLine from "@iconify-icons/ri/arrow-right-s-line";
import arrowLeftSLine from "@iconify-icons/ri/arrow-left-s-line"; import arrowLeftSLine from "@iconify-icons/ri/arrow-left-s-line";
import logoutCircleRLine from "@iconify-icons/ri/logout-circle-r-line"; import logoutCircleRLine from "@iconify-icons/ri/logout-circle-r-line";
import nodeTree from "@iconify-icons/ri/node-tree";
import ubuntuFill from "@iconify-icons/ri/ubuntu-fill";
import questionLine from "@iconify-icons/ri/question-line";
import checkboxCircleLine from "@iconify-icons/ri/checkbox-circle-line";
import informationLine from "@iconify-icons/ri/information-line"; import informationLine from "@iconify-icons/ri/information-line";
import closeCircleLine from "@iconify-icons/ri/close-circle-line";
import arrowUpLine from "@iconify-icons/ri/arrow-up-line"; import arrowUpLine from "@iconify-icons/ri/arrow-up-line";
import arrowDownLine from "@iconify-icons/ri/arrow-down-line"; import arrowDownLine from "@iconify-icons/ri/arrow-down-line";
import bookmark2Line from "@iconify-icons/ri/bookmark-2-line"; import bookmark2Line from "@iconify-icons/ri/bookmark-2-line";
import User from "@iconify-icons/ri/user-3-fill";
import Lock from "@iconify-icons/ri/lock-fill";
addIcon("arrow-right-s-line", arrowRightSLine); addIcon("arrow-right-s-line", arrowRightSLine);
addIcon("arrow-left-s-line", arrowLeftSLine); addIcon("arrow-left-s-line", arrowLeftSLine);
addIcon("logout-circle-r-line", logoutCircleRLine); addIcon("logout-circle-r-line", logoutCircleRLine);
addIcon("node-tree", nodeTree);
addIcon("ubuntu-fill", ubuntuFill);
addIcon("question-line", questionLine);
addIcon("checkbox-circle-line", checkboxCircleLine);
addIcon("information-line", informationLine); addIcon("information-line", informationLine);
addIcon("close-circle-line", closeCircleLine);
addIcon("arrow-up-line", arrowUpLine); addIcon("arrow-up-line", arrowUpLine);
addIcon("arrow-down-line", arrowDownLine); addIcon("arrow-down-line", arrowDownLine);
addIcon("bookmark-2-line", bookmark2Line); addIcon("bookmark-2-line", bookmark2Line);
// Font Awesome 4
import faUser from "@iconify-icons/fa/user";
import faLock from "@iconify-icons/fa/lock";
import faSignOut from "@iconify-icons/fa/sign-out";
addIcon("fa-user", faUser);
addIcon("fa-lock", faLock);
addIcon("fa-sign-out", faSignOut);
addIcon("user", User);
addIcon("lock", Lock);
// Iconify Icon在Vue里离线使用(用于内网环境)https://docs.iconify.design/icon-components/vue/offline.html // Iconify Icon在Vue里离线使用(用于内网环境)https://docs.iconify.design/icon-components/vue/offline.html
export default defineComponent({ export default defineComponent({

2
src/layout/components/setting/index.vue

@ -447,7 +447,7 @@ nextTick(() => {
@click="onReset" @click="onReset"
> >
<IconifyIconOffline <IconifyIconOffline
icon="fa-sign-out"
icon="logout-circle-r-line"
width="15" width="15"
height="15" height="15"
style="margin-right: 4px" style="margin-right: 4px"

4
src/views/login.vue

@ -82,7 +82,7 @@ function onPwdBlur() {
}" }"
> >
<div class="icon"> <div class="icon">
<IconifyIconOffline icon="fa-user" width="14" height="14" />
<IconifyIconOffline icon="user" width="14" height="14" />
</div> </div>
<div> <div>
<h5>用户名</h5> <h5>用户名</h5>
@ -111,7 +111,7 @@ function onPwdBlur() {
}" }"
> >
<div class="icon"> <div class="icon">
<IconifyIconOffline icon="fa-lock" width="14" height="14" />
<IconifyIconOffline icon="lock" width="14" height="14" />
</div> </div>
<div> <div>
<h5>密码</h5> <h5>密码</h5>

Loading…
Cancel
Save