diff --git a/src/app/ui/find-problem/find-problem.component.html b/src/app/ui/find-problem/find-problem.component.html index e037239..df18e1d 100644 --- a/src/app/ui/find-problem/find-problem.component.html +++ b/src/app/ui/find-problem/find-problem.component.html @@ -4,28 +4,33 @@ * @Author: sueRimn * @Date: 2020-11-06 14:39:10 * @LastEditors: sueRimn - * @LastEditTime: 2020-11-06 19:37:02 + * @LastEditTime: 2020-11-07 19:32:56 -->
+
-
+
{{item.name}} - - - +
+
+ +
+
+
-
- -
--> - - + + +
diff --git a/src/app/ui/find-problem/find-problem.component.scss b/src/app/ui/find-problem/find-problem.component.scss index 3752579..b78bd87 100644 --- a/src/app/ui/find-problem/find-problem.component.scss +++ b/src/app/ui/find-problem/find-problem.component.scss @@ -23,25 +23,28 @@ height: 100%; display: flex; flex-direction:column; + overflow: auto; span{ font-size: 0.146484rem; margin-left: 0.488281rem; position: relative; - top: -0.488281rem; + top: 0.488281rem; } textarea{ position: relative; - left: 3%; - //bottom: 20px; + left: 15%; + bottom: 0.976563rem; } .one{ width: 100%; + height: 140px; input{ + z-index: 999; width: 1.953125rem; height: 0.976563rem; - position: absolute; - left: 1.171875rem; - //top: 1.171875rem; + position: relative; + left: 0.976563rem; + bottom: 180px; opacity: 0; margin-top: 0.048828rem; cursor: pointer; @@ -54,8 +57,8 @@ } button{ position: relative; - bottom: 50px; - left: 3%; + bottom: 150px; + left: 15%; background-color: #FFFFFF; /* Green */ border: 1px solid #000000; border-radius: 8px; @@ -107,4 +110,4 @@ // opacity:0; } -} \ No newline at end of file +} diff --git a/src/app/ui/find-problem/find-problem.component.ts b/src/app/ui/find-problem/find-problem.component.ts index 5e5b8fe..4a38309 100644 --- a/src/app/ui/find-problem/find-problem.component.ts +++ b/src/app/ui/find-problem/find-problem.component.ts @@ -4,9 +4,13 @@ * @Author: sueRimn * @Date: 2020-11-06 14:39:10 * @LastEditors: sueRimn - * @LastEditTime: 2020-11-06 19:09:32 + * @LastEditTime: 2020-11-07 19:41:29 */ import { Component, OnInit } from '@angular/core'; +import { HttpClient,HttpHeaders, HttpEventType } from '@angular/common/http'; +import { MatSnackBar ,MatSnackBarConfig} from '@angular/material/snack-bar'; +import { FileUploader, FileItem } from 'ng2-file-upload' +import Swiper from 'swiper'; @Component({ selector: 'app-find-problem', @@ -15,11 +19,54 @@ import { Component, OnInit } from '@angular/core'; }) export class FindProblemComponent implements OnInit { - constructor() { } + constructor(public snackBar: MatSnackBar,private http: HttpClient) { } + testSwiper: Swiper; ngOnInit(): void { + setTimeout(() => { + this.testSwiper = new Swiper('.swiper-container', { + direction: 'horizontal', + loop: true, + observer:true,//修改swiper自己或子元素时，自动初始化swiper + observeParents:true,//修改swiper的父元素时，自动初始化swiper + //lazy: true, + // 如果需要前进后退按钮 + navigation: { + nextEl: '.swiper-button-next', + prevEl: '.swiper-button-prev', + } + }); + +}, 0); + + } + ngAfterViewInit() { + console.log("d") + setTimeout(() => { + this.testSwiper = new Swiper('.swiper-container', { + direction: 'horizontal', + loop: true, + observer:true,//修改swiper自己或子元素时，自动初始化swiper + observeParents:true,//修改swiper的父元素时，自动初始化swiper + //lazy: true, + // 如果需要前进后退按钮 + navigation: { + nextEl: '.swiper-button-next', + prevEl: '.swiper-button-prev', + } + }); + +}, 0); + } + ceshiimg=["../../../assets/images/upload.jpg","../../../assets/images/upload2.jpg"] + inputShow=true//控制input显隐 + chooseid//key值 + textareazhi="" //备注框初始化 imgsrc = "../../../assets/images/upload.jpg" //没有上传图片时显示的图片，当上传后就会被替换，即保存时需要传的图片地址参数 + imgUrl = ""//返回来的图片地址后缀 + file: any; //上传的文件 + isspinner:boolean=false //控制进度圈的显示隐藏 //问题对象 knowRoute=[{name:`问题1`,idnum:""}] num=1 @@ -27,7 +74,81 @@ export class FindProblemComponent implements OnInit { addPermission(){ this.num++; var nums=this.num.toString() - this.knowRoute.push({name:"问题"+nums,idnum:""}) + //this.knowRoute.push({name:"问题"+nums,idnum:""}) + this.uploadSucced.push({name:"问题"+nums,src:[],text:""}) + console.log(this.uploadSucced) + } + //删除一行 + deletePermission(key){ + this.uploadSucced.splice(key,1) + console.log(this.uploadSucced) + } + uploadSucced:any = JSON.parse(localStorage.getItem(sessionStorage.getItem("companyId")+"findproblem")) || [{name:"问题1",src:[],text:""}]//上传成功暂存对象 + //保存点击事件 + savaClick(){ + // this.uploadSucced[this.chooseid].text=this.textareazhi + localStorage.setItem(sessionStorage.getItem("companyId")+"findproblem",JSON.stringify(this.uploadSucced)) + alert("保存成功") + console.log(JSON.parse(localStorage.getItem(sessionStorage.getItem("companyId")+"xxx")) ) + //this.snackBar.open('上传成功','确定',config); + } + //change选择文件 + filechange(e,key) { + this.chooseid=key + this.file = e.target.files[0] || null //上传的文件 + var reader = new FileReader(); + reader.readAsDataURL(this.file); + var image:any = new Image(); + reader.onload = function(){ + image.src = reader.result + } + setTimeout(() => { + if(image.width>=4096 || image.height>=5000 ){ + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('请选择分辨率小于4096*5000的图片','确定',config); + }else{ + if(this.file){ + this.startUploading(key) + } + } + + }, 500); } + //上传文件 + startUploading(key) { + this.isspinner = true + let file = this.file || null //获取上传的文件 + let fileSize = file.size || null //上传文件的总大小 + let shardSize = 5 * 1024 * 1024 //5MB一个分片 + + if (file && fileSize <= shardSize) { //上传文件<=5MB时 + // this.upload() + let formData = new FormData() + formData.append("file",file) + this.http.post(`/api/Objects/PlanPlatform/${sessionStorage.getItem('companyId')}`,formData).subscribe((data:any)=>{ + this.isspinner = false + this.imgUrl = data.objectName + this.imgsrc = `/api/Objects/PlanPlatform/${this.imgUrl}?x-oss-process=image/resize,m_fill,h_170,w_299` + console.log(this.imgsrc) + console.log(this.uploadSucced) + this.uploadSucced[key].src.push(this.imgsrc) + //this.inputShow=false + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('上传成功','确定',config); + }) + } else if (file && fileSize >= shardSize) { //上传文件>5MB时,分块上传 + + /* let data = { filename: file.name } + this.http.post(`/api/NewMultipartUpload/PlanPlatform/${this.unitinfo.id}`, {}, { params: data }).subscribe((data: any) => { //初始化分段上传 + this.objectName = data.objectName + this.uploadId = data.uploadId + this.subsectionUploading() + }) */ + } + } } diff --git a/src/app/ui/know-route/know-route.component.scss b/src/app/ui/know-route/know-route.component.scss index d3376af..2324b7a 100644 --- a/src/app/ui/know-route/know-route.component.scss +++ b/src/app/ui/know-route/know-route.component.scss @@ -58,12 +58,12 @@ //底部div .bottomAll{ width: 100%; - height: 100%; + height: 30%; //margin-top: 0.976563rem; display: flex; .upload{ width: 50%; - height: 50%; + height: 100%; .uploadingimg{ width: 40%; height: 30%; diff --git a/src/app/ui/know-route/know-route.component.ts b/src/app/ui/know-route/know-route.component.ts index c23ee8a..d778753 100644 --- a/src/app/ui/know-route/know-route.component.ts +++ b/src/app/ui/know-route/know-route.component.ts @@ -4,7 +4,7 @@ * @Author: sueRimn * @Date: 2020-11-05 15:27:58 * @LastEditors: sueRimn - * @LastEditTime: 2020-11-07 13:08:13 + * @LastEditTime: 2020-11-07 20:00:19 */ import { Component, OnInit } from '@angular/core'; import { HttpClient,HttpHeaders, HttpEventType } from '@angular/common/http'; @@ -87,6 +87,7 @@ export class KnowRouteComponent implements OnInit { //localStorage.setItem(this.clickName,this.imgsrc) //this.uploadSucced.push({name:this.clickName,src:this.imgsrc,smark}) this.uploadSucced[this.chooseid].src=this.imgsrc + this.inputShow=false //this.uploadSucced[this.chooseid].smark=this.textareazhi console.log(this.uploadSucced) const config = new MatSnackBarConfig(); @@ -172,8 +173,8 @@ export class KnowRouteComponent implements OnInit { this.uploadSucced[key].smark = this.textareazhi this.chooseid=key this.clickName=item.name+key+sessionStorage.getItem("companyId") - console.log(this.uploadSucced) - if( JSON.parse(localStorage.getItem(sessionStorage.getItem("companyId")+"xxx")) && JSON.parse(localStorage.getItem(sessionStorage.getItem("companyId")+"xxx"))[key].src!=""){ + //console.log("sss"+JSON.parse(localStorage.getItem(sessionStorage.getItem("companyId")+"xxx"))[key].src) + if( JSON.parse(localStorage.getItem(sessionStorage.getItem("companyId")+"xxx")) && JSON.parse(localStorage.getItem(sessionStorage.getItem("companyId")+"xxx"))[key].src!=""&&JSON.parse(localStorage.getItem(sessionStorage.getItem("companyId")+"xxx"))[key].src!=undefined){ this.imgsrc=JSON.parse(localStorage.getItem(sessionStorage.getItem("companyId")+"xxx"))[key].src this.textareazhi=JSON.parse(localStorage.getItem(sessionStorage.getItem("companyId")+"xxx"))[key].smark this.inputShow=false