车辆管理

src/config/api.js

@@ -256,7 +256,24 @@ const apis = {
       method: 'get',
       url: `${commPrefix}/firstUsherRecord`
     }
+
+
   },
+  management: {
+    list: {
+      method: 'get',
+      url: `${commPrefix}/cars`
+    },
+    add: {
+      method: 'put',
+      url: `${commPrefix}/car/whitelist/:id`
+    },
+    delete: {
+      method: 'delete',
+      url: `${commPrefix}/car/whitelist/:id`
+    },
+  },
+
   visitor: {
     list: {
       method: 'get',

src/store/index.js

@@ -13,6 +13,7 @@ import sysuser from './modules/sysuser'
 import stats from './modules/stats'
 import cart from './modules/cart'
 import security from './modules/security'
+import management from './modules/management'
 import visitor from './modules/visitor' 
 import lobby from './modules/lobby'
 import followup from './modules/followup'
@@ -34,6 +35,7 @@ const store = new Vuex.Store({
     stats,
     cart,
     security,
+    management,
     visitor,
     lobby,
     followup

src/store/modules/management.js

@@ -0,0 +1,39 @@
+import lodash from 'lodash'
+import { interact,replaceApiParams } from '../../utils'
+import apis from '../../config/api'
+
+export default {
+  namespaced: true,
+  state: {
+    management : {}
+  },
+  mutations: {
+    updateManagement(state, payload) {
+      state.management  = payload || {}
+    }
+  },
+  actions: {
+    getManagement({ commit }, payload) { // 查询所有
+      const api = lodash.get(apis, 'management.list')
+      interact(api, payload).then((data) => {
+        commit('updateManagement', data)
+      })
+    },
+    addManagement ({ commit }, payload) {
+      const api = replaceApiParams(lodash.get(apis, 'management.add'), payload)
+      interact(api).then((data) => {
+        commit('updateManagement', data)
+      })
+    },
+    deleteManagement ( _, payload) {
+      return new Promise((resolve, reject) => {
+        const api = replaceApiParams(lodash.get(apis, 'management.delete'), payload)
+        interact(api).then((data) => {
+          resolve(data)
+        }).catch(() => {
+          reject()
+        })
+      })
+    }
+  }
+}

src/views/carManagement/management.vue

@@ -0,0 +1,181 @@
+<template>
+  <div id="root">
+    <el-form :inline="true" :model="formInline" class="demo-form-inline">
+      <el-form-item label="车牌">
+        <el-input v-model="formInline.plateNumber" placeholder="车牌"></el-input>
+      </el-form-item>
+      <!-- <el-form-item label="来访时间">
+        <el-date-picker
+                v-model="formInline.visiteDate"
+                type="date"
+                value-format="yyyy-MM-dd"
+                placeholder="来访时间">
+        </el-date-picker>
+      </el-form-item> -->
+      <el-form-item>
+        <el-button type="primary" @click="onSubmit">查询</el-button>
+      </el-form-item>
+    </el-form>
+    <el-table
+            :data="managementList.records"
+            border
+            style="width: 100%">
+   
+      <el-table-column
+              prop="plateNumber"
+              label="车牌"/>
+
+      <el-table-column
+              prop="carImage"
+              label="车辆图片">
+              <template slot-scope="scope">
+              <el-image
+                  style="width: 100px; height: 100px"
+                  :src="scope.row.carImage"
+                  fit="fill"></el-image>
+              </template>
+      </el-table-column>
+          <el-table-column
+              prop="color"
+              label="颜色"/>
+      <el-table-column
+              prop="carModel"
+              label="车型">
+      </el-table-column>
+            <el-table-column
+              prop="typeId"
+              label="业务类型">
+              <template slot-scope="scope">
+                <span>{{scope.row.typeId =='normal'? '正常':'内部车辆' }}</span>
+              </template>
+      </el-table-column>
+        <el-table-column
+      fixed="right"
+      label="操作">
+      <template slot-scope="scope">
+        <el-button type="text" v-if="scope.row.typeId =='normal'" @click="joinWhite(scope.row)" size="small">加入白名单</el-button>
+        <el-button type="text"  v-if="scope.row.typeId !='normal'" @click="cancelWhite(scope.row)"  size="small">取消白名单</el-button>
+      </template>
+    </el-table-column>
+      <!-- <el-table-column
+              prop="status"
+              label="状态">
+      </el-table-column>
+  
+      <el-table-column
+              prop="appointment"
+              label="创建日期">
+              <template slot-scope="scope">
+                <span>{{FormatDate(scope.row.createDate)}}</span>
+              </template>
+      </el-table-column> -->
+  
+
+    </el-table>
+    <el-pagination
+            style="margin-top:50px;float:right"
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+            :current-page="formInline.pageNum"
+            :page-sizes="[1,10, 20, 30, 40]"
+            :page-size="formInline.pageSize"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="managementList.total || 0">
+    </el-pagination>
+  </div>
+</template>
+
+<script>
+import { createNamespacedHelpers } from "vuex";
+const {
+  mapState: mapManagementState,
+  mapActions: mapManagementActions
+} = createNamespacedHelpers("management");
+
+export default {
+  name: "management-index",
+  data() {
+    return {
+      formInline: {
+        plateNumber: "",
+        recId: "",
+        visiteDate: "",
+        customerName: "",
+        phone: "",
+        pageNum: 1,
+        pageSize: 10
+      }
+    };
+  },
+  computed: {
+    ...mapManagementState({
+      managementList: x => x.management
+    })
+  },
+  created() {
+    this.getPage();
+  },
+  methods: {
+    ...mapManagementActions([
+      "getManagement",
+      "addManagement",
+      "deleteManagement"
+    ]),
+    onSubmit() {
+      this.getPage();
+    },
+    joinWhite(row) {
+      console.log(row, "id");
+        const _that = this;
+      this.$confirm("确认加入白名单?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(() => {
+        _that.addManagement({ id: row.plateNumber }).then(() => {
+          _that.getPage();
+        });
+      });
+        // this.mergePerson({ id: row.plateNumber  }).then(() => {
+        // this.$notify.success('')
+      // })
+    },
+    cancelWhite(row) {
+      const _that = this;
+      this.$confirm("确认取消白名单?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(() => {
+        _that.deleteManagement({ id: row.plateNumber }).then(() => {
+          _that.getPage();
+        });
+      });
+    },
+    getPage() {
+      this.getManagement(this.formInline);
+    },
+    handleSizeChange(val) {
+      // console.log(`每页 ${val} 条`)
+      this.formInline.pageSize = val;
+      this.getPage();
+    },
+    handleCurrentChange(val) {
+      // console.log(`当前页: ${val}`)
+      this.formInline.pageNum = val;
+      this.getPage();
+    },
+
+    FormatDate(date) {
+      if (date) {
+        return date.split("T")[0] === "0001-01-01"
+          ? ""
+          : date.split("T")[0] + "  " + date.split("T")[1];
+      } else {
+        return "";
+      }
+    }
+  }
+};
+</script>
+

src/views/index.js

@@ -137,6 +137,15 @@ const pages = [
       title: '安保记录',
     },
   },
+  {
+    path: 'management',
+    name: 'managementlist',
+    component: () => import('./carManagement/management.vue'),
+    meta: {
+      menuShow: true,
+      title: '车辆管理',
+    },
+  },
   {
     path: 'lobby',
     name: 'lobby',

vue.config.js

@@ -3,14 +3,14 @@ module.exports = {
   devServer: {
     proxy: {
       '/api': {
-        target: 'http://192.168.0.172:8080',
+        target: 'http://192.168.0.11:8080',
         changeOrigin: true,
         pathRewrite: {
           '^/api': '/'
         },
       },
       '/api/websocket': {
-        target: 'ws://localhost:8080',
+        target: 'http://192.168.0.11:8080',
         changeOrigin: true,
         ws: true,
         pathRewrite: {