diff --git a/src/components/unitGrouping/unitGroupCategory.vue b/src/components/unitGrouping/unitGroupCategory.vue
index fbc77ae..e919967 100644
--- a/src/components/unitGrouping/unitGroupCategory.vue
+++ b/src/components/unitGrouping/unitGroupCategory.vue
@@ -2,7 +2,12 @@
   <div class="examinationcategory">
     <div>
       <span>项目类别</span>
-      <el-select v-model="value" placeholder="请选择" style="margin-left: 20px">
+      <el-select
+        v-model="value"
+        placeholder="请选择"
+        style="margin-left: 20px"
+        @change="getprojectgroups"
+      >
         <el-option
           v-for="item in options"
           :key="item.id"
@@ -14,42 +19,48 @@
     </div>
     <div class="mainarea">
       <div class="mainarealeftbox">
-        <el-table :header-cell-style="{ background: '#eef1f6' }">
-          <el-table-column label="项目类别"></el-table-column>
-          <el-table-column label="未选组合项目"></el-table-column>
+        <el-table
+          :header-cell-style="{ background: '#eef1f6' }"
+          :data="tabledata"
+          @selection-change="handleSelectionChange"
+        >
+          <el-table-column type="selection"></el-table-column>
+          <el-table-column
+            label="未选组合项目"
+            prop="displayName"
+          ></el-table-column>
         </el-table>
       </div>
       <div class="mainbutton">
         <div>
-          <el-button type="primary"
-            >全添加 <i class="el-icon-arrow-right"></i
-            ><i class="el-icon-arrow-right"></i
-          ></el-button>
-        </div>
-        <div>
-          <el-button type="primary" style="margin-top: 10px"
+          <el-button
+            type="primary"
+            style="margin-top: 10px"
+            @click="addselecteditems"
             >添加 <i class="el-icon-arrow-left"></i
           ></el-button>
         </div>
         <div>
-          <el-button type="primary" style="margin-top: 10px"
+          <el-button type="primary" style="margin-top: 10px" @click="removedata"
             >移去 <i class="el-icon-arrow-right"></i
           ></el-button>
         </div>
-        <div>
-          <el-button type="primary" style="margin-top: 10px"
-            >全移去 <i class="el-icon-arrow-left"></i
-            ><i class="el-icon-arrow-left"></i
-          ></el-button>
-        </div>
       </div>
       <!--  -->
       <div class="mainarearightbox">
-        <el-table :header-cell-style="{ background: '#eef1f6' }">
-          <el-table-column label="已选组合项目" width="110"></el-table-column>
-          <el-table-column label="标准价格"></el-table-column>
-          <el-table-column label="折扣"></el-table-column>
-          <el-table-column label="价格"></el-table-column>
+        <el-table
+          :header-cell-style="{ background: '#eef1f6' }"
+          :data="selecteddata"
+          @selection-change="selecteditems"
+        >
+          <el-table-column type="selection"></el-table-column>
+          <el-table-column
+            label="已选组合项目"
+            width="110"
+            prop="displayName"
+          ></el-table-column>
+
+          <el-table-column label="价格" prop="price"></el-table-column>
         </el-table>
       </div>
       <div class="operatebottom">
@@ -102,7 +113,7 @@
         <el-table-column label="创建者"></el-table-column>
         <el-table-column label="创建时间"></el-table-column>
         <el-table-column label="修改者"></el-table-column>
-         <el-table-column label="修改时间"></el-table-column>
+        <el-table-column label="修改时间"></el-table-column>
       </el-table>
       <span slot="footer" class="dialog-footer">
         <el-button @click="copyGroupdialogVisible = false">取 消</el-button>
@@ -116,23 +127,93 @@
 </template>
 <script>
 import { getapi } from "@/api/api";
+import { mapState } from "vuex";
 export default {
   data() {
     return {
+      selecteddata: [], //已选数据
+      unselecteddata: [], //未选数据
+      unselecteddata: [], //右边勾选中
       options: [],
       value: "",
       dialogVisible: false,
       copyGroupdialogVisible: false,
       packagelist: [],
+      tabledata: [],
+      temporaryselection: [],
+      copegroupdata: [], //复制分组
     };
   },
+  computed: {
+    ...mapState(["personnelUnit"]),
+  },
   created() {
     this.getitemtype();
+    this.getportfolioitems();
   },
   methods: {
+    //添加按钮
+    addselecteditems() {
+      console.log(this.temporaryselection);
+      if (this.temporaryselection.length == 0) {
+        this.$message.warning("已选数据为空无法移动");
+      } else {
+        let count = this.temporaryselection.length - 1;
+        for (var i = count; i >= 0; i--) {
+          this.temporaryselection.splice(i, 1);
+          this.tabledata.push(this.temporaryselection[i]);
+        }
+      }
+    },
+    //右侧勾选按钮
+    selecteditems(val) {
+      this.temporaryselection = val;
+      console.log(this.temporaryselection);
+    },
+    // 移去按钮
+    removedata() {
+      if (this.unselecteddata.length == 0) {
+        this.$message.warning("未选数据为空无法移动");
+      } else {
+        let count = this.unselecteddata.length - 1;
+        for (var i = count; i >= 0; i--) {
+          this.tabledata.splice(i, 1);
+          this.selecteddata.push(this.unselecteddata[i]);
+        }
+        // this.selecteddata = this.unselecteddata;
+      }
+    },
+    // 左侧未选
+    handleSelectionChange(val) {
+      // this.selecteddata = val;
+      this.unselecteddata = val;
+      console.log(this.unselecteddata);
+    },
+    //获取所有组合项目
+    getportfolioitems() {
+      getapi("/api/app/asbitem/in-filter?Filter").then((res) => {
+        this.tabledata = res.data.items;
+      });
+    },
+    //项目类别选择
+    getprojectgroups(v) {
+      getapi(`/api/app/asbitem/in-item-type/${v}`).then((res) => {
+        this.tabledata = res.data;
+        console.log(res);
+      });
+    },
     //复制分组弹框
     copygroup() {
-      this.copyGroupdialogVisible = true;
+      if (this.personnelUnit.form == "") {
+        this.$message.warning("请选择分组");
+      } else {
+        this.copyGroupdialogVisible = true;
+        getapi(
+          `/api/app/customer-org-group-detail/customer-org-group-detail-in-asbitem?CustomerOrgGroupId=${this.personnelUnit.form.id}`
+        ).then((res) => {
+          console.log(res);
+        });
+      }
     },
     //复制套餐
     packagerepicion() {
diff --git a/src/components/unitGrouping/unitGroupingTable.vue b/src/components/unitGrouping/unitGroupingTable.vue
index d0a9954..362cf02 100644
--- a/src/components/unitGrouping/unitGroupingTable.vue
+++ b/src/components/unitGrouping/unitGroupingTable.vue
@@ -1,60 +1,353 @@
 <template>
   <div style="display: flex">
-    <el-table :data="tableData" style="width: 100%">
-      <el-table-column prop="index" label="序号" width=""> </el-table-column>
-      <el-table-column prop="groupnumber" label="分组编号" width="">
+    <el-table
+      :data="personnelUnit.personnelgrouping"
+      style="width: 100%"
+      row-key="id"
+      highlight-current-row
+      @row-click="clickoncolumn"
+      class="el-table__body-wrapper tbody"
+    >
+      <el-table-column type="index" label="序号" width=""> </el-table-column>
+      <el-table-column prop="displayName" label="名称" width="">
+      </el-table-column>
+
+      <el-table-column prop="creatorName" label="创建者"> </el-table-column>
+      <el-table-column prop="" label="创建时间">
+        <template slot-scope="scope">
+          {{ scope.row.creationTime | dateFormat }}
+        </template>
+      </el-table-column>
+
+      <el-table-column prop="forSexId" label="性别"> </el-table-column>
+      <el-table-column prop="maritalStatusId" label="婚姻状况">
       </el-table-column>
-      <el-table-column prop="groupname" label="分组名称"> </el-table-column>
-      <el-table-column prop="sex" label="性别"> </el-table-column>
-      <el-table-column prop="maritalstatus" label="婚姻状况"> </el-table-column>
       <el-table-column prop="price" label="价格"> </el-table-column>
+      <el-table-column label="操作">
+        <template>
+          <el-tag
+            class="move"
+            style="cursor: move; margin-left: 15px"
+            draggable="true"
+          >
+            <i class="el-icon-d-caret" style="width: 1rem; height: 1rem"></i>
+          </el-tag>
+        </template>
+      </el-table-column>
     </el-table>
     <div style="margin-top: 3%; margin-left: 10px">
       <div style="margin-left: 10px; margin-top: 5%">
         <div style="margin-top: 10px">
-          <el-button type="primary">新增</el-button>
+          <el-button type="primary" @click="groupaddtion">新增</el-button>
         </div>
         <div style="margin-top: 10px">
-          <el-button type="success">编辑</el-button>
+          <el-button type="success" @click="editgroup">编辑</el-button>
         </div>
         <div style="margin-top: 10px">
-          <el-button type="danger">删除</el-button>
+          <el-button type="danger" @click="deletegroup">删除</el-button>
+        </div>
+        <div style="margin-top: 10px">
+          <el-button type="primary" @click="topping">置顶</el-button>
+        </div>
+        <div style="margin-top: 10px">
+          <el-button type="primary" @click="bottoming">置低</el-button>
+        </div>
+        <div style="margin-top: 10px">
+          <el-button type="primary" @click="sortok" :disabled="isshow"
+            >确定</el-button
+          >
         </div>
       </div>
     </div>
+    <!-- 新增或者编辑弹框 -->
+    <el-dialog
+      :title="title == '1' ? '新增' : '编辑'"
+      :visible.sync="dialogVisible"
+      width="50%"
+    >
+      <el-form :model="form" label-width="80px">
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="分组名称">
+              <el-input v-model="form.displayName"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="价格">
+              <el-input v-model="form.price"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="适用性别">
+              <el-select v-model="form.forSexId" placeholder="请选择">
+                <el-option
+                  v-for="item in forSexId"
+                  :key="item.id"
+                  :label="item.displayName"
+                  :value="item.id"
+                >
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="婚姻状况">
+              <el-select v-model="form.maritalStatusId" placeholder="请选择">
+                <el-option
+                  v-for="item in maritalStatusId"
+                  :key="item.id"
+                  :label="item.displayName"
+                  :value="item.id"
+                >
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="年龄下限">
+              <el-input v-model="form.ageLowerLimit"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="年龄上限">
+              <el-input v-model="form.ageUpperLimit"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="适用职务">
+              <el-input v-model="form.jobPost"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="适用职称">
+              <el-input v-model="form.jobTitle"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="备注">
+              <el-input v-model="form.remark"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="Onsubmint">确 定</el-button>
+      </span>
+    </el-dialog>
+    <!--  -->
   </div>
 </template>
 <script>
-import { mapGetters } from "vuex";
+import Sortable from "sortablejs";
+import { getapi, postapi, putapi, deletapi } from "@/api/api";
+import { mapState } from "vuex";
 export default {
   data() {
     return {
-      tableData: [
-        {
-          index: "2",
-          groupnumber: "33",
-          groupname: "全部",
-          sex: "男",
-          maritalstatus: "未婚",
-          price: "0",
-        },
-        {
-          index: "1",
-          groupnumber: "2fd",
-          groupname: "全部",
-          sex: "女",
-          maritalstatus: "已婚",
-          price: "0",
-        },
-      ],
+      isshow: true,
+      title: 1,
+      form: {
+        displayName: "",
+        price: "",
+        forSexId: "",
+        maritalStatusId: "",
+        ageLowerLimit: "",
+        ageUpperLimit: "",
+        jobPost: "",
+        jobTitle: "",
+        remark: "",
+      },
+      forSexId: [], //性别id
+      maritalStatusId: [], //婚姻状况
+      dialogVisible: false,
+      tableData: [],
+      initTableData: [],
+      // tableData: [
+
+      // ],
     };
   },
   computed: {
-    ...mapGetters(["customerOrg"]),
+    ...mapState(["personnelUnit"]),
+  },
+  created() {
+    this.rowDrop();
   },
   mounted() {
-    console.log(customerOrg.personnelgrouping);
+    //console.log('00000',this.personnelUnit.id);
+  },
+  methods: {
+    //确定排序
+    sortok() {
+      const result = [];
+      this.tableData.forEach((item, index) => {
+        // index 从0开始的， 你的displayOrder从大到小排
+        console.log(item.id);
+        // const currentDisplayOrder = this.tableData.length -1
+        const currentDisplayOrder = this.initTableData[index].displayOrder;
+        if (item.displayOrder != currentDisplayOrder) {
+          // 如果它的displayOrder和它当前所在的位置不同代表挪动过位置
+          result.push({ id: item.id, displayOrder: currentDisplayOrder });
+        }
+      });
+      putapi("/api/app/customerorggroup/updatesortmany", {
+        itemList: result,
+      }).then((res) => {
+        this.$message.success("操作成功");
+        this.isshow = true;
+        this.getlist();
+      });
+    },
+    //初始化Sortable组件
+    rowDrop() {
+      this.$nextTick(() => {
+        const tbody = document.querySelector(".el-table__body-wrapper tbody");
+        const _this = this;
+        Sortable.create(tbody, {
+          handle: ".move",
+          animation: 300,
+          onEnd({ newIndex, oldIndex }) {
+            _this.isshow = false;
+            const currRow = _this.tableData.splice(oldIndex, 1)[0];
+            _this.tableData.splice(newIndex, 0, currRow);
+            _this.tableData.map((item, index) => {
+              if (index == newIndex && index == oldIndex) {
+              } else if (index == oldIndex) {
+              } else if (index == newIndex) {
+              }
+            });
+            console.log(_this.tableData.map((item) => item.displayOrder));
+          },
+        });
+      });
+    },
+    getlist() {
+      getapi(
+        `/api/app/customer-org-group/in-customer-org-id/${this.personnelUnit.id}`
+      ).then((res) => {
+        this.tableData = res.data;
+        this.personnelUnit.personnelgrouping = res.data;
+        this.initTableData = [...res.data];
+        // console.log( this.personnelUnit.personnelgrouping);
+      });
+    },
+    //置低
+    bottoming() {
+      if (this.form.id == undefined) {
+        this.$message.warning("请选择操作的数据");
+      } else {
+        putapi(
+          `/api/app/customerorggroup/updatemanysort?id=${this.form.id}&SortType=2`
+        ).then((res) => {
+          this.$message.success("操作成功");
+          this.getlist();
+        });
+      }
+    },
+    //置顶
+    topping() {
+      if (this.form.id == undefined) {
+        this.$message.warning("请选择操作的数据");
+      } else {
+        putapi(
+          `/api/app/customerorggroup/updatemanysort?id=${this.form.id}&SortType=1`
+        ).then((res) => {
+          this.$message.success("操作成功");
+          this.getlist();
+        });
+      }
+    },
+    //删除
+    deletegroup() {
+      if (this.form.id == undefined) {
+        this.$message.warning("请选择需要操作的数据");
+      } else {
+        deletapi(`/api/app/customer-org-group/${this.form.id}`).then((res) => {
+          this.$message.success("删除成功");
+        });
+      }
+    },
+    //点击当前列
+    clickoncolumn(row) {
+      getapi(`/api/app/customer-org-group/${row.id}`).then((res) => {
+        this.form = res.data;
+        this.personnelUnit.form=res.data
+      });
+     
+      //
+      getapi(`/api/app/customer-org-group-detail/customer-org-group-detail-in-asbitem?CustomerOrgGroupId=${this.personnelUnit.id}`).then(res=>{
+        console.log(res,'我是分组');
+      })
+    },
+    //编辑弹框
+    editgroup() {
+      this.title = 2;
+      this.obtainsuperior();
+      this.dialogVisible = true;
+    },
+    //获取性别和婚姻状况
+    obtainsuperior() {
+      //获取性别
+      getapi("/api/app/sex").then((res) => {
+        this.forSexId = res.data;
+      });
+      //获取婚姻状况
+      getapi("/api/app/marital-statuses").then((res) => {
+        this.maritalStatusId = res.data.items;
+        console.log(res);
+      });
+    },
+    Onsubmint() {
+      if (this.title == 1) {
+        let obj = {
+          displayName: this.form.displayName,
+          price: Number(this.form.price),
+          forSexId: this.form.forSexId,
+          maritalStatusId: this.form.maritalStatusId,
+          ageLowerLimit: Number(this.form.ageLowerLimit),
+          ageUpperLimit: Number(this.form.ageUpperLimit),
+          jobPost: this.form.jobPost,
+          jobTitle: this.form.jobTitle,
+          remark: this.form.remark,
+        };
+        postapi(
+          `/api/app/customer-org-group/in-customer-org-id/${this.personnelUnit.id}`,
+          obj
+        ).then((res) => {
+          this.$message.success("新增成功");
+          this.dialogVisible = false;
+        });
+      } else if (this.title == 2) {
+        let obj = {
+          displayName: this.form.displayName,
+          price: Number(this.form.price),
+          forSexId: this.form.forSexId,
+          maritalStatusId: this.form.maritalStatusId,
+          ageLowerLimit: Number(this.form.ageLowerLimit),
+          ageUpperLimit: Number(this.form.ageUpperLimit),
+          jobPost: this.form.jobPost,
+          jobTitle: this.form.jobTitle,
+          remark: this.form.remark,
+        };
+        putapi(`/api/app/customer-org-group/${this.form.id}`, obj).then(
+          (res) => {
+            this.$message.success("修改成功");
+            this.dialogVisible = false;
+          }
+        );
+      }
+    },
+    //新增弹框
+    groupaddtion() {
+      if (this.personnelUnit.id == "") {
+        this.$message.warning("请选择单位");
+      } else {
+        this.dialogVisible = true;
+        this.title = 1;
+        this.obtainsuperior();
+      }
+    },
   },
-  methods: {},
 };
 </script>
\ No newline at end of file
diff --git a/src/store/index.js b/src/store/index.js
index 35ccec3..5f6f154 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -22,6 +22,8 @@ export default new Vuex.Store({
     },
     personnelUnit:{
       personnelgrouping:[], //人员分组
+      id:'',//根据Id选择的数据
+      form:'',//列表每一项
     },
 
     //体检人员登记 add by pengjun
diff --git a/src/views/customerOrg/customerOrgGroup.vue b/src/views/customerOrg/customerOrgGroup.vue
index 75b4e61..71146d9 100644
--- a/src/views/customerOrg/customerOrgGroup.vue
+++ b/src/views/customerOrg/customerOrgGroup.vue
@@ -28,7 +28,7 @@
 <script>
 import CustomerOrgTree from "../../components/unitGrouping/unitGroupingTable.vue";
 import UnitGroupCategory from "../../components/unitGrouping/unitGroupCategory.vue";
-import {mapState} from 'vuex'
+import { mapState } from "vuex";
 import { getapi } from "@/api/api";
 export default {
   components: {
@@ -41,21 +41,24 @@ export default {
       value: "",
     };
   },
-  computed:{
-     ...mapState['customerOrg']
+  computed: {
+    ...mapState(["personnelUnit"]),
   },
   created() {
     this.getitemtype();
   },
   methods: {
     secltchang(v) {
+      this.personnelUnit.id=v
       //let that=this
-            console.log(this.customerOrg);
-      getapi(`/api/app/customer-org-group/in-customer-org-id/${v}`).then(res=>{       
-      //  this.customerOrg.personnelgrouping=res.data
-      // console.log(res.data);
-      // console.log(that.customerOrg.personnelgrouping);
-      })
+      console.log(this.customerOrg);
+      getapi(`/api/app/customer-org-group/in-customer-org-id/${v}`).then(
+        (res) => {
+          this.personnelUnit.personnelgrouping = res.data;
+          // console.log(res.data);
+          // console.log(that.customerOrg.personnelgrouping);
+        }
+      );
       console.log(v);
     },
     //获取单位列表