unserver-unify/src/app/setting/signup_company.html

<div class="col-md-12 margin-bottom-50" ng-controller="SignupCtrl as ctrl">
  <div class="col-md-12 reg-page">
    <div class="reg-header">
      <h2>
        {{ {eng:'Register a new Shop',chn:'注册新用户'}|trans}}
      </h2>
      <p>
        {{'Sign up to gain access to many internship projects & jobs in Singapore!'|translate}}
      </p>
    </div>
    <div class="wizard_step">
      <div class="stage-container">
        <div class="stage col-md-4 col-sm-4" ng-class="{'tmm-current':ctrl.wizardstep==0 , 'tmm-success':ctrl.maxstep>0 }">
          <div class="stage-header fa fa-building-o">
          </div>
          <div class="stage-content">
            <h3 class="stage-title" translate>
              Shop Information
            </h3>
            <!--div class="stage-info">
              6 Fields
            </div-->
          </div>
        </div>
        <!--/ .stage-->
        <div class="stage col-md-4 col-sm-4" ng-class="{'tmm-current':ctrl.wizardstep==1, 'tmm-success':ctrl.maxstep>1}">
          <div class="stage-header fa fa-map-marker">
          </div>
          <div class="stage-content">
            <h3 class="stage-title" translate>
              Location Information
            </h3>
            <!--div class="stage-info">
              4 Fields
            </div-->
          </div>
        </div>
        <!--/ .stage-->
        <div class="stage col-md-4 col-sm-4" ng-class="{'tmm-current':ctrl.wizardstep==2}">
          <div class="stage-header fa fa-cubes">
          </div>
          <div class="stage-content">
            <h3 class="stage-title" translate>
              Category 
            </h3>
            <!--div class="stage-info">
              4 Fields
            </div-->
          </div>
        </div>
        <!--/ .stage-->
        <div class="clearfix">
        </div>
      </div>
    </div>
    <!-- Personal Starts -->
    <form class="form-horizontal" name="basicform" ng-class='{"shake":shaking}' ng-show="ctrl.wizardstep==0" role="form">
      <div class="row">
        <div class="col-md-6">
          <div ng-class='{"has-error":basicform.username.$invalid && submitted}'>
            <label class="control-label" for="username">
              <span translate="">
                Official business Name (User Name)
              </span>
              <span class="manditory">
                *
              </span>
            </label>
            <div>
              <input class="form-control margin-bottom-20" focus-me="true" name="username" ng-minlength="5" ng-model="ctrl.userCredentials.name" placeholder="{{ 'required_min_length' | translate:'{ length: 5 }' }}" required="" type="text" />
            </div>
          </div>
          <div class="form-group alert alert-danger" ng-show="basicform.username.$invalid && submitted">
            <p class="help-block col-xs-12" translate="field_required_min_length" translate-value-field="{{ 'User Name' | translate }}" translate-values="{length: 5}">
            </p>
          </div>
        </div>
        <div class="col-md-6">
          <div ng-class='{"has-error":basicform.fullname.$invalid && submitted}'>
            <label class="control-label" for="fullname">
              <span translate="">
                Full Name
              </span>
              <span class="manditory">
                *
              </span>
            </label>
            <div>
              <input class="form-control margin-bottom-20" name="fullname" ng-minlength="5" ng-model="ctrl.userCredentials.fullname" placeholder="{{ 'required_min_length' | translate:'{ length: 5 }' }}" required="" type="text" />
            </div>
          </div>
          <div class="form-group alert alert-danger" ng-show="basicform.fullname.$invalid && submitted">
            <p class="help-block col-xs-12" translate="field_required_min_length" translate-value-field="{{ 'Full Name' | translate }}" translate-values="{length: 5}">
            </p>
          </div>
        </div>
      </div>
      <div class="row">
        <div class="col-md-6">
          <div ng-class='{"has-error":basicform.email.$invalid && submitted}'>
            <label class="control-label" for="email">
              <span translate="">
                Email
              </span>
              <span class="manditory">
                *
              </span>
            </label>
            <div>
              <input class="form-control margin-bottom-20" name="email" ng-minlength="5" ng-model="ctrl.userCredentials.email" placeholder="{{ 'required_min_length' | translate:'{ length: 5 }' }}" required="" type="email" />
            </div>
          </div>
          <div class="form-group alert alert-danger" ng-show="basicform.email.$invalid && submitted">
            <p class="help-block col-xs-12">
              <span translate="field_required_min_length" translate-value-field="{{ 'Email' | translate }}" translate-values="{length: 5}">
              </span>
              <span translate="">
                It must be a valid email address.
              </span>
            </p>
          </div>
        </div>
        <div class="col-md-6">
          <div ng-class='{"has-error":basicform.mobile.$invalid && submitted}'>
            <label class="control-label" for="mobile">
              <span translate="">
                Mobile
              </span>
              <span class="manditory">
                *
              </span>
            </label>
            <div>
              <input class="form-control margin-bottom-20" name="mobile" ng-minlength="5" ng-model="ctrl.userCredentials.mobile" placeholder="{{ 'Enter your Mobile Number' | translate:'{ length: 8 }' }}" required="" type="text" />
            </div>
          </div>
          <div class="form-group alert alert-danger" ng-show="basicform.mobile.$invalid && submitted">
            <p class="help-block col-xs-12">
              <span translate="field_required_min_length" translate-value-field="{{ 'Minimum length' | translate }}" translate-values="{length: 8}">
              </span>
              <span>
                {{ 'Enter your Mobile Number' | translate:'{ length: 8 }' }}
              </span>
            </p>
          </div>
        </div>

      </div>
      <div class="row">
        <div class="col-md-6">
          <div ng-class='{"has-error":basicform.password.$invalid && submitted}'>
            <label class="control-label" for="password">
              <span translate="">
                Password
              </span>
              <span class="manditory">
                *
              </span>
            </label>
            <div  >
              <input class="form-control margin-bottom-20" name="password" ng-minlength="5" ng-model="ctrl.userCredentials.pass" placeholder="{{ 'required_min_length' | translate:'{ length: 5 }' }}" required="" type="password" />
            </div>
          </div>
          <div class="form-group alert alert-danger" ng-show="basicform.password.$invalid && submitted">
            <p class="help-block col-xs-12" translate="field_required_min_length" translate-value-field="{{ 'Password' | translate }}" translate-values="{length: 5}">
            </p>
          </div>
        </div>
        <div class="col-md-6">
          <div ng-class='{"has-error":basicform.password2.$invalid && submitted}'>
            <label class="control-label" for="password2">
              <span translate="">
                Confirm Password
              </span>
              <span class="manditory">
                *
              </span>
            </label>
            <div  >
              <input class="form-control margin-bottom-20" match-target="ctrl.userCredentials.pass" name="password2" ng-minlength="5" ng-model="ctrl.userCredentials.re_pass" password-confirm="" placeholder="{{ 'It must be same as the password that previous enter.' | translate }}" required="" type="password" />
            </div>
          </div>
          <div class="form-group alert alert-danger" ng-show="basicform.password2.$invalid && submitted">
            <p class="help-block col-xs-12">
              <span translate="field_required_min_length" translate-value-field="{{ 'Confirm Password' | translate }}" translate-values="{length: 5}">
              </span>
              <span translate="">
                It must be same as the password that previous enter.
              </span>
            </p>
          </div>
        </div>
      </div>
      <div class="form-group">
        <div class="col-sm-12 text-right">
          <div>
            <div class="col-xs-offset-4 col-sm-offset-4 col-md-offset-3 col-lg-offset-2 ">
              <button class="btn btn-info" ng-click="ctrl.nextfrombasic(basicform)" translate="" type="button">
                Next
              </button>
            </div>
          </div>
        </div>
      </div>
    </form>
  <!-- Personal Ends -->
  <!-- Additional Starts -->
    <div ng-show="ctrl.wizardstep==1">
      <div class="row">
        <div class="col-md-6">
          <div>
            <label class="control-label" for="Country">
              <span translate="">
                Country
              </span>
            </label>
            <div  >
              <select class="form-control margin-bottom-20">
                <option>
                  {{'Select country'|translate}}
                </option>
              </select>
            </div>
          </div>
        </div>
        <div class="col-md-6">
          <div>
            <label class="control-label" for="Address">
              <span translate="">
                Address
              </span>
            </label>
            <div  >
              <input class="form-control margin-bottom-20" name="address" type="text"  placeholder="Enter your address"/>
            </div>
          </div>
        </div>
      </div>
      <div class="row">
        <div class="col-md-6">
          <div>
            <label class="control-label" for="city">
              <span translate="">
                City
              </span>
            </label>
            <div  >
              <input class="form-control margin-bottom-20" name="city" placeholder="{{ 'Enter your City' | translate }}" type="text" />
            </div>
          </div>
        </div>
        <div class="col-md-6">
          <div>
            <label class="control-label" for="Zip">
              <span translate="">
                Zip code
              </span>
            </label>
            <div  >
              <input class="form-control margin-bottom-20" name="age" ng-model="ctrl.userCredentials.zip" type="number" placeholder="Enter your Zip code" />
            </div>
          </div>
        </div>
      </div>
      <div class="row">
        <iframe class="maps-frame" src="//www.google.com/maps/embed/v1/place?q=Harrods,Brompton%20Rd,%20UK&amp;zoom=17&amp;key=AIzaSyD4iE2xVSpkLLOXoyqT-RuPwURN3ddScAI" allowfullscreen="">
        </iframe>
      </div>
      <div class="col-sm-12 text-right no-padding">
        <div>
          <div class="col-xs-offset-4 col-sm-offset-4 col-md-offset-3 col-lg-offset-2 ">
            <button class="btn btn-warning" ng-click="ctrl.backtostep(0)" translate="" type="button">
              Back
            </button>
            <button class="btn btn-info" ng-click="ctrl.backtostep(2)" translate="" type="button">
              Next
            </button>
          </div>
        </div>
      </div>
      <div class="clearfix"></div>
    </div>
  <!-- Additional Ends -->
  <!-- Education & Career Starts -->
    <form class="form-horizontal margin-bottom-50" name="formcareer" ng-class='{"shake":shaking}' ng-show="ctrl.wizardstep==2" role="form">
      <form-directive form="ctrl.userProfiles" >
      </form-directive>
      <div class="row">
        <div class="col-md-1" style="padding-top: 7px;">
          <label>
            {{'Description'|translate}}
          </label>
        </div>
        <div class="col-md-6">
          <textarea style="width:100%; height:50px" class="form-control margin-bottom-20"></textarea>
        </div>
      </div>
      <div class="row">
        <div class="col-md-1" style="padding-top: 7px;">
          <label>
            {{'Cuisine'|translate}}
          </label>
        </div>
        <div class="col-md-1 col-xs-2 checkbox">
          <label>
            <input ng-model="readTerm" style="margin-top:2px;" type="checkbox"/>
            {{'Sitdown'|translate}}
          </label>
        </div>
        <div class="col-md-1 col-xs-2 checkbox">
          <label>
            <input ng-model="readTerm" style="margin-top:2px;" type="checkbox"/>
            {{'Cafe'|translate}}
          </label>
        </div>
        <div class="col-md-1 col-xs-2 padding-left-0 padding-right-0 checkbox">
          <label>
            <input ng-model="readTerm" style="margin-top:2px;" type="checkbox"/>
            {{'Fast food'|translate}}
          </label>
        </div>
        <div class="col-md-3 col-xs-4">
          <div>
            <input class="form-control" name="age" ng-model="ctrl.userCredentials.zip" placeholder="Add another cuisine type" />
          </div>
        </div>
      </div>
      <div class="row">
        <div class="col-md-1"></div>
        <div class="col-md-11 checkbox">
          <label>
            <input ng-model="readTerm" style="margin-top:2px;" type="checkbox"/>
              {{ {eng:'I have read the',chn:'已阅读'}|trans}}
              <a class="color-green" ui-sref="index.agreement">
                {{ {eng:'Terms and Conditions',chn:' 服务条款'}|trans }}
              </a>
          </label>
        </div>
      </div>
      <div class="row">
        <div class="col-md-1"></div>
        <div class="col-md-11 checkbox">
          <label>
            <input type="checkbox" ng-model="ctrl.userCredentials.broadcastEmail" style="margin-top:2px;"> 
            {{ {eng:'Subscribe platform emails',chn:'订阅信息邮件'}|trans}} 
          </label>                        
        </div>
      </div>
      <div class="row">
        <div class="col-sm-12 text-right no-padding">
          <div>
            <div class="col-xs-offset-4 col-sm-offset-4 col-md-offset-3 col-lg-offset-2 ">
              <button class="btn btn-warning" ng-click="ctrl.backtostep(1)" translate="" type="button">
                Back
              </button>
              <button class="btn btn-u" ng-class="{'active': readTerm, 'disable': !readTerm}" ng-click="ctrl.register(true)" translate="" type="button">
                Register
              </button>
            </div>
          </div>
        </div>
      </div>
    </form>
  </div>
</div>