From 0847c5e398603ac92065056a40799f713313c076 Mon Sep 17 00:00:00 2001
From: mch <1332099529@qq.com>
Date: Thu, 29 Jun 2023 16:21:54 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BD=93=E6=A3=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../unitGrouping/unitGroupCategory.vue        |  95 ++++++--
 .../unitGrouping/unitGroupingTable.vue        | 216 +++++++++++++++---
 2 files changed, 255 insertions(+), 56 deletions(-)

diff --git a/src/components/unitGrouping/unitGroupCategory.vue b/src/components/unitGrouping/unitGroupCategory.vue
index fbc77ae..0a2d5d4 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,45 @@
     </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"
             >添加 <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 +110,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>
@@ -119,17 +127,58 @@ import { getapi } from "@/api/api";
 export default {
   data() {
     return {
+      selecteddata: [], //已选数据
+      unselecteddata: [], //未选数据
+      unselecteddata: [], //右边勾选中
       options: [],
       value: "",
       dialogVisible: false,
       copyGroupdialogVisible: false,
       packagelist: [],
+      tabledata: [],
     };
   },
   created() {
     this.getitemtype();
+    this.getportfolioitems();
   },
   methods: {
+    selecteditems(val) {
+      this.temporaryselection = val;
+      console.log(val);
+    },
+    // 移去按钮
+    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;
diff --git a/src/components/unitGrouping/unitGroupingTable.vue b/src/components/unitGrouping/unitGroupingTable.vue
index ffd4546..8eb8329 100644
--- a/src/components/unitGrouping/unitGroupingTable.vue
+++ b/src/components/unitGrouping/unitGroupingTable.vue
@@ -1,13 +1,39 @@
 <template>
   <div style="display: flex">
-    <el-table :data="personnelUnit.personnelgrouping" style="width: 100%">
-      <el-table-column prop="index" label="序号" width=""> </el-table-column>
-      <el-table-column prop="displayName" 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%">
@@ -18,7 +44,18 @@
           <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>
@@ -102,11 +139,13 @@
   </div>
 </template>
 <script>
-import { getapi, postapi } from "@/api/api";
+import Sortable from "sortablejs";
+import { getapi, postapi, putapi, deletapi } from "@/api/api";
 import { mapState } from "vuex";
 export default {
   data() {
     return {
+      isshow: true,
       title: 1,
       form: {
         displayName: "",
@@ -122,36 +161,123 @@ export default {
       forSexId: [], //性别id
       maritalStatusId: [], //婚姻状况
       dialogVisible: false,
-      tableData: [
-        {
-          index: "2",
-          groupnumber: "33",
-          groupname: "全部",
-          sex: "男",
-          maritalstatus: "未婚",
-          price: "0",
-        },
-        {
-          index: "1",
-          groupnumber: "2fd",
-          groupname: "全部",
-          sex: "女",
-          maritalstatus: "已婚",
-          price: "0",
-        },
-      ],
+      tableData: [],
+      initTableData: [],
+      // tableData: [
+
+      // ],
     };
   },
   computed: {
     ...mapState(["personnelUnit"]),
   },
   created() {
-   
+     this.rowDrop();
   },
-  mounted() {    
+  mounted() {
     //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];
+      });
+    },
+    //置低
+    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;
+      });
+      //获取已选组合项目列表
+      getapi(`/api/app/customer-org-group-detail/customer-org-group-detail-in-asbitem?CustomerOrgGroupId=${this.form.id}`).then(res=>{
+        console.log(res,'ssssss');
+      })
+    },
     //编辑弹框
     editgroup() {
       this.title = 2;
@@ -183,18 +309,42 @@ export default {
           jobTitle: this.form.jobTitle,
           remark: this.form.remark,
         };
-        postapi("/api/app/customer-org-group", obj).then((res) => {
+        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() {
-      console.log(this.personnelUnit.id);
-      this.dialogVisible = true;
-      this.title = 1;
-      this.obtainsuperior();
+      if (this.personnelUnit.id == "") {
+        this.$message.warning("请选择单位");
+      } else {
+        this.dialogVisible = true;
+        this.title = 1;
+        this.obtainsuperior();
+      }
     },
   },
 };