edu-textbook/projects/textbook/src/modules/nav-author/components/textbook-pertain/textbook-pertain.component.html

<div class="entry">
  <form nz-form [formGroup]="validateForm" class="login-form" (ngSubmit)="submitForm()">
    <div class="first-head">
      <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]="16" [nzXs]="16"
              nzRequired>适用专业代码（六位）及名称</nz-form-label>
            <nz-form-control class="val" nzErrorTip="适用专业代码（六位）及名称" style="width: 100%">
              
              <nz-select style="width: 80%" nzShowSearch nzAllowClear nzPlaceHolder="填写 6 位专业代码选择"
                formControlName="major" (ngModelChange)="changeCode()" (nzOnSearch)="getCode($event)">
                @for(major of selectList; track major.code;let index = $index){
                <nz-option nzCustomContent [nzValue]="major.code" [nzLabel]="major.code">
                  <div>{{ major.name }}</div>
                  <div style="font-size: 12px;color: gray;">{{ major.code }}</div>
                </nz-option>
                }
              </nz-select>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item class="row" style="margin-bottom: 16px">
            <nz-form-label class="label" [nzNoColon]="true" [nzSm]="8" [nzXs]="8" nzRequired>课程学时</nz-form-label>
            <nz-form-control class="val" nzErrorTip="请填写课程学时" style="width: 100%">
              <nz-input-group style="width: 80%" [nzSuffix]="suffixTemplateInfo">
                <input type="number" formControlName="period" nz-input placeholder="填写学时数" />
              </nz-input-group>
              <ng-template #suffixTemplateInfo> 学时 </ng-template>
            </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]="6" [nzXs]="6" nzRequired>适用课程</nz-form-label>
            <nz-form-control class="val" nzErrorTip="请填写适用课程" style="width: 100%">
              <input type="text" formControlName="lessons" nz-input placeholder="填写适用课程名称，多门课程名称使用“；”分隔" />
            </nz-form-control>
          </nz-form-item>

          <nz-form-item class="row" style="margin-bottom: 16px">
            <nz-form-label class="label" [nzNoColon]="true" [nzSm]="6" [nzXs]="6" nzRequired>适用课程性质</nz-form-label>
            
            
            <nz-form-control class="val" nzErrorTip="请选择适用课程性质" style="width: 100%">
              <nz-checkbox-wrapper style="width: 100%;">
                <div nz-row>
                  @for (checkItem of checkOptionsOne; track $index) {
                    <label [ngModelOptions]="{standalone: true}" nz-checkbox [nzValue]="checkItem.value" [(ngModel)]="checkItem.checked">{{checkItem.value}}</label>
                  }
                </div>
              </nz-checkbox-wrapper>
              <nz-radio-group style="margin: 10px 0;" [ngModelOptions]="{standalone: true}" [(ngModel)]="checkTwo" (ngModelChange)="changeRadio()">
                @for (checkItem of checkOptionsTwo; track $index) {
                  <label nz-radio [nzValue]="checkItem.value">{{checkItem.label}}</label>
                }
              </nz-radio-group>
              <nz-checkbox-wrapper style="width: 100%;">
                <div nz-row>
                  @for (checkItem of checkOptionsThree; track $index) {
                    <label [ngModelOptions]="{standalone: true}"  nz-checkbox [nzValue]="checkItem.value" [(ngModel)]="checkItem.checked">{{checkItem.value}}</label>
                  }
                </div>
              </nz-checkbox-wrapper>
            </nz-form-control>
          </nz-form-item>

          <!-- <nz-form-item class="row" style="margin-bottom: 16px">
            <nz-form-label class="label" [nzNoColon]="true" [nzSm]="6" [nzXs]="6" nzRequired>适用课程性质</nz-form-label>

            <nz-form-control class="val" nzErrorTip="请选择适用课程性质" style="width: 100%">
              <nz-checkbox-group [(ngModel)]="checkOptionsOne" formControlName="characteristic"></nz-checkbox-group>
              <nz-checkbox-group [(ngModel)]="checkOptionsOne" formControlName="characteristic"></nz-checkbox-group>
            </nz-form-control>
          </nz-form-item> -->
        </div>
      </div>
    </div>
    <div class="author-content">
      <div class="nav">作者信息</div>
      <nz-form-label class="title" [nzNoColon]="true" [nzSm]="24" [nzXs]="24" nzRequired>
        <span style="font-size: 16px">
          作者（含主编，不超过 6 人，教材中明确出现姓名）
        </span>
      </nz-form-label>
      <nz-table #basicTable [nzData]="authorList" [nzScroll]="{ x: (maxWidth || '1200') + 'px' }">
        <thead>
          <tr>
            <th nzWidth="80px" nzLeft nzAlign="right">序号</th>
            <th nzWidth="160px" nzLeft>姓名</th>
            <th nzWidth="160px">单位</th>
            <th nzWidth="160px">出生年月</th>
            <th nzWidth="160px">国籍</th>
            <th nzWidth="160px">职务</th>
            <th nzWidth="160px">职称</th>
            <th nzWidth="300px">手机号码</th>
            <th nzWidth="160px">电子邮箱</th>
            <th nzWidth="160px">分工</th>
            <th nzWidth="120px" nzRight>
              作者诚信承诺签名
              <span style="color: red;">*</span>
            </th>
            <th nzWidth="120px" nzRight>
              作者政治审查表
              <span style="color: red;">*</span>
            </th>
            <th nzWidth="100px" nzRight>操作</th>
          </tr>
        </thead>
        <tbody>
          @for (data of authorList; track data.mobile;let index = $index) {
          <tr>
            <td nzLeft nzAlign="right">{{ index + 1 }}</td>
            <td nzLeft>
              <input nz-input placeholder="请输入作者姓名" [ngModelOptions]="{ standalone: true }" [(ngModel)]="data.name"
                nzStatus="" />
            </td>
            <td>
              <input nz-input placeholder="请输入作者单位" [ngModelOptions]="{ standalone: true }" [(ngModel)]="data.unit"
                nzStatus="" />
            </td>
            <td>
              <nz-date-picker nzMode="month" [ngModelOptions]="{ standalone: true }"
                [(ngModel)]="data.birth"></nz-date-picker>
            </td>
            <td>
              <input nz-input placeholder="请输入作者国籍" [ngModelOptions]="{ standalone: true }"
                [(ngModel)]="data.nationality" nzStatus="" />
            </td>
            <td>
              <input nz-input placeholder="请输入作者职务" [ngModelOptions]="{ standalone: true }" [(ngModel)]="data.job"
                nzStatus="" />
            </td>
            <td>
              <input nz-input placeholder="请输入作者职称" [ngModelOptions]="{ standalone: true }" [(ngModel)]="data.title"
                nzStatus="" />
            </td>
          

            


            <td>
              <nz-input-group nzCompact>
                <nz-select style="width: 90px;" [ngModelOptions]="{ standalone: true }" [ngModel]="'+86'">
                  <nz-option [nzLabel]="'+0000'" [nzValue]="'+0000'"></nz-option>
                  <nz-option [nzLabel]="'+86'" [nzValue]="'+86'"></nz-option>
                </nz-select>
                <input type="number" nz-input placeholder="请输入作者手机号码" [ngModelOptions]="{ standalone: true }"
                [(ngModel)]="data.mobile" nzStatus="" style="width: 160px;"/>
              </nz-input-group>
            </td>






            <td>
              <input nz-input placeholder="请输入作者邮箱" [ngModelOptions]="{ standalone: true }" [(ngModel)]="data.email"
                nzStatus="" />
            </td>
            <td>
              <nz-select style="width: 80%" nzShowSearch nzAllowClear nzPlaceHolder="请选择分工"
                [ngModelOptions]="{ standalone: true }" [(ngModel)]="data.work">
                @for(work of workOptions; track work){
                <nz-option nzCustomContent [nzValue]="work" [nzLabel]="work">{{
                  work
                  }}</nz-option>
                }
              </nz-select>
            </td>
            <td nzRight>
              @if (data.signature) {
                <a style="color: #3e49b3;" (click)="openFile(data.signature)">签名文件</a>
              }
              <app-comp-upload (change)="upload($event, 'signature',index)"></app-comp-upload>
            </td>
            <td nzRight>
              @if (data.examine) {
              <a style="color: #3e49b3;" (click)="openFile(data.examine)">政治审查表 </a>
              }
              <app-comp-upload (change)="upload($event, 'examine',index)"></app-comp-upload>
            </td>
            <td nzRight>
              <a (click)="onPush('authorList', index)"><span nz-icon style="font-size: 20px; margin-right: 10px"
                  nzType="plus-circle" nzTheme="outline"></span></a>
              <a (click)="onDel('authorList', index)"><span nz-icon style="font-size: 20px" nzType="delete"
                  nzTheme="outline"></span></a>
            </td>
          </tr>
          }
        </tbody>
      </nz-table>
      <p>输入诚信承诺：本人自愿参加此次申报，已认真填写并检查以上材料，保证内容真实。</p>
      <input formControlName="accept" nz-input placeholder="请输入承诺内容" />
    </div>
    <div class="author-content">
      <div class="nav">第一主编（作者）情况</div>
      <nz-form-item class="row" style="margin-bottom: 16px">
        <nz-form-label class="title" [nzNoColon]="true" [nzSm]="24" [nzXs]="24" nzRequired>
          <span style="font-size: 16px"> 相关教学经历 </span>
        </nz-form-label>
        <nz-form-control  class="val" nzErrorTip="请输入第一主编（作者）承担学校教学任务、开展教学研究情况、教材编写情况以及取得的教学成果" style="width: 100%">
          <nz-textarea-count [nzMaxCharacterCount]="500">
            <textarea rows="4" maxlength="500" formControlName="authorDetails" placeholder="请输入第一主编（作者）承担学校教学任务、开展教学研究情况、教材编写情况以及取得的教学成果"
            nz-input></textarea>
          </nz-textarea-count>
          
        </nz-form-control>
      </nz-form-item>
    </div>
    <div class="author-content">
      <nz-form-label class="title" [nzNoColon]="true" [nzSm]="24" [nzXs]="24" nzRequired>
        <span style="font-size: 16px">
          相关科学研究项目、成果或论文专著（限5项）
        </span>
      </nz-form-label>
      <nz-table #basicTable [nzData]="achievementOptions" [nzScroll]="{ x: (maxWidth || '1200') + 'px' }">
        <thead>
          <tr>
            <th nzWidth="80px" nzLeft nzAlign="right">序号</th>
            <th nzWidth="220px" nzLeft>名称</th>
            <th nzWidth="180px">来源/出版单位</th>
            <th nzWidth="120px">时间</th>
            <th nzWidth="80px" nzRight>操作</th>
          </tr>
        </thead>
        <tbody>
          @for (data of achievementOptions; track data.name;let index = $index)
          {
          <tr>
            <td nzLeft nzAlign="right">{{ index + 1 }}</td>
            <td nzLeft>
              <input nz-input placeholder="请输入项目/成果/论文名称" [ngModelOptions]="{ standalone: true }"
                [(ngModel)]="data.name" nzStatus="" />
            </td>
            <td>
              <input nz-input placeholder="请输入单位名称" [ngModelOptions]="{ standalone: true }" [(ngModel)]="data.unit"
                nzStatus="" />
            </td>
            <td>
              <nz-date-picker nzMode="month" [ngModelOptions]="{ standalone: true }"
                [(ngModel)]="data.date"></nz-date-picker>
            </td>
            <td nzRight>
              <a (click)="onPush('achievementOptions', index)"><span nz-icon style="font-size: 20px; margin-right: 10px"
                  nzType="plus-circle" nzTheme="outline"></span></a>
              <a (click)="onDel('achievementOptions', index)"><span nz-icon style="font-size: 20px" nzType="delete"
                  nzTheme="outline"></span></a>
            </td>
          </tr>
          }
        </tbody>
      </nz-table>
    </div>
  </form>
  
</div>
<div style="width: 100%;display: flex;justify-content: space-between;padding: 30px;">
  <a (click)="downloadFile()">
    <span nz-icon nzType="download" nzTheme="outline"></span>
    下载本页所有附件模板
  </a>
  <div class="footer">
    <div>
      <button nz-button nzType="default" style="margin-right: 20px" (click)="submitForm('save')">
        保存本页
      </button>
      <button nz-button nzType="default" style="margin-right: 20px" (click)="submitForm('pre')">
        上一页
      </button>
      <button nz-button nzType="primary" style="background: #3e49b3; border: 1px #3e49b3" (click)="submitForm('next')">
        下一页
      </button>
    </div>
  
  </div>
</div>