增加跳转的接口

张涛

2024-11-22 dfb7a8a63e87390dc095e81b04f0404697246d9f

 src/views/authority/organization/index.vue

@@ -7,11 +7,21 @@
        <a-card
          :title="$t('menu.organization.title')"
          :bordered="false"
          style=" 'width': '100%';   height: calc(100vh - 250px);; 'overflow-y': 'auto' "
          :header-style="{ textAlign: 'left' }"
          style=" 'width': '100%';   height: calc(100vh - 250px); overflow-y:auto "
        >
          <template #title>
            <span>{{ $t('menu.organization.title') }}</span>
            <a-tooltip content="点击后可通过拖拽更改机构结构,再次点击来关闭" background-color="#165DFF">
              <a-button type="outline" style="float: right;" @click="toggleDraggable" :style="{color: buttonColor}"
               v-has-permi="'/base/syorganization!update'">
                <component :is="lockIcon" />
              </a-button>
            </a-tooltip>
          </template>
          <a-tree
            class="tree-demo"
            draggable
            :draggable="draggable"
            blockNode
            :data="treeData"
            :show-line="showLine"
@@ -34,16 +44,20 @@
                "
                @click="() => onIconClick(nodeData)"
              />
              <IconDelete
                style="
              <a-popconfirm v-if="nodeData.deptName!='root'"
                content="请确认是否删除？"
                type="success"
                @ok="() => onIconClickDelete(nodeData)"
              >
                <IconDelete
                  style="
                  position: absolute;
                  right: 40px;
                  font-size: 12px;
                  top: 10px;
                  color: #3370ff;
                "
                @click="() => onIconClickDelete(nodeData)"
              />
                " />
              </a-popconfirm>
            </template>
          </a-tree>
        </a-card>
@@ -54,9 +68,9 @@
          :bordered="false"
          :style="{ width: '100%' }"
        >
          <a-form :model="deptform" layout="horizontal">
            <a-form-item field="parentName" label="上级机构">
              <a-input v-model="deptform.parentId" />
          <a-form :model="deptform" layout="horizontal" ref="formRef">
            <a-form-item field="parentName" label="上级机构" disabled>
              <a-input v-model="deptform.parentName" />
            </a-form-item>
            <a-form-item field="status" label="机构状态">
              <a-switch
@@ -65,13 +79,13 @@
                v-model="deptform.status"
              ></a-switch>
            </a-form-item>
            <a-form-item field="deptName" label="机构名称">
            <a-form-item field="deptName" label="机构名称" :rules="[{required:true,message:'机构名称必填'},{maxLength:50,message:'长度不超过50'}]">
              <a-input v-model="deptform.deptName" />
            </a-form-item>
            <a-form-item field="leader" label="联系人">
            <a-form-item field="leader" label="联系人" :rules="[{required:true,message:'联系人必填'},{maxLength:50,message:'长度不超过50'}]">
              <a-input v-model="deptform.leader" />
            </a-form-item>
            <a-form-item field="phone" label="联系电话">
            <a-form-item field="phone" label="联系电话" :rules="[{required:true,message:'联系电话必填'},{maxLength:50,message:'长度不超过50'}]">
              <a-input v-model="deptform.phone" />
            </a-form-item>
            <a-form-item field="address" label="机构地址" style="align: start">
@@ -94,8 +108,8 @@
      @cancel="handleCancel"
      @ok="addDept"
    >
      <a-form :model="deptform" layout="horizontal">
        <a-form-item field="parentName" label="上级机构">
      <a-form :model="deptform" layout="horizontal" ref="addFormRef">
        <a-form-item field="parentName" label="上级机构" disabled>
          <a-input v-model="deptform.parentName" />
        </a-form-item>
        <a-form-item field="status" label="机构状态">
@@ -105,13 +119,13 @@
            v-model="deptform.status"
          ></a-switch>
        </a-form-item>
        <a-form-item field="deptName" label="机构名称">
        <a-form-item field="deptName" label="机构名称" :rules="[{required:true,message:'机构名称必填'},{maxLength:50,message:'长度不超过50'}]">
          <a-input v-model="deptform.deptName" />
        </a-form-item>
        <a-form-item field="leader" label="联系人">
        <a-form-item field="leader" label="联系人" :rules="[{required:true,message:'联系人必填'},{maxLength:50,message:'长度不超过50'}]">
          <a-input v-model="deptform.leader" />
        </a-form-item>
        <a-form-item field="phone" label="联系电话">
        <a-form-item field="phone" label="联系电话" :rules="[{required:true,message:'联系电话必填'},{maxLength:50,message:'长度不超过50'}]">
          <a-input v-model="deptform.phone" />
        </a-form-item>
        <a-form-item field="address" label="机构地址" style="align: start">
@@ -131,11 +145,13 @@
    OrganizationById,
    OrganizationDelete,
    OrganizationList,
    OrganizationUpdate,
  } from '@/api/authority';
    OrganizationUpdate, User, UserAdd, UserEdit
  } from "@/api/authority";
  import Authheader from '@/views/authority/components/authheader.vue';
  import { Modal } from '@arco-design/web-vue';

  let formRef = ref();
  let addFormRef= ref();
  let visible = ref(false);
  let treeData = ref([]);
  let showLine = ref(true);
@@ -152,19 +168,39 @@
    address: '',
    deptId: '',
  });

let draggable = ref(false);
let buttonColor = ref("");
let lockIcon = ref("IconLock");
  const onIconClick = (nodeData) => {
    deptform.value.deptName = "";
    deptform.value.email = "";
    deptform.value.leader = "";
    deptform.value.orderNum = "0";
    deptform.value.phone = "";
    deptform.value.status = "";
    deptform.value.address = "";
    deptform.value.deptId = "";
    deptform.value.parentName = nodeData.deptName;
    deptform.value.parentId = nodeData.deptId;

    visible.value = true;
  };

  const addCb = async (err) => {
    if (err) {
      visible.value=true;
    } else {
      await OrganizationAdd({
        ...deptform.value,
      } as unknown as Organization).then((res) => {
        OrganizationData('');
      });
    }
    ;
  }

  const addDept = async () => {
    await OrganizationAdd({
      ...deptform.value,
    } as unknown as Organization).then((res) => {
      OrganizationData('');
    });
    addFormRef.value.validate(addCb);
  };

  const onIconClickDelete = (nodeData) => {
@@ -178,16 +214,24 @@
      deptform.value = { ...res.data };
    });
  };
  const editdept = () => {
    OrganizationUpdate({
      ...deptform.value,
    } as unknown as Organization).then((res) => {
      OrganizationData('');
      Modal.success({
        title: '保存成功',
        content: '保存成功',
  const cb = async (err) => {
    if (err) {

    } else {
      OrganizationUpdate({
        ...deptform.value,
      } as unknown as Organization).then((res) => {
        OrganizationData('');
        Modal.success({
          title: '保存成功',
          content: '保存成功',
        });
      });
    });
    }
    ;
  }
  const editdept = () => {
    formRef.value.validate(cb);
  };
  const reset = (id) => {
    OrganizationById(id).then((res) => {
@@ -244,6 +288,11 @@
  };

  OrganizationData('');
  const toggleDraggable = () =>{
    draggable.value = !draggable.value;
    buttonColor.value= draggable.value ? '#575757' : '';
    lockIcon.value = draggable.value ? 'IconUnlock' : 'IconLock';
  };
</script>

<style scoped>