Skip to content

S
shop-new
提交 92287de1 authored 作者: 王天霸's avatar 王天霸
浏览文件
操作

提测

上级 ae8bf0d5
隐藏空白字符变更
内嵌 并排
正在显示 包含 569 行增加 和 207 行删除
.env.development
浏览文件 @ 92287de1
...@@ -5,7 +5,8 @@ ENV = 'development' ...@@ -5,7 +5,8 @@ ENV = 'development'
#VUE_APP_BASE_API = 'http://sjapi.jxhh.com' #VUE_APP_BASE_API = 'http://sjapi.jxhh.com'
# 测试环境 # 测试环境
VUE_APP_BASE_API = 'http://192.168.26.179:6605/api/v1' #VUE_APP_BASE_API = 'http://192.168.26.179:6605/api/v1'
VUE_APP_BASE_API = 'http://192.168.111.240:6605/api/v1'
# 文档模块 直接调用 sys开放接口 # 文档模块 直接调用 sys开放接口
VUE_APP_BASE_SYS_API = 'http://sysapi.jxhh.com' VUE_APP_BASE_SYS_API = 'http://sysapi.jxhh.com'
......
src/api/module/goods.js
浏览文件 @ 92287de1
...@@ -9,6 +9,14 @@ export function listGoods(query) { ...@@ -9,6 +9,14 @@ export function listGoods(query) {
}) })
} }
// 上传视频
export function uploadVideo(data) {
return request({
url: '/system/goods/uploadVideo',
method: 'post',
data: data
})
}
// 查询类别 // 查询类别
export function GetCategory(query) { export function GetCategory(query) {
return request({ return request({
......
src/views/system/goods/add/components/goodsaftersale.vue
浏览文件 @ 92287de1
<template> <template>
<div class="goods-after-sale"> <div class="goods-after-sale">
<el-card class="box-card" ref="paramsvalue">
<div slot="header" class="clearfix">
<span>商品参数</span> <span style="font-size:13px;padding-left:20px;">参数名称/参数值</span>
</div>
<draggable :list="goodsAfterSaleForm.params" group="article" class="dragArea">
<div v-for="(element,index) in goodsAfterSaleForm.params" :key="index" class="list-complete-item">
<el-row :gutter="24" style="padding-left:50px;">
<el-col :span="8" style="height:50px;">
<el-input
type="text"
placeholder="参数名称"
v-model="element.title"
maxlength="15"
show-word-limit
></el-input>
</el-col>
<el-col :span="12" style="height:50px;">
<el-input
type="text"
placeholder="参数值"
v-model="element.value"
maxlength="60"
show-word-limit
></el-input>
</el-col>
<el-col :span="4" style="height:50px;">
<span style="height:50px;line-height: 40px;" @click="deleteparameter(index)">
<i style="color:#ff4949" class="el-icon-delete curspor" />
</span>
<i style="color:#ff4949" class="el-icon-rank curspor" />
</el-col>
</el-row>
</div>
</draggable>
<el-button style="margin-left:50px;margin-bottom:30px;" type="primary" @click="addparameter">添加参数</el-button>
</el-card>
<el-card class="box-card" ref="salesvalue">
<div slot="header" class="clearfix">
<span>售后及服务</span>
</div>
<el-form ref="goodsAfterSaleForm" :model="goodsAfterSaleForm" :rules="goodsAfterSaleRules" label-width="150px" size="small"> <el-form ref="goodsAfterSaleForm" :model="goodsAfterSaleForm" :rules="goodsAfterSaleRules" label-width="150px" size="small">
<el-form-item label="服务标签：" prop="stags"> <el-form-item label="服务标签：" prop="stags">
...@@ -31,11 +73,61 @@ ...@@ -31,11 +73,61 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
</el-card>
<el-card class="box-card" ref="outhervalue">
<div slot="header" class="clearfix" >
<span>其他设置</span>
</div>
<el-form :model="goodsAfterSaleForm" :rules="goodsAfterSaleRules" ref="goodsAfterSaleForm" label-width="150px" class="demo-goodsInfoForm" size="small">
<el-form-item label='商品关键词：' prop="goods_des">
<el-input v-model.trim="goodsAfterSaleForm.goods_des" placeholder="请输入商品关键词" style="width:420px;"></el-input>
<span class="tip-span ml20">关键词之间用 <strong>英文逗号</strong> 分开，最多可以添加5个</span>
</el-form-item>
<el-form-item label="商品产地：" prop="producing_area">
<el-select v-model.trim="goodsAfterSaleForm.producing_area" placeholder="请选择商品产地" style="width: 420px;">
<el-option
v-for="item in areaOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="商品发货地：" prop="deliver_area">
<el-select v-model.trim="goodsAfterSaleForm.deliver_area" placeholder="请选择商品发货地" style="width: 420px;">
<el-option
v-for="item in areaOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label='商品单位：' prop="unit">
<el-input v-model.trim="goodsAfterSaleForm.unit" placeholder="请输入商品单位" style="width:420px;"></el-input>
<!-- <span class="tip-span ml20">关键词之间用逗号分开，最多可以添加5个</span>-->
</el-form-item>
<el-form-item label='市场参考价链接：' prop="web_url">
<el-input v-model.trim="goodsAfterSaleForm.web_url" placeholder="请输入京东或者淘宝的商品链接" style="width:420px;"></el-input>
</el-form-item>
<el-form-item label='商品编码：' prop="out_goods_id">
<el-input v-model.trim="goodsAfterSaleForm.out_goods_id" placeholder="请输入商品编码（非必须）" style="width:420px;"></el-input>
</el-form-item>
</el-form>
</el-card>
</div> </div>
</template> </template>
<script> <script>
import { GetFreight } from '@/api/module/goods' import { GetFreight } from '@/api/module/goods'
import { getAreaList } from '@/api/module/retreat/address'
import draggable from 'vuedraggable'
export default { export default {
name: "goodsaftersale", name: "goodsaftersale",
props: { props: {
...@@ -53,17 +145,49 @@ ...@@ -53,17 +145,49 @@
} }
}; };
return { return {
areaOptions: [], // 地址 省
list:[
{
key:'1',
value:''
},{
key:'2',
value:''
},
{
key:'3',
value:''
},
{
key:'4',
value:''
},
{
key:'5',
value:''
}
],
goodsAfterSaleForm: { goodsAfterSaleForm: {
stags: [], stags: [],
freight_id: 310, freight_id: 310,
delay_compensate: 24, delay_compensate: 24,
aftersale_time: 7 aftersale_time: 7,
params:[],//参数
goods_des:'',//关键词
producing_area:'',//产地
deliver_area:'',//发货地
unit:'',//单位
web_url:'',//外部市场链接
out_goods_id:''//商品编码
}, },
goodsAfterSaleRules: { goodsAfterSaleRules: {
stags: [{required: true, validator: checkStags}], stags: [{required: true, validator: checkStags}],
freight_id: [{required: true, message: '请选择邮费模板', trigger: 'change'}], freight_id: [{required: true, message: '请选择邮费模板', trigger: 'change'}],
delay_compensate: [{required: true, message: '请选择发货时效', trigger: 'change'}], delay_compensate: [{required: true, message: '请选择发货时效', trigger: 'change'}],
aftersale_time: [{required: true, message: '请选择售后时长', trigger: 'change'}] aftersale_time: [{required: true, message: '请选择售后时长', trigger: 'change'}],
deliver_area: [{required: true, message: '请选择商品发货地', trigger: 'change'}],
unit: [{required: true, message: '商品单位不能为空', trigger: 'blur'}],
goods_brand: [{required: true, message: '请选择商品品牌', trigger: 'change'}]
}, },
tagOptions: [ tagOptions: [
{id: 2, tag: "假一赔十"}, {id: 2, tag: "假一赔十"},
...@@ -75,15 +199,44 @@ ...@@ -75,15 +199,44 @@
freightOptions: [] freightOptions: []
} // return end } // return end
}, },
components: { draggable },
mounted() { mounted() {
this.getFreightData(); this.getFreightData();
//debugger //debugger
//console.log('售后数据：',this.goodsaftersale); console.log('售后数据：',this.goodsaftersale);
if(this.goodsaftersale && this.goodsaftersale.stags.length > 0) { if(this.goodsaftersale) {
this.goodsAfterSaleForm = this.goodsaftersale; this.goodsAfterSaleForm = this.goodsaftersale;
} }
}, },
created() {
// 获取 省
this.getArea();
},
methods: { methods: {
// 获取 省
getArea() {
let limboNode = {
pid: 0
};
getAreaList(limboNode).then( res => {
if( res.data && res.data.length > 0) {
this.areaOptions = res.data;
}else {
this.areaOptions = [];
}
});
},
// 添加参数
addparameter(){
let obj = {
title:'',
value:''
}
this.goodsAfterSaleForm.params.push(obj)
},
deleteparameter(index){
this.list.splice(index, 1)
},
/** 售后服务数据 初始化 */ /** 售后服务数据 初始化 */
initInfo() { initInfo() {
this.$refs.goodsAfterSaleForm.resetFields(); this.$refs.goodsAfterSaleForm.resetFields();
...@@ -135,4 +288,13 @@ ...@@ -135,4 +288,13 @@
padding: 20px; padding: 20px;
margin-bottom:20px; margin-bottom:20px;
} }
.box-card{
margin-bottom: 50px;
}
.curspor{
font-size: 16px;
}
.curspor:hover{
cursor: pointer;
}
</style> </style>
src/views/system/goods/add/components/goodsinfomation.vue
浏览文件 @ 92287de1
...@@ -11,13 +11,11 @@ ...@@ -11,13 +11,11 @@
<el-input v-model.trim="goodsInfoForm.goods_name" placeholder="请输入商品标题" style="width:420px;"></el-input> <el-input v-model.trim="goodsInfoForm.goods_name" placeholder="请输入商品标题" style="width:420px;"></el-input>
<span class="tip-span ml20">商品名称限制在50字以内，不要填写与商品无关的词</span> <span class="tip-span ml20">商品名称限制在50字以内，不要填写与商品无关的词</span>
</el-form-item> </el-form-item>
<!-- <el-form-item label='商品关键词：' prop="goods_des">
<el-form-item label='商品关键词：' prop="goods_des">
<el-input v-model.trim="goodsInfoForm.goods_des" placeholder="请输入商品关键词" style="width:420px;"></el-input> <el-input v-model.trim="goodsInfoForm.goods_des" placeholder="请输入商品关键词" style="width:420px;"></el-input>
<span class="tip-span ml20">关键词之间用 <strong>英文逗号</strong> 分开，最多可以添加5个</span> <span class="tip-span ml20">关键词之间用 <strong>英文逗号</strong> 分开，最多可以添加5个</span>
</el-form-item> </el-form-item> -->
<!-- <el-form-item label="商品产地：" prop="producing_area">
<el-form-item label="商品产地：" prop="producing_area">
<el-select v-model.trim="goodsInfoForm.producing_area" placeholder="请选择商品产地" style="width: 420px;"> <el-select v-model.trim="goodsInfoForm.producing_area" placeholder="请选择商品产地" style="width: 420px;">
<el-option <el-option
v-for="item in areaOptions" v-for="item in areaOptions"
...@@ -26,9 +24,9 @@ ...@@ -26,9 +24,9 @@
:value="item.id" :value="item.id"
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item> -->
<el-form-item label="商品发货地：" prop="deliver_area"> <!-- <el-form-item label="商品发货地：" prop="deliver_area">
<el-select v-model.trim="goodsInfoForm.deliver_area" placeholder="请选择商品发货地" style="width: 420px;"> <el-select v-model.trim="goodsInfoForm.deliver_area" placeholder="请选择商品发货地" style="width: 420px;">
<el-option <el-option
v-for="item in areaOptions" v-for="item in areaOptions"
...@@ -37,13 +35,10 @@ ...@@ -37,13 +35,10 @@
:value="item.id" :value="item.id"
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item> -->
<!-- <el-form-item label='商品单位：' prop="unit">
<el-form-item label='商品单位：' prop="unit">
<el-input v-model.trim="goodsInfoForm.unit" placeholder="请输入商品单位" style="width:420px;"></el-input> <el-input v-model.trim="goodsInfoForm.unit" placeholder="请输入商品单位" style="width:420px;"></el-input>
<!-- <span class="tip-span ml20">关键词之间用逗号分开，最多可以添加5个</span>--> </el-form-item> -->
</el-form-item>
<el-form-item label="所属品牌：" prop="brand_id"> <el-form-item label="所属品牌：" prop="brand_id">
<el-select v-model.trim="goodsInfoForm.brand_id" placeholder="请选择商品品牌" style="width: 420px;"> <el-select v-model.trim="goodsInfoForm.brand_id" placeholder="请选择商品品牌" style="width: 420px;">
<el-option <el-option
...@@ -55,29 +50,45 @@ ...@@ -55,29 +50,45 @@
</el-select> </el-select>
<el-link class="edit-type-span el-icon-plus" type="primary" :underline="false" @click="toBrand">新增品牌</el-link> <el-link class="edit-type-span el-icon-plus" type="primary" :underline="false" @click="toBrand">新增品牌</el-link>
</el-form-item> </el-form-item>
<!-- <el-form-item label='市场参考价链接：' prop="web_url">
<el-form-item label='市场参考价链接：' prop="web_url">
<el-input v-model.trim="goodsInfoForm.web_url" placeholder="请输入京东或者淘宝的商品链接" style="width:420px;"></el-input> <el-input v-model.trim="goodsInfoForm.web_url" placeholder="请输入京东或者淘宝的商品链接" style="width:420px;"></el-input>
</el-form-item> </el-form-item> -->
<!-- <el-form-item label='商品编码：' prop="out_goods_id">
<el-form-item label='商品编码：' prop="out_goods_id">
<el-input v-model.trim="goodsInfoForm.out_goods_id" placeholder="请输入商品编码（非必须）" style="width:420px;"></el-input> <el-input v-model.trim="goodsInfoForm.out_goods_id" placeholder="请输入商品编码（非必须）" style="width:420px;"></el-input>
</el-form-item> </el-form-item> -->
<el-form-item label="商品图片：" prop="imgs"> <el-form-item label="商品图片：" prop="imgs">
<span class="tip-span" style="display: block;line-height: 34px;"> <span class="tip-span" style="display: block;line-height: 34px;">
<i style="margin: 10px;">{{ goodsImgFileList.length }} / 5</i> <i style="margin: 10px;">{{ goodsImgFileList.length }} / 7</i>
商品图片最多上传5张，默认第一张为主图 商品图片最多上传7张，默认第一张为主图
<span style="margin-left: 20px;">单张图片需限制在2M以内，可上传png、jpg格式，尺寸要求为800 * 800</span> <span style="margin-left: 20px;">单张图片需限制在2M以内，可上传png、jpg格式，尺寸要求为800 * 800</span>
</span> </span>
<draggable :list="goodsImgFileList" group="article" class="dragArea">
<div v-for="(element,index) in goodsImgFileList" :key="index" class="list-complete-item" style="float:left;margin:0 10px;">
<div style="width:98px;height:98px;position: relative;" class="" @mouseover="showDelBtn(index)" @mouseleave="hiddenDelBtn">
<img v-if="element" :src="element.url" width="98" height="98" />
<span class="iconcur" v-show="index==currentDelBtn" style="width:100%;height:100%;line-height: 98px;text-align: center; position:absolute;top:0;left:0;background-color: rgba(0,0,0,0.5);
transition: opacity .3s;">
<i class="el-icon-zoom-in iconcur" style="font-size:20px;color:#fff;" @click="lookimg(element)"></i>
<i class="el-icon-delete iconcur" style="font-size:20px;color:#fff;" @click="deleImg(element,index)"></i>
</span>
</div>
<p v-if="index==0" style="margin:0;padding:0;text-align:center;background:#ccc;color:#fff;">主图</p>
</div>
</draggable>
<el-dialog :visible.sync="dialogVisible">
<img width="100%" :src="dialogImageUrl" alt="">
</el-dialog>
<!-- {{goodsImgFileList}} -->
<el-upload <el-upload
class="upload-img" class="upload-img"
list-type="picture-card" list-type="picture-card"
action="#" action="#"
:limit="5" :limit="7"
:on-exceed="limitImg5" :on-exceed="limitImg5"
:before-upload="beforeUpGoodsImg" :before-upload="beforeUpGoodsImg"
:http-request="uploadGoodsImg" :http-request="uploadGoodsImg"
:show-file-list="false"
:on-preview="handlePictureCardPreview" :on-preview="handlePictureCardPreview"
:on-remove="handleRemove" :on-remove="handleRemove"
:file-list="goodsImgFileList" :file-list="goodsImgFileList"
...@@ -88,6 +99,36 @@ ...@@ -88,6 +99,36 @@
</el-dialog> </el-dialog>
</el-form-item> </el-form-item>
<el-form-item label='商品视频：' >
<span class="tip-span" style="display: block;line-height: 34px;">
最多上传一个视频（pm4格式），视频时长不超过30秒,
<span style="margin-left: 20px;">视频大小不超过100M，默认视频在图片前面</span>
</span>
<video
v-if="vediosrc"
style="width:300px;height:150px;float:left;margin:0 20px 0 0;"
v-bind:src="vediosrc"
class="avatar video-avatar"
controls="controls">
您的浏览器不支持视频播放
</video>
<el-upload
class="upload-img"
action="#"
:limit="1"
list-type="picture-card"
:before-upload="beforeUpGoodsvedio"
:http-request="uploadGoodsvedio"
:show-file-list="false"
:on-preview="handlePictureCardPreview"
:on-remove="handleRemove"
:file-list="goodsvedioFileList"
><i class="el-icon-plus" />
<!-- v-if="videoform.showvideopath !='' && !videoflag" -->
</el-upload>
</el-form-item>
</el-form> </el-form>
<!-- 修改 商品分类目录 --> <!-- 修改 商品分类目录 -->
...@@ -112,9 +153,10 @@ ...@@ -112,9 +153,10 @@
</template> </template>
<script> <script>
import { NewGetCategory, GetFreight, UploadImg, getByCategoryData } from '@/api/module/goods' import { NewGetCategory, GetFreight, UploadImg, getByCategoryData,uploadVideo } from '@/api/module/goods'
import { getBrandsInf } from '@/api/module/brand/brand' import { getBrandsInf } from '@/api/module/brand/brand'
import { getAreaList } from '@/api/module/retreat/address' import { getAreaList } from '@/api/module/retreat/address'
import draggable from 'vuedraggable'
export default { export default {
name: 'goods', name: 'goods',
props: { props: {
...@@ -123,6 +165,19 @@ ...@@ -123,6 +165,19 @@
required: true required: true
} }
}, },
components: {
draggable
},
computed: {//这一部分直接拿过来用的
dragOptions() {
return {
animation: 200,
group: "description",
disabled: false,
ghostClass: "ghost"
};
}
},
data() { data() {
let categoryIdCheck = (rule, value, callback) => { let categoryIdCheck = (rule, value, callback) => {
if (this.goodsImgFileList.length < 1) { if (this.goodsImgFileList.length < 1) {
...@@ -153,6 +208,22 @@ ...@@ -153,6 +208,22 @@
} }
} }
return { return {
dialogVisible:false,
dialogImageUrl:'',
videoflag: false,
//是否显示进度条
videouploadpercent: "",
//进度条的进度，
isshowuploadvideo: false,
//显示上传按钮
videoform: {
showvideopath: ''
},
goodsvedioFileList:[],
vediosrc:'',
loadingapp: false,
drag: false,
currentDelBtn: -1,
areaOptions: [], // 地址 省 areaOptions: [], // 地址 省
brandOptions: [], // 商品品牌 brandOptions: [], // 商品品牌
goodsInfoForm: { goodsInfoForm: {
...@@ -169,7 +240,8 @@ ...@@ -169,7 +240,8 @@
brand_id: '', // 品牌id brand_id: '', // 品牌id
web_url: '', // 外部链接 web_url: '', // 外部链接
out_goods_id: '', // 商品编码 out_goods_id: '', // 商品编码
imgs: [] // 商品图片 imgs: [], // 商品图片
video:''
}, },
goodsInfoRules: { goodsInfoRules: {
categoryStr: [{required: true, message: '商品分类不能为空', trigger: 'blur'}], categoryStr: [{required: true, message: '商品分类不能为空', trigger: 'blur'}],
...@@ -205,7 +277,6 @@ ...@@ -205,7 +277,6 @@
catefee: 0, catefee: 0,
} // return end } // return end
}, },
components: {},
watch: { watch: {
// selectCity(arr){ // selectCity(arr){
// //处理回显问题 // //处理回显问题
...@@ -215,8 +286,6 @@ ...@@ -215,8 +286,6 @@
// } // }
}, },
created() { created() {
// 获取 省
this.getArea();
// 获取 商品品牌 // 获取 商品品牌
this.getBrands(); this.getBrands();
// 获取类目 // 获取类目
...@@ -241,24 +310,71 @@ ...@@ -241,24 +310,71 @@
this.getByCategoryFee(this.goodsInfoForm.categoryList) this.getByCategoryFee(this.goodsInfoForm.categoryList)
}, },
methods: { methods: {
// 上传 商品图片 之前
beforeUpGoodsvedio(file) {
let isImgSize = (file.size / 1024 / 1024 ) > 2000;
if(file.type !== "video/mp4") {
this.$message({
message: '上传图片格式只支持 jpg / png 格式',
type: "warning"
});
return false;
}
if(isImgSize) {
this.$message({
message: '上传图片大小不能超过5000MB',
type: "warning"
});
return false;
}
},
// 上传 商品视频
uploadGoodsvedio(param) {
const formData = new FormData()
formData.append('file', param.file)
uploadVideo(formData).then( res=> {
let urlObj = {'url': ''};
if(res.data) {
urlObj.url = res.data.url;
this.goodsvedioFileList.push(urlObj);
this.vediosrc = res.data.url
this.goodsInfoForm.video = res.data.url
this.$message({type:'success',message:'图片上传成功'});
}
});
},
onEnd(){
debugger
console.log( this.goodsImgFileList)
this.drag = false
},
//显示删除图片的图标
showDelBtn(index) {
console.log(index)
this.currentDelBtn = index
},
//隐藏删除图片的图标
hiddenDelBtn() {
this.currentDelBtn = -1
},
// 删除图片
deleImg(data, index) {
this.goodsImgFileList.splice(index, 1)
},
lookimg(data){
this.dialogVisible = true
this.dialogImageUrl = data.url
},
// 数据初始化 // 数据初始化
initInfo() { initInfo() {
this.$refs.goodsInfoForm.resetFields(); this.$refs.goodsInfoForm.resetFields();
this.goodsImgFileList = []; this.goodsImgFileList = [];
}, },
// 获取 省
getArea() {
let limboNode = {
pid: 0
};
getAreaList(limboNode).then( res => {
if( res.data && res.data.length > 0) {
this.areaOptions = res.data;
}else {
this.areaOptions = [];
}
});
},
// 获取 商品品牌 // 获取 商品品牌
getBrands() { getBrands() {
// 增加入参 // 增加入参
...@@ -335,7 +451,7 @@ ...@@ -335,7 +451,7 @@
return false; return false;
} }
// 图片宽高尺寸限制 800*800 // // 图片宽高尺寸限制 800*800
return new Promise(function(resolve, reject){ return new Promise(function(resolve, reject){
let _URL = window.URL || window.webkitURL; let _URL = window.URL || window.webkitURL;
let img = new Image(); let img = new Image();
...@@ -435,7 +551,7 @@ ...@@ -435,7 +551,7 @@
// console.log(8888,data); // console.log(8888,data);
getByCategoryData(data).then(res=> { getByCategoryData(data).then(res=> {
if ( res.code == 1 ) { if ( res.code == 1 ) {
this.cateFee = res.data.service_fee_ratio this.cateFee = res.data.service_fee_ratio?res.data.service_fee_ratio:''
this.$store.commit('SET_CATEFEE',this.cateFee); this.$store.commit('SET_CATEFEE',this.cateFee);
} }
}); });
...@@ -487,7 +603,15 @@ ...@@ -487,7 +603,15 @@
/deep/.el-form-item { /deep/.el-form-item {
margin-bottom: 20px; margin-bottom: 20px;
} }
.list-complete-item{
display: inline-block;
}
.imgSty{
margin:0 10px;
}
.iconcur{
cursor: pointer;
}
/*/deep/.el-cascader-menu {*/ /*/deep/.el-cascader-menu {*/
/* height:600px;*/ /* height:600px;*/
/*}*/ /*}*/
......
src/views/system/goods/add/components/goodsparameter.vue
浏览文件 @ 92287de1
<template> <template>
<div class="goods-parameter"> <div class="goods-parameter">
<p class="tip-p"> <div v-show="isradioguide==1">
<el-link class="edit-type-span el-icon-search" type="primary" :underline="false" @click="viewPriceExp">查看各类价格说明 <!-- <p style="margin: 10px 0;color: #333;font-size: 14px;font-weight: 400;">默认</p> -->
</el-link>
<span class="tip-span">所有商品价格均为含税价，必须开具发票</span>
</p>
<div v-show="(!orgGoodsPam.pamTableList || orgGoodsPam.pamTableList.length === 0)">
<p style="margin: 10px 0;color: #333;font-size: 14px;font-weight: 400;">默认</p>
<el-table <el-table
border border
size="small" size="small"
...@@ -64,7 +58,8 @@ ...@@ -64,7 +58,8 @@
<!-- </el-table-column>--> <!-- </el-table-column>-->
</el-table> </el-table>
</div> </div>
<div v-if="parameterdata.specs.length > 0" class="single-spe-con"> {{parameterdata.isradioguide}}
<div v-if="parameterdata.specs&&parameterdata.specs.length > 0&&isradioguide==2" class="single-spe-con">
<!-- {{parameterdata.specs_group}} --> <!-- {{parameterdata.specs_group}} -->
<el-table <el-table
border border
...@@ -168,49 +163,15 @@ ...@@ -168,49 +163,15 @@
<span class="span-img-del el-icon-delete del-span-block" @click="delSingleSpecImg(scope.$index,scope.row)"></span> <span class="span-img-del el-icon-delete del-span-block" @click="delSingleSpecImg(scope.$index,scope.row)"></span>
</span> </span>
<input type="file" style="display: none;" :ref=" 'hxz' + scope.$index " accept="image/*"
@change="changeIMG(scope.$index,scope.row)">
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
</div>
<!-- 查看各类价格说明 -->
<el-dialog
title="各类价格说明"
:visible.sync="isViewPriceExp"
width="40%"
center
append-to-body
>
<el-form ref="workOrderForm" size="small" label-width="150px">
<el-form-item label="协议价：">
<span>指您供货给下游的价格</span>
</el-form-item>
<el-form-item label="结算价：">
<span>与云仓平台结算的价格，根据协议价自动计算</span>
</el-form-item>
<el-form-item label="指导售价：">
<span>指导下游商户制定销售的价格</span>
</el-form-item>
<el-form-item label="市场价：">
<span>市场售价，参考京东、天猫等平台的售价</span>
</el-form-item>
<el-form-item>
<span class="pre-price-tip">商品价格均为含税价，必须开具发票。请准确填写并更新商品实际库存，超卖导致的虚假及延迟发货会引起用户投诉与平台判罚。</span>
</el-form-item>
<input type="file" style="display: none;" ref="guideupimg" accept="image/*"
@change="changeIMG()">
</div>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="isViewPriceExp = false" size="mini">取 消</el-button>
</span>
</el-dialog>
</div> </div>
</template> </template>
...@@ -227,6 +188,8 @@ export default { ...@@ -227,6 +188,8 @@ export default {
}, },
data() { data() {
return { return {
isradioguide:'',
upimgindex:'',
keyvalue:1, keyvalue:1,
spacArr:[], spacArr:[],
orgGoodsPam: {}, orgGoodsPam: {},
...@@ -277,28 +240,27 @@ export default { ...@@ -277,28 +240,27 @@ export default {
debugger debugger
}, },
mounted() { mounted() {
this.isradioguide = this.parameterdata.isradioguide ? this.parameterdata.isradioguide:1
console.log(this.parameterdata) console.log(this.parameterdata)
this.getSpanArr(this.parameterdata); this.getSpanArr(this.parameterdata);
debugger debugger
this.keyvalue++ this.keyvalue++
if(this.parameterdata.pamTableList && this.parameterdata.pamTableList.length > 0) {
this.orgGoodsPam = this.parameterdata; if(this.parameterdata.singleSpecTable && this.parameterdata.singleSpecTable.length === 1 ) {
}else {
if( this.parameterdata.singleSpecTable.length === 1 ) {
this.singleSpecTable = this.parameterdata.singleSpecTable this.singleSpecTable = this.parameterdata.singleSpecTable
} }
}
}, },
methods: { methods: {
parentMsg(val){
console.log(val,'guangbo')
this.isradioguide = val
},
/** 初始化 商品售价 数据 */ /** 初始化 商品售价 数据 */
initInfo() { initInfo() {
this.orgGoodsPam = {}; this.orgGoodsPam = {};
//this.singleSpecTable = //this.singleSpecTable =
}, },
// 查看各类价格说明
viewPriceExp() {
this.isViewPriceExp = true;
},
// ------ 无规格，上传图片相关 ------ // ------ 无规格，上传图片相关 ------
limit5() { limit5() {
this.$message({type: 'warning',message: '只能上传5张图片'}); this.$message({type: 'warning',message: '只能上传5张图片'});
...@@ -341,10 +303,10 @@ export default { ...@@ -341,10 +303,10 @@ export default {
/** 规格组合 上传图片 */ /** 规格组合 上传图片 */
// 上传图片 // 上传图片
upPreSpeImg(index, row) { upPreSpeImg(index, row) {
let domRef = "hxz" + index; this.upimgindex = index
//console.log(domRef,this.$refs[domRef][0]); this.$refs.guideupimg.value = '';
this.$refs[domRef][0].value = '';
this.$refs[domRef][0].click(); this.$refs.guideupimg.dispatchEvent(new MouseEvent('click'))
}, },
// 更换 某一个规格的图片 // 更换 某一个规格的图片
...@@ -354,14 +316,12 @@ export default { ...@@ -354,14 +316,12 @@ export default {
// 真正的上传图片方法，原生input // 真正的上传图片方法，原生input
changeIMG(index, row) { changeIMG(index, row) {
let curRow = row; let curRow = row;
let inputDom = "hxz" + index;
let file = this.$refs[inputDom][0].files[0]; let file = this.$refs.guideupimg.files[0];
if( file.size > 1024 * 1024 * 3 ) { if( file.size > 1024 * 1024 * 3 ) {
this.$message({ type: 'error',message: '规格图片不能大于 3 M'}); this.$message({ type: 'error',message: '规格图片不能大于 3 M'});
return; return;
} }
this.getBase64(file).then((res) => { this.getBase64(file).then((res) => {
let result = res.split(","); let result = res.split(",");
this.Base64img = result[1]; this.Base64img = result[1];
...@@ -369,7 +329,7 @@ export default { ...@@ -369,7 +329,7 @@ export default {
UploadImg(data).then(res => { UploadImg(data).then(res => {
// this.loading = false; // this.loading = false;
if (res && res.code == 1) { if (res && res.code == 1) {
curRow.thumb = res.data.image_url; this.parameterdata.specs_group[this.upimgindex].thumb = res.data.image_url;
// this.singleSpecImgList.push({'url': res.data.image_url}) // this.singleSpecImgList.push({'url': res.data.image_url})
this.$message({ message:'上传成功',type:'success'}); this.$message({ message:'上传成功',type:'success'});
}else { }else {
...@@ -417,10 +377,28 @@ export default { ...@@ -417,10 +377,28 @@ export default {
}, },
/** 一键应用所有 */ /** 一键应用所有 */
applyAllTable(key) { applyAllTable(key) {
let val = this.orgGoodsPam.pamTableList[0][0][key] this.$prompt('', '批量设置价格', {
this.orgGoodsPam.pamTableList.map(item => { confirmButtonText: '确定',
item[0][key] = val cancelButtonText: '取消',
}) inputPattern: /^[+]{0,1}(\d+)$|^[+]{0,1}(\d+\.\d+)$/ ,
inputErrorMessage: '金额须大于零',
inputPlaceholder:'输入协议价',
center: true
}).then(({ value }) => {
this.parameterdata.specs_group.map(item => {
item[key] = value
})
this.$message({
type: 'success',
message: '设置成功'
});
}).catch(() => {
this.$message({
type: 'info',
message: '取消输入'
});
});
}, },
// 删除 单个规格的图片 // 删除 单个规格的图片
......
src/views/system/goods/add/components/goodsspecifications.vue
浏览文件 @ 92287de1
...@@ -343,10 +343,8 @@ export default { ...@@ -343,10 +343,8 @@ export default {
// 当处理后的数据，是一个空数组，则不需要再进行 笛卡尔积 计算，可以直接给出计算结果 // 当处理后的数据，是一个空数组，则不需要再进行 笛卡尔积 计算，可以直接给出计算结果
if (proSpeData.length === 0) { if (proSpeData.length === 0) {
let goodsPam = { let goodsPam = {
pamNameList: [], specs:[],
pamDataList: [], isradioguide:1
pamTableList: [],
specs:[]
}; };
this.$emit('calcSpeTable', goodsPam); this.$emit('calcSpeTable', goodsPam);
} else { } else {
...@@ -358,26 +356,29 @@ export default { ...@@ -358,26 +356,29 @@ export default {
} }
// goodsParametersList newList // goodsParametersList newList
let goodsParametersList = this.cartesian(proSpeData); let goodsParametersList = this.cartesian(proSpeData);
debugger
for (let index = 0; index < goodsParametersList.length; index++) { for (let index = 0; index < goodsParametersList.length; index++) {
var listobj = {}; var listobj = {};
listobj["js_price"] = "";
listobj["sl_price"] = "";
listobj["price"] = "";
listobj["sc_price"] = "";
listobj["stock"] = "";
listobj["weight"] = "";
listobj["thumb"] = "";
listobj["spec_values"] = goodsParametersList[index]
for (let i = 0; i < this.speData.length; i++) { for (let i = 0; i < this.speData.length; i++) {
debugger
if(this.speData.length>1){ if(this.speData.length>1){
listobj[this.speData[i].spec_name] = goodsParametersList[index][i]; listobj[this.speData[i].spec_name] = goodsParametersList[index][i];
} }
if(this.speData.length==1){ if(this.speData.length==1){
listobj[this.speData[i].spec_name] = goodsParametersList[index]; debugger
listobj[this.speData[0].spec_name] = goodsParametersList[index];
} }
listobj["js_price"] = "";
listobj["sl_price"] = "";
listobj["price"] = "";
listobj["sc_price"] = "";
listobj["stock"] = "";
listobj["weight"] = "";
listobj["thumb"] = "";
listobj["spec_values"] = goodsParametersList[index]
} }
specs_group.push(listobj); specs_group.push(listobj);
} }
...@@ -389,6 +390,7 @@ export default { ...@@ -389,6 +390,7 @@ export default {
this.tableData7['specs_group'] = specs_group this.tableData7['specs_group'] = specs_group
this.tableData7['specs'] = this.speData this.tableData7['specs'] = this.speData
this.tableData7['shopTypes'] = this.cartesian(proSpeData) this.tableData7['shopTypes'] = this.cartesian(proSpeData)
this.tableData7['isradioguide'] = 2
this.$emit('calcSpeTable',this.tableData7); this.$emit('calcSpeTable',this.tableData7);
console.log(this.tableData7) console.log(this.tableData7)
} }
...@@ -454,9 +456,11 @@ export default { ...@@ -454,9 +456,11 @@ export default {
//console.log(404,this.speData); //console.log(404,this.speData);
}, },
/** 笛卡尔积算法 */ /** 笛卡尔积算法 */
cartesian(arr) { cartesian(arr) {
debugger
if(arr.length < 2) { if(arr.length < 2) {
return arr[0] || []; return arr[0] || [];
}else { }else {
......
src/views/system/goods/add/index.vue
浏览文件 @ 92287de1
...@@ -35,10 +35,20 @@ ...@@ -35,10 +35,20 @@
<!-- 商品规格 --> <!-- 商品规格 -->
<div class="floor-item"> <div class="floor-item">
<div class="floor-item-box"> <div class="floor-item-box">
<p class="card-header-title floor-item-box-title"><span class="blue-block-goods blue-block-goods-title"></span>商品规格</p> <p class="card-header-title floor-item-box-title"><span class="blue-block-goods blue-block-goods-title"></span>商品规格
<GoodsSpecifications ref="goodsspecifications" :specificationsdata="specificationsdata" @calcSpeTable="calcSpeTable"/> <el-radio-group v-model="radioguide" @change="radiochange" style="padding-left:50px;">
<el-radio :label="1">单规格</el-radio>
<el-radio :label="2">多规格</el-radio>
</el-radio-group>
<el-link class="edit-type-span el-icon-search" type="primary" :underline="false" @click="viewPriceExp">查看各类价格说明
</el-link>
<span class="tip-span">所有商品价格均为含税价，必须开具发票</span>
</p>
<GoodsSpecifications v-show="radioguide==2" ref="goodsspecifications" :specificationsdata="specificationsdata" @calcSpeTable="calcSpeTable"/>
<!-- <keep-alive>--> <!-- <keep-alive>-->
<GoodsParameter :key="keyvalue" ref="goodsparameter" :parameterdata="parameterdata" /> <GoodsParameter :key="keyvalue" ref="goodsparameter" :parameterdata="parameterdata" @ />
<!-- </keep-alive>--> <!-- </keep-alive>-->
</div> </div>
</div> </div>
...@@ -50,18 +60,17 @@ ...@@ -50,18 +60,17 @@
</div> </div>
</div> </div>
<!-- 售后及服务 --> <!-- 售后及服务 -->
<div class="floor-item"> <Goodsaftersale class="floor-item" ref="goodsaftersale" :goodsaftersale="goodsaftersale" />
<div class="floor-item-box">
<p class="card-header-title floor-item-box-title"><span class="blue-block-goods blue-block-goods-title"></span>售后及服务</p>
<Goodsaftersale ref="goodsaftersale" :goodsaftersale="goodsaftersale" />
<div class="submit-type-con"> <div class="submit-type-con">
<el-radio-group v-model="goodsAllData.submit" size="small"> <el-radio-group v-model="goodsAllData.submit" size="small">
<el-radio :label="0" border>放入仓库</el-radio> <el-radio :label="0" border>放入仓库</el-radio>
<el-radio :label="1" border>立即上架</el-radio> <el-radio :label="1" border>立即上架</el-radio>
</el-radio-group> </el-radio-group>
</div> </div>
</div>
</div>
</div> </div>
<div class="submit-cont"> <div class="submit-cont">
...@@ -69,6 +78,42 @@ ...@@ -69,6 +78,42 @@
</div> </div>
</el-card> </el-card>
<!-- 添加商品 end --> <!-- 添加商品 end -->
<!-- 查看各类价格说明 -->
<el-dialog
title="各类价格说明"
:visible.sync="isViewPriceExp"
width="40%"
center
append-to-body
>
<el-form ref="workOrderForm" size="small" label-width="150px">
<el-form-item label="协议价：">
<span>指您供货给下游的价格</span>
</el-form-item>
<el-form-item label="结算价：">
<span>与云仓平台结算的价格，根据协议价自动计算</span>
</el-form-item>
<el-form-item label="指导售价：">
<span>指导下游商户制定销售的价格</span>
</el-form-item>
<el-form-item label="市场价：">
<span>市场售价，参考京东、天猫等平台的售价</span>
</el-form-item>
<el-form-item>
<span class="pre-price-tip">商品价格均为含税价，必须开具发票。请准确填写并更新商品实际库存，超卖导致的虚假及延迟发货会引起用户投诉与平台判罚。</span>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="isViewPriceExp = false" size="mini">取 消</el-button>
</span>
</el-dialog>
</div> </div>
</template> </template>
...@@ -97,6 +142,8 @@ ...@@ -97,6 +142,8 @@
}, },
data() { data() {
return { return {
isViewPriceExp:false,
radioguide:1,
keyvalue:1, keyvalue:1,
goodsLoading: false, goodsLoading: false,
SSQList: [], // 省市区 SSQList: [], // 省市区
...@@ -116,9 +163,10 @@ ...@@ -116,9 +163,10 @@
floorNav: [ floorNav: [
{ id: 1, name: '商品信息' }, { id: 1, name: '商品信息' },
{ id: 2, name: '商品规格' }, { id: 2, name: '商品规格' },
{ id: 3, name: '商品售价' }, { id: 3, name: '商品详情' },
{ id: 4, name: '商品详情' }, { id: 4, name: '商品参数' },
{ id: 5, name: '售后及服务' } { id: 5, name: '售后及服务' },
{ id: 6, name: '其他设置' }
], ],
/* 商品信息 */ /* 商品信息 */
goodsinfodata: { goodsinfodata: {
...@@ -130,9 +178,7 @@ ...@@ -130,9 +178,7 @@
specificationsdata: [], specificationsdata: [],
/* 商品售价 */ /* 商品售价 */
parameterdata: { parameterdata: {
pamDataList: [], isradioguide:this.radioguide,
pamNameList: [],
pamTableList: [],
singleSpecTable: [] singleSpecTable: []
}, },
/* 商品详情 */ /* 商品详情 */
...@@ -142,10 +188,17 @@ ...@@ -142,10 +188,17 @@
description: '', description: '',
/* 售后及服务 */ /* 售后及服务 */
goodsaftersale: { goodsaftersale: {
params:[],//参数
stags: [], stags: [],
freight_id: 310, freight_id: 310,
delay_compensate: 24, delay_compensate: 24,
aftersale_time: 7 aftersale_time: 7,
goods_des:'',//关键词
producing_area:'',//产地
deliver_area:'',//发货地
unit:'',//单位
web_url:'',//外部市场链接
out_goods_id:''//商品编码
}, },
goodsAllData: { goodsAllData: {
submit: 0, submit: 0,
...@@ -170,17 +223,18 @@ ...@@ -170,17 +223,18 @@
goods_id: res.data.goods_id, goods_id: res.data.goods_id,
categoryStr: '', // 商品分类 地址拼接 categoryStr: '', // 商品分类 地址拼接
categoryList: [], // 商品分类 id集合的数组 categoryList: [], // 商品分类 id集合的数组
goods_des: res.data.goods_des, // 关键词 // goods_des: res.data.goods_des, // 关键词
goods_name: res.data.goods_name, // 商品标题 goods_name: res.data.goods_name, // 商品标题
category_id: res.data.category_id, category_id: res.data.category_id,
producing_area: res.data.producing_area, // 产地 // producing_area: res.data.producing_area, // 产地
deliver_area: res.data.deliver_area, // 发货地 // deliver_area: res.data.deliver_area, // 发货地
unit: res.data.unit, // 单位 // unit: res.data.unit, // 单位
goods_brand: res.data.goods_brand, // 品牌 goods_brand: res.data.goods_brand, // 品牌
brand_id: res.data.brand_id, // 品牌 brand_id: res.data.brand_id, // 品牌
web_url: res.data.web_url, // 外部链接 // web_url: res.data.web_url, // 外部链接
out_goods_id: (res.data.out_goods_id == 0) ? '' : res.data.out_goods_id , // 商品编码 // out_goods_id: (res.data.out_goods_id == 0) ? '' : res.data.out_goods_id , // 商品编码
imgs: res.data.imgs // 商品图片 imgs: res.data.imgs, // 商品图片
video:res.data.video
} }
this.goodsinfodata.categoryStr = res.data.category_first_name + '/' + res.data.category_first_name + '/' + res.data.category_three_name; this.goodsinfodata.categoryStr = res.data.category_first_name + '/' + res.data.category_first_name + '/' + res.data.category_three_name;
...@@ -193,6 +247,12 @@ ...@@ -193,6 +247,12 @@
// 商品规格, 售价由规格决定 // 商品规格, 售价由规格决定
if(res.data.specs && res.data.specs.length > 0) { if(res.data.specs && res.data.specs.length > 0) {
this.specificationsdata = res.data.specs; this.specificationsdata = res.data.specs;
this.radioguide = 2
this.parameterdata.isradioguide = 2
}else{
this.parameterdata['specs']=[]
this.radioguide = 1
this.parameterdata.isradioguide = 1
} }
// 商品售价 // 商品售价
...@@ -214,7 +274,7 @@ ...@@ -214,7 +274,7 @@
} }
if(res.data.specs.length==1){ if(res.data.specs.length==1){
specs_group[res.data.specs[i].spec_name] = goodsParametersList[index]; specs_group[index][res.data.specs[0].spec_name] = goodsParametersList[index];
} }
} }
} }
...@@ -246,12 +306,19 @@ ...@@ -246,12 +306,19 @@
// 商品详情 // 商品详情
this.description = res.data.description; this.description = res.data.description;
// 售后服务 // 商品参数 售后服务 其他设置
this.goodsaftersale.params = res.data.params?res.data.params:[]//参数
this.goodsaftersale.goods_des = res.data.goods_des//关键词
this.goodsaftersale.producing_area = res.data.producing_area // 产地
this.goodsaftersale.deliver_area = res.data.deliver_area // 发货地
this.goodsaftersale.unit = res.data.unit // 单位
this.goodsaftersale.web_url = res.data.web_url // 外部链接
this.goodsaftersale.out_goods_id = (res.data.out_goods_id == 0) ? '' : res.data.out_goods_id //商品编码
this.goodsaftersale.freight_id = res.data.freight_id; this.goodsaftersale.freight_id = res.data.freight_id;
this.goodsaftersale.delay_compensate = res.data.delay_compensate; this.goodsaftersale.delay_compensate = res.data.delay_compensate;
this.goodsaftersale.aftersale_time = res.data.aftersale_time; this.goodsaftersale.aftersale_time = res.data.aftersale_time;
let stagArr = []; let stagArr = [];
// 后台返回数据格式 ‘2,3’或者‘[]’都是字符串，处理兼容一下 // 后台返回数据格式 ‘2,3’或者‘[]’都是字符串，处理兼容一下
//debugger //debugger
if( res.data.stags && !Array.isArray(res.data.stags)) { if( res.data.stags && !Array.isArray(res.data.stags)) {
...@@ -276,6 +343,7 @@ ...@@ -276,6 +343,7 @@
} }
} }
}); });
console.log(this.goodsaftersale)
}else { }else {
this.isShowGoodsDetails = false; this.isShowGoodsDetails = false;
} }
...@@ -283,38 +351,17 @@ ...@@ -283,38 +351,17 @@
mounted() { mounted() {
}, },
methods: { methods: {
radiochange(val){
this.parameterdata.isradioguide = val
this.$refs.goodsparameter.parentMsg(val)
},
// 查看各类价格说明
viewPriceExp() {
this.isViewPriceExp = true;
},
// 规格子组件，传给父组件的数据 // 规格子组件，传给父组件的数据
calcSpeTable(data) { calcSpeTable(data) {
this.keyvalue++ this.keyvalue++
// //console.log('原始值',data);
// // 第一步，获取原来的值
// let spsjData2 = this.$refs.goodsparameter;
// let spsjData2Clone = this.deepClone(spsjData2);
// // 第二步，重新渲染dom
// if(data.pamTableList.length > 0) {
// data.pamTableList.forEach((item, index) => {
// if( Array.isArray(data.pamDataList[index]) ) {
// item[0].spec_values = data.pamDataList[index];
// }else {
// item[0].spec_values.push(data.pamDataList[index]);
// }
// })
// }
// // 第三步，重新赋值
// if(data.pamTableList.length > 0 && spsjData2Clone.pamTableList.length > 0) {
// for(let i = 0; i < data.pamTableList.length; i++) {
// for(let j = 0; j < spsjData2Clone.pamTableList.length; j++) {
// // 这两个值，如果不转 toString()，就不相等，？？
// if( (data.pamTableList[i][0].spec_values).toString() === (spsjData2Clone.pamTableList[j][0].spec_values).toString() ) {
// data.pamTableList[i] = spsjData2Clone.pamTableList[j];
// }
// }
// }
// }
this.parameterdata = data; this.parameterdata = data;
debugger debugger
...@@ -424,13 +471,13 @@ ...@@ -424,13 +471,13 @@
let isGoodsPrice = true; let isGoodsPrice = true;
let goodsPriceMsg = ''; let goodsPriceMsg = '';
let spsjData1 = this.$refs.goodsparameter.singleSpecTable; let spsjData1 = this.$refs.goodsparameter.singleSpecTable;
let spsjData2 = this.$refs.goodsparameter.orgGoodsPam; let spsjData2 = this.$refs.goodsparameter.parameterdata;
debugger
// 如果有，则说明有规格组合数据 // 如果有，则说明有规格组合数据
if ( spsjData2.pamTableList && spsjData2.pamTableList.length > 0 ) { if ( this.radioguide==2&&spsjData2.specs_group && spsjData2.specs_group.length > 0 ) {
debugger debugger
for(let i = 0; i < spsjData2.pamTableList.length; i++) { for(let i = 0; i < spsjData2.specs_group.length; i++) {
let itemObj = spsjData2.pamTableList[i][0]; let itemObj = spsjData2.specs_group[i][0];
for (let itemKey in itemObj) { for (let itemKey in itemObj) {
// 有多余字段，可能为空，需要对有效字段单独判断 // 有多余字段，可能为空，需要对有效字段单独判断
// Number后，有三中情况：0，正数，负数，NaN // Number后，有三中情况：0，正数，负数，NaN
...@@ -556,12 +603,9 @@ ...@@ -556,12 +603,9 @@
// //
// 商品售价，上面已经获取， // 商品售价，上面已经获取，
let spsjData = {}; let spsjData = {};
if( spsjData2.pamTableList && spsjData2.pamTableList.length > 0 ) { if( spsjData2.specs_group && spsjData2.specs_group.length > 0 ) {
this.goodsAllData['specs_group'] = []; this.goodsAllData['specs_group'] = spsjData2.specs_group
this.goodsAllData['specs'] = spggData; this.goodsAllData['specs'] =spsjData2.specs
spsjData2.pamTableList.forEach((item,index)=> {
this.goodsAllData['specs_group'].push(item[0]);
});
}else { }else {
spsjData = spsjData1[0]; spsjData = spsjData1[0];
} }
...@@ -698,23 +742,55 @@ ...@@ -698,23 +742,55 @@
// 可以通过 floor-cont的父元素，高度减去上下两个div的高度，来准确计算出来了，需要wtach监听,暂时用初步高来计算，一般问题不大 // 可以通过 floor-cont的父元素，高度减去上下两个div的高度，来准确计算出来了，需要wtach监听,暂时用初步高来计算，一般问题不大
let floor_cont = document.getElementsByClassName('floor-cont')[0]; let floor_cont = document.getElementsByClassName('floor-cont')[0];
let floor_item = document.getElementsByClassName('floor-item'), let floor_item,floor_offsetTop
if(index==1||index==2||index==0){
floor_item = document.getElementsByClassName('floor-item')
floor_offsetTop = floor_item[index].offsetTop - floor_item[0].offsetTop
}
if(index==3){
floor_item = this.$refs.goodsaftersale.$refs.paramsvalue.$el
console.log(floor_item)
floor_offsetTop =floor_item.offsetTop - 100
}
if(index==4){
floor_item = this.$refs.goodsaftersale.$refs.salesvalue.$el
floor_offsetTop = floor_item.offsetTop - 100
}
if(index==5){
floor_item = this.$refs.goodsaftersale.$refs.outhervalue.$el
floor_offsetTop = floor_item.offsetTop - 100
}
// 每次点击，对应dom需要滚动的高度 // 每次点击，对应dom需要滚动的高度
floor_offsetTop = floor_item[index].offsetTop - floor_item[0].offsetTop,
window_scrollTop = _this.$refs.scrollview.scrollTop, let window_scrollTop = _this.$refs.scrollview.scrollTop
// 基本滚动动画配置 // 基本滚动动画配置
timer = { step: 60, times: 15, FLOOR_OFFSETTOP: 0 }; let timer = { step: 60, times: 15, FLOOR_OFFSETTOP: 0 };
// floor_cont 可是窗口的 高 // floor_cont 可是窗口的 高
let hxz = 0; let hxz = 0;
let resList = []; let resList = [];
let list = []; let list = [];
for(let i = 0; i < floor_item.length; i++) { for(let i = 0; i < 6; i++) {
list.push(Number(floor_item[i].offsetHeight)); if(i==0||i==1||i==2){
let floor_item = document.getElementsByClassName('floor-item')
list.push(Number(floor_item[i].offsetHeight));
} }
resList = list.slice(index) if(i==3){
list.push(Number(this.$refs.goodsaftersale.$refs.paramsvalue.$el.offsetHeight));
}
if(i==4){
list.push(Number(this.$refs.goodsaftersale.$refs.salesvalue.$el.offsetHeight));
}
if(i==5){
list.push(Number(this.$refs.goodsaftersale.$refs.outhervalue.$el.offsetHeight));
}
}
resList = list.slice(index)
for(let j = 0; j < resList.length; j++) { for(let j = 0; j < resList.length; j++) {
hxz += resList[j] hxz += resList[j]
} }
...@@ -967,4 +1043,13 @@ ...@@ -967,4 +1043,13 @@
/*align-content: center;*/ /*align-content: center;*/
box-shadow: 0 -8px 9px 1px rgba(51, 51, 51, 0.06); box-shadow: 0 -8px 9px 1px rgba(51, 51, 51, 0.06);
} }
.edit-type-span {
display: inline-block;
cursor: pointer;
margin: 0 20px;
}
.tip-span {
color: #909399;
font-size: 12px;
}
</style> </style>
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论