完成功能

src/main/java/com/controller/MessagesController.java

@@ -0,0 +1,209 @@
+package com.controller;
+
+import java.text.SimpleDateFormat;
+import java.util.ArrayList;
+import java.util.Arrays;
+import java.util.Calendar;
+import java.util.Map;
+import java.util.HashMap;
+import java.util.Iterator;
+import java.util.Date;
+import java.util.List;
+import javax.servlet.http.HttpServletRequest;
+
+import com.utils.ValidatorUtils;
+import org.apache.commons.lang3.StringUtils;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.web.bind.annotation.PathVariable;
+import org.springframework.web.bind.annotation.RequestBody;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestParam;
+import org.springframework.web.bind.annotation.RestController;
+import com.baomidou.mybatisplus.mapper.EntityWrapper;
+import com.baomidou.mybatisplus.mapper.Wrapper;
+import com.annotation.IgnoreAuth;
+
+import com.entity.MessagesEntity;
+import com.entity.view.MessagesView;
+
+import com.service.MessagesService;
+import com.service.TokenService;
+import com.utils.PageUtils;
+import com.utils.R;
+import com.utils.MD5Util;
+import com.utils.MPUtil;
+import com.utils.CommonUtil;
+
+
+/**
+ * 留言板
+ * 后端接口
+ * @author 
+ * @email
+ */
+@RestController
+@RequestMapping("/messages")
+public class MessagesController {
+    @Autowired
+    private MessagesService messagesService;
+    
+
+
+    /**
+     * 后端列表
+     */
+    @RequestMapping("/page")
+    public R page(@RequestParam Map<String, Object> params,MessagesEntity messages, HttpServletRequest request){
+    	if(!request.getSession().getAttribute("role").toString().equals("管理员")) {
+    		messages.setUserid((Long)request.getSession().getAttribute("userId"));
+    	}
+        EntityWrapper<MessagesEntity> ew = new EntityWrapper<MessagesEntity>();
+		PageUtils page = messagesService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, messages), params), params));
+
+        return R.ok().put("data", page);
+    }
+    
+    /**
+     * 前端列表
+     */
+    @RequestMapping("/list")
+    public R list(@RequestParam Map<String, Object> params,MessagesEntity messages, HttpServletRequest request){
+    	if(!request.getSession().getAttribute("role").toString().equals("管理员")) {
+    		messages.setUserid((Long)request.getSession().getAttribute("userId"));
+    	}
+        EntityWrapper<MessagesEntity> ew = new EntityWrapper<MessagesEntity>();
+		PageUtils page = messagesService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, messages), params), params));
+        return R.ok().put("data", page);
+    }
+
+	/**
+     * 列表
+     */
+    @RequestMapping("/lists")
+    public R list( MessagesEntity messages){
+       	EntityWrapper<MessagesEntity> ew = new EntityWrapper<MessagesEntity>();
+      	ew.allEq(MPUtil.allEQMapPre( messages, "messages")); 
+        return R.ok().put("data", messagesService.selectListView(ew));
+    }
+
+	 /**
+     * 查询
+     */
+    @RequestMapping("/query")
+    public R query(MessagesEntity messages){
+        EntityWrapper< MessagesEntity> ew = new EntityWrapper< MessagesEntity>();
+ 		ew.allEq(MPUtil.allEQMapPre( messages, "messages")); 
+		MessagesView messagesView =  messagesService.selectView(ew);
+		return R.ok("查询留言板成功").put("data", messagesView);
+    }
+	
+    /**
+     * 后端详情
+     */
+    @RequestMapping("/info/{id}")
+    public R info(@PathVariable("id") Long id){
+        MessagesEntity messages = messagesService.selectById(id);
+        return R.ok().put("data", messages);
+    }
+
+    /**
+     * 前端详情
+     */
+    @RequestMapping("/detail/{id}")
+    public R detail(@PathVariable("id") Long id){
+        MessagesEntity messages = messagesService.selectById(id);
+        return R.ok().put("data", messages);
+    }
+    
+
+
+
+    /**
+     * 后端保存
+     */
+    @RequestMapping("/save")
+    public R save(@RequestBody MessagesEntity messages, HttpServletRequest request){
+    	messages.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
+    	//ValidatorUtils.validateEntity(messages);
+        messagesService.insert(messages);
+        return R.ok();
+    }
+    
+    /**
+     * 前端保存
+     */
+    @RequestMapping("/add")
+    public R add(@RequestBody MessagesEntity messages, HttpServletRequest request){
+    	messages.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
+    	//ValidatorUtils.validateEntity(messages);
+    	messages.setUserid((Long)request.getSession().getAttribute("userId"));
+        messagesService.insert(messages);
+        return R.ok();
+    }
+
+    /**
+     * 修改
+     */
+    @RequestMapping("/update")
+    public R update(@RequestBody MessagesEntity messages, HttpServletRequest request){
+        //ValidatorUtils.validateEntity(messages);
+        messagesService.updateById(messages);//全部更新
+        return R.ok();
+    }
+    
+
+    /**
+     * 删除
+     */
+    @RequestMapping("/delete")
+    public R delete(@RequestBody Long[] ids){
+        messagesService.deleteBatchIds(Arrays.asList(ids));
+        return R.ok();
+    }
+    
+    /**
+     * 提醒接口
+     */
+	@RequestMapping("/remind/{columnName}/{type}")
+	public R remindCount(@PathVariable("columnName") String columnName, HttpServletRequest request, 
+						 @PathVariable("type") String type,@RequestParam Map<String, Object> map) {
+		map.put("column", columnName);
+		map.put("type", type);
+		
+		if(type.equals("2")) {
+			SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
+			Calendar c = Calendar.getInstance();
+			Date remindStartDate = null;
+			Date remindEndDate = null;
+			if(map.get("remindstart")!=null) {
+				Integer remindStart = Integer.parseInt(map.get("remindstart").toString());
+				c.setTime(new Date()); 
+				c.add(Calendar.DAY_OF_MONTH,remindStart);
+				remindStartDate = c.getTime();
+				map.put("remindstart", sdf.format(remindStartDate));
+			}
+			if(map.get("remindend")!=null) {
+				Integer remindEnd = Integer.parseInt(map.get("remindend").toString());
+				c.setTime(new Date());
+				c.add(Calendar.DAY_OF_MONTH,remindEnd);
+				remindEndDate = c.getTime();
+				map.put("remindend", sdf.format(remindEndDate));
+			}
+		}
+		
+		Wrapper<MessagesEntity> wrapper = new EntityWrapper<MessagesEntity>();
+		if(map.get("remindstart")!=null) {
+			wrapper.ge(columnName, map.get("remindstart"));
+		}
+		if(map.get("remindend")!=null) {
+			wrapper.le(columnName, map.get("remindend"));
+		}
+
+
+		int count = messagesService.selectCount(wrapper);
+		return R.ok().put("count", count);
+	}
+	
+
+
+}

src/main/java/com/controller/NewsController.java

@@ -0,0 +1,204 @@
+package com.controller;
+
+import java.text.SimpleDateFormat;
+import java.util.ArrayList;
+import java.util.Arrays;
+import java.util.Calendar;
+import java.util.Map;
+import java.util.HashMap;
+import java.util.Iterator;
+import java.util.Date;
+import java.util.List;
+import javax.servlet.http.HttpServletRequest;
+
+import com.utils.ValidatorUtils;
+import org.apache.commons.lang3.StringUtils;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.web.bind.annotation.PathVariable;
+import org.springframework.web.bind.annotation.RequestBody;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestParam;
+import org.springframework.web.bind.annotation.RestController;
+import com.baomidou.mybatisplus.mapper.EntityWrapper;
+import com.baomidou.mybatisplus.mapper.Wrapper;
+import com.annotation.IgnoreAuth;
+
+import com.entity.NewsEntity;
+import com.entity.view.NewsView;
+
+import com.service.NewsService;
+import com.service.TokenService;
+import com.utils.PageUtils;
+import com.utils.R;
+import com.utils.MD5Util;
+import com.utils.MPUtil;
+import com.utils.CommonUtil;
+
+
+/**
+ * 公告信息
+ * 后端接口
+ * @author 
+ * @email
+ */
+@RestController
+@RequestMapping("/news")
+public class NewsController {
+    @Autowired
+    private NewsService newsService;
+    
+
+
+    /**
+     * 后端列表
+     */
+    @RequestMapping("/page")
+    public R page(@RequestParam Map<String, Object> params,NewsEntity news, HttpServletRequest request){
+        EntityWrapper<NewsEntity> ew = new EntityWrapper<NewsEntity>();
+		PageUtils page = newsService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, news), params), params));
+
+        return R.ok().put("data", page);
+    }
+    
+    /**
+     * 前端列表
+     */
+	@IgnoreAuth
+    @RequestMapping("/list")
+    public R list(@RequestParam Map<String, Object> params,NewsEntity news, HttpServletRequest request){
+        EntityWrapper<NewsEntity> ew = new EntityWrapper<NewsEntity>();
+		PageUtils page = newsService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, news), params), params));
+        return R.ok().put("data", page);
+    }
+
+	/**
+     * 列表
+     */
+    @RequestMapping("/lists")
+    public R list( NewsEntity news){
+       	EntityWrapper<NewsEntity> ew = new EntityWrapper<NewsEntity>();
+      	ew.allEq(MPUtil.allEQMapPre( news, "news")); 
+        return R.ok().put("data", newsService.selectListView(ew));
+    }
+
+	 /**
+     * 查询
+     */
+    @RequestMapping("/query")
+    public R query(NewsEntity news){
+        EntityWrapper< NewsEntity> ew = new EntityWrapper< NewsEntity>();
+ 		ew.allEq(MPUtil.allEQMapPre( news, "news")); 
+		NewsView newsView =  newsService.selectView(ew);
+		return R.ok("查询公告信息成功").put("data", newsView);
+    }
+	
+    /**
+     * 后端详情
+     */
+    @RequestMapping("/info/{id}")
+    public R info(@PathVariable("id") Long id){
+        NewsEntity news = newsService.selectById(id);
+        return R.ok().put("data", news);
+    }
+
+    /**
+     * 前端详情
+     */
+	@IgnoreAuth
+    @RequestMapping("/detail/{id}")
+    public R detail(@PathVariable("id") Long id){
+        NewsEntity news = newsService.selectById(id);
+        return R.ok().put("data", news);
+    }
+    
+
+
+
+    /**
+     * 后端保存
+     */
+    @RequestMapping("/save")
+    public R save(@RequestBody NewsEntity news, HttpServletRequest request){
+    	news.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
+    	//ValidatorUtils.validateEntity(news);
+        newsService.insert(news);
+        return R.ok();
+    }
+    
+    /**
+     * 前端保存
+     */
+    @RequestMapping("/add")
+    public R add(@RequestBody NewsEntity news, HttpServletRequest request){
+    	news.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
+    	//ValidatorUtils.validateEntity(news);
+        newsService.insert(news);
+        return R.ok();
+    }
+
+    /**
+     * 修改
+     */
+    @RequestMapping("/update")
+    public R update(@RequestBody NewsEntity news, HttpServletRequest request){
+        //ValidatorUtils.validateEntity(news);
+        newsService.updateById(news);//全部更新
+        return R.ok();
+    }
+    
+
+    /**
+     * 删除
+     */
+    @RequestMapping("/delete")
+    public R delete(@RequestBody Long[] ids){
+        newsService.deleteBatchIds(Arrays.asList(ids));
+        return R.ok();
+    }
+    
+    /**
+     * 提醒接口
+     */
+	@RequestMapping("/remind/{columnName}/{type}")
+	public R remindCount(@PathVariable("columnName") String columnName, HttpServletRequest request, 
+						 @PathVariable("type") String type,@RequestParam Map<String, Object> map) {
+		map.put("column", columnName);
+		map.put("type", type);
+		
+		if(type.equals("2")) {
+			SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
+			Calendar c = Calendar.getInstance();
+			Date remindStartDate = null;
+			Date remindEndDate = null;
+			if(map.get("remindstart")!=null) {
+				Integer remindStart = Integer.parseInt(map.get("remindstart").toString());
+				c.setTime(new Date()); 
+				c.add(Calendar.DAY_OF_MONTH,remindStart);
+				remindStartDate = c.getTime();
+				map.put("remindstart", sdf.format(remindStartDate));
+			}
+			if(map.get("remindend")!=null) {
+				Integer remindEnd = Integer.parseInt(map.get("remindend").toString());
+				c.setTime(new Date());
+				c.add(Calendar.DAY_OF_MONTH,remindEnd);
+				remindEndDate = c.getTime();
+				map.put("remindend", sdf.format(remindEndDate));
+			}
+		}
+		
+		Wrapper<NewsEntity> wrapper = new EntityWrapper<NewsEntity>();
+		if(map.get("remindstart")!=null) {
+			wrapper.ge(columnName, map.get("remindstart"));
+		}
+		if(map.get("remindend")!=null) {
+			wrapper.le(columnName, map.get("remindend"));
+		}
+
+
+		int count = newsService.selectCount(wrapper);
+		return R.ok().put("count", count);
+	}
+	
+
+
+}

src/main/java/com/dao/MessagesDao.java

@@ -0,0 +1,32 @@
+package com.dao;
+
+import com.entity.MessagesEntity;
+import com.baomidou.mybatisplus.mapper.BaseMapper;
+import java.util.List;
+import com.baomidou.mybatisplus.mapper.Wrapper;
+import com.baomidou.mybatisplus.plugins.pagination.Pagination;
+
+import org.apache.ibatis.annotations.Param;
+import com.entity.vo.MessagesVO;
+import com.entity.view.MessagesView;
+
+
+/**
+ * 留言板
+ * 
+ * @author 
+ * @email
+ */
+public interface MessagesDao extends BaseMapper<MessagesEntity> {
+	
+	List<MessagesVO> selectListVO(@Param("ew") Wrapper<MessagesEntity> wrapper);
+	
+	MessagesVO selectVO(@Param("ew") Wrapper<MessagesEntity> wrapper);
+	
+	List<MessagesView> selectListView(@Param("ew") Wrapper<MessagesEntity> wrapper);
+
+	List<MessagesView> selectListView(Pagination page,@Param("ew") Wrapper<MessagesEntity> wrapper);
+	
+	MessagesView selectView(@Param("ew") Wrapper<MessagesEntity> wrapper);
+	
+}

src/main/java/com/dao/NewsDao.java

@@ -0,0 +1,32 @@
+package com.dao;
+
+import com.entity.NewsEntity;
+import com.baomidou.mybatisplus.mapper.BaseMapper;
+import java.util.List;
+import com.baomidou.mybatisplus.mapper.Wrapper;
+import com.baomidou.mybatisplus.plugins.pagination.Pagination;
+
+import org.apache.ibatis.annotations.Param;
+import com.entity.vo.NewsVO;
+import com.entity.view.NewsView;
+
+
+/**
+ * 公告信息
+ * 
+ * @author 
+ * @email
+ */
+public interface NewsDao extends BaseMapper<NewsEntity> {
+	
+	List<NewsVO> selectListVO(@Param("ew") Wrapper<NewsEntity> wrapper);
+	
+	NewsVO selectVO(@Param("ew") Wrapper<NewsEntity> wrapper);
+	
+	List<NewsView> selectListView(@Param("ew") Wrapper<NewsEntity> wrapper);
+
+	List<NewsView> selectListView(Pagination page,@Param("ew") Wrapper<NewsEntity> wrapper);
+	
+	NewsView selectView(@Param("ew") Wrapper<NewsEntity> wrapper);
+	
+}

src/main/java/com/entity/MessagesEntity.java

@@ -0,0 +1,145 @@
+package com.entity;
+
+import com.baomidou.mybatisplus.annotations.TableId;
+import com.baomidou.mybatisplus.annotations.TableName;
+import javax.validation.constraints.NotBlank;
+import javax.validation.constraints.NotEmpty;
+import javax.validation.constraints.NotNull;
+
+import com.fasterxml.jackson.annotation.JsonIgnoreProperties;
+import java.lang.reflect.InvocationTargetException;
+
+import java.io.Serializable;
+import java.util.Date;
+import java.util.List;
+
+import org.springframework.format.annotation.DateTimeFormat;
+import com.fasterxml.jackson.annotation.JsonFormat;
+import org.apache.commons.beanutils.BeanUtils;
+import com.baomidou.mybatisplus.annotations.TableField;
+import com.baomidou.mybatisplus.enums.FieldFill;
+import com.baomidou.mybatisplus.enums.IdType;
+
+
+/**
+ * 留言板
+ * 数据库通用操作实体类（普通增删改查）
+ * @author 
+ * @email
+ */
+@TableName("messages")
+public class MessagesEntity<T> implements Serializable {
+	private static final long serialVersionUID = 1L;
+
+
+	public MessagesEntity() {
+		
+	}
+	
+	public MessagesEntity(T t) {
+		try {
+			BeanUtils.copyProperties(this, t);
+		} catch (IllegalAccessException | InvocationTargetException e) {
+			// TODO Auto-generated catch block
+			e.printStackTrace();
+		}
+	}
+	
+	/**
+	 * 主键id
+	 */
+	@TableId
+	private Long id;
+	/**
+	 * 留言人id
+	 */
+					
+	private Long userid;
+	
+	/**
+	 * 用户名
+	 */
+					
+	private String username;
+	
+	/**
+	 * 留言内容
+	 */
+					
+	private String content;
+	
+	/**
+	 * 回复内容
+	 */
+					
+	private String reply;
+	
+	
+	@JsonFormat(locale="zh", timezone="GMT+8", pattern="yyyy-MM-dd HH:mm:ss")
+	@DateTimeFormat
+	private Date addtime;
+
+	public Date getAddtime() {
+		return addtime;
+	}
+	public void setAddtime(Date addtime) {
+		this.addtime = addtime;
+	}
+
+	public Long getId() {
+		return id;
+	}
+
+	public void setId(Long id) {
+		this.id = id;
+	}
+	/**
+	 * 设置：留言人id
+	 */
+	public void setUserid(Long userid) {
+		this.userid = userid;
+	}
+	/**
+	 * 获取：留言人id
+	 */
+	public Long getUserid() {
+		return userid;
+	}
+	/**
+	 * 设置：用户名
+	 */
+	public void setUsername(String username) {
+		this.username = username;
+	}
+	/**
+	 * 获取：用户名
+	 */
+	public String getUsername() {
+		return username;
+	}
+	/**
+	 * 设置：留言内容
+	 */
+	public void setContent(String content) {
+		this.content = content;
+	}
+	/**
+	 * 获取：留言内容
+	 */
+	public String getContent() {
+		return content;
+	}
+	/**
+	 * 设置：回复内容
+	 */
+	public void setReply(String reply) {
+		this.reply = reply;
+	}
+	/**
+	 * 获取：回复内容
+	 */
+	public String getReply() {
+		return reply;
+	}
+
+}

src/main/java/com/entity/NewsEntity.java

@@ -0,0 +1,145 @@
+package com.entity;
+
+import com.baomidou.mybatisplus.annotations.TableId;
+import com.baomidou.mybatisplus.annotations.TableName;
+import javax.validation.constraints.NotBlank;
+import javax.validation.constraints.NotEmpty;
+import javax.validation.constraints.NotNull;
+
+import com.fasterxml.jackson.annotation.JsonIgnoreProperties;
+import java.lang.reflect.InvocationTargetException;
+
+import java.io.Serializable;
+import java.util.Date;
+import java.util.List;
+
+import org.springframework.format.annotation.DateTimeFormat;
+import com.fasterxml.jackson.annotation.JsonFormat;
+import org.apache.commons.beanutils.BeanUtils;
+import com.baomidou.mybatisplus.annotations.TableField;
+import com.baomidou.mybatisplus.enums.FieldFill;
+import com.baomidou.mybatisplus.enums.IdType;
+
+
+/**
+ * 公告信息
+ * 数据库通用操作实体类（普通增删改查）
+ * @author 
+ * @email
+ */
+@TableName("news")
+public class NewsEntity<T> implements Serializable {
+	private static final long serialVersionUID = 1L;
+
+
+	public NewsEntity() {
+		
+	}
+	
+	public NewsEntity(T t) {
+		try {
+			BeanUtils.copyProperties(this, t);
+		} catch (IllegalAccessException | InvocationTargetException e) {
+			// TODO Auto-generated catch block
+			e.printStackTrace();
+		}
+	}
+	
+	/**
+	 * 主键id
+	 */
+	@TableId
+	private Long id;
+	/**
+	 * 标题
+	 */
+					
+	private String title;
+	
+	/**
+	 * 简介
+	 */
+					
+	private String introduction;
+	
+	/**
+	 * 图片
+	 */
+					
+	private String picture;
+	
+	/**
+	 * 内容
+	 */
+					
+	private String content;
+	
+	
+	@JsonFormat(locale="zh", timezone="GMT+8", pattern="yyyy-MM-dd HH:mm:ss")
+	@DateTimeFormat
+	private Date addtime;
+
+	public Date getAddtime() {
+		return addtime;
+	}
+	public void setAddtime(Date addtime) {
+		this.addtime = addtime;
+	}
+
+	public Long getId() {
+		return id;
+	}
+
+	public void setId(Long id) {
+		this.id = id;
+	}
+	/**
+	 * 设置：标题
+	 */
+	public void setTitle(String title) {
+		this.title = title;
+	}
+	/**
+	 * 获取：标题
+	 */
+	public String getTitle() {
+		return title;
+	}
+	/**
+	 * 设置：简介
+	 */
+	public void setIntroduction(String introduction) {
+		this.introduction = introduction;
+	}
+	/**
+	 * 获取：简介
+	 */
+	public String getIntroduction() {
+		return introduction;
+	}
+	/**
+	 * 设置：图片
+	 */
+	public void setPicture(String picture) {
+		this.picture = picture;
+	}
+	/**
+	 * 获取：图片
+	 */
+	public String getPicture() {
+		return picture;
+	}
+	/**
+	 * 设置：内容
+	 */
+	public void setContent(String content) {
+		this.content = content;
+	}
+	/**
+	 * 获取：内容
+	 */
+	public String getContent() {
+		return content;
+	}
+
+}

src/main/java/com/entity/model/MessagesModel.java

@@ -0,0 +1,90 @@
+package com.entity.model;
+
+import com.entity.MessagesEntity;
+
+import com.baomidou.mybatisplus.annotations.TableName;
+import java.util.Date;
+import org.springframework.format.annotation.DateTimeFormat;
+
+import com.fasterxml.jackson.annotation.JsonFormat;
+import java.io.Serializable;
+ 
+
+/**
+ * 留言板
+ * 接收传参的实体类
+ * 取自ModelAndView 的model名称
+ * @author 
+ * @email
+ */
+public class MessagesModel  implements Serializable {
+	private static final long serialVersionUID = 1L;
+
+	 			
+	/**
+	 * 用户名
+	 */
+	
+	private String username;
+		
+	/**
+	 * 留言内容
+	 */
+	
+	private String content;
+		
+	/**
+	 * 回复内容
+	 */
+	
+	private String reply;
+				
+	
+	/**
+	 * 设置：用户名
+	 */
+	 
+	public void setUsername(String username) {
+		this.username = username;
+	}
+	
+	/**
+	 * 获取：用户名
+	 */
+	public String getUsername() {
+		return username;
+	}
+				
+	
+	/**
+	 * 设置：留言内容
+	 */
+	 
+	public void setContent(String content) {
+		this.content = content;
+	}
+	
+	/**
+	 * 获取：留言内容
+	 */
+	public String getContent() {
+		return content;
+	}
+				
+	
+	/**
+	 * 设置：回复内容
+	 */
+	 
+	public void setReply(String reply) {
+		this.reply = reply;
+	}
+	
+	/**
+	 * 获取：回复内容
+	 */
+	public String getReply() {
+		return reply;
+	}
+			
+}

src/main/java/com/entity/model/NewsModel.java

@@ -0,0 +1,90 @@
+package com.entity.model;
+
+import com.entity.NewsEntity;
+
+import com.baomidou.mybatisplus.annotations.TableName;
+import java.util.Date;
+import org.springframework.format.annotation.DateTimeFormat;
+
+import com.fasterxml.jackson.annotation.JsonFormat;
+import java.io.Serializable;
+ 
+
+/**
+ * 公告信息
+ * 接收传参的实体类
+ * 取自ModelAndView 的model名称
+ * @author 
+ * @email
+ */
+public class NewsModel  implements Serializable {
+	private static final long serialVersionUID = 1L;
+
+	 			
+	/**
+	 * 简介
+	 */
+	
+	private String introduction;
+		
+	/**
+	 * 图片
+	 */
+	
+	private String picture;
+		
+	/**
+	 * 内容
+	 */
+	
+	private String content;
+				
+	
+	/**
+	 * 设置：简介
+	 */
+	 
+	public void setIntroduction(String introduction) {
+		this.introduction = introduction;
+	}
+	
+	/**
+	 * 获取：简介
+	 */
+	public String getIntroduction() {
+		return introduction;
+	}
+				
+	
+	/**
+	 * 设置：图片
+	 */
+	 
+	public void setPicture(String picture) {
+		this.picture = picture;
+	}
+	
+	/**
+	 * 获取：图片
+	 */
+	public String getPicture() {
+		return picture;
+	}
+				
+	
+	/**
+	 * 设置：内容
+	 */
+	 
+	public void setContent(String content) {
+		this.content = content;
+	}
+	
+	/**
+	 * 获取：内容
+	 */
+	public String getContent() {
+		return content;
+	}
+			
+}

src/main/java/com/entity/view/MessagesView.java

@@ -0,0 +1,35 @@
+package com.entity.view;
+
+import com.entity.MessagesEntity;
+
+import com.baomidou.mybatisplus.annotations.TableName;
+import org.apache.commons.beanutils.BeanUtils;
+import java.lang.reflect.InvocationTargetException;
+
+import java.io.Serializable;
+ 
+
+/**
+ * 留言板
+ * 后端返回视图实体辅助类   
+ * （通常后端关联的表或者自定义的字段需要返回使用）
+ * @author 
+ * @email
+ */
+@TableName("messages")
+public class MessagesView  extends MessagesEntity implements Serializable {
+	private static final long serialVersionUID = 1L;
+
+	public MessagesView(){
+	}
+ 
+ 	public MessagesView(MessagesEntity messagesEntity){
+ 	try {
+			BeanUtils.copyProperties(this, messagesEntity);
+		} catch (IllegalAccessException | InvocationTargetException e) {
+			// TODO Auto-generated catch block
+			e.printStackTrace();
+		}
+ 		
+	}
+}

src/main/java/com/entity/view/NewsView.java

@@ -0,0 +1,35 @@
+package com.entity.view;
+
+import com.entity.NewsEntity;
+
+import com.baomidou.mybatisplus.annotations.TableName;
+import org.apache.commons.beanutils.BeanUtils;
+import java.lang.reflect.InvocationTargetException;
+
+import java.io.Serializable;
+ 
+
+/**
+ * 公告信息
+ * 后端返回视图实体辅助类   
+ * （通常后端关联的表或者自定义的字段需要返回使用）
+ * @author 
+ * @email
+ */
+@TableName("news")
+public class NewsView  extends NewsEntity implements Serializable {
+	private static final long serialVersionUID = 1L;
+
+	public NewsView(){
+	}
+ 
+ 	public NewsView(NewsEntity newsEntity){
+ 	try {
+			BeanUtils.copyProperties(this, newsEntity);
+		} catch (IllegalAccessException | InvocationTargetException e) {
+			// TODO Auto-generated catch block
+			e.printStackTrace();
+		}
+ 		
+	}
+}

src/main/java/com/service/MessagesService.java

@@ -0,0 +1,36 @@
+package com.service;
+
+import com.baomidou.mybatisplus.mapper.Wrapper;
+import com.baomidou.mybatisplus.service.IService;
+import com.utils.PageUtils;
+import com.entity.MessagesEntity;
+import java.util.List;
+import java.util.Map;
+import com.entity.vo.MessagesVO;
+import org.apache.ibatis.annotations.Param;
+import com.entity.view.MessagesView;
+
+
+/**
+ * 留言板
+ *
+ * @author 
+ * @email 
+ * @date 2021-03-04 18:46:21
+ */
+public interface MessagesService extends IService<MessagesEntity> {
+
+    PageUtils queryPage(Map<String, Object> params);
+    
+   	List<MessagesVO> selectListVO(Wrapper<MessagesEntity> wrapper);
+   	
+   	MessagesVO selectVO(@Param("ew") Wrapper<MessagesEntity> wrapper);
+   	
+   	List<MessagesView> selectListView(Wrapper<MessagesEntity> wrapper);
+   	
+   	MessagesView selectView(@Param("ew") Wrapper<MessagesEntity> wrapper);
+   	
+   	PageUtils queryPage(Map<String, Object> params,Wrapper<MessagesEntity> wrapper);
+   	
+}
+

src/main/java/com/service/NewsService.java

@@ -0,0 +1,36 @@
+package com.service;
+
+import com.baomidou.mybatisplus.mapper.Wrapper;
+import com.baomidou.mybatisplus.service.IService;
+import com.utils.PageUtils;
+import com.entity.NewsEntity;
+import java.util.List;
+import java.util.Map;
+import com.entity.vo.NewsVO;
+import org.apache.ibatis.annotations.Param;
+import com.entity.view.NewsView;
+
+
+/**
+ * 公告信息
+ *
+ * @author 
+ * @email 
+ * @date 2021-03-04 18:46:21
+ */
+public interface NewsService extends IService<NewsEntity> {
+
+    PageUtils queryPage(Map<String, Object> params);
+    
+   	List<NewsVO> selectListVO(Wrapper<NewsEntity> wrapper);
+   	
+   	NewsVO selectVO(@Param("ew") Wrapper<NewsEntity> wrapper);
+   	
+   	List<NewsView> selectListView(Wrapper<NewsEntity> wrapper);
+   	
+   	NewsView selectView(@Param("ew") Wrapper<NewsEntity> wrapper);
+   	
+   	PageUtils queryPage(Map<String, Object> params,Wrapper<NewsEntity> wrapper);
+   	
+}
+

src/main/java/com/service/impl/MessagesServiceImpl.java

@@ -0,0 +1,62 @@
+package com.service.impl;
+
+import org.springframework.stereotype.Service;
+import java.util.Map;
+import java.util.List;
+
+import com.baomidou.mybatisplus.mapper.Wrapper;
+import com.baomidou.mybatisplus.mapper.EntityWrapper;
+import com.baomidou.mybatisplus.plugins.Page;
+import com.baomidou.mybatisplus.service.impl.ServiceImpl;
+import com.utils.PageUtils;
+import com.utils.Query;
+
+
+import com.dao.MessagesDao;
+import com.entity.MessagesEntity;
+import com.service.MessagesService;
+import com.entity.vo.MessagesVO;
+import com.entity.view.MessagesView;
+
+@Service("messagesService")
+public class MessagesServiceImpl extends ServiceImpl<MessagesDao, MessagesEntity> implements MessagesService {
+	
+	
+    @Override
+    public PageUtils queryPage(Map<String, Object> params) {
+        Page<MessagesEntity> page = this.selectPage(
+                new Query<MessagesEntity>(params).getPage(),
+                new EntityWrapper<MessagesEntity>()
+        );
+        return new PageUtils(page);
+    }
+    
+    @Override
+	public PageUtils queryPage(Map<String, Object> params, Wrapper<MessagesEntity> wrapper) {
+		  Page<MessagesView> page =new Query<MessagesView>(params).getPage();
+	        page.setRecords(baseMapper.selectListView(page,wrapper));
+	    	PageUtils pageUtil = new PageUtils(page);
+	    	return pageUtil;
+ 	}
+    
+    @Override
+	public List<MessagesVO> selectListVO(Wrapper<MessagesEntity> wrapper) {
+ 		return baseMapper.selectListVO(wrapper);
+	}
+	
+	@Override
+	public MessagesVO selectVO(Wrapper<MessagesEntity> wrapper) {
+ 		return baseMapper.selectVO(wrapper);
+	}
+	
+	@Override
+	public List<MessagesView> selectListView(Wrapper<MessagesEntity> wrapper) {
+		return baseMapper.selectListView(wrapper);
+	}
+
+	@Override
+	public MessagesView selectView(Wrapper<MessagesEntity> wrapper) {
+		return baseMapper.selectView(wrapper);
+	}
+
+}

src/main/java/com/service/impl/NewsServiceImpl.java

@@ -0,0 +1,62 @@
+package com.service.impl;
+
+import org.springframework.stereotype.Service;
+import java.util.Map;
+import java.util.List;
+
+import com.baomidou.mybatisplus.mapper.Wrapper;
+import com.baomidou.mybatisplus.mapper.EntityWrapper;
+import com.baomidou.mybatisplus.plugins.Page;
+import com.baomidou.mybatisplus.service.impl.ServiceImpl;
+import com.utils.PageUtils;
+import com.utils.Query;
+
+
+import com.dao.NewsDao;
+import com.entity.NewsEntity;
+import com.service.NewsService;
+import com.entity.vo.NewsVO;
+import com.entity.view.NewsView;
+
+@Service("newsService")
+public class NewsServiceImpl extends ServiceImpl<NewsDao, NewsEntity> implements NewsService {
+	
+	
+    @Override
+    public PageUtils queryPage(Map<String, Object> params) {
+        Page<NewsEntity> page = this.selectPage(
+                new Query<NewsEntity>(params).getPage(),
+                new EntityWrapper<NewsEntity>()
+        );
+        return new PageUtils(page);
+    }
+    
+    @Override
+	public PageUtils queryPage(Map<String, Object> params, Wrapper<NewsEntity> wrapper) {
+		  Page<NewsView> page =new Query<NewsView>(params).getPage();
+	        page.setRecords(baseMapper.selectListView(page,wrapper));
+	    	PageUtils pageUtil = new PageUtils(page);
+	    	return pageUtil;
+ 	}
+    
+    @Override
+	public List<NewsVO> selectListVO(Wrapper<NewsEntity> wrapper) {
+ 		return baseMapper.selectListVO(wrapper);
+	}
+	
+	@Override
+	public NewsVO selectVO(Wrapper<NewsEntity> wrapper) {
+ 		return baseMapper.selectVO(wrapper);
+	}
+	
+	@Override
+	public List<NewsView> selectListView(Wrapper<NewsEntity> wrapper) {
+		return baseMapper.selectListView(wrapper);
+	}
+
+	@Override
+	public NewsView selectView(Wrapper<NewsEntity> wrapper) {
+		return baseMapper.selectView(wrapper);
+	}
+
+}

src/main/resources/admin/admin/src/views/modules/messages/add-or-update.vue

@@ -0,0 +1,436 @@
+<template>
+  <div class="addEdit-block">
+    <el-form
+      class="detail-form-content"
+      ref="ruleForm"
+      :model="ruleForm"
+      :rules="rules"
+      label-width="80px"
+	  :style="{backgroundColor:addEditForm.addEditBoxColor}"
+    >
+      <el-row>
+                                                      <el-col :span="12">
+        <el-form-item class="input" v-if="type!='info'"  label="用户名" prop="username">
+          <el-input v-model="ruleForm.username" 
+              placeholder="用户名" clearable readonly></el-input>
+        </el-form-item>
+        <div v-else>
+          <el-form-item class="input" label="用户名" prop="username">
+              <el-input v-model="ruleForm.username" 
+                placeholder="用户名" readonly></el-input>
+          </el-form-item>
+        </div>
+      </el-col>
+                                                                                          </el-row>
+                                                    <el-row>
+            <el-col :span="24">
+              <el-form-item class="textarea" v-if="type!='info'" label="留言内容" prop="content">
+                <el-input
+                  style="min-width: 200px; max-width: 600px;"
+                  type="textarea"
+                  :rows="8"
+                  placeholder="留言内容"
+                  v-model="ruleForm.content" readonly>
+                </el-input>
+              </el-form-item>
+              <div v-else>
+                <el-form-item v-if="ruleForm.content" label="留言内容" prop="content">
+                    <span>{{ruleForm.content}}</span>
+                </el-form-item>
+              </div>
+            </el-col>
+          </el-row>
+                                <el-row>
+            <el-col :span="24">
+              <el-form-item class="textarea" v-if="type!='info'" label="回复内容" prop="reply">
+                <el-input
+                  style="min-width: 200px; max-width: 600px;"
+                  type="textarea"
+                  :rows="8"
+                  placeholder="回复内容"
+                  v-model="ruleForm.reply" >
+                </el-input>
+              </el-form-item>
+              <div v-else>
+                <el-form-item v-if="ruleForm.reply" label="回复内容" prop="reply">
+                    <span>{{ruleForm.reply}}</span>
+                </el-form-item>
+              </div>
+            </el-col>
+          </el-row>
+                                                                                  <el-form-item class="btn">
+                <el-button v-if="type!='info'" type="primary" class="btn-success" @click="onSubmit">提交</el-button>
+        <el-button v-if="type!='info'" class="btn-close" @click="back()">取消</el-button>
+        <el-button v-if="type=='info'" class="btn-close" @click="back()">返回</el-button>
+      </el-form-item>
+    </el-form>
+    
+    
+  </div>
+</template>
+<script>
+// 数字，邮件，手机，url，身份证校验
+import { isNumber,isIntNumer,isEmail,isPhone, isMobile,isURL,checkIdCard } from "@/utils/validate";
+export default {
+  data() {
+    let self = this
+    var validateIdCard = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!checkIdCard(value)) {
+        callback(new Error("请输入正确的身份证号码"));
+      } else {
+        callback();
+      }
+    };
+    var validateUrl = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isURL(value)) {
+        callback(new Error("请输入正确的URL地址"));
+      } else {
+        callback();
+      }
+    };
+    var validateMobile = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isMobile(value)) {
+        callback(new Error("请输入正确的手机号码"));
+      } else {
+        callback();
+      }
+    };
+    var validatePhone = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isPhone(value)) {
+        callback(new Error("请输入正确的电话号码"));
+      } else {
+        callback();
+      }
+    };
+    var validateEmail = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isEmail(value)) {
+        callback(new Error("请输入正确的邮箱地址"));
+      } else {
+        callback();
+      }
+    };
+    var validateNumber = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isNumber(value)) {
+        callback(new Error("请输入数字"));
+      } else {
+        callback();
+      }
+    };
+    var validateIntNumber = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isIntNumer(value)) {
+        callback(new Error("请输入整数"));
+      } else {
+        callback();
+      }
+    };
+    return {
+	  addEditForm: {"btnSaveFontColor":"#fff","selectFontSize":"14px","btnCancelBorderColor":"rgba(152, 129, 129, 1)","inputBorderRadius":"22px","inputFontSize":"14px","textareaBgColor":"#fff","btnSaveFontSize":"14px","textareaBorderRadius":"22px","uploadBgColor":"#fff","textareaBorderStyle":"solid","btnCancelWidth":"88px","textareaHeight":"120px","dateBgColor":"#fff","btnSaveBorderRadius":"22px","uploadLableFontSize":"14px","textareaBorderWidth":"1px","inputLableColor":"#606266","addEditBoxColor":"rgba(210, 194, 194, 0.29)","dateIconFontSize":"14px","btnSaveBgColor":"#409EFF","uploadIconFontColor":"#8c939d","textareaBorderColor":"rgba(152, 129, 129, 1)","btnCancelBgColor":"rgba(143, 222, 143, 1)","selectLableColor":"#606266","btnSaveBorderStyle":"solid","dateBorderWidth":"1px","dateLableFontSize":"14px","dateBorderRadius":"22px","btnCancelBorderStyle":"solid","selectLableFontSize":"14px","selectBorderStyle":"solid","selectIconFontColor":"#C0C4CC","btnCancelHeight":"44px","inputHeight":"40px","btnCancelFontColor":"#606266","dateBorderColor":"rgba(152, 129, 129, 1)","dateIconFontColor":"#C0C4CC","uploadBorderStyle":"solid","dateBorderStyle":"solid","dateLableColor":"#606266","dateFontSize":"14px","inputBorderWidth":"1px","uploadIconFontSize":"28px","selectHeight":"40px","inputFontColor":"#606266","uploadHeight":"148px","textareaLableColor":"#606266","textareaLableFontSize":"14px","btnCancelFontSize":"14px","inputBorderStyle":"solid","btnCancelBorderRadius":"22px","inputBgColor":"rgba(252, 250, 250, 1)","inputLableFontSize":"14px","uploadLableColor":"#606266","uploadBorderRadius":"22px","btnSaveHeight":"44px","selectBgColor":"#fff","btnSaveWidth":"88px","selectIconFontSize":"14px","dateHeight":"40px","selectBorderColor":"rgba(152, 129, 129, 1)","inputBorderColor":"rgba(152, 129, 129, 1)","uploadBorderColor":"rgba(152, 129, 129, 1)","textareaFontColor":"#606266","selectBorderWidth":"1px","dateFontColor":"#606266","btnCancelBorderWidth":"1px","uploadBorderWidth":"1px","textareaFontSize":"14px","selectBorderRadius":"22px","selectFontColor":"#606266","btnSaveBorderColor":"#409EFF","btnSaveBorderWidth":"1px"},
+      id: '',
+      type: '',
+      ro:{
+	userid : false,
+	username : false,
+	content : false,
+	reply : false,
+      },
+            ruleForm: {
+                	        userid: '',
+	                        	        username: '',
+	                        	        content: '',
+	                        	        reply: '',
+	                      },
+                                                                    rules: {
+                  userid: [
+                            { required: true, message: '留言人id不能为空', trigger: 'blur' },
+                                    	                                                              ],
+                  username: [
+                                    	                                                              ],
+                  content: [
+                            { required: true, message: '留言内容不能为空', trigger: 'blur' },
+                                    	                                                              ],
+                  reply: [
+                                    	                                                              ],
+              }
+    };
+  },
+  props: ["parent"],
+  computed: {
+                                                      },
+  created() {
+	this.addEditStyleChange()
+	this.addEditUploadStyleChange()
+  },
+  methods: {
+        // 下载
+    download(file){
+      window.open(`${file}`)
+    },
+    // 初始化
+    init(id,type) {
+      if (id) {
+        this.id = id;
+        this.type = type;
+      }
+      if(this.type=='info'||this.type=='else'){
+        this.info(id);
+      }else if(this.type=='cross'){
+        var obj = this.$storage.getObj('crossObj');
+        for (var o in obj){
+          	            if(o=='userid'){
+            this.ruleForm.userid = obj[o];
+	    this.ro.userid = true;
+            continue;
+          }
+	            	            if(o=='username'){
+            this.ruleForm.username = obj[o];
+	    this.ro.username = true;
+            continue;
+          }
+	            	            if(o=='content'){
+            this.ruleForm.content = obj[o];
+	    this.ro.content = true;
+            continue;
+          }
+	            	            if(o=='reply'){
+            this.ruleForm.reply = obj[o];
+	    this.ro.reply = true;
+            continue;
+          }
+	                    }
+                                                                              }
+                                                                                                      },
+                                        // 多级联动参数
+                                                    info(id) {
+      this.$http({
+        url: `messages/info/${id}`,
+        method: "get"
+      }).then(({ data }) => {
+        if (data && data.code === 0) {
+          this.ruleForm = data.data;
+        } else {
+          this.$message.error(data.msg);
+        }
+      });
+    },
+        // 提交
+    onSubmit() {
+                  // ${column.compare}
+                              // ${column.compare}
+                              // ${column.compare}
+                              // ${column.compare}
+                                                                                                            this.$refs["ruleForm"].validate(valid => {
+        if (valid) {
+          this.$http({
+            url: `messages/${!this.ruleForm.id ? "save" : "update"}`,
+            method: "post",
+            data: this.ruleForm
+          }).then(({ data }) => {
+            if (data && data.code === 0) {
+              this.$message({
+                message: "操作成功",
+                type: "success",
+                duration: 1500,
+                onClose: () => {
+                  this.parent.showFlag = true;
+                  this.parent.addOrUpdateFlag = false;
+                  this.parent.messagesCrossAddOrUpdateFlag = false;
+                  this.parent.search();
+                  this.parent.contentStyleChange();
+                }
+              });
+            } else {
+              this.$message.error(data.msg);
+            }
+          });
+        }
+      });
+    },
+    // 获取uuid
+    getUUID () {
+      return new Date().getTime();
+    },
+    // 返回
+    back() {
+      this.parent.showFlag = true;
+      this.parent.addOrUpdateFlag = false;
+      this.parent.messagesCrossAddOrUpdateFlag = false;
+      this.parent.contentStyleChange();
+    },
+                                                    	addEditStyleChange() {
+	  this.$nextTick(()=>{
+	    // input
+	    document.querySelectorAll('.addEdit-block .input .el-input__inner').forEach(el=>{
+	      el.style.height = this.addEditForm.inputHeight
+	      el.style.color = this.addEditForm.inputFontColor
+	      el.style.fontSize = this.addEditForm.inputFontSize
+	      el.style.borderWidth = this.addEditForm.inputBorderWidth
+	      el.style.borderStyle = this.addEditForm.inputBorderStyle
+	      el.style.borderColor = this.addEditForm.inputBorderColor
+	      el.style.borderRadius = this.addEditForm.inputBorderRadius
+	      el.style.backgroundColor = this.addEditForm.inputBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .input .el-form-item__label').forEach(el=>{
+	      el.style.lineHeight = this.addEditForm.inputHeight
+	      el.style.color = this.addEditForm.inputLableColor
+	      el.style.fontSize = this.addEditForm.inputLableFontSize
+	    })
+	    // select
+	    document.querySelectorAll('.addEdit-block .select .el-input__inner').forEach(el=>{
+	      el.style.height = this.addEditForm.selectHeight
+	      el.style.color = this.addEditForm.selectFontColor
+	      el.style.fontSize = this.addEditForm.selectFontSize
+	      el.style.borderWidth = this.addEditForm.selectBorderWidth
+	      el.style.borderStyle = this.addEditForm.selectBorderStyle
+	      el.style.borderColor = this.addEditForm.selectBorderColor
+	      el.style.borderRadius = this.addEditForm.selectBorderRadius
+	      el.style.backgroundColor = this.addEditForm.selectBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .select .el-form-item__label').forEach(el=>{
+	      el.style.lineHeight = this.addEditForm.selectHeight
+	      el.style.color = this.addEditForm.selectLableColor
+	      el.style.fontSize = this.addEditForm.selectLableFontSize
+	    })
+	    document.querySelectorAll('.addEdit-block .select .el-select__caret').forEach(el=>{
+	      el.style.color = this.addEditForm.selectIconFontColor
+	      el.style.fontSize = this.addEditForm.selectIconFontSize
+	    })
+	    // date
+	    document.querySelectorAll('.addEdit-block .date .el-input__inner').forEach(el=>{
+	      el.style.height = this.addEditForm.dateHeight
+	      el.style.color = this.addEditForm.dateFontColor
+	      el.style.fontSize = this.addEditForm.dateFontSize
+	      el.style.borderWidth = this.addEditForm.dateBorderWidth
+	      el.style.borderStyle = this.addEditForm.dateBorderStyle
+	      el.style.borderColor = this.addEditForm.dateBorderColor
+	      el.style.borderRadius = this.addEditForm.dateBorderRadius
+	      el.style.backgroundColor = this.addEditForm.dateBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .date .el-form-item__label').forEach(el=>{
+	      el.style.lineHeight = this.addEditForm.dateHeight
+	      el.style.color = this.addEditForm.dateLableColor
+	      el.style.fontSize = this.addEditForm.dateLableFontSize
+	    })
+	    document.querySelectorAll('.addEdit-block .date .el-input__icon').forEach(el=>{
+	      el.style.color = this.addEditForm.dateIconFontColor
+	      el.style.fontSize = this.addEditForm.dateIconFontSize
+	      el.style.lineHeight = this.addEditForm.dateHeight
+	    })
+	    // upload
+	    let iconLineHeight = parseInt(this.addEditForm.uploadHeight) - parseInt(this.addEditForm.uploadBorderWidth) * 2 + 'px'
+	    document.querySelectorAll('.addEdit-block .upload .el-upload--picture-card').forEach(el=>{
+	      el.style.width = this.addEditForm.uploadHeight
+	      el.style.height = this.addEditForm.uploadHeight
+	      el.style.borderWidth = this.addEditForm.uploadBorderWidth
+	      el.style.borderStyle = this.addEditForm.uploadBorderStyle
+	      el.style.borderColor = this.addEditForm.uploadBorderColor
+	      el.style.borderRadius = this.addEditForm.uploadBorderRadius
+	      el.style.backgroundColor = this.addEditForm.uploadBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .upload .el-form-item__label').forEach(el=>{
+	      el.style.lineHeight = this.addEditForm.uploadHeight
+	      el.style.color = this.addEditForm.uploadLableColor
+	      el.style.fontSize = this.addEditForm.uploadLableFontSize
+	    })
+	    document.querySelectorAll('.addEdit-block .upload .el-icon-plus').forEach(el=>{
+	      el.style.color = this.addEditForm.uploadIconFontColor
+	      el.style.fontSize = this.addEditForm.uploadIconFontSize
+	      el.style.lineHeight = iconLineHeight
+	      el.style.display = 'block'
+	    })
+	    // 多文本输入框
+	    document.querySelectorAll('.addEdit-block .textarea .el-textarea__inner').forEach(el=>{
+	      el.style.height = this.addEditForm.textareaHeight
+	      el.style.color = this.addEditForm.textareaFontColor
+	      el.style.fontSize = this.addEditForm.textareaFontSize
+	      el.style.borderWidth = this.addEditForm.textareaBorderWidth
+	      el.style.borderStyle = this.addEditForm.textareaBorderStyle
+	      el.style.borderColor = this.addEditForm.textareaBorderColor
+	      el.style.borderRadius = this.addEditForm.textareaBorderRadius
+	      el.style.backgroundColor = this.addEditForm.textareaBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .textarea .el-form-item__label').forEach(el=>{
+	      // el.style.lineHeight = this.addEditForm.textareaHeight
+	      el.style.color = this.addEditForm.textareaLableColor
+	      el.style.fontSize = this.addEditForm.textareaLableFontSize
+	    })
+	    // 保存
+	    document.querySelectorAll('.addEdit-block .btn .btn-success').forEach(el=>{
+	      el.style.width = this.addEditForm.btnSaveWidth
+	      el.style.height = this.addEditForm.btnSaveHeight
+	      el.style.color = this.addEditForm.btnSaveFontColor
+	      el.style.fontSize = this.addEditForm.btnSaveFontSize
+	      el.style.borderWidth = this.addEditForm.btnSaveBorderWidth
+	      el.style.borderStyle = this.addEditForm.btnSaveBorderStyle
+	      el.style.borderColor = this.addEditForm.btnSaveBorderColor
+	      el.style.borderRadius = this.addEditForm.btnSaveBorderRadius
+	      el.style.backgroundColor = this.addEditForm.btnSaveBgColor
+	    })
+	    // 返回
+	    document.querySelectorAll('.addEdit-block .btn .btn-close').forEach(el=>{
+	      el.style.width = this.addEditForm.btnCancelWidth
+	      el.style.height = this.addEditForm.btnCancelHeight
+	      el.style.color = this.addEditForm.btnCancelFontColor
+	      el.style.fontSize = this.addEditForm.btnCancelFontSize
+	      el.style.borderWidth = this.addEditForm.btnCancelBorderWidth
+	      el.style.borderStyle = this.addEditForm.btnCancelBorderStyle
+	      el.style.borderColor = this.addEditForm.btnCancelBorderColor
+	      el.style.borderRadius = this.addEditForm.btnCancelBorderRadius
+	      el.style.backgroundColor = this.addEditForm.btnCancelBgColor
+	    })
+	  })
+	},
+	addEditUploadStyleChange() {
+		this.$nextTick(()=>{
+		  document.querySelectorAll('.addEdit-block .upload .el-upload-list--picture-card .el-upload-list__item').forEach(el=>{
+			el.style.width = this.addEditForm.uploadHeight
+			el.style.height = this.addEditForm.uploadHeight
+			el.style.borderWidth = this.addEditForm.uploadBorderWidth
+			el.style.borderStyle = this.addEditForm.uploadBorderStyle
+			el.style.borderColor = this.addEditForm.uploadBorderColor
+			el.style.borderRadius = this.addEditForm.uploadBorderRadius
+			el.style.backgroundColor = this.addEditForm.uploadBgColor
+		  })
+	  })
+	},
+  }
+};
+</script>
+<style lang="scss">
+.editor{
+  height: 500px;
+  
+  & /deep/ .ql-container {
+	  height: 310px;
+  }
+}
+.amap-wrapper {
+  width: 100%;
+  height: 500px;
+}
+.search-box {
+  position: absolute;
+}
+.addEdit-block {
+	margin: -10px;
+}
+.detail-form-content {
+	padding: 12px;
+}
+.btn .el-button {
+  padding: 0;
+}
+</style>

src/main/resources/admin/admin/src/views/modules/messages/list.vue

@@ -0,0 +1,532 @@
+<template>
+  <div class="main-content">
+    <!-- 列表页 -->
+    <div v-if="showFlag">
+      <el-form :inline="true" :model="searchForm" class="form-content">
+        <el-row :gutter="20" class="slt" :style="{justifyContent:contents.searchBoxPosition=='1'?'flex-start':contents.searchBoxPosition=='2'?'center':'flex-end'}">
+                                                                          <el-form-item :label="contents.inputTitle == 1 ? '用户名' : ''">
+                  <el-input v-if="contents.inputIcon == 1 && contents.inputIconPosition == 1" prefix-icon="el-icon-search" v-model="searchForm.username" placeholder="用户名" clearable></el-input>
+                  <el-input v-if="contents.inputIcon == 1 && contents.inputIconPosition == 2" suffix-icon="el-icon-search" v-model="searchForm.username" placeholder="用户名" clearable></el-input>
+                  <el-input v-if="contents.inputIcon == 0" v-model="searchForm.username" placeholder="用户名" clearable></el-input>
+                </el-form-item>
+                                                                                          <el-form-item>
+            <el-button v-if="contents.searchBtnIcon == 1 && contents.searchBtnIconPosition == 1" icon="el-icon-search" type="success" @click="search()">{{ contents.searchBtnFont == 1?'查询':'' }}</el-button>
+            <el-button v-if="contents.searchBtnIcon == 1 && contents.searchBtnIconPosition == 2" type="success" @click="search()">{{ contents.searchBtnFont == 1?'查询':'' }}<i class="el-icon-search el-icon--right"/></el-button>
+            <el-button v-if="contents.searchBtnIcon == 0" type="success" @click="search()">{{ contents.searchBtnFont == 1?'查询':'' }}</el-button>
+          </el-form-item>
+        </el-row>
+        <el-row class="ad" :style="{justifyContent:contents.btnAdAllBoxPosition=='1'?'flex-start':contents.btnAdAllBoxPosition=='2'?'center':'flex-end'}">
+          <el-form-item>
+            <el-button
+              v-if="isAuth('messages','新增') && contents.btnAdAllIcon == 1 && contents.btnAdAllIconPosition == 1"
+              type="success"
+              icon="el-icon-plus"
+              @click="addOrUpdateHandler()"
+            >{{ contents.btnAdAllFont == 1?'新增':'' }}</el-button>
+            <el-button
+              v-if="isAuth('messages','新增') && contents.btnAdAllIcon == 1 && contents.btnAdAllIconPosition == 2"
+              type="success"
+              @click="addOrUpdateHandler()"
+            >{{ contents.btnAdAllFont == 1?'新增':'' }}<i class="el-icon-plus el-icon--right" /></el-button>
+            <el-button
+              v-if="isAuth('messages','新增') && contents.btnAdAllIcon == 0"
+              type="success"
+              @click="addOrUpdateHandler()"
+            >{{ contents.btnAdAllFont == 1?'新增':'' }}</el-button>
+            <el-button
+              v-if="isAuth('messages','删除') && contents.btnAdAllIcon == 1 && contents.btnAdAllIconPosition == 1 && contents.tableSelection"
+              :disabled="dataListSelections.length <= 0"
+              type="danger"
+              icon="el-icon-delete"
+              @click="deleteHandler()"
+            >{{ contents.btnAdAllFont == 1?'删除':'' }}</el-button>
+            <el-button
+              v-if="isAuth('messages','删除') && contents.btnAdAllIcon == 1 && contents.btnAdAllIconPosition == 2 && contents.tableSelection"
+              :disabled="dataListSelections.length <= 0"
+              type="danger"
+              @click="deleteHandler()"
+            >{{ contents.btnAdAllFont == 1?'删除':'' }}<i class="el-icon-delete el-icon--right" /></el-button>
+            <el-button
+              v-if="isAuth('messages','删除') && contents.btnAdAllIcon == 0 && contents.tableSelection"
+              :disabled="dataListSelections.length <= 0"
+              type="danger"
+              @click="deleteHandler()"
+            >{{ contents.btnAdAllFont == 1?'删除':'' }}</el-button>
+
+
+                      </el-form-item>
+        </el-row>
+      </el-form>
+      <div class="table-content">
+        <el-table class="tables" :size="contents.tableSize" :show-header="contents.tableShowHeader"
+            :header-row-style="headerRowStyle" :header-cell-style="headerCellStyle"
+            :border="contents.tableBorder"
+            :fit="contents.tableFit"
+            :stripe="contents.tableStripe"
+            :row-style="rowStyle"
+            :cell-style="cellStyle"
+            :style="{width: '100%',fontSize:contents.tableContentFontSize,color:contents.tableContentFontColor}"
+            v-if="isAuth('messages','查看')"
+            :data="dataList"
+            v-loading="dataListLoading"
+            @selection-change="selectionChangeHandler">
+            <el-table-column  v-if="contents.tableSelection"
+                type="selection"
+                header-align="center"
+                align="center"
+                width="50">
+            </el-table-column>
+            <el-table-column label="索引" v-if="contents.tableIndex" type="index" width="50" />
+            	                                    	                	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="username"
+                    header-align="center"
+		    label="用户名">
+		     <template slot-scope="scope">
+                       {{scope.row.username}}
+                     </template>
+                </el-table-column>
+                	                	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="content"
+                    header-align="center"
+		    label="留言内容">
+		     <template slot-scope="scope">
+                       {{scope.row.content}}
+                     </template>
+                </el-table-column>
+                	                	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="reply"
+                    header-align="center"
+		    label="回复内容">
+		     <template slot-scope="scope">
+                       {{scope.row.reply}}
+                     </template>
+                </el-table-column>
+                	                                        <el-table-column width="300" :align="contents.tableAlign"
+                header-align="center"
+                label="操作">
+                <template slot-scope="scope">
+                                <el-button v-if="isAuth('messages','查看') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 1" type="success" icon="el-icon-tickets" size="mini" @click="addOrUpdateHandler(scope.row.id,'info')">{{ contents.tableBtnFont == 1?'详情':'' }}</el-button>
+                <el-button v-if="isAuth('messages','查看') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 2" type="success" size="mini" @click="addOrUpdateHandler(scope.row.id,'info')">{{ contents.tableBtnFont == 1?'详情':'' }}<i class="el-icon-tickets el-icon--right" /></el-button>
+                <el-button v-if="isAuth('messages','查看') && contents.tableBtnIcon == 0" type="success" size="mini" @click="addOrUpdateHandler(scope.row.id,'info')">{{ contents.tableBtnFont == 1?'详情':'' }}</el-button>
+                                                <el-button v-if="isAuth('messages','修改') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 1" type="primary" icon="el-icon-edit" size="mini" @click="addOrUpdateHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'修改':'' }}</el-button>
+                <el-button v-if="isAuth('messages','修改') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 2" type="primary" size="mini" @click="addOrUpdateHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'修改':'' }}<i class="el-icon-edit el-icon--right" /></el-button>
+                <el-button v-if="isAuth('messages','修改') && contents.tableBtnIcon == 0" type="primary" size="mini" @click="addOrUpdateHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'修改':'' }}</el-button>
+
+
+
+
+                <el-button v-if="isAuth('messages','回复') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 1" type="primary" icon="el-icon-edit" size="mini" @click="addOrUpdateHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'回复':'' }}</el-button>
+                <el-button v-if="isAuth('messages','回复') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 2" type="primary" size="mini" @click="addOrUpdateHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'回复':'' }}<i class="el-icon-edit el-icon--right" /></el-button>
+                <el-button v-if="isAuth('messages','回复') && contents.tableBtnIcon == 0" type="primary" size="mini" @click="addOrUpdateHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'回复':'' }}</el-button>
+                <el-button v-if="isAuth('messages','删除') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 1" type="danger" icon="el-icon-delete" size="mini" @click="deleteHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'删除':'' }}</el-button>
+                <el-button v-if="isAuth('messages','删除') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 2" type="danger" size="mini" @click="deleteHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'删除':'' }}<i class="el-icon-delete el-icon--right" /></el-button>
+                <el-button v-if="isAuth('messages','删除') && contents.tableBtnIcon == 0" type="danger" size="mini" @click="deleteHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'删除':'' }}</el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+                                                                                <el-pagination
+          clsss="pages"
+          :layout="layouts"
+          @size-change="sizeChangeHandle"
+          @current-change="currentChangeHandle"
+          :current-page="pageIndex"
+          :page-sizes="[10, 20, 50, 100]"
+          :page-size="Number(contents.pageEachNum)"
+          :total="totalPage"
+          :small="contents.pageStyle"
+          class="pagination-content"
+          :background="contents.pageBtnBG"
+          :style="{textAlign:contents.pagePosition==1?'left':contents.pagePosition==2?'center':'right'}"
+        ></el-pagination>
+      </div>
+    </div>
+    <!-- 添加/修改页面  将父组件的search方法传递给子组件-->
+    <add-or-update v-if="addOrUpdateFlag" :parent="this" ref="addOrUpdate"></add-or-update>
+
+    
+    
+      </div>
+</template>
+<script>
+import AddOrUpdate from "./add-or-update";
+export default {
+  data() {
+    return {
+                                                                                                searchForm: {
+        key: ""
+      },
+      dataList: [],
+      pageIndex: 1,
+      pageSize: 10,
+      totalPage: 0,
+      dataListLoading: false,
+      dataListSelections: [],
+      showFlag: true,
+      sfshVisiable: false,
+      shForm: {},
+      chartVisiable: false,
+      addOrUpdateFlag:false,
+            contents:{"searchBtnFontColor":"#333","pagePosition":"1","inputFontSize":"14px","inputBorderRadius":"22px","tableBtnDelFontColor":"#333","tableBtnIconPosition":"1","searchBtnHeight":"40px","inputIconColor":"rgba(66, 130, 129, 1)","searchBtnBorderRadius":"22px","tableStripe":false,"btnAdAllWarnFontColor":"#333","tableBtnDelBgColor":"rgba(244, 150, 150, 1)","searchBtnIcon":"1","tableSize":"medium","searchBtnBorderStyle":"solid","tableSelection":true,"searchBtnBorderWidth":"1px","tableContentFontSize":"14px","searchBtnBgColor":"rgba(153, 239, 237, 1)","inputTitleSize":"14px","btnAdAllBorderColor":"#DCDFE6","pageJumper":true,"btnAdAllIconPosition":"1","searchBoxPosition":"1","tableBtnDetailFontColor":"#333","tableBtnHeight":"40px","pagePager":true,"searchBtnBorderColor":"#DCDFE6","tableHeaderFontColor":"rgba(33, 34, 35, 1)","inputTitle":"1","tableBtnBorderRadius":"22px","btnAdAllFont":"1","btnAdAllDelFontColor":"rgba(21, 20, 20, 1)","tableBtnIcon":"1","btnAdAllHeight":"40px","btnAdAllWarnBgColor":"rgba(238, 236, 126, 1)","btnAdAllBorderWidth":"1px","tableStripeFontColor":"#606266","tableBtnBorderStyle":"solid","inputHeight":"40px","btnAdAllBorderRadius":"22px","btnAdAllDelBgColor":"rgba(234, 93, 93, 0.69)","pagePrevNext":true,"btnAdAllAddBgColor":"rgba(153, 239, 237, 1)","searchBtnFont":"1","tableIndex":true,"btnAdAllIcon":"1","tableSortable":true,"pageSizes":true,"tableFit":true,"pageBtnBG":true,"searchBtnFontSize":"14px","tableBtnEditBgColor":"rgba(240, 242, 124, 1)","inputBorderWidth":"1px","inputFontPosition":"1","inputFontColor":"#333","pageEachNum":10,"tableHeaderBgColor":"rgba(152, 129, 129, 1)","inputTitleColor":"#333","btnAdAllBoxPosition":"1","tableBtnDetailBgColor":"rgba(171, 239, 239, 1)","inputIcon":"0","searchBtnIconPosition":"1","btnAdAllFontSize":"14px","inputBorderStyle":"solid","inputBgColor":"rgba(197, 174, 174, 0.32)","pageStyle":false,"pageTotal":true,"btnAdAllAddFontColor":"#333","tableBtnFont":"1","tableContentFontColor":"rgba(22, 22, 23, 1)","inputBorderColor":"rgba(152, 129, 129, 1)","tableShowHeader":true,"tableBtnFontSize":"14px","tableBtnBorderColor":"rgba(196, 210, 244, 1)","inputIconPosition":"1","tableBorder":true,"btnAdAllBorderStyle":"solid","tableBtnBorderWidth":"1px","tableStripeBgColor":"rgba(213, 197, 197, 1)","tableBtnEditFontColor":"#333","tableAlign":"center"},
+      layouts: '',
+
+
+    };
+  },
+  created() {
+    this.init();
+    this.getDataList();
+    this.contentStyleChange()
+  },
+  mounted() {
+
+  },
+  filters: {
+    htmlfilter: function (val) {
+      return val.replace(/<[^>]*>/g).replace(/undefined/g,'');
+    }
+  },
+  components: {
+    AddOrUpdate,
+      },
+  methods: {
+    contentStyleChange() {
+      this.contentSearchStyleChange()
+      this.contentBtnAdAllStyleChange()
+      this.contentSearchBtnStyleChange()
+      this.contentTableBtnStyleChange()
+      this.contentPageStyleChange()
+    },
+    contentSearchStyleChange() {
+      this.$nextTick(()=>{
+        document.querySelectorAll('.form-content .slt .el-input__inner').forEach(el=>{
+          let textAlign = 'left'
+          if(this.contents.inputFontPosition == 2) textAlign = 'center'
+          if(this.contents.inputFontPosition == 3) textAlign = 'right'
+          el.style.textAlign = textAlign
+          el.style.height = this.contents.inputHeight
+          el.style.lineHeight = this.contents.inputHeight
+          el.style.color = this.contents.inputFontColor
+          el.style.fontSize = this.contents.inputFontSize
+          el.style.borderWidth = this.contents.inputBorderWidth
+          el.style.borderStyle = this.contents.inputBorderStyle
+          el.style.borderColor = this.contents.inputBorderColor
+          el.style.borderRadius = this.contents.inputBorderRadius
+          el.style.backgroundColor = this.contents.inputBgColor
+        })
+        if(this.contents.inputTitle) {
+          document.querySelectorAll('.form-content .slt .el-form-item__label').forEach(el=>{
+            el.style.color = this.contents.inputTitleColor
+            el.style.fontSize = this.contents.inputTitleSize
+            el.style.lineHeight = this.contents.inputHeight
+          })
+        }
+        setTimeout(()=>{
+          document.querySelectorAll('.form-content .slt .el-input__prefix').forEach(el=>{
+            el.style.color = this.contents.inputIconColor
+            el.style.lineHeight = this.contents.inputHeight
+          })
+          document.querySelectorAll('.form-content .slt .el-input__suffix').forEach(el=>{
+            el.style.color = this.contents.inputIconColor
+            el.style.lineHeight = this.contents.inputHeight
+          })
+          document.querySelectorAll('.form-content .slt .el-input__icon').forEach(el=>{
+            el.style.lineHeight = this.contents.inputHeight
+          })
+        },10)
+
+      })
+    },
+    // 搜索按钮
+    contentSearchBtnStyleChange() {
+      this.$nextTick(()=>{
+        document.querySelectorAll('.form-content .slt .el-button--success').forEach(el=>{
+          el.style.height = this.contents.searchBtnHeight
+          el.style.color = this.contents.searchBtnFontColor
+          el.style.fontSize = this.contents.searchBtnFontSize
+          el.style.borderWidth = this.contents.searchBtnBorderWidth
+          el.style.borderStyle = this.contents.searchBtnBorderStyle
+          el.style.borderColor = this.contents.searchBtnBorderColor
+          el.style.borderRadius = this.contents.searchBtnBorderRadius
+          el.style.backgroundColor = this.contents.searchBtnBgColor
+        })
+      })
+    },
+    // 新增、批量删除
+    contentBtnAdAllStyleChange() {
+      this.$nextTick(()=>{
+        document.querySelectorAll('.form-content .ad .el-button--success').forEach(el=>{
+          el.style.height = this.contents.btnAdAllHeight
+          el.style.color = this.contents.btnAdAllAddFontColor
+          el.style.fontSize = this.contents.btnAdAllFontSize
+          el.style.borderWidth = this.contents.btnAdAllBorderWidth
+          el.style.borderStyle = this.contents.btnAdAllBorderStyle
+          el.style.borderColor = this.contents.btnAdAllBorderColor
+          el.style.borderRadius = this.contents.btnAdAllBorderRadius
+          el.style.backgroundColor = this.contents.btnAdAllAddBgColor
+        })
+        document.querySelectorAll('.form-content .ad .el-button--danger').forEach(el=>{
+          el.style.height = this.contents.btnAdAllHeight
+          el.style.color = this.contents.btnAdAllDelFontColor
+          el.style.fontSize = this.contents.btnAdAllFontSize
+          el.style.borderWidth = this.contents.btnAdAllBorderWidth
+          el.style.borderStyle = this.contents.btnAdAllBorderStyle
+          el.style.borderColor = this.contents.btnAdAllBorderColor
+          el.style.borderRadius = this.contents.btnAdAllBorderRadius
+          el.style.backgroundColor = this.contents.btnAdAllDelBgColor
+        })
+        document.querySelectorAll('.form-content .ad .el-button--warning').forEach(el=>{
+          el.style.height = this.contents.btnAdAllHeight
+          el.style.color = this.contents.btnAdAllWarnFontColor
+          el.style.fontSize = this.contents.btnAdAllFontSize
+          el.style.borderWidth = this.contents.btnAdAllBorderWidth
+          el.style.borderStyle = this.contents.btnAdAllBorderStyle
+          el.style.borderColor = this.contents.btnAdAllBorderColor
+          el.style.borderRadius = this.contents.btnAdAllBorderRadius
+          el.style.backgroundColor = this.contents.btnAdAllWarnBgColor
+        })
+      })
+    },
+    // 表格
+    rowStyle({ row, rowIndex}) {
+      if (rowIndex % 2 == 1) {
+        if(this.contents.tableStripe) {
+          return {color:this.contents.tableStripeFontColor}
+        }
+      } else {
+        return ''
+      }
+    },
+    cellStyle({ row, rowIndex}){
+      if (rowIndex % 2 == 1) {
+        if(this.contents.tableStripe) {
+          return {backgroundColor:this.contents.tableStripeBgColor}
+        }
+      } else {
+        return ''
+      }
+    },
+    headerRowStyle({ row, rowIndex}){
+      return {color: this.contents.tableHeaderFontColor}
+    },
+    headerCellStyle({ row, rowIndex}){
+      return {backgroundColor: this.contents.tableHeaderBgColor}
+    },
+    // 表格按钮
+    contentTableBtnStyleChange(){
+      // this.$nextTick(()=>{
+      //   setTimeout(()=>{
+      //     document.querySelectorAll('.table-content .tables .el-table__body .el-button--success').forEach(el=>{
+      //       el.style.height = this.contents.tableBtnHeight
+      //       el.style.color = this.contents.tableBtnDetailFontColor
+      //       el.style.fontSize = this.contents.tableBtnFontSize
+      //       el.style.borderWidth = this.contents.tableBtnBorderWidth
+      //       el.style.borderStyle = this.contents.tableBtnBorderStyle
+      //       el.style.borderColor = this.contents.tableBtnBorderColor
+      //       el.style.borderRadius = this.contents.tableBtnBorderRadius
+      //       el.style.backgroundColor = this.contents.tableBtnDetailBgColor
+      //     })
+      //     document.querySelectorAll('.table-content .tables .el-table__body .el-button--primary').forEach(el=>{
+      //       el.style.height = this.contents.tableBtnHeight
+      //       el.style.color = this.contents.tableBtnEditFontColor
+      //       el.style.fontSize = this.contents.tableBtnFontSize
+      //       el.style.borderWidth = this.contents.tableBtnBorderWidth
+      //       el.style.borderStyle = this.contents.tableBtnBorderStyle
+      //       el.style.borderColor = this.contents.tableBtnBorderColor
+      //       el.style.borderRadius = this.contents.tableBtnBorderRadius
+      //       el.style.backgroundColor = this.contents.tableBtnEditBgColor
+      //     })
+      //     document.querySelectorAll('.table-content .tables .el-table__body .el-button--danger').forEach(el=>{
+      //       el.style.height = this.contents.tableBtnHeight
+      //       el.style.color = this.contents.tableBtnDelFontColor
+      //       el.style.fontSize = this.contents.tableBtnFontSize
+      //       el.style.borderWidth = this.contents.tableBtnBorderWidth
+      //       el.style.borderStyle = this.contents.tableBtnBorderStyle
+      //       el.style.borderColor = this.contents.tableBtnBorderColor
+      //       el.style.borderRadius = this.contents.tableBtnBorderRadius
+      //       el.style.backgroundColor = this.contents.tableBtnDelBgColor
+      //     })
+
+      //   }, 50)
+      // })
+    },
+    // 分页
+    contentPageStyleChange(){
+      let arr = []
+
+      if(this.contents.pageTotal) arr.push('total')
+      if(this.contents.pageSizes) arr.push('sizes')
+      if(this.contents.pagePrevNext){
+        arr.push('prev')
+        if(this.contents.pagePager) arr.push('pager')
+        arr.push('next')
+      }
+      if(this.contents.pageJumper) arr.push('jumper')
+      this.layouts = arr.join()
+      this.contents.pageEachNum = 10
+    },
+
+                init () {
+                                                                                                                                      },
+    search() {
+      this.pageIndex = 1;
+      this.getDataList();
+    },
+    // 获取数据列表
+    getDataList() {
+      this.dataListLoading = true;
+      let params = {
+        page: this.pageIndex,
+        limit: this.pageSize,
+        sort: 'id',
+      }
+                                                                if(this.searchForm.username!='' && this.searchForm.username!=undefined){
+            params['username'] = '%' + this.searchForm.username + '%'
+          }
+                                                                          this.$http({
+        url: "messages/page",
+        method: "get",
+        params: params
+      }).then(({ data }) => {
+        if (data && data.code === 0) {
+          this.dataList = data.data.list;
+          this.totalPage = data.data.total;
+        } else {
+          this.dataList = [];
+          this.totalPage = 0;
+        }
+        this.dataListLoading = false;
+      });
+    },
+    // 每页数
+    sizeChangeHandle(val) {
+      this.pageSize = val;
+      this.pageIndex = 1;
+      this.getDataList();
+    },
+    // 当前页
+    currentChangeHandle(val) {
+      this.pageIndex = val;
+      this.getDataList();
+    },
+    // 多选
+    selectionChangeHandler(val) {
+      this.dataListSelections = val;
+    },
+    // 添加/修改
+    addOrUpdateHandler(id,type) {
+      this.showFlag = false;
+      this.addOrUpdateFlag = true;
+      this.crossAddOrUpdateFlag = false;
+      if(type!='info'){
+        type = 'else';
+      }
+      this.$nextTick(() => {
+        this.$refs.addOrUpdate.init(id,type);
+      });
+    },
+    // 查看评论
+        // 下载
+    download(file){
+      window.open(`${file}`)
+    },
+    // 删除
+    deleteHandler(id) {
+      var ids = id
+        ? [Number(id)]
+        : this.dataListSelections.map(item => {
+            return Number(item.id);
+          });
+      this.$confirm(`确定进行[${id ? "删除" : "批量删除"}]操作?`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(() => {
+        this.$http({
+          url: "messages/delete",
+          method: "post",
+          data: ids
+        }).then(({ data }) => {
+          if (data && data.code === 0) {
+            this.$message({
+              message: "操作成功",
+              type: "success",
+              duration: 1500,
+              onClose: () => {
+                this.search();
+              }
+            });
+          } else {
+            this.$message.error(data.msg);
+          }
+        });
+      });
+    },
+  }
+
+};
+</script>
+<style lang="scss" scoped>
+  .slt {
+    margin: 0 !important;
+    display: flex;
+  }
+
+  .ad {
+    margin: 0 !important;
+    display: flex;
+  }
+
+  .pages {
+    & /deep/ el-pagination__sizes{
+      & /deep/ el-input__inner {
+        height: 22px;
+        line-height: 22px;
+      }
+    }
+  }
+  
+
+  .el-button+.el-button {
+    margin:0;
+  } 
+
+  .tables {
+	& /deep/ .el-button--success {
+		height: 40px;
+		color: #333;
+		font-size: 14px;
+		border-width: 1px;
+		border-style: solid;
+		border-color: rgba(196, 210, 244, 1);
+		border-radius: 22px;
+		background-color: rgba(171, 239, 239, 1);
+	}
+	
+	& /deep/ .el-button--primary {
+		height: 40px;
+		color: #333;
+		font-size: 14px;
+		border-width: 1px;
+		border-style: solid;
+		border-color: rgba(196, 210, 244, 1);
+		border-radius: 22px;
+		background-color: rgba(240, 242, 124, 1);
+	}
+	
+	& /deep/ .el-button--danger {
+		height: 40px;
+		color: #333;
+		font-size: 14px;
+		border-width: 1px;
+		border-style: solid;
+		border-color: rgba(196, 210, 244, 1);
+		border-radius: 22px;
+		background-color: rgba(244, 150, 150, 1);
+	}
+
+    & /deep/ .el-button {
+      margin: 4px;
+    }
+  }
+
+</style>

src/main/resources/admin/admin/src/views/modules/news/add-or-update.vue

@@ -0,0 +1,457 @@
+<template>
+  <div class="addEdit-block">
+    <el-form
+      class="detail-form-content"
+      ref="ruleForm"
+      :model="ruleForm"
+      :rules="rules"
+      label-width="80px"
+	  :style="{backgroundColor:addEditForm.addEditBoxColor}"
+    >
+      <el-row>
+                        <el-col :span="12">
+        <el-form-item class="input" v-if="type!='info'"  label="标题" prop="title">
+          <el-input v-model="ruleForm.title" 
+              placeholder="标题" clearable  :readonly="ro.title"></el-input>
+        </el-form-item>
+        <div v-else>
+          <el-form-item class="input" label="标题" prop="title">
+              <el-input v-model="ruleForm.title" 
+                placeholder="标题" readonly></el-input>
+          </el-form-item>
+        </div>
+      </el-col>
+                                                                  <el-col :span="24">  
+        <el-form-item class="upload" v-if="type!='info' && !ro.picture" label="图片" prop="picture">
+          <file-upload
+          tip="点击上传图片"
+          action="file/upload"
+          :limit="3"
+          :multiple="true"
+          :fileUrls="ruleForm.picture?ruleForm.picture:''"
+          @change="pictureUploadChange"
+          ></file-upload>
+        </el-form-item>
+        <div v-else>
+          <el-form-item v-if="ruleForm.picture" label="图片" prop="picture">
+            <img style="margin-right:20px;" v-bind:key="index" v-for="(item,index) in ruleForm.picture.split(',')" :src="item" width="100" height="100">
+          </el-form-item>
+        </div>
+      </el-col>
+                                                            </el-row>
+                                      <el-row>
+            <el-col :span="24">
+              <el-form-item class="textarea" v-if="type!='info'" label="简介" prop="introduction">
+                <el-input
+                  style="min-width: 200px; max-width: 600px;"
+                  type="textarea"
+                  :rows="8"
+                  placeholder="简介"
+                  v-model="ruleForm.introduction" >
+                </el-input>
+              </el-form-item>
+              <div v-else>
+                <el-form-item v-if="ruleForm.introduction" label="简介" prop="introduction">
+                    <span>{{ruleForm.introduction}}</span>
+                </el-form-item>
+              </div>
+            </el-col>
+          </el-row>
+                                                                                                            <el-row>
+            <el-col :span="24">
+              <el-form-item v-if="type!='info'"  label="内容" prop="content">
+                <editor 
+                    style="min-width: 200px; max-width: 600px;"
+                    v-model="ruleForm.content" 
+                    class="editor" 
+                    action="file/upload">
+                </editor>
+              </el-form-item>
+              <div v-else>
+                <el-form-item v-if="ruleForm.content" label="内容" prop="content">
+                    <span v-html="ruleForm.content"></span>
+                </el-form-item>
+              </div>
+            </el-col>
+          </el-row>
+                    <el-form-item class="btn">
+                <el-button v-if="type!='info'" type="primary" class="btn-success" @click="onSubmit">提交</el-button>
+        <el-button v-if="type!='info'" class="btn-close" @click="back()">取消</el-button>
+        <el-button v-if="type=='info'" class="btn-close" @click="back()">返回</el-button>
+      </el-form-item>
+    </el-form>
+    
+    
+  </div>
+</template>
+<script>
+// 数字，邮件，手机，url，身份证校验
+import { isNumber,isIntNumer,isEmail,isPhone, isMobile,isURL,checkIdCard } from "@/utils/validate";
+export default {
+  data() {
+    let self = this
+    var validateIdCard = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!checkIdCard(value)) {
+        callback(new Error("请输入正确的身份证号码"));
+      } else {
+        callback();
+      }
+    };
+    var validateUrl = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isURL(value)) {
+        callback(new Error("请输入正确的URL地址"));
+      } else {
+        callback();
+      }
+    };
+    var validateMobile = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isMobile(value)) {
+        callback(new Error("请输入正确的手机号码"));
+      } else {
+        callback();
+      }
+    };
+    var validatePhone = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isPhone(value)) {
+        callback(new Error("请输入正确的电话号码"));
+      } else {
+        callback();
+      }
+    };
+    var validateEmail = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isEmail(value)) {
+        callback(new Error("请输入正确的邮箱地址"));
+      } else {
+        callback();
+      }
+    };
+    var validateNumber = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isNumber(value)) {
+        callback(new Error("请输入数字"));
+      } else {
+        callback();
+      }
+    };
+    var validateIntNumber = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isIntNumer(value)) {
+        callback(new Error("请输入整数"));
+      } else {
+        callback();
+      }
+    };
+    return {
+	  addEditForm: {"btnSaveFontColor":"#fff","selectFontSize":"14px","btnCancelBorderColor":"rgba(152, 129, 129, 1)","inputBorderRadius":"22px","inputFontSize":"14px","textareaBgColor":"#fff","btnSaveFontSize":"14px","textareaBorderRadius":"22px","uploadBgColor":"#fff","textareaBorderStyle":"solid","btnCancelWidth":"88px","textareaHeight":"120px","dateBgColor":"#fff","btnSaveBorderRadius":"22px","uploadLableFontSize":"14px","textareaBorderWidth":"1px","inputLableColor":"#606266","addEditBoxColor":"rgba(210, 194, 194, 0.29)","dateIconFontSize":"14px","btnSaveBgColor":"#409EFF","uploadIconFontColor":"#8c939d","textareaBorderColor":"rgba(152, 129, 129, 1)","btnCancelBgColor":"rgba(143, 222, 143, 1)","selectLableColor":"#606266","btnSaveBorderStyle":"solid","dateBorderWidth":"1px","dateLableFontSize":"14px","dateBorderRadius":"22px","btnCancelBorderStyle":"solid","selectLableFontSize":"14px","selectBorderStyle":"solid","selectIconFontColor":"#C0C4CC","btnCancelHeight":"44px","inputHeight":"40px","btnCancelFontColor":"#606266","dateBorderColor":"rgba(152, 129, 129, 1)","dateIconFontColor":"#C0C4CC","uploadBorderStyle":"solid","dateBorderStyle":"solid","dateLableColor":"#606266","dateFontSize":"14px","inputBorderWidth":"1px","uploadIconFontSize":"28px","selectHeight":"40px","inputFontColor":"#606266","uploadHeight":"148px","textareaLableColor":"#606266","textareaLableFontSize":"14px","btnCancelFontSize":"14px","inputBorderStyle":"solid","btnCancelBorderRadius":"22px","inputBgColor":"rgba(252, 250, 250, 1)","inputLableFontSize":"14px","uploadLableColor":"#606266","uploadBorderRadius":"22px","btnSaveHeight":"44px","selectBgColor":"#fff","btnSaveWidth":"88px","selectIconFontSize":"14px","dateHeight":"40px","selectBorderColor":"rgba(152, 129, 129, 1)","inputBorderColor":"rgba(152, 129, 129, 1)","uploadBorderColor":"rgba(152, 129, 129, 1)","textareaFontColor":"#606266","selectBorderWidth":"1px","dateFontColor":"#606266","btnCancelBorderWidth":"1px","uploadBorderWidth":"1px","textareaFontSize":"14px","selectBorderRadius":"22px","selectFontColor":"#606266","btnSaveBorderColor":"#409EFF","btnSaveBorderWidth":"1px"},
+      id: '',
+      type: '',
+      ro:{
+	title : false,
+	introduction : false,
+	picture : false,
+	content : false,
+      },
+            ruleForm: {
+                	        title: '',
+	                        	        introduction: '',
+	                        	        picture: '',
+	                        	        content: '',
+	                      },
+                                                                    rules: {
+                  title: [
+                            { required: true, message: '标题不能为空', trigger: 'blur' },
+                                    	                                                              ],
+                  introduction: [
+                                    	                                                              ],
+                  picture: [
+                            { required: true, message: '图片不能为空', trigger: 'blur' },
+                                    	                                                              ],
+                  content: [
+                            { required: true, message: '内容不能为空', trigger: 'blur' },
+                                    	                                                              ],
+              }
+    };
+  },
+  props: ["parent"],
+  computed: {
+                                                      },
+  created() {
+	this.addEditStyleChange()
+	this.addEditUploadStyleChange()
+  },
+  methods: {
+        // 下载
+    download(file){
+      window.open(`${file}`)
+    },
+    // 初始化
+    init(id,type) {
+      if (id) {
+        this.id = id;
+        this.type = type;
+      }
+      if(this.type=='info'||this.type=='else'){
+        this.info(id);
+      }else if(this.type=='cross'){
+        var obj = this.$storage.getObj('crossObj');
+        for (var o in obj){
+          	            if(o=='title'){
+            this.ruleForm.title = obj[o];
+	    this.ro.title = true;
+            continue;
+          }
+	            	            if(o=='introduction'){
+            this.ruleForm.introduction = obj[o];
+	    this.ro.introduction = true;
+            continue;
+          }
+	            	            if(o=='picture'){
+            this.ruleForm.picture = obj[o];
+	    this.ro.picture = true;
+            continue;
+          }
+	            	            if(o=='content'){
+            this.ruleForm.content = obj[o];
+	    this.ro.content = true;
+            continue;
+          }
+	                    }
+                                                                              }
+                                                                                                      },
+                                        // 多级联动参数
+                                                    info(id) {
+      this.$http({
+        url: `news/info/${id}`,
+        method: "get"
+      }).then(({ data }) => {
+        if (data && data.code === 0) {
+          this.ruleForm = data.data;
+        } else {
+          this.$message.error(data.msg);
+        }
+      });
+    },
+        // 提交
+    onSubmit() {
+                  // ${column.compare}
+                              // ${column.compare}
+                              // ${column.compare}
+                              // ${column.compare}
+                                                                                                            this.$refs["ruleForm"].validate(valid => {
+        if (valid) {
+          this.$http({
+            url: `news/${!this.ruleForm.id ? "save" : "update"}`,
+            method: "post",
+            data: this.ruleForm
+          }).then(({ data }) => {
+            if (data && data.code === 0) {
+              this.$message({
+                message: "操作成功",
+                type: "success",
+                duration: 1500,
+                onClose: () => {
+                  this.parent.showFlag = true;
+                  this.parent.addOrUpdateFlag = false;
+                  this.parent.newsCrossAddOrUpdateFlag = false;
+                  this.parent.search();
+                  this.parent.contentStyleChange();
+                }
+              });
+            } else {
+              this.$message.error(data.msg);
+            }
+          });
+        }
+      });
+    },
+    // 获取uuid
+    getUUID () {
+      return new Date().getTime();
+    },
+    // 返回
+    back() {
+      this.parent.showFlag = true;
+      this.parent.addOrUpdateFlag = false;
+      this.parent.newsCrossAddOrUpdateFlag = false;
+      this.parent.contentStyleChange();
+    },
+                                                pictureUploadChange(fileUrls) {
+                this.ruleForm.picture = fileUrls;
+				this.addEditUploadStyleChange()
+            },
+                        	addEditStyleChange() {
+	  this.$nextTick(()=>{
+	    // input
+	    document.querySelectorAll('.addEdit-block .input .el-input__inner').forEach(el=>{
+	      el.style.height = this.addEditForm.inputHeight
+	      el.style.color = this.addEditForm.inputFontColor
+	      el.style.fontSize = this.addEditForm.inputFontSize
+	      el.style.borderWidth = this.addEditForm.inputBorderWidth
+	      el.style.borderStyle = this.addEditForm.inputBorderStyle
+	      el.style.borderColor = this.addEditForm.inputBorderColor
+	      el.style.borderRadius = this.addEditForm.inputBorderRadius
+	      el.style.backgroundColor = this.addEditForm.inputBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .input .el-form-item__label').forEach(el=>{
+	      el.style.lineHeight = this.addEditForm.inputHeight
+	      el.style.color = this.addEditForm.inputLableColor
+	      el.style.fontSize = this.addEditForm.inputLableFontSize
+	    })
+	    // select
+	    document.querySelectorAll('.addEdit-block .select .el-input__inner').forEach(el=>{
+	      el.style.height = this.addEditForm.selectHeight
+	      el.style.color = this.addEditForm.selectFontColor
+	      el.style.fontSize = this.addEditForm.selectFontSize
+	      el.style.borderWidth = this.addEditForm.selectBorderWidth
+	      el.style.borderStyle = this.addEditForm.selectBorderStyle
+	      el.style.borderColor = this.addEditForm.selectBorderColor
+	      el.style.borderRadius = this.addEditForm.selectBorderRadius
+	      el.style.backgroundColor = this.addEditForm.selectBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .select .el-form-item__label').forEach(el=>{
+	      el.style.lineHeight = this.addEditForm.selectHeight
+	      el.style.color = this.addEditForm.selectLableColor
+	      el.style.fontSize = this.addEditForm.selectLableFontSize
+	    })
+	    document.querySelectorAll('.addEdit-block .select .el-select__caret').forEach(el=>{
+	      el.style.color = this.addEditForm.selectIconFontColor
+	      el.style.fontSize = this.addEditForm.selectIconFontSize
+	    })
+	    // date
+	    document.querySelectorAll('.addEdit-block .date .el-input__inner').forEach(el=>{
+	      el.style.height = this.addEditForm.dateHeight
+	      el.style.color = this.addEditForm.dateFontColor
+	      el.style.fontSize = this.addEditForm.dateFontSize
+	      el.style.borderWidth = this.addEditForm.dateBorderWidth
+	      el.style.borderStyle = this.addEditForm.dateBorderStyle
+	      el.style.borderColor = this.addEditForm.dateBorderColor
+	      el.style.borderRadius = this.addEditForm.dateBorderRadius
+	      el.style.backgroundColor = this.addEditForm.dateBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .date .el-form-item__label').forEach(el=>{
+	      el.style.lineHeight = this.addEditForm.dateHeight
+	      el.style.color = this.addEditForm.dateLableColor
+	      el.style.fontSize = this.addEditForm.dateLableFontSize
+	    })
+	    document.querySelectorAll('.addEdit-block .date .el-input__icon').forEach(el=>{
+	      el.style.color = this.addEditForm.dateIconFontColor
+	      el.style.fontSize = this.addEditForm.dateIconFontSize
+	      el.style.lineHeight = this.addEditForm.dateHeight
+	    })
+	    // upload
+	    let iconLineHeight = parseInt(this.addEditForm.uploadHeight) - parseInt(this.addEditForm.uploadBorderWidth) * 2 + 'px'
+	    document.querySelectorAll('.addEdit-block .upload .el-upload--picture-card').forEach(el=>{
+	      el.style.width = this.addEditForm.uploadHeight
+	      el.style.height = this.addEditForm.uploadHeight
+	      el.style.borderWidth = this.addEditForm.uploadBorderWidth
+	      el.style.borderStyle = this.addEditForm.uploadBorderStyle
+	      el.style.borderColor = this.addEditForm.uploadBorderColor
+	      el.style.borderRadius = this.addEditForm.uploadBorderRadius
+	      el.style.backgroundColor = this.addEditForm.uploadBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .upload .el-form-item__label').forEach(el=>{
+	      el.style.lineHeight = this.addEditForm.uploadHeight
+	      el.style.color = this.addEditForm.uploadLableColor
+	      el.style.fontSize = this.addEditForm.uploadLableFontSize
+	    })
+	    document.querySelectorAll('.addEdit-block .upload .el-icon-plus').forEach(el=>{
+	      el.style.color = this.addEditForm.uploadIconFontColor
+	      el.style.fontSize = this.addEditForm.uploadIconFontSize
+	      el.style.lineHeight = iconLineHeight
+	      el.style.display = 'block'
+	    })
+	    // 多文本输入框
+	    document.querySelectorAll('.addEdit-block .textarea .el-textarea__inner').forEach(el=>{
+	      el.style.height = this.addEditForm.textareaHeight
+	      el.style.color = this.addEditForm.textareaFontColor
+	      el.style.fontSize = this.addEditForm.textareaFontSize
+	      el.style.borderWidth = this.addEditForm.textareaBorderWidth
+	      el.style.borderStyle = this.addEditForm.textareaBorderStyle
+	      el.style.borderColor = this.addEditForm.textareaBorderColor
+	      el.style.borderRadius = this.addEditForm.textareaBorderRadius
+	      el.style.backgroundColor = this.addEditForm.textareaBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .textarea .el-form-item__label').forEach(el=>{
+	      // el.style.lineHeight = this.addEditForm.textareaHeight
+	      el.style.color = this.addEditForm.textareaLableColor
+	      el.style.fontSize = this.addEditForm.textareaLableFontSize
+	    })
+	    // 保存
+	    document.querySelectorAll('.addEdit-block .btn .btn-success').forEach(el=>{
+	      el.style.width = this.addEditForm.btnSaveWidth
+	      el.style.height = this.addEditForm.btnSaveHeight
+	      el.style.color = this.addEditForm.btnSaveFontColor
+	      el.style.fontSize = this.addEditForm.btnSaveFontSize
+	      el.style.borderWidth = this.addEditForm.btnSaveBorderWidth
+	      el.style.borderStyle = this.addEditForm.btnSaveBorderStyle
+	      el.style.borderColor = this.addEditForm.btnSaveBorderColor
+	      el.style.borderRadius = this.addEditForm.btnSaveBorderRadius
+	      el.style.backgroundColor = this.addEditForm.btnSaveBgColor
+	    })
+	    // 返回
+	    document.querySelectorAll('.addEdit-block .btn .btn-close').forEach(el=>{
+	      el.style.width = this.addEditForm.btnCancelWidth
+	      el.style.height = this.addEditForm.btnCancelHeight
+	      el.style.color = this.addEditForm.btnCancelFontColor
+	      el.style.fontSize = this.addEditForm.btnCancelFontSize
+	      el.style.borderWidth = this.addEditForm.btnCancelBorderWidth
+	      el.style.borderStyle = this.addEditForm.btnCancelBorderStyle
+	      el.style.borderColor = this.addEditForm.btnCancelBorderColor
+	      el.style.borderRadius = this.addEditForm.btnCancelBorderRadius
+	      el.style.backgroundColor = this.addEditForm.btnCancelBgColor
+	    })
+	  })
+	},
+	addEditUploadStyleChange() {
+		this.$nextTick(()=>{
+		  document.querySelectorAll('.addEdit-block .upload .el-upload-list--picture-card .el-upload-list__item').forEach(el=>{
+			el.style.width = this.addEditForm.uploadHeight
+			el.style.height = this.addEditForm.uploadHeight
+			el.style.borderWidth = this.addEditForm.uploadBorderWidth
+			el.style.borderStyle = this.addEditForm.uploadBorderStyle
+			el.style.borderColor = this.addEditForm.uploadBorderColor
+			el.style.borderRadius = this.addEditForm.uploadBorderRadius
+			el.style.backgroundColor = this.addEditForm.uploadBgColor
+		  })
+	  })
+	},
+  }
+};
+</script>
+<style lang="scss">
+.editor{
+  height: 500px;
+  
+  & /deep/ .ql-container {
+	  height: 310px;
+  }
+}
+.amap-wrapper {
+  width: 100%;
+  height: 500px;
+}
+.search-box {
+  position: absolute;
+}
+.addEdit-block {
+	margin: -10px;
+}
+.detail-form-content {
+	padding: 12px;
+}
+.btn .el-button {
+  padding: 0;
+}
+</style>

src/main/resources/admin/admin/src/views/modules/news/list.vue

@@ -0,0 +1,532 @@
+<template>
+  <div class="main-content">
+    <!-- 列表页 -->
+    <div v-if="showFlag">
+      <el-form :inline="true" :model="searchForm" class="form-content">
+        <el-row :gutter="20" class="slt" :style="{justifyContent:contents.searchBoxPosition=='1'?'flex-start':contents.searchBoxPosition=='2'?'center':'flex-end'}">
+                                                    <el-form-item :label="contents.inputTitle == 1 ? '标题' : ''">
+                  <el-input v-if="contents.inputIcon == 1 && contents.inputIconPosition == 1" prefix-icon="el-icon-search" v-model="searchForm.title" placeholder="标题" clearable></el-input>
+                  <el-input v-if="contents.inputIcon == 1 && contents.inputIconPosition == 2" suffix-icon="el-icon-search" v-model="searchForm.title" placeholder="标题" clearable></el-input>
+                  <el-input v-if="contents.inputIcon == 0" v-model="searchForm.title" placeholder="标题" clearable></el-input>
+                </el-form-item>
+                                                                                                                <el-form-item>
+            <el-button v-if="contents.searchBtnIcon == 1 && contents.searchBtnIconPosition == 1" icon="el-icon-search" type="success" @click="search()">{{ contents.searchBtnFont == 1?'查询':'' }}</el-button>
+            <el-button v-if="contents.searchBtnIcon == 1 && contents.searchBtnIconPosition == 2" type="success" @click="search()">{{ contents.searchBtnFont == 1?'查询':'' }}<i class="el-icon-search el-icon--right"/></el-button>
+            <el-button v-if="contents.searchBtnIcon == 0" type="success" @click="search()">{{ contents.searchBtnFont == 1?'查询':'' }}</el-button>
+          </el-form-item>
+        </el-row>
+        <el-row class="ad" :style="{justifyContent:contents.btnAdAllBoxPosition=='1'?'flex-start':contents.btnAdAllBoxPosition=='2'?'center':'flex-end'}">
+          <el-form-item>
+            <el-button
+              v-if="isAuth('news','新增') && contents.btnAdAllIcon == 1 && contents.btnAdAllIconPosition == 1"
+              type="success"
+              icon="el-icon-plus"
+              @click="addOrUpdateHandler()"
+            >{{ contents.btnAdAllFont == 1?'新增':'' }}</el-button>
+            <el-button
+              v-if="isAuth('news','新增') && contents.btnAdAllIcon == 1 && contents.btnAdAllIconPosition == 2"
+              type="success"
+              @click="addOrUpdateHandler()"
+            >{{ contents.btnAdAllFont == 1?'新增':'' }}<i class="el-icon-plus el-icon--right" /></el-button>
+            <el-button
+              v-if="isAuth('news','新增') && contents.btnAdAllIcon == 0"
+              type="success"
+              @click="addOrUpdateHandler()"
+            >{{ contents.btnAdAllFont == 1?'新增':'' }}</el-button>
+            <el-button
+              v-if="isAuth('news','删除') && contents.btnAdAllIcon == 1 && contents.btnAdAllIconPosition == 1 && contents.tableSelection"
+              :disabled="dataListSelections.length <= 0"
+              type="danger"
+              icon="el-icon-delete"
+              @click="deleteHandler()"
+            >{{ contents.btnAdAllFont == 1?'删除':'' }}</el-button>
+            <el-button
+              v-if="isAuth('news','删除') && contents.btnAdAllIcon == 1 && contents.btnAdAllIconPosition == 2 && contents.tableSelection"
+              :disabled="dataListSelections.length <= 0"
+              type="danger"
+              @click="deleteHandler()"
+            >{{ contents.btnAdAllFont == 1?'删除':'' }}<i class="el-icon-delete el-icon--right" /></el-button>
+            <el-button
+              v-if="isAuth('news','删除') && contents.btnAdAllIcon == 0 && contents.tableSelection"
+              :disabled="dataListSelections.length <= 0"
+              type="danger"
+              @click="deleteHandler()"
+            >{{ contents.btnAdAllFont == 1?'删除':'' }}</el-button>
+
+
+                      </el-form-item>
+        </el-row>
+      </el-form>
+      <div class="table-content">
+        <el-table class="tables" :size="contents.tableSize" :show-header="contents.tableShowHeader"
+            :header-row-style="headerRowStyle" :header-cell-style="headerCellStyle"
+            :border="contents.tableBorder"
+            :fit="contents.tableFit"
+            :stripe="contents.tableStripe"
+            :row-style="rowStyle"
+            :cell-style="cellStyle"
+            :style="{width: '100%',fontSize:contents.tableContentFontSize,color:contents.tableContentFontColor}"
+            v-if="isAuth('news','查看')"
+            :data="dataList"
+            v-loading="dataListLoading"
+            @selection-change="selectionChangeHandler">
+            <el-table-column  v-if="contents.tableSelection"
+                type="selection"
+                header-align="center"
+                align="center"
+                width="50">
+            </el-table-column>
+            <el-table-column label="索引" v-if="contents.tableIndex" type="index" width="50" />
+            	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="title"
+                    header-align="center"
+		    label="标题">
+		     <template slot-scope="scope">
+                       {{scope.row.title}}
+                     </template>
+                </el-table-column>
+                	                	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="introduction"
+                    header-align="center"
+		    label="简介">
+		     <template slot-scope="scope">
+                       {{scope.row.introduction}}
+                     </template>
+                </el-table-column>
+                	                	                                      <el-table-column :sortable="contents.tableSortable" :align="contents.tableAlign" prop="picture"
+                    header-align="center"
+                    width="200"
+                    label="图片">
+                    <template slot-scope="scope">
+                      <div v-if="scope.row.picture">
+                        <img :src="scope.row.picture.split(',')[0]" width="100" height="100">
+                      </div>
+                      <div v-else>无图片</div>
+                    </template>
+                  </el-table-column>
+                	                	                                    	                                        <el-table-column width="300" :align="contents.tableAlign"
+                header-align="center"
+                label="操作">
+                <template slot-scope="scope">
+                                <el-button v-if="isAuth('news','查看') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 1" type="success" icon="el-icon-tickets" size="mini" @click="addOrUpdateHandler(scope.row.id,'info')">{{ contents.tableBtnFont == 1?'详情':'' }}</el-button>
+                <el-button v-if="isAuth('news','查看') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 2" type="success" size="mini" @click="addOrUpdateHandler(scope.row.id,'info')">{{ contents.tableBtnFont == 1?'详情':'' }}<i class="el-icon-tickets el-icon--right" /></el-button>
+                <el-button v-if="isAuth('news','查看') && contents.tableBtnIcon == 0" type="success" size="mini" @click="addOrUpdateHandler(scope.row.id,'info')">{{ contents.tableBtnFont == 1?'详情':'' }}</el-button>
+                                                <el-button v-if="isAuth('news','修改') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 1" type="primary" icon="el-icon-edit" size="mini" @click="addOrUpdateHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'修改':'' }}</el-button>
+                <el-button v-if="isAuth('news','修改') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 2" type="primary" size="mini" @click="addOrUpdateHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'修改':'' }}<i class="el-icon-edit el-icon--right" /></el-button>
+                <el-button v-if="isAuth('news','修改') && contents.tableBtnIcon == 0" type="primary" size="mini" @click="addOrUpdateHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'修改':'' }}</el-button>
+
+
+
+
+                <el-button v-if="isAuth('news','删除') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 1" type="danger" icon="el-icon-delete" size="mini" @click="deleteHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'删除':'' }}</el-button>
+                <el-button v-if="isAuth('news','删除') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 2" type="danger" size="mini" @click="deleteHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'删除':'' }}<i class="el-icon-delete el-icon--right" /></el-button>
+                <el-button v-if="isAuth('news','删除') && contents.tableBtnIcon == 0" type="danger" size="mini" @click="deleteHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'删除':'' }}</el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+                                                                                <el-pagination
+          clsss="pages"
+          :layout="layouts"
+          @size-change="sizeChangeHandle"
+          @current-change="currentChangeHandle"
+          :current-page="pageIndex"
+          :page-sizes="[10, 20, 50, 100]"
+          :page-size="Number(contents.pageEachNum)"
+          :total="totalPage"
+          :small="contents.pageStyle"
+          class="pagination-content"
+          :background="contents.pageBtnBG"
+          :style="{textAlign:contents.pagePosition==1?'left':contents.pagePosition==2?'center':'right'}"
+        ></el-pagination>
+      </div>
+    </div>
+    <!-- 添加/修改页面  将父组件的search方法传递给子组件-->
+    <add-or-update v-if="addOrUpdateFlag" :parent="this" ref="addOrUpdate"></add-or-update>
+
+    
+    
+      </div>
+</template>
+<script>
+import AddOrUpdate from "./add-or-update";
+export default {
+  data() {
+    return {
+                                                                                                searchForm: {
+        key: ""
+      },
+      dataList: [],
+      pageIndex: 1,
+      pageSize: 10,
+      totalPage: 0,
+      dataListLoading: false,
+      dataListSelections: [],
+      showFlag: true,
+      sfshVisiable: false,
+      shForm: {},
+      chartVisiable: false,
+      addOrUpdateFlag:false,
+            contents:{"searchBtnFontColor":"#333","pagePosition":"1","inputFontSize":"14px","inputBorderRadius":"22px","tableBtnDelFontColor":"#333","tableBtnIconPosition":"1","searchBtnHeight":"40px","inputIconColor":"rgba(66, 130, 129, 1)","searchBtnBorderRadius":"22px","tableStripe":false,"btnAdAllWarnFontColor":"#333","tableBtnDelBgColor":"rgba(244, 150, 150, 1)","searchBtnIcon":"1","tableSize":"medium","searchBtnBorderStyle":"solid","tableSelection":true,"searchBtnBorderWidth":"1px","tableContentFontSize":"14px","searchBtnBgColor":"rgba(153, 239, 237, 1)","inputTitleSize":"14px","btnAdAllBorderColor":"#DCDFE6","pageJumper":true,"btnAdAllIconPosition":"1","searchBoxPosition":"1","tableBtnDetailFontColor":"#333","tableBtnHeight":"40px","pagePager":true,"searchBtnBorderColor":"#DCDFE6","tableHeaderFontColor":"rgba(33, 34, 35, 1)","inputTitle":"1","tableBtnBorderRadius":"22px","btnAdAllFont":"1","btnAdAllDelFontColor":"rgba(21, 20, 20, 1)","tableBtnIcon":"1","btnAdAllHeight":"40px","btnAdAllWarnBgColor":"rgba(238, 236, 126, 1)","btnAdAllBorderWidth":"1px","tableStripeFontColor":"#606266","tableBtnBorderStyle":"solid","inputHeight":"40px","btnAdAllBorderRadius":"22px","btnAdAllDelBgColor":"rgba(234, 93, 93, 0.69)","pagePrevNext":true,"btnAdAllAddBgColor":"rgba(153, 239, 237, 1)","searchBtnFont":"1","tableIndex":true,"btnAdAllIcon":"1","tableSortable":true,"pageSizes":true,"tableFit":true,"pageBtnBG":true,"searchBtnFontSize":"14px","tableBtnEditBgColor":"rgba(240, 242, 124, 1)","inputBorderWidth":"1px","inputFontPosition":"1","inputFontColor":"#333","pageEachNum":10,"tableHeaderBgColor":"rgba(152, 129, 129, 1)","inputTitleColor":"#333","btnAdAllBoxPosition":"1","tableBtnDetailBgColor":"rgba(171, 239, 239, 1)","inputIcon":"0","searchBtnIconPosition":"1","btnAdAllFontSize":"14px","inputBorderStyle":"solid","inputBgColor":"rgba(197, 174, 174, 0.32)","pageStyle":false,"pageTotal":true,"btnAdAllAddFontColor":"#333","tableBtnFont":"1","tableContentFontColor":"rgba(22, 22, 23, 1)","inputBorderColor":"rgba(152, 129, 129, 1)","tableShowHeader":true,"tableBtnFontSize":"14px","tableBtnBorderColor":"rgba(196, 210, 244, 1)","inputIconPosition":"1","tableBorder":true,"btnAdAllBorderStyle":"solid","tableBtnBorderWidth":"1px","tableStripeBgColor":"rgba(213, 197, 197, 1)","tableBtnEditFontColor":"#333","tableAlign":"center"},
+      layouts: '',
+
+
+    };
+  },
+  created() {
+    this.init();
+    this.getDataList();
+    this.contentStyleChange()
+  },
+  mounted() {
+
+  },
+  filters: {
+    htmlfilter: function (val) {
+      return val.replace(/<[^>]*>/g).replace(/undefined/g,'');
+    }
+  },
+  components: {
+    AddOrUpdate,
+      },
+  methods: {
+    contentStyleChange() {
+      this.contentSearchStyleChange()
+      this.contentBtnAdAllStyleChange()
+      this.contentSearchBtnStyleChange()
+      this.contentTableBtnStyleChange()
+      this.contentPageStyleChange()
+    },
+    contentSearchStyleChange() {
+      this.$nextTick(()=>{
+        document.querySelectorAll('.form-content .slt .el-input__inner').forEach(el=>{
+          let textAlign = 'left'
+          if(this.contents.inputFontPosition == 2) textAlign = 'center'
+          if(this.contents.inputFontPosition == 3) textAlign = 'right'
+          el.style.textAlign = textAlign
+          el.style.height = this.contents.inputHeight
+          el.style.lineHeight = this.contents.inputHeight
+          el.style.color = this.contents.inputFontColor
+          el.style.fontSize = this.contents.inputFontSize
+          el.style.borderWidth = this.contents.inputBorderWidth
+          el.style.borderStyle = this.contents.inputBorderStyle
+          el.style.borderColor = this.contents.inputBorderColor
+          el.style.borderRadius = this.contents.inputBorderRadius
+          el.style.backgroundColor = this.contents.inputBgColor
+        })
+        if(this.contents.inputTitle) {
+          document.querySelectorAll('.form-content .slt .el-form-item__label').forEach(el=>{
+            el.style.color = this.contents.inputTitleColor
+            el.style.fontSize = this.contents.inputTitleSize
+            el.style.lineHeight = this.contents.inputHeight
+          })
+        }
+        setTimeout(()=>{
+          document.querySelectorAll('.form-content .slt .el-input__prefix').forEach(el=>{
+            el.style.color = this.contents.inputIconColor
+            el.style.lineHeight = this.contents.inputHeight
+          })
+          document.querySelectorAll('.form-content .slt .el-input__suffix').forEach(el=>{
+            el.style.color = this.contents.inputIconColor
+            el.style.lineHeight = this.contents.inputHeight
+          })
+          document.querySelectorAll('.form-content .slt .el-input__icon').forEach(el=>{
+            el.style.lineHeight = this.contents.inputHeight
+          })
+        },10)
+
+      })
+    },
+    // 搜索按钮
+    contentSearchBtnStyleChange() {
+      this.$nextTick(()=>{
+        document.querySelectorAll('.form-content .slt .el-button--success').forEach(el=>{
+          el.style.height = this.contents.searchBtnHeight
+          el.style.color = this.contents.searchBtnFontColor
+          el.style.fontSize = this.contents.searchBtnFontSize
+          el.style.borderWidth = this.contents.searchBtnBorderWidth
+          el.style.borderStyle = this.contents.searchBtnBorderStyle
+          el.style.borderColor = this.contents.searchBtnBorderColor
+          el.style.borderRadius = this.contents.searchBtnBorderRadius
+          el.style.backgroundColor = this.contents.searchBtnBgColor
+        })
+      })
+    },
+    // 新增、批量删除
+    contentBtnAdAllStyleChange() {
+      this.$nextTick(()=>{
+        document.querySelectorAll('.form-content .ad .el-button--success').forEach(el=>{
+          el.style.height = this.contents.btnAdAllHeight
+          el.style.color = this.contents.btnAdAllAddFontColor
+          el.style.fontSize = this.contents.btnAdAllFontSize
+          el.style.borderWidth = this.contents.btnAdAllBorderWidth
+          el.style.borderStyle = this.contents.btnAdAllBorderStyle
+          el.style.borderColor = this.contents.btnAdAllBorderColor
+          el.style.borderRadius = this.contents.btnAdAllBorderRadius
+          el.style.backgroundColor = this.contents.btnAdAllAddBgColor
+        })
+        document.querySelectorAll('.form-content .ad .el-button--danger').forEach(el=>{
+          el.style.height = this.contents.btnAdAllHeight
+          el.style.color = this.contents.btnAdAllDelFontColor
+          el.style.fontSize = this.contents.btnAdAllFontSize
+          el.style.borderWidth = this.contents.btnAdAllBorderWidth
+          el.style.borderStyle = this.contents.btnAdAllBorderStyle
+          el.style.borderColor = this.contents.btnAdAllBorderColor
+          el.style.borderRadius = this.contents.btnAdAllBorderRadius
+          el.style.backgroundColor = this.contents.btnAdAllDelBgColor
+        })
+        document.querySelectorAll('.form-content .ad .el-button--warning').forEach(el=>{
+          el.style.height = this.contents.btnAdAllHeight
+          el.style.color = this.contents.btnAdAllWarnFontColor
+          el.style.fontSize = this.contents.btnAdAllFontSize
+          el.style.borderWidth = this.contents.btnAdAllBorderWidth
+          el.style.borderStyle = this.contents.btnAdAllBorderStyle
+          el.style.borderColor = this.contents.btnAdAllBorderColor
+          el.style.borderRadius = this.contents.btnAdAllBorderRadius
+          el.style.backgroundColor = this.contents.btnAdAllWarnBgColor
+        })
+      })
+    },
+    // 表格
+    rowStyle({ row, rowIndex}) {
+      if (rowIndex % 2 == 1) {
+        if(this.contents.tableStripe) {
+          return {color:this.contents.tableStripeFontColor}
+        }
+      } else {
+        return ''
+      }
+    },
+    cellStyle({ row, rowIndex}){
+      if (rowIndex % 2 == 1) {
+        if(this.contents.tableStripe) {
+          return {backgroundColor:this.contents.tableStripeBgColor}
+        }
+      } else {
+        return ''
+      }
+    },
+    headerRowStyle({ row, rowIndex}){
+      return {color: this.contents.tableHeaderFontColor}
+    },
+    headerCellStyle({ row, rowIndex}){
+      return {backgroundColor: this.contents.tableHeaderBgColor}
+    },
+    // 表格按钮
+    contentTableBtnStyleChange(){
+      // this.$nextTick(()=>{
+      //   setTimeout(()=>{
+      //     document.querySelectorAll('.table-content .tables .el-table__body .el-button--success').forEach(el=>{
+      //       el.style.height = this.contents.tableBtnHeight
+      //       el.style.color = this.contents.tableBtnDetailFontColor
+      //       el.style.fontSize = this.contents.tableBtnFontSize
+      //       el.style.borderWidth = this.contents.tableBtnBorderWidth
+      //       el.style.borderStyle = this.contents.tableBtnBorderStyle
+      //       el.style.borderColor = this.contents.tableBtnBorderColor
+      //       el.style.borderRadius = this.contents.tableBtnBorderRadius
+      //       el.style.backgroundColor = this.contents.tableBtnDetailBgColor
+      //     })
+      //     document.querySelectorAll('.table-content .tables .el-table__body .el-button--primary').forEach(el=>{
+      //       el.style.height = this.contents.tableBtnHeight
+      //       el.style.color = this.contents.tableBtnEditFontColor
+      //       el.style.fontSize = this.contents.tableBtnFontSize
+      //       el.style.borderWidth = this.contents.tableBtnBorderWidth
+      //       el.style.borderStyle = this.contents.tableBtnBorderStyle
+      //       el.style.borderColor = this.contents.tableBtnBorderColor
+      //       el.style.borderRadius = this.contents.tableBtnBorderRadius
+      //       el.style.backgroundColor = this.contents.tableBtnEditBgColor
+      //     })
+      //     document.querySelectorAll('.table-content .tables .el-table__body .el-button--danger').forEach(el=>{
+      //       el.style.height = this.contents.tableBtnHeight
+      //       el.style.color = this.contents.tableBtnDelFontColor
+      //       el.style.fontSize = this.contents.tableBtnFontSize
+      //       el.style.borderWidth = this.contents.tableBtnBorderWidth
+      //       el.style.borderStyle = this.contents.tableBtnBorderStyle
+      //       el.style.borderColor = this.contents.tableBtnBorderColor
+      //       el.style.borderRadius = this.contents.tableBtnBorderRadius
+      //       el.style.backgroundColor = this.contents.tableBtnDelBgColor
+      //     })
+
+      //   }, 50)
+      // })
+    },
+    // 分页
+    contentPageStyleChange(){
+      let arr = []
+
+      if(this.contents.pageTotal) arr.push('total')
+      if(this.contents.pageSizes) arr.push('sizes')
+      if(this.contents.pagePrevNext){
+        arr.push('prev')
+        if(this.contents.pagePager) arr.push('pager')
+        arr.push('next')
+      }
+      if(this.contents.pageJumper) arr.push('jumper')
+      this.layouts = arr.join()
+      this.contents.pageEachNum = 10
+    },
+
+                init () {
+                                                                                                                                      },
+    search() {
+      this.pageIndex = 1;
+      this.getDataList();
+    },
+    // 获取数据列表
+    getDataList() {
+      this.dataListLoading = true;
+      let params = {
+        page: this.pageIndex,
+        limit: this.pageSize,
+        sort: 'id',
+      }
+                                          if(this.searchForm.title!='' && this.searchForm.title!=undefined){
+            params['title'] = '%' + this.searchForm.title + '%'
+          }
+                                                                                                this.$http({
+        url: "news/page",
+        method: "get",
+        params: params
+      }).then(({ data }) => {
+        if (data && data.code === 0) {
+          this.dataList = data.data.list;
+          this.totalPage = data.data.total;
+        } else {
+          this.dataList = [];
+          this.totalPage = 0;
+        }
+        this.dataListLoading = false;
+      });
+    },
+    // 每页数
+    sizeChangeHandle(val) {
+      this.pageSize = val;
+      this.pageIndex = 1;
+      this.getDataList();
+    },
+    // 当前页
+    currentChangeHandle(val) {
+      this.pageIndex = val;
+      this.getDataList();
+    },
+    // 多选
+    selectionChangeHandler(val) {
+      this.dataListSelections = val;
+    },
+    // 添加/修改
+    addOrUpdateHandler(id,type) {
+      this.showFlag = false;
+      this.addOrUpdateFlag = true;
+      this.crossAddOrUpdateFlag = false;
+      if(type!='info'){
+        type = 'else';
+      }
+      this.$nextTick(() => {
+        this.$refs.addOrUpdate.init(id,type);
+      });
+    },
+    // 查看评论
+        // 下载
+    download(file){
+      window.open(`${file}`)
+    },
+    // 删除
+    deleteHandler(id) {
+      var ids = id
+        ? [Number(id)]
+        : this.dataListSelections.map(item => {
+            return Number(item.id);
+          });
+      this.$confirm(`确定进行[${id ? "删除" : "批量删除"}]操作?`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(() => {
+        this.$http({
+          url: "news/delete",
+          method: "post",
+          data: ids
+        }).then(({ data }) => {
+          if (data && data.code === 0) {
+            this.$message({
+              message: "操作成功",
+              type: "success",
+              duration: 1500,
+              onClose: () => {
+                this.search();
+              }
+            });
+          } else {
+            this.$message.error(data.msg);
+          }
+        });
+      });
+    },
+  }
+
+};
+</script>
+<style lang="scss" scoped>
+  .slt {
+    margin: 0 !important;
+    display: flex;
+  }
+
+  .ad {
+    margin: 0 !important;
+    display: flex;
+  }
+
+  .pages {
+    & /deep/ el-pagination__sizes{
+      & /deep/ el-input__inner {
+        height: 22px;
+        line-height: 22px;
+      }
+    }
+  }
+  
+
+  .el-button+.el-button {
+    margin:0;
+  } 
+
+  .tables {
+	& /deep/ .el-button--success {
+		height: 40px;
+		color: #333;
+		font-size: 14px;
+		border-width: 1px;
+		border-style: solid;
+		border-color: rgba(196, 210, 244, 1);
+		border-radius: 22px;
+		background-color: rgba(171, 239, 239, 1);
+	}
+	
+	& /deep/ .el-button--primary {
+		height: 40px;
+		color: #333;
+		font-size: 14px;
+		border-width: 1px;
+		border-style: solid;
+		border-color: rgba(196, 210, 244, 1);
+		border-radius: 22px;
+		background-color: rgba(240, 242, 124, 1);
+	}
+	
+	& /deep/ .el-button--danger {
+		height: 40px;
+		color: #333;
+		font-size: 14px;
+		border-width: 1px;
+		border-style: solid;
+		border-color: rgba(196, 210, 244, 1);
+		border-radius: 22px;
+		background-color: rgba(244, 150, 150, 1);
+	}
+
+    & /deep/ .el-button {
+      margin: 4px;
+    }
+  }
+
+</style>

src/main/resources/mapper/MessagesDao.xml

@@ -0,0 +1,38 @@
+<?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.dao.MessagesDao">
+
+	<!-- 可根据自己的需求，是否要使用 -->
+    <resultMap type="com.entity.MessagesEntity" id="messagesMap">
+        <result property="userid" column="userid"/>
+        <result property="username" column="username"/>
+        <result property="content" column="content"/>
+        <result property="reply" column="reply"/>
+    </resultMap>
+
+	<select id="selectListVO"
+		resultType="com.entity.vo.MessagesVO" >
+		SELECT * FROM messages  messages         
+        <where> 1=1 ${ew.sqlSegment}</where>
+	</select>
+	
+	<select id="selectVO"
+		resultType="com.entity.vo.MessagesVO" >
+		SELECT  messages.* FROM messages  messages 	
+ 		<where> 1=1 ${ew.sqlSegment}</where>
+	</select>
+
+    <select id="selectListView"
+		resultType="com.entity.view.MessagesView" >
+
+		SELECT  messages.* FROM messages  messages 	        
+        <where> 1=1 ${ew.sqlSegment}</where>
+	</select>
+	
+	<select id="selectView"
+		resultType="com.entity.view.MessagesView" >
+		SELECT * FROM messages  messages <where> 1=1 ${ew.sqlSegment}</where>
+	</select>
+	
+</mapper>

src/main/resources/mapper/NewsDao.xml

@@ -0,0 +1,38 @@
+<?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.dao.NewsDao">
+
+	<!-- 可根据自己的需求，是否要使用 -->
+    <resultMap type="com.entity.NewsEntity" id="newsMap">
+        <result property="title" column="title"/>
+        <result property="introduction" column="introduction"/>
+        <result property="picture" column="picture"/>
+        <result property="content" column="content"/>
+    </resultMap>
+
+	<select id="selectListVO"
+		resultType="com.entity.vo.NewsVO" >
+		SELECT * FROM news  news         
+        <where> 1=1 ${ew.sqlSegment}</where>
+	</select>
+	
+	<select id="selectVO"
+		resultType="com.entity.vo.NewsVO" >
+		SELECT  news.* FROM news  news 	
+ 		<where> 1=1 ${ew.sqlSegment}</where>
+	</select>
+
+    <select id="selectListView"
+		resultType="com.entity.view.NewsView" >
+
+		SELECT  news.* FROM news  news 	        
+        <where> 1=1 ${ew.sqlSegment}</where>
+	</select>
+	
+	<select id="selectView"
+		resultType="com.entity.view.NewsView" >
+		SELECT * FROM news  news <where> 1=1 ${ew.sqlSegment}</where>
+	</select>
+	
+</mapper>