Alberto Ortega's questions

I have a component that displays the card payment option.

I am trying to load the conekta script only when it is needed. When the component that occupies the connect script is rendered, in the created hook I load the script.

created() {
    if (document.getElementById("conekta")) return; // was already loaded
    var scriptTag = document.createElement("script");
    scriptTag.src = "https://cdn.conekta.io/js/latest/conekta.js";
    scriptTag.id = "conekta";
    document.getElementsByTagName("head")[0].appendChild(scriptTag);
},

What I don't like about this is that it generates errors that the Conekta object does not exist

I thought about downloading the cdn and uploading it as a static file using functions like require or import but this would cause me problems if conekta updated their cdn script.

also try to listen to the ready or load event of the script but it doesn't work either

function loadScript() {
  if (document.getElementById("conekta")) return; // was already loaded
  var scriptTag = document.createElement("script");
  scriptTag.src = "https://cdn.conekta.io/js/latest/conekta.js";
  scriptTag.id = "conekta";
  document.getElementsByTagName("head")[0].appendChild(scriptTag);

  document.getElementById("conekta").addEventListener("load", function(){
  
     component = { my component };
  });
 
  export default component;
}
loadScript();

I am programming the client of an api with typescript. I use axios and vuex,

this is the code

import { CredentialsInterface } from '../store/Interfaces/auth';
import Store from '@/store/index';
import axios from 'axios';


class AuthenticateClient {
    http: any;
    credentials: CredentialsInterface;
    constructor() {
        this.credentials = Store.getters.credentials;
        console.log(this.credentials);

        this.http = axios.create({
            baseURL: 'https://api.dashboarda.proyect',
            headers: {
                Accept: 'application/json',
                'Content-Type': 'application/json',
                Authorization:
                    this.credentials.tokenType + ' ' + this.credentials.token
            }
        });
    }

    async get(endPoint: string, data: any) {
        console.log(this.http);
        try {
            return await this.http.get(endPoint);
        } catch (error) {
            if (error.response.status == 401) {
                Store.commit('deleteSession');
            }
        }
    }

    async post(endPoint: string, data: any) {
        try {
            return await this.http.post(endPoint, data);
        } catch (error) {
            if (error.response.status == 401) {
                Store.commit('deleteSession');
            }
        }
    }
}

export default new AuthenticateClient();

The problem you have is that it does not initialize the token and the token_type

These are the headers with which the request comes out:

And in the console if the credentials are initialized

I know it's a synchronization problem because when the function is executed, the vuex variables are not yet loaded.

However I can't return a promise to the constructor or I don't know how to do this.

Hello, I have an arrayobject which has the following form:

[
   {
      id: 1,
      Nombre: "Asociación",
      Url: "https://google.com"
   }
]

When I pass it through json_encodeit encodes the vowels or special characters.

json_encode($array);

[
  {
     id: 1,
     Nombre: "Asociaci/u001n",
     Url: "https:\/\/google.com"
  }
]

I need that I don't escape the /special characters.

 json_encode($a, JSON_UNESCAPED_UNICODE, JSON_UNESCAPED_SLASHES);

But what I do does not apply.

I've been reading up on the subject. As I understood angular I add a functionality that causes the styles of a component to be encapsulated. I didn't quite understand how this works. But I understood that to refer to the component styles there are two ways:

Yesterday I asked this but it was too late so I had no answers.

:host{
  ion-content {
    background: red;
  }
}

// O esta otra forma

page-name{
    ion-content{
       background: red;
    }
}

My problem is that it doesn't work directly for me. I always have to do the following.

:host{
  ion-content {
    --background: red;
  }
}

In this way if the styles are taken. But they do recur. So if I rewrite the styles of an ionic component, it applies to all children of this component.

This is the code I have. I hope you can help me.

HTML

<ion-content class="background">
  <ion-card-content>
    <img class="logo" src="assets/logo/579358.svg" alt="">
    <ion-card-header>
      <ion-card-title text-center>Reading the barcode</ion-card-title>
      <ion-card-subtitle text-center>welcome to the your new app</ion-card-subtitle>
    </ion-card-header>
    <form [formGroup]="loginForm">
      <ion-item>
        <ion-label position="floating">
          email
        </ion-label>
        <ion-input formControlName="email" type="text" name="email"></ion-input>
      </ion-item>
      <div class="error-messages">
        <ng-container *ngFor="let error of error_messages.email">
          <div class="error-message"
            *ngIf="loginForm.get('email').hasError(error.type) && (loginForm.get('email').dirty || loginForm.get('email').touched)">
            {{ error.message }}
          </div>
        </ng-container>

      </div>
      <ion-item>
        <ion-label position="floating">
          password
        </ion-label>
        <ion-input formControlName="password" type="password" name="password"></ion-input>
      </ion-item>
      <div class="error-messages">
        <ng-container *ngFor="let error of error_messages.password">
          <div class="error-message"
            *ngIf="loginForm.get('password').hasError(error.type) && (loginForm.get('password').dirty || loginForm.get('password').touched)">
            {{ error.message }}


          </div>
        </ng-container>

      </div>
      <br>
      <ion-button (click)="onLogin()" [disabled]="!loginForm.valid" expand="block" shape="round">
        <ion-icon slot="start" name="contact"></ion-icon>
        Login
      </ion-button>
    </form>
  </ion-card-content>
</ion-content>

SCSS

:host {
    ion-content {
        --background: url("./../../../../assets/App/7243-01-low-poly-background-16x9-1.jpg") !important;
        --ion-background-color: #006ff8 !important;
        background-position: center, center !important;
        background-repeat: no-repeat !important;
        background-size: cover !important;
    }
}

Hello everybody and thanks in advance.

I am doing a query on a pivot table that contains the relationship between two tables.

this result is caused by this query.

SELECT
    UserID,
    CASE 
        WHEN RespuestaID = 1 THEN Texto
    END ,
    CASE 
        WHEN RespuestaID = 2 THEN Texto
    end 
FROM Respuestas
WHERE RespuestaID in (1,2) AND UserID < 5

The result I expect is this.

In summary. What I'm trying to do is group by the UserID. But I don't know how to do it since in SQLserver it doesn't allow you to group by a single field.

The second query was made with multiple joins to the same table. But I want a more efficient query since the one I do now is very slow.

This is the example of the query that I do to get the grouped data.

SELECT 
    t1.UserID,
    t1.Texto as field1,
    t2.Texto as field2
FROM users u
JOIN RespuestasContactos t1
ON t1.UserID = u.id AND t1.RespuestaID = 1
JOIN RespuestasContactos t2
ON t2.UserID = u.id AND t2.RespuestaID = 2
WHERE u.id < 5

I have an array as follows.

[ "icono-5-4", "icono-7-6", "icono-8-7", "icono-9-8", "icono-1-0", "icono-2-1" ]

I want to reactively remove an element: I will know the name of the element until the user clicks a button. Example, if the client clicks a button and the button has the value icon-9-8

I would have to delete that element from my array

[ "icono-5-4", "icono-7-6", "icono-8-7", "icono-1-0", "icono-2-1" ]

and so on for this I use:

_.pull(this.array, 'icono-9-8');

but this is not reactive or does not do it as fast as I want.

this.array.slice(id, 1)

Hi, I need to make a query between two date and time.

$data = Modelo::whereBetween('created_at', ['2018/11/10 12:00', '2018/11/11 10:30'])
->get();

But doing this query brings me all the results between the dates without taking into account the hours.

Dates are automatically saved with Eloquent

And apart I do the following to format the dates that I am going to look for:

Carbon::now()->parse($date)->format('Y-m-d H:i:s');

I need to have a query builder. The only way I have come up with is to make a string, and on the string form the eloquent query. I only have problem executing the query.

$variable = "where('a','asd')->get()";
return Modelo::$variable;

This error comes out:

Access to undeclared static property: App\Models\Api\Ela\Model::$variable"

fetch n records

Modelo::where('llave', '>', $var)->take($n)->get();

it fails because it does not know which records to bring it is missing

latest()

Modelo::all()->take($n);

The same thing happens to this query as the one above is missing the lastest argument

Records between a and b

Modelo::whereIn('campo',[$a,$b])->take($n)->get();

This query should return the fields that are between a and b but it only returns those that match a and b

The queries, even though the parameters are already predefined, are variables for my API. Only when I try to run these queries it fails.

I am working with laravel and using eloquent to query my SQL database, I need to make a query to get the records of a table. Said query should only bring the data that was created 10 days ago and that is not validated.

Modelo::where('Validacion', '!=', 1)
->whereDate('created_at', '=', Carbon::now()->format('Y-m-d'))
->get();

I don't know how to calculate the current date minus 10 days.