detail

src/apps/AppEpidemicSituation/ErrorDetail.vue

@@ -1,11 +1,11 @@
 <template>
   <div class="ErrorDetail">
     <div class="header">
-      <div class="name">李维民<span>15220171897</span><img :src="$cdn + 'common/phone.png'" alt="" @click="callPhone('112')" class="phone-icon" ></div>
+      <div class="name">李维民<span>15220171897</span><img :src="$cdn + 'common/phone.png'" alt="" @click="callPhone('112')" class="phone-icon" /></div>
       <p>身份证号：</p>
-      <p class="mar-b8" style="color:#333;">4223241900****0014</p>
+      <p class="mar-b8" style="color: #333">4223241900****0014</p>
       <p>异常情况：</p>
-      <p style="color:#FF4466;">体温38℃有咳嗽 , 未去高风险区域</p>
+      <p style="color: #ff4466">体温38℃有咳嗽 , 未去高风险区域</p>
     </div>
     <div class="info">
       <div class="title">异常情况记录</div>
@@ -26,7 +26,7 @@
     </div>
     <div class="bg-line"></div>
     <div class="footer">
-      <div class="add" @click="show=true">新增记录</div>
+      <div class="add" @click="show = true">新增记录</div>
       <div class="confirm">解除异常</div>
     </div>
     <u-popup v-model="show" mode="bottom">
@@ -51,9 +51,15 @@ export default {
   data() {
     return {
       show: false,
-      value: ''
+      value: '',
     }
   },
+  computed: {
+    ...mapState(['user']),
+  },
+  onShow() {
+    document.title = '异常情况处理'
+  },
   methods: {},
 }
 </script>
@@ -61,75 +67,75 @@ export default {
 <style scoped lang="scss">
 .ErrorDetail {
   height: 100%;
-  .header{
+  .header {
     padding: 32px 48px;
     box-sizing: border-box;
     background-color: #fff;
     margin-bottom: 24px;
-    .name{
+    .name {
       font-size: 36px;
       font-family: PingFangSC-Medium, PingFang SC;
       font-weight: 500;
       color: #333;
       line-height: 50px;
       margin-bottom: 16px;
-      span{
+      span {
         font-size: 32px;
         font-family: PingFangSC-Medium, PingFang SC;
         font-weight: 500;
-        color: #4181FF;
+        color: #4181ff;
         line-height: 44px;
         margin: 0 20px 0 32px;
       }
-      img{
+      img {
         width: 32px;
         height: 32px;
         vertical-align: middle;
       }
     }
-    p{
+    p {
       font-size: 30px;
       font-family: PingFangSC-Regular, PingFang SC;
       color: #999;
       line-height: 42px;
       color: #999;
     }
-    .mar-b8{
+    .mar-b8 {
       margin-bottom: 8px;
     }
   }
-  .info{
+  .info {
     padding: 0 32px 32px;
     background-color: #fff;
-    .title{
+    .title {
       font-size: 38px;
       font-family: PingFangSC-Semibold, PingFang SC;
       font-weight: 600;
       color: #333;
       line-height: 116px;
     }
-    .error-list{
-      .item{
+    .error-list {
+      .item {
         width: 100%;
-        background: #F4F7FE;
+        background: #f4f7fe;
         border-radius: 8px;
         padding: 24px 24px 18px 24px;
         box-sizing: border-box;
         margin-bottom: 16px;
-        p{
+        p {
           font-size: 28px;
           font-family: PingFangSC-Regular, PingFang SC;
-          color: #343D65;
+          color: #343d65;
           line-height: 40px;
           word-break: break-all;
           margin-bottom: 12px;
         }
-        div{
+        div {
           font-size: 24px;
           font-family: PingFangSC-Regular, PingFang SC;
           color: #666;
           line-height: 34px;
-          span{
+          span {
             display: inline-block;
             margin-left: 32px;
           }
@@ -137,7 +143,7 @@ export default {
       }
     }
   }
-  .footer{
+  .footer {
     position: fixed;
     bottom: 0;
     left: 0;
@@ -148,31 +154,31 @@ export default {
     display: flex;
     font-size: 36px;
     font-family: PingFangSC-Regular, PingFang SC;
-    .add{
+    .add {
       flex: 1;
       color: #333;
     }
-    .confirm{
+    .confirm {
       flex: 2;
       color: #fff;
-      background: #1365DD;
+      background: #1365dd;
     }
-    div{
+    div {
       text-align: center;
     }
   }
-  .bg-line{
+  .bg-line {
     width: 100%;
     height: 130px;
   }
-  .textarea{
+  .textarea {
     margin: 32px 32px 24px;
     width: calc(100% - 64px);
     padding: 16px;
     box-sizing: border-box;
-    background: #F7F7F7;
+    background: #f7f7f7;
     border-radius: 8px;
-    p{
+    p {
       font-size: 26px;
       font-family: PingFangSC-Regular, PingFang SC;
       color: #999;
@@ -180,26 +186,26 @@ export default {
       text-align: right;
     }
   }
-  .btn{
+  .btn {
     padding: 0 32px 24px;
     height: 64px;
     display: flex;
     justify-content: space-between;
-    span{
+    span {
       display: inline-block;
       line-height: 64px;
       font-size: 26px;
       font-family: PingFangSC-Regular, PingFang SC;
       color: #666;
     }
-    .confirm{
+    .confirm {
       width: 144px;
       text-align: center;
-      background: #1365DD;
+      background: #1365dd;
       border-radius: 32px;
       font-size: 28px;
       font-family: PingFangSC-Regular, PingFang SC;
-      color: #FFF;
+      color: #fff;
     }
   }
 }