546 lines
17 KiB
Vue
546 lines
17 KiB
Vue
<template>
|
|
<!-- 基本信息 -->
|
|
<div class="fullHeight">
|
|
<!-- <vue-scroll style="height: 100%"> -->
|
|
|
|
<div class="basicInfo">
|
|
<div class="searchBox whiteBlock">
|
|
<el-form
|
|
:inline="true"
|
|
size="medium"
|
|
class="demo-form-inline"
|
|
>
|
|
<!-- <el-form-item :label="$t('message.lifter.devNumber')">
|
|
<el-input
|
|
v-model="devSn"
|
|
:placeholder="
|
|
$t('message.lifter.pleaseSelect') +
|
|
$t('message.lifter.devNumber')
|
|
"
|
|
></el-input>
|
|
</el-form-item>-->
|
|
|
|
<el-form-item>
|
|
<!-- <el-button type="primary" @click="onSubmit" plain>{{
|
|
$t("message.lifter.demand")
|
|
}}</el-button> -->
|
|
|
|
<!-- 刷新 -->
|
|
<el-button type="warning" plain @click="getLifterList">{{
|
|
$t("message.lifter.refresh")
|
|
}}</el-button>
|
|
<!-- 新增 -->
|
|
<el-button type="primary" @click="addLifterBtn">{{ $t("message.lifter.add") }}</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
<!-- 对接协议下载 -->
|
|
<span class="downloadBtn primaryText" @click="downloadFn">{{ $t("message.lifter.protocolDownload") }}</span>
|
|
</div>
|
|
<div class="table_wrap whiteBlock">
|
|
<el-table
|
|
:data="tableData"
|
|
class="tables"
|
|
style="width: 100%"
|
|
height="600px"
|
|
>
|
|
<!-- 设备名称 -->
|
|
<el-table-column prop="devName" :label="$t('message.lifter.devName')"> </el-table-column>
|
|
<!-- 设备编号 -->
|
|
<el-table-column prop="devSn" :label="$t('message.lifter.devNumber')"> </el-table-column>
|
|
<!-- 最大高度(m) -->
|
|
<el-table-column prop="maxHeight" :label="$t('message.lifter.maximumHeight')">
|
|
</el-table-column>
|
|
<!-- 工作循环最大载重 -->
|
|
<el-table-column prop="maxLoad" :label="$t('message.lifter.maximumPayload')">
|
|
</el-table-column>
|
|
<!-- 操作 -->
|
|
<el-table-column prop="address" align="left" :label="$t('message.lifter.operation')">
|
|
<template style="text-align: right" slot-scope="scope">
|
|
<div class="tableBtns">
|
|
<!-- <el-button
|
|
class="operationText"
|
|
type="text"
|
|
@click="showDriver = true"
|
|
>详情</el-button
|
|
> -->
|
|
<div class="operationText" @click="editBtn(scope.row)">
|
|
<img src="@/assets/images/icon-edit.png" />
|
|
<!-- 编辑 -->
|
|
<span>{{ $t("message.lifter.edit") }}</span>
|
|
</div>
|
|
<div class="operationText" @click="deleteBtn(scope.row)">
|
|
<img src="@/assets/images/icon-delete.png" />
|
|
<!-- 删除 -->
|
|
<span>{{ $t("message.lifter.delete") }}</span>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<!-- <el-pagination
|
|
class="pagerBox"
|
|
@size-change="handleSizeChange"
|
|
@current-change="handleCurrentChange"
|
|
:current-page="pageNo"
|
|
:page-sizes="$store.state.PAGESIZRS"
|
|
:page-size="pageSize"
|
|
layout="total, sizes, prev, pager, next"
|
|
:total="total"
|
|
background
|
|
></el-pagination> -->
|
|
</div>
|
|
</div>
|
|
|
|
<!--配置模块-->
|
|
<el-dialog
|
|
:modal-append-to-body="false"
|
|
:title="lifterTitle"
|
|
:visible.sync="lifterCraneDialog"
|
|
width="680px"
|
|
:close-on-click-modal="false"
|
|
>
|
|
<div class="dialog_content">
|
|
<el-form
|
|
:model="lifterForm"
|
|
:rules="rules"
|
|
ref="lifterForm"
|
|
label-width="130px"
|
|
class="demo-lifterForm" size="medium"
|
|
>
|
|
<!-- 设备名称 -->
|
|
<el-form-item :label="$t('message.lifter.devName')" prop="devName">
|
|
<el-input v-model="lifterForm.devName"></el-input>
|
|
</el-form-item>
|
|
<!-- 设备编号 -->
|
|
<el-form-item :label="$t('message.lifter.devNumber')" prop="devSn">
|
|
<!-- 2022-06-08 注释 -->
|
|
<!-- <el-input
|
|
v-model="lifterForm.devSn"
|
|
:disabled="true"
|
|
:placeholder="$t('message.lifter.systemGeneration')"
|
|
></el-input> -->
|
|
<el-input
|
|
v-model="lifterForm.devSn"
|
|
:disabled="lifterTitle == $t('message.lifter.newElevator') ? false : true"
|
|
:placeholder="$t('message.lifter.systemGeneration')"
|
|
></el-input>
|
|
<!-- systemGeneration 系统生成 -->
|
|
</el-form-item>
|
|
<!-- 机械设备备案号 -->
|
|
<el-form-item :label="$t('message.lifter.machineryRecordNo')" prop="registNo">
|
|
<el-input v-model="lifterForm.registNo"></el-input>
|
|
</el-form-item>
|
|
<!-- 最大高度(m) -->
|
|
<el-form-item :label="$t('message.lifter.maximumHeight')" prop="maxHeight">
|
|
<el-input v-model="lifterForm.maxHeight" type="number" oninput="if(value.length>20)value=value.slice(0,20)"></el-input>
|
|
</el-form-item>
|
|
<!-- 最大载重(kg) -->
|
|
<el-form-item :label="$t('message.lifter.maximumPayload')" prop="maxLoad" >
|
|
<el-input v-model="lifterForm.maxLoad" type="number" oninput="if(value.length>20)value=value.slice(0,20)"></el-input>
|
|
</el-form-item>
|
|
<!-- 总楼层数 -->
|
|
<el-form-item :label="$t('message.lifter.totalFloors')" prop="totalFloor">
|
|
<el-input type="number" v-model="lifterForm.totalFloor" oninput="if(value.length>3)value=value.slice(0,3)"></el-input>
|
|
</el-form-item>
|
|
<!-- 升降机操作人员 liftOperator 司机 driver -->
|
|
<el-form-item :label="company == 'longguang'? $t('message.lifter.liftOperator') : $t('message.lifter.driver') " prop="recordNumber">
|
|
<el-select
|
|
v-model="lifterForm.driverList"
|
|
filterable
|
|
multiple
|
|
collapse-tags
|
|
style="width: 100%"
|
|
:placeholder="$t('message.lifter.pleaseSelect')"
|
|
>
|
|
<el-option
|
|
v-for="item in driverList"
|
|
:key="item.id"
|
|
:label="item.workerName"
|
|
:value="item.id"
|
|
>
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<!-- 摄像头 -->
|
|
<el-form-item :label="$t('message.lifter.camera')" prop="recordNumber">
|
|
<el-select
|
|
v-model="lifterForm.videoList"
|
|
multiple
|
|
collapse-tags
|
|
style="width: 100%"
|
|
:placeholder="$t('message.lifter.pleaseSelect')"
|
|
>
|
|
<el-option
|
|
v-for="item in videoList"
|
|
:key="item.itemId"
|
|
:label="item.videoName"
|
|
:value="item.itemId+''"
|
|
>
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<!-- 报警推送人 -->
|
|
<el-form-item :label="$t('message.lifter.alarmPusher')" prop="recordNumber" v-if="!this.editType">
|
|
<el-select
|
|
v-model="lifterForm.alarmPushWorkerId"
|
|
filterable
|
|
multiple
|
|
collapse-tags
|
|
style="width: 100%"
|
|
:placeholder="$t('message.lifter.pleaseSelect')"
|
|
>
|
|
<el-option
|
|
v-for="item in accountList"
|
|
:key="item.userId"
|
|
:label="item.realName"
|
|
:value="item.userId"
|
|
>
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<!-- 总包单位 -->
|
|
<el-form-item v-if="company == 'longguang'" :label="$t('message.lifter.generalContracting')" prop="generalContractorsId">
|
|
<el-select
|
|
v-model="lifterForm.generalContractorsId"
|
|
filterable
|
|
style="width: 100%"
|
|
:placeholder="$t('message.lifter.pleaseSelect')"
|
|
>
|
|
<el-option
|
|
v-for="item in enterpriseInfoList"
|
|
:key="item.id+'d'"
|
|
:label="item.enterpriseName"
|
|
:value="item.id"
|
|
>
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
</el-form>
|
|
<div class="dialog-footer">
|
|
<!-- 取 消 -->
|
|
<el-button
|
|
class="cancleBtn"
|
|
@click="lifterCraneDialog = false"
|
|
icon="el-icon-circle-close"
|
|
size="medium"
|
|
>{{ $t('message.lifter.cancel') }}</el-button
|
|
>
|
|
<!-- 确 定 -->
|
|
<el-button
|
|
type="primary"
|
|
icon="el-icon-circle-check"
|
|
@click="saveLifterBtn"
|
|
size="medium"
|
|
>{{ $t('message.lifter.determine') }}</el-button
|
|
>
|
|
</div>
|
|
</div>
|
|
</el-dialog>
|
|
<!-- </vue-scroll> -->
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import {
|
|
getWorkerInfoListApi,
|
|
getVideoItemListApi,
|
|
addLifterApi,
|
|
getLifterListApi,
|
|
getLifterDetailApi,
|
|
deleteLifterApi,
|
|
editLifterApi
|
|
|
|
} from "@/assets/js/api/lifter";
|
|
import {
|
|
getEnterpriseInfoList
|
|
} from "@/assets/js/api/laborPerson";
|
|
import {
|
|
getProjectChilderSystemUserListApi
|
|
} from "@/assets/js/api/configManage";
|
|
export default {
|
|
data() {
|
|
return {
|
|
enterpriseInfoList: [],
|
|
company:COMPANY,
|
|
driverList: [],
|
|
videoList: [],
|
|
lifterTitle: this.$t('message.lifter.newElevator'), // 新增升降机
|
|
projectSn: "",
|
|
devSn:'',
|
|
lifterForm: {
|
|
devName: "",
|
|
devSn: "",
|
|
registNo: "",
|
|
maxHeight: "",
|
|
maxLoad: "",
|
|
driverList: "",
|
|
videoList: "",
|
|
totalFloor: "",
|
|
generalContractorsId: "",
|
|
alarmPushWorkerId:[],
|
|
},
|
|
rules: {
|
|
devName: [
|
|
{
|
|
required: true,
|
|
message: this.$t("message.companyDiagram.required"),
|
|
trigger: "blur",
|
|
},
|
|
],
|
|
},
|
|
pageNo: 1,
|
|
pageSize: 10,
|
|
total: 0,
|
|
tableData: [],
|
|
editType:false,
|
|
lifterCraneDialog: false,
|
|
showDriver: false,
|
|
accountList: []
|
|
};
|
|
},
|
|
|
|
created() {
|
|
this.projectSn = this.$store.state.projectSn;
|
|
this.getLifterList();
|
|
this.selectEnterpriseInfoList()
|
|
},
|
|
|
|
methods: {
|
|
selectEnterpriseInfoList(){
|
|
getEnterpriseInfoList({
|
|
enterpriseTypeId: 9,
|
|
projectSn: this.projectSn
|
|
}).then(res=>{
|
|
console.log(res)
|
|
if(res.code == 200){
|
|
this.enterpriseInfoList = res.result
|
|
}
|
|
})
|
|
},
|
|
getAccountList() {
|
|
getProjectChilderSystemUserListApi({ projectSn: this.projectSn }).then((result) => {
|
|
this.accountList = result.result;
|
|
console.log(' this.accountList====', this.accountList);
|
|
}
|
|
);
|
|
},
|
|
downloadFn(){
|
|
window.open('/doc/'+this.$t('message.lifter.dockingProtocol')+'.docx')
|
|
// dockingProtocol 升降机对外对接协议
|
|
},
|
|
//获取列表数据
|
|
getLifterList() {
|
|
let data = {
|
|
projectSn: this.projectSn,
|
|
};
|
|
getLifterListApi(data).then((res) => {
|
|
if (res.code == 200) {
|
|
this.tableData = res.result;
|
|
}
|
|
});
|
|
},
|
|
|
|
//新增 按钮
|
|
addLifterBtn() {
|
|
this.lifterCraneDialog = true;
|
|
this.lifterTitle = this.$t('message.lifter.newElevator'); // 新增升降机
|
|
this.editType = false;
|
|
this.lifterForm = {
|
|
devName: "",
|
|
devSn: "",
|
|
registNo: "",
|
|
maxHeight: "",
|
|
maxLoad: "",
|
|
driverList: "",
|
|
videoList: "",
|
|
totalFloor: "",
|
|
generalContractorsId: ""
|
|
};
|
|
this.getWorkerInfoList();
|
|
this.getVideoItemList();
|
|
this.getAccountList()
|
|
},
|
|
|
|
//获取司机列表
|
|
getWorkerInfoList() {
|
|
let data = {
|
|
projectSn: this.projectSn,
|
|
};
|
|
getWorkerInfoListApi(data).then((res) => {
|
|
if (res.code == 200) {
|
|
this.driverList = res.result;
|
|
}
|
|
});
|
|
},
|
|
|
|
//获取摄像机列表
|
|
getVideoItemList() {
|
|
let data = {
|
|
projectSn: this.projectSn,
|
|
};
|
|
getVideoItemListApi(data).then((res) => {
|
|
if (res.code == 200) {
|
|
this.videoList = res.result.list;
|
|
console.log('videoList=========',this.videoList,);
|
|
}
|
|
});
|
|
},
|
|
|
|
|
|
// 编辑按钮
|
|
editBtn(val) {
|
|
console.log(val)
|
|
this.lifterCraneDialog = true;
|
|
this.lifterTitle= this.$t('message.lifter.editLift'); // 编辑升降机
|
|
this.editType = true;
|
|
this.lifterForm = val;
|
|
this.getWorkerInfoList();
|
|
this.getVideoItemList();
|
|
this.getDetailsData(val.id);
|
|
this.getAccountList()
|
|
// this.lifterTitle.alarmPushWorkerId=val.alarmPushWorkerId .split(',')
|
|
// .map((item) => String(item))
|
|
},
|
|
|
|
//删除
|
|
deleteBtn(val) {
|
|
// promptToDelete此操作将永久删除该数据 tips提示 determine确 定 cancel取 消
|
|
this.$confirm(this.$t('message.lifter.promptToDelete'), this.$t('message.lifter.tips'), {
|
|
confirmButtonText: this.$t('message.lifter.determine'),
|
|
cancelButtonText: this.$t('message.lifter.cancel'),
|
|
type: "warning",
|
|
}).then(() => {
|
|
let data = {
|
|
id: val.id,
|
|
};
|
|
deleteLifterApi(data).then((res) => {
|
|
if(res.code==200){
|
|
this.$message({
|
|
type: "success",
|
|
message: this.$t('message.lifter.deleteSucceeded'),
|
|
});
|
|
// deleteSucceeded 删除成功
|
|
this.getLifterList();
|
|
}
|
|
});
|
|
})
|
|
.catch(() => {
|
|
this.$message({
|
|
type: "info",
|
|
message: this.$t('message.lifter.deletionCancelled'),
|
|
});
|
|
// deletionCancelled 已取消删除
|
|
});
|
|
},
|
|
|
|
// 查询设备详情
|
|
getDetailsData(id) {
|
|
let data = {
|
|
id,
|
|
};
|
|
getLifterDetailApi(data).then((res) => {
|
|
if (res.code == 200) {
|
|
this.lifterForm = res.result;
|
|
let workerIdArr = [];
|
|
let videoItemIdArr = [];
|
|
for (let i = 0; i < res.result.driverList.length; i++) {
|
|
workerIdArr.push(res.result.driverList[i].workerId);
|
|
}
|
|
for (let i = 0; i < res.result.videoList.length; i++) {
|
|
videoItemIdArr.push(res.result.videoList[i].videoItemId);
|
|
}
|
|
this.lifterForm.driverList = workerIdArr;
|
|
this.lifterForm.videoList = videoItemIdArr;
|
|
}
|
|
});
|
|
},
|
|
|
|
//新增 保存
|
|
saveLifterBtn() {
|
|
|
|
this.$refs["lifterForm"].validate((valid) => {
|
|
if (valid) {
|
|
let data = JSON.parse(JSON.stringify(this.lifterForm));
|
|
data.projectSn = this.projectSn;
|
|
let driverArr = [];
|
|
let videoArr = [];
|
|
//循环选中的司机
|
|
for (let i = 0; i < data.driverList.length; i++) {
|
|
let obj = { workerId: data.driverList[i] };
|
|
driverArr.push(obj);
|
|
}
|
|
//循环选中的摄像头
|
|
for (let i = 0; i < data.videoList.length; i++) {
|
|
let obj = { videoItemId: data.videoList[i] };
|
|
videoArr.push(obj);
|
|
}
|
|
data.driverList = driverArr;
|
|
data.videoList = videoArr;
|
|
//新增
|
|
console.log(data)
|
|
if(!this.editType){
|
|
data.alarmPushWorkerId= data.alarmPushWorkerId?data.alarmPushWorkerId.join(','):''
|
|
addLifterApi(data).then((res) => {
|
|
if (res.code == 200) {
|
|
this.lifterCraneDialog = false;
|
|
this.getLifterList();
|
|
this.$message.success(this.$t('message.lifter.successfullyAdded'))
|
|
// successfullyAdded 新增成功
|
|
}
|
|
});
|
|
}else{
|
|
//编辑
|
|
editLifterApi(data).then(res=>{
|
|
if (res.code == 200) {
|
|
this.lifterCraneDialog = false;
|
|
this.getLifterList();
|
|
this.$message.success(this.$t('message.lifter.editSucceeded'))
|
|
// editSucceeded 编辑成功
|
|
}
|
|
})
|
|
|
|
}
|
|
}
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.flex {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.basicInfo {
|
|
width: 100%;
|
|
height: 100%;
|
|
.title {
|
|
padding: 0 20px;
|
|
padding-top: 17px;
|
|
height: 70px;
|
|
box-sizing: border-box;
|
|
}
|
|
.content {
|
|
margin-top: 10px;
|
|
box-sizing: border-box;
|
|
width: 100%;
|
|
height: 720px;
|
|
}
|
|
}
|
|
.operationText {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.searchBox{
|
|
position: relative;
|
|
}
|
|
.downloadBtn{
|
|
position: absolute;
|
|
right: 20px;
|
|
top: 30px;
|
|
text-decoration: underline;
|
|
cursor: pointer;
|
|
}
|
|
</style>
|