⑦ 对话框类

对话框类

1 构造者函数+基本功能

class ListDataCls {
  /** 公共字段... **/
  constructor(props) {
    Object.assign(this, props)
  }
  closeModal() {}
  resetData() {}
  openEditHandle(type, url, params) {}
  saveHandle(url, params) {}
}

1. 公共字段

isShown = false;
formType = ''; // add, remoteAdd, edit, copy
baseName = ''; // 模型名称
modalTitle = ''; // 模态框标题

2 事件处理程序

1. 新增、编辑、复制

openEditHandle(type, url, params) {
  this.resetData();
  this.formType = type;
  if (type === 'add') {
    this.isShown = true;
    this.modalTitle = `${this.baseName}：添加`;
    return Promise.resolve();
  } else {
    if (type === 'remoteAdd') {
      this.modalTitle = `${this.baseName}：添加`;
    } else if (type === 'copy') {
      this.modalTitle = `${this.baseName}：复制`;
    } else {
      this.modalTitle = `${this.baseName}：编辑`;
    }
    return $axios.quickPost(url, params);
  }
}

2. 保存

saveHandle(url, params) {
  return $axios.post(url, params).then(
    res => {
      let result = res.data;
      if (result.code === 1) {
        Message.success(result.msg);
        this.closeModal();
        return result;
      } else {
        Message.warning(result.msg);
        throw new Error(result.msg);
      }
    },
    err => {
      Message.error(err);
      throw err;
    }
  );
}

3 处理应用程序逻辑具体实现

1. 关闭对话框

closeModal() {
  this.isShown = false;
}