工作流列表页增加版本信息++
This commit is contained in:
parent
e0e608e329
commit
55c9130d18
@ -57,6 +57,7 @@
|
||||
"@sa/hooks": "workspace:*",
|
||||
"@sa/materials": "workspace:*",
|
||||
"@sa/utils": "workspace:*",
|
||||
"@vicons/fluent": "^0.13.0",
|
||||
"@vueuse/core": "12.5.0",
|
||||
"clipboard": "2.0.11",
|
||||
"dayjs": "1.11.13",
|
||||
|
@ -41,6 +41,9 @@ importers:
|
||||
'@sa/utils':
|
||||
specifier: workspace:*
|
||||
version: link:packages/utils
|
||||
'@vicons/fluent':
|
||||
specifier: ^0.13.0
|
||||
version: 0.13.0
|
||||
'@vueuse/core':
|
||||
specifier: 12.5.0
|
||||
version: 12.5.0(typescript@5.7.3)
|
||||
@ -1639,6 +1642,9 @@ packages:
|
||||
peerDependencies:
|
||||
vite: ^2.9.0 || ^3.0.0-0 || ^4.0.0 || ^5.0.0-0 || ^6.0.0-0
|
||||
|
||||
'@vicons/fluent@0.13.0':
|
||||
resolution: {integrity: sha512-bYGZsOE3qzvm3Cm43e7tybgGlr5ZUpYqtRZq0g0Tfupe8jIzLolpvQLNUt1zS8Mgt6goTbUk5YH7Fkv16jkykg==}
|
||||
|
||||
'@vitejs/plugin-vue-jsx@4.1.1':
|
||||
resolution: {integrity: sha512-uMJqv/7u1zz/9NbWAD3XdjaY20tKTf17XVfQ9zq4wY1BjsB/PjpJPMe2xiG39QpP4ZdhYNhm4Hvo66uJrykNLA==}
|
||||
engines: {node: ^18.0.0 || >=20.0.0}
|
||||
@ -6350,6 +6356,8 @@ snapshots:
|
||||
- supports-color
|
||||
- vue
|
||||
|
||||
'@vicons/fluent@0.13.0': {}
|
||||
|
||||
'@vitejs/plugin-vue-jsx@4.1.1(vite@6.1.0(@types/node@22.13.1)(jiti@2.4.2)(sass@1.84.0)(tsx@4.19.2)(yaml@2.7.0))(vue@3.5.13(typescript@5.7.3))':
|
||||
dependencies:
|
||||
'@babel/core': 7.26.0
|
||||
|
@ -158,3 +158,10 @@ export function fetchWorkflowHistoryDetail(id: string, version: string) {
|
||||
method: 'get'
|
||||
});
|
||||
}
|
||||
|
||||
export function fetchDeleteWorkflowHistory(id: string ,version: string) {
|
||||
return request({
|
||||
url: `/workflow/history/del/${id}?version=${version}`,
|
||||
method: 'get'
|
||||
});
|
||||
}
|
||||
|
@ -1,9 +1,16 @@
|
||||
<script setup lang="tsx">
|
||||
import { NButton, NDropdown, NPopconfirm, NTag } from 'naive-ui';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { ref } from 'vue';
|
||||
import {ref, h} from 'vue';
|
||||
import { useBoolean } from '@sa/hooks';
|
||||
import { fetchBatchDeleteWorkflow, fetchGetWorkflowPageList, fetchUpdateWorkflowStatus } from '@/service/api';
|
||||
import {
|
||||
fetchBatchDeleteWorkflow,
|
||||
fetchDeleteWorkflowHistory,
|
||||
fetchGetWorkflowPageList,
|
||||
fetchUpdateWorkflowStatus, fetchWorkflowHistory
|
||||
} from '@/service/api';
|
||||
import index from "@/views/namespace/index.vue";
|
||||
|
||||
import { $t } from '@/locales';
|
||||
import { useAppStore } from '@/store/modules/app';
|
||||
import { useTable, useTableOperate } from '@/hooks/common/table';
|
||||
@ -15,7 +22,9 @@ import { downloadFetch } from '@/utils/download';
|
||||
import { useRouterPush } from '@/hooks/common/router';
|
||||
import WorkflowSearch from './modules/workflow-search.vue';
|
||||
import WorkflowTriggerModal from './modules/workflow-trigger-modal.vue';
|
||||
|
||||
// import { DeleteTwotone } from '@vicons'
|
||||
import Delete24Regular from '@vicons/fluent/Delete24Regular'
|
||||
import BookSearch20Regular from '@vicons/fluent/BookSearch20Regular'
|
||||
const { hasAuth } = useAuth();
|
||||
|
||||
const router = useRouter();
|
||||
@ -24,7 +33,90 @@ const { routerPushByKey } = useRouterPush();
|
||||
|
||||
const triggerData = ref<Api.Workflow.Workflow | null>();
|
||||
const { bool: triggerVisible, setTrue: openTriggerModal } = useBoolean(false);
|
||||
const showModal = ref(false);
|
||||
const bodyStyle = ref({
|
||||
width: '900px'
|
||||
});
|
||||
const verData = ref();
|
||||
const rowClassName = (row:any) => {
|
||||
console.log(row);
|
||||
return row.version === 0 ? 'current-version-row' : ''
|
||||
}
|
||||
const pagination= ref(
|
||||
{
|
||||
pageSize: 5
|
||||
}
|
||||
)
|
||||
const verColumns = ref([
|
||||
{
|
||||
key: 'id',
|
||||
title: $t('common.index'),
|
||||
align: 'center',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
key: 'version',
|
||||
title: '版本',
|
||||
align: 'center',
|
||||
width: 120,
|
||||
// render: (row) => `v${row.version}`
|
||||
render(row:any,index:any) {
|
||||
return h('div', {
|
||||
class: index === 0 ? 'brush-mark' : '',
|
||||
style: { display: 'inline-block' }
|
||||
}, `v${row.version}`)
|
||||
}
|
||||
},
|
||||
{
|
||||
key: 'workflowName',
|
||||
title: '描述',
|
||||
align: 'center',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
key: 'createDt',
|
||||
title: '创建时间',
|
||||
align: 'center',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
key: 'operate',
|
||||
title: $t('common.operate'),
|
||||
align: 'center',
|
||||
fixed: 'right',
|
||||
width: 200,
|
||||
render: (row:any, { index:any }) => {
|
||||
console.log(index)
|
||||
return (
|
||||
<div class="flex-center gap-8px">
|
||||
<NButton text type="warning" ghost size="small" onClick={() => detail(row.id!)}>
|
||||
<n-icon size="26" color="#0e7a0d">
|
||||
<BookSearch20Regular />
|
||||
</n-icon>
|
||||
</NButton>
|
||||
|
||||
<n-divider vertical />
|
||||
|
||||
<div class="flex-center">
|
||||
<NPopconfirm onPositiveClick={() => handleDeleteVer(row.id,row.version)} >
|
||||
{{
|
||||
default: () => $t('common.confirmDelete'),
|
||||
trigger: () => (
|
||||
<NButton quaternary type="error" size="small" disabled={!row || index === undefined}>
|
||||
<n-icon size="26" color="#0e7a0d">
|
||||
<Delete24Regular />
|
||||
</n-icon>
|
||||
</NButton>
|
||||
)
|
||||
}}
|
||||
</NPopconfirm>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
]);
|
||||
const { columns, columnChecks, data, getData, loading, mobilePagination, searchParams, resetSearchParams } = useTable({
|
||||
apiFn: fetchGetWorkflowPageList,
|
||||
apiParams: {
|
||||
@ -170,6 +262,16 @@ const { columns, columnChecks, data, getData, loading, mobilePagination, searchP
|
||||
</NPopconfirm>
|
||||
</div>
|
||||
)
|
||||
},
|
||||
{
|
||||
type: 'divider',
|
||||
key: 'd2'
|
||||
},
|
||||
{
|
||||
// type:'render',
|
||||
label: '版本',
|
||||
key: 'version',
|
||||
click: () => showVer(row.id!)
|
||||
}
|
||||
];
|
||||
|
||||
@ -228,6 +330,16 @@ async function handleDelete(id: string) {
|
||||
onDeleted();
|
||||
}
|
||||
|
||||
async function handleDeleteVer(id: string,version:string){
|
||||
// request
|
||||
const { error } = await fetchDeleteWorkflowHistory(id,version);
|
||||
if (!error){
|
||||
const { data, error } = await fetchWorkflowHistory(id);
|
||||
verData.value = data
|
||||
} return;
|
||||
|
||||
|
||||
}
|
||||
function edit(id: string) {
|
||||
router.push({ path: '/workflow/form/edit', query: { id } });
|
||||
}
|
||||
@ -244,9 +356,25 @@ function copy(id: string) {
|
||||
router.push({ path: '/workflow/form/copy', query: { id } });
|
||||
}
|
||||
|
||||
// function batch(id: string) {
|
||||
// router.push({ path: '/workflow/batch', state: { workflowId: id } });
|
||||
// }
|
||||
async function showVer(id: string){
|
||||
console.log(id);
|
||||
showModal.value = true;
|
||||
console.log(showModal.value)
|
||||
const { data, error } = await fetchWorkflowHistory(id);
|
||||
if (!error) {
|
||||
verData.value = data
|
||||
console.log("verData"+verData.value)
|
||||
} else {
|
||||
|
||||
window.$message?.error('获取工作流历史版本失败');
|
||||
}
|
||||
//请求数据
|
||||
}
|
||||
|
||||
function dispVer(){
|
||||
// showModal.value = false;
|
||||
|
||||
}
|
||||
|
||||
async function execute(row: Api.Workflow.Workflow) {
|
||||
triggerData.value = row;
|
||||
@ -326,9 +454,64 @@ function goToBatch(workflowId: string) {
|
||||
:pagination="mobilePagination"
|
||||
class="sm:h-full"
|
||||
/>
|
||||
<n-modal
|
||||
v-model:show="showModal"
|
||||
class="custom-card"
|
||||
preset="card"
|
||||
title="版本信息"
|
||||
size="huge"
|
||||
:bordered="false"
|
||||
:style="bodyStyle"
|
||||
>
|
||||
<template #header-extra>
|
||||
</template>
|
||||
<n-data-table
|
||||
size="small"
|
||||
:columns="verColumns"
|
||||
:data="verData"
|
||||
:row-props:any="rowClassName"
|
||||
:pagination="pagination"
|
||||
/>
|
||||
<template #footer>
|
||||
<!-- <n-flex justify="end">-->
|
||||
<!-- <n-button strong secondary round type="info" :on-click="dispVer()">-->
|
||||
<!-- 关闭-->
|
||||
<!-- </n-button>-->
|
||||
<!-- </n-flex>-->
|
||||
</template>
|
||||
</n-modal>
|
||||
</NCard>
|
||||
<WorkflowTriggerModal v-model:visible="triggerVisible" :row-data="triggerData" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
<style scoped>
|
||||
:deep(.brush-mark) {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding: 0 2px;
|
||||
}
|
||||
|
||||
:deep(.brush-mark::after) {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: -27px;
|
||||
bottom: 2px;
|
||||
width: 80px ;
|
||||
height: 24px;
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
rgba(255, 165, 0, 0.2),
|
||||
rgba(255, 165, 0, 0.5) 50%,
|
||||
rgba(255, 165, 0, 0.2)
|
||||
);
|
||||
z-index: -1;
|
||||
transform: rotate(-1deg) skewX(-10deg);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
:deep(.current-version-row td) {
|
||||
background-color: #fff8e6;
|
||||
font-weight: 500;
|
||||
}
|
||||
</style>
|
||||
|
Loading…
Reference in New Issue
Block a user