证书详情贴图,缺少账户信息

pages/index/cert/id.vue

@@ -1,5 +1,16 @@
 <template>
-  <section class="cert-id">{{detail}}</section>
+  <section class="cert-id">
+    <section class="cert-id-box">
+      <h1>{{detail.name}}证书</h1>
+      <div class="hr"></div>
+      <img class="img" src="~@/assets/img/cert/bg.png" alt="img">
+      <section style="width: 850px;">
+        <a href>开发者个人主页 ></a>
+        <br>
+        <a href>{{detail.name}}认证标准 ></a>
+      </section>
+    </section>
+  </section>
 </template>
 
 <script>
@@ -7,7 +18,8 @@ import http from '@/plugins/http'
 
 export default {
   async asyncData(ctx) {
-    let res = await http.post(`${ctx.isDev ? '' : http.host}/api/cert/getCertDetail`, { cert_no: ctx.query.no })
+    let res = await http.post(`${http.host}/api/cert/getCertDetail`, { cert_no: ctx.query.no })
+    // let res = await http.post(`${ctx.isDev ? '' : http.host}/api/cert/getCertDetail`, { cert_no: ctx.query.no })
     return {
       detail: res.data
     }
@@ -16,10 +28,44 @@ export default {
     return {}
   },
   mounted() {
-
+    console.log(this.detail)
   }
 }
 </script>
 
 <style scoped>
+.cert-id-box {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  width: 1000px;
+  padding-bottom: 30px;
+  margin-top: 20px;
+  background: white;
+}
+h1 {
+  font-size: 26px;
+  font-family: PingFangSC-Medium;
+  font-weight: 500;
+  color: #1d2a3a;
+  margin: 28px 0 24px;
+}
+.hr {
+  width: 960px;
+  height: 1px;
+  background: #eee;
+  margin-bottom: 12px;
+}
+.img {
+  width: 850px;
+  height: 520px;
+}
+a {
+  line-height: 28px;
+  margin-left: 12px;
+  text-decoration: underline;
+  font-size: 14px;
+  font-family: PingFangSC-Regular;
+  color: #666;
+}
 </style>