373 lines
8.1 KiB
Vue
373 lines
8.1 KiB
Vue
<template>
|
|
<view class="container">
|
|
<view class="form">
|
|
<view class="form_item">
|
|
<view class="form_top">
|
|
选择站点:
|
|
</view>
|
|
<view class="form_bot">
|
|
<picker @change="bindPickerChange" :value="index" :range="array">
|
|
<view class="dates">
|
|
<view class="uni-input" v-if="!details.stationName" style="color: #808080;">请选择检测站点</view>
|
|
<view class="uni-input" v-else>{{details.stationName}}</view>
|
|
</view>
|
|
<image class="dateimg" src="../../../static/xiala.png" mode="" style="width: 32rpx;height: 16rpx;"></image>
|
|
</picker>
|
|
</view>
|
|
</view>
|
|
<view class="form_item" v-if="details.maintainData3">
|
|
<view class="form_top">
|
|
站点位置:
|
|
</view>
|
|
<input type="text" placeholder="" v-model="details.maintainData3">
|
|
</view>
|
|
<view class="form_item">
|
|
<view class="form_top">
|
|
检测情况:
|
|
</view>
|
|
<view class="form_bot">
|
|
<view class="uni-textarea">
|
|
<textarea placeholder-style="color:#808080" auto-height v-model="details.maintainData1" placeholder="请输入内容" @blur="bindTextAreaBlur"/>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="form_item">
|
|
<view class="form_top">
|
|
负责人:
|
|
</view>
|
|
<input type="text" placeholder="请输入运维人姓名" v-model="details.maintainPerson">
|
|
</view>
|
|
<view class="form_item">
|
|
<view class="form_top">
|
|
联系方式:
|
|
</view>
|
|
<input
|
|
type="text"
|
|
placeholder="请输入联系方式"
|
|
v-model="details.maintainData2"
|
|
@blur="validatePhone"
|
|
maxlength="11"
|
|
/>
|
|
<view class="error-text" v-if="phoneError">{{phoneError}}</view>
|
|
</view>
|
|
<view class="form_item">
|
|
<view class="form_top">
|
|
维护时间:
|
|
</view>
|
|
<view class="form_bot">
|
|
<picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange">
|
|
<view class="dates">
|
|
<view class="uni-input" style="color: #808080;" v-if="!details.maintainTime">请选择维护时间</view>
|
|
<view class="uni-input" v-else>{{details.maintainTime}}</view>
|
|
</view>
|
|
<image class="dateimg" src="../../static/data.png" mode=""></image>
|
|
</picker>
|
|
</view>
|
|
</view>
|
|
<view class="bz_item">
|
|
<view class="bz_top">
|
|
备<span class="bz">注:</span>
|
|
</view>
|
|
<view class="bz_bot">
|
|
<textarea v-model="details.maintainNote" style="width: 100%;"/>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="bot_btn">
|
|
<button class="primary" @click="tosubmit()">提 交</button>
|
|
</view>
|
|
<view class="pagebot"></view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default{
|
|
data(){
|
|
return{
|
|
array:[],
|
|
arrays:[],
|
|
details:{
|
|
createTime: "",
|
|
createdBy: "",
|
|
id: "",
|
|
isDel: 0,
|
|
itemId: "",
|
|
maintainData1: "",
|
|
maintainData2: "",
|
|
maintainData3:"",
|
|
maintainNote: "",
|
|
maintainPerson: "",
|
|
maintainTime: "",
|
|
omName: "",
|
|
reVision: 0,
|
|
stationCode: "",
|
|
stationName: "",
|
|
tenantId: "",
|
|
updatedBy: "",
|
|
updatedTime: "",
|
|
},
|
|
index:'',
|
|
date:'',
|
|
year:'',
|
|
number:'',
|
|
tag:'',
|
|
hobby: [],
|
|
checkbox1: [],
|
|
reload:'true',
|
|
phoneError: '', // 添加错误提示信息
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
this.details = JSON.parse(decodeURIComponent(options.item));
|
|
},
|
|
onShow() {
|
|
this.getazsurvMulchRecord()
|
|
this.getazsurvMulchRecord1()
|
|
},
|
|
methods:{
|
|
// 联系方式格式校验
|
|
validatePhone() {
|
|
const phone = this.details.maintainData2;
|
|
if (!phone) {
|
|
this.phoneError = '';
|
|
return true;
|
|
}
|
|
|
|
// 手机号正则表达式
|
|
const phoneRegex = /^1[3-9]\d{9}$/;
|
|
|
|
if (!phoneRegex.test(phone)) {
|
|
this.phoneError = '请输入正确的手机号码';
|
|
return false;
|
|
} else {
|
|
this.phoneError = '';
|
|
return true;
|
|
}
|
|
},
|
|
// 站点
|
|
getazsurvMulchRecord(){
|
|
this.array = []
|
|
this.arrays = []
|
|
this.$http.get('/applet/survStationInfo/list').then(res=>{
|
|
for(var i=0;i<res.data.data.length;i++){
|
|
this.arrays.push({
|
|
label:res.data.data[i].stationName,
|
|
value:res.data.data[i].stationCode,
|
|
add:res.data.data[i].stationLocation
|
|
})
|
|
this.array.push(res.data.data[i].stationName)
|
|
}
|
|
})
|
|
},
|
|
// 维护内容
|
|
getazsurvMulchRecord1(){
|
|
this.hobby = []
|
|
this.$http.get('/applet/survMaintainItem/list').then(res=>{
|
|
for(var i=0;i<res.data.data.length;i++){
|
|
this.hobby.push({
|
|
text:res.data.data[i].omName,
|
|
value:res.data.data[i].id
|
|
})
|
|
}
|
|
})
|
|
},
|
|
bindPickerChange: function(e) {
|
|
this.index = e.detail.value
|
|
this.details.stationName = this.array[this.index]
|
|
for(var i=0;i<this.arrays.length;i++){
|
|
if(this.details.stationName == this.arrays[i].label){
|
|
this.details.stationCode = this.arrays[i].value
|
|
}
|
|
}
|
|
this.details.maintainData3 = this.arrays[this.index].add
|
|
},
|
|
bindDateChange: function(e) {
|
|
this.details.maintainTime = e.detail.value
|
|
},
|
|
change1(e){
|
|
this.details.itemId = e.detail.value
|
|
},
|
|
bindTextAreaBlur(e) {
|
|
this.details.maintainData1 = e.detail.value
|
|
},
|
|
// 提交
|
|
tosubmit(){
|
|
if(!this.details.stationName){
|
|
uni.showToast({
|
|
title: "请选择站点",
|
|
icon: 'none',
|
|
duration: 2000
|
|
})
|
|
return
|
|
}
|
|
if(!this.details.maintainData1){
|
|
uni.showToast({
|
|
title: "请选择检测内容",
|
|
icon: 'none',
|
|
duration: 2000
|
|
})
|
|
return
|
|
}
|
|
if(!this.details.maintainPerson){
|
|
uni.showToast({
|
|
title: "请输入负责人姓名",
|
|
icon: 'none',
|
|
duration: 2000
|
|
})
|
|
return
|
|
}
|
|
if(!this.details.maintainData2){
|
|
uni.showToast({
|
|
title: "请输入联系方式",
|
|
icon: 'none',
|
|
duration: 2000
|
|
})
|
|
return
|
|
}
|
|
// 添加联系方式格式校验
|
|
if (!this.validatePhone()) {
|
|
uni.showToast({
|
|
title: "请输入正确的手机号码",
|
|
icon: 'none',
|
|
duration: 2000
|
|
})
|
|
return;
|
|
}
|
|
if(!this.details.maintainTime){
|
|
uni.showToast({
|
|
title: "请选择维护时间",
|
|
icon: 'none',
|
|
duration: 2000
|
|
})
|
|
return
|
|
}
|
|
this.$http.post('/applet/survMaintainRecord/edit',this.details).then(res=>{
|
|
uni.showLoading({
|
|
title: '正在提交...'
|
|
});
|
|
if(res.data.code == 0){
|
|
uni.hideLoading();
|
|
uni.navigateBack()
|
|
let pages = getCurrentPages();
|
|
let prevPage = pages[ pages.length - 2 ];
|
|
prevPage.$vm.reload = this.reload;
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page{
|
|
height: 100%;
|
|
background-color: white;
|
|
}
|
|
.form{
|
|
padding: 0 30rpx;
|
|
}
|
|
.form_item{
|
|
padding-top: 33rpx;
|
|
padding-bottom: 25rpx;
|
|
border-bottom: 1rpx solid #e6e6e6;
|
|
}
|
|
.form_top{
|
|
margin-bottom: 26rpx;
|
|
font-weight: bold;
|
|
}
|
|
.form_bot{
|
|
position: relative;
|
|
}
|
|
.dates{
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
.dateimg{
|
|
height: 32rpx;
|
|
width: 32rpx;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
}
|
|
.dw{
|
|
color: #2ac066;
|
|
}
|
|
.item_pic{
|
|
border-bottom:1rpx solid #e4e4e4;
|
|
padding: 30rpx 0rpx;
|
|
font-weight: 500;
|
|
}
|
|
.imgList{
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
.imgList image{
|
|
width: 130rpx;
|
|
height: 130rpx;
|
|
margin-right: 24rpx;
|
|
margin-top: 20rpx;
|
|
}
|
|
.imgList image:nth-child(4n){
|
|
margin-right: 0rpx;
|
|
}
|
|
.bz_item{
|
|
padding: 40rpx 0rpx;
|
|
}
|
|
.bz_top{
|
|
font-weight: bold;
|
|
margin-bottom: 26rpx;
|
|
}
|
|
.bz{
|
|
margin-left: 30rpx;
|
|
}
|
|
.bz_bot{
|
|
color: #767676;
|
|
line-height: 50rpx;
|
|
border: 1rpx solid #ececec;
|
|
border-radius: 10rpx;
|
|
padding: 16rpx;
|
|
}
|
|
.bot_btn{
|
|
padding: 0 30rpx;
|
|
margin-top: 30rpx;
|
|
}
|
|
.primary{
|
|
width: 100%;
|
|
height: 90rpx;
|
|
background-color: #0F6EFF;
|
|
border: none;
|
|
border-radius: 50rpx;
|
|
color:#fff;
|
|
font-weight: bold;
|
|
}
|
|
.pagebot{
|
|
height: 200rpx;
|
|
}
|
|
.text {
|
|
font-size: 12px;
|
|
color: #666;
|
|
margin-top: 5px;
|
|
}
|
|
.uni-px-5 {
|
|
padding-left: 10px;
|
|
padding-right: 10px;
|
|
}
|
|
.uni-pb-5 {
|
|
padding-bottom: 10px;
|
|
}
|
|
.checkpeople{
|
|
width: 187rpx;
|
|
height: 57rpx;
|
|
border: 1rpx dashed #0472e3;
|
|
line-height: 57rpx;
|
|
text-align: center;
|
|
color: #0472e3;
|
|
}
|
|
.error-text {
|
|
color: #ff0000;
|
|
font-size: 24rpx;
|
|
margin-top: 10rpx;
|
|
}
|
|
</style> |