ui-process-h5 2.0.8-beta → 2.1.0-beta

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

@@ -0,0 +1,493 @@
+<template>
+    <div class="process-popup-content">
+        <div class="process-popup-content-msg">
+            <div v-if="param.isMsg">
+                <div
+                    class="process-radio-item"
+                    @click="handleOpenMsg()"
+                    style="color: #1389ff; font-size: 14px;"
+                >
+                    常用意见
+                </div>
+            </div>
+            <div class="process-pc-label">
+                转审理由：<span class="process-pc-label--re">*</span>
+            </div>
+            <div class="process-pc-value">
+                <div class="process-popup-textarea">
+                    <textarea
+                        v-model="commentMsg"
+                        class="textarea-item"
+                        name="description"
+                        cols="40"
+                        placeholder="请输入审批意见(200字以内)"
+                        maxlength="200"
+                        onkeyup="this.value=this.value.replace(/[\uD800-\uDFFF]/g,'')"
+                    ></textarea>
+                    <div class="process-popup-textarea-num">
+                        {{ commentMsg.length }}/200
+                    </div>
+                </div>
+                <div class="msg-btn" v-if="param.isMsg">
+                    <span class="msg-btn-click" @click="handleMakeMsg()"
+                        >设置为常用意见</span
+                    >
+                </div>
+            </div>
+        </div>
+        <div
+            class="process-popup-content-person"
+            v-if="taskNode && taskNode.length > 0 && taskNode[0].taskState != 4"
+        >
+            <template v-if="nextNodeData.length">
+                <template v-for="item in nextNodeData">
+                    <div>
+                        审批人
+                        <span class="process-pc-label--re">*</span>
+                    </div>
+                    <div
+                        class="process-pc-value"
+                        @click="handleOpenPopup(item.id)"
+                    >
+                        <div class="process-pc-value--people">
+                            <div
+                                class="process-pc-value--data"
+                                v-if="
+                                    partNode[item.id] &&
+                                    partNode[item.id].length
+                                "
+                            >
+                                <span v-for="(v, i) in partNode[item.id]">
+                                    {{ i == 0 ? v : `,${v}` }}
+                                </span>
+                            </div>
+                            <div
+                                v-else
+                                class="process-pc-value--data"
+                                style="color: #888;"
+                            >
+                                <span>
+                                    请选择审批人
+                                </span>
+                            </div>
+                        </div>
+                    </div>
+                </template>
+            </template>
+
+            <template v-else-if="outGatewayUserTaskModel.length">
+                <template v-for="item in outGatewayUserTaskModel">
+                    <div class="process-pc-label">
+                        审批人
+                        <span class="process-pc-label--re">*</span>
+                    </div>
+                    <div
+                        class="process-pc-value"
+                        @click="handleOpenPopup(item.id)"
+                    >
+                        <div class="process-pc-value--people">
+                            <div
+                                class="process-pc-value--data"
+                                v-if="
+                                    partNode[item.id] &&
+                                    partNode[item.id].length
+                                "
+                            >
+                                <span v-for="(v, i) in partNode[item.id]">
+                                    {{ i == 0 ? v : `,${v}` }}
+                                </span>
+                            </div>
+                            <div
+                                v-else
+                                class="process-pc-value--data"
+                                style="color: #888;"
+                            >
+                                <span>
+                                    请选择审批人
+                                </span>
+                            </div>
+                        </div>
+                    </div>
+                </template>
+            </template>
+        </div>
+        <TopTips
+            ref="topTips"
+            :text="textTips"
+            :statusTips="statusTips"
+            :type="typeTips"
+        />
+        <TopPopup
+            v-bind:visible="visible"
+            v-on:update:visible="(val) => (visible = val)"
+            ref="TopPopup"
+            titleText="选人"
+            :isDrawer="true"
+        >
+            <div style="height: 100%;">
+                <departPerson
+                    :isTitle="false"
+                    v-if="visible"
+                    :visible.sync="visible"
+                    :request="param.request"
+                    v-bind="entity"
+                    @callback="handleCallback"
+                    @cancel="handleCancel"
+                >
+                </departPerson>
+            </div>
+
+            <!-- 初始测试啊啊啊啊啊啊 -->
+        </TopPopup>
+
+        <attchViews
+            v-if="labels == '1'"
+            :limit="limit ? limit : -1"
+            :requires="requires"
+            :request="param.request"
+            :linkUrl="param.linkUrl"
+            @getValue="getValues"
+        />
+
+        <TopPopup
+            v-bind:visible="visibleListMsg"
+            v-on:update:visible="(val) => (visibleListMsg = val)"
+            ref="TopPopup"
+            titleText="常用意见"
+            :isDrawer="true"
+        >
+            <MsgList
+                :visible="visibleListMsg"
+                :request="param.request"
+                :useInfo="param.userInfo"
+                @handleTips="handleTips"
+                @handleMsg="handleMsg"
+            ></MsgList>
+        </TopPopup>
+
+        <TopPopup
+            titleText="操作消息提示"
+            :isTips="true"
+            :context="`将${commentMsg}设置为常用意见`"
+            :cancel="handleTipsCancel"
+            :comfig="handleTipsComfig"
+            v-bind:visible="visibleMsgComfig"
+            v-on:update:visible="(val) => (visibleMsgComfig = val)"
+        >
+        </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";
+import MsgList from "./msgList.vue";
+export default {
+    name: "delegateTask",
+    props: {
+        param: {
+            type: Object,
+            defalut: () => {},
+        },
+    },
+    components: {
+        TopTips,
+        attchViews,
+        TopPopup,
+        departPerson,
+        MsgList,
+    },
+    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: this.param.isCheckType || "0",
+                orgType: this.param.isOrgType || [0],
+                request: this.param.request, //'http://59.53.91.231:2100' 0002
+                codeType: this.param.isCodeType || [3], // 可选类型 1-主体 2-部门 3-人员
+                multiple: true, // 是否多选
+                checkedArray: [],
+            },
+            /* {
+                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: {},
+            actionName: "",
+
+            visibleListMsg: false,
+            visibleMsgComfig: false,
+        };
+    },
+    watch: {
+        param: {
+            handler(val, preVal) {
+                this.nextNodeData = val.nextNodeData;
+                this.taskNode = val.taskNode;
+                this.outGatewayUserTaskModel = val.outGatewayUserTaskModel;
+                this.actionName = val.actionName;
+                if (val.nextNodeData.length) {
+                    // console.log("handler::::", this.nextNodeData[0]);
+                    if (
+                        this.nextNodeData[0].type == "userTask" ||
+                        this.nextNodeData[0].type == "UserTaskModel"
+                    ) {
+                        this.entity.multiple = true;
+                        this.entity.codeType = this.param.isCodeType || [3];
+                        this.entity.source = "1";
+                        this.entity.checkedArray = [];
+                        this.entity.type = this.param.isCheckType || "0";
+                        this.entity.orgType = this.param.isOrgType || [0];
+                    } else if (
+                        this.nextNodeData[0].type == "ExclusiveGatewayModel"
+                    ) {
+                    } else if (
+                        this.nextNodeData[0].type == "InclusiveGatewayModel"
+                    ) {
+                    }
+                } else if (val.outGatewayUserTaskModel.length) {
+                    if (val.outGatewayUserTaskModel[0].type == "userTask") {
+                        this.entity.multiple = true;
+                        this.entity.codeType = this.param.isCodeType || [3];
+                        this.entity.source = "1";
+                        this.entity.checkedArray = [];
+                        this.entity.type = this.param.isCheckType || "0";
+                        this.entity.orgType = this.param.isOrgType || [0];
+                    } else if (
+                        val.outGatewayUserTaskModel[0].type ==
+                        "ExclusiveGatewayModel"
+                    ) {
+                    } else if (
+                        val.outGatewayUserTaskModel[0].type ==
+                        "InclusiveGatewayModel"
+                    ) {
+                    } else if (
+                        val.outGatewayUserTaskModel[0].type == "UserTaskModel"
+                    ) {
+                        this.entity.multiple = true;
+                        this.entity.codeType = this.param.isCodeType || [3];
+                        this.entity.source = "1";
+                        this.entity.checkedArray = [];
+                        this.entity.type = this.param.isCheckType || "0";
+                        this.entity.orgType = this.param.isOrgType || [0];
+                    }
+                }
+            },
+            immediate: true,
+            deep: true,
+        },
+    },
+    created() {
+        // console.log("isVue2", this.param);
+        this.makeDelegateTaskButtonAnnex();
+    },
+    methods: {
+        // 设置msg
+        handleMakeMsg() {
+            if (this.commentMsg == "" && !this.commentMsg.length) {
+                this.handleTips("请输入审批意见!", false, "success");
+                this.visibleMsgComfig = false;
+            } else {
+                this.visibleMsgComfig = true;
+            }
+        },
+        handleOpenMsg() {
+            this.visibleListMsg = true;
+        },
+        handleTipsCancel() {
+            this.visibleMsgComfig = false;
+        },
+        handleTipsComfig() {
+            this.handleTips("", true, "loading");
+            this.visibleMsgComfig = false;
+            this.param.request
+                .post("/auth//user/opinion/save", {
+                    opinionName: this.commentMsg,
+                })
+                .then((res) => {
+                    if (res.code === 200) {
+                        this.handleTips("设置成功!", true, "success");
+                    } else {
+                        this.handleTips(res.msg, true, "error");
+                    }
+                })
+                .catch((error) => {
+                    this.handleTips(error.msg, true, "error");
+                });
+        },
+        handleMsg(val) {
+            this.commentMsg = val;
+            this.visibleListMsg = false;
+        },
+        handleOpenPopup(id) {
+            this.visible = true;
+            this.partObjId = id;
+        },
+        async confirm() {
+            if (!this.commentMsg) {
+                this.textTips = "请输入转审理由!";
+                this.$refs.topTips.handleOpen();
+                return;
+            }
+            let arr = "";
+            this.multiNodeParticipant[this.partObjId].map((v, i) => {
+                if (i == 0) {
+                    arr = v;
+                } else {
+                    arr = `${arr} ${v}`;
+                }
+            });
+
+            this.handleTips("", true, "loading");
+            await this.param.request
+                .post("/aws/tis/delegate", {
+                    delegateReason: this.commentMsg,
+                    taskInstId: this.param.taskInstId,
+                    targetUID: arr,
+                })
+                .then((res) => {
+                    if (res.code == 200) {
+                        this.$emit("handleClosePopup1");
+                        this.handleTips("提交成功!", false, "success");
+                        this.handleFinal();
+                        this.commentMsg = "";
+                    } else {
+                        this.handleTips(res.msg, true, "error");
+                    }
+                });
+        },
+        makeDelegateTaskButtonAnnex() {
+            if (this.param.annex && this.param.annex.length) {
+                this.otherList = this.param.annex;
+                let str = this.otherList.split(";");
+                this.limit = str[2];
+                this.requires = JSON.parse(str[1]);
+                this.labels = str[0];
+                /* console.log(
+                    "makeDelegateTaskButtonAnnex",
+                    this.otherList,
+                    this.limit,
+                    this.requires,
+                    this.labels
+                ); */
+            }
+        },
+
+        handleCallback(res) {
+            // console.log("111:::", res);
+            this.visible = false;
+            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);
+                this.entity.checkedArray.push({
+                    type: 3,
+                    uid: v.uid,
+                });
+            });
+            // console.log("callback_OK", res, this.multiNodeParticipant);
+        },
+        handleCancel() {
+            // console.log("cancel_No");
+        },
+
+        getValues(data) {
+            // console.log("获取当前附件信息::::", data);
+            this.attchLists = data;
+        },
+
+        async uploadAttch() {
+            if (this.attchLists.length > 0) {
+                this.attchLists.map((v, i) => {
+                    v.size = v.fileSize;
+                    v.format = v.originFileName.substring(
+                        v.originFileName.lastIndexOf(".") + 1
+                    );
+                    v.uploadTime = v.createTime;
+                    v.processInstId = this.param.processInstId;
+                    v.taskInstId = this.param.taskInstId;
+                    v.name = v.originFileName;
+                });
+
+                let param = this.attchLists;
+                const ress = await this.param.request.post(
+                    "/aws/meta/annex/patchSave",
+                    {
+                        saveMetaAnnexCmdList: param,
+                    }
+                );
+                // console.log("asd", ress);
+                if (ress.success) {
+                    this.$emit("handleClosePopup1");
+                    this.handleTips("提交成功!", false, "success");
+                    this.handleFinal();
+                    this.commentMsg = "";
+                } else {
+                    this.handleTips("上传失败", true, "error");
+                }
+            }
+        },
+
+        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) {
+				window.top && window.top.postMessage('success', '*')
+                this.param.endFunction("delegateTask");
+            }
+        },
+    },
+};
+</script>
+<style scoped>
+@import "./index.scss";
+</style>

package/src/packages/process/operation/index.js

@@ -0,0 +1,8 @@
+import counterSign from "./counterSign.vue";
+import delegateTask from "./delegateTask.vue";
+import complete from "./complete.vue";
+import cancel from "./cancel.vue";
+import backNode from "./backNode.vue";
+import ccTask from "./ccTask.vue";
+
+export { counterSign, delegateTask, complete, cancel, backNode, ccTask };

package/src/packages/process/operation/index.scss

@@ -0,0 +1,212 @@
+.process-popup-content {
+    flex: 1;
+}
+
+.process-popup-content .process-pc-label {
+    font-weight: 400;
+    font-size: 12px;
+    color: #565959;
+    display: flex;
+    align-items: center;
+    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; */
+    height: 105px;
+    box-sizing: border-box;
+    border-radius: 4px;
+    background: #fff;
+    border: 1px solid #dcdcdc;
+    margin-top: 8px;
+    padding: 4px 8px;
+}
+
+.process-popup-textarea-num {
+    font-weight: 400;
+    font-size: 12px;
+    text-align: right;
+    color: #999;
+}
+
+.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;
+    font-size: 14px;
+    width: 100%;
+    height: 74px;
+    font-weight: 400;
+    color: #333;
+}
+.process-pc-label--re {
+    color: #ee0000;
+}
+
+.process-pc-value--people {
+    width: 100%;
+    min-height: 43px;
+    padding: 10px 26px 10px 0;
+    box-sizing: border-box;
+    position: relative;
+    font-size: 14px;
+}
+
+.process-pc-value--people::after {
+    position: absolute;
+    content: "";
+    width: 100%;
+    height: 1px;
+    background-color: #e8e8e8;
+    bottom: 0;
+    left: 0;
+}
+
+.process-tag {
+    width: 36px;
+    height: 20px;
+    box-sizing: border-box;
+    border: 1px solid #2979ff;
+    color: #2979ff;
+    font-size: 12px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-right: 5px;
+}
+
+.process-radio {
+    display: flex;
+    justify-content: flex-start;
+}
+.process-radio-item,
+.process-checkbox-item {
+    display: flex;
+    align-items: center;
+    margin-right: 10px;
+    padding-top: 10px;
+
+    font-weight: 400;
+    font-size: 14px;
+    color: #333;
+}
+.process-radio-item span {
+    display: inline-block;
+    border: 1px solid #d1d1d1;
+    border-radius: 50%;
+    width: 16px;
+    height: 16px;
+    box-sizing: border-box;
+    background-color: #fff;
+    margin-right: 5px;
+    position: relative;
+}
+
+.process-checkbox-item span {
+    display: inline-block;
+    border: 1px solid #d1d1d1;
+    border-radius: 3px;
+    width: 16px;
+    height: 16px;
+    box-sizing: border-box;
+    background-color: #fff;
+    margin-left: 5px;
+}
+
+.process-radio-item--check span {
+    border-color: rgb(0, 122, 255);
+}
+
+.process-radio-item--check span::after {
+    content: "";
+    background-color: rgb(0, 122, 255);
+    border-color: rgb(0, 122, 255);
+    width: 12px;
+    height: 12px;
+    position: absolute;
+    border-radius: 50%;
+    left: 1px;
+    top: 1px;
+}
+
+.process-radio-item-check {
+    width: 80%;
+    height: 80%;
+    transform: translate(12%, 18%);
+}
+
+.process-checkbox-item-check {
+    width: 80%;
+    height: 80%;
+    transform: translate(12%, -15%);
+}
+
+.process-checkbox-item--check span {
+    background-color: rgb(0, 122, 255);
+}
+
+::v-deep .departPerson-main {
+    width: 100% !important;
+    height: 100% !important;
+}
+
+.msg-btn {
+    font-size: 14px;
+    margin: 4px 0 0;
+    text-align: right;
+    color: #1890ff;
+    padding-bottom: 12px;
+    font-weight: 400;
+}
+
+.process-popup-content-msg {
+    padding: 0 20px;
+    background-color: #fff;
+    margin-bottom: 12px;
+}
+
+.process-popup-content-person {
+    padding: 0 20px 20px;
+    background-color: #fff;
+}
+
+.attch-upload {
+    padding: 0 20px;
+    margin-top: 10px;
+    background: #fff;
+}