ui-process-h5 0.1.36 → 0.1.40

package/src/packages/process/operation/restart.vue

@@ -0,0 +1,305 @@
+<template>
+    <div class="process-popup-content">
+        <template>
+            <div class="process-pc-label">
+                {{ getFirstProcessNode.name }}
+                <br />
+                审批人:
+            </div>
+            <div
+                class="process-pc-value"
+                @click="handleOpenPopup(getFirstProcessNode.id)"
+            >
+                <div class="process-pc-value--people">
+                    <div
+                        class="process-pc-value--data"
+                        v-if="
+                            partNode[getFirstProcessNode.id] &&
+                            partNode[getFirstProcessNode.id].length
+                        "
+                    >
+                        <span
+                            v-for="(v, i) in partNode[getFirstProcessNode.id]"
+                        >
+                            {{ i == 0 ? v : `,${v}` }}
+                        </span>
+                    </div>
+                    <div
+                        v-else
+                        class="process-pc-value--data"
+                        style="color: #888;"
+                    >
+                        <span>
+                            请选择审批人
+                        </span>
+                    </div>
+                </div>
+            </div>
+        </template>
+        <TopTips
+            ref="topTips"
+            :text="textTips"
+            :statusTips="statusTips"
+            :type="typeTips"
+        />
+        <TopPopup
+            v-bind:visible="visible"
+            v-on:update:visible="(val) => (visible = val)"
+            titleText="选人"
+            :isDrawer="true"
+        >
+            <departPerson
+                :visible.sync="visible"
+                :request="param.request"
+                :businessId="param.formData.businessKey"
+                v-bind="entity"
+                @callback="handleCallback"
+                @cancel="handleCancel"
+            >
+            </departPerson>
+        </TopPopup>
+    </div>
+</template>
+<script>
+import TopTips from "../../tip/index.vue";
+import attchViews from "../../attchUpload/index.vue";
+import TopPopup from "../../popup/index.vue";
+import { departPerson } from "checked-pick-app";
+export default {
+    name: "restart",
+    props: {
+        param: {
+            type: Object,
+            defalut: () => {},
+        },
+    },
+    components: {
+        TopTips,
+        attchViews,
+        TopPopup,
+        departPerson,
+    },
+    data() {
+        return {
+            commentMsg: "",
+            style: {
+                color: "#333",
+                disableColor: "#F7F6F6",
+            },
+            textTips: "",
+            statusTips: false,
+            typeTips: "success",
+            // annex 附件属性
+            limit: "",
+            requires: "",
+            labels: "",
+            otherList: "",
+            attchLists: [],
+            // next
+            nextNodeData: [],
+            taskNode: [],
+
+            outGatewayUserTaskModel: [],
+            formData: {},
+
+            // 选人组件
+            visible: false,
+            entity: {
+                source: "0",
+                type: "0", //'http://59.53.91.231:2100' 0002
+                businessId: this.param.businessKey,
+                codeType: [3], // 可选类型 1-主体 2-部门 3-人员
+                multiple: true, // 是否多选
+            },
+            /* {
+                source: "0",
+                type: "0",
+                request: this.param.request, //'http://59.53.91.231:2100' 0002
+                businessId: "6a9aaf5742572e82b5d89d6f7e52e2f2",
+                codeType: [3], // 可选类型 1-主体 2-部门 3-人员
+                multiple: true, // 是否多选
+            } */
+            // 存储选人信息
+            multiNodeParticipant: {},
+            // 当前评估对象
+            partObjId: [],
+            // 选中人员信息
+            partNode: {},
+            getFirstProcessNode: {},
+        };
+    },
+    watch: {
+        param: {
+            handler(val, preVal) {
+                console.log("handler::::", val);
+                this.getFirstProcessNode = val.getFirstProcessNode;
+                if (val.getFirstProcessNode && this.getFirstProcessNode) {
+                    if (
+                        val.getFirstProcessNode.type == "userTask" ||
+                        val.getFirstProcessNode.type == "UserTaskModel"
+                    ) {
+                        this.entity.multiple = false;
+                        this.entity.codeType = [3];
+                        this.entity.source = "1";
+                    } else if (
+                        val.getFirstProcessNode.type == "ExclusiveGatewayModel"
+                    ) {
+                    } else if (
+                        val.getFirstProcessNode.type == "InclusiveGatewayModel"
+                    ) {
+                    }
+                }
+            },
+            immediate: true,
+            deep: true,
+        },
+    },
+    created() {
+        console.log("isVue2", this.param);
+    },
+    methods: {
+        handleOpenPopup(id) {
+            this.visible = true;
+            this.partObjId = id;
+        },
+        async confirm() {
+            let params = {
+                isClearHistory: false,
+                processInstId: this.param.processInstId,
+                reactivateReason: "重新提交",
+                multiNodeParticipant: this.multiNodeParticipant,
+            };
+            this.handleTips("", true, "loading");
+            await this.param.request
+                .post("/aws/pis/reactivate", params)
+                .then((res) => {
+                    if (res.code == 200) {
+                        this.$emit("handleClosePopup1");
+                        this.handleTips("提交成功!", false, "success");
+                        this.handleFinal();
+                    } else {
+                        this.handleTips(res.msg, true, "error");
+                    }
+                });
+        },
+
+        handleCallback(res) {
+            this.multiNodeParticipant[this.partObjId] = [];
+            this.partNode[this.partObjId] = [];
+            res.map((v, i) => {
+                this.multiNodeParticipant[this.partObjId].push(v.uid);
+                this.partNode[this.partObjId].push(v.name);
+            });
+            console.log("callback_OK", res, this.multiNodeParticipant);
+        },
+        handleCancel() {
+            console.log("cancel_No");
+        },
+
+        isOption(humanPerformer) {
+            return (
+                humanPerformer == "任意指定" ||
+                humanPerformer == "固定部门" ||
+                humanPerformer == "固定单位" ||
+                humanPerformer == "与流程申请人所在组织结构的位置相关" ||
+                humanPerformer == "固定群组"
+            );
+        },
+
+        handleTips(text, status, type) {
+            this.textTips = text;
+            this.statusTips = status;
+            this.typeTips = type;
+            this.$refs.topTips.handleOpen();
+        },
+
+        handleFinal() {
+            if (this.param.endFunction) {
+                this.param.endFunction();
+            }
+        },
+    },
+};
+</script>
+<style scoped>
+.process-popup-content {
+    flex: 1;
+}
+
+.process-popup-content .process-pc-label {
+    font-size: 15px;
+    display: flex;
+    align-items: center;
+    font-weight: 400;
+    color: #333333;
+    padding-top: 20px;
+    padding-bottom: 5px;
+}
+
+.process-popup-content .process-pc-value .van-field {
+    border-bottom: 1px solid #e8e8e8;
+    padding: 0;
+}
+
+.input-padding {
+    padding: 0;
+}
+
+.process-popup-textarea {
+    position: relative;
+    width: 100%;
+    height: 62px;
+    min-height: 62px;
+}
+
+.process-popup-textarea::after {
+    position: absolute;
+    content: "";
+    width: 100%;
+    height: 1px;
+    background-color: #f2f2f2;
+    bottom: 0;
+    left: 0;
+}
+
+.process-popup-textarea .textarea-item {
+    resize: none;
+    background: none;
+    color: inherit;
+    opacity: 1;
+    font: inherit;
+    line-height: inherit;
+    letter-spacing: inherit;
+    text-align: inherit;
+    text-indent: inherit;
+    text-transform: inherit;
+    text-shadow: inherit;
+    outline: none;
+    border: none;
+    padding: 0;
+    margin: 0;
+    text-decoration: inherit;
+    height: 100%;
+}
+.process-pc-label--re {
+    color: #ee0000;
+}
+
+.process-pc-value--people {
+    width: 100%;
+    height: 43px;
+    padding: 10px 26px 10px 0;
+    box-sizing: border-box;
+    position: relative;
+}
+
+.process-pc-value--people::after {
+    position: absolute;
+    content: "";
+    width: 100%;
+    height: 1px;
+    background-color: #e8e8e8;
+    bottom: 0;
+    left: 0;
+}
+</style>

package/src/packages/submitPopup/index.js

@@ -0,0 +1,296 @@
+import { defineComponent } from "vue-demi";
+import TopPopup from "../popup/index.vue";
+import TopDownSelect from "../downSelect/index.vue";
+import PreviewImage from "../previewImage/index.vue";
+import { departPerson } from "checked-pick-app";
+import TopTips from "../tip/index.vue";
+
+export default defineComponent({
+    name: "TopSubmitPopup",
+    components: {
+        TopPopup,
+        TopDownSelect,
+        PreviewImage,
+        departPerson,
+        TopTips,
+    },
+    props: {
+        visible: {
+            type: Boolean,
+            default: false,
+        },
+        // 请求
+        request: {
+            type: Function,
+            default: () => {
+                return { get: () => {}, post: () => {}, upload: () => {} };
+            },
+        },
+        // appid
+        appId: {
+            type: String,
+            default: "",
+        },
+        // 区分
+        processName: {
+            type: String,
+            default: "",
+        },
+        // 是否为重新提交
+        resubmit: {
+            type: Boolean,
+            default: false,
+        },
+        // 业务id
+        id: {
+            type: String,
+            default: "",
+        },
+        // 业务
+        businessType: {
+            type: [String, Number],
+        },
+        // todoParameter
+        todoParameter: {
+            type: Object,
+            default() {
+                return {};
+            },
+        },
+        // 是否清除送审记录
+        isClearHistory: {
+            type: Boolean,
+            default: false,
+        },
+        // title
+        title: {
+            type: String,
+            default: "测试",
+        },
+    },
+    data() {
+        return {
+            show: false,
+            option: [],
+            checkedItem: {},
+            personList: [],
+            trackUrl: [],
+            taskurlshow: false,
+            isStyle: "width:35%",
+            visiblePerson: false,
+            entity: {
+                source: "0",
+                type: "0",
+                request: this.request, //'http://59.53.91.231:2100' 0002
+                /*  businessId: this.param.businessKey, */
+                codeType: [3], // 可选类型 1-主体 2-部门 3-人员
+                multiple: false, // 是否多选
+            },
+
+            multiNodeParticipant: {},
+            partNode: {},
+            personObjId: "",
+
+            //  流程id
+            processId: "",
+
+            // 提示弹窗
+            textTips: "",
+            statusTips: false,
+            typeTips: "success",
+            firstPerson: [],
+            //
+        };
+    },
+    watch: {
+        visible: {
+            async handler(val, preVal) {
+                this.show = val;
+                this.$emit("update:visible", this.show);
+
+                // 流程列表
+                await this.request
+                    .get("/aws/repository/getProcessDefList", {
+                        params: {
+                            appId: this.appId,
+                        },
+                    })
+                    .then((res) => {
+                        console.log("获取流程::", res);
+                        if (res.code == 200) {
+                            this.option = res.data;
+                            this.checkedItem = this.option[0];
+                            this.getAfferentParticipantNodeList();
+                            this.getDiagramUrl();
+                        }
+                    });
+
+                // 第一个流程节点
+                await this.request
+                    .get("/aws/repository/getFirstProcessNode", {
+                        params: {
+                            processDefId: this.checkedItem.id,
+                        },
+                    })
+                    .then((res) => {
+                        // console.log("getFirstProcessNode", res);
+                        if (res.code === 200) {
+                            this.firstPerson = res.data;
+                        }
+                    });
+            },
+            immediate: true,
+        },
+    },
+
+    methods: {
+        handleChange(item) {
+            console.log("当前选择::::", item);
+            this.checkedItem = item;
+            this.getAfferentParticipantNodeList();
+            this.getDiagramUrl();
+        },
+        // 获取当前流程下所有节点
+        getAfferentParticipantNodeList() {
+            this.request
+                .get("/aws/repository/getAfferentParticipantNodeList", {
+                    params: {
+                        processDefId: this.checkedItem.id,
+                    },
+                })
+                .then((res) => {
+                    if (res.code == 200) {
+                        this.personList = res.data.slice(1);
+                    }
+                });
+        },
+        // 获取流程图
+        getDiagramUrl() {
+            this.request
+                .get("/aws/repository/getDiagramUrl", {
+                    params: {
+                        processDefId: this.checkedItem.id,
+                        diagramType: 1,
+                        type: "pc",
+                    },
+                })
+                .then((res) => {
+                    if (res.code == 200) {
+                        this.trackUrl = [res.data];
+                    }
+                });
+        },
+        // 呼出选人
+        handleOpenPerson(item) {
+            console.log("选人弹窗", item);
+            this.visiblePerson = true;
+            this.personObjId = item.id;
+        },
+        handleCallback(res) {
+            this.multiNodeParticipant[this.personObjId] = [];
+            this.partNode[this.personObjId] = [];
+            res.map((v, i) => {
+                this.multiNodeParticipant[this.personObjId].push(v.uid);
+                this.partNode[this.personObjId].push(v.name);
+            });
+            console.log("callback_OK", res, this.multiNodeParticipant);
+        },
+        handleCancel() {
+            console.log("cancel_No");
+        },
+        async handleSumbit() {
+            // 验证
+            if (this.firstPerson && this.firstPerson.length) {
+                if (!this.multiNodeParticipant[this.firstPerson[0].id]) {
+                    this.handleTips(
+                        `${this.firstPerson[0].name}节点未选择审批人`,
+                        true,
+                        "error"
+                    );
+                    return;
+                }
+            }
+
+            // 送审
+            this.handleTips("", true, "loading");
+            if (this.resubmit) {
+                console.log("送审重新提交", this.multiNodeParticipant);
+                await this.request
+                    .post("/aws/pis/reactivate", {
+                        processInstId:
+                            this.processId ||
+                            "572405e4-e0dc-40fc-9a95-2b20f5bdfbf1",
+                        isClearHistory: this.isClearHistory,
+                        reactivateReason: "重新提交",
+                        multiNodeParticipant: this.multiNodeParticipant,
+                    })
+                    .then((res) => {
+                        if (res.code == 200) {
+                            this.show = false;
+                            this.handleTips("提交成功!", false, "success");
+                        } else {
+                            this.handleTips(res.msg, true, "error");
+                        }
+                    })
+                    .catch((error) => {
+                        this.handleTips(error.msg, true, "error");
+                    });
+            } else {
+                console.log("送审首次提交", this.multiNodeParticipant);
+                await this.request
+                    .post("/aws/pis/createAndStart", {
+                        title: this.title,
+                        processDefId: this.checkedItem.id,
+                        processBusinessKey: this.id,
+                        showType: "app",
+                        businessType: this.businessType,
+                        multiNodeParticipant: this.multiNodeParticipant,
+                        todoParameter: this.todoParameter,
+                    })
+                    .then((res) => {
+                        if (res.code === 200) {
+                            this.show = false;
+                            this.handleTips("提交成功!", false, "success");
+                        } else if (res.code == 499) {
+                            this.request
+                                .post("/aws/pis/reactivate", {
+                                    processInstId:
+                                        this.processId ||
+                                        "572405e4-e0dc-40fc-9a95-2b20f5bdfbf1",
+                                    isClearHistory: this.isClearHistory,
+                                    reactivateReason: "重新提交",
+                                    multiNodeParticipant: this
+                                        .multiNodeParticipant,
+                                })
+                                .then((res) => {
+                                    if (res.code == 200) {
+                                        this.show = false;
+                                        this.handleTips(
+                                            "提交成功!",
+                                            false,
+                                            "success"
+                                        );
+                                    } else {
+                                        this.handleTips(res.msg, true, "error");
+                                    }
+                                })
+                                .catch((error) => {
+                                    this.handleTips(error.msg, true, "error");
+                                });
+                        } else {
+                            this.handleTips(res.msg, true, "error");
+                        }
+                    })
+                    .catch((error) => {
+                        this.handleTips(error.msg, true, "error");
+                    });
+            }
+        },
+        handleTips(text, status, type) {
+            this.textTips = text;
+            this.statusTips = status;
+            this.typeTips = type;
+            this.$refs.topTips.handleOpen();
+        },
+    },
+});

package/src/packages/submitPopup/index.scss

@@ -0,0 +1,83 @@
+.textnone {
+    text-align: center;
+    margin-top: 30px;
+    color: #999;
+    font-size: 14px;
+}
+
+.viewTrack {
+    width: 100%;
+    height: 48px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-size: 15px;
+    color: #1389ff;
+}
+
+.person-views {
+    .views-items {
+        width: 100%;
+        height: 48px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        font-size: 15px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        padding: 0 20px;
+        box-sizing: border-box;
+
+        &-set {
+            width: 50%;
+            display: flex;
+            flex-basis: fit-content;
+            align-items: center;
+            &-btn {
+                color: #1389ff;
+                margin-left: 10px;
+                min-width: 30px;
+            }
+        }
+
+        &-name {
+            width: 50%;
+            &--re {
+                color: #ee0000;
+            }
+        }
+    }
+
+    &-white{
+        text-align: center;
+    }
+}
+
+.person-btn {
+    display: flex;
+    min-height: 60px;
+    padding-top: 5px;
+    background: #fff;
+    border-top: 1px solid #dddddf9e;
+    box-sizing: border-box;
+    justify-content: center;
+    align-items: center;
+    flex-direction: row-reverse;
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+
+    .top-button {
+        width: 100%;
+        border-radius: 20px;
+        height: 36px;
+        background-color: #3c9cff;
+        color: #fff;
+        font-size: 14px;
+        justify-content: center;
+        display: flex;
+        align-items: center;
+        margin: 0 5px;
+    }
+}