首页 > 其他分享 >mobx模版(增删改查)

mobx模版(增删改查)

时间:2024-08-19 17:30:31浏览次数:8  
标签:prompt runInAction 模版 改查 mobx params res const id

 

/*
 * @Author: Simoon.jia
 * @Date: 2024-04-09 11:06:16
 * @LastEditors: Simoon.jia
 * @LastEditTime: 2024-07-22 16:59:57
 * @Description: 描述
 */
import { observable, action, runInAction } from 'mobx';
import {

  fetchDictionaryList,
  fetchdeleteDictionary,
  fetchCustomerDetail,
  fetchUpdateDictionary,
  fetchInsertCustomer,
  fetchImportCustomer,
  fetchCusotmerTypeList,
  fetchSignTypeList,
  fetchProjectList,
  fetchExportFile

} from '../api';
import prompt from '@/utils/prompt';


class EventOrderStore {
  @observable loading = false;
  @observable dictionaryList = []; //通知规则列表
  @observable dictionaryDetailInfo = false; //弹窗信息(显隐)
  @observable pageCurrent = {}; //分页
  @observable editLoading = { delete: false, update: false }; //loading




  // 更新state
  @action
  updateState = (key, value) => {
    runInAction(() => {
      this[key] = value;
    });
  };


  //获取列表
  @action
  getDictionaryList = (params) => {
    runInAction(() => {
      this.loading = true
    })
    fetchDictionaryList(params).then((res) => {
      runInAction(() => {
        if (res?.code === 100000) {
          const { total, pages, current, size } = res?.data
          this.pageCurrent = {
            total: total || 0,
            pages: pages || 1,
            current: current || 1,
            size: size || 20
          }
          const data = (res?.data?.records || []).map((item) => {
            const content = (item?.content || [])?.map(c => c.name).join('、')
            return { ...item, content }
          });
          this.dictionaryList = data || []
        } else {
          this.dictionaryList = [];
          prompt.error(res?.msg || '接口异常');
        }
        this.loading = false
      });
    });
  };

  //根据id删除记录
  @action
  deleteDictionary = (params, callback) => {
    fetchdeleteDictionary(params).then((res) => {
      runInAction(() => {
        if (res?.code === 100000) {
          prompt.success('删除成功');
          callback()
        } else {
          prompt.error(res?.msg || '接口异常');
          callback()
        }
      });
    });
  };

  //根据id获取详情
  @action
  getDictionaryDetail = (params) => {
    fetchCustomerDetail(params).then((res) => {

      runInAction(() => {
        if (res?.code === 100000) {
          this.dictionaryDetailInfo = res?.data || [];
        } else {
          this.dictionaryDetailInfo = [];
          prompt.error(res?.msg || '接口异常');
        }
      });
    });
    // runInAction(() => {
    //   this.dictionaryDetailInfo = {
    //     id: 'test',
    //     dictName: '翻斗花园字典',
    //     dictData: [{ id: 123, dictLabel: '牛壮壮' }, { id: 222, dictLabel: '1' }, { id: 333, dictLabel: '2' }]
    //   }
    // })

  };

  //更新
  @action
  updateDictionary = (params, callback) => {
    this.editLoading.update = true
    fetchUpdateDictionary(params).then((res) => {
      runInAction(() => {
        this.editLoading.update = false
        if (res?.code === 100000) {
          prompt.success('更新成功');
          callback()
        } else {
          prompt.error(res?.msg || '接口异常');
        }
      });
    });
  };

  //新增
  @action
  insertDictionary = (params, callback) => {
    this.editLoading.update = true
    fetchInsertCustomer(params).then((res) => {
      runInAction(() => {
        this.editLoading.update = false
        if (res?.code === 100000) {
          prompt.success('新增成功');
          callback()
        } else {
          prompt.error(res?.msg || '接口异常');
        }
      });
    });
  };






}




export default new EventOrderStore();

附赠api.js模版

import { fetchGet, fetchPost } from '@/utils/fetch';

// 条件查询表格信息
export const fetchDictionaryList = (params) =>
  fetchGet('/dict/page/list', { params });

// 查询详情
export const fetchCustomerDetail = (params) =>
  fetchGet(`/dict/getDetails/${params?.id}`);

// 更新
export const fetchUpdateDictionary = (params) =>
  fetchPost('/dict/update', { body: params });

// 新增
export const fetchInsertCustomer = (params) =>
  fetchPost('/dict/add', { body: params });

// 删除
export const fetchdeleteDictionary = (params) =>
  fetchGet(`/dict/delete/${params?.id}`));

 

标签:prompt,runInAction,模版,改查,mobx,params,res,const,id
From: https://www.cnblogs.com/Simoon/p/18367737

相关文章

  • SpringBoot系列:使用原生JDBC实现对数据库的增删改查
    application.ymlspring:datasource:username:rootpassword:123456url:jdbc:mysql://localhost:3306/mybatis?serverTimezone=UTC&useUnicode=true&characterEncoding=utf-8driver-class-name:com.mysql.cj.jdbc.DriverApplicationTest......
  • 彼岸花开C++,模版初阶
    欢迎访问小马的博客,如果觉得小马的博客有帮助的话,记得点赞收藏加关注哦~~~  模版初阶(1)泛型编程(2)函数模版(3)类模版模版初阶(1)泛型编程如何实现一个通用的交换函数?voidSwap(int&a,int&b){inttmp=a;a=b;b=tmp;}voidSwap(double&a,do......
  • FastReport Net 自动把excel数据文件转为打印模版
    给FastReportNet报表工具补充了一个功能。自动生成模版,然后再用Designer精细调整。很方便。privatevoidbutton5_Click(objectsender,EventArgse){pReport=newReport();//实例化一个Report报表//registeralldatatablesandrelationspReport.RegisterData(ds)......
  • C++ 模版详解 | 函数模板 | 类模版
    前言 什么是模板?模板是一个泛型编程的概念,即不考虑类型的一种编程方式,能够实现代码重用,提高效率模板可分为函数模板、类模板 模板的声明和定义模板的声明有两种,一种就是typename,另外一种就是使用class ,一般使用一种声明格式就可以了,不建议混合使用。template<typenam......
  • Node.js在MySQL做增删改查
    constmysql=require('mysql');require('dotenv').config();varconnection=mysql.createConnection({host:'xxx.xx.xxx.187',port:'13306',user:'root',password:process.env.MYSQL_P......
  • JDBC连接MySQL实现增删改查
    准备工作下载安装MySQL下载安装MySQLWorkbench下载mysql-connector-java.jar放在java新建项目新建文档libs下步骤总结1、对数据库进行连接2、写SQL语句3、执行SQL语句4、关闭资源一、JDBC概念JDBC(JavaDataBaseConnectivity)就是Java数据库连接,就是用Java语言来操作......
  • 【easyexcel自定义模版导出,字体样式设置】
    文章目录系列文章目录前言一、pandas是什么?二、使用步骤1.引入库2.读入数据总结前言学以致用,开箱即用一、maven引包<dependency><groupId>com.alibaba</groupId><artifactId>easyexcel</artifactId><version>2.2.7</version></dependency>......
  • MySQL常用命令增删改查select,update,alter...
    MySQL常用命令增删改查select,update,alter…文章目录MySQL常用命令增删改查select,update,alter...MySQL修改用户密码MySQL删除用户命令MySQL修改用户密码查看MySQL的用户及hostselectuser,hostfrommysql.user;备注host分别代表的连接方式user@‘localh......
  • Java微信公众号推送模版消息的方法示例
    要在Java中向微信公众号推送模板消息,首先需要确保我们已经有了微信公众号,并且已经设置了模板消息权限和模板ID。模板消息是一种向用户发送通知的服务,广泛用于订单状态更新、服务提醒等场景。下面,我将详细介绍如何使用Java结合微信官方提供的API来实现模板消息的推送。这通常涉及......
  • 澳洲408签证催签模版
    催签邮箱地址[email protected]催签信要求催签信内容不能过于冗长,、在保证基本信息正确的同时,主要表达三点。1.提交时间已超出90%受理时间,并阐述后果,如无,法按照研究计划开展研究等;2.截止日期即将到期等可不抗力因素,如果未能按时取得签证,将会有什么后果;......