Skip to content

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

1111

上级 2ef7a507
显示空白字符变更
内嵌 并排
正在显示 包含 1372 行增加 和 180 行删除
package.json
浏览文件 @ f50b6fb5
......@@ -61,6 +61,7 @@
"screenfull": "4.2.0",
"sortablejs": "1.8.4",
"vue": "2.6.10",
"vue-awesome-swiper": "^4.1.1",
"vue-count-to": "1.0.13",
"vue-cropper": "0.4.9",
"vue-quill-editor": "^3.0.6",
......@@ -72,8 +73,8 @@
},
"devDependencies": {
"@babel/core": "7.0.0",
"@babel/register": "7.0.0",
"@babel/parser": "^7.7.4",
"@babel/register": "7.0.0",
"@vue/cli-plugin-babel": "3.5.3",
"@vue/cli-plugin-eslint": "^3.9.1",
"@vue/cli-plugin-unit-jest": "3.5.3",
......@@ -102,6 +103,7 @@
"serve-static": "^1.13.2",
"svg-sprite-loader": "4.1.3",
"svgo": "1.2.0",
"swiper": "^6.8.0",
"vue-template-compiler": "2.6.10"
},
"engines": {
......
src/api/module/goodsgement.js
浏览文件 @ f50b6fb5
......@@ -8,7 +8,7 @@ export function getlistGoods(query) {
params: query
})
}
//上架商品
//上下架商品
export function shelvesStatus(data) {
return request({
url: '/system/goodsNew/shelvesStatus',
......@@ -16,73 +16,20 @@ export function shelvesStatus(data) {
data: data
})
}
// 查询类别
export function GetCategory(query) {
return request({
url: '/system/goods/getCategory',
method: 'get',
params: query
})
}
// 查询运费模板
export function GetFreight(query) {
//删除还原商品
export function delgoodsStatus(data) {
return request({
url: '/system/goods/getFreight',
method: 'get',
params: query
})
}
// 查询goods详细
export function getGoods (id) {
return request({
url: '/system/goods/edit?goodsId='+id,
method: 'get'
})
}
// 新增goods
export function addGoods(data) {
return request({
url: '/system/goods/add',
url: '/system/goodsNew/goodsStatus',
method: 'post',
data: data
})
}
// 修改goods
export function updateGoods(data) {
// 商品详情
export function getgoodsdetail(query) {
return request({
url: '/system/goods/edit',
method: 'post',
data: data
})
}
// 删除goods
export function delGoods(ids) {
return request({
url: '/system/goods/delete',
method: 'delete',
data:{ids:ids}
})
}
//上传图片
export function UploadImg(data) {
return request({
url: '/system/goods/uploadImg',
method: 'post',
data: data
url: '/system/goodsNew/info',
method: 'get',
params: query
})
}
src/components/Magnifying/index.vue 0 → 100644
浏览文件 @ f50b6fb5
<template>
<!-- 放大镜 -->
<div style="display: flex;position: relative">
<div
class="box Magnifying"
:style="minImgBoxStyle"
@mouseleave="mouseLeave"
@mouseenter="mouseEnter"
@mousemove="mousemove($event)"
>
<!-- <div>{{title}}</div> -->
<!--原始照片-小照片 :src="finalMinIMGsrc"-->
<img ref="minImg" :style="minImgStyle" fit="contain" :src="imageurl">
<!--探测块-->
<div v-show="show" class="areaMark" :style="areaMarkStyle" />
</div>
<div v-show="show" class="box maxImgBox" :style="maxImgBoxStyle">
<!--放大后的照片-->
<img :style="maxImgStyle" fit="contain" :src="imageurl">
</div>
</div>
</template>
<script>
export default {
name: 'Magnifying',
props: {
imageurl: {},
imgsurl: {}, // 父组件图片
// imageurl: '',
minIMGsrc: String,
maxIMGsrc: String,
scale: {
type: Number,
default: 2
},
width: {
type: Number,
default: 380
},
height: {
type: Number,
default: 380
}
},
data() {
return {
show: false,
finalMinIMGsrc: '',
finalMaxIMGsrc: '',
imgBoxWidth: 380,
imgBoxHeight: 380,
areaWidth: 210,
areaHeight: 210,
areaMarkStyle: {},
minImgBoxStyle: {
cursor: 'move'
},
minImgStyle: {},
maxImgBoxStyle: {},
maxImgStyle: {
position: 'absolute'
}
}
},
watch: {
imgsurl: function(newVal, oldVal) {
this.finalMinIMGsrc = newVal // 监听父组件图片 改变组件内图片地址
console.log(newVal)
},
minIMGsrc() {
this.init()
},
maxIMGsrc() {
this.init()
}
},
mounted() {
this.init()
},
methods: {
init() {
this.imgBoxWidth = this.width
this.imgBoxHeight = this.height
this.$set(this.minImgStyle, 'width', this.imgBoxWidth + 'px')
this.$set(this.minImgStyle, 'height', this.imgBoxHeight + 'px')
this.$set(this.maxImgStyle, 'width', this.imgBoxWidth + 'px')
this.$set(this.maxImgStyle, 'height', this.imgBoxHeight + 'px')
this.$set(this.minImgBoxStyle, 'width', this.imgBoxWidth + 'px')
this.$set(this.minImgBoxStyle, 'height', this.imgBoxHeight + 'px')
this.$set(this.maxImgBoxStyle, 'width', this.imgBoxWidth + 'px')
this.$set(this.maxImgBoxStyle, 'height', this.imgBoxHeight + 'px')
this.$set(this.maxImgBoxStyle, 'left', this.imgBoxWidth + 'px')
this.areaWidth = this.imgBoxWidth / this.scale
this.areaHeight = this.imgBoxHeight / this.scale
this.finalMinIMGsrc = this.minIMGsrc
if (!this.maxIMGsrc) {
this.finalMaxIMGsrc = this.minIMGsrc
}
this.$set(this.areaMarkStyle, 'width', this.areaWidth + 'px')
this.$set(this.areaMarkStyle, 'height', this.areaHeight + 'px')
this.$set(this.maxImgStyle, 'transform', 'scale(' + this.scale + ')')
},
mouseEnter() {
this.show = true
},
mouseLeave() {
this.show = false
},
mousemove(e) {
// 获取文档顶端与屏幕顶部之间的距离
// scrollTop指的是“元素中的内容”超出“元素上边界”的那部分的高度
const documentScrollTop =
document.documentElement.scrollTop || document.body.scrollTop
// 获取鼠标相对于屏幕的坐标
const mouseClientX = e.clientX
const mouseClientY = e.clientY
// 获取小照片相对于屏幕位置信息
// getBoundingClientRect()用于获得页面中某个元素的左，上，右和下分别相对浏览器视窗的位置。
const minImgPosition = this.$refs.minImg.getBoundingClientRect()
const minImgX = minImgPosition.left
const minImgY = minImgPosition.top
// 计算出探测块相对于小图片的坐标
let areaLeft = mouseClientX - minImgX - this.areaWidth / 2
let areaTop = mouseClientY - minImgY - this.areaHeight / 2
if (documentScrollTop > 0) {
areaTop = documentScrollTop + areaTop
}
const minLeft = 0
const maxLeft = this.imgBoxWidth - this.areaWidth
const minTop = 0
const maxTop = this.imgBoxHeight - this.areaHeight
// 禁止探测块移出小图片
if (areaLeft < minLeft) {
areaLeft = minLeft
}
if (areaLeft > maxLeft) {
areaLeft = maxLeft
}
if (areaTop < minTop) {
areaTop = minTop
}
if (areaTop > maxTop) {
areaTop = maxTop
}
// 更新探测块的坐标
this.$set(this.areaMarkStyle, 'left', areaLeft + 'px')
this.$set(this.areaMarkStyle, 'top', areaTop + 'px')
// 更新放大后照片的坐标
this.$set(
this.maxImgStyle,
'left',
((this.scale - 1) * this.imgBoxWidth) / 2 - areaLeft * this.scale + 'px'
)
this.$set(
this.maxImgStyle,
'top',
((this.scale - 1) * this.imgBoxHeight) / 2 - areaTop * this.scale + 'px'
)
}
}
}
</script>
<style scoped>
.Magnifying {
height: 380px;
width: 380px;
}
.box {
border: 1px solid darkgray;
position: relative;
overflow: hidden;
box-sizing: border-box;
}
.areaMark {
position: absolute;
background: url(//img-tmdetail.alicdn.com/tps/i4/T12pdtXaldXXXXXXXX-2-2.png);
}
.maxImgBox {
position: absolute;
z-index: 999;
}
</style>
src/main.js
浏览文件 @ f50b6fb5
......@@ -21,7 +21,10 @@ import { getConfigKey } from "@/api/system/config";
import { parseTime, resetForm, addDateRange, selectDictLabel, download, handleTree } from "@/utils/ruoyi";
import Pagination from "@/components/Pagination";
import VueAwesomeSwiper from 'vue-awesome-swiper' // 引入swiper
Vue.use(VueAwesomeSwiper) // 注册swiper
// import 'swiper/css/swiper.css' // 引入swiper样式/
import 'swiper/swiper-bundle.css'
// 全局方法挂载
Vue.prototype.getDicts = getDicts
Vue.prototype.getConfigKey = getConfigKey
......
src/views/system/goodsimport/components/goodsdetail.vue 0 → 100644
浏览文件 @ f50b6fb5
<template>
<div id="box" class="box" style="height: 100%; overflow-y: scroll; ">
<el-breadcrumb style='margin-left:50px; font-size:16px;font-weight:900;'>
<el-breadcrumb-item >{{goodsinfor.category_first_name}}</el-breadcrumb-item>
<el-breadcrumb-item v-if='goodsinfor.category_second_name'>{{goodsinfor.category_second_name}}</el-breadcrumb-item>
<el-breadcrumb-item v-if='goodsinfor.category_three_name'>{{goodsinfor.category_three_name}}</el-breadcrumb-item>
</el-breadcrumb>
<div style="width: 1220px;margin-right: auto;margin-left: auto;">
<div class="shoop_details">
<!-- 放大镜 -->
<div class="shoop_details_Magnifying" style="width: 420px">
<Magnifying :imageurl="picture" :imguser="'i'" />
<div class="details_Magnifying_content">
<div class="details_Magnifying_icon">
<i class="el-icon-arrow-left Magnifying_icon" />
</div>
<swiper ref="mySwiper" :options="swiperOptions">
<swiper-slide
v-for="(item, index) in lunimg"
:key="index"
class="details_Magnifying"
>
<img
id="images1"
class="details_Magnifying_img"
:class="
picture === item
? 'details_Magnifying_img_active'
: 'details_Magnifying_img'
"
:src="item"
alt="img"
@click="photo(index)"
>
</swiper-slide>
</swiper>
<div class="details_Magnifying_icon2">
<i class="el-icon-arrow-right Magnifying_icon" />
</div>
</div>
<!-- </swiper-slide>
</swiper> -->
<div
class="shoop_sku"
>
<div class="shoop_sku_text">
<span>编号：{{ goodsinfor.goods_id }}</span>
</div>
<div class="sku_text">
<span>SKU：{{ goodsinfor.seller_id }}</span>
</div>
</div>
</div>
<!-- 详情 -->
<div
class="shoop_brand"
>
<div class="shoop_brand_tutorial" >{{goodsinfor.goods_name}}</div>
<!-- 价格start -->
<div class="test">
<div class="shoop_brand_price">
<div>
<span class="shoop_brand_price_text" >商城价</span>
<span style="font-size: 24px">￥</span>
<span class="shoop_brand_price_money">{{ goodsprice/100 }}</span>
</div>
<div class="shoop_brand_price_oldMoney">
[￥{{ scprice/100}}]
</div>
<div>
<span class="shoop_brand_price_marketing">营销价</span>
<span
class="shoop_brand_marketing_text"
>￥{{ jdactivity_price/100 }}</span>
</div>
</div>
<div class="shoop_brand_evaluation">
<div class="shoop_brand_evaluation_sell">
<!-- <span>已出售</span><span class="sell_text">{{sale_goods(goodsinfor) }}</span> -->
<span>已售出</span><span class="sell_text">{{sale_goods(goodsinfor) }}</span>
</div>
<div class="shoop_brand_evaluation_text">
<span class="evaluation_line textColor">评价</span><span class="evaluation_text blueColor">
<el-rate disabled text-color="red" style="line-height: 10px;
display: inline-block;" v-model="value1"></el-rate>
</span>
</div>
<div class="shoop_brand_evaluation_cumulative">
<span class="evaluation_line textColor">累计评价</span>
<span class="cumulative_text blueColor">9999+</span>
<span class="blueColor">+</span>
</div>
<div style="flex: 25%" />
</div>
</div>
<!-- 价格end -->
<div class="shoop_distributions textFont">
<!-- 配送start -->
<el-row class="shoop_distributions_delivery">
<!-- <el-col :span="2" style="text-align: right;">配送至：</el-col> -->
<el-col :span="10">
<!-- <el-cascader v-model="el_value" v-if="el_valuestatus" @change="elvalueclick" :props="props" placeholder="请选择" style="width:150px;margin-left:12px;"> -->
</el-cascader>
</el-col>
<el-col :span="12" class="distributions_have_goods">
<!-- 有接口后做判断 -->
<!-- <span class="distributions_goods textColor">{{centext}}</span>
<span
class="distributions_address textColor"
>{{ sourcename }} / {{ freename }}</span> -->
</el-col>
</el-row>
<!-- 配送end -->
<!-- 规格start -->
<div class="distributions_specifications" v-if='adsp'>
<el-row
v-for="(item,index) in specs"
:key="index"
class="distributions_specifications_box"
>
<el-col :span="2" style="text-align: right;">
<span class="specifications_text">{{ item.spec_name }}：</span>
</el-col>
<el-col :span="22">
<div
v-for="(iten,indexchild) in item.spec_value"
:class="{'aactivs':iten.classstatus}"
:key="indexchild"
:skuid="item.id"
:id="iten.id"
class="specifications_box_size"
@click="sku_p(index,indexchild,item.id,iten.value)"
>
{{ iten.value}}
<!-- <img v-show='iten.classstatus' src="@/assets/images/choose.png" alt="image" style='position:absolute;bottom:0px;right:0;'> -->
</div>
</el-col>
<!-- <i class="el-icon-check"/> v-show="showImage" :class="item.defaultColor.specifications ? 'none' : ''"-->
</el-row>
</div>
<!-- 规格end -->
<el-row class="shoop_number">
<el-col :span='2' style="text-align: right;">数量：</el-col>
<el-col :span='22' >
<el-input-number size="mini" v-model="good_numble" @change="goodsstock()" :min="1" :max="stock" label="描述文字" style="margin-left:12px;"></el-input-number>
</el-col>
</el-row>
<div>
<!-- <el-button class="shoop_button" v-if="(jdstatusd==18||jdstatus==0)&&sourcecrous==2">该商品已下架，欢迎挑选其他商品！</el-button>
<el-button class="shoop_button" @click="addcart_submit($event)" v-if="jdstatusd!=18">加入采购单</el-button>
<el-button class="shoop_button" @click="addcart_submits($event)" v-if="jdstatus!=0&&sourcecrous==2&&(source==2||source==7)" >查看第三方详情</el-button> -->
</div>
</div>
</div>
</div>
<!-- 商品详情 -->
<div style="background-color: #fff">
<div
style="padding: 0 20px"
>
<!-- 商品详情 header-->
<div style="display: block">
<div style="display: flex">
<div class="shoop_text">商品详情</div>
<div class="shoop_details_box" />
</div>
<div class="textFont shoop_goods">
<div class="shoop_goods_number">
商家货号：<span class="textColor">{{ goodsinfor.out_goods_id }}</span>
</div>
<div class="shoop_goods_number">
品牌：<span class="textColor">{{ goodsinfor.goods_brand }}</span>
</div>
<div class="shoop_goods_number">
产地：<span class="textColor">{{ goodsinfor.producing_area }}</span>
</div>
</div>
<!-- 回到顶部 v-if="showScroll"-->
</div>
<!-- 商品详情 content-->
<div v-html='goodsinfor.description' style='text-align: center;'>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { getgoodsdetail } from '@/api/module/goodsgement'
import Magnifying from '@/components/Magnifying'
export default {
components: {
Magnifying,
},
props: {
goodsId: {
type: Object,
required: true
}
},
data() {
return {
el_valuestatus:true,
el_value: [],//地址
props: {
checkStrictly: false ,
expandTrigger: 'click',
emitPath: true,
lazy: true,
lazyLoad:this.lazyLoad,
value: "id",
label: "name",
leaf: "leaf"
},
aitivindex:0,
spceindex:'',
showImage: false,
productActive: false,
default1: '',
default2: '',
picture: '',
goods: '有货',
price: '', // 选中规格的价钱
shopItemInfo: {}, // 存放要和选中的值进行匹配的数据
selectArr: [], // 存放被选中的值
subIndex: [], // 是否选中 因为不确定是多规格还是单规格，所以这里定义数组来判断
swiperOptions: {
// 分页器配置
pagination: {
el: '.swiper-pagination'
},
// 设定初始化时slide的索引
initialSlide: 0,
// Slides的滑动方向，可设置水平(horizontal)或垂直(vertical)
direction: 'horizontal',
// 箭头配置
navigation: {
nextEl: '.el-icon-arrow-right',
prevEl: '.el-icon-arrow-left'
},
// 一个屏幕展示的数量
slidesPerView: 5,
// 间距
spaceBetween: 10
},
value1:5,
old_goods_title:'',
sourcename:'',
freename:'',
centext:'有货',
iss :0,
arrs :[],
addresslable:'',
propsaddress:{
label: 'name',
value: 'id',
children: 'children',
// checkStrictly:true
},
valueoptionaddress:[],
optionsChangedaddress:false,
optionsdetiladdress:[],
skuids:'',
jdactivity_price:0,
jdstatus:1,
jdstatusd:1,
jdthird_id:'',
tmthird_id:'',
sourcecrous:'2',
source:2,
shopcartlist:{},
optionlist:{},
arr:true,
tip:true,
arr2:true,
cart_num:0,
optionsmg:[],
hovers:false,
hovers1:false,
hovers2:false,
hovers3:false,
cart_num:'0',
user:'测试',
adsp: false,
stock: 1,
good_numble: 1,
recommendss: [],
hotshow: true,
hot_goods: [], //店铺热销
goshopping: false,
lunimg: [], //商品小图图
bigimg: '', //大图
loading: true,
// logo_src: require('@/assets/images/logo.png'),
click_show: false,
specstrue: false,
specs: '',
specsitem:{},
html: '',
shopinfor: '', //店铺信息
goodsinforlist: '', //全部信息列表
commentLists: [], //评论列表
goodsprice: '', //商品价格
scprice: '', //市场价格
goodsinfor: '', //商品基础信息
checked: true,
valueStarNums: 5, // 显示点亮星星的数量
price: 200 * 100,
dataList: "1",
show: false, // 抵扣和赠送的弹出层
tulesTitle: '', // 抵扣和赠送的弹出层的标题
show7day: false, //7天包退弹出层
images: [],
isOpacity: false, //顶部返回和购物车导航是否透明
cart_num: 0, //购物车数量
current: 0,
isSelected: false, //是否收藏
screenWidth: document.body.clientWidth, // 屏幕尺寸
// goods:{},
showBase: false,
sku: {
tree: [],
list: [],
price: '1.00', // 默认价格（单位元）
stock_num: 10000000, // 商品总库存
collection_id: 2261, // 无规格商品 skuId 取 collection_id，否则取所选 sku 组合对应的 id
none_sku: false, // 是否无规格商品
hide_stock: false, // 是否隐藏剩余库存
},
goods_id: '',
goods: {
title: '测试商品',
picture: '',
price: 1,
origin: '',
},
specs_goods: {},
iscollection: ''
}
},
created() {
this.getdetail()
// this.el_value = [1,72]
// this.goodsonly()
},
mounted() {
},
methods: {
elvalueclick(){
// this.goodsonly()
},
lazyLoad(node, resolve) {
this.getData(node, resolve)
},
getData(node, resolve) {
const level = node.level
var date
if (level === 0) {
date = {
pid: 0
}
}
if (level === 1) {
date = {
pid: node.value
}
}
goodsjdAddress(date).then(res => {
var result
if (level === 0) {
result = res.data
result.forEach(item => {
item.value = item.id;
item.label = item.name
item.leaf = level
item.children=[]
})
}
if (level === 1) {
result = res.data
result.forEach(item => {
item.value = item.id;
item.label = item.name
//这句代码表示当点击最后一级的时候 label后面不会转圈圈 并把相关值赋值到选择器上
item.leaf = level >= 1
})
}
resolve(result)
})
},
sale_goods(infor){
return infor.sale
// if(infor.source==2){
// var strung = infor.third_id.toString()
// console.log(strung.substr(strung.length-4) ,'sdfghjk')
// var num_sale = Number(strung.substr(strung.length-4))
// return num_sale+infor.real_sale
// }else{
// return infor.sale
// }
},
//是否有货
goodsonly(){
let optionlist = JSON.parse(localStorage.getItem('optionlist'))
if(optionlist){
}else{
this.centext = '无货'
return false
}
let date = {
sku_id:optionlist.id,
goods_id:Number(this.$route.query.id),
address_id:this.el_value[1]?this.el_value[1]:72
}
debugger
addressCheckAvailable(date).then(res=>{
if(res.code==1){
//console.log(data.data,'----')
// if(res.data.data===0){
this.centext = '有货'
// }
// if(res.data.data === 1){
// that.centext = '无货'
// }
if(res.data.freight!==0){
this.freename = '邮费'+res.data.freight/100+'元'
}
if(res.data.freight===0){
this.freename = '包邮'
}
}else{
this.centext = '无货'
}
})
},
titlename(oldgoodsid){
let date = {
goods_id:oldgoodsid
}
chooseGoodsOldTitle(date).then(res=>{
if(res.code==1){
this.old_goods_title = res.data
}
})
},
addcart_submits(e) { //查看第三方详情
// debugger
if (this.goshopping) {
if(this.source ==2){
var url = 'https://item.jd.com/'+this.jdthird_id+'.html'
window.open(url)
}else if(this.source==7){
var url='https://detail.tmall.com/item.htm?id='+this.tmthird_id
window.open(url)
}else if(this.source==8){
// var url='https://product.suning.com/0000000000/'+this.tmthird_id+'.html'
// window.open(url)
}
} else {
this.$message({
message: '请选择商品规格',
type: 'warning'
});
}
},
goodsstock(){
// if (this.good_numble < this.stock) {
// this.good_numble = val
// }
},
allguige(id){
if(id){
let date = {
old_goods_id:id
}
getGoodsDesc(date).then(res=>{
if(res.code==1){
this.goodsinfor.description = res.data.description
}
})
}
},
getdetail() {
const date = {
goodsId: this.goodsId.goods_id
}
console.log(date)
getgoodsdetail(date).then(response => {
console.log(response)
if (response.code === 1) {
// this.detailData = res.data
debugger
this.goodsinfor = response.data
this.goodsprice = response.data.price
this.jdactivity_price = response.data.js_price
this.scprice = response.data.sc_price
this.stock =Number(response.data.stock)
this.lunimg = response.data.imgs
this.source =1
this.specs = response.data.specs //规格
this.optionsmg = response.data.specs_group
this.specsitem = response.data.specs
this.tmthird_id = response.data.goods_id
this.picture = response.data.imgs
// // 判断是否有规格
if (response.data.specs.length > 0) {
debugger
this.adsp = true
this.goshopping = true
this.specs_goods = {}
var assasa = []
response.data.specs.forEach((item,index)=>{
assasa.push(item.spec_value[0].value.toString())
this.specs_goods[item.id] = item.spec_value[0].value.toString()
item.spec_value.forEach((itemchild,index)=>{
if(index==0){
itemchild['classstatus']=true
}else{
itemchild['classstatus']=false
}
})
})
// console.log(this.specs_goods,'rrrr')
this.sku_lists(assasa)
} else {
this.goshopping = true
}
var is_des = 0;
var ajax_count = 0;
var timer_count = 0;
var _timer
if (this.goodsinfor.description) {
var str = this.goodsinfor.description
// $(".infor-div-detail").html(str);
}
}
}
)
},
sku_p(indexs,indexchild,skuid,id) {
localStorage.removeItem('optionlist')
this.specs[indexs].spec_value.forEach((item,index)=>{
if(indexchild==index){
this.$set(this.specs[indexs].spec_value[index],'classstatus',true)
}else{
this.$set(this.specs[indexs].spec_value[index],'classstatus',false)
}
this.$forceUpdate()
})
this.specs_goods[skuid] = id
// this.specs_goods['goods_id'] = that.getParam('id')
console.log(this.specs_goods)
let speclenth = this.specs.length
let specgoslenth = Object.keys(this.specs_goods).length
if (speclenth == specgoslenth) {
this.goshopping = true
var assasa=[]
for(let key in this.specs_goods){
console.log(key + '---' + this.specs_goods[key])
assasa.push(this.specs_goods[key].toString())
}
this.sku_lists(assasa)
this.goshopping = true
} else {
this.goshopping = false
}
},
sku_lists(a) {
// debugger
// console.log(JSON.stringify(localStorage).length)
this.loading = true
var arrsow = []
for(var i=0;i<this.optionsmg.length;i++){
var sa = this.optionsmg[i].spec_values
if(this.optionsmg[i].specs){
delete this.optionsmg[i].specs
}
if(this.isContained(a,sa)){
debugger
this.skupindex = i
this.optionsmg[i]['index']=i
arrsow.push(this.optionsmg[i])
break
}else{
this.loadingbtn = false
}
}
console.log(arrsow,'jump')
if(arrsow.length>0){
debugger
for(var i=0;i<arrsow.length;i++){
this.goodsprice = this.optionsmg[arrsow[i].index].price
this.jdactivity_price = this.optionsmg[arrsow[i].index].js_price
this.scprice = this.optionsmg[arrsow[i].index].sc_price
this.stock = this.optionsmg[arrsow[i].index].stock
this.optionsmg[arrsow[i].index]['title'] =this.goodsinfor.goods_name
this.optionsmg[arrsow[i].index]['img'] =this.goodsinfor.cover
// this.optionsmg[i].specs = JSON.stringify(this.specsitem)
localStorage.removeItem('optionlist')
// console.log(JSON.stringify(localStorage).length,'1')
// console.log(JSON.stringify(this.optionsmg[i]).length,'11')
debugger
localStorage.setItem('optionlist',JSON.stringify(this.optionsmg[arrsow[i].index]))
// console.log(JSON.stringify(localStorage).length,'2')
this.optionsmg[arrsow[i].index]['good_numble'] = this.good_numble
this.shopcartlist = this.optionsmg[arrsow[i].index]
console.log(this.optionsmg[arrsow[i].index])
this.jdthird_id = this.optionsmg[arrsow[i].index].third_id
this.skuids = this.optionsmg[arrsow[i].index].id
console.log(this.optionsmg[i],'最后')
this.jdstatusd = 1
// break
}
}else{
this.skuids = ''
this.jdstatusd = 18
}
var that = this
setTimeout(function (){
that.loading = false
}, 200)
},
isContained(a1,a2){
if ((!a1 && a2) || (a1 && ! a2)) return false;
if (a1.length !== a2.length) return false;
a1 = [].concat(a1);
a2 = [].concat(a2);
a1 = a1.sort();
a2 = a2.sort();
for (var i = 0, n = a1.length; i < n; i++) {
if (a1[i] !== a2[i]) return false;
}
return true;
},
// 赋值对应图片
photo(index) {
this.picture = this.lunimg[index]
},
//规格
}
}
</script>
<style scoped>
/* // CSS样式为倒叙 */
.none {
display: none;
}
.Magnifying_icon {
color: #fff;
line-height: 65px;
width: 28px;
text-align: center;
}
.details_Magnifying_icon {
height: 65px;
width: 25px;
background:rgba(127,127,127,0.9);
position: absolute;
opacity: 0.3;
top: 10px;
left: 0;
z-index: 999;
}
.details_Magnifying_icon:hover{
opacity: 0.9;
}
.details_Magnifying_icon2 {
height: 65px;
width: 25px;
background:rgba(127,127,127,0.9);
opacity: 0.3;
position: absolute;
top: 10px;
right: 0;
z-index: 999;
}
.details_Magnifying_icon2:hover{
opacity: 0.9;
}
.drawer_list_margin_have {
padding-right: 10px;
}
.drawer_list_margin {
padding-right: 0;
}
.details_Magnifying_img_active {
border: 1px solid #e23f24;
}
.details_Magnifying_img:hover {
border: 1px solid #e23f24;
cursor: pointer;
}
.details_Magnifying_img {
height: 65px;
width: 100%;
border: 1px solid #fff;
}
.details_Magnifying {
margin: 10px 0px;
width: 100%;
}
.details_Magnifying_content {
/* display: flex; */
position: relative;
}
.scroll_text {
color: #fff;
text-align: center;
font-size: 12px;
}
.top:hover {
background-color: #647dff;
cursor: pointer;
}
.top {
border-radius: 4px 4px;
background-color: #383838;
width: 40px;
height: 64px;
text-align: center;
}
.shoop_image {
width: 100%;
}
.shoop_goods_number {
flex: 33.33%;
color: #666666;
}
.shoop_goods {
display: flex;
padding: 20px 20px;
}
.shoop_text {
flex: 10%;
background-color: #e23f24;
color: #fff;
text-align: center;
line-height: 36px;
}
.shoop_details_box {
height: 36px;
width: 100%;
border-bottom: solid 1px #e23f24;
/* background-color: #f2f2f2; */
}
.sku_text {
text-align: center;
flex: 50%;
font-size: 14px;
color: #666666;
}
.shoop_sku_text {
flex: 35%;
font-size: 14px;
color: #666666;
border-right: 1px solid #999;
}
.shoop_sku {
display: flex;
position: relative;
}
::v-deep .el-input-number--medium .el-input-number__increase {
width: 27px;
height: 26px;
font-size: 14px;
}
::v-deep .el-input-number--medium {
width: 120px;
line-height: 28px;
overflow: hidden;
}
::v-deep .el-input-number--medium .el-input-number__decrease {
width: 27px;
height: 26px;
font-size: 14px;
}
.shoop_number {
line-height: 36px;
margin-bottom: 10px;
}
::v-deep .el-button {
/* //此处为el-input的样式修改 */
height: 40px !important;
}
.shoop_button {
height: 42px;
font-size: 16px;
color: #ffffff;
background: #e23f24;
border-radius: 4px;
}
.specifications_icon {
position: absolute;
overflow: hidden;
}
.specifications_icon_box {
position: relative;
margin-left: -16px;
top: 21px;
left: -17px;
}
.specifications_text {
line-height: 36px;
}
.test{
background:url(../../../../assets/image/price.png) no-repeat;
}
.specifications_box_size:hover {
border: 1px solid #e23f24;
cursor: pointer;
}
.specifications_box_size {
padding: 5px 10px;
display: inline-block;
margin: 0 12px 10px;
border: 1px solid #eeeeee;
position: relative;
}
.aactive{
border: 1px solid #e23f24;
}
.aactivs{
border: 1px solid #e23f24;
}
.distributions_specifications_box {
/* // display: flex;/ */
margin: 10px 0;
/* // flex-wrap: wrap; */
/* // justify-content: space-between; */
}
.distributions_specifications {
margin: 10px 0;
}
.distributions_goods {
/* // font-weight: 700; */
margin-right: 16px;
}
.distributions_have_goods {
}
.distributions_delivery_box {
}
.shoop_distributions_delivery {
line-height: 36px;
}
.distributions_address {
/* // font-weight: 700; */
}
.shoop_distributions {
padding: 10px 20px;
}
.cumulative_text {
margin-left: 5px;
}
.shoop_brand_evaluation_cumulative {
flex: 25%;
font-size: 14px;
}
.evaluation_text {
margin-left: 5px;
}
.evaluation_line {
border-left: #dbdcdd 1px solid;
padding-left: 20px;
}
.shoop_brand_evaluation_text {
flex: 25%;
font-size: 14px;
}
.sell_text {
font-size: 14px;
color: #e23f24;
margin-left: 5px;
}
.shoop_brand_evaluation_sell {
color: #333333;
font-size: 14px;
flex: 25%;
}
.shoop_brand_evaluation {
display: flex;
height: 53px;
padding: 0 20px;
line-height: 53px;
/* background-color: #f7f9fa; */
}
.shoop_brand_marketing_text {
font-size: 14px;
}
.shoop_brand_price_marketing {
font-size: 14px;
margin-right: 10px;
}
.shoop_brand_price_oldMoney {
font-size: 14px;
text-decoration: line-through;
margin-right: 40px;
}
.shoop_brand_price_money {
font-weight: 700;
font-size: 24px;
margin-right: 10px;
}
.shoop_brand_price_text {
font-size: 14px;
margin-right: 25px;
}
.shoop_brand_tutorial {
margin-bottom: 20px;
color: #333333;
font-size: 16px;
font-weight: 700;
}
.test{
}
.shoop_brand_price {
display: flex;
height: 54px;
padding: 0 20px;
line-height: 54px;
color: #fff;
}
.shoop_brand {
margin: 20px 20px 20px 0;
width: 100%;
}
.shoop_details_Magnifying {
padding: 20px 20px;
flex: 40%;
}
.shoop_details {
display: flex;
margin-top: 10px;
color: #666666;
/* background-color: #fff; */
}
/deep/ .maxImgBox{
width:455px !important;
height:455px !important;
}
/deep/ .el-input-group__append{
color: #fff;
background-color: #647dff;
border-color: #647dff;
}
</style>
src/views/system/goodsimport/goodsgement.vue
浏览文件 @ f50b6fb5
......@@ -60,12 +60,21 @@
<el-button
style="float:right;margin-left: 10px;"
type="danger"
v-if='radiomodel!=4'
size="mini"
:disabled="multiple"
@click="handleDelete"
@click="handledelsale('9','del','all')"
>批量删除
</el-button>
<el-button
style="float:right;margin-left: 10px;"
type="danger"
v-if='radiomodel==4'
size="mini"
:disabled="multiple"
@click="handledelgrain('9','all')"
>彻底删除
</el-button>
<el-button
v-if='radiomodel==1'
style="float:right;margin-left: 20px;"
......@@ -86,10 +95,11 @@
</el-button>
<el-button
v-if='radiomodel==4'
:disabled="multiple"
style="float:right;margin-left: 20px;"
type="primary"
size="mini"
@click="handleAdd"
@click="handledelsale('9','return','all')"
>批量还原
</el-button>
</div>
......@@ -161,7 +171,7 @@
v-if="radiomodel==4"
size="mini"
type="text"
@click="handleUpdate(scope.row)"
@click="handledelsale(scope.row,'return','one')"
>还原
</el-button>
<el-divider direction="vertical" v-if="radiomodel!=3"></el-divider>
......@@ -184,14 +194,14 @@
v-if="radiomodel!=4"
size="mini"
type="text"
@click="handleDelete(scope.row)"
@click="handledelsale(scope.row,'del','one')"
>删除
</el-button>
<el-button
v-if="radiomodel==4"
size="mini"
type="text"
@click="handleDelete(scope.row)"
@click="handledelgrain(scope.row,'one')"
>彻底删除
</el-button>
</div>
......@@ -210,8 +220,8 @@
<el-dialog title="编辑商品" :visible.sync="editisOpen" v-if="editisOpen" width="70%" class="freightTemplate-add">
<editGood :option="form" @closeIndexbtn="closeDialog" ></editGood>
</el-dialog>
<el-dialog title="商品详情" :visible.sync="isOpen" v-if="isOpen" width="70%" class="freightTemplate-add">
<goodDetail :option="form" @closeIndexbtn="closeDialog" ></goodDetail>
<el-dialog title="商品详情" :visible.sync="isOpen" center v-if="isOpen" width="70%" class="freightTemplate-add" :close-on-click-modal="false">
<goodDetail :goods-id="goodDetails" @closeIndexbtn="closeDialog" ></goodDetail>
</el-dialog>
</el-card>
</div>
......@@ -219,13 +229,16 @@
<script>
import goodDetail from './components/goodsdetail'
import editGood from '@/views/system/goods/add/index'
import {getlistGoods, shelvesStatus, delFreight, addFreight, updateFreight} from '@/api/module/goodsgement'
import {getlistGoods, shelvesStatus, delgoodsStatus} from '@/api/module/goodsgement'
import {dateFormat} from '@/utils'
export default {
name: "freight",
data() {
return {
goodDetails:{
goods_id:''
},
editisOpen: false,//编辑
downsale_count:'',//仓库数量
onsale_count:'',//上架数量
......@@ -306,6 +319,110 @@
}
},
methods: {
handledelgrain(row,isall){ //彻底删除
let good_id,is_on,title,message
if(isall=='one'){
good_id = [row.goods_id]
is_on = 2
title ="彻底删除"
message = "此操作将彻底删除该商品，是否继续？"
}else if(isall=='all'){
good_id = this.ids
is_on = 2
title ="彻底删除"
message = "此操作将彻底删除选中的商品，是否继续？"
}
let data={
'goods_id':good_id,
'is_on':is_on
}
this.$msgbox({
title: title,
message: message,
center:true,
showCancelButton: true,
confirmButtonText: '确定',
cancelButtonText: '取消',
beforeClose: (action, instance, done) => {
if (action === 'confirm') {
delgoodsStatus(data).then(res=>{
if(res.code==1){
done()
this.getList()
}
})
} else {
done();
}
}
}).then(action => {
this.$message({
type: 'success',
message: '操作成功！'
});
});
},
handledelsale(row,status,isall){//删除还原
let good_id,is_on,title,message
if(isall=='one'){
good_id = [row.goods_id]
if(status=='del'){ // 0 删除 1还原
is_on = 0
title ="删除"
message = "是否删除该商品！"
}
if(status=='return'){
is_on = 1
title ="还原"
message = "是否还原该商品！"
}
}else if(isall=='all'){
good_id = this.ids
if(status=='del'){
is_on = 0
title ="批量删除"
message = "是否删除选中的商品！"
}
if(status=='return'){
is_on = 1
title ="批量还原"
message = "是否还原选中的商品！"
}
}
let data={
'goods_id':good_id,
'is_on':is_on
}
this.$msgbox({
title: title,
message: message,
center:true,
showCancelButton: true,
confirmButtonText: '确定',
cancelButtonText: '取消',
beforeClose: (action, instance, done) => {
if (action === 'confirm') {
delgoodsStatus(data).then(res=>{
if(res.code==1){
done()
this.getList()
}
})
} else {
done();
}
}
}).then(action => {
this.$message({
type: 'success',
message: '操作成功！'
});
});
},
handleUpsale(row,status,isall){ //上下架
debugger
let good_id,is_onsale,title,message
......@@ -368,8 +485,9 @@
editgoods(){//商品编辑
this.editisOpen = true
},
lookdetail(){//预览商品详情
lookdetail(row){//预览商品详情
this.isOpen = true
this.goodDetails.goods_id = row.goods_id
},
radiomodelbtn(val){ //头部切换
console.log(val)
......@@ -467,23 +585,6 @@
this.isOpen = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
seller_id: null,
name: null,
sort: null,
is_default: null,
charge_type: null,
dispatching: null,
disdispatching: null,
publish: null,
created: null,
modified: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.formInline.page = 1;
......@@ -496,92 +597,14 @@
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.Id)
this.ids = selection.map(item => item.goods_id)
this.single = selection.length !== 1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
if(this.total >= 50) {
this.$message({ message: '您已经有50个运费模板了，暂时不再支持更多！',type: 'warning'});
return;
}
this.reset();
this.isOpen = true;
this.form = {
Id: 0,
Sort: 0,
Name: "0",
IsDefault: 0,
ChargeType: 0,
Dispatching: [
{
a: "全国",
f: 500,
fp: 10,
n: 100,
np: 5,
}
],
Disdispatching: "",
Publish: 0,
};
this.title = "添加运费模板";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.isOpen = true;
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
debugger
if (valid) {
if (this.form.id != null) {
updateFreight(this.form).then(response => {
if (response.code === 0) {
this.msgSuccess("修改成功");
this.isOpen = false;
this.getList();
}
});
} else {
addFreight(this.form).then(response => {
if (response.code === 0) {
this.msgSuccess("新增成功");
this.isOpen = false;
this.getList();
}
});
}
}
});
},
/*
* publish 启用禁用状态 1是启用，0 禁用
* */
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.Id || this.ids;
debugger
this.$confirm('是否确认删除运费模板编号为“' + ids + '"的数据？','警告',{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(async()=> {
this.loading = true;
let delResult = await delFreight(ids);
if(delResult.code === 1) {
this.$message({type: 'success',message: delResult.msg});
this.getList();
}
if(delResult.code === 0) {
this.$message({type: 'error',message: delResult.msg});
}
this.loading = false;
}).catch(()=> {});
},
} //methods结束
};
</script>
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论