<template>
|
<PageWrapper class="high-form" title="班制管理" content="这是班制管理页面。" @back="goBack">
|
<a-card title="班制信息" :bordered="false">
|
<BasicForm @register="register" />
|
</a-card>
|
<a-card title="班次明细" :bordered="false" class="!mt-5">
|
<div>
|
<BasicTable
|
:columns="dtlColumns"
|
ref="tableRef"
|
:dataSource="data"
|
:canResize="canResize"
|
:loading="loading"
|
:striped="striped"
|
:bordered="border"
|
:actionColumn="actionColumn"
|
:pagination="pagination"
|
showTableSetting
|
>
|
<template #toolbar>
|
<a-button type="primary" @click="handleCreate"> 新增班次 </a-button>
|
</template>
|
<template #action="{ record }">
|
<TableAction
|
:actions="[
|
{
|
icon: 'clarity:note-edit-line',
|
onClick: handleEdit.bind(null, record),
|
},
|
{
|
icon: 'ant-design:delete-outlined',
|
color: 'error',
|
popConfirm: {
|
title: '是否确认删除?',
|
placement: 'left',
|
confirm: handleDelete.bind(null, record),
|
},
|
},
|
]"
|
/>
|
</template>
|
</BasicTable>
|
</div>
|
</a-card>
|
<!-- <a-card title="校验测试" :bordered="false" class="!mt-5">
|
<BasicForm @register="registerTest" />
|
</a-card> -->
|
|
<template #rightFooter>
|
<a-button class="mr-4" type="info" @click="cancel"> 取消 </a-button>
|
<a-button type="primary" @click="submitAll"> 提交 </a-button>
|
</template>
|
<ShiftDrawer @register="registerDrawer" @success="handleSuccess" />
|
</PageWrapper>
|
</template>
|
<script lang="ts">
|
import { BasicForm, useForm } from '/@/components/Form';
|
import { defineComponent, onMounted, ref, unref } from 'vue';
|
import { useRoute, useRouter } from 'vue-router';
|
import { PageWrapper } from '/@/components/Page';
|
import { Card } from 'ant-design-vue';
|
import { useGo } from '/@/hooks/web/usePage';
|
import { useDrawer } from '/@/components/Drawer';
|
import { BasicTable, TableAction, TableActionType } from '/@/components/Table';
|
import { dtlColumns, newFormSchema } from './shift.data';
|
import ShiftDrawer from './ShiftDrawer.vue';
|
import { useTabs } from '/@/hooks/web/useTabs';
|
import {
|
// DeleteRuleDtl,
|
getShiftById,
|
getShiftDtl,
|
// SaveRule,
|
// SaveRuleDtl,
|
} from '/@/api/tigerapi/bas/shift';
|
import {
|
CheckRuleDtlParams,
|
CheckRuleListItem,
|
iBAS_CODE_DTL,
|
} from '/@/api/tigerapi/model/mesModel';
|
import { useUserStore } from '/@/store/modules/user';
|
import { buildUUID } from '/@/utils/uuid';
|
import { formatToDateTime } from '/@/utils/dateUtil';
|
import { useMultipleTabStore } from '/@/store/modules/multipleTab';
|
import { isEmpty, isNullOrEmpty } from '/@/utils/is';
|
|
export default defineComponent({
|
name: 'RuleDetail',
|
components: {
|
BasicForm,
|
BasicTable,
|
PageWrapper,
|
ShiftDrawer,
|
[Card.name]: Card,
|
TableAction,
|
},
|
setup(props) {
|
const route = useRoute();
|
const go = useGo();
|
const tableRef = ref<Nullable<TableActionType>>(null);
|
const RuleObj = ref(JSON.parse(decodeURI(route.params?.id as string)));
|
const { setTitle } = useTabs();
|
const isUpdate = ref(true);
|
const canResize = ref(false);
|
const loading = ref(false);
|
const striped = ref(true);
|
const border = ref(true);
|
const pagination = ref<any>(false);
|
const actionColumn = ref({
|
width: 80,
|
title: '操作',
|
dataIndex: 'action',
|
slots: { customRender: 'action' },
|
});
|
const tabStore = useMultipleTabStore();
|
const router = useRouter();
|
|
const { currentRoute } = router;
|
function getCurrentTab() {
|
const route = unref(currentRoute);
|
return tabStore.getTabList.find((item) => item.fullPath === route.fullPath)!;
|
}
|
const currentTab = getCurrentTab();
|
var _title =
|
RuleObj.value.SFTS_CODE == '0' ? '新增班次' : '编辑班次:' + RuleObj.value.SFTS_CODE;
|
setTitle(_title);
|
const [registerDrawer, { openDrawer }] = useDrawer();
|
const [register, { resetFields, setFieldsValue, getFieldsValue, validate }] = useForm({
|
labelWidth: 120,
|
baseColProps: {
|
span: 24,
|
},
|
schemas: newFormSchema,
|
showActionButtonGroup: false,
|
});
|
|
const params: CheckRuleDtlParams = {
|
SFTS_CODE: RuleObj.value.SFTS_CODE == '0' ? buildUUID() : (RuleObj.value.ID as string),
|
};
|
const data = ref([] as any[]);
|
onMounted(async () => {
|
resetFields();
|
pagination.value = { pageSize: 6 };
|
data.value = (await getShiftDtl(params)).Items;
|
const shiftData = (await getShiftById(params)).Items as any[];
|
if (!isNullOrEmpty(shiftData)) {
|
setFieldsValue(shiftData[0]);
|
}
|
// else{
|
|
// // setFieldsValue({
|
// // ID: buildUUID(),
|
// // CHECK_TYPE:0,
|
// // CODE_LENGTH:0,
|
// // });
|
// // setFieldsValueTest({});
|
// }
|
});
|
|
function getTableAction() {
|
const tableAction = unref(tableRef);
|
if (!tableAction) {
|
throw new Error('tableAction is null');
|
}
|
return tableAction;
|
}
|
|
async function submitAll() {
|
// try {
|
// const [values, testValues] = await Promise.all([validate(), validateTestForm()]);
|
// values.ID =params.RULE_ID;
|
// const action = await SaveRule({ ...values, ...testValues });
|
// if (action.IsSuccessed) {
|
// await DeleteRuleDtl(params.RULE_ID);
|
// const dtlAction = await SaveRuleDtl(data.value);
|
// if (dtlAction.IsSuccessed) {
|
// cancel();
|
// }
|
// }
|
// } catch (error) {}
|
}
|
async function cancel() {
|
try {
|
tabStore.closeTab(currentTab, router);
|
} catch (error) {}
|
}
|
async function handleCreate() {
|
await validate();
|
openDrawer(true, {
|
RULE_ID: params.RULE_ID,
|
isUpdate: false,
|
});
|
}
|
|
function handleEdit(record: Recordable) {
|
openDrawer(true, {
|
record,
|
isUpdate: true,
|
});
|
}
|
|
function handleDelete(record: Recordable) {
|
var _data = data.value.map((item) => {
|
return item;
|
});
|
let index = _data.indexOf(record);
|
_data.splice(index, 1);
|
data.value = _data;
|
getTableAction().setProps({
|
dataSource: [],
|
});
|
getTableAction().setProps({
|
dataSource: data,
|
});
|
getTableAction().reload();
|
setData();
|
}
|
|
//新增班次明细
|
function handleSuccess(d, u) {
|
var Id = buildUUID();
|
isUpdate.value = u.isUpdate;
|
if (u.isUpdate) {
|
//更新
|
var _data = data.value.map((item) => {
|
if (item.ID == d.ID)
|
return {
|
...item,
|
SFTS_CODE: d.SFTS_CODE,
|
SFTS_NAME: d.SFTS_NAME,
|
IS_ACTIVE: d.IS_ACTIVE,
|
REMARK: d.REMARK
|
};
|
return item;
|
});
|
data.value = _data;
|
} else {
|
//新增
|
d.ID = Id;
|
d.CREATE_USER = useUserStore().getUserInfo.userId as string;
|
d.UPDATE_TIME = formatToDateTime(new Date());
|
d.UPDATE_USER = useUserStore().getUserInfo.userId as string;
|
var _data2: any[] = [];
|
if (!isEmpty(data.value)) {
|
_data2 = data.value.map((item) => {
|
return item;
|
});
|
d.RULE_SEQ =
|
data.value.reduce((maxLength, item) => {
|
return Math.max(maxLength, item.RULE_SEQ);
|
}, 0) + 1;
|
} else {
|
d.RULE_SEQ = 1;
|
}
|
// _data2.splice(0, 0, d);
|
_data2.push(d);
|
data.value = _data2;
|
}
|
|
//重新修改数据源
|
|
getTableAction().setProps({
|
dataSource: [],
|
});
|
getTableAction().setProps({
|
dataSource: data,
|
});
|
getTableAction().reload();
|
setData();
|
}
|
function setData() {
|
var CHECK_TYPE = 0;
|
var CHECK_REGEX = '^';
|
const total = data.value.reduce((length, item) => {
|
if (item.DATA_TYPE == 5) {
|
CHECK_TYPE = 1;
|
}
|
CHECK_REGEX += item.DATA_REGEX;
|
return (length += Number(item.CHECK_LENGTH) * Number(item.REPEAT_TIMES));
|
}, 0);
|
|
setFieldsValue({
|
...getFieldsValue(),
|
...{
|
CODE_LENGTH: total,
|
CHECK_TYPE: CHECK_TYPE,
|
},
|
});
|
}
|
function goBack() {
|
// 本例的效果时点击返回始终跳转到账号列表页,实际应用时可返回上一页
|
go('/shift');
|
}
|
return {
|
dtlColumns,
|
register,
|
resetFields,
|
setFieldsValue,
|
getFieldsValue,
|
validate,
|
data,
|
canResize,
|
loading,
|
striped,
|
border,
|
pagination,
|
actionColumn,
|
registerDrawer,
|
submitAll,
|
cancel,
|
tableRef,
|
goBack,
|
setData,
|
handleCreate,
|
handleEdit,
|
handleDelete,
|
handleSuccess,
|
};
|
},
|
});
|
</script>
|
<style lang="less" scoped>
|
.high-form {
|
padding-bottom: 48px;
|
}
|
</style>
|