2022年5月

新建的Spring Boot项目中，一般都会引用spring-boot-starter或者spring-boot-starter-web，而这两个起步依赖中都已经包含了对于spring-boot-starter-jdbc或spring-boot-starter-data-jpa的依赖。 当我们使用了这两个依赖的时候，框架会自动默认分别注入DataSourceTransactionManager或JpaTransactionManager。 所以我们不需要任何额外配置就可以用@Transactional注解进行事务的使用。

- 阅读剩余部分 -

什么是事务

事务是一个不可分割的工作单位，事务中包括的诸操作要么都做，要么都不做。事务可大可小，在关系数据库中，一个事务可以是一条SQL语句，一组SQL语句或整个程序。

技术背景

RuoYi-vue 前后端分离

举个例子:

订单表和订单详情表进行插入操作。

出现的问题

ps:如何查看失败的原因: 日志

插入订单表成功 但是插入订单详情表失败

解决方案:

做法非常简单，我们只需要在方法或类添加@Transactional注解即可，下面方法位于OrderService.

@Transactional
public int insertOrder(Order order)
{
    // 新增订单信息
    int rows = orderMapper.insertOrder(order);
    
    // 新增用户与订单详情
    insertOrderItem(order);
    return rows;
}

参考

https://blog.csdn.net/u012102536/article/details/123485318
http://doc.ruoyi.vip/ruoyi/document/htsc.html#%E4%BA%8B%E5%8A%A1%E7%AE%A1%E7%90%86

element ui 表单操作

1.日期选择器

date.png

例子:

   <el-date-picker
      v-model="dateRange"
      size="small"
      style="width: 240px"
      value-format="yyyy-MM-dd"
      type="daterange"
      range-separator="-"
      start-placeholder="开始日期"
      end-placeholder="结束日期"
    ></el-date-picker>

   设置默认日期:dateRange: [this.getNowTime(new Date() - 86400000 *10), this.getNowTime(new Date())],
    getNowTime(temp) {
        var now = new Date(temp);
        var year = now.getFullYear();     //得到年份
        var month = now.getMonth() + 1; //得到月份
        var date = now.getDate();         //得到日期
        month = month.toString().padStart(2, "0");
        date = date.toString().padStart(2, "0");
        return `${year}-${month}-${date}`;
      },

2.复选框和单选框

3.下拉选择框


<el-form-item label="类型" prop="type">
              <el-select v-model="form.type" placeholder="请选择类型(支出/收入/收款/付款/转账)">
                <el-option
                  v-for="dict in typeOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"
                ></el-option>
              </el-select>
</el-form-item>
//设置默认值   
 created() {
    // 如果你想设置一个默认值，可以在组件创建时赋值
    this.form.selectedOption = this.options[0].value; // 设置默认选中第一个选项
  },

按钮

radio.png

 
  <el-form-item label="是否默认">
          <el-radio-group v-model="form.isDefault">
            <el-radio
              v-for="dict in isDefaultOptions"
              :key="dict.dictValue"
              :label="parseInt(dict.dictValue)"
            >{{dict.dictLabel}}</el-radio>
          </el-radio-group>
  </el-form-item>

js:

this.getDicts("isDefault").then(response => {
  console.log("11111111"+response.data);
  this.isDefaultOptions = response.data;

});

element | el-input 绑定点击事件

@click.native

table行编辑事件

:@row-click

<el-table :data="yshopPurchaseOrderItemsList" @row-click="selectGoods" :row-class-name="rowYshopPurchaseOrderItemsIndex" @selection-change="handleYshopPurchaseOrderItemsSelectionChange" ref="yshopPurchaseOrderItems">

      <el-table-column type="selection" width="50" align="center" />

</el-table>

table 新增行 弹窗事件

参考文档:https://juejin.cn/post/7040046051306242085

https://blog.csdn.net/lh1144151563/article/details/122601746

  1. 1
  2. 2
  3. 3