车辆出车记录

src/views/vehicle/vehicleDepartureLog/index.vue

 <template>
   <div class="app-container calendar-list-container">
-<!--    <div class="filter-container">-->
-<!--      <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item" placeholder="车牌号"-->
-<!--                v-model="listQuery.name"></el-input>-->
-<!--      <el-button class="filter-item" type="primary" v-waves icon="search" @click="handleFilter">搜索</el-button>-->
-<!--    </div>-->
+    <div class="filter-container">
+      <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item" placeholder="车牌号"
+                v-model="listQuery.numberPlate"></el-input>
+      <el-button class="filter-item" type="primary" v-waves icon="search" @click="handleFilter">搜索</el-button>
+    </div>
     <el-table :key='tableKey' :data="list" v-loading.body="listLoading" border fit highlight-current-row
               style="width: 100%">
-      <el-table-column align="center" label="车牌号" width="65">
+      <el-table-column align="center" label="车牌号" width="120">
         <template scope="scope">
           <span>{{scope.row.numberPlate}}</span>
         </template>
       </el-table-column>
-      <el-table-column width="80" align="center" label="用途">
+      <el-table-column width="100" align="center" label="用途">
         <template scope="scope">
           <span>{{scope.row.use}}</span>
         </template>
       </el-table-column>
-      <el-table-column width="80" align="center" label="使用人">
+      <el-table-column width="100" align="center" label="使用人">
         <template scope="scope">
           <span>{{scope.row.user}}</span>
         </template>
       </el-table-column>
-      <el-table-column width="80" align="center" label="使用人电话">
+      <el-table-column width="200" align="center" label="使用人电话">
         <template scope="scope">
           <span>{{scope.row.userTel}}</span>
         </template>
       </el-table-column>
-      <el-table-column width="80" align="center" label="验车人">
+      <el-table-column width="100" align="center" label="验车人">
         <template scope="scope">
           <span>{{scope.row.checkMan}}</span>
         </template>
       </el-table-column>
-      <el-table-column width="80" align="center" label="验车人电话">
+      <el-table-column width="200" align="center" label="验车人电话">
         <template scope="scope">
           <span>{{scope.row.checkManTel}}</span>
         </template>
       </el-table-column>
-      <el-table-column width="80" align="center" label="出车时间">
+      <el-table-column width="250" align="center" label="出车时间">
         <template scope="scope">
           <span>{{scope.row.departureTime}}</span>
         </template>
       </el-table-column>
-      <el-table-column width="80" align="center" label="还车时间">
+      <el-table-column width="250" align="center" label="还车时间">
         <template scope="scope">
           <span>{{scope.row.arrivalTime}}</span>
         </template>
       </el-table-column>
-      <el-table-column width="80" align="center" label="开始公里数">
+      <el-table-column width="100" align="center" label="开始公里数">
         <template scope="scope">
           <span>{{scope.row.mileageStart}}</span>
         </template>
       </el-table-column>
-      <el-table-column width="80" align="center" label="结束公里数">
+      <el-table-column width="100" align="center" label="结束公里数">
         <template scope="scope">
           <span>{{scope.row.mileageEnd}}</span>
         </template>
@@ -65,125 +65,23 @@
                      layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
     </div>
 
-    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">
-      <el-form :model="form" :rules="rules" ref="form" label-width="100px">
-        <el-form-item label="姓名" prop="name">
-          <el-input v-model="form.name" placeholder="请输入姓名"></el-input>
-        </el-form-item>
-        <el-form-item label="性别">
-          <el-select class="filter-item" v-model="form.sex" placeholder="请选择">
-            <el-option v-for="item in sexOptions" :key="item.key" :label="item.label" :value="item.value"></el-option>
-          </el-select>
-        </el-form-item>
-
-        <el-form-item label="卡号" prop="cardNumber">
-          <el-input v-model="form.cardNumber" placeholder="请输入卡号"></el-input>
-        </el-form-item>
-
-        <el-form-item label="生日" prop="birthday">
-          <el-date-picker v-model="form.birthday" type="date" @change="changeBirthday" placeholder="请输入生日" value-format="yyyy-MM-dd"></el-date-picker>
-        </el-form-item>
-
-        <el-form-item label="身份证号码" prop="idNumber">
-          <el-input v-model="form.idNumber" placeholder="请输入身份证号码"></el-input>
-        </el-form-item>
-
-        <el-form-item label="证件地址" prop="certificateAddress">
-          <el-input v-model="form.certificateAddress" placeholder="请输入证件地址"></el-input>
-        </el-form-item>
-
-        <el-form-item label="电子邮箱" prop="email">
-          <el-input v-model="form.email" placeholder="请输入电子邮箱"></el-input>
-        </el-form-item>
-
-        <el-form-item label="微信" prop="wx">
-          <el-input v-model="form.wx" placeholder="请输入微信号"></el-input>
-        </el-form-item>
-
-        <el-form-item label="会员类型" prop="memberType">
-          <el-select class="filter-item" v-model="form.memberType" placeholder="请选择">
-            <el-option v-for="item in memberTypeOptions" :key="item.key" :label="item.label" :value="item.value"></el-option>
-          </el-select>
-        </el-form-item>
-
-        <el-form-item label="联系电话" prop="telephone">
-          <el-input v-model="form.telephone" placeholder="请输入联系电话"></el-input>
-        </el-form-item>
-
-        <el-form-item label="手机" prop="mobilePhone">
-          <el-input v-model="form.mobilePhone" placeholder="请输入手机号码"></el-input>
-        </el-form-item>
-
-        <el-form-item label="常住地址" prop="address">
-          <el-input v-model="form.address" placeholder="请输入常住地址"></el-input>
-        </el-form-item>
-
-        <el-form-item label="工作单位" prop="workplace">
-          <el-input v-model="form.workplace" placeholder="请输入工作单位"></el-input>
-        </el-form-item>
-
-        <el-form-item label="职务" prop="job">
-          <el-input v-model="form.job" placeholder="请输入职务"></el-input>
-        </el-form-item>
-
-        <el-form-item label="邀约人" prop="inviter">
-          <el-input v-model="form.inviter" placeholder="请输入邀约人"></el-input>
-        </el-form-item>
-
-        <el-form-item label="职业" prop="profession">
-          <el-input v-model="form.profession" placeholder="请输入职业"></el-input>
-        </el-form-item>
-
-        <el-form-item label="支付方式" prop="payType">
-          <el-select class="filter-item" v-model="form.payType" placeholder="请选择">
-            <el-option v-for="item in payTypeOptions" :key="item.key" :label="item.label" :value="item.value"></el-option>
-          </el-select>
-        </el-form-item>
-
-        <el-form-item label="会员签名日期" prop="memberSignatureDate">
-          <el-date-picker v-model="form.memberSignatureDate" type="date" @change="changeMemberSignatureDate" value-format="yyyy-MM-dd"
-                          placeholder="请输入会员签名日期"></el-date-picker>
-        </el-form-item>
-
-        <el-form-item label="经理" prop="manager">
-          <el-input v-model="form.manager" placeholder="请输入经理姓名"></el-input>
-        </el-form-item>
-
-        <el-form-item label="经理签名日期" prop="managerSignatureDate">
-          <el-date-picker v-model="form.managerSignatureDate" type="date" @change="changeManagerSignatureDate" value-format="yyyy-MM-dd"
-                          placeholder="请输入经理签名日期"></el-date-picker>
-        </el-form-item>
-
-        <el-form-item label="家庭成员" prop="family">
-          <el-row v-for="(item, index) in form.family">
-            <el-col :span="9">
-              <el-input v-model="item.name" placeholder="成员名称"></el-input>
-            </el-col>
-            <el-col class="line" :span="2" align="center">-</el-col>
-            <el-col :span="9">
-              <el-input v-model="item.relationship" placeholder="成员关系"></el-input>
-            </el-col>
-            <el-col :span="4" align="center">
-              <el-button @click="handleDeleteFamily(index)" type="warning" size="mini" icon="el-tag__close el-icon-close"></el-button>
-            </el-col>
-          </el-row>
-          <el-row>
-            <el-button @click="handleAddFamily()">添加</el-button>
-          </el-row>
-        </el-form-item>
-
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button @click="cancel('form')">取 消</el-button>
-        <el-button v-if="dialogStatus=='create'" type="primary" @click="create('form')">确 定</el-button>
-        <el-button v-else type="primary" @click="update('form')">确 定</el-button>
-      </div>
-    </el-dialog>
+<!--    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">-->
+<!--      <el-form :model="form" :rules="rules" ref="form" label-width="100px">-->
+<!--        <el-form-item label="姓名" prop="name">-->
+<!--          <el-input v-model="form.name" placeholder="请输入姓名"></el-input>-->
+<!--        </el-form-item>-->
+<!--      </el-form>-->
+<!--      <div slot="footer" class="dialog-footer">-->
+<!--        <el-button @click="cancel('form')">取 消</el-button>-->
+<!--        <el-button v-if="dialogStatus=='create'" type="primary" @click="create('form')">确 定</el-button>-->
+<!--        <el-button v-else type="primary" @click="update('form')">确 定</el-button>-->
+<!--      </div>-->
+<!--    </el-dialog>-->
   </div>
 </template>
 
 <script>
-  import { mapGetters } from 'vuex';
+  import {mapGetters} from 'vuex';
   import {
     page
   } from 'api/vehicle/departureLog';
@@ -209,23 +107,37 @@
           mileageEnd: null,
           state: null
         },
+        rules: {
+          name: [
+            {
+              required: true,
+              message: '请输入用户',
+              trigger: 'blur'
+            }
+          ]
+        },
         list: null,
         total: null,
         listLoading: true,
         listQuery: {
           page: 1,
           limit: 20,
-          name: undefined
+          numberPlate: undefined
         },
         dialogStatus: '',
         textMap: {
           update: '编辑',
           create: '创建'
         },
-        tableKey: 0
+        tableKey: 0,
+        dialogFormVisible: null
       }
     },
     created() {
+      const numberPlate = this.$route.query.numberPlate;
+      if (numberPlate) {
+        this.listQuery.numberPlate = numberPlate;
+      }
       this.getList();
     },
     computed: {
@@ -241,7 +153,7 @@
         this.listLoading = true;
         page(this.listQuery)
           .then(response => {
-            this.list = response.data.rows;
+            this.list = response.data.list;
             this.total = response.data.total;
             this.listLoading = false;
           })

src/views/vehicle/vehicleInfo/index.vue

@@ -275,6 +275,7 @@
                      @click="handleApply(scope.row)">申请预订
           </el-button>
           <el-button size="small" type="success" @click="handleBookInfo(scope.row)">预订信息</el-button>
+          <el-button size="small" type="success" @click="handleDepartureLog(scope.row)">出车记录</el-button>
         </template>
       </el-table-column>
 
@@ -1050,6 +1051,14 @@
       }
     },
     methods: {
+      handleDepartureLog(row) {
+        this.$router.push({
+          path: '/vehicle/vehicleDepartureLog',
+          query: {
+            numberPlate: row.numberPlate
+          }
+        });
+      },
       arrivalHandler(row) {
         // open dialog
         this.arrivalDialogVisible = true;