wangmingchuan
/
yanzong_vue_store
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

一键获取

Browse Source
master
fanfan 8 months ago
parent 077c2e3e84
commit ddb2ab313f
4 changed files with 840 additions and 1000 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 11
      src/api/goods/index.js
  2. 51
      src/components/SelectImage/SelectImage.vue
  3. 36
      src/views/goods/Create.vue
  4. 386
      src/views/goods/modules/Update.vue

11
src/api/goods/index.js
Unescape View File

@ -14,7 +14,16 @@ const api = {
exportData: '/goods/import', exportData: '/goods/import',
setStorePrice: 'store/setStorePrice', setStorePrice: 'store/setStorePrice',
getStorePriceInfo: 'store/getStorePriceInfo', getStorePriceInfo: 'store/getStorePriceInfo',
pool: '/goods/pool' pool: '/goods/pool',
collector:'/goods/collector'
}
export function getCollector (params) {
return axios({
url: api.collector,
method: 'get',
params
})
} }
/** /**
* 更新状态 * 更新状态

51
src/components/SelectImage/SelectImage.vue
Unescape View File

@ -2,53 +2,26 @@
<div class="image-list clearfix" :class="{ multiple }"> <div class="image-list clearfix" :class="{ multiple }">
<!-- 文件列表 --> <!-- 文件列表 -->
<!-- draggable是拖拽组件 --> <!-- draggable是拖拽组件 -->
<draggable <draggable v-if="selectedItems.length" v-model="selectedItems" @start="drag=true" @end="drag=false" @update="onUpdate">
v-if="selectedItems.length"
v-model="selectedItems"
@start="drag=true"
@end="drag=false"
@update="onUpdate"
>
<transition-group class="draggable-item" type="transition" :name="'flip-list'"> <transition-group class="draggable-item" type="transition" :name="'flip-list'">
<div <div v-for="(item, index) in selectedItems" :key="item.file_id>0?item.file_id:item.id" class="file-item" :style="{ width: `${width}px`, height: `${width}px` }">
v-for="(item, index) in selectedItems"
:key="item.file_id"
class="file-item"
:style="{ width: `${width}px`, height: `${width}px` }"
>
<!-- 预览图 --> <!-- 预览图 -->
<a :href="item.preview_url" target="_blank"> <a :href="item.preview_url" target="_blank">
<div class="img-cover" :style="{ backgroundImage: `url('${item.preview_url}')` }"></div> <div class="img-cover" :style="{ backgroundImage: `url('${item.preview_url}')` }"></div>
</a> </a>
<!-- 删除文件 --> <!-- 删除文件 -->
<a-icon <a-icon class="icon-close" theme="filled" type="close-circle" @click="handleDeleteFileItem(index)" />
class="icon-close"
theme="filled"
type="close-circle"
@click="handleDeleteFileItem(index)"
/>
</div> </div>
</transition-group> </transition-group>
</draggable> </draggable>
<!-- 图片选择器 --> <!-- 图片选择器 -->
<!-- 如果单选, selectedItems无内容时 显示 --> <!-- 如果单选, selectedItems无内容时 显示 -->
<!-- 如果多选, selectedItems数量小于 maxNum 显示 --> <!-- 如果多选, selectedItems数量小于 maxNum 显示 -->
<div <div v-show="(!multiple && selectedItems.length <= 0) || (multiple && selectedItems.length < maxNum)" class="selector" :style="{ width: `${width}px`, height: `${width}px` }" @click="handleSelectImage">
v-show="(!multiple && selectedItems.length <= 0) || (multiple && selectedItems.length < maxNum)"
class="selector"
:style="{ width: `${width}px`, height: `${width}px` }"
@click="handleSelectImage"
>
<a-icon class="icon-plus" :style="{ fontSize: `${width * 0.4}px` }" type="plus" /> <a-icon class="icon-plus" :style="{ fontSize: `${width * 0.4}px` }" type="plus" />
</div> </div>
<!-- 文件选择器 --> <!-- 文件选择器 -->
<FilesModal <FilesModal ref="FilesModal" :multiple="multiple" :maxNum="maxNum" :selectedNum="selectedItems.length" @handleSubmit="handleSelectImageSubmit" />
ref="FilesModal"
:multiple="multiple"
:maxNum="maxNum"
:selectedNum="selectedItems.length"
@handleSubmit="handleSelectImageSubmit"
/>
</div> </div>
</template> </template>
@ -77,7 +50,8 @@ export default {
// 默认选中的文件 // 默认选中的文件
defaultList: PropTypes.array.def([]), defaultList: PropTypes.array.def([]),
// 元素的尺寸(宽) // 元素的尺寸(宽)
width: PropTypes.integer.def(80) width: PropTypes.integer.def(80),
source: PropTypes.any.def(0)
}, },
data() { data() {
return { return {
@ -141,12 +115,21 @@ export default {
return this.$emit('change', multiple ? [] : 0) return this.$emit('change', multiple ? [] : 0)
} }
// 生成fileId // 生成fileId
if (this.source == 1) {
let fileId = []
const list = multiple ? selectedItems.map(item => item) : selectedItems[0].file_id
list.forEach(function (item) {
fileId.push({ file_id: item.file_id, image: item.preview_url })
})
return this.$emit('change', fileId, selectedItems)
} else {
const fileId = multiple ? selectedItems.map(item => item.file_id) : selectedItems[0].file_id const fileId = multiple ? selectedItems.map(item => item.file_id) : selectedItems[0].file_id
// 触发change事件
return this.$emit('change', fileId, selectedItems) return this.$emit('change', fileId, selectedItems)
} }
} }
}
} }
</script> </script>

36
src/views/goods/Create.vue
Unescape View File

@ -15,14 +15,14 @@
<a-form-item label="商品类型" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="商品类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
<GoodsType v-decorator="['goods_type', { initialValue: 10}]" @change="onForceUpdate(true)" /> <GoodsType v-decorator="['goods_type', { initialValue: 10}]" @change="onForceUpdate(true)" />
</a-form-item> </a-form-item>
<!-- <a-form-item label="商品SKU" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="商品SKU" :labelCol="labelCol" :wrapperCol="wrapperCol">
<div style=" display: flex;align-items: center;width:100%"> <div style=" display: flex;align-items: center;width:100%">
<a-input style="width:242px" placeholder="输入商品SKU" v-decorator="['goods_no', { rules: [{ required: true, min: 2, message: '请输入至少2个字符' }] }]" /> <a-input style="width:242px" placeholder="输入商品SKU" v-decorator="['goods_no', { rules: [{ required: true, min: 2, message: '请输入至少2个字符' }] }]" />
<div class="action-item"> <div class="action-item">
<a-button type="primary" @click="handInfo">一键获取</a-button> <a-button type="primary" @click="handInfo">一键获取</a-button>
</div> </div>
</div> </div>
</a-form-item> --> </a-form-item>
<a-form-item label="商品名称" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="商品名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input placeholder="请输入商品名称" v-decorator="['goods_name', { rules: [{ required: true, min: 2, message: '请输入至少2个字符' }] }]" /> <a-input placeholder="请输入商品名称" v-decorator="['goods_name', { rules: [{ required: true, min: 2, message: '请输入至少2个字符' }] }]" />
</a-form-item> </a-form-item>
@ -38,7 +38,7 @@
</div> </div>
</a-form-item> </a-form-item>
<a-form-item label="商品图片" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="建议尺寸：750*750像素, 最多上传10张, 可拖拽图片调整顺序, 第1张将作为商品首图"> <a-form-item label="商品图片" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="建议尺寸：750*750像素, 最多上传10张, 可拖拽图片调整顺序, 第1张将作为商品首图">
<SelectImage multiple :maxNum="10" v-decorator="['imagesIds', { rules: [{ required: true, message: '请至少上传1张商品图片' }] }]" /> <SelectImage :defaultList="goods_images" :source='1' multiple :maxNum="10" v-decorator="['imagesIds', { rules: [{ required: true, message: '请至少上传1张商品图片' }] }]" />
</a-form-item> </a-form-item>
<a-form-item label="商品来源" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="商品来源" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-radio-group v-decorator="['goods_source', { initialValue: 'JD', rules: [{ required: true }] }]"> <a-radio-group v-decorator="['goods_source', { initialValue: 'JD', rules: [{ required: true }] }]">
@ -86,9 +86,9 @@
</a-radio-group> </a-radio-group>
</a-form-item> </a-form-item>
<a-form-item label="商品编码" :labelCol="labelCol" :wrapperCol="wrapperCol"> <!-- <a-form-item label="商品编码" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input placeholder="请输入商品编码" v-decorator="['goods_no']" /> <a-input placeholder="请输入商品编码" v-decorator="['goods_no']" />
</a-form-item> </a-form-item> -->
<a-form-item label="所属分类排行(0表示不参加排行)" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="所属分类排行(0表示不参加排行)" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input placeholder="所属分类排行" v-decorator="['paihang']" /> <a-input placeholder="所属分类排行" v-decorator="['paihang']" />
@ -407,7 +407,8 @@ export default {
} }
], ],
// 城市总数 // 城市总数
citysCount: null citysCount: null,
goods_images: []
} }
}, },
// 初始化数据 // 初始化数据
@ -420,11 +421,30 @@ export default {
}, },
methods: { methods: {
handInfo() { handInfo() {
const { form } = this
const goods_no = form.getFieldValue('goods_no')
if(goods_no){
let param = {
sku: goods_no
}
this.isLoading = true
GoodsApi.getCollector(param).then((result) => {
this.goods_images = result.data.goods_images
let obj = { let obj = {
goods_name: '测试', goods_name: result.data.name,
goods_price: 123 content: result.data.content,
goods_price: result.data.proxyPrice,
} }
this.form.setFieldsValue(obj) this.form.setFieldsValue(obj)
this.isLoading = false
})
.catch(() => {
this.isLoading = false
})
.finally(() => (this.isLoading = false))
}else{
this.$message.warning('请输入商品SKU', 1.5)
}
}, },
// 手动强制更新页面 // 手动强制更新页面
onForceUpdate(bool = false) { onForceUpdate(bool = false) {

386
src/views/goods/modules/Update.vue
Unescape View File

@ -1,14 +1,5 @@
<template> <template>
<a-modal <a-modal title="编辑商品" width="90%" :visible="visible" :confirmLoading="confirmLoading" :maskClosable="false" :destroyOnClose="true" @ok="handleSubmit" @cancel="handleCancel">
title="编辑商品"
width="90%"
:visible="visible"
:confirmLoading="confirmLoading"
:maskClosable="false"
:destroyOnClose="true"
@ok="handleSubmit"
@cancel="handleCancel"
>
<a-card :bordered="false"> <a-card :bordered="false">
<a-spin :spinning="isLoading"> <a-spin :spinning="isLoading">
<a-form :form="form" @submit="handleSubmit" :selfUpdate="true"> <a-form :form="form" @submit="handleSubmit" :selfUpdate="true">
@ -22,51 +13,32 @@
<!-- 基本信息 --> <!-- 基本信息 -->
<div class="tab-pane" v-show="tabKey == 0"> <div class="tab-pane" v-show="tabKey == 0">
<a-form-item label="商品类型" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="商品类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
<GoodsType <GoodsType :onlyShowChecked="true" v-decorator="['goods_type', { rules: [{ required: true }] }]" @change="onForceUpdate(true)" />
:onlyShowChecked="true" </a-form-item>
v-decorator="['goods_type', { rules: [{ required: true }] }]" <a-form-item label="商品SKU" :labelCol="labelCol" :wrapperCol="wrapperCol">
@change="onForceUpdate(true)" <div style=" display: flex;align-items: center;width:100%">
/> <a-input style="width:242px" placeholder="输入商品SKU" v-decorator="['goods_no', { rules: [{ required: true, min: 2, message: '请输入至少2个字符' }] }]" />
<div class="action-item">
<a-button type="primary" @click="handInfo">一键获取</a-button>
</div>
</div>
</a-form-item> </a-form-item>
<a-form-item label="商品名称" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="商品名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input <a-input placeholder="请输入商品名称" v-decorator="['goods_name', { rules: [{ required: true, min: 2, message: '请输入至少2个字符' }] }]" />
placeholder="请输入商品名称"
v-decorator="['goods_name', { rules: [{ required: true, min: 2, message: '请输入至少2个字符' }] }]"
/>
</a-form-item> </a-form-item>
<a-form-item label="商品型号" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="商品型号" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input <a-input placeholder="请输入商品型号" v-decorator="['cmmdty_model', { rules: [{ required: true, min: 2, message: '请输入至少2个字符' }] }]" />
placeholder="请输入商品型号"
v-decorator="['cmmdty_model', { rules: [{ required: true, min: 2, message: '请输入至少2个字符' }] }]"
/>
</a-form-item> </a-form-item>
<a-form-item label="商品分类" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="商品分类" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-tree-select <a-tree-select placeholder="请选择商品分类" :dropdownStyle="{ maxHeight: '500px', overflow: 'auto' }" :treeData="formData.categoryList" treeCheckable treeCheckStrictly allowClear
placeholder="请选择商品分类" v-decorator="['categorys', { rules: [{ required: true, message: '请至少选择1个商品分类' }] }]"></a-tree-select>
:dropdownStyle="{ maxHeight: '500px', overflow: 'auto' }"
:treeData="formData.categoryList"
treeCheckable
treeCheckStrictly
allowClear
v-decorator="['categorys', { rules: [{ required: true, message: '请至少选择1个商品分类' }] }]"
></a-tree-select>
<div class="form-item-help"> <div class="form-item-help">
<router-link target="_blank" :to="{ path: '/goods/category/index' }">去新增</router-link> <router-link target="_blank" :to="{ path: '/goods/category/index' }">去新增</router-link>
<a href="javascript:;" @click="onReloadCategoryList">刷新</a> <a href="javascript:;" @click="onReloadCategoryList">刷新</a>
</div> </div>
</a-form-item> </a-form-item>
<a-form-item <a-form-item label="商品图片" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="建议尺寸：750*750像素, 最多上传10张, 可拖拽图片调整顺序, 第1张将作为商品首图">
label="商品图片" <SelectImage ref="childComponent" multiple :source='1' :maxNum="10" :defaultList="formData.goods.goods_images" v-decorator="['imagesIds', { rules: [{ required: true, message: '请至少上传1张商品图片' }] }]" />
:labelCol="labelCol"
:wrapperCol="wrapperCol"
extra="建议尺寸：750*750像素, 最多上传10张, 可拖拽图片调整顺序, 第1张将作为商品首图"
>
<SelectImage
multiple
:maxNum="10"
:defaultList="formData.goods.goods_images"
v-decorator="['imagesIds', { rules: [{ required: true, message: '请至少上传1张商品图片' }] }]"
/>
</a-form-item> </a-form-item>
<a-form-item label="商品来源" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="商品来源" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-radio-group v-decorator="['goods_source', { initialValue: 0, rules: [{ required: true }] }]"> <a-radio-group v-decorator="['goods_source', { initialValue: 0, rules: [{ required: true }] }]">
@ -126,56 +98,29 @@
<a-input placeholder="热卖指数" v-decorator="['remaizhishu']" /> <a-input placeholder="热卖指数" v-decorator="['remaizhishu']" />
</a-form-item> </a-form-item>
<a-form-item <a-form-item v-if="form.getFieldValue('goods_type') == 10" label="配送方式" :labelCol="labelCol" :wrapperCol="wrapperCol">
v-if="form.getFieldValue('goods_type') == 10" <a-radio-group v-decorator="['is_ind_delivery_type', { initialValue: 0, rules: [{ required: true }] }]" @change="onForceUpdate()">
label="配送方式"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
>
<a-radio-group
v-decorator="['is_ind_delivery_type', { initialValue: 0, rules: [{ required: true }] }]"
@change="onForceUpdate()"
>
<a-radio :value="0">系统默认</a-radio> <a-radio :value="0">系统默认</a-radio>
<a-radio :value="1">单独配置</a-radio> <a-radio :value="1">单独配置</a-radio>
</a-radio-group> </a-radio-group>
<div v-show="form.getFieldValue('is_ind_delivery_type')"> <div v-show="form.getFieldValue('is_ind_delivery_type')">
<a-form-item extra="需在 [设置 - 配送方式] 中，开启支持的配送方式才可生效"> <a-form-item extra="需在 [设置 - 配送方式] 中，开启支持的配送方式才可生效">
<a-checkbox-group <a-checkbox-group :options="[
:options="[
{ label: '快递配送', value: 10 }, { label: '快递配送', value: 10 },
{ label: '上门自提', value: 20 }, { label: '上门自提', value: 20 },
]" ]" v-decorator="[
v-decorator="[
'delivery_type', 'delivery_type',
{ initialValue: [10, 20], rules: [{ required: true, message: '配送方式至少选择一个' }] }, { initialValue: [10, 20], rules: [{ required: true, message: '配送方式至少选择一个' }] },
]" ]" />
/>
</a-form-item> </a-form-item>
</div> </div>
</a-form-item> </a-form-item>
<a-form-item <a-form-item v-if="form.getFieldValue('goods_type') == 10" label="运费模板" :labelCol="labelCol" :wrapperCol="wrapperCol">
v-if="form.getFieldValue('goods_type') == 10" <a-select style="width: 300px" v-decorator="['delivery_id', { rules: [{ required: true, message: '请选择运费模板' }] }]" placeholder="请选择运费模板">
label="运费模板" <a-select-option v-for="(item, index) in formData.deliveryList" :key="index" :value="item.delivery_id">{{ item.name }}</a-select-option>
:labelCol="labelCol"
:wrapperCol="wrapperCol"
>
<a-select
style="width: 300px"
v-decorator="['delivery_id', { rules: [{ required: true, message: '请选择运费模板' }] }]"
placeholder="请选择运费模板"
>
<a-select-option
v-for="(item, index) in formData.deliveryList"
:key="index"
:value="item.delivery_id"
>{{ item.name }}</a-select-option
>
</a-select> </a-select>
<div class="form-item-help"> <div class="form-item-help">
<router-link target="_blank" :to="{ path: '/setting/delivery/template/create' }" <router-link target="_blank" :to="{ path: '/setting/delivery/template/create' }">新增模板</router-link>
>新增模板</router-link
>
<a href="javascript:;" @click="onReloadDeliveryList">刷新</a> <a href="javascript:;" @click="onReloadDeliveryList">刷新</a>
</div> </div>
</a-form-item> </a-form-item>
@ -197,10 +142,7 @@
<!-- 规格/库存 --> <!-- 规格/库存 -->
<div class="tab-pane" v-show="tabKey == 1"> <div class="tab-pane" v-show="tabKey == 1">
<a-form-item label="规格类型" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="规格类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-radio-group <a-radio-group v-decorator="['spec_type', { initialValue: 10, rules: [{ required: true }] }]" @change="onForceUpdate()">
v-decorator="['spec_type', { initialValue: 10, rules: [{ required: true }] }]"
@change="onForceUpdate()"
>
<a-radio :value="10" :disabled="formData.goods.isSpecLocked">单规格</a-radio> <a-radio :value="10" :disabled="formData.goods.isSpecLocked">单规格</a-radio>
<a-radio :value="20" :disabled="formData.goods.isSpecLocked">多规格</a-radio> <a-radio :value="20" :disabled="formData.goods.isSpecLocked">多规格</a-radio>
</a-radio-group> </a-radio-group>
@ -210,67 +152,30 @@
</a-form-item> </a-form-item>
<!-- 多规格的表单内容 --> <!-- 多规格的表单内容 -->
<div v-if="form.getFieldValue('spec_type') == 20"> <div v-if="form.getFieldValue('spec_type') == 20">
<MultiSpec <MultiSpec :source="1" ref="MultiSpec" :isSpecLocked="formData.goods.isSpecLocked" :defaultSpecList="formData.goods.specList" :defaultSkuList="formData.goods.skuList" />
:source="1"
ref="MultiSpec"
:isSpecLocked="formData.goods.isSpecLocked"
:defaultSpecList="formData.goods.specList"
:defaultSkuList="formData.goods.skuList"
/>
</div> </div>
<!-- 单规格的表单内容 --> <!-- 单规格的表单内容 -->
<div v-if="form.getFieldValue('spec_type') == 10"> <div v-if="form.getFieldValue('spec_type') == 10">
<a-form-item <a-form-item label="商品价格" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="商品的实际购买金额，最低0.01">
label="商品价格" <a-input-number :min="0.01" :precision="2" v-decorator="['goods_price', { rules: [{ required: true, message: '请输入商品价格' }] }]" />
:labelCol="labelCol"
:wrapperCol="wrapperCol"
extra="商品的实际购买金额，最低0.01"
>
<a-input-number
:min="0.01"
:precision="2"
v-decorator="['goods_price', { rules: [{ required: true, message: '请输入商品价格' }] }]"
/>
<span class="ml-10">元</span> <span class="ml-10">元</span>
</a-form-item> </a-form-item>
<a-form-item <a-form-item label="成本价" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="成本价仅用于商品页展示">
label="成本价"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
extra="成本价仅用于商品页展示"
>
<a-input-number :min="0.01" :precision="2" v-decorator="['cost_price']" /> <a-input-number :min="0.01" :precision="2" v-decorator="['cost_price']" />
<span class="ml-10">元</span> <span class="ml-10">元</span>
</a-form-item> </a-form-item>
<a-form-item <a-form-item label="当前库存数量" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="商品的实际库存数量，为0时用户无法下单">
label="当前库存数量" <a-input-number :min="0" :precision="0" v-decorator="[
:labelCol="labelCol"
:wrapperCol="wrapperCol"
extra="商品的实际库存数量，为0时用户无法下单"
>
<a-input-number
:min="0"
:precision="0"
v-decorator="[
'stock_num', 'stock_num',
{ initialValue: 100, rules: [{ required: true, message: '请输入库存数量' }] }, { initialValue: 100, rules: [{ required: true, message: '请输入库存数量' }] },
]" ]" />
/>
<span class="ml-10">件</span> <span class="ml-10">件</span>
</a-form-item> </a-form-item>
<a-form-item <a-form-item label="商品重量" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="商品的实际重量，用于计算运费">
label="商品重量" <a-input-number :min="0" v-decorator="[
:labelCol="labelCol"
:wrapperCol="wrapperCol"
extra="商品的实际重量，用于计算运费"
>
<a-input-number
:min="0"
v-decorator="[
'goods_weight', 'goods_weight',
{ initialValue: 0, rules: [{ required: true, message: '请输入库存数量' }] }, { initialValue: 0, rules: [{ required: true, message: '请输入库存数量' }] },
]" ]" />
/>
<span class="ml-10">千克 (Kg)</span> <span class="ml-10">千克 (Kg)</span>
</a-form-item> </a-form-item>
</div> </div>
@ -280,36 +185,20 @@
<a-radio :value="20">付款减库存</a-radio> <a-radio :value="20">付款减库存</a-radio>
</a-radio-group> </a-radio-group>
</a-form-item> </a-form-item>
<a-form-item <a-form-item label="商品限购" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="用于限制每人购买该商品的数量">
label="商品限购" <a-radio-group v-decorator="['is_restrict', { initialValue: 0, rules: [{ required: true }] }]" @change="onForceUpdate()">
:labelCol="labelCol"
:wrapperCol="wrapperCol"
extra="用于限制每人购买该商品的数量"
>
<a-radio-group
v-decorator="['is_restrict', { initialValue: 0, rules: [{ required: true }] }]"
@change="onForceUpdate()"
>
<a-radio :value="0">关闭</a-radio> <a-radio :value="0">关闭</a-radio>
<a-radio :value="1">开启</a-radio> <a-radio :value="1">开启</a-radio>
</a-radio-group> </a-radio-group>
<div class="mt-10" v-if="form.getFieldValue('is_restrict')"> <div class="mt-10" v-if="form.getFieldValue('is_restrict')">
<a-form-item> <a-form-item>
<span class="mr-10">总限购</span> <span class="mr-10">总限购</span>
<a-input-number <a-input-number :min="1" :precision="0" v-decorator="['restrict_total', { rules: [{ required: true, message: '请输入总限购数量' }] }]" />
:min="1"
:precision="0"
v-decorator="['restrict_total', { rules: [{ required: true, message: '请输入总限购数量' }] }]"
/>
<span class="ml-10">件/人</span> <span class="ml-10">件/人</span>
</a-form-item> </a-form-item>
<a-form-item> <a-form-item>
<span class="mr-10">每单限购</span> <span class="mr-10">每单限购</span>
<a-input-number <a-input-number :min="1" :precision="0" v-decorator="['restrict_single', { rules: [{ required: true, message: '请输入每单限购数量' }] }]" />
:min="1"
:precision="0"
v-decorator="['restrict_single', { rules: [{ required: true, message: '请输入每单限购数量' }] }]"
/>
<span class="ml-10">件/人</span> <span class="ml-10">件/人</span>
</a-form-item> </a-form-item>
</div> </div>
@ -332,76 +221,31 @@
<!-- 更多设置 --> <!-- 更多设置 -->
<div class="tab-pane" v-show="tabKey == 3"> <div class="tab-pane" v-show="tabKey == 3">
<a-form-item <a-form-item label="主图视频" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="建议视频宽高比19:9，建议时长8-45秒">
label="主图视频" <SelectVideo :multiple="false" :defaultList="formData.goods.video ? [formData.goods.video] : []" v-decorator="['video_id']" />
:labelCol="labelCol" </a-form-item>
:wrapperCol="wrapperCol" <a-form-item label="视频封面" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="建议尺寸：750像素*750像素">
extra="建议视频宽高比19:9，建议时长8-45秒" <SelectImage :multiple="false" :defaultList="formData.goods.videoCover ? [formData.goods.videoCover] : []" v-decorator="['video_cover_id']" />
> </a-form-item>
<SelectVideo <a-form-item label="商品卖点" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="一句话简述，例如：此款商品美观大方 性价比较高 不容错过">
:multiple="false"
:defaultList="formData.goods.video ? [formData.goods.video] : []"
v-decorator="['video_id']"
/>
</a-form-item>
<a-form-item
label="视频封面"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
extra="建议尺寸：750像素*750像素"
>
<SelectImage
:multiple="false"
:defaultList="formData.goods.videoCover ? [formData.goods.videoCover] : []"
v-decorator="['video_cover_id']"
/>
</a-form-item>
<a-form-item
label="商品卖点"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
extra="一句话简述，例如：此款商品美观大方 性价比较高 不容错过"
>
<a-input placeholder="请输入商品卖点" v-decorator="['selling_point']" /> <a-input placeholder="请输入商品卖点" v-decorator="['selling_point']" />
</a-form-item> </a-form-item>
<a-form-item label="服务与承诺" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="服务与承诺" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-select <a-select v-if="formData.serviceList" mode="multiple" v-decorator="['serviceIds']" placeholder="请选择服务与承诺">
v-if="formData.serviceList" <a-select-option v-for="(item, index) in formData.serviceList" :key="index" :value="item.service_id">{{ item.name }}</a-select-option>
mode="multiple"
v-decorator="['serviceIds']"
placeholder="请选择服务与承诺"
>
<a-select-option
v-for="(item, index) in formData.serviceList"
:key="index"
:value="item.service_id"
>{{ item.name }}</a-select-option
>
</a-select> </a-select>
<div class="form-item-help"> <div class="form-item-help">
<router-link target="_blank" :to="{ path: '/goods/service/index' }">去新增</router-link> <router-link target="_blank" :to="{ path: '/goods/service/index' }">去新增</router-link>
<a href="javascript:;" @click="onReloadServiceList">刷新</a> <a href="javascript:;" @click="onReloadServiceList">刷新</a>
</div> </div>
</a-form-item> </a-form-item>
<a-form-item <a-form-item label="初始销量" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="用户端展示的销量 = 初始销量 + 实际销量">
label="初始销量"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
extra="用户端展示的销量 = 初始销量 + 实际销量"
>
<a-input-number v-decorator="['sales_initial', { initialValue: 0 }]" /> <a-input-number v-decorator="['sales_initial', { initialValue: 0 }]" />
</a-form-item> </a-form-item>
<div> <div>
<a-divider orientation="left">销售区域</a-divider> <a-divider orientation="left">销售区域</a-divider>
<a-form-item label="销售区域" :labelCol="labelCol" :wrapperCol="{ span: 15 }"> <a-form-item label="销售区域" :labelCol="labelCol" :wrapperCol="{ span: 15 }">
<a-table <a-table v-show="ruleList.length" class="table-rules" :columns="columns" :dataSource="ruleList" :pagination="false" bordered>
v-show="ruleList.length"
class="table-rules"
:columns="columns"
:dataSource="ruleList"
:pagination="false"
bordered
>
<!-- 销售区域 --> <!-- 销售区域 -->
<template slot="region_text" slot-scope="text, item, index"> <template slot="region_text" slot-scope="text, item, index">
<p class="content"> <p class="content">
@ -409,9 +253,7 @@
<span>{{ province.name }}</span> <span>{{ province.name }}</span>
<template v-if="province.citys.length"> <template v-if="province.citys.length">
<span>(</span> <span>(</span>
<span class="city-name" v-for="(city, cidx) in province.citys" :key="cidx" <span class="city-name" v-for="(city, cidx) in province.citys" :key="cidx">{{ city.name }}{{ province.citys.length > cidx + 1 ? '、' : '' }}</span>
>{{ city.name }}{{ province.citys.length > cidx + 1 ? '、' : '' }}</span
>
<span>)</span> <span>)</span>
</template> </template>
<span>{{ ' ' }}</span> <span>{{ ' ' }}</span>
@ -419,40 +261,22 @@
</p> </p>
<p class="operation" style="text-align: right"> <p class="operation" style="text-align: right">
<a href="javascript:void(0);" class="edit" @click="handleEdit(index, item)">编辑</a> <a href="javascript:void(0);" class="edit" @click="handleEdit(index, item)">编辑</a>
<a <a href="javascript:void(0);" style="margin-left: 6px" class="delete" @click="handleDelete(index)">删除</a>
href="javascript:void(0);"
style="margin-left: 6px"
class="delete"
@click="handleDelete(index)"
>删除</a
>
</p> </p>
</template> </template>
</a-table> </a-table>
<a-button icon="environment" v-if="ruleList.length == 0" @click="handleAdd" <a-button icon="environment" v-if="ruleList.length == 0" @click="handleAdd">点击添加销售区域</a-button>
>点击添加销售区域</a-button
>
</a-form-item> </a-form-item>
</div> </div>
<div v-show="$module('market-points')"> <div v-show="$module('market-points')">
<a-divider orientation="left">积分设置</a-divider> <a-divider orientation="left">积分设置</a-divider>
<a-form-item <a-form-item label="积分赠送" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="开启后用户购买此商品将获得积分">
label="积分赠送"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
extra="开启后用户购买此商品将获得积分"
>
<a-radio-group v-decorator="['is_points_gift', { initialValue: 1, rules: [{ required: true }] }]"> <a-radio-group v-decorator="['is_points_gift', { initialValue: 1, rules: [{ required: true }] }]">
<a-radio :value="1">开启</a-radio> <a-radio :value="1">开启</a-radio>
<a-radio :value="0">关闭</a-radio> <a-radio :value="0">关闭</a-radio>
</a-radio-group> </a-radio-group>
</a-form-item> </a-form-item>
<a-form-item <a-form-item label="积分抵扣" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="开启后用户购买此商品可以使用积分进行抵扣">
label="积分抵扣"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
extra="开启后用户购买此商品可以使用积分进行抵扣"
>
<a-radio-group v-decorator="['is_points_discount', { initialValue: 1, rules: [{ required: true }] }]"> <a-radio-group v-decorator="['is_points_discount', { initialValue: 1, rules: [{ required: true }] }]">
<a-radio :value="1">开启</a-radio> <a-radio :value="1">开启</a-radio>
<a-radio :value="0">关闭</a-radio> <a-radio :value="0">关闭</a-radio>
@ -462,48 +286,27 @@
<div v-show="$module('user-grade')"> <div v-show="$module('user-grade')">
<a-divider orientation="left">会员折扣设置</a-divider> <a-divider orientation="left">会员折扣设置</a-divider>
<a-form-item <a-form-item label="会员折扣" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="开启后会员折扣，会员购买此商品可以享受会员等级折扣价">
label="会员折扣" <a-radio-group v-decorator="['is_enable_grade', { initialValue: 1, rules: [{ required: true }] }]" @change="onForceUpdate(true)">
:labelCol="labelCol"
:wrapperCol="wrapperCol"
extra="开启后会员折扣，会员购买此商品可以享受会员等级折扣价"
>
<a-radio-group
v-decorator="['is_enable_grade', { initialValue: 1, rules: [{ required: true }] }]"
@change="onForceUpdate(true)"
>
<a-radio :value="1">开启</a-radio> <a-radio :value="1">开启</a-radio>
<a-radio :value="0">关闭</a-radio> <a-radio :value="0">关闭</a-radio>
</a-radio-group> </a-radio-group>
</a-form-item> </a-form-item>
<a-form-item <a-form-item v-show="form.getFieldValue('is_enable_grade')" label="会员折扣设置" :labelCol="labelCol" :wrapperCol="wrapperCol">
v-show="form.getFieldValue('is_enable_grade')" <a-radio-group v-decorator="['is_alone_grade', { initialValue: 0, rules: [{ required: true }] }]" @change="onForceUpdate(true)">
label="会员折扣设置"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
>
<a-radio-group
v-decorator="['is_alone_grade', { initialValue: 0, rules: [{ required: true }] }]"
@change="onForceUpdate(true)"
>
<a-radio :value="0">默认等级折扣</a-radio> <a-radio :value="0">默认等级折扣</a-radio>
<a-radio :value="1">单独设置折扣</a-radio> <a-radio :value="1">单独设置折扣</a-radio>
</a-radio-group> </a-radio-group>
<!-- 会员等级列表 --> <!-- 会员等级列表 -->
<div v-show="form.getFieldValue('is_alone_grade')"> <div v-show="form.getFieldValue('is_alone_grade')">
<a-form-item v-for="item in formData.userGradeList" :key="item.grade_id"> <a-form-item v-for="item in formData.userGradeList" :key="item.grade_id">
<InputNumberGroup <InputNumberGroup :addonBefore="item.name" addonAfter="折" :inputProps="{ min: 0, max: 9.9 }" v-decorator="[
:addonBefore="item.name"
addonAfter="折"
:inputProps="{ min: 0, max: 9.9 }"
v-decorator="[
`alone_grade_equity[grade_id:${item.grade_id}]`, `alone_grade_equity[grade_id:${item.grade_id}]`,
{ {
initialValue: formData.defaultUserGradeValue[item.grade_id], initialValue: formData.defaultUserGradeValue[item.grade_id],
rules: [{ required: true, message: '折扣率不能为空' }], rules: [{ required: true, message: '折扣率不能为空' }],
}, },
]" ]" />
/>
</a-form-item> </a-form-item>
</div> </div>
<div class="form-item-help"> <div class="form-item-help">
@ -518,10 +321,7 @@
<div v-show="$module('apps-dealer')"> <div v-show="$module('apps-dealer')">
<a-divider orientation="left">分销设置</a-divider> <a-divider orientation="left">分销设置</a-divider>
<a-form-item label="分销佣金" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="分销佣金" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-radio-group <a-radio-group v-decorator="['is_ind_dealer', { initialValue: 0, rules: [{ required: true }] }]" @change="onForceUpdate(true)">
v-decorator="['is_ind_dealer', { initialValue: 0, rules: [{ required: true }] }]"
@change="onForceUpdate(true)"
>
<a-radio :value="0">系统默认</a-radio> <a-radio :value="0">系统默认</a-radio>
<a-radio :value="1">单独设置</a-radio> <a-radio :value="1">单独设置</a-radio>
</a-radio-group> </a-radio-group>
@ -529,27 +329,15 @@
<p class="extra">若使用分销功能必须在 [分销中心 - 分销设置] 中开启</p> <p class="extra">若使用分销功能必须在 [分销中心 - 分销设置] 中开启</p>
</div> </div>
</a-form-item> </a-form-item>
<a-form-item <a-form-item v-show="form.getFieldValue('is_ind_dealer')" label="分销佣金类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
v-show="form.getFieldValue('is_ind_dealer')" <a-radio-group v-decorator="['dealer_money_type', { initialValue: 10, rules: [{ required: true }] }]" @change="onForceUpdate(true)">
label="分销佣金类型"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
>
<a-radio-group
v-decorator="['dealer_money_type', { initialValue: 10, rules: [{ required: true }] }]"
@change="onForceUpdate(true)"
>
<a-radio :value="10">百分比</a-radio> <a-radio :value="10">百分比</a-radio>
<a-radio :value="20">固定金额</a-radio> <a-radio :value="20">固定金额</a-radio>
</a-radio-group> </a-radio-group>
<!-- 分销等级列表 --> <!-- 分销等级列表 -->
<a-form-item v-for="(item, index) in formData.dealer.levelList" :key="index"> <a-form-item v-for="(item, index) in formData.dealer.levelList" :key="index">
<InputNumberGroup <InputNumberGroup :addonBefore="item.name" :addonAfter="form.getFieldValue('dealer_money_type') == 10 ? '%' : '元'" :inputProps="{ min: 0, precision: 2 }"
:addonBefore="item.name" v-decorator="[item.value, { rules: [{ required: true, message: '佣金不能为空' }] }]" />
:addonAfter="form.getFieldValue('dealer_money_type') == 10 ? '%' : '元'"
:inputProps="{ min: 0, precision: 2 }"
v-decorator="[item.value, { rules: [{ required: true, message: '佣金不能为空' }] }]"
/>
</a-form-item> </a-form-item>
</a-form-item> </a-form-item>
<a-form-item class="mt-20" :wrapperCol="{ span: wrapperCol.span, offset: labelCol.span }"> <a-form-item class="mt-20" :wrapperCol="{ span: wrapperCol.span, offset: labelCol.span }">
@ -632,6 +420,45 @@ export default {
} }
}, },
methods: { methods: {
generateRandomDigits(length) {
let result = '';
for (let i = 0; i < length; i++) {
result += Math.floor(Math.random() * 10); // 生成0-9的随机数字
}
return result;
},
handInfo() {
const { form } = this
const goods_no = form.getFieldValue('goods_no')
this.formData.goods.goods_no = goods_no
if (goods_no) {
let param = {
sku: goods_no
}
this.isLoading = true
GoodsApi.getCollector(param).then((result) => {
this.formData.goods.goods_images = []
if (result.data.goods_images.length > 0) {
result.data.goods_images.forEach(item => {
item.id = Number(this.generateRandomDigits(7))
});
}
this.formData.goods.goods_images = result.data.goods_images
this.$refs.childComponent.selectedItems= result.data.goods_images
this.formData.goods.goods_name = result.data.name
this.formData.goods.content = result.data.content
this.formData.goods.goods_price = result.data.proxyPrice
this.form.setFieldsValue(this.formData.goods)
this.isLoading = false
})
.catch(() => {
this.isLoading = false
})
.finally(() => (this.isLoading = false))
} else {
this.$message.warning('请输入商品SKU', 1.5)
}
},
initData(goodsId) { initData(goodsId) {
GoodsModel.formData.goods = {} GoodsModel.formData.goods = {}
this.visible = true this.visible = true
@ -749,6 +576,7 @@ export default {
'delivery_type', 'delivery_type',
'is_brand', 'is_brand',
'is_in_store', 'is_in_store',
'goods_no'
], ],
['spec_type', 'goods_price', 'is_restrict', 'restrict_total', 'restrict_single', 'cost_price'], ['spec_type', 'goods_price', 'is_restrict', 'restrict_total', 'restrict_single', 'cost_price'],
['content'], ['content'],

Write Preview
Loading…
Cancel
Save