新增车辆明细界面

oa-ui/src/assets/icons/svg/ArrowLeft.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M17.59 18L19 16.59L14.42 12L19 7.41L17.59 6l-6 6z"/><path fill="currentColor" d="m11 18l1.41-1.41L7.83 12l4.58-4.59L11 6l-6 6z"/></svg>

oa-ui/src/assets/icons/svg/Branding.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M11 17h7q.425 0 .713-.288T19 16v-4q0-.425-.288-.712T18 11h-7q-.425 0-.712.288T10 12v4q0 .425.288.713T11 17m-7 3q-.825 0-1.412-.587T2 18V6q0-.825.588-1.412T4 4h16q.825 0 1.413.588T22 6v12q0 .825-.587 1.413T20 20z"/></svg>

oa-ui/src/assets/icons/svg/JamYelpSquare.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="-2 -2 24 24"><g fill="currentColor"><path d="m9.2 12.095l-1.382 1.682a.451.451 0 0 0 .183.707l1.351.531a.451.451 0 0 0 .616-.408l.059-2.203a.467.467 0 0 0-.828-.309zm-.23-1.672l-2.05-.736a.451.451 0 0 0-.603.41l-.046 1.451c-.01.313.294.54.591.443l2.095-.685a.467.467 0 0 0 .013-.883m2.348.236l2.099-.579a.451.451 0 0 0 .257-.683l-.797-1.213a.451.451 0 0 0-.74-.021L10.82 9.93a.467.467 0 0 0 .498.729m-1.52-5.043a.535.535 0 0 0-.676-.541l-1.661.453a.535.535 0 0 0-.296.826L9.07 9.656a.513.513 0 0 0 .053.077a.555.555 0 0 0 .943-.18a.547.547 0 0 0 .024-.217zm3.633 6.552l-2.107-.647a.467.467 0 0 0-.52.715l1.25 1.782c.177.25.546.257.73.012l.875-1.158a.451.451 0 0 0-.228-.704"/><path d="M4 2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2zm0-2h12a4 4 0 0 1 4 4v12a4 4 0 0 1-4 4H4a4 4 0 0 1-4-4V4a4 4 0 0 1 4-4"/></g></svg>

oa-ui/src/assets/icons/svg/PhAppStoreLogoFill.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 256 256"><path fill="currentColor" d="M128 24a104 104 0 1 0 104 104A104.11 104.11 0 0 0 128 24M83.66 180.12l-4.8 8a8 8 0 1 1-13.72-8.24l4.8-8a8 8 0 0 1 13.72 8.24M128 152H56a8 8 0 0 1 0-16h35.47l27.2-45.33l-13.53-22.55a8 8 0 0 1 13.72-8.24L128 75.12l9.14-15.24a8 8 0 0 1 13.72 8.24L110.13 136H128a8 8 0 0 1 0 16m72 0h-25.87l16.73 27.88a8 8 0 0 1-13.72 8.24l-38.4-64a8 8 0 0 1 13.72-8.24L164.53 136H200a8 8 0 0 1 0 16"/></svg>

oa-ui/src/assets/icons/svg/TeenyiconsYenSolid.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 15 15"><path fill="currentColor" fill-rule="evenodd" d="M6.528 7H3v1h4v3H3v1h4v3h1v-3h4v-1H8V8h4V7H8.472L12.907.79l-.814-.58L7.5 6.64L2.907.21l-.814.58z" clip-rule="evenodd"/></svg>

oa-ui/src/assets/icons/svg/cost.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M3.005 3.003h18a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1h-18a1 1 0 0 1-1-1v-16a1 1 0 0 1 1-1m10 10v-1h3v-2h-2.586L15.54 7.88l-1.414-1.414l-2.121 2.122l-2.121-2.122L8.469 7.88l2.122 2.122H8.005v2h3v1h-3v2h3v2h2v-2h3v-2z"/></svg>

oa-ui/src/assets/icons/svg/remark.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M5.95 19q-2.5-.125-3.725-1.05T1 15.275q0-1.625 1.338-2.638t3.712-1.212q.975-.075 1.463-.313T8 10.45q0-.65-.738-.975T4.825 9L5 7q2.575.2 3.788 1.038T10 10.45q0 1.325-.963 2.075t-2.837.9q-1.6.125-2.4.588T3 15.275q0 .875.7 1.263T6.05 17l-.1 2Zm7.925-.75L9.75 14.125L18.375 5.5q.5-.5 1.188-.5t1.187.5l1.75 1.75q.5.5.5 1.188t-.5 1.187l-8.625 8.625ZM8.975 20q-.425.1-.75-.225T8 19.025l.775-3.775l3.95 3.95l-3.75.8Z"/></svg>

oa-ui/src/router/index.js

@@ -1,3 +1,9 @@
+/*
+ * @Author: ysh
+ * @Date: 2024-01-03 09:23:11
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2024-03-13 10:38:15
+ */
 import Vue from 'vue'
 import Router from 'vue-router'
 
@@ -166,6 +172,20 @@ export const constantRoutes = [
       }
     ]
   },
+  {
+    path: '/car/expense',
+    component: Layout,
+    hidden: true,
+    children: [
+      {
+        path: '',
+        component: () => import('@/views/oa/car/expense'),
+        name: 'carExpense',
+        meta: { title: '车辆明细', icon: '' }
+
+      }
+    ]
+  },
 ]
 
 // 动态路由，基于用户权限动态去加载

oa-ui/src/views/index.vue

@@ -2,7 +2,7 @@
  * @Author: ysh
  * @Date: 2024-01-03 09:23:11
  * @LastEditors: Please set LastEditors
- * @LastEditTime: 2024-03-12 15:59:04
+ * @LastEditTime: 2024-03-12 17:28:04
 -->
 
 <template>
@@ -15,10 +15,18 @@
             <img :src="avatar" class="user-avatar" />
           </div>
           <div class="username">
-            {{ user.nickName }}
+            <div>{{ user.nickName }}</div>
+            <div style="font-size: 14px;color:#bbb;font-weight:lighter;">
+              <el-tag type="warning">{{ user.postLevel == null ? '未设置职位': user.postLevel}}</el-tag>
+            </div>
           </div>
           <div class="user-info">
-            
+            <table>
+              <tr>
+                <td>部门</td>
+                <td></td>
+              </tr>
+            </table>
           </div>
         </div>
       </el-col>
@@ -35,7 +43,7 @@
           </div>
         </div>
       </el-col>
-      
+
     </el-row>
     <el-row :gutter="20">
       <el-col :span="8">
@@ -49,13 +57,13 @@
       <el-col :span="8">
         <div class="header">公告</div>
         <div class="notice-content">
-          
+
         </div>
       </el-col>
       <el-col :span="8">
         <div class="header">项目流转</div>
         <div class="project-content">
-          
+
         </div>
       </el-col>
     </el-row>
@@ -272,7 +280,7 @@ export default {
 
   .avatar {
     text-align: center;
-    padding: 10px 0;
+    // padding: 10px 0;
 
     .user-avatar {
       width: 100px;
@@ -287,12 +295,11 @@ export default {
     font-weight: bold;
     font-family: '微软雅黑';
   }
-  .user-info{
-    display: grid;
-    
-  }
+
+  .user-info {}
 }
-.notice-content{
+
+.notice-content {
   width: 100%;
   height: 400px;
   background-color: #ffffff;
@@ -305,7 +312,8 @@ export default {
   background-color: #ffffff;
   border-radius: 15px;
 }
-.project-content{
+
+.project-content {
   width: 100%;
   height: 400px;
   background-color: #ffffff;
@@ -317,17 +325,21 @@ export default {
   text-align: center;
   line-height: 22px;
 }
-::v-deep .el-calendar__body{
+
+::v-deep .el-calendar__body {
   padding: 15px 31px 10px;
 }
-::v-deep .el-calendar__header{
+
+::v-deep .el-calendar__header {
   padding: 20px;
 }
-::v-deep .el-calendar-table td.is-today{
+
+::v-deep .el-calendar-table td.is-today {
   background-color: #1890ff;
   color: #ffffff;
 }
-::v-deep .el-calendar-table td.is-selected{
+
+::v-deep .el-calendar-table td.is-selected {
   color: #242d42;
 }
 </style>

oa-ui/src/views/oa/car/expense.vue

@@ -0,0 +1,368 @@
+<template>
+  <div class="app-container">
+    <div class="header">
+      <el-button icon="el-icon-d-arrow-left" plain type="primary" class="back" @click="goBack">返回</el-button>
+      <h1>{{ '【' + carInfo.licensePlate + '】' }}车辆明细</h1>
+    </div>
+    <el-divider></el-divider>
+    <el-descriptions class="descriptions" :column="column" border style="text-align: center;">
+      <el-descriptions-item>
+        <template slot="label">
+          <svg-icon slot="prefix" icon-class="car" class="el-input__icon input-icon" />
+          车牌号
+        </template>
+        {{ carInfo.licensePlate }}
+      </el-descriptions-item>
+      <el-descriptions-item>
+        <template slot="label">
+          <svg-icon slot="prefix" icon-class="Branding" class="el-input__icon input-icon" />
+          品牌
+        </template>
+        {{ carInfo.brand }}
+      </el-descriptions-item>
+      <el-descriptions-item>
+        <template slot="label">
+          <svg-icon slot="prefix" icon-class="PhAppStoreLogoFill" class="el-input__icon input-icon" />
+          系列
+        </template>
+        {{ carInfo.series }}
+      </el-descriptions-item>
+      <el-descriptions-item>
+        <template slot="label">
+          <svg-icon slot="prefix" icon-class="cost" class="el-input__icon input-icon" />
+          总价
+        </template>
+        {{ carInfo.cost }}
+      </el-descriptions-item>
+      <el-descriptions-item>
+        <template slot="label">
+          <svg-icon slot="prefix" icon-class="date" class="el-input__icon input-icon" />
+          上牌时间
+        </template>
+        {{ parseTime(carInfo.acquisitionTime, '{y}-{m}-{d}') }}
+      </el-descriptions-item>
+      <el-descriptions-item>
+        <template slot="label">
+          <i class="el-icon-user-solid"></i>
+          驾驶员
+        </template>
+        {{ carInfo.driver }}
+      </el-descriptions-item>
+      <el-descriptions-item>
+        <template slot="label">
+          <svg-icon slot="prefix" icon-class="date" class="el-input__icon input-icon" />
+          预计使用年限
+        </template>
+        {{ carInfo.expectLife }}
+      </el-descriptions-item>
+      <el-descriptions-item>
+        <template slot="label">
+          <svg-icon slot="prefix" icon-class="car" class="el-input__icon input-icon" />
+          预计行驶里程（万千米）
+        </template>
+        {{ carInfo.expectKm }}
+      </el-descriptions-item>
+      <el-descriptions-item>
+        <template slot="label">
+          <svg-icon slot="prefix" icon-class="JamYelpSquare" class="el-input__icon input-icon" />
+          是否为租车
+        </template>
+        {{ carInfo.isRent == '0' ? '否' : '是' }}
+      </el-descriptions-item>
+      <el-descriptions-item>
+        <template slot="label">
+          <svg-icon slot="prefix" icon-class="TeenyiconsYenSolid" class="el-input__icon input-icon" />
+          单日成本
+        </template>
+        {{ carInfo.dayCost }}
+      </el-descriptions-item>
+      <el-descriptions-item>
+        <template slot="label">
+          <svg-icon slot="prefix" icon-class="remark" class="el-input__icon input-icon" />
+          备注
+        </template>
+        {{ carInfo.remark }}
+      </el-descriptions-item>
+    </el-descriptions>
+    <!-- 费用明细 -->
+    <el-divider></el-divider>
+    
+    <el-card>
+      <el-row :gutter="10" class="mb8">
+        <el-col :span="1.5">
+          <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single"
+            @click="handleUpdate">修改</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple"
+            @click="handleDelete">删除</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport">导出</el-button>
+        </el-col>
+      </el-row>
+      <el-table v-loading="loading" :data="expenseList" @selection-change="handleSelectionChange">
+        <el-table-column type="selection" width="55" align="center" />
+        <el-table-column type="index" width="55" align="center" label="序号" />
+        <el-table-column label="费用类型" align="center" prop="expenseType">
+          <template slot-scope="scope">
+            <el-tag :type="typeStyle(scope.row.expenseType)">{{ expenseTypeText(scope.row.expenseType) }}</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column label="费用金额" align="center" prop="expense">
+          <template slot-scope="scope">
+            {{ scope.row.expense + '元' }}
+          </template>
+        </el-table-column>
+        <el-table-column label="发生日期" align="center" prop="occurDate" width="180">
+          <template slot-scope="scope">
+            {{ scope.row.occurDate }}
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+          <template slot-scope="scope">
+            <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
+              v-hasPermi="['oa:carExpense:edit']">修改</el-button>
+            <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
+              v-hasPermi="['oa:carExpense:remove']">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
+        @pagination="getList" />
+    </el-card>
+    <!-- 添加明细 -->
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+      <el-form ref="expenseForm" :model="form" :rules="rules" label-width="100px">
+        <el-form-item label="费用类型" prop="expenseType">
+          <el-select v-model="form.expenseType" placeholder="请选择" clearable>
+            <el-option label="保险费" value="0"></el-option>
+            <el-option label="维修/保养费" value="1"></el-option>
+            <el-option label="轮胎费" value="2"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="费用金额" prop="expense">
+          <el-input v-model="form.expense" placeholder="请输入费用金额" />
+        </el-form-item>
+        <el-form-item label="发生日期" prop="occurDate">
+          <el-date-picker clearable v-model="form.occurDate" type="date" value-format="yyyy-MM-dd"
+            placeholder="请选择发生日期">
+          </el-date-picker>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { getCar } from '@/api/oa/car/car.js'
+import { listCarExpense, getCarExpense, delCarExpense, addCarExpense, updateCarExpense } from "@/api/oa/car/carExpense";
+export default {
+  data() {
+    let validateExpense = (rule, value, callback) => {
+      setTimeout(() => {
+        if (!value) {
+          return callback(new Error('请输入金额'));
+        }
+        if (!this.isNumber(Number(value))) {
+          callback(new Error('请输入数字值'));
+        } else {
+          callback();
+        }
+      }, 100)
+    }
+    return {
+      column: 4,
+      carInfo: {},
+      expenseList: [],
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+      total: 0,
+      multiple: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      title: '',
+      open: false,
+      form: {},
+      rules: {
+        expenseType: [
+          { required: true, message: '请选择费用类型', trigger: 'change' }
+        ],
+        expense: [
+          { validator: validateExpense, required: true, trigger: 'blur' },
+        ],
+        occurDate: [
+          { required: true, message: '请选择发生日期', trigger: 'change' },
+        ],
+      },
+      loading: false
+    }
+  },
+  created() {
+    if (this.$route.query) {
+      getCar(this.$route.query.carId).then(res => {
+        console.log(res);
+        this.carInfo = res.data;
+      })
+      this.getList();
+    }
+    if (this.$store.state.app.device == 'desktop') {
+
+    } else {
+      this.column = 1
+    }
+  },
+  methods: {
+    getList() {
+      this.queryParams.carId = this.$route.query.carId
+      listCarExpense(this.queryParams).then(res => {
+        console.log(res);
+        this.expenseList = res.rows;
+        this.total = res.total;
+      })
+    },
+    goBack() {
+      this.$router.push({ path: '/car' });
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.carExpenseId)
+      this.single = selection.length !== 1
+      this.multiple = !selection.length
+    },
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加车辆明细";
+    },
+    handleUpdate(row) {
+      this.reset();
+      const carExpenseId = row.carExpenseId || this.ids
+      getCarExpense(carExpenseId).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改车辆明细";
+      });
+    },
+    handleDelete(row) {
+      debugger
+      const carExpenseIds = row.carExpenseId || this.ids;
+      this.$modal.confirm('是否确认删除车辆费用编号为"' + carExpenseIds + '"的数据项？').then(function () {
+        return delCarExpense(carExpenseIds);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => { });
+    },
+    handleExport() {
+      this.download('oa/carExpense/export', {
+        ...this.queryParams
+      }, `carExpense_${new Date().getTime()}.xlsx`)
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        carExpenseId: null,
+        carId: null,
+        expenseType: null,
+        expense: null,
+        occurDate: null
+      };
+      this.resetForm("expenseForm");
+    },
+    submitForm() {
+      this.$refs["expenseForm"].validate(valid => {
+        if (valid) {
+          this.form.carId = this.$route.query.carId
+          if (this.form.carExpenseId != null) {
+            updateCarExpense(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addCarExpense(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    isNumber(value) {
+      return typeof value === 'number' && /^\d+(\.\d+)?$/.test(value);
+    },
+    expenseTypeText(row) {
+      if (row == '0') {
+        return '保险费'
+      }
+      if (row == '1') {
+        return '维修/保养费'
+      }
+      if (row == '2') {
+        return '轮胎费'
+      }
+    },
+    typeStyle(row) {
+      if (row == '0') {
+        return 'primary'
+      }
+      if (row == '1') {
+        return 'warning'
+      }
+      if (row == '2') {
+        return 'success'
+      }
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.header {
+  position: relative;
+  text-align: center;
+
+  .back {
+    position: absolute;
+    left: 12px;
+    top: -10px;
+  }
+}
+
+.descriptions {
+  padding: 20px 50px;
+}
+
+
+::v-deep .el-descriptions-item__label.is-bordered-label {
+  color: #121212;
+  background: rgba($color: #46a6ff, $alpha: 0.1);
+  width: 200px;
+}
+
+::v-deep .el-descriptions .is-bordered .el-descriptions-item__cell {
+  border: 1px solid #2d3f62;
+}
+</style>

oa-ui/src/views/oa/car/index.vue

@@ -41,7 +41,7 @@
       <el-table-column label="品牌" align="center" prop="brand" />
       <el-table-column label="车型" align="center" prop="series" />
       <el-table-column label="购置时间" align="center" prop="acquisitionTime" />
-      <el-table-column label="是否为租车" align="center" prop="isRent" >
+      <el-table-column label="是否为租车" align="center" prop="isRent">
         <template slot-scope="scope">
           {{ scope.row.isRent == "0" ? "否" : "是" }}
         </template>
@@ -51,20 +51,22 @@
           {{ scope.row.cost + '万元' }}
         </template>
       </el-table-column>
-      <el-table-column label="预计使用年限" align="center" prop="expectLife" >        
+      <el-table-column label="预计使用年限" align="center" prop="expectLife">
         <template slot-scope="scope">
           {{ scope.row.expectLife + '年' }}
         </template>
       </el-table-column>
-      <el-table-column label="预计行驶里程" align="center" prop="expectKm" >        
+      <el-table-column label="预计行驶里程" align="center" prop="expectKm">
         <template slot-scope="scope">
           {{ scope.row.expectKm + '万千米' }}
         </template>
       </el-table-column>
       <el-table-column label="单日成本" align="center" prop="dayCost" />
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+      <el-table-column label="操作" align="center" width="200px">
 
         <template slot-scope="scope">
+          <el-button size="mini" type="text" icon="el-icon-plus" @click="handleAddDetail(scope.row)"
+            v-hasPermi="['oa:car:edit']">添加明细</el-button>
           <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
             v-hasPermi="['oa:car:edit']">修改</el-button>
           <el-button size="mini" type="text" icon="el-icon-delete" style="color: #fc0000;"
@@ -168,7 +170,8 @@ export default {
       // 表单校验
       rules: {
       },
-      driverList: []
+      driverList: [],
+      detailOpen: false
     };
   },
   created() {
@@ -240,6 +243,16 @@ export default {
         this.title = "修改车辆信息";
       });
     },
+    // 新增明细按钮
+    handleAddDetail(row) {
+      console.log(row);
+      this.$router.push({
+        path: '/car/expense',
+        query: {
+          carId: row.carId,
+        }
+      })
+    },
     /** 提交按钮 */
     submitForm() {
       this.$refs["form"].validate(valid => {

oa-ui/src/views/oa/carExpense/index.vue

@@ -1,285 +0,0 @@
-<template>
-  <div class="app-container">
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="车辆id" prop="carId">
-        <el-input
-          v-model="queryParams.carId"
-          placeholder="请输入车辆id"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="费用金额" prop="expense">
-        <el-input
-          v-model="queryParams.expense"
-          placeholder="请输入费用金额"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="发生日期" prop="occurrDate">
-        <el-date-picker clearable
-          v-model="queryParams.occurrDate"
-          type="date"
-          value-format="yyyy-MM-dd"
-          placeholder="请选择发生日期">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
-      </el-form-item>
-    </el-form>
-
-    <el-row :gutter="10" class="mb8">
-      <el-col :span="1.5">
-        <el-button
-          type="primary"
-          plain
-          icon="el-icon-plus"
-          size="mini"
-          @click="handleAdd"
-          v-hasPermi="['oa:carExpense:add']"
-        >新增</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="el-icon-edit"
-          size="mini"
-          :disabled="single"
-          @click="handleUpdate"
-          v-hasPermi="['oa:carExpense:edit']"
-        >修改</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="el-icon-delete"
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['oa:carExpense:remove']"
-        >删除</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="warning"
-          plain
-          icon="el-icon-download"
-          size="mini"
-          @click="handleExport"
-          v-hasPermi="['oa:carExpense:export']"
-        >导出</el-button>
-      </el-col>
-      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-    </el-row>
-
-    <el-table v-loading="loading" :data="carExpenseList" @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="车辆费用id" align="center" prop="carExpenseId" />
-      <el-table-column label="车辆id" align="center" prop="carId" />
-      <el-table-column label="费用类型" align="center" prop="expenseType" />
-      <el-table-column label="费用金额" align="center" prop="expense" />
-      <el-table-column label="发生日期" align="center" prop="occurrDate" width="180">
-        <template slot-scope="scope">
-          <span>{{ parseTime(scope.row.occurrDate, '{y}-{m}-{d}') }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-        <template slot-scope="scope">
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-edit"
-            @click="handleUpdate(scope.row)"
-            v-hasPermi="['oa:carExpense:edit']"
-          >修改</el-button>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-delete"
-            @click="handleDelete(scope.row)"
-            v-hasPermi="['oa:carExpense:remove']"
-          >删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-    
-    <pagination
-      v-show="total>0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
-      :limit.sync="queryParams.pageSize"
-      @pagination="getList"
-    />
-
-    <!-- 添加或修改cmc车辆费用对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-        <el-form-item label="车辆id" prop="carId">
-          <el-input v-model="form.carId" placeholder="请输入车辆id" />
-        </el-form-item>
-        <el-form-item label="费用金额" prop="expense">
-          <el-input v-model="form.expense" placeholder="请输入费用金额" />
-        </el-form-item>
-        <el-form-item label="发生日期" prop="occurrDate">
-          <el-date-picker clearable
-            v-model="form.occurrDate"
-            type="date"
-            value-format="yyyy-MM-dd"
-            placeholder="请选择发生日期">
-          </el-date-picker>
-        </el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm">确 定</el-button>
-        <el-button @click="cancel">取 消</el-button>
-      </div>
-    </el-dialog>
-  </div>
-</template>
-
-<script>
-import { listCarExpense, getCarExpense, delCarExpense, addCarExpense, updateCarExpense } from "@/api/oa/car/carExpense";
-
-export default {
-  name: "CarExpense",
-  data() {
-    return {
-      // 遮罩层
-      loading: true,
-      // 选中数组
-      ids: [],
-      // 非单个禁用
-      single: true,
-      // 非多个禁用
-      multiple: true,
-      // 显示搜索条件
-      showSearch: true,
-      // 总条数
-      total: 0,
-      // cmc车辆费用表格数据
-      carExpenseList: [],
-      // 弹出层标题
-      title: "",
-      // 是否显示弹出层
-      open: false,
-      // 查询参数
-      queryParams: {
-        pageNum: 1,
-        pageSize: 10,
-        carId: null,
-        expenseType: null,
-        expense: null,
-        occurrDate: null
-      },
-      // 表单参数
-      form: {},
-      // 表单校验
-      rules: {
-      }
-    };
-  },
-  created() {
-    this.getList();
-  },
-  methods: {
-    /** 查询cmc车辆费用列表 */
-    getList() {
-      this.loading = true;
-      listCarExpense(this.queryParams).then(response => {
-        this.carExpenseList = response.rows;
-        this.total = response.total;
-        this.loading = false;
-      });
-    },
-    // 取消按钮
-    cancel() {
-      this.open = false;
-      this.reset();
-    },
-    // 表单重置
-    reset() {
-      this.form = {
-        carExpenseId: null,
-        carId: null,
-        expenseType: null,
-        expense: null,
-        occurrDate: null
-      };
-      this.resetForm("form");
-    },
-    /** 搜索按钮操作 */
-    handleQuery() {
-      this.queryParams.pageNum = 1;
-      this.getList();
-    },
-    /** 重置按钮操作 */
-    resetQuery() {
-      this.resetForm("queryForm");
-      this.handleQuery();
-    },
-    // 多选框选中数据
-    handleSelectionChange(selection) {
-      this.ids = selection.map(item => item.carExpenseId)
-      this.single = selection.length!==1
-      this.multiple = !selection.length
-    },
-    /** 新增按钮操作 */
-    handleAdd() {
-      this.reset();
-      this.open = true;
-      this.title = "添加cmc车辆费用";
-    },
-    /** 修改按钮操作 */
-    handleUpdate(row) {
-      this.reset();
-      const carExpenseId = row.carExpenseId || this.ids
-      getCarExpense(carExpenseId).then(response => {
-        this.form = response.data;
-        this.open = true;
-        this.title = "修改cmc车辆费用";
-      });
-    },
-    /** 提交按钮 */
-    submitForm() {
-      this.$refs["form"].validate(valid => {
-        if (valid) {
-          if (this.form.carExpenseId != null) {
-            updateCarExpense(this.form).then(response => {
-              this.$modal.msgSuccess("修改成功");
-              this.open = false;
-              this.getList();
-            });
-          } else {
-            addCarExpense(this.form).then(response => {
-              this.$modal.msgSuccess("新增成功");
-              this.open = false;
-              this.getList();
-            });
-          }
-        }
-      });
-    },
-    /** 删除按钮操作 */
-    handleDelete(row) {
-      const carExpenseIds = row.carExpenseId || this.ids;
-      this.$modal.confirm('是否确认删除cmc车辆费用编号为"' + carExpenseIds + '"的数据项？').then(function() {
-        return delCarExpense(carExpenseIds);
-      }).then(() => {
-        this.getList();
-        this.$modal.msgSuccess("删除成功");
-      }).catch(() => {});
-    },
-    /** 导出按钮操作 */
-    handleExport() {
-      this.download('oa/carExpense/export', {
-        ...this.queryParams
-      }, `carExpense_${new Date().getTime()}.xlsx`)
-    }
-  }
-};
-</script>