myresume.component.ts 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135
  1. import {Component, HostListener, OnInit} from '@angular/core';
  2. import {BreakpointObserver, Breakpoints} from '@angular/cdk/layout';
  3. import {NzUploadChangeParam, NzUploadFile} from "ng-zorro-antd/upload";
  4. import {Observable, Observer} from "rxjs";
  5. import {NzMessageService} from "ng-zorro-antd/message";
  6. import {HttpClient} from '@angular/common/http';
  7. @Component({
  8. selector: 'app-myresume',
  9. templateUrl: './myresume.component.html',
  10. styleUrls: ['./myresume.component.scss']
  11. })
  12. export class MyresumeComponent {
  13. constructor(private http: HttpClient, private msg: NzMessageService) {
  14. window.addEventListener('resize', this.onWindowResize.bind(this));
  15. }
  16. siderWidth: number = 300
  17. onWindowResize(): void {
  18. if (window.innerWidth < 1000) {
  19. this.siderWidth = 600; // 当屏幕宽度小于1000px时修改数值为5
  20. } else {
  21. this.siderWidth = 1000; // 当屏幕宽度大于等于1000px时修改数值为10
  22. }
  23. }
  24. //单选多选删除逻辑
  25. selectAllChecked = false;
  26. get selectAllIndeterminate(): boolean {
  27. const checkedCount = this.images.filter(image => image.checked).length;
  28. return checkedCount > 0 && checkedCount < this.images.length;
  29. }
  30. get showDeleteButton(): boolean {
  31. return this.selectAllChecked || this.selectAllIndeterminate;
  32. }
  33. toggleAllChecked() {
  34. this.images.forEach(image => {
  35. image.checked = this.selectAllChecked;
  36. });
  37. }
  38. updateSingleChecked() {
  39. this.selectAllChecked = this.selectAllIndeterminate || (this.images.length > 0 && this.images.every(image => image.checked));
  40. }
  41. interviewDelete: boolean = false
  42. //删除按钮逻辑
  43. deleteInterview() {
  44. this.interviewDelete = true
  45. }
  46. images: any[] = [
  47. {
  48. id: '1',
  49. url: 'assets/images/page-mine/myAvatar.png',
  50. title: 'Image 1',
  51. checked: false
  52. }, {
  53. id: '1',
  54. url: 'assets/images/page-mine/myAvatar.png',
  55. title: 'Image 1',
  56. checked: false
  57. }, {
  58. id: '1',
  59. url: 'assets/images/page-mine/myAvatar.png',
  60. title: 'Image 1',
  61. checked: false
  62. },
  63. // 更多图片...
  64. ];
  65. navigateToImageDetails(image: any) {
  66. // 处理点击图片跳转到其他页面的逻辑
  67. }
  68. //上传按钮
  69. isVisible = false;
  70. showModal(): void {
  71. this.isVisible = true;
  72. }
  73. handleOk(): void {
  74. this.isVisible = false;
  75. }
  76. handleCancel(): void {
  77. console.log('Button cancel clicked!');
  78. this.isVisible = false;
  79. }
  80. handleChange({file, fileList}: NzUploadChangeParam): void {
  81. const status = file.status;
  82. if (status !== 'uploading') {
  83. console.log(file, fileList);
  84. }
  85. if (status === 'done') {
  86. this.msg.success(`${file.name} file uploaded successfully.`);
  87. // 在这里处理上传成功后的逻辑
  88. // 创建一个FormData对象,用于发送POST请求
  89. const formData = new FormData();
  90. if (file.originFileObj) {
  91. formData.append('file', file.originFileObj);
  92. }
  93. // 发送POST请求上传文件
  94. this.http.post<any>('http://localhost:3000/upload', formData).subscribe(
  95. response => {
  96. // 在这里处理服务器返回的数据
  97. console.log(response);
  98. },
  99. error => {
  100. console.error(error);
  101. }
  102. );
  103. } else if (status === 'error') {
  104. this.msg.error(`${file.name} file upload failed.`);
  105. }
  106. }
  107. //把pdf数据读取出来
  108. //左侧底部菜单
  109. }