finish verify

src/router/index.js

@@ -19,6 +19,14 @@ const routes = [
     meta: {
 			keepAlive: true
 		},
+  },
+  {
+    path: '/verify',
+    name: 'Verify',
+    component: () => import(/* webpackChunkName: "verify" */ '../views/Verify/Verify.vue'),
+    meta: {
+			keepAlive: true
+		},
   },
 	{
 		path: '*', // 页面不存在的情况下会跳到home

src/views/Comment/Comment.vue

@@ -39,7 +39,7 @@
             <md-button @click="item_cache = item; del_confirm_switch = true" class="md-primary">删除</md-button>
           </md-card-actions>
         </md-card>
-        <md-snackbar md-position="center" :md-active.sync="show_snackbar" md-persistent>
+        <md-snackbar md-position="center" :md-active.sync="show_snackbar" md-persistent :md-duration="1500">
           <span>{{ snakebar_msg }}</span>
         </md-snackbar>
         <md-dialog-confirm
@@ -50,6 +50,7 @@
           md-cancel-text="取消"
           @md-cancel="item_cache = null"
           @md-confirm="delComment"
+          :md-click-outside-to-close="false"
         />
         <div :style="`height:56px`"></div>
       </md-app-content>

src/views/Verify/verify.vue

@@ -13,20 +13,72 @@
         </div>
       </md-app-toolbar>
       <md-app-content>
-        <div ref="list_placeholder" :style="`height:40px`"></div>
+        <div ref="list_placeholder" :style="`height:56px`"></div>
-        <md-progress-bar v-if="loading_switch" md-mode="indeterminate" style="position: absolute; top: 56px; left: 0; width: 100%;"></md-progress-bar>
+        <md-progress-bar
+          v-if="loading_switch"
+          md-mode="indeterminate"
+          style="position: absolute; top: 56px; left: 0; width: 100%;"
+        ></md-progress-bar>
         <!-- 空内容 -->
         <md-empty-state
-        v-if="!verify_content"
+          v-if="!verify_content"
           class="md-primary"
           md-icon="done"
           md-label="暂无内容"
           md-description="恭喜你，当前暂时没有需要审核的内容，或许你可以刷新一下"
         ></md-empty-state>
-        <md-snackbar md-position="center" :md-active.sync="show_snackbar" md-persistent>
+
+        <!-- 审核卡片 -->
+        <md-card v-if="verify_content">
+          <md-card-media>
+            <img :src="`https://yg.canary.moe/photo/${verify_content.img_url}`" alt="showImg" />
+          </md-card-media>
+
+          <md-card-header>
+            <div class="md-title">{{verify_content.title}}</div>
+            <div class="md-subhead">{{formatDateTime(verify_content.create_time)}}</div>
+          </md-card-header>
+
+          <md-card-content>{{verify_content.content}}</md-card-content>
+          <md-card-content>{{verify_content.total_addr}} - {{verify_content.detail_addr}}</md-card-content>
+          <md-card-content v-if="verify_content.contact">联系方式 - {{verify_content.contact}}</md-card-content>
+          <md-card-content>用户名 - {{verify_content.user_info.nick}}</md-card-content>
+
+          <md-card-actions>
+            <md-button class="md-accent" @click="veto_prompt_switch = true">否决</md-button>
+            <md-button class="md-primary" @click="pass_confirm_switch = true">通过</md-button>
+          </md-card-actions>
+        </md-card>
+        <md-dialog-confirm
+          :md-active.sync="pass_confirm_switch"
+          md-title="确认"
+          md-content="您确定该失物招领没有违规内容，</br>您将对该行为负责，是否继续"
+          md-confirm-text="继续"
+          md-cancel-text="取消"
+          :md-click-outside-to-close="false"
+          @md-confirm="confirmRes(true)"
+        />
+
+        <md-dialog-prompt
+          :md-active.sync="veto_prompt_switch"
+          v-model="veto_reason"
+          md-title="否决原因"
+          md-input-maxlength="30"
+          md-input-placeholder="请输入否决的原因"
+          md-cancel-text="取消"
+          md-confirm-text="继续"
+          @md-cancel="veto_reason = ''"
+          @md-confirm="confirmRes(false)"
+        />
+        <md-snackbar
+          md-position="center"
+          :md-active.sync="show_snackbar"
+          :md-duration="1500"
+          md-persistent
+        >
           <span>{{ snakebar_msg }}</span>
         </md-snackbar>
-        <div :style="`height:40px`"></div>
+        <div :style="`height:56px`"></div>
       </md-app-content>
     </md-app>
   </div>
@@ -37,6 +89,8 @@
 import { mapState, mapActions } from "vuex";
 import { setHtmlFontSize } from "@/utils/px2rem.js";
 import { api } from "@/axios/fetch.js";
+import { formatDateTime } from "@/utils/formatTime.js";
+
 export default {
   name: "clear",
   data() {
@@ -49,7 +103,13 @@ export default {
       show_snackbar: false,
       snakebar_msg: "",
       // 加载控制
-      loading_switch: false
+      loading_switch: false,
+      // 通过弹窗控制
+      pass_confirm_switch: false,
+      // 否决弹窗控制
+      veto_prompt_switch: false,
+      // 否决原因
+      veto_reason: ""
     };
   },
   computed: {
@@ -57,7 +117,8 @@ export default {
   },
   methods: {
     ...mapActions(["setUserInfo", "setSettings"]),
-
+    // 格式化时间
+    formatDateTime,
     // 修改md-app的最小高度
     changeFixed(clientHeight) {
       //动态修改样式
@@ -83,7 +144,7 @@ export default {
       );
       this.initUserInfo();
       // 获取失物招领信息
-      this.getVerify()
+      this.getVerify();
     },
 
     // 初始化用户信息
@@ -99,7 +160,7 @@ export default {
       }
       console.log("用户信息初始化完成");
     },
-    
+
     // 获取待审核信息
     getVerify() {
       if (Object.keys(this.user_info).length == 0) {
@@ -110,13 +171,14 @@ export default {
       this.loading_switch = true;
       let data = {
         openid: this.user_info.openid
-      }
+      };
       console.log(`上传信息准备完成`);
-      console.log(data)
+      console.log(data);
       api
         .post("/verify/get", data)
         .then(res => {
           this.verify_content = res.data.verify;
+          console.log(this.verify_content);
           console.log("请求成功，待审核覆写成功");
           this.loading_switch = false;
           this.message("刷新成功");
@@ -131,6 +193,50 @@ export default {
           }
         });
     },
+
+    // 审核结果上传
+    confirmRes(verify_type) {
+      if (Object.keys(this.user_info).length == 0) {
+        console.log("管理员信息校验失败");
+        this.message("请先登录");
+        return;
+      }
+      if(!verify_type) {
+        if(! (this.veto_reason = this.veto_reason.trim())){
+          console.log("否决原因校验失败");
+          this.message("请填写否决原因");
+          return;
+        }
+      }
+      this.loading_switch = true;
+      let data = {
+        openid: this.user_info.openid,
+        id: this.verify_content.id,
+        pass: verify_type,
+        reason: this.veto_reason
+      };
+      console.log(`上传信息准备完成`);
+      console.log(data);
+      api
+        .put("/verify/res", data)
+        .then(res => {
+          this.verify_content = null;
+          this.veto_reason = '';
+          console.log("请求成功，审核成功");
+          this.loading_switch = false;
+          this.message("审核完成");
+          this.getVerify()
+        })
+        .catch(err => {
+          console.log(err);
+          this.loading_switch = false;
+          if (err.response && err.response.status != 500) {
+            this.message(`${err.response.status}: ${err.response.data}`);
+          } else {
+            this.message("网络错误,请稍候重试");
+          }
+        });
+    },
     // 调用snackBar
     message(msg) {
       this.snakebar_msg = msg;
@@ -229,4 +335,8 @@ export default {
 .md-bottom-bar.md-type-fixed .md-bottom-bar-item {
   max-width: 1000px !important;
 }
+.md-app-content .md-card {
+  margin: 0;
+  margin-bottom: 16px;
+}
 </style>