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

80
src/views/device-manage/index.vue
View File

@@ -76,19 +76,19 @@
@change="changeFanData(scope.row)"></el-input> @change="changeFanData(scope.row)"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<!-- <el-table-column prop="serialNumber" label="序列号" align="center" width="500">--> <el-table-column prop="serialNumber" label="序列号" align="center" width="500">
<!-- <template #default="scope">--> <template #default="scope">
<!-- <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"--> <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"
<!-- @change="changeFanData(scope.row)" class="serialNumber">--> @change="changeFanData(scope.row)" class="serialNumber">
<!-- <el-option--> <el-option
<!-- v-for="item in serialNumberOptions"--> v-for="item in serialNumberOptions"
<!-- :key="item.value"--> :key="item.value"
<!-- :label="item.label"--> :label="item.label"
<!-- :value="item.value"--> :value="item.value"
<!-- />--> />
<!-- </el-select>--> </el-select>
<!-- </template>--> </template>
<!-- </el-table-column>--> </el-table-column>
<el-table-column prop="state" label="状态" align="center" min-width="86"> <el-table-column prop="state" label="状态" align="center" min-width="86">
<template #default="scope"> <template #default="scope">
<div class="switch"> <div class="switch">
@@ -160,19 +160,19 @@
@change="changeWindData(scope.row)"></el-input> @change="changeWindData(scope.row)"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<!-- <el-table-column prop="serialNumber" label="序列号" align="center" width="500">--> <el-table-column prop="serialNumber" label="序列号" align="center" width="500">
<!-- <template #default="scope">--> <template #default="scope">
<!-- <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"--> <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"
<!-- @change="changeWindData(scope.row)" class="serialNumber">--> @change="changeWindData(scope.row)" class="serialNumber">
<!-- <el-option--> <el-option
<!-- v-for="item in serialNumberOptions"--> v-for="item in serialNumberOptions"
<!-- :key="item.value"--> :key="item.value"
<!-- :label="item.label"--> :label="item.label"
<!-- :value="item.value"--> :value="item.value"
<!-- />--> />
<!-- </el-select>--> </el-select>
<!-- </template>--> </template>
<!-- </el-table-column>--> </el-table-column>
<el-table-column prop="state" label="状态" align="center"> <el-table-column prop="state" label="状态" align="center">
<template #default="scope"> <template #default="scope">
<div class="switch wind-switch"> <div class="switch wind-switch">
@@ -244,19 +244,19 @@
@change="changeOtherData(scope.row)"></el-input> @change="changeOtherData(scope.row)"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<!-- <el-table-column prop="serialNumber" label="序列号" align="center" width="500">--> <el-table-column prop="serialNumber" label="序列号" align="center" width="500">
<!-- <template #default="scope">--> <template #default="scope">
<!-- <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"--> <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"
<!-- @change="changeOtherData(scope.row)" clearable class="serialNumber">--> @change="changeOtherData(scope.row)" clearable class="serialNumber">
<!-- <el-option--> <el-option
<!-- v-for="item in serialNumberOptions"--> v-for="item in serialNumberOptions"
<!-- :key="item.value"--> :key="item.value"
<!-- :label="item.label"--> :label="item.label"
<!-- :value="item.value"--> :value="item.value"
<!-- />--> />
<!-- </el-select>--> </el-select>
<!-- </template>--> </template>
<!-- </el-table-column>--> </el-table-column>
<el-table-column prop="state" label="状态" align="center"> <el-table-column prop="state" label="状态" align="center">
<template #default="scope"> <template #default="scope">
<div class="switch wind-switch"> <div class="switch wind-switch">
@@ -630,7 +630,7 @@ getList()
.device-box { .device-box {
display: flex; display: flex;
width: 2680px; width: 2800px;
height: 1600px; height: 1600px;
background: #064B66; background: #064B66;
border-radius: 20px; border-radius: 20px;

17
src/views/edit/edit.vue
View File

@@ -22,12 +22,18 @@
<el-form-item label="序列号前缀" prop="serialNumberPrefix"> <el-form-item label="序列号前缀" prop="serialNumberPrefix">
<el-input v-model="form.serialNumberPrefix" placeholder="请输入序列号前缀"/> <el-input v-model="form.serialNumberPrefix" placeholder="请输入序列号前缀"/>
</el-form-item> </el-form-item>
<el-form-item label="序列号" prop="serialNumberOne">
<el-input v-model="form.serialNumberOne" placeholder="请输入序列号"/>
</el-form-item>
<el-form-item label="序列号1" prop="serialNumber"> <el-form-item label="序列号1" prop="serialNumber">
<el-input v-model="form.serialNumber" placeholder="请输入序列号1"/> <el-input v-model="form.serialNumber" placeholder="请输入序列号1"/>
</el-form-item> </el-form-item>
<div style="display: flex;flex-direction: column">
<div v-for="(item,index) in form.serialNumberList" :key="index" >
<el-form-item :label="'序列号'+(index+2)">
<div style="flex: 1;display: flex;">
<el-input v-model="item.serialNumberOne" :placeholder="'请输入序列号'+(index+2)" />
</div>
</el-form-item>
</div>
</div>
<el-form-item label="隧道长度"> <el-form-item label="隧道长度">
<el-input type="number" v-model="form.totalLength" placeholder="请输入隧道长度"/> <el-input type="number" v-model="form.totalLength" placeholder="请输入隧道长度"/>
</el-form-item> </el-form-item>
@@ -103,6 +109,7 @@ const form = ref({
dropFrequency: '', dropFrequency: '',
isDefault: false, isDefault: false,
remarks: "", remarks: "",
serialNumberList:[]
}); });
const getTunnel = () => { const getTunnel = () => {
const loading = ElLoading.service({ const loading = ElLoading.service({
@@ -113,6 +120,7 @@ const getTunnel = () => {
}) })
getTunnelDetail(tunnelId).then((res) => { getTunnelDetail(tunnelId).then((res) => {
if (res?.code === 1000) { if (res?.code === 1000) {
res.data.serialNumberList= res.data.serialNumberList?.map(item=>({serialNumberOne:item}))
form.value = res.data; form.value = res.data;
} }
loading.close() loading.close()
@@ -136,9 +144,12 @@ const getTunnelInfo = () => {
if (modelEquipmentList.value === null) { if (modelEquipmentList.value === null) {
modelEquipmentList.value = [] modelEquipmentList.value = []
} }
let serialNumberList=form.value.serialNumberList.map(item=>item.serialNumberOne)
const data = { const data = {
tunnelId: tunnelId, tunnelId: tunnelId,
...form.value, ...form.value,
serialNumberList:serialNumberList,
tunnelLength: form.value.totalLength, tunnelLength: form.value.totalLength,
modelEquipmentList: modelEquipmentList.value, modelEquipmentList: modelEquipmentList.value,
}; };

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

@@ -97,16 +97,27 @@
<el-form-item label="隧道简称" prop="tunnelAlias"> <el-form-item label="隧道简称" prop="tunnelAlias">
<el-input v-model="form.tunnelAlias" placeholder="请输入隧道简称"/> <el-input v-model="form.tunnelAlias" placeholder="请输入隧道简称"/>
</el-form-item> </el-form-item>
<!-- <el-form-item label="序列号前缀" prop="serialNumberPrefix">--> <el-form-item label="序列号前缀" prop="serialNumberPrefix">
<!-- <el-input v-model="form.serialNumberPrefix" placeholder="请输入序列号前缀"/>--> <el-input v-model="form.serialNumberPrefix" placeholder="请输入序列号前缀"/>
<!-- </el-form-item>--> </el-form-item>
<!-- <el-form-item label="序列号1" prop="serialNumber">--> <el-form-item label="PLC序列号" prop="serialNumber">
<!-- <el-input v-model="form.serialNumber" placeholder="请输入序列号1"/>--> <el-input v-model="form.serialNumber" placeholder="请输入PLC序列号"/>
<!-- </el-form-item>--> </el-form-item>
<!-- <el-form-item label="序列号2" prop="serialNumberOne">--> <div style="display: flex;flex-direction: column">
<!-- <el-input v-model="form.serialNumberOne" placeholder="请输入序列号2"/>--> <div v-for="(item,index) in serialNumberList" :key="index" >
<!-- </el-form-item>--> <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-form-item label="隧道长度" prop="totalLength">
<el-input type="number" v-model="form.totalLength" placeholder="请输入隧道长度"/> <el-input type="number" v-model="form.totalLength" placeholder="请输入隧道长度"/>
</el-form-item> </el-form-item>
@@ -177,6 +188,12 @@ import TunnelTitle from "@/components/tunnelTitle/index.vue";
import {getTunnelBySiteId} from "@/api/largeScreen"; import {getTunnelBySiteId} from "@/api/largeScreen";
import {debounce} from 'lodash' import {debounce} from 'lodash'
const serialNumberList = ref([
{
serialNumberOne: ''
}
])
const validateNumber = (rule, value) => { const validateNumber = (rule, value) => {
const reg = /^[A-Za-z0-9]+$/; const reg = /^[A-Za-z0-9]+$/;
return reg.test(value); return reg.test(value);
@@ -184,9 +201,6 @@ const validateNumber = (rule, value) => {
const validateSerialNumberPrefix = (rule, value) => { const validateSerialNumberPrefix = (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 validateSerialNumberOnePrefix = (rule, value) => {
return value.length > 13 && value.slice(0,-2) == form.value.serialNumberPrefix;
}
const router = useRouter() const router = useRouter()
const siteImage = ref() const siteImage = ref()
const showAddIcon = ref(true) const showAddIcon = ref(true)
@@ -319,6 +333,14 @@ const total = ref(10);
onMounted(() => { onMounted(() => {
showOperation.value = localStorage.getItem('roleKey') !== 'tunnel_admin'; showOperation.value = localStorage.getItem('roleKey') !== 'tunnel_admin';
}) })
const addSerialNumber = () => {
serialNumberList.value.push({
serialNumberOne: ''
})
}
const delSerialNumber = (index) => {
serialNumberList.value.splice(index, 1)
}
const getSiteImg = () => { const getSiteImg = () => {
showNull.value = false showNull.value = false
getSiteDrawing(siteId).then((res) => { getSiteDrawing(siteId).then((res) => {
@@ -405,12 +427,14 @@ const handleCurrentChange = (val) => {
getList() getList()
} }
const handleSubmit = debounce((instance) => { const handleSubmit = debounce((instance) => {
let serialNumberListParam=serialNumberList.value.map(item=>item.serialNumberOne)
if (!instance) return if (!instance) return
instance.validate(async (valid) => { instance.validate(async (valid) => {
if (!valid) return if (!valid) return
const data = { const data = {
siteId: siteId, siteId: siteId,
...form.value ...form.value,
serialNumberList:serialNumberListParam
} }
addTunnel(data).then(res => { addTunnel(data).then(res => {
if (res.code === 1000) { if (res.code === 1000) {
@@ -543,6 +567,7 @@ const handleMoreDelete = debounce(() => {
font-size: 60px; font-size: 60px;
color: #05FEFF; color: #05FEFF;
} }
:deep(.el-form-item__error) { :deep(.el-form-item__error) {
font-size: 35px; font-size: 35px;
} }