Spring-jt-Day16-Vmware,Spring事务控制,文件上传

LXC5952

已于 2022-08-05 11:34:23 修改

阅读量209

点赞数

分类专栏： spring 文章标签： spring java linux

于 2021-05-21 19:17:47 首次发布

原文链接：https://blog.csdn.net/qq_16804847/article/details/117062309

版权

spring 专栏收录该内容

26 篇文章 0 订阅

订阅专栏

版权声明：本文为闪耀太阳原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
原文链接：https://blog.csdn.net/qq_16804847/article/details/117062309

1.虚拟机安装Vmware

1.1 安装虚拟机14-15

VMware Workstation Pro 15.5.6
在这里插入图片描述

1.2 Vt-x问题

开机-F2(F1-ESC-F8)----CPU设置–VT-X(虚拟化技术) 设置为启动即可 F8保存
1.找班里同学帮助设置
2.找项目经理
在这里插入图片描述

1.3 检查网卡

在这里插入图片描述

1.4 运行Linux系统

用户名和密码: root/root
在这里插入图片描述

2.商品分类参数实现

2.1 商品分类参数说明

1).动态参数
在这里插入图片描述
2).静态属性

2.2 商品分类参表设计

在这里插入图片描述

2.3 实现商品分类参数页面跳转

在这里插入图片描述

3.商品分类参数业务实现

3.1 实现商品分类参数列表

3.1.1 页面HTML

在这里插入图片描述

3.1.2 页面JS

在这里插入图片描述

3.1.3 商品分类参数接口文档

在这里插入图片描述

3.1.4 编辑ItemCatParamController

@RestController
@CrossOrigin
@RequestMapping("/itemCatParam")
public class ItemCatParamController {

    @Autowired
    private ItemCatParamService itemCatParamService;

    /**
     * 实现商品分类参数的查询
     * URL: /itemCatParam/findItemCatParamListByType?itemCatId=564&paramType=1
     * 参数: itemCatId,paramType
     * 返回值: SysResult对象
     */
    @GetMapping("findItemCatParamListByType")
    public SysResult findItemCatParamListByType(ItemCatParam itemCatParam){

        List<ItemCatParam> paramList =
                itemCatParamService.findParamListByType(itemCatParam);
        return SysResult.success(paramList);
    }
}

3.1.5 编辑ItemCatParamService

@Service
public class ItemCatParamServiceImpl implements ItemCatParamService{

    @Autowired
    private ItemCatParamMapper itemCatParamMapper;

    //Sql:select * from item_cat_param where item_cat_id = xxx and param_type=1
    @Override       //参数中只有2个数据不为null
    public List<ItemCatParam> findParamListByType(ItemCatParam itemCatParam) {
        //QueryWrapper<ItemCatParam> queryWrapper = new QueryWrapper<>(itemCatParam);
        return itemCatParamMapper.selectList(new QueryWrapper<>(itemCatParam));
    }
}

3.1.6 页面效果展现

在这里插入图片描述

3.2 商品分类参数新增

3.2.1 页面分析

1).页面添加按钮

<!-- 定义添加参数按钮-->
          <el-button type="primary" size="mini" :disabled="isDisableBtn" @click="addDialogVisible = true">添加动态参数
          </el-button>

2.对话框窗口
在这里插入图片描述
3).页面JS

3.2.2 业务接口

在这里插入图片描述

3.2.3 编辑ItemCatParamController

在这里插入图片描述

3.2.4 编辑ItemCatParamService

在这里插入图片描述

3.3 商品分类参数的修改

3.3.1 页面分析

在这里插入图片描述

3.3.2 编辑ItemCatParamController

在这里插入图片描述

3.3.3 编辑ItemCatParamService

在这里插入图片描述

4. 商品业务实现

4.1 实现页面跳转

在这里插入图片描述

4.2 商品数据结构分析

4.2.1 POJO对象

在这里插入图片描述
2.表结构

4.3 商品列表展现

4.3.1 页面结构

在这里插入图片描述

4.3.2 业务接口

在这里插入图片描述

4.3.3 编辑ItemController

@RestController
@CrossOrigin
@RequestMapping("/item")
public class ItemController {

    @Autowired
    private ItemService itemService;

    /**
     * 实现商品列表展现
     * URL: /item/getItemList?query=&pageNum=1&pageSize=10
     * 参数: 使用分页参数
     * 返回值: SysResult对象(pageResult对象)
     */
    @GetMapping("/getItemList")
    public SysResult findItemList(PageResult pageResult){

        //查询分页数据 返回分页对象
        pageResult = itemService.findItemList(pageResult);
        return SysResult.success(pageResult);
    }

}

4.3.4 编辑ItemService

@Service
public class ItemServiceImpl implements ItemService{

    @Autowired
    private ItemMapper itemMapper;

    /**
     * 1.使用分页查询
     *      1.1手写sql
     *      1.2利用MP
     * @param pageResult
     * @return
     */
    @Override
    public PageResult findItemList(PageResult pageResult) {
        IPage page = new Page(pageResult.getPageNum(),
                          pageResult.getPageSize());
        QueryWrapper<Item> queryWrapper = new QueryWrapper<>();
        //用户是否传递参数
        boolean flag = StringUtils.hasLength(pageResult.getQuery());
        queryWrapper.like(flag,"title", pageResult.getQuery());

        page = itemMapper.selectPage(page,queryWrapper);
        long total = page.getTotal();
        List<Item> itemList = page.getRecords();
        return pageResult.setTotal(total).setRows(itemList);
    }
}

4.3.5 页面效果展现

在这里插入图片描述

4.3.6 添加过滤器

说明: 在main.js中添加过滤器.

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import './plugins/element.js'
import './assets/css/global.css'
import './assets/ali-icon/iconfont.css'

/* 导入axios包 */
import axios from 'axios'
/* 设定axios的请求根目录 */
axios.defaults.baseURL = 'http://localhost:8091/'
/* 向vue对象中添加全局对象 以后发送ajax请求使用$http对象 */
Vue.prototype.$http = axios

//定义格式化价格的过滤器
Vue.filter('priceFormat',(price) => {

  return (price/100).toFixed(2)
})

Vue.config.productionTip = false

new Vue({
  router,
  render: h => h(App)
}).$mount('#app')

4.4 商品状态修改

4.4.1 页面JS分析

1).页面JS
在这里插入图片描述
2).页面ajax请求

4.4.2 编辑ItemController

在这里插入图片描述

4.4.3 编辑ItemService

在这里插入图片描述

4.5 商品删除自己实现

4.6 商品新增页面跳转

4.6.1 跳转新增页面

1.点击按钮发送请求
在这里插入图片描述
2.编辑导航路由

4.6.2 跳转页面效果

在这里插入图片描述

4.7 文件上传

4.7.1 官网API介绍

在这里插入图片描述

4.7.2 编辑文件上传页面

<!--
              class="upload-demo" 图片上传的类型
              :action="uploadUrl" 必选参数，上传的地址
              :on-preview="handlePreview" 当上传图片之后预览的回调
              :on-remove   删除图片的回调函数
              :on-success  上传成功的回调
              list-type="picture"  上传文件的类型 只允许上传图片
              multiple 是否支持多选文件
              drag  是否允许拖拽
              请求的参数名称: file
             -->
            <el-upload class="upload-demo" :action="uploadUrl" :on-preview="handlePreview" :on-remove="handleRemove"
              :on-success="handleSuccess" list-type="picture" multiple drag>
              <el-button size="small" type="primary">点击上传</el-button>
              <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
            </el-upload>

4.7.3 文件上传接口文档

在这里插入图片描述

4.7.4 编辑FileController

@RestController
@CrossOrigin
@RequestMapping("/file")
public class FileController {

    /**
     * Demo
     * URL:http://localhost:8091/file/upload
     * 参数: file:二进制信息
     * 返回值: SysResult对象
     * MultipartFile:SpringMVC 对外提供的接口 专门实现文件上传操作
     * 高级API 默认的文件大小 最大1M
     * 如果需要优化则需要编辑配置类 重新定义大小(一般不这么做)
     * 优化:  1.防止文件重名
     *        2.防止恶意程序 jpg|png|gif
     */
    @PostMapping("/upload")
    public SysResult upload(MultipartFile file) throws IOException {
        //1.获取文件名称
        String fileName = file.getOriginalFilename();
        //2.准备文件上传的本地目录
        String fileDir = "D:/JT_IMAGE/";
        //3.是否需要判断目录是否存在
        File filePath = new File(fileDir);
        if(!filePath.exists()){
            //可以创建多级目录
            filePath.mkdirs();
            //只创建一级目录
            //filePath.mkdir();
        }

        //4.准备输出的对象 文件的全路径="文件目录"/+"文件的名称"
        String realFilePath = fileDir + fileName;
        File realFile = new File(realFilePath);
        //5.实现文件上传
        file.transferTo(realFile);
        return SysResult.success();
    }
}

LXC5952

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Spring-jt-Day16-Vmware,Spring事务控制,文件上传

版权声明：本文为闪耀太阳原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。原文链接：https://blog.csdn.net/qq_16804847/article/details/1170623091.虚拟机安装Vmware1.1 安装虚拟机14-15VMware Workstation Pro 15.5.61.2 Vt-x问题开机-F2(F1-ESC-F8)----CPU设置–VT-X(虚拟化技术) 设置为启动即可 F8保存1.找班里同学帮助设置2
复制链接

扫一扫