Browse code @中文描述: 添加图标 @版本号: @升级登记:1 @同步后端:0 @同步数据库:0 @同步配置:0 @向下兼容:1 master
1 parent 08a605c commit 0a3a9164dd2a396c5f9ead17a946b4a3286ca0f6 ganyi authored 4 days ago

Showing 11 changed files

• assets_platform/customSysCfg/index.js
• project/hivuiMain/App.vue
• project/hivuiMain/assets/iconfonts/expand/demo.css
• project/hivuiMain/assets/iconfonts/expand/demo_index.html
• project/hivuiMain/assets/iconfonts/expand/iconfont.css
• project/hivuiMain/assets/iconfonts/expand/iconfont.js
• project/hivuiMain/assets/iconfonts/expand/iconfont.json
• project/hivuiMain/assets/iconfonts/expand/iconfont.ttf
• project/hivuiMain/assets/iconfonts/expand/iconfont.woff
• project/hivuiMain/assets/iconfonts/expand/iconfont.woff2
• project/hivuiMain/index.js

Ignore Space Show notes View assets_platform/customSysCfg/index.js

var __guid=new Date().valueOf(); //切换布局 function changeLayout(name) { window.localStorage.setItem('layout', name); window.location.reload(); } window.customSysCofig = { //自定义取菜单接口 customGetUserMenu:"", //首页标签 syTitle: eap.lang.get('customSysCfg_pageTitle'), //默认门户 对应自定义门户功能 sysSetTabs:{ taskcenter:{ title: eap.lang.get('customSysCfg_taskcenter'), id: __guid++, close: false, url: '#taskCenter', }, mainpage:{ title: eap.lang.get('customSysCfg_mainpage'), id: __guid++, close: false, url:"/eapdev/home/index/func/index.func", //actived: true //默认选中 }, itemSort:['taskcenter','mainpage'], }, //默认 打开功能 sysDefTabs: { design:{ id: __guid++, title:"设计", url:'http://192.168.7.109:9090/#/design', close:true, }, itemSort:[], }, //头部菜单 sysFuncMenus: { layout:{ id: __guid++, name: eap.lang.get('customSysCfg_layout'), type: 'layout', iconClass: 'icon-layout', children: [ { id: 'vertical', name: eap.lang.get('customSysCfg_updownlayout'), handler: function () { changeLayout(this.id); } }, { id: 'level', name: eap.lang.get('customSysCfg_leftrightlayout'), handler: function () { changeLayout(this.id); } }, { id: 'concise', name: eap.lang.get('customSysCfg_conciselayout'), handler: function () { changeLayout(this.id); } } ] }, messagecenter:{ id: __guid++, name: eap.lang.get('customSysCfg_messagecenter'), type: 'withNumTips', iconClass: 'icon-bell', target:'tab', url:'/platf/msg/func/query.func',//消息中心地址 numIntervalTime:1000*30,//循环时间，默认30秒 //hideNotific:true,//隐藏底部消息通知 //消息提示文字 messageText:function(res){ return eap.lang.get("customSysCfg_unreadmessage").replace("{0}",res.num); }, //获取未读消息数量 numFunc:function(){ return new Promise((resolve, reject) => { let param = new eap.dataHelper.Param(); let where = new eap.dataHelper.Where(); let orders = new eap.dataHelper.Orders(); if (window.Scp.User.fuserid) { where.eq("freceiver", window.Scp.User.fuserid); } where.setPage(1, -1); param.where = where; eap.dataHelper.query( param, "/platf/msg/entity/MsgUnReadBizEntity.xml", "/platf/msg/func/query.func", ).then(res=>{ let __data=res.dataPack.rows; resolve({ num: (__data && __data.length > 0) ? __data.length : 0 }); }).catch(err=>{ reject(err); }); }); }, }, itemSort:["|","layout","|","messagecenter","|"], }, //浏览器标签logo //favicon: '/render/'+window.global.pUser+ '/' + window.global.pName + "/setting/desktop/sysAssets/favicon.png", //首页加载logo sysLoadLogo: { src: '/render/'+window.global.pUser+ '/' + window.global.pName + '/setting/desktop/sysAssets/sy_loading.png', title: eap.lang.get('customSysCfg_pageTitle') }, //首页头部logo sysLogo: { src: '/render/'+window.global.pUser+ '/' + window.global.pName + '/setting/desktop/sysAssets/sy_logo.png', title: eap.lang.get('customSysCfg_pageTitle'), //width:null, //height:null, //clickHandler:()=>{alert(123456);}, }, //首页左右结构头部logo /*sysLogoHorizon: { src: '/render/'+window.global.pUser+ '/' +window.global.pName + '/setting/desktop/sysAssets/sy_logo_horizon.png', title: eap.lang.get('customSysCfg_pageTitle'), //width:null, //height:null, },*/ //首页左右结构mini图标logo MsysLogo: { src: '/render/'+window.global.pUser+ '/' + window.global.pName + '/setting/desktop/sysAssets/sy_minLogo.png', title: eap.lang.get('customSysCfg_pageTitle'), //width:null, //height:null, }, //默认布局类型 top:上下结构;left:左右结构; //layout:"left", //左右布局菜单项文字是否单行显示 //isMenuWordwrap:true, //是否开启单页模式 //isSinglePage:true, //是否开启功能页缓存模式 //isPageCache:true, //是否开启全部功能菜单，不配置默认开启 //isShowAllFunc:false, //左右结构菜单宽度设置 //leftMenuWidth:200, //多岗列表文本展示模板 //orgBzTpl:"${fbzname}/${fbzid}", //是否显示多语言选择按钮 //showChangeLangBtn:true, //引用第三方资源 /*thirdParty:[ { type:"js", link:"脚本资源路径", } ],*/ //添加多语言类型 /*addLangList:[ { id: __guid++, name:"aaaa", key:"aaaaa" }, ],*/ //登录超时显示小登录弹窗（默认显示） //showMiniLogin:false, //是否隐藏头部设置按钮 //hideSettingBtn:true, //是否隐藏最近使用列表 //hideHistoryFuncList:true, //登出回调方法 /*logoutCallback:()=>{ **代码** if(window.HIVUI_SETTING.isSingleLogin&&window.HIVUI_SETTING.singleLogoutUrl){ location=window.HIVUI_SETTING.singleLogoutUrl; }else{ location=window.HIVUI_SETTING.loginUrl; } },*/ //任务中心根据taskId打开新标签 //openTabBytaskId:true, //登录页配置 //登录页logo loginLogo: '/render/'+window.global.pUser+ '/' + window.global.pName + "/setting/desktop/sysAssets/login_logo.png", //logo高 loginLogo_h: null, //logo宽 loginLogo_w: null, //登录页背景 loginBgImg: '/render/'+window.global.pUser+ '/' + window.global.pName + "/setting/desktop/sysAssets/login_bg.png", //登录标签 loginTitle: eap.lang.get('customSysCfg_pageTitle'), //版权 copyright: eap.lang.get('customSysCfg_copyright'), //是否开启扫码登录 //isScan:false, //登录隐藏注册入口 hideRegister:true, //是否启用登录页切岗 isSelectUserBz:false, //app下载二维码;如果是二维码图片路径，请在字符串开头添加“imgUrl:” appQRcode:"", } var __guid=new Date().valueOf(); //切换布局 function changeLayout(name) { window.localStorage.setItem('layout', name); window.location.reload(); } window.customSysCofig = { //自定义取菜单接口 customGetUserMenu:"", //首页标签 syTitle: eap.lang.get('customSysCfg_pageTitle'), //默认门户 对应自定义门户功能 sysSetTabs:{ taskcenter:{ title: eap.lang.get('customSysCfg_taskcenter'), id: __guid++, close: false, url: '#taskCenter', }, mainpage:{ title: eap.lang.get('customSysCfg_mainpage'), id: __guid++, close: false, url:"/eapdev/home/index/func/index.func", //actived: true //默认选中 }, itemSort:['taskcenter','mainpage'], }, //默认 打开功能 sysDefTabs: { design:{ id: __guid++, title:"设计", url:'http://192.168.7.109:9090/#/design', close:true, }, itemSort:[], }, //头部菜单 sysFuncMenus: { layout:{ id: __guid++, name: eap.lang.get('customSysCfg_layout'), type: 'layout', iconClass: 'icon-user', children: [ { id: 'vertical', name: eap.lang.get('customSysCfg_updownlayout'), handler: function () { changeLayout(this.id); } }, { id: 'level', name: eap.lang.get('customSysCfg_leftrightlayout'), handler: function () { changeLayout(this.id); } } ] }, messagecenter:{ id: __guid++, name: eap.lang.get('customSysCfg_messagecenter'), type: 'withNumTips', iconClass: 'icon-bell', target:'tab', url:'/platf/msg/func/query.func',//消息中心地址 numIntervalTime:1000*30,//循环时间，默认30秒 //hideNotific:true,//隐藏底部消息通知 //消息提示文字 messageText:function(res){ return eap.lang.get("customSysCfg_unreadmessage").replace("{0}",res.num); }, //获取未读消息数量 numFunc:function(){ return new Promise((resolve, reject) => { let param = new eap.dataHelper.Param(); let where = new eap.dataHelper.Where(); let orders = new eap.dataHelper.Orders(); if (window.Scp.User.fuserid) { where.eq("freceiver", window.Scp.User.fuserid); } where.setPage(1, -1); param.where = where; eap.dataHelper.query( param, "/platf/msg/entity/MsgUnReadBizEntity.xml", "/platf/msg/func/query.func", ).then(res=>{ let __data=res.dataPack.rows; resolve({ num: (__data && __data.length > 0) ? __data.length : 0 }); }).catch(err=>{ reject(err); }); }); }, }, itemSort:["|","layout","|","messagecenter","|"], }, //浏览器标签logo //favicon: '/render/'+window.global.pUser+ '/' + window.global.pName + "/setting/desktop/sysAssets/favicon.png", //首页加载logo sysLoadLogo: { src: '/render/'+window.global.pUser+ '/' + window.global.pName + '/setting/desktop/sysAssets/sy_loading.png', title: eap.lang.get('customSysCfg_pageTitle') }, //首页头部logo sysLogo: { src: '/render/'+window.global.pUser+ '/' + window.global.pName + '/setting/desktop/sysAssets/sy_logo.png', title: eap.lang.get('customSysCfg_pageTitle'), //width:null, //height:null, //clickHandler:()=>{alert(123456);}, }, //首页左右结构头部logo /*sysLogoHorizon: { src: '/render/'+window.global.pUser+ '/' +window.global.pName + '/setting/desktop/sysAssets/sy_logo_horizon.png', title: eap.lang.get('customSysCfg_pageTitle'), //width:null, //height:null, },*/ //首页左右结构mini图标logo MsysLogo: { src: '/render/'+window.global.pUser+ '/' + window.global.pName + '/setting/desktop/sysAssets/sy_minLogo.png', title: eap.lang.get('customSysCfg_pageTitle'), //width:null, //height:null, }, //默认布局类型 top:上下结构;left:左右结构; //layout:"left", //左右布局菜单项文字是否单行显示 //isMenuWordwrap:true, //是否开启单页模式 //isSinglePage:true, //是否开启功能页缓存模式 //isPageCache:true, //是否开启全部功能菜单，不配置默认开启 //isShowAllFunc:false, //左右结构菜单宽度设置 //leftMenuWidth:200, //多岗列表文本展示模板 //orgBzTpl:"${fbzname}/${fbzid}", //是否显示多语言选择按钮 //showChangeLangBtn:true, //引用第三方资源 /*thirdParty:[ { type:"js", link:"脚本资源路径", } ],*/ //添加多语言类型 /*addLangList:[ { id: __guid++, name:"aaaa", key:"aaaaa" }, ],*/ //登录超时显示小登录弹窗（默认显示） //showMiniLogin:false, //是否隐藏头部设置按钮 //hideSettingBtn:true, //是否隐藏最近使用列表 //hideHistoryFuncList:true, //登出回调方法 /*logoutCallback:()=>{ **代码** if(window.HIVUI_SETTING.isSingleLogin&&window.HIVUI_SETTING.singleLogoutUrl){ location=window.HIVUI_SETTING.singleLogoutUrl; }else{ location=window.HIVUI_SETTING.loginUrl; } },*/ //任务中心根据taskId打开新标签 //openTabBytaskId:true, //登录页配置 //登录页logo loginLogo: '/render/'+window.global.pUser+ '/' + window.global.pName + "/setting/desktop/sysAssets/login_logo.png", //logo高 loginLogo_h: null, //logo宽 loginLogo_w: null, //登录页背景 loginBgImg: '/render/'+window.global.pUser+ '/' + window.global.pName + "/setting/desktop/sysAssets/login_bg.png", //登录标签 loginTitle: eap.lang.get('customSysCfg_pageTitle'), //版权 copyright: eap.lang.get('customSysCfg_copyright'), //是否开启扫码登录 //isScan:false, //登录隐藏注册入口 hideRegister:true, //是否启用登录页切岗 isSelectUserBz:false, //app下载二维码;如果是二维码图片路径，请在字符串开头添加“imgUrl:” appQRcode:"", }

Ignore Space Show notes View project/hivuiMain/App.vue

<template> <div class="app"> <transition> <router-view v-if="$store.state.appStatus=='success'" /> </transition> <transition> <div v-if="$store.state.appStatus!='success'" class="loader" > <div class="pl-logo-lg fadeInUp animated"> <img :src="logoSrc" v-if="logoSrc!=''" > </div> <span class="txt"> <span v-for="(str,index) in loadTexts" :key="index">{{str}}</span> <span class="msgInfo" v-if="$store.state.appStatus=='loading'">{{$t('hivuiMain_sysLoading')}}</span> <span class="msgInfo" v-if="$store.state.appStatus!='loading'&&!mainPageInitErrorJump" style="color:red" @click="handleReload" >{{$store.state.appStatusMsg||$t('hivuiMain_loadedFailClickRefresh')}}</span> </span> </div> </transition> </div> </template> <script> import Cookies from 'js-cookie' import LoginPic from "@main/assets/logo_max.png" import { getUrlValue, setUrlValue,getUrlSearch } from "@main/utils"; import { getToken } from '@main/utils/auth' export default { data() { return { loadTexts: "", logoSrc: "", mainPageInitErrorJump:window.mainPageInitErrorJump, }; }, methods: { handleReload() { window.location.reload(); }, detectZoom (){ var ratio = 0, screen = window.screen, ua = navigator.userAgent.toLowerCase(); if (window.devicePixelRatio !== undefined) { ratio = window.devicePixelRatio; } else if (~ua.indexOf('msie')) { if (screen.deviceXDPI && screen.logicalXDPI) { ratio = screen.deviceXDPI / screen.logicalXDPI; } } else if (window.outerWidth !== undefined && window.innerWidth !== undefined) { ratio = window.outerWidth / window.innerWidth; } if (ratio){ ratio = Math.round(ratio * 100); } return ratio; }, checkZoom(){ let ratio = this.detectZoom(); if(ratio!=100){ // this.$message.error('警告，浏览器没有按正常比例显示会影响部份功能！') } }, }, mounted() { // this.checkZoom(); // window.addEventListener('resize',()=>{ // this.checkZoom(); // }); let me=this; // 设置任务中心刷新状态 top.window.__setRefreshTaskcenter = function (state) { if(state==undefined){ state = true; } top.window.__refreshTaskcenter = state; } let urlPn=getUrlValue(location.search,"pn"); if(urlPn){ if(!getUrlValue(window.HIVUI_SETTING.loginUrl,"pn")){ window.HIVUI_SETTING.loginUrl+="?pn="+urlPn; } if(!getUrlValue(window.HIVUI_SETTING.mainPageUrl,"pn")){ window.HIVUI_SETTING.mainPageUrl+="?pn="+urlPn; } if(!getUrlValue(window.HIVUI_SETTING.customLoginUrl,"pn")){ window.HIVUI_SETTING.customLoginUrl+="?pn="+urlPn; } } //如果token不一致，替换掉然后重新载入 let urlToken=getUrlValue(location.href,"access_token"); let nowToken=getToken(); if(false&&!window._global&&urlToken&&nowToken&&(urlToken!=nowToken)){//正式环境 let newUrl=setUrlValue(decodeURIComponent(location.href),"access_token",nowToken); location=newUrl; location.reload(); } //系统间跳转，将ticket去除 if(!window._global&&getUrlValue(decodeURIComponent(location.href),"ticket")){ let newUrl=setUrlValue(decodeURIComponent(location.href),"ticket",""); location=newUrl.replace("&ticket=","")+(location.hash?location.hash:"#/"); //location.reload(); } window.Scp = { User: { id: "admin", name: "管理员", deptId: "", deptName: "", positionId: "GLY", postionName: "管理员", bzId: "admin_3", bzName: "管理员岗位3", bzDeptId: ".WLDJT.DGS", bzDeptName: "D公司", bzPositionId: "HQRY", bzPositionName: "后勤人员", orgId: "admin_3", defOrgId: "admin_3" } } //customSysCofig默认值 window.customSysCofig=_.merge({ showMiniLogin:true, },window.customSysCofig); if(!window.localStorage.getItem("locale")){ window.localStorage.setItem("locale",JSON.stringify({ desc:"中文", name:"zh-CN", })); Cookies.set("locale","zh-CN"); } window.__guid = new Date().valueOf(); //window.customSysCofig=_.merge(window.default_customSysCfg,window.customSysCofig||{}); window==top&&window.customSysCofig&&window.customSysCofig.thirdParty&&window.customSysCofig.thirdParty.forEach((item)=>{//第三方脚本样式资源引用 let _dom; switch(item.type){ case "js": _dom=document.createElement("script"); _dom.type="text/javascript"; _dom.src=item.link; if(item.callback){ _dom.onload=()=>{ item.callback(); } } break; case "css": _dom=document.createElement("link"); _dom.rel="stylesheet"; _dom.href=item.link; break; } document.querySelector("head").appendChild(_dom); }); setTimeout(()=>{ window.__sysConfig = _.merge({ events: { onLoad1: function () { } }, projectName: "eaptpl", /*sysProjectMange: { id: __guid++, name: '工程树', iconClass: 'icon-tree', uri: 'amreport/designer/tree/design.do', url: '/amrept-web/amreport/designer/tree/design.do' },*/ sysList: [ ], langList:{ id: __guid++, name: (window.localStorage.getItem("locale")?(JSON.parse(window.localStorage.getItem("locale")).desc):"中文"), type: 'lang', iconClass: 'icon-language', children: [ { id: __guid++, name:"中文", key:"zh-CN", }, { id: __guid++, name:"English", key:"en", }, ] }, userInfo:{ id: __guid++, name: '${fusername}', type: 'userInfo', iconClass: 'icon-user', children: [ { id: __guid++, name:me.$t('hivuiMain_app_user')+'：${fusername}/${fuserid}', iconClass:'icon-user', }, { id: __guid++, name:me.$t('hivuiMain_app_orgbz')+'：${fbzname}/${fbzid}', iconClass:'icon-user', type:"orgBz", }, { id: __guid++, name:me.$t('hivuiMain_app_orgname')+'：${forgname}/${forgid}', iconClass:'icon-user', }, { id: __guid++, name:me.$t('hivuiMain_app_rolename')+'：${frolename}/${froleid}', iconClass:'icon-user', }, { id: __guid++, name:me.$t('hivuiMain_app_personal_Center'), iconClass:'icon-user', type: "personalCenter" }, /*{ id: __guid++, iconClass:'icon-edit', name:'修改用户信息', type:'modifyUserInfo', },*/ { id: __guid++, iconClass:'icon-edit', name:me.$t('hivuiMain_app_modifyPw'), type:'modifyPw', }, ] }, },window.customSysCofig); if(window.customSysCofig.addLangList){ window.__sysConfig.langList.children=[...window.__sysConfig.langList.children,...window.customSysCofig.addLangList]; } this.$store.dispatch("app/getSysConfig").then(res=>{ let cfg = this.$store.state.app.config || {}; let loadText = (cfg.sysLoadLogo && cfg.sysLoadLogo.title) || ""; let logoSrc = (cfg.sysLoadLogo && cfg.sysLoadLogo.src) || ""; this.loadTexts=loadText.split(""); this.logoSrc=cfg.sysLoadLogo.hide ? "" : (logoSrc||LoginPic); }); },0); } }; </script> <style scoped> .app { height: 100%; background: linear-gradient( rgb(255, 255, 255) 0px, rgb(243, 248, 253) 50%, rgb(229, 240, 250) ); } .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { opacity: 1; -webkit-transform: translateZ(0); transform: translateZ(0); } } @keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { opacity: 1; -webkit-transform: translateZ(0); transform: translateZ(0); } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } to { opacity: 1; -webkit-transform: translateZ(0); transform: translateZ(0); } } @keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } to { opacity: 1; -webkit-transform: translateZ(0); transform: translateZ(0); } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } .loader { position: absolute; top: 50%; left: 50%; margin-top: -50px; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -mos-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: default; } .loader .txt { display: inline-block; word-break: normal; white-space: nowrap; margin: auto; text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.1), 0 3px 5px rgba(0, 0, 0, 0.1), 0 5px 10px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.1), 0 20px 20px rgba(0, 0, 0, 0.15); } .loader .txt span { display: inline-block; font-size: 68px !important; padding: 0 5px; -webkit-animation: text cubic-bezier(0.75, 0, 0.5, 1) 1.2s infinite; -moz-animation: text cubic-bezier(0.75, 0, 0.5, 1) 1.2s infinite; -moz-animation: text cubic-bezier(0.75, 0, 0.5, 1) 1.2s infinite; -ms-animation: text cubic-bezier(0.75, 0, 0.5, 1) 1.2s infinite; -o-animation: text cubic-bezier(0.75, 0, 0.5, 1) 1.2s infinite; animation: text cubic-bezier(0.75, 0, 0.5, 1) 1.2s infinite; color: #0066cc; } .loader .txt span:nth-child(1) { -webkit-animation-delay: 0ms; -moz-animation-delay: 0ms; -ms-animation-delay: 0ms; -o-animation-delay: 0ms; animation-delay: 0ms; } .loader .txt span:nth-child(2) { -webkit-animation-delay: 100ms; -moz-animation-delay: 100ms; -ms-animation-delay: 100ms; -o-animation-delay: 100ms; animation-delay: 100ms; } .loader .txt span:nth-child(3) { -webkit-animation-delay: 200ms; -moz-animation-delay: 200ms; -ms-animation-delay: 200ms; -o-animation-delay: 200ms; animation-delay: 200ms; } .loader .txt span:nth-child(4) { -webkit-animation-delay: 300ms; -moz-animation-delay: 300ms; -ms-animation-delay: 300ms; -o-animation-delay: 300ms; animation-delay: 300ms; } .loader .txt span:nth-child(5) { -webkit-animation-delay: 400ms; -moz-animation-delay: 400ms; -ms-animation-delay: 400ms; -o-animation-delay: 400ms; animation-delay: 400ms; } .loader .txt span:nth-child(6) { -webkit-animation-delay: 500ms; -moz-animation-delay: 500ms; -ms-animation-delay: 500ms; -o-animation-delay: 500ms; animation-delay: 500ms; } .loader .txt span:nth-child(7) { -webkit-animation-delay: 600ms; -moz-animation-delay: 600ms; -ms-animation-delay: 600ms; -o-animation-delay: 600ms; animation-delay: 600ms; } .loader .txt span:nth-child(8) { -webkit-animation-delay: 700ms; -moz-animation-delay: 700ms; -ms-animation-delay: 700ms; -o-animation-delay: 700ms; animation-delay: 700ms; } .loader .txt span:nth-child(9) { -webkit-animation-delay: 800ms; -moz-animation-delay: 800ms; -ms-animation-delay: 800ms; -o-animation-delay: 800ms; animation-delay: 800ms; } .loader .txt span:nth-child(10) { -webkit-animation-delay: 900ms; -moz-animation-delay: 900ms; -ms-animation-delay: 900ms; -o-animation-delay: 900ms; animation-delay: 900ms; } .loader .txt span:nth-child(11) { -webkit-animation-delay: 1000ms; -moz-animation-delay: 1000ms; -ms-animation-delay: 1000ms; -o-animation-delay: 1000ms; animation-delay: 1000ms; } .loader .txt span:nth-child(12) { -webkit-animation-delay: 1100ms; -moz-animation-delay: 1100ms; -ms-animation-delay: 1100ms; -o-animation-delay: 1100ms; animation-delay: 1100ms; } .loader .txt span:nth-child(13) { -webkit-animation-delay: 1200ms; -moz-animation-delay: 1200ms; -ms-animation-delay: 1200ms; -o-animation-delay: 1200ms; animation-delay: 1200ms; } .loader .txt span.msgInfo { display: block; padding-top: 15px; font-size: 16px !important; text-shadow: none; color: #0272bd; text-shadow: none; animation: none; -webkit-animation: none; } @-webkit-keyframes text { 0% { color: #0066cc; } 40% { color: #fff; } 70%, 100% { color: #0066cc; } } @-moz-keyframes text { 0% { color: #0066cc; } 40% { color: #fff; } 70%, 100% { color: #0066cc; } } @-mos-keyframes text { 0% { color: #0066cc; } 40% { color: #fff; } 70%, 100% { color: #0066cc; } } @-o-keyframes text { 0% { color: #0066cc; } 40% { color: #fff; } 70%, 100% { color: #0066cc; } } @keyframes text { 0% { color: #0066cc; } 40% { color: #fff; } 70%, 100% { color: #0066cc; } } </style> <template> <div class="app"> <transition> <router-view v-if="$store.state.appStatus=='success'" /> </transition> <transition> <div v-if="$store.state.appStatus!='success'" class="loader" > <div class="pl-logo-lg fadeInUp animated"> <img :src="logoSrc" v-if="logoSrc!=''" > </div> <span class="txt"> <span v-for="(str,index) in loadTexts" :key="index">{{str}}</span> <span class="msgInfo" v-if="$store.state.appStatus=='loading'">{{$t('hivuiMain_sysLoading')}}</span> <span class="msgInfo" v-if="$store.state.appStatus!='loading'&&!mainPageInitErrorJump" style="color:red" @click="handleReload" >{{$store.state.appStatusMsg||$t('hivuiMain_loadedFailClickRefresh')}}</span> </span> </div> </transition> </div> </template> <script> import Cookies from 'js-cookie' import LoginPic from "@main/assets/logo_max.png" import { getUrlValue, setUrlValue,getUrlSearch } from "@main/utils"; import { getToken } from '@main/utils/auth' export default { data() { return { loadTexts: "", logoSrc: "", mainPageInitErrorJump:window.mainPageInitErrorJump, }; }, methods: { handleReload() { window.location.reload(); }, detectZoom (){ var ratio = 0, screen = window.screen, ua = navigator.userAgent.toLowerCase(); if (window.devicePixelRatio !== undefined) { ratio = window.devicePixelRatio; } else if (~ua.indexOf('msie')) { if (screen.deviceXDPI && screen.logicalXDPI) { ratio = screen.deviceXDPI / screen.logicalXDPI; } } else if (window.outerWidth !== undefined && window.innerWidth !== undefined) { ratio = window.outerWidth / window.innerWidth; } if (ratio){ ratio = Math.round(ratio * 100); } return ratio; }, checkZoom(){ let ratio = this.detectZoom(); if(ratio!=100){ // this.$message.error('警告，浏览器没有按正常比例显示会影响部份功能！') } }, }, mounted() { // this.checkZoom(); // window.addEventListener('resize',()=>{ // this.checkZoom(); // }); let me=this; // 设置任务中心刷新状态 top.window.__setRefreshTaskcenter = function (state) { if(state==undefined){ state = true; } top.window.__refreshTaskcenter = state; } let urlPn=getUrlValue(location.search,"pn"); if(urlPn){ if(!getUrlValue(window.HIVUI_SETTING.loginUrl,"pn")){ window.HIVUI_SETTING.loginUrl+="?pn="+urlPn; } if(!getUrlValue(window.HIVUI_SETTING.mainPageUrl,"pn")){ window.HIVUI_SETTING.mainPageUrl+="?pn="+urlPn; } if(!getUrlValue(window.HIVUI_SETTING.customLoginUrl,"pn")){ window.HIVUI_SETTING.customLoginUrl+="?pn="+urlPn; } } //如果token不一致，替换掉然后重新载入 let urlToken=getUrlValue(location.href,"access_token"); let nowToken=getToken(); if(false&&!window._global&&urlToken&&nowToken&&(urlToken!=nowToken)){//正式环境 let newUrl=setUrlValue(decodeURIComponent(location.href),"access_token",nowToken); location=newUrl; location.reload(); } //系统间跳转，将ticket去除 if(!window._global&&getUrlValue(decodeURIComponent(location.href),"ticket")){ let newUrl=setUrlValue(decodeURIComponent(location.href),"ticket",""); location=newUrl.replace("&ticket=","")+(location.hash?location.hash:"#/"); //location.reload(); } window.Scp = { User: { id: "admin", name: "管理员", deptId: "", deptName: "", positionId: "GLY", postionName: "管理员", bzId: "admin_3", bzName: "管理员岗位3", bzDeptId: ".WLDJT.DGS", bzDeptName: "D公司", bzPositionId: "HQRY", bzPositionName: "后勤人员", orgId: "admin_3", defOrgId: "admin_3" } } //customSysCofig默认值 window.customSysCofig=_.merge({ showMiniLogin:true, },window.customSysCofig); if(!window.localStorage.getItem("locale")){ window.localStorage.setItem("locale",JSON.stringify({ desc:"中文", name:"zh-CN", })); Cookies.set("locale","zh-CN"); } window.__guid = new Date().valueOf(); //window.customSysCofig=_.merge(window.default_customSysCfg,window.customSysCofig||{}); window==top&&window.customSysCofig&&window.customSysCofig.thirdParty&&window.customSysCofig.thirdParty.forEach((item)=>{//第三方脚本样式资源引用 let _dom; switch(item.type){ case "js": _dom=document.createElement("script"); _dom.type="text/javascript"; _dom.src=item.link; if(item.callback){ _dom.onload=()=>{ item.callback(); } } break; case "css": _dom=document.createElement("link"); _dom.rel="stylesheet"; _dom.href=item.link; break; } document.querySelector("head").appendChild(_dom); }); setTimeout(()=>{ window.__sysConfig = _.merge({ events: { onLoad1: function () { } }, projectName: "eaptpl", /*sysProjectMange: { id: __guid++, name: '工程树', iconClass: 'icon-tree', uri: 'amreport/designer/tree/design.do', url: '/amrept-web/amreport/designer/tree/design.do' },*/ sysList: [ ], langList:{ id: __guid++, name: (window.localStorage.getItem("locale")?(JSON.parse(window.localStorage.getItem("locale")).desc):"中文"), type: 'lang', iconClass: 'icon-edit', children: [ { id: __guid++, name:"中文", key:"zh-CN", }, { id: __guid++, name:"English", key:"en", }, ] }, userInfo:{ id: __guid++, name: '${fusername}', type: 'userInfo', iconClass: 'icon-user', children: [ { id: __guid++, name:me.$t('hivuiMain_app_user')+'：${fusername}/${fuserid}', iconClass:'icon-user', }, { id: __guid++, name:me.$t('hivuiMain_app_orgbz')+'：${fbzname}/${fbzid}', iconClass:'icon-user', type:"orgBz", }, { id: __guid++, name:me.$t('hivuiMain_app_orgname')+'：${forgname}/${forgid}', iconClass:'icon-user', }, { id: __guid++, name:me.$t('hivuiMain_app_rolename')+'：${frolename}/${froleid}', iconClass:'icon-user', }, { id: __guid++, name:me.$t('hivuiMain_app_personal_Center'), iconClass:'icon-user', type: "personalCenter" }, /*{ id: __guid++, iconClass:'icon-edit', name:'修改用户信息', type:'modifyUserInfo', },*/ { id: __guid++, iconClass:'icon-edit', name:me.$t('hivuiMain_app_modifyPw'), type:'modifyPw', }, ] }, },window.customSysCofig); if(window.customSysCofig.addLangList){ window.__sysConfig.langList.children=[...window.__sysConfig.langList.children,...window.customSysCofig.addLangList]; } this.$store.dispatch("app/getSysConfig").then(res=>{ let cfg = this.$store.state.app.config || {}; let loadText = (cfg.sysLoadLogo && cfg.sysLoadLogo.title) || ""; let logoSrc = (cfg.sysLoadLogo && cfg.sysLoadLogo.src) || ""; this.loadTexts=loadText.split(""); this.logoSrc=cfg.sysLoadLogo.hide ? "" : (logoSrc||LoginPic); }); },0); } }; </script> <style scoped> .app { height: 100%; background: linear-gradient( rgb(255, 255, 255) 0px, rgb(243, 248, 253) 50%, rgb(229, 240, 250) ); } .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { opacity: 1; -webkit-transform: translateZ(0); transform: translateZ(0); } } @keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { opacity: 1; -webkit-transform: translateZ(0); transform: translateZ(0); } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } to { opacity: 1; -webkit-transform: translateZ(0); transform: translateZ(0); } } @keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } to { opacity: 1; -webkit-transform: translateZ(0); transform: translateZ(0); } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } .loader { position: absolute; top: 50%; left: 50%; margin-top: -50px; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -mos-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: default; } .loader .txt { display: inline-block; word-break: normal; white-space: nowrap; margin: auto; text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.1), 0 3px 5px rgba(0, 0, 0, 0.1), 0 5px 10px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.1), 0 20px 20px rgba(0, 0, 0, 0.15); } .loader .txt span { display: inline-block; font-size: 68px !important; padding: 0 5px; -webkit-animation: text cubic-bezier(0.75, 0, 0.5, 1) 1.2s infinite; -moz-animation: text cubic-bezier(0.75, 0, 0.5, 1) 1.2s infinite; -moz-animation: text cubic-bezier(0.75, 0, 0.5, 1) 1.2s infinite; -ms-animation: text cubic-bezier(0.75, 0, 0.5, 1) 1.2s infinite; -o-animation: text cubic-bezier(0.75, 0, 0.5, 1) 1.2s infinite; animation: text cubic-bezier(0.75, 0, 0.5, 1) 1.2s infinite; color: #0066cc; } .loader .txt span:nth-child(1) { -webkit-animation-delay: 0ms; -moz-animation-delay: 0ms; -ms-animation-delay: 0ms; -o-animation-delay: 0ms; animation-delay: 0ms; } .loader .txt span:nth-child(2) { -webkit-animation-delay: 100ms; -moz-animation-delay: 100ms; -ms-animation-delay: 100ms; -o-animation-delay: 100ms; animation-delay: 100ms; } .loader .txt span:nth-child(3) { -webkit-animation-delay: 200ms; -moz-animation-delay: 200ms; -ms-animation-delay: 200ms; -o-animation-delay: 200ms; animation-delay: 200ms; } .loader .txt span:nth-child(4) { -webkit-animation-delay: 300ms; -moz-animation-delay: 300ms; -ms-animation-delay: 300ms; -o-animation-delay: 300ms; animation-delay: 300ms; } .loader .txt span:nth-child(5) { -webkit-animation-delay: 400ms; -moz-animation-delay: 400ms; -ms-animation-delay: 400ms; -o-animation-delay: 400ms; animation-delay: 400ms; } .loader .txt span:nth-child(6) { -webkit-animation-delay: 500ms; -moz-animation-delay: 500ms; -ms-animation-delay: 500ms; -o-animation-delay: 500ms; animation-delay: 500ms; } .loader .txt span:nth-child(7) { -webkit-animation-delay: 600ms; -moz-animation-delay: 600ms; -ms-animation-delay: 600ms; -o-animation-delay: 600ms; animation-delay: 600ms; } .loader .txt span:nth-child(8) { -webkit-animation-delay: 700ms; -moz-animation-delay: 700ms; -ms-animation-delay: 700ms; -o-animation-delay: 700ms; animation-delay: 700ms; } .loader .txt span:nth-child(9) { -webkit-animation-delay: 800ms; -moz-animation-delay: 800ms; -ms-animation-delay: 800ms; -o-animation-delay: 800ms; animation-delay: 800ms; } .loader .txt span:nth-child(10) { -webkit-animation-delay: 900ms; -moz-animation-delay: 900ms; -ms-animation-delay: 900ms; -o-animation-delay: 900ms; animation-delay: 900ms; } .loader .txt span:nth-child(11) { -webkit-animation-delay: 1000ms; -moz-animation-delay: 1000ms; -ms-animation-delay: 1000ms; -o-animation-delay: 1000ms; animation-delay: 1000ms; } .loader .txt span:nth-child(12) { -webkit-animation-delay: 1100ms; -moz-animation-delay: 1100ms; -ms-animation-delay: 1100ms; -o-animation-delay: 1100ms; animation-delay: 1100ms; } .loader .txt span:nth-child(13) { -webkit-animation-delay: 1200ms; -moz-animation-delay: 1200ms; -ms-animation-delay: 1200ms; -o-animation-delay: 1200ms; animation-delay: 1200ms; } .loader .txt span.msgInfo { display: block; padding-top: 15px; font-size: 16px !important; text-shadow: none; color: #0272bd; text-shadow: none; animation: none; -webkit-animation: none; } @-webkit-keyframes text { 0% { color: #0066cc; } 40% { color: #fff; } 70%, 100% { color: #0066cc; } } @-moz-keyframes text { 0% { color: #0066cc; } 40% { color: #fff; } 70%, 100% { color: #0066cc; } } @-mos-keyframes text { 0% { color: #0066cc; } 40% { color: #fff; } 70%, 100% { color: #0066cc; } } @-o-keyframes text { 0% { color: #0066cc; } 40% { color: #fff; } 70%, 100% { color: #0066cc; } } @keyframes text { 0% { color: #0066cc; } 40% { color: #fff; } 70%, 100% { color: #0066cc; } } </style>

Ignore Space Show notes View project/hivuiMain/assets/iconfonts/expand/demo.css 0 → 100644

/* Logo 字体 */ @font-face { font-family: "iconfont logo"; src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834'); src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'), url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'), url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'), url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg'); } .logo { font-family: "iconfont logo"; font-size: 160px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* tabs */ .nav-tabs { position: relative; } .nav-tabs .nav-more { position: absolute; right: 0; bottom: 0; height: 42px; line-height: 42px; color: #666; } #tabs { border-bottom: 1px solid #eee; } #tabs li { cursor: pointer; width: 100px; height: 40px; line-height: 40px; text-align: center; font-size: 16px; border-bottom: 2px solid transparent; position: relative; z-index: 1; margin-bottom: -1px; color: #666; } #tabs .active { border-bottom-color: #f00; color: #222; } .tab-container .content { display: none; } /* 页面布局 */ .main { padding: 30px 100px; width: 960px; margin: 0 auto; } .main .logo { color: #333; text-align: left; margin-bottom: 30px; line-height: 1; height: 110px; margin-top: -50px; overflow: hidden; *zoom: 1; } .main .logo a { font-size: 160px; color: #333; } .helps { margin-top: 40px; } .helps pre { padding: 20px; margin: 10px 0; border: solid 1px #e7e1cd; background-color: #fffdef; overflow: auto; } .icon_lists { width: 100% !important; overflow: hidden; *zoom: 1; } .icon_lists li { width: 100px; margin-bottom: 10px; margin-right: 20px; text-align: center; list-style: none !important; cursor: default; } .icon_lists li .code-name { line-height: 1.2; } .icon_lists .icon { display: block; height: 100px; line-height: 100px; font-size: 42px; margin: 10px auto; color: #333; -webkit-transition: font-size 0.25s linear, width 0.25s linear; -moz-transition: font-size 0.25s linear, width 0.25s linear; transition: font-size 0.25s linear, width 0.25s linear; } .icon_lists .icon:hover { font-size: 100px; } .icon_lists .svg-icon { /* 通过设置 font-size 来改变图标大小 */ width: 1em; /* 图标和文字相邻时，垂直对齐 */ vertical-align: -0.15em; /* 通过设置 color 来改变 SVG 的颜色/fill */ fill: currentColor; /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示 normalize.css 中也包含这行 */ overflow: hidden; } .icon_lists li .name, .icon_lists li .code-name { color: #666; } /* markdown 样式 */ .markdown { color: #666; font-size: 14px; line-height: 1.8; } .highlight { line-height: 1.5; } .markdown img { vertical-align: middle; max-width: 100%; } .markdown h1 { color: #404040; font-weight: 500; line-height: 40px; margin-bottom: 24px; } .markdown h2, .markdown h3, .markdown h4, .markdown h5, .markdown h6 { color: #404040; margin: 1.6em 0 0.6em 0; font-weight: 500; clear: both; } .markdown h1 { font-size: 28px; } .markdown h2 { font-size: 22px; } .markdown h3 { font-size: 16px; } .markdown h4 { font-size: 14px; } .markdown h5 { font-size: 12px; } .markdown h6 { font-size: 12px; } .markdown hr { height: 1px; border: 0; background: #e9e9e9; margin: 16px 0; clear: both; } .markdown p { margin: 1em 0; } .markdown>p, .markdown>blockquote, .markdown>.highlight, .markdown>ol, .markdown>ul { width: 80%; } .markdown ul>li { list-style: circle; } .markdown>ul li, .markdown blockquote ul>li { margin-left: 20px; padding-left: 4px; } .markdown>ul li p, .markdown>ol li p { margin: 0.6em 0; } .markdown ol>li { list-style: decimal; } .markdown>ol li, .markdown blockquote ol>li { margin-left: 20px; padding-left: 4px; } .markdown code { margin: 0 3px; padding: 0 5px; background: #eee; border-radius: 3px; } .markdown strong, .markdown b { font-weight: 600; } .markdown>table { border-collapse: collapse; border-spacing: 0px; empty-cells: show; border: 1px solid #e9e9e9; width: 95%; margin-bottom: 24px; } .markdown>table th { white-space: nowrap; color: #333; font-weight: 600; } .markdown>table th, .markdown>table td { border: 1px solid #e9e9e9; padding: 8px 16px; text-align: left; } .markdown>table th { background: #F7F7F7; } .markdown blockquote { font-size: 90%; color: #999; border-left: 4px solid #e9e9e9; padding-left: 0.8em; margin: 1em 0; } .markdown blockquote p { margin: 0; } .markdown .anchor { opacity: 0; transition: opacity 0.3s ease; margin-left: 8px; } .markdown .waiting { color: #ccc; } .markdown h1:hover .anchor, .markdown h2:hover .anchor, .markdown h3:hover .anchor, .markdown h4:hover .anchor, .markdown h5:hover .anchor, .markdown h6:hover .anchor { opacity: 1; display: inline-block; } .markdown>br, .markdown>p>br { clear: both; } .hljs { display: block; background: white; padding: 0.5em; color: #333333; overflow-x: auto; } .hljs-comment, .hljs-meta { color: #969896; } .hljs-string, .hljs-variable, .hljs-template-variable, .hljs-strong, .hljs-emphasis, .hljs-quote { color: #df5000; } .hljs-keyword, .hljs-selector-tag, .hljs-type { color: #a71d5d; } .hljs-literal, .hljs-symbol, .hljs-bullet, .hljs-attribute { color: #0086b3; } .hljs-section, .hljs-name { color: #63a35c; } .hljs-tag { color: #333333; } .hljs-title, .hljs-attr, .hljs-selector-id, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo { color: #795da3; } .hljs-addition { color: #55a532; background-color: #eaffea; } .hljs-deletion { color: #bd2c00; background-color: #ffecec; } .hljs-link { text-decoration: underline; } /* 代码高亮 */ /* PrismJS 1.15.0 https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */ /** * prism.js default theme for JavaScript, CSS and HTML * Based on dabblet (http://dabblet.com) * @author Lea Verou */ code[class*="language-"], pre[class*="language-"] { color: black; background: none; text-shadow: 0 1px white; font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; word-wrap: normal; line-height: 1.5; -moz-tab-size: 4; -o-tab-size: 4; tab-size: 4; -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; } pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection, code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection { text-shadow: none; background: #b3d4fc; } pre[class*="language-"]::selection, pre[class*="language-"] ::selection, code[class*="language-"]::selection, code[class*="language-"] ::selection { text-shadow: none; background: #b3d4fc; } @media print { code[class*="language-"], pre[class*="language-"] { text-shadow: none; } } /* Code blocks */ pre[class*="language-"] { padding: 1em; margin: .5em 0; overflow: auto; } :not(pre)>code[class*="language-"], pre[class*="language-"] { background: #f5f2f0; } /* Inline code */ :not(pre)>code[class*="language-"] { padding: .1em; border-radius: .3em; white-space: normal; } .token.comment, .token.prolog, .token.doctype, .token.cdata { color: slategray; } .token.punctuation { color: #999; } .namespace { opacity: .7; } .token.property, .token.tag, .token.boolean, .token.number, .token.constant, .token.symbol, .token.deleted { color: #905; } .token.selector, .token.attr-name, .token.string, .token.char, .token.builtin, .token.inserted { color: #690; } .token.operator, .token.entity, .token.url, .language-css .token.string, .style .token.string { color: #9a6e3a; background: hsla(0, 0%, 100%, .5); } .token.atrule, .token.attr-value, .token.keyword { color: #07a; } .token.function, .token.class-name { color: #DD4A68; } .token.regex, .token.important, .token.variable { color: #e90; } .token.important, .token.bold { font-weight: bold; } .token.italic { font-style: italic; } .token.entity { cursor: help; }

Ignore Space Show notes View project/hivuiMain/assets/iconfonts/expand/demo_index.html 0 → 100644

<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>iconfont Demo</title> <link rel="shortcut icon" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg" type="image/x-icon"/> <link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg"/> <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css"> <link rel="stylesheet" href="demo.css"> <link rel="stylesheet" href="iconfont.css"> <script src="iconfont.js"></script> <!-- jQuery --> <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script> <!-- 代码高亮 --> <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script> <style> .main .logo { margin-top: 0; height: auto; } .main .logo a { display: flex; align-items: center; } .main .logo .sub-title { margin-left: 0.5em; font-size: 22px; color: #fff; background: linear-gradient(-45deg, #3967FF, #B500FE); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } </style> </head> <body> <div class="main"> <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank"> <img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg"> </a></h1> <div class="nav-tabs"> <ul id="tabs" class="dib-box"> <li class="dib active"><span>Unicode</span></li> <li class="dib"><span>Font class</span></li> <li class="dib"><span>Symbol</span></li> </ul> <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=5075494" target="_blank" class="nav-more">查看项目</a> </div> <div class="tab-container"> <div class="content unicode" style="display: block;"> <ul class="icon_lists dib-box"> <li class="dib"> <span class="icon iconfont">&#xe60b;</span> <div class="name">language</div> <div class="code-name">&amp;#xe60b;</div> </li> <li class="dib"> <span class="icon iconfont">&#xe64e;</span> <div class="name">layout</div> <div class="code-name">&amp;#xe64e;</div> </li> </ul> <div class="article markdown"> <h2 id="unicode-">Unicode 引用</h2> <hr> <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p> <ul> <li>支持按字体的方式去动态调整图标大小，颜色等等。</li> <li>默认情况下不支持多色，直接添加多色图标会自动去色。</li> </ul> <blockquote> <p>注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）</p> </blockquote> <p>Unicode 使用步骤如下：</p> <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3> <pre><code class="language-css" >@font-face { font-family: 'iconfont'; src: url('iconfont.woff2?t=1764229777757') format('woff2'), url('iconfont.woff?t=1764229777757') format('woff'), url('iconfont.ttf?t=1764229777757') format('truetype'); } </code></pre> <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3> <pre><code class="language-css" >.iconfont { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } </code></pre> <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3> <pre> <code class="language-html" >&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt; </code></pre> <blockquote> <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p> </blockquote> </div> </div> <div class="content font-class"> <ul class="icon_lists dib-box"> <li class="dib"> <span class="icon iconfont icon-language"></span> <div class="name"> language </div> <div class="code-name">.icon-language </div> </li> <li class="dib"> <span class="icon iconfont icon-layout"></span> <div class="name"> layout </div> <div class="code-name">.icon-layout </div> </li> </ul> <div class="article markdown"> <h2 id="font-class-">font-class 引用</h2> <hr> <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p> <p>与 Unicode 使用方式相比，具有如下特点：</p> <ul> <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li> <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li> </ul> <p>使用步骤如下：</p> <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3> <pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt; </code></pre> <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3> <pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt; </code></pre> <blockquote> <p>" iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p> </blockquote> </div> </div> <div class="content symbol"> <ul class="icon_lists dib-box"> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-language"></use> </svg> <div class="name">language</div> <div class="code-name">#icon-language</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-layout"></use> </svg> <div class="name">layout</div> <div class="code-name">#icon-layout</div> </li> </ul> <div class="article markdown"> <h2 id="symbol-">Symbol 引用</h2> <hr> <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a> 这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p> <ul> <li>支持多色图标了，不再受单色限制。</li> <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li> <li>兼容性较差，支持 IE9+，及现代浏览器。</li> <li>浏览器渲染 SVG 的性能一般，还不如 png。</li> </ul> <p>使用步骤如下：</p> <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3> <pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt; </code></pre> <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3> <pre><code class="language-html">&lt;style&gt; .icon { width: 1em; height: 1em; vertical-align: -0.15em; fill: currentColor; overflow: hidden; } &lt;/style&gt; </code></pre> <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3> <pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt; &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt; &lt;/svg&gt; </code></pre> </div> </div> </div> </div> <script> $(document).ready(function () { $('.tab-container .content:first').show() $('#tabs li').click(function (e) { var tabContent = $('.tab-container .content') var index = $(this).index() if ($(this).hasClass('active')) { return } else { $('#tabs li').removeClass('active') $(this).addClass('active') tabContent.hide().eq(index).fadeIn() } }) }) </script> </body> </html>

Ignore Space Show notes View project/hivuiMain/assets/iconfonts/expand/iconfont.css 0 → 100644

@font-face { font-family: "iconfont"; /* Project id 5075494 */ src: url('iconfont.woff2?t=1764229777757') format('woff2'), url('iconfont.woff?t=1764229777757') format('woff'), url('iconfont.ttf?t=1764229777757') format('truetype'); } .iconfont { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-language:before { content: "\e60b"; } .icon-layout:before { content: "\e64e"; }

Ignore Space Show notes View project/hivuiMain/assets/iconfonts/expand/iconfont.js 0 → 100644

window._iconfont_svg_string_5075494='<svg><symbol id="icon-language" viewBox="0 0 1024 1024"><path d="M511.488 0C228.864 0 0 229.376 0 512s228.864 512 511.488 512C794.624 1024 1024 794.624 1024 512S794.624 0 511.488 0z m354.816 307.2h-151.04a801.28 801.28 0 0 0-70.656-182.272A411.136 411.136 0 0 1 866.304 307.2zM512 104.448c42.496 61.44 75.776 129.536 97.792 202.752H414.208C436.224 233.984 469.504 165.888 512 104.448zM115.712 614.4C107.52 581.632 102.4 547.328 102.4 512s5.12-69.632 13.312-102.4h173.056c-4.096 33.792-7.168 67.584-7.168 102.4 0 34.816 3.072 68.608 7.168 102.4H115.712z m41.984 102.4h151.04c16.384 64 39.936 125.44 70.656 182.272A408.9344 408.9344 0 0 1 157.696 716.8z m151.04-409.6H157.696a408.9344 408.9344 0 0 1 221.696-182.272A801.28 801.28 0 0 0 308.736 307.2zM512 919.552c-42.496-61.44-75.776-129.536-97.792-202.752h195.584c-22.016 73.216-55.296 141.312-97.792 202.752zM631.808 614.4H392.192c-4.608-33.792-8.192-67.584-8.192-102.4 0-34.816 3.584-69.12 8.192-102.4h239.616c4.608 33.28 8.192 67.584 8.192 102.4 0 34.816-3.584 68.608-8.192 102.4z m12.8 284.672c30.72-56.832 54.272-118.272 70.656-182.272h151.04a411.136 411.136 0 0 1-221.696 182.272zM735.232 614.4c4.096-33.792 7.168-67.584 7.168-102.4 0-34.816-3.072-68.608-7.168-102.4h173.056c8.192 32.768 13.312 67.072 13.312 102.4s-5.12 69.632-13.312 102.4h-173.056z" fill="#5F6368" ></path></symbol><symbol id="icon-layout" viewBox="0 0 1024 1024"><path d="M384 912.014222h496.014222c17.692444 0 32-14.307556 32-32.028444V339.996444H384v572.017778zM880.014222 111.957333H384v164.010667h528.014222v-131.982222c0-17.720889-14.307556-32-32.028444-32z m-768 32.028445v736c0 17.692444 14.279111 32 31.971556 32h176.014222V111.957333H143.985778c-17.692444 0-32 14.307556-32 32.028445z" fill="#000000" fill-opacity=".65" ></path></symbol></svg>',(n=>{var t=(e=(e=document.getElementsByTagName("script"))[e.length-1]).getAttribute("data-injectcss"),e=e.getAttribute("data-disable-injectsvg");if(!e){var o,i,c,a,d,s=function(t,e){e.parentNode.insertBefore(t,e)};if(t&&!n.__iconfont__svg__cssinject__){n.__iconfont__svg__cssinject__=!0;try{document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>")}catch(t){console&&console.log(t)}}o=function(){var t,e=document.createElement("div");e.innerHTML=n._iconfont_svg_string_5075494,(e=e.getElementsByTagName("svg")[0])&&(e.setAttribute("aria-hidden","true"),e.style.position="absolute",e.style.width=0,e.style.height=0,e.style.overflow="hidden",e=e,(t=document.body).firstChild?s(e,t.firstChild):t.appendChild(e))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(o,0):(i=function(){document.removeEventListener("DOMContentLoaded",i,!1),o()},document.addEventListener("DOMContentLoaded",i,!1)):document.attachEvent&&(c=o,a=n.document,d=!1,r(),a.onreadystatechange=function(){"complete"==a.readyState&&(a.onreadystatechange=null,l())})}function l(){d||(d=!0,c())}function r(){try{a.documentElement.doScroll("left")}catch(t){return void setTimeout(r,50)}l()}})(window);

Ignore Space Show notes View project/hivuiMain/assets/iconfonts/expand/iconfont.json 0 → 100644
{ "id": "5075494", "name": "template", "font_family": "iconfont", "css_prefix_text": "icon-", "description": "", "glyphs": [ { "icon_id": "11903005", "name": "language", "font_class": "language", "unicode": "e60b", "unicode_decimal": 58891 }, { "icon_id": "19100272", "name": "layout", "font_class": "layout", "unicode": "e64e", "unicode_decimal": 58958 } ] }

Ignore Space Show notes View project/hivuiMain/assets/iconfonts/expand/iconfont.ttf 0 → 100644
Not supported

Ignore Space Show notes View project/hivuiMain/assets/iconfonts/expand/iconfont.woff 0 → 100644
Not supported

Ignore Space Show notes View project/hivuiMain/assets/iconfonts/expand/iconfont.woff2 0 → 100644
Not supported

Ignore Space Show notes View project/hivuiMain/index.js

// import Vue from 'vue' import App from './App.vue' import router from './router' import store from './store' import './assets/iconfonts/iconfont.css' import './assets/iconfonts/expand/iconfont.css' import './assets/page.less' // import 'normalize.css' import './permission' // permission control if(process.env.hiui_debug){ //这样多次引用element //hiui调试时用 Vue.use(ELEMENT) } //設置script引入全局的ELEMENT 配置 Vue.prototype.$ELEMENT = { size: 'mini', zIndex: 3000 }; import GeminiScrollbar from 'vue-gemini-scrollbar' Vue.use(GeminiScrollbar) import Message from './components/vue-m-message' Vue.use(Message) // will mount `Vue.prototype.$message` /*任务中心*/ import 'zhc-flowchart/lib/zhc-flowchart.css' import  zhcflowchart from "zhc-flowchart"; Vue.use(zhcflowchart) Vue.config.productionTip = false import Package from '../../package.json' console.log( '%c hi-vui-template %c v'.concat(Package.version, ' '), 'padding: 2px 1px; border-radius: 3px 0 0 3px; color: #fff; background: #5584ff; font-weight: bold;', 'padding: 2px 1px; border-radius: 0 3px 3px 0; color: #fff; background: #42c02e; font-weight: bold;', ); Vue.directive('add2Body', { // 当被绑定的元素插入到 DOM 中时…… inserted: function (el) { document.body.appendChild(el); } }); let hiSetting = HIVUI_SETTING; Vue.prototype.$HI = { projectName: hiSetting.projectName, request: hiSetting.request, queryOperate: hiSetting.queryOperate, pageSize: 20, saveUrl: hiSetting.saveUrl, queryUrl: hiSetting.queryUrl, datasetUrl: hiSetting.datasetUrl, policyUrl: hiSetting.policyUrl, upload: hiSetting.upload, download: hiSetting.download, review: hiSetting.review, getFlowInfo: hiSetting.getFlowInfo, getApprovalInfo: hiSetting.getApprovalInfo, processFlow: hiSetting.processFlow, queryTask: hiSetting.queryTask, withdrawtask: hiSetting.withdrawtask, taskDiagram: hiSetting.taskDiagram, openOrdernumber: hiSetting.openOrdernumber, editorImgServer :hiSetting.review+"?relativePath=" }; new Vue({ router, store, render: h => h(App) }).$mount('#app') // import Vue from 'vue' import App from './App.vue' import router from './router' import store from './store' import './assets/iconfonts/iconfont.css' import './assets/page.less' // import 'normalize.css' import './permission' // permission control if(process.env.hiui_debug){ //这样多次引用element //hiui调试时用 Vue.use(ELEMENT) } //設置script引入全局的ELEMENT 配置 Vue.prototype.$ELEMENT = { size: 'mini', zIndex: 3000 }; import GeminiScrollbar from 'vue-gemini-scrollbar' Vue.use(GeminiScrollbar) import Message from './components/vue-m-message' Vue.use(Message) // will mount `Vue.prototype.$message` /*任务中心*/ import 'zhc-flowchart/lib/zhc-flowchart.css' import  zhcflowchart from "zhc-flowchart"; Vue.use(zhcflowchart) Vue.config.productionTip = false import Package from '../../package.json' console.log( '%c hi-vui-template %c v'.concat(Package.version, ' '), 'padding: 2px 1px; border-radius: 3px 0 0 3px; color: #fff; background: #5584ff; font-weight: bold;', 'padding: 2px 1px; border-radius: 0 3px 3px 0; color: #fff; background: #42c02e; font-weight: bold;', ); Vue.directive('add2Body', { // 当被绑定的元素插入到 DOM 中时…… inserted: function (el) { document.body.appendChild(el); } }); let hiSetting = HIVUI_SETTING; Vue.prototype.$HI = { projectName: hiSetting.projectName, request: hiSetting.request, queryOperate: hiSetting.queryOperate, pageSize: 20, saveUrl: hiSetting.saveUrl, queryUrl: hiSetting.queryUrl, datasetUrl: hiSetting.datasetUrl, policyUrl: hiSetting.policyUrl, upload: hiSetting.upload, download: hiSetting.download, review: hiSetting.review, getFlowInfo: hiSetting.getFlowInfo, getApprovalInfo: hiSetting.getApprovalInfo, processFlow: hiSetting.processFlow, queryTask: hiSetting.queryTask, withdrawtask: hiSetting.withdrawtask, taskDiagram: hiSetting.taskDiagram, openOrdernumber: hiSetting.openOrdernumber, editorImgServer :hiSetting.review+"?relativePath=" }; new Vue({ router, store, render: h => h(App) }).$mount('#app')

Show line notes below