edu-textbook/projects/textbook/src/modules/nav-admin/process-create/process-create.component.html

<nz-page-header nzTitle="发起报送流程">
  <nz-breadcrumb nz-page-header-breadcrumb>
    <nz-breadcrumb-item>报送合集</nz-breadcrumb-item>
    <nz-breadcrumb-item>北京市</nz-breadcrumb-item>
    <nz-breadcrumb-item>报送流程</nz-breadcrumb-item>
    <nz-breadcrumb-item><a>发起报送流程</a></nz-breadcrumb-item>
  </nz-breadcrumb>
</nz-page-header>
<div class="content" [style.padding]="isEdit ? '0' : '0 24px 16px'">
  <form
    nz-form
    [formGroup]="validateForm"
    class="login-form"
    (ngSubmit)="submitForm('save')"
  >
    <div class="title">基本信息</div>
    <div class="fill-template">
      <div nz-row>
        <div nz-col nzSpan="12">
          <nz-form-item class="row" style="margin-bottom: 16px">
            <nz-form-label
              class="label"
              [nzNoColon]="true"
              [nzSm]="18"
              [nzXs]="18"
              nzRequired
              >流程名称</nz-form-label
            >
            <nz-form-control
              class="val"
              nzErrorTip="请填写流程名称"
              style="width: 100%"
            >
              <nz-input-group
                [nzAddOnAfter]="validateForm.value.name.length + '/' + 50"
              >
                <input
                  nz-input
                  type="text"
                  placeholder="请填写流程名称"
                  formControlName="name"
                  nzStatus=""
                  maxlength="50"
                />
              </nz-input-group>
            </nz-form-control>
          </nz-form-item>
        </div>
        <div nz-col nzSpan="12">
          <nz-form-item class="row" style="margin-bottom: 16px">
            <nz-form-label
              class="label"
              [nzNoColon]="true"
              [nzSm]="18"
              [nzXs]="18"
              nzRequired
              >流程描述</nz-form-label
            >
            <nz-form-control
              class="val"
              nzErrorTip="请填写合集描述"
              style="width: 100%"
            >
              <nz-input-group
                [nzAddOnAfter]="validateForm.value.desc.length + '/' + 50"
              >
                <input
                  nz-input
                  type="text"
                  placeholder="请填流程描述"
                  formControlName="desc"
                  nzStatus=""
                  maxlength="50"
                />
              </nz-input-group>
            </nz-form-control>
          </nz-form-item>
        </div>
      </div>
      <div nz-row>
        <div nz-col nzSpan="12">
          <nz-form-item class="row" style="margin-bottom: 16px">
            <nz-form-label
              class="label"
              [nzNoColon]="true"
              [nzSm]="18"
              [nzXs]="18"
              nzRequired
              >流程唯一标识</nz-form-label
            >
            <nz-form-control
              class="val"
              nzErrorTip="请填写流程唯一标识"
              style="width: 100%"
            >
              <nz-input-group
                [nzAddOnAfter]="validateForm.value.code.length + '/' + 50"
              >
                <input
                  nz-input
                  type="text"
                  placeholder="请填写流程唯一标识"
                  formControlName="code"
                  nzStatus=""
                  maxlength="50"
                />
              </nz-input-group>
            </nz-form-control>
          </nz-form-item>
        </div>
        <div nz-col nzSpan="12">
          <nz-form-item class="row" style="margin-bottom: 16px">
            <nz-form-label
              class="label"
              [nzNoColon]="true"
              [nzSm]="18"
              [nzXs]="18"
              nzRequired
              >报送配额</nz-form-label
            >
            <nz-form-control
              class="val"
              nzErrorTip="请填写报送配额"
              style="width: 100%"
            >
              <nz-input-group [nzAddOnAfter]="getNumlength() + '/' + 50">
                <input
                  nz-input
                  type="number"
                  placeholder="请填写报送配额"
                  formControlName="num"
                  nzStatus=""
                  maxlength="50"
                />
              </nz-input-group>
            </nz-form-control>
          </nz-form-item>
        </div>
      </div>
      <div nz-row>
        <div nz-col nzSpan="12">
          <nz-form-item class="row" style="margin-bottom: 16px">
            <nz-form-label
              class="label"
              [nzNoColon]="true"
              [nzSm]="18"
              [nzXs]="18"
              nzRequired
              >开始时间</nz-form-label
            >
            <nz-form-control
              class="val"
              nzErrorTip="请填写开始时间"
              style="width: 100%"
            >
              <nz-date-picker
                nzFormat="yyyy-MM-dd HH:mm:ss"
                formControlName="startDate"
                [nzShowTime]="{ nzDefaultOpenValue: timeDefaultValue }"
              ></nz-date-picker>
            </nz-form-control>
          </nz-form-item>
        </div>
        <div nz-col nzSpan="12">
          <nz-form-item class="row" style="margin-bottom: 16px">
            <nz-form-label
              class="label"
              [nzNoColon]="true"
              [nzSm]="18"
              [nzXs]="18"
              nzRequired
              >结束时间</nz-form-label
            >
            <nz-form-control
              class="val"
              nzErrorTip="请填写结束时间"
              style="width: 100%"
            >
              <nz-date-picker
                nzFormat="yyyy-MM-dd HH:mm:ss"
                formControlName="deadline"
                [nzShowTime]="{ nzDefaultOpenValue: timeDefaultValue }"
              ></nz-date-picker>
            </nz-form-control>
          </nz-form-item>
        </div>
      </div>
      <div nz-row>
        <div nz-col nzSpan="24">
          <div class="title-row">
            <div>
              <div class="title">流程管理员</div>
              <!-- <div class="tips">
                流程管理员可查看合集中所有流程报送的教材、报送配额、用户，可创建所属省份与自己相同的账号、用户组；可公示和报送合集中所有教材。
              </div> -->
            </div>
            <a class="btn" (click)="onShowCheck()">选择流程管理员</a>
          </div>
          <div class="tabs" #maxWidth>
            @if (eduProcess?.get('profileSubmitted') && !showProfileFrom) {
            <app-profile
              [idList]="profileIds ? profileIds : []"
              (change)="changeSubmitted($event)"
              [maxWidth]="maxWidth"
              [disabled]="true"
            ></app-profile>
            } @else if(showProfileFrom){
            <app-profile
              [maxChecked]="99"
              [idList]="profileIds ? profileIds : []"
              [maxWidth]="maxWidth"
              (change)="changeSubmitted($event)"
            ></app-profile>
            }
          </div>
          <div class="fonter">
            @if (!eduProcess?.id) {
            <button
              class="form-button"
              type="button"
              mat-raised-button
              (click)="submitForm('save')"
            >
              创建报送流程
            </button>
            <button
              class="form-button close"
              type="button"
              mat-raised-button
              (click)="submitForm('close')"
            >
              取消
            </button>
            } @else {
            <button
              class="form-button"
              type="button"
              mat-raised-button
              (click)="submitForm('save')"
            >
              发起报送流程
            </button>
            <button
              class="form-button close"
              type="button"
              mat-raised-button
              (click)="submitForm('close')"
            >
              取消
            </button>
            }
          </div>
        </div>
      </div>
    </div>
  </form>
</div>