|
@@ -7,32 +7,35 @@
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts">
|
|
<script setup lang="ts">
|
|
-import {computed, nextTick, onMounted, ref, watchEffect} from "vue";
|
|
|
|
-import {setCanvas} from "@/hook/useGraphic";
|
|
|
|
-import { useData } from './data'
|
|
|
|
|
|
+import { computed, nextTick, onMounted, ref, watchEffect } from "vue";
|
|
|
|
+import { setCanvas } from "@/hook/useGraphic";
|
|
|
|
+import { useData } from "./data";
|
|
|
|
+import router from "@/router";
|
|
|
|
|
|
const drawCanvasRef = ref<HTMLCanvasElement>();
|
|
const drawCanvasRef = ref<HTMLCanvasElement>();
|
|
-const data = useData()
|
|
|
|
|
|
+const data = useData();
|
|
|
|
|
|
-const stop = watchEffect(() => {
|
|
|
|
|
|
+const stop = watchEffect((oncleanup) => {
|
|
if (drawCanvasRef.value && data.value) {
|
|
if (drawCanvasRef.value && data.value) {
|
|
setCanvas(drawCanvasRef.value, data);
|
|
setCanvas(drawCanvasRef.value, data);
|
|
- nextTick(stop)
|
|
|
|
|
|
+ nextTick(stop);
|
|
|
|
+ } else if (!data.value) {
|
|
|
|
+ const timeout = setTimeout(() => router.back());
|
|
|
|
+ oncleanup(() => clearTimeout(timeout));
|
|
}
|
|
}
|
|
-})
|
|
|
|
-
|
|
|
|
|
|
+});
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
<style scoped lang="scss">
|
|
.draw-layout {
|
|
.draw-layout {
|
|
- width : 100%;
|
|
|
|
- height : 100%;
|
|
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 100%;
|
|
display: flex;
|
|
display: flex;
|
|
}
|
|
}
|
|
|
|
|
|
.canvas-layout,
|
|
.canvas-layout,
|
|
.draw-canvas {
|
|
.draw-canvas {
|
|
- width : 100%;
|
|
|
|
|
|
+ width: 100%;
|
|
height: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
-</style>
|
|
|
|
|
|
+</style>
|