<template>
|
<div class="client_container">
|
<el-select v-model="clientCode" clearable :placeholder="$t('login.clientList.placeholder.client')" style="width: 100%">
|
<el-option v-for="item in data" :key="item.code" :label="item.clientName" :value="item.code" />
|
</el-select>
|
|
<div class="btn_box">
|
<el-button type="" @click="close">{{ $t("login.clientList.btn.cancel") }}</el-button>
|
<el-button type="primary" @click="submit">{{ $t("login.clientList.btn.submit") }}</el-button>
|
</div>
|
</div>
|
</template>
|
|
<script lang="ts" setup>
|
import { defineProps, ref, defineEmits } from "vue";
|
import { ElMessage } from "element-plus";
|
import { useI18n } from "vue-i18n";
|
|
const props = defineProps<{
|
data: IClientItem[];
|
}>();
|
|
const emit = defineEmits(["close", "submit"]);
|
|
|
const { t } = useI18n();
|
|
|
const clientCode = ref<string>("");
|
|
const close = () => {
|
emit("close");
|
};
|
|
const submit = () => {
|
if(!clientCode.value) return ElMessage.error(t("login.clientList.msg.err.noSelectClient"));
|
// 根据code查出当前的客户名称
|
const item = props.data.find((e: IClientItem) => e.code === clientCode.value);
|
emit("submit", { clientCode: clientCode.value, clientName: item?.clientName })
|
};
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
.client_container {
|
|
.btn_box {
|
margin-top: 50px;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
}
|
</style>
|
