How to auto-deny the non-returnable items in the return section of the website based on the returnable field in the item record

We can use this solution to automatically prevent customers from returning non-returnable items from the website based on item records.

JavaScript:

Entry Point:

//ReturnAuthorizationFormView is using for disabling the return for non returnable items.
				getContext: _.wrap(ReturnAuthorizationFormView.prototype.getContext, function (fn) {
					let context = fn.apply(this, _.toArray(arguments).slice(1));
					try {
						_.each(this.lines.models, (line) => {
							if (line.get('item').get('custitem_returnable') === false) {
								line.set('checked', false);
							}
						})
					} catch (error) {
						console.error('Error @ ReturnAuthorizationFormView getContext: ', error);
					}
					return context;
				})
			});
			//TransactionLineViewsCellSelectableActionableNavigableView is using to show the error messages for non-returnable items.
			_.extend(TransactionLineViewsCellSelectableActionableNavigableView.prototype, {
				template: jj_transaction_line_views_cell_selectable_actionable_navigable_tpl,
				getContext: _.wrap(TransactionLineViewsCellSelectableActionableNavigableView.prototype.getContext, function (fn) {
					let context = fn.apply(this, _.toArray(arguments).slice(1));
					try {
						if (context.actionType === "return-line") {
							context.isReturnable = this.model.get('item').get('custitem_returnable');
						}
					} catch (error) {
						console.error('Error @ TransactionLineViewsCellSelectableActionableNavigableView getContext: ', error);
					}
					return context;
				})
			});

Template:

jj_transaction_line_views_cell_selectable_actionable_navigable.tpl

<tr class="transaction-line-views-cell-selectable-actionable-navigable-row{{#if isLineChecked}} selected{{/if}}" data-action="{{actionType}}" data-id="{{lineId}}">
	<td class="transaction-line-views-cell-selectable-actionable-navigable-select">
		{{#if isReturnable}} <input type="checkbox" value="{{itemId}}" data-action="select" {{#if isLineChecked}}checked{{/if}}> {{/if}}
	</td>

	<td class="transaction-line-views-cell-selectable-actionable-navigable-thumbnail">
		<img class="transaction-line-views-cell-selectable-actionable-navigable-thumbnail-image" src="{{resizeImage thumbnail.url 'thumbnail'}}" alt="{{thumbnail.altimagetext}}">
	</td>

	<td class="transaction-line-views-cell-selectable-actionable-navigable-details">
		<div class="transaction-line-views-cell-selectable-actionable-navigable-name">
      {{#if isNavigable}}
			<a {{{linkAttributes}}} class="">
        {{itemName}}
			</a>
			{{else}}
			<span class="transaction-line-views-cell-selectable-actionable-navigable-viewonly">
        {{itemName}}
			</span>
			{{/if}}
      {{#unless isReturnable}}
      <span class="global-views-message global-views-message-error alert">Sorry, this is a non-returnable item.</span>
      {{/unless}}
		</div>

		<div class="transaction-line-views-cell-selectable-actionable-navigable-price">
			<div data-view="Item.Price"></div>
		</div>

		<div data-view="Item.Sku"></div>

		<div class="transaction-line-views-cell-selectable-actionable-navigable-options">
			<div data-view="Item.SelectedOptions"></div>
		</div>
	</td>

	<td class="transaction-line-views-cell-selectable-actionable-navigable-extras">
		<div class="" data-view="Item.Summary.View"></div>
	</td>

	<td class="transaction-line-views-cell-selectable-actionable-navigable-actions">
		<div data-view="Item.Actions.View" class=""></div>
	</td>
</tr>


{{!----
The context variables for this template are not currently documented. Use the {{log this}} helper to view the context variables in the Console of your browser's developer tools.

----}}

jj_return_authorization.tpl

{{#if isLineActive}}
	<label class="return-authorization-form-item-actions-label" for="reason">
		{{translate 'Why are you returning the item?'}} <span class="return-authorization-form-item-actions-required">*</span>
	</label>
	{{#if showReasons}}
		<select data-action="reasons" name="reason" class="return-authorization-form-item-actions-options" data-toggle="false">
			<option value="null">{{translate 'Select a reason'}}</option>
			{{#each reasons}}
				<option value="{{id}}" {{#if isSelected}}selected{{/if}} data-toggle="false">{{text}}</option>
			{{/each}}
			{{!-- <option value="other" {{#if isOtherReasonSelected}}selected{{/if}}>{{translate 'Other'}}</option> --}}
		</select>

		{{#if isOtherReasonSelected}}
			<input type="text" data-action="reason-text" name="reason-text" value="{{textReason}}" data-toggle="false" class="return-authorization-form-item-actions-other-reason-input">
		{{/if}}
    <div class="return-authorization-form-group" data-validation="control-group">
			<label class="return-authorization-form-group-label" for="itemDamaged">
				{{translate 'Is the item damaged?'}}
				<span class="return-authorization-form-label-required">*</span>
			</label>
			<div  class="return-authorization-form-controls" data-validation="control">
				<select name="itemDamaged" id="return-authorization-item-damaged" data-toggle="false" class="return-authorization-form-item-actions-options">
          <option data-toggle="false" disabled selected value="null">Select an option</option>
          <option data-toggle="false" value="1">Yes</option>
          <option data-toggle="false" value="2">No</option>
        </select>
			</div>
		</div>
    <div class="return-authorization-form-group" data-validation="control-group">
			<label class="return-authorization-form-group-label" for="itemUsed">
				{{translate 'Has the item been used?'}}
				<span class="return-authorization-form-label-required">*</span>
			</label>
			<div  class="return-authorization-form-controls" data-validation="control">
				<select name="itemUsed" id="return-authorization-item-used" data-toggle="false" class="return-authorization-form-item-actions-options">
          <option data-toggle="false" disabled selected value="null">Select an option</option>
          <option data-toggle="false" value="1">Yes</option>
          <option data-toggle="false" value="2">No</option>
        </select>
			</div>
		</div>
    <div class="return-authorization-form-group" data-validation="control-group">
			<label class="return-authorization-form-group-label" for="isInpakage">
				{{translate 'Do you still have or is it still in the original packaging?'}}
				<span class="return-authorization-form-label-required">*</span>
			</label>
			<div  class="return-authorization-form-controls" data-validation="control">
				<select name="isInpakage" id="return-authorization-is-in-pakage" data-toggle="false" class="return-authorization-form-item-actions-options">
          <option data-toggle="false" disabled selected value="null">Select an option</option>
          <option data-toggle="false" value="1">Yes</option>
          <option data-toggle="false" value="2">No</option>
        </select>
			</div>
		</div>
		{{#if activeLinesLengthGreaterThan1}}
			<a href="#" class="return-authorization-form-item-actions-apply-reason-button" data-action="apply-reason" data-toggle="false">{{translate 'Apply to all'}}</a>
		{{/if}}

	{{else}}
		<input type="text" data-action="reason-text" name="reason-text" value="{{textReason}}" data-toggle="false" class="return-authorization-form-item-actions-other-reason-text">
	{{/if}}
{{/if}}

{{!----
The context variables for this template are not currently documented. Use the {{log this}} helper to view the context variables in the Console of your browser's developer tools.

----}}

Leave a comment

Your email address will not be published. Required fields are marked *