|
@@ -32,51 +32,135 @@ export default {
|
|
|
currentStepIndex: 0,
|
|
|
// 已完成阶段
|
|
|
completedStages: [],
|
|
|
+ // 已完成的主线
|
|
|
+ completedMainLines: [],
|
|
|
// 引导配置
|
|
|
guideConfig: {
|
|
|
- // 主岛引导
|
|
|
- mainLand: {
|
|
|
- id: 'mainLand',
|
|
|
- steps: [
|
|
|
- {
|
|
|
- target: '.house-image',
|
|
|
- tips: '这是你的房屋,点击可以进入查看',
|
|
|
- position: 'bottom'
|
|
|
- },
|
|
|
- {
|
|
|
- target: '.farm-image',
|
|
|
- tips: '这是农场,可以种植作物',
|
|
|
- position: 'bottom'
|
|
|
- },
|
|
|
- {
|
|
|
- target: '.shop-image',
|
|
|
- tips: '这是商店,可以购买物品',
|
|
|
- position: 'bottom'
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- // 家园引导
|
|
|
- homeLand: {
|
|
|
- id: 'homeLand',
|
|
|
- steps: [
|
|
|
- {
|
|
|
- target: '.house-image',
|
|
|
- tips: '这是你的家,点击可以进入',
|
|
|
- position: 'bottom'
|
|
|
- },
|
|
|
- {
|
|
|
- target: '.table-image',
|
|
|
- tips: '这是工作台,可以制作物品',
|
|
|
- position: 'bottom'
|
|
|
- },
|
|
|
- {
|
|
|
- target: '.taskBoard-image',
|
|
|
- tips: '这是任务板,可以查看任务',
|
|
|
- position: 'bottom'
|
|
|
- }
|
|
|
- ]
|
|
|
- }
|
|
|
- }
|
|
|
+ mainLines: [
|
|
|
+ {
|
|
|
+ name: "new immigrant",
|
|
|
+ stage: "homeLand",
|
|
|
+ steps: [
|
|
|
+ {
|
|
|
+ arrow: null,
|
|
|
+ talkData: [
|
|
|
+ {
|
|
|
+ characterImage: '/static/island/npc.png',
|
|
|
+ characterName: '罗宾',
|
|
|
+ text: '这位大人,这里太大了吧....',
|
|
|
+ position: 'left',
|
|
|
+ isMirror: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ characterImage: '/static/island/building/1.png',
|
|
|
+ characterName: '我',
|
|
|
+ text: '好的,我马上上会教付清',
|
|
|
+ position: 'right',
|
|
|
+ isMirror: false
|
|
|
+ },
|
|
|
+ {
|
|
|
+ characterImage: '/static/island/building/1.png',
|
|
|
+ characterName: '我',
|
|
|
+ text: '很奇怪不是吗?',
|
|
|
+ position: 'right',
|
|
|
+ isMirror: false
|
|
|
+ },
|
|
|
+ {
|
|
|
+ characterImage: '/static/island/npc.png',
|
|
|
+ characterName: '罗宾',
|
|
|
+ text: '怎么回事',
|
|
|
+ position: 'left',
|
|
|
+ isMirror: true
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ arrow: {x: 350, y: 460, r: 0},
|
|
|
+ talkData: [
|
|
|
+ {
|
|
|
+ characterImage: '/static/island/npc.png',
|
|
|
+ characterName: '罗宾',
|
|
|
+ text: '工作台在这里呢',
|
|
|
+ position: 'left',
|
|
|
+ isMirror: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ characterImage: '/static/island/building/1.png',
|
|
|
+ characterName: '我',
|
|
|
+ text: '好的,我去看看',
|
|
|
+ position: 'right',
|
|
|
+ isMirror: false
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "new craftsman",
|
|
|
+ stage: "mainLand_table",
|
|
|
+ steps: [
|
|
|
+ {
|
|
|
+ arrow: null,
|
|
|
+ talkData: [
|
|
|
+ {
|
|
|
+ characterImage: '/static/island/npc.png',
|
|
|
+ characterName: '罗宾',
|
|
|
+ text: '工作台在这里呢!',
|
|
|
+ position: 'left',
|
|
|
+ isMirror: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ characterImage: '/static/island/building/1.png',
|
|
|
+ characterName: '我',
|
|
|
+ text: '好像可以有好多工具,但是好像没有材料呢~',
|
|
|
+ position: 'right',
|
|
|
+ isMirror: false
|
|
|
+ },
|
|
|
+
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ arrow: {x: 750, y: 660, r: 270},
|
|
|
+ talkData: [
|
|
|
+ {
|
|
|
+ characterImage: '/static/island/npc.png',
|
|
|
+ characterName: '罗宾',
|
|
|
+ text: '是的呀,也可以去看看别人发布的任务,获取材料呢!',
|
|
|
+ position: 'left',
|
|
|
+ isMirror: true
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "new flower farmer",
|
|
|
+ stage: "mainLand",
|
|
|
+ steps: [
|
|
|
+ {
|
|
|
+ arrow: {x: 50, y: 50, r: 90},
|
|
|
+ talkData: [
|
|
|
+ {
|
|
|
+ characterImage: '/static/island/npc.png',
|
|
|
+ characterName: '罗宾',
|
|
|
+ text: '这里可以种花呦....',
|
|
|
+ position: 'left',
|
|
|
+ isMirror: true
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ // 当前主线ID
|
|
|
+ currentMainLineId: 0,
|
|
|
+ // 当前主线
|
|
|
+ currentMainLine: null,
|
|
|
+ // 对话数据
|
|
|
+ currentTalkData: [],
|
|
|
+ // 当前对话索引
|
|
|
+ currentTalkIndex: 0
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
@@ -180,31 +264,122 @@ export default {
|
|
|
},
|
|
|
methods: {
|
|
|
// 开始引导
|
|
|
- startGuide(stageId) {
|
|
|
- // 检查是否已完成
|
|
|
- if (this.completedStages.includes(stageId)) {
|
|
|
- return
|
|
|
+ startGuide(stage) {
|
|
|
+ // 获取当前主线
|
|
|
+ const mainLine = this.guideConfig.mainLines[this.currentMainLineId];
|
|
|
+
|
|
|
+ // 检查主线是否存在且场景是否匹配
|
|
|
+ if (!mainLine || mainLine.stage !== stage) {
|
|
|
+ return false;
|
|
|
}
|
|
|
+
|
|
|
+ // 检查主线是否已完成
|
|
|
+ if (this.completedMainLines.includes(this.currentMainLineId)) {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 设置当前主线
|
|
|
+ this.currentMainLine = mainLine;
|
|
|
+ this.currentStepIndex = 0;
|
|
|
+ this.currentTalkIndex = 0;
|
|
|
|
|
|
- // 设置当前阶段
|
|
|
- this.currentStage = this.guideConfig[stageId]
|
|
|
- this.currentStepIndex = 0
|
|
|
+ // 初始化对话数据
|
|
|
+ this.initTalkData();
|
|
|
|
|
|
- // 等待DOM更新后更新位置
|
|
|
- this.$nextTick(() => {
|
|
|
- this.updatePositions()
|
|
|
- })
|
|
|
+ return true;
|
|
|
+ },
|
|
|
+ // 设置当前主线ID
|
|
|
+ setMainLineId(id) {
|
|
|
+ if (id >= 0 && id < this.guideConfig.mainLines.length) {
|
|
|
+ this.currentMainLineId = id;
|
|
|
+ // 保存到本地存储
|
|
|
+ this.saveCurrentMainLineId();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 保存当前主线ID
|
|
|
+ saveCurrentMainLineId() {
|
|
|
+ uni.setStorageSync('currentGuideMainLineId', this.currentMainLineId);
|
|
|
+ },
|
|
|
+ // 加载当前主线ID
|
|
|
+ loadCurrentMainLineId() {
|
|
|
+ const id = uni.getStorageSync('currentGuideMainLineId');
|
|
|
+ if (id !== '') {
|
|
|
+ this.currentMainLineId = id;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 初始化对话数据
|
|
|
+ initTalkData() {
|
|
|
+ if (this.currentMainLine && this.currentMainLine.steps[this.currentStepIndex]) {
|
|
|
+ this.currentTalkData = this.currentMainLine.steps[this.currentStepIndex].talkData;
|
|
|
+ }
|
|
|
},
|
|
|
// 下一步
|
|
|
nextStep() {
|
|
|
- if (this.isLastStep) {
|
|
|
- this.completeStage()
|
|
|
+ console.log("-------- next step", {
|
|
|
+ currentMainLine: this.currentMainLine,
|
|
|
+ currentStepIndex: this.currentStepIndex,
|
|
|
+ currentTalkIndex: this.currentTalkIndex,
|
|
|
+ currentTalkData: this.currentTalkData
|
|
|
+ });
|
|
|
+
|
|
|
+ if (!this.currentMainLine) return;
|
|
|
+
|
|
|
+ // 如果当前步骤是最后一步
|
|
|
+ if (this.currentStepIndex === this.currentMainLine.steps.length - 1) {
|
|
|
+ this.completeMainLine();
|
|
|
} else {
|
|
|
- this.currentStepIndex++
|
|
|
- this.$nextTick(() => {
|
|
|
- this.updatePositions()
|
|
|
- })
|
|
|
+ // 进入下一步
|
|
|
+ this.currentStepIndex++;
|
|
|
+ this.currentTalkIndex = 0;
|
|
|
+ this.initTalkData();
|
|
|
}
|
|
|
+
|
|
|
+ console.log("-------- next step2", {
|
|
|
+ currentMainLine: this.currentMainLine,
|
|
|
+ currentStepIndex: this.currentStepIndex,
|
|
|
+ currentTalkIndex: this.currentTalkIndex,
|
|
|
+ currentTalkData: this.currentTalkData
|
|
|
+ });
|
|
|
+
|
|
|
+ },
|
|
|
+ // 完成主线
|
|
|
+ completeMainLine() {
|
|
|
+ if (this.currentMainLine) {
|
|
|
+ // 添加到已完成列表
|
|
|
+ this.completedMainLines.push(this.currentMainLine.name);
|
|
|
+
|
|
|
+ // 保存到本地存储
|
|
|
+ this.saveCompletedMainLines();
|
|
|
+
|
|
|
+ // 重置状态
|
|
|
+ this.currentMainLine = null;
|
|
|
+ this.currentStepIndex = 0;
|
|
|
+ this.currentTalkIndex = 0;
|
|
|
+ this.currentTalkData = [];
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 保存已完成主线
|
|
|
+ saveCompletedMainLines() {
|
|
|
+ uni.setStorageSync('completedGuideMainLines', this.completedMainLines);
|
|
|
+ },
|
|
|
+ // 加载已完成主线
|
|
|
+ loadCompletedMainLines() {
|
|
|
+ const mainLines = uni.getStorageSync('completedGuideMainLines');
|
|
|
+ if (mainLines) {
|
|
|
+ this.completedMainLines = mainLines;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 获取当前箭头位置
|
|
|
+ getCurrentArrowPosition() {
|
|
|
+ if (!this.currentMainLine || !this.currentMainLine.steps[this.currentStepIndex]) {
|
|
|
+ return null;
|
|
|
+ }
|
|
|
+ return this.currentMainLine.steps[this.currentStepIndex].arrow;
|
|
|
+ },
|
|
|
+ // 获取当前对话数据
|
|
|
+ getCurrentTalkData() {
|
|
|
+ if (!this.currentTalkData.length) return null;
|
|
|
+ return this.currentTalkData;
|
|
|
},
|
|
|
// 跳过当前阶段
|
|
|
skipStage() {
|
|
@@ -215,8 +390,29 @@ export default {
|
|
|
if (this.currentStage) {
|
|
|
// 添加到已完成列表
|
|
|
this.completedStages.push(this.currentStage.id)
|
|
|
+
|
|
|
+ // 如果当前阶段有主线ID,检查该主线的所有阶段是否都已完成
|
|
|
+ if (this.currentStage.mainLineId) {
|
|
|
+ const mainLineId = this.currentStage.mainLineId
|
|
|
+ const mainLineStages = Object.values(this.guideConfig).filter(
|
|
|
+ stage => stage.mainLineId === mainLineId
|
|
|
+ )
|
|
|
+
|
|
|
+ // 检查该主线的所有阶段是否都已完成
|
|
|
+ const isMainLineCompleted = mainLineStages.every(
|
|
|
+ stage => this.completedStages.includes(stage.id)
|
|
|
+ )
|
|
|
+
|
|
|
+ // 如果主线完成,添加到已完成主线列表
|
|
|
+ if (isMainLineCompleted && !this.completedMainLines.includes(mainLineId)) {
|
|
|
+ this.completedMainLines.push(mainLineId)
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
// 保存到本地存储
|
|
|
this.saveCompletedStages()
|
|
|
+ this.saveCompletedMainLines()
|
|
|
+
|
|
|
// 重置状态
|
|
|
this.currentStage = null
|
|
|
this.currentStepIndex = 0
|
|
@@ -251,8 +447,9 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
mounted() {
|
|
|
- // 加载已完成阶段
|
|
|
- this.loadCompletedStages()
|
|
|
+ // 加载已完成主线和当前主线ID
|
|
|
+ this.loadCompletedMainLines();
|
|
|
+ this.loadCurrentMainLineId();
|
|
|
}
|
|
|
}
|
|
|
</script>
|