Skip to content

C
chinafrica
提交 f8f954fa authored 作者: zgy's avatar zgy
浏览文件
操作

同步

上级 1197e3ad
隐藏空白字符变更
内嵌 并排
正在显示 包含 221 行增加 和 35 行删除
platform-admin/src/main/java/com/platform/service/impl/TbCfStationItemServiceImpl.java
浏览文件 @ f8f954fa
......@@ -124,6 +124,7 @@ public class TbCfStationItemServiceImpl implements TbCfStationItemService {
tbCfStationItem.setItemDescritionId(itemSkus.getItemDescritionId());
tbCfStationItem.setItemTop("N");
tbCfStationItem.setItemImg(itemSkus.getItemImg());
tbCfStationItem.setSkuImgs(itemSkus.getSkuImgs());
tbCfStationItem.setEnableFlag(2);
if (itemSkus.isPutaway()) {
tbCfStationItem.setEnableFlag(1);
......@@ -250,6 +251,7 @@ public class TbCfStationItemServiceImpl implements TbCfStationItemService {
tbCfStationItem.setItemLabel(itemSkus.getItemLabel());
tbCfStationItem.setItemDescritionId(itemSkus.getItemDescritionId());
tbCfStationItem.setItemImg(itemSkus.getItemImg());
tbCfStationItem.setSkuImgs(itemSkus.getSkuImgs());
if (itemSkus.isPutaway()) {
tbCfStationItem.setEnableFlag(1);
}
......
platform-admin/src/main/resources/com/platform/dao/TbCfStationItemDao.xml
浏览文件 @ f8f954fa
......@@ -22,6 +22,7 @@
<result property="itemSku" column="item_sku"/>
<result property="itemTop" column="item_top"/>
<result property="supplier" column="supplier"/>
<result property="skuImgs" column="sku_imgs"/>
<result property="platformCode" column="platform_code"/>
<result property="platformName" column="platform_name"/>
<result property="enableFlag" column="enable_flag"/>
......@@ -50,6 +51,7 @@
`item_sku`,
`item_top`,
`supplier`,
`sku_imgs`,
`platform_code`,
`platform_name`,
`enable_flag`,
......@@ -80,6 +82,7 @@
`item_sku`,
`item_top`,
`supplier`,
`sku_imgs`,
`platform_code`,
`platform_name`,
`enable_flag`,
......@@ -127,6 +130,7 @@
i.item_descrition_id,
i.item_top,
i.supplier,
i.sku_imgs,
i.creator,
d.descripition_name dname,
t.goodstwotype_title title,
......@@ -239,6 +243,7 @@
`item_sku`,
`item_top`,
`supplier`,
`sku_imgs`,
`platform_code`,
`platform_name`,
`enable_flag`,
......@@ -265,6 +270,7 @@
#{itemSku},
#{itemTop},
#{supplier},
#{skuImgs},
#{platformCode},
#{platformName},
#{enableFlag},
......@@ -294,6 +300,7 @@
<if test="itemSku != null">`item_sku` = #{itemSku},</if>
<if test="itemTop != null">`item_top` = #{itemTop},</if>
<if test="supplier != null">`supplier` = #{supplier},</if>
<if test="skuImgs != null">`sku_imgs` = #{skuImgs}, </if>
<if test="platformCode != null">`platform_code` = #{platformCode},</if>
<if test="platformName != null">`platform_name` = #{platformName},</if>
<if test="enableFlag != null">`enable_flag` = #{enableFlag},</if>
......
platform-admin/src/main/webapp/WEB-INF/page/sys/tbcfstationitem.html
浏览文件 @ f8f954fa
......@@ -83,6 +83,7 @@
.container .prev-li {
display: flex;
justify-content: start;
margin-bottom: 10px;
}
.ivu-tag {
......@@ -275,6 +276,88 @@
cursor: pointer;
color: black;
}
.attribute-img-container{
position: fixed;
width:100%;
height: 100%;
left:0;
top:0;
z-index: 1000;
cursor: unset;
}
.attribute-img-container > .attribute-img-mask{
position: absolute;
top:0;
left:0;
width:100%;
height:100%;
background: rgba(0,0,0,0.5);
}
.attribute-img-wrapper{
position: absolute;
top:50%;
left:50%;
transform: translate(-50%,-50%);
width:1000px;
height:700px;
background: white;
border-radius: 4px;
}
.attribute-img-wrapper-close{
position: absolute;
right:20px;
top:10px;
line-height: 22px;
color:black;
font-size: 22px;
cursor: pointer;
}
.attribute-img-upload{
position: absolute;
bottom:0px;
left:0px;
width:100%;
height:80px;
}
.attribute-img-lists{
padding:10px;
display: flex;
justify-content: flex-start;
}
.attribute-img{
width:200px;
height:200px;
position: relative;
display: flex;
justify-content: center;
align-items: center;
}
.attribute-img>.attribute-img-remove-icon{
width:40px;
height:20px;
position: absolute;
right:20px;
top:0;
cursor: pointer;
display: flex;
justify-content: space-between;
z-index: 10;
}
.attribute-img>img{
z-index: 9;
width:80%;
height:80%;
object-fit: cover;
}
.default-img{
width:42px;
height:42px;
background: url('http://ku.90sjimg.com/element_origin_min_pic/01/47/26/835743e2ba5da85.jpg') no-repeat;
background-size: 100% 100%;
cursor: pointer;
}
</style>
</head>
<body>
......@@ -572,17 +655,51 @@
@click="addAttr"
>新增属性
</i-button>
<i-button
style="margin-left:10px;margin-bottom:10px;margin-top:10px;"
@click.stop="isShowAttributeContainer(true)"
>属性图片
</i-button>
<div class="attribute-img-container" v-show="showAttributeImg">
<div class="attribute-img-mask"></div>
<div class="attribute-img-wrapper">
<i class="attribute-img-wrapper-close" @click.stop="isShowAttributeContainer(false)">x</i>
<div class="attribute-img-lists">
<div class="attribute-img" v-for="(element,index) in AttributeImgArr">
<div class="attribute-img-remove-icon">
<Icon size="20" type="ios-eye-outline" ></Icon>
<Icon size="20" type="ios-trash-outline" @click="removeAttributeImg(element,index)"></Icon>
</div>
<img :src="element" @click="selectImg(element)">
</div>
</div>
<div class="attribute-img-upload">
<Upload
multiple
type="drag"
:before-upload="handleBeforeUpload"
accept="image/jpeg, image/png"
action="../api/osstest/uploadtest"
:on-success="handleAttributeImgSuccess"
>
<div style="padding: 20px 0">
<Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>
<p>点击或将文件拖拽到这里上传</p>
</div>
</Upload>
</div>
</div>
</div>
<!-- 预览 -->
<section class="form-prev">
<h4>预览</h4>
<transition-group tag="ul" name="slide">
<li class="prev-li" v-for="(el,i) in prevItem" :key="i">
<div class="prev-picture">
<spn>图片</spn>
<i-input size="small" type="file" @change="tirggerFile($event)"/>
<div>
<img v-bind:src="el.skuImg" style="width:50px;height:50px;"/>
</div>
<div class="prev-attr">
<img @click="HandleSelectAttributeImg(el,i)" width="42" height="42" :src="el.skuImg" v-if="el.skuImg" />
<div @click="HandleSelectAttributeImg(el,i)" class="default-img" v-else ></div>
</div>
<div class="prev-attr">
<span>{{el.skuName}}</span>
......
platform-admin/src/main/webapp/js/sys/tbcfstationitem.js
浏览文件 @ f8f954fa
......@@ -75,11 +75,54 @@ let vm = new Vue({
tagLists: [],//标签列表
subtaglist: [],//子便签
tagshow: false,
isSelectedArr: [] //选中标签的数组
isSelectedArr: [], //选中标签的数组
//2020年4月9日
showAttributeImg:false, //显示属性图片模态框
AttributeImgArr:[],
skuListsIndex:null,//sku选中索引
},
methods: {
selectImg(url){
// console.log(this.prevItem[this.skuListsIndex]);
this.prevItem[this.skuListsIndex].skuImg = url;
this.$forceUpdate();
this.showAttributeImg = false;
},
//单条sku选择图片
HandleSelectAttributeImg(e,i){
this.showAttributeImg = true;
this.skuListsIndex = i;
},
//删除属性图片
removeAttributeImg(e,i){
this.$delete(this.AttributeImgArr,i);
this.delAttributeImg(e);
},
//删除图片
delAttributeImg(url){
Ajax.request({
url: "../api/upload/delFile?url=" + url,
async: false,
type: "POST",
contentType: "application/json",
successCallback: function (resultData) {
// console.log(resultData);
iview.Message.success(resultData.success);
}
});
},
//处理属性图片上传成功回调
handleAttributeImgSuccess(e){
this.AttributeImgArr.push(e);
console.log(e);
// this.delAttributeImg(e);
},
//控制属性图片模块框
isShowAttributeContainer(Bool){
this.showAttributeImg = Bool;
},
//获取二级分类
changeGoodstype() {
let url = "../tbcfstationitem/queryByItemType?typeId=" + this.tbCfStationItem.itemCategory;
......@@ -230,6 +273,7 @@ let vm = new Vue({
_this.tmdSkudata = r.tbCfStationItem.itemSkusList
r.tbCfStationItem.itemSkusList.map(item => {
_this.prevItem.push({
skuImg:null,
skuName: item.skuName,
skuDesc: item.skuDesc,
skuPrice: item.skuPrice,
......@@ -323,31 +367,31 @@ let vm = new Vue({
handleResetForm(this, name);
},
tirggerFile : function (event) {
var file = event.target.files[0]; // (利用console.log输出看file文件对象)
var formData = new FormData();
formData.append("file", file);
$.ajax({
url: "../tbcfstationitem/image/",
type: "POST",
data: formData,
cache: false, //不设置缓存
processData: false, // 不处理数据
contentType: false,// 不设置内容类型
success: function (result) {
result = JSON.parse(result);
console.log(result)
if (result.errno == 0) {//成功
console.log(123,result)
vm.tbCfStationItem.item.skuImg = result.data;
console.log(vm.tbCfStationItem.item.skuImg)
vm.$forceUpdate();
} else {
iview.Message.error(result.errmsg);
}
}
});
},
// tirggerFile : function (event) {
// var file = event.target.files[0]; // (利用console.log输出看file文件对象)
// var formData = new FormData();
// formData.append("file", file);
// $.ajax({
// url: "../tbcfstationitem/image/",
// type: "POST",
// data: formData,
// cache: false, //不设置缓存
// processData: false, // 不处理数据
// contentType: false,// 不设置内容类型
// success: function (result) {
// result = JSON.parse(result);
// console.log(result)
// if (result.errno == 0) {//成功
// console.log(123,result)
// vm.tbCfStationItem.item.skuImg = result.data;
// console.log(vm.tbCfStationItem.item.skuImg)
// vm.$forceUpdate();
// } else {
// iview.Message.error(result.errmsg);
// }
// }
// });
// },
/** ******************************************************************************************** */
handleSuccess(response, file, fileList) {
......@@ -487,7 +531,7 @@ let vm = new Vue({
return result.map(arr => arr.join('/'))
}
this.prevItem = []
// this.prevItem = [];
let contentArr = [] // 属性通过','分割后的数组
this.attrItem.map(item => {
let formatter = []
......@@ -503,15 +547,31 @@ let vm = new Vue({
skuName += item_a.name + '/'
skuArr.push(item_a.size)
})
skuName = skuName.slice(0, skuName.length - 1)
skuName = skuName.slice(0, skuName.length - 1);
product(skuArr).forEach((item, index) => {
this.prevItem.push({
skuImg:null,
skuName: skuName,
skuDesc: item,
skuPrice: this.default_price,
skuCount: this.default_count
})
})
// var temp = [];
// let _this = this;
// function deWeightTwo() {
// _this.prevItem.forEach(function(a) {
// var check = temp.every(function(b) {
// return a.skuDesc !== b.skuDesc;
// })
// check ? temp.push(a) : ''
// })
// return temp;
// }
// var newArr2 = deWeightTwo();
// console.log('%c%s', 'color:red;', '方法二：es5,newArr2', newArr2);
//显示回显数据
if (this.tmdSkudata) {
this.prevItem.map(item => {
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论