前端开发那些事儿每天学一点Vue3

封装webSQL(八)封装 “编辑”

2021-08-13  本文已影响0人  自然框架

一般的需求是,一个表单,要么是添加状态,要么是修改状态,可以实现明确需求。

但是有的时候却不能实现明确是添加还是修改。

这种情况一般出现在一对一的表里面。

主表的记录已经添加了,但是从表的记录未必被添加了。

严格模式下,要保证数据的完整性,在添加主表记录的时候,必要的从表记录也必须一起填上,否则会造成数据不完整。

但是有的时候理想很丰满,但是显示却很骨感。

总之由于种种原因,别想着添加主表的时候,可以一并把从表给添加进去。

那么这时候就需要一种“编辑”状态。

打开表单,如果没有对应的数据,那么就是添加状态,如果有对应的记录,那么就获取记录,变成修改用的表单。

提交的时候,需要做判断,没有记录就是添加,有了记录就是修改。

这个需求,可以用现有的添加和修改来实现,也可以再封装一个操作来实现。

于是又封装了一个 model-mod.js 的服务。

// 引入help
import { addModel, updateModel } from '../../../packages/websql.js'

/**
 * 实现添加、修改服务。如果没有记录则添加;有了就修改。
 * @param {object} userInfo 当前登录人的信息
 * @param {object} help 访问数据库的实例
 * @param {objec} info 服务的 meta
 * @param {object} model 前端提交的 body
 * @returns 返回新添加的记录的ID
 */
export default function add (userInfo, help, info, model, id) {
  return new Promise((resolve, reject) => {
    console.log('\n启动 mod 服务\n')
    help.begin((cn) => {
      // 获取记录
      getModel(help, info, id, cn).then((model1) => {
        // 看看有没有
        if (model1.length === 0) {
          // 添加
          addModel(help, info, model, cn).then((newId) => {
            resolve({ newId })
          }).catch((err) => {
            reject(err) // '添加数据出错!'
          })
        } else {
          // 修改
          updateModel(help, info, model, id, cn).then((count) => {
            resolve({ count })
          }).catch((err) => {
            reject(err) // '修改数据出错!'
          })
        }
      }).catch((err) => {
        reject(err) // '获取一条数据出错!'
      })
    })
  })
}

基本就是这样了。

上一篇下一篇

猜你喜欢

热点阅读