commit
This commit is contained in:
@@ -131,15 +131,15 @@
|
||||
User
|
||||
</div>
|
||||
</div>
|
||||
<div class="model_img" v-show="systemSeleves">
|
||||
<div v-mousewheel>
|
||||
<div class="model_img" v-show="systemSeleves" v-mousewheel>
|
||||
<div class="model_img_item">
|
||||
<div v-for="(item,index) in mannequins?.[0]?.modelList" :key="item.id">
|
||||
<img :src="item?.presignedUrl" alt="" @click="setMannequins(item,'Library')">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="model_img" v-show="!systemSeleves">
|
||||
<div v-mousewheel>
|
||||
<div class="model_img" v-show="!systemSeleves" v-mousewheel>
|
||||
<div class="model_img_item">
|
||||
<div v-for="(item,index) in mannequins?.[1]?.modelList" :key="item.id">
|
||||
<img :src="item?.presignedUrl" alt="" @click="setMannequins(item,'System')">
|
||||
</div>
|
||||
@@ -286,33 +286,14 @@ export default defineComponent({
|
||||
},
|
||||
mousewheel:{
|
||||
mounted (el) {
|
||||
let parent = el.parentNode
|
||||
// el.style.width='100%'
|
||||
// el.style.height='100%'
|
||||
let num = 0
|
||||
let width = el.offsetWidth
|
||||
let parentWidth = parent.offsetWidth
|
||||
|
||||
el.addEventListener('mouseover',()=>{
|
||||
width = el.offsetWidth
|
||||
parentWidth = parent.offsetWidth
|
||||
})
|
||||
el.addEventListener('mousewheel',(e:MouseEvent)=>{
|
||||
|
||||
if(0>(e as WheelEvent).deltaY && width>parentWidth){
|
||||
num+=15
|
||||
if(num >= 0){
|
||||
num = 0
|
||||
}
|
||||
}else if(0<(e as WheelEvent).deltaY && width>parentWidth){
|
||||
num-=15
|
||||
if(num<=parentWidth - width){
|
||||
num = parentWidth - width
|
||||
}
|
||||
|
||||
el.addEventListener('wheel',(e:WheelEvent)=>{
|
||||
let num = 0
|
||||
if(e.deltaY > 0){
|
||||
num = 25
|
||||
}else{
|
||||
num = -25
|
||||
}
|
||||
|
||||
el.style.marginLeft = num+'px'
|
||||
el.scrollBy(num, 0);
|
||||
})
|
||||
}
|
||||
}
|
||||
@@ -867,6 +848,34 @@ export default defineComponent({
|
||||
display: flex;
|
||||
flex: 1;
|
||||
align-items: center;
|
||||
overflow-x: auto;
|
||||
&.model_img::-webkit-scrollbar {
|
||||
/* 竖轴的宽度 */
|
||||
width: 1rem;
|
||||
/* 横轴的高度 */
|
||||
height: 1rem;
|
||||
transition: all .3s;
|
||||
}
|
||||
/* 进度 */
|
||||
&.model_img::-webkit-scrollbar-thumb {
|
||||
border-radius: 1rem;
|
||||
background: rgba(238, 238, 244, 0);
|
||||
}
|
||||
/* 轨道 */
|
||||
&.model_img::-webkit-scrollbar-track {
|
||||
border-radius: 1rem;
|
||||
background: rgba(238, 238, 244, 0);
|
||||
}
|
||||
&.model_img:hover {
|
||||
// overflow-x: scroll;
|
||||
&.model_img::-webkit-scrollbar-thumb {
|
||||
background: #543087;
|
||||
}
|
||||
/* 轨道 */
|
||||
&.model_img::-webkit-scrollbar-track {
|
||||
background: rgba(84, 48, 135,.2);
|
||||
}
|
||||
}
|
||||
>div{
|
||||
display: flex;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user