qgb-process 0.2.3 → 0.2.7

package/src/views/formBuilder/components/approverSelector.vue

@@ -1,493 +1,493 @@
-<template>
-  <div>
-    <el-drawer
-      title="审批节点"
-      :visible="visible"
-      direction="rtl"
-      :wrapperClosable="false"
-      :show-close="false"
-      :close-on-press-escape="false"
-      destroy-on-close
-      :append-to-body="true"
-    >
-      <div class="drawer-wrap">
-        <!-- 审批人 -->
-        <div class="approverSelectorItem" v-if="!isCCTask">
-            <div class="multi-title">审批人</div>
-            <div class="approverSelectorItemCon rowDirection">
-                <el-radio-group v-model="approverMode" @change="approverModeChange">
-                    <el-radio :label="1">指定成员</el-radio>
-                    <el-radio :label="2" v-if="queryInfo.type | filterType">主管</el-radio>
-                </el-radio-group>
-                <!-- 指定成员 -->
-                <div v-if="approverMode == 1" class="selector-list">
-                    <el-button type="primary" icon="el-icon-plus" class="list-item-btn" size="mini"  @click="showStaffSelector(0)" v-if="approverList.length < 25"></el-button>
-                    <div class="tagList" v-if="approverList.length">
-                        <template v-for="(tag, index) in approverList">
-                            <el-tag class="list-item list-item-opt"  :key="index" closable type="info" @close="removeItem('approverList', index)" size="medium">
-                                {{tag.name || tag.userName}}
-                            </el-tag>
-                        </template>
-                        <span class="clear-btn list-item"  @click="clear('approverList')">清空</span>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <!-- 主管 -->
-        <div class="approverSelectorItem layoutRowItem" v-if="approverMode == 2">
-            <div class="multi-title">发起人：</div>
-            <div class="approverSelectorItemCon">
-                <el-select @change="(val)=>changeEvent(val, options)" v-model="valueKey" placeholder="请选择">
-                    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"/>
-                </el-select>
-            </div>
-        </div>
-
-        <!-- 多人审批时采用的审批方式 -->
-        <div v-if="![4].includes(approverMode) && !isCCTask" class="approverSelectorItem">
-            <div class="multi-title">多人审批时采用的审批方式</div>
-            <div class="approverSelectorItemCon">
-                <el-radio-group v-model="approverType" @change="examineModeChange">
-                    <el-radio label="3">依次审批</el-radio>
-                    <el-radio label="1">会签（须所有审批人同意）</el-radio>
-                    <el-radio label="2">或签（一名审批人同意或拒绝即可）</el-radio>
-                    <!-- <el-radio :label="2">主管</el-radio> -->
-                </el-radio-group>
-            </div>
-        </div>
-
-        <!-- 审批人为空时 -->
-        <div v-if="approverMode == 2" class="approverSelectorItem">
-            <div class="multi-title">审批人为空时</div>
-            <div class="approverSelectorItemCon">
-                <el-radio-group v-model="directorType.authType" @change="noHanderActionChange">
-                    <el-radio label="1">自动通过 </el-radio>
-                    <el-radio label="2">自动转交主管理员</el-radio>
-                </el-radio-group>
-            </div>
-        </div>
-
-        <!-- 抄送人 -->
-        <div class="approverSelectorItem" v-if="isCCTask">
-          <div class="multi-title">抄送人</div>
-          <div class="approverSelectorItemCon rowDirection">
-            <el-radio-group v-model="isCCTaskType">
-                <el-radio :label="1">指定成员</el-radio>
-            </el-radio-group>
-            <div class="selector-list">
-                <el-button type="primary" icon="el-icon-plus"  class="list-item-btn" size="mini" @click="showStaffSelector(1)" v-if="notifierList.length < 25"></el-button>
-                <div class="tagList" v-if="notifierList.length">
-                    <el-tag class="list-item list-item-opt" v-for="(tag, index) in notifierList" :key="index" closable  type="info" @close="removeItem('notifierList', index)" size="medium">
-                        {{ tag.name || tag.userName }}
-                    </el-tag>
-                    <span class="clear-btn list-item"  @click="clear('notifierList')">清空</span>
-                </div>
-            </div>
-          </div>
-          <!-- <div class="notifier-type-bar" v-if="notifierList.length > 0"><el-checkbox v-model="passCopy">审批通过后抄送</el-checkbox></div> -->
-        </div>
-        <!-- 底部 -->
-        <div class="drawer-footer">
-          <el-button @click="cancel">取消</el-button>
-          <el-button @click="submit" type="primary">保存</el-button>
-        </div>
-      </div>
-    </el-drawer>
-
-    <!-- 人员选择弹出 -->
-    <FlowNodeForm
-      id="nodeForm"
-      @close="nodeVisible = false"
-      :orgVisible="nodeVisible"
-      :type="memberSelectorType"
-      @confirm="memberSelectorConfirm"
-      ref="nodeForm"
-    />
-
-  </div>
-</template>
-
-<script>
-import FlowNodeForm from "./newNodeForm";
-import * as api from "../../../api/apiProcess";
-export default {
-  components: {
-    FlowNodeForm
-  },
-  props: {
-    value: {
-      type: Boolean,
-      default: true
-    },
-    queryInfo:{
-      type: Object,
-      default:()=>{
-        return {}
-      }
-    },
-  },
-  data() {
-    return {
-      isCCTask: false,
-      isCCTaskType: 1,
-
-      visible: false,
-      approverType: "3",
-      approverMode: 1,
-      passCopy: true, // 是否审批通过后抄送
-      nodeVisible: false,
-      notifierList: [],
-      // approverList: [{ directorName: "", directorId: "" }],
-      approverList: [],
-      directorType: { typeName: "", type: "1", authType: "1" },
-      director: {},
-      memberSelectorType: null,
-      options: [],
-      optionsList: [
-        { value: "直接主管", key: 0 },
-        { value: "第2级主管", key: 1 },
-        { value: "第3级主管", key: 2 },
-        { value: "第4级主管", key: 3 },
-        { value: "第5级主管", key: 4 },
-        { value: "第6级主管", key: 5 },
-        { value: "第7级主管", key: 6 },
-        { value: "第8级主管", key: 7 },
-        { value: "第9级主管", key: 8 },
-        { value: "第10级主管", key: 9 }
-      ],
-      valueKey: "直接主管",
-      appList: [{ directorName: "", directorId: "" }]
-    };
-  },
-  watch: {
-    value(val) {
-      this.visible = val;
-    }
-  },
-  mounted() {
-    this.direSxyList();
-  },
-  methods: {
-    // 初始化数据
-    // @data 填充表单数据
-    // @type 添加用户类型: 1 为审批; 2为抄送
-    init(item) {
-
-      const { type, nodeUserList, examineMode, authType, setType, directorLevel } = item
-      const data = {
-        approverType: examineMode,
-        approvers: type == 1 ? nodeUserList : [],
-        passCopy: true,
-        notifiers: type == 2 ? nodeUserList : [],
-        directorType: { typeName: "", type: parseInt(setType), authType: authType }
-      }
-
-
-      this.isCCTask = type == 2 // 是否为抄送人
-
-      this.directorType = data.directorType;
-      this.directorType.authType =  data.directorType && data.directorType.authType ? data.directorType.authType : "1";
-      this.approverMode = data.directorType && data.directorType.type ? data.directorType.type : "1";
-
-      if (this.directorType && this.directorType.type == "1") {
-        this.approverList = data.approvers;
-      }
-
-      // 判断是否为主管
-      if (this.directorType && this.directorType.type == "2") {
-        this.options.map(items => {
-          if (items.key == directorLevel) {
-            this.valueKey = items.value
-          }
-        })
-        this.approverList[0] = { directorId: directorLevel, directorName: this.valueKey }
-      }
-
-      this.approverType = data.approverType || "3";
-      this.notifierList = data.notifiers;
-
-      // this.director = data.director;
-      this.passCopy = data.passCopy === undefined ? true : data.passCopy;
-
-      // 展示弹出窗口
-      this.visible = true
-    },
-    // 审批人类型设置
-    approverModeChange(val) {
-      this.$parent.changeType(val)
-    },
-    // 多人审批时采用的审批方式
-    examineModeChange(val) {
-      this.$parent.examineModeChange(val)
-    },
-    // 审批人为空时
-    noHanderActionChange(val) {
-      this.$parent.noHanderActionChange(val)
-    },
-    // 发起人为主管时主管级别
-    changeEvent(val, key) {
-      // 修改数据
-      this.approverList = [{ directorName: "", directorId: "" }];
-      for (let i = 0; i < key.length; i++) {
-        if (key[i].value == val) {
-          this.approverList[0].directorName = key[i].value;
-          this.approverList[0].directorId = key[i].key;
-        }
-      }
-
-      // 修改对应节点数据结构
-      this.$parent.directorLevelChange(this.approverList[0].directorId)
-    },
-    // 获取主管等级数据
-    async direSxyList() {
-      const res = await api.directorLevelList();
-      if (res.data.state == "ok") {
-        this.options = res.data.data;
-      } else {
-        this.options = this.optionsList;
-      }
-    },
-    // 展示弹出
-    showApproverSelector() {
-      this.visible = !this.visible
-    },
-    // 人员选择确认
-    memberSelectorConfirm(data) {
-      const result = JSON.parse(data);
-      if (result.type === 0) {
-        this.approverList = result.list;
-      } else {
-        this.notifierList = result.list;
-      }
-    },
-    showStaffSelector(val) {
-      this.memberSelectorType = val;
-      this.nodeVisible = true;
-      const params = val === 0 ? this.approverList : this.notifierList;
-      this.$nextTick(() => {
-        this.$refs.nodeForm.init(params);
-      });
-    },
-    // 移除选项
-    removeItem(scope, index) {
-      this[scope].splice(index, 1);
-    },
-    // 清空
-    clear(scope) {
-      this[scope] = [];
-    },
-    // 取消弹出
-    cancel() {
-      this.visible = !this.visible
-    },
-    // 提交数据
-    submit() {
-      this.directorType.type = this.approverMode;
-      this.directorType.typeName = this.approverMode == 1 ? "指定成员" : "主管";
-      const ntList = [];
-      for (let i = 0; i < this.notifierList.length; i++) {
-        const item = this.notifierList[i];
-        ntList.push({
-          id: item.id,
-          userName: item.name || item.userName,
-          phone: item.phone,
-          roleName: item.roleName,
-          companyId: item.comNo || item.companyId,
-          userId: item.memberNo
-        });
-      }
-
-      // 判断是否为抄送人
-      if (!this.isCCTask) {
-        // 1为指定成员，2为主管
-        if (this.approverMode == 1) {
-          if (!this.approverList.length) {
-            this.$message.warning("请配置审批人");
-            return;
-          }
-          const apList = [];
-          for (let i = 0; i < this.approverList.length; i++) {
-            const item = this.approverList[i];
-            if (item.id) {
-              apList.push({
-                id: item.id,
-                userName: item.userName || item.name,
-                phone: item.phone,
-                roleName: item.roleName,
-                companyId: item.comNo || item.companyId,
-                userId: item.memberNo  || item.userId
-              });
-            }
-          }
-          const json = { approverType: this.approverType, approvers: apList, notifiers: ntList, passCopy: this.passCopy, directorType: this.directorType };
-          json.directorType.authType = "";
-          this.$parent.submitApprover(json)
-        } else {
-
-          this.appList[0].directorName =  this.approverList[0] ? this.approverList[0].directorName : "直接主管";
-          this.appList[0].directorId = this.approverList[0] ? this.approverList[0].directorId : 0;
-
-          const SxyData = { approverType: this.approverType, approvers: this.appList, notifiers: ntList, passCopy: this.passCopy, directorType: this.directorType };
-          if (SxyData.approvers[0].directorId == undefined) {
-            SxyData.approvers[0].directorId = 0;
-            SxyData.approvers[0].directorName = "直接主管";
-          }
-          this.$parent.submitApprover(SxyData)
-        }
-      } else {
-        // 抄送人数据
-        var row = ntList.map(value => {
-          value.type = "1"
-          value.memberNo = value.userId
-          return value
-        })
-        var sxyData = { approverType: this.approverType, approvers: this.appList, notifiers: row, passCopy: this.passCopy, directorType: this.directorType };
-        this.$parent.submitCopyer(sxyData);
-      }
-
-    }
-  },
-  computed: {
-    // 过滤非主管的审批模块
-    filterType(type) {
-      if (this.queryInfo.type == "notice") {
-        return false
-      } else if (this.queryInfo.type == "officialDocument") {
-        return false
-      } else {
-        return true
-      }
-    }
-  }
-};
-</script>
-<style scoped style='scss'>
-/deep/ .el-drawer__header{
-    font-size: 16px;
-    color: #000;
-    padding-bottom: 10px;
-    padding-top: 10px;
-    padding-left: 25px;
-}
-/deep/ .el-radio-group{
-    display: flex;
-    flex-direction: column;
-}
-
-/deep/ .el-radio-group .el-radio{
-    margin-bottom: 15px;
-}
-
-/deep/ .el-radio-group .el-radio:last-child{
-    margin-bottom: 0;
-}
-
-/deep/ :focus {
-    outline: 0;
-}
-/deep/ .el-drawer {
-    width: 25% !important;
-}
-/deep/ .el-drawer__header {
-    margin-bottom: 0;
-}
-.approverSelectorItem{}
-
-.rowDirection /deep/ .el-radio-group{
-    display: flex;
-    flex-direction: row;
-}
-
-.rowDirection /deep/ .el-radio-group .el-radio{
-    margin-bottom: 10px;
-}
-
-.layoutRowItem{
-    display: flex;
-    align-items: center;
-    border-top: 1px solid #eaeaea;
-    padding: 20px 0 20px 0;
-}
-
-.multi-title {
-    margin-bottom: 10px;
-    font-size: 14px;
-    padding: 15px 25px 0 25px;
-    border-top: 1px solid #eaeaea;
-    color: #111;
-}
-
-.layoutRowItem .multi-title{
-    border: none;
-    padding: 0 0 0 25px;
-    margin-bottom: 0;
-}
-
-.layoutRowItem .approverSelectorItemCon{
-    padding: 0px;
-}
-
-.approverSelectorItemCon{
-    padding: 5px 25px 18px 25px;
-}
-
-/* 标签 */
-.tagList{
-    display: flex;
-    flex-direction: row;
-    flex-wrap: wrap;
-    margin-top: 15px;
-    align-items: center;
-}
-
-.tagList /deep/ .el-tag.el-tag--info{
-    border: #d9ecff;
-    color: #333;
-}
-
-/* 底部 */
-.drawer-footer {
-    padding: 20px;
-    box-sizing: border-box;
-    border-top: 1px solid #f4f4f8;
-}
-
-.drawer-wrap {
-    overflow-y: auto;
-}
-.selector-bar {
-    box-sizing: border-box;
-}
-.selector-bar.no-padding {
-    padding: 0 20px 20px;
-    box-sizing: border-box;
-}
-.selector-bar.border {
-    border-top: 1px solid #f4f4f8;
-}
-.selector-bar__title {
-    margin-bottom: 10px;
-    font-size: 14px;
-    color: #000;
-}
-.selector-list {
-    padding: 10px 0 0 0;
-    box-sizing: border-box;
-    display: flex;
-    flex-wrap: wrap;
-    flex-direction: column;
-}
-.list-item {
-    margin-right: 10px;
-    margin-bottom: 10px;
-}
-.list-item-btn {
-    width: 60px;
-}
-.clear-btn {
-    cursor: pointer;
-    font-size: 12px;
-    color: #409eff;
-}
-</style>
+<template>
+  <div>
+    <el-drawer
+      title="审批节点"
+      :visible="visible"
+      direction="rtl"
+      :wrapperClosable="false"
+      :show-close="false"
+      :close-on-press-escape="false"
+      destroy-on-close
+      :append-to-body="true"
+    >
+      <div class="drawer-wrap">
+        <!-- 审批人 -->
+        <div class="approverSelectorItem" v-if="!isCCTask">
+            <div class="multi-title">审批人</div>
+            <div class="approverSelectorItemCon rowDirection">
+                <el-radio-group v-model="approverMode" @change="approverModeChange">
+                    <el-radio :label="1">指定成员</el-radio>
+                    <el-radio :label="2" v-if="queryInfo.type | filterType">主管</el-radio>
+                </el-radio-group>
+                <!-- 指定成员 -->
+                <div v-if="approverMode == 1" class="selector-list">
+                    <el-button type="primary" icon="el-icon-plus" class="list-item-btn" size="mini"  @click="showStaffSelector(0)" v-if="approverList.length < 25"></el-button>
+                    <div class="tagList" v-if="approverList.length">
+                        <template v-for="(tag, index) in approverList">
+                            <el-tag class="list-item list-item-opt"  :key="index" closable type="info" @close="removeItem('approverList', index)" size="medium">
+                                {{tag.name || tag.userName}}
+                            </el-tag>
+                        </template>
+                        <span class="clear-btn list-item"  @click="clear('approverList')">清空</span>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- 主管 -->
+        <div class="approverSelectorItem layoutRowItem" v-if="approverMode == 2">
+            <div class="multi-title">发起人：</div>
+            <div class="approverSelectorItemCon">
+                <el-select @change="(val)=>changeEvent(val, options)" v-model="valueKey" placeholder="请选择">
+                    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"/>
+                </el-select>
+            </div>
+        </div>
+
+        <!-- 多人审批时采用的审批方式 -->
+        <div v-if="![4].includes(approverMode) && !isCCTask" class="approverSelectorItem">
+            <div class="multi-title">多人审批时采用的审批方式</div>
+            <div class="approverSelectorItemCon">
+                <el-radio-group v-model="approverType" @change="examineModeChange">
+                    <el-radio label="3">依次审批</el-radio>
+                    <el-radio label="1">会签（须所有审批人同意）</el-radio>
+                    <el-radio label="2">或签（一名审批人同意或拒绝即可）</el-radio>
+                    <!-- <el-radio :label="2">主管</el-radio> -->
+                </el-radio-group>
+            </div>
+        </div>
+
+        <!-- 审批人为空时 -->
+        <div v-if="approverMode == 2" class="approverSelectorItem">
+            <div class="multi-title">审批人为空时</div>
+            <div class="approverSelectorItemCon">
+                <el-radio-group v-model="directorType.authType" @change="noHanderActionChange">
+                    <el-radio label="1">自动通过 </el-radio>
+                    <el-radio label="2">自动转交主管理员</el-radio>
+                </el-radio-group>
+            </div>
+        </div>
+
+        <!-- 抄送人 -->
+        <div class="approverSelectorItem" v-if="isCCTask">
+          <div class="multi-title">抄送人</div>
+          <div class="approverSelectorItemCon rowDirection">
+            <el-radio-group v-model="isCCTaskType">
+                <el-radio :label="1">指定成员</el-radio>
+            </el-radio-group>
+            <div class="selector-list">
+                <el-button type="primary" icon="el-icon-plus"  class="list-item-btn" size="mini" @click="showStaffSelector(1)" v-if="notifierList.length < 25"></el-button>
+                <div class="tagList" v-if="notifierList.length">
+                    <el-tag class="list-item list-item-opt" v-for="(tag, index) in notifierList" :key="index" closable  type="info" @close="removeItem('notifierList', index)" size="medium">
+                        {{ tag.name || tag.userName }}
+                    </el-tag>
+                    <span class="clear-btn list-item"  @click="clear('notifierList')">清空</span>
+                </div>
+            </div>
+          </div>
+          <!-- <div class="notifier-type-bar" v-if="notifierList.length > 0"><el-checkbox v-model="passCopy">审批通过后抄送</el-checkbox></div> -->
+        </div>
+        <!-- 底部 -->
+        <div class="drawer-footer">
+          <el-button @click="cancel">取消</el-button>
+          <el-button @click="submit" type="primary">保存</el-button>
+        </div>
+      </div>
+    </el-drawer>
+
+    <!-- 人员选择弹出 -->
+    <FlowNodeForm
+      id="nodeForm"
+      @close="nodeVisible = false"
+      :orgVisible="nodeVisible"
+      :type="memberSelectorType"
+      @confirm="memberSelectorConfirm"
+      ref="nodeForm"
+    />
+
+  </div>
+</template>
+
+<script>
+import FlowNodeForm from "./newNodeForm";
+import * as api from "../../../api/apiProcess";
+export default {
+  components: {
+    FlowNodeForm
+  },
+  props: {
+    value: {
+      type: Boolean,
+      default: true
+    },
+    queryInfo:{
+      type: Object,
+      default:()=>{
+        return {}
+      }
+    },
+  },
+  data() {
+    return {
+      isCCTask: false,
+      isCCTaskType: 1,
+
+      visible: false,
+      approverType: "3",
+      approverMode: 1,
+      passCopy: true, // 是否审批通过后抄送
+      nodeVisible: false,
+      notifierList: [],
+      // approverList: [{ directorName: "", directorId: "" }],
+      approverList: [],
+      directorType: { typeName: "", type: "1", authType: "1" },
+      director: {},
+      memberSelectorType: null,
+      options: [],
+      optionsList: [
+        { value: "直接主管", key: 0 },
+        { value: "第2级主管", key: 1 },
+        { value: "第3级主管", key: 2 },
+        { value: "第4级主管", key: 3 },
+        { value: "第5级主管", key: 4 },
+        { value: "第6级主管", key: 5 },
+        { value: "第7级主管", key: 6 },
+        { value: "第8级主管", key: 7 },
+        { value: "第9级主管", key: 8 },
+        { value: "第10级主管", key: 9 }
+      ],
+      valueKey: "直接主管",
+      appList: [{ directorName: "", directorId: "" }]
+    };
+  },
+  watch: {
+    value(val) {
+      this.visible = val;
+    }
+  },
+  mounted() {
+    this.direSxyList();
+  },
+  methods: {
+    // 初始化数据
+    // @data 填充表单数据
+    // @type 添加用户类型: 1 为审批; 2为抄送
+    init(item) {
+
+      const { type, nodeUserList, examineMode, authType, setType, directorLevel } = item
+      const data = {
+        approverType: examineMode,
+        approvers: type == 1 ? nodeUserList : [],
+        passCopy: true,
+        notifiers: type == 2 ? nodeUserList : [],
+        directorType: { typeName: "", type: parseInt(setType), authType: authType }
+      }
+
+
+      this.isCCTask = type == 2 // 是否为抄送人
+
+      this.directorType = data.directorType;
+      this.directorType.authType =  data.directorType && data.directorType.authType ? data.directorType.authType : "1";
+      this.approverMode = data.directorType && data.directorType.type ? data.directorType.type : "1";
+
+      if (this.directorType && this.directorType.type == "1") {
+        this.approverList = data.approvers;
+      }
+
+      // 判断是否为主管
+      if (this.directorType && this.directorType.type == "2") {
+        this.options.map(items => {
+          if (items.key == directorLevel) {
+            this.valueKey = items.value
+          }
+        })
+        this.approverList[0] = { directorId: directorLevel, directorName: this.valueKey }
+      }
+
+      this.approverType = data.approverType || "3";
+      this.notifierList = data.notifiers;
+
+      // this.director = data.director;
+      this.passCopy = data.passCopy === undefined ? true : data.passCopy;
+
+      // 展示弹出窗口
+      this.visible = true
+    },
+    // 审批人类型设置
+    approverModeChange(val) {
+      this.$parent.changeType(val)
+    },
+    // 多人审批时采用的审批方式
+    examineModeChange(val) {
+      this.$parent.examineModeChange(val)
+    },
+    // 审批人为空时
+    noHanderActionChange(val) {
+      this.$parent.noHanderActionChange(val)
+    },
+    // 发起人为主管时主管级别
+    changeEvent(val, key) {
+      // 修改数据
+      this.approverList = [{ directorName: "", directorId: "" }];
+      for (let i = 0; i < key.length; i++) {
+        if (key[i].value == val) {
+          this.approverList[0].directorName = key[i].value;
+          this.approverList[0].directorId = key[i].key;
+        }
+      }
+
+      // 修改对应节点数据结构
+      this.$parent.directorLevelChange(this.approverList[0].directorId)
+    },
+    // 获取主管等级数据
+    async direSxyList() {
+      const res = await api.directorLevelList();
+      if (res.data.state == "ok") {
+        this.options = res.data.data;
+      } else {
+        this.options = this.optionsList;
+      }
+    },
+    // 展示弹出
+    showApproverSelector() {
+      this.visible = !this.visible
+    },
+    // 人员选择确认
+    memberSelectorConfirm(data) {
+      const result = JSON.parse(data);
+      if (result.type === 0) {
+        this.approverList = result.list;
+      } else {
+        this.notifierList = result.list;
+      }
+    },
+    showStaffSelector(val) {
+      this.memberSelectorType = val;
+      this.nodeVisible = true;
+      const params = val === 0 ? this.approverList : this.notifierList;
+      this.$nextTick(() => {
+        this.$refs.nodeForm.init(params);
+      });
+    },
+    // 移除选项
+    removeItem(scope, index) {
+      this[scope].splice(index, 1);
+    },
+    // 清空
+    clear(scope) {
+      this[scope] = [];
+    },
+    // 取消弹出
+    cancel() {
+      this.visible = !this.visible
+    },
+    // 提交数据
+    submit() {
+      this.directorType.type = this.approverMode;
+      this.directorType.typeName = this.approverMode == 1 ? "指定成员" : "主管";
+      const ntList = [];
+      for (let i = 0; i < this.notifierList.length; i++) {
+        const item = this.notifierList[i];
+        ntList.push({
+          id: item.id,
+          userName: item.name || item.userName,
+          phone: item.phone,
+          roleName: item.roleName,
+          companyId: item.comNo || item.companyId,
+          userId: item.memberNo
+        });
+      }
+
+      // 判断是否为抄送人
+      if (!this.isCCTask) {
+        // 1为指定成员，2为主管
+        if (this.approverMode == 1) {
+          if (!this.approverList.length) {
+            this.$message.warning("请配置审批人");
+            return;
+          }
+          const apList = [];
+          for (let i = 0; i < this.approverList.length; i++) {
+            const item = this.approverList[i];
+            if (item.id) {
+              apList.push({
+                id: item.id,
+                userName: item.userName || item.name,
+                phone: item.phone,
+                roleName: item.roleName,
+                companyId: item.comNo || item.companyId,
+                userId: item.memberNo  || item.userId
+              });
+            }
+          }
+          const json = { approverType: this.approverType, approvers: apList, notifiers: ntList, passCopy: this.passCopy, directorType: this.directorType };
+          json.directorType.authType = "";
+          this.$parent.submitApprover(json)
+        } else {
+
+          this.appList[0].directorName =  this.approverList[0] ? this.approverList[0].directorName : "直接主管";
+          this.appList[0].directorId = this.approverList[0] ? this.approverList[0].directorId : 0;
+
+          const SxyData = { approverType: this.approverType, approvers: this.appList, notifiers: ntList, passCopy: this.passCopy, directorType: this.directorType };
+          if (SxyData.approvers[0].directorId == undefined) {
+            SxyData.approvers[0].directorId = 0;
+            SxyData.approvers[0].directorName = "直接主管";
+          }
+          this.$parent.submitApprover(SxyData)
+        }
+      } else {
+        // 抄送人数据
+        var row = ntList.map(value => {
+          value.type = "1"
+          value.memberNo = value.userId
+          return value
+        })
+        var sxyData = { approverType: this.approverType, approvers: this.appList, notifiers: row, passCopy: this.passCopy, directorType: this.directorType };
+        this.$parent.submitCopyer(sxyData);
+      }
+
+    }
+  },
+  computed: {
+    // 过滤非主管的审批模块
+    filterType(type) {
+      if (this.queryInfo.type == "notice") {
+        return false
+      } else if (this.queryInfo.type == "officialDocument") {
+        return false
+      } else {
+        return true
+      }
+    }
+  }
+};
+</script>
+<style scoped style='scss'>
+/deep/ .el-drawer__header{
+    font-size: 16px;
+    color: #000;
+    padding-bottom: 10px;
+    padding-top: 10px;
+    padding-left: 25px;
+}
+/deep/ .el-radio-group{
+    display: flex;
+    flex-direction: column;
+}
+
+/deep/ .el-radio-group .el-radio{
+    margin-bottom: 15px;
+}
+
+/deep/ .el-radio-group .el-radio:last-child{
+    margin-bottom: 0;
+}
+
+/deep/ :focus {
+    outline: 0;
+}
+/deep/ .el-drawer {
+    width: 25% !important;
+}
+/deep/ .el-drawer__header {
+    margin-bottom: 0;
+}
+.approverSelectorItem{}
+
+.rowDirection /deep/ .el-radio-group{
+    display: flex;
+    flex-direction: row;
+}
+
+.rowDirection /deep/ .el-radio-group .el-radio{
+    margin-bottom: 10px;
+}
+
+.layoutRowItem{
+    display: flex;
+    align-items: center;
+    border-top: 1px solid #eaeaea;
+    padding: 20px 0 20px 0;
+}
+
+.multi-title {
+    margin-bottom: 10px;
+    font-size: 14px;
+    padding: 15px 25px 0 25px;
+    border-top: 1px solid #eaeaea;
+    color: #111;
+}
+
+.layoutRowItem .multi-title{
+    border: none;
+    padding: 0 0 0 25px;
+    margin-bottom: 0;
+}
+
+.layoutRowItem .approverSelectorItemCon{
+    padding: 0px;
+}
+
+.approverSelectorItemCon{
+    padding: 5px 25px 18px 25px;
+}
+
+/* 标签 */
+.tagList{
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    margin-top: 15px;
+    align-items: center;
+}
+
+.tagList /deep/ .el-tag.el-tag--info{
+    border: #d9ecff;
+    color: #333;
+}
+
+/* 底部 */
+.drawer-footer {
+    padding: 20px;
+    box-sizing: border-box;
+    border-top: 1px solid #f4f4f8;
+}
+
+.drawer-wrap {
+    overflow-y: auto;
+}
+.selector-bar {
+    box-sizing: border-box;
+}
+.selector-bar.no-padding {
+    padding: 0 20px 20px;
+    box-sizing: border-box;
+}
+.selector-bar.border {
+    border-top: 1px solid #f4f4f8;
+}
+.selector-bar__title {
+    margin-bottom: 10px;
+    font-size: 14px;
+    color: #000;
+}
+.selector-list {
+    padding: 10px 0 0 0;
+    box-sizing: border-box;
+    display: flex;
+    flex-wrap: wrap;
+    flex-direction: column;
+}
+.list-item {
+    margin-right: 10px;
+    margin-bottom: 10px;
+}
+.list-item-btn {
+    width: 60px;
+}
+.clear-btn {
+    cursor: pointer;
+    font-size: 12px;
+    color: #409eff;
+}
+</style>