123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123 |
- <template>
- <fs-page class="borrow-page">
- <fs-crud ref="crudRef" v-bind="crudBinding" />
- <BorrowTypeSelect v-model:visible="showBorrowTypeDialog" @select="onBorrowTypeSelected" />
- <!-- <CommonBorrow v-if="showCommonBorrowDialog" v-model:visible="showCommonBorrowDialog" :modelValue="borrowForm" @submit="handleBorrowSubmit" /> -->
- <ClassroomBorrow
- v-if="showClassroomBorrowDialog"
- v-model:visible="showClassroomBorrowDialog"
- :modelValue="borrowForm"
- @submit="handleBorrowSubmit"
- />
- <SpecialBorrow v-if="showSpecialBorrowDialog" v-model:visible="showSpecialBorrowDialog" :modelValue="borrowForm" @submit="handleBorrowSubmit" />
- </fs-page>
- </template>
- <script lang="ts" setup name="borrow">
- import { ref, onMounted, onBeforeUnmount,nextTick } from 'vue';
- import { useFs } from '@fast-crud/fast-crud';
- import { createCrudOptions } from './crud';
- // import { GetPermission } from './api';
- // import { handleColumnPermission } from '/@/utils/columnPermission';
- import BorrowTypeSelect from './component/BorrowTypeSelect/index.vue';
- // import CommonBorrow from './component/CommonBorrow/index.vue';
- import ClassroomBorrow from './component/ClassroomBorrow/index.vue';
- import SpecialBorrow from './component/SpecialBorrow/index.vue';
- import * as api from './api';
- import { ElMessage } from 'element-plus';
- const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
- const showBorrowTypeDialog = ref(false);
- // const showCommonBorrowDialog = ref(false);
- const showClassroomBorrowDialog = ref(false);
- const showSpecialBorrowDialog = ref(false);
- const borrowForm = ref({});
- function onBorrowTypeSelected(type: number, mode: 'view' | 'edit' | 'add',record?: any) {
- showBorrowTypeDialog.value = false;
- // 初始化表单数据,带上所选借用性质
- // borrowForm.value = { borrow_type: type, mode: mode };
- nextTick(() => {
- borrowForm.value = { ...(record || {}), borrow_type: type, mode };
- });
- if (type == 0) {
- showSpecialBorrowDialog.value = true;
-
- } else if (type == 1) {
- showClassroomBorrowDialog.value = true;
- } else {
- showSpecialBorrowDialog.value = true;
- }
- }
- async function handleBorrowSubmit(formData: any) {
- try {
- await api.AddObj(formData);
- showCommonBorrowDialog.value = false;
- // 刷新列表
- crudRef.value && crudRef.value.doRefresh && crudRef.value.doRefresh();
- ElMessage.success('保存成功');
- crudExpose.doRefresh();
- } catch (e) {
- // 错误处理
- console.error('提交失败', e);
- }
- }
- async function handleView(e: CustomEvent) {
- const row = e.detail;
- onBorrowTypeSelected(row.borrow_type, 'view',row);
- }
- async function handleEdit(e: CustomEvent) {
- const row = e.detail;
- onBorrowTypeSelected(row.borrow_type, 'edit',row);
- }
- async function handleRemove(e: CustomEvent) {
- const row = e.detail;
- onBorrowTypeSelected(row.borrow_type);
- }
- let observer: MutationObserver | null = null;
- onMounted(() => {
- // 设置列权限
- // const newOptions = await handleColumnPermission(GetPermission, crudOptions);
- //重置crudBinding
- // resetCrudOptions(newOptions);
- // 刷新
- crudExpose.doRefresh();
- window.addEventListener('borrow-view', handleView);
- window.addEventListener('borrow-edit', handleEdit);
- window.addEventListener('borrow-remove', handleRemove);
- // 创建借用单按钮
- function insertButton() {
- const fsActionbar = document.querySelector('.borrow-page .fs-actionbar');
- if (fsActionbar && !fsActionbar.querySelector('.my-create-btn')) {
- const button = document.createElement('button');
- button.className = 'el-button el-button--primary el-button--default my-create-btn';
- button.innerHTML = '创建借用单';
- button.onclick = () => {
- showBorrowTypeDialog.value = true;
- };
- fsActionbar.append(button);
- }
- }
- // 先尝试插入一次
- insertButton();
- // 监听 DOM 变化,确保 actionbar 出现时插入按钮
- observer = new MutationObserver(() => {
- insertButton();
- });
- observer.observe(document.body, { childList: true, subtree: true });
- });
- onBeforeUnmount(() => {
- if (observer) {
- observer.disconnect();
- observer = null;
- }
- window.removeEventListener('borrow-view', handleView);
- });
- </script>
- <style lang="scss" scoped></style>
|