|  |  | 
 |  |  | <template> | 
 |  |  |     <TableLayout :permissions="['business:visitpark:query']"> | 
 |  |  |         <!-- 搜索表单 --> | 
 |  |  |         <el-form ref="searchForm" slot="search-form" :model="searchForm" label-width="100px" inline> | 
 |  |  |             <el-form-item title="车牌号" prop="carCode"> | 
 |  |  |                 <el-input v-model="searchForm.carCode" placeholder="车牌号" @keypress.enter.native="search"></el-input> | 
 |  |  |             </el-form-item> | 
 |  |  |             <section> | 
 |  |  |                 <el-button type="primary" @click="search">搜索</el-button> | 
 |  |  |                 <el-button @click="reset">重置</el-button> | 
 |  |  |             </section> | 
 |  |  |         </el-form> | 
 |  |  |         <!-- 表格和分页 --> | 
 |  |  |         <template v-slot:table-wrap> | 
 |  |  |             <ul class="toolbar" v-permissions="['business:visitpark:create', 'business:visitpark:delete']"> | 
 |  |  |             </ul> | 
 |  |  |             <el-table | 
 |  |  |                 v-loading="isWorking.search" | 
 |  |  |                 :data="tableData.list" | 
 |  |  |                 stripe | 
 |  |  |                 @selection-change="handleSelectionChange" | 
 |  |  |             > | 
 |  |  |                 <el-table-column type="selection" width="55"></el-table-column> | 
 |  |  |                 <el-table-column prop="carCode" label="车牌号" fixed min-width="100px"></el-table-column> | 
 |  |  |                 <el-table-column prop="parksName" label="停车场" fixed min-width="100px"></el-table-column> | 
 |  |  |               <el-table-column prop="startTime" label="有效期"  align="center" fixed min-width="150px"> | 
 |  |  |                 <template slot-scope="{row}"> | 
 |  |  |                   <div v-if="!row.startTime || !row.endTime">长期有效</div> | 
 |  |  |                   <div v-else> | 
 |  |  |                     <span style="color: green">起:{{row.startTime}}</span><br/> | 
 |  |  |                     <span style="color: red">止:{{row.endTime}}</span> | 
 |  |  |                   </div> | 
 |  |  |                 </template> | 
 |  |  |               </el-table-column> | 
 |  |  |               <el-table-column prop="startTime" label="状态" fixed min-width="100px"> | 
 |  |  |                 <template slot-scope="{row}"> | 
 |  |  |                   <div v-if="row.isdeleted==1"  style="color: red">已删除</div> | 
 |  |  |                   <div v-else style="color: green"> | 
 |  |  |                     <span v-if="row.hkStatus==0"  style="color: #435EBE">待下发</span> | 
 |  |  |                     <span v-if="row.hkStatus==1"  style="color: green">预约成功</span> | 
 |  |  |                     <span v-if="row.hkStatus==2"  style="color: red">预约失败</span> | 
 |  |  |                     <span v-if="row.hkStatus==2"  style="color: red">已取消</span> | 
 |  |  |                   </div> | 
 |  |  |                 </template> | 
 |  |  |               </el-table-column> | 
 |  |  |               <el-table-column prop="remark" label="备注" min-width="100px"> | 
 |  |  |                 <template slot-scope="{row}"> | 
 |  |  |                   <span v-if="row.isdeleted !=2">{{row.remark}}</span> | 
 |  |  |                 </template> | 
 |  |  |               </el-table-column> | 
 |  |  |                 <el-table-column prop="createDate" label="创建时间" min-width="140px"></el-table-column> | 
 |  |  |             </el-table> | 
 |  |  |             <pagination | 
 |  |  |                 @size-change="handleSizeChange" | 
 |  |  |                 @current-change="handlePageChange" | 
 |  |  |                 :pagination="tableData.pagination" | 
 |  |  |             > | 
 |  |  |             </pagination> | 
 |  |  |         </template> | 
 |  |  |         <!-- 新建/修改 --> | 
 |  |  |         <OperaCarsWindow ref="operaCarsWindow" @success="handlePageChange"/> | 
 |  |  |     </TableLayout> | 
 |  |  |   <TableLayout :permissions="['business:visitpark:query']"> | 
 |  |  |     <!-- 搜索表单 --> | 
 |  |  |     <div ref="QueryFormRef" slot="search-form"> | 
 |  |  |       <el-form ref="searchForm" :model="searchForm" label-width="100px" inline> | 
 |  |  |         <el-form-item title="车牌号" prop="carCode"> | 
 |  |  |           <el-input v-model="searchForm.carCode" placeholder="车牌号" @keypress.enter.native="search"></el-input> | 
 |  |  |         </el-form-item> | 
 |  |  |         <section> | 
 |  |  |           <el-button type="primary" @click="search">搜索</el-button> | 
 |  |  |           <el-button @click="reset">重置</el-button> | 
 |  |  |         </section> | 
 |  |  |       </el-form> | 
 |  |  |     </div> | 
 |  |  |  | 
 |  |  |     <!-- 表格和分页 --> | 
 |  |  |     <template v-slot:table-wrap> | 
 |  |  |       <ul class="toolbar" v-permissions="['business:visitpark:create', 'business:visitpark:delete']"> | 
 |  |  |       </ul> | 
 |  |  |       <el-table :height="tableHeightNew" v-loading="isWorking.search" :data="tableData.list" stripe | 
 |  |  |         @selection-change="handleSelectionChange"> | 
 |  |  |         <el-table-column type="selection" width="55"></el-table-column> | 
 |  |  |         <el-table-column prop="carCode" label="车牌号" fixed min-width="100px"></el-table-column> | 
 |  |  |         <el-table-column prop="parksName" label="停车场" fixed min-width="100px"></el-table-column> | 
 |  |  |         <el-table-column prop="startTime" label="有效期" align="center" fixed min-width="150px"> | 
 |  |  |           <template slot-scope="{row}"> | 
 |  |  |             <div v-if="!row.startTime || !row.endTime">长期有效</div> | 
 |  |  |             <div v-else> | 
 |  |  |               <span style="color: green">起:{{ row.startTime }}</span><br /> | 
 |  |  |               <span style="color: red">止:{{ row.endTime }}</span> | 
 |  |  |             </div> | 
 |  |  |           </template> | 
 |  |  |         </el-table-column> | 
 |  |  |         <el-table-column prop="startTime" label="状态" fixed min-width="100px"> | 
 |  |  |           <template slot-scope="{row}"> | 
 |  |  |             <div v-if="row.isdeleted == 1" style="color: red">已删除</div> | 
 |  |  |             <div v-else style="color: green"> | 
 |  |  |               <span v-if="row.hkStatus == 0" style="color: #435EBE">待下发</span> | 
 |  |  |               <span v-if="row.hkStatus == 1" style="color: green">预约成功</span> | 
 |  |  |               <span v-if="row.hkStatus == 2" style="color: red">预约失败</span> | 
 |  |  |               <span v-if="row.hkStatus == 2" style="color: red">已取消</span> | 
 |  |  |             </div> | 
 |  |  |           </template> | 
 |  |  |         </el-table-column> | 
 |  |  |         <el-table-column prop="remark" label="备注" min-width="100px"> | 
 |  |  |           <template slot-scope="{row}"> | 
 |  |  |             <span v-if="row.isdeleted != 2">{{ row.remark }}</span> | 
 |  |  |           </template> | 
 |  |  |         </el-table-column> | 
 |  |  |         <el-table-column prop="createDate" label="创建时间" min-width="140px"></el-table-column> | 
 |  |  |       </el-table> | 
 |  |  |       <pagination @size-change="handleSizeChange" @current-change="handlePageChange" :pagination="tableData.pagination"> | 
 |  |  |       </pagination> | 
 |  |  |     </template> | 
 |  |  |     <!-- 新建/修改 --> | 
 |  |  |     <OperaCarsWindow ref="operaCarsWindow" @success="handlePageChange" /> | 
 |  |  |   </TableLayout> | 
 |  |  | </template> | 
 |  |  |  | 
 |  |  | <script> | 
 |  |  | 
 |  |  |   name: 'parkBook', | 
 |  |  |   extends: BaseTable, | 
 |  |  |   components: { TableLayout, Pagination, OperaCarsWindow }, | 
 |  |  |   data () { | 
 |  |  |   data() { | 
 |  |  |     return { | 
 |  |  |       // 搜索 | 
 |  |  |       searchForm: { | 
 |  |  | 
 |  |  |       } | 
 |  |  |     } | 
 |  |  |   }, | 
 |  |  |   created () { | 
 |  |  |   mounted() { | 
 |  |  |     // this.$nextTick(() => { | 
 |  |  |     //   this.tableHeight = document.body.scrollHeight - this.$refs.QueryFormRef.offsetHeight - 260 | 
 |  |  |     // }) | 
 |  |  |   }, | 
 |  |  |   created() { | 
 |  |  |     this.config({ | 
 |  |  |       module: '车辆信息表', | 
 |  |  |       api: '/business/visitPark', | 
 |  |  | 
 |  |  |     this.search() | 
 |  |  |   }, | 
 |  |  |   methods: { | 
 |  |  |     validity (startTime, endTime) { | 
 |  |  |     validity(startTime, endTime) { | 
 |  |  |       return validity(startTime, endTime) | 
 |  |  |     } | 
 |  |  |   } |