基于SSM+ElementUI的4s维修管理系统开发总结

最新推荐文章于 2022-01-12 06:38:50 发布

置顶 Penny�

最新推荐文章于 2022-01-12 06:38:50 发布

阅读量857

点赞数 2

分类专栏： SSM Java ElementUI 文章标签： java spring vue.js restful mysql

本文链接：https://blog.csdn.net/weixin_43935934/article/details/103979827

版权

Java 同时被 3 个专栏收录

15 篇文章 0 订阅

订阅专栏

ElementUI

4 篇文章 0 订阅

订阅专栏

SSM

3 篇文章 0 订阅

订阅专栏

1.项目名称：4s维修管理系统(RPMS)

项目描述：主要为市场上4s店维护管理维修详情提供一套维修管理的操作系统。
开发模式：采用多模块分成员模式的前后端分离的开发模式。
本次项目中，个人主要负责模块：
1.维修单管理
2.维修单明细管理
3.动态路由
现将项目经验分享如下：

2.后端代码：

2.1项目总览：

项目总览模块结构图

2.2局部详情：

2.2.1 rpms_common(相当于domain层)

在这里插入图片描述
由于我在这个项目中做的是维修单及维修单明细的内容，故只展示我所做的部分的代码

RepairdOrder.java(维修单管理)

package cn.itsource.rpms.common.domain;

import cn.itsource.basic.domain.BaseDomain;
import com.fasterxml.jackson.annotation.JsonFormat;

import java.util.Date;
import java.util.List;

public class RepairdOrder extends BaseDomain {
    //客户名称
    private String custormer;
    //车牌号
    private String carNum;
    //维修单创建时间
    @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss", timezone = "GMT+8")
    private Date createTime;
    //维修单状态
    private Boolean status;
    //客户地址
    private String address;
    //维修人员外键
    private RepairPerson repairPerson;
    //维修单明细
    private List<RepairdOrderItems> repairdOrderItems;
	
    public List<RepairdOrderItems> getRepairdOrderItems() {
        return repairdOrderItems;
    }

    public void setRepairdOrderItems(List<RepairdOrderItems> repairdOrderItems) {
        this.repairdOrderItems = repairdOrderItems;
    }

    public String getCustormer() {
        return custormer;
    }

    public void setCustormer(String custormer) {
        this.custormer = custormer;
    }

    public String getCarNum() {
        return carNum;
    }

    public void setCarNum(String carNum) {
        this.carNum = carNum;
    }
    public Date getCreateTime() {
        return createTime;
    }
    public void setCreateTime(Date createTime) {
        this.createTime = createTime;
    }

    public Boolean getStatus() {
        return status;
    }

    public void setStatus(Boolean status) {
        this.status = status;
    }

    public String getAddress() {
        return address;
    }

    public void setAddress(String address) {
        this.address = address;
    }

    public RepairPerson getRepairPerson() {
        return repairPerson;
    }

    public void setRepairPerson(RepairPerson repairPerson) {
        this.repairPerson = repairPerson;
    }

    @Override
    public String toString() {
        return "RepairdOrder{" +
                "custormer='" + custormer + '\'' +
                ", carNum='" + carNum + '\'' +
                ", createTime=" + createTime +
                ", status=" + status +
                ", address='" + address + '\'' +
                ", repairPerson=" + repairPerson +
                ", repairdOrderItems=" + repairdOrderItems +
                ", id=" + id +
                '}';
    }
}

RepairdOrderItems.java(维修单明细管理)

package cn.itsource.rpms.common.domain;

import cn.itsource.basic.domain.BaseDomain;

import java.math.BigDecimal;

public class RepairdOrderItems extends BaseDomain {
   //配件价格
   private BigDecimal amt1;
   //工时费
   private BigDecimal amt2;
   //配件数量
   private Integer num;
   //总金额
   private BigDecimal totalAmt;
   //维修工单id
   private Long mainId;
   //维修人员id
   private RepairPerson repairPerson;
   //配件id
   private Parts parts;

   public BigDecimal getAmt1() {
      return amt1;
   }

   public void setAmt1(BigDecimal amt1) {
      this.amt1 = amt1;
   }

   public BigDecimal getAmt2() {
      return amt2;
   }

   public void setAmt2(BigDecimal amt2) {
      this.amt2 = amt2;
   }

   public Integer getNum() {
      return num;
   }

   public void setNum(Integer num) {
      this.num = num;
   }

   public BigDecimal getTotalAmt() {
      return totalAmt;
   }

   public void setTotalAmt(BigDecimal totalAmt) {
      this.totalAmt = totalAmt;
   }

   public Long getMainId() {
      return mainId;
   }

   public void setMainId(Long mainId) {
      this.mainId = mainId;
   }

   public RepairPerson getRepairPerson() {
      return repairPerson;
   }

   public void setRepairPerson(RepairPerson repairPerson) {
      this.repairPerson = repairPerson;
   }

   public Parts getParts() {
      return parts;
   }

   public void setParts(Parts parts) {
      this.parts = parts;
   }

   @Override
   public String toString() {
      return "RepairdOrderItems{" +
              "amt1=" + amt1 +
              ", amt2=" + amt2 +
              ", num=" + num +
              ", totalAmt=" + totalAmt +
              ", mainId=" + mainId +
              ", repairPerson=" + repairPerson +
              ", parts=" + parts +
              '}';
   }
}

query(高级查询条件)

BaseQuery(所有高级查询类的父类)

package cn.itsource.basic.query;

public class BaseQuery {
    private Long page;
    //默认为每页10张数据
    private Long pageSize=10L;
    //查询关键字
    private String name;

    public Long getPage() {
        return page;
    }

    public void setPage(Long page) {
        this.page = page;
    }

    public Long getPageSize() {
        return pageSize;
    }

    public void setPageSize(Long pageSize) {
        this.pageSize = pageSize;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public Long getStart(){
        return (this.page-1)*pageSize;
    }
}

RepairdOrderQuery(维修单高级查询)

package cn.itsource.rpms.common.query;


import cn.itsource.basic.query.BaseQuery;

public class RepairdOrderQuery extends BaseQuery {
    //车牌号
    private String carNum;

    public String getCarNum() {
        return carNum;
    }

    public void setCarNum(String carNum) {
        this.carNum = carNum;
    }
}

RepairdOrderItemsQuery(维修单明细高级查询)

package cn.itsource.rpms.common.query;


import cn.itsource.basic.query.BaseQuery;

public class RepairdOrderItemsQuery extends BaseQuery {
    //根据维修单id动态加载维修单明细数据
    private Long mainId;

    public Long getMainId() {
        return mainId;
    }

    public void setMainId(Long mainId) {
        this.mainId = mainId;
    }
}

2.2.2 rmps_mapper(数据访问接口)

在这里插入图片描述
RepairdOrderMapper.java(维修单数据访问接口)

package cn.itsource.rpms.mapper;

import cn.itsource.basic.mapper.BaseMapper;
import cn.itsource.rpms.common.domain.RepairdOrder;

public interface RepairdOrderMapper extends BaseMapper<RepairdOrder> {


}

BaseMapper.java(所有做数据访问的接口的父接口)

package cn.itsource.basic.mapper;


import cn.itsource.basic.query.BaseQuery;

import java.io.Serializable;
import java.util.List;

public interface BaseMapper<T> {

    //保存
    void save(T t);

    //修改
    void update(T t);

    //删除
    void delete(Serializable id);

    //批量删除
    void batchDelete(Serializable[] ids);

    //查询所有
    List<T> findAll();

    //查询单个
    T findOne(Serializable id);

    //查询总页数
    Long queryCount(BaseQuery basicQuery);

    //查询分页的所有数据
    List<T> queryData(BaseQuery basicQuery);
}

RepairdOrderItemsMapper.java(维修单明细数据访问接口)

package cn.itsource.rpms.mapper;

import cn.itsource.basic.mapper.BaseMapper;
import cn.itsource.rpms.common.domain.RepairdOrderItems;

import java.io.Serializable;

public interface RepairdOrderItemsMapper extends BaseMapper<RepairdOrderItems> {
    /**
     * 根据 维修单号 mainId，删除关联的明细
     */
    void removeByMainId(Serializable id);

}

RepairdOrderMapper.xml(维修单数据访问sql映射)

<?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="cn.itsource.rpms.mapper.RepairdOrderMapper">
    <!--查询所有-->
    <select id="findAll" resultMap="repairdOrderMap">
        select * from repairdOrder
    </select>

    <!--查询一条-->
    <select id="findOne" parameterType="long" resultMap="repairdOrderMap">
        select * from repairdOrder where id=#{id}
    </select>

    <!--添加-->
    <insert id="save" parameterType="RepairdOrder" useGeneratedKeys="true" keyColumn="id" keyProperty="long">
        insert into repairdOrder(custormer,carnum,status,createtime,address,optid)
        values(#{custormer},#{carNum},#{status},#{createTime},#{address},#{repairPerson.id})
    </insert>

    <!--修改-->
    <update id="update" parameterType="RepairdOrder">
        update repairdOrder set custormer=#{custormer},
        carNum=#{carNum},status=#{status},
         address=#{address},optid=#{repairPerson.id}
        where id=#{id}
    </update>

    <!--删除-->
    <delete id="delete" parameterType="long">
        delete from repairdOrder where id=#{id}
    </delete>

    <!--批量删除-->
    <delete id="batchDelete">
        delete from repairdOrder where id in
        <foreach collection="array" item="ids" open="(" close=")" separator=",">
            #{ids}
        </foreach>
    </delete>

    <!--查询总页数
    记住需要添加where条件
    -->
    <select id="queryCount" parameterType="repairdOrderQuery" resultType="long">
        select count(id) from repairdOrder
        <where>
            <include refid="sqlWhere"></include>
        </where>
    </select>
    <!--查询pageList-->
    <select id="queryData" parameterType="repairdOrderQuery" resultMap="repairdOrderMap">
        select * from repairdOrder
        <where>
            <include refid="sqlWhere"></include>
        </where>
        LIMIT #{start},#{pageSize}
    </select>
    <!--高级查询,判断是否传入来了carNum值-->
    <sql id="sqlWhere">
        <if test="carNum!=null and carNum!=''">
            and carNum like concat('%',#{carNum},'%')
        </if>
    </sql>
    
    <resultMap id="repairdOrderMap" type="repairdOrder">
        <id column="id" property="id"/>
        <result column="custormer" property="custormer"/>
        <result column="carnum" property="carNum"/>
        <result column="createtime" property="createTime"/>
        <result column="status" property="status"/>
        <result column="address" property="address"/>
        <!--对repaitPerson一方处理-->
        <association column="optid" property="repairPerson" javaType="cn.itsource.rpms.common.domain.RepairPerson"
        select="findRepairPersonById">
        </association>

        <!--对repairdOrderItems多方处理-->
        <collection property="repairdOrderItems" column="id" select="cn.itsource.rpms.mapper.RepairdOrderItemsMapper.findOne"
        ofType="cn.itsource.rpms.common.domain.RepairdOrderItems">
        </collection>
    </resultMap>

    <!--嵌套查询维修员-->
    <select id="findRepairPersonById" parameterType="long"
            resultType="cn.itsource.rpms.common.domain.RepairPerson">
        select * from repairperson where id = #{id}
    </select>
</mapper>

RepairdOrderItemsMapper.xml(维修单明细数据访问sql映射)

<?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="cn.itsource.rpms.mapper.RepairdOrderItemsMapper">
    <!--查询所有-->
    <select id="findAll" resultMap="repairdOrderItemsMap">
        select * from repairdOrderItems
    </select>

    <!--查询一条-->
    <select id="findOne" parameterType="long" resultMap="repairdOrderItemsMap">
        select * from repairdOrderItems where id=#{id}
    </select>

    <!--添加-->
    <insert id="save" parameterType="RepairdOrderItems" useGeneratedKeys="true" keyColumn="id" keyProperty="id">
        insert into repairdOrderItems(amt1,amt2,num,totalamt,mainid,optid,pid)
        values(#{amt1},#{amt2},#{num},#{totalAmt},#{mainId},#{repairPerson.id},#{parts.id})
    </insert>

    <!--修改-->
    <update id="update" parameterType="RepairdOrderItems">
        update repairdOrderItems set amt1=#{amt1},
        amt2=#{amt2},num=#{num},totalamt=#{totalAmt},
         mainid=#{mainId},optid=#{repairPerson.id},
         pid=#{parts.id}
        where id=#{id}
    </update>

    <!--删除-->
    <delete id="delete" parameterType="long">
        delete from repairdOrderItems where id=#{id}
    </delete>

    <!--批量删除-->
    <delete id="batchDelete">
        delete from repairdOrderItems where id in
        <foreach collection="array" item="ids" open="(" close=")" separator=",">
            #{ids}
        </foreach>
    </delete>

    <!--查询总页数
    记住需要添加where条件
    -->
    <select id="queryCount" parameterType="repairdOrderItemsQuery" resultType="long">
        select count(id) from repairdOrderItems
    </select>
    <!--查询pageList-->
    <select id="queryData" parameterType="repairdOrderItemsQuery" resultMap="repairdOrderItemsMap">
        select * from repairdOrderItems
        where mainid=#{mainId}
        order by totalamt
        LIMIT #{start},#{pageSize}
    </select>
    <resultMap id="repairdOrderItemsMap" type="repairdOrderItems">
        <id column="id" property="id"/>
        <result column="mainid" property="mainId"/>
        <result column="amt1" property="amt1"/>
        <result column="amt2" property="amt2"/>
        <result column="num" property="num"/>
        <result column="totalamt" property="totalAmt"/>

        <!--对repaitPerson一方处理-->
        <association column="optid" property="repairPerson" javaType="cn.itsource.rpms.common.domain.RepairPerson"
                     select="findRepairPersonById">
        </association>
        <!--对parts一方处理-->
        <association property="parts" javaType="cn.itsource.rpms.common.domain.Parts" column="pid"
                     select="findPartsById">
        </association>
    </resultMap>

    <!--嵌套查询维修员-->
    <select id="findRepairPersonById" parameterType="long"
            resultType="cn.itsource.rpms.common.domain.RepairPerson">
        select * from repairperson where id = #{id}
    </select>

    <!--嵌套查询配件-->
    <select id="findPartsById" parameterType="long"
            resultType="cn.itsource.rpms.common.domain.Parts">
        select * from parts where id = #{id}
    </select>

    <!--根据 维修单号 mainId，删除关联的明细-->
    <delete id="removeByMainId" parameterType="long">
        delete from repairdorderitems where mainid = #{mainid}
    </delete>

</mapper>

2.2.3 rpms_service(服务层)

在这里插入图片描述

IRepairdOrderService.java(维修单服务接口)

package cn.itsource.rpms.service;


import cn.itsource.basic.service.IBaseService;
import cn.itsource.rpms.common.domain.RepairdOrder;

public interface IRepairdOrderService extends IBaseService<RepairdOrder> {
}

IBaseService.java(所有做服务层接口的父接口)

package cn.itsource.basic.service;

import cn.itsource.basic.query.BaseQuery;
import cn.itsource.basic.util.PageList;

import java.io.Serializable;
import java.util.List;

public interface IBaseService<T> {
    //保存
    void save(T t);

    //修改
    void update(T t);

    //删除
    void delete(Serializable id);

    //批量删除
    void batchDelete(Serializable[] ids);

    //查询所有
    List<T> findAll();

    //查询单个
    T findOne(Serializable id);
	//分页查询
    PageList<T> query(BaseQuery basicQuery);
}

IRepairdOrderItemsService.java(维修单明细服务层接口)

package cn.itsource.rpms.service;


import cn.itsource.basic.service.IBaseService;
import cn.itsource.rpms.common.domain.RepairdOrderItems;

import java.io.Serializable;

public interface IRepairdOrderItemsService extends IBaseService<RepairdOrderItems> {

    /**
     * 根据 维修单号 mainId，删除关联的明细
     */
    void removeByMainId(Serializable id);
}

RepairdOrderServiceImpl.java(维修单服务实现类)

package cn.itsource.rpms.service.impl;

import cn.itsource.basic.service.impl.BaseServiceImpl;
import cn.itsource.rpms.common.domain.RepairdOrder;
import cn.itsource.rpms.service.IRepairdOrderService;
import org.springframework.stereotype.Service;

@Service
public class RepairdOrderServiceImpl extends BaseServiceImpl<RepairdOrder> implements IRepairdOrderService {

}

BaseServiceImpl.java(所有做服务层实现类的父类)

package cn.itsource.basic.service.impl;

import cn.itsource.basic.mapper.BaseMapper;
import cn.itsource.basic.query.BaseQuery;
import cn.itsource.basic.service.IBaseService;
import cn.itsource.basic.util.PageList;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.transaction.annotation.Propagation;
import org.springframework.transaction.annotation.Transactional;

import java.io.Serializable;
import java.util.List;

@Transactional(propagation = Propagation.SUPPORTS, readOnly = false)
public class BaseServiceImpl<T> implements IBaseService<T> {

    @Autowired
    private BaseMapper<T> baseMapper;

    @Override
    @Transactional
    public void save(T t) {
        baseMapper.save(t);
    }

    @Override
    @Transactional
    public void update(T t) {
        baseMapper.update(t);
    }

    @Override
    @Transactional
    public void delete(Serializable id) {
        baseMapper.delete(id);
    }

    @Override
    public void batchDelete(Serializable[] ids) {
        baseMapper.batchDelete(ids);
    }

    @Override
    public List<T> findAll() {
        return baseMapper.findAll();
    }

    @Override
    public T findOne(Serializable id) {
        return baseMapper.findOne(id);
    }

    @Override
    public PageList<T> query(BaseQuery baseQuery) {
        //总条数
        Long total = baseMapper.queryCount(baseQuery);

        //分页后数据
        List<T> rows = baseMapper.queryData(baseQuery);

        return new PageList<T>(total,rows);

    }
}

RepairdOrderItemsServiceImpl.java(维修单明细服务实现类)

package cn.itsource.rpms.service.impl;

import cn.itsource.basic.service.impl.BaseServiceImpl;
import cn.itsource.rpms.common.domain.RepairdOrderItems;
import cn.itsource.rpms.mapper.RepairdOrderItemsMapper;
import cn.itsource.rpms.service.IRepairdOrderItemsService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import java.io.Serializable;

@Service
public class RepairdOrderItemsServiceImpl extends BaseServiceImpl<RepairdOrderItems> implements IRepairdOrderItemsService {

    @Autowired
    private RepairdOrderItemsMapper repairdOrderItemsMapper;
    @Override
    public void removeByMainId(Serializable id) {
        repairdOrderItemsMapper.removeByMainId(id);
    }
}

2.2.4 rpms_web(相当于controller层)

在这里插入图片描述

RepairdOrderController.java(维修单controller)

package cn.itsource.rpms.web.controller;

import cn.itsource.basic.util.AjaxResult;
import cn.itsource.basic.util.PageList;
import cn.itsource.rpms.common.domain.RepairdOrder;
import cn.itsource.rpms.common.query.RepairdOrderQuery;
import cn.itsource.rpms.service.IRepairdOrderItemsService;
import cn.itsource.rpms.service.IRepairdOrderService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;

import java.util.Date;
import java.util.List;

@Controller
@RequestMapping("/repairdOrder")
@CrossOrigin
public class RepairdOrderController {

    @Autowired
    private IRepairdOrderService repairdOrderService;
    @Autowired
    private IRepairdOrderItemsService repairdOrderItemsService;
    /**
     * 查询所有
     * @return
     */
    @RequestMapping(value = "/list",method = RequestMethod.PATCH)
    @ResponseBody
    @CrossOrigin
    public PageList<RepairdOrder> findList(@RequestBody RepairdOrderQuery repairdOrderQuery){
        return repairdOrderService.query(repairdOrderQuery);
    }

    /**
     * 查询一条
     * @param id
     * @return
     */
    @RequestMapping(value = "/query/{id}",method = RequestMethod.GET)
    @ResponseBody
    @CrossOrigin
    public RepairdOrder query(@PathVariable("id") Long id){
        return repairdOrderService.findOne(id);
    }

    /**
     * 保存
     * @param repairdOrder
     * @return
     */
    @RequestMapping(value = "/save",method = RequestMethod.PUT)
    @ResponseBody
    @CrossOrigin
    public AjaxResult save(@RequestBody RepairdOrder repairdOrder){
        try {
            //设置时间
            repairdOrder.setCreateTime(new Date());
            repairdOrder.setStatus(false);
            repairdOrderService.save(repairdOrder);
            return new AjaxResult();
        } catch (Exception e) {
            e.printStackTrace();
            return new AjaxResult("添加失败！");
        }
    }

    /**
     * 修改
     * @param repairdOrder
     * @return
     */
    @RequestMapping(value = "/update",method = RequestMethod.POST)
    @ResponseBody
    @CrossOrigin
    public AjaxResult update(@RequestBody RepairdOrder repairdOrder){
        try {
            repairdOrderService.update(repairdOrder);
            return new AjaxResult();
        } catch (Exception e) {
            e.printStackTrace();
            return new AjaxResult("修改失败！");
        }
    }

    /**
     * 删除
     * @param id
     * @return
     */
    @RequestMapping(value = "/delete/{id}",method = RequestMethod.DELETE)
    @ResponseBody
    @CrossOrigin
    public AjaxResult delete(@PathVariable("id") Long id){
        try {
            repairdOrderService.delete(id);
            //根据 维修单号 mainId，删除关联的明细
            repairdOrderItemsService.removeByMainId(id);
            return new AjaxResult();
        } catch (Exception e) {
            e.printStackTrace();
            return new AjaxResult("删除失败！");
        }
    }

    //批量删除
    @RequestMapping(value = "/batchDelete",method = RequestMethod.POST)
    @ResponseBody
    @CrossOrigin
    public AjaxResult batchDelete(@RequestBody List<RepairdOrder> repairdOrders ){
        try {
            for (RepairdOrder repairdOrder : repairdOrders) {
                repairdOrderService.delete(repairdOrder.getId());
                //根据 维修单号 mainId，批量删除关联的明细
                repairdOrderItemsService.removeByMainId(repairdOrder.getId());
            }

            return new AjaxResult();
        } catch (Exception e) {
            e.printStackTrace();
            return new AjaxResult("批量删除失败！");
        }
    }

}

RepairdOrderItemsController.java(维修单明细controller)

package cn.itsource.rpms.web.controller;

import cn.itsource.basic.util.AjaxResult;
import cn.itsource.basic.util.PageList;
import cn.itsource.rpms.common.domain.RepairdOrderItems;
import cn.itsource.rpms.common.query.RepairdOrderItemsQuery;
import cn.itsource.rpms.service.IRepairdOrderItemsService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;

import java.util.Map;

@Controller
@RequestMapping("/repairdOrderItems")
@CrossOrigin
public class RepairdOrderItemsController {

    @Autowired
    private IRepairdOrderItemsService repairdOrderItemsService;

    /**
     * 查询所有
     * @return
     */
    @RequestMapping(value = "/list",method = RequestMethod.PATCH)
    @ResponseBody
    @CrossOrigin
    public PageList<RepairdOrderItems> findList(@RequestBody RepairdOrderItemsQuery repairdOrderItemsQuery){
        return repairdOrderItemsService.query(repairdOrderItemsQuery);
    }

    /**
     * 查询一条
     * @param id
     * @return
     */
    @RequestMapping(value = "/query/{id}",method = RequestMethod.GET)
    @ResponseBody
    @CrossOrigin
    public RepairdOrderItems query(@PathVariable("id") Long id){
        return repairdOrderItemsService.findOne(id);
    }

    /**
     * 保存
     * @param repairdOrderItems
     * @return
     */
    @RequestMapping(value = "/save",method = RequestMethod.PUT)
    @ResponseBody
    @CrossOrigin
    public AjaxResult save(@RequestBody RepairdOrderItems repairdOrderItems){
        try {
            repairdOrderItemsService.save(repairdOrderItems);
            return new AjaxResult();
        } catch (Exception e) {
            e.printStackTrace();
            return new AjaxResult("添加失败！");
        }
    }

    /**
     * 修改
     * @param repairdOrderItems
     * @return
     */
    @RequestMapping(value = "/update",method = RequestMethod.POST)
    @ResponseBody
    @CrossOrigin
    public AjaxResult update(@RequestBody RepairdOrderItems repairdOrderItems){
        try {
            repairdOrderItemsService.update(repairdOrderItems);
            return new AjaxResult();
        } catch (Exception e) {
            e.printStackTrace();
            return new AjaxResult("修改失败！");
        }
    }

    /**
     * 删除
     * @param id
     * @return
     */
    @RequestMapping(value = "/delete/{id}",method = RequestMethod.DELETE)
    @ResponseBody
    @CrossOrigin
    public AjaxResult delete(@PathVariable("id") Long id){
        try {
            repairdOrderItemsService.delete(id);
            return new AjaxResult();
        } catch (Exception e) {
            e.printStackTrace();
            return new AjaxResult("删除失败！");
        }
    }

    //批量删除
    @RequestMapping(value = "/batchDelete",method = RequestMethod.POST)
    @ResponseBody
    @CrossOrigin
    public AjaxResult batchDelete(@RequestBody Map<String,Object> params){
        String ids = params.get("ids").toString();
        String[] id = ids.split(",");
        try {
            repairdOrderItemsService.batchDelete(id);
            return new AjaxResult();
        } catch (Exception e) {
            e.printStackTrace();
            return new AjaxResult("批量删除失败！");
        }
    }
}

3.前端代码：

3.1项目总览：

在这里插入图片描述

3.2局部详情：

RepairdOrder.vue(维修单及维修单明细前端)

<template>
	<div>
		<!--==================================================维修单===============================================-->
		<section>

			<!--工具条-->
			<el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
				<el-form :inline="true" :model="filters">
					<el-form-item>
						<el-input v-model="filters.carNum" placeholder="请输入车牌号"></el-input>
					</el-form-item>
					<el-form-item>
						<el-button type="primary" v-on:click="getRepairdOrder" icon="el-icon-search">查询</el-button>
					</el-form-item>
					<el-form-item>
						<el-button type="primary" @click="handleRepairdOrderAdd" icon="el-icon-plus">新增</el-button>
					</el-form-item>
					<el-form-item>
						<el-button type="primary" @click="handleAddRepairdOrderItems" icon="el-icon-circle-plus-outline">新增维修单明细</el-button>
					</el-form-item>
					<el-form-item>
						<el-button type="primary" @click="handleCount" icon="el-icon-date">订单结算</el-button>
					</el-form-item>
				</el-form>
			</el-col>

			<!--维修单列表-->
			<el-table :data="repairdOrder" highlight-current-row v-loading="listLoading" @selection-change="selsChange"
					  style="width: 100%;" @row-dblclick="showItems" height="200">
				<el-table-column type="selection" min-width="1%">
				</el-table-column>
				<el-table-column type="index" label="Id" min-width="1%">
				</el-table-column>
				<el-table-column prop="id" label="维修编号" min-width="11%" sortable>
				</el-table-column>
				<el-table-column prop="custormer" label="客户名称" min-width="11%" sortable>
				</el-table-column>
				<el-table-column prop="carNum" label="车牌号" min-width="11%"  sortable>
				</el-table-column>
				<el-table-column prop="repairPerson.optName" label="维修员" min-width="11%" sortable>
				</el-table-column>
				<el-table-column prop="createTime" label="创建时间" sortable min-width="16%">
				</el-table-column>
				<el-table-column prop="status" label="订单状态" min-width="11%" sortable>
					<template slot-scope="scope">
						<!--<p v-html='scope.row.status' v-if="scope.row.status==0" style="color: red"></p>
                        <p v-html='scope.row.status' v-else="" style="color: green"></p>-->
						<span  v-if="scope.row.status==0"  style="color: red">已录入</span>
						<span  v-else=""  style="color: green">已结算</span>
					</template>
				</el-table-column>
				<el-table-column prop="address" label="客户地址" min-width="17%">
				</el-table-column>
				<el-table-column label="操作" min-width="16%">
					<template scope="scope">
						<el-button size="small" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
						<el-button type="danger" size="small" @click="handleRepairdOrderDel(scope.$index, scope.row)">删除</el-button>
					</template>
				</el-table-column>
			</el-table>

			<!--工具条-->
			<el-col :span="24" class="toolbar">
				<el-button type="danger" @click="RepairdOrderbatchRemove" :disabled="this.sels.length===0">批量删除</el-button>
				<el-pagination layout="prev, pager, next" @current-change="handleRepairdOrderList" :page-size=pageSize :total="total" style="float:right;">
				</el-pagination>
			</el-col>

			<!--维修单编辑界面-->
			<el-dialog title="编辑维修单" :visible.sync="editFormVisible" v-model="editFormVisible" :close-on-click-modal="false">
				<el-form :model="editForm" label-width="100px" :rules="editFormRules" ref="editForm" style="margin-left:50px">
					<h1 style="text-align: center">维修单列表</h1>
					<hr/>
					<el-form-item label="客户名称:" prop="custormer">
						<el-input v-model="editForm.custormer" auto-complete="off" style="width:400px"></el-input>
					</el-form-item>
					<el-form-item label="车牌号:" prop="carNum">
						<el-input v-model="editForm.carNum" auto-complete="off"  style="width:400px"></el-input>
					</el-form-item>
					<el-form-item label="维修人员:" prop="optName">
						<el-select v-model="editForm.repairPerson" placeholder="请选择维修人员">
							<el-option
									v-for="item in repairPersons"
									:key="item.id"
									:label="item.optName"
									:value="item.id">
							</el-option>
						</el-select>
					</el-form-item>
					<el-form-item label="客户地址:" prop="address">
						<el-input v-model="editForm.address" auto-complete="off"  style="width:400px"></el-input>
					</el-form-item>
				</el-form>
				<div slot="footer" class="dialog-footer">
					<el-button @click.native="editFormVisible = false">取消</el-button>
					<el-button @click="resetForm('editForm')" type="info">重置</el-button>
					<el-button type="primary" @click.native="editSubmit" :loading="editLoading">提交</el-button>
				</div>
			</el-dialog>

			<!--维修单新增界面-->
			<el-dialog title="添加维修单" :visible.sync="addFormVisible" v-model="addFormVisible" :close-on-click-modal="false">
				<el-form :model="addForm" label-width="100px" :rules="addFormRules" ref="addForm" style="margin-left:50px">
					<h1 style="text-align: center">维修单列表</h1>
					<hr/>
					<el-form-item label="客户名称:" prop="custormer">
						<el-input v-model="addForm.custormer" auto-complete="off" style="width:400px"></el-input>
					</el-form-item>
					<el-form-item label="车牌号:" prop="carNum">
						<el-input v-model="addForm.carNum" auto-complete="off"  style="width:400px"></el-input>
					</el-form-item>
					<el-form-item label="维修人员:" prop="optName">
						<el-select v-model="addForm.repairPerson" placeholder="请选择维修人员">
							<el-option
									v-for="item in repairPersons"
									:key="item.id"
									:label="item.optName"
									:value="item.id">
							</el-option>
						</el-select>
					</el-form-item>
					<el-form-item label="客户地址:" prop="address">
						<el-input v-model="addForm.address" auto-complete="off"  style="width:400px"></el-input>
					</el-form-item>
				</el-form>
				<div slot="footer" class="dialog-footer">
					<el-button @click.native="addFormVisible = false">取消</el-button>
					<el-button @click="resetForm('addForm')" type="info">重置</el-button>
					<el-button type="primary" @click.native="repairdOrderAddSubmit" :loading="addLoading">提交</el-button>
				</div>
			</el-dialog>

			<!--结算维修单新增界面-->
			<el-dialog title="结算维修单" :visible.sync="addSettFormVisible" v-model="addSettFormVisible" :close-on-click-modal="false">
				<el-form :model="addSettForm" label-width="100px" ref="addSettForm" style="margin-left:50px">
					<h1 style="text-align: center">结算单列表</h1>
					<hr/>
					<el-form-item label="客户名称:" prop="custormer">
						<el-input v-model="addSettForm.custormer" auto-complete="off" style="width:400px" disabled></el-input>
					</el-form-item>
					<el-form-item label="应付金额:" prop="re_amount">
						<el-input v-model="addSettForm.re_amount" auto-complete="off"  style="width:400px" disabled></el-input>
					</el-form-item>
					<el-form-item label="实付金额:" prop="pay_amount">
						<el-input v-model="addSettForm.pay_amout" auto-complete="off"  style="width:400px" disabled></el-input>
					</el-form-item>
					<el-form-item label="支付方式:" prop="payType">
						<el-select v-model="addSettForm.payId" placeholder="请选择维修人员">
							<el-option
									v-for="item in payType"
									:key="item.id"
									:label="item.payTypeName"
									:value="item.id">
							</el-option>
						</el-select>
					</el-form-item>
				</el-form>
				<div slot="footer" class="dialog-footer">
					<el-button @click.native="addSettFormVisible = false">取消</el-button>
					<el-button @click="resetForm('addSettForm')" type="info">重置</el-button>
					<el-button type="primary" @click.native="settledOrderAddForm" :loading="addLoading">提交</el-button>
				</div>
			</el-dialog>
		</section>
		<!--==================================================维修明细单===============================================-->
		<section>
			<h3 style="font-size: 14px">维修工单明细管理</h3>
			<!--维修单明细列表-->
			<el-table :data="repairdOrderItems" highlight-current-row v-loading="listLoading" @selection-change="selsItemsChange" style="width: 100%;">
				<el-table-column type="selection" min-width="1%" height="200">
				</el-table-column>
				<el-table-column type="index" label="Id" min-width="1%">
				</el-table-column>
				<el-table-column prop="id" label="明细编号" sortable min-width="10%">
				</el-table-column>
				<el-table-column prop="mainId" label="维修编号" sortable min-width="10%">
				</el-table-column>
				<el-table-column prop="parts.partsName" label="维修零件" min-width="7%">
				</el-table-column>
				<el-table-column prop="num" label="零件数量" min-width="9%">
				</el-table-column>
				<el-table-column prop="amt1" label="零件金额" sortable min-width="9%">
				</el-table-column>
				<el-table-column prop="amt2" label="工时费" sortable min-width="9%">
				</el-table-column>
				<el-table-column prop="totalAmt" label="总金额(元)" sortable min-width="9%">
				</el-table-column>
				<el-table-column prop="repairPerson.optName" label="维修员" min-width="9%">
				</el-table-column>
				<el-table-column label="操作" min-width="16%">
					<template scope="scope">
						<el-button size="small" @click="handleItemsEdit(scope.$index, scope.row)">编辑</el-button>
						<el-button type="danger" size="small" @click="handleRepairdOrderItemsDel(scope.$index, scope.row)">删除</el-button>
					</template>
				</el-table-column>
			</el-table>

			<!--工具条-->
			<el-col :span="24" class="toolbar">
				<el-button type="danger" @click="repairdOrderItemsbatchRemove" :disabled="this.selsItems.length===0">批量删除</el-button>
				<el-pagination layout="prev, pager, next" @current-change="handleRepairdOrderItemsList" :page-size=pageSize :total="total" style="float:right;">
				</el-pagination>
			</el-col>

			<!--维修工单明细新增界面-->
			<el-dialog title="维修单明细" :visible.sync="addFormItemsVisible" v-model="addFormItemsVisible" :close-on-click-modal="false">
				<el-form :model="addFormItems" label-width="100px" :rules="addFormItemsRules" ref="addFormItems" style="margin-left:50px">
					<h1 style="text-align: center">维修单明细列表</h1>
					<hr/>
					<el-form-item label="汽车维修零件:" prop="partsName">
						<el-select v-model="addFormItems.parts" placeholder="请选择维修零件">
							<el-option
									v-for="item in partss"
									:key="item.id"
									:label="item.partsName"
									:value="item.id">
							</el-option>
						</el-select>
					</el-form-item>
					<el-form-item label="零件数量:" prop="num">
						<el-input v-model.number="addFormItems.num" auto-complete="off"  style="width:400px"></el-input>
					</el-form-item>
					<el-form-item label="零件金额:" prop="amt1">
						<el-input v-model.number="addFormItems.amt1" auto-complete="off"  style="width:400px"></el-input>
					</el-form-item>
					<el-form-item label="工时费:" prop="amt2">
						<el-input v-model.number="addFormItems.amt2" auto-complete="off"  style="width:400px"></el-input>
					</el-form-item>
					<el-form-item label="维修人员:" prop="optName">
						<el-select v-model="addFormItems.repairPerson" placeholder="请选择维修人员">
							<el-option
									v-for="item in repairPersons"
									:key="item.id"
									:label="item.optName"
									:value="item.id">
							</el-option>
						</el-select>
					</el-form-item>
				</el-form>
				<div slot="footer" class="dialog-footer">
					<el-button @click.native="addFormItemsVisible = false">取消</el-button>
					<el-button @click="resetForm('addFormItems')" type="info">重置</el-button>
					<el-button type="primary" @click.native="repairdOrderItemsAddSubmit" :loading="addLoading">提交</el-button>
				</div>
			</el-dialog>

			<!--维修单明细编辑界面-->
			<el-dialog title="编辑维修单明细" :visible.sync="editFormItemsVisible" v-model="editFormItemsVisible" :close-on-click-modal="false">
				<el-form :model="editFormItems" label-width="100px" :rules="editFormItemsRules" ref="editFormItems" style="margin-left:50px">
					<h1 style="text-align: center">维修单明细列表</h1>
					<hr/>
					<el-form-item label="汽车维修零件:" prop="partsName">
						<el-select v-model="editFormItems.parts" placeholder="请选择维修零件">
							<el-option
									v-for="item in partss"
									:key="item.id"
									:label="item.partsName"
									:value="item.id">
							</el-option>
						</el-select>
					</el-form-item>
					<el-form-item label="零件数量:" prop="num">
						<el-input v-model.number="editFormItems.num" auto-complete="off"  style="width:400px"></el-input>
					</el-form-item>
					<el-form-item label="零件金额:" prop="amt1">
						<el-input :point="2" v-model.number="editFormItems.amt1" auto-complete="off"  style="width:400px"></el-input>
					</el-form-item>
					<el-form-item label="工时费:" prop="amt2">
						<el-input v-model.number="editFormItems.amt2" auto-complete="off"  style="width:400px"></el-input>
					</el-form-item>
					<el-form-item label="维修人员:" prop="optName">
						<el-select v-model="editFormItems.repairPerson" placeholder="请选择维修人员">
							<el-option
									v-for="item in repairPersons"
									:key="item.id"
									:label="item.optName"
									:value="item.id">
							</el-option>
						</el-select>
					</el-form-item>
				</el-form>
				<div slot="footer" class="dialog-footer">
					<el-button @click.native="editFormItemsVisible = false">取消</el-button>
					<el-button @click="resetForm('editFormItems')" type="info">重置</el-button>
					<el-button type="primary" @click.native="editItemsSubmit" :loading="editLoading">提交</el-button>
				</div>
			</el-dialog>
		</section>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				/*==================================================维修单===============================================*/
				filters: {
					carNum: ''
				},
				//双击后选中的一行维修单数据
				CurrentRowRepairdOrder:{
					repairdOrderItems:[],
				},
				status:-1,
				repairPerson:[],
				repairPersons:[],
				repairdOrder: [],
				//支付方式
				payType:[],
				payId:0,
				total: 0,
				page: 1,
				pageSize:10,
				mainId:0,
				custormer:"",
				address:"",
				listLoading: false,
				//维修单多选时，列表选中行，默认为空
				sels: [],
				//编辑界面是否显示
				editFormVisible: false,
				editLoading: false,
				editFormRules: {
					custormer: [
						{ required: true, message: '请输入客户姓名', trigger: 'blur' }
					],
					carNum: [
						{ required: true, message: '请输入车牌号', trigger: 'blur' }
					],
					repairPerson: [
						{ required: true, message: '请选择维修员', trigger: 'change' }
					],
					address: [
						{ required: true, message: '请输入客户地址', trigger: 'blur' }
					],
				},
				//维修单编辑界面数据
				editForm: {
					id:0,
					status:-1,
					repairPerson:[],
					custormer:"",
					carNum: "",
					address:""
				},
				//新增界面是否显示
				addFormVisible: false,
				addLoading: false,
				addFormRules: {
					custormer: [
						{ required: true, message: '请输入客户姓名', trigger: 'blur' }
					],
					carNum: [
						{ required: true, message: '请输入车牌号', trigger: 'blur' }
					],
					repairPerson: [
						{ required: true, message: '请选择维修员', trigger: 'change' }
					],
					address: [
						{ required: true, message: '请输入客户地址', trigger: 'blur' }
					],
				},
				//结算维修单界面是否显示
				addSettFormVisible: false,
				addLoading: false,
				addFormRules: {
					custormer: [
						{ required: true, message: '客户姓名', trigger: 'blur' }
					],
					carNum: [
						{ required: true, message: '请输入车牌号', trigger: 'blur' }
					],
					repairPerson: [
						{ required: true, message: '请选择维修员', trigger: 'change' }
					],
					address: [
						{ required: true, message: '请输入客户地址', trigger: 'blur' }
					],
				},

				//维修单新增界面数据
				addForm: {
					custormer:"",
					carNum: "",
					repairPerson:[],
					address:""
				},

				/*==================================================结算维修单===============================================*/
				addSettForm:{
					custormer:"",
					re_amount:0,
					pay_amout:0,
					address:"",
				},
				/*==================================================维修明细单===============================================*/
				repairdOrderItems:[],
				selsItems:[],
				//编辑明细界面是否显示
				editFormItemsVisible: false,
				parts:[],
				partss:[],
				editFormItemsRules: {
					amt1: [
						{ required: true, message: '请输入配件价格', trigger: 'blur' },
						{ type: 'number', message: '配件价格必须为数字值'}
					],
					amt2: [
						{ required: true, message: '请输入工时费', trigger: 'blur' },
						{ type: 'number', message: '工时费必须为数字值'}
					],
					num: [
						{ required: true, message: '请输入零件数量', trigger: 'blur' },
						{ type: 'number', message: '零件数量必须为数字值'}
					],
					repairPerson: [
						{ required: true, message: '请选择维修员', trigger: 'change' }
					],
					parts: [
						{ required: true, message: '请选择维修零件', trigger: 'change' }
					],
				},

				//维修单明细编辑界面数据
				editFormItems: {
					id:0,
					mainId:this.mainId,
					amt1:0,
					amt2: 0,
					num:0,
					totalAmt:0,
					parts:[],
					repairPerson:[]
				},

				//新增明细界面是否显示
				addFormItemsVisible:false,
				//新增明细单规则验证
				addFormItemsRules: {
					amt1: [
						{ required: true, message: '请输入配件价格', trigger: 'blur' },
						{ type: 'number', message: '配件价格必须为数字值'}
					],
					amt2: [
						{ required: true, message: '请输入工时费', trigger: 'blur' },
						{ type: 'number', message: '工时费必须为数字值'}
					],
					num: [
						{ required: true, message: '请输入零件数量', trigger: 'blur' },
						{ type: 'number', message: '零件数量必须为数字值'}
					],
					repairPerson: [
						{ required: true, message: '请选择维修员', trigger: 'change' }
					],
					parts: [
						{ required: true, message: '请选择维修零件', trigger: 'change' }
					],
				},

				//维修单明细新增界面数据
				addFormItems: {
					mainId:this.mainId,
					amt1:0,
					amt2: 0,
					num:0,
					totalAmt:0,
					parts:[],
					repairPerson:[]
				}
			}
		},
		methods: {
			/*==================================================维修工单===============================================*/
			//加载维修工单分页数据
			handleRepairdOrderList(val) {
				this.page = val;
				this.getRepairdOrder();
			},

			//获取维修工单列表
			getRepairdOrder() {
				let para = {
					page: this.page,
					pageSize:this.pageSize,
					carNum: this.filters.carNum
				};
				this.listLoading = true;
				//NProgress.start();
				this.$http.patch("/repairdOrder/list",para).then(res=>{
					//将查询的数据渲染到table中
					this.repairdOrder=res.data.rows;
					this.total = res.data.total;
					//关闭旋转图标
					this.listLoading = false;
				})
			},

			//维修工单删除
			handleRepairdOrderDel: function (index, row) {
				this.$confirm('确认删除该记录吗?', '提示', {
					type: 'warning'
				}).then(() => {
					this.listLoading = true;
					//NProgress.start();
					this.$http.delete("/repairdOrder/delete/"+row.id).then(res=>{
						this.listLoading = false;
						let {success,msg} = res.data;
						if (success){
							this.$message({
								message: msg,
								type: 'success'
							});
						}else {
							this.$message({
								message: msg,
								type: 'error'
							});
						}
						this.getRepairdOrder();
						this.mainId=0;
						this.getRepairdOrderItems();
					});
				}).catch(() => {

				});
			},

			//显示维修工单编辑界面
			handleEdit: function (index, row) {
				this.editFormVisible = true;
				this.getRepairPerson();
				//回显数据
				this.editForm = Object.assign({}, row);
				//设置回显维修员
				this.editForm.repairPerson = row.repairPerson.id;
			},

			//显示维修工单新增界面
			handleRepairdOrderAdd: function () {
				this.addFormVisible = true;
				//清空表单
				this.addForm = {
					custormer:'',
					carNum: '',
					repairPerson:'',
					address:''
				};
				this.getRepairPerson();
			},

			//维修工单编辑
			editSubmit: function () {
				this.$refs.editForm.validate((valid) => {
					if (valid) {
						this.$confirm('确认提交吗？', '提示', {}).then(() => {
							this.editLoading = true;
							let para = Object.assign({}, this.editForm);
							//repairdOrder 类里repairPerson对象的形式封装
							para.repairPerson ={
								id:this.editForm.repairPerson
							};
							this.$http.post("/repairdOrder/update",para).then(res=>{
								this.editLoading = false;
								let {success,msg} = res.data;
								if (success){
									this.$message({
										message: msg,
										type: 'success'
									});
								}else {
									this.$message({
										message: msg,
										type: 'error'
									});
								}
								this.$refs['editForm'].resetFields();
								this.editFormVisible = false;
								this.getRepairdOrder();
								this.mainId=0;
								this.getRepairdOrderItems();
							});
						});
					}
				});
			},

			//维修工单新增
			repairdOrderAddSubmit: function () {
				this.$refs.addForm.validate((valid) => {
					if (valid) {
						this.$confirm('确认提交吗？', '提示', {}).then(() => {
							this.addLoading = true;
							let para = Object.assign({}, this.addForm);
							//repairdOrder 类里repairPerson对象的形式封装
							para.repairPerson ={
								id:this.addForm.repairPerson
							};
							this.$http.put("/repairdOrder/save",para).then(res=>{
								this.addLoading = false;
								let {success,msg} = res.data;
								if (success){
									this.$message({
										message: msg,
										type: 'success'
									});
								}else {
									this.$message({
										message: msg,
										type: 'error'
									});
								}
								this.$refs['addForm'].resetFields();
								this.addFormVisible = false;
								this.getRepairdOrder();
								this.mainId=0;
								this.getRepairdOrderItems();
							});
						});
					}
				});
			},

			//维修单多选时，选中项变化时取值
			selsChange: function (sels) {
				this.sels = sels;
			},

			//维修工单批量删除
			RepairdOrderbatchRemove: function () {
				this.$confirm('确认删除选中记录吗？', '提示', {
					type: 'warning'
				}).then(() => {
					this.listLoading = true;
					let para = this.sels;
					this.$http.post("/repairdOrder/batchDelete/",para).then(res=>{
						this.listLoading = false;
						let {success,msg} = res.data;
						this.$message({
							message: msg,
							type: 'success'
						});
						this.getRepairdOrder();
						this.mainId=0;
						this.getRepairdOrderItems();
					});
				}).catch(() => {

				});
			},
			/*==================================================维修明细单===============================================*/
			//根据维修单id双击显示维修单明细
			showItems(row){
				//将选中行赋值给中间变量
				this.CurrentRowRepairdOrder=row;
				//根据维修单号id查询明细
				this.mainId=row.id;
				//动态显示客户名称
				this.custormer = row.custormer;
				//动态地址
				this.address = row.address;
				//状态
				this.status = row.status;
				//console.log("此时维修明细单位："+this.mainId);
				//显示选中的车牌号
				//this.carNum=row.carNum;
				//分页加载
				this.getRepairdOrderItems();
			},

			//新增维修单明细界面
			handleAddRepairdOrderItems(){
				//判断是否选中维修单
				if(this.mainId===0){
					this.$message({
						message: "请双击选择维修单！",
						type: 'error'
					});
					return;
				}
				this.addFormItemsVisible = true;
				//清空表单
				this.addFormItems = {
					parts:[],
					num: 0,
					repairPerson:[],
					amt1:0,
					amt2:0,
					totalAmt:0
				};
				//查询维修员
				this.getRepairPerson();
				//查询维修零件
				this.getParts();
			},

			//加载维修工单明细分页数据
			handleRepairdOrderItemsList(val) {
				this.page = val;
				this.getRepairdOrderItems();
			},

			//显示维修工单明细编辑界面
			handleItemsEdit: function (index, row) {
				this.editFormItemsVisible = true;
				this.getRepairPerson();
				this.getParts();
				//回显数据
				//this.repairPerson= row.repairPerson.optName;
				this.editFormItems = Object.assign({}, row);
				//设置回显维修员
				this.editFormItems.repairPerson = row.repairPerson.id;
				//设置回显维修部件
				this.editFormItems.parts = row.parts.id;
			},

			//获取维修工单明细列表
			getRepairdOrderItems() {
				let para = {
					page: this.page,
					pageSize:this.pageSize,
					mainId:this.mainId
				};
				this.listLoading = true;
				this.$http.patch("/repairdOrderItems/list",para).then(res=>{
					//将查询的数据渲染到table中
					this.repairdOrderItems=res.data.rows;
					this.total = res.data.total;
					//关闭旋转图标
					this.listLoading = false;
				})
			},

			//维修工单明细新增
			repairdOrderItemsAddSubmit: function () {
				this.$refs.addFormItems.validate((valid) => {
					if (valid) {
						this.$confirm('确认提交吗？', '提示', {}).then(() => {
							this.addLoading = true;
							//总金额
							let totalAmt;
							//repairdOrder 类里repairPerson对象的形式封装
							let para={
								mainId:this.mainId,
								num:Number(this.addFormItems.num),
								amt1:Number(this.addFormItems.amt1),
								amt2:Number(this.addFormItems.amt2),
								repairPerson:{
									id:this.addFormItems.repairPerson
								},
								parts:{
									id:this.addFormItems.parts
								},
								//totalAmt:new Decimal(this.addFormItems.amt1).mul(this.addFormItems.num).toNumber().add(new Decimal(this.addFormItems.amt2)).toNumber()
								totalAmt:Number(this.addFormItems.amt1)*Number(this.addFormItems.num)+Number(this.addFormItems.amt2)
							};
							this.$http.put("/repairdOrderItems/save",para).then(res=>{
								this.addLoading = false;
								let {success,msg} = res.data;
								if (success){
									this.$message({
										message: msg,
										type: 'success'
									});
								}else {
									this.$message({
										message: msg,
										type: 'error'
									});
								}
								this.$refs['addFormItems'].resetFields();
								this.addFormItemsVisible = false;
								this.getRepairdOrderItems();
							});
						});
					}
				});
			},

			//维修工单明细删除
			handleRepairdOrderItemsDel: function (index, row) {
				this.$confirm('确认删除该记录吗?', '提示', {
					type: 'warning'
				}).then(() => {
					this.listLoading = true;
					//NProgress.start();
					this.$http.delete("/repairdOrderItems/delete/"+row.id).then(res=>{
						this.listLoading = false;
						let {success,msg} = res.data;
						if (success){
							this.$message({
								message: msg,
								type: 'success'
							});
						}else {
							this.$message({
								message: msg,
								type: 'error'
							});
						}
						this.getRepairdOrderItems();
					});
				}).catch(() => {

				});
			},

			//维修工单明细批量删除
			repairdOrderItemsbatchRemove: function () {
				var ids= this.selsItems.map(item => item.id).join();
				this.$confirm('确认删除选中记录吗？', '提示', {
					type: 'warning'
				}).then(() => {
					this.listLoading = true;
					this.$http.post("/repairdOrderItems/batchDelete/",{ids:ids}).then(res=>{
						this.listLoading = false;
						let {success,msg} = res.data;
						this.$message({
							message: msg,
							type: 'success'
						});
						this.getRepairdOrderItems();
					});
				}).catch(() => {

				});
			},
			//维修单明细多选时，选中项变化时取值
			selsItemsChange: function (selsItems) {
				this.selsItems = selsItems;
			},
			//发送请求获取支付方式
			getPayTypes:function(){
				this.$http.patch("/payType/page").then(res=>{
					this.payType = res.data;
				});
			},
			//维修工单明细编辑
			editItemsSubmit: function () {
				this.$refs.editFormItems.validate((valid) => {
					if (valid) {
						this.$confirm('确认提交吗？', '提示', {}).then(() => {
							this.editLoading = true;
							//总金额
							let totalAmt;
							//repairdOrder 类里repairPerson对象的形式封装
							let para={
								id:this.editFormItems.id,
								mainId:this.mainId,
								num:Number(this.editFormItems.num),
								amt1:Number(this.editFormItems.amt1),
								amt2:Number(this.editFormItems.amt2),
								repairPerson:{
									id:this.editFormItems.repairPerson
								},
								parts:{
									id:this.editFormItems.parts
								},
								//totalAmt:new Decimal(this.addFormItems.amt1).mul(this.addFormItems.num).toNumber().add(new Decimal(this.addFormItems.amt2)).toNumber()
								totalAmt:Number(this.editFormItems.amt1)*Number(this.editFormItems.num)+Number(this.editFormItems.amt2)
							};
							this.$http.post("/repairdOrderItems/update",para).then(res=>{
								this.editLoading = false;
								let {success,msg} = res.data;
								if (success){
									this.$message({
										message: msg,
										type: 'success'
									});
								}else {
									this.$message({
										message: msg,
										type: 'error'
									});
								}
								this.$refs['editFormItems'].resetFields();
								this.editFormItemsVisible = false;
								this.getRepairdOrderItems();
							});
						});
					}
				});
			},
			/*==================================================结算订单===============================================*/
			//订单结算
			handleCount(){
				//加载支付方式
				this.getPayTypes();
				//判断是否选中的维修单
				if(this.mainId===0){
					this.$message({
						message: "请双击选择需要结算的维修单！",
						type: 'error'
					});
					return;
				}else if (!this.repairdOrderItems.toString()){
					this.$message({
						message: "抱歉，没有要结算的维修单！",
						type: 'error'
					});
					return;
				}else if(this.status){
					this.$message({
						message: "抱歉，该维修单已结算！",
						type: 'error'
					});
					return;
				}
				//计算所有维修单总金额
				let totalNumAmt=0;
				for (var i=0;i<this.repairdOrderItems.length;i++){
					totalNumAmt = (Number)(totalNumAmt+this.repairdOrderItems[i].totalAmt);
				}
				//应付金额
				this.addSettFormVisible = true;
				//清空表单
				this.addSettForm = {
					custormer:this.custormer,
					re_amount:totalNumAmt,
					pay_amout:totalNumAmt,
				};
			},
			//保存结算维修单
			settledOrderAddForm(){
				//提交之前的验证工作
				this.$refs.addSettForm.validate((valid) => {
					if (valid) {
						this.addLoading = true;
						this.$confirm('确认结算吗？', '提示', {}).then(() => {
							let para = Object.assign({}, this.addSettForm);
							para.address = this.address
							//为后台封装对象
							para.pay = {
								id:this.addSettForm.payId
							}
							para.main = {
								id:this.mainId,
								status:true
							}
							//发送保存请求
							this.$http.put("/settledOrder/save",para).then(res=>{
								this.addLoading = false;
								let {success,msg} = res.data;
								if (success){
									this.$message({
										message: '结算成功',
										type: 'success'
									});
								}else{
									this.$message({
										message: msg,
										type: 'error'
									});
								}
								//重置表单
								this.$refs['addSettForm'].resetFields();
								//关闭结算维修单对话框
								this.addSettFormVisible = false;
								this.getRepairdOrder();
								this.getRepairdOrderItems();
							});

						});
					}
				});
			},
			/*==================================================公用方法===============================================*/
			//重置表单
			resetForm(formName) {
				this.$refs[formName].resetFields();
			},

			//查询维修员
			getRepairPerson(){
				this.$http.patch("/repairPerson/page").then(res=>{
					this.repairPersons = res.data;
				});
			},

			//查询维修部件
			getParts(){
				this.$http.patch("/parts/page").then(res=>{
					this.partss = res.data;
				});
			},
		},
		mounted() {
			//渲染完界面就加载维修工单数据
			this.getRepairdOrder();
		}
	}
</script>

<style scoped>

</style>