Skip modal to create record

area17 · Jul 15, 2020 · 1ec1f42 · 1ec1f42
1 parent 687ad5f
commit 1ec1f42
Show file tree

Hide file tree

Showing 7 changed files with 102 additions and 11 deletions.
diff --git a/frontend/js/components/TitleEditor.vue b/frontend/js/components/TitleEditor.vue
@@ -7,9 +7,10 @@
         </a>
         <span v-else>{{ customTitle ? customTitle : title }}</span>
       </h2>
-      <a v-if="permalink || customPermalink" :href="fullUrl" target="_blank" class="titleEditor__permalink f--small">
+      <a v-if="(permalink || customPermalink) && !showModal" :href="fullUrl" target="_blank" class="titleEditor__permalink f--small">
         <span class="f--note f--external f--underlined--o">{{ visibleUrl | prettierUrl }}</span>
       </a>
+      <span v-if="showModal" class="f--note f--external f--underlined--o">{{ visibleUrl | prettierUrl }}</span>
 
       <!-- Editing modal -->
       <a17-modal class="modal--form" ref="editModal" :title="modalTitle" :forceLock="disabled">
@@ -51,6 +52,10 @@
         type: String,
         default: 'Missing title'
       },
+      showModal: {
+        type: Boolean,
+        default: false
+      },
       name: {
         default: 'title'
       },
@@ -72,13 +77,17 @@
         disabled: false
       }
     },
+    mounted: function () {
+      this.showModal && this.$refs.editModal.open()
+    },
     computed: {
       titleEditorClasses: function () {
         return {
           'titleEditor--error': this.error || (this.title === this.warningMessage)
         }
       },
       mode: function () {
+        if (this.showModal) return 'done'
         return this.title.length > 0 ? 'update' : 'create'
       },
       fullUrl: function () {

diff --git a/frontend/js/components/modals/ModalValidationButtons.vue b/frontend/js/components/modals/ModalValidationButtons.vue
@@ -5,7 +5,8 @@
         <a17-button type="submit" name="create" variant="validate" :disabled="isDisabled">{{ $trans('modal.create.button', 'Create') }}</a17-button>
         <a17-button type="submit" name="create-another" v-if="!isDisabled" variant="aslink-grey"><span>{{ $trans('modal.create.create-another', 'Create and add another') }}</span></a17-button>
       </template>
-      <a17-button type="submit" name="update" v-else="" variant="validate" :disabled="isDisabled">{{ $trans('modal.update.button', 'Update') }}</a17-button>
+      <a17-button type="submit" name="update" v-else-if="mode === 'update'" variant="validate" :disabled="isDisabled">{{ $trans('modal.update.button', 'Update') }}</a17-button>
+      <a17-button type="submit" name="done" v-else="" variant="validate" :disabled="isDisabled">{{ $trans('modal.done.button', 'Done') }}</a17-button>
     </a17-inputframe>
     <label v-if="activePublishState" :for="publishedName" class="switcher__button" :class="switcherClasses">
       <span v-if="isChecked" class="switcher__label">{{ textEnabled }}</span>

diff --git a/frontend/js/store/modules/form.js b/frontend/js/store/modules/form.js
@@ -113,10 +113,9 @@ const mutations = {
   [FORM.UPDATE_FORM_FIELD] (state, field) {
     let fieldValue = field.locale ? {} : null
     const fieldIndex = getFieldIndex(state.fields, field)
-
     // Update existing form field
     if (fieldIndex !== -1) {
-      if (field.locale) fieldValue = state.fields[fieldIndex].value
+      if (field.locale) fieldValue = state.fields[fieldIndex].value || {}
       // remove existing field
       state.fields.splice(fieldIndex, 1)
     }
@@ -279,7 +278,9 @@ const actions = {
     // - created blocks and repeaters
     const data = getFormData(rootState)
 
-    api.put(state.saveUrl, data, function (successResponse) {
+    const method = rootState.publication.createWithoutModal ? 'post' : 'put'
+
+    api[method](state.saveUrl, data, function (successResponse) {
       commit(FORM.UPDATE_FORM_LOADING, false)
 
       if (successResponse.data.hasOwnProperty('redirect')) {

diff --git a/frontend/js/store/modules/publication.js b/frontend/js/store/modules/publication.js
@@ -11,6 +11,7 @@ const state = {
   endDate: window[process.env.VUE_APP_NAME].STORE.publication.endDate || null,
   visibility: window[process.env.VUE_APP_NAME].STORE.publication.visibility || false,
   reviewProcess: window[process.env.VUE_APP_NAME].STORE.publication.reviewProcess || [],
+  createWithoutModal: window[process.env.VUE_APP_NAME].STORE.publication.createWithoutModal || false,
   saveType: undefined,
   visibilityOptions: [
     {
@@ -99,6 +100,9 @@ const getters = {
     return state.reviewProcess.filter(reviewProcess => reviewProcess.checked)
   },
   getSubmitOptions: state => {
+    if (state.createWithoutModal) {
+      return state.submitOptions.draft
+    }
     return (state.published || !state.withPublicationToggle) ? state.submitOptions[state.publishSubmit] : state.submitOptions.draft
   },
   isEnabledSubmitOption: (state, getters) => name => {

diff --git a/src/Http/Controllers/Admin/ModuleController.php b/src/Http/Controllers/Admin/ModuleController.php
@@ -85,6 +85,7 @@ abstract class ModuleController extends Controller
         'permalink' => true,
         'bulkEdit' => true,
         'editInModal' => false,
+        'skipCreateModal' => false
     ];
 
     /**
@@ -354,6 +355,14 @@ public function store($parentModuleId = null)
         $input = $this->validateFormRequest()->all();
         $optionalParent = $parentModuleId ? [$this->getParentModuleForeignKey() => $parentModuleId] : [];
 
+        if (isset($input['cmsSaveType']) && $input['cmsSaveType'] === 'cancel') {
+            return $this->respondWithRedirect(moduleRoute(
+                $this->moduleName,
+                $this->routePrefix,
+                'create'
+            ));
+        }
+
         $item = $this->repository->create($input + $optionalParent);
 
         activity()->performedOn($item)->log('created');
@@ -377,6 +386,18 @@ public function store($parentModuleId = null)
             ];
         }
 
+        if (isset($input['cmsSaveType']) && Str::endsWith($input['cmsSaveType'], '-close')) {
+            return $this->respondWithRedirect($this->getBackLink());
+        }
+
+        if (isset($input['cmsSaveType']) && Str::endsWith($input['cmsSaveType'], '-new')) {
+            return $this->respondWithRedirect(moduleRoute(
+                $this->moduleName,
+                $this->routePrefix,
+                'create'
+            ));
+        }
+
         return $this->respondWithRedirect(moduleRoute(
             $this->moduleName,
             $this->routePrefix,
@@ -428,6 +449,33 @@ public function edit($id, $submoduleId = null)
         return View::make($view, $this->form($submoduleId ?? $id));
     }
 
+    /**
+     * @param int $id
+     * @param int|null $submoduleId
+     * @return \Illuminate\Http\JsonResponse|\Illuminate\Http\RedirectResponse|\Illuminate\View\View
+     */
+    public function create()
+    {
+        if (!$this->getIndexOption('skipCreateModal')) {
+            return Redirect::to(moduleRoute(
+                $this->moduleName,
+                $this->routePrefix,
+                'index',
+                ['openCreate' => true]
+            ));
+        }
+
+        $view = Collection::make([
+            "$this->viewPrefix.form",
+            "twill::$this->moduleName.form",
+            "twill::layouts.form",
+        ])->first(function ($view) {
+            return View::exists($view);
+        });
+
+        return View::make($view, $this->form());
+    }
+
     /**
      * @param int $id
      * @param int|null $submoduleId
@@ -461,6 +509,13 @@ public function update($id, $submoduleId = null)
                 if (Str::endsWith($input['cmsSaveType'], '-close')) {
                     return $this->respondWithRedirect($this->getBackLink());
                 } elseif (Str::endsWith($input['cmsSaveType'], '-new')) {
+                    if ($this->getIndexOption('skipCreateModal')) {
+                        return $this->respondWithRedirect(moduleRoute(
+                            $this->moduleName,
+                            $this->routePrefix,
+                            'create'
+                        ));
+                    }
                     return $this->respondWithRedirect(moduleRoute(
                         $this->moduleName,
                         $this->routePrefix,
@@ -815,6 +870,7 @@ protected function getIndexData($prependScope = [])
 
         $options = [
             'moduleName' => $this->moduleName,
+            'skipCreateModal' => $this->getIndexOption('skipCreateModal'),
             'reorder' => $this->getIndexOption('reorder'),
             'create' => $this->getIndexOption('create'),
             'duplicate' => $this->getIndexOption('duplicate'),
@@ -1120,6 +1176,7 @@ protected function getIndexTableMainFilters($items, $scopes = [])
     protected function getIndexUrls($moduleName, $routePrefix)
     {
         return Collection::make([
+            'create',
             'store',
             'publish',
             'bulkPublish',
@@ -1171,6 +1228,7 @@ protected function getIndexOption($option)
                 'bulkDelete' => 'delete',
                 'bulkEdit' => 'edit',
                 'editInModal' => 'edit',
+                'skipCreateModal' => 'edit'
             ];
 
             $authorized = array_key_exists($option, $authorizableOptions) ? Auth::guard('twill_users')->user()->can($authorizableOptions[$option]) : true;
@@ -1345,9 +1403,14 @@ protected function orderScope()
      * @param \A17\Twill\Models\Model|null $item
      * @return array
      */
-    protected function form($id, $item = null)
+    protected function form($id = null, $item = null)
     {
-        $item = $item ?? $this->repository->getById($id, $this->formWith, $this->formWithCount);
+
+        if (!$item && $id) {
+            $item = $this->repository->getById($id, $this->formWith, $this->formWithCount);
+        } elseif (!$item && !$id) {
+            $item = $this->repository->newInstance();
+        }
 
         $fullRoutePrefix = 'admin.' . ($this->routePrefix ? $this->routePrefix . '.' : '') . $this->moduleName . '.';
         $previewRouteName = $fullRoutePrefix . 'preview';
@@ -1367,18 +1430,19 @@ protected function form($id, $item = null)
             'translate' => $this->moduleHas('translations'),
             'translateTitle' => $this->titleIsTranslatable(),
             'permalink' => $this->getIndexOption('permalink'),
+            'createWithoutModal' => !$item->id && $this->getIndexOption('skipCreateModal'),
             'form_fields' => $this->repository->getFormFields($item),
             'baseUrl' => $baseUrl,
             'permalinkPrefix' => $this->getPermalinkPrefix($baseUrl),
-            'saveUrl' => $this->getModuleRoute($item->id, 'update'),
+            'saveUrl' => $item->id ? $this->getModuleRoute($item->id, 'update') : moduleRoute($this->moduleName, '', 'store'),
             'editor' => Config::get('twill.enabled.block-editor') && $this->moduleHas('blocks') && !$this->disableEditor,
             'blockPreviewUrl' => Route::has('admin.blocks.preview') ? URL::route('admin.blocks.preview') : '#',
             'availableRepeaters' => $this->getRepeaterList()->toJson(),
             'revisions' => $this->moduleHas('revisions') ? $item->revisionsArray() : null,
-        ] + (Route::has($previewRouteName) ? [
+        ] + (Route::has($previewRouteName) && $item->id ? [
             'previewUrl' => moduleRoute($this->moduleName, $this->routePrefix, 'preview', $item->id),
         ] : [])
-             + (Route::has($restoreRouteName) ? [
+             + (Route::has($restoreRouteName) && $item->id ? [
             'restoreUrl' => moduleRoute($this->moduleName, $this->routePrefix, 'restoreRevision', $item->id),
         ] : []);
 

diff --git a/views/layouts/form.blade.php b/views/layouts/form.blade.php
@@ -19,6 +19,7 @@
 @endpush
 
 @php
+    $editModalTitle = $createWithoutModal ? 'Enter Title' : null;
     $editor = $editor ?? false;
     $translate = $translate ?? false;
     $translateTitle = $translateTitle ?? $translate ?? false;
@@ -47,6 +48,7 @@
                     custom-title="{{ $customTitle ?? '' }}"
                     custom-permalink="{{ $customPermalink ?? '' }}"
                     slot="title"
+                    @if($createWithoutModal) :show-modal="true" @endif
                     @if(isset($editModalTitle)) modal-title="{{ $editModalTitle }}" @endif
                 >
                     <template slot="modal-form">
@@ -135,6 +137,7 @@
     window['{{ config('twill.js_namespace') }}'].STORE.publication = {
         withPublicationToggle: {{ json_encode(($publish ?? true) && isset($item) && $item->isFillable('published')) }},
         published: {{ isset($item) && $item->published ? 'true' : 'false' }},
+        createWithoutModal: '{{ $createWithoutModal }}',
         withPublicationTimeframe: {{ json_encode(($schedule ?? true) && isset($item) && $item->isFillable('publish_start_date')) }},
         publishedLabel: '{{ $customPublishedLabel ?? twillTrans('twill::lang.main.published') }}',
         draftLabel: '{{ $customDraftLabel ?? twillTrans('twill::lang.main.draft') }}',

diff --git a/views/layouts/listing.blade.php b/views/layouts/listing.blade.php
@@ -9,6 +9,7 @@
     $nested = $nested ?? false;
     $bulkEdit = $bulkEdit ?? true;
     $create = $create ?? false;
+    $skipCreateModal = $skipCreateModal ?? false;
 
     $requestFilter = json_decode(request()->get('filter'), true) ?? [];
 @endphp
@@ -78,7 +79,14 @@
 
                     @if($create)
                         <div slot="additional-actions">
-                            <a17-button variant="validate" size="small" v-on:click="create">{{ twillTrans('twill::lang.listing.add-new-button') }}</a17-button>
+                            <a17-button
+                                variant="validate"
+                                size="small"
+                                @if($skipCreateModal) href={{$createUrl}} el="a" @endif
+                                @if(!$skipCreateModal) v-on:click="create" @endif
+                            >
+                                {{ twillTrans('twill::lang.listing.add-new-button') }}
+                            </a17-button>
                             @foreach($filterLinks as $link)
                                 <a17-button el="a" href="{{ $link['url'] ?? '#' }}" download="{{ $link['download'] ?? '' }}" rel="{{ $link['rel'] ?? '' }}" target="{{ $link['target'] ?? '' }}" variant="small secondary">{{ $link['label'] }}</a17-button>
                             @endforeach
@@ -148,6 +156,7 @@
         forceDelete: '{{ $forceDeleteUrl }}',
         bulkForceDelete: '{{ $bulkForceDeleteUrl }}',
         reorder: '{{ $reorderUrl }}',
+        create: '{{ $createUrl }}',
         feature: '{{ $featureUrl }}',
         bulkFeature: '{{ $bulkFeatureUrl }}',
         bulkDelete: '{{ $bulkDeleteUrl }}'