139 lines
4.1 KiB
Vue
139 lines
4.1 KiB
Vue
<template>
|
|
<BasicDrawer v-bind="$attrs" @register="registerDrawer" showFooter title="历史记录" width="60%" @ok="handleSubmit">
|
|
<BasicTable @register="registerTable" :searchInfo="searchInfo">
|
|
<template #bodyCell="{ column, record }">
|
|
<template v-if="column.key === 'action'">
|
|
<TableAction :actions="[
|
|
{
|
|
icon: 'clarity:info-standard-line',
|
|
tooltip: '查看历史记录',
|
|
onClick: handleHistory.bind(null, record),
|
|
}
|
|
]" />
|
|
</template>
|
|
</template>
|
|
|
|
</BasicTable>
|
|
</BasicDrawer>
|
|
</template>
|
|
<script lang="ts" setup>
|
|
import { ref, computed, unref, reactive, onMounted, h } from 'vue';
|
|
import { BasicDrawer, useDrawerInner } from '@/components/Drawer';
|
|
import { getLoadHistoryPage,updateScheme } from '@/api/sys/WFSchemeInfo';
|
|
import { BasicTable, useTable, TableAction } from '@/components/Table';
|
|
import { Tag, Switch } from 'ant-design-vue';
|
|
import { useMessage } from '@/hooks/web/useMessage';
|
|
const { createConfirm, createMessage } = useMessage();
|
|
defineOptions({ name: 'HistoryDrawer' });
|
|
|
|
const emit = defineEmits(['success', 'register']);
|
|
|
|
const rowId = ref('');
|
|
const searchInfo = reactive < Recordable > ({});
|
|
const schemeId = ref('')
|
|
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
|
|
setDrawerProps({ confirmLoading: false });
|
|
searchInfo.id = data.record.id
|
|
schemeId.value = data.record.schemeId
|
|
reload()
|
|
});
|
|
const [registerTable, { reload, getPaginationRef, }] = useTable({
|
|
api: getLoadHistoryPage,
|
|
columns: [
|
|
{
|
|
title: '创建人',
|
|
dataIndex: 'createUserName',
|
|
},
|
|
{
|
|
title: '创建时间',
|
|
dataIndex: 'createDate',
|
|
},
|
|
{
|
|
title: '状态',
|
|
dataIndex: 'type',
|
|
customRender: ({ record }) => {
|
|
if (record.type == 1) {
|
|
const color = 'green';
|
|
const text = '正式';
|
|
return h(Tag, { color: color }, () => text);
|
|
} else {
|
|
const color = 'blue';
|
|
const text = '草稿';
|
|
return h(Tag, { color: color }, () => text);
|
|
}
|
|
}
|
|
},
|
|
{
|
|
title: '当前版本',
|
|
dataIndex: 'enabledMark',
|
|
width: 80,
|
|
customRender: ({ record }) => {
|
|
if (!record.type) {
|
|
const color = 'blue';
|
|
const text = '草稿';
|
|
return h(Tag, { color: color }, () => text);
|
|
} else {
|
|
return h(Switch, {
|
|
checked: record.id === schemeId.value,
|
|
onChange(checked) {
|
|
const { createMessage } = useMessage();
|
|
updateScheme({ schemeId: record.id, id: searchInfo.id })
|
|
.then((data) => {
|
|
createMessage.success(data.message);
|
|
schemeId.value = record.id
|
|
reload()
|
|
})
|
|
.catch((err) => {
|
|
createMessage.error(err.message);
|
|
})
|
|
.finally(() => {
|
|
record.pendingStatus = false;
|
|
});
|
|
},
|
|
});
|
|
}
|
|
},
|
|
},
|
|
],
|
|
useSearchForm: false,
|
|
showTableSetting: false,
|
|
tableSetting: { fullScreen: true },
|
|
showIndexColumn: false,
|
|
maxHeight: 680,
|
|
rowKey: 'id',
|
|
handleSearchInfoFn(info) {
|
|
return info;
|
|
},
|
|
actionColumn: {
|
|
width: 100,
|
|
title: '操作',
|
|
dataIndex: 'action',
|
|
// slots: { customRender: 'action' },
|
|
},
|
|
});
|
|
function handleHistory(record) {
|
|
|
|
}
|
|
onMounted(() => {
|
|
});
|
|
async function handleSubmit() {
|
|
try {
|
|
const values = await validate();
|
|
let query = values
|
|
// 调用接口
|
|
if (!unref(isUpdate)) {
|
|
const data = await addRole(query);
|
|
} else {
|
|
const data = await updateRole(query);
|
|
}
|
|
|
|
|
|
setModalProps({ confirmLoading: true });
|
|
// TODO custom api
|
|
closeModal();
|
|
emit('success');
|
|
} finally {
|
|
setModalProps({ confirmLoading: false });
|
|
}
|
|
}
|
|
</script> |