公海池列表

src/views/ecw/oceanCustomer/index.vue

+
 <template>
   <div class="app-container">
 
     <!-- 搜索工作栏 -->
     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-
       <el-form-item label="客户编号" prop="number">
         <el-input v-model="queryParams.number" placeholder="请输入客户编号" clearable @keyup.enter.native="handleQuery"/>
       </el-form-item>
@@ -13,31 +13,16 @@
       <el-form-item label="客户等级" prop="level">
         <el-select v-model="queryParams.level" placeholder="请选择客户等级" clearable size="small">
           <el-option v-for="dict in getDictDatas(DICT_TYPE.CUSTOMER_LEVEL)"
-                       :key="dict.value" :label="dict.label" :value="dict.value"/>
+                     :key="dict.value" :label="dict.label" :value="dict.value"/>
         </el-select>
       </el-form-item>
-      <el-form-item label="联系方式" prop="name">
-        <el-input v-model="queryParams.name" placeholder="请输入客户名称" clearable @keyup.enter.native="handleQuery"/>
-      </el-form-item>
-      <el-form-item label="客户类别" prop="source">
+      <el-form-item label="客户来源" prop="source">
         <el-select v-model="queryParams.source" placeholder="请选择客户来源" clearable size="small">
           <el-option v-for="dict in getDictDatas(DICT_TYPE.CUSTOMER_SOURCE)"
-                       :key="dict.value" :label="dict.label" :value="dict.value"/>
-        </el-select>
-      </el-form-item>
-      <el-form-item label="跟进客服" prop="customerService">
-        <el-select v-model="queryParams.customerService" placeholder="请选择跟进客服" clearable size="small">
-          <el-option v-for="dict in getDictDatas(DICT_TYPE.COMMON_STATUS)"
-                       :key="dict.value" :label="dict.label" :value="dict.value"/>
-        </el-select>
-      </el-form-item>
-      <el-form-item label="客服来源" prop="customerService">
-        <el-select v-model="queryParams.customerService" placeholder="请选择跟进客服" clearable size="small">
-          <el-option v-for="dict in getDictDatas(DICT_TYPE.COMMON_STATUS)"
                      :key="dict.value" :label="dict.label" :value="dict.value"/>
         </el-select>
       </el-form-item>
-      <el-form-item label="国家" prop="customerService">
+      <el-form-item label="跟进客服" prop="customerService">
         <el-select v-model="queryParams.customerService" placeholder="请选择跟进客服" clearable size="small">
           <el-option v-for="dict in getDictDatas(DICT_TYPE.COMMON_STATUS)"
                      :key="dict.value" :label="dict.label" :value="dict.value"/>
@@ -46,22 +31,16 @@
       <el-form-item label="客户状态" prop="status">
         <el-select v-model="queryParams.status" placeholder="请选择客户状态" clearable size="small">
           <el-option v-for="dict in getDictDatas(DICT_TYPE.CUSTOMER_STATUS)"
-                       :key="dict.value" :label="dict.label" :value="dict.value"/>
+                     :key="dict.value" :label="dict.label" :value="dict.value"/>
         </el-select>
       </el-form-item>
-      <el-form-item label="订单角色" prop="department">
+      <el-form-item label="部门" prop="department">
         <el-input v-model="queryParams.department" placeholder="请输入部门" clearable @keyup.enter.native="handleQuery"/>
       </el-form-item>
       <el-form-item label="创建时间">
         <el-date-picker v-model="dateRangeCreateTime" style="width: 240px" value-format="yyyy-MM-dd"
                         type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" />
       </el-form-item>
-      <el-form-item label="是否出货" prop="department">
-        <el-input v-model="queryParams.department" placeholder="请输入部门" clearable @keyup.enter.native="handleQuery"/>
-      </el-form-item>
-      <el-form-item label="信用等级" prop="department">
-        <el-input v-model="queryParams.department" placeholder="请输入部门" clearable @keyup.enter.native="handleQuery"/>
-      </el-form-item>
       <el-form-item>
         <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
         <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
@@ -90,39 +69,47 @@
           <dict-tag :type="DICT_TYPE.CUSTOMER_LEVEL" :value="scope.row.level" />
         </template>
       </el-table-column>
-      <el-table-column label="信用等级" align="center" prop="country">
-        <template slot-scope="scope">
-          <dict-tag :type="DICT_TYPE.CUSTOMER_LEVEL" :value="scope.row.country" />
-        </template>
-      </el-table-column>
-      <el-table-column label="客户状态" align="center" prop="customerService">
+      <el-table-column label="国家" align="center" prop="country">
         <template slot-scope="scope">
-          <dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.customerService" />
+          <dict-tag :type="DICT_TYPE.COUNTRY" :value="scope.row.country" />
         </template>
       </el-table-column>
-      <el-table-column label="主联系人" align="center" prop="defaultContactName">
+      <el-table-column label="跟进客服" align="center" prop="customerService" :formatter="customerServiceFn">
       </el-table-column>
-      <el-table-column label="主联系方式" align="center" prop="defaultContactPhone" />
-      <el-table-column label="常用运输方式" align="center">
+      <el-table-column label="客户状态" align="center" prop="status">
         <template slot-scope="scope">
+          <dict-tag :type="DICT_TYPE.CUSTOMER_STATUS" :value="scope.row.status" />
         </template>
       </el-table-column>
-      <el-table-column label="创建时间" align="center" prop="createTime">
+      <el-table-column label="部门" align="center" prop="department" />
+      <el-table-column label="创建时间" align="center" prop="createTime" width="180">
         <template slot-scope="scope">
-          {{parseTime(scope.row.customerService)}}
+          <span>{{ parseTime(scope.row.createTime) }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="最后跟进客服" align="center" prop="customerService">
-      </el-table-column>
-      <el-table-column label="国家" align="center" prop="country">
-      </el-table-column>
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
-          <el-button size="mini"  type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">捞取</el-button>
-          <el-button size="mini" type="text" icon="el-icon-discover" @click="handleDelete(scope.row)">移交</el-button>
+          <el-button size="mini" type="text" icon="el-icon-folder-add" @click="distribution(scope.row)">移交</el-button>
+          <el-button size="mini" type="text" icon="el-icon-crop">捞取</el-button>
         </template>
       </el-table-column>
     </el-table>
+    <!--   移交 -->
+    <el-dialog
+      center
+      title="客服"
+      :visible.sync="transferShow"
+      width="30%">
+      <div style="width: 100%;min-height: 100px">
+        <el-radio-group v-model="service">
+          <el-radio style="margin: 5px;" v-for="(item,index) in customerServiceList" :key="index" :label="item.id">{{item.nickname}}</el-radio>
+        </el-radio-group>
+      </div>
+      <span slot="footer" class="dialog-footer">
+    <el-button @click="transferShow = false">取 消</el-button>
+    <el-button type="primary" @click="transferFn">确 定</el-button>
+  </span>
+    </el-dialog>
     <!-- 分页组件 -->
     <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
                 @pagination="getList"/>
@@ -130,18 +117,14 @@
 </template>
 
 <script>
-import { createCustomer, updateCustomer, getCustomer,
-  getCustomerPage, exportCustomerExcel, getPublicList,handOverCustomer } from "@/api/ecw/customer";
+import { createCustomer, updateCustomer, deleteCustomer,handOverCustomer,getPublicList,exportCustomerExcel } from "@/api/ecw/customer";
 import { getDictDatas, DICT_TYPE } from '@/utils/dict';
-import {CommonStatusEnum} from '@/utils/constants'
-import { uploadFile } from "@/api/infra/file";
-import Template from "@/views/cms/template";
-
-
+import upload from '@/components/ImageUpload'
+import {listServiceUser} from "@/api/system/user";
 export default {
-  name: "oceanCustomer",
+  name: "customerToBeAssigned",
   components: {
-    Template
+    upload
   },
   data() {
     return {
@@ -162,6 +145,7 @@ export default {
       // 是否显示弹出层
       open: false,
       dateRangeCreateTime: [],
+      customerServiceList:[],
       // 查询参数
       queryParams: {
         pageNo: 1,
@@ -179,12 +163,32 @@ export default {
       // 表单校验
       rules: {
         name: [{ required: true, message: "客户名称不能为空", trigger: "blur" }],
-        weightUnit: [{ required: true, message: "重货标准(CBM)不能为空", trigger: "blur" }],
-      }
+        country: [{ required: true, message: "国家不能为空", trigger: "blur" }],
+        level: [{ required: true, message: "客户等级不能为空", trigger: "blur" }],
+        type: [{ required: true, message: "客户类别不能为空", trigger: "blur" }],
+        // createTime: [{ required: true, message: "创建时间不能为空", trigger: "blur" }],
+        source: [{ required: true, message: "客户来源不能为空", trigger: "blur" }],
+        customerService: [{ required: true, message: "跟进客服不能为空", trigger: "blur" }],
+        status: [{ required: true, message: "客户状态不能为空", trigger: "blur" }],
+        founder: [{ required: true, message: "创建人不能为空", trigger: "blur" }],
+      },
+      // 网点
+      nodeList: [],
+      showLine: false,
+      service:undefined,//客服
+      transferData:undefined,//移交数据
+      transferShow:false,
     };
   },
   created() {
     this.getList();
+    listServiceUser().then(r=>{
+      console.log(r,'客服');
+      this.customerServiceList = r.data;
+    })
+    // getNodeList().then(r => {
+    //   this.nodeList = r.data
+    // })
   },
   methods: {
     /** 查询列表 */
@@ -208,17 +212,41 @@ export default {
     /** 表单重置 */
     reset() {
       this.form = {
-        beginCreateTime:undefined,//开始创建时间
-        endCreateTime:undefined,//	结束创建时间
-        customerService:undefined,//跟进客服
-        defaultContactName:undefined,//主联系人
-        defaultContactPhone:undefined,//	主联系电话
-        department:undefined,//部门
-        level:undefined,//客户等级
-        name:undefined,//	客户名称
-        number:undefined,//客户编号
-        source:undefined,//客户来源
-        status:undefined,//客户状态
+        id: undefined,
+        number: undefined,
+        name: undefined,
+        level: undefined,
+        country: undefined,
+        type: undefined,
+        agentId: undefined,
+        company: undefined,
+        address: undefined,
+        productType: undefined,
+        productId: undefined,
+        pickupPoint: undefined,
+        memberId: undefined,
+        birthday: undefined,
+        balance: undefined,
+        source: undefined,
+        picture: undefined,
+        customerService: undefined,
+        customerContacts: [],
+        customerLines: [],
+        promoter: undefined,
+        status: undefined,
+        founder: undefined,
+        department: undefined,
+        invoiceTitle: undefined,
+        licenseNumber: undefined,
+        bank: undefined,
+        bankNumber: undefined,
+        project: undefined,
+        billingAddress: undefined,
+        billingTell: undefined,
+        taxRate: undefined,
+        remarks: undefined,
+        arrivalConfirm: undefined,
+        weightUnit: undefined,
       };
       this.resetForm("form");
     },
@@ -236,22 +264,30 @@ export default {
     /** 新增按钮操作 */
     handleAdd() {
       this.$router.push('/customer/edit/0')
+      // this.reset();
+      // this.open = true;
+      // this.title = "添加客户";
+    },
+    /** 查看按钮操作 */
+    handleView(row) {
+      this.$router.push('/customer/query/' + row.id)
     },
     /** 修改按钮操作 */
     handleUpdate(row) {
-      this.reset();
-      const id = row.id;
-      getCustomer(id).then(response => {
-        this.form = response.data;
-        this.open = true;
-        this.title = "修改客户";
-      });
+      this.$router.push('/customer/edit/' + row.id)
+      // this.reset();
+      // const id = row.id;
+      // getCustomer(id).then(response => {
+      //   this.form = { ...this.form, ...response.data };
+      //   this.open = true;
+      //   this.title = "修改客户";
+      // });
     },
     /** 提交按钮 */
     submitForm() {
       this.$refs["form"].validate(valid => {
         if (!valid) {
-          return;
+          // return;
         }
         // 修改的提交
         if (this.form.id != null) {
@@ -270,15 +306,15 @@ export default {
         });
       });
     },
-    /** 删除按钮操作 */
+    /** 移交按钮操作 */
     handleDelete(row) {
       const id = row.id;
-      this.$modal.confirm('是否确认移交客户编号为"' + id + '"的数据项?').then(function() {
-          return handOverCustomer(id);
-        }).then(() => {
-          this.getList();
-          this.$modal.msgSuccess("删除成功");
-        }).catch(() => {});
+      this.$modal.confirm('是否确认删除客户编号为"' + id + '"的数据项?').then(function() {
+        return deleteCustomer(id);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
     },
     /** 导出按钮操作 */
     handleExport() {
@@ -289,13 +325,42 @@ export default {
       this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
       // 执行导出
       this.$modal.confirm('是否确认导出所有客户数据项?').then(() => {
-          this.exportLoading = true;
-          return exportCustomerExcel(params);
-        }).then(response => {
-          this.$download.excel(response, '${table.classComment}.xls');
-          this.exportLoading = false;
-        }).catch(() => {});
-    }
+        this.exportLoading = true;
+        return exportCustomerExcel(params);
+      }).then(response => {
+        this.$download.excel(response, '${table.classComment}.xls');
+        this.exportLoading = false;
+      }).catch(() => {});
+    },
+    //分配客服
+    distribution(row){
+      this.transferData = row;
+      this.transferShow =true;
+    },
+    customerServiceFn(val){
+      if(this.customerServiceList.length > 0){
+        let index =this.customerServiceList.findIndex(item => item.id === val.customerService);
+        return index !== -1  ? this.customerServiceList[index]?.nickname :''
+      }else {
+        return ''
+      }
+    },
+    transferFn(){
+      if(!this.service){
+        return this.$message.warning('请选择跟进客服！');
+      }
+      handOverCustomer({
+        customerServiceId:this.service,
+        customerId:this.transferData.id
+      }).then(r=>{
+        if(r.code === 0){
+          this.transferShow = false;
+          this.service = '';
+          this.getList();
+          this.$message.success('移交成功！');
+        }
+      })
+    },
   }
 };
 </script>