0017
/
smart-power-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

提交: 项目详情页面还原

This commit is contained in:
23688nl 2022-08-11 18:08:38 +08:00
parent d4e4a9852c
commit 66d3a19335
3 changed files with 712 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/views/iot/project/index.vue
View File

@ -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() {

335
src/views/iot/region/profile/BuildingDevice.vue Normal file
View File

@ -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>

374
src/views/iot/region/profile/BuildingType.vue Normal file
View File

@ -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>