2023-11-13-dist
This commit is contained in:
@@ -9,36 +9,38 @@
|
||||
@cancel="clearSetLabel"
|
||||
>
|
||||
<div class="setLabel_centent">
|
||||
<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">
|
||||
<a-checkbox v-model:checked="optionsItem.checkAll" @change="onCheckAllChange(optionsItem)"></a-checkbox>
|
||||
<span v-show="!optionsItem.openType">{{ optionsItem.classificationName }}</span>
|
||||
<span v-show="!optionsItem.openType" :title="optionsItem.classificationName">{{ optionsItem.classificationName }}</span>
|
||||
<input v-show="optionsItem.openType" type="text" v-model="itemName">
|
||||
<i v-show="optionsItem.openType" @click.stop="putName(index,'affirm',optionsItem)" class="fi fi-br-check"></i>
|
||||
<i v-show="optionsItem.openType" @click.stop="putName(optionsIndex,'affirm',optionsItem)" class="fi fi-br-check"></i>
|
||||
<i v-show="!optionsItem.openType" @click.stop="putName(optionsIndex,'put',optionsItem)" class="fi fi-rr-edit"></i>
|
||||
</div>
|
||||
|
||||
<ul class="childrenItem active" v-mousewheel>
|
||||
<li class="childrenItem_title setLabel_text" v-for="childrenItem,childrenIndex in optionsItem.childList" :key="childrenItem.id">
|
||||
<a-checkbox v-model:checked="childrenItem.checkAll" @change="onCheckAllchildrenItem(optionsItem)"></a-checkbox>
|
||||
<span v-show="!childrenItem.openType">{{ childrenItem.classificationName }}</span>
|
||||
<span v-show="!childrenItem.openType" :title="childrenItem.classificationName">{{ childrenItem.classificationName }}</span>
|
||||
<input v-show="childrenItem.openType" type="text" v-model="itemName">
|
||||
<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,'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 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" @click="newLabel(optionsItem,optionsItem.id)">+</div>
|
||||
<div class="addLabel" v-show="!optionsItem.addOpenType" @click="newLabel(optionsItem,optionsItem.id)">+</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<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" @click="newLabel('')">+</div>
|
||||
<div>
|
||||
<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 class="addLabel" v-show="!openType" @click="newLabel('','')">+</div>
|
||||
</div>
|
||||
<div class="started_btn" @click="removeLabel(options)">删除</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -299,19 +301,13 @@ export default defineComponent({
|
||||
max-height: 65rem;
|
||||
overflow-y: auto;
|
||||
// border-radius: ;
|
||||
position: relative;
|
||||
&.setLabel_centent::-webkit-scrollbar{display: none;}
|
||||
|
||||
&.active{
|
||||
overflow: hidden;
|
||||
}
|
||||
.started_btn{
|
||||
position: absolute;
|
||||
width: auto;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 999;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
ul{
|
||||
display: flex;
|
||||
li{
|
||||
@@ -328,6 +324,7 @@ export default defineComponent({
|
||||
width: 80%;
|
||||
background: rgba(0,0,0,0);
|
||||
}
|
||||
|
||||
}
|
||||
.setLabel_text{
|
||||
display: flex;
|
||||
@@ -335,25 +332,35 @@ export default defineComponent({
|
||||
align-items: center;
|
||||
padding: .5rem 1rem;
|
||||
width: 16rem;
|
||||
margin: 1rem 1rem;
|
||||
margin: 2rem 2rem;
|
||||
border-radius: 1rem;
|
||||
justify-content: space-between;
|
||||
flex-shrink: 0;
|
||||
font-size: 1.8rem;
|
||||
font-weight: 900;
|
||||
i{
|
||||
display: flex;
|
||||
}
|
||||
>span{
|
||||
max-width: 60%;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
.setLabel_text:hover{
|
||||
background: #efefef;
|
||||
}
|
||||
|
||||
}
|
||||
.optionsItem{
|
||||
flex-direction: column;
|
||||
|
||||
padding: 1rem;
|
||||
.optionsItem_title{
|
||||
margin-bottom: 1rem;
|
||||
margin-bottom: 2rem;
|
||||
border-radius: 1rem;
|
||||
align-items: flex-start;
|
||||
background-color: #f9f9f9;
|
||||
border: 0.1rem solid #ebebeb;
|
||||
// border-bottom: 2px solid rgba(0,0,0,.2);
|
||||
box-shadow: 0px 0px 5px 0px rgba(0,0,0,.3);
|
||||
>label{
|
||||
align-items: center;
|
||||
}
|
||||
@@ -361,7 +368,27 @@ export default defineComponent({
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
overflow-x: auto;
|
||||
padding-bottom: 2rem;
|
||||
// padding-bottom: 2rem;
|
||||
.setLabel_text{
|
||||
font-weight: 300;
|
||||
margin: 1rem 1rem;
|
||||
background: #f0f0f0;
|
||||
// background: #d5d5d5;
|
||||
font-size: 1.4rem;
|
||||
label{
|
||||
transform: scale(.8);
|
||||
}
|
||||
.fi-rr-edit{
|
||||
opacity: 0;
|
||||
transition: .3s all;
|
||||
}
|
||||
}
|
||||
.setLabel_text:hover{
|
||||
// background: #efefef;
|
||||
.fi-rr-edit{
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
&.active::-webkit-scrollbar-button:single-button{
|
||||
display: none;
|
||||
}
|
||||
@@ -401,8 +428,30 @@ export default defineComponent({
|
||||
&.optionsItem_title{
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
justify-content: space-around;
|
||||
border: none;
|
||||
background: none;
|
||||
position: sticky;
|
||||
background: #fff;
|
||||
border: none;
|
||||
>div{
|
||||
}
|
||||
.started_btn{
|
||||
width: auto;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 999;
|
||||
// margin-right: auto;
|
||||
}
|
||||
}
|
||||
div{
|
||||
>div{
|
||||
display: flex;
|
||||
width: 16rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.addLabel{
|
||||
border-radius: 50%;
|
||||
border: 1px solid #000;
|
||||
display: inline-block;
|
||||
|
||||
Reference in New Issue
Block a user