已关闭的事件没有显示区域地点

src/views/closed.vue

@@ -5,28 +5,36 @@
       <div v-if="model.incident" class="conent">
         <div class="navBar">
           <div class="fl">
-            <a :class="{active:actives=='info'}" href="javascript:;" @click="toInfo('info')">事件信息</a>
+            <a
+              :class="{ active: actives == 'info' }"
+              href="javascript:;"
+              @click="toInfo('info')"
+              >事件信息</a
+            >
           </div>
           <div class="fl">
             <a
-              :class="{active:actives=='handlerInfo'}"
+              :class="{ active: actives == 'handlerInfo' }"
               href="javascript:;"
               @click="toInfo('handlerInfo')"
-            >处理信息</a>
+              >处理信息</a
+            >
           </div>
           <div class="fl">
             <a
-              :class="{active:actives=='closeInfo'}"
+              :class="{ active: actives == 'closeInfo' }"
               href="javascript:;"
               @click="toInfo('closeInfo')"
-            >关单信息</a>
+              >关单信息</a
+            >
           </div>
           <div class="fl">
             <a
-              :class="{active:actives=='progress'}"
+              :class="{ active: actives == 'progress' }"
               href="javascript:;"
               @click="toInfo('progress')"
-            >处理进度</a>
+              >处理进度</a
+            >
           </div>
         </div>
 
@@ -35,13 +43,15 @@
           <div class="head">
             <p>
               <i class="iconfont icon-zuixinbaoxiu newPapir"></i>
-              事件编号：{{model.incident.incidentsign}}
-              <span class="fr btn yiguanbi">{{model.incident.state.name}}</span>
+              事件编号：{{ model.incident.incidentsign }}
+              <span class="fr btn yiguanbi">{{
+                model.incident.state.name
+              }}</span>
             </p>
           </div>
           <p>
             <span class="fl">事件分类</span>
-            <span class="fr">{{model.incident.category.category}}</span>
+            <span class="fr">{{ model.incident.category.category }}</span>
           </p>
           <!-- <p>
             <span class="fl">事件主题</span>
@@ -49,32 +59,37 @@
           </p> -->
           <p class="desc">
             <span class="fl">事件描述</span>
-            <span class="fr grayFont" v-html="model.incident.description"></span>
+            <span
+              class="fr grayFont"
+              v-html="model.incident.description"
+            ></span>
           </p>
           <div class="shows" id="shows">
-            <p v-if="valConfig==2">
+            <p v-if="valConfig == 2">
               <span class="fl">报修科室</span>
-              <span class="fr">{{model.incident.department?model.incident.department.dept:''}}</span>
+              <span class="fr">{{
+                model.incident.department ? model.incident.department.dept : ""
+              }}</span>
             </p>
-            <p v-if="valConfig==1">
+            <p v-if="valConfig == 1">
               <span class="fl">报修人</span>
-              <span class="fr">{{model.incident.requester.name}}</span>
+              <span class="fr">{{ model.incident.requester.name }}</span>
             </p>
-            <p v-if="valConfig==2">
+            <p v-if="valConfig == 2">
               <span class="fl">联系人</span>
-              <span class="fr">{{model.incident.contacts}}</span>
+              <span class="fr">{{ model.incident.contacts }}</span>
             </p>
             <p>
               <span class="fl">联系电话</span>
-              <span class="fr">{{model.incident.contactsInformation}}</span>
+              <span class="fr">{{ model.incident.contactsInformation }}</span>
             </p>
             <p>
               <span class="fl">联系地址</span>
-              <span class="fr">{{model.incident.houseNumber||''}}</span>
+              <span class="fr">{{ model.incident.houseNumber || "" }}</span>
             </p>
             <p class="boeder_B">
               <span class="fl">事件来源</span>
-              <span class="fr">{{model.incident.source.name}}</span>
+              <span class="fr">{{ model.incident.source.name }}</span>
             </p>
             <!-- <p>
               <span class="fl">影响度</span>
@@ -86,26 +101,56 @@
             </p> -->
             <p>
               <span class="fl">优先级</span>
-              <span class="fr">{{model.incident.priority?model.incident.priority.name:''}}</span>
+              <span class="fr">{{
+                model.incident.priority ? model.incident.priority.name : ""
+              }}</span>
             </p>
             <p>
               <span class="fl">逾期响应时间</span>
-              <span class="fr">{{model.incident.overdueResponseDate}}</span>
+              <span class="fr">{{ model.incident.overdueResponseDate }}</span>
             </p>
             <p>
               <span class="fl">逾期解决时间</span>
-              <span class="fr">{{model.incident.overdueTime}}</span>
+              <span class="fr">{{ model.incident.overdueTime }}</span>
+            </p>
+            <p>
+              <span class="fl">区域</span>
+              <span class="fr">{{
+                model.incident.place ? model.incident.place.area.area : "--"
+              }}</span>
+            </p>
+            <p>
+              <span class="fl">地点</span>
+              <span class="fr">{{
+                model.incident.place ? model.incident.place.place : "--"
+              }}</span>
             </p>
           </div>
           <p class="info_hide">
-            <span class="fl hide" @click="hides()" v-if="!item_hides">展开详情 >></span>
-            <span class="fl hide" @click="hides()" v-if="item_hides">隐藏详情<<</span>
+            <span class="fl hide" @click="hides()" v-if="!item_hides"
+              >展开详情 >></span
+            >
+            <span class="fl hide" @click="hides()" v-if="item_hides"
+              >隐藏详情<<</span
+            >
           </p>
           <div class="imgs-container" v-if="imgs.length">
             <div class="imgs-cont">
-              <img v-if='img.suffix=="jpeg"||img.suffix=="jpg"||img.suffix=="gif"||img.suffix=="png"||img.suffix=="svg"||img.suffix=="pdf"' :src="img.previewUrl" v-for="(img, index) in imgs" class="imgs">
+              <img
+                v-if="
+                  img.suffix == 'jpeg' ||
+                    img.suffix == 'jpg' ||
+                    img.suffix == 'gif' ||
+                    img.suffix == 'png' ||
+                    img.suffix == 'svg' ||
+                    img.suffix == 'pdf'
+                "
+                :src="img.previewUrl"
+                v-for="(img, index) in imgs"
+                class="imgs"
+              />
               <p v-else>
-                <a :href='[img.previewUrl]'>{{img.name}}</a>
+                <a :href="[img.previewUrl]">{{ img.name }}</a>
               </p>
             </div>
           </div>
@@ -121,68 +166,94 @@
           </p> -->
           <p>
             <span class="fl">处理方式</span>
-            <span
-              class="fr showwrap"
-            >{{model.incident.handleCategory?model.incident.handleCategory.name:''}}</span>
+            <span class="fr showwrap">{{
+              model.incident.handleCategory
+                ? model.incident.handleCategory.name
+                : ""
+            }}</span>
           </p>
           <div class="shows1" id="shows1">
             <p>
               <span class="fl">确认事件分类</span>
-              <span class="fr">{{model.incident.category.category}}</span>
+              <span class="fr">{{ model.incident.category.category }}</span>
             </p>
             <p>
               <span class="fl">关闭代码</span>
-              <span class="fr">{{model.incident.closecode?model.incident.closecode.name:''}}</span>
+              <span class="fr">{{
+                model.incident.closecode ? model.incident.closecode.name : ""
+              }}</span>
             </p>
             <p class="desc">
               <span class="fl">处理方案</span>
-              <span class="fr grayFont" v-html="model.incident.handleDescription"></span>
+              <span
+                class="fr grayFont"
+                v-html="model.incident.handleDescription"
+              ></span>
             </p>
           </div>
           <p class="info_hide">
-            <span class="fl hide" @click="hides1()" v-if="!item_hides1">展开详情 >></span>
-            <span class="fl hide" @click="hides1()" v-if="item_hides1">隐藏详情<<</span>
+            <span class="fl hide" @click="hides1()" v-if="!item_hides1"
+              >展开详情 >></span
+            >
+            <span class="fl hide" @click="hides1()" v-if="item_hides1"
+              >隐藏详情<<</span
+            >
           </p>
 
           <div class="label" id="closeInfo">关单信息</div>
           <p>
             <span class="fl">是否已解决</span>
-            <span class="fr">{{model.isclose=='close'?'已解决':'未解决'}}</span>
+            <span class="fr">{{
+              model.isclose == "close" ? "已解决" : "未解决"
+            }}</span>
           </p>
           <p>
             <span class="fl">结果类型</span>
-            <span class="fr">{{model.incident.handleResult?model.incident.handleResult.name:''}}</span>
+            <span class="fr">{{
+              model.incident.handleResult
+                ? model.incident.handleResult.name
+                : ""
+            }}</span>
           </p>
           <p>
             <span class="fl">满意度评价</span>
-            <span class="fr">{{model.incident.degree?model.incident.degree.name:''}}</span>
+            <span class="fr">{{
+              model.incident.degree ? model.incident.degree.name : ""
+            }}</span>
           </p>
           <p>
             <span class="fl">回访备注</span>
-            <span class="fr">{{model.incident.visitRemarks||''}}</span>
+            <span class="fr">{{ model.incident.visitRemarks || "" }}</span>
           </p>
 
           <div class="label" id="progress">处理进度</div>
-          <div :class="{'progress':true,'progressHide':!pro_hides}" id="progressBox">
+          <div
+            :class="{ progress: true, progressHide: !pro_hides }"
+            id="progressBox"
+          >
             <div class="progress_info" v-for="item in progressInfo">
-              <div class="progress_info_L">{{item.activityName}}</div>
+              <div class="progress_info_L">{{ item.activityName }}</div>
               <div class="progress_info_R">
                 <div class="time">
                   <i
-                    :class="{'iconfont':true, 'icon-icon_weizuo':item.endTime!='','icon-icon_zhengzaijinx':item.endTime=='' }"
+                    :class="{
+                      iconfont: true,
+                      'icon-icon_weizuo': item.endTime != '',
+                      'icon-icon_zhengzaijinx': item.endTime == ''
+                    }"
                   ></i>
-                  <span class="text1">{{item.startTime}}</span>
+                  <span class="text1">{{ item.startTime }}</span>
                 </div>
-                <div
-                  :class="{'cont':true,'blue':item.endTime!='' }"
-                >
-                  <p class="text2" v-if="item.desc">{{item.desc}}</p>
+                <div :class="{ cont: true, blue: item.endTime != '' }">
+                  <p class="text2" v-if="item.desc">{{ item.desc }}</p>
                 </div>
               </div>
             </div>
           </div>
           <p class="info_hide">
-            <span class="fl hide" @click="proHides()">{{pro_hides?'隐藏详情 <<':'展开详情 >>'}}</span>
+            <span class="fl hide" @click="proHides()">{{
+              pro_hides ? "隐藏详情 <<" : "展开详情 >>"
+            }}</span>
           </p>
         </div>
       </div>
@@ -195,7 +266,7 @@ import LoadIng from "./../views/loading.vue";
 export default {
   data() {
     return {
-      id:'',
+      id: "",
       loginUser: JSON.parse(localStorage.getItem("loginUser")),
       valConfig: JSON.parse(localStorage.getItem("valConfig")) - 0, //报修主体
       selected: 1,
@@ -217,7 +288,7 @@ export default {
       progressInfo: [], //处理进度
       imgs: [], //图片
       model: {}, //提交数据
-      pro_hides:false,//展开/收起处理进度
+      pro_hides: false //展开/收起处理进度
     };
   },
   components: {
@@ -232,14 +303,16 @@ export default {
           "/service/form/renderForm/receiveform/" +
             that.processInstanceId +
             "/" +
-            that.loginUser.id+'/'+that.id,
+            that.loginUser.id +
+            "/" +
+            that.id,
           {}
         )
         .then(function(res) {
           console.log(res.data);
           that.model = res.data.model;
           //seimin
-          localStorage.setItem('modelData',JSON.stringify(that.model))
+          localStorage.setItem("modelData", JSON.stringify(that.model));
         });
     },
     // 获取图片
@@ -278,13 +351,15 @@ export default {
     },
 
     // 处理进度隐藏/展开
-    proHides(){
-      if(!this.pro_hides){
-        $('#progressBox').animate({'height':$('#progressBox')[0].scrollHeight})
-      }else{
-        $('#progressBox').animate({'height':'1.7rem'})
+    proHides() {
+      if (!this.pro_hides) {
+        $("#progressBox").animate({
+          height: $("#progressBox")[0].scrollHeight
+        });
+      } else {
+        $("#progressBox").animate({ height: "1.7rem" });
       }
-      this.pro_hides=!this.pro_hides;
+      this.pro_hides = !this.pro_hides;
     },
     //隐藏显示详情
     hides1() {
@@ -311,7 +386,9 @@ export default {
       ? this.$route.params.data.processInstanceId
       : JSON.parse(localStorage.getItem("modelData")).incident
           .processInstanceId;
-          this.id=this.$route.params.data?this.$route.params.data.id:JSON.parse(localStorage.getItem("modelData")).incident.id;
+    this.id = this.$route.params.data
+      ? this.$route.params.data.id
+      : JSON.parse(localStorage.getItem("modelData")).incident.id;
     this.getParamsData();
     this.getProgressInfo();
     this.getImgs();
@@ -411,15 +488,15 @@ i.iconfont {
       .boeder_B {
         border-bottom: 0.01rem solid #ccc;
       }
-         p {
-          &.desc{
-            overflow: hidden;
-          }
-          .grayFont {
-            width: 75%;
-            text-align: right;
-            overflow-x: scroll;
-          }
+      p {
+        &.desc {
+          overflow: hidden;
+        }
+        .grayFont {
+          width: 75%;
+          text-align: right;
+          overflow-x: scroll;
+        }
       }
       .bottom {
         overflow: hidden;
@@ -457,14 +534,14 @@ i.iconfont {
             color: #00559d;
           }
         }
-        .imgs-container{
-          a{
-            color:#03c !important;
-            &:visited{
+        .imgs-container {
+          a {
+            color: #03c !important;
+            &:visited {
               color: #551a8b !important;
             }
           }
-           img {
+          img {
             width: 1.5rem;
             height: 1.5rem;
             margin-right: 0.7rem;
@@ -476,17 +553,17 @@ i.iconfont {
         .progress {
           padding: 0.2rem 0.2rem;
           overflow: hidden;
-          transition-duration: .2s;
+          transition-duration: 0.2s;
           transition-timing-function: linear;
-          &.progressHide{
+          &.progressHide {
             height: 1.7rem;
           }
           .progress_info {
             overflow: hidden;
             margin-bottom: 0.1rem;
-            &:nth-last-child(1){
-              .cont{
-                border:none !important;
+            &:nth-last-child(1) {
+              .cont {
+                border: none !important;
               }
             }
             .progress_info_L {