平台-设备导入

src/api/device_manager.js

@@ -40,3 +40,30 @@ export const device_manager_export_id = (data) =>
  */
 export const device_manager_detail_d = (data) =>
   setRequest("device_manager/detail_d", data);
+/**
+ * 11.3.1设备导入--列表
+ */
+export const deviceAuth_list = (data) => setRequest("deviceAuth/list", data);
+/**
+ * 11.3.2设备导入--新增
+ */
+export const deviceAuth_add = (data) => setRequest("deviceAuth/add", data);
+/**
+ * 11.3.3设备导入--更新
+ */
+export const deviceAuth_edit = (data) => setRequest("deviceAuth/edit", data);
+/**
+ * 11.3.4设备导入--删除
+ */
+export const deviceAuth_delete = (data) =>
+  setRequest("deviceAuth/delete", data);
+/**
+ * 11.3.4.2设备导入--批量删除
+ */
+export const deviceAuth_batch_delete = (data) =>
+  setRequest("deviceAuth/batch_delete", data);
+/**
+ * 11.3.4.2设备导入--批量删除
+ */
+export const deviceAuth_import = (data) =>
+  setRequest("deviceAuth/import", data);

src/router/platform.js

@@ -64,6 +64,17 @@ export default {
         title: "平台管控-白名单库"
       }
     },
+    {
+      path: "deviceImport",
+      component: () =>
+        import("@/views/platformSection/deviceImport/deviceImport.vue"),
+      name: "deviceImport",
+      meta: {
+        keepAlive: true,
+        isAuth: true,
+        title: "平台管控-设备导出"
+      }
+    },
     {
       path: "deviceExport",
       component: () => import("@/views/platformSection/log/deviceExport.vue"),

src/views/platformSection/deviceImport/deviceImport.vue

@@ -0,0 +1,511 @@
+<template>
+  <div class="main_root">
+    <div class="search_header">
+      <div class="search_left">
+        <Select
+          v-model="searchForm.regionid"
+          style="margin-right: 16px; width: 150px"
+        >
+          <Option :value="0">所有区域</Option>
+          <Option
+            v-for="regionItem in searchForm.regionList"
+            :value="regionItem.regionid"
+            :key="regionItem.regionid"
+            >{{ regionItem.regionName }}</Option
+          >
+        </Select>
+        <Input
+          v-model="searchForm.sn"
+          placeholder="请输入序列号模糊搜索"
+          search
+          @on-search="searchList()"
+          style="width: 200px"
+        />
+      </div>
+      <div class="search_right">
+        <Button type="primary" class="primary_btn" @click="toImport()"
+          >导入</Button
+        >
+        <Button type="primary" class="primary_btn" @click="toAdd()"
+          >新建</Button
+        >
+        <Button type="primary" class="primary_btn" @click="toBatchDelete()"
+          >批量删除</Button
+        >
+      </div>
+    </div>
+    <div class="table_wrap">
+      <Table
+        :columns="columns"
+        :data="searchForm.list"
+        @on-selection-change="tableSelectionChange"
+      >
+        <template slot-scope="{ row }" slot="snStateSlot">
+          <div class="action_list">
+            <div class="action_success" v-if="row.snState === 0">正常</div>
+            <div class="action_error" v-else-if="row.snState === 1">注销</div>
+          </div>
+        </template>
+        <template slot-scope="{ row }" slot="actionSlot">
+          <div class="action_list">
+            <div @click="toEdit(row)">编辑</div>
+            <div class="action_del" @click="toDel(row)">删除</div>
+          </div>
+        </template>
+      </Table>
+    </div>
+    <div class="page_wrap">
+      <Page
+        :transfer="true"
+        :total="searchForm.total"
+        :current="searchForm.page"
+        :page-size="searchForm.size"
+        :page-size-opts="[10, 20, 40, 60]"
+        @on-change="pageChange"
+        @on-page-size-change="pageSizeChange"
+        show-total
+        show-sizer
+      ></Page>
+    </div>
+    <!-- 新建/编辑 -->
+    <Modal
+      class="modal1"
+      :mask-closable="false"
+      v-model="addInfo.show"
+      :title="addInfo.daid ? '编辑' : '新建'"
+    >
+      <Form
+        v-if="addInfo.show"
+        ref="addForm"
+        :model="addInfo"
+        :rules="rules"
+        :label-width="100"
+      >
+        <FormItem label="所属区域" prop="regionid">
+          <Select
+            :transfer="true"
+            v-model="addInfo.regionid"
+            placeholder="请选择所属区域"
+          >
+            <Option
+              v-for="regionItem in searchForm.regionList"
+              :value="regionItem.regionid"
+              :key="regionItem.regionid"
+              >{{ regionItem.regionName }}</Option
+            >
+          </Select>
+        </FormItem>
+        <FormItem label="SN序列号" prop="sn">
+          <Input v-model="addInfo.sn" placeholder="请输入SN序列号"></Input>
+        </FormItem>
+        <FormItem v-if="addInfo.daid" label="所属状态" prop="snState">
+          <RadioGroup v-model="addInfo.snState">
+            <Radio :label="0">正常</Radio>
+            <Radio :label="1">注销</Radio>
+          </RadioGroup>
+        </FormItem>
+      </Form>
+      <div slot="footer">
+        <Button @click="addInfo.show = false">取消</Button>
+        <Button @click="saveAddInfo()" type="primary" class="primary_btn"
+          >保存</Button
+        >
+      </div>
+    </Modal>
+    <Modal
+      class="modal1"
+      :mask-closable="false"
+      v-model="importInfo.show"
+      title="导入"
+    >
+      <Form
+        v-if="importInfo.show"
+        ref="importForm"
+        :model="importInfo"
+        :rules="rules"
+        :label-width="100"
+      >
+        <FormItem label="所属区域" prop="regionid">
+          <Select
+            :transfer="true"
+            v-model="importInfo.regionid"
+            placeholder="请选择所属区域"
+          >
+            <Option
+              v-for="regionItem in searchForm.regionList"
+              :value="regionItem.regionid"
+              :key="regionItem.regionid"
+              >{{ regionItem.regionName }}</Option
+            >
+          </Select>
+        </FormItem>
+        <FormItem label="上传文件" class="require">
+          <div style="display: flex">
+            <Upload
+              action
+              :show-upload-list="false"
+              :before-upload="
+                (file) => {
+                  upLoadExcel(file);
+                  return false;
+                }
+              "
+              accept=".xlsx,.xls"
+            >
+              <Button type="primary" class="primary_btn">上传excel</Button>
+            </Upload>
+            <div style="margin-left: 16px; color: #7c8db5">
+              支持格式：xlsx/xls文件
+            </div>
+          </div>
+          <div v-if="importInfo.file">{{ importInfo.file.name }}</div>
+        </FormItem>
+      </Form>
+      <div slot="footer">
+        <Button @click="importInfo.show = false">取消</Button>
+        <Button @click="saveFileInfo()" type="primary" class="primary_btn"
+          >保存</Button
+        >
+      </div>
+    </Modal>
+  </div>
+</template>
+
+<script>
+import { region_list_sel_pt } from "@/api/region";
+import {
+  deviceAuth_list,
+  deviceAuth_add,
+  deviceAuth_edit,
+  deviceAuth_delete,
+  deviceAuth_batch_delete,
+  deviceAuth_import
+} from "@/api/device_manager";
+export default {
+  data() {
+    return {
+      rules: {
+        regionid: [
+          {
+            required: true,
+            type: "number",
+            message: "请选择所属区域",
+            trigger: "change"
+          }
+        ],
+        sn: [
+          {
+            required: true,
+            message: "请输入SN序列号",
+            trigger: "change"
+          }
+        ],
+        snState: [
+          {
+            required: true,
+            type: "number",
+            message: "请选择所属状态",
+            trigger: "change"
+          }
+        ]
+      },
+      addInfo: {
+        daid: null,
+        rversion: null,
+        show: false,
+        regionid: null,
+        sn: null,
+        snState: null
+      },
+      searchForm: {
+        regionid: 0,
+        regionList: [],
+        sn: "",
+        page: 1,
+        size: 10,
+        list: [],
+        total: 0
+      },
+      importInfo: {
+        show: false,
+        regionid: null,
+        file: null
+      },
+      // 批量删除
+      batchDeleteList: [],
+      columns: [
+        {
+          type: "selection",
+          width: 60,
+          align: "center"
+        },
+        {
+          title: "序号",
+          align: "center",
+          width: 70,
+          render: (h, params) => {
+            return h(
+              "span",
+              params.index +
+                (this.searchForm.page - 1) * this.searchForm.size +
+                1
+            );
+          }
+        },
+        {
+          title: "所属区域",
+          key: "regionName",
+          align: "center"
+        },
+        {
+          title: "SN",
+          key: "sn",
+          align: "center"
+        },
+        {
+          title: "状态",
+          slot: "snStateSlot",
+          width: 90,
+          align: "center"
+        },
+        {
+          title: "创建人",
+          key: "createname",
+          align: "center"
+        },
+        {
+          title: "创建时间",
+          key: "createtime",
+          width: 190,
+          align: "center"
+        },
+        {
+          title: "操作",
+          slot: "actionSlot",
+          width: 130,
+          align: "center"
+        }
+      ]
+    };
+  },
+  created() {
+    this.getRegionList();
+    this.searchList();
+  },
+  computed: {
+    powerParams() {
+      return this.$store.getters.powerParams;
+    }
+  },
+  methods: {
+    // 获取搜索区域列表
+    getRegionList() {
+      region_list_sel_pt({}).then((data) => {
+        if (data.code === 0) {
+          this.searchForm.regionList = data.obj;
+        } else {
+          this.$Message.error(data.msg);
+        }
+      });
+    },
+    // 搜索
+    searchList() {
+      this.searchForm.page = 1;
+      this.getList();
+    },
+    // 页码改变
+    pageChange(page) {
+      this.searchForm.page = page;
+      this.getList();
+    },
+    // 每页显示数量改变
+    pageSizeChange(size) {
+      this.searchForm.size = size;
+      this.searchForm.page = 1;
+      this.getList();
+    },
+    tableSelectionChange(list) {
+      this.batchDeleteList = list.map((item) => {
+        return {
+          daid: item.daid
+        };
+      });
+    },
+    // 获取列表
+    getList() {
+      this.batchDeleteList = [];
+      deviceAuth_list({
+        rtype: this.powerParams.rtype,
+        objectid: this.powerParams.objectid,
+        regionid: this.searchForm.regionid,
+        page: this.searchForm.page,
+        size: this.searchForm.size,
+        sn: this.searchForm.sn
+      }).then((data) => {
+        if (data.code === 0) {
+          this.searchForm.list = data.obj.data;
+          this.searchForm.total = data.obj.total;
+        } else {
+          this.$Message.error(data.msg);
+        }
+      });
+    },
+    toImport() {
+      this.importInfo = {
+        show: true,
+        regionid: null,
+        file: null
+      };
+    },
+    upLoadExcel(file) {
+      this.importInfo.file = null;
+      let str = file.name.split(".");
+      let suffix = str[str.length - 1];
+      suffix = suffix.toLowerCase();
+      if (suffix !== "xlsx" && suffix !== "xls") {
+        this.$Message.warning("文件格式不正确");
+        return;
+      }
+      this.importInfo.file = file;
+    },
+    saveFileInfo() {
+      this.$refs.importForm.validate((valid) => {
+        if (valid) {
+          if (!this.importInfo.file) {
+            this.$Message.error("请上传文件");
+            return;
+          }
+          this.importInfo.show = false;
+          let formData = new FormData();
+          formData.append("file", this.importInfo.file);
+          formData.append("regionid", this.importInfo.regionid);
+          deviceAuth_import(formData).then((data) => {
+            if (data.code === 0) {
+              this.searchList();
+              this.$Message.success(data.msg);
+            } else {
+              this.$Message.error(data.msg);
+            }
+          });
+        }
+      });
+    },
+    toAdd() {
+      this.addInfo = {
+        daid: null,
+        rversion: null,
+        show: true,
+        regionid: null,
+        sn: null,
+        snState: null
+      };
+    },
+    saveAddInfo() {
+      this.$refs.addForm.validate((valid) => {
+        if (valid) {
+          this.addInfo.show = false;
+          let api =
+            this.addInfo.daid && this.addInfo.rversion
+              ? deviceAuth_edit
+              : deviceAuth_add;
+          let form = {
+            rtype: this.powerParams.rtype,
+            objectid: this.powerParams.objectid,
+            regionid: this.addInfo.regionid,
+            sn: this.addInfo.sn
+          };
+          if (this.addInfo.daid && this.addInfo.rversion) {
+            form.daid = this.addInfo.daid;
+            form.snState = this.addInfo.snState;
+            form.rversion = this.addInfo.rversion;
+          }
+          api(form).then((data) => {
+            if (data.code === 0) {
+              this.searchList();
+              this.$Message.success(data.msg);
+            } else {
+              this.$Message.error(data.msg);
+            }
+          });
+        }
+      });
+    },
+    toEdit(row) {
+      this.addInfo = {
+        daid: row.daid,
+        rversion: row.rversion,
+        show: true,
+        regionid: row.regionid,
+        sn: row.sn,
+        snState: row.snState
+      };
+    },
+    // 删除
+    toDel(row) {
+      this.$Modal.confirm({
+        title: "提示",
+        content: `您确定删除【${row.sn}】吗？`,
+        onOk: () => {
+          deviceAuth_delete({
+            rtype: this.powerParams.rtype,
+            objectid: this.powerParams.objectid,
+            daid: row.daid,
+            rversion: row.rversion
+          }).then((data) => {
+            if (data.code === 0) {
+              this.searchList();
+              this.$Message.success(data.msg);
+            } else {
+              this.$Message.error(data.msg);
+            }
+          });
+        },
+        onCancel: () => {}
+      });
+    },
+    toBatchDelete() {
+      if (this.batchDeleteList.length === 0) {
+        this.$Message.error("请选择数据");
+        return;
+      }
+      this.$Modal.confirm({
+        title: "提示",
+        content: `您确定删除选中数据吗？`,
+        onOk: () => {
+          deviceAuth_batch_delete(this.batchDeleteList).then((data) => {
+            if (data.code === 0) {
+              this.searchList();
+              this.$Message.success(data.msg);
+            } else {
+              this.$Message.error(data.msg);
+            }
+          });
+        },
+        onCancel: () => {}
+      });
+    }
+  }
+};
+</script>
+
+<style lang="less" scoped>
+.search_header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin: 16px 16px;
+  .search_left {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+  }
+  .search_right {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+    .primary_btn {
+      margin-left: 16px;
+    }
+  }
+}
+</style>

src/views/platformSection/index.vue

@@ -48,6 +48,9 @@
             >
           </div>
         </div>
+        <router-link tag="div" to="/platform/deviceImport" class="module_item">
+          <span>设备导入</span>
+        </router-link>
         <div :class="['module_item drop_down', logSelected ? 'selected' : '']">
           <span class="module_title">日志</span>
           <Icon class="arrow_dropdown" type="md-arrow-dropdown" :size="20" />