提交 763dcadb authored 作者: caicai's avatar caicai

移出分类

上级 96126acf
......@@ -333,6 +333,10 @@ class IpcEvents {
let { name,detail,index } = data;
this.categoryPlugin.updateName({name, detail, sender:e.sender})
})
ipcMain.on("removeSoftFromCate", (e, data) => {
let { cate,soft } = data;
this.categoryPlugin.removeSoft({cate,soft, sender:e.sender})
})
}
}
......
......@@ -70,14 +70,26 @@ class category {
updateCategory({id, detail, sender}) {
let categoryList = this.store.get('category');
let hasIn = categoryList.findIndex(v => v.id == id);
console.log('hasIn', hasIn)
// console.log('hasIn', hasIn)
if(hasIn == -1) return null;
categoryList[hasIn] = detail;
this.store.set('category', categoryList);
sender.send('change-category',{detail,id});
this.mainWindow.win.webContents.send('getMsg', categoryList)
}
// 更新分类下的软件列表
updateSoftList({id, detail, sender}) {
let categoryList = this.store.get('category');
let hasIn = categoryList.findIndex(v => v.id == id);
// console.log('hasIn', hasIn)
if(hasIn == -1) return null;
categoryList[hasIn] = detail;
this.store.set('category', categoryList);
sender.send('remove-soft',{detail,id});
}
/* 修改分类名称 */
......@@ -110,10 +122,26 @@ class category {
if(softD) cateDetail.softList.push(softD);
});
// 更新分类列表
console.log('修改分类',cateDetail,categoryId)
// console.log('修改分类',cateDetail,categoryId)
this.updateCategory({detail:cateDetail, id: categoryId, sender})
}
// 将软件从某个分类移出
removeSoft({cate,soft, sender}) {
let softId = soft.id;
let categoryId = cate.id;
if(!softId || !categoryId) return;
let cateDetail = this.getCategory(categoryId);
let hasIn = cateDetail.softIds.includes(softId);
// 不属于当前分类
if(!hasIn) return;
cateDetail.softIds = cateDetail.softIds.filter(v => v != softId);
cateDetail.softList = cateDetail.softList.filter(v => v.id != softId);
this.updateSoftList({detail:cateDetail, id: categoryId, sender})
}
getSoftDetail(softId) {
let appList = this.store.get('apps');
let targetIndex = appList.findIndex(v => v.id == softId);
......
......@@ -236,7 +236,6 @@ class MainWindow {
// })
// 等待加载完成再去显示,不显示白屏加载过程
win.once('ready-to-show', () => {
console.log('是否显示', args.visible)
if(args.visible!='hide') win.show();
// win.setAlwaysOnTop(true);
if(win.webContents.webType === 'mainWindow') {
......@@ -244,10 +243,9 @@ class MainWindow {
}
});
win.on('blur', (event) => {
console.log(event.sender.webContents.webType)
event.preventDefault();
console.log(`Window ${win.id} lost focus webType:${win.webContents.webType}`)
// console.log(`Window ${win.id} lost focus webType:${win.webContents.webType}`)
// 如果当前app 管理页 失去焦点,则隐藏
// if(win.webContents.webType === 'appManage') {
// event.sender.send('manageVisible',false);
......
......@@ -42,7 +42,7 @@ export default {
.item_wrap {
cursor: pointer;
flex-shrink: 0;
margin-right: 5px;
margin-right: 15px;
display: flex;
flex-direction: column;
align-items: center;
......@@ -66,5 +66,6 @@ export default {
color: #333333;
font-size: 14px;
font-weight: 400;
text-align: center;
}
</style>
\ No newline at end of file
......@@ -13,7 +13,9 @@ export default {
<style lang="less" scoped>
.box {
float: left;
width: 460px;
// width: 460px;
// width: 43%;
width: 49%;
display: flex;
flex-wrap: wrap;
margin-top: 24px;
......@@ -21,9 +23,11 @@ export default {
background: linear-gradient(180deg, #FFFFFF 0%, rgba(255,255,255,0.5) 100%);
box-shadow: 0px 4px 4px 0px rgba(10,78,141,0.1);
border-radius: 20px 20px 20px 20px;
margin: 24px 12px 0;
&:nth-child(2n+1) {
margin-left: 30px;
width: 346px;
// margin-left: 30px;
// width: 346px;
width: 37%;
}
}
</style>
\ No newline at end of file
......@@ -4,8 +4,12 @@
<img @click="addCate" src="~@/assets/addCategory.png" alt="" class="dragbox_head_img"><span @click="addCate" class="dragbox_head_txt">添加分类</span>
</div>
<cateBox v-for="(cItem, cIndex) in cateList" :key="cIndex">
<div class="dragbox_cate">
<div v-if="editIndex != cIndex" class="dragbox_cate_name" @dblclick="modifyName(cItem.name,cIndex)">{{cItem.name}}</div>
<div class="dragbox_cate" :data-id="cItem.id" data-type="cate_container">
<!-- @dblclick="modifyName(cItem.name,cIndex)" -->
<div v-if="editIndex != cIndex" class="dragbox_cate_name" >{{cItem.name}}
<img @click="modifyName(cItem.name,cIndex)"
src="~@/assets/edit_icon.png" alt="" class="dragbox_cate_edit">
</div>
<el-input v-else v-model="editName" placeholder="" @blur="closeEdit(cIndex)" class="dragbox_cate_input"></el-input>
<div v-if="cItem.softList" class="dragbox_cate_list">
<cateItem v-for="(sItem, sIndex) in cItem.softList" :key="sIndex" :detail="sItem" :src="sItem.icon" :name="sItem.name"></cateItem>
......@@ -25,6 +29,10 @@
<el-button type="primary" @click="sureAdd">确 定</el-button>
</span>
</el-dialog>
<right-menu @closeMenu="closeMenu" @select="selectMenu"
:cates="[{'name':'从当前分类移出'}]" :showText="false"
:visible="showMenu" :left="menuPosition.left" :top="menuPosition.top">
</right-menu>
</div>
</template>
......@@ -32,6 +40,7 @@
import draggable from 'vuedraggable';
import cateBox from './box.vue';
import cateItem from './item.vue';
import rightMenu from '@/renderer/components/RightMenu/index.vue';
export default {
props: {
cateList: {
......@@ -63,7 +72,8 @@ export default {
components: {
draggable,
cateBox,
cateItem
cateItem,
rightMenu
},
data() {
return {
......@@ -71,9 +81,74 @@ export default {
cateName:"",
editIndex: -1,
editName:"",
showMenu: false,//右键菜单
menuPosition: {
left:0,
top:0,
current:-1,
id:-1,
}
};
},
created() {
this.listener();
},
destroyed() {
window.removeEventListener("contextmenu",this.handleEvent)
},
methods: {
findParentEl({dataType, element}) {
if(element.dataset.type === dataType) return element;
if(element.parentElement) return this.findParentEl({dataType,element:element.parentElement});
return null;
},
handleEvent(e) {
// console.dir(e)
e.preventDefault();
e.stopPropagation();
if(e.target.dataset.type === 'closeMask' || this.showMenu) {
// 点击遮罩层
this.closeMenu();
return;
}
if (
(e.target.parentElement &&
e.target.parentElement.dataset.type !== 'right-menu') &&
e.target.dataset.type !== 'right-menu'
) {
return;
}
let cateElement = this.findParentEl({dataType:"cate_container", element:e.target.parentElement ? e.target.parentElement : e.target});
if(!cateElement || !cateElement.dataset.id) {
return;
}
this.menuPosition.cateId = cateElement.dataset.id;
// 需要显示右键菜单
this.menuPosition.left = e.layerX;
this.menuPosition.top = e.layerY;
this.menuPosition.id = e.target.parentElement ? e.target.parentElement.dataset.id : e.target.dataset.id;
this.showMenu = true;
},
listener() {
// 监听右键菜单
window.addEventListener("contextmenu", this.handleEvent);
},
selectMenu(item) {
// // 移出分类
let {id, cateId} = this.menuPosition;
this.$emit('removeSoftFromCate', {
cate: {id:cateId},
soft: {id}
});
this.closeMenu();
},
closeMenu() {
this.showMenu = false;
this.menuPosition.left=0;
this.menuPosition.top=0;
},
closeEdit(index) {
let oldName = this.cateList[index].name;
let editName = this.editName.trim();
......@@ -106,20 +181,6 @@ export default {
}
this.centerDialogVisible = true;
},
add: function() {
this.list.push({ name: "Juan" });
},
replace: function() {
this.list = [{ name: "Edgard" }];
},
clone: function(el) {
return {
name: el.name + " cloned"
};
},
log: function(evt) {
window.console.log(evt);
}
}
}
</script>
......@@ -144,12 +205,20 @@ export default {
}
.dragbox_cate {
.dragbox_cate_name {
display: flex;
align-items: center;
padding-left: 25px;
font-size: 18px;
font-weight: 500;
color: #333333;
cursor: text;
user-select: none;
.dragbox_cate_edit {
cursor: pointer;
margin-left:6px;
width: 20px;
height: 20px;
}
}
.dragbox_cate_input /deep/.el-input__inner {
padding-left: 25px;
......@@ -159,6 +228,7 @@ export default {
border: none;
outline: none;
background-color: inherit;
border: 1px solid #C6D3EA;
}
.dragbox_cate_list {
display: flex;
......
<template>
<div class="item_wrap" @click="tapApp">
<div class="item_wrap" @click="tapApp" data-type="right-menu" :data-id="detail.id">
<img :src="src" alt="" class="item_img">
<span class="item_name">{{name}}</span>
</div>
......
......@@ -4,7 +4,7 @@
<div v-for="(cItem, cIndex) in cates" :key="cIndex"
@click="tapItem(cItem)"
class="right-menu-item">
加入 {{cItem.name}}
<span v-if="showText">加入 </span>{{cItem.name}}
</div>
</div>
<div v-if="visible" class="right-menu-mask" @click="closeMenu" data-type="closeMask"></div>
......@@ -40,6 +40,10 @@ export default {
visible: {
type: Boolean,
default: false,
},
showText: {
type: Boolean,
default: true,
}
},
methods: {
......
<template>
<el-container class="manage_container">
<el-aside width="200px" class="manage_aside">
<el-aside class="manage_aside" :class="{'minwidth':!expand}">
<div class="aside_top">
<!-- <div>开始</div> -->
<div class="aside_item" @click="openWin('system')">关于系统</div>
<div class="aside_item" @click="toggleExpand">
<img src="~@/assets//statr.png" alt="" class="icon_img">
<span v-if="expand">开始</span>
</div>
<!-- <div class="aside_item" @click="openWin('system')">关于系统</div>
<div class="aside_item" @click="openWin('settingCenter')">设置中心</div>
<div class="aside_item" @click="openWin('lockScreen')">锁屏</div>
<div class="aside_item" @click="openWin('restart')">重启</div>
<div class="aside_item" @click="openWin('shutdown')">关机</div>
<div class="aside_item" @click="openWin('shutdown')">关机</div> -->
</div>
<div class="aside_bottom">
<div class="aside_item" @click="changeTap('school')" :class="{ 'active': current === 'school' }">
<img v-if="current === 'school'" src="~@/assets/xueshimao_a.png" alt="" class="icon_img">
<img v-else src="~@/assets/xueshimao.png" alt="" class="icon_img">
学校应用</div>
<span v-if="expand">学校应用</span>
</div>
<div class="aside_item" @click="changeTap('all')" :class="{ 'active': current === 'all' }">
<img v-if="current === 'all'" src="~@/assets/alisis_a.png" alt="" class="icon_img">
<img v-else src="~@/assets/alisis.png" alt="" class="icon_img">
全部应用</div>
<span v-if="expand">全部应用</span>
</div>
<div class="aside_item" @click="changeTap('mine')" :class="{ 'active': current === 'mine' }">
<img v-if="current === 'mine'" src="~@/assets/user_a.png" alt="" class="icon_img">
<img v-else src="~@/assets/user.png" alt="" class="icon_img">
我的应用</div>
<span v-if="expand">我的应用</span>
</div>
</div>
</el-aside>
<el-main class="manage_main">
......@@ -34,7 +40,10 @@
<div>
<Appbox v-if="current === 'all'" :cateList="categoryList" :listObj="listObj" :listAll="appList" @softAddtoCate="softAddtoCate"></Appbox>
<SchoolBox v-if="current === 'school'"></SchoolBox>
<DragBox ref="dragEl" v-if="current === 'mine'" :cateList="categoryList" @addCategory="addCategory" @changeName="changeName"></DragBox>
<DragBox ref="dragEl" v-if="current === 'mine'" :cateList="categoryList"
@addCategory="addCategory" @changeName="changeName"
@removeSoftFromCate="removeSoftFromCate"
></DragBox>
</div>
</el-scrollbar>
</el-main>
......@@ -70,6 +79,8 @@ export default {
lastest:[],
},
categoryList:[],
minwidth:0,
expand:true,
};
},
computed: {
......@@ -109,6 +120,9 @@ export default {
},
methods: {
toggleExpand() {
this.expand = !this.expand;
},
changeName({name,detail,index}) {
// 修改分类名字
this.ipcRenderer.send("changeNameOfCategory",{name,detail,index});
......@@ -117,7 +131,12 @@ export default {
// 添加分类
this.ipcRenderer.send("addCategory",name);
},
removeSoftFromCate(args) {
// 从分类移出某个软件
this.ipcRenderer.send("removeSoftFromCate",args)
},
softAddtoCate(detail) {
// 软件添加到哪个分类
let { cate, soft } = detail;
console.log('软件添加到哪个分类', detail)
this.ipcRenderer.send("changeCategory", {
......@@ -156,7 +175,6 @@ export default {
});
this.ipcRenderer.on("change-category", (event, {detail,id}) => {
console.log("修改分类 2", detail,id);
// this.categoryList = list;
let curIndex = this.categoryList.findIndex(v => v.id == id);
this.categoryList[curIndex] = detail;
this.$message.success("加入成功");
......@@ -176,6 +194,14 @@ export default {
this.categoryList[curIndex].name = name;
this.$message.success("修改成功");
});
this.ipcRenderer.on("remove-soft", (event, {detail,id}) => {
console.log('移出成功', detail)
let curIndex = this.categoryList.findIndex(v => v.id == detail.id);
this.categoryList[curIndex] = detail;
this.$set(this.categoryList, curIndex, detail);
this.$message.success("移出成功");
});
},
changeTap(tabType) {
if(this.current === tabType) return;
......@@ -214,12 +240,17 @@ export default {
}
.manage_aside {
padding: 24px 0;
width: 148px;
width: 148px !important;
display: flex;
flex-direction: column;
justify-content: space-between;
background-color: #DBE4F6;
box-shadow: 2px 0px 4px 0px rgba(10,78,141,0.1);
transition: width 0.6s;
overflow-x: hidden;
&.minwidth {
width: 60px !important;
}
.aside_item {
cursor: pointer;
display: flex;
......@@ -234,6 +265,7 @@ export default {
line-height: 19px;
height: 48px;
line-height: 48px;
word-break: keep-all;
&.active,&:hover {
color: #399DF9;
background: rgba(57, 157, 249, 0.08);
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑!
请 注册 或者 后发表评论