From 66d3a193356b026cd285ba925bcee6541d1a3fe1 Mon Sep 17 00:00:00 2001
From: 23688nl <329261568@qq.com>
Date: Thu, 11 Aug 2022 18:08:38 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8F=90=E4=BA=A4:=20=E9=A1=B9=E7=9B=AE?=
 =?UTF-8?q?=E8=AF=A6=E6=83=85=E9=A1=B5=E9=9D=A2=E8=BF=98=E5=8E=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/iot/project/index.vue               |   6 +-
 .../iot/region/profile/BuildingDevice.vue     | 335 ++++++++++++++++
 src/views/iot/region/profile/BuildingType.vue | 374 ++++++++++++++++++
 3 files changed, 712 insertions(+), 3 deletions(-)
 create mode 100644 src/views/iot/region/profile/BuildingDevice.vue
 create mode 100644 src/views/iot/region/profile/BuildingType.vue

diff --git a/src/views/iot/project/index.vue b/src/views/iot/project/index.vue
index 75a1b8cf..19b28a63 100644
--- a/src/views/iot/project/index.vue
+++ b/src/views/iot/project/index.vue
@@ -274,9 +274,9 @@
       </div>
     </el-dialog>
 
-    <!-- <div class="to-home-wrap2" @click="toTableClick" v-show="componectVal !== ''">
+    <div class="to-home-wrap2" @click="toTableClick" v-show="componectVal !== ''">
       <el-button icon="el-icon-d-arrow-left" title="返回列表" circle>返回列表</el-button>
-    </div> -->
+    </div>
   </div>
 </template>
 
@@ -647,7 +647,7 @@ export default {
     },
     handleDetails(row) {
       this.sourceId = row.projectId;
-      this.componectVal = "DetailsWrapNew";
+      this.componectVal = "DetailsWrap";
     },
     // 跳转详情页
     linkToTable() {
diff --git a/src/views/iot/region/profile/BuildingDevice.vue b/src/views/iot/region/profile/BuildingDevice.vue
new file mode 100644
index 00000000..7ce8a1b4
--- /dev/null
+++ b/src/views/iot/region/profile/BuildingDevice.vue
@@ -0,0 +1,335 @@
+<template>
+  <div class="app-container">
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table
+      v-loading="loading"
+      :data="space_deviceList"
+      :default-sort="{prop: 'createTime', order: 'descending'}"
+      @sort-change="sortChange"
+    >
+      <el-table-column type="index" label="序号" align="center" :index="indexFormatter" width="80px"></el-table-column>
+      <el-table-column label="设备名称" align="left" width="200px" prop="deviceName" />
+      <el-table-column label="所属型号" align="left" prop="modelName" />
+      <el-table-column label="设备key" align="left" prop="deviceKey" />
+      <el-table-column label="设备类型" align="left" width="120px" prop="deviceTypeName" />
+      <el-table-column label="是否是摄像头设备" align="center" prop="videoStatus" />
+      <el-table-column label="创建时间" sortable="custom" align="center" width="200" prop="createTime" />
+      <el-table-column label="操作" width="150" align="center" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            v-if="scope.row.deviceType !== 'MINIATURE_BREAKER'"
+            @click="handleDelete(scope.row)"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改空间设备对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px"></el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button size="mini" type="primary" @click="submitForm">确 定</el-button>
+        <el-button size="mini" @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+
+    <el-dialog
+      title="选择设备"
+      :visible.sync="selectTableShow"
+      width="75%"
+      top="10vh"
+      class="select-table-dialog"
+      :close-on-click-modal="false"
+      append-to-body
+    >
+      <select-table-wrap
+        v-if="selectTableShow"
+        :tableOption="tableSelectOption.tableOpt"
+        :queryOption="tableSelectOption.queryOpt"
+        :tableList="tableSelectOption.tableList"
+        @parentGetList="childGetList($event)"
+        :otherOption="tableSelectOption.otherOption"
+        @returnEvent="returnEvent($event)"
+      />
+
+      <div slot="footer" class="dialog-footer">
+        <el-button size="mini" type="primary" @click="submitForm">确 定</el-button>
+        <el-button size="mini" @click="() =>{selectTableShow = false}">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {
+  listSpace_device,
+  delSpace_device,
+  addSpace_device,
+  listBuildingNotDevice
+} from "@/api/iot/buildingDevice";
+import { listSpaceDevice } from "@/api/iot/space";
+import SelectTableWrap from "@/components/SelectTable/index";
+
+export default {
+  name: "BuildingDevice",
+  props: ["buildingCode"],
+  components: {
+    SelectTableWrap
+  },
+  data() {
+    return {
+      selectTableShow: false,
+      tableSelectOption: {},
+      selectResult: {},
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 空间设备表格数据
+      space_deviceList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        spaceId: "",
+        pageNum: 1,
+        pageSize: 10,
+        orderByColumn: "createTime",
+        isAsc: "desc"
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {}
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    sortChange(column) {
+      const sort = {
+        isAsc: column.order === "descending" ? "desc" : "asc",
+        orderByColumn: column.prop
+      };
+      this.queryParams = Object.assign(this.queryParams, sort);
+      this.handleQuery();
+    },
+    indexFormatter(val) {
+      return (
+        val + 1 + (this.queryParams.pageNum - 1) * this.queryParams.pageSize
+      );
+    },
+    handleDetails() {
+      this.selectResult = {};
+      this.tableSelectOption = {
+        otherOption: {
+          tableType: "device"
+        },
+        queryOpt: {
+          disable: false,
+          labelWidth: "68px",
+          params: {
+            deviceName: "",
+            modelId: "",
+            parentId: 0,
+            deviceType: "GATEWAY_CONTROLLER"
+          },
+          page: {
+            pageSize: 10,
+            pageNum: 1,
+            total: 0
+          },
+          inline: true,
+          queryChilds: [
+            {
+              style: "",
+              placeholder: "设备名称",
+              clearable: true,
+              label: "设备名称",
+              type: "input",
+              key: "deviceName",
+              size: "small",
+              value: ""
+            }
+          ]
+        },
+        tableOpt: {
+          loading: false,
+          rowKey: "deviceId",
+          selection: false,
+          maxHeight: "45vh",
+          childs: [
+            {
+              style: "",
+              label: "所属型号",
+              type: "",
+              prop: "modelName",
+              align: "left",
+              width: "",
+              "show-overflow-tooltip": false,
+              tempType: "span"
+            },
+            {
+              style: "",
+              label: "设备名称",
+              type: "",
+              prop: "deviceName",
+              align: "left",
+              width: "",
+              "show-overflow-tooltip": false,
+              tempType: "span"
+            },
+            {
+              style: "",
+              label: "设备Key",
+              type: "",
+              prop: "deviceKey",
+              align: "left",
+              width: "",
+              "show-overflow-tooltip": false,
+              tempType: "span"
+            },
+            {
+              style: "",
+              label: "设备类型",
+              type: "",
+              prop: "deviceTypeName",
+              align: "left",
+              width: "",
+              "show-overflow-tooltip": false,
+              tempType: "span"
+            },
+            {
+              style: "",
+              label: "创建时间",
+              type: "time",
+              prop: "createTime",
+              align: "center",
+              width: "180",
+              "show-overflow-tooltip": false,
+              tempType: "span"
+            }
+          ],
+          tableList: {
+            type: Array
+          }
+        },
+        tableList: []
+      };
+      this.selectTableShow = true;
+    },
+    childGetList(data) {
+      console.log(data.param)
+      listBuildingNotDevice(data.param).then(response => {
+        this.tableSelectOption.tableList = response.data;
+        // this.tableSelectOption.queryOpt.page.total = Number(response.total);
+      });
+    },
+    returnEvent(data) {
+      if (data.type === "dblclick") {
+        this.form.deviceId = data.value.deviceId;
+        this.submitForm();
+      } else if (data.type === "click") {
+        this.form.deviceId = data.value.deviceId;
+      }
+    },
+
+    /** 查询空间设备列表 */
+    getList() {
+      this.loading = true;
+      this.queryParams.buildingCode = this.buildingCode;
+      listSpace_device(this.queryParams).then(response => {
+        this.space_deviceList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        buildingCode: this.buildingCode,
+        deviceId: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.spaceId);
+      this.single = selection.length !== 1;
+      this.multiple = !selection.length;
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.handleDetails();
+    },
+    /** 提交按钮 */
+    submitForm() {
+      addSpace_device(this.form).then(response => {
+        this.msgSuccess("新增成功");
+        this.selectTableShow = false;
+        this.getList();
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const spaceIds = row.deviceId;
+      this.$confirm("是否删除该选项?", "警告", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(function() {
+          return delSpace_device(spaceIds);
+        })
+        .then(() => {
+          this.getList();
+          this.msgSuccess("删除成功");
+        });
+    }
+  }
+};
+</script>
diff --git a/src/views/iot/region/profile/BuildingType.vue b/src/views/iot/region/profile/BuildingType.vue
new file mode 100644
index 00000000..3b5e4193
--- /dev/null
+++ b/src/views/iot/region/profile/BuildingType.vue
@@ -0,0 +1,374 @@
+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryForm"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
+      <el-form-item label="类型编码" prop="buildingTypeCode">
+        <el-input
+          v-model="queryParams.buildingTypeCode"
+          placeholder="请输入类型编码"
+          clearable
+          size="small"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="类型名称" prop="buildingTypeName">
+        <el-input
+          v-model="queryParams.buildingTypeName"
+          placeholder="请输入类型名称"
+          clearable
+          size="small"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+
+      <el-form-item>
+        <el-button
+          type="primary"
+          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
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['system:type:add']"
+          >新增</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['system:type:remove']"
+          >删除</el-button
+        >
+      </el-col>
+      <right-toolbar
+        :showSearch.sync="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
+    </el-row>
+
+    <el-table
+      v-loading="loading"
+      :data="typeList"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column type="selection" width="50" align="center" />
+      <el-table-column
+        type="index"
+        label="序号"
+        align="center"
+        :index="indexFormatter"
+        width="80px"
+      ></el-table-column>
+      <el-table-column
+        label="类型编码"
+        align="center"
+        prop="buildingTypeCode"
+      />
+      <el-table-column
+        label="类型名称"
+        align="center"
+        prop="buildingTypeName"
+      />
+      <el-table-column
+        label="状态"
+        width="120px"
+        align="center"
+        prop="recordStatus"
+        :formatter="statusFormat"
+      />
+      <el-table-column
+        label="操作"
+        align="center"
+        width="200px"
+        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:type:edit']"
+            >修改</el-button
+          >
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['system:type: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="getList"
+    />
+
+    <!-- 添加或修改建筑类型对话框 -->
+    <dialog-template
+      :title="title" 
+      :visible="open" 
+      @close="open = false"
+      class="eldialog-wrap"
+      width="550px"
+    >
+      <el-form ref="form" slot="dialog-center" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="类型名称" prop="buildingTypeName">
+          <el-input
+            v-model="form.buildingTypeName"
+            placeholder="请输入类型名称"
+          />
+        </el-form-item>
+
+        <el-form-item label="类型编码" prop="buildingTypeCode">
+          <el-input
+            v-model="form.buildingTypeCode"
+            placeholder="请输入类型编码"
+          />
+        </el-form-item>
+
+        <el-form-item label="状态">
+          <el-radio-group v-model="form.recordStatus" style="width: 100%">
+            <el-radio
+              v-for="dict in buildingTypeOptions"
+              :key="dict.dictValue"
+              :label="Number(dict.dictValue)"
+              >{{ dict.dictLabel }}</el-radio
+            >
+          </el-radio-group>
+        </el-form-item>
+      </el-form>
+      <div slot="dialog-footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </dialog-template>
+  </div>
+</template>
+
+<script>
+import {
+  listType,
+  getType,
+  delType,
+  addType,
+  updateType,
+  exportType,
+} from "@/api/iot/buildingType";
+import DialogTemplate from "@/components/DialogTemplate";
+
+export default {
+  name: "Type",
+  props: {
+    infoData: {
+      type: Object,
+      require: true,
+    },
+  },
+  components: {
+    DialogTemplate,
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 建筑类型表格数据
+      typeList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        recordStatus: null,
+        tenantId: null,
+        buildingTypeCode: null,
+        buildingTypeName: null,
+        regionCode: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {},
+      buildingTypeOptions: [],
+    };
+  },
+  created() {
+    this.getList();
+    this.getDicts("region_status").then((response) => {
+      this.buildingTypeOptions = response.data;
+    });
+  },
+  methods: {
+    // 菜单状态字典翻译
+    statusFormat(row, column) {
+      return this.selectDictLabel(this.buildingTypeOptions, row.recordStatus);
+    },
+    /** 查询建筑类型列表 */
+    getList() {
+      this.loading = true;
+      listType(
+        Object.assign(this.queryParams, 
+        {
+          // regionCode: this.infoData.regionCode,
+        }
+        )
+      ).then((response) => {
+        this.typeList = response.rows;
+        this.total = response.total;
+        this.$forceUpdate()
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        recordId: null,
+        recordStatus: 0,
+        buildingTypeCode: null,
+        buildingTypeName: null,
+        // regionCode: this.infoData.regionCode,
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map((item) => item.recordId);
+      this.single = selection.length !== 1;
+      this.multiple = !selection.length;
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加建筑类型";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const recordId = row.recordId || this.ids;
+      getType(recordId).then((response) => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改建筑类型";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate((valid) => {
+        if (valid) {
+          if (this.form.recordId != null) {
+            updateType(this.form).then((response) => {
+              this.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addType(this.form).then((response) => {
+              this.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const recordIds = row.recordId || this.ids;
+      this.$confirm("是否删除该选项?", "警告", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(function () {
+          return delType(recordIds);
+        })
+        .then(() => {
+          this.getList();
+          this.msgSuccess("删除成功");
+        });
+    },
+    indexFormatter(val) {
+      return (
+        val +
+        1 +
+        (this.queryParams.pageNum - 1) * this.queryParams.pageSize
+      );
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      const queryParams = this.queryParams;
+      this.$confirm("是否确认导出所有建筑类型数据项?", "警告", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(function () {
+          return exportType(queryParams);
+        })
+        .then((response) => {
+          this.download(response.msg);
+        });
+    },
+  },
+};
+</script>