增加车辆管理相关前端模块

config/dev.env.js

 module.exports = {
     NODE_ENV: '"development"',
-    BASE_API: '"http://localhost:8765"',
+  BASE_API: '"http://10.5.52.2:8765"',
     APP_ORIGIN: '"https://wallstreetcn.com"'
 }

config/index.js

@@ -31,13 +31,13 @@ module.exports = {
         assetsPublicPath: '/',
         proxyTable: {
           '/jwt': {
-            target: 'http://localhost:8765',
+            target: 'http://10.5.52.2:8765',
             pathRewrite: {
               '^/jwt': '/jwt'
             },
           },
           '/api':{
-            target: 'http://localhost:8765',
+            target: 'http://10.5.52.2:8765',
             pathRewrite: {
               '^/api': '/api'
             },

package.json

@@ -36,6 +36,8 @@
     "vue-router": "2.5.3",
     "vuedraggable": "2.13.1",
     "vuex": "2.3.1",
+    "vxe-utils": "^1.4.8",
+    "xe-utils": "^1.8.17",
     "xlsx": "^0.10.8"
   },
   "devDependencies": {

src/api/base_info/branch_company/index.js

+import axios from 'axios';
+import rsCode from "../../../utils/rsCode";
+import store from "../../../store";
+import {
+  getToken
+} from 'utils/auth';
+import {Message, MessageBox} from "element-ui";
+import XEUtils from 'xe-utils';//加入常用工具类
+import VXEUtils from 'vxe-utils';//加入常用工具类
+
+
+// 创建axios实例
+const fetch = axios.create({
+  baseURL: 'http://localhost:8091/vehicle', // api的base_url
+  timeout: 5000 // 请求超时时间
+});
+
+// request拦截器
+fetch.interceptors.request.use(config => {
+  // Do something before request is sent
+  if (store.getters.token) {
+    config.headers['Authorization'] = getToken(); // 让每个请求携带token--['Authorization']为自定义key 请根据实际情况自行修改
+  }
+  return config;
+}, error => {
+  // Do something with request error
+  console.log(error); // for debug
+  Promise.reject(error);
+})
+
+// respone拦截器
+fetch.interceptors.response.use(
+  response => {
+    /**
+     * 下面的注释为通过response自定义code来标示请求状态，当code返回如下情况为权限有问题，登出并返回到登录页
+     * 如通过xmlhttprequest 状态码标识 逻辑可写在下面error中
+     */
+    const res = response.data;
+    if (response.status === 401 || res.status === 40101) {
+      MessageBox.confirm('你已被登出，可以取消继续留在该页面，或者重新登录', '确定登出', {
+        confirmButtonText: '重新登录',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        store.dispatch('FedLogOut').then(() => {
+          location.reload(); // 为了重新实例化vue-router对象 避免bug
+        });
+      })
+      return Promise.reject('error');
+    }
+    if (res.status === 40301) {
+      Message({
+        message: '当前用户无相关操作权限！',
+        type: 'error',
+        duration: 5 * 1000
+      });
+      return Promise.reject('error');
+    }
+    if (res.status === 40001) {
+      Message({
+        message: '账户或密码错误！',
+        type: 'warning'
+      });
+      return Promise.reject('error');
+    }
+    if (response.status !== 200 && res.status !== 200) {
+      Message({
+        message: res.message,
+        type: 'error',
+        duration: 5 * 1000
+      });
+    } else {
+      return response.data;
+    }
+  },
+  error => {
+    // console.log(error); // for debug
+    Message({
+      message: error.message,
+      type: 'error',
+      duration: 5 * 1000
+    });
+    return Promise.reject(error);
+  }
+);
+
+export function page(query) {
+  return fetch({
+    url: '/branchCompany/page',
+    method: 'get',
+    params: query
+  });
+}
+
+export function getObj(id) {
+  return fetch({
+    url: '/branchCompany/' + id,
+    method: 'get'
+  });
+}
+
+
+export function addObj(obj) {
+  return fetch({
+    url: '/branchCompany/',
+    method: 'post',
+    data: obj
+  });
+}
+
+
+export function delObj(id) {
+  return fetch({
+    url: '/branchCompany/' + id,
+    method: 'delete'
+  })
+}
+
+export function putObj(obj) {
+  return fetch({
+    url: '/branchCompany',
+    method: 'put',
+    data: obj
+  })
+}
+
+export function getAll() {
+  return fetch({
+    url: '/branchCompany',
+    method: 'get'
+  })
+}
+
+/**
+ * 获取所有公司信息，并缓存
+ * @returns {null|*}
+ */
+export function getAllCompanyCache(resolve) {
+  let codeAndBranchCompany = store.getters.getAllCompany;
+  if (XEUtils.isEmpty(codeAndBranchCompany)) { //缓存中不存在
+    getAll().then(response => {
+      let companyList = response.data;
+      if (!companyList || companyList.length === 0) {
+        return null;
+      }
+      codeAndBranchCompany = {};
+      for (let index in companyList) {
+        codeAndBranchCompany[companyList[index].id] = companyList[index];
+      }
+      store.dispatch("cacheCompany", codeAndBranchCompany);
+      resolve(codeAndBranchCompany);
+    });
+  } else {
+    resolve(codeAndBranchCompany);
+  }
+}

src/api/base_info/constant/index.js

+import store from '../../../store';
+import rsCode from '../../../utils/rsCode';
+
+
+function loadFromServer(type) {
+  if (!type) {
+    console.error(' load constant with no type');
+    return;
+  }
+  // url : baseURL+"",//路径
+  let rs;
+  $.ajax({
+    type: 'get',
+    url: 'http://localhost:8091/vehicle/constant/type/' + type,
+    async: false,
+    dataType: 'json',
+    data: {},
+    success: function (result) {
+      // 返回数据根据结果进行相应的处理
+      if (result.code === rsCode.RS_CODE_SUC) {
+        rs = result.data;
+      } else {
+        console.log('请求常量信息出错。');
+      }
+    },
+    error: function () {
+      console.log('请求常量信息出错。');
+    }
+  });
+  return rs;
+}
+
+/**
+ * 获取对应类型、编码的常量，相关类型未缓存将缓存/5分钟后过期
+ * @param type
+ * @param code
+ * @returns {null|*}
+ */
+export function getConstantByTypeAndCode(type, code) {
+  if (!type) {
+    console.error('empty constant type');
+    return null;
+  }
+  if (!code) {
+    console.error('empty constant code');
+    return null;
+  }
+  let constantMap = store.getters.vehicleConstants(type);
+  if (!constantMap) {
+    let constants = loadFromServer(type);
+    if (!constants || constants.length === 0) {
+      return null;
+    }
+    constantMap = {};
+    for (let index in constants) {
+      constantMap[constants[index].code] = constants[index];
+    }
+    let constantMapAndType = {type, constantMap};
+    store.dispatch("cacheConstant", constantMapAndType);
+    setTimeout(() => {
+      store.dispatch("clearConstant", type);
+    }, 5 * 60 * 1000);
+  }
+  return constantMap[code];
+}
+
+export function getConstantListByType(type) {
+  if (!type) {
+    console.error('empty constant type');
+    return null;
+  }
+  let constantMap = store.getters.vehicleConstants(type);
+  if (JSON.stringify(constantMap) === '{}') {
+    let constants = loadFromServer(type);
+    if (!constants || constants.length === 0) {
+      return null;
+    }
+    constantMap = {};
+    for (let index in constants) {
+      constantMap[constants[index].code] = constants[index];
+    }
+    let constantMapAndType = {type, constantMap};
+    store.dispatch("cacheConstant", constantMapAndType);
+    setTimeout(() => {
+      store.dispatch("clearConstant", type);
+    }, 5 * 60 * 1000);
+  }
+  return constantMap;
+}

src/api/base_info/region/index.js

+import store from '../../../store';
+import rsCode from '../../../utils/rsCode';
+import baseInfo from "../../../store/modules/baseInfo";
+
+
+function loadFromServer(codes) {
+  if (!codes) {
+    console.error(' load region with no code');
+  }
+  // url : baseURL+"",//路径
+  let rs;
+  $.ajax({
+    type: 'get',
+    url: 'http://localhost:8091/vehicle/sysRegion',
+    async: false,
+    dataType: 'json',
+    data: {
+      idListJson: JSON.stringify(codes)
+    },
+    success: function (result) {
+      // 返回数据根据结果进行相应的处理
+      if (result.code === rsCode.RS_CODE_SUC) {
+        rs = result.data;
+      } else {
+        console.log('请求地区信息出错。');
+      }
+    },
+    error: function () {
+      console.log('请求地区信息出错。');
+    }
+  });
+  return rs;
+}
+
+
+function loadSonsFromServer(code) {
+  if (!code) {
+    console.error(' load region with no code');
+  }
+  // url : baseURL+"",//路径
+  let rs;
+  $.ajax({
+    type: 'get',
+    url: 'http://localhost:8091/vehicle/sysRegion/sons/' + code,
+    async: false,
+    data: {},
+    success: function (result) {
+      // 返回数据根据结果进行相应的处理
+      if (result.code === rsCode.RS_CODE_SUC) {
+        rs = result.data;
+      } else {
+        console.log('请求地区信息出错。');
+      }
+    },
+    error: function () {
+      console.log('请求地区信息出错。');
+    }
+  });
+
+  return rs;
+}
+
+export function getSonRegionByCodes(code) {
+  let actualCode = code;
+  if (!actualCode) {
+    actualCode = rsCode.REGION_CODE_CHAINA;
+  }
+
+  let sonRegions = store.getters.sonRegions(actualCode);
+  if (!sonRegions) {
+    let datas = loadSonsFromServer(actualCode);
+    store.dispatch("cacheSonRegions", {
+      code: actualCode,
+      sons: datas
+    });
+    sonRegions = datas;
+  }
+
+  // 创建axios实例
+  return sonRegions;
+}
+
+
+export function getRegionByCodes(codes) {
+  if (!codes) {
+    console.error('empty region codes');
+    return null;
+  }
+  let regions = [];
+  let hasLoaded = true;
+  for (let index in codes) {
+    let region = store.getters.region(codes[index]);
+    if (!region) {
+      hasLoaded = false;
+      break;
+    }
+    regions = [...regions, region];
+  }
+
+  if (!hasLoaded) {
+    let datas = loadFromServer(codes);
+    for (let index = datas.length - 1; index >= 0; index--) {
+      regions = [datas[index], ...regions];
+    }
+    store.dispatch("cacheRegion", regions);
+  }
+  return regions;
+}
+

src/api/vehicle/bookRecord/index.js

+import axios from 'axios';
+import store from "../../../store";
+import {
+  getToken
+} from 'utils/auth';
+import {Message, MessageBox} from "element-ui";
+
+// 创建axios实例
+const fetch = axios.create({
+  baseURL: 'http://localhost:8091/vehicle', // api的base_url
+  timeout: 5000 // 请求超时时间
+});
+
+// request拦截器
+fetch.interceptors.request.use(config => {
+  // Do something before request is sent
+  if (store.getters.token) {
+    config.headers['Authorization'] = getToken(); // 让每个请求携带token--['Authorization']为自定义key 请根据实际情况自行修改
+  }
+  return config;
+}, error => {
+  // Do something with request error
+  console.log(error); // for debug
+  Promise.reject(error);
+})
+
+// respone拦截器
+fetch.interceptors.response.use(
+  response => {
+    /**
+     * 下面的注释为通过response自定义code来标示请求状态，当code返回如下情况为权限有问题，登出并返回到登录页
+     * 如通过xmlhttprequest 状态码标识 逻辑可写在下面error中
+     */
+    const res = response.data;
+    if (response.status === 401 || res.status === 40101) {
+      MessageBox.confirm('你已被登出，可以取消继续留在该页面，或者重新登录', '确定登出', {
+        confirmButtonText: '重新登录',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        store.dispatch('FedLogOut').then(() => {
+          location.reload(); // 为了重新实例化vue-router对象 避免bug
+        });
+      })
+      return Promise.reject('error');
+    }
+    if (res.status === 40301) {
+      Message({
+        message: '当前用户无相关操作权限！',
+        type: 'error',
+        duration: 5 * 1000
+      });
+      return Promise.reject('error');
+    }
+    if (res.status === 40001) {
+      Message({
+        message: '账户或密码错误！',
+        type: 'warning'
+      });
+      return Promise.reject('error');
+    }
+    if (response.status !== 200 && res.status !== 200) {
+      Message({
+        message: res.message,
+        type: 'error',
+        duration: 5 * 1000
+      });
+    } else {
+      return response.data;
+    }
+  },
+  error => {
+    // console.log(error); // for debug
+    Message({
+      message: error.message,
+      type: 'error',
+      duration: 5 * 1000
+    });
+    return Promise.reject(error);
+  }
+);
+
+
+export function page(query) {
+  return fetch({
+    url: '/vehicleInfo/bookedRecord',
+    method: 'get',
+    params: {vehicleBookRecordQueryVoJson: JSON.stringify(query)}
+  });
+}
+
+export function getObj(id) {
+  return fetch({
+    url: '/vehicleInfo/' + id,
+    method: 'get'
+  });
+}
+
+
+export function prove(id) {
+  return fetch({
+    url: '/vehicleInfo/book/4employee/prove/' + id,
+    method: 'put'
+  });
+}
+
+export function reject(id) {
+  return fetch({
+    url: '/vehicleInfo/book/4employee/reject/' + id,
+    method: 'put'
+  });
+}
+
+export function unbook(id) {
+  return fetch({
+    url: '/vehicleInfo/unbook/4employee/' + id,
+    method: 'delete'
+  });
+}

src/api/vehicle/vehicleInfo/index.js

+import axios from 'axios';
+import store from "../../../store";
+import {Message, MessageBox} from "element-ui";
+
+import {
+  getToken
+} from 'utils/auth';
+
+
+// 创建axios实例
+const fetch = axios.create({
+  baseURL: 'http://localhost:8091/vehicle', // api的base_url
+  timeout: 5000 // 请求超时时间
+});
+
+// request拦截器
+fetch.interceptors.request.use(config => {
+  // Do something before request is sent
+  if (store.getters.token) {
+    config.headers['Authorization'] = getToken(); // 让每个请求携带token--['Authorization']为自定义key 请根据实际情况自行修改
+  }
+  return config;
+}, error => {
+  // Do something with request error
+  console.log(error); // for debug
+  Promise.reject(error);
+})
+
+// respone拦截器
+fetch.interceptors.response.use(
+  response => {
+    /**
+     * 下面的注释为通过response自定义code来标示请求状态，当code返回如下情况为权限有问题，登出并返回到登录页
+     * 如通过xmlhttprequest 状态码标识 逻辑可写在下面error中
+     */
+    const res = response.data;
+    if (response.status === 401 || res.status === 40101) {
+      MessageBox.confirm('你已被登出，可以取消继续留在该页面，或者重新登录', '确定登出', {
+        confirmButtonText: '重新登录',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        store.dispatch('FedLogOut').then(() => {
+          location.reload(); // 为了重新实例化vue-router对象 避免bug
+        });
+      })
+      return Promise.reject('error');
+    }
+    if (res.status === 40301) {
+      Message({
+        message: '当前用户无相关操作权限！',
+        type: 'error',
+        duration: 5 * 1000
+      });
+      return Promise.reject('error');
+    }
+    if (res.status === 40001) {
+      Message({
+        message: '账户或密码错误！',
+        type: 'warning'
+      });
+      return Promise.reject('error');
+    }
+    if (response.status !== 200 && res.status !== 200) {
+      Message({
+        message: res.message,
+        type: 'error',
+        duration: 5 * 1000
+      });
+    } else {
+      return response.data;
+    }
+  },
+  error => {
+    // console.log(error); // for debug
+    Message({
+      message: error.message,
+      type: 'error',
+      duration: 5 * 1000
+    });
+    return Promise.reject(error);
+  }
+);
+
+
+export function page(query) {
+  return fetch({
+    url: '/vehicleInfo/page',
+    method: 'get',
+    params: {vehiclePageQueryVoJson: query}
+  });
+}
+
+export function getObj(id) {
+  return fetch({
+    url: '/vehicleInfo/' + id,
+    method: 'get'
+  });
+}
+
+
+export function addObj(obj) {
+  return fetch({
+    url: '/vehicleInfo',
+    method: 'post',
+    data: [obj]
+  });
+}
+
+export function book(param) {
+  return fetch({
+    url: '/vehicleInfo/book/4employee',
+    method: 'post',
+    data: param
+  })
+}
+
+export function putObj(obj) {
+  return fetch({
+    url: '/vehicleInfo',
+    method: 'put',
+    data: [obj]
+  })
+}
+
+export function getBookedInfoIn2Month(vehicleId) {
+  return fetch({
+    url: '/vehicleInfo/bookedInfo/' + vehicleId,
+    method: 'get'
+  });
+}
+
+export function getBookedInfo(vehicleId, yearMonth) {
+  return fetch({
+    url: '/vehicleInfo/bookedInfo/' + vehicleId + '/' + yearMonth,
+    method: 'get'
+  });
+}

src/main.js

@@ -21,6 +21,9 @@ import errLog from 'store/errLog';// error log组件
 import './mock/index.js';  // 该项目所有请求使用mockjs模拟
 import { getToken } from 'utils/auth';
 import 'babel-polyfill';//支持IE执行原生script
+import XEUtils from 'xe-utils';//加入常用工具类
+import VXEUtils from 'vxe-utils';//加入常用工具类
+
 
 // register globally
 Vue.component('multiselect', Multiselect);
@@ -28,6 +31,7 @@ Vue.component('Sticky', Sticky);
 Vue.component('icon-svg', IconSvg)
 Vue.use(ElementUI);
 Vue.use(vueWaves);
+Vue.use(VXEUtils, XEUtils);
 
 // register global utility filters.
 Object.keys(filters).forEach(key => {

src/router/index.js

@@ -154,4 +154,37 @@ export const asyncRouterMap = [{
     name: '服务状态监控',
     authority: 'serviceZipkinManager'
   }]
-}];
+}, {
+    path: '/baseInfo',
+    component: Layout,
+    name: '基础信息',
+    icon: 'fa-user',
+    authority: 'baseInfo',
+    children: [{
+      path: 'branchCompany',
+      component: _import('baseInfo/branchCompany/index'),
+      name: '分公司管理',
+      authority: 'branchCompany'
+    }]
+  }, {
+    path: '/vehicle',
+    component: Layout,
+    name: '车辆管理',
+    icon: 'setting',
+    authority: 'vehicle',
+    children: [
+      {
+        path: 'vehicleInfo',
+        component: _import('vehicle/vehicleInfo/index'),
+        name: '车辆信息管理',
+        authority: 'vehicleInfo'
+      },
+      {
+        path: 'bookRecord',
+        component: _import('vehicle/bookRecord/index'),
+        name: '车辆信息管理',
+        authority: 'bookRecord'
+      }
+    ]
+  }
+];

src/store/getters.js

@@ -12,6 +12,33 @@ const getters = {
   setting: state => state.user.setting,
   permission_routers: state => state.permission.routers,
   addRouters: state => state.permission.addRouters,
-  permissionMenus: state => state.user.permissionMenus
+  permissionMenus: state => state.user.permissionMenus,
+  sonRegions: state => {
+    return code => {
+      if (!state.baseInfo.regions || !state.baseInfo.regions.hasOwnProperty(code)) {
+        return null;
+      }
+      return state.baseInfo.regions[code]
+    };
+  },
+  region: state => {
+    return code => {
+      if (typeof (state.baseInfo.regionAndCode) == 'undefined' || !state.baseInfo.regionAndCode.hasOwnProperty(code)) {
+        return null;
+      }
+      return state.baseInfo.regionAndCode[code]
+    };
+  },
+  vehicleConstants: state => {
+    return type => {
+      if (!state.baseInfo.vehicleConstants || !state.baseInfo.vehicleConstants.hasOwnProperty(type)) {
+        return null;
+      }
+      return state.baseInfo.vehicleConstants[type]
+    };
+  },
+  vehicleStatus: state => state.baseInfo.vehicleStatusAndCode,
+  bookRecordStatus: state => state.baseInfo.bookRecordStatusAndCode,
+  getAllCompany: state => state.baseInfo.codeAndBranchCompany
 };
 export default getters

src/store/index.js

@@ -4,6 +4,7 @@ import app from './modules/app';
 import user from './modules/user';
 import permission from './modules/permission';
 import getters from './getters';
+import baseInfo from './modules/baseInfo';
 
 Vue.use(Vuex);
 
@@ -11,7 +12,8 @@ const store = new Vuex.Store({
   modules: {
     app,
     user,
-    permission
+    permission,
+    baseInfo
   },
   getters
 });

src/store/modules/baseInfo.js

+// 以下为车辆相关常量类型的编码
+export const VEHICLE_CONSTANT_VEHICLE_BRAND = 1; // "车辆品牌"
+export const VEHICLE_CONSTANT_VEHICLE_USE = 2; // "车辆用途"
+
+export const VEHICLE_CONSTANT_BRAND_CODE_UNKOWN = 0; // 车辆品牌-未知
+export const VEHICLE_CONSTANT_USE_TYPE_UNKOWN = 0; // "车辆用途" - 未知
+
+export const VEHICLE_CONSTANT_STATUS_DISCARD = 3; // 车辆状态 - 废弃
+export const VEHICLE_CONSTANT_STATUS_NORMAL = 1; // 车辆状态 - 废弃
+
+export const BOOK_RECORD_STATUS_APPLY = 1; // 预定记录状态 - 申请中
+export const BOOK_RECORD_STATUS_PROVED = 2; // 预定记录状态 - 已通过
+
+
+const baseInfo = {
+  state: {
+    regions: {},
+    regionAndCode: {},
+    vehicleConstants: {},
+    vehicleStatusAndCode: {
+      1: {
+        code: 1,
+        val: '正常运行'
+      },
+      2: {
+        code: 2,
+        val: '维修'
+      },
+      3: {
+        code: 3,
+        val: '报废'
+      }
+    },
+    codeAndBranchCompany: {},
+    bookRecordStatusAndCode: {
+      1: {
+        code: 1,
+        val: '申请中'
+      },
+      2: {
+        code: 2,
+        val: '已通过'
+      },
+      3: {
+        code: 3,
+        val: '已归还'
+      },
+      4: {
+        code: 3,
+        val: '拒绝'
+      },
+      5: {
+        code: 5,
+        val: '逾期归还'
+      },
+      6: {
+        code: 6,
+        val: '取消预订'
+      }
+    }
+  },
+  mutations: {
+    ADD_SON_REGION: (state, sonsAndcode) => {
+      state.regions[sonsAndcode.code] = sonsAndcode.sons;
+    },
+    ADD_REGION: (state, region) => {
+      state.regionAndCode[region.id] = region;
+    },
+    ADD_CONSTANT_DATA: (state, constantMapAndType) => {
+      state.vehicleConstants[constantMapAndType.type] = constantMapAndType.constantMap;
+    },
+    REMOVE_CONSTANT_DATA: (state, type) => {
+      state.vehicleConstants[type] = null;
+    },
+    CAHCE_ALL_COMPANY: (state, companyAndCode) => {
+      state.codeAndBranchCompany = companyAndCode;
+    }
+  },
+
+  actions: {
+    // 加入子地区
+    cacheSonRegions({
+                      commit
+                    }, sonsAndcode) {
+      commit('ADD_SON_REGION', sonsAndcode);
+    },
+    // 加入地区
+    cacheRegion({
+                  commit
+                }, datas) {
+      for (let index in datas) {
+        commit('ADD_REGION', datas[index]);
+      }
+    },
+    cacheConstant({
+                    commit
+                  }, constantMapAndType) {
+      commit('ADD_CONSTANT_DATA', constantMapAndType);
+    },
+    clearConstant({
+                    commit
+                  }, type) {
+      commit('REMOVE_CONSTANT_DATA', type);
+    },
+    cacheCompany({
+                   commit
+                 }, companyAndCode) {
+      commit('CAHCE_ALL_COMPANY', companyAndCode);
+    }
+  }
+}
+
+
+export default baseInfo;

src/store/modules/permission.js

@@ -62,7 +62,6 @@ const permission = {
             menuDatas[data[i].code] = data[i];
           }
           const accessedRouters = filterAsyncRouter(asyncRouterMap, menus, menuDatas);
-          console.log(accessedRouters);
           commit('SET_ROUTERS', accessedRouters);
           resolve();
         });

src/store/modules/user.js

@@ -118,7 +118,6 @@ const user = {
           reject(error);
         });
         getMenus(state.token).then(response => {
-          console.log(response)
           commit('SET_PERMISSION_MENUS', response);
         });
       });

src/utils/dateFormattor.js

+export function formatDate(date, fmt) {
+  if (/(y+)/.test(fmt)) {
+    fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length))
+  }
+  let o = {
+    'M+': date.getMonth() + 1,
+    'd+': date.getDate(),
+    'h+': date.getHours(),
+    'm+': date.getMinutes(),
+    's+': date.getSeconds()
+  }
+  for (let k in o) {
+    if (new RegExp(`(${k})`).test(fmt)) {
+      let str = o[k] + ''
+      fmt = fmt.replace(RegExp.$1, RegExp.$1.length === 1 ? str : padLeftZero(str))
+    }
+  }
+  return fmt
+}
+
+function padLeftZero(str) {
+  return ('00' + str).substr(str.length)
+}

src/utils/dateUtils.js

+import {
+  formatDate
+} from 'utils/dateFormattor';
+
+export function toEast8Date(dateStr) {
+  if (typeof (dateStr) == 'undefined' || JSON.stringify(dateStr) === '{}') {
+    return undefined;
+  }
+  let timezone = 8; //目标时区时间，东八区
+  let offset_GMT = new Date().getTimezoneOffset(); // 本地时间和格林威治的时间差，单位为分钟
+  let nowDate = new Date(dateStr).getTime(); // 本地时间距 1970 年 1 月 1 日午夜（GMT 时间）之间的毫秒数
+  return new Date(nowDate + offset_GMT * 60 * 1000 + timezone * 60 * 60 * 1000);
+}
+
+
+export function newEast8Date() {
+  let timezone = 8; //目标时区时间，东八区
+  let offset_GMT = new Date().getTimezoneOffset(); // 本地时间和格林威治的时间差，单位为分钟
+  let nowDate = new Date().getTime(); // 本地时间距 1970 年 1 月 1 日午夜（GMT 时间）之间的毫秒数
+  return new Date(nowDate + offset_GMT * 60 * 1000 + timezone * 60 * 60 * 1000);
+}
+
+
+export function deepCopyDate(date) {
+  return toEast8Date(formatDate(date, 'yyyy-MM-dd'));
+}

src/utils/rsCode.js

+export default {
+  RS_CODE_SUC: 1,
+  code: {
+    INVALID_REST_REQ_PARAM: 100000,  //rest请求参数非法
+    VEHICLE_BOOKED_INFO_ALREADY_CHANGED: 101001,  //车辆预定信息已被修改，请刷新后继续操作
+    VEHICLE_BOOKED_RECORD_ALREADY_CHANGED: 103001, //车辆预定申请状态已被修改，请刷新后继续操作
+  },
+  msg: {
+    1: '成功',
+    100000: "rest请求参数非法",
+    101001: "车辆预定信息已被修改，请刷新后继续操作",
+    103001: "车辆预定申请状态已被修改，请刷新后继续操作"
+  }
+}

src/views/admin/group/components/groupAuthority.vue

@@ -155,13 +155,19 @@ export default {
         });
       }
     },
-    update() {
+    update() {//注意 此处对于elemtn级别的权限其实并没有保存，后端相关接口也没有实现
       this.$emit('closeAuthorityDialog');
       const nodes = this.$refs.menuTree.getCheckedNodes();
+      // const elements = this.$refs.elementTable.selection;
       const ids = [];
       for (let i = 0; i < nodes.length; i++) {
         ids.push(nodes[i].id);
       }
+      // if(elements && elements.length>0) {
+      //   for (let i = 0; i < elements.length; i++) {
+      //     ids.push(elements[i].id);
+      //   }
+      // }
       modifyMenuAuthority(this.groupId, {
         menuTrees: ids.join()
       }).then(() => {

src/views/admin/menu/components/element.vue

@@ -158,8 +158,8 @@ export default {
         },
         {
           min: 3,
-          max: 20,
-          message: '长度在 3 到 20 个字符',
+          max: 200,
+          message: '长度在 3 到 200 个字符',
           trigger: 'blur'
         }
         ],

src/views/vehicle/bookInfoViewer.vue

+<template>
+  <div>
+    <!--     查看预定信息对话框相关html元素  -->
+    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogForm4BookInfoVisible">
+      <el-form :model="form4BookInfo" ref="form4BookInfo" label-width="120px">
+        <el-form-item label="目标月份" prop="selectedMonth4BookInfo">
+          <el-date-picker
+            v-model="selectedMonth4BookInfo"
+            type="month"
+            :editable="true"
+            format="yyyy-MM"
+            placeholder="请选择目标月份"
+            @change="changeDate4BookInfo"
+          >
+          </el-date-picker>
+        </el-form-item>
+      </el-form>
+      <table cellpadding="0" cellspacing="0" style=" width: 100%; border: 2px solid rgba(131, 145, 165, 0.43) ">
+        <tbody class="el-date-table" style="">
+        <tr style="font-size: 30px">
+          <th style="font-size: 30px">日</th>
+          <th style="font-size: 30px">一</th>
+          <th style="font-size: 30px">二</th>
+          <th style="font-size: 30px">三</th>
+          <th style="font-size: 30px">四</th>
+          <th style="font-size: 30px">五</th>
+          <th style="font-size: 30px">六</th>
+        </tr>
+        <tr v-for=" row in getEevryDayThisMonth " class="el-date-table__row">
+          <td v-for=" col in row " :class="col.class" :style="col.style">
+            {{col.day}}
+            <span v-if=" col.isBooked === true "
+                  :style="{position: 'relative', fontSize: 10+'px', color: 'rgba(15, 159, 214, 0.6)', float: 'right'}">订</span>
+          </td>
+        </tr>
+        </tbody>
+      </table>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="cancel4BookInfo('form4BookInfo')">确 定</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+  import {
+    getBookedInfo
+  } from 'api/vehicle/vehicleInfo/';
+
+
+  import {
+    formatDate
+  } from 'utils/dateFormattor';
+
+  import {
+    toEast8Date,
+    deepCopyDate,
+    newEast8Date
+  } from 'utils/dateUtils';
+
+  export default {
+    name: 'bookInfoViewer',
+    data() {
+      return {
+        form4BookInfo: {
+          selectedMonth: undefined,
+          vehicle: undefined
+        },
+        pickerOptions4Apply: {
+          disabledDate: this.checkBookDate
+        },
+        dialogForm4BookInfoVisible: false,
+        curBookedInfo: undefined,
+        dialogStatus: '',
+        textMap: {
+          bookInfo: '预定信息'
+        }
+      }
+    },
+    created() {
+    },
+    computed: {
+      getEevryDayThisMonth: function () {
+        let curDate = newEast8Date();
+        let allDays = [];
+        for (curDate.setDate(0); curDate.getDay() !== 6; curDate.setDate(curDate.getDate() - 1)) {//第一天不是星期天，往上月补充
+          allDays = [...allDays, {
+            class: 'prev-month',
+            isBooked: false,
+            day: curDate.getDate(),
+            style: {fontSize: 25 + 'px'}
+          }];
+        }
+        curDate = newEast8Date();
+        curDate.setDate(1);
+        let curMonth = curDate.getMonth();
+        let maxDay = undefined;
+        for (; curDate.getMonth() <= curMonth; curDate.setDate(curDate.getDate() + 1)) {
+          maxDay = curDate.getDate();
+          let style = {fontSize: 25 + 'px'};
+          let isBooked = false;
+          if (!this.$utils.isEmpty(this.curBookedInfo) && this.$utils.isInteger(this.curBookedInfo.bookedDate)) {
+            if ((this.curBookedInfo.bookedDate & (1 << (maxDay - 1))) !== 0) {
+              style.color = 'rgba(15, 159, 214, 0.6)';
+              style.border = '2px solid rgba(15, 159, 214, 0.6)';
+              isBooked = true;
+            }
+          }
+          allDays = [...allDays, {class: 'available', isBooked: isBooked, day: maxDay, style: style}];
+        }
+
+        for (; curDate.getDay() !== 0; curDate.setDate(curDate.getDate() + 1)) { //最后一天不是星期六，往下月补充
+          allDays = [...allDays, {
+            class: 'next-month',
+            isBooked: false,
+            day: curDate.getDay(),
+            style: {fontSize: 25 + 'px'}
+          }];
+        }
+        let rs = {};
+        for (let index in allDays) {
+          let rowNo = Math.floor(index / 7);
+          if (this.$utils.isEmpty(rs[rowNo])) {
+            rs[rowNo] = [];
+          }
+          rs[rowNo] = [...rs[rowNo], allDays[index]]
+        }
+        return rs;
+      },
+      selectedMonth4BookInfo: {
+        get: function () {
+          if (this.$utils.isString(this.form4BookInfo.selectedMonth) && this.form4BookInfo.selectedMonth !== '') {
+            return toEast8Date(this.form4BookInfo.selectedMonth);
+          }
+          return undefined;
+        },
+        set: function (date) {
+          if (this.$utils.isDate(date)) {
+            this.form4BookInfo.selectedMonth = formatDate(date, 'yyyy-MM');
+          } else {
+            this.form4BookInfo.selectedMonth = undefined;
+          }
+        }
+      }
+    },
+    methods: {
+      changeDate4BookInfo: function (date) {
+        getBookedInfo(this.form4BookInfo.vehicle, date).then(response => {
+          this.curBookedInfo = response.data;
+        });
+      },
+      checkBookDate: function (time) {
+        let nowDate = newEast8Date();
+        if (this.$utils.toDateString(time, 'yyyy-MM-dd') < this.$utils.toDateString(nowDate, 'yyyy-MM-dd')) {
+          return true;
+        }
+        if (nowDate.setMonth(nowDate.getMonth() + 2) < time) {//预定范围两个月内
+          return true;
+        }
+        let curYearMonth = formatDate(time, 'yyyy-MM');
+        if (!this.$utils.isEmpty(this.getCurBookedInfo) && this.$utils.isInteger(this.getCurBookedInfo[curYearMonth])) {
+          let int4BitMap = this.getCurBookedInfo[curYearMonth];
+          let dayOfMonth = time.getDate();
+          return (int4BitMap & (1 << (dayOfMonth - 1))) != 0;
+        }
+        return false;
+      },
+      handleBookInfo(vehicleId) {
+        this.resetTemp4BookInfo();
+        this.form4BookInfo.vehicle = vehicleId;
+        getBookedInfo(vehicleId, formatDate(newEast8Date(), 'yyyy-MM'))
+          .then(response => {
+            this.curBookedInfo = response.data;
+            this.dialogStatus = 'bookInfo';
+            this.dialogForm4BookInfoVisible = true;
+          });
+      },
+      cancel4BookInfo(formName) {
+        this.dialogForm4BookInfoVisible = false;
+        this.$refs[formName].resetFields();
+      },
+      resetTemp4BookInfo() {
+        this.form4BookInfo = {
+          selectedMonth: this.$utils.toDateString(newEast8Date(), 'yyyy-MM'),
+          vehicle: undefined
+        };
+      }
+    }
+  }
+</script>