530 lines
14 KiB
Vue
530 lines
14 KiB
Vue
<template>
|
|
<view class="fullHeight">
|
|
<headers :showBack="true">
|
|
<view class="headerName">
|
|
{{ pageTitle }}
|
|
</view>
|
|
</headers>
|
|
<view class="formBox">
|
|
<form @submit="formSubmit">
|
|
|
|
<view class="uni-form-item">
|
|
<view class="uni-form-label">
|
|
<text class="star">*</text>
|
|
设备名称
|
|
</view>
|
|
<!-- enterpriseId -->
|
|
<view class="uni-form-input">
|
|
<picker :disabled="devForm.uploadType == 1" @change="bindPickerChange" :value="devForm.devIndex" :range="environmentDevList"
|
|
range-key="devName">
|
|
<view class="uni-input uni-select cl" v-if="devForm.devIndex == null">
|
|
请选择
|
|
<image class="icon-down" src="/static/icon-down-black.png" mode=""></image>
|
|
</view>
|
|
<view class="uni-input uni-select" v-else>{{ environmentDevList[devForm.devIndex].devName }}
|
|
<image class="icon-down" src="/static/icon-down-black.png" mode=""></image>
|
|
</view>
|
|
</picker>
|
|
</view>
|
|
</view>
|
|
<view class="uni-form-item">
|
|
<view class="uni-form-label">
|
|
<text class="star">*</text>
|
|
设备编号
|
|
</view>
|
|
<view class="uni-form-input disabled">
|
|
<input disabled class="uni-input" placeholder-class="cl" name="devSn" :value="devForm.devSn"
|
|
placeholder="请输入" />
|
|
</view>
|
|
</view>
|
|
<view class="uni-form-item">
|
|
<view class="uni-form-label">
|
|
<text class="star">*</text>
|
|
采集类型
|
|
</view>
|
|
<!-- enterpriseId -->
|
|
<view class="uni-form-input">
|
|
<picker disabled @change="bindPickerChange2" :value="devForm.uploadIndex" :range="uploadTypeList"
|
|
range-key="uploadTypeName">
|
|
<view class="uni-input uni-select cl" v-if="devForm.uploadIndex == null">
|
|
请选择
|
|
<image class="icon-down" src="/static/icon-down-black.png" mode=""></image>
|
|
</view>
|
|
<view class="uni-input uni-select" v-else>{{ uploadTypeList[devForm.uploadIndex].uploadTypeName }}
|
|
<image class="icon-down" src="/static/icon-down-black.png" mode=""></image>
|
|
</view>
|
|
</picker>
|
|
</view>
|
|
</view>
|
|
<view class="uni-form-item" >
|
|
<view class="uni-form-label">
|
|
<text class="star">*</text>
|
|
采集时间
|
|
</view>
|
|
<view class="uni-form-input">
|
|
<!-- <view class="uni-input def" :class="{text:form.reserveStartTime}"
|
|
@click="showTime=true;key='reserveStartTime'">
|
|
{{ form.reserveStartTime || '请选择' }}
|
|
</view> -->
|
|
<uni-datetime-picker :disabled="devForm.uploadType == 1" class="uni-input def w-form-input" date-format="yyyy-MM-dd HH:mm:ss" :border="false" type="datetime" ref="uniDateTime"
|
|
:clear-icon="false" v-model="devForm.receiveTime" />
|
|
<!-- @change="confirm" -->
|
|
</view>
|
|
</view>
|
|
<view class="uni-form-item">
|
|
<view class="uni-form-label">
|
|
<text class="star">*</text>
|
|
监测点位数量
|
|
</view>
|
|
<!-- enterpriseId -->
|
|
<view class="uni-form-input">
|
|
<picker disabled @change="bindPickerChange3" :value="devForm.pointIndex" :range="pointList"
|
|
range-key="lable">
|
|
<view class="uni-input uni-select cl" v-if="devForm.pointIndex==null">
|
|
请选择
|
|
<image class="icon-down" src="/static/icon-down-black.png" mode=""></image>
|
|
</view>
|
|
<view class="uni-input uni-select" v-else>{{ pointList[devForm.pointIndex].lable }}
|
|
<image class="icon-down" src="/static/icon-down-black.png" mode=""></image>
|
|
</view>
|
|
</picker>
|
|
</view>
|
|
</view>
|
|
<view class="point_boxs">
|
|
<view class="uni-form-item point_box" v-for="(item, index) in devForm.pointList" :key="index">
|
|
<view class="uni-form-item">
|
|
<view class="uni-form-label">
|
|
序号
|
|
</view>
|
|
<view>{{ item.pointNo }}</view>
|
|
</view>
|
|
<view class="uni-form-item">
|
|
<view class="uni-form-label">
|
|
监测点名称
|
|
</view>
|
|
<view class="uni-form-input disabled">
|
|
<input disabled class="uni-input" placeholder-class="cl" name="pointName" v-model="item.pointName"
|
|
placeholder="请输入" />
|
|
</view>
|
|
</view>
|
|
<view class="uni-form-item">
|
|
<view class="uni-form-label">
|
|
温度
|
|
</view>
|
|
<view class="uni-form-input" :class="{'disabled': devForm.uploadType == 1}">
|
|
<input :disabled="devForm.uploadType == 1" class="uni-input" type="number" oninput="if(value.length>5)value=value.slice(0,5)" placeholder-class="cl" name="temperature" v-model="item.temperature"
|
|
placeholder="请输入" />℃
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<button v-if="checkBtnPermission({key: 'add', menuPath: '/project/concreteMonitoring/devManageSecond'})" v-show="isAdd" form-type="submit" type="primary" class="btn submitBtn big">保存</button>
|
|
<button v-if="checkBtnPermission({key: 'edit', menuPath: '/project/concreteMonitoring/devManageSecond'})&&devForm.uploadType != 1" v-show="!isAdd" form-type="submit" type="primary" class="btn submitBtn big">保存</button>
|
|
<button v-if="checkBtnPermission({key: 'delete', menuPath: '/project/concreteMonitoring/devManageSecond'})&&devForm.uploadType != 1" class="btn deleteBtn big" v-show="!isAdd" @click="deleteFn">删除</button>
|
|
</form>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import dayjs from 'dayjs'
|
|
export default {
|
|
data() {
|
|
return {
|
|
pageTitle: '新增',
|
|
selectIndex: null,
|
|
colorList: ['蓝色', '绿色', '黄色', '白色', '黑色'],
|
|
carTypeList: [],
|
|
carTypeIndex: null,
|
|
driverNameList: [],
|
|
driverNameIndex: null,
|
|
form: {
|
|
carModuleType: 1,
|
|
carColor: "",
|
|
carNumber: "",
|
|
carPhotosUrl: [],
|
|
jsz: [],
|
|
xsz: [],
|
|
jqx: [],
|
|
otherProve: [],
|
|
carType: "",
|
|
driverName: "",
|
|
driverTelephone: "",
|
|
driverWorkerName: "",
|
|
outsideDriverIdCard: "",
|
|
isBlack: 0,
|
|
projectSn: '',
|
|
entryAndExitPermit: 0
|
|
},
|
|
personList: [],
|
|
projectDetail: {},
|
|
isAdd: true,
|
|
baoList: [],
|
|
bjIndex: null,
|
|
showTime: false,
|
|
params: {
|
|
year: true,
|
|
month: true,
|
|
day: true,
|
|
hour: true,
|
|
minute: true,
|
|
second: true
|
|
},
|
|
key: '',
|
|
selectIndexQy: null,
|
|
qyList: [],
|
|
cityIdArr: [],
|
|
isNation: false,
|
|
|
|
environmentDevList: [],
|
|
devForm: {
|
|
devIndex: null,
|
|
devName: "",
|
|
devSn: "",
|
|
pointNum: 8,
|
|
pointIndex: 0,
|
|
pointList: [],
|
|
uploadIndex: 1,
|
|
uploadType: 2,
|
|
receiveTime: dayjs(new Date()).format("YYYY-MM-DD HH:mm:ss"),
|
|
},
|
|
uploadTypeList: [
|
|
{
|
|
id: 1,
|
|
uploadTypeName: "自动采集",
|
|
},
|
|
{
|
|
id: 2,
|
|
uploadTypeName: "手动采集",
|
|
},
|
|
],
|
|
pointList: [{
|
|
lable: "8",
|
|
value: 8,
|
|
},{
|
|
lable: "16",
|
|
value: 16,
|
|
},{
|
|
lable: "32",
|
|
value: 32,
|
|
},{
|
|
lable: "64",
|
|
value: 64,
|
|
},{
|
|
lable: "128",
|
|
value: 128,
|
|
},{
|
|
lable: "256",
|
|
value: 256,
|
|
}],
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
this.projectDetail = JSON.parse(uni.getStorageSync('projectDetail'))
|
|
this.getEnvironmentDev(options)
|
|
},
|
|
|
|
methods: {
|
|
initDevice() {
|
|
this.devForm.pointList = [];
|
|
this.devForm = {
|
|
devIndex: null,
|
|
devName: "",
|
|
devSn: "",
|
|
pointNum: 8,
|
|
pointIndex: 0,
|
|
pointList: [],
|
|
uploadIndex: 1,
|
|
uploadType: 2,
|
|
receiveTime: dayjs(new Date()).format("YYYY-MM-DD HH:mm:ss"),
|
|
};
|
|
//渲染点位
|
|
for (let i = 0; i < this.devForm.pointNum; i++) {
|
|
let obj = { pointName: "", pointNo: i + 1, temperature: "" };
|
|
this.devForm.pointList.push(obj);
|
|
}
|
|
},
|
|
//获取设备
|
|
getEnvironmentDev(options) {
|
|
var that = this
|
|
this.sendRequest({
|
|
url: "xmgl/concreteMonitorDev/selectConcreteMonitorDevList",
|
|
data: {
|
|
projectSn: this.projectDetail.projectSn
|
|
},
|
|
method: "POST",
|
|
success(res) {
|
|
that.environmentDevList = res.result;
|
|
console.log(options.devInfo)
|
|
const devInfo = JSON.parse(options.devInfo);
|
|
if (devInfo) {
|
|
that.isAdd = false
|
|
that.pageTitle = '历史数据详情'
|
|
console.log(JSON.parse(options.devInfo))
|
|
const devIndex = that.environmentDevList.findIndex(item => item.devSn == devInfo.devSn);
|
|
const pointIndex = that.pointList.findIndex(item => item.value == devInfo.pointNum);
|
|
const uploadIndex = that.uploadTypeList.findIndex(item => item.id == devInfo.uploadType);
|
|
that.devForm = {
|
|
...devInfo,
|
|
pointList: devInfo.dataList,
|
|
devIndex: devIndex == -1 ? null : devIndex,
|
|
pointIndex: pointIndex == -1 ? null : pointIndex,
|
|
uploadIndex: uploadIndex == -1 ? null : uploadIndex,
|
|
}
|
|
}else {
|
|
that.initDevice()
|
|
}
|
|
}
|
|
})
|
|
},
|
|
deleteFn() {
|
|
var that = this
|
|
uni.showModal({
|
|
title: '提示',
|
|
content: '确定删除该数据吗？',
|
|
success(res) {
|
|
if (res.confirm) {
|
|
that.sendRequest({
|
|
url: 'xmgl/concreteMonitorCurrentData/deleteByBaotou',
|
|
data: {
|
|
id: that.devForm.id,
|
|
devSn: that.devForm.devSn,
|
|
receiveTime: that.devForm.receiveTime,
|
|
},
|
|
method: "POST",
|
|
success(res) {
|
|
uni.showToast({
|
|
title: '删除成功！'
|
|
})
|
|
uni.navigateBack()
|
|
}
|
|
})
|
|
}
|
|
}
|
|
})
|
|
},
|
|
getDevDetail(id) {
|
|
var that = this
|
|
this.sendRequest({
|
|
url: "xmgl/concreteMonitorDev/queryById",
|
|
data: {
|
|
projectSn: this.projectDetail.projectSn,
|
|
id: id
|
|
},
|
|
method: "POST",
|
|
success(res) {
|
|
let val = res.result;
|
|
that.devForm.devSn = val.devSn;
|
|
const pointIndex = that.pointList.findIndex(item => item.value == val.pointNum);
|
|
that.devForm.pointIndex = pointIndex == -1 ? null : pointIndex;
|
|
that.devForm.pointNum = val.pointNum;
|
|
that.devForm.pointList = val.pointList;
|
|
}
|
|
})
|
|
},
|
|
bindPickerChange: function(e) {
|
|
this.devForm.devIndex = e.detail.value;
|
|
this.devForm.devSn = this.environmentDevList[e.detail.value].devSn;
|
|
this.devForm.devName = this.environmentDevList[e.detail.value].devName;
|
|
this.getDevDetail(this.environmentDevList[e.detail.value].id);
|
|
},
|
|
bindPickerChange2: function(e) {
|
|
this.devForm.uploadIndex = e.detail.value;
|
|
this.devForm.uploadType = this.uploadTypeList[e.detail.value].id;
|
|
},
|
|
bindPickerChange3: function(e) {
|
|
this.devForm.pointIndex = e.detail.value;
|
|
this.devForm.pointNum = this.pointList[e.detail.value].value;
|
|
this.devForm.pointList = [];
|
|
for (let i = 0; i < this.pointList[e.detail.value].value; i++) {
|
|
let obj = { pointName: "", pointNo: i + 1, temperature: "" };
|
|
this.devForm.pointList.push(obj);
|
|
}
|
|
},
|
|
formSubmit(e) {
|
|
var that = this
|
|
if (this.devForm.devIndex == null) {
|
|
uni.showToast({
|
|
title: '请选择设备名称',
|
|
icon: 'none'
|
|
})
|
|
return false;
|
|
}
|
|
if (this.devForm.uploadIndex == null) {
|
|
uni.showToast({
|
|
title: '请选择采集类型',
|
|
icon: 'none'
|
|
})
|
|
return false;
|
|
}
|
|
let params = JSON.parse(JSON.stringify(this.devForm));
|
|
params.projectSn = this.projectDetail.projectSn;
|
|
params.list = params.pointList.map((item) => {
|
|
return {
|
|
...item,
|
|
receiveTime: this.devForm.receiveTime,
|
|
};
|
|
});
|
|
var url = 'xmgl/concreteMonitorCurrentData/manual/edit'
|
|
if (this.isAdd) {
|
|
url = 'xmgl/concreteMonitorCurrentData/manual/add'
|
|
} else {
|
|
params.id = this.devForm.id
|
|
}
|
|
|
|
console.log(params, "params");
|
|
this.sendRequest({
|
|
url: url,
|
|
data: params,
|
|
method: "POST",
|
|
success(res) {
|
|
uni.showToast({
|
|
title: '保存成功！'
|
|
})
|
|
uni.navigateBack()
|
|
}
|
|
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
uni-picker[disabled],
|
|
.disabled {
|
|
// background-color: #F5F7FA;
|
|
// border-color: #E4E7ED;
|
|
// color: #A1A4B0;
|
|
opacity: 0.4;
|
|
border-radius: 32rpx;
|
|
}
|
|
:deep(.point_boxs) {
|
|
border-top: #c1c1c1 1px solid;
|
|
padding-top: 30rpx;
|
|
margin-top: 10rpx;
|
|
.point_box {
|
|
.uni-form-item:nth-child(1) {
|
|
margin-right: 20rpx;
|
|
.uni-form-label {
|
|
width: 80rpx !important;
|
|
}
|
|
.uni-form-input {
|
|
width: calc(100% - 80rpx) !important;
|
|
}
|
|
}
|
|
.uni-form-item:nth-child(2) {
|
|
margin-right: 10rpx;
|
|
.uni-form-label {
|
|
width: 160rpx !important;
|
|
}
|
|
.uni-form-input {
|
|
width: calc(100% - 160rpx) !important;
|
|
}
|
|
}
|
|
.uni-form-item:last-child {
|
|
margin-left: 10rpx;
|
|
.uni-form-label {
|
|
width: 100rpx !important;
|
|
}
|
|
.uni-form-input {
|
|
width: calc(100% - 100rpx) !important;
|
|
}
|
|
}
|
|
.uni-form-input {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
}
|
|
}
|
|
:deep(.uni-date__x-input) {
|
|
height: initial;
|
|
line-height: initial;
|
|
// font-size: 28rpx;
|
|
}
|
|
.addImgBox {
|
|
border: 1px solid rgba(42, 43, 91, 0.1);
|
|
background-color: #f6f5f8;
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border-radius: 20rpx;
|
|
font-size: 24rpx;
|
|
|
|
.icon-add {
|
|
width: 36rpx;
|
|
height: 36rpx;
|
|
}
|
|
}
|
|
|
|
.uni-input {
|
|
&.def {
|
|
color: #ddd;
|
|
}
|
|
|
|
&.text {
|
|
color: #372D66;
|
|
}
|
|
}
|
|
|
|
.imgBox {
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
display: inline-flex;
|
|
position: relative;
|
|
margin-right: 30rpx;
|
|
margin-bottom: 15rpx;
|
|
|
|
.img {
|
|
width: 100%;
|
|
height: 100%;
|
|
border-radius: 20rpx;
|
|
}
|
|
|
|
.deleteImg {
|
|
position: absolute;
|
|
right: -20rpx;
|
|
top: -20rpx;
|
|
}
|
|
}
|
|
|
|
.checkList {
|
|
background-color: #fff;
|
|
|
|
|
|
.scroll-Y {
|
|
height: 600rpx;
|
|
}
|
|
|
|
.header {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
border-bottom: 1rpx solid #ddd;
|
|
padding: 20rpx;
|
|
|
|
.title {
|
|
font-weight: 500;
|
|
}
|
|
|
|
.ok {
|
|
color: $uni-color-primary;
|
|
}
|
|
}
|
|
|
|
|
|
}
|
|
|
|
.checkItem {
|
|
display: flex;
|
|
padding: 20rpx;
|
|
|
|
.name {
|
|
flex: 1;
|
|
margin-right: 20rpx;
|
|
}
|
|
|
|
.check {}
|
|
}
|
|
</style> |