You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
39 lines
1.1 KiB
39 lines
1.1 KiB
<template>
|
|
<div class="bg-white text-xl text-text px-5 py-7 rounded-lg">
|
|
<h1 class="font-medium">添加矿石</h1>
|
|
<section>
|
|
<div class="grid grid-cols-[5rem_1fr] gap-x-8 gap-y-4 min-w-[30rem] mt-4 mb-7 px-4">
|
|
<span class="text-right">矿石名称</span>
|
|
<input type="text" class="border border-[#eee] rounded-sm px-2" v-model="oreObj.oresName" />
|
|
</div>
|
|
</section>
|
|
<footer class="flex justify-center gap-x-6">
|
|
<button class="btn-dark px-6 py-1" @click="onConfirm">确定</button>
|
|
<button class="btn-light px-6 py-1" @click="$emit('cancel')">取消</button>
|
|
</footer>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import type { Ore } from "@/services/ore/oreManage";
|
|
import { showToast } from "vant";
|
|
import { ref } from "vue";
|
|
|
|
const props = defineProps<{ ore: Ore | undefined }>();
|
|
|
|
const oreObj = ref<Ore>(props.ore || { oresName: "" } as Ore);
|
|
|
|
const emit = defineEmits<{
|
|
(e: "confirm", ore: Ore): void;
|
|
(e: "cancel"): void;
|
|
}>();
|
|
|
|
|
|
function onConfirm() {
|
|
if (oreObj.value.oresName === "") {
|
|
showToast("名称不能为空");
|
|
return;
|
|
}
|
|
emit("confirm", oreObj.value);
|
|
}
|
|
</script>
|