瀏覽代碼

经销商关联绑定

lilei 4 年之前
父節點
當前提交
21c21ba426

+ 44 - 8
src/api/dealerRelation.js

@@ -1,5 +1,13 @@
 import { axios } from '@/utils/request'
 
+// 绑定经销商关系
+export const bindRelation = (params) => {
+  return axios({
+    url: `/dealerRelation/bindRelation/${params.parentDealerSn}/${params.subDealerSn}`,
+    method: 'get'
+  })
+}
+
 //  经销商关系绑定 列表  有分页
 export const dealerRelationList = (params) => {
   const url = `/dealerRelation/queryPage/${params.pageNo}/${params.pageSize}`
@@ -11,11 +19,39 @@ export const dealerRelationList = (params) => {
     method: 'post'
   })
 }
-// //  经销商关系绑定 保存
-// export const dealerRelationSave = (params) => {
-//   return axios({
-//     url: '/dealerRelation/save',
-//     data: params,
-//     method: 'post'
-//   })
-// }
+
+// 分页查询返利信息
+export const queryRebatePage = (params) => {
+  const url = `/dealerRelation/queryRebatePage/${params.pageNo}/${params.pageSize}`
+  delete params.pageNo
+  delete params.pageSize
+  return axios({
+    url: url,
+    data: params,
+    method: 'post'
+  })
+}
+
+// 根据父经销商查找子经销商列表
+export const querySubList = (params) => {
+  return axios({
+    url: `/dealerRelation/querySubList/${params.parentDealerSn}`,
+    method: 'get'
+  })
+}
+
+// 解绑经销商关系
+export const unbindRelation = (params) => {
+  return axios({
+    url: `/dealerRelation/unbindRelation/${params.subDealerSn}`,
+    method: 'get'
+  })
+}
+
+// 更新经销商返利信息
+export const updateRebate = (params) => {
+  return axios({
+    url: `/dealerRelation/updateRebate/${params.dealerSn}/${params.rebateDealerSn}`,
+    method: 'get'
+  })
+}

+ 36 - 64
src/views/dealerManagement/dealerRelationshipBinding/associateModal.vue

@@ -18,31 +18,11 @@
         :label-col="formItemLayout.labelCol"
         :wrapper-col="formItemLayout.wrapperCol"
       >
-        <a-form-model-item label="上级名称" v-if="parentType">
-          {{ parentType }}
+        <a-form-model-item label="上级名称" v-if="nowData">
+          {{ nowData.dealerName }}
         </a-form-model-item>
-        <a-form-model-item label="选择下级" prop="productTypeName">
-          <a-select
-            placeholder="请选择"
-            id="relationshipBinding-productBrandSn"
-            allowClear
-            v-model="form.productTypeName"
-            :showSearch="true"
-            @search="handlerSearch">
-            <div slot="dropdownRender" slot-scope="menu">
-              <ul style="padding: 0;margin: 0;list-style: none;">
-                <li style="padding: 10px 15px;display: flex;justify-content: space-between;align-items: center;" @click="handleDisassociate()">
-                  <p style="margin: 0;">西安车领主网络科技有限公司</p>
-                  <a-button
-                    type="link"
-                    class="button-error"
-                    size="small"
-                    id="relationshipBindingList-edit">立刻关联</a-button>
-                </li>
-              </ul>
-            </div>
-            <!-- <a-select-option v-for="item in productBrandList" :key="item.productBrandSn" :value="item.productBrandSn">{{ item.productBrandName }}</a-select-option> -->
-          </a-select>
+        <a-form-model-item label="选择下级">
+          <queryChild ref="queryChid" :dealerLevelList="dealerLevelList" @change="handleDisassociate"></queryChild>
         </a-form-model-item>
       </a-form-model>
       <div class="btn-cont">
@@ -54,15 +34,17 @@
 </template>
 
 <script>
-// import { dealerProductTypeSave } from '@/api/dealerProductType'
+import { bindRelation } from '@/api/dealerRelation'
+import queryChild from './queryChild.vue'
 export default {
   name: 'RelationshipBindingModal',
+  components: { queryChild },
   props: {
     openModal: { //  弹框显示状态
       type: Boolean,
       default: false
     },
-    itemId: {
+    tabInd: {
       type: [Number, String],
       default: ''
     },
@@ -74,53 +56,41 @@ export default {
   data () {
     return {
       isShow: this.openModal, //  是否打开弹框
+      form: {},
+      rules: {},
       formItemLayout: {
         labelCol: { span: 6 },
         wrapperCol: { span: 16 }
       },
-      form: {
-        productTypeName: '' // 产品分类名称
-      },
-      rules: {
-        productTypeName: [
-          { required: true, message: '请输入产品分类名称', trigger: 'blur' }
-        ]
-      },
-      parentType: '', //  父级分类
-      productBrandList: [
-        { productBrandSn: 2, productBrandName: '爱的世界客户带伞' }
-      ]
-    }
-  },
-  components: {
-    VNodes: {
-      functional: true,
-      render: (h, ctx) => ctx.props.vnodes
+      dealerLevelList: [],
+      subDealerSn: ''
     }
   },
   methods: {
-    handleDisassociate () {
-      console.log('选中')
-    },
-    // search
-    handlerSearch (val) {
-      console.log(val)
+    handleDisassociate (val) {
+      console.log('选中', val)
+      this.subDealerSn = val.key
     },
     //  保存
     handleSave () {
       const _this = this
       _this.$refs.ruleForm.validate(valid => {
         if (valid) {
-          const formData = JSON.parse(JSON.stringify(_this.form))
-          formData.id = _this.itemId ? _this.itemId : undefined
-          formData.psn = _this.nowData && _this.nowData.psn ? _this.nowData.psn : undefined
-          // dealerProductTypeSave(formData).then(res => {
-          //   if (res.status == 200) {
-          //     _this.$message.success(res.message)
-          //     _this.$emit('ok')
-          //     _this.isShow = false
-          //   }
-          // })
+          if (_this.subDealerSn == '') {
+            this.$message.info('请选择下级')
+            return
+          }
+          const formData = {
+            subDealerSn: _this.subDealerSn,
+            parentDealerSn: _this.nowData && _this.nowData.dealerSn ? _this.nowData.dealerSn : undefined
+          }
+          bindRelation(formData).then(res => {
+            if (res.status == 200) {
+              _this.$message.success(res.message)
+              _this.$emit('ok', formData.parentDealerSn)
+              _this.isShow = false
+            }
+          })
         } else {
           return false
         }
@@ -142,13 +112,15 @@ export default {
       if (!newValue) {
         this.$emit('close')
         this.$refs.ruleForm.resetFields()
+        this.$refs.queryChid.resetForm()
+        this.subDealerSn = []
+      } else {
+        this.dealerLevelList = [this.tabInd == '1' ? 'CITY' : 'SPECIAL']
       }
     },
-    itemId (newValue, oldValue) {
+    tabInd (newValue, oldValue) {
       if (this.isShow && newValue) {
-
-      } else {
-
+        this.dealerLevelList = [newValue == '1' ? 'CITY' : 'SPECIAL']
       }
     }
   }

+ 117 - 74
src/views/dealerManagement/dealerRelationshipBinding/list.vue

@@ -2,32 +2,37 @@
   <a-card size="small" :bordered="false" class="relationshipBindingList-wrap">
     <!-- 搜索条件 -->
     <div class="table-page-search-wrapper">
-      <a-form layout="inline" @keyup.enter.native="$refs.table.refresh(true)">
+      <a-form layout="inline" @keyup.enter.native="getList()">
         <a-row :gutter="15">
           <a-col :md="6" :sm="24">
             <a-form-item label="经销商名称">
-              <a-input id="relationshipBindingList-productName" v-model.trim="queryParam.productName" allowClear placeholder="请输入经销商名称"/>
+              <a-input id="relationshipBindingList-dealerName" v-model.trim="queryParam.dealerName" allowClear placeholder="请输入经销商名称"/>
             </a-form-item>
           </a-col>
           <a-col :md="6" :sm="24">
-            <a-button style="margin-bottom: 18px;" type="primary" @click="$refs.table.refresh(true)" :disabled="disabled" id="relationshipBindingList-refresh">查询</a-button>
-            <a-button style="margin: 0 0 18px 8px" @click="resetSearchForm" :disabled="disabled" id="relationshipBindingList-reset">重置</a-button>
+            <a-button style="margin-bottom: 18px;" type="primary" @click="getList()" :disabled="disabled" id="relationshipBindingList-refresh">查询</a-button>
+            <a-button style="margin: 0 0 18px 8px" @click="resetSearchForm()" :disabled="disabled" id="relationshipBindingList-reset">重置</a-button>
           </a-col>
         </a-row>
       </a-form>
     </div>
     <!-- 列表 -->
-    <a-tabs type="card" @change="callback" v-model="tabInd" defaultActiveKey="1">
+    <a-tabs type="card" @change="tabChange" v-model="tabInd">
       <a-tab-pane key="1" tab="省市级关系绑定"></a-tab-pane>
       <a-tab-pane key="2" tab="特约店关系绑定"></a-tab-pane>
     </a-tabs>
-    <s-table
+    <a-table
       class="sTable"
       ref="table"
       size="default"
-      :rowKey="(record) => record.id"
+      :rowKey="(record) => record.dealerSn"
       :columns="columns"
-      :data="loadData"
+      :pagination="pagination"
+      :data-source="list"
+      @expand="expand"
+      @change="change"
+      :expandedRowKeys="expandedRowKeys"
+      :expandRowByClick="true"
       :scroll="{ y: tableHeight }">
       <!-- 操作 -->
       <template slot="action" slot-scope="text, record">
@@ -36,38 +41,28 @@
           class="button-info"
           size="small"
           icon="plus"
-          id="relationshipBindingList-addSubItem"
-          @click="handleAssociate(record)">关联下级</a-button>
+          :id="'relationshipBindingList-addSubItem'+record.id"
+          v-if="record.children"
+          @click.stop="handleAssociate(record)">关联下级</a-button>
+        <a-button
+          type="link"
+          class="button-warning"
+          size="small"
+          icon="plus"
+          :id="'relationshipBindingList-delSubItem'+record.id"
+          v-else
+          @click.stop="handleDisassociate(record)">取消关联</a-button>
       </template>
-      <a-table
-        slot="expandedRowRender"
-        slot-scope="text, record, index"
-        size="small"
-        :columns="innerColumns"
-        :data-source="innerData"
-        :pagination="false"
-        :bordered="false">
-        <!-- 操作 -->
-        <template slot="action" slot-scope="text, record">
-          <a-button
-            type="link"
-            class="button-error"
-            size="small"
-            icon="rollback"
-            id="relationshipBindingList-edit"
-            @click="handleDisassociate(record)">取消关联</a-button>
-        </template>
-      </a-table>
-    </s-table>
+    </a-table>
     <!-- 关联下级 -->
-    <associate-modal :openModal="openModal" :nowData="nowData" :itemId="itemId" @ok="$refs.table.refresh(true)" @close="closeModal" />
+    <associate-modal :openModal="openModal" :nowData="nowData" :tabInd="tabInd" @ok="addItemOk" @close="closeModal" />
   </a-card>
 </template>
-
+I
 <script>
 import { STable, VSelect } from '@/components'
 import associateModal from './associateModal.vue'
-import { dealerRelationList } from '@/api/dealerRelation'
+import { dealerRelationList, querySubList, unbindRelation } from '@/api/dealerRelation'
 export default {
   components: { STable, VSelect, associateModal },
   data () {
@@ -77,80 +72,128 @@ export default {
         labelCol: { span: 6 },
         wrapperCol: { span: 16 }
       },
-      queryParam: {},
+      queryParam: {
+        dealerName: ''
+      },
       disabled: false, //  查询、重置按钮是否可操作
       columns: [
         { title: '经销商名称', dataIndex: 'dealerName', align: 'left' },
         { title: '操作', scopedSlots: { customRender: 'action' }, align: 'center' }
       ],
-      // 加载数据方法 必须为 Promise 对象
-      loadData: parameter => {
-        this.disabled = true
-        if (this.tableHeight == 0) {
-          this.tableHeight = window.innerHeight - 380
-        }
-        return dealerRelationList(Object.assign(parameter, this.queryParam, { dealerLevelList: this.tabInd == 1 ? ['PROVINCE'] : ['PROVINCE', 'CITY'] })).then(res => {
-          const data = res.data
-          const no = (data.pageNo - 1) * data.pageSize
-          for (var i = 0; i < data.list.length; i++) {
-            data.list[i].no = no + i + 1
-          }
-          this.disabled = false
-          return data
-        })
+      expandedRowKeys: [],
+      list: [],
+      parameter: {
+        pageNo: 1,
+        pageSize: 10
+      },
+      pagination: {
+        total: 1,
+        current: 1,
+        showTotal: total => `共 ${total} 条记录 第 ${this.pagination.current} / ${Math.ceil(total / this.pagination.pageSize)} 页`,
+        showQuickJumper: true,
+        showSizeChanger: true,
+        pageSize: 10
       },
-      defaultExpandedRowKeys: [], //  树形数据默认展开项
       openModal: false, //  新增编辑  弹框
-      itemId: '', //  当前id
       nowData: null, //  当前记录数据
-      tabInd: 1, //  tabs选中项
-      innerColumns: [
-        { title: '经销商名称', dataIndex: 'dealerName', align: 'left' },
-        { title: '操作', scopedSlots: { customRender: 'action' }, align: 'center' }
-      ],
-      innerData: []
+      tabInd: '1', //  tabs选中项
+      dealerSn: []
     }
   },
+  mounted () {
+    this.tableHeight = window.innerHeight - 380
+    this.getList()
+  },
   methods: {
+    expand (expanded, record) {
+      this.nowData = record
+      this.expandedRowKeys = [] // 重置展开节点,只展开当前点击的节点(内部数据调用模板,无法做到同时几个内层表格数据直接缓存在页面)
+      if (expanded) {
+        this.expandedRowKeys = [record.dealerSn]
+        this.getSubItem(record) // 获取表格内部数据
+      }
+    },
+    // 外层表格操作
+    change (pagination, filters, sorter) { // 对页面大小,筛选,排序等条件修改后重新查询数据
+      this.pagination = pagination
+      this.parameter.pageNo = pagination.current
+      this.parameter.pageSize = pagination.pageSize
+      this.getList()
+    },
+    // 获取子节点数据
+    getSubItem (record) {
+      record.children = []
+      querySubList({ parentDealerSn: this.expandedRowKeys[0] }).then(res => {
+        if (res.status == 200 && res.data && res.data.length) {
+          record.children = res.data
+        } else {
+          record.children = this.nowData.children
+        }
+      })
+    },
+    // 添加子机成功
+    addItemOk () {
+      this.getSubItem(this.nowData)
+    },
+    // 获取列表数据
+    getList () {
+      this.disabled = true
+      console.log(this.queryParam.dealerName)
+      dealerRelationList(Object.assign(this.parameter, this.queryParam, { dealerLevelList: this.tabInd == 1 ? ['PROVINCE'] : ['PROVINCE', 'CITY'] })).then(res => {
+        const data = res.data
+        this.pagination.total = data.count
+        this.pagination.current = data.pageNo
+        this.pagination.pageSize = data.pageSize
+        this.parameter.pageNo = data.pageNo
+        this.parameter.pageSize = data.pageSize
+        const no = (data.pageNo - 1) * data.pageSize
+        for (var i = 0; i < data.list.length; i++) {
+          data.list[i].no = no + i + 1
+          data.list[i].children = []
+        }
+        this.disabled = false
+        this.list = data.list
+      })
+    },
     //  重置
-    resetSearchForm () {
-      this.queryParam.productCode = ''
-      this.queryParam.enabledFlag = undefined
-      this.$refs.table.refresh(true)
+    resetSearchForm (flag) {
+      if (!flag) {
+        this.queryParam.dealerName = ''
+        this.parameter.pageNo = 1
+        this.parameter.pageSize = 10
+        this.expandedRowKeys = []
+      }
+      this.getList()
     },
-    callback (key) {
-      console.log(key)
+    tabChange (key) {
       this.tabInd = key
-      this.$refs.table.refresh(true)
+      this.resetSearchForm()
     },
     // 关联下级
     handleAssociate (row) {
-      this.itemId = row.id
       this.nowData = row
+      this.expandedRowKeys = [row.dealerSn]
       this.openModal = true
     },
     // 取消关联
     handleDisassociate (row) {
       const _this = this
-      // _this.nowId = row.id
       _this.$confirm({
         title: '提示',
         content: '确认要解除上下级的关系吗?',
         centered: true,
         onOk () {
-          // dealerProductTypeDel({ id: _this.nowId }).then(res => {
-          //   if (res.status == 200) {
-          //     _this.$message.success(res.message)
-          //     _this.$refs.table.refresh()
-          //   }
-          // })
+          unbindRelation({ subDealerSn: row.dealerSn }).then(res => {
+            if (res.status == 200) {
+              _this.$message.success(res.message)
+              _this.addItemOk()
+            }
+          })
         }
       })
     },
     //  关闭弹框
     closeModal () {
-      this.itemId = ''
-      this.nowData = null
       this.openModal = false
     }
   }

+ 69 - 0
src/views/dealerManagement/dealerRelationshipBinding/queryChild.vue

@@ -0,0 +1,69 @@
+<template>
+  <a-select
+    show-search
+    label-in-value
+    :value="dealerName"
+    placeholder="请选择下级"
+    style="width: 100%"
+    :filter-option="false"
+    :not-found-content="fetching ? undefined : null"
+    @search="fetchUser"
+    @change="handleChange"
+  >
+    <a-spin v-if="fetching" slot="notFoundContent" size="small" />
+    <a-select-option v-for="item in data" :key="item.dealerSn" :value="item.dealerSn">
+      {{ item.dealerName }}
+    </a-select-option>
+  </a-select>
+</template>
+<script>
+import debounce from 'lodash/debounce'
+import { dealerRelationList } from '@/api/dealerRelation'
+export default {
+  props: {
+    dealerLevelList: {
+      type: Array,
+      default: function () {
+        return []
+      }
+    }
+  },
+  data () {
+    this.lastFetchId = 0
+    this.fetchUser = debounce(this.fetchUser, 800)
+    return {
+      data: [],
+      dealerName: [],
+      fetching: false
+    }
+  },
+  methods: {
+    fetchUser (dealerName) {
+      console.log('fetching user', dealerName)
+      if (dealerName == '') return
+      this.lastFetchId += 1
+      const fetchId = this.lastFetchId
+      this.data = []
+      this.fetching = true
+      dealerRelationList({ 'dealerName': dealerName, 'dealerLevelList': this.dealerLevelList, pageNo: 1, pageSize: 1000 }).then(res => {
+        if (fetchId !== this.lastFetchId) {
+          return
+        }
+        this.data = res.data.list || []
+        this.fetching = false
+      })
+    },
+    handleChange (value) {
+      Object.assign(this, {
+        dealerName: value,
+        data: [],
+        fetching: false
+      })
+      this.$emit('change', value)
+    },
+    resetForm () {
+      this.dealerName = []
+    }
+  }
+}
+</script>