员工管理前台

.env.development

@@ -1,5 +1,5 @@
 # 页面标题
-VUE_APP_TITLE = 若依管理系统
+VUE_APP_TITLE = 车联管理系统
 
 # 开发环境配置
 ENV = 'development'

.env.production

@@ -1,5 +1,5 @@
 # 页面标题
-VUE_APP_TITLE = 若依管理系统
+VUE_APP_TITLE = 系统
 
 # 生产环境配置
 ENV = 'production'

.env.staging

@@ -1,5 +1,5 @@
 # 页面标题
-VUE_APP_TITLE = 若依管理系统
+VUE_APP_TITLE = 智能车联管理系统
 
 NODE_ENV = production
 

package.json

@@ -1,8 +1,8 @@
 {
   "name": "muyu",
   "version": "3.6.3",
-  "description": "若依管理系统",
-  "author": "若依",
+  "description": "车联网管理系统",
+  "author": "车联",
   "license": "MIT",
   "scripts": {
     "dev": "vue-cli-service serve",
@@ -36,6 +36,7 @@
     "url": "https://gitee.com/y_project/MuYu-Cloud.git"
   },
   "dependencies": {
+    "@amap/amap-jsapi-loader": "^1.0.1",
     "@riophae/vue-treeselect": "0.4.0",
     "axios": "0.24.0",
     "clipboard": "2.0.8",
@@ -53,6 +54,7 @@
     "screenfull": "5.0.2",
     "sortablejs": "1.10.2",
     "vue": "2.6.12",
+    "vue-amap": "^0.5.10",
     "vue-count-to": "1.0.13",
     "vue-cropper": "0.5.5",
     "vue-meta": "2.4.0",

src/api/couplet/employes.js

@@ -0,0 +1,9 @@
+import request from "@/utils/request";
+
+export function listEmployes(query) {
+  return request({
+    url: '/coupletEnterprisemanagement/employee/employeeList',
+    method: 'post',
+    data: query
+  })
+}

src/api/couplet/fence.js

@@ -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'
+  })
+}

src/api/couplet/manage.js

@@ -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'
+  })
+}

src/api/system/vehicle.js

@@ -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'
+  })
+}
+

src/main.js

@@ -37,6 +37,10 @@ import DictTag from '@/components/DictTag'
 import VueMeta from 'vue-meta'
 // 字典数据组件
 import DictData from '@/components/DictData'
+// 高德地图
+import AMapLoader from "@amap/amap-jsapi-loader"
+import VueAMap from "vue-amap";
+
 
 // 全局方法挂载
 Vue.prototype.getDicts = getDicts
@@ -84,3 +88,26 @@ new Vue({
   store,
   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",
+});

src/router/index.js

@@ -73,6 +73,7 @@ export const constantRoutes = [
       }
     ]
   },
+
   {
     path: '/user',
     component: Layout,

src/views/couplet/employee/index.vue

@@ -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>

src/views/couplet/fence/index.html

@@ -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>

src/views/couplet/fence/index.vue

@@ -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>

src/views/couplet/manage/index.vue

@@ -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>

src/views/couplet/trouble/index.vue

@@ -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>

src/views/couplet/vehicle/index.vue

@@ -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>

src/views/index.vue

@@ -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>

vue.config.js

@@ -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 // 端口