jietu2.js 6.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176
  1. // let _loading = document.createElement('div')
  2. // _loading.style = "width:100%;height:100%;background:#0000008f;position:fixed;top:0;left:0;z-index:99999999999999;display: flex;justify-content: center;align-items: center;"
  3. // let _lchild = document.createElement('div')
  4. // let _limg = document.createElement('img')
  5. // _limg.src = 'https://pbl.cocorobo.cn/pbl-student-table/dist/js/loading.gif'
  6. // _limg.style = "width: 26px;margin-right: 10px;"
  7. // _lchild.appendChild(_limg)
  8. // let _lspan = document.createElement('span')
  9. // _lspan.innerHTML = "上傳中..."
  10. // _lchild.appendChild(_lspan)
  11. // _lchild.style = "color: #fff;padding: 15px;background: #00000070;border-radius: 5px;font-size: 18px;display:flex;align-items:center;"
  12. // _loading.appendChild(_lchild)
  13. // document.body.appendChild(_loading)
  14. let $jq = '';
  15. $jq = $
  16. var $180 = $.noConflict();
  17. function jietu_shishi(uid, cid, stage, task, tool) {
  18. html2canvas($jq("body")[0]).then(function (canvas) {
  19. //獲取截取圖片路徑
  20. var base64Url = canvas.toDataURL('image/png');
  21. //後臺操作處理
  22. var base64 = "<img src=" + base64Url + " />"
  23. var file = dataURLtoFile_shishi(base64Url, "截圖")
  24. beforeUpload_shishi(file, uid, cid, stage, task, tool)
  25. // $jq("body")[0].innerHTML = base64
  26. });
  27. }
  28. function dataURLtoFile_shishi(dataurl, filename) {
  29. let arr = dataurl.split(","),
  30. mime = arr[0].match(/:(.*?);/)[1],
  31. bstr = atob(arr[1]),
  32. n = bstr.length,
  33. u8arr = new Uint8Array(n);
  34. while (n--) {
  35. u8arr[n] = bstr.charCodeAt(n);
  36. }
  37. return new File([u8arr], filename, {
  38. type: mime
  39. });
  40. }
  41. function beforeUpload_shishi(nfile, uid, cid, stage, task, tool, loading, atool, text) {
  42. // loading.style.display = 'flex'
  43. // top.document.getElementById(loading);
  44. // document.body.appendChild(_loading)
  45. var file = nfile;
  46. var credentials = {
  47. accessKeyId: "AKIATLPEDU37QV5CHLMH",
  48. secretAccessKey: "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",
  49. }; //秘鑰形式的登錄上傳
  50. window.AWS.config.update(credentials);
  51. window.AWS.config.region = "cn-northwest-1"; //設置區域
  52. var bucket = new window.AWS.S3({
  53. params: {
  54. Bucket: "ccrb"
  55. }
  56. }); //選擇桶
  57. if (file) {
  58. var params = {
  59. Key: file.name.split(".")[0] + new Date().getTime() + "." + "png",
  60. ContentType: file.type,
  61. Body: file,
  62. "Access-Control-Allow-Credentials": "*",
  63. ACL: "public-read",
  64. }; //key可以設置為桶的相抵路徑,Body為文件, ACL最好要設置
  65. var options = {
  66. partSize: 2048 * 1024 * 1024,
  67. queueSize: 2,
  68. leavePartsOnError: true,
  69. };
  70. bucket.upload(params, options)
  71. .on("httpUploadProgress", function (evt) {
  72. //這裏可以寫進度條
  73. // console.log("Uploaded : " + parseInt((evt.loaded * 80) / evt.total) + '%');
  74. }).send(function (err, data) {
  75. if (data) {
  76. console.log(data.Location);
  77. var a = {
  78. name: file.name,
  79. url: data.Location,
  80. uid: file.uid,
  81. }
  82. addSWork_shishi(uid, cid, stage, task, tool, data.Location, loading, atool, text)
  83. } else {
  84. var _a = document.getElementsByTagName("img")
  85. for (var i = 0; i < _a.length; i++) {
  86. _a[i].removeAttribute("crossorigin")
  87. }
  88. top.document.getElementById(loading).children[0].style.display = "none"
  89. let _div = document.createElement('div')
  90. _div.style = "width:100%;height:100%;background:#0000008f;position:fixed;top:0;left:0;z-index:99999999999999;display: flex;justify-content: center;align-items: center;"
  91. let _inner = document.createElement('div')
  92. _inner.style = "color: #fff;padding: 15px;background: #00000070;border-radius: 5px;font-size: 18px;"
  93. _inner.innerHTML = "上傳失敗,網絡錯誤"
  94. _div.appendChild(_inner)
  95. document.body.appendChild(_div)
  96. setTimeout(() => {
  97. document.body.removeChild(_div)
  98. }, 1000);
  99. }
  100. });
  101. }
  102. }
  103. function addSWork_shishi(uid, cid, stage, task, tool, a, loading, atool, text) {
  104. let params = {
  105. uid: uid,
  106. cid: cid,
  107. stage: stage,
  108. task: task,
  109. tool: tool,
  110. content: a,
  111. type: 1,
  112. atool: atool,
  113. text: text
  114. // upload: JSON.stringify(this.imgFileUp),
  115. };
  116. if (!$jq) {
  117. $jq = $
  118. var $180 = $.noConflict();
  119. }
  120. $jq.ajax({
  121. type: 'POST',
  122. url: 'https://pbl.cocorobo.cn/api/pbl/addCourseWorks4',
  123. data: params,
  124. dataType: "json",
  125. error: (XMLHttpRequest, textStatus, errorThrown) => {
  126. var _a = document.getElementsByTagName("img")
  127. for (var i = 0; i < _a.length; i++) {
  128. _a[i].removeAttribute("crossorigin")
  129. }
  130. top.document.getElementById(loading).children[0].style.display = "none"
  131. let _div = document.createElement('div')
  132. _div.style = "width:100%;height:100%;background:#0000008f;position:fixed;top:0;left:0;z-index:99999999999999;display: flex;justify-content: center;align-items: center;"
  133. let _inner = document.createElement('div')
  134. _inner.style = "color: #fff;padding: 15px;background: #00000070;border-radius: 5px;font-size: 18px;"
  135. _inner.innerHTML = "上傳失敗,網絡錯誤"
  136. _div.appendChild(_inner)
  137. document.body.appendChild(_div)
  138. setTimeout(() => {
  139. document.body.removeChild(_div)
  140. }, 1000);
  141. },
  142. success: (data) => {
  143. setTimeout(() => {
  144. var _a = document.getElementsByTagName("img")
  145. for (var i = 0; i < _a.length; i++) {
  146. _a[i].removeAttribute("crossorigin")
  147. }
  148. top.document.getElementById(loading).children[0].style.display = "none"
  149. let _div = document.createElement('div')
  150. _div.style = "width:100%;height:100%;background:#0000008f;position:fixed;top:0;left:0;z-index:99999999999999;display: flex;justify-content: center;align-items: center;"
  151. let _inner = document.createElement('div')
  152. _inner.style = "color: #fff;padding: 15px;background: #00000070;border-radius: 5px;font-size: 18px;"
  153. _inner.innerHTML = "截圖上傳成功"
  154. _div.appendChild(_inner)
  155. document.body.appendChild(_div)
  156. _div.onclick = () => {
  157. document.body.removeChild(_div)
  158. }
  159. setTimeout(() => {
  160. // document.body.removeChild(_loading)
  161. document.body.removeChild(_div)
  162. }, 1000);
  163. console.log("截圖上傳成功");
  164. }, 3000)
  165. }
  166. })
  167. }