@ganwei-web/ganwei-pc-cli 6.2.1 → 6.2.2

package/ganwei-iotcenter-index-6.2.1/packages/ganwei-iotcenter-index/src/components/indexRightContent/headerRight/processDesign/ApprovalDialog.vue

@@ -0,0 +1,147 @@
+<template>
+    <el-dialog v-model="dialogBaseProcess" width="800" top="5vh" class="base-dialog-process-details"
+        :close-on-click-modal="false">
+        <div v-loading="loading" :element-loading-text="$tt('加载中') + '...'" class="dialogBaseProcess-container">
+            <iframe :src="dialogBaseProcessUrl" frameborder="0" class="dialogBaseProcess" id="dialogBaseProcess"
+                :class="loading ? 'displayNone' : ''"></iframe>
+        </div>
+    </el-dialog>
+</template>
+<script>
+export default {
+    name: 'ApprovalDialog',
+    data() {
+        return {
+            dialogBaseProcessUrl: '',
+            loading: true,
+            timeout: null
+        }
+    },
+    props: {
+        visible: {  // 弹窗控制
+            type: Boolean,
+            default: false
+        },
+        btnLoading: {
+            type: Boolean,
+            default: false
+        },
+        item: {  // 当前操作行数据
+            type: Object,
+            default: () => ({})
+        },
+        state: {
+            type: Number,
+            default: 10
+        },
+        btcControl: {
+            type: Boolean,
+            default: false
+        }
+    },
+    inject: ['update:visible', 'close', 'approve', 'reject', 'initData'],
+    computed: {
+        dialogBaseProcess: {
+            get() {
+                return this.visible
+            },
+            set(val) {
+                this.$emit('update:visible', val)
+            }
+        }
+    },
+    mounted() {
+        this.loading = true
+        this.dialogBaseProcessUrl = this.$hostMap('ganwei-iotcenter-lowcodeformflow') + '/#/processDetails'
+        let _this = this
+        window.onmessage = (event) => {
+            console.log(event.data)
+            if (event.data.type === "processCode") {
+                switch (event.data.processCode) {
+                    case "close": _this.close(); break;
+                    case "approve": _this.approve(this.item); break;
+                    case "reject": _this.reject(this.item); break;
+                    case "initData": _this.initData(); break;
+                    default: break;
+                }
+            }
+        }
+        let messageContent = {
+            "dialogVisible": this.visible,
+            "currentItem": JSON.stringify(this.item),
+            "btcControl": this.btcControl
+        }
+        this.$nextTick(() => {
+            let dom = document.getElementById('dialogBaseProcess')
+            dom.onload = () => {
+                dom.contentWindow.postMessage(messageContent, "*")
+                this.loading = false
+            }
+            if (_this.timeout) {
+                clearTimeout(_this.timeout)
+            }
+            _this.timeout = setTimeout(function () {
+                if (dom.contentWindow.document.body.children?.length === 1) {
+                    _this.close();
+                    _this.$message.warning(_this.$tt('请在应用商店安装低代码插件!'))
+                } else {
+                    console.log('页面加载成功');
+                }
+            }, 5000);
+        })
+    },
+    methods: {
+
+        /**
+         * 翻译函数
+         * 用于获取国际化文本，支持路由前缀
+         * @param {string} str - 需要翻译的文本键值
+         * @returns {string} 翻译后的文本
+         */
+        $tt(str) {
+            // 获取当前路由
+            const currentRoute = 'login';
+            // 尝试获取完整路径的翻译
+            let fullKey = currentRoute + '.' + str;
+            let result = this.$t(fullKey);
+            // 如果完整路径的翻译不存在，则使用原始key
+            return result === fullKey ? this.$t(str) : result;
+        },
+    }
+}
+</script>
+<style lang="scss">
+.base-dialog-process-details {
+    width: 100%;
+    height: 100%;
+    background: transparent;
+
+    .el-dialog__header {
+        display: none;
+    }
+
+    .el-dialog__body {
+        height: 100% !important;
+        overflow: hidden !important;
+    }
+
+    .dialogBaseProcess-container,
+    iframe {
+        width: 800px;
+        height: 660px;
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%);
+
+        &>.el-loading-mask {
+            visibility: visible !important;
+        }
+    }
+
+    .displayNone {
+        display: none;
+    }
+
+}
+</style>

package/ganwei-iotcenter-index-6.2.1/packages/ganwei-iotcenter-index/src/components/indexRightContent/headerRight/processDesign/index.js

@@ -0,0 +1,327 @@
+
+import { mapState } from 'vuex';
+
+import ApprovalDialog from './ApprovalDialog.vue';
+export const approveStatus = {
+    "pass": 1, // 通过
+    "reject": 2, // 驳回
+    "transfer": 3, // 转办
+    "abandoned": 4, // 废弃
+    "revoke": 5 // 撤回
+}
+export default {
+    components: {
+        ApprovalDialog  // 引入审批对话框组件
+    },
+    data() {
+        return {
+            drawer: false, // 控制抽屉组件的显示状态
+            processDesignList: [], // 存储流程设计列表数据
+            processDesignLoading: false, // 控制流程设计加载状态
+            processDesignBtnLoading: '', // 控制流程设计按钮的加载状态
+            rejectLoading: "", // 拒绝审批的加载状态
+            agreeLoading: "", // 同意审批的加载状态
+            allAgreeLoading: false, // 全部同意的加载状态
+            totalMessage: window.totalMessage || 0, // 总消息数量
+            approvalDialogVisible: false, // 控制审批对话框的显示状态
+            currentItem: null, // 当前选中的项目
+            loadingMore: false, // 是否正在加载更多数据
+            noMoreData: false, // 是否没有更多数据
+            searchCriteria: {
+                searchText: '', // 搜索文本
+                pageNo: 1, // 当前页码
+                pageSize: 20, // 每页大小，减少以支持懒加载
+                userName: '' // 搜索名称
+            }
+        }
+    },
+    provide() {
+        return {
+            close: this.closeApprovalDialog,
+            reject: this.rejectApproval,
+            approve: this.agreeApproval,
+            initData: this.init
+        }
+    },
+    computed: {
+        ...mapState({
+            processesStatistics: state => state.processesStatistics, // 将 state.processesStatistics 映射为组件的计算属性 processesStatistics
+        })
+    },
+    watch: {
+        processesStatistics: {
+            handler(newVal) {
+                this.totalMessage = newVal
+                if (this.drawer) {
+                    this.init()
+                }
+            },
+            immediate: true
+        }
+    },
+    methods: {
+
+        /**
+         * 翻译函数
+         * 用于获取国际化文本，支持路由前缀
+         * @param {string} str - 需要翻译的文本键值
+         * @returns {string} 翻译后的文本
+         */
+        $tt(str) {
+            // 获取当前路由
+            const currentRoute = 'login';
+            // 尝试获取完整路径的翻译
+            let fullKey = currentRoute + '.' + str;
+            let result = this.$t(fullKey);
+            // 如果完整路径的翻译不存在，则使用原始key
+            return result === fullKey ? this.$t(str) : result;
+        },
+
+        /**
+         * 初始化方法
+         * 用于获取流程设计列表数据
+         * @param {boolean} reset - 是否重置页码和列表，默认为true
+         */
+        init(reset = true) {
+            if (reset) {
+                // 重置页码和列表
+                this.searchCriteria.pageNo = 1;
+                this.noMoreData = false;
+            }
+
+            // 构建请求数据
+            let data = this.searchCriteria
+
+            // 设置加载状态
+            if (reset) {
+                this.processDesignLoading = true;
+            } else {
+                this.loadingMore = true;
+            }
+
+            // 调用API获取审批列表
+            this.$api.getToDoMainList(data).then(rt => {
+                if (rt?.data?.code == 200) {
+                    const list = rt?.data?.data?.list || [];
+
+                    if (reset) {
+                        // 首次加载或刷新，直接替换列表
+                        this.processDesignList = list;
+                    } else {
+                        // 懒加载，追加到列表
+                        this.processDesignList = [...this.processDesignList, ...list];
+                    }
+
+                    this.totalMessage = rt?.data?.data?.totalCount || 0;
+
+                    // 如果返回的数据少于pageSize，说明没有更多数据了
+                    if (list.length < this.searchCriteria.pageSize) {
+                        this.noMoreData = true;
+                    }
+                }
+            })
+                .catch(e => {
+                    // 捕获并打印错误
+                    console.log(e)
+                }).finally((r) => {
+                    console.log(r)
+                    // 无论成功失败都会执行
+                    if (reset) {
+                        this.processDesignLoading = false;
+                    } else {
+                        this.loadingMore = false;
+                    }
+                })
+        },
+
+        /**
+         * 批量审批流程
+         * 对流程设计列表中的第一项进行批量审批操作
+         */
+        batchFlowAudit() {
+            let item = this.processDesignList.length > 0 ? this.processDesignList[0] : []
+            this.allAgreeLoading = true
+            let data =
+            {
+                "crtim": item.crtim
+            }
+            this.$api.batchFlowAudit(data).then(rt => {
+                if (rt?.data?.code == 200) {
+                    this.$message.success(rt?.data?.message)
+                } else {
+                    this.$message.warning(rt?.data?.message)
+                }
+            }).catch(e => {
+                console.log(e)
+            }).finally((r) => {
+                this.allAgreeLoading = false
+                this.init()
+                console.log(r)
+            })
+        },
+
+        /**
+         * 拒绝审批操作
+         * 对指定的审批项执行拒绝操作
+         * @param {Object} item - 需要拒绝的审批项
+         */
+        rejectApproval(item) {
+            this.rejectLoading = item.id
+            let data =
+            {
+                "id": item.id,
+                "approveStatus": approveStatus.reject,
+                "remark": "string",
+                "transferId": "string"
+            }
+            this.$api.FlowAudit(data).then(rt => {
+                if (rt?.data?.code == 200) {
+                    this.$message.success(rt?.data?.message)
+                } else {
+                    this.$message.warning(rt?.data?.message)
+                }
+            }).catch(e => {
+                console.log(e)
+            }).finally((r) => {
+                this.rejectLoading = ""
+                this.init()
+                console.log(r)
+            })
+        },
+
+        /**
+         * 同意审批的方法
+         * 对指定的审批项执行同意操作
+         * @param {Object} item - 需要审批的项目对象
+         */
+        agreeApproval(item) {
+            this.agreeLoading = item.id
+            let data =
+            {
+                "id": item.id,
+                "approveStatus": approveStatus.pass,
+                "remark": "",
+                "transferId": ""
+            }
+            this.$api.FlowAudit(data).then(rt => {
+                if (rt?.data?.code == 200) {
+                    this.$message.success(rt?.data?.message)
+                } else {
+                    this.$message.warning(rt?.data?.message)
+                }
+            }).catch(e => {
+                console.log(e)
+            }).finally((r) => {
+                this.agreeLoading = false
+                this.init()
+                console.log(r)
+            })
+        },
+
+        /**
+         * 数据处理方法
+         * 将processDesignList转换为API所需格式
+         * @return {Array} 处理后的数据数组
+         */
+        dataHandle() {
+            let arry = [], data = this.processDesignList
+            if (Array.isArray(data) && data.length > 0) {
+                // 遍历数据并格式化
+                data.forEach(item => {
+                    arry.push({
+                        pluginId: item?.id,
+                        pluginVersionId: item?.lastAssest?.id
+                    })
+                })
+            }
+            return arry
+        },
+
+        /**
+         * 打开抽屉组件
+         * 设置drawer为true并初始化数据
+         */
+        openElDrawer() {
+            this.drawer = true
+            this.init()
+        },
+
+        /**
+         * 格式化名称的方法
+         * 截取名称的第一个字符作为显示内容
+         * @param {string} name - 需要格式化的名称
+         * @returns {string} 格式化后的名称
+         */
+        formatName(name) {
+            return name.slice(0, 1);
+        },
+
+        /**
+         * 处理已完成操作
+         * 关闭抽屉并跳转到已办事宜页面
+         */
+        handleProcessed() {
+            this.drawer = false;  // 关闭抽屉
+            this.$router.push('/Index/jumpIframe/ganwei-iotcenter-lowcodeformflow/processed');  // 跳转到已办事宜页面
+        },
+
+        /**
+         * 显示审批详情弹窗
+         * 打开审批详情对话框并设置当前选中项
+         * @param {Object} item - 当前选中的审批项
+         */
+        showApprovalDetail(item) {
+            this.approvalDialogVisible = true;
+            this.currentItem = item;
+        },
+
+        /**
+         * 关闭审批详情弹窗
+         * 关闭对话框并清空当前选中项
+         */
+        closeApprovalDialog() {
+            this.approvalDialogVisible = false;
+            this.currentItem = null;
+        },
+
+        /**
+         * 处理滚动事件
+         * 检测是否滚动到底部，如果是则加载更多数据
+         */
+        handleScroll() {
+            // 如果正在加载或没有更多数据，则不处理
+            if (this.loadingMore || this.noMoreData) {
+                return;
+            }
+
+            const scrollContainer = this.$refs.scrollContainer;
+            if (!scrollContainer) return;
+
+            // 计算滚动位置
+            const scrollTop = scrollContainer.scrollTop;
+            const scrollHeight = scrollContainer.scrollHeight;
+            const clientHeight = scrollContainer.clientHeight;
+
+            // 当滚动到距离底部50px以内时，加载更多数据
+            if (scrollHeight - scrollTop - clientHeight < 50) {
+                this.loadMore();
+            }
+        },
+
+        /**
+         * 加载更多数据
+         * 增加页码并调用init方法加载下一页数据
+         */
+        loadMore() {
+            // 设置加载状态
+            this.loadingMore = true;
+
+            // 增加页码
+            this.searchCriteria.pageNo += 1;
+
+            // 调用init方法，传入false表示不清空现有数据
+            this.init(false);
+        }
+
+    }
+}