Browse Source

app-自测练习

xiaoqiao 8 months ago
parent
commit
9db169c900

+ 80 - 2
parth5/parth5/src/app/views/pages/examtest/examtest.component.html

@@ -1,4 +1,4 @@
-<ion-header class="header-theme2">
+<ion-header class="header-theme2" id="main-content">
   <ion-toolbar>
     <ion-label class="title-center">自测练习</ion-label>
     <ion-buttons slot="start">
@@ -7,5 +7,83 @@
   </ion-toolbar>
 </ion-header>
 <ion-content>
-  对对对对
+  <form #dataForm="ngForm" class="form-table">
+    <ion-list>
+      <ion-item mode="md">
+        <ion-label>选择题库
+          <span class="danger">*</span>
+        </ion-label>
+        <div style="float:left;display:flex;align-items: center" (click)="selectFileType()">
+          <span>选择</span>
+          <ion-icon name="grid-outline"></ion-icon>
+        </div>
+      </ion-item>
+      <span *ngFor="let qt of selectLibaryList;" style="text-wrap: nowrap;">
+                <ion-col size="2">  {{ qt.name }}</ion-col>
+      </span>
+      <ion-item mode="md">
+        <ion-label>选择题型
+          <span class="danger">*</span>
+        </ion-label>
+      </ion-item>
+      <span *ngFor="let qt of questionTypeList;" style="text-wrap: nowrap;">
+            <ion-col size="1">
+              <ion-checkbox color="danger" labelPlacement="end"
+                            (click)="qt.checked=!qt.checked"></ion-checkbox></ion-col>
+            <ion-col size="2">  {{ qt.name }}</ion-col>
+      </span>
+      <ion-item mode="md">
+        <ion-label>题目数量
+          <span class="danger">*</span>
+        </ion-label>
+        <ion-input type="number" placeholder="00" required></ion-input>
+      </ion-item>
+      <div style="display:flex;align-items: center;margin-top: 10px">
+        <ion-icon name="alert-outline" size="small"></ion-icon>
+        <ion-note>如选择了多种题型,系统会按设置数量随机分配</ion-note>
+      </div>
+    </ion-list>
+    <ion-toolbar class="toolbar-center">
+      <ion-button expand="block" color="danger" mode="ios" (click)="entryTest()"
+                  [disabled]="!dataForm.form.valid">
+        开始练习
+      </ion-button>
+    </ion-toolbar>
+  </form>
 </ion-content>
+<ion-menu menuId="typeRoot" side="end" type="overlay" class="menu-body" contentId="main-content">
+  <ion-header class="menu-header">
+    <ion-icon name="close-circle-outline" class="btn-close" (click)="CloseMenu()"></ion-icon>
+    <ion-toolbar>
+      <ion-buttons slot="start">
+        <ion-button [hidden]="fileTypeData.selectedNode==null" (click)="BackMenu()">
+          <ion-icon class="back-img" name="arrow-back-outline"></ion-icon>
+        </ion-button>
+      </ion-buttons>
+      <ion-label [class]="{'filetype-selected':selectedTitle()}" class="header-title">{{ fileTypeData.pSelectedName }}
+      </ion-label>
+    </ion-toolbar>
+  </ion-header>
+  <ion-content class="menu-content">
+    <ion-list>
+      <ion-item *ngFor="let it of typeList">
+        <ion-label (click)="ShowKidsFileType(it)" [class]="{'filetype-selected':selectedItem(it)}">{{ it.name }}
+        </ion-label>
+        <ion-checkbox *ngIf="!it.checked" color="danger" labelPlacement="end" (click)="checkedChange(it,true)"></ion-checkbox>
+        <ion-icon *ngIf="it.checked" (click)="checkedChange(it,false)" name="checkmark-outline" color="primary"></ion-icon>
+        <ion-icon (click)="ShowKidsFileType(it)" [hidden]="it.childList==0" name="chevron-forward-outline"
+                  slot="end"></ion-icon>
+      </ion-item>
+      <div style="margin-left: 10px;">
+      <ion-label >已选题库: </ion-label>
+      <span *ngFor="let qt of bakLibaryList;" style="text-wrap: nowrap;">
+                <ion-col size="2">  {{ qt.name }}</ion-col>
+          </span>
+      </div>
+    </ion-list>
+  </ion-content>
+  <ion-toolbar id="menu-bar" class="toolbar-center">
+    <ion-button color="light" (click)="CloseMenu()" mode="ios">关闭</ion-button>
+    <ion-button color="danger" (click)="chooseFileType()" mode="ios">选择</ion-button>
+  </ion-toolbar>
+</ion-menu>

+ 45 - 0
parth5/parth5/src/app/views/pages/examtest/examtest.component.scss

@@ -0,0 +1,45 @@
+
+.menu-content {
+  .up-title {
+    color: #DE4F3F;
+  }
+
+}
+
+.menu-body {
+  --background: transparent;
+
+  .menu-header {
+    border-top-left-radius: 8px;
+    background: white;
+    --background: #fff;
+
+    ion-toolbar {
+      --background: #fff;
+      border-top-left-radius: 8px;
+    }
+    .back-img {
+      color: #380F0A;
+    }
+    .header-title {
+      padding: 20px 15px 10px 15px;
+      font-size: 15px;
+      color: #380F0A;
+      font-weight: bold;
+    }
+
+    .btn-close {
+      font-size: 22px;
+      padding: 10px 0 0 10px;
+      color: #5E4545;
+      cursor: pointer;
+    }
+  }
+
+  .toolbar-center {
+    border-bottom-left-radius: 8px;
+  }
+}
+
+
+

+ 0 - 24
parth5/parth5/src/app/views/pages/examtest/examtest.component.spec.ts

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

+ 132 - 3
parth5/parth5/src/app/views/pages/examtest/examtest.component.ts

@@ -1,4 +1,7 @@
-import { Component, OnInit } from '@angular/core';
+import {Component, OnInit} from '@angular/core';
+import {ActivatedRoute, Router} from "@angular/router";
+import {ConfigService, RequsetData} from "../../../service/config.service";
+import {AlertController, MenuController, ModalController} from "@ionic/angular";
 
 @Component({
   selector: 'app-examtest',
@@ -7,8 +10,134 @@ import { Component, OnInit } from '@angular/core';
 })
 export class ExamtestComponent implements OnInit {
 
-  constructor() { }
+  getDataUrl = '/api/exammanage/questiontypeSetting/getList';
+  getLibaryUrl = '/api/exampaper/getLibaryTree';
+  questionTypeList: any = [];
+  fileTypeData: any = {
+    title: '所有题库',
+    pSelectedName: '所有题库',
+    rootKids: [],
+    selectedNode: null,
+    selectedParent: null,
+    fileTypeName: ''
+  };
+  libaryTree = [];
+  typeList: any[] = [];
+  selectLibaryList = [];
+  bakLibaryList=[];
 
-  ngOnInit() {}
+  constructor(private menu: MenuController, private router: Router, private configService: ConfigService, private routeInfo: ActivatedRoute) {
+  }
 
+  ngOnInit() {
+    this.routeInfo.queryParams.subscribe(params => {
+      this.getQuestionTypeList();
+      this.getLibaryTree();
+    });
+  }
+
+  getQuestionTypeList() {
+    this.configService.HttpGetRomote(this.getDataUrl, {}).subscribe((data: RequsetData) => {
+      if (data.success) {
+        this.questionTypeList = data.item;
+      }
+    });
+  }
+
+  getLibaryTree() {
+    this.configService.HttpGetRomote(this.getLibaryUrl, {}).subscribe((data: RequsetData) => {
+      if (data.success) {
+        this.libaryTree = data.item;
+        this.typeList = data.item;
+      }
+    });
+  }
+
+  selectFileType() {
+    this.menu.enable(true, 'typeRoot').then(a => {
+    });
+    this.menu.open('typeRoot').then(a => {
+    });
+  }
+
+  BackMenu() {
+    if (this.fileTypeData.selectedNode.parentList != null) {
+      this.typeList = this.fileTypeData.selectedNode.parentList;
+      this.fileTypeData.selectedNode = this.fileTypeData.selectedNode.parentNode;
+    }
+    if (this.fileTypeData.selectedNode == null) {
+      this.fileTypeData.pSelectedName = '所有题库';
+    }
+  }
+
+  selectedTitle() {
+    let result = false;
+
+    if (this.fileTypeData.selectedNode == null) {
+      result = true;
+    } else {
+      if (this.fileTypeData.selectedParent != null) {
+        result = this.fileTypeData.selectedNode.filetypeid == this.fileTypeData.selectedParent.filetypeid;
+      }
+    }
+
+    return result;
+  }
+
+  SelectTitleFileType() {
+    this.fileTypeData.selectedNode = this.fileTypeData.selectedParent;
+  }
+
+  selectedItem(it: any) {
+    let result = false;
+    if (this.fileTypeData.selectedNode != null) {
+      result = this.fileTypeData.selectedNode.id == it.id;
+    }
+    return result;
+  }
+
+  ShowKidsFileType(it: any) {
+    if (it.childList == 0) {
+      return true;
+    }
+    it.parentNode = this.fileTypeData.selectedNode;
+    this.fileTypeData.selectedNode = it;
+
+    this.fileTypeData.pSelectedName = it.name;
+    it.parentList = this.typeList;
+    this.typeList = it.childList;
+  }
+
+  chooseFileType() {
+    this.selectLibaryList = this.bakLibaryList;//Object.assign({}, this.bakLibaryList);
+    this.CloseMenu();
+  }
+
+  CloseMenu() {
+    this.menu.close('typeRoot').then(a => {
+    });
+  }
+
+  checkedChange(it, checked) {
+    it.checked = checked;
+    this.bakLibaryList = this.bakLibaryList.filter(x => x.id != it.id);
+    if (checked) {
+      this.bakLibaryList.push({id: it.id, name: it.name});
+    }
+  }
+
+  eachLibaryTree(treeList: any[]) {
+    treeList.forEach((item: any) => {
+      if (item.checked) {
+        this.selectLibaryList.push({id: item.id, name: item.name});
+      }
+      if (item.childList.length > 0) {
+        this.eachLibaryTree(item.childList);
+      }
+    })
+  }
+
+  entryTest() {
+
+  }
 }