From 75aeb4e63339b60f9559af984c7d9f87a7cba24a Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期四, 09 五月 2024 17:40:47 +0800
Subject: [PATCH] 轨迹动画和任务管理
---
src/components/animation/HistoricalTrajectory.vue | 64 +++++++++++++++++++++++++++++--
1 files changed, 59 insertions(+), 5 deletions(-)
diff --git a/src/components/animation/HistoricalTrajectory.vue b/src/components/animation/HistoricalTrajectory.vue
index e2e50bf..3224b43 100644
--- a/src/components/animation/HistoricalTrajectory.vue
+++ b/src/components/animation/HistoricalTrajectory.vue
@@ -17,7 +17,7 @@
</div>
<div class="label-date margin-left-2">
<span class="label-date-title">鍊嶉��</span>
- <el-select v-model="speed" size="small" class="w-80">
+ <el-select v-model="speed" size="small" class="w-60">
<el-option label="1.0X" :value="1" />
<el-option label="4.0X" :value="4" />
<el-option label="8.0X" :value="8" />
@@ -29,15 +29,37 @@
</BaseCard>
</template>
<script>
+import { mapActions } from 'pinia';
+import { MapAnimation } from '@/utils/map/animation';
+import { FactorDatas } from '@/model/FactorDatas';
+import { useMapAnimationStore } from '@/stores/map-animation';
+
+const mapAnimation = new MapAnimation();
+
export default {
- props: {},
- emits: ['change'],
+ props: {
+ factorDatas: FactorDatas,
+ factorType: String
+ },
+ emits: ['change', 'stop'],
data() {
return {
speed: 1,
// 鍔ㄧ敾鐘舵�侊紝0锛氬仠姝紱1锛氭挱鏀撅紱2锛氭殏鍋�
status: 0
};
+ },
+ watch: {
+ speed(nV, oV) {
+ if (nV != oV) {
+ this.changeSpeed(nV);
+ }
+ },
+ factorType(nV, oV) {
+ if (nV != oV) {
+ mapAnimation.setFactorType(nV);
+ }
+ }
},
computed: {
btnStop() {
@@ -53,26 +75,58 @@
}
},
methods: {
+ ...mapActions(useMapAnimationStore, ['start', 'pause', 'stop']),
handleStop() {
if (this.status != 0) {
this.status = 0;
+ this.stopAnimation();
this.handleChange();
}
},
handlePlayOrPause() {
if (this.status == 1) {
this.status = 2;
+ this.pauseAnimation();
} else {
this.status = 1;
+ this.startAnimation();
}
this.handleChange();
},
handleChange() {
- console.log(this.status);
this.$emit('change', this.status);
+ },
+
+ newTimeTask() {
+ mapAnimation.setDynamicSpeed(false); //鍏抽棴鍔ㄦ�佺粯鍒堕�熷害璋冩暣
+ mapAnimation.moveAnimation(this.factorDatas, this.factorType);
+ },
+ startAnimation() {
+ this.changeSpeed(this.speed);
+ if (!mapAnimation.runStatus()) {
+ this.newTimeTask();
+ } else {
+ mapAnimation.start();
+ }
+ this.start();
+ },
+ changeSpeed(speed) {
+ mapAnimation.changeSpeed(speed);
+ },
+ pauseAnimation() {
+ mapAnimation.pause();
+ this.pause();
+ },
+ stopAnimation() {
+ mapAnimation.stop();
+ this.stop();
}
},
- mounted() {}
+ mounted() {
+ mapAnimation.setOnStopCallback(() => {
+ this.$emit('stop');
+ });
+ }
};
</script>
<style scoped>
--
Gitblit v1.9.3