Skip to content

P
pica.cloud.web-education-admin
提交 916ea0c9 编写于 作者: guangjun.yang's avatar guangjun.yang
浏览文件
操作

剪裁及bug修改等

上级 b4b9422a
展开全部 隐藏空白字符变更
内嵌 并排
正在显示 包含 756 行增加 和 4155 行删除
src/components/common/cropper.two.vue → src/components/common/cropper-img.vue
浏览文件 @ 916ea0c9
<template>
<div class="rc-cropper" v-if="originImg">
<el-row>
<el-col>
<div class="rc-cropper__canvasCrop2">
<img :src="originImg" v-if="!cropper">
<canvas :id="originImg" ref="canvas"/>
<div class="rc-cropper__iconCrop">
<el-tooltip content="确认裁剪" placement="right" v-if="cropper">
<el-button type="success" size="mini" @click="sureCropper()"><i class="el-icon-check"></i></el-button>
</el-tooltip>
</div>
</div>
</el-col>
<!-- <el-col :span="10">
<div class="rc-cropper__previewImg">
<img :src="previewImg" id="previewImg"/>
</div>
</el-col> -->
</el-row>
<div class="rc-cropper__canvasCrop2">
<img :src="originImg" v-if="!cropper">
<canvas :id="originImg" ref="canvas"/>
<div class="rc-cropper__iconCrop">
<el-tooltip content="确认裁剪" placement="right" v-if="cropper">
<el-button type="success" size="mini" @click="sureCropper()"><i class="el-icon-check"></i></el-button>
</el-tooltip>
</div>
</div>
</div>
</template>
<script>
......@@ -47,6 +38,9 @@ export default {
mounted () {
this.drawImg()
},
destroyed() {
this.cropper && this.cropper.destroy();
},
methods: {
// 在canvas上绘制图片
drawImg () {
......@@ -54,8 +48,8 @@ export default {
this.$nextTick(() => {
let canvas = document.getElementById(this.originImg)
if (canvas) {
canvas.width = 720
canvas.height = 480
canvas.width = 1000
canvas.height = 800
let ctx = canvas.getContext('2d')
ctx.clearRect(0, 0, canvas.width, canvas.height)
let img = new Image()
......@@ -74,8 +68,20 @@ export default {
this.cropper = new Cropper(this.$refs.canvas, {
checkCrossOrigin: true,
viewMode: 3,
zoomOnWheel: false, // 是否可以通过移动鼠标来放大图像
aspectRatio: 3 / 2,
zoomOnWheel: true, // 是否可以通过移动鼠标来放大图像
dragMode: 'move',
// autoCropArea: 0.6,
// center: true,
// autoCrop: true,
restore: false,
modal: true,
guides: true,
highlight: true,
cropBoxMovable: true,
cropBoxResizable: false,
toggleDragModeOnDblclick: false,
// aspectRatio: 75/42,
// aspectRatio: 5/3,
ready: () => {
this.cropper.setData({
x: this.cropOption.offset_x,
......@@ -83,19 +89,28 @@ export default {
width: this.cropOption.width,
height: this.cropOption.height
})
}
// this.cropper.zoomTo(1);
},
// zoom: function (event) {
// // Keep the image in its natural size
// if (event.detail.oldRatio === 1) {
// event.preventDefault();
// }
// },
})
// this.cropper = cropper
},
// 确认裁剪
sureCropper () {
let _this = this
const cropParam = this.cropper.getData()
console.log('cropParam', cropParam);
this.cropper.getCroppedCanvas().toBlob(function (blob) {
let files = new window.File([blob], 'cropper.jpg');
console.log(files);
let oFileReader = new FileReader()
oFileReader.onloadend = function (e) {
let base64 = e.target.result
_this.$emit('getCropImg', base64, cropParam)
_this.$emit('getCropImg', base64, cropParam, files, _this.cropper)
}
oFileReader.readAsDataURL(blob)
}, 'image/jpeg')
......@@ -103,11 +118,16 @@ export default {
}
}
</script>
<style >
.rc-cropper {
position: relative;
margin-top: 20px;
}
<style scoped lang="scss">
// .rc-cropper {
// position: relative;
// margin-top: 10px;
// img {
// width: 100%;
// height: 100%;
// }
// }
/* img {
width: 100%;
......@@ -115,14 +135,16 @@ export default {
} */
.rc-cropper__canvasCrop2 {
width: 900px;
height: 760px;
/* border: 1px solid red; */
width: 800px;
height: 540px;
}
.rc-cropper__iconCrop {
position: absolute;
left: 45%;
top: 0%;
/* left: 8%; */
left: 46%;
top: 10%;
}
.el-tooltip {
......@@ -131,8 +153,4 @@ export default {
z-index: 10000;
}
.rc-cropper__previewImg {
width: 600px;
height: 400px;
}
</style>
src/components/education/custom-resource/reject-reason-dialog.vue
浏览文件 @ 916ea0c9
......@@ -9,12 +9,14 @@
<el-form ref="auditForm" :model="auditForm" label-width="120px">
<el-form-item label="拒绝原因：">
<el-radio-group v-model="auditForm.label">
<div style="padding-top: 12px;">
<el-radio :label="refuseReasonList[0]"></el-radio>
<div v-for="item in refuseReasonList" :key="item">
<div style="padding-top: 12px;">
<el-radio :label="item"></el-radio>
</div>
</div>
<div style="padding-top: 16px;">
<!-- <div style="padding-top: 16px;">
<el-radio :label="refuseReasonList[1]"></el-radio>
</div>
</div> -->
<div style="padding-top: 16px;">
<el-radio label="其他"></el-radio>
</div>
......
src/utils/oss/ossUtil.js
浏览文件 @ 916ea0c9
......@@ -119,7 +119,7 @@ export const getFilePathForOSS = (file, fileName, folder) => {
}
//文件类型
let ext = file.type;
let ext = file.type || 'image/jpeg';
//后缀名
let suffix = file.name.substring(file.name.lastIndexOf(".") + 1);
//若为空则从name中获取---对wps格式的文件获取不到file.type
......
src/utils/qiniu-util copy 2.js 0 → 100644
浏览文件 @ 916ea0c9
此差异已折叠。
src/utils/qiniu-util.js
浏览文件 @ 916ea0c9
......@@ -341,23 +341,15 @@ export const getFilePath = (file,fileName,folder) => {
* @returns {Promise}
*/
export const doUpload = (self, file, filePath, previewId, progressId, fileType) => {
// var deferred = $q.defer();
return new Promise(function (resolve, reject) {
if (isEmptyUtils(file) || isEmptyUtils(filePath)) {
console.error('七牛上传失败:非法参数');
reject();
}
let key = filePath ? filePath : getFilePath(file);
//修改状态为上传
self.qiniuUploadStatus = true;
// let token = "BRVB4TpxVFA5Wo6lIpfltmWKOltzGar46tvC3BlR:UHn0LDElwjP4jEZTXdq_1qV6_hw=:eyJzY29wZSI6InBpY2EtdGVzdCIsInJldHVybkJvZHkiOiJ7XCJrZXlcIjpcIiQoa2V5KVwiLFwiaGFzaFwiOlwiJChldGFnKVwiLFwiYnVja2V0XCI6XCIkKGJ1Y2tldClcIixcImZzaXplXCI6JChmc2l6ZSksXCJmbmFtZVwiOiQoZm5hbWUpLFwiZXh0XCI6JChleHQpfSIsImRlYWRsaW5lIjoxNTI5NDk0MTc1fQ==";
doQiniuAction1(fileType).then(function (token) {
let putExtra = {
fname: file.name, //原文件名
......@@ -396,27 +388,6 @@ export const doUpload = (self, file, filePath, previewId, progressId, fileType)
self.uploadProgress2 = Number(progress);
}
console.log('Progress2: ' + progress);
//如果有进度条
/*if (isNotEmptyUtils(progressId)) {
let obj = $("#" + progressId);
//开始上传时,显示进度条
if (isNotEmptyUtils(obj.parent())) {
//修改状态为上传
// status = true;
self.qiniuUploadStatus = true;
obj.parent().removeClass("hidden");
obj.fadeIn("fast");
}
obj.css("width", progress + '%');
obj.text(progress + '%');
//上传完成,2秒后淡出进度条
if (progress === "100.00") {
//修改状态为非上传
// status = false;
self.qiniuUploadStatus = true;
obj.fadeOut(2000);
}
}*/
};
/**
......@@ -428,7 +399,6 @@ export const doUpload = (self, file, filePath, previewId, progressId, fileType)
setTimeout(function(){
result.key = res.key;
result.path = '/' + res.key;
// result.fullPath = domain + '/' + res.key + '_' + new Date().getTime();
if(!fileType) { // 图片 文件
console.log('---domain-------',domain)
result.fullPath = domain + '/' + res.key;
......@@ -436,32 +406,12 @@ export const doUpload = (self, file, filePath, previewId, progressId, fileType)
console.log('----domain1------',domain1)
result.fullPath = domain1 + '/' + res.key;
}
result.size = res.fsize;
result.name = res.fname ;
result.ext = res.ext;
// deferred.resolve(result);
resolve(result);
// self.model.qCloudUrl = result.fullPath;
// $("#introVideoLecture").attr("src", self.model.qCloudUrl);
//修改状态为非上传
// status = false;
self.qiniuUploadStatus = false;
// if (isNotEmptyUtils(previewId)) {
// let address = domain + result.path;
// console.log('文件路径: ' + address);
// //显示图片
// let uplodImg = $('<img>').attr("src", address);
// let obj = $("#" + previewId);
// obj.empty().append(uplodImg);
// obj.css('max-width', '100%');
// }
},500);
};
/**
......@@ -483,12 +433,6 @@ export const doUpload = (self, file, filePath, previewId, progressId, fileType)
}else {
console.error(err);
}
/*modalClick("提示", "上传失败！", "确定", function () {
$('#model-modify').modal('hide');
}, "", null);*/
// deferred.reject(new Error('七牛上传失败'));
// return deferred.promise;
return reject(new Error('七牛上传失败'));
};
......@@ -497,11 +441,7 @@ export const doUpload = (self, file, filePath, previewId, progressId, fileType)
});
console.log(33333);
// 保存到全局对象
window.QNSubscription = subscription;
// return deferred.promise;
});
};
src/views/education/audit-custom-course.vue
浏览文件 @ 916ea0c9
......@@ -72,7 +72,7 @@
<div class="video-name">
<span class="title">
<span style="color: red;">*</span>
<span class="video-title">视频名称</span>
<span class="video-title">视频名称{{index + 1}}</span>
</span>
<el-input
size="small"
......@@ -608,7 +608,7 @@ export default {
if(!flag) {
let lectureList = cData.courseCustomChapterModels[0].courseCustomLectureModelList;
for(let i = 0; i < lectureList.length; i ++) {
if(lectureList[i].nameCheck) {
if(lectureList[i].nameCheck || lectureList[i].contentCheck) {
flag = true;
break;
}
......@@ -776,7 +776,7 @@ export default {
margin-bottom: 10px;
.title {
display: inline-block;
width: 70px;
width: 80px;
text-align: right;
margin-right: 10px;
}
......@@ -801,7 +801,7 @@ export default {
.video-name {
.title {
display: inline-block;
width: 70px;
width: 80px;
text-align: right;
margin-right: 10px;
}
......
src/views/education/edit-custom copy 2.vue 已删除 100644 → 0
浏览文件 @ b4b9422a
此差异已折叠。
src/views/education/edit-custom copy.vue 已删除 100644 → 0
浏览文件 @ b4b9422a
此差异已折叠。
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或