MapSourceModal.vue 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105
  1. <!--
  2. * @Author: tengmingxue 1473375109@qq.com
  3. * @Date: 2023-08-15 16:19:10
  4. * @LastEditors: tengmingxue 1473375109@qq.com
  5. * @LastEditTime: 2023-08-17 15:54:02
  6. * @FilePath: \xld-gis-admin\src\views\resource\map\MapSourceModal.vue
  7. * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  8. -->
  9. <template>
  10. <BasicModal
  11. width="1200px"
  12. v-bind="$attrs"
  13. @register="registerModal"
  14. :title="getTitle"
  15. @ok="handleSubmit"
  16. >
  17. <div style="height: 60vh" class="res-form-container">
  18. <a-tabs v-model:activeKey="activeKey" class="res-a-tabs">
  19. <a-tab-pane key="1" tab="地图资源信息">
  20. <!-- <BasicForm @register="registerForm"></BasicForm> -->
  21. <source-detail ref="refSourceDetail" @RtnMain="RtnMain" :formData="formData" :isUpdate="isUpdate"></source-detail>
  22. </a-tab-pane>
  23. <a-tab-pane key="2" tab="流程信息" force-render>
  24. <div class="tab2"></div>
  25. </a-tab-pane>
  26. </a-tabs>
  27. </div>
  28. </BasicModal>
  29. </template>
  30. <script lang="ts">
  31. import { defineComponent, ref, computed, unref, reactive, onMounted } from 'vue';
  32. import { BasicModal, useModalInner } from '/@/components/Modal';
  33. import { BasicForm, useForm } from '/@/components/Form/index';
  34. import { formSchema } from './map.data';
  35. import { BasicTree } from '/@/components/Tree';
  36. import { PlusOutlined } from '@ant-design/icons-vue';
  37. import SourceDetail from './SourceDetail.vue';
  38. export default defineComponent({
  39. name: 'AccountModal',
  40. components: {
  41. BasicModal,
  42. BasicForm,
  43. BasicTree,
  44. PlusOutlined,
  45. SourceDetail,
  46. VNodes: (_, { attrs }) => {
  47. return attrs.vnodes;
  48. },
  49. },
  50. emits: ['success', 'register'],
  51. setup(_, { emit }) {
  52. const data = reactive({
  53. activeKey: '2',
  54. });
  55. const refSourceDetail = ref(null);
  56. let formData = ref(null)
  57. const isUpdate = ref(true);
  58. const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
  59. setModalProps({ confirmLoading: false });
  60. isUpdate.value = !!data?.isUpdate;
  61. if(isUpdate.value) formData.value = data.record
  62. });
  63. const getTitle = computed(() => (!unref(isUpdate) ? '新增地图资源' : '编辑地图资源'));
  64. async function handleSubmit() {
  65. refSourceDetail.value.submitForm();
  66. }
  67. const RtnMain = (status) => {
  68. emit('success')
  69. }
  70. onMounted(() => {});
  71. return {
  72. ...ref(data),
  73. registerModal,
  74. handleSubmit,
  75. getTitle,
  76. refSourceDetail,
  77. isUpdate,
  78. formData,
  79. RtnMain,
  80. };
  81. },
  82. });
  83. </script>
  84. <style scoped lang="less">
  85. :deep(.vben-basic-tree) {
  86. width: 100% !important;
  87. }
  88. :deep(.is-unflod) {
  89. display: none !important;
  90. }
  91. :deep(.is-flod) {
  92. display: none !important;
  93. }
  94. :deep(.res-form-container) {
  95. .res-a-tabs {
  96. margin-top: 61px !important;
  97. }
  98. }
  99. </style>