Merge branch 'server_ui_xiaoyao' into server_ui_dongxiaodong
dongxiaodong
commit
9ff5e6e6f5
|
|
@ -1,5 +1,5 @@
|
|||
# 页面标题
|
||||
VUE_APP_TITLE = 若依管理系统
|
||||
VUE_APP_TITLE = 车联管理系统
|
||||
|
||||
# 开发环境配置
|
||||
ENV = 'development'
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
# 页面标题
|
||||
VUE_APP_TITLE = 若依管理系统
|
||||
VUE_APP_TITLE = 系统
|
||||
|
||||
# 生产环境配置
|
||||
ENV = 'production'
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
# 页面标题
|
||||
VUE_APP_TITLE = 若依管理系统
|
||||
VUE_APP_TITLE = 智能车联管理系统
|
||||
|
||||
NODE_ENV = production
|
||||
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
{
|
||||
"name": "muyu",
|
||||
"version": "3.6.3",
|
||||
"description": "若依管理系统",
|
||||
"author": "若依",
|
||||
"description": "车联网管理系统",
|
||||
"author": "车联",
|
||||
"license": "MIT",
|
||||
"scripts": {
|
||||
"dev": "vue-cli-service serve",
|
||||
|
|
|
|||
|
|
@ -0,0 +1,66 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
// 查询电子围栏列表
|
||||
export function fenceList(data) {
|
||||
return request({
|
||||
url: '/couplet/fence/fenceList',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 新增电子围栏列表
|
||||
*/
|
||||
export function fenceAdd(data) {
|
||||
return request({
|
||||
url: '/couplet/fence/fenceAdd',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
/**
|
||||
* 修改电子围栏列表
|
||||
*/
|
||||
export function fenceUpdate(data) {
|
||||
return request({
|
||||
url: '/couplet/fence/fenceUpdate',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 电子围栏删除
|
||||
* @param fenceUpdate
|
||||
* @returns {*}
|
||||
*/
|
||||
export function fenceDelete(data) {
|
||||
return request({
|
||||
url: '/couplet/fence/'+data,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
/**
|
||||
* 电子围栏停用
|
||||
* @param data
|
||||
* @returns {*}
|
||||
*/
|
||||
export function changeFenceStatus(data) {
|
||||
return request({
|
||||
url: '/couplet/fence/fenceState/',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
/**
|
||||
* 查询标识
|
||||
* @param data
|
||||
* @returns {*}
|
||||
*/
|
||||
export function queryByLogo() {
|
||||
return request({
|
||||
url: '/couplet/logo/queryByLogo',
|
||||
method: 'post'
|
||||
})
|
||||
}
|
||||
|
|
@ -1,9 +1,126 @@
|
|||
<template>
|
||||
<div>
|
||||
<br>
|
||||
<el-form ref="queryParams" :inline="true" :model="queryParams" size="small">
|
||||
<el-form-item label="围栏名称" prop="roleName">
|
||||
<el-input
|
||||
v-model="queryParams.fenceName"
|
||||
clearable
|
||||
placeholder="请输入围栏名称"
|
||||
style="width: 240px"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select v-model="queryParams.fenceState" placeholder="请选择活动区域">
|
||||
<el-option label="启用" value="0"></el-option>
|
||||
<el-option label="停用" value="1"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button icon="el-icon-search" size="mini" type="primary" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
<el-button icon="el-icon-refresh-left" size="mini" type="danger" @click="refreshList" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template>
|
||||
<el-button type="info" @click="dialogFormVisible = true">新增</el-button>
|
||||
</template>
|
||||
|
||||
<el-table :data="fence">
|
||||
<el-table-column label="围栏名称" prop="fenceName" width="120"/>
|
||||
<el-table-column label="围栏经纬度" prop="fenceLongitudeLatitude" width="150"/>
|
||||
<el-table-column label="围栏描述" prop="fenceDescription" width="150"/>
|
||||
<el-table-column align="center" label="状态" width="100">
|
||||
<template slot-scope="scope">
|
||||
<el-switch
|
||||
v-model="scope.row.fenceState"
|
||||
active-value="0"
|
||||
inactive-value="1"
|
||||
@change="handleFenceStateChange(scope.row)"
|
||||
></el-switch>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="创建时间" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="最近修改时间" prop="updateTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.updateTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="维护人" prop="maintainerName" width="100"/>
|
||||
<el-table-column label="围栏标识" prop="logoName" width="100"/>
|
||||
<el-table-column align="center" class-name="small-padding fixed-width" label="操作">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
v-hasPermi="['system:role:edit']"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
type="text"
|
||||
@click="handleUpdate(scope.row)"
|
||||
>修改
|
||||
</el-button>
|
||||
<el-button
|
||||
v-hasPermi="['system:role:remove']"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
type="text"
|
||||
@click="handleFenceDelete(scope.row)"
|
||||
>删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="block">
|
||||
<el-pagination
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
:current-page="queryParams.pageNum"
|
||||
:page-sizes="[1, 3, 5, 10]"
|
||||
:page-size="queryParams.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="400">
|
||||
</el-pagination>
|
||||
</div>
|
||||
<!-- Form -->
|
||||
|
||||
<el-dialog title="新增电子围栏" :visible.sync="dialogFormVisible">
|
||||
<el-form :model="fenceInsertRequest">
|
||||
<el-form-item label="围栏名称" :label-width="formLabelWidth">
|
||||
<el-input v-model="fenceInsertRequest.fenceName" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="电子围栏描述信息" :label-width="formLabelWidth">
|
||||
<el-input v-model="fenceInsertRequest.fenceDescription" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="维护负责人" :label-width="formLabelWidth">
|
||||
<el-input v-model="fenceInsertRequest.maintainerName" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
<template>
|
||||
<el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
|
||||
<div style="margin: 15px 0;"></div>
|
||||
<el-checkbox-group v-model="logoIds" @change="handleCheckedCitiesChange">
|
||||
<el-checkbox v-for="logo in logo" :label="logo.logoName" :key="logo.logoId">{{logo.logoName}}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</template>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogFormVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="addFence">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<div class="mapBox">
|
||||
<!-- 使用高德地图的组件-->
|
||||
<!-- 使用高德地图的组件-->
|
||||
<el-amap vid="amapDemo" :zoom="zoom" :center="center" style="height: 600px">
|
||||
<!-- el-amap-marker>: 通过v-for指令循环遍历markers数组，-->
|
||||
<!-- 并为每个标记创建一个el-amap-marker组件，将标记的位置(position)绑定到数组中的相应数据。-->
|
||||
<!-- el-amap-marker>: 通过v-for指令循环遍历markers数组，-->
|
||||
<!-- 并为每个标记创建一个el-amap-marker组件，将标记的位置(position)绑定到数组中的相应数据。-->
|
||||
<el-amap-marker
|
||||
v-for="marker in markers"
|
||||
:position="marker.position"
|
||||
|
|
@ -20,13 +137,23 @@
|
|||
></el-amap-info-window>
|
||||
</el-amap>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {fenceList, changeFenceStatus, queryByLogo, fenceDelete, fenceAdd} from "@/api/couplet/fence";
|
||||
import {changeRoleStatus} from "@/api/system/role";
|
||||
import log from "@/views/monitor/job/log.vue";
|
||||
|
||||
export default {
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 单位信息
|
||||
unit: "xxxxx政府司法局",
|
||||
address: "xx省xx市xxxxx大道东433号",
|
||||
|
|
@ -40,20 +167,137 @@ export default {
|
|||
content: "自定义标题",
|
||||
offset: [10, 12],
|
||||
},
|
||||
// 查询参数
|
||||
queryParams: {},
|
||||
fence: [{}],
|
||||
fenceUpdateRequest:{},
|
||||
fenceInsertRequest:{},
|
||||
dialogFormVisible: false,
|
||||
formLabelWidth: '120px',
|
||||
checkAll: false,
|
||||
logo: [],
|
||||
logoIds:{},
|
||||
// cities: cityOptions,
|
||||
isIndeterminate: true,
|
||||
fenceChangeState:{}
|
||||
|
||||
};
|
||||
},
|
||||
async mounted() {
|
||||
this.initMap();
|
||||
},
|
||||
methods: {
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.queryByFenceList();
|
||||
},
|
||||
/**
|
||||
* 列表按钮
|
||||
*/
|
||||
queryByFenceList(){
|
||||
let queryParams = this.queryParams;
|
||||
fenceList(queryParams).then(
|
||||
res=>{
|
||||
this.$message.success("查询成功")
|
||||
this.fence=res.data.rows
|
||||
}
|
||||
)
|
||||
},
|
||||
/**
|
||||
* 重置
|
||||
*/
|
||||
resetQuery(){
|
||||
this.queryParams.fenceState='';
|
||||
this.queryParams.fenceName='';
|
||||
},
|
||||
/**
|
||||
* 刷新列表
|
||||
*/
|
||||
refreshList(){
|
||||
this.queryByFenceList()
|
||||
},
|
||||
/**
|
||||
* 全选
|
||||
* @param val
|
||||
*/
|
||||
handleCheckAllChange(val) {
|
||||
this.checkedCities = val ? this.logo : [];
|
||||
this.isIndeterminate = false;
|
||||
},
|
||||
handleCheckedCitiesChange(value) {
|
||||
let checkedCount = value.length;
|
||||
this.checkAll = checkedCount === this.logo.length;
|
||||
this.isIndeterminate = checkedCount > 0 && checkedCount < this.logo.length;
|
||||
},
|
||||
/**
|
||||
* 分页
|
||||
* @param val
|
||||
*/
|
||||
handleSizeChange(val) {
|
||||
this.queryParams.pageSize = val
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
this.queryParams.pageNum = val
|
||||
this.queryByFenceList()
|
||||
},
|
||||
/**
|
||||
* 新增数据
|
||||
*/
|
||||
addFence(){
|
||||
this.dialogFormVisible = false;
|
||||
fenceAdd(this.fenceInsertRequest).then(
|
||||
res=>{
|
||||
this.$message.success("新增成功")
|
||||
}
|
||||
)
|
||||
},
|
||||
/**
|
||||
* 查询多选框
|
||||
* @param row
|
||||
*/
|
||||
findByLogo(){
|
||||
queryByLogo().then(
|
||||
res=>{
|
||||
this.logo=res.data
|
||||
console.log(res)
|
||||
}
|
||||
)
|
||||
|
||||
},
|
||||
// 围栏状态修改
|
||||
handleFenceStateChange(row) {
|
||||
// let text = row.status === "0" ? "启用" : "停用";
|
||||
// this.$modal.confirm('确认要"' + text + '"状态吗？').then(function () {
|
||||
this.$modal.confirm('确认要修改状态吗？').then(function () {
|
||||
return changeFenceStatus(row);
|
||||
}).then(() => {
|
||||
this.$modal.msgSuccess( "成功");
|
||||
// this.$modal.msgSuccess(text + "成功");
|
||||
}).catch(function () {
|
||||
row.status = row.status === "0" ? "1" : "0";
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 电子围栏删除
|
||||
* @param map
|
||||
*/
|
||||
handleFenceDelete(row){
|
||||
console.log(row)
|
||||
var fenceId = row.fenceId;
|
||||
this.$modal.confirm('确认要修改编号为'+fenceId+'的信息吗？').then(function () {
|
||||
return fenceDelete(fenceId)
|
||||
}).then(() => {
|
||||
this.$modal.msgSuccess("删除成功啦!");
|
||||
this.queryByFenceList()
|
||||
}).catch(function () {
|
||||
this.$modal.msgError("删除失败");
|
||||
})
|
||||
},
|
||||
|
||||
// parseTime,
|
||||
// 初始化地图
|
||||
initMap(map) {
|
||||
this.markers.push({
|
||||
// position: [116.407387, 39.904179],
|
||||
position: [116.39, 39.9],
|
||||
// position: this.currentPosition,
|
||||
});
|
||||
|
||||
this.windows.push({
|
||||
position: [116.39, 39.9],
|
||||
// position: this.currentPosition,
|
||||
|
|
@ -81,13 +325,26 @@ export default {
|
|||
// });
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.queryByFenceList()
|
||||
this.findByLogo()
|
||||
},
|
||||
//生命周期 - 挂载完成（可以访问DOM元素）",
|
||||
mounted() {
|
||||
this.initMap();
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.mapBox {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
width: 50%;
|
||||
height: 600px;
|
||||
}
|
||||
|
||||
.fence-container {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@
|
|||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :lg="12" :sm="24" style="padding-left: 20px">
|
||||
<h2>若依后台管理框架</h2>
|
||||
<h2>车联后台管理框架</h2>
|
||||
<p>
|
||||
一直想做一款后台管理系统，看了很多优秀的开源项目但是发现没有合适自己的。于是利用空闲休息时间开始自己写一套后台系统。如此有了若依管理系统，她可以用于所有的Web应用程序，如网站管理后台，网站会员中心，CMS，CRM，OA等等，当然，您也可以对她进行深度定制，以做出更强系统。所有前端后台代码封装过后十分精简易上手，出错概率低。同时支持移动客户端访问。系统会陆续更新一些实用功能。
|
||||
</p>
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ function resolve(dir) {
|
|||
|
||||
const CompressionPlugin = require('compression-webpack-plugin')
|
||||
|
||||
const name = process.env.VUE_APP_TITLE || '若依管理系统' // 网页标题
|
||||
const name = process.env.VUE_APP_TITLE || '车联管理系统' // 网页标题
|
||||
|
||||
const port = process.env.port || process.env.npm_config_port || 80 // 端口
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue