From 0893453647466cd27bb54fe08a2531f33f569e69 Mon Sep 17 00:00:00 2001 From: 黄何裕 <1053952480@qq.com> Date: 星期二, 16 七月 2024 17:38:40 +0800 Subject: [PATCH] 工单阈值样式修改 --- src/views/system/work-order/threshold/index.vue | 1247 ++++++++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 982 insertions(+), 265 deletions(-) diff --git a/src/views/system/work-order/threshold/index.vue b/src/views/system/work-order/threshold/index.vue index 54f88b9..8754259 100644 --- a/src/views/system/work-order/threshold/index.vue +++ b/src/views/system/work-order/threshold/index.vue @@ -1,21 +1,459 @@ <template> <div class="app-container"> -<!-- <el-row :gutter="10" class="mb8">--> -<!-- <el-col :span="1.5">--> -<!-- <el-button--> -<!-- type="primary"--> -<!-- plain--> -<!-- icon="el-icon-plus"--> -<!-- size="mini"--> -<!-- @click="handleAdd"--> -<!-- v-hasPermi="['ycl:threshold:add']"--> -<!-- >鏂板--> -<!-- </el-button>--> -<!-- </el-col>--> -<!-- </el-row>--> + <!-- <el-row :gutter="10" class="mb8">--> + <!-- <el-col :span="1.5">--> + <!-- <el-button--> + <!-- type="primary"--> + <!-- plain--> + <!-- icon="el-icon-plus"--> + <!-- size="mini"--> + <!-- @click="handleAdd"--> + <!-- v-hasPermi="['ycl:threshold:add']"--> + <!-- >鏂板--> + <!-- </el-button>--> + <!-- </el-col>--> + <!-- </el-row>--> + <el-row> + <el-col :span="8"> + <el-card style="margin-bottom: 20px; height: 340px; margin-right: 20px"> + <div style="display: flex; justify-content: space-between"> + <div class="header鈥攖ext">瑙嗛</div> + <div> + <el-button + size="mini" + type="text" + icon="el-icon-edit" + v-hasPermi="['ycl:threshold:edit']" + @click="a()" + v-if="!ifEdit" + >淇敼 + </el-button> + <el-button size="mini" type="primary" @click="a()" v-if="ifEdit" + >淇濆瓨 + </el-button> + </div> + </div> + <div + style=" + margin: 20px; + display: flex; + width: 350px; + justify-content: space-between; + " + > + <div> + <span style="font-size: small">宸ュ崟闃堝��</span> + <div> + <el-form label-width="100px"> + <el-form-item label="鍥惧儚璐ㄩ噺"> + <el-input + v-model="videoList.imageQuality" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ + thresholdList[0].imageQuality + }}</span></el-form-item + > + <el-form-item label="瑙嗛璐ㄩ噺"> + <el-input + v-model="videoList.videoQuality" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ + thresholdList[0].videoQuality + }}</span></el-form-item + > + <el-form-item label="鏍囨敞鍑嗙‘鐜�"> + <el-input + v-model="videoList.annotationAccuracy" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ + thresholdList[0].annotationAccuracy + }}</span></el-form-item + > + </el-form> + </div> + </div> + <div> + <span style="font-size: small">涓嬪彂闃堝��</span> + <div> + <el-form + ref="form" + :model="thresholdList[0]" + label-width="100px" + > + <el-form-item label="鍥惧儚璐ㄩ噺"> + <el-input + v-model="videoList.imageQualityAuto" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ + thresholdList[0].imageQualityAuto + }}</span></el-form-item + > + <el-form-item label="瑙嗛璐ㄩ噺"> + <el-input + v-model="videoList.videoQualityAuto" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ + thresholdList[0].videoQualityAuto + }}</span></el-form-item + > + <el-form-item label="鏍囨敞鍑嗙‘鐜�"> + <el-input + v-model="videoList.annotationAccuracyAuto" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ + thresholdList[0].annotationAccuracyAuto + }}</span></el-form-item + > + </el-form> + </div> + </div> + </div> + </el-card> + </el-col> + <el-col :span="8"> + <el-card style="margin-bottom: 20px; height: 340px; margin-right: 20px"> + <div style="display: flex; justify-content: space-between"> + <div class="header鈥攖ext">浜鸿劯</div> + <div> + <el-button + size="mini" + type="text" + icon="el-icon-edit" + v-hasPermi="['ycl:threshold:edit']" + @click="a()" + v-if="!ifEdit" + >淇敼 + </el-button> + <el-button size="mini" type="primary" @click="a()" v-if="ifEdit" + >淇濆瓨 + </el-button> + </div> + </div> + <div + style=" + margin: 20px; + display: flex; + width: 350px; + justify-content: space-between; + " + > + <div> + <span style="font-size: small">宸ュ崟闃堝��</span> + <div> + <el-form label-width="100px"> + <el-form-item label="鎶撴媿閲�"> + <el-input + v-model="faceList.captureNum" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ thresholdList[1].captureNum }}</span></el-form-item + > + <el-form-item label="鍙婃椂鐜�"> + <el-input + v-model="faceList.timelyRate" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ thresholdList[1].timelyRate }}</span></el-form-item + > + <el-form-item label="寤惰繜閲�"> + <el-input + v-model="faceList.delayAmount" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ thresholdList[1].delayAmount }}</span></el-form-item + > + <el-form-item label="璁惧娲昏穬鐜�"> + <el-input + v-model="faceList.deviceActiveRate" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ thresholdList[1].deviceActiveRate }}</span></el-form-item + > + <el-form-item label="鎶撴媿鍙婃椂鐜�"> + <el-input + v-model="faceList.name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ thresholdList[1].deviceActiveRate }}</span></el-form-item + > + <el-form-item label="鏃堕挓鍑嗙‘鐜�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + </el-form> + </div> + </div> + <div> + <span style="font-size: small">涓嬪彂闃堝��</span> + <div> + <el-form + ref="form" + :model="thresholdList[0]" + label-width="100px" + > + <el-form-item label="鎶撴媿閲�"> + <el-input + v-model="thresholdList[1].captureNum" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ + thresholdList[1].captureNum + }}</span></el-form-item + > + <el-form-item label="鍙婃椂鐜�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + <el-form-item label="寤惰繜閲�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + <el-form-item label="璁惧娲昏穬鐜�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + <el-form-item label="鎶撴媿鍙婃椂鐜�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + <el-form-item label="鏃堕挓鍑嗙‘鐜�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + </el-form> + </div> + </div> + </div> + </el-card></el-col + > + <el-col :span="8"> + <el-card style="margin-bottom: 20px; height: 340px; margin-right: 20px"> + <div style="display: flex; justify-content: space-between"> + <div class="header鈥攖ext">杞﹁締</div> + <div> + <el-button + size="mini" + type="text" + icon="el-icon-edit" + v-hasPermi="['ycl:threshold:edit']" + @click="a()" + v-if="!ifEdit" + >淇敼 + </el-button> + <el-button size="mini" type="primary" @click="a()" v-if="ifEdit" + >淇濆瓨 + </el-button> + </div> + </div> + <div + style=" + margin: 20px; + display: flex; + width: 350px; + justify-content: space-between; + " + > + <div> + <span style="font-size: small">宸ュ崟闃堝��</span> + <div> + <el-form + ref="form" + :model="thresholdList[0]" + label-width="120px" + > + <el-form-item label="杩囪溅鏁版嵁閲�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + <el-form-item label="杩囪溅缂哄け鐜�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + <el-form-item label="鏈夋晥杩囪溅鏁版嵁閲�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + <el-form-item label="璁惧娲昏穬鐜�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + <el-form-item label="鎶撴媿鍙婃椂鐜�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + <el-form-item label="鏃堕挓鍑嗙‘鐜�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + </el-form> + </div> + </div> + <div> + <span style="font-size: small">涓嬪彂闃堝��</span> + <div> + <el-form + ref="form" + :model="thresholdList[0]" + label-width="120px" + > + <el-form-item label="杩囪溅鏁版嵁閲�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + <el-form-item label="杩囪溅缂哄け鐜�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + <el-form-item label="鏈夋晥杩囪溅鏁版嵁閲�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + <el-form-item label="璁惧娲昏穬鐜�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + <el-form-item label="鎶撴媿鍙婃椂鐜�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + <el-form-item label="鏃堕挓鍑嗙‘鐜�"> + <el-input + v-model="thresholdList[0].name" + size="mini" + style="width: 100px" + v-if="ifEdit" + ></el-input> + <span v-else>{{ 10 }}</span></el-form-item + > + </el-form> + </div> + </div> + </div> + </el-card></el-col + > + </el-row> - <el-table v-loading="loading" :data="thresholdList" @selection-change="handleSelectionChange"> - <el-table-column type="selection" width="55" align="center"/> + <!-- <el-table + v-loading="loading" + :data="thresholdList" + @selection-change="handleSelectionChange" + > + <el-table-column type="selection" width="55" align="center" /> <el-table-column label="璁惧绫诲瀷" align="center" prop="monitorType"> <template slot-scope="scope"> <span v-show="scope.row['monitorType'] === 'face'">浜鸿劯</span> @@ -62,7 +500,9 @@ </div> <div class="table-row"> <div class="table-row-item">鏈夋晥杩囪溅鏁版嵁閲�</div> - <div class="table-row-item">{{ scope.row.passCarEffectiveNum }}</div> + <div class="table-row-item"> + {{ scope.row.passCarEffectiveNum }} + </div> </div> <div class="table-row"> <div class="table-row-item">璁惧娲昏穬鐜�</div> @@ -78,17 +518,19 @@ </div> </template> <template v-else-if="scope.row.monitorType === 'video'"> - <div class="table-row" style="display: flex;flex-direction: row"> + <div class="table-row" style="display: flex; flex-direction: row"> <div class="table-row-item">鍥惧儚璐ㄩ噺</div> <div class="table-row-item">{{ scope.row.imageQuality }}</div> </div> - <div class="table-row" style="display: flex;flex-direction: row"> + <div class="table-row" style="display: flex; flex-direction: row"> <div class="table-row-item">瑙嗛璐ㄩ噺</div> <div class="table-row-item">{{ scope.row.videoQuality }}</div> </div> - <div class="table-row" style="display: flex;flex-direction: row"> + <div class="table-row" style="display: flex; flex-direction: row"> <div class="table-row-item">鏍囨敞鍑嗙‘鐜�</div> - <div class="table-row-item">{{ scope.row.annotationAccuracy }}</div> + <div class="table-row-item"> + {{ scope.row.annotationAccuracy }} + </div> </div> </template> </template> @@ -110,11 +552,15 @@ </div> <div class="table-row"> <div class="table-row-item">璁惧娲昏穬鐜�</div> - <div class="table-row-item">{{ scope.row.deviceActiveRateAuto }}</div> + <div class="table-row-item"> + {{ scope.row.deviceActiveRateAuto }} + </div> </div> <div class="table-row"> <div class="table-row-item">鎶撴媿鍙婃椂鐜�</div> - <div class="table-row-item">{{ scope.row.timelyCaptureAuto }}</div> + <div class="table-row-item"> + {{ scope.row.timelyCaptureAuto }} + </div> </div> <div class="table-row"> <div class="table-row-item">鏃堕挓鍑嗙‘鐜�</div> @@ -128,19 +574,27 @@ </div> <div class="table-row"> <div class="table-row-item">杩囪溅缂哄け鐜�</div> - <div class="table-row-item">{{ scope.row.passCarMissRateAuto }}</div> + <div class="table-row-item"> + {{ scope.row.passCarMissRateAuto }} + </div> </div> <div class="table-row"> <div class="table-row-item">鏈夋晥杩囪溅鏁版嵁閲�</div> - <div class="table-row-item">{{ scope.row.passCarEffectiveNumAuto }}</div> + <div class="table-row-item"> + {{ scope.row.passCarEffectiveNumAuto }} + </div> </div> <div class="table-row"> <div class="table-row-item">璁惧娲昏穬鐜�</div> - <div class="table-row-item">{{ scope.row.deviceActiveRateAuto }}</div> + <div class="table-row-item"> + {{ scope.row.deviceActiveRateAuto }} + </div> </div> <div class="table-row"> <div class="table-row-item">鎶撴媿鍙婃椂鐜�</div> - <div class="table-row-item">{{ scope.row.timelyCaptureAuto }}</div> + <div class="table-row-item"> + {{ scope.row.timelyCaptureAuto }} + </div> </div> <div class="table-row"> <div class="table-row-item">鏃堕挓鍑嗙‘鐜�</div> @@ -158,12 +612,18 @@ </div> <div class="table-row"> <div class="table-row-item">鏍囨敞鍑嗙‘鐜�</div> - <div class="table-row-item">{{ scope.row.annotationAccuracyAuto }}</div> + <div class="table-row-item"> + {{ scope.row.annotationAccuracyAuto }} + </div> </div> </template> </template> </el-table-column> - <el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width"> + <el-table-column + label="鎿嶄綔" + align="center" + class-name="small-padding fixed-width" + > <template slot-scope="scope"> <el-button size="mini" @@ -171,54 +631,128 @@ icon="el-icon-edit" v-hasPermi="['ycl:threshold:edit']" @click="updateWho(scope.row)" - >淇敼 + >淇敼 </el-button> -<!-- <el-button--> -<!-- size="mini"--> -<!-- type="text"--> -<!-- icon="el-icon-delete"--> -<!-- @click="handleDelete(scope.row)"--> -<!-- v-hasPermi="['ycl:threshold:remove']"--> -<!-- >鍒犻櫎--> -<!-- </el-button>--> </template> </el-table-column> - </el-table> + </el-table> --> - <pagination - v-show="total>0" + <!-- <pagination + v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" - /> + /> --> <!-- 浜鸿劯闃堝�� --> - <el-dialog title="淇敼浜鸿劯宸ュ崟闃堝��" :visible.sync="faceOpen" width="700px" append-to-body> - <el-form ref="faceForm" :model="faceForm" label-width="150px" :inline="true"> + <el-dialog + title="淇敼浜鸿劯宸ュ崟闃堝��" + :visible.sync="faceOpen" + width="700px" + append-to-body + > + <el-form + ref="faceForm" + :model="faceForm" + label-width="150px" + :inline="true" + > <el-form-item class="fixedWidth" label="鎶撴媿閲�" prop="captureNum"> - <el-input clearable size="small" v-model="faceForm.captureNum" placeholder="宸ュ崟闃堝��"/> - <el-input clearable size="small" v-model="faceForm.captureNumAuto" placeholder="涓嬪彂闃堝��"/> + <el-input + clearable + size="small" + v-model="faceForm.captureNum" + placeholder="宸ュ崟闃堝��" + /> + <el-input + clearable + size="small" + v-model="faceForm.captureNumAuto" + placeholder="涓嬪彂闃堝��" + /> </el-form-item> <el-form-item class="fixedWidth" label="杩囪溅缂哄け鐜�" prop="timelyRate"> - <el-input clearable size="small" v-model="faceForm.timelyRate" placeholder="宸ュ崟闃堝��"/> - <el-input clearable size="small" v-model="faceForm.timelyRateAuto" placeholder="涓嬪彂闃堝��"/> + <el-input + clearable + size="small" + v-model="faceForm.timelyRate" + placeholder="宸ュ崟闃堝��" + /> + <el-input + clearable + size="small" + v-model="faceForm.timelyRateAuto" + placeholder="涓嬪彂闃堝��" + /> </el-form-item> <el-form-item class="fixedWidth" label="寤惰繜閲�" prop="delayAmount"> - <el-input clearable size="small" v-model="faceForm.delayAmount" placeholder="宸ュ崟闃堝��"/> - <el-input clearable size="small" v-model="faceForm.delayAmountAuto" placeholder="涓嬪彂闃堝��"/> + <el-input + clearable + size="small" + v-model="faceForm.delayAmount" + placeholder="宸ュ崟闃堝��" + /> + <el-input + clearable + size="small" + v-model="faceForm.delayAmountAuto" + placeholder="涓嬪彂闃堝��" + /> </el-form-item> - <el-form-item class="fixedWidth" label="璁惧娲昏穬鐜�" prop="deviceActiveRate"> - <el-input clearable size="small" v-model="faceForm.deviceActiveRate" placeholder="宸ュ崟闃堝��"/> - <el-input clearable size="small" v-model="faceForm.deviceActiveRateAuto" placeholder="涓嬪彂闃堝��"/> + <el-form-item + class="fixedWidth" + label="璁惧娲昏穬鐜�" + prop="deviceActiveRate" + > + <el-input + clearable + size="small" + v-model="faceForm.deviceActiveRate" + placeholder="宸ュ崟闃堝��" + /> + <el-input + clearable + size="small" + v-model="faceForm.deviceActiveRateAuto" + placeholder="涓嬪彂闃堝��" + /> </el-form-item> - <el-form-item class="fixedWidth" label="鎶撴媿鍙婃椂鐜�" prop="timelyCapture"> - <el-input clearable size="small" v-model="faceForm.timelyCapture" placeholder="宸ュ崟闃堝��"/> - <el-input clearable size="small" v-model="faceForm.timelyCaptureAuto" placeholder="涓嬪彂闃堝��"/> + <el-form-item + class="fixedWidth" + label="鎶撴媿鍙婃椂鐜�" + prop="timelyCapture" + > + <el-input + clearable + size="small" + v-model="faceForm.timelyCapture" + placeholder="宸ュ崟闃堝��" + /> + <el-input + clearable + size="small" + v-model="faceForm.timelyCaptureAuto" + placeholder="涓嬪彂闃堝��" + /> </el-form-item> - <el-form-item class="fixedWidth" label="鏃堕挓鍑嗙‘鐜�" prop="deviceActiveRate"> - <el-input clearable size="small" v-model="faceForm.timeAccuracy" placeholder="宸ュ崟闃堝��"/> - <el-input clearable size="small" v-model="faceForm.timeAccuracyAuto" placeholder="涓嬪彂闃堝��"/> + <el-form-item + class="fixedWidth" + label="鏃堕挓鍑嗙‘鐜�" + prop="deviceActiveRate" + > + <el-input + clearable + size="small" + v-model="faceForm.timeAccuracy" + placeholder="宸ュ崟闃堝��" + /> + <el-input + clearable + size="small" + v-model="faceForm.timeAccuracyAuto" + placeholder="涓嬪彂闃堝��" + /> </el-form-item> </el-form> <div slot="footer" class="dialog-footer"> @@ -228,31 +762,117 @@ </el-dialog> <!-- 杞﹁締闃堝�� --> - <el-dialog title="淇敼杞﹁締宸ュ崟闃堝��" :visible.sync="carOpen" width="700px" append-to-body> - <el-form ref="faceForm" :model="faceForm" label-width="150px" :inline="true"> + <el-dialog + title="淇敼杞﹁締宸ュ崟闃堝��" + :visible.sync="carOpen" + width="700px" + append-to-body + > + <el-form + ref="faceForm" + :model="faceForm" + label-width="150px" + :inline="true" + > <el-form-item class="fixedWidth" label="杩囪溅鏁版嵁閲�" prop="passCarNum"> - <el-input clearable size="small" v-model="carForm.passCarNum" placeholder="宸ュ崟闃堝��"/> - <el-input clearable size="small" v-model="carForm.passCarNumAuto" placeholder="涓嬪彂闃堝��"/> + <el-input + clearable + size="small" + v-model="carForm.passCarNum" + placeholder="宸ュ崟闃堝��" + /> + <el-input + clearable + size="small" + v-model="carForm.passCarNumAuto" + placeholder="涓嬪彂闃堝��" + /> </el-form-item> - <el-form-item class="fixedWidth" label="杩囪溅缂哄け鐜�" prop="passCarMissRate"> - <el-input clearable size="small" v-model="carForm.passCarMissRate" placeholder="宸ュ崟闃堝��"/> - <el-input clearable size="small" v-model="carForm.passCarMissRateAuto" placeholder="涓嬪彂闃堝��"/> + <el-form-item + class="fixedWidth" + label="杩囪溅缂哄け鐜�" + prop="passCarMissRate" + > + <el-input + clearable + size="small" + v-model="carForm.passCarMissRate" + placeholder="宸ュ崟闃堝��" + /> + <el-input + clearable + size="small" + v-model="carForm.passCarMissRateAuto" + placeholder="涓嬪彂闃堝��" + /> </el-form-item> - <el-form-item class="fixedWidth" label="鏈夋晥杩囪溅鏁版嵁閲�" prop="passCarEffectiveNum"> - <el-input clearable size="small" v-model="carForm.passCarEffectiveNum" placeholder="宸ュ崟闃堝��"/> - <el-input clearable size="small" v-model="carForm.passCarEffectiveNumAuto" placeholder="涓嬪彂闃堝��"/> + <el-form-item + class="fixedWidth" + label="鏈夋晥杩囪溅鏁版嵁閲�" + prop="passCarEffectiveNum" + > + <el-input + clearable + size="small" + v-model="carForm.passCarEffectiveNum" + placeholder="宸ュ崟闃堝��" + /> + <el-input + clearable + size="small" + v-model="carForm.passCarEffectiveNumAuto" + placeholder="涓嬪彂闃堝��" + /> </el-form-item> - <el-form-item class="fixedWidth" label="璁惧娲昏穬鐜�" prop="deviceActiveRate"> - <el-input clearable size="small" v-model="carForm.deviceActiveRate" placeholder="宸ュ崟闃堝��"/> - <el-input clearable size="small" v-model="carForm.deviceActiveRateAuto" placeholder="涓嬪彂闃堝��"/> + <el-form-item + class="fixedWidth" + label="璁惧娲昏穬鐜�" + prop="deviceActiveRate" + > + <el-input + clearable + size="small" + v-model="carForm.deviceActiveRate" + placeholder="宸ュ崟闃堝��" + /> + <el-input + clearable + size="small" + v-model="carForm.deviceActiveRateAuto" + placeholder="涓嬪彂闃堝��" + /> </el-form-item> - <el-form-item class="fixedWidth" label="鎶撴媿鍙婃椂鐜�" prop="timelyCapture"> - <el-input clearable size="small" v-model="carForm.timelyCapture" placeholder="宸ュ崟闃堝��"/> - <el-input clearable size="small" v-model="carForm.timelyCaptureAuto" placeholder="涓嬪彂闃堝��"/> + <el-form-item + class="fixedWidth" + label="鎶撴媿鍙婃椂鐜�" + prop="timelyCapture" + > + <el-input + clearable + size="small" + v-model="carForm.timelyCapture" + placeholder="宸ュ崟闃堝��" + /> + <el-input + clearable + size="small" + v-model="carForm.timelyCaptureAuto" + placeholder="涓嬪彂闃堝��" + /> </el-form-item> <el-form-item class="fixedWidth" label="鏃堕挓鍑嗙‘鐜�" prop="timeAccuracy"> - <el-input clearable size="small" v-model="carForm.timeAccuracy" placeholder="宸ュ崟闃堝��"/> - <el-input clearable size="small" v-model="carForm.timeAccuracyAuto" placeholder="涓嬪彂闃堝��"/> + <el-input + clearable + size="small" + v-model="carForm.timeAccuracy" + placeholder="宸ュ崟闃堝��" + /> + <el-input + clearable + size="small" + v-model="carForm.timeAccuracyAuto" + placeholder="涓嬪彂闃堝��" + /> </el-form-item> </el-form> <div slot="footer" class="dialog-footer"> @@ -262,27 +882,94 @@ </el-dialog> <!-- 瑙嗛闃堝�� --> - <el-dialog title="淇敼瑙嗛宸ュ崟闃堝��" :visible.sync="videoOpen" width="700px" append-to-body> - <el-form ref="videoForm" :model="videoForm" label-width="100px" :inline="true"> - <el-form-item class="fixedWidth" label="鍥惧儚璐ㄩ噺" prop="imageQuality" label-width="100px"> - <el-select v-model="videoForm.imageQuality" placeholder="宸ュ崟闃堝��" @change="handleModeNameChange"> - <el-option :key="dict.value" :label="dict.value" v-for="dict in dict.type.image_qualify"/> + <el-dialog + title="淇敼瑙嗛宸ュ崟闃堝��" + :visible.sync="videoOpen" + width="700px" + append-to-body + > + <el-form + ref="videoForm" + :model="videoForm" + label-width="100px" + :inline="true" + > + <el-form-item + class="fixedWidth" + label="鍥惧儚璐ㄩ噺" + prop="imageQuality" + label-width="100px" + > + <el-select + v-model="videoForm.imageQuality" + placeholder="宸ュ崟闃堝��" + @change="handleModeNameChange" + > + <el-option + :key="dict.value" + :label="dict.value" + v-for="dict in dict.type.image_qualify" + /> </el-select> - <el-select v-model="videoForm.imageQualityAuto" placeholder="涓嬪彂闃堝��" @change="handleModeNameChange"> - <el-option :key="dict.value" :label="dict.value" v-for="dict in dict.type.image_qualify"/> + <el-select + v-model="videoForm.imageQualityAuto" + placeholder="涓嬪彂闃堝��" + @change="handleModeNameChange" + > + <el-option + :key="dict.value" + :label="dict.value" + v-for="dict in dict.type.image_qualify" + /> </el-select> </el-form-item> - <el-form-item class="fixedWidth" label="瑙嗛璐ㄩ噺" prop="videoQuality" label-width="100px"> - <el-select v-model="videoForm.videoQuality" placeholder="宸ュ崟闃堝��" @change="handleModeNameChange"> - <el-option :key="dict.value" :label="dict.value" v-for="dict in dict.type.video_qualify"/> + <el-form-item + class="fixedWidth" + label="瑙嗛璐ㄩ噺" + prop="videoQuality" + label-width="100px" + > + <el-select + v-model="videoForm.videoQuality" + placeholder="宸ュ崟闃堝��" + @change="handleModeNameChange" + > + <el-option + :key="dict.value" + :label="dict.value" + v-for="dict in dict.type.video_qualify" + /> </el-select> - <el-select v-model="videoForm.videoQualityAuto" placeholder="涓嬪彂闃堝��" @change="handleModeNameChange"> - <el-option :key="dict.value" :label="dict.value" v-for="dict in dict.type.video_qualify"/> + <el-select + v-model="videoForm.videoQualityAuto" + placeholder="涓嬪彂闃堝��" + @change="handleModeNameChange" + > + <el-option + :key="dict.value" + :label="dict.value" + v-for="dict in dict.type.video_qualify" + /> </el-select> </el-form-item> - <el-form-item class="fixedWidth" label="鏍囨敞鍑嗙‘鐜�" prop="annotationAccuracy" label-width="100px"> - <el-input v-model="videoForm.annotationAccuracy" type="number" size="small" placeholder="宸ュ崟闃堝��"></el-input> - <el-input v-model="videoForm.annotationAccuracy" type="number" size="small" placeholder="涓嬪彂闃堝��"></el-input> + <el-form-item + class="fixedWidth" + label="鏍囨敞鍑嗙‘鐜�" + prop="annotationAccuracy" + label-width="100px" + > + <el-input + v-model="videoForm.annotationAccuracy" + type="number" + size="small" + placeholder="宸ュ崟闃堝��" + ></el-input> + <el-input + v-model="videoForm.annotationAccuracy" + type="number" + size="small" + placeholder="涓嬪彂闃堝��" + ></el-input> </el-form-item> </el-form> <div slot="footer" class="dialog-footer"> @@ -290,19 +977,29 @@ <el-button @click="cancelVideo">鍙� 娑�</el-button> </div> </el-dialog> - </div> </template> <script> -import { listThreshold, getThreshold, editVideo } from '@/api/platform/threshold' -import { editCar, editFace, getCar, getFace, getVideo } from '../../../../api/platform/threshold' +import { + listThreshold, + getThreshold, + editVideo, +} from "@/api/platform/threshold"; +import { + editCar, + editFace, + getCar, + getFace, + getVideo, +} from "../../../../api/platform/threshold"; export default { - dicts: ['image_qualify', 'video_qualify'], - name: 'Threshold', + dicts: ["image_qualify", "video_qualify"], + name: "Threshold", data() { return { + ifEdit: false, indicators: [], // 閬僵灞� loading: true, @@ -318,8 +1015,10 @@ total: 0, // 杩愮淮闃堝�艰〃鏍兼暟鎹� thresholdList: [], + videoList: [], + faceList: [], // 寮瑰嚭灞傛爣棰� - title: '', + title: "", // 鏄惁鏄剧ず寮瑰嚭灞� videoOpen: false, faceOpen: false, @@ -328,7 +1027,7 @@ queryParams: { pageNum: 1, pageSize: 10, - monitorType: null + monitorType: null, }, // 琛ㄥ崟鍙傛暟 videoForm: {}, @@ -337,141 +1036,149 @@ // 琛ㄥ崟鏍¢獙 faceRules: { monitorType: [ - { required: true, message: '璁惧绫诲瀷涓嶈兘涓虹┖', trigger: 'change' } + { required: true, message: "璁惧绫诲瀷涓嶈兘涓虹┖", trigger: "change" }, ], captureNum: [ - { required: true, message: '璇峰~鍐欐姄鎷嶉噺', trigger: 'blur' } + { required: true, message: "璇峰~鍐欐姄鎷嶉噺", trigger: "blur" }, ], timelyRate: [ - { required: true, message: '璇峰~鍐欏強鏃剁巼', trigger: 'blur' } + { required: true, message: "璇峰~鍐欏強鏃剁巼", trigger: "blur" }, ], delayAmount: [ - { required: true, message: '璇峰~鍐欏欢杩熼噺', trigger: 'blur' } + { required: true, message: "璇峰~鍐欏欢杩熼噺", trigger: "blur" }, ], deviceActiveRate: [ - { required: true, message: '璇峰~鍐欒澶囨椿璺冪巼', trigger: 'blur' } + { required: true, message: "璇峰~鍐欒澶囨椿璺冪巼", trigger: "blur" }, ], timeAccuracy: [ - { required: true, message: '璇峰~鍐欐椂閽熷噯纭巼', trigger: 'blur' } + { required: true, message: "璇峰~鍐欐椂閽熷噯纭巼", trigger: "blur" }, ], timelyCapture: [ - { required: true, message: '璇峰~鍐欐姄鎷嶅強鏃剁巼', trigger: 'blur' } + { required: true, message: "璇峰~鍐欐姄鎷嶅強鏃剁巼", trigger: "blur" }, ], }, carRules: { monitorType: [ - { required: true, message: '璁惧绫诲瀷涓嶈兘涓虹┖', trigger: 'change' } + { required: true, message: "璁惧绫诲瀷涓嶈兘涓虹┖", trigger: "change" }, ], passCarNum: [ - { required: true, message: '璇峰~鍐欒繃杞︽暟鎹噺', trigger: 'blur' } + { required: true, message: "璇峰~鍐欒繃杞︽暟鎹噺", trigger: "blur" }, ], passCarMissRate: [ - { required: true, message: '璇峰~鍐欒繃杞︾己澶辩巼', trigger: 'blur' } + { required: true, message: "璇峰~鍐欒繃杞︾己澶辩巼", trigger: "blur" }, ], passCarEffectiveNum: [ - { required: true, message: '璇峰~鍐欐湁鏁堣繃杞︽暟鎹噺', trigger: 'blur' } + { required: true, message: "璇峰~鍐欐湁鏁堣繃杞︽暟鎹噺", trigger: "blur" }, ], timelyCapture: [ - { required: true, message: '璇峰~鍐欐姄鎷嶅強鏃剁巼', trigger: 'blur' } + { required: true, message: "璇峰~鍐欐姄鎷嶅強鏃剁巼", trigger: "blur" }, ], deviceActiveRate: [ - { required: true, message: '璇峰~鍐欒澶囨椿璺冪巼', trigger: 'blur' } + { required: true, message: "璇峰~鍐欒澶囨椿璺冪巼", trigger: "blur" }, ], timeAccuracy: [ - { required: true, message: '璇峰~鍐欐椂閽熷噯纭巼', trigger: 'blur' } + { required: true, message: "璇峰~鍐欐椂閽熷噯纭巼", trigger: "blur" }, ], }, rules: { monitorType: [ - { required: true, message: '璁惧绫诲瀷锛�1浜鸿劯 2杞﹁締 3瑙嗛涓嶈兘涓虹┖', trigger: 'change' } + { + required: true, + message: "璁惧绫诲瀷锛�1浜鸿劯 2杞﹁締 3瑙嗛涓嶈兘涓虹┖", + trigger: "change", + }, ], videoQuality: [ - { required: true, message: '璇烽�夋嫨瑙嗛璐ㄩ噺闃堝��', trigger: 'change' } + { required: true, message: "璇烽�夋嫨瑙嗛璐ㄩ噺闃堝��", trigger: "change" }, ], imageQuality: [ - { required: true, message: '璇烽�夋嫨鍥惧儚璐ㄩ噺闃堝��', trigger: 'change' } + { required: true, message: "璇烽�夋嫨鍥惧儚璐ㄩ噺闃堝��", trigger: "change" }, ], annotationAccuracy: [ - { required: true, message: '璇峰~鍐欐爣娉ㄥ噯纭巼闃堝��', trigger: 'blur' } + { required: true, message: "璇峰~鍐欐爣娉ㄥ噯纭巼闃堝��", trigger: "blur" }, ], - } - } + }, + }; }, created() { - this.getList() + this.getList(); }, methods: { + a() { + this.ifEdit = true; + console.log(this.ifEdit); + }, showContent(row) { - if(row.monitorType === "car") { - + if (row.monitorType === "car") { } }, editVideo() { // this.$refs['videoForm'].validate(validate => { // if (validate) { - editVideo(this.videoForm).then(res => { - if (res.code === 200) { - this.$message.success("淇敼鎴愬姛") - this.videoOpen = false - this.getList(); - } else { - this.$message.success("淇敼澶辫触") - } + editVideo(this.videoForm).then((res) => { + if (res.code === 200) { + this.$message.success("淇敼鎴愬姛"); + this.videoOpen = false; + this.getList(); + } else { + this.$message.success("淇敼澶辫触"); + } // }) // } - }) + }); }, editFace() { // this.$refs['faceForm'].validate(validate => { // if (validate) { - editFace(this.videoForm).then(res => { + editFace(this.videoForm).then((res) => { if (res.code === 200) { - this.$message.success("淇敼鎴愬姛") - this.faceOpen = false + this.$message.success("淇敼鎴愬姛"); + this.faceOpen = false; this.getList(); } else { - this.$message.success("淇敼澶辫触") + this.$message.success("淇敼澶辫触"); } // }) // } - }) + }); }, editCar() { // this.$refs['carForm'].validate(validate => { // if (validate) { - editCar(this.carForm).then(res => { + editCar(this.carForm).then((res) => { if (res.code === 200) { - this.$message.success("淇敼鎴愬姛") - this.carOpen = false + this.$message.success("淇敼鎴愬姛"); + this.carOpen = false; this.getList(); } else { - this.$message.success("淇敼澶辫触") + this.$message.success("淇敼澶辫触"); } // }) // } - }) + }); }, /** 鏌ヨ杩愮淮闃堝�煎垪琛� */ getList() { - this.loading = true - listThreshold(this.queryParams).then(response => { - this.thresholdList = response.rows - this.total = response.total - this.loading = false - }) + this.loading = true; + listThreshold(this.queryParams).then((response) => { + this.thresholdList = response.rows; + this.videoList = thresholdList[0]; + this.total = response.total; + this.loading = false; + }); }, // 鍙栨秷鎸夐挳 cancelFace() { - this.faceOpen = false - this.resetFace() + this.faceOpen = false; + this.resetFace(); }, cancelCar() { - this.carOpen = false - this.resetCar() + this.carOpen = false; + this.resetCar(); }, cancelVideo() { - this.videoOpen = false - this.resetVideo() + this.videoOpen = false; + this.resetVideo(); }, // 琛ㄥ崟閲嶇疆 reset() { @@ -482,9 +1189,9 @@ indicator: null, createTime: null, updateTime: null, - deleted: null - } - this.resetForm('form') + deleted: null, + }; + this.resetForm("form"); }, resetVideo() { this.videoForm = { @@ -496,8 +1203,8 @@ videoQualityAuto: "", annotationAccuracy: null, annotationAccuracyAuto: null, - } - this.resetForm('videoForm') + }; + this.resetForm("videoForm"); }, resetFace() { this.faceForm = { @@ -509,8 +1216,8 @@ videoQualityAuto: "", annotationAccuracy: null, annotationAccuracyAuto: null, - } - this.resetForm('faceForm') + }; + this.resetForm("faceForm"); }, resetCar() { this.carForm = { @@ -522,195 +1229,198 @@ videoQualityAuto: "", annotationAccuracy: null, annotationAccuracyAuto: null, - } - this.resetForm('carForm') + }; + this.resetForm("carForm"); }, /** 鎼滅储鎸夐挳鎿嶄綔 */ handleQuery() { - this.queryParams.pageNum = 1 - this.getList() + this.queryParams.pageNum = 1; + this.getList(); }, /** 閲嶇疆鎸夐挳鎿嶄綔 */ resetQuery() { - this.resetForm('queryForm') - this.handleQuery() + this.resetForm("queryForm"); + this.handleQuery(); }, // 澶氶�夋閫変腑鏁版嵁 handleSelectionChange(selection) { - this.ids = selection.map(item => item.id) - this.single = selection.length !== 1 - this.multiple = !selection.length + this.ids = selection.map((item) => item.id); + this.single = selection.length !== 1; + this.multiple = !selection.length; }, /** 鏂板鎸夐挳鎿嶄綔 */ handleAdd() { - this.reset() - this.open = true - this.title = '娣诲姞杩愮淮闃堝��' - this.handleModeNameChange() + this.reset(); + this.open = true; + this.title = "娣诲姞杩愮淮闃堝��"; + this.handleModeNameChange(); }, /** 淇敼鎸夐挳鎿嶄綔 */ updateWho(row) { - if (row.monitorType === 'face') { - getFace(row.id).then(response => { - this.faceForm = response.data + if (row.monitorType === "face") { + getFace(row.id).then((response) => { + this.faceForm = response.data; this.faceOpen = true; - }) - } else if (row.monitorType === 'car') { - getCar(row.id).then(response => { - this.carForm = response.data + }); + } else if (row.monitorType === "car") { + getCar(row.id).then((response) => { + this.carForm = response.data; this.carOpen = true; - }) + }); } else { - getVideo(row.id).then(response => { - this.videoForm = response.data + getVideo(row.id).then((response) => { + this.videoForm = response.data; this.videoOpen = true; - }) + }); } }, handleUpdate(row) { - this.reset() - const id = row.id || this.ids - getThreshold(id).then(response => { - this.form = response.data - this.indicators = JSON.parse(this.form.indicator) - this.videoOpen = true - this.title = '淇敼杩愮淮闃堝��' - }) + this.reset(); + const id = row.id || this.ids; + getThreshold(id).then((response) => { + this.form = response.data; + this.indicators = JSON.parse(this.form.indicator); + this.videoOpen = true; + this.title = "淇敼杩愮淮闃堝��"; + }); }, /** 鎻愪氦鎸夐挳 */ submitForm() { - this.$refs['form'].validate(valid => { + this.$refs["form"].validate((valid) => { if (valid) { // 灏唅ndicators杞负json璧嬪�煎埌form - this.form.indicator = JSON.stringify(this.indicators) + this.form.indicator = JSON.stringify(this.indicators); if (this.form.id != null) { - updateThreshold(this.form).then(response => { - this.$modal.msgSuccess('淇敼鎴愬姛') - this.open = false - this.getList() - }) + updateThreshold(this.form).then((response) => { + this.$modal.msgSuccess("淇敼鎴愬姛"); + this.open = false; + this.getList(); + }); } else { - addThreshold(this.form).then(response => { - this.$modal.msgSuccess('鏂板鎴愬姛') - this.open = false - this.getList() - }) + addThreshold(this.form).then((response) => { + this.$modal.msgSuccess("鏂板鎴愬姛"); + this.open = false; + this.getList(); + }); } } - }) + }); }, /** 鍒犻櫎鎸夐挳鎿嶄綔 */ handleDelete(row) { - const ids = row.id || this.ids - this.$modal.confirm('鏄惁纭鍒犻櫎杩愮淮闃堝�肩紪鍙蜂负"' + ids + '"鐨勬暟鎹」锛�').then(function() { - return delThreshold(ids) - }).then(() => { - this.getList() - this.$modal.msgSuccess('鍒犻櫎鎴愬姛') - }).catch(() => { - }) + const ids = row.id || this.ids; + this.$modal + .confirm('鏄惁纭鍒犻櫎杩愮淮闃堝�肩紪鍙蜂负"' + ids + '"鐨勬暟鎹」锛�') + .then(function () { + return delThreshold(ids); + }) + .then(() => { + this.getList(); + this.$modal.msgSuccess("鍒犻櫎鎴愬姛"); + }) + .catch(() => {}); }, /** 鍒囨崲涓嶅悓鎸囨爣 */ handleModeNameChange() { - if (this.form.monitorType === '1' || this.form.monitorType === null) { + if (this.form.monitorType === "1" || this.form.monitorType === null) { this.indicators = [ { - label: '鎶撴媿閲�', - value: null + label: "鎶撴媿閲�", + value: null, }, { - label: '鍙婃椂鐜�', - value: null + label: "鍙婃椂鐜�", + value: null, }, { - label: '寤惰繜閲�', - value: null + label: "寤惰繜閲�", + value: null, }, { - label: '鎶芥閲�', - value: null + label: "鎶芥閲�", + value: null, }, { - label: '璁惧娲昏穬鐜�', - value: null + label: "璁惧娲昏穬鐜�", + value: null, }, { - label: '鎶撴媿鍙婃椂鐜�', - value: null + label: "鎶撴媿鍙婃椂鐜�", + value: null, }, { - label: '鏃堕挓鍑嗙‘鐜�', - value: null + label: "鏃堕挓鍑嗙‘鐜�", + value: null, }, { - label: '鏃堕挓涓嶅噯纭巼', - value: null - } - ] - } else if (this.form.monitorType === 'car') { + label: "鏃堕挓涓嶅噯纭巼", + value: null, + }, + ]; + } else if (this.form.monitorType === "car") { this.indicators = [ { - label: '杩囪溅鏁版嵁閲�', - value: null + label: "杩囪溅鏁版嵁閲�", + value: null, }, { - label: '杩囪溅缂哄け鐜�', - value: null + label: "杩囪溅缂哄け鐜�", + value: null, }, { - label: '鏈夋晥杩囪溅鏁版嵁閲�', - value: null + label: "鏈夋晥杩囪溅鏁版嵁閲�", + value: null, }, { - label: '鎶芥閲�', - value: null + label: "鎶芥閲�", + value: null, }, { - label: '璁惧娲昏穬鐜�', - value: null + label: "璁惧娲昏穬鐜�", + value: null, }, { - label: '鎶撴媿鍙婃椂鐜�', - value: null + label: "鎶撴媿鍙婃椂鐜�", + value: null, }, { - label: '鏃堕挓鍑嗙‘鐜�', - value: null + label: "鏃堕挓鍑嗙‘鐜�", + value: null, }, { - label: '鏃堕挓涓嶅噯纭巼', - value: null - } - ] - } else if (this.form.monitorType === 'video') { + label: "鏃堕挓涓嶅噯纭巼", + value: null, + }, + ]; + } else if (this.form.monitorType === "video") { this.indicators = [ { - label: '褰曞儚璐ㄩ噺', - value: null + label: "褰曞儚璐ㄩ噺", + value: null, }, { - label: '鏍囨敞鍑嗙‘鐜�', - value: null + label: "鏍囨敞鍑嗙‘鐜�", + value: null, }, { - label: '鍥惧儚璐ㄩ噺', - value: null + label: "鍥惧儚璐ㄩ噺", + value: null, }, - ] + ]; } - } - } -} + }, + }, +}; </script> -<style> -.el-input-half-width { +<style scoped> +::v-deep .el-input-half-width { width: calc(50% - 6px); /* 鍑忓幓涓�浜涢棿闅� */ } -.table-row { +::v-deep .table-row { display: flex; flex-direction: row; } -.table-row-item { +::v-deep .table-row-item { width: 120px; text-align: center; } @@ -721,4 +1431,11 @@ display: flex; flex-direction: row; } + +.header鈥攖ext { + font-weight: bold; +} +::v-deep .el-form-item { + margin-bottom: 0px; /* 鏍规嵁闇�姹傝皟鏁磋繖涓�� */ +} </style> -- Gitblit v1.8.0