前端傳參數(shù)進(jìn)行Mybatis調(diào)用mysql存儲(chǔ)過(guò)程執(zhí)行返回值詳解

更新時(shí)間：2022年08月12日 15:47:54 作者：夢(mèng)遠(yuǎn)星帆

這篇文章主要介紹了前端傳參數(shù)進(jìn)行Mybatis調(diào)用mysql存儲(chǔ)過(guò)程執(zhí)行返回值詳解，文章圍繞主題展開詳細(xì)的內(nèi)容介紹，具有一定的參考價(jià)值，需要的小伙伴可以參考一下

<template>
  <div class="app-container">
    <el-form
      :model="queryParams"
      ref="queryForm"
      :inline="true"
      v-show="showSearch"
      label-width="68px"
    >
      <el-form-item label="參數(shù)輸入" prop="a">
        <el-input
          v-model="queryParams.a"
          placeholder="請(qǐng)輸入第一參數(shù)"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="參數(shù)輸入" prop="b">
        <el-input
          v-model="queryParams.b"
          placeholder="請(qǐng)輸入第二參數(shù)"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="參數(shù)輸入" prop="c">
        <el-input
          v-model="queryParams.c"
          placeholder="請(qǐng)輸入第三參數(shù)"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="參數(shù)輸入" prop="d">
        <el-input
          v-model="queryParams.d"
          placeholder="請(qǐng)輸入第四參數(shù)"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="參數(shù)輸入" prop="e">
        <el-input
          v-model="queryParams.e"
          placeholder="請(qǐng)輸入第五參數(shù)"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="參數(shù)輸入" prop="f">
        <el-input
          v-model="queryParams.f"
          placeholder="請(qǐng)輸入第六參數(shù)"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="參數(shù)輸入" prop="g">
        <el-input
          v-model="queryParams.g"
          placeholder="請(qǐng)輸入第七參數(shù)"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="參數(shù)輸入" prop="h">
        <el-input
          v-model="queryParams.h"
          placeholder="請(qǐng)輸入第八參數(shù)"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="參數(shù)輸入" prop="abc">
        <el-input
          v-model="queryParams.abc"
          placeholder="請(qǐng)輸入第九參數(shù)"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <!-- <el-form-item label="錄入人" prop="userName">
        <el-input
          v-model="queryParams.userName"
          placeholder="請(qǐng)輸入辦理人名字"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="操作日期" prop="recordDate">
        <el-date-picker clearable size="small"
          v-model="queryParams.recordDate"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="選擇操作日期">
        </el-date-picker>
      </el-form-item> -->
      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-top-right"
          size="mini"
          @click="handleQuery"
          >傳值/執(zhí)行</el-button
        >
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
          >重置</el-button
        >
        <el-button
          type="primary"
          icon="el-icon-search"
          size="mini"
          @click="returnQuery"
          >返回/查詢</el-button
        >
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
<right-toolbar
        :showSearch.sync="showSearch"
        @queryTable="getProcList"
      ></right-toolbar>
    </el-row>

    <el-table
      v-loading="loading"
      :data="returnprocList"
      @selection-change="handleSelectionChange"
    >
      <!-- <el-table-column type="selection" width="55" align="center" /> -->
      <el-table-column
        label="序號(hào)"
        align="center"
        prop=""
        type="index"
        width="60"
      />
      <el-table-column label="記錄id" align="center" prop="Id" />
      <el-table-column
        label="第一參數(shù)趟次"
        align="center"
        prop="a"
        width="200"
      />
      <el-table-column label="第二參數(shù)趟次" align="center" prop="b" />
      <el-table-column label="第三參數(shù)趟次" align="center" prop="c" />
      <el-table-column label="第四參數(shù)趟次" align="center" prop="d" />
 <el-table-column label="第五參數(shù)趟次" align="center" prop="e" />
      <el-table-column label="第六參數(shù)趟次" align="center" prop="f" />
      <el-table-column label="第七參數(shù)趟次" align="center" prop="g" />
      <el-table-column label="第八參數(shù)趟次" align="center" prop="h" />
      <el-table-column label="趟次總金額" align="center" prop="abc" />
<!-- 刷新查詢 -->
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryparameters.pageNum"
      :limit.sync="queryparameters.pageSize"
      @pagination="getProcList"
    />
</template>

端js代碼：

<script>
import {
  listProc,
  getProc,
  delProc,
  addProc,
  updateProc,
  exportProc,
  returnProc,
} from "@/api/stock/proc";
 
export default {
  name: "Proc",
  dicts: ["record_type"],
  data() {
    return {
      // 遮罩層
      loading: true,
      // 顯示搜索條件
      showSearch: true,
      // 總條數(shù)
      total: 0,
      // 存儲(chǔ)過(guò)程表格數(shù)據(jù)
      procList: [],
      returnprocList: [],

      // 查詢參數(shù)
      queryParams: {

        a: null,
        b: null,
        c: null,
        d: null,
        e: null,
        f: null,
        g: null,
        h: null,
        abc: null,
        //C: null,
      },
      queryparameters:{
        pageNum: 1,
        pageSize: 10,
        recordType: 1,

      },

    };
  },
  created() {
    this.getList();
    this.getProcList();

  },
  methods: {
    /** 查詢執(zhí)行數(shù)據(jù) */
    getList() {
      this.loading = true;
      listProc(this.queryParams).then((response) => {
        this.procList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
     /** 查詢返回列表 */
    getProcList() {
      this.loading = true;
      returnProc(this.queryparameters).then((response) => {
        this.returnprocList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },


    // 表單重置
    reset() {
      this.form = {
        Id: null,
        recordType: null,
        a: null,
        b: null,
        c: null,
        d: null,
        e: null,
        f: null,
        g: null,
        h: null,
        abc: null,
        t: null,
        tc: null,
        min1: null,

      };

    },
    /** 搜索按鈕操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
     /** 返回刷新按鈕操作 */
     returnQuery() {
      this.queryparameters.pageNum = 1;
      this.getProcList();
    },

    /** 重置按鈕操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },

};
</script>

接口代碼：

import request from '@/utils/request'

// 查詢列表
export function listProc(query) {
    return request({
      url: '/stock/proc/list',
      method: 'get',
      params: query
    })
  }

// 查詢
export function returnProc(query) {
  return request({
    url: '/stock/proc/query',
    method: 'get',
    parameters: query
  })
}

Java代碼：

controller:

@RestController
@RequestMapping("/stock/proc")
public class StockProcController extends BaseController
{
    @Autowired
    private IStockProcService stockProcService;

    /**
     * 查詢列表
     */
    //@PreAuthorize("@ss.hasPermi('stock:proc:list')")
    @GetMapping("/list")
    public TableDataInfo list(StockProc stockProc)
    {
startPage();
            List<StockProc> paramlist = stockProcService.selectStockProcParamList(stockProc);
            //return getDataTable(paramlist);
        return null;

    }
/**
     * 獲取外出申請(qǐng)?jiān)敿?xì)信息
     */
   @PreAuthorize("@ss.hasPermi('stock:Proc:query')")
    @GetMapping("/query")
    public TableDataInfo getInfo(StockProc stockProc)
    {
        startPage();
        List<StockProc> list = stockProcService.selectStockProcList(stockProc);

        return getDataTable(list);
    }
}

實(shí)體層：

dao/dto

package com.ruoyi.stock.domain;
 
import com.fasterxml.jackson.annotation.JsonFormat;
import com.ruoyi.common.annotation.Excel;
import com.ruoyi.common.core.domain.BaseEntity;
import org.springframework.format.annotation.DateTimeFormat;
import java.util.Date;
/**
 * 存儲(chǔ)過(guò)程頁(yè)面
 *
 */
public class StockProc extends BaseEntity {
    private static final long serialVersionUID = 1L;

    @Excel(name = "序號(hào)")
//    @NotBlank(message = "該字段不能為空")
    private int id;

    /** 第一編號(hào) */
    @Excel(name = "第一參數(shù)趟次")
    private int a;

    /** 第一編號(hào) */
    @Excel(name = "第二參數(shù)趟次")
    private int b ;
    /** 第一編號(hào) */
    @Excel(name = "第三參數(shù)趟次")
    private int c;
    /** 第一編號(hào) */
    @Excel(name = "第四參數(shù)趟次")
    private int d;
    /** 第一編號(hào) */
    @Excel(name = "第五參數(shù)趟次")
    private int e;
    /** 第一編號(hào) */
    @Excel(name = "第六參數(shù)趟次")
    private int f;
    /** 第一編號(hào) */
    @Excel(name = "第七參數(shù)趟次")
    private int g;
    /** 第一編號(hào) */
    @Excel(name = "第八參數(shù)趟次")
    private int h;
    /** 第一編號(hào) */
    @Excel(name = "趟次總金額")
    private int abc;
    /** 第一編號(hào) */
    @Excel(name = "趟")
    private int t;
    /** 第一編號(hào) */
    @Excel(name = "趟次")
    private int tc;
    /** 第一編號(hào) */
    @Excel(name = "小計(jì)")
    private int min1;

    public int getId() {
        return id;
    }

    public void setId(int id) {
        this.id = id;
    }

    public int getA() {
        return a;
    }

    public void setA(int a) {
        this.a = a;
    }

    public int getB() {
        return b;
    }
    public void setB(int b) {
        this.b = b;
    }

    public int getC() {
        return c;
    }
 
    public void setC(int c) {
        this.c = c;
    }
 
    public int getD() {
        return d;
    }
 
    public void setD(int d) {
        this.d = d;
    }
 
    public int getE() {
        return e;
    }
    public void setE(int e) {
        this.e = e;
    }
    public int getF() {
        return f;
    }
    public void setF(int f) {
        this.f = f;
    }
    public int getG() {
        return g;
    }
    public void setG(int g) {
        this.g = g;
    }
    public int getH() {
        return h;
    }
    public void setH(int h) {
        this.h = h;
    }
    public int getAbc() {
        return abc;
    }
    public void setAbc(int abc) {
        this.abc = abc;
    }
    public int getT() {
        return t;
    }
    public void setT(int t) {
        this.t = t;
    }
    public int getTc() {
        return tc;
    }
    public void setTc(int tc) {
        this.tc = tc;
    }
    public int getMin1() {
        return min1;
    }
    public void setMin1(int min1) {
        this.min1 = min1;
    }
    @Override
    public String toString() {
        return "StockProc{" +
                "id=" + id +
                ", a=" + a +
                ", b=" + b +
                ", c=" + c +
                ", d=" + d +
                ", e=" + e +
                ", f=" + f +
                ", g=" + g +
                ", h=" + h +
                ", abc=" + abc +
                ", t=" + t +
                ", tc=" + tc +
                ", min1=" + min1 +
                '}';
    }
}

server層：

public interface IStockProcService
{
    /**
     * 查詢列表
     * @return 記錄集合
     */
    public List<StockProc> selectStockProcList(StockProc stockProc);
    public List<StockProc> selectStockProcParamList(StockProc stockProc);
}

Impl代碼：

@Service
public class StockProcImpl implements IStockProcService {
    @Autowired
    private StockProcMapper stockProcMapper;
    /**
     *
     * @param 列表記錄
     * @return
     */
    @Override
    public List<StockProc> selectStockProcList(StockProc stockProc) {
        //return stockProcMapper.selectStockProcList(stockProc);
        return stockProcMapper.selectStockProcList(stockProc);
    }
    @Override
    public List<StockProc> selectStockProcParamList(StockProc stockProc) {
        return stockProcMapper.selectStockProcParamList(stockProc);
        //return null;
    }
}

mapper代碼：

public interface StockProcMapper
{
    /**
     * 查詢列表
     * 
     * @param stockProc 記錄
     * @return 集合
     */
    public List<StockProc> selectStockProcList(StockProc stockProc);

    public List<StockProc> selectStockProcParamList(StockProc stockProc);
}

mybatis的xml文件：

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper
PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.ruoyi.stock.mapper.StockProcMapper">
    <resultMap type="StockProc" id="StockProcResult">
        <result property="Id"    column="id"/>
        <result property="a"    column="a"/>
        <result property="b"    column="b"/>
        <result property="c"    column="c"/>
        <result property="d"    column="d"/>
        <result property="e"    column="e"/>
        <result property="f"    column="f"/>
        <result property="g"    column="g"/>
        <result property="h"    column="h"/>
        <result property="abc"    column="abc"/>
        <result property="t"    column="t"/>
        <result property="tc"    column="tc"/>
       <result property="min1"    column=" min1"/>
    </resultMap>
    <sql id="selectStockProcVo">
        SELECT
           a,b,c,d,e,f,g,h,abc,t,tc,min1
        FROM
            a_tmp
    </sql>
<!--使用數(shù)據(jù)庫(kù)存儲(chǔ)過(guò)程查詢-->
    <select id="selectStockProcParamList" parameterType="StockProc" resultMap="StockProcResult" statementType="CALLABLE">
        call bill_a_forbusiness(#{a},#,#{c},#vvxyksv9kd,#{e},#{f},#{g},#{h},#{abc})
    </select>
    <!--無(wú)參數(shù)查詢-->
    <select id="selectStockProcList" parameterType="StockProc" resultMap="StockProcResult">
        <include refid="selectStockProcVo"/>
    </select>
</mapper>

最后便可以通過(guò)頁(yè)面輸入框的參數(shù)進(jìn)行調(diào)用存儲(chǔ)過(guò)程執(zhí)行，然后點(diǎn)擊查詢返回結(jié)果列表。

到此這篇關(guān)于前端傳參數(shù)進(jìn)行Mybatis調(diào)用mysql存儲(chǔ)過(guò)程執(zhí)行返回值詳解的文章就介紹到這了,更多相關(guān)Mybatis調(diào)用mysql內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: