杆塔信息

src/utils/api/index.js

@@ -47,6 +47,47 @@ export function getPictureList(data){
   })
 }
 
+//杆塔信息
+//1.获取杆塔列表
+export function getTowerListApi(data) {
+  return request({
+    url: "/test/getTowerList",
+    method: "post",
+    data,
+  });
+}
+//2.获取线路编号列表
+export function getLineListApi(data) {
+  return request({
+    url: "/test/getLineList",
+    method: "post",
+    data,
+  });
+}
+//3.新增杆塔信息
+export function addTowerApi(data) {
+  return request({
+    url: "/test/addTower",
+    method: "post",
+    data,
+  });
+}
+//4.修改杆塔信息
+export function updateTowerApi(data) {
+  return request({
+    url: "/test/updateTower",
+    method: "post",
+    data,
+  });
+}
+//5.删除杆塔信息
+export function delTowerApi(data) {
+  return request({
+    url: "/test/deleteTower",
+    method: "post",
+    data,
+  });
+}
 
 //拍照时间表设置
 //1.获取任务规则列表接口

src/views/management/userEquipment/towerInformation/components/addDialog.vue

@@ -0,0 +1,111 @@
+<template>
+  <el-dialog
+    class="addLineDialog"
+    :title="title"
+    :visible.sync="isShow"
+    :close-on-click-modal="false"
+    width="470px"
+    @close="handleClose"
+  >
+    <el-form
+      label-position="left"
+      ref="formInfo"
+      label-width="100px"
+      :rules="rules"
+      :model="formdata"
+    >
+      <el-form-item label="杆塔名称：" prop="name">
+        <el-input v-model="formdata.name" autocomplete="off"></el-input>
+      </el-form-item>
+      <el-form-item label="线路编号：" prop="lineId">
+        <el-select v-model="formdata.lineId" placeholder="请选择">
+          <el-option v-for="item in lineOptions" :key="item.id" :label="item.name" :value="item.id"></el-option>
+        </el-select>
+      </el-form-item>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="isShow = false">取 消</el-button>
+      <el-button type="primary" @click="submitForm()">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+<script>
+import { getLineListApi, addTowerApi, updateTowerApi } from "@/utils/api/index";
+
+export default {
+  props: {
+    title: String,
+  },
+  data() {
+    return {
+      isShow: false,
+      lineOptions: [],
+      formdata: {},
+      rules: {
+        name: [{ required: true, message: "请输入杆塔名称", trigger: "blur" }],
+        lineId: [{ required: true, message: "请选择线路编号", trigger: "blur" }],
+      },
+    };
+  },
+  mounted() {
+    this.getLineListdata()
+  },
+  methods: {
+    getLineListdata(){
+      getLineListApi({ pageindex: 1, pagesize: 100 }).then((res) => {
+        this.lineOptions = res.data.list;
+      })
+      .catch((err) => { });
+    },
+    //判断
+    getdataform(val) {
+      if (val == null) {
+        return (this.formdata = {});
+      }
+      this.formdata = val;
+    },
+    // 保存确定操作
+    submitForm() {
+      this.$refs.formInfo.validate((valid) => {
+        if (valid) {
+          if (this.title == "新增") {
+            let formArr = [];
+            formArr.push(this.formdata);
+            addTowerApi({ list: formArr })
+              .then((res) => {
+                this.isShow = false;
+                this.$message.success("添加成功");
+                this.$parent.deviceList();
+              })
+              .catch((err) => {
+                this.$message.error("添加失败");
+              });
+          } else {
+            updateTowerApi(this.formdata)
+              .then((res) => {
+                this.isShow = false;
+                this.$message.success("修改成功");
+                this.$parent.deviceList();
+              })
+              .catch((err) => {
+                this.$message.error("修改失败");
+              });
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    display() {
+      this.isShow = true;
+    },
+    hide() {
+      this.isShow = false;
+    },
+    handleClose(){
+      this.$parent.deviceList();
+    }
+  },
+};
+</script>

src/views/management/userEquipment/towerInformation/index.vue

@@ -1,50 +1,35 @@
 <template>
-  <div class="towerInformation">
-    <div class="towerBox">
-      <div class="towerBtnGroup">
-        <el-button type="primary" icon="el-icon-plus">新增</el-button>
+  <div class="deviceInformation">
+    <div class="deviceBox">
+      <div class="deviceBtnGroup">
+        <el-button
+          type="primary"
+          icon="el-icon-plus"
+          @click.native.stop="handleAdddevice()"
+          >新增</el-button
+        >
       </div>
-      <div class="towerTable">
+      <div class="deviceTable">
         <el-table
           ref="multipleTable"
-          :data="towerTableData"
+          :data="tableDate"
           tooltip-effect="dark"
           style="width: 100%"
           height="calc(100% - 40px)"
           @selection-change="handleSelectionChange"
           @row-click="handleRowClick"
+          v-loading="loading"
         >
-          <el-table-column label="线路名称" show-overflow-tooltip>
-            <template slot-scope="scope">{{ scope.row.lineName }}</template>
-          </el-table-column>
-          <el-table-column
-            prop="lineId"
-            label="线路编号"
-            show-overflow-tooltip
-            min-width="120"
-          >
-          </el-table-column>
-          <el-table-column
-            prop="id"
-            label="id"
-            show-overflow-tooltip
-            min-width="120"
-          >
-          </el-table-column>
-
+          <!-- <el-table-column type="index" width="55"> </el-table-column>
+          <el-table-column type="selection" width="55"> </el-table-column> -->
+          <el-table-column prop="id" label="杆塔编号" show-overflow-tooltip ></el-table-column>
+          <el-table-column prop="name" label="杆塔名称" show-overflow-tooltip ></el-table-column>
+          <el-table-column prop="lineId" label="线路编号" show-overflow-tooltip ></el-table-column>
+          <el-table-column prop="lineName" label="线路名称" show-overflow-tooltip ></el-table-column>
           <el-table-column fixed="right" label="操作" width="200">
             <template slot-scope="scope">
-              <el-button
-                @click.native.stop="handleResive(scope.row)"
-                type="text"
-                >修改</el-button
-              >
-              <el-button
-                type="text"
-                class="deleteText"
-                @click.native.stop="handleDelete(scope.row)"
-                >删除</el-button
-              >
+              <el-button @click.native.stop="handleResive(scope.row)" type="text" >修改</el-button>
+              <el-button type="text" class="deleteText" @click.native.stop="handleDelete(scope.row)" >删除</el-button>
             </template>
           </el-table-column>
         </el-table>
@@ -61,49 +46,124 @@
         </div>
       </div>
     </div>
+    <!-- 新增时间表 -->
+    <addDialog :title="title" ref="addDialogref"></addDialog>
   </div>
 </template>
 <script>
+import {
+  getTowerListApi,
+  delTowerApi,
+} from "@/utils/api/index";
+import addDialog from "./components/addDialog.vue";
+
 export default {
-  components: {},
+  components: {
+    addDialog,
+  },
   data() {
     return {
-      towerTableData: [
-        {
-          id: 3,
-          name: null,
-          lineId: 108,
-          lineName: "线路",
-        },
-      ],
+      title: "", //弹窗标题
+      tableDate: [],
+      //multipleSelection: [], //获取当前选中
+      page: 1, // 当前页数
+      pageSize: 10, // 每页数量
+      total: 0, //总条数
+      loading: true,
     };
   },
-  created() {},
+  created() {
+    this.deviceList();
+  },
   methods: {
-    //获取线路列表数据
+    //获取数据列表
+    deviceList() {
+      this.loading = true;
+      getTowerListApi({
+        pageindex: this.page,
+        pagesize: this.pageSize,
+      })
+        .then((res) => {
+          this.tableDate = res.data.list;
+          this.total = res.data.total;
+          this.loading = false;
+        })
+        .catch((err) => {});
+    },
+    //点击行选中
+    handleRowClick(row, column, event) {
+      this.$refs.multipleTable.toggleRowSelection(row);
+    },
+    //获取选中的行
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+
+    // 新建
+    handleAdddevice() {
+      this.title = "新增";
+      this.$refs.addDialogref.display();
+      this.$refs.addDialogref.getdataform(null);
+    },
+
+    //修改
+    handleResive(data) {
+      this.title = "修改";
+      this.$refs.addDialogref.display();
+      this.$refs.addDialogref.getdataform(data);
+    },
+
+    //删除数据
+    handleDelete(data) {
+      let deleteArr = [];
+      deleteArr.push({
+        id: data.id,
+      });
+      this.$confirm("确定要删除记录吗,同时删除关联关系?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          delTowerApi({ list: deleteArr }).then((res) => {
+            this.deviceList(); //刷新
+          });
+          this.$message({ type: "success", message: "删除成功!" });
+        })
+        .catch(() => {
+          this.$message({ type: "info", message: "已取消删除" });
+        });
+    },
+    //点击分页
+    handleCurrentChange(val) {
+      this.page = val;
+      this.deviceList();
+    },
   },
 };
 </script>
 <style lang="less">
-.towerInformation {
+.deviceInformation {
   width: calc(100% - 32px);
   height: calc(100% - 32px);
   padding: 16px 16px;
   background: @color-white;
-  .towerBox {
+
+  .deviceBox {
     border: 1px solid #dddddd;
     height: calc(100% - 32px);
     padding: 16px;
     border-radius: 4px;
   }
-  .towerBtnGroup {
+  .deviceBtnGroup {
     display: flex;
     justify-content: flex-end;
   }
 
-  .towerTable {
+  .deviceTable {
     margin-top: 16px;
     height: calc(100% - 48px);
+    //background: #fcc;
   }
 }
 </style>