vent-template/src/views/vent/deviceManager/comment/DeviceGasModal.vue

<template>
  <BasicModal v-bind="$attrs" @register="registerModal" :title="title" width="1000px" :showCancelBtn="false"
    :showOkBtn="false" :footer="null" :destroyOnClose="true" :mask-closable="false" @cancel="closeModalFn">
    <FormModal :deviceType="deviceType" :record="deviceData" @saveOrUpdate="(values) => emit('saveOrUpdate', values)" />
  </BasicModal>
</template>
<script lang="ts" setup>
import { computed, unref, inject, reactive, ref, watch } from 'vue';
import { BasicModal, useModalInner } from '/@/components/Modal';
import FormModal from './FormModal.vue';



const props = defineProps({
  // showTab: { type: Boolean, required: true },
  // deviceType: { type: String },
});
// 声明Emits
const emit = defineEmits(['saveOrUpdate', 'register', 'closeModal']);
const isUpdate = inject('isUpdate');
const deviceData = inject('formData') as any;
const deviceType = inject('deviceType') as any;
const record = reactive({});

//表单赋值
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
  //重置表单
  setModalProps({ confirmLoading: false });
  Object.assign(deviceData, data.record);
  // 判断是否是关键阻力路线
});

//设置标题
const title = computed(() => {
  if (!unref(isUpdate)) {
    if (deviceData.strname || deviceData.systemname) {
      return `新增（${deviceData.strname || deviceData.systemname}）`;
    }
    return `新增`;
  } 
});

const closeModalFn = () => {
  closeModal();
  emit('closeModal');
};

</script>
<style scoped lang="less">
::v-deep .suffix {
  height: 32px;
  line-height: 32px;
  margin-left: 5px;
  color: #fff;
}
</style>