<draggable
v-model="product.images"
v-bind="dragOptions"
@start="drag = true"
@end="drag = false">
<transition-group
class="row small-gutter"
type="transition"
:name="!drag ? 'flip-list' : null">
<div class="col" v-for="(image, index) in product.images" :key="index + 0">
<div class="pc-image draggable" :class="{ 'is-loading': image === '' }">
<div class="img" :style="{ backgroundImage: `url('${image}')` }"></div>
<i class="material-icons" v-tooltip="'Remove'" @click="removeProductImages(index)">close</i>
</div>
</div>
</transition-group>
</draggable>