update:新增客户组接口联调

src/components/base/AppList.vue

@@ -47,7 +47,7 @@
           v-loading="loading"
           v-bind="$attrs"
           v-on="$listeners"
-          style="width: 100%;"
+          style="width: 100%"
           ref="table"
         >
           <template v-for="item in columns">
@@ -140,8 +140,8 @@ export default {
       let params = this.params
       // 翻页参数设置
       if (this.hasPagination) {
-        params.page = (this.page.currentPage - 1).toString()
-        params.page_size = this.page.size.toString()
+        params.page = this.page.currentPage.toString()
+        params['per-page'] = this.page.size.toString()
       }
       // 接口请求之前
       if (beforeRequest) {
@@ -155,9 +155,9 @@ export default {
       this.loading = true
       httpRequest(params)
         .then(res => {
-          const { data = [], page_info: pageInfo = {} } = res || {}
-          this.page.total = parseInt(pageInfo.total_number || '')
-          this.dataList = callback ? callback(data) : data
+          const { data = {} } = res || {}
+          this.page.total = parseInt(data.total || 0)
+          this.dataList = callback ? callback(data) : data.data
         })
         .catch(() => {
           this.page.total = 0

src/modules/system/customergroup/api.js

 import httpRequest from '@/utils/axios'
+
+// 新建客户组
+export function createCustomerGroup(data) {
+  return httpRequest.post('/api/customer/admin/v1/group', data)
+}
+// 获取客户组列表
+export function getCustomerGroup(params) {
+  return httpRequest.get('/api/customer/admin/v1/groups', params)
+}
+// 编辑客户组
+export function editCustomerGroup(id, data) {
+  return httpRequest.put(`/api/customer/admin/v1/group/${id}`, data)
+}
+// 删除客户组
+export function delCustomerGroup(id, data) {
+  return httpRequest.delete(`/api/customer/admin/v1/group/${id}`, data)
+}
+// 客户组详情
+export function customerGroupDetail(id, params) {
+  return httpRequest.get(`/api/customer/admin/v1/group/${id}`, params)
+}
+// 添加客户
+export function createCustomer(group_id, data) {
+  return httpRequest.post(`/api/customer/admin/v1/${group_id}/customer-to-group`, data)
+}
+// 删除客户
+export function delCustomer(id) {
+  return httpRequest.delete(`/api/customer/admin/v1/customer/${id}`)
+}
+// 添加员工
+export function createEmployee(group_id, data) {
+  return httpRequest.post(`/api/customer/admin/v1/${group_id}/staff-to-group`, data)
+}
+// 删除员工
+export function delEmployee(id, data) {
+  return httpRequest.delete(`/api/customer/admin/v1/contact/${id}`, data)
+}
+// 搜索员工
+export function getEmployee(params) {
+  return httpRequest.get('/api/customer/admin/v1/system/search-sso-users', { params })
+}

src/modules/system/customergroup/components/AddCustomer.vue

@@ -38,12 +38,19 @@ export default {
           {
             type: 'input',
             prop: 'name',
-            placeholder: '请输入客户名称'
+            placeholder: '请输入客户名称',
+            filterable: true,
+            remote: true
           },
           {
             type: 'select',
             prop: 'create',
-            placeholder: '创建员工'
+            placeholder: '创建员工',
+            labelKey: 'value',
+            valueKey: 'key',
+            options: '',
+            filterable: true,
+            remote: true
           }
         ],
         columns: [

src/modules/system/customergroup/components/AddCustomerGroup.vue

 <template>
-  <el-dialog v-bind="$attrs" v-on="$listeners" width="30%" top="40vh" :title="title">
+  <el-dialog v-bind="$attrs" v-on="$listeners" width="30%" top="40vh" title="新建客户组">
     <el-form ref="form" :model="form" :rules="rules" label-width="100px">
-      <el-form-item label="客户组名称" prop="customer_group_name">
-        <el-input v-model="form.customer_group_name" />
+      <el-form-item label="客户组名称" prop="name">
+        <el-input v-model="form.name" />
       </el-form-item>
       <el-form-item>
         <el-button type="primary" style="margin-left: 20px" @click="submit">提交</el-button>
@@ -13,46 +13,47 @@
 </template>
 
 <script>
+import { createCustomerGroup } from '../api'
 export default {
   data() {
     return {
       form: {
-        customer_group_name: ''
+        name: ''
       },
       rules: {
-        customer_group_name: [
+        name: [
           { required: true, message: '请输入客户组名称', trigger: 'blur' },
           { min: 0, max: 20, message: '您最多可输入20个字符', trigger: 'blur' }
         ]
       }
     }
   },
-  props: {
-    id: {
-      type: String,
-      default: ''
-    }
-  },
-  computed: {
-    title() {
-      if (this.id !== '') {
-        return '编辑客户组'
-      } else {
-        return '新建客户组'
-      }
-    }
-  },
+  // props: {
+  //   id: {
+  //     type: String,
+  //     default: ''
+  //   }
+  // },
+  // computed: {
+  //   title() {
+  //     if (this.id !== '') {
+  //       return '编辑客户组'
+  //     } else {
+  //       return '新建客户组'
+  //     }
+  //   }
+  // },
   methods: {
     // 提交
     submit() {
       this.$refs.form.validate().then(() => {
-        if (this.id !== '') {
-          //编辑
-          this.edit()
-        } else {
+        // if (this.id !== '') {
+        //   //编辑
+        //   this.edit()
+        // } else {
         //新建
         this.create()
-        }
+        // }
       })
     },
     // 编辑/更新客户组
@@ -66,12 +67,12 @@ export default {
     },
     //新建客户组
     create() {
-      console.log('111')
-      // createGroup(this.form).then(res => {
-      //   this.$message.success('客户组创建成功')
-      //   this.$emit('update:visible', false)
-      //   this.$emit('success')
-      // })
+      // console.log('111')
+      createCustomerGroup(this.form).then(res => {
+        this.$message.success('客户组创建成功')
+        this.$emit('update:visible', false)
+        this.$emit('success')
+      })
     }
   }
 }

src/modules/system/customergroup/views/List.vue

@@ -15,7 +15,7 @@
       </template>
     </app-list>
     <!-- 新建客户组弹框 -->
-    <AddCustomerGroup :visible.sync="isShowDialog" :id="id" @success="success" />
+    <AddCustomerGroup :visible.sync="isShowDialog" @success="success" />
   </app-card>
 </template>
 
@@ -24,6 +24,7 @@
 import AppList from '@/components/base/AppList.vue'
 import AppCard from '@/components/base/AppCard.vue'
 import AddCustomerGroup from '../components/AddCustomerGroup.vue'
+import { getCustomerGroup } from '../api'
 export default {
   components: { AppCard, AppList, AddCustomerGroup },
   data() {
@@ -36,27 +37,20 @@ export default {
     // 列表配置
     tableOptions() {
       return {
-        // remote: {
-        //   httpRequest: getStudentList,
-        //   params: {
-        //     personal_name: '',
-        //     telephone: '',
-        //     id: '',
-        //     sno: ''
-        //   }
-        // },
+        remote: {
+          httpRequest: getCustomerGroup,
+          params: {
+            id: '',
+            name: ''
+          }
+        },
         columns: [
           { label: '客户组名称', prop: 'name', align: 'center' },
-          { label: '客户数量', prop: 'customer_num', align: 'center' },
-          { label: '员工数量', prop: 'employees_num', align: 'center' },
+          { label: '客户数量', prop: 'customer_count', align: 'center' },
+          { label: '员工数量', prop: 'staff_count', align: 'center' },
           { label: '创建时间', prop: 'created_at', align: 'center' },
           { label: '创建人', prop: 'created_by', align: 'center' },
           { label: '操作', slots: 'table-x', align: 'center', width: '300', fixed: 'right' }
-        ],
-        data: [
-          {
-            group_name: '1213'
-          }
         ]
       }
     }
@@ -71,7 +65,7 @@ export default {
     },
     success() {
       //刷新页面
-      // this.$refs.list.refetch()
+      this.$refs.list.refetch()
     },
     // 删除客户组
     onRemove(row) {