|
|
@ -2,7 +2,7 @@ |
|
|
|
<div class="payment-wrap"> |
|
|
|
<draggable v-model="list" @start="drag=true" @end="onEnd" :move="checkMove" handle=".drag-handle" > |
|
|
|
<div class="payment-item" v-for="(item, index) in list" :key="item.name"> |
|
|
|
<dl :class="index === list.length - 1 ? '' : 'drag-handle'"> |
|
|
|
<dl :class="index === list.length - 1 && item.pay_type === 1 ? '' : 'drag-handle'"> |
|
|
|
<img v-if="item.pay_type === 0" src="@/assets/register/taobao.svg" alt=""> |
|
|
|
<img v-if="item.pay_type === 1" src="@/assets/register/card_pay.png" alt=""> |
|
|
|
<img v-if="item.pay_type === 2" src="@/assets/register/weixin.svg" alt=""> |
|
|
@ -56,10 +56,11 @@ export default { |
|
|
|
checkMove(evt) { |
|
|
|
// 获取将要移动到的位置索引 |
|
|
|
const targetIndex = this.list.length - 1; // 最后一项的索引是列表长度减1 |
|
|
|
// 如果当前拖拽项即将移动到最后一项,则不允许移动 |
|
|
|
// console.log(evt.relatedContext.index === evt.draggedContext.index,targetIndex === evt.draggedContext.index,'0000targetIndex00'); |
|
|
|
if ((evt.relatedContext.index === targetIndex) || (targetIndex === evt.draggedContext.index)) { |
|
|
|
return false; // 不允许移动到最后一项 |
|
|
|
if(evt.draggedContext.index == targetIndex && evt.draggedContext.element.pay_type == 1) { |
|
|
|
return false;//检测卡不允许移动 |
|
|
|
} |
|
|
|
if (evt.relatedContext.index === targetIndex && this.list[targetIndex].pay_type == 1) { |
|
|
|
return false;//最后一项是检测卡 不允许移动到最后一项 |
|
|
|
} |
|
|
|
return true; // 其他情况允许移动 |
|
|
|
} |
|
|
|