Merge branch 'master' of http://120.76.84.145:10101/gitblit/r/H5/shehong-ve...

董国庆

2025-04-07 42a0094db59efde8d231c33d5569e75ee0109beb

Merge branch 'master' of http://120.76.84.145:10101/gitblit/r/H5/shehong-vehicle-supervision

 src/assets/homeImg/eye-fill.png

 src/main.js

@@ -6,6 +6,9 @@
import ElementUI from 'element-ui';

import cookies from 'vue-cookies'

import apiConfig from './utils/baseurl'

import {

  Message

} from 'element-ui'



Vue.use(ElementUI)

Vue.prototype.$cookies = cookies;

@@ -27,6 +30,33 @@
  return height

}



Vue.prototype.msgsuccess = function (msg) {

  Message({

    message: msg,

    type: "success"

  });

}



Vue.prototype.msgerror = function (msg) {

  Message({

    message: msg,

    type: "error"

  });

}



Vue.prototype.msgwarning = function (msg) {

  Message({

    message: msg,

    type: "warning"

  });

}



Vue.prototype.msginfo = function (msg) {

  Message({

    message: msg,

  });

}



new Vue({

  router,

  store,


 src/utils/utils.js

@@ -1,3 +1,8 @@
import apiConfig from '@/utils/baseurl'

import {

  Message

} from 'element-ui'



// 生成4位随机验证码

export function generateVerificationCode() {

  const characters = '123456789abcdefghijkmnpqrstuvwxyABCDEFGHJKLMNPQRSTUVWXY';

@@ -20,7 +25,7 @@


// 导出

export const exportExcell = (name, params, url) => {

  fetch(BASE_URL + url, {

  fetch(apiConfig.baseURL + url, {

    method: 'get',

    params: JSON.stringify({

      ...params,

@@ -44,5 +49,10 @@
      // 释放的 URL 对象以及移除 a 标签

      URL.revokeObjectURL(link.href);

      document.body.removeChild(link);

      Message({

        message: '导出成功',

        type: 'success',

        duration: 2000

      })

    });

};


 src/view/car-manage/components/detailModal.vue

@@ -2,35 +2,35 @@
    <div>
        <el-dialog title="车辆基础信息" :visible.sync="dialogVisible" width="80%" :modal-append-to-body="false">
            <el-descriptions title="" :column="3">
                <el-descriptions-item label="公司名称">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="车牌号码">91510922769973987B</el-descriptions-item>
                <el-descriptions-item label="车辆颜色">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                <el-descriptions-item label="核定载客位">14725836902</el-descriptions-item>
                <el-descriptions-item label="车辆厂牌">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="车辆型号">91510922769973987B</el-descriptions-item>
                <el-descriptions-item label="车辆类型">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                <el-descriptions-item label="所属车主">14725836902</el-descriptions-item>
                <el-descriptions-item label="车身颜色">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="发动机号">91510922769973987B</el-descriptions-item>
                <el-descriptions-item label="车辆VIN码">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                <el-descriptions-item label="车辆注册日期">14725836902</el-descriptions-item>
                <el-descriptions-item label="车辆燃料类型">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="发动机排量">91510922769973987B</el-descriptions-item>
                <el-descriptions-item label="车辆运输证发证机构">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                <el-descriptions-item label="车辆经营区域">14725836902</el-descriptions-item>
                <el-descriptions-item label="运输证字号">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="车辆运输证有效期起">91510922769973987B</el-descriptions-item>
                <el-descriptions-item label="车辆运输证有效期止">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                <el-descriptions-item label="车辆初次登记日期">14725836902</el-descriptions-item>
                <el-descriptions-item label="车辆检修状态">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="车辆年度审验状态">91510922769973987B</el-descriptions-item>
                <el-descriptions-item label="卫星定位装置品牌">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                <el-descriptions-item label="卫星定位装置型号">14725836902</el-descriptions-item>
                <el-descriptions-item label="卫星定位装置IMEI号">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="卫星定位设备安装日期">91510922769973987B</el-descriptions-item>
                <el-descriptions-item label="注册日期">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                <el-descriptions-item label="营运类型">14725836902</el-descriptions-item>
                <el-descriptions-item label="运价类型编码">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="公司名称">{{detail.enterpriseName}}</el-descriptions-item>
                <el-descriptions-item label="车牌号码">{{detail.vehicleNumber}}</el-descriptions-item>
                <el-descriptions-item label="车牌颜色">{{detail.licensePlateColor}}</el-descriptions-item>
                <el-descriptions-item label="核定载客位">{{detail.passengerCapacity}}</el-descriptions-item>
                <el-descriptions-item label="车辆厂牌">{{detail.brand}}</el-descriptions-item>
                <el-descriptions-item label="车辆型号">{{detail.brandModel}}</el-descriptions-item>
                <el-descriptions-item label="车辆类型">{{detail.vehicleType}}</el-descriptions-item>
                <el-descriptions-item label="所属车主">{{detail.driverName}}</el-descriptions-item>
                <el-descriptions-item label="车身颜色">{{detail.vehicleColor}}</el-descriptions-item>
                <el-descriptions-item label="发动机号">{{detail.engineNumber}}</el-descriptions-item>
                <el-descriptions-item label="车辆VIN码">{{detail.vin}}</el-descriptions-item>
                <el-descriptions-item label="车辆注册日期">{{detail.registrationDate}}</el-descriptions-item>
                <el-descriptions-item label="车辆燃料类型">{{detail.fuelType}}</el-descriptions-item>
                <el-descriptions-item label="发动机排量">{{detail.engineCapacity}}</el-descriptions-item>
                <el-descriptions-item label="车辆运输证发证机构">{{detail.transportLicenseIssuingAuthority}}</el-descriptions-item>
                <el-descriptions-item label="车辆经营区域">{{detail.operatingArea}}</el-descriptions-item>
                <el-descriptions-item label="运输证字号">{{detail.transportCertificateNumber}}</el-descriptions-item>
                <el-descriptions-item label="车辆运输证有效期起">{{detail.transportCertificateStart}}</el-descriptions-item>
                <el-descriptions-item label="车辆运输证有效期止">{{detail.transportCertificateEnd}}</el-descriptions-item>
                <el-descriptions-item label="车辆初次登记日期">{{detail.initialRegistrationTime}}</el-descriptions-item>
                <el-descriptions-item label="车辆检修状态">{{detail.vehicleMaintenanceStatus}}</el-descriptions-item>
                <el-descriptions-item label="车辆年度审验状态">{{detail.annualReviewStatus}}</el-descriptions-item>
                <el-descriptions-item label="卫星定位装置品牌">{{detail.gpsBrand}}</el-descriptions-item>
                <el-descriptions-item label="卫星定位装置型号">{{detail.gpsModel}}</el-descriptions-item>
                <el-descriptions-item label="卫星定位装置IMEI号">{{detail.gpsImei}}</el-descriptions-item>
                <el-descriptions-item label="卫星定位设备安装日期">{{detail.gpsInstallationDate}}</el-descriptions-item>
                <el-descriptions-item label="注册日期">{{detail.registrationDate}}</el-descriptions-item>
                <el-descriptions-item label="营运类型">{{detail.operateType}}</el-descriptions-item>
                <el-descriptions-item label="运价类型编码">{{detail.rateTypeNumber}}</el-descriptions-item>
            </el-descriptions>
        </el-dialog>
    </div>
@@ -39,7 +39,12 @@
<script>
export default {
    components: {},
    props: {},
    props: {
        detail: {
            type: Object,
            default: () => { }
        }
    },
    data() {
        return {
            dialogVisible: false

 src/view/car-manage/detail.vue

@@ -3,23 +3,23 @@
        <div class="info-content flex">
            <div class="info-left flex3 flex">
                <div class="info-back flex shrink0">
                    <span class="back-size"><i class="el-icon-back"></i>返回</span>
                    <span class="back-size" @click="$router.back()"><i class="el-icon-back"></i>返回</span>
                </div>
                <div class="info-content-left ml--100">
                    <el-descriptions :column="2">
                        <el-descriptions-item label="公司名称">kooriookami</el-descriptions-item>
                        <el-descriptions-item label="车牌号码">18100000000</el-descriptions-item>
                        <el-descriptions-item label="车牌颜色">苏州市</el-descriptions-item>
                        <el-descriptions-item label="车辆营运类型">kooriookami</el-descriptions-item>
                        <el-descriptions-item label="所属车主">18100000000</el-descriptions-item>
                        <el-descriptions-item label="联系电话">苏州市</el-descriptions-item>
                        <el-descriptions-item label="经营区域">kooriookami</el-descriptions-item>
                        <el-descriptions-item label="车辆年度审验">18100000000</el-descriptions-item>
                        <el-descriptions-item label="驾驶证">
                            <img class="img-size" src="../../assets/homeImg/img1.png"></img>
                        <el-descriptions-item label="公司名称">{{detail.enterpriseName}}</el-descriptions-item>
                        <el-descriptions-item label="车牌号码">{{detail.vehicleNumber}}</el-descriptions-item>
                        <el-descriptions-item label="车牌颜色">{{detail.licensePlateColor}}</el-descriptions-item>
                        <el-descriptions-item label="车辆营运类型">{{detail.operateType}}</el-descriptions-item>
                        <el-descriptions-item label="所属车主">{{detail.driverName}}</el-descriptions-item>
                        <el-descriptions-item label="联系电话">{{detail.driverPhone}}</el-descriptions-item>
                        <el-descriptions-item label="经营区域">{{detail.operatingArea}}</el-descriptions-item>
                        <el-descriptions-item label="车辆年度审验">{{detail.annualReviewStatus}}</el-descriptions-item>
                        <el-descriptions-item label="驾驶证" v-if="detail.drivingLicense">
                            <img class="img-size" :src="detail.drivingLicense"></img>
                        </el-descriptions-item>
                        <el-descriptions-item label="行驶证">
                            <img class="img-size" src="../../assets/homeImg/img2.png"></img>
                        <el-descriptions-item label="行驶证" v-if="detail.travelLicense">
                            <img class="img-size" :src="detail.travelLicense"></img>
                        </el-descriptions-item>
                    </el-descriptions>
                    <div class="info-btn" @click="showDetail">
@@ -57,7 +57,7 @@

                        <div class="pagination-box relative mt--23 flex j-end">
                            <el-pagination :popper-append-to-body="false" @size-change="handleSizeChange"
                                @current-change="handleCurrentChange" :current-page="searchForm.page" background
                                @current-change="handleCurrentChange" :current-page="searchForm.pageCurr" background
                                layout="total,sizes,prev, pager, next,jumper" :total="searchForm.total">
                            </el-pagination>
                        </div>
@@ -88,7 +88,7 @@

                        <div class="pagination-box relative mt--23 flex j-end">
                            <el-pagination :popper-append-to-body="false" @size-change="handleSizeChange"
                                @current-change="handleCurrentChange" :current-page="searchForm.page" background
                                @current-change="handleCurrentChange" :current-page="searchForm.pageCurr" background
                                layout="total,sizes,prev, pager, next,jumper" :total="searchForm.total">
                            </el-pagination>
                        </div>
@@ -100,12 +100,10 @@
                            <el-form :inline="true" :model="searchForm" class="demo-form-inline">
                                <el-form-item label="选择轨迹时间范围:" prop="level" class="unset_m"
                                    style="margin-right: 15px;">
                                    <el-date-picker v-model="searchForm.date" type="daterange" range-separator="至"
                                        start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd"
                                        >
                                    <el-date-picker v-model="searchForm.date" type="datetimerange" range-separator="至"
                                        start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd">
                                    </el-date-picker>
                                </el-form-item>

                            </el-form>
                        </div>
                        <div class="form-right shrink0 mr--24 mb--23">
@@ -120,13 +118,15 @@
                </el-tab-pane>
            </el-tabs>
        </div>
        <DetailModal ref="detailModal" />
        <DetailModal ref="detailModal" :detail="detail"
  />
    </div>
</template>

<script>
import AMapLoader from "@amap/amap-jsapi-loader";
import DetailModal from "./components/detailModal.vue";
import { getCarDetail,getCarOrder,getCarWarning,getCarTrack } from './service'
export default {
    name: "detail",
    components: { DetailModal },
@@ -135,28 +135,63 @@
            id: '',
            tableData: [],
            searchForm: {
                date: '',
                type: '',
                level: '',
                name: '',
                total: 40,
                page: 1,
                pageSize: 10
                pageCurr: 1,
                pageSize: 10,
                total: 0
            },
            activeName: 'first'
            detail:{},
            activeName: 'first',
            routeList:[],
        }
    },
    mounted() {
        this.initMap();
        if(this.$route.query.id){
            getCarDetail({id: this.$route.query.id}).then(res => {
                this.detail = res;
                this.getList(res.vehicleNumber);
            })
        }
        
    },
    methods: {
        handleClick(){

        handleClick(e) {
            this.activeName = e.name
            if(e.name != 'third'){
                this.searchForm = {
                    pageCurr: 1,
                    pageSize: 10,
                    total: 0,
                }
                this.getList(this.detail.vehicleNumber)
            }else{
                getCarTrack({...this.searchForm,vehicleNumber:this.detail.vehicleNumber}).then(res => {
                  this.routeList = res;
                  if(res.length > 0){
                    this.initMap();
                  }
                })
            }
        },
        search(){},
        search() {

         },
        reset() {

        },
        getList(vehicleNumber) { 
            if(this.activeName == 'first'){
                getCarOrder({...this.searchForm,vehicleNumber:vehicleNumber}).then(res => {
                    this.tableData = res.records;
                    this.searchForm.total = res.total;
                }) 
            }else{
                getCarWarning({...this.searchForm,vehicleNumber:vehicleNumber}).then(res => {
                    this.tableData = res.records; 
                    this.searchForm.total = res.total;
                })
            }
        },

        
        showDetail() {
            this.$refs.detailModal.dialogVisible = true
        },
@@ -177,12 +212,17 @@
                        zoom: 15,
                    });
                    this.map.addControl(new AMap.ToolBar());

                    let path = [
                        new AMap.LngLat(105.57, 30.51),
                        new AMap.LngLat(116.382122, 39.901176),
                        new AMap.LngLat(116.387271, 39.912501),
                        new AMap.LngLat(116.398258, 39.9046),
                        // new AMap.LngLat(105.57, 30.51),
                        // new AMap.LngLat(116.382122, 39.901176),
                        // new AMap.LngLat(116.387271, 39.912501),
                        // new AMap.LngLat(116.398258, 39.9046),
                    ]
                    this.routeList.forEach(item => {
                        path.push(new AMap.LngLat(item.longitude, item.latitude))
                    })

                    const content = `<div class="custom-content-marker">
                                        <img src="${require("@/assets/logo.png")}">
                                    </div>`;

 src/view/car-manage/index.vue

@@ -3,45 +3,44 @@
        <div class="form flex j-between mt--23" style="align-items: end;">
            <div class="form-left ml--30">
                <el-form :inline="true" :model="searchForm" class="demo-form-inline">
                    <el-form-item label="车辆号牌:" prop="level" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.level" placeholder="请输入"></el-input>
                    <el-form-item label="车辆号:" prop="carNumber" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.carNumber" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="公司名称:" prop="level" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.level" placeholder="请输入"></el-input>
                    <el-form-item label="公司名称:" prop="companyName" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.companyName" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="所属车主:" prop="level" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.level" placeholder="请输入"></el-input>
                    <el-form-item label="所属车主:" prop="ownerName" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.ownerName" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="车辆颜色:" prop="level" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.level" placeholder="请输入"></el-input>
                    <el-form-item label="车辆颜色:" prop="carColor" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.carColor" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="车辆经营区域:" prop="level" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.level" placeholder="请输入"></el-input>
                    <el-form-item label="车辆经营区域:" prop="operationArea" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.operationArea" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="车辆型号:" prop="level" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.level" placeholder="请输入"></el-input>
                    <el-form-item label="车辆型号:" prop="carModel" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.carModel" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="车辆型号:" prop="level" class="unset_m" style="margin-right: 15px;">
                        <el-form-item prop="level" style="margin-right: unset !important;">
                            <el-input class="w--90" v-model="searchForm.level" placeholder="请输入"></el-input>
                    <el-form-item label="核定载客位:" prop="startNum" class="unset_m" style="margin-right: 15px;">
                        <el-form-item prop="startNum" style="margin-right: unset !important;">
                            <el-input class="w--90" v-model="searchForm.startNum" placeholder="请输入最小值"></el-input>
                        </el-form-item>
                        <span class="mr--5 ml--5">-</span>
                        <el-form-item prop="level" class="unset_m">
                            <el-input  class="w--90"  v-model="searchForm.level" placeholder="请输入"></el-input>
                        <el-form-item prop="endNum" class="unset_m">
                            <el-input class="w--90" v-model="searchForm.endNum" placeholder="请输入最大值"></el-input>
                        </el-form-item>
                    </el-form-item>
                    <el-form-item label="车辆运营类型:" prop="type" class="unset_m" style="margin-right: 15px;">
                        <el-select :popper-append-to-body="false" v-model="searchForm.type" placeholder="请选择">
                            <el-option label="全部" value=""></el-option>
                            <el-option label="预警" value="1"></el-option>
                            <el-option label="报警" value="2"></el-option>
                    <el-form-item label="车辆运营类型:" prop="operationType" class="unset_m" style="margin-right: 15px;">
                        <el-select :popper-append-to-body="false" v-model="searchForm.operationType" placeholder="请选择">
                            <el-option v-for="(item,index) in options" :key="index" :label="item.name" :value="item.id"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="车辆运营状态:" prop="type" class="unset_m" style="margin-right: 15px;">
                        <el-select :popper-append-to-body="false" v-model="searchForm.type" placeholder="请选择">
                            <el-option label="全部" value=""></el-option>
                            <el-option label="预警" value="1"></el-option>
                            <el-option label="报警" value="2"></el-option>
                    <el-form-item label="车辆状态:" prop="carStatus" class="unset_m" style="margin-right: 15px;">
                        <el-select :popper-append-to-body="false" v-model="searchForm.carStatus" placeholder="请选择">
                            <el-option label="在线" value="1"></el-option>
                            <el-option label="异常" value="2"></el-option>
                            <el-option label="离线" value="3"></el-option>
                            <el-option label="故障" value="4"></el-option>
                        </el-select>
                    </el-form-item>
                </el-form>
@@ -59,19 +58,27 @@
        </div>
        <div class="table-box ml--30 mt--23 mr--30">
            <el-table :data="tableData" border stripe style="width: 100%">
                <el-table-column prop="date" label="序号"></el-table-column>
                <el-table-column prop="name" label="车牌号"></el-table-column>
                <el-table-column prop="name" label="车辆颜色"></el-table-column>
                <el-table-column prop="name" label="车辆所属公司"></el-table-column>
                <el-table-column prop="name" label="核定载客位"></el-table-column>
                <el-table-column prop="name" label="车辆型号"></el-table-column>
                <el-table-column prop="name" label="车辆类型"></el-table-column>
                <el-table-column prop="name" label="车主"></el-table-column>
                <el-table-column prop="name" label="车身颜色"></el-table-column>
                <el-table-column prop="name" label="车辆注册日期"></el-table-column>
                <el-table-column prop="name" label="车辆经营区域"></el-table-column>
                <el-table-column prop="name" label="车辆运营类型"></el-table-column>
                <el-table-column prop="name" label="操作">
                <el-table-column type="index" label="序号" width="60"></el-table-column>
                <el-table-column prop="vehicleNumber" label="车牌号"></el-table-column>
                <el-table-column prop="licensePlateColor" label="车辆颜色"></el-table-column>
                <el-table-column prop="enterpriseName" label="车辆所属公司"></el-table-column>
                <el-table-column prop="passengerCapacity" label="核定载客位"></el-table-column>
                <el-table-column prop="brandModel" label="车辆型号"></el-table-column>
                <el-table-column prop="vehicleType" label="车辆类型"></el-table-column>
                <el-table-column prop="driverName" label="车主"></el-table-column>
                <el-table-column prop="vehicleColor" label="车身颜色"></el-table-column>
                <el-table-column prop="registrationDate" label="车辆注册日期"></el-table-column>
                <el-table-column prop="operatingArea" label="车辆经营区域"></el-table-column>
                <el-table-column prop="operateType" label="车辆运营类型"></el-table-column>
                <el-table-column prop="status" label="车辆状态">
                    <template slot-scope="scope">
                       <el-tag v-if="scope.row.status == 1" type="success">在线</el-tag>
                       <el-tag v-if="scope.row.status == 2" type="warning">异常</el-tag>
                       <el-tag v-if="scope.row.status == 4" type="warning">故障</el-tag>
                       <el-tag v-if="scope.row.status == 3" type="info">离线</el-tag>
                    </template>
                </el-table-column>
                <el-table-column label="操作" width="100">
                    <template slot-scope="scope">
                        <el-button type="text" @click="handle(scope.$index, scope.row)">详情</el-button>
                    </template>
@@ -85,44 +92,89 @@
                </el-pagination>
            </div>
        </div>



    </div>
</template>

<script>
import { getCarList,getCarType } from './service'
import { search } from 'core-js/fn/symbol';

export default {
    data() {
        return {
            searchForm: {
                date: '',
                type: '',
                level: '',
                name: '',
                total: 40,
                page: 1,
                carNumber: '', // 车辆号
                companyName: '', // 公司名称
                ownerName: '', // 所属车主
                carColor: '', // 车辆颜色
                operationArea: '', // 车辆经营区域
                carModel: '', // 车辆型号
                startNum: '', // 核定载客位最小值
                endNum: '', // 核定载客位最大值
                operationType: '', // 车辆运营类型
                carStatus: '', // 车辆状态
                total: 0,
                pageCurr: 1,
                pageSize: 10
            },
            options:[],
            tableData: [],
        };
    },
    created() {
        getCarType().then(res => {
            this.options = res;
        });
        this.getList();
    },
    methods: {
        reset() {
            this.searchForm = {
                carNumber: '',
                companyName: '',
                ownerName: '',
                carColor: '',
                operationArea: '',
                carModel: '',
                minSeats: '',
                maxSeats: '',
                operationType: '',
                carStatus: '',
                total: 0,
                pageCurr: 1,
                pageSize: 10
            };
         
            this.getList();
        },
        search() {

            this.searchForm.pageCurr = 1;
            this.getList();
        },
        async getList() {
            try {
                const res = await getCarList({...this.searchForm});
                this.tableData = res.records || [];
                this.searchForm.total = res.total || 0;
            } catch (error) {
                console.error('获取车辆列表失败:', error);
            }
        },
        exportExcell() {

            // TODO: 实现导出功能
        },
        handleSizeChange(e) {
            this.searchForm.pageSize = e
            this.searchForm.pageSize = e;
            this.getList();
        },
        handleCurrentChange(e) {
            this.searchForm.page = e
            this.searchForm.pageCurr = e;
            this.getList();
        },
        handle(index, row) {
            // TODO: 实现详情查看功能
            console.log('查看详情:', row);
            this.$router.push({ path: '/car-detail', query: { id: row.id } });
        },
    }
}

 src/view/car-manage/service.js

New file
@@ -0,0 +1,32 @@
import axios from '@/utils/request';

// 获取车辆列表
export const getCarList = (data) => {
    console.log(data)
    return axios.get('/system/car/getCarList', {params:data})
}

//获取获取车辆类型
export const getCarType = (data) => {
    return axios.get('/system/car/getCarTypeList', data) 
}

//获取车辆详情
export const getCarDetail = (data) => {
    return axios.get(`/system/car/getCarInfo/${data.id}`, data)
}

//获取车辆详情订单数据
export const getCarOrder = (data) => {
    return axios.get(`/system/order/getOrderList`, {params:data})  
}

//获取车辆详情预警数据
export const getCarWarning = (data) => {
    return axios.get(`/system/warn/getCarWarnList`, {params:data})
}

//获取车辆详情行程轨迹
export const getCarTrack = (data) => {
    return axios.get(`/system/car/getCarTravel`, {params:data}) 
}

 src/view/complaint/index.vue

@@ -3,24 +3,19 @@
        <div class="form flex a-center j-between mt--23">
            <div class="form-left ml--30">
                <el-form :inline="true" :model="searchForm" class="demo-form-inline">
                    <el-form-item label="预警类型:" prop="type" class="unset_m" style="margin-right: 15px;">
                        <el-select :popper-append-to-body="false" v-model="searchForm.type" placeholder="请选择">
                            <el-option label="全部" value=""></el-option>
                            <el-option label="预警" value="1"></el-option>
                            <el-option label="报警" value="2"></el-option>
                        </el-select>
                    <el-form-item label="投诉人电话:" prop="complainPhone" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.complainPhone" placeholder="请输入"></el-input></el-form-item>
                    <el-form-item label="车辆号牌:" prop="vehicleNumber" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.vehicleNumber" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="车辆号牌:" prop="level" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.level" placeholder="请输入"></el-input>
                    <el-form-item label="驾驶员姓名:" prop="driverName" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.driverName" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="驾驶员姓名:" prop="name" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.name" placeholder="请输入"></el-input>
                    <el-form-item label="公司名称:" prop="enterpriseName" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.enterpriseName" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="公司名称:" prop="companyName" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.companyName" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="预警时间:" prop="date" class="unset_m" style="margin-right: 15px;">
                        <el-date-picker :append-to-body="false" v-model="searchForm.date" type="daterange"
                    <el-form-item label="投诉时间:" prop="selectTime" class="unset_m" style="margin-right: 15px;">
                        <el-date-picker :append-to-body="false" v-model="searchForm.selectTime" type="daterange"
                            range-separator=" " start-placeholder="开始日期" end-placeholder="结束日期">
                        </el-date-picker>
                    </el-form-item>
@@ -40,74 +35,101 @@
                @click="exportExcell">导出</el-button>
        </div>
        <div class="table-box ml--30 mt--23 mr--30">
            <el-table :data="tableData" border stripe style="width: 100%">
                <el-table-column prop="date" label="序号"></el-table-column>
                <el-table-column prop="name" label="车辆名称"></el-table-column>
                <el-table-column prop="name" label="车牌号码"></el-table-column>
                <el-table-column prop="name" label="投诉内容"></el-table-column>
                <el-table-column prop="name" label="投诉人电话"></el-table-column>
                <el-table-column prop="name" label="被投诉所属公司"></el-table-column>
                <el-table-column prop="name" label="被投诉驾驶员"></el-table-column>
                <el-table-column prop="name" label="投诉时间"></el-table-column>
                <el-table-column prop="name" label="操作">
                    <template slot-scope="scope">
                        <el-button type="text" @click="handle(scope.$index, scope.row)">处理</el-button>
            <el-table :data="tableData" border stripe style="width: 100%" :height="height" :element-loading-text="'正在加载...'">
                <el-table-column type="index" width="55" label="序号"></el-table-column>
                <el-table-column prop="carName" label="车辆名称"></el-table-column>
                <el-table-column prop="vehicleNumber" label="车牌号码"></el-table-column>
                <el-table-column prop="content" label="投诉内容"></el-table-column>
                <el-table-column prop="complainPhone" label="投诉人电话"></el-table-column>
                <el-table-column prop="enterpriseName" label="被投诉所属公司"></el-table-column>
                <el-table-column prop="driverName" label="被投诉驾驶员"></el-table-column>
                <el-table-column prop="complainTime" label="投诉时间"></el-table-column>
                <el-table-column prop="treatmentState" label="处理状态"></el-table-column>
                <el-table-column prop="treatmentUser" label="处理人"></el-table-column>
                <el-table-column prop="treatmentTime" label="处理时间"></el-table-column>
                <el-table-column prop="treatmentRemark" label="处理描述"></el-table-column>
                <!-- <el-table-column label="操作">
                    <template #default="{ row }">
                        <el-button v-if="row.treatmentState == '未处理'" type="text" @click="handle(row)">处理</el-button>
                    </template>
                </el-table-column>
</el-table-column> -->
            </el-table>

            <div class="pagination-box relative mt--23 flex j-end">
                <el-pagination 
                    :popper-append-to-body="false"
                    popper-class="pagination-popper"
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="searchForm.page"
                    background
                    layout="total,sizes,prev, pager, next,jumper"
                <el-pagination :popper-append-to-body="false" popper-class="pagination-popper"
                    @size-change="handleSizeChange" @current-change="handleCurrentChange"
                    :current-page="searchForm.page" background layout="total,sizes,prev, pager, next,jumper"
                    :total="searchForm.total">
                </el-pagination>
            </div>
        </div>



    </div>
</template>

<script>
import { search } from 'core-js/fn/symbol';
import { getComplainList } from './service'
import { exportExcell } from '@/utils/utils'

export default {
    data() {
        return {
            searchForm: {
                date: '',
                type: '',
                level: '',
                name: '',
                companyName: '',
                total: 40,
                total: 0,
                page: 1,
                pageSize: 10
            },
            tableData: [],
        };
    },
    computed: {
        height() {
            return this.$baseTableHeight()
        },
    },
    created() {
        this.getTableList()
    },
    methods: {
        reset() {
            this.searchForm = {
                total: 0,
                page: 1,
                pageSize: 10
            }
            this.getTableList()
        },
        search() {

            this.getTableList()
        },
        exportExcell() {

            let obj = { ...this.searchForm }
            delete obj.total
            if (obj.selectTime) {
                obj.startTime = moment(obj.selectTime[0]).format('YYYY-MM-DD HH-mm-ss')
                obj.endTime = moment(obj.selectTime[1]).format('YYYY-MM-DD HH-mm-ss')
                delete obj.selectTime
            }
            exportExcell('投诉记录导出', obj, '/system/complain/exportComplainList')
        },
        handleSizeChange(e) {
            this.searchForm.pageSize = e
            this.getTableList()
        },
        handleCurrentChange(e) {
            this.searchForm.page = e
            this.getTableList()
        },
        getTableList() {
            let obj = { ...this.searchForm }
            delete obj.total
            if (obj.selectTime) {
                obj.startTime = moment(obj.selectTime[0]).format('YYYY-MM-DD HH-mm-ss')
                obj.endTime = moment(obj.selectTime[1]).format('YYYY-MM-DD HH-mm-ss')
                delete obj.selectTime
            }
            getComplainList(obj).then(res => {
                this.tableData = res.records
                this.searchForm.total = res.total
            })
        },
    }
}
@@ -116,12 +138,9 @@
<style scoped lang="less">
::v-deep .pagination-popper {
    position: fixed !important;
    transform: 
        scale(calc(1 / var(--scale))) 
        translate(
            calc(100px * (1 - 1 / var(--scale))), 
            calc(5px * (1 - 1 / var(--scale)))
        ) !important;
    transform:
        scale(calc(1 / var(--scale))) translate(calc(100px * (1 - 1 / var(--scale))),
            calc(5px * (1 - 1 / var(--scale)))) !important;
    transform-origin: right top !important;
    right: calc(30px * (1 - 1 / var(--scale))) !important;
    margin-top: 5px;

 src/view/complaint/service.js

New file
@@ -0,0 +1,11 @@
import axios from '@/utils/request';

// 获取司机详情
export const getDriverInfo = (id) => {
    return axios.get(`/system/driver/getDriverInfo/{id}/${id}`)
}

// 获取投诉记录列表
export const getComplainList = (params) => {
    return axios.get(`/system/complain/getComplainList`, { params })
}

 src/view/early-warning/index.vue

@@ -2,40 +2,52 @@
    <div>

        <div class="form flex a-center j-between mt--23">

            <div class="form-left ml--30">

                <el-form :inline="true" :model="searchForm" class="demo-form-inline">

                    <el-form-item label="预警类型:" prop="type" class="unset_m" style="margin-right: 15px;">

                        <el-select :popper-append-to-body="false" v-model="searchForm.type" placeholder="请选择">

                            <el-option label="全部" value=""></el-option>

                            <el-option label="预警" value="1"></el-option>

                            <el-option label="报警" value="2"></el-option>

                <el-form :inline="true" :model="queryForm" class="demo-form-inline">

                    <el-form-item label="预警类型:" prop="warnType" class="unset_m" style="margin-right: 15px;">

                        <el-select :popper-append-to-body="false" v-model="queryForm.warnType" placeholder="请选择">

                            <el-option label="超速报警" value="超速报警"></el-option>

                            <el-option label="疲劳驾驶报警" value="疲劳驾驶报警"></el-option>

                            <el-option label="紧急报警" value="紧急报警"></el-option>

                            <el-option label="进入指定区域报警" value="进入指定区域报警"></el-option>

                            <el-option label="离开指定区域报警" value="离开指定区域报警"></el-option>

                            <el-option label="路段堵塞报警" value="路段堵塞报警"></el-option>

                            <el-option label="危险路段报警" value="危险路段报警"></el-option>

                            <el-option label="越界报警" value="越界报警"></el-option>

                            <el-option label="盗警" value="盗警"></el-option>

                            <el-option label="劫警" value="劫警"></el-option>

                            <el-option label="偏离路线报警" value="偏离路线报警"></el-option>

                            <el-option label="车辆移动报警" value="车辆移动报警"></el-option>

                            <el-option label="超时驾驶报警" value="超时驾驶报警"></el-option>

                            <el-option label="其他报警" value="其他报警"></el-option>

                        </el-select>

                    </el-form-item>

                    <el-form-item label="车辆号牌:" prop="level" class="unset_m" style="margin-right: 15px;">

                        <el-input v-model="searchForm.level" placeholder="请输入"></el-input>

                    <el-form-item label="车辆号牌:" prop="vehicleNumber" class="unset_m" style="margin-right: 15px;">

                        <el-input v-model="queryForm.vehicleNumber" placeholder="请输入"></el-input>

                    </el-form-item>

                    <el-form-item label="驾驶员姓名:" prop="name" class="unset_m" style="margin-right: 15px;">

                        <el-input v-model="searchForm.name" placeholder="请输入"></el-input>

                    <el-form-item label="驾驶员姓名:" prop="driverName" class="unset_m" style="margin-right: 15px;">

                        <el-input v-model="queryForm.driverName" placeholder="请输入"></el-input>

                    </el-form-item>

                    <el-form-item label="公司名称:" prop="companyName" class="unset_m" style="margin-right: 15px;">

                        <el-input v-model="searchForm.companyName" placeholder="请输入"></el-input>

                    <el-form-item label="公司名称:" prop="enterpriseName" class="unset_m" style="margin-right: 15px;">

                        <el-input v-model="queryForm.enterpriseName" placeholder="请输入"></el-input>

                    </el-form-item>

                    <el-form-item label="预警时间:" prop="date" class="unset_m" style="margin-right: 15px;">

                        <el-date-picker :append-to-body="false" v-model="searchForm.date" type="daterange"

                        <el-date-picker :append-to-body="false" v-model="queryForm.date" type="daterange"

                            range-separator=" " start-placeholder="开始日期" end-placeholder="结束日期">

                        </el-date-picker>

                    </el-form-item>

                    <el-form-item label="处理类型:" prop="type" class="unset_m" style="margin-right: 15px;">

                        <el-select :popper-append-to-body="false" v-model="searchForm.type" placeholder="请选择">

                            <el-option label="全部" value=""></el-option>

                            <el-option label="预警" value="1"></el-option>

                            <el-option label="报警" value="2"></el-option>

                    <el-form-item label="处理类型:" prop="treatmentState" class="unset_m" style="margin-right: 15px;">

                        <el-select :popper-append-to-body="false" v-model="queryForm.treatmentState" placeholder="请选择">

                            <el-option label="处理中" value="处理中"></el-option>

                            <el-option label="已处理完毕" value="已处理完毕"></el-option>

                            <el-option label="不作处理" value="不作处理"></el-option>

                            <el-option label="将来处理" value="将来处理"></el-option>

                        </el-select>

                    </el-form-item>

                </el-form>

            </div>

            <div class="form-right mr--24 mb--22 shrink0">

                <el-button class="search-button h--40 w--90 fs--14" icon="el-icon-search" type="primary" size="small"

                    @click="search">查询</el-button>

                    @click="fetchData">查询</el-button>

                <el-button @click="reset" icon="el-icon-refresh-right" class="reset-button h--40 w--90 fs--14"

                    size="small">重置</el-button>

            </div>

@@ -44,61 +56,65 @@


        <div class="table-box-btn mt--23 ml--30">

            <el-button class="search-button h--40 w--90 fs--14" icon="el-icon-top" type="primary" size="small"

                @click="exportExcell">导出</el-button>

                @click="exportExc">导出</el-button>

        </div>

        <div class="table-box ml--30 mt--23 mr--30">

            <el-table :data="tableData" border stripe style="width: 100%">

            <el-table :data="list" border stripe style="width: 100%" v-loading="listLoading">

                <!-- 固定前三列 -->

                <el-table-column prop="date" label="序号" fixed="left"></el-table-column>

                <el-table-column prop="name" label="车辆名称" fixed="left"></el-table-column>

                <el-table-column prop="name" label="车牌号码" fixed="left"></el-table-column>

                <el-table-column prop="date" label="序号" fixed="left" type="index" width="50"></el-table-column>

                <el-table-column prop="carName" label="车辆名称" fixed="left"></el-table-column>

                <el-table-column prop="vehicleNumber" label="车牌号码" fixed="left"></el-table-column>

                <!-- 其余列不固定，可滚动 -->

                <el-table-column prop="name" label="近15分钟情况"></el-table-column>

                <el-table-column prop="name" label="驾驶员名称"></el-table-column>

                <el-table-column prop="name" label="所属公司"></el-table-column>

                <el-table-column prop="name" label="终端编号"></el-table-column>

                <el-table-column prop="name" label="开始报警时间"></el-table-column>

                <el-table-column prop="name" label="结束报警时间"></el-table-column>

                <el-table-column prop="name" label="持续时长"></el-table-column>

                <el-table-column prop="name" label="持续里程数"></el-table-column>

                <el-table-column prop="name" label="报警类型"></el-table-column>

                <el-table-column prop="name" label="报警等级"></el-table-column>

                <el-table-column prop="name" label="报警次数"></el-table-column>

                <el-table-column prop="name" label="报警来源"></el-table-column>

                <el-table-column prop="name" label="处理状态"></el-table-column>

                <el-table-column prop="name" label="处理人"></el-table-column>

                <el-table-column prop="name" label="处理时间"></el-table-column>

                <el-table-column prop="name" label="处理描述"></el-table-column>

                <el-table-column prop="name" label="近15分钟情况">

                    <template #default="{ row }">

                        <img src="@/assets/homeImg/eye-fill.png" alt="" @click="viewDetail(row)"

                            style="width: 30px;cursor: pointer;">

                    </template>

                </el-table-column>

                <el-table-column prop="driverName" label="驾驶员名称"></el-table-column>

                <el-table-column prop="enterpriseName" label="所属公司"></el-table-column>

                <el-table-column prop="terminalNumber" label="终端编号"></el-table-column>

                <el-table-column prop="startTime" label="开始报警时间"></el-table-column>

                <el-table-column prop="endTime" label="结束报警时间"></el-table-column>

                <el-table-column prop="keepTime" label="持续时长"></el-table-column>

                <el-table-column prop="keepDistance" label="持续里程数"></el-table-column>

                <el-table-column prop="warnType" label="报警类型"></el-table-column>

                <el-table-column prop="warnLevel" label="报警等级"></el-table-column>

                <el-table-column prop="warnNumber" label="报警次数"></el-table-column>

                <el-table-column prop="warnSource" label="报警来源"></el-table-column>

                <el-table-column prop="treatmentState" label="处理状态"></el-table-column>

                <el-table-column prop="treatmentUser" label="处理人"></el-table-column>

                <el-table-column prop="treatmentTime" label="处理时间"></el-table-column>

                <el-table-column prop="treatmentRemark" label="处理描述"></el-table-column>

            </el-table>

            <div class="pagination-box relative mt--23 flex j-end">

                <el-pagination :popper-append-to-body="false" @size-change="handleSizeChange"

                    @current-change="handleCurrentChange" :current-page="searchForm.page" background

                    layout="total,sizes,prev, pager, next,jumper" :total="searchForm.total">

                    @current-change="handleCurrentChange" :current-page="queryForm.page" background

                    layout="total,sizes,prev, pager, next,jumper" :total="total">

                </el-pagination>

            </div>

            <el-drawer :visible.sync="drawer" append-to-body :size="450">

            <el-drawer :visible.sync="drawer" append-to-body :size="450" @close="closeDrawer">

                <div class="flex j-between a-center fs--20 pl--15 pr--15">

                    <!-- 使用 Tailwind CSS 的内联十六进制颜色类 -->

                    黑A03343D（5）<i class="el-icon-s-unfold color1 pointer"></i>

                    <div>{{ info.vehicleNumber }}<span v-if="info.warnList && info.warnList.length > 0">（{{info.warnList.length}}）</span></div><i @click="closeDrawer" class="el-icon-s-unfold color1 pointer"></i>

                </div>

                <hr class="mt--10" />

                <div class="pl--15 pr--15">

                    <div class="flex mt--15">

                        <div class="w--100 shrink0 color1">当前司机：</div>

                        <div class="color2">宫劲爆</div>

                        <div class="color2">{{ info.driverName }}</div>

                    </div>

                    <div class="flex mt--15">

                        <div class="w--100 shrink0 color1">当前车速：</div>

                        <div class="color2">22km/h</div>

                        <div class="color2">{{ info.speed }}km/h</div>

                    </div>

                    <div class="flex mt--15">

                        <div class="w--100 shrink0 color1">当前位置：</div>

                        <div class="color2">黑龙江哈尔滨市双城区双城镇团结大街441号和兴家园陈根村供电局住宅楼</div>

                        <div class="color2">{{ info.nowAddress }}</div>

                    </div>

                    <div class="flex mt--15">

                    <div v-if="info.imageUrl" class="flex mt--15">

                        <div class="w--100 shrink0 color1">抓拍照片：</div>

                        <el-image style="height: 100px" :src="require('@/assets/logo.png')"

                            :preview-src-list="[require('@/assets/logo.png')]">

                        <el-image style="height: 100px" :src="info.imageUrl" :preview-src-list="[info.imageUrl]">

                        </el-image>

                    </div>

                </div>

@@ -108,46 +124,38 @@
                </div>

                <div class="block pl--15 pr--15 mt--15">

                    <el-timeline>

                        <el-timeline-item color='#0E6EFD' timestamp="2018/4/12" placement="top">

                            <el-card class="pointer">

                                <h4>视频信号遮挡报警</h4>

                                <p class="color1">22km/h</p>

                            </el-card>

                        </el-timeline-item>

                        <el-timeline-item timestamp="2018/4/3" placement="top" color='#0E6EFD'>

                            <el-card class="pointer">

                                <h4>视频信号遮挡报警</h4>

                                <p class="color1">22km/h</p>

                            </el-card>

                        </el-timeline-item>

                        <el-timeline-item color='#0E6EFD' timestamp="2018/4/2" placement="top">

                            <el-card class="pointer">

                                <h4>视频信号遮挡报警</h4>

                                <p class="color1">22km/h</p>

                            </el-card>

                        <el-timeline-item v-for="(item, index) in info.warnList" :key="index" color='#0E6EFD'

                            :timestamp="item.warnTime" placement="top">

                            <div @click="initMap(item)">

                                <el-card class="pointer">

                                    <h4>{{ item.warnType }}</h4>

                                    <p class="color1">{{ item.speed }}km/h</p>

                                </el-card>

                            </div>



                        </el-timeline-item>

                    </el-timeline>

                </div>

                <div class="fixed">

                <div v-if="showWarnDetail" class="fixed">

                    <div class="card">

                        <div class="title fs--18 color2">视频信号遮挡报警</div>

                        <div id="mapContainer"></div>

                        <div class="">

                            <div class="flex mt--15">

                                <div class="w--100 shrink0 color1">司机：</div>

                                <div class="color2">宫劲爆</div>

                                <div class="color2">{{ info.driverName }}</div>

                            </div>

                            <div class="flex mt--15">

                                <div class="w--100 shrink0 color1">车速：</div>

                                <div class="color2">22km/h</div>

                                <div class="color2">{{ activeInfo.speed }}km/h</div>

                            </div>

                            <div class="flex mt--15">

                                <div class="w--100 shrink0 color1">时间：</div>

                                <div class="color2">2024-08-08 14:52:51</div>

                                <div class="color2">{{ activeInfo.warnTime }}</div>

                            </div>

                            <div class="flex mt--15">

                                <div class="w--100 shrink0 color1">地点：</div>

                                <div class="color2">黑龙江哈尔滨市双城区双城镇团结大街441号和兴家园陈根村供电局住宅楼</div>

                                <div class="color2">{{ activeInfo.address }}</div>

                            </div>



                        </div>

@@ -162,69 +170,115 @@
</template>



<script>

import { search } from 'core-js/fn/symbol';

import AMapLoader from "@amap/amap-jsapi-loader";

import { getList, getDetail } from './service'

import moment from 'moment'

import { exportExcell } from '@/utils/utils.js'



export default {

    data() {

        return {

            drawer: true,

            searchForm: {

                date: '',

                type: '',

                level: '',

                name: '',

                companyName: '',

                total: 40,

                page: 1,

            drawer: false,

            queryForm: {

                pageCurr: 1,

                pageSize: 10

            },

            tableData: [],

            listLoading: false,

            list: [],

            total: 0,

            info: {},

            showWarnDetail: false,

            activeInfo: {}

        };

    },

    mounted() {

        this.initMap()



    created() {

        this.fetchData()

    },

    methods: {

        // 初始化地图

        initMap() {

            window._AMapSecurityConfig = {

                securityJsCode: "37ce61ae86efa5ad82b649a277f5097c",

            };

            AMapLoader.load({

                key: "67968c82f27c7e2cb9f40c1a9aa3042b",

                version: "2.0",

                plugins: [

                    "AMap.ToolBar",

                    "AMap.AutoComplete",

                    "AMap.Geocoder",

                    "AMap.MarkerCluster",

                ],

        closeDrawer() {

            this.drawer = false

            this.showWarnDetail = false

        },

        // 查看详情

        viewDetail(row) {

            this.drawer = true

            getDetail({ vehicleNumber: row.vehicleNumber }).then(res => {

                this.info = res

            })

                .then((AMap) => {

                    this.map = new AMap.Map("mapContainer", {

                        center: [105.574542, 30.5061493],

                        zoom: 15,

                    });

        },

        async fetchData() {

            let params = JSON.parse(JSON.stringify(this.queryForm))

            if (params.date) {

                params.startTime = moment(params.date[0]).format('YYYY-MM-DD')

                params.endTime = moment(params.date[1]).format('YYYY-MM-DD')

                delete params.date

            }

            this.listLoading = true

            const { records, total } = await getList(params)

            this.list = records

            this.total = total

            this.listLoading = false

        },

        // 初始化地图

        initMap(row) {

            this.showWarnDetail = true

            this.activeInfo = row

            this.$nextTick(() => {

                window._AMapSecurityConfig = {

                    securityJsCode: "37ce61ae86efa5ad82b649a277f5097c",

                };

                AMapLoader.load({

                    key: "67968c82f27c7e2cb9f40c1a9aa3042b",

                    version: "2.0",

                    plugins: [

                        "AMap.ToolBar",

                        "AMap.AutoComplete",

                        "AMap.Geocoder",

                        "AMap.MarkerCluster",

                    ],

                })

                .catch((e) => {

                    console.log(e);

                });

                    .then((AMap) => {

                        this.map = new AMap.Map("mapContainer", {

                            center: [row.lon, row.lat],

                            zoom: 15,

                        });

                        
                        // 添加标记

                        new AMap.Marker({

                            position: [row.lon, row.lat],

                            map: this.map,

                            title: row.warnType

                        });

                    })

                    .catch((e) => {

                        console.log(e);

                    });

            })

        },

        reset() {

            this.queryForm = {

                pageCurr: 1,

                pageSize: 10

            }

            this.fetchData()

        },

        search() {



        },

        exportExcell() {



        exportExc() {

            let params = JSON.parse(JSON.stringify(this.queryForm))

            if (params.date) {

                params.startTime = moment(params.date[0]).format('YYYY-MM-DD')

                params.endTime = moment(params.date[1]).format('YYYY-MM-DD')

                delete params.date

            }

            exportExcell('预警列表',params,'/system/warn/exportCarWarnList')

        },

        handleSizeChange(e) {

            this.searchForm.pageSize = e

            this.queryForm.pageSize = e

        },

        handleCurrentChange(e) {

            this.searchForm.page = e

            this.queryForm.page = e

        },

    }

}


 src/view/early-warning/service.js

New file
@@ -0,0 +1,11 @@
import axios from '@/utils/request';

// 获取车辆预警列表数据
export const getList = (params) => {
    return axios.get('/system/warn/getCarWarnList', {params})
}

// 获取车辆预警详情
export const getDetail = (params) => {
    return axios.get('/system/warn/getCarWarnInfo', {params})
}

 src/view/order/component/detailModal.vue

@@ -9,21 +9,21 @@
            <!-- 订单信息 -->
            <div v-show="tabPosition == 'order'">
                <el-descriptions title="" :column="3">
                    <el-descriptions-item label="公司名称">射洪洪达出租车有限公司</el-descriptions-item>
                    <el-descriptions-item label="发起地区划">91510922769973987B</el-descriptions-item>
                    <el-descriptions-item label="订单编号">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                    <el-descriptions-item label="机动车驾驶证编号">射洪洪达出租车有限公司</el-descriptions-item>
                    <el-descriptions-item label="驾驶员手机号">91510922769973987B</el-descriptions-item>
                    <el-descriptions-item label="车辆号牌">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                    <el-descriptions-item label="派单时间">射洪洪达出租车有限公司</el-descriptions-item>
                    <el-descriptions-item label="订单发起时间">91510922769973987B</el-descriptions-item>
                    <el-descriptions-item label="乘客备注">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                    <el-descriptions-item label="出发地点">射洪洪达出租车有限公司</el-descriptions-item>
                    <el-descriptions-item label="下车地点">91510922769973987B</el-descriptions-item>
                    <el-descriptions-item label="运价类型编号">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                    <el-descriptions-item label="订单金额">射洪洪达出租车有限公司</el-descriptions-item>
                    <el-descriptions-item label="实付价">91510922769973987B</el-descriptions-item>
                    <el-descriptions-item label="支付方式">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                    <el-descriptions-item label="公司名称">{{ orderData.enterpriseName }}</el-descriptions-item>
                    <el-descriptions-item label="发起地区划">{{ orderData.drivingLicenseNumber }}</el-descriptions-item>
                    <el-descriptions-item label="订单编号">{{ orderData.code }}</el-descriptions-item>
                    <el-descriptions-item label="机动车驾驶证编号">{{ orderData.drivingLicenseNumber }}</el-descriptions-item>
                    <el-descriptions-item label="驾驶员手机号">{{ orderData.driverPhone }}</el-descriptions-item>
                    <el-descriptions-item label="车辆号牌">{{ orderData.vehicleNumber }}</el-descriptions-item>
                    <el-descriptions-item label="派单时间">{{ orderData.orderDeliveryTime }}</el-descriptions-item>
                    <el-descriptions-item label="订单发起时间">{{ orderData.orderTime }}</el-descriptions-item>
                    <el-descriptions-item label="乘客备注">{{ orderData.remark }}</el-descriptions-item>
                    <el-descriptions-item label="出发地点">{{ orderData.orderPlace }}</el-descriptions-item>
                    <el-descriptions-item label="下车地点">{{ orderData.dropOffPoint }}</el-descriptions-item>
                    <el-descriptions-item label="运价类型编号">{{ orderData.tariffType }}</el-descriptions-item>
                    <el-descriptions-item label="订单金额">￥{{ orderData.orderAmount }}</el-descriptions-item>
                    <el-descriptions-item label="实付价">￥{{ orderData.paymentAmount }}</el-descriptions-item>
                    <el-descriptions-item label="支付方式">{{ orderData.paymentMode }}</el-descriptions-item>
                </el-descriptions>
            </div>
            <!-- 行程轨迹 -->
@@ -43,15 +43,22 @@
        return {
            dialogVisible: false,
            tabPosition: 'order',
            orderData: {},
            monitoringData: {},
            travelData: []
        };
    },
    computed: {},
    watch: {},
    created() { },
    mounted() {
        this.initMap();
    },
    methods: {
        initData(orderData = {}, monitoringData = {}, travelData = {},) {
            this.orderData = orderData
            this.monitoringData = monitoringData
            this.travelData = travelData
            this.dialogVisible = true
            this.initMap();
        },
        initMap() {
            window._AMapSecurityConfig = {
                securityJsCode: this.$secretKey,
@@ -65,22 +72,19 @@
            })
                .then((AMap) => {
                    this.map = new AMap.Map("mapContainer", {
                        center: [105.574542, 30.5061493],
                        center: [this.travelData[this.travelData.length / 2].longitude, this.travelData[this.travelData.length / 2].latitude],
                        zoom: 15,
                    });
                    this.map.addControl(new AMap.ToolBar());
                    let path = [
                        new AMap.LngLat(105.57, 30.51),
                        new AMap.LngLat(116.382122, 39.901176),
                        new AMap.LngLat(116.387271, 39.912501),
                        new AMap.LngLat(116.398258, 39.9046),
                    ]
                    let path = this.travelData.map(item => {
                        return new AMap.LngLat(item.longitude, item.latitude)
                    })
                    const content = `<div class="custom-content-marker">
                                        <img src="${require("@/assets/logo.png")}">
                                    </div>`;
                    const marker = new AMap.Marker({
                        content: content, //自定义点标记覆盖物内容
                        position: [105.57, 30.51], //基点位置
                        position: [this.travelData[0].longitude, this.travelData[0].latitude], //基点位置
                        offset: new AMap.Pixel(-30, -15), //相对于基点的偏移位置
                    });
                    this.map.add(marker);

 src/view/order/index.vue

@@ -2,35 +2,37 @@
    <div>
        <div class="form flex a-center j-between mt--23">
            <div class="form-left ml--30">
                <el-form :inline="true" :model="searchForm" class="demo-form-inline">
                    <el-form-item label="派单时间:" prop="level" class="unset_m" style="margin-right: 100px;">
                        <el-date-picker style="width: 400px;" v-model="value1" type="datetimerange" range-separator="至"
                            start-placeholder="开始日期" end-placeholder="结束日期">
                <el-form :inline="true" :model="searchForm">
                    <el-form-item label="派单时间:" prop="orderDeliveryTime" style="margin-right: 100px;">
                        <el-date-picker style="width: 400px;" v-model="searchForm.orderDeliveryTime"
                            type="datetimerange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
                        </el-date-picker>
                    </el-form-item>
                    <el-form-item label="订单编号:" prop="name" class="unset_m" style="margin-right: 100px;">
                        <el-input v-model="searchForm.name" placeholder="请输入"></el-input>
                    <el-form-item label="订单编号:" prop="code" style="margin-right: 100px;">
                        <el-input v-model="searchForm.code" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="车辆号牌:" prop="name" class="unset_m" style="margin-right: 100px;">
                        <el-input v-model="searchForm.name" placeholder="请输入"></el-input>
                    <el-form-item label="车辆号牌:" prop="vehicleNumber" style="margin-right: 100px;">
                        <el-input v-model="searchForm.vehicleNumber" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="驾驶员姓名:" prop="date" class="unset_m" style="margin-right: 100px;">
                        <el-input v-model="searchForm.name" placeholder="请输入"></el-input>
                    <el-form-item label="驾驶员姓名:" prop="driverName" style="margin-right: 100px;">
                        <el-input v-model="searchForm.driverName" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="公司名称:" prop="date" class="unset_m" style="margin-right: 100px;">
                        <el-input class="companyName" v-model="searchForm.name" placeholder="请输入"></el-input>
                    <el-form-item label="公司名称:" prop="enterpriseName" style="margin-right: 100px;">
                        <el-input class="companyName" v-model="searchForm.enterpriseName" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="上车地点:" prop="date" class="unset_m" style="margin-right: 100px;">
                        <el-input v-model="searchForm.name" placeholder="请输入"></el-input>
                    <el-form-item label="上车地点:" prop="boardingPoint" style="margin-right: 100px;">
                        <el-input v-model="searchForm.boardingPoint" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="下车地点:" prop="date" class="unset_m" style="margin-right: 100px;">
                        <el-input v-model="searchForm.name" placeholder="请输入"></el-input>
                    <el-form-item label="下车地点:" prop="dropOffPoint" style="margin-right: 100px;">
                        <el-input v-model="searchForm.dropOffPoint" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="里程范围:" prop="date" class="unset_m" style="margin-right: 100px;">
                    <el-form-item label="里程范围:" style="margin-right: 100px;">
                        <div class="flex a-center j-between">
                            <el-input class="range" v-model="searchForm.name" placeholder="请输入"></el-input>
                            <el-input class="range" v-model="searchForm.passengerMileageStart"
                                placeholder="请输入"></el-input>
                            <div class="mx--20">-</div>
                            <el-input class="range" v-model="searchForm.name" placeholder="请输入"></el-input>
                            <el-input class="range" v-model="searchForm.passengerMileageEnd"
                                placeholder="请输入"></el-input>
                        </div>
                    </el-form-item>
                </el-form>
@@ -47,22 +49,27 @@
                @click="exportExcell">导出</el-button>
        </div>
        <div class="table-box ml--30 mt--23 mr--30">
            <el-table :data="tableData" border stripe style="width: 100%" :height="height">
                <el-table-column prop="date" label="序号"></el-table-column>
                <el-table-column prop="name" label="订单编号"></el-table-column>
                <el-table-column prop="name" label="车牌号"></el-table-column>
                <el-table-column prop="name" label="车牌颜色"></el-table-column>
                <el-table-column prop="name" label="车辆所属公司"></el-table-column>
                <el-table-column prop="name" label="上车地点"></el-table-column>
                <el-table-column prop="name" label="下车地点"></el-table-column>
                <el-table-column prop="name" label="载客里程"></el-table-column>
                <el-table-column prop="name" label="驾驶员名称"></el-table-column>
                <el-table-column prop="name" label="驾驶员电话"></el-table-column>
                <el-table-column prop="name" label="派单时间"></el-table-column>
                <el-table-column prop="name" label="订单金额"></el-table-column>
                <el-table-column prop="name" label="操作">
                    <template slot-scope="scope">
                        <el-button @click="showDetail">详情</el-button>
            <el-table :data="tableData" border stripe style="width: 100%" :height="height"
                :element-loading-text="'正在加载...'">
                <el-table-column type="index" width="55" label="序号" />
                <el-table-column prop="code" label="订单编号" />
                <el-table-column prop="vehicleNumber" label="车牌号" />
                <el-table-column prop="licensePlateColor" label="车牌颜色" />
                <el-table-column prop="enterpriseName" label="车辆所属公司" />
                <el-table-column prop="orderPlace" label="上车地点" />
                <el-table-column prop="dropOffPoint" label="下车地点" />
                <el-table-column prop="passengerMileage" label="载客里程" />
                <el-table-column prop="driverName" label="驾驶员名称" />
                <el-table-column prop="driverPhone" label="驾驶员电话" />
                <el-table-column prop="orderDeliveryTime" label="派单时间" />
                <el-table-column prop="orderAmount" label="订单金额">
                    <template #default="{ row }">
                        ￥{{ row.orderAmount }}
                    </template>
                </el-table-column>
                <el-table-column label="操作">
                    <template #default="{ row }">
                        <el-button @click="showDetail(row)">详情</el-button>
                    </template>
                </el-table-column>
            </el-table>
@@ -80,6 +87,8 @@
<script>
import DetailModal from "./component/detailModal"
import { exportExcell } from '@/utils/utils'
import { getOrderList, getOrderInfo, getOrderMonitoring, getOrderTravel } from './service'
import moment from "moment/moment";

export default {
    components: {
@@ -100,23 +109,57 @@
            return this.$baseTableHeight()
        },
    },
    created() {
        this.getTableList()
    },
    methods: {
        showDetail() {
            this.$refs.detailModal.dialogVisible = true
        },
        reset() {
            this.searchForm = {
                total: 0,
                page: 1,
                pageSize: 10
            }
            this.getTableList()
        },
        search() {

            this.getTableList()
        },
        exportExcell() {

            let obj = { ...this.searchForm }
            delete obj.total
            if (obj.orderDeliveryTime) {
                obj.orderDeliveryTimeStart = moment(obj.orderDeliveryTime[0]).format('YYYY-MM-DD HH-mm-ss')
                obj.orderDeliveryTimeEnd = moment(obj.orderDeliveryTime[1]).format('YYYY-MM-DD HH-mm-ss')
                delete obj.orderDeliveryTime
            }
            exportExcell('投诉记录导出', obj, '/system/order/exportOrderList')
        },
        handleSizeChange(e) {
            this.searchForm.pageSize = e
            this.getTableList()
        },
        handleCurrentChange(e) {
            this.searchForm.page = e
            this.getTableList()
        },
        getTableList() {
            let obj = { ...this.searchForm }
            delete obj.total
            if (obj.orderDeliveryTime) {
                obj.orderDeliveryTimeStart = moment(obj.orderDeliveryTime[0]).format('YYYY-MM-DD HH-mm-ss')
                obj.orderDeliveryTimeEnd = moment(obj.orderDeliveryTime[1]).format('YYYY-MM-DD HH-mm-ss')
                delete obj.orderDeliveryTime
            }
            getOrderList(obj).then(res => {
                this.tableData = res.records
                this.searchForm.total = res.total
            })
        },
        showDetail(row) {
            // Promise.all([getOrderInfo(row.id), getOrderMonitoring({ id: row.id }), getOrderTravel({ id: row.id })]).then(res => {
            Promise.all([getOrderInfo(row.id), getOrderTravel({ id: row.id })]).then(res => {
                this.$refs.detailModal.initData(res[0], {}, res[2])
            })
        },
    }
}

 src/view/order/service.js

New file
@@ -0,0 +1,21 @@
import axios from '@/utils/request';

// 获取订单详情
export const getOrderInfo = (id) => {
    return axios.get(`/system/order/getOrderInfo/${id}`)
}

// 获取订单列表
export const getOrderList = (params) => {
    return axios.get(`/system/order/getOrderList`, { params })
}

// 获取订单监控
export const getOrderMonitoring = (params) => {
    return axios.get(`/system/order/getOrderMonitoring`, { params })
}

// 获取订单行程轨迹
export const getOrderTravel = (params) => {
    return axios.get(`/system/order/getOrderTravel`, { params })
}

 src/view/playback/index.vue

@@ -6,31 +6,31 @@
                    <ul class="info-list">
                        <li class="flex">
                            <span class="label">公司名称：</span>
                            <span class="content">射洪宏达出租车</span>
                            <span class="content">{{ info.enterpriseName }}</span>
                        </li>
                        <li class="flex">
                            <span class="label">车牌号码：</span>
                            <span class="content">川J6F675F</span>
                            <span class="content">{{ info.vehicleNumber }}</span>
                        </li>
                        <li class="flex">
                            <span class="label">车牌颜色：</span>
                            <span class="content">颜色</span>
                            <span class="content">{{ info.licensePlateColor }}</span>
                        </li>
                        <li class="flex">
                            <span class="label">车辆营运类型：</span>
                            <span class="content">网约车</span>
                            <span class="content">{{ info.operateType }}</span>
                        </li>
                        <li class="flex">
                            <span class="label">经营区域：</span>
                            <span class="content">射洪市</span>
                            <span class="content">{{ info.operatingArea }}</span>
                        </li>
                        <li class="flex">
                            <span class="label">所属车主：</span>
                            <span class="content">王志强</span>
                            <span class="content">{{ info.driverName }}</span>
                        </li>
                        <li class="flex">
                            <span class="label">联系电话：</span>
                            <span class="content">18888888888</span>
                            <span class="content">{{ info.driverPhone }}</span>
                        </li>
                    </ul>
                    <hr />
@@ -58,16 +58,21 @@
</template>

<script>
import { getDetail } from './service'
export default {
    data() {
        return {
            info: {},
            video: null,
            startTime: '',
            endTime: ''
        }
    },
    mounted() {

    created() {
        getDetail(this.$route.query.id).then(res=>{
            console.log(res);
            this.info = res
        })
    }
}
</script>

 src/view/playback/service.js

New file
@@ -0,0 +1,6 @@
import axios from '@/utils/request';

// 获取车辆详情
export const getDetail = (id) => {
    return axios.get(`/system/car/getCarInfo/${id}`)
}

 src/view/systemManage/driver/component/detailModal.vue

@@ -2,45 +2,45 @@
    <div>
        <el-dialog title="驾驶员信息" :visible.sync="dialogVisible" width="50%" :modal-append-to-body="false">
            <el-descriptions title="" :column="2">
                <el-descriptions-item label="机动车驾驶员姓名">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="驾驶员婚姻状况">91510922769973987B</el-descriptions-item>
                <el-descriptions-item label="驾驶员性别">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                <el-descriptions-item label="出生日期">14725836902</el-descriptions-item>
                <el-descriptions-item label="驾驶员手机号">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="驾驶员民族">91510922769973987B</el-descriptions-item>
                <el-descriptions-item label="驾驶员通信地址">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                <el-descriptions-item label="驾驶员外语能力">14725836902</el-descriptions-item>
                <el-descriptions-item label="驾驶员学历">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="户口登记机关名称">91510922769973987B</el-descriptions-item>
                <el-descriptions-item label="户口地址或长住地址">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                <el-descriptions-item label="驾驶员合同（或协议）签署公司">14725836902</el-descriptions-item>
                <el-descriptions-item label="驾驶员照片文件编号">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="机动车驾驶证扫描文件编号">91510922769973987B</el-descriptions-item>
                <el-descriptions-item label="准驾车型">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                <el-descriptions-item label="初次领取驾驶证日期">14725836902</el-descriptions-item>
                <el-descriptions-item label="驾驶证有效期限起">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="驾驶证有效期限止">91510922769973987B</el-descriptions-item>
                <el-descriptions-item label="是否巡游出租汽车驾驶员">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                <el-descriptions-item label="资格证发证日期">14725836902</el-descriptions-item>
                <el-descriptions-item label="初次领取资格证日期">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="资格证有效起始日期">91510922769973987B</el-descriptions-item>
                <el-descriptions-item label="资格证有效截止日期">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                <el-descriptions-item label="驾驶员在平台的注册日期">14725836902</el-descriptions-item>
                <el-descriptions-item label="是否在驾驶员黑名单中">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="是否转职驾驶员">91510922769973987B</el-descriptions-item>
                <el-descriptions-item label="公司名称">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                <el-descriptions-item label="运营类型">14725836902</el-descriptions-item>
                <el-descriptions-item label="网约车驾驶员资格证号">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="网约车驾驶员证发证机构">91510922769973987B</el-descriptions-item>
                <el-descriptions-item label="合同（或协议）有效期起">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                <el-descriptions-item label="合同（或协议）有效期止">14725836902</el-descriptions-item>
                <el-descriptions-item label="国籍">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="紧急情况联系人">91510922769973987B</el-descriptions-item>
                <el-descriptions-item label="紧急情况联系人电话">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                <el-descriptions-item label="紧急情况联系人通讯地址">14725836902</el-descriptions-item>
                <el-descriptions-item label="状态">射洪洪达出租车有限公司</el-descriptions-item>
                <el-descriptions-item label="操作标识">91510922769973987B</el-descriptions-item>
                <el-descriptions-item label="更新时间">四川省遂宁市射洪市太和街道万洪二路33、35、37号</el-descriptions-item>
                <el-descriptions-item label="机动车驾驶员姓名">{{ data.name }}</el-descriptions-item>
                <el-descriptions-item label="驾驶员婚姻状况">{{ data.maritalStatus }}</el-descriptions-item>
                <el-descriptions-item label="驾驶员性别">{{ data.gender }}</el-descriptions-item>
                <el-descriptions-item label="出生日期">{{ data.birthday }}</el-descriptions-item>
                <el-descriptions-item label="驾驶员手机号">{{ data.phone }}</el-descriptions-item>
                <el-descriptions-item label="驾驶员民族">{{ data.nationality }}</el-descriptions-item>
                <el-descriptions-item label="驾驶员通信地址">{{ data.mailingAddress }}</el-descriptions-item>
                <el-descriptions-item label="驾驶员外语能力">{{ data.foreignLanguages }}</el-descriptions-item>
                <el-descriptions-item label="驾驶员学历">{{ data.education     }}</el-descriptions-item>
                <el-descriptions-item label="户口登记机关名称">{{ data.householdRegistrationAuthority }}</el-descriptions-item>
                <el-descriptions-item label="户口地址或长住地址">{{ data.domicile }}</el-descriptions-item>
                <el-descriptions-item label="驾驶员合同（或协议）签署公司">{{ data.contractingCompany }}</el-descriptions-item>
                <el-descriptions-item label="驾驶员照片文件编号">{{ data.claude }}</el-descriptions-item>
                <el-descriptions-item label="机动车驾驶证扫描文件编号">{{ data.drivingLicenceFile }}</el-descriptions-item>
                <el-descriptions-item label="准驾车型">{{ data.quasiDrivingType }}</el-descriptions-item>
                <el-descriptions-item label="初次领取驾驶证日期">{{ data.firstLicenseDate }}</el-descriptions-item>
                <el-descriptions-item label="驾驶证有效期限起">{{ data.drivingLicenceStart }}</el-descriptions-item>
                <el-descriptions-item label="驾驶证有效期限止">{{ data.drivingLicenceEnd }}</el-descriptions-item>
                <el-descriptions-item label="是否巡游出租汽车驾驶员">{{ data.cruiseTaxi }}</el-descriptions-item>
                <el-descriptions-item label="资格证发证日期">{{ data.certificationIssueDate     }}</el-descriptions-item>
                <el-descriptions-item label="初次领取资格证日期">{{ data.firstLicenseCertification }}</el-descriptions-item>
                <el-descriptions-item label="资格证有效起始日期">{{ data.certificationStart     }}</el-descriptions-item>
                <el-descriptions-item label="资格证有效截止日期">{{ data.certificationEnd }}</el-descriptions-item>
                <el-descriptions-item label="驾驶员在平台的注册日期">{{ data.registrationDate }}</el-descriptions-item>
                <el-descriptions-item label="是否在驾驶员黑名单中">{{ data.blacklist }}</el-descriptions-item>
                <el-descriptions-item label="是否专职驾驶员">{{ data.fullTimeDriver }}</el-descriptions-item>
                <el-descriptions-item label="公司名称">{{ data.contractingCompany }}</el-descriptions-item>
                <el-descriptions-item label="运营类型">{{ data.operationType }}</el-descriptions-item>
                <el-descriptions-item label="网约车驾驶员资格证号">{{ data.certification }}</el-descriptions-item>
                <el-descriptions-item label="网约车驾驶员证发证机构">{{ data.orgName }}</el-descriptions-item>
                <el-descriptions-item label="合同（或协议）有效期起">{{ data.contractLifeStart }}</el-descriptions-item>
                <el-descriptions-item label="合同（或协议）有效期止">{{ data.contractLifeEnd }}</el-descriptions-item>
                <el-descriptions-item label="国籍">{{ data.nation }}</el-descriptions-item>
                <el-descriptions-item label="紧急情况联系人">{{ data.emergencyContact }}</el-descriptions-item>
                <el-descriptions-item label="紧急情况联系人电话">{{ data.emergencyPhone }}</el-descriptions-item>
                <el-descriptions-item label="紧急情况联系人通讯地址">{{ data.emergencyMailingAddress }}</el-descriptions-item>
                <el-descriptions-item label="状态">{{ ['有效','无效'][data.status - 1] }}</el-descriptions-item>
                <el-descriptions-item label="操作标识">{{ ['新增','修改'][data.flag - 1] }}</el-descriptions-item>
                <el-descriptions-item label="更新时间">{{ data.updateTime }}</el-descriptions-item>
            </el-descriptions>
        </el-dialog>
    </div>
@@ -52,7 +52,8 @@
    props: {},
    data() {
        return {
            dialogVisible: false
            dialogVisible: false,
            data: {}
        };
    },
    computed: {},
@@ -60,6 +61,10 @@
    created() { },
    mounted() { },
    methods: {
        initData(data) {
            this.data = data
            this.dialogVisible = true
        },
        closeClick() {
            this.dialogVisible = false
        }

 src/view/systemManage/driver/index.vue

@@ -3,17 +3,17 @@
        <div class="form flex a-center j-between mt--23">
            <div class="form-left ml--30">
                <el-form :inline="true" :model="searchForm">
                    <el-form-item label="公司名称:" prop="level" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.level" placeholder="请输入"></el-input>
                    <el-form-item label="公司名称:" prop="enterpriseName" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.enterpriseName" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="驾驶员手机号:" prop="name" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.name" placeholder="请输入"></el-input>
                    <el-form-item label="驾驶员手机号:" prop="phone" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.phone" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="驾驶员姓名:" prop="name" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.name" placeholder="请输入"></el-input>
                    <el-form-item label="驾驶员姓名:" prop="driverName" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.driverName" placeholder="请输入"></el-input>
                    </el-form-item>
                    <el-form-item label="紧急联系人姓名:" prop="date" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.name" placeholder="请输入"></el-input>
                    <el-form-item label="紧急联系人姓名:" prop="emergencyContact" class="unset_m" style="margin-right: 15px;">
                        <el-input v-model="searchForm.emergencyContact" placeholder="请输入"></el-input>
                    </el-form-item>
                </el-form>
            </div>
@@ -25,19 +25,19 @@
            </div>
        </div>
        <div class="table-box ml--30 mt--23 mr--30">
            <el-table :data="tableData" border stripe style="width: 100%" :height="height">
                <el-table-column prop="date" label="序号"></el-table-column>
                <el-table-column prop="name" label="机动车驾驶员姓名"></el-table-column>
                <el-table-column prop="name" label="车辆所属公司"></el-table-column>
                <el-table-column prop="name" label="机动车驾驶证号"></el-table-column>
                <el-table-column prop="name" label="驾驶员通信地址"></el-table-column>
                <el-table-column prop="name" label="紧急情况联系人"></el-table-column>
                <el-table-column prop="name" label="紧急情况联系人电话"></el-table-column>
                <el-table-column prop="name" label="驾驶员手机号"></el-table-column>
                <el-table-column prop="name" label="驾驶员合同签订公司"></el-table-column>
                <el-table-column prop="name" label="操作">
                    <template slot-scope="{row}">
                        <el-button @click="showDetail">详情</el-button>
            <el-table :data="tableData" border stripe style="width: 100%" :height="height" :element-loading-text="'正在加载...'">
                <el-table-column type="index" width="55" label="序号"></el-table-column>
                <el-table-column prop="driverName" label="机动车驾驶员姓名"></el-table-column>
                <el-table-column prop="enterpriseName" label="车辆所属公司"></el-table-column>
                <el-table-column prop="drivingLicenseNumber" label="机动车驾驶证号"></el-table-column>
                <el-table-column prop="mailingAddress" label="驾驶员通信地址"></el-table-column>
                <el-table-column prop="emergencyContact" label="紧急情况联系人"></el-table-column>
                <el-table-column prop="emergencyPhone" label="紧急情况联系人电话"></el-table-column>
                <el-table-column prop="phone" label="驾驶员手机号"></el-table-column>
                <el-table-column prop="contractingCompany" label="驾驶员合同签订公司"></el-table-column>
                <el-table-column label="操作">
                    <template #default="{ row }">
                        <el-button @click="showDetail(row)">详情</el-button>
                    </template>
                </el-table-column>
            </el-table>
@@ -54,6 +54,7 @@

<script>
import DetailModal from "./component/detailModal"
import { getDriverInfo, getDriverList } from './service'

export default {
    components: {
@@ -74,20 +75,44 @@
            return this.$baseTableHeight()
        },
    },
    created() {
        this.getTableList()
    },
    methods: {
        showDetail() {
            this.$refs.detailModal.dialogVisible = true
        },
        reset() {
            this.searchForm = {
                total: 0,
                page: 1,
                pageSize: 10
            }
            this.getTableList()
        },
        search() {
            this.getTableList()
        },
        exportExcell() {

        },
        handleSizeChange(e) {
            this.searchForm.pageSize = e
            this.getTableList()
        },
        handleCurrentChange(e) {
            this.searchForm.page = e
            this.getTableList()
        },
        getTableList() {
            let obj = { ...this.searchForm }
            delete obj.total
            getDriverList(obj).then(res => {
                this.tableData = res.records
                this.searchForm.total = res.total
            })
        },
        showDetail(row) {
            getDriverInfo(row.id).then(res=>{
                
            })
        },
    }
}

 src/view/systemManage/driver/service.js

New file
@@ -0,0 +1,11 @@
import axios from '@/utils/request';

// 获取司机详情
export const getDriverInfo = (id) => {
    return axios.get(`/system/driver/getDriverInfo/{id}/${id}`)
}

// 获取司机列表
export const getDriverList = (params) => {
    return axios.get(`/system/driver/getDriverList`, { params })
}

 src/view/systemManage/role/addEdit.vue

@@ -110,20 +110,20 @@
  computed: {},
  watch: {},
  created() {
    // roleInfoFromUserId({ userId: 1 }).then(res => {
    //   if (this.$route.query.roleId) {
    //     getRoleInfo({ roleId: this.$route.query.roleId }).then(resp => {
    //       this.menu = this.setSelectedIds(res.data.data, resp.data.data.menus || []);
    //       this.form = {
    //         roleName: resp.data.data.roleName,
    //         remark: resp.data.data.remark,
    //         roleId: resp.data.data.roleId
    //       }
    //     })
    //   } else {
    //     this.menu = res.data.data
    //   }
    // })
    roleInfoFromUserId().then(res => {
      if (this.$route.query.roleId) {
        getRoleInfo({ id: this.$route.query.roleId }).then(resp => {
          this.menu = this.setSelectedIds(res.data.data, resp.data.data.menus || []);
          this.form = {
            roleName: resp.data.data.roleName,
            remark: resp.data.data.remark,
            roleId: resp.data.data.roleId
          }
        })
      } else {
        this.menu = res.data.data
      }
    })
  },
  mounted() { },
  methods: {

 src/view/systemManage/role/detail.vue

@@ -66,12 +66,6 @@
              <el-form-item label="人员搜索">
                <el-input v-model="nickNameOrPhone" placeholder="请输入姓名/联系电话"></el-input>
              </el-form-item>
              <el-form-item label="所属部门">
                <el-select v-model="deptId" placeholder="请选择（多选）" multiple>
                  <el-option v-for="item in deptList" :key="item.id" :label="item.deptName" :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="登陆状态">
                <el-select v-model="status" placeholder="请选择">
                  <el-option
@@ -95,11 +89,6 @@
            <el-table-column prop="nickName" label="姓名"></el-table-column>
            <el-table-column prop="phonenumber" label="联系电话">
            </el-table-column>
            <el-table-column prop="deptList" label="所属部门">
              <template slot-scope="{ row }">
                <el-tag v-for="(item, index) in row.deptList" :key="index">{{ item }}</el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="roleName" label="角色">
            </el-table-column>
            <el-table-column prop="userName" label="登陆账号">
@@ -119,7 +108,7 @@
            </el-table-column>
            <el-table-column prop="createTime" label="创建时间"></el-table-column>
          </el-table>
          <div class="pagination">
          <div class="pagination  flex j-end">
            <el-pagination layout="slot,sizes,prev,pager,next,jumper" :page-size="pagination.pageSize"
              :current-page="pagination.pageNum" @current-change="handleCurrentChange" @size-change="handleSizeChange"
              :total="pagination.total">
@@ -128,6 +117,10 @@
          </div>
        </el-tab-pane>
      </el-tabs>

      <div class="btn_box">
        <el-button @click="$router.go(-1)">返回</el-button>
      </div>
    </el-card>
    <ViewData v-if="dialogVisibleView" :row="rowView" :dialogVisible="dialogVisibleView"
      @close="dialogVisibleView = false, rowView = {}" />
@@ -135,7 +128,7 @@
</template>

<script>
import { getRoleInfo, roleInfoFromUserId, getUserList, getDeptList } from './service.js'
import { getRoleInfo, roleInfoFromUserId, getUserList } from './service.js'
import ViewData from '../user/components/viewData.vue'
export default {
  components: {
@@ -149,8 +142,6 @@
      menu: [],
      data: [],
      nickNameOrPhone: '',
      deptId: [],
      deptList: [],
      status: '',
      pagination: {
        total: 10,
@@ -171,8 +162,8 @@
  },
  watch: {},
  created() {
    roleInfoFromUserId({ userId: 1 }).then(res => {
      getRoleInfo({ roleId: this.$route.query.roleId }).then(resp => {
    roleInfoFromUserId().then(res => {
      getRoleInfo({ id: this.$route.query.roleId }).then(resp => {
        this.menu = this.setSelectedIds(res.data.data, resp.data.data.menus);
        this.form = {
          roleName: resp.data.data.roleName,
@@ -181,9 +172,6 @@
      })
    })
    this.getListData()
    getDeptList().then((res) => {
      this.deptList = res.data.data
    })
  },
  mounted() { },
  methods: {
@@ -191,12 +179,11 @@
      let obj = {
        ...this.pagination,
        nickNameOrPhone: this.nickNameOrPhone,
        deptIds: this.deptId,
        status: this.status,
        roleIds: [this.$route.query.roleId]
        roleId: this.$route.query.roleId
      }
      this.listLoading = true
      const { data: { data: { records, total } } } = await getUserList(obj)
      const { records, total } = await getUserList(obj)
      this.data = records
      this.pagination.total = total
      this.timeOutID = setTimeout(() => {
@@ -215,7 +202,6 @@
    },
    reset() {
      this.nickNameOrPhone = ''
      this.deptId = []
      this.status = ''
      this.pagination.pageNum = 1
      this.getListData()
@@ -251,6 +237,11 @@
  }
}

.btn_box {
  margin-top: 40px;
  text-align: center;
}

.row,
.header {
  display: flex;

 src/view/systemManage/role/index.vue

@@ -13,11 +13,10 @@
    </el-card>
    <el-card style="margin-top: 20px;">
      <div class="add_btn">
        <el-button  icon="el-icon-plus" @click="add"
          type="primary">添加角色</el-button>
        <el-button icon="el-icon-plus" @click="add" type="primary">添加角色</el-button>
      </div>
      <el-table ref="tableSort" v-loading="listLoading" stripe :data="data" :element-loading-text="elementLoadingText"
        >
      <el-table ref="tableSort" v-loading="listLoading" :height="height" stripe :data="data"
        :element-loading-text="elementLoadingText">
        <el-table-column type="index" width="55" label="序号"></el-table-column>
        <el-table-column prop="roleName" label="角色名称"></el-table-column>
        <el-table-column prop="remark" label="备注"></el-table-column>
@@ -25,12 +24,10 @@
        <el-table-column label="操作" width="300">
          <template slot-scope="{row}">
            <div>
              <el-button  type="text"
              <el-button type="text"
                @click="$router.push(`/systemManage/role-detail?roleId=${row.roleId}`)">详情</el-button>
              <el-button  type="text"
                @click="$router.push(`/systemManage/add-role?roleId=${row.roleId}`)">编辑</el-button>
              <el-button  type="text"
                @click="del(row)">删除</el-button>
              <el-button type="text" @click="$router.push(`/systemManage/add-role?roleId=${row.roleId}`)">编辑</el-button>
              <el-button type="text" @click="del(row)">删除</el-button>
            </div>
          </template>
        </el-table-column>
@@ -71,9 +68,9 @@
    };
  },
  computed: {
    // height() {
    //   // return this.$baseTableHeight()
    // },
    height() {
      return this.$baseTableHeight()
    },
  },
  watch: {},
  created() {
@@ -103,9 +100,9 @@
        pageSize: this.pagination.pageSize
      }
      this.listLoading = true
      // const { data: { data: { records, total } } } = await getList(obj)
      // this.data = records
      this.pagination.total = 10||total
      const { records, total } = await getList(obj)
      this.data = records
      this.pagination.total = 10 || total
      this.timeOutID = setTimeout(() => {
        this.listLoading = false
      }, 500)

 src/view/systemManage/role/service.js

@@ -1,28 +1,28 @@
import axios from '@/utils/request';

// 列表
export const getList = (data) => {
  return axios.post('/system/role/list', { ...data })
export const getList = (params) => {
  return axios.get('/system/role/listPage', { params })
}

// 添加
export const add = (data) => {
  return axios.post('/system/role/add', { ...data })
  return axios.post('/system/role/roleAdd', { ...data })
}

// 编辑
export const edit = (data) => {
  return axios.put('/system/role', { ...data })
  return axios.post('/system/role/roleUpdate', { ...data })
}

// 删除
export const delRole = (id) => {
  return axios.delete(`/system/role/deleteById/${id}`)
  return axios.delete(`/system/role/${id}`)
}

// 获取菜单树
export const roleInfoFromUserId = (params) => {
  return axios.get(`/system/role/roleInfoFromUserId`, { params })
export const roleInfoFromUserId = () => {
  return axios.get(`/system/menu/list`)
}

// 获取角色详情
@@ -30,12 +30,7 @@
  return axios.get(`/system/role/roleInfo`, { params })
}


// 列表
export const getUserList = (data) => {
  return axios.post('/system/user/list', { ...data })
}

export const getDeptList = (params) => {
  return axios.post('/t-dept/listAll')
export const getUserList = (params) => {
  return axios.get('/system/user/list', { params })
}

 src/view/systemManage/user/components/addEdit.vue

@@ -13,13 +13,6 @@
                    <el-input v-model="form.userName" :disabled="form.userId" placeholder="请输入"
                        style="width: 50%;"></el-input>
                </el-form-item>
                <el-form-item label="所属部门" prop="deptId">
                    <el-select v-model="form.deptId" placeholder="请选择">
                        <el-option v-for="item in deptList" :key="item.deptId" :label="item.deptName"
                            :value="item.deptId">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="角色" prop="roleId">
                    <el-select v-model="form.roleId" placeholder="请选择">
                        <el-option v-for="item in roleList" :key="item.roleId" :label="item.roleName"
@@ -53,10 +46,6 @@
            type: Object,
            default: () => { }
        },
        deptList: {
            type: Array,
            default: () => []
        },
        roleList: {
            type: Array,
            default: () => []
@@ -68,7 +57,6 @@
            rules: {
                nickName: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
                phonenumber: [{ required: true, message: '请输入联系电话', trigger: 'blur' }],
                deptId: [{ required: true, message: '请选择所属部门', trigger: 'blur' }],
                roleId: [{ required: true, message: '请选择角色', trigger: 'blur' }],
                userName: [{ required: true, message: '请输入登陆账号', trigger: 'blur' }],
            }
@@ -81,8 +69,7 @@
                userId: this.row.userId,
                nickName: this.row.nickName,
                phonenumber: this.row.phonenumber,
                deptId: this.row.deptId,
                roleId: this.row.roleId,
                roleId: this.row.roleIds[0],
                userName: this.row.userName,
                remark: this.row.remark,
                status: this.row.status == 0 ? true : false,
@@ -101,6 +88,7 @@
                        ...this.form,
                        status: this.form.status ? 0 : 1
                    }
                    obj.roleIds = [this.form.roleId]
                    this.$emit('confirm', obj)
                }
            })

 src/view/systemManage/user/components/disb.vue

@@ -46,7 +46,7 @@
                nickName: this.row.nickName,
                userName: this.row.userName,
                status: 1,
                disableRemark: this.row.disableRemark
                disableRemark: this.row.forbiddenRemark
            }
        }
    },

 src/view/systemManage/user/components/resetPassWord.vue

@@ -68,9 +68,6 @@
        submit() {
            this.$refs['form'].validate((valid) => {
                if (valid) {
                    if (this.row.deptId) {
                        this.form.deptId = this.row.deptId
                    }
                    this.form.orderNum = 0
                    this.form.ancestors = 0
                    this.form.parentId = 100

 src/view/systemManage/user/components/viewData.vue

File was deleted

 src/view/systemManage/user/index.vue

@@ -3,16 +3,16 @@
    <div class="form flex a-center j-between mt--23">
      <div class="form-left ml--30">
        <el-form :inline="true">
          <el-form-item label="人员搜索">
          <el-form-item label="人员搜索" style="margin-right: 100px;">
            <el-input v-model="nickNameOrPhone" placeholder="请输入姓名/联系电话"></el-input>
          </el-form-item>
          <el-form-item label="人员角色">
          <el-form-item label="人员角色" style="margin-right: 100px;">
            <el-select v-model="roleId" placeholder="请选择（多选）" multiple>
              <el-option v-for="item in roleList" :key="item.roleId" :label="item.roleName" :value="item.roleId">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="账号状态">
          <el-form-item label="账号状态" style="margin-right: 100px;">
            <el-select v-model="status" placeholder="请选择">
              <el-option
                v-for="item in [{ label: '全部', value: '' }, { label: '启用', value: 0 }, { label: '禁用', value: 1 }]"
@@ -22,7 +22,7 @@
          </el-form-item>
        </el-form>
      </div>
      <div style="text-align: right;">
      <div class="form-right mr--24 mb--22 shrink0">
        <el-button class="search-button h--40 w--90 fs--14" icon="el-icon-search" type="primary" size="small"
          @click="onSubmit">查询</el-button>
        <el-button @click="reset" icon="el-icon-refresh-right" class="reset-button h--40 w--90 fs--14"
@@ -32,34 +32,40 @@
    <div class="table-box-btn mt--23 ml--30">
      <el-button class="search-button h--40 w--90 fs--14" icon="el-icon-plus" type="primary" size="small"
        @click="dialogVisible = true">添加</el-button>
      <el-button class="search-button h--40 w--90 fs--14" icon="el-icon-delete" type="danger" size="small"
        @click="dialogVisible = true">删除</el-button>
      <!-- <el-button class="search-button h--40 w--90 fs--14" icon="el-icon-delete" type="danger" size="small"
        @click="dialogVisible = true">删除</el-button> -->
    </div>
    <div class="table-box ml--30 mt--23 mr--30">
      <el-table :data="tableData" border stripe style="width: 100%" :height="height">
      <el-table :data="data" border stripe style="width: 100%" :height="height" :element-loading-text="'正在加载...'">
        <el-table-column prop="nickName" label="姓名"></el-table-column>
        <el-table-column prop="phonenumber" label="联系电话">
        </el-table-column>
        <el-table-column prop="roleName" label="角色"></el-table-column>
        <el-table-column prop="roleName" label="角色">
          <template #default="{ row }">
            {{ row.roleNames[0] }}
          </template>
        </el-table-column>
        <el-table-column prop="userName" label="登陆账号">
        </el-table-column>
        <el-table-column prop="remark" label="备注">
        </el-table-column>
        <el-table-column prop="status" label="账号状态">
          <template slot-scope="{row}">
          <template #default="{ row }">
            <div class="status_class">
              <div :class="row.status == 0 ? 'green' : 'red'"></div>
              <div>{{ row.status == 0 ? '正常' : '停用' }}</div>
              <div v-if="row.status == 1" style="cursor: pointer;" @click="dialogVisibleView = true, rowView = row">
                <i class="el-icon-warning"></i>
              <div v-if="row.status == 1" style="cursor: pointer;">
                <el-tooltip class="item" effect="dark" :content="`禁用原因：${row.forbiddenRemark}`" placement="top-start">
                  <i class="el-icon-warning"></i>
                </el-tooltip>
              </div>
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="createTime" label="创建时间"></el-table-column>
        <el-table-column label="操作" width="300">
          <template slot-scope="{row}">
            <div>
          <template #default="{ row }">
            <div v-if="row.userId != 1">
              <el-button type="text" @click="edit(row)">编辑</el-button>
              <el-button v-if="row.status != 0" type="text" @click="updateStatus(row, true)">启用</el-button>
              <el-button v-if="row.status == 0" type="text" @click="updateStatus(row, false)">禁用</el-button>
@@ -77,12 +83,10 @@
      </div>
    </div>

    <AddEdit v-if="dialogVisible" :row="row" :deptList="deptList" :roleList="roleList" :dialogVisible="dialogVisible"
    <AddEdit v-if="dialogVisible" :row="row" :roleList="roleList" :dialogVisible="dialogVisible"
      @close="dialogVisible = false, row = {}" @confirm="confirm" />
    <ResetPassword v-if="passwordVisible" :row="row" :dialogVisible="passwordVisible"
      @close="passwordVisible = false, row = {}" @confirm="passwordConfirm" />
    <ViewData v-if="dialogVisibleView" :row="rowView" :dialogVisible="dialogVisibleView"
      @close="dialogVisibleView = false, rowView = {}" />
    <Disb v-if="disbDialogVisible" :row="disbRow" :dialogVisible="disbDialogVisible"
      @close="disbDialogVisible = false, disbRow = {}" @confirm="disbConfirm" />
    <ShowDelConfirm :show="delShow" @close="delShow = false" @confirm="delConfirm" title="确认要删除该人员吗？"
@@ -91,16 +95,14 @@
</template>

<script>
import { getList, add, edit, delDept, deptList, roleList, updatePwd } from './service'
import { getList, add, edit, delDept, roleList, updatePwd, changeStatus } from './service'
import AddEdit from './components/addEdit.vue'
import ViewData from './components/viewData.vue'
import Disb from './components/disb.vue'
import ResetPassword from './components/resetPassWord.vue'
import ShowDelConfirm from '@/components/ShowDelConfirm'
export default {
  components: {
    AddEdit,
    ViewData,
    Disb,
    ResetPassword,
    ShowDelConfirm,
@@ -109,7 +111,6 @@
    return {
      dialogVisible: false,
      passwordVisible: false,
      dialogVisibleView: false,
      disbDialogVisible: false,
      delShow: false,
      data: [],
@@ -118,7 +119,6 @@
      roleId: [],
      status: '',
      roleList: [],
      deptList: [],
      searchForm: {
        total: 0,
        pageNum: 1,
@@ -137,32 +137,29 @@
  },
  watch: {},
  created() {
    // this.getRoleList()
    // this.getListData()
    // this.getdeptList()
    this.getRoleList()
    this.getListData()
  },
  mounted() { },
  methods: {
    getdeptList() {
      deptList({ status: 0 }).then((res) => {
        this.deptList = res
      })
    },
    getRoleList() {
      roleList().then((res) => {
        this.roleList = res
        this.roleList = res.records
      })
    },
    delConfirm() {
      delDept(this.delId).then(() => {
        this.delShow = false
        this.disbRow = {}
        this.getListData()
        this.msgsuccess('删除成功')
        this.getListData()
      })
    },
    disbConfirm(form) {
      edit(form).then(() => {
      changeStatus({
        remark: form.disableRemark,
        userId: form.userId
      }).then(res => {
        this.disbDialogVisible = false
        this.msgsuccess('禁用成功')
        this.getListData()
@@ -203,7 +200,10 @@
    },
    updateStatus(row, type) {
      if (type == true) {
        edit({ ...row, status: 0 }).then(() => {
        changeStatus({
          userId: row.userId
        }).then(res => {
          this.disbDialogVisible = false
          this.msgsuccess('启用成功')
          this.getListData()
        })
@@ -218,14 +218,13 @@
    },
    getListData() {
      let obj = {
        ...this.pagination,
        ...this.searchForm,
        nickNameOrPhone: this.nickNameOrPhone,
        deptId: this.deptId,
        roleIds: this.roleId,
        status: this.status,
      }
      getList(obj).then((res) => {
        this.pagination.total = res.total
        this.searchForm.total = res.total
        this.data = res.records
      })
    },
@@ -234,30 +233,22 @@
      this.roleId = []
      this.deptId = []
      this.status = ''
      this.pagination.pageNum = 1
      this.searchForm.pageNum = 1
      this.getListData()
    },
    onSubmit() {
      this.pagination.pageNum = 1
      this.searchForm.pageNum = 1
      this.getListData()
    },

    handleCurrentChange(e) {
      this.pagination.pageNum = e;
      this.searchForm.pageNum = e;
      this.getListData()
    },
    handleSizeChange(e) {
      this.pagination.pageSize = e
      this.searchForm.pageSize = e
      this.getListData()
    },
    // paginate(data, pageSize, currentPage) {
    //   if (data.length === 0) {
    //     return [];
    //   }
    //   const start = (currentPage - 1) * pageSize;
    //   const end = start + pageSize;
    //   return data.slice(start, end);
    // }
  },
};
</script>

 src/view/systemManage/user/service.js

@@ -1,8 +1,8 @@
import axios from '@/utils/request';

// 列表
export const getList = (data) => {
    return axios.post('/system/user/list', { ...data })
export const getList = (params) => {
    return axios.get('/system/user/list', { params })
}

// 添加
@@ -12,25 +12,25 @@

// 编辑
export const edit = (data) => {
    return axios.post('/system/user/edit', { ...data })
    return axios.put('/system/user/update', { ...data })
}

// 删除
export const delDept = (id) => {
    return axios.delete(`/system/user/deleteById/${id}`)
    return axios.delete(`/system/user/${id}`)
}

// 部门
export const deptList = (data) => {
    return axios.get(`/system/dept/list?status=${data.status}`,{...data})
}
// 角色
export const roleList = () => {
    return axios.post(`/system/role/listNotPage`)
    return axios.get(`/system/role/listPage`, { pageCurr: 1, pageSize: 9999 })
}
// 

// 禁用、启用
export const changeStatus = (data) => {
    return axios.put(`/system/user/changeStatus`,{...data})
    return axios.post(`/system/user/shopUserStart`, { ...data })
}

// 重置密码
export const updatePwd = (data) => {
    return axios.post(`/system/user/updatePwd`,{...data})
    return axios.put(`/system/user/resetPwd`, { ...data })
}