74 lines
1.4 KiB
Vue
74 lines
1.4 KiB
Vue
<script setup>
|
|
import { ref, onMounted } from "vue";
|
|
import useStore from "@/store";
|
|
import { simulShootAPI } from "@/apis";
|
|
import { storeToRefs } from "pinia";
|
|
const store = useStore();
|
|
const { device } = storeToRefs(store);
|
|
const isIos = ref(true);
|
|
|
|
const props = defineProps({
|
|
title: {
|
|
type: String,
|
|
default: "",
|
|
},
|
|
onBack: {
|
|
type: Function,
|
|
default: null,
|
|
},
|
|
});
|
|
|
|
const simulShoot = async () => {
|
|
if (device.value.deviceId) {
|
|
await simulShootAPI(device.value.deviceId);
|
|
}
|
|
};
|
|
|
|
const onClick = () => {
|
|
if (props.onBack) props.onBack();
|
|
else uni.navigateBack();
|
|
};
|
|
|
|
onMounted(() => {
|
|
const deviceInfo = uni.getDeviceInfo();
|
|
isIos.value = deviceInfo.osName === "ios";
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<view class="container" :style="{ paddingTop: isIos ? '35px' : '25px' }">
|
|
<view class="back-btn" @click="onClick">
|
|
<image src="../static/back.png" mode="widthFix" />
|
|
</view>
|
|
<text>{{ title }}</text>
|
|
<view class="simul" @click="simulShoot">模拟射箭</view>
|
|
</view>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.container {
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
align-items: center;
|
|
width: 72vw;
|
|
height: 60px;
|
|
padding-left: 15px;
|
|
}
|
|
.back-btn {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.back-btn > image {
|
|
width: 22px;
|
|
height: 22px;
|
|
margin-right: 10px;
|
|
}
|
|
.container > text {
|
|
color: #fff;
|
|
}
|
|
.simul {
|
|
color: #fff;
|
|
margin-left: 20px;
|
|
}
|
|
</style>
|