From 78563aa7a2a3304e872fe35094e6925a64f5b4b2 Mon Sep 17 00:00:00 2001 From: wl <173@qq.com> Date: 星期二, 25 十月 2022 17:34:17 +0800 Subject: [PATCH] 案件图片展示 --- src/components/illdetail/index.vue | 195 ++++++++++++++++++++---------------------------- 1 files changed, 82 insertions(+), 113 deletions(-) diff --git a/src/components/illdetail/index.vue b/src/components/illdetail/index.vue index 1de98cc..700cca5 100644 --- a/src/components/illdetail/index.vue +++ b/src/components/illdetail/index.vue @@ -1,112 +1,71 @@ <template> <div class="view"> <div class="view-data"> - <div class="data-item"> - <div class="data-item__left"> - <label class="data-title"> - 闂绫诲瀷: - </label> - <span class="data-detail">杩濆缓</span> - </div> - <div class="data-item__right"> - <label class="data-title"> - 澶х被鍚嶇О: - </label> - <span class="data-detail">{{baseCase.category}}</span> - </div> - </div> - <div class="data-item"> - <div class="data-item__left"> - <label class="data-title"> - 灏忕被鍚嶇О: - </label> - <span class="data-detail">xxx</span> - </div> - <div class="data-item__right"> - <label class="data-title"> - 浜嬩欢绛夌骇: - </label> - <span class="data-detail">xxx</span> - </div> - </div> - <div class="data-item"> - <div class="data-item__left"> - <label class="data-title"> - 妗堢敱: - </label> - <span class="data-detail">xxx</span> - </div> - </div> - <div class="data-item"> - <div class="data-item__left"> - <label class="data-title"> - 鎵�灞炲尯鍘�: - </label> - <span class="data-detail">xxx</span> - </div> - <div class="data-item__right"> - <label class="data-title"> - 鎵�灞炵ぞ鍖�: - </label> - <span class="data-detail">xxx</span> - </div> - </div> - <div class="data-item"> - <div class="data-item__left"> - <label class="data-title"> - 鎵�灞炶閬�: - </label> - <span class="data-detail">{{baseCase.streetId}}</span> - </div> - </div> - <div class="data-item"> - <div class="data-item__left"> - <label class="data-title"> - 浜嬪彂鍦扮偣: - </label> - <span class="data-detail">{{baseCase.site}}</span> - </div> - </div> - <div class="data-item"> - <div class="data-item__left"> - <label class="data-title"> - 鍏宠仈鍟嗛摵鍚嶇О: - </label> - <span class="data-detail">xxx</span> - </div> - </div> - <div class="data-item"> - <div class="data-item__left"> - <label class="data-title"> - 闂鎻忚堪: - </label> - <span class="data-detail">xxx</span> - </div> - </div> - <div class="data-user"> + <el-form :model="baseCase" label-position="right" ref="viewForm" label-width="160px"> <div class="data-item"> - <div class="data-item__left"> - <label class="data-title"> - 鍙嶆槧浜�: - </label> - <span class="data-detail">{{baseCase.createUser}}</span> - </div> - <div class="data-item__right"> - <label class="data-title"> - 鑱旂郴鏂瑰紡: - </label> - <span class="data-detail">12345678901</span> - </div> + <el-form-item label="闂绫诲瀷:"> + <span class="data-detail">杩濆缓</span> + </el-form-item> + <el-form-item label="杩濆缓绫诲埆:"> + <span class="data-detail">{{baseCase.categoryText}}</span> + </el-form-item> </div> <div class="data-item"> - <div class="data-item__left"> - <label class="data-title"> - 韬唤璇佸彿: - </label> - <span class="data-detail">123456789987654321</span> - </div> + <el-form-item label="褰撲簨浜哄鍚�:"> + <span class="data-detail">{{baseCase.illegalBuilding.partyName}}</span> + </el-form-item> </div> - </div> + <div class="data-item"> + <el-form-item label="褰撲簨浜鸿韩浠借瘉鍙�:"> + <span class="data-detail">{{baseCase.illegalBuilding.partyIdCard}}</span> + </el-form-item> + </div> + <div class="data-item"> + <el-form-item label="褰撲簨浜鸿仈绯荤數璇�:"> + <span class="data-detail">{{baseCase.illegalBuilding.partyPhone}}</span> + </el-form-item> + </div> + <div class="data-item"> + <el-form-item label="杩濆缓鍦扮偣:"> + <span class="data-detail">{{baseCase.site}}</span> + </el-form-item> + <el-form-item label="鎵�灞炵ぞ鍖�:"> + <span class="data-detail">{{baseCase.communityText}}</span> + </el-form-item> + </div> + <div class="data-item"> + <el-form-item label="韬唤璇佹鍙嶉潰鐓х墖:"> + <img :src="baseCase.illegalBuilding.positive" alt=""> + </el-form-item> + <el-form-item label-width="0px"> + <img :src="baseCase.illegalBuilding.negative" alt=""> + </el-form-item> + </div> + <div class="data-item"> + <el-form-item label="鎵ф硶杩濆缓鎯呭喌"> + </el-form-item> + </div> + <div class="data-item"> + <el-form-item label="杩濆缓鍏蜂綋浣嶇疆:"> + <span class="data-detail">{{baseCase.illegalBuilding.position}}</span> + </el-form-item> + </div> + <div class="data-item"> + <el-form-item label="杩濇硶寤鸿闀裤�佸銆侀珮:"> + <span class="data-detail">{{baseCase.illegalBuilding.buildingLength+'m'+" "+baseCase.illegalBuilding.buildingWidth+'m'+" "+baseCase.illegalBuilding.buildingHigh+'m' }}</span> + </el-form-item> + </div> + <div class="data-item"> + <el-form-item label="杩濇硶寤鸿闈㈢Н:"> + <span class="data-detail">{{baseCase.illegalBuilding.buildingArea}}銕�</span> + </el-form-item> + </div> + <div class="data-item"> + <el-form-item label="杩濇硶寤虹瓚鏉愭枡:"> + <span class="data-detail">{{baseCase.illegalBuilding.materials}}</span> + </el-form-item> + </div> + </el-form> </div> <div class="view-process"> <div class="process-header"> @@ -118,10 +77,10 @@ </div> <div class="show-item"> <div class="show-wrap"> - <MyProcess v-if="activeIndex === 1" :handlePassVo="handlePassVo"></MyProcess> + <MyProcess v-if="activeIndex === 1" :handlePassVo="handlePassVo" :baseCase="baseCase"></MyProcess> <MyFilePicture v-else-if="activeIndex === 2" :filesPictureVo="filesPictureVo" ></MyFilePicture> - <MySovleProblem v-else-if="activeIndex === 3" :problemProVo="problemProVo"></MySovleProblem> - <MyScene v-else :currentSitVo="currentSitVo"></MyScene> + <MySovleProblem v-else-if="activeIndex === 3" :baseCase="baseCase" :handlePassVo="handlePassVo"></MySovleProblem> + <MyScene v-else :currentSitVo="currentSitVo" :baseCase="baseCase"></MyScene> </div> </div> </div> @@ -163,20 +122,18 @@ baseCase:{}, handlePassVo:{}, currentSitVo:{}, - problemProVo:{}, filesPictureVo:{} } - }, + }, created() { console.log('created'); const {info} = this; this.baseCase = info.baseCase; this.handlePassVo = info.handlePassVo; this.currentSitVo = info.currentSitVo; - this.problemProVo = info.problemProVo; this.filesPictureVo = info.filesPictureVo; - console.log(info); + console.log(info); }, methods: { changeComponent(index) { @@ -193,16 +150,28 @@ .view-data { color: #4b9bb7; - flex: 4; + // flex: 4; padding: 0 30px 0 20px; - + img{ + width: 100px; + height: 100px; + border-radius: 4px; + } .data-item { display: flex; - justify-content: space-between; - line-height: 40px; + // justify-content: space-between; + line-height: 20px; } border: 1px solid #17324c; + :deep(.el-form-item__label) { + color: #4b9bb7; + } + + :deep(.el-textarea__inner) { + background-color: #17324c; + color: #4b9bb7; + } } .view-process { -- Gitblit v1.8.0