Merge branch 'master' of gitee.com:beijing_hongye_huicheng/lilishop-ui

master
misworga831 2023-07-24 15:11:03 +08:00
commit d058d7d6e8
13 changed files with 366 additions and 585 deletions

View File

@ -10,6 +10,7 @@
"dependencies": {
"@amap/amap-jsapi-loader": "0.0.7",
"axios": "^0.19.2",
"dplayer": "^1.27.1",
"js-cookie": "^2.2.1",
"less": "^2.7.0",
"less-loader": "^5.0.0",

View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg width="24" height="24" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M24 44C35.0457 44 44 35.0457 44 24C44 12.9543 35.0457 4 24 4C12.9543 4 4 12.9543 4 24C4 35.0457 12.9543 44 24 44Z" fill="none" stroke="#333" stroke-width="4" stroke-linejoin="round"/><path d="M20 24V17.0718L26 20.5359L32 24L26 27.4641L20 30.9282V24Z" fill="none" stroke="#333" stroke-width="4" stroke-linejoin="round"/></svg>

After

Width:  |  Height:  |  Size: 468 B

View File

@ -4,22 +4,15 @@
<!-- 详情左侧展示数据图片收藏举报 -->
<div class="item-detail-left">
<!-- 大图放大镜 -->
<!-- <div id="dplayer"></div> -->
<div class="item-detail-big-img">
<pic-zoom :url="imgList[imgIndex].url" :scale="2"></pic-zoom>
</div>
<div
v-if="skuDetail.goodsType !== 'VIRTUAL_GOODS'"
style="margin-top:10px;rgb(153, 149, 149);"
>
实物商品
</div>
<div
v-else-if="skuDetail.goodsType == 'VIRTUAL_GOODS'"
style="margin-top:10px;rgb(153, 149, 149);"
>
虚拟商品
</div>
<!-- <div id="dplayer"></div> -->
<div class="item-detail-img-row">
<div
class="item-detail-img-small"
@mouseover="imgIndex = index"
@ -44,6 +37,18 @@
<div class="item-detail-title">
<p>
{{ skuDetail.goodsName }}
<Tag
v-if="skuDetail.goodsType !== 'VIRTUAL_GOODS'"
style="margin-top:10px;rgb(153, 149, 149);"
>
实物商品
</Tag>
<Tag
v-else-if="skuDetail.goodsType == 'VIRTUAL_GOODS'"
style="margin-top:10px;rgb(153, 149, 149);"
>
虚拟商品
</Tag>
</p>
</div>
<div class="sell-point">
@ -272,6 +277,7 @@
class="add-buy-car"
v-if="$route.query.way !== 'POINT' && skuDetail.authFlag === 'PASS'"
>
<Button
type="error"
v-if="skuDetail.goodsType !== 'VIRTUAL_GOODS'"
@ -287,9 +293,15 @@
@click="buyNow"
>立即购买</Button
>
<Tooltip content="观看视频" v-if="skuDetail.goodsVideo">
<img class="view-video" @click="showGoodsVideo = true" :src="require('@/assets/iconfont/play.svg')" alt="">
</Tooltip>
</div>
</div>
</div>
<Modal title="浏览视频" v-model="showGoodsVideo">
<div id="dplayer"></div>
</Modal>
</div>
</div>
</template>
@ -297,6 +309,7 @@
<script>
import Promotion from "./Promotion.vue";
import PicZoom from "vue-piczoom"; //
import DPlayer from "dplayer";
import {
collectGoods,
isCollection,
@ -304,6 +317,7 @@ import {
cancelCollect,
} from "@/api/member.js";
import { addCartGoods } from "@/api/cart.js";
export default {
name: "ShowGoods",
props: {
@ -321,14 +335,22 @@ export default {
if (this.wholesaleList && this.wholesaleList.length > 0) {
this.count = this.wholesaleList[0].num;
}
this.swiperGoodsImg();
},
deep: true,
immediate: true,
},
showGoodsVideo(val){
if(val){
this.initVideo();
}
}
},
data() {
return {
showGoodsVideo:false,
goodsVideo:"",
wholesaleList: [],
count: 1, //
imgIndex: 0, //
@ -368,6 +390,24 @@ export default {
},
},
methods: {
// video
initVideo(){
if(!this.goodsVideo ){
setTimeout(()=>{
this.goodsVideo = new DPlayer({
container: document.getElementById('dplayer'),
video: {
url:this.skuDetail.goodsVideo,
},
});
},100)
}
},
changeCount(val) {
if (this.wholesaleList && this.wholesaleList.length > 0) {
if (this.count <= this.wholesaleList[0].num) {
@ -544,6 +584,7 @@ export default {
this.imgList = e.specImage;
}
});
},
},
mounted() {
@ -599,6 +640,7 @@ export default {
.item-detail-left {
width: 350px;
margin-right: 30px;
}
@ -607,8 +649,14 @@ export default {
height: 350px;
box-shadow: 0px 0px 8px $border_color;
cursor: pointer;
}
}
#dplayer{
width: 100%;
height: 100%;
}
.item-detail-big-img img {
width: 100%;
}
@ -842,11 +890,14 @@ export default {
.add-buy-car-box {
width: 100%;
margin-top: 15px;
border-top: 1px dotted $border_color;
}
.add-buy-car {
display: flex;
align-items: center;
margin-top: 15px;
> * {
margin: 0 4px;
@ -869,5 +920,8 @@ export default {
color: red;
margin-bottom: 5px;
}
.view-video{
cursor: pointer;
}
/******************商品图片及购买详情结束******************/
</style>

View File

@ -153,7 +153,9 @@
</div>
</div>
</template>
<div @click="moreOptions" v-if="tagsContent.length>4" class="more-options">{{showTagCount===5?'':''}}<Icon :type="showTagCount===5?'ios-arrow-down':'ios-arrow-up'" /></div>
<div @click="moreOptions" v-if="tagsContent.length>4" class="more-options">
{{showTagCount===5?'更多筛选项':'收起筛选项'}}
</div>
</div>
</div>
</template>

View File

@ -178,6 +178,7 @@ export default {
//
handleSearch(key) {
this.params.keyword = key;
this.$route.query.keyword = key
this.params.pageNumber = 0;
this.getGoodsList();
},

View File

@ -2,7 +2,7 @@
<div>
<BaseHeader></BaseHeader>
<Search></Search>
<cateNav></cateNav>
<div class="title-bg"><p>文章帮助中心</p></div>
<div class="container width_1200">
<Layout class="layoutAll">

View File

@ -70,7 +70,7 @@ export default {
"Button",
{
props: {
type: this.index == params.index ? "primary" : "",
type: this.index == params.index ? "primary" : "default",
size: "small",
},
on: {

View File

@ -24,7 +24,6 @@ let externals = {
"js-cookie": "Cookies",
"sockjs-client": "SockJS",
"@antv/g2": "G2",
dplayer: "DPlayer"
};
// 使用CDN的内容
@ -39,8 +38,6 @@ let cdn = {
"https://cdn.pickmall.cn/cdn/iview.min.js",
"https://cdn.pickmall.cn/cdn/vue-lazyload.min.js",
"https://cdn.pickmall.cn/cdn/js.cookie.min.js",
"https://cdn.pickmall.cn/cdn/DPlayer.min.js",
"https://cdn.pickmall.cn/cdn/sockjs.min.js",
"https://gw.alipayobjects.com/os/lib/antv/g2/4.1.24/dist/g2.min.js"
]

View File

@ -15,7 +15,7 @@
"@antv/g2": "^4.1.14",
"@tinymce/tinymce-vue": "^3.2.0",
"axios": "^0.21.1",
"dplayer": "^1.27.0",
"dplayer": "^1.27.1",
"js-cookie": "^2.2.1",
"node-sass": "^4.14.1",
"price-color": "^1.0.2",

View File

@ -84,8 +84,9 @@ export default {
{
title: "商品价格",
key: "price",
width: 120,
render: (h, params) => {
return h("priceColorScheme", {props:{value:params.row.price,color:this.$mainColor}} );
return h("priceColorScheme", {props:{value:params.row.price || 0,color:this.$mainColor}} );
},
},
{

View File

@ -4,12 +4,7 @@
<img :src="previewImage" v-if="visible" style="width: 100%">
</Modal>
<div class="content-goods-publish">
<Form
ref="baseInfoForm"
:label-width="120"
:model="baseInfoForm"
:rules="baseInfoFormRule"
>
<Form ref="baseInfoForm" :label-width="120" :model="baseInfoForm" :rules="baseInfoFormRule">
<div class="base-info-item">
<h4>基本信息</h4>
<div class="form-item-view">
@ -21,111 +16,50 @@
<span> &gt; {{ this.baseInfoForm.categoryName[2] }}</span>
</FormItem>
<FormItem label="商品名称" prop="goodsName">
<Input
v-model="baseInfoForm.goodsName"
clearable
placeholder="商品名称"
style="width: 260px"
type="text"
/>
<Input v-model="baseInfoForm.goodsName" clearable placeholder="商品名称" style="width: 260px" type="text" />
</FormItem>
<FormItem label="商品价格" prop="price">
<Input
v-model="baseInfoForm.price"
clearable
placeholder="商品价格"
style="width: 260px"
type="text"
/>
<Input v-model="baseInfoForm.price" clearable placeholder="商品价格" style="width: 260px" type="text" />
</FormItem>
<FormItem label="商品卖点" prop="sellingPoint">
<Input
v-model="baseInfoForm.sellingPoint"
:rows="4"
style="width: 260px"
type="textarea"
/>
<Input v-model="baseInfoForm.sellingPoint" :rows="4" style="width: 260px" type="textarea" />
</FormItem>
<FormItem label="商品品牌" prop="brandId">
<Select
v-model="baseInfoForm.brandId"
filterable
style="width: 200px"
>
<Option
v-for="item in brandList"
:key="item.id"
:label="item.name"
:value="item.id"
></Option>
<Select v-model="baseInfoForm.brandId" filterable style="width: 200px">
<Option v-for="item in brandList" :key="item.id" :label="item.name" :value="item.id"></Option>
</Select>
</FormItem>
</div>
<h4>商品交易信息</h4>
<div class="form-item-view">
<FormItem
class="form-item-view-el"
label="计量单位"
prop="goodsUnit"
>
<FormItem class="form-item-view-el" label="计量单位" prop="goodsUnit">
<Select v-model="baseInfoForm.goodsUnit" style="width: 100px">
<Option
v-for="(item, index) in goodsUnitList"
:key="index"
:value="item"
>{{ item }}
<Option v-for="(item, index) in goodsUnitList" :key="index" :value="item">{{ item }}
</Option>
</Select>
</FormItem>
<FormItem
class="form-item-view-el"
label="销售模式"
prop="salesModel"
>
<RadioGroup
v-if="baseInfoForm.goodsType != 'VIRTUAL_GOODS'"
v-model="baseInfoForm.salesModel"
button-style="solid"
type="button"
@on-change="renderTableData(skuTableData)"
>
<FormItem class="form-item-view-el" label="销售模式" prop="salesModel">
<RadioGroup v-if="baseInfoForm.goodsType != 'VIRTUAL_GOODS'" v-model="baseInfoForm.salesModel"
button-style="solid" type="button" @on-change="renderTableData(skuTableData)">
<Radio label="RETAIL" title="零售型">零售型</Radio>
<Radio label="WHOLESALE" title="批发型">批发型</Radio>
</RadioGroup>
<RadioGroup
v-else
v-model="baseInfoForm.salesModel"
button-style="solid"
type="button"
>
<RadioGroup v-else v-model="baseInfoForm.salesModel" button-style="solid" type="button">
<Radio label="RETAIL" title="零售型">
<span>虚拟型</span>
</Radio>
</RadioGroup>
</FormItem>
<FormItem
v-if="baseInfoForm.salesModel == 'WHOLESALE'"
class="form-item-view-el"
label="销售规则"
prop="wholesaleRule"
>
<FormItem v-if="baseInfoForm.salesModel == 'WHOLESALE'" class="form-item-view-el" label="销售规则"
prop="wholesaleRule">
<div class="form-item-view-wholesale">
<div>
<Table
:columns="wholesaleColumns"
:data="wholesaleData"
border
>
<Table :columns="wholesaleColumns" :data="wholesaleData" border>
<template slot="wholesaleNum" slot-scope="{ row, index }">
<div>
<Input
v-model="wholesaleData[index].num"
min="1"
number
type="number"
@on-blur="checkWholesaleNum(index)"
>
<Input v-model="wholesaleData[index].num" min="1" number type="number"
@on-blur="checkWholesaleNum(index)">
<span slot="append">{{
baseInfoForm.goodsUnit || ""
}}</span>
@ -133,213 +67,135 @@
</div>
</template>
<template slot="wholesalePrice" slot-scope="{ row, index }">
<div
style="
<div style="
display: flex;
justify-content: space-between;
align-items: center;
"
>
<Input
v-model="wholesaleData[index].price"
min="1"
number
style="width: 190px"
type="number"
@on-blur="checkWholesalePrice(index)"
>
">
<Input v-model="wholesaleData[index].price" min="1" number style="width: 190px" type="number"
@on-blur="checkWholesalePrice(index)">
<span slot="append"></span>
</Input>
<Button
v-if="index > 0"
size="small"
style="margin-left: 5px"
type="error"
@click="handleDeleteWholesaleData(index)"
>删除
<Button v-if="index > 0" size="small" style="margin-left: 5px" type="error"
@click="handleDeleteWholesaleData(index)">删除
</Button>
</div>
</template>
</Table>
<Button
v-if="wholesaleData.length < 3"
icon="md-add"
style="margin-top: 10px"
@click="handleAddWholesaleData()"
>
<Button v-if="wholesaleData.length < 3" icon="md-add" style="margin-top: 10px"
@click="handleAddWholesaleData()">
添加价格区间
</Button>
</div>
<div class="form-item-view-wholesale-preview">
<Table
:columns="wholesalePreviewColumns"
:data="wholesaleData"
border
></Table>
<Table :columns="wholesalePreviewColumns" :data="wholesaleData" border></Table>
</div>
</div>
</FormItem>
</div>
<h4>商品规格及图片</h4>
<div class="form-item-view">
<FormItem
class="form-item-view-el required"
label="商品图片"
prop="goodsGalleryFiles"
>
<FormItem class="form-item-view-el required" label="商品图片" prop="goodsGalleryFiles">
<div style="display: flex; flex-wrap: flex-start">
<vuedraggable
:animation="200"
:list="baseInfoForm.goodsGalleryFiles"
>
<div
v-for="(item, __index) in baseInfoForm.goodsGalleryFiles"
:key="__index"
class="demo-upload-list"
>
<vuedraggable :animation="200" :list="baseInfoForm.goodsGalleryFiles">
<div v-for="(item, __index) in baseInfoForm.goodsGalleryFiles" :key="__index" class="demo-upload-list">
<template>
<img :src="item.url" />
<div class="demo-upload-list-cover">
<div>
<Icon
size="30"
type="md-search"
@click.native="handleViewGoodsPicture(item.url)"
></Icon>
<Icon
size="30"
type="md-trash"
@click.native="handleRemoveGoodsPicture(item)"
></Icon>
<Icon size="30" type="md-search" @click.native="handleViewGoodsPicture(item.url)"></Icon>
<Icon size="30" type="md-trash" @click.native="handleRemoveGoodsPicture(item)"></Icon>
</div>
</div>
</template>
</div>
</vuedraggable>
<Upload
ref="upload"
:action="uploadFileUrl"
:before-upload="handleBeforeUploadGoodsPicture"
:format="['jpg', 'jpeg', 'png']"
:headers="{ ...accessToken }"
:max-size="1024"
:on-exceeded-size="handleMaxSize"
:on-format-error="handleFormatError"
:on-success="handleSuccessGoodsPicture"
:show-upload-list="false"
multiple
style="margin-left: 10px"
type="drag"
>
<Upload ref="upload" :action="uploadFileUrl" :before-upload="handleBeforeUploadGoodsPicture"
:format="['jpg', 'jpeg', 'png']" :headers="{ ...accessToken }" :max-size="2048"
:on-exceeded-size="handleMaxSize" :on-format-error="handleFormatError"
:on-success="handleSuccessGoodsPicture" :show-upload-list="false" multiple type="drag">
<div style="width: 148px; height: 148px; line-height: 148px">
<Icon size="20" type="md-add"></Icon>
</div>
</Upload>
</div>
<Modal v-model="goodsPictureVisible" title="View Image">
<img
v-if="goodsPictureVisible"
:src="previewGoodsPicture"
style="width: 100%"
/>
<img v-if="goodsPictureVisible" :src="previewGoodsPicture" style="width: 100%" />
</Modal>
</FormItem>
<div class="flex mb-10">
<div class="goods-video-label">
上传视频
</div>
<div class="flex goods-video" >
<div>
<Upload ref="upload" :action="uploadFileUrl" v-if="!baseInfoForm.goodsVideo" style="width: 150px; height: 150px;"
:format="['mp4', 'avi',]" :headers="{ ...accessToken }" :max-size="10240"
:on-exceeded-size="handleMaxSize" :on-format-error="handleFormatError"
:on-success="handleSuccessGoodsVideo" :show-upload-list="false" type="drag">
<div style="width: 148px; height: 148px; line-height: 148px">
<Icon size="20" type="md-add"></Icon>
</div>
</Upload>
<span class="theme_color" v-if="baseInfoForm.goodsVideo"></span>
</div>
<Button class="view-video" v-if="baseInfoForm.goodsVideo" @click="showGoodsVideo = true"></Button>
<Button type="primary" v-if="baseInfoForm.goodsVideo" @click="baseInfoForm.goodsVideo = ''"></Button>
</div>
</div>
<div class="layout" style="width: 100%">
<Collapse v-model="open_panel">
<Panel name="1">
自定义规格项
<div slot="content">
<Form>
<div
v-for="(item, $index) in skuInfo"
:key="$index"
class="sku-item-content"
>
<div v-for="(item, $index) in skuInfo" :key="$index" class="sku-item-content">
<Card :bordered="true" class="ivu-card-body">
<Button
slot="extra"
type="primary"
@click="handleCloseSkuItem($index, item)"
>
<Button slot="extra" type="primary" @click="handleCloseSkuItem($index, item)">
删除规格
</Button>
<div>
<FormItem
class="sku-item-content-val flex"
label="规格名"
>
<AutoComplete
v-model="item.name"
:data="skuData"
:filter-method="filterMethod"
:maxlength="30"
placeholder="请输入规格名称"
style="width: 150px"
@on-focus="changeSkuItem(item.name)"
@on-change="
<FormItem class="sku-item-content-val flex" label="规格名">
<AutoComplete v-model="item.name" :data="skuData" :filter-method="filterMethod"
:maxlength="30" placeholder="请输入规格名称" style="width: 150px"
@on-focus="changeSkuItem(item.name)" @on-change="
editSkuItem(item.name, $index, item)
"
>
">
</AutoComplete>
</FormItem>
</div>
<div class="flex sku-val">
<Form :model="item" class="flex">
<!--规格值文本列表-->
<FormItem
v-for="(val, index) in item.spec_values"
:key="index"
class="sku-item-content-val flex"
label="规格项"
>
<AutoComplete
ref="input"
v-model="val.value"
:data="skuVal"
:filter-method="filterMethod"
:maxlength="30"
placeholder="请输入规格项"
style="width: 150px"
@on-focus="changeSkuVals(val, item.name)"
@on-blur="checkSkuVal(val, index)"
@on-change="skuValueChange(val, index, item)"
>
<FormItem v-for="(val, index) in item.spec_values" :key="index"
class="sku-item-content-val flex" label="规格项">
<AutoComplete ref="input" v-model="val.value" :data="skuVal" :filter-method="filterMethod"
:maxlength="30" placeholder="请输入规格项" style="width: 150px"
@on-focus="changeSkuVals(val, item.name)" @on-blur="checkSkuVal(val, index)"
@on-change="skuValueChange(val, index, item)">
</AutoComplete>
<Button
size="small"
style="margin-left: 10px"
type="primary"
@click="handleCloseSkuValue(val, index, item)"
>
<Button size="small" style="margin-left: 10px" type="primary"
@click="handleCloseSkuValue(val, index, item)">
删除
</Button>
</FormItem>
</Form>
</div>
<div>
<Button @click="addSpec($index, item)"
>添加规格值
<Button @click="addSpec($index, item)">添加规格值
</Button>
</div>
</Card>
</div>
</Form>
<Button
class="add-sku-btn"
size="small"
type="primary"
@click="addSkuItem"
>添加规格项
<Button class="add-sku-btn" size="small" type="primary" @click="addSkuItem">
</Button>
&nbsp;
<Button
class="add-sku-btn"
size="small"
type="warning"
@click="handleClearSku"
>清空规格项
<Button class="add-sku-btn" size="small" type="warning" @click="handleClearSku">
</Button>
</div>
</Panel>
@ -347,159 +203,81 @@
规格详细
<div slot="content">
<div slot="content">
<Table
:columns="skuTableColumn"
:data="skuTableData"
class="mt_10"
style="
<Table :columns="skuTableColumn" :data="skuTableData" class="mt_10" style="
width: 100%;
.ivu-table-overflowX {
overflow-x: hidden;
}
"
>
">
<template slot="sn" slot-scope="{ row }">
<Input
v-model="row.sn"
clearable
placeholder="请输入货号"
@on-change="updateSkuTable(row, 'sn')"
/>
<Input v-model="row.sn" clearable placeholder="请输入货号" @on-change="updateSkuTable(row, 'sn')" />
</template>
<div
v-if="baseInfoForm.goodsType !== 'VIRTUAL_GOODS'"
slot="weight"
slot-scope="{ row }"
>
<Input
v-model="row.weight"
clearable
placeholder="请输入重量"
@on-change="updateSkuTable(row, 'weight')"
>
<div v-if="baseInfoForm.goodsType !== 'VIRTUAL_GOODS'" slot="weight" slot-scope="{ row }">
<Input v-model="row.weight" clearable placeholder="请输入重量"
@on-change="updateSkuTable(row, 'weight')">
<span slot="append">kg</span>
</Input>
</div>
<template slot="quantity" slot-scope="{ row }">
<Input
v-model="row.quantity"
clearable
placeholder="请输入库存"
@on-change="updateSkuTable(row, 'quantity')"
>
<Input v-model="row.quantity" clearable placeholder="请输入库存"
@on-change="updateSkuTable(row, 'quantity')">
<span slot="append">{{
baseInfoForm.goodsUnit || ""
}}</span>
</Input>
</template>
<template slot="cost" slot-scope="{ row }">
<Input
v-model="row.cost"
clearable
placeholder="请输入成本价"
@on-change="updateSkuTable(row, 'cost')"
>
<Input v-model="row.cost" clearable placeholder="请输入成本价"
@on-change="updateSkuTable(row, 'cost')">
<span slot="append"></span>
</Input>
</template>
<template slot="price" slot-scope="{ row }">
<Input
v-model="row.price"
clearable
placeholder="请输入价格"
@on-change="updateSkuTable(row, 'price')"
>
<Input v-model="row.price" clearable placeholder="请输入价格"
@on-change="updateSkuTable(row, 'price')">
<span slot="append"></span>
</Input>
</template>
<template slot="wholePrice0" slot-scope="{ row }">
<Input
v-if="wholesaleData[0]"
v-model="wholesaleData[0].price"
clearable
disabled
>
<Input v-if="wholesaleData[0]" v-model="wholesaleData[0].price" clearable disabled>
<span slot="append"></span>
</Input>
</template>
<template slot="wholePrice1" slot-scope="{ row }">
<Input
v-if="wholesaleData[1]"
v-model="wholesaleData[1].price"
clearable
disabled
>
<Input v-if="wholesaleData[1]" v-model="wholesaleData[1].price" clearable disabled>
<span slot="append"></span>
</Input>
</template>
<template slot="wholePrice2" slot-scope="{ row }">
<Input
v-if="wholesaleData[2]"
v-model="wholesaleData[2].price"
clearable
disabled
>
<Input v-if="wholesaleData[2]" v-model="wholesaleData[2].price" clearable disabled>
<span slot="append"></span>
</Input>
</template>
<template slot="images" slot-scope="{ row }">
<div @mouseover="mouseOver(row)" @mouseleave="mouseLeave"><Button @click="editSkuPicture(row)" type="error" >编辑图片 </Button></div>
<Modal
v-model="showSkuPicture"
:styles="{ top: '30px' }"
cancel-text="取消"
class-name="sku-preview-modal"
ok-text="结束编辑"
title="编辑图片"
@on-ok="updateSkuPicture()"
>
<div @mouseover="mouseOver(row)" @mouseleave="mouseLeave"><Button @click="editSkuPicture(row)"
type="error">编辑图片 </Button></div>
<Modal v-model="showSkuPicture" :styles="{ top: '30px' }" cancel-text=""
class-name="sku-preview-modal" ok-text="结束编辑" title="编辑图片" @on-ok="updateSkuPicture()">
<div class="preview-picture">
<img
v-if="previewPicture !== ''"
:src="previewPicture"
/>
<img v-if="previewPicture !== ''" :src="previewPicture" />
</div>
<Divider />
<vuedraggable
:animation="200"
:list="selectedSku.images"
style="display: inline-block"
>
<div
v-for="(img, __index) in selectedSku.images"
:key="__index"
class="sku-upload-list"
>
<vuedraggable :animation="200" :list="selectedSku.images" style="display: inline-block">
<div v-for="(img, __index) in selectedSku.images" :key="__index" class="sku-upload-list">
<template>
<img :src="img.url" />
<div class="sku-upload-list-cover">
<Icon
type="md-search"
@click="handleView(img.url)"
></Icon>
<Icon
type="md-trash"
@click="handleRemove(img, __index)"
></Icon>
<Icon type="md-search" @click="handleView(img.url)"></Icon>
<Icon type="md-trash" @click="handleRemove(img, __index)"></Icon>
</div>
</template>
</div>
</vuedraggable>
<Upload
ref="uploadSku"
:action="uploadFileUrl"
:before-upload="handleBeforeUpload"
:format="['jpg', 'jpeg', 'png']"
:headers="{ ...accessToken }"
:max-size="1024"
:on-exceeded-size="handleMaxSize"
:on-format-error="handleFormatError"
:on-success="handleSuccess"
:show-upload-list="false"
multiple
style="display: inline-block; width: 58px"
type="drag"
>
<Upload ref="uploadSku" :action="uploadFileUrl" :before-upload="handleBeforeUpload"
:format="['jpg', 'jpeg', 'png']" :headers="{ ...accessToken }" :max-size="2048"
:on-exceeded-size="handleMaxSize" :on-format-error="handleFormatError"
:on-success="handleSuccess" :show-upload-list="false" multiple
style="display: inline-block; width: 58px" type="drag">
<div>
<Icon size="55" type="ios-camera"></Icon>
</div>
@ -516,13 +294,11 @@
<h4 v-if="showContent"></h4>
<div v-if="showContent" class="form-item-view">
<div>
<FormItem
class="form-item-view-el"
:label="contentImage"
>
<FormItem class="form-item-view-el" :label="contentImage">
<!-- {{item.url}} -->
<div style="width:100%;display:flex;" v-for="(item, index) in listImages.images" :key="index">
<img style="width:100px;flex:1;margin-top:10px;cursor:pointer;" :src="item.url" @click="getImages(item.url)"/>
<img style="width:100px;flex:1;margin-top:10px;cursor:pointer;" :src="item.url"
@click="getImages(item.url)" />
</div>
</FormItem>
</div>
@ -530,99 +306,45 @@
<h4>商品详情描述</h4>
<div class="form-item-view">
<div class="tree-bar">
<FormItem
class="form-item-view-el"
label="店内分类"
prop="shopCategory"
>
<Tree
ref="tree"
:check-strictly="false"
:data="shopCategory"
show-checkbox
style="text-align: left"
@on-select-change="selectTree"
@on-check-change="changeSelect"
></Tree>
<FormItem class="form-item-view-el" label="店内分类" prop="shopCategory">
<Tree ref="tree" :check-strictly="false" :data="shopCategory" show-checkbox style="text-align: left"
@on-select-change="selectTree" @on-check-change="changeSelect"></Tree>
</FormItem>
</div>
<FormItem
class="form-item-view-el"
label="PC商品描述"
prop="intro"
style="width: 100%"
>
<FormItem class="form-item-view-el" label="PC商品描述" prop="intro" style="width: 100%">
<Alert class='editor-alert' type="warning">将文件夹下的图片进行拖拽到文本框内即可完成单/多图片上传</Alert>
<editor
ref="editor"
v-model="baseInfoForm.intro"
:init="{ ...initEditor, height: '800px' }"
openXss
></editor>
<editor ref="editor" v-model="baseInfoForm.intro" :init="{ ...initEditor, height: '800px' }" openXss>
</editor>
<div class="promise-intro-btn">
<Button type="primary" @click="promiseIntroEditor"
>将PC商品描述同步到移动端描述
<Button type="primary" @click="promiseIntroEditor">PC
</Button>
</div>
</FormItem>
<FormItem
class="form-item-view-el"
label="移动端描述"
prop="skuList"
style="width: 100%"
>
<editor
ref="editor"
v-model="baseInfoForm.mobileIntro"
:init="{ ...initEditor, height: '800px' }"
openXss
></editor>
<FormItem class="form-item-view-el" label="移动端描述" prop="skuList" style="width: 100%">
<editor ref="editor" v-model="baseInfoForm.mobileIntro" :init="{ ...initEditor, height: '800px' }" openXss>
</editor>
</FormItem>
</div>
<div v-if="baseInfoForm.goodsType != 'VIRTUAL_GOODS'">
<h4>商品物流信息</h4>
<div class="form-item-view">
<FormItem
class="form-item-view-el"
label="物流模板"
prop="templateId"
>
<FormItem class="form-item-view-el" label="物流模板" prop="templateId">
<Select v-model="baseInfoForm.templateId" style="width: 200px">
<Option
v-for="item in logisticsTemplate"
:key="item.id"
:value="item.id"
>{{ item.name }}
<Option v-for="item in logisticsTemplate" :key="item.id" :value="item.id">{{ item.name }}
</Option>
</Select>
</FormItem>
<FormItem
v-if="baseInfoForm.salesModel == 'WHOLESALE'"
class="form-item-view-el"
label="商品重量"
prop="weight"
>
<Input
v-model="baseInfoForm.weight"
placeholder="请输入商品重量"
>
<span slot="append">kg</span></Input
>
<FormItem v-if="baseInfoForm.salesModel == 'WHOLESALE'" class="form-item-view-el" label="商品重量"
prop="weight">
<Input v-model="baseInfoForm.weight" placeholder="请输入商品重量">
<span slot="append">kg</span></Input>
</FormItem>
</div>
<h4>其他信息</h4>
<div class="form-item-view">
<FormItem
class="form-item-view-el"
label="商品发布"
prop="release"
>
<RadioGroup
v-model="baseInfoForm.release"
button-style="solid"
type="button"
>
<FormItem class="form-item-view-el" label="商品发布" prop="release">
<RadioGroup v-model="baseInfoForm.release" button-style="solid" type="button">
<Radio :label="1" title="立即发布">
<span>立即发布</span>
</Radio>
@ -631,16 +353,8 @@
</Radio>
</RadioGroup>
</FormItem>
<FormItem
class="form-item-view-el"
label="商品推荐"
prop="skuList"
>
<RadioGroup
v-model="baseInfoForm.recommend"
button-style="solid"
type="button"
>
<FormItem class="form-item-view-el" label="商品推荐" prop="skuList">
<RadioGroup v-model="baseInfoForm.recommend" button-style="solid" type="button">
<Radio :label="1" title="推荐">
<span>推荐</span>
</Radio>
@ -651,28 +365,14 @@
</FormItem>
</div>
<div class="form-item-view-bottom">
<Collapse
v-for="(paramsGroup, groupIndex) in goodsParams"
:key="paramsGroup.groupName"
v-model="params_panel"
:title="paramsGroup.groupName"
class="mb_10"
style="text-align: left"
>
<Collapse v-for="(paramsGroup, groupIndex) in goodsParams" :key="paramsGroup.groupName"
v-model="params_panel" :title="paramsGroup.groupName" class="mb_10" style="text-align: left">
<Panel :name="paramsGroup.groupName">
{{ paramsGroup.groupName }}
<p slot="content">
<FormItem
v-for="(params, paramsIndex) in paramsGroup.params"
:key="paramsIndex"
:label="`${params.paramName}`"
>
<Select
v-model="params.paramValue"
clearable
placeholder="请选择"
style="width: 200px"
@on-change="
<FormItem v-for="(params, paramsIndex) in paramsGroup.params" :key="paramsIndex"
:label="`${params.paramName}`">
<Select v-model="params.paramValue" clearable placeholder="请选择" style="width: 200px" @on-change="
selectParams(
paramsGroup,
groupIndex,
@ -680,14 +380,9 @@
paramsIndex,
params.paramValue
)
"
>
<Option
v-for="option in params.options.split(',')"
:key="option"
:label="option"
:value="option"
></Option>
">
<Option v-for="option in params.options.split(',')" :key="option" :label="option" :value="option">
</Option>
</Select>
</FormItem>
</p>
@ -708,6 +403,12 @@
<Button type="primary" @click="saveToDraft"></Button>
</ButtonGroup>
</div>
<Modal v-model="showGoodsVideo" title="查看视频">
<div id="dplayer">
</div>
</Modal>
</div>
</template>
<script>
@ -719,6 +420,7 @@ import Editor from "@tinymce/tinymce-vue";
import { initEditor } from "@/views/lili-components/editor/config";
import { uploadFile } from "@/libs/axios";
import { regular } from "@/utils";
import DPlayer from 'dplayer';
export default {
name: "goodsOperationSec",
@ -752,6 +454,7 @@ export default {
regular,
initEditor,
total: 0,
goodsVideo: "",
showContent: false,
listImages: [],
contentImage: "",
@ -847,6 +550,7 @@ export default {
goodsParamsDTOList: [],
/** 商品分类中文名 */
categoryName: [],
goodsVideo: "",
},
/** 表格头 */
skuTableColumn: [],
@ -893,6 +597,8 @@ export default {
shopCategory: [],
/** 商品单位列表 */
goodsUnitList: [],
//
showGoodsVideo: false,
ignoreColumn: [
//
"_index",
@ -907,6 +613,14 @@ export default {
],
};
},
watch: {
//
showGoodsVideo(val) {
if (val) {
this.initVideo();
}
}
},
methods: {
getImages(v) {
this.previewImage = v;
@ -982,6 +696,19 @@ export default {
this.selectedSku = row;
this.showSkuPicture = true;
},
//
initVideo() {
if (this.baseInfoForm.goodsVideo) {
this.goodsVideo = new DPlayer({
container: document.getElementById('dplayer'),
video: {
url: this.baseInfoForm.goodsVideo,
pic: ''
},
});
}
console.log('初始化操作')
},
pre() {
//
this.$parent.activestep--;
@ -1107,11 +834,17 @@ export default {
desc: "文件 " + file.name + " 的格式不正确",
});
},
handleSuccessGoodsVideo(res, file) {
if (file.response) {
file.url = file.response.result;
this.baseInfoForm.goodsVideo = file.url;
}
},
//
handleMaxSize(file) {
handleMaxSize(size = 2) {
this.$Notice.warning({
title: "超过文件大小限制",
desc: "图片大小不能超过1MB",
desc: `图片大小不能超过${size}MB`,
});
},
//
@ -1975,6 +1708,8 @@ export default {
this.categoryId = cateId[2];
this.baseInfoForm.categoryPath = cateId.toString();
this.baseInfoForm.goodsType = this.firstData.goodsType;
/** 获取该商城分类下 商品参数信息 */
this.GET_GoodsParams();
/** 查询品牌列表 */
@ -1998,10 +1733,32 @@ export default {
.ivu-select .ivu-select-dropdown {
overflow: hidden !important;
}
.editor-alert {
text-align: left;
}
#dplayer {
}
/* .tox-notifications-container{
display: none !important;
} */
.goods-video-label {
width: 120px;
text-align: right;
padding: 10px 12px 10px 0;
}
.goods-video {
align-items: center;
}
.mb-10 {
margin-bottom: 10px;
}
.view-video{
margin: 0 10px;
}
</style>

View File

@ -1,81 +1,45 @@
<template>
<div class="logistics">
<Card>
<Table
:loading="loading"
border
:columns="columns"
:data="data"
ref="table"
></Table>
<Table :loading="loading" border :columns="columns" :data="data" ref="table"></Table>
</Card>
<Modal v-model="openModal" :title="openModalTitle" @on-ok="submit" @on-cancel="cancelModal">
<h3 style="color: #ff3c2a; margin-bottom: 10px">是否需要电子面单</h3>
<RadioGroup
v-model="faceSheetForm.faceSheetFlag"
style="margin-bottom: 20px"
@on-change="getfaceSheetFlag($event)"
>
<Radio :label="true">
<span>需要</span>
</Radio>
<Radio :label="false">
<span>不需要</span>
</Radio>
</RadioGroup>
<Card v-if="onpenText" class="modalStyle">
<ButtonGroup style="margin-bottom: 10px;">
<Button :type="faceSheetForm.faceSheetFlag ? 'primary' : 'default'"
@click="faceSheetForm.faceSheetFlag = true">需要</Button>
<Button :type="!faceSheetForm.faceSheetFlag ? 'primary' : 'default'"
@click="faceSheetForm.faceSheetFlag = false">不需要</Button>
</ButtonGroup>
<Card v-if="openText" class="modalStyle">
<h3 style="color: #ff3c2a; margin-bottom: 10px">请输入详细信息</h3>
<Form ref="formValidate" :label-width="150" label-position="right" :model="faceSheetForm" :rules="ruleValidate">
<FormItem label="customerName" prop="customerName">
<Input
v-model="faceSheetForm.customerName"
type="text"
class="faceSheetInput"
></Input
></FormItem>
<Input v-model="faceSheetForm.customerName" type="text" class="faceSheetInput"></Input>
</FormItem>
<FormItem label="customerPwd" prop="customerPwd">
<Input
v-model="faceSheetForm.customerPwd"
type="text"
class="faceSheetInput"
></Input>
<Input v-model="faceSheetForm.customerPwd" type="text" class="faceSheetInput"></Input>
</FormItem>
<FormItem label="monthCode" prop="monthCode">
<Input
v-model="faceSheetForm.monthCode"
type="text"
class="faceSheetInput"
></Input
></FormItem>
<Input v-model="faceSheetForm.monthCode" type="text" class="faceSheetInput"></Input>
</FormItem>
<FormItem label="sendSite" prop="sendSite">
<Input
v-model="faceSheetForm.sendSite"
type="text"
class="faceSheetInput"
></Input
></FormItem>
<Input v-model="faceSheetForm.sendSite" type="text" class="faceSheetInput"></Input>
</FormItem>
<FormItem label="sendStaff" prop="sendStaff">
<Input
v-model="faceSheetForm.sendStaff"
type="text"
class="faceSheetInput"
></Input
></FormItem>
<Input v-model="faceSheetForm.sendStaff" type="text" class="faceSheetInput"></Input>
</FormItem>
<FormItem label="支付方式" prop="payType">
<Select
v-model="faceSheetForm.payType"
class="faceSheetInput">
<Select v-model="faceSheetForm.payType" class="faceSheetInput">
<Option value="1">现付</Option>
<Option value="2">到付</Option>
<Option value="3">月结</Option>
<Option value="4">第三方支付(仅SF支持)</Option>
</Select
></FormItem>
</Select>
</FormItem>
<FormItem label="快递类型" prop="expType">
<Input
v-model="faceSheetForm.expType"
type="text"
class="faceSheetInput"/>
<Input v-model="faceSheetForm.expType" type="text" class="faceSheetInput" />
</FormItem>
<div style="width:100%;text-align:center;">
<a style="padding-right: 20px" @click="frontDownload('use')">使</a>
@ -215,19 +179,25 @@ export default {
},
],
data: [], //
onpenText: false,
openText: false,
};
},
watch: {
'faceSheetForm.faceSheetFlag'(val) {
this.openText = val ? true : false
console.log(this.openText )
}
},
methods: {
//
getfaceSheetFlag(e) {
console.log(e);
if (e === true) {
this.onpenText = true;
console.log("打开");
this.openText = true;
} else {
this.onpenText = false;
console.log("关闭");
this.openText = false;
}
},
//
@ -255,9 +225,9 @@ export default {
this.openModal = true;
this.searchForm.faceSheetFlag = "false"; // v
if (this.searchForm.faceSheetFlag == "true") {
this.onpenText = true;
this.openText = true;
} else {
this.onpenText = false;
this.openText = false;
}
},
//
@ -270,10 +240,10 @@ export default {
// this.searchForm = res.result.recordes;
this.faceSheetForm.faceSheetFlag = res.result.faceSheetFlag; // v
if (this.faceSheetForm.faceSheetFlag === true) {
this.onpenText = true;
this.openText = true;
} else {
this.faceSheetForm.faceSheetFlag = false
this.onpenText = false;
this.openText = false;
}
this.faceSheetForm.customerName = res.result.customerName;
this.faceSheetForm.customerPwd = res.result.customerPwd;

View File

@ -272,8 +272,6 @@ import liliMap from "@/views/my-components/map/index";
import regionMap from "@/views/lili-components/region";
import * as RegExp from "@/libs/RegExp.js";
import Cookies from "js-cookie";
import {editDeliverAddress, getDeliverAddress} from "../../api/shops";
export default {
name: "shopSetting",
components: {
@ -298,7 +296,7 @@ export default {
},
//form
stockWarningForm: {
stockWarning: "", //
stockWarning: 0, //
},
//im form
udeskForm: {
@ -458,7 +456,7 @@ export default {
Cookies.set("userInfoSeller", JSON.stringify(res.result));
//
this.$nextTick(() => {
this.stockWarningForm.stockWarning = res.result.stockWarning + "";
this.stockWarningForm.stockWarning = res.result.stockWarning;
});
if (res.result.merchantEuid) {
//id
@ -479,7 +477,6 @@ export default {
API_Shop.getDeliverAddress().then(res=>{
if(res.success){
if(res.result!= '' && res.result != null){
console.log(89898999998)
this.addressGoods = res.result;
this.regionGoods = res.result.salesConsignorAddressPath;
this.regionIdS = res.result.salesConsignorAddressId;