diff --git a/src/api/library.js b/src/api/library.js
new file mode 100644
index 0000000..0f80ee0
--- /dev/null
+++ b/src/api/library.js
@@ -0,0 +1,48 @@
+// +----------------------------------------------------------------------
+// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
+// +----------------------------------------------------------------------
+// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
+// +----------------------------------------------------------------------
+// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
+// +----------------------------------------------------------------------
+// | Author: CRMEB Team <admin@crmeb.com>
+// +----------------------------------------------------------------------
+import request from './request'
+
+/**
+ * @description 商品库 -- 列表
+ */
+export function libraryProductList (data) {
+  return request.get('library/product_list', data)
+}
+
+
+/**
+ * @description 商品库 -- 添加
+ */
+export function libraryProductAdd (data) {
+  return request.post('/library/add', data)
+}
+
+/**
+ * @description 商品库 -- 删除
+ */
+export function libraryProductDel (data) {
+  return request.post('/library/del', data)
+}
+
+/**
+ * @description 商品库 -- 编辑
+ */
+export function libraryProductEdit (data) {
+  return request.post('/library/edit', data)
+}
+
+/**
+ * @description 商品库 -- 详情
+ */
+export function libraryProductDetail (data) {
+  return request.get('/library/detail', data)
+}
+
+
diff --git a/src/api/product.js b/src/api/product.js
index 8aa084c..2276815 100644
--- a/src/api/product.js
+++ b/src/api/product.js
@@ -11,528 +11,528 @@ import request from './request'
 /*
   上传视频 local
 */
-export function uploadVideoOfLocal(data) {
+export function uploadVideoOfLocal (data) {
   return request.post('upload/video', data)
 }
 /**
  * @description 商品分类 -- 列表
  */
-export function storeCategoryListApi() {
+export function storeCategoryListApi () {
   return request.get('store/category/lst')
 }
 /**
  * @description 商品分类 -- 新增表单
  */
-export function storeCategoryCreateApi() {
+export function storeCategoryCreateApi () {
   return request.get('store/category/create/form')
 }
 /**
  * @description 商品分类 -- 编辑表单
  */
-export function storeCategoryUpdateApi(id) {
+export function storeCategoryUpdateApi (id) {
   return request.get(`store/category/update/form/${id}`)
 }
 /**
  * @description 商品分类 -- 删除
  */
-export function storeCategoryDeleteApi(id) {
+export function storeCategoryDeleteApi (id) {
   return request.delete(`store/category/delete/${id}`)
 }
 /**
  * @description 商品分类 -- 修改状态
  */
-export function storeCategoryStatusApi(id, status) {
+export function storeCategoryStatusApi (id, status) {
   return request.post(`store/category/status/${id}`, { status })
 }
 /**
  * @description 商品分类 -- 是否推荐
  */
-export function storeCategoryRecommendApi(id, status) {
+export function storeCategoryRecommendApi (id, status) {
   return request.post(`store/category/is_hot/${id}`, { status })
 }
 /**
  * @description 品牌分类 -- 列表
  */
-export function brandCategoryListApi(data) {
+export function brandCategoryListApi (data) {
   return request.get('store/brand/category/lst', data)
 }
 /**
  * @description 品牌分类 -- 新增表单
  */
-export function brandCategoryCreateApi() {
+export function brandCategoryCreateApi () {
   return request.get('store/brand/category/create/form')
 }
 /**
  * @description 品牌分类 -- 编辑表单
  */
-export function brandCategoryUpdateApi(id) {
+export function brandCategoryUpdateApi (id) {
   return request.get(`store/brand/category/update/form/${id}`)
 }
 /**
  * @description 品牌分类 -- 删除
  */
-export function brandCategoryDeleteApi(id) {
+export function brandCategoryDeleteApi (id) {
   return request.delete(`store/brand/category/delete/${id}`)
 }
 /**
  * @description 品牌分类 -- 修改状态
  */
-export function brandCategoryStatusApi(id, status) {
+export function brandCategoryStatusApi (id, status) {
   return request.post(`store/brand/category/status/${id}`, { status })
 }
 /**
  * @description 品牌 -- 列表
  */
-export function brandListApi(data) {
+export function brandListApi (data) {
   return request.get('store/brand/lst', data)
 }
 /**
  * @description 品牌 -- 新增表单
  */
-export function brandCreateApi() {
+export function brandCreateApi () {
   return request.get('store/brand/create/form')
 }
 /**
  * @description 品牌 -- 编辑表单
  */
-export function brandUpdateApi(id) {
+export function brandUpdateApi (id) {
   return request.get(`store/brand/update/form/${id}`)
 }
 /**
  * @description 品牌 -- 删除
  */
-export function brandDeleteApi(id) {
+export function brandDeleteApi (id) {
   return request.delete(`store/brand/delete/${id}`)
 }
 /**
  * @description 品牌列表 -- 修改状态
  */
-export function brandStatusApi(id, status) {
+export function brandStatusApi (id, status) {
   return request.post(`store/brand/status/${id}`, { status })
 }
 /**
  * @description 标签 -- 新增表单
  */
- export function labelCreateApi() {
-    return request.get('product/label/create/form')
+export function labelCreateApi () {
+  return request.get('product/label/create/form')
 }
 /**
  * @description 标签 -- 编辑表单
  */
- export function labelUpdateApi(id) {
-    return request.get(`product/label/update/${id}/form`)
-  }
+export function labelUpdateApi (id) {
+  return request.get(`product/label/update/${id}/form`)
+}
 /**
  * @description 标签 -- 列表
  */
- export function labelListApi(data) {
-    return request.get('product/label/lst', data)
+export function labelListApi (data) {
+  return request.get('product/label/lst', data)
 }
 /**
  * @description 标签 -- 删除
  */
- export function labelDeleteApi(id) {
-    return request.delete(`product/label/delete/${id}`)
+export function labelDeleteApi (id) {
+  return request.delete(`product/label/delete/${id}`)
 }
 /**
  * @description 标签列表 -- 修改状态
  */
- export function labelStatusApi(id, status) {
-    return request.post(`product/label/status/${id}`, { status })
+export function labelStatusApi (id, status) {
+  return request.post(`product/label/status/${id}`, { status })
 }
 /**
  * @description 商品列表 -- 列表
  */
-export function productLstApi(data) {
+export function productLstApi (data) {
   return request.get(`store/product/lst`, data)
 }
 /**
  * @description 秒杀商品列表 -- 列表
  */
-export function seckillProductLstApi(data) {
+export function seckillProductLstApi (data) {
   return request.get(`seckill/product/lst`, data)
 }
 /**
  * @description 商品列表 -- 平台分类
  */
-export function categoryListApi(data) {
+export function categoryListApi (data) {
   return request.get(`store/category/list`, data)
 }
 /**
  * @description 商户分类 -- 列表
  */
-export function merCategoryListApi() {
+export function merCategoryListApi () {
   return request.get(`system/merchant/category_lst`)
 }
 /**
  * @description 商品审核 -- 详情
  */
-export function productDetailApi(id) {
+export function productDetailApi (id) {
   return request.get(`store/product/detail/${id}`)
 }
 /**
  * @description 秒杀商品审核 -- 详情
  */
-export function seckillProductDetailApi(id) {
+export function seckillProductDetailApi (id) {
   return request.get(`seckill/product/detail/${id}`)
 }
 /**
  * @description 商品审核 -- 表单提交
  */
-export function productStatusApi(data) {
+export function productStatusApi (data) {
   return request.post(`store/product/status`, data)
 }
 /**
  * @description 秒杀商品审核 -- 表单提交
  */
-export function seckillProductStatusApi(data) {
+export function seckillProductStatusApi (data) {
   return request.post(`seckill/product/status`, data)
 }
 /**
  * @description 商品列表 -- 列表表头
  */
-export function lstFilterApi() {
+export function lstFilterApi () {
   return request.get(`store/product/lst_filter`)
 }
 /**
  * @description 秒杀商品列表 -- 列表表头
  */
-export function seckillLstFilterApi() {
+export function seckillLstFilterApi () {
   return request.get(`seckill/product/lst_filter`)
 }
 /**
  * @description 商品评论 -- 列表
  */
-export function replyListApi(data) {
+export function replyListApi (data) {
   return request.get(`store/reply/lst`, data)
 }
 /**
  * @description 商品评论 -- 添加
  */
-export function replyCreateApi(id) {
+export function replyCreateApi (id) {
   return request.get(id ? `store/reply/create/form/${id}` : `store/reply/create/form`)
 }
 /**
  * @description 商品评论 -- 删除
  */
-export function replyDeleteApi(id) {
+export function replyDeleteApi (id) {
   return request.delete(`store/reply/delete/${id}`)
 }
 /**
  * @description 商品评论商品列表 -- 列表
  */
-export function goodLstApi(data) {
+export function goodLstApi (data) {
   return request.get(`store/product/list`, data)
 }
 /**
  * @description 商户总
  */
-export function merSelectApi() {
+export function merSelectApi () {
   return request.get(`store/product/mer_select`)
 }
 /**
  * @description 秒杀商户总
  */
-export function seckillMerSelectApi() {
+export function seckillMerSelectApi () {
   return request.get(`seckill/product/mer_select`)
 }
 /**
  * @description 商品下架
  */
-export function productOffApi(data) {
+export function productOffApi (data) {
   return request.post(`store/product/status`, data)
 }
 /**
  * @description 秒杀商品下架
  */
-export function seckillProductOffApi(data) {
+export function seckillProductOffApi (data) {
   return request.post(`seckill/product/status`, data)
 }
 /**
  * @description 商品编辑
  */
-export function productUpdateApi(id, data) {
+export function productUpdateApi (id, data) {
   return request.post(`store/product/update/${id}`, data)
 }
 /**
  * @description 秒杀商品编辑
  */
-export function seckillProductUpdateApi(id, data) {
+export function seckillProductUpdateApi (id, data) {
   return request.post(`seckill/product/update/${id}`, data)
 }
 /**
  * @description 商品列表 -- 显示隐藏
  */
-export function changeApi(id, status) {
+export function changeApi (id, status) {
   return request.post(`store/product/change/${id}`, { status })
 }
 /**
  * @description 秒杀商品列表 -- 显示隐藏
  */
-export function seckillChangeApi(id, status) {
+export function seckillChangeApi (id, status) {
   return request.post(`seckill/product/change/${id}`, { status })
 }
 /**
  * @description 商品列表 -- 虚拟库存
  */
-export function toVirtualSalesApi(id) {
+export function toVirtualSalesApi (id) {
   return request.get(`store/product/ficti/form/${id}`)
 }
 /**
  * @description 预售 -- 列表
  */
-export function preSaleProListApi(data) {
+export function preSaleProListApi (data) {
   return request.get(`store/product/presell/lst`, data)
 }
 /**
  * @description 预售商品 -- 详情(编辑和查看)
  */
-export function preSaleProDetailApi(id) {
+export function preSaleProDetailApi (id) {
   return request.get(`store/product/presell/get/${id}`)
 }
 /**
  * @description 预售商品 -- 详情(审核)
  */
-export function presellProDetailApi(id) {
+export function presellProDetailApi (id) {
   return request.get(`store/product/presell/detail/${id}`)
 }
 /**
  * @description 预售商品 -- 编辑
  */
-export function presellUpdateApi(id,data) {
-  return request.post(`store/product/presell/update/${id}`,data)
+export function presellUpdateApi (id, data) {
+  return request.post(`store/product/presell/update/${id}`, data)
 }
 /**
  * @description 预售商品审核 -- 表单提交
  */
-export function presellProductStatusApi(data) {
+export function presellProductStatusApi (data) {
   return request.post(`store/product/presell/status`, data)
 }
 /**
  * @description 预售商品列表 -- 显示状态（上下架）
  */
-export function presellStatusApi(id, status) {
+export function presellStatusApi (id, status) {
   return request.post(`store/product/presell/is_show/${id}`, { status })
 }
 /**
  * @description 申请管理 -- 预售协议详情
  */
-export function preSellAgreeInfo() {
+export function preSellAgreeInfo () {
   return request.get(`agreement/sys_product_presell_agree`)
 }
 /**
  * @description 申请管理 -- 预售协议保存
  */
-export function preSellAgreeUpdate(data) {
-  return request.post(`agreement/sys_product_presell_agree`,data)
+export function preSellAgreeUpdate (data) {
+  return request.post(`agreement/sys_product_presell_agree`, data)
 }
 /**
  * @description 助力 -- 列表
  */
-export function assistProListApi(data) {
+export function assistProListApi (data) {
   return request.get(`store/product/assist/lst`, data)
 }
 
 /**
  * @description 助力列表 -- 详情(编辑和查看)
  */
-export function assistProUpdateApi(id) {
+export function assistProUpdateApi (id) {
   return request.get(`store/product/assist/get/${id}`)
 }
 /**
  * @description 助力列表 -- 详情(审核)
  */
-export function assistProDetailApi(id) {
+export function assistProDetailApi (id) {
   return request.get(`store/product/assist/detail/${id}`)
 }
 
 /**
  * @description 助力商品列表 -- 删除
  */
-export function assistDeleteApi(id) {
+export function assistDeleteApi (id) {
   return request.delete(`store/product/assist/delete/${id}`)
 }
 /**
  * @description 助力商品审核 -- 表单提交
  */
-export function assistProductStatusApi(data) {
+export function assistProductStatusApi (data) {
   return request.post(`store/product/assist/status`, data)
 }
 /**
  * @description 助力商品列表 -- 显示状态（上下架）
  */
-export function assistStatusApi(id, status) {
+export function assistStatusApi (id, status) {
   return request.post(`store/product/assist/is_show/${id}`, { status })
 }
 /**
  * @description 助力活动 -- 列表
  */
-export function assistListApi(data) {
+export function assistListApi (data) {
   return request.get(`store/product/assist/set/lst`, data)
 }
 /**
  * @description 助力活动列表 -- 查看详情
  */
-export function assistDetailApi(id, data) {
+export function assistDetailApi (id, data) {
   return request.get(`store/product/assist/set/detail/${id}`, data)
 }
 /**
  * @description 助力商品 -- 详情(编辑和查看)
  */
-export function assistReviewDetailApi(id) {
+export function assistReviewDetailApi (id) {
   return request.get(`store/product/assist/get/${id}`)
 }
 /**
  * @description 助力商品 -- 详情(编辑和查看)
  */
-export function assistProductUpdateApi(id,data) {
-  return request.post(`store/product/assist/update/${id}`,data)
+export function assistProductUpdateApi (id, data) {
+  return request.post(`store/product/assist/update/${id}`, data)
 }
 /**
  * @description 服务保障 -- 添加
  */
-export function guaranteeAddApi() {
-    return request.get(`guarantee/create/form`)
+export function guaranteeAddApi () {
+  return request.get(`guarantee/create/form`)
 }
 /**
  * @description 服务保障 -- 列表
  */
-export function guaranteeLstApi(data) {
-    return request.get(`guarantee/lst`,data)
+export function guaranteeLstApi (data) {
+  return request.get(`guarantee/lst`, data)
 }
 /**
  * @description 服务保障 -- 编辑排序
  */
-export function guaranteeSortApi(id,data) {
-    return request.post(`guarantee/sort/${id}`,data)
+export function guaranteeSortApi (id, data) {
+  return request.post(`guarantee/sort/${id}`, data)
 }
 /**
  * @description 服务保障 -- 修改显示状态
  */
-export function guaranteeStatusApi(id, status) {
-    return request.post(`guarantee/status/${id}`,  status )
+export function guaranteeStatusApi (id, status) {
+  return request.post(`guarantee/status/${id}`, status)
 }
 /**
  * @description 服务保障 -- 编辑
  */
-export function guaranteeUpdateApi(id) {
-    return request.get(`guarantee/update/${id}/form`)
+export function guaranteeUpdateApi (id) {
+  return request.get(`guarantee/update/${id}/form`)
 }
 /**
  * @description 服务保障 -- 删除
  */
-export function guaranteeDeleteApi(id) {
-    return request.delete(`guarantee/delete/${id}`)
+export function guaranteeDeleteApi (id) {
+  return request.delete(`guarantee/delete/${id}`)
 }
 /**
  * @description 商品列表 -- 编辑排序
  */
-export function productSort(id, data) {
-    return request.post(`store/reply/sort/${id}`,data)
+export function productSort (id, data) {
+  return request.post(`store/reply/sort/${id}`, data)
 }
 /** 商品列表 -- 获取标签项 */
-export function getProductLabelApi() {
-    return request.get(`product/label/option`)
+export function getProductLabelApi () {
+  return request.get(`product/label/option`)
 }
 /** 商品列表 -- 编辑标签 */
-export function updatetProductLabel(id, data) {
-    return request.post(`store/product/labels/${id}`, data)
+export function updatetProductLabel (id, data) {
+  return request.post(`store/product/labels/${id}`, data)
 }
 /** 秒杀列表 -- 编辑标签 */
-export function updatetSeckillLabel(id, data) {
-    return request.post(`seckill/product/labels/${id}`, data)
+export function updatetSeckillLabel (id, data) {
+  return request.post(`seckill/product/labels/${id}`, data)
 }
 /** 预售列表 -- 编辑标签 */
-  export function updatetPresellLabel(id, data) {
-    return request.post(`store/product/presell/labels/${id}`, data)
+export function updatetPresellLabel (id, data) {
+  return request.post(`store/product/presell/labels/${id}`, data)
 }
 /** 助力列表 -- 编辑标签 */
-export function updatetAssistLabel(id, data) {
-    return request.post(`store/product/assist/labels/${id}`, data)
+export function updatetAssistLabel (id, data) {
+  return request.post(`store/product/assist/labels/${id}`, data)
 }
 /** 拼团列表 -- 编辑标签 */
-export function updatetCombinationLabel(id, data) {
-    return request.post(`store/product/group/labels/${id}`, data)
+export function updatetCombinationLabel (id, data) {
+  return request.post(`store/product/group/labels/${id}`, data)
 }
 /**
  * @description 上传视频
  */
- export function productGetTempKeysApi() {
+export function productGetTempKeysApi () {
   return request.get(`upload/temp_key`)
 }
 /** 商品列表 -- 批量设置标签 */
-export function batchesLabelsApi(data) {
+export function batchesLabelsApi (data) {
   return request.post(`store/product/batch_labels`, data)
 }
 /** 商品列表 -- 批量设置推荐 */
-export function batchesRecommendApi(data) {
+export function batchesRecommendApi (data) {
   return request.post(`store/product/batch_hot`, data)
 }
 /** 商品列表 -- 批量上下架 */
-export function batchesOnOffApi(data) {
+export function batchesOnOffApi (data) {
   return request.post(`store/product/batch_status`, data)
 }
 /** 价格说明 -- 列表 */
-export function priceRuleLstApi(data) {
+export function priceRuleLstApi (data) {
   return request.get(`price_rule/lst`, data)
 }
 /** 价格说明 -- 添加 */
-export function createPriceRuleApi(data) {
+export function createPriceRuleApi (data) {
   return request.post(`price_rule/create`, data)
 }
 /** 价格说明 -- 编辑 */
-export function updatePriceRuleApi(id, data) {
+export function updatePriceRuleApi (id, data) {
   return request.post(`price_rule/update/${id}`, data)
 }
 /** 价格说明 -- 删除 */
-export function deletePriceRuleApi(id) {
+export function deletePriceRuleApi (id) {
   return request.delete(`price_rule/del/${id}`)
 }
 /** 价格说明 -- 是否显示 */
-export function priceRuleStatusApi(id, status) {
-  return request.post(`price_rule/status/${id}`,status)
+export function priceRuleStatusApi (id, status) {
+  return request.post(`price_rule/status/${id}`, status)
 }
 /** 参数模板 -- 添加 */
-export function productSpecs(data) {
-  return request.post(`store/params/temp/create`,data)
+export function productSpecs (data) {
+  return request.post(`store/params/temp/create`, data)
 }
 /** 参数模板 -- 编辑 */
-export function specsUpdate(id, data) {
-  return request.post(`store/params/temp/update/${id}`,data)
+export function specsUpdate (id, data) {
+  return request.post(`store/params/temp/update/${id}`, data)
 }
 /** 参数模板 -- 详情 */
-export function productSpecsInfo(id) {
+export function productSpecsInfo (id) {
   return request.get(`store/params/temp/detail/${id}`)
 }
 /** 参数模板 -- 列表 */
-export function productSpecsList(data) {
+export function productSpecsList (data) {
   return request.get(`store/params/temp/lst`, data)
 }
 /** 参数模板 -- 删除 */
-export function specsDeteleApi(id) {
+export function specsDeteleApi (id) {
   return request.delete(`store/params/temp/delete/${id}`)
 }
 
 /** 商户参数模板 -- 列表 */
-export function merSpecsList(data) {
+export function merSpecsList (data) {
   return request.get(`store/params/temp/merlst`, data)
 }
 
 /** 转售管理参数模板 -- 列表 */
-export function resaleList(data) {
+export function resaleList (data) {
   return request.get(`product/resale/lst`, data)
 }
 /** 转售管理参数模板  -- 详情 */
-export function  resaleDetail(id) {
+export function resaleDetail (id) {
   return request.get(`product/resale/detail/${id}`)
 }
 
 /** 转售管理参数模板  -- 是否显示 */
-export function  resaleShow(id, status) {
-  return request.post(`product/resale/show/${id}`, {status})
+export function resaleShow (id, status) {
+  return request.post(`product/resale/show/${id}`, { status })
 }
 
 /** 转售管理参数模板  -- 审核 */
-export function  resaleStatus(id, data) {
+export function resaleStatus (id, data) {
   return request.post(`product/resale/status/${id}`, data)
 }
diff --git a/src/router/modules/product.js b/src/router/modules/product.js
index b2a0ee3..ab1202b 100644
--- a/src/router/modules/product.js
+++ b/src/router/modules/product.js
@@ -140,8 +140,26 @@ const productRouter =
         noCache: true
       },
       component: () => import('@/views/product/ProductResale/index.vue')
+    },
+    {
+      path: 'library',
+      name: 'ProductLibrary',
+      meta: {
+        title: '商品库',
+        noCache: true
+      },
+      component: () => import('@/views/product/productLibrary/index.vue')
+    },
+    {
+      path: 'library/edit',
+      name: 'ProductEdit',
+      meta: {
+        title: '商品库',
+        noCache: true
+      },
+      component: () => import('@/views/product/productLibrary/editAdd.vue')
     }
-    
+
   ]
 }
 
diff --git a/src/views/product/productLibrary/editAdd.vue b/src/views/product/productLibrary/editAdd.vue
new file mode 100644
index 0000000..c4f945d
--- /dev/null
+++ b/src/views/product/productLibrary/editAdd.vue
@@ -0,0 +1,2068 @@
+<template>
+  <div class="divBox">
+    <el-card class="box-card">
+      <el-form
+        ref="formValidate"
+        :key="currentTab"
+        v-loading="fullscreenLoading"
+        class="formValidate mt20"
+        :rules="ruleValidate"
+        :model="formValidate"
+        label-width="130px"
+        @submit.native.prevent
+      >
+        <el-row v-if="currentTab == '1'" :gutter="24">
+          <!-- 商品信息-->
+          <el-col :span="24">
+            <el-form-item label="商品类型：" required>
+              <div
+                v-for="(item, index) in virtual"
+                :key="index"
+                class="virtual"
+                :class="
+                  formValidate.type == item.id
+                    ? 'virtual_boder'
+                    : 'virtual_boder2'
+                "
+                @click="virtualbtn(item.id, 2)"
+              >
+                <div class="virtual_top">{{ item.tit }}</div>
+                <div class="virtual_bottom">({{ item.tit2 }})</div>
+                <div v-if="formValidate.type == item.id" class="virtual_san" />
+                <div v-if="formValidate.type == item.id" class="virtual_dui">
+                  ✓
+                </div>
+              </div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="商品名称：" prop="store_name">
+              <el-input
+                v-model="formValidate.store_name"
+                placeholder="请输入商品名称"
+                class="selWidth"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="平台商品分类：" prop="cate_id">
+              <el-cascader
+                v-model="formValidate.cate_id"
+                class="selWidth"
+                :options="categoryList"
+                :props="props"
+                @change="getSpecsLst"
+                filterable
+                clearable
+              />
+            </el-form-item>
+          </el-col>
+
+          <el-col v-if="labelList.length" :span="24">
+            <el-form-item label="商品标签：">
+              <el-select
+                v-model="formValidate.mer_labels"
+                multiple
+                placeholder="请选择"
+                class="selWidth"
+              >
+                <el-option
+                  v-for="item in labelList"
+                  :key="item.id"
+                  :label="item.name"
+                  :value="item.id"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col v-bind="grid2">
+            <el-form-item label="品牌选择：">
+              <el-select
+                v-model="formValidate.brand_id"
+                filterable
+                placeholder="请选择"
+                class="selWidth"
+              >
+                <el-option
+                  v-for="item in BrandList"
+                  :key="item.brand_id"
+                  :label="item.brand_name"
+                  :value="item.brand_id"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="商品封面图：" prop="image">
+              <div
+                class="upLoadPicBox"
+                title="750*750px"
+                @click="modalPicTap('1')"
+              >
+                <div v-if="formValidate.image" class="pictrue">
+                  <img :src="formValidate.image" />
+                </div>
+                <div v-else class="upLoad">
+                  <i class="el-icon-camera cameraIconfont" />
+                </div>
+              </div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="商品轮播图：" prop="slider_image">
+              <div class="acea-row">
+                <div
+                  v-for="(item, index) in formValidate.slider_image"
+                  :key="index"
+                  class="pictrue"
+                  draggable="false"
+                  @dragstart="handleDragStart($event, item)"
+                  @dragover.prevent="handleDragOver($event, item)"
+                  @dragenter="handleDragEnter($event, item)"
+                  @dragend="handleDragEnd($event, item)"
+                >
+                  <img :src="item" />
+                  <i
+                    class="el-icon-error btndel"
+                    @click="handleRemove(index)"
+                  />
+                </div>
+                <div
+                  v-if="formValidate.slider_image.length < 10"
+                  class="uploadCont"
+                  title="750*750px"
+                >
+                  <div class="upLoadPicBox" @click="modalPicTap('2')">
+                    <div class="upLoad">
+                      <i class="el-icon-camera cameraIconfont" />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="主图视频：" prop="video_link">
+              <el-input
+                v-model="videoLink"
+                class="perW50"
+                placeholder="请输入视频链接"
+              />
+              <input
+                ref="refid"
+                type="file"
+                style="display: none"
+                @change="zh_uploadFile_change"
+              />
+              <el-button
+                type="primary"
+                icon="ios-cloud-upload-outline"
+                class="uploadVideo"
+                @click="zh_uploadFile"
+              >
+                {{ videoLink ? "确认添加" : "上传视频" }}
+              </el-button>
+              <el-col :span="12">
+                <el-progress
+                  v-if="upload.videoIng"
+                  :percentage="progress"
+                  :text-inside="true"
+                  :stroke-width="20"
+                  style="margin-top: 10px"
+                />
+              </el-col>
+              <el-col :span="24">
+                <div v-if="formValidate.video_link" class="iview-video-style">
+                  <video
+                    style="
+                      width: 100%;
+                      height: 100% !important;
+                      border-radius: 10px;
+                    "
+                    :src="formValidate.video_link"
+                    controls="controls"
+                  >
+                    您的浏览器不支持 video 标签。
+                  </video>
+                  <div class="mark" />
+                  <i class="el-icon-delete iconv" @click="delVideo" />
+                </div>
+              </el-col>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="单位：" prop="unit_name">
+              <el-input
+                v-model="formValidate.unit_name"
+                placeholder="请输入单位"
+                class="selWidth"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="商品关键字：">
+              <el-input
+                v-model="formValidate.keyword"
+                placeholder="请输入商品关键字"
+                class="selWidth"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="商品简介：" prop="store_info">
+              <el-input
+                v-model="formValidate.store_info"
+                type="textarea"
+                :rows="3"
+                placeholder="请输入商品简介"
+                class="selWidth"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <!-- 规格设置 -->
+        <el-row>
+          <el-col :xl="24" :lg="24" :md="24" :sm="24" :xs="24">
+            <!-- 单规格表格-->
+            <el-form-item v-if="formValidate.spec_type === 0" label="商品详情">
+              <el-table
+                :data="OneattrValue"
+                border
+                class="tabNumWidth"
+                size="mini"
+              >
+                <el-table-column align="center" label="图片" min-width="80">
+                  <template slot-scope="scope">
+                    <div
+                      class="upLoadPicBox"
+                      @click="modalPicTap('1', 'dan', 'pi')"
+                    >
+                      <div v-if="formValidate.image" class="pictrue tabPic">
+                        <img :src="scope.row.image" />
+                      </div>
+                      <div v-else class="upLoad tabPic">
+                        <i class="el-icon-camera cameraIconfont" />
+                      </div>
+                    </div>
+                  </template>
+                </el-table-column>
+                <el-table-column
+                  v-for="(item, iii) in attrValue"
+                  :key="iii"
+                  :label="formThead[iii].title"
+                  align="center"
+                  min-width="120"
+                >
+                  <template slot-scope="scope">
+                    <div v-if="formValidate.svip_price_type != 0">
+                      <el-input-number
+                        v-if="formThead[iii].title === '付费会员价'"
+                        v-model="scope.row[iii]"
+                        :min="0"
+                        :disabled="formValidate.svip_price_type == 1"
+                        class="priceBox"
+                        controls-position="right"
+                      />
+                      <el-input
+                        v-if="formThead[iii].title === '商品条码'"
+                        v-model="scope.row[iii]"
+                        type="text"
+                        class="priceBox"
+                      />
+                      <el-input-number
+                        v-if="
+                          formThead[iii].title !== '付费会员价' &&
+                          formThead[iii].title !== '商品条码'
+                        "
+                        v-model="scope.row[iii]"
+                        :min="0"
+                        class="priceBox"
+                        controls-position="right"
+                      />
+                    </div>
+                    <div v-else>
+                      <el-input
+                        v-if="formThead[iii].title === '商品条码'"
+                        v-model="scope.row[iii]"
+                        type="text"
+                        class="priceBox"
+                      />
+                      <el-input-number
+                        v-else
+                        v-model="scope.row[iii]"
+                        :min="0"
+                        class="priceBox"
+                        controls-position="right"
+                      />
+                    </div>
+                  </template>
+                </el-table-column>
+                <template v-if="formValidate.extension_type === 1">
+                  <el-table-column
+                    align="center"
+                    label="一级返佣(元)"
+                    min-width="120"
+                  >
+                    <template slot-scope="scope">
+                      <el-input-number
+                        v-model="scope.row.extension_one"
+                        :min="0"
+                        class="priceBox"
+                        controls-position="right"
+                      />
+                    </template>
+                  </el-table-column>
+                  <el-table-column
+                    align="center"
+                    label="二级返佣(元)"
+                    min-width="120"
+                  >
+                    <template slot-scope="scope">
+                      <el-input-number
+                        v-model="scope.row.extension_two"
+                        :min="0"
+                        class="priceBox"
+                        controls-position="right"
+                      />
+                    </template>
+                  </el-table-column>
+                </template>
+              </el-table>
+            </el-form-item>
+            <!-- 多规格表格-->
+            <el-form-item
+              v-if="
+                formValidate.spec_type === 1 && formValidate.attr.length > 0
+              "
+              class="labeltop"
+              label="规格列表："
+            >
+              <el-table
+                :data="ManyAttrValue"
+                border
+                class="tabNumWidth"
+                size="mini"
+              >
+                <template v-if="manyTabDate">
+                  <el-table-column
+                    v-for="(item, iii) in manyTabDate"
+                    :key="iii"
+                    align="center"
+                    :label="manyTabTit[iii].title"
+                    min-width="80"
+                  >
+                    <template slot-scope="scope">
+                      <span class="priceBox" v-text="scope.row[iii]" />
+                    </template>
+                  </el-table-column>
+                </template>
+                <el-table-column align="center" label="图片" min-width="80">
+                  <template slot-scope="scope">
+                    <div
+                      class="upLoadPicBox"
+                      title="750*750px"
+                      @click="modalPicTap('1', 'duo', scope.$index)"
+                    >
+                      <div v-if="scope.row.image" class="pictrue tabPic">
+                        <img :src="scope.row.image" />
+                      </div>
+                      <div v-else class="upLoad tabPic">
+                        <i class="el-icon-camera cameraIconfont" />
+                      </div>
+                    </div>
+                  </template>
+                </el-table-column>
+                <el-table-column
+                  v-for="(item, iii) in attrValue"
+                  :key="iii"
+                  :label="formThead[iii].title"
+                  align="center"
+                  min-width="120"
+                >
+                  <template slot-scope="scope">
+                    <div v-if="formValidate.svip_price_type != 0">
+                      <el-input-number
+                        v-if="formThead[iii].title === '付费会员价'"
+                        v-model="scope.row[iii]"
+                        :min="0"
+                        :disabled="formValidate.svip_price_type == 1"
+                        class="priceBox"
+                        controls-position="right"
+                      />
+                      <el-input
+                        v-if="formThead[iii].title === '商品条码'"
+                        v-model="scope.row[iii]"
+                        type="text"
+                        class="priceBox"
+                      />
+                      <el-input-number
+                        v-if="
+                          formThead[iii].title !== '付费会员价' &&
+                          formThead[iii].title !== '商品条码'
+                        "
+                        v-model="scope.row[iii]"
+                        :min="0"
+                        class="priceBox"
+                        controls-position="right"
+                      />
+                    </div>
+                    <div v-else>
+                      <el-input
+                        v-if="formThead[iii].title === '商品条码'"
+                        v-model="scope.row[iii]"
+                        type="text"
+                        class="priceBox"
+                      />
+                      <el-input-number
+                        v-else
+                        v-model="scope.row[iii]"
+                        :min="0"
+                        class="priceBox"
+                        controls-position="right"
+                      />
+                    </div>
+                  </template>
+                </el-table-column>
+                <template v-if="formValidate.extension_type === 1">
+                  <el-table-column
+                    key="1"
+                    align="center"
+                    label="一级返佣(元)"
+                    min-width="120"
+                  >
+                    <template slot-scope="scope">
+                      <el-input-number
+                        v-model="scope.row.extension_one"
+                        :min="0"
+                        class="priceBox"
+                        controls-position="right"
+                      />
+                    </template>
+                  </el-table-column>
+                  <el-table-column
+                    key="2"
+                    align="center"
+                    label="二级返佣(元)"
+                    min-width="120"
+                  >
+                    <template slot-scope="scope">
+                      <el-input-number
+                        v-model="scope.row.extension_two"
+                        :min="0"
+                        class="priceBox"
+                        controls-position="right"
+                      />
+                    </template>
+                  </el-table-column>
+                </template>
+                <el-table-column
+                  key="3"
+                  align="center"
+                  label="操作"
+                  min-width="80"
+                >
+                  <template slot-scope="scope">
+                    <el-button
+                      type="text"
+                      class="submission"
+                      @click="delAttrTable(scope.$index)"
+                      >删除</el-button
+                    >
+                  </template>
+                </el-table-column>
+              </el-table>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <!-- 商品详情-->
+        <el-row>
+          <el-col :span="24">
+            <el-form-item label="商品图片：">
+              <div
+                class="upLoadPicBox"
+                title="750*750px"
+                @click="modalPicTap('3')"
+              >
+                <div
+                  v-for="(item, index) in formValidate.content.image"
+                  class="pictrue details_pictrue"
+                  @click.stop="deleteContentImg(index)"
+                  :key="index + item"
+                >
+                  <img :src="item" :key="index" />
+                </div>
+                <div class="upLoad details_pictrue">
+                  <i class="el-icon-camera cameraIconfont" />
+                </div>
+              </div>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-form-item style="margin-top: 30px">
+          <el-button
+            :loading="loading"
+            type="primary"
+            class="submission"
+            size="small"
+            @click="handleSubmit('formValidate')"
+            >提交
+          </el-button>
+          <el-button
+            :loading="loading"
+            type="primary"
+            class="submission"
+            size="small"
+            @click="handlePreview('formValidate')"
+            >预览
+          </el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <!--预览商品-->
+    <div v-if="previewVisible">
+      <div class="bg" @click.stop="previewVisible = false" />
+      <preview-box
+        v-if="previewVisible"
+        ref="previewBox"
+        :preview-key="previewKey"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+// +----------------------------------------------------------------------
+// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
+// +----------------------------------------------------------------------
+// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
+// +----------------------------------------------------------------------
+// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
+// +----------------------------------------------------------------------
+// | Author: CRMEB Team <admin@crmeb.com>
+// +----------------------------------------------------------------------
+import ueditorFrom from '@/components/ueditorFrom'
+import VueUeditorWrap from 'vue-ueditor-wrap'
+import Sortable from 'sortablejs'
+import {
+  shippingListApi,
+  templateLsitApi,
+  productCreateApi,
+  productDetailApi,
+  categorySelectApi,
+  categoryListApi,
+  categoryBrandListApi,
+  productUpdateApi,
+  productConfigApi,
+  productGetTempKeysApi,
+  guaranteeListApi,
+  productPreviewApi,
+  getProductLabelApi,
+  productSpecsDetailApi
+} from '@/api/product'
+import {
+  libraryProductAdd,
+  libraryProductEdit,
+  libraryProductDetail
+} from '@/api/library'
+import { roterPre } from '@/settings'
+import previewBox from '@/components/previewBox/index'
+import SettingMer from '@/libs/settingMer'
+import { getToken } from '@/utils/auth'
+const defaultObj = {
+  image: '',
+  slider_image: [],
+  store_name: '',
+  store_info: '',
+  keyword: '',
+  brand_id: '', // 品牌id
+  cate_id: '', // 平台分类id
+  param_temp_id: [],
+  unit_name: '',
+  sort: 0,
+  once_max_count: 0,
+  is_good: 0,
+  temp_id: '',
+  video_link: '',
+  guarantee_template_id: '',
+  delivery_way: [],
+  mer_labels: [],
+  delivery_free: 0,
+  pay_limit: 0,
+  once_min_count: 0,
+  svip_price_type: 0,
+  params: [],
+  attrValue: [
+    {
+      image: '',
+      price: null,
+      cost: null,
+      ot_price: null,
+      svip_price: null,
+      stock: null,
+      bar_code: '',
+      weight: null,
+      volume: null
+    }
+  ],
+  attr: [],
+  extension_type: 0,
+  integral_rate: -1,
+  content: {
+    title: '',
+    image: [],
+  },
+  // content: '',
+  spec_type: 0,
+  give_coupon_ids: [],
+  is_gift_bag: 0,
+  couponData: [],
+  extend: [], // 自定义留言
+  type: 0
+}
+const objTitle = {
+  price: {
+    title: '售价'
+  },
+  cost: {
+    title: '成本价'
+  },
+  ot_price: {
+    title: '市场价'
+  },
+  svip_price: {
+    title: '付费会员价'
+  },
+  stock: {
+    title: '库存'
+  },
+  bar_code: {
+    title: '商品条码'
+  },
+  weight: {
+    title: '重量（KG）'
+  },
+  volume: {
+    title: '体积(m³)'
+  }
+}
+const proOptions = [{ name: '店铺推荐', value: 'is_good' }]
+export default {
+  name: 'ProductProductAdd',
+  components: {
+    ueditorFrom,
+    VueUeditorWrap,
+    previewBox,
+  },
+  data () {
+    const url =
+      SettingMer.https + '/upload/image/0/file?ueditor=1&token=' + getToken()
+    return {
+      myConfig: {
+        autoHeightEnabled: false, // 编辑器不自动被内容撑高
+        initialFrameHeight: 500, // 初始容器高度
+        initialFrameWidth: '100%', // 初始容器
+        enableAutoSave: false,
+        UEDITOR_HOME_URL: '/UEditor/',
+        serverUrl: url,
+        imageUrl: url,
+        imageFieldName: 'file',
+        imageUrlPrefix: '',
+        imageActionName: 'upfile',
+        imageMaxSize: 2048000,
+        imageAllowFiles: ['.png', '.jpg', '.jpeg', '.gif', '.bmp']
+      },
+      optionsCate: {
+        value: 'store_category_id',
+        label: 'cate_name',
+        children: 'children',
+        emitPath: false
+      },
+      roterPre: roterPre,
+      selectRule: '',
+      checkboxGroup: [],
+      recommend: proOptions,
+      tabs: [],
+      fullscreenLoading: false,
+      props: { emitPath: false },
+      propsMer: { emitPath: true },
+      active: 0,
+      deduction_set: -1,
+      OneattrValue: [Object.assign({}, defaultObj.attrValue[0])], // 单规格
+      ManyAttrValue: [Object.assign({}, defaultObj.attrValue[0])], // 多规格
+      ruleList: [],
+      categoryList: [], // 平台分类筛选
+      shippingList: [], // 运费模板
+      guaranteeList: [], // 服务保障模板
+      BrandList: [], // 品牌
+      deliveryList: [],
+      labelList: [], // 商品标签
+      formThead: Object.assign({}, objTitle),
+      formValidate: Object.assign({}, defaultObj),
+      picValidate: true,
+      formDynamics: {
+        template_name: '',
+        template_value: []
+      },
+      manyTabTit: {},
+      manyTabDate: {},
+      grid2: {
+        xl: 10,
+        lg: 12,
+        md: 12,
+        sm: 24,
+        xs: 24
+      },
+      // 规格数据
+      formDynamic: {
+        attrsName: '',
+        attrsVal: ''
+      },
+      isBtn: false,
+      manyFormValidate: [],
+      images: [],
+      currentTab: '1',
+      isChoice: '',
+      upload: {
+        videoIng: false // 是否显示进度条；
+      },
+      progress: 10, // 进度条默认0
+      videoLink: '',
+      grid: {
+        xl: 8,
+        lg: 8,
+        md: 12,
+        sm: 24,
+        xs: 24
+      },
+      loading: false,
+      ruleValidate: {
+        give_coupon_ids: [
+          {
+            required: true,
+            message: '请选择优惠券',
+            trigger: 'change',
+            type: 'array'
+          }
+        ],
+        store_name: [
+          { required: true, message: '请输入商品名称', trigger: 'blur' }
+        ],
+        cate_id: [
+          { required: false, message: '请选择平台分类', trigger: 'change' }
+        ],
+        keyword: [
+          { required: true, message: '请输入商品关键字', trigger: 'blur' }
+        ],
+        unit_name: [{ required: true, message: '请输入单位', trigger: 'blur' }],
+        store_info: [
+          { required: false, message: '请输入商品简介', trigger: 'blur' }
+        ],
+        temp_id: [
+          { required: true, message: '请选择运费模板', trigger: 'change' }
+        ],
+        once_max_count: [
+          { required: true, message: '请输入限购数量', trigger: 'change' }
+        ],
+        image: [{ required: true, message: '请上传商品图', trigger: 'change' }],
+        slider_image: [
+          {
+            required: true,
+            message: '请上传商品轮播图',
+            type: 'array',
+            trigger: 'change'
+          }
+        ],
+        spec_type: [
+          { required: true, message: '请选择商品规格', trigger: 'change' }
+        ],
+        delivery_way: [
+          { required: true, message: '请选择送货方式', trigger: 'change' }
+        ]
+      },
+      attrInfo: {},
+      keyNum: 0,
+      extensionStatus: 0,
+      deductionStatus: 0,
+      previewVisible: false,
+      previewKey: '',
+      deliveryType: [],
+      virtual: [
+        { tit: '普通商品', id: 0, tit2: '物流发货' },
+        { tit: '虚拟商品', id: 1, tit2: '虚拟发货' }
+      ],
+      customBtn: 0, // 自定义留言开关
+      // 自定义留言下拉选择
+      CustomList: [
+        {
+          value: 'text',
+          label: '文本框'
+        },
+        {
+          value: 'number',
+          label: '数字'
+        },
+        {
+          value: 'email',
+          label: '邮件'
+        },
+        {
+          value: 'date',
+          label: '日期'
+        },
+        {
+          value: 'time',
+          label: '时间'
+        },
+        {
+          value: 'idCard',
+          label: '身份证'
+        },
+        {
+          value: 'mobile',
+          label: '手机号'
+        },
+        {
+          value: 'image',
+          label: '图片'
+        }
+      ],
+      customess: {
+        content: []
+      }, // 自定义留言内容
+      headTab: [
+        { title: '商品信息', name: '1' },
+        { title: '规格设置', name: '2' },
+        { title: '商品详情', name: '3' },
+        // { title: '营销设置', name: '4' },
+        { title: '其他设置', name: '4' }
+      ],
+      type: 0,
+      modals: false,
+      attrVal: {
+        price: null,
+        cost: null,
+        ot_price: null,
+        stock: null,
+        bar_code: '',
+        weight: null,
+        volume: null
+      },
+      open_svip: false,
+      svip_rate: 0,
+      customSpecs: [],
+      merSpecsSelect: [],
+      sysSpecsSelect: []
+    }
+  },
+  computed: {
+    attrValue () {
+      const obj = Object.assign({}, this.attrVal)
+      return obj
+    },
+    oneFormBatch () {
+      const obj = [Object.assign({}, defaultObj.attrValue[0])]
+      if (this.OneattrValue[0] && this.OneattrValue[0]['image']) { obj[0]['image'] = this.OneattrValue[0]['image'] }
+      delete obj[0].bar_code
+      return obj
+    }
+  },
+  watch: {
+    'formValidate.attr': {
+      handler: function (val) {
+        if (this.formValidate.spec_type === 1) this.watCh(val)
+      },
+      immediate: false,
+      deep: true
+    },
+    currentTab (newVal) {
+      if (newVal == 4) {
+        this.$nextTick(e => {
+          this.setSort()
+        })
+      }
+    }
+
+  },
+  created () {
+    this.tempRoute = Object.assign({}, this.$route)
+    if (this.$route.params.id && this.formValidate.spec_type === 1) {
+      this.$watch('formValidate.attr', this.watCh)
+    }
+  },
+  mounted () {
+    this.formValidate.slider_image = []
+    console.log(this.$route);
+    if (this.$route.query.id) {
+      this.getDetail()
+    }
+    // this.getCategorySelect()
+    this.getCategoryList()
+    this.getBrandListApi()
+    this.getShippingList()
+    this.getGuaranteeList()
+    this.productCon()
+    this.productGetRule()
+    this.getLabelLst()
+    this.$store.dispatch('settings/setEdit', true)
+  },
+  destroyed () {
+    window.removeEventListener('popstate', this.goBack, false)
+  },
+  methods: {
+    setSort () {
+      // // ref一定跟table上面的ref一致
+      // const el = this.$refs.tableParameter.$el.querySelectorAll(
+      //   '.el-table__body-wrapper > table > tbody'
+      // )[0]
+      // this.sortable = Sortable.create(el, {
+      //   ghostClass: 'sortable-ghost',
+      //   setData: function (dataTransfer) {
+      //     dataTransfer.setData('Text', '')
+      //   },
+      //   // 监听拖拽事件结束时触发
+      //   onEnd: evt => {
+      //     this.elChangeExForArray(evt.oldIndex, evt.newIndex, this.formValidate.params)
+      //   }
+      // })
+    },
+    elChangeExForArray (index1, index2, array) {
+      const temp = array[index1]
+      array[index1] = array[index2]
+      array[index2] = temp
+      return array
+    },
+    goBack () {
+      sessionStorage.clear()
+      window.history.back()
+    },
+    handleCloseCoupon (tag) {
+      this.formValidate.couponData.splice(
+        this.formValidate.couponData.indexOf(tag),
+        1
+      )
+      this.formValidate.give_coupon_ids = []
+      this.formValidate.couponData.map(item => {
+        this.formValidate.give_coupon_ids.push(item.coupon_id)
+      })
+    },
+    // 参数模板
+    getSpecsLst (id) {
+      let cate_id = id ? id : this.formValidate.cate_id
+      // specsSelectedApi({ cate_id: cate_id })
+      //   .then(res => {
+      //     this.merSpecsSelect = res.data.mer
+      //     this.sysSpecsSelect = res.data.sys
+      //   })
+      //   .catch(res => {
+      //     this.$message.error(res.message)
+      //   })
+    },
+    productCon () {
+      // productConfigApi()
+      //   .then(res => {
+      //     this.extensionStatus = res.data.extension_status
+      //     this.deductionStatus = res.data.integral_status
+      //     this.deliveryType = res.data.delivery_way.map(String)
+      //     this.open_svip =
+      //       res.data.mer_svip_status == 1 && res.data.svip_switch_status == 1
+      //     this.svip_rate = res.data.svip_store_rate
+      //     const name = this.formValidate.type == 0 ? '快递配送' : '虚拟发货'
+      //     if (!this.$route.params.id) { this.formValidate.delivery_way = this.deliveryType }
+      //     if (this.deliveryType.length == 2) {
+      //       this.deliveryList = [
+      //         { value: '1', name: '到店自提' },
+      //         { value: '2', name: name }
+      //       ]
+      //     } else {
+      //       if (this.deliveryType.length == 1 && this.deliveryType[0] == '1') {
+      //         this.deliveryList = [{ value: '1', name: '到店自提' }]
+      //       } else {
+      //         this.deliveryList = [{ value: '2', name: name }]
+      //       }
+      //     }
+      //   })
+      //   .catch(res => {
+      //     this.$message.error(res.message)
+      //   })
+    },
+    // 获取标签项
+    getLabelLst () {
+      getProductLabelApi()
+        .then(res => {
+          this.labelList = res.data
+        })
+        .catch(res => {
+          this.$message.error(res.message)
+        })
+    },
+    addCoupon () {
+      const _this = this
+      this.$modalCoupon(
+        this.formValidate.couponData,
+        'wu',
+        _this.formValidate.give_coupon_ids,
+        (this.keyNum += 1),
+        function (row) {
+          _this.formValidate.give_coupon_ids = []
+          _this.formValidate.couponData = row
+          row.map(item => {
+            _this.formValidate.give_coupon_ids.push(item.coupon_id)
+          })
+        }
+      )
+    },
+    delSpecs (index) {
+      this.formValidate.params.splice(index, 1)
+    },
+    addSpecs () {
+      this.formValidate.params.push({ name: '', value: '', sort: 0 })
+    },
+    // 参数模板详情
+    getSpecsList () {
+      let merParams = [...this.customSpecs], sysParams = [...[this.formValidate.param_temp_id]]
+      let params = [...merParams, ...sysParams]
+      console.log(params)
+      console.log(this.customSpecs)
+      if (params.length <= 0) {
+        this.formValidate.merParams = []
+        this.formValidate.sysParams = []
+      } else {
+        productSpecsDetailApi({
+          template_ids: params.toString()
+        })
+          .then(res => {
+            this.formValidate.params = res.data
+          })
+          .catch(res => {
+            this.$message.error(res.message)
+          })
+      }
+    },
+    setTagsViewTitle () {
+      const title = '编辑商品'
+      const route = Object.assign({}, this.tempRoute, {
+        title: `${title}-${this.$route.params.id}`
+      })
+      this.$store.dispatch('tagsView/updateVisitedView', route)
+    },
+    onChangeGroup () {
+      this.checkboxGroup.includes('is_good')
+        ? (this.formValidate.is_good = 1)
+        : (this.formValidate.is_good = 0)
+    },
+    watCh (val) {
+      const tmp = {}
+      const tmpTab = {}
+      this.formValidate.attr.forEach((o, i) => {
+        tmp['value' + i] = { title: o.value }
+        tmpTab['value' + i] = ''
+      })
+      this.ManyAttrValue = this.attrFormat(val)
+      this.ManyAttrValue.forEach((val, index) => {
+        const key = Object.values(val.detail)
+          .sort()
+          .join('/')
+        if (this.attrInfo[key]) this.ManyAttrValue[index] = this.attrInfo[key]
+      })
+      this.attrInfo = {}
+      this.ManyAttrValue.forEach(val => {
+        // this.attrInfo[Object.values(val.detail).sort().join('/')] = val
+        if (val.detail !== 'undefined' && val.detail !== null) {
+          this.attrInfo[
+            Object.values(val.detail)
+              .sort()
+              .join('/')
+          ] = val
+        }
+      })
+      this.manyTabTit = tmp
+      this.manyTabDate = tmpTab
+      this.formThead = Object.assign({}, this.formThead, tmp)
+    },
+    attrFormat (arr) {
+      let data = []
+      const res = []
+      return format(arr)
+
+      function format (arr) {
+        if (arr.length > 1) {
+          arr.forEach((v, i) => {
+            if (i === 0) data = arr[i]['detail']
+            const tmp = []
+            data.forEach(function (vv) {
+              arr[i + 1] &&
+                arr[i + 1]['detail'] &&
+                arr[i + 1]['detail'].forEach(g => {
+                  const rep2 =
+                    (i !== 0 ? '' : arr[i]['value'] + '_$_') +
+                    vv +
+                    '-$-' +
+                    arr[i + 1]['value'] +
+                    '_$_' +
+                    g
+                  tmp.push(rep2)
+                  if (i === arr.length - 2) {
+                    const rep4 = {
+                      image: '',
+                      price: 0,
+                      cost: 0,
+                      ot_price: 0,
+                      stock: 0,
+                      bar_code: '',
+                      weight: 0,
+                      volume: 0,
+                      brokerage: 0,
+                      brokerage_two: 0
+                    }
+                    rep2.split('-$-').forEach((h, k) => {
+                      const rep3 = h.split('_$_')
+                      if (!rep4['detail']) rep4['detail'] = {}
+                      rep4['detail'][rep3[0]] = rep3.length > 1 ? rep3[1] : ''
+                    })
+                    // if(rep4.detail !== 'undefined' && rep4.detail !== null){
+                    Object.values(rep4.detail).forEach((v, i) => {
+                      rep4['value' + i] = v
+                    })
+                    // }
+
+                    res.push(rep4)
+                  }
+                })
+            })
+            data = tmp.length ? tmp : []
+          })
+        } else {
+          const dataArr = []
+          arr.forEach((v, k) => {
+            v['detail'].forEach((vv, kk) => {
+              dataArr[kk] = v['value'] + '_' + vv
+              res[kk] = {
+                image: '',
+                price: 0,
+                cost: 0,
+                ot_price: 0,
+                stock: 0,
+                bar_code: '',
+                weight: 0,
+                volume: 0,
+                brokerage: 0,
+                brokerage_two: 0,
+                detail: { [v['value']]: vv }
+              }
+              // if(res[kk].detail !== 'undefined' && res[kk].detail !== null){
+              Object.values(res[kk].detail).forEach((v, i) => {
+                res[kk]['value' + i] = v
+              })
+              // }
+            })
+          })
+          data.push(dataArr.join('$&'))
+        }
+        return res
+      }
+    },
+    // 运费模板
+    addTem () {
+      const _this = this
+      this.$modalTemplates(0, function () {
+        _this.getShippingList()
+      })
+    },
+    // 删除视频；
+    delVideo () {
+      const that = this
+      that.$set(that.formValidate, 'video_link', '')
+    },
+    zh_uploadFile () {
+      if (this.videoLink) {
+        this.formValidate.video_link = this.videoLink
+      } else {
+        this.$refs.refid.click()
+      }
+    },
+    zh_uploadFile_change (evfile) {
+      const that = this
+      that.progress = 10
+      const suffix = evfile.target.files[0].name.substr(
+        evfile.target.files[0].name.indexOf('.')
+      )
+      if (suffix !== '.mp4') {
+        return that.$message.error('只能上传MP4文件')
+      }
+      productGetTempKeysApi().then(res => {
+        that.$videoCloud
+          .videoUpload({
+            type: res.data.type,
+            evfile: evfile,
+            res: res,
+            uploading (status, progress) {
+              that.upload.videoIng = status
+            }
+          })
+          .then(res => {
+            that.formValidate.video_link = res.url || res.data.src
+            that.$message.success('视频上传成功')
+            that.progress = 100
+          })
+          .catch(res => {
+            that.upload.videoIng = false
+            that.$message.error(res.message)
+          })
+      })
+    },
+    // 添加规则；
+    addRule () {
+      const _this = this
+      this.$modalAttr(this.formDynamics, function () {
+        _this.productGetRule()
+      })
+    },
+    // 选择规格
+    onChangeSpec (num) {
+      if (num === 1) this.productGetRule()
+    },
+    // 切换积分抵扣
+    changeIntergral (e) {
+      if (e == -1) {
+        this.formValidate.integral_rate = -1
+      } else {
+        this.formValidate.integral_rate = this.formValidate.integral_rate
+      }
+    },
+    // 选择属性确认
+    confirm () {
+      if (!this.selectRule) {
+        return this.$message.warning('请选择属性')
+      }
+      this.ruleList.forEach(item => {
+        if (item.attr_template_id === this.selectRule) {
+          this.formValidate.attr = item.template_value
+        }
+      })
+    },
+    // 平台分类；
+    getCategoryList () {
+      categoryListApi()
+        .then(res => {
+          this.categoryList = res.data
+        })
+        .catch(res => {
+          this.$message.error(res.message)
+        })
+    },
+    // 品牌筛选；
+    getBrandListApi () {
+      // categoryBrandListApi()
+      //   .then(res => {
+      //     this.BrandList = res.data
+      //   })
+      //   .catch(res => {
+      //     this.$message.error(res.message)
+      //   })
+    },
+    // 获取商品属性模板；
+    productGetRule () {
+      // templateLsitApi().then(res => {
+      //   this.ruleList = res.data
+      // })
+    },
+    // 运费模板；
+    getShippingList () {
+      // shippingListApi().then(res => {
+      //   this.shippingList = res.data
+      // })
+    },
+    // 获取服务保障模板
+    getGuaranteeList () {
+      // guaranteeListApi().then(res => {
+      //   this.guaranteeList = res.data
+      // })
+    },
+    showInput (item) {
+      this.$set(item, 'inputVisible', true)
+    },
+    virtualbtn (id, type) {
+      if (this.$route.params.id) {
+        return this.$message.warning('商品类型不能切换!')
+      }
+      this.formValidate.type = id
+      this.productCon()
+    },
+    customMessBtn (e) {
+      if (!e) {
+        this.formValidate.extend = []
+      }
+    },
+    addcustom () {
+      if (this.formValidate.extend.length > 9) {
+        this.$message.warning('最多添加10条')
+      } else {
+        this.formValidate.extend.push({
+          title: '',
+          key: 'text',
+          value: '',
+          require: false
+        })
+      }
+    },
+    delcustom (index) {
+      this.formValidate.extend.splice(index, 1)
+    },
+    onChangetype (item) {
+      if (item === 1) {
+        this.OneattrValue.map(item => {
+          this.$set(item, 'extension_one', null)
+          this.$set(item, 'extension_two', null)
+        })
+        this.ManyAttrValue.map(item => {
+          this.$set(item, 'extension_one', null)
+          this.$set(item, 'extension_two', null)
+        })
+      } else {
+        this.OneattrValue.map(item => {
+          delete item.extension_one
+          delete item.extension_two
+          this.$set(item, 'extension_one', null)
+          this.$set(item, 'extension_two', null)
+        })
+        this.ManyAttrValue.map(item => {
+          delete item.extension_one
+          delete item.extension_two
+        })
+      }
+    },
+    onChangeSpecs (item) {
+      if (item == 1 || item == 2) {
+        this.attrVal = {
+          price: null,
+          cost: null,
+          ot_price: null,
+          svip_price: null,
+          stock: null,
+          bar_code: '',
+          weight: null,
+          volume: null
+        }
+        this.OneattrValue[0]['svip_price'] = this.OneattrValue[0]['price']
+          ? this.accMul(this.OneattrValue[0]['price'], this.svip_rate)
+          : 0
+        let price = 0
+        for (const val of this.ManyAttrValue) {
+          price = val.price ? this.accMul(val.price, this.svip_rate) : 0
+          this.$set(val, 'svip_price', price)
+        }
+      } else {
+        this.attrVal = {
+          price: null,
+          cost: null,
+          ot_price: null,
+          stock: null,
+          bar_code: '',
+          weight: null,
+          volume: null
+        }
+      }
+    },
+    memberPrice (formHead, row) {
+      if (formHead.title == '售价') {
+        row.svip_price = this.accMul(row.price, this.svip_rate)
+      }
+    },
+    // 乘法
+    accMul (arg1, arg2) {
+      var max = 0
+      var s1 = arg1.toString()
+      var s2 = arg2.toString()
+      try {
+        max += s1.split('.')[1].length
+      } catch (e) { }
+      try {
+        max += s2.split('.')[1].length
+      } catch (e) { }
+      return (
+        (Number(s1.replace('.', '')) * Number(s2.replace('.', ''))) /
+        Math.pow(10, max)
+      )
+    },
+    // 删除表格中的属性
+    delAttrTable (index) {
+      this.ManyAttrValue.splice(index, 1)
+    },
+    // 批量添加
+    batchAdd () {
+      for (const val of this.ManyAttrValue) {
+        console.log(this.oneFormBatch[0])
+        if (this.oneFormBatch[0].image != '') this.$set(val, 'image', this.oneFormBatch[0].image)
+        if (this.oneFormBatch[0].price != null) this.$set(val, 'price', this.oneFormBatch[0].price)
+        if (this.oneFormBatch[0].cost != null) this.$set(val, 'cost', this.oneFormBatch[0].cost)
+        if (this.oneFormBatch[0].ot_price != null) this.$set(val, 'ot_price', this.oneFormBatch[0].ot_price)
+        if (this.oneFormBatch[0].svip_price != null) this.$set(val, 'svip_price', this.oneFormBatch[0].svip_price)
+        if (this.oneFormBatch[0].stock != null) this.$set(val, 'stock', this.oneFormBatch[0].stock)
+        if (this.oneFormBatch[0].bar_code != null) this.$set(val, 'bar_code', this.oneFormBatch[0].bar_code)
+        if (this.oneFormBatch[0].weight != null) this.$set(val, 'weight', this.oneFormBatch[0].weight)
+        if (this.oneFormBatch[0].volume != null) this.$set(val, 'volume', this.oneFormBatch[0].volume)
+        if (this.oneFormBatch[0].extension_one != null) this.$set(val, 'extension_one', this.oneFormBatch[0].extension_one)
+        if (this.oneFormBatch[0].extension_two != null) this.$set(val, 'extension_two', this.oneFormBatch[0].extension_two)
+      }
+    },
+    // 添加按钮
+    addBtn () {
+      this.clearAttr()
+      this.isBtn = true
+    },
+    // 取消
+    offAttrName () {
+      this.isBtn = false
+    },
+    clearAttr () {
+      this.formDynamic.attrsName = ''
+      this.formDynamic.attrsVal = ''
+    },
+    // 删除规格
+    handleRemoveAttr (index) {
+      this.formValidate.attr.splice(index, 1)
+      this.manyFormValidate.splice(index, 1)
+    },
+    // 删除属性
+    handleClose (item, index) {
+      item.splice(index, 1)
+    },
+    // 添加规则名称
+    createAttrName () {
+      if (this.formDynamic.attrsName && this.formDynamic.attrsVal) {
+        const data = {
+          value: this.formDynamic.attrsName,
+          detail: [this.formDynamic.attrsVal]
+        }
+        this.formValidate.attr.push(data)
+        var hash = {}
+        this.formValidate.attr = this.formValidate.attr.reduce(function (
+          item,
+          next
+        ) {
+          /* eslint-disable */
+          hash[next.value] ? "" : (hash[next.value] = true && item.push(next));
+          return item;
+        },
+          []);
+        this.clearAttr();
+        this.isBtn = false;
+      } else {
+        this.$message.warning("请添加完整的规格！");
+      }
+    },
+    // 添加属性
+    createAttr (num, idx) {
+      if (num) {
+        this.formValidate.attr[idx].detail.push(num);
+        var hash = {};
+        this.formValidate.attr[idx].detail = this.formValidate.attr[
+          idx
+        ].detail.reduce(function (item, next) {
+          /* eslint-disable */
+          hash[next] ? "" : (hash[next] = true && item.push(next));
+          return item;
+        }, []);
+        this.formValidate.attr[idx].inputVisible = false;
+      } else {
+        this.$message.warning("请添加属性");
+      }
+    },
+    // 详情
+    getInfo () {
+      this.fullscreenLoading = true;
+      productDetailApi(this.$route.params.id)
+        .then(async res => {
+          if (res.data.content_arr && res.data.content_arr.length > 0) res.data.content = res.data.content_arr;
+          let info = res.data;
+          this.infoData(info);
+          this.getSpecsLst(info.cate_id);
+        })
+        .catch(res => {
+          this.fullscreenLoading = false;
+          this.$message.error(res.message);
+        });
+    },
+    // 详情
+    getDetail () {
+      this.fullscreenLoading = true;
+      libraryProductDetail(this.$route.query.id)
+        .then(async res => {
+          if (res.data.content_arr && res.data.content_arr.length > 0) res.data.content = res.data.content_arr;
+          let info = res.data;
+          this.infoData(info);
+          this.getSpecsLst(info.cate_id);
+        })
+        .catch(res => {
+          this.fullscreenLoading = false;
+          this.$message.error(res.message);
+        });
+    },
+    infoData (info) {
+      this.deduction_set = info.integral_rate == -1 ? -1 : 1;
+      this.formValidate = {
+        image: info.image,
+        attrValue: info.attrValue,
+        slider_image: info.slider_image,
+        store_name: info.store_name,
+        store_info: info.store_info,
+        keyword: info.keyword,
+        params: info.params,
+        param_temp_id: info.param_temp_id,
+        brand_id: info.brand_id, // 品牌id
+        cate_id: info.cate_id, // 平台分类id
+        unit_name: info.unit_name,
+        sort: info.sort,
+        once_max_count: info.once_max_count || 1,
+        once_min_count: info.once_min_count || 0,
+        is_good: info.is_good,
+        temp_id: info.temp_id,
+        guarantee_template_id: info.guarantee_template_id
+          ? info.guarantee_template_id
+          : "",
+        attr: info.attr,
+        pay_limit: info.pay_limit || 0,
+        extension_type: info.extension_type,
+        content: info.content,
+        spec_type: Number(info.spec_type),
+        give_coupon_ids: info.give_coupon_ids,
+        is_gift_bag: info.is_gift_bag,
+        couponData: info.coupon,
+        video_link: info.video_link ? info.video_link : "",
+        integral_rate: info.integral_rate,
+        delivery_way:
+          info.delivery_way && info.delivery_way.length
+            ? info.delivery_way.map(String)
+            : this.deliveryType,
+        delivery_free: info.delivery_free ? info.delivery_free : 0,
+        mer_labels:
+          info.mer_labels && info.mer_labels.length
+            ? info.mer_labels.map(Number)
+            : [],
+        type: info.type || 0,
+        extend: info.extend || [],
+        svip_price_type: info.svip_price_type || 0
+      };
+      if (info.svip_price_type != 0)
+        this.attrVal = {
+          price: null,
+          cost: null,
+          ot_price: null,
+          svip_price: null,
+          stock: null,
+          bar_code: "",
+          weight: null,
+          volume: null
+        };
+      if (this.formValidate.extend.length != 0) {
+        this.customBtn = 1;
+      }
+      if (this.formValidate.spec_type === 0) {
+        this.OneattrValue = info.attrValue;
+      } else {
+        this.ManyAttrValue = info.attrValue;
+        this.ManyAttrValue.forEach(val => {
+          if (val.detail !== "undefined" && val.detail !== null) {
+            this.attrInfo[
+              Object.values(val.detail)
+                .sort()
+                .join("/")
+            ] = val;
+          }
+        });
+      }
+      if (this.formValidate.is_good === 1) {
+        this.checkboxGroup.push("is_good");
+      }
+      this.fullscreenLoading = false;
+    },
+    //关闭淘宝弹窗并生成数据；
+    onClose (data) {
+      this.modals = false;
+      this.infoData(data);
+    },
+    handleRemove (i) {
+      this.formValidate.slider_image.splice(i, 1);
+    },
+    // 点击商品图
+    modalPicTap (tit, num, i) {
+      const _this = this;
+      const attr = [];
+      this.$modalUpload(function (img) {
+        if (tit === "1" && !num) {
+          _this.formValidate.image = img[0];
+          _this.OneattrValue[0].image = img[0];
+        }
+        if (tit === "2" && !num) {
+          img.map(item => {
+            attr.push(item.attachment_src);
+            _this.formValidate.slider_image.push(item);
+            if (_this.formValidate.slider_image.length > 10) {
+              _this.formValidate.slider_image.length = 10;
+            }
+          });
+        }
+        if (tit === "1" && num === "dan") {
+          _this.OneattrValue[0].image = img[0];
+        }
+        if (tit === "1" && num === "duo") {
+          _this.ManyAttrValue[i].image = img[0];
+        }
+        if (tit === "1" && num === "pi") {
+          _this.oneFormBatch[0].image = img[0];
+        }
+        if (tit === "3") {
+          // console.log('选择的', _this.formValidate?.content, img)
+          let image = _this.formValidate.content.image ? _this.formValidate.content.image : [];
+          _this.formValidate.content = {
+            image: [...image, ...img],
+            title: _this.formValidate.content.title
+          }
+          console.log('选择好的', _this.formValidate.content)
+        }
+      }, tit);
+    },
+    // 删除详情图片
+    deleteContentImg (index) {
+      this.formValidate.content.image.splice(index, 1)
+    },
+    handleSubmitUp () {
+      this.currentTab = (Number(this.currentTab) - 1).toString();
+    },
+    handleSubmitNest (name) {
+      this.$refs[name].validate(valid => {
+        if (valid) {
+          this.currentTab = (Number(this.currentTab) + 1).toString();
+        }
+      });
+    },
+    validateAttr () {
+      Object.keys(this.formValidate.attrValue[0]).forEach((item) => {
+        if (this.formValidate.attrValue[0][item] == undefined && item != 'bar_code') {
+          this.formValidate.attrValue[0][item] = 0;
+        }
+      })
+    },
+    // 提交
+    handleSubmit (name) {
+      this.$store.dispatch("settings/setEdit", false);
+      this.onChangeGroup();
+      if (this.formValidate.spec_type === 1) {
+        this.formValidate.attrValue = this.ManyAttrValue;
+      } else {
+        this.formValidate.attrValue = this.OneattrValue;
+        this.formValidate.attr = [];
+      }
+      this.$refs[name].validate(valid => {
+        console.log(this.formValidate);
+        if (valid) {
+          this.validateAttr();
+          this.fullscreenLoading = true;
+          this.loading = true;
+          let disCreate = this.$route.params.id && !this.$route.query.type;
+          let formData = JSON.parse(JSON.stringify(this.formValidate))
+          formData = { ...formData, ...formData.attrValue[0] }
+          formData.images = formData.content.image.join(',');
+          formData.slider_image = formData.slider_image.join(',');
+          disCreate
+            ? libraryProductEdit(this.$route.params.id, formData)
+              .then(async res => {
+                this.fullscreenLoading = false;
+                this.$message.success(res.message);
+                this.$router.push({ path: this.roterPre + "/product/list" });
+                this.$refs[name].resetFields();
+                formData.slider_image = '';
+                this.loading = false;
+              })
+              .catch(res => {
+                this.fullscreenLoading = false;
+                this.loading = false;
+                this.$message.error(res.message);
+              })
+            : libraryProductAdd(formData)
+              .then(async res => {
+                this.fullscreenLoading = false;
+                this.$message.success(res.message);
+                this.$router.push({ path: this.roterPre + "/product/library" });
+                this.loading = false;
+              })
+              .catch(res => {
+                this.fullscreenLoading = false;
+                this.loading = false;
+                this.$message.error(res.message);
+              });
+        } else {
+          if (!this.formValidate.store_name.trim()) {
+            return this.$message.warning("基本信息-商品名称不能为空");
+          }
+          if (!this.formValidate.unit_name) {
+            return this.$message.warning("基本信息-单位不能为空");
+          }
+          if (!this.formValidate.cate_id) {
+            return this.$message.warning("基本信息-平台商品分类不能为空");
+          }
+          if (!this.formValidate.image) {
+            return this.$message.warning("基本信息-商品封面图不能为空");
+          }
+          if (this.formValidate.slider_image.length < 0) {
+            return this.$message.warning("基本信息-商品轮播图不能为空");
+          }
+        }
+      });
+    },
+    //预览
+    handlePreview (name) {
+      this.onChangeGroup();
+      if (this.formValidate.spec_type === 1) {
+        this.formValidate.attrValue = this.ManyAttrValue;
+      } else {
+        this.formValidate.attrValue = this.OneattrValue;
+        this.formValidate.attr = [];
+      }
+      productPreviewApi(this.formValidate)
+        .then(async res => {
+          this.previewVisible = true;
+          this.previewKey = res.data.preview_key;
+        })
+        .catch(res => {
+          this.$message.error(res.message);
+        });
+    },
+    // 表单验证
+    validate (prop, status, error) {
+      if (status === false) {
+        this.$message.warning(error);
+      }
+    },
+    // 规格图片验证
+    specPicValidate (ManyAttrValue) {
+      for (let i = 0; i < ManyAttrValue.length; i++) {
+        if (ManyAttrValue[i].image === "" || !ManyAttrValue[i].image) {
+          this.$message.warning("请上传商品规格图！");
+          this.picValidate = false;
+          break;
+        }
+      }
+    },
+    // 移动
+    handleDragStart (e, item) {
+      this.dragging = item;
+    },
+    handleDragEnd (e, item) {
+      this.dragging = null;
+    },
+    handleDragOver (e) {
+      e.dataTransfer.dropEffect = "move";
+    },
+    handleDragEnter (e, item) {
+      e.dataTransfer.effectAllowed = "move";
+      if (item === this.dragging) {
+        return;
+      }
+      const newItems = [...this.formValidate.slider_image];
+      const src = newItems.indexOf(this.dragging);
+      const dst = newItems.indexOf(item);
+      newItems.splice(dst, 0, ...newItems.splice(src, 1));
+      this.formValidate.slider_image = newItems;
+    },
+    // 添加自定义弹窗
+    addCustomDialog (editorId) {
+      window.UE.registerUI(
+        "test-dialog",
+        function (editor, uiName) {
+          // 创建 dialog
+          let dialog = new window.UE.ui.Dialog({
+            iframeUrl: roterPre + "/admin/widget/image?field=dialog",
+            editor: editor,
+            name: uiName,
+            title: "上传图片",
+            cssRules: "width:1200px;height:500px;padding:20px;"
+          });
+          this.dialog = dialog;
+          let btn = new window.UE.ui.Button({
+            name: "dialog-button",
+            title: "上传图片",
+            cssRules: `background-image: url(../../../assets/images/icons.png);background-position: -726px -77px;`,
+            onclick: function () {
+              // 渲染dialog
+              dialog.render();
+              dialog.open();
+            }
+          });
+          return btn;
+        },
+        37
+      );
+      window.UE.registerUI(
+        "video-dialog",
+        function (editor, uiName) {
+          let dialog = new window.UE.ui.Dialog({
+            iframeUrl: roterPre + "/admin/widget/video?fodder=video",
+            editor: editor,
+            name: uiName,
+            title: "上传视频",
+            cssRules: "width:600px;height:420px;padding:10px 20px 20px;"
+          });
+          this.dialog = dialog;
+          let btn = new window.UE.ui.Button({
+            name: "video-button",
+            title: "上传视频",
+            cssRules: `background-image: url(../../../assets/images/icons.png);background-position: -320px -20px;`,
+            onclick: function () {
+              // 渲染dialog
+              dialog.render();
+              dialog.open();
+            }
+          });
+          return btn;
+        },
+        38
+      );
+    }
+  }
+};
+</script>
+<style scoped lang="scss">
+.bg {
+  z-index: 100;
+  position: fixed;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.5);
+}
+.goods_detail .goods_detail_wrapper {
+  z-index: -10;
+}
+/deep/ .upLoadPicBox {
+  .upLoad {
+    -webkit-box-orient: vertical;
+    -moz-box-orient: vertical;
+    -o-box-orient: vertical;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    line-height: 20px;
+  }
+  span {
+    font-size: 10px;
+  }
+}
+.proCoupon {
+  /deep/ .el-form-item__content {
+    margin-top: 5px;
+  }
+}
+.tabPic {
+  width: 40px !important;
+  height: 40px !important;
+  img {
+    width: 100%;
+    height: 100%;
+  }
+}
+.noLeft {
+  /deep/ .el-form-item__content {
+    margin-left: 0 !important;
+  }
+}
+.tabNumWidth {
+  /deep/ .el-input-number--medium {
+    width: 100px;
+  }
+  /deep/ .el-input-number__increase {
+    width: 20px !important;
+    font-size: 12px !important;
+  }
+  /deep/ .el-input-number__decrease {
+    width: 20px !important;
+    font-size: 12px !important;
+  }
+  /deep/ .el-input-number--medium .el-input__inner {
+    padding-left: 25px !important;
+    padding-right: 25px !important;
+  }
+  /deep/.priceBox .el-input-number__decrease,
+  /deep/.priceBox .el-input-number__increase {
+    display: none;
+  }
+  /deep/.priceBox .el-input-number.is-controls-right .el-input__inner {
+    padding: 0 5px;
+  }
+  /deep/ thead {
+    line-height: normal !important;
+  }
+  /deep/.cell {
+    line-height: normal !important;
+    text-overflow: clip !important;
+  }
+}
+.virtual_boder {
+  border: 1px solid #1890ff;
+}
+.virtual_boder2 {
+  border: 1px solid #e7e7e7;
+}
+.virtual_san {
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  width: 0;
+  height: 0;
+  border-bottom: 26px solid #1890ff;
+  border-left: 26px solid transparent;
+}
+.virtual_dui {
+  position: absolute;
+  bottom: -2px;
+  right: 2px;
+  color: #ffffff;
+  font-family: system-ui;
+}
+.virtual {
+  width: 120px;
+  height: 60px;
+  background: #ffffff;
+  border-radius: 3px;
+  float: left;
+  text-align: center;
+  padding-top: 8px;
+  position: relative;
+  cursor: pointer;
+  line-height: 23px;
+  .virtual_top {
+    font-size: 14px;
+    font-weight: 600;
+    color: rgba(0, 0, 0, 0.85);
+  }
+  .virtual_bottom {
+    font-size: 12px;
+    font-weight: 400;
+    color: #999999;
+  }
+}
+.virtual:nth-child(2n) {
+  margin: 0 12px;
+}
+.addfont {
+  display: inline-block;
+  font-size: 13px;
+  font-weight: 400;
+  color: #1890ff;
+  margin-left: 14px;
+  cursor: pointer;
+}
+.titTip {
+  display: inline-bolck;
+  font-size: 12px;
+  font-weight: 400;
+  color: #999999;
+}
+.addCustom_content {
+  margin-top: 20px;
+  .custom_box {
+    margin-bottom: 10px;
+  }
+}
+.addCustomBox {
+  margin-top: 12px;
+  font-size: 13px;
+  font-weight: 400;
+  color: #1890ff;
+  .btn {
+    cursor: pointer;
+    width: max-content;
+  }
+  .remark {
+    display: flex;
+    margin-top: 14px;
+  }
+}
+.selWidth {
+  width: 50%;
+}
+.ml15 {
+  margin-left: 15px;
+}
+.button-new-tag {
+  height: 28px;
+  line-height: 26px;
+  padding-top: 0;
+  padding-bottom: 0;
+}
+.input-new-tag {
+  width: 90px;
+  margin-left: 10px;
+  vertical-align: bottom;
+}
+.pictrue {
+  width: 60px;
+  height: 60px;
+  border: 1px dotted rgba(0, 0, 0, 0.1);
+  margin-right: 10px;
+  position: relative;
+  cursor: pointer;
+  img {
+    width: 100%;
+    height: 100%;
+  }
+}
+.details_pictrue {
+  width: 120px;
+  height: 120px;
+}
+.iview-video-style {
+  width: 40%;
+  height: 180px;
+  border-radius: 10px;
+  background-color: #707070;
+  margin-top: 10px;
+  position: relative;
+  overflow: hidden;
+}
+.iconv {
+  color: #fff;
+  line-height: 180px;
+  display: inherit;
+  font-size: 26px;
+  position: absolute;
+  top: -74px;
+  left: 50%;
+  margin-left: -25px;
+}
+.iview-video-style .mark {
+  position: absolute;
+  width: 100%;
+  height: 30px;
+  top: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  text-align: center;
+}
+.uploadVideo {
+  margin-left: 10px;
+}
+.perW50 {
+  width: 50%;
+}
+.submission {
+  margin-left: 10px;
+}
+.btndel {
+  position: absolute;
+  z-index: 1;
+  width: 20px !important;
+  height: 20px !important;
+  left: 46px;
+  top: -4px;
+}
+.labeltop {
+  /deep/ .el-form-item__label {
+    float: none !important;
+    display: inline-block !important;
+    margin-left: 120px !important;
+    width: auto !important;
+  }
+}
+</style>
diff --git a/src/views/product/productLibrary/index.vue b/src/views/product/productLibrary/index.vue
new file mode 100644
index 0000000..a13daa8
--- /dev/null
+++ b/src/views/product/productLibrary/index.vue
@@ -0,0 +1,829 @@
+<template>
+  <div class="divBox">
+    <el-card class="box-card">
+      <div slot="header" class="clearfix">
+        <div class="container">
+          <div class="demo-input-suffix acea-row">
+            <el-form inline size="small" label-width="120px">
+              <el-form-item label="商品分类：">
+                <el-cascader
+                  v-model="tableFrom.pid"
+                  class="selWidth"
+                  :options="merCateList"
+                  :props="{ checkStrictly: true, emitPath: false }"
+                  clearable
+                  @change="getList(1)"
+                />
+              </el-form-item>
+              <el-form-item label="推荐级别：">
+                <el-select
+                  v-model="tableFrom.star"
+                  placeholder="请选择"
+                  class="filter-item selWidth"
+                  clearable
+                  @change="getList(1)"
+                >
+                  <el-option
+                    v-for="item in recommendedLevelStatus"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  />
+                </el-select>
+              </el-form-item>
+              <el-form-item label="标签：">
+                <el-select
+                  v-model="tableFrom.sys_labels"
+                  placeholder="请选择"
+                  class="filter-item selWidth"
+                  clearable
+                  filterable
+                  @change="getList(1)"
+                >
+                  <el-option
+                    v-for="item in labelList"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.id"
+                  />
+                </el-select>
+              </el-form-item>
+              <el-form-item label="会员价设置：">
+                <el-select
+                  v-model="tableFrom.svip_price_type"
+                  placeholder="请选择"
+                  class="selWidth"
+                  clearable
+                  @change="getList(1)"
+                >
+                  <el-option label="未设置" value="0" />
+                  <el-option label="默认设置" value="1" />
+                  <el-option label="自定义设置" value="2" />
+                </el-select>
+              </el-form-item>
+              <el-form-item label="商品推荐：">
+                <el-select
+                  v-model="tableFrom.hot_type"
+                  placeholder="请选择"
+                  class="filter-item selWidth"
+                  clearable
+                  filterable
+                  @change="getList(1)"
+                >
+                  <el-option
+                    v-for="item in recommendList"
+                    :key="item.value"
+                    :label="item.name"
+                    :value="item.value"
+                  />
+                </el-select>
+              </el-form-item>
+              <el-form-item label="商品搜索：">
+                <el-input
+                  v-model="tableFrom.keyword"
+                  @keyup.enter.native="getList(1)"
+                  placeholder="请输入商品名称，关键字，产品编号"
+                  class="selWidth"
+                >
+                  <el-button
+                    slot="append"
+                    icon="el-icon-search"
+                    class="el-button-solt"
+                    @click="getList(1)"
+                  />
+                </el-input>
+              </el-form-item>
+            </el-form>
+          </div>
+        </div>
+        <router-link :to="{ path: `${roterPre}` + '/product/library/edit' }">
+          <el-button size="small" type="primary">添加商品</el-button>
+        </router-link>
+        <el-button
+          size="mini"
+          :disabled="multipleSelection.length == 0"
+          @click="batchShow(0)"
+          >批量不显示</el-button
+        >
+        <el-button
+          size="mini"
+          :disabled="multipleSelection.length == 0"
+          @click="batchShow(1)"
+          >批量显示</el-button
+        >
+      </div>
+      <el-table
+        v-loading="listLoading"
+        :data="tableData.data"
+        style="width: 100%"
+        size="mini"
+        @selection-change="handleSelectionChange"
+      >
+        <el-table-column
+          v-if="Number(tableFrom.type) < 7"
+          key="2"
+          type="selection"
+          width="55"
+        />
+        <el-table-column type="expand">
+          <template slot-scope="props">
+            <el-form label-position="left" inline class="demo-table-expand">
+              <el-form-item label="平台分类：">
+                <span>{{
+                  props.row.storeCategory
+                    ? props.row.storeCategory.cate_name
+                    : "-"
+                }}</span>
+              </el-form-item>
+              <el-form-item label="商户类别：">
+                <!-- <span>{{ props.row.storeCategory?props.row.storeCategory.cate_name:'-' }}</span> -->
+                <span v-if="props.row.merchant" class="spBlock">{{
+                  props.row.merchant.is_trader ? "自营" : "非自营"
+                }}</span>
+              </el-form-item>
+              <el-form-item label="商品分类：">
+                <template v-if="props.row.merCateId.length">
+                  <span
+                    v-for="(item, index) in props.row.merCateId"
+                    :key="index"
+                    class="mr10"
+                    >{{ item.category ? item.category.cate_name : "-" }}</span
+                  >
+                </template>
+                <span v-else>-</span>
+              </el-form-item>
+              <el-form-item label="品牌：">
+                <span>{{
+                  props.row.brand ? props.row.brand.brand_name : "-"
+                }}</span>
+              </el-form-item>
+              <el-form-item label="市场价格：">
+                <span>{{ props.row.ot_price | filterEmpty }}</span>
+              </el-form-item>
+              <el-form-item label="成本价：">
+                <span>{{ props.row.cost | filterEmpty }}</span>
+              </el-form-item>
+              <el-form-item label="收藏：">
+                <span>{{ props.row.care_count | filterEmpty }}</span>
+              </el-form-item>
+              <el-form-item label="已售数量：">
+                <span>{{ props.row.ficti | filterEmpty }}</span>
+              </el-form-item>
+              <el-form-item label="抵扣积分：">
+                <span>{{ props.row.integral_total }}</span>
+              </el-form-item>
+              <el-form-item label="积分抵扣金额：">
+                <span>{{ props.row.integral_price_total }}</span>
+              </el-form-item>
+            </el-form>
+          </template>
+        </el-table-column>
+        <el-table-column prop="id" label="ID" min-width="50" />
+        <el-table-column label="商品图" min-width="80">
+          <template slot-scope="scope">
+            <div class="demo-image__preview">
+              <el-image
+                style="width: 36px; height: 36px"
+                :src="scope.row.image"
+                :preview-src-list="[scope.row.image]"
+              />
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="store_name" label="商品名称" min-width="200" />
+        <el-table-column prop="bar_code" label="商品条码" min-width="180" />
+        <el-table-column prop="price" label="商品售价" min-width="90" />
+        <el-table-column prop="svip_price" label="会员价" min-width="90">
+          <template slot-scope="scope">
+            <span>{{ scope.row.svip_price || "-" }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="sales" label="销量" min-width="90" />
+        <el-table-column prop="stock" label="库存" min-width="90" />
+        <el-table-column prop="update_time" label="更新时间" min-width="150" />
+        <el-table-column prop="status" label="是否显示" min-width="100">
+          <template slot-scope="scope">
+            <el-switch
+              v-model="scope.row.is_used"
+              :active-value="1"
+              :inactive-value="0"
+              active-text="显示"
+              inactive-text="隐藏"
+              @change="onchangeIsShow(scope.row)"
+            />
+          </template>
+        </el-table-column>
+        <el-table-column prop="create_time" label="创建时间" min-width="150" />
+        <el-table-column
+          v-if="Number(tableFrom.type) < 7"
+          key="8"
+          label="操作"
+          min-width="160"
+          fixed="right"
+          align="center"
+        >
+          <template slot-scope="scope">
+            <!-- <el-button
+              v-if="Number(tableFrom.type) < 7"
+              type="text"
+              size="small"
+              @click="onEdit(scope.row.id)"
+              >编辑</el-button
+            > -->
+            <router-link
+              :to="{
+                path: `${roterPre}/product/library/edit?id=${scope.row.id}`,
+              }"
+            >
+              <el-button type="text" size="small">编辑</el-button>
+            </router-link>
+            <el-button
+              type="text"
+              size="small"
+              @click="handlePreview(scope.row.id)"
+              >预览</el-button
+            >
+            <el-button
+              type="text"
+              size="small"
+              @click="productDel(scope.row.id)"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="block">
+        <el-pagination
+          :page-sizes="[20, 40, 60, 80]"
+          :page-size="tableFrom.limit"
+          :current-page="tableFrom.page"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="tableData.total"
+          @size-change="handleSizeChange"
+          @current-change="pageChange"
+        />
+      </div>
+    </el-card>
+    <info-from
+      ref="infoFrom"
+      :is-show="isShow"
+      :ids="OffId"
+      @subSuccess="subSuccess"
+    />
+    <el-dialog
+      title="商品编辑"
+      :visible.sync="dialogVisible"
+      width="1000px"
+      :before-close="handleClose"
+      :append-to-body="append"
+    >
+      <el-form
+        ref="formValidate"
+        v-loading="fullscreenLoading"
+        class="formValidate mt20"
+        :rules="ruleValidate"
+        :model="formValidate"
+        label-width="100px"
+        @submit.native.prevent
+      >
+        <el-form-item label="商品名称：" prop="store_name">
+          <el-input
+            v-model="formValidate.store_name"
+            placeholder="请输入商品名称"
+          />
+        </el-form-item>
+        <el-form-item label="星级推荐：">
+          <el-rate
+            class="rate_star"
+            v-model="formValidate.star"
+            :colors="colors"
+            style="margin-top: 4px"
+          ></el-rate>
+          <span style="margin-top: 4px; font-size: 12px"
+            >备注：5星为最高推荐级别，1星为最低推荐级别，设置后会在商城商品列表、搜索商品列表中体现。</span
+          >
+        </el-form-item>
+        <el-form-item label="排序：">
+          <el-input-number
+            v-model="formValidate.rank"
+            placeholder="请输入排序序号"
+            style="width: 200px"
+          />
+        </el-form-item>
+        <el-col :span="24">
+          <el-form-item label="商品详情：">
+            <ueditor-from
+              v-model="formValidate.content"
+              :content="formValidate.content"
+            />
+          </el-form-item>
+        </el-col>
+        <el-form-item style="margin-top: 30px">
+          <el-button
+            type="primary"
+            class="submission"
+            size="small"
+            @click="handleSubmit('formValidate')"
+            >提交</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+    <!--预览商品-->
+    <div v-if="previewVisible">
+      <div class="bg" @click.stop="previewVisible = false" />
+      <preview-box
+        v-if="previewVisible"
+        ref="previewBox"
+        :goods-id="goodsId"
+        :product-type="0"
+        :preview-key="previewKey"
+      />
+    </div>
+    <!--编辑标签-->
+    <el-dialog
+      v-if="dialogLabel"
+      title="选择标签"
+      :visible.sync="dialogLabel"
+      width="800px"
+      :before-close="handleClose"
+    >
+      <el-form ref="labelForm" :model="labelForm" @submit.native.prevent>
+        <el-form-item>
+          <el-select
+            v-model="labelForm.sys_labels"
+            clearable
+            filterable
+            multiple
+            placeholder="请选择"
+            class="selWidth"
+          >
+            <el-option
+              v-for="item in labelList"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            />
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm('labelForm')"
+          >提交</el-button
+        >
+      </span>
+    </el-dialog>
+    <!--编辑推荐-->
+    <el-dialog
+      v-if="dialogRecommend"
+      title="推荐设置"
+      :visible.sync="dialogRecommend"
+      width="800px"
+      :before-close="handleClose"
+    >
+      <el-form @submit.native.prevent>
+        <el-form-item label="商品推荐：">
+          <el-checkbox-group
+            v-model="recommendGroup"
+            @change="onChangeRecommend"
+            size="small"
+          >
+            <el-checkbox
+              v-for="(item, index) in recommend"
+              :key="index"
+              :label="item.value"
+              >{{ item.name }}</el-checkbox
+            >
+          </el-checkbox-group>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitRecommendForm">提交</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+// +----------------------------------------------------------------------
+// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
+// +----------------------------------------------------------------------
+// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
+// +----------------------------------------------------------------------
+// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
+// +----------------------------------------------------------------------
+// | Author: CRMEB Team <admin@crmeb.com>
+// +----------------------------------------------------------------------
+import {
+  changeApi,
+  productLstApi,
+  productDetailApi,
+  categoryListApi,
+  productUpdateApi,
+  lstFilterApi,
+  merSelectApi,
+  productOffApi,
+  toVirtualSalesApi,
+  getProductLabelApi,
+  updatetProductLabel,
+  batchesLabelsApi,
+  batchesRecommendApi,
+  batchesOnOffApi
+} from '@/api/product'
+import {
+  libraryProductList,
+  libraryProductDel
+} from '@/api/library'
+import { roterPre } from '@/settings'
+import infoFrom from './info'
+import ueditorFrom from '@/components/ueditorFrom'
+import previewBox from '@/components/previewBox/index'
+const proOptions = [{
+  name: '热门榜单',
+  value: 'is_hot'
+}, {
+  name: '促销单品',
+  value: 'is_benefit'
+}, {
+  name: '精品推荐',
+  value: 'is_best'
+}, {
+  name: '首发新品',
+  value: 'is_new'
+}]
+export default {
+  name: 'ProductExamine1',
+  components: {
+    infoFrom,
+    ueditorFrom,
+    previewBox
+  },
+  data () {
+    return {
+      props: {
+        emitPath: false
+      },
+      ruleValidate: {
+        store_name: [{
+          required: true,
+          message: "请输入商品名称",
+          trigger: "blur"
+        },]
+      },
+      dialogVisible: false,
+      dialogRecommend: false,
+      append: true,
+      checkboxGroup: [],
+      recommendGroup: [],
+      colors: ['#99A9BF', '#F7BA2A', '#FF9900'],
+      recommendedLevelStatus: [
+        { label: "全部", value: "" },
+        { label: "5星", value: 5 },
+        { label: "4星", value: 4 },
+        { label: "3星", value: 3 },
+        { label: "2星", value: 2 },
+        { label: "1星", value: 1 }
+      ],
+      recommend: proOptions,
+      recommendList: [{
+        name: '热门榜单',
+        value: 'hot'
+      }, {
+        name: '促销单品',
+        value: 'good'
+      }, {
+        name: '精品推荐',
+        value: 'best'
+      }, {
+        name: '首发新品',
+        value: 'new'
+      }],
+      formValidate: {
+        is_hot: 0,
+        is_best: 0,
+        is_new: 0,
+        is_benefit: 0,
+        ficti: 0,
+        content: '',
+        store_name: '',
+        rank: '',
+        us_status: '',
+        star: ''
+      },
+      productStatusList: [
+        { label: "上架显示", value: 1 },
+        { label: "下架", value: 0 },
+        { label: "平台关闭", value: -1 },
+      ],
+      fullscreenLoading: false,
+      isShow: false,
+      roterPre: roterPre,
+      listLoading: true,
+      tableData: {
+        data: [],
+        total: 0
+      },
+      tableFrom: {
+        page: 1,
+        limit: 20,
+        cate_id: '',
+        sys_labels: '',
+        pid: '',
+        store_name: '',
+        type: '6',
+        mer_id: '',
+        keyword: '',
+        is_trader: '',
+        hot_type: '',
+        star: '',
+        svip_price_type: '',
+        product_id: this.$route.query.id ? this.$route.query.id : ""
+      },
+      categoryList: [],
+      merCateList: [],
+      multipleSelection: [],
+      headeNum: [],
+      merSelect: [],
+      OffId: [],
+      productId: 0,
+      tabClickIndex: '',
+      previewVisible: false,
+      goodsId: '',
+      previewKey: '',
+      product_id: '',
+      labelList: [],
+      dialogLabel: false,
+      isBatch: false,
+      labelForm: {},
+      recommendForm: {}
+    }
+  },
+  mounted () {
+    this.getList('')
+  },
+  methods: {
+    subSuccess () {
+      this.getList('')
+      this.getLstFilterApi()
+    },
+    onchangeIsShow (row) {
+      changeApi(row.product_id, row.is_used).then(({
+        message
+      }) => {
+        this.$message.success(message)
+        this.getList('')
+        this.getLstFilterApi()
+      }).catch(({
+        message
+      }) => {
+        this.$message.error(message)
+      })
+    },
+    // 预览
+    handlePreview (id) {
+      this.previewVisible = true
+      this.goodsId = id
+      this.previewKey = ''
+    },
+    // 获取标签项
+    getLabelLst () {
+      getProductLabelApi().then(res => {
+        this.labelList = res.data
+      })
+        .catch(res => {
+          this.$message.error(res.message)
+        })
+    },
+    // 编辑标签
+    onEditLabel (row) {
+      this.dialogLabel = true
+      this.product_id = row.product_id
+      if (row.sys_labels && row.sys_labels.length) {
+        const arrNew = row.sys_labels.map(item => {
+          return item.product_label_id
+        })
+        this.labelForm = {
+          sys_labels: arrNew
+        }
+      } else {
+        this.labelForm = {
+          sys_labels: []
+        }
+      }
+    },
+    submitForm (name) {
+      this.$refs[name].validate(valid => {
+        if (valid) {
+          this.isBatch ? batchesLabelsApi(this.labelForm).then(({ message }) => {
+            this.$message.success(message)
+            this.getList('')
+            this.dialogLabel = false
+            this.isBatch = false
+          }).catch(res => {
+            this.$message.error(res.message)
+          }) :
+            updatetProductLabel(this.product_id, this.labelForm).then(({ message }) => {
+              this.$message.success(message)
+              this.getList('')
+              this.dialogLabel = false
+            }).catch(res => {
+              this.$message.error(res.message)
+            })
+        } else {
+          return
+        }
+      })
+    },
+    batchRecommend () {
+      this.dialogRecommend = true
+      this.recommendGroup = []
+    },
+    submitRecommendForm () {
+      this.recommendForm.ids = this.OffId
+      batchesRecommendApi(this.recommendForm).then(({ message }) => {
+        this.$message.success(message)
+        this.getList('')
+        this.dialogRecommend = false
+      }).catch(res => {
+        this.$message.error(res.message)
+      })
+    },
+    getInfo (id) {
+      this.fullscreenLoading = true
+      this.checkboxGroup = [];
+      productDetailApi(id).then(res => {
+        const info = res.data
+        this.formValidate = {
+          is_hot: info.is_hot,
+          is_best: info.is_best,
+          is_new: info.is_new,
+          is_benefit: info.is_benefit,
+          ficti: info.ficti,
+          content: info.content,
+          store_name: info.store_name,
+          rank: info.rank,
+          star: info.star
+        }
+        if (info.is_benefit === 1) this.checkboxGroup.push('is_benefit')
+        if (info.is_hot === 1) this.checkboxGroup.push('is_hot')
+        if (info.is_best === 1) this.checkboxGroup.push('is_best')
+        if (info.is_new === 1) this.checkboxGroup.push('is_new')
+        this.fullscreenLoading = false
+        console.log(this.formValidate)
+      }).catch(res => {
+        this.$message.error(res.message)
+        this.fullscreenLoading = false
+      })
+    },
+    onEdit (id) {
+      this.productId = id
+      this.getInfo(id)
+      this.dialogVisible = true
+    },
+    // 提交
+    handleSubmit (name) {
+      console.log(this.formValidate)
+      this.$refs[name].validate((valid) => {
+        if (valid) {
+          productUpdateApi(this.productId, this.formValidate).then(async res => {
+            this.fullscreenLoading = false
+            this.$message.success(res.message)
+            this.dialogVisible = false
+            this.getList('')
+          }).catch(res => {
+            this.fullscreenLoading = false
+            this.$message.error(res.message)
+          })
+        } else {
+          return false
+        }
+      })
+    },
+    handleClose () {
+      this.dialogVisible = false
+      this.dialogLabel = false
+      this.dialogRecommend = false
+    },
+    // 批量显示不显示
+    batchShow (status) {
+      if (this.multipleSelection.length === 0) return this.$message.warning('请先选择商品')
+      let data = { status: status, ids: this.OffId }
+      batchesOnOffApi(data).then(res => {
+        this.$message.success(res.message)
+        this.getList('')
+      })
+        .catch(res => {
+          this.$message.error(res.message)
+        })
+    },
+    // 列表表头；
+    getLstFilterApi () {
+      lstFilterApi().then(res => {
+        this.headeNum = res.data
+      }).catch(res => {
+        this.$message.error(res.message)
+      })
+    },
+    batch () {
+      if (this.multipleSelection.length === 0) return this.$message.warning('请先选择商品')
+      this.$refs.infoFrom.dialogVisible = true
+      this.isShow = false
+    },
+    handleSelectionChange (val) {
+      this.multipleSelection = val
+      const data = []
+      this.multipleSelection.map((item) => {
+        data.push(item.product_id)
+      })
+      this.OffId = data
+    },
+    toExamine (id) {
+      this.$refs.infoFrom.dialogVisible = true
+      this.isShow = true
+      this.$refs.infoFrom.getInfo(id)
+    },
+    // 列表
+    getList (num) {
+      this.listLoading = true
+      this.tableFrom.page = num ? num : this.tableFrom.page;
+      libraryProductList(this.tableFrom).then(res => {
+        this.tableData.data = res.data.list
+        this.tableData.total = res.data.count
+        this.listLoading = false
+      }).catch(res => {
+        this.listLoading = false
+        this.$message.error(res.message)
+      })
+    },
+    pageChange (page) {
+      this.tableFrom.page = page
+      this.getList('')
+    },
+    handleSizeChange (val) {
+      this.tableFrom.limit = val
+      this.getList('')
+    },
+    // 删除
+    productDel (e) {
+      libraryProductDel({
+        id: e
+      }).then((res) => {
+        this.$message.success(res.message)
+        if (res.status == 200) {
+          this.getList();
+        }
+      });
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+/deep/.el-select-dropdown__item {
+  max-width: 350px !important;
+}
+.template {
+  overflow: hidden;
+}
+.label-list {
+  height: 100%;
+}
+.bg {
+  z-index: 100;
+  position: fixed;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.5);
+}
+.rate_star {
+  position: relative;
+  top: 5px;
+}
+table .el-image {
+  display: inline-block;
+}
+.demo-table-expand {
+  font-size: 0;
+}
+.demo-table-expand {
+  /deep/ label {
+    width: 105px;
+    color: #99a9bf;
+  }
+}
+.demo-table-expand .el-form-item {
+  margin-right: 0;
+  margin-bottom: 0;
+  width: 33.33%;
+}
+
+.selWidth {
+  width: 350px !important;
+}
+
+.seachTiele {
+  line-height: 35px;
+}
+</style>
diff --git a/src/views/product/productLibrary/info.vue b/src/views/product/productLibrary/info.vue
new file mode 100644
index 0000000..df26c74
--- /dev/null
+++ b/src/views/product/productLibrary/info.vue
@@ -0,0 +1,557 @@
+<template>
+  <el-dialog
+    v-if="dialogVisible"
+    title="商品审核"
+    :visible.sync="dialogVisible"
+    :append-to-body="isAppend"
+    width="900px"
+    :before-close="handleClose"
+    class="projectInfo"
+  >
+    <el-tabs
+      v-if="projectData && isShow"
+      v-model="activeNames"
+      v-loading="loading"
+    >
+      <el-tab-pane label="商品信息" name="first">
+        <div class="acea-row">
+          <span class="sp">商品名称：{{ projectData.store_name }}</span>
+          <span class="sp"
+            >平台分类：{{
+              projectData.storeCategory
+                ? projectData.storeCategory.cate_name
+                : ""
+            }}</span
+          >
+          <span class="sp"
+            >品牌：{{
+              projectData.brand ? projectData.brand.brand_name : ""
+            }}</span
+          >
+          <span class="sp">商品关键字：{{ projectData.keyword }}</span>
+          <span class="sp">商品单位：{{ projectData.unit_name }}</span>
+          <span class="sp" v-if="projectData.temp && projectData.temp.name"
+            >运费模板：{{ projectData.temp ? projectData.temp.name : "" }}</span
+          >
+          <span class="sp100" v-if="projectData.temp && projectData.temp.info"
+            >运费说明：{{ projectData.temp ? projectData.temp.info : "" }}</span
+          >
+          <span class="sp100">
+            商品分类：
+            <template v-if="projectData.merCateId">
+              <span
+                v-for="(item, index) in projectData.merCateId"
+                :key="index"
+                class="mr10"
+                >{{ item.category ? item.category.cate_name : "" }}</span
+              >
+            </template>
+            <span v-else>-</span>
+          </span>
+          <span class="sp100">商品简介：{{ projectData.store_info }}</span>
+          <span class="sp100">
+            商品封面图：
+            <div class="demo-image__preview">
+              <el-image
+                style="width: 60px; height: 60px"
+                :src="projectData.image"
+                :preview-src-list="[projectData.image]"
+              />
+            </div>
+          </span>
+          <span v-if="projectData.video_link" class="sp100">
+            主图视频：
+            <video
+              style="width: 40%; height: 180px; border-radius: 10px"
+              :src="projectData.video_link"
+              controls="controls"
+            >
+              您的浏览器不支持 video 标签。
+            </video>
+          </span>
+          <span class="sp100"
+            >商品轮播图：
+            <div
+              v-for="(item, index) in projectData.slider_image"
+              :key="index"
+              class="pictrue"
+            >
+              <el-image
+                style="width: 60px; height: 60px"
+                :src="item"
+                :preview-src-list="[item]"
+              />
+            </div>
+          </span>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="商品详情" name="second">
+        <!-- <span class="sp100">商品详情：</span>
+        <div class="contentPic" v-html="projectData.content"/> -->
+        <el-form>
+          <el-form-item label="商品详情：">
+            <el-input
+              v-model="projectData.content.title"
+              placeholder="请输入商品详情"
+              class="selWidth"
+              type="textarea"
+            />
+          </el-form-item>
+          <el-form-item label="商品图片：">
+            <!-- <vue-ueditor-wrap
+                v-model="formValidate.content"
+                :config="myConfig"
+                @beforeInit="addCustomDialog"
+              /> -->
+            <div class="upLoadPicBox" title="750*750px">
+              <div
+                v-for="(item, index) in projectData.content.image"
+                class="pictrue details_pictrue"
+                :key="index + item"
+              >
+                <el-image
+                  class="img"
+                  :preview-src-list="projectData.content.image"
+                  :src="item"
+                  :key="index"
+                  :initial-index="index"
+                />
+              </div>
+            </div>
+          </el-form-item>
+        </el-form>
+      </el-tab-pane>
+      <el-tab-pane label="其他设置" name="third">
+        <span class="sp100">商品排序：{{ projectData.sort }}</span>
+        <span class="third mb20">
+          <span>商品推荐：</span>
+          <el-checkbox-group v-model="checkboxGroup" size="small">
+            <el-checkbox
+              v-for="(item, index) in recommend"
+              :key="index"
+              disabled
+              :label="item.value"
+              >{{ item.name }}</el-checkbox
+            >
+          </el-checkbox-group>
+        </span>
+        <span
+          v-if="
+            projectData.guarantee && projectData.guarantee.templateValue.length
+          "
+          class="third mb20"
+        >
+          <span>服务保障：</span>
+          <span
+            v-for="(item, index) in projectData.guarantee.templateValue"
+            :key="index"
+          >
+            <span v-if="item.value"
+              >{{ index + 1 }}. {{ item.value.guarantee_name }}；</span
+            >
+          </span>
+        </span>
+      </el-tab-pane>
+      <el-tab-pane label="商品规格" name="fourth">
+        <span class="sp"
+          >商品规格：{{
+            projectData.spec_type === 0 ? "单规格" : "多规格"
+          }}</span
+        >
+        <span class="sp"
+          >佣金设置：{{
+            projectData.extension_type === 0 ? "默认设置" : "单独设置"
+          }}</span
+        >
+        <span class="sp100">
+          <span class="mb15" style="display: block">商品规格:</span>
+          <template v-if="projectData.spec_type === 0">
+            <el-table
+              :data="OneattrValue"
+              border
+              class="tabNumWidth"
+              size="mini"
+            >
+              <el-table-column align="center" label="图片" min-width="80">
+                <template slot-scope="scope">
+                  <div class="demo-image__preview">
+                    <el-image
+                      style="width: 60px; height: 60px"
+                      :src="scope.row.image"
+                    />
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column
+                v-for="(item, iii) in attrValue"
+                :key="iii"
+                :label="formThead[iii].title"
+                align="center"
+                min-width="120"
+              >
+                <template slot-scope="scope">
+                  <span class="priceBox" v-text="scope.row[iii]" />
+                </template>
+              </el-table-column>
+              <template v-if="projectData.extension_type === 1">
+                <el-table-column
+                  align="center"
+                  label="一级返佣(元)"
+                  min-width="120"
+                >
+                  <template slot-scope="scope">
+                    <span class="priceBox" v-text="scope.row.extension_one" />
+                  </template>
+                </el-table-column>
+                <el-table-column
+                  align="center"
+                  label="二级返佣(元)"
+                  min-width="120"
+                >
+                  <template slot-scope="scope">
+                    <span class="priceBox" v-text="scope.row.extension_two" />
+                  </template>
+                </el-table-column>
+              </template>
+            </el-table>
+          </template>
+          <template v-if="projectData.spec_type === 1">
+            <el-table
+              :data="ManyAttrValue"
+              border
+              class="tabNumWidth"
+              size="mini"
+            >
+              <template v-if="manyTabDate">
+                <el-table-column
+                  v-for="(item, iii) in manyTabDate"
+                  :key="iii"
+                  align="center"
+                  :label="manyTabTit[iii].title"
+                  min-width="80"
+                >
+                  <template slot-scope="scope">
+                    <span class="priceBox" v-text="scope.row[iii]" />
+                  </template>
+                </el-table-column>
+              </template>
+              <el-table-column align="center" label="图片" min-width="80">
+                <template slot-scope="scope">
+                  <div class="upLoadPicBox">
+                    <div class="pictrue tabPic">
+                      <img :src="scope.row.image" />
+                    </div>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column
+                v-for="(item, iii) in attrValue"
+                :key="iii"
+                :label="formThead[iii].title"
+                align="center"
+                min-width="120"
+              >
+                <template slot-scope="scope">
+                  <span class="priceBox">{{ scope.row[iii] }}</span>
+                </template>
+              </el-table-column>
+              <template v-if="projectData.extension_type === 1">
+                <el-table-column
+                  align="center"
+                  label="一级返佣(元)"
+                  min-width="120"
+                >
+                  <template slot-scope="scope">
+                    <span class="priceBox">{{ scope.row.extension_one }}</span>
+                  </template>
+                </el-table-column>
+                <el-table-column
+                  align="center"
+                  label="二级返佣(元)"
+                  min-width="120"
+                >
+                  <template slot-scope="scope">
+                    <span class="priceBox">{{ scope.row.extension_two }}</span>
+                  </template>
+                </el-table-column>
+              </template>
+            </el-table>
+          </template>
+        </span>
+      </el-tab-pane>
+    </el-tabs>
+    <el-form
+      ref="ruleForm"
+      :model="ruleForm"
+      :rules="rules"
+      label-width="80px"
+      class="demo-ruleForm"
+    >
+      <el-form-item label="审核状态" prop="status">
+        <el-radio-group v-model="ruleForm.status">
+          <el-radio :label="1">通过</el-radio>
+          <el-radio :label="-1">拒绝</el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item v-if="ruleForm.status === -1" label="原因" prop="refusal">
+        <el-input
+          v-model="ruleForm.refusal"
+          type="textarea"
+          placeholder="请输入原因"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" @click="onSubmit">提交</el-button>
+      </el-form-item>
+    </el-form>
+  </el-dialog>
+</template>
+
+<script>
+// +----------------------------------------------------------------------
+// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
+// +----------------------------------------------------------------------
+// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
+// +----------------------------------------------------------------------
+// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
+// +----------------------------------------------------------------------
+// | Author: CRMEB Team <admin@crmeb.com>
+// +----------------------------------------------------------------------
+import { productDetailApi, productStatusApi } from '@/api/product'
+const defaultObj = {
+  image: '',
+  slider_image: [],
+  store_name: '',
+  store_info: '',
+  keyword: '',
+  brand_id: '', // 品牌id
+  cate_id: '', // 平台分类id
+  mer_cate_id: [], // 商户分类id
+  unit_name: '',
+  sort: 0,
+  is_show: 0,
+  is_benefit: 0,
+  is_new: 0,
+  is_good: 0,
+  temp_id: '',
+  attrValue: [{
+    image: '',
+    price: null,
+    svip_price: null,
+    cost: null,
+    ot_price: null,
+    stock: null,
+    bar_code: '',
+    weight: null,
+    volume: null
+  }],
+  attr: [],
+  selectRule: '',
+  extension_type: 0,
+  content: '',
+  spec_type: 0
+}
+const objTitle = {
+  price: {
+    title: '售价'
+  },
+  svip_price: {
+    title: '付费会员价'
+  },
+  cost: {
+    title: '成本价'
+  },
+  ot_price: {
+    title: '市场价'
+  },
+  stock: {
+    title: '库存'
+  },
+  bar_code: {
+    title: '商品编号'
+  },
+  weight: {
+    title: '重量（KG）'
+  },
+  volume: {
+    title: '体积(m³)'
+  }
+}
+const proOptions = [{ name: '是否热卖', value: 'is_hot' }, { name: '优品推荐', value: 'is_good' }, { name: '促销单品', value: 'is_benefit' }, { name: '是否精品', value: 'is_best' }, { name: '是否新品', value: 'is_new' }]
+export default {
+  name: 'Info',
+  props: {
+    isShow: {
+      type: Boolean,
+      default: true
+    },
+    ids: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data () {
+    return {
+      rules: {
+        status: [
+          { required: true, message: '请选择审核状态', trigger: 'change' }
+        ],
+        refusal: [
+          { required: true, message: '请填写拒绝原因', trigger: 'blur' }
+        ]
+      },
+      isAppend: true,
+      proId: 0,
+      ruleForm: {
+        refusal: '',
+        status: 1,
+        id: ''
+      },
+      formThead: Object.assign({}, objTitle),
+      manyTabDate: {},
+      manyTabTit: {},
+      loading: false,
+      dialogVisible: false,
+      activeNames: 'first',
+      projectData: {},
+      recommend: proOptions,
+      checkboxGroup: [],
+      svip_type: 0,
+      OneattrValue: [Object.assign({}, defaultObj.attrValue[0])], // 单规格
+      ManyAttrValue: [Object.assign({}, defaultObj.attrValue[0])] // 多规格
+    }
+  },
+  computed: {
+    attrValue () {
+      const obj = Object.assign({}, defaultObj.attrValue[0])
+      if (this.svip_type == 0) delete obj.svip_price
+      delete obj.image
+      return obj
+    },
+    oneFormBatch () {
+      const obj = [Object.assign({}, defaultObj.attrValue[0])]
+      delete obj[0].bar_code
+      return obj
+    }
+  },
+  methods: {
+    onSubmit () {
+      this.isShow ? this.ruleForm.id = this.proId : this.ruleForm.id = this.ids
+      productStatusApi(this.ruleForm).then(res => {
+        this.$message.success(res.message)
+        this.dialogVisible = false
+        this.activeNames = 'first'
+        this.$emit('subSuccess')
+      }).catch(res => {
+        this.listLoading = false
+        this.$message.error(res.message)
+      })
+    },
+    handleClose () {
+      this.dialogVisible = false
+      this.activeNames = 'first'
+    },
+    getInfo (id) {
+      this.proId = id
+      this.loading = true
+      productDetailApi(id).then(res => {
+        if (res.data.content_arr && res.data.content_arr.length > 0) res.data.content = res.data.content_arr;
+        this.projectData = res.data
+        this.svip_type = res.data.svip_price_type
+
+        if (this.projectData.spec_type === 0) {
+          this.OneattrValue = res.data.attrValue
+        } else {
+          this.ManyAttrValue = res.data.attrValue
+        }
+        const tmp = {}
+        const tmpTab = {}
+        this.projectData.attr.forEach((o, i) => {
+          tmp['value' + i] = { title: o.value }
+          tmpTab['value' + i] = ''
+        })
+        this.manyTabDate = tmpTab
+        this.manyTabTit = tmp
+        this.checkboxGroup = []
+        this.formThead = Object.assign({}, this.formThead, tmp)
+        if (this.projectData.is_hot === 1) this.checkboxGroup.push('is_hot')
+        if (this.projectData.is_good === 1) this.checkboxGroup.push('is_good')
+        if (this.projectData.is_benefit === 1) this.checkboxGroup.push('is_benefit')
+        if (this.projectData.is_best === 1) this.checkboxGroup.push('is_best')
+        if (this.projectData.is_new === 1) this.checkboxGroup.push('is_new')
+        this.loading = false
+      }).catch(res => {
+        this.$message.error(res.message)
+        this.loading = false
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.projectInfo {
+  /deep/.el-dialog__body {
+    padding-top: 0 !important;
+  }
+  /deep/.el-tabs__content {
+    padding-left: 10px !important;
+  }
+}
+.tabPic {
+  width: 40px !important;
+  height: 40px !important;
+  img {
+    width: 100%;
+    height: 100%;
+  }
+}
+.sp {
+  display: block;
+  width: 33%;
+  font-size: 12px;
+  margin-bottom: 20px;
+}
+
+.sp100 {
+  width: 100%;
+  margin-bottom: 15px;
+  display: inline-block;
+}
+.third {
+  width: 100%;
+  display: flex;
+}
+.pictrue {
+  width: 60px;
+  height: 60px;
+  border: 1px dotted rgba(0, 0, 0, 0.1);
+  margin-right: 10px;
+  position: relative;
+  cursor: pointer;
+  display: inline-block;
+  img {
+    width: 100%;
+    height: 100%;
+  }
+}
+.demo-image__preview {
+  display: inline-block;
+}
+.pictrue {
+  width: 60px;
+  height: 60px;
+  border: 1px dotted rgba(0, 0, 0, 0.1);
+  margin-right: 10px;
+  position: relative;
+  cursor: pointer;
+  .img {
+    width: 100%;
+    height: 100%;
+  }
+}
+.details_pictrue {
+  width: 400px;
+  height: 400px;
+}
+</style>