初始化版本，引入智慧食堂模块，第三方模块
This commit is contained in:
zjf committed
commit
d22f88efd3
677 files changed
+69341
No files matched your search
@@ -0,0 +1,318 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row shadow="hover" class="mt-4 ml-8">
|
||||
<div class="flex justify-start">
|
||||
<el-button class="button" @click.stop="toCreateFlow(undefined)" type="primary" :icon="Plus">
|
||||
{{ $t('flow.creationProcess') }}
|
||||
</el-button>
|
||||
<popover-input @confirm="addGroupInputBlur" class="ml-4">
|
||||
<template #default>
|
||||
<el-button :icon="Plus">{{ $t('flow.creationGroup') }}</el-button>
|
||||
</template>
|
||||
</popover-input>
|
||||
</div>
|
||||
</el-row>
|
||||
|
||||
<el-tabs class="mt-4 ml-8" @tab-click="handleTabClick">
|
||||
<el-tab-pane :label="item.groupName" v-for="item in successGroupList" :key="item.id">
|
||||
<template #label>
|
||||
<div class="card-header">
|
||||
<span>{{ item.groupName }}</span>
|
||||
<span>
|
||||
<el-tooltip effect="dark" content="删除" placement="top">
|
||||
<el-button text :icon="Delete" @click.stop="deleteGroup(item.id)" circle/>
|
||||
</el-tooltip>
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
style="width: 100%"
|
||||
border
|
||||
:cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle"
|
||||
>
|
||||
<el-table-column prop="flowId" label="#" width="250"/>
|
||||
<el-table-column prop="logo" :label="$t('flow.logo')" width="80" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
<upload-img disabled v-model:imageUrl="row.logo" width="50px" height="50px"></upload-img>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" :label="$t('flow.name')" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
{{ row.name }}
|
||||
<el-tag v-if="row.stop === '1'" type="danger">已停用</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="$t('flow.createTime')" show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="rangeShow" :label="$t('flow.scopeOfUse')" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
{{ row.rangeShow && row.rangeShow.length > 0 ? row.rangeShow : $t('flow.allUser') }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('common.action')" width="300">
|
||||
<template #default="{ row }">
|
||||
<el-tooltip effect="dark" content="收藏至首页导航" placement="top" v-if="showFavorite(row)">
|
||||
<el-button text @click="toIndex(row)" :icon="Star" circle/>
|
||||
</el-tooltip>
|
||||
<el-tooltip effect="dark" content="编辑" placement="top">
|
||||
<el-button text @click="toEditFlow(row)" :icon="Edit" circle/>
|
||||
</el-tooltip>
|
||||
<el-tooltip effect="dark" content="复制" placement="top">
|
||||
<el-button text @click="toCopyFlow(row)" :icon="DocumentCopy" circle/>
|
||||
</el-tooltip>
|
||||
<el-tooltip v-if="row.stop === '0'" effect="dark" content="停用" placement="top">
|
||||
<el-button @click="showDisableConfirm(row)" text :icon="Hide" circle/>
|
||||
</el-tooltip>
|
||||
|
||||
<el-tooltip v-else effect="dark" content="启用" placement="top">
|
||||
<el-button @click="showEnableConfirm(row)" text :icon="View" circle/>
|
||||
</el-tooltip>
|
||||
|
||||
<el-tooltip effect="dark" content="删除" placement="top">
|
||||
<el-button text @click="showDeleteConfirm(row)" :icon="Delete" circle/>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination"/>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="flowGroup">
|
||||
import {Star, Plus, Delete, Edit, DocumentCopy, Hide, View} from '@element-plus/icons-vue';
|
||||
import {addGroup, delGroup, queryGroupList, queryGroupFlowList} from '/@/api/flow/group';
|
||||
import {disableFlow, enableFlow, deleteFlow} from '/@/api/flow/flow';
|
||||
import {GroupVO} from '/@/api/flow/group/types';
|
||||
import {useRouter} from 'vue-router';
|
||||
import {ElMessage, ElMessageBox} from 'element-plus';
|
||||
import {BasicTableProps, useTable} from '/@/hooks/table';
|
||||
import {useTagsViewRoutes} from "/@/stores/tagsViewRoutes";
|
||||
import {useMessage} from "/@/hooks/message";
|
||||
import {storeToRefs} from "pinia";
|
||||
|
||||
const storesTagsViewRoutes = useTagsViewRoutes();
|
||||
|
||||
// 默认查询
|
||||
const handleQueryFlowPage = (params: any) => {
|
||||
if (successGroupList && !state.queryForm.groupId) {
|
||||
params.groupId = successGroupList.value[0].id;
|
||||
}
|
||||
return queryGroupFlowList(params);
|
||||
};
|
||||
|
||||
// 定义基础表格相关的状态及方法
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {
|
||||
groupId: '',
|
||||
},
|
||||
pagination: {
|
||||
size: 5,
|
||||
current: 1,
|
||||
},
|
||||
createdIsNeed: false,
|
||||
pageList: handleQueryFlowPage,
|
||||
descs: ['create_time'],
|
||||
});
|
||||
|
||||
const {getDataList, sizeChangeHandle, currentChangeHandle, tableStyle} = useTable(state);
|
||||
|
||||
// 异步加载PopoverInput组件
|
||||
const PopoverInput = defineAsyncComponent(() => import('/@/components/PopoverInput/index.vue'));
|
||||
|
||||
// 存储成功的分组列表
|
||||
const successGroupList = ref<GroupVO[]>([]);
|
||||
|
||||
// 失去焦点时触发新增分组名称
|
||||
const addGroupInputBlur = (groupName: string) => {
|
||||
if (!groupName) {
|
||||
return;
|
||||
}
|
||||
addGroup({groupName: groupName}).then(() => {
|
||||
ElMessage.success('新增成功');
|
||||
handleQuery();
|
||||
});
|
||||
};
|
||||
|
||||
// 切换查询
|
||||
const handleTabClick = (pane?: any) => {
|
||||
if (successGroupList) {
|
||||
state.queryForm.groupId = successGroupList.value[pane.paneName].id;
|
||||
}
|
||||
getDataList();
|
||||
};
|
||||
|
||||
/**
|
||||
* 判断是否可以加入首页收藏
|
||||
* @param row
|
||||
*/
|
||||
const showFavorite = (row) => {
|
||||
|
||||
if (favoriteRoutes.value.length === 0) {
|
||||
return true
|
||||
}
|
||||
|
||||
return !favoriteRoutes.value.find(o => o.path.includes(row.flowId))
|
||||
}
|
||||
|
||||
// 路由实例
|
||||
const router = useRouter();
|
||||
|
||||
// 跳转到创建流程页
|
||||
const toCreateFlow = (id) => {
|
||||
let to = '/flow/create/all';
|
||||
if (id) {
|
||||
to = to + '?groupId=' + id;
|
||||
}
|
||||
router.push(to);
|
||||
};
|
||||
|
||||
// 跳转到编辑流程页
|
||||
const {favoriteRoutes} = storeToRefs(storesTagsViewRoutes);
|
||||
|
||||
const toIndex = (flow) => {
|
||||
const route: RouteItem = {
|
||||
name: flow.name,
|
||||
path: '/flow/list/index?flowId=' + flow.flowId,
|
||||
meta: {
|
||||
icon: 'fa fa-play'
|
||||
}
|
||||
}
|
||||
|
||||
if (!favoriteRoutes.value.find((o) => o.path === route.path)) {
|
||||
storesTagsViewRoutes.setFavoriteRoutes(route);
|
||||
useMessage().success('收藏成功，可在首页直接发起流程')
|
||||
} else {
|
||||
useMessage().error('已经存在收藏');
|
||||
}
|
||||
};
|
||||
|
||||
// 跳转到编辑流程页
|
||||
const toEditFlow = (flow) => {
|
||||
let to = '/flow/create/all?flowId=' + flow.flowId;
|
||||
router.push(to);
|
||||
};
|
||||
|
||||
// 跳转到复制流程页
|
||||
const toCopyFlow = (flow) => {
|
||||
let to = '/flow/create/all?cp=1&flowId=' + flow.flowId;
|
||||
router.push(to);
|
||||
};
|
||||
|
||||
// 显示停用确认弹窗
|
||||
const showDisableConfirm = (flow) => {
|
||||
ElMessageBox.confirm('确定要停用该流程吗?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}).then(() => {
|
||||
disableFlow(flow.flowId).then((res) => {
|
||||
handleQuery();
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
// 显示启用确认弹窗
|
||||
const showEnableConfirm = (flow) => {
|
||||
ElMessageBox.confirm('确定要启用该流程吗?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}).then(() => {
|
||||
enableFlow(flow.flowId).then((res) => {
|
||||
handleQuery();
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
// 显示删除确认弹窗
|
||||
const showDeleteConfirm = (flow) => {
|
||||
ElMessageBox.confirm('确定要删除该流程吗?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}).then(() => {
|
||||
deleteFlow(flow.flowId).then((res) => {
|
||||
handleQuery();
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
// 组件挂载后执行查询操作
|
||||
onMounted(() => {
|
||||
handleQuery();
|
||||
});
|
||||
|
||||
// 查询分组列表
|
||||
const handleQuery = () => {
|
||||
queryGroupList().then((res) => {
|
||||
const {data} = res;
|
||||
successGroupList.value = data;
|
||||
if (data.length > 0) {
|
||||
getDataList();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 删除分组
|
||||
const deleteGroup = async (id) => {
|
||||
state.queryForm.groupId = id;
|
||||
await getDataList();
|
||||
// 获取当前
|
||||
if (state.pagination?.total > 0) {
|
||||
ElMessage.warning('删除失败,存在可用流程');
|
||||
return;
|
||||
}
|
||||
|
||||
delGroup(id).then(() => {
|
||||
ElMessage.success('删除成功');
|
||||
handleQuery();
|
||||
});
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.card-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 60px;
|
||||
padding-top: 5px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
> div:nth-child(2) > div:first-child {
|
||||
font-size: 15px;
|
||||
height: 30px;
|
||||
font-weight: bolder;
|
||||
line-height: 30px;
|
||||
}
|
||||
|
||||
> div:nth-child(2) > div:last-child {
|
||||
font-size: 12px;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.box-card {
|
||||
width: 80%;
|
||||
margin-left: 10%;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.menu-right {
|
||||
width: 250px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
Reference in new issue
Block a user