更改车辆添加模糊操作

src/api/carList/list.js

@@ -10,4 +10,37 @@ export function carList(data) {
   })
 }
 
+//添加车辆信息管理
+export function carAdd(data) {
+  return request({
+    url: 'carBase/car/addCar',
+    method: 'post',
+    data
+  })
+}
+//修改车辆信息管理
+export function carUpd(data) {
+  return request({
+    url: 'carBase/car/updCar',
+    method: 'post',
+    data
+  })
+}
+//删除车辆信息管理
+export function carDel(vinId){
+  return request({
+    url:'carBase/car/delCar/' + vinId,
+    method:'get',
+    vinId
+  })
+}
+//导出车辆信息管理
+export function carExport(data){
+  return request({
+    url:'carBase/car/export/',
+    method:'post',
+    data
+  })
+}
+
 

src/views/allCar/catMessage.vue

@@ -1,18 +1,61 @@
 <template>
   <div>
     <el-form ref="from" :model="from" status-icon class="demo-ruleForm">
-      <el-form-item label="车辆VIN" prop="pass">
+      车辆VIN: <el-input v-model="from.carVinId" placeholder="车辆VIN" />
-        <el-input v-model="from.carVinId" type="text" autocomplete="off" />
+      车辆类型: <el-input v-model="from.carVinId" placeholder="车辆类型" />
-      </el-form-item>
+      电子围栏: <el-input v-model="from.carVinId" placeholder="电子围栏" />
-
+      车辆状态: <el-input v-model="from.carVinId" placeholder="车辆状态" />
-      <el-form-item label="车辆类型" prop="pass">
+      <br><br>
-        <el-input v-model="from.carTypeId" type="text" autocomplete="off" />
+      电机厂商: <el-input v-model="from.carVinId" placeholder="电机厂商" />
-      </el-form-item>
+      电池厂商: <el-input v-model="from.carVinId" placeholder="电池厂商" />
-
+      电机编号: <el-input v-model="from.carVinId" placeholder="电机编号" />
+      电池编号: <el-input v-model="from.carVinId" placeholder="电池编号" />
+      <br><br>
       <el-form-item>
-        <el-button type="primary" @click="submitForm('ruleForm')">提交</el-button>
+        <el-button type="primary" @click="submitForm">提交</el-button>
-        <el-button @click="resetForm('ruleForm')">重置</el-button>
+        <el-button @click="resetForm">重置</el-button>
       </el-form-item>
+
+      <el-button type="primary" @click="addCar">添加</el-button>
+      <el-button type="danger" round @click="delListCar">批量删除</el-button>
+      <el-button type="info" round @click="exportCar">导出信息</el-button>
+      <!--1111111111111111111111111111111111添加弹窗1111111111111111111111111111-->
+      <el-dialog title="添加车辆信息管理" :visible.sync="dialogFormVisible">
+        <el-form :model="form">
+          <el-form-item label="车辆VIN" :label-width="formLabelWidth">
+            <el-input v-model="form.carVinId" autocomplete="off" />
+          </el-form-item>
+          <el-form-item label="车辆类型" :label-width="formLabelWidth">
+            <el-select v-model="form.carTypeId" placeholder="请选择车辆类型">
+              <el-option label="区域一" value="shanghai" />
+              <el-option label="区域二" value="beijing" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="电子围栏" :label-width="formLabelWidth">
+            <el-select v-model="form.fenceId" placeholder="请选择电子围栏">
+              <el-option label="区域一" value="shanghai" />
+              <el-option label="区域二" value="beijing" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="电机厂商" :label-width="formLabelWidth">
+            <el-input v-model="form.motorManufacturer" autocomplete="off" />
+          </el-form-item>
+          <el-form-item label="电池厂商" :label-width="formLabelWidth">
+            <el-input v-model="form.batteryManufacturer" autocomplete="off" />
+          </el-form-item>
+          <el-form-item label="电机编号" :label-width="formLabelWidth">
+            <el-input v-model="form.motorNumber" autocomplete="off" />
+          </el-form-item>
+          <el-form-item label="电池编号" :label-width="formLabelWidth">
+            <el-input v-model="form.batteryNumber" autocomplete="off" />
+          </el-form-item>
+        </el-form>
+        <div slot="footer" class="dialog-footer">
+          <el-button @click="dialogFormVisible = false">取 消</el-button>
+          <el-button type="primary" @click="addCarDialogFormVisible">确 定</el-button>
+        </div>
+      </el-dialog>
+
     </el-form>
     <el-table :data="tableData" style="width: 100%">
 
@@ -70,7 +113,7 @@
           <!--        修改车辆信息-->
           <el-button size="mini" @click="handleEdit(scope.$index, scope.row)">修改</el-button>
           <!--        删除车辆信息-->
-          <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
+          <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row.carVinId)">删除</el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -80,7 +123,7 @@
 
 <script>
 
-import { carList } from '../../api/carList/list'
+import { carAdd, carList } from '../../api/carList/list'
 
 export default {
   name: 'CarList',
@@ -102,7 +145,19 @@ export default {
         carVinId: null,
         carTypeId: null
       },
-      tableData: []
+      // 添加表单数据
+      form: {
+        carVinId: '',
+        carTypeId: '',
+        fenceId: '',
+        status: '',
+        motorManufacturer: '',
+        batteryManufacturer: '',
+        motorNumber: '',
+        batteryNumber: ''
+      },
+      tableData: [],
+      dialogFormVisible: false
     }
   },
   created() {
@@ -117,18 +172,52 @@ export default {
         this.listLoading = false
       })
     },
-    // 实时轨迹
+    // 模糊查询提交 更新列表
+    submitForm() {
+      this.fetchData()
+    },
+    // 重置
+    resetForm() {
+      this.fetchData()
+    },
+    // 添加车辆管理信息数据
+    addCar() {
+      this.dialogFormVisible = true
+    },
+    // 添加车辆确定
+    addCarDialogFormVisible() {
+      carAdd().then(res => {
+        debugger
+        if (res.data.code === 200) {
+          this.$message({
+            type: 'success',
+            message: '添加成功'
+          })
+          this.dialogFormVisible = false
+          this.fetchData()
+        } else {
+          this.$message({
+            type: 'error',
+            message: '添加失败'
+          })
+        }
+      })
+    },
+    // 批量删除
+    delListCar() {},
+    // 实时轨迹 跳转这个表
     handleShi() {},
     // 修改
     handleEdit() {},
-    // 删除
+    // 单删除
-    handleDelete() {}
+    handleDelete(carVinId) {},
+    // 导出信息
+    exportCar() {}
   }
 }
 </script>
 <style>
  .el-input{
    width: 200px;
-   height: 100px;
  }
 </style>