‘’

liukangdong

2024-06-19 e2b173475a8bf14717a53f2daa0257804644bd45

‘’

 admin/src/components/operation/HiddenDangerParam.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,275 @@
<template>
  <GlobalWindow
    title="新增隐患随手拍"
    width="600px"
    :visible.sync="isShowModal"
    :confirm-working="isWorking"
    @confirm="confirm"
  >
    <el-form :model="param" ref="paramRef" :rules="rules">
      <el-form-item label="提报人" prop="realname">
        <div>{{ userInfo.realname }}</div>
      </el-form-item>
      <el-form-item label="联系电话" prop="mobile">
        {{ userInfo.mobile }}
      </el-form-item>
      <el-form-item label="提报时间" prop="submitTime">
        <el-date-picker
          v-model="param.submitTime"
          format="yyyy-MM-dd HH:mm"
          value-format="yyyy-MM-dd HH:mm:ss"
          type="datetime"
          default-time="08:00:00"
        />
      </el-form-item>
      <el-form-item label="隐患区域" prop="areaId">
        <el-select v-model="param.areaId" @change="changeArea" placeholder="请选择">
          <el-option
            v-for="item in addrList"
            :key="item.id"
            :label="item.name"
            :value="item.id"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="处理人" prop="checkUserId">
        <el-select v-model="param.checkUserId" placeholder="请选择">
          <el-option
            v-for="item in memberList"
            :key="item.id"
            :label="item.name"
            :value="item.id"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="隐患类型" prop="cateId">
        <el-select v-model="param.cateId" placeholder="请选择">
          <el-option
            v-for="item in typeList"
            :key="item.id"
            :label="item.name"
            :value="item.id"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="现场情况">
        <div class="file_list">
          <el-upload
            class="avatar-uploader"
            :data="uploadData"
            :auto-upload="true"
            :action="uploadImgUrl"
            :show-file-list="false"
            :on-success="uploadAvatarSuccess"
            :before-upload="beforeUpload"
          >
            <div class="upload_wrap">
              <i class="el-icon-plus avatar-uploader-icon"></i>
              <div>图片/视频</div>
            </div>
          </el-upload>
          <div v-for="(item, i) in fileList" :key="i" class="item">
            <i @click="handleDelImg(i)" class="el-icon-error close"></i>
            <el-image
              :src="item.fileurlFull"
              :preview-src-list="[item.fileurlFull]"
              v-if="item.type == 0"
              class="img"
            ></el-image>
            <video
              :src="item.fileurlFull"
              controls
              v-if="item.type == 1"
              class="img"
            ></video>
          </div>
        </div>
      </el-form-item>
      <el-form-item label="情况说明" prop="content">
        <el-input
          type="textarea"
          :rows="4"
          v-model="param.content"
          placeholder="请输入"
        ></el-input>
      </el-form-item>
    </el-form>
  </GlobalWindow>
</template>

<script>
import BaseOpera from '@/components/base/BaseOpera'
import GlobalWindow from '@/components/common/GlobalWindow'
import UploadFaceImg from '@/components/common/UploadFaceImg'
import { allList, memberList } from '@/api/business/hiddenDangerParam'
import { create } from '@/api/business/hiddenDanger'
export default {
  name: 'OperaVisitsHkWindow',
  extends: BaseOpera,
  components: {
    GlobalWindow
  },
  data () {
    return {
      isShowModal: false,
      param: {},
      userInfo: this.$store.state.userInfo,
      uploadImgUrl: process.env.VUE_APP_API_PREFIX + '/visitsAdmin/cloudService/public/uploadBatch',
      typeList: [],
      addrList: [],
      memberList: [],
      fileList: [],

      uploadData: {
        folder: 'HIDDEN_DANGER_FILE'
      },
      rules: {
        // starttime: [{ required: true, message: '请选择日期', trigger: 'change' }],
        areaId: [{ required: true, message: '请选择', trigger: 'change' }],
        cateId: [{ required: true, message: '请选择', trigger: 'change' }],
        checkUserId: [{ required: true, message: '请选择', trigger: 'change' }],
        faceImgUrl: [{ required: true, message: '请上传', trigger: 'change' }],

        content: [{ required: true, message: '请输入', trigger: 'blur' }]
      }
    }
  },
  created () {
    this.initData()
  },
  methods: {
    initData () {
      allList({ type: 1 }).then(res => { // ç±»åž‹
        this.typeList = res || []
      })
      allList({ type: 0 }).then(res => { // ä½ç½®
        this.addrList = res || []
      })
      memberList({}).then(res => {
        this.memberList = res || []
      })
    },
    changeArea (e) {
      const item = this.addrList.find(i => i.id === e)
      const arr = []
      const memberIds = item.memberIds.split(',')
      const memberNames = item.memberNames.split(',')
      if (memberIds && memberIds.length === 1) {
        this.$set(this.param, 'checkUserId', memberIds[0])
      }
      memberIds.forEach((mem, i) => {
        arr.push({
          id: memberIds[i],
          name: memberNames[i]
        })
      })
      this.memberList = arr
    },
    beforeUpload (file) {
      if (['video/mp4', 'video/ogg', 'video/flv', 'video/avi', 'video/wmv', 'video/rmvb', 'image/jpeg', 'image/png', 'image/gif'].indexOf(file.type) == -1) {
        this.$message.error('请上传正确的视频/图片格式')
        return false
      }
    },
    uploadAvatarSuccess (file) {
      console.log('file', file)
      const item = file.data[0]
      if (['.mp4', '.avi', '.flv', '.wmv'].indexOf(item.imgaddr) === -1) {
        this.fileList.push({
          type: 0,
          fileurl: item.imgaddr,
          fileurlFull: item.url
        })
      } else {
        this.fileList.push({
          type: 1,
          fileurl: item.imgaddr,
          fileurlFull: item.url
        })
      }
      console.log('file', this.fileList)
      // this.$set(this.param, 'faceImg', file.imgurl)
      // this.$set(this.param, 'faceImgUrl', file.imgurlfull)
    },
    handleDelImg (i) {
      this.fileList.splice(i, 1)
    },
    // åŒæ­¥ä¿¡æ¯
    confirm () {
      this.$refs.paramRef.validate((valid) => {
        if (!valid) {
          return
        }
        // è°ƒç”¨æ–°å»ºæŽ¥å£
        this.isWorking = true
        create({
          ...this.param,
          applyCheckUserId: this.param.checkUserId,
          submitFileList: this.fileList,
          memberId: this.userInfo.memberId
        })
          .then(() => {
            this.visible = false
            this.$tip.apiSuccess('提交成功')
            this.$emit('success')
            this.$emit('close')
          })
          .finally(() => {
            this.isWorking = false
          })
      })
    }
  }
}
</script>
<style lang="scss" scoped>
$image-width: 90px;
.avatar-uploader {
  width: $image-width !important;
  height: $image-width;
  margin-bottom: 30px;
  .upload_wrap {
    width: 90px;
    height: 90px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    color: #999999;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409eff;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    text-align: center;
  }
}
.file_list {
  display: flex;
  flex-wrap: wrap;
  .item {
    width: 90px;
    max-height: 90px;
    margin-left: 10px;
    position: relative;
    .close{
      font-size: 20px;
      position: absolute;
      right: -10px;
      top: -10px;
      z-index: 111;
      color: red;
      cursor: pointer;
    }
    .img {
      width: 90px;
      max-height: 90px;
    }
  }
}
</style>

 admin/src/views/operation/danger/record.vue

@@ -60,8 +60,9 @@
    </el-form>
    <!-- è¡¨æ ¼å’Œåˆ†é¡µ -->
    <template v-slot:table-wrap>
      <ul class="toolbar" v-permissions="['business:empower:create', 'business:empower:delete']">
        <!--<li><el-button type="primary" v-permissions="['business:empower:exportExcel']" @click="exportExcel">导出</el-button></li> -->
      <ul class="toolbar" v-permissions="['business:hiddendanger:create', 'business:hiddendanger:exportExcel']">
        <li><el-button type="primary" icon="el-icon-plus" v-permissions="['business:hiddendanger:create']" @click="handleEdit">新建</el-button></li>
        <li><el-button type="primary" v-permissions="['business:hiddendanger:exportExcel']" @click="handleEx">导出</el-button></li>
      </ul>
      <el-table
          v-loading="isWorking.search"
@@ -101,6 +102,8 @@
      </pagination>
    </template>
    <OperaHiddenDangerWindow ref="OperaHiddenDangerWindow" @success="handlePageChange"/>
    <!-- æ–°å»º -->
    <HiddenDangerParam @close="isShowEdit = false" @success="search"  v-if="isShowEdit" ref="HiddenDangerParamRef" />
  </TableLayout>
</template>

@@ -109,14 +112,16 @@
import TableLayout from '@/layouts/TableLayout'
import Pagination from '@/components/common/Pagination'
import OperaHiddenDangerWindow from '@/components/business/OperaHiddenDangerWindow'
import HiddenDangerParam from '@/components/operation/HiddenDangerParam.vue'
import { timeForMat } from '@/utils/util'
import { allList } from '@/api/business/hiddenDangerParam'
import { allList, exportExcel } from '@/api/business/hiddenDangerParam'
export default {
  name: 'Empower',
  extends: BaseTable,
  components: { TableLayout, Pagination ,OperaHiddenDangerWindow},
  components: { TableLayout, Pagination ,OperaHiddenDangerWindow, HiddenDangerParam},
  data () {
    return {
      isShowEdit: false,
      // æœç´¢
      searchForm: {
        memberName: '',
@@ -145,6 +150,32 @@
    this.loadParams()
  },
  methods: {
    handleEx () {
      this.$dialog.exportConfirm('确认导出吗？')
        .then(() => {
          this.exLoading = true
          exportExcel({
            page: this.pagination.page,
            capacity: 1000000,
            model: this.filters
          })
            .then(response => {
              this.download(response)
            })
            .catch(e => {
              this.$tip.apiFailed(e)
            })
            .finally(() => {
              this.exLoading = false
            })
        })
    },
    handleEdit () {
      this.isShowEdit = true
      this.$nextTick(() => {
        this.$refs.HiddenDangerParamRef.isShowModal = true
      })
    },
    changeRadio (e) {
      this.searchForm.radio = e
      if (e === '0') {

 h5/pages/staff/snapshot.vue

@@ -125,7 +125,7 @@
          <text
            class="mr6"
            :style="{ color: param.submitTime ? '#000000' : '#999999' }"
            >{{ param.submitTime ? param.submitTime : "请选择" }}</text
            >{{ param.submitTime ? param.submitTime.slice(0, 16) : "请选择" }}</text
          >
          <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
        </view>