@teddy-dev/frontend 1.0.1

package/returns/teddy-return-iban.js

@@ -0,0 +1,115 @@
+const {createApp} = await import('../res/mc-vue.js');
+await loadComponent('./res/mc-utils.js', false);
+await loadComponent('./auth/teddy-auth.js', false);
+
+class TeddyReturnIban extends HTMLElement {
+
+  connectedCallback() {
+    if(!this.dataset.brand || !this.dataset.market) {
+      console.error('TeddyReturnIban: missing brand or market data attributes');
+      return;
+    }
+    this.create();
+  }
+
+  create = () => {
+    const cmp = this;
+    
+    const app = createApp({
+      delimiters: ['${', '}'], // setta i delimitatori di vue, altrimenti se usiamo gli standard va in conflitto con liquid
+      data: () => {
+        return {
+          loading: true,
+          confirm: false,
+          code: null,
+          owner: null,
+          iban: null,
+          success: null
+        } 
+      },
+      methods: {
+
+        sendData: function() {
+          this.loading = true;
+          const body = {
+            returnCode: this.code,
+            returnHoldername: this.owner,
+            returnIBAN: this.iban,
+            brand: cmp.dataset.brand,
+            market: cmp.dataset.market,
+            callingSystem: 6,
+            sessionId: TeddyAuth.getSessionId(),
+          };
+          const data = {
+            method: theme.apis.returns.dev ? 'GET' : 'post',
+            url: theme.apis.returns.iban
+          };
+          if(!theme.apis.returns.dev) {
+            data.data = body;
+            data.headers = {
+              "Ocp-Apim-Subscription-Key":"0936a98c9baa4aa1a2787657e151b44a"
+            };
+          }
+          console.log('Iban with data: ', data);
+          axios(data).then(response => {
+            this.setSuccess(response.data);
+          }).catch(error => {
+            this.setError(error);
+          }).finally(() => {
+            this.loading = false;
+          });
+        },
+
+        setSuccess: function(resp) {
+          if(!resp.success || !resp.return_id) {
+            this.setError(resp);
+            return;
+          }
+          this.success = true;
+          this.error = null;
+        },
+
+        setError: function(e) {
+          this.success = false;
+          this.error = true;
+        },
+
+        next: function() {
+          this.confirm = true;
+        },
+
+        prev: function() {
+          this.confirm = false;
+        }
+
+      },
+      computed: {
+        isValid() {
+          return this.code != null && this.code.length == 20 && this.owner != null && this.owner.length > 0 && this.iban != null && this.iban.length == 27;
+        }
+      },
+      mounted: function() {
+        this.loading = false;
+      }
+    });
+    app.config.globalProperties.$filters = {
+      money(value) {
+        return McUtils.money(value);
+      }
+    }
+    app.config.compilerOptions.isCustomElement = tag => tag.includes('-'); // per evitare che vue vada in conflitto con liquid
+    app.mount(this);
+
+  }
+
+  getOrderId() {
+    // se l'utente arriva da un link diretto 
+    const params = new URLSearchParams(window.location.search);
+    return params.get('order')?.replace('#', '') || null;
+  }
+  
+}
+if (!window.customElements.get('teddy-return-iban')) {
+  window.customElements.define('teddy-return-iban', TeddyReturnIban);
+}
+window.TeddyReturnIban = TeddyReturnIban;

package/returns/teddy-return-list.js

@@ -0,0 +1,165 @@
+const {createApp} = await import('../res/mc-vue.js');
+await loadComponent('./res/mc-utils.js', false);
+
+class TeddyReturnList extends HTMLElement {
+
+  connectedCallback() {
+    const cmp = this;
+
+    const app = createApp({
+      delimiters: ['${', '}'], // setta i delimitatori di vue, altrimenti se usiamo gli standard va in conflitto con liquid
+      data: () => {
+        return {
+          returns: [],
+          selected: null,
+          loaded: false,
+        }
+      },
+      methods: {
+        checkReturns: function () {
+          const urlParams = new URLSearchParams(window.location.search);
+          const returnId = urlParams.get('return');
+          if(returnId)
+            this.getReturn(returnId);
+          else
+            this.getReturns();
+        }, 
+
+        getReturns: function () {
+          this.loaded = false;
+          const data = {
+            method: 'GET',
+            url: theme.apis.returns.list,
+          };
+          axios(data).then(response => {
+            const rd = response.data || {};
+            rd.success ? this.returnsFound(rd) : this.returnsNotFound(rd);
+          }).catch(error => {
+            this.returnsNotFound(error);
+          }).finally(() => {
+            this.loaded = true;
+          });
+        },
+
+        returnsFound: function (response) {
+          console.log('Returns found:', response);
+          this.returns = response.returns || [];
+          this.returns.forEach(element => {
+            this.completeReturnItem(element);
+          });
+        },
+
+        returnsNotFound: function (error) {
+          this.returns = [];
+          console.error('Error fetching returns:', error);
+          Utils.showError('Non sono stati trovati resi per questo ordine.');
+        },
+
+        completeReturnItem: function (returnItem) {
+          const data = {
+            method: theme.apis.returns.dev ? 'GET' : 'POST',
+            url: `${theme.apis.returns.get.replace('{return_id}', returnItem.return_id)}`,
+          };
+          axios(data).then(response => {
+            const rd = response.data || {};
+            this.returns = this.returns.map(r => {
+              return r.return_id == returnItem.return_id ? { ...r, ...rd.return } : r;
+            });
+            console.log('Return item found:', this.returns);
+          }).catch(error => {
+            console.error('Error fetching return item:', error);
+          });
+        },
+
+        getReturn: function (returnId) {
+          if(!returnId) { console.error('Return ID is required'); return; }
+          this.returns = [];
+          this.selected = null;
+          this.loaded = false;
+          const data = {
+            method: theme.apis.returns.dev ? 'GET' : 'POST',
+            url: `${theme.apis.returns.get.replace('{return_id}', returnId)}`,
+          };
+          axios(data).then(response => {
+            const rd = response.data || {};
+            rd.success ? this.returnFound(rd) : this.returnNotFound(rd);
+          }).catch(error => {
+            this.returnNotFound(error);
+          }).finally(() => {
+            this.loaded = true;
+          });
+        },
+
+        returnFound: function (response) {
+          this.selected = response.return || null;
+          console.log('Return found:', this.selected);
+          if (!this.selected) {
+            console.error('Return not found');
+            return;
+          }
+        },
+
+        returnNotFound: function (error) {
+          this.selected = null;
+          console.error('Error fetching return:', error);
+          Utils.showError('Errore durante il recupero del reso.');
+        },
+
+        back: function () {
+          this.selected = null;
+          const url = new URL(window.location.href);
+          url.searchParams.delete('return');
+          window.history.pushState({}, '', url.toString());
+          this.getReturns();
+        }
+      },
+      watch: {
+        selected: function (newSelected, oldSelected) {
+          const url = new URL(window.location.href);
+          if (newSelected) {
+            url.searchParams.set('return', newSelected.return_id);
+          } else {
+            url.searchParams.delete('return');
+          }
+          window.history.pushState({}, '', url.toString());
+        }
+      },
+      computed: {
+        progress() {
+          if(!this.selected) return 0;
+
+          if (this.selected.return_status === 'OPEN') return 52;
+          if (this.selected.return_status === 'CLOSED') return 100;
+          else return 3;
+        }
+      },
+      mounted() {
+        this.checkReturns();
+      }
+    });
+    app.config.globalProperties.$filters = {
+      money(value) {
+        return McUtils.money(value);
+      },
+      date(value) {
+        return new Date(value).toLocaleDateString('it-IT', {
+          year: 'numeric',
+          month: '2-digit',
+          day: '2-digit'
+        });
+      }
+    }
+    app.config.compilerOptions.isCustomElement = tag => tag.includes('-'); // per evitare che vue vada in conflitto con liquid
+    app.mount(this);
+  }
+
+  getOrderId() {
+    // se l'utente arriva da un link diretto 
+    const params = new URLSearchParams(window.location.search);
+    return params.get('order');
+  }
+}
+if (!window.customElements.get('teddy-return-list')) {
+  window.customElements.define('teddy-return-list', TeddyReturnList);
+}
+window.TeddyReturnList = TeddyReturnList

package/returns/teddy-return-request.js

@@ -0,0 +1,353 @@
+const {createApp} = await import('../res/mc-vue.js');
+await loadComponent('./res/mc-utils.js', false);
+
+class TeddyReturnRequest extends HTMLElement {
+
+  connectedCallback() {
+    const cmp = this;
+    
+    const app = createApp({
+      delimiters: ['${', '}'], // setta i delimitatori di vue, altrimenti se usiamo gli standard va in conflitto con liquid
+      data: () => {
+        return {
+          loading: true, // se mostrare il caricamento o meno
+          returnWhere: null, // reso online o in negozio ('online' o 'store')
+          order: null, // l'ordine ottenuto dalla chiamata
+          orderId: null, // l'id dell'ordine che il cliente cerca o seleziona dalla tendina
+          email: cmp.dataset.email?.length > 0 ? cmp.dataset.email : null, // la mail per cercare l'ordine
+          zip: null, // il cap per cercare l'ordine
+          returnAddress: null, // l'indirizzo di reso
+          btOwner: null, // il nome del proprietario per il bonifico
+          btIban: null, // l'iban per il bonifico
+          returnId: null, // l'id del reso
+          findBy: 'email', // il metodo di ricerca dell'ordine (email o zip)
+          step: cmp.dataset.where != undefined ? 'where': 'find', // il passo corrente (where, store, find, items, address, summary, success, error)
+          error: null, // l'errore da mostrare
+          addressType: 'order', // tab dell'indirizzo selezionato (order, new, pudo)
+          steps: [
+            'where', 'store', 'find', 'items', 'address', 'summary', 'success', 'error'
+          ]
+        } 
+      },
+      methods: {
+        checkOrderUrl: function() {
+          const params = new URLSearchParams(window.location.search);
+          if(!params.has('order')) {
+            this.loading = false;
+            return;
+          }
+          this.orderId = params.get('order');
+          this.searchOrder();
+        },
+        
+        setWhere: function(where) {
+          if(where != null && where != 'online' && where != 'store') {
+            console.error('Invalid returnWhere value: ' + where);
+            return;
+          }
+          this.returnWhere = where;
+          this.step = this.returnWhere ? this.returnWhere == 'online' ? 'find' : 'store' : 'where';
+        },
+
+        searchOrder: function() {
+          this.loading = true;
+          const data = {
+            method: theme.apis.returns.dev ? 'GET' : 'POST',
+            url: theme.apis.returns.search,
+          };
+          if(!theme.apis.returns.dev) {
+            data.data = {
+              order_name: this.orderId,
+              email: this.email,
+              zip: this.zip
+            };
+          }
+          console.log('Searching order with data: ', data);
+          axios(data).then(response => {
+            this.orderFound(response.data);
+          }).catch(error => {
+            this.orderNotFound(error);
+          }).finally(() => {
+            this.loading = false;
+          });
+        },
+
+        createReturn: function() {
+          this.loading = true;
+          const body = {
+            order_id: this.order.order_id, // id dell'ordine
+            /*address: this.returnAddress,
+            payment_method: {
+              same: !this.order.manual,
+              iban: this.btIban || null, // iban del conto corrente, se il metodo era uno manuale
+              owner: this.btOwner || null, // intestatario del conto corrente, se il metodo era uno manuale
+            },*/
+            lines: this.order.lines.filter(l => l.selected).map(l => {
+              return {
+                id: l.id, // id della linea che mi avevi passato in precedenza
+                quantity: l.quantity, // quantità della linea che mi avevi passato in precedenza
+                reason_id: l.reason,
+                reason_note: l.description || (l.reason == 'OTHER' ? 'Non è stato consegnato nei tempi previsti' : null), // motivo del reso, se presente
+              };
+            })
+          };
+          const data = {
+            method: theme.apis.returns.dev ? 'GET' : 'post',
+            url: theme.apis.returns.create
+          };
+          if(!theme.apis.returns.dev) {
+            data.data = body;
+          }
+          console.log('Creating return with data: ', data);
+          axios(data).then(response => {
+            this.returnSuccess(response.data);
+          }).catch(error => {
+            this.returnError(error);
+          }).finally(() => {
+            this.loading = false;
+          });
+        },
+
+        returnSuccess: function(resp) {
+          if(!resp.success || !resp.return_id) {
+            this.returnError(resp);
+            return;
+          }
+
+          this.returnId = resp.return_id;
+          this.step = 'success';
+          this.error = null;
+        },
+
+        returnError: function(e) {
+          McUtils.log(e);
+          this.step = 'error';
+          this.returnId = null;
+          this.error = e.error || e.message || 'Error creating return';
+        },
+
+        orderFound: function(resp) {
+          console.log('Order found: ', resp);
+          if(!resp.success || !resp.order) {
+            this.orderNotFound(resp);
+            return;
+          }
+
+          this.order = resp.order;
+          this.order.lines = this.order.lines.map(i => {
+            i.max = i.quantity; // setto il max della linea al valore della quantità
+            return i;
+          });
+          this.setAddressType(this.order.address ? 'order' : 'new'); // se l'ordine ha un indirizzo, lo uso come predefinito
+          this.error = null;
+          this.step = 'items';
+          McUtils.log(this.order);
+        },
+
+        orderNotFound: function(e) {
+          this.order = null;
+          this.step = 'find';
+          this.error = e.error || e.message || 'Order not found';
+        },
+
+        toFind: function() {
+          this.step = 'find';
+          this.order = null;
+          this.orderId = null;
+          this.email = null;
+          this.zip = null;
+          this.error = null;
+          this.returnAddress = null;
+        },
+
+        toItems: function() {
+          this.step = 'items';
+          this.returnAddress = null;
+          this.addressType = 'order';
+          this.error = null;
+        },
+
+        toAddress: function() {
+          this.step = 'address';
+          this.returnAddress = this.order.address || {};
+          this.error = null;
+        },
+
+        toSummary: function() {
+          this.step = 'summary';
+          this.error = null;
+        },
+
+        setAddressType: function(type) {
+          if(type != null && type != 'order' && type != 'new' && type != 'pudo') {
+            console.error('Invalid addressType value: ' + type);
+            return;
+          }
+          this.addressType = type;
+          this.returnAddress = type == 'order' ? this.order.address : {};
+          console.log('Address type set to: ', this.returnAddress);
+        },
+
+        restart: function() {
+          this.step = 'where';
+          this.returnId = null;
+          this.order = null;
+          this.orderId = null;
+          this.email = null;
+          this.zip = null;
+          this.error = null;
+          this.returnAddress = null;
+          this.btOwner = null;
+        }
+        
+      },
+      computed: {
+        loadingStatus: {
+          get() {
+            if(!this.loading) 
+              return;
+            if(this.order != null) {
+              return 'create';
+            }
+            if(this.orderId != null) {
+              return 'search';
+            }
+            return 'initial';
+          }
+        },
+
+        isFindValid: {
+          get() {
+            if(this.step != 'find') 
+              return true;
+
+            if(cmp.dataset.customer)
+              return this.orderId != null && this.orderId.length > 0;
+
+            return (this.email != null && this.email.length > 0 || this.zip != null && this.zip.length > 0) && this.orderId != null && this.orderId.length > 0;
+          }
+        },
+
+        isItemsValid: {
+          get() {
+            if(this.step != 'items') 
+              return true;
+
+            if(this.order == null || this.order.lines == null)
+              return false;
+
+            const selectedItems = this.order.lines.filter(i => i.selected);
+            console.log('Selected items: ', selectedItems);
+            if (selectedItems.length === 0) return false;
+            if (selectedItems.some(i => !i.reason || i.reason.length === 0)) return false;
+            return true;
+          }
+        },
+
+        isAddressValid: {
+          get() {
+            if(this.step != 'address' || this.addressType != 'new') 
+              return true;
+
+            if(this.returnAddress == null)
+              return false;
+
+            const a = this.returnAddress;
+            
+            return (a.first_name != null && a.first_name.length > 0 || a.last_name != null && a.last_name.length > 0) && (a.address1 != null && a.address1.length > 0) && (a.city != null && a.city.length > 0) && (a.zip != null && a.zip.length > 0) && (a.country != null && a.country.length > 0);
+          }
+        },
+
+        isSummaryValid: {
+          get() {
+            if(this.step != 'summary') 
+              return true;
+            
+            return this.order.manual ? this.btOwner?.length > 0 && this.btIban?.length > 0 : true;
+          }
+        },
+
+        isWhereValid: {
+          get() {
+            if(this.step != 'where') 
+              return true;
+
+            return this.returnWhere == 'online' || this.returnWhere == 'store';
+          }
+        },
+
+        returnItems: {
+          get() {
+            if(this.order == null || this.order.lines == null)
+              return [];
+
+            return this.order.lines.filter(i => i.selected);
+          }
+        }, 
+
+        returnTotal: {
+          get() {
+            if(this.order == null || this.order.lines == null)
+              return 0;
+
+            // Usa final_price (prezzo scontato) se disponibile, altrimenti price (prezzo originale)
+            return this.order.lines.filter(i => i.selected).reduce((acc, i) => {
+              const itemPrice = i.final_price !== undefined ? i.final_price : i.price;
+              return acc + itemPrice/i.max*i.quantity;
+            }, 0);
+          }
+        },
+
+        address: {
+          get() {
+            if(this.returnAddress == null)
+              return '';
+
+            const first_name = this.returnAddress.first_name || '';
+            const last_name = this.returnAddress.last_name || '';
+            const company = this.returnAddress.company || '';
+            const address1 = this.returnAddress.address1 || '';
+            const a = this.returnAddress;
+            
+            const address2 = a.address2 || '';
+            const city = a.city || '';
+            const province = a.province ? `(${a.province})` : '';
+            const zip = a.zip || '';
+            const country = a.country || '';
+            const phone = a.phone || '';
+            
+            const line1 = first_name.length || last_name.length ? `${first_name} ${last_name}<br>` : '';
+            const line2 = company.length ? `${company}<br>` : '';
+            const line3 = address1.length ? `${address1}<br>` : '';
+            const line4 = address2.length ? `${address2}<br>` : '';
+            const line5 = city.length || province.length || zip.length ? `${city} ${province} ${zip}<br>` : '';
+            const line6 = country.length ? `${country}<br>` : '';
+            const line7 = phone.length ? phone : '';
+            return `${line1}${line2}${line3}${line4}${line5}${line6}${line7}`;
+          }
+        }
+      },
+      mounted() {
+        this.checkOrderUrl();
+      }
+    });
+    app.config.globalProperties.$filters = {
+      money(value) {
+        return McUtils.money(value);
+      }
+    }
+    app.config.compilerOptions.isCustomElement = tag => tag.includes('-'); // per evitare che vue vada in conflitto con liquid
+    app.mount(this);
+  }
+
+  getOrderId() {
+    // se l'utente arriva da un link diretto 
+    const params = new URLSearchParams(window.location.search);
+    return params.get('order')?.replace('#', '') || null;
+  }
+  
+}
+if (!window.customElements.get('teddy-return-request')) {
+  window.customElements.define('teddy-return-request', TeddyReturnRequest);
+}
+window.TeddyReturnRequest = TeddyReturnRequest;

package/scripts/publish-store.js

@@ -0,0 +1,62 @@
+#!/usr/bin/env node
+const fs = require('fs');
+const path = require('path');
+const {execSync} = require('child_process');
+const readline = require('readline');
+
+const rl = readline.createInterface({
+  input: process.stdin,
+  output: process.stdout,
+});
+
+const ask = (question, defaultValue) => new Promise((resolve) => {
+  const suffix = defaultValue ? ` (${defaultValue})` : '';
+  rl.question(`${question}${suffix}: `, (answer) => {
+    resolve(answer.trim() || defaultValue || '');
+  });
+});
+
+const sanitizeTagPart = (value) => value
+  .toLowerCase()
+  .replace(/[^a-z0-9-]/g, '-')
+  .replace(/-+/g, '-')
+  .replace(/^-|-$/g, '');
+
+(async () => {
+  try {
+    const pkgPath = path.join(process.cwd(), 'package.json');
+    const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf8'));
+    const currentVersion = pkg.version;
+
+    console.log(`Current version: ${currentVersion}`);
+
+    const storeRaw = await ask('Store name (used for npm dist-tag)', '');
+    const store = sanitizeTagPart(storeRaw);
+    if (!store) {
+      console.error('Store name is required.');
+      process.exit(1);
+    }
+
+    const bump = await ask('Version bump (patch/minor/major/prerelease)', 'patch');
+    const npmVersionArgs = ['npm', 'version', bump];
+    if (bump === 'prerelease') {
+      const preid = await ask('Prerelease identifier (preid)', 'beta');
+      npmVersionArgs.push(`--preid=${preid}`);
+    }
+
+    console.log(`Running: ${npmVersionArgs.join(' ')}`);
+    const newVersionRaw = execSync(npmVersionArgs.join(' '), {encoding: 'utf8'}).trim();
+    const newVersion = newVersionRaw.replace(/^v/, '');
+
+    const tag = `${store}-${newVersion}`;
+    console.log(`Publishing with dist-tag "${tag}"...`);
+    execSync(`npm publish --access public --tag ${tag}`, {stdio: 'inherit'});
+
+    console.log(`Done. Published ${pkg.name}@${newVersion} with tag "${tag}".`);
+  } catch (err) {
+    console.error(err.message);
+    process.exit(1);
+  } finally {
+    rl.close();
+  }
+})();

package/test/auth-login-error.json

@@ -0,0 +1,4 @@
+{
+  "success": false,
+  "error": "Invalid credentials"
+}