sl-sfy-safety/src/views/production-safety/productionSafetySystem/securityOrganizationalStructure/components/addSafetySystem.vue

<!--
 * @Author: liuJie
 * @Date: 2026-02-05 10:20:24
 * @LastEditors: liuJie
 * @LastEditTime: 2026-02-05 20:25:10
 * @Describe: 添加组织
-->
<script lang="ts" setup>
  import { ref, watch } from 'vue';

  const props = withDefaults(
    defineProps<{
      visible?: boolean;
      data?: any;
    }>(),
    {
      visible: false,
      data: () => ({}),
    },
  );
  const team = ref('');
  const emit = defineEmits(['update:visible', 'confirmAddSafetySystem']);
  const dialogVisible = ref(props.visible);

  const title = ref('添加组织');

  watch(
    () => props.visible,
    (val) => {
      dialogVisible.value = val;
      if (val) {
        if (props.data.type === 'parent' && props.data.action === 'add') {
          title.value = '添加组织';
        } else if (props.data.type === 'parent' && props.data.action === 'edit') {
          title.value = '编辑组织';
          team.value = props.data.orgName;
        } else if (props.data.type === 'children' && props.data.action === 'add') {
          title.value = '添加子组织';
        } else {
          title.value = '编辑子组织';
          team.value = props.data.orgName;
        }
      }
    },
  );

  watch(dialogVisible, (val) => {
    emit('update:visible', val);
  });

  const confirmSave = () => {
    emit('confirmAddSafetySystem', { value: team.value, ...props.data });
    handleClose();
  };
  function handleClose() {
    dialogVisible.value = false;
    team.value = '';
  }
</script>
<template>
  <div class="content">
    <el-dialog v-model="dialogVisible" :title="title" width="500" :before-close="handleClose">
      <div class="flex items-center">
        <span style="width: 120px">组织名称：</span>
        <el-input v-model="team"></el-input>
      </div>
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="handleClose">取消</el-button>
          <el-button type="primary" @click="confirmSave"> 确认 </el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>
<style lang="scss" scoped></style>