村民圈审核

src/apps/AppIntegralAudit/detail.vue

@@ -8,7 +8,7 @@
       <div class="detail-area">
         <div class="time">2020-05-06 13:45</div>
         <div class="address">
-          <img src="" alt="" class="addr-img">
+          <img src="./img/address.png" alt="">
           <div>新港镇三联村</div>
         </div>
       </div>
@@ -176,15 +176,15 @@ export default {
       display: flex;
       color: #999999;
       font-size: 22px;
-      margin-top: 15px;
+      margin: 15px 0;
 
       .address {
         display: flex;
         margin-left: 30px;
 
-        .addr-img {
-          width: 50px;
-          height: 50px;
+        img {
+          width: 32px;
+          height: 32px;
         }
       }
     }

src/apps/AppVillagersCircle/Reject.vue

@@ -0,0 +1,76 @@
+<template>
+  <div class="Reject">
+    <div class="text-area">
+      <div class="title">不通过理由</div>
+      <textarea placeholder="请输入" maxlength="200"></textarea>
+    </div>
+    <div class="footer" @click="submit">
+      <div class="btn">保存</div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "Reject",
+  data() {
+    return {
+      value: '',
+    };
+  },
+  onShow() {
+    document.title = '村民圈审核'
+  },
+  onLoad(option) {
+    // this.id = option.id
+  },
+  methods: {
+    submit() {
+
+    }
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.Reject {
+  .text-area{
+    padding: 34px 32px;
+    background-color: #fff;
+    .title{
+      font-size: 32px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      color: #333;
+      line-height: 44px;
+      margin-bottom: 32px;
+    }
+    textarea{
+      width: 100%;
+      height: 500px;
+      word-break: break-all;
+    }
+  }
+  .footer {
+    width: 100%;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+  }
+  .btn {
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    text-align: center;
+    background: #3975C6;
+    font-size: 32px;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #FFF;
+  }
+  .line-bg {
+    width: 100%;
+    height: 16px;
+    background: #F5F5F5;
+  }
+}
+</style>

src/apps/AppVillagersCircle/detail.vue

@@ -14,6 +14,50 @@
       </div>
     </div>
     <div class="textarea">⾦秋穿上⽑⾐，漫步森林，在阳光下呼吸伸展，⾃在安逸的天⼈。也许是兰天名字的由来吧。</div>
+    <div>
+      <img :src="item.url" alt="" v-for="(item, i) in files" :key="i" @click="previewImage(files, item.url)" />
+    </div>
+    <div class="address">
+      <div class="addr-bg">
+        <img src="./img/address.png" alt="">
+        <span>东湖生态旅游风景区听涛景区</span>
+      </div>
+    </div>
+    <div class="comment">
+      <div class="comment-list">
+        <div class="title">评论:</div>
+        <div class="item">
+          <span class="avatar">桃白白:</span>为什么不带上我呢！为什么不带上我呢！为什么不带上我呢！为什么不带上我呢！为什么不带上我呢！为什么不带上我呢！
+        </div>
+      </div>
+    </div>
+
+    <div class="readOnly" v-if="status==1">
+      <div class="item">
+        <div>审核结果</div>
+        <div>不通过</div>
+      </div>
+      <div class="item nopass">
+        <div>不通过理由</div>
+        <div class="textarea">我村赴黎平参加百村杯篮球赛经费分两阶段分发， 第一阶段为小组循环赛，第二阶段为淘汰赛。第一 其中包括队员球服两套，住宿、饮食</div>
+      </div>
+      <div class="item">
+        <div>审核人</div>
+        <div>李世民</div>
+      </div>
+      <div class="item last">
+        <div>审核时间</div>
+        <div>2022-02-18 18:16:27</div>
+      </div>
+    </div>
+
+    <div style="height: 56px;"></div>
+
+    <div class="btn" v-if="status == 0">
+      <div class="reject" @click="toReject">驳回发布</div>
+      <div class="agree" @click="agree">同意发布</div>
+    </div>
+    
   </div>
 </template>
 
@@ -22,11 +66,21 @@ export default {
   name: 'detail',
   data() {
     return {
+      files: [],
+      status: 1,
 
     }
   },
-  methods: {},
-  onShow() {},
+  methods: {
+    previewImage() {},
+    toReject() {
+      uni.navigateTo({url: './Reject'})
+    },
+    agree() {}
+  },
+  onShow() {
+    document.title = "村民圈审核"
+  },
   onLoad() {},
 
 
@@ -35,22 +89,24 @@ export default {
 
 <style lang="scss" scoped>
 .detail {
-  background: #FFFFFF;
-  padding: 30px 32px;
-  box-sizing: border-box;
-
+  
   .avatar-info {
     display: flex;
-    margin-bottom: 30px;
+    padding: 0 32px;
+    box-sizing: border-box;
+    background: #FFFFFF;
     .avatar-img {
       margin-right: 20px;
       img {
+        margin-top: 30px;
         width: 88px;
         height: 88px;
         border-radius: 50%;
       }
     }
     .avatar-title {
+      padding: 30px 32px;
+      box-sizing: border-box;
       .name {
         font-size: 32px;
         color: #333333;
@@ -64,9 +120,96 @@ export default {
     }
   }
   .textarea {
-    font-style: 32px;
+    padding: 0 32px;
+    box-sizing: border-box;
+    font-size: 32px;
+    background: #FFFFFF;
   }
+  .address {
+    background: #FFFFFF;
+    padding: 20px 32px;
+    box-sizing: border-box;
 
+    .addr-bg {
+      display: flex;
+      border-radius: 28px;
+      padding: 6px 20px;
+      background: #EFF1F3;
+      img {
+        margin-top: 5px;
+        width: 32px;
+        height: 32px;
+      }
+    }
+    
+    
+    
+  }
+  .comment {
+    padding: 0 32px 30px 32px;
+    box-sizing: border-box;
+    background: #FFFFFF;
+
+    .comment-list {
+      padding: 20px 30px;
+      background: #F7F8F9;
+      border-radius: 16px;
+      .title {
+        color: #333333;
+        font-weight: 600;
+      }
+      .item {
+        font-size: 28px;
+        .avatar {
+          color: #576a91;
+        }
+      }
+    }
+  }
+  .readOnly {
+    font-size: 32px;
+    .item {
+      display: flex;
+      justify-content: space-between;
+      background: #FFFFFF;
+      border-bottom: 1px solid #D8DDE6;
+      padding: 30px 30px;
+      box-sizing: border-box;
+
+      .textarea {
+        width: 100%;
+        padding: 30px 0 0 0 ;
+        color: #999999;
+      }
+    }
+    .nopass {
+      flex-direction: column;
+      border-bottom: 1px solid #D8DDE6;
+    }
+    .last {
+      border-bottom: none;
+    }
+  }
+  .btn {
+    display: flex;
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    .reject {
+      width: 50%;
+      color: #FF4466;
+      background: #FFFFFF;
+      text-align: center;
+    }
+    .agree {
+      width: 50%;
+      color: #FFFFFF;
+      background: #3975C6;
+      text-align: center;
+    }
+  }
 
 }
 </style>