fixbug

components/common/button/ActionButtons.vue

@@ -1,21 +1,8 @@
 <template>
 	<div class="d-flex flex-row justify-center align-center" style="gap: 12px">
-		<!--<v-btn icon tile :ripple="false" @click="btnActionsFnc('addLeftToRight')">
-			<v-icon>mdi-chevron-right</v-icon>
-		</v-btn> -->
-		<a-button @click="btnActionsFnc('removeRightToLeft')" type="primary" ghost icon="up" >
+		<a-button @click="btnActionsFnc('removeRightToLeft')" type="primary" ghost :icon="icons.remove" >
 		</a-button>
-
-		<!--<v-btn
-			icon
-			tile
-			:ripple="false"
-			class="mt-2"
-			@click="btnActionsFnc('removeRightToLeft')"
-		>
-			<v-icon>mdi-chevron-left</v-icon>
-		</v-btn> -->
-		<a-button   @click="btnActionsFnc('addLeftToRight')" type="primary" ghost icon="down">
+		<a-button   @click="btnActionsFnc('addLeftToRight')" type="primary" ghost :icon="icons.add">
 		</a-button>
 	</div>
 </template>
@@ -38,8 +25,18 @@ export default {
 			type: Function,
 			required: true,
 		},
+		directionBtn: {
+			type: String,
+			default: "horizontally" //horizontally, vertically.
+		}
+	},
+	computed: {
+		icons() {
+			return this.directionBtn === "vertically"
+				? { remove: "up", add: "down" }
+				: { remove: "left", add: "right" };
+			},
 	},
-	computed: {},
 	data() {
 		return {};
 	},