换电脑前提交

src/views/modules/order/order.vue

@@ -373,7 +373,7 @@
       v-if="dataList.length"
       @size-change="sizeChangeHandle"
       @current-change="currentChangeHandle"
-      :current-page="page.pageIndex"
+      :current-page="page.currentPage"
       :page-sizes="[10, 20, 50, 100]"
       :page-size="page.pageSize"
       :total="page.total"
@@ -592,7 +592,8 @@ export default {
       devyVisible: false,
       addOrUpdateVisible: false,
       consignmentInfoVisible: false,
-      orderAmountUpdateVisible: false
+      orderAmountUpdateVisible: false,
+      timer:null
     }
   },
   components: {
@@ -608,6 +609,10 @@ export default {
 
     // 请求物流公司
     this.getLogisticsList()
+    this.timer = setInterval(() => {
+      this.searchChange()
+    },60000)
+
   },
   activated () {
     // 携带参数查询
@@ -1023,6 +1028,9 @@ export default {
       })
     }
   },
+  beforeDestroy(){
+    clearInterval(this.timer)
+  },
   destroyed () {
     // 页面销毁时移除监听
     window.removeEventListener('scroll', this.handleScroll)

src/views/modules/order/orderInfo.vue

@@ -165,6 +165,7 @@
                   </el-form-item>-->
                   <el-form-item label="配送费用:" v-if="dataForm.freightAmount">
                     <span class="text">￥{{dataForm.freightAmount}}</span>
+                    
                   </el-form-item>
                   <el-form-item label="应付金额:">
                     <span class="text">￥{{dataForm.actualTotal}}</span>

src/views/modules/prod/category-add-or-update.vue

@@ -1,9 +1,10 @@
 <template>
   <el-dialog
-    :title="!dataForm.categoryId ? '新增' : '修改'"
+    :title="!dataForm.categoryId ? '新增'+name : '修改'+name"
     :close-on-click-modal="false"
     :visible.sync="visible"
   >
+    <p v-if="parentName">{{typeName}}</p>
     <el-form
       :model="dataForm"
       :rules="dataRule"
@@ -20,7 +21,7 @@
         <el-input
           v-model="dataForm.categoryName"
           controls-position="right"
-          maxlength="7"
+          maxlength="8"
           show-word-limit
           label="分类名称"
         ></el-input>
@@ -28,9 +29,10 @@
 
       <el-form-item
         label="分类图标"
-        prop="categoryName"
+        prop="icon"
+        v-if="dataForm.grade==0"
       >
-        <img-upload v-model="dataForm.advertImg" />
+        <img-upload v-model="dataForm.icon" />
       </el-form-item>
 
       <el-form-item v-if="dataForm.type !== 2" label="排序号" prop="seq">
@@ -56,6 +58,7 @@ import ImgUpload from '@/components/img-upload'
 export default {
   data () {
     return {
+      name:'',
       visible: false,
       dataForm: {
         categoryId: 0,
@@ -64,14 +67,14 @@ export default {
         seq: 1,
         status: 1,
         parentId: 0,
-        pic: ''
+        icon: ''
       },
       dataRule: {
         categoryName: [
           { required: true, message: '分类名称不能为空', trigger: 'blur' }
         ],
-        pic: [
-          { required: true, message: '分类图片不能为空', trigger: 'blur' }
+        icon: [
+          { required: true, message: '分类图片不能为空', trigger: 'change' }
         ]
       },
       categoryList: [],
@@ -79,31 +82,55 @@ export default {
       categoryTreeProps: {
         value: 'categoryId',
         label: 'categoryName'
-      }
+      },
+      typeName:'',
+      parentName:'' ,
+      nameList:['一级分类','二级分类','三级分类']
     }
   },
   components: {
     ImgUpload
   },
   methods: {
-    init (id) {
-      this.dataForm.categoryId = id || 0
-      this.$http({
-        url: this.$http.adornUrl('/prod/category/listCategory'),
-        method: 'get',
-        params: this.$http.adornParams()
-      }).then(({ data }) => {
-        this.categoryList = treeDataTranslate(data, 'categoryId', 'parentId')
-      }).then(() => {
-        this.visible = true
-        this.$nextTick(() => {
-          this.$refs['dataForm'].resetFields()
-          this.selectedCategory = []
-        })
-      }).then(() => {
-        if (this.dataForm.categoryId) {
+    resetData(){
+      this.typeName = ''
+      this.parentName = ''
+      this.dataForm = {
+        categoryId: 0,
+        grade: 0,
+        categoryName: '',
+        seq: 1,
+        status: 1,
+        parentId: 0,
+        icon: ''
+      } 
+    },
+    async init (data,type,list) {
+      this.visible = true
+      this.resetData()
+      if(data){
+        if(type == 'add'){
+          this.dataForm.categoryId = 0
+          this.dataForm.parentId = data.categoryID
+          this.dataForm.grade = data.grade + 1
+          this.parentName = data.categoryName
+          console.log('二级三级新增');
+        }else{
+          this.dataForm.categoryId = data.categoryID
+          console.log('yi二级三级修改');
+          this.parentName =this.getParentName(list,data.categoryID)
+          console.log(this.parentName);
+        }
+
+
+      }else{//新增一级分类
+        this.dataForm.categoryId = 0
+        console.log('1级新增');
+      }
+
+       if (this.dataForm.categoryId) {
           // 修改
-          this.$http({
+         await this.$http({
             url: this.$http.adornUrl(`/prod/category/info/${this.dataForm.categoryId}`),
             method: 'get',
             params: this.$http.adornParams()
@@ -111,28 +138,98 @@ export default {
             this.dataForm.categoryId = data.categoryId
             this.dataForm.categoryName = data.categoryName
             this.dataForm.seq = data.seq
-            this.dataForm.pic = data.pic
+            this.dataForm.icon = data.icon
+            this.dataForm.grade = data.grade
             this.dataForm.parentId = data.parentId
             this.dataForm.status = data.status
-            this.selectedCategory = idList(this.categoryList, data.parentId, 'categoryId', 'children').reverse()
           })
         }
-      })
+        this.name = this.nameList[this.dataForm.grade]
+        if(this.dataForm.grade == 1 || this.dataForm.grade == 2){
+          this.typeName = `所属${this.nameList[this.dataForm.grade-1]}:${this.parentName}`
+        }
+
+
+      // this.dataForm.categoryId = id || 0
+      // this.$http({
+      //   url: this.$http.adornUrl('/prod/category/listCategory'),
+      //   method: 'get',
+      //   params: this.$http.adornParams()
+      // }).then(({ data }) => {
+      //   this.categoryList = treeDataTranslate(data, 'categoryId', 'parentId')
+      // }).then(() => {
+      //   this.visible = true
+      //   this.$nextTick(() => {
+      //     this.$refs['dataForm'].resetFields()
+      //     this.selectedCategory = []
+      //   })
+      // }).then(() => {
+      //   if (this.dataForm.categoryId) {
+      //     // 修改
+      //     this.$http({
+      //       url: this.$http.adornUrl(`/prod/category/info/${this.dataForm.categoryId}`),
+      //       method: 'get',
+      //       params: this.$http.adornParams()
+      //     }).then(({ data }) => {
+      //       this.dataForm.categoryId = data.categoryId
+      //       this.dataForm.categoryName = data.categoryName
+      //       this.dataForm.seq = data.seq
+      //       this.dataForm.pic = data.pic
+      //       this.dataForm.parentId = data.parentId
+      //       this.dataForm.status = data.status
+      //       this.selectedCategory = idList(this.categoryList, data.parentId, 'categoryId', 'children').reverse()
+      //     })
+      //   }
+      // })
+    },
+    getParentName(treeData, targetId) {
+      
+       const idField = 'categoryID'
+       const nameField = 'categoryName'
+       const  childrenField = 'children' 
+  
+    // 标准化目标ID
+    const targetValue = typeof targetId === 'object' 
+      ? targetId[idField] 
+      : targetId;
+    
+    // 递归查找上级
+      function findParent(data, parent = null) {
+        for (const node of data) {
+          // 检查当前节点是否是目标节点
+          if (node[idField] === targetValue) {
+            return parent ? parent[nameField] : null;
+          }
+          
+          // 如果有子节点，继续查找
+          if (node[childrenField] && node[childrenField].length > 0) {
+            const result = findParent(node[childrenField], node);
+            if (result !== null) {
+              return result;
+            }
+          }
+        }
+        
+        // 未找到
+        return null;
+      }
+    
+      return findParent(treeData);
     },
     handleChange (val) {
       this.dataForm.parentId = val[val.length - 1]
     },
     // 表单提交
     dataFormSubmit () {
-      if (this.selectedCategory.length === 1) {
-        this.dataForm.grade = 0
-      }
-      if (this.selectedCategory.length === 2) {
-        this.dataForm.grade = 1
-      }
-      if (this.selectedCategory.length === 3) {
-        this.dataForm.grade = 2
-      }
+      // if (this.selectedCategory.length === 1) {
+      //   this.dataForm.grade = 0
+      // }
+      // if (this.selectedCategory.length === 2) {
+      //   this.dataForm.grade = 1
+      // }
+      // if (this.selectedCategory.length === 3) {
+      //   this.dataForm.grade = 2
+      // }
       this.$refs['dataForm'].validate((valid) => {
         if (valid) {
           this.$http({
@@ -145,7 +242,7 @@ export default {
               'seq': this.dataForm.seq,
               'grade': this.dataForm.grade,
               'parentId': this.dataForm.parentId,
-              'pic': this.dataForm.pic
+              'icon': this.dataForm.icon
             })
           }).then(({ data }) => {
             this.$message({

src/views/modules/prod/category.vue

@@ -3,7 +3,7 @@
     <el-form :inline="true" :model="searchForm">
       <el-form-item label="分类名称">
         <el-input
-          v-model="searchForm.name"
+          v-model="searchForm.categoryName"
           size="small"
           placeholder="请输入分类名称"
         ></el-input>
@@ -34,8 +34,8 @@
     <el-table
       :data="dataList"
       border
-      row-key="categoryId"
-      :tree-props="{ children: 'children', hasChildren: 'seq' }"
+      row-key="categoryID"
+       :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
       style="width: 100%"
     >
       <el-table-column
@@ -47,9 +47,13 @@
         label="分类名称"
       >
       </el-table-column>
-      <el-table-column prop="categoryName" align="center" label="图标">
+      <el-table-column prop="icon" align="center" label="图标">
+         <template slot-scope="scope">
+          <img v-if="scope.row.icon" :src="resourcesUrl+scope.row.icon" alt="" style="width: 20px; height: 20px;" />
+          <span v-else>无</span>
+        </template>
       </el-table-column>
-      <el-table-column prop="categoryName" align="center" label="关联商品">
+      <el-table-column prop="resource" align="center" label="关联商品">
       </el-table-column>
       <el-table-column
         prop="status"
@@ -81,25 +85,27 @@
           <el-button
             type="primary"
             size="small"
-            @click="handleRelated(scope.row.categoryId)"
-            >管理商品</el-button
+            v-if="scope.row.productBeBound == 1"
+            @click="handleRelated(scope.row.categoryID)"
+            >关联商品</el-button
           >
           <el-button
             type="primary"
             size="small"
-            @click="addOrUpdateHandle(scope.row.categoryId)"
-            >添加二级分类</el-button
+            v-if="scope.row.grade != 2"
+            @click="addOrUpdateHandle(scope.row, 'add')"
+            > {{scope.row.grade == 0?'添加二级分类':'添加三级分类'}} </el-button
           >
           <el-button
             type="primary"
             size="small"
-            @click="addOrUpdateHandle(scope.row.categoryId)"
+            @click="addOrUpdateHandle(scope.row, 'edit')"
             >修改</el-button
           >
           <el-button
             type="danger"
             size="small"
-            @click="deleteHandle(scope.row.categoryId)"
+            @click="deleteHandle(scope.row.categoryID)"
             >删除</el-button
           >
         </template>
@@ -143,6 +149,7 @@ export default {
       total: 0,
       searchForm: {
         shopId: localStorage.getItem("shopId"),
+        categoryName:'',
         current: 1,
         size: 10,
       },
@@ -167,9 +174,9 @@ export default {
       this.exportVisible = true;
       this.$refs.export.open()
     },
-    handleRelated(){
+    handleRelated(id){
       this.relatedVisible = true;
-      this.$refs.related.open()
+      this.$refs.related.open(id)
     },
     search() {
       this.searchForm.current = 1;
@@ -188,9 +195,9 @@ export default {
     getDataList() {
       this.dataListLoading = true;
       this.$http({
-        url: this.$http.adornUrl("/prod/category/listCategory"),
-        method: "get",
-        params: this.$http.adornParams(this.searchForm),
+        url: this.$http.adornUrl("/prod/category/listCategoryNew"),
+        method: "post",
+        data: this.$http.adornParams(this.searchForm),
       }).then(({ data }) => {
         // this.dataList = treeDataTranslate(data, 'categoryId', 'parentId')
         this.dataList = data.records;
@@ -199,10 +206,10 @@ export default {
       });
     },
     // 新增 / 修改
-    addOrUpdateHandle(id) {
+    addOrUpdateHandle(id,type) {
       this.addOrUpdateVisible = true;
       this.$nextTick(() => {
-        this.$refs.addOrUpdate.init(id);
+        this.$refs.addOrUpdate.init(id,type,this.dataList);
       });
     },
     // 删除

src/views/modules/prod/exportExcel.vue

@@ -12,39 +12,78 @@
       <div class="line"></div>
       <div class="num">2</div>
     </div>
-
     <div class="content">
       <div class="item">
         <div class="title">下载模版并填写</div>
         <div class="desc">请按照模版格式填写Excel表格内容，表格数据最多支持1000条</div>
+        <a ref="link" class="link" href="https://zswl-shop.oss-cn-chengdu.aliyuncs.com/template/海马购分类导入模板.xlsx" download="">下载</a>
+
         <div class="box">
           <div class="name-box">
           <svg xmlns="http://www.w3.org/2000/svg" class="styles__StyledSVGIconPathComponent-sc-1sh3oaa-0 lmXXwv svg-icon-path-icon fill" viewBox="64 64 896 896" width="20" height="20"><defs></defs><g><path d="M854.6 288.7c6 6 9.4 14.1 9.4 22.6V928c0 17.7-14.3 32-32 32H192c-17.7 0-32-14.3-32-32V96c0-17.7 14.3-32 32-32h424.7c8.5 0 16.7 3.4 22.7 9.4l215.2 215.3zM790.2 326L602 137.8V326h188.2zM575.34 477.84l-61.22 102.3L452.3 477.8a12 12 0 0 0-10.27-5.79h-38.44a12 12 0 0 0-6.4 1.85 12 12 0 0 0-3.75 16.56l82.34 130.42-83.45 132.78a12 12 0 0 0-1.84 6.39 12 12 0 0 0 12 12h34.46a12 12 0 0 0 10.21-5.7l62.7-101.47 62.3 101.45a12 12 0 0 0 10.23 5.72h37.48a12 12 0 0 0 6.48-1.9 12 12 0 0 0 3.62-16.58l-83.83-130.55 85.3-132.47a12 12 0 0 0 1.9-6.5 12 12 0 0 0-12-12h-35.7a12 12 0 0 0-10.29 5.84z"></path></g></svg>
           <div class="name">店内分类导入模版.xlsx</div>
           </div>
-          <el-button size="small" type="primary" @click="submit()">下载</el-button>
+          <el-button size="small" type="primary" @click="dowmload()">下载</el-button>
         </div>
       </div>
 
        <div class="item" style="margin-top:30px">
         <div class="title">下载模版并填写</div>
         <div class="desc">请按照模版格式填写Excel表格内容，表格数据最多支持1000条</div>
-        <el-upload
+        <!-- <el-upload
           class="upload-demo"
           drag
-          action="https://jsonplaceholder.typicode.com/posts/"
+          :action="resourcesUrl+'prod/category/exportExcel'"
           multiple>
           <i class="el-icon-upload"></i>
           <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
           <div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>
-        </el-upload>
+        </el-upload> -->
+
+         <div 
+          class="el-upload-dragger"
+          @dragover="handleDragOver"
+          @dragleave="handleDragLeave"
+          @drop="handleDrop"
+        >
+          <i class="el-icon-upload"></i>
+          <div class="el-upload__text">
+            将文件拖到此处，或<em @click="handleUpload">点击上传</em>
+          </div>
+          <input 
+            type="file" 
+            ref="fileInput" 
+            @change="handleFileSelect" 
+            class="el-upload__input"
+            :accept="accept"
+          >
+        </div>
+
+         <!-- 上传提示信息 -->
+        <div class="el-upload__tip" v-if="tip">
+          <i class="el-icon-info"></i>
+          {{ tip }}
+        </div>
+        
+        <!-- 上传状态提示 -->
+        <div 
+          class="upload-status" 
+          v-if="uploading || uploadError || uploadSuccess"
+          :class="{ 'uploading': uploading, 'error': uploadError, 'success': uploadSuccess }"
+        >
+          <i v-if="uploading" class="el-icon-loading"></i>
+          <i v-else-if="uploadSuccess" class="el-icon-success"></i>
+          <i v-else-if="uploadError" class="el-icon-error"></i>
+          <span>{{ uploadMessage }}</span>
+        </div>
+
       </div>
     </div>
   </div>
  
-    <span slot="footer" class="dialog-footer">
+    <!-- <span slot="footer" class="dialog-footer">
       <el-button style="margin-right:18px" size="small" type="primary" @click="submit()">确认导入</el-button>
-    </span>
+    </span> -->
   </el-dialog>
 </template>
 <script>
@@ -52,15 +91,104 @@
 export default {
   data () {
     return {
+      tip:'',
+       isDragging: false,
+      uploading: false,
+      uploadSuccess: false,
+      uploadError: false,
+      uploadMessage: '',
+      currentFile: null,
+      accept:'.xls,.xlsx',
       visible: false,
+      resourcesUrl: window.SITE_CONFIG.resourcesUrl,
+
      
     }
   },
  
   methods: {
+    handleUpload(){
+      this.$refs.fileInput.click();
+    },
+     // 处理拖拽相关事件
+    handleDragOver(e) {
+      e.preventDefault();
+      e.stopPropagation();
+      this.isDragging = true;
+    },
+    
+    handleDragLeave(e) {
+      e.preventDefault();
+      e.stopPropagation();
+      this.isDragging = false;
+    },
+    
+    handleDrop(e) {
+      e.preventDefault();
+      e.stopPropagation();
+      this.isDragging = false;
+      console.log(3);
+      if (e.dataTransfer.files.length) {
+        this.processFiles(e.dataTransfer.files);
+      }
+    },
+     // 处理文件选择
+    handleFileSelect(e) {
+      if (e.target.files.length) {
+        this.processFiles(e.target.files);
+        // 重置input，允许重复选择相同文件
+        this.$refs.fileInput.value = '';
+      }
+    },
+    
+    // 处理文件
+    processFiles(files) {
+      // 仅处理第一个文件（如需多文件上传可修改）
+      const file = files[0];
+      
+      // 触发上传事件
+      this.$emit('file-selected', file);
+      
+      // 模拟上传过程
+      this.startUpload(file);
+    },
+    
+    // 模拟上传过程（实际项目中替换为真实上传逻辑）
+    startUpload(file) {
+      this.currentFile = file;
+      this.uploading = true;
+      this.uploadSuccess = false;
+      this.uploadError = false;
+      this.uploadMessage = `正在上传: ${file.name}`;
+
+       // 创建FormData对象
+      const formData = new FormData();
+      // 添加文件
+      formData.append('excelFile', file, file.name);
+      formData.append('t', new Date().getTime())
+
+       this.$http({
+        url: this.$http.adornUrl("/prod/category/exportExcel"),
+        method: "post",
+        data:formData,
+      }).then(data => {
+            this.uploading = false;
+            this.uploadSuccess = true;
+            this.uploadMessage = `上传成功: ${file.name}`;
+           
+      }).catch(error => {
+            this.uploading = false;
+            this.uploadError = true;
+            this.uploadMessage = `上传失败: ${file.name}`;
+      });
+     
+    },
     open(){
       this.visible = true
     },
+    dowmload(){
+      this.$refs.link.click()
+    },
     submit () {
        this.visible = false
       this.$emit('close')
@@ -94,8 +222,14 @@ export default {
 </script>
 
 <style lang="scss">
+
 .setp-box{
   display: flex;
+  .link{
+    position: fixed;
+    top: -99999px;
+    left: -99999px;
+  }
   .setp{
     flex-shrink: 1;
     .num{

src/views/modules/prod/relateGoods.vue

@@ -5,13 +5,13 @@
     title="已关联商品"
     :close-on-click-modal="false"
     :visible.sync="visible"
-    width="510px"
+    width="800px"
   >
   <div class="content">
     <el-form :inline="true" :model="searchForm">
       <el-form-item label="产品名称">
         <el-input
-          v-model="searchForm.name"
+          v-model="searchForm.prodName"
           size="small"
           placeholder="请输入产品名称"
         ></el-input>
@@ -40,7 +40,7 @@
       style="width: 100%"
     >
       <el-table-column
-        prop="categoryName"
+        prop="prodName"
         header-align="center"
         align="center"
         label="产品名称"
@@ -52,6 +52,9 @@
         align="center"
         label="上下线状态"
       >
+      <template slot-scope="scope">
+        {{scope.row.status==1?'上线':'下线'}}
+      </template>
       </el-table-column>
    
       <el-table-column
@@ -64,7 +67,7 @@
           <el-button
             type="primary"
             size="small"
-            @click="handle()"
+            @click="handle(scope.row.prodId)"
             >取消关联</el-button
           >
         </template>
@@ -87,7 +90,7 @@
 
 
   <!-- 关联商品 -->
-    <related-goods-detail v-if="relatedVisible" ref="related" @close="relatedVisible = false"></related-goods-detail>
+    <related-goods-detail v-if="relatedVisible" ref="related" @close="close"></related-goods-detail>
 </div>
 </template>
 <script>
@@ -103,7 +106,8 @@ export default {
       relatedVisible:true,
       dataList: [],
       searchForm: {
-        name:'',
+        prodName:'',
+        shopCategoryId:'',
         current: 1,
         size: 10,
       },
@@ -115,10 +119,17 @@ export default {
   methods: {
      handleRelated(){
       this.relatedVisible = true;
-      this.$refs.related.open()
+      this.$refs.related.open(this.searchForm.shopCategoryId)
+      
     },
-    open(){
+    open(id){
       this.visible = true
+      this.searchForm.shopCategoryId = id;
+      this.getDataList()
+    },
+    close(){
+      this.relatedVisible = false
+      this.getDataList()
     },
     submit () {
        this.visible = false
@@ -149,19 +160,43 @@ export default {
     },
     // 获取数据列表
     getDataList() {
-      // this.dataListLoading = true;
-      // this.$http({
-      //   url: this.$http.adornUrl("/prod/category/listCategory"),
-      //   method: "get",
-      //   params: this.$http.adornParams(this.searchForm),
-      // }).then(({ data }) => {
-      //   // this.dataList = treeDataTranslate(data, 'categoryId', 'parentId')
-      //   this.dataList = data.records;
-      //   this.total = data.total;
-      //   this.dataListLoading = false;
-      // });
+      this.dataListLoading = true;
+      this.$http({
+        url: this.$http.adornUrl("/prod/prod/listRelatedProducts"),
+        method: "post",
+        data: this.$http.adornParams(this.searchForm),
+      }).then(({ data }) => {
+        // this.dataList = treeDataTranslate(data, 'categoryId', 'parentId')
+        this.dataList = data.records;
+        this.total = data.total;
+        this.dataListLoading = false;
+      });
+    },
+    handle(id){
+      this.$confirm('确定取消关联?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.$http({
+          url: this.$http.adornUrl("/prod/prod/cancelRelatedProducts/"+id),
+          method: "get",
+        }).then(({ data }) => {
+          this.$message({
+            message: '操作成功',
+            type: 'success',
+            duration: 1500,
+            onClose: () => {
+              this.getDataList();
+            }
+          })
+        });
+      }).catch(() => {});
+    },
+    search(){
+      this.searchForm.current = 1;
+      this.getDataList()
     },
-    handle(){},
     handleSizeChange(val) {
       this.searchForm.size = val;
       this.searchForm.current = 1;

src/views/modules/prod/relatedGoodsDetail.vue

@@ -3,145 +3,121 @@
     title="关联商品"
     :close-on-click-modal="false"
     :visible.sync="visible"
-    width="510px"
+    width="800px"
   >
+    <div class="content">
+      <el-button class="clear" type="text" size="small" @click="clear">全部清空</el-button>
+      <el-transfer
+        filterable
+        :titles="['门店中未关联商品', '已关联商品']"
+        :props="{
+          key: 'prodId',
+          label: 'prodName',
+        }"
+        v-model="dataForm.productId"
+        :data="dataList"
+      ></el-transfer>
+    </div>
 
-  <div class="content">
-    <el-transfer v-model="value" :data="data"></el-transfer>
-  </div>
- 
     <span slot="footer" class="dialog-footer">
-       <el-button size="small" @click="visible = false">取消</el-button>
-      <el-button size="small" type="primary" @click="dataFormSubmit()">确定</el-button>
+      <el-button size="small" @click="visible = false">取消</el-button>
+      <el-button size="small" type="primary" :loading="dataListLoading" @click="dataFormSubmit()"
+        >确定</el-button
+      >
     </span>
   </el-dialog>
 </template>
 <script>
 // import PicUpload from '@/components/pic-upload'
 export default {
-  data () {
+  data() {
     return {
+      total: 0,
       visible: false,
-      data: [
-          {
-            key: 1,
-            label: `备选项1`,
-          },
-          {
-            key: 2,
-            label: `备选项2`,
-          },
-          {
-            key: 3,
-            label: `备选项3`,
-          },
-          {
-            key: 4,
-            label: `备选项4`,
-          },
-          {
-            key: 5,
-            label: `备选项5`,
-          },
-          {
-            key: 6,
-            label: `备选项6`,
-          },
-      ],
-      value: [1,4]
-    }
+      dataList: [],
+      dataListLoading: false,
+      dataForm: {
+        productId:[],
+        shopCategoryId:0
+      },
+    };
   },
- 
+
   methods: {
-    open(){
-      this.visible = true
+    clear(){
+      this.dataForm.productId = []
+
     },
-    dataFormSubmit(){},
-    submit () {
-       this.visible = false
-      this.$emit('close')
-      //  this.$http({
-      //       url: this.$http.adornUrl(`/prod/category`),
-      //       method: this.dataForm.categoryId ? 'put' : 'post',
-      //       data: this.$http.adornData({
-      //         'categoryId': this.dataForm.categoryId || undefined,
-      //         'categoryName': this.dataForm.categoryName,
-      //         'status': this.dataForm.status,
-      //         'seq': this.dataForm.seq,
-      //         'grade': this.dataForm.grade,
-      //         'parentId': this.dataForm.parentId,
-      //         'pic': this.dataForm.pic
-      //       })
-      //     }).then(({ data }) => {
-      //       this.$message({
-      //         message: '操作成功',
-      //         type: 'success',
-      //         duration: 1500,
-      //         onClose: () => {
-      //           this.visible = false
-      //           this.$emit('close')
-      //         }
-      //       })
-      //     })
+    resetData(){
+      this.dataForm.productId = []
     },
-   
-  }
-}
+    open(id) {
+      this.visible = true;
+      this.dataForm.shopCategoryId = id;
+      this.getDataList();
+      this.resetData()
+    },
+    // 获取数据列表
+    getDataList() {
+      this.$http({
+        url: this.$http.adornUrl("/prod/prod/listUnRelatedProducts"),
+        method: "post",
+        data: this.$http.adornParams({
+          shopId: localStorage.getItem("shopId"),
+          current: 1,
+          size: 999999,
+        }),
+      }).then(({ data }) => {
+        this.dataList = data.records;
+        this.total = data.total;
+      });
+    },
+    dataFormSubmit() {
+      if(this.dataForm.productId.length === 0){
+        return this.$message.error("请选择商品加入右侧后再提交")
+      }
+      this.dataListLoading = true;
+       this.$http({
+          url: this.$http.adornUrl("/prod/prod/relatedProducts"),
+          method: "post",
+          data: this.$http.adornData(this.dataForm),
+        }).then(({ data }) => {
+          this.visible = false;
+          this.dataListLoading = false;
+          this.$emit('close')
+          this.$message({
+            message: "操作成功",
+            type: "success",
+            duration: 1500,
+            onClose: () => {
+            },
+          })
+        }).catch(() => {
+          this.dataListLoading = false;
+        });
+    },
+  },
+};
 </script>
 
 <style lang="scss">
-.setp-box{
-  display: flex;
-  .setp{
-    flex-shrink: 1;
-    .num{
-      width: 30px;
-      height: 30px;
-      line-height: 30px;
-      text-align: center;
-      border-radius: 50%;
-      border: 1px solid #ccc;
-    }
-    .line{
-      width: 1px;
-      height: 100px;
-      background: #ccc;
-      margin-left: 15px;
-    }
-  }
-
-  .content{
-    .title{
-      font-size: 18px;
-    }
-    .desc{
-          color: rgba(150, 150, 150, 1);
-          font-size: 14px;
-          line-height: 20px;
-    }
+.el-transfer-panel{
+  width: 500px!important;
+}
+.el-transfer-panel__body,.el-transfer-panel__list.is-filterable{
+  height: 500px!important;
+}
 
-    .box{
-      border: 1px dashed rgba(232, 232, 236, 1);
-      padding: 10px 20px;
-      background: rgb(250, 250, 250);
-      display: flex;
-      justify-content: space-between;
-      margin-top: 10px;
-      .name-box{
-        color: rgba(150, 150, 150, 1);
-        font-size: 14px;
-        line-height: 23px;
-        display: flex;
-        align-items: center;
-      }
-    }
-    .upload-demo,.el-upload,.el-upload-dragger{
-      width: 440px;
-      height: 88px;
-    }
-    .el-icon-upload{
-      margin: 0;
-    }
+.content{
+  position: relative;
+  .clear{
+    position: absolute;
+    right: 100px;
+    top: 4px;
+    z-index: 999;
   }
 }
+
+
+
 </style>

static/config/index-prod.js

@@ -16,8 +16,8 @@
 
   // api接口请求地址
   // window.SITE_CONFIG['baseUrl'] = 'http://b2b2c-multishop.gz-yami.com/apis'
-  window.SITE_CONFIG['baseUrl'] = 'https://shop-vs.dev.zswllife.cn/vsapis'
-  // window.SITE_CONFIG['baseUrl'] = 'https://shop-vs.haimamart.com/vsapis'
+  // window.SITE_CONFIG['baseUrl'] = 'https://shop-vs.dev.zswllife.cn/vsapis'
+  window.SITE_CONFIG['baseUrl'] = 'https://shop-vs.haimamart.com/vsapis'
   
   // 静态资源文件url
   // window.SITE_CONFIG['resourcesUrl'] = 'http://img-test.gz-yami.com/'