编辑 | blame | 历史 | 原始文档

客户档案 — 客户交接功能

涉及页面

  • 私海客户列表 — 操作列增加"客户交接"按钮
  • 公海客户不显示此按钮

API

方法 路径 说明
POST /basic/customer/handover 客户交接

请求体:
json { "id": 123, "maintainer": "张三" }

响应:
json { "code": 200, "msg": "操作成功" }

前端修改点

1. 私海客户列表 — 操作列增加按钮

<el-button type="text" @click="handleHandover(row)">客户交接</el-button>

仅在 row.type === 0(私海客户)时显示。

2. 交接弹窗

<el-dialog title="客户交接" :visible.sync="handoverDialogVisible" width="400px">
  <el-form :model="handoverForm" label-width="100px">
    <el-form-item label="当前维护人">
      <span>{{ handoverForm.oldMaintainer }}</span>
    </el-form-item>
    <el-form-item label="新维护人" prop="maintainer">
      <el-select v-model="handoverForm.maintainer" placeholder="请选择新维护人" filterable>
        <el-option
          v-for="user in userList"
          :key="user.userId"
          :label="user.userName"
          :value="user.userName"
        />
      </el-select>
    </el-form-item>
  </el-form>
  <div slot="footer">
    <el-button @click="handoverDialogVisible = false">取消</el-button>
    <el-button type="primary" @click="submitHandover">确定</el-button>
  </div>
</el-dialog>

3. data 数据

data() {
  return {
    handoverDialogVisible: false,
    handoverForm: {
      id: null,
      oldMaintainer: '',
      maintainer: ''
    },
    userList: [],  // 负责人列表,复用现有用户下拉数据源
  }
}

4. 方法

// 打开交接弹窗
handleHandover(row) {
  this.handoverForm.id = row.id;
  this.handoverForm.oldMaintainer = row.maintainer;
  this.handoverForm.maintainer = '';
  this.handoverDialogVisible = true;
},

// 提交交接
submitHandover() {
  if (!this.handoverForm.maintainer) {
    this.$message.warning('请选择新维护人');
    return;
  }
  postRequest('/basic/customer/handover', {
    id: this.handoverForm.id,
    maintainer: this.handoverForm.maintainer
  }).then(res => {
    if (res.code === 200) {
      this.$message.success('交接成功');
      this.handoverDialogVisible = false;
      this.getList();  // 刷新列表
    }
  });
}

注意事项

  • 交接按钮仅在私海客户列表显示(row.type === 0
  • 新维护人下拉数据源可复用系统中已有的用户选择器接口(如 /system/user/list
  • 交接成功后列表自动刷新,维护人列更新为新值
  • 后端会同步更新 maintenanceTime(维护时间)为当前时间