diff options
Diffstat (limited to 'views/mods')
| -rw-r--r-- | views/mods/mod_productvariants/produkt_addedit_content_combination.phtml | 245 |
1 files changed, 245 insertions, 0 deletions
diff --git a/views/mods/mod_productvariants/produkt_addedit_content_combination.phtml b/views/mods/mod_productvariants/produkt_addedit_content_combination.phtml new file mode 100644 index 0000000..846e778 --- /dev/null +++ b/views/mods/mod_productvariants/produkt_addedit_content_combination.phtml @@ -0,0 +1,245 @@ +<?php + + declare(strict_types=1); + + /** + * Template für die Verwaltung der Produktvarianten innerhalb des Produktes + * @author: Daniel Schmitzer (daschmi@daschmi.de) + * @date: 20.04.23 + * @time: 11:30 + */ + + namespace wpsg; + + /** @var \wpsg_product $oProduct */ + $oProduct = \wpsg_product::getInstance(intval($this->view['data']['id'])); + + $arVariantInfo = $this->callMod('wpsg_mod_productvariants', 'getVariants', [$oProduct->getId(), true, true, true]); + + $arVariant = []; $arVariantLabel = []; $arFilter = []; + $arVariationen = []; $arVariationLabel = []; + + foreach ($arVariantInfo as $var) { + + $arVariant[] = intval($var['id']); + $arVariationen[$var['id']] = []; + + foreach ($var['arVariation'] as $vari) { + + $arVariationen[intval($var['id'])][] = intval($vari['variation_id']); + + if (!in_array($var['id'], $arVariationLabel)) try { $arVariationLabel[$vari['variation_id']] = wpsg_variation::getInstance($vari['variation_id'])->getLabel(); } catch (\Exception $e) { $arVariationLabel[$vari['variation_id']] = $vari['variation_id']; } + + } + + if (!in_array($var['id'], $arVariantLabel)) try { $arVariantLabel[$var['id']] = wpsg_variant::getInstance($var['id'])->getLabel(); } catch (\Exception $e) { $arVariantLabel[$var['id']] = $var['id']; } + + $arFilter[$var['id']] = 0; + + } + + $arPossibleKeys = $oProduct->getPossibleProductVariantKeys(); + + foreach ($arPossibleKeys as $k => $v) { + + $arPossibleKeys[$k]['data'] = null; + + try { + + $arPossibleKeys[$k]['id'] = intval(wpsg_combination::findByProductAndKey($oProduct->getId(), $v['var_key'])->getId()); + + } catch (\Throwable $e) { $arPossibleKeys[$k]['id'] = 0; } + + } + +?> + +<div id="wpsg_mod_productvars_combination"> + <div class="top_filter"> + <div v-for="(variant, i) of arVariationen"> + <select v-model="arFilter[i]"> + <option :value="0">{{getVariantLabel(i)}} [ Alle ]</option> + <option :value="parseInt(variation)" v-for="(variation, j) of variant">{{getVariantLabel(i)}} [{{getVariationLabel(variation)}}]</option> + </select> + </div> + </div> + <div class="panel panel-default" v-for="(combination, i) of arPossibleKeysFiltered"> + <div class="panel-heading clearfix"> + <h3 class="panel-title"> + {{combination.label}} + <span v-if="combination.id > 0" class="glyphicon glyphicon-pencil" @click.prevent="edit(combination.var_key)"></span> + <span v-else class="glyphicon glyphicon-plus" @click.prevent="add(combination.var_key)"></span> + </h3> + </div> + <div class="panel-body" v-if="combination.loaded"> + <pre>{{combination}}</pre> + </div> + </div> + <pre>{{arPossibleKeysFiltered}}</pre> +</div> + +<script src="<?php echo WPSG_URL_CONTENT.'plugins/'.WPSG_FOLDERNAME.'/views/js/vue-3.2.47.global.min.js'; ?>"></script> +<script> + + const ref = Vue.ref; + const computed = Vue.computed; + + const app = Vue.createApp({ + setup() { + + const product_id = ref(<?php echo $oProduct->getId(); ?>); + const arFilter = ref(<?php echo json_encode($arFilter); ?>); + const arPossibleKeys = ref(<?php echo json_encode($arPossibleKeys); ?>); + const arVariant = ref(<?php echo json_encode($arVariant); ?>); + const arVariantLabel = ref(<?php echo json_encode($arVariantLabel); ?>); + const arVariationen = ref(<?php echo json_encode($arVariationen); ?>); + const arVariationLabel = ref(<?php echo json_encode($arVariationLabel); ?>); + + const arPossibleKeysFiltered = computed(() => { + + let r = []; + + for (let var_key of arPossibleKeys.value) { + + const arKey = var_key.var_key.split('|'); + const typedKey = {}; + + for (let i of arKey) { + + const [var_id, vari_id] = i.split(':'); + + typedKey[var_id] = parseInt(vari_id); + + } + + let set = true; + + for (let f in arFilter.value) { + + if (arFilter.value[f] !== 0 && typedKey[f] !== arFilter.value[f]) { + + set = false; break; + + } + + } + + if (set) r.push(var_key); + + } + + return r; + + }); + + const getVariantLabel = (var_id) => { + + if (arVariantLabel.value[var_id.toString()] !== undefined) return arVariantLabel.value[var_id.toString()]; + else ''; + + }; + const getVariationLabel = (var_id) => { + + if (arVariationLabel.value[var_id.toString()] !== undefined) return arVariationLabel.value[var_id.toString()]; + else ''; + + }; + const xhr = (action_do, data, cb_success) => { + + const request = new XMLHttpRequest(); + + data.action_do = action_do; + + request.open('POST', '<?php echo WPSG_URL_WP; ?>wp-admin/?page=wpsg-Admin&action=module&modul=wpsg_mod_productvariants&subaction=combination&noheader=1', true); + request.setRequestHeader('Content-Type', 'application/json; charset=UTF-8'); + request.onload = () => { + + if (request.status >= 200 && request.status < 400) { + + const response = JSON.parse(request.responseText); + + cb_success(response); + + } else { + + console.error('Error: ' + request.statusText); + + } + + }; + + request.onerror = function() { + + console.error('Error: ' + request.statusText); + + }; + + request.send(JSON.stringify(data)); + + }; + const add = (combination_key) => { + + xhr('add', { + var_key: combination_key, + product_id: product_id.value + }, (response) => { + + for (let i = 0; i < arPossibleKeys.value.length; i ++) { + + const var_key = arPossibleKeys.value[i]; + + if (var_key.var_key === response.combination.var_key) { + + arPossibleKeys.value[i] = response.combination; + + } + + } + + }); + + }; + const edit = (combination_key) => { + + xhr('edit', { + var_key: combination_key, + product_id: product_id.value + }, (response) => { + + for (let i = 0; i < arPossibleKeys.value.length; i ++) { + + const var_key = arPossibleKeys.value[i]; + + if (var_key.var_key === response.combination.var_key) { + + arPossibleKeys.value[i] = response.combination; + + } + + } + + }); + + } + + return { + arFilter, arPossibleKeys, arVariant, arVariantLabel, arVariationen, arVariationLabel, product_id, + getVariantLabel, getVariationLabel, + arPossibleKeysFiltered, + add, edit + }; + + } + }).mount('#wpsg_mod_productvars_combination'); + +</script> + +<style> + + #wpsg_mod_productvars_combination { width:100%; } + #wpsg_mod_productvars_combination .top_filter { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); row-gap:1rem; column-gap:1rem; margin-bottom:2rem; } + #wpsg_mod_productvars_combination .top_filter select { width:100%; } + #wpsg_mod_productvars_combination .panel-title { display:flex; justify-content:space-between; align-items:center; } + #wpsg_mod_productvars_combination .panel-title .glyphicon { cursor:pointer; } + +</style>
\ No newline at end of file |