|
|
@@ -0,0 +1,222 @@
|
|
|
+<!-- 拍照检查 -->
|
|
|
+<template>
|
|
|
+ <view id="photoInspectionInfo">
|
|
|
+ <view class="header">
|
|
|
+ <view class="header-t">
|
|
|
+ <img class="header-t-l" src="@/pages/images/icon_01.png" />
|
|
|
+ <view class="header-t-c">刘瑶瑶 13233556655</view>
|
|
|
+ <view class="header-t-r">实验中</view>
|
|
|
+ </view>
|
|
|
+ <img class="header-line" src="@/pages/images/for_min_bg.png" />
|
|
|
+ <view class="header-b">
|
|
|
+ <view class="header-li">签到时间：2024-03-15 13:00</view>
|
|
|
+ <view class="header-li">离开时间：-</view>
|
|
|
+ <view class="header-li">停留时间：-</view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="small-title">检查项</view>
|
|
|
+ <view class="main-li" v-if="pageType==1">
|
|
|
+ <img class="main-li-t" src="@/pages/images/img_bg_cjcx.png" />
|
|
|
+ <view class="main-li-b">实验室照片</view>
|
|
|
+ </view>
|
|
|
+ <view class="photo-b" v-if="pageType==2">
|
|
|
+ <view v-for="(item,index) in photoList" :key="index" @click="photoClick(item)" class="list-li"
|
|
|
+ :class="!item.type?'color-A':'color-B'">
|
|
|
+ <view>{{item.name}}</view>
|
|
|
+ <img v-if="item.type" :src="item.icon">
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ config
|
|
|
+ } from '@/api/request/config.js'
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ pageType: 1,
|
|
|
+ baseUrl: config.base_url,
|
|
|
+ newData: {
|
|
|
+
|
|
|
+ },
|
|
|
+ photoList: [{
|
|
|
+ type: false,
|
|
|
+ name: '实验室照片',
|
|
|
+ icon: require('@/pages_basics/images/icon_pzjc_xz.png')
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: false,
|
|
|
+ name: '垃圾桶清理后照片',
|
|
|
+ icon: require('@/pages_basics/images/icon_pzjc_xz.png')
|
|
|
+ },
|
|
|
+ ],
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(option) {
|
|
|
+
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ photoClick(item) {
|
|
|
+ item.type = !item.type;
|
|
|
+ },
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="stylus" scoped>
|
|
|
+ #photoInspectionInfo {
|
|
|
+ padding: 0 30rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+
|
|
|
+ .header {
|
|
|
+ .header-t {
|
|
|
+ height: 116rpx;
|
|
|
+ background: #fff;
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-start;
|
|
|
+ align-items: center;
|
|
|
+ border-radius: 10rpx 10rpx 0rpx 0rpx;
|
|
|
+
|
|
|
+ .header-t-l {
|
|
|
+ width: 70rpx;
|
|
|
+ height: 70rpx;
|
|
|
+ border-radius: 35rpx;
|
|
|
+ margin: 0 22rpx 0 30rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .header-t-c {
|
|
|
+ flex: 1;
|
|
|
+ font-family: Source Han Sans, Source Han Sans;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #333333;
|
|
|
+ line-height: 41rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .header-t-r {
|
|
|
+ font-family: Source Han Sans, Source Han Sans;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #0183FA;
|
|
|
+ line-height: 41rpx;
|
|
|
+ margin-right: 38rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .header-line {
|
|
|
+ width: 100%;
|
|
|
+ height: 30rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .header-b {
|
|
|
+ width: 100%;
|
|
|
+ height: 222rpx;
|
|
|
+ background: #fff;
|
|
|
+ padding: 20rpx 30rpx 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border-radius: 0rpx 0rpx 10rpx 10rpx;
|
|
|
+
|
|
|
+ .header-li {
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #333333;
|
|
|
+ line-height: 28rpx;
|
|
|
+ text-align: left;
|
|
|
+ }
|
|
|
+
|
|
|
+ .header-li:nth-of-type(1) {
|
|
|
+ margin-bottom: 42rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .header-li:nth-of-type(2) {
|
|
|
+ margin-bottom: 42rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .small-title {
|
|
|
+ font-family: PingFang SC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #333333;
|
|
|
+ line-height: 42rpx;
|
|
|
+ text-align: left;
|
|
|
+ margin: 30rpx 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .main-li {
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+
|
|
|
+ .main-li-t {
|
|
|
+ width: 690rpx;
|
|
|
+ height: 250rpx;
|
|
|
+ border-radius: 20rpx 20rpx 0rpx 0rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .main-li-b {
|
|
|
+ width: 690rpx;
|
|
|
+ height: 82rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 0rpx 0rpx 20rpx 20rpx;
|
|
|
+ border: 2rpx dashed #E0E0E0;
|
|
|
+ font-family: PingFang SC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #333333;
|
|
|
+ line-height: 82rpx;
|
|
|
+ text-align: left;
|
|
|
+ padding-left: 28rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .photo-b {
|
|
|
+ padding-bottom: 140rpx;
|
|
|
+
|
|
|
+ .list-li {
|
|
|
+ width: 690rpx;
|
|
|
+ height: 100rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 20rpx 20rpx 20rpx 20rpx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+
|
|
|
+ >view {
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #333333;
|
|
|
+ line-height: 100rpx;
|
|
|
+ text-align: left;
|
|
|
+ padding-left: 28rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ >img {
|
|
|
+ width: 60rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ margin-top: 44rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .color-A {
|
|
|
+ border: 2rpx dotted #E0E0E0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .color-B {
|
|
|
+ border: 2rpx dotted #0183FA;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
heyang
