创建教材

projects/textbook/src/modules/nav-author/apply/apply.component.html

@@ -4,43 +4,39 @@
     <nz-breadcrumb-item>
       <a>创建材料</a>
     </nz-breadcrumb-item>
+    <div class="steps">
+      <nz-steps [nzCurrent]="state">
+        <nz-step nzTitle="填写基本信息" nzDescription=""></nz-step>
+        <nz-step nzTitle="填写材料适用情况" nzDescription=""></nz-step>
+        <nz-step nzTitle="填写材料内容" nzDescription=""></nz-step>
+        <nz-step nzTitle="上传附件及承诺" nzDescription=""></nz-step>
+      </nz-steps>
+    </div>
   </nz-breadcrumb>
 </nz-page-header>
 <div class="content">
-  <div class="top">
-    <nz-steps [nzCurrent]="state">
-      <nz-step nzTitle="填写基本信息" nzDescription=""></nz-step>
-      <nz-step nzTitle="填写材料适用情况" nzDescription=""></nz-step>
-      <nz-step nzTitle="填写材料内容" nzDescription=""></nz-step>
-      <nz-step nzTitle="上传附件及承诺" nzDescription=""></nz-step>
-    </nz-steps>
-  </div>
   <div class="state-title">{{ stateMap }}</div>
-  <div class="submit-block">
+  <div class="submit-block" #submitComp>
     @switch (state) { @case (0) {
-      <app-basic></app-basic>
+    <app-basic (next)="next()" (save)="save()"></app-basic>
     } @case (1) {
-    <div class="entry"></div>
-    <div class="footer">
-      <button
-        nz-button
-        nzType="default"
-        style="margin-right: 20px"
-      >
-        保存本页
-      </button>
-      <button
-        nz-button
-        nzType="default"
-        style="margin-right: 20px"
-        (click)="state = 0"
-      >
-        上一页
-      </button>
-      <button nz-button nzType="primary">
-        下一页
-      </button>
-    </div>
-    } @case (2) { } @case (3) { } }
+    <app-textbook-pertain
+      (next)="next()"
+      (save)="save()"
+      (maxWidth)="(submitComp.style.width)"
+    ></app-textbook-pertain>
+    } @case (2) {
+    <app-textbook-content
+      (next)="next()"
+      (save)="save()"
+      (maxWidth)="(submitComp.style.width)"
+    ></app-textbook-content>
+    } @case (3) {
+    <app-attachment
+      (next)="next()"
+      (save)="save()"
+      (maxWidth)="(submitComp.style.width)"
+    ></app-attachment>
+    } }
   </div>
 </div>

projects/textbook/src/modules/nav-author/apply/apply.component.scss

@@ -1,20 +1,36 @@
-.content{
-  padding:10px 20px;
-  .state-title{
-    font-size: 18px;
-    margin: 20px 0;
-    font-weight: bold;
+.site-page-header{
+  position: sticky;
+  top: 0;
+  z-index: 9;
+  padding:24px 24px 10px;
+  background-color: white;
+  .steps{
+    max-width: 1000px;
+    margin: 10px 0;
+  }
+}
+
+.content {
+  font-family: PingFang SC;
+  padding: 10px 20px;
+  .state-title {
+    margin:0 0 20px;
+    font-family: PingFang SC;
+    font-size: 20px;
+    font-weight: 500;
+    line-height: 28px;
+    text-align: left;
   }
-  .submit-block{
+  .submit-block {
     min-width: 800px;
-    max-width: 1000px;
+    // max-width: 1200px;
     min-height: 600px;
     margin: 10px auto;
-    .entry{
+    .entry {
       min-height: 500px;
       // border: 1px solid;
     }
-    .footer{
+    .footer {
       display: flex;
       margin: 10px auto;
       align-items: center;
@@ -24,4 +40,4 @@
       padding-right: 100px;
     }
   }
-}
+}

projects/textbook/src/modules/nav-author/apply/apply.component.ts

@@ -1,32 +1,44 @@
-import { Component, OnInit,Input,Output,EventEmitter } from '@angular/core';
-import { CommonCompModule } from '../../../services/common.modules'
+import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
+import { CommonCompModule } from '../../../services/common.modules';
 import { Router } from '@angular/router';
 import { ReactiveFormsModule } from '@angular/forms';
-import { BasicInComponent } from '../components/basic-in/basic-in.component'
+import { BasicInComponent } from '../components/basic-in/basic-in.component';
+import { TextbookPertainComponent } from '../components/textbook-pertain/textbook-pertain.component';
+import { TextbookContentComponent }  from '../components/textbook-content/textbook-content.component'
+import { AttachmentComponent } from '../components/attachment/attachment.component'
+// import { NzLayoutModule } from 'ng-zorro-antd/layout';
 @Component({
   selector: 'app-apply',
-  imports: [CommonCompModule,ReactiveFormsModule,BasicInComponent],
+  imports: [
+    CommonCompModule,
+    ReactiveFormsModule,
+    BasicInComponent,
+    TextbookPertainComponent,
+    TextbookContentComponent,
+    AttachmentComponent
+  ],
   standalone: true,
   templateUrl: './apply.component.html',
-  styleUrls: ['./apply.component.scss']
+  styleUrls: ['./apply.component.scss'],
 })
 export class ApplyComponent implements OnInit {
-  state:number = 0
-  get stateMap(){
-    let map:any = {
-      '0':'教材基本信息',
-      '1':'教材适用情况',
-      '2':'填写材料内容',
-      '3':'上传附件及承诺',
-    }
-    return map[this.state]
+  state: number = 0;
+  get stateMap() {
+    let map: any = {
+      '0': '教材基本信息',
+      '1': '教材适用情况',
+      '2': '申报教材建设历程',
+      '3': '附件材料',
+    };
+    return map[this.state];
   }
-  editForm:any
+  editForm: any;
 
-  constructor(
-    private router:Router,
-  ) {}
+  constructor(private router: Router) {}
 
-  ngOnInit() {
+  ngOnInit() {}
+  next() {
+    this.state++;
   }
+  save() {}
 }

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

@@ -0,0 +1,513 @@
+<div class="entry">
+  <form
+    nz-form
+    [formGroup]="validateForm"
+    class="login-form"
+    (ngSubmit)="submitForm()"
+  >
+    <div class="author-content">
+      <div class="title">教材电子版</div>
+      <div class="text">
+        教材出版单位配合按要求上传各地推荐的本单位出版的纸质教材最新印次的完整PDF电子版；数字教材上传全部教材内容电子版或填写能够查看全部教材内容的链接地址、账号；纸质教材附带数字资源的，上传纸质教材最新印次的完整PDF电子版，以及全部数字资源电子版或能够查看全部数字资源内容的链接地址、账号
+      </div>
+      <nz-checkbox-group
+        style="margin: 10px 0"
+        formControlName="textbookTypes"
+        [(ngModel)]="checkOptionsOne"
+      ></nz-checkbox-group>
+      <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]="10"
+              [nzXs]="10"
+              nzRequired
+              >上传教材文件</nz-form-label
+            >
+            <nz-form-control
+              class="val"
+              nzErrorTip="请上传教材文件"
+              style="width: 100%"
+            >
+              <nz-upload
+                formControlName="textbookFiles"
+                nzAction="https://www.mocky.io/v2/5cc8019d300000980a055e76"
+                [nzHeaders]="{ authorization: 'authorization-text' }"
+                (nzChange)="handleChange($event)"
+              >
+                <div style="color: #3e49b3">
+                  <span nz-icon nzType="upload"></span>上传教材
+                </div>
+              </nz-upload>
+              <div class="text" style="margin: 10px 0">
+                支持批量上传 PDF、EPUB、AZW3、Mp4，单个文件小于 2M
+              </div>
+            </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-textarea-count [nzMaxCharacterCount]="1000">
+                <textarea
+                  style="min-height: 160px"
+                  rows="4"
+                  formControlName="links"
+                  placeholder="请填写数字内容链接地址、账号，每项内容使用回车键分隔"
+                  nz-input
+                ></textarea>
+              </nz-textarea-count>
+            </nz-form-control>
+          </nz-form-item>
+        </div>
+      </div>
+    </div>
+    <div class="author-content">
+      <div class="title">所有作者政治审查意见</div>
+      <div class="text">
+        从本申报平台<a>下载格式要求</a>后，对应作者姓名上传“作者政治审查表”，支持
+        PDF、JPG、JPEG、PNG 格式，大小不超过
+        2M。作者单位党委对作者进行审查，对政治思想表现情况进行评价，确保作者的正确政治方向、价值取向，无违法违纪等记录。教材编写成员涉及多个不同单位时需要各单位分别出具意见，并由所在单位党委盖章。
+      </div>
+
+      <nz-table
+        #basicTable
+        [nzData]="courses"
+        [nzScroll]="{ x: (maxWidth || '1200') + 'px' }"
+      >
+        <thead>
+          <tr>
+            <th nzWidth="80px" nzLeft nzAlign="right">序号</th>
+            <th nzWidth="120px">出版时间</th>
+            <th nzWidth="100px">字数</th>
+            <th nzWidth="100px">重印次数</th>
+            <th nzWidth="100px">本版总印数</th>
+            <th nzWidth="200px">获奖励情况</th>
+            <th nzWidth="80px" nzRight>操作</th>
+          </tr>
+        </thead>
+        <tbody>
+          @for (data of courses; track $index) {
+          <tr>
+            <td nzLeft nzAlign="right">{{ $index + 1 }}</td>
+            <td>
+              <nz-date-picker
+                nzMode="month"
+                [ngModelOptions]="{ standalone: true }"
+                [(ngModel)]="data.date"
+              ></nz-date-picker>
+            </td>
+            <td>
+              <nz-input-group
+                style="width: 100%"
+                [nzSuffix]="suffixTemplateInfo"
+              >
+                <input
+                  type="number"
+                  [(ngModel)]="data.wordage"
+                  nz-input
+                  placeholder="请输入字数"
+                  [ngModelOptions]="{ standalone: true }"
+                />
+              </nz-input-group>
+              <ng-template #suffixTemplateInfo>万</ng-template>
+            </td>
+            <td>
+              <nz-input-group
+                style="width: 100%"
+                [nzSuffix]="suffixTemplateInfo2"
+              >
+                <input
+                  type="number"
+                  [(ngModel)]="data.num"
+                  nz-input
+                  placeholder="请输入重印次数"
+                  [ngModelOptions]="{ standalone: true }"
+                />
+              </nz-input-group>
+              <ng-template #suffixTemplateInfo2>次</ng-template>
+            </td>
+            <td>
+              <nz-input-group
+                style="width: 100%"
+                [nzSuffix]="suffixTemplateInfo"
+              >
+                <input
+                  type="number"
+                  [(ngModel)]="data.sumNum"
+                  nz-input
+                  placeholder="请输入本版总印数"
+                  [ngModelOptions]="{ standalone: true }"
+                />
+              </nz-input-group>
+              <ng-template #suffixTemplateInfo>万</ng-template>
+            </td>
+            <td>
+              <input
+                nz-input
+                type="number"
+                placeholder="请输入所获奖项"
+                [ngModelOptions]="{ standalone: true }"
+                [(ngModel)]="data.accolade"
+                nzStatus=""
+              />
+            </td>
+            <td nzRight>
+              <a class="edit-icon" (click)="onPush($index)"
+                ><span
+                  nz-icon
+                  style="font-size: 20px; margin-right: 10px"
+                  nzType="plus-circle"
+                  nzTheme="outline"
+                ></span
+              ></a>
+              <a class="edit-icon" (click)="onDel($index)"
+                ><span
+                  nz-icon
+                  style="font-size: 20px"
+                  nzType="delete"
+                  nzTheme="outline"
+                ></span
+              ></a>
+            </td>
+          </tr>
+          }
+        </tbody>
+      </nz-table>
+    </div>
+    <div class="author-content">
+      <div class="title">图书编校质量自查结果记录表</div>
+      <div class="text">
+        教材出版单位对申报教材的编校质量自查后，按要求提供图书编校质量自查结果记录表，并加盖出版社公章。全册教材的不同分册以不同文件分别上传。<a
+          >下载模板</a
+        >
+      </div>
+      <nz-form-item class="row" style="margin-bottom: 16px">
+        <nz-form-label
+          class="label"
+          [nzNoColon]="true"
+          [nzSm]="10"
+          [nzXs]="10"
+          nzRequired
+          >上传图书编校质量自查结果记录表</nz-form-label
+        >
+        <nz-form-control
+          class="val"
+          nzErrorTip="请上图书编校质量自查结果记录表"
+          style="width: 100%"
+        >
+          <nz-upload
+            formControlName="textbookFiles"
+            nzAction="https://www.mocky.io/v2/5cc8019d300000980a055e76"
+            [nzHeaders]="{ authorization: 'authorization-text' }"
+            (nzChange)="handleChange($event)"
+          >
+            <div style="color: #3e49b3">
+              <span nz-icon nzType="upload"></span>上传文件
+            </div>
+          </nz-upload>
+          <div class="text" style="margin: 10px 0">
+            支持批量上传 PDF、JPG、JPEG、PNG 格式，单个文件大小不超过 2M
+          </div>
+        </nz-form-control>
+      </nz-form-item>
+    </div>
+    <div class="author-content">
+      <div class="title">专家审核意见表</div>
+      <div class="text">
+        由第一主编所在单位和出版机构邀请校内外相关学科专业领域专家，对教材进行思想性、学术性审核。专家不少于
+        3
+        名，其中半数以上为校外专家，专家分别实名评价并签字，并注明所在单位及专业身份。评价人不得是本教材的作者。<a
+          >下载模板</a
+        >
+      </div>
+      <nz-form-item class="row" style="margin-bottom: 16px">
+        <nz-form-label
+          class="label"
+          [nzNoColon]="true"
+          [nzSm]="10"
+          [nzXs]="10"
+          nzRequired
+          >上传专家审核意见表</nz-form-label
+        >
+        <nz-form-control
+          class="val"
+          nzErrorTip="请上传专家审核意见表"
+          style="width: 100%"
+        >
+          <nz-upload
+            formControlName="textbookFiles"
+            nzAction="https://www.mocky.io/v2/5cc8019d300000980a055e76"
+            [nzHeaders]="{ authorization: 'authorization-text' }"
+            (nzChange)="handleChange($event)"
+          >
+            <div style="color: #3e49b3">
+              <span nz-icon nzType="upload"></span>上传文件
+            </div>
+          </nz-upload>
+          <div class="text" style="margin: 10px 0">
+            支持批量上传 PDF、JPG、JPEG、PNG 格式，单个大小不超过 2M
+          </div>
+        </nz-form-control>
+      </nz-form-item>
+    </div>
+    <div class="author-content">
+      <div class="title">教材使用情况证明材料</div>
+      <div class="text">
+        教材出版单位提供教材主要使用高校名单及使用情况证明材料，并加盖公章。<a
+          >下载模板</a
+        >
+      </div>
+      <nz-form-item class="row" style="margin-bottom: 16px">
+        <nz-form-label
+          class="label"
+          [nzNoColon]="true"
+          [nzSm]="10"
+          [nzXs]="10"
+          nzRequired
+          >教材使用情况证明材料</nz-form-label
+        >
+        <nz-form-control
+          class="val"
+          nzErrorTip="请上教材使用情况证明材料"
+          style="width: 100%"
+        >
+          <nz-upload
+            formControlName="textbookFiles"
+            nzAction="https://www.mocky.io/v2/5cc8019d300000980a055e76"
+            [nzHeaders]="{ authorization: 'authorization-text' }"
+            (nzChange)="handleChange($event)"
+          >
+            <div style="color: #3e49b3">
+              <span nz-icon nzType="upload"></span>上传文件
+            </div>
+          </nz-upload>
+          <div class="text" style="margin: 10px 0">
+            支持批量上传 PDF、JPG、JPEG、PNG 格式，单个文件大小不超过 2M
+          </div>
+        </nz-form-control>
+      </nz-form-item>
+    </div>
+    <div class="author-content">
+      <div class="title">其他材料</div>
+      <div class="text">其他佐证材料。</div>
+
+      <nz-upload
+        formControlName="textbookFiles"
+        nzAction="https://www.mocky.io/v2/5cc8019d300000980a055e76"
+        [nzHeaders]="{ authorization: 'authorization-text' }"
+        (nzChange)="handleChange($event)"
+      >
+        <div style="color: #3e49b3">
+          <span nz-icon nzType="upload"></span>上传文件
+        </div>
+      </nz-upload>
+      <div class="text" style="margin: 10px 0">
+        支持批量上传 PDF、JPG、JPEG、PNG 格式，单个文件大小不超过 2M
+      </div>
+    </div>
+    <div class="author-content">
+      <div class="nav">教材作者诚信承诺</div>
+      <div class="text">请输入作者诚信承诺文字内容，并上传所有作者签名</div>
+      <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: 450px"
+        >
+          <input
+            formControlName="links"
+            placeholder="请输入承诺内容"
+            nz-input
+          />
+        </nz-form-control>
+      </nz-form-item>
+    </div>
+    <div class="author-content">
+      <nz-form-label
+        class="label"
+        [nzNoColon]="true"
+        [nzSm]="16"
+        [nzXs]="16"
+        nzRequired
+        >上传所有作者签名，支持 PDF、PNG 格式，文件大小不超过 1M</nz-form-label
+      >
+      <nz-table
+        #basicTable
+        [nzData]="courses"
+        [nzScroll]="{ x: (maxWidth || '1200') + 'px' }"
+      >
+        <thead>
+          <tr>
+            <th nzWidth="80px" nzLeft nzAlign="right">序号</th>
+            <th nzWidth="120px">出版时间</th>
+            <th nzWidth="100px">字数</th>
+            <th nzWidth="100px">重印次数</th>
+            <th nzWidth="100px">本版总印数</th>
+            <th nzWidth="200px">获奖励情况</th>
+            <th nzWidth="80px" nzRight>操作</th>
+          </tr>
+        </thead>
+        <tbody>
+          @for (data of courses; track $index) {
+          <tr>
+            <td nzLeft nzAlign="right">{{ $index + 1 }}</td>
+            <td>
+              <nz-date-picker
+                nzMode="month"
+                [ngModelOptions]="{ standalone: true }"
+                [(ngModel)]="data.date"
+              ></nz-date-picker>
+            </td>
+            <td>
+              <nz-input-group
+                style="width: 100%"
+                [nzSuffix]="suffixTemplateInfo"
+              >
+                <input
+                  type="number"
+                  [(ngModel)]="data.wordage"
+                  nz-input
+                  placeholder="请输入字数"
+                  [ngModelOptions]="{ standalone: true }"
+                />
+              </nz-input-group>
+              <ng-template #suffixTemplateInfo>万</ng-template>
+            </td>
+            <td>
+              <nz-input-group
+                style="width: 100%"
+                [nzSuffix]="suffixTemplateInfo2"
+              >
+                <input
+                  type="number"
+                  [(ngModel)]="data.num"
+                  nz-input
+                  placeholder="请输入重印次数"
+                  [ngModelOptions]="{ standalone: true }"
+                />
+              </nz-input-group>
+              <ng-template #suffixTemplateInfo2>次</ng-template>
+            </td>
+            <td>
+              <nz-input-group
+                style="width: 100%"
+                [nzSuffix]="suffixTemplateInfo"
+              >
+                <input
+                  type="number"
+                  [(ngModel)]="data.sumNum"
+                  nz-input
+                  placeholder="请输入本版总印数"
+                  [ngModelOptions]="{ standalone: true }"
+                />
+              </nz-input-group>
+              <ng-template #suffixTemplateInfo>万</ng-template>
+            </td>
+            <td>
+              <input
+                nz-input
+                type="number"
+                placeholder="请输入所获奖项"
+                [ngModelOptions]="{ standalone: true }"
+                [(ngModel)]="data.accolade"
+                nzStatus=""
+              />
+            </td>
+            <td nzRight>
+              <a class="edit-icon" (click)="onPush($index)"
+                ><span
+                  nz-icon
+                  style="font-size: 20px; margin-right: 10px"
+                  nzType="plus-circle"
+                  nzTheme="outline"
+                ></span
+              ></a>
+              <a class="edit-icon" (click)="onDel($index)"
+                ><span
+                  nz-icon
+                  style="font-size: 20px"
+                  nzType="delete"
+                  nzTheme="outline"
+                ></span
+              ></a>
+            </td>
+          </tr>
+          }
+        </tbody>
+      </nz-table>
+    </div>
+    <div class="author-content">
+      <div class="nav">申报单位承诺意见</div>
+      <div class="text">
+        作者 /
+        主编所在高校主管领导或出版单位主管领导在申报单位承诺意见表格签字并加盖高校
+        / 出版单位公章后上传此项。<a>下载模板</a>
+      </div>
+      <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: 450px"
+        >
+          <nz-upload
+            formControlName="textbookFiles"
+            nzAction="https://www.mocky.io/v2/5cc8019d300000980a055e76"
+            [nzHeaders]="{ authorization: 'authorization-text' }"
+            (nzChange)="handleChange($event)"
+          >
+            <div style="color: #3e49b3">
+              <span nz-icon nzType="upload"></span>上传文件
+            </div>
+          </nz-upload>
+          <div class="text" style="margin: 10px 0">
+            支持批量上传 PDF、JPG、JPEG、PNG 格式，单个文件大小不超过 2M
+          </div>
+        </nz-form-control>
+      </nz-form-item>
+    </div>
+  </form>
+</div>
+<div class="footer">
+  <button
+    nz-button
+    nzType="default"
+    style="margin-right: 20px"
+    (click)="submitForm('save')"
+  >
+    保存本页
+  </button>
+  <button nz-button nzType="primary" (click)="submitForm('next')">
+    下一页
+  </button>
+</div>

projects/textbook/src/modules/nav-author/components/attachment/attachment.component.scss

@@ -0,0 +1,63 @@
+.entry{
+  min-height: 500px;
+  font-family: PingFang SC;
+  .row{
+    display: flex;
+    flex-direction: column;
+    align-items: start;
+    width: 100%;
+    .label{
+      margin: 10px 0 6px;
+    }
+    .val{
+      min-height: auto;
+    }
+  }
+  .author-content{
+    .edit-icon{
+      color:#756B6D;
+    }
+    .nav{
+      font-family: PingFang SC;
+      font-size: 20px;
+      font-weight: 500;
+      line-height: 28px;
+      text-align: left;
+      margin: 20px 0 10px;
+    }
+    .title{
+      font-family: PingFang SC;
+      font-size: 16px;
+      font-weight: 500;
+      line-height: 22px;
+      text-align: left;
+      margin: 10px 0;
+    }
+    .text{
+      font-family: PingFang SC;
+      font-size: 14px;
+      font-weight: 400;
+      line-height: 22px;
+      text-align: left;
+    }
+    .explain{
+      
+    }
+  }
+  .tips{
+    margin-top: 10px;
+    padding: 10px;
+    background: #3e49b314;
+    border-radius: 6px;
+  }
+
+}
+.footer{
+  display: flex;
+  margin: 10px auto;
+  align-items: center;
+  justify-content: space-evenly;
+  // width: 200px;
+  justify-content: end;
+  padding-right: 100px;
+}

projects/textbook/src/modules/nav-author/components/attachment/attachment.component.spec.ts

@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { AttachmentComponent } from './attachment.component';
+
+describe('AttachmentComponent', () => {
+  let component: AttachmentComponent;
+  let fixture: ComponentFixture<AttachmentComponent>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ AttachmentComponent ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(AttachmentComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

projects/textbook/src/modules/nav-author/components/attachment/attachment.component.ts

@@ -0,0 +1,117 @@
+import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
+import { CommonCompModule } from '../../../../services/common.modules';
+import { NzSelectModule } from 'ng-zorro-antd/select';
+import { ReactiveFormsModule } from '@angular/forms';
+import { NzRadioModule } from 'ng-zorro-antd/radio';
+import { NzMessageService } from 'ng-zorro-antd/message';
+import { NzGridModule } from 'ng-zorro-antd/grid';
+import { NzCheckboxModule } from 'ng-zorro-antd/checkbox';
+import { NzTableModule } from 'ng-zorro-antd/table';
+import { NzUploadChangeParam } from 'ng-zorro-antd/upload';
+import { NzUploadModule } from 'ng-zorro-antd/upload';
+import {
+  FormControl,
+  FormGroup,
+  NonNullableFormBuilder,
+  Validators,
+} from '@angular/forms';
+interface course {
+  date: Date | any;
+  wordage: number | any;
+  num: number | any;
+  sumNum: number | any;
+  accolade: string;
+}
+@Component({
+  selector: 'app-attachment',
+  imports: [
+    CommonCompModule,
+    ReactiveFormsModule,
+    NzSelectModule,
+    NzRadioModule,
+    NzGridModule,
+    NzCheckboxModule,
+    NzTableModule,
+    NzUploadModule
+  ],
+  standalone: true,
+  templateUrl: './attachment.component.html',
+  styleUrls: ['./attachment.component.scss'],
+})
+export class AttachmentComponent implements OnInit {
+  @Input('editFrom') editFrom: any;
+  @Input('maxWidth') maxWidth: number = 0;
+  @Output() next: EventEmitter<any> = new EventEmitter<any>();
+  @Output() save: EventEmitter<any> = new EventEmitter<any>();
+  validateForm: FormGroup<{
+    textbookTypes: FormControl<Array<string> | any>; //教材电子版
+    textbookFiles: FormControl<Array<string> | any>;//上传教材文件
+    links: FormControl<string> //教材数字内容链接地址、账号
+  }> = this.fb.group({
+    textbookTypes: ['', [Validators.required]],
+    textbookFiles: ['', [Validators.required]],
+    links: ['', [Validators.required]],
+  });
+  checkOptionsOne = [
+    { label: '纸质教材', value: '纸质教材' },
+    { label: '电子教材 / 资源', value: '电子教材 / 资源' },
+  ];
+  //申报教材建设历程
+  courses: Array<course> = [
+    {
+      date: '', //出版时间
+      wordage: '', //字数
+      num: '', //重印次数
+      sumNum: '', //本版总印数
+      accolade: '', //获奖励情况
+    },
+  ];
+  constructor(
+    private fb: NonNullableFormBuilder,
+    private msg: NzMessageService
+  ) {}
+  ngOnInit() {}
+  submitForm(event?: string): void {
+    console.log(this.validateForm.value);
+    if (this.validateForm.valid) {
+      console.log(this.validateForm.value);
+    } else {
+      Object.values(this.validateForm.controls).forEach((control) => {
+        if (control.invalid) {
+          control.markAsDirty();
+          control.updateValueAndValidity({ onlySelf: true });
+        }
+      });
+      this.msg.warning('请填写完整信息');
+    }
+    if (event == 'next') {
+      this.next.emit();
+    }
+  }
+  changeCode() {}
+  getCode(e: any) {}
+  //添加作者信息
+  onPush(idx: number) {
+    this.courses.splice(idx + 1, 0, {
+      date: '',
+      wordage: '',
+      num: '',
+      sumNum: '',
+      accolade: '',
+    });
+  }
+  //删除作者信息
+  onDel(idx: number) {
+    this.courses.splice(idx, 1);
+  }
+  handleChange(info: NzUploadChangeParam): void {
+    if (info.file.status !== 'uploading') {
+      console.log(info.file, info.fileList);
+    }
+    if (info.file.status === 'done') {
+      this.msg.success(`${info.file.name} file uploaded successfully`);
+    } else if (info.file.status === 'error') {
+      this.msg.error(`${info.file.name} file upload failed.`);
+    }
+  }
+}

projects/textbook/src/modules/nav-author/components/basic-in/basic-in.component.html

@@ -6,7 +6,7 @@
     (ngSubmit)="submitForm()"
   >
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired nzFor="user"
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired nzFor="user"
         >申报教材名称</nz-form-label
       >
       <nz-form-control nzErrorTip="请输入申报教材名称" [nzSm]="12" [nzXs]="12">
@@ -21,7 +21,7 @@
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired
         >国际标准书号</nz-form-label
       >
       <nz-form-control nzErrorTip="请输入国际标准书号" [nzSm]="12" [nzXs]="12">
@@ -36,7 +36,7 @@
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired
         >第一主编（作者）</nz-form-label
       >
       <nz-form-control
@@ -55,7 +55,7 @@
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired
         >第一主编（作者）单位</nz-form-label
       >
       <nz-form-control
@@ -74,20 +74,44 @@
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired>申报类型</nz-form-label>
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired>申报类型</nz-form-label>
       <nz-form-control nzErrorTip="请输入申报类型" [nzSm]="12" [nzXs]="12">
         <nz-input-group>
-          <input
+          <!-- <input
             type="text"
             nz-input
             formControlName="type"
             placeholder="请输入申报类型"
-          />
+          /> -->
+
+          <nz-radio-group
+            style="display: flex; flex-direction: column"
+            formControlName="type"
+          >
+            <label nz-radio nzValue="单册">单册</label>
+            <div class="basic-row">
+              <label nz-radio nzValue="全册">单册</label>
+              @if (validateForm.value.type =='全册') {
+              <nz-input-group
+                style="flex:1; margin-left: 20px"
+                [nzSuffix]="suffixTemplateInfo"
+              >
+                <input
+                  type="number"
+                  formControlName="typeNumber"
+                  nz-input
+                  placeholder="输入册数"
+                />
+              </nz-input-group>
+              <ng-template #suffixTemplateInfo> 册 </ng-template>
+              }
+            </div>
+          </nz-radio-group>
         </nz-input-group>
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired
         >教材应用对象及所诉学科专业类</nz-form-label
       >
       <nz-form-control
@@ -117,7 +141,7 @@
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired
         >教材主要语种类型</nz-form-label
       >
       <nz-form-control
@@ -147,7 +171,7 @@
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired
         >其他主编姓名</nz-form-label
       >
       <nz-form-control nzErrorTip="请输入其他主编姓名" [nzSm]="12" [nzXs]="12">
@@ -162,7 +186,7 @@
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired
         >其他编者姓名</nz-form-label
       >
       <nz-form-control nzErrorTip="请输入其他编者姓名" [nzSm]="12" [nzXs]="12">
@@ -177,7 +201,7 @@
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired
         >是否重点立项教材</nz-form-label
       >
       <nz-form-control nzErrorTip="请输入完成项" [nzSm]="12" [nzXs]="12">
@@ -203,7 +227,7 @@
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired>出版单位</nz-form-label>
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired>出版单位</nz-form-label>
       <nz-form-control nzErrorTip="请输入出版单位" [nzSm]="12" [nzXs]="12">
         <nz-input-group>
           <input
@@ -216,7 +240,7 @@
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired>初版时间</nz-form-label>
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired>初版时间</nz-form-label>
       <nz-form-control nzErrorTip="请输入初版时间" [nzSm]="12" [nzXs]="12">
         <nz-input-group>
           <nz-date-picker
@@ -228,7 +252,7 @@
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired>载体形式</nz-form-label>
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired>载体形式</nz-form-label>
       <nz-form-control nzErrorTip="请输入载体形式" [nzSm]="12" [nzXs]="12">
         <nz-input-group>
           <nz-select
@@ -252,7 +276,7 @@
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired
         >出版时间及版次</nz-form-label
       >
       <nz-form-control nzErrorTip="请输入出版时间" [nzSm]="12" [nzXs]="12">
@@ -280,7 +304,7 @@
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired
         >最新印次时间及印次</nz-form-label
       >
       <nz-form-control nzErrorTip="请输入完整内容" [nzSm]="12" [nzXs]="12">
@@ -309,7 +333,7 @@
     </nz-form-item>
 
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired
         >初版以来合计印次</nz-form-label
       >
       <nz-form-control
@@ -331,17 +355,11 @@
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired
         >初版以来是否列为重点项目</nz-form-label
       >
       <nz-form-control nzErrorTip="" [nzSm]="12" [nzXs]="12">
         <nz-input-group>
-          <!-- <input
-            type="text"
-            nz-input
-            formControlName="importantProject"
-            placeholder=""
-          /> -->
           <nz-radio-group
             style="display: flex; flex-direction: column"
             formControlName="importantProject"
@@ -362,7 +380,7 @@
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired>版权页截图</nz-form-label>
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired>版权页截图</nz-form-label>
       <nz-form-control nzErrorTip="请输入版权页截图" [nzSm]="12" [nzXs]="12">
         <nz-input-group>
           <nz-upload
@@ -380,7 +398,7 @@
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="margin-bottom: 16px">
-      <nz-form-label [nzSm]="8" [nzXs]="8" nzRequired
+      <nz-form-label [nzSm]="8" [nzNoColon]="true" [nzXs]="8" nzRequired
         >中国版本图书馆CIP查询截图</nz-form-label
       >
       <nz-form-control nzErrorTip="" [nzSm]="12" [nzXs]="12">
@@ -402,7 +420,7 @@
                 nz-icon
                 nzType="exclamation-circle"
                 nzTheme="fill"
-                style="font-size: 16px; color: #3e49b3;margin-right: 4px;"
+                style="font-size: 16px; color: #3e49b3; margin-right: 4px"
               ></span
               >如 CIP
               数据中无“教材”字样的，须再上传内容提要或前言或后记中可以证明本书为教材的相关内容截图

projects/textbook/src/modules/nav-author/components/basic-in/basic-in.component.scss

@@ -1,8 +1,10 @@
 .entry{
+  font-family: PingFang SC;
   min-height: 500px;
   // border: 1px solid;
   .basic-row{
     display: flex;
+    align-items: center;
     justify-content: space-between;
     width: 100%;
   }

projects/textbook/src/modules/nav-author/components/basic-in/basic-in.component.ts

@@ -13,10 +13,6 @@ import {
   NonNullableFormBuilder,
   Validators,
 } from '@angular/forms';
-interface applyType {
-  type: string;
-  num: string;
-}
 @Component({
   selector: 'app-basic',
   imports: [
@@ -40,7 +36,9 @@ export class BasicInComponent implements OnInit {
     ISBN: FormControl<string>; //国际标准书号
     author: FormControl<string>; //第一主编（作者）
     unit: FormControl<string>; //第一主编（作者）单位
-    type: FormControl<applyType | any>; //申报类型
+    type: FormControl<string>; //申报类型
+    typeNumber: FormControl<number|any>; //全册次数
+
     majorPoniter: FormControl<string>; //教材应用对象及所诉学科专业类
     lang: FormControl<string>; //教材主要语种类型
     authors: FormControl<string>; //其他主编姓名
@@ -71,6 +69,8 @@ export class BasicInComponent implements OnInit {
     author: ['', [Validators.required]],
     unit: ['', [Validators.required]],
     type: ['', [Validators.required]],
+    typeNumber: ['', [Validators.required]],
+
     majorPoniter: ['', [Validators.required]],
     lang: ['', [Validators.required]],
     authors: ['', [Validators.required]],

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

@@ -0,0 +1,176 @@
+<div class="entry">
+  <form
+    nz-form
+    [formGroup]="validateForm"
+    class="login-form"
+    (ngSubmit)="submitForm()"
+  >
+    <div class="author-content">
+      <nz-table
+        #basicTable
+        [nzData]="courses"
+        [nzScroll]="{ x: (maxWidth || '1200') + 'px' }"
+      >
+        <thead>
+          <tr>
+            <th nzWidth="80px" nzLeft nzAlign="right">序号</th>
+            <th nzWidth="120px">出版时间</th>
+            <th nzWidth="100px">字数</th>
+            <th nzWidth="100px">重印次数</th>
+            <th nzWidth="100px">本版总印数</th>
+            <th nzWidth="200px">获奖励情况</th>
+            <th nzWidth="80px" nzRight>操作</th>
+          </tr>
+        </thead>
+        <tbody>
+          @for (data of courses; track $index) {
+          <tr>
+            <td nzLeft nzAlign="right">{{ $index + 1 }}</td>
+            <td>
+              <nz-date-picker
+                nzMode="month"
+                [ngModelOptions]="{ standalone: true }"
+                [(ngModel)]="data.date"
+              ></nz-date-picker>
+            </td>
+            <td>
+              <nz-input-group
+                style="width: 100%"
+                [nzSuffix]="suffixTemplateInfo"
+              >
+                <input
+                  type="number"
+                  [(ngModel)]="data.wordage"
+                  nz-input
+                  placeholder="请输入字数"
+                  [ngModelOptions]="{ standalone: true }"
+                />
+              </nz-input-group>
+              <ng-template #suffixTemplateInfo>万</ng-template>
+            </td>
+            <td>
+              <nz-input-group
+                style="width: 100%"
+                [nzSuffix]="suffixTemplateInfo2"
+              >
+                <input
+                  type="number"
+                  [(ngModel)]="data.num"
+                  nz-input
+                  placeholder="请输入重印次数"
+                  [ngModelOptions]="{ standalone: true }"
+                />
+              </nz-input-group>
+              <ng-template #suffixTemplateInfo2>次</ng-template>
+            </td>
+            <td>
+              <nz-input-group
+                style="width: 100%"
+                [nzSuffix]="suffixTemplateInfo"
+              >
+                <input
+                  type="number"
+                  [(ngModel)]="data.sumNum"
+                  nz-input
+                  placeholder="请输入本版总印数"
+                  [ngModelOptions]="{ standalone: true }"
+                />
+              </nz-input-group>
+              <ng-template #suffixTemplateInfo>万</ng-template>
+            </td>
+            <td>
+              <input
+                nz-input
+                type="number"
+                placeholder="请输入所获奖项"
+                [ngModelOptions]="{ standalone: true }"
+                [(ngModel)]="data.accolade"
+                nzStatus=""
+              />
+            </td>
+            <td nzRight>
+              <a (click)="onPush($index)"
+                ><span
+                  nz-icon
+                  style="font-size: 20px; margin-right: 10px"
+                  nzType="plus-circle"
+                  nzTheme="outline"
+                ></span
+              ></a>
+              <a (click)="onDel($index)"
+                ><span
+                  nz-icon
+                  style="font-size: 20px"
+                  nzType="delete"
+                  nzTheme="outline"
+                ></span
+              ></a>
+            </td>
+          </tr>
+          }
+        </tbody>
+      </nz-table>
+    </div>
+    <div class="author-content">
+      <div class="nav">申报教材特色及创新</div>
+      <nz-form-item class="row" style="margin-bottom: 16px">
+        <nz-form-control
+          class="val"
+          nzErrorTip="请输入本教材与同类教材相比较，突出的特色及改革创新点"
+          style="width: 100%"
+        >
+        <nz-textarea-count [nzMaxCharacterCount]="1000">
+          <textarea
+            style="min-height: 260px;"
+            rows="4"
+            formControlName="innovateExplain"
+            placeholder="请输入本教材与同类教材相比较，突出的特色及改革创新点"
+            nz-input
+          ></textarea>
+        </nz-textarea-count>
+        </nz-form-control>
+      </nz-form-item>
+    </div>
+    <div class="author-content">
+      <div class="nav">申报教材应用情况及社会影响力</div>
+      <nz-form-item class="row" style="margin-bottom: 16px">
+        <nz-form-control
+          class="val"
+          nzErrorTip="概述选用本教材的范围及学校，教学效果及评价"
+          style="width: 100%"
+        >
+        <nz-textarea-count [nzMaxCharacterCount]="1000">
+          <textarea
+            style="min-height: 260px;"
+            rows="4"
+            formControlName="influence"
+            placeholder="概述选用本教材的范围及学校，教学效果及评价"
+            nz-input
+          ></textarea>
+        </nz-textarea-count>
+        </nz-form-control>
+      </nz-form-item>
+    </div>
+  </form>
+</div>
+<div class="footer">
+  <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" (click)="submitForm('next')">
+    下一页
+  </button>
+</div>

projects/textbook/src/modules/nav-author/components/textbook-content/textbook-content.component.scss

@@ -0,0 +1,50 @@
+.entry{
+  min-height: 500px;
+  font-family: PingFang SC;
+  .row{
+    display: flex;
+    flex-direction: column;
+    align-items: start;
+    width: 100%;
+    .val{
+      min-height: auto;
+    }
+  }
+  .author-content{
+    a{
+      color:#756B6D;
+    }
+    .nav{
+      font-family: PingFang SC;
+      font-size: 20px;
+      font-weight: 500;
+      line-height: 28px;
+      text-align: left;
+      margin-bottom: 20px;
+    }
+    .title{
+      font-family: PingFang SC;
+      font-size: 16px;
+      font-weight: 500;
+      line-height: 22px;
+      text-align: left;
+      margin: 10px 0;
+    }
+  }
+  .tips{
+    margin-top: 10px;
+    padding: 10px;
+    background: #3e49b314;
+    border-radius: 6px;
+  }
+
+}
+.footer{
+  display: flex;
+  margin: 10px auto;
+  align-items: center;
+  justify-content: space-evenly;
+  // width: 200px;
+  justify-content: end;
+  padding-right: 100px;
+}

projects/textbook/src/modules/nav-author/components/textbook-content/textbook-content.component.spec.ts

@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { TextbookContentComponent } from './textbook-content.component';
+
+describe('TextbookContentComponent', () => {
+  let component: TextbookContentComponent;
+  let fixture: ComponentFixture<TextbookContentComponent>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ TextbookContentComponent ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(TextbookContentComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

projects/textbook/src/modules/nav-author/components/textbook-content/textbook-content.component.ts

@@ -0,0 +1,100 @@
+import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
+import { CommonCompModule } from '../../../../services/common.modules';
+import { NzSelectModule } from 'ng-zorro-antd/select';
+import { ReactiveFormsModule } from '@angular/forms';
+import { NzRadioModule } from 'ng-zorro-antd/radio';
+import { NzMessageService } from 'ng-zorro-antd/message';
+import { NzGridModule } from 'ng-zorro-antd/grid';
+import { NzCheckboxModule } from 'ng-zorro-antd/checkbox';
+import { NzTableModule } from 'ng-zorro-antd/table';
+import {
+  FormControl,
+  FormGroup,
+  NonNullableFormBuilder,
+  Validators,
+} from '@angular/forms';
+interface course {
+  date: Date|any,
+  wordage: number|any,
+  num: number|any,
+  sumNum:number|any,
+  accolade:string
+}
+
+@Component({
+  selector: 'app-textbook-content',
+  imports: [
+    CommonCompModule,
+    ReactiveFormsModule,
+    NzSelectModule,
+    NzRadioModule,
+    NzGridModule,
+    NzCheckboxModule,
+    NzTableModule,
+  ],
+  standalone: true,
+  templateUrl: './textbook-content.component.html',
+  styleUrls: ['./textbook-content.component.scss'],
+})
+export class TextbookContentComponent  implements OnInit {
+  @Input('editFrom') editFrom: any;
+  @Input('maxWidth') maxWidth: number = 0;
+  @Output() next: EventEmitter<any> = new EventEmitter<any>();
+  @Output() save: EventEmitter<any> = new EventEmitter<any>();
+  validateForm: FormGroup<{
+    innovateExplain: FormControl<string>; //申报教材特色及创新
+    influence: FormControl<string>; //申报教材应用情况及社会影响力
+  }> = this.fb.group({
+    innovateExplain: ['', [Validators.required]],
+    influence: ['', [Validators.required]],
+  });
+  //申报教材建设历程
+  courses: Array<course> = [
+    {
+      date: '',//出版时间
+      wordage: '',//字数
+      num: '',//重印次数
+      sumNum:'',//本版总印数
+      accolade:''//获奖励情况
+    },
+  ];
+  constructor(
+    private fb: NonNullableFormBuilder,
+    private msg: NzMessageService
+  ) { }
+
+  ngOnInit() {}
+  submitForm(event?: string): void {
+    console.log(this.validateForm.value);
+    if (this.validateForm.valid) {
+      console.log(this.validateForm.value);
+    } else {
+      Object.values(this.validateForm.controls).forEach((control) => {
+        if (control.invalid) {
+          control.markAsDirty();
+          control.updateValueAndValidity({ onlySelf: true });
+        }
+      });
+      this.msg.warning('请填写完整信息');
+    }
+    if (event == 'next') {
+      this.next.emit();
+    }
+  }
+  changeCode() {}
+  getCode(e: any) {}
+  //添加作者信息
+  onPush(idx: number) {
+    this.courses.splice(idx+1, 0, {
+      date: '',
+      wordage: '',
+      num: '',
+      sumNum:'',
+      accolade:''
+    });
+  }
+  //删除作者信息
+  onDel(idx: number) {
+    this.courses.splice(idx, 1);
+  }
+}

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

@@ -0,0 +1,346 @@
+<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]="10" [nzXs]="10" nzRequired
+              >适用专业代码(六位)及名称</nz-form-label
+            >
+            <nz-form-control
+              class="val"
+              nzErrorTip="填写适用专业代码(六位)及名称"
+              style="width: 100%"
+            >
+              <nz-select
+                style="width: 80%"
+                nzShowSearch
+                nzAllowClear
+                nzPlaceHolder="填写 6 位专业代码选择"
+                formControlName="code"
+                (ngModelChange)="changeCode()"
+                (nzOnSearch)="getCode($event)"
+              >
+                @for(major of selectList; track major.code;let index = $index){
+                <nz-option
+                  nzCustomContent
+                  [nzValue]="major.code"
+                  [nzLabel]="major.name"
+                  >{{ major.name }}</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-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>
+      <div class="title">作者（含主编，不超过 6 人，教材中明确出现姓名）</div>
+      <nz-table
+        #basicTable
+        [nzData]="dataArr"
+        [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="160px">手机号码</th>
+            <th nzWidth="160px">电子邮箱</th>
+            <th nzWidth="160px">分工</th>
+            <th nzWidth="100px" nzRight>操作</th>
+          </tr>
+        </thead>
+        <tbody>
+          @for (data of dataArr; 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>
+              <input
+                type="number"
+                nz-input
+                placeholder="请输入作者手机号码"
+                [ngModelOptions]="{ standalone: true }"
+                [(ngModel)]="data.mobile"
+                nzStatus=""
+              />
+            </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>
+              <a (click)="onPush('dataArr', index)"
+                ><span
+                  nz-icon
+                  style="font-size: 20px; margin-right: 10px"
+                  nzType="plus-circle"
+                  nzTheme="outline"
+                ></span
+              ></a>
+              <a (click)="onDel('dataArr',index)"
+                ><span
+                  nz-icon
+                  style="font-size: 20px"
+                  nzType="delete"
+                  nzTheme="outline"
+                ></span
+              ></a>
+            </td>
+          </tr>
+          }
+        </tbody>
+      </nz-table>
+    </div>
+    <div class="author-content">
+      <div class="nav">作者信息</div>
+      <nz-form-item class="row" style="margin-bottom: 16px">
+        <div class="title">作者信息</div>
+
+        <nz-form-control
+          class="val"
+          nzErrorTip="请输入第一主编（作者）承担学校教学任务、开展教学研究情况、教材编写情况以及取得的教学成果"
+          style="width: 100%"
+        >
+          <textarea
+            rows="4"
+            formControlName="authorDetails"
+            placeholder="请输入第一主编（作者）承担学校教学任务、开展教学研究情况、教材编写情况以及取得的教学成果"
+            nz-input
+          ></textarea>
+        </nz-form-control>
+      </nz-form-item>
+    </div>
+    <div class="author-content">
+      <div class="title">相关科学研究项目、成果或论文专著（限5项）</div>
+      <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 class="footer">
+  <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" (click)="submitForm('next')">
+    下一页
+  </button>
+</div>

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

@@ -0,0 +1,52 @@
+.entry{
+  min-height: 500px;
+  font-family: PingFang SC;
+  .row{
+    display: flex;
+    flex-direction: column;
+    align-items: start;
+    width: 100%;
+    // .label{
+    //   margin-bottom: 10px;
+    // }
+    .val{
+      min-height: auto;
+    }
+  }
+  .author-content{
+    a{
+      color:#756B6D;
+    }
+    .nav{
+      font-family: PingFang SC;
+      font-size: 20px;
+      font-weight: 500;
+      line-height: 28px;
+      text-align: left;
+    }
+    .title{
+      font-family: PingFang SC;
+      font-size: 16px;
+      font-weight: 500;
+      line-height: 22px;
+      text-align: left;
+      margin: 10px 0;
+    }
+  }
+  .tips{
+    margin-top: 10px;
+    padding: 10px;
+    background: #3e49b314;
+    border-radius: 6px;
+  }
+
+}
+.footer{
+  display: flex;
+  margin: 10px auto;
+  align-items: center;
+  justify-content: space-evenly;
+  // width: 200px;
+  justify-content: end;
+  padding-right: 100px;
+}

projects/textbook/src/modules/nav-author/components/textbook-pertain/textbook-pertain.component.spec.ts

@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { TextbookPertainComponent } from './textbook-pertain.component';
+
+describe('TextbookPertainComponent', () => {
+  let component: TextbookPertainComponent;
+  let fixture: ComponentFixture<TextbookPertainComponent>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ TextbookPertainComponent ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(TextbookPertainComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

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

@@ -0,0 +1,220 @@
+import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
+import { CommonCompModule } from '../../../../services/common.modules';
+import { NzSelectModule } from 'ng-zorro-antd/select';
+import { ReactiveFormsModule } from '@angular/forms';
+import { NzRadioModule } from 'ng-zorro-antd/radio';
+import { NzMessageService } from 'ng-zorro-antd/message';
+import { NzGridModule } from 'ng-zorro-antd/grid';
+import { NzCheckboxModule } from 'ng-zorro-antd/checkbox';
+import { NzTableModule } from 'ng-zorro-antd/table';
+import {
+  FormControl,
+  FormGroup,
+  NonNullableFormBuilder,
+  Validators,
+} from '@angular/forms';
+interface author {
+  name: string;
+  unit: string;
+  birth: Date | any;
+  nationality: string;
+  job: string;
+  title: string;
+  mobile: string;
+  email: string;
+  work: string;
+}
+interface achievementType {
+  name: string;
+  unit: string;
+  date: Date | any;
+}
+@Component({
+  selector: 'app-textbook-pertain',
+  imports: [
+    CommonCompModule,
+    ReactiveFormsModule,
+    NzSelectModule,
+    NzRadioModule,
+    NzGridModule,
+    NzCheckboxModule,
+    NzTableModule,
+  ],
+  standalone: true,
+  templateUrl: './textbook-pertain.component.html',
+  styleUrls: ['./textbook-pertain.component.scss'],
+})
+export class TextbookPertainComponent implements OnInit {
+  @Input('editFrom') editFrom: any;
+  @Input('maxWidth') maxWidth: number = 0;
+  @Output() next: EventEmitter<any> = new EventEmitter<any>();
+  @Output() save: EventEmitter<any> = new EventEmitter<any>();
+  validateForm: FormGroup<{
+    code: FormControl<string>; //适用专业代码及名称
+    period: FormControl<number | any>; //课程学时
+    lessons: FormControl<string>; //适用课程
+    characteristic: FormControl<Array<any> | any>; //适用课程性质
+    // authors: FormControl<Array<any> | any>; //作者信息
+    authorDetails: FormControl<string>; //第一主编（作者）情况
+    type: FormControl<string>; //申报类型
+    // achievement: FormControl<Array<any> | any>; //相关科学研究项目、成果或论文专著（限5项）
+  }> = this.fb.group({
+    code: ['', [Validators.required]],
+    period: ['', [Validators.required]],
+    lessons: ['', [Validators.required]],
+    characteristic: ['', [Validators.required]],
+    // authors: ['', [Validators.required]],
+    authorDetails: ['', [Validators.required]],
+    type: ['', [Validators.required]],
+    // achievement: ['', [Validators.required]],
+  });
+  //适用专业代码及名称
+  selectList: Array<any> = [
+    {
+      name: '机械与工程',
+      code: 'M001',
+    },
+    {
+      name: '软件工程',
+      code: 'M002',
+    },
+    {
+      name: '生物工程学',
+      code: 'M003',
+    },
+  ];
+  //适用课程性质
+  checkOptionsOne = [
+    { label: '必修课', value: '必修课' },
+    { label: '选修课', value: '选修课' },
+    { label: '通识课', value: '通识课' },
+    { label: '公共基础课', value: '公共基础课' },
+    { label: '专业课', value: '专业课' },
+    { label: '思想作者理论课', value: '思想作者理论课' },
+    { label: '实验课', value: '实验课' },
+  ];
+  // checkOptionsTwo = [
+  //   { label: '通识课', value: '通识课' },
+  //   { label: '公共基础课', value: '公共基础课' },
+  //   { label: '专业课', value: '专业课' },
+  // ];
+  // checkOptionsThree = [
+  //   { label: '思想作者理论课', value: '思想作者理论课' },
+  //   { label: '实验课', value: '实验课' },
+  // ];
+  //作者信息
+  dataArr: Array<author> = [
+    {
+      name: '',
+      unit: '',
+      birth: '',
+      nationality: '',
+      job: '',
+      title: '',
+      mobile: '',
+      email: '',
+      work: '',
+    },
+  ];
+  //相关科学研究项目、成果或论文专著（限5项）
+  achievementOptions: Array<achievementType> = [
+    {
+      name: '',
+      unit: '',
+      date: '',
+    },
+  ];
+  workOptions = ['主编', '作者', '副主编', '写者'];
+  constructor(
+    private fb: NonNullableFormBuilder,
+    private msg: NzMessageService
+  ) {}
+
+  ngOnInit() {}
+  submitForm(event?: string): void {
+    console.log(this.validateForm.value);
+    if (this.validateForm.valid) {
+      console.log(this.validateForm.value);
+    } else {
+      Object.values(this.validateForm.controls).forEach((control) => {
+        if (control.invalid) {
+          control.markAsDirty();
+          control.updateValueAndValidity({ onlySelf: true });
+        }
+      });
+      this.msg.warning('请填写完整信息');
+    }
+    if (event == 'next') {
+      this.next.emit();
+    }
+  }
+  changeCode() {}
+  getCode(e: any) {}
+
+  //添加作者信息
+  onPush(type: string, idx: number) {
+    switch (type) {
+      case 'dataArr':
+        this.dataArr.splice(idx+1, 0, {
+          name: '',
+          unit: '',
+          birth: '',
+          nationality: '',
+          job: '',
+          title: '',
+          mobile: '',
+          email: '',
+          work: '',
+        });
+        break;
+      case 'achievementOptions':
+        if (this.achievementOptions.length >= 5) {
+          this.msg.warning('最多添加5条');
+          return;
+        }
+        this.achievementOptions.splice(idx+1, 0, {
+          name: '',
+          unit: '',
+          date: '',
+        });
+        break;
+    }
+  }
+  //删除作者信息
+  onDel(type: string, idx: number) {
+    switch (type) {
+      case 'dataArr':
+        if (this.dataArr.length == 1) {
+          this.dataArr = [
+            {
+              name: '',
+              unit: '',
+              birth: '',
+              nationality: '',
+              job: '',
+              title: '',
+              mobile: '',
+              email: '',
+              work: '',
+            },
+          ];
+          return;
+        }
+        this.dataArr.splice(idx, 1);
+        break;
+      case 'achievementOptions':
+        if (this.achievementOptions.length == 1) {
+          this.achievementOptions = [
+            {
+              name: '',
+              unit: '',
+              date: '',
+            },
+          ];
+          return;
+        }
+        this.achievementOptions.splice(idx, 1);
+        break;
+    }
+  }
+}

projects/textbook/src/modules/nav-author/page-home/page-home.component.html

@@ -1,7 +1,7 @@
 <app-comp-nav></app-comp-nav>
 <div class="page">
   <div class="content-left">
-    <ul nz-menu nzMode="inline" style="width: 240px">
+    <ul nz-menu nzMode="inline" style="width: 240px;background: #f9eaea;">
       @for (item of options; track item.id;let index = $index) { @if(item.child)
       {
       <li nz-submenu [nzTitle]="item.name" nzIcon="api" [nzOpen]="true">

projects/textbook/src/modules/nav-author/page-home/page-home.component.scss

@@ -1,18 +1,39 @@
 .page{
+  font-family: PingFang SC;
   display: flex;
   height: calc(100% - 60px);
   // overflow-y: scroll;
   overflow-y: hidden;
   .content-left{
-    background-color:#fff;
+    background-color:#f9eaea;
   }
   .preview{
     height: 100%;
     overflow-y: scroll;
-    padding: 20px 0 40px 0;
+    padding: 0 0 40px 0;
     flex: 1;
   }
   .proview{
     flex: 1;
   }
+}
+::ng-deep .ant-menu-sub.ant-menu-inline{
+  background: #f9eaea;
+}
+::ng-deep .ant-menu-light .ant-menu-item:hover{
+  color: #c6233f !important;
+}
+::ng-deep .ant-menu-light .ant-menu-submenu-title:hover{
+  color: #c6233f !important;
+}
+::ng-deep .ant-menu-inline .ant-menu-item::after{
+  border-right: 3px solid #c6233f;
+}
+::ng-deep .ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected{
+  background-color: #f4cbcd;
+  color: #c6233f;
+}
+::ng-deep .ant-menu-submenu-selected{
+  background-color: #f4cbcd;
+  color: #c6233f !important;
 }