From 74f213c4815a63da4fe1eb866ac834d1cbdd4d09 Mon Sep 17 00:00:00 2001 From: hjm <63528605@qq.com> Date: Thu, 4 Jul 2019 15:17:14 +0800 Subject: [PATCH 1/4] cropper --- public/react/src/common/components/Cropper.js | 13 ++++++++---- public/react/src/modules/tpm/TPMIndexHOC.js | 11 ++++++---- public/react/src/modules/user/AccountPage.js | 4 ++-- .../src/modules/user/account/AccountImg.js | 10 +++++---- .../src/modules/user/account/AccountNav.js | 2 +- .../user/account/ChangeHeaderPicModal.js | 21 ++++++++++++++----- 6 files changed, 41 insertions(+), 20 deletions(-) diff --git a/public/react/src/common/components/Cropper.js b/public/react/src/common/components/Cropper.js index 2fe71ea2b..f11248751 100644 --- a/public/react/src/common/components/Cropper.js +++ b/public/react/src/common/components/Cropper.js @@ -110,13 +110,15 @@ class Cropper extends Component { render() { const { width, height, previewId, imageSrc } = this.props; + return (
{/* This rule is very important, please do not ignore this! */}
- {/* http://localhost:3007/images/footNavLogo.png 图片转了后不对 */} - + {/* http://localhost:3007/images/footNavLogo.png 图片转了后不对 + || "/images/testPicture.jpg" + || "/images/shixun0.jpg" + */} +
{/* background: 'aquamarine', 'border-radius': '128px' diff --git a/public/react/src/modules/tpm/TPMIndexHOC.js b/public/react/src/modules/tpm/TPMIndexHOC.js index f03d59751..cc89f3003 100644 --- a/public/react/src/modules/tpm/TPMIndexHOC.js +++ b/public/react/src/modules/tpm/TPMIndexHOC.js @@ -75,9 +75,11 @@ export function TPMIndexHOC(WrappedComponent) { // header里面需要有user initCommonState(user) { + // 更新头像后，需要改变参数，不然会被图片缓存影响到 + const newUser = Object.assign({}, {...user}, { image_url: `${user.image_url}?t=${new Date().getTime()}`}); this.setState({ - user, - current_user: user + user: newUser, + current_user: newUser }) } showShixun = () => { @@ -230,7 +232,7 @@ export function TPMIndexHOC(WrappedComponent) { /** 课堂权限相关方法，暂时写这里了 ----------------------------------------END */ - fetchUser() { + fetchUser = () => { let url = `/users/get_user_info.json` let courseId; let query = this.props.location.pathname; @@ -289,7 +291,8 @@ export function TPMIndexHOC(WrappedComponent) { isStudent: this.isStudent, isAdminOrStudent: this.isAdminOrStudent, isNotMember: this.isNotMember, - isUserid:this.state.coursedata&&this.state.coursedata.userid + isUserid:this.state.coursedata&&this.state.coursedata.userid, + fetchUser: this.fetchUser } return (
diff --git a/public/react/src/modules/user/AccountPage.js b/public/react/src/modules/user/AccountPage.js index 430f086a1..065724faf 100644 --- a/public/react/src/modules/user/AccountPage.js +++ b/public/react/src/modules/user/AccountPage.js @@ -51,11 +51,11 @@ class AccountPage extends Component { } getBasicInfo=(login)=>{ - let url=`/users/accounts/${login}.json`; + let url=`/users/accounts/${login || this.props.current_user.login}.json`; axios.get(url).then((result)=>{ if(result.data){ this.setState({ - basicInfo:result.data + basicInfo: Object.assign({}, {...result.data}, { avatar_url: `${result.data.avatar_url}?t=${new Date().getTime()}`}) }) if(result.data && result.data.base_info_completed == false){ this.props.history.push(`/account/basic/edit`); diff --git a/public/react/src/modules/user/account/AccountImg.js b/public/react/src/modules/user/account/AccountImg.js index a802367f2..b8e060750 100644 --- a/public/react/src/modules/user/account/AccountImg.js +++ b/public/react/src/modules/user/account/AccountImg.js @@ -2,14 +2,16 @@ import React, { Component } from 'react'; import { SnackbarHOC, getImageUrl } from 'educoder'; import ChangeHeaderPicModal from './ChangeHeaderPicModal' -class AccountNav extends Component { +class AccountImg extends Component { editImg = () => { this.refs['picModal'].setVisible(true) } render() { + const picUrl = getImageUrl("images/"+this.props.src) return (
- + - 头像 + 头像

修改头像

); } } -export default AccountNav; +export default AccountImg; diff --git a/public/react/src/modules/user/account/AccountNav.js b/public/react/src/modules/user/account/AccountNav.js index ea84b735e..6f07bd075 100644 --- a/public/react/src/modules/user/account/AccountNav.js +++ b/public/react/src/modules/user/account/AccountNav.js @@ -22,7 +22,7 @@ class AccountNav extends Component { return (
- + {basicInfo && basicInfo.name} {basicInfo && basicInfo.technical_title}
diff --git a/public/react/src/modules/user/account/ChangeHeaderPicModal.js b/public/react/src/modules/user/account/ChangeHeaderPicModal.js index 1691c2a22..89f21838e 100644 --- a/public/react/src/modules/user/account/ChangeHeaderPicModal.js +++ b/public/react/src/modules/user/account/ChangeHeaderPicModal.js @@ -28,6 +28,10 @@ class ChangeHeaderPicModal extends Component{ file = files[0]; if (/^image\/\w+/.test(file.type)) { + if (file.size > 2 * 1024 * 1024) { + this.props.showNotification && this.props.showNotification("仅支持文件大小小于2M的文件") + return; + } uploadedImageType = file.type; uploadedImageName = file.name; @@ -41,7 +45,6 @@ class ChangeHeaderPicModal extends Component{ // cropper = new Cropper(image, options); inputImage.value = null; } else { - this.props.showNotification && this.props.showNotification("请选择一个图片格式的文件") // window.alert('Please choose an image file.'); } @@ -72,14 +75,16 @@ class ChangeHeaderPicModal extends Component{ var dataUrl = canvas.toDataURL("image/jpeg"); console.log(dataUrl) - const url = `/users/accounts/${this.props.userLogin || 'kosasa'}/avatar.json` + const url = `/users/accounts/${this.props.userLogin}/avatar.json` axios.put(url, { image: dataUrl }) .then((response) => { // {"status":0,"message":"success","avatar_url":"avatars/User/15739"} if (response.data.status == 0) { - + // this.props.getBasicInfo() + this.props.fetchUser() + // 头像更新后会触发AccountPage的DidUpdate，然后会调用getBasicInfo this.props.showNotification && this.props.showNotification("修改头像成功") this.setVisible(false) } @@ -111,6 +116,7 @@ class ChangeHeaderPicModal extends Component{ text-align: center; width: 120px; height: 120px; + border: 1px solid #eee; } .previewWrap { flex-direction: column; @@ -121,10 +127,14 @@ class ChangeHeaderPicModal extends Component{ } .changeHeaderModal .tip { color: #9B9B9B; + margin-top: 4px; + } + .changeHeaderModal .cropperWrap .tip { + display: inline-block; } .previewWrap .tip { text-align: center; - margin-top: 2px; + margin-top: 4px; } #uploadBtn { color: #4CACFF; @@ -134,8 +144,9 @@ class ChangeHeaderPicModal extends Component{ } `}
-
+
Date: Thu, 4 Jul 2019 15:18:35 +0800 Subject: [PATCH 2/4] =?UTF-8?q?=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../courses/shixunHomework/Listofworks.js | 40 ++++++++++++++----- .../shixunHomework/Trainingjobsetting.js | 37 ++++++++++++++--- .../shixunHomework/Workquestionandanswer.js | 30 +++++++++++++- 3 files changed, 89 insertions(+), 18 deletions(-) diff --git a/public/react/src/modules/courses/shixunHomework/Listofworks.js b/public/react/src/modules/courses/shixunHomework/Listofworks.js index 2553300ab..a8507d853 100644 --- a/public/react/src/modules/courses/shixunHomework/Listofworks.js +++ b/public/react/src/modules/courses/shixunHomework/Listofworks.js @@ -1353,11 +1353,15 @@ class Listofworks extends Component { var blob = new Blob([response.data]) var downloadElement = document.createElement('a'); var href = window.URL.createObjectURL(blob); //创建下载的链接 - downloadElement.href = href; - downloadElement.download = '实习报告.pdf'; //下载后文件名 - document.body.appendChild(downloadElement); - downloadElement.click(); //点击下载 - document.body.removeChild(downloadElement); //下载完成移除元素 + let filename = response.headers.get('Content-Disposition'); + if (filename) { + filename = filename.match(/\"(.*)\"/)[1]; //提取文件名 + downloadElement.href = href; + downloadElement.download = filename; //下载后文件名 + document.body.appendChild(downloadElement); + downloadElement.click(); //点击下载 + document.body.removeChild(downloadElement); //下载完成移除元素 + } window.URL.revokeObjectURL(href); //释放掉blob对象 }).catch((error) => { console.log(error) @@ -1377,15 +1381,31 @@ class Listofworks extends Component { },{responseType: 'blob'}).then((response) => { console.log("1306"); console.log(response); + // if (response.status == 200) { + // let url = window.URL.createObjectURL(new Blob([response.data])) + // let link = document.createElement('a') + // link.style.display = 'none' + // link.href = url + // link.setAttribute('download', fileName) // 自定义下载文件名（如exemple.txt） + // document.body.appendChild(link) + // link.click() + // } + + var blob = new Blob([response.data]) var downloadElement = document.createElement('a'); var href = window.URL.createObjectURL(blob); //创建下载的链接 - downloadElement.href = href; - downloadElement.download = '课堂学生成绩.xlsx'; //下载后文件名 - document.body.appendChild(downloadElement); - downloadElement.click(); //点击下载 - document.body.removeChild(downloadElement); //下载完成移除元素 + let filename = response.headers.get('Content-Disposition'); + if (filename) { + filename = filename.match(/\"(.*)\"/)[1]; //提取文件名 + downloadElement.href = href; + downloadElement.download = filename; //下载后文件名 + document.body.appendChild(downloadElement); + downloadElement.click(); //点击下载 + document.body.removeChild(downloadElement); //下载完成移除元素 + } window.URL.revokeObjectURL(href); //释放掉blob对象 + }).catch((error) => { console.log(error) }); diff --git a/public/react/src/modules/courses/shixunHomework/Trainingjobsetting.js b/public/react/src/modules/courses/shixunHomework/Trainingjobsetting.js index 55770c359..19343ad79 100644 --- a/public/react/src/modules/courses/shixunHomework/Trainingjobsetting.js +++ b/public/react/src/modules/courses/shixunHomework/Trainingjobsetting.js @@ -1607,7 +1607,7 @@ class Trainingjobsetting extends Component { showmodel:false }) } -// 导出实习报告批量 + // 导出实习报告批量 internshipreport = () => { console.log("internshipreport"); var homeworkid = this.props.match.params.homeworkid; @@ -1616,14 +1616,26 @@ class Trainingjobsetting extends Component { params: { homework_common_id: homeworkid, } - }).then((response) => { - console.log("1593"); + },{responseType: 'blob'}).then((response) => { + console.log("326"); console.log(response); + var blob = new Blob([response.data]) + var downloadElement = document.createElement('a'); + var href = window.URL.createObjectURL(blob); //创建下载的链接 + let filename = response.headers.get('Content-Disposition'); + if (filename) { + filename = filename.match(/\"(.*)\"/)[1]; //提取文件名 + downloadElement.href = href; + downloadElement.download = filename; //下载后文件名 + document.body.appendChild(downloadElement); + downloadElement.click(); //点击下载 + document.body.removeChild(downloadElement); //下载完成移除元素 + } + window.URL.revokeObjectURL(href); //释放掉blob对象 }).catch((error) => { console.log(error) }); - } // 课堂学生成绩的导出下载 @@ -1631,9 +1643,22 @@ class Trainingjobsetting extends Component { console.log("Classstudentachievement"); const course_id = this.props.match.params.coursesId; let url = "/courses/" + course_id + "/export_member_scores_excel.xlsx"; - axios.get(url).then((response) => { - console.log("1607"); + axios.get((url),{responseType: 'blob'}).then((response) => { + console.log("339"); console.log(response); + var blob = new Blob([response.data]) + var downloadElement = document.createElement('a'); + var href = window.URL.createObjectURL(blob); //创建下载的链接 + let filename = response.headers.get('Content-Disposition'); + if (filename) { + filename = filename.match(/\"(.*)\"/)[1]; //提取文件名 + downloadElement.href = href; + downloadElement.download = filename; //下载后文件名 + document.body.appendChild(downloadElement); + downloadElement.click(); //点击下载 + document.body.removeChild(downloadElement); //下载完成移除元素 + } + window.URL.revokeObjectURL(href); //释放掉blob对象 }).catch((error) => { console.log(error) diff --git a/public/react/src/modules/courses/shixunHomework/Workquestionandanswer.js b/public/react/src/modules/courses/shixunHomework/Workquestionandanswer.js index 28560d4fe..d341aab6b 100644 --- a/public/react/src/modules/courses/shixunHomework/Workquestionandanswer.js +++ b/public/react/src/modules/courses/shixunHomework/Workquestionandanswer.js @@ -327,9 +327,22 @@ class Workquestionandanswer extends Component { params: { homework_common_id: homeworkid, } - }).then((response) => { + },{responseType: 'blob'}).then((response) => { console.log("326"); console.log(response); + var blob = new Blob([response.data]) + var downloadElement = document.createElement('a'); + var href = window.URL.createObjectURL(blob); //创建下载的链接 + let filename = response.headers.get('Content-Disposition'); + if (filename) { + filename = filename.match(/\"(.*)\"/)[1]; //提取文件名 + downloadElement.href = href; + downloadElement.download = filename; //下载后文件名 + document.body.appendChild(downloadElement); + downloadElement.click(); //点击下载 + document.body.removeChild(downloadElement); //下载完成移除元素 + } + window.URL.revokeObjectURL(href); //释放掉blob对象 }).catch((error) => { console.log(error) @@ -341,9 +354,22 @@ class Workquestionandanswer extends Component { console.log("Classstudentachievement"); const course_id = this.props.match.params.coursesId; let url = "/courses/" + course_id + "/export_member_scores_excel.xlsx"; - axios.get(url).then((response) => { + axios.get((url),{responseType: 'blob'}).then((response) => { console.log("339"); console.log(response); + var blob = new Blob([response.data]) + var downloadElement = document.createElement('a'); + var href = window.URL.createObjectURL(blob); //创建下载的链接 + let filename = response.headers.get('Content-Disposition'); + if (filename) { + filename = filename.match(/\"(.*)\"/)[1]; //提取文件名 + downloadElement.href = href; + downloadElement.download = filename; //下载后文件名 + document.body.appendChild(downloadElement); + downloadElement.click(); //点击下载 + document.body.removeChild(downloadElement); //下载完成移除元素 + } + window.URL.revokeObjectURL(href); //释放掉blob对象 }).catch((error) => { console.log(error) From 10fce08c59a231cd7e490ef6d79664903fbfada4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=9D=A8=E6=A0=91=E6=9E=97?= <904079904@qq.com> Date: Thu, 4 Jul 2019 15:22:51 +0800 Subject: [PATCH 3/4] =?UTF-8?q?=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../courses/shixunHomework/Listofworks.js | 23 +++++++------------ 1 file changed, 8 insertions(+), 15 deletions(-) diff --git a/public/react/src/modules/courses/shixunHomework/Listofworks.js b/public/react/src/modules/courses/shixunHomework/Listofworks.js index a8507d853..28395c1d7 100644 --- a/public/react/src/modules/courses/shixunHomework/Listofworks.js +++ b/public/react/src/modules/courses/shixunHomework/Listofworks.js @@ -1338,7 +1338,7 @@ class Listofworks extends Component { // 导出实习报告批量 internshipreport = ()=>{ console.log("internshipreport"); - let url = "/zip/shixun_report"; + let url = "http://47.96.87.25:48080/zip/shixun_report"; let homeworkid = this.props.match.params.homeworkid; axios.get((url),{ params: { @@ -1350,7 +1350,9 @@ class Listofworks extends Component { },{responseType: 'blob'}).then((response) => { console.log("1342"); console.log(response); - var blob = new Blob([response.data]) + if (response.status == 200) { + + var blob = new Blob([response.data]) var downloadElement = document.createElement('a'); var href = window.URL.createObjectURL(blob); //创建下载的链接 let filename = response.headers.get('Content-Disposition'); @@ -1363,6 +1365,7 @@ class Listofworks extends Component { document.body.removeChild(downloadElement); //下载完成移除元素 } window.URL.revokeObjectURL(href); //释放掉blob对象 + } }).catch((error) => { console.log(error) }); @@ -1372,7 +1375,7 @@ class Listofworks extends Component { Classstudentachievement=()=>{ console.log("Classstudentachievement"); const course_id = this.props.match.params.coursesId; - let url = "/courses/"+course_id+"/export_member_scores_excel.xlsx"; + let url = "http://47.96.87.25:48080/courses/"+course_id+"/export_member_scores_excel.xlsx"; axios.get((url),{ params: { group_id: this.state.checkedValuesineinfo, @@ -1381,17 +1384,7 @@ class Listofworks extends Component { },{responseType: 'blob'}).then((response) => { console.log("1306"); console.log(response); - // if (response.status == 200) { - // let url = window.URL.createObjectURL(new Blob([response.data])) - // let link = document.createElement('a') - // link.style.display = 'none' - // link.href = url - // link.setAttribute('download', fileName) // 自定义下载文件名（如exemple.txt） - // document.body.appendChild(link) - // link.click() - // } - - + if (response.status == 200) { var blob = new Blob([response.data]) var downloadElement = document.createElement('a'); var href = window.URL.createObjectURL(blob); //创建下载的链接 @@ -1405,7 +1398,7 @@ class Listofworks extends Component { document.body.removeChild(downloadElement); //下载完成移除元素 } window.URL.revokeObjectURL(href); //释放掉blob对象 - + } }).catch((error) => { console.log(error) }); From f536f0c98c575bbfd5046ed0501303fd967bb0f8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=9D=A8=E6=A0=91=E6=9E=97?= <904079904@qq.com> Date: Thu, 4 Jul 2019 15:32:53 +0800 Subject: [PATCH 4/4] =?UTF-8?q?=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../react/src/modules/courses/shixunHomework/Listofworks.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/public/react/src/modules/courses/shixunHomework/Listofworks.js b/public/react/src/modules/courses/shixunHomework/Listofworks.js index 28395c1d7..9606740dc 100644 --- a/public/react/src/modules/courses/shixunHomework/Listofworks.js +++ b/public/react/src/modules/courses/shixunHomework/Listofworks.js @@ -1338,7 +1338,7 @@ class Listofworks extends Component { // 导出实习报告批量 internshipreport = ()=>{ console.log("internshipreport"); - let url = "http://47.96.87.25:48080/zip/shixun_report"; + let url = "/zip/shixun_report"; let homeworkid = this.props.match.params.homeworkid; axios.get((url),{ params: { @@ -1375,7 +1375,7 @@ class Listofworks extends Component { Classstudentachievement=()=>{ console.log("Classstudentachievement"); const course_id = this.props.match.params.coursesId; - let url = "http://47.96.87.25:48080/courses/"+course_id+"/export_member_scores_excel.xlsx"; + let url = "/courses/"+course_id+"/export_member_scores_excel.xlsx"; axios.get((url),{ params: { group_id: this.state.checkedValuesineinfo,