luohe_operation/src/pages/index/components/pakking_lot.vue

<template>
  <div class="body-wrapper">
    <el-tabs v-model="activeName">
      <el-tab-pane label="停车场管理" name="停车场管理">
        <el-form class="form-wrapper" :inline="true" :model="formInline1" style="margin-bottom: 20px;">
          <el-row>
            <el-col :span="8">
              <el-form-item label="车场名称: ">
                <el-select filterable clearable v-model="formInline1.parkName" placeholder="请选择">
                  <el-option
                    v-for="(item,index) in carParkingNameOptions"
                    :key="index"
                    :label="item.parkName"
                    :value="item.id" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item>
                <el-button type="primary" class="query-btn" @click="onSubmit1" icon="el-icon-search">查询</el-button>
              </el-form-item>
              <el-form-item>
                <el-button type="success" @click="handleAdd">添加车场</el-button>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <el-table border :row-class-name="rowClassName" :data="tableData1" v-loading="loading1">
          <el-table-column v-for="(item, index) in columns1" :key="index" :label="item.label" :prop="item.key">
          </el-table-column>
          <el-table-column
            label="操作"
            width="200">
            <template slot-scope="scope" style="display: inline-block">
              <el-button type="primary" @click="handleEdit(scope.row)" slot="reference">修改</el-button>
              <el-popconfirm title="确定删除吗？" @confirm="deleteRow(scope.row)">
                <el-button type="danger" slot="reference">删除</el-button>
              </el-popconfirm>
            </template>
          </el-table-column>
        </el-table>
        <div class="table-pagination">
          <el-pagination layout="total, prev, pager, next, jumper" :total="total1" @current-change="handlePageChange1"
                         :current-page.sync="pageNum1" :page-size.sync="pageSize1">
          </el-pagination>
        </div>
        <el-dialog
          :title="title"
          :visible.sync="dialogVisible"
          width="45%"
          custom-class="audit-dialog">
          <div class="form-div">
            <el-form label-position="left" label-width="100px" :model="formLabelAlign">
              <el-form-item label="车场名称">
                <el-select filterable v-model="formLabelAlign.parkName" placeholder="请选择">
                  <el-option
                    v-for="(item,index) in carParkingNameOptions"
                    :key="index"
                    :label="item.parkName"
                    :value="item.id" />
                </el-select>
              </el-form-item>
              <el-form-item label="营业开始时间">
                <el-time-picker
                  v-model="formLabelAlign.inTime"
                  :picker-options="{selectableRange: '0:00:00 - 23:59:59'}"
                  value-format='HH:mm:ss'
                  placeholder="选择时间">
                </el-time-picker>
              </el-form-item>
              <el-form-item label="营业结束时间">
                <el-time-picker
                  v-model="formLabelAlign.outTime"
                  :picker-options="{selectableRange: '12:00:00 - 23:59:59'}"
                  value-format='HH:mm:ss'
                  placeholder="选择时间">
                </el-time-picker>
              </el-form-item>
<!--              <el-form-item label="停车场管理员">-->
<!--                <el-input v-model="formLabelAlign.managerName"></el-input>-->
<!--              </el-form-item>-->
            </el-form>
          </div>
          <span slot="footer" class="dialog-footer">
            <el-button @click="dialogVisible = false">取 消</el-button>
            <el-button type="primary" @click="handleConfirm">确 定</el-button>
        </span>
        </el-dialog>
      </el-tab-pane>
      <el-tab-pane label="计费规则管理" name="计费规则管理">
        <el-form class="form-wrapper" :inline="true" :model="formInline2" style="margin-bottom: 20px;">
          <el-row>
            <el-col :span="8">
              <el-form-item label="车场名称: ">
                <el-select filterable clearable v-model="formInline2.parkLotId" placeholder="请选择">
                  <el-option
                    v-for="(item,index) in carParkingNameOptions"
                    :key="index"
                    :label="item.parkName"
                    :value="item.id" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item>
                <el-button type="primary" class="query-btn" @click="onSubmit2" icon="el-icon-search">查询</el-button>
              </el-form-item>
              <el-form-item>
                <el-button type="success" @click="handleAdd2">添加</el-button>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <el-table border :row-class-name="rowClassName" :data="tableData2" v-loading="loading2">
          <el-table-column v-for="(item, index) in columns2" :key="index" :label="item.label" :prop="item.key">
          </el-table-column>
          <el-table-column
            label="操作"
            width="200">
            <template slot-scope="scope" style="display: inline-block">
              <el-button type="primary" @click="handleEdit2(scope.row)" slot="reference">修改</el-button>
              <el-popconfirm title="确定删除吗？" @confirm="deleteRow2(scope.row)">
                <el-button type="danger" slot="reference">删除</el-button>
              </el-popconfirm>
            </template>
          </el-table-column>
        </el-table>
        <div class="table-pagination">
          <el-pagination layout="total, prev, pager, next, jumper" :total="total2" @current-change="handlePageChange2"
                         :current-page.sync="pageNum2" :page-size.sync="pageSize2">
          </el-pagination>
        </div>
        <el-dialog
          :title="title2"
          :visible.sync="dialogVisible2"
          width="45%"
          custom-class="audit-dialog">
          <div class="form-div">
            <el-form label-position="left" label-width="110px" :model="formLabelAlign2">
              <el-form-item label="车场名称">
                <el-select filterable v-model="formLabelAlign2.parkLotId" placeholder="请选择">
                  <el-option
                    v-for="(item,index) in carParkingNameOptions"
                    :key="index"
                    :label="item.parkName"
                    :value="item.id" />
                </el-select>
              </el-form-item>
              <el-form-item label="计费方式">
                <el-input v-model="formLabelAlign2.billingMethod"></el-input>
              </el-form-item>
              <el-form-item label="收费标准(元/h)">
                <el-input v-model="formLabelAlign2.chargingStandard"></el-input>
              </el-form-item>
              <el-form-item label="收费方式">
                <el-input v-model="formLabelAlign2.chargingMethod"></el-input>
              </el-form-item>
            </el-form>
          </div>
          <span slot="footer" class="dialog-footer">
            <el-button @click="dialogVisible2 = false">取 消</el-button>
            <el-button type="primary" @click="handleConfirm2">确 定</el-button>
        </span>
        </el-dialog>
      </el-tab-pane>
      <el-tab-pane label="欠费规则管理" name="欠费规则管理">
        <el-form class="form-wrapper" :inline="true" :model="formInline3" style="margin-bottom: 20px;">
          <el-row>
            <el-col :span="8">
              <el-form-item label="车场名称:">
                <el-select filterable clearable v-model="formInline3.parkLotId" placeholder="请选择">
                  <el-option
                    v-for="(item,index) in carParkingNameOptions"
                    :key="index"
                    :label="item.parkName"
                    :value="item.id" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item>
                <el-button type="primary" class="query-btn" @click="onSubmit3" icon="el-icon-search">查询</el-button>
              </el-form-item>
              <el-form-item>
                <el-button type="success" @click="handleAdd3">添加</el-button>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <el-table border :row-class-name="rowClassName" :data="tableData3" v-loading="loading3">
          <el-table-column v-for="(item, index) in columns3" :key="index" :label="item.label" :prop="item.key">
          </el-table-column>
          <el-table-column
            label="操作"
            width="200">
            <template slot-scope="scope" style="display: inline-block">
              <el-button type="primary" @click="handleEdit3(scope.row)" slot="reference">修改</el-button>
              <el-popconfirm title="确定删除吗？" @confirm="deleteRow3(scope.row)">
                <el-button type="danger" slot="reference">删除</el-button>
              </el-popconfirm>
            </template>
          </el-table-column>
        </el-table>
        <div class="table-pagination">
          <el-pagination layout="total, prev, pager, next, jumper" :total="total3" @current-change="handlePageChange3"
                         :current-page.sync="pageNum3" :page-size.sync="pageSize3">
          </el-pagination>
        </div>

        <el-dialog
          :title="title3"
          :visible.sync="dialogVisible3"
          width="45%"
          custom-class="audit-dialog">
          <div class="form-div">
            <el-form label-position="left" label-width="100px" :model="formLabelAlign3">
              <el-form-item label="车场名称">
                <el-select filterable v-model="formLabelAlign3.parkLotId" placeholder="请选择">
                  <el-option
                    v-for="(item,index) in carParkingNameOptions"
                    :key="index"
                    :label="item.parkName"
                    :value="item.id" />
                </el-select>
              </el-form-item>
              <el-form-item label="欠费期限(h)">
                <el-input v-model="formLabelAlign3.paymentLimit"></el-input>
              </el-form-item>
              <el-form-item label="逾期费用">
                <el-input v-model="formLabelAlign3.chargingStandard"></el-input>
              </el-form-item>
              <el-form-item label="支付方式">
                <el-input v-model="formLabelAlign3.paymentMethod"></el-input>
              </el-form-item>
              <el-form-item label="通知方式">
                <el-input v-model="formLabelAlign3.notificationMethod"></el-input>
              </el-form-item>
              <el-form-item label="处理措施">
                <el-input v-model="formLabelAlign3.handlingMeasures"></el-input>
              </el-form-item>
            </el-form>
          </div>
          <span slot="footer" class="dialog-footer">
            <el-button @click="dialogVisible3 = false">取 消</el-button>
            <el-button type="primary" @click="handleConfirm3">确 定</el-button>
        </span>
        </el-dialog>
      </el-tab-pane>
      <el-tab-pane label="僵尸车管理" name="僵尸车管理">
        <el-form class="form-wrapper" :inline="true" :model="formInline4" style="margin-bottom: 20px;">
          <el-row>
            <el-col :span="8">
              <el-form-item label="车场名称:">
                <el-select filterable clearable v-model="formInline4.parkLotId" placeholder="请选择">
                  <el-option
                    v-for="(item,index) in carParkingNameOptions"
                    :key="index"
                    :label="item.parkName"
                    :value="item.id" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item>
                <el-button type="primary" class="query-btn" @click="onSubmit4" icon="el-icon-search">查询</el-button>
              </el-form-item>
              <el-form-item>
                <el-button type="success" @click="handleAdd4">添加</el-button>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <el-table border :row-class-name="rowClassName" :data="tableData4" v-loading="loading4">
          <el-table-column v-for="(item, index) in columns4" :key="index" :label="item.label" :prop="item.key">
          </el-table-column>
          <el-table-column
            label="操作"
            width="200">
            <template slot-scope="scope" style="display: inline-block">
              <el-button type="primary" @click="handleEdit4(scope.row)" slot="reference">修改</el-button>
              <el-popconfirm title="确定删除吗？" @confirm="deleteRow4(scope.row)">
                <el-button type="danger" slot="reference">删除</el-button>
              </el-popconfirm>
            </template>
          </el-table-column>
        </el-table>
        <div class="table-pagination">
          <el-pagination layout="total, prev, pager, next, jumper" :total="total4" @current-change="handlePageChange4"
                         :current-page.sync="pageNum4" :page-size.sync="pageSize4">
          </el-pagination>
        </div>

        <el-dialog
          :title="title4"
          :visible.sync="dialogVisible4"
          width="45%"
          custom-class="audit-dialog">
          <div class="form-div">
            <el-form label-position="left" label-width="100px" :model="formLabelAlign4">
              <el-form-item label="车场名称">
                <el-select filterable v-model="formLabelAlign4.parkLotId" placeholder="请选择">
                  <el-option
                    v-for="(item,index) in carParkingNameOptions"
                    :key="index"
                    :label="item.parkName"
                    :value="item.id" />
                </el-select>
              </el-form-item>
              <el-form-item label="标识通知">
                <el-input v-model="formLabelAlign4.identificationNotification"></el-input>
              </el-form-item>
              <el-form-item label="跟踪通知">
                <el-input v-model="formLabelAlign4.trackingNotifications"></el-input>
              </el-form-item>
              <el-form-item label="公告">
                <el-input v-model="formLabelAlign4.announcement"></el-input>
              </el-form-item>
              <el-form-item label="最终处理">
                <el-input v-model="formLabelAlign4.finalProcessing"></el-input>
              </el-form-item>
              <el-form-item label="法律程序">
                <el-input v-model="formLabelAlign4.legalProceedings"></el-input>
              </el-form-item>
            </el-form>
          </div>
          <span slot="footer" class="dialog-footer">
            <el-button @click="dialogVisible4 = false">取 消</el-button>
            <el-button type="primary" @click="handleConfirm4">确 定</el-button>
        </span>
        </el-dialog>
      </el-tab-pane>
      <el-tab-pane label="备案资源" name="备案资源">
        <el-form class="form-wrapper" :inline="true" :model="formInline5" style="margin-bottom: 20px;">
          <el-row>
            <el-col :span="8">
              <el-form-item label="车场名称:">
                <el-select filterable clearable v-model="formInline5.parkId" placeholder="请选择">
                  <el-option
                    v-for="(item,index) in carParkingNameOptions"
                    :key="index"
                    :label="item.parkName"
                    :value="item.id" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item>
                <el-button type="primary" class="query-btn" @click="onSubmit5" icon="el-icon-search">查询</el-button>
              </el-form-item>
              <el-form-item>
                <el-button type="success" @click="handleAdd5">添加</el-button>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <el-table border :row-class-name="rowClassName" :data="tableData5" v-loading="loading5">
          <el-table-column v-for="(item, index) in columns5" :key="index" :label="item.label" :prop="item.key">
          </el-table-column>
          <el-table-column
            label="操作"
            width="200">
            <template slot-scope="scope" style="display: inline-block">
              <el-button type="primary" @click="handleEdit5(scope.row)" slot="reference">修改</el-button>
              <el-popconfirm title="确定删除吗？" @confirm="deleteRow5(scope.row)">
                <el-button type="danger" slot="reference">删除</el-button>
              </el-popconfirm>
            </template>
          </el-table-column>
        </el-table>
        <div class="table-pagination">
          <el-pagination layout="total, prev, pager, next, jumper" :total="total5" @current-change="handlePageChange5"
                         :current-page.sync="pageNum5" :page-size.sync="pageSize5">
          </el-pagination>
        </div>
        <el-dialog
          :title="title5"
          :visible.sync="dialogVisible5"
          width="45%"
          custom-class="audit-dialog">
          <div class="form-div">
            <el-form label-position="left" label-width="100px" :model="formLabelAlign5">
              <el-form-item label="车场名称">
                <el-select filterable v-model="formLabelAlign5.parkId" placeholder="请选择">
                  <el-option
                    v-for="(item,index) in carParkingNameOptions"
                    :key="index"
                    :label="item.parkName"
                    :value="item.id" />
                </el-select>
              </el-form-item>
              <el-form-item label="单位名称">
                <el-input v-model="formLabelAlign5.unitName"></el-input>
              </el-form-item>
              <el-form-item label="资源类型">
                <el-input v-model="formLabelAlign5.resourceType"></el-input>
              </el-form-item>
              <el-form-item label="有效期">
                <el-date-picker
                  v-model="formLabelAlign5.effectiveTime"
                  type="daterange"
                  range-separator="至"
                  start-placeholder="开始日期"
                  value-format="yyyy-MM-dd"
                  end-placeholder="结束日期">
                </el-date-picker>
              </el-form-item>
              <el-form-item label="上传文件">
                <el-upload
                  class="upload-demo"
                  :multiple="false"
                  :on-success="handleSuccess"
                  :action="`${getUrl()}/opt/common/select/uploadLocalReturnUrl`"
                  :file-list="fileList">
                  <el-button size="small" type="primary">点击上传</el-button>
                  <!-- <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div> -->
                </el-upload>
              </el-form-item>、
            </el-form>
          </div>
          <span slot="footer" class="dialog-footer">
            <el-button @click="dialogVisible5 = false">取 消</el-button>
            <el-button type="primary" @click="handleConfirm5">确 定</el-button>
        </span>
        </el-dialog>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script>
import api from "@/api/audit.js";
import dictionary from "@/util/dictionary";
import api_z from "@/api/article_z.js";
import config from '@/config/index';

export default {
  components: {},
  data() {
    return {
      loading1: false,
      loading2: false,
      loading3: false,
      loading4: false,
      loading5: false,
      fileList: [],
      activeName: '停车场管理',
      columns1: [
        {
          label: '车场名称',
          key: 'parkName'
        },
        {
          label: '营业开始时间',
          key: 'inTime'
        },
        {
          label: '营业结束时间',
          key: 'outTime'
        },
        // {
        //   label: '停车场管理员',
        //   key: 'managerName'
        // },
      ],
      carParkingNameValue: '',
      carParkingNameOptions: [],
      tableData1: [{parkName: 'sasa'}],
      total1: 0,
      pageSize1: 10,
      pageNum1: 1,
      formInline1: {
        parkName: '',
      },
      title: '',
      dialogVisible: false,
      formLabelAlign: {
        id: '',
        parkName: '',
        inTime: '',
        outTime: '',
        managerName: '',
      },
      columns2: [
        {
          label: '车场名称',
          key: 'parkName'
        },
        {
          label: '计费方式',
          key: 'billingMethod'
        },
        {
          label: '收费标准(元/h)',
          key: 'chargingStandard'
        },
        {
          label: '收费方式',
          key: 'chargingMethod'
        },
      ],
      tableData2: [{parkLotId: 'sasa1'}],
      total2: 0,
      pageSize2: 10,
      pageNum2: 1,
      formInline2: {
        parkLotId: '',
      },
      title2: '',
      dialogVisible2: false,
      formLabelAlign2: {
        id: '',
        parkLotId: '',
        billingMethod: '',
        chargingStandard: '',
        chargingMethod: '',
      },
      columns3: [
        {
          label: '停车场名称',
          key: 'parkName'
        },
        {
          label: '欠费期限(h)',
          key: 'paymentLimit'
        },
        {
          label: '逾期费用',
          key: 'chargingStandard'
        },
        {
          label: '支付方式',
          key: 'paymentMethod'
        },
        {
          label: '通知方式',
          key: 'notificationMethod'
        },
        {
          label: '处理措施',
          key: 'handlingMeasures'
        },
      ],
      tableData3: [{parkLotId: 'sasa111'}],
      total3: 0,
      pageSize3: 10,
      pageNum3: 1,
      formInline3: {
        parkLotId: ''
      },
      title3: '',
      dialogVisible3: false,
      formLabelAlign3: {
        id: '',
        parkLotId: '',
        paymentLimit: '',
        chargingStandard: '',
        paymentMethod: '',
        notificationMethod: '',
        handlingMeasures: '',
      },
      columns4: [
        {
          label: '停车场名称',
          key: 'parkName'
        },
        {
          label: '标识通知',
          key: 'identificationNotification'
        },
        {
          label: '跟踪通知',
          key: 'trackingNotifications'
        },
        {
          label: '公告',
          key: 'announcement'
        },
        {
          label: '最终处理',
          key: 'finalProcessing'
        },
        {
          label: '法律程序',
          key: 'legalProceedings'
        },
      ],
      tableData4: [{parkLotId: 'sasa1111'}],
      total4: 0,
      pageSize4: 10,
      pageNum4: 1,
      formInline4: {
        parkLotId: ''
      },
      title4: '',
      dialogVisible4: false,
      formLabelAlign4: {
        id: '',
        parkLotId: '',
        identificationNotification: '',
        trackingNotifications: '',
        announcement: '',
        finalProcessing: '',
        legalProceedings: '',
      },
      columns5: [
        {
          label: '停车场名称',
          key: 'parkName'
        },
        {
          label: '单位名称',
          key: 'unitName'
        },
        {
          label: '资源类型',
          key: 'resourceType'
        },
        {
          label: '文件',
          key: 'fileUrl'
        },
        {
          label: '有效期',
          key: 'effectiveTime'
        },
        {
          label: '创建时间',
          key: 'createTime'
        }
      ],
      tableData5: [],
      total5: 0,
      pageSize5: 10,
      pageNum5: 1,
      formInline5: {
        parkId: ''
      },
      title5: '',
      dialogVisible5: false,
      formLabelAlign5: {
        id: '',
        parkId: '',
        unitName: '',
        resourceType: '',
        effectiveTime: '',
      },
      fileUrl: ''
    }
  },
  mounted() {
    this.getTableData1()
    this.getCarParkingName()
    this.getTableData2()
    this.getTableData3()
    this.getTableData4()
    this.getTableData5()
  },
  watch: {},
  methods: {
    rowClassName({ rowIndex }) {
      // 偶数行和奇数行分别返回不同的类名，也可以根据实际需求基于rowData进行条件判断
      return rowIndex % 2 === 0 ? 'even-row' : 'odd-row';
    },
    handleSuccess(response, file, fileList) {
      this.fileUrl = response.data
    },
    getUrl() {
      return process.env.NODE_ENV !== 'development' ? config.build.BASE_API : config.dev.BASE_API;
    },
    onSubmit1() {
      this.pageNum1 = 1
      this.getTableData1()
    },
    handleAdd() {
      this.title = '添加车场'
      this.formLabelAlign = {}
      this.dialogVisible = true
    },
    handleEdit(row) {
      this.title = '修改车场'
      this.formLabelAlign = {...row}
      this.dialogVisible = true
    },
    deleteRow(record) {
      api_z.deleteParkingLot([{id: record.id}]).then(res => {
        if (res.code === 200) {
          this.$message({type: 'success', message: '删除成功!'})
          this.getTableData1()
        }
      })
    },
    handleConfirm() {
      if (this.title === '修改车场') {
        api_z.editParkingLot({...this.formLabelAlign}).then(res => {
          if (res.code === 200) {
            this.dialogVisible = false
            this.$message({
              message: '修改成功!',
              type: 'success'
            })
            this.getTableData1()
          }
        })
      } else {
        api_z.addParkingLot({...this.formLabelAlign}).then(res => {
          if (res.code === 200) {
            this.dialogVisible = false
            this.$message({
              message: '添加成功!',
              type: 'success'
            })
            this.getTableData1()
          }
        })
      }
    },

    //车场
    getCarParkingName() {
      api_z.querySelectParkListByPage().then(res => {
        this.carParkingNameOptions=res.data
      })
    },
    onSubmit2() {
      this.pageNum2 = 1
      this.getTableData2()
    },
    handleAdd2() {
      this.title2 = '添加'
      this.formLabelAlign2 = {}
      this.dialogVisible2 = true
    },

    handleEdit2(row) {
      this.title2 = '修改'
      this.formLabelAlign2 = {...row}
      this.dialogVisible2 = true
    },
    deleteRow2(record) {
      api_z.deleteParkingCharging([{id: record.id}]).then(res => {
        if (res.code === 200) {
          this.$message({type: 'success', message: '删除成功!'})
          this.getTableData2()
        }
      })
    },
    handleConfirm2() {
      if (this.title2 === '修改') {
        api_z.editParkingCharging({...this.formLabelAlign2}).then(res => {
          if (res.code === 200) {
            this.dialogVisible2 = false
            this.$message({
              message: '修改成功!',
              type: 'success'
            })
            this.getTableData2()
          }
        })
      } else {
        api_z.addParkingCharging({...this.formLabelAlign2}).then(res => {
          if (res.code === 200) {
            this.dialogVisible2 = false
            this.$message({
              message: '添加成功!',
              type: 'success'
            })
            this.getTableData2()
          }
        })
      }
    },
    onSubmit3() {
      this.pageNum3 = 1
      this.getTableData3()
    },
    handleAdd3() {
      this.title3 = '添加'
      this.formLabelAlign3 = {}
      this.dialogVisible3 = true
    },

    handleEdit3(row) {
      this.title3 = '修改'
      this.formLabelAlign3 = {...row}
      this.dialogVisible3 = true
    },
    deleteRow3(record) {
      api_z.deleteParkingArrear([{id: record.id}]).then(res => {
        if (res.code === 200) {
          this.$message({type: 'success', message: '删除成功!'})
          this.getTableData3()
        }
      })
    },
    handleConfirm3() {
      if (this.title3 === '修改') {
        api_z.editParkingArrear({...this.formLabelAlign3}).then(res => {
          if (res.code === 200) {
            this.dialogVisible3 = false
            this.$message({
              message: '修改成功!',
              type: 'success'
            })
            this.getTableData3()
          }
        })
      } else {
        api_z.addParkingArrear({...this.formLabelAlign3}).then(res => {
          if (res.code === 200) {
            this.dialogVisible3 = false
            this.$message({
              message: '添加成功!',
              type: 'success'
            })
            this.getTableData3()
          }
        })
      }
    },
    onSubmit4() {
      this.pageNum4 = 1
      this.getTableData4()
    },
    handleAdd4() {
      this.title4 = '添加'
      this.formLabelAlign4 = {}
      this.dialogVisible4 = true
    },

    handleEdit4(row) {
      this.title4 = '修改'
      this.formLabelAlign4 = {...row}
      this.dialogVisible4 = true
    },
    deleteRow4(record) {
      api_z.deleteParkingCar([{id: record.id}]).then(res => {
        if (res.code === 200) {
          this.$message({type: 'success', message: '删除成功!'})
          this.getTableData4()
        }
      })
    },
    handleConfirm4() {
      if (this.title4 === '修改') {
        api_z.editParkingCar({...this.formLabelAlign4}).then(res => {
          if (res.code === 200) {
            this.dialogVisible4 = false
            this.$message({
              message: '修改成功!',
              type: 'success'
            })
            this.getTableData4()
          }
        })
      } else {
        api_z.addParkingCar({...this.formLabelAlign4}).then(res => {
          if (res.code === 200) {
            this.dialogVisible4 = false
            this.$message({
              message: '添加成功!',
              type: 'success'
            })
            this.getTableData4()
          }
        })
      }
    },
    onSubmit5() {
      this.pageNum5 = 1
      this.getTableData5()
    },
    handleAdd5() {
      this.title5 = '添加'
      this.formLabelAlign5 = {}
      this.dialogVisible5 = true
    },

    handleEdit5(row) {
      this.title5 = '修改'
      this.fileUrl = ''
      this.formLabelAlign5 = {...row, effectiveTime: row.effectiveTime ? row.effectiveTime.split('～') : []}
      this.dialogVisible5 = true
    },
    deleteRow5(record) {
      api_z.deleteBazy([{id: record.id}]).then(res => {
        if (res.code === 200) {
          this.$message({type: 'success', message: '删除成功!'})
          this.getTableData5()
        }
      })
    },
    handleConfirm5() {
      if (this.title5 === '修改') {
        api_z.editBazy({...this.formLabelAlign5, fileUrl: this.fileUrl, effectiveTime: this.formLabelAlign5.effectiveTime ? this.formLabelAlign5.effectiveTime.join('～') : ''}).then(res => {
          if (res.code === 200) {
            this.dialogVisible5 = false
            this.$message({
              message: '修改成功!',
              type: 'success'
            })
            this.getTableData5()
          }
        })
      } else {
        api_z.addBazy({...this.formLabelAlign5, fileUrl: this.fileUrl, effectiveTime: this.formLabelAlign5.effectiveTime ? this.formLabelAlign5.effectiveTime.join('-') : ''}).then(res => {
          if (res.code === 200) {
            this.dialogVisible5 = false
            this.$message({
              message: '添加成功!',
              type: 'success'
            })
            this.getTableData5()
          }
        })
      }
    },
    handlePageChange1() {
      this.getTableData1()
    },
    getTableData1() {
      this.loading1 = true
      const {pageNum1, pageSize1} = this
      api_z.queryParkingLotByPage({current: pageNum1, size: pageSize1, ...this.formInline1}).then(res => {
        this.tableData1 = res.data.records || []
        this.total1 = res.data.total
        this.loading1 = false
      })
    },
    handlePageChange2() {
      this.getTableData2()
    },
    getTableData2() {
      this.loading2 = true
      const {pageNum2, pageSize2} = this
      api_z.queryParkingChargingByPage({current: pageNum2, size: pageSize2, ...this.formInline2}).then(res => {
        this.tableData2 = res.data.records || []
        this.total2 = res.data.total
        this.loading2 = false
      })
    },
    handlePageChange3() {
      this.getTableData3()
    },
    getTableData3() {
      this.loading3 = true
      const {pageNum3, pageSize3} = this
      api_z.queryParkingArrearByPage({current: pageNum3, size: pageSize3, ...this.formInline3}).then(res => {
        this.tableData3 = res.data.records || []
        this.total3 = res.data.total
        this.loading3 = false
      })
    },
    handlePageChange4() {
      this.getTableData4()
    },
    getTableData4() {
      this.loading4 = true
      const {pageNum4, pageSize4} = this
      api_z.queryParkingCarByPage({current: pageNum4, size: pageSize4, ...this.formInline4}).then(res => {
        this.tableData4 = res.data.records || []
        this.total4 = res.data.total
        this.loading4 = false
      })
    },
    handlePageChange5() {
      this.getTableData5()
    },
    getTableData5() {
      this.loading5 = true
      const {pageNum5, pageSize5} = this
      api_z.queryBazyByPage({current: pageNum5, size: pageSize5, ...this.formInline5}).then(res => {
        this.tableData5 = res.data.records || []
        this.total5 = res.data.total
        this.loading5 = false
      })
    },

  }
}
</script>
<style lang="scss" scoped>
.body-wrapper {
  .form-wrapper {
    .el-form-item {
      margin-bottom: 0px;
    }
  }
  .button-block {
    text-align: right;
    margin-bottom: 20px;
  }

  .table-pagination {
    text-align: right;
  }

  .search-card {
    margin-bottom: 20px;
    text-align: center;

    .input-wrapper {
      width: 36%;
    }
  }

  .audit-dialog {
    .mg-bt {
      margin-bottom: 24px;
    }

    .label {
      text-align: right;
    }

    .form-div {
      /deep/ .el-input__inner {
        height: 35px;
        width: 99%;
        border: 1px solid #a6a5a5;
      }
    }
  }
}
</style>