From 0c14d7ecf80adc16fd72c2a366e56e5139a2fce6 Mon Sep 17 00:00:00 2001
From: luNunezProcessmaker <luciana.nunez@processmaker.com>
Date: Fri, 17 Nov 2023 12:35:30 -0400
Subject: [PATCH 1/6] feature/FOUR-12430

---
 .../scripts/components/CreateScriptModal.vue  | 132 +++++++++++++-----
 1 file changed, 96 insertions(+), 36 deletions(-)

diff --git a/resources/js/processes/scripts/components/CreateScriptModal.vue b/resources/js/processes/scripts/components/CreateScriptModal.vue
index cea0712564..774e91eda6 100644
--- a/resources/js/processes/scripts/components/CreateScriptModal.vue
+++ b/resources/js/processes/scripts/components/CreateScriptModal.vue
@@ -120,57 +120,102 @@
                 name="run_as_user_id"
               />
             </b-form-group>
-            <slider-with-input
-              :description="
-                $t(
-                  'How many seconds the script should be allowed to run (0 is unlimited).'
-                )
-              "
+            <b-form-group
+              class="form-group-border"
+              :invalid-feedback="errorMessage('timeout', addError)"
               :error="
                 errorState('timeout', addError)
                   ? null
                   : errorMessage('timeout', addError)
               "
-              :label="$t('Timeout')"
-              :max="300"
-              :min="0"
-              :value="timeout"
-              @input="timeout = $event"
-            />
-            <slider-with-input
-              :description="
-                $t(
-                  'Number of times to retry. Leave empty to use script default. Set to 0 for no retry attempts.'
-                )
-              "
+            >
+              <div class="d-flex d-flex justify-content-between align-items-center mb-3">
+                <div class="label-description">
+                  <label
+                    class="label-number"
+                    for="inputTimeout"
+                  >
+                    {{ $t('Timeout') }}
+                  </label>
+                  <p class="text-muted m-0">
+                    {{ $t('How many seconds the script should be allowed to run (0 is unlimited).') }}
+                  </p>
+                </div>
+                <b-form-input
+                  id="inputTimeout"
+                  v-model="timeout"
+                  class="input-number"
+                  type="number"
+                  :max="300"
+                  :min="0"
+                  name="timeout"
+                />
+              </div>
+            </b-form-group>
+            <b-form-group
+              class="form-group-border"
+              :invalid-feedback="errorMessage('retry_attempts', addError)"
               :error="
                 errorState('retry_attempts', addError)
                   ? null
                   : errorMessage('retry_attempts', addError)
               "
-              :label="$t('Retry Attempts')"
-              :max="10"
-              :min="0"
-              :value="retry_attempts"
-              @input="retry_attempts = $event"
-            />
-            <slider-with-input
-              :description="
-                $t(
-                  'Seconds to wait before retrying. Leave empty to use script default. Set to 0 for no retry wait time.'
-                )
-              "
+            >
+              <div class="d-flex d-flex justify-content-between align-items-center mb-3">
+                <div class="label-description">
+                  <label
+                    class="label-number"
+                    for="inputRetryAttempts"
+                  >
+                    {{ $t('Retry Attempts') }}
+                  </label>
+                  <p class="text-muted m-0">
+                    {{ $t('Number of times to retry. Leave empty to use script default. Set to 0 for no retry attempts.') }}
+                  </p>
+                </div>
+                <b-form-input
+                  id="inputRetryAttempts"
+                  v-model="retry_attempts"
+                  class="input-number"
+                  type="number"
+                  :max="10"
+                  :min="0"
+                  name="retry_attempts"
+                />
+              </div>
+            </b-form-group>
+            <b-form-group
+              class="form-group-border"
+              :invalid-feedback="errorMessage('retry_wait_time', addError)"
               :error="
                 errorState('retry_wait_time', addError)
                   ? null
                   : errorMessage('retry_wait_time', addError)
               "
-              :label="$t('Retry Wait Time')"
-              :max="3600"
-              :min="0"
-              :value="retry_wait_time"
-              @input="retry_wait_time = $event"
-            />
+            >
+              <div class="d-flex d-flex justify-content-between align-items-center mb-3">
+                <div class="label-description">
+                  <label
+                    class="label-number"
+                    for="inputRetryWaitTime"
+                  >
+                    {{ $t('Retry Wait Time') }}
+                  </label>
+                  <p class="text-muted m-0">
+                    {{ $t('Seconds to wait before retrying. Leave empty to use script default. Set to 0 for no retry wait time.') }}
+                  </p>
+                </div>
+                <b-form-input
+                  id="inputRetryWaitTime"
+                  v-model="retry_wait_time"
+                  class="input-number"
+                  type="number"
+                  :max="3600"
+                  :min="0"
+                  name="retry_wait_time"
+                />
+              </div>
+            </b-form-group>
             <component
               :is="cmp"
               v-for="(cmp, index) in createScriptHooks"
@@ -369,3 +414,18 @@ export default {
   },
 };
 </script>
+
+<style scoped>
+  .label-description {
+    width: 80%;
+  }
+  .input-number {
+    width: 15%;
+  }
+  .label-number {
+    font-weight: 600;
+  }
+  .form-group-border{
+    border-bottom: 1px solid #CDDDEE;
+  }
+</style>

From 0a12b7764802c08256471e5dc72fbd06ca8e8957 Mon Sep 17 00:00:00 2001
From: luNunezProcessmaker <luciana.nunez@processmaker.com>
Date: Fri, 17 Nov 2023 12:55:33 -0400
Subject: [PATCH 2/6] feature/FOUR-12430

---
 .../scripts/components/CreateScriptModal.vue  | 51 +++++--------------
 1 file changed, 14 insertions(+), 37 deletions(-)

diff --git a/resources/js/processes/scripts/components/CreateScriptModal.vue b/resources/js/processes/scripts/components/CreateScriptModal.vue
index 519258920a..fcad5bfbd6 100644
--- a/resources/js/processes/scripts/components/CreateScriptModal.vue
+++ b/resources/js/processes/scripts/components/CreateScriptModal.vue
@@ -62,15 +62,6 @@
                 rows="2"
               />
             </b-form-group>
-            <category-select
-              v-show="!projectAsset"
-              v-model="script_category_id"
-              :errors="addError.script_category_id"
-              :label="$t('Category')"
-              api-get="script_categories"
-              api-list="script_categories"
-              name="script_category_id"
-            />
             <project-select
               v-if="isProjectsInstalled"
               v-model="projects"
@@ -82,25 +73,18 @@
               name="project"
               :project-id="projectId"
             />
-            <b-form-group
-              :invalid-feedback="errorMessage('script_executor_id', addError)"
-              :label="$t('Language')"
-              :state="errorState('script_executor_id', addError)"
-              :disabled="copyAssetMode"
-              required
-            >
-              <b-form-select
-                v-model="script_executor_id"
-                :options="scriptExecutors"
-                :state="errorState('script_executor_id', addError)"
-                :disabled="copyAssetMode"
-                name="script_executor_id"
-                required
-              />
-            </b-form-group>
+            <category-select
+              v-show="!projectAsset"
+              v-model="script_category_id"
+              :errors="addError.script_category_id"
+              :label="$t('Category')"
+              api-get="script_categories"
+              api-list="script_categories"
+              name="script_category_id"
+            />
             <div class="d-flex justify-content-end w-100">
               <button
-                class="btn btn-link text-capitalize collapsed"
+                class="btn btn-link text-capitalize weight-600 collapsed"
                 type="button"
                 data-toggle="collapse"
                 data-target="#collapseAdvancedOptions"
@@ -122,13 +106,6 @@
               class="collapse"
             >
               <b-form-group
-                :description="
-                  formDescription(
-                    'Select a user to set the API access of the Script',
-                    'run_as_user_id',
-                    addError
-                  )
-                "
                 :invalid-feedback="errorMessage('run_as_user_id', addError)"
                 :label="$t('Run script as')"
                 :state="errorState('run_as_user_id', addError)"
@@ -155,7 +132,7 @@
                 <div class="d-flex d-flex justify-content-between align-items-center mb-3">
                   <div class="label-description">
                     <label
-                      class="label-number"
+                      class="weight-600"
                       for="inputTimeout"
                     >
                       {{ $t('Timeout') }}
@@ -187,7 +164,7 @@
                 <div class="d-flex d-flex justify-content-between align-items-center mb-3">
                   <div class="label-description">
                     <label
-                      class="label-number"
+                      class="weight-600"
                       for="inputRetryAttempts"
                     >
                       {{ $t('Retry Attempts') }}
@@ -219,7 +196,7 @@
                 <div class="d-flex d-flex justify-content-between align-items-center mb-3">
                   <div class="label-description">
                     <label
-                      class="label-number"
+                      class="weight-600"
                       for="inputRetryWaitTime"
                     >
                       {{ $t('Retry Wait Time') }}
@@ -446,7 +423,7 @@ export default {
   .input-number {
     width: 15%;
   }
-  .label-number {
+  .weight-600{
     font-weight: 600;
   }
   .form-group-border{

From 47fbcded64855cd763bf2c167532408cdef3e0a9 Mon Sep 17 00:00:00 2001
From: luNunezProcessmaker <luciana.nunez@processmaker.com>
Date: Fri, 17 Nov 2023 14:52:52 -0400
Subject: [PATCH 3/6] feature/FOUR-12430

---
 .../scripts/components/CreateScriptModal.vue     | 16 +++++++++++-----
 1 file changed, 11 insertions(+), 5 deletions(-)

diff --git a/resources/js/processes/scripts/components/CreateScriptModal.vue b/resources/js/processes/scripts/components/CreateScriptModal.vue
index fcad5bfbd6..8c5a7ff6c8 100644
--- a/resources/js/processes/scripts/components/CreateScriptModal.vue
+++ b/resources/js/processes/scripts/components/CreateScriptModal.vue
@@ -9,14 +9,12 @@
     >
       <i class="fas fa-plus" /> {{ $t("Script") }}
     </b-button>
-    <modal
+    <b-modal
       id="createScript"
       size="xl"
       scrollable
       :ok-disabled="disabled"
       :title="modalSetUp"
-      @hidden="onClose"
-      @ok.prevent="onSubmit"
     >
       <b-row>
         <b-col cols="4">
@@ -24,7 +22,6 @@
         </b-col>
         <b-col cols="8">
           <template v-if="countCategories">
-            <required />
             <b-form-group
               :description="
                 formDescription(
@@ -236,7 +233,16 @@
           </template>
         </b-col>
       </b-row>
-    </modal>
+      <div slot="modal-footer" class="w-100 m-0 d-flex d-flex align-items-center">
+        <required />
+        <button type="button" class="btn btn-outline-secondary ml-auto" @click="onClose">
+          {{ $t('Cancel') }}
+        </button>
+        <button type="button" class="btn btn-secondary ml-3" @click="onSubmit">
+          {{ $t('Save') }}
+        </button>
+      </div>
+    </b-modal>
   </div>
 </template>
 

From 8a3e42a5cf9fb06878c79612c9645adb7753433f Mon Sep 17 00:00:00 2001
From: luNunezProcessmaker
 <123644082+luNunezProcessmaker@users.noreply.github.com>
Date: Fri, 17 Nov 2023 20:37:59 +0000
Subject: [PATCH 4/6] feature/FOUR-12430

---
 resources/js/processes/scripts/components/CreateScriptModal.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/resources/js/processes/scripts/components/CreateScriptModal.vue b/resources/js/processes/scripts/components/CreateScriptModal.vue
index 8c5a7ff6c8..aa3a437a52 100644
--- a/resources/js/processes/scripts/components/CreateScriptModal.vue
+++ b/resources/js/processes/scripts/components/CreateScriptModal.vue
@@ -13,6 +13,7 @@
       id="createScript"
       size="xl"
       scrollable
+      centered
       :ok-disabled="disabled"
       :title="modalSetUp"
     >

From 4fede8f6e89df8eec63b68d9d93bc92f6132ed3b Mon Sep 17 00:00:00 2001
From: luNunezProcessmaker <luciana.nunez@processmaker.com>
Date: Fri, 17 Nov 2023 16:49:34 -0400
Subject: [PATCH 5/6] feature/FOUR-12430

---
 .../scripts/components/CreateScriptModal.vue          | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/resources/js/processes/scripts/components/CreateScriptModal.vue b/resources/js/processes/scripts/components/CreateScriptModal.vue
index aa3a437a52..398955c6c8 100644
--- a/resources/js/processes/scripts/components/CreateScriptModal.vue
+++ b/resources/js/processes/scripts/components/CreateScriptModal.vue
@@ -21,7 +21,10 @@
         <b-col cols="4">
           <!-- TODO -->
         </b-col>
-        <b-col cols="8">
+        <b-col
+          cols="8"
+          class="script-form"
+        >
           <template v-if="countCategories">
             <b-form-group
               :description="
@@ -440,4 +443,10 @@ export default {
   :not(.collapsed) > .closed {
       display: none;
   }
+  .script-form {
+    overflow-y: scroll;
+    display: block;
+    height: 100%;
+    max-height: 470px;
+  }
 </style>

From b6c3cb3a03cb82169f58d1112e340511aabb70ca Mon Sep 17 00:00:00 2001
From: luNunezProcessmaker <luciana.nunez@processmaker.com>
Date: Mon, 20 Nov 2023 10:49:05 -0400
Subject: [PATCH 6/6] feature/FOUR-12430

---
 .../js/processes/scripts/components/CreateScriptModal.vue      | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/resources/js/processes/scripts/components/CreateScriptModal.vue b/resources/js/processes/scripts/components/CreateScriptModal.vue
index 398955c6c8..6860ec97ea 100644
--- a/resources/js/processes/scripts/components/CreateScriptModal.vue
+++ b/resources/js/processes/scripts/components/CreateScriptModal.vue
@@ -444,9 +444,8 @@ export default {
       display: none;
   }
   .script-form {
-    overflow-y: scroll;
     display: block;
     height: 100%;
-    max-height: 470px;
+    max-height: 446px;
   }
 </style>