Biuletyn programisty Vtiger CRM

Korzystając z Kreatora aplikacji, możesz:

Twórz specjalistyczne aplikacje internetowe w chmurze dla klientów.
Korzystaj z bogatych aplikacji internetowych po stronie klienta, korzystając z dowolnego frameworka.

Proszę przeczytaj nasz artykuł aby dowiedzieć się, jak korzystać z Kreatora aplikacji.

Czy chcesz uzyskać dostęp do Kreatora aplikacji? Proszę wysłać zapytanie do [email chroniony].

Przykładowa aplikacja — Flipbook

Oto przykładowa aplikacja, którą możesz wypróbować!

Poniżej znajduje się skrypt aplikacji internetowej - Flipbook:

widoki/indeks.html


  <!DOCTYPE html>
<html>
    <head>
        <title>VTAP Flipbook</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="resources/index.css">
        <script 
        src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js">
        </script>
        <script
        src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/9729/turn.min.js">
        </script>
    </head>
    <body>
        <div id="flipbook" class="sample-flipbook">
            <div class="hard"> Vtiger Platform </div>
            <div class="hard"></div>
            <div> Build creative apps </div>
            <div> to business much easily </div>
            <div> than ever before. </div>
            <div> Thank you! </div>
            <div class="hard"></div>
            <div class="hard"></div>
        </div>
        <script src="resources/vcap.js"></script>
        <script src="resources/index.js"></script>
    </body>
</html>


  <!DOCTYPE html>
<html>
    <head>
        <title>VTAP Flipbook</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="resources/index.css">
        <script 
        src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js">
        </script>
        <script
        src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/9729/turn.min.js">
        </script>
    </head>
    <body>
        <div id="flipbook" class="sample-flipbook">
            <div class="hard"> Vtiger Platform </div>
            <div class="hard"></div>
            <div> Build creative apps </div>
            <div> to business much easily </div>
            <div> than ever before. </div>
            <div> Thank you! </div>
            <div class="hard"></div>
            <div class="hard"></div>
        </div>
        <script src="resources/vcap.js"></script>
        <script src="resources/index.js"></script>
    </body>
</html>

zasoby/indeks.js


  CAP.event.on('app.loaded', function(){
    $("#flipbook").turn({
    width: 400,
    height: 300,
    autoCenter: true
  });
});


  CAP.event.on('app.loaded', function(){
    $("#flipbook").turn({
    width: 400,
    height: 300,
    autoCenter: true
  });
});

zasoby/indeks.css


  .sample-flipbook{
      width:400px;
      height:200px;
      -webkit-transition:margin-left 0.2s;
      -moz-transition:margin-left 0.2s;
      -ms-transition:margin-left 0.2s;
      -o-transition:margin-left 0.2s;
      transition:margin-left 0.2s;
}
.sample-flipbook .page{
      width:200px;
      height:200px;
      background-color:white;
      line-height:300px;
      font-size:20px;
}
.sample-flipbook .page-wrapper{
      -webkit-perspective:2000px; 
      -moz-perspective:2000px;
      -ms-perspective:2000px;
      -o-perspective:2000px;
      perspective:2000px;
}
.sample-flipbook .hard{
      background:#ccc !important;
      color:#333;
      -webkit-box-shadow:inset 0 0 5px #666;
      -moz-box-shadow:inset 0 0 5px #666;
      -o-box-shadow:inset 0 0 5px #666;
      -ms-box-shadow:inset 0 0 5px #666;
      box-shadow:inset 0 0 5px #666;
      font-weight:bold;
}
.sample-flipbook.odd{
        background:-webkit-gradient(linear, right top, left top,
        color-stop(0.95, #FFF), color-stop(1, #DADADA));
        background-image:-webkit-linear-gradient(right, #FFF 95%, #C4C4C4 100%);
        background-image:-moz-linear-gradient(right, #FFF 95%, #C4C4C4 100%);
        background-image:-ms-linear-gradient(right, #FFF 95%, #C4C4C4 100%);
        background-image:-o-linear-gradient(right, #FFF 95%, #C4C4C4 100%);
        background-image:linear-gradient(right, #FFF 95%, #C4C4C4 100%);
        -webkit-box-shadow:inset 005px#666;
        -moz-box-shadow:inset 005px#666;
        -o-box-shadow:inset 005px#666;
        -ms-box-shadow:inset 005px#666;
        box-shadow:inset 005px#666;
}
.sample-flipbook.even{
        background:-webkit-gradient(linear, left top, right top,
        color-stop(0.95, #fff), color-stop(1, #dadada));
        background-image:-webkit-linear-gradient(left, #fff 95%, #dadada 100%);
        background-image:-moz-linear-gradient(left, #fff 95%, #dadada 100%);
        background-image:-ms-linear-gradient(left, #fff 95%, #dadada 100%);
        background-image:-o-linear-gradient(left, #fff 95%, #dadada 100%);
        background-image:linear-gradient(left, #fff 95%, #dadada 100%);
        -webkit-box-shadow:inset 005px#666;
        -moz-box-shadow:inset 005px#666;
        -o-box-shadow:inset 005px#666;
        -ms-box-shadow:inset 005px#666;
        box-shadow:inset 005px#666;
}


  .sample-flipbook{
      width:400px;
      height:200px;
      -webkit-transition:margin-left 0.2s;
      -moz-transition:margin-left 0.2s;
      -ms-transition:margin-left 0.2s;
      -o-transition:margin-left 0.2s;
      transition:margin-left 0.2s;
}
.sample-flipbook .page{
      width:200px;
      height:200px;
      background-color:white;
      line-height:300px;
      font-size:20px;
}
.sample-flipbook .page-wrapper{
      -webkit-perspective:2000px; 
      -moz-perspective:2000px;
      -ms-perspective:2000px;
      -o-perspective:2000px;
      perspective:2000px;
}
.sample-flipbook .hard{
      background:#ccc !important;
      color:#333;
      -webkit-box-shadow:inset 0 0 5px #666;
      -moz-box-shadow:inset 0 0 5px #666;
      -o-box-shadow:inset 0 0 5px #666;
      -ms-box-shadow:inset 0 0 5px #666;
      box-shadow:inset 0 0 5px #666;
      font-weight:bold;
}
.sample-flipbook.odd{
        background:-webkit-gradient(linear, right top, left top,
        color-stop(0.95, #FFF), color-stop(1, #DADADA));
        background-image:-webkit-linear-gradient(right, #FFF 95%, #C4C4C4 100%);
        background-image:-moz-linear-gradient(right, #FFF 95%, #C4C4C4 100%);
        background-image:-ms-linear-gradient(right, #FFF 95%, #C4C4C4 100%);
        background-image:-o-linear-gradient(right, #FFF 95%, #C4C4C4 100%);
        background-image:linear-gradient(right, #FFF 95%, #C4C4C4 100%);
        -webkit-box-shadow:inset 005px#666;
        -moz-box-shadow:inset 005px#666;
        -o-box-shadow:inset 005px#666;
        -ms-box-shadow:inset 005px#666;
        box-shadow:inset 005px#666;
}
.sample-flipbook.even{
        background:-webkit-gradient(linear, left top, right top,
        color-stop(0.95, #fff), color-stop(1, #dadada));
        background-image:-webkit-linear-gradient(left, #fff 95%, #dadada 100%);
        background-image:-moz-linear-gradient(left, #fff 95%, #dadada 100%);
        background-image:-ms-linear-gradient(left, #fff 95%, #dadada 100%);
        background-image:-o-linear-gradient(left, #fff 95%, #dadada 100%);
        background-image:linear-gradient(left, #fff 95%, #dadada 100%);
        -webkit-box-shadow:inset 005px#666;
        -moz-box-shadow:inset 005px#666;
        -o-box-shadow:inset 005px#666;
        -ms-box-shadow:inset 005px#666;
        box-shadow:inset 005px#666;
}

Zapisz i opublikuj i uruchom aplikację, aby zobaczyć ją w akcji.

VTAPIT — narzędzie wiersza poleceń

VTAPIT - Wprowadzenie

VTAPIT to narzędzie wiersza poleceń, które umożliwia opracowywanie i zarządzanie aplikacjami VTAP utworzonymi z Kreatora aplikacji (Platforma > Aplikacje). Ma podpolecenia podobne do narzędzia GIT, co ułatwia naukę i rozpoczęcie pracy.

Rozpocznij

Utwórz nową aplikację (aplikację testową) w Vtiger CRM > Platforma > App Creator (aplikacje)
Pobierz swój system operacyjny zgodny z plikiem wykonywalnym - https://extend.vtiger.com/vtap/vtapit/dist Polecenia podrzędne

VTAPIT - Wprowadzenie

Rozpocznij

Utwórz nową aplikację (aplikację testową) w Vtiger CRM > Platforma > App Creator (aplikacje)
Pobierz swój system operacyjny zgodny z plikiem wykonywalnym - https://extend.vtiger.com/vtap/vtapit/dist Polecenia podrzędne

Clone	Wykonaj kopię aplikacji utworzonej w CRM do lokalnego katalogu roboczego.
run	Włącza środowisko wykonawcze w lokalnym katalogu roboczym, który wykorzystuje pliki lokalne i CRM Apis do danych.
Dodaj	Nowo utworzone pliki lokalne można dodawać do aplikacji CRM.
Naciskać	Przesyła wszystkie lokalne zmiany (dodawanie lub modyfikowanie funkcji) dokonane w plikach do aplikacji CRM.
Ciągnąć	Pobiera wszystkie zmiany z aplikacji CRM z powrotem do lokalnego katalogu roboczego. Jeśli plik został zmieniony w CRM, ale nie w katalogu lokalnym, tworzony jest plik znacznika konfliktu. Musisz użyć narzędzia porównywania, aby porównać zmiany, a następnie użyć polecenia podrzędnego Rozwiąż.
Rozwiązać	Wskazuje konfliktowe (różnicowe) zmiany, które udało Ci się przejrzeć.
Publikować	Po wypchnięciu wszystkich zmian lokalnych — użyj tego polecenia podrzędnego, aby je udostępnić.

Clone

klon vtapit --crmapp=test aplikacji --crmurl=https://your.odx.vtiger.crm --crmuser=[email chroniony] --crmpass=******** lokalny_katalog/testapp

run

cd katalog_lokalny/testapp

bieg vtapit --crmurl=https://your.odx.vtiger.crm --crmuser=[email chroniony] --crmpass=**********

Dodaj

cd katalog_lokalny/testapp

vtapit dodaj ścieżka_do_nowego_pliku

Naciskać

cd katalog_lokalny/testapp

naciśnij przycisk vtapit --crmurl=https://your.odx.vtiger.crm --crmuser=[email chroniony] --crmpass=**********

Ciągnąć

cd katalog_lokalny/testapp

pociągnięcie vtapitu --crmurl=https://your.odx.vtiger.crm --crmuser=[email chroniony] --crmpass=**********

Rozwiązać

cd katalog_lokalny/testapp

rozwiązanie vtapit ścieżka_do_pliku

Publikować

cd katalog_lokalny/testapp

opublikuj vtapit --crmurl=https://your.odx.vtiger.crm --crmuser=[email chroniony] --crmpass=**********

Uwaga: Możesz skonfigurować zmienne środowiskowe CRM, aby uniknąć powtarzania w wierszu poleceń.

CRM_URL=https://crm.url.tld

[email chroniony]

CRM_PASSWORD=przepustka

CRM_APP=nazwa aplikacji

Clone

klon vtapit --crmapp=test aplikacji --crmurl=https://your.odx.vtiger.crm --crmuser=[email chroniony] --crmpass=******** lokalny_katalog/testapp

run

cd katalog_lokalny/testapp

bieg vtapit --crmurl=https://your.odx.vtiger.crm --crmuser=[email chroniony] --crmpass=**********

Dodaj

cd katalog_lokalny/testapp

vtapit dodaj ścieżka_do_nowego_pliku

Naciskać

cd katalog_lokalny/testapp

naciśnij przycisk vtapit --crmurl=https://your.odx.vtiger.crm --crmuser=[email chroniony] --crmpass=**********

Ciągnąć

cd katalog_lokalny/testapp

pociągnięcie vtapitu --crmurl=https://your.odx.vtiger.crm --crmuser=[email chroniony] --crmpass=**********

Rozwiązać

cd katalog_lokalny/testapp

rozwiązanie vtapit ścieżka_do_pliku

Publikować

cd katalog_lokalny/testapp

opublikuj vtapit --crmurl=https://your.odx.vtiger.crm --crmuser=[email chroniony] --crmpass=**********

Uwaga: Możesz skonfigurować zmienne środowiskowe CRM, aby uniknąć powtarzania w wierszu poleceń.

CRM_URL=https://crm.url.tld

[email chroniony]

CRM_PASSWORD=przepustka

CRM_APP=nazwa aplikacji

Już wkrótce — Projektant modułów 2.0

Projektant modułów 2.0 będzie oferować prostszy interfejs użytkownika. Umożliwia dodawanie niestandardowych przycisków i akcji za pomocą trybu Projektanta.

Tryb projektanta, po włączeniu, podświetli wszystkie symbole zastępcze na stronach, na których można dodawać niestandardowe przyciski, ikony i widżety. Wystarczy kliknąć i wybrać nazwę oraz napisać aktywną funkcję javascript.

Projektant modułów 2.0 będzie oferować prostszy interfejs użytkownika. Umożliwia dodawanie niestandardowych przycisków i akcji za pomocą trybu Projektanta.

Zarejestruj się, aby otrzymywać najnowsze aktualizacje!

Wyrażam zgodę na wysyłanie przez Vtiger aktualizacji o nowościach i innych interesujących lektur.

Czytałem Polityka prywatności firmy Vtiger.

Prawa autorskie 2024 Vtiger. Wszelkie prawa zastrzeżone. Różne znaki handlowe będące własnością ich właścicieli.