admingit/MicroCommunityWeb
1
0
Fork 0
mirror of https://gitee.com/java110/MicroCommunityWeb.git synced 2026-02-24 05:46:03 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

优化巡检详情中显示图片 以及预览

Browse Source
This commit is contained in:
wuxw 2020-05-05 09:10:58 +08:00
parent 849db9c883
commit cc2f49cd2f
4 changed files with 47 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
public/components/common/viewImage/viewImage.html Normal file
View File

@ -0,0 +1,3 @@
<div v-if="viewImageInfo.showImage" style="position:fixed;z-index:3000;left:50%;top:50%;transform:translate(-50%,-50%);">
<img v-on:click="_closeImage()" v-bind:src="viewImageInfo.url" style="width:1000px;height:500px;" />
</div>

26
public/components/common/viewImage/viewImage.js Normal file
View File

@ -0,0 +1,26 @@
(function (vc) {
vc.extends({
data: {
viewImageInfo: {
url: '',
showImage:false
}
},
_initMethod: function () {
},
_initEvent: function () {
vc.on('viewImage', 'showImage', function (_param) {
$that.viewImageInfo.url = _param.url;
$that.viewImageInfo.showImage = true;
});
},
methods: {
_closeImage:function(){
$that.viewImageInfo.showImage = false;
}
}
});
})(window.vc);

14
public/components/property/inspectionTaskDetail/inspectionTaskDetail.html
View File

@ -21,7 +21,9 @@
<th class="text-center">巡检点ID</th>
<th class="text-center">巡检点名称</th>
<th class="text-center">巡检状态</th>
<th class="text-center">巡检照片</th>
<th class="text-center">巡检情况</th>
<th class="text-center">巡检说明</th>
<th class="text-right">巡检照片</th>
</tr>
</thead>
<tbody>
@ -30,7 +32,13 @@
<td class="text-center">{{taskDetail.inspectionId}}</td>
<td class="text-center">{{taskDetail.inspectionName}}</td>
<td class="text-center">{{taskDetail.stateName}}</td>
<td class="text-center">{{taskDetail.photo}}</td>
<td class="text-center">{{taskDetail.patrolTypeName}}</td>
<td class="text-center">{{taskDetail.description}}</td>
<td class="text-right ">
<span v-for="_photo in taskDetail.photos">
<img style="width: 60px; height: 60px;" v-bind:src="_photo.url" v-on:click="openFile(_photo)"></img>
</span>
</td>
</tr>
</tbody>
</table>
@ -44,4 +52,6 @@
</div>
</div>
</div>
<vc:create path="common/viewImage"></vc:create>
</div>

7
public/components/property/inspectionTaskDetail/inspectionTaskDetail.js
View File

@ -51,7 +51,12 @@
taskDetails: [],
taskId: '',
};
}
},
openFile:function(_photo){
vc.emit('viewImage','showImage',{
url:_photo.url
});
}
}
});