HS_MZAP/src/views/activityMan/securityFacilitiesErr/securityFacilitiesErrInfo.vue

<template>
  <van-nav-bar
      fixed
      title="安防设施异常情况"
      left-text=""
      left-arrow
      @click-left="onClickLeft"
      :style="{ 'background-color': selectColor }"
    />
    <van-loading size="16px" v-show="isLoading">加载中...</van-loading>

    <div class="main" v-show="!isLoading">
      <div class="banner">
        <img src="../../../../public/loginbg/banner.jpg" alt="" />
      </div>
      <div class="info">
        <p class="miniTitle">详细信息</p>
        
        <van-cell-group>
          <van-field
            v-model="info.siteName.name"
            readonly
            label="场所名称:"
            input-align="right"
          />
        </van-cell-group>
        <van-cell-group>
          <van-field
            v-model="info.facilityTypeName"
            center
            readonly
            label="设施类型:"
            input-align="right"
          />
        </van-cell-group>
        <van-cell-group v-if="info.facilityType=='1'">
          <van-field
            v-model="info.siteFireProtection.name"
            center
            readonly
            label="场所消防点位:"
            input-align="right"
          />
        </van-cell-group>
        <van-cell-group v-else>
          <van-field
            v-model="info.videoAudioPoint.name"
            center
            readonly
            label="视频音频点位:"
            input-align="right"
          />
        </van-cell-group>
        <van-cell-group>
          <van-field
            v-model="info.position"
            center
            readonly
            clearable
            label="位置:"
            input-align="right"
          />
          <template #right-icon>
            <van-icon name="location" />
          </template>
        </van-cell-group>
        
        <van-cell-group>
          <van-field
            name="uploader"
            readonly
            label="附件:"
            input-align="right"
          >
            <template #input>
              <span v-show="fileList.length == 0">无</span>
              <van-uploader
                v-show="fileList.length != 0"
                v-model="fileList"
                :max-count="fileList.length"
                capture="camera"
                accept=""
              >
              </van-uploader>
            </template>
          </van-field>
        </van-cell-group>
        <van-cell-group>
          <van-field
            v-model="info.abnormalContent"
            center
            readonly
            label="异常内容:"
            input-align="right"
          />
        </van-cell-group>  
      </div>
      <van-button
        v-if="info.assessment == 0"
        type="primary"
        class="btn-sub"
        @click="update"
        >审核</van-button
      >
    </div> 
  </template>
    
    <script>
  import { ref, onMounted } from "vue";
  import securityFacilitiesErrService from "@/api/securityFacilitiesErr/securityFacilitiesErrService";
  import UserManage from "@/api/user/UserManage";
  import { useRoute } from "vue-router";
  import $base from "@/utils/config";
  export default {
    setup() {
      // 导航栏颜色
      const selectColor = ref(window.localStorage.getItem("MZ_COLOR"));
      const onClickLeft = () => {
        history.back();
      };
      // 加载
      let isLoading = ref(true);
      // 活动信息
      const info = ref({     
        siteName:{id:'',name:""},
        siteFireProtection:{id:'',name:""},
        videoAudioPoint:{id:'',name:""}
      });
      // 文件
      let fileList = ref([]);
      let route = useRoute();
      onMounted(() => {
        new securityFacilitiesErrService().queryById(route.query.id).then((data) => {
          info.value = data;  
          if(info.value.facilityType=='1'){
            info.value.facilityTypeName="消防设备";
          }else{
            info.value.facilityTypeName="监控、音频";
          }

          info.value.enclosure.split("|").forEach((item) => {
            if (item.trim().length > 0) {
              fileList.value.push({
                name: decodeURIComponent(item.substring(item.lastIndexOf("/") + 1)),
                url: $base + item.replace('程序附件//','程序附件/'),
              });
            }
          });
          isLoading.value = false;
        });
      });

      // 审核通过
      const update = () => {
        isLoading.value = true;
        info.value.assessment = 1;
        new securityFacilitiesErrService().save(info.value).then((res) => {

          isLoading.value = false;
          window.xm.showToast({
             message:"审核成功!"
          })
          history.back();
        });
      };
      return {
        // 导航栏颜色
        selectColor,
        onClickLeft,
        info,
        fileList,
        isLoading,
        update,
      };
    },
  };
  </script>
    
  <style lang="less">
    .van-cell__value .van-field__right-icon .van-icon-location {
    color: #36a7f3 !important;
  }
  .btn-sub {
    width: 90%;
    border-radius: 20px;
    margin-left: 5%;
    margin-bottom: 40px;
    margin-top: -100px;
  }
  .van-loading {
    text-align: center;
    margin-top: 80px;
  }
  .van-popup--center {
    width: 98% !important;
  }
  </style>