Commit 406c0c09 authored by yaya's avatar yaya

feat:图片拖拽功能优化

parent 35bfbed2
...@@ -38,16 +38,20 @@ ...@@ -38,16 +38,20 @@
<Draggable <Draggable
v-model="imageList" v-model="imageList"
class="flex f-fw-w img__wrapper" class="flex f-fw-w img__wrapper"
handle=".gallery" handle=".item_content"
anmition="500" anmition="500"
delay="20"> delay="20"
@end="onMove">
<div v-for="(item, index) in imageList" :key="item + index" class="select_item"> <div v-for="(item, index) in imageList" :key="item + index" class="select_item">
<div class="item_content">
<img :src="item" class="gallery" @click="handleShowLargeDialog(item)"> <img :src="item" class="gallery" @click="handleShowLargeDialog(item)">
<div class="edit" @click="handlerChangeImage(item)">编辑</div> <div class="edit" @click="handlerChangeImage(item)">编辑</div>
<div v-if="imageList.length > 0" class="set" @click="handlerSetMainImage(item, index)"> <div v-if="imageList.length > 0" class="set" @click="handlerSetMainImage(item, index)">
{{ imageMainPosition === index ? '主图' : '设为主图' }} {{ imageMainPosition === index ? '主图' : '设为主图' }}
</div> </div>
</div> </div>
</div>
</Draggable> </Draggable>
</div> </div>
...@@ -283,6 +287,9 @@ export default { ...@@ -283,6 +287,9 @@ export default {
window.addEventListener('scroll', this.handleScroll) window.addEventListener('scroll', this.handleScroll)
}, },
methods: { methods: {
onMove(e) {
this.imageMainPosition = this.imageList.indexOf(this.goodsParams.topImage)
},
limitInput(value, type) { limitInput(value, type) {
const newValue = ('' + value) // 第一步:转成字符串 const newValue = ('' + value) // 第一步:转成字符串
.replace(/[^\d^\.]+/g, '') // 第二步:把不是数字,不是小数点的过滤掉 .replace(/[^\d^\.]+/g, '') // 第二步:把不是数字,不是小数点的过滤掉
...@@ -734,7 +741,7 @@ export default { ...@@ -734,7 +741,7 @@ export default {
.list { .list {
margin-top: 10px; margin-top: 10px;
.select_item { .item_content {
width: 100px; width: 100px;
height: 100px; height: 100px;
position: relative; position: relative;
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment