| <template> | 
|   <TableLayout :permissions="['business:inoutrecord:query']"> | 
|     <!-- 搜索表单 --> | 
|     <div slot="search-form"> | 
|       <el-form ref="searchForm" :model="searchForm" label-width="100px" inline> | 
|         <el-form-item label="" prop="inOrOut"> | 
|           <el-select v-model="searchForm.inOrOut"  style="width: 130px" clearable @change="search" placeholder="进出类型"> | 
|             <el-option label="进" value="0"></el-option> | 
|             <el-option label="出" value="1"></el-option> | 
|           </el-select> | 
|         </el-form-item> | 
|         <el-form-item label="" prop="memberType"> | 
|           <el-select v-model="searchForm.memberType" style="width: 130px" clearable @change="search" placeholder="人员类型"> | 
|             <el-option label="访客" value="1"></el-option> | 
|             <el-option label="内部人员" value="2"></el-option> | 
|             <el-option label="相关方人员" value="4"></el-option> | 
|             <el-option label="货运司机" value="5"></el-option> | 
|           </el-select> | 
|         </el-form-item> | 
|         <el-form-item label="" prop="memberName"> | 
|           <el-input v-model="searchForm.memberName" placeholder="人员名称/手机号" clearable @keypress.enter.native="search"></el-input> | 
|         </el-form-item> | 
|         <el-form-item label="" prop="companyName"> | 
|           <el-input v-model="searchForm.companyName" placeholder="组织名称" clearable @keypress.enter.native="search"></el-input> | 
|         </el-form-item> | 
|         <el-form-item label="" prop="carCode"> | 
|           <el-input v-model="searchForm.carCode" placeholder="车牌号"  clearable @keypress.enter.native="search"></el-input> | 
|         </el-form-item> | 
|         <el-form-item label="" prop="categoryName"> | 
|           <el-input v-model="searchForm.categoryName" placeholder="车辆分类名称" clearable @keypress.enter.native="search"></el-input> | 
|         </el-form-item> | 
| <!--        <el-form-item label="" prop="carBizType"> | 
|           <el-select v-model="searchForm.carBizType" clearable style="width: 180px"   placeholder="车辆业务类型"> | 
|             <el-option v-for="op in bizTypeList" :key="op.key" :label="op.name" :value="op.key"  ></el-option> | 
|           </el-select> | 
|         </el-form-item>--> | 
|         <el-form-item label="" prop="deviceName"> | 
|           <el-input v-model="searchForm.deviceName" placeholder="出入口名称" clearable @keypress.enter.native="search"></el-input> | 
|         </el-form-item> | 
|         <el-form-item label="起止时间" prop="startDate"> | 
|           <el-date-picker type="datetime" v-model="searchForm.startDate" value-format="yyyy-MM-dd HH:mm:ss" | 
|                           placeholder="请选择开始时间" @change="changeRadio" /> | 
|           <el-date-picker type="datetime" v-model="searchForm.endDate" value-format="yyyy-MM-dd HH:mm:ss" | 
|                           placeholder="请选择结束时间" @change="changeRadio" /> | 
|         </el-form-item> | 
|         <el-radio-group v-model="searchForm.radio" size="small" @input="changeRadio"> | 
|           <el-radio-button label="0">当天</el-radio-button> | 
|           <el-radio-button label="1">近7天</el-radio-button> | 
|           <el-radio-button label="2">近30天</el-radio-button> | 
|         </el-radio-group> | 
|         <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:inoutrecord:exportExcel' ]"> | 
|         <li> | 
|           <el-button type="primary" :loading="isWorking.export" v-permissions="['business:inoutrecord:exportExcel']" | 
|                      @click="exportExcel">导出</el-button> | 
|         </li> | 
|       </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="memberName" label="人员名称" min-width="100px"></el-table-column> | 
|         <el-table-column prop="memberPhone" label="人员手机号" min-width="100px"></el-table-column> | 
|         <el-table-column prop="companyName" label="组织名称" min-width="100px"></el-table-column> | 
|         <el-table-column prop="memberType" label="用户类型" min-width="100px"> | 
|           <template slot-scope="{row}"> | 
|             <span  v-if="row.memberType ==1">访客</span> | 
|             <span  v-else-if="row.memberType ==2">内部人员</span> | 
|             <span  v-else-if="row.memberType ==4">相关方人员</span> | 
|             <span  v-else-if="row.memberType ==5">货运司机</span> | 
|             <span  v-else ></span> | 
|           </template> | 
|         </el-table-column> | 
|         <el-table-column prop="carCode" label="车牌号" min-width="100px"></el-table-column> | 
| <!--        <el-table-column prop="carBizType" label="车辆业务类型" min-width="100px"> | 
|           <template slot-scope="{row}"> | 
|             <template v-if="row.carCode"> | 
|               <span  v-if="row.carBizType ==0">访客车辆</span> | 
|               <span  v-else-if="row.carBizType ==1">外协运输车辆</span> | 
|               <span  v-else-if="row.carBizType ==2">市公司卸货车辆</span> | 
|               <span  v-else-if="row.carBizType ==3">加工烟卸货车辆</span> | 
|               <span  v-else-if="row.carBizType ==4">安泰物流公务用车</span> | 
|               <span  v-else-if="row.carBizType ==5">安泰物流货运车辆</span> | 
|               <span  v-else >未知车辆</span> | 
|             </template> | 
|           </template> | 
|         </el-table-column>--> | 
|         <el-table-column prop="categoryName" label="车辆分类" min-width="100px"> | 
|           <template slot-scope="{row}"> | 
| <!-- | 
|             <span  v-if="row.categoryParentName!= row.categoryName">  {{(row.categoryParentName || '') +row.categoryName}}</span> | 
| --> | 
|             <span  v-if="row.carCode"  >{{ row.categoryName }}</span> | 
|           </template> | 
|         </el-table-column> | 
|         <el-table-column prop="inOrOut" label="进出类型" min-width="100px"> | 
|           <template slot-scope="{row}"> | 
|             <span  v-if="row.inOrOut ==1">出</span> | 
|             <span  v-else >进</span> | 
|           </template> | 
|         </el-table-column> | 
|         <el-table-column prop="deviceName" label="进出口名称" min-width="100px"></el-table-column> | 
|         <el-table-column prop="createDate" label="创建时间" min-width="100px"></el-table-column> | 
|         <el-table-column prop="remark" label="备注" min-width="100px"></el-table-column> | 
|       </el-table> | 
|       <pagination | 
|         @size-change="handleSizeChange" | 
|         @current-change="handlePageChange" | 
|         :pagination="tableData.pagination" | 
|       > | 
|       </pagination> | 
|     </template> | 
|     <!-- 新建/修改 --> | 
|     <OperaInoutRecordWindow ref="operaInoutRecordWindow" @success="handlePageChange"/> | 
|   </TableLayout> | 
| </template> | 
|   | 
| <script> | 
| import BaseTable from '@/components/base/BaseTable' | 
| import TableLayout from '@/layouts/TableLayout' | 
| import SearchFormCollapse from '@/components/common/SearchFormCollapse' | 
| import Pagination from '@/components/common/Pagination' | 
| import OperaInoutRecordWindow from '@/components/business/OperaInoutRecordWindow' | 
| import { timeForMat } from '@/utils/util' | 
| export default { | 
|   name: 'InoutRecord', | 
|   extends: BaseTable, | 
|   components: { SearchFormCollapse, TableLayout, Pagination, OperaInoutRecordWindow }, | 
|   data () { | 
|     return { | 
|       // 搜索 | 
|       searchForm: { | 
|         categoryName: '', | 
|         carBizType: '', | 
|         memberType: '', | 
|         memberName: '', | 
|         carCode: '', | 
|         inOrOut: '', | 
|         companyName: '', | 
|         startDate: null, | 
|         endDate: null, | 
|         radio: '0' | 
|       }, | 
|       time: [], | 
|       bizTypeList: [{ key: 0, name: '访客车辆' }, | 
|         { key: 1, name: '外协运输车辆' }, | 
|         { key: 2, name: '市公司卸货车辆' }, | 
|         { key: 3, name: '加工烟卸货车辆' }, | 
|         { key: 4, name: '安泰物流公务用车' }, | 
|         { key: 5, name: '安泰物流货运车辆' }, | 
|         { key: 6, name: '未知车辆' } | 
|       ] | 
|     } | 
|   }, | 
|   created () { | 
|     this.config({ | 
|       module: '出入场人次车次每日统计表', | 
|       api: '/business/inoutRecord', | 
|       'field.id': 'id', | 
|       'field.main': 'id' | 
|     }) | 
|     this.search() | 
|     this.changeRadio('0') | 
|   }, | 
|   methods: { | 
|     changeRadio (e) { | 
|       if (e === '0') { | 
|         this.searchForm.startDate = timeForMat(0)[0] | 
|         this.searchForm.endDate = timeForMat(0)[1] | 
|       } else if (e === '1') { | 
|         this.searchForm.startDate = timeForMat(6)[0] | 
|         this.searchForm.endDate = timeForMat(6)[1] | 
|       } else if (e === '2') { | 
|         this.searchForm.startDate = timeForMat(29)[0] | 
|         this.searchForm.endDate = timeForMat(29)[1] | 
|       } else { | 
|         this.searchForm.radio = '' | 
|       } | 
|       if (this.searchForm.startDate && this.searchForm.endDate && new Date(this.searchForm.startDate).getTime() > new Date(this.searchForm.endDate).getTime()) { | 
|         this.$message.error('开始时间不能大于结束时间') | 
|         this.searchForm.startDate = '' | 
|         return | 
|       } | 
|       this.search() | 
|     }, | 
|     seleTime (e) { | 
|       this.searchForm.startDate = e[0] | 
|       this.searchForm.endDate = e[1] | 
|       this.searchForm.radio = null | 
|       this.search() | 
|     }, | 
|     reset () { | 
|       this.$refs.searchForm.resetFields() | 
|       this.searchForm.startDate = '' | 
|       this.searchForm.endDate = '' | 
|       this.searchForm.radio = '' | 
|       this.time = [] | 
|       this.search() | 
|     } | 
|   } | 
| } | 
| </script> |