lead stage change in campaign

src/Http/Controllers/CampaignController.php

@@ -85,6 +85,7 @@ public function show(Campaign $campaign)
             'leads' => [
                 'syncTags' => route('teamtnt.sales-management.leads.sync-tags', ':leadId'),
                 'leadData' => route('teamtnt.sales-management.lead.data', [$campaign, ':leadId']),
+                'leadStageChange' => route('teamtnt.sales-management.lead.stage.change', [$campaign, ':leadId']),
             ],
             'messages' => [
                 'send' => route('teamtnt.sales-management.send.message', [$campaign, ':leadId']),

src/Http/Controllers/LeadsController.php

@@ -60,4 +60,16 @@ public function getLeadData(Campaign $campaign, Lead $lead)
         ]);
     }
 
+    public function leadStageChange(Campaign $campaign, Lead $lead, Request $request)
+    {
+        if (!$lead) {
+            return response()->json(404);
+        }
+
+        $lead->pipeline_stage_id = request('stage_id');
+        $lead->save();
+
+        return response()->json(200);
+    }
+
 }

src/resources/js/components/Lead/LeadCampaign.vue

@@ -40,7 +40,8 @@ const props = defineProps({
 
 const data = reactive({
     route: props.routes,
-    emails: props.emails
+    emails: props.emails,
+    stages: props.stages
 });
 
 provide('data', data);

src/resources/js/components/Lead/OffCanvas.vue

@@ -145,6 +145,18 @@
                          </dd>
 
                     </dl>
+                     <div class="mb-4">
+                        <span class="d-flex fw-bold align-items-center mb-1">
+                            <i class="align-middle me-2 fas fa-fw fa-random"></i>
+                            {{ $t('Stages') }}
+                        </span>
+                         <regular-select
+                             :model-id="lead.id"
+                             :options="data.stages"
+                             :selected-option="lead.pipeline_stage_id"
+                             transform-options/>
+                    </div>
+                     <hr>
                     <div class="mb-4">
                         <span class="d-flex fw-bold align-items-center mb-2">
                             <svg class="me-2" width="18" height="18" viewBox="0 0 24 24" fill="currentColor">
@@ -252,6 +264,7 @@ import Notes from "../Notes/Notes.vue";
 import Activities from "../Notes/Activities.vue";
 import MultiSelectList from "../MultiSelectList/MultiSelectList.vue";
 import SendEmailForm from "./SendEmailForm.vue";
+import RegularSelect from "../RegularSelect/RegularSelect.vue";
 
 const props = defineProps({
     modelValue: {

src/resources/js/components/RegularSelect/RegularSelect.vue

@@ -0,0 +1,75 @@
+<template>
+  <div class="form-group mb-3">
+    <label for="stage-select-select">Move Lead to stage:</label>
+    <select id="stage-select" class="form-select mt-2" v-model="selectedOption" @change="handleChange">
+      <option value="" disabled>Select an option</option>
+      <option v-for="option in transformOptions" :key="option.id" :value="option.id">
+        {{ option.name }}
+      </option>
+    </select>
+  </div>
+</template>
+
+<script setup>
+import { computed, ref, inject } from 'vue'
+import { useI18n } from "vue-i18n";
+
+const props = defineProps({
+    modelId: {
+        type: Number,
+        required: false
+    },
+    options: {
+        type: Array,
+        required: true
+    },
+    transformOptions: {
+        type: Boolean,
+        required: false
+    },
+    selectedOption: {
+        type: Number,
+        required: false
+    }
+})
+
+const data = inject('data')
+const selectedOption = ref(props.selectedOption)
+const { t } = useI18n();
+
+const transformOptions = computed(() => {
+    if(props.transformOptions) {
+        return props.options.map((option) => {
+            return {
+                id: option.id,
+                name: option.name
+            }
+        })
+    }
+
+    return props.options
+})
+
+const handleChange = async () => {
+    if (selectedOption.value) {
+        try {
+            const response = await axios.post(data.route.leads.leadStageChange.replace(':leadId',props.modelId),{
+                stage_id: selectedOption.value
+            })
+
+            if (response.status === 200) {
+                window.notyf.open({
+                    type: "success",
+                    message: t("Lead moved to another stage!"),
+                    duration: "2500",
+                    ripple: true,
+                    position: "bottom right",
+                    dismissible: true,
+                });
+            }
+        } catch (error) {
+            console.error('Error fetching data:', error)
+        }
+    }
+}
+</script>

src/resources/lang/de.json

@@ -44,5 +44,7 @@
     "Message": "Nachricht",
     "Send Message": "Nachricht senden",
     "Leads": "Leads",
-    "Create New List": "Neue Liste erstellen"
+    "Create New List": "Neue Liste erstellen",
+    "Stages": "Stages",
+    "Lead moved to another stage!": "Lead in neue Stage verschoben!"
 }

src/resources/views/campaign/show.blade.php

@@ -37,7 +37,6 @@
                 </a>
             @endcan
         </div>
-
         <lead-campaign
             :campaign="{{ $campaign }}"
             :initial-leads="{{ json_encode($initialLeads) }}"

src/routes/web.php

@@ -119,6 +119,7 @@
 
     Route::get('/campaign/{campaign}/pipeline/{pipelineID}/stage/{stageID}/search', [SearchController::class, 'search']);
     Route::get('/campaign/{campaign}/lead/{lead}', [LeadsController::class, 'getLeadData'])->name('lead.data');
+    Route::post('/campaign/{campaign}/lead/{lead}/stage-change', [LeadsController::class, 'leadStageChange'])->name('lead.stage.change');
 
 });