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