diff --git a/src/assets/img/project/select-staff/arrow-down.png b/src/assets/img/project/select-staff/arrow-down.png
new file mode 100644
index 00000000..81ea3f7d
Binary files /dev/null and b/src/assets/img/project/select-staff/arrow-down.png differ
diff --git a/src/assets/img/project/select-staff/arrow-right.png b/src/assets/img/project/select-staff/arrow-right.png
new file mode 100644
index 00000000..01bf885d
Binary files /dev/null and b/src/assets/img/project/select-staff/arrow-right.png differ
diff --git a/src/assets/img/project/select-staff/arrow2-right.png b/src/assets/img/project/select-staff/arrow2-right.png
new file mode 100644
index 00000000..1f967cdd
Binary files /dev/null and b/src/assets/img/project/select-staff/arrow2-right.png differ
diff --git a/src/assets/img/project/select-staff/arrow3-left.png b/src/assets/img/project/select-staff/arrow3-left.png
new file mode 100644
index 00000000..0eef456d
Binary files /dev/null and b/src/assets/img/project/select-staff/arrow3-left.png differ
diff --git a/src/assets/img/project/select-staff/arrow4-down.png b/src/assets/img/project/select-staff/arrow4-down.png
new file mode 100644
index 00000000..104b1acf
Binary files /dev/null and b/src/assets/img/project/select-staff/arrow4-down.png differ
diff --git a/src/assets/img/project/select-staff/btn-add.png b/src/assets/img/project/select-staff/btn-add.png
new file mode 100644
index 00000000..140885be
Binary files /dev/null and b/src/assets/img/project/select-staff/btn-add.png differ
diff --git a/src/assets/img/project/select-staff/btn-more.png b/src/assets/img/project/select-staff/btn-more.png
new file mode 100644
index 00000000..714c4079
Binary files /dev/null and b/src/assets/img/project/select-staff/btn-more.png differ
diff --git a/src/assets/img/project/select-staff/checked.png b/src/assets/img/project/select-staff/checked.png
new file mode 100644
index 00000000..a66646cb
Binary files /dev/null and b/src/assets/img/project/select-staff/checked.png differ
diff --git a/src/assets/img/project/select-staff/close.png b/src/assets/img/project/select-staff/close.png
new file mode 100644
index 00000000..a77645b3
Binary files /dev/null and b/src/assets/img/project/select-staff/close.png differ
diff --git a/src/assets/img/project/select-staff/close2.png b/src/assets/img/project/select-staff/close2.png
new file mode 100644
index 00000000..eebdfd7f
Binary files /dev/null and b/src/assets/img/project/select-staff/close2.png differ
diff --git a/src/assets/img/project/select-staff/edit.png b/src/assets/img/project/select-staff/edit.png
new file mode 100644
index 00000000..d34b2eec
Binary files /dev/null and b/src/assets/img/project/select-staff/edit.png differ
diff --git a/src/assets/img/project/select-staff/f5.png b/src/assets/img/project/select-staff/f5.png
new file mode 100644
index 00000000..439b0f3f
Binary files /dev/null and b/src/assets/img/project/select-staff/f5.png differ
diff --git a/src/assets/img/project/select-staff/house.png b/src/assets/img/project/select-staff/house.png
new file mode 100644
index 00000000..17dab895
Binary files /dev/null and b/src/assets/img/project/select-staff/house.png differ
diff --git a/src/assets/img/project/select-staff/nothing.png b/src/assets/img/project/select-staff/nothing.png
new file mode 100644
index 00000000..f1407a7e
Binary files /dev/null and b/src/assets/img/project/select-staff/nothing.png differ
diff --git a/src/assets/img/project/select-staff/phone.png b/src/assets/img/project/select-staff/phone.png
new file mode 100644
index 00000000..9b1072e5
Binary files /dev/null and b/src/assets/img/project/select-staff/phone.png differ
diff --git a/src/assets/img/project/select-staff/pos.png b/src/assets/img/project/select-staff/pos.png
new file mode 100644
index 00000000..578dcaa2
Binary files /dev/null and b/src/assets/img/project/select-staff/pos.png differ
diff --git a/src/assets/img/project/select-staff/rhombus.png b/src/assets/img/project/select-staff/rhombus.png
new file mode 100644
index 00000000..cfef37ff
Binary files /dev/null and b/src/assets/img/project/select-staff/rhombus.png differ
diff --git a/src/assets/img/project/select-staff/rotate.png b/src/assets/img/project/select-staff/rotate.png
new file mode 100644
index 00000000..91bef26c
Binary files /dev/null and b/src/assets/img/project/select-staff/rotate.png differ
diff --git a/src/assets/img/project/select-staff/select.png b/src/assets/img/project/select-staff/select.png
new file mode 100644
index 00000000..67f00c52
Binary files /dev/null and b/src/assets/img/project/select-staff/select.png differ
diff --git a/src/assets/img/project/select-staff/selected.png b/src/assets/img/project/select-staff/selected.png
new file mode 100644
index 00000000..f1952432
Binary files /dev/null and b/src/assets/img/project/select-staff/selected.png differ
diff --git a/src/assets/img/project/select-staff/selected2.png b/src/assets/img/project/select-staff/selected2.png
new file mode 100644
index 00000000..ad3e0dd3
Binary files /dev/null and b/src/assets/img/project/select-staff/selected2.png differ
diff --git a/src/assets/img/project/select-staff/sort1.png b/src/assets/img/project/select-staff/sort1.png
new file mode 100644
index 00000000..c001250d
Binary files /dev/null and b/src/assets/img/project/select-staff/sort1.png differ
diff --git a/src/assets/img/project/select-staff/sort2.png b/src/assets/img/project/select-staff/sort2.png
new file mode 100644
index 00000000..3e1b56d0
Binary files /dev/null and b/src/assets/img/project/select-staff/sort2.png differ
diff --git a/src/assets/img/project/select-staff/sort3.png b/src/assets/img/project/select-staff/sort3.png
new file mode 100644
index 00000000..de0f2709
Binary files /dev/null and b/src/assets/img/project/select-staff/sort3.png differ
diff --git a/src/assets/img/project/select-staff/staff-default-avatar-boy.png b/src/assets/img/project/select-staff/staff-default-avatar-boy.png
new file mode 100644
index 00000000..c7e813d3
Binary files /dev/null and b/src/assets/img/project/select-staff/staff-default-avatar-boy.png differ
diff --git a/src/assets/img/project/select-staff/staff-default-avatar-girl.png b/src/assets/img/project/select-staff/staff-default-avatar-girl.png
new file mode 100644
index 00000000..8b8f2426
Binary files /dev/null and b/src/assets/img/project/select-staff/staff-default-avatar-girl.png differ
diff --git a/src/assets/img/project/select-staff/staff-default-avatar.png b/src/assets/img/project/select-staff/staff-default-avatar.png
new file mode 100644
index 00000000..c7e813d3
Binary files /dev/null and b/src/assets/img/project/select-staff/staff-default-avatar.png differ
diff --git a/src/assets/img/project/select-staff/user-add.png b/src/assets/img/project/select-staff/user-add.png
new file mode 100644
index 00000000..6289b0b3
Binary files /dev/null and b/src/assets/img/project/select-staff/user-add.png differ
diff --git a/src/assets/img/project/select-staff/xuncha.png b/src/assets/img/project/select-staff/xuncha.png
new file mode 100644
index 00000000..e5f39de2
Binary files /dev/null and b/src/assets/img/project/select-staff/xuncha.png differ
diff --git a/src/assets/scss/c/function.scss b/src/assets/scss/c/function.scss
index 74b02097..08686f38 100644
--- a/src/assets/scss/c/function.scss
+++ b/src/assets/scss/c/function.scss
@@ -57,13 +57,13 @@
 	transform: translate(-50%, -50%);
 }
 // 已知高度的容器在页面中水平垂直居中
-@mixin hub($w, $h) {
+@mixin hub {
 	position: absolute;
-	top: 50%;
-	left: 50%;
-	width: $w;
-	height: $h;
-	margin: -$h * 0.5 0 0 -$w * 0.5;
+	top: 0;
+	bottom: 0;
+	left: 0;
+	right: 0;
+	margin: auto;
 }
 // 未知高度容器在页面居中,父元素必须相对定位
 @mixin hub2($sel, $w, $h) {
diff --git a/src/utils/deepClone.js b/src/utils/deepClone.js
new file mode 100644
index 00000000..eaae9761
--- /dev/null
+++ b/src/utils/deepClone.js
@@ -0,0 +1,10 @@
+/**
+ * 深度克隆
+ */
+export default function(arg) {
+	if (typeof arg == 'object' || typeof arg == 'array') {
+		return JSON.parse(JSON.stringify(arg));
+	} else {
+		return arg;
+	}
+}
diff --git a/src/views/components/selectStaff.vue b/src/views/components/selectStaff.vue
new file mode 100644
index 00000000..f0627597
--- /dev/null
+++ b/src/views/components/selectStaff.vue
@@ -0,0 +1,1362 @@
+<template>
+  <div class="m-select_staff" v-show="!hidden">
+    <div id="wrap" class="wrap a-fade-in-up">
+      <div class="title">
+        <div class="row" v-show="currPanel == 'agency'">
+          <div class="title-ico f-fl a-fade-in" @click="cancel">
+            <img
+              class="title-ico-close"
+              src="@/assets/img/project/select-staff/close.png"
+            />
+          </div>
+          <div class="title-btn a-fade-in f-fr" @click="confirm">确定</div>
+        </div>
+
+        <div class="row" v-show="currPanel == 'staff'">
+          <div class="title-ico f-fl a-fade-in-left" @click="shiftAgencyPanel">
+            <img
+              class="title-ico-back"
+              src="@/assets/img/project/select-staff/arrow3-left.png"
+            />
+          </div>
+          <div class="title-btn a-fade-in f-fr" @click="confirmStaff">选中</div>
+        </div>
+      </div>
+
+      <div class="wrap2 a-fade-in-right" v-show="currPanel == 'agency'">
+        <div class="menu-title" v-if="parentAgencyList.length > 0">
+          上级组织
+        </div>
+        <div
+          class="menu"
+          @click="shiftStaffPanel(item.agencyId)"
+          v-for="item in parentAgencyList"
+          :key="item.agencyId"
+        >
+          <div class="name f-fl">{{ item.agencyName }}</div>
+
+          <img
+            class="ico-go f-fr"
+            src="@/assets/img/project/select-staff/arrow-right.png"
+          />
+          <div v-if="item.selectedTotal" class="num f-fr">
+            (已选{{ item.selectedTotal }}人)
+          </div>
+        </div>
+
+        <div class="menu-title">我所在的</div>
+        <div class="menu" @click="shiftStaffPanel(agency.agencyId)">
+          <div class="name f-fl">{{ agency.agencyName }}</div>
+
+          <img
+            class="ico-go f-fr"
+            src="@/assets/img/project/select-staff/arrow-right.png"
+          />
+          <div v-if="agency.selectedTotal" class="num f-fr">
+            (已选{{ agency.selectedTotal }}人)
+          </div>
+        </div>
+
+        <div class="menu-title" v-if="subAgencyList.length > 0">下级组织</div>
+        <div
+          class="menu"
+          :class="'z-retract-' + item.retract"
+          v-show="!item.hidden"
+          @click="shiftStaffPanel(item.agencyId)"
+          v-for="(item, index) in subAgencyList"
+          :key="item.agencyId"
+        >
+          <img
+            mode="aspectFit"
+            @click.stop="shiftUnfold(index)"
+            v-if="item.sonIds.length > 0"
+            class="ico-fold f-fl"
+            :class="!item.folded ? 'z-unfold' : ''"
+            src="@/assets/img/project/select-staff/select.png"
+          />
+          <div class="name f-fl">{{ item.agencyName }}</div>
+
+          <img
+            class="ico-go f-fr"
+            src="@/assets/img/project/select-staff/arrow-right.png"
+          />
+          <div v-if="item.selectedTotal" class="num f-fr">
+            (已选{{ item.selectedTotal }}人)
+          </div>
+        </div>
+
+        <div v-if="agencyLoading" class="m-hint">加载中……</div>
+      </div>
+
+      <div class="wrap2 a-fade-in-right" v-show="currPanel == 'staff'">
+        <div v-if="staffLoading" class="m-hint">加载中……</div>
+        <div
+          v-else-if="
+            staffData.agencyStaffList.length == 0 &&
+            staffData.gridList.length == 0 &&
+            staffData.departmentList.length == 0
+          "
+          class="m-hint"
+        >
+          暂无可选人员
+        </div>
+
+        <div v-show="!staffLoading && staffData.agencyStaffList.length != 0">
+          <div class="list-title z-retract-1">
+            <span>组织工作人员</span>
+          </div>
+
+          <div>
+            <div
+              class="item z-retract-1"
+              :key="'agency' + item.staffId"
+              v-for="(item, index) in staffData.agencyStaffList"
+              @click="selectAgencyStaff(index)"
+            >
+              <div class="item-wrap">
+                <div class="f-fl ico" :class="item.selected ? 'z-on' : ''">
+                  <img src="@/assets/img/project/select-staff/selected2.png" />
+                </div>
+
+                <img
+                  class="f-fl avatar"
+                  v-if="item.gender == 1"
+                  src="@/assets/img/project/select-staff/staff-default-avatar-boy.png"
+                />
+                <img
+                  class="f-fl avatar"
+                  v-else
+                  src="@/assets/img/project/select-staff/staff-default-avatar-girl.png"
+                />
+                <div class="f-fl name">
+                  {{ item.staffName }}
+                  <span v-if="item.roleName" class="z-stress">{{
+                    item.roleName
+                  }}</span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div
+          v-show="!staffLoading && staffData.departmentList.length != 0"
+          class="list"
+        >
+          <div class="list-title z-retract-1">
+            <div
+              class="f-fl ico"
+              :class="staffData.departmentSelected ? 'z-on' : ''"
+              @click.stop="shiftSelectAllDepartment"
+            >
+              <img src="@/assets/img/project/select-staff/selected2.png" />
+            </div>
+
+            <span>部门</span>
+          </div>
+          <div
+            :key="department.departmentName"
+            v-for="(department, departmentIndex) in staffData.departmentList"
+          >
+            <div
+              class="list-title z-retract-2"
+              @click="shiftDepartmentUnfold(departmentIndex)"
+            >
+              <div
+                class="f-fl ico"
+                :class="department.selected ? 'z-on' : ''"
+                @click.stop="shiftSelectDepartment(departmentIndex)"
+              >
+                <img src="@/assets/img/project/select-staff/selected2.png" />
+              </div>
+
+              <span>{{ department.departmentName }}</span>
+              <img
+                class="f-fr ico-go"
+                :class="!department.folded ? 'z-unfold' : ''"
+                src="@/assets/img/project/select-staff/select.png"
+              />
+            </div>
+
+            <div
+              class="item z-retract-3"
+              v-show="!department.folded"
+              :key="department.departmentId + item.staffId"
+              v-for="(item, index) in department.departmentStaffList"
+              @click="selectDepartmentStaff(departmentIndex, index)"
+            >
+              <div class="item-wrap">
+                <div class="f-fl ico" :class="item.selected ? 'z-on' : ''">
+                  <img
+                    mode="widthFix"
+                    src="@/assets/img/project/select-staff/selected2.png"
+                  />
+                </div>
+
+                <img
+                  class="f-fl avatar"
+                  v-if="item.gender == 1"
+                  src="@/assets/img/project/select-staff/staff-default-avatar-boy.png"
+                />
+                <img
+                  class="f-fl avatar"
+                  v-else
+                  src="@/assets/img/project/select-staff/staff-default-avatar-girl.png"
+                />
+                <div class="f-fl name">
+                  {{ item.staffName }}
+                  <span v-if="item.roleName" class="z-stress">{{
+                    item.roleName
+                  }}</span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div
+          v-show="!staffLoading && staffData.gridList.length != 0"
+          class="list"
+        >
+          <div class="list-title z-retract-1">
+            <div
+              class="f-fl ico"
+              :class="staffData.gridSelected ? 'z-on' : ''"
+              @click.stop="shiftSelectAllGrid"
+            >
+              <img src="@/assets/img/project/select-staff/selected2.png" />
+            </div>
+
+            <span>网格</span>
+          </div>
+          <div
+            :key="grid.gridName"
+            v-for="(grid, gridIndex) in staffData.gridList"
+          >
+            <div
+              class="list-title z-retract-2"
+              @click="shiftGridUnfold(gridIndex)"
+            >
+              <div
+                class="f-fl ico"
+                :class="grid.selected ? 'z-on' : ''"
+                @click.stop="shiftSelectGrid(gridIndex)"
+              >
+                <img src="@/assets/img/project/select-staff/selected2.png" />
+              </div>
+
+              <span>{{ grid.gridName }}</span>
+              <img
+                class="f-fr ico-go"
+                :class="!grid.folded ? 'z-unfold' : ''"
+                src="@/assets/img/project/select-staff/select.png"
+              />
+            </div>
+
+            <div
+              class="item z-retract-3"
+              v-show="!grid.folded"
+              :key="grid.gridId + item.staffId"
+              v-for="(item, index) in grid.gridStaffList"
+              @click="selectGridStaff(gridIndex, index)"
+            >
+              <div class="item-wrap">
+                <div class="f-fl ico" :class="item.selected ? 'z-on' : ''">
+                  <img src="@/assets/img/project/select-staff/selected2.png" />
+                </div>
+
+                <img
+                  class="f-fl avatar"
+                  v-if="item.gender == 1"
+                  src="@/assets/img/project/select-staff/staff-default-avatar-boy.png"
+                />
+                <img
+                  class="f-fl avatar"
+                  v-else
+                  src="@/assets/img/project/select-staff/staff-default-avatar-girl.png"
+                />
+                <div class="f-fl name">
+                  {{ item.staffName }}
+                  <span v-if="item.roleName" class="z-stress">{{
+                    item.roleName
+                  }}</span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { requestPost } from "@/js/dai/request";
+import { mapGetters } from "vuex";
+import deepClone from "@/utils/deepClone.js";
+
+export default {
+  components: {},
+  props: {
+    issueId: {
+      type: String,
+      default: "",
+    },
+    projectId: {
+      type: String,
+      default: "",
+    },
+  },
+
+  data() {
+    return {
+      hidden: false,
+
+      // 显示组织还是人员 agency staff
+      currPanel: "agency",
+
+      agencyLoading: false,
+
+      agency: {
+        agencyId: "",
+        agencyName: "",
+        selectedTotal: 0,
+      },
+
+      parentAgencyList: [
+        // {
+        //   agencyId: "2",
+        //   agencyName: "山东省",
+        //   selectedTotal: 0,
+        // },
+        // {
+        //   agencyId: "3",
+        //   agencyName: "青岛市",
+        //   selectedTotal: 0,
+        // },
+      ],
+
+      subAgencyList: [
+        // {
+        //   agencyId: "4",
+        //   agencyName: "青岛市",
+        //   selectedTotal: 0,
+        //   retract: 0,
+        //   folded: true,
+        //   hidden: false,
+        //   sonIds: [5],
+        //   desIds: [5, 6, 7, 8],
+        // },
+        // {
+        //   agencyId: "5",
+        //   agencyName: "城阳区",
+        //   selectedTotal: 2,
+        //   retract: 1,
+        //   folded: true,
+        //   hidden: false,
+        //   sonIds: [6],
+        //   desIds: [6, 7, 8],
+        // },
+        // {
+        //   agencyId: "6",
+        //   agencyName: "黑龙江路街道",
+        //   selectedTotal: 2,
+        //   retract: 2,
+        //   folded: true,
+        //   hidden: false,
+        //   sonIds: [7, 8],
+        //   desIds: [7, 8],
+        // },
+        // {
+        //   agencyId: "7",
+        //   agencyName: "桃花源社区",
+        //   selectedTotal: 2,
+        //   retract: 3,
+        //   folded: true,
+        //   hidden: false,
+        //   sonIds: [],
+        //   desIds: [],
+        // },
+        // {
+        //   agencyId: "8",
+        //   agencyName: "巴拉巴拉社区",
+        //   selectedTotal: 0,
+        //   retract: 3,
+        //   folded: true,
+        //   hidden: false,
+        //   sonIds: [],
+        //   desIds: [],
+        // },
+      ],
+
+      staffLoading: false,
+      currAgencyId: "",
+      staffData: {
+        agencyStaffList: [
+          // {
+          //   staffId: "74758",
+          //   staffName: "oHdjWbXSau",
+          //   staffHeadPhoto: "HFp20nYBLh",
+          //   gender: "pLBQxDJLq3",
+          //   roleName: "pRNg4BV92E",
+          //   selected: false,
+          // },
+        ],
+
+        departmentSelected: false,
+        departmentList: [
+          // {
+          //   departmentId: "73782",
+          //   departmentName: "bluw7HpyhT",
+          //   selected: false,
+          //   folded: true,
+          //   departmentStaffList: [
+          //     {
+          //       staffId: "747358",
+          //       staffName: "oHdjWbXSau",
+          //       staffHeadPhoto: "HFp20nYBLh",
+          //       gender: "pLBQxDJLq3",
+          //       roleName: "pRNg4BV92E",
+          //       selected: false,
+          //     },
+          //   ],
+          // },
+        ],
+
+        gridSelected: false,
+        gridList: [
+          // {
+          //   gridId: "73782",
+          //   gridName: "bluw7HpyhT",
+          //   selected: false,
+          //   folded: true,
+          //   gridStaffList: [
+          //     {
+          //       staffId: "747358",
+          //       staffName: "oHdjWbXSau",
+          //       staffHeadPhoto: "HFp20nYBLh",
+          //       gender: "pLBQxDJLq3",
+          //       roleName: "pRNg4BV92E",
+          //       selected: false,
+          //     },
+          //   ],
+          // },
+        ],
+      },
+    };
+  },
+  async created() {},
+  async mounted() {
+    this.getAgencyData();
+  },
+  computed: {
+    tableHeight() {
+      return this.clientHeight - 460;
+    },
+    rowHeight() {
+      return this.clientHeight - 200 + "px";
+    },
+    ...mapGetters(["clientHeight"]),
+  },
+  watch: {},
+  methods: {
+    setData(obj) {
+      if (typeof obj == "object" && obj) {
+        Object.keys(obj).forEach((k) => {
+          this[k] = obj[k];
+        });
+      }
+    },
+
+    shiftStaffPanel(id) {
+      this.setData({
+        currPanel: "staff",
+        currAgencyId: id,
+      });
+
+      this.iniStaffData();
+    },
+
+    shiftAgencyPanel() {
+      this.setData({
+        currPanel: "agency",
+        staffData: {
+          agencyStaffList: [],
+          departmentList: [],
+          gridList: [],
+          gridSelected: false,
+          departmentSelected: false,
+        },
+      });
+    },
+
+    shiftUnfold(index) {
+      const { subAgencyList } = this;
+      let item = subAgencyList[index];
+      item.folded = !item.folded;
+      if (item.folded && item.desIds.length > 0) {
+        subAgencyList.forEach((sItem) => {
+          if (item.desIds.indexOf(sItem.agencyId) !== -1) {
+            sItem.hidden = true;
+            sItem.folded = true;
+          }
+        });
+      } else if (item.sonIds.length > 0) {
+        subAgencyList.forEach((sItem) => {
+          if (item.sonIds.indexOf(sItem.agencyId) !== -1) {
+            sItem.hidden = false;
+          }
+        });
+      }
+      this.setData({ subAgencyList });
+    },
+
+    show() {
+      this.setData({
+        hidden: false,
+      });
+    },
+
+    hide() {
+      // this.setData({ hidden: true });
+      this.$emit("close");
+    },
+
+    shiftDepartmentUnfold(index) {
+      const { staffData } = this;
+      let item = staffData.departmentList[index];
+      item.folded = !item.folded;
+      this.setData({ staffData });
+    },
+
+    shiftGridUnfold(index) {
+      const { staffData } = this;
+      let item = staffData.gridList[index];
+      item.folded = !item.folded;
+      this.setData({ staffData });
+    },
+
+    selectAgencyStaff(index) {
+      let { staffData } = this;
+      let item = staffData.agencyStaffList[index];
+      item.selected = !item.selected;
+      this.setData({ staffData });
+    },
+
+    selectDepartmentStaff(dindex, index) {
+      let { staffData } = this;
+      let item = staffData.departmentList[dindex].departmentStaffList[index];
+      item.selected = !item.selected;
+      this.setData({ staffData });
+      this.computeStaffSupSelected();
+    },
+    selectGridStaff(dindex, index) {
+      let { staffData } = this;
+      let item = staffData.gridList[dindex].gridStaffList[index];
+      item.selected = !item.selected;
+      this.setData({ staffData });
+      this.computeStaffSupSelected();
+    },
+
+    // 重新计算staff所属部门、网格的选中情况
+    computeStaffSupSelected() {
+      let { staffData } = this;
+      staffData.departmentList.forEach((dpt) => {
+        dpt.selected = dpt.departmentStaffList.some((staff) => staff.selected);
+      });
+      staffData.gridList.forEach((dpt) => {
+        dpt.selected = dpt.gridStaffList.some((staff) => staff.selected);
+      });
+      staffData.departmentSelected = staffData.departmentList.every(
+        (dpt) => dpt.selected
+      );
+      staffData.gridSelected = staffData.gridList.every((dpt) => dpt.selected);
+      this.setData({ staffData });
+    },
+
+    shiftSelectAllDepartment() {
+      const { staffData } = this;
+      if (staffData.departmentSelected) {
+        staffData.departmentSelected = false;
+        staffData.departmentList.forEach((item) => {
+          this.selectDepartment(item, false);
+        });
+        this.setData({ staffData });
+      } else {
+        staffData.departmentList.forEach((item) => {
+          this.selectDepartment(item, true);
+        });
+        this.setData({ staffData });
+        this.computeStaffSupSelected();
+      }
+    },
+    shiftSelectDepartment(index) {
+      const { staffData } = this;
+      let dItem = staffData.departmentList[index];
+      this.selectDepartment(dItem, !dItem.selected);
+      this.setData({ staffData });
+      this.computeStaffSupSelected();
+    },
+    selectDepartment(dItem, selected = true) {
+      if (!selected) {
+        dItem.selected = false;
+        dItem.departmentStaffList.forEach((item) => {
+          item.selected = false;
+        });
+        return "";
+      } else {
+        let succ = false;
+        dItem.departmentStaffList.forEach((item) => {
+          if (item.roleName == "部门领导") {
+            item.selected = true;
+            succ = true;
+          } else {
+            item.selected = false;
+          }
+        });
+        if (!succ) {
+          return this.$message.error(dItem.departmentName + "下无【部门领导】");
+        } else {
+          dItem.selected = true;
+        }
+      }
+    },
+
+    shiftSelectAllGrid() {
+      const { staffData } = this;
+      if (staffData.gridSelected) {
+        staffData.gridSelected = false;
+        staffData.gridList.forEach((item) => {
+          this.selectGrid(item, false);
+        });
+        this.setData({ staffData });
+      } else {
+        staffData.gridList.forEach((item) => {
+          this.selectGrid(item, true);
+        });
+        this.setData({ staffData });
+        this.computeStaffSupSelected();
+      }
+    },
+    shiftSelectGrid(index) {
+      const { staffData } = this;
+      let dItem = staffData.gridList[index];
+      this.selectGrid(dItem, !dItem.selected);
+      this.setData({ staffData });
+      this.computeStaffSupSelected();
+    },
+    selectGrid(dItem, selected = true) {
+      if (!selected) {
+        dItem.selected = false;
+        dItem.gridStaffList.forEach((item) => {
+          item.selected = false;
+        });
+        return "";
+      } else {
+        let succ = false;
+        dItem.gridStaffList.forEach((item) => {
+          if (item.roleName == "网格长") {
+            item.selected = true;
+            succ = true;
+          } else {
+            item.selected = false;
+          }
+        });
+        if (!succ) {
+          return this.$message.error(dItem.gridName + "下无【网格长】");
+        } else {
+          dItem.selected = true;
+        }
+      }
+    },
+
+    // 输出staffData格式为接口想要的格式
+    outputStaffData(staffData, agencyId) {
+      let arr = [];
+      const addFn = (item, departmentId = "", gridId = "") => {
+        if (item.selected) {
+          arr.push({
+            agencyId,
+            staffId: item.staffId,
+            departmentId,
+            gridId,
+          });
+        }
+      };
+      staffData.agencyStaffList.forEach((item) => addFn(item));
+      staffData.departmentList.forEach((sitem) => {
+        sitem.departmentStaffList.forEach((item) =>
+          addFn(item, sitem.departmentId)
+        );
+      });
+      staffData.gridList.forEach((sitem) => {
+        sitem.gridStaffList.forEach((item) => addFn(item, "", sitem.gridId));
+      });
+      return arr;
+    },
+
+    confirmStaff() {
+      const { staffData, currAgencyId } = this;
+      let { agency, parentAgencyList, subAgencyList } = this;
+      [agency, ...parentAgencyList, ...subAgencyList].some((item) => {
+        if (item.agencyId == currAgencyId) {
+          item.staffData = staffData;
+          item.selectedTotal = this.outputStaffData(
+            staffData,
+            currAgencyId
+          ).length;
+          return true;
+        }
+        return false;
+      });
+      this.setData({
+        agency,
+        parentAgencyList,
+        subAgencyList,
+      });
+      this.shiftAgencyPanel();
+    },
+
+    confirm() {
+      let ret = [];
+      const { agency, parentAgencyList, subAgencyList } = this;
+      [agency, ...parentAgencyList, ...subAgencyList].forEach((item) => {
+        if (item.staffData) {
+          let arr = this.outputStaffData(item.staffData, item.agencyId);
+          ret.push(...arr);
+        }
+      });
+      this.hide();
+      this.$emit("confirm", ret);
+    },
+
+    cancel() {
+      this.hide();
+    },
+
+    iniStaffData() {
+      const { currAgencyId } = this;
+      if (!currAgencyId) return;
+      const { agency, parentAgencyList, subAgencyList } = this;
+      let staffData;
+      [agency, ...parentAgencyList, ...subAgencyList].some((item) => {
+        if (item.agencyId == currAgencyId) {
+          if (item.staffData) {
+            staffData = deepClone(item.staffData);
+          }
+          return true;
+        }
+        return false;
+      });
+      if (!staffData) {
+        this.getStaffData();
+      } else {
+        this.setData({ staffData });
+      }
+    },
+
+    // 获取当前组织信息
+    async getStaffData() {
+      const { issueId, projectId, currAgencyId } = this;
+
+      this.setData({
+        staffLoading: true,
+      });
+
+      const url = projectId
+        ? "/gov/project/trace/departmentstafflist"
+        : "/gov/issue/manage/departmentstafflist";
+
+      const { data, code, msg } = await requestPost(
+        url,
+        {
+          issueId,
+          projectStaffId: projectId,
+          agencyId: currAgencyId,
+        },
+        {
+          // isMock: true,
+          // isQuiet: true
+        }
+      );
+
+      this.setData({
+        staffLoading: false,
+      });
+
+      if (msg === "success" && code === 0) {
+        const staffFn = (item) => {
+          item.selected = false;
+          return item;
+        };
+        const departmentFn = (item) => {
+          item.selected = false;
+          item.folded = true;
+          item.departmentStaffList.forEach(staffFn);
+          return item;
+        };
+        const gridFn = (item) => {
+          item.selected = false;
+          item.folded = true;
+          item.gridStaffList.forEach(staffFn);
+          return item;
+        };
+        let agencyStaffList =
+          data == null || !Array.isArray(data.agencyStaffList)
+            ? []
+            : data.agencyStaffList.map(staffFn);
+        let departmentList =
+          data == null || !Array.isArray(data.departmentList)
+            ? []
+            : data.departmentList.map(departmentFn);
+        let gridList =
+          data == null || !Array.isArray(data.gridList)
+            ? []
+            : data.gridList.map(gridFn);
+        this.setData({
+          staffData: {
+            agencyStaffList,
+            departmentList,
+            gridList,
+            gridSelected: false,
+            departmentSelected: false,
+          },
+        });
+      }
+    },
+
+    // 获取当前组织信息
+    async getAgencyData() {
+      const { projectId, issueId } = this;
+
+      this.setData({
+        agencyLoading: true,
+      });
+
+      const url = projectId
+        ? "/gov/project/trace/processorlist"
+        : issueId
+        ? "/gov/issue/manage/processorlist"
+        : "/gov/project/trace/approvalagencylist";
+
+      const { data, code, msg } = await requestPost(
+        url,
+        {
+          projectStaffId: projectId,
+          issueId,
+        },
+        {
+          // isMock: true,
+          // isQuiet: true
+        }
+      );
+
+      this.setData({
+        agencyLoading: false,
+      });
+
+      if (msg === "success" && code === 0) {
+        let agency = {
+          ...data.agencyList,
+          selectedTotal: 0,
+        };
+        let parentAgencyList = data.parentAgencyList.map((item) => {
+          return {
+            ...item,
+            selectedTotal: 0,
+          };
+        });
+
+        let rootSubAgencyList = [];
+        let tempForSort = 0;
+        const subFn = (list, retract = 0) => {
+          let sonIds = [];
+          let desIds = [];
+          list.forEach((item) => {
+            const { agencyName, agencyId, subAgencyList } = item;
+            let ret = {
+              agencyId,
+              agencyName,
+              selectedTotal: 0,
+              retract,
+              folded: true,
+              hidden: retract !== 0,
+              sonIds: [],
+              desIds: [],
+            };
+            sonIds.push(agencyId);
+            desIds.push(agencyId);
+            rootSubAgencyList.push(ret);
+            if (Array.isArray(subAgencyList) && subAgencyList.length > 0) {
+              let subData = subFn(subAgencyList, retract + 1);
+              ret.sonIds = subData.sonIds;
+              ret.desIds = subData.desIds;
+
+              desIds.push(...subData.desIds);
+            }
+          });
+          return { sonIds, desIds };
+        };
+        subFn(data.subAgencyList);
+
+        console.log(rootSubAgencyList);
+        this.setData({
+          agencyLoading: false,
+          agency,
+          parentAgencyList,
+          subAgencyList: rootSubAgencyList,
+        });
+      }
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+@import "@/assets/scss/c/config.scss";
+@import "@/assets/scss/c/function.scss";
+
+.m-hint {
+  text-align: center;
+  padding: 150px * 0.5 50px * 0.5;
+  line-height: 50px * 0.5;
+  color: #999;
+  text-align: center;
+  font-size: 32px * 0.5;
+  font-family: PingFang SC;
+  font-weight: 500;
+}
+
+.m-select_staff {
+  // @include shield;
+  // z-index: 1000;
+  position: relative;
+  width: 380px;
+  height: 60vh;
+  overflow: hidden;
+
+  .wrap {
+    position: absolute;
+    box-sizing: border-box;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    background-color: #ffffff;
+    border-radius: 10px * 0.5 10px * 0.5 0 0;
+  }
+
+  .wrap2 {
+    box-sizing: border-box;
+    height: 100%;
+    padding-top: 10px * 0.5;
+    padding-bottom: 120px * 0.5;
+    overflow-y: scroll;
+  }
+
+  .operate {
+    position: absolute;
+    z-index: 100;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 100px * 0.5;
+    background-color: #ffffff;
+    border-top: 1px * 0.5 solid #eee;
+
+    .btn {
+      float: left;
+      width: 50%;
+      text-align: center;
+      line-height: 100px * 0.5;
+      background-color: rgba(230, 0, 0, 1);
+      color: #ffffff;
+      text-align: center;
+      font-size: 20px;
+      font-family: PingFang SC;
+      font-weight: 500;
+      &.btn-off {
+        background-color: #ffffff;
+        color: #666;
+      }
+    }
+  }
+
+  .title {
+    position: relative;
+    margin: 0 auto;
+    padding: 20px * 0.5 0;
+    width: 710px * 0.5;
+    line-height: 60px * 0.5;
+    border-bottom: 1px * 0.5 solid #e7eeee;
+    font-size: 16px;
+    font-family: PingFang SC;
+    font-weight: 500;
+    color: rgba(151, 151, 151, 1);
+    .row {
+      overflow: hidden;
+    }
+    .title-ico {
+      position: relative;
+      width: 60px * 0.5;
+      height: 60px * 0.5;
+      img {
+        @include hub;
+        &.title-ico-back {
+          width: 19px * 0.5;
+          height: 34px * 0.5;
+        }
+        &.title-ico-close {
+          width: 35px * 0.5;
+          height: 35px * 0.5;
+        }
+      }
+    }
+    .title-btn {
+      width: 140px * 0.5;
+      height: 60px * 0.5;
+      line-height: 60px * 0.5;
+      background: rgba(230, 0, 0, 1);
+      border-radius: 30px * 0.5;
+      font-size: 32px * 0.5;
+      font-family: PingFang SC;
+      font-weight: 500;
+      color: rgba(255, 255, 255, 1);
+      text-align: center;
+    }
+  }
+
+  .back-btn {
+    box-sizing: border-box;
+    margin: 15px * 0.5 20px * 0.5;
+    padding: 10px * 0.5 5px * 0.5;
+    width: 200px * 0.5;
+    border: 1px * 0.5 solid #e5e5e5;
+    line-height: 60px * 0.5;
+    border-radius: 10px * 0.5;
+    font-size: 20px;
+    font-family: PingFang SC;
+    font-weight: 500;
+    color: #e00;
+    text-align: center;
+  }
+
+  .menu-title {
+    margin-top: 20px * 0.5;
+    padding: 0 20px * 0.5;
+    line-height: 50px * 0.5;
+    font-size: 28px * 0.5;
+    font-family: PingFang SC;
+    font-weight: 500;
+    color: rgba(153, 153, 153, 1);
+  }
+
+  .menu {
+    @include cs;
+    box-sizing: border-box;
+    margin: 0 auto;
+    padding: 20px * 0.5 10px * 0.5;
+    width: 710px * 0.5;
+    border-top: 1px * 0.5 solid #fefefe;
+    line-height: 40px * 0.5;
+
+    .ico-radio {
+      position: relative;
+      display: block;
+      width: 50px * 0.5;
+      height: 40px * 0.5;
+      margin-right: 10px * 0.5;
+      transition: all 0.23s ease-in-out;
+
+      &::before {
+        @include hub;
+        content: "";
+        display: block;
+        width: 22px * 0.5;
+        height: 22px * 0.5;
+        border-radius: 100%;
+        border: 3px * 0.5 solid #aaa;
+        transition: all 0.23s ease-in-out;
+      }
+
+      &::after {
+        @include hub;
+        content: "";
+        display: block;
+        width: 10px * 0.5;
+        height: 10px * 0.5;
+        border-radius: 100%;
+        background-color: #aaa;
+        transform: scale(0);
+        transition: all 0.23s ease-in-out;
+      }
+
+      &.z-disabled {
+        &::before {
+          border-color: #e5e5e5;
+        }
+        &::after {
+          background-color: #e5e5e5;
+        }
+      }
+
+      &.z-on {
+        &::before {
+          border-color: #00e;
+        }
+        &::after {
+          background-color: #00e;
+          transform: scale(1);
+        }
+      }
+    }
+
+    .ico-fold {
+      display: inline-block;
+      box-sizing: content-box;
+      margin-left: -20px * 0.5;
+      padding: 4px * 0.5 10px * 0.5;
+      width: 32px * 0.5;
+      height: 32px * 0.5;
+      vertical-align: bottom;
+      transition: all 0.23s ease-in-out;
+      cursor: pointer;
+
+      &.z-unfold {
+        transform: rotate(90deg);
+      }
+    }
+
+    .name {
+      // @include toe;
+      width: 400px * 0.5;
+      font-size: 16px;
+      font-family: PingFang SC;
+      font-weight: 500;
+      color: rgba(51, 51, 51, 1);
+      cursor: pointer;
+    }
+
+    .num {
+      font-size: 26px * 0.5;
+      font-family: PingFang SC;
+      font-weight: 500;
+      color: rgba(230, 0, 0, 1);
+    }
+
+    .ico-go {
+      display: block;
+      margin: 10px * 0.5 15px * 0.5;
+      width: 13px * 0.5;
+      height: 24px * 0.5;
+      transition: all 0.23s ease-in-out;
+
+      &.z-unfold {
+        transform: rotate(90deg);
+      }
+    }
+  }
+
+  .list {
+    margin-top: 30px * 0.5;
+    view {
+      .list-title {
+        font-size: 18px;
+      }
+    }
+  }
+
+  .list-title {
+    margin: 5px * 0.5 0;
+    padding: 20px * 0.5;
+    font-size: 20px;
+    font-family: PingFang SC;
+    font-weight: 500;
+    color: rgba(51, 51, 51, 1);
+    line-height: 32px * 0.5;
+    cursor: pointer;
+
+    .ico {
+      position: relative;
+      top: -8px * 0.5;
+      margin-left: -15px * 0.5;
+      margin-right: 2px * 0.5;
+      width: 50px * 0.5;
+      height: 50px * 0.5;
+      cursor: pointer;
+
+      &::after,
+      img {
+        position: absolute;
+        display: block;
+        box-sizing: border-box;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        margin: auto;
+        width: 20px * 0.5;
+        height: 20px * 0.5;
+        display: block;
+      }
+      &::after {
+        content: "";
+        z-index: 1;
+        border: 1px solid rgba(153, 153, 153, 1);
+        border-radius: 1px;
+      }
+      img {
+        z-index: 2;
+        opacity: 0;
+        transform: scale(0);
+        transition: all 0.23s ease-in-out;
+      }
+      &.z-on {
+        &::after {
+          opacity: 0;
+        }
+        img {
+          opacity: 1;
+          transform: scale(1);
+        }
+      }
+    }
+
+    > img {
+      display: inline-block;
+      margin: 0 10px * 0.5;
+      width: 32px * 0.5;
+      height: 32px * 0.5;
+      vertical-align: bottom;
+      transition: all 0.23s ease-in-out;
+
+      &.z-unfold {
+        transform: rotate(90deg);
+      }
+    }
+  }
+
+  .item {
+    overflow: hidden;
+    cursor: pointer;
+
+    .item-wrap {
+      box-sizing: border-box;
+      padding: 20px * 0.5;
+      height: 90px * 0.5;
+      line-height: 50px * 0.5;
+      overflow: hidden;
+      border-bottom: 1px * 0.5 solid #fefefe;
+
+      .ico {
+        position: relative;
+        margin-left: -15px * 0.5;
+        margin-right: 2px * 0.5;
+        width: 50px * 0.5;
+        height: 50px * 0.5;
+
+        &::after,
+        img {
+          position: absolute;
+          display: block;
+          box-sizing: border-box;
+          top: 0;
+          left: 0;
+          right: 0;
+          bottom: 0;
+          margin: auto;
+          width: 20px * 0.5;
+          height: 20px * 0.5;
+          display: block;
+        }
+        &::after {
+          content: "";
+          z-index: 1;
+          border: 1px solid rgba(153, 153, 153, 1);
+          border-radius: 1px;
+        }
+        img {
+          z-index: 2;
+          opacity: 0;
+          transform: scale(0);
+          transition: all 0.23s ease-in-out;
+        }
+        &.z-on {
+          &::after {
+            opacity: 0;
+          }
+          img {
+            opacity: 1;
+            transform: scale(1);
+          }
+        }
+      }
+
+      .avatar {
+        position: relative;
+        margin-right: 10px * 0.5;
+        width: 50px * 0.5;
+        height: 50px * 0.5;
+
+        img {
+          width: 50px * 0.5;
+          height: 50px * 0.5;
+          border-radius: 100%;
+        }
+      }
+
+      .name {
+        @include toe;
+        width: 70%;
+        font-size: 18px;
+        font-family: PingFang SC;
+        font-weight: 500;
+        color: rgba(51, 51, 51, 1);
+
+        .z-stress {
+          position: relative;
+          display: inline-block;
+          vertical-align: middle;
+          padding: 0 5px * 0.5;
+          height: 24px * 0.5;
+          line-height: 24px * 0.5;
+          border: 1px * 0.5 solid rgba(187, 19, 19, 1);
+          border-radius: 12px * 0.5;
+          font-size: 10px;
+          font-family: PingFang SC;
+          font-weight: 500;
+          color: rgba(187, 19, 19, 1);
+        }
+      }
+
+      .else {
+        text {
+          font-size: 16px;
+          font-family: PingFang SC;
+          font-weight: 500;
+          color: rgba(153, 153, 153, 1);
+        }
+        img {
+          display: inline-block;
+          margin: 16px * 0.5 12px * 0.5;
+          width: 13px * 0.5;
+          height: 24px * 0.5;
+          vertical-align: bottom;
+        }
+      }
+    }
+  }
+
+  .z-retract-1 {
+    padding-left: 25px * 0.5;
+  }
+  .z-retract-2 {
+    padding-left: 25px * 0.5 * 2;
+  }
+  .z-retract-3 {
+    padding-left: 25px * 0.5 * 3;
+  }
+  .z-retract-4 {
+    padding-left: 25px * 0.5 * 4;
+  }
+}
+</style>
diff --git a/src/views/modules/shequzhili/xiangmu/cpts/project-info.vue b/src/views/modules/shequzhili/xiangmu/cpts/project-info.vue
index ea9ea60e..8378e920 100644
--- a/src/views/modules/shequzhili/xiangmu/cpts/project-info.vue
+++ b/src/views/modules/shequzhili/xiangmu/cpts/project-info.vue
@@ -100,7 +100,7 @@
                 </el-radio-group>
               </el-form-item>
 
-              <el-form-item label="处理部门：" prop="projectStaffId">
+              <el-form-item label="您的身份：" prop="projectStaffId">
                 <el-select
                   v-model.trim="fmData.projectStaffId"
                   placeholder="请选择"
@@ -116,6 +116,37 @@
                 </el-select>
               </el-form-item>
 
+              <el-form-item
+                v-if="fmData.operateType == 'turn'"
+                label="处理部门："
+                prop="publicReply"
+              >
+                <el-popover
+                  placement="bottom"
+                  width="400"
+                  height="400"
+                  v-model="visibleStaffPanel"
+                >
+                  <div class="f">
+                    <select-staff
+                      @confirm="(ret) => (fmData.staffList = ret)"
+                      @close="visibleStaffPanel = false"
+                    />
+                  </div>
+
+                  <div slot="reference">
+                    <a
+                      v-if="fmData.staffList.length == 0"
+                      style="cursor: pointer"
+                      >点击选择</a
+                    >
+                    <a v-else style="cursor: pointer"
+                      >已选 {{ fmData.staffList.length }} 人</a
+                    >
+                  </div>
+                </el-popover>
+              </el-form-item>
+
               <el-form-item
                 v-if="fmData.operateType != 'back'"
                 label="协办单位："
@@ -338,6 +369,7 @@
 <script>
 import { requestPost } from "@/js/dai/request";
 import foldText from "@/views/components/foldText";
+import selectStaff from "@/views/components/selectStaff";
 import issueInfo from "./issue-info";
 import eventInfo from "./event-info";
 import projectEvaluation from "./project-evaluation";
@@ -370,7 +402,10 @@ function iniData() {
       projectProcessId: "",
 
       closedStatus: "",
+
+      staffList: "",
     },
+    visibleStaffPanel: false,
 
     myDepartmentList: [],
     assistanceUnitList: [],
@@ -470,6 +505,7 @@ export default {
     issueInfo,
     eventInfo,
     projectEvaluation,
+    selectStaff,
   },
 
   data: iniData,
@@ -485,7 +521,7 @@ export default {
             { required: true, message: "处理方式不能为空", trigger: "blur" },
           ],
           projectStaffId: [
-            { required: true, message: "请选择处理部门", trigger: "blur" },
+            { required: true, message: "请选择您的身份", trigger: "blur" },
           ],
         };
       })();
@@ -497,6 +533,10 @@ export default {
           obj.closedStatus = [
             { required: true, message: "请选择结案状态", trigger: "blur" },
           ];
+        } else if (operateType == "turn") {
+          obj.staffList = [
+            { required: true, message: "请选择处理部门", trigger: "blur" },
+          ];
         } else {
           obj.internalRemark = [
             { required: true, message: "请填写内部备注", trigger: "blur" },
@@ -610,7 +650,7 @@ export default {
         this.submitDispose();
       } else if (operateType == "close") {
         this.submitClose();
-      } else if (operateType == "trun") {
+      } else if (operateType == "turn") {
         this.submitTurn();
       } else if (operateType == "back") {
         this.submitBack();
@@ -690,7 +730,7 @@ export default {
 
     //加载组织数据
     async submitTurn() {
-      const url = "/gov/project/trace/return-v2";
+      const url = "/gov/project/trace/transfer-v2";
       const { fmData } = this;
 
       const loading = this.$loading({
@@ -708,6 +748,7 @@ export default {
         projectStaffId: fmData.projectStaffId,
         publicReply: fmData.publicReply,
         internalFile: fmData.internalFile,
+        staffList: fmData.staffList,
       });
 
       loading.close();