123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778 |
- <template>
- <a-modal v-model:visible="visible" :title="title" @ok="handleOk" @cancel="handleCancel">
- <div class="modal-container">
- <div class="vent-flex-row">
- <ExclamationCircleFilled style="color: #ffb700; font-size: 30px" />
- <div class="warning-text">您是否要进行{{ title }}操作?</div>
- </div>
- <div class="vent-flex-row input-box" v-if="type == '1' || type == '2'">
- <div class="label">{{ title.includes('角度') ? '风窗角度:' : '风窗面积:' }}</div>
- <a-input-number size="small" placeholder="0" :min="0" :max="90" v-model:value="area" />
- </div>
- <div v-if="!globalConfig?.simulatedPassword" class="vent-flex-row input-box">
- <div class="label">操作密码:</div>
- <a-input size="small" type="password" v-model:value="passWord" />
- </div>
- </div>
- </a-modal>
- </template>
- <script setup lang="ts">
- import { watch, ref, inject } from 'vue';
- import { ExclamationCircleFilled } from '@ant-design/icons-vue';
- const globalConfig = inject('globalConfig');
- const props = defineProps({
- modalIsShow: {
- type: Boolean,
- default: false,
- },
- modalTitle: {
- type: String,
- default: '',
- },
- modalType: {
- type: String,
- default: '',
- },
- });
- const emit = defineEmits(['handleOk', 'handleCancel']);
- const visible = ref<Boolean>(false);
- const title = ref<String>('');
- const type = ref<String>('');
- const passWord = ref('');
- const area = ref(0);
- watch([() => props.modalIsShow, () => props.modalTitle, () => props.modalType], ([newVal, newModalTitle, newModalType]) => {
- visible.value = newVal;
- if (newModalTitle) title.value = newModalTitle;
- if (newModalType) type.value = newModalType;
- passWord.value = '';
- area.value = 0;
- });
- function handleOk() {
- if (globalConfig?.simulatedPassword) {
- emit('handleOk', '', type.value, area.value);
- } else {
- emit('handleOk', passWord.value, type.value, area.value);
- }
- }
- function handleCancel() {
- //
- emit('handleCancel');
- }
- </script>
- <style scoped lang="less">
- @ventSpace: zxm;
- .label {
- width: 80px;
- }
- .@{ventSpace}-input,
- .@{ventSpace}-input-number {
- width: 150px;
- }
- </style>
|