Bu sayfa, Cloud Translation API ile çevrilmiştir.

Google Workspace Eklentileriyle e-postaları daha işlem yapılabilir hale getirin

1. Genel Bakış

Bu codelab'de, kullanıcıların bir e-postadaki makbuz verilerini doğrudan Gmail'de bir e-tabloya eklemesine olanak tanıyan bir Google Workspace Eklentisi yazmak için Google Apps Komut Dosyası'nı kullanacaksınız. Kullanıcı e-postayla makbuz aldığında, ilgili gider bilgilerini e-postadan otomatik olarak alan eklentiyi açar. Kullanıcı gider bilgilerini düzenleyebilir ve ardından harcamasını bir Google E-Tablolar e-tablosuna kaydetmek için bu bilgileri gönderebilir.

Neler öğreneceksiniz?

Google Apps Komut Dosyası'nı kullanarak Gmail için Google Workspace eklentisi oluşturun
Google Apps Komut Dosyası ile e-postaları ayrıştırma
Google Apps Komut Dosyası üzerinden Google E-Tablolar ile etkileşim kurma
Google Apps Komut Dosyası'nın Özellikler hizmetini kullanarak kullanıcı değerlerini depolayın

Gerekenler

İnternete ve web tarayıcısına erişim
Google Hesabı
Gmail'deki bazı iletiler (tercihen e-posta makbuzları)

2. Örnek kodu alın

Bu codelab'de çalışırken yazacağınız kodun çalışan bir sürümüne referans vermeniz faydalı olabilir. GitHub deposu, referans olarak kullanabileceğiniz örnek kod içerir.

Örnek kodu almak için komut satırında şu komutu çalıştırın:

git clone https://github.com/googleworkspace/gmail-add-on-codelab.git

3. Temel eklenti oluşturma

E-posta ile birlikte harcama formunu gösteren, eklentinin basit bir sürümünün kodunu yazarak başlayın.

Öncelikle yeni bir Apps Komut Dosyası projesi oluşturun ve projenin manifest dosyasını açın.

script.google.com adresine gidin. Buradan Apps Komut Dosyası projelerinizi oluşturabilir, yönetebilir ve izleyebilirsiniz.
Yeni proje oluşturmak için sol üstte Yeni Proje'yi tıklayın. Yeni proje, Code.gs adlı varsayılan bir dosyayla açılır. Code.gs uygulamasını şimdilik rahat bırakın, daha sonra çalışmanız gerekir.
Adsız proje'yi tıklayın, projenize Gider! adını verin ve Yeniden Adlandır'ı tıklayın.
Solda Proje Ayarları 'nı tıklayın.
Show "appscript.json" dosyasını seçin. manifest dosyası düzenleyicide" onay kutusunu işaretleyin.
Düzenleyici 'yi tıklayın.
Manifest dosyasını açmak için soldaki appscript.json simgesini tıklayın.

appscript.json ürününde, eklentiyle ilişkili meta verileri (ör. uygulamanın adı ve gerektirdiği izinler) belirtin. appsscript.json içeriğini şu yapılandırma ayarlarıyla değiştirin:

{
  "timeZone": "GMT",
  "oauthScopes": [
    "https://www.googleapis.com/auth/gmail.addons.execute"
  ],
  "gmail": {
    "name": "Expense It!",
    "logoUrl": "https://www.gstatic.com/images/icons/material/system/1x/receipt_black_24dp.png",
    "contextualTriggers": [{
      "unconditional": {
      },
      "onTriggerFunction": "getContextualAddOn"
    }],
    "primaryColor": "#41f470",
    "secondaryColor": "#94f441"
  }
}

Manifestin contextualTriggers adlı bölümüne özellikle dikkat edin. Manifestin bu bölümü, eklenti ilk kez etkinleştirildiğinde çağrılacak kullanıcı tanımlı işlevi tanımlar. Bu durumda getContextualAddOn işlevini çağırır. Bu çağrı, açık e-postayla ilgili ayrıntıları alır ve kullanıcıya gösterilecek bir dizi kart döndürür.

getContextualAddOn işlevini oluşturmak için şu adımları uygulayın:

Sol tarafta, işaretçiyi Code.gs üzerine getirin ve ardından Menü > Yeniden adlandır.
GetContextualAddOn yazın ve Enter tuşuna basın. Apps Komut Dosyası, .gs dosyasını otomatik olarak dosya adınıza ekler. Böylece, dosya uzantısı yazmanıza gerek kalmaz. GetContextualAddOn.gs yazarsanız Apps Komut Dosyası, dosyanızı GetContextualAddOn.gs.gs adlandırır.
GetContextualAddOn.gs ürününde varsayılan kodu getContextualAddOn işleviyle değiştirin:

/**
 * Returns the contextual add-on data that should be rendered for
 * the current e-mail thread. This function satisfies the requirements of
 * an 'onTriggerFunction' and is specified in the add-on's manifest.
 *
 * @param {Object} event Event containing the message ID and other context.
 * @returns {Card[]}
 */
function getContextualAddOn(event) {
  var card = CardService.newCardBuilder();
  card.setHeader(CardService.newCardHeader().setTitle('Log Your Expense'));

  var section = CardService.newCardSection();
  section.addWidget(CardService.newTextInput()
    .setFieldName('Date')
    .setTitle('Date'));
  section.addWidget(CardService.newTextInput()
    .setFieldName('Amount')
    .setTitle('Amount'));
  section.addWidget(CardService.newTextInput()
    .setFieldName('Description')
    .setTitle('Description'));
  section.addWidget(CardService.newTextInput()
    .setFieldName('Spreadsheet URL')
    .setTitle('Spreadsheet URL'));

  card.addSection(section);

  return [card.build()];
}

Her Google Workspace eklentisine ait eklentinin kullanıcı arayüzü, bir veya daha fazla bölüme ayrılmış kartlardan oluşur. Bu kartların her biri, kullanıcı bilgilerini görüntüleyebilecek ve kullanıcıdan bilgi alabilecek widget'lar içerir. getContextualAddOn işlevi, e-postada bulunan bir harcamayla ilgili ayrıntıları toplayan tek bir kart oluşturur. Kartta, ilgili veriler için metin giriş alanlarının bulunduğu bir bölüm bulunmaktadır. İşlev, eklentinin kartlarından oluşan bir dizi döndürür. Bu durumda, döndürülen dizi yalnızca bir kart içerir.

Expense It! Apps Komut Dosyası projelerinin yetkilendirmeleri, gelişmiş hizmetleri ve diğer ayrıntıları yönetmek için kullandığı bir Google Cloud Platform (GCP) Projesi'ne ihtiyacınız vardır. Daha fazla bilgi için Google Cloud Platform Projeleri sayfasını ziyaret edin.

Eklentinizi dağıtmak ve çalıştırmak için aşağıdaki adımları uygulayın:

GCP projenizi açın ve proje numarasını kopyalayın.
Apps Komut Dosyası projenizde, soldaki Proje Ayarları 'nı tıklayın.
"Google Cloud Platform (GCP) Project" (Google Cloud Platform (GCP) Projesi) bölümünde Projeyi değiştir'i tıklayın.
GCP projenizin proje numarasını girin ve ardından Set project (Proje ayarla) seçeneğini tıklayın.
Dağıt > Dağıtımları test et'i tıklayın.
Dağıtım türünün Google Workspace eklentisi olduğundan emin olun. Gerekirse iletişim kutusunun en üstünde Dağıtım türlerini etkinleştir'i tıklayın ve dağıtım türü olarak Google Workspace Eklentisi'ni seçin.
Uygulamalar: Gmail'in yanındaki Yükle'yi tıklayın.
Bitti'yi tıklayın.

Artık eklentiyi Gmail gelen kutunuzda görebilirsiniz.

Bilgisayarınızda Gmail'i açın.
Sağ taraftaki panelde Expense It! eklentisi gösteriliyor. Bu eklentiyi bulmak için Diğer Eklentiler'i tıklamanız gerekebilir.
Tercihen giderleri içeren bir makbuz içeren bir e-posta açın.
Eklentiyi açmak için sağ taraftaki panelde Expense It! .
Masrafınızı Karşılayın! Erişimi Yetkilendir'i tıklayıp talimatları uygulayarak Google Hesabınıza erişin.

Eklenti, açık bir Gmail iletisinin yanında basit bir form gösterir. Henüz başka bir şey yapmaz, ancak işlevini sonraki bölümde geliştireceksiniz.

Bu laboratuvara devam ederken eklentinizde yapılan güncellemeleri görmek için kodunuzu kaydedip Gmail'i yenilemeniz yeterlidir. Ek dağıtım gerekmez.

4. E-posta iletilerine erişme

E-posta içeriğini getiren bir kod ekleyin ve kodu daha düzenli bir organizasyon için modüler hale getirin.

Dosyalar'ın yanındaki Ekle simgesini tıklayın > Script'i tıklayın ve Cards adlı bir dosya oluşturun. Helpers adlı ikinci bir komut dosyası oluşturun. Cards.gs, kartı oluşturur ve formdaki alanları e-postanın içeriğine göre doldurmak için Helpers.gs işlevinden işlevleri kullanır.

Cards.gs içindeki varsayılan kodu şu kodla değiştirin:

var FIELDNAMES = ['Date', 'Amount', 'Description', 'Spreadsheet URL'];

/**
 * Creates the main card users see with form inputs to log expenses.
 * Form can be prefilled with values.
 *
 * @param {String[]} opt_prefills Default values for each input field.
 * @param {String} opt_status Optional status displayed at top of card.
 * @returns {Card}
 */
function createExpensesCard(opt_prefills, opt_status) {
  var card = CardService.newCardBuilder();
  card.setHeader(CardService.newCardHeader().setTitle('Log Your Expense'));
  
  if (opt_status) {
    if (opt_status.indexOf('Error: ') == 0) {
      opt_status = '<font color=\'#FF0000\'>' + opt_status + '</font>';
    } else {
      opt_status = '<font color=\'#228B22\'>' + opt_status + '</font>';
    }
    var statusSection = CardService.newCardSection();
    statusSection.addWidget(CardService.newTextParagraph()
      .setText('<b>' + opt_status + '</b>'));
    card.addSection(statusSection);
  }
  
  var formSection = createFormSection(CardService.newCardSection(),
                                      FIELDNAMES, opt_prefills);
  card.addSection(formSection);
  
  return card;
}

/**
 * Creates form section to be displayed on card.
 *
 * @param {CardSection} section The card section to which form items are added.
 * @param {String[]} inputNames Names of titles for each input field.
 * @param {String[]} opt_prefills Default values for each input field.
 * @returns {CardSection}
 */
function createFormSection(section, inputNames, opt_prefills) {
  for (var i = 0; i < inputNames.length; i++) {
    var widget = CardService.newTextInput()
      .setFieldName(inputNames[i])
      .setTitle(inputNames[i]);
    if (opt_prefills && opt_prefills[i]) {
      widget.setValue(opt_prefills[i]);
    }
    section.addWidget(widget);
  }
  return section;
}

createExpensesCard işlevi, formu isteğe bağlı bir bağımsız değişken olarak önceden doldurmak için bir değer dizisi alır. İşlev, isteğe bağlı bir durum mesajı görüntüleyebilir. Durum "Error:" ile başlıyorsa kırmızı renkte, değilse yeşil renktedir. createFormSection adlı yardımcı işlev, her alanı forma manuel olarak eklemek yerine metin girişi widget'ları oluşturma sürecinde döngü yapar, her varsayılan değeri setValue ile ayarlar ve ardından widget'ları karttaki ilgili bölümlere ekler.

Şimdi, Helpers.gs içindeki varsayılan kodu şu kodla değiştirin:

/**
 * Finds largest dollar amount from email body.
 * Returns null if no dollar amount is found.
 *
 * @param {Message} message An email message.
 * @returns {String}
 */
function getLargestAmount(message) {
  return 'TODO';
}

/**
 * Determines date the email was received.
 *
 * @param {Message} message An email message.
 * @returns {String}
 */
function getReceivedDate(message) {
  return 'TODO';
}

/**
 * Determines expense description by joining sender name and message subject.
 *
 * @param {Message} message An email message.
 * @returns {String}
 */
function getExpenseDescription(message) {
  return 'TODO';
}

/**
 * Determines most recent spreadsheet URL.
 * Returns null if no URL was previously submitted.
 *
 * @returns {String}
 */
function getSheetUrl() {
  return 'TODO';
}

Helpers.gs içindeki işlevler, formda önceden doldurulmuş değerleri belirlemek için getContextualAddon tarafından çağrılır. Şimdilik bu işlevler yalnızca "TODO" dizesini döndürecektir çünkü önceden doldurma mantığını daha sonraki bir adımda uygulayacaksınız.

Ardından GetContextualAddon.gs içindeki kodu, Cards.gs ve Helpers.gs içindeki kodlardan yararlanacak şekilde güncelleyin. GetContextualAddon.gs içindeki kodu şu kodla değiştirin:

/**
 * Copyright 2017 Google Inc.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *   https://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

/**
 * Returns the contextual add-on data that should be rendered for
 * the current e-mail thread. This function satisfies the requirements of
 * an 'onTriggerFunction' and is specified in the add-on's manifest.
 *
 * @param {Object} event Event containing the message ID and other context.
 * @returns {Card[]}
 */
function getContextualAddOn(event) {
  var message = getCurrentMessage(event);
  var prefills = [getReceivedDate(message),
                  getLargestAmount(message),
                  getExpenseDescription(message),
                  getSheetUrl()];
  var card = createExpensesCard(prefills);

  return [card.build()];
}

/**
 * Retrieves the current message given an action event object.
 * @param {Event} event Action event object
 * @return {Message}
 */
function getCurrentMessage(event) {
  var accessToken = event.messageMetadata.accessToken;
  var messageId = event.messageMetadata.messageId;
  GmailApp.setCurrentMessageAccessToken(accessToken);
  return GmailApp.getMessageById(messageId);
}

Kullanıcının şu anda açık olan iletiyi okumak için Gmail tarafından sağlanan etkinliği kullanan yeni getCurrentMessage işlevini not edin. Bu işlevin çalışması için komut dosyası manifest dosyasına, Gmail iletilerine salt okuma erişimi sağlayan ilave bir kapsam ekleyin.

appscript.json öğesinde, oauthScopes öğesini https://www.googleapis.com/auth/gmail.addons.current.message.readonly kapsamını da isteyecek şekilde güncelleyin.

"oauthScopes": [
  "https://www.googleapis.com/auth/gmail.addons.execute",
   "https://www.googleapis.com/auth/gmail.addons.current.message.readonly"
],

Gmail'de eklentinizi çalıştırın ve Expense It! seçeneğini tıklayın. Form alanları artık "TODO" ile önceden dolduruldu.

5. Google E-Tablolar ile etkileşim kurma

Gider! eklentisinde, kullanıcının harcamayla ilgili ayrıntıları girebileceği bir form bulunur ancak bu tür ayrıntılar yer almaz. Form verilerini Google E-Tablosu'na gönderen bir düğme ekleyelim.

Düğme eklemek için ButtonSet sınıfını kullanacağız. Google E-Tablolar'ı arayüz olarak kullanmak için Google E-Tablolar hizmetini kullanacağız.

createFormSection öğesini, "Gönder" etiketli düğmeyi döndürecek şekilde değiştirin bu bölümde yer alır. Aşağıdaki adımları uygulayın:

CardService.newTextButton() kullanarak, düğmeyi "Gönder" şeklinde etiketleyen bir metin düğmesi oluşturun CardService.TextButton.setText() kullanılıyor.
Düğmeyi, tıklandığında aşağıdaki submitForm işlemi CardService.TextButton.setOnClickAction() aracılığıyla çağrılacak şekilde tasarlayın:

/**
 * Logs form inputs into a spreadsheet given by URL from form.
 * Then displays edit card.
 *
 * @param {Event} e An event object containing form inputs and parameters.
 * @returns {Card}
 */
function submitForm(e) {
  var res = e['formInput'];
  try {
    FIELDNAMES.forEach(function(fieldName) {
      if (! res[fieldName]) {
        throw 'incomplete form';
      }
    });
    var sheet = SpreadsheetApp
      .openByUrl((res['Spreadsheet URL']))
      .getActiveSheet();
    sheet.appendRow(objToArray(res, FIELDNAMES.slice(0, FIELDNAMES.length - 1)));
    return createExpensesCard(null, 'Logged expense successfully!').build();
  }
  catch (err) {
    if (err == 'Exception: Invalid argument: url') {
      err = 'Invalid URL';
      res['Spreadsheet URL'] = null;
    }
    return createExpensesCard(objToArray(res, FIELDNAMES), 'Error: ' + err).build();
  }
}

/**
 * Returns an array corresponding to the given object and desired ordering of keys.
 *
 * @param {Object} obj Object whose values will be returned as an array.
 * @param {String[]} keys An array of key names in the desired order.
 * @returns {Object[]}
 */
function objToArray(obj, keys) {
  return keys.map(function(key) {
    return obj[key];
  });
}

CardService.newButtonSet() kullanarak düğme grubu widget'ı oluşturun ve metin düğmenizi CardService.ButtonSet.addButton() içeren düğme grubuna ekleyin.
Düğme grubu widget'ını CardService.CardSection.addWidget() kullanarak kartın form bölümüne ekleyin.

Sadece birkaç satır kodla, bir e-tabloyu URL'sinden açarak açabilir ve bu sayfaya bir veri satırı ekleyebiliriz. Form girişlerinin, e etkinliğinin bir parçası olarak işleve iletildiğini ve kullanıcının tüm alanları sağlayıp sağlamadığını kontrol ettiğimizi unutmayın. Hata olmadığını varsayarak iyi durumdaki boş bir gider kartı oluştururuz. Hata yakalamamız durumunda, hata mesajıyla birlikte doldurulmuş orijinal kartı iade ederiz. objToArray yardımcı işlevi, form yanıtlarının e-tabloya eklenebilecek bir diziye dönüştürülmesini kolaylaştırır.

Son olarak, appsscript.json tablosundaki oauthScopes bölümünü tekrar güncelleyerek https://www.googleapis.com/auth/spreadsheets kapsamını isteyin. Bu kapsam yetkilendirildiğinde eklentinin kullanıcının Google E-Tablolarını okumasına ve değiştirmesine olanak tanır.

"oauthScopes": [
  "https://www.googleapis.com/auth/gmail.addons.execute",
  "https://www.googleapis.com/auth/gmail.addons.current.message.readonly",
  "https://www.googleapis.com/auth/spreadsheets"
],

Henüz yeni bir e-tablo oluşturmadıysanız https://docs.google.com/spreadsheets/ adresine giderek bir tane oluşturun.

Şimdi eklentiyi yeniden çalıştırın ve formu göndermeyi deneyin. E-tablo URL'si form alanına hedef URL'nizin tam URL'sini girdiğinizden emin olun.

6. Mülkler hizmetiyle değerleri depolama

Çoğu zaman kullanıcılar birçok gideri aynı e-tabloya kaydeder. Bu nedenle, kartta varsayılan değer olarak en son e-tablonun URL'sini sunmak daha kolaydır. En son e-tablonun URL'sini öğrenmek için, eklentinin her kullanılışında bu bilgiyi saklamamız gerekir.

Özellikler hizmeti, anahtar/değer çiftlerini depolamamıza olanak tanır. Bizim örneğimizde makul bir anahtar "SPREADSHEET_URL" olur değer ise URL'nin kendisi olur. Böyle bir değeri depolamak için Cards.gs ürününde submitForm öğesini değiştirmeniz gerekir. Böylece, sayfaya yeni bir satır eklendiğinde e-tablonun URL'si özellik olarak depolanır.

Mülklerin üç kapsamdan birine sahip olabileceğini unutmayın: komut dosyası, kullanıcı veya doküman. Belirli bir Google Dokümanı veya E-Tablosu'na özgü bilgilerin depolandığı ayrı bir eklenti türüyle ilgili olmasına rağmen doküman kapsamı Gmail eklentileri için geçerli değildir. Eklentimizde ise bireyin, formda varsayılan seçenek olarak kendi e-tablosunu (başkasının en son e-tablosunu değil) görmesi tercih edilir. Sonuç olarak, script kapsamı yerine user kapsamını seçeriz.

E-tablo URL'sini depolamak için PropertiesService.getUserProperties().setProperty() değerini kullanın. Aşağıdakileri Cards.gs konumundaki submitForm öğesine ekleyin:

PropertiesService.getUserProperties().setProperty('SPREADSHEET_URL', 
    res['Spreadsheet URL']);

Ardından, depolanan mülkü döndürmek için Helpers.gs içindeki getSheetUrl işlevini değiştirin. Bu sayede, kullanıcı eklentiyi her kullandığında en son URL'yi görür. Mülkün değerini elde etmek için PropertiesService.getUserProperties().getProperty() değerini kullanın.

/**
 * Determines most recent spreadsheet URL.
 * Returns null if no URL was previously submitted.
 *
 * @returns {String}
 */
function getSheetUrl() {
  return PropertiesService.getUserProperties().getProperty('SPREADSHEET_URL');
}

Son olarak, Mülk hizmetine erişmek için komut dosyasının da yetkilendirilmesi gerekir. Eklentinizin özellik bilgilerini okumasına ve yazmasına izin vermek için https://www.googleapis.com/auth/script.storage kapsamını manifest dosyasına daha önce olduğu gibi ekleyin.

7. Gmail iletisini ayrıştır

Kullanıcıların bilgilerini gidersek, e-postadaki masrafla ilgili bilgilerle formu önceden doldurabiliriz. Helpers.gs ürününde bu rolü oynayan işlevler oluşturduk ancak şu ana kadar yalnızca "TODO" işlevini döndürdük ve açıklamasına ekleme yapabilirsiniz.

Örneğin, e-postanın alındığı tarihi alabilir ve harcama tarihi için varsayılan değer olarak bunu kullanabiliriz.

/**
 * Determines date the email was received.
 *
 * @param {Message} message - The message currently open.
 * @returns {String}
 */
function getReceivedDate(message) {
  return message.getDate().toLocaleDateString();
}

Kalan iki işlevi uygulayın:

getExpenseDescription, hem gönderenin adı hem de ileti konusunun birleştirilmesini gerektirebilir. Ancak, ileti gövdesini ayrıştırmak ve daha da doğru bir açıklama sunmak için daha gelişmiş yöntemler mevcuttur.
getLargestAmount için parayla ilişkili belirli sembolleri arayabilirsiniz. Makbuzlarda genellikle vergi ve diğer ücretler gibi birden fazla değer bulunur. Doğru tutarı nasıl belirleyebileceğinizi düşünün. Normal ifadeler de yararlı olabilir.

Daha fazla fikir edinmek isterseniz GmailMessage referans belgelerini inceleyin veya codelab'in başında indirdiğiniz çözüm koduna göz atın. Helpers.gs ürünündeki tüm işlevler için uygulamalarınızı geliştirdikten sonra eklentinizi deneyin. Makbuzları açın ve bir e-tabloya kaydetmeye başlayın.

8. Kart işlemleriyle formu temizleme

Expense It! açık bir e-postada harcamaları yanlış tanımlıyor ve formu yanlış bilgilerle önceden dolduruyor? Kullanıcı formu temizler. CardAction sınıfı, işlem tıklandığında çağrılacak bir işlevi belirtmemizi sağlar. Bunu, kullanıcıya formu temizlemesi için hızlı bir yol sunmak amacıyla kullanalım.

createExpensesCard öğesini, döndürdüğü kartta "Formu temizle" etiketli bir kart işlemi içerecek şekilde değiştirin ve tıklandığında Cards.gs içine yapıştırabileceğiniz aşağıdaki clearForm işlevini çağırır. opt_status öğesini "Durum" adlı bir parametre olarak iletmeniz gerekir ekleyin. İşlemlere ilişkin isteğe bağlı parametrelerin Nesne.<dize, dize> türünde olması gerektiğini unutmayın. Bu nedenle, opt_status kullanılamazsa {'Status' : ''} değerini iletmeniz gerekir.

/**
 * Recreates the main card without prefilled data.
 *
 * @param {Event} e An event object containing form inputs and parameters.
 * @returns {Card}
 */
function clearForm(e) {
  return createExpensesCard(null, e['parameters']['Status']).build();
}

9. E-tablo oluştur

Mevcut bir e-tabloyu düzenlemek için Google Apps Komut Dosyası'nı kullanmanın ötesinde, programatik olarak yepyeni bir e-tablo da oluşturabilirsiniz. Eklentimizde kullanıcının harcamalar için bir e-tablo oluşturmasına izin verelim. Başlamak için createExpensesCard tarafından iade edilen karta aşağıdaki kart bölümünü ekleyin.

var newSheetSection = CardService.newCardSection();
var sheetName = CardService.newTextInput()
  .setFieldName('Sheet Name')
  .setTitle('Sheet Name');
var createExpensesSheet = CardService.newAction()
  .setFunctionName('createExpensesSheet');
var newSheetButton = CardService.newTextButton()
  .setText('New Sheet')
  .setOnClickAction(createExpensesSheet);
newSheetSection.addWidget(sheetName);
newSheetSection.addWidget(CardService.newButtonSet().addButton(newSheetButton));
card.addSection(newSheetSection);

Şimdi, kullanıcı "Yeni Sayfa"yı tıkladığında düğmesi, her zaman görünür olacak şekilde dondurulmuş bir başlık satırıyla biçimlendirilmiş yeni bir e-tablo oluşturur. Kullanıcı, formda yeni e-tablo için bir başlık belirtir. Ancak formun boş olması durumunda varsayılan bir değer eklenmesi iyi bir seçim olabilir. createExpensesSheet uygulamanızda, uygun durum mesajı ekleyerek ve URL alanını yeni e-tablonun URL'siyle önceden doldurarak mevcut kartla neredeyse aynı olan kartı döndürün.

10. Tebrikler!

E-postadaki giderleri bulan ve kullanıcıların birkaç saniye içinde masrafları bir e-tabloya kaydetmesine yardımcı olan bir Gmail eklentisini başarıyla tasarlayıp uyguladınız. Birden fazla Google API'si ile arayüz oluşturmak için Google Apps Komut Dosyası'nı kullandınız ve eklentinin birden fazla yürütmesi arasında kalıcı veriler kullandınız.

Olası İyileştirmeler

Expense It!'i geliştirirken hayal gücünüz size yol gösterecektir. Ancak, ürünü daha kullanışlı hale getirmek için aşağıdaki fikirlerden yararlanabilirsiniz:

Kullanıcı bir gider kaydettiğinde e-tablonun bağlantısı
Bir giderin günlük kaydını düzenleme/geri alma özelliği ekleyin
Kullanıcıların ödeme yapmasına ve para istemesine olanak tanımak için harici API'leri entegre edin.