merdan
/
sarga
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added checkbox to add empty (default) option for attributes; only show attribute labels (not admin names) on product detail view

This commit is contained in:
MonaHartdegen 2019-12-12 10:32:51 +01:00
parent 1b026bc913
commit 7b1378fded
6 changed files with 138 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/Webkul/Admin/publishable/assets/js/admin.js vendored
View File

File diff suppressed because one or more lines are too long

1
packages/Webkul/Admin/src/Resources/lang/en/app.php
View File

@ -545,6 +545,7 @@ return [
'file' => 'File',
'checkbox' => 'Checkbox',
'use_in_flat' => "Create in Product Flat Table",
'default_null_option' => 'Create default empty option',
],
'families' => [
'title' => 'Families',

58
packages/Webkul/Admin/src/Resources/views/catalog/attributes/create.blade.php
View File

@ -252,6 +252,15 @@
</select>
</div>
<div class="control-group">
<span class="checkbox">
<input type="checkbox" class="control" id="default-null-option" name="default-null-option" v-model="isNullOptionChecked" >
<label class="checkbox-view" for="default-null-option"></label>
{{ __('admin::app.catalog.attributes.default_null_option') }}
</span>
</div>
<div class="table">
<table>
<thead>
@ -292,7 +301,7 @@
@foreach (app('Webkul\Core\Repositories\LocaleRepository')->all() as $locale)
<td>
<div class="control-group" :class="[errors.has(localeInputName(row, '{{ $locale->code }}')) ? 'has-error' : '']">
<input type="text" v-validate="'{{ app()->getLocale() }}' == '{{ $locale->code }}' ? 'required': ''" v-model="row['{{ $locale->code }}']" :name="localeInputName(row, '{{ $locale->code }}')" class="control" data-vv-as="&quot;{{ $locale->name . ' (' . $locale->code . ')' }}&quot;"/>
<input type="text" v-validate="getOptionValidation(row, '{{ $locale->code }}')" v-model="row['{{ $locale->code }}']" :name="localeInputName(row, '{{ $locale->code }}')" class="control" data-vv-as="&quot;{{ $locale->name . ' (' . $locale->code . ')' }}&quot;"/>
<span class="control-error" v-if="errors.has(localeInputName(row, '{{ $locale->code }}'))">@{{ errors.first(localeInputName(row, '{!! $locale->code !!}')) }}</span>
</div>
</td>
@ -313,7 +322,7 @@
</table>
</div>
<button type="button" class="btn btn-lg btn-primary mt-20" id="add-option-btn" @click="addOptionRow()">
<button type="button" class="btn btn-lg btn-primary mt-20" id="add-option-btn" @click="addOptionRow(false)">
{{ __('admin::app.catalog.attributes.add-option-btn-title') }}
</button>
</div>
@ -339,14 +348,17 @@
data: function() {
return {
optionRowCount: 0,
optionRowCount: 1,
optionRows: [],
show_swatch: false,
swatch_type: ''
swatch_type: '',
isNullOptionChecked: false,
idNullOption: null
}
},
created: function () {
console.log(this.optionRows);
var this_this = this;
$(document).ready(function () {
@ -361,19 +373,31 @@
},
methods: {
addOptionRow: function () {
addOptionRow: function (isNullOptionRow) {
var rowCount = this.optionRowCount++;
var row = {'id': 'option_' + rowCount};
let id = 'option_' + rowCount;
var row = {'id': id};
@foreach (app('Webkul\Core\Repositories\LocaleRepository')->all() as $locale)
row['{{ $locale->code }}'] = '';
@endforeach
row['notRequired'] = '';
if (isNullOptionRow) {
this.idNullOption = id;
row['notRequired'] = true;
}
this.optionRows.push(row);
},
removeRow: function (row) {
var index = this.optionRows.indexOf(row)
if (row.id === this.idNullOption) {
this.idNullOption = null;
}
var index = this.optionRows.indexOf(row);
Vue.delete(this.optionRows, index);
},
@ -387,6 +411,26 @@
sortOrderName: function (row) {
return 'options[' + row.id + '][sort_order]';
},
getOptionValidation: (row, localeCode) => {
if (row.notRequired === true) {
return '';
}
return ('{{ app()->getLocale() }}' === localeCode) ? 'required' : '';
}
},
watch: {
isNullOptionChecked: function (val) {
if (val) {
this.addOptionRow(true);
} else {
let row = this.optionRows.find(optionRow => optionRow.id === this.idNullOption);
this.removeRow(row);
}
}
}
})

64
packages/Webkul/Admin/src/Resources/views/catalog/attributes/edit.blade.php
View File

@ -316,6 +316,15 @@
</select>
</div>
<div class="control-group">
<span class="checkbox">
<input type="checkbox" class="control" id="default-null-option" name="default-null-option" v-model="isNullOptionChecked">
<label class="checkbox-view" for="default-null-option"></label>
{{ __('admin::app.catalog.attributes.default_null_option') }}
</span>
</div>
<div class="table">
<table>
<thead>
@ -337,6 +346,7 @@
</thead>
<tbody>
<tr v-for="(row, index) in optionRows">
<td v-if="show_swatch && swatch_type == 'color'">
<swatch-picker :input-name="'options[' + row.id + '][swatch_value]'" :color="row.swatch_value" colors="text-advanced" show-fallback />
@ -357,7 +367,7 @@
@foreach (app('Webkul\Core\Repositories\LocaleRepository')->all() as $locale)
<td>
<div class="control-group" :class="[errors.has(localeInputName(row, '{{ $locale->code }}')) ? 'has-error' : '']">
<input type="text" v-validate="'{{ app()->getLocale() }}' == '{{ $locale->code }}' ? 'required': ''" v-model="row['{{ $locale->code }}']" :name="localeInputName(row, '{{ $locale->code }}')" class="control" data-vv-as="&quot;{{ $locale->name . ' (' . $locale->code . ')' }}&quot;"/>
<input type="text" v-validate="getOptionValidation(row, '{{ $locale->code }}')" v-model="row['{{ $locale->code }}']" :name="localeInputName(row, '{{ $locale->code }}')" class="control" data-vv-as="&quot;{{ $locale->name . ' (' . $locale->code . ')' }}&quot;"/>
<span class="control-error" v-if="errors.has(localeInputName(row, '{{ $locale->code }}'))">@{{ errors.first(localeInputName(row, '{!! $locale->code !!}')) }}</span>
</div>
</td>
@ -396,22 +406,31 @@
optionRowCount: 0,
optionRows: [],
show_swatch: "{{ $attribute->type == 'select' ? true : false }}",
swatch_type: "{{ $attribute->swatch_type }}"
swatch_type: "{{ $attribute->swatch_type }}",
isNullOptionChecked: false,
idNullOption: null
}
},
created: function () {
@foreach ($attribute->options as $option)
this.optionRowCount++;
var row = {
'id': '{{ $option->id }}',
'admin_name': '{{ $option->admin_name }}',
'sort_order': '{{ $option->sort_order }}',
'sort_order': '{{ $option->sort_order }}',
'swatch_value': '{{ $option->swatch_value }}',
'swatch_value_url': '{{ $option->swatch_value_url }}'
'swatch_value_url': '{{ $option->swatch_value_url }}',
'notRequired': ''
};
@if (empty($option->label))
this.isNullOptionChecked = true;
this.idNullOption = '{{ $option->id }}';
row['notRequired'] = true;
@endif
@foreach (app('Webkul\Core\Repositories\LocaleRepository')->all() as $locale)
row['{{ $locale->code }}'] = "{{ $option->translate($locale->code)['label'] }}";
@endforeach
@ -431,18 +450,30 @@
},
methods: {
addOptionRow: function () {
addOptionRow: function (isNullOptionRow) {
var rowCount = this.optionRowCount++;
var row = {'id': 'option_' + rowCount};
let id = 'option_' + rowCount;
var row = {'id': id};
@foreach (app('Webkul\Core\Repositories\LocaleRepository')->all() as $locale)
row['{{ $locale->code }}'] = '';
@endforeach
row['notRequired'] = '';
if (isNullOptionRow) {
this.idNullOption = id;
row['notRequired'] = true;
}
this.optionRows.push(row);
},
removeRow: function (row) {
if (row.id === this.idNullOption) {
this.idNullOption = null;
}
var index = this.optionRows.indexOf(row)
Vue.delete(this.optionRows, index);
},
@ -457,6 +488,27 @@
sortOrderName: function (row) {
return 'options[' + row.id + '][sort_order]';
},
getOptionValidation: (row, localeCode) => {
if (row.notRequired === true) {
return '';
}
return ('{{ app()->getLocale() }}' === localeCode) ? 'required' : '';
}
},
watch: {
isNullOptionChecked: function (val) {
if (val) {
if (! this.idNullOption) {
this.addOptionRow(true);
}
} else {
let row = this.optionRows.find(optionRow => optionRow.id === this.idNullOption);
this.removeRow(row);
}
}
}
});

16
packages/Webkul/Product/src/Helpers/View.php
View File

@ -13,7 +13,7 @@ class View extends AbstractProduct
/**
* Returns the visible custom attributes
*
* @param Product $product
* @param Webkul\Product\Models\Product $product
* @return integer
*/
public function getAdditionalData($product)
@ -36,15 +36,23 @@ class View extends AbstractProduct
} else if($value) {
if ($attribute->type == 'select') {
$attributeOption = $attributeOptionReposotory->find($value);
if ($attributeOption)
$value = $attributeOption->label ?? $attributeOption->admin_name;
if ($attributeOption) {
$value = $attributeOption->label ?? null;
if (! $value) {
continue;
}
}
} else if ($attribute->type == 'multiselect' || $attribute->type == 'checkbox') {
$lables = [];
$attributeOptions = $attributeOptionReposotory->findWhereIn('id', explode(",", $value));
foreach ($attributeOptions as $attributeOption) {
$lables[] = $attributeOption->label ?? $attributeOption->admin_name;
if ($label = $attributeOption->label) {
$lables[] = $label;
}
}
$value = implode(", ", $lables);

30
packages/Webkul/Shop/src/Resources/views/products/view/attributes.blade.php
View File

@ -19,21 +19,21 @@
@else
<td>{{ $attribute['admin_name'] }}</td>
@endif
@if ($attribute['type'] == 'file' && $attribute['value'])
<td>
<a href="{{ route('shop.product.file.download', [$product->product_id, $attribute['id']])}}">
<i class="icon sort-down-icon download"></i>
</a>
</td>
@elseif ($attribute['type'] == 'image' && $attribute['value'])
<td>
<a href="{{ route('shop.product.file.download', [$product->product_id, $attribute['id']])}}">
<img src="{{ Storage::url($attribute['value']) }}" style="height: 20px; width: 20px;"/>
</a>
</td>
@else
<td>{{ $attribute['value'] }}</td>
@endif
@if ($attribute['type'] == 'file' && $attribute['value'])
<td>
<a href="{{ route('shop.product.file.download', [$product->product_id, $attribute['id']])}}">
<i class="icon sort-down-icon download"></i>
</a>
</td>
@elseif ($attribute['type'] == 'image' && $attribute['value'])
<td>
<a href="{{ route('shop.product.file.download', [$product->product_id, $attribute['id']])}}">
<img src="{{ Storage::url($attribute['value']) }}" style="height: 20px; width: 20px;"/>
</a>
</td>
@else
<td>{{ $attribute['value'] }}</td>
@endif
</tr>
@endforeach