From ddb2ab313f88b100420c60d15bf29cfd1a678d55 Mon Sep 17 00:00:00 2001
From: fanfan <franceesfan@163.com>
Date: Thu, 6 Jun 2024 17:12:43 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E4=B8=80=E9=94=AE=E8=8E=B7=E5=8F=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/goods/index.js                     |   11 +-
 src/components/SelectImage/SelectImage.vue |  369 +++--
 src/views/goods/Create.vue                 |   42 +-
 src/views/goods/modules/Update.vue         | 1418 +++++++++-----------
 4 files changed, 840 insertions(+), 1000 deletions(-)

diff --git a/src/api/goods/index.js b/src/api/goods/index.js
index 74fb413..e6ad5e3 100644
--- a/src/api/goods/index.js
+++ b/src/api/goods/index.js
@@ -14,7 +14,16 @@ const api = {
   exportData: '/goods/import',
   setStorePrice: 'store/setStorePrice',
   getStorePriceInfo: 'store/getStorePriceInfo',
-  pool: '/goods/pool'
+  pool: '/goods/pool',
+  collector:'/goods/collector'
+}
+
+export function getCollector (params) {
+  return axios({
+    url: api.collector,
+    method: 'get',
+    params
+  })
 }
 /**
  * 更新状态
diff --git a/src/components/SelectImage/SelectImage.vue b/src/components/SelectImage/SelectImage.vue
index 8033bef..8ccc528 100644
--- a/src/components/SelectImage/SelectImage.vue
+++ b/src/components/SelectImage/SelectImage.vue
@@ -1,55 +1,28 @@
 <template>
-  <div class="image-list clearfix" :class="{ multiple }">
-    <!-- 文件列表 -->
-    <!-- draggable是拖拽组件 -->
-    <draggable
-      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'">
-        <div
-          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">
-            <div class="img-cover" :style="{ backgroundImage: `url('${item.preview_url}')` }"></div>
-          </a>
-          <!-- 删除文件 -->
-          <a-icon
-            class="icon-close"
-            theme="filled"
-            type="close-circle"
-            @click="handleDeleteFileItem(index)"
-          />
-        </div>
-      </transition-group>
-    </draggable>
-    <!-- 图片选择器 -->
-    <!-- 如果单选, selectedItems无内容时 显示 -->
-    <!-- 如果多选, selectedItems数量小于 maxNum 显示 -->
-    <div
-      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" />
-    </div>
-    <!-- 文件选择器 -->
-    <FilesModal
-      ref="FilesModal"
-      :multiple="multiple"
-      :maxNum="maxNum"
-      :selectedNum="selectedItems.length"
-      @handleSubmit="handleSelectImageSubmit"
-    />
-  </div>
+	<div class="image-list clearfix" :class="{ multiple }">
+		<!-- 文件列表 -->
+		<!-- draggable是拖拽组件 -->
+		<draggable 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'">
+				<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` }">
+					<!-- 预览图 -->
+					<a :href="item.preview_url" target="_blank">
+						<div class="img-cover" :style="{ backgroundImage: `url('${item.preview_url}')` }"></div>
+					</a>
+					<!-- 删除文件 -->
+					<a-icon class="icon-close" theme="filled" type="close-circle" @click="handleDeleteFileItem(index)" />
+				</div>
+			</transition-group>
+		</draggable>
+		<!-- 图片选择器 -->
+		<!-- 如果单选, selectedItems无内容时 显示 -->
+		<!-- 如果多选, selectedItems数量小于 maxNum 显示 -->
+		<div 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" />
+		</div>
+		<!-- 文件选择器 -->
+		<FilesModal ref="FilesModal" :multiple="multiple" :maxNum="maxNum" :selectedNum="selectedItems.length" @handleSubmit="handleSelectImageSubmit" />
+	</div>
 </template>
 
 <script>
@@ -60,171 +33,181 @@ import { FilesModal } from '@/components/Modal'
 
 // 图片选择器组件
 export default {
-  name: 'SelectImage',
-  components: {
-    FilesModal,
-    draggable
-  },
-  model: {
-    prop: 'value',
-    event: 'change'
-  },
-  props: {
-    // 多选模式, 如果false为单选
-    multiple: PropTypes.bool.def(false),
-    // 最大选择的数量限制, multiple模式下有效
-    maxNum: PropTypes.integer.def(100),
-    // 默认选中的文件
-    defaultList: PropTypes.array.def([]),
-    // 元素的尺寸(宽)
-    width: PropTypes.integer.def(80)
-  },
-  data () {
-    return {
-      // 选择的图片列表
-      selectedItems: [],
-      // 禁止传参 (防止selectedItems为空时defaultList重新赋值)
-      allowProps: true
-    }
-  },
-  watch: {
-    // 设置默认数据
-    defaultList: {
-      // 首次加载的时候执行函数
-      immediate: true,
-      handler (val) {
-        const { selectedItems, allowProps } = this
-        if (val.length && !selectedItems.length && allowProps) {
-          this.selectedItems = cloneDeep(val)
-          this.onChange()
-        }
-      }
-    }
-  },
-  created () {
-  },
-  methods: {
+	name: 'SelectImage',
+	components: {
+		FilesModal,
+		draggable
+	},
+	model: {
+		prop: 'value',
+		event: 'change'
+	},
+	props: {
+		// 多选模式, 如果false为单选
+		multiple: PropTypes.bool.def(false),
+		// 最大选择的数量限制, multiple模式下有效
+		maxNum: PropTypes.integer.def(100),
+		// 默认选中的文件
+		defaultList: PropTypes.array.def([]),
+		// 元素的尺寸(宽)
+		width: PropTypes.integer.def(80),
+		source: PropTypes.any.def(0)
+	},
+	data() {
+		return {
+			// 选择的图片列表
+			selectedItems: [],
+			// 禁止传参 (防止selectedItems为空时defaultList重新赋值)
+			allowProps: true
+		}
+	},
+	watch: {
+		// 设置默认数据
+		defaultList: {
+			// 首次加载的时候执行函数
+			immediate: true,
+			handler(val) {
+				const { selectedItems, allowProps } = this
+				if (val.length && !selectedItems.length && allowProps) {
+					this.selectedItems = cloneDeep(val)
+					this.onChange()
+				}
+			}
+		}
+	},
+	created() {
+	},
+	methods: {
 
-    // 拖动排序后的回调事件
-    onUpdate () {
-      this.onChange()
-    },
+		// 拖动排序后的回调事件
+		onUpdate() {
+			this.onChange()
+		},
 
-    // 打开文件选择器
-    handleSelectImage () {
-      this.$refs.FilesModal.show()
-    },
+		// 打开文件选择器
+		handleSelectImage() {
+			this.$refs.FilesModal.show()
+		},
 
-    // 文件库modal确认回调
-    handleSelectImageSubmit (result) {
-      if (result.length > 0) {
-        // 记录选中的图片列表
-        const { multiple, selectedItems } = this
-        this.selectedItems = multiple ? selectedItems.concat(result) : result
-        this.onChange()
-      }
-    },
+		// 文件库modal确认回调
+		handleSelectImageSubmit(result) {
+			if (result.length > 0) {
+				// 记录选中的图片列表
+				const { multiple, selectedItems } = this
+				this.selectedItems = multiple ? selectedItems.concat(result) : result
+				this.onChange()
+			}
+		},
 
-    // 删除文件
-    handleDeleteFileItem (index) {
-      this.selectedItems.splice(index, 1)
-      if (this.selectedItems.length === 0) {
-        this.allowProps = false
-      }
-      this.onChange()
-    },
+		// 删除文件
+		handleDeleteFileItem(index) {
+			this.selectedItems.splice(index, 1)
+			if (this.selectedItems.length === 0) {
+				this.allowProps = false
+			}
+			this.onChange()
+		},
 
-    // 触发change事件
-    onChange () {
-      const { multiple, selectedItems } = this
-      if (selectedItems.length <= 0) {
-        return this.$emit('change', multiple ? [] : 0)
-      }
-      // 生成fileId
-      const fileId = multiple ? selectedItems.map(item => item.file_id) : selectedItems[0].file_id
-      // 触发change事件
-      return this.$emit('change', fileId, selectedItems)
-    }
+		// 触发change事件
+		onChange() {
+			const { multiple, selectedItems } = this
+			if (selectedItems.length <= 0) {
+				return this.$emit('change', multiple ? [] : 0)
+			}
+			// 生成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
+				return this.$emit('change', fileId, selectedItems)
+			}
 
-  }
+		}
+
+	}
 }
 </script>
 
 <style lang="less" scoped>
 /deep/.flip-list-move {
-  transition: transform 0.3s !important;
+	transition: transform 0.3s !important;
 }
 /deep/.no-move {
-  transition: transform 0s;
+	transition: transform 0s;
 }
 
 .image-list {
-  // 多选模式下margin
-  &.multiple {
-    .file-item,
-    .selector {
-      margin-right: 10px;
-      margin-bottom: 10px;
-    }
-  }
+	// 多选模式下margin
+	&.multiple {
+		.file-item,
+		.selector {
+			margin-right: 10px;
+			margin-bottom: 10px;
+		}
+	}
 }
 
 // 文件元素
 .file-item {
-  position: relative;
-  float: left;
-  width: 80px;
-  height: 80px;
-  position: relative;
-  padding: 2px;
-  border: 1px solid #ddd;
-  background: #fff;
-  .img-cover {
-    display: block;
-    width: 100%;
-    height: 100%;
-    background: no-repeat center center / 100%;
-  }
-  &:hover {
-    .icon-close {
-      display: block;
-    }
-  }
-  .icon-close {
-    display: none;
-    position: absolute;
-    top: -8px;
-    right: -8px;
-    cursor: pointer;
-    font-size: 16px;
-    color: #c5c5c5;
-    &:hover {
-      color: #7d7d7d;
-    }
-  }
-  &:hover {
-    border: 1px solid #a7c3de;
-  }
+	position: relative;
+	float: left;
+	width: 80px;
+	height: 80px;
+	position: relative;
+	padding: 2px;
+	border: 1px solid #ddd;
+	background: #fff;
+	.img-cover {
+		display: block;
+		width: 100%;
+		height: 100%;
+		background: no-repeat center center / 100%;
+	}
+	&:hover {
+		.icon-close {
+			display: block;
+		}
+	}
+	.icon-close {
+		display: none;
+		position: absolute;
+		top: -8px;
+		right: -8px;
+		cursor: pointer;
+		font-size: 16px;
+		color: #c5c5c5;
+		&:hover {
+			color: #7d7d7d;
+		}
+	}
+	&:hover {
+		border: 1px solid #a7c3de;
+	}
 }
 
 // 选择器
 .selector {
-  width: 80px;
-  height: 80px;
-  float: left;
-  border: 1px dashed #e2e2e2;
-  text-align: center;
-  color: #dad9d9;
-  cursor: pointer;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  &:hover {
-    border: 1px dashed #40a9ff;
-    color: #40a9ff;
-  }
-  .icon-plus {
-    font-size: 32px;
-  }
+	width: 80px;
+	height: 80px;
+	float: left;
+	border: 1px dashed #e2e2e2;
+	text-align: center;
+	color: #dad9d9;
+	cursor: pointer;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	&:hover {
+		border: 1px dashed #40a9ff;
+		color: #40a9ff;
+	}
+	.icon-plus {
+		font-size: 32px;
+	}
 }
 </style>
diff --git a/src/views/goods/Create.vue b/src/views/goods/Create.vue
index 3324d94..df3232b 100644
--- a/src/views/goods/Create.vue
+++ b/src/views/goods/Create.vue
@@ -15,14 +15,14 @@
 						<a-form-item label="商品类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
 							<GoodsType v-decorator="['goods_type', { initialValue: 10}]" @change="onForceUpdate(true)" />
 						</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%">
 								<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-input placeholder="请输入商品名称" v-decorator="['goods_name', { rules: [{ required: true, min: 2, message: '请输入至少2个字符' }] }]" />
 						</a-form-item>
@@ -38,7 +38,7 @@
 							</div>
 						</a-form-item>
 						<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 label="商品来源" :labelCol="labelCol" :wrapperCol="wrapperCol">
 							<a-radio-group v-decorator="['goods_source', { initialValue: 'JD', rules: [{ required: true }] }]">
@@ -86,9 +86,9 @@
 							</a-radio-group>
 						</a-form-item>
 
-						<a-form-item label="商品编码" :labelCol="labelCol" :wrapperCol="wrapperCol">
-						  <a-input placeholder="请输入商品编码" v-decorator="['goods_no']" />
-						  </a-form-item>
+						<!-- <a-form-item label="商品编码" :labelCol="labelCol" :wrapperCol="wrapperCol">
+							<a-input placeholder="请输入商品编码" v-decorator="['goods_no']" />
+						</a-form-item> -->
 
 						<a-form-item label="所属分类排行(0表示不参加排行)" :labelCol="labelCol" :wrapperCol="wrapperCol">
 							<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: {
 		handInfo() {
-			let obj = {
-				goods_name: '测试',
-				goods_price: 123
+			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 = {
+					goods_name: result.data.name,
+					content: result.data.content,
+					goods_price: result.data.proxyPrice,
+				}
+				this.form.setFieldsValue(obj)
+				this.isLoading = false
+			})
+				.catch(() => {
+					this.isLoading = false
+				})
+				.finally(() => (this.isLoading = false))
+			}else{
+				this.$message.warning('请输入商品SKU', 1.5)
 			}
-			this.form.setFieldsValue(obj)
 		},
 		// 手动强制更新页面
 		onForceUpdate(bool = false) {
diff --git a/src/views/goods/modules/Update.vue b/src/views/goods/modules/Update.vue
index c208e3e..9f268fc 100644
--- a/src/views/goods/modules/Update.vue
+++ b/src/views/goods/modules/Update.vue
@@ -1,568 +1,356 @@
 <template>
-  <a-modal
-    title="编辑商品"
-    width="90%"
-    :visible="visible"
-    :confirmLoading="confirmLoading"
-    :maskClosable="false"
-    :destroyOnClose="true"
-    @ok="handleSubmit"
-    @cancel="handleCancel"
-  >
-    <a-card :bordered="false">
-      <a-spin :spinning="isLoading">
-        <a-form :form="form" @submit="handleSubmit" :selfUpdate="true">
-          <a-tabs :activeKey="tabKey" :tabBarStyle="{ marginBottom: '30px' }" @change="handleTabs">
-            <a-tab-pane :key="0" tab="基本信息"></a-tab-pane>
-            <a-tab-pane :key="1" tab="规格/库存"></a-tab-pane>
-            <a-tab-pane :key="2" tab="商品详情"></a-tab-pane>
-            <a-tab-pane :key="3" tab="更多设置"></a-tab-pane>
-          </a-tabs>
-          <div class="tabs-content">
-            <!-- 基本信息 -->
-            <div class="tab-pane" v-show="tabKey == 0">
-              <a-form-item label="商品类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <GoodsType
-                  :onlyShowChecked="true"
-                  v-decorator="['goods_type', { rules: [{ required: true }] }]"
-                  @change="onForceUpdate(true)"
-                />
-              </a-form-item>
-              <a-form-item label="商品名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <a-input
-                  placeholder="请输入商品名称"
-                  v-decorator="['goods_name', { rules: [{ required: true, min: 2, message: '请输入至少2个字符' }] }]"
-                />
-              </a-form-item>
-              <a-form-item label="商品型号" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <a-input
-                  placeholder="请输入商品型号"
-                  v-decorator="['cmmdty_model', { rules: [{ required: true, min: 2, message: '请输入至少2个字符' }] }]"
-                />
-              </a-form-item>
-              <a-form-item label="商品分类" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <a-tree-select
-                  placeholder="请选择商品分类"
-                  :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">
-                  <router-link target="_blank" :to="{ path: '/goods/category/index' }">去新增</router-link>
-                  <a href="javascript:;" @click="onReloadCategoryList">刷新</a>
-                </div>
-              </a-form-item>
-              <a-form-item
-                label="商品图片"
-                :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 label="商品来源" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <a-radio-group v-decorator="['goods_source', { initialValue: 0, rules: [{ required: true }] }]">
-                  <!-- <a-radio value="JD">京东</a-radio>
+	<a-modal title="编辑商品" width="90%" :visible="visible" :confirmLoading="confirmLoading" :maskClosable="false" :destroyOnClose="true" @ok="handleSubmit" @cancel="handleCancel">
+		<a-card :bordered="false">
+			<a-spin :spinning="isLoading">
+				<a-form :form="form" @submit="handleSubmit" :selfUpdate="true">
+					<a-tabs :activeKey="tabKey" :tabBarStyle="{ marginBottom: '30px' }" @change="handleTabs">
+						<a-tab-pane :key="0" tab="基本信息"></a-tab-pane>
+						<a-tab-pane :key="1" tab="规格/库存"></a-tab-pane>
+						<a-tab-pane :key="2" tab="商品详情"></a-tab-pane>
+						<a-tab-pane :key="3" tab="更多设置"></a-tab-pane>
+					</a-tabs>
+					<div class="tabs-content">
+						<!-- 基本信息 -->
+						<div class="tab-pane" v-show="tabKey == 0">
+							<a-form-item label="商品类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<GoodsType :onlyShowChecked="true" v-decorator="['goods_type', { rules: [{ required: true }] }]" @change="onForceUpdate(true)" />
+							</a-form-item>
+							<a-form-item label="商品SKU" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<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 label="商品名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<a-input placeholder="请输入商品名称" v-decorator="['goods_name', { rules: [{ required: true, min: 2, message: '请输入至少2个字符' }] }]" />
+							</a-form-item>
+							<a-form-item label="商品型号" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<a-input placeholder="请输入商品型号" v-decorator="['cmmdty_model', { rules: [{ required: true, min: 2, message: '请输入至少2个字符' }] }]" />
+							</a-form-item>
+							<a-form-item label="商品分类" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<a-tree-select placeholder="请选择商品分类" :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">
+									<router-link target="_blank" :to="{ path: '/goods/category/index' }">去新增</router-link>
+									<a href="javascript:;" @click="onReloadCategoryList">刷新</a>
+								</div>
+							</a-form-item>
+							<a-form-item label="商品图片" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="建议尺寸：750*750像素, 最多上传10张, 可拖拽图片调整顺序, 第1张将作为商品首图">
+								<SelectImage ref="childComponent" multiple :source='1' :maxNum="10" :defaultList="formData.goods.goods_images" v-decorator="['imagesIds', { rules: [{ required: true, message: '请至少上传1张商品图片' }] }]" />
+							</a-form-item>
+							<a-form-item label="商品来源" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<a-radio-group v-decorator="['goods_source', { initialValue: 0, rules: [{ required: true }] }]">
+									<!-- <a-radio value="JD">京东</a-radio>
                   <a-radio value="SN">苏宁</a-radio> -->
-                  <a-radio value="GC">工厂</a-radio>
-                  <a-radio value="CC">仓储</a-radio>
-                  <a-radio value="ZC">自采</a-radio>
-                </a-radio-group>
-              </a-form-item>
-              <a-form-item label="发货时效" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <a-radio-group v-decorator="['delivery_time', { initialValue: 0, rules: [{ required: true }] }]">
-                  <a-radio :value="0">24小时</a-radio>
-                  <a-radio :value="1">48小时</a-radio>
-                  <a-radio :value="2">72小时</a-radio>
-                  <a-radio :value="3">7天内</a-radio>
-                  <a-radio :value="4">15天内</a-radio>
-                  <a-radio :value="5">30天内</a-radio>
-                  <a-radio :value="6">45天内</a-radio>
-                </a-radio-group>
-              </a-form-item>
-              <a-form-item label="是否大牌正品" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <a-radio-group v-decorator="['is_brand', { initialValue: 0, rules: [{ required: true }] }]">
-                  <a-radio :value="0">否</a-radio>
-                  <a-radio :value="1">是</a-radio>
-                </a-radio-group>
-              </a-form-item>
+									<a-radio value="GC">工厂</a-radio>
+									<a-radio value="CC">仓储</a-radio>
+									<a-radio value="ZC">自采</a-radio>
+								</a-radio-group>
+							</a-form-item>
+							<a-form-item label="发货时效" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<a-radio-group v-decorator="['delivery_time', { initialValue: 0, rules: [{ required: true }] }]">
+									<a-radio :value="0">24小时</a-radio>
+									<a-radio :value="1">48小时</a-radio>
+									<a-radio :value="2">72小时</a-radio>
+									<a-radio :value="3">7天内</a-radio>
+									<a-radio :value="4">15天内</a-radio>
+									<a-radio :value="5">30天内</a-radio>
+									<a-radio :value="6">45天内</a-radio>
+								</a-radio-group>
+							</a-form-item>
+							<a-form-item label="是否大牌正品" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<a-radio-group v-decorator="['is_brand', { initialValue: 0, rules: [{ required: true }] }]">
+									<a-radio :value="0">否</a-radio>
+									<a-radio :value="1">是</a-radio>
+								</a-radio-group>
+							</a-form-item>
 
-              <a-form-item label="是否新品首发" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <a-radio-group v-decorator="['is_new', { initialValue: 0, rules: [{ required: true }] }]">
-                  <a-radio :value="0">否</a-radio>
-                  <a-radio :value="1">是</a-radio>
-                </a-radio-group>
-              </a-form-item>
-              <a-form-item label="是否审单" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <a-radio-group v-decorator="['is_check', { initialValue: 0, rules: [{ required: true }] }]">
-                  <a-radio :value="0">否</a-radio>
-                  <a-radio :value="1">是</a-radio>
-                </a-radio-group>
-              </a-form-item>
-              <a-form-item label="是否店内" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <a-radio-group v-decorator="['is_in_store', { initialValue: 0, rules: [{ required: true }] }]">
-                  <a-radio :value="0">否</a-radio>
-                  <a-radio :value="1">是</a-radio>
-                </a-radio-group>
-              </a-form-item>
+							<a-form-item label="是否新品首发" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<a-radio-group v-decorator="['is_new', { initialValue: 0, rules: [{ required: true }] }]">
+									<a-radio :value="0">否</a-radio>
+									<a-radio :value="1">是</a-radio>
+								</a-radio-group>
+							</a-form-item>
+							<a-form-item label="是否审单" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<a-radio-group v-decorator="['is_check', { initialValue: 0, rules: [{ required: true }] }]">
+									<a-radio :value="0">否</a-radio>
+									<a-radio :value="1">是</a-radio>
+								</a-radio-group>
+							</a-form-item>
+							<a-form-item label="是否店内" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<a-radio-group v-decorator="['is_in_store', { initialValue: 0, rules: [{ required: true }] }]">
+									<a-radio :value="0">否</a-radio>
+									<a-radio :value="1">是</a-radio>
+								</a-radio-group>
+							</a-form-item>
 
-              <a-form-item label="商品编码" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <a-input placeholder="请输入商品编码" v-decorator="['goods_no']" />
-              </a-form-item>
+							<a-form-item label="商品编码" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<a-input placeholder="请输入商品编码" v-decorator="['goods_no']" />
+							</a-form-item>
 
-              <a-form-item label="所属分类排行(0表示不参加排行)" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <a-input placeholder="所属分类排行" v-decorator="['paihang']" />
-              </a-form-item>
+							<a-form-item label="所属分类排行(0表示不参加排行)" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<a-input placeholder="所属分类排行" v-decorator="['paihang']" />
+							</a-form-item>
 
-              <a-form-item label="热卖指数" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <a-input placeholder="热卖指数" v-decorator="['remaizhishu']" />
-              </a-form-item>
+							<a-form-item label="热卖指数" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<a-input placeholder="热卖指数" v-decorator="['remaizhishu']" />
+							</a-form-item>
 
-              <a-form-item
-                v-if="form.getFieldValue('goods_type') == 10"
-                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="1">单独配置</a-radio>
-                </a-radio-group>
-                <div v-show="form.getFieldValue('is_ind_delivery_type')">
-                  <a-form-item extra="需在 [设置 - 配送方式] 中，开启支持的配送方式才可生效">
-                    <a-checkbox-group
-                      :options="[
+							<a-form-item v-if="form.getFieldValue('goods_type') == 10" 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="1">单独配置</a-radio>
+								</a-radio-group>
+								<div v-show="form.getFieldValue('is_ind_delivery_type')">
+									<a-form-item extra="需在 [设置 - 配送方式] 中，开启支持的配送方式才可生效">
+										<a-checkbox-group :options="[
                         { label: '快递配送', value: 10 },
                         { label: '上门自提', value: 20 },
-                      ]"
-                      v-decorator="[
+                      ]" v-decorator="[
                         'delivery_type',
                         { initialValue: [10, 20], rules: [{ required: true, message: '配送方式至少选择一个' }] },
-                      ]"
-                    />
-                  </a-form-item>
-                </div>
-              </a-form-item>
-              <a-form-item
-                v-if="form.getFieldValue('goods_type') == 10"
-                label="运费模板"
-                :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>
-                <div class="form-item-help">
-                  <router-link target="_blank" :to="{ path: '/setting/delivery/template/create' }"
-                    >新增模板</router-link
-                  >
-                  <a href="javascript:;" @click="onReloadDeliveryList">刷新</a>
-                </div>
-              </a-form-item>
-              <a-form-item label="商品状态" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <a-radio-group v-decorator="['status', { initialValue: 10, rules: [{ required: true }] }]">
-                  <a-radio :value="10">上架</a-radio>
-                  <a-radio :value="20">下架</a-radio>
-                </a-radio-group>
-              </a-form-item>
-              <a-form-item label="商品排序" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="数字越小越靠前">
-                <a-input-number :min="0" v-decorator="['sort', { initialValue: 100, rules: [{ required: true }] }]" />
-              </a-form-item>
+                      ]" />
+									</a-form-item>
+								</div>
+							</a-form-item>
+							<a-form-item v-if="form.getFieldValue('goods_type') == 10" label="运费模板" :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>
+								<div class="form-item-help">
+									<router-link target="_blank" :to="{ path: '/setting/delivery/template/create' }">新增模板</router-link>
+									<a href="javascript:;" @click="onReloadDeliveryList">刷新</a>
+								</div>
+							</a-form-item>
+							<a-form-item label="商品状态" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<a-radio-group v-decorator="['status', { initialValue: 10, rules: [{ required: true }] }]">
+									<a-radio :value="10">上架</a-radio>
+									<a-radio :value="20">下架</a-radio>
+								</a-radio-group>
+							</a-form-item>
+							<a-form-item label="商品排序" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="数字越小越靠前">
+								<a-input-number :min="0" v-decorator="['sort', { initialValue: 100, rules: [{ required: true }] }]" />
+							</a-form-item>
 
-              <a-form-item class="mt-20" :wrapperCol="{ span: wrapperCol.span, offset: labelCol.span }">
-                <a-button type="primary" @click="handleTabs(1)" style="margin-left: 20px">下一步</a-button>
-              </a-form-item>
-            </div>
+							<a-form-item class="mt-20" :wrapperCol="{ span: wrapperCol.span, offset: labelCol.span }">
+								<a-button type="primary" @click="handleTabs(1)" style="margin-left: 20px">下一步</a-button>
+							</a-form-item>
+						</div>
 
-            <!-- 规格/库存 -->
-            <div class="tab-pane" v-show="tabKey == 1">
-              <a-form-item label="规格类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <a-radio-group
-                  v-decorator="['spec_type', { initialValue: 10, rules: [{ required: true }] }]"
-                  @change="onForceUpdate()"
-                >
-                  <a-radio :value="10" :disabled="formData.goods.isSpecLocked">单规格</a-radio>
-                  <a-radio :value="20" :disabled="formData.goods.isSpecLocked">多规格</a-radio>
-                </a-radio-group>
-                <p v-if="formData.goods.isSpecLocked" class="form-item-help">
-                  <small class="c-red">注：该商品当前正在参与其他活动，商品规格不允许更改</small>
-                </p>
-              </a-form-item>
-              <!-- 多规格的表单内容 -->
-              <div v-if="form.getFieldValue('spec_type') == 20">
-                <MultiSpec
-                  :source="1"
-                  ref="MultiSpec"
-                  :isSpecLocked="formData.goods.isSpecLocked"
-                  :defaultSpecList="formData.goods.specList"
-                  :defaultSkuList="formData.goods.skuList"
-                />
-              </div>
-              <!-- 单规格的表单内容 -->
-              <div v-if="form.getFieldValue('spec_type') == 10">
-                <a-form-item
-                  label="商品价格"
-                  :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>
-                </a-form-item>
-                <a-form-item
-                  label="成本价"
-                  :labelCol="labelCol"
-                  :wrapperCol="wrapperCol"
-                  extra="成本价仅用于商品页展示"
-                >
-                  <a-input-number :min="0.01" :precision="2" v-decorator="['cost_price']" />
-                  <span class="ml-10">元</span>
-                </a-form-item>
-                <a-form-item
-                  label="当前库存数量"
-                  :labelCol="labelCol"
-                  :wrapperCol="wrapperCol"
-                  extra="商品的实际库存数量，为0时用户无法下单"
-                >
-                  <a-input-number
-                    :min="0"
-                    :precision="0"
-                    v-decorator="[
+						<!-- 规格/库存 -->
+						<div class="tab-pane" v-show="tabKey == 1">
+							<a-form-item label="规格类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<a-radio-group v-decorator="['spec_type', { initialValue: 10, rules: [{ required: true }] }]" @change="onForceUpdate()">
+									<a-radio :value="10" :disabled="formData.goods.isSpecLocked">单规格</a-radio>
+									<a-radio :value="20" :disabled="formData.goods.isSpecLocked">多规格</a-radio>
+								</a-radio-group>
+								<p v-if="formData.goods.isSpecLocked" class="form-item-help">
+									<small class="c-red">注：该商品当前正在参与其他活动，商品规格不允许更改</small>
+								</p>
+							</a-form-item>
+							<!-- 多规格的表单内容 -->
+							<div v-if="form.getFieldValue('spec_type') == 20">
+								<MultiSpec :source="1" ref="MultiSpec" :isSpecLocked="formData.goods.isSpecLocked" :defaultSpecList="formData.goods.specList" :defaultSkuList="formData.goods.skuList" />
+							</div>
+							<!-- 单规格的表单内容 -->
+							<div v-if="form.getFieldValue('spec_type') == 10">
+								<a-form-item label="商品价格" :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>
+								</a-form-item>
+								<a-form-item label="成本价" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="成本价仅用于商品页展示">
+									<a-input-number :min="0.01" :precision="2" v-decorator="['cost_price']" />
+									<span class="ml-10">元</span>
+								</a-form-item>
+								<a-form-item label="当前库存数量" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="商品的实际库存数量，为0时用户无法下单">
+									<a-input-number :min="0" :precision="0" v-decorator="[
                       'stock_num',
                       { initialValue: 100, rules: [{ required: true, message: '请输入库存数量' }] },
-                    ]"
-                  />
-                  <span class="ml-10">件</span>
-                </a-form-item>
-                <a-form-item
-                  label="商品重量"
-                  :labelCol="labelCol"
-                  :wrapperCol="wrapperCol"
-                  extra="商品的实际重量，用于计算运费"
-                >
-                  <a-input-number
-                    :min="0"
-                    v-decorator="[
+                    ]" />
+									<span class="ml-10">件</span>
+								</a-form-item>
+								<a-form-item label="商品重量" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="商品的实际重量，用于计算运费">
+									<a-input-number :min="0" v-decorator="[
                       'goods_weight',
                       { initialValue: 0, rules: [{ required: true, message: '请输入库存数量' }] },
-                    ]"
-                  />
-                  <span class="ml-10">千克 (Kg)</span>
-                </a-form-item>
-              </div>
-              <a-form-item label="库存计算方式" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <a-radio-group v-decorator="['deduct_stock_type', { initialValue: 10, rules: [{ required: true }] }]">
-                  <a-radio :value="10">下单减库存</a-radio>
-                  <a-radio :value="20">付款减库存</a-radio>
-                </a-radio-group>
-              </a-form-item>
-              <a-form-item
-                label="商品限购"
-                :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="1">开启</a-radio>
-                </a-radio-group>
-                <div class="mt-10" v-if="form.getFieldValue('is_restrict')">
-                  <a-form-item>
-                    <span class="mr-10">总限购</span>
-                    <a-input-number
-                      :min="1"
-                      :precision="0"
-                      v-decorator="['restrict_total', { rules: [{ required: true, message: '请输入总限购数量' }] }]"
-                    />
-                    <span class="ml-10">件/人</span>
-                  </a-form-item>
-                  <a-form-item>
-                    <span class="mr-10">每单限购</span>
-                    <a-input-number
-                      :min="1"
-                      :precision="0"
-                      v-decorator="['restrict_single', { rules: [{ required: true, message: '请输入每单限购数量' }] }]"
-                    />
-                    <span class="ml-10">件/人</span>
-                  </a-form-item>
-                </div>
-              </a-form-item>
-              <a-form-item class="mt-20" :wrapperCol="{ span: wrapperCol.span, offset: labelCol.span }">
-                <a-button type="primary" @click="handleTabs(0)" style="margin-left: 20px">上一步</a-button>
-                <a-button type="primary" @click="handleTabs(2)" style="margin-left: 20px">下一步</a-button>
-              </a-form-item>
-            </div>
-            <!-- 商品详情 -->
-            <div class="tab-pane" v-show="tabKey == 2">
-              <a-form-item label="商品详情" :labelCol="labelCol" :wrapperCol="{ span: 16 }">
-                <Ueditor v-decorator="['content', { rules: [{ required: true, message: '商品详情不能为空' }] }]" />
-              </a-form-item>
-              <a-form-item class="mt-20" :wrapperCol="{ span: wrapperCol.span, offset: labelCol.span }">
-                <a-button type="primary" @click="handleTabs(1)" style="margin-left: 20px">上一步</a-button>
-                <a-button type="primary" @click="handleTabs(3)" style="margin-left: 20px">下一步</a-button>
-              </a-form-item>
-            </div>
+                    ]" />
+									<span class="ml-10">千克 (Kg)</span>
+								</a-form-item>
+							</div>
+							<a-form-item label="库存计算方式" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<a-radio-group v-decorator="['deduct_stock_type', { initialValue: 10, rules: [{ required: true }] }]">
+									<a-radio :value="10">下单减库存</a-radio>
+									<a-radio :value="20">付款减库存</a-radio>
+								</a-radio-group>
+							</a-form-item>
+							<a-form-item label="商品限购" :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="1">开启</a-radio>
+								</a-radio-group>
+								<div class="mt-10" v-if="form.getFieldValue('is_restrict')">
+									<a-form-item>
+										<span class="mr-10">总限购</span>
+										<a-input-number :min="1" :precision="0" v-decorator="['restrict_total', { rules: [{ required: true, message: '请输入总限购数量' }] }]" />
+										<span class="ml-10">件/人</span>
+									</a-form-item>
+									<a-form-item>
+										<span class="mr-10">每单限购</span>
+										<a-input-number :min="1" :precision="0" v-decorator="['restrict_single', { rules: [{ required: true, message: '请输入每单限购数量' }] }]" />
+										<span class="ml-10">件/人</span>
+									</a-form-item>
+								</div>
+							</a-form-item>
+							<a-form-item class="mt-20" :wrapperCol="{ span: wrapperCol.span, offset: labelCol.span }">
+								<a-button type="primary" @click="handleTabs(0)" style="margin-left: 20px">上一步</a-button>
+								<a-button type="primary" @click="handleTabs(2)" style="margin-left: 20px">下一步</a-button>
+							</a-form-item>
+						</div>
+						<!-- 商品详情 -->
+						<div class="tab-pane" v-show="tabKey == 2">
+							<a-form-item label="商品详情" :labelCol="labelCol" :wrapperCol="{ span: 16 }">
+								<Ueditor v-decorator="['content', { rules: [{ required: true, message: '商品详情不能为空' }] }]" />
+							</a-form-item>
+							<a-form-item class="mt-20" :wrapperCol="{ span: wrapperCol.span, offset: labelCol.span }">
+								<a-button type="primary" @click="handleTabs(1)" style="margin-left: 20px">上一步</a-button>
+								<a-button type="primary" @click="handleTabs(3)" style="margin-left: 20px">下一步</a-button>
+							</a-form-item>
+						</div>
 
-            <!-- 更多设置 -->
-            <div class="tab-pane" v-show="tabKey == 3">
-              <a-form-item
-                label="主图视频"
-                :labelCol="labelCol"
-                :wrapperCol="wrapperCol"
-                extra="建议视频宽高比19:9，建议时长8-45秒"
-              >
-                <SelectVideo
-                  :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-form-item>
-              <a-form-item label="服务与承诺" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <a-select
-                  v-if="formData.serviceList"
-                  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>
-                <div class="form-item-help">
-                  <router-link target="_blank" :to="{ path: '/goods/service/index' }">去新增</router-link>
-                  <a href="javascript:;" @click="onReloadServiceList">刷新</a>
-                </div>
-              </a-form-item>
-              <a-form-item
-                label="初始销量"
-                :labelCol="labelCol"
-                :wrapperCol="wrapperCol"
-                extra="用户端展示的销量 = 初始销量 + 实际销量"
-              >
-                <a-input-number v-decorator="['sales_initial', { initialValue: 0 }]" />
-              </a-form-item>
-              <div>
-                <a-divider orientation="left">销售区域</a-divider>
-                <a-form-item label="销售区域" :labelCol="labelCol" :wrapperCol="{ span: 15 }">
-                  <a-table
-                    v-show="ruleList.length"
-                    class="table-rules"
-                    :columns="columns"
-                    :dataSource="ruleList"
-                    :pagination="false"
-                    bordered
-                  >
-                    <!-- 销售区域 -->
-                    <template slot="region_text" slot-scope="text, item, index">
-                      <p class="content">
-                        <span v-for="(province, pidx) in text" :key="pidx">
-                          <span>{{ province.name }}</span>
-                          <template v-if="province.citys.length">
-                            <span>(</span>
-                            <span class="city-name" v-for="(city, cidx) in province.citys" :key="cidx"
-                              >{{ city.name }}{{ province.citys.length > cidx + 1 ? '、' : '' }}</span
-                            >
-                            <span>)</span>
-                          </template>
-                          <span>{{ ' ' }}</span>
-                        </span>
-                      </p>
-                      <p class="operation" style="text-align: right">
-                        <a href="javascript:void(0);" class="edit" @click="handleEdit(index, item)">编辑</a>
-                        <a
-                          href="javascript:void(0);"
-                          style="margin-left: 6px"
-                          class="delete"
-                          @click="handleDelete(index)"
-                          >删除</a
-                        >
-                      </p>
-                    </template>
-                  </a-table>
-                  <a-button icon="environment" v-if="ruleList.length == 0" @click="handleAdd"
-                    >点击添加销售区域</a-button
-                  >
-                </a-form-item>
-              </div>
-              <div v-show="$module('market-points')">
-                <a-divider orientation="left">积分设置</a-divider>
-                <a-form-item
-                  label="积分赠送"
-                  :labelCol="labelCol"
-                  :wrapperCol="wrapperCol"
-                  extra="开启后用户购买此商品将获得积分"
-                >
-                  <a-radio-group v-decorator="['is_points_gift', { initialValue: 1, rules: [{ required: true }] }]">
-                    <a-radio :value="1">开启</a-radio>
-                    <a-radio :value="0">关闭</a-radio>
-                  </a-radio-group>
-                </a-form-item>
-                <a-form-item
-                  label="积分抵扣"
-                  :labelCol="labelCol"
-                  :wrapperCol="wrapperCol"
-                  extra="开启后用户购买此商品可以使用积分进行抵扣"
-                >
-                  <a-radio-group v-decorator="['is_points_discount', { initialValue: 1, rules: [{ required: true }] }]">
-                    <a-radio :value="1">开启</a-radio>
-                    <a-radio :value="0">关闭</a-radio>
-                  </a-radio-group>
-                </a-form-item>
-              </div>
+						<!-- 更多设置 -->
+						<div class="tab-pane" v-show="tabKey == 3">
+							<a-form-item label="主图视频" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="建议视频宽高比19:9，建议时长8-45秒">
+								<SelectVideo :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-form-item>
+							<a-form-item label="服务与承诺" :labelCol="labelCol" :wrapperCol="wrapperCol">
+								<a-select v-if="formData.serviceList" 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>
+								<div class="form-item-help">
+									<router-link target="_blank" :to="{ path: '/goods/service/index' }">去新增</router-link>
+									<a href="javascript:;" @click="onReloadServiceList">刷新</a>
+								</div>
+							</a-form-item>
+							<a-form-item label="初始销量" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="用户端展示的销量 = 初始销量 + 实际销量">
+								<a-input-number v-decorator="['sales_initial', { initialValue: 0 }]" />
+							</a-form-item>
+							<div>
+								<a-divider orientation="left">销售区域</a-divider>
+								<a-form-item label="销售区域" :labelCol="labelCol" :wrapperCol="{ span: 15 }">
+									<a-table v-show="ruleList.length" class="table-rules" :columns="columns" :dataSource="ruleList" :pagination="false" bordered>
+										<!-- 销售区域 -->
+										<template slot="region_text" slot-scope="text, item, index">
+											<p class="content">
+												<span v-for="(province, pidx) in text" :key="pidx">
+													<span>{{ province.name }}</span>
+													<template v-if="province.citys.length">
+														<span>(</span>
+														<span class="city-name" v-for="(city, cidx) in province.citys" :key="cidx">{{ city.name }}{{ province.citys.length > cidx + 1 ? '、' : '' }}</span>
+														<span>)</span>
+													</template>
+													<span>{{ ' ' }}</span>
+												</span>
+											</p>
+											<p class="operation" style="text-align: right">
+												<a href="javascript:void(0);" class="edit" @click="handleEdit(index, item)">编辑</a>
+												<a href="javascript:void(0);" style="margin-left: 6px" class="delete" @click="handleDelete(index)">删除</a>
+											</p>
+										</template>
+									</a-table>
+									<a-button icon="environment" v-if="ruleList.length == 0" @click="handleAdd">点击添加销售区域</a-button>
+								</a-form-item>
+							</div>
+							<div v-show="$module('market-points')">
+								<a-divider orientation="left">积分设置</a-divider>
+								<a-form-item label="积分赠送" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="开启后用户购买此商品将获得积分">
+									<a-radio-group v-decorator="['is_points_gift', { initialValue: 1, rules: [{ required: true }] }]">
+										<a-radio :value="1">开启</a-radio>
+										<a-radio :value="0">关闭</a-radio>
+									</a-radio-group>
+								</a-form-item>
+								<a-form-item label="积分抵扣" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="开启后用户购买此商品可以使用积分进行抵扣">
+									<a-radio-group v-decorator="['is_points_discount', { initialValue: 1, rules: [{ required: true }] }]">
+										<a-radio :value="1">开启</a-radio>
+										<a-radio :value="0">关闭</a-radio>
+									</a-radio-group>
+								</a-form-item>
+							</div>
 
-              <div v-show="$module('user-grade')">
-                <a-divider orientation="left">会员折扣设置</a-divider>
-                <a-form-item
-                  label="会员折扣"
-                  :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="0">关闭</a-radio>
-                  </a-radio-group>
-                </a-form-item>
-                <a-form-item
-                  v-show="form.getFieldValue('is_enable_grade')"
-                  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="1">单独设置折扣</a-radio>
-                  </a-radio-group>
-                  <!-- 会员等级列表 -->
-                  <div v-show="form.getFieldValue('is_alone_grade')">
-                    <a-form-item v-for="item in formData.userGradeList" :key="item.grade_id">
-                      <InputNumberGroup
-                        :addonBefore="item.name"
-                        addonAfter="折"
-                        :inputProps="{ min: 0, max: 9.9 }"
-                        v-decorator="[
+							<div v-show="$module('user-grade')">
+								<a-divider orientation="left">会员折扣设置</a-divider>
+								<a-form-item label="会员折扣" :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="0">关闭</a-radio>
+									</a-radio-group>
+								</a-form-item>
+								<a-form-item v-show="form.getFieldValue('is_enable_grade')" 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="1">单独设置折扣</a-radio>
+									</a-radio-group>
+									<!-- 会员等级列表 -->
+									<div v-show="form.getFieldValue('is_alone_grade')">
+										<a-form-item v-for="item in formData.userGradeList" :key="item.grade_id">
+											<InputNumberGroup :addonBefore="item.name" addonAfter="折" :inputProps="{ min: 0, max: 9.9 }" v-decorator="[
                           `alone_grade_equity[grade_id:${item.grade_id}]`,
                           {
                             initialValue: formData.defaultUserGradeValue[item.grade_id],
                             rules: [{ required: true, message: '折扣率不能为空' }],
                           },
-                        ]"
-                      />
-                    </a-form-item>
-                  </div>
-                  <div class="form-item-help">
-                    <p class="extra" v-if="form.getFieldValue('is_alone_grade')">
-                      单独折扣：折扣率范围0.0-9.9，例如: 9.8代表98折，0代表不折扣
-                    </p>
-                    <p class="extra" v-else>默认折扣：默认为用户所属会员等级的折扣率</p>
-                  </div>
-                </a-form-item>
-              </div>
+                        ]" />
+										</a-form-item>
+									</div>
+									<div class="form-item-help">
+										<p class="extra" v-if="form.getFieldValue('is_alone_grade')">
+											单独折扣：折扣率范围0.0-9.9，例如: 9.8代表98折，0代表不折扣
+										</p>
+										<p class="extra" v-else>默认折扣：默认为用户所属会员等级的折扣率</p>
+									</div>
+								</a-form-item>
+							</div>
 
-              <div v-show="$module('apps-dealer')">
-                <a-divider orientation="left">分销设置</a-divider>
-                <a-form-item label="分销佣金" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                  <a-radio-group
-                    v-decorator="['is_ind_dealer', { initialValue: 0, rules: [{ required: true }] }]"
-                    @change="onForceUpdate(true)"
-                  >
-                    <a-radio :value="0">系统默认</a-radio>
-                    <a-radio :value="1">单独设置</a-radio>
-                  </a-radio-group>
-                  <div class="form-item-help">
-                    <p class="extra">若使用分销功能必须在 [分销中心 - 分销设置] 中开启</p>
-                  </div>
-                </a-form-item>
-                <a-form-item
-                  v-show="form.getFieldValue('is_ind_dealer')"
-                  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="20">固定金额</a-radio>
-                  </a-radio-group>
-                  <!-- 分销等级列表 -->
-                  <a-form-item v-for="(item, index) in formData.dealer.levelList" :key="index">
-                    <InputNumberGroup
-                      :addonBefore="item.name"
-                      :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 class="mt-20" :wrapperCol="{ span: wrapperCol.span, offset: labelCol.span }">
-                  <a-button type="primary" @click="handleTabs(2)" style="margin-left: 20px">上一步</a-button>
-                </a-form-item>
-              </div>
-            </div>
-          </div>
-        </a-form>
-        <AreasModal ref="AreasModal" @handleSubmit="handleAreaSubmit" :loading="isBtnLoading" />
-      </a-spin>
-    </a-card>
-  </a-modal>
+							<div v-show="$module('apps-dealer')">
+								<a-divider orientation="left">分销设置</a-divider>
+								<a-form-item label="分销佣金" :labelCol="labelCol" :wrapperCol="wrapperCol">
+									<a-radio-group v-decorator="['is_ind_dealer', { initialValue: 0, rules: [{ required: true }] }]" @change="onForceUpdate(true)">
+										<a-radio :value="0">系统默认</a-radio>
+										<a-radio :value="1">单独设置</a-radio>
+									</a-radio-group>
+									<div class="form-item-help">
+										<p class="extra">若使用分销功能必须在 [分销中心 - 分销设置] 中开启</p>
+									</div>
+								</a-form-item>
+								<a-form-item v-show="form.getFieldValue('is_ind_dealer')" 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="20">固定金额</a-radio>
+									</a-radio-group>
+									<!-- 分销等级列表 -->
+									<a-form-item v-for="(item, index) in formData.dealer.levelList" :key="index">
+										<InputNumberGroup :addonBefore="item.name" :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 class="mt-20" :wrapperCol="{ span: wrapperCol.span, offset: labelCol.span }">
+									<a-button type="primary" @click="handleTabs(2)" style="margin-left: 20px">上一步</a-button>
+								</a-form-item>
+							</div>
+						</div>
+					</div>
+				</a-form>
+				<AreasModal ref="AreasModal" @handleSubmit="handleAreaSubmit" :loading="isBtnLoading" />
+			</a-spin>
+		</a-card>
+	</a-modal>
 </template>
 
 <script>
@@ -574,274 +362,314 @@ import MultiSpec from './MultiSpec'
 import { isEmptyObject } from '@/utils/util'
 import { AreasModal } from '@/components/Modal'
 const defaultItem = {
-  key: 0,
-  region: [],
-  region_text: [],
+	key: 0,
+	region: [],
+	region_text: [],
 }
 export default {
-  components: {
-    GoodsType,
-    SelectImage,
-    SelectVideo,
-    Ueditor,
-    InputNumberGroup,
-    MultiSpec,
-    AreasModal,
-  },
-  props: {
-    // 分类列表
-  },
-  data() {
-    return {
-      categoryList: [],
-      // 对话框标题
-      title: '',
-      // modal(对话框)是否可见
-      visible: false,
-      // modal(对话框)确定按钮 loading
-      confirmLoading: false,
-      // 默认的标签索引
-      tabKey: 0,
-      // 标签布局属性
-      labelCol: { span: 3 },
-      // 输入框布局属性
-      wrapperCol: { span: 10 },
-      // loading状态
-      isLoading: false,
-      isBtnLoading: false,
-      // 当前表单元素
-      form: this.$form.createForm(this),
-      // 商品ID
-      goodsId: null,
-      // 表单数据
-      formData: GoodsModel.formData,
-      checkList: [],
-      // 销售区域
-      ruleList: [],
-      // 销售区域表头
-      columns: [
-        {
-          title: '销售区域',
-          dataIndex: 'region_text',
-          width: '400px',
-          scopedSlots: { customRender: 'region_text' },
-        },
-      ],
-      // 城市总数
-      citysCount: null,
-    }
-  },
-  methods: {
-    initData(goodsId) {
-      GoodsModel.formData.goods = {}
-      this.visible = true
-      // 记录商品ID
-      this.goodsId = goodsId
-      // 获取form所需的数据
-      this.isLoading = true
-      GoodsModel.getFromData(this.goodsId).then(() => {
-        this.formData.goods.goods_images = []
-        // 商品表单数据
-        if (!isEmptyObject(this.form.getFieldsValue())) {
-          // 第一次赋值
-          this.form.setFieldsValue(GoodsModel.getFieldsValue())
-          // 第二次赋值 (适用于动态渲染的form-item)
-          this.$nextTick(() => {
-            this.form.setFieldsValue(GoodsModel.getFieldsValue2())
-            this.ruleList = this.formData.goods.rules ? this.formData.goods.rules : []
-            this.onForceUpdate()
-          })
-        }
-        this.isLoading = false
-      })
-    },
+	components: {
+		GoodsType,
+		SelectImage,
+		SelectVideo,
+		Ueditor,
+		InputNumberGroup,
+		MultiSpec,
+		AreasModal,
+	},
+	props: {
+		// 分类列表
+	},
+	data() {
+		return {
+			categoryList: [],
+			// 对话框标题
+			title: '',
+			// modal(对话框)是否可见
+			visible: false,
+			// modal(对话框)确定按钮 loading
+			confirmLoading: false,
+			// 默认的标签索引
+			tabKey: 0,
+			// 标签布局属性
+			labelCol: { span: 3 },
+			// 输入框布局属性
+			wrapperCol: { span: 10 },
+			// loading状态
+			isLoading: false,
+			isBtnLoading: false,
+			// 当前表单元素
+			form: this.$form.createForm(this),
+			// 商品ID
+			goodsId: null,
+			// 表单数据
+			formData: GoodsModel.formData,
+			checkList: [],
+			// 销售区域
+			ruleList: [],
+			// 销售区域表头
+			columns: [
+				{
+					title: '销售区域',
+					dataIndex: 'region_text',
+					width: '400px',
+					scopedSlots: { customRender: 'region_text' },
+				},
+			],
+			// 城市总数
+			citysCount: null,
+		}
+	},
+	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) {
+			GoodsModel.formData.goods = {}
+			this.visible = true
+			// 记录商品ID
+			this.goodsId = goodsId
+			// 获取form所需的数据
+			this.isLoading = true
+			GoodsModel.getFromData(this.goodsId).then(() => {
+				this.formData.goods.goods_images = []
+				// 商品表单数据
+				if (!isEmptyObject(this.form.getFieldsValue())) {
+					// 第一次赋值
+					this.form.setFieldsValue(GoodsModel.getFieldsValue())
+					// 第二次赋值 (适用于动态渲染的form-item)
+					this.$nextTick(() => {
+						this.form.setFieldsValue(GoodsModel.getFieldsValue2())
+						this.ruleList = this.formData.goods.rules ? this.formData.goods.rules : []
+						this.onForceUpdate()
+					})
+				}
+				this.isLoading = false
+			})
+		},
 
-    // 手动强制更新页面
-    onForceUpdate(bool = false) {
-      this.$forceUpdate()
-      // bool为true时再执行一次 $forceUpdate, 特殊情况下需执行两次，原因如下：
-      // 第一次执行 $forceUpdate时, 新元素绑定v-decorator无法获取到form.getFieldValue
-      bool &&
-        setTimeout(() => {
-          this.$forceUpdate()
-        }, 10)
-    },
+		// 手动强制更新页面
+		onForceUpdate(bool = false) {
+			this.$forceUpdate()
+			// bool为true时再执行一次 $forceUpdate, 特殊情况下需执行两次，原因如下：
+			// 第一次执行 $forceUpdate时, 新元素绑定v-decorator无法获取到form.getFieldValue
+			bool &&
+				setTimeout(() => {
+					this.$forceUpdate()
+				}, 10)
+		},
 
-    // 切换tab选项卡
-    handleTabs(key) {
-      this.tabKey = key
-    },
+		// 切换tab选项卡
+		handleTabs(key) {
+			this.tabKey = key
+		},
 
-    // 刷新分类列表
-    onReloadCategoryList() {
-      this.isLoading = true
-      GoodsModel.getCategoryList().then(() => {
-        this.isLoading = false
-      })
-    },
+		// 刷新分类列表
+		onReloadCategoryList() {
+			this.isLoading = true
+			GoodsModel.getCategoryList().then(() => {
+				this.isLoading = false
+			})
+		},
 
-    // 刷新服务与承诺列表
-    onReloadServiceList() {
-      this.isLoading = true
-      GoodsModel.getServiceList().then(() => {
-        this.isLoading = false
-      })
-    },
+		// 刷新服务与承诺列表
+		onReloadServiceList() {
+			this.isLoading = true
+			GoodsModel.getServiceList().then(() => {
+				this.isLoading = false
+			})
+		},
 
-    // 刷新配送模板列表
-    onReloadDeliveryList() {
-      this.isLoading = true
-      GoodsModel.getDeliveryList().then(() => {
-        this.isLoading = false
-      })
-    },
-    // 关闭对话框事件
-    handleCancel() {
-      this.visible = false
-      this.form.resetFields()
-    },
-    // 确认按钮
-    handleSubmit(e) {
-      e.preventDefault()
-      // 表单验证
-      const {
-        form: { validateFields },
-        ruleList,
-      } = this
-      validateFields((errors, values) => {
-        // 定位到错误的tab选项卡
-        if (errors) {
-          this.onTargetTabError(errors)
-          return false
-        }
-        // 验证多规格
-        if (values.spec_type === 20) {
-          const MultiSpec = this.$refs.MultiSpec
-          if (!MultiSpec.verifyForm()) {
-            this.tabKey = 1
-            return false
-          }
-          // 记录多规格数据
-          values.specData = MultiSpec.getFromSpecData()
-        }
-        values.rules = ruleList
-        // 整理商品分类ID集
-        values.categoryIds = values.categorys.map((item) => item.value)
-        delete values.categorys
-        // 提交到后端api
-        this.onFormSubmit(values)
-        return true
-      })
-    },
+		// 刷新配送模板列表
+		onReloadDeliveryList() {
+			this.isLoading = true
+			GoodsModel.getDeliveryList().then(() => {
+				this.isLoading = false
+			})
+		},
+		// 关闭对话框事件
+		handleCancel() {
+			this.visible = false
+			this.form.resetFields()
+		},
+		// 确认按钮
+		handleSubmit(e) {
+			e.preventDefault()
+			// 表单验证
+			const {
+				form: { validateFields },
+				ruleList,
+			} = this
+			validateFields((errors, values) => {
+				// 定位到错误的tab选项卡
+				if (errors) {
+					this.onTargetTabError(errors)
+					return false
+				}
+				// 验证多规格
+				if (values.spec_type === 20) {
+					const MultiSpec = this.$refs.MultiSpec
+					if (!MultiSpec.verifyForm()) {
+						this.tabKey = 1
+						return false
+					}
+					// 记录多规格数据
+					values.specData = MultiSpec.getFromSpecData()
+				}
+				values.rules = ruleList
+				// 整理商品分类ID集
+				values.categoryIds = values.categorys.map((item) => item.value)
+				delete values.categorys
+				// 提交到后端api
+				this.onFormSubmit(values)
+				return true
+			})
+		},
 
-    // 定位到错误的tab选项卡
-    onTargetTabError(errors) {
-      // 表单字段与tabKey对应关系
-      // 只需要必填字段就可
-      const tabsFieldsMap = [
-        [
-          'goods_type',
-          'goods_name',
-          'categorys',
-          'imagesIds',
-          'delivery_id',
-          'is_ind_delivery_type',
-          'delivery_type',
-          'is_brand',
-          'is_in_store',
-        ],
-        ['spec_type', 'goods_price', 'is_restrict', 'restrict_total', 'restrict_single', 'cost_price'],
-        ['content'],
-        ['alone_grade_equity', 'first_money', 'second_money', 'third_money'],
-      ]
-      const field = Object.keys(errors).shift()
-      for (const key in tabsFieldsMap) {
-        if (tabsFieldsMap[key].indexOf(field) > -1) {
-          this.tabKey = parseInt(key)
-          break
-        }
-      }
-    },
+		// 定位到错误的tab选项卡
+		onTargetTabError(errors) {
+			// 表单字段与tabKey对应关系
+			// 只需要必填字段就可
+			const tabsFieldsMap = [
+				[
+					'goods_type',
+					'goods_name',
+					'categorys',
+					'imagesIds',
+					'delivery_id',
+					'is_ind_delivery_type',
+					'delivery_type',
+					'is_brand',
+					'is_in_store',
+          'goods_no'
+				],
+				['spec_type', 'goods_price', 'is_restrict', 'restrict_total', 'restrict_single', 'cost_price'],
+				['content'],
+				['alone_grade_equity', 'first_money', 'second_money', 'third_money'],
+			]
+			const field = Object.keys(errors).shift()
+			for (const key in tabsFieldsMap) {
+				if (tabsFieldsMap[key].indexOf(field) > -1) {
+					this.tabKey = parseInt(key)
+					break
+				}
+			}
+		},
 
-    // 提交到后端api
-    onFormSubmit(values) {
-      this.isLoading = true
-      this.isBtnLoading = true
-      GoodsApi.edit({ goodsId: this.goodsId, form: values })
-        .then((result) => {
-          // 显示提示信息
-          this.$message.success(result.message, 1.5)
-          this.$emit('refresh')
-          setTimeout(() => {
-            this.handleCancel()
-          }, 500)
-        })
-        .catch(() => {
-          this.isBtnLoading = false
-        })
-        .finally(() => (this.isLoading = false))
-    },
-    // 新增记录
-    handleAdd() {
-      const index = this.ruleList.length
-      const newItem = { ...defaultItem, key: index }
-      // 排除的城市id集(已存在的城市id集)
-      const excludedCityIds = this.getExcludedCityIds()
-      if (excludedCityIds.length === this.citysCount) {
-        this.$message.error('已选择了所有的区域', 0.8)
-        return false
-      }
-      // 显示选择地区对话框
-      this.handleAreasModal('add', index, newItem, excludedCityIds)
-    },
+		// 提交到后端api
+		onFormSubmit(values) {
+			this.isLoading = true
+			this.isBtnLoading = true
+			GoodsApi.edit({ goodsId: this.goodsId, form: values })
+				.then((result) => {
+					// 显示提示信息
+					this.$message.success(result.message, 1.5)
+					this.$emit('refresh')
+					setTimeout(() => {
+						this.handleCancel()
+					}, 500)
+				})
+				.catch(() => {
+					this.isBtnLoading = false
+				})
+				.finally(() => (this.isLoading = false))
+		},
+		// 新增记录
+		handleAdd() {
+			const index = this.ruleList.length
+			const newItem = { ...defaultItem, key: index }
+			// 排除的城市id集(已存在的城市id集)
+			const excludedCityIds = this.getExcludedCityIds()
+			if (excludedCityIds.length === this.citysCount) {
+				this.$message.error('已选择了所有的区域', 0.8)
+				return false
+			}
+			// 显示选择地区对话框
+			this.handleAreasModal('add', index, newItem, excludedCityIds)
+		},
 
-    // 编辑记录
-    handleEdit(index, item) {
-      // 排除的城市id集(已存在的城市id集)
-      const excludedCityIds = this.getExcludedCityIds()
-      // 显示选择地区对话框
-      this.handleAreasModal('edit', index, item, excludedCityIds)
-    },
+		// 编辑记录
+		handleEdit(index, item) {
+			// 排除的城市id集(已存在的城市id集)
+			const excludedCityIds = this.getExcludedCityIds()
+			// 显示选择地区对话框
+			this.handleAreasModal('edit', index, item, excludedCityIds)
+		},
 
-    // 选择地区后的回调
-    handleAreaSubmit(result) {
-      const {
-        custom: { scene, item },
-      } = result
-      item.region = result.selectedCityIds
-      item.region_text = result.selectedText
-      if (scene === 'add') {
-        this.ruleList.push(item)
-      }
-    },
+		// 选择地区后的回调
+		handleAreaSubmit(result) {
+			const {
+				custom: { scene, item },
+			} = result
+			item.region = result.selectedCityIds
+			item.region_text = result.selectedText
+			if (scene === 'add') {
+				this.ruleList.push(item)
+			}
+		},
 
-    // 排除的城市id集(已存在的城市id集)
-    getExcludedCityIds() {
-      const excludedCityIds = []
-      this.ruleList.forEach((item) => {
-        item.region.forEach((cityId) => {
-          excludedCityIds.push(cityId)
-        })
-      })
-      return excludedCityIds
-    },
+		// 排除的城市id集(已存在的城市id集)
+		getExcludedCityIds() {
+			const excludedCityIds = []
+			this.ruleList.forEach((item) => {
+				item.region.forEach((cityId) => {
+					excludedCityIds.push(cityId)
+				})
+			})
+			return excludedCityIds
+		},
 
-    // 显示选择地区对话框
-    handleAreasModal(scene, index, item, excludedCityIds) {
-      this.$refs.AreasModal.handle({ scene, index, item }, item.region, excludedCityIds)
-    },
+		// 显示选择地区对话框
+		handleAreasModal(scene, index, item, excludedCityIds) {
+			this.$refs.AreasModal.handle({ scene, index, item }, item.region, excludedCityIds)
+		},
 
-    // 删除记录
-    handleDelete(index) {
-      const app = this
-      const modal = this.$confirm({
-        title: '您确定要删除该记录吗?',
-        onOk() {
-          app.ruleList.splice(index, 1)
-          modal.destroy()
-        },
-      })
-    },
-  },
+		// 删除记录
+		handleDelete(index) {
+			const app = this
+			const modal = this.$confirm({
+				title: '您确定要删除该记录吗?',
+				onOk() {
+					app.ruleList.splice(index, 1)
+					modal.destroy()
+				},
+			})
+		},
+	},
 }
 </script>

From 60dea96dc9112879be00a03f6dcdb33244273b06 Mon Sep 17 00:00:00 2001
From: fanfan <franceesfan@163.com>
Date: Thu, 6 Jun 2024 17:29:35 +0800
Subject: [PATCH 2/2] =?UTF-8?q?=E7=BB=86=E8=8A=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/goods/Create.vue | 49 +++++++++++++++++++++++---------------
 1 file changed, 30 insertions(+), 19 deletions(-)

diff --git a/src/views/goods/Create.vue b/src/views/goods/Create.vue
index df3232b..097aee9 100644
--- a/src/views/goods/Create.vue
+++ b/src/views/goods/Create.vue
@@ -38,7 +38,7 @@
 							</div>
 						</a-form-item>
 						<a-form-item label="商品图片" :labelCol="labelCol" :wrapperCol="wrapperCol" extra="建议尺寸：750*750像素, 最多上传10张, 可拖拽图片调整顺序, 第1张将作为商品首图">
-							<SelectImage :defaultList="goods_images" :source='1' multiple :maxNum="10" v-decorator="['imagesIds', { rules: [{ required: true, message: '请至少上传1张商品图片' }] }]" />
+							<SelectImage ref="childComponent" :source='1' multiple :maxNum="10" v-decorator="['imagesIds', { rules: [{ required: true, message: '请至少上传1张商品图片' }] }]" />
 						</a-form-item>
 						<a-form-item label="商品来源" :labelCol="labelCol" :wrapperCol="wrapperCol">
 							<a-radio-group v-decorator="['goods_source', { initialValue: 'JD', rules: [{ required: true }] }]">
@@ -408,7 +408,6 @@ export default {
 			],
 			// 城市总数
 			citysCount: null,
-			goods_images: []
 		}
 	},
 	// 初始化数据
@@ -420,29 +419,41 @@ export default {
 		})
 	},
 	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')
-			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 = {
-					goods_name: result.data.name,
-					content: result.data.content,
-					goods_price: result.data.proxyPrice,
+			if (goods_no) {
+				let param = {
+					sku: goods_no
 				}
-				this.form.setFieldsValue(obj)
-				this.isLoading = false
-			})
-				.catch(() => {
+				this.isLoading = true
+				GoodsApi.getCollector(param).then((result) => {
+					if (result.data.goods_images.length > 0) {
+						result.data.goods_images.forEach(item => {
+							item.id = Number(this.generateRandomDigits(7))
+						});
+					}
+					this.$refs.childComponent.selectedItems= result.data.goods_images
+					let obj = {
+						goods_name: result.data.name,
+						content: result.data.content,
+						goods_price: result.data.proxyPrice,
+					}
+					this.form.setFieldsValue(obj)
 					this.isLoading = false
 				})
-				.finally(() => (this.isLoading = false))
-			}else{
+					.catch(() => {
+						this.isLoading = false
+					})
+					.finally(() => (this.isLoading = false))
+			} else {
 				this.$message.warning('请输入商品SKU', 1.5)
 			}
 		},