设备引导页

src/pages/guide/index.vue

@@ -0,0 +1,62 @@
+<template>
+  <view class="app-container">
+    <view v-if="content" class="ql-snow">
+      <rich-text class="ql-editor" :nodes="content" />
+    </view>
+    <view class="no-data" v-else>
+      暂无引导内容
+    </view>
+    <button type="submit" circle @click="close">知道了</button>
+  </view>
+</template>
+
+<script>
+import { getContent } from '@/api/guide'
+export default {
+  data() {
+    return {
+      content: ''
+    }
+  },
+  onLoad(e) {
+    if (e.deviceModel) {
+      getContent({ clientType: e.deviceModel }).then(res => {
+        if (res.data.code === 0) {
+          this.content = res.data.data.guidePageContent
+        }
+      })
+    }
+  },
+  methods: {
+    close() {
+      closePage.postMessage('关闭页面')
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.app-container {
+  height: 100%;
+
+  .ql-snow {
+    height: calc(100% - 116rpx);
+    overflow-y: scroll;
+  }
+
+  .no-data{
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%);
+    color: #bbb;
+  }
+
+  button {
+    position: absolute;
+    left: 32rpx;
+    bottom: 32rpx;
+    width: calc(100% - 64rpx);
+  }
+}
+</style>