[{"value":"customer-account.png","id":"customer-accountpng","hLevel":2,"level":1},{"value":"位置","id":"位置","hLevel":2,"level":1},{"value":"内容","id":"内容","hLevel":2,"level":1,"children":[{"value":"customer 对象","id":"customer-对象","hLevel":3,"level":2}]},{"value":"用法","id":"用法","hLevel":2,"level":1,"children":[{"value":"显示客户的账户信息","id":"display-customer-account-information","hLevel":3,"level":2},{"value":"显示客户的地址列表","id":"show-customers-address-list","hLevel":3,"level":2},{"value":"删除地址","id":"delete-an-address","hLevel":3,"level":2},{"value":"注销账户","id":"deactivate-account","hLevel":3,"level":2}]}]

customers/account

customers/account 模板渲染客户帐户页面，该页面提供了客户帐户信息的概览。

位置

customers/account 模板位于主题的 templates/customers 目录中：

└── theme
    ├── layout
    ├── templates
    |   └── customers
    |     ├── account.json
    |     ...
    ...

内容

你可以将 customer 对象包含在 customers/account 模板中或模板内的某个 section 中。

customer 对象

你可以访问 Handlebars customer 对象以显示页面的详细信息。

用法

在使用 customers/account 模板时，你应该熟悉以下内容：

显示客户的账户信息
显示客户的地址列表
删除地址
注销账户

提示

如果你使用的是 JSON templates，那么任何 HTML 或 Handlebars 代码都需要包含在模板引用的 section 中。

显示客户的账户信息

为了向客户展示他们的账户个人信息，你可以使用 customer 对象来展示相关数据：

<div class="info-item">
    <div class="body4 info-value">{{customer.email}}</div>
</div>
<div class="info-item">
    <div class="body4 info-value">{{customer.phone}}</div>
</div>

显示客户的地址列表

如果为了向客户展示他们的地址列表，并标识出默认地址，你可以使用 customer 对象的 addresses 属性来展示这个列表：

{{#for customer.addresses as |address|}}
  <div class="address__item">
      <div class="body4 address__phone">{{ address.phone }}</div>
      <div class="body4 address__detail">{{{ format_address address }}}</div>
  </div>
{{/for}}

删除地址

为了提供给客户删除地址的选项，你可以通过包含下面的表单来添加此功能：

{{#form "customer_address" address_seq=address.id return_to=routes.account_url }}
  <button class="button" type="submit">Delete</button>
{{/form}}

提示

你应该将上述表单与 JavaScript 结合起来，以在执行删除操作之前提示客户进行确认。

注销账户

当商家在 SHOPLINE admin 后台的客户设置中启用“允许客户注销账户” 选项时，你应该包含一个注销账户的选项。你可以使用以下表单添加此功能, 并使用 loadFeatured 来引入 customer-account-api SDK，以处理向客户账户发送验证码的逻辑：

{{#form "delete_customer" id="delete-customer-form"}}
    <div class="field">
      <div class="field__container">
        <input
          type="text"
          class="field__input"
          name="customer[verifycode]"
          required
          placeholder="Verification code"
        />
        <label class="field__label body3">
          Verification code
        </label>
      </div>
      <div class="field__suffix">
        <button class="button button--link verifycode-button">
          Send
        </button>
      </div>
    </div>
    <button type="submit" class="button button--full-width">
      Delete Account
    </button>
{{/form}}