暂存

src/views/hardware/productList/index.vue

@@ -3,23 +3,57 @@
     <el-row>
       <el-col :span="2">todo 地区</el-col>
       <el-col :span="22">
-        <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
+        <el-form
+          :model="queryParams"
+          ref="queryForm"
+          :inline="true"
+          v-show="showSearch"
+          label-width="68px"
+        >
           <el-form-item label="名称" prop="productName">
-            <el-input v-model="queryParams.productName" placeholder="请输入名称" clearable size="small" style="width: 240px"
+            <el-input
-              @keyup.enter.native="handleQuery" />
+              v-model="queryParams.productName"
+              placeholder="请输入名称"
+              clearable
+              size="small"
+              style="width: 240px"
+              @keyup.enter.native="handleQuery"
+            />
           </el-form-item>
           <el-form-item>
-            <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+            <el-button
-            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+              type="cyan"
+              icon="el-icon-search"
+              size="mini"
+              @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 size="mini" type="primary" icon="el-icon-plus" @click="handleAdd" v-hasPermi="['system:product:add']">增加</el-button>
+            <el-button
+              size="mini"
+              type="primary"
+              icon="el-icon-plus"
+              @click="handleAdd"
+              v-hasPermi="['system:product:add']"
+              >增加</el-button
+            >
           </el-col>
           <el-col :span="1.5">
-            <el-button type="danger" icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
+            <el-button
-              v-hasPermi="['monitor:product:remove']">批量删除</el-button>
+              type="danger"
+              icon="el-icon-delete"
+              size="mini"
+              :disabled="multiple"
+              @click="handleDelete"
+              v-hasPermi="['monitor:product:remove']"
+              >批量删除</el-button
+            >
           </el-col>
           <!-- <el-col :span="1.5">
             <el-button type="danger" icon="el-icon-delete" size="mini" @click="handleClean" v-hasPermi="['monitor:job:remove']">清空
@@ -29,10 +63,17 @@
             <el-button type="warning" icon="el-icon-download" size="mini" @click="handleExport" v-hasPermi="['monitor:job:export']">导出
             </el-button>
           </el-col> -->
-          <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+          <right-toolbar
+            :showSearch.sync="showSearch"
+            @queryTable="getList"
+          ></right-toolbar>
         </el-row>
 
-        <el-table :data="tableData" style="width: 100%" @selection-change="handleSelectionChange">
+        <el-table
+          :data="tableData"
+          style="width: 100%"
+          @selection-change="handleSelectionChange"
+        >
           <el-table-column type="selection" width="55" align="center">
           </el-table-column>
           <el-table-column prop="productId" align="center" label="产品ID">
@@ -45,17 +86,47 @@
           </el-table-column>
           <el-table-column prop="status" align="center" label="状态">
           </el-table-column>
-          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+          <el-table-column
+            label="操作"
+            align="center"
+            class-name="small-padding fixed-width"
+          >
             <template slot-scope="scope">
-              <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:product:edit']">修改
+              <el-button
+                size="mini"
+                type="text"
+                icon="el-icon-edit"
+                @click="handleAddnode(scope.row)"
+                v-hasPermi="['system:product:addNode']"
+                >新增
               </el-button>
-              <el-button class="text-danger" size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
+              <el-button
-                v-hasPermi="['system:product:edit']">删除</el-button>
+                size="mini"
+                type="text"
+                icon="el-icon-edit"
+                @click="handleUpdate(scope.row)"
+                v-hasPermi="['system:product:edit']"
+                >修改
+              </el-button>
+              <el-button
+                class="text-danger"
+                size="mini"
+                type="text"
+                icon="el-icon-delete"
+                @click="handleDelete(scope.row)"
+                v-hasPermi="['system:product:remove']"
+                >删除</el-button
+              >
             </template>
           </el-table-column>
         </el-table>
-        <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
+        <pagination
-          @pagination="getList" />
+          v-show="total > 0"
+          :total="total"
+          :page.sync="queryParams.pageNum"
+          :limit.sync="queryParams.pageSize"
+          @pagination="getList"
+        />
       </el-col>
     </el-row>
     <!-- 添加或修改参数配置对话框 -->
@@ -82,20 +153,43 @@
         <el-button @click="cancel">取 消</el-button>
       </div>
     </el-dialog>
+    <!-- 添加节点参数配置对话框 -->
+    <el-dialog
+      :title="title"
+      :visible.sync="open1"
+      width="500px"
+      append-to-body
+    >
+      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+        <el-form-item label="节点ID" prop="nodeId">
+          <el-input v-model="form.nodeId" placeholder="请输入节点ID" />
+        </el-form-item>
+        <el-form-item label="节点名称" prop="nodeName">
+          <el-input v-model="form.nodeName" placeholder="请输入节点名称" />
+        </el-form-item>
+        <el-form-item label="产品ID" prop="productId">
+          <el-input v-model="form.productId" placeholder="请输入产品ID" />
+        </el-form-item>
+        <el-form-item label="状态">
+          <el-input v-model="form.status" />
+        </el-form-item>
+        <el-form-item label="备注">
+          <el-input v-model="form.remark" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="saveNode">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
   </section>
 </template>
 
 <script>
-import {
+import { list, get, add, update, del, addNode } from "@/api/hardware/product";
-  list,
-  get,
-  add,
-  update,
-  del,
-} from "@/api/hardware/product";
 export default {
   name: "ProductList",
-  data () {
+  data() {
     return {
       // 选中数组
       ids: [],
@@ -111,6 +205,7 @@ export default {
       title: "",
       // 是否显示弹出层
       open: false,
+      open1: false,
       labelPosition: "right",
       options: [
         {
@@ -121,7 +216,7 @@ export default {
         },
       ],
       // 表单参数
-      form: { productId: '' },
+      form: { productId: "" },
       // 总条数
       total: 0,
       value: "",
@@ -142,26 +237,32 @@ export default {
         productType: [
           { required: true, message: "产品编码不能为空", trigger: "blur" },
         ],
+        nodeId: [
+          { required: true, message: "节点ID不能为空", trigger: "blur" },
+        ],
+        nodeName: [
+          { required: true, message: "节点名称不能为空", trigger: "blur" },
+        ],
       },
     };
   },
-  created () {
+  created() {
     this.getList();
   },
   methods: {
     /** 搜索按钮操作 */
-    handleQuery () {
+    handleQuery() {
       this.queryParams.pageNum = 1;
       this.getList();
     },
     /** 重置按钮操作 */
-    resetQuery () {
+    resetQuery() {
       this.dateRange = [];
       this.resetForm("queryForm");
       this.handleQuery();
     },
     // 获取产品数据列表
-    getList () {
+    getList() {
       list(this.queryParams).then((response) => {
         this.tableData = response.rows;
         this.total = response.total;
@@ -169,13 +270,14 @@ export default {
     },
 
     // 取消按钮
-    cancel () {
+    cancel() {
       this.open = false;
+      this.open1 = false;
       // this.reset();
     },
 
     // 表单重置
-    reset () {
+    reset() {
       this.form = {
         productId: "",
         productType: "",
@@ -186,21 +288,26 @@ export default {
     },
 
     // 多选框选中数据
-    handleSelectionChange (selection) {
+    handleSelectionChange(selection) {
       this.ids = selection.map((item) => item.id);
       this.single = selection.length != 1;
       this.multiple = !selection.length;
     },
 
     /** 新增按钮操作 */
-    handleAdd () {
+    handleAdd() {
       this.reset();
       this.open = true;
       this.title = "添加产品";
     },
+    handleAddnode() {
+      this.reset();
+      this.open1 = true;
+      this.title = "添加产品节点";
+    },
 
     /** 修改按钮操作 */
-    handleUpdate (row) {
+    handleUpdate(row) {
       this.reset();
       this.form = row;
       this.open = true;
@@ -212,7 +319,7 @@ export default {
         if (valid) {
           // debugger
           if (this.form.id != undefined) {
-            updateproduct(this.form).then(res => {
+            update(this.form).then((res) => {
               if (200 == res.code) {
                 this.msgSuccess(this.title + "成功");
                 this.open = false;
@@ -220,10 +327,9 @@ export default {
               } else {
                 this.msgSuccess(res.msg);
               }
-
             });
           } else {
-            addproduct(this.form).then(res => {
+            add(this.form).then((res) => {
               if (200 == res.code) {
                 this.msgSuccess(this.title + "成功");
                 this.open = false;
@@ -236,52 +342,68 @@ export default {
         }
       });
     },
-
+    /** 节点提交操作 */
-    /** 删除按钮操作 */
+    saveNode: function () {
-    handleDelete (row) {
+      addNode(this.form).then((res) => {
-      const ids = row.id || this.ids;
-      this.$confirm('是否确认删除?', "警告", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning"
-      }).then(() => {
-        return del(ids);
-      }).catch(() => { }).then(res => {
         if (200 == res.code) {
+          this.msgSuccess(this.title + "成功");
+          this.open1 = false;
           this.getList();
-          this.msgSuccess("删除成功");
         } else {
           this.msgSuccess(res.msg);
         }
-      }).catch(res => { })
+      });
+    },
+
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$confirm("是否确认删除?", "警告", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          return del(ids);
+        })
+        .catch(() => {})
+        .then((res) => {
+          if (200 == res.code) {
+            this.getList();
+            this.msgSuccess("删除成功");
+          } else {
+            this.msgSuccess(res.msg);
+          }
+        })
+        .catch((res) => {});
     },
 
     // 页码尺寸改变
-    handleSizeChange (val) {
+    handleSizeChange(val) {
       this.queryForm.pagesize = val;
       this.getList();
     },
     // 页码改变
-    handleCurrentChange (val) {
+    handleCurrentChange(val) {
       this.queryForm.page = val;
       this.getList();
     },
     // handleSelectionChange(val) {
     //   this.multipleSelection = val;
     // },
-    handleSizeChange (val) {
+    handleSizeChange(val) {
       console.log(`每页 ${val} 条`);
     },
-    handleCurrentChange (val) {
+    handleCurrentChange(val) {
       console.log(`当前页: ${val}`);
     },
     // 对话框的关闭
-    handleClose (done) {
+    handleClose(done) {
       this.$confirm("确认关闭？")
         .then((_) => {
           done();
         })
-        .catch((_) => { });
+        .catch((_) => {});
     },
   },
 };