Skip to content

T
testMenu
提交 bed466ee authored 作者: caicai's avatar caicai
浏览文件
操作

加载app列表优化

上级 99044d15
显示空白字符变更
内嵌 并排
正在显示 包含 269 行增加 和 4191 行删除
package.json
浏览文件 @ bed466ee
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
"homepage": "/", "homepage": "/",
"author": "Guangzhou Menu Technology Co., Ltd. <service@sei-tpo.com> (https://www.zei-dao.com/)", "author": "Guangzhou Menu Technology Co., Ltd. <service@sei-tpo.com> (https://www.zei-dao.com/)",
"scripts": { "scripts": {
"serve": "vue-cli-service serve --mode web", "serve": "vue-cli-service serve --mode web --enable-transparent-visuals --disable-gpu",
"build": "vue-cli-service build", "build": "vue-cli-service build",
"build:web": "vue-cli-service build --mode web", "build:web": "vue-cli-service build --mode web",
"test:unit": "vue-cli-service test:unit", "test:unit": "vue-cli-service test:unit",
......
src/assets/css/coloursBase.less deleted 100644 → 0
浏览文件 @ 99044d15
// Colour definitions
// --------------------------------------------------
@blue: #36CDE8;
@blueDark: #263944;
@grey: #9096A0;
@greyDark: #4D4D4D;
@white:#fff;
@black: #000;
// These variables are used to change the colour of text
// Primary use is for altering the text colour over a background image
// See ../project/theme-extras.less for block mixin
// --------------------------------------------------
@transparent-light: transparent;
@transparent-dark: transparent;
// Note: If customising a theme for the Authoring Tool please update the
// corresponding default value for that variable in the properties.schema file.
// This is to stop any amended variables below being overwritten by
// the Theme Picker in the Authoring Tool.
// Body, link, and heading colour
// --------------------------------------------------
@font-color: @greyDark;
@font-color-inverted: @white;
@link: @font-color;
@link-inverted: @font-color-inverted;
@link-hover: @link;
@link-inverted-hover: @link-inverted;
@heading-color: @blue;
@heading-color-inverted: @white;
// Items - components
// --------------------------------------------------
@item-color: @blue;
@item-color-inverted: @white;
@item-color-hover: darken(@item-color, 10%);
@item-color-inverted-hover: @item-color-inverted;
@item-color-selected: darken(@item-color, 20%);
@item-color-inverted-selected: @item-color-inverted;
// Visited - presentation components
// --------------------------------------------------
@visited: #727272;
@visited-inverted: @white;
// Buttons
// --------------------------------------------------
@btn-color: @greyDark;
@btn-color-inverted: @white;
@btn-color-hover: darken(@btn-color, 10%);
@btn-color-inverted-hover: @btn-color-inverted;
// Button icon
// --------------------------------------------------
@btn-icon-color: @nav-icon;
@btn-icon-color-inverted: @nav-icon-inverted;
@btn-icon-color-hover: @nav-icon-hover;
@btn-icon-color-inverted-hover: @nav-icon-inverted-hover;
// Disabled - question components
// --------------------------------------------------
@disabled: #DDDDDD;
@disabled-inverted: @black;
// Validation states - question marking
// --------------------------------------------------
@validation-success: #065f28;
@validation-success-inverted: @white;
@validation-error: #ff0000;
@validation-error-inverted: @white;
// Progress
// --------------------------------------------------
@progress: @grey;
@progress-inverted: @white;
@progress-border: @grey;
// Menu
// --------------------------------------------------
@menu-item: @white;
@menu-item-inverted: @font-color;
@menu-item-border-color: @item-color;
@menu-item-progress: @progress;
@menu-item-progress-inverted: @progress-inverted;
@menu-item-progress-border: @progress-border;
@menu-item-btn-color: @btn-color;
@menu-item-btn-color-inverted: @btn-color-inverted;
@menu-item-btn-color-hover: @btn-color-hover;
@menu-item-btn-color-inverted-hover: @btn-color-inverted-hover;
// Navigation
// --------------------------------------------------
@nav: @white;
@nav-inverted: @grey;
@nav-icon: @nav-inverted;
@nav-icon-inverted: @nav;
@nav-icon-hover: darken(@nav-icon, 10%);
@nav-icon-inverted-hover: @nav-icon-inverted;
@nav-progress: @nav-icon-inverted;
@nav-progress-inverted: @nav-icon;
@nav-progress-border: @nav-icon-inverted;
@nav-progress-hover: @nav-icon-inverted-hover;
@nav-progress-inverted-hover: @nav-progress-inverted;
@nav-progress-border-hover: @nav-progress-border;
// Notify
// --------------------------------------------------
@notify: @blue;
@notify-inverted: @white;
@notify-link: @notify-inverted;
@notify-link-hover: @notify-link;
@notify-btn: @btn-color-inverted;
@notify-btn-inverted: @btn-color;
@notify-btn-hover: darken(@notify-btn, 10%);
@notify-btn-inverted-hover: @notify-btn-inverted;
@notify-icon: @notify;
@notify-icon-inverted: @notify-inverted;
@notify-icon-hover: darken(@notify-icon, 10%);
@notify-icon-inverted-hover: @notify-icon-inverted;
// Drawer
// --------------------------------------------------
@drawer: @blueDark;
@drawer-inverted: @white;
@drawer-link: @drawer-inverted;
@drawer-link-hover: @drawer-link;
@drawer-icon: @drawer;
@drawer-icon-inverted: @drawer-inverted;
@drawer-icon-hover: darken(@drawer-icon, 10%);
@drawer-icon-inverted-hover: @drawer-icon-inverted;
@drawer-item: @drawer;
@drawer-item-inverted: @drawer-inverted;
@drawer-item-hover: darken(@drawer-item, 10%);
@drawer-item-inverted-hover: @drawer-item-inverted;
@drawer-item-selected: darken(@drawer-item, 20%);
@drawer-item-inverted-selected: @drawer-item-inverted;
@drawer-progress: @drawer-item-inverted;
@drawer-progress-inverted: @drawer-item;
@drawer-progress-border: @drawer-item-inverted;
@drawer-progress-hover: @drawer-item-inverted-hover;
@drawer-progress-inverted-hover: @drawer-item-hover;
@drawer-progress-border-hover: @drawer-progress-border;
// Background
// --------------------------------------------------
@background: @black;
@background-inverted: @white;
// Shadow
// --------------------------------------------------
@shadow: @black;
@shadow-inverted: @white;
src/assets/css/common.less deleted 100644 → 0
浏览文件 @ 99044d15
@import './mixin.less';
@import './transition.less';
@import './sidebar.less';
// 用于显示富文本编辑器里的超文本链接弹窗
.ck.ck-balloon-panel {
z-index: 9999!important;
}
// 控制富文本编辑器里 ‘超文本链接+媒体资源’ 输入框的placeholder的垂直居中
[dir=ltr] :is(.ck.ck-labeled-field-view.ck-labeled-field-view_empty:not(.ck-labeled-field-view_focused):not(.ck-labeled-field-view_placeholder)>.ck.ck-labeled-field-view__input-wrapper>.ck.ck-label) {
transform: translate(var(--ck-spacing-medium),calc(var(--ck-font-size-base)*.45)) scale(1) !important;
}
// 取色器
.el-color-dropdown.el-color-picker__panel {
z-index: 9999!important;
}
// 下拉选择
.el-select-dropdown.el-popper {
z-index: 9999!important;
}
.el-message {
// 消息提示
z-index: 9999!important;
}
ul {
list-style:none;
margin: 0;
padding: 0;
}
p {
margin: 0;
margin-block-start: 0;
margin-block-end: 0;
}
* {
// box-sizing: border-box;
}
// 自定义滚动条
// ::-webkit-scrollbar{width:10px;height:10px}
// ::-webkit-scrollbar-button{width:4px;height:0}
// ::-webkit-scrollbar-track{background:0 0}
// ::-webkit-scrollbar-thumb{background:#dadadb;-webkit-transition:.3s;transition:.3s}
// ::-webkit-scrollbar-thumb:hover{background-color:#b0b2b3}
// ::-webkit-scrollbar-thumb:active{background-color:#b0b2b3}
::-webkit-scrollbar {
width: 6px;
height: 6px;
}
::-webkit-scrollbar-thumb {
border-radius: 6px;
background-color: #D9D9D9;
}
// 指定某个容器的滚动条不显示
// .list-container::-webkit-scrollbar{width:0;height:0}
// 隐藏滚动条
// ::-webkit-scrollbar{width:0;height:0}
// ::-webkit-scrollbar-button{width:0;height:0}
// ::-webkit-scrollbar-track{background:0 0}
// ::-webkit-scrollbar-thumb{background:#dadadb;-webkit-transition:.3s;transition:.3s}
// ::-webkit-scrollbar-thumb:hover{background-color:#b0b2b3}
// ::-webkit-scrollbar-thumb:active{background-color:#b0b2b3}
.clearfix {
zoom: 1;
&:after {
content: "";
display: table;
clear: both;
}
}
.displaynone {display: none;}
.visiblehide {visibility: hidden;}
.textcenter {text-align: center;}
.textright {text-align: right;}
.underline {text-decoration: underline;}
.notunderline {text-decoration: none;}
.prel{position: relative;}
.pointer{cursor: pointer;}
.not-allowed{cursor: not-allowed;}
.cursorDefault{cursor: default;}
.pover{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.poverOfHtml {
overflow: hidden;text-overflow: ellipsis;white-space: nowrap;
p {
overflow: hidden;text-overflow: ellipsis;white-space: nowrap;
}
}
.poverOfHtmlTile{
font-size: 16px;
overflow: hidden;text-overflow: ellipsis;white-space: nowrap;
//第一个一行隐藏，其他不显示
p:nth-of-type(1) {
overflow: hidden;text-overflow: ellipsis;white-space: nowrap;
}
p:not(:nth-of-type(1)) {
display: none;
}
span {
font-size: 16px!important;
}
}
.pover2{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.pover2OfHtmlTile {
p {
overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;
}
}
.richHtml {
&_c222 {
span {
color: #222;
}
}
}
.hidden{overflow: hidden;}
.inlineblock{display: inline-block;}
.inline{display: inline;}
.input__icon{
height: 100%;
width: 25px;
text-align: center;
transition: all .3s;
line-height: inherit;
}
.button {
&__red {
box-sizing: border-box;
border-radius: 11px;
border: 1px solid #E74362;
width: 45px;
height: 22px;
line-height: 20px;
text-align: center;
font-size: 12px;
color: #E74362;
transition: all 200ms ease;
.pointer;
&:hover{
background-color: #E74362;
color: #fff;
}
}
}
.progress_bgc_FFCCD6 {
.el-progress-bar__outer {
height: 8px!important;
background-color: #FFCCD6;
}
}
.el-input .el-input__inner { color: #222!important; }
// 滚动效果
.scroll-parent {
height: 100%;
}
.scroll-box {
box-sizing: border-box;
padding-bottom: 10px;
height: 100%;
// flex: 1 1 0%;
overflow: hidden auto;
&.width0 {
&::-webkit-scrollbar {
width: 0;
}
}
}
// 重置el-dropdown
.el-dropdown-menu {
transform: translateY(-6px);
padding: 0;
border: 1px solid #EEEEEE;
box-shadow: 0 2px 8px 0 rgba(0,0,0,0.12);
border-radius: 8px;
overflow: hidden;
&.height46 {
li.el-dropdown-menu__item {
line-height: 46px;
}
}
li.el-dropdown-menu__item {
padding: 0 16px;
line-height: 40px;
font-size: 14px;
color: #222222;
white-space: nowrap; //不换行，确保英文状态下，一行显示
}
/deep/.popper__arrow {
display: none;
&::after {
display: none;
}
}
}
.el-dropdown-menu__item--divided {
margin-top: 0;
border-top-color: #F0F0F0;
}
.el-dropdown-menu__item--divided:before {
display: none;
}
.el-dropdown-menu__item:focus, .el-dropdown-menu__item:not(.is-disabled):hover {
background-color: #F0F0F0;
}
.el-dropdown-menu__item:focus, .el-dropdown-menu__item:not(.is-disabled):hover {
color: #222222;
}
// 重置el-input
.el-input {
box-sizing: border-box;
border-radius: 4px;
background-color: inherit;
height: 40px;
line-height: 40px;
&.h48 {
height: 48px;
line-height: 48px;
}
.el-input__inner {
background-color: inherit;
color: #333;
height: inherit; //!important 导致不能自动增高
line-height: inherit;
}
.el-input__inner::placeholder {
font-size: 14px;
color: rgba(51, 51, 51, 0.5);
}
.el-input__prefix { left: 8px; }
.el-input__icon {
line-height: inherit!important;
}
}
// 重置el-select
.el-select {
border-radius: 4px;
.el-input {
height: inherit;
line-height: inherit;
}
}
.el-select-dropdown__list {
padding: 0;
}
.el-select-dropdown {
border-radius: 8px;
overflow: hidden;
/deep/.popper__arrow {
display: none;
&::after {
display: none;
}
}
}
.el-popper[x-placement^=bottom] {
margin-top: 0;
}
.el-popper[x-placement^=bottom] .popper__arrow::after{
border-bottom-color: transparent;
}
.el-popper .popper__arrow, .el-popper .popper__arrow::after{
border-style: none !important;
}
.el-select-dropdown__item {
padding: 0 16px;
height: 40px;
line-height: 40px;
transition: background 0.6s;
&.hover,
&:hover {
background-color: #EDEDED;
}
}
.el-select-dropdown__item,
.el-select-dropdown__item.selected {
font-weight: normal;
color: #222222;
}
.el-select-dropdown.is-multiple .el-select-dropdown__item.selected {
font-weight: normal;
color: #222222;
}
// 无边框select
.noborder.el-select .el-input.is-focus .el-input__inner,
.noborder.el-select .el-input .el-input__inner {
border:none;
}
// 无边框 input
.noborder.el-input .el-input__inner {
border:none;
}
// 弹出层遮罩 -el
@headerTitleHeight: 54px;
@tabHeight: 40px;
.hide-modal {
// 右侧滑动编辑区，遮罩层不可见
.v-modal {
top: 50px;
opacity: 0;
}
.el-drawer__wrapper {
top: 50px;
}
.el-drawer__body {
height: calc( 100% - @headerTitleHeight );
}
.drawer-right-inner .drawer-right-inner-form {
height: 100%;
}
.el-tabs__header {
margin-bottom: 0;
}
.el-tabs {
height: calc( 100% - @tabHeight );
}
}
.v-modal {
// opacity: 0;
}
// 重置颜色选择器弹窗
.el-color-dropdown {
.el-input {
height: 30px;
line-height: 30px;
}
.el-input .el-input__inner {
background-color: #fff;
border: 1px solid #dcdfe6;
color: #606266;
}
.el-input__inner:focus {
outline: none;
border-color: #409eff;
}
}
// 非hex时的宽度，取色器输入框
.el-color-dropdown__value.notHex {
width: 176px;
}
// ColorPicker 下拉框
.set-bgcolor-dropdown.el-color-dropdown {
transform: translateX(25%); //左侧弹窗-下拉框的位置
}
// 待输入建议，下拉选择框
.select-allow-create {
border: 1px solid #D1D1D1;
min-height: 48px;
box-sizing: border-box;
max-height: 84px;
padding: 1px 0;
.el-select__tags {
box-sizing: border-box;
overflow: auto;
max-height: 76px;
padding: 4px 0;
max-width: calc(100% - 30px)!important;
&::-webkit-scrollbar{width:0;height:0}
}
.el-input {
height: auto;
min-height: 44px;
.el-input__inner, .el-input__inner input {
// height: auto!important;
line-height: 44px;
}
}
&.el-select .el-tag {
border-radius: 4px;
background: #E74362;
height: 26px;
line-height: 24px;
font-size: 12px;
margin-bottom: 4px;
margin-top: 4px;
.el-select__tags-text {
color: #FFFFFF;
}
.el-tag__close {
color: #E74362;
background: #FFFFFF;
}
}
}
.clear-tags {
position: absolute;
right: 10px;
top: 50%;
z-index: 1;
transform: translate(0,-50%);
border-radius: 50%;
width: 14px;
height: 14px;
color: #D4D4D4;
line-height: 14px;
text-align: center;
font-size: 18px;
}
.aloneBlock {
box-sizing: border-box;
// border: 1px solid transparent;
transition: min-height 0.5s; //index-头部最小高度
// &&:not(.highlight-block):not(.not-highlight):hover {
// // border: 1px solid #5ED8B8;
// &::before { //导致页面其他内容层级低时，加个prel类名
// box-sizing: border-box;
// content: " ";
// width: 100%;
// height: calc(100% + 2px);
// position: absolute;
// top: 0;
// left: 0;
// border: 1px solid #5ED8B8;
// transform-origin: 0 0; /*默认以中心为原点，这里设置左上角为原点*/
// z-index: 0;
// }
// .add-component-btn {
// margin-left: 1px;
// width: calc(100% - 2px);
// }
// .theme-preview-inner {
// margin-left: 1px;
// top: 1px;
// width: calc(100% - 2px);
// height: 56px;
// }
// }
// &.highlight-block {
// // border: 1px solid #5ED8B8;
// &::before { //导致页面其他内容层级低时，加个prel类名
// box-sizing: border-box;
// content: " ";
// width: 100%;
// height: calc(100% + 2px);
// position: absolute;
// top: 0;
// left: 0;
// border: 1px solid #5ED8B8;
// transform-origin: 0 0; /*默认以中心为原点，这里设置左上角为原点*/
// z-index: 0;
// }
// .theme-preview-inner {
// margin-left: 1px;
// top: 1px;
// width: calc(100% - 2px);
// height: 56px;
// }
// }
}
.borderOne(@width:1px,@height:100%,@top:0,@left:0,@right:'none',@bottom:'none') {
//left
position: absolute;
top: @top;
bottom: @bottom;
left: @left;
right: @right;
width: @width;
height: @height;
background-color: #5ED8B8;
}
.aloneBlock {
// 鼠标移入
// 编辑高亮
&&:not(.highlight-block):not(.not-highlight):hover,
&.highlight-block {
> .borderOnlySide {
//左侧边框
&.left {
.borderOne();
}
// 右侧边框
&.right {
.borderOne(@width:1px,@height:100%,@top:0,@left:'none',@right:0,@bottom:'none');
}
// 上边框
&.top {
.borderOne(@width:100%,@height:1px,@top:0,@left:0,@right:0,@bottom:'none');
}
// 下边框
&.bottom {
.borderOne(@width:100%,@height:1px,@top:'none',@left:0,@right:0,@bottom:0);
}
}
.add-component-btn {
margin-left: 1px;
width: calc(100% - 2px);
}
}
&.navigation-bar {
> .borderOnlySide {
z-index: 1;
}
}
}
.aloneCenter {
box-sizing: border-box;
margin-left: auto;
margin-right: auto;
width: 882px;
}
.marginCenter {
margin-left: auto;
margin-right: auto;
}
// 向上箭头
.popper-arrow {
position: absolute;
top: -12px;
left: 50%;
transform: translateX(-50%);
border-top-width: 0;
border-color: transparent;
border-bottom-color: #E4E4E4;
border-width: 12px;
border-style: solid;
width: 0;
height: 0;
filter: drop-shadow(0 2px 12px rgba(0,0,0,.05));
&::after {
position: absolute;
top: 1px;
transform: translateX(-50%);
display: block;
content: "";
border-width: 12px;
width: 0;
height: 0;
border-color: transparent;
border-bottom-color: #fff;
border-top-width: 0;
border-style: solid;
}
}
// 向下箭头
.down-arrow {
position: absolute;
bottom: 0px;
left: 50%;
transform: translateX(-50%) translateY(100%);
border-bottom-width: 0;
border-color: transparent;
border-top-color: #D4D4D4;
border-width: 6px;
border-style: solid;
width: 0;
height: 0;
&::after {
position: absolute;
bottom: 2px;
transform: translateX(-50%);
display: block;
content: "";
border-width: 6px;
width: 0;
height: 0;
border-color: transparent;
border-top-color: #EDEDED;
border-bottom-width: 0;
border-style: solid;
}
}
// 添加内容页、主题页
.pages-add {
display: flex;
align-items: center;
margin-bottom: 12px;
width: 100%;
.pages-add-item {
border: 1px solid #D4D4D4;
border-radius: 18px;
width: 106px;
height: 32px;
line-height: 32px;
text-align: center;
background-color: #FAFAFA;
cursor: pointer;
}
}
// 弹窗右侧
.drawer-right {
width: 28%!important;
max-width: 479px;
min-width: 300px;
.el-drawer__header {
margin: 0;
border-bottom: 1px solid #EDEDED;
padding: 14px;
line-height: 22px;
font-size: 16px;
color: #222222;
}
.el-drawer__body {
height: calc( 100% - @headerTitleHeight );
}
.drawer-right-inner .drawer-right-inner-form {
height: 100%;
}
.el-tabs__header {
margin-bottom: 0;
}
.el-tabs {
height: calc( 100% - @tabHeight );
}
}
// @media screen and (max-width: 1400px) {
// .drawer-right {
// width: 28%!important;
// }
// }
// 弹窗设置项
.modal-sets-item {
margin-top: 24px;
// &:first-child {
// margin-top: 24px;
// }
// &.truefalse-class {
// margin-bottom: 0;
// }
.title {
padding-bottom: 8px;
line-height: 20px;
font-size: 14px;
color: #262626;
}
}
// 公用页面头部
.modal-header {
box-sizing: border-box;
border-bottom: 1px solid #F0F0F0;
}
// 课程左侧页面、主题tabs
.page-tabs-left {
.el-tabs__header {
height: 72px;
border-bottom: 0;
margin-bottom: 0;
background-color: #f0f0f0;
}
.el-tabs__nav-wrap,
.el-tabs__nav-scroll,
.el-tabs__nav,
.el-tabs__item {
height: 100%;
border: none;
}
.el-tabs__item {
padding: 15px 0 8px;
&.is-active {
background-color: #fff;
}
}
.el-tabs--card > .el-tabs__header .el-tabs__item,
.el-tabs--card > .el-tabs__header .el-tabs__nav {
border: none;
}
}
// tabs公用
.el-tabs__item:focus.is-active.is-focus:not(:active) {
// 键盘方向键 选中tab时,
box-shadow: none;
border-radius: 4px;
}
.el-tabs__nav-wrap {
box-sizing: border-box;
padding: 0 16px;
&::after {
display: none;
}
}
.el-tabs__nav {
border-radius: 4px;
background-color: #EDEDED;
}
.el-tabs__active-bar {
z-index: 0;
bottom: 4px;
height: 32px;
box-sizing: border-box;
padding-left: 4px;
padding-right: 10px;
background-color: transparent;
&::after {
display: block;
content: "";
position: absolute;
box-shadow: 0 0 6px 0 rgba(0,0,0,0.12);
border-radius: 4px;
width: calc(100% - 8px);
height: 100%;
background-color:#FFFFFF;
}
}
.el-tabs--top.el-tabs--card > .el-tabs__header .el-tabs__item:last-child {
padding-right: 0;
padding-left: 0;
}
.el-tabs__content,
.el-tab-pane {
height: 100%;
}
.el-tabs__item:hover,
.el-tabs__item.is-active {color: #333;}
.el-tabs__item {padding: 0;}
// el-upload
.el-upload:focus {
border-color: transparent;
color: #333;
}
:focus-visible {
outline: none;
}
// 图片位置
.set-bgimg-select-container {
margin-right: 8px;
width: calc(33.3% - 5.4px);
&:last-child {
margin-right: 0;
}
&.right {
width: calc(31% - 5.4px);
// .el-input__inner {
// padding-left: 16px;
// width: 130px!important;
// }
&:first-child {
flex: 1;
// .el-input__inner {
// width: 149px!important;
// }
}
}
&.left {
width: calc(31% - 5.4px);
// .el-input__inner {
// width: 84px!important;
// }
&:first-child {
flex: 1;
// .el-input__inner {
// width: 116px!important;
// }
}
}
}
.set-bgimg-select {
margin-right: 16px;
background: #FFFFFF;
border: 1px solid #D9D9D9;
border-radius: 4px;
width: 100%;
height: 36px;
line-height: 36px;
&:last-child {
margin-right: 0;
}
.el-input{
height: 36px;
line-height: 36px;
}
.el-input__inner {
padding-left: 12px;
// text-align: center;
}
&:first-child {
.el-input__inner {
// width: 100px;
}
}
.el-input__suffix-inner {
.el-select__caret {
line-height: 36px;
}
}
// 箭头
.el-select__caret {
&::before {
font-size: 16px;
color: #8C8C8C;
}
}
}
// 课程列表弹窗
.course-dialog {
top: 50%;
transform: translateY(-50%);
margin-top: 0!important;
.el-dialog__header {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0;
height: 49px;
}
&.not-full {
.el-dialog__header::after {
position: absolute;
bottom: 0;
display: block;
content: "";
width: calc(100% - 32px);
left: 16px;
height: 1px;
background-color: #EDEDED;
}
}
&.full {
.el-dialog__header {
border-bottom: 1px solid #D4D4D4;
}
}
.el-dialog__title {
padding-left: 16px;
font-size: 16px;
color: #222;
}
.el-dialog__headerbtn {
position: static;
margin-right: 10px;
padding: 8px;
line-height: 1;
.el-dialog__close {
font-family: "icomoon" !important;
font-size: 12px !important;
color: #999999;
}
.el-dialog__close::before {
content: "\e91d";
}
}
.el-dialog__body {
padding: 16px 24px 24px;
}
.el-dialog__footer {
padding: 0 24px 24px;
text-align:center;
}
.el-form-item {
margin-bottom: 0;
}
.media-edit-input.el-input {
box-sizing: border-box;
border-radius: 4px;
border: 1px solid #D4D4D4;
height: 48px;
line-height: 48px;
}
.theme-edit-input.el-input {
box-sizing: border-box;
border-radius: 4px;
border: 1px solid #D1D1D1;
height: 36px;
line-height: 36px;
}
button.course-save,
button.course-close,
button.course-copy,
button.media-upload {
border-radius: 16px;
border: none;
width: 82px;
height: 32px;
font-size: 12px;
color: #FFFFFF;
}
button.course-save {
background: #E74362;
}
button.course-copy {
margin-left: 16px;
width: 124px;
background: #4FB398;
}
button.course-close {
margin-left: 16px;
background: #D4D4D4;
}
button.media-upload {
width: 92px;
background: #E74362;
}
.el-dialog__headerbtn:focus .el-dialog__close, .el-dialog__headerbtn:hover .el-dialog__close {
color: #999999;
}
}
.tips-dialog {
.el-dialog__body {
padding: 0;
}
}
// 预览错误弹窗
.preview-error-dialog {
.el-dialog__header {
height: 54px;
}
.el-dialog__body {
padding: 24px 16px 16px;
}
}
// 预览加载弹窗
.preview-loading-dialog {
.el-dialog__header {display: none;}
.el-dialog__body {padding: 0;width: 100%;height: 100%;}
}
// 报错高亮设置
.course-article.is-error,
.course-block.is-error {
// border: 3px dashed red !important;
}
// 消息详情弹窗
.msg-dialog {
.el-dialog__header {
height: 68px;
}
.el-dialog__title {
text-indent: 8px;
font-size: 14px;
}
.el-dialog__headerbtn {
padding: 16px 8px 16px 26px;
}
.el-dialog__body {
padding: 4px;
}
}
// 全局设置弹窗
.global-dialog {
.el-dialog__header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0;
height: 49px;
border-bottom: 1px solid #D4D4D4;
}
.el-dialog__headerbtn {
position: static;
margin-right: 10px;
padding: 8px;
line-height: 1;
.el-dialog__close {
font-family: "icomoon" !important;
font-size: 12px !important;
color: #999999;
}
.el-dialog__close::before {
content: "\e91d";
}
}
.el-dialog__title {
padding-left: 16px;
font-size: 16px;
color: #222222;
}
.el-dialog__body {
padding: 0;
// height: 472px;
height: 525px;
}
.el-dialog__footer {
padding: 0 24px 24px;
text-align:center;
}
}
// 资源弹窗
.resource-dialog {
.el-dialog__body {
padding: 18px 16px 24px;
}
}
// 热点图片弹窗
.location-dialog {
.el-dialog__header {
display: none;
}
.el-dialog__body {
display: flex;
padding: 0;
justify-content: center;
width: 100%;
height: 100%;
}
}
.hotgraphic-dialog {
margin-top: -20px!important;
top: 50%;
transform: translateY(-50%);
.el-dialog__header {
display: none;
}
.el-dialog__body {
padding: 0;
}
}
//确保类名一层，自定义样式注入时，优先级高于当前
.hotgraphic-popup-outer {
background-color: var(--notify);
}
// 对错标记
.icon-radio_right_answer {
.path1::before {
color: var(--validation-success-inverted);
}
.path2::before {
color: var(--validation-success);
}
}
.icon-radio_error_answer {
.path1::before {
color: var(--validation-error-inverted);
}
.path2::before {
color: var(--validation-error);
}
}
.icon_status_inline {
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.12);
&.isright {
background-color: var(--validation-success);
.icon-right_answer::before {
color: var(--validation-success-inverted);
}
}
&.iserror {
background-color: var(--validation-error);
.icon-error_answer::before {
color: var(--validation-error-inverted);
}
}
}
.icon_status {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.12);
&.isright {
background-color: var(--validation-success);
.icon-right_answer::before {
color: var(--validation-success-inverted);
}
}
&.iserror {
background-color: var(--validation-error);
.icon-error_answer::before {
color: var(--validation-error-inverted);
}
}
}
// 反馈弹窗
.feedback-popup-inner {
background-color: var(--notify, #36cde8);
color: var(--notify-inverted, #fff);
transition: margin-top .2s,top .2s;
visibility: visible;
height: auto;
margin-top: -108.094px;
opacity: 1;
position: fixed;
top: 50%;
width: 100%;
z-index: 100;
.notify__popup-inner {
position: relative;
padding: 4rem 0.5rem;
margin: 0 auto;
max-width: 56.25rem;
}
.a11y-focusguard {
position: fixed !important;
left: 0 !important;
bottom: 0 !important;
width: auto !important;
height: auto !important;
overflow: auto !important;
color: rgba(0,0,0,0) !important;
background: rgba(0,0,0,0) !important;
font-size: 1px !important;
padding: 0 !important;
margin: 0 !important;
line-height: normal !important;
z-index: 1;
}
.notify__close-btn {
position: absolute;
top: 0;
right: 0;
margin: 0.5rem;
padding: 0.5rem;
background-color: var(--notify-icon, #36cde8);
color: var(--notify-icon-inverted, #fff);
border-radius: 50%;
border: none;
cursor: pointer;
.el-icon-close {
color: var(--notify-icon-inverted, #fff);
}
&:hover {
background-color: var(--notify-icon-hover, #18b7d3);
transition: background-color .2s ease-in,color .2s ease-in;
.el-icon-close {
color: var(--notify-icon-inverted-hover, #fff);
}
}
}
.notify__title {
margin-bottom: 1rem;
font-family: '';
font-size: 12px;
font-weight: 400;
line-height: 1.2;
letter-spacing: normal;
}
p {
display: block;
margin-block-start: 1em;
margin-block-end: 1em;
margin-inline-start: 0px;
margin-inline-end: 0px;
}
a {
color: var(--notify-link);
&:hover {
color: var(--notify-link-hover);
}
}
}
// 开关
@switchHei: 30px;
.el-switch {
height: @switchHei;
line-height: @switchHei;
.el-switch__core {
border-radius: 15px;
height: @switchHei;
&::after {
top: 50%;
left: 2px;
transform: translateY(-50%);
width: 24px;
height: 24px;
}
}
}
.el-switch.is-checked .el-switch__core {
&::before {
position: absolute;
left: 8px;
top: calc(50% + 1px);
transform: translate(0, calc(-50% - 1px));
// content: "开";
content: "\5f00\000d\000a"; //编码问题-中文转unicode去掉 编码后的u
display: block;
width: 10px;
font-size: 12px;
color: #FFFFFF;
// &:lang(zh-CN) {
// content: "\5f00\000d\000a";
// }
}
&::after {
margin-left: -26px; //当前宽度+2
}
}
.input36 {
&.el-input{
height: 36px;
line-height: 36px;
}
.el-input__inner {
padding: 0 8px;
}
}
// 树结构标题
.custom-tree-label-html {
& > p {
overflow: hidden;text-overflow: ellipsis;white-space: nowrap;
}
}
// 添加资源弹窗
.resource-dialog {
}
// 全局弹窗设置项
.global-sets-item {
margin-bottom: 20px;
&:first-child {
margin-top: 20px;
}
&.truefalse-class {
margin-bottom: 0;
}
&.condition-class {
padding-left: 30px;
.title {
font-size: 14px;
color: #222222;
}
}
&.languagePicker-class {
box-sizing: border-box;
padding-top: 20px;
margin-top: 0;
margin-bottom: 0;
}
.switch-class {
padding-left: 16px;
}
.title {
padding-bottom: 8px;
font-size: 14px;
color: #222222;
&.group_title {
padding-bottom: 17px;
}
}
}
.el-checkbox__inner { //覆盖到其他样式了
// background-color: #ffffff!important;
// border-color: #CCCCCC!important;
}
.modal-sets-inlineinput.el-input {
box-sizing: content-box;
border-radius: 4px;
border: 1px solid #D9D9D9;
height: 34px;
line-height: 34px;
}
// 确认按钮+取消按钮
button.sureBtn,
button.cancelBtn,
button.A1 {
border-radius: 16px;
border: none;
width: 82px;
height: 32px;
font-size: 14px;
color: #FFFFFF;
}
button.sureBtn {
background: #E74362;
}
button.cancelBtn {
margin-left: 16px;
background: #CCCCCC;
}
button.A1 {
background-color: #A1A1A1;
}
// 背景色 - 取色器
.set-bgcolor-picker-wrapper {
// width: 135px;
width: 100%;
height: 36px;
display: inline-block;
&.width144 {
width: 144px;
.picker-colorvalue {
width: 60px;
}
}
&.width_50 {
width: 50%;
}
.picker-colorvalue {
position: absolute;
left: 40px;
font-size: 14px;
color: #222;
pointer-events: none; //允许点击穿透
overflow: hidden;
// width: 93px;
width: calc(100% - 64px);
height: 35px;
line-height: 35px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.el-color-picker__empty {
color: transparent!important;
box-sizing: border-box;
border-radius: 2px;
width: 100%;
height: 100%;
&::after {
position: absolute;
left: 0;
top: 0;
content: "";
display: block;
width: 14px;
height: 14px;
background-size: 100%;
background-position: center;
background-repeat: no-repeat;
background-image: url(~@/assets/color_null@1x.png);
}
}
.el-color-picker__icon {
display: inline-block!important;
}
}
.set-bgcolor-picker {
box-sizing: border-box;
border-radius: 4px;
border: 1px solid #D4D4D4;
padding: 0 16px;
width: 100%;
height: 36px;
background: #FFFFFF;
&.notValue {
.el-color-picker__color-inner {
border: 1px solid #eee;
}
}
.el-color-picker__trigger {
display: flex;
align-items: center;
justify-content: space-between;
border-radius: 0;
border: none;
padding: 0;
width:100%;
// height: 100%;
height: 35px;
overflow: hidden;
.el-color-picker__color {
overflow: hidden;
border-radius: 2px;
border: 1px solid #D4D4D4;
width: 16px;
height: 16px;
}
.el-color-picker__icon {
width: 16px;
right: -10px;
left: inherit;
font-size: 16px;
&::before {
color: #979797;
}
}
}
}
// 刷新预览按钮
.previewRefresh_btn {
border-radius: 24px;
border: none;
width: 122px;
height: 40px;
line-height: 40px;
font-size: 12px;
color: #FFFFFF;
background: #51CFAE;
cursor: pointer;
}
// 弹窗表单项
.dialog-form-item {
margin-bottom: 24px;
&:last-child {
margin-bottom: 0px;
}
}
// 登录输入框
.login-input-wrapper.el-input{
height: 48px;
line-height: 48px;
border-radius: 4px;
&:hover {
.el-input__inner {
// border-color: #E74362;
border-width: 1px;
}
}
.el-input__inner {
border: 1px solid #D4D4D4;
&:focus-within { //输入中
border-color: #E74362;
border-width: 1px;
}
}
input.el-input__inner {
background-color: #FFFFFF!important;
}
.el-input__validateIcon {
display: none;
}
}
.el-form-item.is-error .login-input-wrapper .el-input__inner,
.el-form-item.is-error .login-input-wrapper .el-input__inner:focus {
border-color: #E74362;
border-width: 2px;
}
// 登录输入错误提示
.input-error-msg {
display: flex;
align-items: center;
padding-left: 2px;
line-height: 30px;
}
// 无数据
.nodata {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.statu_img {
margin-top: -50px;
width: 91px;
height: 96px;
}
}
// 进度条定位
.progress-position {
display: inline-block;
// position: absolute;
// left: -16px;
// top: 50%;
// transform: translateX(-100%) translateY(-50%);
}
// 有进度条时的宽度
.richEditor-container.ck-has-progress {
margin-left: 16px;
width: calc(100% - 70px)!important;
}
.is_title.ck-has-progress {
position: relative;
z-index: 0; //z-index:1是会高于左侧弹窗
margin-left: calc(54px + 16px);
}
// 没有进度条的宽度
.ck-no-progress {
width: 100%;
}
// ck工具
.ck.ck-button, a.ck.ck-button {
// background-color: #08DD6D!important;
min-width: 2.0em!important;
min-height: 2.2em!important;
}
.ck.ck-icon {
width: 1.6em!important;
height: 1.6em!important;
}
[dir=ltr] .ck.ck-dropdown .ck-dropdown__arrow {
width: 1.1em!important;
// height: 1.1em!important;
}
// 首页-左上角用户下拉弹窗
.home-user-dropdown {
width: 234px;
.dropmenu_user {
position: relative;
.user-icon {
position: absolute;
right: 10px;
top: 50%;
transform: translateY(-50%);
}
}
}
// 个人资料
.el-date-table td.today span {
color: #E74362;
}
.el-date-table td.current:not(.disabled) span {
background-color: #E74362;
}
.el-date-picker__header-label {
color: #222222;
}
.el-date-table td.available:hover {
color: #E74362;
}
.el-picker-panel__icon-btn:hover {
color: #E74362;
}
.el-date-picker__header-label.active,
.el-date-picker__header-label:hover {
color: #E74362;
}
.el-year-table td.today .cell {
color: #E74362;
}
.el-year-table td .cell:hover,
.el-year-table td.current:not(.disabled) .cell {
color: #E74362;
}
.el-month-table td .cell:hover {
color: #E74362;
}
// 控制字体选择下拉选择
.ck-font-size-dropdown {
.ck-dropdown__panel {
overflow-y: auto!important;
height: 200px!important;
}
}
// 显示密码复选框
.show-pwd-checkbox {
&:hover {
.el-checkbox__inner {
border-color: #E74362!important;
}
}
}
// 全局侧边弹窗弹出
.el-drawer-fade-enter-active {
-webkit-animation-duration: 0.2s;
animation-duration: 0.2s; // 动画执行时间
}
// 自定义 左边侧边栏弹窗
.right-sub-modal {
position: absolute;
z-index: 0;
left: 0;
top: 0;
transform: translateX(0);
transition: all 0.2s; //收起
bottom: 0;
width: 28vw;
max-width: 336px;
min-width: 300px; //富文本编辑框颜色弹窗刚好不会溢出这个宽度
// height: 100%;
opacity: 0;
background: #FAFAFA;
.el-tabs__content {
height: calc(100% - 40px);
}
&.visible {
opacity: 1;
box-shadow: -10px 2px 20px 0 rgba(0, 0, 0, 0.15);
border-right: 1px solid #eee;
transform: translateX(-100%);
transition-duration: 0.3s; //展开
& + .right-sub-modal-mask {
display: block;
}
}
.right-sub-modal-header {
line-height: 22px;
border-bottom: 1px solid #EDEDED;
}
}
// 自定义 右侧弹窗 遮罩层
.right-sub-modal-mask {
display: none;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
width: 100%;
height: 100%;
}
.el-drawer__open .el-drawer.rtl {
animation-duration: 0.15s;
animation-delay: 0ms;
}
.el-button {
word-break: break-all;
}
.hide-icon {
padding: 0!important;
visibility: hidden;
width: 0;
overflow: hidden;
}
@media screen and (max-width: 1200px){
.custom-tree-dropdown {
.el-dropdown-link i.icon-gray-more {
font-size: 16px;
}
}
.icon-close-popup {
font-size: 10px!important;
}
}
// 页面重命名弹窗
.rename-dialog {
.ck.ck-editor__top {
display: none;
}
.richEditor-container:not(.inline) .ck-editor__editable {
height: 40px!important;
min-height: 40px!important;
line-height: 1;
border-radius: 4px!important;
}
.ck.ck-editor__editable {
p,span {
font-size: 14px!important;
color: #222!important;
}
}
}
// 预览图片资源弹窗
.preview-resource-dialog {
margin-top: 5vh!important;
width: 90%;
}
// 类似title效果tips
.data-tip {
position: relative;
overflow: visible;
&:hover::after {
content: attr(data-title);
display: inline-block;
padding: 6px 8px;
border: 1px solid #ddd;
border-radius: 5px;
background-color: rgba(255, 255, 255, 0.8);
position: absolute;
top: 40px;
left: 15px;
z-index: 1;
white-space: pre-wrap;
}
}
// 名称有省略号的时候，鼠标移入，需要显示完整名称tips；
// 名称没有省略号的时候，不用显示完整名称tips
.tips-wrap {
position: relative;
line-height: 2;
height: 2em;
font-size: 14px; //跟以下统一 ， em生效基准
overflow: hidden;
.tips-title {
display: block;
position: absolute;
background: inherit;
text-align: justify;
// height: 2em;
// overflow: hidden;
opacity: 0;
bottom: -2em;
word-break: break-all;
white-space: pre-wrap;
}
.tips-txt {
position: relative;
top: 0;
display: block;
max-height: 2em;
word-break: break-all;
}
}
.aria-label {
position: absolute !important;
left: 0 !important;
width: auto !important;
height: auto !important;
overflow: auto !important;
color: rgba(0,0,0,0) !important;
background: rgba(0,0,0,0) !important;
font-size: 1px !important;
padding: 0 !important;
margin: 0 !important;
line-height: normal !important;
z-index: 1;
}
// 图标
.course-rename-top {
&:not(:hover) {
.path2::before {
color: #E74362;
}
}
}
.upgrade-dialog{
.el-checkbox__inner{
width: 12px;
height: 12px;
border-radius: 3px;
margin-bottom: 1px;
&::after{
height: 6px;
left: 3px;
width: 3px;
}
&:hover{
border: 1px solid #E74362;
}
}
.el-checkbox__input.is-checked .el-checkbox__inner{
background: #E74362;
border: 1px solid #E74362;
}
.el-checkbox__input.is-focus .el-checkbox__inner{
border: 1px solid #E74362;
}
}
.list-container.grid_type .el-scrollbar__bar.is-horizontal {
display: none;
}
// electron: 在账户安全页面，打开弹窗会抖动-修复
.el-popup-parent--hidden {
padding-right: 0 !important; //electron端重置
}
@media screen and (max-width: 1600px) {
.template-center--content {
grid-template-columns: repeat(auto-fill,minmax(200px,1fr));
}
}
// 关闭按钮颜色修改
.el-dialog__headerbtn .el-dialog__close {
color: #8C8C8C;
&:hover {
color: #595959;
}
}
// 自定义end
.breakword { word-break: break-word; }
// 图标
.icon_color {
&_fff::before {
color: #fff;
}
&_222::before {
color: #222;
}
&_ccc::before {
color: #CCC;
}
&_E74362::before {
color: #E74362;
}
&_A1A1A1::before {
color: #A1A1A1;
}
&_08DD6D::before {
color: #08DD6D;
}
&_0AC061::before {
color: #0AC061;
}
&_51CFAE::before {
color: #51CFAE;
}
&_BFBFBF::before {
color: #BFBFBF;
}
&_59::before {
color: #595959;
}
}
.icon_hover {
&_E74362:hover::before {
color: #E74362;
}
}
.flex {
display: flex;
&1{flex: 1;}
&2{flex: 2;}
&3{flex: 3;}
&auto{flex: auto;}
&column{flex-direction: column;}
&shrink{flex-shrink: 0;}
&wrap{flex-wrap: wrap;}
&_center{justify-content: center;}
&_end{justify-content: flex-end;}
&_jcbetween{justify-content: space-between;}
&_jright{justify-content: flex-end;}
&_jleft{justify-content: flex-start;}
&_around{justify-content: space-around;}
&_evenly{justify-content: space-evenly;}
&_acenter{align-items: center;}
&_atop{align-items: flex-start;}
&_contentstart{align-content:flex-start}
}
.botline {
&_eee1 {
position: relative;
width: inherit;
height: 100%;
&:after { display: block; content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 80%; height: 1px; background-color: #eee; }
}
}
.margin {
&_lrauto {margin-left: auto;margin-right: auto;}
&_15_0 {margin: 15px 0;}
&_top3 {margin-top: 3px;}
&_top4 {margin-top: 4px;}
&_top5 {margin-top: 5px;}
&_top6 {margin-top: 6px;}
&_top8 {margin-top: 8px;}
&_top10 {margin-top: 10px;}
&_top10 {margin-top: 10px;}
&_top13 {margin-top: 13px;}
&_top16 {margin-top: 16px;}
&_top18 {margin-top: 18px;}
&_top20 {margin-top: 20px;}
&_top24 {margin-top: 24px;}
&_top25 {margin-top: 25px;}
&_top26 {margin-top: 26px;}
&_top32 {margin-top: 32px;}
&_top36 {margin-top: 36px;}
&_top40 {margin-top: 40px;}
&_top50 {margin-top: 50px;}
&_bot3 {margin-bottom: 3px;}
&_bot7 {margin-bottom: 7px;}
&_bot8 {margin-bottom: 8px;}
&_bot9 {margin-bottom: 9px;}
&_bot10 {margin-bottom: 10px;}
&_bot12 {margin-bottom: 12px;}
&_bot16 {margin-bottom: 16px;}
&_bot18 {margin-bottom: 18px;}
&_bot20 {margin-bottom: 20px;}
&_bot24 {margin-bottom: 24px;}
&_bot32 {margin-bottom: 32px;}
&_left2 {margin-left: 2px;}
&_left4 {margin-left: 4px;}
&_left5 {margin-left: 5px;}
&_left6 {margin-left: 6px;}
&_left8 {margin-left: 8px;}
&_left10 {margin-left: 10px;}
&_left13 {margin-left: 13px;}
&_left14 {margin-left: 14px;}
&_left16 {margin-left: 16px;}
&_left20 {margin-left: 20px;}
&_left24 {margin-left: 24px;}
&_left32 {margin-left: 32px;}
&_left40 {margin-left: 40px;}
&_right4 {margin-right: 4px;}
&_right10 {margin-right: 10px;}
&_right13 {margin-right: 13px;}
&_right16 {margin-right: 16px;}
&_right24 {margin-right: 24px;}
&_right32 {margin-right: 32px;}
}
.border {
&_boteee1 {border-bottom: 1px solid #eee;}
&_bote4 {border-bottom: 1px solid #E4E4E4;}
&_D1 {border: 1px solid #D1D1D1;}
&_topED {border-top: 8px solid #EDEDED;}
&_topED1 {border-top: 1px solid #EDEDED;}
&_bottomED1 {border-bottom: 1px solid #EDEDED;}
&_rightF7E7EA {border-right: 1px solid #f7e7ea;}
&_leftF7E7EA {border-left: 1px solid #f7e7ea;}
&_bottomF0 {border-bottom: 1px solid #f0f0f0;}
}
.padding {
&_5 {padding: 5px;}
&_10 {padding: 10px;}
&_15 {padding: 15px;}
&_16 {padding: 16px;}
&_24 {padding: 24px;}
&_0_4 {padding: 0 4px;}
&_0_10 {padding: 0 10px;}
&_0_13 {padding: 0 13px;}
&_0_15 {padding: 0 15px;}
&_0_16 {padding: 0 16px;}
&_6_16 {padding: 6px 16px;}
&_0_20 {padding: 0 20px;}
&_0_24 {padding: 0 24px;}
&_0_32 {padding: 0 32px;}
&_16_32 {padding: 16px 32px;}
&_10_12 {padding: 10px 12px;}
&_10_16 {padding: 10px 16px;}
&_lr16 {padding-left: 16px;padding-right: 16px;}
&_left4 {padding-left: 4px;}
&_left5 {padding-left: 5px;}
&_left6 {padding-left: 6px;}
&_left8 {padding-left: 8px;}
&_left10 {padding-left: 10px;}
&_left15 {padding-left: 15px;}
&_left16 {padding-left: 16px;}
&_left20 {padding-left: 20px;}
&_left24 {padding-left: 24px;}
&_right4 {padding-right: 4px;}
&_right8 {padding-right: 8px;}
&_right15 {padding-right: 15px;}
&_right16 {padding-right: 16px;}
&_right24 {padding-right: 24px;}
&_top5 {padding-top: 5px;}
&_top6 {padding-top: 6px;}
&_top8 {padding-top: 8px;}
&_top10 {padding-top: 10px;}
&_top16 {padding-top: 16px;}
&_top20 {padding-top: 20px;}
&_top24 {padding-top: 24px;}
&_top25 {padding-top: 25px;}
&_top38 {padding-top: 38px;}
&_top50 {padding-top: 50px;}
&_bot6 {padding-bottom: 6px;}
&_bot8 {padding-bottom: 8px;}
&_bot16 {padding-bottom: 16px;}
&_bot17 {padding-bottom: 17px;}
&_bot24 {padding-bottom: 24px;}
&_bot42 {padding-bottom: 42px;}
}
.width {
&_50p {width: 50%;}
&_100p {width: 100%;}
&_830px { width: 830px; }
}
.height {
&_100p {height: 100%;}
}
.fontsize {
&_9{font-size: 9px;}
&_10{font-size: 10px;}
&_11{font-size: 11px;}
&_12{font-size: 12px;}
&_14{font-size: 14px;}
&_15{font-size: 15px;}
&_16{font-size: 16px;}
&_18{font-size: 18px;}
&_19{font-size: 19px;}
&_20{font-size: 20px;}
&_21{font-size: 21px;}
&_24{font-size: 24px;}
&_26{font-size: 26px;}
&_32{font-size: 32px;}
&_40{font-size: 40px;}
&_48{font-size: 48px;}
}
.lineheight {
&_1d2 {line-height: 1.2;}
&_1d5 {line-height: 1.5;}
&_17 {line-height: 17px;}
&_18 {line-height: 18px;}
&_20 {line-height: 20px;}
&_22 {line-height: 22px;}
&_24 {line-height: 24px;}
&_25 {line-height: 25px;}
&_28 {line-height: 28px;}
&_32 {line-height: 32px;}
&_36 {line-height: 36px;}
}
.color {
&_red {color: red;}
&_000 {color: #000;}
&_222 {color: #222;}
&_333 {color: #333;}
&_333d5 {color: rgba(51, 51, 51, 0.5);}
&_666 {color: #666;}
&_999 {color: #999;}
&_ccc {color: #ccc;}
&_fff {color: #fff;}
&_A4AFB7 {color: #A4AFB7;}
&_4A90E2 {color: #4A90E2;}
&_D0021B {color: #D0021B;}
&_E74362 {color: #E74362}
&_A1A1A1 {color: #A1A1A1;}
&_4FB398 {color: #4FB398;}
&_6E6E6E {color: #6E6E6E;}
&_1373E6 {color: #1373E6;}
&_08DD6D {color: #08DD6D;}
&_A8A8A8 {color: #A8A8A8;}
&_51CFAE {color: #51CFAE;}
&_FF4D4F {color: #FF4D4F;}
&_2C {color: #2C2C2C;}
&_26 {color: #262626;}
&_59 {color: #595959;}
&_8C {color: #8C8C8C;}
&_FE840F {color: #FE840F;}
&_BFBFBF {color: #BFBFBF;}
&_FF7B00 {color: #FF7B00;}
&_FF0031 {color: #FF0031;}
}
.hoverColor {
&_B5102F:hover {color: #B5102F;}
&_E74362:hover {color: #E74362;}
&_0C4B97:hover {color: #0C4B97;}
&_126AD4:hover {color: #1061C1;}
&_D0435E:hover {color: #D0435E;}
&_969696:hover {color: #969696;}
&_8C8C8C:hover {color: #8C8C8C;}
&_CC3350:hover {color: #CC3350;}
}
.bgc {
&_transparent{background-color: transparent!important;}
&_fff {background-color: #fff;}
&_ccc {background-color: #ccc;}
&_eee {background-color: #eee;}
&_F4F4F4 {background-color: #F4F4F4;}
&_4FB398 {background-color: #4FB398;}
&_EDEDED {background-color: #EDEDED;}
&_F5F5F5 {background-color: #f5f5f5;}
}
.button_hover {
&_B5102F:hover {
border-color: #B5102F !important;
color: #B5102F !important;
}
}
.transform {
&_45{transform: rotate(-45deg);}
}
.fontweight {
&_500 {
font-weight: 500;
}
&_600 {
font-weight: 600;
}
}
.opacity {
&_d8 {
opacity: 0.8;
}
}
.confirmButtonClass{
background: #E74362;
border-color: #E74362;
&:focus{
background: #E74362;
border-color: #E74362;
}
&:hover{
background: #B5102F;
border-color: #B5102F;
}
}
.cancelButtonClass{
background: #ffffff;
border-color: #d9d9d9;
font-size: 14px;
color: #8C8C8C;
&:focus{
background: #ffffff;
border-color: #d9d9d9;
}
&:hover{
background: #f5f5f5;
color: #8C8C8C;
}
}
\ No newline at end of file
src/assets/css/component.less deleted 100644 → 0
浏览文件 @ 99044d15
.component-container {
box-sizing: border-box;
padding: 8px 16px 16px;
min-height: 24px;
}
// 标题左侧-进度条
.component-progress {
position: absolute;
left: 0;
z-index: 0;
padding-top: 2px;
line-height: 1.3;
display: inline-block;
vertical-align: middle;
.progress-text {
width: 0;
overflow: hidden;
visibility: hidden;
display: inline;
vertical-align: middle;
/deep/p {
width: 0;
overflow: hidden;
display: inline;
&:not(:first-child) {
display: none;
}
}
}
}
//由于内部弹出窗口
.drawer-right {
/deep/ &.el-drawer {
overflow: visible;
.el-drawer__body {
overflow: visible;
}
}
}
// 右侧弹窗
// 右侧弹窗头部高度
@drawHeaderHeight: 54px;
.drawer-right-inner {
width: 100%;
height: 100%;
background-color: #fff;
.header {
box-sizing: border-box;
height: @drawHeaderHeight;
}
.header-close-btn {
position: absolute;
top: 0;
right: 0;
padding: 19px 16px;
}
.drawer-right-inner-form {
box-sizing: border-box;
padding-top: 16px;
height: calc(100% - @drawHeaderHeight);
}
}
\ No newline at end of file
src/assets/css/mixin.less deleted 100644 → 0
浏览文件 @ 99044d15
@mixin clearfix {
&:after {
content: "";
display: table;
clear: both;
}
}
@mixin scrollBar {
&::-webkit-scrollbar-track-piece {
background: #d3dce6;
}
&::-webkit-scrollbar {
width: 6px;
}
&::-webkit-scrollbar-thumb {
background: #99a9bf;
border-radius: 20px;
}
}
@mixin relative {
position: relative;
width: 100%;
height: 100%;
}
src/assets/css/normalize.css deleted 100644 → 0
浏览文件 @ 99044d15
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
========================================================================== */
/**
* 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in iOS.
*/
html {
line-height: 1.15; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
}
/* Sections
========================================================================== */
/**
* Remove the margin in all browsers.
*/
body {
margin: 0;
}
/**
* Render the `main` element consistently in IE.
*/
main {
display: block;
}
/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/* Grouping content
========================================================================== */
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
box-sizing: content-box; /* 1 */
height: 0; /* 1 */
overflow: visible; /* 2 */
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
pre {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
/* Text-level semantics
========================================================================== */
/**
* Remove the gray background on active links in IE 10.
*/
a {
background-color: transparent;
}
/**
* 1. Remove the bottom border in Chrome 57-
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
border-bottom: none; /* 1 */
text-decoration: underline; /* 2 */
text-decoration: underline dotted; /* 2 */
}
/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
font-weight: bolder;
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
/**
* Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/* Embedded content
========================================================================== */
/**
* Remove the border on images inside links in IE 10.
*/
img {
border-style: none;
}
/* Forms
========================================================================== */
/**
* 1. Change the font styles in all browsers.
* 2. Remove the margin in Firefox and Safari.
*/
button,
input,
optgroup,
select,
textarea {
font-family: inherit; /* 1 */
font-size: 100%; /* 1 */
line-height: 1.15; /* 1 */
margin: 0; /* 2 */
}
/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input { /* 1 */
overflow: visible;
}
/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select { /* 1 */
text-transform: none;
}
/**
* Correct the inability to style clickable types in iOS and Safari.
*/
button,
[type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
}
/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
/**
* Correct the padding in Firefox.
*/
fieldset {
padding: 0.35em 0.75em 0.625em;
}
/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers.
*/
legend {
box-sizing: border-box; /* 1 */
color: inherit; /* 2 */
display: table; /* 1 */
max-width: 100%; /* 1 */
padding: 0; /* 3 */
white-space: normal; /* 1 */
}
/**
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
vertical-align: baseline;
}
/**
* Remove the default vertical scrollbar in IE 10+.
*/
textarea {
overflow: auto;
}
/**
* 1. Add the correct box sizing in IE 10.
* 2. Remove the padding in IE 10.
*/
[type="checkbox"],
[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type="search"] {
-webkit-appearance: textfield; /* 1 */
outline-offset: -2px; /* 2 */
}
/**
* Remove the inner padding in Chrome and Safari on macOS.
*/
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button; /* 1 */
font: inherit; /* 2 */
}
/* Interactive
========================================================================== */
/*
* Add the correct display in Edge, IE 10+, and Firefox.
*/
details {
display: block;
}
/*
* Add the correct display in all browsers.
*/
summary {
display: list-item;
}
/* Misc
========================================================================== */
/**
* Add the correct display in IE 10+.
*/
template {
display: none;
}
/**
* Add the correct display in IE 10.
*/
[hidden] {
display: none;
}
\ No newline at end of file
src/assets/css/root.less deleted 100644 → 0
浏览文件 @ 99044d15
@import 'coloursBase.less';
:root {
--quaternary-color: @blue;
}
/* 标题颜色 */
.title-color {
color: @heading-color;
}
.is_title {
// color: @heading-color;
// 设计稿#222
color: var(--heading-color, #262626);
}
// --------------------------------------------------
// 富文本编辑框-字体颜色
// 除了标题之外的文字颜色
.richEditor-container.inline:not(.is_title) .ck-editor__editable_inline {
p {
color: var(--font-color, #222);
}
}
// 行内输入框 - 说明
.richEditor-container.ckeditor_inline_instruction .ck-editor__editable_inline {
p {
color: var(--font-color, #8C8C8C);
}
}
// 行内输入框-链接
.richEditor-container.inline .ck-editor__editable_inline {
a {
cursor: pointer;
&.ck-link_selected {background-color: transparent!important;}
color: var(--link);
&:hover {
color: var(--link-hover);
}
}
}
// --------------------------------------------------
src/assets/css/sidebar.less deleted 100644 → 0
浏览文件 @ 99044d15
#app {
// 主体区域
.main-container {
min-height: 100%;
transition: margin-left .28s;
margin-left: 180px;
}
// 侧边栏
.sidebar-container {
.horizontal-collapse-transition {
transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out;
}
transition: width .28s;
width: 180px !important;
height: 100%;
position: fixed;
font-size: 0px;
top: 0;
bottom: 0;
left: 0;
z-index: 1001;
overflow: hidden;
a {
display: inline-block;
width: 100%;
}
.svg-icon {
margin-right: 16px;
}
.el-menu {
border: none;
width: 100% !important;
}
}
.hideSidebar {
.sidebar-container {
// width: 36px !important;
width: 0 !important;
}
.main-container {
// margin-left: 36px;
margin-left: 0;
}
.submenu-title-noDropdown {
padding-left: 10px !important;
position: relative;
.el-tooltip {
padding: 0 10px !important;
}
}
.el-submenu {
&>.el-submenu__title {
padding-left: 10px !important;
&>span {
height: 0;
width: 0;
overflow: hidden;
visibility: hidden;
display: inline-block;
}
.el-submenu__icon-arrow {
display: none;
}
}
}
}
.sidebar-container .nest-menu .el-submenu>.el-submenu__title,
.sidebar-container .el-submenu .el-menu-item {
min-width: 180px !important;
background-color: #1f2d3d !important;
&:hover {
background-color: #001528 !important;
}
}
.el-menu--collapse .el-menu .el-submenu {
min-width: 180px !important;
}
//适配移动端
// .mobile {
// .main-container {
// margin-left: 0px;
// }
// .sidebar-container {
// top: 50px;
// transition: transform .28s;
// width: 180px !important;
// }
// &.hideSidebar {
// .sidebar-container {
// transition-duration: 0.3s;
// transform: translate3d(-180px, 0, 0);
// }
// }
// }
.withoutAnimation {
.main-container,
.sidebar-container {
transition: none;
}
}
}
src/assets/css/transition.less deleted 100644 → 0
浏览文件 @ 99044d15
//globl transition css
/*fade*/
.fade-enter-active,
.fade-leave-active {
transition: opacity 0.28s;
}
.fade-enter,
.fade-leave-active {
opacity: 0;
}
/*fade*/
.breadcrumb-enter-active,
.breadcrumb-leave-active {
transition: all .5s;
}
.breadcrumb-enter,
.breadcrumb-leave-active {
opacity: 0;
transform: translateX(20px);
}
.breadcrumb-move {
transition: all .5s;
}
.breadcrumb-leave-active {
position: absolute;
}
src/main/events/app.js
浏览文件 @ bed466ee
import { app } from 'electron' import { app, screen } from 'electron'
class AppEvents { class AppEvents {
create (appManager) { create (appManager) {
...@@ -33,9 +33,14 @@ class AppEvents { ...@@ -33,9 +33,14 @@ class AppEvents {
Before electron app is ready, we should initial */ Before electron app is ready, we should initial */
app.on('ready', async () => { app.on('ready', async () => {
try { try {
console.log('getPrimaryDisplay')
console.log(screen.getPrimaryDisplay())
setTimeout(()=>{
appManager.initApp() appManager.initApp()
},100);
} catch (error) { } catch (error) {
console.log(error) console.log(990)
console.error(error)
} }
}) })
...@@ -61,15 +66,6 @@ class AppEvents { ...@@ -61,15 +66,6 @@ class AppEvents {
// noSound: true // noSound: true
// }) // })
}) })
// Quit when all windows are closed.
// app.on("window-all-closed", () => {
// this.windowManager.mainWindow.win = null
// // On macOS it is common for applications and their menu bar
// // to stay active until the user quits explicitly with Cmd + Q
// if (process.platform !== "darwin") {
// app.quit();
// }
// });
} }
} }
......
src/main/events/ipc.js
浏览文件 @ bed466ee
...@@ -62,7 +62,8 @@ class IpcEvents { ...@@ -62,7 +62,8 @@ class IpcEvents {
event.sender.send('context-menu-command', 'modeJianYue'); event.sender.send('context-menu-command', 'modeJianYue');
this.store.set("currentMode", "modeJianYue"); this.store.set("currentMode", "modeJianYue");
this.windowManager.mainWindow.win.setBounds({ this.windowManager.mainWindow.win.setBounds({
x: (displayWH.width - Number(process.env.VUE_APP_mainW))/2, // x: (displayWH.width - Number(process.env.VUE_APP_mainW))/2,
x: 0,
y: (displayWH.height - Number(process.env.VUE_APP_mainH)), y: (displayWH.height - Number(process.env.VUE_APP_mainH)),
width: Number(process.env.VUE_APP_mainW), width: Number(process.env.VUE_APP_mainW),
height: Number(process.env.VUE_APP_mainH) height: Number(process.env.VUE_APP_mainH)
...@@ -78,6 +79,7 @@ class IpcEvents { ...@@ -78,6 +79,7 @@ class IpcEvents {
this.store.set("currentMode", "modeJiJian"); this.store.set("currentMode", "modeJiJian");
this.windowManager.mainWindow.win.setBounds({ this.windowManager.mainWindow.win.setBounds({
// x: ( Number(displayWH.width) - 419)/2, // x: ( Number(displayWH.width) - 419)/2,
x:0,
// y: ( Number(displayWH.height) - 60), // y: ( Number(displayWH.height) - 60),
width: 419, width: 419,
height: 60 height: 60
......
src/main/index.js
浏览文件 @ bed466ee
...@@ -11,7 +11,7 @@ import { protocol } from 'electron' ...@@ -11,7 +11,7 @@ import { protocol } from 'electron'
//热加载 //热加载
try { try {
// require('electron-reloader')(module); require('electron-reloader')(module);
} catch {} } catch {}
// Scheme must be registered before the app is ready // Scheme must be registered before the app is ready
......
src/main/managers/window.js
浏览文件 @ bed466ee
import { app, screen } from 'electron'
import MainWindow from '../windows/mainWindow' import MainWindow from '../windows/mainWindow'
class WindowManager { class WindowManager {
...@@ -8,10 +9,11 @@ class WindowManager { ...@@ -8,10 +9,11 @@ class WindowManager {
/* Create all windows /* Create all windows
创建所有窗口 */ 创建所有窗口 */
createAllWindows () { createAllWindows () {
const displayDetail = screen.getPrimaryDisplay();
this.mainWindow.listen() this.mainWindow.listen()
this.mainWindow.createWindow({ this.mainWindow.createWindow({
isMainWin: true, isMainWin: true,
width:Number(process.env.VUE_APP_mainW), width:Number(displayDetail.size.width || process.env.VUE_APP_mainW),
height: Number(process.env.VUE_APP_mainH), height: Number(process.env.VUE_APP_mainH),
// minWidth:Number(process.env.VUE_APP_mainW), // minWidth:Number(process.env.VUE_APP_mainW),
// minHeight: Number(process.env.VUE_APP_mainH), // minHeight: Number(process.env.VUE_APP_mainH),
......
src/main/plugins/softList.js
浏览文件 @ bed466ee
...@@ -11,7 +11,7 @@ class SoftList { ...@@ -11,7 +11,7 @@ class SoftList {
/* 获取app列表 */ /* 获取app列表 */
getList () { getList () {
// console.log('获取app列表') // console.log('获取app列表')
this.mainWindow.win.webContents.send('getMsg', '获取app列表') this.mainWindow.win.webContents.send('getMsg', '获取app列表-mainprocess')
let appsList = this.store.get('apps'); let appsList = this.store.get('apps');
// if(appsList && appsList.length > 0) { // if(appsList && appsList.length > 0) {
// // 已有app列表 // // 已有app列表
...@@ -34,15 +34,57 @@ class SoftList { ...@@ -34,15 +34,57 @@ class SoftList {
} }
/* 查找linux icon */ /* 查找linux icon */
findIcon(iconName, pathBase) { ///usr/share/icons findIcon(iconName, pathBase, callback = ()=>{}) { ///usr/share/icons
try { try {
const stdout = execSync(`find ${pathBase} -name "${iconName}.*"`); exec(`find ${pathBase} -name "${iconName}.png" -o -name "${iconName}.svg"`, (error, stdout, stderr) =>{
if(error) {
console.error(`findIcon: ${error}`);
if(typeof callback === 'function') callback([]);
return;
}
const iconPaths = stdout.toString().split('\n').filter(path => path && path.trim() !== ''); const iconPaths = stdout.toString().split('\n').filter(path => path && path.trim() !== '');
return iconPaths; if(typeof callback === 'function') callback(iconPaths);
});
// const stdout = execSync(`find ${pathBase} -name "${iconName}.*"`);
// const iconPaths = stdout.toString().split('\n').filter(path => path && path.trim() !== '');
// return iconPaths;
} catch (error) { } catch (error) {
console.error(`命令执行失败: ${error}`); console.error(`命令执行失败: ${error}`);
return null; return null;
} }
}
/* 查找linux icon */
findIconPromise({iconName, pathBase, excludePath}, callback = ()=>{}) { ///usr/share/icons
return new Promise((resolve, reject) => {
try {
// find /home/zth -path "/home/zth/astetc" -prune -o -type f -print
let commondStr = "";
if(!excludePath) {
commondStr = `find ${pathBase} -name "${iconName}.png" -o -name "${iconName}.svg"`;
}else {
commondStr = `find ${pathBase} -path ${excludePath} -prune -name "${iconName}.png" -o -name "${iconName}.svg"`;
}
exec(commondStr, (error, stdout, stderr) =>{
if(error) {
console.error(`findIcon: ${error}`);
// if(typeof callback === 'function') callback([]);
resolve([]);
return;
}
const iconPaths = stdout.toString().split('\n').filter(path => path && path.trim() !== '');
// if(typeof callback === 'function') callback(iconPaths);
resolve(iconPaths);
});
// const stdout = execSync(`find ${pathBase} -name "${iconName}.*"`);
// const iconPaths = stdout.toString().split('\n').filter(path => path && path.trim() !== '');
// return iconPaths;
} catch (error) {
console.error(`命令执行失败: ${error}`);
// return null;
reject({error});
}
});
} }
/* 获取最大像素图片 */ /* 获取最大像素图片 */
getMaxPix({name, iconList, icon}) { getMaxPix({name, iconList, icon}) {
...@@ -126,16 +168,16 @@ class SoftList { ...@@ -126,16 +168,16 @@ class SoftList {
} }
// console.log('execCommand', execCommand) // console.log('execCommand', execCommand)
let iconList = []; let iconList = [];
// icon判断是否绝对路径 // // icon判断是否绝对路径
if( icon && !path.isAbsolute( icon ) ) { // if( icon && !path.isAbsolute( icon ) ) {
iconList = this.findIcon(icon,'/usr/share/icons'); // iconList = this.findIcon(icon,'/usr/share/icons');
if(iconList.length > 0) { // if(iconList.length > 0) {
icon = this.getMaxPix({name, iconList, icon}) // icon = this.getMaxPix({name, iconList, icon})
}else { // }else {
iconList = this.findIcon(icon,'/usr/share'); // iconList = this.findIcon(icon,'/usr/share');
icon = this.getMaxPix({name, iconList, icon}) // icon = this.getMaxPix({name, iconList, icon})
} // }
} // }
return { return {
type, type,
iconList: iconList || [], iconList: iconList || [],
...@@ -144,12 +186,41 @@ class SoftList { ...@@ -144,12 +186,41 @@ class SoftList {
icon, icon,
execCommand, execCommand,
noDisplay, noDisplay,
desktop:file desktop:file,
searchIcon:false,
}; };
}); });
let newApps = apps.filter(v => !!v.icon && v.type=='Application' && (v.noDisplay != true && v.noDisplay != 'true')); let newApps = apps.filter(v => !!v.icon && v.type=='Application' && (v.noDisplay != true && v.noDisplay != 'true'));
newApps.map((item, nIndex) => {
let { icon, iconList, name, ...restProp } = item;
// icon判断是否绝对路径
if( icon && !path.isAbsolute( icon ) ) {
this.searchNameOfImage(item,nIndex);
// this.findIcon(icon,'/usr/share/icons', (res)=>{
// iconList = res;
// console.log('inex',nIndex, iconList.length)
// this.mainWindow.win.webContents.send('getMsg', iconList)
// if(iconList.length > 0) {
// icon = this.getMaxPix({name, iconList, icon})
// }else {
// // this.findIcon(icon,'/usr/share', (res)=>{
// // iconList = res;
// // icon = this.getMaxPix({name, iconList, icon})
// // });
// }
// });
}
return {
iconList: iconList || [],
name,
icon,
...restProp,
searchIcon:true,
};
})
this.store.set('apps', newApps); this.store.set('apps', newApps);
this.mainWindow.win.webContents.send("appsList", newApps); // this.mainWindow.win.webContents.send("appsList", newApps);
} catch (error) { } catch (error) {
console.error(error) console.error(error)
} }
...@@ -261,6 +332,98 @@ class SoftList { ...@@ -261,6 +332,98 @@ class SoftList {
} }
} }
updatePath({index, path, name}) {
let appsList = this.store.get('apps');
let currentApp = appsList[index];
if(currentApp && currentApp.name == name) {
appsList[index].icon = path;
appsList[index].searchIcon = true;
this.store.set('apps', appsList);
}
}
promiseOne({res, detail, index, findPath, excludePath}) {
let { icon, iconList, name, ...restProp } = detail;
return new Promise((resolve, reject) =>{
if(!res) {
reject();
return;
}
if(res.code == 0) {
resolve({code : 0, index, path:res.path});
return;
}
if(res.code != 1) {
reject();
return;
}
this.findIconPromise({iconName:icon, pathBase:findPath, excludePath}).then(sRes => {
return new Promise((resolve, reject) =>{
iconList = sRes;
if(iconList.length > 0) {
// this.mainWindow.win.webContents.send('getMsg', index + '_22')
// this.mainWindow.win.webContents.send('getMsg', '查找路径:'+findPath)
// this.mainWindow.win.webContents.send('getMsg', '排除路径:'+excludePath)
// this.mainWindow.win.webContents.send('getMsg', iconList)
icon = this.getMaxPix({name, iconList, icon})
// this.mainWindow.win.webContents.send('getMsg', '最终路径:'+icon)
this.updatePath({index, path:icon, name});
resolve({code : 0, index, path:icon});
}else {
resolve({code : 1, index})
}
})
})
})
}
// 查找特定名称的图片png\svg
searchNameOfImage(detail,index) {
let { icon, iconList, name, ...restProp } = detail;
const findPaths = [
'/usr/share/icons/hicolor',
'/usr/share/icons',
'/usr/share',
];
// this.findIcon(icon,'/usr/share/icons', (res)=>{
// iconList = res;
// this.mainWindow.win.webContents.send('getMsg', index)
// this.mainWindow.win.webContents.send('getMsg', iconList)
// if(iconList.length > 0) {
// icon = this.getMaxPix({name, iconList, icon})
// }else {
// // this.findIcon(icon,'/usr/share', (res)=>{
// // iconList = res;
// // icon = this.getMaxPix({name, iconList, icon})
// // });
// }
// });
this.findIconPromise({iconName: icon, pathBase:findPaths[0]}).then(res => {
return new Promise((resolve, reject) =>{
iconList = res;
if(iconList.length > 0) {
icon = this.getMaxPix({name, iconList, icon})
// this.mainWindow.win.webContents.send('getMsg', '最终路径:'+icon)
// this.mainWindow.win.webContents.send('getMsg', index + '_0')
// this.mainWindow.win.webContents.send('getMsg', iconList)
this.updatePath({index, path:icon, name});
resolve({code : 0, index, path:icon});
}else {
// 无icon，继续查找
resolve({code : 1 , index});
}
})
}).then(res => {
return this.promiseOne({res, detail, index, findPath:findPaths[1], excludePath:findPaths[0]});
}).then(res => {
return this.promiseOne({res, detail, index, findPath:findPaths[2], excludePath:findPaths[1]});
}).then(res => {
// this.mainWindow.win.webContents.send('getMsg', res)
}).catch(err => {
console.error(err)
});
}
// 将.icns文件转为.png文件 // 将.icns文件转为.png文件
icns2Png({iconPath,fileNameShort}) { icns2Png({iconPath,fileNameShort}) {
let fileRes = ''; let fileRes = '';
......
src/main/windows/mainWindow.js
浏览文件 @ bed466ee
...@@ -21,7 +21,6 @@ export const windowsCfg = { ...@@ -21,7 +21,6 @@ export const windowsCfg = {
route: '', // 页面路由URL '/manage?id=123' route: '', // 页面路由URL '/manage?id=123'
resizable: true, //是否支持调整窗口大小 resizable: true, //是否支持调整窗口大小
maximize: false, //是否最大化 maximize: false, //是否最大化
// backgroundColor:'#eee', //窗口背景色
data: null, //数据 data: null, //数据
isMultiWindow: false, //是否支持多开窗口 (如果为false，当窗体存在，再次创建不会新建一个窗体 只focus显示即可，，如果为true，即使窗体存在，也可以新建一个) isMultiWindow: false, //是否支持多开窗口 (如果为false，当窗体存在，再次创建不会新建一个窗体 只focus显示即可，，如果为true，即使窗体存在，也可以新建一个)
isMainWin: false, //是否主窗口(当为true时会替代当前主窗口) isMainWin: false, //是否主窗口(当为true时会替代当前主窗口)
...@@ -45,6 +44,7 @@ class MainWindow { ...@@ -45,6 +44,7 @@ class MainWindow {
initBrowserPage (args, win) { initBrowserPage (args, win) {
// Dev or not // Dev or not
let winURL = ''; let winURL = '';
try {
if (process.env.WEBPACK_DEV_SERVER_URL) { if (process.env.WEBPACK_DEV_SERVER_URL) {
win.loadURL(process.env.WEBPACK_DEV_SERVER_URL) win.loadURL(process.env.WEBPACK_DEV_SERVER_URL)
/* 开发环境下自启动开发者工具 /* 开发环境下自启动开发者工具
...@@ -59,11 +59,14 @@ class MainWindow { ...@@ -59,11 +59,14 @@ class MainWindow {
win.loadURL(winURL) win.loadURL(winURL)
// win.webContents.openDevTools({ mode: 'detach' }) // win.webContents.openDevTools({ mode: 'detach' })
} }
} catch (error) {
console.error( error )
}
// this.win.on('closed', () => { this.win.on('closed', () => {
// this.win = null this.win = null
// console.log('windows closed') console.log('windows closed')
// }) })
} }
// 窗口配置 // 窗口配置
...@@ -71,7 +74,6 @@ class MainWindow { ...@@ -71,7 +74,6 @@ class MainWindow {
return { return {
width: wh[0], width: wh[0],
height: wh[1], height: wh[1],
// backgroundColor: '#f00',
// autoHideMenuBar: true, // autoHideMenuBar: true,
// titleBarStyle: "hidden", // titleBarStyle: "hidden",
resizable: true, resizable: true,
...@@ -81,8 +83,6 @@ class MainWindow { ...@@ -81,8 +83,6 @@ class MainWindow {
show: false, show: false,
fullscreen:false, fullscreen:false,
fullscreenable:false, fullscreenable:false,
// backgroundColor: '#00000000', //透明颜色
transparent:true, //透明开启
webPreferences: { webPreferences: {
contextIsolation: false, //上下文隔离 contextIsolation: false, //上下文隔离
nodeIntegration: true, //启用Node集成（是否完整的支持 node） nodeIntegration: true, //启用Node集成（是否完整的支持 node）
...@@ -129,11 +129,14 @@ class MainWindow { ...@@ -129,11 +129,14 @@ class MainWindow {
if(typeof args.modal === 'boolean') opt.modal = args.modal if(typeof args.modal === 'boolean') opt.modal = args.modal
if(typeof args.resizable === 'boolean') opt.resizable = args.resizable if(typeof args.resizable === 'boolean') opt.resizable = args.resizable
if(args.backgroundColor) opt.backgroundColor = args.backgroundColor
if(args.minWidth) opt.minWidth = args.minWidth; if(args.minWidth) opt.minWidth = args.minWidth;
if(args.minHeight) opt.minHeight = args.minHeight; if(args.minHeight) opt.minHeight = args.minHeight;
if(args.x) opt.x = args.x; if(args.x != undefined) opt.x = args.x;
if(args.y) opt.y = args.y; if(args.y != undefined) opt.y = args.y;
if(args.isMainWin) {
// opt.transparent = true;
// opt.backgroundColor = '#10000000'
}
console.log(opt) console.log(opt)
let win = new BrowserWindow(opt) let win = new BrowserWindow(opt)
...@@ -197,7 +200,10 @@ class MainWindow { ...@@ -197,7 +200,10 @@ class MainWindow {
// // resizable:false, // // resizable:false,
// }) // })
win.on('close', () => win.setOpacity(0)) // win.on('close', (event) => {
// event.preventDefault();
// // win.hide();
// })
// 等待加载完成再去显示，不显示白屏加载过程 // 等待加载完成再去显示，不显示白屏加载过程
win.once('ready-to-show', () => { win.once('ready-to-show', () => {
if(args.visible!='hide') win.show(); if(args.visible!='hide') win.show();
...@@ -229,7 +235,7 @@ class MainWindow { ...@@ -229,7 +235,7 @@ class MainWindow {
this.setAboutPanel() this.setAboutPanel()
// 读取Linux系统中已经安装的软件 // 读取Linux系统中已经安装的软件
this.softList.getList(); if(args.isMainWin) this.softList.getList();
} }
// 关闭所有窗口 // 关闭所有窗口
...@@ -371,6 +377,7 @@ class MainWindow { ...@@ -371,6 +377,7 @@ class MainWindow {
onlyOneShowMain() { onlyOneShowMain() {
// 只显示一个主窗口 // 只显示一个主窗口
const gotTheLock = app.requestSingleInstanceLock() const gotTheLock = app.requestSingleInstanceLock()
console.log('gotTheLock', gotTheLock)
if (!gotTheLock) { if (!gotTheLock) {
app.quit() app.quit()
} else { } else {
......
src/main/windows/window.js deleted 100644 → 0
浏览文件 @ 99044d15
import { app, BrowserWindow, ipcMain, Menu, Tray } from "electron";
import { createProtocol } from 'vue-cli-plugin-electron-builder/lib'
import path from 'path'
export const windowsCfg = {
id: '', //唯一id
title: '', //窗口标题
width: '', //宽度
height: '', //高度
minWidth: '', //最小宽度
minHeight: '', //最小高度
route: '', // 页面路由URL '/manage?id=123'
resizable: true, //是否支持调整窗口大小
maximize: false, //是否最大化
backgroundColor:'#eee', //窗口背景色
data: null, //数据
isMultiWindow: false, //是否支持多开窗口 (如果为false，当窗体存在，再次创建不会新建一个窗体 只focus显示即可，，如果为true，即使窗体存在，也可以新建一个)
isMainWin: false, //是否主窗口(当为true时会替代当前主窗口)
parentId: '', //父窗口id 创建父子窗口 -- 子窗口永远显示在父窗口顶部 【父窗口可以操作】
modal: false, //模态窗口 -- 模态窗口是禁用父窗口的子窗口，创建模态窗口必须设置 parent 和 modal 选项 【父窗口不能操作】
}
/**
* 窗口配置
*/
export class Window {
constructor() {
this.main = null; //当前页
this.group = {}; //窗口组
this.tray = null; //托盘
}
// 窗口配置
winOpts(wh=[]) {
return {
width: wh[0],
height: wh[1],
backgroundColor: '#f00',
autoHideMenuBar: true,
titleBarStyle: "hidden",
resizable: true,
minimizable: true,
maximizable: true,
frame: false,
show: false,
webPreferences: {
contextIsolation: false, //上下文隔离
// nodeIntegration: true, //启用Node集成（是否完整的支持 node）
nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION,
// devTools: false,
webSecurity: false,
enableRemoteModule: true, //是否启用远程模块（即在渲染进程页面使用remote）
}
}
}
// 获取窗口
getWindow(id) {
return BrowserWindow.fromId(id)
}
// 获取全部窗口
getAllWindows() {
return BrowserWindow.getAllWindows()
}
// 创建窗口
createWindows(options) {
console.log('------------开始创建窗口...')
console.log(options)
let args = Object.assign({}, windowsCfg, options)
console.log(args)
// 判断窗口是否存在
for(let i in this.group) {
if(this.getWindow(Number(i)) && this.group[i].route === args.route && !this.group[i].isMultiWindow) {
this.getWindow(Number(i)).focus()
return
}
}
let opt = this.winOpts([args.width || 800, args.height || 600])
if(args.parentId) {
console.log('parentId：' + args.parentId)
opt.parent = this.getWindow(args.parentId)
} else if(this.main) {
console.log(666)
}
if(typeof args.modal === 'boolean') opt.modal = args.modal
if(typeof args.resizable === 'boolean') opt.resizable = args.resizable
if(args.backgroundColor) opt.backgroundColor = args.backgroundColor
if(args.minWidth) opt.minWidth = args.minWidth
if(args.minHeight) opt.minHeight = args.minHeight
console.log(opt)
let win = new BrowserWindow(opt)
console.log('窗口id：' + win.id)
this.group[win.id] = {
route: args.route,
isMultiWindow: args.isMultiWindow,
}
// 是否最大化
if(args.maximize && args.resizable) {
win.maximize()
}
// 是否主窗口
if(args.isMainWin) {
if(this.main) {
console.log('主窗口存在')
delete this.group[this.main.id]
this.main.close()
}
this.main = win
}
args.id = win.id
win.on('close', () => win.setOpacity(0))
// 打开网址（加载页面）
/**
* 开发环境: http://localhost:8080
* 正式环境: app://./index.html
*/
let winURL
if (process.env.WEBPACK_DEV_SERVER_URL) {
// Load the url of the dev server if in development mode
// win.loadURL(process.env.WEBPACK_DEV_SERVER_URL)
winURL = args.route ? `http://localhost:8080${args.route}` : `http://localhost:8080`
// 打开开发者调试工具
// if (!process.env.IS_TEST) win.webContents.openDevTools()
} else {
createProtocol('app')
// Load the index.html when not in development
// win.loadURL('app://./index.html')
winURL = args.route ? `app://./index.html${args.route}` : `app://./index.html`
}
win.loadURL(winURL)
win.once('ready-to-show', () => {
win.show()
})
// 屏蔽窗口菜单（-webkit-app-region: drag）
win.hookWindowMessage(278, function(e){
win.setEnabled(false)
setTimeout(() => {
win.setEnabled(true)
}, 100)
return true
})
}
// 关闭所有窗口
closeAllWindow() {
for(let i in this.group) {
if(this.group[i]) {
if(this.getWindow(Number(i))) {
this.getWindow(Number(i)).close()
} else {
console.log('---------------------------')
app.quit()
}
}
}
}
// 创建托盘
createTray() {
console.log('创建托盘')
const contextMenu = Menu.buildFromTemplate([
{
label: '显示',
click: () => {
for(let i in this.group) {
if(this.group[i]) {
// this.getWindow(Number(i)).show()
let win = this.getWindow(Number(i))
if(!win) return
if(win.isMinimized()) win.restore()
win.show()
}
}
}
}, {
label: '退出',
click: () => {
app.quit()
}
}
])
console.log(__dirname)
const trayIco = path.join(__dirname, '../static/logo.png')
console.log(trayIco)
this.tray = new Tray(trayIco)
this.tray.setContextMenu(contextMenu)
this.tray.setToolTip(app.name)
}
// 开启监听
listen() {
// 关闭
ipcMain.on('window-closed', (event, winId) => {
if(winId) {
this.getWindow(Number(winId)).close()
if(this.group[Number(winId)]) delete this.group[Number(winId)]
} else {
this.closeAllWindow()
}
})
// 隐藏
ipcMain.on('window-hide', (event, winId) => {
if(winId) {
this.getWindow(Number(winId)).hide()
} else {
for(let i in this.group) if(this.group[i]) this.getWindow(Number(i)).hide()
}
})
// 显示
ipcMain.on('window-show', (event, winId) => {
if(winId) {
this.getWindow(Number(winId)).show()
} else {
for(let i in this.group) if(this.group[i]) this.getWindow(Number(i)).show()
}
})
// 最小化
ipcMain.on('window-mini', (event, winId) => {
if(winId) {
this.getWindow(Number(winId)).minimize()
} else {
for(let i in this.group) if(this.group[i]) this.getWindow(Number(i)).minimize()
}
})
// 最大化
ipcMain.on('window-max', (event, winId) => {
if(winId) {
this.getWindow(Number(winId)).maximize()
} else {
for(let i in this.group) if(this.group[i]) this.getWindow(Number(i)).maximize()
}
})
// 最大化/最小化
ipcMain.on('window-max-min-size', (event, winId) => {
if(winId) {
if(this.getWindow(winId).isMaximized()) {
this.getWindow(winId).unmaximize()
}else {
this.getWindow(winId).maximize()
}
}
})
// 还原
ipcMain.on('window-restore', (event, winId) => {
if(winId) {
this.getWindow(Number(winId)).restore()
} else {
for(let i in this.group) if(this.group[i]) this.getWindow(Number(i)).restore()
}
})
// 重新加载
ipcMain.on('window-reload', (event, winId) => {
if(winId) {
this.getWindow(Number(winId)).reload()
} else {
for(let i in this.group) if(this.group[i]) this.getWindow(Number(i)).reload()
}
})
// 创建窗口
ipcMain.on('window-new', (event, args) => this.createWindows(args))
}
}
\ No newline at end of file
src/renderer/App.vue
浏览文件 @ bed466ee
...@@ -2,255 +2,18 @@ ...@@ -2,255 +2,18 @@
<div> <div>
<router-view></router-view> <router-view></router-view>
</div> </div>
<!-- <div id="app" ref="appcontainer" class="container">
<div class="left_main">
<img src="~@/assets/WechatIMG17.jpeg" alt="" class="left_img">
<span class="left_name" @click="getFrontApp">许昌市第十六中学</span>
</div>
<div v-if="mode=='modeJianYue'" class="group1_wrap first">
<div v-for="(appItem, appIndex) in group1"
:data-appname="appItem.name"
class="app_item"
@click="tapApp(appItem)">
<img :src="appItem.icon" alt="" class="img" v-if="appItem.icon && appItem.icon.indexOf('.png') == -1">
<span class="app_name">{{ appItem.name }}</span>
</div>
</div>
<div v-if="mode=='modeJianYue'" class="group1_wrap">
<div v-for="(appItem, appIndex) in group2"
:data-appname="appItem.name"
class="app_item"
@click="tapApp(appItem)">
<img :src="appItem.icon" alt="" class="img">
<span class="app_name">{{ appItem.name }}</span>
</div>
</div>
<div v-if="mode=='modeJianYue'" class="group1_wrap">
<div v-for="(appItem, appIndex) in group3"
:data-appname="appItem.name"
class="app_item"
@click="tapApp(appItem)">
<img :src="appItem.icon" alt="" class="img">
<span class="app_name">{{ appItem.name }}</span>
</div>
</div>
<div v-if="mode=='modeJianYue'" class="group1_wrap">
<div v-for="(appItem, appIndex) in group4"
:data-appname="appItem.name"
class="app_item"
@click="tapApp(appItem)">
<img :src="appItem.icon" alt="" class="img">
<span class="app_name">{{ appItem.name }}</span>
</div>
</div>
</div> -->
</template> </template>
<script> <script>
import one from './components/Dockmode/one.vue';
export default {
components: {
one
},
data() {
return {
appList:[],
mode:'modeJianYue',
};
},
computed: {
group1() {
return this.appList.length > 8 && this.appList.slice(0,9) || [];
},
group2() {
return this.appList.length > 10 && this.appList.slice(9,11) || [];
},
group3() {
return this.appList.length > 12 && this.appList.slice(11,13) || [];
},
group4() {
return this.appList.length > 14 && this.appList.slice(13,15) || [];
},
ipcRenderer() {
return this.$electron && this.$electron.ipcRenderer || {};
}
},
created() {
},
mounted() {
// this.listener();
// // 通知主进程
// this.ipcSend();
// // 接收主进程消息
// this.ipcOn();
},
methods: {
listener() {
// 监听右键菜单
window.addEventListener('contextmenu', (e) => {
e.preventDefault();
if(e.target.parentElement && e.target.parentElement.classList.contains("app_item")
|| e.target.classList.contains("app_item")) {
return;
}
// if(e.target.parentElement && e.target.parentElement.classList.contains("left_main")
// || e.target.classList.contains("left_main")) {
// return;
// }
let ipcRenderer = this.$electron && this.$electron.ipcRenderer || {};
ipcRenderer.send("show-context-menu");
});
// 监听 `dragover` 事件，防止默认行为
window.addEventListener('dragover', (e) => {
e.preventDefault();
});
// 监听 `drop` 事件，获取拖拽的文件路径
window.addEventListener('drop', (e) => {
e.preventDefault();
let appFiles = [];
console.log(e)
let ele = this.findParentOf({className:'app_item',element:e.target});
console.dir(ele)
if(!ele || !ele.dataset ||!ele.dataset.appname) {
// 无法放置
return;
}
let filesArr = new Array(e.dataTransfer.files.length).fill(1);
filesArr.forEach((v,index) => {
// mac-应用程序文件
let file = e.dataTransfer.files[index];
if(file.path.lastIndexOf('.app') == file.path.length-4) {
appFiles.push({
path:file.path,
name: file.name,
shortName: file.name.split('.')[0] || file.name
});
}
// let linux-快捷键
if(file.path.lastIndexOf('.desktop') == file.path.length-8) {
appFiles.push({
path:file.path,
name: file.name,
shortName: file.name.split('.')[0] || file.name
});
}
});
if(appFiles.length==0) {
// 无可用应用程序文件
return;
}
let targetIndex = this.appList.findIndex(v => v.name == ele.dataset.appname);
if(targetIndex>=0) {
// 移动软件
this.ipcRenderer.send('moveSoft', { appname:ele.dataset.appname, addFiles: appFiles });
}
});
},
ipcOn() {
// 接收主进程消息
// 获取到base64
this.ipcRenderer.on("base64Info", (event, {url,index}) => {
url = url.replace(/[\r\n]/g, '');
this.appList[index].icon = url;
});
// 获取到app列表
this.ipcRenderer.on("appsList", (event, list) => {
console.log('获取到app列表', list)
this.appList = list;
this.appList.forEach((item, index) => {
console.log(item.icon)
if(item.icon && item.icon.indexOf('data:image/png') == -1) {
this.ipcRenderer.send("getBase64", {'imagePath':item.icon,index});
}
});
});
this.ipcRenderer.on("appsList_update", (event, list) => {
console.log('刷新app列表', list)
this.appList = list;
});
// 获取到app消息
this.ipcRenderer.on("getMsg", (event, msgStr) => {
console.log('获取到app消息', msgStr)
});
// 右键菜单点击-切换模式
this.ipcRenderer.on("context-menu-command",(event, mode) => {
console.log('context-menu-command', mode)
let modeObj = {
modeJianYue:'modeJianYue',
modeJiJian:'modeJiJian',
modeUXue:'modeUXue',
};
this.mode = modeObj[mode];
});
},
ipcSend() {
// 通知主进程
const screen = this.$electron.remote.screen;
const {width,height} = screen.getPrimaryDisplay().workAreaSize;//获取到屏幕的宽度和高度
console.log('宽高',width,height);
// 设置程序位置
this.ipcRenderer.send("setMainWindow0",{width,height});
//获取app列表
this.ipcRenderer.send("getApps");
},
tapApp(item) {
console.log(item)
this.ipcRenderer.send("openApp",item);
},
getFrontApp() {
this.ipcRenderer.send("getfrontApp");
},
findParentOf({className,id, element}) {
// 查找当前点击元素是否包含某个类名，或者祖先元素中包含
// tag: .class / #id
if(className) {
if( element.classList.contains(className) ) return element;
else if(element.parentElement) return this.findParentOf({className,id, element:element.parentElement});
else return null;
}
if(id) {
if( element.id = id ) return element;
else if(element.parentElement) return this.findParentOf({className,id, element:element.parentElement});
else return null;
}
}
},
}
</script> </script>
<style lang="less"> <style lang="less">
html { html {
background-color: transparent; // background-color: transparent;
font-size: 16px; font-size: 16px;
} }
body { body {
margin: 0; margin: 0;
font-size: 14px !important; font-size: 14px !important;
background-color: rgba(0,0,0,0.25); // background-color: rgba(0,0,0,0.25);
}
.container {
font-size: 20px;
display: flex;
justify-content: space-evenly;
align-items: center;
flex-wrap: wrap;
height: 100%;
border-radius: 20px;
overflow: hidden;
// background-color: hsl(0, 0%, 25%);
// background-color: #fff;
background-color: transparent;
} }
</style> </style>
src/renderer/components/Dockmode/one.vue
浏览文件 @ bed466ee
...@@ -90,7 +90,7 @@ export default { ...@@ -90,7 +90,7 @@ export default {
.one_container { .one_container {
font-size: 20px; font-size: 20px;
display: flex; display: flex;
justify-content: space-evenly; // justify-content: space-evenly;
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
height: 100%; height: 100%;
...@@ -132,26 +132,27 @@ export default { ...@@ -132,26 +132,27 @@ export default {
color: #fff; color: #fff;
} }
.group1_wrap { .group1_wrap {
margin-left: 8px;
border-radius: 6px; border-radius: 6px;
margin-left: 4px; margin-left: 8px;
// background-color: hsl(0, 0%, 25%); background: rgba(0, 0, 0, .1);
// border: 1px solid rgba(255,255,255,0.48);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
flex: 1; // flex: 1;
height: 40px; height: 56px;
padding: 0 6px; padding: 0 6px;
&.first { &.first {
padding-left: 10px; padding-left: 10px;
margin-left: 2px; // margin-left: 2px;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
} }
} }
.app_item { .app_item {
position: relative; position: relative;
margin: 0 4px; margin: 0 4px;
flex-shrink: 0; flex-shrink: 0;
// padding: 2px;
width: 36px; width: 36px;
height: 36px; height: 36px;
border-radius: 10px; border-radius: 10px;
...@@ -164,19 +165,26 @@ export default { ...@@ -164,19 +165,26 @@ export default {
text-align: left; text-align: left;
cursor: pointer; cursor: pointer;
flex-wrap: wrap; flex-wrap: wrap;
transition: all 0.2s;
&:hover { &:hover {
background-color: rgba(255, 255, 255, .1);
width: 50px;
height: 50px;
.app_name { .app_name {
display: block; // display: block;
opacity: 1;
} }
} }
} }
.img { .img {
flex-shrink: 0; flex-shrink: 0;
height: 36px; // height: 36px;
height: 100%;
// width: 36px; // width: 36px;
} }
.app_name { .app_name {
display: none; // display: none;
opacity: 0;
position: absolute; position: absolute;
top: -10px; top: -10px;
left: -20px; left: -20px;
...@@ -188,6 +196,7 @@ export default { ...@@ -188,6 +196,7 @@ export default {
font-size: 14px; font-size: 14px;
color: #fff; color: #fff;
z-index: 99; z-index: 99;
transition: opacity .3s;
} }
.yun_img { .yun_img {
width: 58px; width: 58px;
......
src/renderer/components/SchoolBox/index.vue
浏览文件 @ bed466ee
...@@ -2,7 +2,9 @@ ...@@ -2,7 +2,9 @@
<div> <div>
<box v-for="(sItem, sInd) in schoolList" :key="sInd" > <box v-for="(sItem, sInd) in schoolList" :key="sInd" >
<div class="resource_head"> <div class="resource_head">
<img src="" alt="" class="resource_icon"> <img v-if="sItem.icon === 'guojiazhihui'" src="~@/assets/school/zhihuipingtai.png" alt="" class="resource_icon">
<img v-else-if="sItem.icon === 'dianzi'" src="~@/assets/school/dianzikebenwang.png" alt="" class="resource_icon">
<img v-else-if="sItem.icon === 'xiaoxue'" src="~@/assets/school/xiaoxueziyuanwang.png" alt="" class="resource_icon">
<div @click="tapLink(sItem)" class="resource_name">{{sItem.name}}</div> <div @click="tapLink(sItem)" class="resource_name">{{sItem.name}}</div>
</div> </div>
<div class="resource_item"> <div class="resource_item">
...@@ -26,7 +28,7 @@ export default { ...@@ -26,7 +28,7 @@ export default {
default: [ default: [
{ {
name: "国家智慧教育公共服务平台", name: "国家智慧教育公共服务平台",
icon: "", icon: "guojiazhihui",
showNum:3, showNum:3,
weburl: "https://1s1k.eduyun.cn/portal/html/1s1k/index/1.html", weburl: "https://1s1k.eduyun.cn/portal/html/1s1k/index/1.html",
list: [ list: [
...@@ -51,7 +53,7 @@ export default { ...@@ -51,7 +53,7 @@ export default {
}, },
{ {
name: "小学资源网", name: "小学资源网",
icon: "", icon: "xiaoxue",
showNum:4, showNum:4,
weburl: "https://www.xj5u.com/", weburl: "https://www.xj5u.com/",
list: [ list: [
...@@ -79,7 +81,7 @@ export default { ...@@ -79,7 +81,7 @@ export default {
}, },
{ {
name: "电子课本网", name: "电子课本网",
icon: "", icon: "dianzi",
showNum:6, showNum:6,
weburl: "http://www.dzkbw.com/", weburl: "http://www.dzkbw.com/",
list: [ list: [
......
src/renderer/router/routes.js
浏览文件 @ bed466ee
import Layout from '../views/layout/Layout';
// RouterTab 内置路由 // RouterTab 内置路由
import { RouterTabRoutes } from 'vue-router-tab' import { RouterTabRoutes } from 'vue-router-tab'
......
src/renderer/styles/electron.css deleted 100644 → 0
浏览文件 @ 99044d15
body::-webkit-scrollbar {
width: 0;
height: 0;
}
body::-webkit-scrollbar-button {
width: 0;
height: 0;
}
body::-webkit-scrollbar-track {
background: 0 0;
}
body::-webkit-scrollbar-thumb {
background: #dadadb;
-webkit-transition: 0.3s;
transition: 0.3s;
}
body::-webkit-scrollbar-thumb:hover {
background-color: #b0b2b3;
}
body::-webkit-scrollbar-thumb:active {
background-color: #b0b2b3;
}
#app {
overflow: hidden;
}
.drawer-right.rtl {
top: 40px;
}
src/renderer/styles/electron.less
浏览文件 @ bed466ee
...@@ -2,186 +2,10 @@ ...@@ -2,186 +2,10 @@
.electron_app { .electron_app {
// 隐藏body滚动条 // 隐藏body滚动条
&::-webkit-scrollbar{width:0;height:0} // &::-webkit-scrollbar{width:0;height:0}
&::-webkit-scrollbar-button{width:0;height:0} // &::-webkit-scrollbar-button{width:0;height:0}
&::-webkit-scrollbar-track{background:0 0} // &::-webkit-scrollbar-track{background:0 0}
&::-webkit-scrollbar-thumb{background:#dadadb;-webkit-transition:.3s;transition:.3s} // &::-webkit-scrollbar-thumb{background:#dadadb;-webkit-transition:.3s;transition:.3s}
&::-webkit-scrollbar-thumb:hover{background-color:#b0b2b3} // &::-webkit-scrollbar-thumb:hover{background-color:#b0b2b3}
&::-webkit-scrollbar-thumb:active{background-color:#b0b2b3} // &::-webkit-scrollbar-thumb:active{background-color:#b0b2b3}
#app {
overflow: hidden;
}
@barHeight: 0px; //#app-bar 32px
@courseNavbar: 50px; //.course-navbar
// app-bar
#app-bar {
background-color: #e7eaed;
color: #57646c;
display: flex;
align-items: center;
justify-content: space-between;
// 如果你想让某区域可以拖动，将其设为drag
// 但是设为drag的区域无法被点击，请注意
// 可以设置为no-drag来恢复点击
// If you want to make a region draggable, set it to drag
// But the area set as drag cannot be clicked, please note
// can be set to no-drag to resume clicks
-webkit-app-region: drag;
height: @barHeight;
#app-action {
padding: 0;
font-size: 16px;
display: flex;
-webkit-app-region: no-drag;
text-align: center;
align-items: center;
}
.app-action-button {
box-sizing: border-box;
padding: 0 8px;
transition: .2s ease;
opacity: 0.7;
width: 52px;
height: @barHeight;
line-height: @barHeight;
display: flex;
align-items: center;
justify-content: center;
}
.app-action-button:hover {
background-color: #cfd2d5;
opacity: 1;
}
// 关闭按钮
.close-app-button:hover {
background-color: #e81123;
span {
color: #fff;
}
i {
color: #fff;
}
}
#app-title {
img {
-webkit-app-region: no-drag;
margin: 0 8px;
width: 20px;
}
span {
font-size: 14px;
}
}
.togglefullscreen {
display: block;
box-sizing: border-box;
width: 10px;
height: 10px;
border: 1px solid #000;
// 全屏下
&.full {
position: relative;
top: -2px;
width: 9px;
height: 9px;
&::after {
position: absolute;
top: 2px;
left: calc( 50% - 2px );
transform: translateX(-50%);
content: "";
box-sizing: border-box;
border: 1px solid #000;
width: 9px;
height: 9px;
background-color: #e7eaed;
}
}
}
}
.drawer-right {
&.rtl{
// top: 50px;
}
.el-tabs__content {
height: calc(100% - 40px) !important; //el-tabs__header 40px
}
// 无头部
&.not-header {
.el-tabs {
height: 100%;
}
.right-sub-modal-body {
height: calc(100% - 55px) !important;
}
}
}
.el-drawer__wrapper {
top: calc(@barHeight + @courseNavbar) !important;
// height: calc(100% - 40px) !important;
}
.drawer-right-inner {
// height: calc(100% - 10px) !important;
}
.right-sub-modal-body {
height: calc(100% - 95px) !important;
}
.list-container.grid_type .el-scrollbar__bar.is-horizontal {
display: none;
}
.el-popup-parent--hidden {
padding-right: 0 !important; //electron端重置
}
// 弹出层遮罩 -el
@headerTitleHeight: 54px;
@tabHeight: 40px;
&.hide-modal {
.v-modal {
top: calc(32px + 50px) !important;
}
// 右侧滑动编辑区，遮罩层不可见
.drawer-right.rtl {
top: 0;
.el-tabs {
height: 100%;
}
.el-tabs__content {
height: calc(100% - @tabHeight) !important;
}
}
}
// 模板弹框
.el-dialog__wrapper {
display: flex;
align-items: center;
justify-content: center;
}
.create-temp-dialog {
margin: 0 auto !important;
max-width: 90%;
}
// 课程列表弹窗
.course-dialog {
top: 0;
transform: translateY(0);
}
.hotgraphic-dialog {
top: 0;
}
} }
\ No newline at end of file
src/renderer/views/Home.vue
浏览文件 @ bed466ee
...@@ -70,16 +70,18 @@ export default { ...@@ -70,16 +70,18 @@ export default {
const { width, height } = screen.getPrimaryDisplay().workAreaSize; //获取到屏幕的宽度和高度 const { width, height } = screen.getPrimaryDisplay().workAreaSize; //获取到屏幕的宽度和高度
const main_win = this.$electron.remote.getCurrentWindow(); const main_win = this.$electron.remote.getCurrentWindow();
const [mainX, mainY] = main_win.getPosition(); const [mainX, mainY] = main_win.getPosition();
console.log(mainX, mainY)
this.ipcRenderer.send("window-new", { this.ipcRenderer.send("window-new", {
title: "管理页面", title: "管理页面",
route: "/manage", route: "/manage",
// width: width * 0.6, // width: width * 0.6,
width: 1200, width: 1200,
height: height * 0.7, height: height * 0.7,
backgroundColor: "#f9f9f9", // backgroundColor: "#f9f9f9",
resizable: true, resizable: true,
modal: false, modal: false,
x: mainX, // x: mainX,
x: 0,
y: mainY - height * 0.7, y: mainY - height * 0.7,
webType:'appManage', webType:'appManage',
visible: arg.visible visible: arg.visible
...@@ -167,7 +169,7 @@ export default { ...@@ -167,7 +169,7 @@ export default {
}) })
// 获取到base64 // 获取到base64
this.ipcRenderer.on("base64Info", (event, { url, index }) => { this.ipcRenderer.on("base64Info", (event, { url, index, time }) => {
url = url.replace(/[\r\n]/g, ""); url = url.replace(/[\r\n]/g, "");
this.appList[index].icon = url; this.appList[index].icon = url;
}); });
...@@ -178,7 +180,9 @@ export default { ...@@ -178,7 +180,9 @@ export default {
this.appList = list; this.appList = list;
this.appList.forEach((item, index) => { this.appList.forEach((item, index) => {
// console.log(item.icon) // console.log(item.icon)
if (item.icon && item.icon.indexOf("data:image/png") == -1) { if (item.icon
&& (item.icon.indexOf('data:image/png') == -1 && item.icon.indexOf('data:image/svg') == -1)
&& item.searchIcon === true) {
// console.log('getBase64', index) // console.log('getBase64', index)
this.ipcRenderer.send("getBase64", { imagePath: item.icon, index }); this.ipcRenderer.send("getBase64", { imagePath: item.icon, index });
} }
......
src/renderer/views/application/list.vue
浏览文件 @ bed466ee
<template> <template>
<div class="application-list-container"> <div></div>
<div @click="newWin">打开新窗口</div> </template>
<div v-for="(appItem,index) in appList" :key="index" class="application-item" @click="tapApp(appItem)">
<div>名字:{{ appItem.name }}</div>
<img :src="appItem.icon" alt="" class="img">
<div>中文名字:{{ appItem.nameOfZh }}</div>
<div>文件路径：{{ appItem.desktop }}</div>
</div>
</div>
</template>
<script> <script>
/* import pinyin from 'pinyin'; */ export default {
export default {
data() {
return {
appList:[],
mode:'modeJianYue',
};
},
computed: {
group1() {
return this.appList.length > 8 && this.appList.slice(0,9) || [];
},
group2() {
return this.appList.length > 10 && this.appList.slice(9,11) || [];
},
group3() {
return this.appList.length > 12 && this.appList.slice(11,13) || [];
},
group4() {
return this.appList.length > 14 && this.appList.slice(13,15) || [];
},
ipcRenderer() {
return this.$electron && this.$electron.ipcRenderer || {};
}
},
created() {
}, }
mounted() { </script>
<style>
this.listener(); </style>
\ No newline at end of file
// 通知主进程
this.ipcSend();
// 接收主进程消息
this.ipcOn();
},
methods: {
newWin() {
const main_win = this.$electron.remote.getCurrentWindow();
const [mainX, mainY] = main_win.getPosition();
this.ipcRenderer.send('window-new', {
title: '首页',
route: '/404',
width: 500,
height: 250,
backgroundColor: '#f9f9f9',
resizable: true,
modal: false,
x:mainX,
y:mainY-250
})
},
listener() {
// 监听右键菜单
window.addEventListener('contextmenu', (e) => {
e.preventDefault();
if(e.target.parentElement && e.target.parentElement.classList.contains("app_item")
|| e.target.classList.contains("app_item")) {
return;
}
// if(e.target.parentElement && e.target.parentElement.classList.contains("left_main")
// || e.target.classList.contains("left_main")) {
// return;
// }
let ipcRenderer = this.$electron && this.$electron.ipcRenderer || {};
ipcRenderer.send("show-context-menu");
});
// 监听 `dragover` 事件，防止默认行为
window.addEventListener('dragover', (e) => {
e.preventDefault();
});
// 监听 `drop` 事件，获取拖拽的文件路径
window.addEventListener('drop', (e) => {
e.preventDefault();
let appFiles = [];
console.log(e)
let ele = this.findParentOf({className:'app_item',element:e.target});
console.dir(ele)
if(!ele || !ele.dataset ||!ele.dataset.appname) {
// 无法放置
return;
}
let filesArr = new Array(e.dataTransfer.files.length).fill(1);
filesArr.forEach((v,index) => {
// mac-应用程序文件
let file = e.dataTransfer.files[index];
if(file.path.lastIndexOf('.app') == file.path.length-4) {
appFiles.push({
path:file.path,
name: file.name,
shortName: file.name.split('.')[0] || file.name
});
}
// let linux-快捷键
if(file.path.lastIndexOf('.desktop') == file.path.length-8) {
appFiles.push({
path:file.path,
name: file.name,
shortName: file.name.split('.')[0] || file.name
});
}
});
if(appFiles.length==0) {
// 无可用应用程序文件
return;
}
let targetIndex = this.appList.findIndex(v => v.name == ele.dataset.appname);
if(targetIndex>=0) {
// 移动软件
this.ipcRenderer.send('moveSoft', { appname:ele.dataset.appname, addFiles: appFiles });
}
});
},
ipcOn() {
// 接收主进程消息
// 获取到base64
this.ipcRenderer.on("base64Info", (event, {url,index}) => {
url = url.replace(/[\r\n]/g, '');
this.appList[index].icon = url;
});
// 获取到app列表
this.ipcRenderer.on("appsList", (event, list) => {
console.log('获取到app列表', list)
// this.appList = list;
this.appList.forEach((item, index) => {
// console.log(item.icon)
if(item.icon && item.icon.indexOf('data:image/png') == -1) {
this.ipcRenderer.send("getBase64", {'imagePath':item.icon,index});
}
});
// this.getPinyin();
});
this.ipcRenderer.on("appsList_update", (event, list) => {
console.log('刷新app列表', list)
// this.appList = list;
// this.getPinyin();
});
// 获取到app消息
this.ipcRenderer.on("getMsg", (event, msgStr) => {
console.log('获取到app消息', msgStr)
});
// 右键菜单点击-切换模式
this.ipcRenderer.on("context-menu-command",(event, mode) => {
console.log('context-menu-command', mode)
let modeObj = {
modeJianYue:'modeJianYue',
modeJiJian:'modeJiJian',
modeUXue:'modeUXue',
};
this.mode = modeObj[mode];
});
},
ipcSend() {
// 通知主进程
const screen = this.$electron.remote.screen;
const {width,height} = screen.getPrimaryDisplay().workAreaSize;//获取到屏幕的宽度和高度
console.log('宽高',width,height);
// 设置程序位置
this.ipcRenderer.send("setMainWindow0",{width,height});
//获取app列表
this.ipcRenderer.send("getApps");
},
tapApp(item) {
console.log(item)
this.ipcRenderer.send("openApp",item);
},
getFrontApp() {
this.ipcRenderer.send("getfrontApp");
},
findParentOf({className,id, element}) {
// 查找当前点击元素是否包含某个类名，或者祖先元素中包含
// tag: .class / #id
if(className) {
if( element.classList.contains(className) ) return element;
else if(element.parentElement) return this.findParentOf({className,id, element:element.parentElement});
else return null;
}
if(id) {
if( element.id = id ) return element;
else if(element.parentElement) return this.findParentOf({className,id, element:element.parentElement});
else return null;
}
},
// 排序
getPinyin() {
return;
// 将每个应用程序名字转换为拼音，并组成一个新的数组
const appNamesInPinyin = this.appList.map(appItem => {
return {
icon:appItem.icon,
nameOfZh:appItem.nameOfZh,
desktop:appItem.desktop,
name: (appItem.nameOfZh || appItem.name),
pinyin: pinyin((appItem.nameOfZh || appItem.name), {
style: pinyin.STYLE_NORMAL
}).join('')
};
});
// 根据拼音进行排序
appNamesInPinyin.sort((a, b) => {
return a.pinyin.localeCompare(b.pinyin);
});
// 输出排序后的应用程序名字
appNamesInPinyin.forEach(app => {
console.log(app.nameOfZh || app.name);
});
},
},
}
</script>
<style lang="less" scoped>
.application-list-container {
width: 100%;
height: 100px;
font-size: 24px;
background: #fff;
img {
width: 50px;
height: 50px;
}
.application-item {
display: flex;
}
}
</style>
\ No newline at end of file
src/renderer/views/layout/Layout.vue deleted 100644 → 0
浏览文件 @ 99044d15
<template>
<div></div>
</template>
<script>
export default {
name: 'layout',
}
</script>
<style lang="less" scoped>
</style>
src/renderer/views/layout/components/AppMain.vue deleted 100644 → 0
浏览文件 @ 99044d15
<template>
<section class="app-main">
<transition name="fade" mode="out-in">
<!-- <router-view :key="key"></router-view> -->
<router-view></router-view>
</transition>
</section>
</template>
<script>
export default {
name: 'AppMain',
computed: {
// key() {
// return this.$route.name !== undefined ? this.$route.name + +new Date() : this.$route + +new Date()
// }
}
}
</script>
src/renderer/views/layout/components/Navbar.vue deleted 100644 → 0
浏览文件 @ 99044d15
<template>
<div>12222</div>
</template>
<script>
import { mapState } from 'vuex'
export default {
methods: {
}
}
</script>
<style lang="less" scoped>
.navbar {
height: 50px;
line-height: 50px;
border-radius: 0px !important;
.hamburger-container {
line-height: 58px;
height: 50px;
float: left;
padding: 0 10px;
}
.screenfull {
position: absolute;
right: 90px;
top: 16px;
color: red;
}
.avatar-container {
height: 50px;
display: inline-block;
position: absolute;
right: 35px;
.avatar-wrapper {
cursor: pointer;
margin-top: 5px;
position: relative;
.user-avatar {
width: 40px;
height: 40px;
border-radius: 10px;
}
.el-icon-caret-bottom {
position: absolute;
right: -20px;
top: 25px;
font-size: 12px;
}
}
}
}
</style>
src/renderer/views/layout/components/Sidebar/SidebarItem.vue deleted 100644 → 0
浏览文件 @ 99044d15
<template>
<div class="menu-wrapper">
<template v-for="item in routes" v-if="!item.hidden&&item.children">
<router-link v-if="hasOneShowingChildren(item.children) && !item.children[0].children&&!item.alwaysShow" :to="item.path+'/'+item.children[0].path"
:key="item.children[0].name">
<el-menu-item :index="item.path+'/'+item.children[0].path" :class="{'submenu-title-noDropdown':!isNest}">
<!-- <svg-icon v-if="item.children[0].meta&&item.children[0].meta.icon" :icon-class="item.children[0].meta.icon"></svg-icon> -->
<span v-if="item.children[0].meta&&item.children[0].meta.title" slot="title">{{item.children[0].meta.title}}</span>
</el-menu-item>
</router-link>
<el-submenu v-else :index="item.name||item.path" :key="item.name">
<template slot="title">
<!-- <svg-icon v-if="item.meta&&item.meta.icon" :icon-class="item.meta.icon"></svg-icon> -->
<span v-if="item.meta&&item.meta.title" slot="title">{{item.meta.title}}</span>
</template>
<template v-for="child in item.children" v-if="!child.hidden">
<sidebar-item :is-nest="true" class="nest-menu" v-if="child.children&&child.children.length>0" :routes="[child]" :key="child.path"></sidebar-item>
<router-link v-else :to="item.path+'/'+child.path" :key="child.name">
<el-menu-item :index="item.path+'/'+child.path">
<!-- <svg-icon v-if="child.meta&&child.meta.icon" :icon-class="child.meta.icon"></svg-icon> -->
<span v-if="child.meta&&child.meta.title" slot="title">{{child.meta.title}}</span>
</el-menu-item>
</router-link>
</template>
</el-submenu>
</template>
</div>
</template>
<script>
export default {
name: 'SidebarItem',
props: {
routes: {
type: Array
},
isNest: {
type: Boolean,
default: false
}
},
methods: {
hasOneShowingChildren(children) {
const showingChildren = children.filter(item => {
return !item.hidden
})
if (showingChildren.length === 1) {
return true
}
return false
}
}
}
</script>
src/renderer/views/layout/components/Sidebar/index.vue deleted 100644 → 0
浏览文件 @ 99044d15
<template>
<div>11111111111</div>
</template>
<script>
import { mapGetters, mapState } from 'vuex'
export default {
computed: {
...mapState({
sidebar: state => state.app.sidebar,
}),
routes() {
return this.$router.options.routes
},
isCollapse() {
return !this.sidebar.opened
}
}
}
</script>
src/renderer/views/layout/components/index.js deleted 100644 → 0
浏览文件 @ 99044d15
export { default as Navbar } from './Navbar'
export { default as Sidebar } from './Sidebar'
export { default as AppMain } from './AppMain'
src/renderer/views/layout/mixin/ResizeHandler.js deleted 100644 → 0
浏览文件 @ 99044d15
// import store from '@/renderer/store'
const { body } = document
const WIDTH = 1024
const RATIO = 3
export default {
watch: {
$route(route) {
// if (this.device === 'mobile' && this.sidebar.opened) {
// store.dispatch('CloseSideBar', { withoutAnimation: false })
// }
}
},
// beforeMount() {
// window.addEventListener('resize', this.resizeHandler)
// },
// mounted() {
// const isMobile = this.isMobile()
// if (isMobile) {
// store.dispatch('ToggleDevice', 'mobile')
// store.dispatch('CloseSideBar', { withoutAnimation: true })
// }
// },
// methods: {
// isMobile() {
// const rect = body.getBoundingClientRect()
// return rect.width - RATIO < WIDTH
// },
// resizeHandler() {
// if (!document.hidden) {
// const isMobile = this.isMobile()
// store.dispatch('ToggleDevice', isMobile ? 'mobile' : 'desktop')
// if (isMobile) {
// store.dispatch('CloseSideBar', { withoutAnimation: true })
// }
// }
// }
// }
}
src/renderer/views/manage/index.vue
浏览文件 @ bed466ee
...@@ -88,12 +88,12 @@ export default { ...@@ -88,12 +88,12 @@ export default {
ipcOn() { ipcOn() {
// 获取到app列表 // 获取到app列表
this.ipcRenderer.on("appsList", (event, list) => { this.ipcRenderer.on("appsList", (event, list) => {
// console.log("获取到app列表 2", list); console.log("获取到app列表 2", list);
this.listObj.lastest = list; this.listObj.lastest = list;
this.appList = list; this.appList = list;
// this.appList.forEach((item, index) => { // this.appList.forEach((item, index) => {
// // console.log(item.icon) // // console.log(item.icon)
// if (item.icon && item.icon.indexOf("data:image/png") == -1) { // if (item.icon && (item.icon.indexOf('data:image/png') == -1 && item.icon.indexOf('data:image/svg') == -1) && item.searchIcon === true) {
// this.ipcRenderer.send("getBase64", { imagePath: item.icon, index }); // this.ipcRenderer.send("getBase64", { imagePath: item.icon, index });
// } // }
// }); // });
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论