Skip to content

P
pica-admin-IM
提交 fa3fa581 编写于 作者: huangwensu's avatar huangwensu
浏览文件
操作

问卷接口联调

上级 282eae6a
隐藏空白字符变更
内嵌 并排
正在显示 包含 139 行增加 和 187 行删除
src/utils/fetch.js
浏览文件 @ fa3fa581
...@@ -36,11 +36,11 @@ service.interceptors.response.use( ...@@ -36,11 +36,11 @@ service.interceptors.response.use(
baseUrl时，返回000000为成功 baseUrl时，返回000000为成功
apiUrl时，返回200为成功 apiUrl时，返回200为成功
*/ */
if (res.code !== '000000') { // if (res.code !== '000000') {
return Promise.reject('error') // return Promise.reject('error')
} else { // } else {
return response.data return response.data
} //}
}, },
error => { error => {
// logger.error('err' + error) // logger.error('err' + error)
......
src/utils/qiniu-util.js
浏览文件 @ fa3fa581
...@@ -109,164 +109,6 @@ const doQiniuAction1 = (fileType) => { ...@@ -109,164 +109,6 @@ const doQiniuAction1 = (fileType) => {
}); });
}; };
/**
*
* @param self
* @param file
* @param filePath
* @param previewId
* @param progressId
* @returns {Promise}
*/
export const qiniuUpload = (self, file, filePath, previewId, progressId) => {
// 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==";
doQiniuAction().then(function (token) {
let putExtra = {
fname: file.name, //原文件名
params: {}, //用来放置自定义变量
mimeType: mimeTypeArray || null //null || array，用来限制上传文件类型，为 null 时表示不对文件类型限制；限制类型放到数组里： ["image/png", "image/jpeg", "image/gif"]
};
let config = {
useCdnDomain: true, //表示是否使用 cdn 加速域名，为布尔值，true 表示使用，默认为 false。
region: null //选择上传域名区域；当为 null 或 undefined 时，自动分析上传域名区域
};
/*
* qiniu.upload 返回一个 observable 对象用来控制上传行为，observable 对像通过 subscribe 方法可以被 observer 所订阅，
* 订阅同时会开始触发上传，同时返回一个 subscription 对象，该对象有一个 unsubscribe 方法取消订阅，同时终止上传行为。
* */
let observable = qiniu.upload(file, key, token, putExtra, config);
/**
* 接收上传进度信息，res 参数是一个带有 total 字段的 object，包含loaded、total、percent三个属性，提供上传进
* total.loaded: number，已上传大小，单位为字节。
* total.total: number，本次上传的总量控制信息，单位为字节，注意这里的 total 跟文件大小并不一致。
* total.percent: number，当前上传进度，范围：0～100
* */
let next = function (res) {
//res值{"total":{"loaded":18184,"size":18185,"percent":99.99450096233159}}
//获取百分比进度
let progress = res.total.percent.toFixed(2);
self.uploadProgress = Number(progress);
console.log('Progress: ' + 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);
}
}*/
};
/**
* 接收上传完成后的后端返回信息，res 参数为一个 object， 为上传成功后后端返回的信息
* ，具体返回结构取决于后端sdk的配置，可参考上传策略(https://developer.qiniu.com/kodo/manual/1206/put-policy)
* */
let complete = function (res) {
console.log("七牛上传完成");
setTimeout(function(){
result.key = res.key;
result.path = '/' + res.key;
result.fullPath = domain + '/' + res.key + '?v=' + new Date().getTime();
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 $img = $('<img>').attr("src", address);
let obj = $("#" + previewId);
obj.empty().append($img);
obj.css('max-width', '100%');
}
},2000);
};
/**
* 上传错误后触发，当不是 xhr 请求错误时，会把当前错误产生原因直接抛出，诸如 JSON 解析异常等；当产生 xhr 请求错误时，参数 err 为一个包含 code、message、isRequestError 三个属性的 object：
* err.isRequestError: 用于区分是否 xhr 请求错误；当 xhr 请求出现错误并且后端通过 HTTP 状态码返回了错误信息时，该参数为 true；否则为 undefined 。
* err.reqId: string，xhr请求错误的 X-Reqid。
* err.code: number，请求错误状态码，只有在 err.isRequestError 为 true 的时候才有效，可查阅码值对应说明。
* err.message: string，错误信息，包含错误码，当后端返回提示信息时也会有相应的错误信息。
* */
let error = function (err) {
//修改状态为非上传
// status = false;
self.qiniuUploadStatus = false
localStorage.removeItem('qiniuToken');
console.log("七牛上传失败,详细信息请参考:https://developer.qiniu.com/kodo/api/3928/error-responses");
//输出简略错误信息
if (err.isRequestError){
qiniuErrorCheck(err.code)
}else {
console.error(err);
}
/*modalClick("提示", "上传失败！", "确定", function () {
$('#model-modify').modal('hide');
}, "", null);*/
// deferred.reject(new Error('七牛上传失败'));
// return deferred.promise;
return reject(new Error('七牛上传失败'));
};
// 上传开始
subscription = observable.subscribe(next, error, complete);
});
// return deferred.promise;
});
};
/** /**
* 获取时间戳 * 获取时间戳
* @param {Date} [date]日期对象,为空时,返回当前时间戳 * @param {Date} [date]日期对象,为空时,返回当前时间戳
......
src/views/question-naire/question-list.vue
浏览文件 @ fa3fa581
...@@ -24,7 +24,7 @@ ...@@ -24,7 +24,7 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12" style="text-align:right;padding:0 30px 15px 0;"> <el-col :span="12" style="text-align:right;padding:0 30px 15px 0;">
<el-button type="primary" size="small" @click="search(1)">查询</el-button> <el-button type="primary" size="small" @click="search(1)">查询</el-button>
<el-button type="default" size="small" @click="reseat">重置</el-button> <el-button type="default" size="small" @click="reseat">重置</el-button>
</el-col> </el-col>
...@@ -56,7 +56,7 @@ ...@@ -56,7 +56,7 @@
<el-button type="primary" size="small" @click="edit(scope.row)">编辑</el-button> <el-button type="primary" size="small" @click="edit(scope.row)">编辑</el-button>
<el-button type="primary" v-if="scope.row.status == 1" size="small" @click="onAndDownLine(scope.row)">上线</el-button> <el-button type="primary" v-if="scope.row.status == 1" size="small" @click="onAndDownLine(scope.row)">上线</el-button>
<el-button type="primary" v-if="scope.row.status == 2" size="small" @click="onAndDownLine(scope.row)">下线</el-button> <el-button type="primary" v-if="scope.row.status == 2" size="small" @click="onAndDownLine(scope.row)">下线</el-button>
<el-button type="primary" size="small" @click="reviewQuestion(scope.row)">查看题库</el-button> <!-- <el-button type="primary" size="small" @click="reviewQuestion(scope.row)">查看题库</el-button> -->
</template> </template>
</el-table-column> </el-table-column>
<div slot="empty"> <div slot="empty">
...@@ -98,8 +98,19 @@ ...@@ -98,8 +98,19 @@
<el-input v-model="questionEditList.name" placeholder="标题最多30字符" style="width: 300px;"></el-input> <el-input v-model="questionEditList.name" placeholder="标题最多30字符" style="width: 300px;"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="题库导入"> <el-form-item label="题库导入">
<el-input style="width: 300px;"></el-input> <el-col :span="10">
<el-button type="primary">导入题库</el-button> <el-input class="form-input" :placeholder="excelFileName" v-model="fileName" style="width: 300px;"/>
</el-col>
<el-col :span="2">
<el-upload
class="upload-demo"
action="#"
accept=".xlsx"
:before-upload="beforeImport"
:limit="1">
<el-button type="primary" size="mini" icon="search">导入题库</el-button>
</el-upload>
</el-col>
</el-form-item> </el-form-item>
<el-form-item label="下一题按钮" v-if="questionEditList.showType == 1"> <el-form-item label="下一题按钮" v-if="questionEditList.showType == 1">
<div class="submit-btn"> <div class="submit-btn">
...@@ -110,7 +121,7 @@ ...@@ -110,7 +121,7 @@
action="#" action="#"
:show-file-list="false" :show-file-list="false"
:before-upload="beforeAvatarUpload_1"> :before-upload="beforeAvatarUpload_1">
<el-button size="mini" type="primary" @click="uploadImg(index)">上传</el-button> <el-button size="mini" type="primary">上传</el-button>
</el-upload> </el-upload>
<div class="uploat-content"> <div class="uploat-content">
<img v-if="questionEditList.nextDisableClickUrl" :src="questionEditList.nextDisableClickUrl" class="bg-img"> <img v-if="questionEditList.nextDisableClickUrl" :src="questionEditList.nextDisableClickUrl" class="bg-img">
...@@ -120,16 +131,16 @@ ...@@ -120,16 +131,16 @@
<div class="submit-btn" style="margin-left:20px;"> <div class="submit-btn" style="margin-left:20px;">
<p>点亮可点</p> <p>点亮可点</p>
<el-upload <el-upload
v-model="questionEditList.nextDisableClickUrl" v-model="questionEditList.nextClickUrl"
class="avatar-uploader" class="avatar-uploader"
action="#" action="#"
:show-file-list="false" :show-file-list="false"
:before-upload="beforeAvatarUpload_2"> :before-upload="beforeAvatarUpload_2">
<el-button size="mini" type="primary" @click="uploadImg(index)">上传</el-button> <el-button size="mini" type="primary">上传</el-button>
</el-upload> </el-upload>
<div class="uploat-content"> <div class="uploat-content">
<img v-if="questionEditList.nextDisableClickUrl" :src="questionEditList.nextDisableClickUrl" class="bg-img"> <img v-if="questionEditList.nextClickUrl" :src="questionEditList.nextClickUrl" class="bg-img">
<img v-if="!questionEditList.nextDisableClickUrl" class="bg-img" src="../../assets/image/default.png"> <img v-if="!questionEditList.nextClickUrl" class="bg-img" src="../../assets/image/default.png">
</div> </div>
</div> </div>
</el-form-item> </el-form-item>
...@@ -153,7 +164,7 @@ ...@@ -153,7 +164,7 @@
action="#" action="#"
:show-file-list="false" :show-file-list="false"
:before-upload="beforeAvatarUpload_4"> :before-upload="beforeAvatarUpload_4">
<el-button size="mini" type="primary" @click="uploadImg(index)">上传</el-button> <el-button size="mini" type="primary">上传</el-button>
</el-upload> </el-upload>
<div class="uploat-content"> <div class="uploat-content">
<img v-if="questionEditList.headDiagramUrl" :src="questionEditList.headDiagramUrl" class="bg-img"> <img v-if="questionEditList.headDiagramUrl" :src="questionEditList.headDiagramUrl" class="bg-img">
...@@ -168,7 +179,7 @@ ...@@ -168,7 +179,7 @@
action="#" action="#"
:show-file-list="false" :show-file-list="false"
:before-upload="beforeAvatarUpload_3"> :before-upload="beforeAvatarUpload_3">
<el-button size="mini" type="primary" @click="uploadImg(index)">上传</el-button> <el-button size="mini" type="primary">上传</el-button>
</el-upload> </el-upload>
<div class="uploat-content"> <div class="uploat-content">
<img v-if="questionEditList.submitButtomUrl" :src="questionEditList.submitButtomUrl" class="bg-img"> <img v-if="questionEditList.submitButtomUrl" :src="questionEditList.submitButtomUrl" class="bg-img">
...@@ -189,6 +200,7 @@ ...@@ -189,6 +200,7 @@
<script> <script>
import BreadCrumb from '../../components/breadcrumb.vue' import BreadCrumb from '../../components/breadcrumb.vue'
import * as commonUtil from '../../utils/utils' import * as commonUtil from '../../utils/utils'
import { getFilePath, doUpload } from '../../utils/qiniu-util'
let vm = null let vm = null
export default { export default {
components: { components: {
...@@ -200,6 +212,9 @@ export default { ...@@ -200,6 +212,9 @@ export default {
curmbSecond: '问卷管理', curmbSecond: '问卷管理',
questionTitle: '问卷新增/编辑', questionTitle: '问卷新增/编辑',
discussEditVisible: false, discussEditVisible: false,
excelFileName: '',
fileName: '',
fileArray: [],
tableData: [], tableData: [],
totalRows: 0, totalRows: 0,
loading:false, loading:false,
...@@ -210,8 +225,8 @@ export default { ...@@ -210,8 +225,8 @@ export default {
pageNo: 1 pageNo: 1
}, },
modifyArray: [], modifyArray: [],
rules: {},
questionEditList: { questionEditList: {
id: '',
showType: 1, showType: 1,
name: '', name: '',
nextDisableClickUrl: '', nextDisableClickUrl: '',
...@@ -223,6 +238,14 @@ export default { ...@@ -223,6 +238,14 @@ export default {
subheading: '', subheading: '',
questionIntro: '' questionIntro: ''
}, },
rules: {
name: [
{ required: true, message: '请输入问卷标题', trigger: 'blur' }
],
promptCopy: [
{ required: true, message: '请输入问卷填写完毕提示文案', trigger: 'blur' }
]
},
statuSelect: [ statuSelect: [
{ {
label: '下线', label: '下线',
...@@ -254,6 +277,14 @@ export default { ...@@ -254,6 +277,14 @@ export default {
} }
}) })
}, },
handleSizeChange(value) {
vm.searchParam.pageSize = value
vm.search()
},
handleCurrentChange(value) {
vm.searchParam.pageNo = value
vm.search()
},
reseat() { reseat() {
vm.searchParam.name = '' vm.searchParam.name = ''
vm.searchParam.status = '' vm.searchParam.status = ''
...@@ -271,6 +302,7 @@ export default { ...@@ -271,6 +302,7 @@ export default {
addQuestion() { addQuestion() {
vm.discussEditVisible = true vm.discussEditVisible = true
vm.questionEditList = Object.assign({},{ vm.questionEditList = Object.assign({},{
id: '',
showType: 1, showType: 1,
name: '', name: '',
nextDisableClickUrl: '', nextDisableClickUrl: '',
...@@ -315,30 +347,108 @@ export default { ...@@ -315,30 +347,108 @@ export default {
// 查看题库 // 查看题库
reviewQuestion() { reviewQuestion() {
},
// 导入题库
beforeImport(file) {
if (commonUtil.isEmptyUtils(file)) return;
let arr = file.type.split('/');
let ext = "." + arr[1];
let reader = new FileReader();
reader.onload = function (e) {
let fileJson = {
fileName: file.name,
file: e.target.result.substr(e.target.result.indexOf("base64,") + 7),
ext: ext
};
vm.fileArray = [{
base64: fileJson
}];
vm.fileName = file.name;
vm.excelFileName = file.name;
vm.$message.info('读取完毕');
};
reader.readAsDataURL(file);
}, },
// 置灰不可点图片上传 // 置灰不可点图片上传
beforeAvatarUpload_1() { beforeAvatarUpload_1(file) {
if (commonUtil.isEmptyUtils(file)) return;
vm.imgDoUpload(file,1,50,750,100)
}, },
// 点亮图片上传 // 点亮图片上传
beforeAvatarUpload_2() { beforeAvatarUpload_2(file) {
if (commonUtil.isEmptyUtils(file)) return;
vm.imgDoUpload(file,2,50,750,100)
}, },
// 提交图片上传 // 提交图片上传
beforeAvatarUpload_3() { beforeAvatarUpload_3(file) {
if (commonUtil.isEmptyUtils(file)) return;
vm.imgDoUpload(file,3,50,750,100)
}, },
handleSizeChange(value) { // 头图图片上传
vm.searchParam.pageSize = value beforeAvatarUpload_4(file) {
vm.search() if (commonUtil.isEmptyUtils(file)) return;
vm.imgDoUpload(file,4,100,750,468)
}, },
handleCurrentChange(value) { imgDoUpload(file,urlType,size,w,h) {
vm.searchParam.pageNo = value const isSize = file.size / 1024 < size;
vm.search() if(!isSize) {
vm.$message.info('上传图片要小于' + size + 'k')
return;
}
var _img = new FileReader()
_img.readAsDataURL(file)
_img.onload = function(theFile) {
let image = new Image()
image.src = theFile.target.result
image.onload = function() {
let _this = this
if( _this.width != w || _this.height != h) {
vm.$message.info("上传图片尺寸应为"+ w +"*"+ h +"，请重新上传")
}else {
vm.$message.info('开始上传');
doUpload(vm,file, getFilePath(file,null), 'preview4', 'progress1', 1).then(function (path) {
if(urlType == 1) {
vm.questionEditList.nextDisableClickUrl = path.fullPath
}else if(urlType == 2) {
vm.questionEditList.nextClickUrl = path.fullPath
}else if(urlType == 3) {
vm.questionEditList.submitButtomUrl = path.fullPath
}else {
vm.questionEditList.headDiagramUrl = path.fullPath
}
vm.$message.success('上传成功')
});
}
}
}
}, },
// 提交 // 提交
submitQuestion() { submitQuestion() {
let req = {
model: vm.questionEditList,
fileArray: vm.fileArray
}
if(vm.questionEditList.showType == 1) {
vm.questionEditList.subheading = ''
vm.questionEditList.questionIntro = ''
vm.questionEditList.headDiagramUrl = ''
}else {
vm.questionEditList.nextDisableClickUrl = ''
vm.questionEditList.nextClickUrl = ''
if(vm.questionEditList.headStyle == 1) {
vm.questionEditList.headDiagramUrl = ''
}else {
vm.questionEditList.subheading = ''
}
}
vm.POST('/campaign/adminQuestionnaire/insertOrUpdateQuestionnaire',req).then((res) => {
if(res.code == '000000') {
vm.discussEditVisible = false
}else {
vm.$message.info(res.message)
}
})
} }
} }
} }
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或