ui-process-h5 2.1.0-beta → 2.1.1-beta

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

@@ -1,901 +0,0 @@
-<template>
-  <div class="treenode" v-if="nodeItems && nodeItems.length">
-    <!-- 多分支 -->
-    <div class="treenode-multi" v-if="!endNode">
-      <div class="treenode-node" style="margin-top: 0">
-        <template v-for="value in nodeItems">
-          <!-- 多选 -->
-          <div
-            v-if="checkType == 'InclusiveGatewayModel' && nodeItems.length > 1"
-            class="treenode-checkbox"
-            :class="
-              checkBoxArr.includes(value.id) ? 'treenode-checkbox-active' : ''
-            "
-            @click="handleCheckBoxClick(value)"
-          >
-            <span>
-              <img
-                class="treenode-checkbox-active-img"
-                v-if="checkBoxArr.includes(value.id)"
-                :src="check"
-              />
-            </span>
-            {{ value.nodeName || value.name }}
-          </div>
-          <!-- 单选 -->
-          <div
-            v-else-if="
-              checkType == 'ExclusiveGatewayModel' && nodeItems.length > 1
-            "
-            class="treenode-radio"
-            :class="radioArr == value.id ? 'treenode-radio-active' : ''"
-            @click="handleRadioClick(value)"
-          >
-            <span />
-            {{ value.nodeName || value.name }}
-          </div>
-        </template>
-      </div>
-
-      <!-- 多选下一级分支 -->
-      <template
-        v-if="
-          checkType == 'InclusiveGatewayModel' &&
-          checkBoxItem &&
-          checkBoxItem.length
-        "
-      >
-        <div class="treenode-node" v-for="value in checkBoxItem">
-          <div v-if="value.childNode && value.childNode.length">
-            <TreeNode
-              :items="value.childNode"
-              :endNode="value.childNode.length == 1"
-              :nodeType="nodeType"
-              :param="param"
-              :checkType="value.type"
-              @onMultiNode="onMultiNode"
-              @onVars="onVars"
-            />
-          </div>
-          <div v-else class="personselect">
-            <div class="personselect-name">
-              {{ value.nodeName || value.name }}
-            </div>
-            <div class="items-person">
-              <template
-                v-if="
-                  value.humanPerformerName !== '固定账户' &&
-                  value.humanPerformerName !== '与流程申请人相关'
-                "
-              >
-                <div
-                  class="items-person-set"
-                  @click.stop="handleOpenPopup(value)"
-                >
-                  设置
-                </div>
-              </template>
-              <div
-                class="items-person-name"
-                v-if="
-                  value.humanPerformerName !== '固定账户' &&
-                  value.humanPerformerName !== '与流程申请人相关'
-                "
-              >
-                {{ partNode[value.id] ? partNode[value.id].join(",") : "" }}
-              </div>
-              <div
-                class="items-person-name"
-                v-else-if="value.routeTxt && value.routeTxt.userNames"
-              >
-                {{ value.routeTxt.userNames }}
-              </div>
-            </div>
-          </div>
-        </div>
-      </template>
-
-      <template
-        v-if="
-          checkType == 'ExclusiveGatewayModel' && radioItem && radioItem.length
-        "
-      >
-        <div class="treenode-node" v-for="value in radioItem">
-          <div v-if="value.childNode && value.childNode.length">
-            <TreeNode
-              :items="value.childNode"
-              :endNode="value.childNode.length == 1"
-              :nodeType="nodeType"
-              :param="param"
-              :checkType="value.type"
-              @onMultiNode="onMultiNode"
-              @onVars="onVars"
-            />
-          </div>
-          <div v-else class="personselect">
-            <div class="personselect-name">
-              {{ value.nodeName || value.name }}
-            </div>
-            <div class="items-person">
-              <template
-                v-if="
-                  value.humanPerformerName !== '固定账户' &&
-                  value.humanPerformerName !== '与流程申请人相关'
-                "
-              >
-                <div
-                  class="items-person-set"
-                  @click.stop="handleOpenPopup(value)"
-                >
-                  设置
-                </div>
-              </template>
-              <div
-                class="items-person-name"
-                v-if="
-                  value.humanPerformerName !== '固定账户' &&
-                  value.humanPerformerName !== '与流程申请人相关'
-                "
-              >
-                {{ partNode[value.id] ? partNode[value.id].join(",") : "" }}
-              </div>
-              <div
-                class="items-person-name"
-                v-else-if="value.routeTxt && value.routeTxt.userNames"
-              >
-                {{ value.routeTxt.userNames }}
-              </div>
-            </div>
-          </div>
-        </div>
-      </template>
-    </div>
-    <!-- 单分支 -->
-    <div class="treenode-single" v-if="endNode">
-      <div class="treenode-single-items" v-for="value in nodeItems">
-        <div class="personselect">
-          <div class="personselect-name">
-            {{ value.nodeName || value.name }}
-          </div>
-          <div class="items-person" v-if="value.type !== 'EndEventModel'">
-            <template
-              v-if="
-                value.humanPerformerName !== '固定账户' &&
-                value.humanPerformerName !== '与流程申请人相关'
-              "
-            >
-              <div
-                class="items-person-set"
-                @click.stop="handleOpenPopup(value)"
-              >
-                设置
-              </div>
-            </template>
-            <div class="items-person-name" v-if="personMakeList[value.id]">
-              {{ personMakeList[value.id] }}
-            </div>
-
-            <div
-              class="items-person-name"
-              v-else-if="
-                value.humanPerformerName !== '固定账户' &&
-                value.humanPerformerName !== '与流程申请人相关'
-              "
-            >
-              {{ partNode[value.id] ? partNode[value.id].join(",") : "" }}
-            </div>
-            <div
-              class="items-person-name"
-              v-else-if="value.routeTxt && value.routeTxt.userNames"
-            >
-              {{ value.routeTxt.userNames }}
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <!-- 选人 -->
-    <TopPopup
-      v-bind:visible="visible"
-      v-on:update:visible="(val) => (visible = val)"
-      ref="TopPopup"
-      titleText="选人"
-      :isDrawer="true"
-    >
-      <departPerson
-        :isTitle="false"
-        v-if="visible"
-        v-bind="entity"
-        @callback="handleCallback"
-      >
-      </departPerson>
-    </TopPopup>
-    <!-- Tips -->
-    <TopTips
-      ref="topTips"
-      :text="textTips"
-      :statusTips="statusTips"
-      :type="typeTips"
-    />
-  </div>
-</template>
-<script>
-import TopPopup from "../../popup/index.vue";
-import success from "@/assets/status/success.png";
-import { departPerson } from "checked-pick-app";
-import TopTips from "../../tip/index.vue";
-import "checked-pick-app/style.css";
-
-export default {
-  name: "TreeNode",
-  components: {
-    TopPopup,
-    TopTips,
-    departPerson,
-  },
-  props: {
-    // 传入节点数据
-    items: {
-      type: Array,
-      default: () => [],
-    },
-    // end节点
-    endNode: {
-      type: Boolean,
-      default: false,
-    },
-    // 当前类型
-    nodeType: {
-      type: String,
-      default: "outing", // | nexting
-    },
-    // 通用参数
-    param: {
-      type: Object,
-      default: () => {},
-    },
-    // 单选,多选
-    checkType: {
-      type: String,
-      default: "", // | nexting
-    },
-  },
-  data() {
-    return {
-      // 传入节点
-      nodeItems: [],
-      // 弹窗
-      visible: false,
-      // 多选选中,
-      checkBoxArr: [],
-      // 多选选中对象
-      checkBoxItem: [],
-      //单选选中
-      radioArr: "",
-      // 单选选中对象
-      radioItem: [],
-      partObjId: "",
-      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, // 是否多选
-      },
-      // 选中人员数组
-      multiNodeParticipant: {},
-      partNode: {},
-
-      /* tips 相关参数 */
-      textTips: "",
-      statusTips: false,
-      typeTips: "success",
-
-      gateVars: {},
-
-      /* 子集 */
-      onMultiNodeData: {},
-      onVarsData: {},
-
-      // 固定账户id存储:[]
-      personMake: [],
-      personMakeList: {},
-    };
-  },
-  watch: {
-    items: {
-      handler(val, vals) {
-        if (val && val.length) {
-          console.log("=====item", val);
-          console.log("=====checkType", this.checkType);
-
-          this.multiNodeParticipant = {};
-          this.partNode = {};
-          this.gateVars = {};
-
-          // this.handleNode(val);
-
-          this.$emit("onMultiNode", this.multiNodeParticipant);
-          this.$emit("onVars", this.gateVars);
-
-          // console.log("子集树:", val);
-
-          if (this.nodeType == "outing") {
-            this.nodeItems = JSON.parse(JSON.stringify(val));
-          } else if (this.nodeType == "nexting") {
-            // this.nodeItems = JSON.parse(JSON.stringify(val));
-            // this.nodeItems = JSON.parse(JSON.stringify(val));
-            val.forEach((v) => {
-              if (
-                v.userTaskModelDTO.participantList &&
-                v.userTaskModelDTO.participantList.length
-              ) {
-                v.userTaskModelDTO.participantList.map((value) => {
-                  /* */
-                  if (!this.multiNodeParticipant[v.id]) {
-                    this.multiNodeParticipant[v.id] = [];
-                  }
-                  if (!this.partNode[v.id]) {
-                    this.partNode[v.id] = [];
-                  }
-
-                  if (!this.multiNodeParticipant[v.id].includes(value.id)) {
-                    this.multiNodeParticipant[v.id].push(value.id);
-                  }
-
-                  if (!this.partNode[v.id].includes(value.name)) {
-                    this.partNode[v.id].push(value.name);
-                  }
-                });
-              }
-              if (
-                v.userTaskModelDTO.humanPerformer.name == "固定账户" ||
-                v.userTaskModelDTO.humanPerformer.name == "与流程申请人相关"
-              ) {
-                this.personMake.push(v.id);
-              }
-
-              if (this.personMake && this.personMake.length) {
-                this.param.request
-                  .post(
-                    `aws/repository/getParticipantsOfPerformerNames?taskInstId=${this.param.taskInstId}`,
-                    {
-                      userTaskDefIds: this.personMake,
-                    }
-                  )
-                  .then((res) => {
-                    if (res.code == 200) {
-                      this.personMakeList = res.data;
-                    }
-                  });
-              }
-
-              this.nodeItems = JSON.parse(JSON.stringify(val));
-            });
-          }
-
-          if (this.checkType == "ExclusiveGatewayModel" && val.length == 1) {
-            this.handleRadioClick(val[0]);
-          }
-        }
-      },
-      immediate: true,
-      deep: true,
-    },
-  },
-  computed: {
-    check() {
-      return success;
-    },
-  },
-  mounted() {},
-  methods: {
-    // 清空数据
-    clear() {
-      this.radioArr = "";
-      this.radioItem = [];
-      this.checkBoxArr = [];
-      this.checkBoxItem = [];
-      this.multiNodeParticipant = {};
-      this.partNode = {};
-      this.gateVars = {};
-    },
-
-    // 校验当前类型
-    isOption(humanPerformer) {
-      return (
-        humanPerformer == "任意指定" ||
-        humanPerformer == "固定部门" ||
-        humanPerformer == "固定单位" ||
-        humanPerformer == "与流程申请人所在组织结构的位置相关" ||
-        humanPerformer == "固定群组"
-      );
-    },
-    // 选人数据回调
-    handleCallback(res) {
-      this.visible = false;
-      this.multiNodeParticipant[this.partObjId] = [];
-      this.partNode[this.partObjId] = [];
-      let arr;
-
-      res.map((v, i) => {
-        this.multiNodeParticipant[this.partObjId].push(v.uid);
-        this.partNode[this.partObjId].push(v.name);
-      });
-
-      if (this.onMultiNodeData) {
-        this.multiNodeParticipant = {
-          ...this.multiNodeParticipant,
-          ...this.onMultiNodeData,
-        };
-      }
-
-      this.$emit("onMultiNode", this.multiNodeParticipant);
-    },
-    // 单选交互
-    handleRadioClick(val) {
-      console.log("=====val", val);
-      console.log("=====checkType", this.checkType);
-      if (val) {
-        this.multiNodeParticipant = {};
-        this.gateVars = {};
-        this.$emit("onMultiNode", this.multiNodeParticipant);
-        if (
-          val.incomingConditionItemList.length > 0 &&
-          val.incomingConditionItemList[0].itemName &&
-          val.incomingConditionItemList[0].compareValue
-        ) {
-          this.gateVars[val.incomingConditionItemList[0].itemName] =
-            val.incomingConditionItemList[0].compareValue;
-        }
-        this.radioArr = val.id;
-        this.radioItem = [val];
-
-        // console.log("选中单选", val);
-        this.handleNode(val);
-        this.$emit("onVars", this.gateVars);
-      }
-    },
-    // 多选交互
-    handleCheckBoxClick(val) {
-      if (val) {
-        if (this.checkBoxArr.includes(val.id)) {
-          console.log('zhhchoval =====',val);
-          if (
-            val.incomingConditionItemList.length > 0 &&
-            val.incomingConditionItemList[0].itemName &&
-            val.incomingConditionItemList[0].compareValue
-          ) {
-            delete this.gateVars[val.incomingConditionItemList[0].itemName]
-          }
-          delete this.multiNodeParticipant[val.id];
-          this.checkBoxItem.splice(this.checkBoxArr.indexOf(val.id), 1);
-          this.checkBoxArr.splice(this.checkBoxArr.indexOf(val.id), 1);
-        } else {
-          if (
-            val.incomingConditionItemList.length > 0 &&
-            val.incomingConditionItemList[0].itemName &&
-            val.incomingConditionItemList[0].compareValue
-          ) {
-            this.gateVars[val.incomingConditionItemList[0].itemName] =
-              val.incomingConditionItemList[0].compareValue;
-          }
-          this.checkBoxItem.push(val);
-          this.checkBoxArr.push(val.id);
-        }
-        this.handleNode(val);
-        this.$emit("onVars", this.gateVars);
-      }
-    },
-
-    // 通用交互处理(单一处理存在预设置人员)
-    handleNode(val) {
-      console.log("val======", val);
-      // return;
-      let childArr =
-        val.childNode && val.childNode.length
-          ? val.childNode
-          : val && val.length
-          ? val
-          : [val];
-      console.log("childArr======", childArr);
-      console.log("checkBoxItem======", this.checkBoxItem);
-
-      // if (val.incomingConditionItemList.length>0&&
-      //   val.incomingConditionItemList[0].itemName &&
-      //   val.incomingConditionItemList[0].compareValue
-      // ) {
-      //   if (this.gateVars[val.incomingConditionItemList[0].itemName]) {
-      //     delete this.gateVars[val.incomingConditionItemList[0].itemName];
-      //   } else {
-      //     this.gateVars[val.incomingConditionItemList[0].itemName] =
-      //       val.incomingConditionItemList[0].compareValue;
-      //   }
-      // }
-      // let checkBoxItem = {};
-      // console.log('gateVars======',this.gateVars);
-      // this.checkBoxItem.map(item=>{
-      //   checkBoxItem[item.incomingConditionItemList[0]['itemName']] = item.incomingConditionItemList[0]['compareValue']
-      // })
-
-      if (childArr && childArr.length) {
-        childArr.forEach((v, i) => {
-          if (v.participantList && v.participantList.length) {
-            v.participantList.forEach((value, index) => {
-              if (!this.multiNodeParticipant[v.id]) {
-                this.multiNodeParticipant[v.id] = [];
-              }
-              if (!this.partNode[v.id]) {
-                this.partNode[v.id] = [];
-              }
-
-              if (!this.multiNodeParticipant[v.id].includes(value.id)) {
-                this.multiNodeParticipant[v.id].push(value.id);
-              }
-
-              if (!this.partNode[v.id].includes(value.name)) {
-                this.partNode[v.id].push(value.name);
-              }
-            });
-          } else if (v.id && v.humanPerformerName == "固定人员") {
-            this.param.request
-              .post(
-                `/aws/repository/getParticipantsOfPerformerNames?taskInstId=${this.param.taskInstId}`,
-                { userTaskDefIds: [v.id] }
-              )
-              .then((res) => {
-                if (res.code == 200) {
-                  this.partNode[v.id] = {};
-                  this.partNode[v.id] = res.data[v.id].split(";");
-                }
-              });
-          }
-
-          // vars判断(兼容处理)
-          if (this.nodeType == "outing") {
-            // if (
-            //   v.incomingConditionItemList &&
-            //   v.incomingConditionItemList.length
-            // ) {
-            //   if (val && val.length) {
-            //     this.gateVars[val[0].incomingConditionItemList[0].itemName] =
-            //       val[0].incomingConditionItemList[0].compareValue;
-            //   } else {
-            //     this.gateVars[val.incomingConditionItemList[0].itemName] =
-            //       val.incomingConditionItemList[0].compareValue;
-            //   }
-            // } else if (
-            //   v.incomingConditionItemList[0].itemName &&
-            //   v.incomingConditionItemList[0].compareValue
-            // ) {
-            //   // this.gateVars[v.incomingConditionItemList[0].itemName] =
-            //   //   v.incomingConditionItemList[0].compareValue;
-            // }
-
-            if (this.onVarsData) {
-              this.gateVars = {
-                ...this.gateVars,
-                ...this.onVarsData,
-              };
-            }
-            this.$emit("onVars", this.gateVars);
-          }
-        });
-      }
-    },
-
-    // 开启选人弹窗,根据类型开启
-    handleOpenPopup(item) {
-      this.visible = true;
-      this.partObjId = item.id;
-
-      console.log("item======", item);
-      if (this.nodeType == "nexting") {
-        item = {
-          ...item,
-          ...item.userTaskModelDTO,
-        };
-      } else if (this.nodeType == "outing") {
-        item = {
-          ...item,
-          humanPerformer: {
-            name: item.humanPerformerName,
-          },
-        };
-      } else {
-        this.handleTips("加载失败,请刷新", true, "error");
-      }
-      if (
-        item.humanPerformer.name == "固定单位" ||
-        item.humanPerformerName == "固定单位"
-      ) {
-        let subjectName;
-        let checkedArray = [];
-        item.routeTxt.companyIds.map((v, i) => {
-          subjectName = v.name;
-        });
-
-        if (
-          this.multiNodeParticipant[item.id] &&
-          this.multiNodeParticipant[item.id].length
-        ) {
-          this.multiNodeParticipant[item.id].map((v, i) => {
-            checkedArray.push({
-              type: 3,
-              uid: v,
-            });
-          });
-        }
-
-        this.entity = {
-          source: "1",
-          type: this.param.isCheckType || "0",
-          orgType: this.param.isOrgType || [0],
-          request: this.param.request,
-          codeType: this.param.isCodeType || [3],
-          multiple: item.loopCardinality != 1,
-          maxMultiple: item.loopCardinality > 0 ? item.loopCardinality : 0,
-          subjectName: subjectName,
-          checkedArray: checkedArray,
-        };
-      } else if (
-        item.humanPerformer.name == "固定部门" ||
-        item.humanPerformerName == "固定部门"
-      ) {
-        let deptCode;
-        let deptCodeArray = [];
-        let checkedArray = [];
-        item.routeTxt.departmentIds.forEach((v, i) => {
-          if (item.routeTxt.departmentIds.length > 1) {
-            deptCodeArray.push(v.rangeId);
-            // deptCode = v.rangeId;
-          } else {
-            deptCode = v.rangeId;
-          }
-        });
-
-        if (
-          this.multiNodeParticipant[item.id] &&
-          this.multiNodeParticipant[item.id].length
-        ) {
-          this.multiNodeParticipant[item.id].forEach((v, i) => {
-            checkedArray.push({
-              type: 3,
-              uid: v,
-              deptId: deptCode,
-            });
-          });
-        }
-        if (item.routeTxt.departmentIds.length > 1) {
-          this.entity = {
-            source: "1",
-            type: this.param.isCheckType || "0",
-            orgType: this.param.isOrgType || [0],
-            request: this.param.request,
-            codeType: this.param.isCodeType || [3],
-            multiple: item.loopCardinality != 1,
-            maxMultiple: item.loopCardinality > 0 ? item.loopCardinality : 0,
-            deptCodeArray: deptCodeArray,
-            // deptCode: deptCode,
-            checkedArray: checkedArray,
-          };
-        } else {
-          this.entity = {
-            source: "1",
-            type: this.param.isCheckType || "0",
-            orgType: this.param.isOrgType || [0],
-            request: this.param.request,
-            codeType: this.param.isCodeType || [3],
-            multiple: item.loopCardinality != 1,
-            maxMultiple: item.loopCardinality > 0 ? item.loopCardinality : 0,
-            deptCode: deptCode,
-            checkedArray: checkedArray,
-          };
-        }
-      } else {
-        let checkedArray = [];
-
-        if (
-          this.multiNodeParticipant[item.id] &&
-          this.multiNodeParticipant[item.id].length
-        ) {
-          this.multiNodeParticipant[item.id].map((v, i) => {
-            checkedArray.push({
-              type: 3,
-              uid: v,
-            });
-          });
-        }
-
-        this.entity = {
-          source: "1",
-          type: this.param.isCheckType || "0",
-          orgType: this.param.isOrgType || [0],
-          request: this.param.request,
-          codeType: this.param.isCodeType || [3],
-          multiple: item.loopCardinality != 1,
-          maxMultiple: item.loopCardinality > 0 ? item.loopCardinality : 0,
-          checkedArray: checkedArray,
-          // deptCodeArray:["d603dfca436aa2c8e13a683389e2ca23","7faf6dcaf4fbc41eebc85d5a41035df5"]
-        };
-      }
-    },
-    handleTips(text, status, type) {
-      this.textTips = text;
-      this.statusTips = status;
-      this.typeTips = type;
-      this.$refs.topTips.handleOpen();
-    },
-    // 子集元素存储
-    onMultiNode(val) {
-      if (val) {
-        // console.log("子集展示", val);
-        this.onMultiNodeData = val;
-        this.multiNode = {
-          ...this.multiNode,
-          ...this.onMultiNodeData,
-        };
-
-        this.$emit("onMultiNode", this.multiNode);
-      }
-    },
-    onVars(val) {
-      if (val) {
-        this.onVarsData = val;
-
-        this.getVars = {
-          ...this.gateVars,
-          ...this.onVarsData,
-        };
-
-        this.$emit("onVars", this.getVars);
-      }
-    },
-  },
-};
-</script>
-<style lang="scss" scoped>
-.treenode {
-  &-multi {
-    border-radius: 4px;
-    background: #f8f8f8;
-    padding: 10px;
-    /*   &-items {
-            margin-top: 20px;
-            display: inline-block; */
-
-    .treenode-checkbox,
-    .treenode-radio {
-      display: inline-flex;
-      margin-right: 10px;
-    }
-
-    .treenode-checkbox:last-child,
-    .treenode-radio:last-child {
-      margin-left: 0;
-    }
-  }
-
-  &-single {
-    padding: 10px 0;
-  }
-
-  &-node {
-    margin-top: 20px;
-  }
-
-  .personselect {
-    /* display: flex;
-        align-items: center; */
-    &-name {
-      font-weight: 400;
-      font-size: 14px;
-      text-align: left;
-      color: #333;
-      width: 50%;
-      display: inline-block;
-      vertical-align: top;
-    }
-  }
-
-  .items-person {
-    width: 50%;
-    display: inline-flex;
-    vertical-align: top;
-    flex-direction: row-reverse;
-    &-name {
-      font-weight: 400;
-      font-size: 14px;
-      color: #333;
-    }
-
-    &-set,
-    &-setdisible {
-      font-weight: 400;
-      font-size: 14px;
-      color: #1389ff;
-      margin-left: 10px;
-      min-width: 30px;
-    }
-    &-setdisible {
-      opacity: 0.5;
-    }
-  }
-  /*  } */
-
-  &-items:first-child {
-    margin-top: 0;
-  }
-
-  &-radio,
-  &-checkbox {
-    display: inline-flex;
-    align-items: center;
-    font-weight: 400;
-    font-size: 14px;
-    color: #333;
-    padding: 6px 0;
-  }
-
-  &-radio {
-    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;
-    }
-
-    &-active {
-      span {
-        border-color: rgb(0, 122, 255);
-        &::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;
-        }
-      }
-    }
-  }
-  &-checkbox {
-    span {
-      display: inline-block;
-      border: 1px solid #d1d1d1;
-      border-radius: 3px;
-      width: 16px;
-      height: 16px;
-      box-sizing: border-box;
-      background-color: #fff;
-      margin-right: 8px;
-    }
-
-    &-active {
-      span {
-        border-color: rgb(0, 122, 255);
-        background-color: rgb(0, 122, 255);
-      }
-      &-img {
-        width: 80%;
-        height: 80%;
-        transform: translate(12%, -15%);
-      }
-    }
-  }
-}
-
-::v-deep .departPerson-main {
-  width: 100%;
-  height: 100%;
-}
-</style>