<script lang="ts" setup>
|
import { reactive } from 'vue';
|
|
import { BasicModal, useModalInner } from '@jnpf/ui/modal';
|
|
import { getPrintDevByIds } from '#/api/system/printDev';
|
|
interface State {
|
printListOptions: any[];
|
}
|
|
const emit = defineEmits(['register', 'change']);
|
const state = reactive<State>({
|
printListOptions: [],
|
});
|
const [registerModal, { closeModal, changeLoading }] = useModalInner(init);
|
|
function init(ids) {
|
changeLoading(true);
|
getPrintDevByIds({ ids }).then((res) => {
|
state.printListOptions = res.data;
|
changeLoading(false);
|
});
|
}
|
function handleSelect(_val, item) {
|
emit('change', item.id);
|
closeModal();
|
}
|
</script>
|
<template>
|
<BasicModal v-bind="$attrs" @register="registerModal" title="请选择打印模板" :footer="null" width="400px" :min-height="250" class="template-list">
|
<div class="template-item" v-for="item in state.printListOptions" :key="item.id" @click="handleSelect($event, item)">
|
{{ item.fullName }}
|
</div>
|
</BasicModal>
|
</template>
|
<style lang="scss" scoped>
|
.template-list {
|
width: 100%;
|
height: 100%;
|
|
.template-item {
|
width: 100%;
|
height: 40px;
|
padding: 0 20px;
|
margin-bottom: 10px;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
line-height: 40px;
|
word-break: break-all;
|
white-space: nowrap;
|
cursor: pointer;
|
background: #eff9ff;
|
border-radius: 4px;
|
}
|
}
|
</style>
|
