date

liukangdong

2024-06-05 86f1c66a999c26536c66e97363e41674e6a7141c

date

 admin/src/api/business/approve.js

@@ -1,8 +1,18 @@
import request from '../../utils/request'


// åˆ›å»º
export function approveDo (data) {
  return request.post('/visitsAdmin/cloudService/business/approve/approved', data)
}

// ä»»åŠ¡ä¸­å¿ƒ åˆ—表 å¤´éƒ¨
export function taskCenterHead (data) {
  return request.get('/visitsAdmin/cloudService/business/staging/taskCenterHead', {
    params: {
      ...data
    }
  })
}
// ä»»åŠ¡ä¸­å¿ƒ åˆ—表
export function taskCenterPage (data) {
  return request.post('/visitsAdmin/cloudService/business/staging/taskPage', data)
}

 admin/src/api/business/index.js

@@ -1,4 +1,5 @@
import request from '../../utils/request'
export * from './approve'

// å®¡æ‰¹æ¨¡æ¿ä¿¡æ¯ å‘布
export function approveTemplSave (data) {

 admin/src/views/task/index.vue

@@ -7,38 +7,55 @@
      @clear="clear"
    />
    <!--  -->
    <el-tabs v-model="activeTab">
    <el-tabs v-model="filters.queryType">
      <el-tab-pane label="待处理" name="0">
        <template #label>
          <span
            >待处理
            <el-badge :value="11" class="item" type="danger"> </el-badge>
            <el-badge
              :value="headData.noticeWaitNum"
              class="item"
              type="danger"
            >
            </el-badge>
          </span>
        </template>
      </el-tab-pane>
      <el-tab-pane label="已处理" name="1"></el-tab-pane>
      <el-tab-pane label="我发起的" name="2"></el-tab-pane>
      <el-tab-pane label="抄送我的" name="3"></el-tab-pane>
      <el-tab-pane
        :value="headData.noticeDealNum"
        label="已处理"
        name="1"
      ></el-tab-pane>
      <el-tab-pane
        :value="headData.noticeCreateNum"
        label="我发起的"
        name="2"
      ></el-tab-pane>
      <el-tab-pane
        :value="headData.noticeCopyNum"
        label="抄送我的"
        name="3"
      ></el-tab-pane>
    </el-tabs>
    <el-table
      v-loading="loading"
      :data="list"
      :data="dataList"
      stripe
      row-key="id"
      default-expand-all
    >
      <el-table-column
        prop="name"
        label="任务类型"
        min-width="100"
      ></el-table-column>
      <el-table-column prop="name" label="任务类型" min-width="100">
        <template v-slot="scope">
          <span>{{ cateList[scope.row.objType].name }}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="name"
        label="提交人"
        min-width="80"
      ></el-table-column>
      <el-table-column
        prop="companyNamePath"
        prop="createDate"
        label="提交时间"
        min-width="100"
      ></el-table-column>
@@ -66,6 +83,10 @@
import Pagination from '@/components/common/Pagination'
import QueryForm from '@/components/common/QueryForm'
import TaskDetail from './taskDetail.vue'
import {
  taskCenterHead,
  taskCenterPage
} from '@/api'
export default {
  components: {
    TaskDetail,
@@ -75,18 +96,25 @@
  data () {
    return {
      isShowDetail: false,
      activeTab: '0',
      filters: {},
      filters: {
        queryType: 0
      },
      queryFormConfig: {
        formItems: [
          {
            filed: 'taskType',
            filed: 'type',
            type: 'select',
            label: '任务类型',
            options: []
            options: [
              { label: '访客申请', value: 0 },
              { label: '访客报备', value: 1 },
              { label: '用车申请', value: 2 },
              { label: '隐患随手拍', value: 3 },
              { label: '物流车申请', value: 4 }
            ]
          },
          {
            filed: 'status',
            filed: 'selDate',
            type: 'daterange',
            label: ''
          }
@@ -102,9 +130,22 @@
        capacity: 10,
        page: 1
      },
      list: [{}],
      total: 0
      dataList: [],
      headData: {},
      total: 0,

      cateList: [
        { name: '访客申请', id: 0 },
        { name: '访客报备', id: 1 },
        { name: '用车申请', id: 2 },
        { name: '隐患随手拍', id: 3 },
        { name: '物流车申请', id: 4 }
      ]
    }
  },
  created () {
    this.getHeadData()
    this.getList()
  },
  methods: {
    handleDetail () {
@@ -113,7 +154,33 @@
        this.$refs.DetailRef.isShowModal = true
      })
    },
    getList (page) { },
    getList (page) {
      const { filters, pagination } = this
      if (filters.selDate && filters.length > 0) {
        filters.startDate = filters.selDate[0]
        filters.endDate = filters.selDate[1]
      } else {
        filters.startDate = null
        filters.endDate = null
      }
      taskCenterPage({
        model: { ...filters },
        ...pagination
      }).then(res => {
        console.log('res', res)
        this.dataList = res.records || []
        this.dataList.forEach(i => {
          i.param1 = JSON.parse(i.param1)
        })
      })
    },
    getHeadData () {
      taskCenterHead({
        isDetail: '1'
      }).then(res => {
        this.headData = res
      })
    },
    clear () { },
    handleSizeChange (capacity) {
      this.pagination.capacity = capacity

 h5/api/staff.js

@@ -76,6 +76,13 @@
    data
  })
}
// éšæ‚£ è¯¦æƒ…
export const hiddenDangerDetail = (id) => {
  return http({
    url:  `visitsAdmin/cloudService/business/hiddenDanger/${id}`,
    method: 'get'
  })
}
// éšæ‚£ ç±»åž‹
export const DangerConfigType = (data) => {
  return http({
@@ -92,7 +99,22 @@
    data
  })
}

// éšæ‚£ å¤„理
export const dealHiddenDanger = (data) => {
  return http({
    url: 'visitsAdmin/cloudService/business/hiddenDanger/dealHiddenDanger',
    method: 'post',
    data
  })
}
// éšæ‚£ è½¬äº¤
export const transferHiddenDanger = (data) => {
  return http({
    url: 'visitsAdmin/cloudService/business/hiddenDanger/transferHiddenDanger',
    method: 'post',
    data
  })
}
// è½¦è¾† åˆ—表
export const getCarsList = (data) => {
  return http({
@@ -127,14 +149,6 @@
  })
}

// ä»»åŠ¡ä¸­å¿ƒ
export const taskCenter = (data) => {
  return http({
    url: 'visitsAdmin/cloudService/web/member/taskCenter',
    method: 'post',
    data
  })
}
// æŸ¥è¯¢è½¦è¾† æ´¾è½¦è®°å½•
export const carUseBookPaiche = (data) => {
  return http({
@@ -150,7 +164,7 @@
    method: 'get'
  })
}
// æŸ¥è¯¢è½¦è¾† æ´¾è½¦è®°å½• å®¡æ‰¹
//  å®¡æ‰¹
export const carUseBookAppr = (data) => {
  return http({
    url: 'visitsAdmin/cloudService/business/approve/approved',
@@ -173,4 +187,21 @@
    method: 'post',
    data
  })
}

//  ä»»åŠ¡ä¸­å¿ƒ å¤´éƒ¨æ•°æ®
export const stagingHead = (data) => {
  return http({
    url: 'visitsAdmin/cloudService/business/staging/taskCenterHead',
    method: 'get',
    data
  })
}
//  ä»»åŠ¡ä¸­å¿ƒ åˆ†é¡µæ•°æ®
export const stagingTaskPage = (data) => {
  return http({
    url: 'visitsAdmin/cloudService/business/staging/taskPage',
    method: 'post',
    data
  })
}

 h5/api/visitor.js

@@ -55,4 +55,11 @@
    method: 'get',
    data
  })
}
// è®¿å®¢æŠ¥å¤‡è¯¦æƒ…
export const getVisitedReDetail = (data) => {
  return http({
    url: 'visitsAdmin/cloudService/business/visits/'+data.id,
    method: 'get'
  })
}

 h5/pages.json

@@ -111,7 +111,6 @@
                "navigationStyle": "custom"

            }

        },

        // ä¼šè®®å®¤ 
        {

            "path": "pages/meeting/index/index",

            "style": {

@@ -176,7 +175,6 @@
                "navigationBarTitleText": "安泰物流",

                "enablePullDownRefresh": false

            }



        },

        {

            "path": "pages/staff/visitorReport",

@@ -184,235 +182,230 @@
                "navigationBarTitleText": "访客报备",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/staff/snapshot",

            "style": {

                "navigationBarTitleText": "隐患随手拍",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/staff/memberSel",

            "style": {

                "navigationBarTitleText": "选择人员",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/staff/meetingSub",

            "style": {

                "navigationBarTitleText": "预约会议室",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/staff/meetingSubOrder",

            "style": {

                "navigationBarTitleText": "确认预约",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/staff/vehicle/index",

            "style": {

                "navigationBarTitleText": "用车申请",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/staff/vehicle/shinei",

            "style": {

                "navigationBarTitleText": "用车申请",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/staff/vehicle/apply",

            "style": {

                "navigationBarTitleText": "用车申请",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/staff/vehicle/shiwai",

            "style": {

                "navigationBarTitleText": "用车申请",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/staff/task/index",

            "style": {

                "navigationBarTitleText": "任务中心",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/staff/task/visitorApprove",

            "style": {

                "navigationBarTitleText": "访客审批",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/staff/task/visitorReport",

            "style": {

                "navigationBarTitleText": "访客报备",

                "enablePullDownRefresh": false

            }

        },

        {

            "path": "pages/staff/task/vDangetAppr",

            "style": {

                "navigationBarTitleText": "隐患处理",

                "enablePullDownRefresh": false

            }

        },

        {

            "path": "pages/staff/vehicle/sendACar",

            "style": {

                "navigationBarTitleText": "派车记录",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/staff/meetingCalendar",

            "style": {

                "navigationBarTitleText": "会议日历",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/staff/meetingDetail",

            "style": {

                "navigationBarTitleText": "会议详情",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/staff/meetingManager",

            "style": {

                "navigationBarTitleText": "会议室管理",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/driver/index",

            "style": {

                "navigationBarTitleText": "物流车中心",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/driver/reserved",

            "style": {

                "navigationBarTitleText": "入园预约",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/driver/reservedGuide",

            "style": {

                "navigationBarTitleText": "预约指南",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/driver/reservedRecord",

            "style": {

                "navigationBarTitleText": "预约记录",

                "enablePullDownRefresh": false

            }



        }, {

        },

        {

            "path": "pages/driver/queueUp",

            "style": {

                "navigationBarTitleText": "排队情况",

                "enablePullDownRefresh": false

            }



        },

        {

            "path": "pages/driver/queueUpRecord",

            "style": {

                "navigationBarTitleText": "作业中车辆",

                "enablePullDownRefresh": false

            }

        },

        {

            "path": "pages/driver/taskDetail",

            "style": {

                "navigationBarTitleText": "任务详情",

                "enablePullDownRefresh": false

            }

        },

        {

            "path": "pages/driver/reservedDetail",

            "style": {

                "navigationBarTitleText": "访客审批",

                "enablePullDownRefresh": false

            }

        },

        {

            "path": "pages/driver/taskConfirm",

            "style": {

                "navigationBarTitleText": "确认任务",

                "enablePullDownRefresh": false

            }

        },

        {

            "path": "pages/auth/auth",

            "style": {

                "navigationBarTitleText": "微信授权",

                "enablePullDownRefresh": false

            }

        },

        {

            "path": "pages/staffLogin/forgetPsd",

            "style": {

                "navigationBarTitleText": "找回密码",

                "enablePullDownRefresh": false

            }

        },

        {

            "path": "pages/staff/snapshotResult",

            "style": {

                "navigationBarTitleText": "隐患随手拍",

                "enablePullDownRefresh": false

            }

        },

        {

            "path": "pages/staff/vehicle/applePeo",

            "style": {

                "navigationBarTitleText": "选择人员",

                "enablePullDownRefresh": false

            }

        },

        {

            "path": "pages/staff/vehicle/sendACarDetail",

            "style": {

                "navigationBarTitleText": "用车审批",

                "enablePullDownRefresh": false

            }

        },

        {

            "path": "pages/staff/meetingSel",

            "style": {

                "navigationBarTitleText": "选择人员",

                "enablePullDownRefresh": false

            }

        }

        ,{

            "path" : "pages/driver/queueUpRecord",

            "style" :                                                                                    
            {

                "navigationBarTitleText": "作业中车辆",

                "enablePullDownRefresh": false

            }

            
        }

        ,{

            "path" : "pages/driver/taskDetail",

            "style" :                                                                                    
            {

                "navigationBarTitleText": "任务详情",

                "enablePullDownRefresh": false

            }

            
        }

        ,{

            "path" : "pages/driver/reservedDetail",

            "style" :                                                                                    
            {

                "navigationBarTitleText": "访客审批",

                "enablePullDownRefresh": false

            }

            
        }

        ,{

            "path" : "pages/driver/taskConfirm",

            "style" :                                                                                    
            {

                "navigationBarTitleText": "确认任务",

                "enablePullDownRefresh": false

            }

            
        }

        ,{

            "path" : "pages/auth/auth",

            "style" :                                                                                    
            {

                "navigationBarTitleText": "微信授权",

                "enablePullDownRefresh": false

            }

            
        }

        ,{

            "path" : "pages/staffLogin/forgetPsd",

            "style" :                                                                                    
            {

                "navigationBarTitleText": "找回密码",

                "enablePullDownRefresh": false

            }

            
        }

        ,{

            "path" : "pages/staff/snapshotResult",

            "style" :                                                                                    
            {

                "navigationBarTitleText": "隐患随手拍",

                "enablePullDownRefresh": false

            }

            
        }

        ,{

            "path" : "pages/staff/vehicle/applePeo",

            "style" :                                                                                    
            {

                "navigationBarTitleText": "选择人员",

                "enablePullDownRefresh": false

            }

            
        }

        ,{

            "path" : "pages/staff/vehicle/sendACarDetail",

            "style" :                                                                                    
            {
                "navigationBarTitleText": "用车审批",
                "enablePullDownRefresh": false
            }
            
        }

        ,{

            "path" : "pages/staff/meetingSel",

            "style" :                                                                                    
            {
                "navigationBarTitleText": "选择人员",
                "enablePullDownRefresh": false
            }
            
        }

    ],

    "subPackages": [{

    ],

    "subPackages": [

        {

            "root": "n_pages",

            "pages": [{

            "pages": [

                {

                    "path": "login/login",

                    "style": {

                        "navigationBarTitleText": "登录",

@@ -457,7 +450,8 @@
        {

            "root": "packagesMine",

            "name": "mine",

            "pages": [{

            "pages": [

                {

                    "path": "notice/notice",

                    "style": {

                        "navigationBarTitleText": "通知",

@@ -509,4 +503,4 @@
        "backgroundColor": "#ffffff"

    },

    "uniIdRouter": {}

}

}

 h5/pages/staff/index.vue

@@ -48,7 +48,7 @@
                <image class="img" src="@/static/staff/ic_renwuzhongxin.png"></image>
                <view class="h1">任务中心</view>
                <view class="h2">TASK CENTER</view>
                <view class="task_num">99+</view>
                <view class="task_num">{{ taskNum }}</view>
            </view>
            <view class="img_wrap" @click="jump('/pages/staff/meetingCalendar')">
                <image class="img" src="@/static/staff/ic_wodehuiyi.png"></image>
@@ -74,15 +74,17 @@
</template>

<script>
import { logoutPost } from '@/api'
import { logoutPost, stagingHead } from '@/api'
export default {
    data() {
        return {
            userInfo: uni.getStorageSync('userInfo')
            userInfo: uni.getStorageSync('userInfo'),
            taskNum: 0
        };
    },
    onLoad(){
        console.log('userInfo', this.userInfo);
        this.getTaskInfo()
    },
    methods: {
        jump(path){
@@ -97,6 +99,13 @@
                url: '/pages/staffLogin/login'
            })
        },
        getTaskInfo() {
      stagingHead({
        isDetail: '0'
      }).then(res => {
        this.taskNum = res.data.taskNum
      })
    },
    }
};
</script>
@@ -210,11 +219,12 @@
        }
        .task_num{
            position: absolute;
            left: 164rpx;
            top: 20rpx;
            width: 60rpx;
            height: 48rpx;
            left: 168rpx;
            top: 26rpx;
            width: 52rpx;
            height: 52rpx;
            border-radius: 50%;
            /* border: 1px solid; */
            background-color: #fff;
            color: #db534c;
            display: flex;

 h5/pages/staff/task/index.vue

@@ -4,62 +4,128 @@
      <view class="box_head_search">
        <view class="box_head_search_ipt">
          <image src="@/static/n/ic_search@2x.png" mode="widthFix"></image>
          <input type="text" placeholder="搜索任务名称" />
          <input
            v-model="search.title"
            @blur="querylist"
            type="text"
            placeholder="搜索任务名称"
          />
        </view>
        <view class="box_head_search_sha" @click="show = true">
        <view class="box_head_search_sha" @click="showFilter = true">
          <image src="@/static/n/ic_shaixuan@2x.png" mode="widthFix"></image>
          <text>筛选</text>
        </view>
      </view>
      <view class="box_head_list">
        <view @click="statusClick()" class="box_head_item active">待处理</view>
        <view @click="statusClick()" class="box_head_item">已处理</view>
        <view @click="statusClick()" class="box_head_item">我发起的</view>
        <view @click="statusClick()" class="box_head_item">抄送我的</view>
        <view
          @click="statusClick(0)"
          :class="{ active: search.queryType === 0 }"
          class="box_head_item"
          >待处理 {{ headData.noticeWaitNum }}</view
        >
        <view
          @click="statusClick(1)"
          :class="{ active: search.queryType === 1 }"
          class="box_head_item"
          >已处理 {{ headData.noticeDealNum }}</view
        >
        <view
          @click="statusClick(2)"
          :class="{ active: search.queryType === 2 }"
          class="box_head_item"
          >我发起的 {{ headData.noticeCreateNum }}</view
        >
        <view
          @click="statusClick(3)"
          :class="{ active: search.queryType === 3 }"
          class="box_head_item"
          >抄送我的 {{ headData.noticeCopyNum }}</view
        >
      </view>
    </scroll-view>
    <view class="box_list">
      <view class="box_list_item" v-for="(item, index) in 3" :key="index">
      <view class="chaosong" v-if="search.queryType === 3">
        <view class="left">
          <image
            @click="readySearch(0)"
            v-if="search.noRead && search.noRead == 1"
            src="@/static/meeting/icon/ic_choose_sel@2x.png"
            class="checked"
          />
          <image
            @click="readySearch(1)"
            v-else
            src="@/static/meeting/icon/ic_choose@2x.png"
            class="checked"
          />
          <text>仅看未读</text>
        </view>
        <view class="right">全部标记已读</view>
      </view>
      <view
        class="box_list_item"
        v-for="(item, index) in dataList"
        :key="index"
      >
        <view class="box_list_item_head">
          <text>丁恩凯的劳务入厂申请</text>
          <text class="loading">待审核</text>
          <view class="df_ac">
            <text v-if="item.readed == 0" class="readed"></text>
            <text class="tt">{{ item.title }}</text>
          </view>
          <view class="info loading">{{ item.info }}</view>
        </view>
        <view class="box_list_item_nr">
          <view class="box_list_item_nr_item">
            <text>被访问人：</text>
            <text>人事部-王亚蓝</text>
          <view v-if="item.param1.name" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.name }}</text>
          </view>
          <view class="box_list_item_nr_item">
            <text>进厂时间：</text>
            <text>12-12 09:00</text>
          <view v-if="item.param1.area" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.area }}</text>
          </view>
          <view class="box_list_item_nr_item">
            <text>离厂时间：</text>
            <text>12-12 12:00</text>
          <view v-if="item.param1.cate" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.cate }}</text>
          </view>
          <view class="box_list_item_nr_item">
            <text>来访事由：</text>
            <text>业务来往</text>
          <view v-if="item.param1.sTime" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.sTime }}</text>
          </view>
          <view class="box_list_item_nr_item">
            <text>随行车辆：</text>
            <text>皖A88888</text>
          <view v-if="item.param1.eTime" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.eTime }}</text>
          </view>
          <view v-if="item.param1.usrNum" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.usrNum }}</text>
          </view>
          <view v-if="item.param1.reason" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.reason }}</text>
          </view>
          <view v-if="item.param1.carNos" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.carNos }}</text>
          </view>
          <view v-if="item.param1.mdd" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.mdd }}</text>
          </view>
          <view class="box_list_item_nr_x"></view>
          <view class="box_list_item_nr_text">
            <text class="time">2023-12-12 09:00提交</text>
            <text class="btn" @click="handleAppr()">去处理</text>
            <text class="time">{{ item.createDate }}提交</text>
            <text class="btn" @click="handleAppr(item)">去处理</text>
          </view>
        </view>
      </view>
    </view>
    <!-- ç­›é€‰ -->
    <u-popup
      :show="show"
      :show="showFilter"
      mode="bottom"
      :round="10"
      :closeable="true"
      @close="show = false"
      @close="showFilter = false"
    >
      <view class="search">
        <view class="search_head">任务筛选</view>
@@ -70,15 +136,19 @@
              <view
                class="search_list_item_val_row"
                @click="tiemShow = true"
                :style="{ color: search.startTime ? '#000' : '' }"
                >{{ search.startTime ? search.startTime : "开始日期" }}</view
                :style="{ color: modelParam.startDate ? '#000' : '' }"
                >{{
                  modelParam.startDate ? modelParam.startDate : "开始日期"
                }}</view
              >
              <view class="search_list_item_val_z">-</view>
              <view
                class="search_list_item_val_row"
                @click="tiemShow1 = true"
                :style="{ color: search.endTime ? '#000' : '' }"
                >{{ search.endTime ? search.endTime : "结束日期" }}</view
                :style="{ color: modelParam.endDate ? '#000' : '' }"
                >{{
                  modelParam.endDate ? modelParam.endDate : "结束日期"
                }}</view
              >
            </view>
          </view>
@@ -87,11 +157,11 @@
            <view class="search_list_item_cates">
              <view
                :class="
                  index === i
                  item.id === modelParam.type
                    ? 'search_list_item_cates_row active'
                    : 'search_list_item_cates_row'
                "
                v-for="(item, index) in cate"
                v-for="(item, index) in cateList"
                :key="index"
                @click="clickItem(index)"
              >
@@ -101,22 +171,24 @@
          </view>
        </view>
        <view class="search_footer">
          <view class="search_footer_item" @click="show = false">取消</view>
          <view class="search_footer_item t">提交</view>
          <view class="search_footer_item" @click="showFilter = false"
            >取消</view
          >
          <view class="search_footer_item t" @click="modalSub">提交</view>
        </view>
      </view>
    </u-popup>
    <u-datetime-picker
      :show="tiemShow"
      v-model="time"
      mode="datetime"
      v-model="modelParam.startDate"
      mode="date"
      @confirm="confirmLeft"
      @cancel="tiemShow = false"
    ></u-datetime-picker>
    <u-datetime-picker
      :show="tiemShow1"
      v-model="time1"
      mode="datetime"
      v-model="modelParam.endDate"
      mode="date"
      @confirm="confirmRight"
      @cancel="tiemShow1 = false"
    ></u-datetime-picker>
@@ -124,68 +196,136 @@
</template>

<script>
import { taskCenter } from '@/api'
import { stagingHead, stagingTaskPage } from '@/api'
import dayjs from 'dayjs'
export default {
  data() {
    return {
      show: false,
      showFilter: false,
      search: {
        queryType: 0
      },
      modelParam: {
        startDate: dayjs().format('YYYY-MM-DD'),
        endDate: dayjs().format('YYYY-MM-DD'),
      },
      tiemShow: false,
      tiemShow1: false,
      time: '',
      i: null,
      time: '',
      time1: '',
      search: {
        startTime: '',
        endTime: ''
      },

      pagination: {
        capacity: 10,
        page: 1
        capacity: 20,
        page: 0
      },
      headData: {},
      dataList: [],
      cate: [
        { name: '访客申请', id: 1 },
        { name: '劳务申请', id: 2 },
        { name: '用车申请', id: 3 }
      cateList: [
        { name: '访客申请', id: 0 },
        { name: '访客报备', id: 1 },
        { name: '用车申请', id: 2 },
        { name: '隐患随手拍', id: 3 },
        { name: '物流车申请', id: 4 },
      ]
    }
  },
  onLoad() {
    this.getHeadList()
    this.pagination.page = 0
    this.getList()
  },
  onReachBottom() {
    // this.pagination.page = 0
    // this.dataList = []
    this.getList()
  },
  onShow() {
    this.pagination.page = 0
    this.dataList = []
    this.getHeadList()
    this.getList()
  },
  methods: {
    statusClick(val) {
      this.pagination.page = 1
      this.pagination.page = 0
      this.dataList = []
      this.$set(this.search, 'queryType', val)
      this.getList()
    },
    readySearch(val) {
      this.pagination.page = 0
      this.dataList = []
      this.$set(this.search, 'noRead', val)
      this.getList()
    },
    modalSub() {
      this.search = { ...this.search, ...this.modelParam }
      this.pagination.page = 0
      this.dataList = []
      this.getList()
      this.showFilter = false
    },
    querylist() {
      this.pagination.page = 0
      this.dataList = []
      this.getList()
    },
    getList() {
      const { pagination, search } = this
      pagination.page++
      taskCenter({
      stagingTaskPage({
        ...pagination,
        model: {
          ...search
        }
      }).then(res => {
        this.dataList = [...this.dataList, ...res.data.records]
        this.dataList.forEach(i => {
          i.param1 = JSON.parse(i.param1)
        })
        console.log('dataList', this.dataList)
      })
    },
    getHeadList() {
      stagingHead({
        isDetail: '1'
      }).then(res => {
        this.headData = res.data
      })
    },
    handleAppr(item) {
      uni.navigateTo({
        url: '/pages/staff/task/visitorApprove'
      })
      const { objType, objId } = item
      if (objType === 2) {
        uni.navigateTo({
          url: `/pages/staff/vehicle/sendACarDetail?id=${objId}&appr=1`
        })
      } else if (objType === 1) {
        uni.navigateTo({
          url: `/pages/staff/task/visitorReport?id=${objId}&objType=${objType}`
        })
      } else if (objType === 3) {
        uni.navigateTo({
          url: `/pages/staff/task/vDangetAppr?id=${objId}&objType=${objType}`
        })
      } else {
        uni.navigateTo({
          url: `/pages/staff/task/visitorApprove?id=${objId}&objType=${objType}`
        })
      }
    },
    clickItem(index) {
      this.i = index
      this.$set(this.modelParam, 'type', this.cateList[index].id)
    },
    confirmLeft(e) {
      console.log(uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss'))
      this.search.startTime = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
      console.log(uni.$u.timeFormat(e.value, 'yyyy-mm-dd'))
      setTimeout(() => {
        this.modelParam.startDate = uni.$u.timeFormat(e.value, 'yyyy-mm-dd')
      })
      this.tiemShow = false
    },
    confirmRight(e) {
      this.search.endTime = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
      // this.modelParam.endDate = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
      setTimeout(() => {
        this.modelParam.endDate = uni.$u.timeFormat(e.value, 'yyyy-mm-dd')
      })
      this.tiemShow1 = false
    }
  }
@@ -286,6 +426,23 @@
    width: 100%;
    padding: 30rpx;
    box-sizing: border-box;
    .chaosong {
      display: flex;
      justify-content: space-between;
      align-items: center;
      color: #666666;
      font-size: 24rpx;
      margin-bottom: 20rpx;
      .left {
        display: flex;
        align-items: center;
        .checked {
          width: 32rpx;
          height: 32rpx;
          margin-right: 10rpx;
        }
      }
    }
    .box_list_item {
      width: 100%;
      margin-bottom: 20rpx;
@@ -302,6 +459,12 @@
        display: flex;
        align-items: center;
        justify-content: space-between;
        .readed {
          width: 12rpx;
          height: 12rpx;
          border-radius: 50%;
          background-color: #e0312a;
        }
        .loading {
          color: #4c99a8;
        }
@@ -311,16 +474,14 @@
        .error {
          color: #e0312a;
        }
        text {
          &:nth-child(1) {
            font-size: 32rpx;
            font-weight: 500;
            color: #222222;
          }
          &:nth-child(2) {
            font-size: 26rpx;
            font-weight: 400;
          }
        .tt {
          font-size: 32rpx;
          font-weight: 500;
          color: #222222;
        }
        .info {
          font-size: 26rpx;
          font-weight: 400;
        }
      }
      .box_list_item_nr {
@@ -421,6 +582,7 @@
            font-size: 26rpx;
            font-weight: 400;
            color: #333333;
            margin-bottom: 20rpx;
            &:last-child {
              margin: 0;
            }

 h5/pages/staff/task/vDangetAppr.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,1201 @@
<template>
  <view class="main_app">
    <view class="status_wrap">
      <view class="name">{{ info.name }}提交的{{ cateList[type].name }}</view>
      <view v-if="info.status == '0'" class="status">{{
        statusMap[info.status]
      }}</view>
      <image
        v-if="info.status == '2'"
        src="@/static/ic_passed@2x.png"
        mode="widthFix"
        class="status_img"
      ></image>
      <image
        v-if="info.status == '3' || info.status == '6'"
        src="@/static/ic_refused@2x.png"
        mode="widthFix"
        class="status_img"
      ></image>
      <view>{{ info.content }}</view>
      <view class="file_list">
        <template v-for="item in info.submitFileList">
          <image
            v-if="item.type == 0"
            :key="item.id"
            :src="item.fileurlFull"
            mode="widthFix"
            class="img"
          />
          <video
            v-if="item.type == 1"
            :key="item.id"
            :src="item.fileurlFull"
            class="img"
            controls
          />
        </template>
      </view>
      <view class="text_wrap">
        <view class="line">
          <text class="label">隐患区域：</text>
          <text>{{ info.areaName }}</text>
        </view>
        <view class="line">
          <text class="label">提报人：</text>
          <text>{{ info.memberName }} {{ info.memberPhone }}</text>
        </view>
      </view>
    </view>
    <!--  -->
    <view class="emyty"></view>
    <view v-if="info.status == 1" class="module_list">
      <view class="item">
        <view class="label">处理结果</view>
        <!-- <view class="value">{{ info. }}</view> -->
      </view>
      <view class="item">
        <view class="label">整改前</view>
        <view class="value">
          <view
            class="adduser_list_item_ipt1_upload"
            v-for="(item, i) in dealBeforeFileList"
            :key="i"
            ><image
              v-if="item.type == 0"
              :src="item.fileurlFull"
              mode="widthFix"
            ></image
            ><video v-if="item.type == 1" :src="item.fileurlFull"></video
          ></view>
        </view>
      </view>
      <view class="item">
        <view class="label">整改后</view>
        <view class="value">
          <view
            class="adduser_list_item_ipt1_upload"
            v-for="(item, i) in dealAfterFileList"
            :key="i"
            ><image
              v-if="item.type == 0"
              :src="item.fileurlFull"
              mode="widthFix"
            ></image
            ><video v-if="item.type == 1" :src="item.fileurlFull"></video
          ></view>
        </view>
      </view>
      <view class="item">
        <view class="label">整改说明</view>
        <view class="value">{{ info.checkInfo }}</view>
      </view>
    </view>
    <!-- æµç¨‹ -->
    <view class="flow_wrap">
      <view class="flow_title">处理流程</view>
      <view
        class="list"
        v-if="
          info.approveDateVO != null && info.approveDateVO.approveList != null
        "
      >
        <view
          class="item"
          v-for="(item, index) in info.approveDateVO.approveList"
          :key="item.id"
        >
          <view class="separate"></view>
          <view class="avatar">
            <image
              class="img"
              :src="
                item.faceImg
                  ? item.faceImg
                  : require('@/static/meeting/common/default_user@2x.png')
              "
            />
            <image
              class="status"
              src="@/static/staff/liucheng_success@2x.png"
              mode="widthFix"
            />
          </view>
          <view class="content">
            <view class="head">
              <view class="event">{{ item.title }}</view>
              <view class="time">{{ item.checkDate }}</view>
            </view>
            <view class="name_wrap">
              <text
                >{{ item.memberName
                }}<text class="status" v-if="item.statusInfo"
                  >({{ item.statusInfo }})</text
                ></text
              >
            </view>
            <view v-if="item.checkInfo" class="remark">{{
              item.checkInfo
            }}</view>
            <!-- æŠ„送人 -->
            <view v-if="item.approveType == 1" class="children">
              <view
                class="child"
                v-for="child in item.approveList"
                :key="child.id"
              >
                <image
                  class="child_img"
                  :src="
                    child.faceImg
                      ? child.faceImg
                      : require('@/static/meeting/common/default_user@2x.png')
                  "
                />
                <view>{{ child.memberName }}</view>
              </view>
            </view>
          </view>
        </view>
      </view>
    </view>
    <view class="emyty"></view>
    <view class="main_footer">
      <view class="btn" @click="isShowBack = true">退回</view>
      <view class="btn transfer" @click="handleTransfer">转交</view>
      <view class="btn handle" @click="isShowHandle = true">处理</view>
    </view>

    <u-popup
      :show="isShowBack"
      :round="10"
      :safeAreaInsetBottom="true"
      mode="bottom"
      @close="isShowBack = false"
    >
      <view class="appr_modal">
        <view class="title">隐患退回</view>
        <view class="df_sb">
          <view>退回时间</view>
          <view @click="isShowBackDate = true" v-if="backParam.dealTime">{{
            backParam.dealTime.slice(0, 16)
          }}</view>
          <view @click="isShowBackDate = true" v-else class="placeholder9"
            >请选择</view
          >
        </view>

        <view class="label">图片/视频</view>
        <view class="upload_wrap">
          <view class="adduser_list_item_ipt1_upload" @click="showUpload = true"
            ><u-icon name="plus" color="rgb(153, 153, 153)" size="28"></u-icon
          ></view>
          <view
            class="adduser_list_item_ipt1_upload"
            v-for="(item, i) in submitFileList"
            :key="i"
            ><image
              v-if="item.type == 0"
              :src="item.fileurlFull"
              mode="widthFix"
            ></image
            ><video v-if="item.type == 1" :src="item.fileurlFull"></video
          ></view>
        </view>
        <view class="label">退回说明</view>
        <textarea
          v-model="backParam.checkInfo"
          placeholder="请详细描述现场情况，不少于10个字"
          placeholder-class="placeholder9"
        />
        <view class="back_footer">
          <view class="btn" @click="isShowBack = false">取消</view>
          <view class="btn agree" @click="onSubBack">提交</view>
        </view>
      </view>
    </u-popup>
    <!-- å¤„理 -->
    <u-popup
      :show="isShowHandle"
      :round="10"
      :safeAreaInsetBottom="true"
      mode="bottom"
      @close="isShowBack = false"
    >
      <view class="appr_modal">
        <view class="title">隐患整改</view>
        <view class="df_sb">
          <view>整改时间</view>
          <view @click="isShowHandleDate = true" v-if="handleParam.dealTime">{{
            handleParam.dealTime.slice(0, 16)
          }}</view>
          <view @click="isShowHandleDate = true" v-else class="placeholder9"
            >请选择</view
          >
        </view>

        <view class="label"><text>*</text>整改前</view>
        <view class="upload_wrap">
          <view
            class="adduser_list_item_ipt1_upload"
            @click="showUploadBe = true"
            ><u-icon name="plus" color="rgb(153, 153, 153)" size="28"></u-icon
          ></view>
          <view
            class="adduser_list_item_ipt1_upload"
            v-for="(item, i) in dealBeforeFileList"
            :key="i"
            ><image
              v-if="item.type == 0"
              :src="item.fileurlFull"
              mode="widthFix"
            ></image
            ><video v-if="item.type == 1" :src="item.fileurlFull"></video
          ></view>
        </view>
        <view class="label"><text>*</text>整改后</view>
        <view class="upload_wrap">
          <view
            class="adduser_list_item_ipt1_upload"
            @click="showUploadAf = true"
            ><u-icon name="plus" color="rgb(153, 153, 153)" size="28"></u-icon
          ></view>
          <view
            class="adduser_list_item_ipt1_upload"
            v-for="(item, i) in dealAfterFileList"
            :key="i"
            ><image
              v-if="item.type == 0"
              :src="item.fileurlFull"
              mode="widthFix"
            ></image
            ><video v-if="item.type == 1" :src="item.fileurlFull"></video
          ></view>
        </view>
        <view class="label">整改说明</view>
        <textarea
          v-model="handleParam.checkInfo"
          placeholder="请详细描述现场情况，不少于10个字"
          placeholder-class="placeholder9"
        />
        <view class="back_footer">
          <view class="btn" @click="isShowHandle = false">取消</view>
          <view class="btn agree" @click="onSubmit">提交</view>
        </view>
      </view>
    </u-popup>
    <!-- ä¸Šä¼  -->
    <u-popup :show="showUpload" @close="showUpload = false" closeOnClickOverlay>
      <view class="sel_upload_wrap">
        <view class="btn" @click="uploadImage">选择图片</view>
        <view class="btn" @click="uploadVideo">选择视频</view>
      </view>
    </u-popup>
    <u-popup
      :show="showUploadBe"
      @close="showUploadBe = false"
      closeOnClickOverlay
    >
      <view class="sel_upload_wrap">
        <view class="btn" @click="uploadBeImage">选择图片</view>
        <view class="btn" @click="uploadBeVideo">选择视频</view>
      </view>
    </u-popup>
    <u-popup
      :show="showUploadAf"
      @close="showUploadAf = false"
      closeOnClickOverlay
    >
      <view class="sel_upload_wrap">
        <view class="btn" @click="uploadAfImage">选择图片</view>
        <view class="btn" @click="uploadAfVideo">选择视频</view>
      </view>
    </u-popup>
    <!-- è½¬äº¤ -->
    <u-popup
      :show="isShowTransfer"
      :round="10"
      safeAreaInsetBottom
      mode="bottom"
      @close="isShowTransfer = false"
    >
      <view class="appr_modal">
        <view class="title">选择员工</view>
        <view class="search_inp df_ac">
          <image
            class="mr12 search"
            src="@/static/ic_search@2x.png"
            mode="widthFix"
          ></image>
          <input
            v-model="transferModel.name"
            @blur="getMemList()"
            type="text"
            placeholder="搜索部门/人员"
            placeholder-style="color: #999999;"
          />
        </view>
        <view class="member_list">
          <view v-for="item in memberList" :key="item.id" class="line">
            <image
              :src="
                item.faceImgFull
                  ? item.faceImgFull
                  : require('@/static/meeting/common/default_user@2x.png')
              "
              class="avatar"
              mode=""
            ></image>
            <view class="content">
              <view class="info">
                <text class="name">{{ item.name }}</text>
                <!-- <text class="tag">tag</text> -->
              </view>
              <view class="depart">{{ item.companyName }}</view>
            </view>
            <image
              @click="changeMem(item)"
              v-if="transferParam.id == item.id"
              src="@/static/meeting/icon/ic_choose_sel@2x.png"
              mode="widthFix"
              class="checked"
            ></image>
            <image
              @click="changeMem(item)"
              v-else
              src="@/static/meeting/icon/ic_choose@2x.png"
              mode="widthFix"
              class="checked"
            ></image>
            <text></text>
          </view>
          <view class="empty"></view>
        </view>
        <view class="Transfer_footer">
          <view class="btn" @click="isShowTransfer = fale">取消</view>
          <view class="btn active" @click="enterTransfer">确认转交</view>
        </view>
      </view>
    </u-popup>
    <!-- é€€å›žæ—¶é—´ -->
    <u-datetime-picker
      :show="isShowBackDate"
      @confirm="confirmBackDate"
      @cancel="isShowBackDate = false"
      mode="datetime"
    ></u-datetime-picker>

    <u-datetime-picker
      :show="isShowHandleDate"
      @confirm="confirmHandleDate"
      @cancel="isShowHandleDate = false"
      mode="datetime"
    ></u-datetime-picker>
  </view>
</template>

<script>
import {
  hiddenDangerDetail,
  uploadUrl,
  findHiddenAreaMemberList,
  dealHiddenDanger,
  transferHiddenDanger
} from '@/api'
import dayjs from 'dayjs'
export default {
  data() {
    return {
      isShowBack: false,
      param: {},
      info: {},

      id: '',
      type: '',
      cateList: [
        { name: '访客申请', id: 0 },
        { name: '访客报备', id: 1 },
        { name: '用车申请', id: 2 },
        { name: '隐患随手拍', id: 3 },
        { name: '物流车申请', id: 4 },
      ],
      statusMap: {
        0: '待审批',
        1: '审批中',
        2: '审批通过',
        3: '审批未通过',
        4: '已取消',
        5: '他人或签',
        6: '他人拒绝',
      },


      showUpload: false,
      isShowBackDate: false,
      submitFileList: [],
      backParam: {},

      isShowHandle: false,
      handleParam: {},
      isShowHandleDate: false,
      showUploadBe: false,
      showUploadAf: false,
      dealBeforeFileList: [],
      dealAfterFileList: [],

      isShowTransfer: false,
      transferParam: {},
      transferModel: {},
      pagination: {
        page: 1,
        capacity: 50
      },
      memberList: []
    }
  },
  onLoad(op) {
    this.id = op.id
    this.type = op.objType
    this.getDetail()
  },
  methods: {
    getDetail() {
      const { id } = this
      hiddenDangerDetail(id).then(res => {
        this.info = res.data
      })
    },
    onSubmit() {
      const { dealBeforeFileList, dealAfterFileList, handleParam } = this
      dealHiddenDanger({
        ...handleParam,
        dealBeforeFileList: dealBeforeFileList,
        dealAfterFileList: dealAfterFileList,
        status: 1,
        id: this.id
      }).then(res => {
        if (res.code === 200) {
          this.isShowHandle = false
          setTimeout(() => {
            uni.showToast({
              title: '操作成功',
              icon: 'success'
            })
          })
          uni.navigateBack()
        }
      })
    },
    enterTransfer() {
      const { transferParam, id } = this
      transferHiddenDanger({
        checkUserId: transferParam.id,
        id
      }).then(res => {
        if (res.code === 200) {
          this.isShowTransfer = false
          setTimeout(() => {
            uni.showToast({
              title: '操作成功',
              icon: 'success'
            })
          })
          uni.navigateBack()
        }
      })
    },
    changeMem(e) {
      this.transferParam = e
    },
    handleTransfer() {
      this.isShowTransfer = true
      this.getMemList()
    },
    getMemList() {
      findHiddenAreaMemberList({
        model: { ...this.transferModel },
        ...this.pagination,
      }).then(res => {
        this.memberList = res.data || []
      })
    },
    confirmBackDate(e) {
      this.$set(this.backParam, 'dealTime', dayjs(e.value).format('YYYY-MM-DD HH:mm:ss'))
      this.isShowBackDate = false
    },
    confirmHandleDate(e) {
      this.$set(this.handleParam, 'dealTime', dayjs(e.value).format('YYYY-MM-DD HH:mm:ss'))
      this.isShowHandleDate = false
    },
    onSubBack() {
      const { submitFileList, backParam } = this
      dealHiddenDanger({
        ...backParam,
        dealBeforeFileList: submitFileList,
        status: 2,
        id: this.id
      }).then(res => {
        if (res.code === 200) {
          this.isShowBack = false
          setTimeout(() => {
            uni.showToast({
              title: '操作成功',
              icon: 'success'
            })
          })
          uni.navigateBack()
        }
      })
    },
    uploadBeImage() {
      this.showUploadBe = false
      uni.chooseImage({
        count: 1,
        success: (chooseImageRes) => {
          console.log('chooseImageRes.tempFilePaths', chooseImageRes.tempFilePaths)
          uni.showLoading({ title: '上传中', mask: true })
          for (let i = 0; i < chooseImageRes.tempFilePaths.length; i++) {
            uni.uploadFile({
              url: `${uploadUrl}`,
              filePath: chooseImageRes.tempFilePaths[i],
              name: 'file',
              formData: {
                folderCode: 'HIDDEN_DANGER_FILE'
              },
              success: (uploadFileRes) => {
                let res = JSON.parse(uploadFileRes.data)
                console.log('res', res)
                let obj = {
                  type: '0'
                }
                obj.fileurl = res.data.halfPath
                obj.fileurlFull = res.data.addr
                this.dealBeforeFileList.push(obj)
              },
              complete() {
                if (i === chooseImageRes.tempFilePaths.length - 1) {
                  uni.hideLoading()
                }
              }
            })
          }
        }
      })
    },
    uploadBeVideo() {
      this.showUploadBe = false
      let that = this
      uni.chooseVideo({
        success: (chooseImageRes) => {
          uni.showLoading({ title: '上传中', mask: true })
          uni.uploadFile({
            url: `${uploadUrl}`,
            filePath: chooseImageRes.tempFilePath,
            name: 'file',
            formData: {
              folderCode: 'HIDDEN_DANGER_FILE'
            },
            success: (uploadFileRes) => {
              let res = JSON.parse(uploadFileRes.data)
              console.log('res', res)
              let obj = {
                type: '1'
              }
              obj.fileurl = res.data.halfPath
              obj.fileurlFull = res.data.addr
              this.dealBeforeFileList.push(obj)
            },
            complete() {
              uni.hideLoading()
            }
          })
        }
      })
    },
    uploadAfImage() {
      this.showUploadAf = false
      uni.chooseImage({
        count: 1,
        success: (chooseImageRes) => {
          console.log('chooseImageRes.tempFilePaths', chooseImageRes.tempFilePaths)
          uni.showLoading({ title: '上传中', mask: true })
          for (let i = 0; i < chooseImageRes.tempFilePaths.length; i++) {
            uni.uploadFile({
              url: `${uploadUrl}`,
              filePath: chooseImageRes.tempFilePaths[i],
              name: 'file',
              formData: {
                folderCode: 'HIDDEN_DANGER_FILE'
              },
              success: (uploadFileRes) => {
                let res = JSON.parse(uploadFileRes.data)
                console.log('res', res)
                let obj = {
                  type: '0'
                }
                obj.fileurl = res.data.halfPath
                obj.fileurlFull = res.data.addr
                this.dealAfterFileList.push(obj)
              },
              complete() {
                if (i === chooseImageRes.tempFilePaths.length - 1) {
                  uni.hideLoading()
                }
              }
            })
          }
        }
      })
    },
    uploadAfVideo() {
      this.showUploadAf = false
      let that = this
      uni.chooseVideo({
        success: (chooseImageRes) => {
          uni.showLoading({ title: '上传中', mask: true })
          uni.uploadFile({
            url: `${uploadUrl}`,
            filePath: chooseImageRes.tempFilePath,
            name: 'file',
            formData: {
              folderCode: 'HIDDEN_DANGER_FILE'
            },
            success: (uploadFileRes) => {
              let res = JSON.parse(uploadFileRes.data)
              console.log('res', res)
              let obj = {
                type: '1'
              }
              obj.fileurl = res.data.halfPath
              obj.fileurlFull = res.data.addr
              this.dealAfterFileList.push(obj)
            },
            complete() {
              uni.hideLoading()
            }
          })
        }
      })
    },
    uploadImage() {
      this.showUpload = false
      uni.chooseImage({
        count: 1,
        success: (chooseImageRes) => {
          console.log('chooseImageRes.tempFilePaths', chooseImageRes.tempFilePaths)
          uni.showLoading({ title: '上传中', mask: true })
          for (let i = 0; i < chooseImageRes.tempFilePaths.length; i++) {
            uni.uploadFile({
              url: `${uploadUrl}`,
              filePath: chooseImageRes.tempFilePaths[i],
              name: 'file',
              formData: {
                folderCode: 'HIDDEN_DANGER_FILE'
              },
              success: (uploadFileRes) => {
                let res = JSON.parse(uploadFileRes.data)
                console.log('res', res)
                let obj = {
                  type: '0'
                }
                obj.fileurl = res.data.halfPath
                obj.fileurlFull = res.data.addr
                this.submitFileList.push(obj)
              },
              complete() {
                if (i === chooseImageRes.tempFilePaths.length - 1) {
                  uni.hideLoading()
                }
              }
            })
          }
        }
      })
    },
    uploadVideo() {
      this.showUpload = false
      let that = this
      uni.chooseVideo({
        success: (chooseImageRes) => {
          uni.showLoading({ title: '上传中', mask: true })
          uni.uploadFile({
            url: `${uploadUrl}`,
            filePath: chooseImageRes.tempFilePath,
            name: 'file',
            formData: {
              folderCode: 'HIDDEN_DANGER_FILE'
            },
            success: (uploadFileRes) => {
              let res = JSON.parse(uploadFileRes.data)
              console.log('res', res)
              let obj = {
                type: '1'
              }
              obj.fileurl = res.data.halfPath
              obj.fileurlFull = res.data.addr
              this.submitFileList.push(obj)
            },
            complete() {
              uni.hideLoading()
            }
          })
        }
      })
    },
  },
}
</script>
<style>
page {
  background-color: #f7f7f7;
}
</style>
<style lang="scss">
.main_app {
  background-color: #fff;
  padding-bottom: 0;

  .flow_wrap {
    padding: 30rpx 0;

    .flow_title {
      font-weight: 500;
      font-size: 32rpx;
      color: #222222;
      margin-bottom: 24rpx;
    }

    .list {
      .item {
        display: flex;
        margin-bottom: 48rpx;
        position: relative;
        .separate {
          position: absolute;
          width: 4rpx;
          height: 100%;
          background-color: #eeeeee;
          left: 40rpx;
          transform: translate(-50%, 0);
          top: 80rpx;
        }
        .avatar {
          width: 80rpx;
          height: 80rpx;
          position: relative;
          margin-right: 20rpx;

          .img {
            width: 80rpx;
            height: 80rpx;
            border-radius: 50%;
          }

          .status {
            width: 28rpx;
            height: 28rpx;
            border-radius: 50%;
            position: absolute;
            right: 0;
            bottom: 0;
          }
        }

        .content {
          flex: 1;

          .head {
            display: flex;
            justify-content: space-between;
            margin-bottom: 4rpx;

            .event {
              font-size: 30rpx;
            }

            .time {
              font-size: 26rpx;
              color: #999999;
            }
          }

          .name_wrap {
            font-size: 26rpx;
            color: #777777;

            .status {
              color: $uni-color-primary;
            }
          }
          .children {
            display: flex;
            flex-wrap: wrap;
            margin-top: 12rpx;
            .child {
              display: flex;
              flex-direction: column;
              justify-content: center;
              align-items: center;
              margin-right: 12rpx;
              .child_img {
                width: 48rpx;
                height: 48rpx;
                border-radius: 50%;
              }
            }
          }

          .remark {
            margin-top: 12rpx;
            background-color: #f7f7f7;
            padding: 14rpx 20rpx;
            border-radius: 8rpx;
            font-size: 26rpx;
            color: #666666;
            line-height: 36rpx;
          }
        }
        .carbon {
          display: flex;
          width: 590rpx;
          overflow-x: auto;
          margin-top: 12rpx;
          .carbon_item {
            text-align: center;
            flex-shrink: 0;
            width: 100rpx;
            image {
              width: 60rpx;
              height: 60rpx;
              margin: 0 auto;
            }
            view {
              font-size: 26rpx;
              color: #777777;
            }
          }
        }
        &:nth-last-child(1) {
          .separate {
            height: 0;
          }
        }
      }
    }
  }

  .module_list {
    .item {
      padding: 30rpx 0;
      border-bottom: 1rpx solid #e5e5e5;

      .label {
        font-size: 26rpx;
        color: #666666;
        margin-bottom: 20rpx;
      }

      .value {
        font-size: 30rpx;
        display: flex;
        align-items: center;

        .avatar {
          margin-right: 20rpx;
          width: 120rpx;
          height: 120rpx;
          border-radius: 8rpx;
          border: 2rpx solid #e5e5e5;
        }

        .info {
          flex: 1;
          display: flex;
          flex-direction: column;
          justify-content: space-between;
          font-size: 26rpx;
          color: #666666;

          .name {
            font-size: 30rpx;
            color: #333333;
          }
        }
      }
    }
  }

  .status_wrap {
    position: relative;
    padding: 30rpx 0;

    .name {
      font-weight: 500;
      font-size: 32rpx;
      margin-bottom: 20rpx;
      color: #222222;
    }

    .desc {
      font-size: 26rpx;
      color: #ed4545;
    }
    .gray {
      color: #999999;
    }
    .file_list {
      display: flex;
      flex-wrap: wrap;
      margin-bottom: 20rpx;
      .img {
        width: 140rpx;
        margin-right: 12rpx;
        margin-bottom: 12rpx;
        border-radius: 8rpx;
      }
    }
    .text_wrap {
      padding: 20rpx;
      background-color: #f8f7f7;
      border-radius: 8rpx;
      margin-top: 20rpx;
      .line {
        margin-bottom: 12rpx;
        display: flex;
        font-size: 24rpx;
        .label {
          color: #999999;
          width: 140rpx;
        }
      }
    }

    .status {
      position: absolute;
      right: -30rpx;
      top: 0;
      height: 60rpx;
      line-height: 60rpx;
      padding: 0 32rpx;
      border-radius: 0rpx 0rpx 0rpx 30rpx;
      background-color: #e9edff;
      color: $uni-color-primary;
    }
    .status_img {
      position: absolute;
      right: 0rpx;
      top: 20rpx;
      width: 120rpx;
    }
  }

  .main_footer {
    position: fixed;
    bottom: 0;
    width: 100%;
    left: 0;
    padding: 30rpx 10rpx 60rpx;
    display: flex;
    justify-content: space-between;
    background: #ffffff;
    .btn {
      flex: 1;
      height: 88rpx;
      line-height: 88rpx;
      background: #ffffff;
      border-radius: 44rpx;
      border: 1rpx solid #999999;
      font-size: 32rpx;
      text-align: center;
      margin: 16rpx 8rpx;
    }
    .transfer {
      color: $uni-color-primary;
      border: 1rpx solid $uni-color-primary;
    }

    .handle {
      flex: 2;
      background: $uni-color-primary;
      color: #fff;
      border: 1rpx solid $uni-color-primary;
    }
  }

  .appr_modal {
    padding: 36rpx 30rpx 0;
    .title {
      font-weight: 500;
      font-size: 32rpx;
      color: #222222;
      margin-bottom: 40rpx;
      text-align: center;
    }
    .label {
      text {
        color: #ed4545;
      }
    }
    .df_sb {
      display: flex;
      justify-content: space-between;
      align-items: center;
      height: 90rpx;
      border-bottom: 1rpx solid #e4e4e4;
      margin-bottom: 30rpx;
    }
    .back_footer {
      display: flex;
      .btn {
        flex: 1;
        height: 88rpx;
        line-height: 88rpx;
        background: #ffffff;
        border-radius: 44rpx;
        border: 1rpx solid #999999;
        font-size: 32rpx;
        text-align: center;
        margin: 16rpx 8rpx;
      }
      .agree {
        background: $uni-color-primary;
        color: #fff;
        border: 1rpx solid $uni-color-primary;
      }
    }
    textarea {
      box-sizing: border-box;
      width: 690rpx;
      min-height: 200rpx;
      background-color: #f7f7f7;
      font-size: 28rpx;
      color: #333333;
      padding: 24rpx;
      border-radius: 8rpx;
      margin-bottom: 30rpx;
    }
    .upload_wrap {
      display: flex;
      flex-wrap: wrap;
      margin-bottom: 30rpx;
    }
    .adduser_list_item_ipt1_upload {
      margin-top: 24rpx;
      width: 120rpx;
      height: 120rpx;
      margin-right: 24rpx;
      border: 2rpx solid #e5e5e5;
      background: #f7f7f7;
      color: #666666;
      font-size: 22rpx;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
      image {
        width: 100%;
        height: 100%;
      }
      video {
        width: 100%;
      }
    }
  }

  .emyty {
    width: 750rpx;
    height: 20rpx;
    background-color: #f7f7f7;
    margin: 0 -30rpx;
  }
}
.sel_upload_wrap {
  width: 100%;
  border-top: 1px solid #333333;
  box-shadow: 0 1 1 #333333;
  .btn {
    height: 90rpx;
    line-height: 90rpx;
    text-align: center;
  }
}
.member_list {
  height: 920rpx;
  overflow: auto;
  .line {
    display: flex;
    align-items: center;
    border-bottom: 1rpx solid #e5e5e5;
    padding: 30rpx 0;
    .avatar {
      width: 64rpx;
      height: 64rpx;
      border-radius: 50%;
      overflow: hidden;
      margin-right: 20rpx;
    }
    .content {
      flex: 1;
      .depart {
        font-size: 24rpx;
        color: #666666;
      }
      .info {
        display: flex;
        margin-bottom: 16rpx;
        .name {
          font-size: 30rpx;
        }
        .tag {
          font-size: 24rpx;
          border-radius: 4rpx;
          border: 1rpx solid #f62710;
          color: #f62710;
          padding: 0rpx 6rpx;
          margin-left: 8rpx;
        }
      }
    }
    .checked {
      width: 48rpx;
    }
  }
  .empty {
    width: 100%;
    height: 280rpx;
  }
}
.search_inp {
  height: 72rpx;
  background: #f7f7f7;
  border-radius: 4rpx;
  padding-left: 16rpx;
  .search {
    width: 28rpx;
  }
  input {
    flex: 1;
    font-size: 28rpx;
    color: #333333;
  }
}
.Transfer_footer {
  display: flex;
  .btn {
    flex: 1;
    height: 88rpx;
    line-height: 88rpx;
    background: #ffffff;
    border-radius: 44rpx;
    border: 1rpx solid #999999;
    font-size: 32rpx;
    text-align: center;
    margin: 16rpx 8rpx;
  }
  .active {
    background: $uni-color-primary;
    color: #fff;
    border: 1rpx solid $uni-color-primary;
  }
}
</style>

 h5/pages/staff/task/visitorApprove.vue

@@ -1,372 +1,524 @@
<template>
    <view class="main_app">
        <view class="status_wrap">
            <view class="name">丁恩凯的访客申请</view>
            <view class="desc">等待我处理</view>
            <view class="status">审批中</view>
        </view>
        <!--  -->
        <view class="emyty"></view>
        <view class="module_list">
            <view class="item">
                <view class="label">拜访人</view>
                <view class="value">廖成瑶</view>
            </view>
            <view class="item">
                <view class="label">预计入/离厂时间</view>
                <view class="value">05/01 8:00 - 05/01 18:00</view>
            </view>
            <view class="emyty"></view>
            <view class="item">
                <view class="label">访客信息</view>
                <view class="value">
                    <image class="avatar" src="@/static/logo@2x.png" mode="widthFix"></image>
                    <view class="info">
                        <text class="name">孙志 18177665678</text>
                        <text>身份证号：3309****2910</text>
                        <text>入园车辆：皖A88789</text>
                    </view>
                </view>
            </view>
            <view class="item">
                <view class="label">公司名称</view>
                <view class="value">中国移动</view>
            </view>
            <view class="item">
                <view class="label">施工人员</view>
                <view class="value">否</view>
            </view>
            <view class="item">
                <view class="label">来访事由</view>
                <view class="value">业务洽谈</view>
            </view>
        </view>
        <!-- æµç¨‹ -->
        <view class="flow_wrap">
            <view class="flow_title">流程</view>
            <view class="list">
                <view class="item">
                    <view class="avatar">
                        <image class="img" src="@/static/logo@2x.png" mode="widthFix" />
                        <image class="status" src="@/static/staff/liucheng_success@2x.png" mode="widthFix" />
                        <view class="separate"></view>
                    </view>
                    <view class="content">
                        <view class="head">
                            <view class="event">某某提交的拜访申请</view>
                            <view class="time">time</view>
                        </view>
                        <view class="name_wrap">
                            <text>李东(<text class="status">处理中</text>)</text>
                        </view>
                        <view class="remark">同意放行</view>
                    </view>
                </view>
                <view class="item">
                    <view class="avatar">
                        <image class="img" src="@/static/logo@2x.png" mode="widthFix" />
                        <image class="status" src="@/static/staff/liucheng_success@2x.png" mode="widthFix" />
                    </view>
                    <view class="content">
                        <view class="head">
                            <view class="event">某某提交的拜访申请</view>
                            <view class="time">time</view>
                        </view>
                        <view class="name_wrap">
                            <text>李东(<text class="status">处理中</text>)</text>
                        </view>
                        <view class="carbon">
                            <view class="carbon_item" v-for="i in 12">
                                <image src="../../../static/logo@2x.png" mode="widthFix"></image>
                                <view class="text">name</view>
                            </view>
                        </view>
                    </view>
                </view>
            </view>
        </view>
        <view class="emyty"></view>
        <view class="main_footer">
            <view class="btn" @click="handleSub('0')">拒绝</view>
            <view class="btn agree" @click="handleSub('1')">同意</view>
        </view>
  <view class="main_app">
    <view class="status_wrap">
      <view class="name">{{ info.name }}提交的{{ cateList[type].name }}</view>
      <view
        class="desc"
        :class="{
          gray: info.status == '2' || info.status == '5' || info.status == '4',
        }"
        >{{ statusMap[info.status] }}</view
      >
      <view v-if="info.status == '0'" class="status">{{
        statusMap[info.status]
      }}</view>
      <image
        v-if="info.status == '2'"
        src="@/static/ic_passed@2x.png"
        mode="widthFix"
        class="status_img"
      ></image>
      <image
        v-if="info.status == '3' || info.status == '6'"
        src="@/static/ic_refused@2x.png"
        mode="widthFix"
        class="status_img"
      ></image>
    </view>
    <!--  -->
    <view class="emyty"></view>
    <view class="module_list">
      <view class="item">
        <view class="label">被访人</view>
        <view class="value">{{ info.visitUserName }}</view>
      </view>
      <view class="item">
        <view class="label">预计入/离厂时间</view>
        <view class="value" v-if="info.visitTime">{{ info.visitTime }}</view>
      </view>
      <view class="emyty"></view>
      <view class="item">
        <view class="label">访客信息</view>
        <view class="value">
          <image
            class="avatar"
            :src="
              info.prefix
                ? info.prefix + info.faceImg
                : require('@/static/meeting/common/default_user@2x.png')
            "
            mode="widthFix"
          ></image>
          <view class="info">
            <text class="name">{{ info.name }} {{ info.phone }}</text>
            <text>身份证号：{{ info.idCardDecode }}</text>
            <text>入园车辆：{{ info.carNos }}</text>
          </view>
        </view>
      </view>
      <view class="item">
        <view class="label">公司名称</view>
        <view class="value">{{ info.companyName }}</view>
      </view>
      <view class="item">
        <view class="label">施工人员</view>
        <view class="value">{{ info.type == 0 ? "否" : "是" }}</view>
      </view>
      <view class="item">
        <view class="label">来访事由</view>
        <view class="value">{{ info.visitReason }}</view>
      </view>
    </view>
    <!-- æµç¨‹ -->
    <view class="flow_wrap">
      <view class="flow_title">流程</view>
      <view
        class="list"
        v-if="
          info.approveDateVO != null && info.approveDateVO.approveList != null
        "
      >
        <view
          class="item"
          v-for="(item, index) in info.approveDateVO.approveList"
          :key="item.id"
        >
          <view class="separate"></view>
          <view class="avatar">
            <image
              class="img"
              :src="
                item.faceImg
                  ? item.faceImg
                  : require('@/static/meeting/common/default_user@2x.png')
              "
            />
            <image
              class="status"
              src="@/static/staff/liucheng_success@2x.png"
              mode="widthFix"
            />
          </view>
          <view class="content">
            <view class="head">
              <view class="event">{{ item.title }}</view>
              <view class="time">{{ item.checkDate }}</view>
            </view>
            <view class="name_wrap">
              <text
                >{{ item.memberName
                }}<text class="status" v-if="item.statusInfo"
                  >({{ item.statusInfo }})</text
                ></text
              >
            </view>
            <view v-if="item.checkInfo" class="remark">{{
              item.checkInfo
            }}</view>
            <!-- æŠ„送人 -->
            <view v-if="item.approveType == 1" class="children">
              <view
                class="child"
                v-for="child in item.approveList"
                :key="child.id"
              >
                <image
                  class="child_img"
                  :src="
                    child.faceImg
                      ? child.faceImg
                      : require('@/static/meeting/common/default_user@2x.png')
                  "
                />
                <view>{{ child.memberName }}</view>
              </view>
            </view>
          </view>
        </view>
      </view>
    </view>
    <view class="emyty"></view>
    <view class="main_footer">
      <view class="btn" @click="handleSub(3)">拒绝</view>
      <view class="btn agree" @click="handleSub(2)">同意</view>
    </view>

        <!--  -->
        <u-popup :show="showApprModal" :round="10" :safeAreaInsetBottom="true" mode="bottom" @close="showApprModal = false">
            <view class="appr_modal">
                <view class="title">同意</view>
                <textarea placeholder="同意说明，非必填" placeholder-class="placeholder9" />
                <view class="main_footer">
                    <view class="btn" @click="showApprModal = false">取消</view>
                    <view class="btn agree">提交</view>
                </view>
            </view>
        </u-popup>
    </view>
    <u-popup
      :show="showApprModal"
      :round="10"
      :safeAreaInsetBottom="true"
      mode="bottom"
      @close="showApprModal = false"
    >
      <view class="appr_modal">
        <view class="title">{{ param.status == 2 ? "同意" : "拒绝" }}</view>
        <textarea
          v-model="param.checkInfo"
          :placeholder="
            param.status == 2 ? '同意说明，非必填' : '拒绝说明，必填'
          "
          placeholder-class="placeholder9"
        />
        <view class="main_footer">
          <view class="btn" @click="showApprModal = false">取消</view>
          <view class="btn agree" @click="onSubmit">提交</view>
        </view>
      </view>
    </u-popup>
  </view>
</template>

<script>
import {
  getVisitedDetail, // è®¿å®¢é¢„约详情
  carUseBookAppr
} from '@/api'
export default {
    data() {
        return {
            showApprModal: false,
            param: {}
        }
    },
    methods: {
        handleSub(flag) {
            // this.param.flag = 
            if (flag === '1') {
  data() {
    return {
      showApprModal: false,
      param: {},
      info: {},

            } else {

            }
            this.showApprModal = true
        }
    },
      id: '',
      type: '',
      cateList: [
        { name: '访客申请', id: 0 },
        { name: '访客报备', id: 1 },
        { name: '用车申请', id: 2 },
        { name: '隐患随手拍', id: 3 },
        { name: '物流车申请', id: 4 },
      ],
      statusMap: {
        0: '待审批',
        1: '审批中',
        2: '审批通过',
        3: '审批未通过',
        4: '已取消',
        5: '他人或签',
        6: '他人拒绝',
      }
    }
  },
  onLoad(op) {
    this.id = op.id
    this.type = op.objType
    this.getDetail()
  },
  methods: {
    getDetail() {
      const { id } = this
      getVisitedDetail({ id }).then(res => {
        this.info = res.data
      })
    },
    onSubmit() {
      const { param, info } = this
      carUseBookAppr({
        status: param.status,
        objType: info.type,
        objId: this.id,
        // driverId: param.driverId,
        checkInfo: param.checkInfo
      }).then(res => {
        if (res.code === 200) {
          this.showApprModal = false
          setTimeout(() => {
            uni.showToast({
              title: '操作成功',
              icon: 'success'
            })
          })
          uni.navigateBack()
        }
      })
    },
    handleSub(status) {
      // this.param.flag = 
      this.param = {
        status
      }
      this.showApprModal = true
      this.showApprModal = true
    },
  },
}
</script>
<style>
page {
    background-color: #F7F7F7;
  background-color: #f7f7f7;
}
</style>
<style lang="scss">
.main_app {
    background-color: #fff;
    padding-bottom: 0;
  background-color: #fff;
  padding-bottom: 0;

    .flow_wrap {
        padding: 30rpx 0;
  .flow_wrap {
    padding: 30rpx 0;

        .flow_title {
            font-weight: 500;
            font-size: 32rpx;
            color: #222222;
            margin-bottom: 24rpx;
        }
    .flow_title {
      font-weight: 500;
      font-size: 32rpx;
      color: #222222;
      margin-bottom: 24rpx;
    }

        .list {
            .item {
                display: flex;
                margin-bottom: 48rpx;
    .list {
      .item {
        display: flex;
        margin-bottom: 48rpx;
        position: relative;
        .separate {
          position: absolute;
          width: 4rpx;
          height: 100%;
          background-color: #eeeeee;
          left: 40rpx;
          transform: translate(-50%, 0);
          top: 80rpx;
        }
        .avatar {
          width: 80rpx;
          height: 80rpx;
          position: relative;
          margin-right: 20rpx;

                .avatar {
                    width: 80rpx;
                    height: 80rpx;
                    position: relative;
                    margin-right: 20rpx;
          .img {
            width: 80rpx;
            height: 80rpx;
            border-radius: 50%;
          }

                    .img {
                        width: 80rpx;
                        height: 80rpx;
                        border-radius: 50%;
                    }
          .status {
            width: 28rpx;
            height: 28rpx;
            border-radius: 50%;
            position: absolute;
            right: 0;
            bottom: 0;
          }
        }

                    .status {
                        width: 28rpx;
                        height: 28rpx;
                        border-radius: 50%;
                        position: absolute;
                        right: 0;
                        bottom: 0;
                    }
        .content {
          flex: 1;

                    .separate {
                        position: absolute;
                        width: 4rpx;
                        height: 100%;
                        background-color: #EEEEEE;
                        left: 50%;
                        transform: translate(-50%, 0);
                        bottom: -80rpx;
                    }
                }
          .head {
            display: flex;
            justify-content: space-between;
            margin-bottom: 4rpx;

                .content {
                    flex: 1;
            .event {
              font-size: 30rpx;
            }

                    .head {
                        display: flex;
                        justify-content: space-between;
                        margin-bottom: 4rpx;
            .time {
              font-size: 26rpx;
              color: #999999;
            }
          }

                        .event {
                            font-size: 30rpx;
                        }
          .name_wrap {
            font-size: 26rpx;
            color: #777777;

                        .time {
                            font-size: 26rpx;
                            color: #999999;
                        }
                    }
            .status {
              color: $uni-color-primary;
            }
          }
          .children {
            display: flex;
            flex-wrap: wrap;
            margin-top: 12rpx;
            .child {
              display: flex;
              flex-direction: column;
              justify-content: center;
              align-items: center;
              margin-right: 12rpx;
              .child_img {
                width: 48rpx;
                height: 48rpx;
                border-radius: 50%;
              }
            }
          }

                    .name_wrap {
                        font-size: 26rpx;
                        color: #777777;
          .remark {
            margin-top: 12rpx;
            background-color: #f7f7f7;
            padding: 14rpx 20rpx;
            border-radius: 8rpx;
            font-size: 26rpx;
            color: #666666;
            line-height: 36rpx;
          }
        }
        .carbon {
          display: flex;
          width: 590rpx;
          overflow-x: auto;
          margin-top: 12rpx;
          .carbon_item {
            text-align: center;
            flex-shrink: 0;
            width: 100rpx;
            image {
              width: 60rpx;
              height: 60rpx;
              margin: 0 auto;
            }
            view {
              font-size: 26rpx;
              color: #777777;
            }
          }
        }
        &:nth-last-child(1) {
          .separate {
            height: 0;
          }
        }
      }
    }
  }

                        .status {
                            color: $uni-color-primary;
                        }
                    }
  .module_list {
    .item {
      padding: 30rpx 0;
      border-bottom: 1rpx solid #e5e5e5;

                    .remark {
                        margin-top: 12rpx;
                        background-color: #f7f7f7;
                        padding: 14rpx 20rpx;
                        border-radius: 8rpx;
                        font-size: 26rpx;
                        color: #666666;
                        line-height: 36rpx;
                    }
                }
                .carbon{
                    display: flex;
                    width: 590rpx;
                    overflow-x: auto;
                    margin-top: 12rpx;
                    .carbon_item{
                        text-align: center;
                        flex-shrink: 0;
                        width: 100rpx;
                        image{
                            width: 60rpx;
                            height: 60rpx;
                            margin: 0 auto;
                        }
                        view{
                            font-size: 26rpx;
                            color: #777777;
							
                        }
                    }
                }
            }
        }
    }
      .label {
        font-size: 26rpx;
        color: #666666;
        margin-bottom: 20rpx;
      }

    .module_list {
        .item {
            padding: 30rpx 0;
            border-bottom: 1rpx solid #E5E5E5;
      .value {
        font-size: 30rpx;
        display: flex;
        align-items: center;

            .label {
                font-size: 26rpx;
                color: #666666;
                margin-bottom: 20rpx;
            }
        .avatar {
          margin-right: 20rpx;
          width: 120rpx;
          height: 120rpx;
          border-radius: 8rpx;
          border: 2rpx solid #e5e5e5;
        }

            .value {
                font-size: 30rpx;
                display: flex;
                align-items: center;
        .info {
          flex: 1;
          display: flex;
          flex-direction: column;
          justify-content: space-between;
          font-size: 26rpx;
          color: #666666;

                .avatar {
                    margin-right: 20rpx;
                    width: 120rpx;
                    height: 120rpx;
                    border-radius: 8rpx;
                    border: 2rpx solid #E5E5E5;
                }
          .name {
            font-size: 30rpx;
            color: #333333;
          }
        }
      }
    }
  }

                .info {
                    flex: 1;
                    display: flex;
                    flex-direction: column;
                    justify-content: space-between;
                    font-size: 26rpx;
                    color: #666666;
  .status_wrap {
    position: relative;
    padding: 30rpx 0;

                    .name {
                        font-size: 30rpx;
                        color: #333333;
                    }
                }
            }
        }
    }
    .name {
      font-weight: 500;
      font-size: 32rpx;
      margin-bottom: 20rpx;
      color: #222222;
    }

    .status_wrap {
        position: relative;
        padding: 30rpx 0;
    .desc {
      font-size: 26rpx;
      color: #ed4545;
    }
    .gray {
      color: #999999;
    }

        .name {
            font-weight: 500;
            font-size: 32rpx;
            margin-bottom: 20rpx;
            color: #222222;
        }
    .status {
      position: absolute;
      right: -30rpx;
      top: 0;
      height: 60rpx;
      line-height: 60rpx;
      padding: 0 32rpx;
      border-radius: 0rpx 0rpx 0rpx 30rpx;
      background-color: #e9edff;
      color: $uni-color-primary;
    }
    .status_img {
      position: absolute;
      right: 0rpx;
      top: 20rpx;
      width: 120rpx;
    }
  }

        .desc {
            font-size: 26rpx;
            color: #ED4545;
        }
  .main_footer {
    padding-bottom: 64rpx;
    display: flex;
    justify-content: space-between;
    width: 100%;
    left: 0;
    padding: 30rpx 10rpx 60rpx;
    display: flex;
    justify-content: space-between;
    background: #ffffff;
    .btn {
      width: 336rpx;
      height: 88rpx;
      line-height: 88rpx;
      background: #ffffff;
      border-radius: 44rpx;
      border: 1rpx solid #999999;
      font-size: 32rpx;
      text-align: center;
      margin: 16rpx 0;
    }

        .status {
            position: absolute;
            right: -30rpx;
            top: 0;
            height: 60rpx;
            line-height: 60rpx;
            padding: 0 32rpx;
            border-radius: 0rpx 0rpx 0rpx 30rpx;
            background-color: #e9edff;
            color: $uni-color-primary;
        }
    }
    .agree {
      background: $uni-color-primary;
      color: #fff;
      border: 1rpx solid $uni-color-primary;
    }
  }

    .main_footer {
        padding-bottom: 64rpx;
        display: flex;
        justify-content: space-between;
  .appr_modal {
    padding: 36rpx 30rpx 0;

        .btn {
            width: 336rpx;
            height: 88rpx;
            line-height: 88rpx;
            background: #FFFFFF;
            border-radius: 44rpx;
            border: 1rpx solid #999999;
            font-size: 32rpx;
            text-align: center;
            margin: 16rpx 0;
        }
    .title {
      font-weight: 500;
      font-size: 32rpx;
      color: #222222;
      margin-bottom: 40rpx;
      text-align: center;
    }

        .agree {
            background: $uni-color-primary;
            color: #fff;
            border: 1rpx solid $uni-color-primary;
        }
    }
    textarea {
      box-sizing: border-box;
      width: 690rpx;
      background-color: #f7f7f7;
      font-size: 28rpx;
      color: #333333;
      padding: 24rpx;
      border-radius: 8rpx;
      margin-bottom: 30rpx;
    }
  }

    .appr_modal {
        padding: 36rpx 30rpx 0;

        .title {
            font-weight: 500;
            font-size: 32rpx;
            color: #222222;
            margin-bottom: 40rpx;
            text-align: center;
        }

        textarea {
            box-sizing: border-box;
            width: 690rpx;
            background-color: #f7f7f7;
            font-size: 28rpx;
            color: #333333;
            padding: 24rpx;
            border-radius: 8rpx;
            margin-bottom: 30rpx;
        }
    }

    .emyty {
        width: 750rpx;
        height: 20rpx;
        background-color: #f7f7f7;
        margin: 0 -30rpx;
    }
  .emyty {
    width: 750rpx;
    height: 20rpx;
    background-color: #f7f7f7;
    margin: 0 -30rpx;
  }
}
</style>

 h5/pages/staff/task/visitorReport.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,517 @@
<template>
  <view class="main_app">
    <view class="status_wrap">
      <view class="name"
        >{{ info.createMemberName }}提交的{{ cateList[type].name }}</view
      >
      <view
        class="desc"
        :class="{
          gray: info.status == '2' || info.status == '5' || info.status == '4',
        }"
        >{{ statusMap[info.status] }}</view
      >
      <view v-if="info.status == '0'" class="status">{{
        statusMap[info.status]
      }}</view>
      <image
        v-if="info.status == '2'"
        src="@/static/ic_passed@2x.png"
        mode="widthFix"
        class="status_img"
      ></image>
      <image
        v-if="info.status == '3' || info.status == '6'"
        src="@/static/ic_refused@2x.png"
        mode="widthFix"
        class="status_img"
      ></image>
    </view>
    <!--  -->
    <view class="emyty"></view>
    <view class="module_list">
      <view class="item">
        <view class="label">被访人</view>
        <view class="value"
          >{{ info.receptMemberName }} {{ info.receptMemberDepartment }}</view
        >
      </view>
      <view class="item">
        <view class="label">预计入/离厂时间</view>
        <view class="value" v-if="info.starttime"
          >{{ info.starttime.slice(0, 16) }} è‡³
          {{ info.endtime.slice(0, 16) }}</view
        >
      </view>
      <view class="emyty"></view>

      <view class="item">
        <view class="label">联系人信息</view>
        <view class="value">{{ info.name }} {{ info.phone }}</view>
      </view>
      <view class="item">
        <view class="label">入园车辆</view>
        <view class="value">{{ info.carNos }}</view>
      </view>
      <view class="item">
        <view class="label">随车人数</view>
        <view class="value">{{ info.memberNum }}人</view>
      </view>
      <view class="item">
        <view class="label">来访事由</view>
        <view class="value">{{ info.reason }}</view>
      </view>
    </view>
    <!-- æµç¨‹ -->
    <view class="flow_wrap">
      <view class="flow_title">流程</view>
      <view
        class="list"
        v-if="
          info.approveDateVO != null && info.approveDateVO.approveList != null
        "
      >
        <view
          class="item"
          v-for="(item, index) in info.approveDateVO.approveList"
          :key="item.id"
        >
          <view class="separate"></view>
          <view class="avatar">
            <image
              class="img"
              :src="
                item.faceImg
                  ? item.faceImg
                  : require('@/static/meeting/common/default_user@2x.png')
              "
            />
            <image
              class="status"
              src="@/static/staff/liucheng_success@2x.png"
              mode="widthFix"
            />
          </view>
          <view class="content">
            <view class="head">
              <view class="event">{{ item.title }}</view>
              <view class="time">{{ item.checkDate }}</view>
            </view>
            <view class="name_wrap">
              <text
                >{{ item.memberName
                }}<text class="status" v-if="item.statusInfo"
                  >({{ item.statusInfo }})</text
                ></text
              >
            </view>
            <view v-if="item.checkInfo" class="remark">{{
              item.checkInfo
            }}</view>
            <!-- æŠ„送人 -->
            <view v-if="item.approveType == 1" class="children">
              <view
                class="child"
                v-for="child in item.approveList"
                :key="child.id"
              >
                <image
                  class="child_img"
                  :src="
                    child.faceImg
                      ? child.faceImg
                      : require('@/static/meeting/common/default_user@2x.png')
                  "
                />
                <view>{{ child.memberName }}</view>
              </view>
            </view>
          </view>
        </view>
      </view>
    </view>
    <view class="emyty"></view>
    <view class="main_footer">
      <view class="btn" @click="handleSub(3)">拒绝</view>
      <view class="btn agree" @click="handleSub(2)">同意</view>
    </view>

    <u-popup
      :show="showApprModal"
      :round="10"
      :safeAreaInsetBottom="true"
      mode="bottom"
      @close="showApprModal = false"
    >
      <view class="appr_modal">
        <view class="title">{{ param.status == 2 ? "同意" : "拒绝" }}</view>
        <textarea
          v-model="param.checkInfo"
          :placeholder="
            param.status == 2 ? '同意说明，非必填' : '拒绝说明，必填'
          "
          placeholder-class="placeholder9"
        />
        <view class="main_footer">
          <view class="btn" @click="showApprModal = false">取消</view>
          <view class="btn agree" @click="onSubmit">提交</view>
        </view>
      </view>
    </u-popup>
  </view>
</template>

<script>
import {
  getVisitedReDetail, // è®¿å®¢é¢„约详情
  carUseBookAppr
} from '@/api'
export default {
  data() {
    return {
      showApprModal: false,
      param: {},
      info: {},

      id: '',
      type: '',
      cateList: [
        { name: '访客申请', id: 0 },
        { name: '访客报备', id: 1 },
        { name: '用车申请', id: 2 },
        { name: '隐患随手拍', id: 3 },
        { name: '物流车申请', id: 4 },
      ],
      statusMap: {
        0: '待审批',
        1: '审批中',
        2: '审批通过',
        3: '审批未通过',
        4: '已取消',
        5: '他人或签',
        6: '他人拒绝',
      }
    }
  },
  onLoad(op) {
    this.id = op.id
    this.type = op.objType
    this.getDetail()
  },
  methods: {
    getDetail() {
      const { id } = this
      getVisitedReDetail({ id }).then(res => {
        this.info = res.data
      })
    },
    onSubmit() {
      const { param, info } = this
      carUseBookAppr({
        status: param.status,
        objType: 2,
        objId: this.id,
        // driverId: param.driverId,
        checkInfo: param.checkInfo
      }).then(res => {
        if (res.code === 200) {
          this.showApprModal = false
          setTimeout(() => {
            uni.showToast({
              title: '操作成功',
              icon: 'success'
            })
          })
          uni.navigateBack()
        }
      })
    },
    handleSub(status) {
      // this.param.flag = 
      this.param = {
        status
      }
      this.showApprModal = true
      this.showApprModal = true
    },
  },
}
</script>
<style>
page {
  background-color: #f7f7f7;
}
</style>
<style lang="scss">
.main_app {
  background-color: #fff;
  padding-bottom: 0;

  .flow_wrap {
    padding: 30rpx 0;

    .flow_title {
      font-weight: 500;
      font-size: 32rpx;
      color: #222222;
      margin-bottom: 24rpx;
    }

    .list {
      .item {
        display: flex;
        margin-bottom: 48rpx;
        position: relative;
        .separate {
          position: absolute;
          width: 4rpx;
          height: 100%;
          background-color: #eeeeee;
          left: 40rpx;
          transform: translate(-50%, 0);
          top: 80rpx;
        }
        .avatar {
          width: 80rpx;
          height: 80rpx;
          position: relative;
          margin-right: 20rpx;

          .img {
            width: 80rpx;
            height: 80rpx;
            border-radius: 50%;
          }

          .status {
            width: 28rpx;
            height: 28rpx;
            border-radius: 50%;
            position: absolute;
            right: 0;
            bottom: 0;
          }
        }

        .content {
          flex: 1;

          .head {
            display: flex;
            justify-content: space-between;
            margin-bottom: 4rpx;

            .event {
              font-size: 30rpx;
            }

            .time {
              font-size: 26rpx;
              color: #999999;
            }
          }

          .name_wrap {
            font-size: 26rpx;
            color: #777777;

            .status {
              color: $uni-color-primary;
            }
          }
          .children {
            display: flex;
            flex-wrap: wrap;
            margin-top: 12rpx;
            .child {
              display: flex;
              flex-direction: column;
              justify-content: center;
              align-items: center;
              margin-right: 12rpx;
              .child_img {
                width: 48rpx;
                height: 48rpx;
                border-radius: 50%;
              }
            }
          }

          .remark {
            margin-top: 12rpx;
            background-color: #f7f7f7;
            padding: 14rpx 20rpx;
            border-radius: 8rpx;
            font-size: 26rpx;
            color: #666666;
            line-height: 36rpx;
          }
        }
        .carbon {
          display: flex;
          width: 590rpx;
          overflow-x: auto;
          margin-top: 12rpx;
          .carbon_item {
            text-align: center;
            flex-shrink: 0;
            width: 100rpx;
            image {
              width: 60rpx;
              height: 60rpx;
              margin: 0 auto;
            }
            view {
              font-size: 26rpx;
              color: #777777;
            }
          }
        }
        &:nth-last-child(1) {
          .separate {
            height: 0;
          }
        }
      }
    }
  }

  .module_list {
    .item {
      padding: 30rpx 0;
      border-bottom: 1rpx solid #e5e5e5;

      .label {
        font-size: 26rpx;
        color: #666666;
        margin-bottom: 20rpx;
      }

      .value {
        font-size: 30rpx;
        display: flex;
        align-items: center;

        .avatar {
          margin-right: 20rpx;
          width: 120rpx;
          height: 120rpx;
          border-radius: 8rpx;
          border: 2rpx solid #e5e5e5;
        }

        .info {
          flex: 1;
          display: flex;
          flex-direction: column;
          justify-content: space-between;
          font-size: 26rpx;
          color: #666666;

          .name {
            font-size: 30rpx;
            color: #333333;
          }
        }
      }
    }
  }

  .status_wrap {
    position: relative;
    padding: 30rpx 0;

    .name {
      font-weight: 500;
      font-size: 32rpx;
      margin-bottom: 20rpx;
      color: #222222;
    }

    .desc {
      font-size: 26rpx;
      color: #ed4545;
    }
    .gray {
      color: #999999;
    }

    .status {
      position: absolute;
      right: -30rpx;
      top: 0;
      height: 60rpx;
      line-height: 60rpx;
      padding: 0 32rpx;
      border-radius: 0rpx 0rpx 0rpx 30rpx;
      background-color: #e9edff;
      color: $uni-color-primary;
    }
    .status_img {
      position: absolute;
      right: 0rpx;
      top: 20rpx;
      width: 120rpx;
    }
  }

  .main_footer {
    padding-bottom: 64rpx;
    display: flex;
    justify-content: space-between;
    width: 100%;
    left: 0;
    padding: 30rpx 10rpx 60rpx;
    display: flex;
    justify-content: space-between;
    background: #ffffff;
    .btn {
      width: 336rpx;
      height: 88rpx;
      line-height: 88rpx;
      background: #ffffff;
      border-radius: 44rpx;
      border: 1rpx solid #999999;
      font-size: 32rpx;
      text-align: center;
      margin: 16rpx 0;
    }

    .agree {
      background: $uni-color-primary;
      color: #fff;
      border: 1rpx solid $uni-color-primary;
    }
  }

  .appr_modal {
    padding: 36rpx 30rpx 0;

    .title {
      font-weight: 500;
      font-size: 32rpx;
      color: #222222;
      margin-bottom: 40rpx;
      text-align: center;
    }

    textarea {
      box-sizing: border-box;
      width: 690rpx;
      background-color: #f7f7f7;
      font-size: 28rpx;
      color: #333333;
      padding: 24rpx;
      border-radius: 8rpx;
      margin-bottom: 30rpx;
    }
  }

  .emyty {
    width: 750rpx;
    height: 20rpx;
    background-color: #f7f7f7;
    margin: 0 -30rpx;
  }
}
</style>

 h5/pages/staff/vehicle/sendACarDetail.vue

@@ -119,9 +119,11 @@
    </view>
    <view class="emyty"></view>
    <view class="main_footer">
      <!-- <view class="btn" @click="handleSub(3)">拒绝</view>
      <view class="btn agree" @click="handleSub(2)">同意</view> -->
      <view class="btn agree" @click="isShowBack = true">撤销用车</view>
      <template v-if="appr == '1'">
        <view class="btn" @click="handleSub(3)">拒绝</view>
        <view class="btn agree" @click="handleSub(2)">同意</view>
      </template>
      <view v-else class="btn agree" @click="isShowBack = true">撤销用车</view>
    </view>

    <!-- æ’¤é”€ -->
@@ -155,7 +157,7 @@
    >
      <view class="appr_modal">
        <view class="title">{{ param.status == 2 ? "同意" : "拒绝" }}</view>
        <view class="line" @click="isShowDrive = true">
        <view v-if="param.status == 2" class="line" @click="isShowDrive = true">
          <text v-if="param.driverName">{{ param.driverName }}</text>
          <text v-else class="placeholder9">派车司机</text>
          <u-icon class="ml12" name="arrow-right" color="#999999" />
@@ -163,7 +165,7 @@
        <textarea
          v-model="param.checkInfo"
          :placeholder="
            param.status == 2 ? '同意说明，非必填' : '拒绝说明，非必填'
            param.status == 2 ? '同意说明，非必填' : '拒绝说明，必填'
          "
          placeholder-class="placeholder9"
        />
@@ -187,7 +189,7 @@
</template>

<script>
import { carUseBookDetail, carUseBookAppr, driveListPos, carUseBookBack } from '@/api'
import { carUseBookDetail, carUseBookAppr, driveListPost, carUseBookBack } from '@/api'
export default {
  data() {
    return {
@@ -196,6 +198,7 @@
      backParam: {},
      isShowDrive: false,
      id: '',
      appr: '',
      info: {},
      param: {
        status: ''
@@ -206,6 +209,7 @@
  },
  onLoad(option) {
    this.id = option.id
    this.appr = option.appr || ''
    this.getDetail()
  },
  methods: {