页面结构规范

自动下单脚本通过 data-* 属性定位表单元素。新建站点的下单页面必须遵守此规范，否则 pnpm order 无法识别。

表单容器

<form
  data-order-form="service-order"
  :data-order-form-version="version"
>

属性	值	说明
data-order-form	service-order	固定值，脚本识别入口
data-order-form-version	版本号字符串	可选，便于调试

字段 data 属性

所有输入框必须带 data-order-field 和 data-testid（值相同）：

data-order-field	类型	必填	说明
service_id	select / radio	✅	服务/产品 ID
payment_method	select / radio	✅	jazzcash | easypaisa | bank_transfer
customer_name	input[text]	✅	客户姓名
customer_email	input[email]	✅	邮箱
customer_phone	input[tel]	✅	JazzCash 钱包号
company_name	input[text]	❌	公司/组织名
order_brief	textarea	❌	备注/需求描述

提交按钮

<button
  data-order-action="submit"
  data-testid="order_submit"
  type="submit"
>

定价摘要（可选）

<div data-order-summary="pricing">
  <!-- 金额显示区域 -->
</div>

完整示例

<form data-order-form="service-order" data-order-form-version="2">

  <!-- 服务选择 -->
  <select name="service_id" data-order-field="service_id" data-testid="service_id">
    <option value="basic">Basic Plan — PKR 5,000</option>
    <option value="pro">Pro Plan — PKR 15,000</option>
  </select>

  <!-- 支付方式 -->
  <select name="payment_method" data-order-field="payment_method" data-testid="payment_method">
    <option value="jazzcash">JazzCash</option>
    <option value="easypaisa">EasyPaisa</option>
  </select>

  <!-- 客户信息 -->
  <input name="customer_name"  data-order-field="customer_name"  data-testid="customer_name"  type="text"  />
  <input name="customer_email" data-order-field="customer_email" data-testid="customer_email" type="email" />
  <input name="customer_phone" data-order-field="customer_phone" data-testid="customer_phone" type="tel"   />
  <input name="company_name"   data-order-field="company_name"   data-testid="company_name"   type="text"  />

  <!-- 备注 -->
  <textarea name="order_brief" data-order-field="order_brief" data-testid="order_brief"></textarea>

  <!-- 提交 -->
  <button type="submit" data-order-action="submit" data-testid="order_submit">
    Submit Order
  </button>

</form>

路由约定

下单页面的路由路径统一使用 /contact，脚本默认访问此路径：

https://newdomain.pk/contact
http://localhost:5173/contact   ← 本地

如需自定义路径，在 pnpm order 时选 Online 后会用对应域名的 /contact。