include @/helper/helper.pug
include @/helper/flush.pug

block var
  -title=user.nickname || "Welcome" // 网页标题
title #{user.nickname || "Welcome"}

form(action="/user" method="post" enctype="multipart/form-data" style="margin: 0 auto; width: 500px;")
    .field 
        .label 用户名
        .control 
        input.input(type="text" name="username" placeholder="请输入用户名" value=user.username)
    .field 
        .label 密码
        .control 
        input.input(type="password" name="password" placeholder="请输入密码")
    .field 
        .label 昵称
        .control 
        input.input(type="text" name="nickname" placeholder="请输入昵称" value=user.nickname)
    .field
        .label 邮箱
        .control 
        input.input(type="email" name="email" placeholder="请输入邮箱" value=user.email)
    .field
        .label 手机号
        .control 
        input.input(type="tel" name="tel" placeholder="请输入手机号" value=user.tel)
    .field 
      .label 头像
      .control 
        .file.is-primary
          label.file-label
            input.file-input(type="file" name="file" id="upload")
            span.file-cta
              span.file-label
                | 上传头像
    div(style="display: flex;align-items:center;")
        .field#upload-placeholder 
        if user.avatar 
            .field 
                .control 
                .image.is-128x128
                    img.is-rounded(src=user.avatar alt=user.username)
    +security
    .field.is-grouped
      .control
        button.button.is-link(type="submit") 提交
      .control
        button.button.is-link.is-light 取消
+script("js/page/user.js")

//- form(action="", method="post" style="margin: 0 auto; width: 500px;margin-top:20px")  
//-   .field 
//-     .label 用户名
//-     .control 
//-       input.input(type="text" placeholder="请输入用户名" value=user.username)
//-   .field 
//-     .label 昵称
//-     .control 
//-       input.input(type="text" placeholder="请输入用户名" value=user.nickname)
//-   .field
//-     .label 邮箱
//-     .control 
//-       input.input(type="email" placeholder="请输入邮箱" value=user.email)
//-   .field
//-     .label 手机号
//-     .control 
//-       input.input(type="tel" placeholder="请输入手机号" value=user.tel)
//-   .field 
//-     .label 头像
//-     .control 
//-       .file.is-primary
//-         label.file-label
//-           input.file-input(type="file", name="file")
//-           span.file-cta
//-             span.file-label
//-               | 上传头像
//-   if user.avatar 
//-     .field 
//-       .control 
//-         .image.is-128x128
//-           img.is-rounded(src=user.avatar alt=user.username)
//-   .field.is-grouped
//-     .control
//-       button.button.is-link(type="submit") 提交
//-     .control
//-       button.button.is-link.is-light 取消