Compare commits
10 Commits
da6bc0b9cd
...
4cf7ea494f
Author | SHA1 | Date |
---|---|---|
|
4cf7ea494f | |
|
1fd40ae74f | |
|
9b23a7a736 | |
|
e56e243fb4 | |
|
dffeeb9cd7 | |
|
ab863be7e3 | |
|
90081ebed9 | |
|
8134b203fe | |
|
da3265ad9d | |
|
0da5b6c201 |
|
@ -1,5 +1,5 @@
|
||||||
# 页面标题
|
# 页面标题
|
||||||
VUE_APP_TITLE = 若依管理系统
|
VUE_APP_TITLE = 车联管理系统
|
||||||
|
|
||||||
# 开发环境配置
|
# 开发环境配置
|
||||||
ENV = 'development'
|
ENV = 'development'
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
# 页面标题
|
# 页面标题
|
||||||
VUE_APP_TITLE = 若依管理系统
|
VUE_APP_TITLE = 系统
|
||||||
|
|
||||||
# 生产环境配置
|
# 生产环境配置
|
||||||
ENV = 'production'
|
ENV = 'production'
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
# 页面标题
|
# 页面标题
|
||||||
VUE_APP_TITLE = 若依管理系统
|
VUE_APP_TITLE = 智能车联管理系统
|
||||||
|
|
||||||
NODE_ENV = production
|
NODE_ENV = production
|
||||||
|
|
||||||
|
|
|
@ -1,8 +1,8 @@
|
||||||
{
|
{
|
||||||
"name": "muyu",
|
"name": "muyu",
|
||||||
"version": "3.6.3",
|
"version": "3.6.3",
|
||||||
"description": "若依管理系统",
|
"description": "车联网管理系统",
|
||||||
"author": "若依",
|
"author": "车联",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"dev": "vue-cli-service serve",
|
"dev": "vue-cli-service serve",
|
||||||
|
@ -36,6 +36,7 @@
|
||||||
"url": "https://gitee.com/y_project/MuYu-Cloud.git"
|
"url": "https://gitee.com/y_project/MuYu-Cloud.git"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"@amap/amap-jsapi-loader": "^1.0.1",
|
||||||
"@riophae/vue-treeselect": "0.4.0",
|
"@riophae/vue-treeselect": "0.4.0",
|
||||||
"axios": "0.24.0",
|
"axios": "0.24.0",
|
||||||
"clipboard": "2.0.8",
|
"clipboard": "2.0.8",
|
||||||
|
@ -53,6 +54,7 @@
|
||||||
"screenfull": "5.0.2",
|
"screenfull": "5.0.2",
|
||||||
"sortablejs": "1.10.2",
|
"sortablejs": "1.10.2",
|
||||||
"vue": "2.6.12",
|
"vue": "2.6.12",
|
||||||
|
"vue-amap": "^0.5.10",
|
||||||
"vue-count-to": "1.0.13",
|
"vue-count-to": "1.0.13",
|
||||||
"vue-cropper": "0.5.5",
|
"vue-cropper": "0.5.5",
|
||||||
"vue-meta": "2.4.0",
|
"vue-meta": "2.4.0",
|
||||||
|
|
|
@ -0,0 +1,9 @@
|
||||||
|
import request from "@/utils/request";
|
||||||
|
|
||||||
|
export function listEmployes(query) {
|
||||||
|
return request({
|
||||||
|
url: '/coupletEnterprisemanagement/employee/employeeList',
|
||||||
|
method: 'post',
|
||||||
|
data: query
|
||||||
|
})
|
||||||
|
}
|
|
@ -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'
|
||||||
|
})
|
||||||
|
}
|
|
@ -0,0 +1,51 @@
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
// 查询部门列表
|
||||||
|
export function listManage(query) {
|
||||||
|
return request({
|
||||||
|
url: '/coupletEnterprisemanagement/manage/manageList',
|
||||||
|
method: 'POST',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 查询部门列表(排除节点)
|
||||||
|
export function listManageExcludeChild(deptId) {
|
||||||
|
return request({
|
||||||
|
url: '/coupletEnterprisemanagement/manage/list/exclude/' + deptId,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 查询部门详细
|
||||||
|
export function getManage(deptId) {
|
||||||
|
return request({
|
||||||
|
url: '/coupletEnterprisemanagement/manage/' + deptId,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 新增部门
|
||||||
|
export function addManage(data) {
|
||||||
|
return request({
|
||||||
|
url: '/coupletEnterprisemanagement/manage',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 修改部门
|
||||||
|
export function updateManage(data) {
|
||||||
|
return request({
|
||||||
|
url: '/coupletEnterprisemanagement/manage ',
|
||||||
|
method: 'put',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 删除部门
|
||||||
|
export function delManage(deptId) {
|
||||||
|
return request({
|
||||||
|
url: '/coupletEnterprisemanagement/manage/' + deptId,
|
||||||
|
method: 'delete'
|
||||||
|
})
|
||||||
|
}
|
|
@ -0,0 +1,19 @@
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
// 查询车辆列表
|
||||||
|
export function list(vehicleListParams) {
|
||||||
|
return request({
|
||||||
|
url: '/vehicle/vehicle/list',
|
||||||
|
method: 'post',
|
||||||
|
data: vehicleListParams
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
//根据车辆id进行删除
|
||||||
|
export function deleteById(vehicleId) {
|
||||||
|
return request({
|
||||||
|
url: '/vehicle/vehicle/deleteById/' + vehicleId,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
27
src/main.js
27
src/main.js
|
@ -37,6 +37,10 @@ import DictTag from '@/components/DictTag'
|
||||||
import VueMeta from 'vue-meta'
|
import VueMeta from 'vue-meta'
|
||||||
// 字典数据组件
|
// 字典数据组件
|
||||||
import DictData from '@/components/DictData'
|
import DictData from '@/components/DictData'
|
||||||
|
// 高德地图
|
||||||
|
import AMapLoader from "@amap/amap-jsapi-loader"
|
||||||
|
import VueAMap from "vue-amap";
|
||||||
|
|
||||||
|
|
||||||
// 全局方法挂载
|
// 全局方法挂载
|
||||||
Vue.prototype.getDicts = getDicts
|
Vue.prototype.getDicts = getDicts
|
||||||
|
@ -84,3 +88,26 @@ new Vue({
|
||||||
store,
|
store,
|
||||||
render: h => h(App)
|
render: h => h(App)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// 高德地图
|
||||||
|
|
||||||
|
Vue.use(VueAMap);
|
||||||
|
|
||||||
|
// 初始化vue-amap
|
||||||
|
VueAMap.initAMapApiLoader({
|
||||||
|
// 高德的key
|
||||||
|
key: "b5f283177b02e0bdd7f4981f4f219432", // 换成你自己的key,这是我随便写的
|
||||||
|
// 插件集合
|
||||||
|
plugin: [
|
||||||
|
"AMap.Autocomplete",
|
||||||
|
"AMap.PlaceSearch",
|
||||||
|
"AMap.Scale",
|
||||||
|
"AMap.OverView",
|
||||||
|
"AMap.ToolBar",
|
||||||
|
"AMap.MapType",
|
||||||
|
"AMap.PolyEditor",
|
||||||
|
"AMap.CircleEditor",
|
||||||
|
],
|
||||||
|
// 高德 sdk 版本,默认为 1.4.4
|
||||||
|
v: "1.4.4",
|
||||||
|
});
|
||||||
|
|
|
@ -73,6 +73,7 @@ export const constantRoutes = [
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
path: '/user',
|
path: '/user',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
|
|
|
@ -0,0 +1,701 @@
|
||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<el-row :gutter="20">
|
||||||
|
<!--部门数据-->
|
||||||
|
<el-col :span="4" :xs="24">
|
||||||
|
<div class="head-container">
|
||||||
|
<el-input
|
||||||
|
v-model="deptName"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入部门名称"
|
||||||
|
prefix-icon="el-icon-search"
|
||||||
|
size="small"
|
||||||
|
style="margin-bottom: 20px"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="head-container">
|
||||||
|
<el-tree
|
||||||
|
ref="tree"
|
||||||
|
:data="deptOptions"
|
||||||
|
:expand-on-click-node="false"
|
||||||
|
:filter-node-method="filterNode"
|
||||||
|
:props="defaultProps"
|
||||||
|
default-expand-all
|
||||||
|
highlight-current
|
||||||
|
node-key="id"
|
||||||
|
@node-click="handleNodeClick"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</el-col>
|
||||||
|
<!--用户数据-->
|
||||||
|
<el-col :span="20" :xs="24">
|
||||||
|
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="68px"
|
||||||
|
size="small">
|
||||||
|
<el-form-item label="用户名称" prop="userName">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.userName"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入用户名称"
|
||||||
|
style="width: 240px"
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="手机号码" prop="phonenumber">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.phonenumber"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入手机号码"
|
||||||
|
style="width: 240px"
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="状态" prop="status">
|
||||||
|
<el-select
|
||||||
|
v-model="queryParams.status"
|
||||||
|
clearable
|
||||||
|
placeholder="用户状态"
|
||||||
|
style="width: 240px"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="dict in dict.type.sys_normal_disable"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.label"
|
||||||
|
:value="dict.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="创建时间">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="dateRange"
|
||||||
|
end-placeholder="结束日期"
|
||||||
|
range-separator="-"
|
||||||
|
start-placeholder="开始日期"
|
||||||
|
style="width: 240px"
|
||||||
|
type="daterange"
|
||||||
|
value-format="yyyy-MM-dd"
|
||||||
|
></el-date-picker>
|
||||||
|
</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-form-item>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
<el-row :gutter="10" class="mb8">
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
v-hasPermi="['system:user:add']"
|
||||||
|
icon="el-icon-plus"
|
||||||
|
plain
|
||||||
|
size="mini"
|
||||||
|
type="primary"
|
||||||
|
@click="handleAdd"
|
||||||
|
>新增
|
||||||
|
</el-button>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
v-hasPermi="['system:user:edit']"
|
||||||
|
:disabled="single"
|
||||||
|
icon="el-icon-edit"
|
||||||
|
plain
|
||||||
|
size="mini"
|
||||||
|
type="success"
|
||||||
|
@click="handleUpdate"
|
||||||
|
>修改
|
||||||
|
</el-button>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
v-hasPermi="['system:user:remove']"
|
||||||
|
:disabled="multiple"
|
||||||
|
icon="el-icon-delete"
|
||||||
|
plain
|
||||||
|
size="mini"
|
||||||
|
type="danger"
|
||||||
|
@click="handleDelete"
|
||||||
|
>删除
|
||||||
|
</el-button>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
v-hasPermi="['system:user:import']"
|
||||||
|
icon="el-icon-upload2"
|
||||||
|
plain
|
||||||
|
size="mini"
|
||||||
|
type="info"
|
||||||
|
@click="handleImport"
|
||||||
|
>导入
|
||||||
|
</el-button>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
v-hasPermi="['system:user:export']"
|
||||||
|
icon="el-icon-download"
|
||||||
|
plain
|
||||||
|
size="mini"
|
||||||
|
type="warning"
|
||||||
|
@click="handleExport"
|
||||||
|
>导出
|
||||||
|
</el-button>
|
||||||
|
</el-col>
|
||||||
|
<right-toolbar :columns="columns" :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||||
|
</el-row>
|
||||||
|
|
||||||
|
<el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
|
||||||
|
<el-table-column align="center" type="selection" width="50"/>
|
||||||
|
<el-table-column v-if="columns[0].visible" key="userId" align="center" label="用户编号" prop="userId"/>
|
||||||
|
<el-table-column v-if="columns[1].visible" key="userName" :show-overflow-tooltip="true" align="center" label="用户名称"
|
||||||
|
prop="userName"/>
|
||||||
|
<el-table-column v-if="columns[2].visible" key="nickName" :show-overflow-tooltip="true" align="center" label="用户昵称"
|
||||||
|
prop="nickName"/>
|
||||||
|
<el-table-column v-if="columns[3].visible" key="deptName" :show-overflow-tooltip="true" align="center" label="部门"
|
||||||
|
prop="dept.deptName"/>
|
||||||
|
<el-table-column v-if="columns[4].visible" key="phonenumber" align="center" label="手机号码"
|
||||||
|
prop="phonenumber" width="120"/>
|
||||||
|
<el-table-column v-if="columns[5].visible" key="status" align="center" label="状态">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-switch
|
||||||
|
v-model="scope.row.status"
|
||||||
|
active-value="0"
|
||||||
|
inactive-value="1"
|
||||||
|
@change="handleStatusChange(scope.row)"
|
||||||
|
></el-switch>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column v-if="columns[6].visible" align="center" label="创建时间" prop="createTime" width="160">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
align="center"
|
||||||
|
class-name="small-padding fixed-width"
|
||||||
|
label="操作"
|
||||||
|
width="160"
|
||||||
|
>
|
||||||
|
<template v-if="scope.row.userId !== 1" slot-scope="scope">
|
||||||
|
<el-button
|
||||||
|
v-hasPermi="['system:user:edit']"
|
||||||
|
icon="el-icon-edit"
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
@click="handleUpdate(scope.row)"
|
||||||
|
>修改
|
||||||
|
</el-button>
|
||||||
|
<el-button
|
||||||
|
v-hasPermi="['system:user:remove']"
|
||||||
|
icon="el-icon-delete"
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
@click="handleDelete(scope.row)"
|
||||||
|
>删除
|
||||||
|
</el-button>
|
||||||
|
<el-dropdown v-hasPermi="['system:user:resetPwd', 'system:user:edit']" size="mini"
|
||||||
|
@command="(command) => handleCommand(command, scope.row)">
|
||||||
|
<el-button icon="el-icon-d-arrow-right" size="mini" type="text">更多</el-button>
|
||||||
|
<el-dropdown-menu slot="dropdown">
|
||||||
|
<el-dropdown-item v-hasPermi="['system:user:resetPwd']" command="handleResetPwd"
|
||||||
|
icon="el-icon-key">重置密码
|
||||||
|
</el-dropdown-item>
|
||||||
|
<el-dropdown-item v-hasPermi="['system:user:edit']" command="handleAuthRole"
|
||||||
|
icon="el-icon-circle-check">分配角色
|
||||||
|
</el-dropdown-item>
|
||||||
|
</el-dropdown-menu>
|
||||||
|
</el-dropdown>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
|
||||||
|
<pagination
|
||||||
|
v-show="total>0"
|
||||||
|
:limit.sync="queryParams.pageSize"
|
||||||
|
:page.sync="queryParams.pageNum"
|
||||||
|
:total="total"
|
||||||
|
@pagination="getList"
|
||||||
|
/>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
|
||||||
|
<!-- 添加或修改用户配置对话框 -->
|
||||||
|
<el-dialog :title="title" :visible.sync="open" append-to-body width="600px">
|
||||||
|
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="用户昵称" prop="nickName">
|
||||||
|
<el-input v-model="form.nickName" maxlength="30" placeholder="请输入用户昵称"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="归属部门" prop="deptId">
|
||||||
|
<treeselect v-model="form.deptId" :options="deptOptions" :show-count="true" placeholder="请选择归属部门"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="手机号码" prop="phonenumber">
|
||||||
|
<el-input v-model="form.phonenumber" maxlength="11" placeholder="请输入手机号码"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="邮箱" prop="email">
|
||||||
|
<el-input v-model="form.email" maxlength="50" placeholder="请输入邮箱"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item v-if="form.userId == undefined" label="用户名称" prop="userName">
|
||||||
|
<el-input v-model="form.userName" maxlength="30" placeholder="请输入用户名称"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item v-if="form.userId == undefined" label="用户密码" prop="password">
|
||||||
|
<el-input v-model="form.password" maxlength="20" placeholder="请输入用户密码" show-password
|
||||||
|
type="password"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="用户性别">
|
||||||
|
<el-select v-model="form.sex" placeholder="请选择性别">
|
||||||
|
<el-option
|
||||||
|
v-for="dict in dict.type.sys_user_sex"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.label"
|
||||||
|
:value="dict.value"
|
||||||
|
></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="状态">
|
||||||
|
<el-radio-group v-model="form.status">
|
||||||
|
<el-radio
|
||||||
|
v-for="dict in dict.type.sys_normal_disable"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.value"
|
||||||
|
>{{ dict.label }}
|
||||||
|
</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="岗位">
|
||||||
|
<el-select v-model="form.postIds" multiple placeholder="请选择岗位">
|
||||||
|
<el-option
|
||||||
|
v-for="item in postOptions"
|
||||||
|
:key="item.postId"
|
||||||
|
:disabled="item.status == 1"
|
||||||
|
:label="item.postName"
|
||||||
|
:value="item.postId"
|
||||||
|
></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="角色">
|
||||||
|
<el-select v-model="form.roleIds" multiple placeholder="请选择角色">
|
||||||
|
<el-option
|
||||||
|
v-for="item in roleOptions"
|
||||||
|
:key="item.roleId"
|
||||||
|
:disabled="item.status == 1"
|
||||||
|
:label="item.roleName"
|
||||||
|
:value="item.roleId"
|
||||||
|
></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="24">
|
||||||
|
<el-form-item label="备注">
|
||||||
|
<el-input v-model="form.remark" placeholder="请输入内容" type="textarea"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
<div slot="footer" class="dialog-footer">
|
||||||
|
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||||
|
<el-button @click="cancel">取 消</el-button>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
|
||||||
|
<!-- 用户导入对话框 -->
|
||||||
|
<el-dialog :title="upload.title" :visible.sync="upload.open" append-to-body width="400px">
|
||||||
|
<el-upload
|
||||||
|
ref="upload"
|
||||||
|
:action="upload.url + '?updateSupport=' + upload.updateSupport"
|
||||||
|
:auto-upload="false"
|
||||||
|
:disabled="upload.isUploading"
|
||||||
|
:headers="upload.headers"
|
||||||
|
:limit="1"
|
||||||
|
:on-progress="handleFileUploadProgress"
|
||||||
|
:on-success="handleFileSuccess"
|
||||||
|
accept=".xlsx, .xls"
|
||||||
|
drag
|
||||||
|
>
|
||||||
|
<i class="el-icon-upload"></i>
|
||||||
|
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
|
||||||
|
<div slot="tip" class="el-upload__tip text-center">
|
||||||
|
<div slot="tip" class="el-upload__tip">
|
||||||
|
<el-checkbox v-model="upload.updateSupport"/>
|
||||||
|
是否更新已经存在的用户数据
|
||||||
|
</div>
|
||||||
|
<span>仅允许导入xls、xlsx格式文件。</span>
|
||||||
|
<el-link :underline="false" style="font-size:12px;vertical-align: baseline;" type="primary"
|
||||||
|
@click="importTemplate">下载模板
|
||||||
|
</el-link>
|
||||||
|
</div>
|
||||||
|
</el-upload>
|
||||||
|
<div slot="footer" class="dialog-footer">
|
||||||
|
<el-button type="primary" @click="submitFileForm">确 定</el-button>
|
||||||
|
<el-button @click="upload.open = false">取 消</el-button>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
addUser,
|
||||||
|
changeUserStatus,
|
||||||
|
delUser,
|
||||||
|
deptTreeSelect,
|
||||||
|
getUser,
|
||||||
|
listUser,
|
||||||
|
resetUserPwd,
|
||||||
|
updateUser
|
||||||
|
} from "@/api/system/user";
|
||||||
|
import {getToken} from "@/utils/auth";
|
||||||
|
import Treeselect from "@riophae/vue-treeselect";
|
||||||
|
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
||||||
|
import {listEmployes} from "@/api/couplet/employes";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "User",
|
||||||
|
dicts: ['sys_normal_disable', 'sys_user_sex'],
|
||||||
|
components: {Treeselect},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
// 遮罩层
|
||||||
|
loading: true,
|
||||||
|
// 选中数组
|
||||||
|
ids: [],
|
||||||
|
// 非单个禁用
|
||||||
|
single: true,
|
||||||
|
// 非多个禁用
|
||||||
|
multiple: true,
|
||||||
|
// 显示搜索条件
|
||||||
|
showSearch: true,
|
||||||
|
// 总条数
|
||||||
|
total: 0,
|
||||||
|
// 用户表格数据
|
||||||
|
userList: null,
|
||||||
|
// 弹出层标题
|
||||||
|
title: "",
|
||||||
|
// 部门树选项
|
||||||
|
deptOptions: undefined,
|
||||||
|
// 是否显示弹出层
|
||||||
|
open: false,
|
||||||
|
// 部门名称
|
||||||
|
deptName: undefined,
|
||||||
|
// 默认密码
|
||||||
|
initPassword: undefined,
|
||||||
|
// 日期范围
|
||||||
|
dateRange: [],
|
||||||
|
// 岗位选项
|
||||||
|
postOptions: [],
|
||||||
|
// 角色选项
|
||||||
|
roleOptions: [],
|
||||||
|
// 表单参数
|
||||||
|
form: {},
|
||||||
|
defaultProps: {
|
||||||
|
children: "children",
|
||||||
|
label: "label"
|
||||||
|
},
|
||||||
|
// 用户导入参数
|
||||||
|
upload: {
|
||||||
|
// 是否显示弹出层(用户导入)
|
||||||
|
open: false,
|
||||||
|
// 弹出层标题(用户导入)
|
||||||
|
title: "",
|
||||||
|
// 是否禁用上传
|
||||||
|
isUploading: false,
|
||||||
|
// 是否更新已经存在的用户数据
|
||||||
|
updateSupport: 0,
|
||||||
|
// 设置上传的请求头部
|
||||||
|
headers: {Authorization: "Bearer " + getToken()},
|
||||||
|
// 上传的地址
|
||||||
|
url: process.env.VUE_APP_BASE_API + "/system/user/importData"
|
||||||
|
},
|
||||||
|
// 查询参数
|
||||||
|
queryParams: {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
userName: undefined,
|
||||||
|
phonenumber: undefined,
|
||||||
|
status: undefined,
|
||||||
|
deptId: undefined
|
||||||
|
},
|
||||||
|
// 列信息
|
||||||
|
columns: [
|
||||||
|
{key: 0, label: `用户编号`, visible: true},
|
||||||
|
{key: 1, label: `用户名称`, visible: true},
|
||||||
|
{key: 2, label: `用户昵称`, visible: true},
|
||||||
|
{key: 3, label: `部门`, visible: true},
|
||||||
|
{key: 4, label: `手机号码`, visible: true},
|
||||||
|
{key: 5, label: `状态`, visible: true},
|
||||||
|
{key: 6, label: `创建时间`, visible: true}
|
||||||
|
],
|
||||||
|
// 表单校验
|
||||||
|
rules: {
|
||||||
|
userName: [
|
||||||
|
{required: true, message: "用户名称不能为空", trigger: "blur"},
|
||||||
|
{min: 2, max: 20, message: '用户名称长度必须介于 2 和 20 之间', trigger: 'blur'}
|
||||||
|
],
|
||||||
|
nickName: [
|
||||||
|
{required: true, message: "用户昵称不能为空", trigger: "blur"}
|
||||||
|
],
|
||||||
|
password: [
|
||||||
|
{required: true, message: "用户密码不能为空", trigger: "blur"},
|
||||||
|
{min: 5, max: 20, message: '用户密码长度必须介于 5 和 20 之间', trigger: 'blur'}
|
||||||
|
],
|
||||||
|
email: [
|
||||||
|
{
|
||||||
|
type: "email",
|
||||||
|
message: "请输入正确的邮箱地址",
|
||||||
|
trigger: ["blur", "change"]
|
||||||
|
}
|
||||||
|
],
|
||||||
|
phonenumber: [
|
||||||
|
{
|
||||||
|
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
|
||||||
|
message: "请输入正确的手机号码",
|
||||||
|
trigger: "blur"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
};
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
// 根据名称筛选部门树
|
||||||
|
deptName(val) {
|
||||||
|
this.$refs.tree.filter(val);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getList();
|
||||||
|
this.getDeptTree();
|
||||||
|
this.getConfigKey("sys.user.initPassword").then(response => {
|
||||||
|
this.initPassword = response.data.msg;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
/** 查询用户列表 */
|
||||||
|
getList() {
|
||||||
|
this.loading = true;
|
||||||
|
listEmployes(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
|
||||||
|
this.userList = response.data.rows;
|
||||||
|
this.total = response.data.total;
|
||||||
|
this.loading = false;
|
||||||
|
}
|
||||||
|
);
|
||||||
|
},
|
||||||
|
/** 查询部门下拉树结构 */
|
||||||
|
getDeptTree() {
|
||||||
|
deptTreeSelect().then(response => {
|
||||||
|
this.deptOptions = response.data;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 筛选节点
|
||||||
|
filterNode(value, data) {
|
||||||
|
if (!value) return true;
|
||||||
|
return data.label.indexOf(value) !== -1;
|
||||||
|
},
|
||||||
|
// 节点单击事件
|
||||||
|
handleNodeClick(data) {
|
||||||
|
this.queryParams.deptId = data.id;
|
||||||
|
this.handleQuery();
|
||||||
|
},
|
||||||
|
// 用户状态修改
|
||||||
|
handleStatusChange(row) {
|
||||||
|
let text = row.status === "0" ? "启用" : "停用";
|
||||||
|
this.$modal.confirm('确认要"' + text + '""' + row.userName + '"用户吗?').then(function () {
|
||||||
|
return changeUserStatus(row.userId, row.status);
|
||||||
|
}).then(() => {
|
||||||
|
this.$modal.msgSuccess(text + "成功");
|
||||||
|
}).catch(function () {
|
||||||
|
row.status = row.status === "0" ? "1" : "0";
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 取消按钮
|
||||||
|
cancel() {
|
||||||
|
this.open = false;
|
||||||
|
this.reset();
|
||||||
|
},
|
||||||
|
// 表单重置
|
||||||
|
reset() {
|
||||||
|
this.form = {
|
||||||
|
userId: undefined,
|
||||||
|
deptId: undefined,
|
||||||
|
userName: undefined,
|
||||||
|
nickName: undefined,
|
||||||
|
password: undefined,
|
||||||
|
phonenumber: undefined,
|
||||||
|
email: undefined,
|
||||||
|
sex: undefined,
|
||||||
|
status: "0",
|
||||||
|
remark: undefined,
|
||||||
|
postIds: [],
|
||||||
|
roleIds: []
|
||||||
|
};
|
||||||
|
this.resetForm("form");
|
||||||
|
},
|
||||||
|
/** 搜索按钮操作 */
|
||||||
|
handleQuery() {
|
||||||
|
this.queryParams.pageNum = 1;
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
/** 重置按钮操作 */
|
||||||
|
resetQuery() {
|
||||||
|
this.dateRange = [];
|
||||||
|
this.resetForm("queryForm");
|
||||||
|
this.queryParams.deptId = undefined;
|
||||||
|
this.$refs.tree.setCurrentKey(null);
|
||||||
|
this.handleQuery();
|
||||||
|
},
|
||||||
|
// 多选框选中数据
|
||||||
|
handleSelectionChange(selection) {
|
||||||
|
this.ids = selection.map(item => item.userId);
|
||||||
|
this.single = selection.length != 1;
|
||||||
|
this.multiple = !selection.length;
|
||||||
|
},
|
||||||
|
// 更多操作触发
|
||||||
|
handleCommand(command, row) {
|
||||||
|
switch (command) {
|
||||||
|
case "handleResetPwd":
|
||||||
|
this.handleResetPwd(row);
|
||||||
|
break;
|
||||||
|
case "handleAuthRole":
|
||||||
|
this.handleAuthRole(row);
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
/** 新增按钮操作 */
|
||||||
|
handleAdd() {
|
||||||
|
this.reset();
|
||||||
|
getUser().then(response => {
|
||||||
|
this.postOptions = response.data.posts;
|
||||||
|
this.roleOptions = response.data.roles;
|
||||||
|
this.open = true;
|
||||||
|
this.title = "添加用户";
|
||||||
|
this.form.password = this.initPassword;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 修改按钮操作 */
|
||||||
|
handleUpdate(row) {
|
||||||
|
this.reset();
|
||||||
|
const userId = row.userId || this.ids;
|
||||||
|
getUser(userId).then(response => {
|
||||||
|
this.form = response.data.sysUser;
|
||||||
|
this.postOptions = response.data.posts;
|
||||||
|
this.roleOptions = response.data.roles;
|
||||||
|
this.$set(this.form, "postIds", response.data.postIds);
|
||||||
|
this.$set(this.form, "roleIds", response.data.roleIds);
|
||||||
|
this.open = true;
|
||||||
|
this.title = "修改用户";
|
||||||
|
this.form.password = "";
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 重置密码按钮操作 */
|
||||||
|
handleResetPwd(row) {
|
||||||
|
this.$prompt('请输入"' + row.userName + '"的新密码', "提示", {
|
||||||
|
confirmButtonText: "确定",
|
||||||
|
cancelButtonText: "取消",
|
||||||
|
closeOnClickModal: false,
|
||||||
|
inputPattern: /^.{5,20}$/,
|
||||||
|
inputErrorMessage: "用户密码长度必须介于 5 和 20 之间"
|
||||||
|
}).then(({value}) => {
|
||||||
|
resetUserPwd(row.userId, value).then(response => {
|
||||||
|
this.$modal.msgSuccess("修改成功,新密码是:" + value);
|
||||||
|
});
|
||||||
|
}).catch(() => {
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 分配角色操作 */
|
||||||
|
handleAuthRole: function (row) {
|
||||||
|
const userId = row.userId;
|
||||||
|
this.$router.push("/system/user-auth/role/" + userId);
|
||||||
|
},
|
||||||
|
/** 提交按钮 */
|
||||||
|
submitForm: function () {
|
||||||
|
this.$refs["form"].validate(valid => {
|
||||||
|
if (valid) {
|
||||||
|
if (this.form.userId != undefined) {
|
||||||
|
updateUser(this.form).then(response => {
|
||||||
|
this.$modal.msgSuccess("修改成功");
|
||||||
|
this.open = false;
|
||||||
|
this.getList();
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
addUser(this.form).then(response => {
|
||||||
|
this.$modal.msgSuccess("新增成功");
|
||||||
|
this.open = false;
|
||||||
|
this.getList();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 删除按钮操作 */
|
||||||
|
handleDelete(row) {
|
||||||
|
const userIds = row.userId || this.ids;
|
||||||
|
this.$modal.confirm('是否确认删除用户编号为"' + userIds + '"的数据项?').then(function () {
|
||||||
|
return delUser(userIds);
|
||||||
|
}).then(() => {
|
||||||
|
this.getList();
|
||||||
|
this.$modal.msgSuccess("删除成功");
|
||||||
|
}).catch(() => {
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 导出按钮操作 */
|
||||||
|
handleExport() {
|
||||||
|
this.download('system/user/export', {
|
||||||
|
...this.queryParams
|
||||||
|
}, `user_${new Date().getTime()}.xlsx`)
|
||||||
|
},
|
||||||
|
/** 导入按钮操作 */
|
||||||
|
handleImport() {
|
||||||
|
this.upload.title = "用户导入";
|
||||||
|
this.upload.open = true;
|
||||||
|
},
|
||||||
|
/** 下载模板操作 */
|
||||||
|
importTemplate() {
|
||||||
|
this.download('system/user/importTemplate', {}, `user_template_${new Date().getTime()}.xlsx`)
|
||||||
|
},
|
||||||
|
// 文件上传中处理
|
||||||
|
handleFileUploadProgress(event, file, fileList) {
|
||||||
|
this.upload.isUploading = true;
|
||||||
|
},
|
||||||
|
// 文件上传成功处理
|
||||||
|
handleFileSuccess(response, file, fileList) {
|
||||||
|
this.upload.open = false;
|
||||||
|
this.upload.isUploading = false;
|
||||||
|
this.$refs.upload.clearFiles();
|
||||||
|
this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.data.msg + "</div>", "导入结果", {dangerouslyUseHTMLString: true});
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
// 提交上传文件
|
||||||
|
submitFileForm() {
|
||||||
|
this.$refs.upload.submit();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
|
@ -0,0 +1,16 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>Title</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<!-- 设置高德地图安全密钥 -->
|
||||||
|
<script type="text/javascript">
|
||||||
|
window._AMapSecurityConfig = {
|
||||||
|
securityJsCode: 'd4afcbb16c37bab037fe756ffb063e51', // 你的密钥
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -0,0 +1,350 @@
|
||||||
|
<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="marker in markers"
|
||||||
|
:position="marker.position"
|
||||||
|
:events="marker.events"
|
||||||
|
:key="marker.index"
|
||||||
|
></el-amap-marker>
|
||||||
|
<el-amap-info-window
|
||||||
|
v-for="window in windows"
|
||||||
|
:offset="window.offset"
|
||||||
|
:position="window.position"
|
||||||
|
:content="window.content"
|
||||||
|
:open="window.open"
|
||||||
|
:key="window.index"
|
||||||
|
></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号",
|
||||||
|
// markers和windows数组用于存储地图标记和信息窗口的数据结构。
|
||||||
|
markers: [],
|
||||||
|
windows: [],
|
||||||
|
center: [116.39, 39.9],
|
||||||
|
zoom: 16,
|
||||||
|
// currentPosition: null, // 新增一个用于存储当前经纬度的变量
|
||||||
|
label: {
|
||||||
|
content: "自定义标题",
|
||||||
|
offset: [10, 12],
|
||||||
|
},
|
||||||
|
// 查询参数
|
||||||
|
queryParams: {},
|
||||||
|
fence: [{}],
|
||||||
|
fenceUpdateRequest:{},
|
||||||
|
fenceInsertRequest:{},
|
||||||
|
dialogFormVisible: false,
|
||||||
|
formLabelWidth: '120px',
|
||||||
|
checkAll: false,
|
||||||
|
logo: [],
|
||||||
|
logoIds:{},
|
||||||
|
// cities: cityOptions,
|
||||||
|
isIndeterminate: true,
|
||||||
|
fenceChangeState:{}
|
||||||
|
|
||||||
|
};
|
||||||
|
},
|
||||||
|
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.39, 39.9],
|
||||||
|
});
|
||||||
|
this.windows.push({
|
||||||
|
position: [116.39, 39.9],
|
||||||
|
// position: this.currentPosition,
|
||||||
|
content:
|
||||||
|
"<h2 style='font-weight: bold;width: 400px;margin: 10px'>" +
|
||||||
|
this.unit +
|
||||||
|
"</h2>" +
|
||||||
|
"<div style='margin: 10px'>" +
|
||||||
|
"地址:" +
|
||||||
|
this.address +
|
||||||
|
"</div>",
|
||||||
|
offset: [0, -20],
|
||||||
|
open: true,
|
||||||
|
});
|
||||||
|
|
||||||
|
// var map = new AMap.Map("container", {
|
||||||
|
// zoomEnable: true, //是否禁止缩放
|
||||||
|
// zoom: 12, //缩放比例
|
||||||
|
// dragEnable: false, //禁止拖动
|
||||||
|
// cursor: "hand", // 鼠标在地图上的表现形式,小手
|
||||||
|
// });
|
||||||
|
// // 初始化工具条
|
||||||
|
// map.plugin(["AMap.ToolBar"], function () {
|
||||||
|
// map.addControl(new AMap.ToolBar());
|
||||||
|
// });
|
||||||
|
},
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.queryByFenceList()
|
||||||
|
this.findByLogo()
|
||||||
|
},
|
||||||
|
//生命周期 - 挂载完成(可以访问DOM元素)",
|
||||||
|
mounted() {
|
||||||
|
this.initMap();
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.mapBox {
|
||||||
|
position: relative;
|
||||||
|
width: 50%;
|
||||||
|
height: 600px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fence-container {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
|
@ -0,0 +1,344 @@
|
||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" size="small">
|
||||||
|
<el-form-item label="部门名称" prop="deptName">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.deptName"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入部门名称"
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="状态" prop="status">
|
||||||
|
<el-select v-model="queryParams.status" clearable placeholder="部门状态">
|
||||||
|
<el-option
|
||||||
|
v-for="dict in dict.type.sys_normal_disable"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.label"
|
||||||
|
:value="dict.value"
|
||||||
|
/>
|
||||||
|
</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-form-item>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
<el-row :gutter="10" class="mb8">
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
v-hasPermi="['system:dept:add']"
|
||||||
|
icon="el-icon-plus"
|
||||||
|
plain
|
||||||
|
size="mini"
|
||||||
|
type="primary"
|
||||||
|
@click="handleAdd"
|
||||||
|
>新增
|
||||||
|
</el-button>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
icon="el-icon-sort"
|
||||||
|
plain
|
||||||
|
size="mini"
|
||||||
|
type="info"
|
||||||
|
@click="toggleExpandAll"
|
||||||
|
>展开/折叠
|
||||||
|
</el-button>
|
||||||
|
</el-col>
|
||||||
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||||
|
</el-row>
|
||||||
|
|
||||||
|
<el-table
|
||||||
|
v-if="refreshTable"
|
||||||
|
v-loading="loading"
|
||||||
|
:data="deptList"
|
||||||
|
:default-expand-all="isExpandAll"
|
||||||
|
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
|
||||||
|
row-key="deptId"
|
||||||
|
>
|
||||||
|
<el-table-column label="部门名称" prop="deptName" width="260"></el-table-column>
|
||||||
|
<el-table-column label="排序" prop="orderNum" width="200"></el-table-column>
|
||||||
|
<el-table-column label="状态" prop="status" width="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status"/>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column align="center" label="创建时间" prop="createTime" width="200">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column align="center" class-name="small-padding fixed-width" label="操作">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button
|
||||||
|
v-hasPermi="['system:dept:edit']"
|
||||||
|
icon="el-icon-edit"
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
@click="handleUpdate(scope.row)"
|
||||||
|
>修改
|
||||||
|
</el-button>
|
||||||
|
<el-button
|
||||||
|
v-hasPermi="['system:dept:add']"
|
||||||
|
icon="el-icon-plus"
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
@click="handleAdd(scope.row)"
|
||||||
|
>新增
|
||||||
|
</el-button>
|
||||||
|
<el-button
|
||||||
|
v-if="scope.row.parentId != 0"
|
||||||
|
v-hasPermi="['system:dept:remove']"
|
||||||
|
icon="el-icon-delete"
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
@click="handleDelete(scope.row)"
|
||||||
|
>删除
|
||||||
|
</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
|
||||||
|
<!-- 添加或修改部门对话框 -->
|
||||||
|
<el-dialog :title="title" :visible.sync="open" append-to-body width="600px">
|
||||||
|
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||||
|
<el-row>
|
||||||
|
<el-col v-if="form.parentId !== 0" :span="24">
|
||||||
|
<el-form-item label="上级部门" prop="parentId">
|
||||||
|
<treeselect v-model="form.parentId" :normalizer="normalizer" :options="deptOptions"
|
||||||
|
placeholder="选择上级部门"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="部门名称" prop="deptName">
|
||||||
|
<el-input v-model="form.deptName" placeholder="请输入部门名称"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="显示排序" prop="orderNum">
|
||||||
|
<el-input-number v-model="form.orderNum" :min="0" controls-position="right"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="负责人" prop="leader">
|
||||||
|
<el-input v-model="form.leader" maxlength="20" placeholder="请输入负责人"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="联系电话" prop="phone">
|
||||||
|
<el-input v-model="form.phone" maxlength="11" placeholder="请输入联系电话"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="邮箱" prop="email">
|
||||||
|
<el-input v-model="form.email" maxlength="50" placeholder="请输入邮箱"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="部门状态">
|
||||||
|
<el-radio-group v-model="form.status">
|
||||||
|
<el-radio
|
||||||
|
v-for="dict in dict.type.sys_normal_disable"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.value"
|
||||||
|
>{{ dict.label }}
|
||||||
|
</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
<div slot="footer" class="dialog-footer">
|
||||||
|
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||||
|
<el-button @click="cancel">取 消</el-button>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
import Treeselect from "@riophae/vue-treeselect";
|
||||||
|
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
||||||
|
import {addManage, delManage, getManage, listManage, listManageExcludeChild, updateManage} from "@/api/couplet/manage";
|
||||||
|
export default {
|
||||||
|
name: "Dept",
|
||||||
|
dicts: ['sys_normal_disable'],
|
||||||
|
components: {Treeselect},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
// 遮罩层
|
||||||
|
loading: true,
|
||||||
|
// 显示搜索条件
|
||||||
|
showSearch: true,
|
||||||
|
// 表格树数据
|
||||||
|
deptList: [],
|
||||||
|
// 部门树选项
|
||||||
|
deptOptions: [],
|
||||||
|
// 弹出层标题
|
||||||
|
title: "",
|
||||||
|
// 是否显示弹出层
|
||||||
|
open: false,
|
||||||
|
// 是否展开,默认全部展开
|
||||||
|
isExpandAll: true,
|
||||||
|
// 重新渲染表格状态
|
||||||
|
refreshTable: true,
|
||||||
|
// 查询参数
|
||||||
|
queryParams: {
|
||||||
|
deptName: undefined,
|
||||||
|
status: undefined
|
||||||
|
},
|
||||||
|
// 表单参数
|
||||||
|
form: {},
|
||||||
|
// 表单校验
|
||||||
|
rules: {
|
||||||
|
parentId: [
|
||||||
|
{required: true, message: "上级部门不能为空", trigger: "blur"}
|
||||||
|
],
|
||||||
|
deptName: [
|
||||||
|
{required: true, message: "部门名称不能为空", trigger: "blur"}
|
||||||
|
],
|
||||||
|
orderNum: [
|
||||||
|
{required: true, message: "显示排序不能为空", trigger: "blur"}
|
||||||
|
],
|
||||||
|
email: [
|
||||||
|
{
|
||||||
|
type: "email",
|
||||||
|
message: "请输入正确的邮箱地址",
|
||||||
|
trigger: ["blur", "change"]
|
||||||
|
}
|
||||||
|
],
|
||||||
|
phone: [
|
||||||
|
{
|
||||||
|
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
|
||||||
|
message: "请输入正确的手机号码",
|
||||||
|
trigger: "blur"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
/** 查询部门列表 */
|
||||||
|
getList() {
|
||||||
|
this.loading = true;
|
||||||
|
listManage(this.queryParams).then(response => {
|
||||||
|
this.deptList = this.handleTree(response.data, "deptId");
|
||||||
|
this.loading = false;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 转换部门数据结构 */
|
||||||
|
normalizer(node) {
|
||||||
|
if (node.children && !node.children.length) {
|
||||||
|
delete node.children;
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
id: node.deptId,
|
||||||
|
label: node.deptName,
|
||||||
|
children: node.children
|
||||||
|
};
|
||||||
|
},
|
||||||
|
// 取消按钮
|
||||||
|
cancel() {
|
||||||
|
this.open = false;
|
||||||
|
this.reset();
|
||||||
|
},
|
||||||
|
// 表单重置
|
||||||
|
reset() {
|
||||||
|
this.form = {
|
||||||
|
deptId: undefined,
|
||||||
|
parentId: undefined,
|
||||||
|
deptName: undefined,
|
||||||
|
orderNum: undefined,
|
||||||
|
leader: undefined,
|
||||||
|
phone: undefined,
|
||||||
|
email: undefined,
|
||||||
|
status: "0"
|
||||||
|
};
|
||||||
|
this.resetForm("form");
|
||||||
|
},
|
||||||
|
/** 搜索按钮操作 */
|
||||||
|
handleQuery() {
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
/** 重置按钮操作 */
|
||||||
|
resetQuery() {
|
||||||
|
this.resetForm("queryForm");
|
||||||
|
this.handleQuery();
|
||||||
|
},
|
||||||
|
/** 新增按钮操作 */
|
||||||
|
handleAdd(row) {
|
||||||
|
this.reset();
|
||||||
|
if (row != undefined) {
|
||||||
|
this.form.parentId = row.deptId;
|
||||||
|
}
|
||||||
|
this.open = true;
|
||||||
|
this.title = "添加部门";
|
||||||
|
listManage().then(response => {
|
||||||
|
this.deptOptions = this.handleTree(response.data, "deptId");
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 展开/折叠操作 */
|
||||||
|
toggleExpandAll() {
|
||||||
|
this.refreshTable = false;
|
||||||
|
this.isExpandAll = !this.isExpandAll;
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.refreshTable = true;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 修改按钮操作 */
|
||||||
|
handleUpdate(row) {
|
||||||
|
this.reset();
|
||||||
|
getManage(row.deptId).then(response => {
|
||||||
|
this.form = response.data;
|
||||||
|
this.open = true;
|
||||||
|
this.title = "修改部门";
|
||||||
|
});
|
||||||
|
listManageExcludeChild(row.deptId).then(response => {
|
||||||
|
this.deptOptions = this.handleTree(response.data, "deptId");
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 提交按钮 */
|
||||||
|
submitForm: function () {
|
||||||
|
this.$refs["form"].validate(valid => {
|
||||||
|
if (valid) {
|
||||||
|
if (this.form.deptId != undefined) {
|
||||||
|
updateManage(this.form).then(response => {
|
||||||
|
this.$modal.msgSuccess("修改成功");
|
||||||
|
this.open = false;
|
||||||
|
this.getList();
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
addManage(this.form).then(response => {
|
||||||
|
this.$modal.msgSuccess("新增成功");
|
||||||
|
this.open = false;
|
||||||
|
this.getList();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 删除按钮操作 */
|
||||||
|
handleDelete(row) {
|
||||||
|
this.$modal.confirm('是否确认删除名称为"' + row.deptName + '"的数据项?').then(function () {
|
||||||
|
return delManage(row.deptId);
|
||||||
|
}).then(() => {
|
||||||
|
this.getList();
|
||||||
|
this.$modal.msgSuccess("删除成功");
|
||||||
|
}).catch(() => {
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
|
@ -0,0 +1,170 @@
|
||||||
|
<<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="68px" size="small">
|
||||||
|
<el-form-item label="故障码" prop="troubleCode">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.troubleCode"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入故障码"
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="故障位" prop="troublePosition">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.troublePosition"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入故障位"
|
||||||
|
@keyup.enter.native="handleQuery"/>
|
||||||
|
</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-form-item>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
<el-row :gutter="10" class="mb8">
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
icon="el-icon-plus"
|
||||||
|
plain
|
||||||
|
size="mini"
|
||||||
|
type="primary"
|
||||||
|
@click="handleAdd"
|
||||||
|
>新增
|
||||||
|
</el-button>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
:disabled="single"
|
||||||
|
icon="el-icon-edit"
|
||||||
|
plain
|
||||||
|
size="mini"
|
||||||
|
type="success"
|
||||||
|
@click="handleUpd"
|
||||||
|
>修改
|
||||||
|
</el-button>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
:disabled="multiple"
|
||||||
|
icon="el-icon-delete"
|
||||||
|
plain
|
||||||
|
size="mini"
|
||||||
|
type="danger"
|
||||||
|
@click="handleDel"
|
||||||
|
>删除
|
||||||
|
</el-button>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
icon="el-icon-download"
|
||||||
|
plain
|
||||||
|
size="mini"
|
||||||
|
type="warning"
|
||||||
|
@click="handleExe"
|
||||||
|
>导出
|
||||||
|
</el-button>
|
||||||
|
</el-col>
|
||||||
|
<right-toolbar :show-search.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||||
|
</el-row>
|
||||||
|
|
||||||
|
<el-table v-loading="loading" :data="dataList" @selection-change="handleSelectionChange">
|
||||||
|
<el-table-column align="center" type="selection" width="55"/>
|
||||||
|
<el-table-column align="center" label="故障码" prop="troubleCode"/>
|
||||||
|
<el-table-column align="center" label="故障类型" prop="typeName"/>
|
||||||
|
<el-table-column align="center" label="故障位" prop="troublePosition"/>
|
||||||
|
<el-table-column align="center" label="故障值" prop="troubleValue"/>
|
||||||
|
<el-table-column align="center" label="故障标签" prop="troubleTag"/>
|
||||||
|
<el-table-column align="center" label="故障等级" prop="gradeName"/>
|
||||||
|
<el-table-column align="center" class-name="small-padding fixed-width" label="操作">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button
|
||||||
|
icon="el-icon-edit"
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
@click="handleUpdate(scope.row)"
|
||||||
|
>修改
|
||||||
|
</el-button>
|
||||||
|
<el-button
|
||||||
|
icon="el-icon-delete"
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
@click="handleDelete(scope.row)"
|
||||||
|
>删除
|
||||||
|
</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等),
|
||||||
|
//例如:import 《组件名称》 from '《组件路径》,
|
||||||
|
export default {
|
||||||
|
//import引入的组件需要注入到对象中才能使用"
|
||||||
|
components: {},
|
||||||
|
props: {},
|
||||||
|
data() {
|
||||||
|
//这里存放数据"
|
||||||
|
|
||||||
|
return {
|
||||||
|
queryParams:{troubleCode:'',troublePosition:''},
|
||||||
|
//显示搜索条件
|
||||||
|
showSearch:true,
|
||||||
|
//非单个禁用
|
||||||
|
single:true,
|
||||||
|
//非多个禁用
|
||||||
|
multiple:true
|
||||||
|
};
|
||||||
|
},
|
||||||
|
//计算属性 类似于data概念",
|
||||||
|
computed: {},
|
||||||
|
//监控data中的数据变化",
|
||||||
|
watch: {},
|
||||||
|
//方法集合",
|
||||||
|
methods: {
|
||||||
|
handleQuery() {
|
||||||
|
this.queryParams.pageNum = 1;
|
||||||
|
},
|
||||||
|
resetQuery() {
|
||||||
|
this.handleQuery()
|
||||||
|
},
|
||||||
|
handleAdd() {
|
||||||
|
|
||||||
|
},
|
||||||
|
handleUpd() {
|
||||||
|
|
||||||
|
},
|
||||||
|
handleDel() {
|
||||||
|
|
||||||
|
},
|
||||||
|
handleExe(){
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
//生命周期 - 创建完成(可以访问当前this实例)",
|
||||||
|
created() {
|
||||||
|
},
|
||||||
|
//生命周期 - 挂载完成(可以访问DOM元素)",
|
||||||
|
mounted() {
|
||||||
|
},
|
||||||
|
beforeCreate() {
|
||||||
|
}, //生命周期 - 创建之前",
|
||||||
|
beforeMount() {
|
||||||
|
}, //生命周期 - 挂载之前",
|
||||||
|
beforeUpdate() {
|
||||||
|
}, //生命周期 - 更新之前",
|
||||||
|
updated() {
|
||||||
|
}, //生命周期 - 更新之后",
|
||||||
|
beforeDestroy() {
|
||||||
|
}, //生命周期 - 销毁之前",
|
||||||
|
destroyed() {
|
||||||
|
}, //生命周期 - 销毁完成",
|
||||||
|
activated() {
|
||||||
|
} //如果页面有keep-alive缓存功能,这个函数会触发",
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
|
@ -0,0 +1,189 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<h1>车辆管理页面</h1>
|
||||||
|
<!-- {{ vehicleList }}-->
|
||||||
|
|
||||||
|
<el-table :data="vehicleList" style="width: 100%" border>
|
||||||
|
<el-table-column label="车辆id" width="90" align="center">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span style="margin-left: 10px">{{ scope.row.vehicleId }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<!-- TODO 暂时显示车辆类型id,待处理-->
|
||||||
|
<el-table-column label="车辆类型" width="90" align="center">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span style="margin-left: 10px">{{ scope.row.vehicleTypeName }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="电机厂商" width="150" align="center">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span style="margin-left: 10px">{{ scope.row.motorManufacturer }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="电池厂商" width="150" align="center">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span style="margin-left: 10px">{{ scope.row.batteryManufacturer }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="电机编号" width="180" align="center">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span style="margin-left: 10px">{{ scope.row.motorNumber }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="电池编号" width="180" align="center">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span style="margin-left: 10px">{{ scope.row.batteryNumber }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="vin码" width="180" align="center">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span style="margin-left: 10px">{{ scope.row.vin }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="车辆状态" width="120" align="center">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span style="margin-left: 10px" v-if="1==scope.row.vehicleState">
|
||||||
|
<el-tag type="success">在线</el-tag>
|
||||||
|
</span>
|
||||||
|
<span style="margin-left: 10px" v-if="0==scope.row.vehicleState">
|
||||||
|
<el-tag type="danger">离线</el-tag>
|
||||||
|
</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="操作" width="180" align="center">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button size="mini" @click="">编辑</el-button>
|
||||||
|
<el-button size="mini" type="danger" @click="deleteById(scope.row.vehicleId)">删除</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等),
|
||||||
|
//例如:import 《组件名称》 from '《组件路径》,
|
||||||
|
import {deleteById, list} from "@/api/system/vehicle";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
//import引入的组件需要注入到对象中才能使用"
|
||||||
|
components: {},
|
||||||
|
props: {},
|
||||||
|
data() {
|
||||||
|
//这里存放数据"
|
||||||
|
return {
|
||||||
|
//车辆列表
|
||||||
|
vehicleList: [],
|
||||||
|
|
||||||
|
//查询列表的入参
|
||||||
|
vehicleListParams: {
|
||||||
|
//车辆类型
|
||||||
|
vehicleType: '',
|
||||||
|
//车辆状态 0离线 1在线
|
||||||
|
vehicleState: '',
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
//编辑、新增车辆的入参
|
||||||
|
vehicle: {
|
||||||
|
//车辆id
|
||||||
|
vehicleId: '',
|
||||||
|
|
||||||
|
//车辆类型
|
||||||
|
vehicleType: '',
|
||||||
|
|
||||||
|
//电机厂商
|
||||||
|
motorManufacturer: '',
|
||||||
|
|
||||||
|
//电池厂商
|
||||||
|
batteryManufacturer: '',
|
||||||
|
|
||||||
|
//电机编号
|
||||||
|
motorNumber: '',
|
||||||
|
|
||||||
|
//电池编号
|
||||||
|
batteryNumber: '',
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
};
|
||||||
|
},
|
||||||
|
//计算属性 类似于data概念",
|
||||||
|
computed: {},
|
||||||
|
//监控data中的数据变化",
|
||||||
|
watch: {},
|
||||||
|
//方法集合",
|
||||||
|
methods: {
|
||||||
|
//获取车辆列表
|
||||||
|
getVehicleList() {
|
||||||
|
list(this.vehicleListParams).then(
|
||||||
|
res => {
|
||||||
|
this.vehicleList = res.data;
|
||||||
|
}
|
||||||
|
)
|
||||||
|
},
|
||||||
|
|
||||||
|
//根据车辆id进行删除
|
||||||
|
deleteById(vehicleId) {
|
||||||
|
this.$confirm('此操作将永久删除该数据,是否继续?', "提示", {
|
||||||
|
confirmButtonText: '确定',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning'
|
||||||
|
}).then(() => {
|
||||||
|
deleteById(vehicleId).then(
|
||||||
|
res => {
|
||||||
|
if (res.code == 200) {
|
||||||
|
//刷新列表
|
||||||
|
this.getVehicleList();
|
||||||
|
this.$message({
|
||||||
|
type: 'success',
|
||||||
|
message: '删除成功!'
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
this.$message({
|
||||||
|
type: 'error',
|
||||||
|
message: '删除失败!'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}).catch(() => {
|
||||||
|
this.$message({
|
||||||
|
type: 'info',
|
||||||
|
message: '已取消删除'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
},
|
||||||
|
//生命周期 - 创建完成(可以访问当前this实例)",
|
||||||
|
created() {
|
||||||
|
//获取车辆列表
|
||||||
|
this.getVehicleList()
|
||||||
|
},
|
||||||
|
//生命周期 - 挂载完成(可以访问DOM元素)",
|
||||||
|
mounted() {
|
||||||
|
},
|
||||||
|
beforeCreate() {
|
||||||
|
}, //生命周期 - 创建之前",
|
||||||
|
beforeMount() {
|
||||||
|
}, //生命周期 - 挂载之前",
|
||||||
|
beforeUpdate() {
|
||||||
|
}, //生命周期 - 更新之前",
|
||||||
|
updated() {
|
||||||
|
}, //生命周期 - 更新之后",
|
||||||
|
beforeDestroy() {
|
||||||
|
}, //生命周期 - 销毁之前",
|
||||||
|
destroyed() {
|
||||||
|
}, //生命周期 - 销毁完成",
|
||||||
|
activated() {
|
||||||
|
} //如果页面有keep-alive缓存功能,这个函数会触发",
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
|
@ -44,7 +44,7 @@
|
||||||
</el-row>
|
</el-row>
|
||||||
<el-row :gutter="20">
|
<el-row :gutter="20">
|
||||||
<el-col :lg="12" :sm="24" style="padding-left: 20px">
|
<el-col :lg="12" :sm="24" style="padding-left: 20px">
|
||||||
<h2>若依后台管理框架</h2>
|
<h2>车联后台管理框架</h2>
|
||||||
<p>
|
<p>
|
||||||
一直想做一款后台管理系统,看了很多优秀的开源项目但是发现没有合适自己的。于是利用空闲休息时间开始自己写一套后台系统。如此有了若依管理系统,她可以用于所有的Web应用程序,如网站管理后台,网站会员中心,CMS,CRM,OA等等,当然,您也可以对她进行深度定制,以做出更强系统。所有前端后台代码封装过后十分精简易上手,出错概率低。同时支持移动客户端访问。系统会陆续更新一些实用功能。
|
一直想做一款后台管理系统,看了很多优秀的开源项目但是发现没有合适自己的。于是利用空闲休息时间开始自己写一套后台系统。如此有了若依管理系统,她可以用于所有的Web应用程序,如网站管理后台,网站会员中心,CMS,CRM,OA等等,当然,您也可以对她进行深度定制,以做出更强系统。所有前端后台代码封装过后十分精简易上手,出错概率低。同时支持移动客户端访问。系统会陆续更新一些实用功能。
|
||||||
</p>
|
</p>
|
||||||
|
|
|
@ -7,7 +7,7 @@ function resolve(dir) {
|
||||||
|
|
||||||
const CompressionPlugin = require('compression-webpack-plugin')
|
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 // 端口
|
const port = process.env.port || process.env.npm_config_port || 80 // 端口
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue