<!--预警指派展示组件  -->
<template>
  <el-dialog :draggable="true" v-model="modelValue" :title="title" :width="width" @close="close" append-to-body>
    <div class="archive-container">
      <FormMessage :formList="formData" v-model="listQuery" ref="elform" :rules="rules" :labelWidth="90">
      </FormMessage>
    </div>
    <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="submit">确定</el-button>
        <el-button @click="close">关闭</el-button>
      </div>
    </template>
  </el-dialog>
</template>
<script setup>
import { ref, defineProps, defineEmits, reactive, watch, getCurrentInstance } from 'vue';
import FormMessage from "@/components/aboutTable/FormMessage.vue";
import { tbYjxxYjzp } from '@/api/yj'
const { proxy } = getCurrentInstance();
const props = defineProps({
  modelValue: {
    type: Boolean,
    default: false
  },
  title: {
    type: String,
    default: '预警指派'
  },
  width: {
    type: String,
    default: '50%'
  },
  url: {
    type: String,
    default: ''
  },
  dataList: {
    type: Object,
    default: () => ({})
  }
});
const listQuery = ref()
const formData = ref([
  { label: "指派部门", prop: "zpbmdm", depMc: 'zpbm', type: "department", width: '45%' },
  { label: "指派原因", prop: "zpyy", type: "textarea", width: '80%' },
])

const rules = reactive({
  zpbmdm: [{ required: true, message: "请选择指派部门", trigger: "blur" }],
  zpyy: [{ required: true, message: "请输入指派原因", trigger: "change" }],
});
watch(() => props.modelValue, (newVal, oldVal) => {
  if (newVal) {

  }
})
const elform = ref(null)
const submit = async () => {
  elform.value.submit(() => {
    const params = { ...listQuery.value, yjid: props.dataList.id };
    tbYjxxYjzp(params).then((res) => {
      proxy.$message({ type: "success", message: "成功" });
      close();
    }).catch(() => {
      proxy.$message({ type: "error", message: "失败" });
    });
  });
}
// 定义事件
const emit = defineEmits(['update:modelValue']);
const close = () => {
elform.value.reset()
  emit('update:modelValue', false);
};
</script>

<style scoped>
/* 容器样式 */
.archive-container {
  padding: 15px;
  height: 50vh;
  overflow: auto;
}
</style>
