update author

projects/textbook/src/app/app.component.scss

@@ -0,0 +1,3 @@
+body{
+  background-color: #F9EAEA;
+}

projects/textbook/src/app/comp-nav/comp-nav.component.html

@@ -1,10 +1,39 @@
 <div class="bar">
-  <nz-avatar (click)="goUrl('/profile')" nzIcon="user" style="background-color:#87d068;"></nz-avatar>
-  <div class="title">{{tbookSer.profile?.name}}</div>
-  <div class="space"></div>
+  <nz-avatar
+    (click)="goUrl('/profile')"
+    nzIcon="user"
+    style="background-color: #87d068;cursor: pointer;"
+  ></nz-avatar>
+  @if(!viewCollapsed){
   <div class="user">
-    <button mat-icon-button (click)="authServr.logout()" aria-label="LogOut" style="margin-top: -10px;">
-      <mat-icon>logout</mat-icon>
+    <div class="name">{{ tbookSer.profile?.name || "彭秀龙" }}</div>
+    <div class="email">{{ tbookSer.profile?.email || "dayi@edu.com" }}</div>
+  </div>
+  <div class="more">
+    <button
+      mat-icon-button
+      nzType="primary"
+      nz-popover
+      nzPopoverTitle="操作"
+      [(nzPopoverVisible)]="visible"
+      (nzPopoverVisibleChange)="change($event)"
+      nzPopoverTrigger="click"
+      [nzPopoverContent]="contentTemplate"
+    >
+      <mat-icon fontIcon="more"></mat-icon>
     </button>
+    <ng-template #contentTemplate>
+      <div style="display: flex; flex-direction: column">
+        <a
+          nz-button
+          nzType="link"
+          (click)="clickMe()"
+          style="margin-bottom: 6px"
+          >我的</a
+        >
+        <a nz-button nzType="link" (click)="clickMe()">退出登录</a>
+      </div>
+    </ng-template>
   </div>
-</div>
+  }
+</div>

projects/textbook/src/app/comp-nav/comp-nav.component.scss

@@ -1,18 +1,31 @@
-.bar{
-  width: 100%;
+.bar {
+  // width: 100%;
   padding: 10px;
-  border-bottom: 1px solid #d3d3d3;
+  // border-bottom: 1px solid #d3d3d3;
   display: flex;
-  div{
-    margin-top:5px;
+  align-items: center;
+  border-top:  1px solid #d3d3d3;
+  .user {
+    display: flex;
+    flex-direction: column;
+    margin: 0 10px;
+    flex: 1;
+    .name {
+      font-family: PingFang SC;
+      font-size: 14px;
+      font-weight: 400;
+      line-height: 20px;
+      text-align: left;
+    }
+    .email {
+      font-family: Helvetica;
+      font-size: 14px;
+      font-weight: 400;
+      line-height: 20px;
+      text-align: left;
+    }
   }
-  .title{
-    margin-left: 10px;
+  .more{
+    flex-shrink: 0;
   }
-  .space{
-    flex:1;
-  }
-  .user{
-    width:100px;
-  }
-}
+}

projects/textbook/src/app/comp-nav/comp-nav.component.ts

@@ -1,22 +1,25 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, Input } from '@angular/core';
 import { NzAvatarModule } from 'ng-zorro-antd/avatar';
 import { textbookServer } from "../../services/textbook";
 import { MatButtonModule } from '@angular/material/button';
 import { MatIconModule } from '@angular/material/icon';
 import { RouterModule,Router } from '@angular/router';
 import { AuthServr } from '../../services/auth.service'
+import { NzPopoverModule } from 'ng-zorro-antd/popover';
 @Component({
   selector: 'app-comp-nav',
   standalone: true,
   imports: [
     RouterModule,
     NzAvatarModule,
-    MatButtonModule,MatIconModule
+    MatButtonModule,MatIconModule,NzPopoverModule
   ],
   templateUrl: './comp-nav.component.html',
   styleUrls: ['./comp-nav.component.scss'],
 })
 export class CompNavComponent implements OnInit {
+  visible: boolean = false;
+  @Input('viewCollapsed') viewCollapsed:boolean = false;
 
   constructor(
     public router: Router,
@@ -25,7 +28,12 @@ export class CompNavComponent implements OnInit {
   ) {}
 
   ngOnInit() {}
-    
+  change(value: boolean): void {
+    console.log(value);
+  }
+  clickMe(): void {
+    this.visible = false;
+  }
   goUrl(path: string) {
     this.router.navigate([
       path,

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

@@ -1,39 +1,39 @@
-<nz-page-header class="site-page-header" nzTitle="" nzSubtitle="">
-  <nz-breadcrumb nz-page-header-breadcrumb>
-    <nz-breadcrumb-item>个人空间</nz-breadcrumb-item>
-    <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="site-page-header">
+  <nz-page-header nzTitle="创建/编辑空间" nzSubtitle="" style="padding: 0;">
+    <nz-breadcrumb nz-page-header-breadcrumb>
+      <div class="back" (click)="back()"><span nz-icon nzType="left" nzTheme="outline"></span>返回</div>
+    </nz-breadcrumb>
+  </nz-page-header>
+  <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>
+</div>
+
 <div class="content">
   <div class="state-title">{{ stateMap }}</div>
   <div class="submit-block" #submitComp>
     @switch (state) { @case (0) {
-    <app-basic (next)="next()" (save)="save()"></app-basic>
+    <app-basic (state)="changeState($event)" (save)="save()"></app-basic>
     } @case (1) {
     <app-textbook-pertain
-      (next)="next()"
+      (state)="changeState($event)"
       (save)="save()"
       (maxWidth)="(submitComp.style.width)"
     ></app-textbook-pertain>
     } @case (2) {
     <app-textbook-content
-      (next)="next()"
+      (state)="changeState($event)"
       (save)="save()"
       (maxWidth)="(submitComp.style.width)"
     ></app-textbook-content>
     } @case (3) {
     <app-attachment
-      (next)="next()"
+      (state)="changeState($event)"
       (save)="save()"
       (maxWidth)="(submitComp.style.width)"
     ></app-attachment>

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

@@ -4,15 +4,24 @@
   z-index: 9;
   padding:24px 24px 10px;
   background-color: white;
+  font-family: PingFang SC;
   .steps{
     max-width: 1000px;
     margin: 10px 0;
   }
+  .back{
+    font-family: PingFang SC;
+    font-size: 14px;
+    font-weight: 400;
+    line-height: 22px;
+    text-align: left;
+    cursor: pointer;
+  }
 }
 
 .content {
   font-family: PingFang SC;
-  padding: 10px 20px;
+  padding: 10px 24px;
   .state-title {
     margin:0 0 20px;
     font-family: PingFang SC;

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

@@ -37,8 +37,17 @@ export class ApplyComponent implements OnInit {
   constructor(private router: Router) {}
 
   ngOnInit() {}
-  next() {
-    this.state++;
+  changeState(event:string|any){
+    console.log(event);
+    if(event == 'pre'){
+      this.state--;
+    }else{
+      this.state++;
+    }
   }
   save() {}
+
+  back(){
+    history.back()
+  }
 }

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

@@ -86,88 +86,79 @@
 
       <nz-table
         #basicTable
-        [nzData]="courses"
+        [nzData]="opinions"
         [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="120px">姓名</th>
+            <th nzWidth="120px">单位</th>
+            <th nzWidth="120px">出生年月</th>
+            <th nzWidth="120px">国籍</th>
+            <th nzWidth="120px" nzRight>
+              <nz-form-label [nzNoColon]="true" nzRequired
+                >作者政治审查表</nz-form-label
+              >
+            </th>
             <th nzWidth="80px" nzRight>操作</th>
           </tr>
         </thead>
         <tbody>
-          @for (data of courses; track $index) {
+          @for (data of opinions; track $index) {
           <tr>
             <td nzLeft nzAlign="right">{{ $index + 1 }}</td>
             <td>
-              <nz-date-picker
-                nzMode="month"
+              <input
+                nz-input
+                type="number"
+                placeholder="请填写作者姓名"
                 [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>
+                [(ngModel)]="data.name"
+                nzStatus=""
+              />
             </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>
+              <input
+                nz-input
+                type="number"
+                placeholder="请填写作者单位"
+                [ngModelOptions]="{ standalone: true }"
+                [(ngModel)]="data.unit"
+                nzStatus=""
+              />
             </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>
+              <nz-date-picker
+                nzMode="month"
+                [ngModelOptions]="{ standalone: true }"
+                [(ngModel)]="data.birth"
+              ></nz-date-picker>
             </td>
             <td>
               <input
                 nz-input
                 type="number"
-                placeholder="请输入所获奖项"
+                placeholder="请填写作者国籍"
                 [ngModelOptions]="{ standalone: true }"
-                [(ngModel)]="data.accolade"
+                [(ngModel)]="data.nationality"
                 nzStatus=""
               />
             </td>
             <td nzRight>
-              <a class="edit-icon" (click)="onPush($index)"
+              <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>
+            </td>
+            <td nzRight>
+              <a class="edit-icon" (click)="onPush('opinions', $index)"
                 ><span
                   nz-icon
                   style="font-size: 20px; margin-right: 10px"
@@ -175,7 +166,7 @@
                   nzTheme="outline"
                 ></span
               ></a>
-              <a class="edit-icon" (click)="onDel($index)"
+              <a class="edit-icon" (click)="onDel('opinions', $index)"
                 ><span
                   nz-icon
                   style="font-size: 20px"
@@ -322,7 +313,7 @@
     </div>
     <div class="author-content">
       <div class="nav">教材作者诚信承诺</div>
-      <div class="text">请输入作者诚信承诺文字内容，并上传所有作者签名</div>
+      <div class="text">请填写作者诚信承诺文字内容，并上传所有作者签名</div>
       <nz-form-item class="row" style="margin-bottom: 16px">
         <nz-form-label
           class="label"
@@ -330,16 +321,16 @@
           [nzSm]="16"
           [nzXs]="16"
           nzRequired
-          >输入诚信承诺：本人自愿参加此次申报，已认真填写并检查以上材料，保证内容真实</nz-form-label
+          >填写诚信承诺：本人自愿参加此次申报，已认真填写并检查以上材料，保证内容真实</nz-form-label
         >
         <nz-form-control
           class="val"
-          nzErrorTip="请输入承诺内容"
+          nzErrorTip="请填写承诺内容"
           style="width: 450px"
         >
           <input
             formControlName="links"
-            placeholder="请输入承诺内容"
+            placeholder="请填写承诺内容"
             nz-input
           />
         </nz-form-control>
@@ -356,88 +347,79 @@
       >
       <nz-table
         #basicTable
-        [nzData]="courses"
+        [nzData]="authorSign"
         [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="120px">姓名</th>
+            <th nzWidth="120px">单位</th>
+            <th nzWidth="120px">出生年月</th>
+            <th nzWidth="120px">国籍</th>
+            <th nzWidth="120px" nzRight>
+              <nz-form-label [nzNoColon]="true" nzRequired
+                >作者政治审查表</nz-form-label
+              >
+            </th>
             <th nzWidth="80px" nzRight>操作</th>
           </tr>
         </thead>
         <tbody>
-          @for (data of courses; track $index) {
+          @for (data of authorSign; track $index) {
           <tr>
             <td nzLeft nzAlign="right">{{ $index + 1 }}</td>
             <td>
-              <nz-date-picker
-                nzMode="month"
+              <input
+                nz-input
+                type="number"
+                placeholder="请填写作者姓名"
                 [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>
+                [(ngModel)]="data.name"
+                nzStatus=""
+              />
             </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>
+              <input
+                nz-input
+                type="number"
+                placeholder="请填写作者单位"
+                [ngModelOptions]="{ standalone: true }"
+                [(ngModel)]="data.unit"
+                nzStatus=""
+              />
             </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>
+              <nz-date-picker
+                nzMode="month"
+                [ngModelOptions]="{ standalone: true }"
+                [(ngModel)]="data.birth"
+              ></nz-date-picker>
             </td>
             <td>
               <input
                 nz-input
                 type="number"
-                placeholder="请输入所获奖项"
+                placeholder="请填写作者国籍"
                 [ngModelOptions]="{ standalone: true }"
-                [(ngModel)]="data.accolade"
+                [(ngModel)]="data.nationality"
                 nzStatus=""
               />
             </td>
             <td nzRight>
-              <a class="edit-icon" (click)="onPush($index)"
+              <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>
+            </td>
+            <td nzRight>
+              <a class="edit-icon" (click)="onPush('authorSign', $index)"
                 ><span
                   nz-icon
                   style="font-size: 20px; margin-right: 10px"
@@ -445,7 +427,7 @@
                   nzTheme="outline"
                 ></span
               ></a>
-              <a class="edit-icon" (click)="onDel($index)"
+              <a class="edit-icon" (click)="onDel('authorSign', $index)"
                 ><span
                   nz-icon
                   style="font-size: 20px"
@@ -507,7 +489,13 @@
   >
     保存本页
   </button>
-  <button nz-button nzType="primary" (click)="submitForm('next')">
-    下一页
+  <button
+    nz-button
+    nzType="default"
+    style="margin-right: 20px"
+    (click)="submitForm('pre')"
+  >
+    上一步
   </button>
+  <button nz-button nzType="primary" (click)="submitForm('complete')">完成</button>
 </div>

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

@@ -9,18 +9,19 @@ 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 { NzModalService } from 'ng-zorro-antd/modal';
 import {
   FormControl,
   FormGroup,
   NonNullableFormBuilder,
   Validators,
 } from '@angular/forms';
-interface course {
-  date: Date | any;
-  wordage: number | any;
-  num: number | any;
-  sumNum: number | any;
-  accolade: string;
+interface opinionType {
+  name: string;
+  unit: string;
+  birth: Date | any;
+  nationality: string;
+  reviewFile: string;
 }
 @Component({
   selector: 'app-attachment',
@@ -32,7 +33,7 @@ interface course {
     NzGridModule,
     NzCheckboxModule,
     NzTableModule,
-    NzUploadModule
+    NzUploadModule,
   ],
   standalone: true,
   templateUrl: './attachment.component.html',
@@ -41,12 +42,12 @@ interface course {
 export class AttachmentComponent implements OnInit {
   @Input('editFrom') editFrom: any;
   @Input('maxWidth') maxWidth: number = 0;
-  @Output() next: EventEmitter<any> = new EventEmitter<any>();
+  @Output() state: 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> //教材数字内容链接地址、账号
+    textbookFiles: FormControl<Array<string> | any>; //上传教材文件
+    links: FormControl<string>; //教材数字内容链接地址、账号
   }> = this.fb.group({
     textbookTypes: ['', [Validators.required]],
     textbookFiles: ['', [Validators.required]],
@@ -56,19 +57,30 @@ export class AttachmentComponent implements OnInit {
     { label: '纸质教材', value: '纸质教材' },
     { label: '电子教材 / 资源', value: '电子教材 / 资源' },
   ];
-  //申报教材建设历程
-  courses: Array<course> = [
+  //所有作者政治审查意见
+  opinions: Array<opinionType> = [
     {
-      date: '', //出版时间
-      wordage: '', //字数
-      num: '', //重印次数
-      sumNum: '', //本版总印数
-      accolade: '', //获奖励情况
+      name: '', //作者
+      unit: '', //单位
+      birth: '', //出生年月
+      nationality: '', //国籍
+      reviewFile: '', //作者政治审查表/作者签名
+    },
+  ];
+  //所有作者签名
+  authorSign: Array<opinionType> = [
+    {
+      name: '', //作者
+      unit: '', //单位
+      birth: '', //出生年月
+      nationality: '', //国籍
+      reviewFile: '', //作者政治审查表/作者签名
     },
   ];
   constructor(
     private fb: NonNullableFormBuilder,
-    private msg: NzMessageService
+    private msg: NzMessageService,
+    private modal: NzModalService
   ) {}
   ngOnInit() {}
   submitForm(event?: string): void {
@@ -84,25 +96,58 @@ export class AttachmentComponent implements OnInit {
       });
       this.msg.warning('请填写完整信息');
     }
-    if (event == 'next') {
-      this.next.emit();
+    if (event == 'pre') {
+      this.state.emit('pre');
+    }
+    if (event == 'save') {
+      this.modal.success({
+        nzTitle: '您已填写完成',
+        nzContent: '<p>已保存并且至空间</p>',
+        nzOnOk: () => console.log('Info OK')
+      });
     }
+    if(event == 'complete')
+    this.modal.success({
+      nzTitle: '您已填写完成',
+      nzContent: '<p>已保存并且至空间</p>',
+      nzOnOk: () => console.log('Info OK')
+    });
   }
   changeCode() {}
   getCode(e: any) {}
   //添加作者信息
-  onPush(idx: number) {
-    this.courses.splice(idx + 1, 0, {
-      date: '',
-      wordage: '',
-      num: '',
-      sumNum: '',
-      accolade: '',
-    });
+  onPush(type: string, idx: number) {
+    switch (type) {
+      case 'opinions':
+        this.opinions.splice(idx + 1, 0, {
+          name: '', //作者
+          unit: '', //单位
+          birth: '', //出生年月
+          nationality: '', //国籍
+          reviewFile: '', //作者政治审查表/作者签名
+        });
+        break;
+      case 'authorSign':
+        this.authorSign.splice(idx + 1, 0, {
+          name: '', //作者
+          unit: '', //单位
+          birth: '', //出生年月
+          nationality: '', //国籍
+          reviewFile: '', //作者政治审查表/作者签名
+        });
+        break;
+    }
   }
   //删除作者信息
-  onDel(idx: number) {
-    this.courses.splice(idx, 1);
+  onDel(type: string, idx: number) {
+    switch (type) {
+      case 'opinions':
+        this.opinions.splice(idx, 1);
+        break;
+      case 'authorSign':
+        this.authorSign.splice(idx, 1);
+        break;
+    }
   }
   handleChange(info: NzUploadChangeParam): void {
     if (info.file.status !== 'uploading') {

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

@@ -7,6 +7,8 @@ import { NzRadioModule } from 'ng-zorro-antd/radio';
 import { NzUploadModule } from 'ng-zorro-antd/upload';
 import { NzMessageService } from 'ng-zorro-antd/message';
 import { NzUploadChangeParam } from 'ng-zorro-antd/upload';
+import { NzModalService } from 'ng-zorro-antd/modal';
+
 import {
   FormControl,
   FormGroup,
@@ -28,7 +30,7 @@ import {
 })
 export class BasicInComponent implements OnInit {
   @Input('editFrom') editFrom: any;
-  @Output() next: EventEmitter<any> = new EventEmitter<any>();
+  @Output() state: EventEmitter<any> = new EventEmitter<any>();
   @Output() save: EventEmitter<any> = new EventEmitter<any>();
 
   validateForm: FormGroup<{
@@ -160,6 +162,7 @@ export class BasicInComponent implements OnInit {
   // }
   constructor(
     private fb: NonNullableFormBuilder,
+    private modal: NzModalService,
     private msg: NzMessageService
   ) {}
 
@@ -196,8 +199,17 @@ export class BasicInComponent implements OnInit {
         }
       });
     }
+    if (event == 'pre') {
+      this.state.emit('pre');
+    }
     if (event == 'next') {
-      this.next.emit();
+      this.state.emit('next');
     }
+    if(event == 'save')
+    this.modal.success({
+      nzTitle: '保存成功',
+      nzContent: '<p>已保存并且至空间</p>',
+      nzOnOk: () => console.log('Info OK')
+    });
   }
 }

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

@@ -1,7 +1,7 @@
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { ActivatedRoute, RouterOutlet } from '@angular/router';
-import { CompTableListComponent } from '../../../app/comp-table/comp-table-list/comp-table-list.component';
-import { EduTextbook } from '../../../schemas/EduTextbook';
+import { CompTableListComponent } from '../../../../app/comp-table/comp-table-list/comp-table-list.component';
+import { EduTextbook } from '../../../../schemas/EduTextbook';
 // import { TranslateService } from '@ngx-translate/core';
 import * as Parse from "parse";
 import { CommonModule } from '@angular/common';
@@ -13,7 +13,7 @@ import { CommonModule } from '@angular/common';
   imports: [CommonModule,RouterOutlet,CompTableListComponent],
   standalone: true,
 })
-export class PageTextbookComponent  implements OnInit {
+export class PageTextbookComponent implements OnInit {
   @ViewChild(CompTableListComponent) list:CompTableListComponent|undefined
 
   EduTextbook = EduTextbook

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

@@ -7,6 +7,7 @@ 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 { NzModalService } from 'ng-zorro-antd/modal';
 import {
   FormControl,
   FormGroup,
@@ -39,7 +40,7 @@ interface course {
 export class TextbookContentComponent  implements OnInit {
   @Input('editFrom') editFrom: any;
   @Input('maxWidth') maxWidth: number = 0;
-  @Output() next: EventEmitter<any> = new EventEmitter<any>();
+  @Output() state: EventEmitter<any> = new EventEmitter<any>();
   @Output() save: EventEmitter<any> = new EventEmitter<any>();
   validateForm: FormGroup<{
     innovateExplain: FormControl<string>; //申报教材特色及创新
@@ -60,6 +61,7 @@ export class TextbookContentComponent  implements OnInit {
   ];
   constructor(
     private fb: NonNullableFormBuilder,
+    private modal: NzModalService,
     private msg: NzMessageService
   ) { }
 
@@ -77,9 +79,18 @@ export class TextbookContentComponent  implements OnInit {
       });
       this.msg.warning('请填写完整信息');
     }
+    if (event == 'pre') {
+      this.state.emit('pre');
+    }
     if (event == 'next') {
-      this.next.emit();
+      this.state.emit('next');
     }
+    if(event == 'complete')
+    this.modal.success({
+      nzTitle: '您已填写完成',
+      nzContent: '<p>已保存并且至空间</p>',
+      nzOnOk: () => console.log('Info OK')
+    });
   }
   changeCode() {}
   getCode(e: any) {}

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

@@ -7,6 +7,7 @@ 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 { NzModalService } from 'ng-zorro-antd/modal';
 import {
   FormControl,
   FormGroup,
@@ -47,7 +48,7 @@ interface achievementType {
 export class TextbookPertainComponent implements OnInit {
   @Input('editFrom') editFrom: any;
   @Input('maxWidth') maxWidth: number = 0;
-  @Output() next: EventEmitter<any> = new EventEmitter<any>();
+  @Output() state: EventEmitter<any> = new EventEmitter<any>();
   @Output() save: EventEmitter<any> = new EventEmitter<any>();
   validateForm: FormGroup<{
     code: FormControl<string>; //适用专业代码及名称
@@ -127,6 +128,7 @@ export class TextbookPertainComponent implements OnInit {
   workOptions = ['主编', '作者', '副主编', '写者'];
   constructor(
     private fb: NonNullableFormBuilder,
+    private modal: NzModalService,
     private msg: NzMessageService
   ) {}
 
@@ -144,9 +146,18 @@ export class TextbookPertainComponent implements OnInit {
       });
       this.msg.warning('请填写完整信息');
     }
+    if (event == 'pre') {
+      this.state.emit('pre');
+    }
     if (event == 'next') {
-      this.next.emit();
+      this.state.emit('next');
     }
+    if(event == 'complete')
+    this.modal.success({
+      nzTitle: '您已填写完成',
+      nzContent: '<p>已保存并且至空间</p>',
+      nzOnOk: () => console.log('Info OK')
+    });
   }
   changeCode() {}
   getCode(e: any) {}

projects/textbook/src/modules/nav-author/modules.routes.ts

@@ -1,37 +1,47 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
 import { PageHomeComponent } from './page-home/page-home.component';
-import { PageTextbookComponent } from './page-textbook/page-textbook.component';
+import { PageTextbookComponent } from './components/page-textbook/page-textbook.component';
 import { ApplyComponent } from './apply/apply.component';
-import { ProfileComponent } from '../user/profile/profile.component';
+// import { ProfileComponent } from '../user/profile/profile.component';
+import { SpaceComponent } from './space/space.component'
+import { TextbookDetailsComponent } from './textbook-details/textbook-details.component'
 const routes: Routes = [
   {
     path: '',
-    redirectTo:'manage/apply',
+    redirectTo:'manage/space',
     pathMatch: "full",
   },
   {
     path: 'manage',
     component: PageHomeComponent,
     children: [
+      {
+        path: 'space',//创建教材
+        component: SpaceComponent,
+      },
       {
         path: 'apply',//创建教材
         component: ApplyComponent,
       },
       {
-        path: 'textbook',//列表
-        component: PageTextbookComponent,
+        path: 'dateils',//创建教材
+        component: TextbookDetailsComponent,
       },
+      // {
+      //   path: 'textbook',//列表
+      //   component: PageTextbookComponent,
+      // },
       {
         path: 'recycle',//回收站
         component: PageTextbookComponent,
       },
     ],
   },
-  {
-    path: 'profile',
-    component: ProfileComponent,
-  },
+  // {
+  //   path: 'profile',
+  //   component: ProfileComponent,
+  // },
 ];
 @NgModule({
   imports: [RouterModule.forChild(routes)],

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

@@ -1,7 +1,21 @@
-<app-comp-nav></app-comp-nav>
 <div class="page">
-  <div class="content-left">
-    <ul nz-menu nzMode="inline" style="width: 240px;background: #f9eaea;">
+  <div class="content-left" [style.width]="isCollapsed ? '' : '248px'">
+    <div class="btn-menu">
+      <button mat-icon-button (click)="toggleCollapsed()" aria-label="LogOut">
+        <mat-icon
+          fontIcon="more"
+          [fontIcon]="isCollapsed ? 'menu-unfold' : 'menu-fold'"
+        ></mat-icon>
+      </button>
+      {{ isCollapsed ? "" : "教材遴选系统" }}
+    </div>
+
+    <ul
+      [nzInlineCollapsed]="isCollapsed"
+      nz-menu
+      nzMode="inline"
+      style="width: 100%; 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">
@@ -18,16 +32,17 @@
         </ul>
       </li>
       } @else {
-      <li
-        nz-menu-item
-        (click)="toUrl(item)"
-        [nzSelected]="active == item.id"
-      >
+      <li nz-menu-item (click)="toUrl(item)" [nzSelected]="active == item.id">
         <span nz-icon nzType="home" nzTheme="outline"></span>
         <span>{{ item.name }}</span>
       </li>
       } }
     </ul>
+    <app-comp-nav
+      [viewCollapsed]="isCollapsed"
+      class="left-fonter"
+      [style.width]="isCollapsed ? '248px' : ''"
+    ></app-comp-nav>
   </div>
   <div class="preview">
     <router-outlet></router-outlet>

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

@@ -1,17 +1,36 @@
 .page{
   font-family: PingFang SC;
   display: flex;
-  height: calc(100% - 60px);
+  // height: calc(100% - 60px);
   // overflow-y: scroll;
   overflow-y: hidden;
+  height: 100vh;
+  background-color: #F9EAEA;
+  padding: 10px;
   .content-left{
+    position: relative;
     background-color:#f9eaea;
+    // width: 248px;
+    overflow: hidden;
+    .btn-menu{
+      padding: 10px;
+      display: flex;
+      align-items: center;
+    }
+    .left-fonter{
+      width: 248px;
+      position: absolute;
+      bottom: 0;
+      left: 0;
+    }
   }
   .preview{
     height: 100%;
     overflow-y: scroll;
     padding: 0 0 40px 0;
     flex: 1;
+    background-color: white;
+    border-radius: 10px;
   }
   .proview{
     flex: 1;

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

@@ -2,11 +2,12 @@ import { Component, OnInit } from '@angular/core';
 import { CompNavComponent } from '../../../app/comp-nav/comp-nav.component';
 import { RouterOutlet, Router } from '@angular/router';
 import { CommonCompModule } from '../../../services/common.modules';
+import { MatIconModule } from '@angular/material/icon';
 
 @Component({
   selector: 'app-page-home',
   standalone: true,
-  imports: [CompNavComponent, RouterOutlet, CommonCompModule],
+  imports: [CompNavComponent, RouterOutlet, CommonCompModule,MatIconModule],
   templateUrl: './page-home.component.html',
   styleUrls: ['./page-home.component.scss'],
 })
@@ -26,18 +27,18 @@ export class PageHomeComponent implements OnInit {
     {
       name: '个人空间',
       id: '1',
-      child: [
-        {
-          name: '创建教材',
-          id: '1-1',
-          path: '/nav-author/manage/apply',
-        },
-        {
-          name: '教材列表',
-          id: '1-2',
-          path: '/nav-author/manage/textbook',
-        },
-      ],
+      // child: [
+      //   {
+      //     name: '创建教材',
+      //     id: '1-1',
+      //     path: '/nav-author/manage/apply',
+      //   },
+      //   {
+      //     name: '教材列表',
+      //     id: '1-2',
+      //     path: '/nav-author/manage/textbook',
+      //   },
+      // ],
     },
     {
       name: '回收站',
@@ -47,16 +48,21 @@ export class PageHomeComponent implements OnInit {
         isDeleted: true,
       },
     },
-    {
-      name: '个人信息',
-      id: '3',
-      path: '/nav-author/profile',
-    },
+    // {
+    //   name: '个人信息',
+    //   id: '3',
+    //   path: '/nav-author/profile',
+    // },
   ];
   active: string = localStorage.getItem('active') || this.options[0].id;
+  isCollapsed:boolean = false;
+
   constructor(public router: Router) {}
 
   ngOnInit() {}
+  toggleCollapsed(): void {
+    this.isCollapsed = !this.isCollapsed;
+  }
   toUrl(child: any) {
     let cateid = child.id;
     this.active = cateid;

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

@@ -0,0 +1,32 @@
+<div class="space-page">
+  <div class="space-head">
+    <div class="content">
+      <div class="title">
+        {{ user?.get("name") || "彭秀龙" }}，欢迎使用教材遴选提交系统
+      </div>
+      <div class="text">
+        创建教材、使用教材网信息加快填写速度，下载附件材料、上传教材所需文件，将你创建的教材提交至流程上级评审
+      </div>
+    </div>
+    <div class="btn">
+      <button
+        nz-button
+        nzType="primary"
+        style="background: #3e49b3; border: 1px #3e49b3"
+        (click)="goUrl('/nav-author/manage/apply')"
+      >
+        创建教材
+      </button>
+    </div>
+  </div>
+  <div class="space-content">
+    <nz-tabset>
+      <nz-tab nzTitle="我的教材">
+        <app-page-textbook></app-page-textbook>
+      </nz-tab>
+      <nz-tab nzTitle="已提交评审教材">
+        <app-page-textbook></app-page-textbook>
+      </nz-tab>
+    </nz-tabset>
+  </div>
+</div>

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

@@ -0,0 +1,41 @@
+.space-page {
+  padding: 20px;
+  font-family: PingFang SC;
+  .space-head {
+    display: flex;
+    justify-content: space-between;
+    .content {
+      .title {
+        //styleName: 字体/标题-大-Medium;
+        font-family: PingFang SC;
+        font-size: 24px;
+        font-weight: 500;
+        line-height: 38px;
+        text-align: left;
+      }
+      .text {
+        font-family: PingFang SC;
+        font-size: 14px;
+        font-weight: 400;
+        line-height: 22px;
+        text-align: left;
+        color: #231C1F99;
+      }
+    }
+  }
+  .space-content{
+    margin: 20px 0;
+  }
+}
+::ng-deep .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn{
+  color: #c6233f;
+}
+::ng-deep .ant-tabs-ink-bar{
+  background: #c6233f;
+}
+::ng-deep .ant-tabs-tab:hover{
+  color: #e97488;
+}
+::ng-deep .ant-tabs-tab-btn:active{
+  color: #e97488;
+}

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

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

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

@@ -0,0 +1,29 @@
+import { Component, OnInit } from '@angular/core';
+import { CommonCompModule } from '../../../services/common.modules';
+import { Router } from '@angular/router';
+import * as Parse from 'parse';
+import { NzTabsModule } from 'ng-zorro-antd/tabs';
+import { PageTextbookComponent } from '../components/page-textbook/page-textbook.component';
+@Component({
+  selector: 'app-space',
+  standalone: true,
+  imports: [CommonCompModule, NzTabsModule, PageTextbookComponent],
+  templateUrl: './space.component.html',
+  styleUrls: ['./space.component.scss'],
+})
+export class SpaceComponent implements OnInit {
+  user: Parse.Object = Parse.User.current()!;
+
+  constructor(private router: Router) {}
+
+  ngOnInit() {}
+
+  goUrl(url:string,params?:object|any){
+    console.log(url);
+    if(params){
+      this.router.navigate([url,params])
+    }else{
+      this.router.navigate([url])
+    }
+  }
+}

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

@@ -0,0 +1,271 @@
+<div class="site-page-header">
+  <nz-page-header
+    nzTitle="教材详情 - 通信技术原理"
+    nzSubtitle=""
+    style="padding: 0"
+  >
+    <nz-breadcrumb nz-page-header-breadcrumb>
+      <div class="back" (click)="back()">
+        <span nz-icon nzType="left" nzTheme="outline"></span>返回
+      </div>
+    </nz-breadcrumb>
+  </nz-page-header>
+</div>
+<div class="content">
+  <div nz-row>
+    <div nz-col nzSpan="16" #scroll>
+      <div class="templ1" #templ1>
+        <div class="title">教材基本信息</div>
+        <div class="base-content">
+          <div class="row">
+            <div class="label">申报教材名称</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">第一主编（作者）</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">第一主编（作者）单位</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">申报类型</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">教材应用对象及所属学科专业类</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">教材主要语种类型</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">国际标准书号</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">其他主编姓名</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">其他编者姓名</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">是否为重点立项教材</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">出版单位</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">初版时间</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">载体形式</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">本版出版时间及版次</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">最新印次时间及印次</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">初版以来合计印数</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">初版以来是否曾列为重点项目</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">版权页截图</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">中国版本图书馆 CIP 查询截图</div>
+            <div class="value">通信技术原理</div>
+          </div>
+        </div>
+      </div>
+      <div class="templ" #templ1>
+        <div class="title">教材适用情况</div>
+        <div class="base-content">
+          <div class="row">
+            <div class="label">适用专业代码（六位）及名称</div>
+            <div class="value">000416 / 通信工程</div>
+          </div>
+          <div class="row">
+            <div class="label">适用课程</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">课程学时</div>
+            <div class="value">通信技术原理</div>
+          </div>
+          <div class="row">
+            <div class="label">适用课程性质</div>
+            <div class="value">通信技术原理</div>
+          </div>
+        </div>
+      </div>
+      <div class="templ" #templ1>
+        <div class="title">教材适用情况</div>
+        <div class="text mar10">作者（含主编，不超过 6 人，教材中明确出现姓名）</div>
+        <div class="base-content">
+          <nz-table
+            #basicTable
+            [nzShowPagination]="false"
+            [nzData]="textBook.authorList"
+            [nzScroll]="{ x: (templ1.style.width || '1000') + 'px', y: '240px' }"
+          >
+            <thead>
+              <tr>
+                <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" nzRight>分工</th>
+              </tr>
+            </thead>
+            <tbody>
+              @for (data of textBook.authorList; track data.mobile;let index =
+              $index) {
+              <tr>
+                <td nzLeft>
+                  {{ data.name }}
+                </td>
+                <td>
+                  {{ data.unit }}
+                </td>
+                <td>
+                  {{ data.birth | date : "yyyy-MM" }}
+                </td>
+                <td>
+                  {{ data.nationality }}
+                </td>
+                <td>
+                  {{ data.job }}
+                </td>
+                <td>
+                  {{ data.title }}
+                </td>
+                <td>
+                  {{ data.mobile }}
+                </td>
+                <td>
+                  {{ data.email }}
+                </td>
+                <td nzRight>
+                  {{ data.work }}
+                </td>
+              </tr>
+              }
+            </tbody>
+          </nz-table>
+        </div>
+
+        <div class="text mar10">第一主编（作者）情况</div>
+        <div class="base-content">
+          <div class="text-tips">相关教学经历</div>
+          <div class="note">在接受调查的19为华尔街分析师中，看涨和看平下周金价走势的各有8人，占比42%，看空金价的有三人，占比16%。与此同时，在接受网上调查的369名普通投资者中，有221人（60%）预计下周金价将上涨，有95人（26%）料走软，53人（14%）持中立态度。这些投资者预计金价将在下周末前重新测试1980美元左右的阻力位。</div>
+          <div class="text-tips">相关科学研究项目、成果或论文专著（限5项）</div>
+          <nz-table
+            #basicTable
+            [nzShowPagination]="false"
+            [nzData]="textBook.authorList"
+            [nzScroll]="{ x: (templ1.style.width || '1000') + 'px', y: '240px' }"
+          >
+          <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>
+      </div>
+    </div>
+    <div nz-col nzSpan="8">
+      <nz-anchor
+        [nzAffix]
+        (nzClick)="handleClick($event)"
+        [nzShowInkInFixed]="true"
+      >
+        <nz-link nzHref="#base" nzTitle="教材基本信息"></nz-link>
+        <nz-link
+          nzHref="#components-anchor-demo-static"
+          nzTitle="Static demo"
+        ></nz-link>
+        <nz-link nzHref="#api" nzTitle="API">
+          <nz-link nzHref="#nz-anchor" nzTitle="nz-anchor"></nz-link>
+          <nz-link nzHref="#nz-link" nzTitle="nz-link"></nz-link>
+        </nz-link>
+      </nz-anchor>
+    </div>
+  </div>
+</div>

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

@@ -0,0 +1,86 @@
+.site-page-header {
+  position: sticky;
+  top: 0;
+  z-index: 9;
+  padding: 24px 24px 10px;
+  background-color: white;
+  font-family: PingFang SC;
+  .steps {
+    max-width: 1000px;
+    margin: 10px 0;
+  }
+  .back {
+    font-family: PingFang SC;
+    font-size: 14px;
+    font-weight: 400;
+    line-height: 22px;
+    text-align: left;
+    cursor: pointer;
+  }
+}
+.content {
+  font-family: PingFang SC;
+  padding: 10px 24px;
+  .title {
+    font-family: PingFang SC;
+    font-size: 20px;
+    font-weight: 500;
+    line-height: 28px;
+    text-align: left;
+    margin-bottom: 20px;
+  }
+  .templ {
+    margin-top: 40px;
+    .text {
+      font-family: PingFang SC;
+      font-size: 16px;
+      font-weight: 500;
+      line-height: 22px;
+      text-align: left;
+    }
+  }
+  .base-content {
+    .row {
+      display: flex;
+      margin-bottom: 14px;
+      .label {
+        width: 200px;
+        font-family: PingFang SC;
+        font-size: 14px;
+        font-weight: 400;
+        line-height: 20px;
+        text-align: left;
+        color: #231c1f99;
+      }
+      .value {
+        margin-left: 20px;
+        flex: 1;
+        font-family: PingFang SC;
+        font-size: 14px;
+        font-weight: 400;
+        line-height: 20px;
+        text-align: left;
+      }
+    }
+    .text-tips {
+      font-family: PingFang SC;
+      font-size: 14px;
+      font-weight: 400;
+      line-height: 20px;
+      text-align: left;
+      color: #231c1f99;
+      margin: 10px 0;
+    }
+    .note{
+      font-family: PingFang SC;
+      font-size: 14px;
+      font-weight: 400;
+      line-height: 20px;
+      text-align: left;
+      color: #231C1F;
+    }
+  }
+}
+.mar10{
+  margin: 20px 0;
+}

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

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

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

@@ -0,0 +1,72 @@
+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 { 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 { NzAnchorModule } from 'ng-zorro-antd/anchor';
+import { DatePipe } from '@angular/common';
+interface author {
+  name: string;
+  unit: string;
+  birth: Date | any;
+  nationality: string;
+  job: string;
+  title: string;
+  mobile: string;
+  email: string;
+  work: string;
+}
+@Component({
+  selector: 'app-textbook-details',
+  imports: [
+    CommonCompModule,
+    ReactiveFormsModule,
+    BasicInComponent,
+    TextbookPertainComponent,
+    TextbookContentComponent,
+    AttachmentComponent,
+    NzAnchorModule,
+    DatePipe,
+  ],
+  standalone: true,
+  templateUrl: './textbook-details.component.html',
+  styleUrls: ['./textbook-details.component.scss'],
+  providers: [DatePipe],
+})
+export class TextbookDetailsComponent implements OnInit {
+  textBook: object | any = {
+    authorList: [
+      {
+        name: '曹春海',
+        unit: '外语教育出版社',
+        birth: new Date('2000-1-1'),
+        nationality: '中国',
+        job: '博士生导师',
+        title: '教授',
+        mobile: '1881881888',
+        email: '123@123.com',
+        work: '主编',
+      },
+    ],
+    achievementOptions: [//相关科学研究项目、成果或论文专著（限5项）
+      {
+        name: '双语教育对人脑杏仁核发育影响研究',
+        unit: '二十一世纪出版社',
+        date: new Date('2000-1-1'),
+      },
+    ],
+  };
+  constructor() {}
+
+  ngOnInit() {}
+
+  handleClick(e: string): void {
+    console.log(e);
+  }
+  back() {
+    history.back();
+  }
+}

projects/textbook/src/services/common.modules.ts

@@ -12,6 +12,7 @@ import { NzStepsModule } from 'ng-zorro-antd/steps';
 import { NzButtonModule } from 'ng-zorro-antd/button';
 import { NzInputModule } from 'ng-zorro-antd/input';
 import { NzDatePickerModule } from 'ng-zorro-antd/date-picker';
+import { NzModalModule } from 'ng-zorro-antd/modal';
 @NgModule({
   exports: [
     FormsModule,
@@ -26,7 +27,8 @@ import { NzDatePickerModule } from 'ng-zorro-antd/date-picker';
     NzStepsModule,
     NzButtonModule,
     NzInputModule,
-    NzDatePickerModule
+    NzDatePickerModule,
+    NzModalModule
   ]
 })
 export class CommonCompModule { }