提交 482821f9 编写于 作者: R root

fecshop admin product image upload sections

上级 a212faab
<?php
/**
* FecShop file.
*
* @link http://www.fecshop.com/
* @copyright Copyright (c) 2016 FecShop Software LLC
* @license http://www.fecshop.com/license/
*/
namespace fecshop\app\appadmin\modules\Catalog\block\productinfo;
use Yii;
use yii\base\InvalidValueException;
use fecshop\app\appadmin\modules\AppadminbaseBlock;
use fec\helpers\CUrl;
use fecshop\app\appadmin\interfaces\base\AppadminbaseBlockInterface;
/**
* block cms\article
* @author Terry Zhao <2358269014@qq.com>
* @since 1.0
*/
class Imageupload
{
public function upload(){
if(empty($_FILES)) {
throw new InvalidValueException('$_FILES is empty.');
}
$index = 0; //$_FILES 以文件name为数组下标,不适用foreach($_FILES as $index=>$file)
$post = Yii::$app->request->post();
if($post['thisindex']){
$rel_index = $post['thisindex'];
}else{
$rel_index = $index ;
}
$img_str = "";
foreach($_FILES as $FILE){
$saveImgInfo = Yii::$service->product->image->saveProductUploadImg($FILE);
$rel_index++;
if(is_array($saveImgInfo) && !empty($saveImgInfo) ){
list($imgSavedRelativePath,$imgUrl) = $saveImgInfo;
$img_str .='<tr class="p_img" rel="'.$rel_index.'" style="border-bottom:1px solid #ccc;">
<td style="width:120px;text-align:center;"><img rel="'.$imgSavedRelativePath.'" style="width:100px;height:100px;" src="'.$imgUrl.'"></td>
<td style="width:220px;text-align:center;"><input style="height:10px;width:200px;" type="text" class="image_label" name="image_label" /></td>
<td style="width:220px;text-align:center;"><input style="height:10px;width:200px;" type="text" class="sort_order" name="sort_order" /></td>
<td style="width:30px;text-align:center;"><input type="radio" name="image" value="'.$imgSavedRelativePath.'" /></td>
<td style="padding:0 0 0 20px;"><a class="delete_img btnDel" href="javascript:void(0)">删除</a></td>
</tr>';
}
$index++;
}
echo json_encode(array(
"return_status" => "success",
"img_str"=>$img_str,
));
}
}
......@@ -47,12 +47,13 @@ class Manageredit extends AppadminbaseBlockEdit implements AppadminbaseBlockEdi
public function getLastData(){
return [
'baseInfo' => $this->getBaseInfo(),
'metaInfo' => $this->getMetaInfo(),
'groupAttr'=> $this->getGroupAttr(),
'baseInfo' => $this->getBaseInfo(),
'metaInfo' => $this->getMetaInfo(),
'groupAttr' => $this->getGroupAttr(),
'descriptionInfo' => $this->getDescriptionInfo(),
'attrGroup' => $this->_attr->getProductAttrGroupSelect(),
'primaryInfo' => $this->getCurrentProductPrimay(),
'attrGroup' => $this->_attr->getProductAttrGroupSelect(),
'primaryInfo' => $this->getCurrentProductPrimay(),
'img_html' => $this->getImgHtml(),
//'editBar' => $this->getEditBar(),
//'textareas' => $this->_textareas,
//'lang_attr' => $this->_lang_attr,
......@@ -103,6 +104,66 @@ class Manageredit extends AppadminbaseBlockEdit implements AppadminbaseBlockEdi
}
public function getImgHtml(){
$main_image = [
'image' => '/2/14/21471340924755.jpg',
'label' => 'xxxx',
'sort_order'=> 1,
];
$gallery_image = [
[
'image' => '/1/6/16.jpg',
'label' => 'xxxx',
'sort_order'=> 5,
],
[
'image' => '/3/14/31471340924495.jpg',
'label' => 'yyy',
'sort_order'=> 6,
]
];
$str =
'<div>
<table class="list productimg" width="100%" >
<thead>
<tr>
<td>图片</td>
<td>label</td>
<td>sort_order</td>
<td>主图</td>
<td>删除</td>
</tr>
</thead>
<tbody>
<tr class="p_img" rel="1" style="border-bottom:1px solid #ccc;">
<td style="width:120px;text-align:center;"><img rel="'.$main_image['image'].'" style="width:100px;height:100px;" src="'.Yii::$service->product->image->getUrl($main_image['image']).'"></td>
<td style="width:220px;text-align:center;"><input style="height:10px;width:200px;" type="text" class="image_label" name="image_label" value="'.$main_image['label'].'" /></td>
<td style="width:220px;text-align:center;"><input style="height:10px;width:200px;" type="text" class="sort_order" name="sort_order" value="'.$main_image['sort_order'].'" /></td>
<td style="width:30px;text-align:center;"><input type="radio" name="image" checked value="'.$main_image['image'].'" /></td>
<td style="padding:0 0 0 20px;"><a class="delete_img btnDel" href="javascript:void(0)">删除</a></td>
</tr>';
if(!empty($gallery_image) && is_array($gallery_image)){
$i=2;
foreach($gallery_image as $gallery){
$str .='<tr class="p_img" rel="'.$i.'" style="border-bottom:1px solid #ccc;">
<td style="width:120px;text-align:center;"><img rel="'.$gallery['image'].'" style="width:100px;height:100px;" src="'.Yii::$service->product->image->getUrl($gallery['image']).'"></td>
<td style="width:220px;text-align:center;"><input style="height:10px;width:200px;" type="text" class="image_label" name="image_label" value="'.$gallery['label'].'" /></td>
<td style="width:220px;text-align:center;"><input style="height:10px;width:200px;" type="text" class="sort_order" name="sort_order" value="'.$gallery['sort_order'].'" /></td>
<td style="width:30px;text-align:center;"><input type="radio" name="image" value="'.$gallery['image'].'" /></td>
<td style="padding:0 0 0 20px;"><a class="delete_img btnDel" href="javascript:void(0)">删除</a></td>
</tr>';
$i++;
}
}
$str .= '</tbody>
</table>
</div>';
return $str;
}
public function getEditArr(){
......
......@@ -35,6 +35,11 @@ class ProductinfoController extends CatalogController
$data = $this->getBlock('manageredit')->save();
return $this->render($this->action->id,$data);
}
# catalog
public function actionImageupload(){
$this->getBlock()->upload();
}
public function actionRemove()
......
......@@ -45,10 +45,20 @@ $(document).ready(function(){
});
function thissubmit(thiss){
main_image_image = $('.productimg input:checked').val();
main_image_label = $('.productimg input:checked').parent().parent().find(".image_label").val();
main_image_sort_order = $('.productimg input:checked').parent().parent().find(".sort_order").val();
alert(main_image_image+main_image_label+main_image_sort_order);
return validateCallback(thiss, dialogAjaxDoneCloseAndReflush);
}
</script>
<div class="pageContent">
<form method="post" action="<?= $saveUrl ?>" class="pageForm required-validate" onsubmit="return validateCallback(this, dialogAjaxDoneCloseAndReflush);">
<form method="post" action="<?= $saveUrl ?>" class="pageForm required-validate" onsubmit="return thissubmit(this, dialogAjaxDoneCloseAndReflush);">
<?php echo CRequest::getCsrfInputHtml(); ?>
<input type="hidden" class="primary_info" value="<?= $primaryInfo ?>" />
<div class="tabs" >
......@@ -88,12 +98,91 @@ $(document).ready(function(){
<div ><?= $descriptionInfo ?>
</div>
<div >
<input type="hidden" name="image_main" class="image_main" />
<input type="hidden" name="image_gallery" class="image_gallery" />
<?= $img_html ?>
<div id="addpicContainer">
<!-- 利用multiple="multiple"属性实现添加多图功能 -->
<!-- position: absolute;left: 10px;top: 5px;只针对本用例将input隐至图片底下。-->
<!-- height:0;width:0;z-index: -1;是为了隐藏input,因为Chrome下不能使用display:none,否则无法添加文件 -->
<!-- onclick="getElementById('inputfile').click()" 点击图片时则点击添加文件按钮 -->
<button style="" onclick="getElementById('inputfile').click()" class="scalable" type="button" title="Duplicate" id=""><span><span><span>Browse Files</span></span></span></button>
<input type="file" multiple="multiple" id="inputfile" style="height:0;width:0;z-index: -1; position: absolute;left: 10px;top: 5px;"/>
<span class="loading"></span>
</div>
<script>
jQuery(document).ready(function(){
jQuery("body").on('click',".delete_img",function(){
jQuery(this).parent().parent().remove();
});
//jQuery(".delete_img").click(function(){
// jQuery
//});
//响应文件添加成功事件
$("#inputfile").change(function(){
//创建FormData对象
var thisindex = 0;
jQuery(".productimg tbody tr").each(function(){
rel = parseInt(jQuery(this).attr("rel"));
//alert(rel);
if(rel > thisindex){
thisindex = rel;
}
});
//alert(thisindex);
var data = new FormData();
data.append('thisindex', thisindex);
//为FormData对象添加数据
$.each($('#inputfile')[0].files, function(i, file) {
data.append('upload_file'+i, file);
});
//$(".loading").show(); //显示加载图片
//发送数据
$.ajax({
url:'<?= CUrl::getUrl('catalog/productinfo/imageupload') ?>',
type:'POST',
data:data,
async:false,
dataType: 'json',
timeout: 80000,
cache: false,
contentType: false, //不可缺参数
processData: false, //不可缺参数
success:function(data, textStatus){
//data = $(data).html();
//第一个feedback数据直接append,其他的用before第1个( .eq(0).before() )放至最前面。
//data.replace(/&lt;/g,'<').replace(/&gt;/g,'>') 转换html标签,否则图片无法显示。
//if($("#feedback").children('img').length == 0) $("#feedback").append(data.replace(/&lt;/g,'<').replace(/&gt;/g,'>'));
//else $("#feedback").children('img').eq(0).before(data.replace(/&lt;/g,'<').replace(/&gt;/g,'>'));
// alert(data.return_status);
if(data.return_status == "success"){
// alert("success");
jQuery(".productimg tbody ").append(data.img_str);
//alert(data.img_str);
}
//$(".loading").hide(); //加载成功移除加载图片
},
error:function(){
alert('上传出错');
//$(".loading").hide(); //加载失败移除加载图片
}
});
});
});
</script>
</div>
<div >
</div>
<div ><?= $groupAttr ?>
</div>
......
......@@ -71,8 +71,11 @@ return [
# 子服务
'childService' => [
'image' => [
'class' => 'fecshop\services\product\Image',
'imageFloder' => 'media/catalog/product',
'class' => 'fecshop\services\product\Image',
'imageFloder' => 'media/catalog/product',
//'allowImgType' => ['image/jpeg','image/gif','image/png'],
'maxUploadMSize'=> 5, #MB
],
'price' => [
'class' => 'fecshop\services\product\Price',
......
......@@ -27,9 +27,9 @@ class Image extends Service
if($appbase = $this->appbase){
if(isset($appbase[$app]['basedir'])){
if($str){
return $appbase[$app]['basedir'].'/'.$str;
return Yii::getAlias($appbase[$app]['basedir'].'/'.$str);
}
return $appbase[$app]['basedir'];
return Yii::getAlias($appbase[$app]['basedir']);
}
}
}
......
......@@ -21,7 +21,7 @@ class Image extends Service
/**
* absolute image save floder
*/
public $imageFloder;
public $imageFloder = 'media/catalog/product';
/**
* upload image max size
*/
......@@ -29,38 +29,50 @@ class Image extends Service
/**
* allow image type
*/
public $allowImgType;
public $allowImgType = [
'image/jpeg',
'image/gif',
'image/png',
'image/jpg',
'image/pjpeg',
];
protected $_maxUploadSize;
/**
* curent max upload size
* 得到上传图片的最大的size
*/
private $_maxUploadSize;
/**
* image absolute floder that can save product image,
* example:/www/web/fecshop/appadmin/web/media/catalog/product
*/
private $_imageBaseFloder;
protected function actionGetMaxUploadSize(){
if(!$this->_maxUploadSize){
if($this->maxUploadMSize){
$this->_maxUploadSize = $this->maxUploadMSize * 1024 * 1024;
}
}
return $this->_maxUploadSize;
}
/**
* image absolute url that product image saved,
* example:http://www.fecshop.com/media/catalog/product
* 得到保存产品图片所在相对根目录的url路径
*/
private $_imageBaseUrl;
protected function actionGetBaseUrl(){
return Yii::$service->image->GetImgUrl($this->imageFloder,'common');
}
/**
* default allowed image type ,if not set allowImgType in config file ,this value will be effective.
* 得到保存产品图片所在相对根目录的文件夹路径
*/
private $_defaultAllowImgType = ['image/jpeg','image/gif','image/png'];
protected function actionGetBaseFloder(){
return Yii::$service->image->GetImgDir($this->imageFloder,'common');
}
/**
* default allow image upload size (MB) ,if not set maxUploadMSize in config file ,this value will be effective.
* 通过产品图片的相对路径得到产品图片的url
*/
private $_defaultMaxUploadMSize = 2; #mb
protected function actionGetUrl($str){
return Yii::$service->image->GetImgUrl($this->imageFloder.$str,'common');
}
/**
* default relative image save floder ,if not set imageFloder in config file ,this value will be effective.
* 通过产品图片的相对路径得到产品图片的绝对路径
*/
private $_defaultImageFloder = 'media/catalog/product';
//private $_image
protected function actionGetFilePath(){
return Yii::$service->image->GetImgDir($this->imageFloder.$str,'common');
}
/**
......@@ -70,99 +82,34 @@ class Image extends Service
* return , if success ,return image saved relative file path , like '/b/i/big.jpg'
* if fail, reutrn false;
*/
protected function actionSaveProductUploadImg($param_img_file){
$this->initUploadImage();
$size = $param_img_file['size'];
$file = $param_img_file['tmp_name'];
$name = $param_img_file['name'];
if($size > $this->_maxUploadSize){
throw new InvalidValueException('upload image is to max than '.($this->maxUploadSize/(1024*1024)));
protected function actionSaveProductUploadImg($FILE){
$size = $FILE['size'];
$file = $FILE['tmp_name'];
$name = $FILE['name'];
if($size > $this->getMaxUploadSize()){
throw new InvalidValueException('upload image is to max than'. $this->maxUploadMSize.' MB');
}else if(!($img = getimagesize($file))){
throw new InvalidValueException('file type is empty.');
}else if($img = getimagesize($file)){
$imgType = $img['mime'];
if(in_array($imgType,$this->allowImgType)){
}else{
if(!in_array($imgType,$this->allowImgType)){
throw new InvalidValueException('image type is not allow for '.$imgType);
}
}
// process image name.
$imgSavedRelativePath = $this->getImgSavedRelativePath($name);
$isMoved = @move_uploaded_file ( $file, $this->getImageBaseFloder().$imgSavedRelativePath);
$isMoved = @move_uploaded_file ( $file, $this->getBaseFloder().$imgSavedRelativePath);
if($isMoved){
return $imgSavedRelativePath;
$imgUrl = $this->getUrl($imgSavedRelativePath);
$imgPath = $this->getFilePath($imgSavedRelativePath);
return [$imgSavedRelativePath,$imgUrl,$imgPath];
}
return false;
}
protected function resize($imgPath,$width='',$height=''){
}
/**
* init Object property.
*/
protected function initUploadImage(){
if(!$this->allowImgType){
$this->allowImgType = $this->_defaultAllowImgType;
}
if(!$this->_maxUploadSize){
if($this->maxUploadMSize){
$this->_maxUploadSize = $this->maxUploadMSize * 1024 * 1024;
}else{
$this->_maxUploadSize = $this->_defaultMaxUploadMSize * 1024 * 1024;
}
}
$this->getImageFloder();
}
/**
* Get relative Floder that product image saved.
*/
protected function getImageFloder(){
if(!$this->imageFloder){
$this->imageFloder = $this->_defaultImageFloder;
}
}
/**
* Get absolute Floder that product image saved.
*/
protected function getImageBaseFloder(){
if(!$this->_imageBaseFloder){
if(!$this->imageFloder)
$this->getImageFloder();
$this->_imageBaseFloder = Yii::getAlias("@webroot").'/'. $this->imageFloder;
}
return $this->_imageBaseFloder;
}
/**
* Get Image base url string that product image saved floder.
*/
protected function getImageBaseUrl(){
if(!$this->_imageBaseUrl){
if(!$this->imageFloder)
$this->getImageFloder();
$this->_imageBaseUrl = Yii::$app->homeUrl.'/'. $this->imageFloder;
}
return $this->_imageBaseUrl;
}
/**
* get Image save file path, if floder is not exist, this function will create floder.
* if image file is exsit , image file name will be change to a not existed file name( by add radom string to file name ).
......@@ -179,7 +126,7 @@ class Image extends Service
$first_str = substr($imgName,0,1);
$two_str = substr($imgName,1,2);
$imgSaveFloder = CDir::createFloder($this->getImageBaseFloder(),[$first_str,$two_str]);
$imgSaveFloder = CDir::createFloder($this->getBaseFloder(),[$first_str,$two_str]);
if($imgSaveFloder){
$imgName = $this->getUniqueImgNameInPath($imgSaveFloder,$imgName,$imgType);
$relative_floder = '/'.$first_str.'/'.$two_str.'/';
......@@ -201,7 +148,7 @@ class Image extends Service
if(!file_exists($imagePath)){
return $name.$randStr.'.'.$imageType;;
}else{
$randStr = time().rand(100,999);
$randStr = time().rand(10000,99999);
return $this->getUniqueImgNameInPath($imgSaveFloder,$name,$imageType,$randStr);
}
}
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册