odjbin/tunnel-cloud-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix : 新增隧道时多序列号

Browse Source
This commit is contained in:
odjbin
2024-08-20 00:21:47 +08:00
parent f5f178f2a2
commit 9e4cee4cae
3 changed files with 118 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

103
src/views/tunnel-manage/index.vue
View File

@@ -8,16 +8,16 @@
<div class="site-name">
{{ siteName }}
</div>
<!-- <div class="model-change">-->
<!-- <div class="model" @click="clickModel=1;showNull=false">-->
<!-- <div class="card-bg"></div>-->
<!-- <span>卡片模式</span>-->
<!-- </div>-->
<!-- <div class="model" @click="clickModel=2;getSiteImg()">-->
<!-- <div class="img-bg"></div>-->
<!-- <span>图纸导航</span>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="model-change">-->
<!-- <div class="model" @click="clickModel=1;showNull=false">-->
<!-- <div class="card-bg"></div>-->
<!-- <span>卡片模式</span>-->
<!-- </div>-->
<!-- <div class="model" @click="clickModel=2;getSiteImg()">-->
<!-- <div class="img-bg"></div>-->
<!-- <span>图纸导航</span>-->
<!-- </div>-->
<!-- </div>-->
<tunnel-title/>
<div class="all-del-btn" v-if="showOperation">
<div class="all-btn" style=" margin-right: 40px;" v-if="!showAddIcon" @click="handleAdd">
@@ -78,8 +78,8 @@
</div>
<div class="img-box" v-else>
<!-- @/assets/images/tunnel/img.png-->
<!-- <img :src="'data:image/png;base64,'+siteImage" style="width:3500px;height:1789px" id="imgModel" usemap="#image"-->
<!-- alt="" @click="clickHandler">-->
<!-- <img :src="'data:image/png;base64,'+siteImage" style="width:3500px;height:1789px" id="imgModel" usemap="#image"-->
<!-- alt="" @click="clickHandler">-->
<map name="image" id="image">
<area shape="poly" v-for="(item,index) in coordsList" :coords="item.coords" :key="index" alt=""
:title="item.tunnelId+'隧道'" :href="'/' + item.tunnelId + '/' + siteId" @click="clickHot(item.tunnelId)">
@@ -97,16 +97,27 @@
<el-form-item label="隧道简称" prop="tunnelAlias">
<el-input v-model="form.tunnelAlias" placeholder="请输入隧道简称"/>
</el-form-item>
<!-- <el-form-item label="序列号前缀" prop="serialNumberPrefix">-->
<!-- <el-input v-model="form.serialNumberPrefix" placeholder="请输入序列号前缀"/>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="序列号1" prop="serialNumber">-->
<!-- <el-input v-model="form.serialNumber" placeholder="请输入序列号1"/>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="序列号2" prop="serialNumberOne">-->
<!-- <el-input v-model="form.serialNumberOne" placeholder="请输入序列号2"/>-->
<!-- </el-form-item>-->
<el-form-item label="序列号前缀" prop="serialNumberPrefix">
<el-input v-model="form.serialNumberPrefix" placeholder="请输入序列号前缀"/>
</el-form-item>
<el-form-item label="PLC序列号" prop="serialNumber">
<el-input v-model="form.serialNumber" placeholder="请输入PLC序列号"/>
</el-form-item>
<div style="display: flex;flex-direction: column">
<div v-for="(item,index) in serialNumberList" :key="index" >
<el-form-item :label="'序列号'+(index+2)">
<div style="flex: 1;display: flex;">
<el-input v-model="item.serialNumberOne" :placeholder="'请输入序列号'+(index+2)" />
<el-icon size="74" color="#08B7B8" style="margin-left: 20px;cursor: pointer" @click="addSerialNumber" v-if="index===0">
<CirclePlus/>
</el-icon>
<el-icon v-else size="74" color="#08B7B8" style="margin-left: 20px;cursor: pointer" @click="delSerialNumber(index)" >
<Remove/>
</el-icon>
</div>
</el-form-item>
</div>
</div>
<el-form-item label="隧道长度" prop="totalLength">
<el-input type="number" v-model="form.totalLength" placeholder="请输入隧道长度"/>
</el-form-item>
@@ -175,17 +186,20 @@ import {getTunnelList, addTunnel, deleteTunnel} from "@/api/tunnelManage";
import {getSiteDrawing, getSiteDetail} from "@/api/site";
import TunnelTitle from "@/components/tunnelTitle/index.vue";
import {getTunnelBySiteId} from "@/api/largeScreen";
import { debounce } from 'lodash'
import {debounce} from 'lodash'
const serialNumberList = ref([
{
serialNumberOne: ''
}
])
const validateNumber = (rule, value) => {
const reg = /^[A-Za-z0-9]+$/;
return reg.test(value);
}
const validateSerialNumberPrefix = (rule, value) => {
return value.length > 13 && value.slice(0,-2) == form.value.serialNumberPrefix;
}
const validateSerialNumberOnePrefix = (rule, value) => {
return value.length > 13 && value.slice(0,-2) == form.value.serialNumberPrefix;
return value.length > 13 && value.slice(0, -2) == form.value.serialNumberPrefix;
}
const router = useRouter()
const siteImage = ref()
@@ -200,12 +214,12 @@ const formRules = ref({
serialNumberPrefix: [
{required: true, message: '请输入序列号前缀', trigger: ['blur', 'change']},
{validator: validateNumber, message: '请输入英文、数字、英文数字组合的序列号前缀', trigger: ['blur', 'change']},
{ min:14,max:14,message: '隧道序列号前缀长度为14位',trigger: ['blur', 'change'] },
{min: 14, max: 14, message: '隧道序列号前缀长度为14位', trigger: ['blur', 'change']},
],
serialNumber: [
{required: true, message: '请输入序列号1', trigger: ['blur', 'change']},
{validator: validateNumber, message: '请输入英文、数字、英文数字组合的序列号1', trigger: ['blur', 'change']},
{ min:16,max:16,message: '隧道序列号1长度为16位',trigger: ['blur', 'change']},
{min: 16, max: 16, message: '隧道序列号1长度为16位', trigger: ['blur', 'change']},
// {validator: validateSerialNumberPrefix, message: '同一隧道的序列号前缀需相同', trigger: ['blur', 'change']}
],
serialNumberOne: [
@@ -319,11 +333,19 @@ const total = ref(10);
onMounted(() => {
showOperation.value = localStorage.getItem('roleKey') !== 'tunnel_admin';
})
const addSerialNumber = () => {
serialNumberList.value.push({
serialNumberOne: ''
})
}
const delSerialNumber = (index) => {
serialNumberList.value.splice(index, 1)
}
const getSiteImg = () => {
showNull.value=false
showNull.value = false
getSiteDrawing(siteId).then((res) => {
if (res.code === 1000) {
if(res.data.drawingData===null){
if (res.data.drawingData === null) {
// ElMessageBox.confirm('暂无图纸, 是否前往站点管理上传图纸?', '系统提示', {
// confirmButtonText: '确定',
// cancelButtonText: '取消',
@@ -331,10 +353,10 @@ const getSiteImg = () => {
// }).then(() => {
// router.push('/site/' + userId + '/' + localStorage.getItem('currentSiteId'))
// }).catch(()=>{
showNull.value=true
showNull.value = true
// })
}else{
showNull.value=false
} else {
showNull.value = false
siteImage.value = res.data.drawingData
}
}
@@ -405,12 +427,14 @@ const handleCurrentChange = (val) => {
getList()
}
const handleSubmit = debounce((instance) => {
let serialNumberListParam=serialNumberList.value.map(item=>item.serialNumberOne)
if (!instance) return
instance.validate(async (valid) => {
if (!valid) return
const data = {
siteId: siteId,
...form.value
...form.value,
serialNumberList:serialNumberListParam
}
addTunnel(data).then(res => {
if (res.code === 1000) {
@@ -422,7 +446,7 @@ const handleSubmit = debounce((instance) => {
}
})
})
},100)
}, 100)
//预览隧道
const handlePreview = (id) => {
console.log('预览')
@@ -459,7 +483,7 @@ const handleChooseAll = debounce(() => {
})
}
})
},100)
}, 100)
const handleEditDevice = (tunnelId) => {
if (type === 'bySite') {
router.push('/device/' + tunnelId + '/bySite/' + userId)
@@ -533,16 +557,17 @@ const handleMoreDelete = debounce(() => {
})
})
}
},100)
}, 100)
</script>
<style scoped lang="scss">
.showNull{
.showNull {
margin-top: 150px;
font-size: 60px;
color: #05FEFF;
}
:deep(.el-form-item__error) {
font-size: 35px;
}