Authored by ZhongW

组件增加上传视频的功能

... ... @@ -86,6 +86,25 @@ module.exports = {
return callback(null,errBackMsg);
}
});
}//上传文件
else if(req.body.__type == "import-video"){
req.body.file = fs.createReadStream(req.files[req.body.filename].path);
request.post({
url: config.domain+"/fileupload/uploadFile",
formData: req.body,
headers: httpHeader
}, function optionalCallback(error, httpResponse, body) {
if (error) {
return callback(null,error);
}
if (!error && httpResponse.statusCode == 200) {
var json = JSON.parse(body);
json.status = true;
return callback(null,json)
} else {
return callback(null,errBackMsg);
}
});
}
//上传图片
else {
... ...
... ... @@ -5,7 +5,7 @@
<div class="contentpanel">
<div class="panel panel-default" style="...">
<div class="panel-body" style="padding-bottom: 0">
<a id="upload-btn" href="javascript:;" class="btn btn-success"><span class="glyphicon glyphicon-cloud-upload"></span> 添加新视频 </a>
<a id="addVideo" href="javascript:;" class="btn btn-success"><span class="glyphicon glyphicon-cloud-upload"></span> 添加新视频 </a>
</div>
<div class="panel-body">
<div class="row">
... ... @@ -31,118 +31,50 @@
<script type="text/template" id="template">
<div class="rows" id="baseform">
<div class="form-group">
<label class="col-sm-2 control-label" for="avatar">头像<span class="red">*</span></label>
[[if avatar]]
<div class="col-sm-6">
<div class="goods-img">
<a class="fileinput-button-icon" href="javascript:void(0);">
<img id="avatarpic" src="[[avatar]]?imageView/2/w/100/h/100">
</a>
<i class="remove-item-btn remove1 glyphicon glyphicon-remove-circle" data-link="avatar"></i>
</div>
</div>
[[else]]
<div class="col-sm-6">
<input type="file" bucket="modelCard" class="form-control avatar" id="avatar" name="avatar"
placeholder="头像" data-field="avatar"/>
</div>
[[/if]]
</div>
<div class="rows">
<div class="form-group">
<label class="col-sm-2 control-label" for="modelName">姓名<span class="red">*</span></label>
<div class="col-sm-3">
<input type="text" value="[[modelName]]" class="form-control observe" id="modelName"
placeholder="姓名" data-field="modelName"/>
</div>
<label class="col-sm-2 control-label" for="englishName">艺名<span class="red">*</span></label>
<label class="col-sm-2 control-label" for="englishName">视频名称<span class="red">*</span></label>
<div class="col-sm-3">
<input type="text" value="[[englishName]]" class="form-control observe" id="englishName"
placeholder="艺名" data-field="englishName"/>
placeholder="视频名称" required="required" data-field="englishName"/>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="nationality">国籍</label>
<label class="col-sm-2 control-label" for="avatar">视频<span class="red">*</span></label>
<div class="col-sm-6">
<div class="cover-image-list col-sm-10">
<ul class="cover-image-list col-sm-10" id="addPic" style="padding: 0;margin: 0;">
<li class="cover-image-item fileinput-button">
<div class="goods-img">
<a class="fileinput-button-icon" href="javascript:void(0);">+</a>
<input type="file" class="goods-img-upload picfile" name="picfile" required="required" id="picfile" placeholder="图片" multiple="true">
<div class="col-sm-3">
<input type="text" value="[[nationality]]" class="form-control observe" id="nationality"
placeholder="国籍" data-field="nationality"/>
</div>
</li>
<span style="font-color:red">ps:只支持MP4格式</span>
</ul>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="height">身高<span class="red">*</span></label>
<div class="col-sm-3">
<input type="number" value="[[height]]" class="form-control observe" id="height"
match="numbers" placeholder="身高(cm)" data-field="height"/>
</div>
<label class="col-sm-2 control-label" for="weight">体重<span class="red">*</span></label>
<div class="col-sm-3">
<input type="number" value="[[weight]]" class="form-control observe" id="weight"
match="numbers" placeholder="体重(kg)" data-field="weight"/>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="dressSize">穿衣尺码</label>
<div class="col-sm-3">
<input type="text" value="[[dressSize]]" class="form-control observe" id="dressSize"
placeholder="穿衣尺码" data-field="dressSize"/>
</div>
<label class="col-sm-2 control-label" for="shoeSize">鞋码</label>
<div class="form-group">
<label class="col-sm-2 control-label" for="englishName">关联SKN<span class="red">*</span></label>
<div class="col-sm-3">
<input type="text" value="[[shoeSize]]" class="form-control observe" id="shoeSize"
placeholder="鞋码" data-field="shoeSize"/>
<input type="text" value="[[englishName]]" class="form-control observe" id="englishName"
placeholder="关联SKN" required="required" data-field="englishName"/>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">三围<span class="red">*</span></label>
<label class="col-sm-2 control-label" for="englishName">备注<span class="red">*</span></label>
<div class="col-sm-3">
<input type="number" value="[[Bust]]" class="form-control observe" id="Bust"
match="numbers" placeholder="胸围(cm)" data-field="Bust"/>
</div>
<div class="col-sm-3">
<input type="number" value="[[waist]]" class="form-control observe" id="waist"
match="numbers" placeholder="腰围(cm)" data-field="waist"/>
</div>
<div class="col-sm-3">
<input type="number" value="[[hips]]" class="form-control observe" id="hips"
match="numbers" placeholder="臀围(cm)" data-field="hips"/>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="avatar">模特卡</label>
[[if modelCard]]
<div class="col-sm-6">
<div class="goods-img">
<a class="fileinput-button-icon" href="javascript:void(0);">
<img src="[[modelCard]]?imageView/2/w/100/h/100">
</a>
<i class="remove-item-btn remove1 glyphicon glyphicon-remove-circle" data-link="modelCard"></i>
</div>
</div>
[[else]]
<div class="col-sm-6">
<input type="file" bucket="modelCard" class="form-control modelCard" id="modelCard" name="modelCard"
placeholder="模特卡" data-field="modelCard"/>
</div>
[[/if]]
</div>
<div class="form-group">
<label class="col-sm-2 control-label">状态</label>
<div class="col-sm-8">
<label style="cursor: pointer;"><input type="radio" name="status" class="observe" data-field="status"
checked value="1">启用</label>
<label style="cursor: pointer;"><input type="radio" name="status" class="observe" data-field="status"
value="0">禁用</label>
<input type="text" value="[[englishName]]" class="form-control observe" id="englishName"
placeholder="备注" required="required" data-field="englishName"/>
</div>
<input type="hidden" id="status" class="observe" value="[[status]]" for="radio" class="observe"
data-field="status">
</div>
</div>
</script>
... ...
... ... @@ -55,39 +55,16 @@ var g = new common.grid({
g.init("/video/queryVideosList");
//
var Bll = {
pictureBoList: [],
selectedBoId: [],
clonePics: [],
//重新渲染图片列表
rendBoList: function (pictureBoList) {
$(".image-list").html('');
$("#addPic").prepend(common.util.__template2($("#template2").html(),
{
pictureBoList: pictureBoList
}
));
},
//获取编辑时新增的图片
getNewPics: function (pictureBoList) {
var newPic = [];
if (pictureBoList.length > 0) {
for (var i = 0; i < pictureBoList.length; i++) {
if (!pictureBoList[i].id) {
newPic.push(pictureBoList[i])
}
}
}
return newPic
},
//模态
toast: function (url, item, datacall) {
Bll.pictureBoList = item.pictureBoList || [];
Bll.selectedBoId = [];
var a = new common.dialog({
title: "图片",
width: '80%',
content: common.util.__template2($("#template1").html(), item),
title: "添加视频",
width: '50%',
content: common.util.__template2($("#template").html(), item),
button: [
{
value: "提交", callback: function () {
... ... @@ -122,20 +99,22 @@ var Bll = {
}
]
});
Bll.rendBoList(Bll.pictureBoList);
/*Bll.rendBoList(Bll.pictureBoList);*/
common.edit.ajaxfileupload(".picfile", {
params: {
__type: "upload",
bucket: "goodsimg"
__type: "import-video",
bucket: "goodsvideo"
},
valid_extensions: ['png', 'jpg', 'jpeg'],
valid_extensions: ['mp4'],
onComplete: function (response) {
console.log("批量接口返回数据",response);
if (response.status && response.code == 200) {
for (var i = 0; i < response.datas.length; i++) {
alert(" 上传成功")
/*for (var i = 0; i < response.datas.length; i++) {
var name = response.names[i];
var index = name.indexOf('.');
var name1 = name.substr(0, index);
//判断图片名称是否符合标准
//判断图片名称是否符合标准
if ((/^[0-9]+[_][0-9]+$/).test(name1) || (/^[1-9]\d*$/).test(name1)) {
Bll.pictureBoList.push({
"fileName": response.datas[i],
... ... @@ -150,7 +129,7 @@ var Bll = {
common.util.__tip("图片应以sku命名", "warning");
}
}
Bll.rendBoList(Bll.clonePics);
Bll.rendBoList(Bll.clonePics);*/
}
else {
common.util.__tip(response.message, 'warning');
... ... @@ -159,54 +138,26 @@ var Bll = {
});
}
};
//上传图片--点击事件
$('#upload-btn').on('click', function () {
//添加
$('#addVideo').on('click', function () {
var item = {
__state: "add"
"__state": "add",
'englishName': "",//英文名
'height': "",//身高
'dressSize': "",//穿衣尺码
'modelName': "",//名称
'modelType': 1,//模特类型:1 拍摄模特 2 试穿模特
'nationality': "",//国籍
'status': 1,//模特状态:0 禁用 1 启用
'shoeSize': "",//鞋尺码
'vitalStatistics': "",//三围
"Bust": "",//胸围
"waist": "",//腰围
"hips": "",//臀围
'weight': "",//体重
'avatar': "",//头像
'modelCard': ""//模特卡
};
Bll.clonePics = [];
Bll.toast('/shotManage/proPhoto/add', item, function (pictureBoList, selectedBoId) {
return {
productPhotoAddStrList: JSON.stringify(pictureBoList)
}
});
Bll.toast('/shotManage/model/addModel', item, "添加视频");
});
\ No newline at end of file
/*下拉选择*/
new common.dropDown({
el: "#shopId",
ajax: "queryShopPass",
hash: true
});
//编辑
$(document).on('click', '.update', function () {
var item = g.rows[$(this).data("index")];
item.__state = "update";
Bll.clonePics = [];
Array.prototype.push.apply(Bll.clonePics, item.pictureBoList);
Bll.toast('/shotManage/proPhoto/add', item, function (pictureBoList, selectedBoId) {
return {
productSkn: item.productSkn,
ids: JSON.stringify(selectedBoId),
productPhotoAddStrList: JSON.stringify(pictureBoList)
}
});
});
//删除单张图片
$(document).on('click', '.remove1', function () {
var index = $(this).data("index");
if (Bll.clonePics[index].id) {
Bll.selectedBoId.push(Bll.clonePics[index].id);
}
Bll.clonePics.splice(index, 1);
Bll.rendBoList(Bll.clonePics);
});
//查询按钮--点击事件
$(document).on('click', '#filter-btn', function () {
g.reload(1);
});
... ...