| | |
| | | // 百度地图异步加载回调处理 |
| | | window.onBMapCallback = function () { |
| | | console.log("百度地图脚本初始化成功..."); |
| | | // resolve(BMap); |
| | | resolve(BMap); |
| | | }; |
| | | |
| | | // 初始化成功后调用点聚合接口,因为百度的JS需要时间 |
| | |
| | | if (valid) { |
| | | var url = this.$systemconfig.basePath + '/ffzf/user/login'; |
| | | this.$byutil.postData(this,url,this.ruleForm,res=>{ |
| | | if (res.code == 0) { |
| | | let data = res.data; |
| | | if (data) { |
| | | localStorage.userId = data.id; |
| | | localStorage.name = data.name; |
| | | localStorage.type = data.type; |
| | | // localStorage.userRouters = JSON.stringify(this.items) ; |
| | | this.SET_ROLES(data.type) |
| | | this.SET_ROLELISt(); // 筛选左侧菜单栏 |
| | | this.$router.push({'path': this.resultAsyncRoutes[0].children[0].indexUrl || '/home'}); |
| | | // 自动跳转当前权限路由的第一个页面 ,如果找不到就去跳home |
| | | // if (this._isMobile()) { |
| | | // this.$router.push({'path': '/index4'}); |
| | | // } else { |
| | | // this.$router.push({'path': '/index'}); |
| | | // } |
| | | } |
| | | if (data) { |
| | | localStorage.userId = data.id; |
| | | localStorage.name = data.name; |
| | | localStorage.type = data.type; |
| | | // localStorage.userRouters = JSON.stringify(this.items) ; |
| | | this.SET_ROLES(data.type) |
| | | this.SET_ROLELISt(); // 筛选左侧菜单栏 |
| | | this.$router.push({'path': this.resultAsyncRoutes[0].children[0].indexUrl || '/home'}); |
| | | // 自动跳转当前权限路由的第一个页面 ,如果找不到就去跳home |
| | | // if (this._isMobile()) { |
| | | // this.$router.push({'path': '/index4'}); |
| | | // } else { |
| | | // this.$router.push({'path': '/index'}); |
| | | // } |
| | | } |
| | | }else { |
| | | this.$message.error(res.msg); |
| | | } |
| | | |
| | | }) |
| | | } else { |
| | | return false; |
| New file |
| | |
| | | <template> |
| | | <div class="mod-config" style="padding: 10px 10px 0px 10px;"> |
| | | <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()"> |
| | | <el-form-item label="停车场"> |
| | | <el-select v-model="searchForm.parkId" clearable> |
| | | <el-option v-for="item in table1" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button type="primary" size="small" @click="getDataList" icon="el-icon-search">查询</el-button> |
| | | <el-button type="primary" size="small" @click="onAdd" icon="el-icon-plus">新增</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | |
| | | <div class="avue-crud"> |
| | | <el-table :height="tableHeight" :data="pageData.rows" border v-loading="pageData.isLoading"> |
| | | <el-table-column type="index" width="50" label="序号" align="center"> |
| | | </el-table-column> |
| | | <el-table-column prop="inspecUser" header-align="center" align="center" label="巡检人" width="150px"> |
| | | </el-table-column> |
| | | <el-table-column prop="inspecTime" header-align="center" align="center" label="巡检时间" > |
| | | </el-table-column> |
| | | <el-table-column prop="parkName" header-align="center" align="center" label="停车场"> |
| | | </el-table-column> |
| | | <el-table-column prop="status" header-align="center" align="center" label="状态" width="120px"> |
| | | <template slot-scope="scope"> |
| | | <p v-if="scope.row.status == 0">正常</p> |
| | | <p v-if="scope.row.status == 1">异常</p> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="barrierName" header-align="center" align="center" label="道闸"> |
| | | </el-table-column> |
| | | <el-table-column prop="content" header-align="center" align="center" label="巡检详情"> |
| | | </el-table-column> |
| | | <el-table-column label="操作" fixed="right" width="150" align="center"> |
| | | <template slot-scope="scope"> |
| | | <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination background @size-change="onPageSizeChange" @current-change="onCurrentPageChange" |
| | | :current-page="pageData.currentPage" :page-size="pageData.pageSize" :total="pageData.total" |
| | | style="float: right"></el-pagination> |
| | | </div> |
| | | |
| | | <el-dialog title="编辑" :visible.sync="flag" width="40%"> |
| | | <el-form :model="formData" ref="formData" label-width="100px"> |
| | | <el-form-item label="巡检人" prop="inspecUser" :rules="[{ required: true, message: '请输入巡检人', trigger: 'blur' }]"> |
| | | <el-input style="width: 200px" v-model="formData.inspecUser" placeholder="请输入巡检人"></el-input> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="停车场" prop="parkId" :rules="[{ required: true, message: '请选择停车场', trigger: 'blur' }]"> |
| | | <el-select v-model="formData.parkId" clearable @change="handlePark"> |
| | | <el-option v-for="item in table1" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="道闸" prop="barrierId" :rules="[{ required: true, message: '请选择道闸', trigger: 'blur' }]"> |
| | | <el-select v-model="formData.barrierId" clearable> |
| | | <el-option v-for="item in barryList" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="巡检时间" prop="inspecTime"> |
| | | <el-date-picker v-model="formData.inspecTime" type="datetime" format="yyyy-MM-dd HH:mm:ss" |
| | | value-format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期时间"> |
| | | </el-date-picker> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="巡检状态" prop="inspecTime"> |
| | | <el-radio-group v-model="formData.status"> |
| | | <el-radio :label="0">正常</el-radio> |
| | | <el-radio :label="1">异常</el-radio> |
| | | </el-radio-group> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="巡检详情" prop="content" :rules="[{ required: true, message: '请输入巡检详情', trigger: 'blur' }]"> |
| | | <el-input type="textarea" |
| | | :rows="3" |
| | | v-model="formData.content" |
| | | placeholder="请输入巡检详情"> |
| | | |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-form> |
| | | |
| | | <div slot="footer" class="dialog-footer"> |
| | | <el-button @click="flag = false">取 消</el-button> |
| | | <el-button type="primary" @click="onSave">确 定</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | data() { |
| | | return { |
| | | tableHeight: 500, |
| | | dataForm: { |
| | | key: '' |
| | | }, |
| | | table1: [], |
| | | pageData: this.$byutil.defaultPageData(), |
| | | searchForm: { |
| | | current: this.pageIndex, |
| | | size: this.pageSize, |
| | | carNo: '', |
| | | parkId: '', |
| | | date: new Date, |
| | | }, |
| | | dataList: [], |
| | | pageIndex: 1, |
| | | pageSize: 100, |
| | | totalPage: 0, |
| | | dataListLoading: false, |
| | | addOrUpdateVisible: false, |
| | | |
| | | // 新增 |
| | | flag: false, |
| | | formData: { |
| | | status: 0, |
| | | }, |
| | | barryList: [], // 道闸 |
| | | } |
| | | }, |
| | | components: { |
| | | }, |
| | | created() { |
| | | this.getAllPark() |
| | | this.getDataList() |
| | | this.tableHeight = window.innerHeight - 260 |
| | | }, |
| | | computed: { |
| | | }, |
| | | methods: { |
| | | // 获取数据列表 |
| | | getDataList() { |
| | | this.dataListLoading = true |
| | | this.searchForm.current = this.pageIndex |
| | | this.searchForm.size = this.pageSize |
| | | this.$byutil.loadPageData(this, this.$systemconfig.basePath + '/ffzf/inspection/findPage', this.searchForm); |
| | | this.dataListLoading = false |
| | | }, |
| | | getAllPark() { |
| | | this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/park/findAll', this.formData, res => { |
| | | this.table1 = res.data; |
| | | }) |
| | | }, |
| | | onPageSizeChange(val) { |
| | | this.pageData.pageSize = val; |
| | | this.getDataList(); |
| | | }, |
| | | onCurrentPageChange(val) { |
| | | this.pageData.page = val; |
| | | this.getDataList(); |
| | | }, |
| | | |
| | | // 根据停车场获取道闸 |
| | | getBarryList() { |
| | | this.$byutil.loadPageData(this, this.$systemconfig.basePath + '/ffzf/barrier/findPage', { parkId: this.formData.parkId }); |
| | | }, |
| | | |
| | | // 选择停车场 |
| | | handlePark(e) { |
| | | this.$byutil.postData4(this, this.$systemconfig.basePath + '/ffzf/barrier/findPage', { parkId: this.formData.parkId, size: 100 }, res => { |
| | | this.barryList = res.data.records |
| | | }); |
| | | }, |
| | | |
| | | // 新增弹框 |
| | | onAdd() { |
| | | this.flag = true; |
| | | this.$refs['formData'].resetFields(); |
| | | this.formData = { |
| | | name: '', |
| | | loginName: '', |
| | | phone: '', |
| | | type: '', |
| | | } |
| | | }, |
| | | |
| | | // 新增保存 |
| | | onSave() { |
| | | this.$refs['formData'].validate((valid) => { |
| | | if (valid) { |
| | | this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/inspection/save', this.formData, res => { |
| | | this.$refs['formData'].resetFields(); |
| | | this.flag = false; |
| | | this.$message({ message: '保存成功', type: 'success' }); |
| | | this.getDataList() |
| | | }) |
| | | } else { |
| | | return false; |
| | | } |
| | | }); |
| | | }, |
| | | |
| | | handleDelete(index, row) { |
| | | this.$byutil.deleteData(this, this.$systemconfig.basePath + "/ffzf/inspection/delete", { id: row.id }, res => { |
| | | this.$message({ message: '删除成功', type: 'success' }); |
| | | this.getDataList(); |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .fenye-box { |
| | | width: calc(70% - 20px); |
| | | } |
| | | </style> |
| | |
| | | <div class="leaderIndex-wrap"> |
| | | <div class="leaderIndex-title"> |
| | | <h1>峰峰矿区综合行政执法局智慧泊车平台</h1> |
| | | <div class="leader-title-left"> |
| | | <h2>欢迎登录,{{userName}}</h2> |
| | | </div> |
| | | <div class="logout" @click="logout"> |
| | | 退出登录 |
| | | </div> |
| | | <!-- <div class="leader-title-right" @click="houtaiBtn">--> |
| | | <!-- <h2>后台管理</h2>--> |
| | | <!-- </div>--> |
| | |
| | | getLogoUrl: this.$systemconfig.basePath + '/statistic/getLogo', |
| | | findAllUrl: this.$systemconfig.basePath + '/ffzf/user/findAll', |
| | | illegalCarUrl: this.$systemconfig.basePath + '/ffzf/notice/illegalCar2', |
| | | getCarNumUrl: this.$systemconfig.basePath + '/ffzf/park/getCarNum' |
| | | }, |
| | | weizhangTimer:null, //违章list定时器 |
| | | getDataTimer:null, //统计数据定时器 |
| | |
| | | map:'', |
| | | centerLng:'114.225914', |
| | | centerLat:'36.438982', |
| | | pointNum1: '', |
| | | pointNum2: '', |
| | | } |
| | | }, |
| | | mounted() { |
| | |
| | | this.map = map; |
| | | // let goodsData = require('../../../assets/custom_map_config.json') |
| | | // 设定地图的中心点和坐标 |
| | | let point = new BMap.Point(this.centerLng, this.centerLat); |
| | | let marker = new BMap.Marker(point) // 创建标注 |
| | | // 设置中心点坐标和地图级别 |
| | | this.map.centerAndZoom(point, 1); |
| | | // 添加自定义覆盖物 |
| | | this.map.addOverlay(marker) // 将标注添加到地图中 |
| | | // let point = new BMap.Point(this.centerLng, this.centerLat); |
| | | // let marker = new BMap.Marker(point) // 创建标注 |
| | | // // 设置中心点坐标和地图级别 |
| | | // this.map.centerAndZoom(point, 1); |
| | | // // 添加自定义覆盖物 |
| | | // this.map.addOverlay(marker) // 将标注添加到地图中 |
| | | |
| | | |
| | | const centerPoint = new BMap.Point(114.23123, 36.43123); |
| | | // 定义多点坐标 |
| | | const points = [ |
| | | {lng: 114.23123, lat: 36.43123, name: '新世纪停车场', id: 4 }, |
| | | {lng: 114.18, lat: 36.44, name: '八里方停车场', id: 36 }, |
| | | {lng: 114.21, lat: 36.43, name: '滏源堤停车场', id: 34 }, |
| | | {lng: 114.24, lat: 36.42, name: '滏阳湿地公园停车场', id: 33 }, |
| | | {lng: 114.18, lat: 36.43, name: '陶瓷博物馆停车场', id: 30 }, |
| | | {lng: 114.21, lat: 36.42, name: '风月关停车场', id: 25 }, |
| | | {lng: 114.23, lat: 36.44, name: '清泉公园停车场', id: 22 }, |
| | | {lng: 114.21222, lat: 36.43111, name: '峰峰宾馆停车场', id: 7 }, |
| | | {lng: 114.23, lat: 36.42, name: '南头村停车场', id: 20 }, |
| | | {lng: 114.24125, lat: 36.43127, name: '国土局停车场', id: 21 }, |
| | | {lng: 114.22127, lat: 36.43129, name: '人民广场地下停车场', id: 8 }, |
| | | ]; |
| | | // 添加中心点标记 |
| | | const centerMarker = new BMap.Marker(centerPoint); |
| | | this.map.addOverlay(centerMarker); |
| | | // 循环添加其他点 |
| | | points.forEach(coord => { |
| | | const point = new BMap.Point(coord.lng, coord.lat); |
| | | const marker = new BMap.Marker(point); |
| | | this.map.addOverlay(marker); |
| | | |
| | | // 添加鼠标悬停事件 |
| | | marker.addEventListener("mouseover", (e) => { |
| | | this.$byutil.postData4(this, this.pageConfig.getCarNumUrl, { parkId: coord.id }, res => { |
| | | this.pointNum1 = res.data.num // 车位总数 |
| | | this.pointNum2 = Math.floor(Number(res.data.num) - Number(res.data.carNum)); |
| | | |
| | | // 创建信息窗口内容 |
| | | const content = ` |
| | | <div style="padding:10px"> |
| | | <h4>${coord.name}</h4> |
| | | <p>车位总数: ${this.pointNum1}</p> |
| | | <p>剩余:${this.pointNum2} </p> |
| | | </div> |
| | | `; |
| | | // 创建信息窗口 |
| | | const infoWindow = new BMap.InfoWindow(content, { |
| | | width: 200, |
| | | title: "详细信息" |
| | | }); |
| | | |
| | | // 在标记点位置打开信息窗口 |
| | | marker.openInfoWindow(infoWindow, point); |
| | | }) |
| | | }); |
| | | }); |
| | | // 地图设置... |
| | | this.map.centerAndZoom(centerPoint, 1); |
| | | this.map.enableScrollWheelZoom(true); |
| | | this.map.setZoom(15); |
| | | // 自动调整视野 |
| | | const bounds = new BMap.Bounds(); |
| | | [centerPoint, ...points].forEach(p => bounds.extend(p)); |
| | | this.map.setViewport(bounds.getSouthWest(), bounds.getNorthEast()); |
| | | |
| | | |
| | | // 允许滚轮缩放 |
| | | this.map.enableScrollWheelZoom(point, 15); |
| | | // 设置地图默认缩放比例 |
| | |
| | | // style:'midnight', |
| | | styleJson:goodsData |
| | | }); |
| | | |
| | | |
| | | this.map.addEventListener("tilesloaded", () => { |
| | | this.addHeatMap(this.map); // 确保在 tilesloaded 事件后调用 |
| | | }); |
| | | |
| | | |
| | | // this.addHeatMap(this.map) |
| | | this.addMarker(this.map,point) |
| | | }) |
| New file |
| | |
| | | <template> |
| | | <div class="mod-config" style="padding: 10px 10px 0px 10px;"> |
| | | <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()"> |
| | | <el-form-item label="停车场"> |
| | | <el-select v-model="searchForm.parkId" clearable> |
| | | <el-option v-for="item in table1" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button type="primary" size="small" @click="getDataList" icon="el-icon-search">查询</el-button> |
| | | <el-button type="primary" size="small" @click="onAdd" icon="el-icon-plus">新增</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | |
| | | <div class="avue-crud"> |
| | | <el-table :height="tableHeight" :data="pageData.rows" border v-loading="pageData.isLoading"> |
| | | <el-table-column type="index" width="50" label="序号" align="center"> |
| | | </el-table-column> |
| | | <el-table-column prop="repairUser" header-align="center" align="center" label="维保人" width="150px"> |
| | | </el-table-column> |
| | | <el-table-column prop="repairTime" header-align="center" align="center" label="维修时间" > |
| | | </el-table-column> |
| | | <el-table-column prop="parkName" header-align="center" align="center" label="停车场"> |
| | | </el-table-column> |
| | | <el-table-column prop="status" header-align="center" align="center" label="状态" width="120px"> |
| | | <template slot-scope="scope"> |
| | | <p v-if="scope.row.status == 0">维修</p> |
| | | <p v-if="scope.row.status == 1">保养</p> |
| | | <p v-if="scope.row.status == 2">更换</p> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="barrierName" header-align="center" align="center" label="道闸"> |
| | | </el-table-column> |
| | | <el-table-column prop="repairContent" header-align="center" align="center" label="维保详情"> |
| | | </el-table-column> |
| | | <el-table-column label="操作" fixed="right" width="150" align="center"> |
| | | <template slot-scope="scope"> |
| | | <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination background @size-change="onPageSizeChange" @current-change="onCurrentPageChange" |
| | | :current-page="pageData.currentPage" :page-size="pageData.pageSize" :total="pageData.total" |
| | | style="float: right"></el-pagination> |
| | | </div> |
| | | |
| | | <el-dialog title="编辑" :visible.sync="flag" width="40%"> |
| | | <el-form :model="formData" ref="formData" label-width="100px"> |
| | | <el-form-item label="维保人" prop="repairUser" :rules="[{ required: true, message: '请输入维保人', trigger: 'blur' }]"> |
| | | <el-input style="width: 200px" v-model="formData.repairUser" placeholder="请输入维保人"></el-input> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="停车场" prop="parkId" :rules="[{ required: true, message: '请选择停车场', trigger: 'blur' }]"> |
| | | <el-select v-model="formData.parkId" clearable @change="handlePark"> |
| | | <el-option v-for="item in table1" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="道闸" prop="barrierId" :rules="[{ required: true, message: '请选择道闸', trigger: 'blur' }]"> |
| | | <el-select v-model="formData.barrierId" clearable> |
| | | <el-option v-for="item in barryList" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="维保时间" prop="repairTime"> |
| | | <el-date-picker v-model="formData.repairTime" type="datetime" format="yyyy-MM-dd HH:mm:ss" |
| | | value-format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期时间"> |
| | | </el-date-picker> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="维修建议" prop="status"> |
| | | <el-radio-group v-model="formData.status"> |
| | | <el-radio :label="0">维修</el-radio> |
| | | <el-radio :label="1">保养</el-radio> |
| | | <el-radio :label="2">更换</el-radio> |
| | | </el-radio-group> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="维保详情" prop="repairContent" |
| | | :rules="[{ required: true, message: '请输入维保详情', trigger: 'blur' }]"> |
| | | <el-input type="textarea" |
| | | :rows="3" |
| | | v-model="formData.repairContent" |
| | | placeholder="请输入维保详情"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-form> |
| | | |
| | | <div slot="footer" class="dialog-footer"> |
| | | <el-button @click="flag = false">取 消</el-button> |
| | | <el-button type="primary" @click="onSave">确 定</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | data() { |
| | | return { |
| | | tableHeight: 500, |
| | | dataForm: { |
| | | key: '' |
| | | }, |
| | | table1: [], |
| | | pageData: this.$byutil.defaultPageData(), |
| | | searchForm: { |
| | | current: this.pageIndex, |
| | | size: this.pageSize, |
| | | carNo: '', |
| | | parkId: '', |
| | | date: new Date, |
| | | }, |
| | | dataList: [], |
| | | pageIndex: 1, |
| | | pageSize: 100, |
| | | totalPage: 0, |
| | | dataListLoading: false, |
| | | addOrUpdateVisible: false, |
| | | |
| | | // 新增 |
| | | flag: false, |
| | | formData: {}, |
| | | barryList: [], // 道闸 |
| | | } |
| | | }, |
| | | components: { |
| | | }, |
| | | created() { |
| | | this.getAllPark() |
| | | this.getDataList() |
| | | this.tableHeight = window.innerHeight - 260 |
| | | }, |
| | | computed: { |
| | | }, |
| | | methods: { |
| | | // 获取数据列表 |
| | | getDataList() { |
| | | this.dataListLoading = true |
| | | this.searchForm.current = this.pageIndex |
| | | this.searchForm.size = this.pageSize |
| | | this.$byutil.loadPageData(this, this.$systemconfig.basePath + '/ffzf/repair/findPage', this.searchForm); |
| | | this.dataListLoading = false |
| | | }, |
| | | getAllPark() { |
| | | this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/park/findAll', this.formData, res => { |
| | | this.table1 = res.data; |
| | | }) |
| | | }, |
| | | onPageSizeChange(val) { |
| | | this.pageData.pageSize = val; |
| | | this.getDataList(); |
| | | }, |
| | | onCurrentPageChange(val) { |
| | | this.pageData.page = val; |
| | | this.getDataList(); |
| | | }, |
| | | |
| | | // 根据停车场获取道闸 |
| | | getBarryList() { |
| | | this.$byutil.loadPageData(this, this.$systemconfig.basePath + '/ffzf/barrier/findPage', { parkId: this.formData.parkId }); |
| | | }, |
| | | |
| | | // 选择停车场 |
| | | handlePark(e) { |
| | | this.$byutil.postData4(this, this.$systemconfig.basePath + '/ffzf/barrier/findPage', { parkId: this.formData.parkId, size: 100 }, res => { |
| | | this.barryList = res.data.records |
| | | }); |
| | | }, |
| | | |
| | | // 新增弹框 |
| | | onAdd() { |
| | | this.flag = true; |
| | | this.$refs['formData'].resetFields(); |
| | | this.formData = { |
| | | name: '', |
| | | loginName: '', |
| | | phone: '', |
| | | type: '', |
| | | } |
| | | }, |
| | | |
| | | // 新增保存 |
| | | onSave() { |
| | | this.$refs['formData'].validate((valid) => { |
| | | if (valid) { |
| | | this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/repair/save', this.formData, res => { |
| | | this.$refs['formData'].resetFields(); |
| | | this.flag = false; |
| | | this.$message({ message: '保存成功', type: 'success' }); |
| | | this.getDataList() |
| | | }) |
| | | } else { |
| | | return false; |
| | | } |
| | | }); |
| | | }, |
| | | |
| | | handleDelete(index, row) { |
| | | this.$byutil.deleteData(this, this.$systemconfig.basePath + "/ffzf/repair/delete", { id: row.id }, res => { |
| | | this.$message({ message: '删除成功', type: 'success' }); |
| | | this.getDataList(); |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .fenye-box { |
| | | width: calc(70% - 20px); |
| | | } |
| | | </style> |
| New file |
| | |
| | | <template> |
| | | <div> |
| | | <div style="padding-top:10px;"></div> |
| | | |
| | | <div class="loading-tips" v-if="loading"> |
| | | <div class="tips-text">请稍后...</div> |
| | | <!-- 可选:加个加载动画圆点 --> |
| | | <div class="loading-dots"> |
| | | <span></span> |
| | | <span></span> |
| | | <span></span> |
| | | </div> |
| | | </div> |
| | | |
| | | <table border="1" class="dataframe" v-else> |
| | | <thead> |
| | | <tr style="text-align: right;"> |
| | | <th>停车场</th> |
| | | <th>车位总数</th> |
| | | <th>剩余</th> |
| | | <th>导航</th> |
| | | </tr> |
| | | </thead> |
| | | <tbody> |
| | | <tr v-for="(item, index) in tableData" :key="item.id"> |
| | | <td style="text-align: left;">{{ item.name }}</td> |
| | | <td>{{ item.num }}</td> |
| | | <td>{{ Math.floor(Number(item.num) - Number(item.carNum)) }}</td> |
| | | <td style="text-align: left;"><a @click="goPark(item.name)">打开导航</a></td> |
| | | </tr> |
| | | </tbody> |
| | | </table> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import 'element-ui/lib/theme-chalk/index.css'; |
| | | export default { |
| | | data() { |
| | | return { |
| | | loading: true, |
| | | tableData: [], |
| | | urlPath: this.$systemconfig.basePath + '/ffzf/park/', |
| | | } |
| | | }, |
| | | |
| | | created() { |
| | | this.getTableData() |
| | | }, |
| | | |
| | | methods: { |
| | | getTableData() { |
| | | this.loading = true |
| | | this.$byutil.postData4(this, this.urlPath + 'findPage', { size: 50 }, res => { |
| | | this.tableData = res.data.records |
| | | this.loading = false |
| | | }); |
| | | }, |
| | | |
| | | goPark(name) { |
| | | // console.log('name=', name); |
| | | this.openMap('114.23123', '36.43123', name, "baidu"); |
| | | }, |
| | | |
| | | // --------------------------------- |
| | | openMap(longitude, latitude, name, mapApp) { |
| | | let url; |
| | | switch (mapApp) { |
| | | case 'baidu': |
| | | url = `baidumap://map/marker?location=${latitude},${longitude}&title=${encodeURIComponent(name)}&content=${encodeURIComponent(name)}&src=webapp`; |
| | | break; |
| | | case 'gaode': |
| | | url = `iosamap://navi?sourceApplication=webapp&backScheme=myapp://&lat=${latitude}&lon=${longitude}&name=${encodeURIComponent(name)}&dev=0`; |
| | | break; |
| | | case 'tencent': |
| | | url = `qqmap://map/rgeo?location=${latitude},${longitude}&name=${encodeURIComponent(name)}&coord_type=1&policy=0`; |
| | | break; |
| | | default: |
| | | console.error('不支持的地图类型'); |
| | | return; |
| | | } |
| | | |
| | | // 使用iframe打开URL Scheme,避免直接跳转导致页面卡死 |
| | | const iframe = document.createElement('iframe'); |
| | | iframe.style.display = 'none'; |
| | | iframe.src = url; |
| | | document.body.appendChild(iframe); |
| | | setTimeout(() => { |
| | | document.body.removeChild(iframe); |
| | | }, 1000); |
| | | |
| | | |
| | | // 定时器检测是否唤起成功,如果失败则跳转到网页版地图 |
| | | let timer = setTimeout(() => { |
| | | window.location.href = `https://uri.amap.com/marker?position=${longitude},${latitude}&name=${encodeURIComponent(name)}&src=mypage&coordinate=gaode&callnative=0`; // 默认跳转高德网页版 |
| | | }, 2000); |
| | | |
| | | window.addEventListener('blur', () => { |
| | | clearTimeout(timer) |
| | | }); |
| | | |
| | | } |
| | | }, |
| | | } |
| | | </script> |
| | | |
| | | <style scoped lang="scss"> |
| | | //骨架屏样式 |
| | | .loading-tips { |
| | | width: 100%; |
| | | height: 80vh; // 占满屏幕主要区域 |
| | | display: flex; |
| | | flex-direction: column; |
| | | justify-content: center; |
| | | align-items: center; |
| | | |
| | | .tips-text { |
| | | font-size: 4.27vw; // 适配移动端字号 |
| | | color: #666; |
| | | margin-bottom: 3vw; |
| | | } |
| | | |
| | | // 加载圆点动画(可选,增加动效) |
| | | .loading-dots { |
| | | display: flex; |
| | | gap: 1.33vw; |
| | | |
| | | span { |
| | | width: 1.87vw; |
| | | height: 1.87vw; |
| | | border-radius: 50%; |
| | | background: #666; |
| | | animation: dot-flash 1.5s infinite ease-in-out; |
| | | |
| | | &:nth-child(2) { |
| | | animation-delay: 0.3s; |
| | | } |
| | | |
| | | &:nth-child(3) { |
| | | animation-delay: 0.6s; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | // 加载圆点动画 |
| | | @keyframes dot-flash { |
| | | |
| | | 0%, |
| | | 100% { |
| | | opacity: 0.3; |
| | | } |
| | | |
| | | 50% { |
| | | opacity: 1; |
| | | } |
| | | } |
| | | |
| | | table { |
| | | width: 100%; |
| | | border-collapse: collapse; |
| | | } |
| | | |
| | | th, |
| | | td { |
| | | border: 1px solid #ddd; |
| | | padding: 8px; |
| | | text-align: center; |
| | | } |
| | | |
| | | th { |
| | | background-color: #f2f2f2; |
| | | } |
| | | |
| | | @media (max-width: 600px) { |
| | | table { |
| | | font-size: 14px; |
| | | } |
| | | } |
| | | </style> |
| | |
| | | meta: { title: '首页' }, |
| | | children:[ |
| | | { |
| | | path: '/inspectionRegistration', |
| | | component: resolve => require(['../components/page/inspectionRegistration/index.vue'], resolve), |
| | | meta: { title: '巡检登记' } |
| | | }, |
| | | { |
| | | path: '/repairAndMaintenance', |
| | | component: resolve => require(['../components/page/repairAndMaintenance/index.vue'], resolve), |
| | | meta: { title: '维修维护管理软件' } |
| | | }, |
| | | { |
| | | path: '/user', |
| | | component: resolve => require(['../components/page/user/index.vue'], resolve), |
| | | meta: { title: '人员管理' } |
| | |
| | | component: resolve => require(['../components/page/MonthFeePay.vue'], resolve), |
| | | meta: { title: '月租车缴费' } |
| | | }, |
| | | { |
| | | path: '/smartParking', |
| | | component: resolve => require(['../components/page/smartPark.vue'], resolve), |
| | | meta: { title: '峰峰智慧停车' } |
| | | }, |
| | | ] |
| | | }) |
| | | |
| | |
| | | }, |
| | | ] |
| | | }, |
| | | { |
| | | id:4, |
| | | icon: 'el-icon-folder-opened', |
| | | indexUrl: '4', |
| | | name: '巡检运维管理', |
| | | children:[ |
| | | { |
| | | icon: 'el-icon-user-solid', |
| | | name: '巡检记录管理', |
| | | parentId: 4, |
| | | indexUrl: 'inspectionRegistration' |
| | | }, |
| | | { |
| | | icon: 'el-icon-user-solid', |
| | | name: '维修维护管理', |
| | | parentId: 4, |
| | | indexUrl: 'repairAndMaintenance' |
| | | }, |
| | | ] |
| | | }, |
| | | ], |
| | | items2: [ |
| | | { |