|
|
@@ -293,6 +293,14 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-tab-pane>
|
|
|
+ <el-tab-pane label="新手指引" name="sixth">
|
|
|
+ <div class="guide-replay-card">
|
|
|
+ <div class="guide-replay-icon">📖</div>
|
|
|
+ <h3 class="guide-replay-title">新手指引</h3>
|
|
|
+ <p class="guide-replay-desc">回顾誉商城的功能介绍,快速上手积分兑换、参与活动等操作。</p>
|
|
|
+ <el-button type="primary" @click="handleReplayGuide">重新查看</el-button>
|
|
|
+ </div>
|
|
|
+ </el-tab-pane>
|
|
|
</el-tabs>
|
|
|
</div>
|
|
|
|
|
|
@@ -601,6 +609,18 @@ export default {
|
|
|
this.getSecondList(val);
|
|
|
},
|
|
|
|
|
|
+ handleReplayGuide() {
|
|
|
+ let parent = this.$parent;
|
|
|
+ while (parent) {
|
|
|
+ if (parent.$options.name === 'app' && parent.showGuide) {
|
|
|
+ parent.showGuide();
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ parent = parent.$parent;
|
|
|
+ }
|
|
|
+ console.warn('[Guide] 未找到 App 实例');
|
|
|
+ },
|
|
|
+
|
|
|
handleClick(tab) {
|
|
|
this.total = 0;
|
|
|
this.listQuery = {
|
|
|
@@ -628,6 +648,31 @@ export default {
|
|
|
};
|
|
|
</script>
|
|
|
<style scoped>
|
|
|
+.guide-replay-card {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ padding: 60px 40px;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+.guide-replay-icon {
|
|
|
+ font-size: 56px;
|
|
|
+ margin-bottom: 20px;
|
|
|
+}
|
|
|
+.guide-replay-title {
|
|
|
+ font-size: 20px;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #333;
|
|
|
+ margin: 0 0 12px 0;
|
|
|
+}
|
|
|
+.guide-replay-desc {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #999;
|
|
|
+ line-height: 1.6;
|
|
|
+ max-width: 400px;
|
|
|
+ margin: 0 0 30px 0;
|
|
|
+}
|
|
|
.gray{
|
|
|
filter: grayscale(100%);
|
|
|
}
|