管道气 接收站审批

src/components/common/rejectReplyModal.vue

@@ -1,19 +1,21 @@
 <template>
-  <BasicModal v-bind="$attrs" destroyOnClose @register="registerModal" showFooter :title="getTitle" width="40%" @ok="handleSubmit" @cancel="handleCancel">
-    <a-form ref="formRef" :model="formState" :rules="rules" v-bind="{labelCol: { span: 8 },wrapperCol: { span: 16 },}">
-      <a-row>
-        <a-col :span="24">
-          <a-form-item label="批复意见" name="reply" :label-col="{ span: 4 }" :wrapper-col="{ span: 24 }">
-            <a-textarea  v-model:value="formState.reply"  placeholder="请输入" :auto-size="{ minRows: 2, maxRows: 5 }"/>
-          </a-form-item>
-        </a-col>
-      </a-row>
-    </a-form>
-  </BasicModal>
+   <a-modal :mask-closable="false" title="驳回意见" :visible="isOpen" :width="500" centered class="geg" @cancel="handleCancel">
+     <a-form ref="formRef" :model="formState" :rules="rules" :label-col="{ span: 5 }">
+      <div class="dialog-wrap">
+        <a-form-item label="批复意见" name="reply">
+          <a-textarea  v-model:value="formState.reply"  placeholder="请输入" :auto-size="{ minRows: 2, maxRows: 5 }"/>
+        </a-form-item>
+      </div>  
+     </a-form>
+     <template #footer>
+      <a-button :disabled="loading" @click="handleCancel">取消</a-button>
+      <a-button :loading="loading" type="primary" @click="handleSubmit">确定</a-button>
+    </template>
+   </a-modal>
 </template>
 
 <script setup lang="ts">
-import {  ref, onMounted, computed, unref,reactive } from 'vue';
+import {  ref, onMounted, computed, unref,reactive,watch } from 'vue';
 import { BasicModal, useModalInner } from '/@/components/Modal';
 import { Form, message } from 'ant-design-vue';
 import { useI18n } from '/@/hooks/web/useI18n';
@@ -24,36 +26,49 @@ const { t } = useI18n();
 const isUpdate = ref(true);
 const formRef = ref()
 const { notification } = useMessage();
+const loading = ref(false)
 const emit = defineEmits(['success','register']);
-const getTitle = computed(() => t('驳回意见') )
 let formState = reactive({
 });
+const isOpen = ref(false)
 const rules = {
   reply: [{ required: true, message: "该项为必填项", trigger: 'change' }],
 };
 const props = defineProps({
-  type: String
+  type: String,
+  visible: Boolean
 })
-const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
-  setModalProps({ confirmLoading: false });
-  isUpdate.value = !!data?.isUpdate;
 
-  });
 
   onMounted(() => {
 
   });
+  watch(
+      () => props.visible,
+      (val) => {
+        isOpen.value = val
+      },
+      {
+        immediate: true,
+        deep: true,
+      }
+    );
   const handleCancel = () => {
     formRef.value.resetFields();
+    isOpen.value = false
   }
   const handleSubmit = async () => {
     try {
       await formRef.value.validate();
       emit('success', formState);
       formRef.value.resetFields();
-      closeModal();
     } catch (error) {
       console.log('验证失败:', error);
     }
   };
-  </script>
+  </script>
+  <style lang="less" scoped>
+    .dialog-wrap {
+        padding: 10px 15px 0 0;
+    }
+  </style>