SmartCommunity/smart/src/views/accessRecord/index.vue

<!-- 出入记录 -->
<template>
  <div class="main">
    <div class="search">
      <el-input
        placeholder="输入车牌号"
        class="search-input"
        clearable
        v-model="mixins_query.plateNo "
      ></el-input>
      <el-select
        placeholder="停车场名称"
        clearable
        v-model="mixins_query.parkId"
      >
        <el-option
          v-for="(item,index) in nameParkingLot"
          :key="index"
          :value="item.label"
          :label="item.name"
          @click.native="parkingLot(item.name)"
        ></el-option>
      </el-select>
      <el-date-picker
        value-format="yyyy-MM-dd"
        type="daterange"
        range-separator="至"
        start-placeholder="开始日期"
        end-placeholder="结束日期"
        @change="timeToggle"
        :editable="false"
      ></el-date-picker>
      <!-- @click="mixins_search" -->
      <el-button
        type="primary"
        class="search-btn"
        icon="el-icon-search"
        @click="lookDetails"
      >查询</el-button>
    </div>
    <zz-table
      :cols="cols"
      :settings="{ showCheckbox: false, showIndex: true, stripe: true }"
      :data="mixins_list"
      :pageset="mixins_pageset"
      @page-change="pageChange"
      @selection-change="selectionChange"
    >
      <template
        scope="scope"
        slot="opt"
      >
        <el-tooltip
          class="item"
          effect="light"
          placement="bottom"
          content="查看"
        >
          <i
            class="zoniot_font zoniot-icon-xiangqing"
            @click="viewDetails(scope.row)"
          ></i>
        </el-tooltip>
      </template>

    </zz-table>
  </div>
</template>


<script>
import index from './index';
import list from '@utils/list';
export default {
  mixins: [index, list],
  data () {
    return {
      mixins_post: 'post',
      nameParkingLot: [],
      parkName: '',
      mixins_pageset: {
        total: 0,
        pageIndex: 1,
        pageSize: 15,
        sortColumn: null, // 当前列的字段
        sortOrder: null // 排序方式 顺序：ASC  倒序：DESC
      },
    }
  },
  methods: {
    parkingLot (name) {
      this.parkName = name;
    },
    pageChange (obj) {
      if (obj.pageSize) {
        debugger;
        this.mixins_pageset.pageSize = obj.pageSize;
      }
      if (obj.page) {
        debugger;
        this.mixins_pageset.pageIndex = obj.page;
      }
      this.getList();
    },
    lookDetails () {
      if (this.parkName.length == 0) {
        this.$message.error('请选择停车场');
      } else {
        this.mixins_dataUrl = '/sc-community-web/parkingCar/findOutInInfo';
        this.mixins_query = { parkId: this.mixins_query.parkId, parkName: this.parkName };
        this.mixins_search();
      }







    },
    viewDetails (row) {
      // 详情
      new Promise((resolve) => {
        this.$store.dispatch('addPopup', {
          url: '/accessRecord/setpPage/details.vue',
          width: '950px',
          height: '595px',
          props: {
            // id: row.id,
            row: row,
            parkName: this.parkName
            // callback: resolve
          },
          showConfirmButton: true,
          showCancelButton: true,
          hideStar: true,
          title: '车辆通行记录详情'
        });
      }).then(() => {
        this.mixins_search();
      });
    },
    // 获取停车场名称
    nameParking () {
      this.$http.post('/sc-community-web/parkingCar/findParkInfo', { pageNum: this.mixins_pageset.pageIndex, pageSize: this.mixins_pageset.pageSize }).then(({ data, status, msg }) => {
        console.log(data.list);
        for (let i = 0; i < data.list.length; i++) {
          this.nameParkingLot.push({
            name: data.list[i].garageName,
            label: data.list[i].parkId
          })
          this.parkName = data.list[0].garageName
          this.mixins_query.parkId = data.list[0].parkId
          this.lookDetails();
        }
      })
    },

  },

  created () {
    // 调用停车场
    this.nameParking();
  }
}
</script>