ll
liukangdong
2024-10-31 a030368330d5a6bf1d0ed42b6121b53d13b587d0
h5/pages/staff/snapshot.vue
@@ -5,14 +5,22 @@
      <view class="line">
        <view class="label">
          <text>*</text>
               <text>责任部门</text>
            </view>
            <view class="value" @click="isShowCompany = true">
               <text class="mr6"
                  :style="{ color: param.companyName ? '#000000' : '#999999' }">{{ param.companyName ? param.companyName : "请选择" }}</text>
               <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
            </view>
         </view>
         <view class="line">
            <view class="label">
               <text>*</text>
          <text>隐患区域</text>
        </view>
        <view class="value" @click="isShowArea = true">
          <text
            class="mr6"
            :style="{ color: param.areaName ? '#000000' : '#999999' }"
            >{{ param.areaName ? param.areaName : "请选择" }}</text
          >
               <text class="mr6"
                  :style="{ color: param.areaName ? '#000000' : '#999999' }">{{ param.areaName ? param.areaName : "请选择" }}</text>
          <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
        </view>
      </view>
@@ -22,11 +30,8 @@
          <text>接收人</text>
        </view>
        <view class="value" @click="selMember">
          <text
            class="mr6"
            :style="{ color: param.checkorName ? '#000000' : '#999999' }"
            >{{ param.checkorName ? param.checkorName : "请选择" }}</text
          >
               <text class="mr6"
                  :style="{ color: param.checkorName ? '#000000' : '#999999' }">{{ param.checkorName ? param.checkorName : "请选择" }}</text>
          <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
        </view>
      </view>
@@ -37,43 +42,23 @@
          <text>隐患类型</text>
        </view>
        <view class="value" @click="isShowType = true">
          <text
            class="mr6"
            :style="{ color: param.categoryName ? '#000000' : '#999999' }"
            >{{ param.categoryName ? param.categoryName : "请选择" }}</text
          >
               <text class="mr6"
                  :style="{ color: param.categoryName ? '#000000' : '#999999' }">{{ param.categoryName ? param.categoryName : "请选择" }}</text>
          <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
        </view>
      </view>
      <view class="upload_line">
        <view class="name">现场情况</view>
        <view class="wrap">
          <view
            class="adduser_list_item_ipt1_upload"
            @click="showUpload = true"
          >
               <view class="adduser_list_item_ipt1_upload" @click="showUpload = true">
            <u-icon name="plus" color="rgb(153, 153, 153)" size="20"></u-icon>
            <view class="mt6">图片/视频</view>
          </view>
          <view
            class="adduser_list_item_ipt1_upload"
            v-for="(item, i) in submitFileList"
            :key="i"
          >
            <u-icon
              class="close"
              size="20"
              name="close-circle-fill"
              color="red"
              @click="fileDel(i)"
            ></u-icon>
            <image
              v-if="item.type == 0"
              :src="item.fileurlFull"
              mode="widthFix"
            ></image
            ><video v-if="item.type == 1" :src="item.fileurlFull"></video
          ></view>
               <view class="adduser_list_item_ipt1_upload" v-for="(item, i) in submitFileList" :key="i">
                  <u-icon class="close" size="20" name="close-circle-fill" color="red" @click="fileDel(i)"></u-icon>
                  <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="empty"></view>
@@ -83,12 +68,8 @@
          <text>情况说明</text>
        </view>
        <view class="value">
          <textarea
            placeholder="请详细描述现场情况,不少于10个字"
            minlength="10"
            v-model="param.content"
            placeholder-style="color: #999999;"
          />
               <textarea placeholder="请详细描述现场情况,不少于10个字" minlength="10" v-model="param.content"
                  placeholder-style="color: #999999;" />
        </view>
      </view>
      <view class="empty"></view>
@@ -97,28 +78,16 @@
          <text></text>
          <text>提报人</text>
        </view>
        <view class="value"
          ><input
            type="text"
            disabled
            placeholder="请输入提报人"
            v-model="param.memberName"
            placeholder-style="color: #999999;"
        /></view>
            <view class="value"><input type="text" disabled placeholder="请输入提报人" v-model="param.memberName"
                  placeholder-style="color: #999999;" /></view>
      </view>
      <view class="line">
        <view class="label">
          <text></text>
          <text>联系电话</text>
        </view>
        <view class="value"
          ><input
            type="text"
            disabled
            placeholder="请输入联系电话"
            v-model="param.memberPhone"
            placeholder-style="color: #999999;"
        /></view>
            <view class="value"><input type="text" disabled placeholder="请输入联系电话" v-model="param.memberPhone"
                  placeholder-style="color: #999999;" /></view>
      </view>
      <view class="line">
        <view class="label">
@@ -126,49 +95,27 @@
          <text>提报时间</text>
        </view>
        <view class="value" @click="isShowTime = true">
          <text
            class="mr6"
            :style="{ color: param.submitTime ? '#000000' : '#999999' }"
            >{{ param.submitTime ? param.submitTime : "请选择" }}</text
          >
               <text class="mr6"
                  :style="{ color: param.submitTime ? '#000000' : '#999999' }">{{ param.submitTime ? param.submitTime : "请选择" }}</text>
          <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
        </view>
      </view>
      <view class="footer"
        ><view class="footer_btn" @click="onSubmit">提交</view></view
      >
         <view class="footer">
            <view class="footer_btn" @click="onSubmit">提交</view>
         </view>
    </view>
    <!--  -->
      <u-picker keyName="name" :show="isShowCompany" closeOnClickOverlay :columns="deptList" @confirm="seletedCompany"
         @close="isShowCompany = false" @cancel="isShowCompany = false"></u-picker>
    <!-- 区域 -->
    <u-picker
      keyName="name"
      :show="isShowArea"
      closeOnClickOverlay
      :columns="areaOptions"
      @confirm="seletedArea"
      @close="isShowArea = false"
      @cancel="isShowArea = false"
    ></u-picker>
    <u-picker
      keyName="name"
      :show="isShowType"
      closeOnClickOverlay
      :columns="areaType"
      @confirm="seletedType"
      @close="isShowType = false"
      @cancel="isShowType = false"
    ></u-picker>
      <u-picker keyName="name" :show="isShowArea" closeOnClickOverlay :columns="areaOptions" @confirm="seletedArea"
         @close="isShowArea = false" @cancel="isShowArea = false"></u-picker>
      <u-picker keyName="name" :show="isShowType" closeOnClickOverlay :columns="areaType" @confirm="seletedType"
         @close="isShowType = false" @cancel="isShowType = false"></u-picker>
    <!--  -->
    <u-datetime-picker
      :show="isShowTime"
      :minDate="new Date().getTime()"
      mode="datetime"
      closeOnClickOverlay
      @cancel="isShowTime = false"
      @close="isShowTime = false"
      @confirm="seletedDate"
    ></u-datetime-picker>
      <u-datetime-picker :show="isShowTime" :minDate="new Date().getTime()" mode="datetime" closeOnClickOverlay
         @cancel="isShowTime = false" @close="isShowTime = false" @confirm="seletedDate"></u-datetime-picker>
    <!--  -->
    <u-popup :show="showUpload" @close="showUpload = false" closeOnClickOverlay>
      <view class="upload_wrap">
@@ -183,7 +130,8 @@
import {
  uploadUrl,
  DangerCreate,
  DangerConfigType
      DangerConfigType,
      deptListPost
} from '@/api'
import dayjs from 'dayjs'
export default {
@@ -192,11 +140,13 @@
      param: {},
      submitFileList: [],
            isShowCompany: false,
      isShowArea: false,
      isShowType: false,
      isShowTime: false,
      showUpload: false,
            deptList: [],
      areaOptions: [],
      areaType: [],
    }
@@ -218,7 +168,14 @@
  },
  methods: {
    onSubmit() {
      const { param, submitFileList } = this
            const {
               param,
               submitFileList
            } = this
            if (!param.companyName) return uni.showToast({
               title: '请选择责任部门',
               icon: 'none'
            })
      if (!param.areaName) return uni.showToast({
        title: '请选择隐患区域',
        icon: 'none'
@@ -248,6 +205,20 @@
          this.$jump('/pages/staff/snapshotResult')
        }
      })
         },
         seletedCompany(e) {
            const item = e.value[0]
            this.$set(this.param, 'companyId', item.id)
            this.$set(this.param, 'companyName', item.name)
            this.$set(this.param, 'areaId', '')
            this.$set(this.param, 'areaName', '')
            DangerConfigType({
               type: '0',
               companyId: item.id
            }).then(res => {
               this.areaOptions = [res.data]
            })
            this.isShowCompany = false
    },
    seletedArea(e) {
      const item = e.value[0]
@@ -280,10 +251,17 @@
      this.isShowTime = false
    },
    initConfig() {
      DangerConfigType({ type: '1' }).then(res => {
            deptListPost({}).then(res => {
               this.deptList = [res.data]
            })
            DangerConfigType({
               type: '1'
            }).then(res => {
        this.areaType = [res.data]
      })
      DangerConfigType({ type: '0' }).then(res => {
            DangerConfigType({
               type: '0'
            }).then(res => {
        this.areaOptions = [res.data]
      })
    },
@@ -305,7 +283,10 @@
      uni.chooseImage({
        count: 4,
        success: (chooseImageRes) => {
          uni.showLoading({ title: '上传中', mask: true })
                  uni.showLoading({
                     title: '上传中',
                     mask: true
                  })
          const tempFilePaths = chooseImageRes.tempFilePaths
          let imgs = tempFilePaths.map((value, index) => {
            return {
@@ -355,7 +336,10 @@
      let token = uni.getStorageSync('token') || ''
      uni.chooseVideo({
        success: (chooseImageRes) => {
          uni.showLoading({ title: '上传中', mask: true })
                  uni.showLoading({
                     title: '上传中',
                     mask: true
                  })
          uni.uploadFile({
            url: `${uploadUrl}`,
            filePath: chooseImageRes.tempFilePath,
@@ -393,15 +377,18 @@
<style lang="scss">
.main_wrap {
  padding-bottom: 200rpx;
  .line {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1rpx solid #e5e5e5;
    padding: 30rpx 0;
    .label {
      font-size: 30rpx;
      font-weight: 400;
      text {
        &:nth-child(1) {
          color: #e42d2d;
@@ -409,6 +396,7 @@
        }
      }
    }
    .value {
      flex: 1;
      height: 100%;
@@ -416,6 +404,7 @@
      display: flex;
      align-items: center;
      justify-content: flex-end;
      input {
        width: 100%;
        height: 100%;
@@ -426,12 +415,15 @@
      }
    }
  }
  .upload_line {
    padding: 30rpx 0;
    .wrap {
      display: flex;
      flex-wrap: wrap;
    }
    .adduser_list_item_ipt1_upload {
      margin-top: 24rpx;
      width: 120rpx;
@@ -446,16 +438,19 @@
      align-items: center;
      justify-content: center;
      position: relative;
      .close {
        position: absolute;
        right: -20rpx;
        top: -20rpx;
        z-index: 9999;
      }
      image {
        width: 100%;
        height: 100%;
      }
      video {
        width: 100%;
        max-height: 120rpx;
@@ -463,14 +458,17 @@
    }
  }
}
.upload_wrap {
  width: 100%;
  .btn {
    height: 90rpx;
    line-height: 90rpx;
    text-align: center;
  }
}
.footer {
  width: 100%;
  padding: 0 30rpx;
@@ -491,6 +489,7 @@
    color: #ffffff;
  }
}
.empty {
  width: 750rpx;
  height: 20rpx;