Bản tin dành cho nhà phát triển Vtiger CRM

Sử dụng Trình tạo ứng dụng, bạn có thể:

Xây dựng các ứng dụng web đám mây chuyên dụng cho khách hàng.
Sử dụng các ứng dụng web phía máy khách phong phú bằng bất kỳ khung nào.

Vui lòng đọc bài viết của chúng tôi để tìm hiểu cách sử dụng Trình tạo ứng dụng.

Bạn có muốn truy cập Trình tạo ứng dụng không? Vui lòng gửi yêu cầu đến [email được bảo vệ].

Ứng dụng mẫu - Flipbook

Đây là một ứng dụng mẫu mà bạn có thể dùng thử!

Sau đây là kịch bản cho một ứng dụng web - Flipbook:

lượt xem/index.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>

tài nguyên/index.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
  });
});

tài nguyên/index.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;
}

Lưu và xuất bản và khởi chạy ứng dụng để xem nó hoạt động.

VTPIT - Công cụ dòng lệnh

VTPIT - Giới thiệu

VTAPIT là một công cụ Dòng lệnh cho phép bạn phát triển và quản lý Ứng dụng VTAP được tạo từ Trình tạo ứng dụng (Nền tảng > Ứng dụng). Nó có các lệnh phụ tương tự như công cụ GIT, giúp bạn dễ dàng tìm hiểu và bắt đầu.

Bắt Đầu

Tạo một ứng dụng mới (testapp) trên Vtiger CRM > Nền tảng > Trình tạo ứng dụng (Ứng dụng)
Tải xuống hệ điều hành của bạn tương thích với tệp thực thi - https://extend.vtiger.com/vtap/vtapit/dist Lệnh phụ

VTPIT - Giới thiệu

Bắt Đầu

Tạo một ứng dụng mới (testapp) trên Vtiger CRM > Nền tảng > Trình tạo ứng dụng (Ứng dụng)
Tải xuống hệ điều hành của bạn tương thích với tệp thực thi - https://extend.vtiger.com/vtap/vtapit/dist Lệnh phụ

Clone	Tạo một bản sao của ứng dụng được tạo trong CRM vào thư mục làm việc cục bộ của bạn.
chạy	Bật thời gian chạy trên thư mục làm việc cục bộ, sử dụng các tệp cục bộ và CRM Apis cho dữ liệu.
Thêm	Các tệp cục bộ mới được tạo có thể được thêm vào ứng dụng CRM.
Đẩy	Tải tất cả các thay đổi cục bộ (thêm hoặc sửa đổi chức năng) được thực hiện đối với các tệp lên ứng dụng CRM.
Kéo	Tải xuống tất cả các thay đổi từ ứng dụng CRM trở lại thư mục làm việc cục bộ. Nếu một tệp đã thay đổi trong CRM nhưng không thay đổi trong thư mục cục bộ thì tệp đánh dấu xung đột sẽ được tạo. Bạn cần sử dụng công cụ tìm khác biệt để so sánh các thay đổi và sau đó sử dụng lệnh phụ Resolve.
Giải quyết	Cho biết các thay đổi xung đột (khác biệt) mà bạn đã quản lý để xem xét.
Xuất bản	Khi tất cả các thay đổi cục bộ được đẩy - hãy sử dụng lệnh phụ này để làm cho nó khả dụng.

Clone

bản sao vtapit --crmapp=testapp --crmurl=https://your.odx.vtiger.crm --crmuser=[email được bảo vệ] --crmpass=******** local_dir/testapp

chạy

cd local_dir/testapp

vtapit chạy --crmurl=https://your.odx.vtiger.crm --crmuser=[email được bảo vệ] --crmpass=********

Thêm

cd local_dir/testapp

thêm vtapit đường dẫn đến_new_file

Đẩy

cd local_dir/testapp

đẩy vtapit --crmurl=https://your.odx.vtiger.crm --crmuser=[email được bảo vệ] --crmpass=********

Kéo

cd local_dir/testapp

vtapit kéo --crmurl=https://your.odx.vtiger.crm --crmuser=[email được bảo vệ] --crmpass=********

Giải quyết

cd local_dir/testapp

giải quyết vtapit đường_đến_tệp

Xuất bản

cd local_dir/testapp

vtapit xuất bản --crmurl=https://your.odx.vtiger.crm --crmuser=[email được bảo vệ] --crmpass=********

Lưu ý: Bạn có thể thiết lập các biến môi trường CRM để tránh lặp lại trên dòng lệnh.

CRM_URL=https://crm.url.tld

[email được bảo vệ]

CRM_PASSWORD=vượt qua

CRM_APP=tên ứng dụng

Clone

bản sao vtapit --crmapp=testapp --crmurl=https://your.odx.vtiger.crm --crmuser=[email được bảo vệ] --crmpass=******** local_dir/testapp

chạy

cd local_dir/testapp

vtapit chạy --crmurl=https://your.odx.vtiger.crm --crmuser=[email được bảo vệ] --crmpass=********

Thêm

cd local_dir/testapp

thêm vtapit đường dẫn đến_new_file

Đẩy

cd local_dir/testapp

đẩy vtapit --crmurl=https://your.odx.vtiger.crm --crmuser=[email được bảo vệ] --crmpass=********

Kéo

cd local_dir/testapp

vtapit kéo --crmurl=https://your.odx.vtiger.crm --crmuser=[email được bảo vệ] --crmpass=********

Giải quyết

cd local_dir/testapp

giải quyết vtapit đường_đến_tệp

Xuất bản

cd local_dir/testapp

vtapit xuất bản --crmurl=https://your.odx.vtiger.crm --crmuser=[email được bảo vệ] --crmpass=********

Lưu ý: Bạn có thể thiết lập các biến môi trường CRM để tránh lặp lại trên dòng lệnh.

CRM_URL=https://crm.url.tld

[email được bảo vệ]

CRM_PASSWORD=vượt qua

CRM_APP=tên ứng dụng

Sắp ra mắt - Trình thiết kế mô-đun 2.0

Trình thiết kế mô-đun 2.0 sẽ đến với cách tiếp cận giao diện người dùng đơn giản hơn. Nó cho phép bạn thêm các nút và hành động tùy chỉnh bằng chế độ Nhà thiết kế.

Chế độ Nhà thiết kế, sau khi được bật, sẽ đánh dấu tất cả các trình giữ chỗ trên các trang nơi có thể thêm các nút, biểu tượng và tiện ích tùy chỉnh. Bạn chỉ cần nhấp chọn tên và viết hàm javascript có thể thao tác.

Đăng ký để nhận thông tin cập nhật mới nhất!

Tôi đồng ý để Vtiger gửi cập nhật những nội dung mới và những bài đọc thú vị khác.

Tôi đã đọc Chính sách bảo mật của Vtiger.

Bản quyền 2026 Vtiger. Đã đăng ký Bản quyền. Nhãn hiệu khác nhau được tổ chức bởi chủ sở hữu tương ứng của họ.