实体属性与文件上传异步保存操作

最新推荐文章于 2021-01-22 11:36:03 发布

在代码的路上奔跑

最新推荐文章于 2021-01-22 11:36:03 发布

阅读量273

点赞数

分类专栏： java基础文章标签：文件上传

本文链接：https://blog.csdn.net/qq_38427272/article/details/93378952

版权

java基础专栏收录该内容

5 篇文章 0 订阅

订阅专栏

controller层代码

 public R addProject(@RequestBody  ProjectEntity projectEntity,@Value("${upload.imagePath}") String 	     uploadImagePath){
    if(null==projectEntity.getImages()||projectEntity.getImages().size()==0){
        return R.error("请上传至少一张测点布置图");
    }
    String[] gateways =  projectEntity.getGateWay().split(",");
    HashSet<String> hashSet = new HashSet<>();
    for(int i=0;i<gateways.length;i++){
        hashSet.add(gateways[i]);
    }
    if(hashSet.size() != gateways.length){
        return R.error("网关重复，请重新填写");
    }
    Wrapper<ProjectEntity> wrapper = new EntityWrapper<>();
    wrapper.eq("gate_way",projectEntity.getGateWay());
    ProjectEntity projectEntity1 = projectService.selectOne(wrapper);
    if(projectEntity1!=null){
        if((projectEntity1.getStopTime()).compareTo(new Date())>=1){
            return R.error("此网关已被  "+projectEntity1.getProjectName()+"  占用");
        }
    }
   ProjectUserEntity projectUserEntity = new ProjectUserEntity();
   projectUserEntity.setUserId(getUserId());
   projectService.addProject(projectEntity,getUserId(),uploadImagePath);
   return R.ok();
}

service层代码

boolean addProject(ProjectEntity projectEntity, Long userId,String uploadImagePath);

serviceImpl层代码

public boolean addProject(ProjectEntity projectEntity,Long userId,String uploadFilePath) {
    if(baseMapper.insert(projectEntity)>0) {
        List<String> imagePaths = FileUploadUtil.uploadImgs(projectEntity.getImages(), uploadFilePath + "/" + projectEntity.getId() + "/");
        for (String imagePath : imagePaths) {
            ProjectPicEntity pp = new ProjectPicEntity();
            pp.setPicPath(imagePath);
            pp.setProjectId(projectEntity.getId());
            pp.setCreateBy(String.valueOf(userId));
            pp.setCreateTime(new Date());
            projectPicService.insert(pp);
        }
        ProjectUserEntity projectUserEntity = new ProjectUserEntity();
        projectUserEntity.setUserId(userId);
        projectUserEntity.setProjectId(projectEntity.getId());
        projectUserService.insert(projectUserEntity);
        String[] gateWayCodes = projectEntity.getGateWay().split(",");
        if(gateWayCodes!=null&&gateWayCodes.length>0){
            for(String gateWayCode : gateWayCodes){
                ProjectGateWayEntity entity = new ProjectGateWayEntity();
                entity.setGateWayCode(gateWayCode);
                entity.setStartTime(projectEntity.getStartTime());
                entity.setStopTime(projectEntity.getStopTime());
                entity.setProjectId(projectEntity.getId());
                entity.setStatus(1);
                projectGatewayService.insert(entity);
            }
        }

文件上传工具类

 public class FileUploadUtil{
 public static List<String> uploadImgs(List<Map<String,String>> imgDatas,String uploadPath) {
    List<String> uploadFile = new ArrayList<>();
    for(Map<String,String> map: imgDatas){
        String base64Data = map.get("src");
        String suffix = "";
        String dataPrix = "";
        String data = "";
        if(base64Data == null || "".equals(base64Data)){
            throw new RRException("上传失败，上传图片数据为空");
        }else{
            String [] d = base64Data.split("base64,");
            if(d != null && d.length == 2){
                dataPrix = d[0];
                data = d[1];
            }else{
                throw new RRException("上传失败，数据不合法");
            }
        }
        if("data:image/jpeg;".equalsIgnoreCase(dataPrix)){//data:image/jpeg;base64,base64编码的jpeg图片数据
            suffix = ".jpg";
        } else if("data:image/x-icon;".equalsIgnoreCase(dataPrix)){//data:image/x-icon;base64,base64编码的icon图片数据
            suffix = ".ico";
        } else if("data:image/gif;".equalsIgnoreCase(dataPrix)){//data:image/gif;base64,base64编码的gif图片数据
            suffix = ".gif";
        } else if("data:image/png;".equalsIgnoreCase(dataPrix)){//data:image/png;base64,base64编码的png图片数据
            suffix = ".png";
        }else{
            throw new RRException("上传图片格式不合法");
        }
        String tempFileName = UUID.randomUUID().toString() + suffix;
        String fileName = uploadPath+tempFileName;
        uploadFile.add(fileName);
        byte[] bs  = Base64Utils.decodeFromString(data);
        try{
            FileUtils.writeByteArrayToFile(new File(fileName), bs);
        }catch (Exception e){
            throw new RRException(e.getMessage());
        }
    }
    return uploadFile;
}

}
application-test.yml匹配文件

  datasource:
    type: com.alibaba.druid.pool.DruidDataSource
    driverClassName: com.mysql.jdbc.Driver
    druid:
      first:
        url: jdbc:mysql://192.168.101.11:3306/xipaiai?allowMultiQueries=true&useUnicode=true&characterEncoding=UTF-8&useSSL=true
        username: root
        password: root
      initial-size: 10
      max-active: 100
      min-idle: 10
      max-wait: 60000
      pool-prepared-statements: true
      max-pool-prepared-statement-per-connection-size: 20
      time-between-eviction-runs-millis: 60000
      min-evictable-idle-time-millis: 300000
      #validation-query: SELECT 1 FROM DUAL
      test-while-idle: true
      test-on-borrow: false
      test-on-return: false
      stat-view-servlet:
        enabled: true
        url-pattern: /druid/*
        #login-username: admin
        #login-password: admin
      filter:
        stat:
          log-slow-sql: true
          slow-sql-millis: 1000
          merge-sql: false
        wall:
          config:
            multi-statement-allow: true
socket:
  port: 8088
upload:
  imagePath: C:\upload

applicatiom.yml配置文件

server:
  tomcat:
    uri-encoding: UTF-8
    max-threads: 1000
    min-spare-threads: 30
  port: 8080
  servlet:
    context-path: /
spring:
  profiles:
    active: test
  jackson:
    date-format: yyyy-MM-dd HH:mm:ss
    time-zone: GMT+8
  servlet:
    multipart:
      max-file-size: 100MB
      max-request-size: 100MB
      enabled: true
  redis:
    database: 0
    host: 192.168.10.10
    port: 6379
    password:      # 密码（默认为空）
    timeout: 6000ms  # 连接超时时长（毫秒）
    jedis:
      pool:
        max-active: 1000  # 连接池最大连接数（使用负值表示没有限制）
        max-wait: -1ms      # 连接池最大阻塞等待时间（使用负值表示没有限制）
        max-idle: 10      # 连接池中的最大空闲连接
        min-idle: 5       # 连接池中的最小空闲连接
  freemarker:
    suffix: .html
    request-context-attribute: request
file:
  staticAccessPath: /resources/statics/pic/**
  uploadFolder: E://pic/

xipaiai:
  redis:
    open: false  # 是否开启redis缓存  true开启   false关闭
  shiro:
    redis: false # true表示shiro session存到redis里，需要开启redis，才会生效【分布式场景】

#mybatis
mybatis-plus:
  mapper-locations: classpath*:mapper/**/*.xml
  #实体扫描，多个package用逗号或者分号分隔
  typeAliasesPackage: io.xipaiai.modules.*.entity
  global-config:
    #主键类型  0:"数据库ID自增", 1:"用户输入ID",2:"全局唯一ID (数字类型唯一ID)", 3:"全局唯一ID UUID";
    id-type: 0
    #字段策略 0:"忽略判断",1:"非 NULL 判断"),2:"非空判断"
    field-strategy: 2
    #驼峰下划线转换
    db-column-underline: true
    #刷新mapper 调试神器
    refresh-mapper: true
    #数据库大写下划线转换
    #capital-mode: true
    # Sequence序列接口实现类配置
    #key-generator: com.baomidou.mybatisplus.incrementer.OracleKeyGenerator
    #逻辑删除配置
    logic-delete-value: -1
    logic-not-delete-value: 0
    #自定义填充策略接口实现
    #meta-object-handler: com.baomidou.springboot.xxx
    #自定义SQL注入器
    sql-injector: com.baomidou.mybatisplus.mapper.LogicSqlInjector
  configuration:
    map-underscore-to-camel-case: true
    cache-enabled: false
    call-setters-on-nulls: true

logging:
  level: debug
  level.io.xipaiai: debug
  path: logs/
  file: admin.log

js代码：

$(function () {
    $("#jqGrid").jqGrid({
        url: baseURL + 'biz/project/list',
        datatype: "json",
        colModel: [
			{ label: 'id', name: 'id', index: 'id', width: 50, key: true,hidden:true},
            { label: '开始时间', name: 'startTime', index: 'start_time', width: 120 },
            { label: '结束时间', name: 'stopTime', index: 'stop_time', width: 100 },
            { label: '項目名称', name: 'projectName', index: 'project_name', width: 80 },
            { label: '网关',   width:80, name:'net', formatter: function(cellValue, options, rowObject) {
				var result = ""
				if(rowObject.gateWay!=null){
					var gateWays = rowObject.gateWay.split(',');
					if(typeof projectGateWayFlag!="undefined" &&projectGateWayFlag){
						for(var i=0; i<gateWays.length;i++) {
							result += '<a class="btn setuser" onClick="toSensortem(\''+rowObject.id+'\',\''+gateWays[i]+'\')">'+gateWays[i]+'</a>'
						}
					}else{
						for(var i=0; i<gateWays.length;i++) {
							result += '<a class="btn setuser" onClick="javascript:alert(\'你没有权限\')">'+gateWays[i]+'</a>'
						}
					}

				}
				return result;
			}},
            { label: '操作',  width: 100,name: 'done', formatter: function(cellValue, options, rowObject) {
				var result =""
				if(typeof projectUserFlag!="undefined" &&projectUserFlag){
					result = "<a class='setuser' onclick='vm.toProjectUser("+rowObject.id+")' >配置用户</a>"
				}
				var result2 = "&nbsp;&nbsp;&nbsp;<a class='setuser' onclick='vm.getInfodetail("+rowObject.id+")' >项目详情</a>";
                    return result+result2
                }},
        ],
		viewrecords: true,
        height: 400,
        rowNum: 10,
		rowList : [10,30,50],
        rownumbers: true,
        rownumWidth: 40,
        autowidth:true,
        multiselect: true,
		pager: "#jqGridPager",
		jsonReader : {
			root: "page.list",
			page: "page.currPage",
			total: "page.totalPage",
			records: "page.totalCount"
		},
		prmNames : {
			page:"page",
			rows:"limit",
			order: "order"
		},
        gridComplete:function(){
        	//隐藏grid底部滚动条
			var $conten=$('#gbox_jqGrid')
        	$("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "hidden" });
			$conten.find('.ui-jqgrid-htable').width($conten.outerWidth())
        }
    });

	laydate.render({
		elem: '#time1' //开始日期
	});

	laydate.render({
		elem: '#time2' //结束日期
	});

	$(".select2").select2();
});

//菜单树
var user_ztree;
var user_setting = {
	data: {
		simpleData: {
			enable: true,
			idKey: "userId",
			rootPId: -1
		},
		key: {
			url:"nourl",
			name : "username"
		}
	},
	check:{
		enable:true,
		nocheckInherit:true
	}
};
function toSensortem(id,gateWayCode){
	$.get(baseURL + "biz/projectGateWay/info/"+id+"/"+gateWayCode, function(r){
		var projectGateWay = r.projectGateWay
		var data = {
			href:'modules/biz/sensortem.html?projectGateWayId='+projectGateWay.id,
			icon:'x',
			title:gateWayCode
		}
		parent.window.layui.navtab({
			elem: '.larry-tab-box',
			closed:false
		}).tabAdd(data)

	});

    //parent.window;
	//parent.window.vm.addNavTitle(0,'<a href="/#modules/biz/project.html">'+vd+'</a>');
	//window.location.href="/modules/biz/sensortem.html?code="+vd;

}
var vm = new Vue({
	el:'#rrapp',
	data:{
	    id:"",
		showList: true,
		showUser:false,
		showModify:false,
        showDetail:false,
		keyWords:"",
		title: null,
		userIdList:[],
		project: {},
        gateway:{},
		projectUsers:[],
        imgList: [],
        size: 0,
		projectId:''
	},
	methods: {
        fileClick:function() {
            document.getElementById('file').click()
        },
        fileChange:function(el) {
            if (!el.target.files[0].size)
            	return;
            this.fileList(el.target);
            el.target.value = ''
        },
        fileList:function(fileList) {
            var files = fileList.files;
            for (var i = 0; i < files.length; i++) {
                //判断是否为文件夹
                if (files[i].type != '') {
                    this.fileAdd(files[i]);
                } else {
                    //文件夹处理
                    this.folders(fileList.items[i]);
                }
            }
        },
        //文件夹处理
        folders:function(files) {
            var _this = this;
            //判断是否为原生file
            if (files.kind) {
                files = files.webkitGetAsEntry();
            }
            files.createReader().readEntries(function (file) {
                for (var i = 0; i < file.length; i++) {
                    if (file[i].isFile) {
                        _this.foldersAdd(file[i]);
                    } else {
                        _this.folders(file[i]);
                    }
                }
            })
        },
        foldersAdd:function(entry) {
            var _this = this;
            entry.file(function (file) {
                _this.fileAdd(file)
            })
        },
        fileAdd:function(file) {
            //总大小
            this.size = this.size + file.size;
            //判断是否为图片文件
            if (file.type.indexOf('image') == -1) {
                file.src = 'wenjian.png';
				this.imgList.push(file);
            } else {
                var reader = new FileReader();
                reader.vue = this;
                reader.readAsDataURL(file);
                reader.onload = function () {
                    file.src = this.result;
					this.vue.imgList.push(file);
                }
            }
        },
        fileDel: function(index) {
            this.size = this.size - this.imgList[index].size;//总大小
            this.imgList.splice(index, 1);
        },
        bytesToSize:function(bytes) {
            if (bytes === 0) return '0 B';
            var k = 1000, // or 1024
                sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'],
                i = Math.floor(Math.log(bytes) / Math.log(k));
            return (bytes / Math.pow(k, i)).toPrecision(3) + ' ' + sizes[i];
        },
        dragenter:function(el) {
            el.stopPropagation();
            el.preventDefault();
        },
        dragover:function(el) {
            el.stopPropagation();
            el.preventDefault();
        },
        drop:function(el) {
            el.stopPropagation();
            el.preventDefault();
            this.fileList(el.dataTransfer);
        },
        checkVal:function(e){
            console.log(e)
        },

		query: function () {
            vm.reload();
		},
		add: function(){
			vm.showList = false;
			vm.showModify = true;
			vm.title = "新增";
			vm.project = {};
			vm.imgList = [];
		},
		update: function (event) {
			var id = getSelectedRow();
			if(id == null){
				return ;
			}
			vm.projectId=id
			vm.showList = false;
            vm.title = "修改";
			vm.showModify = true;
            vm.getInfo(id)
		},
		reupdate:function(event){
        	var id=vm.projectId
			if(id == null){
				return ;
			}
			vm.showDetail=false;
			vm.showList = false;
			vm.title = "修改";
			vm.showModify = true;
			vm.getInfo(id)
		},
		toProjectUser:function(id){
			if(id == null){
				return ;
			}
			vm.showList = true
		//	vm.showUser=true;
			vm.getUserTree(id)
			layer.open({
				type: 1,
				offset: '50px',
				skin: 'layui-layer-user',
				title: "项目用户绑定",
				area: ['400px', '400px'],
				shadeClose: false,
				content: jQuery("#deptUser"),
				btn: ['确定'],
				btn1: function (index) {
					var nodes = user_ztree.getCheckedNodes(true);
					var projectUserList = new Array();
					for(var i=0; i<nodes.length; i++) {
						var node = {
							userId :nodes[i].userId,
							projectId:id
						}
						projectUserList.push(node);
					}
					$.ajax({
						type: "POST",
						url: baseURL + "biz/projectuser/save",
						contentType: "application/json",
						data: JSON.stringify(projectUserList),
						success: function(r){
							if(r.code === 0){
								alert('操作成功', function(index){
									vm.reload();
								});
							}else{
								alert(r.msg);
							}
						}
					});
					layer.close(index);
				}
			});
		},
		getUserTree: function(id) {
			//加载菜单树
			$.get(baseURL + "sys/user/listAll", function(r){
				user_ztree = $.fn.zTree.init($("#userTree"), user_setting, r);
				//展开所有节点
			 	user_ztree.expandAll(true);
			});
			vm.getProjectUser(id)
		},
		getProjectUser: function(id){
			$.get(baseURL + "biz/projectuser/list/"+id, function(r){
				vm.userIdList = r.userIdList;

				//勾选项目的用户
				var userIds = vm.userIdList;
				for(var i=0; i<userIds.length; i++) {
					var node = user_ztree.getNodeByParam("userId", userIds[i]);
					user_ztree.checkNode(node, true, false);
				}

			});
		},
		saveOrUpdate: function (event) {
        	vm.project.startTime = $("#time1").val();
			vm.project.stopTime = $("#time2").val();
            vm.project.images = vm.imgList
			var url = vm.project.id == null ? "biz/project/addProject" : "biz/project/update";
			$.ajax({
				type: "POST",
			    url: baseURL + url,
               contentType: "application/json",
			   data: JSON.stringify(vm.project),
                // contentType: false,
                processData: false,
                dataType: 'json',
                async: false,
                cache: false,
			    success: function(r){
			    	if(r.code === 0){
						$("#time1").val("");
						$("#time2").val("");
						alert('操作成功', function(index){
							vm.reload();
						});
					}else{
						alert(r.msg);
					}
				}
			});
		},
		del: function (event) {
			var ids = getSelectedRows();
			if(ids == null){
				return ;
			}
			confirm('确定要删除选中的记录？', function(){
				$.ajax({
					type: "POST",
				    url: baseURL + "biz/project/delete",
                    contentType: "application/json",
				    data: JSON.stringify(ids),
				    success: function(r){
						if(r.code == 0){
							alert('操作成功', function(index){
								$("#jqGrid").trigger("reloadGrid");
							});
						}else{
							alert(r.msg);
						}
					}
				});
			});
		},
		getInfo: function(id){
            $.get(baseURL + "biz/project/info/"+id, function(r){
                vm.showDetail = false;
                vm.showModify = true;
                vm.showUser = false;
                vm.showList = false;
			    vm.project = r.project;
				vm.imgList = r.project.images;
				$("#time1").val(vm.project.startTime);
				$("#time2").val(vm.project.stopTime);
            });

		},
        getInfodetail: function(id){
            $.get(baseURL + "biz/project/info/"+id, function(r){
                vm.showDetail = true;
                vm.showModify = false;
                vm.showUser = false;
                vm.showList = false;
                vm.project = r.project;
                vm.imgList = r.project.images;
                $("text").attr("disabled",true);
            });
        },
		reload: function (event) {
			vm.showList = true;
			vm.showUser = false;
			vm.showModify = false;
            vm.showDetail = false;
			var page = $("#jqGrid").jqGrid('getGridParam','list');
			$("#jqGrid").jqGrid('setGridParam',{
                page:page,
				postData:{'key': vm.keyWords},
            }).trigger("reloadGrid");
		},
        destroyed: function(){
            this.startTime='',
            this.stopTime='',
            this.images=''
        }
	}
});

HTML页面代码

<div>
<head>
    <title></title>
		<#include "/header.html">
        <link rel="stylesheet" href="${request.contextPath}/statics/plugins/select2/select2.min.css" />
        <link rel="stylesheet" href="${request.contextPath}/statics/plugins/preivew/tree_files/font-awesome.min.css">
        <script src="${request.contextPath}/statics/plugins/select2/select2.min.js"></script>
        <script src="http://www.jq22.com/jquery/vue.min.js"></script>
    <style>
        .upload_warp_img_div_del {
            position: absolute;
            top: 6px;
            width: 16px;
            right: 4px;
        }

        .upload_warp_img_div_top {
            position: absolute;
            top: 0;
            width: 100%;
            height: 30px;
            background-color: rgba(0, 0, 0, 0.4);
            line-height: 30px;
            text-align: left;
            color: #fff;
            font-size: 12px;
            text-indent: 4px;
        }

        .upload_warp_img_div_text {
            white-space: nowrap;
            width: 80%;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .upload_warp_img_div img {
            max-width: 100%;
            max-height: 100%;
            vertical-align: middle;
        }

        .upload_warp_img_div {
            position: relative;
            height: 100px;
            width: 120px;
            border: 1px solid #ccc;
            margin: 0px 30px 10px 0px;
            float: left;
            line-height: 100px;
            display: table-cell;
            text-align: center;
            background-color: #eee;
            cursor: pointer;
        }

        .upload_warp_img {
            border-top: 1px solid #D2D2D2;
            padding: 14px 0 0 14px;
            overflow: hidden
        }

        .upload_warp_text {
            text-align: left;
            margin-bottom: 10px;
            padding-top: 10px;
            text-indent: 14px;
            border-top: 1px solid #ccc;
            font-size: 14px;
        }

        .upload_warp_right {
            float: left;
            width: 57%;
            margin-left: 2%;
            height: 100%;
            border: 1px dashed #999;
            border-radius: 4px;
            line-height: 130px;
            color: #999;
        }

        .upload_warp_left img {
            margin-top: 32px;
        }

        .upload_warp_left {
            float: left;
            width: 40%;
            height: 100%;
            border: 1px dashed #999;
            border-radius: 4px;
            cursor: pointer;
        }

        .upload_warp {
            margin: 14px;
            height: 130px;
        }

        .upload {
            border: 1px solid #ccc;
            background-color: #fff;
            width: 650px;
            box-shadow: 0px 1px 0px #ccc;
            border-radius: 4px;
            margin-bottom:20px;
        }

        .hello {
            width: 650px;
            margin-left: 34%;
            text-align: center;
        }
        *{margin:0;padding:0;}
    </style>
</head>
<body>
<div id="rrapp" v-cloak>
    <div v-show="showList">
        <div class="grid-btn">
			<#if shiro.hasPermission("biz:project:save")>
            <a class="btn btn-primary" @click="add"><i class="fa fa-plus"></i>&nbsp;新增</a>
			</#if>
			<#if shiro.hasPermission("biz:project:update")>
            <a class="btn btn-primary" @click="update"><i class="fa fa-pencil-square-o"></i>&nbsp;修改</a>
			</#if>
			<#if shiro.hasPermission("biz:project:delete")>
            <a class="btn btn-primary" @click="del"><i class="fa fa-trash-o"></i>&nbsp;删除</a>
			</#if>
            <#if shiro.hasPermission("biz:project:projectUser")>
                <script>var projectUserFlag = true</script>
            </#if>
            <#if shiro.hasPermission("biz:project:gateWay")>
                <script>var projectGateWayFlag = true</script>
            </#if>
  <div class="gridBtn">
    <input type="text" class="form-control userName" id="keyWords" v-model="keyWords" @keyup.enter="query" placeholder="项目名称">
    <a class="btn btn-default" @click="query"><i class="fa fa-search"></i>查询</a>
</div>
     </div>
        <table id="jqGrid" class="cxm"></table>
        <div id="jqGridPager"></div>
    </div>
<!--   <div v-show="showUser" class="panel panel-default">
      <div class="panel-heading">项目用户绑定</div>
      <div class="form-inline clearfix" style="margin-top:30px;margin-left:26px;">
          <div class="form-group col-md-6">
              <p class="col-sm-5 control-label">用户</p>
              <div class="col-sm-10">
               < ul id="userTree" class="ztree"></ul>
                </div>
            </div>
        </div>
        <div class="form-group">
        <div class="col-sm-2 control-label"></div>
        <input type="button" class="btn btn-primary" @click="saveProjectUser" value="确定"/>
        &nbsp;&nbsp;<input type="button" class="btn btn-warning goback" @click="reload" value="返回"/>
    </div>
    </div>-->
    <div v-show="showModify" class="panel panel-default">
        <div class="panel-heading">{{title}}</div>
        <form class="form-horizontal">
            <div class="form-group">
                <div class="col-sm-2 control-label">项目名称</div>
                <div class="col-sm-10">
                    <input type="text" name="projectName" class="form-control" v-model="project.projectName" placeholder=""/>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label">网关</div>
                <div class="col-sm-10">
                    <input type="text" class="form-control" v-model="project.gateWay" placeholder="多个网关逗号隔开，如 xxx,yyy,zzz"/>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label">开始时间</div>
                <div class="col-sm-10">
                    <div class="input-group date">
                        <div class="input-group-addon">
                            <i class="fa fa-calendar"></i>
                        </div>
                        <input type="text" class="form-control pull-right" id="time1"  placeholder="开始日期"  >
                    </div>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label">结束时间</div>
                <div class="col-sm-10">
                    <div class="input-group date">
                        <div class="input-group-addon">
                            <i class="fa fa-calendar"></i>
                        </div>
                        <input type="text" class="form-control pull-right" id="time2"    placeholder="结束日期"  >
                    </div>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label">项目描述</div>
                <div class="col-sm-10">
                    <textarea class="form-control" name="remark" v-model="project.remark" placeholder=""></textarea>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label">项目描述</div>
                <div class="col-sm-10">
                    <div >
                        <div class="upload">
                            <div class="upload_warp">
                                <div class="upload_warp_left" @click="fileClick">
                                    <img src="${request.contextPath}/statics/uploads/upload.png">
                                </div>
                                <div class="upload_warp_right" @drop="drop($event)" @dragenter="dragenter($event)" @dragover="dragover($event)">
                                    或者将文件拖到此处
                                </div>
                            </div>
                            <div class="upload_warp_text">
                                选中{{imgList.length}}张文件
                            </div>
                            <input @change="fileChange($event)" id="file" name="file" type="file" multiple="multiple" style="display: none"/>
                            <div class="upload_warp_img" v-show="imgList.length!=0">
                                <div class="upload_warp_img_div" v-for="(item,index) of imgList">
                                    <div class="upload_warp_img_div_top">
                                        <div class="upload_warp_img_div_text">
                                            {{item.name}}
                                        </div>
                                        <img src="${request.contextPath}/statics/uploads/del.png" class="upload_warp_img_div_del" @click="fileDel(index)">
                                    </div>
                                    <img v-for="item in imgList" :src="item.src">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="form-group">
                <div class="col-sm-2 control-label"></div>
                <input type="button" class="btn btn-primary w180" @click="saveOrUpdate" value="确定"/>
                &nbsp;&nbsp;<input type="button" class="btn btn-warning w180 goback" @click="reload" value="返回"/>
            </div>
        </form>
    </div>
<div v-show="showDetail" class="panel panel-default chanel">
    <div class="panel-heading">项目详情 <a class="btn btn-primary right" @click="reupdate"><i class="fa fa-pencil-square-o"></i>&nbsp;修改</a></div>
    <form class="form-horizontal">
        <div class="form-group">
            <div class="col-sm-2 control-label">项目名称</div>
            <div class="col-sm-10">
                <input type="text" class="form-control" v-model="project.projectName" placeholder="" readonly/>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-2 control-label">网关</div>
            <div class="col-sm-10">
               <input type="text" class="form-control" v-model="project.gateWay" placeholder="" readonly>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-2 control-label">项目时间</div>
            <div class="col-sm-10">
                <div class="input-group date">
                    <div class="inputDiv">
                        <table>
                       <td>
                       <input type="text" style="width:181px;" class="form-control pull-right" v-model="project.startTime" id="time1"  name="time1"  placeholder="开始日期" >
                           <span style="float: right; height: 34px; line-height: 34px;">-</span>
                           <input type="text" style="width:181px;" class="form-control pull-right" v-model="project.stopTime" id="time2"  name="time2"  placeholder="结束日期"  >
                       </td>
                        </table>
                    </div>
                </div>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-2 control-label">项目描述</div>
            <div class="col-sm-10">
                <input type="text" class="form-control" v-model="project.remark" placeholder="" readonly/>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-2 control-label">测点布置图</div>
            <div class="col-sm-10" >
                <img v-for="item in imgList" :src="item.src" height="150" width="370"  >
            </div>
        </div>
        <div class="form-group">
            <input type="button" class="btn btn-warning goback w100" @click="reload" value="返回"/>
        </div>
    </form>
</div>
</div>
<div id="deptUser" style="display: none;">
    <div class="form-inline clearfix" style="margin-top:30px;margin-left:124px;">
        <div class="form-group col-md-12">
            <!--<p class="col-sm-5 control-label">用户</p>-->
            <div class="col-sm-10">
                <ul id="userTree" class="ztree"></ul>
            </div>
        </div>
    </div>

</div>

<script src="${request.contextPath}/statics/js/modules/biz/project.js"></script>

</body>
</html>

在代码的路上奔跑

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
实体属性与文件上传异步保存操作

controller层代码 public R addProject(@RequestBody ProjectEntity projectEntity,@Value("${upload.imagePath}") String uploadImagePath){ if(null==projectEntity.getImages()||projectEntity.getImage...
复制链接

扫一扫