2023-11-9-2

This commit is contained in:
X1627315083
2023-11-09 16:55:20 +08:00
parent 897f61a3c9
commit 223984c10b
12 changed files with 166 additions and 96 deletions

View File

@@ -6,10 +6,10 @@
width="65%"
:maskClosable="false"
:centered="true"
@onCancel="clearSetLabel"
@cancel="clearSetLabel"
>
<div class="setLabel_centent">
<div @click="removeLabel(options)">删除</div>
<div class="started_btn" @click="removeLabel(options)">删除</div>
<ul class="optionsItem">
<li class="optionsItem_title" v-for="optionsItem,optionsIndex in options" :key="optionsItem.id">
<div class="setLabel_text">
@@ -28,17 +28,17 @@
<i v-show="childrenItem.openType" @click.stop="putName(index,'affirm',childrenItem)" class="fi fi-br-check"></i>
<i v-show="!childrenItem.openType" @click.stop="putName(childrenIndex,'put',childrenItem)" class="fi fi-rr-edit"></i>
</li>
<li @click="newLabel(optionsItem,optionsItem.id)" class="newLabel setLabel_text">
<li class="newLabel setLabel_text">
<input v-show="optionsItem.addOpenType" type="text" v-model="itemName">
<i @click.stop="putName(-1,'affirm',optionsItem)" v-show="optionsItem.addOpenType" class="fi fi-br-check"></i>
<div v-show="!optionsItem.addOpenType">+</div>
<div v-show="!optionsItem.addOpenType" @click="newLabel(optionsItem,optionsItem.id)">+</div>
</li>
</ul>
</li>
<li @click="newLabel('')" class="newLabel setLabel_text optionsItem_title">
<li class="newLabel setLabel_text optionsItem_title">
<input v-show="openType" type="text" v-model="itemName">
<i @click.stop="putName(-1,'affirm','')" v-show="openType" class="fi fi-br-check"></i>
<div v-show="!openType">+</div>
<div v-show="!openType" @click="newLabel('')">+</div>
</li>
</ul>
</div>
@@ -94,25 +94,21 @@ export default defineComponent({
directives:{
mousewheel:{
mounted (el) {
let bodyDom:any = document.getElementsByClassName('optionsItem')[0]
let bodyDom:any = document.getElementsByClassName('setLabel_centent')[0]
nextTick().then(()=>{
let dom:any = document.getElementsByClassName('childrenItem')
let domParent:any = document.getElementsByClassName('optionsItem_title')
let mouseover = ()=>{
let domParent:any = document.getElementsByClassName('childrenItem')
let mouseover = (event:any)=>{
event.stopPropagation()
bodyDom.classList.add('active')
}
let mouseleave = ()=>{
let mouseleave = (event:any)=>{
event.stopPropagation()
bodyDom.classList.remove('active')
}
// domParent?.forEach((item:any) => {
// item.addEventListener('mouseover',mouseover)
// item.addEventListener('mouseleave',mouseleave)
// });
for (let index = 0; index < domParent.length; index++) {
domParent[index].addEventListener('mouseover',mouseover)
domParent[index].addEventListener('mouseover',mouseleave)
domParent[index].addEventListener('mouseover',mouseover,false)
domParent[index].addEventListener('mouseleave',mouseleave,false)
}
el.addEventListener('wheel',(e:WheelEvent)=>{
let num = 0
if(e.deltaY > 0){
@@ -139,8 +135,9 @@ export default defineComponent({
this.options = data
},
clearSetLabel(){
this.setLabelShow = false
this.clearOpenType()
let parent:any = this.$parent
parent.getClass()
},
onCheckAllChange(value:any){
if(value?.childList){
@@ -219,28 +216,26 @@ export default defineComponent({
}
},
removeLabel(val:any){
let data:any = []
let data = {
"classificationIdList": [],
"deleteConfirm": 0,
}
let classificationIdList:any = []
this.clearOpenType()
val.forEach((optionsItem:any) => {
if(optionsItem.checkAll){
data.push(optionsItem)
classificationIdList.push(optionsItem.id)
}else{
if(optionsItem.childList){
let boor = false
let dataChild:any = []
optionsItem.childList.forEach((childrenItem:any) => {
if(childrenItem.checkAll){
boor = true
dataChild.push(childrenItem)
classificationIdList.push(childrenItem.id)
}
});
if(boor){
optionsItem.childList = dataChild
data.push(optionsItem)
}
}
}
});
data.classificationIdList = classificationIdList
this.deleteClass(data)
},
addLabel(val:any){
@@ -255,7 +250,6 @@ export default defineComponent({
Https.axiosPost(Https.httpUrls.saveOrUpdate, data).then(
(rv: any) => {
console.log(rv);
this.getClass()
}
).catch((res)=>{
@@ -264,7 +258,7 @@ export default defineComponent({
deleteClass(data:any){
Https.axiosPost(Https.httpUrls.classificationDelete, data).then(
(rv: any) => {
console.log(rv);
this.getClass()
}
).catch((res)=>{
});
@@ -273,8 +267,6 @@ export default defineComponent({
let data = this.setLabelData()
Https.axiosPost(Https.httpUrls.queryClassification, data).then(
(rv: any) => {
console.log(rv);
this.options = rv
}
).catch((res)=>{
@@ -307,6 +299,17 @@ export default defineComponent({
max-height: 65rem;
overflow-y: auto;
// border-radius: ;
&.active{
overflow: hidden;
}
.started_btn{
position: absolute;
width: auto;
position: sticky;
top: 0;
z-index: 999;
margin-right: auto;
}
ul{
display: flex;
li{
@@ -328,21 +331,27 @@ export default defineComponent({
display: flex;
flex-direction: row;
align-items: center;
margin: 0 2rem;
width: 12rem;
padding: .5rem 1rem;
width: 16rem;
margin: 1rem 1rem;
border-radius: 1rem;
justify-content: space-between;
flex-shrink: 0;
i{
display: flex;
}
}
.setLabel_text:hover{
background: #efefef;
}
}
.optionsItem{
flex-direction: column;
&.active{
overflow: hidden;
}
>li{
.optionsItem_title{
margin-bottom: 1rem;
border-radius: 1rem;
// border-bottom: 2px solid rgba(0,0,0,.2);
>label{
align-items: center;
}
@@ -350,8 +359,7 @@ export default defineComponent({
max-width: 100%;
overflow: hidden;
overflow-x: auto;
height: 7rem;
margin: 2rem 0;
padding-bottom: 2rem;
&.active::-webkit-scrollbar-button:single-button{
display: none;
}
@@ -388,8 +396,10 @@ export default defineComponent({
.newLabel{
text-align: center;
justify-content: center;
cursor: pointer;
&.optionsItem_title{
width: 100%;
margin: 0;
}
div{
border-radius: 50%;
border: 1px solid #000;
@@ -398,6 +408,7 @@ export default defineComponent({
height: 2rem;
line-height: 2rem;
text-align: center;
cursor: pointer;
}
i{
cursor: pointer;